riku
2025-07-15 c40f4c1267dae4fcf27dbbd75ea83014fba87783
src/views/fysp/check/components/CompProblemCard.vue
@@ -1,15 +1,19 @@
<template>
  <el-card class="layout" shadow="hover">
    <el-steps
      :active="proStatus.index"
      finish-status="success"
      style=""
      align-center
    >
      <el-step v-for="(s, i) in getSteps" :key="i" :title="s" />
    </el-steps>
  <el-card class="layout" shadow="never">
    <!-- <el-row justify="space-between"> -->
    <div>
      <el-steps
        :active="proStatus.index"
        finish-status="success"
        style=""
        align-center
      >
        <el-step v-for="(s, i) in getSteps" :key="i" :title="s" />
      </el-steps>
    </div>
    <!-- </el-row> -->
    <el-descriptions :column="3" size="small">
    <el-descriptions :column="2" size="small" border>
      <template #title>
        <span class="d-index">{{ index }}</span>
        <span class="d-title">{{ title }}</span>
@@ -30,8 +34,14 @@
        v-for="(d, i) in descriptions"
        :key="i"
        :label="d.name"
        >{{ d.value }}</el-descriptions-item
      >
        <template #label>
          <el-text tag="b" size="small">
            {{ d.name }}
          </el-text>
        </template>
        {{ d.value }}
      </el-descriptions-item>
    </el-descriptions>
    <el-scrollbar>
@@ -50,6 +60,11 @@
                t == 0 ? 'descriptions-label-1' : 'descriptions-label-2'
              "
            >
              <template #label>
                <el-text tag="b" size="small">
                  {{ pic.title }}
                </el-text>
              </template>
              <el-space>
                <el-image
                  v-for="(p, i) in pic.path"
@@ -89,11 +104,22 @@
            type="danger"
            size="small"
            @click="deletePro"
            :disabled="!proStatus.deletable"
            :disabled="true"
            >删除</el-button
          >
          <!-- <el-button
            type="danger"
            size="small"
            @click="deletePro"
            :disabled="!proStatus.deletable"
            >删除</el-button
          > -->
          <!-- 审核驳回操作 -->
          <el-button
            v-if="proStatus.name.indexOf('不通过') != -1"
            v-if="
              this.problem.extension3 == 'fail' ||
              this.problem.extension3 == 'change_fail'
            "
            type="danger"
            size="small"
            @click="revokePro"
@@ -106,12 +132,12 @@
            size="small"
            @click="rejectPro"
            :disabled="!proStatus.checkable"
            >驳回</el-button
            >审核驳回</el-button
          >
          <el-button
            v-if="
              proStatus.name.indexOf('不通过') == -1 &&
              proStatus.name.indexOf('通过') != -1
              this.problem.extension3 == 'pass' ||
              this.problem.extension3 == 'change_pass'
            "
            type="danger"
            size="small"
@@ -125,7 +151,7 @@
            size="small"
            @click="passPro"
            :disabled="!proStatus.checkable"
            >通过</el-button
            >审核通过</el-button
          >
        </el-row>
      </el-col>
@@ -233,11 +259,11 @@
        },
        {
          bef: '问题待整改',
          aft: '问题已整改'
          aft: '整改已上传'
        },
        {
          bef: '整改待审核',
          aft: '整改已审核'
          aft: '问题已整改'
        }
      ]
    };
@@ -250,16 +276,28 @@
    },
    // 问题描述
    descriptions() {
      return [
      const des = [
        {
          icon: 'Location',
          name: '问题位置',
          value: this.problem.location
        },
        {
          icon: 'Clock',
          name: '提交时间',
          value: this.problem.time.replace('T', ' ').split('.')[0]
        }
      ];
      if (this.problem.ischanged) {
        des.push({
          icon: 'Clock',
          name: '整改时间',
          value: this.problem.changedtime
            ? this.problem.changedtime.replace('T', ' ').split('.')[0]
            : this.problem.time.replace('T', ' ').split('.')[0]
        });
      }
      return des;
    },
    // 问题图片
    pics() {
@@ -290,8 +328,7 @@
      this.$emit('submit', isOk);
      this.proAddOrUpdDialogVisible = false;
    },
    onChangeCanceled() {
    },
    onChangeCanceled() {},
    onChangeSubmited(isOk) {
      this.$emit('submit', isOk);
      this.changeDialogVisible = false;
@@ -339,7 +376,7 @@
            .checkProblem({ pId: pro.guid, action: action })
            .then((res) => {
              if (res.success) {
                pro.extension3 = status
                pro.extension3 = status;
                this.$emit('check');
              }
            });
@@ -361,7 +398,7 @@
            .checkProblem({ pId: pro.guid, action: action })
            .then((res) => {
              if (res.success) {
                pro.extension3 = status
                pro.extension3 = status;
                this.$emit('check');
              }
            });
@@ -404,15 +441,16 @@
<style scoped>
.layout {
  background-color: transparent;
  margin-top: 20px;
  margin-bottom: 20px;
  /* border: none; */
  border-color: rgba(0, 0, 0, 0.308);
  /* border-color: rgba(0, 0, 0, 0.308); */
}
.image {
  width: 200px;
  height: 210px;
  width: 240px;
  height: 250px;
  border-radius: 4px;
  margin-bottom: 6px;
}
.d-index {
@@ -436,13 +474,71 @@
.d-extra {
}
.descriptions-label-1 {
  color: whitesmoke;
  background: var(--el-color-danger-light-3);
:deep(.descriptions-label-1) {
  /* color: whitesmoke; */
  /* background: var(--el-color-danger-light-3); */
}
.descriptions-label-2 {
  color: whitesmoke;
  background-color: var(--el-color-success-light-3);
  /* color: whitesmoke; */
  /* background-color: var(--el-color-success-light-3); */
}
</style>
<!-- 步骤条自定义样式 -->
<style scoped>
:deep(.el-steps--simple) {
  background: #fffbf731;
}
:deep(.is-wait .el-step__icon) {
  height: 17px;
  width: 17px;
  margin-top: 3px;
}
:deep(.is-wait .is-text .el-step__icon-inner) {
  font-size: var(--el-font-size-small);
}
:deep(.is-success .el-step__icon) {
  height: 17px;
  width: 17px;
  margin-top: 3px;
}
:deep(.is-success .is-text .el-step__icon-inner) {
  font-size: var(--el-font-size-small);
}
:deep(.el-step__head.is-process) {
  border-color: var(--el-color-danger);
  color: var(--el-color-danger);
}
:deep(.el-step__head.is-wait) {
  border-color: var(--el-text-color-placeholder);
  color: var(--el-text-color-placeholder);
}
:deep(.el-step__head.is-success) {
  border-color: var(--el-color-success-light-3);
  color: var(--el-color-success-light-3);
}
:deep(.el-step__title.is-process) {
  color: var(--el-color-danger);
  font-weight: bolder;
  font-size: var(--el-font-size-large);
}
:deep(.el-step__title.is-wait) {
  color: var(--el-text-color-placeholder);
  font-size: var(--el-font-size-small);
}
:deep(.el-step__title.is-success) {
  color: var(--el-color-success-light-3);
  font-size: var(--el-font-size-small);
}
</style>