From 6e48606ee4721482f2f754b21f462704fff7ccbc Mon Sep 17 00:00:00 2001
From: pyt <626651354@qq.com>
Date: 星期二, 13 五月 2025 16:44:57 +0800
Subject: [PATCH] Merge branch 'main' of http://120.76.84.145:10101/gitblit/r/H5/leshan-laboratory
---
laboratory/src/components/approvalProcess/index.vue | 131 ++++++++++++++++++-------------------------
1 files changed, 54 insertions(+), 77 deletions(-)
diff --git a/laboratory/src/components/approvalProcess/index.vue b/laboratory/src/components/approvalProcess/index.vue
index 5a0816b..a286824 100644
--- a/laboratory/src/components/approvalProcess/index.vue
+++ b/laboratory/src/components/approvalProcess/index.vue
@@ -1,44 +1,25 @@
<template>
<div class="approval-process">
<el-timeline>
- <el-timeline-item
- v-for="(activity, index) in processData"
- :key="index"
- :type="activity.type"
- >
+ <el-timeline-item v-for="(activity, index) in processData" :key="index" :type="activity.type">
<div v-if="activity.mode === 'card'">
- <div
- class="member-list-card"
- v-for="(group, groupIndex) in activity.groups"
- :key="groupIndex"
- >
+ <div class="member-list-card" v-for="(group, groupIndex) in activity.groups" :key="groupIndex">
<div class="member-item">
<div class="member-title">
{{ group.title }}
</div>
<div class="flex-over">
- <div
- class="people-list"
- v-for="(member, memberIndex) in group.members"
- :key="memberIndex"
- >
+ <div class="people-list" v-for="(member, memberIndex) in group.members" :key="memberIndex">
<div class="people-item">
<img :src="member.avatar" alt="" class="people-img" />
<div class="member-name">{{ member.name }}</div>
</div>
<div class="member-status">
- <div
- class="member-status-text"
- :class="
- member.status === 'approved' ? 'success' : 'warning'
- "
- >
- {{ member.status === "approved" ? "同意" : "待审批" }}
+ <div class="member-status-text" :class="member.status === 'approved' ? 'success' : 'warning'
+ ">
+ {{ member.status }}
</div>
- <div
- v-if="member.status === 'approved'"
- class="member-status-time"
- >
+ <div v-if="member.status === '已确认'" class="member-status-time">
{{ member.approveTime }}
</div>
</div>
@@ -47,18 +28,17 @@
</div>
</div>
</div>
- <div
- v-else
- class="approval-process-item"
- :class="activity.type === 'primary' ? '' : 'approval-process-item1'"
- >
- <div
- v-for="(field, idx) in activity.fields"
- :key="idx"
- style="margin-bottom: 6px"
- >
- <span>{{ field.label }}</span>
- <span>{{ field.value }}</span>
+ <div v-else class="approval-process-item" :class="activity.type === 'primary' ? '' : 'approval-process-item1'">
+ <div v-for="(field, idx) in activity.fields" :key="idx" style="margin-bottom: 6px">
+ <span v-if="field.type == 'img'">
+ <el-image style="width: 50px; height: 50px;margin-left: 40px;" v-if="field.value" :src="field.value"
+ :preview-src-list="[field.value]">
+ </el-image>
+ </span>
+ <span v-else>
+ <span>{{ field.label }}</span>
+ <span>{{ field.value }}</span>
+ </span>
</div>
</div>
</el-timeline-item>
@@ -108,19 +88,16 @@
// {
// title: '工艺工程师',
// members: [
- // {
- // fields: [
- // { label: '姓名', value: '张三' },
- // { label: '状态', value: '同意' },
- // { label: '审批时间', value: '2025-04-08 12:30' }
- // ],
+ // {
+ // name:'',
+ // status:'',
+ // approveTime:'',
// avatar: '' // 头像地址，可选
// },
// {
- // fields: [
- // { label: '姓名', value: '李四' },
- // { label: '状态', value: '待审批' }
- // ],
+ // name:'',
+ // status:'',
+ // approveTime:'',
// avatar: ''
// }
// ]
@@ -129,15 +106,13 @@
// title: '实验员',
// members: [
// {
- // fields: [
- // { label: '姓名', value: '王五' },
- // { label: '状态', value: '同意' },
- // { label: '审批时间', value: '2025-04-08 13:00' }
- // ],
+ // name:'',
+ // status:'',
+ // approveTime:'',
// avatar: ''
// }
// ]
- // }
+ // }
// ]
// }
// ]
@@ -213,36 +188,30 @@
border: 1px solid #dcdfe6;
margin-top: 10px;
+ // &:nth-child(1) {
+ // background: linear-gradient(
+ // to bottom,
+ // rgba(4, 156, 154, 0.2) 0%,
+ // rgba(5, 242, 194, 0) 70%
+ // );
+ // }
+
&:nth-child(1) {
- background: linear-gradient(
- to bottom,
- rgba(4, 156, 154, 0.2) 0%,
- rgba(5, 242, 194, 0) 70%
- );
+ background: linear-gradient(to bottom,
+ rgba(5, 160, 193, 0.2) 0%,
+ rgba(5, 242, 194, 0) 70%);
}
&:nth-child(2) {
- background: linear-gradient(
- to bottom,
- rgba(5, 160, 193, 0.2) 0%,
- rgba(5, 242, 194, 0) 70%
- );
+ background: linear-gradient(to bottom,
+ rgba(255, 77, 79, 0.2) 0%,
+ rgba(255, 242, 194, 0) 70%);
}
&:nth-child(3) {
- background: linear-gradient(
- to bottom,
- rgba(255, 77, 79, 0.2) 0%,
- rgba(255, 242, 194, 0) 70%
- );
- }
-
- &:nth-child(4) {
- background: linear-gradient(
- to bottom,
- rgba(250, 199, 20, 0.21) 0%,
- rgba(255, 242, 194, 0) 70%
- );
+ background: linear-gradient(to bottom,
+ rgba(250, 199, 20, 0.21) 0%,
+ rgba(255, 242, 194, 0) 70%);
}
.member-item {
@@ -261,12 +230,14 @@
text-align: left;
padding-left: 17px;
}
+
.flex-over {
margin-top: 12px;
flex: 1;
overflow: auto;
height: 100%;
}
+
.people-list {
display: flex;
justify-content: space-between;
@@ -275,6 +246,7 @@
margin-top: 12px;
display: flex;
+
.people-item {
display: flex;
align-items: center;
@@ -286,12 +258,14 @@
border-radius: 50%;
margin-right: 10px;
}
+
.member-status {
align-items: flex-end;
display: flex;
flex-direction: column;
justify-content: space-between;
}
+
.member-status-text {
width: 52px;
height: 22px;
@@ -300,6 +274,7 @@
text-align: center;
border: 1px solid rgba(0, 0, 0, 0.15);
}
+
.warning {
background: #fffbe6;
border-radius: 4px;
@@ -309,12 +284,14 @@
font-size: 12px;
color: #faad14;
}
+
.success {
font-family: PingFangSC, PingFang SC;
font-weight: 400;
font-size: 12px;
color: rgba(0, 0, 0, 0.88);
}
+
.member-status-time {
font-family: PingFang-SC, PingFang-SC;
font-weight: 500;
--
Gitblit v1.7.1