feat(components/processList): 新增流程列表组件

feat(process/detail): 新增流程页面
feat(process/index): 新增流程列表页面

.hbuilderx/launch.json

@@ -1,16 +1,26 @@
-{ // launch.json 配置了启动调试时相关设置，configurations下节点名称可为 app-plus/h5/mp-weixin/mp-baidu/mp-alipay/mp-qq/mp-toutiao/mp-360/
-  // launchtype项可配置值为local或remote, local代表前端连本地云函数，remote代表前端连云端云函数
-    "version": "0.0",
-    "configurations": [{
-     	"default" : 
-     	{
-     		"launchtype" : "local"
-     	},
-     	"mp-weixin" : 
-     	{
-     		"launchtype" : "local"
-     	},
-     	"type" : "uniCloud"
-     }
+{
+    // launch.json 配置了启动调试时相关设置，configurations下节点名称可为 app-plus/h5/mp-weixin/mp-baidu/mp-alipay/mp-qq/mp-toutiao/mp-360/
+    // launchtype项可配置值为local或remote, local代表前端连本地云函数，remote代表前端连云端云函数
+    "version" : "0.0",
+    "configurations" : [
+        {
+        	"app-plus" : 
+        	{
+        		"launchtype" : "local"
+        	},
+        	"default" : 
+        	{
+        		"launchtype" : "local"
+        	},
+        	"mp-weixin" : 
+        	{
+        		"launchtype" : "local"
+        	},
+        	"type" : "uniCloud"
+        },
+        {
+            "playground" : "standard",
+            "type" : "uni-app:app-android"
+        }
     ]
 }

.vite/deps_temp_c4cb78c2/package.json

@@ -0,0 +1 @@
+{"type":"module"}

components/ygoa/processList.vue

@@ -19,7 +19,8 @@
 										</view>
 									</uni-col>
 									<uni-col :xs="6" :sm="2">
-										<uni-tag text="审批中" type="primary"></uni-tag>
+										<uni-tag :text="process.step == 0?'审批中':''"
+										 :type="process.step == 0?'primary':''"></uni-tag>
 									</uni-col>
 								</uni-row>
 							</template>
@@ -47,15 +48,16 @@
 
 <script setup lang="ts">
 	import { reactive } from 'vue'
+	import $tab from '@/plugins/tab.js'
 	// import { onLoad } from '@dcloudio/uni-app';
 	// onLoad((options) => {
 	// 	processes = options.processes
 	// });
 	const props = defineProps(['processes'])
 	// let processes = reactive([])
-	function handleToDetail(process : object) {
-		console.log('process', process);
-		console.log('process子组件');
+	function handleToDetail({ id, title }) {
+		// console.log('process', process);
+		$tab.navigateTo('/pages/process/detail/index?id=' + id + '&title=' + title)
 	}
 </script>
 

manifest.json

@@ -50,7 +50,7 @@
     /* 快应用特有相关 */
     "mp-weixin" : {
         /* 小程序特有相关 */
-        "appid" : "",
+        "appid" : "wx6cf4eb9ed2a3cd6a",
         "setting" : {
             "urlCheck" : false
         },

pages.json

@@ -83,13 +83,13 @@
 				"navigationBarTitleText": "密码修改",
 				"enablePullDownRefresh": false
 			}
-		},
-		{
-			"path": "pages/mine/waitWork/waitWork",
-			"style": {
-				"navigationBarTitleText": "待办事项",
-				"enablePullDownRefresh": false
-			}
+		// },
+		// {
+		// 	"path": "pages/mine/waitWork/waitWork",
+		// 	"style": {
+		// 		"navigationBarTitleText": "待办事项",
+		// 		"enablePullDownRefresh": false
+		// 	}
 		}
 	],
 	"tabBar": {

pages/contacts/index.vue

@@ -5,6 +5,7 @@
 </template>
 
 <script setup lang="ts">
+	import { ref } from 'vue'
 </script>
 
 <style lang="scss">

pages/process/detail/index.vue

@@ -1,13 +1,139 @@
 <template>
 	<view>
-		
+		<uni-card>
+			<uni-list>
+				<uni-list-item>
+					<template v-slot:header>
+						EU单号
+					</template>
+					<template v-slot:footer>
+						YGTX-QJ7
+					</template>
+				</uni-list-item>
+				<uni-list-item>
+					<template v-slot:header>
+						部门
+					</template>
+					<template v-slot:footer>
+						研发部
+					</template>
+				</uni-list-item>
+				<uni-list-item>
+					<template v-slot:header>
+						发起人
+					</template>
+					<template v-slot:footer>
+						账号1
+					</template>
+				</uni-list-item>
+				<uni-list-item>
+					<template v-slot:header>
+						请假类别
+					</template>
+					<template v-slot:footer>
+						年假
+					</template>
+				</uni-list-item>
+				<uni-list-item>
+					<template v-slot:header>
+						开始时间
+					</template>
+					<template v-slot:footer>
+						2024/10/10
+					</template>
+				</uni-list-item>
+				<uni-list-item>
+					<template v-slot:header>
+						结束时间
+					</template>
+					<template v-slot:footer>
+						2024/10/12
+					</template>
+				</uni-list-item>
+				<uni-list-item>
+					<template v-slot:header>
+						多少小时
+					</template>
+					<template v-slot:footer>
+						48
+					</template>
+				</uni-list-item>
+				<uni-list-item>
+					<template v-slot:header>
+						部门经理审批
+					</template>
+					<template v-slot:footer>
+
+					</template>
+				</uni-list-item>
+				<uni-list-item>
+					<template v-slot:header>
+						综合管理部审批
+					</template>
+					<template v-slot:footer>
+
+					</template>
+				</uni-list-item>
+				<uni-list-item>
+					<template v-slot:header>
+						副总经理审批
+					</template>
+					<template v-slot:footer>
+
+					</template>
+				</uni-list-item>
+				<uni-list-item>
+					<template v-slot:header>
+						总经理审批
+					</template>
+					<template v-slot:footer>
+
+					</template>
+				</uni-list-item>
+			</uni-list>
+		</uni-card>
+		<uni-card>
+			<uni-list-item>
+				<template v-slot:header>
+					上传附件
+				</template>
+			</uni-list-item>
+			<uni-list-item>
+				<template v-slot:body>
+					<uni-file-picker v-model="fileList" :autoUpload="false" mode="list" limit="5" file-mediatype="all"
+						title="选择文件" @select="handleSelect" @progress="handleProgress" @delete="handleDelete"></uni-file-picker>
+				</template>
+			</uni-list-item>
+		</uni-card>
 	</view>
 </template>
 
 <script setup lang="ts">
-import {ref} from 'vue'
+	import { reactive, ref } from 'vue'
+	import { onLoad } from '@dcloudio/uni-app'
+	let fileList = reactive([])
+	function handleSelect(e) {
+		console.log('handleSelect', e);
+	}
+	function handleProgress(e) {
+		console.log('handleProgress', e);
+	}
+	function handleDelete(e) {
+		console.log('handleDelete', e);
+		console.log('handleDelete.target', e.target);
+	}
+	onLoad((options) => {
+		// 获取传入的标题参数
+		const title = options.title || '流程信息';
+		const id = options.id;
+		console.log('id', id);
+		// 设置导航栏标题
+		uni.setNavigationBarTitle({
+			title: title
+		});
+	})
 </script>
 
 <style lang="scss">
 
-</style>
+</style>

pages/process/index.vue

@@ -1,5 +1,26 @@
 <template>
 	<view class="index_container">
+		<view class="search_container">
+			<uni-row>
+				<uni-col :xs="6" :sm="4">
+					<view class="popup_button_container">
+						<button @click="openPopup" class="button">{{ searchItem }}</button>
+					</view>
+				</uni-col>
+				<uni-col :xs="18" :sm="20">
+					<view class="search_bar">
+						<uni-search-bar placeholder="搜索栏" @confirm="search" @cancel="searchCancel" @blur="searchOnBlur">
+							<template v-slot:searchIcon>
+								<uni-icons type="search" size="30"></uni-icons>
+							</template>
+							<template v-slot:clearIcon>
+								<uni-icons type="clear" size="30"></uni-icons>
+							</template>
+						</uni-search-bar>
+					</view>
+				</uni-col>
+			</uni-row>
+		</view>
 		<view class="segmented_control_container">
 			<uni-segmented-control :current="current" :values="items" @clickItem="onClickItem" styleType="text"
 				activeColor="#409eff"></uni-segmented-control>
@@ -7,6 +28,14 @@
 		<view class="process_list">
 			<process-list :processes="processes"></process-list>
 		</view>
+		<view class="popup_container">
+			<uni-popup ref="searchItemPopup" type="bottom">
+				<uni-list>
+					<uni-list-item @click="clickSearchItem(item)" v-for="(item, index) in candidates" :key="index" clickable :title="item">
+					</uni-list-item>
+				</uni-list>
+			</uni-popup>
+		</view>
 	</view>
 </template>
 
@@ -14,11 +43,34 @@
 	import processList from '@/components/ygoa/processList.vue'
 	import { onMounted, reactive, ref } from 'vue';
 	const items = reactive(['待办', '在办', '办结', '我的'])
-	const current = ref(-1)
 	let processes = reactive([])
+	const current = ref(-1)
 	onMounted(() => {
 		onClickItem({ currentIndex: 0 })
+		candidates.value.push('全局', '请假日期', '天数')
 	})
+	const searchItem = ref('请假日期')
+	const candidates = ref([])
+	const searchItemPopup = ref(null)
+	function openPopup() { // 打开搜索项弹出层
+		searchItemPopup.value.open()
+	}
+	function closePopup() { // 关闭搜索项弹出层
+		searchItemPopup.value.close()
+	}
+	function clickSearchItem(item) {
+		searchItem.value = item
+		closePopup()
+	}
+	function search(e) { // 搜索
+		console.log('search', e)
+	}
+	function searchCancel() { // 取消搜索
+		return
+	}
+	function searchOnBlur(e) { // 搜索栏失去焦点
+		console.log('searchOnBlur', e);
+	}
 	function onClickItem({ currentIndex }) {
 		current.value = currentIndex
 		switch (currentIndex) {
@@ -61,9 +113,6 @@
 				break;
 		}
 	}
-	function handleToDetail(process) {
-		console.log('process', process);
-	}
 </script>
 
 <style lang="scss">
@@ -73,7 +122,26 @@
 		font-size: 3rem;
 	}
 
-	.segmented_control_container {
-		margin-top: 10px;
+	.search_container {
+		.popup_button_container {
+			width: 100%;
+			padding-top: 10px;
+			.button {
+				font-size: 14px;
+				font-weight: bold;
+				color: #ffffff;
+				background-color: #1aad19;
+				height: 36px;
+				width: 100%;
+			}
+		}
+
+		.search_bar {
+			::v-deep .uni-searchbar {
+				padding-left: 0;
+			}
+		}
 	}
+
+	.segmented_control_container {}
 </style>