riku
2024-11-19 71030e1f80635b7332136a488bc2cc8bd36fc04c
src/views/fysp/check/components/CompProblemAddOrUpd.vue
@@ -1,6 +1,21 @@
<template>
  <div class="main-container">
    <el-form :model="problem" label-width="auto" style="max-width: 95%">
      <el-form-item label="问题位置" prop="locationid">
        <el-select
          v-model="deepCopyProblem.locationid"
          @change="onProLocationChange"
          class="row"
          :disabled="readonly"
        >
          <el-option
            v-for="item in posList"
            :key="item.index"
            :label="item.text"
            :value="item.index"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="问题类型" prop="proType">
        <el-select
          v-model="proType"
@@ -31,26 +46,22 @@
          />
        </el-select>
      </el-form-item>
      <el-form-item label="问题位置" prop="locationid">
        <el-select
          v-model="deepCopyProblem.locationid"
          @change="onProLocationChange"
      <el-form-item label="补充说明" :disabled="readonly" prop="proRemark">
        <el-input
          v-model="proRemark"
          type="textarea"
          @change="onProRemarkChange"
          class="row"
          placeholder="请输入"
          :disabled="readonly"
        >
          <el-option
            v-for="item in posList"
            :key="item.index"
            :label="item.text"
            :value="item.index"
          />
        </el-select>
        />
      </el-form-item>
      <el-form-item label="问题建议" prop="advise">
        <el-select
          v-model="deepCopyProblem.advise"
          class="row"
          :disabled="readonly"
          @change="onProAdviseChange"
        >
          <el-option
            v-for="item in adviseOptions"
@@ -60,28 +71,46 @@
          />
        </el-select>
      </el-form-item>
      <el-form-item label="补充说明" :disabled="readonly" prop="proRemark">
      <el-form-item
        v-show="deepCopyProblem.advise && deepCopyProblem.advise != ''"
        label="问题建议修正"
        prop="_adviseEdit"
        :disabled="false"
      >
        <el-input
          v-model="proRemark"
          v-model="deepCopyProblem._adviseEdit"
          type="textarea"
          @change="onProRemarkChange"
          @change="onProAdviseEditChange"
          class="row"
          placeholder="请输入"
          placeholder="请输入问题建议修正"
          :disabled="readonly"
        />
      </el-form-item>
      <div class="t-card_item">
        问题图片&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        <div>
          <el-button @click="chosePicFromAnyPic" v-show="!readonly"
          <el-button
            @click="chosePicFromAnyPic"
            v-show="!readonly"
            :disabled="fileList.length >= 3"
            >从场景图片选取</el-button
          >
          <el-button @click="chosePicFromDevicePic" v-show="!readonly"
          <el-button
            @click="chosePicFromDevicePic"
            v-show="!readonly"
            :disabled="fileList.length >= 3"
            >从设备图片选取</el-button
          >
          <el-button @click="chosePicFromLedgerPic" v-show="!readonly"
          <el-button
            @click="chosePicFromLedgerPic"
            v-show="!readonly"
            :disabled="fileList.length >= 3"
            >从台账选取</el-button
          >
          <el-button @click="choseChangePic" v-show="!readonly"
          <el-button
            @click="choseChangePic"
            v-show="!readonly"
            :disabled="fileList.length >= 3"
            >从文件夹选取</el-button
          >
        </div>
@@ -99,14 +128,20 @@
        :disabled="readonly"
        accept="image/*"
      >
        <el-button
          type="primary"
          id="uploadBtnId"
          style="display: none"
        ></el-button>
        <el-icon v-show="fileList.length != 3">
          <Plus />
        </el-icon>
        <template #trigger v-if="fileList.length < 3 && !readonly">
          <el-button
            v-if="fileList.length < 3"
            type="primary"
            id="uploadBtnId"
            style="display: none"
          ></el-button>
          <el-icon>
            <Plus />
          </el-icon>
        </template>
        <template #tip>
          <div style="color: #f56c6c">最少上传一张图片,最多选择三张图片</div>
        </template>
      </el-upload>
      <el-form-item>
        <el-button type="primary" @click="onSubmit" v-show="!readonly"
@@ -119,48 +154,35 @@
    </el-form>
    <ArbitraryPhoto
      :max-select="3"
      :max-select="maxSelectImgCount - fileList.length"
      v-if="anyPhotoDialog"
      v-model:dialog-visible="anyPhotoDialog"
      @selectByAnyPhonoEvent="handleSelectedAnyPhono"
      @submit="handleSelectedAnyPhono"
      :subtask="subtask"
      :defaultFile="fileList"
      ref="arbitraryPhotoRef"
    >
    </ArbitraryPhoto>
    <el-dialog
      title="台账图片"
      width="80%"
      v-model="ledgerPicDialog"
      :before-close="beforeLedgerPicDialogclose"
      class="dialog_style"
    <CompLedgerPhoto
      :max-select="maxSelectImgCount - fileList.length"
      v-if="ledgerPicDialog"
      v-model:dialog-visible="ledgerPicDialog"
      @submit="handleLedgerPicPhono"
      :subtask="subtask"
      :defaultFile="fileList"
      ref="ledgerPhotoRef"
    ></CompLedgerPhoto>
    <CompDevicePhoto
      :max-select="maxSelectImgCount - fileList.length"
      v-if="deiveceImgDialog"
      v-model:dialog-visible="deiveceImgDialog"
      @submit="handleSelectedDevicePhono"
      :subtask="subtask"
      :defaultFile="fileList"
      ref="deiveceImgDialogRef"
    >
      <LedgerPic
        v-if="ledgerPicDialog"
        @selectByLedgerPicEvent="handleLedgerPicPhono"
        :month="month"
        :subtask="subtask"
        :defaultFile="fileList"
        ref="ledgerPicRef"
      >
      </LedgerPic>
    </el-dialog>
    <el-dialog
      title="设备图片"
      width="80%"
      v-model="deiveceImgDialog"
      :before-close="beforeDeiveceImgDialogclose"
      class="dialog_style"
    >
      <CompDevicePhono
        v-if="deiveceImgDialog"
        @selectPhonoEvent="handleSelectedDevicePhono"
        :imgPathsDataSource="deviceImgObjList"
        :defaultFile="fileList"
        ref="deiveceImgDialogRef"
      >
      </CompDevicePhono>
    </el-dialog>
    </CompDevicePhoto>
    <el-dialog v-model="previewDialogVisible">
      <img w-full :src="previewDialogImageUrl" alt="预览" class="preview-pic" />
    </el-dialog>
@@ -169,19 +191,20 @@
<script>
import ArbitraryPhoto from './ArbitraryPhoto.vue';
import LedgerPic from './CompLedgerPic.vue';
import CompDevicePhono from './CompDevicePhono.vue';
import CompLedgerPhoto from './CompLedgerPhoto.vue';
import CompDevicePhoto from './CompDevicePhoto.vue';
import problemApi from '@/api/fysp/problemApi.js';
import { $fysp } from '@/api/index.js';
import fileUtil from '@/utils/fileUtils.js';
import { get, useCloned } from '@vueuse/core';
import {  useCloned } from '@vueuse/core';
import { ElMessage } from 'element-plus';
import deviceApi from '@/api/fysp/deviceApi';
export default {
  components: {
    ArbitraryPhoto,
    LedgerPic,
    CompDevicePhono
    CompDevicePhoto,
    CompLedgerPhoto
  },
  props: {
    readonly: {
@@ -212,6 +235,8 @@
  },
  data() {
    return {
      // 图片选择最大数量
      maxSelectImgCount: 3,
      previewDialogVisible: false,
      previewDialogImageUrl: '',
      // 设备图片列表
@@ -276,6 +301,14 @@
        this.pictureValidate();
      },
      deep: true
    },
    // 当问题建议改变时问题建议修正跟着改变
    deepCopyProblem: {
      handler(nv, ov) {
        // 图片校验
        nv._adviseEdit = ov.advise;
      },
      deep: true
    }
  },
  computed: {
@@ -300,10 +333,19 @@
      }, []);
    },
    adviseOptions() {
      var problemGuid = this.currProTypeGuid || this.problem.guid;
      var array = this.suggestions.filter(
      console.log(this.currProTypeGuid, this.problem.guid, this.suggestions);
      let problemGuid = this.currProTypeGuid || this.problem.guid;
      let array = this.suggestions.filter(
        (item) => item.adProblemtypeguid == problemGuid
      );
      console.log(
        this.suggestions.filter(
          (item) => item.adProblemtypeguid == problemGuid
        ),
        this.adviseOptions
      );
      return array;
    }
  },
@@ -312,6 +354,9 @@
    this.getDeviceImgList();
  },
  methods: {
    onProAdviseChange(value) {
      this.deepCopyProblem._adviseEdit = this.deepCopyProblem.advise;
    },
    handlePictureCardPreview(uploadFile) {
      this.previewDialogVisible = true;
      this.previewDialogImageUrl = uploadFile.url;
@@ -403,9 +448,12 @@
        this.deepCopyProblem = {};
      } else {
        this.deepCopyProblem = useCloned(this.problem).cloned.value;
        this.currProTypeGuid = this.problem.guid;
        this.deepCopyProblem._adviseEdit = this.deepCopyProblem.advise;
      }
      this.type = 'guid' in this.deepCopyProblem ? 1 : 0;
      // 获取问题类型
      let data = {
        sceneTypeId: this.subtask.sceneTypeId,
@@ -483,7 +531,6 @@
      }
    },
    handleLedgerPicPhono(data) {
      this.beforeLedgerPicDialogclose();
      let isExist = false;
      for (const item of data) {
        for (const already of this.fileList) {
@@ -520,9 +567,13 @@
    onProRemarkChange(value) {
      this.changeProblemname();
    },
    onProAdviseEditChange(value) {},
    onProTypeChange(value) {
      this.deepCopyProblem.description = '';
      this.deepCopyProblem.advise = '';
      // 默认问题描述和问题建议为第一个
      this.currProTypeGuid = this.descriptionOptions[0].guid;
      this.deepCopyProblem.description = this.descriptionOptions[0].description;
      this.deepCopyProblem.advise = this.adviseOptions[0].adName;
      this.deepCopyProblem._adviseEdit = this.deepCopyProblem.advise;
    },
    findProByProDesName(name) {
      let result;
@@ -653,17 +704,16 @@
      }
    },
    handleSelectedDevicePhono(data) {
      this.beforeDeiveceImgDialogclose();
      let isExist = false;
      for (const item of data) {
        for (const already of this.fileList) {
          if (item._picUrl == already.url) {
          if (item.url == already.url) {
            isExist = true;
          }
        }
        if (!isExist) {
          this.fileList.push({
            url: item._picUrl,
            url: item.url,
            name: '1'
          });
        }