修复场景报告中设备图片选择弹框错误问题

riku

2024-11-21 dc16b68e74c18b617c8f79d82fd3c3306badbcbe

 src/views/fysp/data-product/ProdSceneReport.vue

@@ -5,6 +5,7 @@
    </template>
    <template #aside>
      <SideList
        legend
        :items="subtasks"
        :loading="sideLoading"
        @item-click="chooseSubtask"
@@ -12,6 +13,7 @@
    </template>
    <template #main>
      <el-scrollbar class="el-scrollbar" v-loading="mainLoading">
        <div></div>
        <CompSceneConstructionInfo
          title="A、基本信息"
          :scene="formScene"
@@ -80,7 +82,15 @@
    @submit="handleSelectAnyPhoto"
    :defaultFile="[sceneImg]"
  ></ArbitraryPhoto>
  <el-dialog
  <FYImageSelectDialog
    v-model:dialog-visible="deiveceImgDialog"
    title="设备图片"
    :max-select="1"
    :typeList="showDeviceTypeList"
    :typeImgMap="showDeviceImgMap"
    @submit="handleSelectDevicePhoto"
  ></FYImageSelectDialog>
  <!-- <el-dialog
    title="设备图片"
    width="66%"
    v-model="deiveceImgDialog"
@@ -88,10 +98,10 @@
  >
    <CompDevicePhono
      @selectPhonoEvent="handleSelectDevicePhoto"
      :imgPathsDataSource="showDeviceImgList"
      :imgPathsDataSource="showDeviceImgMap"
    >
    </CompDevicePhono>
  </el-dialog>
  </el-dialog> -->
</template>
<script setup>
import { ref, computed } from 'vue';
@@ -105,10 +115,10 @@
import { enumDevice, toLabel } from '@/enum/device/device';
import { exportDocx } from '@/utils/doc';
import right_triangle from '@/assets/image/right_triangle.png';
import ProCheckProxy from '@/views/fysp/check/ProCheckProxy';

import CompSceneConstructionInfo from '@/views/fysp/scene/CompSceneConstructionInfo.vue';
import ArbitraryPhoto from '@/views/fysp/check/components/ArbitraryPhoto.vue';
import CompDevicePhono from '@/views/fysp/check/components/CompDevicePhono.vue';
import CompImgInfo from '@/views/fysp/data-product/components/CompImgInfo.vue';
import CompProblemTable from './components/CompProblemTable.vue';
import dayjs from 'dayjs';
@@ -146,8 +156,9 @@
  taskApi.getSubtaskSummary(param).then((res) => {
    const list = [];
    res.forEach((s) => {
      const t = getSubtaskType(s);
      const t = ProCheckProxy.getSubtaskType(s);
      list.push({
        status: s.subtask.status,
        type: t,
        title: s.stName,
        categoly: s.stPlanTime.split('T')[0],
@@ -210,36 +221,37 @@
// 设备图片选择对话框
const deiveceImgDialog = ref(false);
const showDeviceIndex = ref(0);
const showDeviceImgList = ref([]);
const showDeviceTypeList = ref([]);
const showDeviceImgMap = ref(new Map());
// 设备图片列表
const deviceList = ref([]);

function showDevicePhotoDialog(device, index) {
  showDeviceIndex.value = index;
  deiveceImgDialog.value = true;
  showDeviceImgList.value = [];
  showDeviceTypeList.value = [
    { typeId: device.topTypeId, typeName: device._deviceTypeName }
  ];
  showDeviceImgMap.value.clear();
  let imgList = [];
  device._status
    .map((s) => s._picUrls)
    .forEach((pics) => {
      imgList = imgList.concat(
        pics.map((p) => {
          return {
            topTypeId: device.topTypeId,
            _picUrl: p
          };
          return { url: p };
        })
      );
    });
  // console.log(imgList);

  showDeviceImgList.value = imgList;
  showDeviceImgMap.value.set(device.topTypeId, imgList);
}

function handleSelectDevicePhoto(data) {
  deiveceImgDialog.value = false;
  if (data.length > 0) {
    deviceList.value[showDeviceIndex.value]._showStatusPic = data[0]._picUrl;
    deviceList.value[showDeviceIndex.value]._showStatusPic = data[0].url;
  }
}

@@ -354,8 +366,12 @@
      _showStatusPic_1: d1._showStatusPic ? d1._showStatusPic : right_triangle,
      _deviceTypeName_1: d1._deviceTypeName,
      // hasPic2: d2 ? true : false,
      _showStatusPic_2: d2 ? (d2._showStatusPic ? d2._showStatusPic : right_triangle) : right_triangle,
      _deviceTypeName_2: d2 ? d2._deviceTypeName : '',
      _showStatusPic_2: d2
        ? d2._showStatusPic
          ? d2._showStatusPic
          : right_triangle
        : right_triangle,
      _deviceTypeName_2: d2 ? d2._deviceTypeName : ''
    });
  }
  const param = {