diantou/src_product/iam/audit/dataUphold/audit-class-index-table.vue

<template>
  <div>
    <a-modal
      class="modalselectmaintain"
      :body-style="bodyStyle"
      :title="title"
      :destroy-on-close="true"
      :visible="visible"
      :width="modalWidth"
      @ok="handleOk"
      @cancel="handleCancel"
    >
      <!-- 列表 -->
      <SdTable
        ref="SJMXDataTable"
        :row-key="(record, index) => index"
        :columns="columns"
        :data-source="dataList"
        :pagination="false"
        :row-selection="{
          getCheckboxProps() {
            return {}
          },
          selectedRowKeys: selectedRowKeys,
          onChange: onSelectChange,
        }"
      >
        <template slot="type" slot-scope="text, record">
          <span v-if="record.type === 0 || record.type === '0'">非结构化</span>
          <span v-else>结构化</span>
        </template>
      </SdTable>
    </a-modal>
  </div>
</template>

<script>
import SdTable from '@/common/components/sd-table.vue'
import { message } from 'ant-design-vue'
import DataService from './data-config'
export default {
  name: 'AuditClassIndexTable',
  metaInfo: {
    title: '数据索引选择器',
  },
  components: {
    SdTable,
  },
  props: {
    // 弹出窗标题
    title: {
      type: String,
      default: '审搜索引选择器',
    },
    // 弹出窗宽度
    modalWidth: {
      type: String,
      default: '1200px',
    },
    // 弹出窗显示参数
    visible: {
      type: Boolean,
      default: false,
    },
    classData: {
      type: Array,
      default: () => [],
    },
  },
  data() {
    return {
      selectedRowKeys: [],
      selectedRows: [],
      dataUrl: 'api/xcoa-mobile/v1/iamsearchindex/getByCategoryIds',
      dataList: [],
      bodyStyle: {
        minHeight: '700px',
      },
      // 列表展示用
      columns: [
        {
          title: '业务编号',
          dataIndex: 'id',
        },
        {
          title: '索引名',
          dataIndex: 'indexName',
        },
        {
          title: '索引说明',
          dataIndex: 'indexRemark',
        },
        {
          title: '系统名称',
          dataIndex: 'systemName',
        },
        {
          title: '系统来源名称',
          dataIndex: 'indexSource',
        },
        {
          title: '索引类型',
          dataIndex: 'type',
          scopedSlots: { customRender: 'type' },
        },
        {
          title: '归属分类名称',
          dataIndex: 'categoryName',
        },
        // 分类id
        {
          dataIndex: 'categoryId',
          sdHidden: true,
        },
      ],

      // 高级搜索
      searchform: 'searchform',
      expand: false,

      period: [],
      allClassCodes: '',
    }
  },
  watch: {
    classData: {
      handler(val) {
        this.allClassCodes = val.map((item) => item.categoryId).join(',')
        this.getList()
      },
      deep: true,
    },
  },

  methods: {
    onSelectChange(selectedRowKeys, selectedRows) {
      this.selectedRowKeys = selectedRowKeys
      this.selectedRows = selectedRows
    },
    processRes(data) {
      let index = 0
      data.data.forEach((item) => {
        item.id = this.$refs.SJMXDataTable.localPagination.current + '-' + index
        index++
      })
      return data
    },
    getList() {
      DataService.findIndexListDatas(this.allClassCodes).then((res) => {
        this.dataList = res.data
      })
    },
    handleOk(e) {
      this.$parent.visible = !this.$parent.visible
      this.$parent.indexTableShow = !this.$parent.indexTableShow
      // 列表选择事件，返回选择的数据
      this.$emit('listMxSelected', this.selectedRowKeys, this.selectedRows)
    },
    handleCancel(e) {
      this.$parent.visible = !this.$parent.visible
      this.$parent.indexTableShow = !this.$parent.indexTableShow
    },
    // 翻页操作
    onChange(pagination, filters, sorter) {
      this.pageSize = pagination.pageSize
      this.startPosition = (pagination.current - 1) * pagination.pageSize
    },
    // 开启关闭
    searchedClick() {
      this.expand = false
    },
    handleSearch() {
      const formData = this.formData
      // 获取当前表格过滤条件
      this.filterExpressions = []
      // 获取高级搜索的数据
      // 开始修改
      if (formData !== null) {
        if (this.formData.categoryId) {
          this.filterExpressions.push({
            dataType: 'str',
            name: 'categoryId',
            op: 'like',
            stringValue: `${this.formData.categoryId}`,
          })
        }
      }
    },
  },
}
</script>

<style module lang="scss">
@use '@/common/design' as *;
:global(.modalselectmaintain) {
  :global(.ant-modal-body) {
    overflow-x: hidden;
  }
}
</style>