Merge branch 'main' of http://120.76.84.145:10101/gitblit/r/H5/leshan-labor...

pyt

9 天以前 6e48606ee4721482f2f754b21f462704fff7ccbc

 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;