sasp-admin 0.2.57

package/src/views/menu/component/menuModule.vue

@@ -0,0 +1,449 @@
+<template>
+    <el-container style="height: 100%" class="menuModuleContainer">
+        <el-main id="tableMain" style="height: 100%">
+            <el-container style="height:100%" class="table-list-container">
+                <el-main style="height: 100%;" ref="tableMain">
+                    <el-table :data="crud.dataStore.records" :ref="crud.tableRef" stripe border height="100%"
+                              :header-row-style="{'height':'10px'}"
+                              style="width: 100%;">
+                        <el-table-column type="selection" width="40" align="center"></el-table-column>
+                        <el-table-column label="模块名称" prop="moduleName" align="center"></el-table-column>
+                        <el-table-column label="图标" prop="moduleIcon" align="center">
+                            <template slot-scope="scope">
+                                <i :class="scope.row.moduleIcon" style="font-size: 20px"></i>
+                            </template>
+                        </el-table-column>
+                        <el-table-column label="颜色" prop="moduleColor" align="center">
+                            <template slot-scope="scope">
+                                <span :style="{'color':scope.row.moduleColor}">{{scope.row.moduleColor}}</span>
+                            </template>
+                        </el-table-column>
+                        <el-table-column :sort-method="moduleSort" label="模块排序" prop="sort" sortable
+                                         align="center"></el-table-column>
+
+                        <el-table-column label="操作" align="center" width="200">
+                            <template slot-scope="scope">
+                                <el-button size="small" icon="el-icon-edit" type="primary"
+                                           @click="crud.update(scope.row)">
+                                    编辑
+                                </el-button>
+                            </template>
+                        </el-table-column>
+                    </el-table>
+                </el-main>
+            </el-container>
+
+            <el-dialog :close-on-click-modal=false title="菜单所属模块" :visible.sync="crud.dialogVisible" lock-scroll>
+                <el-form :rules="rules" :ref="crud.addFormRef" :model="crud.formData" label-width="120px"
+                         style="width:95%;">
+                    <div v-if="crud.optCode === 'add'">
+                        <el-form-item label="模块归属" prop="orgDimensionId">
+                            <el-select v-model="crud.formData.orgDimensionId" multiple placeholder="请选择"
+                                       style="width: 100%">
+                                <el-option
+                                        v-for="item in orgDimensionIdOptions"
+                                        :key="item.id"
+                                        :label="item.value"
+                                        :value="item.id">
+                                </el-option>
+                            </el-select>
+                        </el-form-item>
+                    </div>
+                    <el-form-item label="模块名称" prop="moduleName">
+                        <el-input v-model="crud.formData.moduleName"></el-input>
+                    </el-form-item>
+                    <el-form-item label="菜单排序" prop="sort">
+                        <el-input-number :min="1" v-model="crud.formData.sort" label="菜单排序"></el-input-number>
+                    </el-form-item>
+                    <el-form-item label="图标" prop="moduleIcon">
+                        <el-input v-model="crud.formData.moduleIcon" style="display: none"></el-input>
+                        <el-button @click="selectIconDialog = true" style="padding: 5px">
+                            <i :class="defaultMenuIcon.indexOf('saspiconfont') > -1 ? defaultMenuIcon : 'saspiconfont pl-icon-tuxiang'" style="font-size:30px"></i>
+                        </el-button>
+                        <el-button style="position: relative;top:-5px" @click="clearIcon">清空
+                        </el-button>
+                    </el-form-item>
+                    <el-form-item label="颜色" prop="moduleColor">
+                        <el-color-picker
+                                v-model="crud.formData.moduleColor"></el-color-picker>
+                    </el-form-item>
+                    <el-form-item label="备注" prop="remark">
+                        <el-input type="textarea" v-model="crud.formData.remark" :rows="2"></el-input>
+                    </el-form-item>
+                </el-form>
+                <div slot="footer" class="dialog-footer">
+                    <el-button type="primary" @click="formSubmit()" size="small" icon="el-icon-success">确 定</el-button>
+                    <el-button @click="crud.dialogVisible = false" size="small" icon="el-icon-error">取 消</el-button>
+                </div>
+            </el-dialog>
+            <el-dialog :close-on-click-modal=false title="选择图标" class="dialog" :visible.sync="selectIconDialog" width="80%" height="90%"
+                       top="4vh">
+                <font-icon :callback="selectIcon"></font-icon>
+            </el-dialog>
+        </el-main>
+
+        <el-footer style="height: 40px">
+            <el-pagination
+                    :ref="crud.pageRef"
+                    :page-sizes="crud.pageSizes"
+                    :page-size="crud.pageSize"
+                    :current-page="crud.page"
+                    :total="crud.dataStore.total"
+                    @size-change="crud.sizeChange()"
+                    @current-change="crud.currentPage()"
+                    layout="total, sizes, prev, pager, next, jumper">
+            </el-pagination>
+        </el-footer>
+    </el-container>
+</template>
+
+<script>
+    import {FontIcon} from 'sasp-base';
+
+    export default {
+        props: ['id', 'menuLocal', 'moduleName', 'callBack', 'doSearch', 'resetSearch', 'badgeHidden'],
+        name: "menu-module",
+        components: {
+            FontIcon
+        },
+        data() {
+            let validateModuleName = (rule, value, callback) => {
+                if (this.crud.formData.moduleName) {
+                    if (this.crud.optCode === 'update') {
+                        /** 修改 */
+                        this.crud.vue.axios.post(this.api.menuModule.list, {
+                            'orgDimensionId': this.crud.formData.orgDimensionId.join(","),
+                            'moduleName': this.crud.formData.moduleName
+                        }).then((res) => {
+                            if (res.data.total > 0) {
+                                // 修改时模块名称可一致
+                                if (res.data.rows[0].id !== this.crud.formData.id) {
+                                    callback(new Error('模块名称重复'))
+                                } else {
+                                    callback();
+                                }
+                            } else {
+                                callback();
+                            }
+                        });
+                    } else {
+                        /** 添加 */
+                        let orgDimensionIds = this.crud.formData.orgDimensionId.join(",");
+                        this.crud.vue.axios.post(this.api.menuModule.findDuplicateMenuModule, {
+                            'orgDimensionIds': orgDimensionIds,
+                            'moduleName': this.crud.formData.moduleName
+                        }).then((res) => {
+                            if (res.data > 0) {
+                                callback(new Error('模块名称重复'))
+                            } else {
+                                callback();
+                            }
+                        });
+                    }
+
+                } else {
+                    callback();
+                }
+            };
+            return {
+                defaultMenuIcon: 'saspiconfont pl-icon-tuxiang',
+                count: 0,
+                orgDimensionIdOptions: [],
+                crud: new this.CrudUtil({
+                    vue: this,
+                    entityName: "menuModule",
+                    url: this.api.menuModule.url,
+                    noClearSearchColumns: ['orgDimensionId'],
+                    searchForm: {orgDimensionId: this.id},
+                    addDefaultData: {
+                        orgDimensionId: [],
+                        moduleColor: '#fff'
+                    },
+
+                    beforeSubmit: function (formData) {
+                        formData.orgDimensionId = (formData.orgDimensionId || []).join(",");
+                        return true;
+                    },
+
+                    updateLoadData: function (formData) {
+                        formData.orgDimensionId = (formData.orgDimensionId || "").split(",");
+                    }
+                }),
+                rules: {
+                    orgDimensionId: [
+                        {
+                            required: true,
+                            message: '请选择用户类别',
+                            trigger: 'blur'
+                        }
+                    ],
+                    moduleName: [
+                        {
+                            required: true,
+                            message: '请输入模块名称',
+                            trigger: 'blur'
+                        },
+                        {
+                            validator: validateModuleName,
+                            trigger: 'blur'
+                        }
+                    ],
+                    sort: [
+                        {
+                            required: true,
+                            message: '请输入菜单排序',
+                            trigger: 'blur'
+                        }
+                    ]
+                },
+                initNoPageData: [],
+                menuModelObj: {},
+                selectIconDialog: false
+            };
+        },
+        created() {
+            this.init();
+            this.initOrgDimensionId();
+        },
+        watch: {
+            'crud.dialogVisible'(value) {
+                if (value) {
+                    let vm = this;
+                    if (vm.crud.optCode === 'update') {
+                        let moduleIcon = vm.crud.formData.moduleIcon;
+                        if (!moduleIcon) {
+                            vm.defaultMenuIcon = 'saspiconfont pl-icon-tuxiang';
+                        } else {
+                            vm.defaultMenuIcon = moduleIcon;
+                        }
+                    } else {
+                        vm.defaultMenuIcon = 'saspiconfont pl-icon-tuxiang';
+                    }
+                }
+            }
+
+        },
+        methods: {
+            moduleSort(a, b) {
+                return Number(b.sort);
+            },
+            init() {
+                this.axios.post(this.api.menuModule.find, {
+                    'orgDimensionId': this.id
+                }).then((res) => {
+                    // this.count = res.data.length;
+                    // this.callBack(this.count, this.id);
+                    this.initNoPageData = res.data;
+                });
+
+            },
+            initOrgDimensionId() {
+                //初始化系统维度id
+                let vm = this;
+                vm.orgDimensionIdOptions = [];
+                vm.axios.post(vm.api.sysOrgDimension.find).then((res) => {
+                    let {data} = res;
+                    for (let item of data) {
+                        let {id, dimSpec} = item;
+                        if(dimSpec){
+                            dimSpec = JSON.parse(vm.platStringUtil.replaceAll(dimSpec,"'","\"") || "{}");
+                            for (let [key, value] of Object.entries(dimSpec)) {
+                                let obj = {};
+                                obj['id'] = id;
+                                if (key === 'menuLocalName') {
+                                    obj['value'] = value;
+                                    vm.orgDimensionIdOptions.push(obj);
+                                }
+                            }
+                        }
+                    }
+                    let sysTabObj = {
+                        id: 'sys',
+                        value: '系统'
+                    };
+                    vm.orgDimensionIdOptions.push(sysTabObj);
+
+                });
+            },
+            compareArray(a, b) {
+                if (a.length !== b.length) {
+                    return false;
+                }
+                const length = a.length;
+                for (let i = 0; i < length; i++) {
+                    if (!this.compare(a[i], b[i])) {
+                        return false;
+                    }
+                }
+
+                return true;
+            },
+            compareObject(a, b) {
+                const keyA = Object.keys(a);
+                const keyB = Object.keys(b);
+
+                if (keyA.length !== keyB.length) {
+                    return false;
+                }
+
+                return keyA.every(key => {
+                    return this.compare(a[key], b[key]);
+                });
+            },
+            compare(a, b) {
+                if (a === b) {
+                    return true;
+                }
+
+                if (typeof a !== typeof b || a === null || b === null) {
+                    return false;
+                }
+                //判断对象里面的数组是否相等
+                if (Array.isArray(a)) {
+                    if (!Array.isArray(b)) {
+                        return false;
+                    }
+                    return this.compareArray(a, b);
+                }
+
+                if (typeof a === "object") {
+                    return this.compareObject(a, b);
+                }
+
+                return false;
+            },
+            formSubmit() {
+                let vm = this;
+                let crud = this.crud;
+                crud.vue.$refs[crud.setting.addFormRef].validate(function (valid) {
+                    if (!valid) {
+                        return;
+                    }
+
+                    if (!crud.beforeSubmit(crud.formData, crud.vue)) {
+                        return;
+                    }
+
+                    let url = crud.optCode === "add" ? crud.setting.addUrl : crud.setting.updateUrl;
+
+                    let entityName = crud.setting.entityName;
+                    let formData = {};
+                    let notSubmitCols = new Set(["createTime", "updateTime"]);
+                    Object.keys(crud.formData).forEach(function (key) {
+                        if (url.indexOf("!") > -1) { // action
+                            (!notSubmitCols.has(key)) && (formData[entityName + "." + key] = crud.formData[key]);
+                        } else { // mvc
+                            (!notSubmitCols.has(key)) && (formData[key] = crud.formData[key]);
+                        }
+                    });
+
+                    crud.axios.post(url, formData).then(function (res) {
+                        crud.vue.$message({
+                            duration: 1000,
+                            type: 'success',
+                            message: res.data.operateMessage
+                        });
+                        crud.dialogVisible = false;
+                        // crud.search();
+                        vm.doSearch('afterSubmit');
+                    });
+
+                });
+
+            },
+            remove() {
+                let vm = this;
+                let crud = this.crud;
+
+                let selection = crud.vue.$refs[crud.setting.tableRef].selection;
+                if ((selection || []).length === 0) {
+                    vm.$message({
+                        duration: 1500,
+                        type: 'info',
+                        message: '请至少选择一条需要删除的数据！'
+                    });
+                    return;
+                }
+
+                vm.$confirm('是否确定删除选择的“' + selection.length + '”条数据?', '警告', {
+                    confirmButtonText: '确定',
+                    cancelButtonText: '取消',
+                }).then(function () {
+                    let arrIds = [];
+                    selection.forEach(function (data) {
+                        arrIds.push(data.id);
+                    });
+                    crud.axios.post(crud.setting.deleteUrl, {"ids": arrIds.join(",")}).then(function (response) {
+                        vm.$message({
+                            type: 'success',
+                            message: response.data.operateMessage || '删除成功！'
+                        });
+                        vm.count -= arrIds.length;
+                        vm.callBack(vm.count, vm.id);
+                        if (vm.count === 0) {
+                            vm.$emit('changeBadge', true);
+                        }
+                        crud.search();
+                        vm.init();
+
+                    });
+                });
+            },
+            searchModuleName(moduleName, operationType) {
+                let vm = this;
+                vm.$set(vm.crud.searchForm, 'moduleName', moduleName);
+                if (operationType === 'doSearch') {
+                    vm.crud.search(function (crudVue) {
+                        crudVue.count = crudVue.crud.dataStore.total;
+                        vm.callBack(crudVue.count, crudVue.id);
+                    });
+                } else if (operationType === 'resetSearch') {
+                    vm.$emit('changeBadge', true);
+                    vm.crud.search();
+                } else if (operationType === 'afterSubmit') {
+                    if (moduleName !== '') {
+                        vm.$emit('changeBadge', false);
+                        vm.crud.search(function (crudVue) {
+                            crudVue.count = crudVue.crud.dataStore.total;
+                            vm.callBack(crudVue.count, crudVue.id);
+                        });
+                    } else {
+                        vm.$emit('changeBadge', true);
+                        vm.crud.search();
+                    }
+                }
+            },
+            clearIcon() {
+                this.defaultMenuIcon = 'saspiconfont pl-icon-tuxiang';
+                this.crud.formData.moduleIcon = '';
+            },
+            selectIcon(data) {
+                if(data.startsWith("el-icon-")){
+                    this.crud.formData.moduleIcon = data;
+                    this.defaultMenuIcon = data;
+                }else{
+                    this.crud.formData.moduleIcon = 'saspiconfont ' + data;
+                    this.defaultMenuIcon = 'saspiconfont ' + data;
+                }
+                this.selectIconDialog = false;
+            },
+        }
+    };
+</script>
+
+<style scoped>
+    .dialog /deep/ .el-dialog__body{
+        padding: 0;
+        height: calc(100% - 50px);
+    }
+</style>
+<style>
+    .el-color-picker__icon {
+        color: #222222;
+    }
+
+    .menuModuleContainer .el-table td, .el-table th {
+        padding: 9px 0;
+    }
+
+</style>

package/src/views/menu/menuLocal.vue

@@ -0,0 +1,223 @@
+<template>
+    <el-container style="height: 100%">
+        <el-header style="height: auto;">
+            <div class="search-form-parent el-card">
+                <el-form :inline="true" :model="crud.searchForm" size="small" class="demo-form-inline"
+                         @keyup.enter.native="doSearch()" onSubmit="return false;">
+                    <el-form-item label="模块名称">
+                        <el-input v-model="moduleName" placeholder="请输入"></el-input>
+                    </el-form-item>
+                    <el-form-item>
+                        <el-button type="primary" icon="el-icon-search" @click="doSearch()">查询</el-button>
+                        <el-button icon="el-icon-close" @click="resetSearch()">清空</el-button>
+                    </el-form-item>
+                </el-form>
+            </div>
+        </el-header>
+        <el-main style="height: 100%;padding: 10px 10px 0" class="menuMain">
+            <el-container style="height:100%" class="table-list-container">
+                <el-header style="height: auto;" size="medium">
+                    <el-button type="primary" size="small" round icon="el-icon-circle-plus" @click="add()">新增
+                    </el-button>
+                    <el-button type="danger" size="small" round icon="el-icon-delete" @click="remove()">删除
+                    </el-button>
+                    <el-button type="warning" style="float: right" size="small" round icon="el-icon-loading"
+                               @click="initMenu()">初始化数据
+                    </el-button>
+                </el-header>
+                <el-main style="height: 100%;">
+                    <el-tabs v-model="activeName" type="border-card">
+                        <el-tab-pane v-for="(obj,index) in tabNames" :label="obj.value" :key="index" :name="index + ''">
+                            <el-badge v-if="obj.count>0" slot="label" :value="obj.count" :hidden="badgeHidden">
+                                <el-button type="text">{{obj.value}}</el-button>
+                            </el-badge>
+                            <el-badge v-else slot="label" :value="obj.count" hidden>
+                                <el-button type="text">{{obj.value}}</el-button>
+                            </el-badge>
+                            <menu-module :id="obj.id" :menuLocal="obj.value" :ref="'module'+index"
+                                         v-show="activeName == index + ''"
+                                         :moduleName="moduleSearchName" :callBack="callBack" :doSearch="doSearch"
+                                         :resetSearch="resetSearch" :badgeHidden="badgeHidden"
+                                         @changeBadge="changeBadge"></menu-module>
+                        </el-tab-pane>
+                    </el-tabs>
+                </el-main>
+            </el-container>
+        </el-main>
+    </el-container>
+
+
+</template>
+
+<script>
+    import MenuModule from './component/menuModule'
+
+    export default {
+        components: {
+            MenuModule
+        },
+        name: "menu-local",
+        data() {
+            return {
+                crud: new this.CrudUtil({
+                    vue: this,
+                    entityName: "menuModule",
+                    url: this.api.menuModule.url,
+                    initNoSearch: true
+                }),
+                activeName: 0,
+                tabNames: [],
+                moduleName: '',
+                moduleSearchName: '',
+                badgeHidden: true // badge小圆点标记
+            };
+        },
+        created() {
+            this.initTabs();
+        },
+        methods: {
+            initTabs() {
+                let vm = this;
+                //初始化tabs
+                vm.axios.post(vm.api.sysOrgDimension.find).then((res) => {
+                    let {data} = res;
+                    for (let {dimSpec, id, isUse} of data) {
+                        //判断是否启用和dimSpec是否有值
+                        if (isUse === '1' && dimSpec) {
+                            let dimSpecObj = JSON.parse(dimSpec);
+                            if(dimSpecObj.hasOwnProperty("menuLocalName")){
+                                let obj = {};
+                                obj['id'] = id;
+                                obj['value'] = dimSpecObj["menuLocalName"];
+                                this.tabNames.push(obj);
+                            }
+                        }
+                    }
+                    let sysTabObj = {
+                        id: 'sys',
+                        value: '系统'
+                    };
+                    vm.tabNames.push(sysTabObj);
+                });
+            },
+            callBack(count, id) {
+                for (let key in this.tabNames) {
+                    if (id === this.tabNames[key].id) {
+                        this.$set(this.tabNames[key], 'count', count);
+                    }
+                }
+            },
+            doSearch(operationType) {
+                let vm = this;
+                vm.moduleSearchName = vm.moduleName;
+                // badge小圆点标记显示
+                // if(vm.moduleSearchName !==''){
+                vm.badgeHidden = false;
+                for (let i = 0; i < vm.tabNames.length; i++) {
+                    vm.$refs["module" + i][0].searchModuleName(vm.moduleSearchName, operationType || 'doSearch');
+                }
+                // }
+            },
+            resetSearch() {
+                let vm = this;
+                vm.moduleSearchName = '';
+                vm.moduleName = '';
+                // badge小圆点标记隐藏
+                vm.badgeHidden = true;
+                for (let i = 0; i < vm.tabNames.length; i++) {
+                    vm.$refs["module" + i][0].searchModuleName(vm.moduleSearchName, 'resetSearch');
+
+                }
+            },
+            add() {
+                let vm = this;
+                vm.$refs["module" + vm.activeName][0].crud.add(vm.initNoPageData);
+            },
+            remove() {
+                let vm = this;
+                vm.$refs["module" + vm.activeName][0].remove();
+            },
+            initMenu() {
+                let vm = this;
+                vm.$confirm('此操作是将数字字典的系统功能模块重新导入并重置菜单归属数据, 是否继续?', '提示', {
+                    confirmButtonText: '确定',
+                    cancelButtonText: '取消',
+                    type: 'warning'
+                }).then(() => {
+                    let tabObj = {};
+                    for (let {id, value} of vm.tabNames) {
+                        tabObj[value] = id;
+                    }
+                    vm.axios.post("/platMenuController/findMenuModelCdss").then(function (menuRes) {
+                        let menudata = menuRes.data;
+                        let insertArr = [];
+                        if(menudata.length>0) {
+                            let obj = {};
+                            for (let i = 0; i < menudata.length; i++) {
+                                if (menudata[i].cdss&&menudata[i].menuModel&&tabObj[menudata[i].cdss]) {
+                                    obj = {};
+                                    obj["orgDimensionId"] = tabObj[menudata[i].cdss];
+                                    obj["id"] = menudata[i].menuModel.substring(0,16)+tabObj[menudata[i].cdss].substring(0,16);
+                                    obj["moduleName"] = menudata[i].menuModelName;
+                                    insertArr.push(obj);
+                                }
+                            }
+                        }
+                        if (insertArr.length > 0) {
+                            vm.axios.post(vm.api.menuModule.deleteAll).then(function () {
+                                vm.axios.post(vm.api.menuModule.batchAdd, {
+                                    "insertObj": JSON.stringify(insertArr)
+                                }).then(function (addRes) {
+                                    vm.axios.post("/platMenuController/updateByCdss",tabObj).then(function(res){
+                                        vm.axios.post("/platMenuController/updateMenuModule");
+                                    });
+                                    let msg = addRes.data.operateSuccess ? "初始化完成" : "初始化失败";
+                                    vm.$message({
+                                        message: msg,
+                                        type: 'success',
+                                        duration: 1200
+                                    });
+                                    vm.resetSearch();
+                                })
+                            });
+                        }else{
+                            vm.$message({
+                                message: "无需要初始化数据，初始化结束",
+                                type: 'success',
+                                duration: 1200
+                            });
+                        }
+                    })
+                }).catch(() => {
+                    this.$message({
+                        type: 'info',
+                        message: '已取消'
+                    });
+                });
+            },
+            changeBadge(res) {
+                this.badgeHidden = res;
+            }
+        }
+    }
+</script>
+
+<style scoped>
+    .menuMain /deep/ .el-badge__content.is-fixed {
+        top: 9px;
+        right: 7px;
+    }
+
+    .menuMain /deep/ .el-tabs__content {
+        height: calc(100% - 55px);
+        padding: 15px 15px 0;
+    }
+
+    .menuMain /deep/ .el-tab-pane {
+        height: 100%;
+    }
+
+    .menuMain /deep/ .el-tabs {
+        height: calc(100% - 30px);
+    }
+</style>