gdxz/uniapp-app
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

first commit

Browse Source
This commit is contained in:
zoujiandong
2025-08-14 17:02:24 +08:00
commit 2903884922
160 changed files with 8678 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
pages/my/my.vue
+632
View File
@@ -0,0 +1,632 @@
<template>
<uni-nav-bar title="我的" fixed color="#8B2316" height="140rpx" :border="false" backgroundColor="#eeeeee"></uni-nav-bar>
<view class="page">
<!-- 用户信息卡片 -->
<view class="user-card">
<view class="user-info">
<image class="avatar" src="/static/avatar_default.png" mode="aspectFill"></image>
<text class="username">邹建东</text>
</view>
<!-- 统计数据 -->
<view class="stats-section">
<view class="stats-item">
<text class="stats-number">5</text>
<text class="stats-label">随访患者数</text>
</view>
<view class="stats-item">
<text class="stats-number">0</text>
<text class="stats-label">公益咨询数</text>
</view>
<view class="stats-item">
<text class="stats-number">0</text>
<text class="stats-label">患者送花数</text>
</view>
<view class="divder"></view>
<view class="signbox">
<view class="sign">签到</view>
</view>
</view>
</view>
<!-- 随访服务 -->
<view class="section">
<view class="section-title">随访服务</view>
<up-scroll-list indicatorActiveColor="#8B2316" indicatorWidth="40rpx" indicatorBarWidth="20rpx" class="service-grid">
<view class="service-item" @click="goToPage('patientAudit')">
<up-image :src="hzshImg" width="48rpx" height="48rpx" ></up-image>
<text>患者审核</text>
</view>
<view class="service-item" @click="goToPage('patientGroup')">
<up-image :src="hzfzImg" width="48rpx" height="48rpx" ></up-image>
<text>患者分组</text>
</view>
<view class="service-item" @click="goToPage('groupMessage')">
<up-image :src="qfxxImg" width="48rpx" height="48rpx" ></up-image>
<text>群发消息</text>
</view>
<view class="service-item" @click="goToPage('qrcode')">
<up-image :src="sfImg" width="48rpx" height="48rpx" ></up-image>
<text>随访二维码</text>
</view>
<view class="service-item" @click="goToPage('qrcode')">
<up-image :src="czjhImg" width="48rpx" height="48rpx" ></up-image>
<text>出诊计划</text>
</view>
</up-scroll-list>
</view>
<!-- 学习进步 -->
<view class="section">
<view class="section-title">学习进步</view>
<view class="learning-grid">
<view class="learning-item" @click="goToPage('myVideos')">
<up-image :src="wdspImg" width="48rpx" height="48rpx" ></up-image>
<text>我的视频</text>
</view>
<view class="learning-item" @click="goToPage('myCourses')">
<up-image :src="wdkcImg" width="48rpx" height="48rpx" ></up-image>
<text>我的课程</text>
</view>
<view class="learning-item" @click="goToPage('myDownloads')">
<up-image :src="wdxzImg" width="48rpx" height="48rpx" ></up-image>
<text>我的下载</text>
</view>
<view class="learning-item" @click="goToPage('myFavorites')">
<up-image :src="wdscImg" width="48rpx" height="48rpx" ></up-image>
<text>我的收藏</text>
</view>
</view>
</view>
<!-- 账户明细 -->
<view class="section">
<view class="section-title">账户明细</view>
<up-scroll-list indicatorActiveColor="#8B2316" indicatorWidth="40rpx" indicatorBarWidth="20rpx" class="account-grid">
<view class="account-item" @click="goToPage('myAccount')">
<up-image :src="wdzzImg" width="48rpx" height="48rpx" ></up-image>
<text>我的账户</text>
</view>
<view class="account-item" @click="goToPage('myPoints')">
<up-image :src="wdjfImg" width="48rpx" height="48rpx" ></up-image>
<text>我的积分</text>
</view>
<view class="account-item" @click="goToPage('myBenefits')">
<up-image :src="wdflImg" width="48rpx" height="48rpx" ></up-image>
<text>我的福利</text>
</view>
<view class="account-item" @click="goToPage('myReviews')">
<up-image :src="wdxhImg" width="48rpx" height="48rpx" ></up-image>
<text>我的鲜花</text>
</view>
<view class="account-item" @click="goToPage('myReviews')">
<up-image :src="kjmxImg" width="48rpx" height="48rpx" ></up-image>
<text>课件明细</text>
</view>
<view class="account-item" @click="goToPage('myReviews')">
<up-image :src="kcmxImg" width="48rpx" height="48rpx" ></up-image>
<text>课程明细</text>
</view>
<view class="account-item" @click="goToPage('myReviews')">
<up-image :src="sxyImg" width="48rpx" height="48rpx" ></up-image>
<text>送心意</text>
</view>
</up-scroll-list>
</view>
<!-- 常用操作 -->
<view class="section">
<view class="section-title">常用操作</view>
<view class="operation-grid">
<view class="operation-item" @click="goToPage('wechatUnbind')">
<up-image :src="wxjbImg" width="48rpx" height="48rpx" ></up-image>
<text>微信解绑</text>
</view>
<view class="operation-item" @click="goToPage('changePhone')">
<up-image :src="ghsjhImg" width="48rpx" height="48rpx" ></up-image>
<text>更换手机号</text>
</view>
<view class="operation-item" @click="goToPage('notifications')">
<up-image :src="tzykImg" width="48rpx" height="48rpx" ></up-image>
<text>通知已开</text>
</view>
<view class="operation-item" @click="showVersion">
<up-image :src="versionImg" width="48rpx" height="48rpx" ></up-image>
<text>V4.1.4</text>
</view>
</view>
</view>
<view class="setbox">
<!-- 福利卡兑换 -->
<view class="sectioncell benefit-section">
<view class="benefit-item" @click="goToPage('benefitExchange')">
<view class="benefit-icon">
<up-image :src="fulicard" width="48rpx" height="48rpx"></up-image>
</view>
<view class="benefit-content">
<text class="benefit-title">福利卡兑换</text>
</view>
<view class="benefit-arrow">
<uni-icons type="forward" size="16" color="#ccc"></uni-icons>
</view>
</view>
</view>
<!-- 发票管理 -->
<view class="sectioncell invoice-section">
<view class="invoice-item" @click="goToPage('invoiceManage')">
<view class="invoice-icon">
<up-image :src="fpgl" width="48rpx" height="48rpx"></up-image>
</view>
<view class="invoice-content">
<text class="invoice-title">发票管理</text>
</view>
<view class="invoice-arrow">
<uni-icons type="forward" size="16" color="#ccc"></uni-icons>
</view>
</view>
</view>
<!-- 常用银行卡 -->
<view class="sectioncell bank-section">
<view class="bank-item" @click="goToPage('bankCard')">
<view class="bank-icon">
<up-image :src="cyyhk" width="48rpx" height="48rpx"></up-image>
</view>
<view class="bank-content">
<text class="bank-title">常用银行卡</text>
</view>
<view class="bank-arrow">
<uni-icons type="forward" size="16" color="#ccc"></uni-icons>
</view>
</view>
</view>
<!-- 设置与帮助 -->
<view class="sectioncell settings-section">
<view class="settings-item" @click="goToPage('settings')">
<view class="settings-icon">
<up-image :src="settingImg" width="48rpx" height="48rpx"></up-image>
</view>
<view class="settings-content">
<text class="settings-title">设置与帮助</text>
</view>
<view class="settings-arrow">
<uni-icons type="forward" size="16" color="#ccc"></uni-icons>
</view>
</view>
</view>
</view>
<!-- 年度总结悬浮按钮 -->
<view class="year-summary-btn" @click="showYearSummary">
<view class="year-text">2024</view>
<view class="summary-text">年度总结</view>
</view>
<!-- 底部导航栏 -->
<CustomTabbar></CustomTabbar>
</view>
</template>
<script setup>
import CustomTabbar from '@/compoents/tabBar/tabBar.vue';
import { ref } from 'vue';
import { onShow } from "@dcloudio/uni-app";
import hzshImg from "@/static/hzsh.png"
import hzfzImg from "@/static/hzfz.png"
import qfxxImg from "@/static/qfxz.png"
import sfImg from "@/static/sfewm.png"
import czjhImg from "@/static/czjh.png"
import wdspImg from "@/static/wdsp.png"
import wdkcImg from "@/static/wdkc.png"
import wdxzImg from "@/static/wdxz.png"
import wdscImg from "@/static/wdsc.png"
import wdzzImg from "@/static/wdzh.png"
import wdjfImg from "@/static/wdjf.png"
import wdflImg from "@/static/wdfl.png"
import wdxhImg from "@/static/wdxh.png"
import kjmxImg from "@/static/kjmx.png"
import kcmxImg from "@/static/kcmx.png"
import sxyImg from "@/static/sxy.png"
import wxjbImg from "@/static/wxjb.png"
import ghsjhImg from "@/static/ghsjh.png"
import tzykImg from "@/static/xxtx.png"
import versionImg from "@/static/fxxbb.png"
import fulicard from "@/static/fulicard.png"
import fpgl from "@/static/fpgl.png"
import cyyhk from "@/static/cyhhk.png"
import settingImg from "@/static/setting.png"
// 响应式数据
const isLargeFont = ref(false);
// 方法
const toggleFontSize = () => {
isLargeFont.value = !isLargeFont.value;
console.log('切换字体大小:', isLargeFont.value ? '大字版' : '普通版');
};
const checkin = () => {
console.log('签到');
uni.showToast({
title: '签到成功',
icon: 'success'
});
};
const goToPage = (page) => {
console.log('跳转到页面:', page);
// 根据页面名称进行跳转
switch(page) {
case 'index':
uni.switchTab({
url: '/pages/index/index'
});
break;
case 'patientClass':
uni.switchTab({
url: '/pages_app/patientClass/patientClass'
});
break;
case 'benefitExchange':
uni.showToast({
title: '福利卡兑换功能开发中',
icon: 'none'
});
break;
case 'invoiceManage':
uni.showToast({
title: '发票管理功能开发中',
icon: 'none'
});
break;
case 'bankCard':
uni.showToast({
title: '常用银行卡功能开发中',
icon: 'none'
});
break;
case 'settings':
uni.showToast({
title: '设置与帮助功能开发中',
icon: 'none'
});
break;
default:
uni.showToast({
title: '功能开发中',
icon: 'none'
});
}
};
const showYearSummary = () => {
console.log('显示年度总结');
uni.showToast({
title: '年度总结功能开发中',
icon: 'none'
});
};
const showVersion = () => {
uni.showModal({
title: '版本信息',
content: '当前版本：V4.1.4',
showCancel: false
});
};
onShow(() => {
console.log('我的页面显示');
});
</script>
<style lang="scss" scoped>
// 颜色变量
$primary-color: #ff6b6b;
$theme-color: #8B2316;
$cyan-color: #00CED1;
$white: #fff;
$gray-bg: #f5f5f5;
$gray-light: #eee;
$gray-medium: #999;
$gray-dark: #666;
$text-color: #333;
// 尺寸变量
$border-radius: 8px;
$border-radius-small: 6px;
$padding: 15px;
$padding-small: 10px;
.page {
background-color: $gray-bg;
height: calc(100vh - 140rpx);
overflow-y: scroll;
padding-bottom: 100rpx;
}
// 用户信息卡片
.user-card {
background: url('@/static/big_background_my.png') no-repeat 0 0;
height:310rpx;
padding:0 30rpx;
background-size: cover;
position: relative;
margin-bottom: 67rpx;
.user-info {
padding-top: 30rpx;
display: flex;
align-items: center;
gap: 20rpx;
margin-bottom: 40rpx;
.avatar {
width: 120rpx;
height: 120rpx;
border-radius: 10rpx;
}
.username {
color: $white;
font-size: 36rpx;
font-weight: bold;
}
}
.stats-section {
position: relative;
background-color: $white;
border-radius: $border-radius;
padding: 30rpx;
display: flex;
justify-content: space-around;
margin-bottom: 20rpx;
.divder{
width:2rpx;
height:50rpx;
margin-top: 32rpx;
margin-left:10rpx;
margin-right: 150rpx;
background-color: #999;
}
.signbox{
position:absolute;
right:0;
top:54rpx;
width:160rpx;
height: 56rpx;
display: flex;
align-items: center;
border-radius:30rpx 0 0 30rpx;
background:#fc564a url("@/static/qd1_bg.9.png")no-repeat 0 0;
background-size:57rpx 56rpx;
.sign{
margin-left: 60rpx;
font-size: 28rpx;
color:#fff;
}
}
.stats-item {
display: flex;
flex-direction: column;
align-items: center;
gap: 10rpx;
.stats-number {
font-size: 48rpx;
color: $text-color;
}
.stats-label {
font-size: 24rpx;
color: $text-color;
}
}
}
.checkin-btn {
position: absolute;
top: 30rpx;
right: 30rpx;
background-color: $theme-color;
color: $white;
padding: 16rpx 24rpx;
border-radius: 40rpx;
display: flex;
align-items: center;
gap: 8rpx;
font-size: 28rpx;
}
}
// 通用section样式
.section {
background-color: $white;
margin: $padding-small;
border-radius: $border-radius;
padding: 26rpx;
.section-title {
font-size: 32rpx;
font-weight: bold;
color: $text-color;
margin-bottom: 30rpx;
}
}
// 服务网格
.learning-grid,.operation-grid{
display: flex;
}
.service-item,
.learning-item,
.account-item,
.operation-item {
width: 130rpx;
display: flex;
flex-direction: column;
align-items: center;
gap: 16rpx;
padding: 20rpx;
text{
white-space: nowrap;
font-size: 26rpx;
color: $text-color;
text-align: center;
}
}
.setbox{
margin:0 26rpx;
border-radius:20rpx;
overflow: hidden;
background-color: #fff;
margin-bottom: 30rpx;
}
// 新增模块样式
.benefit-section,
.invoice-section,
.bank-section,
.settings-section {
border-radius: $border-radius;
margin-bottom: 0;
padding: 0;
.benefit-item,
.invoice-item,
.bank-item,
.settings-item {
display: flex;
align-items: center;
padding: 14rpx;
background-color: $white;
border-bottom:2rpx solid #efefef;
.benefit-icon,
.invoice-icon,
.bank-icon,
.settings-icon {
width: 80rpx;
height: 80rpx;
display: flex;
align-items: center;
justify-content: center;
margin-right: 20rpx;
}
.benefit-content,
.invoice-content,
.bank-content,
.settings-content {
flex: 1;
.benefit-title,
.invoice-title,
.bank-title,
.settings-title {
font-size: 26rpx;
color: $text-color;
font-weight: 500;
}
}
.benefit-arrow,
.invoice-arrow,
.bank-arrow,
.settings-arrow {
width: 30rpx;
height: 30rpx;
display: flex;
align-items: center;
justify-content: center;
}
}
}
// 年度总结悬浮按钮
.year-summary-btn {
position: fixed;
bottom: 200rpx;
right: 0rpx;
width: 150rpx;
height: 80rpx;
background: linear-gradient(135deg, $cyan-color 0%, #20B2AA 100%);
border-radius: 60rpx 0 0 60rpx;
justify-content: flex-start;
align-items: center;
color: $white;
display: flex;
box-shadow: 0 8rpx 24rpx rgba(0, 206, 209, 0.3);
z-index: 999;
.year-text {
font-size: 24rpx;
font-weight: bold;
width:70rpx;
height:70rpx;
display: flex;
margin-left: 5rpx;
justify-content: center;
align-items: center;
color:#3cc7c0;
border-radius: 50%;
background-color: #fff;
}
.summary-text {
font-weight: bold;
width:50rpx;
margin-left: 10rpx;
font-size: 20rpx;
}
}
// 底部导航栏
.bottom-nav {
position: fixed;
bottom: 0;
left: 0;
right: 0;
background-color: $white;
display: flex;
border-top: 1px solid $gray-light;
padding: 16rpx 0;
z-index: 1000;
.nav-item {
flex: 1;
display: flex;
flex-direction: column;
align-items: center;
gap: 8rpx;
font-size: 20rpx;
color: $gray-medium;
&.active {
color: $theme-color;
}
}
}
</style>