hcong
2024-11-15 18eee6f8818b864d1f8d8fb56298620921f909e4
src/views/fysp/check/components/CompDevicePhoto.vue
@@ -1,29 +1,33 @@
<template>
  <FYImageSelectDialog
    title="设备图片"
    :typeList="typeList"
    :typeImgMap="typeImgMap"
    :maxSelect="1"
  ></FYImageSelectDialog>
</template>
<script setup>
import { ref, watch, computed } from 'vue';
import { ref, computed, onMounted } from 'vue';
import deviceApi from '@/api/fysp/deviceApi';
import { useCloned } from '@vueuse/core';
import { $fysp } from '@/api/index.js';
const props = defineProps({
  // 展示模式
  mode: {
    type: Number,
    default: 0
  },
  pics: Array
  subtask: {
    type: Array,
    default: () => []
  }
});
// typeList: [
//         { id: 0, label: '监控设备' },
//         { id: 1, label: '治理设备' },
//         { id: 2, label: '生产设备' }
//       ],
const typeList = computed(() => {
  if (props.mode == 0) {
    return [{ typeId: 0, typeName: '监控设备' }];
    return [
      { typeId: 0, typeName: '监控设备' },
      { typeId: 1, typeName: '治理设备' },
      { typeId: 2, typeName: '生产设备' }
    ];
  } else if (props.mode == 1) {
    return [{ typeId: 1, typeName: '整改' }];
  } else {
@@ -31,23 +35,69 @@
  }
});
const typeImgMap = ref(new Map());
// 标准化属性名
function convertKeys(obj) {
  // 将一个js对象中所有di,wi,pi开头的属性全部改成去掉这些前缀并且重新变为驼峰式命名
  const newObj = {};
  for (const key in obj) {
    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;
}
// 保存状态信息
function saveStatus(device, status) {
  var _picUrl = $fysp.imgUrl + status.dlPicUrl;
  device.url = _picUrl;
}
function getDeviceImgList() {
  let deviceImgMap = typeImgMap.value;
  for (const deviceTopTypeElement of typeList.value) {
    const topTypeId = deviceTopTypeElement.typeId;
    deviceImgMap.set(topTypeId, []);
    deviceApi.fetchDevices(props.subtask.sceneId, topTypeId).then((result) => {
      // 标准化属性名
      for (let i = 0; i < result.data.length; i++) {
        var element = convertKeys(result.data[i]);
        // 获取设备状态信息
        let data = {
          deviceId: element.id,
          sceneId: element.sceneGuid,
          deviceTypeId: topTypeId
        };
        deviceApi.fetchDeviceStatus(data).then((status) => {
          var statusData = status.data;
          if (statusData) {
            if (statusData.length == 0) {
              return;
            }
            element = convertKeys(result.data[i]);
            for (let j = 0; j < statusData.length; j++) {
              // 复制出一个设备对象
              var newDevice = useCloned(element).cloned.value;
              const statusItem = statusData[j];
              // 设备对象添加一个属性列表属性用来保存设备状态
              saveStatus(newDevice, statusItem);
              newDevice.dlLocation = statusItem.dlLocation;
              newDevice.topTypeId = topTypeId;
watch(
  () => props.pics,
  (nV, oV) => {
    nV.forEach(e => {
      if (!typeImgMap.value.has(e.topTypeId)) {
        typeImgMap.value.set(e.topTypeId, [])
              deviceImgMap.get(topTypeId).push(newDevice);
            }
          }
        });
      }
      typeImgMap.value.get(r.topTypeId).push({})
    });
    typeImgMap.value.set(
      1,
      nV.map((v) => {
        return { url: v };
      })
    );
  },
  { immediate: true }
);
</script>
  }
}
onMounted(() => {
  getDeviceImgList();
});
</script>