ソースを参照

feat(subpack): 新增我的申请和个人信息页面

- 新增 apply-item 组件用于展示申请列表项
- 新增 application list 和 myInfo info 页面
- 更新 mine 页面布局和样式
- 调整 pages.json 配置,添加新页面路由
lzm 4 ヶ月 前
コミット
3d571de2b8

+ 3 - 1
.gitignore

@@ -1,4 +1,6 @@
 .hbuilderx
 unpackage
 node_modules
-package-lock.json
+package-lock.json
+/.idea/
+manifest.*

+ 78 - 72
manifest.json

@@ -1,73 +1,79 @@
 {
-	"name": "special",
-	"appid": "__UNI__10FD0B6",
-	"description": "",
-	"versionName": "1.0.0",
-	"versionCode": "100",
-	"transformPx": false,
-	/* 5+App特有相关 */
-	"app-plus": {
-		"usingComponents": true,
-		"nvueStyleCompiler": "uni-app",
-		"compilerVersion": 3,
-		"splashscreen": {
-			"alwaysShowBeforeRender": true,
-			"waiting": true,
-			"autoclose": true,
-			"delay": 0
-		},
-		/* 模块配置 */
-		"modules": {},
-		/* 应用发布信息 */
-		"distribute": {
-			/* android打包配置 */
-			"android": {
-				"permissions": [
-					"<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>",
-					"<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>",
-					"<uses-permission android:name=\"android.permission.VIBRATE\"/>",
-					"<uses-permission android:name=\"android.permission.READ_LOGS\"/>",
-					"<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>",
-					"<uses-feature android:name=\"android.hardware.camera.autofocus\"/>",
-					"<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>",
-					"<uses-permission android:name=\"android.permission.CAMERA\"/>",
-					"<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>",
-					"<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>",
-					"<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>",
-					"<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>",
-					"<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>",
-					"<uses-feature android:name=\"android.hardware.camera\"/>",
-					"<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>"
-				]
-			},
-			/* ios打包配置 */
-			"ios": {},
-			/* SDK配置 */
-			"sdkConfigs": {}
-		}
-	},
-	/* 快应用特有相关 */
-	"quickapp": {},
-	/* 小程序特有相关 */
-	"mp-weixin": {
-		"appid": "wxa5c97dfa28e626a9",
-		"setting": {
-			"urlCheck": false
-		},
-		"usingComponents": true,
-		"mergeVirtualHostAttributes": true
-	},
-	"mp-alipay": {
-		"usingComponents": true
-	},
-	"mp-baidu": {
-		"usingComponents": true
-	},
-	"mp-toutiao": {
-		"usingComponents": true
-	},
-	"uniStatistics": {
-		"enable": false
-	},
-	"vueVersion": "3"
-}
+    "name" : "special",
+    "appid" : "__UNI__10FD0B6",
+    "description" : "",
+    "versionName" : "1.0.0",
+    "versionCode" : "100",
+    "transformPx" : false,
+    /* 5+App特有相关 */
+    "app-plus" : {
+        "usingComponents" : true,
+        "nvueStyleCompiler" : "uni-app",
+        "compilerVersion" : 3,
+        "splashscreen" : {
+            "alwaysShowBeforeRender" : true,
+            "waiting" : true,
+            "autoclose" : true,
+            "delay" : 0
+        },
+        /* 模块配置 */
+        "modules" : {},
+        /* 应用发布信息 */
+        "distribute" : {
+            /* android打包配置 */
+            "android" : {
+                "permissions" : [
+                    "<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>",
+                    "<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>",
+                    "<uses-permission android:name=\"android.permission.VIBRATE\"/>",
+                    "<uses-permission android:name=\"android.permission.READ_LOGS\"/>",
+                    "<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>",
+                    "<uses-feature android:name=\"android.hardware.camera.autofocus\"/>",
+                    "<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>",
+                    "<uses-permission android:name=\"android.permission.CAMERA\"/>",
+                    "<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>",
+                    "<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>",
+                    "<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>",
+                    "<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>",
+                    "<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>",
+                    "<uses-feature android:name=\"android.hardware.camera\"/>",
+                    "<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>"
+                ]
+            },
+            /* ios打包配置 */
+            "ios" : {},
+            /* SDK配置 */
+            "sdkConfigs" : {}
+        }
+    },
+    /* 快应用特有相关 */
+    "quickapp" : {},
+    /* 小程序特有相关 */
+    "mp-weixin" : {
+        "appid" : "wxa5c97dfa28e626a9",
+        "setting" : {
+            "urlCheck" : false,
+            "postcss" : true,
+            "minified" : true
+        },
+        "usingComponents" : true,
+        "mergeVirtualHostAttributes" : true,
+        "lazyCodeLoading" : "requiredComponents",
+        "optimization" : {
+            "subPackages" : true
+        }
+    },
+    "mp-alipay" : {
+        "usingComponents" : true
+    },
+    "mp-baidu" : {
+        "usingComponents" : true
+    },
+    "mp-toutiao" : {
+        "usingComponents" : true
+    },
+    "uniStatistics" : {
+        "enable" : false
+    },
+    "vueVersion" : "3"
+}

+ 24 - 2
pages.json

@@ -1,7 +1,7 @@
 {
 	"easycom": {
 		"autoscan": true,
-		// 注意一定要放在custom里,否则无效,https://ask.dcloud.net.cn/question/131175
+		// 注意一定要放在custom里,wxa5c97dfa28e626a9否则无效,https://ask.dcloud.net.cn/question/131175
 		"custom": {
 			"^u--(.*)": "@/uni_modules/uview-plus/components/u-$1/u-$1.vue",
 			"^up-(.*)": "@/uni_modules/uview-plus/components/u-$1/u-$1.vue",
@@ -26,7 +26,8 @@
 		{
 			"path": "pages/tabbar/mine/mine",
 			"style": {
-				"navigationBarTitleText": "我的"
+				"navigationBarTitleText": "我的",
+				"navigationStyle": "custom"
 			}
 		}
 	],
@@ -45,6 +46,27 @@
 					"navigationStyle": "custom",
 					"navigationBarTextStyle": "black"
 				}
+			},
+			{
+				"path": "pages/myInfo/info",
+				"style": {
+					"navigationStyle": "custom",
+					"navigationBarTitleText": "个人信息"
+				}
+			},
+			{
+				"path": "pages/application/list",
+				"style": {
+					"navigationStyle": "custom",
+					"navigationBarTitleText": "申请列表"
+				}
+			},
+			{
+				"path": "pages/application/info",
+				"style": {
+					"navigationStyle": "custom",
+					"navigationBarTitleText": "申请详情-流程相关"
+				}
 			}
 		]
 	}],

+ 108 - 0
pages/subpack/components/apply/apply-item.vue

@@ -0,0 +1,108 @@
+<template>
+	<view class="apply-item" @tap="tapItemHandle">
+		<view class="apply-item-tag"
+		:class="[`apply-item-tag${item.status}`]">待签到</view>
+		<view class="flex-row">
+			<u-image class="apply-item-image1" width="51.2rpx" height="51.2rpx" bgColor="transparent"
+				src="@/pages/subpack/static/images/app/avatar-mini.png" />
+			<view class="apply-item-name">张三🤩</view>
+		</view>
+		<view class="apply-item-content">
+			<view class="flex-row align-center">
+				<u-image class="apply-item-image2" width="36rpx" height="36rpx" bgColor="transparent"
+					src="@/pages/subpack/static/images/app/time-icon.png" />
+				<view class="apply-item-tips">
+					<text>事项:</text>
+					<text>企业设立、变更、注销登记</text>
+				</view>
+			</view>
+			<view class="flex-row align-center mt-08">
+				<u-image class="apply-item-image2" width="36rpx" height="36rpx" bgColor="transparent"
+					src="@/pages/subpack/static/images/app/cat-icon.png" />
+				<view class="apply-item-tips1">
+					<text>预约时间:</text>
+					<text>2024.09.09 11:00-12:00</text>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script setup>
+	const emit = defineEmits(['tapItem'])
+	const props = defineProps({
+		item: {
+			type: Object,
+			default () {
+				return {
+					personName: '张三🤩', //申请人姓名
+					careNeeds: 'sdasad', //护理需求详情
+					applyDate: '2025-01-01 12:23:12', //申请日期
+					status: 1, //申请状态
+					dealStatus: 1, //处理状态
+				}
+			}
+		},
+	})
+
+	const tapItemHandle = () => {
+		emit('tapItem', props.item)
+	}
+</script>
+
+<style lang="scss" scoped>
+	:deep(.u-image) {
+		display: flex;
+		align-items: center;
+		justify-content: center;
+	}
+
+	.apply-item {
+		position: relative;
+		background-color: #fff;
+		margin: 24rpx;
+		padding: 30rpx;
+		border-radius: 20rpx;
+
+		&-tag {
+			position: absolute;
+			right: 0;
+			top: 0;
+			font-size: 28rpx;
+			color: #FFFFFF;
+			background: linear-gradient(to right, #00D885 0%, #2CEFA4 100%);
+			padding: 6rpx 24rpx;
+			border-radius: 0 20rpx 0 20rpx;
+			font-weight: 500;
+		}
+		&-tag1{
+			background: linear-gradient(to right, #EFEFEF 0%, #EFEFEF 100%);
+			color: #888888;
+		}
+		&-tag2{
+			background: linear-gradient(to right, #1677FF 0%, #5EA0FB 100%);
+		}
+
+		&-name {
+			font-size: 32rpx;
+			color: #222222;
+			margin-left: 20rpx;
+		}
+
+		&-content {
+			margin-top: 20rpx;
+		}
+
+		&-tips {
+			margin-left: 15rpx;
+			font-size: 28rpx;
+			color: #444444;
+		}
+
+		&-tips1 {
+			margin-left: 15rpx;
+			font-size: 24rpx;
+			color: #444444;
+		}
+	}
+</style>

+ 25 - 0
pages/subpack/pages/application/info.vue

@@ -0,0 +1,25 @@
+<template>
+	<view>
+		<u-navbar class="u-navbar-box" title="申请详情" placeholder bgColor="transparent" autoBack />
+	</view>
+</template>
+
+<script setup>
+	
+</script>
+
+<style lang="scss" scoped>
+	page {
+		background-color: #F6F8FD;
+	}
+
+	:deep(.u-navbar__content__title) {
+		font-weight: bold;
+		font-size: 36rpx;
+		color: #222222;
+	}
+
+	.u-navbar-box {
+		background: radial-gradient(circle at left, #FFE5E4 0%, #EEF2F5 40%, #DBEEFB 100%);
+	}
+</style>

+ 120 - 0
pages/subpack/pages/application/list.vue

@@ -0,0 +1,120 @@
+<template>
+	<view>
+		<z-paging ref="paging" v-model="dataList" @query="queryList" empty-view-text="~ 暂无数据 ~">
+			<template #top>
+				<u-navbar class="u-navbar-box" title="我的申请" placeholder bgColor="transparent" autoBack />
+				<view class="bg-white">
+					<u-tabs :list="tabList" :current="tabIndex" lineWidth="80rpx" :itemStyle="itemStyle"
+						:activeStyle="activeStyle" :inactiveStyle="inactiveStyle" @click="handleTabs" />
+				</view>
+			</template>
+			<template #default>
+				<view class="apply-list">
+					<applyItem v-for="(item, index) in dataList" :key="index" @tapItem="tapItemHandle" />
+				</view>
+			</template>
+		</z-paging>
+	</view>
+</template>
+
+<script setup>
+	import {
+		ref,
+		reactive,
+		getCurrentInstance
+	} from 'vue';
+	import applyItem from '../../components/apply/apply-item.vue';
+
+	const {
+		proxy
+	} = getCurrentInstance();
+	//当前是tabs样式
+	const itemStyle = reactive({
+		width: '187.5rpx',
+		padding: '20rpx 0'
+	})
+	const activeStyle = reactive({
+		color: '#39A1FF',
+		fontSize: '32rpx',
+		fontWeight: 'bold'
+	})
+	const inactiveStyle = reactive({
+		color: '#888888',
+		fontSize: '32rpx',
+		fontWeight: 'bold'
+	})
+
+	const props = defineProps({
+		// 是否是工作 - 判断当前tab是否显示
+		isWork: {
+			type: Boolean,
+			default: false
+		}
+	})
+	const tabList = reactive([{
+			name: '进行中'
+		},
+		{
+			name: '已完成'
+		},
+		{
+			name: '未结算'
+		},
+		{
+			name: '已结算'
+		}
+	])
+	const tabIndex = ref(0)
+
+	function handleTabs({
+		index,
+		name
+	}) {
+		if (index === tabIndex.value) return;
+		tabIndex.value = index;
+		proxy.$refs.paging.reload();
+	}
+
+
+	const dataList = ref([])
+	const paging = ref(null)
+
+	function queryList(pageNo, pageSize) {
+		uni.showLoading({
+			title: '加载中...',
+			mask: true
+		})
+		let list = [];
+		for (var i = 0; i < 20; i++) {
+			list.push({
+				id: i,
+				name: `test${i}`
+			})
+		}
+		setTimeout(() => {
+			paging.value.complete(list);
+			uni.hideLoading();
+		}, 500)
+	}
+
+
+	function tapItemHandle(item) {
+		uni.$u.route('/pages/subpack/pages/application/info')
+	}
+</script>
+<style>
+	page {
+		background-color: #F6F8FD;
+	}
+</style>
+<style lang="scss" scoped>
+	:deep(.u-navbar__content__title) {
+		font-weight: bold;
+		font-size: 36rpx;
+		color: #222222;
+	}
+
+	.u-navbar-box {
+		background: radial-gradient(circle at left, #FFE5E4 0%, #EEF2F5 40%, #DBEEFB 100%);
+	}
+</style>

+ 41 - 0
pages/subpack/pages/myInfo/info.vue

@@ -0,0 +1,41 @@
+<template>
+	<view>
+		<u-navbar class="u-navbar-box" title="个人信息" placeholder bgColor="transparent" autoBack />
+		<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="36rpx" height="36rpx" />
+				</template>
+			</u-cell>
+			<u-cell title="姓名" isLink :border="false">
+				<template #value>
+					<u-image src="/static/mine/myself.png" bgColor="transparent" width="36rpx" height="36rpx" />
+				</template>
+			</u-cell>
+		</u-cell-group>
+	</view>
+</template>
+
+<script setup>
+
+</script>
+<style>
+	page {
+		background-color: #F6F8FD;
+	}
+</style>
+<style lang="scss" scoped>
+	page {
+		background-color: #F6F8FD;
+	}
+
+	:deep(.u-navbar__content__title) {
+		font-weight: bold;
+		font-size: 36rpx;
+		color: #222222;
+	}
+
+	.u-navbar-box {
+		background: radial-gradient(circle at left, #FFE5E4 0%, #EEF2F5 40%, #DBEEFB 100%);
+	}
+</style>

BIN
pages/subpack/static/images/app/avatar-mini.png


BIN
pages/subpack/static/images/app/cat-icon.png


BIN
pages/subpack/static/images/app/time-icon.png


+ 77 - 13
pages/tabbar/mine/mine.vue

@@ -1,22 +1,86 @@
 <template>
 	<view>
-		
+		<u-navbar class="u-navbar-box" title="我的" placeholder bgColor="transparent" left-icon-size="0" />
+		<view class="top-box">
+			<u-image class="bg-box" width="690rpx" height="270rpx" src="/static/mine/user-center-bg.png" />
+			<div class="avatar-name">
+				<u-image class="avatar" width="116rpx" bgColor="transparent" height="116rpx"
+					src="/static/mine/avatar-def.png" />
+				<view class="name">{{user.name}}</view>
+			</div>
+			<div class="abs-right">
+				<u-image bgColor="transparent" width="220rpx" height="258rpx" src="/static/mine/user-center-img.png" />
+			</div>
+		</view>
+		<u-cell-group :border="false" :customStyle="{background: '#fff', margin: '30rpx', borderRadius: '20rpx'}">
+			<u-cell icon="setting-fill" title="我的申请" isLink url="/pages/subpack/pages/application/list">
+				<template #icon>
+					<u-image src="/static/mine/task.png" bgColor="transparent" width="36rpx" height="36rpx" />
+				</template>
+			</u-cell>
+			<u-cell icon="integral-fill" title="个人信息" isLink :border="false" url="/pages/subpack/pages/myInfo/info">
+				<template #icon>
+					<u-image src="/static/mine/myself.png" bgColor="transparent" width="36rpx" height="36rpx" />
+				</template>
+			</u-cell>
+		</u-cell-group>
 	</view>
 </template>
 
-<script>
-	export default {
-		data() {
-			return {
-				
+<script setup>
+	import {
+		ref
+	} from 'vue';
+	const user = ref({
+		name: '李大川'
+	})
+</script>
+<style>
+	page {
+		background-color: #F6F8FD;
+	}
+</style>
+<style lang="scss" scoped>
+	:deep(.u-image) {
+		display: flex;
+		align-items: center;
+		justify-content: center;
+	}
+
+	:deep(.u-navbar__content__title) {
+		font-weight: bold;
+		font-size: 36rpx;
+		color: #222222;
+	}
+
+	.u-navbar-box {
+		background: radial-gradient(circle at left, #FFE5E4 0%, #EEF2F5 40%, #DBEEFB 100%);
+	}
+
+	.top-box {
+		position: relative;
+		margin: 30rpx;
+
+		.avatar-name {
+			position: absolute;
+			top: 77rpx;
+			left: 40rpx;
+			display: flex;
+			align-items: center;
+
+			.name {
+				font-weight: bold;
+				font-size: 40rpx;
+				color: #000000;
+				margin-left: 30rpx;
 			}
-		},
-		methods: {
-			
 		}
-	}
-</script>
 
-<style>
+		.abs-right {
+			position: absolute;
+			bottom: 20rpx;
+			right: 40rpx;
+		}
 
-</style>
+	}
+</style>

BIN
static/images/index-bg.png


BIN
static/images/index-center-bg.png


BIN
static/images/index-computer.png


BIN
static/images/index-enter-arrow.png


BIN
static/images/index-enter-logo.png


BIN
static/images/index-tag-bg.png


BIN
static/images/message-read.png


BIN
static/images/message-un-read.png


BIN
static/images/nav-bg.png


BIN
static/mine/avatar-def.png


BIN
static/mine/myself.png


BIN
static/mine/task.png


BIN
static/mine/user-center-bg.png


BIN
static/mine/user-center-img.png


BIN
static/tabbar/index-selected.png


BIN
static/tabbar/index.png


BIN
static/tabbar/message-selected.png


BIN
static/tabbar/message.png


BIN
static/tabbar/mine-new.png


BIN
static/tabbar/mine-selected.png


BIN
static/tabbar/order-selected.png


BIN
static/tabbar/order.png