Quellcode durchsuchen

refactor: 修改页面组件的属性

- 更新 choose.vue、info.vue、page1.vue 和 page3.vue 的属性
- 优化页面组件的结构和功能
lzm vor 4 Monaten
Ursprung
Commit
290daf9be8

+ 29 - 19
pages/subpack/pages/application/choose.vue

@@ -13,15 +13,15 @@
 					color="#fff" />
 				<view style="width: 20rpx"></view>
 				<u-avatar :text="nameText(v.name)" shape="square" bgColor="#2979ff" />
-				<view style="margin-left: 20rpx">
+				<view style="margin-left: 20rpx;">
 					<view class="text-size-n">{{ v.name }}</view>
 					<view class="text-grey text-size-m mt-1">{{ v.des }}</view>
 				</view>
 			</view>
 		</template>
-		<template #bottom>
+		<template v-if="data.maxCount != 1 || data.dufaultIds" #bottom>
 			<view class="l-fixed__box" style="position: relative; z-index: 9999">
-				<view class="u-flex u-row-between">
+				<view class="u-flex align-center justify-between" style="height: 100%;">
 					<view style="width: 65%">
 						<view class="flex flex-row" style="color: #2979ff">
 							<text class="text-size-n">已选择:</text>
@@ -29,7 +29,7 @@
 								style="display: inline-block; margin-left: 40rpx; color: #ff9900">取消全部选中</text>
 						</view>
 						<view style="color: #909399; font-size: 26rpx">
-							<text class="text-size-n" v-if="showCheck">最多可以选择{{ maxCount }}人</text>
+							<text class="text-size-n" v-if="showCheck">最多可以选择{{ data.maxCount }}人</text>
 							<text class="text-overflow text-size-n"
 								style="width: 300rpx;color: #2979ff;">{{ checkedText }}</text>
 						</view>
@@ -76,7 +76,7 @@
 	})
 
 	const showCheck = computed(() => {
-		console.log(checkedCount.value);
+		// console.log(checkedCount.value);
 		return checkedCount.value === 0;
 	})
 
@@ -100,6 +100,9 @@
 		let checked = data.list[index].checked;
 		if (data.maxCount <= checkedCount.value && !checked) return false;
 		data.list[index].checked = !checked;
+		if (checkedCount.value == data.maxCount && data.maxCount == 1 && !data.dufaultIds) {
+			submit();
+		}
 	}
 
 	function submit() {
@@ -116,7 +119,7 @@
 			checkList: checkList
 		};
 		if (data.pageType) backParams.backType = data.pageType;
-		uni.$emit('checkPerson', backParams);
+		uni.$emit('choose', backParams);
 		uni.$u.route({
 			type: 'back'
 		});
@@ -128,11 +131,13 @@
 			mask: true
 		})
 		let list = [];
-		for (var i = 0; i < 20; i++) {
+		for (var i = 0; i < 9; i++) {
+			let id = i + 1;
 			list.push({
-				id: i,
-				name: `test${i}`,
-				des: '已经服务11人'
+				id: id,
+				name: `test${id}`,
+				des: '已经服务11人',
+				checked: data.dufaultIds.indexOf(id) != -1
 			})
 		}
 		setTimeout(() => {
@@ -178,9 +183,11 @@
 			background: radial-gradient(circle at left, #FFE5E4 0%, #EEF2F5 40%, #DBEEFB 100%);
 		}
 	}
+
 	.u-navbar-box {
 		background: radial-gradient(circle at left, #FFE5E4 0%, #EEF2F5 40%, #DBEEFB 100%);
 	}
+
 	.radio {
 		background-color: #fff;
 		border: 1px solid #909399;
@@ -189,31 +196,31 @@
 		width: 45rpx;
 		justify-content: center;
 	}
-	
+
 	.radio-active {
 		background-color: #2979ff;
 		border: 1px solid #2979ff;
 	}
-	
+
 	.p-item {
 		padding: 20rpx;
 		align-items: center;
 		background-color: #fff;
 		margin: 20rpx 0;
 	}
-	
+
 	.p-item:active {
 		background-color: #e8e8e8;
 	}
-	
+
 	.l-fixed {
 		&__placeholder {
 			height: 100rpx;
 		}
-	
+
 		&__box {
 			position: fixed;
-			width: 750rpx;
+			width: 710rpx;
 			padding: 20rpx;
 			bottom: 0;
 			height: 120rpx;
@@ -221,13 +228,16 @@
 			background-color: #fff;
 		}
 	}
-	.text-size-n{
+
+	.text-size-n {
 		font-size: 30rpx;
 	}
-	.text-size-m{
+
+	.text-size-m {
 		font-size: 26rpx;
 	}
-	.text-grey{
+
+	.text-grey {
 		color: rgba(34, 34, 34, .4);
 	}
 </style>

+ 64 - 7
pages/subpack/pages/application/componenets/page1.vue

@@ -9,16 +9,28 @@
 					</view> -->
 					<view>
 						<view class="flow-tips">护理人员</view>
-						<view class="flow-tips-content">请选择护理人员</view>
+						<view class="flow-tips-content" :class="{'theme-color': chooseInfo.name}">
+							{{chooseInfo.name??'请选择护理人员'}}
+						</view>
 					</view>
-					<up-icon size="28" class="up-icon" name="plus" @tap="goToChoosePage" />
+					<view class="icon-box" @tap="goToChoosePage" >
+						<up-icon v-if="!chooseInfo.name" size="28" class="up-icon" name="plus" />
+						<up-avatar v-else size="80rpx" :text="nameText(chooseInfo.name)" shape="square" bgColor="#305BFF" />
+					</view>
+					
 				</view>
 			</up-form-item>
-			<up-form-item label="护理拍照" labelWidth="auto" required>
+			<up-form-item label="护理打卡(0/6)" labelWidth="auto" required>
 				<view class="flex-row justify-between align-center" style="width: 100%;">
 					<u-upload :sizeType="['compressed']" :capture="['camera']"/>
 				</view>
 			</up-form-item>
+			<up-form-item label="护理评分" labelWidth="auto" required>
+				<view class="flex-row justify-between align-center" style="width: 100%;">
+					<up-rate v-model="formData.score" activeIcon="heart-fill" inactiveIcon="heart" count="10" :size="25"/>
+					<view>{{formData.score*10}}</view>
+				</view>
+			</up-form-item>
 			<up-form-item label="审批意见" labelWidth="auto" required>
 				<up-textarea v-model="formData.remark" placeholder="请输入您的审批意见" count />
 			</up-form-item>
@@ -34,18 +46,53 @@
 <script setup>
 	import {
 		ref,
-		reactive
+		reactive,
+		computed
 	} from 'vue';
+	import {
+		onLoad,
+		onUnload
+	} from "@dcloudio/uni-app"
 
 	// 使用 ref 创建响应式引用  
 	const formRef = ref(null);
 	const formData = reactive({
-		remark: ''
+		remark: '',//审核意见
+		careCompany: '',//护理公司
+		careStaff: '',//护理人员
+		score: 1,//评分
+	})
+	const chooseInfo = ref({});//选择的数据
+	
+	const nameText = computed(() => {
+		return (name) => {
+			let index = name.length - 2;
+			index = index >= 0 ? index : 0;
+			return name.substring(index);
+		};
 	})
+	
 
 	function goToChoosePage() {
-		uni.$u.route('/pages/subpack/pages/application/choose')
+		let params = {
+			maxCount: 1
+		}
+		if(chooseInfo.value.name) {
+			params.dufaultIds = chooseInfo.value.id+"";
+		}
+		console.log(params);
+		uni.$u.route('/pages/subpack/pages/application/choose', params)
 	}
+	
+	
+	onLoad(()=>{
+		uni.$on('choose', ({checkList})=>{
+			if(checkList && checkList.length>0) chooseInfo.value = checkList[0];
+		})
+	})
+	onUnload(()=>{
+		uni.$off('choose')
+	})
 </script>
 
 <style lang="scss" scoped>
@@ -68,11 +115,21 @@
 		padding: 20rpx 36rpx;
 		background-color: #fff;
 		position: fixed;
-		bottom: calc(50px + var(--status-bar-height) + 20rpx);
+		/* bottom: calc(50px + var(--status-bar-height)); */
+		bottom: 50px;
 		width: 690rpx;
 
 		.btn-place {
 			width: 100rpx;
 		}
 	}
+	.theme-color{
+		color: #305BFF !important;
+	}
+	.icon-box{
+		overflow: hidden;
+		width: 80rpx;
+		height: 80rpx;
+		
+	}
 </style>

+ 82 - 12
pages/subpack/pages/application/componenets/page3.vue

@@ -3,29 +3,33 @@
 		<view class="info-dot">审批进度</view>
 		<view class="flow-list">
 			<up-steps current="2" direction="column">
-				<up-steps-item class="position-relative" title="开始">
+				<up-steps-item v-for="(flow, index) in flowList" ::key="index" class="position-relative"
+					:title="flow.flowName">
 					<template #icon>
 						<view class="flow-icon"></view>
 					</template>
 					<template #desc>
 						<view class="position-absolute flow-time" style="top: 0;right: 0;">
-							2023-05-01  12:30:23
+							{{flow.time??' '}}
 						</view>
 						<view class="flow-des">
 							<view class="flow-des-top">
-								<view>王晓霞</view>
-								<view class="flow-des-top-tips">提交</view>
+								<view>{{flow.name??'匿名'}}</view>
+								<view :class="`flow-des-top-tips flow-des-top-tips${flow.status}`">{{nameHandle(flow)}}</view>
+							</view>
+							<view :class="`flow-des-des`" v-if="flow.des">
+								{{flow.des}}
 							</view>
 						</view>
 					</template>
 				</up-steps-item>
-				<up-steps-item title="已出库">
+				<!-- <up-steps-item title="已出库">
 					<template #icon>
 						<view class="flow-icon"></view>
 					</template>
 					<template #desc>
 						<view class="position-absolute flow-time" style="top: 0;right: 0;">
-							2023-05-01  12:30:23
+							2023-05-01 12:30:23
 						</view>
 						<view class="flow-des">
 							<view class="flow-des-top">
@@ -44,7 +48,7 @@
 					</template>
 					<template #desc>
 						<view class="position-absolute flow-time" style="top: 0;right: 0;">
-							2023-05-01  12:30:23
+							2023-05-01 12:30:23
 						</view>
 						<view class="flow-des">
 							<view class="flow-des-top">
@@ -53,14 +57,79 @@
 							</view>
 						</view>
 					</template>
-				</up-steps-item>
+				</up-steps-item> -->
 			</up-steps>
 		</view>
 	</view>
 </template>
 
 <script setup>
+	import {
+		computed,
+		reactive
+	} from 'vue';
 
+	// 0 不同意 1 待审  2 同意
+	const flowList = reactive([{
+			flowName: '资料提交',
+			name: '乡镇民政所',
+			time: '2025-01-01 10:20:30',
+			des: '',
+			status: 2,
+		},
+		{
+			flowName: '资料审核',
+			name: '区民政局',
+			time: '2025-01-01 10:20:30',
+			des: '意见:同意开门多少度啥平开门大厦科目都是',
+			status: 2,
+		},
+		{
+			flowName: '指派护理公司',
+			name: '区民政局',
+			time: '2025-01-01 10:20:30',
+			des: '护理要求:要求必须工作做到位',
+			status: 2,
+		},
+		{
+			flowName: '指派护理人员',
+			name: '护理公司',
+			time: '2025-01-01 10:20:30',
+			des: '要求必须工作做到位',
+			status: 2,
+		},
+		{
+			flowName: '护理打卡',
+			name: '王富贵',
+			time: '2025-01-01 10:20:30',
+			des: '打卡6/6次',
+			status: 2,
+		},
+		{
+			flowName: '护理评分',
+			name: '看护人员',
+			time: '2025-01-01 10:20:30',
+			des: '评分:总共100分,评分88分',
+			status: 1,
+		}
+	])
+
+	function nameHandle(flow) {
+		if (flow.status === 0) return '拒绝';
+		if (flow.status === 1) return '待审';
+		if (flow.status === 2) {
+			let {
+				flowName
+			} = flow;
+			if (flowName.includes('提交')) return '提交成功';
+			if (flowName.includes('指派')) return '指派成功';
+			if (flowName.includes('评分')) return '评分成功';
+			if (flowName.includes('打卡')) return '打卡成功';
+			return '同意';
+
+		}
+		return '--'
+	}
 </script>
 
 <style lang="scss" scoped>
@@ -96,7 +165,8 @@
 		border-radius: 10rpx;
 		background-color: #fff;
 	}
-	.flow-time{
+
+	.flow-time {
 		font-size: 28rpx;
 		color: #888888;
 	}
@@ -119,15 +189,15 @@
 				color: #207DFF;
 			}
 
-			&-tips1 {
+			&-tips2 {
 				color: #1FBC99;
 			}
 
-			&-tips2 {
+			&-tips1 {
 				color: #FA7E00;
 			}
 
-			&-tips3 {
+			&-tips0 {
 				color: #fa3534;
 			}
 		}

+ 10 - 1
pages/subpack/pages/application/info.vue

@@ -57,9 +57,18 @@
 			font-size: 36rpx;
 			color: #222222;
 		}
-		.u-navbar__content{
+		.u-navbar__content,
+		.u-status-bar{
 			background: radial-gradient(circle at left, #FFE5E4 0%, #EEF2F5 40%, #DBEEFB 100%);
 		}
+		.u-tabbar-item__text{
+			font-size: 30rpx;
+		}
+		.u-tabbar-item__icon{
+			.u-icon__icon{
+				font-size: 50rpx !important;
+			}
+		}
 		.u-textarea{
 			background-color: rgba(245, 248, 252, 1) !important;
 			border: none;

+ 1 - 1
pages/subpack/pages/myInfo/info.vue

@@ -4,7 +4,7 @@
 		<u-cell-group :border="false" :customStyle="{background: '#fff', margin: '30rpx',  borderRadius: '20rpx'}">
 			<u-cell title="头像" isLink>
 				<template #value>
-					<u-image src="/static/mine/task.png" bgColor="transparent" width="60rpx" height="60rpx" />
+					<u-avatar />
 				</template>
 			</u-cell>
 			<u-cell title="姓名" isLink :border="false">