mky-vent-base/src/views/vent/performance/comment/CADModal.vue

<template>
  <BasicModal
    v-bind="$attrs"
    @register="registerModal"
    title="文档管理"
    width="900px"
    :defaultFullscreen="true"
    :showCancelBtn="false"
    :showOkBtn="false"
    :footer="null"
    destroyOnClose
  >
    <!-- <button @click="mxcadmode = !mxcadmode">Switch Previewer</button> -->
    <div v-if="mxcadmode">
      <CADViewer v-if="fileid" :id="fileid" :filename="filename" class="w-100%" :height="800" />
    </div>
    <iframe v-else :src="iframesrc" class="w-100%" :height="800" ref="frameRef"></iframe>
  </BasicModal>
</template>
<script lang="ts" setup>
  import { ref, triggerRef } from 'vue';
  import { BasicModal, useModalInner } from '/@/components/Modal';
  import { onMounted } from 'vue';
  import CADViewer from '/@/views/vent/performance/fileDetail/commen/CADViewer.vue';
  import { useGlobSetting } from '/@/hooks/setting';
  import { AUTO_LOGIN_URL_QUERY } from '/@/router/constant';

  const { sysOrgCode } = useGlobSetting();
  // 不是布尔台的使用 mxcad 模式，是布尔台的使用 iframe 模式以避免“法律风险”
  const mxcadmode = ref(sysOrgCode !== 'sdmtjtbetmk');

  // CAD预览器的 DEMO 01 相关代码
  const iframesrc = ref('');

  // CAD预览器 DEMO 02
  const fileid = ref('');
  const filename = ref('');

  //表单赋值
  const [registerModal, { setModalProps }] = useModalInner(async ({ record }) => {
    //重置表单
    setModalProps({ confirmLoading: false });

    if (mxcadmode.value) {
      fileid.value = record.id;
      filename.value = record.fileName;
    } else {
      const origin = import.meta.env.PROD ? 'http://182.92.126.35:8092' : window.location.origin;
      // const origin = import.meta.env.DEV ? 'http://182.92.126.35:8092' : window.location.origin;
      iframesrc.value = `${origin}/fileManager/cad-viewer?${AUTO_LOGIN_URL_QUERY.key}=${AUTO_LOGIN_URL_QUERY.val}&id=${record.id}&filename=${record.fileName}`;
    }
  });

  onMounted(() => {});
</script>

<style scoped lang="less">
  ::v-deep .suffix {
    height: 32px;
    line-height: 32px;
    margin-left: 5px;
    color: #fff;
  }
</style>