From f670b79094c95d791fc43c8fc8b5858ebf8426dc Mon Sep 17 00:00:00 2001
From: zhangwencui <1064582902@qq.com>
Date: 星期四, 17 九月 2026 13:50:29 +0800
Subject: [PATCH] 一些向web对齐
---
src/pages/cooperativeOffice/collaborativeApproval/approve.vue | 249 +++++--------------------------------------------
1 files changed, 28 insertions(+), 221 deletions(-)
diff --git a/src/pages/cooperativeOffice/collaborativeApproval/approve.vue b/src/pages/cooperativeOffice/collaborativeApproval/approve.vue
index b3c8687..e406c1e 100644
--- a/src/pages/cooperativeOffice/collaborativeApproval/approve.vue
+++ b/src/pages/cooperativeOffice/collaborativeApproval/approve.vue
@@ -49,58 +49,14 @@
</view>
</view>
</view>
- <!-- 瀹℃壒娴佺▼ -->
- <view class="approval-process">
- <view class="process-header">
- <text class="process-title">瀹℃壒娴佺▼</text>
- </view>
- <view class="process-steps">
- <view v-for="(step, index) in approvalSteps"
- :key="index"
- class="process-step"
- :class="{
- 'completed': step.status === 'completed',
- 'current': step.status === 'current',
- 'pending': step.status === 'pending',
- 'rejected': step.status === 'rejected'
- }">
- <view class="step-indicator">
- <view class="step-dot">
- <text v-if="step.status === 'completed'"
- class="step-icon">鉁�</text>
- <text v-else-if="step.status === 'rejected'"
- class="step-icon">鉁�</text>
- <text v-else
- class="step-number">{{ index + 1 }}</text>
- </view>
- <view v-if="index < approvalSteps.length - 1"
- class="step-line"></view>
- </view>
- <view class="step-content">
- <view class="step-info">
- <text class="step-title">{{ step.title }}</text>
- <text class="step-approver">{{ step.approverName }}</text>
- <text v-if="step.approveTime"
- class="step-time">{{ step.approveTime }}</text>
- </view>
- <view v-if="step.opinion"
- class="step-opinion">
- <text class="opinion-label">瀹℃壒鎰忚锛�</text>
- <text class="opinion-content">{{ step.opinion }}</text>
- </view>
- <!-- 绛惧悕灞曠ず -->
- <view v-if="step.urlTem"
- class="step-opinion"
- style="margin-top:8px;">
- <text class="opinion-label">绛惧悕锛�</text>
- <image :src="step.urlTem"
- mode="widthFix"
- style="width:180px;border-radius:6px;border:1px solid #eee;" />
- </view>
- </view>
- </view>
- </view>
+ <!-- 閲囪喘/鎶ヤ环/鍙戣揣瀹℃壒璇︽儏 -->
+ <view v-if="isBusinessApproval"
+ class="business-detail-wrap">
+ <ApprovalBusinessDetail :approve-type="approvalData.approveType || approveType"
+ :business-no="approvalData.approveReason" />
</view>
+ <!-- 瀹℃壒娴佺▼ -->
+ <ApproveFlowSteps :steps="approvalSteps" />
<!-- 瀹℃牳鎰忚杈撳叆 -->
<view v-if="canApprove"
class="approval-input">
@@ -134,6 +90,9 @@
updateApproveNode,
} from "@/api/collaborativeApproval/approvalProcess";
import useUserStore from "@/store/modules/user";
+ import ApprovalBusinessDetail from "./_components/ApprovalBusinessDetail.vue";
+ import ApproveFlowSteps from "./_components/ApproveFlowSteps.vue";
+ import { mapApprovalSteps } from "./_utils/approveFlowSteps.js";
const showToast = message => {
uni.showToast({
title: message,
@@ -147,6 +106,14 @@
const approvalSteps = ref([]);
const approvalOpinion = ref("");
const approveId = ref("");
+ const approveType = ref(0);
+
+ /** 5 閲囪喘 / 6 鎶ヤ环 / 7 鍙戣揣锛氶渶灞曠ず涓氬姟鍗曟嵁璇︽儏 */
+ const isBusinessApproval = computed(() =>
+ [5, 6, 7].includes(
+ Number(approvalData.value.approveType || approveType.value)
+ )
+ );
// 浠庤鎯呮帴鍙ｅ瓧娈靛榻� canApprove锛氫粎褰撴湁 isShen 鐨勮妭鐐规椂鍙鎵�
const canApprove = computed(() => {
@@ -155,6 +122,7 @@
onMounted(() => {
approveId.value = uni.getStorageSync("approveId");
+ approveType.value = Number(uni.getStorageSync("approveType")) || 0;
if (approveId.value) {
loadApprovalData();
}
@@ -170,23 +138,7 @@
const list = Array.isArray(res.data) ? res.data : [];
// 淇濆瓨鍘熷鑺傜偣鏁版嵁渚涙彁浜や娇鐢�
activities.value = list;
-
- approvalSteps.value = list.map((it, idx) => {
- // 鑺傜偣鐘舵�佹槧灏勶細1=閫氳繃锛�2=涓嶉�氳繃锛屽惁鍒欑湅鏄惁褰撳墠(isShen)锛屽啀榛樿涓哄緟澶勭悊
- let status = "pending";
- if (it.approveNodeStatus === 1) status = "completed";
- else if (it.approveNodeStatus === 2) status = "rejected";
- else if (it.isShen) status = "current";
- return {
- title: `绗�${idx + 1}姝ュ鎵筦,
- approverName: it.approveNodeUser || "鏈煡鐢ㄦ埛",
- status,
- approveTime: it.approveTime || null,
- opinion: it.approveNodeReason || "",
- urlTem: it.urlTem || "",
- isShen: !!it.isShen,
- };
- });
+ approvalSteps.value = mapApprovalSteps(list);
});
};
@@ -282,6 +234,14 @@
overflow: hidden;
}
+ .business-detail-wrap {
+ background: #fff;
+ margin: 16px;
+ border-radius: 12px;
+ overflow: hidden;
+ padding: 1px 0;
+ }
+
.info-header {
padding: 16px;
border-bottom: 1px solid #f0f0f0;
@@ -319,148 +279,6 @@
font-size: 14px;
color: #333;
flex: 1;
- }
-
- .approval-process {
- background: #fff;
- margin: 16px;
- border-radius: 12px;
- overflow: hidden;
- }
-
- .process-header {
- padding: 16px;
- border-bottom: 1px solid #f0f0f0;
- background: #f8f9fa;
- }
-
- .process-title {
- font-size: 16px;
- font-weight: 600;
- color: #333;
- }
-
- .process-steps {
- padding: 20px;
- }
-
- .process-step {
- display: flex;
- position: relative;
- margin-bottom: 24px;
-
- &:last-child {
- margin-bottom: 0;
-
- .step-line {
- display: none;
- }
- }
- }
-
- .step-indicator {
- display: flex;
- flex-direction: column;
- align-items: center;
- margin-right: 16px;
- }
-
- .step-dot {
- width: 32px;
- height: 32px;
- border-radius: 50%;
- display: flex;
- align-items: center;
- justify-content: center;
- font-size: 14px;
- font-weight: 600;
- position: relative;
- z-index: 2;
- }
-
- .process-step.completed .step-dot {
- background: #52c41a;
- color: #fff;
- }
-
- .process-step.current .step-dot {
- background: #1890ff;
- color: #fff;
- animation: pulse 2s infinite;
- }
-
- .process-step.pending .step-dot {
- background: #d9d9d9;
- color: #999;
- }
-
- .step-line {
- width: 2px;
- height: 40px;
- background: #d9d9d9;
- margin-top: 8px;
- }
-
- .process-step.completed .step-line {
- background: #52c41a;
- }
-
- .process-step.rejected .step-dot {
- background: #ff4d4f;
- color: #fff;
- }
- .process-step.rejected .step-line {
- background: #ff4d4f;
- }
-
- .step-content {
- flex: 1;
- padding-top: 4px;
- }
-
- .step-info {
- margin-bottom: 8px;
- }
-
- .step-title {
- font-size: 16px;
- font-weight: 600;
- color: #333;
- display: block;
- margin-bottom: 4px;
- }
-
- .step-approver {
- font-size: 14px;
- color: #666;
- display: block;
- margin-bottom: 4px;
- }
-
- .step-time {
- font-size: 12px;
- color: #999;
- display: block;
- }
-
- .step-opinion {
- background: #f8f9fa;
- padding: 12px;
- border-radius: 8px;
- border-left: 4px solid #52c41a;
- }
-
- .opinion-label {
- font-size: 12px;
- color: #666;
- display: block;
- margin-bottom: 4px;
- }
-
- .opinion-content {
- font-size: 14px;
- color: #333;
- line-height: 1.5;
}
.approval-input {
@@ -517,17 +335,6 @@
border-radius: 6px;
}
- @keyframes pulse {
- 0% {
- box-shadow: 0 0 0 0 rgba(24, 144, 255, 0.7);
- }
- 70% {
- box-shadow: 0 0 0 10px rgba(24, 144, 255, 0);
- }
- 100% {
- box-shadow: 0 0 0 0 rgba(24, 144, 255, 0);
- }
- }
.signature-section {
background: #fff;
padding: 12px 16px 16px;
--
Gitblit v1.9.3