数据分级分类新增表单页面

src/api/data-auth.js

@@ -128,6 +128,34 @@ export function delDataSecLev(id) {
     });
 }
 
+// 数据资源分类表码
+const dataSourceClaBaseUrl = "/dataclassifysvr/v2"
+export const dataSourceClaTableUrl = `${dataSourceClaBaseUrl}/search`;
+// 获取数据资源分类详情
+export function getDataSourceClaDetail(labId) {
+    return request({
+        url: `${dataSecLevBaseUrl}/detailAllLevel/` + labId,
+        method: "get"
+    });
+}
+// 保存数据资源分类
+export function saveDataSourceCla(data) {
+    return request({
+        url: `${dataSourceClaBaseUrl}/save`,
+        method: "POST",
+        data
+    });
+}
+// 删除数据资源分类
+export function delDataSourceCla(id) {
+    return request({
+        url: `${dataSourceClaBaseUrl}/deleteById/` + id,
+        method: "DELETE"
+    });
+}
+
+
+
 const dataSourceBaseUrl = "/dataresourcesrv/v1"
 
 
@@ -139,13 +167,6 @@ export function getFieldClassifyList() {
     });
 }
 
-// 数据安全等级列表
-export function getSecurityLevelsList() {
-    return request({
-        url: `${dataSourceBaseUrl}/securitylevels`,
-        method: "get",
-    });
-}
 
 
 /************************************ 清单  *****************************************/

src/pages/common/form-detail/index.vue

@@ -0,0 +1,72 @@
+<!--
+表单详情组件
+@Author: linqian
+@Date: 2021-05-28 09:51
+-->
+<template>
+    <div>
+        <el-form v-if="detailInfo.id" :model="detailInfo" :label-width="labelWidth" label-suffix="：">
+            <el-row>
+                <el-col :span="item.span || 12" v-for="(item, index) in config" :key="index">
+                    <el-form-item :label="item.label">
+                        <template v-if="item.code">
+                            <div class="u-detail__text" v-translate="{ code: item.code }">
+                                {{ detailInfo[item.value] }}
+                            </div>
+                        </template>
+                        <template v-else-if="item.enum">
+                            <div class="u-detail__text" v-translate="{ enum: item.enum }">
+                                {{ detailInfo[item.value] }}
+                            </div>
+                        </template>
+                        <template v-else-if="item.isTime">
+                            <div class="u-detail__text">
+                                {{ detailInfo[item.value] | dateFormatter(item.format) }}
+                            </div>
+                        </template>
+                        <template v-else-if="item.custom">
+                            <div class="u-detail__text">
+                                <slot :name="item.value" :value="detailInfo[item.value]"></slot>
+                            </div>
+                        </template>
+                        <template v-else>
+                            <div class="u-detail__text">
+                                {{ detailInfo[item.value] }}
+                            </div>
+                        </template>
+                    </el-form-item>
+                </el-col>
+            </el-row>
+        </el-form>
+    </div>
+</template>
+
+<script>
+export default {
+    props: {
+        detailInfo: {
+            type: Object,
+            default: () => {}
+        },
+        config: {
+            type: Array,
+            default: () => []
+        },
+        labelWidth: {
+            type: String,
+            default: "100px"
+        }
+    },
+    components: {},
+    data() {
+        return {};
+    },
+    computed: {},
+    methods: {},
+    created() {},
+    mounted() {}
+};
+</script>
+
+<style lang='scss'>
+</style>

src/pages/common/form/index.vue

@@ -8,14 +8,9 @@
         <dg-row>
             <el-form :model="form" ref="form" label-suffix=":" :label-width="labelWidth">
                 <dg-col v-for="(item, index) in formConfig" :key="index" :span="item.span || 12">
-                    <el-form-item :label="item.label" :prop="item.prop">
+                    <el-form-item :label="item.label" :prop="item.prop" :rules="item.rules">
                         <template v-if="item.type == 'input' || !item.type">
-                            <el-input
-                                v-model="item.value"
-                                :placeholder="item.placeholder"
-                                :rules="item.rules"
-                                clearable
-                            ></el-input>
+                            <el-input v-model="form[item.prop]" :placeholder="item.placeholder" clearable></el-input>
                         </template>
                         <template v-if="item.type == 'select'">
                             <template v-if="item.code">
@@ -23,7 +18,6 @@
                                     v-model="item.value"
                                     :placeholder="item.placeholder"
                                     :code="item.code"
-                                    :rules="item.rules"
                                     clearable
                                 ></dg-select>
                             </template>
@@ -32,7 +26,6 @@
                                     v-model="item.value"
                                     :placeholder="item.placeholder"
                                     :enum="item.enum"
-                                    :rules="item.rules"
                                     clearable
                                 ></dg-select>
                             </template>
@@ -43,7 +36,6 @@
                                 type="textarea"
                                 rows="3"
                                 :placeholder="item.placeholder"
-                                :rules="item.rules"
                                 clearable
                             ></el-input>
                         </template>
@@ -81,26 +73,28 @@ export default {
     computed: {},
     methods: {
         saveForm() {
+            const vm = this;
             this.$refs.form.validate((valid) => {
                 if (valid) {
-
-                }else {
-                    return;
+                    this.$emit("success",  vm.form)
                 }
             });
         }
     },
     created() {
-         for (let j = 0; j < this.config.length; j++) {
-               let { prop, value } = this.config[j];
-               this.$set(this.form, prop, value)              
-           }
-        
-        if(Object.keys(this.info).length > 0) {
-           for (let i = 0; i < this.config.length; i++) {
-               let element = this.config[i];
-               element.value = this.info[element.prop];              
-           }
+        // 编辑，字段回填
+        if (Object.keys(this.info).length > 0) {
+             for (let i = 0; i < this.formConfig.length; i++) {
+                let { prop } = this.formConfig[i];
+                this.formConfig[i].value = this.info[prop];
+                this.form[prop] = value;
+            }
+        } else {
+            for (let j = 0; j < this.formConfig.length; j++) {
+                let { prop, value } = this.formConfig[j];
+                this.$set(this.form, prop, value);
+                // this.form[prop] = value;
+            }
         }
     },
     mounted() {}

src/pages/data-auth-module/auth-object-manage/appfun-resource-manage/app-list.vue

@@ -67,7 +67,7 @@
 import importFile from "@/pages/common/import";
 import addAppForm from "./add-app-form";
 import { appRestApi, appSync } from "@/api/application";
-import addFuncForm2 from "./add-func-form";
+import addFuncForm from "./add-func-form";
 
 export default {
     components: {},
@@ -123,7 +123,7 @@ export default {
         handleSetFunc(app, e) {
             const layer = this.$dgLayer({
                 title: "功能配置",
-                content: addFuncForm2,
+                content: addFuncForm,
                 props: {
                     app
                 },
@@ -188,6 +188,7 @@ export default {
                 },
                 btn: ["确定", "取消"],
                 btnAlign: "r",
+                noneBtnField: isDetail,
                 yes: (index) => {
                     let _layer = layer.$children[0];
                     _layer.saveForm().then((res) => {

src/pages/data-auth-module/auth-object-manage/sort-code-manage/DataConfig.js

@@ -8,13 +8,13 @@ export const dataLevelForm = [
         label: "代码",
         prop: "levelCode",
         value: "",
-        rules: [{ required: true, message: "代码不能为空", trigger: "change" }]
+        rules: [{ required: true, message: "请输入代码", trigger: "change" }]
     },
     {
         label: "数据分级",
         prop: "levelName",
         value: "",
-        rules: [{ required: true, message: "数据分级不能为空", trigger: "change" }]
+        rules: [{ required: true, message: "请输入数据分级", trigger: "change" }]
     },
     {
         label: "说明",
@@ -29,14 +29,14 @@ export const safeLevelForm = [
         label: "代码",
         prop: "secCode",
         value: "",
-        rules: [{ required: true, message: "代码不能为空", trigger: "change" }],
+        rules: [{ required: true, message: "请输入代码", trigger: "change" }],
         span: 24
     },
     {
         label: "数据安全级别",
         prop: "secName",
         value: "",
-        rules: [{ required: true, message: "数据安全级别不能为空", trigger: "change" }],
+        rules: [{ required: true, message: "请输入数据安全级别", trigger: "change" }],
         span: 24
     },
     {

src/pages/data-auth-module/auth-object-manage/sort-code-manage/forms/source-sort-form.vue

@@ -0,0 +1,141 @@
+<!--
+数据资源分类
+@Author: linqian
+@Date: 2021-05-31 09:04
+-->
+<template>
+    <dg-row>
+        <el-form ref="form" :model="form" :rules="rules" label-width="160px" label-suffix="：">
+            <dg-col :span="12">
+                <el-form-item label="一级代码" prop="firCode">
+                    <el-input v-model="form.firCode" placeholder="" v-if="!isDetail"></el-input>
+                    <span v-else>{{ form.firCode }}</span>
+                </el-form-item>
+                <el-form-item label="二级代码" prop="secCode">
+                    <el-input v-model="form.secCode" placeholder="" v-if="!isDetail"></el-input>
+                    <span v-else>{{ form.secCode }}</span>
+                </el-form-item>
+                <el-form-item label="标签分类代码" prop="labClaCode">
+                    <el-input v-model="form.labClaCode" placeholder="" v-if="!isDetail"></el-input>
+                    <span v-else>{{ form.labClaCode }}</span>
+                </el-form-item>
+                <el-form-item label="标签代码" prop="labCode">
+                    <el-input v-model="form.labCode" placeholder="" v-if="!isDetail"></el-input>
+                    <span v-else>{{ form.labCode }}</span>
+                </el-form-item>
+            </dg-col>
+            <dg-col :span="12">
+                <el-form-item label="数据组织一级分类" prop="firName">
+                    <el-input v-model="form.firName" placeholder="" v-if="!isDetail"></el-input>
+                    <span v-else>{{ form.firName }}</span>
+                </el-form-item>
+                <el-form-item label="数据组织二级分类" prop="secName">
+                    <el-input v-model="form.secName" placeholder="" v-if="!isDetail"></el-input>
+                    <span v-else>{{ form.secName }}</span>
+                </el-form-item>
+                <el-form-item label="标签分类" prop="labClaName">
+                    <el-input v-model="form.labClaName" placeholder="" v-if="!isDetail"></el-input>
+                    <span v-else>{{ form.labClaName }}</span>
+                </el-form-item>
+                <el-form-item label="标签名称" prop="labName">
+                    <el-input v-model="form.labName" placeholder="" v-if="!isDetail"></el-input>
+                    <span v-else>{{ form.labName }}</span>
+                </el-form-item>
+            </dg-col>
+            <dg-col :span="24">
+                <el-form-item label="说明" prop="remark">
+                    <el-input
+                        v-model="form.remark"
+                        placeholder=""
+                        type="textarea"
+                        :rows="3"
+                        v-if="!isDetail"
+                    ></el-input>
+                    <span v-else>{{ form.remark }}</span>
+                </el-form-item>
+            </dg-col>
+        </el-form>
+    </dg-row>
+</template>
+
+<script>
+import { appRestApi } from "@/api/application";
+export default {
+    props: {
+        id: String,
+        isDetail: {
+            type: Boolean,
+            default: false
+        }
+    },
+    components: {},
+    data() {
+        return {
+            form: {
+                firCode: "",
+                secCode: "",
+                labClaCode: "",
+                labCode: "",
+                firName: "",
+                secName: "",
+                labClaName: "",
+                labName: "",
+                remark: "",
+            },
+            rules: {
+                firCode: [{ required: true, message: "请输入一级代码", trigger: "change" }],
+                secCode: [{ required: true, message: "请输入二级代码", trigger: "change" }],
+                labClaCode: [{ required: true, message: "请输入标签分类代码", trigger: "change" }],
+                labCode: [{ required: true, message: "请输入标签代码", trigger: "change" }],
+                firName: [{ required: true, message: "请输入数据组织一级分类", trigger: "change" }],
+                secName: [{ required: true, message: "请输入数据组织二级分类", trigger: "change" }],
+                labClaName: [{ required: true, message: "请输入标签分类", trigger: "change" }],
+                labName: [{ required: true, message: "请输入标签名称", trigger: "change" }]
+            }
+        };
+    },
+    computed: {},
+    methods: {
+        /**
+         * 保存
+         */
+        saveForm() {
+            return new Promise((resolve) => {
+                this.$refs.form.validate((valid) => {
+                    if (valid) {
+                        const api = this.id ? "update" : "save";
+                        appRestApi[api](this.form)
+                            .then((res) => {
+                                this.$message.success("保存成功!");
+                                resolve("成功");
+                            })
+                            .catch((error) => {
+                                this.$message.error(error);
+                            });
+                    }
+                });
+            });
+        },
+        /**
+         * 获取详情
+         */
+        getDetail() {
+            appRestApi.detail(this.id).then((res) => {
+                this.form = res;
+            });
+        }
+    },
+    created() {
+        if (this.id) {
+            if (this.isDetail) {
+                this.rules = {};
+            }
+            this.getDetail();
+        }
+    },
+    mounted() {}
+};
+</script>
+
+<style lang='scss'>
+</style>

src/pages/data-auth-module/auth-object-manage/sort-code-manage/safe-level-code.vue

@@ -124,9 +124,7 @@ export default {
                 });
             });
         },
-        handleSave() {
-
-        },
+        handleSave() {},
         handleOpenForm(title, info = {}) {
             const vm = this;
             const layer = this.$dgLayer({
@@ -134,7 +132,8 @@ export default {
                 content: Form,
                 props: {
                     info,
-                    config: safeLevelForm
+                    config: safeLevelForm,
+                    labelWidth: "120px"
                 },
                 btn: ["确定", "取消"],
                 btnAlign: "r",
@@ -142,6 +141,15 @@ export default {
                     let _layer = layer.$children[0];
                     _layer.saveForm();
                 },
+                on: {
+                    success(form) {
+                        saveDataSecLev(form).then((res) => {
+                            vm.$message.success("保存成功");
+                            layer.close(layer.dialogIndex);
+                            vm.handleSearch();
+                        });
+                    }
+                },
                 area: ["500px", "400px"]
             });
         }

src/pages/data-auth-module/auth-object-manage/sort-code-manage/source-sort-code.vue

@@ -8,51 +8,84 @@
         <!-- 搜索项 -->
         <el-form :inline="true" :model="form" class="search-form">
             <el-form-item label="数据组织一级分类">
-                <el-input v-model="form.firstLevelName" clearable></el-input>
+                <el-input v-model="form.firName.value" clearable></el-input>
             </el-form-item>
             <el-form-item label="数据组织二级分类">
-                <el-input v-model="form.secondLevelName" clearable></el-input>
+                <el-input v-model="form.secName.value" clearable></el-input>
             </el-form-item>
             <el-form-item label="标签名称">
-                <el-input v-model="form.labelName" clearable></el-input>
+                <el-input v-model="form.labCode.value" clearable></el-input>
             </el-form-item>
             <el-form-item>
                 <dg-button type="primary" @click="handleSearch" icon="el-icon-search">查询</dg-button>
                 <dg-button type="primary" @click="handleReset" icon="el-icon-refresh-right">重置</dg-button>
             </el-form-item>
         </el-form>
-        <!-- <el-row class="import-btn">
-            <dg-button type="primary" @click="handleImport" icon="el-icon-upload">导入</dg-button>
-        </el-row> -->
+          <!-- 操作 -->
+        <dg-row zebra="10px">
+            <dg-button type="primary" icon="el-icon-circle-plus-outline" @click="handleAdd">新增</dg-button>
+            <!-- <dg-button type="primary" icon="el-icon-refresh" @click="handleSync">同步</dg-button> -->
+            <!-- <dg-button type="primary" @click="handleImport" icon="el-icon-upload">导入</dg-button> -->
+        </dg-row>
         <!-- 列表 -->
-        <dg-table ref="table" :data="tableList" border row-key="id" paging-type="client">
+        <dg-table ref="table" :url="dataSourceClaTableUrl" :conditon="form" border row-key="id">
             <dg-table-column type="index" width="75" label="序号" align="center"></dg-table-column>
-            <dg-table-column prop="firstLevelCode" label="一级代码" align="center"></dg-table-column>
-            <dg-table-column prop="firstLevelName" label="数据组织一级分类" align="center"></dg-table-column>
-            <dg-table-column prop="secondLevelCode" label="二级代码" align="center"></dg-table-column>
-            <dg-table-column prop="secondLevelName" label="数据组织二级分类" align="center"></dg-table-column>
-            <dg-table-column prop="labelClassifyCode" label="标签分类代码" align="center"></dg-table-column>
-            <dg-table-column prop="labelClassifyName" label="标签分类" align="center"></dg-table-column>
-            <dg-table-column prop="labelCode" label="标签代码" align="center"></dg-table-column>
-            <dg-table-column prop="labelName" label="标签名称" align="center"></dg-table-column>
+            <dg-table-column prop="firCode" label="一级代码" align="center"></dg-table-column>
+            <dg-table-column prop="firName" label="数据组织一级分类" align="center"></dg-table-column>
+            <dg-table-column prop="secCode" label="二级代码" align="center"></dg-table-column>
+            <dg-table-column prop="secName" label="数据组织二级分类" align="center"></dg-table-column>
+            <dg-table-column prop="labClaCode" label="标签分类代码" align="center"></dg-table-column>
+            <dg-table-column prop="labClaName" label="标签分类" align="center"></dg-table-column>
+            <dg-table-column prop="labCode" label="标签代码" align="center"></dg-table-column>
+            <dg-table-column prop="labName" label="标签名称" align="center"></dg-table-column>
+            <dg-table-column label="操作" align="center">
+                <template slot-scope="scope">
+                    <div class="u-table__operation">
+                        <el-tooltip
+                            v-for="(item, index) in optList"
+                            :key="index"
+                            :content="item.tooltip"
+                            effect="dark"
+                            placement="top-end"
+                        >
+                            <i :class="item.icon" @click="item.on(scope.row, $event)"></i>
+                        </el-tooltip>
+                    </div>
+                </template>
+            </dg-table-column>
         </dg-table>
     </div>
 </template>
 
 <script>
 import importFile from "@/pages/common/import";
-import { getDataClassifyList } from "@/api/data-auth";
-
+import sourceSortForm from "./forms/source-sort-form";
+import { dataSourceClaTableUrl, delDataSourceCla } from "@/api/data-auth";
 export default {
     components: {},
     data() {
         return {
+            dataSourceClaTableUrl,
             tableList: [],
             form: {
-                firstLevelName: "",
-                secondLevelName: "",
-                labelName: ""
-            }
+                firName: {
+                    value: "",
+                    op: "like"
+                },
+                secName: {
+                    value: "",
+                    op: "like"
+                },
+                labCode: {
+                    value: "",
+                    op: "like"
+                }
+            },
+            optList: [
+                { icon: "el-icon-edit", tooltip: "修改", on: this.handleEdit },
+                { icon: "el-icon-document", tooltip: "详情", on: this.handleViewDetail },
+                { icon: "el-icon-delete", tooltip: "删除", on: this.handleDelete }
+            ]
         };
     },
     computed: {},
@@ -61,18 +94,7 @@ export default {
          * @description: 查询
          */
         handleSearch() {
-            this.$refs.table.paginationOptions.currentPage = 1;
-            const { firstLevelName, secondLevelName, labelName } = this.form;
-            if (!secondLevelName.trim() && !firstLevelName.trim() && !labelName.trim()) {
-                this.tableList = this.orgList;
-            } else {
-                this.tableList = this.orgList.filter(
-                    (item) =>
-                        item.firstLevelName.indexOf(firstLevelName) > -1 &&
-                        item.secondLevelName.indexOf(secondLevelName) > -1 &&
-                        item.labelName.indexOf(labelName) > -1
-                );
-            }
+
         },
         /**
          * 重置
@@ -82,6 +104,58 @@ export default {
                 this.form[key] = "";
             }
         },
+        /**
+         * 编辑
+         */
+        handleEdit(row, e) {
+            this.handleOpenForm(row.labId, "编辑");
+        },
+        /**
+         * 查看详情id
+         */
+        handleViewDetail(row, e) {
+            this.handleOpenForm(row.id, "详情", true);
+        },
+        /**
+         * 删除
+         */
+        handleDelete(row, e) {
+            this.$dgConfirm(`是否确认删除该条数据！`, "提示", {}).then(() => {
+               delDataSourceCla(row.id).then((res) => {
+                    this.$message.success(res);
+                    this.handleSearch();
+                });
+            });
+        },
+        /**
+         * 新增
+         */
+        handleAdd() {
+            this.handleOpenForm(void 0, "新增");
+        },
+        handleOpenForm(id, title, isDetail = false) {
+            const vm = this;
+            const layer = this.$dgLayer({
+                title,
+                content: sourceSortForm,
+                props: {
+                    id,
+                    isDetail
+                },
+                btn: ["确定", "取消"],
+                btnAlign: "r",
+                noneBtnField: isDetail,
+                yes: (index) => {
+                    let _layer = layer.$children[0];
+                    _layer.saveForm().then((res) => {
+                        layer.close(index);
+                        vm.handleSearch();
+                    });
+                },
+
+                area: ["900px", "500px"]
+            });
+        },
         /**
          * @description: 导入
          */
@@ -108,12 +182,7 @@ export default {
             });
         }
     },
-    created() {
-        getDataClassifyList().then((res) => {
-            this.orgList = res.data.content;
-            this.tableList = res.data.content;
-        });
-    },
+    created() {},
     mounted() {}
 };
 </script>