巡查单据自动下载功能（待完成）

riku

2025-06-24 4fbdf4c6b13d19b9be54900b5dcff29e2ca7ef01

 src/views/fysp/check/components/CompProblemCard.vue

@@ -1,10 +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>
@@ -25,18 +34,37 @@
        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>
      <el-descriptions title=" " :column="2" direction="vertical" size="small" border>
      <el-descriptions
        title=" "
        :column="2"
        direction="vertical"
        size="small"
        border
      >
        <template v-for="(pic, t) in pics" :key="t">
          <template v-if="pic.path.length > 0">
            <el-descriptions-item
              :label="pic.title"
              :label-class-name="t == 0 ? 'descriptions-label-1' : 'descriptions-label-2'"
              :label-class-name="
                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"
@@ -59,71 +87,109 @@
    <el-row v-if="true" style="margin-top: 16px">
      <el-col :span="12">
        <el-row justify="start" class="btn-group">
          <el-button type="success" size="small" @click="updatePro" plain>问题更正</el-button>
          <el-button
            type="primary"
            size="small"
            @click="updateChange"
            plain
            :disabled="!proStatus.changeable"
          <el-button type="success" size="small" @click="updatePro" plain
            >问题更正</el-button
          >
          <el-button type="primary" size="small" @click="updateChange" plain
            >整改检验</el-button
          >
          <el-button type="info" size="small" @click="currProRecent" plain>问题复现</el-button>
          <el-button type="info" size="small" @click="currProRecent" plain
            >问题复现</el-button
          >
        </el-row>
      </el-col>
      <el-col :span="12">
        <el-row justify="end" class="btn-group">
          <el-button type="danger" size="small" @click="deletePro" :disabled="!proStatus.deletable"
          <el-button
            type="danger"
            size="small"
            @click="deletePro"
            :disabled="true"
            >删除</el-button
          >
          <el-button type="warning" size="small" @click="rejectPro" :disabled="!proStatus.checkable"
            >驳回</el-button
          <!-- <el-button
            type="danger"
            size="small"
            @click="deletePro"
            :disabled="!proStatus.deletable"
            >删除</el-button
          > -->
          <!-- 审核驳回操作 -->
          <el-button
            v-if="
              this.problem.extension3 == 'fail' ||
              this.problem.extension3 == 'change_fail'
            "
            type="danger"
            size="small"
            @click="revokePro"
            :disabled="proStatus.checkable"
            >撤销驳回</el-button
          >
          <el-button type="success" size="small" @click="passPro" :disabled="!proStatus.checkable"
            >通过</el-button
          <el-button
            v-else
            type="warning"
            size="small"
            @click="rejectPro"
            :disabled="!proStatus.checkable"
            >审核驳回</el-button
          >
          <el-button
            v-if="
              this.problem.extension3 == 'pass' ||
              this.problem.extension3 == 'change_pass'
            "
            type="danger"
            size="small"
            @click="revokePro"
            :disabled="proStatus.checkable"
            >撤销通过</el-button
          >
          <el-button
            v-else
            type="success"
            size="small"
            @click="passPro"
            :disabled="!proStatus.checkable"
            >审核通过</el-button
          >
        </el-row>
      </el-col>
    </el-row>
  </el-card>
  <el-dialog v-model="proAddOrUpdDialogVisible" :before-close="proAddOrUpdDialogClose" width="80%">
    <CompProblemAddOrUpd
      v-if="proAddOrUpdDialogVisible"
      :problem="deepCopyPro"
      :subtask="deepCopySubtask"
      :topTask="deepCopyTopTask"
      ref="compProblemAddOrUpdRef"
      @submited="onProSubmited"
    />
  </el-dialog>
  <el-dialog
    width="80%"
    title="整改检验"
    v-model="changeEditDialogVisible"
    :before-close="changeEditDialogClose"
  >
    <ComChangeEdit
      v-if="changeEditDialogVisible"
      :problemId="problem.guid"
      :oldChangeFileList="problem.mediafileList"
      :subtask="subtask"
      :month="month"
      @submited="onChangeSubmited"
    />
  </el-dialog>
  <CompProblemAddOrUpd
    title="问题更正"
    v-if="proAddOrUpdDialogVisible"
    v-model:visible="proAddOrUpdDialogVisible"
    :problem="deepCopyPro"
    :subtask="subtask"
    :topTask="topTask"
    ref="compProblemAddOrUpdRef"
    @cancel="onProCanceled"
    @submit="onProSubmited"
  />
  <!-- 整改 -->
  <ComChangeEdit
    :title="changeType == 1 ? '整改检验' : '整改提交'"
    v-if="changeDialogVisible"
    v-model:visible="changeDialogVisible"
    :changeType="changeType"
    :problemId="problem.guid"
    :subtask="subtask"
    :month="month"
    :oldChangeFileList="problem.mediafileList"
    @cancel="onChangeCanceled"
    @submit="onChangeSubmited"
  />
  <!-- 问题复现 -->
  <el-dialog
    width="80%"
  <CompProRecent
    title="问题复现"
    v-model="proRecentDialogVisible"
    :before-close="proRecentDialogClose"
  >
    <CompProRecent 
      v-if="proRecentDialogVisible" 
      :subtask="subtask"
      :topTask="topTask"
      :problem="problem"/>
  </el-dialog>
    v-if="proRecentDialogVisible"
    v-model:visible="proRecentDialogVisible"
    :subtask="subtask"
    :topTask="topTask"
    :problem="problem"
  />
</template>

<script>
@@ -135,6 +201,7 @@
import CompProRecent from './CompProRecent.vue';
import { useCloned } from '@vueuse/core';
export default {
  emits: ['check', 'submit', 'cancel'],
  components: {
    CompProblemAddOrUpd,
    ComChangeEdit,
@@ -171,9 +238,11 @@
      default: 1
    }
  },
  emits: ['submit'],
  data() {
    return {
      changeDialogVisible: false,
      changeType: -1,
      addChangeDialogVisible: false,
      // 近期情况
      proRecentDialogVisible: false,
      month: -1,
@@ -190,19 +259,16 @@
        },
        {
          bef: '问题待整改',
          aft: '问题已整改'
          aft: '整改已上传'
        },
        {
          bef: '整改待审核',
          aft: '整改已审核'
          aft: '问题已整改'
        }
      ]
    };
  },
  mounted() {
    console.log(this.topTask);
    
  },
  mounted() {},
  computed: {
    // 问题名称
    title() {
@@ -210,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() {
@@ -243,35 +321,67 @@
    }
  },
  methods: {
    // 近期情况弹窗关闭
    proRecentDialogClose() {
      this.proRecentDialogVisible = false;
    },
    newProblem() {
      this.proAddOrUpdDialogVisible = true;
    onProCanceled() {
      this.proAddOrUpdDialogVisible = false;
    },
    onProSubmited(isOk) {
      this.$emit('updated', isOk);
      this.$emit('submit', isOk);
      this.proAddOrUpdDialogVisible = false;
    },
    onChangeCanceled() {},
    onChangeSubmited(isOk) {
      console.log("zhenggaisubmit");
      
      this.$emit('updated', isOk);
      this.changeEditDialogVisible = false;
      this.$emit('submit', isOk);
      this.changeDialogVisible = false;
    },
    proAddOrUpdDialogClose() {
      this.proAddOrUpdDialogVisible = false;
    deletePro() {
      useMessageBoxTip({
        confirmMsg: '是否删除问题',
        confirmTitle: '确定',
        onConfirm: () => {
          return problemApi
            .deleteProblem({
              pid: this.problem.guid
            })
            .then((res) => {
              if (res.success) {
                this.$emit('submit');
              }
            });
        }
      });
    },
    changeEditDialogClose() {
      this.changeEditDialogVisible = false;
    },
    deletePro() {},
    rejectPro() {
      this.checkPro(false);
    },
    passPro() {
      this.checkPro(true);
    },
    revokePro() {
      const pro = this.problem;
      let status = this.proStatus;
      let doneMsg;
      if (status.index <= 2) {
        doneMsg = '问题未审核';
      } else if (status.index <= 3) {
        doneMsg = '整改未审核';
      }
      useMessageBoxTip({
        confirmMsg: `确认撤回到${doneMsg}？`,
        confirmTitle: '审核撤回',
        onConfirm: () => {
          const { status, action } = ProCheckProxy.proBeforeStatus(
            pro.extension3
          );
          return problemApi
            .checkProblem({ pId: pro.guid, action: action })
            .then((res) => {
              if (res.success) {
                pro.extension3 = status;
                this.$emit('check');
              }
            });
        }
      });
    },
    checkPro(pass) {
      const pro = this.problem;
@@ -280,27 +390,28 @@
        confirmMsg: `确认是否${doneMsg}该问题？`,
        confirmTitle: '问题审核',
        onConfirm: () => {
          const { status, action } = ProCheckProxy.proNextStatus(pro.extension3, pass);
          return problemApi.checkProblem({ pId: pro.guid, action: action }).then((res) => {
            if (res.success) {
              pro.extension3 = status;
              this.$emit('submit');
            }
          });
          const { status, action } = ProCheckProxy.proNextStatus(
            pro.extension3,
            pass
          );
          return problemApi
            .checkProblem({ pId: pro.guid, action: action })
            .then((res) => {
              if (res.success) {
                pro.extension3 = status;
                this.$emit('check');
              }
            });
        }
      });
    },
    updatePro() {
      console.log("clone", this.topTask);
      
      this.deepCopyPro = useCloned(this.problem).cloned.value;
      this.deepCopySubtask = useCloned(this.subtask).cloned.value;
      this.deepCopyTopTask = useCloned(this.topTask).cloned.value;
      this.$nextTick(() => {
        this.proAddOrUpdDialogVisible = true;
      });
    },
    updateChange() {
    getCurrentMouth() {
      // 使用Date对象解析日期字符串
      var date = new Date(this.subtask.subtask.planstarttime);
      // 获取月份信息，月份是从0开始的，所以需要加1
@@ -311,7 +422,15 @@
      // 获取年份
      var year = date.getFullYear();
      this.month = `${year}-${this.month}`;
      this.changeEditDialogVisible = true;
    },
    updateChange() {
      this.getCurrentMouth();
      if (!this.problem.ischanged) {
        this.changeType = 0;
      } else {
        this.changeType = 1;
      }
      this.changeDialogVisible = true;
    },
    currProRecent() {
      this.proRecentDialogVisible = true;
@@ -322,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 {
@@ -354,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>