fu-hsi-web/src/views/caseDetails/components/TripletInfo.vue

<!--
 * @description: 三元组信息
 * @fileName: TripletInfo
 * @author: 17076
 * @date: 2024/7/1-下午5:08
 * @version: V1.0.0
-->

<template>
  <cs-dialog
    :dialog="dialogOptions"
  >
    <template slot="content">
      <vxe-grid ref="xTable" v-bind="gridOptions" />
      <div style="text-align: center;margin-top: 10px">
        <el-button type="primary" plain style="width: 80px" @click="() => { dialogOptions.show = false }">取消</el-button>
        <el-button type="primary" style="width: 80px" @click="handleSubmit">保存</el-button>
      </div>
    </template>
  </cs-dialog>
</template>

<script>
import { queryTripletInfo, saveTripletInfo } from '@/api/caseDetails'
import mixin from '@/views/mixin'
export default {
  name: 'TripletInfo',
  mixins: [mixin],
  data() {
    return {
      dialogOptions: {
        show: false,
        title: {
          title: '选择三元组信息入库'
        },
        top: '50px',
        hiddenFooter: true,
        appendToBody: true
      },
      gridOptions: {
        ...mixin.data().gridOptions,
        loading: false,
        columns: [
          { type: 'checkbox', width: '80px' },
          { title: '实体', field: 'startNode' },
          { title: '属性', field: 'relation' },
          { title: '属性值', field: 'endNode' }
        ],
        data: [{ startNode: '裴金禄', relation: '就读院校', endNode: '中国政法大学'  },{ startNode: '裴金禄', relation: '毕业时间', endNode: ''}]
      },
      // 上页数据
      lastPageData: {}
    }
  },
  mounted() {
    // this.tableHeight(330)
  },
  methods: {
    // 显示弹窗
    show(data) {
      this.dialogOptions.show = true
      this.lastPageData = data
      this.gridOptions.data = []
      this.fetchData()
    },
    // 查询对应笔录提取到的三元组信息
    fetchData() {
      this.gridOptions.loading = true
      const params = {
        caseId: this.$route.params['id'],
        name: this.lastPageData.name,
        recordId: this.lastPageData['id']
      }
      queryTripletInfo(params).then(res => {
        this.gridOptions.loading = false
        this.gridOptions.data = res.data
      }).catch(() => {
        this.gridOptions.loading = false
      })
    },
    // 保存入库
    handleSubmit() {
      if (this.gridOptions.loading) {
        this.$baseMessage.error('模型分析中，请稍后!')
        return
      }
      const loading = this.$baseLoading(1, '保存中...')
      const ids = []
      this.$refs.xTable.getCheckboxRecords().map(item => {
        ids.push(item.id)
      })
      saveTripletInfo({ ids }).then(res => {
        loading.close()
        const { code, msg } = res
        code === 200 ? this.$baseMessage.success(msg || '保存成功!') : this.$baseMessage.error(msg || '保存失败!')
        this.dialogOptions.show = false
      }).catch(() => { loading.close() })
    }
  }
}
</script>

<style scoped lang="scss">

</style>