auth-web/src/pages/data-auth-module/auth-object-manage/service-resource-manage/test.vue

<!--
服务资源管理
@Author: linqian
@Date: 2021-05-17 13:53
-->
<template>
  <div>
    <!-- 搜索栏 -->
    <search-bar :conditionForm="conditionForm" @submitSearch="receiveSearch"></search-bar>
    <!-- 操作栏 -->
    <operate-bar :pageOptList="pageOptList" @submitPageOpt="receviceOpt"></operate-bar>
    <!-- 表格 -->
    <basic-table
      ref="table"
      :tableHeader="tableHeader"
      :tableUrl="tableUrl"
      :condition="condition"
      :tableOptList="tableOptList"
      @submitTableOpt="receviceOpt"
    >
    </basic-table>
  </div>
</template>

<script>
import searchBar from '@/components/search-bar';
import operateBar from '@/components/operate-bar';
import basicTable from '@/pages/common/new-table';
import { conditionForm, pageOptList, tableOptList, tableHeader, editForm } from './DataConfig';
import { searchOpt, importOpt, syncOpt, detailOpt, addEditOpt } from '@/mixins/page-opt';
import * as Api from "@/api/ser-resource-manage";
import { serviceImportUrl } from "@/api/import";
import { authSerSyncUrl } from "@/api/sync";
import editFormLayer from "./edit-form.vue"
const labelWidth = '180px';
const area = ['900px', '600px'];
export default {
  components: {
    searchBar,
    operateBar,
    basicTable
  },
   mixins: [searchOpt, addEditOpt, detailOpt, importOpt, syncOpt],
  data() {
    return {
        conditionForm,
        pageOptList,
        tableOptList,
        tableHeader,
        tableUrl: Api.tableUrl,
    };
  },
  computed: {},
  methods: {
       /**
     * 接收操作事件
     */
    async receviceOpt(type, row) {
      const otherParams = {
        config: editForm,
        labelWidth,
        area
      };
      if (type == '修改') {
        const detailInfo = await this.getDetail(row.id);
        this.handleOpenEditForm('编辑', 'update', { ...otherParams, detailInfo });
      } else if (type == '新增') {
        this.handleOpenEditForm('新增', 'add', {...otherParams, content: editFormLayer });
      } else if (type == '详情') {
        this.handleViewDetail(row.id, otherParams);
      } else if (type == '删除') {
        this.handleDelete(row);
      } else if (type == '导入') {
        this.handleImport(serviceImportUrl, 'serviceResource');
      } else if (type == '同步') {
        this.handleSync(authSerSyncUrl);
      }
    },
      /**
     * 删除
     */
    handleDelete(row) {
      this.$dgConfirm(`是否确认删除该条应用！`, '提示', {}).then(() => {
        Api.del(row.id).then((res) => {
          this.$message.success(res);
          this.handleSearch();
        });
      });
    },
       /**
     * 获取详情
     */
    getDetail(id) {
      return new Promise((resolve) => {
        Api.detail(id).then((res) => {
          resolve(res);
        });
      });
    },
      /**
     * @description: 保存表单
     * @param { 表单数据 } form
     * @param { 新增还是编辑 } type
     * @param { 弹框 } layer
     */
    saveForm(form, type, layer) {
      const api = type == 'update' ? 'update' : 'save';
      Api[api](form)
        .then((res) => {
          this.$message.success('保存成功!');
          layer.close(layer.dialogIndex);
          this.handleSearch();
        })
        .catch((error) => {
          this.$message.error(error);
        });
    }
  },
  created() {},
  mounted() {}
};
</script>

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