超管账号

src/constants/adminNavs.js

@@ -20,8 +20,8 @@ const navs = [
   {
     id: "4",
     parentId: "1",
-    name: "菜单管理",
-    url: "SchoolMenuManage"
+    name: "权限管理",
+    url: "PrivilegeManage"
   }
 ];
 

src/modules/admin/api.js

@@ -1,59 +1,29 @@
-import { $postParam, $post } from "@/plugins/axios";
-
-// user-manage
-export const userListPage = datas => {
-  return $postParam("/api/admin/sys/user/list_customer", datas);
-};
-export const updateUser = datas => {
-  return $post("/api/admin/sys/user/save_customer", datas);
-};
-export const ableUser = ({ id, enable }) => {
-  return $post("/api/admin/sys/user/enable", { id, enable });
-};
-export const resetPwd = id => {
-  return $post("/api/admin/sys/user/reset_password", { id });
-};
-export const userRoleListPage = () => {
-  return $postParam("/api/admin/sys/role/list_to_user", {});
-};
-
-// menu-manage
-export const menuList = datas => {
-  return $postParam("/api/admin/sys/privilege/list", datas);
-};
-export const updateMenu = datas => {
-  return $post("/api/admin/sys/privilege/save", datas);
-};
-export const deleteMenu = id => {
-  return $post("/api/admin/sys/privilege/remove", { id });
-};
-
-// school-menu-manage
-export const schoolMenuTree = () => {
-  return $post("/api/admin/menu/custom/list", {});
-};
-export const schoolSelectedMenuTree = schoolId => {
-  return $postParam("/api/admin/menu/custom/get_school_custom_privileges", {
-    schoolId
-  });
-};
-export const updateSchoolMenu = ({ schoolId, privilegeIds }) => {
-  return $post("/api/admin/menu/custom/save", { schoolId, privilegeIds });
-};
-// auth-set
-// school-menu-manage
-export const authSelect = () => {
-  return $post("/api/admin/auth/select", {});
-};
-export const offlineActivation = datas => {
-  return $post("/api/admin/auth/offline/activation", datas);
-};
-export const exportDeviceInfo = () => {
-  return $post(
-    "/api/admin/auth/export/device/info",
-    {},
-    {
-      responseType: "blob"
-    }
-  );
-};
+import { $postParam, $post } from "@/plugins/axios";
+
+// user-manage
+export const userListPage = datas => {
+  return $postParam("/api/admin/sys/user/list_customer", datas);
+};
+export const updateUser = datas => {
+  return $post("/api/admin/sys/user/save_customer", datas);
+};
+export const ableUser = ({ id, enable }) => {
+  return $post("/api/admin/sys/user/enable", { id, enable });
+};
+export const resetPwd = id => {
+  return $post("/api/admin/sys/user/reset_password", { id });
+};
+export const userRoleListPage = () => {
+  return $postParam("/api/admin/sys/role/list_to_user", {});
+};
+
+// menu-manage
+export const menuList = datas => {
+  return $postParam("/api/admin/sys/privilege/list", datas);
+};
+export const updateMenu = datas => {
+  return $post("/api/admin/sys/privilege/save", datas);
+};
+export const deleteMenu = id => {
+  return $post("/api/admin/sys/privilege/remove", { id });
+};

src/modules/admin/components/ModifyPrivilege.vue

@@ -1,159 +1,187 @@
-<template>
-  <el-dialog
-    class="modify-privilege"
-    :visible.sync="modalIsShow"
-    :title="title"
-    top="10vh"
-    width="600px"
-    :close-on-click-modal="false"
-    :close-on-press-escape="false"
-    append-to-body
-    @opened="visibleChange"
-  >
-    <div class="part-box part-box-pad part-box-border">
-      <el-form
-        ref="modalFormComp"
-        :model="modalForm"
-        :rules="rules"
-        label-width="100px"
-      >
-        <el-form-item prop="name" label="菜单名称：">
-          <el-input
-            v-model.trim="modalForm.name"
-            placeholder="请输入菜单名称"
-            clearable
-          ></el-input>
-        </el-form-item>
-        <el-form-item prop="url" label="URL地址：">
-          <el-input
-            v-model.trim="modalForm.url"
-            placeholder="请输入URL地址"
-            clearable
-          ></el-input>
-        </el-form-item>
-        <el-form-item label="上级菜单：">
-          <el-input v-model.trim="modalForm.parentName" disabled></el-input>
-        </el-form-item>
-        <el-form-item label="菜单类型：">
-          <el-select
-            v-model="modalForm.type"
-            style="width: 100px;"
-            placeholder="请选择"
-          >
-            <el-option
-              v-for="(val, key) in PRIVILEGE_TYPE"
-              :key="key"
-              :value="key"
-              :label="val"
-            ></el-option>
-          </el-select>
-        </el-form-item>
-        <el-form-item label="备注：">
-          <el-input v-model.trim="modalForm.remark"></el-input>
-        </el-form-item>
-      </el-form>
-    </div>
-    <div slot="footer">
-      <el-button type="primary" :disabled="isSubmit" @click="submit"
-        >确认</el-button
-      >
-      <el-button @click="cancel">取消</el-button>
-    </div>
-  </el-dialog>
-</template>
-
-<script>
-import { PRIVILEGE_TYPE } from "@/constants/enumerate";
-import { updateMenu } from "../api";
-
-const initModalForm = {
-  id: null,
-  name: "",
-  url: "",
-  parentId: null,
-  parentName: "",
-  sequence: 1,
-  type: "MENU",
-  remark: ""
-};
-
-export default {
-  name: "modify-privilege",
-  props: {
-    instance: {
-      type: Object,
-      default() {
-        return {};
-      }
-    }
-  },
-  computed: {
-    isEdit() {
-      return !!this.instance.id;
-    },
-    title() {
-      return (this.isEdit ? "编辑" : "新增") + "权限";
-    }
-  },
-  data() {
-    return {
-      modalIsShow: false,
-      isSubmit: false,
-      modalForm: {},
-      PRIVILEGE_TYPE,
-      rules: {
-        name: [
-          {
-            required: true,
-            max: 30,
-            message: "菜单名称不能超过30",
-            trigger: "change"
-          }
-        ],
-        url: [
-          {
-            required: true,
-            pattern: /^[0-9a-zA-Z/_-]{3,200}$/,
-            message:
-              "URL地址只能由字母、数字、斜线、短横线和下划线组成，长度在3-200之间",
-            trigger: "change"
-          }
-        ]
-      }
-    };
-  },
-  methods: {
-    initData(val) {
-      this.modalForm = this.$objAssign(initModalForm, val);
-    },
-    visibleChange() {
-      this.initData(this.instance);
-      this.$nextTick(() => {
-        this.$refs.modalFormComp.clearValidate();
-      });
-    },
-    cancel() {
-      this.modalIsShow = false;
-    },
-    open() {
-      this.modalIsShow = true;
-    },
-    async submit() {
-      const valid = await this.$refs.modalFormComp.validate().catch(() => {});
-      if (!valid) return;
-
-      if (this.isSubmit) return;
-      this.isSubmit = true;
-      const datas = { ...this.modalForm };
-      const data = await updateMenu(datas).catch(() => {});
-      this.isSubmit = false;
-      if (!data) return;
-
-      if (!this.isEdit) datas.id = data;
-
-      this.$emit("confirm", datas);
-      this.cancel();
-    }
-  }
-};
-</script>
+<template>
+  <el-dialog
+    class="modify-privilege"
+    :visible.sync="modalIsShow"
+    :title="title"
+    top="10vh"
+    width="600px"
+    :close-on-click-modal="false"
+    :close-on-press-escape="false"
+    append-to-body
+    @opened="visibleChange"
+  >
+    <div class="part-box part-box-pad part-box-border">
+      <el-form
+        ref="modalFormComp"
+        :model="modalForm"
+        :rules="rules"
+        label-width="100px"
+      >
+        <el-form-item prop="name" label="菜单名称：">
+          <el-input
+            style="width:100%;"
+            v-model.trim="modalForm.name"
+            placeholder="请输入菜单名称"
+            clearable
+          ></el-input>
+        </el-form-item>
+        <el-form-item prop="url" label="URL地址：">
+          <el-input
+            style="width:100%;"
+            v-model.trim="modalForm.url"
+            placeholder="请输入URL地址"
+            clearable
+          ></el-input>
+        </el-form-item>
+        <el-form-item label="上级菜单：">
+          <!-- <el-input
+            style="width:100%;"
+            v-model.trim="modalForm.parentName"
+            disabled
+          ></el-input> -->
+          <el-select
+            v-model="modalForm.parentId"
+            style="width: 100%;"
+            placeholder="请选择"
+            filterable
+          >
+            <el-option
+              v-for="menu in menuList"
+              :key="menu.id"
+              :value="menu.id"
+              :label="menu.name"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="菜单类型：">
+          <el-select
+            v-model="modalForm.type"
+            style="width: 100px;"
+            placeholder="请选择"
+          >
+            <el-option
+              v-for="(val, key) in PRIVILEGE_TYPE"
+              :key="key"
+              :value="key"
+              :label="val"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="备注：">
+          <el-input
+            style="width:100%;"
+            v-model.trim="modalForm.remark"
+          ></el-input>
+        </el-form-item>
+      </el-form>
+    </div>
+    <div slot="footer">
+      <el-button type="primary" :disabled="isSubmit" @click="submit"
+        >确认</el-button
+      >
+      <el-button type="danger" @click="cancel" plain>取消</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import { PRIVILEGE_TYPE } from "@/constants/enumerate";
+import { updateMenu } from "../api";
+
+const initModalForm = {
+  id: null,
+  name: "",
+  url: "",
+  parentId: null,
+  parentName: "",
+  sequence: 1,
+  type: "MENU",
+  remark: ""
+};
+
+export default {
+  name: "modify-privilege",
+  props: {
+    instance: {
+      type: Object,
+      default() {
+        return {};
+      }
+    },
+    menuList: {
+      type: Array,
+      default() {
+        return [];
+      }
+    }
+  },
+  computed: {
+    isEdit() {
+      return !!this.instance.id;
+    },
+    title() {
+      return (this.isEdit ? "编辑" : "新增") + "权限";
+    }
+  },
+  data() {
+    return {
+      modalIsShow: false,
+      isSubmit: false,
+      modalForm: {},
+      PRIVILEGE_TYPE,
+      rules: {
+        name: [
+          {
+            required: true,
+            max: 30,
+            message: "菜单名称不能超过30",
+            trigger: "change"
+          }
+        ],
+        url: [
+          {
+            required: true,
+            pattern: /^[0-9a-zA-Z/_-]{3,200}$/,
+            message:
+              "URL地址只能由字母、数字、斜线、短横线和下划线组成，长度在3-200之间",
+            trigger: "change"
+          }
+        ]
+      }
+    };
+  },
+  methods: {
+    initData(val) {
+      this.modalForm = this.$objAssign(initModalForm, val);
+    },
+    visibleChange() {
+      this.initData(this.instance);
+      this.$nextTick(() => {
+        this.$refs.modalFormComp.clearValidate();
+      });
+    },
+    cancel() {
+      this.modalIsShow = false;
+    },
+    open() {
+      this.modalIsShow = true;
+    },
+    async submit() {
+      const valid = await this.$refs.modalFormComp.validate().catch(() => {});
+      if (!valid) return;
+
+      if (this.isSubmit) return;
+      this.isSubmit = true;
+      const datas = { ...this.modalForm };
+      const data = await updateMenu(datas).catch(() => {});
+      this.isSubmit = false;
+      if (!data) return;
+
+      if (!this.isEdit) datas.id = data;
+
+      this.$emit("confirm", datas);
+      this.cancel();
+    }
+  }
+};
+</script>

src/modules/admin/components/ModifySystemRole.vue

@@ -1,147 +1,213 @@
-<template>
-  <el-dialog
-    class="modify-system-role"
-    :visible.sync="modalIsShow"
-    :title="title"
-    :close-on-click-modal="false"
-    :close-on-press-escape="false"
-    append-to-body
-    fullscreen
-    @opened="visibleChange"
-  >
-    <el-form
-      ref="modalFormComp"
-      :model="modalForm"
-      :rules="rules"
-      label-position="top"
-    >
-      <el-form-item prop="name" label="角色名称：">
-        <el-input
-          v-model.trim="modalForm.name"
-          style="width:282px;"
-          placeholder="请输入角色名称"
-          clearable
-        ></el-input>
-      </el-form-item>
-      <el-form-item label="角色权限：" required></el-form-item>
-    </el-form>
-    <privilege-set
-      v-if="menus && menus.length"
-      ref="PrivilegeSet"
-      :menus="menus"
-    ></privilege-set>
-    <div slot="footer">
-      <el-button type="primary" :disabled="isSubmit" @click="submit"
-        >确认</el-button
-      >
-      <el-button @click="cancel">取消</el-button>
-    </div>
-  </el-dialog>
-</template>
-
-<script>
-import { updateRole, privilegeList, roleBoundPrivileges } from "../../base/api";
-import PrivilegeSet from "../../base/components/PrivilegeSet";
-
-const initModalForm = {
-  id: null,
-  name: "",
-  privilegeIds: []
-};
-
-export default {
-  name: "modify-system-role",
-  components: { PrivilegeSet },
-  props: {
-    instance: {
-      type: Object,
-      default() {
-        return {};
-      }
-    }
-  },
-  computed: {
-    isEdit() {
-      return !!this.instance.id;
-    },
-    title() {
-      return (this.isEdit ? "编辑" : "新增") + "角色";
-    }
-  },
-  data() {
-    return {
-      modalIsShow: false,
-      isSubmit: false,
-      menus: [],
-      modalForm: {},
-      rules: {
-        name: [
-          {
-            required: true,
-            pattern: /^[0-9a-zA-Z\u4E00-\u9FA5]{1,20}$/,
-            message: "角色名称只能输入汉字、字母和数字，长度不能超过20",
-            trigger: "change"
-          }
-        ]
-      }
-    };
-  },
-  created() {
-    this.getMenus();
-  },
-  methods: {
-    async getMenus() {
-      const data = await privilegeList();
-      if (data) {
-        this.menus = data.map(item => {
-          item.parentId = null;
-          return item;
-        });
-      }
-    },
-    async visibleChange() {
-      let privilegeIds = [];
-      if (this.instance.id) {
-        this.modalForm = this.$objAssign(initModalForm, this.instance);
-        privilegeIds = await roleBoundPrivileges(this.instance.id);
-        privilegeIds = privilegeIds || [];
-        this.modalForm.privilegeIds = privilegeIds;
-      } else {
-        this.modalForm = { ...initModalForm };
-      }
-      this.$nextTick(() => {
-        this.$refs.modalFormComp.clearValidate();
-        this.$refs.PrivilegeSet &&
-          this.$refs.PrivilegeSet.buildTableData(privilegeIds);
-      });
-    },
-    cancel() {
-      this.modalIsShow = false;
-    },
-    open() {
-      this.modalIsShow = true;
-    },
-    async submit() {
-      const valid = await this.$refs.modalFormComp.validate().catch(() => {});
-      if (!valid) return;
-
-      const privilegeIds = this.$refs.PrivilegeSet.getSelectedPrivilegeIds();
-      if (!privilegeIds.length) {
-        this.$emit("请设置角色权限！");
-        return;
-      }
-
-      if (this.isSubmit) return;
-      this.isSubmit = true;
-      const datas = { ...this.modalForm };
-      datas.privilegeIds = privilegeIds;
-      const data = await updateRole(datas).catch(() => {});
-      this.isSubmit = false;
-      if (!data) return;
-
-      this.$emit("modified", this.modalForm);
-      this.cancel();
-    }
-  }
-};
-</script>
+<template>
+  <el-dialog
+    class="modify-role"
+    :visible.sync="modalIsShow"
+    :title="title"
+    top="10px"
+    width="700px"
+    :close-on-click-modal="false"
+    :close-on-press-escape="false"
+    append-to-body
+    @opened="visibleChange"
+  >
+    <div class="part-box part-box-pad part-box-border">
+      <el-form
+        ref="modalFormComp"
+        :model="modalForm"
+        :rules="rules"
+        label-width="100px"
+      >
+        <el-form-item prop="name" label="角色名称：">
+          <el-input
+            style="width:100%;"
+            v-model.trim="modalForm.name"
+            placeholder="请输入角色名称"
+            clearable
+          ></el-input>
+        </el-form-item>
+        <el-form-item prop="privilegeIds" label="角色权限：">
+          <div class="part-box part-box-pad part-box-border">
+            <el-tree
+              :data="menus"
+              show-checkbox
+              node-key="id"
+              ref="MenuTree"
+              highlight-current
+              check-on-click-node
+              :expand-on-click-node="false"
+              :default-expanded-keys="defaultExpandedKeys"
+              :props="defaultProps"
+              @check-change="checkChange"
+            >
+              <span class="custom-tree-node" slot-scope="{ node, data }">
+                <span
+                  ><i class="el-icon-link" v-if="data.type === 'URL'"></i>
+                  {{ node.label }}</span
+                >
+              </span>
+            </el-tree>
+          </div>
+        </el-form-item>
+      </el-form>
+    </div>
+    <div slot="footer">
+      <el-button type="primary" :disabled="isSubmit" @click="submit"
+        >确认</el-button
+      >
+      <el-button type="danger" @click="cancel" plain>取消</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import { updateRole, menuAuthList, roleBoundPrivileges } from "../../base/api";
+
+const initModalForm = {
+  id: null,
+  name: "",
+  type: "CUSTOM",
+  privilegeIds: []
+};
+
+export default {
+  name: "modify-role",
+  props: {
+    instance: {
+      type: Object,
+      default() {
+        return {};
+      }
+    }
+  },
+  computed: {
+    isEdit() {
+      return !!this.instance.id;
+    },
+    title() {
+      return (this.isEdit ? "编辑" : "新增") + "角色";
+    }
+  },
+  data() {
+    return {
+      modalIsShow: false,
+      isSubmit: false,
+      menus: [],
+      defaultExpandedKeys: [],
+      modalForm: {},
+      defaultProps: {
+        label: "name"
+      },
+      rules: {
+        name: [
+          {
+            required: true,
+            pattern: /^[0-9a-zA-Z\u4E00-\u9FA5]{1,10}$/,
+            message: "角色名称只能输入汉字、字母和数字，长度不能超过10",
+            trigger: "change"
+          }
+        ],
+        type: [
+          {
+            required: true,
+            message: "请选择角色类型",
+            trigger: "change"
+          }
+        ],
+        privilegeIds: [
+          {
+            required: true,
+            validator: (rule, value, callback) => {
+              if (this.modalForm.type !== "CUSTOM" || value.length) {
+                callback();
+              } else {
+                callback(new Error("请选择扩展字段"));
+              }
+            },
+            trigger: "change"
+          }
+        ]
+      }
+    };
+  },
+  created() {
+    this.getMenus();
+  },
+  methods: {
+    async getMenus() {
+      const data = await menuAuthList();
+      if (data) this.menus = data.filter(item => item.url !== "common");
+      this.defaultExpandedKeys = [];
+      this.getDefaultExpandedKeys(this.menus);
+    },
+    async visibleChange() {
+      console.log(this.instance);
+      if (this.instance.id) {
+        this.modalForm = this.$objAssign(initModalForm, this.instance);
+        let privilegeIds = await roleBoundPrivileges(this.instance.id);
+        privilegeIds = privilegeIds || [];
+        let checkedIds = [];
+        const getCheckedIds = list => {
+          list.forEach(item => {
+            if (item["children"] && item["children"].length) {
+              getCheckedIds(item.children);
+            } else {
+              const isChecked = privilegeIds.includes(item.id);
+              if (isChecked) checkedIds.push(item.id);
+            }
+          });
+        };
+        getCheckedIds(this.menus);
+        this.$refs.MenuTree.setCheckedKeys(checkedIds);
+        this.modalForm.privilegeIds = checkedIds;
+      } else {
+        this.modalForm = { ...initModalForm };
+        this.$refs.MenuTree.setCheckedKeys([]);
+      }
+      this.$nextTick(() => {
+        this.$refs.modalFormComp.clearValidate();
+      });
+    },
+    cancel() {
+      this.modalIsShow = false;
+    },
+    open() {
+      this.modalIsShow = true;
+    },
+    getDefaultExpandedKeys(menus) {
+      menus.forEach(item => {
+        if (
+          item.children &&
+          item.children.length &&
+          !item.children.some(elem => elem.type === "URL")
+        ) {
+          this.defaultExpandedKeys.push(item.id);
+          this.getDefaultExpandedKeys(item.children);
+        }
+      });
+    },
+    checkChange(data, checked) {
+      this.modalForm.privilegeIds = this.$refs.MenuTree.getCheckedKeys();
+      this.$refs.modalFormComp.validateField("privilegeIds");
+    },
+    async submit() {
+      const valid = await this.$refs.modalFormComp.validate().catch(() => {});
+      if (!valid) return;
+
+      if (this.isSubmit) return;
+      this.isSubmit = true;
+      const datas = { ...this.modalForm };
+      const privilegeIds = [
+        ...this.$refs.MenuTree.getCheckedKeys(),
+        ...this.$refs.MenuTree.getHalfCheckedKeys()
+      ];
+      datas.privilegeIds = privilegeIds;
+      const data = await updateRole(datas).catch(() => {});
+      this.isSubmit = false;
+      if (!data) return;
+
+      this.$emit("modified", this.modalForm);
+      this.cancel();
+    }
+  }
+};
+</script>

src/modules/admin/components/ModifyUser.vue

@@ -1,212 +1,191 @@
-<template>
-  <el-dialog
-    class="modify-user"
-    :visible.sync="modalIsShow"
-    :title="title"
-    top="10vh"
-    width="448px"
-    :close-on-click-modal="false"
-    :close-on-press-escape="false"
-    append-to-body
-    @open="visibleChange"
-  >
-    <el-form
-      ref="modalFormComp"
-      :model="modalForm"
-      :rules="rules"
-      label-position="top"
-    >
-      <el-form-item prop="loginName" label="用户名：">
-        <el-input
-          v-model.trim="modalForm.loginName"
-          placeholder="请输入用户名"
-          :disabled="isEdit"
-        ></el-input>
-      </el-form-item>
-      <el-form-item prop="realName" label="姓名：">
-        <el-input
-          v-model.trim="modalForm.realName"
-          placeholder="请输入姓名"
-          clearable
-        ></el-input>
-      </el-form-item>
-      <el-form-item prop="mobileNumber" label="手机号：">
-        <el-input
-          v-model.trim="modalForm.mobileNumber"
-          placeholder="请输入手机号"
-          clearable
-        ></el-input>
-      </el-form-item>
-      <el-form-item prop="code" label="工号：">
-        <el-input
-          v-model.trim="modalForm.code"
-          placeholder="请输入工号"
-          clearable
-        ></el-input>
-      </el-form-item>
-      <el-form-item prop="roleIds" label="角色：">
-        <el-select
-          style="width:100%;"
-          v-model="modalForm.roleIds"
-          placeholder="请选择角色"
-          multiple
-        >
-          <el-option
-            v-for="item in roles"
-            :key="item.id"
-            :value="item.id"
-            :label="item.name"
-          >
-          </el-option>
-        </el-select>
-      </el-form-item>
-    </el-form>
-    <div slot="footer">
-      <el-button type="primary" :disabled="isSubmit" @click="submit"
-        >确认</el-button
-      >
-      <el-button @click="cancel">取消</el-button>
-    </div>
-  </el-dialog>
-</template>
-
-<script>
-import { updateUser } from "../api";
-import { phone } from "@/plugins/formRules";
-
-const initModalForm = {
-  id: "",
-  loginName: "",
-  realName: "",
-  code: "",
-  mobileNumber: "",
-  roleIds: []
-};
-
-export default {
-  name: "modify-user",
-  props: {
-    instance: {
-      type: Object,
-      default() {
-        return {};
-      }
-    },
-    roles: {
-      type: Array,
-      default() {
-        return [];
-      }
-    }
-  },
-  computed: {
-    isEdit() {
-      return !!this.instance.id;
-    },
-    title() {
-      return (this.isEdit ? "编辑" : "新增") + "用户";
-    }
-  },
-  data() {
-    const roleIdsValidator = (rule, value, callback) => {
-      if (!value || !value.length) {
-        callback(new Error("请选择角色"));
-      } else {
-        callback();
-      }
-    };
-    return {
-      modalIsShow: false,
-      isSubmit: false,
-      modalForm: {},
-      rules: {
-        mobileNumber: phone,
-        loginName: [
-          {
-            required: true,
-            message: "请输入用户名",
-            trigger: "change"
-          },
-          {
-            max: 50,
-            message: "用户名不能超过50",
-            trigger: "change"
-          }
-        ],
-        realName: [
-          {
-            required: true,
-            message: "请输入姓名",
-            trigger: "change"
-          },
-          {
-            max: 50,
-            message: "姓名不能超过50",
-            trigger: "change"
-          }
-        ],
-        code: [
-          {
-            required: true,
-            message: "请输入工号",
-            trigger: "change"
-          },
-          {
-            max: 50,
-            message: "工号不能超过50",
-            trigger: "change"
-          }
-        ],
-        roleIds: [
-          {
-            required: true,
-            validator: roleIdsValidator,
-            trigger: "change"
-          }
-        ]
-      },
-      user: {},
-      courses: [],
-      roleTypes: []
-    };
-  },
-  methods: {
-    initData(val) {
-      if (val.id) {
-        this.modalForm = this.$objAssign(initModalForm, val);
-        this.modalForm.roleIds = val.roles.map(item => item.id);
-      } else {
-        this.modalForm = { ...initModalForm };
-        this.$nextTick(() => {
-          this.$refs.modalFormComp.clearValidate();
-        });
-      }
-    },
-    visibleChange() {
-      this.initData(this.instance);
-    },
-    cancel() {
-      this.modalIsShow = false;
-    },
-    open() {
-      this.modalIsShow = true;
-    },
-    async submit() {
-      const valid = await this.$refs.modalFormComp.validate().catch(() => {});
-      if (!valid) return;
-
-      if (this.isSubmit) return;
-      this.isSubmit = true;
-
-      const datas = { ...this.modalForm };
-      const data = await updateUser(datas).catch(() => {});
-      this.isSubmit = false;
-      if (!data) return;
-
-      this.$message.success("修改成功！");
-      this.$emit("modified");
-      this.cancel();
-    }
-  }
-};
-</script>
+<template>
+  <el-dialog
+    class="modify-user"
+    :visible.sync="modalIsShow"
+    :title="title"
+    top="10vh"
+    width="600px"
+    :close-on-click-modal="false"
+    :close-on-press-escape="false"
+    append-to-body
+    @open="visibleChange"
+  >
+    <div class="part-box part-box-pad part-box-border">
+      <el-form
+        ref="modalFormComp"
+        :model="modalForm"
+        :rules="rules"
+        label-width="100px"
+      >
+        <el-form-item prop="loginName" label="用户名：">
+          <el-input
+            style="width:100%;"
+            v-model.trim="modalForm.loginName"
+            placeholder="请输入用户名"
+            :disabled="isEdit"
+          ></el-input>
+        </el-form-item>
+        <el-form-item prop="realName" label="姓名：">
+          <el-input
+            style="width:100%;"
+            v-model.trim="modalForm.realName"
+            placeholder="请输入姓名"
+            clearable
+          ></el-input>
+        </el-form-item>
+        <el-form-item prop="mobileNumber" label="手机号：">
+          <el-input
+            style="width:100%;"
+            v-model.trim="modalForm.mobileNumber"
+            placeholder="请输入手机号"
+            clearable
+          ></el-input>
+        </el-form-item>
+        <el-form-item prop="roleIds" label="角色：">
+          <el-select
+            style="width:100%;"
+            v-model="modalForm.roleIds"
+            placeholder="请选择角色"
+            disabled
+            multiple
+          >
+            <el-option
+              v-for="item in roles"
+              :key="item.id"
+              :value="item.id"
+              :label="item.name"
+            >
+            </el-option>
+          </el-select>
+        </el-form-item>
+      </el-form>
+    </div>
+    <div slot="footer">
+      <el-button type="primary" :disabled="isSubmit" @click="submit"
+        >确认</el-button
+      >
+      <el-button type="danger" @click="cancel" plain>取消</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import { updateUser } from "../api";
+import { phone } from "@/plugins/formRules";
+
+const initModalForm = {
+  id: "",
+  loginName: "",
+  realName: "",
+  mobileNumber: "",
+  roleIds: []
+};
+
+export default {
+  name: "modify-user",
+  props: {
+    instance: {
+      type: Object,
+      default() {
+        return {};
+      }
+    },
+    roles: {
+      type: Array,
+      default() {
+        return [];
+      }
+    }
+  },
+  computed: {
+    isEdit() {
+      return !!this.instance.id;
+    },
+    title() {
+      return (this.isEdit ? "编辑" : "新增") + "用户";
+    }
+  },
+  data() {
+    const roleIdsValidator = (rule, value, callback) => {
+      if (!value || !value.length) {
+        callback(new Error("请选择角色"));
+      } else {
+        callback();
+      }
+    };
+    return {
+      modalIsShow: false,
+      isSubmit: false,
+      modalForm: {},
+      rules: {
+        mobileNumber: phone,
+        loginName: [
+          {
+            required: true,
+            message: "请输入用户名",
+            trigger: "change"
+          },
+          {
+            max: 50,
+            message: "用户名不能超过50",
+            trigger: "change"
+          }
+        ],
+        realName: [
+          {
+            required: true,
+            message: "请输入姓名",
+            trigger: "change"
+          },
+          {
+            max: 50,
+            message: "姓名不能超过50",
+            trigger: "change"
+          }
+        ],
+        roleIds: [
+          {
+            required: true,
+            validator: roleIdsValidator,
+            trigger: "change"
+          }
+        ]
+      },
+      user: {},
+      courses: [],
+      roleTypes: []
+    };
+  },
+  methods: {
+    initData(val) {
+      this.modalForm = this.$objAssign(initModalForm, val);
+      this.modalForm.roleIds = val.roles.map(item => item.id);
+    },
+    visibleChange() {
+      this.initData(this.instance);
+    },
+    cancel() {
+      this.modalIsShow = false;
+    },
+    open() {
+      this.modalIsShow = true;
+    },
+    async submit() {
+      const valid = await this.$refs.modalFormComp.validate().catch(() => {});
+      if (!valid) return;
+
+      if (this.isSubmit) return;
+      this.isSubmit = true;
+
+      const datas = { ...this.modalForm };
+      const data = await updateUser(datas).catch(() => {});
+      this.isSubmit = false;
+      if (!data) return;
+
+      this.$message.success("修改成功！");
+      this.$emit("modified");
+      this.cancel();
+    }
+  }
+};
+</script>

src/modules/admin/router.js

@@ -1,39 +1,27 @@
-import AdminUserManage from "./views/AdminUserManage.vue";
-import PrivilegeManage from "./views/PrivilegeManage.vue";
-import SystemRoleManage from "./views/SystemRoleManage.vue";
-import SchoolMenuManage from "./views/SchoolMenuManage.vue";
-import AuthSet from "./views/AuthSet.vue";
-import Admin from "./views/Admin.vue";
-
-export default {
-  path: "/admin",
-  name: "Admin",
-  component: Admin,
-  children: [
-    {
-      path: "admin-user-manage",
-      name: "AdminUserManage",
-      component: AdminUserManage
-    },
-    {
-      path: "privilege-manage",
-      name: "PrivilegeManage",
-      component: PrivilegeManage
-    },
-    {
-      path: "system-role-manage",
-      name: "SystemRoleManage",
-      component: SystemRoleManage
-    },
-    {
-      path: "school-menu-manage",
-      name: "SchoolMenuManage",
-      component: SchoolMenuManage
-    },
-    {
-      path: "auth-set",
-      name: "AuthSet",
-      component: AuthSet
-    }
-  ]
-};
+import AdminUserManage from "./views/AdminUserManage.vue";
+import PrivilegeManage from "./views/PrivilegeManage.vue";
+import SystemRoleManage from "./views/SystemRoleManage.vue";
+import Admin from "./views/Admin.vue";
+
+export default {
+  path: "/admin",
+  name: "Admin",
+  component: Admin,
+  children: [
+    {
+      path: "admin-user-manage",
+      name: "AdminUserManage",
+      component: AdminUserManage
+    },
+    {
+      path: "privilege-manage",
+      name: "PrivilegeManage",
+      component: PrivilegeManage
+    },
+    {
+      path: "system-role-manage",
+      name: "SystemRoleManage",
+      component: SystemRoleManage
+    }
+  ]
+};

src/modules/admin/views/Admin.vue

@@ -1,222 +1,222 @@
-<template>
-  <div class="admin">
-    <div class="home-header">
-      <div class="head-user menu-list">
-        <ul>
-          <li @click="toSelectSchool">
-            <i class="el-icon-s-home"></i>
-            <span>切换学校</span>
-          </li>
-          <li class="menu-item menu-item-account" @click="toResetPwd">
-            <i class="icon icon-account"></i>
-            <span :title="username">{{ username }}</span>
-          </li>
-          <li class="menu-item" @click="toLogout">
-            <i class="icon icon-logout" title="退出登录"></i>
-          </li>
-        </ul>
-      </div>
-    </div>
-
-    <div class="home-navs">
-      <div class="head-logo">
-        <div class="head-logo-content">
-          <h1>知学知考</h1>
-        </div>
-      </div>
-      <el-menu
-        class="el-menu-home"
-        active-text-color="#705eff"
-        text-color="#383b4a"
-        router
-        :default-active="curRouteName"
-        :default-openeds="curSubMenuNames"
-      >
-        <el-submenu
-          v-for="submenu in menus"
-          :key="submenu.url"
-          :index="submenu.url"
-        >
-          <template slot="title">
-            <span>{{ submenu.name }}</span>
-          </template>
-
-          <el-menu-item
-            v-for="nav in submenu.children"
-            :key="nav.url"
-            :index="nav.url"
-            :route="{ name: nav.url }"
-          >
-            <span>{{ nav.name }}</span>
-          </el-menu-item>
-        </el-submenu>
-      </el-menu>
-    </div>
-
-    <div class="home-body">
-      <div class="home-main">
-        <div class="home-breadcrumb" v-if="breadcrumbs.length">
-          <span class="breadcrumb-tips">
-            <i class="icon icon-location"></i>
-            <span>当前所在位置：</span>
-          </span>
-          <el-breadcrumb separator="/">
-            <el-breadcrumb-item
-              v-for="(bread, index) in breadcrumbs"
-              :key="index"
-              >{{ bread.name }}</el-breadcrumb-item
-            >
-          </el-breadcrumb>
-        </div>
-
-        <!-- home-view: page detail -->
-        <div class="home-view">
-          <router-view />
-        </div>
-      </div>
-    </div>
-
-    <!-- 修改密码 -->
-    <reset-pwd
-      ref="ResetPwd"
-      :user-info="userInfo"
-      @modified="resetPwdModified"
-    ></reset-pwd>
-  </div>
-</template>
-
-<script>
-import localNavs from "@/constants/adminNavs";
-import { SYS_ADMIN_NAME } from "@/constants/enumerate";
-import { logout } from "@/modules/login/api";
-import ResetPwd from "../../base/components/ResetPwd";
-
-export default {
-  name: "home",
-  components: { ResetPwd },
-  data() {
-    const user = this.$ls.get("user", { id: "", realName: "", roleList: [] });
-
-    return {
-      menus: [],
-      privileges: [],
-      curRouteName: "",
-      curSubMenuNames: [],
-      breadcrumbs: [],
-      username: user.realName,
-      userInfo: {
-        pwdCount: 0,
-        mobileNumber: 1,
-        userId: user.id
-      }
-    };
-  },
-  watch: {
-    $route(val) {
-      if (val.name === "Admin") return;
-      this.actCurNav();
-    }
-  },
-  created() {
-    const loginName = this.$ls.get("user", { loginName: "" }).loginName;
-    if (loginName !== SYS_ADMIN_NAME) {
-      this.$message.error("非法操作!");
-      this.$router.replace({ name: "Login" });
-      return;
-    }
-
-    if (this.$route.name === "Admin") {
-      this.$router.replace({
-        name: "AdminUserManage"
-      });
-    }
-    this.initData();
-  },
-  methods: {
-    initData() {
-      this.privileges = localNavs;
-      this.menus = this.getMenu();
-      this.curSubMenuNames = this.menus.map(item => item.url);
-
-      if (this.$route.name === "Admin") {
-        const firstRouteName = this.getFirstRouter();
-        this.$router.replace({
-          name: firstRouteName
-        });
-        return;
-      }
-
-      this.actCurNav();
-    },
-    getFirstRouter() {
-      let childNavs = this.privileges;
-      let firstRouteName = "";
-      while (childNavs.length) {
-        firstRouteName = childNavs[0].url;
-        childNavs = this.privileges.filter(
-          item => item.parentId === childNavs[0].id
-        );
-      }
-
-      return firstRouteName;
-    },
-    getMenu() {
-      let menus = this.privileges.filter(item => item.parentId === "-1");
-      const toTree = menus => {
-        menus.forEach(menu => {
-          const children = this.privileges.filter(
-            item => item.parentId === menu.id
-          );
-          if (children.length) {
-            menu.children = children;
-            toTree(menu.children);
-          }
-        });
-      };
-      toTree(menus);
-
-      return menus;
-    },
-    actCurNav() {
-      this.curRouteName = this.$route.name;
-      let breadcrumbs = [];
-      let curBreadcrumb = this.privileges.find(
-        item => item.url === this.curRouteName
-      );
-      breadcrumbs.push({ ...curBreadcrumb });
-
-      while (curBreadcrumb && curBreadcrumb.parentId !== "-1") {
-        curBreadcrumb = this.privileges.find(
-          item => item.id === curBreadcrumb.parentId
-        );
-        if (curBreadcrumb) breadcrumbs.unshift({ ...curBreadcrumb });
-      }
-
-      this.breadcrumbs = breadcrumbs;
-    },
-    toLogout() {
-      this.$confirm("确定要退出登录吗？", "提示", {
-        type: "warning"
-      })
-        .then(() => {
-          this.logoutAction();
-        })
-        .catch(() => {});
-    },
-    async logoutAction() {
-      await logout();
-      this.$ls.clear();
-      this.$router.push({ name: "Login" });
-    },
-    toSelectSchool() {
-      this.$router.push({ name: "SelectSchool" });
-    },
-    toResetPwd() {
-      this.$refs.ResetPwd.open();
-    },
-    resetPwdModified() {
-      this.logoutAction();
-    }
-  }
-};
-</script>
+<template>
+  <div class="admin">
+    <div class="home-header">
+      <div class="head-user menu-list">
+        <ul>
+          <li @click="toSelectSchool">
+            <i class="el-icon-s-home"></i>
+            <span>切换学校</span>
+          </li>
+          <li class="menu-item menu-item-account" @click="toResetPwd">
+            <i class="icon icon-account"></i>
+            <span :title="username">{{ username }}</span>
+          </li>
+          <li class="menu-item" @click="toLogout">
+            <i class="icon icon-logout" title="退出登录"></i>
+          </li>
+        </ul>
+      </div>
+    </div>
+
+    <div class="home-navs">
+      <div class="head-logo">
+        <div class="head-logo-content">
+          <h1>知学知考</h1>
+        </div>
+      </div>
+      <el-menu
+        class="el-menu-home"
+        active-text-color="#705eff"
+        text-color="#383b4a"
+        router
+        :default-active="curRouteName"
+        :default-openeds="curSubMenuNames"
+      >
+        <el-submenu
+          v-for="submenu in menus"
+          :key="submenu.url"
+          :index="submenu.url"
+        >
+          <template slot="title">
+            <span>{{ submenu.name }}</span>
+          </template>
+
+          <el-menu-item
+            v-for="nav in submenu.children"
+            :key="nav.url"
+            :index="nav.url"
+            :route="{ name: nav.url }"
+          >
+            <span>{{ nav.name }}</span>
+          </el-menu-item>
+        </el-submenu>
+      </el-menu>
+    </div>
+
+    <div class="home-body">
+      <div class="home-main">
+        <div class="home-breadcrumb" v-if="breadcrumbs.length">
+          <span class="breadcrumb-tips">
+            <i class="icon icon-location"></i>
+            <span>当前所在位置：</span>
+          </span>
+          <el-breadcrumb separator="/">
+            <el-breadcrumb-item
+              v-for="(bread, index) in breadcrumbs"
+              :key="index"
+              >{{ bread.name }}</el-breadcrumb-item
+            >
+          </el-breadcrumb>
+        </div>
+
+        <!-- home-view: page detail -->
+        <div class="home-view">
+          <router-view />
+        </div>
+      </div>
+    </div>
+
+    <!-- 修改密码 -->
+    <reset-pwd
+      ref="ResetPwd"
+      :user-info="userInfo"
+      @modified="resetPwdModified"
+    ></reset-pwd>
+  </div>
+</template>
+
+<script>
+import localNavs from "@/constants/adminNavs";
+import { SYS_ADMIN_NAME } from "@/constants/enumerate";
+import { logout } from "@/modules/login/api";
+import ResetPwd from "../../base/components/ResetPwd";
+
+export default {
+  name: "home",
+  components: { ResetPwd },
+  data() {
+    const user = this.$ls.get("user", { id: "", realName: "", roleList: [] });
+
+    return {
+      menus: [],
+      privileges: [],
+      curRouteName: "",
+      curSubMenuNames: [],
+      breadcrumbs: [],
+      username: user.realName,
+      userInfo: {
+        pwdCount: 0,
+        mobileNumber: 1,
+        userId: user.id
+      }
+    };
+  },
+  watch: {
+    $route(val) {
+      if (val.name === "Admin") return;
+      this.actCurNav();
+    }
+  },
+  created() {
+    const loginName = this.$ls.get("user", { loginName: "" }).loginName;
+    if (loginName !== SYS_ADMIN_NAME) {
+      this.$message.error("非法操作!");
+      this.$router.replace({ name: "Login" });
+      return;
+    }
+
+    if (this.$route.name === "Admin") {
+      this.$router.replace({
+        name: "AdminUserManage"
+      });
+    }
+    this.initData();
+  },
+  methods: {
+    initData() {
+      this.privileges = localNavs;
+      this.menus = this.getMenu();
+      this.curSubMenuNames = this.menus.map(item => item.url);
+
+      if (this.$route.name === "Admin") {
+        const firstRouteName = this.getFirstRouter();
+        this.$router.replace({
+          name: firstRouteName
+        });
+        return;
+      }
+
+      this.actCurNav();
+    },
+    getFirstRouter() {
+      let childNavs = this.privileges;
+      let firstRouteName = "";
+      while (childNavs.length) {
+        firstRouteName = childNavs[0].url;
+        childNavs = this.privileges.filter(
+          item => item.parentId === childNavs[0].id
+        );
+      }
+
+      return firstRouteName;
+    },
+    getMenu() {
+      let menus = this.privileges.filter(item => item.parentId === "-1");
+      const toTree = menus => {
+        menus.forEach(menu => {
+          const children = this.privileges.filter(
+            item => item.parentId === menu.id
+          );
+          if (children.length) {
+            menu.children = children;
+            toTree(menu.children);
+          }
+        });
+      };
+      toTree(menus);
+
+      return menus;
+    },
+    actCurNav() {
+      this.curRouteName = this.$route.name;
+      let breadcrumbs = [];
+      let curBreadcrumb = this.privileges.find(
+        item => item.url === this.curRouteName
+      );
+      breadcrumbs.push({ ...curBreadcrumb });
+
+      while (curBreadcrumb && curBreadcrumb.parentId !== "-1") {
+        curBreadcrumb = this.privileges.find(
+          item => item.id === curBreadcrumb.parentId
+        );
+        if (curBreadcrumb) breadcrumbs.unshift({ ...curBreadcrumb });
+      }
+
+      this.breadcrumbs = breadcrumbs;
+    },
+    toLogout() {
+      this.$confirm("确定要退出登录吗？", "提示", {
+        type: "warning"
+      })
+        .then(() => {
+          this.logoutAction();
+        })
+        .catch(() => {});
+    },
+    async logoutAction() {
+      await logout();
+      this.$ls.clear();
+      this.$router.push({ name: "Login" });
+    },
+    toSelectSchool() {
+      this.$router.push({ name: "SelectSchool" });
+    },
+    toResetPwd() {
+      this.$refs.ResetPwd.open();
+    },
+    resetPwdModified() {
+      this.logoutAction();
+    }
+  }
+};
+</script>

src/modules/admin/views/AdminUserManage.vue

@@ -1,204 +1,224 @@
-<template>
-  <div class="user-manage">
-    <div class="part-box part-box-filter part-box-flex">
-      <el-form ref="FilterForm" label-position="left" label-width="85px" inline>
-        <el-form-item label="姓名：" label-width="75px">
-          <el-input
-            style="width: 142px;"
-            v-model.trim="filter.realName"
-            placeholder="姓名"
-            clearable
-          ></el-input>
-        </el-form-item>
-        <el-form-item label="启用/禁用：" label-width="90px">
-          <el-select
-            v-model="filter.enable"
-            style="width: 120px;"
-            placeholder="启用/禁用"
-            clearable
-          >
-            <el-option
-              v-for="(val, key) in ABLE_TYPE"
-              :key="key"
-              :value="key * 1"
-              :label="val"
-            ></el-option>
-          </el-select>
-        </el-form-item>
-
-        <el-form-item label-width="0px">
-          <el-button type="primary" @click="toPage(1)">查询</el-button>
-        </el-form-item>
-      </el-form>
-      <div class="part-box-action">
-        <el-button
-          type="primary"
-          icon="el-icon-circle-plus-outline"
-          @click="toAdd"
-          >新增用户</el-button
-        >
-      </div>
-    </div>
-
-    <div class="part-box part-box-pad">
-      <el-table ref="TableList" :data="users">
-        <el-table-column
-          type="index"
-          label="序号"
-          width="70"
-          :index="indexMethod"
-        ></el-table-column>
-        <el-table-column prop="loginName" label="用户名"></el-table-column>
-        <el-table-column prop="realName" label="姓名"></el-table-column>
-        <el-table-column prop="roles" label="角色">
-          <template slot-scope="scope">
-            {{ scope.row.roles | rolesFilter }}
-          </template>
-        </el-table-column>
-        <el-table-column prop="mobileNumber" label="手机号"></el-table-column>
-        <el-table-column prop="enable" label="状态" width="100">
-          <template slot-scope="scope">
-            {{ scope.row.enable | enableFilter }}
-          </template>
-        </el-table-column>
-        <el-table-column class-name="action-column" label="操作" width="200px">
-          <template slot-scope="scope">
-            <el-button
-              class="btn-primary"
-              type="text"
-              @click="toEdit(scope.row)"
-              >编辑</el-button
-            >
-            <el-button
-              :class="scope.row.enable ? 'btn-danger' : 'btn-primary'"
-              type="text"
-              @click="toEnable(scope.row)"
-              >{{ scope.row.enable ? "禁用" : "启用" }}</el-button
-            >
-            <el-button
-              class="btn-danger"
-              type="text"
-              @click="toResetPwd(scope.row)"
-              >重置密码</el-button
-            >
-          </template>
-        </el-table-column>
-      </el-table>
-      <div class="part-page">
-        <el-pagination
-          background
-          layout="total,prev, pager, next"
-          :current-page="current"
-          :total="total"
-          :page-size="size"
-          @current-change="toPage"
-        >
-        </el-pagination>
-      </div>
-    </div>
-
-    <!-- ModifyUser -->
-    <modify-user
-      ref="ModifyUser"
-      :instance="curUser"
-      :roles="roles"
-      @modified="getList"
-    ></modify-user>
-  </div>
-</template>
-
-<script>
-import ModifyUser from "../components/ModifyUser";
-import { ABLE_TYPE } from "@/constants/enumerate";
-import { userListPage, ableUser, resetPwd, userRoleListPage } from "../api";
-
-export default {
-  name: "user-manage",
-  components: { ModifyUser },
-  data() {
-    return {
-      filter: {
-        realName: "",
-        enable: ""
-      },
-      current: 1,
-      size: this.GLOBAL.pageSize,
-      total: 0,
-      visible: false,
-      ABLE_TYPE,
-      roles: [],
-      users: [],
-      curUser: {}
-    };
-  },
-  created() {
-    this.getRoleList();
-    this.getList();
-  },
-  methods: {
-    async getRoleList() {
-      const data = await userRoleListPage();
-      this.roles = data || [];
-      this.roles = this.roles
-        .filter(item => item.type !== "ADMIN")
-        .map(item => {
-          return {
-            id: item.id,
-            name: item.name
-          };
-        });
-    },
-    async getList() {
-      const datas = {
-        ...this.filter,
-        pageNumber: this.current,
-        pageSize: this.size
-      };
-      if (datas.enable !== null && datas.enable !== "")
-        datas.enable = !!datas.enable;
-      const data = await userListPage(datas);
-      this.users = data.records;
-      this.total = data.total;
-    },
-    toPage(page) {
-      this.current = page;
-      this.getList();
-    },
-    toEnable(row) {
-      // 自己不可以启用/禁用自己
-      const userId = this.$ls.get("user", { id: "" }).id;
-      if (row.id === userId) {
-        this.$message.error("不可以启用/禁用自己！");
-        return;
-      }
-
-      const action = row.enable ? "禁用" : "启用";
-      this.$confirm(`确定要${action}用户【${row.realName}】吗?`, "提示", {
-        type: "warning"
-      })
-        .then(async () => {
-          const enable = !row.enable;
-          await ableUser({
-            id: row.id,
-            enable
-          });
-          row.enable = enable;
-          this.$message.success("操作成功！");
-        })
-        .catch(() => {});
-    },
-    toEdit(row) {
-      this.curUser = row;
-      this.$refs.ModifyUser.open();
-    },
-    toAdd() {
-      this.curUser = {};
-      this.$refs.ModifyUser.open();
-    },
-    async toResetPwd(row) {
-      await resetPwd(row.id);
-      this.$message.success("密码重置成功！");
-    }
-  }
-};
-</script>
+<template>
+  <div class="user-manage">
+    <div class="part-box part-box-filter part-box-flex">
+      <el-form ref="FilterForm" label-position="left" label-width="85px" inline>
+        <el-form-item label="姓名：" label-width="75px">
+          <el-input
+            style="width: 142px;"
+            v-model.trim="filter.realName"
+            placeholder="请输入内容"
+            clearable
+          ></el-input>
+        </el-form-item>
+        <el-form-item label="启用/禁用：" label-width="90px">
+          <el-select
+            v-model="filter.enable"
+            style="width: 142px;"
+            placeholder="请选择"
+            clearable
+          >
+            <el-option
+              v-for="(val, key) in ABLE_TYPE"
+              :key="key"
+              :value="key * 1"
+              :label="val"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+
+        <el-form-item label-width="0px">
+          <el-button type="primary" round @click="toPage(1)">查询</el-button>
+        </el-form-item>
+      </el-form>
+      <div class="part-box-action">
+        <el-button
+          type="primary"
+          icon="el-icon-circle-plus-outline"
+          round
+          @click="toAdd"
+          >新增用户</el-button
+        >
+      </div>
+    </div>
+
+    <div class="part-box part-box-pad">
+      <el-table ref="TableList" :data="users" border>
+        <el-table-column
+          type="index"
+          label="序号"
+          width="70"
+          align="center"
+          :index="indexMethod"
+        ></el-table-column>
+        <el-table-column prop="loginName" label="用户名"></el-table-column>
+        <el-table-column prop="realName" label="姓名"></el-table-column>
+        <el-table-column prop="roles" label="角色">
+          <template slot-scope="scope">
+            {{ scope.row.roles | rolesFilter }}
+          </template>
+        </el-table-column>
+        <el-table-column prop="mobileNumber" label="手机号"></el-table-column>
+        <el-table-column prop="enable" label="状态" width="100">
+          <template slot-scope="scope">
+            {{ scope.row.enable | enableFilter }}
+          </template>
+        </el-table-column>
+        <el-table-column
+          class-name="action-column"
+          label="操作"
+          align="center"
+          width="120px"
+        >
+          <template slot-scope="scope">
+            <el-button
+              class="btn-table-icon"
+              type="text"
+              icon="icon icon-edit"
+              @click="toEdit(scope.row)"
+              title="编辑"
+            ></el-button>
+            <el-button
+              class="btn-table-icon"
+              type="text"
+              :icon="
+                scope.row.enable
+                  ? 'icon icon-circle-stop'
+                  : 'icon icon-circle-caret-right'
+              "
+              @click="toEnable(scope.row)"
+              :title="scope.row.enable ? '禁用' : '启用'"
+            ></el-button>
+            <el-button
+              class="btn-table-icon"
+              type="text"
+              icon="icon icon-circle-lock"
+              @click="toResetPwd(scope.row)"
+              title="重置密码"
+            ></el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      <div class="part-page">
+        <el-pagination
+          background
+          layout="total,prev, pager, next"
+          :current-page="current"
+          :total="total"
+          :page-size="size"
+          @current-change="toPage"
+        >
+        </el-pagination>
+      </div>
+    </div>
+
+    <!-- ModifyUser -->
+    <modify-user
+      ref="ModifyUser"
+      :instance="curUser"
+      :roles="roles"
+      @modified="getList"
+    ></modify-user>
+  </div>
+</template>
+
+<script>
+import ModifyUser from "../components/ModifyUser";
+import { ABLE_TYPE } from "@/constants/enumerate";
+import { userListPage, ableUser, resetPwd, userRoleListPage } from "../api";
+
+export default {
+  name: "user-manage",
+  components: { ModifyUser },
+  data() {
+    return {
+      filter: {
+        realName: "",
+        enable: ""
+      },
+      current: 1,
+      size: this.GLOBAL.pageSize,
+      total: 0,
+      visible: false,
+      ABLE_TYPE,
+      roles: [],
+      users: [],
+      curUser: {}
+    };
+  },
+  created() {
+    this.getRoleList();
+    this.getList();
+  },
+  methods: {
+    async getRoleList() {
+      const data = await userRoleListPage();
+      this.roles = data || [];
+      this.roles = this.roles
+        .filter(item => item.type === "CUSTOMER")
+        .map(item => {
+          return {
+            id: item.id,
+            name: item.name,
+            type: item.type
+          };
+        });
+      console.log(this.roles);
+    },
+    async getList() {
+      const datas = {
+        ...this.filter,
+        pageNumber: this.current,
+        pageSize: this.size
+      };
+      if (datas.enable !== null && datas.enable !== "")
+        datas.enable = !!datas.enable;
+      const data = await userListPage(datas);
+      this.users = data.records;
+      this.total = data.total;
+    },
+    toPage(page) {
+      this.current = page;
+      this.getList();
+    },
+    toEnable(row) {
+      // 自己不可以启用/禁用自己
+      const userId = this.$ls.get("user", { id: "" }).id;
+      if (row.id === userId) {
+        this.$message.error("不可以启用/禁用自己！");
+        return;
+      }
+
+      const action = row.enable ? "禁用" : "启用";
+      this.$confirm(`确定要${action}用户【${row.realName}】吗?`, "提示", {
+        cancelButtonClass: "el-button--danger is-plain",
+        confirmButtonClass: "el-button--primary",
+        type: "warning"
+      })
+        .then(async () => {
+          const enable = !row.enable;
+          await ableUser({
+            id: row.id,
+            enable
+          });
+          row.enable = enable;
+          this.$message.success("操作成功！");
+        })
+        .catch(() => {});
+    },
+    toEdit(row) {
+      this.curUser = row;
+      this.$refs.ModifyUser.open();
+    },
+    toAdd() {
+      this.curUser = {
+        roles: this.roles
+      };
+      this.$refs.ModifyUser.open();
+    },
+    async toResetPwd(row) {
+      await resetPwd(row.id);
+      this.$message.success("密码重置成功！");
+    }
+  }
+};
+</script>

src/modules/admin/views/AuthSet.vue

@@ -1,87 +0,0 @@
-<template>
-  <div class="auth-set">
-    <div class="part-box part-box-pad">
-      <el-form ref="modalFormComp" :model="modalForm" label-width="120px">
-        <el-form-item prop="loginName" label="当前信息：">
-          {{ modalForm.expireTime === null ? "未授权" : "已授权" }}
-        </el-form-item>
-        <el-form-item label="过期时间：">
-          <span v-if="modalForm.expireTime === -1">不过期</span>
-          <span v-else-if="modalForm.expireTime">
-            {{ modalForm.expireTime | timestampFilter }}</span
-          >
-          <span v-else>--</span>
-        </el-form-item>
-        <el-form-item prop="mobileNumber" label="导出：">
-          <el-button type="primary" :loading="downloading" @click="toExport">
-            硬件信息
-          </el-button>
-        </el-form-item>
-        <el-form-item prop="code" label="导入授权文件：">
-          <upload-button
-            btn-content="选择文件"
-            btn-type="primary"
-            :upload-url="uploadUrl"
-            :format="['lic']"
-            accept=".lic"
-            style="margin:0;"
-            @valid-error="validError"
-            @upload-success="uploadSuccess"
-          >
-          </upload-button>
-        </el-form-item>
-      </el-form>
-    </div>
-  </div>
-</template>
-
-<script>
-import { downloadByApi } from "@/plugins/download";
-import { exportDeviceInfo, authSelect } from "../api";
-import UploadButton from "@/components/UploadButton";
-
-export default {
-  name: "auth-set",
-  components: { UploadButton },
-  data() {
-    return {
-      modalForm: {
-        expireTime: "",
-        authFile: null
-      },
-      downloading: false,
-      // import
-      uploadUrl: "/api/admin/auth/offline/activation"
-    };
-  },
-  created() {
-    this.search();
-  },
-  methods: {
-    async search() {
-      const res = await authSelect();
-      this.modalForm.expireTime = res;
-    },
-    async toExport() {
-      if (this.downloading) return;
-      this.downloading = true;
-
-      const res = await downloadByApi(() => {
-        return exportDeviceInfo();
-      }).catch(e => {
-        this.$message.error(e || "下载失败，请重新尝试！");
-      });
-      this.downloading = false;
-
-      if (!res) return;
-      this.$message.success("下载成功！");
-    },
-    validError(errorData) {
-      this.$message.error(errorData.message);
-    },
-    uploadSuccess() {
-      this.search();
-    }
-  }
-};
-</script>

src/modules/admin/views/PrivilegeManage.vue

@@ -1,153 +1,172 @@
-<template>
-  <div class="privilege-manage">
-    <div class="part-box">
-      <el-button type="primary" size="mini" icon="el-icon-edit" @click="toAdd"
-        >新增</el-button
-      >
-    </div>
-    <div class="part-box part-box-pad part-box-border">
-      <el-tree
-        :data="menus"
-        node-key="id"
-        default-expand-all
-        :expand-on-click-node="false"
-        :props="defaultProps"
-      >
-        <span class="custom-tree-node" slot-scope="{ node, data }">
-          <span
-            ><i class="el-icon-link" v-if="data.type === 'URL'"></i>
-            {{ node.label }}</span
-          >
-          <span>
-            <el-button
-              v-if="data.type === 'MENU'"
-              class="btn-primary"
-              type="text"
-              icon="icon icon-plus-act"
-              @click="() => append(data)"
-              title="新增"
-            ></el-button>
-            <el-button
-              class="btn-primary"
-              type="text"
-              icon="icon icon-edit"
-              @click="() => edit(node, data)"
-              title="修改"
-            ></el-button>
-            <el-button
-              class="btn-primary"
-              type="text"
-              icon="icon icon-delete"
-              @click="() => remove(node, data)"
-              title="删除"
-            ></el-button>
-          </span>
-        </span>
-      </el-tree>
-    </div>
-
-    <!-- ModifyPrivilege -->
-    <modify-privilege
-      ref="ModifyPrivilege"
-      :instance="curMenu"
-      @confirm="menuModified"
-    ></modify-privilege>
-  </div>
-</template>
-
-<script>
-import { menuList, deleteMenu } from "../api";
-import ModifyPrivilege from "../components/ModifyPrivilege";
-
-export default {
-  name: "privilege-manage",
-  components: { ModifyPrivilege },
-  data() {
-    return {
-      menus: [],
-      curMenu: {},
-      parentNode: null,
-      parentData: null,
-      defaultProps: {
-        label: "name"
-      }
-    };
-  },
-  created() {
-    this.getList();
-  },
-  methods: {
-    async getList() {
-      this.menus = await menuList();
-    },
-    toAdd() {
-      this.curMenu = {
-        sequence: this.menus.length + 1
-      };
-      this.$refs.ModifyPrivilege.open();
-    },
-    edit(node, data) {
-      this.curMenu = {
-        ...data,
-        parentName: data.parentId && node.parent.data.name
-      };
-      this.parentData = data;
-      this.$refs.ModifyPrivilege.open();
-    },
-    remove(node, data) {
-      const name = node.parent.label
-        ? `${node.parent.label}->${data.name}`
-        : data.name;
-      this.$confirm(`确定要删除【${name}】吗？`, "提示", {
-        type: "warning"
-      })
-        .then(async () => {
-          await deleteMenu(data.id);
-
-          const parent = node.parent;
-          const children = parent.data.children || parent.data;
-          const index = children.findIndex(d => d.id === data.id);
-          children.splice(index, 1);
-
-          this.$message.success("删除成功！");
-        })
-        .catch(() => {});
-    },
-    append(data) {
-      const sequences = data.children
-        ? data.children.map(item => item.sequence)
-        : [];
-      const maxSequence = sequences.length
-        ? Math.max.apply(null, sequences)
-        : 0;
-
-      this.curMenu = {
-        parentId: data.id,
-        parentName: data.name,
-        sequence: maxSequence + 1
-      };
-      this.parentData = data;
-      this.$refs.ModifyPrivilege.open();
-    },
-    menuModified(curNode) {
-      if (!this.curMenu.parentName) {
-        this.getList();
-        return;
-      }
-
-      if (this.curMenu.id) {
-        this.parentData.name = curNode.name;
-        this.parentData.url = curNode.url;
-        this.parentData.type = curNode.type;
-        this.parentData.sequence = curNode.sequence;
-        this.parentData.remark = curNode.remark;
-      } else {
-        if (!this.parentData.children) {
-          this.$set(this.parentData, "children", []);
-        }
-        this.parentData.children.push(curNode);
-      }
-    }
-  }
-};
-</script>
+<template>
+  <div class="privilege-manage">
+    <div class="page-head">
+      <el-button type="primary" size="mini" icon="el-icon-edit" @click="toAdd"
+        >新增</el-button
+      >
+    </div>
+    <div class="part-box part-box-pad">
+      <el-tree
+        :data="menus"
+        node-key="id"
+        default-expand-all
+        :expand-on-click-node="false"
+        :props="defaultProps"
+      >
+        <span class="custom-tree-node" slot-scope="{ node, data }">
+          <span
+            ><i class="el-icon-link" v-if="data.type === 'URL'"></i>
+            {{ node.label }}</span
+          >
+          <span>
+            <el-button
+              v-if="data.type === 'MENU'"
+              class="btn-table-icon"
+              type="text"
+              icon="icon icon-plus-act"
+              @click="() => append(data)"
+              title="新增"
+            ></el-button>
+            <el-button
+              class="btn-table-icon"
+              type="text"
+              icon="icon icon-edit"
+              @click="() => edit(node, data)"
+              title="修改"
+            ></el-button>
+            <el-button
+              class="btn-table-icon"
+              type="text"
+              icon="icon icon-delete"
+              @click="() => remove(node, data)"
+              title="删除"
+            ></el-button>
+          </span>
+        </span>
+      </el-tree>
+    </div>
+
+    <!-- ModifyPrivilege -->
+    <modify-privilege
+      ref="ModifyPrivilege"
+      :menu-list="menuList"
+      :instance="curMenu"
+      @confirm="menuModified"
+    ></modify-privilege>
+  </div>
+</template>
+
+<script>
+import { menuList, deleteMenu } from "../api";
+import ModifyPrivilege from "../components/ModifyPrivilege";
+
+export default {
+  name: "privilege-manage",
+  components: { ModifyPrivilege },
+  data() {
+    return {
+      menus: [],
+      menuList: [],
+      curMenu: {},
+      parentNode: null,
+      parentData: null,
+      defaultProps: {
+        label: "name"
+      }
+    };
+  },
+  created() {
+    this.getList();
+  },
+  methods: {
+    async getList() {
+      this.menus = await menuList();
+      this.getMenuSource(this.menus);
+    },
+    getMenuSource(list) {
+      if (!list || !list.length) return;
+      list.forEach(menu => {
+        if (menu.type === "MENU") {
+          this.menuList.push({
+            id: menu.id,
+            name: menu.name
+          });
+          if (menu.children && menu.children.length) {
+            this.getMenuSource(menu.children);
+          }
+        }
+      });
+    },
+    toAdd() {
+      this.curMenu = {
+        sequence: this.menus.length + 1
+      };
+      this.$refs.ModifyPrivilege.open();
+    },
+    edit(node, data) {
+      this.curMenu = {
+        ...data,
+        parentName: data.parentId && node.parent.data.name
+      };
+      this.parentData = data;
+      this.$refs.ModifyPrivilege.open();
+    },
+    remove(node, data) {
+      const name = node.parent.label
+        ? `${node.parent.label}->${data.name}`
+        : data.name;
+      this.$confirm(`确定要删除【${name}】吗？`, "提示", {
+        cancelButtonClass: "el-button--danger is-plain",
+        confirmButtonClass: "el-button--primary",
+        type: "warning"
+      })
+        .then(async () => {
+          await deleteMenu(data.id);
+
+          const parent = node.parent;
+          const children = parent.data.children || parent.data;
+          const index = children.findIndex(d => d.id === data.id);
+          children.splice(index, 1);
+
+          this.$message.success("删除成功！");
+        })
+        .catch(() => {});
+    },
+    append(data) {
+      const sequences = data.children
+        ? data.children.map(item => item.sequence)
+        : [];
+      const maxSequence = sequences.length
+        ? Math.max.apply(null, sequences)
+        : 0;
+
+      this.curMenu = {
+        parentId: data.id,
+        parentName: data.name,
+        sequence: maxSequence + 1
+      };
+      this.parentData = data;
+      this.$refs.ModifyPrivilege.open();
+    },
+    menuModified(curNode) {
+      if (!this.curMenu.parentName) {
+        this.getList();
+        return;
+      }
+
+      if (this.curMenu.id) {
+        this.parentData.name = curNode.name;
+        this.parentData.url = curNode.url;
+        this.parentData.type = curNode.type;
+        this.parentData.sequence = curNode.sequence;
+        this.parentData.remark = curNode.remark;
+      } else {
+        if (!this.parentData.children) {
+          this.$set(this.parentData, "children", []);
+        }
+        this.parentData.children.push(curNode);
+      }
+    }
+  }
+};
+</script>

src/modules/admin/views/SchoolMenuManage.vue

@@ -1,107 +0,0 @@
-<template>
-  <div class="school-menu-manage">
-    <div class="part-box part-box-filter part-box-flex">
-      <el-form ref="FilterForm" label-position="left" inline>
-        <el-form-item label="学校：">
-          <school-select
-            v-model="schoolId"
-            placeholder="请选择学校"
-            :clearable="false"
-            style="width:100%;"
-            @change="search"
-          ></school-select>
-        </el-form-item>
-      </el-form>
-      <div class="part-box-action">
-        <el-button
-          type="primary"
-          :disabled="fetching"
-          :loading="loading"
-          @click="save"
-          >保存</el-button
-        >
-      </div>
-    </div>
-
-    <div class="part-box part-box-pad">
-      <privilege-set
-        v-if="menus && menus.length"
-        ref="PrivilegeSet"
-        :menus="menus"
-      ></privilege-set>
-    </div>
-  </div>
-</template>
-
-<script>
-import {
-  schoolMenuTree,
-  schoolSelectedMenuTree,
-  updateSchoolMenu
-} from "../api";
-import PrivilegeSet from "../../base/components/PrivilegeSet";
-
-export default {
-  name: "school-menu-manage",
-  components: { PrivilegeSet },
-  data() {
-    return {
-      schoolId: "",
-      menus: [],
-      loading: false,
-      fetching: false,
-      defaultProps: {
-        label: "name"
-      }
-    };
-  },
-  mounted() {
-    this.getPrivileges();
-  },
-  methods: {
-    async getPrivileges() {
-      const needHideModules = ["common", "customer"];
-      const data = await schoolMenuTree();
-      const menus = data || [];
-
-      this.menus = menus
-        .filter(item => !needHideModules.includes(item.url))
-        .map(item => {
-          item.parentId = null;
-          return item;
-        });
-
-      this.$nextTick(() => {
-        this.$refs.PrivilegeSet.buildTableData([]);
-      });
-    },
-    async search() {
-      if (!this.schoolId) return;
-      this.fetching = true;
-      const data = await schoolSelectedMenuTree(this.schoolId).catch(() => {});
-      this.fetching = false;
-
-      const privilegeIds = data || [];
-      this.$refs.PrivilegeSet.buildTableData(privilegeIds);
-    },
-    async save() {
-      if (!this.schoolId) {
-        this.$message.error("学校必须选择！");
-        return;
-      }
-      if (this.loading) return;
-
-      this.loading = true;
-      const privilegeIds = this.$refs.PrivilegeSet.getSelectedPrivilegeIds();
-      const res = await updateSchoolMenu({
-        schoolId: this.schoolId,
-        privilegeIds: privilegeIds
-      });
-      this.loading = false;
-      if (!res) return;
-
-      this.$message.success("修改成功！");
-    }
-  }
-};
-</script>

src/modules/admin/views/SystemRoleManage.vue

@@ -1,83 +1,77 @@
-<template>
-  <div class="role-manage">
-    <div class="part-box part-box-pad part-box-flex">
-      <div></div>
-      <el-button
-        type="primary"
-        icon="el-icon-circle-plus-outline"
-        @click="toAdd"
-        >添加角色</el-button
-      >
-    </div>
-    <div class="part-box part-box-pad">
-      <el-table ref="TableList" :data="roles">
-        <el-table-column
-          type="index"
-          label="序号"
-          width="70"
-          :index="indexMethod"
-        ></el-table-column>
-        <el-table-column prop="name" label="角色名称"></el-table-column>
-        <el-table-column class-name="action-column" label="操作" width="120px">
-          <template slot-scope="scope">
-            <el-button
-              class="btn-primary"
-              type="text"
-              @click="toEdit(scope.row)"
-              >编辑</el-button
-            >
-          </template>
-        </el-table-column>
-      </el-table>
-    </div>
-    <!-- ModifySystemRole -->
-    <modify-system-role
-      ref="ModifySystemRole"
-      :instance="curRole"
-      @modified="getList"
-    ></modify-system-role>
-  </div>
-</template>
-
-<script>
-import { ABLE_TYPE } from "@/constants/enumerate";
-import { userRoleListPage } from "../api";
-import ModifySystemRole from "../components/ModifySystemRole";
-
-export default {
-  name: "role-manage",
-  components: {
-    ModifySystemRole
-  },
-  data() {
-    return {
-      roles: [],
-      curRole: {},
-      ABLE_TYPE,
-      ROLE_TYPE: {}
-    };
-  },
-  created() {
-    this.toPage(1);
-  },
-  methods: {
-    async getList() {
-      const data = await userRoleListPage();
-      this.roles = data || [];
-      this.roles = this.roles.filter(item => item.type !== "ADMIN");
-    },
-    toPage(page) {
-      this.current = page;
-      this.getList();
-    },
-    toEdit(row) {
-      this.curRole = row;
-      this.$refs.ModifySystemRole.open();
-    },
-    toAdd() {
-      this.curRole = {};
-      this.$refs.ModifySystemRole.open();
-    }
-  }
-};
-</script>
+<template>
+  <div class="role-manage">
+    <div class="part-box part-box-pad">
+      <el-table ref="TableList" :data="roles" border stripe>
+        <el-table-column
+          type="index"
+          label="序号"
+          width="70"
+          align="center"
+          :index="indexMethod"
+        ></el-table-column>
+        <el-table-column prop="name" label="角色名称"></el-table-column>
+        <el-table-column
+          class-name="action-column"
+          label="操作"
+          align="center"
+          width="120px"
+        >
+          <template slot-scope="scope">
+            <el-button
+              class="btn-table-icon"
+              type="text"
+              icon="icon icon-edit"
+              @click="toEdit(scope.row)"
+              title="编辑"
+            ></el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+    </div>
+    <!-- ModifySystemRole -->
+    <modify-system-role
+      ref="ModifySystemRole"
+      :instance="curRole"
+      @modified="getList"
+    ></modify-system-role>
+  </div>
+</template>
+
+<script>
+import { ABLE_TYPE } from "@/constants/enumerate";
+import { userRoleListPage } from "../api";
+import ModifySystemRole from "../components/ModifySystemRole";
+
+export default {
+  name: "role-manage",
+  components: {
+    ModifySystemRole
+  },
+  data() {
+    return {
+      roles: [],
+      curRole: {},
+      ABLE_TYPE,
+      ROLE_TYPE: {}
+    };
+  },
+  created() {
+    this.toPage(1);
+  },
+  methods: {
+    async getList() {
+      const data = await userRoleListPage();
+      this.roles = data || [];
+      this.roles = this.roles.filter(item => item.type !== "ADMIN");
+    },
+    toPage(page) {
+      this.current = page;
+      this.getList();
+    },
+    toEdit(row) {
+      this.curRole = row;
+      this.$refs.ModifySystemRole.open();
+    }
+  }
+};
+</script>