主体属性类管理完成

src/pages/data-auth-module/property-management/DataConfig.js

@@ -1,7 +1,7 @@
 /*
  * @Author: Liugh
  * @Date: 2021-05-17 15:38:23
- * @LastEditTime: 2021-05-18 14:43:49
+ * @LastEditTime: 2021-05-19 17:15:26
  * @LastEditors: Do not edit
  * @Description:
  */
@@ -64,6 +64,58 @@ const ApplicationTableData = [
         prop: ""
     }
 ];
+const cardPersonnelList = [
+    {
+        label: "姓名",
+        prop: ""
+    },
+    {
+        label: "身份证号码",
+        prop: ""
+    },
+    {
+        label: "所属单位",
+        prop: ""
+    }
+];
+const cardAddPersonnelList = [
+    {
+        label: "姓名",
+        prop: ""
+    },
+    {
+        label: "身份证号码",
+        prop: ""
+    },
+];
+const cardApplicationList = [
+    {
+        label: "机构名称",
+        prop: ""
+    },
+    {
+        label: "机构代码",
+        prop: ""
+    },
+    {
+        label: "行政区划",
+        prop: ""
+    }
+];
+const cardAgencylist = [
+    {
+        label: "应用系统名称",
+        prop: ""
+    },
+    {
+        label: "应用系统代码",
+        prop: ""
+    },
+    {
+        label: "系统在用标识",
+        prop: ""
+    }
+];
 const typeData = {
     jy: [
         { label: "姓名", value: "name" },
@@ -119,5 +171,14 @@ const applicationField = [
     { label: "应用系统管理单位名称", value: "managerOrgName" },
     { label: "应用系统说明", value: "managerDescribe" }
 ];
-
-export { UserTableData, typeData, institutionField, ApplicationTableData, applicationField };
+export {
+    UserTableData,
+    typeData,
+    institutionField,
+    ApplicationTableData,
+    applicationField,
+    cardPersonnelList,
+    cardApplicationList,
+    cardAgencylist,
+    cardAddPersonnelList,
+};

src/pages/data-auth-module/property-management/index.scss

@@ -1,13 +1,14 @@
 /*
  * @Author: Liugh
  * @Date: 2021-05-17 15:18:43
- * @LastEditTime: 2021-05-18 11:40:29
+ * @LastEditTime: 2021-05-19 15:50:33
  * @LastEditors: Do not edit
  * @Description: 
  */
 .user-attributes,
 .institutional-attributes,
-.application-properties {
+.application-properties,
+.subject-property /deep/{
     .buttonGroup {
         margin-bottom: 20px;
     }
@@ -26,3 +27,11 @@
         margin-top: 2.5rem;
     }
 }
+.subject-property /deep/ {
+    .box-card {
+        .el-card__header {
+            display: block;
+        }
+        height: calc(100vh - 12rem);
+    }
+}

src/pages/data-auth-module/property-management/subject-management/add-dialog.vue

@@ -0,0 +1,85 @@
+<!--
+ * @Author: Liugh
+ * @Date: 2021-05-19 16:09:07
+ * @LastEditTime: 2021-05-19 17:08:22
+ * @LastEditors: Do not edit
+ * @FilePath: \auth-web\src\pages\data-auth-module\property-management\subject-management\add-dialog.vue
+ * @Description: 
+-->
+
+<template>
+    <main class="add-dialog">
+        <dg-row class="property-wapper" :gutter="10">
+            <!-- 机构列表 -->
+            <dg-col :span="8" class="property-wapper__left">
+                <dg-card class="box-card">
+                    <org-tree
+                        ref="tree"
+                        class="u-pm__left"
+                        treeHeight="calc(100vh - 19rem)"
+                        :search="true"
+                        paddingRight="15px"
+                        @handleGetNode="handleGetNode"
+                        @submitRootNode="handleGetNode"
+                    ></org-tree>
+                </dg-card>
+            </dg-col>
+            <!-- 权限设置 -->
+            <dg-col :span="16">
+                <Table
+                    ref="table"
+                    :url="tableUrl"
+                    :headerData="cardAddPersonnelList"
+                    :condition="reportForm"
+                    :lazyLoad="true"
+                >
+                </Table>
+            </dg-col>
+        </dg-row>
+    </main>
+</template>
+
+<script>
+import * as dynamicManageApi from "@/api/dynamic-manage";
+import { cardAddPersonnelList, cardAgencylist } from "../DataConfig";
+import orgTree from "@/pages/common/tree";
+import Table from "@/pages/common/table";
+export default {
+    name: "add-dialog", // 组件名称
+    props: {
+        // 接收父组件的数据
+    },
+    data() {
+        // 组件内部参数
+        return {
+            // 参数名称及默认值
+            cardAddPersonnelList,
+            cardAgencylist,
+            tableUrl: dynamicManageApi.tableUrl,
+            reportForm: {}
+        };
+    },
+    computed: {}, // 计算属性
+    watch: {}, // 侦听器（扩展的计算属性）
+    components: { orgTree, Table }, // 注册局部组件
+    methods: {
+        /**
+         * @description: 获取机构节点
+         * @param {*} node
+         */
+        handleGetNode(node) {
+            this.subId = node.code;
+            this.key++;
+        }
+    }, // 内部方法
+    beforeCreate() {}, // 组件创建前
+    created() {}, // 组件创建完成后
+    beforeMount() {}, // 组件挂载前
+    mounted() {}, // 组件挂载完成后
+    beforeUpdate() {}, // 组件更新前
+    updated() {}, // 组件挂载完成后
+    beforeDestroy() {}, // 组件销毁前
+    destroyed() {} // 组件销毁完成后
+};
+</script>
+<style lang="scss" scoped></style>

src/pages/data-auth-module/property-management/subject-management/agency-list.vue

@@ -0,0 +1,136 @@
+<!--
+ * @Author: Liugh
+ * @Date: 2021-05-19 15:48:26
+ * @LastEditTime: 2021-05-19 16:46:22
+ * @LastEditors: Do not edit
+ * @FilePath: \auth-web\src\pages\data-auth-module\property-management\subject-management\agency-list.vue
+ * @Description: 
+-->
+<template>
+    <dg-card class="box-card" header="机构列表">
+        <el-form ref="form" :model="cardForm" label-suffix=":" inline>
+            <el-form-item label="机构名称">
+                <el-input clearable placeholder="请输入机构名称" v-model="cardForm.name"></el-input>
+            </el-form-item>
+            <el-form-item label="机构代码">
+                <dg-tree-select
+                    v-model="cardForm.institution"
+                    placeholder="请选择机构代码"
+                    :data="options"
+                    clearable
+                    filterable
+                    multiple
+                ></dg-tree-select>
+            </el-form-item>
+            <el-form-item>
+                <dg-button type="primary" icon="el-icon-search" @click="doSearchPersion">查询</dg-button>
+                <dg-button type="primary" icon="el-icon-plus">添加</dg-button>
+            </el-form-item>
+        </el-form>
+        <Table
+            ref="table"
+            :url="tableUrl"
+            :headerData="cardAgencylist"
+            :condition="reportForm"
+            :lazyLoad="true"
+            @handleRowClick="handleRowClick"
+        >
+        </Table>
+    </dg-card>
+</template>
+
+<script>
+import Table from "@/pages/common/table";
+import * as dynamicManageApi from "@/api/dynamic-manage";
+import { cardAgencylist } from "../DataConfig";
+export default {
+    name: "personnelList", // 组件名称
+    props: {
+        // 接收父组件的数据
+    },
+    data() {
+        // 组件内部参数
+        return {
+            // 参数名称及默认值
+            cardAgencylist,
+            tableUrl: dynamicManageApi.tableUrl,
+            reportForm: {},
+            cardForm: {},
+            options: [
+                {
+                    id: "fruits",
+                    label: "Fruits",
+                    children: [
+                        {
+                            id: "apple",
+                            label: "Apple",
+                            isNew: true
+                        },
+                        {
+                            id: "grapes",
+                            label: "Grapes",
+                            disabled: true
+                        },
+                        {
+                            id: "pear",
+                            label: "Pear"
+                        },
+                        {
+                            id: "strawberry",
+                            label: "Strawberry 🍓"
+                        },
+                        {
+                            id: "watermelon",
+                            label: "Watermelon 🍉"
+                        }
+                    ]
+                },
+                {
+                    id: "vegetables",
+                    label: "Vegetables",
+                    children: [
+                        {
+                            id: "corn",
+                            label: "Corn 🌽"
+                        },
+                        {
+                            id: "carrot",
+                            label: "Carrot 🥕"
+                        },
+                        {
+                            id: "eggplant",
+                            label: "Eggplant 🍆"
+                        },
+                        {
+                            id: "tomato",
+                            label: "Tomato 🍅"
+                        }
+                    ]
+                }
+            ]
+        };
+    },
+    computed: {}, // 计算属性
+    watch: {}, // 侦听器（扩展的计算属性）
+    components: { Table }, // 注册局部组件
+    methods: {
+        /**
+         * @description: 查询
+         */
+        doSearchPersion() {},
+        /**
+         * @description: 单击表格行
+         */
+        handleRowClick() {}
+    }, // 内部方法
+    beforeCreate() {}, // 组件创建前
+    created() {}, // 组件创建完成后
+    beforeMount() {}, // 组件挂载前
+    mounted() {}, // 组件挂载完成后
+    beforeUpdate() {}, // 组件更新前
+    updated() {}, // 组件挂载完成后
+    beforeDestroy() {}, // 组件销毁前
+    destroyed() {} // 组件销毁完成后
+};
+</script>
+<style lang="scss" scoped></style>

src/pages/data-auth-module/property-management/subject-management/application-list.vue

@@ -0,0 +1,81 @@
+<!--
+ * @Author: Liugh
+ * @Date: 2021-05-19 15:48:57
+ * @LastEditTime: 2021-05-19 16:19:12
+ * @LastEditors: Do not edit
+ * @FilePath: \auth-web\src\pages\data-auth-module\property-management\subject-management\application-list.vue
+ * @Description: 
+-->
+<template>
+    <dg-card class="box-card" header="应用列表">
+        <el-form ref="form" :model="cardForm" label-suffix=":" inline>
+            <el-form-item label="应用系统名称">
+                <el-input clearable placeholder="请输入应用系统名称" v-model="cardForm.name"></el-input>
+            </el-form-item>
+            <el-form-item label="系统在用标识">
+                <el-select v-model="cardForm.userType" placeholder="请选择应用在用标识" style="width:13rem">
+                    <el-option label="全部" value="all"></el-option>
+                    <el-option label="启用" value="1"></el-option>
+                    <el-option label="停用" value="0"></el-option>
+                </el-select>
+            </el-form-item>
+            <el-form-item>
+                <dg-button type="primary" icon="el-icon-search" @click="doSearchPersion">查询</dg-button>
+                <dg-button type="primary" icon="el-icon-plus">添加</dg-button>
+            </el-form-item>
+        </el-form>
+        <Table
+            ref="table"
+            :url="tableUrl"
+            :headerData="cardApplicationList"
+            :condition="reportForm"
+            :lazyLoad="true"
+            @handleRowClick="handleRowClick"
+        >
+        </Table>
+    </dg-card>
+</template>
+
+<script>
+import Table from "@/pages/common/table";
+import * as dynamicManageApi from "@/api/dynamic-manage";
+import { cardApplicationList } from "../DataConfig";
+export default {
+    name: "personnelList", // 组件名称
+    props: {
+        // 接收父组件的数据
+    },
+    data() {
+        // 组件内部参数
+        return {
+            // 参数名称及默认值
+            cardApplicationList,
+            tableUrl: dynamicManageApi.tableUrl,
+            reportForm: {},
+            cardForm: {}
+        };
+    },
+    computed: {}, // 计算属性
+    watch: {}, // 侦听器（扩展的计算属性）
+    components: { Table }, // 注册局部组件
+    methods: {
+        /**
+         * @description: 查询
+         */
+        doSearchPersion() {},
+        /**
+         * @description: 单击表格行
+         */
+        handleRowClick() {}
+    }, // 内部方法
+    beforeCreate() {}, // 组件创建前
+    created() {}, // 组件创建完成后
+    beforeMount() {}, // 组件挂载前
+    mounted() {}, // 组件挂载完成后
+    beforeUpdate() {}, // 组件更新前
+    updated() {}, // 组件挂载完成后
+    beforeDestroy() {}, // 组件销毁前
+    destroyed() {} // 组件销毁完成后
+};
+</script>
+<style lang="scss" scoped></style>

src/pages/data-auth-module/property-management/subject-management/personnel-list.vue

@@ -0,0 +1,159 @@
+<!--
+ * @Author: Liugh
+ * @Date: 2021-05-19 15:43:35
+ * @LastEditTime: 2021-05-19 16:36:14
+ * @LastEditors: Do not edit
+ * @FilePath: \auth-web\src\pages\data-auth-module\property-management\subject-management\personnel-list.vue
+ * @Description: 
+-->
+<template>
+    <dg-card class="box-card" header="人员列表">
+        <el-form ref="form" :model="cardForm" label-suffix=":" inline>
+            <el-form-item label="姓名">
+                <el-input clearable placeholder="请输入姓名" v-model="cardForm.name"></el-input>
+            </el-form-item>
+            <el-form-item label="身份证号码">
+                <el-input clearable placeholder="请输入身份证号码" v-model="cardForm.name"></el-input>
+            </el-form-item>
+            <el-form-item label="所属单位">
+                <dg-tree-select
+                    v-model="cardForm.institution"
+                    placeholder="请选择所属单位"
+                    :data="options"
+                    clearable
+                    filterable
+                    multiple
+                ></dg-tree-select>
+            </el-form-item>
+            <el-form-item>
+                <dg-button type="primary" icon="el-icon-search" @click="doSearchPersion">查询</dg-button>
+                <dg-button type="primary" icon="el-icon-plus" @click="add">添加</dg-button>
+            </el-form-item>
+        </el-form>
+        <Table
+            ref="table"
+            :url="tableUrl"
+            :headerData="cardPersonnelList"
+            :condition="reportForm"
+            :lazyLoad="true"
+            @handleRowClick="handleRowClick"
+        >
+        </Table>
+    </dg-card>
+</template>
+
+<script>
+import Table from "@/pages/common/table";
+import * as dynamicManageApi from "@/api/dynamic-manage";
+import { cardPersonnelList } from "../DataConfig";
+import addDialog from "./add-dialog";
+const editorArea = ["900px", "660px"];
+export default {
+    name: "personnelList", // 组件名称
+    props: {
+        // 接收父组件的数据
+    },
+    data() {
+        // 组件内部参数
+        return {
+            // 参数名称及默认值
+            cardPersonnelList,
+            tableUrl: dynamicManageApi.tableUrl,
+            reportForm: {},
+            cardForm: {},
+            options: [
+                {
+                    id: "fruits",
+                    label: "Fruits",
+                    children: [
+                        {
+                            id: "apple",
+                            label: "Apple",
+                            isNew: true
+                        },
+                        {
+                            id: "grapes",
+                            label: "Grapes",
+                            disabled: true
+                        },
+                        {
+                            id: "pear",
+                            label: "Pear"
+                        },
+                        {
+                            id: "strawberry",
+                            label: "Strawberry 🍓"
+                        },
+                        {
+                            id: "watermelon",
+                            label: "Watermelon 🍉"
+                        }
+                    ]
+                },
+                {
+                    id: "vegetables",
+                    label: "Vegetables",
+                    children: [
+                        {
+                            id: "corn",
+                            label: "Corn 🌽"
+                        },
+                        {
+                            id: "carrot",
+                            label: "Carrot 🥕"
+                        },
+                        {
+                            id: "eggplant",
+                            label: "Eggplant 🍆"
+                        },
+                        {
+                            id: "tomato",
+                            label: "Tomato 🍅"
+                        }
+                    ]
+                }
+            ]
+        };
+    },
+    computed: {}, // 计算属性
+    watch: {}, // 侦听器（扩展的计算属性）
+    components: { Table }, // 注册局部组件
+    methods: {
+        /**
+         * @description: 查询
+         */
+        doSearchPersion() {},
+        /**
+         * @description: 单击表格行
+         */
+        handleRowClick() {},
+        /**
+         * @description: 添加
+         */
+
+        add() {
+            const layer = this.$dgLayer({
+                title: "详情",
+                shade: [0.4, "#FFF"],
+                content: addDialog,
+                props: {},
+                on: {
+                    success() {
+                        layer.close(layer.dialogIndex);
+                    }
+                },
+                area: editorArea
+            });
+        }
+    }, // 内部方法
+    beforeCreate() {}, // 组件创建前
+    created() {}, // 组件创建完成后
+    beforeMount() {}, // 组件挂载前
+    mounted() {}, // 组件挂载完成后
+    beforeUpdate() {}, // 组件更新前
+    updated() {}, // 组件挂载完成后
+    beforeDestroy() {}, // 组件销毁前
+    destroyed() {} // 组件销毁完成后
+};
+</script>
+<style lang="scss" scoped></style>

src/pages/data-auth-module/property-management/subject-management/subject-property.vue

@@ -0,0 +1,112 @@
+<!--
+ * @Author: Liugh
+ * @Date: 2021-05-17 14:54:08
+ * @LastEditTime: 2021-05-19 16:20:59
+ * @LastEditors: Do not edit
+ * @FilePath: \auth-web\src\pages\data-auth-module\property-management\subject-management\subject-property.vue
+ * @Description: 
+-->
+
+<template>
+    <main class="subject-property">
+        <dg-row :gutter="20">
+            <dg-col :span="5">
+                <tree
+                    ref="tree"
+                    class="u-pm__left"
+                    title="主体属性类"
+                    @handleGetNode="handleGetNode"
+                    @submitRootNode="submitRootNode"
+                />
+            </dg-col>
+            <dg-col :span="6">
+                <dg-card class="box-card" header="属性详情">
+                    <el-form ref="ruleForm" :rules="rules" :model="form" label-width="80px">
+                        <el-form-item label="属性类别">
+                            <el-input v-model="form.name" placeholder="请输入属性类别"></el-input>
+                        </el-form-item>
+                        <el-form-item label="属性名称">
+                            <el-input v-model="form.name" placeholder="请输入属性名称"></el-input>
+                        </el-form-item>
+                        <el-form-item label="属性值">
+                            <el-input v-model="form.idCard" placeholder="请输入属性值"></el-input>
+                        </el-form-item>
+                        <el-form-item label="说明">
+                            <el-input v-model="form.idCard" type="" placeholder="请输入说明"></el-input>
+                        </el-form-item>
+                    </el-form>
+                </dg-card>
+            </dg-col>
+            <dg-col :span="13">
+                <component :is="compoentValue"></component>
+            </dg-col>
+        </dg-row>
+    </main>
+</template>
+
+<script>
+import Tree from "@/pages/common/tree";
+import personnelList from "./personnel-list";
+import agencyList from "./agency-list";
+import applicationList from "./application-list";
+export default {
+    name: "subject-property", // 组件名称
+    props: {
+        // 接收父组件的数据
+    },
+    data() {
+        // 组件内部参数
+        return {
+            // 参数名称及默认值
+            compoentType: [],
+            compoentValue: "personnel-list",
+            form: {},
+            rules: {},
+            reportPersionForm: {
+                applyName: { value: "", op: "like" },
+                orgId: { value: "", op: "=" }
+            }
+        };
+    },
+    computed: {}, // 计算属性
+    watch: {}, // 侦听器（扩展的计算属性）
+    components: { Tree, personnelList, agencyList, applicationList }, // 注册局部组件
+    methods: {
+        /**
+         * @description:树方法
+         */
+        handleGetNode({ id }) {
+            const that = this;
+            const oldVal = that.reportPersionForm.orgId.value;
+            if (oldVal != id) {
+                that.reportPersionForm.orgId.value = id;
+                that.handleSearch();
+            }
+        },
+        /**
+         * @description: 默认查询跟节点
+         */
+        submitRootNode({ id, name }) {
+            const that = this;
+            this.$nextTick(() => {
+                that.handleGetNode({ id, name });
+            });
+        },
+        /**
+         * @description: 表单查询
+         */
+        handleSearch() {}
+    }, // 内部方法
+    beforeCreate() {}, // 组件创建前
+    created() {}, // 组件创建完成后
+    beforeMount() {}, // 组件挂载前
+    mounted() {}, // 组件挂载完成后
+    beforeUpdate() {}, // 组件更新前
+    updated() {}, // 组件挂载完成后
+    beforeDestroy() {}, // 组件销毁前
+    destroyed() {} // 组件销毁完成后
+};
+</script>
+<style lang="scss" scoped>
+@import "../index.scss";
+</style>

src/pages/data-auth-module/property-management/subject-property.vue

@@ -1,7 +0,0 @@
-<!--
- * @Author: Liugh
- * @Date: 2021-05-17 14:54:08
- * @LastEditTime: 2021-05-17 14:54:08
- * @LastEditors: Do not edit
- * @Description: 
--->

src/router/modules/data-auth-module.js

@@ -37,7 +37,7 @@ const componentsRouter = [
             },
             {
                 path: "subject-property",
-                component: () => import("@/pages/data-auth-module/property-management/subject-property"),
+                component: () => import("@/pages/data-auth-module/property-management/subject-management/subject-property"),
                 name: "subject-property",
                 meta: { title: "主体属性类管理", noCache: false, permission: ["QXGL_SQKTGL_SJFJFLBM"] }
             }