art: 从沃克项目迁移设备管理代码到航宇

zhangherong

2025-04-27 dbb3445dc720a8f36b3424e73f2e02a6b0f9deb6

 src/views/eam/repair/modules/ImagesPreviewModal.vue

@@ -1,56 +1,61 @@
<template>
  <a-modal title="预览" :visible="visible" width="50%" :footer="null" @cancel="visible=false">
    <template v-for="(item,index) in imageListUrl.split(',')">
    <template v-for="(item,index) in imageUrlArr">
      <img :src="getImageItemUrl(item)" width="100%;"/>

      <a-divider v-if="index+1<imageListUrl.split(',').length" style="margin:20px 0;background-color: #000"></a-divider>
      <a-divider v-if="index+1<imageUrlArr.length" style="margin:20px 0;background-color: #000"></a-divider>
    </template>
  </a-modal>
</template>

<script>
export default {
  name: 'ImagesPreviewModal',
  props: {
    imageListUrl: {
      type: String,
      default: ''
    }
  },
  data() {
    return {
      visible: false
    }
  },
  methods: {
    getImageItemUrl(imageItemSrcSuffix) {
      return `${window._CONFIG['domianURL']}/${imageItemSrcSuffix}`
  export default {
    name: 'ImagesPreviewModal',
    props: {
      imageListUrl: {
        type: String,
        default: ''
      }
    },
    data() {
      return {
        visible: false
      }
    },
    computed: {
      imageUrlArr() {
        return JSON.parse(this.imageListUrl).map(item => item.filePath)
      }
    },
    methods: {
      getImageItemUrl(imageItemSrcSuffix) {
        return `${window._CONFIG['domianURL']}/${imageItemSrcSuffix}`
      }
    }
  }
}
</script>

<style scoped lang="less">
/deep/ .ant-modal {
  height: 70%;
  overflow: hidden;

  .ant-modal-content {
    height: 100%;
    display: flex;
    flex-direction: column;
  /deep/ .ant-modal {
    height: 70%;
    overflow: hidden;

    ::-webkit-scrollbar {
      width: 8px;
      height: 8px;
    }
    .ant-modal-content {
      height: 100%;
      display: flex;
      flex-direction: column;
      overflow: hidden;

    .ant-modal-body {
      flex: 1;
      overflow: auto;
      ::-webkit-scrollbar {
        width: 8px;
        height: 8px;
      }

      .ant-modal-body {
        flex: 1;
        overflow: auto;
      }
    }
  }
}

</style>