auth-web/src/pages/auth-object-manage/object-prop-manage/add-fun-dialog.vue

<!--
关联功能资源
@Author: linqian
@Date: 2021-10-18 14:08
-->
<template>
  <div>
    <!-- 搜索栏 -->
    <search-bar :conditionForm="conditionForm" @submitSearch="receiveSearch"></search-bar>
    <!-- 列表 -->
    <vxe-table-basic
      :gridOptions="gridOptions"
      :tableColumn="tableColumn"
      :tableData="tableData"
      :paginationConfig="paginationConfig"
      @paginationChange="getPagination"
    ></vxe-table-basic>
    <div v-footer>
      <dg-button @click="handleClose">取消</dg-button>
      <dg-button type="primary" @click="handleSave">保存</dg-button>
    </div>
  </div>
</template>

<script>
import searchBar from '@/components/search-bar';
import { searchOpt } from '@/mixins/page-opt';
import { appRestApi } from '@/api/application';
import vxeTableBasic from '@/components/vxe-table-basic';
import { getRedAppFuncList } from '@/api/list-manage';
export default {
  components: { searchBar, vxeTableBasic },
  mixins: [searchOpt],
  props: {
    parentNode: Object,
    operateType: String,
    attrBelongType: String
  },
  data() {
    return {
      conditionForm: [
        {
          label: '应用系统名称',
          name: 'applyCode',
          op: 'like',
          value: '',
          component: 'SelectApp',
          apiUrl: appRestApi.table,
          valueName: 'applyCode',
          labelName: 'applyName'
        }
      ],
      gridOptions: {
        treeConfig: { children: 'child', indent: 40 }
      },
      tableColumn: [
        {
          align: 'left',
          headerAlign: 'center',
          title: '应用功能名称',
          field: 'label',
          treeNode: true
        }
      ],
      tableData: [],
      paginationConfig: {
        pageSize: 10,
        currentPage: 1,
        total: 0
      }
    };
  },
  computed: {},
  methods: {
    getPagination({ pageSize, currentPage }) {
      this.paginationConfig.pageSize = pageSize;
      this.paginationConfig.currentPage = currentPage;
      this.getList();
    },
    /**
     * 获取列表
     */
    getList() {
      const params = {
        page: this.paginationConfig.currentPage - 1,
        size: this.paginationConfig.pageSize,
        searchCondition: this.condition
      };
      getRedAppFuncList(params).then((res) => {
        const { content, totalElements } = res.data;
        this.tableData = content;
        this.paginationConfig.total = totalElements;
      });
    },
    receiveSearch(value) {
      this.condition = value;
      this.paginationConfig.currentPage = 1;
      this.getList();
    },
    handleClose() {
      this.$emit('close');
    },
    handleSubmit() {
      this.$emit('success');
    }
  },
  created() {
    this.getList();
  },
  mounted() {}
};
</script>

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