From adeb8b768926ed50a3fb0857f366d6a0308d2cc0 Mon Sep 17 00:00:00 2001
From: gaoluyang <2820782392@qq.com>
Date: 星期五, 29 八月 2025 17:45:57 +0800
Subject: [PATCH] 修改组件

---
 src/pages/cooperativeOffice/collaborativeApproval/index.vue |  319 +++++++++++++++++++++++++++++++++--------------------
 1 files changed, 198 insertions(+), 121 deletions(-)

diff --git a/src/pages/cooperativeOffice/collaborativeApproval/index.vue b/src/pages/cooperativeOffice/collaborativeApproval/index.vue
index 69dc26d..708be76 100644
--- a/src/pages/cooperativeOffice/collaborativeApproval/index.vue
+++ b/src/pages/cooperativeOffice/collaborativeApproval/index.vue
@@ -1,65 +1,94 @@
 // 瀹℃壒绠$悊涓婚〉闈�
 <template>
 	<view class="sales-account">
-		<!-- 椤甸潰澶撮儴 -->
-		<view class="page-header">
-			<view class="header-left">
-				<up-icon name="arrow-left" size="20" color="#333" @click="goBack"></up-icon>
-			</view>
-			<view class="header-center">
-				<text class="page-title">瀹℃壒绠$悊</text>
-			</view>
-		</view>
+		<!-- 浣跨敤閫氱敤椤甸潰澶撮儴缁勪欢 -->
+		<PageHeader title="瀹℃壒绠$悊" @back="goBack" />
 
 		<!-- 鎼滅储鍜岀瓫閫夊尯鍩� -->
 		<view class="search-filter-section">
 			<view class="search-bar">
 				<view class="search-input">
-					<u-input placeholder="璇疯緭鍏ラ噰璐悎鍚屽彿" class="search-text" v-model="searchKeyword">
-						<template #suffix>
-							<up-icon name="search" size="24" color="#999" @click="getList"></up-icon>
-						</template>
-					</u-input>
+					<input
+						class="search-text"
+						placeholder="璇疯緭鍏ユ祦绋嬬紪鍙�"
+						v-model="searchForm.approveId"
+					/>
 				</view>
-				<view class="filter-button" @click="showFilterOptions">
-					<van-icon name="filter-o" size="24" color="#999"></van-icon>
+				<view class="search-button" @click="getList">
+					<up-icon name="search" size="24" color="#999"></up-icon>
 				</view>
 			</view>
 		</view>
 
-		<!-- 閿�鍞彴璐︾�戝竷娴� -->
-		<view class="ledger-list" v-if="total > 0">
+		<!-- 瀹℃壒鍒楄〃 -->
+		<view class="ledger-list" v-if="ledgerList.length > 0">
 			<view v-for="(item, index) in ledgerList" :key="index">
-				<view class="ledger-item" @click="handleItemClick(item)">
+				<view class="ledger-item">
 					<view class="item-header">
 						<view class="item-left">
 							<view class="document-icon">
 								<up-icon name="file-text" size="16" color="#ffffff"></up-icon>
 							</view>
-							<text class="item-id">{{ item.salesContractNo }}</text>
+							<text class="item-id">{{ item.approveId }}</text>
+						</view>
+						<view class="item-tag">
+							<van-tag :type="getTagClass(item.approveStatus)" size="medium">{{ formatReceiptType(item.approveStatus) }}</van-tag>
 						</view>
 					</view>
 					<up-divider></up-divider>
 
 					<view class="item-details">
-						<view class="detail-info">
-							<view class="detail-row">
-								<text class="detail-label">鐢宠浜�</text>
-								<text class="detail-value">{{ item.entryPersonName }}</text>
-							</view>
-							<view class="detail-row">
-								<text class="detail-label">鐢宠鏃ユ湡</text>
-								<text class="detail-value highlightBlue">{{ item.entryDate }}</text>
-							</view>
+						<view class="detail-row">
+							<text class="detail-label">鐢宠浜�</text>
+							<text class="detail-value">{{ item.approveUserName }}</text>
 						</view>
+						<view class="detail-row">
+							<text class="detail-label">鐢宠閮ㄩ棬</text>
+							<text class="detail-value">{{ item.approveDeptName }}</text>
+						</view>
+						<view class="detail-row-approveReason">
+							<text class="detail-label">瀹℃壒浜嬬敱</text>
+							<text class="detail-value highlightBlue">{{ item.approveReason }}</text>
+						</view>
+						<view class="detail-row">
+							<text class="detail-label">鐢宠鏃ユ湡</text>
+							<text class="detail-value">{{ item.approveTime }}</text>
+						</view>
+						<view class="detail-row">
+							<text class="detail-label">缁撴潫鏃ユ湡</text>
+							<text class="detail-value">{{ item.approveOverTime }}</text>
+						</view>
+						<up-divider></up-divider>
 						<view class="detail-info">
-							<view class="detail-row">
-								<text class="detail-label">鐢宠閮ㄩ棬</text>
-								<text class="detail-value">{{ item.entryPersonName }}</text>
+							<view class="detail-row-user">
+								<text class="detail-label">褰撳墠瀹℃壒浜�</text>
+								<view class="detail-value approver-value">
+									<view class="approver-chip">
+										<text class="approver-name">{{ item.approveUserCurrentName || '鏈垎閰�' }}</text>
+									</view>
+								</view>
 							</view>
 							<view class="detail-row">
-								<text class="detail-label">瀹℃壒鐘舵��</text>
-								<text class="detail-value highlightYellow">{{ item.entryDate }}</text>
+								<view class="actions">
+									<van-button
+										type="primary"
+										size="small"
+										class="action-btn edit"
+										:disabled="item.approveStatus == 2 || item.approveStatus == 1 || item.approveStatus == 4"
+										@click="handleItemClick(item)"
+									>
+										缂栬緫
+									</van-button>
+									<van-button
+										type="success"
+										size="small"
+										class="action-btn approve"
+										:disabled="item.approveUserCurrentId == null || item.approveStatus == 2 || item.approveStatus == 3 || item.approveStatus == 4 || item.approveUserCurrentId !== userStore.id"
+										@click="approve(item)"
+									>
+										瀹℃牳
+									</van-button>
+								</view>
 							</view>
 						</view>
 					</view>
@@ -69,7 +98,7 @@
 		<view v-else class="no-data">
 			<text>鏆傛棤瀹℃壒鏁版嵁</text>
 		</view>
-
+<!--		<van-floating-bubble icon="plus" @click="handleAdd"/>-->
 		<!-- 娴姩鎿嶄綔鎸夐挳 -->
 		<view class="fab-button" @click="handleAdd">
 			<up-icon name="plus" size="24" color="#ffffff"></up-icon>
@@ -80,19 +109,23 @@
 <script setup>
 	import {
 		ref,
-		reactive,
-		onMounted
+		toRefs,
+		reactive
 	} from "vue";
-	import {
-		ledgerListPage
-	} from "@/api/cooperativeOffice/collaborativeApproval";
-
-	// 鎼滅储鍏抽敭璇�
-	const searchKeyword = ref("");
-
-	// 閿�鍞彴璐︽暟鎹�
+	import PageHeader from "@/components/PageHeader.vue";
+	import {approveProcessListPage} from "@/api/collaborativeApproval/approvalProcess";
+	import {onShow} from "@dcloudio/uni-app";
+	import useUserStore from "@/store/modules/user";
+	
+	const userStore = useUserStore()
+	// 鏁版嵁
 	const ledgerList = ref([]);
-	const total = ref(0);
+	const data = reactive({
+		searchForm: {
+			approveId: "",
+		},
+	});
+	const { searchForm } = toRefs(data);
 
 	// 杩斿洖涓婁竴椤�
 	const goBack = () => {
@@ -104,12 +137,11 @@
 			current: -1,
 			size: -1,
 		};
-		ledgerListPage({
-				...page
+		approveProcessListPage({
+				...page,approveType: 0,...searchForm.value
 			})
 			.then((res) => {
-				ledgerList.value = res.records;
-				total.value = res.total;
+				ledgerList.value = res.data.records;
 			})
 			.catch(() => {
 				// tableLoading.value = false;
@@ -124,23 +156,58 @@
 			},
 		});
 	};
+	// 鏍煎紡鍖栧洖娆炬柟寮�
+	const formatReceiptType = (params) => {
+		if (params == 0) {
+			return "寰呭鏍�";
+		} else if (params == 1) {
+			return "瀹℃牳涓�";
+		} else if (params == 2) {
+			return "瀹℃牳瀹屾垚";
+		} else if (params == 4) {
+			return "宸查噸鏂版彁浜�";
+		} else {
+			return '涓嶉�氳繃';
+		}
+	};
+	// 鑾峰彇鏍囩鏍峰紡绫�
+	const getTagClass = (type) => {
+		if (type == 0) {
+			return "warning";
+		} else if (type == 1) {
+			return "primary";
+		} else if (type == 2) {
+			return "success";
+		} else if (type == 4) {
+			return "primary";
+		} else {
+			return "danger";
+		}
+	};
 
 	// 鐐瑰嚮鍒楄〃椤�
 	const handleItemClick = (item) => {
-		uni.showToast({
-			title: `鏌ョ湅鍚堝悓: ${item.contractId}`,
-			icon: "none",
+		// 浣跨敤鏈湴瀛樺偍浼犻�掓暟鎹�
+		uni.setStorageSync('invoiceLedgerEditRow', JSON.stringify(item));
+		uni.navigateTo({
+			url: `/pages/cooperativeOffice/collaborativeApproval/detail?operationType=edit&approveId=${item.approveId}`,
 		});
 	};
 
 	// 娣诲姞鏂拌褰�
 	const handleAdd = () => {
 		uni.navigateTo({
-			url: "/pages/cooperativeOffice/collaborativeApproval/detail",
+			url: "/pages/cooperativeOffice/collaborativeApproval/detail?operationType=add",
 		});
 	};
+	// 鐐瑰嚮瀹℃牳
+	const approve = (item) => {
+		uni.navigateTo({
+			url: `/pages/cooperativeOffice/collaborativeApproval/approve?approveId=${item.approveId}`
+		})
+	}
 
-	onMounted(() => {
+	onShow(() => {
 		// 椤甸潰鍔犺浇瀹屾垚鍚庣殑鍒濆鍖栭�昏緫
 		getList();
 	});
@@ -156,73 +223,28 @@
 		background: #f8f9fa;
 		position: relative;
 	}
-
-	.page-header {
-		background: #ffffff;
-		padding: 16px 20px;
-		display: flex;
-		align-items: center;
-		justify-content: space-between;
-		border-bottom: 1px solid #f0f0f0;
-		position: sticky;
-		/* 鍏煎 iOS 鍒樻捣/鐏靛姩宀涘畨鍏ㄥ尯 */
-		padding-top: env(safe-area-inset-top);
-		top: 0;
-		z-index: 100;
-	}
-
-	.header-left {
+	.search-input {
+		flex: 1;
+		background: #f5f5f5;
+		border-radius: 24px;
+		padding: 10px 16px;
 		display: flex;
 		align-items: center;
 		gap: 8px;
 	}
-
-	.nav-icon {
-		width: 24px;
-		height: 24px;
-		background: #2979ff;
-		border-radius: 4px;
-		display: flex;
-		align-items: center;
-		justify-content: center;
-	}
-
-	.nav-text {
-		font-size: 14px;
-		color: #2979ff;
-		font-weight: 500;
-	}
-
-	.header-center {
+	.search-text {
 		flex: 1;
-		text-align: center;
-	}
-
-	.page-title {
-		font-size: 18px;
-		font-weight: 600;
+		font-size: 14px;
 		color: #333;
+		background: transparent;
+		border: none;
+		outline: none;
+	}
+	
+	.search-text::placeholder {
+		color: #999;
 	}
 
-	.header-right {
-		display: flex;
-		align-items: center;
-	}
-
-	.status-bar {
-		display: flex;
-		align-items: center;
-		gap: 4px;
-	}
-
-	.signal,
-	.wifi,
-	.battery {
-		width: 16px;
-		height: 8px;
-		background: #333;
-		border-radius: 2px;
-	}
 
 	.search-filter-section {
 		padding: 10px 20px;
@@ -234,17 +256,16 @@
 		align-items: center;
 		gap: 12px;
 	}
-
+	
 	.search-input {
 		flex: 1;
 		background: #f5f5f5;
 		border-radius: 24px;
-		padding: 4px 16px;
+		padding: 10px 16px;
 		display: flex;
 		align-items: center;
 		gap: 8px;
 	}
-
 	.search-text {
 		flex: 1;
 		font-size: 14px;
@@ -253,7 +274,7 @@
 		border: none;
 		outline: none;
 	}
-
+	
 	.search-text::placeholder {
 		color: #999;
 	}
@@ -310,7 +331,6 @@
 	}
 
 	.item-tag {
-		background: #4caf50;
 		border-radius: 4px;
 		padding: 2px 4px;
 	}
@@ -324,16 +344,27 @@
 	.item-details {
 		padding: 16px 0;
 	}
-
+	
 	.detail-row {
 		display: flex;
 		align-items: flex-end;
 		justify-content: space-between;
 		margin-bottom: 8px;
-
+		
 		&:last-child {
 			margin-bottom: 0;
 		}
+	}
+	.detail-row-user {
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+	}
+	.detail-row-approveReason {
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+		margin-bottom: 8px;
 	}
 
 	.detail-info {
@@ -387,4 +418,50 @@
 		box-shadow: 0 4px 16px rgba(41, 121, 255, 0.3);
 		z-index: 1000;
 	}
+
+	.approver-value {
+		display: flex;
+		justify-content: flex-end;
+	}
+	.approver-chip {
+		display: inline-flex;
+		align-items: center;
+		gap: 6px;
+		background: #f0f6ff;
+		color: #2b7cff;
+		border: 1px solid #e0efff;
+		border-radius: 999px;
+		padding: 4px 10px;
+		max-width: 100%;
+	}
+	.approver-name {
+		font-size: 12px;
+		color: #2b7cff;
+		overflow: hidden;
+		text-overflow: ellipsis;
+		white-space: nowrap;
+	}
+
+	.actions {
+		display: flex;
+		gap: 10px;
+		align-items: center;
+		justify-content: flex-end;
+	}
+
+	.action-btn {
+		border-radius: 16px;
+		height: 28px;
+		line-height: 28px;
+		padding: 0 12px;
+	}
+	.action-btn.edit {
+		/* primary 鏍峰紡鏉ヨ嚜缁勪欢锛岃繖閲屼繚鐣欓挬瀛愪互渚垮悗缁渶瑕佹墿灞� */
+	}
+	.action-btn.approve {
+		/* success 鏍峰紡鏉ヨ嚜缁勪欢锛岃繖閲屼繚鐣欓挬瀛愪互渚垮悗缁渶瑕佹墿灞� */
+	}
+	:deep(.van-floating-bubble) {
+		background: #ed8d05;
+	}
 </style>
\ No newline at end of file

--
Gitblit v1.9.3