Merge branch 'hc-dataproduct-v1112' into lsf-dataproduct-1024

riku

2024-11-19 71030e1f80635b7332136a488bc2cc8bd36fc04c

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

@@ -1,8 +1,28 @@
<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" @change="onProTypeChange" class="row" :disabled="readonly">
        <el-select
          v-model="proType"
          @change="onProTypeChange"
          class="row"
          :disabled="readonly"
        >
          <el-option
            v-for="item in problemTypeOptions"
            :key="item.typeid"
@@ -22,32 +42,7 @@
            v-for="item in descriptionOptions"
            :key="item.guid"
            :label="item.description"
            :value="item.guid"
          />
        </el-select>
      </el-form-item>
      <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="advise">
        <el-select v-model="deepCopyProblem.advise" class="row" :disabled="readonly">
          <el-option
            v-for="item in adviseOptions"
            :key="item.adGuid"
            :label="item.adName"
            :value="item.adName"
            :value="item.description"
          />
        </el-select>
      </el-form-item>
@@ -58,15 +53,66 @@
          @change="onProRemarkChange"
          class="row"
          placeholder="请输入"
          :disabled="readonly"
        />
      </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"
            :key="item.adGuid"
            :label="item.adName"
            :value="item.adName"
          />
        </el-select>
      </el-form-item>
      <el-form-item
        v-show="deepCopyProblem.advise && deepCopyProblem.advise != ''"
        label="问题建议修正"
        prop="_adviseEdit"
        :disabled="false"
      >
        <el-input
          v-model="deepCopyProblem._adviseEdit"
          type="textarea"
          @change="onProAdviseEditChange"
          class="row"
          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>
          <el-button @click="chosePicFromDevicePic" v-show="!readonly">从设备图片选取</el-button>
          <el-button @click="chosePicFromLedgerPic" v-show="!readonly">从台账选取</el-button>
          <el-button @click="choseChangePic" v-show="!readonly">从文件夹选取</el-button>
          <el-button
            @click="chosePicFromAnyPic"
            v-show="!readonly"
            :disabled="fileList.length >= 3"
            >从场景图片选取</el-button
          >
          <el-button
            @click="chosePicFromDevicePic"
            v-show="!readonly"
            :disabled="fileList.length >= 3"
            >从设备图片选取</el-button
          >
          <el-button
            @click="chosePicFromLedgerPic"
            v-show="!readonly"
            :disabled="fileList.length >= 3"
            >从台账选取</el-button
          >
          <el-button
            @click="choseChangePic"
            v-show="!readonly"
            :disabled="fileList.length >= 3"
            >从文件夹选取</el-button
          >
        </div>
      </div>
      <el-upload
@@ -82,85 +128,83 @@
        :disabled="readonly"
        accept="image/*"
      >
        <el-button type="primary" id="uploadBtnId" style="display: none"></el-button>
        <el-icon>
          <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">保存</el-button>
        <el-button @click="this.$emit('submited', false)" v-show="!readonly">取消</el-button>
        <el-button type="primary" @click="onSubmit" v-show="!readonly"
          >保存</el-button
        >
        <el-button @click="this.$emit('submited', false)" v-show="!readonly"
          >取消</el-button
        >
      </el-form-item>
    </el-form>
    <el-dialog
      title="任意图片"
      width="80%"
      v-model="anyPhotoDialog"
      :before-close="beforeAnyPhotoDialogclose"
      class="dialog_style"

    <ArbitraryPhoto
      :max-select="maxSelectImgCount - fileList.length"
      v-if="anyPhotoDialog"
      v-model:dialog-visible="anyPhotoDialog"
      @submit="handleSelectedAnyPhono"
      :subtask="subtask"
      :defaultFile="fileList"
      ref="arbitraryPhotoRef"
    >
      <ArbitraryPhoto
        v-if="anyPhotoDialog"
        @selectByAnyPhonoEvent="handleSelectedAnyPhono"
        :subtask="subtask"
        :defaultFile="fileList"
        ref="arbitraryPhotoRef"
      >
      </ArbitraryPhoto>
    </el-dialog>
    <el-dialog
      width="80%"
      v-model="ledgerPicDialog"
      :before-close="beforeLedgerPicDialogclose"
      class="dialog_style"
    </ArbitraryPhoto>
    <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"/>
      <img w-full :src="previewDialogImageUrl" alt="预览" class="preview-pic" />
    </el-dialog>
  </div>
</template>
<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 { 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: {
@@ -191,6 +235,8 @@
  },
  data() {
    return {
      // 图片选择最大数量
      maxSelectImgCount: 3,
      previewDialogVisible: false,
      previewDialogImageUrl: '',
      // 设备图片列表
@@ -215,11 +261,31 @@
      month: -1,
      ledgerPicDialog: false,
      rules: {
        proType: { required: true, message: '问题类型不能为空', trigger: 'change' },
        description: { required: true, message: '问题描述不能为空', trigger: 'change' },
        locationid: { required: true, message: '问题位置不能为空', trigger: 'change' },
        advise: { required: true, message: '问题建议不能为空', trigger: 'change' },
        proRemark: { required: true, message: '补充说明不能为空', trigger: 'change' }
        proType: {
          required: true,
          message: '问题类型不能为空',
          trigger: 'change'
        },
        description: {
          required: true,
          message: '问题描述不能为空',
          trigger: 'change'
        },
        locationid: {
          required: true,
          message: '问题位置不能为空',
          trigger: 'change'
        },
        advise: {
          required: true,
          message: '问题建议不能为空',
          trigger: 'change'
        },
        proRemark: {
          required: true,
          message: '补充说明不能为空',
          trigger: 'change'
        }
      },
      deviceTopTypes: [
        { id: 0, label: '监控设备' },
@@ -231,9 +297,16 @@
  watch: {
    fileList: {
      handler(newFileList, oldFileList) {
        console.log('newFileList', newFileList);
        // 图片校验
        this.pictureValidate();
      },
      deep: true
    },
    // 当问题建议改变时问题建议修正跟着改变
    deepCopyProblem: {
      handler(nv, ov) {
        // 图片校验
        nv._adviseEdit = ov.advise;
      },
      deep: true
    }
@@ -241,11 +314,13 @@
  computed: {
    descriptionOptions() {
      const descriptions = [];

      this.problemTypeList.forEach((item) => {
        if (item.typename == this.proType) {
          descriptions.push(item);
        }
      });

      return descriptions;
    },
    problemTypeOptions() {
@@ -258,8 +333,18 @@
      }, []);
    },
    adviseOptions() {
      var array = this.suggestions.filter((item) => item.adProblemtypeguid == this.currProTypeGuid);
      console.log('adName', array);
      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;
    }
@@ -269,6 +354,9 @@
    this.getDeviceImgList();
  },
  methods: {
    onProAdviseChange(value) {
      this.deepCopyProblem._adviseEdit = this.deepCopyProblem.advise;
    },
    handlePictureCardPreview(uploadFile) {
      this.previewDialogVisible = true;
      this.previewDialogImageUrl = uploadFile.url;
@@ -281,18 +369,16 @@
      // 将一个js对象中所有di，wi，pi开头的属性全部改成去掉这些前缀并且重新变为驼峰式命名
      const newObj = {};
      for (const key in obj) {
        if (obj.hasOwnProperty(key)) {
          let newKey = key;
          if (key.startsWith('di')) {
            newKey = key.substring(2);
          } else if (key.startsWith('wi')) {
            newKey = key.substring(2);
          } else if (key.startsWith('pi')) {
            newKey = key.substring(2);
          }
          newKey = newKey.charAt(0).toLowerCase() + newKey.slice(1);
          newObj[newKey] = obj[key];
        let newKey = key;
        if (key.startsWith('di')) {
          newKey = key.substring(2);
        } else if (key.startsWith('wi')) {
          newKey = key.substring(2);
        } else if (key.startsWith('pi')) {
          newKey = key.substring(2);
        }
        newKey = newKey.charAt(0).toLowerCase() + newKey.slice(1);
        newObj[newKey] = obj[key];
      }
      return newObj;
    },
@@ -315,57 +401,59 @@
      this.deviceImgObjList = [];
      for (const deviceTopTypeElement of this.deviceTopTypes) {
        const topTypeId = deviceTopTypeElement.id;
        await deviceApi.fetchDevices(this.subtask.sceneId, topTypeId).then((result) => {
          // 标准化属性名
          for (let i = 0; i < result.data.length; i++) {
            var element = this.convertKeys(result.data[i]);
            // 获取设备状态信息
            let data = {
              deviceId: element.id,
              sceneId: element.sceneGuid,
              deviceTypeId: topTypeId
            };
            deviceApi
              .fetchDeviceStatus(data)
              .then((status) => {
                var statusData = status.data;
                var imgPaths = [];
        await deviceApi
          .fetchDevices(this.subtask.sceneId, topTypeId)
          .then((result) => {
            // 标准化属性名
            for (let i = 0; i < result.data.length; i++) {
              var element = this.convertKeys(result.data[i]);
              // 获取设备状态信息
              let data = {
                deviceId: element.id,
                sceneId: element.sceneGuid,
                deviceTypeId: topTypeId
              };
              deviceApi
                .fetchDeviceStatus(data)
                .then((status) => {
                  var statusData = status.data;
                  var imgPaths = [];

                if (statusData) {
                  if (statusData.length == 0) {
                    this.deviceImgObjList.push(element);
                    return;
                  }
                  element = this.convertKeys(result.data[i]);
                  for (let j = 0; j < statusData.length; j++) {
                    // 复制出一个设备对象
                    var newDevice = useCloned(element).cloned.value;
                    const statusItem = statusData[j];
                    // 设备对象添加一个属性列表属性用来保存设备状态
                    this.saveStatus(newDevice, statusItem);
                    newDevice.dlLocation = statusItem.dlLocation;
                    newDevice.topTypeId = topTypeId;
                    console.log('newDevice.topTypeId', newDevice.topTypeId);
                    console.log('newDevice', newDevice);
                  if (statusData) {
                    if (statusData.length == 0) {
                      this.deviceImgObjList.push(element);
                      return;
                    }
                    element = this.convertKeys(result.data[i]);
                    for (let j = 0; j < statusData.length; j++) {
                      // 复制出一个设备对象
                      var newDevice = useCloned(element).cloned.value;
                      const statusItem = statusData[j];
                      // 设备对象添加一个属性列表属性用来保存设备状态
                      this.saveStatus(newDevice, statusItem);
                      newDevice.dlLocation = statusItem.dlLocation;
                      newDevice.topTypeId = topTypeId;

                    this.deviceImgObjList.push(newDevice);
                      this.deviceImgObjList.push(newDevice);
                    }
                  }
                }
              })
              .catch((err) => {});
          }
        });
                })
                .catch((err) => {});
            }
          });
      }
    },
    initOptions() {
      if (this.problem == undefined || this.problem == null) {
        this.problem = {};
        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,
@@ -389,7 +477,10 @@
            this.deepCopyProblem.description = currDescription;
            this.proRemark = '';
          } else {
            currDescription = currProName.substring(0, currProName.lastIndexOf('('));
            currDescription = currProName.substring(
              0,
              currProName.lastIndexOf('(')
            );

            this.problemTypeList.forEach((item) => {
              if (item.description === currDescription) {
@@ -422,10 +513,6 @@
      // 问题建议
      problemApi.getSuggestion().then((res) => {
        this.suggestions = res.data;
        // 填充当前问题建议
        this.deepCopyProblem.advise = this.suggestions.filter(
          (item) => item.adProblemtypeguid == this.deepCopyProblem.guid
        )[0].adName;
      });

      // 问题位置
@@ -443,8 +530,7 @@
        this.oldFileList.filter((item) => item.url != file.url);
      }
    },
    handleLedgerPicPhono() {
      this.beforeLedgerPicDialogclose();
    handleLedgerPicPhono(data) {
      let isExist = false;
      for (const item of data) {
        for (const already of this.fileList) {
@@ -461,9 +547,6 @@
        isExist = false;
      }
    },
    beforeLedgerPicDialogclose() {
      this.ledgerPicDialog = false;
    },
    findProTypeByGuid(guid) {
      let result;
      this.problemTypeList.forEach((item) => {
@@ -474,7 +557,7 @@
      return result;
    },
    changeProblemname() {
      if (this.proRemark == null || this.proRemark == '') {
      if (!this.proRemark || this.proRemark == null || this.proRemark == '') {
        this.deepCopyProblem.problemname = this.deepCopyProblem.description;
      } else {
        this.deepCopyProblem.problemname =
@@ -484,19 +567,34 @@
    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;
      this.problemTypeList.forEach((item) => {
        if (item.description == name) {
          result = item;
        }
      });
      return result;
    },
    onProDesChange(value) {
      let currPro = this.findProTypeByGuid(value);
      let currPro = this.findProByProDesName(value);
      this.deepCopyProblem.advise = '';
      this.currProTypeGuid = value;
      this.deepCopyProblem.description = currPro.description;
      this.currProTypeGuid = currPro.guid;
      // this.deepCopyProblem.description = currPro.description;
      this.changeProblemname();
      this.deepCopyProblem.advise = '';

      this.deepCopyProblem.advise = this.adviseOptions[0].adName;
      var adName =
        this.adviseOptions.length == 0 ? '' : this.adviseOptions[0].adName;
      this.deepCopyProblem.advise = adName;
    },
    onProLocationChange(value) {
      this.posList.forEach((item) => {
@@ -550,7 +648,6 @@
          }
          exclude = false;
          // picUrls.push(item)
        } else {
        }
      });
      if (this.type == 1) {
@@ -569,13 +666,14 @@
        const deepCopySubTask = useCloned(this.subtask).cloned.value;
        const that = this;
        fileUtil.getImageFiles(picUrls, function (files) {
          console.log('deepCopySubTask', deepCopySubTask);
          deepCopyPro.insGuid = deepCopySubTask.insGuid;
          delete deepCopyPro['advise'];
          delete deepCopyPro['description'];
          deepCopyPro.proName = deepCopyPro.problemname;
          delete deepCopyPro['problemname'];
          deepCopyPro.ptGuid = that.findProTypeByGuid(that.currProTypeGuid).guid;
          deepCopyPro.ptGuid = that.findProTypeByGuid(
            that.currProTypeGuid
          ).guid;
          deepCopyPro.locationId = deepCopyPro.locationid;
          delete deepCopyPro['locationid'];
          data.append('problemVo', JSON.stringify(deepCopyPro));
@@ -606,24 +704,6 @@
      }
    },
    handleSelectedDevicePhono(data) {
      this.beforeDeiveceImgDialogclose();
      let isExist = false;
      for (const item of data) {
        for (const already of this.fileList) {
          if (item._picUrl == already.url) {
            isExist = true;
          }
        }
        if (!isExist) {
          this.fileList.push({
            url: item._picUrl,
            name: '1'
          });
        }
        isExist = false;
      }
    },
    handleLedgerPicPhono(data) {
      let isExist = false;
      for (const item of data) {
        for (const already of this.fileList) {
@@ -639,8 +719,6 @@
        }
        isExist = false;
      }

      this.beforeAnyPhotoDialogclose();
    },
    chosePicFromAnyPic() {
      this.anyPhotoDialog = true;
@@ -705,10 +783,6 @@
.row {
  width: 100%;
}

::v-deep .el-dialog__body {
  width: 95%;
}
::v-deep .el-upload-list--picture-card .el-upload-list__item-thumbnail {
  object-fit: cover !important;
}
@@ -717,4 +791,7 @@
  width: 100%;
  height: 100%;
}
::v-deep .el-upload--picture-card {
  border: 0 !important;
}
</style>