浏览代码

角色管理修改

ljr-395181403 1 年之前
父节点
当前提交
7d7487b13a

+ 50 - 50
.eslintrc.js

@@ -1,51 +1,51 @@
 module.exports = {
-  //此项是用来告诉eslint找当前配置文件不能往父级查找
-  root: true,
-  //此项是用来指定eslint解析器的,解析器必须符合规则,babel-eslint解析器是对babel解析器的包装使其与ESLint解析
-  //此项是用来指定javaScript语言类型和风格,sourceType用来指定js导入的方式,默认是script,此处设置为module,指某块导入方式
-  parserOptions: {
-    parser: 'babel-eslint',
-    sourceType: 'module'
-  },
-  //此项指定环境的全局变量,下面的配置指定为浏览器环境
-  env: {
-    browser: true,
-    node: true,
-    jquery: true
-  },
-  // https://github.com/feross/standard/blob/master/RULES.md#javascript-standard-style
-  extends: ['eslint:recommended', 'plugin:vue/essential'],
-  // required to lint *.vue files
-  // 此项是用来提供插件的,插件名称省略了eslint-plugin-,下面这个配置是用来规范html的
-  plugins: ['vue', 'prettier'],
-  // add your custom rules here
-  // 下面这些rules是用来设置从插件来的规范代码的规则,使用必须去掉前缀eslint-plugin-
-  // 主要有如下的设置规则,可以设置字符串也可以设置数字,两者效果一致
-  // "off" -> 0 关闭规则
-  // "warn" -> 1 开启警告规则
-  //"error" -> 2 开启错误规则
-  // 了解了上面这些,下面这些代码相信也看的明白了
-  rules: {
-    'require-jsdoc': 0,
-    'valid-jsdoc': 0,
-    // allow async-await
-    'generator-star-spacing': 'off',
-    // allow debugger during development
-    'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0,
-    'no-console': process.env.NODE_ENV === 'production' ? 0 : 0,
-    // js语句结尾必须使用分号
-    semi: ['off', 'always'],
-    // 三等号
-    eqeqeq: 0,
-    // 强制在注释中 // 或 /* 使用一致的空格
-    'spaced-comment': 1,
-    // 关键字后面使用一致的空格
-    'keyword-spacing': 1,
-    // 强制在 function的左括号之前使用一致的空格
-    'space-before-function-paren': 0,
-    // 禁止出现未使用过的变量
-    'no-unused-vars': 1,
-    // 要求或禁止末尾逗号
-    'comma-dangle': 0
-  }
-};
+    //此项是用来告诉eslint找当前配置文件不能往父级查找
+    root: true,
+    //此项是用来指定eslint解析器的,解析器必须符合规则,babel-eslint解析器是对babel解析器的包装使其与ESLint解析
+    //此项是用来指定javaScript语言类型和风格,sourceType用来指定js导入的方式,默认是script,此处设置为module,指某块导入方式
+    parserOptions: {
+        parser: "babel-eslint",
+        sourceType: "module"
+    },
+    //此项指定环境的全局变量,下面的配置指定为浏览器环境
+    env: {
+        browser: true,
+        node: true,
+        jquery: true
+    },
+    // https://github.com/feross/standard/blob/master/RULES.md#javascript-standard-style
+    extends: ["eslint:recommended", "plugin:vue/essential"],
+    // required to lint *.vue files
+    // 此项是用来提供插件的,插件名称省略了eslint-plugin-,下面这个配置是用来规范html的
+    plugins: ["vue", "prettier"],
+    // add your custom rules here
+    // 下面这些rules是用来设置从插件来的规范代码的规则,使用必须去掉前缀eslint-plugin-
+    // 主要有如下的设置规则,可以设置字符串也可以设置数字,两者效果一致
+    // "off" -> 0 关闭规则
+    // "warn" -> 1 开启警告规则
+    //"error" -> 2 开启错误规则
+    // 了解了上面这些,下面这些代码相信也看的明白了
+    rules: {
+        "require-jsdoc": 0,
+        "valid-jsdoc": 0,
+        // allow async-await
+        "generator-star-spacing": "off",
+        // allow debugger during development
+        "no-debugger": process.env.NODE_ENV === "production" ? 2 : 0,
+        "no-console": process.env.NODE_ENV === "production" ? 0 : 0,
+        // js语句结尾必须使用分号
+        semi: ["off", "always"],
+        // 三等号
+        eqeqeq: 0,
+        // 强制在注释中 // 或 /* 使用一致的空格
+        "spaced-comment": 1,
+        // 关键字后面使用一致的空格
+        "keyword-spacing": 1,
+        // 强制在 function的左括号之前使用一致的空格
+        "space-before-function-paren": 0,
+        // 禁止出现未使用过的变量
+        "no-unused-vars": 0,
+        // 要求或禁止末尾逗号
+        "comma-dangle": 0
+    }
+}

+ 8 - 7
.prettierrc.js

@@ -1,8 +1,9 @@
 module.exports = {
-  printWidth: 120, //一行的字符数,如果超过会进行换行,默认为80
-  tabWidth: 2, //一个tab代表几个空格数,默认为2
-  useTabs: false, //是否使用tab进行缩进,默认为false,表示用空格进行缩减
-  singleQuote: true, //字符串是否使用单引号,默认为false,使用双引号
-  trailingComma: 'none', //是否使用尾逗号,有三个可选值"<none|es5|all>"
-  bracketSpacing: true //对象大括号直接是否有空格,默认为true,效果:{ foo: bar }
-};
+    printWidth: 120, //一行的字符数,如果超过会进行换行,默认为80
+    semi: false, // 句尾是否添加分号
+    tabWidth: 4, //一个tab代表几个空格数,默认为2
+    useTabs: false, //是否使用tab进行缩进,默认为false,表示用空格进行缩减
+    singleQuote: false, //字符串是否使用单引号,默认为false,使用双引号
+    trailingComma: "none", //是否使用尾逗号,有三个可选值"<none|es5|all>"
+    bracketSpacing: true //对象大括号直接是否有空格,默认为true,效果:{ foo: bar }
+}

+ 1 - 1
config/dev.env.js

@@ -32,7 +32,7 @@ module.exports = merge(prodEnv, {
   IS_MOCK: 'false',
   PROXY_TABLE: JSON.stringify({
     '/dcucauth': {
-      target: "http://10.11.1.237:8861"
+      target: 'http://10.11.1.237:8861' // 马志强
       // target: "http://10.254.11.203:8861"
       //  target: "http://192.168.10.2:8871"
       //  target: "http://192.168.6.133:3471"

+ 1 - 1
package.json

@@ -41,7 +41,7 @@
     "postcss-salad": "^2.0.1",
     "request": "^2.88.2",
     "screenfull": "^4.0.0",
-    "ui-component-v4": "^1.2.43",
+    "ui-component-v4": "1.2.43",
     "ui-gojs": "^2.1.9",
     "ui-jz-v4-common": "^1.2.222",
     "vue": "2.6.10",

+ 14 - 7
src/api/func-resource.js

@@ -1,8 +1,8 @@
 /****************************** 功能资源管理 ************************************ */
-import request from "@/utils/request";
+import request from "@/utils/request"
 
 const baseUrl = "/authsvr/v2/appfuninfo"
-export const tableUrl = baseUrl+"/search"
+export const tableUrl = baseUrl + "/search"
 export function save(data) {
     return request({
         url: `${baseUrl}/save`,
@@ -19,13 +19,20 @@ export function update(data) {
 }
 export function detail(id) {
     return request({
-        url: `${baseUrl}/`+id,
-        method: "GET",
+        url: `${baseUrl}/` + id,
+        method: "GET"
     })
 }
 export function del(id) {
     return request({
-        url: `${baseUrl}/`+id,
-        method: "DELETE",
+        url: `${baseUrl}/` + id,
+        method: "DELETE"
     })
-}
+}
+
+export function getRoleMenu(roleId) {
+    return request({
+        url: `${baseUrl}/menuTree?roleId=` + roleId,
+        method: "GET"
+    })
+}

+ 11 - 12
src/api/roleinfo-manage.js

@@ -5,40 +5,39 @@
 
  */
 
-import req from "@/utils/req";
-import axios from "../utils/req";
+import req from "@/utils/req"
+import axios from "../utils/req"
 
-export const base = "/authsvr/v2/roleinfo";
+export const base = "/authsvr/v2/roleinfo"
 // 应用有限配额角色列表
-export const orgQuoRoleTable = `${base}/orgQuotoAuthInfo/_search`;
+export const orgQuoRoleTable = `${base}/orgQuotoAuthInfo/_search`
 // 应用系统角色数
-export const appRoleTableUrl = `${base}/roleList/_search`;
+export const appRoleTableUrl = `${base}/roleList/_search`
 
 // 新增
 export function addRole(data) {
-    return axios.post(`${base}/role`, data, { loading: true });
+    return axios.post(`${base}/role`, data, { loading: true })
 }
 
 // 修改
 export function editRole(data) {
-    return axios.put(`${base}/role`, data);
+    return axios.put(`${base}/role`, data)
 }
 
 // 删除
 export function deleteRole(id) {
-    return axios.delete(`${base}/role/${id}`);
+    return axios.delete(`${base}/role/${id}`)
 }
 // 详情
 export function getRoleInfo(id) {
-    return axios.get(`${base}/role/${id}`);
+    return axios.get(`${base}/role/${id}`)
 }
 
 // 根据roleId 获取勾选菜单
 export function getMenuChecked(roleId) {
-    return axios.get(`${base}/checked/${roleId}`);
+    return axios.get(`${base}/checked/${roleId}`)
 }
 // 保存角色菜单
 export function saveRsGrid(data) {
-    return axios.post(`${base}/rsGrid`, data);
+    return axios.post(`${base}/rsGrid`, data)
 }
-

+ 381 - 375
src/pages/appfun-auth-manage/app-role-manage/author-role-manage.vue

@@ -1,401 +1,407 @@
 /** * 组件名称;权限配置-角色管理 * @author:laiyh * @Date:2020-07-27 */
 
 <template>
-  <dg-row :gutter="10" class="role-edit-box">
-    <dg-col :span="14">
-      <dg-card shadow="never" header="角色信息">
-        <el-form ref="form" :model="reportForm" label-suffix=":" inline>
-          <el-form-item label="名称" prop="name.value"
-            ><el-input
-              clearable
-              placeholder="请输入名称"
-              v-model="reportForm.name.value"
-              style="width: 160px"
-              @keyup.enter.native="handleSearchClick"
-            ></el-input
-          ></el-form-item>
-          <el-form-item label="层级" prop="role_level.value"
-            ><dg-select
-              filterable
-              clearable
-              v-model="reportForm.role_level.value"
-              placeholder="请选择层级"
-              code="DM_ROLE_LEVEL"
-              style="width: 160px"
-            ></dg-select
-          ></el-form-item>
-          <el-form-item
-            ><dg-button type="primary" icon="el-icon-search" @click="handleSearchClick">查询</dg-button></el-form-item
-          >
-        </el-form>
-        <div class="u-table-top__btn">
-          <dg-button type="primary" icon="el-icon-circle-plus-outline" @click="handleAddDialog">新增</dg-button>
-        </div>
-        <Table
-          ref="myRoleTable"
-          :url="roleTableUrl"
-          :headerData="titleData"
-          :condition="reportForm"
-          :maxheight="620"
-          @handleRowClick="handleRowClick"
-        >
-          <dg-table-column label="操作" width="120" align="center">
-            <template slot-scope="scope">
-              <div class="u-table__operation">
-                <el-tooltip class="item" effect="dark" content="修改"
-                  ><i class="el-icon-edit" @click="handleRoleEdit(scope.row)"></i
-                ></el-tooltip>
-                <el-tooltip class="item" effect="dark" content="删除"
-                  ><i class="el-icon-delete" @click="handleRoleDelete(scope.row)"></i
-                ></el-tooltip>
-              </div>
-            </template>
-          </dg-table-column>
-        </Table>
-      </dg-card>
-    </dg-col>
-    <dg-col :span="10">
-      <dg-card shadow="never" header="资源信息">
-        <div class="u-table-top__btn">
-          <dg-button type="primary" icon="el-icon-folder-checked" @click="handleSaveMenu">保存</dg-button>
-        </div>
-        <!--树形表格-->
-        <dg-table
-          :data="tableData"
-          :pagination="false"
-          style="width: 100%; margin-bottom: 20px"
-          row-key="id"
-          border
-          default-expand-all
-          ref="table"
-          :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
-          @select="select"
-          @select-all="selectAll"
-          @selection-change="selectionChange"
-        >
-          <dg-table-column type="selection" width="50"> </dg-table-column>
-          <dg-table-column prop="name" label="资源名称"> </dg-table-column>
-        </dg-table>
-      </dg-card>
-    </dg-col>
-  </dg-row>
+    <dg-row :gutter="10" class="role-edit-box">
+        <dg-col :span="14">
+            <dg-card shadow="never" header="角色信息">
+                <el-form ref="form" :model="reportForm" label-suffix=":" inline>
+                    <el-form-item label="名称" prop="name.value"
+                        ><el-input
+                            clearable
+                            placeholder="请输入名称"
+                            v-model="reportForm.name.value"
+                            style="width: 160px"
+                            @keyup.enter.native="handleSearchClick"
+                        ></el-input
+                    ></el-form-item>
+                    <el-form-item label="层级" prop="role_level.value">
+                        <dg-select
+                            filterable
+                            clearable
+                            v-model="reportForm.role_level.value"
+                            placeholder="请选择层级"
+                            code="DM_ROLE_LEVEL"
+                            style="width: 160px"
+                        ></dg-select
+                    ></el-form-item>
+                    <el-form-item
+                        ><dg-button type="primary" icon="el-icon-search" @click="handleSearchClick"
+                            >查询</dg-button
+                        ></el-form-item
+                    >
+                </el-form>
+                <div class="u-table-top__btn">
+                    <dg-button type="primary" icon="el-icon-circle-plus-outline" @click="handleAddDialog"
+                        >新增</dg-button
+                    >
+                </div>
+                <Table
+                    ref="myRoleTable"
+                    :url="roleTableUrl"
+                    :headerData="titleData"
+                    :condition="reportForm"
+                    :maxheight="620"
+                    @handleRowClick="handleRowClick"
+                >
+                    <dg-table-column label="操作" width="120" align="center">
+                        <template slot-scope="scope">
+                            <div class="u-table__operation">
+                                <el-tooltip class="item" effect="dark" content="修改"
+                                    ><i class="el-icon-edit" @click="handleRoleEdit(scope.row)"></i
+                                ></el-tooltip>
+                                <el-tooltip class="item" effect="dark" content="删除"
+                                    ><i class="el-icon-delete" @click="handleRoleDelete(scope.row)"></i
+                                ></el-tooltip>
+                            </div>
+                        </template>
+                    </dg-table-column>
+                </Table>
+            </dg-card>
+        </dg-col>
+        <dg-col :span="10">
+            <dg-card shadow="never" header="资源信息">
+                <div class="u-table-top__btn">
+                    <dg-button type="primary" icon="el-icon-folder-checked" @click="handleSaveMenu">保存</dg-button>
+                </div>
+                <!--树形表格-->
+                <dg-table
+                    :data="tableData"
+                    :pagination="false"
+                    style="width: 100%; margin-bottom: 20px"
+                    row-key="id"
+                    border
+                    default-expand-all
+                    ref="table"
+                    :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
+                    @select="select"
+                    @select-all="selectAll"
+                    @selection-change="selectionChange"
+                >
+                    <dg-table-column type="selection" width="50"> </dg-table-column>
+                    <dg-table-column prop="name" label="资源名称"> </dg-table-column>
+                </dg-table>
+            </dg-card>
+        </dg-col>
+    </dg-row>
 </template>
 
 <script>
-import Table from '@/components/table';
-import * as roleinfoManageApi from '@/api/roleinfo-manage';
-import * as appfunMenuApi from '@/api/common';
-import roleMange from './role-manage.vue';
+import Table from "@/components/table"
+import * as roleinfoManageApi from "@/api/roleinfo-manage"
+import * as appfunMenuApi from "@/api/common"
+import roleMange from "./role-manage.vue"
 
 export default {
-  name: '',
-  components: {
-    Table
-  },
-  // 接收父节点的参数
-  props: {
-    appId: {
-      type: String,
-      default: ''
-    }
-  },
-  data() {
-    return {
-      roleTableUrl: roleinfoManageApi.appRoleTableUrl,
-      reportForm: {
-        name: { value: '', op: 'like' },
-        role_level: { value: '', op: '=' },
-        app_id: { value: '', op: '=' }
-      },
-      titleData: [
-        { label: '角色名称', prop: 'name' },
-        { label: '角色层级', code: 'DM_ROLE_LEVEL', prop: 'rolelevelCode' },
-        { label: '警种', prop: 'policeCategory', code: 'T_MD_POLICE_TYPE' }
-      ],
-      treeProps: {
-        label: 'label',
-        children: 'children'
-      },
-      tableData: [],
-      selectArr: [],
-      roleId: ''
-    };
-  },
-  // 方法
-  methods: {
-    // 查询角色
-    handleSearchClick() {
-      this.$refs.myRoleTable.handleSearchClick();
+    name: "",
+    components: {
+        Table
     },
-    // 新增
-    handleAddDialog() {
-      const that = this;
-      const { appId } = that;
-      const layer = that.$dgLayer({
-        title: '新增角色',
-        area: ['550px', '600px'],
-        shadow: [0.4, '#fff'],
-        content: roleMange,
-        props: {
-          appId,
-          type: 'create'
-        },
-        on: {
-          success(bool = false) {
-            layer.close(layer.dialogIndex);
-            if (bool) {
-              that.reloadTable();
-            }
-          }
+    // 接收父节点的参数
+    props: {
+        appId: {
+            type: String,
+            default: ""
         }
-      });
-    },
-    // 修改
-    handleRoleEdit({ id }) {
-      const that = this;
-      const { appId } = that;
-      roleinfoManageApi.getRoleInfo(id).then((res) => {
-        const layer = that.$dgLayer({
-          title: '修改角色',
-          area: ['490px', '600px'],
-          shadow: [0.4, '#fff'],
-          content: roleMange,
-          props: {
-            appId,
-            type: 'update',
-            formData: res
-          },
-          on: {
-            success(bool = false) {
-              layer.close(layer.dialogIndex);
-              if (bool) {
-                that.reloadTable();
-              }
-            }
-          }
-        });
-      });
-    },
-    // 删除、
-    handleRoleDelete({ id, name }) {
-      const that = this;
-      that
-        .$confirm(`是否确定删除角色[${name}]?`, '提示', {
-          distinguishCancelAndClose: true,
-          confirmButtonText: '确定',
-          cancelButtonText: '取消'
-        })
-        .then((_) => {
-          roleinfoManageApi
-            .deleteRole(id)
-            .then(() => {
-              that.reloadTable();
-              that.$message.success('删除成功!');
-            })
-            .catch(() => {
-              that.$message.error('删除失败');
-            });
-        });
     },
-    // 刷新表格
-    reloadTable() {
-      const that = this;
-      that.$refs.myRoleTable.$refs.grid.reload();
-    },
-    /*************应用菜单start*********************/
-    // 应用菜单--应用关联
-    getAppfunMenu() {
-      const that = this;
-      const { appId } = that;
-      appfunMenuApi.getAppfunMenu(appId).then((res) => {
-        if (res && res.length > 0) {
-          // that.tableData = that.loopTableData(res);
-          that.tableData = res;
+    data() {
+        return {
+            roleTableUrl: roleinfoManageApi.appRoleTableUrl,
+            reportForm: {
+                name: { value: "", op: "like" },
+                role_level: { value: "", op: "=" },
+                app_id: { value: "", op: "=" }
+            },
+            titleData: [
+                { label: "角色名称", prop: "name" },
+                { label: "角色层级", code: "DM_ROLE_LEVEL", prop: "rolelevelCode" },
+                { label: "警种", prop: "policeCategory", code: "T_MD_POLICE_TYPE" }
+            ],
+            treeProps: {
+                label: "label",
+                children: "children"
+            },
+            tableData: [],
+            selectArr: [],
+            roleId: ""
         }
-      });
     },
-    // 循环设置菜单表格data
-    loopTableData(resArr) {
-      let arr = [];
-      // debugger;
-      function loopData(resArr2) {
-        if (resArr2 && resArr2.length > 0) {
-          resArr2.forEach((item) => {
-            arr.push(item);
-            if (item.children && item.children.length > 0) {
-              loopData(item.children);
+    // 方法
+    methods: {
+        // 查询角色
+        handleSearchClick() {
+            this.$refs.myRoleTable.handleSearchClick()
+        },
+        // 新增
+        handleAddDialog() {
+            const that = this
+            const { appId } = that
+            const layer = that.$dgLayer({
+                title: "新增角色",
+                area: ["550px", "650px"],
+                shadow: [0.4, "#fff"],
+                content: roleMange,
+                props: {
+                    appId,
+                    type: "create"
+                },
+                on: {
+                    success(bool = false) {
+                        layer.close(layer.dialogIndex)
+                        if (bool) {
+                            that.reloadTable()
+                        }
+                    }
+                }
+            })
+        },
+        // 修改
+        handleRoleEdit({ id }) {
+            const that = this
+            const { appId } = that
+            roleinfoManageApi.getRoleInfo(id).then(res => {
+                const layer = that.$dgLayer({
+                    title: "修改角色",
+                    area: ["490px", "650px"],
+                    shadow: [0.4, "#fff"],
+                    content: roleMange,
+                    props: {
+                        appId,
+                        type: "update",
+                        formData: res
+                    },
+                    on: {
+                        success(bool = false) {
+                            layer.close(layer.dialogIndex)
+                            if (bool) {
+                                that.reloadTable()
+                            }
+                        }
+                    }
+                })
+            })
+        },
+        // 删除、
+        handleRoleDelete({ id, name }) {
+            const that = this
+            that.$confirm(`是否确定删除角色[${name}]?`, "提示", {
+                distinguishCancelAndClose: true,
+                confirmButtonText: "确定",
+                cancelButtonText: "取消"
+            }).then(_ => {
+                roleinfoManageApi
+                    .deleteRole(id)
+                    .then(() => {
+                        that.reloadTable()
+                        that.$message.success("删除成功!")
+                    })
+                    .catch(() => {
+                        that.$message.error("删除失败")
+                    })
+            })
+        },
+        // 刷新表格
+        reloadTable() {
+            const that = this
+            that.$refs.myRoleTable.$refs.grid.reload()
+        },
+        /*
+         ************应用菜单start********************
+         */
+        // 应用菜单--应用关联
+        getAppfunMenu() {
+            const that = this
+            const { appId } = that
+            appfunMenuApi.getAppfunMenu(appId).then(res => {
+                if (res && res.length > 0) {
+                    // that.tableData = that.loopTableData(res);
+                    that.tableData = res
+                }
+            })
+        },
+        // 循环设置菜单表格data
+        loopTableData(resArr) {
+            let arr = []
+            // debugger;
+            function loopData(resArr2) {
+                if (resArr2 && resArr2.length > 0) {
+                    resArr2.forEach(item => {
+                        arr.push(item)
+                        if (item.children && item.children.length > 0) {
+                            loopData(item.children)
+                        }
+                    })
+                }
             }
-          });
-        }
-      }
-      loopData(resArr);
-      return arr;
-    },
-    // 应用菜单-角色关联
-    handleRowClick({ row }) {
-      const roleId = row.id;
-      const that = this;
-      that.roleId = row.id;
-      roleinfoManageApi
-        .getMenuChecked(roleId)
-        .then((res) => {
-          that.selectArr = [];
-          that.$refs.table.clearSelection(); // 清空用户选择
+            loopData(resArr)
+            return arr
+        },
+        // 应用菜单-角色关联
+        handleRowClick({ row }) {
+            const roleId = row.id
+            const that = this
+            that.roleId = row.id
+            roleinfoManageApi
+                .getMenuChecked(roleId)
+                .then(res => {
+                    that.selectArr = []
+                    that.$refs.table.clearSelection() // 清空用户选择
 
-          // 格式化tableData
-          let tempTableData = that.loopTableData(that.tableData);
+                    // 格式化tableData
+                    let tempTableData = that.loopTableData(that.tableData)
 
-          if (res && res.length > 0) {
-            that.loopSetChecked(res, tempTableData);
-          }
-        })
-        .catch((error) => {
-          that.$message.error(error);
-        });
-    },
-    // 递归设置勾选
-    loopSetChecked(checkList, allList) {
-      for (let i = 0; i < checkList.length; i++) {
-        for (let j = 0; j < allList.length; j++) {
-          if (checkList[i].funId === allList[j].id) {
-            this.toggleSelection(allList[j], true);
-            break;
-          }
-          // else {
-          //     if (allList[j].children) {
-          //         this.loopSetChecked(checkList, allList[j].children);
-          //         break;
-          //     }
-          // }
-        }
-      }
-    },
-    // 保存菜单
-    handleSaveMenu() {
-      const that = this;
-      if (!that.roleId) {
-        that.$message.warning('请选择角色!');
-        return;
-      }
-      if (that.selectArr.length == 0) {
-        that.$message.warning('请选择菜单!');
-        return;
-      }
-      let rsGridList = that.selectArr.map((el) => {
-        return { id: el.id };
-      });
-      console.log(rsGridList);
-      roleinfoManageApi
-        .saveRsGrid({
-          rsGridLists: rsGridList,
-          roleId: that.roleId
-        })
-        .then(() => {
-          that.$message.success('保存成功');
-        })
-        .catch((error) => {
-          that.$message.error('保存失败');
-        });
-    },
-    select(selection, row) {
-      const that = this;
-      if (
-        selection.some((el) => {
-          return row.id === el.id;
-        })
-      ) {
-        if (row.children) {
-          loopRowChild(row.children, true);
-          // row.children.map(j => {
-          //     this.toggleSelection(j, true);
-          // });
-        }
-      } else {
-        if (row.children) {
-          // row.children.map(j => {
-          //     this.toggleSelection(j, false);
-          // });
-          loopRowChild(row.children, false);
-        }
-      }
+                    if (res && res.length > 0) {
+                        that.loopSetChecked(res, tempTableData)
+                    }
+                })
+                .catch(error => {
+                    that.$message.error(error)
+                })
+        },
+        // 递归设置勾选
+        loopSetChecked(checkList, allList) {
+            for (let i = 0; i < checkList.length; i++) {
+                for (let j = 0; j < allList.length; j++) {
+                    if (checkList[i].funId === allList[j].id) {
+                        this.toggleSelection(allList[j], true)
+                        break
+                    }
+                    // else {
+                    //     if (allList[j].children) {
+                    //         this.loopSetChecked(checkList, allList[j].children);
+                    //         break;
+                    //     }
+                    // }
+                }
+            }
+        },
+        // 保存菜单
+        handleSaveMenu() {
+            const that = this
+            if (!that.roleId) {
+                that.$message.warning("请选择角色!")
+                return
+            }
+            if (that.selectArr.length == 0) {
+                that.$message.warning("请选择菜单!")
+                return
+            }
+            let rsGridList = that.selectArr.map(el => {
+                return { id: el.id }
+            })
+            console.log(rsGridList)
+            roleinfoManageApi
+                .saveRsGrid({
+                    rsGridLists: rsGridList,
+                    roleId: that.roleId
+                })
+                .then(() => {
+                    that.$message.success("保存成功")
+                })
+                .catch(error => {
+                    that.$message.error("保存失败")
+                })
+        },
+        select(selection, row) {
+            const that = this
+            if (
+                selection.some(el => {
+                    return row.id === el.id
+                })
+            ) {
+                if (row.children) {
+                    loopRowChild(row.children, true)
+                    // row.children.map(j => {
+                    //     this.toggleSelection(j, true);
+                    // });
+                }
+            } else {
+                if (row.children) {
+                    // row.children.map(j => {
+                    //     this.toggleSelection(j, false);
+                    // });
+                    loopRowChild(row.children, false)
+                }
+            }
 
-      function loopRowChild(rows, flag) {
-        rows.map((item) => {
-          if (item.children) {
-            loopRowChild(item.children, flag);
-          }
-          that.toggleSelection(item, flag);
-        });
-      }
-    },
-    selectAll(selection) {
-      const that = this;
-      // tabledata第一层只要有在selection里面就是全选
-      const isSelect = selection.some((el) => {
-        const tableDataIds = this.tableData.map((j) => j.id);
-        return tableDataIds.includes(el.id);
-      });
-      // tableDate第一层只要有不在selection里面就是全不选
-      const isCancel = !this.tableData.every((el) => {
-        const selectIds = selection.map((j) => j.id);
-        return selectIds.includes(el.id);
-      });
+            function loopRowChild(rows, flag) {
+                rows.map(item => {
+                    if (item.children) {
+                        loopRowChild(item.children, flag)
+                    }
+                    that.toggleSelection(item, flag)
+                })
+            }
+        },
+        selectAll(selection) {
+            const that = this
+            // tabledata第一层只要有在selection里面就是全选
+            const isSelect = selection.some(el => {
+                const tableDataIds = this.tableData.map(j => j.id)
+                return tableDataIds.includes(el.id)
+            })
+            // tableDate第一层只要有不在selection里面就是全不选
+            const isCancel = !this.tableData.every(el => {
+                const selectIds = selection.map(j => j.id)
+                return selectIds.includes(el.id)
+            })
 
-      function loopRowChild(rows, flag) {
-        rows.map((item) => {
-          if (item.children) {
-            loopRowChild(item.children, flag);
-          }
-          that.toggleSelection(item, flag);
-        });
-      }
-      if (isSelect) {
-        selection.map((el) => {
-          if (el.children) {
-            // el.children.map(j => {
-            //     this.toggleSelection(j, true);
-            // });
-            loopRowChild(el.children, true);
-          }
-        });
-      }
-      if (isCancel) {
-        this.tableData.map((el) => {
-          if (el.children) {
-            // el.children.map(j => {
-            //     this.toggleSelection(j, false);
-            // });
-            loopRowChild(el.children, false);
-          }
-        });
-      }
-    },
-    selectionChange(selection) {
-      this.selectArr = selection;
+            function loopRowChild(rows, flag) {
+                rows.map(item => {
+                    if (item.children) {
+                        loopRowChild(item.children, flag)
+                    }
+                    that.toggleSelection(item, flag)
+                })
+            }
+            if (isSelect) {
+                selection.map(el => {
+                    if (el.children) {
+                        // el.children.map(j => {
+                        //     this.toggleSelection(j, true);
+                        // });
+                        loopRowChild(el.children, true)
+                    }
+                })
+            }
+            if (isCancel) {
+                this.tableData.map(el => {
+                    if (el.children) {
+                        // el.children.map(j => {
+                        //     this.toggleSelection(j, false);
+                        // });
+                        loopRowChild(el.children, false)
+                    }
+                })
+            }
+        },
+        selectionChange(selection) {
+            this.selectArr = selection
+        },
+        toggleSelection(row, select) {
+            if (row) {
+                this.$nextTick(() => {
+                    this.$refs.table && this.$refs.table.toggleRowSelection(row, select)
+                })
+            }
+        }
+
+        /*
+         *********应用菜单end**********
+         */
     },
-    toggleSelection(row, select) {
-      if (row) {
-        this.$nextTick(() => {
-          this.$refs.table && this.$refs.table.toggleRowSelection(row, select);
-        });
-      }
+    // 页面创建完成$data可访问 $el不可以访问
+    created() {
+        const that = this
+        this.$set(this.reportForm.app_id, "value", this.appId)
+        this.getAppfunMenu()
     }
-
-    /**********应用菜单end***********/
-  },
-  // 页面创建完成$data可访问 $el不可以访问
-  created() {
-    const that = this;
-    this.$set(this.reportForm.app_id, 'value', this.appId);
-    this.getAppfunMenu();
-  }
-};
+}
 </script>
 
 <style lang="scss" scope>
 .role-edit-box {
-  .text-right {
-    text-align: right;
-  }
+    .text-right {
+        text-align: right;
+    }
 }
 </style>

+ 73 - 64
src/pages/appfun-auth-manage/app-role-manage/role-manage.vue

@@ -5,13 +5,22 @@
 -->
 <template>
     <el-form ref="sizeForm" :model="sizeForm" label-suffix=":" :rules="rules" label-width="120px">
+        <el-form-item prop="name" label="角色名称">
+            <el-input placeholder="请输入角色名称" v-model="sizeForm.name" clearable maxlength="20"></el-input>
+        </el-form-item>
+
         <el-form-item prop="code" label="角色代码">
             <el-input placeholder="请输入角色代码" v-model="sizeForm.code" clearable maxlength="30"></el-input>
         </el-form-item>
-        <el-form-item prop="name" label="角色名称">
-            <el-input placeholder="请输入角色名称" v-model="sizeForm.name" clearable maxlength="20"></el-input>
+
+        <el-form-item prop="roleCategory" label="关键状态">
+            <dg-select placeholder="请选择关键状态" v-model="sizeForm.roleCategory">
+                <el-option value="ALL" label="全局角色"></el-option>
+                <el-option value="LOCAL" label="本地角色"></el-option>
+            </dg-select>
         </el-form-item>
-        <el-form-item prop="roleLevel" label="角色层级">
+
+        <el-form-item v-if="sizeForm.roleCategory === 'LOCAL'" prop="roleLevel" label="角色层级">
             <dg-select
                 placeholder="请选择角色层级"
                 v-model="sizeForm.roleLevel"
@@ -20,7 +29,8 @@
                 code="DM_ROLE_LEVEL"
             ></dg-select>
         </el-form-item>
-        <el-form-item prop="policeCategory" label="警种">
+
+        <el-form-item v-if="sizeForm.roleCategory === 'LOCAL'" prop="policeCategory" label="警种">
             <dg-select
                 placeholder="请选择警种"
                 v-model="sizeForm.policeCategory"
@@ -29,10 +39,11 @@
                 code="T_MD_POLICE_TYPE"
             ></dg-select>
         </el-form-item>
-        <el-form-item prop="roleBusiness" label="业务域标签">
+
+        <el-form-item v-if="sizeForm.roleCategory === 'LOCAL'" prop="roleBusiness" label="业务域">
             <dg-tree-drop
                 v-model="sizeForm.roleBusiness"
-                placeholder="请选择业务域标签"
+                placeholder="请选择业务域"
                 :props="{
                     value: 'code',
                     label: 'name',
@@ -47,15 +58,16 @@
                 @change="handleTagTreeChange"
             ></dg-tree-drop>
         </el-form-item>
+
         <el-form-item prop="isNotLimitCount" label="是否限制配额">
             <dg-select
                 placeholder="请选择是否限制配额"
                 v-model="sizeForm.isNotLimitCount"
                 code="DM_ISENABLED"
-                clearable
             ></dg-select>
         </el-form-item>
-        <el-form-item prop="detail" label="详细描述">
+
+        <el-form-item v-if="sizeForm.roleCategory === 'LOCAL'" prop="detail" label="详细描述">
             <el-input type="textarea" :rows="2" v-model="sizeForm.detail"></el-input>
         </el-form-item>
 
@@ -67,9 +79,9 @@
 </template>
 
 <script>
-import * as roleinfoManageApi from "@/api/roleinfo-manage";
-import * as regular from "@/utils/regular";
-import { getBusinessTagTree } from "@/api/data-auth";
+import * as roleinfoManageApi from "@/api/roleinfo-manage"
+import * as regular from "@/utils/regular"
+import { getBusinessTagTree } from "@/api/data-auth"
 export default {
     name: "index",
     // 接收父页面传过来的属性
@@ -91,102 +103,103 @@ export default {
     data() {
         const checkCode = (rule, value, callback) => {
             if (!value) {
-                return callback(new Error("请输入角色代码"));
+                return callback(new Error("请输入角色代码"))
             }
             if (value && !regular.checkNumLetter(value)) {
-                return callback(new Error("角色代码只能由数字、字母、_组成"));
+                return callback(new Error("角色代码只能由数字、字母、_组成"))
             }
-            callback();
-        };
+            callback()
+        }
         return {
             sizeForm: {
-                appId: "", //应用id
-                code: "", //角色代码
-                name: "", //角色名称
-                roleLevel: "", //角色层级
+                appId: "", // 应用id
+                name: "", // 角色名称
+                code: "", // 角色代码
+                roleCategory: "", // 关键状态
+                roleLevel: "", // 角色层级
                 policeCategory: "", // 警种
-                roleBusiness: [], //业务域
-                isNotLimitCount: "", // 是否限额
-                detail: "" //详细描述
+                roleBusiness: [], // 业务域
+                isNotLimitCount: "0", // 是否限额
+                detail: "" // 详细描述
             },
             url: "",
             rules: {
+                name: [{ required: true, message: "请输入角色名称", trigger: "blur" }],
                 code: [
                     { required: true, message: "请输入角色代码", trigger: "blur" },
                     { validator: checkCode, trigger: "blur" }
                 ],
-                name: [{ required: true, message: "请输入角色名称", trigger: "blur" }],
-                roleLevel: [{ required: true, message: "请选择角色层级", trigger: "change" }],
-                isNotLimitCount: [{ required: true, message: "请选择是否限制配额", trigger: "change" }]
+                roleCategory: [{ required: true, message: "请选择关键状态", trigger: "change" }]
             },
             tagTree: []
-        };
+        }
+    },
+    created() {
+        this.init()
     },
-    // 计算属性
-    computed: {},
     // 方法
     methods: {
         handleClose() {
-            this.$emit("success");
+            this.$emit("success")
         },
         handlSave() {
-            this.sizeForm.name = this.sizeForm.name.trim();
-            let sizeForm = { ...this.sizeForm };
-            const api = this.type === "create" ? "addRole" : "editRole";
-            this.$refs.sizeForm.validate((valid) => {
+            this.sizeForm.name = this.sizeForm.name.trim()
+            let sizeForm = { ...this.sizeForm }
+            const api = this.type === "create" ? "addRole" : "editRole"
+            this.$refs.sizeForm.validate(valid => {
                 if (!valid) {
-                    return;
+                    return
                 }
                 // 业务域格式
-                sizeForm.roleBusiness = String(sizeForm.roleBusiness || "");
+                sizeForm.roleBusiness = String(sizeForm.roleBusiness || "")
                 roleinfoManageApi[api](sizeForm)
-                    .then((res) => {
-                        this.$message.success("保存成功");
-                        this.$emit("success", true);
+                    .then(res => {
+                        this.$message.success("保存成功")
+                        this.$emit("success", true)
+                    })
+                    .catch(error => {
+                        this.$message.error(error)
                     })
-                    .catch((error) => {
-                        this.$message.error(error);
-                    });
-            });
+            })
         },
         // 改变标签域
         handleTagTreeChange(codes, nodes) {
-            let tags = [];
+            let tags = []
             for (let i = 0; i < nodes.length; i++) {
-                const item = nodes[i];
+                const item = nodes[i]
                 if (!item.parent) {
-                    tags.push(item.code);
+                    tags.push(item.code)
                 }
             }
-            this.sizeForm.roleBusiness = tags.join(",");
+            this.sizeForm.roleBusiness = tags.join(",")
         },
         // 获取标签树
         getTagTree() {
-            return new Promise((resolve) => {
-                getBusinessTagTree().then((res) => {
-                    const tree = res.data.content.map((item) => {
-                        let disabled = true;
+            return new Promise(resolve => {
+                getBusinessTagTree().then(res => {
+                    const tree = res.data.content.map(item => {
+                        let disabled = true
                         if (item.parent && item.child) {
-                            disabled = false;
+                            disabled = false
                         }
                         return {
                             ...item,
                             disabled
-                        };
-                    });
-                    resolve(tree);
-                });
-            });
+                        }
+                    })
+                    resolve(tree)
+                })
+            })
         },
         async init() {
-            this.tagTree = await this.getTagTree();
+            this.getTagTree()
             // 关联应用id
-            this.$set(this.sizeForm, "appId", this.appId);
+            this.$set(this.sizeForm, "appId", this.appId)
             if (this.type == "create") {
                 // 业务域默认
                 // that.changeUrl("01");
             } else {
-                this.sizeForm = this.formData;
+                this.sizeForm = this.formData
                 // const { policeCategory } = that.sizeForm;
                 // const { roleBusiness } = that.sizeForm;
                 // if (roleBusiness) {
@@ -201,12 +214,8 @@ export default {
                 // }
             }
         }
-    },
-    // 创建组件时调用
-    created() {
-        this.init();
     }
-};
+}
 </script>
 
 <style scoped></style>