auth-web/src/pages/data-auth-module/property-management/application-management/application-properties.vue

<!--
 * @Author: Liugh
 * @Date: 2021-05-18 11:34:15
 * @LastEditTime: 2021-05-18 14:24:33
 * @LastEditors: Do not edit
 * @FilePath: \auth-web\src\pages\data-auth-module\property-management\application-management\application-properties.vue
 * @Description: 
-->
<template>
    <main class="application-properties">
        <el-form ref="ruleForm" inline :rules="rules" :model="form">
            <el-form-item label="应用系统名称">
                <el-input v-model="form.name" placeholder="请输入应用系统名称"></el-input>
            </el-form-item>
            <el-form-item label="应用在用标识">
                <dg-select
                    v-model="form.userType"
                    placeholder="请选择应用在用标识"
                    code="DM_APPLY_STATUS"
                    style="width: 13rem"
                >
                </dg-select>
            </el-form-item>
            <el-form-item label="应用系统事权单位代码">
                <el-input v-model="form.name" placeholder="请输入应用系统事权单位代码"></el-input>
            </el-form-item>
            <el-form-item>
                <dg-button type="primary" @click="handleSearch" icon="el-icon-search">查询</dg-button>
            </el-form-item>
            <el-form-item label="最近同步时间：" style="float: right">
                <span>2021-04-08 12:00:00</span>
            </el-form-item>
        </el-form>
        <div class="buttonGroup">
            <dg-button type="primary" @click="handleImport" icon="el-icon-upload2">导入</dg-button>
            <!-- <dg-button type="primary" @click="handleSynchro" icon="el-icon-refresh">同步</dg-button> -->
        </div>

        <Table ref="myTable" :url="tableUrl" :headerData="ApplicationTableData" :condition="form">
            <dg-table-column fixed="right" label="操作" align="center">
                <template slot-scope="scope">
                    <div class="u-table__operation">
                        <el-tooltip content="详情" effect="dark" placement="top-end">
                            <i class="el-icon-document" @click="handleViewDetail(scope.row)"></i>
                        </el-tooltip>
                    </div>
                </template>
            </dg-table-column>
        </Table>
    </main>
</template>

<script>
import Table from "@/pages/common/table";
import { ApplicationTableData } from "../DataConfig";
// import detail from "./detail";
import detail from "../../auth-object-manage/appfun-resource-manage/add-app-form";
import importFile from "@/pages/common/import";
import { appRestApi } from "@/api/application";
export default {
    name: "application-properties", // 组件名称
    props: {
        // 接收父组件的数据
    },
    data() {
        // 组件内部参数
        return {
            // 参数名称及默认值
            form: {},
            ApplicationTableData,
            tableUrl: appRestApi.table
        };
    },
    computed: {}, // 计算属性
    watch: {}, // 侦听器（扩展的计算属性）
    components: { Table }, // 注册局部组件
    methods: {
        /**
         * @description:表单查询方法
         */
        handleSearch() {},
        /**
         * @description:导入方法
         */
        handleImport() {
            const vm = this;
            const layer = this.$dgLayer({
                title: "导入",
                content: importFile,
                props: {
                    temp: "apply",
                    action: "/appsvr/v2/app/import"
                },
                on: {
                    success(params) {
                        layer.close(layer.dialogIndex);
                    },
                    close() {
                        vm.handleSearch();
                        layer.close(layer.dialogIndex);
                    }
                },
                cancel: function (index, layero) {
                    // 关闭对应弹窗的ID
                    layer.close(index);
                    return false;
                },
                area: ["550px", "500px"]
            });
        },
        /**
         * @description:同步方法
         */
        handleSynchro() {},
        /**
         * @description:详情
         */
        handleViewDetail(row) {
            const layer = this.$dgLayer({
                title: "详情",
                shade: [0.4, "#FFF"],
                content: detail,
                props: {
                    id: row.id,
                    isDetail: true
                },
                on: {
                    success() {
                        layer.close(layer.dialogIndex);
                    }
                },
                area: ["900px", "660px"]
            });
        }
    },
    created() {}, // 组件创建完成后
    mounted() {} // 组件挂载完成后
};
</script>
<style lang="scss" scoped>
@import "../index.scss";
</style>