riku
2025-07-15 c40f4c1267dae4fcf27dbbd75ea83014fba87783
src/views/fysp/check/components/CompProblemCard.vue
@@ -1,7 +1,7 @@
<template>
  <el-card class="layout" shadow="never">
    <!-- <el-row justify="space-between"> -->
    <div >
    <div>
      <el-steps
        :active="proStatus.index"
        finish-status="success"
@@ -13,7 +13,7 @@
    </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>
@@ -34,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>
@@ -54,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,7 +100,11 @@
      </el-col>
      <el-col :span="12">
        <el-row justify="end" class="btn-group">
          <el-button type="danger" size="small" @click="deletePro" disabled
          <el-button
            type="danger"
            size="small"
            @click="deletePro"
            :disabled="true"
            >删除</el-button
          >
          <!-- <el-button
@@ -261,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() {
@@ -423,6 +450,7 @@
  width: 240px;
  height: 250px;
  border-radius: 4px;
  margin-bottom: 6px;
}
.d-index {
@@ -446,24 +474,24 @@
.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){
:deep(.el-steps--simple) {
  background: #fffbf731;
}
:deep(.is-wait .el-step__icon){
:deep(.is-wait .el-step__icon) {
  height: 17px;
  width: 17px;
  margin-top: 3px;
@@ -473,7 +501,7 @@
  font-size: var(--el-font-size-small);
}
:deep(.is-success .el-step__icon){
:deep(.is-success .el-step__icon) {
  height: 17px;
  width: 17px;
  margin-top: 3px;
@@ -485,17 +513,17 @@
:deep(.el-step__head.is-process) {
  border-color: var(--el-color-danger);
  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)
  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)
  color: var(--el-color-success-light-3);
}
:deep(.el-step__title.is-process) {