auth-web/src/pages/data-auth-manage/components/table-check-layer.vue

<!--
表码详情
@Author: linqian
@Date: 2021-04-01 15:38
-->
<template>
  <div>
    <!-- 查询项 -->
    <el-form :inline="true" class="search-form">
      <el-form-item label="数据资源名称">
        <el-input v-model="condition.resourceName.value" placeholder="请输入数据资源名称" clearable></el-input>
      </el-form-item>
      <el-form-item>
        <dg-button type="primary" icon="el-icon-search" @click="handleSearch">查询</dg-button>
      </el-form-item>
    </el-form>
    <!-- 表格 -->
    <new-table
      ref="table"
      :tableUrl="tableUrl"
      :tableHeader="tableHeader"
      :condition="searchCondition"
      :tableOptList="tableOptList"
      @submitTableOpt="receviceOpt"
    ></new-table>
  </div>
</template>

<script>
// 列权限清单弹框
import columnCheckLayer from './column-check-layer';
import newTable from '@/components/new-table';
export default {
  props: {
    tab: String,
    codeDataTypeStr: String,
    idcard: {
      type: String,
      default: ''
    }
  },
  components: { newTable },
  data() {
    return {
      condition: {
        codeDataTypeStr: {
          value: '',
          op: '='
        },
        resourceName: {
          value: '',
          op: 'like'
        },
        idcard: {
          value: '',
          op: '='
        }
      },
      searchCondition: {},
      tableUrl: '/authsvr/v2/dataauth/dataDetailList',
      tableHeader: [
        {
          prop: 'resourceName',
          label: '数据资源名称'
        },
        {
          prop: 'tableCode',
          label: '数据资源英文名称'
        },
        {
          prop: 'resourceCode',
          label: '数据资源标识符'
        }
      ],
      tableOptList: ['查看列权限清单']
    };
  },
  computed: {},
  methods: {
    receviceOpt(opt, row) {
      this.handleViewColumnCheckList(row);
    },
    handleViewColumnCheckList(row) {
      const layer = this.$dgLayer({
        title: '列权限清单列表',
        content: columnCheckLayer,
        props: {
          tableList: row.dataItems
        },
        on: {
          success(params) {
            layer.close(layer.dialogIndex);
          }
        },
        cancel: function (index, layero) {
          // 关闭对应弹窗的ID
          layer.close(index);
          return false;
        },
        area: ['900px', '760px']
      });
    },

    handleSearch() {
      this.searchCondition = this.condition;
      this.$refs.table.handleSearch();
    }
  },
  created() {
    this.condition.codeDataTypeStr.value = this.codeDataTypeStr;
    this.condition.idcard.value = this.idcard;
    this.searchCondition = this.condition;
  },
  mounted() {}
};
</script>

<style lang='scss'>
</style>