|
|
@@ -1,19 +1,7 @@
|
|
|
<template>
|
|
|
<CustomNav title="首页" leftType="scan" @scan="handleScan" />
|
|
|
<view class="content">
|
|
|
- <!-- 轮播图 -->
|
|
|
- <swiper class="banner-swiper" :indicator-dots="true" :autoplay="true" :interval="3000" :circular="true">
|
|
|
- <swiper-item v-for="(img, idx) in bannerImages" :key="idx">
|
|
|
- <image :src="img" class="banner-img" mode="aspectFill" />
|
|
|
- </swiper-item>
|
|
|
- </swiper>
|
|
|
- <!-- 卡片列表 -->
|
|
|
- <view class="card-list">
|
|
|
- <view class="card" v-for="(card, idx) in cards" :key="idx">
|
|
|
- <view class="card-title">{{ card.title }}</view>
|
|
|
- <view class="card-desc">{{ card.desc }}</view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
+
|
|
|
</view>
|
|
|
<TabBar />
|
|
|
</template>
|
|
|
@@ -23,26 +11,10 @@ import { ref } from 'vue'
|
|
|
import CustomNav from '@/components/custom-nav.vue'
|
|
|
import TabBar from '@/components/tab-bar.vue'
|
|
|
|
|
|
-const title = ref('Hello')
|
|
|
-
|
|
|
-const bannerImages = [
|
|
|
- '/static/carousel/BHFIIABBCDJII-5kCEkD6zh9.png',
|
|
|
- '/static/carousel/BHFIIABBDGHEA-wtWLrLS75o.png',
|
|
|
- '/static/carousel/BHFIIABBHJBAH-yDeckRiiQP.png'
|
|
|
-]
|
|
|
-
|
|
|
-const cards = [
|
|
|
- { title: '健康档案', desc: '管理您的健康信息' },
|
|
|
- { title: '慢病管理', desc: '查看慢病相关数据' },
|
|
|
- { title: '健康咨询', desc: '在线咨询医生' },
|
|
|
- { title: '用药提醒', desc: '设置用药提醒' }
|
|
|
-]
|
|
|
-
|
|
|
function handleScan(res: any) {
|
|
|
console.log('[index] scan result', res)
|
|
|
const resultText = res?.result || ''
|
|
|
if (resultText) {
|
|
|
- // 简单演示:弹出内容,实际可根据业务解析并跳转
|
|
|
uni.showToast({ title: String(resultText), icon: 'none', duration: 2000 })
|
|
|
} else {
|
|
|
uni.showToast({ title: '未识别到有效内容', icon: 'none' })
|
|
|
@@ -50,82 +22,4 @@ function handleScan(res: any) {
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
-<style>
|
|
|
-.content {
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- align-items: center;
|
|
|
- justify-content: flex-start;
|
|
|
- padding-top: calc(var(--status-bar-height) + 44px);
|
|
|
- height: calc(100vh - var(--status-bar-height) - 44px);
|
|
|
- background: #f7f8fa;
|
|
|
-}
|
|
|
-
|
|
|
-.banner-swiper {
|
|
|
- width: 670rpx;
|
|
|
- max-width: 100vw;
|
|
|
- height: 400rpx;
|
|
|
- margin: 20rpx auto 30rpx auto;
|
|
|
- border-radius: 16rpx;
|
|
|
- overflow: hidden;
|
|
|
- box-shadow: 0 2rpx 8rpx rgba(0,0,0,0.08);
|
|
|
- background: #fff;
|
|
|
-}
|
|
|
-
|
|
|
-.banner-img {
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
- display: block;
|
|
|
-}
|
|
|
-
|
|
|
-.card-list {
|
|
|
- width: 90%;
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- gap: 32rpx;
|
|
|
- padding: 0 40rpx;
|
|
|
- margin: 0 auto;
|
|
|
-}
|
|
|
-
|
|
|
-.card {
|
|
|
- /* 不设置width,宽度由父容器控制 */
|
|
|
- background: #fff;
|
|
|
- border-radius: 16rpx;
|
|
|
- box-shadow: 0 2rpx 8rpx rgba(0,0,0,0.06);
|
|
|
- padding: 40rpx 32rpx;
|
|
|
- box-sizing: border-box;
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
-}
|
|
|
-
|
|
|
-.card-title {
|
|
|
- font-size: 36rpx;
|
|
|
- font-weight: bold;
|
|
|
- color: #333;
|
|
|
- margin-bottom: 16rpx;
|
|
|
-}
|
|
|
-
|
|
|
-.card-desc {
|
|
|
- font-size: 28rpx;
|
|
|
- color: #888;
|
|
|
-}
|
|
|
-
|
|
|
-/* .logo {
|
|
|
- height: 200rpx;
|
|
|
- width: 200rpx;
|
|
|
- margin-top: 200rpx;
|
|
|
- margin-left: auto;
|
|
|
- margin-right: auto;
|
|
|
- margin-bottom: 50rpx;
|
|
|
-} */
|
|
|
-
|
|
|
-.text-area {
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
-}
|
|
|
-
|
|
|
-.title {
|
|
|
- font-size: 36rpx;
|
|
|
- color: #8f8f94;
|
|
|
-}
|
|
|
-</style>
|
|
|
+<style></style>
|