产品结构树： 1、新增指定文档为当前版本功能与文档版本内容差异比对功能（新增插件vue-code-diff） 2、调整产品及部件属性tab栏标题为属性...

zhaowei

2025-01-21 ba9490368b8bf27e0d4a6471420044dadf5b720e

 src/views/dnc/base/modules/ProductStructure/Document/DocumentVersionTableList.vue

@@ -1,39 +1,154 @@
<template>
  <a-table :columns="columns" :data-source="dataSource" bordered :pagination="false">

  </a-table>
  <div>
    <a-table :columns="columns" :data-source="dataSource" bordered :pagination="false" :size="size" rowKey="fileId"
             :customRow="customRow">
      <template slot="rowIndex" slot-scope="text,record,index">
        <span :style="{color:setCurrentVersionColor(record.publishFlag)}">{{parseInt(index) + 1}}</span>
      </template>
      <template slot="fileName" slot-scope="text,record,index">
      <span :style="{color:setCurrentVersionColor(record.publishFlag)}">
        {{text}}.{{record.fileSuffix}}
        <span v-if="record.publishFlag">[当前版本]</span>
      </span>
      </template>
      <template slot="docVersion" slot-scope="text,record">
        <span :style="{color:setCurrentVersionColor(record.publishFlag)}">{{text}}</span>
      </template>
      <template slot="fileSize" slot-scope="text,record">
        <span :style="{color:setCurrentVersionColor(record.publishFlag)}">{{(text/1024).toFixed(2)}}KB</span>
      </template>
    </a-table>
    <SelectFileCompareModal :dataSource="dataSource" :setCurrentVersionColor="setCurrentVersionColor"
                            ref="selectFileCompareModalRef"/>
  </div>
</template>

<script>
  import { JeecgListMixin } from '@/mixins/JeecgListMixin'
  import { getAction } from '@/api/manage'
  import dncApi from '@/api/dnc'
  import SelectFileCompareModal from './SelectFileCompareModal'

  export default {
    name: 'DocumentVersionTableList',
    mixins: [JeecgListMixin],
    components: {},
    components: { SelectFileCompareModal },
    props: {
      currentDocumentInfo: {
        type: Object
      },
      size: {
        type: String
      }
    },
    data() {
      return {
        disableMixinCreated: true,
        queryParams: {},
        currentDocumentVersion: '',
        columns: [
          {
            title: '序号',
            dataIndex: 'rowIndex',
            key: 'rowIndex',
            width: 65,
            align: 'center',
            customRender: function(t, r, index) {
              return parseInt(index) + 1
            }
          },
          { title: '文件名称', dataIndex: 'fileName', align: 'center' },
          { title: '版本号', dataIndex: 'docVersion', align: 'center' },
          { title: '文件大小', dataIndex: 'fileSize', align: 'center' }
          { title: '序号', dataIndex: 'rowIndex', width: 65, align: 'center', scopedSlots: { customRender: 'rowIndex' } },
          { title: '文件名称', dataIndex: 'fileName', align: 'center', scopedSlots: { customRender: 'fileName' } },
          { title: '版本号', dataIndex: 'docVersion', align: 'center', scopedSlots: { customRender: 'docVersion' } },
          { title: '文件大小', dataIndex: 'fileSize', align: 'center', scopedSlots: { customRender: 'fileSize' } }
        ],
        url: {
          list: ''
          list: '/nc/file/find/list'
        }
      }
    },
    methods: {}
    created() {
      this.$bus.$on('tableMenuItemMethodTrigger', this.triggerCorrespondingMethod)
    },
    methods: {
      loadData() {
        this.dataSource = []
        if (!this.url.list) {
          this.$message.error('请设置url.list属性!')
          return
        }
        var params = this.getQueryParams()//查询条件
        params.docId = this.currentDocumentInfo.docId
        if (!params) {
          return false
        }
        this.loading = true
        getAction(this.url.list, params).then((res) => {
          if (res.success) {
            this.dataSource = res.list
            this.currentDocumentVersion = res.list.find(item => item.publishFlag).docVersion
            console.log('currentDocumentVersion', this.currentDocumentVersion)
          } else {
            this.$message.warning(res.message)
          }
        }).finally(() => {
          this.loading = false
        })
      },

      /**
       * 指定当前文档为当前版本
       * @param fileId 文件Id
       */
      handleFileAssign({ fileId }) {
        const that = this
        dncApi.appointCurrentDocumentVersionApi(fileId)
          .then(res => {
            if (res.success) {
              that.$notification.success({
                message: '消息',
                description: res.message
              })
              const currentAssignDocumentVersion = that.dataSource.find(item => item.fileId === fileId).docVersion
              // 如果当前指定版本的版本号与当前版本的版本号一致则不重新加载列表并且不重新释放预览接口调取
              if (that.currentDocumentVersion === currentAssignDocumentVersion) return
              that.loadData()
              that.$emit('releaseFilePreviewApi')
            } else {
              that.$notification.error({
                message: '消息',
                description: res.message
              })
            }
          })
          .catch(err => {
            that.$notification.error({
              message: '消息',
              description: err.message
            })
          })
      },

      handleFileAddRelative(_, modalTitle) {
        if (!this.$refs.selectFileCompareModalRef) return
        this.$refs.selectFileCompareModalRef.visible = true
        this.$refs.selectFileCompareModalRef.title = modalTitle
      },

      customRow(record) {
        return {
          on: {
            contextmenu: event => {
              event.preventDefault()
              this.$emit('handleTableContextMenuOpen', Object.assign({ param: 'file' }, record))
            }
          }
        }
      },

      triggerCorrespondingMethod({ methodName, level, modalTitle, tableRowInfo }) {
        if (this[methodName]) this[methodName](tableRowInfo, modalTitle)
      },

      /**
       * 设置表格中为当前版本的文件表格行颜色标识
       * @param publishFlag 是否为当前版本
       * @returns {string} 颜色标识
       */
      setCurrentVersionColor(publishFlag) {
        return publishFlag ? '#DB9538' : ''
      }
    }
  }
</script>