kgraph-ui/src/views/knowledge/modal/addRelBatchModal.vue

<template>
    <a-modal title="新增实体"
             :visible="show"
             :maskClosable="false"
             :width="800"
             @ok="handleOk"
             @cancel="handleClose">
        <a-input-search v-model="searchValue" size="small" placeholder="请输入名称" enter-button
                        @keyup.enter="search" @search="search" style="margin-bottom: 10px"/>
        <a-table
                :dataSource="data"
                :columns="columns"
                :pagination="pagination"
                :rowSelection="{
                    selectedRowKeys: checkedList,
                    onChange: onSelectChange
                  }"
                @change="onChangePagination"
                :rowKey="(record) => record.entId"
                :loading="loading">
        </a-table>
    </a-modal>
</template>

<script>
  import { getRelclsEnt, addRelBatch } from '@/api/graph/relationClass'
  export default {
    name: 'addRelBatchModal',
    components: {},
    props: ['relClsId', 'direction', 'isModel', 'entId'],
    data() {
      return {
        searchValue: '',
        show: true,
        loading: false,
        data: [],
        columns: [
          {
            title: "实体ID",
            dataIndex: "entId",
          },
          {
            title: "实体名称",
            dataIndex: "entName",
          },
        ],
        pagination: {
          current: 1,
          total: 0,
          pageSize: 9
        },
        checkedList: [],
      }
    },
    mounted() {
      this.getEntityList()
    },
    methods: {
      // 获取实体列表
      getEntityList(value) {
        // relClsId, direction, isModel, current, size
        getRelclsEnt(this.relClsId, this.direction, this.entId, this.isModel, value, this.pagination.current, this.pagination.pageSize).then(res => {
          this.columns = [
            {
              title: "实体ID",
              dataIndex: "entId",
            },
            {
              title: "实体名称",
              dataIndex: "entName",
            },
          ]
          res.headers.forEach(header => {
            this.columns.push({
              title: header.attrClsName,
              dataIndex: header.attrClsID,
            })
          })
          res.data.forEach(item => {
            for (let i = 0; i < item.notNullAttrVOList.length; i++) {
              item[item.notNullAttrVOList[i].attrClsID] = item.notNullAttrVOList[i].attrValue
            }
          })
          this.pagination.total = res.total
          this.data = res.data
        })
      },
      search() {
        this.pagination = {
          pageSize: 9,
          current: 1
        }
        this.getEntityList(this.searchValue)
      },
      handleOk() {
        const vm = this
        let entityRelations = []
        this.checkedList.forEach((item, index) => {
          let startEntId;
          let endEntId;
          if (vm.direction === 'START') {
            startEntId = vm.entId
            endEntId = item
            
          } else {
            startEntId = item
            endEntId = vm.entId
          }
          let entityRelation = {
            startEntId,
            endEntId,
            isModel: this.isModel,
            relClsId: this.relClsId
          }
          entityRelations.push(entityRelation)
        })
        addRelBatch(entityRelations).then(res => {
          if (res) {
            this.$notification["success"]({
              message: "新增成功"
            });
            this.$close(res)
          }
        })
      },
      handleClose() {
        this.$close(false)
      },
      onChangePagination(current) {
        this.pagination = current
        this.getEntityList()
      },
      onSelectChange(selectedRowKeys) {
        this.checkedList = selectedRowKeys
      },
    }
  }
</script>

<style scoped>

</style>