created

orange-admin-web/src/App.vue

@@ -0,0 +1,24 @@
+<template>
+  <div>
+    <router-view></router-view>
+  </div>
+</template>
+
+<script>
+import { mapMutations } from 'vuex';
+
+export default {
+  methods: {
+    ...mapMutations(['setUserRules'])
+  },
+  watch: {
+    $route: {
+      handler (newValue) {
+        document.title = '橙单工程';
+        if (newValue.meta && newValue.meta.title) document.title += ' - ' + newValue.meta.title;
+      },
+      immediate: true
+    }
+  }
+}
+</script>

orange-admin-web/src/api/Controller/DictionaryController.js

@@ -0,0 +1,109 @@
+import * as staticDict from '@/staticDict'
+
+export default class DictionaryController {
+  static dictAreaCode (sender, params, axiosOption, httpOption) {
+    return new Promise((resolve, reject) => {
+      sender.doUrl('/admin/app/areaCode/listDictAreaCode', 'get', params, axiosOption, httpOption).then(res => {
+        let dictData = new staticDict.DictionaryBase();
+        dictData.setList(res.data);
+        resolve(dictData);
+      }).catch(err => {
+        reject(err);
+      });
+    });
+  }
+  static dictAreaCodeByParentId (sender, params, axiosOption, httpOption) {
+    return new Promise((resolve, reject) => {
+      sender.doUrl('/admin/app/areaCode/listDictAreaCodeByParentId', 'get', params, axiosOption, httpOption).then(res => {
+        let dictData = new staticDict.DictionaryBase();
+        dictData.setList(res.data);
+        resolve(dictData);
+      }).catch(err => {
+        reject(err);
+      });
+    });
+  }
+  static dictAddAreaCode (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('', 'post', params, axiosOption, httpOption);
+  }
+  static dictDeleteAreaCode (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('', 'post', params, axiosOption, httpOption);
+  }
+  static dictBatchDeleteAreaCode (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('', 'post', params, axiosOption, httpOption);
+  }
+  static dictUpdateAreaCode (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('', 'post', params, axiosOption, httpOption);
+  }
+  static dictReloadAreaCodeCachedData (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('', 'get', params, axiosOption, httpOption);
+  }
+  static dictGender () {
+    return new Promise((resolve) => {
+      resolve(staticDict.Gender);
+    });
+  }
+  static dictSubject () {
+    return new Promise((resolve) => {
+      resolve(staticDict.Subject);
+    });
+  }
+  static dictSysDept (sender, params, axiosOption, httpOption) {
+    return new Promise((resolve, reject) => {
+      sender.doUrl('/admin/upms/sysDept/listDictSysDept', 'get', params, axiosOption, httpOption).then(res => {
+        let dictData = new staticDict.DictionaryBase();
+        dictData.setList(res.data);
+        resolve(dictData);
+      }).catch(err => {
+        reject(err);
+      });
+    });
+  }
+  static dictSysUser (sender, params, axiosOption, httpOption) {
+    return new Promise((resolve, reject) => {
+      sender.doUrl('/admin/upms/sysUser/listDictSysUser', 'get', params, axiosOption, httpOption).then(res => {
+        let dictData = new staticDict.DictionaryBase();
+        dictData.setList(res.data);
+        resolve(dictData);
+      }).catch(err => {
+        reject(err);
+      });
+    });
+  }
+  static dictSysUserStatus () {
+    return new Promise((resolve) => {
+      resolve(staticDict.SysUserStatus);
+    });
+  }
+  static dictSysUserType () {
+    return new Promise((resolve) => {
+      resolve(staticDict.SysUserType);
+    });
+  }
+  static dictTeacher (sender, params, axiosOption, httpOption) {
+    return new Promise((resolve, reject) => {
+      sender.doUrl('/admin/app/teacher/listDictTeacher', 'get', params, axiosOption, httpOption).then(res => {
+        let dictData = new staticDict.DictionaryBase();
+        dictData.setList(res.data);
+        resolve(dictData);
+      }).catch(err => {
+        reject(err);
+      });
+    });
+  }
+  static dictTeacherLevelType () {
+    return new Promise((resolve) => {
+      resolve(staticDict.TeacherLevelType);
+    });
+  }
+  static dictYesNo () {
+    return new Promise((resolve) => {
+      resolve(staticDict.YesNo);
+    });
+  }
+  static dictSysDataPermType () {
+    return new Promise((resolve) => {
+      resolve(staticDict.SysDataPermType);
+    });
+  }
+}

orange-admin-web/src/api/Controller/SysDataPermController.js

@@ -0,0 +1,61 @@
+export default class SysDataPermController {
+  /**
+   * @param params    {dataPermId, dataPermName, deptIdListString}
+   */
+  static add (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysDataPerm/add', 'post', params, axiosOption, httpOption);
+  }
+
+  /**
+   * @param params    {dataPermId, dataPermName, deptIdListString}
+   */
+  static update (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysDataPerm/update', 'post', params, axiosOption, httpOption);
+  }
+
+  /**
+   * @param params    {dataPermId}
+   */
+  static delete (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysDataPerm/delete', 'post', params, axiosOption, httpOption);
+  }
+
+  /**
+   * @param params    {dataPermName}
+   */
+  static list (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysDataPerm/list', 'post', params, axiosOption, httpOption);
+  }
+
+  /**
+   * @param params    {dataPermId}
+   */
+  static view (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysDataPerm/view', 'get', params, axiosOption, httpOption);
+  }
+
+  /**
+   * @param params    {dataPermId, searchString}
+   */
+  static listDataPermUser (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysDataPerm/listDataPermUser', 'post', params, axiosOption, httpOption);
+  }
+
+  /**
+   * @param params    {dataPermId, userIdListString}
+   */
+  static addDataPermUser (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysDataPerm/addDataPermUser', 'post', params, axiosOption, httpOption);
+  }
+
+  /**
+   * @param params    {dataPermId, userId}
+   */
+  static deleteDataPermUser (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysDataPerm/deleteDataPermUser', 'post', params, axiosOption, httpOption);
+  }
+
+  static listNotInDataPermUser (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysDataPerm/listNotInDataPermUser', 'post', params, axiosOption, httpOption);
+  }
+}

orange-admin-web/src/api/Controller/SysDeptController.js

@@ -0,0 +1,25 @@
+export default class SysDeptController {
+  static list (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('/admin/upms/sysDept/list', 'post', params, axiosOption, httpOption);
+  }
+
+  static view (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('/admin/upms/sysDept/view', 'get', params, axiosOption, httpOption);
+  }
+
+  static export (sender, params, fileName) {
+    return sender.download('/admin/upms/sysDept/export', params, fileName);
+  }
+
+  static add (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('/admin/upms/sysDept/add', 'post', params, axiosOption, httpOption);
+  }
+
+  static update (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('/admin/upms/sysDept/update', 'post', params, axiosOption, httpOption);
+  }
+
+  static delete (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('/admin/upms/sysDept/delete', 'post', params, axiosOption, httpOption);
+  }
+}

orange-admin-web/src/api/Controller/SysUserController.js

@@ -0,0 +1,25 @@
+export default class SysUserController {
+  static list (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('/admin/upms/sysUser/list', 'post', params, axiosOption, httpOption);
+  }
+
+  static view (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('/admin/upms/sysUser/view', 'get', params, axiosOption, httpOption);
+  }
+
+  static export (sender, params, fileName) {
+    return sender.download('/admin/upms/sysUser/export', params, fileName);
+  }
+
+  static add (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('/admin/upms/sysUser/add', 'post', params, axiosOption, httpOption);
+  }
+
+  static update (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('/admin/upms/sysUser/update', 'post', params, axiosOption, httpOption);
+  }
+
+  static delete (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('/admin/upms/sysUser/delete', 'post', params, axiosOption, httpOption);
+  }
+}

orange-admin-web/src/api/Controller/SystemController.js

@@ -0,0 +1,213 @@
+export default class SystemController {
+  static login (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/login/doLogin', 'get', params, axiosOption, httpOption);
+  }
+
+  static logout (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/login/doLogout', 'post', params, axiosOption, httpOption);
+  }
+
+  static getDictList (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysDict/list', 'post', params, axiosOption, httpOption);
+  }
+
+  static getRoleList (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysRole/list', 'post', params, axiosOption, httpOption);
+  }
+
+  static getRole (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysRole/view', 'get', params, axiosOption, httpOption);
+  }
+
+  static deleteRole (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysRole/delete', 'post', params, axiosOption, httpOption);
+  }
+
+  static addRole (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysRole/add', 'post', params, axiosOption, httpOption);
+  }
+
+  static updateRole (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysRole/update', 'post', params, axiosOption, httpOption);
+  }
+
+  static getUserList (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysUser/list', 'post', params, axiosOption, httpOption);
+  }
+
+  static getUser (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysUser/view', 'get', params, axiosOption, httpOption);
+  }
+
+  static resetUserPassword (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysUser/resetPassword', 'post', params, axiosOption, httpOption);
+  }
+
+  static deleteUser (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysUser/delete', 'post', params, axiosOption, httpOption);
+  }
+
+  static addUser (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysUser/add', 'post', params, axiosOption, httpOption);
+  }
+
+  static updateUser (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysUser/update', 'post', params, axiosOption, httpOption);
+  }
+
+  static addDepartment (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysDept/add', 'post', params, axiosOption, httpOption);
+  }
+
+  static deleteDepartment (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysDept/delete', 'post', params, axiosOption, httpOption);
+  }
+
+  static updateDepartment (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysDept/update', 'post', params, axiosOption, httpOption);
+  }
+
+  static getDepartmentList (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysDept/list', 'post', params, axiosOption, httpOption);
+  }
+
+  // 菜单接口
+  static getMenuPermList (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysMenu/list', 'get', params, axiosOption, httpOption);
+  }
+
+  static addMenu (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysMenu/add', 'post', params, axiosOption, httpOption);
+  }
+
+  static updateMenu (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysMenu/update', 'post', params, axiosOption, httpOption);
+  }
+
+  static deleteMenu (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysMenu/delete', 'post', params, axiosOption, httpOption);
+  }
+
+  static viewMenu (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysMenu/view', 'get', params, axiosOption, httpOption);
+  }
+
+  static listMenuPerm (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysMenu/listMenuPerm', 'get', params, axiosOption, httpOption);
+  }
+
+  // 权限字接口
+  static getPermCodeList (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysPermCode/list', 'post', params, axiosOption, httpOption);
+  }
+
+  static addPermCode (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysPermCode/add', 'post', params, axiosOption, httpOption);
+  }
+
+  static updatePermCode (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysPermCode/update', 'post', params, axiosOption, httpOption);
+  }
+
+  static deletePermCode (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysPermCode/delete', 'post', params, axiosOption, httpOption);
+  }
+
+  static viewPermCode (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysPermCode/view', 'get', params, axiosOption, httpOption);
+  }
+
+  // 权限资源接口
+  static getAllPermList (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysPermModule/listAll', 'get', params, axiosOption, httpOption);
+  }
+
+  static getPermGroupList (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysPermModule/list', 'get', params, axiosOption, httpOption);
+  }
+
+  static addPermGroup (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysPermModule/add', 'post', params, axiosOption, httpOption);
+  }
+
+  static updatePermGroup (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysPermModule/update', 'post', params, axiosOption, httpOption);
+  }
+
+  static deletePermGroup (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysPermModule/delete', 'post', params, axiosOption, httpOption);
+  }
+
+  static getPermList (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysPerm/list', 'post', params, axiosOption, httpOption);
+  }
+
+  static viewPerm (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysPerm/view', 'get', params, axiosOption, httpOption);
+  }
+
+  static addPerm (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysPerm/add', 'post', params, axiosOption, httpOption);
+  }
+
+  static updatePerm (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysPerm/update', 'post', params, axiosOption, httpOption);
+  }
+
+  static deletePerm (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysPerm/delete', 'post', params, axiosOption, httpOption);
+  }
+
+  /**
+   * @param params    {roleId, searchString}
+   */
+  static listRoleUser (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysRole/listUserRole', 'post', params, axiosOption, httpOption);
+  }
+
+  static listNotInUserRole (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysRole/listNotInUserRole', 'post', params, axiosOption, httpOption);
+  }
+
+  /**
+   * @param params    {roleId, userIdListString}
+   */
+  static addRoleUser (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysRole/addUserRole', 'post', params, axiosOption, httpOption);
+  }
+
+  /**
+   * @param params    {roleId, userId}
+   */
+  static deleteRoleUser (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysRole/deleteUserRole', 'post', params, axiosOption, httpOption);
+  }
+
+  /**
+   * @param params {}
+   */
+  static queryRoleByPermCode (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysRole/listAllRolesByPermCode', 'post', params, axiosOption, httpOption);
+  }
+
+  /**
+   * @param params {}
+   */
+  static queryRoleByURL (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysRole/listAllRolesByPerm', 'post', params, axiosOption, httpOption);
+  }
+
+  /**
+   * @param params {}
+   */
+  static queryPerm (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysUser/listAllPerms', 'post', params, axiosOption, httpOption);
+  }
+
+  /**
+   * @param params {}
+   */
+  static queryPermCode (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('admin/upms/sysRole/deleteUserRole', 'post', params, axiosOption, httpOption);
+  }
+}

orange-admin-web/src/api/Controller/TeacherController.js

@@ -0,0 +1,25 @@
+export default class TeacherController {
+  static list (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('/admin/app/teacher/list', 'post', params, axiosOption, httpOption);
+  }
+
+  static view (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('/admin/app/teacher/view', 'get', params, axiosOption, httpOption);
+  }
+
+  static export (sender, params, fileName) {
+    return sender.download('/admin/app/teacher/export', params, fileName);
+  }
+
+  static add (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('/admin/app/teacher/add', 'post', params, axiosOption, httpOption);
+  }
+
+  static update (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('/admin/app/teacher/update', 'post', params, axiosOption, httpOption);
+  }
+
+  static delete (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('/admin/app/teacher/delete', 'post', params, axiosOption, httpOption);
+  }
+}

orange-admin-web/src/api/Controller/TeacherTransStatsController.js

@@ -0,0 +1,17 @@
+export default class TeacherTransStatsController {
+  static list (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('/admin/app/teacherTransStats/list', 'post', params, axiosOption, httpOption);
+  }
+
+  static view (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('/admin/app/teacherTransStats/view', 'get', params, axiosOption, httpOption);
+  }
+
+  static export (sender, params, fileName) {
+    return sender.download('/admin/app/teacherTransStats/export', params, fileName);
+  }
+
+  static listWithGroup (sender, params, axiosOption, httpOption) {
+    return sender.doUrl('/admin/app/teacherTransStats/listWithGroup', 'post', params, axiosOption, httpOption);
+  }
+}

orange-admin-web/src/api/index.js

@@ -0,0 +1,17 @@
+import SystemController from './Controller/SystemController'
+import SysDataPermController from './Controller/SysDataPermController'
+import DictionaryController from './Controller/DictionaryController'
+import SysDeptController from './Controller/SysDeptController.js'
+import SysUserController from './Controller/SysUserController.js'
+import TeacherController from './Controller/TeacherController.js'
+import TeacherTransStatsController from './Controller/TeacherTransStatsController.js'
+
+export {
+  SystemController,
+  SysDataPermController,
+  DictionaryController,
+  SysDeptController,
+  SysUserController,
+  TeacherController,
+  TeacherTransStatsController
+}

orange-admin-web/src/assets/style/base.scss

@@ -0,0 +1,585 @@
+@import "element-color.scss";
+@import "transition.scss";
+
+html, body {
+  padding: 0;
+  margin: 0;
+  font-size: 14px;
+  font-family: "Helvetica Neue",Helvetica,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","微软雅黑",Arial,sans-serif;
+  background-color: rgb(228,240,255);
+}
+
+*,
+*:before,
+*:after {
+  box-sizing: border-box;
+}
+
+$header-height: 60px;
+
+// 过滤组件长度
+$filter-item-width: 250px;
+// 范围选择过滤组件长度
+$filter-item-range-width: 400px;
+// 左侧过滤树组件每一项高度
+$tree-node-height: 40px;
+// 高级管理表单标题高度
+$advanced-title-height: 50px;
+$border-color: rgb(216, 220, 229);
+$menuHover: rgba(255,255,255,0.3);
+$menu-background-color: transparent;
+$tabs-header-margin-bottom: 25px;
+$tab-header-background-color: #EBEEF5;
+$image-item-width: 65px;
+$box-padding-size: 25px;
+
+/**
+ * 弹窗样式，封装的layer的弹窗
+ **/
+body .layer-dialog .layui-layer-title{
+  border-radius: 4px 4px 0px 0px;
+  border:1px solid #01000000;
+}
+
+body .layer-dialog .layui-layer-setwin {color: #ffffff}
+
+body .layer-dialog {
+  border-radius: 4px;
+  border:1px solid #01000000;
+}
+
+body .layer-dialog .layui-layer-content {
+  padding: $box-padding-size;
+}
+
+
+.demo-project {
+  .el-main {
+    padding: 0px;
+  }
+  .flex-box {
+    flex-wrap: wrap;
+  }
+  .scrollbar_dropdown__wrap {
+    overflow-x: hidden;
+  }
+
+  .icon-btn.el-button {
+    font-size: 18px;
+    padding: 5px 0px;
+  }
+
+  .default-padding-box {
+    padding: $box-padding-size;
+  }
+
+  .padding-no-top {
+    padding: 0px $box-padding-size $box-padding-size $box-padding-size;
+  }
+
+  .default-border {
+    border: 1px solid $border-color1;
+  }
+
+  .default-border-left {
+    border-left: 1px solid $border-color1;
+  }
+
+  .default-border-right {
+    border-right: 1px solid $border-color1;
+  }
+
+  .default-border-top {
+    border-top: 1px solid $border-color1;
+  }
+
+  .default-border-bottom {
+    border-bottom: 1px solid $border-color1;
+  }
+
+  .page-close-box {
+    position: absolute;
+    background: #13ce66;
+    transform: rotate(45deg);
+    height: 60px;
+    width: 60px;
+    right: -30px;
+    top:-30px;
+    text-align: center;
+
+    .el-button {
+      transform: rotate(-45deg);
+      color: white;
+      margin-top: 30px;
+    }
+  }
+
+   /**
+   * 过滤组件样式
+   **/
+   .mask-box {
+    position: absolute;
+    width: 100%;
+    height: 100%;
+    background-color: rgba(0,0,0,0.5);
+    top: 0;
+    z-index: 10;
+  }
+  
+  .filter-box {
+    position: relative;
+    background-color: white;
+    padding: $box-padding-size $box-padding-size 0px $box-padding-size;
+    z-index: 20;
+  }
+
+  .advance-filter-box {
+    padding-bottom: 25px;
+  }
+  
+  .filter-item {
+    width: $filter-item-width;
+  }
+
+  .cascader-item {
+    width: 160px!important;
+  }
+  
+  .is-range, .is-search {
+    width: $filter-item-range-width;
+  }
+
+  .table-operation-box {
+    align-self: flex-end;
+    margin-bottom: 10px;
+    overflow: hidden;
+  }
+
+  /**
+   * 左侧树状组件的样式，用户高级管理表单以及用户管理表单
+   **/
+  .advanced-left-box {
+    border-right: 1px solid $border-color;
+    .el-tree-node__content {
+      height: $tree-node-height;
+    }
+
+    .tree-node-item {
+      height: $tree-node-height;
+      line-height: $tree-node-height;
+      width: 100%;
+
+      .tree-node-menu {
+        display: none;
+        float: right;
+        padding-right: 10px;
+        color: red!important;
+      }
+
+      &:hover .tree-node-menu {
+        display: block;
+      }
+    }
+
+    .el-tree-node .el-button+.el-button {
+      margin-left: 5px;
+    }
+  }
+  /**
+   * form表单输入组件宽度
+   **/
+  .full-width-input {
+    .el-select {
+      width: 100%;
+    }
+    
+    .el-input {
+      width: 100%;
+    }
+    
+    .el-cascader {
+      width: 100%;
+    }
+  
+    .el-date-editor {
+      width: 100%;
+    }
+  
+    .el-input-number {
+      width: 100%;
+    }
+  }
+  /**
+   * 左侧菜单样式
+   **/
+  .sidebar-bg {
+    background: linear-gradient(#FC8051, #EB6265);
+  }
+  
+  .sidebar-title {
+    height: 160px;
+    overflow: hidden;
+  }
+  
+  .sidebar-title-text {
+    width: 100%;
+    font-size: 18px;
+    color: #fff;
+    text-align: center;
+    margin: 0px;
+  }
+  .el-menu {
+    background-color: $menu-background-color;
+    border-right-width: 0px;
+  }
+
+  .menu-wrapper {
+    .el-menu {
+      background: linear-gradient(#FC8051, #EB6265);
+    }
+
+    .el-menu-item {
+      color: white;
+      i {
+        color: white;
+      }
+      &:hover {
+        background-color: rgba(255,255,255,0.3)!important;
+      }
+    }
+
+    .el-submenu {
+      .el-menu {
+        background: none;
+      }
+    }
+  }
+  
+  .el-submenu__title i {
+    color: white;
+  }
+
+  .el-menu--collapse {
+    .el-submenu__icon-arrow {
+      display: none;
+    }
+  }
+  
+  .nest-menu .el-submenu>.el-submenu__title, .el-submenu .el-menu-item {
+    min-width: 180px!important;
+    background: $menu-background-color;
+  }
+  
+  .el-menu-item.is-active {
+    border-left: 3px solid #47ba5a;
+    background-color: rgba(255,255,255,0.3)!important;
+  }
+  
+  .el-submenu__title {
+    background-color: $menu-background-color!important;
+  }
+
+  .el-menu {
+    border-right-width: 0px;
+  }
+  
+  .menu-collapse-btn {
+    padding: 0px;
+    width: 15px;
+    border-radius: 2px;
+    border: none;
+    height: 100px;
+    background-color: $--color-primary-light-5;
+    position: fixed;
+    top: 20%;
+    z-index: -1;
+    color: white;
+
+    &:hover {
+      background-color: $--color-primary-light-7;
+    }
+    .chart-border {
+      border: 1px solid #EBEEF5;
+    }
+  }
+  
+  /**
+   * 多tab页表单，tab样式
+   **/
+  .el-tabs__header {
+    margin: 0 0 20px;
+  }
+  /**
+   * 表格表头背景色
+   **/
+  .table-header-gray, .has-gutter .gutter {
+    background-color: $tab-header-background-color;
+  }
+  
+  /**
+   * 图片上传以及显示样式
+   **/
+  .upload-image-item {
+    font-size: 28px;
+    color: #8c939d;
+    width: $image-item-width;
+    height: $image-item-width;
+    text-align: center;
+    display: block;
+
+    .el-upload i {
+      line-height: $image-item-width;
+    }
+  }
+  
+  .upload-image-multi {
+    display: inline;
+  }
+  
+  .upload-image-item .el-upload {
+    border: 1px dashed #d9d9d9;
+    border-radius: 6px;
+    cursor: pointer;
+    position: relative;
+    overflow: hidden;
+  }
+  .upload-image-item .el-upload:hover {
+    border-color: #409eff;
+  }
+  
+  .upload-image-show {
+    width: $image-item-width;
+    height: $image-item-width;
+    display: inline;
+  }
+  
+  .table-cell-image {
+    width: $image-item-width;
+    height: $image-item-width;
+    line-height: $image-item-width;
+    text-align: center;
+    font-size: $image-item-width;
+    color: #606266;
+    margin: 0px 5px;
+  }
+  
+  .upload-image-list .el-upload-list__item {
+    width: $image-item-width;
+    height: $image-item-width;
+    line-height: $image-item-width;
+  }
+  
+  .upload-image-item .el-upload-list--picture-card .el-upload-list__item {
+    width: $image-item-width;
+    height: $image-item-width;
+  }
+  
+  .upload-image-item .el-upload.el-upload--text {
+    width: $image-item-width;
+    height: $image-item-width;
+  }
+  
+  .upload-image-item .el-upload--picture-card {
+    width: $image-item-width;
+    height: $image-item-width;
+    line-height: $image-item-width;
+  }
+  /**
+   *
+   **/
+  $header-menu-height: 32px;
+
+  .sidebar {
+    height: 100%;
+    background-color: #304156;
+    overflow: hidden;
+  }
+
+  .header {
+    height: $header-height;
+    background-color: white;
+  }
+
+  .header-menu {
+    float: right;
+    height: $header-menu-height;
+    line-height: $header-menu-height;
+    margin-top: ($header-height - $header-menu-height) / 2;
+  }
+
+  .header-img {
+    width: $header-menu-height;
+    height: $header-menu-height;
+    border-radius: 50%;
+    margin-left: 10px;
+    float: right;
+  }
+
+  .user-dropdown {
+    color: $sub-text-color;
+    cursor: pointer;
+    font-size: 12px;
+  }
+  .user-dropdown-item {
+    font-size: 12px;
+    color: $main-text-color;
+  }
+
+  .hamburger-container {
+    line-height: 70px;
+    height: $header-height;
+    float: left;
+    padding: 0 10px;
+  }
+
+  .el-submenu__title {
+    background: #00000000;
+  }
+
+  ::-webkit-scrollbar {
+    width: 7px;
+    height: 7px;
+    background: none;
+  }
+
+  ::-webkit-scrollbar-thumb {
+    background: #DDDEE0;
+    border-radius: 7px;
+  }
+
+  ::-webkit-scrollbar-thumb:hover {
+    background: #A8A8A8;
+  }
+  .tree-select {
+    .el-tree-node__content {
+      height: 34px;
+      line-height: 34px;
+      padding-right: 10px;
+    }
+  }
+
+  .tree-select.single-select-tree {
+    .el-tree-node.is-current > .el-tree-node__content > .el-tree-node__label {
+      color: $--color-primary;
+      font-weight: 700;
+    }
+  }
+
+  .cell {
+    .operation-cell {
+      color: #006CDC;
+      cursor: pointer;
+      text-decoration: underline;
+    }
+  }
+  
+  .single-select-tree {
+    min-width: 200px!important;
+  }
+
+  .base-card-header {
+    display: flex;
+    align-items: center;
+    height: 50px;
+    line-height: 50px;
+  }
+
+  .base-card-operation {
+    flex-grow: 1;
+    display: flex;
+    justify-content: flex-end;
+  }
+
+  .el-card__header {
+    padding: 0px 15px;
+  }
+  .el-card__body {
+    padding: 15px;
+  }
+
+  .custom-cascader {
+    width: 200px!important;
+  }
+
+  .no-scroll {
+    overflow: hidden;
+  }
+
+  .custom-scroll .el-scrollbar__view {
+    overflow-x: hidden!important;
+  }
+
+  .upload-img-del {
+    position: absolute;
+    height: 20px;
+    width: 20px;
+    line-height: 20px;
+    font-size: 16px;
+    top: 2px;
+    right: 2px;
+    color: #C0C4CC;
+  }
+
+  .upload-img-del:hover {
+    color: #EF5E1C;
+  }
+
+  .input-label {
+    display: inline-block;
+    height: 29px;
+    line-height: 28px;
+  }
+
+  .input-progress {
+    height: 29px;
+    display: flex;
+    align-items: center;
+  }
+
+  .input-item {
+    width: 100%!important;
+  }
+
+  .table-header-gray {
+    background: rgba(237,237,237,1);
+  }
+
+  .card-header {
+    display: flex;
+    justify-content: space-between;
+    padding: 10px 0px;
+    line-height: 28px;
+  }
+}
+
+.ml20 {
+  margin-left: 20px;
+}
+
+.mr20 {
+  margin-right: 20px;
+}
+
+.mt20 {
+  margin-top: 20px;
+}
+
+.mb20 {
+  margin-bottom: 20px;
+}
+
+.pl20 {
+  padding-left: 20px;
+}
+
+.pr20 {
+  padding-right: 20px;
+}
+
+.pt20 {
+  padding-top: 20px;
+}
+
+.pb20 {
+  padding-bottom: 20px;
+}

orange-admin-web/src/assets/style/element-color.scss

@@ -0,0 +1,25 @@
+$main-text-color: #303133;
+$normal-text-color: #606266;
+$sub-text-color: #909399;
+$placeholder-text-color: #C0C4CC;
+
+$border-color1: #DCDFE6;
+$border-color2: #E4E7ED;
+$border-color3: #EBEEF5;
+$border-color4: #F2F6FC;
+
+$success-color: #67C23A;
+$warning-color: #E6A23C;
+$danger-color: #F56C6C;
+$info-color: #909399;
+$--color-white: white;
+$--color-primary: #EF5E1C !default;
+$--color-primary-light-1: mix($--color-white, $--color-primary, 10%) !default; /* 53a8ff */
+$--color-primary-light-2: mix($--color-white, $--color-primary, 20%) !default; /* 66b1ff */
+$--color-primary-light-3: mix($--color-white, $--color-primary, 30%) !default; /* 79bbff */
+$--color-primary-light-4: mix($--color-white, $--color-primary, 40%) !default; /* 8cc5ff */
+$--color-primary-light-5: mix($--color-white, $--color-primary, 50%) !default; /* a0cfff */
+$--color-primary-light-6: mix($--color-white, $--color-primary, 60%) !default; /* b3d8ff */
+$--color-primary-light-7: mix($--color-white, $--color-primary, 70%) !default; /* c6e2ff */
+$--color-primary-light-8: mix($--color-white, $--color-primary, 80%) !default; /* d9ecff */
+$--color-primary-light-9: mix($--color-white, $--color-primary, 90%) !default; /* ecf5ff */

orange-admin-web/src/assets/style/form-style.scss

@@ -0,0 +1,112 @@
+.form-advanced-manager {
+  .advance-filter-box {
+    position: absolute;
+    top: 100%;
+    left: 0px;
+    background-color: white;
+    width: 100%;
+    padding: 10px $box-padding-size 15px $box-padding-size;
+  }
+  
+  .title-box {
+    border-bottom: 1px solid $border-color;
+    padding: 0px 20px;
+    z-index: 20;
+    background-color: white;
+    height: $advanced-title-height;
+
+    .title {
+      line-height: $advanced-title-height;
+      color: #606266;
+    }
+
+    .menu-box {
+      position: absolute;
+      top: 0px;
+      right: 10px;
+      height: $advanced-title-height;
+
+      .el-row {
+        margin: 10px 0px;
+        height: $advanced-title-height - 20;
+      }
+    }
+  }
+
+  .advanced-right-box {
+    padding: 0px;
+    .gutter-box {
+      margin: (($advanced-title-height - 16)/2) 0px;
+      height: 16px;
+      width: 3px;
+      background-color: $--color-primary;
+      float: left
+    }
+  }
+}
+
+.form-dict-manager {
+  .dict-title {
+    height: 50px;
+    line-height: 50px;
+    color: $main-text-color;
+    border-bottom: 1px solid $border-color1;
+    font-size: 14px;
+
+    span {
+      margin-left: 20px;
+    }
+  }
+
+  .dict-item {
+    width: 100%;
+    height: 40px;
+    line-height: 40px;
+    color: #606266;
+    cursor: pointer;
+    padding-left: 20px;
+
+    &:hover {
+      background-color: $--color-primary-light-9;
+    }
+  }
+
+  .active-dict-item {
+    border-left: 3px solid $--color-primary;
+    color: $--color-primary;
+    background-color: $--color-primary-light-9 !important;
+  }
+  
+  .el-scrollbar__bar.is-horizontal {
+    display: none!important;
+  }
+}
+
+
+.form-table-manager {
+  .advance-filter-box {
+    position: absolute;
+    padding: 20px;
+    top: 100%;
+    left: 0px;
+    background-color: white;
+    width: 100%;
+    padding: 10px $box-padding-size 15px $box-padding-size;
+  }
+}
+
+.form-table-multi-select {
+  //
+}
+
+.form-config {
+  padding: $box-padding-size;
+}
+
+.form-multi-fragment {
+  //
+}
+
+.form-single-fragment {
+  //
+}

orange-admin-web/src/assets/style/index.scss

@@ -0,0 +1,3 @@
+@import "../theme/index.css";
+@import "base.scss";
+@import "form-style.scss";

orange-admin-web/src/assets/style/transition.scss

@@ -0,0 +1,31 @@
+/*fade*/
+.fade-enter-active,
+.fade-leave-active {
+  transition: opacity 0.28s;
+}
+
+.fade-enter,
+.fade-leave-active {
+  opacity: 0;
+}
+
+/*fade*/
+.breadcrumb-enter-active,
+.breadcrumb-leave-active {
+  transition: all .5s;
+}
+
+.breadcrumb-enter,
+.breadcrumb-leave-active {
+  opacity: 0;
+  transform: translateX(20px);
+}
+
+.breadcrumb-move {
+  transition: all .5s;
+}
+
+.breadcrumb-leave-active {
+  position: absolute;
+}
+

orange-admin-web/src/components/DateRange/index.vue

@@ -0,0 +1,304 @@
+<template>
+  <div class="date-range">
+    <!--<year-range-panel />-->
+    <el-select v-model="dateType" :size="size" style="max-width: 100px; min-width: 100px; margin-right: 10px;" v-if="!hideTypeOnlyOne || validTypeList.length > 1">
+      <el-option v-for="type in validTypeList" :key="type.value" :value="type.value" :label="type.label" />
+    </el-select>
+    <el-date-picker style="flex-grow: 1;" v-model="currentDates" :size="size" :placeholder="placeholder" :type="innerDateType"
+      :disabled="disabled" :format="innerDateFormat" :readonly="readonly" :editable="editable"
+      :clearable="clearable" :start-placeholder="startPlaceholder" :end-placeholder="endPlaceholder"
+      :align="align" :range-separator="rangeSeparator" :value-format="valueFormat"
+      :prefix-icon="prefixIcon" :clear-icon="clearIcon" @change="onValueChange"></el-date-picker>
+  </div>
+</template>
+
+<script>
+import { formatDate, parseDate } from 'element-ui/src/utils/date-util';
+
+const allTypeList = [{
+  value: 'day',
+  label: '自然日'
+}, {
+  value: 'month',
+  label: '自然月'
+}, {
+  value: 'year',
+  label: '自然年'
+}];
+
+export default {
+  name: 'DateRange',
+  props: {
+    /**
+     * 绑定的数据
+     */
+    value: {
+      type: [Array],
+      default: () => {
+        return []
+      }
+    },
+    /**
+     * 默认显示的数据选择方式，如果不存在与allowTypes中则显示allowTypes中的第一个
+     */
+    defaultDateType: {
+      type: String,
+      default: 'day'
+    },
+    /**
+     * 组件大小（medium / small / mini）
+     */
+    size: {
+      type: String
+    },
+    /**
+     * 数据选择方式只有一个的时候是否隐藏数据选择方式下拉
+     */
+    hideTypeOnlyOne: {
+      type: Boolean,
+      default: true
+    },
+    /**
+     * 允许的数据选择方式（day, month, year）
+     * 默认值['day', 'month', 'year']
+     */
+    allowTypes: {
+      type: Array,
+      default: () => {
+        return allTypeList.map((item) => {
+          return item.value;
+        });
+      }
+    },
+    /**
+     * 是否范围选择
+     */
+    isRange: {
+      type: Boolean,
+      default: true
+    },
+    /**
+     * 输出字符串的format
+     */
+    outputFormat: {
+      type: String,
+      default: 'yyyy-MM-dd HH:mm:ss'
+    },
+    /**
+     * 非范围选择时的占位内容
+     */
+    placeholder: String,
+    /**
+     * 范围选择时开始日期的占位内容
+     */
+    startPlaceholder: String,
+    /**
+     * 范围选择时结束日期的占位内容
+     */
+    endPlaceholder: String,
+    /**
+     * 完全只读
+     */
+    readonly: Boolean,
+    /**
+     * 禁用
+     */
+    disabled: Boolean,
+    /**
+     * 文本框可输入
+     */
+    editable: {
+      type: Boolean,
+      default: true
+    },
+    /**
+     * 是否显示清除按钮
+     */
+    clearable: {
+      type: Boolean,
+      default: true
+    },
+    /**
+     * 对齐方式（left, center, right）
+     */
+    align: {
+      type: String,
+      default: 'left'
+    },
+    /**
+     * 选择范围时的分隔符
+     */
+    rangeSeparator: {
+      type: String,
+      default: '-'
+    },
+    /**
+     * 可选，绑定值的格式。不指定则绑定值为 Date 对象
+     */
+    valueFormat: {
+      type: String,
+      default: 'yyyy-MM-dd'
+    },
+    /**
+     * 自定义头部图标的类名
+     */
+    prefixIcon: {
+      type: String,
+      default: 'el-icon-date'
+    },
+    /**
+     * 自定义清空图标的类名
+     */
+    clearIcon: {
+      type: String,
+      default: 'el-icon-circle-close'
+    }
+  },
+  data () {
+    return {
+      dateType: this.defaultDateType,
+      currentDates: undefined
+    }
+  },
+  methods: {
+    onValueChange (values) {
+      this.$nextTick(() => {
+        this.emitChange();
+      });
+    },
+    emitChange () {
+      let outputDate = [];
+      if (this.currentDates != null) {
+        if (!this.isRange) {
+          outputDate[0] = new Date(this.currentDates);
+          outputDate[1] = new Date(this.currentDates);
+        } else {
+          if (Array.isArray(this.currentDates) && this.currentDates.length === 2) {
+            outputDate[0] = new Date(this.currentDates[0]);
+            outputDate[1] = new Date(this.currentDates[1]);
+          }
+        }
+
+        if (outputDate[0] != null && outputDate[1] != null) {
+          outputDate[0].setHours(0, 0, 0, 0);
+          outputDate[1].setHours(0, 0, 0, 0);
+          switch (this.dateType) {
+            case 'day':
+              outputDate[1].setDate(outputDate[1].getDate() + 1);
+              break;
+            case 'month':
+              outputDate[1].setDate(1);
+              outputDate[0].setDate(1);
+              outputDate[1].setMonth(outputDate[1].getMonth() + 1);
+              break;
+            case 'year':
+              outputDate[1].setMonth(0);
+              outputDate[1].setDate(1);
+              outputDate[0].setMonth(0);
+              outputDate[0].setDate(1);
+              outputDate[1].setFullYear(outputDate[1].getFullYear() + 1);
+              break;
+          }
+          outputDate[1] = new Date(outputDate[1].getTime() - 1);
+
+          outputDate[0] = formatDate(outputDate[0], this.outputFormat);
+          outputDate[1] = formatDate(outputDate[1], this.outputFormat);
+        }
+      }
+      this.$emit('input', outputDate);
+      this.$emit('change', outputDate);
+    },
+    getCurrentStatsDateType () {
+      return this.dateType;
+    }
+  },
+  computed: {
+    validTypeList () {
+      return allTypeList.filter((item) => {
+        return this.allowTypes.indexOf(item.value) !== -1;
+      });
+    },
+    /**
+     * el-date-picker使用的type
+     */
+    innerDateType () {
+      switch (this.dateType) {
+        case 'day': return this.isRange ? 'daterange' : 'date';
+        case 'month': return this.isRange ? 'monthrange' : 'month';
+        case 'year': return this.isRange ? 'monthrange' : 'year';
+        default: return this.isRange ? 'daterange' : 'date';
+      }
+    },
+    /**
+     * el-date-picker使用的format
+     */
+    innerDateFormat () {
+      switch (this.dateType) {
+        case 'day': return 'yyyy-MM-dd';
+        case 'month': return 'yyyy-MM';
+        case 'year': return 'yyyy';
+        default: return 'yyyy-MM-dd';
+      }
+    }
+  },
+  watch: {
+    value: {
+      handler: function (newValue, oldValue) {
+        if (newValue == null || newValue.length < 2) {
+          this.currentDates = this.isRange ? [] : undefined;
+        } else {
+          if (this.currentDates == null) this.currentDates = [];
+          if (this.isRange) {
+            this.currentDates = [
+              parseDate(newValue[0], this.valueFormat),
+              parseDate(newValue[1], this.valueFormat)
+            ];
+          } else {
+            this.currentDates = parseDate(newValue[0], this.valueFormat);
+          }
+        }
+      },
+      immediate: true,
+      deep: true
+    },
+    dateType: {
+      handler: function (newValue, oldValue) {
+        if (this.allowTypes.indexOf(this.dateType) === -1) {
+          this.dateType = this.allowTypes[0] || 'day';
+        }
+        this.emitChange();
+      },
+      immediate: true
+    },
+    defaultDateType: {
+      handler: function (newValue, oldValue) {
+        if (this.allowTypes.indexOf(newValue) !== -1) {
+          this.dateType = newValue;
+        } else {
+          this.dateType = this.allowTypes[0];
+        }
+      }
+    },
+    isRange: {
+      handler: function (newValue, oldValue) {
+        let temp;
+        if (newValue) {
+          temp = [this.currentDates, this.currentDates];
+        } else {
+          temp = this.currentDates[0];
+        }
+
+        this.currentDates = temp;
+      }
+    }
+  }
+}
+</script>
+
+<style scoped>
+  .date-range {
+    display: flex;
+    justify-content: start;
+  }
+
+</style>

orange-admin-web/src/components/Dialog/index.js

@@ -0,0 +1,77 @@
+import $ from 'jquery';
+import Vue from 'vue';
+import router from '@/router';
+import store from '@/store';
+
+window.jQuery = $;
+const layer = require('layui-layer');
+
+class Dialog {
+  /**
+   * 关闭弹窗
+   * @param {*} index 要关闭的弹窗的index
+   */
+  static close (index) {
+    layer.close(index);
+  }
+  /**
+   * 关闭所有弹窗
+   */
+  static closeAll () {
+    layer.closeAll();
+  }
+  /**
+   * 打开弹窗
+   * @param {*} title 弹窗标题
+   * @param {*} component 弹窗内容的组件
+   * @param {*} options 弹窗设置（详情请见layui官网）
+   * @param {*} params 弹窗组件参数
+   */
+  static show (title, component, options, params) {
+    return new Promise((resolve, reject) => {
+      let layerOptions = {
+        title: title,
+        type: 1,
+        skin: 'layer-dialog',
+        resize: false,
+        offset: 'auto',
+        zIndex: 1000,
+        index: 0,
+        contentDom: null
+      };
+
+      layerOptions = {...layerOptions, ...options};
+      layerOptions.end = () => {
+        if (layerOptions.contentDom) document.body.removeChild(layerOptions.contentDom);
+      }
+
+      let observer = {
+        cancel: function (isSuccess = false) {
+          layer.close(this.index);
+          if (isSuccess) {
+            resolve();
+          } else {
+            reject();
+          }
+        },
+        index: -1
+      }
+      layerOptions.cancel = () => {
+        reject();
+      }
+      let dom = document.createElement('div');
+      document.body.appendChild(dom);
+      let Content = Vue.extend(component);
+      let vueObj = new Content({router: router, store: store, propsData: params});
+      vueObj.observer = observer;
+      vueObj.$mount(dom);
+      layerOptions.contentDom = vueObj.$el;
+      layerOptions.content = $(layerOptions.contentDom);
+      observer.index = layer.open(layerOptions);
+    });
+  }
+}
+
+Vue.prototype.$dialog = Dialog;
+
+export default Dialog;

orange-admin-web/src/components/FilterBox/index.vue

@@ -0,0 +1,134 @@
+<template>
+  <el-row class="flex-box" type="flex" :justify="rowJustify">
+    <slot />
+    <div v-for="item in tempDomCount" :key="item" :style="{width: tempDomWidth}" />
+    <el-row type="flex" :justify="operatorPosition" :style="getMenuBoxStyle">
+      <slot name="operator" />
+    </el-row>
+  </el-row>
+</template>
+
+<script>
+import $ from 'jquery';
+
+export default {
+  name: 'FilterBox',
+  props: {
+    /**
+     * 每一个过滤项宽度（包含标题和输入框宽度总和）
+     */
+    itemWidth: {
+      type: Number,
+      required: true
+    },
+    /**
+     * 每一项下间距
+     */
+    marginBottom: {
+      type: String,
+      default: '18px'
+    },
+    /**
+     * 按钮块最小宽度默认350，当每一行剩余空间大于此值，按钮块将不会折行
+     */
+    minMenuWidth: {
+      type: Number,
+      default: 350
+    },
+    /**
+     * 按钮位置，默认为end，可选值为start/end/center/space-around/space-between
+     */
+    operatorPosition: {
+      type: String,
+      default: 'end'
+    }
+  },
+  data () {
+    return {
+      tempDomCount: 0,
+      tempDomWidth: undefined,
+      operatorWidth: undefined,
+      oldFilterItemCount: 0,
+      oldHasOperator: false,
+      oldWidth: 0,
+      rowJustify: 'space-between'
+    }
+  },
+  computed: {
+    getMenuBoxStyle () {
+      return {
+        'width': this.operatorWidth,
+        'margin-bottom': this.marginBottom,
+        'flex-grow': this.operatorWidth ? undefined : '1'
+      }
+    }
+  },
+  methods: {
+    onUpdate () {
+      setTimeout(() => {
+        let filterItemCount = Array.isArray(this.$slots.default) ? this.$slots.default.filter(item => item.context).length : 0;
+        let hasOperator = Array.isArray(this.$slots.operator) && this.$slots.operator.length > 0;
+        let width = $(this.$el).width();
+        if (filterItemCount === this.oldFilterItemCount && hasOperator === this.oldHasOperator && width === this.oldWidth) {
+          return;
+        }
+        let lineCount = this.itemWidth > 0 ? parseInt(width / this.itemWidth) : 1;
+        lineCount = Math.max(1, lineCount);
+        let residueCount = filterItemCount % lineCount;
+
+        this.tempDomCount = 0;
+        this.tempDomWidth = undefined;
+        this.rowJustify = 'space-between';
+        let tempCount = residueCount === 0 ? 0 : (lineCount - residueCount);
+        if (hasOperator) {
+          let residueWidth = width - ((lineCount - residueCount) * this.itemWidth) - 20;
+          // 判断剩余的空间是否够放下操作按钮
+          if (residueWidth >= this.minMenuWidth && residueCount === 0) {
+            this.rowJustify = 'start';
+            this.operatorWidth = undefined;
+          } else {
+            // 剩余空位数大于1，需要占位dom
+            if (tempCount >= 1) {
+              if (residueWidth >= this.minMenuWidth) {
+                this.tempDomCount = tempCount - 1;
+                this.tempDomWidth = this.tempDomCount > 0 ? (20 / this.tempDomCount) + 'px' : undefined;
+                this.operatorWidth = this.tempDomCount > 0 ? (((tempCount * this.itemWidth) - 20) + 'px') : (this.itemWidth + 'px');
+              } else {
+                this.tempDomCount = tempCount;
+                this.tempDomWidth = (residueWidth / this.tempDomCount) + 'px';
+                this.operatorWidth = '100%';
+              }
+            } else {
+              this.operatorWidth = '100%';
+            }
+          }
+        } else {
+          this.tempDomCount = tempCount;
+          this.tempDomWidth = this.itemWidth + 'px';
+        }
+
+        this.oldFilterItemCount = filterItemCount;
+        this.oldHasOperator = hasOperator;
+        this.oldWidth = width;
+      });
+    }
+  },
+  beforeUpdate () {
+    this.onUpdate();
+  },
+  mounted () {
+    setTimeout(() => {
+      this.onUpdate();
+    });
+  },
+  created () {
+    window.addEventListener('resize', this.onUpdate);
+  },
+  beforeDestroy () {
+    window.removeEventListener('resize', this.onUpdate);
+  }
+}
+</script>
+
+<style>
+</style>

orange-admin-web/src/components/Hamburger/index.vue

@@ -0,0 +1,44 @@
+<template>
+  <div>
+    <svg t="1492500959545" @click="toggleClick" class="hamburger" :class="{'is-active':isActive}" style="" viewBox="0 0 1024 1024"
+      version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1691" xmlns:xlink="http://www.w3.org/1999/xlink" width="64" height="64">
+      <path d="M966.8023 568.849776 57.196677 568.849776c-31.397081 0-56.850799-25.452695-56.850799-56.850799l0 0c0-31.397081 25.452695-56.849776 56.850799-56.849776l909.605623 0c31.397081 0 56.849776 25.452695 56.849776 56.849776l0 0C1023.653099 543.397081 998.200404 568.849776 966.8023 568.849776z"
+        p-id="1692"></path>
+      <path d="M966.8023 881.527125 57.196677 881.527125c-31.397081 0-56.850799-25.452695-56.850799-56.849776l0 0c0-31.397081 25.452695-56.849776 56.850799-56.849776l909.605623 0c31.397081 0 56.849776 25.452695 56.849776 56.849776l0 0C1023.653099 856.07443 998.200404 881.527125 966.8023 881.527125z"
+        p-id="1693"></path>
+      <path d="M966.8023 256.17345 57.196677 256.17345c-31.397081 0-56.850799-25.452695-56.850799-56.849776l0 0c0-31.397081 25.452695-56.850799 56.850799-56.850799l909.605623 0c31.397081 0 56.849776 25.452695 56.849776 56.850799l0 0C1023.653099 230.720755 998.200404 256.17345 966.8023 256.17345z"
+        p-id="1694"></path>
+    </svg>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'hamburger',
+  props: {
+    isActive: {
+      type: Boolean,
+      default: false
+    },
+    toggleClick: {
+      type: Function,
+      default: null
+    }
+  }
+}
+</script>
+
+<style scoped>
+.hamburger {
+  display: inline-block;
+  cursor: pointer;
+  width: 20px;
+  height: 20px;
+  transform: rotate(90deg);
+  transform-origin: 50% 50%;
+}
+
+.hamburger.is-active {
+  transform: rotate(0deg);
+}
+</style>

orange-admin-web/src/components/IconSelect/icon.json

@@ -0,0 +1,280 @@
+[
+  "el-icon-delete-solid",
+  "el-icon-delete",
+  "el-icon-s-tools",
+  "el-icon-setting",
+  "el-icon-user-solid",
+  "el-icon-user",
+  "el-icon-phone",
+  "el-icon-phone-outline",
+  "el-icon-more",
+  "el-icon-more-outline",
+  "el-icon-star-on",
+  "el-icon-star-off",
+  "el-icon-s-goods",
+  "el-icon-goods",
+  "el-icon-warning",
+  "el-icon-warning-outline",
+  "el-icon-question",
+  "el-icon-info",
+  "el-icon-remove",
+  "el-icon-circle-plus",
+  "el-icon-success",
+  "el-icon-error",
+  "el-icon-zoom-in",
+  "el-icon-zoom-out",
+  "el-icon-remove-outline",
+  "el-icon-circle-plus-outline",
+  "el-icon-circle-check",
+  "el-icon-circle-close",
+  "el-icon-s-help",
+  "el-icon-help",
+  "el-icon-minus",
+  "el-icon-plus",
+  "el-icon-check",
+  "el-icon-close",
+  "el-icon-picture",
+  "el-icon-picture-outline",
+  "el-icon-picture-outline-round",
+  "el-icon-upload",
+  "el-icon-upload2",
+  "el-icon-download",
+  "el-icon-camera-solid",
+  "el-icon-camera",
+  "el-icon-video-camera-solid",
+  "el-icon-video-camera",
+  "el-icon-message-solid",
+  "el-icon-bell",
+  "el-icon-s-cooperation",
+  "el-icon-s-order",
+  "el-icon-s-platform",
+  "el-icon-s-fold",
+  "el-icon-s-unfold",
+  "el-icon-s-operation",
+  "el-icon-s-promotion",
+  "el-icon-s-home",
+  "el-icon-s-release",
+  "el-icon-s-ticket",
+  "el-icon-s-management",
+  "el-icon-s-open",
+  "el-icon-s-shop",
+  "el-icon-s-marketing",
+  "el-icon-s-flag",
+  "el-icon-s-comment",
+  "el-icon-s-finance",
+  "el-icon-s-claim",
+  "el-icon-s-custom",
+  "el-icon-s-opportunity",
+  "el-icon-s-data",
+  "el-icon-s-check",
+  "el-icon-s-grid",
+  "el-icon-menu",
+  "el-icon-share",
+  "el-icon-d-caret",
+  "el-icon-caret-left",
+  "el-icon-caret-right",
+  "el-icon-caret-bottom",
+  "el-icon-caret-top",
+  "el-icon-bottom-left",
+  "el-icon-bottom-right",
+  "el-icon-back",
+  "el-icon-right",
+  "el-icon-bottom",
+  "el-icon-top",
+  "el-icon-top-left",
+  "el-icon-top-right",
+  "el-icon-arrow-left",
+  "el-icon-arrow-right",
+  "el-icon-arrow-down",
+  "el-icon-arrow-up",
+  "el-icon-d-arrow-left",
+  "el-icon-d-arrow-right",
+  "el-icon-video-pause",
+  "el-icon-video-play",
+  "el-icon-refresh",
+  "el-icon-refresh-right",
+  "el-icon-refresh-left",
+  "el-icon-finished",
+  "el-icon-sort",
+  "el-icon-sort-up",
+  "el-icon-sort-down",
+  "el-icon-rank",
+  "el-icon-loading",
+  "el-icon-view",
+  "el-icon-c-scale-to-original",
+  "el-icon-date",
+  "el-icon-edit",
+  "el-icon-edit-outline",
+  "el-icon-folder",
+  "el-icon-folder-opened",
+  "el-icon-folder-add",
+  "el-icon-folder-remove",
+  "el-icon-folder-delete",
+  "el-icon-folder-checked",
+  "el-icon-tickets",
+  "el-icon-document-remove",
+  "el-icon-document-delete",
+  "el-icon-document-copy",
+  "el-icon-document-checked",
+  "el-icon-document",
+  "el-icon-document-add",
+  "el-icon-printer",
+  "el-icon-paperclip",
+  "el-icon-takeaway-box",
+  "el-icon-search",
+  "el-icon-monitor",
+  "el-icon-attract",
+  "el-icon-mobile",
+  "el-icon-scissors",
+  "el-icon-umbrella",
+  "el-icon-headset",
+  "el-icon-brush",
+  "el-icon-mouse",
+  "el-icon-coordinate",
+  "el-icon-magic-stick",
+  "el-icon-reading",
+  "el-icon-data-line",
+  "el-icon-data-board",
+  "el-icon-pie-chart",
+  "el-icon-data-analysis",
+  "el-icon-collection-tag",
+  "el-icon-film",
+  "el-icon-suitcase",
+  "el-icon-suitcase-1",
+  "el-icon-receiving",
+  "el-icon-collection",
+  "el-icon-files",
+  "el-icon-notebook-1",
+  "el-icon-notebook-2",
+  "el-icon-toilet-paper",
+  "el-icon-office-building",
+  "el-icon-school",
+  "el-icon-table-lamp",
+  "el-icon-house",
+  "el-icon-no-smoking",
+  "el-icon-smoking",
+  "el-icon-shopping-cart-full",
+  "el-icon-shopping-cart-1",
+  "el-icon-shopping-cart-2",
+  "el-icon-shopping-bag-1",
+  "el-icon-shopping-bag-2",
+  "el-icon-sold-out",
+  "el-icon-sell",
+  "el-icon-present",
+  "el-icon-box",
+  "el-icon-bank-card",
+  "el-icon-money",
+  "el-icon-coin",
+  "el-icon-wallet",
+  "el-icon-discount",
+  "el-icon-price-tag",
+  "el-icon-news",
+  "el-icon-guide",
+  "el-icon-male",
+  "el-icon-female",
+  "el-icon-thumb",
+  "el-icon-cpu",
+  "el-icon-link",
+  "el-icon-connection",
+  "el-icon-open",
+  "el-icon-turn-off",
+  "el-icon-set-up",
+  "el-icon-chat-round",
+  "el-icon-chat-line-round",
+  "el-icon-chat-square",
+  "el-icon-chat-dot-round",
+  "el-icon-chat-dot-square",
+  "el-icon-chat-line-square",
+  "el-icon-message",
+  "el-icon-postcard",
+  "el-icon-position",
+  "el-icon-turn-off-microphone",
+  "el-icon-microphone",
+  "el-icon-close-notification",
+  "el-icon-bangzhu",
+  "el-icon-time",
+  "el-icon-odometer",
+  "el-icon-crop",
+  "el-icon-aim",
+  "el-icon-switch-button",
+  "el-icon-full-screen",
+  "el-icon-copy-document",
+  "el-icon-mic",
+  "el-icon-stopwatch",
+  "el-icon-medal-1",
+  "el-icon-medal",
+  "el-icon-trophy",
+  "el-icon-trophy-1",
+  "el-icon-first-aid-kit",
+  "el-icon-discover",
+  "el-icon-place",
+  "el-icon-location",
+  "el-icon-location-outline",
+  "el-icon-location-information",
+  "el-icon-add-location",
+  "el-icon-delete-location",
+  "el-icon-map-location",
+  "el-icon-alarm-clock",
+  "el-icon-timer",
+  "el-icon-watch-1",
+  "el-icon-watch",
+  "el-icon-lock",
+  "el-icon-unlock",
+  "el-icon-key",
+  "el-icon-service",
+  "el-icon-mobile-phone",
+  "el-icon-bicycle",
+  "el-icon-truck",
+  "el-icon-ship",
+  "el-icon-basketball",
+  "el-icon-football",
+  "el-icon-soccer",
+  "el-icon-baseball",
+  "el-icon-wind-power",
+  "el-icon-light-rain",
+  "el-icon-lightning",
+  "el-icon-heavy-rain",
+  "el-icon-sunrise",
+  "el-icon-sunrise-1",
+  "el-icon-sunset",
+  "el-icon-sunny",
+  "el-icon-cloudy",
+  "el-icon-partly-cloudy",
+  "el-icon-cloudy-and-sunny",
+  "el-icon-moon",
+  "el-icon-moon-night",
+  "el-icon-dish",
+  "el-icon-dish-1",
+  "el-icon-food",
+  "el-icon-chicken",
+  "el-icon-fork-spoon",
+  "el-icon-knife-fork",
+  "el-icon-burger",
+  "el-icon-tableware",
+  "el-icon-sugar",
+  "el-icon-dessert",
+  "el-icon-ice-cream",
+  "el-icon-hot-water",
+  "el-icon-water-cup",
+  "el-icon-coffee-cup",
+  "el-icon-cold-drink",
+  "el-icon-goblet",
+  "el-icon-goblet-full",
+  "el-icon-goblet-square",
+  "el-icon-goblet-square-full",
+  "el-icon-refrigerator",
+  "el-icon-grape",
+  "el-icon-watermelon",
+  "el-icon-cherry",
+  "el-icon-apple",
+  "el-icon-pear",
+  "el-icon-orange",
+  "el-icon-coffee",
+  "el-icon-ice-tea",
+  "el-icon-ice-drink",
+  "el-icon-milk-tea",
+  "el-icon-potato-strips",
+  "el-icon-lollipop",
+  "el-icon-ice-cream-square",
+  "el-icon-ice-cream-round"
+]

orange-admin-web/src/components/IconSelect/index.vue

@@ -0,0 +1,105 @@
+<template>
+  <el-popover width="510" v-model="showDropdown" @show="onDropdownShow">
+    <div class="icon-select-dropdown">
+      <el-row type="flex" style="flex-wrap: wrap">
+        <el-col :span="3" v-for="icon in getIconList" :key="icon" class="icon-item"
+          :class="{active: (value === icon)}" @click.native="onIconClick(icon)">
+          <i :class="icon" />
+        </el-col>
+      </el-row>
+      <el-row type="flex" justify="space-between">
+        <el-button type="text" @click="onClearClick" style="margin-left: 10px;">清空</el-button>
+        <el-pagination
+          :current-page.sync="currentPage"
+          :page-size="pageSize"
+          layout="prev, pager, next"
+          :total="getIconCount">
+        </el-pagination>
+      </el-row>
+    </div>
+    <div slot="reference" class="icon-select"
+      :style="{width: height + 'px', height: height + 'px', 'line-height': height + 'px', 'font-size': height * 0.5 + 'px'}">
+      <i :class="value" />
+    </div>
+  </el-popover>
+</template>
+
+<script>
+import iconList from './icon.json';
+
+export default {
+  props: {
+    /**
+     * 绑定字段
+     */
+    value: String,
+    /**
+     * 组件高度，单位px
+     */
+    height: {
+      type: Number,
+      default: 45
+    }
+  },
+  data () {
+    return {
+      showDropdown: false,
+      currentPage: 1,
+      pageSize: 32
+    }
+  },
+  methods: {
+    onIconClick (icon) {
+      this.$emit('input', icon);
+      this.showDropdown = false;
+    },
+    onClearClick () {
+      this.$emit('input');
+      this.showDropdown = false;
+    },
+    onDropdownShow () {
+      this.currentPage = 1
+      let pos = iconList.indexOf(this.value);
+      if (pos >= 0) {
+        this.currentPage += Math.floor(pos / this.pageSize);
+      }
+    }
+  },
+  computed: {
+    getIconCount () {
+      return iconList.length;
+    },
+    getIconList () {
+      let beginPos = (this.currentPage - 1) * this.pageSize;
+      let endPos = beginPos + this.pageSize;
+      return iconList.slice(beginPos, endPos);
+    }
+  }
+}
+</script>
+
+<style scoped>
+  .icon-select {
+    text-align: center;
+    color: #5F6266;
+    border: 1px solid #DCDFE6;
+    border-radius: 4px;
+    cursor: pointer;
+  }
+  .icon-item {
+    width: 40px;
+    height: 40px;
+    line-height: 40px;
+    text-align: center;
+    font-size: 20px;
+    color: #5F6266;
+    border-radius: 3px;
+    border: 1px solid #DCDFE6;
+    margin: 10px;
+    cursor: pointer;
+  }
+  .active {
+    color: #EF5E1C;
+  }
+
+</style>

orange-admin-web/src/components/InputNumberRange/index.vue

@@ -0,0 +1,226 @@
+<template>
+  <div class="el-input el-date-editor el-range-editor el-input__inner el-input-number-range"
+    :class="
+    [
+      inputSize ? 'el-range-editor--' + inputSize : '',
+      focused ? 'is-active' : '',
+      {
+        'is-disabled': inputDisabled,
+        'el-input--prefix': prefixIcon
+      }
+    ]"
+    @mouseenter="showClose = true"
+    @mouseleave="showClose = false">
+    <div class="el-input__icon el-range__icon" :class="prefixIcon">
+      <slot name="prepend"></slot>
+    </div>
+    <input
+      autocomplete="off"
+      :placeholder="startPlaceholder"
+      :value="userInput && userInput[0]"
+      :disabled="inputDisabled"
+      :readonly="readonly"
+      :name="name && name[0]"
+      @input="handleStartInput"
+      @change="handleStartChange"
+      @focus="focused = true"
+      @blur="focused = false"
+      class="el-range-input">
+    <slot name="range-separator">
+      <span class="el-range-separator">{{ rangeSeparator }}</span>
+    </slot>
+    <input
+      autocomplete="off"
+      :placeholder="endPlaceholder"
+      :value="userInput && userInput[1]"
+      :disabled="inputDisabled"
+      :readonly="readonly"
+      :name="name && name[1]"
+      @input="handleEndInput"
+      @change="handleEndChange"
+      @focus="focused = true"
+      @blur="focused = false"
+      class="el-range-input">
+    <i class="el-input__icon el-range__close-icon"
+      :class="[showClear ? 'el-icon-circle-close' : '']"
+      @click="handleClickClear">
+    </i>
+  </div>
+</template>
+
+<script>
+import emitter from 'element-ui/src/mixins/emitter';
+
+function isNumber (val) {
+  var regPos = /^\d+(\.\d+)?$/; // 非负浮点数
+  var regNeg = /^(-(([0-9]+\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\.[0-9]+)|([0-9]*[1-9][0-9]*)))$/; // 负浮点数
+  if (regPos.test(val) || regNeg.test(val)) {
+    return true;
+  } else {
+    return false;
+  }
+}
+export default {
+  name: 'InputNumberRange',
+  componentName: 'InputNumberRange',
+  mixins: [emitter],
+  props: {
+    /**
+     * 绑定字段
+     */
+    value: {
+      type: Array,
+      default: function () {
+        return [];
+      }
+    },
+    /**
+     * 组件大小（medium / small / mini）
+     */
+    size: String,
+    /**
+     * 禁用
+     */
+    disabled: Boolean,
+    /**
+     * 完全只读
+     */
+    readonly: Boolean,
+    /**
+     * 是否显示清除按钮
+     */
+    clearable: {
+      type: Boolean,
+      default: false
+    },
+    /**
+     * 自定义头部图标的类名
+     */
+    prefixIcon: String,
+    /**
+     * 范围选择时最小值的占位内容
+     */
+    startPlaceholder: String,
+    /**
+     * 范围选择时最大值的占位内容
+     */
+    endPlaceholder: String,
+    /**
+     * 原生属性
+     */
+    name: {
+      default: ''
+    },
+    /**
+     * 选择范围时的分隔符
+     */
+    rangeSeparator: {
+      type: String,
+      default: '-'
+    },
+    validateEvent: {
+      type: Boolean,
+      default: true
+    }
+  },
+  data () {
+    return {
+      hovering: false,
+      focused: false,
+      userInput: this.value,
+      showClose: false
+    };
+  },
+  inject: {
+    elForm: {
+      default: ''
+    },
+    elFormItem: {
+      default: ''
+    }
+  },
+  computed: {
+    _elFormItemSize () {
+      return (this.elFormItem || {}).elFormItemSize;
+    },
+    inputSize () {
+      let temp = this.size || this._elFormItemSize || (this.$ELEMENT || {}).size;
+      return temp;
+    },
+    inputDisabled () {
+      return this.disabled || (this.elForm || {}).disabled;
+    },
+    showClear () {
+      let temp = this.clearable && !this.inputDisabled && !this.readonly && this.showClose &&
+        this.userInput != null && Array.isArray(this.userInput) && this.userInput.length > 0 &&
+        (this.userInput[0] != null || this.userInput[1] != null);
+      return temp;
+    }
+  },
+  methods: {
+    handleStartInput (event) {
+      if (this.userInput) {
+        this.userInput = [event.target.value, this.userInput[1]];
+      } else {
+        this.userInput = [event.target.value, null];
+      }
+    },
+
+    handleEndInput (event) {
+      if (this.userInput) {
+        this.userInput = [this.userInput[0], event.target.value];
+      } else {
+        this.userInput = [null, event.target.value];
+      }
+    },
+    handleStartChange (event) {
+      let value = this.userInput && this.userInput[0];
+      value = isNumber(value) ? value : null;
+      value = value ? Number.parseFloat(value) : null;
+      if (this.userInput) {
+        this.userInput[0] = value;
+      } else {
+        this.userInput = [value, null];
+      }
+      event.srcElement.value = value;
+      this.emitInput(this.userInput);
+    },
+    handleEndChange (event) {
+      let value = this.userInput && this.userInput[1];
+      value = isNumber(value) ? value : null;
+      value = value ? Number.parseFloat(value) : null;
+      if (this.userInput) {
+        this.userInput[1] = value;
+      } else {
+        this.userInput = [null, value];
+      }
+      event.srcElement.value = value;
+      this.emitInput(this.userInput);
+    },
+    handleClickClear () {
+      this.userInput = undefined;
+      this.emitInput(this.userInput);
+    },
+    valueEquals (val, oldVal) {
+      return JSON.stringify(val) === JSON.stringify(oldVal);
+    },
+    emitInput (values) {
+      this.$emit('input', values);
+      this.$emit('change', values);
+    }
+  },
+  watch: {
+    value: {
+      handler: function (val, oldVal) {
+        if (!this.valueEquals(val, oldVal) && this.validateEvent) {
+          this.dispatch('ElFormItem', 'el.form.change', val);
+        }
+      },
+      deep: true
+    }
+  }
+}
+</script>
+
+<style>
+</style>

orange-admin-web/src/components/Progress/index.vue

@@ -0,0 +1,44 @@
+<template>
+  <el-progress v-bind="$attrs" :percentage="getPercentage" />
+</template>
+
+<script>
+export default {
+  name: 'Progress',
+  props: {
+    /**
+     * 组件最小值
+     */
+    min: {
+      type: Number,
+      default: 0
+    },
+    /**
+     * 组件最大值
+     */
+    max: {
+      type: Number,
+      default: 100
+    },
+    /**
+     * 组件当前值
+     */
+    value: {
+      type: Number,
+      default: 0
+    }
+  },
+  computed: {
+    getPercentage () {
+      let value = Math.min(this.max, Math.max(this.min, this.value));
+      value = value - this.min;
+      if ((this.max - this.min) === 0) {
+        value = 0;
+      } else {
+        value = ((value * 100) / (this.max - this.min));
+      }
+      return Number.isInteger(value) ? value : parseInt(value);
+    }
+  }
+}
+</script>

orange-admin-web/src/components/RichEditor/index.vue

@@ -0,0 +1,129 @@
+<template>
+  <div class="uditor-class" ref="editor"></div>
+</template>
+
+<script>
+import WEditor from 'wangeditor';
+
+const defaultConfigs = {
+  uploadImgServer: undefined,
+  uploadFileName: 'imageFile',
+  uploadImgMaxSize: 1 * 1024 * 1024,
+  uploadImgShowBase64: true,
+  uploadImgMaxLength: 5,
+  uploadImgParams: undefined,
+  uploadImgParamsWithUrl: true,
+  withCredentials: true,
+  uploadImgTimeout: 5000,
+  uploadImgHeaders: undefined,
+  uploadImgHooks: undefined,
+  zIndex: 0,
+  lang: undefined,
+  pasteFilterStyle: true,
+  pasteIgnoreImg: false,
+  onchangeTimeout: 10,
+  menus: [
+    // 标题
+    'head',
+    // 粗体
+    'bold',
+    // 字号
+    'fontSize',
+    // 字体
+    'fontName',
+    // 斜体
+    'italic',
+    // 下划线
+    'underline',
+    // 删除线
+    'strikeThrough',
+    // 文字颜色
+    'foreColor',
+    // 背景颜色
+    'backColor',
+    // 插入链接
+    'link',
+    // 列表
+    'list',
+    // 对齐方式
+    'justify',
+    // 引用
+    'quote',
+    // 插入图片
+    'image',
+    // 撤销
+    'undo',
+    // 重复
+    'redo'
+  ]
+}
+
+export default {
+  props: {
+    /**
+     * 绑定字段
+     */
+    value: {
+      type: String
+    },
+    /**
+     * 配置项，详情请参考wangEditor文档
+     */
+    config: {
+      type: Object,
+      default: () => {
+        return defaultConfigs;
+      }
+    }
+  },
+  data () {
+    return {
+      editor: null
+    }
+  },
+  computed: {
+    getConfigs () {
+      return {...this.config, ...defaultConfigs};
+    }
+  },
+  mounted () {
+    this.editor = new WEditor(this.$refs.editor);
+    this.editor.customConfig = {...this.getConfigs};
+    this.editor.customConfig.pasteTextHandle = (content) => {
+      // content 即粘贴过来的内容（html 或 纯文本），可进行自定义处理然后返回
+      return content;
+    }
+    this.editor.customConfig.linkImgCallback = (url) => {
+      console.log(url) // url 即插入图片的地址
+    }
+    this.editor.customConfig.linkCheck = (text, link) => {
+      return true // 返回 true 表示校验成功
+      // return '验证失败' // 返回字符串，即校验失败的提示信息
+    }
+
+    this.editor.customConfig.linkImgCheck = (src) => {
+      return true // 返回 true 表示校验成功
+      // return '验证失败' // 返回字符串，即校验失败的提示信息
+    }
+    // 失去焦点后更新数据
+    this.editor.customConfig.onblur = (html) => {
+      console.log(html)
+      this.$emit('input', html);
+    }
+
+    this.editor.create();
+    this.editor.txt.html(this.value);
+  },
+  watch: {
+    value: {
+      handler (newValue) {
+        if (this.editor) this.editor.txt.html(this.value);
+      },
+      immediate: true
+    }
+  }
+}
+</script>
+
+<style>
+</style>

orange-admin-web/src/components/TableProgressColumn/index.vue

@@ -0,0 +1,119 @@
+<template>
+  <el-table-column v-bind="$attrs">
+    <template slot-scope="scope">
+      <orange-progress :stroke-width="strokeWidth" :type="type" :text-inside="textInside" :status="status" :color="color"
+        :width="width" :show-text="showText" :min="getMinValue(scope.row)" :max="getMaxValue(scope.row)"
+        :value="getValue(scope.row)" />
+    </template>
+  </el-table-column>
+</template>
+
+<script>
+import Progress from '@/components/Progress/index.vue';
+
+export default {
+  name: 'TableProgressColumn',
+  components: {
+    'orange-progress': Progress
+  },
+  props: {
+    /**
+     * 固定值最小值
+     */
+    min: {
+      type: Number,
+      default: 0
+    },
+    /**
+     * 固定值最大值
+     */
+    max: {
+      type: Number,
+      default: 100
+    },
+    /**
+     * 固定值当前值
+     */
+    value: {
+      type: Number,
+      default: 0
+    },
+    /**
+     * 表格最小值字段名
+     */
+    minColumn: {
+      type: String
+    },
+    /**
+     * 表格最大值字段名
+     */
+    maxColumn: {
+      type: String
+    },
+    /**
+     * 表格当前值字段名
+     */
+    valueColumn: {
+      type: String
+    },
+    /**
+     * 进度条的宽度，单位 px
+     */
+    strokeWidth: {
+      type: Number,
+      default: 16
+    },
+    /**
+     * 进度条类型（line/circle/dashboard）
+     */
+    type: {
+      type: String,
+      default: 'line'
+    },
+    /**
+     * 进度条显示文字内置在进度条内（只在 type=line 时可用）
+     */
+    textInside: {
+      type: Boolean,
+      default: true
+    },
+    /**
+     * 进度条当前状态(success/exception/warning)
+     */
+    status: {
+      type: String
+    },
+    /**
+     * 进度条背景色（会覆盖 status 状态颜色）
+     */
+    color: {
+      type: [String, Function, Array]
+    },
+    /**
+     * 环形进度条画布宽度（只在 type 为 circle 或 dashboard 时可用）
+     */
+    width: {
+      type: Number,
+      default: 126
+    },
+    /**
+     * 是否显示进度条文字内容
+     */
+    showText: {
+      type: Boolean,
+      default: true
+    }
+  },
+  methods: {
+    getValue (row) {
+      return this.valueColumn ? row[this.valueColumn] : this.value;
+    },
+    getMinValue (row) {
+      return this.minColumn ? row[this.minColumn] : this.min;
+    },
+    getMaxValue (row) {
+      return this.maxColumn ? row[this.maxColumn] : this.max;
+    }
+  }
+}
+</script>

orange-admin-web/src/components/TreeSelect/index.vue

@@ -0,0 +1,300 @@
+<template>
+  <el-popover ref="popover" placement="bottom-start" trigger="click" popper-class="tree-select-popover"
+    :width="width" @show="onShowPopover">
+    <el-scrollbar :style="{'height': this.height, 'min-width': this.width}" ref="scrollbar">
+      <el-tree ref="dropdownTree" :props="getTreeProps" :highlightCurrent="highlightCurrent" :nodeKey="getDataProps.value"
+        :defaultExpandAll="defaultExpandAll" :expandOnClickNode="expandOnClickNode" :checkOnClickNode="checkOnClickNode"
+        :autoExpandParent="autoExpandParent" :defaultExpandedKeys="defaultExpandedKeys" :showCheckbox="showCheckbox"
+        :checkStrictly="checkStrictly" :defaultCheckedKeys="defaultCheckedKeys" :currentNodeKey="getCurrentNodeKey"
+        :accordion="accordion" :indent="indent" :iconClass="iconClass" :load="loadChildrenNodes" lazy :show-checkbox="multiple"
+        @node-click="onTreeNodeClick" @check="onTreeNodeCheck">
+        <span :style="getNodeStyle(data)" slot-scope="{ node, data }">{{data[getDataProps.label]}}</span>
+      </el-tree>
+    </el-scrollbar>
+    <el-select slot="reference" v-model="selectKeys" :multiple="multiple" :disabled="false" :size="size"
+      :clearable="clearable" :collapseTags="collapseTags" :placeholder="placeholder" popper-class="select-tree-popper"
+      @clear="onClear" @remove-tag="onClear">
+      <el-option v-for="item in selectNodes" :key="item[getDataProps.value]"
+        :value="item[getDataProps.value]" :label="item[getDataProps.label]" />
+    </el-select>
+  </el-popover>
+</template>
+
+<script>
+import { findTreeNode } from '@/utils';
+
+export default {
+  name: 'TreeSelect',
+  props: {
+    value: {
+      type: [String, Number]
+    },
+    multiple: {
+      type: Boolean,
+      default: false
+    },
+    disabled: {
+      type: Boolean,
+      default: false
+    },
+    size: {
+      type: String
+    },
+    height: {
+      type: String,
+      default: '200px'
+    },
+    width: {
+      type: String,
+      default: '300px'
+    },
+    activeColor: {
+      type: String,
+      default: '#EF5E1C'
+    },
+    clearable: {
+      type: Boolean,
+      default: false
+    },
+    collapseTags: {
+      type: Boolean,
+      default: true
+    },
+    placeholder: {
+      type: String
+    },
+    loading: {
+      type: Boolean,
+      default: false
+    },
+    loadingText: {
+      type: String,
+      default: '加载中'
+    },
+    // 树属性
+    data: {
+      type: Array
+    },
+    props: {
+      type: Object,
+      default: () => {
+        return {
+          label: 'label',
+          value: 'value',
+          parentKey: 'parentId',
+          children: 'children',
+          disabled: 'disabled'
+        }
+      }
+    },
+    defaultExpandAll: {
+      type: Boolean,
+      default: false
+    },
+    expandOnClickNode: {
+      type: Boolean,
+      default: true
+    },
+    checkOnClickNode: {
+      type: Boolean,
+      default: false
+    },
+    autoExpandParent: {
+      type: Boolean,
+      default: true
+    },
+    defaultExpandedKeys: {
+      type: Array
+    },
+    checkStrictly: {
+      type: Boolean,
+      default: true
+    },
+    currentNodeKey: {
+      type: [String, Number]
+    },
+    accordion: {
+      type: Boolean,
+      default: false
+    },
+    indent: {
+      type: Number,
+      default: 16
+    },
+    iconClass: {
+      type: String
+    }
+  },
+  data () {
+    return {
+      rootNode: undefined,
+      rootResolve: undefined,
+      allTreeNode: [],
+      selectNodes: [],
+      scrollTop: 0,
+      selectKeys: undefined
+    }
+  },
+  methods: {
+    onShowPopover () {
+      setTimeout(() => {
+        this.$refs.scrollbar.wrap.scrollTop = this.scrollTop;
+        // this.$refs.scrollbar.update();
+      }, 20);
+      if (!this.multiple) {
+        this.$refs.dropdownTree.setCurrentKey(this.value);
+      }
+    },
+    onClear () {
+      this.$nextTick(() => {
+        this.$emit('input', this.selectKeys);
+      });
+    },
+    onTreeNodeClick (data, node) {
+      this.$refs.popover.showPopper = false;
+      if (!this.multiple) {
+        this.scrollTop = this.$refs.scrollbar.wrap.scrollTop;
+        this.$emit('input', data[this.getDataProps.value]);
+        this.$emit('change', data[this.getDataProps.value]);
+      }
+    },
+    onTreeNodeCheck (data, {checkedNodes, checkedKeys, halfCheckedNodes, halfCheckedKeys}) {
+      this.scrollTop = this.$refs.scrollbar.wrap.scrollTop
+      this.$emit('input', checkedKeys);
+      this.$emit('change', checkedKeys);
+    },
+    parseNode (node) {
+      if (Array.isArray(node) && node.length > 0) {
+        node.forEach((item) => {
+          item['__node_is_leaf__'] = !(Array.isArray(item[this.getDataProps.children]) && item[this.getDataProps.children].length > 0);
+        });
+        return node;
+      } else {
+        return [];
+      }
+    },
+    loadChildrenNodes (node, resolve) {
+      if (node.level === 0) {
+        this.rootNode = node;
+        this.rootResolve = resolve;
+        return resolve(this.parseNode(this.allTreeNode));
+      } else {
+        return resolve(this.parseNode(node.data[this.getDataProps.children]));
+      }
+    },
+    getNodeStyle (data) {
+      if (!this.multiple && (this.selectNodes[0] || {})[this.getDataProps.value] === data[this.getDataProps.value]) {
+        return {
+          color: this.activeColor,
+          'font-weight': 700
+        }
+      }
+    }
+  },
+  computed: {
+    showCheckbox () {
+      return this.multiple;
+    },
+    getCurrentNodeKey () {
+      if (!this.multiple && Array.isArray(this.selectNodes) && this.selectNodes.length > 0) {
+        return this.selectNodes[0][this.getDataProps.value];
+      } else {
+        return null;
+      }
+    },
+    highlightCurrent () {
+      return this.multiple;
+    },
+    defaultCheckedKeys () {
+      return this.multiple ? this.selectNodes : undefined
+    },
+    getDataProps () {
+      return {
+        label: this.props.label || 'label',
+        value: this.props.value || 'value',
+        parentKey: this.props.parentKey || 'parentId',
+        children: this.props.children || 'children',
+        disabled: this.props.disabled || 'disabled'
+      }
+    },
+    getTreeProps () {
+      return {
+        label: this.getDataProps.label,
+        children: '__children_list__',
+        disabled: this.getDataProps.disabled,
+        isLeaf: '__node_is_leaf__'
+      };
+    }
+  },
+  watch: {
+    data: {
+      handler (newValue, oldValue) {
+        this.allTreeNode = newValue;
+        if (this.rootNode != null && this.rootResolve != null) {
+          this.rootNode.childNodes = [];
+          this.loadChildrenNodes(this.rootNode, this.rootResolve);
+        }
+        this.selectNodes = [];
+        if (this.multiple) {
+          if (Array.isArray(this.value)) {
+            this.value.forEach((item) => {
+              let data = findTreeNode(this.allTreeNode, item, this.getDataProps.value, this.getDataProps.children);
+              if (data) this.selectNodes.push(data);
+            });
+          }
+        } else {
+          let data = findTreeNode(this.allTreeNode, this.value, this.getDataProps.value, this.getDataProps.children);
+          if (data) this.selectNodes.push(data);
+        }
+      },
+      immediate: true
+    },
+    value: {
+      handler (newValue) {
+        this.selectNodes = [];
+        if (Array.isArray(newValue)) {
+          newValue.forEach((item) => {
+            let data = findTreeNode(this.allTreeNode, item, this.getDataProps.value, this.getDataProps.children);
+            if (data) this.selectNodes.push(data);
+          });
+          this.selectKeys = newValue;
+        } else {
+          let data = findTreeNode(this.allTreeNode, newValue, this.getDataProps.value, this.getDataProps.children);
+          if (data) this.selectNodes.push(data);
+          this.selectKeys = newValue;
+        }
+        if (this.$refs.dropdownTree) {
+          this.multiple ? this.$refs.dropdownTree.setCheckedKeys(newValue) : this.$refs.dropdownTree.setCurrentKey(newValue);
+        }
+      },
+      immediate: true
+    }
+  }
+}
+</script>
+
+<style>
+  .select-tree-popper {
+    display: none;
+  }
+  .tree-select-popover {
+    padding: 6px 0px;
+  }
+  .tree-select-popover .popper__arrow {
+    left: 35px!important;
+  }
+  .tree-select-popover .el-tree .el-tree-node__content {
+    height: 34px;
+    line-height: 34px;
+  }
+  /*
+  .tree-select-popover .el-tree .el-tree-node.is-current .el-tree-node__content {
+    color: #fdb95c;
+    font-weight: 700;
+  }
+  */
+  .current-node {
+    color: #EF5E1C;
+    font-weight: 700;
+  }
+</style>

orange-admin-web/src/core/config/development.js

@@ -0,0 +1,4 @@
+module.exports = {
+  baseUrl: 'http://localhost:8080/',
+  projectName: '橙单生成器项目'
+}

orange-admin-web/src/core/config/index.js

@@ -0,0 +1,12 @@
+const projectConfig = require('../config/' + process.env.NODE_ENV);
+
+export const globalConfig = {
+  httpOption: {
+    showMask: true,
+    showError: true
+  },
+  axiosOption: {
+  }
+};
+
+export default projectConfig;

orange-admin-web/src/core/config/production.js

@@ -0,0 +1,4 @@
+module.exports = {
+  baseUrl: 'http://localhost:8080/',
+  projectName: '橙单生成器项目'
+}

orange-admin-web/src/core/directive/sortable.js

@@ -0,0 +1,14 @@
+import Vue from 'vue'
+import { SortableData } from './sortableData';
+
+/**
+ * 拖拽排序指令
+ */
+Vue.directive('sortable', {
+  inserted: function (el, binding, vnode) {
+    let sortableData = binding.value;
+    if (sortableData == null || !(sortableData instanceof SortableData)) return;
+    
+    sortableData.init(vnode.elm);
+  }
+});

orange-admin-web/src/core/directive/sortableData.js

@@ -0,0 +1,60 @@
+import sortable from 'sortablejs'
+/**
+ * 拖拽排序对象
+ * expample
+ * <ul v-sortable="new SortableData(data)">
+ *   <li>A</li>
+ *   <li>B</li>
+ *   <li>C</li>
+ *   <li>D</li>
+ * </ul>
+ */
+export class SortableData {
+  constructor (data, group) {
+    this.list = data;
+    this.group = group;
+    this.ghostClass = 'sortable-ghost';
+    this.sortable = null;
+    this.disabled = false;
+  };
+
+  setData (list) {
+    this.list = list;
+  }
+
+  getElement (el) {
+    return el;
+  };
+
+  onEnd (oldIndex, newIndex) {
+    if (oldIndex === newIndex || this.list == null) return;
+    let targetRow = this.list.splice(oldIndex, 1)[0]
+    this.list.splice(newIndex, 0, targetRow);
+  };
+
+  init (el) {
+    var _this = this;
+
+    var _option = {};
+    if (this.ghostClass != null) _option.ghostClass = this.ghostClass;
+    if (this.group != null) _option.group = this.group;
+    if (this.disabled != null) _option.disabled = this.disabled;
+    // 列表中能拖动的dom的选择器（例如：.drag-item）
+    if (this.draggable != null) _option.draggable = this.draggable;
+    // 列表中拖动项，拖动把柄的选择器，只有点击这个选择出来的dom才可以开始拖动（例如：.drag-handle）
+    if (this.handle != null) _option.handle = this.handle;
+    _option.setData = function (dataTransfer) {
+      dataTransfer.setData('Text', '');
+    };
+    _option.onEnd = function (evt) {
+      _this.onEnd(evt.oldIndex, evt.newIndex);
+    };
+
+    this.sortable = sortable.create(_this.getElement(el), _option);
+  };
+
+  release () {
+    if (this.sortable != null) this.sortable.destroy();
+    this.sortable = null;
+  }
+};

orange-admin-web/src/core/http/index.js

@@ -0,0 +1,185 @@
+import Vue from 'vue';
+import { Loading, Message } from 'element-ui';
+import request from './request';
+import requestUrl from './requestUrl';
+import merge from 'lodash/merge';
+import { globalConfig } from '@/core/config';
+
+/**
+ * 遮罩管理，多次调用支持引用计数
+ */
+class LoadingManager {
+  constructor (options) {
+    this.options = options;
+    this.refCount = 0;
+    this.loading = undefined;
+  }
+
+  showMask () {
+    this.loading = Loading.service(this.options);
+    this.refCount++;
+  }
+
+  hideMask () {
+    if (this.refCount <= 1 && this.loading != null) {
+      this.loading.close();
+      this.loading = null;
+    }
+    this.refCount--;
+    this.refCount = Math.max(0, this.refCount);
+  }
+}
+
+const loadingManager = new LoadingManager({
+  fullscreen: true,
+  background: 'rgba(0, 0, 0, 0.1)'
+});
+
+/**
+ * post请求
+ * @param {String} url 请求的url
+ * @param {Object} params 请求参数
+ * @param {Object} options axios设置项
+ * @returns {Promise}
+ */
+const fetchPost = function (url, params, options) {
+  if (options == null) return {};
+  let tempOptions = {
+    ...options,
+    method: 'post',
+    url: requestUrl(url),
+    data: params
+  };
+
+  return request(tempOptions);
+};
+/**
+ * get请求
+ * @param {String} url 请求的url
+ * @param {Object} params 请求参数
+ * @param {Object} options axios设置项
+ * @returns {Promise}
+ */
+const fetchGet = function (url, params, options) {
+  if (options == null) return {};
+  let tempOptions = {
+    ...options,
+    method: 'get',
+    url: requestUrl(url),
+    params
+  };
+  return request(tempOptions);
+};
+/**
+ * 下载请求
+ * @param {String} url 请求的url
+ * @param {Object} params 请求参数
+ * @param {String} fileName 下载后保存的文件名
+ * @returns {Promise}
+ */
+const fetchDownload = function (url, params, fileName) {
+  return new Promise((resolve, reject) => {
+    request({
+      url: requestUrl(url),
+      method: 'post',
+      data: params,
+      responseType: 'blob',
+      transformResponse: function (data) {
+        return (data instanceof Blob && data.size > 0) ? data : undefined;
+      }
+    }).then(res => {
+      if (res.data == null) {
+        reject(new Error('下载文件失败'));
+      } else {
+        let blobData = new Blob([res.data], { type: 'application/octet-stream' });
+        let blobUrl = window.URL.createObjectURL(blobData);
+        let linkDom = document.createElement('a');
+        linkDom.style.display = 'none';
+        linkDom.href = blobUrl;
+        linkDom.setAttribute('download', fileName);
+        if (typeof linkDom.download === 'undefined') {
+          linkDom.setAttribute('target', '_blank');
+        }
+        document.body.appendChild(linkDom);
+        linkDom.click();
+        document.body.removeChild(linkDom);
+        window.URL.revokeObjectURL(blobData);
+        resolve();
+      }
+    }).catch(e => {
+      if (e instanceof Blob) {
+        let reader = new FileReader();
+        reader.onload = function () {
+          let jsonObj = JSON.parse(reader.result);
+          reject((jsonObj || {}).errorMessage || '下载文件失败');
+        }
+        reader.readAsText(e);
+      } else {
+        reject(e);
+      }
+    });
+  });
+}
+/**
+ * 数据请求
+ * @param {String} url 请求的url
+ * @param {String} type 请求类型（get，post）
+ * @param {Object} params 请求参数
+ * @param {Object} axiosOption axios设置
+ * @param {Object} options 显示设置
+ */
+const doUrl = function (url, type, params, axiosOption, options) {
+  options = merge(globalConfig.httpOption, options);
+  axiosOption = merge(globalConfig.axiosOption, axiosOption);
+  if (type == null || type === '') type = 'post';
+
+  return new Promise((resolve, reject) => {
+    if (options.showMask) loadingManager.showMask();
+    let ajaxCall = null;
+    if (type.toLowerCase() === 'get') {
+      ajaxCall = fetchGet(url, params, axiosOption);
+    } else if (type.toLowerCase() === 'post') {
+      ajaxCall = fetchPost(url, params, axiosOption);
+    }
+
+    if (ajaxCall != null) {
+      ajaxCall.then(res => {
+        if (options.showMask) loadingManager.hideMask();
+        if (res.data && res.data.success) {
+          resolve(res.data);
+        } else {
+          if (options.showError) {
+            Message.error({
+              showClose: true,
+              message: res.data.errorMessage ? res.data.errorMessage : '数据请求失败'
+            });
+          }
+          reject(res.data);
+        }
+      }).catch(e => {
+        if (options.showMask) loadingManager.hideMask();
+        if (options.showError) {
+          Message.error({
+            showClose: true,
+            message: e.errorMessage ? e.errorMessage : '网络请求错误'
+          });
+        }
+        reject(e);
+      });
+    } else {
+      if (options.showMask) loadingManager.hideMask();
+      reject(new Error('错误的请求类型 - ' + type));
+    }
+  });
+};
+
+Vue.prototype.download = fetchDownload;
+Vue.prototype.doUrl = doUrl;
+Vue.prototype.loadingManager = loadingManager;
+
+export default {
+  doUrl,
+  fetchPost,
+  fetchGet,
+  fetchDownload
+}

orange-admin-web/src/core/http/request.js

@@ -0,0 +1,73 @@
+import axios from 'axios';
+import router from '@/router';
+import dialog from '@/components/Dialog';
+import JSONbig from 'json-bigint';
+
+// 创建axios实例
+const service = axios.create({
+  timeout: 1000 * 30,
+  withCredentials: true,
+  headers: {
+    // 'Content-Type': 'application/x-www-form-urlencoded; charset=utf-8'
+    'Content-Type': 'application/json; charset=utf-8'
+  },
+  transformResponse: [
+    function (data) {
+      if (typeof data === 'string') {
+        const JSONbigString = new JSONbig({storeAsString: true});
+        return JSONbigString.parse(data);
+      } else {
+        return data;
+      }
+    }
+  ]
+})
+
+// request拦截器
+service.interceptors.request.use(
+  config => {
+    let token = window.sessionStorage.getItem('token');
+    let menuIdJsonStr = window.sessionStorage.getItem('currentMenuId');
+    let currentMenuId;
+    if (menuIdJsonStr != null) {
+      currentMenuId = (JSON.parse(menuIdJsonStr) || {}).data;
+    }
+    if (token != null) config.headers['Authorization'] = token;
+    if (currentMenuId != null) config.headers['MenuId'] = currentMenuId;
+    return config
+  }, error => {
+    return Promise.reject(error)
+  }
+);
+
+// response拦截器
+service.interceptors.response.use(
+  response => {
+    if (response.data && response.data.errorCode === 'UNAUTHORIZED_LOGIN') { // 401, token失效
+      dialog.closeAll();
+      router.push({ name: 'login' })
+    } else {
+      if (response.headers['refreshedtoken'] != null) {
+        window.sessionStorage.setItem('token', response.headers['refreshedtoken']);
+      }
+    }
+    return response
+  }, error => {
+    let response = error.response;
+
+    if (response && response.data) {
+      if (response.data.errorCode === 'UNAUTHORIZED_LOGIN') {
+        dialog.closeAll();
+        router.push({ name: 'login' });
+      }
+
+      return Promise.reject(response.data);
+    } else {
+      return Promise.reject(new Error({
+        errorMessage: '数据获取失败，请稍后再试'
+      }));
+    }
+  }
+);
+
+export default service

orange-admin-web/src/core/http/requestUrl.js

@@ -0,0 +1,27 @@
+import projectConfig from '@/core/config';
+import { objectToQueryString } from '@/utils';
+console.log(process.env.NODE_ENV, projectConfig);
+
+/**
+ * 请求地址统一处理／组装
+ * @param actionName action方法名称
+ */
+export default function (actionName) {
+  if (actionName != null && actionName !== '') {
+    if (actionName.substr(0, 1) === '/') actionName = actionName.substr(1);
+  }
+  return projectConfig.baseUrl + actionName;
+}
+
+export function buildGetUrl (actionName, params) {
+  let queryString = objectToQueryString(params);
+  if (actionName != null && actionName !== '') {
+    if (actionName.substr(0, 1) === '/') actionName = actionName.substr(1);
+  }
+
+  return projectConfig.baseUrl + actionName + (queryString == null ? '' : ('?' + queryString));
+}
+
+export {
+  projectConfig
+}

orange-admin-web/src/core/mixins/global.js

@@ -0,0 +1,120 @@
+import Vue from 'vue';
+import Request from '@/core/http/request.js';
+import { mapMutations, mapGetters } from 'vuex';
+
+// 全局mixin对象
+const globalMixin = {
+  data () {
+    return {
+      isHttpLoading: false
+    }
+  },
+  methods: {
+    /**
+     * 是否显示遮罩
+     * @param {Boolean} isShow  是否显示
+     */
+    showMask (isShow) {
+      isShow ? this.loadingManager.showMask() : this.loadingManager.hideMask();
+    },
+    /**
+     * 判读用户是否有权限
+     * @param {String} permCode  权限字
+     */
+    checkPermCodeExist (permCode) {
+      if (this.getUserInfo.permCodeSet != null) {
+        return this.getUserInfo.permCodeSet.has(permCode);
+      } else {
+        return this.getUserInfo.isAdmin;
+      }
+    },
+    /**
+     * 将输入的值转换成指定的类型
+     * @param {Any} value
+     * @param {String} type 要转换的类型（integer、float、boolean、string）
+     */
+    parseParams (value, type = 'string') {
+      if (value == null) return value;
+      switch (type) {
+        case 'integer': return Number.parseInt(value);
+        case 'float': return Number.parseFloat(value);
+        case 'boolean': return (value === 'true' || value);
+        default: return String(value);
+      }
+    },
+    /**
+     * 将输入值转换为执行的类型数组
+     * @param {Array} value 输入数组
+     * @param {String} type 要转换的类型（integer、float、boolean、string）
+     */
+    parseArrayParams (value, type = 'string') {
+      if (Array.isArray(value)) {
+        return value.map((item) => {
+          switch (type) {
+            case 'integer': return Number.parseInt(item);
+            case 'float': return Number.parseFloat(item);
+            case 'boolean': return (item === 'true' || item);
+            default: return String(item);
+          }
+        });
+      } else {
+        return [];
+      }
+    },
+    /**
+     * 下载上传的文件
+     * @param {*} url 下载文件的url
+     * @param {*} fileName 下载文件名
+     */
+    downloadFile (url, fileName) {
+      console.log(fileName);
+      Request({
+        url: url,
+        method: 'get',
+        responseType: 'blob',
+        transformResponse: function (data) {
+          console.log(data);
+          return data;
+        }
+      }).then(res => {
+        console.log(res);
+        let data = res.data;
+        if (res.status === 200 && data instanceof Blob) {
+          let url = window.URL.createObjectURL(data);
+          let link = document.createElement('a');
+          link.style.display = 'none';
+          link.href = url;
+          link.setAttribute('download', fileName);
+          document.body.appendChild(link);
+          link.click();
+          document.body.removeChild(link);
+        } else {
+          this.$message.error('下载文件失败');
+        }
+      }).catch(e => {
+        let reader = new FileReader();
+        reader.onload = () => {
+          let jsonObj = JSON.parse(reader.result);
+          this.$message.error((jsonObj || {}).errorMessage || '下载文件失败');
+        }
+        reader.readAsText(e);
+      });
+    },
+    ...mapMutations(['setLoadingStatus'])
+  },
+  computed: {
+    getPageHeight () {
+      return this.getClientHeight - 130;
+    },
+    ...mapGetters(['getUserInfo', 'getClientHeight'])
+  },
+  watch: {
+    'loadingManager.loading': {
+      handler: function (newValue) {
+        this.isHttpLoading = (newValue != null);
+      }
+    }
+  }
+}
+
+Vue.mixin(globalMixin);

orange-admin-web/src/core/mixins/index.js

@@ -0,0 +1,282 @@
+import projectConfig from '@/core/config';
+import { buildGetUrl } from '@/core/http/requestUrl.js';
+import { formatDate, parseDate } from 'element-ui/src/utils/date-util';
+import { mapMutations } from 'vuex';
+/**
+ * 上传文件组件相关方法
+ */
+const uploadMixin = {
+  methods: {
+    /**
+     * 解析返回的上传文件数据
+     * @param {String} jsonData 上传文件数据，[{name, downloadUri, filename}]
+     * @param {Object} params 上传文件的参数
+     * @returns {Array} 上传文件信息，[{name, downloadUri, filename, url}]
+     */
+    parseUploadData (jsonData, params) {
+      let pathList = [];
+      if (jsonData != null) {
+        try {
+          pathList = JSON.parse(jsonData);
+        } catch (e) {
+          console.error(e);
+        }
+      }
+
+      return pathList.map((item) => {
+        let downloadParams = {...params};
+        downloadParams.filename = item.filename;
+        return {
+          ...item,
+          url: this.getUploadFileUrl(item, downloadParams)
+        }
+      });
+    },
+    /**
+     * 获得上传文件url列表
+     * @param {*} jsonData 上传文件数据，[{name, downloadUri, filename}]
+     * @param {*} params 上传文件的参数
+     * @returns {Array} 文件url列表
+     */
+    getPictureList (jsonData, params) {
+      let tempList = this.parseUploadData(jsonData, params);
+      if (Array.isArray(tempList)) {
+        return tempList.map(item => item.url);
+      } else {
+        return [];
+      }
+    },
+    /**
+     * 将选中文件信息格式化成json信息
+     * @param {Array} fileList 上传文件列表，[{name, fileUrl, data}]
+     */
+    fileListToJson (fileList) {
+      if (Array.isArray(fileList)) {
+        return JSON.stringify(fileList.map((item) => {
+          return {
+            name: item.name,
+            downloadUri: item.downloadUri || item.response.data.downloadUri,
+            filename: item.filename || item.response.data.filename
+          }
+        }));
+      } else {
+        return undefined;
+      }
+    },
+    /**
+     * 获得上传文件url
+     * @param {*} item 上传文件
+     * @param {*} params 上传文件的参数
+     */
+    getUploadFileUrl (item, params) {
+      if (item == null || item.downloadUri == null) {
+        return null;
+      } else {
+        let menuIdJsonStr = window.sessionStorage.getItem('currentMenuId');
+        let currentMenuId;
+        if (menuIdJsonStr != null) {
+          currentMenuId = (JSON.parse(menuIdJsonStr) || {}).data;
+        }
+        params.Authorization = window.sessionStorage.getItem('token');
+        params.MenuId = currentMenuId;
+        return buildGetUrl(item.downloadUri, params);
+      }
+    },
+    /**
+     * 获得上传接口
+     * @param {*} url 上传路径
+     */
+    getUploadActionUrl (url) {
+      if (url != null && url[0] === '/') {
+        url = url.substr(1);
+      }
+      return projectConfig.baseUrl + url;
+    },
+    /**
+     * 上传文件是否图片文件
+     * @param {*} file 上传文件
+     */
+    pictureFile (file) {
+      if (['image/jpeg', 'image/jpg', 'image/png'].indexOf(file.type) !== -1) {
+        return true;
+      } else {
+        this.$message.error('图片文件格式不正确，请重新选择');
+        return false;
+      }
+    }
+  },
+  computed: {
+    getUploadHeaders () {
+      let token = window.sessionStorage.getItem('token');
+      return {
+        Authorization: token
+      }
+    }
+  }
+};
+
+const allowStatsType = [
+  'time',
+  'datetime',
+  'day',
+  'month',
+  'year'
+];
+/**
+ * 日期相关方法
+ */
+const statsDateRangeMixin = {
+  methods: {
+    /**
+     * 根据输入的日期获得日期范围（例如：输入2019-12-12，输出['2019-12-12 00:00:00', '2019-12-12 23:59:59']）
+     * @param {Date|String} date 要转换的日期
+     * @param {String} statsType 转换类型（day, month, year）
+     * @param {String} format 输出格式
+     */
+    getDateRangeFilter (date, statsType = 'day', format = 'yyyy-MM-dd HH:mm:ss') {
+      if (date == null) return [];
+
+      statsType = allowStatsType.indexOf(statsType) === -1 ? 'day' : statsType;
+      let tempDate = new Date(date);
+      tempDate.setHours(0, 0, 0, 0);
+      let retDate;
+      switch (statsType) {
+        case 'day':
+          retDate = [
+            new Date(tempDate),
+            new Date(tempDate.setDate(tempDate.getDate() + 1))
+          ];
+          break;
+        case 'month':
+          tempDate.setDate(1);
+          retDate = [
+            new Date(tempDate),
+            new Date(tempDate.setMonth(tempDate.getMonth() + 1))
+          ];
+          break;
+        case 'year':
+          tempDate.setDate(1);
+          tempDate.setMonth(0);
+          retDate = [
+            new Date(tempDate),
+            new Date(tempDate.setFullYear(tempDate.getFullYear() + 1))
+          ]
+      }
+
+      retDate[1] = new Date(retDate[1].getTime() - 1);
+
+      return [
+        formatDate(retDate[0], format),
+        formatDate(retDate[1], format)
+      ];
+    },
+    /**
+     * 格式化日期
+     * @param {Date|String} date 要格式化的日期
+     * @param {String} statsType 输出日期类型
+     * @param {String} format 输入日期的格式
+     */
+    formatDateByStatsType (date, statsType = 'day', format = 'yyyy-MM-dd') {
+      if (date == null) return undefined;
+      statsType = allowStatsType.indexOf(statsType) === -1 ? 'day' : statsType;
+      if (statsType === 'datetime') format = 'yyyy-MM-dd HH:mm:ss';
+      
+      let tempDate = ((date instanceof Date) ? date : parseDate(date, format));
+      if (!tempDate) return undefined;
+      switch (statsType) {
+        case 'time':
+          return formatDate(tempDate, 'HH:mm:ss');
+        case 'datetime':
+          return formatDate(tempDate, 'yyyy-MM-dd HH:mm:ss');
+        case 'day':
+          return formatDate(tempDate, 'yyyy-MM-dd');
+        case 'month':
+          return formatDate(tempDate, 'yyyy-MM');
+        case 'year':
+          return formatDate(tempDate, 'yyyy');
+        default:
+          return formatDate(tempDate, 'yyyy-MM-dd');
+      }
+    },
+    /**
+     * 获得统计类型中文名称
+     * @param {String} statsType 统计类型（day, month, year）
+     */
+    getStatsTypeShowName (statsType) {
+      statsType = allowStatsType.indexOf(statsType) === -1 ? 'day' : statsType;
+      switch (statsType) {
+        case 'day': return '日统计';
+        case 'month': return '月统计';
+        case 'year': return '年统计';
+      }
+    },
+    /**
+     * 获取统计类型字典列表
+     * @param {Array} statsTypeList 统计类型列表
+     */
+    getAllowStatsTypeList (statsTypeList) {
+      if (Array.isArray(statsTypeList) && statsTypeList.length > 0) {
+        return statsTypeList.map((item) => {
+          return {
+            id: item,
+            name: this.getStatsTypeShowName(item)
+          }
+        });
+      } else {
+        return [];
+      }
+    }
+  }
+}
+/**
+ * 页面缓存相关方法
+ */
+const cachePageMixin = {
+  methods: {
+    /**
+     * 移除缓存页面
+     * @param {*} name 缓存组件的名称
+     */
+    removeCachePage (name) {
+      this.removeCachePage(name);
+    },
+    /**
+     * 从跳转页面返回并且刷新当前页面时调用
+     */
+    onResume () {
+    },
+    ...mapMutations(['addCachePage', 'removeCachePage'])
+  },
+  created () {
+    this.addCachePage(this.$options.name);
+  },
+  activated () {
+    if (this.$route && this.$route.meta && this.$route.meta.refresh) {
+      this.onResume();
+      this.$route.meta.refresh = false;
+    }
+  }
+}
+/**
+ * 缓存页面跳转页面相关方法
+ */
+const cachedPageChildMixin = {
+  data () {
+    return {
+      // 是否刷新父页面
+      refreshParentCachedPage: false
+    }
+  },
+  beforeRouteLeave (to, from, next) {
+    if (to.meta == null) to.meta = {};
+    to.meta.refresh = this.refreshParentCachedPage;
+    next();
+  }
+}
+
+export {
+  uploadMixin,
+  statsDateRangeMixin,
+  cachePageMixin,
+  cachedPageChildMixin
+}

orange-admin-web/src/main.js

@@ -0,0 +1,36 @@
+import '@/core/http';
+import '@/components/Dialog';
+import Vue from 'vue';
+import ElementUI from 'element-ui';
+// import 'element-ui/lib/theme-chalk/index.css'
+import '@/assets/style/index.scss';
+import '@/core/mixins/global.js';
+import App from './App';
+import router from './router';
+import store from './store';
+import TreeSelect from '@/components/TreeSelect';
+import RichEditor from '@/components/RichEditor';
+import InputNumberRange from '@/components/InputNumberRange';
+import DateRange from '@/components/DateRange';
+import FilterBox from '@/components/FilterBox';
+import TableProgressColumn from '@/components/TableProgressColumn';
+import VCharts from 'v-charts';
+
+Vue.component('tree-select', TreeSelect);
+Vue.component('rich-editor', RichEditor);
+Vue.component('input-number-range', InputNumberRange);
+Vue.component('date-range', DateRange);
+Vue.component('filter-box', FilterBox);
+Vue.component('table-progress-column', TableProgressColumn);
+
+Vue.use(ElementUI);
+Vue.use(VCharts);
+
+Vue.config.productionTip = false;
+
+/* eslint-disable no-new */
+new Vue({
+  router,
+  store,
+  render: h => h(App)
+}).$mount('#app');

orange-admin-web/src/registerServiceWorker.js

@@ -0,0 +1,32 @@
+/* eslint-disable no-console */
+
+import { register } from 'register-service-worker'
+
+if (process.env.NODE_ENV === 'production') {
+  register(`${process.env.BASE_URL}service-worker.js`, {
+    ready () {
+      console.log(
+        'App is being served from cache by a service worker.\n' +
+        'For more details, visit https://goo.gl/AFskqB'
+      )
+    },
+    registered () {
+      console.log('Service worker has been registered.')
+    },
+    cached () {
+      console.log('Content has been cached for offline use.')
+    },
+    updatefound () {
+      console.log('New content is downloading.')
+    },
+    updated () {
+      console.log('New content is available; please refresh.')
+    },
+    offline () {
+      console.log('No internet connection found. App is running in offline mode.')
+    },
+    error (error) {
+      console.error('Error during service worker registration:', error)
+    }
+  })
+}

orange-admin-web/src/router/import-development.js

@@ -0,0 +1 @@
+module.exports = file => require('../views/' + file + '.vue').default

orange-admin-web/src/router/import-production.js

@@ -0,0 +1 @@
+module.exports = file => () => import('../views/' + file + '.vue')

orange-admin-web/src/router/index.js

@@ -0,0 +1,30 @@
+import Vue from 'vue';
+import Router from 'vue-router';
+import routers from './systemRouters.js';
+import dialog from '@/components/Dialog';
+
+Vue.use(Router)
+
+const router = new Router({
+  mode: 'hash',
+  routes: routers
+});
+
+/**
+ * 路由跳转的时候判断token是否存在
+ */
+router.beforeResolve((to, from, next) => {
+  if (to.name === 'login') {
+    next();
+  } else {
+    let token = sessionStorage.getItem('token');
+    if (!token || !/\S/.test(token)) {
+      dialog.closeAll();
+      next({ name: 'login' })
+    } else {
+      next();
+    }
+  }
+});
+
+export default router;

orange-admin-web/src/router/systemRouters.js

@@ -0,0 +1,41 @@
+// 开发环境不使用懒加载, 因为懒加载页面太多的话会造成webpack热更新太慢, 所以只有开发环境使用懒加载
+const _import = require('./import-' + process.env.NODE_ENV)
+
+function getProps (route) {
+  return route.query;
+}
+
+// 系统生成路由
+const routers = [
+  { path: '/login', component: _import('login/index'), name: 'login', props: getProps, desc: '登录' },
+  {
+    path: '/',
+    component: _import('layout/index'),
+    name: 'main',
+    props: getProps,
+    redirect: {
+      name: 'welcome'
+    },
+    meta: {
+      title: '主页',
+      showOnly: true
+    },
+    children: [
+      {path: 'welcome', component: _import('welcome/index'), name: 'welcome', meta: {title: '欢迎'}},
+      {path: 'formSysUser', component: _import('upms/formSysUser/index'), name: 'formSysUser', meta: {title: '用户管理'}},
+      {path: 'formSysDept', component: _import('upms/formSysDept/index'), name: 'formSysDept', meta: {title: '部门管理'}},
+      {path: 'formSysRole', component: _import('upms/formSysRole/index'), name: 'formSysRole', meta: {title: '角色管理'}},
+      {path: 'formSysDataPerm', component: _import('upms/formSysDataPerm/index'), name: 'formSysDataPerm', meta: {title: '数据权限管理'}},
+      {path: 'formSysMenu', component: _import('upms/formSysMenu/index'), name: 'formSysMenu', meta: {title: '菜单列表'}},
+      {path: 'formSysDict', component: _import('upms/formDictManagement/index'), name: 'formSysDict', meta: {title: '字典管理'}},
+      {path: 'formSysPermCode', component: _import('upms/formSysPermCode/index'), name: 'formSysPermCode', meta: {title: '权限字管理'}},
+      {path: 'formSysPerm', component: _import('upms/formSysPerm/index'), name: 'formSysPerm', meta: {title: '权限资源管理'}},
+      {path: 'formTeacher', component: _import('generated/formTeacher/index'), name: 'formTeacher', props: getProps, meta: {title: '老师管理'}},
+      {path: 'formCreateTeacher', component: _import('generated/formCreateTeacher/index'), name: 'formCreateTeacher', props: getProps, meta: {title: '新建老师'}},
+      {path: 'formEditTeacher', component: _import('generated/formEditTeacher/index'), name: 'formEditTeacher', props: getProps, meta: {title: '编辑老师'}},
+      {path: 'formTeacherTransStats', component: _import('generated/formTeacherTransStats/index'), name: 'formTeacherTransStats', props: getProps, meta: {title: '老师个人统计'}}
+    ]
+  }
+];
+
+export default routers;

orange-admin-web/src/staticDict/index.js

@@ -0,0 +1,236 @@
+/**
+ * 常量字典数据
+ */
+import Vue from 'vue';
+
+class DictionaryBase extends Map {
+  constructor (dataList, keyId = 'id', symbolId = 'symbol') {
+    super();
+    this.setList(dataList, keyId, symbolId);
+  }
+
+  setList (dataList, keyId = 'id', symbolId = 'symbol') {
+    this.clear();
+    if (Array.isArray(dataList)) {
+      dataList.forEach((item) => {
+        this.set(item[keyId], item);
+        if (item[symbolId] != null) {
+          Object.defineProperty(this, item[symbolId], {
+            get: function () {
+              return item[keyId];
+            }
+          });
+        }
+      });
+    }
+  }
+
+  getList (valueId = 'name', parentIdKey = 'parentId', filter) {
+    let temp = [];
+    this.forEach((value, key) => {
+      let obj = {
+        id: key,
+        name: (typeof value === 'string') ? value : value[valueId],
+        parentId: value[parentIdKey]
+      };
+      if (typeof filter !== 'function' || filter(obj)) {
+        temp.push(obj);
+      }
+    });
+
+    return temp;
+  }
+
+  getValue (id, valueId = 'name') {
+    return (this.get(id) || {})[valueId];
+  }
+}
+
+const Gender = new DictionaryBase([
+  {
+    id: 1,
+    name: '男',
+    symbol: 'MALE'
+  },
+  {
+    id: 0,
+    name: '女',
+    symbol: 'FEMALE'
+  }
+]);
+Vue.prototype.Gender = Gender;
+
+const Subject = new DictionaryBase([
+  {
+    id: 0,
+    name: '语文',
+    symbol: 'CHINESE'
+  },
+  {
+    id: 1,
+    name: '数学',
+    symbol: 'MATH'
+  },
+  {
+    id: 2,
+    name: '英语',
+    symbol: 'ENGLISH'
+  }
+]);
+Vue.prototype.Subject = Subject;
+
+const SysUserStatus = new DictionaryBase([
+  {
+    id: 0,
+    name: '正常状态',
+    symbol: 'NORMAL'
+  },
+  {
+    id: 1,
+    name: '锁定状态',
+    symbol: 'LOCKED'
+  }
+]);
+Vue.prototype.SysUserStatus = SysUserStatus;
+
+const SysUserType = new DictionaryBase([
+  {
+    id: 0,
+    name: '管理员',
+    symbol: 'ADMIN'
+  },
+  {
+    id: 1,
+    name: '系统操作员',
+    symbol: 'SYSTEM'
+  },
+  {
+    id: 2,
+    name: '普通操作员',
+    symbol: 'OPERATOR'
+  }
+]);
+Vue.prototype.SysUserType = SysUserType;
+
+const TeacherLevelType = new DictionaryBase([
+  {
+    id: 0,
+    name: '初级',
+    symbol: 'LOWER'
+  },
+  {
+    id: 1,
+    name: '中级',
+    symbol: 'NORMAL'
+  },
+  {
+    id: 2,
+    name: '高级',
+    symbol: 'HIGH'
+  }
+]);
+Vue.prototype.TeacherLevelType = TeacherLevelType;
+
+const YesNo = new DictionaryBase([
+  {
+    id: 1,
+    name: '是',
+    symbol: 'YES'
+  },
+  {
+    id: 0,
+    name: '否',
+    symbol: 'NO'
+  }
+]);
+Vue.prototype.YesNo = YesNo;
+
+const SysPermModuleType = new DictionaryBase([
+  {
+    id: 0,
+    name: '分组模块',
+    symbol: 'GROUP'
+  }, {
+    id: 1,
+    name: '接口模块',
+    symbol: 'CONTROLLER'
+  }
+]);
+Vue.prototype.SysPermModuleType = SysPermModuleType;
+
+const SysPermCodeType = new DictionaryBase([{
+  id: 0,
+  name: '表单',
+  symbol: 'FORM'
+}, {
+  id: 1,
+  name: '片段',
+  symbol: 'FRAGMENT'
+}, {
+  id: 2,
+  name: '操作',
+  symbol: 'OPERATION'
+}]);
+Vue.prototype.SysPermCodeType = SysPermCodeType;
+
+const SysMenuType = new DictionaryBase([
+  {
+    id: 0,
+    name: '目录',
+    symbol: 'DIRECTORY'
+  },
+  {
+    id: 1,
+    name: '表单',
+    symbol: 'MENU'
+  },
+  {
+    id: 2,
+    name: '片段',
+    symbol: 'FRAGMENT'
+  },
+  {
+    id: 3,
+    name: '按钮',
+    symbol: 'BUTTON'
+  }
+]);
+Vue.prototype.SysMenuType = SysMenuType;
+
+const SysDataPermType = new DictionaryBase([
+  {
+    id: 0,
+    name: '查看全部',
+    symbol: 'ALL'
+  },
+  {
+    id: 1,
+    name: '仅看自己',
+    symbol: 'ONLY_USER'
+  },
+  {
+    id: 2,
+    name: '仅看所在部门',
+    symbol: 'ONLY_DEPT'
+  },
+  {
+    id: 5,
+    name: '仅自选部门',
+    symbol: 'CUSTOM_DEPT'
+  }
+]);
+Vue.prototype.SysDataPermType = SysDataPermType;
+
+export {
+  DictionaryBase,
+  Gender,
+  Subject,
+  SysUserStatus,
+  SysUserType,
+  TeacherLevelType,
+  YesNo,
+  SysDataPermType,
+  SysPermModuleType,
+  SysPermCodeType,
+  SysMenuType
+}

orange-admin-web/src/store/actions.js

@@ -0,0 +1 @@
+export default {}

orange-admin-web/src/store/getters.js

@@ -0,0 +1,45 @@
+import { findMenuItem } from './utils';
+
+export default {
+  getCollapse: (state) => {
+    return state.isCollapse;
+  },
+  getClientHeight: (state) => {
+    return state.documentClientHeight;
+  },
+  getUserInfo: (state) => {
+    return state.userInfo;
+  },
+  getCachePages: (state) => {
+    return state.cachePages;
+  },
+  getTagList: (state) => {
+    return state.tagList;
+  },
+  getMenuList: (state) => {
+    return state.menuList;
+  },
+  getCurrentMenuId: (state) => {
+    return state.currentMenuId;
+  },
+  getMenuItem: (state) => {
+    if (Array.isArray(state.menuList)) {
+      for (let i = 0; i < state.menuList.length; i++) {
+        let temp = findMenuItem(state.menuList[i], state.currentMenuId);
+        if (temp != null) return temp;
+      }
+    }
+    return null;
+  },
+  getCurrentMenuPath: (state) => {
+    let menuPath = [];
+    if (Array.isArray(state.menuList)) {
+      for (let i = 0; i < state.menuList.length; i++) {
+        let temp = findMenuItem(state.menuList[i], state.currentMenuId, menuPath);
+        if (temp != null) break;
+      }
+    }
+
+    return menuPath;
+  }
+}

orange-admin-web/src/store/index.js

@@ -0,0 +1,15 @@
+import Vue from 'vue';
+import Vuex from 'vuex';
+import state from './state.js';
+import getters from './getters.js';
+import mutations from './mutations.js';
+import actions from './actions.js';
+
+Vue.use(Vuex);
+export default new Vuex.Store({
+  state,
+  getters,
+  mutations,
+  actions,
+  strict: process.env.NODE_ENV !== 'production'
+});

orange-admin-web/src/store/mutations.js

@@ -0,0 +1,133 @@
+import { initUserInfo, findMenuItem } from './utils';
+import { setObjectToSessionStorage, findItemFromList, treeDataTranslate } from '@/utils';
+
+export default {
+  setCollapse: (state, isCollapse) => {
+    state.isCollapse = isCollapse;
+  },
+  setClientHeight: (state, height) => {
+    state.documentClientHeight = height;
+  },
+  setUserInfo: (state, info) => {
+    setObjectToSessionStorage('userInfo', info);
+    state.userInfo = initUserInfo(info);
+  },
+  addCachePage (state, name) {
+    if (state.cachePages.indexOf(name) === -1) {
+      let temp = [...state.cachePages];
+      temp.push(name);
+      setObjectToSessionStorage('cachePages', temp);
+      state.cachePages = temp;
+    }
+  },
+  removeCachePage (state, name) {
+    let pos = state.cachePages.indexOf(name);
+    if (pos !== -1) {
+      let temp = [...state.cachePages];
+      temp.splice(pos, 1);
+      setObjectToSessionStorage('cachePages', temp);
+      state.cachePages = temp;
+    }
+  },
+  clearCachePage (state) {
+    setObjectToSessionStorage('cachePages', []);
+    state.cachePages = [];
+  },
+  addTag (state, id) {
+    if (id == null || id === '') return;
+    // 新增的标签是否存在
+    let tagList = state.tagList;
+    let tagItem = null;
+    if (Array.isArray(tagList)) {
+      tagItem = findItemFromList(tagList, id, 'menuId');
+    }
+    if (tagItem != null) return;
+    // 添加新增标签以及更新页面缓存
+    let menuList = state.menuList;
+    let menuObject = null;
+    if (Array.isArray(menuList)) {
+      for (let i = 0; i < menuList.length; i++) {
+        menuObject = findMenuItem(menuList[i], id);
+        if (menuObject != null) break;
+      }
+    }
+    if (menuObject != null) {
+      state.tagList = [...state.tagList, menuObject];
+      if (Array.isArray(state.cachePages) && state.cachePages.indexOf(menuObject.formRouterName) === -1) {
+        state.cachePages = [...state.cachePages, menuObject.formRouterName];
+      }
+    }
+    setObjectToSessionStorage('cachePages', state.cachePages);
+    setObjectToSessionStorage('tagList', state.tagList);
+  },
+  removeTag (state, id) {
+    if (id == null || id === '') return;
+    // 移除标签
+    let nextPos = -1;
+    let tagItem = null;
+    for (let i = 0; i < state.tagList.length; i++) {
+      if (state.tagList[i].menuId === id) {
+        tagItem = state.tagList[i];
+        state.tagList.splice(i, 1);
+        nextPos = Math.min(i, state.tagList.length - 1);
+      }
+    }
+    // let tagItem = findItemFromList(state.tagList, id, 'menuId', true);
+    if (tagItem == null) return;
+    // 移除页面缓存
+    findItemFromList(state.cachePages, tagItem.formRouterName, undefined, true);
+    setObjectToSessionStorage('cachePages', state.cachePages);
+    setObjectToSessionStorage('tagList', state.tagList);
+    // 如果移除的是当前显示页面，重新选择显示页面
+    let showTag = null;
+    if (state.currentMenuId === id) {
+      showTag = state.tagList[nextPos];
+      let tempId = (showTag || {}).menuId;
+      if (setObjectToSessionStorage('currentMenuId', tempId)) state.currentMenuId = tempId;
+    }
+  },
+  closeOtherTags (state, id) {
+    if (id == null || id === '') return;
+    // 移除其他所有标签
+    if (Array.isArray(state.tagList)) {
+      state.tagList = state.tagList.filter((item) => {
+        return item.menuId === id;
+      });
+    }
+
+    let menuObject = state.tagList[0];
+    if (menuObject && menuObject.formRouterName && menuObject.formRouterName !== '') {
+      state.cachePages = [menuObject.formRouterName];
+      if (setObjectToSessionStorage('currentMenuId', menuObject.menuId)) state.currentMenuId = menuObject.menuId;
+    }
+    setObjectToSessionStorage('cachePages', state.cachePages);
+    setObjectToSessionStorage('tagList', state.tagList);
+  },
+  clearAllTags (state) {
+    if (setObjectToSessionStorage('currentMenuId', undefined)) state.currentMenuId = undefined;
+    if (setObjectToSessionStorage('cachePages', [])) state.cachePages = [];
+    if (setObjectToSessionStorage('tagList', [])) state.tagList = [];
+  },
+  setMenuList: (state, list) => {
+    if (Array.isArray(list)) {
+      if (setObjectToSessionStorage('menuList', list)) state.menuList = treeDataTranslate(list, 'menuId', 'parentId');
+    }
+  },
+  setCurrentMenuId: (state, menuId) => {
+    let menuItem = null;
+    if (setObjectToSessionStorage('currentMenuId', menuId)) state.currentMenuId = menuId;
+    if (Array.isArray(state.tagList) && Array.isArray(state.menuList)) {
+      for (let i = 0; i < state.menuList.length; i++) {
+        menuItem = findMenuItem(state.menuList[i], menuId, 'menuId');
+        if (menuItem != null) {
+          let tagItem = findItemFromList(state.tagList, menuId, 'menuId');
+          if (tagItem == null) {
+            state.tagList = [...state.tagList, menuItem];
+            setObjectToSessionStorage('tagList', state.tagList);
+          }
+          break;
+        }
+      }
+    }
+  }
+}

orange-admin-web/src/store/state.js

@@ -0,0 +1,19 @@
+import { initUserInfo } from './utils';
+import { getObjectFromSessionStorage, treeDataTranslate } from '@/utils';
+
+export default {
+  // 是否左侧菜单折叠
+  isCollapse: false,
+  // 浏览器客户区高度
+  documentClientHeight: 100,
+  // 用户登录信息
+  userInfo: initUserInfo(),
+  // 缓存页面
+  cachePages: getObjectFromSessionStorage('cachePages', []),
+  // 当前标签
+  tagList: getObjectFromSessionStorage('tagList', []),
+  // 菜单列表
+  menuList: treeDataTranslate(getObjectFromSessionStorage('menuList', []), 'menuId', 'parentId'),
+  // 当前菜单
+  currentMenuId: getObjectFromSessionStorage('currentMenuId', undefined)
+}

orange-admin-web/src/store/utils/index.js

@@ -0,0 +1,36 @@
+import { getObjectFromSessionStorage } from '@/utils';
+
+function findMenuItem (menuItem, menuId, path) {
+  if (Array.isArray(path)) path.push(menuItem);
+  if ((menuItem.menuId + '') === (menuId + '')) return menuItem;
+
+  let bFind = false;
+  let findItem = null;
+  if (Array.isArray(menuItem.children)) {
+    for (let i = 0; i < menuItem.children.length; i++) {
+      findItem = findMenuItem(menuItem.children[i], menuId, path);
+      if (findItem != null) {
+        bFind = true;
+        break;
+      }
+    }
+  }
+
+  if (!bFind && Array.isArray(path)) path.pop();
+  return bFind ? findItem : null;
+}
+
+function initUserInfo (userInfo) {
+  if (userInfo == null) userInfo = getObjectFromSessionStorage('userInfo');
+
+  if (userInfo != null && userInfo.permCodeList != null && Array.isArray(userInfo.permCodeList)) {
+    userInfo.permCodeSet = new Set(userInfo.permCodeList);
+  }
+
+  return userInfo;
+}
+
+export {
+  findMenuItem,
+  initUserInfo
+}

orange-admin-web/src/utils/chartOption.js

@@ -0,0 +1,56 @@
+const defaultLineChartOption = {
+  grid: {
+    left: '3%',
+    right: '4%',
+    bottom: '20px',
+    containLabel: true
+  },
+  xAxis: {
+    axisLabel: {
+      interval: 0,
+      showMaxLabel: true
+    }
+  },
+  legend: {
+    top: '3%'
+  }
+}
+
+const defaultBarChartOption = {
+  grid: {
+    left: '3%',
+    right: '4%',
+    bottom: '20px',
+    containLabel: true
+  },
+  xAxis: {
+    axisLabel: {
+      interval: 0,
+      showMaxLabel: true
+    }
+  },
+  legend: {
+    top: '3%'
+  }
+}
+
+const defaultPieChartOption = {
+  grid: {
+    left: '3%',
+    right: '4%',
+    bottom: '20px',
+    containLabel: true
+  },
+  legend: {
+    top: '3%'
+  },
+  series: {
+    center: ['50%', '60%']
+  }
+}
+
+export {
+  defaultLineChartOption,
+  defaultBarChartOption,
+  defaultPieChartOption
+}

orange-admin-web/src/utils/index.js

@@ -0,0 +1,209 @@
+/**
+ * 列表数据转换树形数据
+ * @param {Array} data 要转换的列表
+ * @param {String} id 主键字段字段名
+ * @param {String} pid 父字段字段名
+ * @returns {Array} 转换后的树数据
+ */
+export function treeDataTranslate (data, id = 'id', pid = 'parentId') {
+  var res = []
+  var temp = {}
+  for (var i = 0; i < data.length; i++) {
+    temp[data[i][id]] = data[i]
+  }
+  for (var k = 0; k < data.length; k++) {
+    if (temp[data[k][pid]] && data[k][id] !== data[k][pid]) {
+      if (!temp[data[k][pid]]['children']) {
+        temp[data[k][pid]]['children'] = []
+      }
+      if (!temp[data[k][pid]]['_level']) {
+        temp[data[k][pid]]['_level'] = 1
+      }
+      data[k]['_level'] = temp[data[k][pid]]._level + 1
+      data[k]['_parent'] = data[k][pid]
+      temp[data[k][pid]]['children'].push(data[k])
+    } else {
+      res.push(data[k])
+    }
+  }
+
+  return res
+}
+/**
+ * 获取字符串字节长度（中文算2个字符）
+ * @param {String} str 要获取长度的字符串
+ */
+export function getStringLength (str) {
+  return str.replace(/[\u4e00-\u9fa5\uff00-\uffff]/g, '**').length
+}
+/**
+ * 获取uuid
+ */
+export function getUUID () {
+  return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, c => {
+    return (c === 'x' ? (Math.random() * 16 | 0) : ('r&0x3' | '0x8')).toString(16)
+  });
+}
+/**
+ * 大小驼峰变换函数
+ * @param name 要转换的字符串
+ * @param type 转换的类型0：转换成小驼峰，1：转换成大驼峰
+ */
+export function nameTranslate (name, type) {
+  name = name.toLowerCase();
+  let nameArray = name.split('_');
+  nameArray.forEach((item, index) => {
+    if (index === 0) {
+      name = type === 1 ? item.slice(0, 1).toUpperCase() + item.slice(1) : item;
+    } else {
+      name = name + item.slice(0, 1).toUpperCase() + item.slice(1);
+    }
+  });
+
+  nameArray = name.split('-');
+  nameArray.forEach((item, index) => {
+    if (index === 0) {
+      name = type === 1 ? item.slice(0, 1).toUpperCase() + item.slice(1) : item;
+    } else {
+      name = name + item.slice(0, 1).toUpperCase() + item.slice(1);
+    }
+  });
+  return name;
+}
+/**
+ * 通过id从树中获取指定的节点
+ * @param {Object} node 根节点
+ * @param {String|Nubmer} id 键值
+ * @param {Array} list 保存查询路径
+ * @param {String} idKey 主键字段名
+ * @param {String} childKey 子节点字段名
+ */
+function findNode (node, id, list, idKey = 'id', childKey = 'children') {
+  if (Array.isArray(list)) list.push(node[idKey]);
+  if (node[idKey] === id) {
+    return node;
+  }
+
+  if (node[childKey] != null && Array.isArray(node[childKey])) {
+    for (let i = 0; i < node[childKey].length; i++) {
+      let tempNode = findNode(node[childKey][i], id, list, idKey, childKey);
+      if (tempNode) return tempNode;
+    }
+  }
+
+  if (Array.isArray(list)) list.pop();
+}
+/**
+ * 通过id返回从根节点到指定节点的路径
+ * @param {Array} treeRoot 树根节点数组
+ * @param {*} id 要查询的节点的id
+ * @param {*} idKey 主键字段名
+ * @param {*} childKey 子节点字段名
+ */
+export function findTreeNodePath (treeRoot, id, idKey = 'id', childKey = 'children') {
+  let tempList = [];
+  for (let i = 0; i < treeRoot.length; i++) {
+    if (findNode(treeRoot[i], id, tempList, idKey, childKey)) {
+      return tempList;
+    }
+  }
+
+  return [];
+}
+/**
+ * 通过id从树中查找节点
+ * @param {Array} treeRoot 根节点数组
+ * @param {*} id 要查找的节点的id
+ * @param {*} idKey 主键字段名
+ * @param {*} childKey 子节点字段名
+ */
+export function findTreeNode (treeRoot, id, idKey = 'id', childKey = 'children') {
+  for (let i = 0; i < treeRoot.length; i++) {
+    let tempNode = findNode(treeRoot[i], id, undefined, idKey, childKey);
+    if (tempNode) return tempNode;
+  }
+}
+/**
+ * 把Object转换成query字符串
+ * @param {Object} params 要转换的Object
+ */
+export function objectToQueryString (params) {
+  if (params == null) {
+    return null;
+  } else {
+    return Object.keys(params).map((key) => {
+      return `${key}=${params[key]}`;
+    }).join('&');
+  }
+}
+/**
+ * 从数组中查找某一项
+ * @param {Array} list 要查找的数组
+ * @param {String} id 要查找的节点id
+ * @param {String} idKey 主键字段名（如果为null则直接比较）
+ * @param {Boolean} removeItem 是否从数组中移除查找到的节点
+ * @returns {Object} 找到返回节点，没找到返回undefined
+ */
+export function findItemFromList (list, id, idKey, removeItem = false) {
+  if (Array.isArray(list) && list.length > 0 && id != null) {
+    for (let i = 0; i < list.length; i++) {
+      let item = list[i];
+      if (((idKey == null || idKey === '') && item === id) || (idKey != null && item[idKey] === id)) {
+        if (removeItem) list.splice(i, 1);
+        return item;
+      }
+    }
+  }
+  return null;
+}
+/**
+ * 将数据保存到sessionStorage
+ * @param {*} key sessionStorage的键值
+ * @param {*} value 要保存的数据
+ */
+export function setObjectToSessionStorage (key, value) {
+  if (key == null || key === '') return false;
+  if (value == null) {
+    window.sessionStorage.removeItem(key);
+    return true;
+  } else {
+    let jsonObj = {
+      data: value
+    }
+    window.sessionStorage.setItem(key, JSON.stringify(jsonObj));
+    return true;
+  }
+}
+/**
+ * 从sessionStorage里面获取数据
+ * @param {String} key 键值
+ * @param {*} defaultValue 默认值
+ */
+export function getObjectFromSessionStorage (key, defaultValue) {
+  let jsonObj = null;
+  try {
+    jsonObj = JSON.parse(window.sessionStorage.getItem(key));
+    jsonObj = (jsonObj || {}).data;
+  } catch (e) {
+    jsonObj = defaultValue;
+  };
+  return (jsonObj != null) ? jsonObj : defaultValue;
+}
+/**
+ * 判读字符串是否一个数字
+ * @param {String} str 要判断的字符串
+ */
+export function isNumber (str) {
+  let num = Number.parseFloat(str);
+  if (Number.isNaN(num)) return false;
+  return num.toString() === str;
+}
+/**
+ * 生成随机数
+ * @param {Integer} min 随机数最小值
+ * @param {Integer} max 随机数最大值
+ */
+export function random (min, max) {
+  let base = Math.random();
+  return min + base * (max - min);
+}

orange-admin-web/src/utils/validate.js

@@ -0,0 +1,33 @@
+const pattern = {
+  mobie: /^((\+?86)|(\(\+86\)))?(13[012356789][0-9]{8}|15[012356789][0-9]{8}|18[02356789][0-9]{8}|147[0-9]{8}|1349[0-9]{7})$/,
+  english: /^[a-zA-Z]+$/,
+  englishAndNumber: /^[a-zA-Z0-9]+$/
+}
+
+/**
+ * 邮箱
+ * @param str
+ */
+export function isEmail (str) {
+  return /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+((.[a-zA-Z0-9_-]{2,3}){1,2})$/.test(str)
+}
+
+/**
+ * 手机号码
+ * @param str
+ */
+export function isMobile (str) {
+  return /^((\+?86)|(\(\+86\)))?(13[012356789][0-9]{8}|15[012356789][0-9]{8}|18[02356789][0-9]{8}|147[0-9]{8}|1349[0-9]{7})$/.test(str)
+}
+
+/**
+ * 电话号码
+ * @param str
+ */
+export function isPhone (str) {
+  return /^([0-9]{3,4}-)?[0-9]{7,8}$/.test(str)
+}
+
+export default {
+  pattern
+}

orange-admin-web/src/utils/widget.js

@@ -0,0 +1,297 @@
+import { Message } from 'element-ui';
+import { treeDataTranslate } from '@/utils';
+
+const DEFAULT_PAGE_SIZE = 10;
+
+export class DropdownWidget {
+  /**
+   * 下拉组件（Select、Cascade、TreeSelect等）
+   * @param {function () : Promise} loadDropdownData 下拉数据获取函数
+   * @param {Boolean} isTree 是否是树数据
+   * @param {String} idKey 键字段字段名
+   * @param {String} parentIdKey 父字段字段名
+   */
+  constructor (loadDropdownData, isTree = false, idKey = 'id', parentIdKey = 'parentId') {
+    this.loading = false;
+    this.dirty = true;
+    this.dropdownList = [];
+    this.isTree = isTree;
+    this.idKey = idKey;
+    this.parentIdKey = parentIdKey;
+    this.loadDropdownData = loadDropdownData;
+    this.setDropdownList = this.setDropdownList.bind(this);
+    this.onVisibleChange = this.onVisibleChange.bind(this);
+  }
+  /**
+   * 重新获取下拉数据
+   */
+  reloadDropdownData () {
+    return new Promise((resolve, reject) => {
+      if (!this.loading) {
+        if (typeof this.loadDropdownData === 'function') {
+          this.loading = true;
+          this.loadDropdownData().then(dataList => {
+            this.setDropdownList(dataList);
+            this.loading = false;
+            this.dirty = false;
+            resolve(this.dropdownList);
+          }).catch(e => {
+            this.setDropdownList([]);
+            this.loading = false;
+            reject(this.dropdownList);
+          });
+        } else {
+          reject(new Error('获取下拉数据失败'));
+        }
+      } else {
+        resolve(this.dropdownList);
+      }
+    });
+  }
+  /**
+   * 下拉框显示或隐藏时调用
+   * @param {Boolean} isShow 正在显示或者隐藏
+   */
+  onVisibleChange (isShow) {
+    return new Promise((resolve, reject) => {
+      if (isShow && this.dirty && !this.loading) {
+        this.reloadDropdownData().then(res => {
+          resolve(res);
+        }).catch(e => {
+          reject(e);
+        });
+      } else {
+        resolve(this.dropdownList);
+      }
+    });
+  }
+  /**
+   * 设置下拉数据
+   * @param {Array} dataList 要显示的下拉数据
+   */
+  setDropdownList (dataList) {
+    if (Array.isArray(dataList)) {
+      this.dropdownList = this.isTree ? treeDataTranslate(dataList, this.idKey, this.parentIdKey) : dataList;
+    }
+  }
+}
+
+export class TableWidget {
+  /**
+   * 表格组件
+   * @param {function (params: Object) : Promise} loadTableData 表数据获取函数
+   * @param {function () : Boolean} verifyTableParameter 表数据获取检验函数
+   * @param {Boolean} paged 是否支持分页
+   * @param {String} orderFieldName 默认排序字段
+   * @param {Boolean} ascending 默认排序方式（true为正序，false为倒序）
+   * @param {String} dateAggregateBy 默认排序字段的日期统计类型
+   */
+  constructor (loadTableData, verifyTableParameter, paged, orderFieldName, ascending, dateAggregateBy) {
+    this.oldPage = 0;
+    this.currentPage = 1;
+    this.oldPageSize = DEFAULT_PAGE_SIZE;
+    this.pageSize = DEFAULT_PAGE_SIZE;
+    this.totalCount = 0;
+    this.dataList = [];
+    this.orderInfo = {
+      fieldName: orderFieldName,
+      asc: ascending,
+      dateAggregateBy: dateAggregateBy
+    };
+    this.paged = paged;
+    this.searchVerify = verifyTableParameter || function () { return true; };
+    this.loadTableData = loadTableData || function () { return Promise.resolve(); };
+    this.onCurrentPageChange = this.onCurrentPageChange.bind(this);
+    this.onPageSizeChange = this.onPageSizeChange.bind(this);
+    this.onSortChange = this.onSortChange.bind(this);
+    this.getTableIndex = this.getTableIndex.bind(this);
+  }
+  /**
+   * 表格分页变化
+   * @param {Integer} newCurrentPage 变化后的显示页面
+   */
+  onCurrentPageChange (newCurrentPage) {
+    this.loadTableDataImpl(newCurrentPage, this.pageSize).then(() => {
+      this.oldPage = this.currentPage = newCurrentPage;
+    }).catch(() => {
+      this.currentPage = this.oldPage;
+    });
+  }
+  /**
+   * 表格分页每页显示数量变化
+   * @param {Integer} newPageSize 变化后的每页显示数量
+   */
+  onPageSizeChange (newPageSize) {
+    this.loadTableDataImpl(1, newPageSize).then(() => {
+      this.oldPage = this.currentPage = 1;
+      this.oldPageSize = this.pageSize = newPageSize;
+    }).catch(e => {
+      this.currentPage = this.oldPage;
+      this.pageSize = this.oldPageSize;
+    });
+  }
+  /**
+   * 表格排序字段变化
+   * @param {String} prop 排序字段的字段名
+   * @param {String} order 正序还是倒序
+   */
+  onSortChange ({ prop, order }) {
+    this.orderInfo.fieldName = prop;
+    this.orderInfo.asc = (order === 'ascending');
+    this.refreshTable();
+  }
+  /**
+   * 获取每一行的index信息
+   * @param {Integer} index 表格在本页位置
+   */
+  getTableIndex (index) {
+    return this.paged ? ((this.currentPage - 1) * this.pageSize + (index + 1)) : (index + 1);
+  }
+  /**
+   * 获取表格数据
+   * @param {Integer} pageNum 当前分页
+   * @param {Integer} pageSize 每页数量
+   * @param {Boolean} reload 是否重新获取数据
+   */
+  loadTableDataImpl (pageNum, pageSize, reload = false) {
+    return new Promise((resolve, reject) => {
+      if (typeof this.loadTableData !== 'function') {
+        reject();
+      } else {
+        // 如果pageSize和pageNum没有变化，并且不强制刷新
+        if (this.paged && !reload && this.oldPage === pageNum && this.oldPageSize === pageSize) {
+          resolve();
+        } else {
+          let params = {};
+          if (this.orderInfo.fieldName != null) params.orderParam = [this.orderInfo];
+          if (this.paged) {
+            params.pageParam = {
+              pageNum,
+              pageSize
+            }
+          }
+          this.loadTableData(params).then(tableData => {
+            this.dataList = tableData.dataList;
+            this.totalCount = tableData.totalCount;
+            resolve();
+          }).catch(e => {
+            reject(e);
+          });
+        }
+      }
+    });
+  }
+  /**
+   * 刷新表格数据
+   * @param {Boolean} research 是否按照新的查询条件重新查询（调用verify函数）
+   * @param {Integer} pageNum 当前页面
+   */
+  refreshTable (research = false, pageNum = undefined, showMsg = false) {
+    let reload = false;
+    if (research) {
+      if (typeof this.searchVerify === 'function' && !this.searchVerify()) return;
+      reload = true;
+    }
+
+    if (Number.isInteger(pageNum) && pageNum !== this.currentPage) {
+      this.loadTableDataImpl(pageNum, this.pageSize, reload).then(res => {
+        this.oldPage = this.currentPage = pageNum;
+        if (research && showMsg) Message.success('查询成功');
+      }).catch(e => {
+        this.currentPage = this.oldPage;
+      });
+    } else {
+      this.loadTableDataImpl(this.currentPage, this.pageSize, true).catch(e => {});
+    }
+  }
+}
+
+export class UploadWidget {
+  /**
+   * 上传组件
+   * @param {Integer} maxCount 最大上传数量
+   */
+  constructor (maxCount = 1) {
+    this.maxCount = maxCount;
+    this.fileList = [];
+    this.onFileChange = this.onFileChange.bind(this);
+  }
+  /**
+   * 上传文件列表改变
+   * @param {Object} file 改变的文件
+   * @param {Array} fileList 改变后的文件列表
+   */
+  onFileChange (file, fileList) {
+    if (Array.isArray(fileList) && fileList.length > 0) {
+      if (this.maxCount === 1) {
+        this.fileList = [fileList[fileList.length - 1]];
+      } else {
+        this.fileList = fileList;
+      }
+    } else {
+      this.fileList = [];
+    }
+    return this.fileList;
+  }
+}
+
+export class ChartWidget {
+  /**
+   * 图表组件
+   * @param {function (params) : Promise} loadTableData chart数据获取函数
+   * @param {function () : Boolean} verifyTableParameter 数据参数检验函数
+   * @param {Array} columns 数据列
+   */
+  constructor (loadTableData, verifyTableParameter, columns) {
+    this.columns = columns;
+    this.loading = false;
+    this.dataEmpty = false;
+    this.chartData = undefined;
+    this.chartObject = undefined;
+    this.dimensionMaps = new Map();
+    this.chartSetting = undefined;
+    this.searchVerify = verifyTableParameter || function () { return true; };
+    this.loadTableData = loadTableData || function () { return Promise.resolve(); };
+  }
+  /**
+   * 获取图表数据
+   * @param {Boolean} reload 是否重新获取数据
+   */
+  loadChartDataImpl (reload = false) {
+    return new Promise((resolve, reject) => {
+      if (typeof this.loadTableData !== 'function') {
+        reject();
+      } else {
+        if (!reload) {
+          resolve();
+        } else {
+          this.loading = true;
+          this.loadTableData().then(tableData => {
+            this.chartData = {
+              columns: this.columns,
+              rows: tableData.dataList
+            }
+            this.loading = false;
+            if (this.chartObject) this.chartObject.resize();
+            resolve();
+          }).catch(e => {
+            console.error(e);
+            this.loading = false;
+            reject(e);
+          });
+        }
+      }
+    });
+  }
+  /**
+   * 刷新图表数据
+   * @param {Boolean} research 是否按照新的查询条件重新查询（调用verify函数）
+   */
+  refreshChart (research = false) {
+    if (research) {
+      if (typeof this.searchVerify === 'function' && !this.searchVerify()) return;
+    }
+
+    this.loadChartDataImpl(true).catch(e => {});
+  }
+}

orange-admin-web/src/views/generated/formCreateTeacher/index.vue

@@ -0,0 +1,370 @@
+<template>
+  <div class="form-single-fragment" style="position: relative;">
+    <el-form ref="formCreateTeacher" :model="formData" class="full-width-input" :rules="rules" style="width: 100%;"
+      label-width="100px" size="mini" label-position="right" @submit.native.prevent>
+      <el-row :gutter="20">
+        <el-col :span="12">
+          <el-form-item label="教师名称" prop="Teacher.teacherName">
+            <el-input class="input-item" v-model="formData.Teacher.teacherName"
+              :clearable="true" placeholder="教师名称" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="出生日期" prop="Teacher.birthday">
+            <el-date-picker class="input-item" v-model="formData.Teacher.birthday" :clearable="true"
+              placeholder="出生日期" type="date" align="left"
+              format="yyyy-MM-dd" value-format="yyyy-MM-dd hh:mm:ss" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="性别" prop="Teacher.gender">
+            <el-select class="input-item" v-model="formData.Teacher.gender" :clearable="true" filterable
+              placeholder="性别" :loading="formCreateTeacher.gender.impl.loading"
+              @visible-change="formCreateTeacher.gender.impl.onVisibleChange"
+              @change="onGenderValueChange">
+              <el-option v-for="item in formCreateTeacher.gender.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
+            </el-select>
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="所教科目" prop="Teacher.subjectId">
+            <el-select class="input-item" v-model="formData.Teacher.subjectId" :clearable="true" filterable
+              placeholder="所教科目" :loading="formCreateTeacher.subjectId.impl.loading"
+              @visible-change="formCreateTeacher.subjectId.impl.onVisibleChange"
+              @change="onSubjectIdValueChange">
+              <el-option v-for="item in formCreateTeacher.subjectId.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
+            </el-select>
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="职级" prop="Teacher.level">
+            <el-select class="input-item" v-model="formData.Teacher.level" :clearable="true" filterable
+              placeholder="职级" :loading="formCreateTeacher.level.impl.loading"
+              @visible-change="formCreateTeacher.level.impl.onVisibleChange"
+              @change="onLevelValueChange">
+              <el-option v-for="item in formCreateTeacher.level.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
+            </el-select>
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="鲜花数量" prop="Teacher.flowerCount">
+            <el-input-number class="input-item" v-model="formData.Teacher.flowerCount"
+              :clearable="true" controls-position="right" placeholder="鲜花数量" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="所属校区" prop="Teacher.schoolId">
+            <el-select class="input-item" v-model="formData.Teacher.schoolId" :clearable="true" filterable
+              placeholder="所属校区" :loading="formCreateTeacher.schoolId.impl.loading"
+              @visible-change="formCreateTeacher.schoolId.impl.onVisibleChange"
+              @change="onSchoolIdValueChange">
+              <el-option v-for="item in formCreateTeacher.schoolId.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
+            </el-select>
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="绑定用户" prop="Teacher.userId">
+            <el-select class="input-item" v-model="formData.Teacher.userId" :clearable="true" filterable
+              placeholder="绑定用户" :loading="formCreateTeacher.userId.impl.loading"
+              @visible-change="formCreateTeacher.userId.impl.onVisibleChange"
+              @change="onUserIdValueChange">
+              <el-option v-for="item in formCreateTeacher.userId.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
+            </el-select>
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="是否在职" prop="Teacher.available">
+            <el-select class="input-item" v-model="formData.Teacher.available" :clearable="true" filterable
+              placeholder="是否在职" :loading="formCreateTeacher.available.impl.loading"
+              @visible-change="formCreateTeacher.available.impl.onVisibleChange"
+              @change="onAvailableValueChange">
+              <el-option v-for="item in formCreateTeacher.available.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
+            </el-select>
+          </el-form-item>
+        </el-col>
+        <el-col :span="24">
+          <el-row class="no-scroll flex-box" type="flex" justify="end">
+            <el-button type="primary" size="mini" :plain="true"
+              @click="onCancel(false)">
+              取消
+            </el-button>
+            <el-button type="primary" size="mini" :disabled="!checkPermCodeExist('formCreateTeacher:formCreateTeacher:add')"
+              @click="onAddClick()">
+              保存
+            </el-button>
+          </el-row>
+        </el-col>
+      </el-row>
+    </el-form>
+  </div>
+</template>
+
+<script>
+/* eslint-disable-next-line */
+import { DropdownWidget, TableWidget, UploadWidget, ChartWidget } from '@/utils/widget.js';
+/* eslint-disable-next-line */
+import { uploadMixin, statsDateRangeMixin } from '@/core/mixins';
+/* eslint-disable-next-line */
+import { TeacherController, DictionaryController } from '@/api';
+
+export default {
+  name: 'formCreateTeacher',
+  props: {
+  },
+  mixins: [uploadMixin, statsDateRangeMixin],
+  data () {
+    return {
+      formData: {
+        Teacher: {
+          teacherId: undefined,
+          teacherName: undefined,
+          birthday: undefined,
+          gender: undefined,
+          subjectId: undefined,
+          level: undefined,
+          flowerCount: undefined,
+          schoolId: undefined,
+          userId: undefined,
+          registerDate: undefined,
+          available: undefined,
+          sysDept: {
+            deptId: undefined,
+            deptName: undefined,
+            showOrder: undefined,
+            deletedFlag: undefined,
+            createUserId: undefined,
+            createUsername: undefined,
+            createTime: undefined,
+            updateTime: undefined
+          },
+          isDatasourceInit: false
+        }
+      },
+      rules: {
+        'Teacher.teacherName': [
+          {required: true, message: '请输入教师名称', trigger: 'blur'}
+        ],
+        'Teacher.birthday': [
+          {required: true, message: '请输入出生日期', trigger: 'blur'}
+        ],
+        'Teacher.gender': [
+          {required: true, message: '请输入性别', trigger: 'blur'}
+        ],
+        'Teacher.subjectId': [
+          {required: true, message: '请输入所教科目', trigger: 'blur'}
+        ],
+        'Teacher.level': [
+          {required: true, message: '请输入职级', trigger: 'blur'}
+        ],
+        'Teacher.flowerCount': [
+          {type: 'integer', message: '鲜花数量只允许输入整数', trigger: 'blur', transform: (value) => Number(value)},
+          {type: 'number', min: 0, message: '鲜花数量必须大于0', trigger: 'blur', transform: (value) => Number(value)}
+        ],
+        'Teacher.schoolId': [
+          {required: true, message: '请输入所属校区', trigger: 'blur'}
+        ],
+        'Teacher.userId': [
+          {required: true, message: '请输入绑定用户', trigger: 'blur'}
+        ],
+        'Teacher.available': [
+          {required: true, message: '请输入是否在职', trigger: 'blur'}
+        ]
+      },
+      formCreateTeacher: {
+        formFilter: {
+        },
+        formFilterCopy: {
+        },
+        gender: {
+          impl: new DropdownWidget(this.loadGenderDropdownList)
+        },
+        subjectId: {
+          impl: new DropdownWidget(this.loadSubjectIdDropdownList)
+        },
+        level: {
+          impl: new DropdownWidget(this.loadLevelDropdownList)
+        },
+        schoolId: {
+          impl: new DropdownWidget(this.loadSchoolIdDropdownList)
+        },
+        userId: {
+          impl: new DropdownWidget(this.loadUserIdDropdownList)
+        },
+        available: {
+          impl: new DropdownWidget(this.loadAvailableDropdownList)
+        },
+        menu: {
+          isInit: false
+        },
+        isInit: false
+      }
+    }
+  },
+  methods: {
+    onCancel (isSuccess) {
+      if (this.observer != null) {
+        this.observer.cancel(isSuccess);
+      }
+    },
+    /**
+     * 性别下拉数据获取函数
+     */
+    loadGenderDropdownList () {
+      return new Promise((resolve, reject) => {
+        let params = {};
+        DictionaryController.dictGender(this, params).then(res => {
+          resolve(res.getList());
+        }).catch(e => {
+          reject(e);
+        });
+      });
+    },
+    /**
+     * 性别选中值改变
+     */
+    onGenderValueChange (value) {
+    },
+    /**
+     * 所教科目下拉数据获取函数
+     */
+    loadSubjectIdDropdownList () {
+      return new Promise((resolve, reject) => {
+        let params = {};
+        DictionaryController.dictSubject(this, params).then(res => {
+          resolve(res.getList());
+        }).catch(e => {
+          reject(e);
+        });
+      });
+    },
+    /**
+     * 所教科目选中值改变
+     */
+    onSubjectIdValueChange (value) {
+    },
+    /**
+     * 职级下拉数据获取函数
+     */
+    loadLevelDropdownList () {
+      return new Promise((resolve, reject) => {
+        let params = {};
+        DictionaryController.dictTeacherLevelType(this, params).then(res => {
+          resolve(res.getList());
+        }).catch(e => {
+          reject(e);
+        });
+      });
+    },
+    /**
+     * 职级选中值改变
+     */
+    onLevelValueChange (value) {
+    },
+    /**
+     * 所属校区下拉数据获取函数
+     */
+    loadSchoolIdDropdownList () {
+      return new Promise((resolve, reject) => {
+        let params = {};
+        DictionaryController.dictSysDept(this, params).then(res => {
+          resolve(res.getList());
+        }).catch(e => {
+          reject(e);
+        });
+      });
+    },
+    /**
+     * 所属校区选中值改变
+     */
+    onSchoolIdValueChange (value) {
+      // 清除被过滤组件选中值，并且将被过滤组件的状态设置为dirty
+      this.formData.Teacher.userId = undefined;
+      this.formCreateTeacher.userId.impl.dirty = true;
+      this.onUserIdValueChange(this.formData.Teacher.userId);
+    },
+    /**
+     * 绑定用户下拉数据获取函数
+     */
+    loadUserIdDropdownList () {
+      return new Promise((resolve, reject) => {
+        let params = {
+          deptId: this.formData.Teacher.schoolId
+        };
+        DictionaryController.dictSysUser(this, params).then(res => {
+          resolve(res.getList());
+        }).catch(e => {
+          reject(e);
+        });
+      });
+    },
+    /**
+     * 绑定用户选中值改变
+     */
+    onUserIdValueChange (value) {
+    },
+    /**
+     * 是否在职下拉数据获取函数
+     */
+    loadAvailableDropdownList () {
+      return new Promise((resolve, reject) => {
+        let params = {};
+        DictionaryController.dictYesNo(this, params).then(res => {
+          resolve(res.getList());
+        }).catch(e => {
+          reject(e);
+        });
+      });
+    },
+    /**
+     * 是否在职选中值改变
+     */
+    onAvailableValueChange (value) {
+    },
+    /**
+     * 更新新建老师
+     */
+    refreshFormCreateTeacher (reloadData = false) {
+      if (!this.formCreateTeacher.isInit) {
+        // 初始化下拉数据
+      }
+      this.formCreateTeacher.isInit = true;
+    },
+    /**
+     * 保存
+     */
+    onAddClick () {
+      this.$refs.formCreateTeacher.validate((valid) => {
+        if (!valid) return;
+        let params = {
+          teacher: {
+            teacherName: this.formData.Teacher.teacherName,
+            birthday: this.formData.Teacher.birthday,
+            gender: this.formData.Teacher.gender,
+            subjectId: this.formData.Teacher.subjectId,
+            level: this.formData.Teacher.level,
+            flowerCount: this.formData.Teacher.flowerCount,
+            schoolId: this.formData.Teacher.schoolId,
+            userId: this.formData.Teacher.userId,
+            available: this.formData.Teacher.available
+          }
+        };
+
+        TeacherController.add(this, params).then(res => {
+          this.$message.success('保存成功');
+          this.onCancel(true);
+        }).catch(e => {});
+      });
+    },
+    initFormData () {
+    },
+    formInit () {
+      this.refreshFormCreateTeacher();
+    }
+  },
+  computed: {
+  },
+  created () {
+    this.formInit();
+  }
+}
+</script>

orange-admin-web/src/views/generated/formEditTeacher/index.vue

@@ -0,0 +1,402 @@
+<template>
+  <div class="form-single-fragment" style="position: relative;">
+    <el-form ref="formEditTeacher" :model="formData" class="full-width-input" :rules="rules" style="width: 100%;"
+      label-width="100px" size="mini" label-position="right" @submit.native.prevent>
+      <el-row :gutter="20">
+        <el-col :span="12">
+          <el-form-item label="教师名称" prop="Teacher.teacherName">
+            <el-input class="input-item" v-model="formData.Teacher.teacherName"
+              :clearable="true" placeholder="教师名称" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="出生日期" prop="Teacher.birthday">
+            <el-date-picker class="input-item" v-model="formData.Teacher.birthday" :clearable="true"
+              placeholder="出生日期" type="date" align="left"
+              format="yyyy-MM-dd" value-format="yyyy-MM-dd hh:mm:ss" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="性别" prop="Teacher.gender">
+            <el-select class="input-item" v-model="formData.Teacher.gender" :clearable="true" filterable
+              placeholder="性别" :loading="formEditTeacher.gender.impl.loading"
+              @visible-change="formEditTeacher.gender.impl.onVisibleChange"
+              @change="onGenderValueChange">
+              <el-option v-for="item in formEditTeacher.gender.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
+            </el-select>
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="所教科目" prop="Teacher.subjectId">
+            <el-select class="input-item" v-model="formData.Teacher.subjectId" :clearable="true" filterable
+              placeholder="所教科目" :loading="formEditTeacher.subjectId.impl.loading"
+              @visible-change="formEditTeacher.subjectId.impl.onVisibleChange"
+              @change="onSubjectIdValueChange">
+              <el-option v-for="item in formEditTeacher.subjectId.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
+            </el-select>
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="职级" prop="Teacher.level">
+            <el-select class="input-item" v-model="formData.Teacher.level" :clearable="true" filterable
+              placeholder="职级" :loading="formEditTeacher.level.impl.loading"
+              @visible-change="formEditTeacher.level.impl.onVisibleChange"
+              @change="onLevelValueChange">
+              <el-option v-for="item in formEditTeacher.level.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
+            </el-select>
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="鲜花数量" prop="Teacher.flowerCount">
+            <el-input-number class="input-item" v-model="formData.Teacher.flowerCount"
+              :clearable="true" controls-position="right" placeholder="鲜花数量" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="所属校区" prop="Teacher.schoolId">
+            <el-select class="input-item" v-model="formData.Teacher.schoolId" :clearable="true" filterable
+              placeholder="所属校区" :loading="formEditTeacher.schoolId.impl.loading"
+              @visible-change="formEditTeacher.schoolId.impl.onVisibleChange"
+              @change="onSchoolIdValueChange">
+              <el-option v-for="item in formEditTeacher.schoolId.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
+            </el-select>
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="绑定用户" prop="Teacher.userId">
+            <el-select class="input-item" v-model="formData.Teacher.userId" :clearable="true" filterable
+              placeholder="绑定用户" :loading="formEditTeacher.userId.impl.loading"
+              @visible-change="formEditTeacher.userId.impl.onVisibleChange"
+              @change="onUserIdValueChange">
+              <el-option v-for="item in formEditTeacher.userId.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
+            </el-select>
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="是否在职" prop="Teacher.available">
+            <el-select class="input-item" v-model="formData.Teacher.available" :clearable="true" filterable
+              placeholder="是否在职" :loading="formEditTeacher.available.impl.loading"
+              @visible-change="formEditTeacher.available.impl.onVisibleChange"
+              @change="onAvailableValueChange">
+              <el-option v-for="item in formEditTeacher.available.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
+            </el-select>
+          </el-form-item>
+        </el-col>
+        <el-col :span="24">
+          <el-row class="no-scroll flex-box" type="flex" justify="end">
+            <el-button type="primary" size="mini" :plain="true"
+              @click="onCancel(false)">
+              取消
+            </el-button>
+            <el-button type="primary" size="mini" :disabled="!checkPermCodeExist('formEditTeacher:formEditTeacher:update')"
+              @click="onUpdateClick()">
+              保存
+            </el-button>
+          </el-row>
+        </el-col>
+      </el-row>
+    </el-form>
+  </div>
+</template>
+
+<script>
+/* eslint-disable-next-line */
+import { DropdownWidget, TableWidget, UploadWidget, ChartWidget } from '@/utils/widget.js';
+/* eslint-disable-next-line */
+import { uploadMixin, statsDateRangeMixin } from '@/core/mixins';
+/* eslint-disable-next-line */
+import { TeacherController, DictionaryController } from '@/api';
+
+export default {
+  name: 'formEditTeacher',
+  props: {
+    teacherId: {
+      default: undefined
+    }
+  },
+  mixins: [uploadMixin, statsDateRangeMixin],
+  data () {
+    return {
+      formData: {
+        Teacher: {
+          teacherId: undefined,
+          teacherName: undefined,
+          birthday: undefined,
+          gender: undefined,
+          subjectId: undefined,
+          level: undefined,
+          flowerCount: undefined,
+          schoolId: undefined,
+          userId: undefined,
+          registerDate: undefined,
+          available: undefined,
+          sysDept: {
+            deptId: undefined,
+            deptName: undefined,
+            showOrder: undefined,
+            deletedFlag: undefined,
+            createUserId: undefined,
+            createUsername: undefined,
+            createTime: undefined,
+            updateTime: undefined
+          },
+          isDatasourceInit: false
+        }
+      },
+      rules: {
+        'Teacher.teacherName': [
+          {required: true, message: '请输入教师名称', trigger: 'blur'}
+        ],
+        'Teacher.birthday': [
+          {required: true, message: '请输入出生日期', trigger: 'blur'}
+        ],
+        'Teacher.gender': [
+          {required: true, message: '请输入性别', trigger: 'blur'}
+        ],
+        'Teacher.subjectId': [
+          {required: true, message: '请输入所教科目', trigger: 'blur'}
+        ],
+        'Teacher.level': [
+          {required: true, message: '请输入职级', trigger: 'blur'}
+        ],
+        'Teacher.flowerCount': [
+          {type: 'integer', message: '鲜花数量只允许输入整数', trigger: 'blur', transform: (value) => Number(value)},
+          {type: 'number', min: 0, message: '鲜花数量必须大于0', trigger: 'blur', transform: (value) => Number(value)}
+        ],
+        'Teacher.schoolId': [
+          {required: true, message: '请输入所属校区', trigger: 'blur'}
+        ],
+        'Teacher.userId': [
+          {required: true, message: '请输入绑定用户', trigger: 'blur'}
+        ],
+        'Teacher.available': [
+          {required: true, message: '请输入是否在职', trigger: 'blur'}
+        ]
+      },
+      formEditTeacher: {
+        formFilter: {
+        },
+        formFilterCopy: {
+        },
+        gender: {
+          impl: new DropdownWidget(this.loadGenderDropdownList)
+        },
+        subjectId: {
+          impl: new DropdownWidget(this.loadSubjectIdDropdownList)
+        },
+        level: {
+          impl: new DropdownWidget(this.loadLevelDropdownList)
+        },
+        schoolId: {
+          impl: new DropdownWidget(this.loadSchoolIdDropdownList)
+        },
+        userId: {
+          impl: new DropdownWidget(this.loadUserIdDropdownList)
+        },
+        available: {
+          impl: new DropdownWidget(this.loadAvailableDropdownList)
+        },
+        menu: {
+          isInit: false
+        },
+        isInit: false
+      }
+    }
+  },
+  methods: {
+    onCancel (isSuccess) {
+      if (this.observer != null) {
+        this.observer.cancel(isSuccess);
+      }
+    },
+    /**
+     * 性别下拉数据获取函数
+     */
+    loadGenderDropdownList () {
+      return new Promise((resolve, reject) => {
+        let params = {};
+        DictionaryController.dictGender(this, params).then(res => {
+          resolve(res.getList());
+        }).catch(e => {
+          reject(e);
+        });
+      });
+    },
+    /**
+     * 性别选中值改变
+     */
+    onGenderValueChange (value) {
+    },
+    /**
+     * 所教科目下拉数据获取函数
+     */
+    loadSubjectIdDropdownList () {
+      return new Promise((resolve, reject) => {
+        let params = {};
+        DictionaryController.dictSubject(this, params).then(res => {
+          resolve(res.getList());
+        }).catch(e => {
+          reject(e);
+        });
+      });
+    },
+    /**
+     * 所教科目选中值改变
+     */
+    onSubjectIdValueChange (value) {
+    },
+    /**
+     * 职级下拉数据获取函数
+     */
+    loadLevelDropdownList () {
+      return new Promise((resolve, reject) => {
+        let params = {};
+        DictionaryController.dictTeacherLevelType(this, params).then(res => {
+          resolve(res.getList());
+        }).catch(e => {
+          reject(e);
+        });
+      });
+    },
+    /**
+     * 职级选中值改变
+     */
+    onLevelValueChange (value) {
+    },
+    /**
+     * 所属校区下拉数据获取函数
+     */
+    loadSchoolIdDropdownList () {
+      return new Promise((resolve, reject) => {
+        let params = {};
+        DictionaryController.dictSysDept(this, params).then(res => {
+          resolve(res.getList());
+        }).catch(e => {
+          reject(e);
+        });
+      });
+    },
+    /**
+     * 所属校区选中值改变
+     */
+    onSchoolIdValueChange (value) {
+      // 清除被过滤组件选中值，并且将被过滤组件的状态设置为dirty
+      this.formData.Teacher.userId = undefined;
+      this.formEditTeacher.userId.impl.dirty = true;
+      this.onUserIdValueChange(this.formData.Teacher.userId);
+    },
+    /**
+     * 绑定用户下拉数据获取函数
+     */
+    loadUserIdDropdownList () {
+      return new Promise((resolve, reject) => {
+        let params = {
+          deptId: this.formData.Teacher.schoolId
+        };
+        DictionaryController.dictSysUser(this, params).then(res => {
+          resolve(res.getList());
+        }).catch(e => {
+          reject(e);
+        });
+      });
+    },
+    /**
+     * 绑定用户选中值改变
+     */
+    onUserIdValueChange (value) {
+    },
+    /**
+     * 是否在职下拉数据获取函数
+     */
+    loadAvailableDropdownList () {
+      return new Promise((resolve, reject) => {
+        let params = {};
+        DictionaryController.dictYesNo(this, params).then(res => {
+          resolve(res.getList());
+        }).catch(e => {
+          reject(e);
+        });
+      });
+    },
+    /**
+     * 是否在职选中值改变
+     */
+    onAvailableValueChange (value) {
+    },
+    /**
+     * 更新编辑老师
+     */
+    refreshFormEditTeacher (reloadData = false) {
+      this.loadTeacherData().then(res => {
+        if (!this.formEditTeacher.isInit) {
+          // 初始化下拉数据
+        }
+        this.formEditTeacher.isInit = true;
+      }).catch(e => {});
+    },
+    /**
+     * 保存
+     */
+    onUpdateClick () {
+      this.$refs.formEditTeacher.validate((valid) => {
+        if (!valid) return;
+        let params = {
+          teacher: {
+            teacherId: this.teacherId,
+            teacherName: this.formData.Teacher.teacherName,
+            birthday: this.formData.Teacher.birthday,
+            gender: this.formData.Teacher.gender,
+            subjectId: this.formData.Teacher.subjectId,
+            level: this.formData.Teacher.level,
+            flowerCount: this.formData.Teacher.flowerCount,
+            schoolId: this.formData.Teacher.schoolId,
+            userId: this.formData.Teacher.userId,
+            available: this.formData.Teacher.available
+          }
+        };
+
+        TeacherController.update(this, params).then(res => {
+          this.$message.success('保存成功');
+          this.onCancel(true);
+        }).catch(e => {});
+      });
+    },
+    /**
+     * 获取老师数据源详细信息
+     */
+    loadTeacherData () {
+      return new Promise((resolve, reject) => {
+        if (!this.formData.Teacher.isDatasourceInit) {
+          let params = {
+            teacherId: this.teacherId
+          };
+          TeacherController.view(this, params).then(res => {
+            this.formData.Teacher = {...res.data, isDatasourceInit: true};
+            if (this.formData.Teacher.genderDictMap) this.formEditTeacher.gender.impl.dropdownList = [this.formData.Teacher.genderDictMap];
+            if (this.formData.Teacher.subjectIdDictMap) this.formEditTeacher.subjectId.impl.dropdownList = [this.formData.Teacher.subjectIdDictMap];
+            if (this.formData.Teacher.levelDictMap) this.formEditTeacher.level.impl.dropdownList = [this.formData.Teacher.levelDictMap];
+            if (this.formData.Teacher.schoolIdDictMap) this.formEditTeacher.schoolId.impl.dropdownList = [this.formData.Teacher.schoolIdDictMap];
+            if (this.formData.Teacher.userIdDictMap) this.formEditTeacher.userId.impl.dropdownList = [this.formData.Teacher.userIdDictMap];
+            if (this.formData.Teacher.availableDictMap) this.formEditTeacher.available.impl.dropdownList = [this.formData.Teacher.availableDictMap];
+            resolve();
+          }).catch(e => {
+            reject();
+          });
+        } else {
+          resolve();
+        }
+      });
+    },
+    initFormData () {
+    },
+    formInit () {
+      this.refreshFormEditTeacher();
+    }
+  },
+  computed: {
+  },
+  created () {
+    this.formInit();
+  }
+}
+</script>

orange-admin-web/src/views/generated/formTeacher/index.vue

@@ -0,0 +1,304 @@
+<template>
+  <div style="position: relative;">
+    <el-form label-width="100px" size="mini" label-position="right" @submit.native.prevent>
+      <filter-box :item-width="350">
+        <el-form-item label="教师职级">
+          <el-select class="filter-item" v-model="formTeacher.formFilter.level" :clearable="true" filterable
+            placeholder="教师职级" :loading="formTeacher.level.impl.loading"
+            @visible-change="formTeacher.level.impl.onVisibleChange"
+            @change="onLevelValueChange">
+            <el-option v-for="item in formTeacher.level.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="所教科目">
+          <el-select class="filter-item" v-model="formTeacher.formFilter.subjectId" :clearable="true" filterable
+            placeholder="所教科目" :loading="formTeacher.subjectId.impl.loading"
+            @visible-change="formTeacher.subjectId.impl.onVisibleChange"
+            @change="onSubjectIdValueChange">
+            <el-option v-for="item in formTeacher.subjectId.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="注册日期">
+          <date-range class="filter-item" v-model="formTeacher.formFilter.registerDate" :clearable="true" :allowTypes="['day']" align="left"
+            range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"
+            format="yyyy-MM-dd" value-format="yyyy-MM-dd hh:mm:ss" />
+        </el-form-item>
+        <el-form-item label="校区名称">
+          <el-input class="filter-item" v-model="formTeacher.formFilter.schoolName"
+            :clearable="true" placeholder="校区名称" />
+        </el-form-item>
+        <el-form-item label="老师名称">
+          <el-input class="filter-item" v-model="formTeacher.formFilter.teacherName"
+            :clearable="true" placeholder="老师名称" />
+        </el-form-item>
+        <el-button slot="operator" type="primary" :plain="true" size="mini" @click="refreshFormTeacher(true)">查询</el-button>
+        <el-button slot="operator" type="primary" size="mini" :disabled="!checkPermCodeExist('formTeacher:formTeacher:formCreateTeacher')"
+          @click="onFormCreateTeacherClick()">
+          新建
+        </el-button>
+      </filter-box>
+    </el-form>
+    <el-row>
+      <el-col :span="24">
+        <el-table :data="formTeacher.Teacher.impl.dataList" size="mini" @sort-change="formTeacher.Teacher.impl.onSortChange"
+          header-cell-class-name="table-header-gray">
+          <el-table-column label="序号" header-align="center" align="center" type="index" width="55px" :index="formTeacher.Teacher.impl.getTableIndex" />
+          <el-table-column label="教师名称" prop="teacherName">
+          </el-table-column>
+          <el-table-column label="教师职级" prop="levelDictMap.name" sortable="custom">
+          </el-table-column>
+          <el-table-column label="所教科目" prop="subjectIdDictMap.name">
+          </el-table-column>
+          <el-table-column label="出生日期" prop="birthday">
+            <template slot-scope="scope">
+              <span>{{formatDateByStatsType(scope.row.birthday, 'day')}}</span>
+            </template>
+          </el-table-column>
+          <el-table-column label="所属校区" prop="schoolIdDictMap.name">
+          </el-table-column>
+          <el-table-column label="鲜花数量" prop="flowerCount" sortable="custom">
+          </el-table-column>
+          <el-table-column label="入职时间" prop="registerDate">
+            <template slot-scope="scope">
+              <span>{{formatDateByStatsType(scope.row.registerDate, 'day')}}</span>
+            </template>
+          </el-table-column>
+          <el-table-column label="操作" fixed="right" width="150px;">
+            <template slot-scope="scope">
+              <el-button @click="onFormEditTeacherClick(scope.row)" type="text" size="mini"
+                :disabled="!checkPermCodeExist('formTeacher:formTeacher:formEditTeacher')">
+                编辑
+              </el-button>
+              <el-button @click="onFormTeacherTransStatsClick(scope.row)" type="text" size="mini"
+                :disabled="!checkPermCodeExist('formTeacher:formTeacher:formTeacherTransStats')">
+                统计
+              </el-button>
+              <el-button @click="onDeleteClick(scope.row)" type="text" size="mini"
+                :disabled="!checkPermCodeExist('formTeacher:formTeacher:delete')">
+                删除
+              </el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+        <el-row type="flex" justify="end" style="margin-top: 10px;">
+          <el-pagination
+            :total="formTeacher.Teacher.impl.totalCount"
+            :current-page="formTeacher.Teacher.impl.currentPage"
+            :page-size="formTeacher.Teacher.impl.pageSize"
+            :page-sizes="[10, 20, 50, 100]"
+            layout="total, prev, pager, next, sizes"
+            @current-change="formTeacher.Teacher.impl.onCurrentPageChange"
+            @size-change="formTeacher.Teacher.impl.onPageSizeChange">
+          </el-pagination>
+        </el-row>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+/* eslint-disable-next-line */
+import { DropdownWidget, TableWidget, UploadWidget, ChartWidget } from '@/utils/widget.js';
+/* eslint-disable-next-line */
+import { uploadMixin, statsDateRangeMixin, cachePageMixin } from '@/core/mixins';
+/* eslint-disable-next-line */
+import { TeacherController, DictionaryController } from '@/api';
+import formCreateTeacher from '@/views/generated/formCreateTeacher';
+import formTeacherTransStats from '@/views/generated/formTeacherTransStats';
+import formEditTeacher from '@/views/generated/formEditTeacher';
+
+export default {
+  name: 'formTeacher',
+  props: {
+  },
+  mixins: [uploadMixin, statsDateRangeMixin, cachePageMixin],
+  data () {
+    return {
+      formTeacher: {
+        formFilter: {
+          level: undefined,
+          subjectId: undefined,
+          registerDate: [],
+          schoolName: undefined,
+          teacherName: undefined
+        },
+        formFilterCopy: {
+          level: undefined,
+          subjectId: undefined,
+          registerDate: [],
+          schoolName: undefined,
+          teacherName: undefined
+        },
+        level: {
+          impl: new DropdownWidget(this.loadLevelDropdownList)
+        },
+        subjectId: {
+          impl: new DropdownWidget(this.loadSubjectIdDropdownList)
+        },
+        Teacher: {
+          impl: new TableWidget(this.loadTeacherData, this.loadTeacherVerify, true, 'registerDate', 1)
+        },
+        isInit: false
+      }
+    }
+  },
+  methods: {
+    /**
+     * 老师列表数据获取函数，返回Primise
+     */
+    loadTeacherData (params) {
+      if (params == null) params = {};
+      params = {
+        ...params,
+        sysDeptFilter: {
+          deptName: this.formTeacher.formFilterCopy.schoolName
+        },
+        teacherFilter: {
+          teacherName: this.formTeacher.formFilterCopy.teacherName,
+          subjectId: this.formTeacher.formFilterCopy.subjectId,
+          level: this.formTeacher.formFilterCopy.level,
+          registerDateStart: Array.isArray(this.formTeacher.formFilterCopy.registerDate) ? this.formTeacher.formFilterCopy.registerDate[0] : undefined,
+          registerDateEnd: Array.isArray(this.formTeacher.formFilterCopy.registerDate) ? this.formTeacher.formFilterCopy.registerDate[1] : undefined
+        }
+      }
+      return new Promise((resolve, reject) => {
+        TeacherController.list(this, params).then(res => {
+          resolve({
+            dataList: res.data.dataList,
+            totalCount: res.data.totalCount
+          });
+        }).catch(e => {
+          reject(e);
+        });
+      });
+    },
+    /**
+     * 老师列表数据获取检测函数，返回true正常获取数据，返回false停止获取数据
+     */
+    loadTeacherVerify () {
+      this.formTeacher.formFilterCopy.schoolName = this.formTeacher.formFilter.schoolName;
+      this.formTeacher.formFilterCopy.teacherName = this.formTeacher.formFilter.teacherName;
+      this.formTeacher.formFilterCopy.subjectId = this.formTeacher.formFilter.subjectId;
+      this.formTeacher.formFilterCopy.level = this.formTeacher.formFilter.level;
+      this.formTeacher.formFilterCopy.registerDate = this.formTeacher.formFilter.registerDate;
+      return true;
+    },
+    /**
+     * 教师职级下拉数据获取函数
+     */
+    loadLevelDropdownList () {
+      return new Promise((resolve, reject) => {
+        let params = {};
+        DictionaryController.dictTeacherLevelType(this, params).then(res => {
+          resolve(res.getList());
+        }).catch(e => {
+          reject(e);
+        });
+      });
+    },
+    /**
+     * 教师职级选中值改变
+     */
+    onLevelValueChange (value) {
+    },
+    /**
+     * 所教科目下拉数据获取函数
+     */
+    loadSubjectIdDropdownList () {
+      return new Promise((resolve, reject) => {
+        let params = {};
+        DictionaryController.dictSubject(this, params).then(res => {
+          resolve(res.getList());
+        }).catch(e => {
+          reject(e);
+        });
+      });
+    },
+    /**
+     * 所教科目选中值改变
+     */
+    onSubjectIdValueChange (value) {
+    },
+    /**
+     * 更新老师管理
+     */
+    refreshFormTeacher (reloadData = false) {
+      if (reloadData) {
+        this.formTeacher.Teacher.impl.refreshTable(true, 1);
+      } else {
+        this.formTeacher.Teacher.impl.refreshTable();
+      }
+      if (!this.formTeacher.isInit) {
+        // 初始化下拉数据
+      }
+      this.formTeacher.isInit = true;
+    },
+    /**
+     * 新建
+     */
+    onFormCreateTeacherClick () {
+      let params = {};
+
+      this.$dialog.show('新建', formCreateTeacher, {
+        area: ['800px']
+      }, params).then(res => {
+        this.refreshFormTeacher();
+      }).catch(e => {});
+    },
+    /**
+     * 编辑
+     */
+    onFormEditTeacherClick (row) {
+      let params = {
+        teacherId: row.teacherId
+      };
+
+      this.$dialog.show('编辑', formEditTeacher, {
+        area: ['800px']
+      }, params).then(res => {
+        this.formTeacher.Teacher.impl.refreshTable();
+      }).catch(e => {});
+    },
+    /**
+     * 统计
+     */
+    onFormTeacherTransStatsClick (row) {
+      let params = {
+        teacherId: row.teacherId
+      };
+
+      this.$dialog.show('统计', formTeacherTransStats, {
+        area: ['800px']
+      }, params).then(res => {
+        this.formTeacher.Teacher.impl.refreshTable();
+      }).catch(e => {});
+    },
+    /**
+     * 删除
+     */
+    onDeleteClick (row) {
+      let params = {
+        teacherId: row.teacherId
+      };
+
+      this.$confirm('是否删除此老师？').then(res => {
+        TeacherController.delete(this, params).then(res => {
+          this.$message.success('删除成功');
+          this.formTeacher.Teacher.impl.refreshTable();
+        }).catch(e => {});
+      }).catch(e => {});
+    },
+    onResume () {
+      this.refreshFormTeacher();
+    },
+    initFormData () {
+    },
+    formInit () {
+      this.refreshFormTeacher();
+    }
+  },
+  created () {
+    this.formInit();
+  }
+}
+</script>

orange-admin-web/src/views/generated/formTeacherTransStats/index.vue

@@ -0,0 +1,186 @@
+<template>
+  <div class="form-single-fragment" style="position: relative;">
+    <el-form label-width="100px" size="mini" label-position="right" @submit.native.prevent>
+      <filter-box :item-width="350">
+        <el-form-item label="统计日期">
+          <date-range class="filter-item" v-model="formTeacherTransStats.formFilter.statsDate" :clearable="true" :allowTypes="['day']" align="left"
+            range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"
+            format="yyyy-MM-dd" value-format="yyyy-MM-dd hh:mm:ss" />
+        </el-form-item>
+        <el-button slot="operator" type="primary" :plain="true" size="mini" @click="refreshFormTeacherTransStats(true)">查询</el-button>
+      </filter-box>
+    </el-form>
+    <el-form ref="formTeacherTransStats" :model="formData" class="full-width-input" style="width: 100%;"
+      label-width="100px" size="mini" label-position="right" @submit.native.prevent>
+      <el-row :gutter="20">
+        <el-col class="table-box" :span="24">
+          <ve-line height="300px"
+            :extend="formTeacherTransStats.TeacherTransStats.chartOption"
+            :data="formTeacherTransStats.TeacherTransStats.impl.chartData"
+            :settings="formTeacherTransStats.TeacherTransStats.chartSetting"
+            :loading="formTeacherTransStats.TeacherTransStats.impl.loading"
+            :data-empty="formTeacherTransStats.TeacherTransStats.impl.dataEmpty"
+            :after-set-option-once="onTeacherTransStatsOptionSet"/>
+        </el-col>
+      </el-row>
+    </el-form>
+  </div>
+</template>
+
+<script>
+/* eslint-disable-next-line */
+import { DropdownWidget, TableWidget, UploadWidget, ChartWidget } from '@/utils/widget.js';
+/* eslint-disable-next-line */
+import { defaultLineChartOption, defaultBarChartOption, defaultPieChartOption } from '@/utils/chartOption.js';
+/* eslint-disable-next-line */
+import { uploadMixin, statsDateRangeMixin } from '@/core/mixins';
+/* eslint-disable-next-line */
+import { TeacherTransStatsController, DictionaryController } from '@/api';
+
+export default {
+  name: 'formTeacherTransStats',
+  props: {
+    teacherId: {
+      default: undefined
+    }
+  },
+  mixins: [uploadMixin, statsDateRangeMixin],
+  data () {
+    return {
+      formData: {
+        TeacherTransStats: {
+          statsId: undefined,
+          statsDate: undefined,
+          statsMonth: undefined,
+          provinceId: undefined,
+          cityId: undefined,
+          schoolId: undefined,
+          schoolName: undefined,
+          teacherId: undefined,
+          teacherName: undefined,
+          videoWatchCount: undefined,
+          flowerCount: undefined,
+          newStudent: undefined,
+          sysDept: {
+            deptId: undefined,
+            deptName: undefined,
+            showOrder: undefined,
+            deletedFlag: undefined,
+            createUserId: undefined,
+            createUsername: undefined,
+            createTime: undefined,
+            updateTime: undefined
+          },
+          teacher: {
+            teacherId: undefined,
+            teacherName: undefined,
+            birthday: undefined,
+            gender: undefined,
+            subjectId: undefined,
+            level: undefined,
+            flowerCount: undefined,
+            schoolId: undefined,
+            userId: undefined,
+            registerDate: undefined,
+            available: undefined
+          },
+          isDatasourceInit: false
+        }
+      },
+      formTeacherTransStats: {
+        formFilter: {
+          statsDate: []
+        },
+        formFilterCopy: {
+          statsDate: []
+        },
+        TeacherTransStats: {
+          impl: new ChartWidget(this.loadTeacherTransStatsData, this.loadTeacherTransStatsVerify,
+            ['statsDateShowName', 'videoWatchCount', 'newStudent', 'flowerCount']),
+          chartOption: defaultLineChartOption,
+          chartSetting: {
+            dimension: ['statsDateShowName'],
+            metrics: ['videoWatchCount', 'newStudent', 'flowerCount'],
+            labelMap: {
+              'videoWatchCount': '视频观看数量',
+              'newStudent': '新增学生数量',
+              'flowerCount': '献花数量'
+            }
+          }
+        },
+        isInit: false
+      }
+    }
+  },
+  methods: {
+    onCancel (isSuccess) {
+      if (this.observer != null) {
+        this.observer.cancel(isSuccess);
+      }
+    },
+    /**
+     * 老师流水统计数据获取函数，返回Primise
+     */
+    loadTeacherTransStatsData () {
+      let params = {
+        groupParam: [
+          {
+            fieldName: 'statsDate'
+          }
+        ],
+        teacherTransStatsFilter: {
+          statsDateStart: Array.isArray(this.formTeacherTransStats.formFilterCopy.statsDate) ? this.formTeacherTransStats.formFilterCopy.statsDate[0] : undefined,
+          statsDateEnd: Array.isArray(this.formTeacherTransStats.formFilterCopy.statsDate) ? this.formTeacherTransStats.formFilterCopy.statsDate[1] : undefined,
+          teacherId: this.teacherId
+        }
+      }
+      return new Promise((resolve, reject) => {
+        TeacherTransStatsController.listWithGroup(this, params).then(res => {
+          resolve({
+            dataList: res.data.dataList.map((item) => {
+              return {...item, statsDateShowName: this.formatDateByStatsType(item.statsDate, this.formTeacherTransStats.TeacherTransStats.statsType)};
+            }),
+            totalCount: res.data.totalCount
+          });
+        }).catch(e => {
+          reject(e);
+        });
+      });
+    },
+    /**
+     * 老师流水统计数据获取检测函数，返回true正常获取数据，返回false停止获取数据
+     */
+    loadTeacherTransStatsVerify () {
+      this.formTeacherTransStats.formFilterCopy.statsDate = this.formTeacherTransStats.formFilter.statsDate;
+      return true;
+    },
+    /**
+     * 获取老师流水统计的echarts实例
+     */
+    onTeacherTransStatsOptionSet (echarts) {
+      echarts.resize();
+      this.formTeacherTransStats.TeacherTransStats.impl.chartObject = echarts;
+    },
+    /**
+     * 更新老师个人统计
+     */
+    refreshFormTeacherTransStats (reloadData = false) {
+      this.formTeacherTransStats.TeacherTransStats.impl.refreshChart(reloadData);
+      if (!this.formTeacherTransStats.isInit) {
+        // 初始化下拉数据
+      }
+      this.formTeacherTransStats.isInit = true;
+    },
+    initFormData () {
+    },
+    formInit () {
+      this.refreshFormTeacherTransStats();
+    }
+  },
+  computed: {
+  },
+  created () {
+    this.formInit();
+  }
+}
+</script>

orange-admin-web/src/views/layout/components/breadcrumb/index.vue

@@ -0,0 +1,53 @@
+<template>
+  <el-breadcrumb class="app-breadcrumb" separator="/">
+    <el-breadcrumb-item :to="{name: 'welcome'}" :replace="true">
+      <i class="el-icon-s-home" style="margin-right: 5px;" />主页
+    </el-breadcrumb-item>
+    <el-breadcrumb-item v-for="item  in menuPathList" :key="item.menuId">
+      {{item.menuName}}
+    </el-breadcrumb-item>
+  </el-breadcrumb>
+</template>
+
+<script>
+import { mapGetters, mapMutations } from 'vuex';
+
+export default {
+  created () {
+    this.getBreadcrumb();
+  },
+  data () {
+    return {
+      menuPathList: null
+    };
+  },
+  watch: {
+    $route (newValue) {
+      if (newValue.name === 'welcome') this.setCurrentMenuId(null);
+      this.getBreadcrumb();
+    }
+  },
+  methods: {
+    getBreadcrumb () {
+      this.menuPathList = this.getCurrentMenuPath;
+    },
+    ...mapMutations(['setCurrentMenuId'])
+  },
+  computed: {
+    ...mapGetters(['getCurrentMenuPath'])
+  }
+};
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+  .app-breadcrumb.el-breadcrumb {
+    display: inline-block;
+    font-size: 14px;
+    line-height: 60px;
+    margin-left: 10px;
+    .no-redirect {
+      color: #97a8be;
+      cursor: text;
+    }
+  }
+</style>

orange-admin-web/src/views/layout/components/sidebar/menu-item.vue

@@ -0,0 +1,59 @@
+<template>
+  <div class="menu-wrapper">
+    <el-menu-item ref="item" :index="menu.menuId + ''" :key="menu.menuId" v-if="menu.children == null || menu.children.length <= 0">
+      <template slot="title">
+        <i v-if="menu.icon" :class="menu.icon" style="margin-right: 5px; font-size: 18px;" :style="getIconStyle(menu.icon)"></i>
+        <span slot="title" :style="getTextStyle(!menu.icon)">{{menu.menuName}}</span>
+      </template>
+    </el-menu-item>
+    <el-submenu v-else :index="menu.menuId + ''" :key="menu.menuId">
+      <template slot="title">
+        <i v-if="menu.icon" :class="menu.icon" style="margin-right: 5px; font-size: 18px;" :style="getIconStyle(menu.icon)"></i>
+        <span slot="title" :style="getTextStyle(!menu.icon)" v-show="!getCollapse">{{menu.menuName}}</span>
+      </template>
+      <template v-for="child in menu.children">
+        <menu-item class="nest-menu" :menu="child" :isChild="true" :key="child.menuId" />
+      </template>
+    </el-submenu>
+  </div>
+</template>
+
+<script>
+import {mapGetters} from 'vuex'
+export default {
+  name: 'menuItem',
+  props: {
+    menu: {
+      type: Object,
+      required: true,
+      default: undefined
+    },
+    isChild: {
+      type: Boolean,
+      default: false
+    }
+  },
+  methods: {
+    getIconStyle (isShow) {
+      if (isShow && this.isChild) {
+        return [
+          { 'margin-left': '13px' }
+        ]
+      }
+    },
+    getTextStyle (isShow) {
+      if (isShow && this.isChild) {
+        return [
+          { 'padding-left': '13px' }
+        ]
+      }
+    }
+  },
+  computed: {
+    showText () {
+      return !this.getCollapse;
+    },
+    ...mapGetters(['getCollapse'])
+  }
+}
+</script>

orange-admin-web/src/views/layout/components/sidebar/sidebar.vue

@@ -0,0 +1,68 @@
+<template>
+  <div style="height: 100%; position: relative;" class="sidebar-bg">
+    <div class="sidebar-title">
+      <img :src="logoImage" style="margin: 20px 60px 10px 60px; width: 80px; height: 80px; border-radius: 50%;" />
+      <p class="sidebar-title-text">{{getProjectName()}}</p>
+    </div>
+    <div style="height: 100%; padding-bottom: 160px;">
+      <el-scrollbar wrap-class="scrollbar_dropdown__wrap" style="height: 100%;">
+        <el-menu ref="menu" mode="vertical" :default-active="getCurrentMenuId" :unique-opened="true" @select="selectMenu"
+          text-color="white" active-text-color="white" :collapse="getCollapse" >
+          <template v-for="menu in getMenuList">
+            <menu-item :menu="menu" :key="menu.menuId" />
+          </template>
+        </el-menu>
+      </el-scrollbar>
+    </div>
+  </div>
+</template>
+
+<script>
+import menuItem from './menu-item.vue';
+import { mapGetters, mapMutations } from 'vuex';
+import projectConfig from '@/core/config';
+
+export default {
+  data () {
+    return {
+      isCollapse: false,
+      collapseLeft: '200px',
+      showCollapseBtn: true,
+      logoImage: require('../../../../assets/img/logo.jpg')
+    }
+  },
+  components: {
+    'menu-item': menuItem
+  },
+  computed: {
+    getCollapseStyle () {
+      return [{
+        left: this.collapseLeft
+      }]
+    },
+    ...mapGetters(['getMenuList', 'getCollapse', 'getCurrentMenuPath', 'getCurrentMenuId'])
+  },
+  methods: {
+    onCollapseChange () {
+      this.showCollapseBtn = false;
+      setTimeout(() => {
+        this.setCollapse(!this.getCollapse);
+        this.collapseLeft = this.getCollapse ? '65px' : '200px';
+        this.showCollapseBtn = true;
+      }, 100);
+    },
+    getProjectName () {
+      if (this.getCollapse) {
+        return projectConfig.projectName.substr(0, 1);
+      } else {
+        return projectConfig.projectName;
+      }
+    },
+    selectMenu (index, path) {
+      if (this.getCurrentMenuId === index) return;
+      this.setCurrentMenuId(index);
+    },
+    ...mapMutations(['setCollapse', 'clearCachePage', 'setCurrentMenuId'])
+  }
+};
+</script>

orange-admin-web/src/views/layout/index.vue

@@ -0,0 +1,131 @@
+<template>
+  <el-container :style="getMainStyle">
+    <el-aside width='200px' class="sidebar">
+      <side-bar style="overflow: hidden"></side-bar>
+    </el-aside>
+    <el-container style="background-color: rgb(235,235,235)">
+      <el-header class="header">
+        <breadcrumb class="breadcrumb-container" style="float: left"/>
+        <div class="header-menu">
+          <el-dropdown class="user-dropdown" trigger="click" @command="handleCommand">
+            <span class="el-dropdown-link">{{getUserInfo.showName}}<i class="el-icon-arrow-down el-icon--right"></i>
+            </span>
+            <el-dropdown-menu slot="dropdown">
+              <el-dropdown-item class="user-dropdown-item" command="logout">退出登录</el-dropdown-item>
+            </el-dropdown-menu>
+          </el-dropdown>
+          <img :src="header" class="header-img" />
+        </div>
+      </el-header>
+      <el-main style="padding: 15px 0px;">
+        <el-scrollbar :style="getContextStyle" wrap-class="scrollbar_dropdown__wrap">
+          <transition name="fade" mode="out-in">
+            <keep-alive :include="getCachePages">
+              <router-view style="margin: 0px 15px; background-color: white; overflow: hidden; padding: 20px;" :style="getRouterViewStyle" />
+            </keep-alive>
+          </transition>
+        </el-scrollbar>
+      </el-main>
+    </el-container>
+  </el-container>
+</template>
+
+<script>
+import SideBar from './components/sidebar/sidebar.vue';
+import { mapGetters, mapMutations } from 'vuex';
+import Breadcrumb from './components/breadcrumb';
+import { SystemController } from '@/api';
+
+export default {
+  data () {
+    return {
+      header: require('../../assets/img/default-header.jpg')
+    };
+  },
+  components: {
+    'side-bar': SideBar,
+    'breadcrumb': Breadcrumb
+  },
+  methods: {
+    toggleSideBar () {
+      this.setCollapse(!this.getCollapse);
+    },
+    resetDocumentClientHeight () {
+      let timerID;
+      let _this = this;
+      return function () {
+        clearTimeout(timerID);
+        timerID = setTimeout(() => {
+          var h = document.documentElement['clientHeight'];
+          _this.setClientHeight(h);
+        }, 50);
+      }
+    },
+    handleCommand (command) {
+      if (command === 'logout') {
+        this.$confirm('是否退出登录？', '', {
+          confirmButtonText: '确定',
+          cancelButtonText: '取消',
+          type: 'warning'
+        }).then(() => {
+          let options = {
+            headers: {
+              Authorization: window.sessionStorage.getItem('token')
+            },
+            showMask: false
+          }
+
+          SystemController.logout(this, {}, options).catch(e => {});
+          this.$router.replace({name: 'login'});
+        }).catch(e => {});
+      }
+    },
+    ...mapMutations(['setClientHeight'])
+  },
+  computed: {
+    getMainStyle () {
+      return [
+        {'height': this.getClientHeight + 'px'}
+      ]
+    },
+    getContextStyle () {
+      return [
+        {'height': (this.getClientHeight - 90) + 'px'}
+      ]
+    },
+    getRouterViewStyle () {
+      return [
+        {'min-height': (this.getClientHeight - 90) + 'px'}
+      ]
+    },
+    ...mapGetters(['getClientHeight', 'getInputParams', 'getUserInfo', 'getCollapse', 'getCachePages', 'getMenuItem'])
+  },
+  mounted () {
+    let resetHeight = this.resetDocumentClientHeight();
+    resetHeight();
+    
+    window.onresize = () => {
+      resetHeight();
+    }
+  },
+  watch: {
+    getMenuItem: {
+      handler (newValue) {
+        if (newValue == null) {
+          this.$router.replace({
+            name: 'welcome'
+          });
+        } else {
+          this.$router.replace({
+            name: newValue.formRouterName
+          });
+        }
+      },
+      immediate: true
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+</style>

orange-admin-web/src/views/login/index.vue

@@ -0,0 +1,97 @@
+<template>
+  <div class="login-form">
+    <el-card class="box-card" style="width: 30vw; background-color: rgba(255, 255, 255, 0.9); border-width: 0px;" :body-style="{ padding: '40px' }">
+      <el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()">
+        <el-row>
+          <h3 class="title">橙单代码生成器</h3>
+          <el-col :span="24">
+            <el-form-item prop="mobilePhone">
+              <el-input v-model="dataForm.mobilePhone" style="width: 100%;" placeholder="帐号"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="24">
+            <el-form-item prop="password">
+              <el-input v-model="dataForm.password" style="width: 100%;" type="password" placeholder="密码" show-password></el-input>
+            </el-form-item>
+          </el-col>
+          <el-button class="login-btn-submit" type="primary" style="width: 100%;" @click="dataFormSubmit()" :loading="isHttpLoading">登录</el-button>
+        </el-row>
+      </el-form>
+    </el-card>
+  </div>
+</template>
+
+<script>
+import { SystemController } from '@/api';
+import { mapMutations } from 'vuex';
+import projectConfig from '@/core/config';
+
+export default {
+  data () {
+    return {
+      dataForm: {
+        mobilePhone: 'admin',
+        password: '123456'
+      },
+      dataRule: {
+        mobilePhone: [
+          { required: true, message: '帐号不能为空', trigger: 'blur' }
+        ],
+        password: [
+          { required: true, message: '密码不能为空', trigger: 'blur' }
+        ]
+      },
+      projectName: projectConfig.projectName
+    };
+  },
+  methods: {
+    dataFormSubmit () {
+      this.$refs['dataForm'].validate(valid => {
+        if (valid) {
+          let params = {
+            loginName: this.dataForm.mobilePhone,
+            password: this.dataForm.password
+          };
+
+          SystemController.login(this, params, null, {showMask: false}).then(data => {
+            this.setMenuList(data.data.menuList);
+            delete data.data.menuList;
+
+            this.setUserInfo(data.data);
+            window.sessionStorage.setItem('token', data.data.tokenData);
+            this.setCurrentMenuId(null);
+            this.$router.replace({ name: 'main' });
+          }).catch(e => {});
+        }
+      });
+    },
+    ...mapMutations(['setUserInfo', 'setMenuList', 'setCurrentMenuId'])
+  },
+  created () {
+    this.setMenuList([]);
+    this.setUserInfo({});
+    window.sessionStorage.removeItem('token');
+  }
+};
+</script>
+
+<style lang="scss">
+.login-form {
+  display: flex;
+  justify-content: center;
+  flex-direction: column;
+  align-items: center;
+  height: 100vh;
+  background: url(~@/assets/img/login_bg.jpg) no-repeat 50%, #000;
+  background-size: 100%;
+
+  .title {
+    margin: 0px;
+    margin-bottom: 20px;
+    color: #707070;
+    font-size: 24;
+    text-align: center;
+    display: block;
+  }
+}
+</style>

orange-admin-web/src/views/upms/formDictManagement/index.vue

@@ -0,0 +1,115 @@
+<template>
+  <div>
+    <el-form label-width="75px" size="mini" label-position="right" @submit.native.prevent>
+      <filter-box :item-width="350">
+        <el-form-item label="字典列表">
+          <el-select class="filter-item" v-model="currentDictId" placeholder="请选择字典" @change="onDictChange">
+            <el-option v-for="item in dictList" :key="item.variableName" :label="item.name" :value="item.variableName"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-button slot="operator" type="primary" size="mini" :plain="true"
+          :disabled="!checkPermCodeExist('formSysDict:fragmentSysDict:reloadCache') || currentDict == null"
+          @click="onRefreshCacheData">
+          同步缓存
+        </el-button>
+        <el-button slot="operator" type="primary" size="mini"
+          :disabled="!checkPermCodeExist('formSysDict:fragmentSysDict:add') || currentDict == null"
+          @click="onAddDictData">
+          添加数据
+        </el-button>
+      </filter-box>
+    </el-form>
+    <el-row>
+      <el-col :span="24">
+        <el-table :data="getCurrentDictData" size="mini" header-cell-class-name="table-header-gray">
+          <el-table-column label="ID" prop="id" />
+          <el-table-column label="字典名称" prop="name" />
+          <el-table-column label="操作" width="150px">
+            <template slot-scope="scope">
+              <el-button type="text" size="mini" :disabled="!checkPermCodeExist('formSysDict:fragmentSysDict:update')" @click="onUpdateDictDataClick(scope.row)">编辑</el-button>
+              <el-button type="text" size="mini" :disabled="!checkPermCodeExist('formSysDict:fragmentSysDict:delete')" @click="onDeleteDictDataClick(scope.row)">删除</el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { findItemFromList } from '@/utils';
+/* eslint-disable-next-line */
+import { DictionaryController } from '@/api';
+import editDict from '@/views/upms/formEditDict';
+
+export default {
+  name: 'systemDictManagement',
+  data () {
+    return {
+      dictList: [
+      ],
+      currentDictId: undefined,
+      currentDict: undefined,
+      currentDictDataList: []
+    }
+  },
+  methods: {
+    updateDictData () {
+      this.currentDictDataList = [];
+      this.currentDict.listApi(this).then(res => {
+        this.currentDictDataList = res.getList();
+      }).catch(e => {});
+    },
+    onDictChange (value) {
+      this.currentDict = findItemFromList(this.dictList, value, 'variableName');
+      this.currentDictDataList = [];
+      if (this.currentDict == null) {
+        this.$message.error('没有找到相关字典');
+        return;
+      }
+      this.updateDictData();
+    },
+    onRefreshCacheData () {
+      this.$confirm('是否同步缓存？').then(res => {
+        this.currentDict.reloadCachedDataApi(this).then(res => {
+          this.$message.success('同步成功');
+        }).catch(e => {});
+      }).catch(e => {});
+    },
+    onAddDictData () {
+      this.$dialog.show(`新建字典数据 - [${this.currentDict.name}]`, editDict, {
+        area: '500px'
+      }, {
+        dictInfo: this.currentDict
+      }).then(res => {
+        this.updateDictData();
+      }).catch(e => {});
+    },
+    onUpdateDictDataClick (row) {
+      this.$dialog.show(`编辑字典数据 - [${this.currentDict.name}]`, editDict, {
+        area: '500px'
+      }, {
+        dictInfo: this.currentDict,
+        currentData: row
+      }).then(res => {
+        this.updateDictData();
+      }).catch(e => {});
+    },
+    onDeleteDictDataClick (row) {
+      this.$confirm('是否删除此字典数据？').then(res => {
+        let params = {};
+        params[this.currentDict.idKey] = row.id;
+        return this.currentDict.deleteApi(this, params);
+      }).then(res => {
+        this.$message.success('删除成功');
+        this.updateDictData();
+      }).catch(e => {});
+    }
+  },
+  computed: {
+    getCurrentDictData () {
+      return this.currentDictDataList;
+    }
+  }
+}
+</script>

orange-admin-web/src/views/upms/formEditDict/index.vue

@@ -0,0 +1,82 @@
+<template>
+  <el-form ref="form" :model="formData" :rules="rules" label-width="80px" size="mini" label-position="right" @submit.native.prevent>
+    <el-row :gutter="20">
+      <el-form-item label="名称" prop="name">
+        <el-input v-model="formData.name" placeholder="字典名称" clearable />
+      </el-form-item>
+    </el-row>
+    <!-- 弹窗下发按钮栏，必须设置class为dialog-btn-layer -->
+    <el-row type="flex" justify="end" class="dialog-btn-layer">
+      <el-button size="mini" @click="onCancel" >取消</el-button>
+      <el-button type="primary" size="mini" @click="onSubmit">确定</el-button>
+    </el-row>
+  </el-form>
+</template>
+
+<script>
+export default {
+  name: 'DictEdit',
+  props: {
+    dictInfo: {
+      type: Object,
+      required: true
+    },
+    currentData: {
+      type: Object,
+      default: undefined
+    }
+  },
+  data () {
+    return {
+      formData: {
+        name: undefined,
+        id: undefined
+      },
+      rules: {
+        name: [{required: true, message: '字典数据名称不能为空', trigger: 'blur'}]
+      }
+    }
+  },
+  methods: {
+    onCancel (isSuccess = false) {
+      if (this.observer != null) {
+        this.observer.cancel(isSuccess);
+      }
+    },
+    onSubmit () {
+      this.$refs.form.validate((valid) => {
+        if (valid) {
+          let params = {};
+          params[this.dictInfo.variableName] = {};
+          params[this.dictInfo.variableName][this.dictInfo.nameKey] = this.formData.name;
+
+          if (this.formData.id == null) {
+            this.dictInfo.addApi(this, params).then(res => {
+              this.$message.success('操作成功');
+              this.onCancel(true);
+            }).catch(e => {
+
+            });
+          } else {
+            params[this.dictInfo.variableName][this.dictInfo.idKey] = this.formData.id;
+            this.dictInfo.updateApi(this, params).then(res => {
+              this.$message.success('操作成功');
+              this.onCancel(true);
+            }).catch(e => {
+            });
+          }
+        }
+      });
+    }
+  },
+  mounted () {
+    if (this.currentData != null) {
+      this.formData.id = this.currentData.id;
+      this.formData.name = this.currentData.name;
+    }
+  }
+}
+</script>
+
+<style>
+</style>

orange-admin-web/src/views/upms/formEditSysDataPerm/index.vue

@@ -0,0 +1,308 @@
+<template>
+  <div class="form-single-fragment" style="position: relative;">
+    <el-form ref="formEditSysDataPerm" :model="formData" class="full-width-input" :rules="rules" style="width: 100%;"
+      label-width="120px" size="mini" label-position="right" @submit.native.prevent>
+      <el-row :gutter="20">
+        <el-col :span="12">
+          <el-form-item label="数据权限名称" prop="SysDataPerm.dataPermName">
+            <el-input class="input-item" v-model="formData.SysDataPerm.dataPermName"
+              :clearable="true" placeholder="显示名称" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="过滤规则" prop="SysDataPerm.ruleType">
+            <el-select class="input-item" v-model="formData.SysDataPerm.ruleType" :clearable="true"
+              placeholder="过滤规则" :loading="formEditSysDataPerm.ruleType.impl.loading"
+              @visible-change="onRuleTypeVisibleChange"
+              @change="onRuleTypeValueChange">
+              <el-option v-for="item in formEditSysDataPerm.ruleType.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
+            </el-select>
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-card shadow="never">
+            <div slot="header" class="card-header">
+              <span>部门列表</span>
+              <el-input size="mini" v-model="deptNameFilter" placeholder="输入部门名称过滤" style="width: 250px;" clearable suffix-icon="el-icon-search" />
+            </div>
+            <el-scrollbar style="height: 250px;" wrap-class="scrollbar_dropdown__wrap">
+              <el-tree ref="deptTree" :data="deptTree" show-checkbox node-key="id" default-expand-all
+                :check-strictly="true" :props="{...deptProps, disabled: () => {return (formData.SysDataPerm.ruleType !== SysDataPermType.CUSTOM_DEPT_AND_CHILD && formData.SysDataPerm.ruleType !== SysDataPermType.CUSTOM_DEPT)}}" :filter-node-method="filterDeptNode" />
+            </el-scrollbar>
+          </el-card>
+        </el-col>
+        <el-col :span="12">
+          <el-card shadow="never">
+            <div slot="header" class="card-header">
+              <span>菜单列表</span>
+              <el-input size="mini" v-model="menuNameFilter" placeholder="输入菜单名称过滤" style="width: 250px;" clearable suffix-icon="el-icon-search" />
+            </div>
+            <el-scrollbar style="height: 250px;" wrap-class="scrollbar_dropdown__wrap">
+              <el-tree ref="menuTree" :data="menuTree" show-checkbox node-key="menuId" default-expand-all
+                :props="menuProps" :filter-node-method="filterMneuNode" />
+            </el-scrollbar>
+          </el-card>
+        </el-col>
+      </el-row>
+      <el-col :span="24" style="margin-top: 20px;">
+        <el-row type="flex" justify="end">
+          <el-button type="primary" size="mini" :plain="true" @click="onCancel(false)">
+            取消
+          </el-button>
+          <el-button type="primary" size="mini" @click="onUpdateClick()"
+            :disabled="!(checkPermCodeExist('formSysDataPerm:fragmentSysDataPerm:add') || checkPermCodeExist('formSysDataPerm:fragmentSysDataPerm:update'))">
+            保存
+          </el-button>
+        </el-row>
+      </el-col>
+    </el-form>
+  </div>
+</template>
+
+<script>
+import { treeDataTranslate } from '@/utils';
+/* eslint-disable-next-line */
+import { DropdownWidget, TableWidget, UploadWidget, ChartWidget } from '@/utils/widget.js';
+/* eslint-disable-next-line */
+import { uploadMixin, statsDateRangeMixin, cachedPageChildMixin } from '@/core/mixins';
+/* eslint-disable-next-line */
+import { SystemController, DictionaryController, SysDataPermController } from '@/api';
+
+export default {
+  name: 'formEditSysDataPerm',
+  props: {
+    dataPermId: {
+      default: undefined
+    }
+  },
+  mixins: [uploadMixin, statsDateRangeMixin, cachedPageChildMixin],
+  data () {
+    return {
+      deptTree: [],
+      deptNameFilter: undefined,
+      menuTree: [],
+      menuNameFilter: undefined,
+      allowParentList: [],
+      menuProps: {
+        label: 'menuName'
+      },
+      deptProps: {
+        label: 'name'
+      },
+      formData: {
+        SysDataPerm: {
+          dataPermId: undefined,
+          dataPermName: undefined,
+          ruleType: undefined,
+          deptIdListString: undefined,
+          createUserId: undefined,
+          createUsername: undefined,
+          createTime: undefined,
+          updateTime: undefined
+        }
+      },
+      rules: {
+        'SysDataPerm.dataPermName': [
+          {required: true, message: '请输入数据权限名称', trigger: 'blur'}
+        ],
+        'SysDataPerm.ruleType': [
+          {required: true, message: '请选择过滤规则', trigger: 'blur'}
+        ]
+      },
+      formEditSysDataPerm: {
+        formFilter: {
+        },
+        formFilterCopy: {
+        },
+        ruleType: {
+          impl: new DropdownWidget(this.loadRuleTypeDropdownList)
+        },
+        isInit: false
+      }
+    }
+  },
+  methods: {
+    filterDeptNode (value, data) {
+      if (!value) return true;
+      return data.deptName ? data.deptName.indexOf(value) !== -1 : true;
+    },
+    filterMneuNode (value, data) {
+      if (!value) return true;
+      if (data.menuName.indexOf(value) !== -1) {
+        this.allowParentList.push(data.menuId);
+        return true;
+      } else {
+        return this.allowParentList.indexOf(data.parentId) !== -1;
+      }
+    },
+    onCancel (isSuccess) {
+      if (this.observer != null) {
+        this.observer.cancel(isSuccess);
+      }
+    },
+    /**
+     * 过滤规则下拉数据获取函数
+     */
+    loadRuleTypeDropdownList () {
+      return new Promise((resolve, reject) => {
+        let params = {};
+        DictionaryController.dictSysDataPermType(this, params).then(res => {
+          resolve(res.getList());
+        }).catch(e => {
+          reject(e);
+        });
+      });
+    },
+    /**
+     * 过滤规则下拉框显隐
+     */
+    onRuleTypeVisibleChange (show) {
+      this.formEditSysDataPerm.ruleType.impl.onVisibleChange(show).catch(e => {});
+    },
+    /**
+     * 过滤规则选中值改变
+     */
+    onRuleTypeValueChange (value) {
+    },
+    /**
+     * 部门列表数据获取函数
+     */
+    loadDeptList () {
+      return new Promise((resolve, reject) => {
+        let params = {};
+        DictionaryController.dictSysDept(this, params).then(res => {
+          this.deptTree = treeDataTranslate(res.getList(), 'id');
+          if (Array.isArray(this.formData.SysDataPerm.dataPermDeptList)) {
+            this.$refs.deptTree.setCheckedKeys(this.formData.SysDataPerm.dataPermDeptList.map((item) => {
+              return item.deptId;
+            }));
+          }
+        }).catch(e => {
+          reject(e);
+        });
+      });
+    },
+    /**
+     * 菜单列表数据获取函数
+     */
+    loadMenuList () {
+      return new Promise((resolve, reject) => {
+        let params = {};
+        SystemController.getMenuPermList(this, params).then(res => {
+          this.menuTree = treeDataTranslate(res.data.map((item) => {
+            if (item.menuType === this.SysMenuType.DIRECTORY || item.menuType === this.SysMenuType.MENU) {
+              return {...item};
+            }
+          }).filter(item => {
+            return item != null;
+          }), 'menuId');
+          if (Array.isArray(this.formData.SysDataPerm.dataPermMenuList)) {
+            let selectList = this.formData.SysDataPerm.dataPermMenuList.map((item) => {
+              return item.menuId;
+            });
+            this.$refs.menuTree.setCheckedKeys(selectList);
+          }
+        }).catch(e => {
+          reject(e);
+        });
+      });
+    },
+    /**
+     * 更新编辑数据权限
+     */
+    refreshFormEditSysDataPerm (reloadData = false) {
+      this.formEditSysDataPerm.ruleType.impl.onVisibleChange(true).catch(e => {});
+      this.formEditSysDataPerm.isInit = true;
+    },
+    /**
+     * 编辑
+     */
+    onUpdateClick () {
+      this.$refs.formEditSysDataPerm.validate((valid) => {
+        if (!valid) return;
+        let params = {
+          sysDataPerm: {
+            dataPermId: this.dataPermId,
+            ruleType: this.formData.SysDataPerm.ruleType,
+            dataPermName: this.formData.SysDataPerm.dataPermName
+          }
+        };
+        if (this.formData.SysDataPerm.ruleType === this.SysDataPermType.CUSTOM_DEPT_AND_CHILD ||
+          this.formData.SysDataPerm.ruleType === this.SysDataPermType.CUSTOM_DEPT) {
+          let deptList = this.$refs.deptTree.getCheckedKeys();
+          if (deptList.length <= 0) {
+            this.$message.error('请选择数据权限部门');
+            return;
+          }
+          params.deptIdListString = Array.isArray(deptList) ? deptList.join(',') : undefined;
+        }
+        let menuList = this.$refs.menuTree.getCheckedKeys();
+        if (menuList.length <= 0) {
+          this.$message.error('请选择数据权限生效的菜单');
+          return;
+        }
+        params.menuIdListString = Array.isArray(menuList) ? menuList.join(',') : undefined;
+        if (this.dataPermId == null) {
+          SysDataPermController.add(this, params).then(res => {
+            this.$message.success('添加成功');
+            this.onCancel(true);
+          }).catch(e => {});
+        } else {
+          SysDataPermController.update(this, params).then(res => {
+            this.$message.success('编辑成功');
+            this.onCancel(true);
+          }).catch(e => {});
+        }
+      });
+    },
+    /**
+     * 获取数据权限详细信息
+     */
+    loadSysDataPermData () {
+      return new Promise((resolve, reject) => {
+        if (this.dataPermId == null) {
+          resolve();
+        } else {
+          let params = {
+            dataPermId: this.dataPermId
+          };
+          SysDataPermController.view(this, params).then(res => {
+            this.formData.SysDataPerm = {...res.data};
+            resolve();
+          }).catch(e => {
+            reject();
+          });
+        }
+      });
+    },
+    initFormData () {
+    },
+    formInit () {
+      let loadAllDatasource = [
+        this.loadSysDataPermData()
+      ];
+      Promise.all(loadAllDatasource).then(res => {
+        this.initFormData();
+        this.refreshFormEditSysDataPerm();
+        this.loadMenuList();
+        this.loadDeptList();
+      }).catch(e => {});
+    }
+  },
+  mounted () {
+    this.formInit();
+  },
+  watch: {
+    menuNameFilter (val) {
+      this.allowParentList = [];
+      this.$refs.menuTree.filter(val);
+    },
+    deptNameFilter (val) {
+      this.$refs.deptTree.filter(val);
+    }
+  }
+}
+</script>
+
+<style scoped>
+</style>

orange-admin-web/src/views/upms/formEditSysDept/index.vue

@@ -0,0 +1,205 @@
+<template>
+  <div class="form-single-fragment" style="position: relative;">
+    <el-form ref="formEditSysDept" :model="formData" :rules="rules" style="width: 100%;"
+      label-width="100px" size="mini" label-position="right" @submit.native.prevent>
+      <el-row :gutter="20">
+        <el-col :span="24">
+          <el-form-item label="所属部门" prop="SysDept.parentId">
+            <el-cascader class="input-item" v-model="formEditSysDept.parentId.value" :clearable="true"
+              placeholder="所属部门" :loading="formEditSysDept.parentId.impl.loading" :props="{value: 'id', label: 'name', checkStrictly: true}"
+              @visible-change="onParentIdVisibleChange" :options="formEditSysDept.parentId.impl.dropdownList"
+              @change="onParentIdValueChange">
+            </el-cascader>
+          </el-form-item>
+        </el-col>
+        <el-col :span="24">
+          <el-form-item label="部门名称" prop="SysDept.deptName">
+            <el-input class="input-item" v-model="formData.SysDept.deptName"
+              :clearable="true" placeholder="部门名称" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="24">
+          <el-form-item label="显示顺序" prop="SysDept.showOrder">
+            <el-input-number class="input-item" v-model="formData.SysDept.showOrder"
+              :clearable="true" controls-position="right" placeholder="显示顺序" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="24">
+          <el-row type="flex" justify="end">
+            <el-button type="primary" size="mini" :plain="true"
+              @click="onCancel(false)">
+              取消
+            </el-button>
+            <el-button type="primary" size="mini" @click="onUpdateClick()"
+              :disabled="!(checkPermCodeExist('formSysDept:fragmentSysDept:update') || checkPermCodeExist('formSysDept:fragmentSysDept:add'))">
+              保存
+            </el-button>
+          </el-row>
+        </el-col>
+      </el-row>
+    </el-form>
+  </div>
+</template>
+
+<script>
+import { findTreeNodePath } from '@/utils';
+/* eslint-disable-next-line */
+import { DropdownWidget, TableWidget, UploadWidget, ChartWidget } from '@/utils/widget.js';
+/* eslint-disable-next-line */
+import { uploadMixin, statsDateRangeMixin, cachedPageChildMixin } from '@/core/mixins';
+/* eslint-disable-next-line */
+import { SysDeptController, DictionaryController } from '@/api';
+
+export default {
+  name: 'formEditSysDept',
+  props: {
+    deptId: {
+      default: undefined
+    }
+  },
+  mixins: [uploadMixin, statsDateRangeMixin, cachedPageChildMixin],
+  data () {
+    return {
+      formData: {
+        SysDept: {
+          deptId: undefined,
+          deptName: undefined,
+          showOrder: undefined,
+          parentId: undefined,
+          deletedFlag: undefined,
+          createUserId: undefined,
+          createUsername: undefined,
+          createTime: undefined,
+          updateTime: undefined
+        }
+      },
+      rules: {
+        'SysDept.deptName': [
+          {required: true, message: '请输入部门名称', trigger: 'blur'}
+        ],
+        'SysDept.showOrder': [
+          {required: true, message: '请输入显示顺序', trigger: 'blur'}
+        ]
+      },
+      formEditSysDept: {
+        formFilter: {
+        },
+        formFilterCopy: {
+        },
+        parentId: {
+          impl: new DropdownWidget(this.loadParentIdDropdownList, true, 'deptId'),
+          value: []
+        },
+        isInit: false
+      }
+    }
+  },
+  methods: {
+    onCancel (isSuccess) {
+      if (this.observer != null) {
+        this.observer.cancel(isSuccess);
+      }
+    },
+    /**
+     * 所属部门下拉数据获取函数
+     */
+    loadParentIdDropdownList () {
+      return new Promise((resolve, reject) => {
+        let params = {};
+        DictionaryController.dictSysDept(this, params).then(res => {
+          resolve(res.getList());
+        }).catch(e => {
+          reject(e);
+        });
+      });
+    },
+    /**
+     * 所属部门下拉框显隐
+     */
+    onParentIdVisibleChange (show) {
+      this.formEditSysDept.parentId.impl.onVisibleChange(show).catch(e => {});
+    },
+    /**
+     * 所属部门选中值改变
+     */
+    onParentIdValueChange (value) {
+    },
+    /**
+     * 更新编辑用户
+     */
+    refreshFormEditSysDept (reloadData = false) {
+      this.formEditSysDept.parentId.impl.onVisibleChange(true).then(res => {
+        if (!this.formEditSysDept.isInit) {
+          this.formEditSysDept.parentId.value = findTreeNodePath(
+            this.formEditSysDept.parentId.impl.dropdownList, this.formData.SysDept.parentId, 'deptId');
+        }
+        this.formEditSysDept.isInit = true;
+      });
+    },
+    /**
+     * 编辑
+     */
+    onUpdateClick () {
+      this.$refs.formEditSysDept.validate((valid) => {
+        if (!valid) return;
+        let params = {
+          sysDept: {
+            deptName: this.formData.SysDept.deptName,
+            showOrder: this.formData.SysDept.showOrder,
+            parentId: Array.isArray(this.formEditSysDept.parentId.value) ? this.formEditSysDept.parentId.value[this.formEditSysDept.parentId.value.length - 1] : undefined,
+            deptId: this.deptId
+          }
+        };
+        if (this.isEdit) {
+          SysDeptController.update(this, params).then(res => {
+            this.$message.success('编辑成功');
+            this.onCancel(true);
+          }).catch(e => {});
+        } else {
+          SysDeptController.add(this, params).then(res => {
+            this.$message.success('新建成功');
+            this.onCancel(true);
+          }).catch(e => {});
+        }
+      });
+    },
+    /**
+     * 获取部门管理详细信息
+     */
+    loadSysDeptData () {
+      if (!this.isEdit) return;
+      let params = {
+        deptId: this.deptId
+      };
+
+      return new Promise((resolve, reject) => {
+        SysDeptController.view(this, params).then(res => {
+          this.formData.SysDept = {...res.data};
+          resolve();
+        }).catch(e => {
+          reject();
+        });
+      });
+    },
+    initFormData () {
+    },
+    formInit () {
+      let loadAllDatasource = [
+        this.loadSysDeptData()
+      ];
+      Promise.all(loadAllDatasource).then(res => {
+        this.initFormData();
+        this.refreshFormEditSysDept();
+      }).catch(e => {});
+    }
+  },
+  computed: {
+    isEdit () {
+      return this.deptId != null;
+    }
+  },
+  created () {
+    this.formInit();
+  }
+}
+</script>

orange-admin-web/src/views/upms/formEditSysMenu/index.vue

@@ -0,0 +1,278 @@
+<template>
+  <el-form ref="form" :model="formData" :rules="rules" label-width="110px" size="mini" label-position="right" @submit.native.prevent>
+    <el-row :gutter="20" class="full-width-input">
+      <el-col :span="12">
+        <el-form-item label="上级菜单">
+          <el-cascader :options="menuTree" v-model="parentMenuPath" :props="menuProps" placeholder="选择父菜单"
+            :disabled="!canEditParent" :clearable="true" :change-on-select="true" size="mini"
+            @change="onParentMenuChange" />
+        </el-form-item>
+      </el-col>
+      <el-col :span="12" >
+        <el-form-item label="菜单名称" prop="menuName">
+          <el-input v-model="formData.menuName" placeholder="菜单名称" clearable />
+        </el-form-item>
+      </el-col>
+      <el-col :span="12">
+        <el-form-item label="菜单类型" prop="menuType">
+          <el-select v-model="formData.menuType" :disabled="isEdit" placeholder="菜单类型" @change="onMenuTypeChange">
+            <el-option v-for="item in getValidMenuType" :key="item.id" :value="item.id" :label="item.name" />
+          </el-select>
+        </el-form-item>
+      </el-col>
+      <el-col :span="12">
+        <el-form-item label="显示顺序" prop="showOrder">
+          <el-input-number v-model="formData.showOrder" controls-position="right"
+            :min="1" :max="99999" placeholder="请输入显示顺序"></el-input-number>
+        </el-form-item>
+      </el-col>
+      <el-col :span="12">
+        <el-form-item label="菜单路由">
+          <el-input v-model="formData.formRouterName" placeholder="菜单路由" :disabled="formData.menuType !== 1" />
+        </el-form-item>
+      </el-col>
+      <el-col :span="12">
+        <el-form-item label="菜单图标" prop="icon">
+          <icon-select v-model="formData.icon" :height="28" />
+        </el-form-item>
+      </el-col>
+      <el-col :span="24">
+        <el-card shadow="never">
+          <div slot="header" class="card-header">
+            <span>权限字列表</span>
+            <el-input size="mini" v-model="permCodeNameFilter" placeholder="输入权限字名称过滤" style="width: 250px;" clearable suffix-icon="el-icon-search" />
+          </div>
+          <el-scrollbar style="height: 210px;" wrap-class="scrollbar_dropdown__wrap">
+            <el-tree ref="permCodeTree" v-show="formData.menuType" :check-strictly="true"
+              :props="treeProps" node-key="permCodeId" :default-expanded-keys="defaultExpandedKeys"
+              show-checkbox :data="getPermCodeTree" :filter-node-method="filterPermCodeNode"></el-tree>
+          </el-scrollbar>
+        </el-card>
+      </el-col>
+    </el-row>
+    <!-- 弹窗按钮 -->
+    <el-row type="flex" justify="end" class="dialog-btn-layer mt20">
+      <el-button size="mini" @click="onCancel(false)" >取消</el-button>
+      <el-button type="primary" size="mini" @click="onSubmit"
+        :disabled="!(checkPermCodeExist('formSysMenu:fragmentSysMenu:add') || checkPermCodeExist('formSysMenu:fragmentSysMenu:update'))">
+        确定
+      </el-button>
+    </el-row>
+  </el-form>
+</template>
+
+<script>
+import { treeDataTranslate, findTreeNodePath, findTreeNode, findItemFromList } from '@/utils'
+import { SystemController } from '@/api'
+import IconSelect from '@/components/IconSelect/index.vue'
+
+export default {
+  props: {
+    menuId: {
+      type: String
+    },
+    parentId: {
+      type: String
+    },
+    menuList: {
+      type: Array,
+      default: undefined
+    },
+    rowData: {
+      type: Object,
+      default: undefined
+    }
+  },
+  components: {
+    IconSelect
+  },
+  data () {
+    return {
+      // 是否自动用上级菜单的名称过滤权限字列表，当这个开关打开后，会使用getAutoFilterString返回的字符串当做过滤字符串
+      autoFilter: false,
+      permCodeNameFilter: undefined,
+      allowParentList: [],
+      formData: {
+        menuId: undefined,
+        parentId: undefined,
+        menuName: undefined,
+        showOrder: undefined,
+        menuType: undefined,
+        icon: undefined,
+        formRouterName: undefined
+      },
+      menuProps: {
+        label: 'menuName',
+        value: 'menuId'
+      },
+      parentMenuType: undefined,
+      parentMenuPath: [],
+      menuTree: [],
+      permCodeList: [],
+      selectPermCode: undefined,
+      defaultExpandedKeys: [],
+      rules: {
+        menuName: [{required: true, message: '请输入菜单名称', trigger: 'blur'}],
+        showOrder: [{required: true, message: '请输入菜单显示顺序', trigger: 'blur'}],
+        formRouterName: [{required: true, message: '请输入菜单路由名称', trigger: 'blur'}]
+      },
+      treeProps: {
+        label: 'showName'
+      }
+    };
+  },
+  methods: {
+    getAutoFilterString () {
+      let node = findTreeNode(this.menuTree, this.parentMenuPath[this.parentMenuPath.length - 1], 'menuId');
+      return node ? node.menuName : undefined;
+    },
+    onMenuTypeChange (value) {
+      if (this.autoFilter && value === this.SysMenuType.BUTTON && (this.permCodeNameFilter == null || this.permCodeNameFilter === '')) {
+        this.permCodeNameFilter = this.getAutoFilterString();
+      }
+    },
+    filterPermCodeNode (value, data) {
+      if (!value) return true;
+      if (data.showName.indexOf(value) !== -1) {
+        this.allowParentList.push(data.permCodeId);
+        return true;
+      } else {
+        return this.allowParentList.indexOf(data.parentId) !== -1;
+      }
+    },
+    onParentMenuChange (value, isInit) {
+      if (!isInit) this.formData.menuType = undefined;
+      this.parentMenuType = undefined;
+      if (Array.isArray(value) && value.length > 0) {
+        let node = findTreeNode(this.menuTree, value[value.length - 1], 'menuId');
+        if (node) this.parentMenuType = node.menuType;
+      }
+    },
+    onCancel (isSuccess) {
+      if (this.observer != null) {
+        this.observer.cancel(isSuccess);
+      }
+    },
+    onSubmit () {
+      return new Promise((resolve, reject) => {
+        this.$refs['form'].validate((valid) => {
+          if (valid) {
+            let params = {};
+            params.sysMenu = {...this.formData};
+
+            if (this.parentMenuPath.length > 0) {
+              params.sysMenu.parentId = this.parentMenuPath[this.parentMenuPath.length - 1];
+            }
+
+            if ([this.SysMenuType.MENU, this.SysMenuType.BUTTON, this.SysMenuType.FRAGMENT].indexOf(params.sysMenu.menuType) !== -1) {
+              let tempList = this.$refs.permCodeTree.getHalfCheckedKeys();
+              tempList = tempList.concat(this.$refs.permCodeTree.getCheckedKeys());
+              params.permCodeIdListString = tempList.join(',');
+            }
+            
+            if (this.isEdit) {
+              SystemController.updateMenu(this, params).then(res => {
+                resolve(res);
+                this.$message.success('编辑成功');
+                this.onCancel(true);
+              }).catch(e => {
+                reject(e);
+              });
+            } else {
+              SystemController.addMenu(this, params).then(res => {
+                resolve(res);
+                this.$message.success('添加成功');
+                this.onCancel(true);
+              }).catch(e => {
+                reject(e);
+              });
+            }
+          } else {
+            reject();
+          }
+        });
+      });
+    },
+    formatMenuTree () {
+      this.menuTree = [];
+      if (Array.isArray(this.menuList)) {
+        this.menuTree = this.menuList.filter((item) => {
+          return item.menuType !== this.SysMenuType.BUTTON && item.menuId !== this.formData.menuId;
+        });
+      }
+      this.menuTree = treeDataTranslate(this.menuTree, 'menuId', 'parentId');
+    },
+    initData () {
+      this.defaultExpandedKeys = [];
+      this.formatMenuTree();
+      this.parentMenuPath = findTreeNodePath(this.menuTree, this.formData.parentId, 'menuId');
+      this.onParentMenuChange(this.parentMenuPath, true);
+      this.onMenuTypeChange(this.formData.menuType);
+      SystemController.getPermCodeList(this, {}).then(res => {
+        this.permCodeList = res.data;
+        if (Array.isArray(this.formData.permCodeIdList) && this.formData.permCodeIdList.length > 0) {
+          let tempList = [];
+          this.permCodeList.forEach((item) => {
+            if (findItemFromList(this.formData.permCodeIdList, item.permCodeId) != null) {
+              tempList.push(item.permCodeId);
+            }
+          });
+          this.defaultExpandedKeys = tempList;
+          this.$refs.permCodeTree.setCheckedKeys(tempList);
+          this.$nextTick(() => {
+            this.allowParentList = [];
+            if (this.permCodeNameFilter != null && this.permCodeNameFilter !== '') this.$refs.permCodeTree.filter(this.permCodeNameFilter);
+          });
+        }
+      }).catch(e => {});
+    }
+  },
+  computed: {
+    getValidMenuType () {
+      let allList = this.SysMenuType.getList();
+      if (this.parentMenuType == null) {
+        return allList;
+      } else {
+        return allList.filter((item) => {
+          switch (Number.parseInt(this.parentMenuType)) {
+            case this.SysMenuType.DIRECTORY: return item.id === this.SysMenuType.MENU;
+            case this.SysMenuType.MENU: return [this.SysMenuType.FRAGMENT, this.SysMenuType.BUTTON].indexOf(item.id) !== -1;
+            case this.SysMenuType.FRAGMENT: return item.id === this.SysMenuType.BUTTON;
+            default: return false;
+          }
+        });
+      }
+    },
+    isEdit () {
+      return this.formData.menuId != null;
+    },
+    // 判断是否新建一个目录
+    isNew () {
+      return this.formData.parentId == null && this.formData.menuId == null;
+    },
+    canEditParent () {
+      return this.parentId == null;
+    },
+    getPermCodeTree () {
+      if (this.permCodeList != null) {
+        return treeDataTranslate(this.permCodeList, 'permCodeId', 'parentId');
+      } else {
+        return [];
+      }
+    }
+  },
+  mounted () {
+    if (this.rowData != null) {
+      this.formData = {...this.formData, ...this.rowData};
+    }
+    if (this.parentId != null) this.formData.parentId = this.parentId;
+    this.initData();
+  },
+  watch: {
+    permCodeNameFilter (val) {
+      this.allowParentList = [];
+      this.$refs.permCodeTree.filter(val);
+    }
+  }
+};
+</script>

orange-admin-web/src/views/upms/formEditSysPerm/index.vue

@@ -0,0 +1,169 @@
+<template>
+  <div class="form-single-fragment" style="position: relative;">
+    <el-form ref="formCreatePerm" :model="formData" class="full-width-input" :rules="rules" style="width: 100%;"
+      label-width="100px" size="mini" label-position="right" @submit.native.prevent>
+      <el-row :gutter="20">
+        <el-col :span="24">
+          <el-form-item label="权限名称" prop="SysPerm.permName">
+            <el-input class="input-item" v-model="formData.SysPerm.permName"
+              :clearable="true" placeholder="权限名称" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="24">
+          <el-form-item label="所属模块" prop="SysPerm.moduleId">
+            <el-cascader class="input-item" :options="permModuleList" v-model="formData.SysPerm.moduleId"
+              placeholder="选择所属模块" :clearable="true" size="mini" :props="{value: 'moduleId', label: 'moduleName'}" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="24">
+          <el-form-item label="关联的url" prop="SysPerm.url">
+            <el-input class="input-item" v-model="formData.SysPerm.url"
+              :clearable="true" placeholder="关联的url" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="24">
+          <el-form-item label="显示顺序" prop="SysPerm.showOrder">
+            <el-input-number class="input-item" v-model="formData.SysPerm.showOrder"
+              :clearable="true" controls-position="right" placeholder="权限在当前模块下的顺序" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="24">
+          <el-row type="flex" justify="end">
+            <el-button type="primary" size="mini" :plain="true"
+              @click="onCancel(false)">
+              取消
+            </el-button>
+            <el-button type="primary" size="mini" @click="onAddClick()"
+              :disabled="!(checkPermCodeExist('formSysPerm:fragmentSysPerm:updatePerm') || checkPermCodeExist('formSysPerm:fragmentSysPerm:addPerm'))">
+              保存
+            </el-button>
+          </el-row>
+        </el-col>
+      </el-row>
+    </el-form>
+  </div>
+</template>
+
+<script>
+import { findTreeNodePath } from '@/utils';
+/* eslint-disable-next-line */
+import { uploadMixin, statsDateRangeMixin, cachedPageChildMixin } from '@/core/mixins';
+/* eslint-disable-next-line */
+import { SystemController, DictionaryController } from '@/api';
+
+export default {
+  name: 'formEditSysPerm',
+  props: {
+    permId: {
+      default: undefined
+    },
+    moduleId: {
+      default: undefined
+    },
+    rowData: {
+      type: Object
+    },
+    currentPermGroupId: String,
+    permModuleList: {
+      type: Array,
+      default: () => {
+        return [];
+      }
+    }
+  },
+  mixins: [uploadMixin, statsDateRangeMixin, cachedPageChildMixin],
+  data () {
+    return {
+      formData: {
+        SysPerm: {
+          permId: undefined,
+          moduleId: this.currentPermGroupId,
+          permName: undefined,
+          url: undefined,
+          showOrder: undefined,
+          createTime: undefined,
+          deletedFlag: undefined
+        }
+      },
+      rules: {
+        'SysPerm.permName': [
+          {required: true, message: '请输入权限名称', trigger: 'blur'}
+        ],
+        'SysPerm.url': [
+          {required: true, message: '请输入关联的url', trigger: 'blur'}
+        ],
+        'SysPerm.showOrder': [
+          {required: true, message: '请输入显示顺序', trigger: 'blur'}
+        ]
+      },
+      formCreatePerm: {
+        formFilter: {
+        },
+        formFilterCopy: {
+        },
+        isInit: false
+      }
+    }
+  },
+  methods: {
+    onCancel (isSuccess) {
+      if (this.observer != null) {
+        this.observer.cancel(isSuccess);
+      }
+    },
+    /**
+     * 更新新建权限
+     */
+    refreshFormCreatePerm (reloadData = false) {
+      if (!this.formCreatePerm.isInit) {
+        this.formData.SysPerm.moduleId = findTreeNodePath(this.permModuleList, this.formData.SysPerm.moduleId, 'moduleId');
+      }
+      this.formCreatePerm.isInit = true;
+    },
+    /**
+     * 新增
+     */
+    onAddClick () {
+      this.$refs.formCreatePerm.validate((valid) => {
+        if (!valid) return;
+        let params = {
+          sysPerm: {
+            permId: this.permId,
+            showOrder: this.formData.SysPerm.showOrder,
+            moduleId: Array.isArray(this.formData.SysPerm.moduleId) ? this.formData.SysPerm.moduleId[this.formData.SysPerm.moduleId.length - 1] : undefined,
+            url: this.formData.SysPerm.url,
+            permName: this.formData.SysPerm.permName
+          }
+        };
+
+        if (this.isEdit) {
+          SystemController.updatePerm(this, params).then(res => {
+            this.$message.success('编辑成功');
+            this.onCancel(true);
+          }).catch(e => {});
+        } else {
+          SystemController.addPerm(this, params).then(res => {
+            this.$message.success('新增成功');
+            this.onCancel(true);
+          }).catch(e => {});
+        }
+      });
+    },
+    initFormData () {
+      if (this.rowData != null) this.formData.SysPerm = {...this.formData.SysPerm, ...this.rowData};
+    },
+    formInit () {
+      this.initFormData();
+      this.refreshFormCreatePerm();
+    }
+  },
+  computed: {
+    isEdit () {
+      return this.permId != null;
+    }
+  },
+  created () {
+    this.formInit();
+  }
+}
+</script>

orange-admin-web/src/views/upms/formEditSysPermCode/index.vue

@@ -0,0 +1,218 @@
+<template>
+  <el-form ref="form" :model="formData" :rules="rules" label-width="110px" size="mini" label-position="right" @submit.native.prevent>
+    <el-row :gutter="20" class="full-width-input">
+      <el-col :span="24">
+        <el-form-item label="所属权限字">
+          <el-cascader :options="permCodeTree" v-model="parentPermCodePath" :props="permCodeProps" filterable
+            :disabled="formData.permCodeId != null || formData.parenId == null" placeholder="选择父权限字" :clearable="true" :change-on-select="true" size="mini" />
+        </el-form-item>
+      </el-col>
+      <el-col :span="12">
+        <el-form-item label="权限字名称" prop="showName">
+          <el-input v-model="formData.showName" placeholder="权限字名称" clearable ></el-input>
+        </el-form-item>
+      </el-col>
+      <el-col :span="12">
+        <el-form-item label="权限字标识" prop="permCode">
+          <el-input v-model="formData.permCode" placeholder="权限字标识" clearable ></el-input>
+        </el-form-item>
+      </el-col>
+      <el-col :span="12">
+        <el-form-item label="权限字类型" prop="permCode">
+          <el-select v-model="formData.permCodeType" placeholder="权限字类型" :disabled="true">
+            <el-option v-for="item in SysPermCodeType.getList()" :key="item.id" :label="item.name" :value="item.id" />
+          </el-select>
+        </el-form-item>
+      </el-col>
+      <el-col :span="12">
+        <el-form-item label="显示顺序" prop="showOrder">
+          <el-input-number v-model="formData.showOrder" controls-position="right"
+            :min="1" :max="99999" placeholder="请输入显示顺序"></el-input-number>
+        </el-form-item>
+      </el-col>
+      <el-col :span="24">
+        <el-card shadow="never">
+          <div slot="header" class="card-header">
+            <span>权限列表</span>
+            <el-input size="mini" v-model="permNameFilter" placeholder="输入权限名称过滤" style="width: 250px;" clearable suffix-icon="el-icon-search" />
+          </div>
+          <el-scrollbar style="height: 215px;" wrap-class="scrollbar_dropdown__wrap">
+            <el-tree ref="permTree" :data="formData.permCodeType === SysPermCodeType.FORM ? [] : getPermTree" :props="treeProps" show-checkbox
+              node-key="id" empty-text="暂无权限资源" :filter-node-method="filterPermNode"
+              :default-expanded-keys="defaultExpandedKeys">
+              <div slot-scope="{ data }" style="display: flex; justify-content: space-between; width: 100%">
+                <span>{{ data.name }}</span>
+                <span style="margin-right: 10px;">{{ data.url }}</span>
+              </div>
+            </el-tree>
+          </el-scrollbar>
+        </el-card>
+      </el-col>
+    </el-row>
+    <!-- 弹窗按钮 -->
+    <el-row type="flex" justify="end" class="dialog-btn-layer mt20">
+      <el-button size="mini" @click="onCancel(false)" >取消</el-button>
+      <el-button type="primary" size="mini" @click="onSubmit"
+        :disabled="!(checkPermCodeExist('formSysPermCode:fragmentSysPermCode:add') || checkPermCodeExist('formSysPermCode:fragmentSysPermCode:update'))">
+        确定
+      </el-button>
+    </el-row>
+  </el-form>
+</template>
+
+<script>
+import { treeDataTranslate, findTreeNodePath } from '@/utils'
+import { SystemController } from '@/api'
+
+export default {
+  props: {
+    permCodeTree: {
+      type: Array,
+      default: function () {
+        return [];
+      }
+    },
+    permCodeType: {
+      type: Number,
+      default: undefined
+    },
+    rowData: {
+      type: Object
+    }
+  },
+  data () {
+    return {
+      permNameFilter: undefined,
+      allowParentList: [],
+      formData: {
+        permCodeId: undefined,
+        parentId: undefined,
+        permCode: undefined,
+        permCodeType: this.permCodeType || this.SysPermCodeType.FORM,
+        showName: undefined,
+        showOrder: undefined
+      },
+      parentPermCodePath: [],
+      permList: [],
+      defaultExpandedKeys: [],
+      treeProps: {
+        label: 'name',
+        isLeaf: function (data, node) {
+          return data.isPerm;
+        }
+      },
+      permCodeProps: {
+        label: 'showName',
+        value: 'permCodeId'
+      },
+      rules: {
+        showName: [{required: true, message: '权限字名称不能为空', trigger: 'blur'}],
+        permCode: [{required: true, message: '权限字标识不能为空', trigger: 'blur'}],
+        showOrder: [{required: true, message: '请输入权限字显示顺序', trigger: 'blur'}],
+        permCodeType: [{required: true, message: '请选择权限字类型', trigger: 'blur'}]
+      }
+    }
+  },
+  methods: {
+    filterPermNode (value, data) {
+      if (!value) return true;
+      if (data.name.indexOf(value) !== -1) {
+        this.allowParentList.push(data.id);
+        return true;
+      } else {
+        return this.allowParentList.indexOf(data.parentId) !== -1;
+      }
+    },
+    getTreeLeafKeys () {
+      let selectPermNodeList = this.$refs.permTree.getCheckedNodes();
+      let tempList = [];
+      selectPermNodeList.forEach((item) => {
+        if (item.isPerm) {
+          tempList.push(item.id);
+        }
+      });
+
+      return tempList;
+    },
+    onCancel (isSuccess) {
+      if (this.observer != null) {
+        this.observer.cancel(isSuccess);
+      }
+    },
+    onSubmit () {
+      return new Promise((resolve, reject) => {
+        this.$refs['form'].validate((valid) => {
+          if (valid) {
+            let selectedPermList = this.getTreeLeafKeys();
+            let params = {};
+            params.sysPermCode = {...this.formData};
+            delete params.sysPermCode.children;
+            params.sysPermCode.permCodeType = (this.permCodeType == null) ? this.SysPermCodeType.FORM : this.permCodeType;
+            if (this.parentPermCodePath.length > 0) {
+              params.sysPermCode.parentId = this.parentPermCodePath[this.parentPermCodePath.length - 1];
+            }
+            params.permIdListString = selectedPermList.join(',');
+            if (params.sysPermCode.permCodeId != null) {
+              SystemController.updatePermCode(this, params).then(res => {
+                resolve(res);
+                this.$message.success('编辑成功');
+                this.onCancel(true);
+              }).catch(e => {
+                reject(e);
+              });
+            } else {
+              SystemController.addPermCode(this, params).then(res => {
+                resolve(res);
+                this.$message.success('添加成功');
+                this.onCancel(true);
+              }).catch(e => {
+                reject(e);
+              });
+            }
+          } else {
+            reject();
+          }
+        });
+      });
+    },
+    initData () {
+      SystemController.getAllPermList(this, {}).then(res => {
+        res.data.forEach((item) => {
+          item.id = item.id + '';
+          item.parentId = item.parentId + '';
+        });
+        this.permList = res.data;
+        this.defaultExpandedKeys = this.formData.permIdList;
+        if (Array.isArray(this.formData.permIdList)) {
+          this.$refs.permTree.setCheckedKeys(this.formData.permIdList, true);
+        }
+      }).catch(e => {});
+    }
+  },
+  computed: {
+    getPermTree () {
+      return treeDataTranslate(this.permList.map((item) => {
+        return {...item};
+      }), 'id', 'parentId');
+    }
+  },
+  mounted () {
+    if (this.rowData != null) {
+      this.formData = {...this.formData, ...this.rowData};
+      if (this.formData.parentId != null && this.permCodeTree != null && Array.isArray(this.permCodeTree)) {
+        this.parentPermCodePath = findTreeNodePath(this.permCodeTree, this.formData.parentId, 'permCodeId');
+      } else {
+        this.parentPermCodePath = [];
+      }
+    }
+
+    this.initData();
+  },
+  watch: {
+    permNameFilter (val) {
+      this.allowParentList = [];
+      this.$refs.permTree.filter(val);
+    }
+  }
+}
+</script>

orange-admin-web/src/views/upms/formEditSysPermModule/index.vue

@@ -0,0 +1,185 @@
+<template>
+  <div class="form-single-fragment" style="position: relative;">
+    <el-form ref="formCreatePermModule" :model="formData" class="full-width-input" :rules="rules" style="width: 100%;"
+      label-width="120px" size="mini" label-position="right" @submit.native.prevent>
+      <el-row :gutter="20">
+        <el-col :span="24">
+          <el-form-item label="模块名称" prop="SysPermModule.moduleName">
+            <el-input class="input-item" v-model="formData.SysPermModule.moduleName"
+              :clearable="true" placeholder="权限模块名称" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="24">
+          <el-form-item label="模块类型">
+            <el-select class="input-item" v-model="formData.SysPermModule.moduleType"
+              placeholder="模块类型" :clearable="true" size="mini" :disabled="isEdit">
+              <el-option v-for="item in SysPermModuleType.getList()" :key="item.id" :value="item.id" :label="item.name" />
+            </el-select>
+          </el-form-item>
+        </el-col>
+        <el-col :span="24">
+          <el-form-item label="所属模块">
+            <el-cascader class="input-item" :options="getPermGroupTree" v-model="formData.SysPermModule.parentId"
+              placeholder="选择所属模块" :clearable="true" size="mini"
+              :props="{value: 'moduleId', label: 'moduleName', checkStrictly: true}" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="24">
+          <el-form-item label="显示顺序" prop="SysPermModule.showOrder">
+            <el-input-number class="input-item" v-model="formData.SysPermModule.showOrder"
+              :clearable="true" controls-position="right" placeholder="权限模块在当前层级下的顺序" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="24">
+          <el-row type="flex" justify="end">
+            <el-button type="primary" size="mini" :plain="true" @click="onCancel(false)">
+              取消
+            </el-button>
+            <el-button type="primary" size="mini" @click="onAddClick()"
+              :disabled="!(checkPermCodeExist('formSysPerm:fragmentSysPerm:addPermModule') || checkPermCodeExist('formSysPerm:fragmentSysPerm:updatePermModule'))">
+              保存
+            </el-button>
+          </el-row>
+        </el-col>
+      </el-row>
+    </el-form>
+  </div>
+</template>
+
+<script>
+import { treeDataTranslate, findTreeNodePath } from '@/utils';
+/* eslint-disable-next-line */
+import { uploadMixin, statsDateRangeMixin, cachedPageChildMixin } from '@/core/mixins';
+/* eslint-disable-next-line */
+import { DictionaryController, SystemController } from '@/api';
+
+export default {
+  name: 'formEditSysPermModule',
+  props: {
+    parentId: {
+      default: undefined
+    },
+    moduleType: {
+      default: undefined
+    },
+    moduleId: {
+      default: undefined
+    },
+    rowData: {
+      type: Object,
+      default: undefined
+    },
+    moduleList: {
+      type: Array,
+      default: () => {
+        return []
+      }
+    }
+  },
+  mixins: [uploadMixin, statsDateRangeMixin, cachedPageChildMixin],
+  data () {
+    return {
+      formData: {
+        SysPermModule: {
+          moduleId: undefined,
+          parentId: undefined,
+          moduleName: undefined,
+          moduleType: undefined,
+          level: undefined,
+          showOrder: undefined,
+          createTime: undefined
+        }
+      },
+      rules: {
+        'SysPermModule.moduleName': [
+          {required: true, message: '请输入模块名称', trigger: 'blur'}
+        ],
+        'SysPermModule.showOrder': [
+          {required: true, message: '请输入显示顺序', trigger: 'blur'}
+        ]
+      },
+      formCreatePermModule: {
+        formFilter: {
+        },
+        formFilterCopy: {
+        },
+        isInit: false
+      }
+    }
+  },
+  methods: {
+    onCancel (isSuccess) {
+      if (this.observer != null) {
+        this.observer.cancel(isSuccess);
+      }
+    },
+    /**
+     * 更新新建权限模块
+     */
+    refreshFormCreatePermModule (reloadData = false) {
+      if (!this.formCreatePermModule.isInit) {
+        this.formData.SysPermModule.parentId = findTreeNodePath(this.getPermGroupTree, this.formData.SysPermModule.parentId, 'moduleId')
+      }
+      this.formCreatePermModule.isInit = true;
+    },
+    /**
+     * 新增
+     */
+    onAddClick () {
+      this.$refs.formCreatePermModule.validate((valid) => {
+        if (!valid) return;
+        let params = {
+          sysPermModule: {
+            moduleId: this.moduleId,
+            moduleName: this.formData.SysPermModule.moduleName,
+            showOrder: this.formData.SysPermModule.showOrder,
+            moduleType: this.formData.SysPermModule.moduleType,
+            parentId: Array.isArray(this.formData.SysPermModule.parentId) ? this.formData.SysPermModule.parentId[this.formData.SysPermModule.parentId.length - 1] : undefined
+          }
+        };
+
+        if (this.isEdit) {
+          SystemController.updatePermGroup(this, params).then(res => {
+            this.$message.success('编辑成功');
+            this.onCancel(true);
+          }).catch(e => {});
+        } else {
+          SystemController.addPermGroup(this, params).then(res => {
+            this.$message.success('新增成功');
+            this.onCancel(true);
+          }).catch(e => {});
+        }
+      });
+    },
+    initFormData () {
+      if (this.rowData != null) {
+        this.formData.SysPermModule = {...this.formData.SysPermModule, ...this.rowData};
+      }
+      if (this.parentId != null) this.formData.SysPermModule.parentId = this.parentId;
+      if (this.moduleType != null) this.formData.SysPermModule.moduleType = this.moduleType;
+    },
+    formInit () {
+      this.initFormData();
+      this.refreshFormCreatePermModule();
+    }
+  },
+  computed: {
+    isEdit () {
+      return this.moduleId != null;
+    },
+    getPermGroupTree () {
+      let tempList = this.moduleList.map((item) => {
+        if (item.moduleType === this.SysPermModuleType.GROUP) {
+          return {...item, children: undefined};
+        }
+      }).filter((item) => {
+        return item != null;
+      });
+      return treeDataTranslate(tempList, 'moduleId');
+    }
+  },
+  mounted () {
+    this.formInit();
+  }
+}
+</script>

orange-admin-web/src/views/upms/formEditSysRole/index.vue

@@ -0,0 +1,152 @@
+<template>
+  <el-form ref="form" :model="formData" :rules="rules" label-width="80px" size="mini" label-position="right" @submit.native.prevent>
+    <el-row :gutter="20">
+      <el-col :span="24">
+        <el-form-item label="角色名称" prop="roleName">
+          <el-input v-model="formData.roleName" placeholder="角色名称" clearable />
+        </el-form-item>
+        <el-form-item v-if="false" label="角色类型" :required="true">
+          <el-radio-group v-model="formData.adminRole">
+            <el-radio :label="1">管理员</el-radio>
+            <el-radio :label="0">其他</el-radio>
+          </el-radio-group>
+        </el-form-item>
+        <el-card shadow="never">
+          <div slot="header" class="card-header">
+            <span>菜单权限</span>
+            <el-input size="mini" v-model="menuNameFilter" placeholder="输入菜单名称过滤" style="width: 250px;" clearable suffix-icon="el-icon-search" />
+          </div>
+          <el-scrollbar style="height: 230px;" wrap-class="scrollbar_dropdown__wrap">
+            <el-tree ref="authTree" :data="authData" :props="treeProps" :check-strictly="false"
+              show-checkbox node-key="menuId" :filter-node-method="filterMneuNode">
+            </el-tree>
+          </el-scrollbar>
+        </el-card>
+      </el-col>
+    </el-row>
+    <!-- 弹窗下发按钮栏，必须设置class为dialog-btn-layer -->
+    <el-row type="flex" justify="end" class="dialog-btn-layer" style="margin-top: 20px;">
+      <el-button size="mini" @click="onCancel(false)" >取消</el-button>
+      <el-button type="primary" size="mini" @click="onSubmit"
+        :disabled="!(checkPermCodeExist('formSysRole:fragmentSysRole:update') || checkPermCodeExist('formSysRole:fragmentSysRole:add'))">
+        确定
+      </el-button>
+    </el-row>
+  </el-form>
+</template>
+
+<script>
+import { treeDataTranslate, findItemFromList } from '@/utils'
+import { SystemController } from '@/api'
+
+export default {
+  props: {
+    rowData: {
+      type: Object
+    }
+  },
+  data () {
+    return {
+      menuNameFilter: undefined,
+      formData: {
+        roleId: undefined,
+        roleName: undefined,
+        adminRole: false,
+        menuIdListString: undefined
+        /*
+        permsJsonData: {
+          checked: [],
+          halfChecked: [],
+        },
+        */
+      },
+      rules: {
+        roleName: [{required: true, message: '角色名称不能为空', trigger: 'blur'}]
+      },
+      treeProps: {
+        label: 'menuName'
+      },
+      authData: [],
+      allowParentList: []
+    }
+  },
+  methods: {
+    filterMneuNode (value, data) {
+      if (!value) return true;
+      if (data.menuName.indexOf(value) !== -1) {
+        this.allowParentList.push(data.menuId);
+        return true;
+      } else {
+        return this.allowParentList.indexOf(data.parentId) !== -1;
+      }
+    },
+    onCancel (isSuccess = false) {
+      if (this.observer != null) {
+        this.observer.cancel(isSuccess);
+      }
+    },
+    onSubmit () {
+      this.$refs.form.validate((valid) => {
+        if (valid) {
+          let selectMenu = [];
+          selectMenu = this.$refs.authTree.getHalfCheckedKeys();
+          selectMenu = selectMenu.concat(this.$refs.authTree.getCheckedKeys());
+
+          if (selectMenu.length <= 0) {
+            this.$message.error({message: '请选择角色的菜单权限', showClose: true});
+            return;
+          }
+          let params = {
+            sysRole: {...this.formData}
+          }
+          params.menuIdListString = selectMenu.join(',');
+          if (this.isEdit) {
+            SystemController.updateRole(this, params).then(res => {
+              this.$message.success('编辑成功');
+              this.onCancel(true);
+            }).catch(e => {});
+          } else {
+            SystemController.addRole(this, params).then(res => {
+              this.$message.success('添加成功');
+              this.onCancel(true);
+            }).catch(e => {});
+          }
+        }
+      });
+    },
+    loadAuthData () {
+      SystemController.getMenuPermList(this, {}).then(res => {
+        this.authData = treeDataTranslate(res.data, 'menuId', 'parentId');
+        if (Array.isArray(this.formData.menuIdList)) {
+          let tempList = [];
+          this.formData.menuIdList.forEach((item) => {
+            let tempMenu = findItemFromList(res.data, item, 'menuId');
+            if (tempMenu != null && tempMenu.menuType === this.SysMenuType.BUTTON) {
+              tempList.push(item);
+            }
+          });
+          this.$refs.authTree.setCheckedKeys(tempList);
+        }
+      }).catch(e => {});
+    }
+  },
+  computed: {
+    isEdit () {
+      return this.formData.roleId != null;
+    }
+  },
+  mounted () {
+    if (this.rowData) this.formData = {...this.formData, ...this.rowData};
+    this.loadAuthData();
+  },
+  watch: {
+    menuNameFilter (val) {
+      this.allowParentList = [];
+      this.$refs.authTree.filter(val);
+    }
+  }
+}
+</script>
+
+<style>
+</style>

orange-admin-web/src/views/upms/formEditSysUser/index.vue

@@ -0,0 +1,217 @@
+<template>
+  <el-form ref="form" :model="formData" :rules="rules" label-width="110px" size="mini" label-position="right" @submit.native.prevent>
+    <el-row :gutter="20" class="full-width-input">
+      <el-col :span="24">
+        <el-form-item label="登录名称" prop="loginName">
+          <el-input v-model="formData.loginName" placeholder="用户登录名称" clearable :disabled="isEdit" />
+        </el-form-item>
+        <el-form-item label="登录密码" v-if="!isEdit" prop="password">
+          <el-input v-model="formData.password" type="password" placeholder="用户登录密码" clearable />
+        </el-form-item>
+        <el-form-item label="再次输入密码" v-if="!isEdit" prop="passwordRepeat">
+          <el-input v-model="formData.passwordRepeat" type="password" placeholder="再次输入用户密码" clearable />
+        </el-form-item>
+        <el-form-item label="用户昵称" prop="showName">
+          <el-input v-model="formData.showName" placeholder="用户昵称" clearable />
+        </el-form-item>
+        <el-form-item label="账号类型" prop="userType">
+          <el-select v-model="formData.userType">
+            <el-option v-for="item in SysUserType.getList()" :key="item.id" :label="item.name" :value="item.id" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="用户状态" prop="userStatus" v-if="isEdit">
+          <el-radio-group v-model="formData.userStatus">
+            <el-radio :label="0">正常</el-radio>
+            <el-radio :label="1">锁定</el-radio>
+          </el-radio-group>
+        </el-form-item>
+        <el-form-item label="所属部门" prop="deptId">
+          <el-cascader class="input-item" v-model="deptId.value" :clearable="true"
+            placeholder="所属部门" :loading="deptId.impl.loading" :props="{value: 'deptId', label: 'deptName'}"
+            @visible-change="onDeptIdVisibleChange" :options="deptId.impl.dropdownList"
+            @change="onDeptIdValueChange">
+          </el-cascader>
+        </el-form-item>
+        <el-form-item label="用户角色" prop="roleIdList">
+          <el-select v-model="formData.roleIdList" multiple placeholder="用户角色">
+            <el-option v-for="role in roleList" :key="role.roleId"
+              :label="role.roleName" :value="role.roleId" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="数据权限" prop="dataPermIdList">
+          <el-select v-model="formData.dataPermIdList" multiple placeholder="数据权限">
+            <el-option v-for="dataPerm in dataPermList" :key="dataPerm.dataPermId"
+              :label="dataPerm.dataPermName" :value="dataPerm.dataPermId" />
+          </el-select>
+        </el-form-item>
+      </el-col>
+    </el-row>
+    <!-- 弹窗下发按钮栏，必须设置class为dialog-btn-layer -->
+    <el-row type="flex" justify="end" class="dialog-btn-layer">
+      <el-button size="mini" type="primary" @click="onCancel(false)" >取消</el-button>
+      <el-button type="primary" size="mini" @click="onSubmit"
+        :disabled="!(checkPermCodeExist('formSysUser:fragmentSysUser:update') || checkPermCodeExist('formSysUser:fragmentSysUser:add'))">
+        确定
+      </el-button>
+    </el-row>
+  </el-form>
+</template>
+
+<script>
+import { findTreeNodePath } from '@/utils';
+/* eslint-disable-next-line */
+import { DropdownWidget, TableWidget, UploadWidget, ChartWidget } from '@/utils/widget.js';
+import { SystemController, SysDeptController, SysDataPermController } from '@/api';
+import { uploadMixin } from '@/core/mixins';
+
+export default {
+  props: {
+    rowData: Object
+  },
+  mixins: [uploadMixin],
+  data () {
+    return {
+      formData: {
+        userId: undefined,
+        loginName: undefined,
+        password: undefined,
+        showName: undefined,
+        userType: 2,
+        userStatus: 0,
+        dataPermIdList: [],
+        roleIdList: []
+      },
+      params: {
+        userId: undefined,
+        loginName: undefined,
+        password: undefined,
+        showName: undefined,
+        deptId: '',
+        userType: 2,
+        userStatus: 0,
+        dataPermIdListString: undefined,
+        roleIdListString: undefined
+      },
+      deptId: {
+        impl: new DropdownWidget(this.loadDeptmentDropdownList, true, 'deptId'),
+        value: []
+      },
+      rules: {
+        loginName: [{required: true, message: '用户名称不能为空', trigger: 'blur'}],
+        password: [{required: true, message: '用户密码不能为空', trigger: 'blur'}],
+        passwordRepeat: [{required: true, message: '重输密码不能为空', trigger: 'blur'}],
+        showName: [{required: true, message: '用户昵称不能为空', trigger: 'blur'}],
+        dataPermIdList: [{required: true, message: '数据权限不能为空', trigger: 'change'}],
+        roleIdList: [{required: true, message: '用户角色不能为空', trigger: 'change'}]
+      },
+      showHeaderSelect: false,
+      dataPermList: [],
+      roleList: []
+    }
+  },
+  methods: {
+    /**
+     * 所属部门下拉数据获取函数
+     */
+    loadDeptmentDropdownList () {
+      return new Promise((resolve, reject) => {
+        let params = {};
+        SysDeptController.list(this, params).then(res => {
+          resolve(res.data.dataList);
+        }).catch(e => {
+          reject(e);
+        });
+      });
+    },
+    /**
+     * 所属部门下拉框显隐
+     */
+    onDeptIdVisibleChange (show) {
+      this.deptId.impl.onVisibleChange(show).catch(e => {});
+    },
+    /**
+     * 所属部门选中值改变
+     */
+    onDeptIdValueChange (value) {
+      this.formData.deptId = Array.isArray(value) ? value[value.length - 1] : undefined;
+    },
+    onCancel (isSuccess = false) {
+      if (this.observer != null) {
+        this.observer.cancel(isSuccess);
+      }
+    },
+    onSubmit () {
+      this.$refs.form.validate((valid) => {
+        if (valid) {
+          if (this.formData.userId == null && (this.formData.password !== this.formData.passwordRepeat)) {
+            this.$message.error({message: '两次密码输入不一致，请重新输入', showClose: true});
+            return;
+          }
+
+          let params = {
+            sysUser: {
+              userId: this.formData.userId,
+              loginName: this.formData.loginName,
+              password: this.formData.password,
+              showName: this.formData.showName,
+              userType: this.formData.userType,
+              deptId: this.formData.deptId,
+              userStatus: this.formData.userStatus
+            },
+            dataPermIdListString: Array.isArray(this.formData.dataPermIdList) ? this.formData.dataPermIdList.join(',') : undefined,
+            roleIdListString: Array.isArray(this.formData.roleIdList) ? this.formData.roleIdList.join(',') : undefined
+          }
+
+          let operation = null;
+          if (this.formData.userId != null) {
+            operation = SystemController.updateUser(this, params);
+          } else {
+            operation = SystemController.addUser(this, params);
+          }
+
+          operation.then(res => {
+            this.$message.success(this.formData.userId != null ? '编辑成功' : '添加成功');
+            this.onCancel(true);
+          }).catch(e => {
+            //
+          })
+        }
+      });
+    },
+    loadRole () {
+      SystemController.getRoleList(this, {}).then(res => {
+        this.roleList = res.data.dataList;
+      }).catch(e => {});
+    },
+    loadDataPerm () {
+      SysDataPermController.list(this, {}).then(res => {
+        this.dataPermList = res.data.dataList;
+      }).catch(e => {});
+    },
+    loadRowData (id) {
+      var params = {
+        userId: id
+      }
+      return SystemController.getUser(this, params);
+    }
+  },
+  computed: {
+    isEdit () {
+      return (this.formData.userId != null);
+    }
+  },
+  mounted () {
+    if (this.rowData != null) {
+      this.formData = {...this.rowData};
+    }
+    this.deptId.impl.onVisibleChange(true).then(res => {
+      this.deptId.value = findTreeNodePath(this.deptId.impl.dropdownList, this.formData.deptId, 'deptId');
+    });
+    this.loadRole();
+    this.loadDataPerm();
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+</style>

orange-admin-web/src/views/upms/formMenuPerm/index.vue

@@ -0,0 +1,150 @@
+<template>
+  <div>
+    <el-form label-width="75px" size="mini" label-position="right" @submit.native.prevent>
+      <filter-box :item-width="350">
+        <el-form-item label="关联URL">
+          <el-input class="filter-item" v-model="formMenuPerm.formFilter.url"
+            :clearable="true" placeholder="权限字名称" />
+        </el-form-item>
+        <el-button slot="operator" type="primary" size="mini" :plain="true" @click="refreshFormMenuPerm(true)">
+          查询
+        </el-button>
+      </filter-box>
+    </el-form>
+    <el-row>
+      <el-col :span="24">
+        <el-table :data="getPermList" size="mini" height="459px"
+          @sort-change="formMenuPerm.SysPerm.impl.onSortChange"
+          header-cell-class-name="table-header-gray">
+          <el-table-column label="序号" header-align="center" align="center" type="index" width="50px" :index="formMenuPerm.SysPerm.impl.getTableIndex" />
+          <el-table-column label="权限字名称" prop="showName" width="150px">
+          </el-table-column>
+          <el-table-column label="权限字类型" width="100px">
+            <template slot-scope="scope">
+              <el-tag size="mini" :type="getPermCodeType(scope.row.permCodeType)">
+                {{SysPermCodeType.getValue(scope.row.permCodeType)}}
+              </el-tag>
+            </template>
+          </el-table-column>
+          <el-table-column label="权限字标识" prop="permCode" width="300px" />
+          <el-table-column label="权限名称" prop="permName" width="150px" />
+          <el-table-column label="关联URL" prop="url" min-width="300px">
+          </el-table-column>
+        </el-table>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+/* eslint-disable-next-line */
+import { DropdownWidget, TableWidget, UploadWidget, ChartWidget } from '@/utils/widget.js';
+/* eslint-disable-next-line */
+import { uploadMixin, statsDateRangeMixin, cachePageMixin, cachedPageChildMixin } from '@/core/mixins';
+/* eslint-disable-next-line */
+import { SystemController, DictionaryController } from '@/api';
+
+export default {
+  name: 'formMenuPerm',
+  props: {
+    menuId: {
+      type: String,
+      required: true
+    }
+  },
+  mixins: [uploadMixin, statsDateRangeMixin, cachePageMixin],
+  data () {
+    return {
+      formMenuPerm: {
+        formFilter: {
+          menuId: this.menuId,
+          url: undefined
+        },
+        formFilterCopy: {
+          menuId: this.menuId,
+          url: undefined
+        },
+        SysPerm: {
+          impl: new TableWidget(this.loadSysPermData, this.loadSysPermVerify, false)
+        },
+        isInit: false
+      }
+    }
+  },
+  methods: {
+    getPermCodeType (permCodeType) {
+      switch (permCodeType) {
+        case this.SysPermCodeType.FORM: return 'primary';
+        case this.SysPermCodeType.FRAGMENT: return 'warning';
+        case this.SysPermCodeType.OPERATION: return 'success';
+        default: return 'info';
+      }
+    },
+    /**
+     * 权限数据获取函数，返回Primise
+     */
+    loadSysPermData (params) {
+      params = {
+        ...params,
+        menuId: this.formMenuPerm.formFilterCopy.menuId
+      }
+      return new Promise((resolve, reject) => {
+        SystemController.listMenuPerm(this, params).then(res => {
+          resolve({
+            dataList: res.data
+          });
+        }).catch(e => {
+          reject(e);
+        });
+      });
+    },
+    /**
+     * 权限数据获取检测函数，返回true正常获取数据，返回false停止获取数据
+     */
+    loadSysPermVerify () {
+      this.formMenuPerm.formFilterCopy.url = this.formMenuPerm.formFilter.url;
+      this.formMenuPerm.formFilterCopy.menuId = this.formMenuPerm.formFilter.menuId;
+      if (this.formMenuPerm.formFilterCopy.menuId == null || this.formMenuPerm.formFilterCopy.menuId === '') {
+        this.$message.error('所属菜单不能为空！');
+        return false;
+      }
+      return true;
+    },
+    /**
+     * 更新权限管理
+     */
+    refreshFormMenuPerm (reloadData = false) {
+      // 重新获取数据组件的数据
+      if (reloadData) {
+        this.formMenuPerm.SysPerm.impl.refreshTable(true, 1);
+      } else {
+        this.formMenuPerm.SysPerm.impl.refreshTable();
+      }
+      this.formMenuPerm.isInit = true;
+    },
+    onResume () {
+      this.refreshFormMenuPerm();
+    },
+    initFormData () {
+    },
+    formInit () {
+      this.initFormData();
+      this.refreshFormMenuPerm();
+    }
+  },
+  computed: {
+    getPermList () {
+      return this.formMenuPerm.SysPerm.impl.dataList.filter((item) => {
+        return (this.formMenuPerm.formFilterCopy.url == null || this.formMenuPerm.formFilterCopy.url === '') ||
+          (item.url.indexOf(this.formMenuPerm.formFilterCopy.url) !== -1);
+      });
+    }
+  },
+  created () {
+    this.formInit();
+  }
+}
+</script>
+
+<style>
+</style>

orange-admin-web/src/views/upms/formPermQuery/index.vue

@@ -0,0 +1,416 @@
+<template>
+  <div>
+    <el-tabs tab-position="left" v-model="activeFragmentId" :before-leave="onFragmentChange">
+      <el-tab-pane label="角色查询" name="roleQuery" style="height: 300px;">
+        <el-form label-width="75px" size="mini" label-position="right" @submit.native.prevent>
+          <filter-box :item-width="350">
+            <el-form-item label="权限字">
+              <el-cascader class="filter-item" :options="roleQuery.SysPermCode.impl.dropdownList"
+                v-model="roleQuery.SysPermCode.value" size="mini"
+                :props="roleQuery.permCodeProps" placeholder="请选择权限字" clearable
+                @visible-change="roleQuery.SysPermCode.impl.onVisibleChange"
+                @change="onRoleQueryPermCodeChange" />
+            </el-form-item>
+            <el-form-item label="URL">
+              <el-input class="filter-item" v-model="roleQuery.formFilter.permUrl"
+                :clearable="true" placeholder="请输入URL" />
+            </el-form-item>
+            <el-button slot="operator" type="primary" :plain="true" size="mini" @click="refreshSysRoleQuery(true)">查询</el-button>
+          </filter-box>
+        </el-form>
+        <el-row>
+          <el-col :span="24">
+            <el-table :data="roleQuery.SysRole.impl.dataList" size="mini" @sort-change="roleQuery.SysRole.impl.onSortChange"
+              header-cell-class-name="table-header-gray" :height="getTableHeight">
+              <el-table-column label="序号" header-align="center" align="center" type="index" width="50px" :index="roleQuery.SysRole.impl.getTableIndex" />
+              <el-table-column label="角色名称" prop="roleName">
+              </el-table-column>
+              <el-table-column label="创建人" prop="createUsername">
+              </el-table-column>
+              <el-table-column label="创建时间">
+                <template slot-scope="scope">
+                  <span>{{formatDateByStatsType(scope.row.createTime, 'day')}}</span>
+                </template>
+              </el-table-column>
+              <el-table-column label="操作" fixed="right" width="150px">
+                <template slot-scope="scope">
+                  <el-button @click="onShowSysRoleUser(scope.row)" type="text" size="mini">
+                    查看角色用户
+                  </el-button>
+                </template>
+              </el-table-column>
+            </el-table>
+            <el-col :span="24">
+              <el-row type="flex" justify="end" style="margin-top: 10px;">
+                <el-pagination
+                  :total="roleQuery.SysRole.impl.totalCount"
+                  :current-page="roleQuery.SysRole.impl.currentPage"
+                  :page-size="roleQuery.SysRole.impl.pageSize"
+                  :page-sizes="[10, 20, 50, 100]"
+                  layout="total, prev, pager, next, sizes"
+                  @current-change="roleQuery.SysRole.impl.onCurrentPageChange"
+                  @size-change="roleQuery.SysRole.impl.onPageSizeChange">
+                </el-pagination>
+              </el-row>
+            </el-col>
+          </el-col>
+        </el-row>
+      </el-tab-pane>
+      <el-tab-pane label="用户权限字查询" name="permCodeQuery">
+        <el-form label-width="75px" size="mini" label-position="right" @submit.native.prevent>
+          <filter-box :item-width="350">
+            <el-form-item label="用户名称">
+              <el-input class="filter-item" v-model="permCodeQuery.formFilter.loginName"
+                :clearable="true" placeholder="请输入用户名" />
+            </el-form-item>
+            <el-button slot="operator" type="primary" :plain="true" size="mini" @click="refreshSysPermCodeQuery(true)">查询</el-button>
+          </filter-box>
+        </el-form>
+        <el-row>
+          <el-col :span="24">
+            <el-table :data="permCodeQuery.SysPermCode.impl.dataList" size="mini" @sort-change="permCodeQuery.SysPermCode.impl.onSortChange"
+              header-cell-class-name="table-header-gray" :height="getTableHeight">
+              <el-table-column label="序号" header-align="center" align="center" type="index" width="50px" :index="permCodeQuery.SysPermCode.impl.getTableIndex" />
+              <el-table-column label="权限字名称" prop="showName">
+              </el-table-column>
+              <el-table-column label="权限字类型" prop="permCodeType">
+                <template slot-scope="scope">
+                  <el-tag size="mini" :type="getPermCodeType(scope.row.permCodeType)">{{SysPermCodeType.getValue(scope.row.permCodeType)}}</el-tag>
+                </template>
+              </el-table-column>
+              <el-table-column label="显示顺序" prop="showOrder">
+              </el-table-column>
+              <el-table-column label="权限字标识" prop="permCode">
+              </el-table-column>
+            </el-table>
+            <el-col :span="24">
+              <el-row type="flex" justify="end" style="margin-top: 10px;">
+                <el-pagination
+                  :total="permCodeQuery.SysPermCode.impl.totalCount"
+                  :current-page="permCodeQuery.SysPermCode.impl.currentPage"
+                  :page-size="permCodeQuery.SysPermCode.impl.pageSize"
+                  :page-sizes="[10, 20, 50, 100]"
+                  layout="total, prev, pager, next, sizes"
+                  @current-change="permCodeQuery.SysPermCode.impl.onCurrentPageChange"
+                  @size-change="permCodeQuery.SysPermCode.impl.onPageSizeChange">
+                </el-pagination>
+              </el-row>
+            </el-col>
+          </el-col>
+        </el-row>
+      </el-tab-pane>
+      <el-tab-pane label="用户权限查询" name="permQuery">
+        <el-form label-width="100px" size="mini" label-position="right" @submit.native.prevent>
+          <filter-box :item-width="350">
+            <el-form-item label="所属权限模块">
+              <el-cascader class="filter-item" :options="permQuery.PermModule.impl.dropdownList" placeholder="所属权限模块"
+                v-model="permQuery.PermModule.value" size="mini" clearable
+                :props="{label: 'moduleName', value: 'moduleId'}"
+                @visible-change="permQuery.PermModule.impl.onVisibleChange"
+                @change="onPermQueryPermModuleChange" />
+            </el-form-item>
+            <el-form-item label="用户名称">
+              <el-input class="filter-item" v-model="permQuery.formFilter.loginName"
+                :clearable="true" placeholder="请输入用户名" />
+            </el-form-item>
+            <el-form-item label="URL">
+              <el-input class="filter-item" v-model="permQuery.formFilter.url"
+                :clearable="true" placeholder="请输入URL" />
+            </el-form-item>
+            <el-button slot="operator" type="primary" :plain="true" size="mini" @click="refreshSysPermQuery(true)">查询</el-button>
+          </filter-box>
+        </el-form>
+        <el-row>
+          <el-col :span="24">
+            <el-table :data="permQuery.SysPerm.impl.dataList" size="mini" @sort-change="permQuery.SysPerm.impl.onSortChange"
+              header-cell-class-name="table-header-gray" :height="getTableHeight">
+              <el-table-column label="序号" header-align="center" align="center" type="index" width="50px" :index="permQuery.SysPerm.impl.getTableIndex" />
+              <el-table-column label="权限名称" prop="permName" width="150px">
+              </el-table-column>
+              <el-table-column label="所属权限模块" prop="moduleName" width="150px">
+              </el-table-column>
+              <el-table-column label="关联的url" prop="url">
+              </el-table-column>
+              <el-table-column label="创建时间" width="200px">
+                <template slot-scope="scope">
+                  <span>{{formatDateByStatsType(scope.row.createTime, 'day')}}</span>
+                </template>
+              </el-table-column>
+            </el-table>
+            <el-col :span="24">
+              <el-row type="flex" justify="end" style="margin-top: 10px;">
+                <el-pagination
+                  :total="permQuery.SysPerm.impl.totalCount"
+                  :current-page="permQuery.SysPerm.impl.currentPage"
+                  :page-size="permQuery.SysPerm.impl.pageSize"
+                  :page-sizes="[10, 20, 50, 100]"
+                  layout="total, prev, pager, next, sizes"
+                  @current-change="permQuery.SysPerm.impl.onCurrentPageChange"
+                  @size-change="permQuery.SysPerm.impl.onPageSizeChange">
+                </el-pagination>
+              </el-row>
+            </el-col>
+          </el-col>
+        </el-row>
+      </el-tab-pane>
+    </el-tabs>
+  </div>
+</template>
+
+<script>
+import { mapGetters } from 'vuex';
+/* eslint-disable-next-line */
+import { DropdownWidget, TableWidget, UploadWidget, ChartWidget } from '@/utils/widget.js';
+/* eslint-disable-next-line */
+import { uploadMixin, statsDateRangeMixin, cachePageMixin, cachedPageChildMixin } from '@/core/mixins';
+/* eslint-disable-next-line */
+import { SystemController, DictionaryController } from '@/api';
+
+export default {
+  name: 'formPermQuery',
+  mixins: [uploadMixin, statsDateRangeMixin, cachePageMixin],
+  data () {
+    return {
+      activeFragmentId: 'roleQuery',
+      roleQuery: {
+        formFilter: {
+          permCodeId: undefined,
+          permUrl: undefined
+        },
+        formFilterCopy: {
+          permCodeId: undefined,
+          permUrl: undefined
+        },
+        permCodeProps: {
+          value: 'permCodeId',
+          label: 'showName',
+          checkStrictly: true
+        },
+        SysPermCode: {
+          impl: new DropdownWidget(this.loadPermCodeDropdownList, true, 'permCodeId'),
+          value: []
+        },
+        SysRole: {
+          impl: new TableWidget(this.loadSysRoleData, this.loadSysRoleVerify, true, 'createTime', 1)
+        },
+        isInit: false
+      },
+      permCodeQuery: {
+        formFilter: {
+          loginName: undefined
+        },
+        formFilterCopy: {
+          loginName: undefined
+        },
+        SysPermCode: {
+          impl: new TableWidget(this.loadSysPermCodeData, this.loadSysPermCodeVerify, false)
+        },
+        isInit: false
+      },
+      permQuery: {
+        formFilter: {
+          loginName: undefined,
+          permModuleId: undefined,
+          url: undefined
+        },
+        formFilterCopy: {
+          loginName: undefined,
+          permModuleId: undefined,
+          url: undefined
+        },
+        PermModule: {
+          impl: new DropdownWidget(this.loadPermModuleIdDropdownList, true, 'moduleId', 'parentId'),
+          value: []
+        },
+        SysPerm: {
+          impl: new TableWidget(this.loadSysPermData, this.loadSysPermVerify, false)
+        },
+        isInit: false
+      }
+    }
+  },
+  methods: {
+    onRoleQueryPermCodeChange (value) {
+      this.roleQuery.formFilter.permCodeId = Array.isArray(value) ? value[value.length - 1] : undefined;
+    },
+    /**
+     * 获取权限字下拉数据
+     */
+    loadPermCodeDropdownList () {
+      return new Promise((resolve, reject) => {
+        let params = {};
+        SystemController.getPermCodeList(this, params).then(res => {
+          resolve(res.data.dataList);
+        }).catch(e => {
+          reject(e);
+        });
+      });
+    },
+    /**
+     * 获取角色查询数据
+     */
+    loadSysRoleData (params) {
+      // params.permCodeId = this.roleQuery.formFilterCopy.permCodeId;
+      /*
+      params.sysPermFilter = {
+        url: this.roleQuery.formFilterCopy.permUrl
+      }
+      */
+      params.url = this.roleQuery.formFilterCopy.permUrl;
+      return new Promise((resolve, reject) => {
+        SystemController.queryRoleByURL(this, params).then(res => {
+          resolve({
+            dataList: res.data.dataList,
+            totalCount: res.data.totalCount
+          });
+        }).catch(e => {
+          reject(e);
+        });
+      });
+    },
+    /**
+     * 角色查询验证
+     */
+    loadSysRoleVerify () {
+      this.roleQuery.formFilterCopy.permCodeId = this.roleQuery.formFilter.permCodeId;
+      this.roleQuery.formFilterCopy.permUrl = this.roleQuery.formFilter.permUrl;
+      return true;
+    },
+    /**
+     * 跳转到角色用户页面
+     */
+    onShowSysRoleUser (row) {
+
+    },
+    /**
+     * 刷新角色查询数据
+     */
+    refreshSysRoleQuery (reloadData = false) {
+      if (reloadData) {
+        this.roleQuery.SysRole.impl.refreshTable(true, 1);
+      } else {
+        this.roleQuery.SysRole.impl.refreshTable();
+      }
+      this.roleQuery.isInit = true;
+    },
+    getPermCodeType (permCodeType) {
+      switch (permCodeType) {
+        case this.SysPermCodeType.FORM: return 'primary';
+        case this.SysPermCodeType.FRAGMENT: return 'warning';
+        case this.SysPermCodeType.OPERATION: return 'success';
+        default: return 'info';
+      }
+    },
+    /**
+     * 权限字数据查询
+     */
+    loadSysPermCodeData (params) {
+      params.sysUserFilter = {
+        loginName: this.permCodeQuery.formFilterCopy.loginName
+      }
+
+      return new Promise((resolve, reject) => {
+        SystemController.queryPermCode(this, params).then(res => {
+          resolve({
+            dataList: res.data.dataList,
+            totalCount: res.data.totalCount
+          });
+        }).catch(e => {
+          reject(e);
+        });
+      });
+    },
+    /**
+     * 权限字数据查询校验
+     */
+    loadSysPermCodeVerify () {
+      this.permCodeQuery.formFilterCopy.loginName = this.permCodeQuery.formFilter.loginName;
+      return true;
+    },
+    /**
+     * 刷新权限字查询数据
+     */
+    refreshSysPermCodeQuery (reloadData = false) {
+      if (reloadData) {
+        this.permCodeQuery.SysPermCode.impl.refreshTable(true, 1);
+      } else {
+        this.permCodeQuery.SysPermCode.impl.refreshTable();
+      }
+      this.permCodeQuery.isInit = true;
+    },
+    /**
+     * 所属权限模块下拉数据获取函数
+     */
+    loadPermModuleIdDropdownList () {
+      return new Promise((resolve, reject) => {
+        let params = {};
+        SystemController.getPermGroupList(this, params).then(res => {
+          resolve(res.data);
+        }).catch(e => {
+          reject();
+        });
+      });
+    },
+    onPermQueryPermModuleChange (value) {
+      this.permQuery.formFilter.permModuleId = Array.isArray(value) ? value[value.length - 1] : undefined;
+    },
+    /**
+     * 获取权限数据
+     */
+    loadSysPermData (params) {
+      params = {
+        ...params,
+        moduleId: this.permQuery.formFilterCopy.permModuleId,
+        loginName: this.permQuery.formFilterCopy.loginName,
+        url: this.permQuery.formFilterCopy.url
+      }
+
+      return new Promise((resolve, reject) => {
+        SystemController.queryPerm(this, params).then(res => {
+          resolve({
+            dataList: res.data.dataList,
+            totalCount: res.data.totalCount
+          });
+        }).catch(e => {
+          reject(e);
+        });
+      });
+    },
+    /**
+     * 获取权限数据校验
+     */
+    loadSysPermVerify () {
+      this.permQuery.formFilterCopy.permModuleId = this.permQuery.formFilter.permModuleId;
+      this.permQuery.formFilterCopy.loginName = this.permQuery.formFilter.loginName;
+      this.permQuery.formFilterCopy.url = this.permQuery.formFilter.url;
+      return true;
+    },
+    /**
+     * 刷新权限数据
+     */
+    refreshSysPermQuery (reloadData = false) {
+      if (reloadData) {
+        this.permQuery.SysPerm.impl.refreshTable(true, 1);
+      } else {
+        this.permQuery.SysPerm.impl.refreshTable();
+      }
+      this.permQuery.isInit = true;
+    },
+    /**
+     * Tab切换调用
+     */
+    onFragmentChange (fragmentId) {
+      return true;
+    }
+  },
+  computed: {
+    getTableHeight () {
+      return (this.getClientHeight - 220) + 'px';
+    },
+    ...mapGetters(['getClientHeight'])
+  }
+}
+</script>
+
+<style>
+</style>

orange-admin-web/src/views/upms/formSetRoleUsers/index.vue

@@ -0,0 +1,216 @@
+<template>
+  <div>
+    <el-form label-width="75px" size="mini" label-position="right" @submit.native.prevent>
+      <filter-box :item-width="325">
+        <el-form-item label="用户状态">
+          <el-select class="filter-item" v-model="formSysUser.formFilter.sysUserStatus" :clearable="true"
+            placeholder="用户状态" :loading="formSysUser.sysUserStatus.impl.loading"
+            @visible-change="onSysUserStatusVisibleChange">
+            <el-option v-for="item in formSysUser.sysUserStatus.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="用户名">
+          <el-input class="filter-item" v-model="formSysUser.formFilter.sysUserLoginName"
+            :clearable="true" placeholder="用户名" />
+        </el-form-item>
+        <el-button slot="operator" type="primary" :plain="true" size="mini" @click="refreshFormSysUser(true)">查询</el-button>
+        <el-button slot="operator" size="mini" type="primary" :plain="false" @click="onSetUser"
+          :disabled="selectUsers == null || selectUsers.length <= 0">授权人员</el-button>
+      </filter-box>
+    </el-form>
+    <el-row>
+      <el-col :span="24">
+        <el-table :data="formSysUser.SysUser.impl.dataList" size="mini" row-key="userId" ref="userTable"
+          header-cell-class-name="table-header-gray" height="395px" @selection-change="onTableSelectionChange">
+          <el-table-column label="序号" header-align="center" align="center" type="index" width="50px" :index="formSysUser.SysUser.impl.getTableIndex" />
+          <el-table-column header-align="center" align="center" type="selection" width="50px" :reserve-selection="true" />
+          <el-table-column label="用户名" prop="loginName">
+          </el-table-column>
+          <el-table-column label="昵称" prop="showName">
+          </el-table-column>
+          <el-table-column label="账号类型">
+            <template slot-scope="scope">
+              <span>{{SysUserType.getValue(scope.row.userType)}}</span>
+            </template>
+          </el-table-column>
+          <el-table-column label="状态">
+            <template slot-scope="scope">
+              <el-tag :type="getUserStatusType(scope.row.userStatus)" size="mini">{{SysUserStatus.getValue(scope.row.userStatus)}}</el-tag>
+            </template>
+          </el-table-column>
+          <el-table-column label="创建时间">
+            <template slot-scope="scope">
+              <span>{{formatDateByStatsType(scope.row.createTime, 'day')}}</span>
+            </template>
+          </el-table-column>
+        </el-table>
+        <el-col :span="24">
+          <el-row type="flex" justify="end" style="margin-top: 10px;">
+            <el-pagination
+              :total="formSysUser.SysUser.impl.totalCount"
+              :current-page="formSysUser.SysUser.impl.currentPage"
+              :page-size="formSysUser.SysUser.impl.pageSize"
+              :page-sizes="[10, 20, 50, 100]"
+              layout="total, prev, pager, next, sizes"
+              @current-change="formSysUser.SysUser.impl.onCurrentPageChange"
+              @size-change="formSysUser.SysUser.impl.onPageSizeChange">
+            </el-pagination>
+          </el-row>
+        </el-col>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { mapGetters } from 'vuex';
+/* eslint-disable-next-line */
+import { DropdownWidget, TableWidget, UploadWidget, ChartWidget } from '@/utils/widget.js';
+/* eslint-disable-next-line */
+import { uploadMixin, statsDateRangeMixin, cachePageMixin, cachedPageChildMixin } from '@/core/mixins';
+/* eslint-disable-next-line */
+import { SystemController, DictionaryController } from '@/api';
+
+export default {
+  props: {
+    roleId: {
+      type: [String, Number],
+      required: true
+    }
+  },
+  mixins: [uploadMixin, statsDateRangeMixin, cachePageMixin],
+  data () {
+    return {
+      formSysUser: {
+        formFilter: {
+          sysUserStatus: undefined,
+          sysUserLoginName: undefined
+        },
+        formFilterCopy: {
+          sysUserStatus: undefined,
+          sysUserLoginName: undefined
+        },
+        sysUserStatus: {
+          impl: new DropdownWidget(this.loadSysUserStatusDropdownList)
+        },
+        SysUser: {
+          impl: new TableWidget(this.loadSysUserData, this.loadSysUserVerify, true, 'createTime', 1)
+        },
+        isInit: false
+      },
+      selectUsers: []
+    }
+  },
+  methods: {
+    /**
+     * 用户状态下拉数据获取函数
+     */
+    loadSysUserStatusDropdownList () {
+      return new Promise((resolve, reject) => {
+        let params = {};
+        DictionaryController.dictSysUserStatus(this, params).then(res => {
+          resolve(res.getList());
+        }).catch(e => {
+          reject(e);
+        });
+      });
+    },
+    /**
+     * 用户状态下拉框显隐
+     */
+    onSysUserStatusVisibleChange (show) {
+      this.formSysUser.sysUserStatus.impl.onVisibleChange(show).catch(e => {});
+    },
+    getUserStatusType (status) {
+      if (status === this.SysUserStatus.NORMAL) {
+        return 'success';
+      } else if (status === this.SysUserStatus.LOCKED) {
+        return 'danger';
+      } else {
+        return 'info';
+      }
+    },
+    onTableSelectionChange (values) {
+      this.selectUsers = values;
+    },
+    onSetUser () {
+      let params = {
+        roleId: this.roleId,
+        userIdListString: this.selectUsers.map((item) => {
+          return item.userId
+        }).join(',')
+      }
+
+      SystemController.addRoleUser(this, params).then(res => {
+        this.$message.success('授权成功');
+        this.refreshFormSysUser(true);
+        this.$refs.userTable.clearSelection();
+        this.selectUsers = [];
+      }).catch(e => {});
+    },
+    onCancel () {
+      this.$router.go(-1);
+    },
+    loadSysUserData (params) {
+      params.roleId = this.roleId;
+      params.sysUserFilter = {
+        loginName: this.formSysUser.formFilterCopy.sysUserLoginName,
+        userStatus: this.formSysUser.formFilterCopy.sysUserStatus
+      }
+      this.$refs.userTable.clearSelection();
+      return new Promise((resolve, reject) => {
+        SystemController.listNotInUserRole(this, params).then(res => {
+          resolve({
+            dataList: res.data.dataList,
+            totalCount: res.data.totalCount
+          });
+        }).catch(e => {
+          reject(e);
+        });
+      });
+    },
+    /**
+     * 获取检测函数，返回true正常获取数据，返回false停止获取数据
+     */
+    loadSysUserVerify () {
+      this.formSysUser.formFilterCopy.sysUserLoginName = this.formSysUser.formFilter.sysUserLoginName;
+      this.formSysUser.formFilterCopy.sysUserStatus = this.formSysUser.formFilter.sysUserStatus;
+      return true;
+    },
+    refreshFormSysUser (reloadData = false) {
+      // 重新获取数据组件的数据
+      if (reloadData) {
+        this.formSysUser.SysUser.impl.refreshTable(true, 1);
+      } else {
+        this.formSysUser.SysUser.impl.refreshTable();
+      }
+      this.formSysUser.sysUserStatus.impl.onVisibleChange(true).catch(e => {});
+      this.formSysUser.isInit = true;
+    },
+    initData () {
+      this.refreshFormSysUser();
+    }
+  },
+  mounted () {
+    this.initData();
+  },
+  computed: {
+    getContextHeightStyle () {
+      return [
+        {'height': (this.getClientHeight - 142) + 'px'}
+      ]
+    },
+    ...mapGetters(['getClientHeight'])
+  },
+  watch: {
+    currentPage: function (value, oldValue) {
+      this.loadDatasource(false).catch(e => {
+        this.currentPage = oldValue;
+      })
+    }
+  }
+}
+</script>
+
+<style>
+</style>

orange-admin-web/src/views/upms/formSetSysDataPermUser/index.vue

@@ -0,0 +1,216 @@
+<template>
+  <div>
+    <el-form label-width="75px" size="mini" label-position="right" @submit.native.prevent>
+      <filter-box :item-width="325">
+        <el-form-item label="用户状态">
+          <el-select class="filter-item" v-model="formSysUser.formFilter.sysUserStatus" :clearable="true"
+            placeholder="用户状态" :loading="formSysUser.sysUserStatus.impl.loading"
+            @visible-change="onSysUserStatusVisibleChange">
+            <el-option v-for="item in formSysUser.sysUserStatus.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="用户名">
+          <el-input class="filter-item" v-model="formSysUser.formFilter.sysUserLoginName"
+            :clearable="true" placeholder="用户名" />
+        </el-form-item>
+        <el-button slot="operator" type="primary" :plain="true" size="mini" @click="refreshFormSysUser(true)">查询</el-button>
+        <el-button slot="operator" size="mini" type="primary" :plain="false" @click="onSetUser"
+          :disabled="selectUsers == null || selectUsers.length <= 0">授权人员</el-button>
+      </filter-box>
+    </el-form>
+    <el-row>
+      <el-col :span="24">
+        <el-table :data="formSysUser.SysUser.impl.dataList" size="mini" row-key="userId" ref="userTable"
+          header-cell-class-name="table-header-gray" height="395px" @selection-change="onTableSelectionChange">
+          <el-table-column label="序号" header-align="center" align="center" type="index" width="50px" :index="formSysUser.SysUser.impl.getTableIndex" />
+          <el-table-column header-align="center" align="center" type="selection" width="50px" :reserve-selection="true" />
+          <el-table-column label="用户名" prop="loginName">
+          </el-table-column>
+          <el-table-column label="昵称" prop="showName">
+          </el-table-column>
+          <el-table-column label="账号类型">
+            <template slot-scope="scope">
+              <span>{{SysUserType.getValue(scope.row.userType)}}</span>
+            </template>
+          </el-table-column>
+          <el-table-column label="状态">
+            <template slot-scope="scope">
+              <el-tag :type="getUserStatusType(scope.row.userStatus)" size="mini">{{SysUserStatus.getValue(scope.row.userStatus)}}</el-tag>
+            </template>
+          </el-table-column>
+          <el-table-column label="创建时间">
+            <template slot-scope="scope">
+              <span>{{formatDateByStatsType(scope.row.createTime, 'day')}}</span>
+            </template>
+          </el-table-column>
+        </el-table>
+        <el-col :span="24">
+          <el-row type="flex" justify="end" style="margin-top: 10px;">
+            <el-pagination
+              :total="formSysUser.SysUser.impl.totalCount"
+              :current-page="formSysUser.SysUser.impl.currentPage"
+              :page-size="formSysUser.SysUser.impl.pageSize"
+              :page-sizes="[10, 20, 50, 100]"
+              layout="total, prev, pager, next, sizes"
+              @current-change="formSysUser.SysUser.impl.onCurrentPageChange"
+              @size-change="formSysUser.SysUser.impl.onPageSizeChange">
+            </el-pagination>
+          </el-row>
+        </el-col>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { mapGetters } from 'vuex';
+/* eslint-disable-next-line */
+import { DropdownWidget, TableWidget, UploadWidget, ChartWidget } from '@/utils/widget.js';
+/* eslint-disable-next-line */
+import { uploadMixin, statsDateRangeMixin, cachePageMixin, cachedPageChildMixin } from '@/core/mixins';
+/* eslint-disable-next-line */
+import { SysDataPermController, DictionaryController } from '@/api';
+
+export default {
+  props: {
+    dataPermId: {
+      type: [String, Number],
+      required: true
+    }
+  },
+  mixins: [uploadMixin, statsDateRangeMixin, cachePageMixin],
+  data () {
+    return {
+      formSysUser: {
+        formFilter: {
+          sysUserStatus: undefined,
+          sysUserLoginName: undefined
+        },
+        formFilterCopy: {
+          sysUserStatus: undefined,
+          sysUserLoginName: undefined
+        },
+        sysUserStatus: {
+          impl: new DropdownWidget(this.loadSysUserStatusDropdownList)
+        },
+        SysUser: {
+          impl: new TableWidget(this.loadSysUserData, this.loadSysUserVerify, true, 'createTime', 1)
+        },
+        isInit: false
+      },
+      selectUsers: []
+    }
+  },
+  methods: {
+    /**
+     * 用户状态下拉数据获取函数
+     */
+    loadSysUserStatusDropdownList () {
+      return new Promise((resolve, reject) => {
+        let params = {};
+        DictionaryController.dictSysUserStatus(this, params).then(res => {
+          resolve(res.getList());
+        }).catch(e => {
+          reject(e);
+        });
+      });
+    },
+    /**
+     * 用户状态下拉框显隐
+     */
+    onSysUserStatusVisibleChange (show) {
+      this.formSysUser.sysUserStatus.impl.onVisibleChange(show).catch(e => {});
+    },
+    getUserStatusType (status) {
+      if (status === this.SysUserStatus.NORMAL) {
+        return 'success';
+      } else if (status === this.SysUserStatus.LOCKED) {
+        return 'danger';
+      } else {
+        return 'info';
+      }
+    },
+    onTableSelectionChange (values) {
+      this.selectUsers = values;
+    },
+    onSetUser () {
+      let params = {
+        dataPermId: this.dataPermId,
+        userIdListString: this.selectUsers.map((item) => {
+          return item.userId
+        }).join(',')
+      }
+
+      SysDataPermController.addDataPermUser(this, params).then(res => {
+        this.$message.success('授权成功');
+        this.refreshFormSysUser(true);
+        this.$refs.userTable.clearSelection();
+        this.selectUsers = [];
+      }).catch(e => {});
+    },
+    onCancel () {
+      this.$router.go(-1);
+    },
+    loadSysUserData (params) {
+      params.dataPermId = this.dataPermId;
+      params.sysUserFilter = {
+        loginName: this.formSysUser.formFilterCopy.sysUserLoginName,
+        userStatus: this.formSysUser.formFilterCopy.sysUserStatus
+      }
+      this.$refs.userTable.clearSelection();
+      return new Promise((resolve, reject) => {
+        SysDataPermController.listNotInDataPermUser(this, params).then(res => {
+          resolve({
+            dataList: res.data.dataList,
+            totalCount: res.data.totalCount
+          });
+        }).catch(e => {
+          reject(e);
+        });
+      });
+    },
+    /**
+     * 获取检测函数，返回true正常获取数据，返回false停止获取数据
+     */
+    loadSysUserVerify () {
+      this.formSysUser.formFilterCopy.sysUserLoginName = this.formSysUser.formFilter.sysUserLoginName;
+      this.formSysUser.formFilterCopy.sysUserStatus = this.formSysUser.formFilter.sysUserStatus;
+      return true;
+    },
+    refreshFormSysUser (reloadData = false) {
+      // 重新获取数据组件的数据
+      if (reloadData) {
+        this.formSysUser.SysUser.impl.refreshTable(true, 1);
+      } else {
+        this.formSysUser.SysUser.impl.refreshTable();
+      }
+      this.formSysUser.sysUserStatus.impl.onVisibleChange(true).catch(e => {});
+      this.formSysUser.isInit = true;
+    },
+    initData () {
+      this.refreshFormSysUser();
+    }
+  },
+  mounted () {
+    this.initData();
+  },
+  computed: {
+    getContextHeightStyle () {
+      return [
+        {'height': (this.getClientHeight - 142) + 'px'}
+      ]
+    },
+    ...mapGetters(['getClientHeight'])
+  },
+  watch: {
+    currentPage: function (value, oldValue) {
+      this.loadDatasource(false).catch(e => {
+        this.currentPage = oldValue;
+      })
+    }
+  }
+}
+</script>
+
+<style>
+</style>

orange-admin-web/src/views/upms/formSysDataPerm/index.vue

@@ -0,0 +1,483 @@
+<template>
+  <div class="tab-dialog-box" style="position: relative;">
+    <el-tabs v-model="activeFragmentId" :before-leave="onFragmentChange">
+      <el-tab-pane label="数据权限管理" name="fragmentSysDataPerm" style="width: 100%;"
+        v-if="checkPermCodeExist('formSysDataPerm:fragmentSysDataPerm')">
+        <el-scrollbar class="custom-scroll" :style="{height: getTabPaneHeight + 'px'}">
+          <el-form label-width="100px" size="mini" label-position="right" @submit.native.prevent>
+            <filter-box :item-width="350">
+              <el-form-item label="过滤规则">
+                <el-select class="filter-item" v-model="fragmentSysDataPerm.formFilter.sysDatapermType" :clearable="true"
+                  placeholder="过滤规则" :loading="fragmentSysDataPerm.sysDatapermType.impl.loading"
+                  @visible-change="onSysDatapermTypeVisibleChange"
+                  @change="onSysDatapermTypeValueChange">
+                  <el-option v-for="item in fragmentSysDataPerm.sysDatapermType.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
+                </el-select>
+              </el-form-item>
+              <el-form-item label="数据权限名称">
+                <el-input class="filter-item" v-model="fragmentSysDataPerm.formFilter.sysDataPermName"
+                  :clearable="true" placeholder="数据权限名称" />
+              </el-form-item>
+              <el-button slot="operator" type="primary" :plain="true" size="mini" @click="refreshFragmentSysDataPerm(true)">查询</el-button>
+              <el-button slot="operator" type="primary" size="mini" :disabled="!checkPermCodeExist('formSysDataPerm:fragmentSysDataPerm:add')"
+                @click="onAddDataPermClick()">
+                新建
+              </el-button>
+            </filter-box>
+          </el-form>
+          <el-row>
+            <el-col :span="24">
+              <el-table :data="fragmentSysDataPerm.SysDataPerm.impl.dataList" size="mini"
+                @sort-change="fragmentSysDataPerm.SysDataPerm.impl.onSortChange"
+                header-cell-class-name="table-header-gray">
+                <el-table-column label="序号" header-align="center" align="center" type="index" width="55px"
+                  :index="fragmentSysDataPerm.SysDataPerm.impl.getTableIndex" />
+                <el-table-column label="权限名称" prop="dataPermName">
+                </el-table-column>
+                <el-table-column label="过滤规则">
+                  <template slot-scope="scope">
+                    <span>{{SysDataPermType.getValue(scope.row.ruleType)}}</span>
+                  </template>
+                </el-table-column>
+                <el-table-column label="创建人" prop="createUsername">
+                </el-table-column>
+                <el-table-column label="创建时间">
+                  <template slot-scope="scope">
+                    <span>{{formatDateByStatsType(scope.row.createTime, 'day')}}</span>
+                  </template>
+                </el-table-column>
+                <el-table-column label="操作" fixed="right">
+                  <template slot-scope="scope">
+                  <el-button @click="onEditDataPermClick(scope.row)" type="text" size="mini"
+                    :disabled="!checkPermCodeExist('formSysDataPerm:fragmentSysDataPerm:update')">
+                    编辑
+                  </el-button>
+                  <el-button @click="onDeleteClick(scope.row)" type="text" size="mini"
+                    :disabled="!checkPermCodeExist('formSysDataPerm:fragmentSysDataPerm:delete')">
+                    删除
+                  </el-button>
+                  </template>
+                </el-table-column>
+              </el-table>
+              <el-col :span="24">
+                <el-row type="flex" justify="end" style="margin-top: 10px;">
+                  <el-pagination
+                    :total="fragmentSysDataPerm.SysDataPerm.impl.totalCount"
+                    :current-page="fragmentSysDataPerm.SysDataPerm.impl.currentPage"
+                    :page-size="fragmentSysDataPerm.SysDataPerm.impl.pageSize"
+                    :page-sizes="[10, 20, 50, 100]"
+                    layout="total, prev, pager, next, sizes"
+                    @current-change="fragmentSysDataPerm.SysDataPerm.impl.onCurrentPageChange"
+                    @size-change="fragmentSysDataPerm.SysDataPerm.impl.onPageSizeChange">
+                  </el-pagination>
+                </el-row>
+              </el-col>
+            </el-col>
+          </el-row>
+        </el-scrollbar>
+      </el-tab-pane>
+      <el-tab-pane label="用户授权" name="fragmentSysDataPermUser" style="width: 100%;"
+        v-if="checkPermCodeExist('formSysDataPerm:fragmentSysDataPermUser')">
+        <el-scrollbar class="custom-scroll" :style="{height: getTabPaneHeight + 'px'}">
+          <el-form label-width="75px" size="mini" label-position="right" @submit.native.prevent>
+            <filter-box :item-width="350">
+              <el-form-item label="数据权限">
+                <el-select class="filter-item" v-model="fragmentSysDataPermUser.formFilter.dataPermId" clearable
+                  placeholder="数据权限" :loading="fragmentSysDataPermUser.dataPermId.impl.loading"
+                  @visible-change="fragmentSysDataPermUser.dataPermId.impl.onVisibleChange"
+                  @change="onDataPermChange">
+                  <el-option v-for="item in fragmentSysDataPermUser.dataPermId.impl.dropdownList" :key="item.dataPermId"
+                    :value="item.dataPermId" :label="item.dataPermName" />
+                </el-select>
+              </el-form-item>
+              <el-form-item label="用户名">
+                <el-input class="filter-item" v-model="fragmentSysDataPermUser.formFilter.searchString"
+                  :clearable="true" placeholder="输入用户名 / 昵称查询" @change="refreshFragmentSysDataPermUser(true)" />
+              </el-form-item>
+              <el-button slot="operator" type="primary" :plain="true" size="mini" @click="refreshFragmentSysDataPermUser(true)">
+                查询
+              </el-button>
+              <el-button slot="operator" type="primary" size="mini" @click="onAddDataPermUserClick()"
+                :disabled="!checkPermCodeExist('formSysDataPerm:fragmentSysDataPermUser:addDataPermUser') ||
+                fragmentSysDataPermUser.formFilter.dataPermId == null || fragmentSysDataPermUser.formFilter.dataPermId === ''">
+                添加用户
+              </el-button>
+            </filter-box>
+          </el-form>
+          <el-row>
+            <el-col :span="24">
+              <el-table :data="fragmentSysDataPermUser.SysDataPermUserList.impl.dataList" size="mini"
+                @sort-change="fragmentSysDataPermUser.SysDataPermUserList.impl.onSortChange"
+                header-cell-class-name="table-header-gray">
+                <el-table-column label="序号" header-align="center" align="center" type="index" width="55px"
+                  :index="fragmentSysDataPermUser.SysDataPermUserList.impl.getTableIndex" />
+                <el-table-column label="用户名" prop="loginName">
+                </el-table-column>
+                <el-table-column label="昵称" prop="showName">
+                </el-table-column>
+                <el-table-column label="账号类型">
+                  <template slot-scope="scope">
+                    <span>{{SysUserType.getValue(scope.row.userType)}}</span>
+                  </template>
+                </el-table-column>
+                <el-table-column label="状态">
+                  <template slot-scope="scope">
+                    <el-tag :type="getUserStatusType(scope.row.userStatus)" size="mini">{{SysUserStatus.getValue(scope.row.userStatus)}}</el-tag>
+                  </template>
+                </el-table-column>
+                <el-table-column label="创建时间">
+                  <template slot-scope="scope">
+                    <span>{{formatDateByStatsType(scope.row.createTime, 'day')}}</span>
+                  </template>
+                </el-table-column>
+                <el-table-column label="操作" fixed="right" width="80px">
+                  <template slot-scope="scope">
+                    <el-button class="btn-table-delete" type="text" size="mini"
+                      :disabled="!checkPermCodeExist('formSysDataPerm:fragmentSysDataPermUser:deleteDataPermUser')"
+                      @click="onDeleteRow(scope.row)">移除</el-button>
+                  </template>
+                </el-table-column>
+              </el-table>
+              <el-col :span="24">
+                <el-row type="flex" justify="end" style="margin-top: 10px;">
+                  <el-pagination
+                    :total="fragmentSysDataPermUser.SysDataPermUserList.impl.totalCount"
+                    :current-page="fragmentSysDataPermUser.SysDataPermUserList.impl.currentPage"
+                    :page-size="fragmentSysDataPermUser.SysDataPermUserList.impl.pageSize"
+                    :page-sizes="[10, 20, 50, 100]"
+                    layout="total, prev, pager, next, sizes"
+                    @current-change="fragmentSysDataPermUser.SysDataPermUserList.impl.onCurrentPageChange"
+                    @size-change="fragmentSysDataPermUser.SysDataPermUserList.impl.onPageSizeChange">
+                  </el-pagination>
+                </el-row>
+              </el-col>
+            </el-col>
+          </el-row>
+        </el-scrollbar>
+      </el-tab-pane>
+    </el-tabs>
+  </div>
+</template>
+
+<script>
+import { mapGetters } from 'vuex';
+/* eslint-disable-next-line */
+import { DropdownWidget, TableWidget, UploadWidget, ChartWidget } from '@/utils/widget.js';
+/* eslint-disable-next-line */
+import { uploadMixin, statsDateRangeMixin, cachePageMixin, cachedPageChildMixin } from '@/core/mixins';
+/* eslint-disable-next-line */
+import { SysDataPermController, DictionaryController } from '@/api';
+import formEditSysDataPerm from '@/views/upms/formEditSysDataPerm';
+import formSetSysDataPermUser from '@/views/upms/formSetSysDataPermUser';
+
+export default {
+  name: 'formSysDataPerm',
+  props: {
+  },
+  mixins: [uploadMixin, statsDateRangeMixin, cachePageMixin],
+  data () {
+    return {
+      activeFragmentId: undefined,
+      fragmentSysDataPerm: {
+        formFilter: {
+          sysDatapermType: undefined,
+          sysDataPermName: undefined
+        },
+        formFilterCopy: {
+          sysDatapermType: undefined,
+          sysDataPermName: undefined
+        },
+        sysDatapermType: {
+          impl: new DropdownWidget(this.loadSysDatapermTypeDropdownList)
+        },
+        SysDataPerm: {
+          impl: new TableWidget(this.loadSysDataPermData, this.loadSysDataPermVerify, true, 'createTime', 1)
+        },
+        isInit: false
+      },
+      fragmentSysDataPermUser: {
+        formFilter: {
+          dataPermId: undefined,
+          searchString: undefined
+        },
+        dataPermId: {
+          impl: new DropdownWidget(this.loadDataPermDropdownList)
+        },
+        SysDataPermUserList: {
+          impl: new TableWidget(this.loadSysDataPermUserListData, this.loadSysDataPermUserListVerify, true, 'createTime', 1)
+        },
+        isInit: false
+      }
+    }
+  },
+  methods: {
+    /**
+     * 数据权限数据获取函数，返回Primise
+     */
+    loadSysDataPermData (params) {
+      params.sysDataPermFilter = {
+        searchString: this.fragmentSysDataPerm.formFilterCopy.sysDataPermName,
+        ruleType: this.fragmentSysDataPerm.formFilterCopy.sysDatapermType
+      };
+      return new Promise((resolve, reject) => {
+        SysDataPermController.list(this, params).then(res => {
+          resolve({
+            dataList: res.data.dataList,
+            totalCount: res.data.totalCount
+          });
+        }).catch(e => {
+          reject(e);
+        });
+      });
+    },
+    /**
+     * 数据权限数据获取检测函数，返回true正常获取数据，返回false停止获取数据
+     */
+    loadSysDataPermVerify () {
+      this.fragmentSysDataPerm.formFilterCopy.sysDataPermName = this.fragmentSysDataPerm.formFilter.sysDataPermName;
+      this.fragmentSysDataPerm.formFilterCopy.sysDatapermType = this.fragmentSysDataPerm.formFilter.sysDatapermType;
+      return true;
+    },
+    /**
+     * 过滤规则下拉数据获取函数
+     */
+    loadSysDatapermTypeDropdownList () {
+      return new Promise((resolve, reject) => {
+        let params = {};
+        DictionaryController.dictSysDataPermType(this, params).then(res => {
+          resolve(res.getList());
+        }).catch(e => {
+          reject(e);
+        });
+      });
+    },
+    /**
+     * 过滤规则下拉框显隐
+     */
+    onSysDatapermTypeVisibleChange (show) {
+      this.fragmentSysDataPerm.sysDatapermType.impl.onVisibleChange(show).catch(e => {});
+    },
+    /**
+     * 过滤规则选中值改变
+     */
+    onSysDatapermTypeValueChange (value) {
+    },
+    /**
+     * 更新数据权限管理
+     */
+    refreshFragmentSysDataPerm (reloadData = false) {
+      // 重新获取数据组件的数据
+      if (reloadData) {
+        this.fragmentSysDataPerm.SysDataPerm.impl.refreshTable(true, 1);
+      } else {
+        this.fragmentSysDataPerm.SysDataPerm.impl.refreshTable();
+      }
+      this.fragmentSysDataPerm.sysDatapermType.impl.onVisibleChange(true).catch(e => {});
+      this.fragmentSysDataPerm.isInit = true;
+    },
+    /**
+     * 新建
+     */
+    onAddDataPermClick () {
+      let params = {};
+
+      this.$dialog.show('新建数据权限', formEditSysDataPerm, {
+        area: ['800px', '520px']
+      }, params).then(res => {
+        this.refreshFragmentSysDataPerm();
+      }).catch(e => {});
+    },
+    /**
+     * 编辑
+     */
+    onEditDataPermClick (row) {
+      let params = {
+        dataPermId: row.dataPermId
+      };
+
+      this.$dialog.show('编辑数据权限', formEditSysDataPerm, {
+        area: ['800px', '520px']
+      }, params).then(res => {
+        this.fragmentSysDataPerm.SysDataPerm.impl.refreshTable();
+      }).catch(e => {});
+    },
+    /**
+     * 删除
+     */
+    onDeleteClick (row) {
+      let params = {
+        dataPermId: row.dataPermId
+      };
+
+      this.$confirm('是否删除此数据权限？').then(res => {
+        SysDataPermController.delete(this, params).then(res => {
+          this.$message.success('删除成功');
+          this.fragmentSysDataPerm.SysDataPerm.impl.refreshTable();
+        }).catch(e => {});
+      }).catch(e => {});
+    },
+    // AAAAAAAAAAA
+    onDataPermChange (value) {
+      this.refreshFragmentSysDataPermUser(true);
+    },
+    getUserStatusType (status) {
+      if (status === this.SysUserStatus.NORMAL) {
+        return 'success';
+      } else if (status === this.SysUserStatus.LOCKED) {
+        return 'danger';
+      } else {
+        return 'info';
+      }
+    },
+    loadDataPermDropdownList () {
+      return new Promise((resolve, reject) => {
+        let params = {};
+        SysDataPermController.list(this, params).then(res => {
+          resolve(res.data.dataList);
+        }).catch(e => {
+          reject(e);
+        });
+      });
+    },
+    /**
+     * 用户列表数据获取函数，返回Primise
+     */
+    loadSysDataPermUserListData (params) {
+      return new Promise((resolve, reject) => {
+        if (this.fragmentSysDataPermUser.formFilter.dataPermId == null || this.fragmentSysDataPermUser.formFilter.dataPermId === '') {
+          this.$message.error('请选择数据权限');
+          resolve({
+            dataList: [],
+            totalCount: 0
+          });
+          return;
+        }
+
+        params.dataPermId = this.fragmentSysDataPermUser.formFilter.dataPermId;
+        params.searchString = this.fragmentSysDataPermUser.formFilter.searchString;
+        SysDataPermController.listDataPermUser(this, params).then(res => {
+          resolve({
+            dataList: res.data.dataList,
+            totalCount: res.data.totalCount
+          });
+        }).catch(e => {
+          reject(e);
+        });
+      });
+    },
+    /**
+     * 用户列表数据获取检测函数，返回true正常获取数据，返回false停止获取数据
+     */
+    loadSysDataPermUserListVerify () {
+      return true;
+    },
+    onDeleteRow (row) {
+      this.$confirm('是否移除此用户?').then(res => {
+        let params = {
+          dataPermId: this.fragmentSysDataPermUser.formFilter.dataPermId,
+          userId: row.userId
+        }
+
+        SysDataPermController.deleteDataPermUser(this, params).then(res => {
+          this.refreshFragmentSysDataPermUser(true);
+          this.$message.success('移除成功');
+        }).catch(e => {});
+      }).catch(e => {});
+    },
+    /**
+     * 更新数据权限授权
+     */
+    refreshFragmentSysDataPermUser (reloadData = false) {
+      // 重新获取数据组件的数据
+      if (reloadData) {
+        this.fragmentSysDataPermUser.SysDataPermUserList.impl.refreshTable(true, 1);
+      } else {
+        this.fragmentSysDataPermUser.SysDataPermUserList.impl.refreshTable();
+      }
+      this.fragmentSysDataPermUser.isInit = true;
+    },
+    /**
+     * 授权用户
+     */
+    onAddDataPermUserClick () {
+      let params = {
+        dataPermId: this.fragmentSysDataPermUser.formFilter.dataPermId
+      };
+
+      this.$dialog.show('授权用户', formSetSysDataPermUser, {
+        area: ['1100px', '580px']
+      }, params).then(res => {
+        this.refreshFragmentSysDataPermUser(true);
+      }).catch(e => {
+        this.refreshFragmentSysDataPermUser(true);
+      });
+    },
+    buildFragmentPermCodeMap () {
+      this.permCodeList = [
+        {
+          key: 'fragmentSysDataPerm',
+          permCode: 'formSysDataPerm:fragmentSysDataPerm',
+          refresh: this.refreshFragmentSysDataPerm
+        },
+        {
+          key: 'fragmentSysDataPermUser',
+          permCode: 'formSysDataPerm:fragmentSysDataPermUser',
+          refresh: this.refreshFragmentSysDataPermUser
+        }
+      ];
+    },
+    onFragmentChange (fragmentId) {
+      for (let i = 0; i < this.permCodeList.length; i++) {
+        if (this.permCodeList[i].key === fragmentId) {
+          this.activeFragmentId = fragmentId;
+          // if (this.permCodeList[i].refresh) this.permCodeList[i].refresh();
+          return true;
+        }
+      }
+      return false;
+    },
+    getActiveFragment () {
+      for (let i = 0; i < this.permCodeList.length; i++) {
+        if (this.permCodeList[i].key === this.activeFragmentId) {
+          return this.permCodeList[i];
+        }
+      }
+    },
+    /**
+     * 根据权限获取默认显示的fragment
+     */
+    getDefaultFragment () {
+      for (let i = 0; i < this.permCodeList.length; i++) {
+        if (this.checkPermCodeExist(this.permCodeList[i].permCode)) {
+          this.activeFragmentId = this.permCodeList[i].key;
+          return this.permCodeList[i];
+        }
+      }
+      return undefined;
+    },
+    onResume () {
+      this.refreshFragmentSysDataPerm();
+    },
+    initFormData () {
+    },
+    formInit () {
+      this.buildFragmentPermCodeMap();
+      let defaultFragment = this.getDefaultFragment();
+      if (defaultFragment == null) {
+        this.$message.error('您没有访问这个页面的权限，请与系统管理员联系！');
+      } else {
+        if (defaultFragment.refresh) defaultFragment.refresh();
+      }
+    }
+  },
+  computed: {
+    getTabPaneHeight () {
+      return (this.getClientHeight - 192);
+    },
+    ...mapGetters(['getClientHeight'])
+  },
+  created () {
+    this.formInit();
+  }
+}
+</script>

orange-admin-web/src/views/upms/formSysDataPermUser/index.vue

@@ -0,0 +1,218 @@
+<template>
+  <div>
+    <el-form label-width="75px" size="mini" label-position="right" @submit.native.prevent>
+      <filter-box :item-width="350">
+        <el-form-item label="数据权限">
+          <el-select class="filter-item" v-model="formDataPermUser.formFilter.dataPermId" clearable
+            placeholder="数据权限" :loading="formDataPermUser.dataPermId.impl.loading"
+            @visible-change="formDataPermUser.dataPermId.impl.onVisibleChange"
+            @change="onDataPermChange">
+            <el-option v-for="item in formDataPermUser.dataPermId.impl.dropdownList" :key="item.dataPermId"
+              :value="item.dataPermId" :label="item.dataPermName" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="用户名">
+          <el-input class="filter-item" v-model="formDataPermUser.formFilter.searchString"
+            :clearable="true" placeholder="输入用户名 / 昵称查询" @change="refreshFormDataPermUser(true)" />
+        </el-form-item>
+        <el-button slot="operator" type="primary" :plain="true" size="mini" @click="refreshFormDataPermUser(true)">
+          查询
+        </el-button>
+        <el-button slot="operator" type="primary" size="mini" @click="onAddDataPermUserClick()"
+          :disabled="!checkPermCodeExist('sysDataPermUserManagement:addDataPermUser') || formDataPermUser.formFilter.dataPermId == null || formDataPermUser.formFilter.dataPermId === ''">
+          授权用户
+        </el-button>
+      </filter-box>
+    </el-form>
+    <el-row>
+      <el-col :span="24">
+        <el-table :data="formDataPermUser.SysDataPermUserList.impl.dataList" size="mini"
+          @sort-change="formDataPermUser.SysDataPermUserList.impl.onSortChange"
+          header-cell-class-name="table-header-gray">
+          <el-table-column label="序号" header-align="center" align="center" type="index" width="55px"
+            :index="formDataPermUser.SysDataPermUserList.impl.getTableIndex" />
+          <el-table-column label="用户名" prop="loginName">
+          </el-table-column>
+          <el-table-column label="昵称" prop="showName">
+          </el-table-column>
+          <el-table-column label="账号类型">
+            <template slot-scope="scope">
+              <span>{{SysUserType.getValue(scope.row.userType)}}</span>
+            </template>
+          </el-table-column>
+          <el-table-column label="状态">
+            <template slot-scope="scope">
+              <el-tag :type="getUserStatusType(scope.row.userStatus)" size="mini">{{SysUserStatus.getValue(scope.row.userStatus)}}</el-tag>
+            </template>
+          </el-table-column>
+          <el-table-column label="创建时间">
+            <template slot-scope="scope">
+              <span>{{formatDateByStatsType(scope.row.createTime, 'day')}}</span>
+            </template>
+          </el-table-column>
+          <el-table-column label="操作" fixed="right" width="80px">
+            <template slot-scope="scope">
+              <el-button class="btn-table-delete" type="text" size="mini" @click="onDeleteRow(scope.row)">移除</el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+        <el-col :span="24">
+          <el-row type="flex" justify="end" style="margin-top: 10px;">
+            <el-pagination
+              :total="formDataPermUser.SysDataPermUserList.impl.totalCount"
+              :current-page="formDataPermUser.SysDataPermUserList.impl.currentPage"
+              :page-size="formDataPermUser.SysDataPermUserList.impl.pageSize"
+              :page-sizes="[10, 20, 50, 100]"
+              layout="total, prev, pager, next, sizes"
+              @current-change="formDataPermUser.SysDataPermUserList.impl.onCurrentPageChange"
+              @size-change="formDataPermUser.SysDataPermUserList.impl.onPageSizeChange">
+            </el-pagination>
+          </el-row>
+        </el-col>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+/* eslint-disable-next-line */
+import { DropdownWidget, TableWidget, UploadWidget, ChartWidget } from '@/utils/widget.js';
+/* eslint-disable-next-line */
+import { uploadMixin, statsDateRangeMixin, cachePageMixin, cachedPageChildMixin } from '@/core/mixins';
+/* eslint-disable-next-line */
+import { SysDataPermController, DictionaryController } from '@/api';
+import formSetSysDataPermUser from '@/views/upms/formSetSysDataPermUser';
+
+export default {
+  name: 'formDataPermUser',
+  props: {
+  },
+  mixins: [uploadMixin, statsDateRangeMixin, cachePageMixin],
+  data () {
+    return {
+      formDataPermUser: {
+        formFilter: {
+          dataPermId: undefined,
+          searchString: undefined
+        },
+        dataPermId: {
+          impl: new DropdownWidget(this.loadDataPermDropdownList)
+        },
+        SysDataPermUserList: {
+          impl: new TableWidget(this.loadSysDataPermUserListData, this.loadSysDataPermUserListVerify, true, 'createTime', 1)
+        },
+        isInit: false
+      }
+    }
+  },
+  methods: {
+    onDataPermChange (value) {
+      this.refreshFormDataPermUser(true);
+    },
+    getUserStatusType (status) {
+      if (status === this.SysUserStatus.NORMAL) {
+        return 'success';
+      } else if (status === this.SysUserStatus.LOCKED) {
+        return 'danger';
+      } else {
+        return 'info';
+      }
+    },
+    loadDataPermDropdownList () {
+      return new Promise((resolve, reject) => {
+        let params = {};
+        SysDataPermController.list(this, params).then(res => {
+          resolve(res.data.dataList);
+        }).catch(e => {
+          reject(e);
+        });
+      });
+    },
+    /**
+     * 用户列表数据获取函数，返回Primise
+     */
+    loadSysDataPermUserListData (params) {
+      return new Promise((resolve, reject) => {
+        if (this.formDataPermUser.formFilter.dataPermId == null || this.formDataPermUser.formFilter.dataPermId === '') {
+          this.$message.error('请选择数据权限');
+          resolve({
+            dataList: [],
+            totalCount: 0
+          });
+          return;
+        }
+
+        params.dataPermId = this.formDataPermUser.formFilter.dataPermId;
+        params.searchString = this.formDataPermUser.formFilter.searchString;
+        SysDataPermController.listDataPermUser(this, params).then(res => {
+          resolve({
+            dataList: res.data.dataList,
+            totalCount: res.data.totalCount
+          });
+        }).catch(e => {
+          reject(e);
+        });
+      });
+    },
+    /**
+     * 用户列表数据获取检测函数，返回true正常获取数据，返回false停止获取数据
+     */
+    loadSysDataPermUserListVerify () {
+      return true;
+    },
+    onDeleteRow (row) {
+      this.$confirm('是否移除此用户?').then(res => {
+        let params = {
+          dataPermId: this.formDataPermUser.formFilter.dataPermId,
+          userId: row.userId
+        }
+
+        SysDataPermController.deleteDataPermUser(this, params).then(res => {
+          this.refreshFormDataPermUser(true);
+          this.$message.success('移除成功');
+        }).catch(e => {});
+      }).catch(e => {});
+    },
+    /**
+     * 更新数据权限授权
+     */
+    refreshFormDataPermUser (reloadData = false) {
+      // 重新获取数据组件的数据
+      if (reloadData) {
+        this.formDataPermUser.SysDataPermUserList.impl.refreshTable(true, 1);
+      } else {
+        this.formDataPermUser.SysDataPermUserList.impl.refreshTable();
+      }
+      this.formDataPermUser.isInit = true;
+    },
+    /**
+     * 授权用户
+     */
+    onAddDataPermUserClick () {
+      let params = {
+        dataPermId: this.formDataPermUser.formFilter.dataPermId
+      };
+
+      this.$dialog.show('授权用户', formSetSysDataPermUser, {
+        area: ['1100px', '580px']
+      }, params).then(res => {
+        this.refreshFormDataPermUser(true);
+      }).catch(e => {
+        this.refreshFormDataPermUser(true);
+      });
+    },
+    onResume () {
+      this.refreshFormDataPermUser();
+    },
+    initFormData () {
+    },
+    formInit () {
+      this.initFormData();
+      // this.refreshFormDataPermUser();
+    }
+  },
+  created () {
+    this.formInit();
+  }
+}
+</script>

orange-admin-web/src/views/upms/formSysDept/index.vue

@@ -0,0 +1,189 @@
+<template>
+  <div>
+    <el-form label-width="75px" size="mini" label-position="right" @submit.native.prevent>
+      <filter-box :item-width="350">
+        <el-form-item label="部门名称">
+          <el-input class="filter-item" v-model="formSysDept.formFilter.deptName"
+            :clearable="true" placeholder="部门名称" />
+        </el-form-item>
+        <el-button slot="operator" type="primary" :plain="true" size="mini" @click="refreshFormSysDept(true)">查询</el-button>
+        <el-button slot="operator" type="primary" size="mini" :disabled="!checkPermCodeExist('formSysDept:fragmentSysDept:add')"
+          @click="onCreateSysDeptClick()">
+          新建
+        </el-button>
+      </filter-box>
+    </el-form>
+    <el-row>
+      <el-col :span="24">
+        <el-table :data="formSysDept.SysDeptList.impl.dataList" size="mini" row-key="deptId"
+          header-cell-class-name="table-header-gray">
+          <el-table-column label="序号" header-align="center" align="center" type="index" width="50px">
+          </el-table-column>
+          <el-table-column label="部门名称" prop="deptName">
+          </el-table-column>
+          <el-table-column label="所在省份" prop="cityIdDictMap.name">
+          </el-table-column>
+          <el-table-column label="所在城市" prop="provinceIdDictMap.name">
+          </el-table-column>
+          <el-table-column label="创建人" prop="createUsername">
+          </el-table-column>
+          <el-table-column label="创建时间">
+            <template slot-scope="scope">
+              <span>{{formatDateByStatsType(scope.row.createTime, 'day')}}</span>
+            </template>
+          </el-table-column>
+          <el-table-column label="操作" fixed="right" width="150px">
+            <template slot-scope="scope">
+            <el-button @click="onEditSysDeptClick(scope.row)" type="text" size="mini"
+              :disabled="!checkPermCodeExist('formSysDept:fragmentSysDept:update')">
+              编辑
+            </el-button>
+            <el-button @click="onDeleteClick(scope.row)" type="text" size="mini"
+              :disabled="!checkPermCodeExist('formSysDept:fragmentSysDept:delete')">
+              删除
+            </el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { treeDataTranslate } from '@/utils';
+/* eslint-disable-next-line */
+import { DropdownWidget, TableWidget, UploadWidget, ChartWidget } from '@/utils/widget.js';
+/* eslint-disable-next-line */
+import { uploadMixin, statsDateRangeMixin, cachePageMixin, cachedPageChildMixin } from '@/core/mixins';
+/* eslint-disable-next-line */
+import { SysDeptController, DictionaryController } from '@/api';
+import formEditSysDept from '../formEditSysDept';
+
+export default {
+  name: 'formSysDept',
+  props: {
+  },
+  mixins: [uploadMixin, statsDateRangeMixin, cachePageMixin],
+  data () {
+    return {
+      formSysDept: {
+        formFilter: {
+          deptName: undefined
+        },
+        formFilterCopy: {
+          deptName: undefined
+        },
+        SysDeptList: {
+          impl: new TableWidget(this.loadSysDeptListData, this.loadSysDeptListVerify, false)
+        },
+        isInit: false
+      }
+    }
+  },
+  methods: {
+    /**
+     * 部门列表数据获取函数，返回Primise
+     */
+    loadSysDeptListData (params) {
+      params.sysDeptFilter = {
+        deptName: this.formSysDept.formFilterCopy.deptName
+      };
+      return new Promise((resolve, reject) => {
+        SysDeptController.list(this, params).then(res => {
+          resolve({
+            dataList: treeDataTranslate(res.data.dataList, 'deptId', 'parentId'),
+            totalCount: res.data.totalCount
+          });
+        }).catch(e => {
+          reject(e);
+        });
+      });
+    },
+    /**
+     * 部门列表数据获取检测函数，返回true正常获取数据，返回false停止获取数据
+     */
+    loadSysDeptListVerify () {
+      this.formSysDept.formFilterCopy.deptName = this.formSysDept.formFilter.deptName;
+      return true;
+    },
+    /**
+     * 部门列表当前页变化函数
+     */
+    onSysDeptListCurrentPageChange (newPage) {
+      this.formSysDept.SysDeptList.impl.onCurrentPageChange(newPage);
+    },
+    /**
+     * 部门列表每页显示数量变化函数（跳转回第一页）
+     */
+    onSysDeptListPageSizeChange (newPage) {
+      this.formSysDept.SysDeptList.impl.onPageSizeChange(newPage);
+    },
+    /**
+     * 更新部门管理
+     */
+    refreshFormSysDept (reloadData = false) {
+      // 重新获取数据组件的数据
+      if (reloadData) {
+        this.formSysDept.SysDeptList.impl.refreshTable(true, 1);
+      } else {
+        this.formSysDept.SysDeptList.impl.refreshTable();
+      }
+      this.formSysDept.isInit = true;
+    },
+    /**
+     * 新建
+     */
+    onCreateSysDeptClick () {
+      let params = {};
+
+      this.$dialog.show('新建部门', formEditSysDept, {
+        area: ['500px']
+      }, params).then(res => {
+        this.refreshFormSysDept();
+      }).catch(e => {});
+    },
+    /**
+     * 编辑部门
+     */
+    onEditSysDeptClick (row) {
+      let params = {
+        deptId: row.deptId
+      };
+
+      this.$dialog.show('编辑部门', formEditSysDept, {
+        area: ['500px']
+      }, params).then(res => {
+        this.formSysDept.SysDeptList.impl.refreshTable();
+      }).catch(e => {});
+    },
+    /**
+     * 删除
+     */
+    onDeleteClick (row) {
+      let params = {
+        deptId: row.deptId
+      };
+
+      this.$confirm('是否删除部门？').then(res => {
+        SysDeptController.delete(this, params).then(res => {
+          this.$message.success('删除成功');
+          this.formSysDept.SysDeptList.impl.refreshTable();
+        }).catch(e => {});
+      }).catch(e => {});
+    },
+    onResume () {
+      this.refreshFormSysDept();
+    },
+    initFormData () {
+    },
+    formInit () {
+      this.initFormData();
+      this.refreshFormSysDept();
+    }
+  },
+  created () {
+    this.formInit();
+  }
+}
+</script>

orange-admin-web/src/views/upms/formSysMenu/index.vue

@@ -0,0 +1,239 @@
+<template>
+  <div>
+    <el-form label-width="100px" size="mini" label-position="right" @submit.native.prevent>
+      <filter-box :item-width="350">
+        <el-button slot="operator" type="primary" size="mini" :plain="true"
+          @click="refreshFormSysMenu(true)">
+          刷新
+        </el-button>
+        <el-button slot="operator" type="primary" size="mini" :disabled="!checkPermCodeExist('formSysMenu:fragmentSysMenu:add')"
+          @click="onCreateSysMenuClick()">
+          新建
+        </el-button>
+      </filter-box>
+    </el-form>
+    <el-row>
+      <el-col :span="24">
+        <el-table :data="formSysMenu.SysMenu.impl.dataList" size="mini"
+          header-cell-class-name="table-header-gray" row-key="menuId">
+          <el-table-column label="菜单名称" prop="menuName" width="300px">
+          </el-table-column>
+          <el-table-column label="菜单图标" prop="icon" width="100px">
+            <template slot-scope="scope">
+              <i :class="scope.row.icon" />
+            </template>
+          </el-table-column>
+          <el-table-column label="菜单顺序" prop="showOrder" width="100px">
+          </el-table-column>
+          <el-table-column label="菜单类型" prop="menuType" width="100px">
+            <template slot-scope="scope">
+              <el-tag size="mini" :type="getMenuType(scope.row)">{{SysMenuType.getValue(scope.row.menuType)}}</el-tag>
+            </template>
+          </el-table-column>
+          <el-table-column label="菜单路由" prop="formRouterName" min-width="250px">
+          </el-table-column>
+          <el-table-column label="操作" fixed="right" width="200px">
+            <template slot-scope="scope">
+              <el-button @click="onEditSysMenuClick(scope.row)" type="text" size="mini"
+                :disabled="!checkPermCodeExist('formSysMenu:fragmentSysMenu:update')">
+                编辑
+              </el-button>
+              <el-button @click="onAddChildSysMenuClick(scope.row)" type="text" size="mini"
+                :disabled="!checkPermCodeExist('formSysMenu:fragmentSysMenu:add') || scope.row.menuType === SysMenuType.BUTTON">
+                添加
+              </el-button>
+              <el-button @click="onDeleteClick(scope.row)" type="text" size="mini"
+                :disabled="!checkPermCodeExist('formSysMenu:fragmentSysMenu:delete')">
+                删除
+              </el-button>
+              <el-button @click="onShowPermList(scope.row)" type="text" size="mini"
+                :disabled="!checkPermCodeExist('formSysMenu:fragmentSysMenu:listMenuPerm') || scope.row.menuType === SysMenuType.DIRECTORY">
+                权限资源
+              </el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { treeDataTranslate } from '@/utils';
+/* eslint-disable-next-line */
+import { DropdownWidget, TableWidget, UploadWidget, ChartWidget } from '@/utils/widget.js';
+/* eslint-disable-next-line */
+import { uploadMixin, statsDateRangeMixin, cachePageMixin, cachedPageChildMixin } from '@/core/mixins';
+/* eslint-disable-next-line */
+import { DictionaryController, SystemController } from '@/api';
+import formEditSysMenu from '@/views/upms/formEditSysMenu';
+import formMenuPerm from '@/views/upms/formMenuPerm';
+
+export default {
+  name: 'formSysMenu',
+  props: {
+  },
+  mixins: [uploadMixin, statsDateRangeMixin, cachePageMixin],
+  data () {
+    return {
+      formSysMenu: {
+        formFilter: {
+        },
+        formFilterCopy: {
+        },
+        SysMenu: {
+          impl: new TableWidget(this.loadSysMenuData, this.loadSysMenuVerify, false)
+        },
+        isInit: false
+      }
+    }
+  },
+  methods: {
+    getMenuType (row) {
+      if (row.menuType === 0) {
+        return 'primary'
+      } else if (row.menuType === 1) {
+        return 'success';
+      } else if (row.menuType === 2) {
+        return 'danger';
+      } else if (row.menuType === 3) {
+        return 'warning';
+      }
+    },
+    /**
+     * 菜单数据数据获取函数，返回Primise
+     */
+    loadSysMenuData (params) {
+      return new Promise((resolve, reject) => {
+        SystemController.getMenuPermList(this, params).then(res => {
+          this.allMenuList = res.data.map((item) => {
+            return {...item};
+          });
+          resolve({
+            dataList: treeDataTranslate(res.data, 'menuId'),
+            totalCount: res.data.length
+          });
+        }).catch(e => {
+          reject(e);
+        });
+      });
+    },
+    /**
+     * 菜单数据数据获取检测函数，返回true正常获取数据，返回false停止获取数据
+     */
+    loadSysMenuVerify () {
+      return true;
+    },
+    /**
+     * 菜单数据当前页变化函数
+     */
+    onSysMenuCurrentPageChange (newPage) {
+      this.formSysMenu.SysMenu.impl.onCurrentPageChange(newPage);
+    },
+    /**
+     * 菜单数据每页显示数量变化函数（跳转回第一页）
+     */
+    onSysMenuPageSizeChange (newPage) {
+      this.formSysMenu.SysMenu.impl.onPageSizeChange(newPage);
+    },
+    /**
+     * 更新菜单管理
+     */
+    refreshFormSysMenu (reloadData = false) {
+      // 重新获取数据组件的数据
+      if (reloadData) {
+        this.formSysMenu.SysMenu.impl.refreshTable(true, 1);
+      } else {
+        this.formSysMenu.SysMenu.impl.refreshTable();
+      }
+      this.formSysMenu.isInit = true;
+    },
+    /**
+     * 新建
+     */
+    onCreateSysMenuClick () {
+      let params = {
+        menuList: this.allMenuList
+      };
+      this.$dialog.show('新建', formEditSysMenu, {
+        area: ['800px']
+      }, params).then(res => {
+        this.refreshFormSysMenu();
+      }).catch(e => {});
+    },
+    /**
+     * 编辑
+     */
+    onEditSysMenuClick (row) {
+      SystemController.viewMenu(this, {menuId: row.menuId}).then(res => {
+        let params = {
+          rowData: res.data,
+          menuId: row.menuId,
+          menuList: this.allMenuList
+        };
+
+        this.$dialog.show('编辑', formEditSysMenu, {
+          area: ['800px']
+        }, params).then(res => {
+          this.formSysMenu.SysMenu.impl.refreshTable();
+        }).catch(e => {});
+      }).catch(e => {});
+    },
+    /**
+     * 添加子菜单
+     */
+    onAddChildSysMenuClick (row) {
+      let params = {
+        parentId: row.menuId,
+        menuList: this.allMenuList
+      };
+
+      this.$dialog.show('添加子菜单', formEditSysMenu, {
+        area: ['800px']
+      }, params).then(res => {
+        this.formSysMenu.SysMenu.impl.refreshTable();
+      }).catch(e => {});
+    },
+    /**
+     * 删除
+     */
+    onDeleteClick (row) {
+      let params = {
+        menuId: row.menuId
+      };
+
+      this.$confirm('是否删除此菜单项？').then(res => {
+        SystemController.deleteMenu(this, params).then(res => {
+          this.$message.success('删除成功');
+          this.formSysMenu.SysMenu.impl.refreshTable();
+        }).catch(e => {});
+      }).catch(e => {});
+    },
+    /**
+     * 权限资源
+     */
+    onShowPermList (row) {
+      let params = {
+        menuId: row.menuId
+      };
+
+      this.$dialog.show('权限资源 - ' + row.menuName, formMenuPerm, {
+        area: ['1200px', '600px']
+      }, params).catch(e => {
+      });
+    },
+    onResume () {
+      this.refreshFormSysMenu();
+    },
+    initFormData () {
+    },
+    formInit () {
+      this.initFormData();
+      this.refreshFormSysMenu();
+    }
+  },
+  created () {
+    this.formInit();
+  }
+}
+</script>

orange-admin-web/src/views/upms/formSysPerm/index.vue

@@ -0,0 +1,398 @@
+<template>
+  <el-container>
+    <el-aside width="300px">
+      <el-card class="base-card" shadow="never" :body-style="{ padding: '0px' }">
+        <div slot="header" class="base-card-header">
+          <span>权限模块</span>
+          <div class="base-card-operation">
+            <el-button type="text"
+              :disabled="!checkPermCodeExist('formSysPerm:fragmentSysPerm:addPermModule')"
+              icon="el-icon-circle-plus-outline" @click="onCreatePermModuleClick()" />
+          </div>
+        </div>
+        <el-scrollbar :style="{height: (getClientHeight - 184) + 'px'}" class="custom-scroll">
+          <el-tree ref="moduleTree" :data="getModuleTreeData" :props="{label: 'moduleName'}"
+            node-key="moduleId" @node-click="onModuleNodeClick" :default-expanded-keys="formPerm.expandedModule"
+            :highlight-current="true" @node-expand="onModuleNodeExpand" @node-collapse="onModuleNodeCollapse">
+            <div class="module-node-item" slot-scope="{ data }">
+              <div class="module-node-menu" :class="{group: data.moduleType === SysPermModuleType.GROUP}" v-if="!data.isAll">
+                <el-button type="text" size="mini" @click.stop="onEditpermModuleClick(data)" icon="el-icon-edit-outline"
+                  :disabled="!checkPermCodeExist('formSysPerm:fragmentSysPerm:updatePermModule')"></el-button>
+                <el-button type="text" size="mini" v-show="data.moduleType === SysPermModuleType.GROUP"
+                  :disabled="!checkPermCodeExist('formSysPerm:fragmentSysPerm:addPermModule')" icon="el-icon-circle-plus-outline"
+                  @click.stop="onAddChildPermModuleClick(data)"></el-button>
+                <el-button type="text" size="mini" @click.stop="onDeleteModuleClick(data)" icon="el-icon-delete"
+                  :disabled="!checkPermCodeExist('formSysPerm:fragmentSysPerm:deletePermModule')"></el-button>
+              </div>
+              <div class="module-node-text" :class="{group: data.moduleType === SysPermModuleType.GROUP}">
+                <div class="text">{{ data.moduleName }}</div>
+              </div>
+            </div>
+          </el-tree>
+        </el-scrollbar>
+      </el-card>
+    </el-aside>
+    <el-main style="padding-left: 15px;">
+      <el-form label-width="75px" size="mini" label-position="right" @submit.native.prevent>
+        <filter-box :item-width="350">
+          <el-form-item label="关联URL">
+            <el-input class="filter-item" placeholder="URL模糊搜索" v-model="formPerm.formFilter.url"
+              size="mini" clearable />
+          </el-form-item>
+          <el-button slot="operator" type="primary" :plain="true" size="mini" @click="refreshFormPerm(true)">查询</el-button>
+          <el-button slot="operator" type="primary" size="mini" :disabled="!checkPermCodeExist('formSysPerm:fragmentSysPerm:addPerm')"
+            @click="onCreatePermClick()">
+            新建
+          </el-button>
+        </filter-box>
+      </el-form>
+      <el-row>
+        <el-col :span="24">
+          <el-table :data="formPerm.SysPerm.impl.dataList" size="mini" @sort-change="formPerm.SysPerm.impl.onSortChange"
+            header-cell-class-name="table-header-gray" :height="(getClientHeight - 222) + 'px'">
+            <el-table-column label="序号" header-align="center" align="center" type="index" width="50px" :index="formPerm.SysPerm.impl.getTableIndex" />
+            <el-table-column label="权限名称" prop="permName" width="150px">
+            </el-table-column>
+            <el-table-column label="权限模块" prop="moduleIdDictMap.name" width="100px">
+            </el-table-column>
+            <el-table-column label="关联URL" prop="url" min-width="250px">
+            </el-table-column>
+            <el-table-column label="创建时间" width="100px">
+              <template slot-scope="scope">
+                <span>{{formatDateByStatsType(scope.row.createTime, 'day')}}</span>
+              </template>
+            </el-table-column>
+            <el-table-column label="操作" fixed="right" width="100px">
+              <template slot-scope="scope">
+              <el-button @click="onEditPermModuleClick(scope.row)" type="text" size="mini"
+                :disabled="!checkPermCodeExist('formSysPerm:fragmentSysPerm:updatePerm')">
+                编辑
+              </el-button>
+              <el-button @click="onDeleteClick(scope.row)" type="text" size="mini"
+                :disabled="!checkPermCodeExist('formSysPerm:fragmentSysPerm:deletePerm')">
+                删除
+              </el-button>
+              </template>
+            </el-table-column>
+          </el-table>
+          <el-col :span="24">
+            <el-row type="flex" justify="end" style="margin-top: 10px;">
+              <el-pagination
+                :total="formPerm.SysPerm.impl.totalCount"
+                :current-page="formPerm.SysPerm.impl.currentPage"
+                :page-size="formPerm.SysPerm.impl.pageSize"
+                :page-sizes="[10, 20, 50, 100]"
+                layout="total, prev, pager, next, sizes"
+                @current-change="formPerm.SysPerm.impl.onCurrentPageChange"
+                @size-change="formPerm.SysPerm.impl.onPageSizeChange">
+              </el-pagination>
+            </el-row>
+          </el-col>
+        </el-col>
+      </el-row>
+    </el-main>
+  </el-container>
+</template>
+
+<script>
+import { mapGetters } from 'vuex';
+/* eslint-disable-next-line */
+import { DropdownWidget, TableWidget, UploadWidget, ChartWidget } from '@/utils/widget.js';
+/* eslint-disable-next-line */
+import { uploadMixin, statsDateRangeMixin, cachePageMixin, cachedPageChildMixin } from '@/core/mixins';
+/* eslint-disable-next-line */
+import { SystemController, DictionaryController } from '@/api';
+import formEditSysPerm from '../formEditSysPerm';
+import formEditSysPermModule from '../formEditSysPermModule';
+
+export default {
+  name: 'formSysPerm',
+  props: {
+  },
+  mixins: [uploadMixin, statsDateRangeMixin, cachePageMixin],
+  data () {
+    return {
+      formPerm: {
+        formFilter: {
+          permModuleId: undefined,
+          url: undefined
+        },
+        formFilterCopy: {
+          permModuleId: undefined,
+          url: undefined
+        },
+        permModuleId: {
+          impl: new DropdownWidget(this.loadPermModuleIdDropdownList, true, 'moduleId', 'parentId')
+        },
+        SysPerm: {
+          impl: new TableWidget(this.loadSysPermData, this.loadSysPermVerify, true)
+        },
+        permModuleList: [],
+        expandedModule: [],
+        isInit: false
+      }
+    }
+  },
+  methods: {
+    /**
+     * 权限数据获取函数，返回Primise
+     */
+    loadSysPermData (params) {
+      params.sysPermFilter = {
+        url: this.formPerm.formFilterCopy.url === '' ? undefined : this.formPerm.formFilterCopy.url,
+        moduleId: this.formPerm.formFilterCopy.permModuleId === '' ? undefined : this.formPerm.formFilterCopy.permModuleId
+      }
+      return new Promise((resolve, reject) => {
+        SystemController.getPermList(this, params).then(res => {
+          resolve({
+            dataList: res.data.dataList,
+            totalCount: res.data.totalCount
+          });
+        }).catch(e => {
+          reject(e);
+        });
+      });
+    },
+    /**
+     * 权限数据获取检测函数，返回true正常获取数据，返回false停止获取数据
+     */
+    loadSysPermVerify () {
+      this.formPerm.formFilterCopy.url = this.formPerm.formFilter.url;
+      this.formPerm.formFilterCopy.permModuleId = this.formPerm.formFilter.permModuleId;
+      return true;
+    },
+    /**
+     * 所属权限模块下拉数据获取函数
+     */
+    loadPermModuleIdDropdownList () {
+      return new Promise((resolve, reject) => {
+        let params = {};
+        SystemController.getPermGroupList(this, params).then(res => {
+          this.formPerm.permModuleList = res.data;
+          resolve(res.data);
+        }).catch(e => {
+          reject();
+        });
+      });
+    },
+    /**
+     * 所属权限模块下拉框显隐
+     */
+    onPermModuleIdVisibleChange (show) {
+      this.formPerm.permModuleId.impl.onVisibleChange(show).catch(e => {});
+    },
+    /**
+     * 所属权限模块选中值改变
+     */
+    onPermModuleIdValueChange (value) {
+    },
+    /**
+     * 更新权限管理
+     */
+    refreshFormPerm (reloadData = false) {
+      // 重新获取数据组件的数据
+      if (reloadData) {
+        this.formPerm.SysPerm.impl.refreshTable(true, 1);
+      } else {
+        this.formPerm.SysPerm.impl.refreshTable();
+      }
+      this.formPerm.permModuleId.impl.onVisibleChange(true).catch(e => {});
+      this.formPerm.isInit = true;
+    },
+    /**
+     * 新建
+     */
+    onCreatePermClick () {
+      let params = {
+        currentPermGroupId: this.formPerm.formFilterCopy.permModuleId,
+        permModuleList: this.formPerm.permModuleId.impl.dropdownList
+      };
+
+      this.$dialog.show('新建', formEditSysPerm, {
+        area: ['600px']
+      }, params).then(res => {
+        this.refreshFormPerm();
+      }).catch(e => {});
+    },
+    /**
+     * 编辑
+     */
+    onEditPermModuleClick (row) {
+      let params = {
+        moduleId: row.moduleId,
+        permId: row.permId,
+        rowData: row,
+        permModuleList: this.formPerm.permModuleId.impl.dropdownList
+      };
+
+      this.$dialog.show('编辑', formEditSysPerm, {
+        area: ['600px']
+      }, params).then(res => {
+        this.formPerm.SysPerm.impl.refreshTable();
+      }).catch(e => {});
+    },
+    /**
+     * 删除
+     */
+    onDeleteClick (row) {
+      let params = {
+        permId: row.permId
+      };
+
+      this.$confirm('是否删除此权限？').then(res => {
+        SystemController.deletePerm(this, params).then(res => {
+          this.$message.success('删除成功');
+          this.formPerm.SysPerm.impl.refreshTable();
+        }).catch(e => {});
+      }).catch(e => {});
+    },
+    onResume () {
+      this.refreshFormPerm();
+    },
+    initFormData () {
+    },
+    formInit () {
+      this.initFormData();
+      this.refreshFormPerm();
+    },
+    onModuleNodeClick (data) {
+      if (data.moduleType === this.SysPermModuleType.CONTROLLER) {
+        this.formPerm.formFilter.permModuleId = data.moduleId;
+        this.refreshFormPerm(true);
+      }
+    },
+    /**
+     * 新建模块
+     */
+    onCreatePermModuleClick () {
+      let params = {
+        moduleType: this.SysPermModuleType.GROUP,
+        moduleList: this.formPerm.permModuleList
+      };
+
+      this.$dialog.show('新建模块', formEditSysPermModule, {
+        area: ['600px']
+      }, params).then(res => {
+        this.formPerm.permModuleId.impl.reloadDropdownData().catch(e => {});
+      }).catch(e => {});
+    },
+    /**
+     * 编辑模块
+     */
+    onEditpermModuleClick (row) {
+      let params = {
+        moduleId: row.moduleId,
+        moduleType: row.moduleType,
+        rowData: row,
+        moduleList: this.formPerm.permModuleList
+      };
+
+      this.$dialog.show('编辑模块', formEditSysPermModule, {
+        area: ['600px']
+      }, params).then(res => {
+        this.formPerm.permModuleId.impl.reloadDropdownData().catch(e => {});
+      }).catch(e => {});
+    },
+    /**
+     * 删除
+     */
+    onDeleteModuleClick (row) {
+      let params = {
+        moduleId: row.moduleId
+      };
+
+      this.$confirm('是否删除此模块？').then(res => {
+        SystemController.deletePermGroup(this, params).then(res => {
+          this.$message.success('删除成功');
+          this.formPerm.permModuleId.impl.reloadDropdownData(true).catch(e => {});
+        }).catch(e => {});
+      }).catch(e => {});
+    },
+    onAddChildPermModuleClick (row) {
+      let params = {
+        parentId: row.moduleId,
+        moduleType: this.SysPermModuleType.CONTROLLER,
+        moduleList: this.formPerm.permModuleList
+      };
+
+      this.$dialog.show('添加子模块', formEditSysPermModule, {
+        area: ['600px']
+      }, params).then(res => {
+        this.formPerm.permModuleId.impl.reloadDropdownData(true).catch(e => {});
+      }).catch(e => {});
+    },
+    onModuleNodeCollapse (data, node) {
+      let pos = this.formPerm.expandedModule.indexOf(data.moduleId);
+      if (pos !== -1) {
+        this.formPerm.expandedModule.splice(pos, 1);
+      }
+    },
+    onModuleNodeExpand (data, node) {
+      let pos = this.formPerm.expandedModule.indexOf(data.moduleId);
+      if (pos === -1) {
+        this.formPerm.expandedModule.push(data.moduleId);
+      }
+    }
+  },
+  computed: {
+    getModuleTreeData () {
+      let tempList = [{
+        moduleId: undefined,
+        moduleName: '全部',
+        moduleType: this.SysPermModuleType.CONTROLLER,
+        isAll: true
+      }];
+      return tempList.concat(this.formPerm.permModuleId.impl.dropdownList);
+    },
+    ...mapGetters(['getClientHeight'])
+  },
+  created () {
+    this.formInit();
+  }
+}
+</script>
+
+<style scoped>
+  >>> .el-tree-node__content {
+    height: 35px;
+  }
+
+  >>> .el-tree-node__content .is-leaf {
+    display: none;
+  }
+
+  .module-node-item {
+    width: 100%;
+    height: 35px;
+    line-height: 35px;
+  }
+
+  .module-node-menu {
+    float: right;
+    width: 56px;
+  }
+
+  .module-node-menu.group {
+    width: 84px;
+  }
+
+  .module-node-text {
+    width: 100%;
+    margin-right: 56px;
+  }
+
+  .module-node-text.group {
+    margin-right: 84px;
+  }
+
+  .el-tree-node__content .is-leaf + .module-node-item .module-node-text {
+    padding-left: 24px;
+  }
+
+  .module-node-text .text {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+
+</style>

orange-admin-web/src/views/upms/formSysPermCode/index.vue

@@ -0,0 +1,254 @@
+<template>
+  <div>
+    <el-form label-width="100px" size="mini" label-position="right" @submit.native.prevent>
+      <filter-box :item-width="350">
+        <el-form-item label="权限字名称">
+          <el-input class="filter-item" v-model="formPermCode.formFilter.showName"
+            :clearable="true" placeholder="权限字名称" />
+        </el-form-item>
+        <el-button slot="operator" type="primary" size="mini" :plain="true" @click="refreshFormPermCode(true)">
+          查询
+        </el-button>
+        <el-button slot="operator" type="primary" size="mini" :disabled="!checkPermCodeExist('formSysPermCode:fragmentSysPermCode:add')"
+          @click="onCreatePermCodeClick()">
+          新建
+        </el-button>
+      </filter-box>
+    </el-form>
+    <el-row>
+      <el-col :span="24">
+        <el-table :data="getPermCodeList" size="mini" @sort-change="formPermCode.SysPermCode.impl.onSortChange"
+          row-key="permCodeId" header-cell-class-name="table-header-gray">
+          <el-table-column label="权限字名称" prop="showName" width="250px">
+          </el-table-column>
+          <el-table-column label="权限字类型" prop="permCodeType" width="150px">
+            <template slot-scope="scope">
+              <el-tag size="mini" :type="getPermCodeType(scope.row.permCodeType)">{{SysPermCodeType.getValue(scope.row.permCodeType)}}</el-tag>
+            </template>
+          </el-table-column>
+          <el-table-column label="显示顺序" prop="showOrder" width="100px">
+          </el-table-column>
+          <el-table-column label="权限字标识" prop="permCode" min-width="200px">
+          </el-table-column>
+          <el-table-column label="操作" fixed="right" width="150px">
+            <template slot-scope="scope">
+            <el-button @click="onEditPermCodeClick(scope.row)" type="text" size="mini"
+              :disabled="!checkPermCodeExist('formSysPermCode:fragmentSysPermCode:update')">
+              编辑
+            </el-button>
+            <el-button @click="onAddChildPermCodeClick(scope.row)" type="text" size="mini"
+              :disabled="scope.row.permCodeType === 2 || !checkPermCodeExist('formSysPermCode:fragmentSysPermCode:add')">
+              添加
+            </el-button>
+            <el-button @click="onDeleteClick(scope.row)" type="text" size="mini"
+              :disabled="!checkPermCodeExist('formSysPermCode:fragmentSysPermCode:delete')">
+              删除
+            </el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { treeDataTranslate } from '@/utils';
+/* eslint-disable-next-line */
+import { DropdownWidget, TableWidget, UploadWidget, ChartWidget } from '@/utils/widget.js';
+/* eslint-disable-next-line */
+import { uploadMixin, statsDateRangeMixin, cachePageMixin, cachedPageChildMixin } from '@/core/mixins';
+/* eslint-disable-next-line */
+import { SystemController, DictionaryController } from '@/api';
+import formEditSysPermCode from '@/views/upms/formEditSysPermCode';
+
+export default {
+  name: 'formSysPermCode',
+  props: {
+  },
+  mixins: [uploadMixin, statsDateRangeMixin, cachePageMixin],
+  data () {
+    return {
+      formPermCode: {
+        formFilter: {
+          showName: undefined
+        },
+        formFilterCopy: {
+          showName: undefined
+        },
+        SysPermCode: {
+          impl: new TableWidget(this.loadSysPermCodeData, this.loadSysPermCodeVerify, false, 'showOrder', 1),
+          totalCount: 0,
+          sortInfo: {
+            orderField: 'showOrder',
+            asc: 1
+          }
+        },
+        isInit: false
+      }
+    }
+  },
+  methods: {
+    getPermCodeType (permCodeType) {
+      switch (permCodeType) {
+        case this.SysPermCodeType.FORM: return 'primary';
+        case this.SysPermCodeType.FRAGMENT: return 'warning';
+        case this.SysPermCodeType.OPERATION: return 'success';
+        default: return 'info';
+      }
+    },
+    /**
+     * 权限资源数据获取函数，返回Primise
+     */
+    loadSysPermCodeData (params) {
+      return new Promise((resolve, reject) => {
+        SystemController.getPermCodeList(this, params).then(res => {
+          resolve({
+            dataList: treeDataTranslate(res.data, 'permCodeId'),
+            totalCount: res.data.totalCount
+          });
+        }).catch(e => {
+          reject(e);
+        });
+      });
+    },
+    /**
+     * 权限资源数据获取检测函数，返回true正常获取数据，返回false停止获取数据
+     */
+    loadSysPermCodeVerify () {
+      this.formPermCode.formFilterCopy.showName = this.formPermCode.formFilter.showName;
+      return true;
+    },
+    /**
+     * 权限资源当前页变化函数
+     */
+    onSysPermCodeCurrentPageChange (newPage) {
+      this.formPermCode.SysPermCode.impl.onCurrentPageChange(newPage);
+    },
+    /**
+     * 权限资源每页显示数量变化函数（跳转回第一页）
+     */
+    onSysPermCodePageSizeChange (newPage) {
+      this.formPermCode.SysPermCode.impl.onPageSizeChange(newPage);
+    },
+    /**
+     * 权限资源列排序变化函数
+     */
+    onSysPermCodeSortChange ({ column, prop, order }) {
+      this.formPermCode.SysPermCode.sortInfo.orderField = prop;
+      this.formPermCode.SysPermCode.sortInfo.asc = (order === 'ascending');
+      this.formPermCode.SysPermCode.impl.refreshTable();
+    },
+    /**
+     * 更新权限资源管理
+     */
+    refreshFormPermCode (reloadData = false) {
+      // 重新获取数据组件的数据
+      if (reloadData) {
+        this.formPermCode.SysPermCode.impl.refreshTable(true, 1);
+      } else {
+        this.formPermCode.SysPermCode.impl.refreshTable();
+      }
+      this.formPermCode.isInit = true;
+    },
+    /**
+     * 添加
+     */
+    onCreatePermCodeClick () {
+      let params = {
+        permCodeTree: this.formPermCode.SysPermCode.impl.dataList
+      };
+
+      this.$dialog.show('添加', formEditSysPermCode, {
+        area: ['800px', '583px']
+      }, params).then(res => {
+        this.refreshFormPermCode();
+      }).catch(e => {});
+    },
+    /**
+     * 编辑
+     */
+    onEditPermCodeClick (row) {
+      SystemController.viewPermCode(this, {
+        permCodeId: row.permCodeId
+      }).then(res => {
+        let params = {
+          permCodeTree: this.formPermCode.SysPermCode.impl.dataList,
+          permCodeType: row.permCodeType,
+          rowData: res.data
+        };
+        return this.$dialog.show('编辑', formEditSysPermCode, {
+          area: ['800px', '583px']
+        }, params).then(res => {
+          this.formPermCode.SysPermCode.impl.refreshTable();
+        }).catch(e => {});
+      }).then(res => {
+        this.loadPermCodeData().catch(e => {});
+      }).catch(e => {
+        //
+      });
+    },
+    /**
+     * 添加权限字
+     */
+    onAddChildPermCodeClick (row) {
+      let params = {
+        permCodeTree: this.formPermCode.SysPermCode.impl.dataList,
+        permCodeType: row.permCodeType + 1,
+        rowData: {
+          parentId: row.permCodeId
+        }
+      };
+
+      this.$dialog.show('添加权限字', formEditSysPermCode, {
+        area: ['800px', '583px']
+      }, params).then(res => {
+        this.formPermCode.SysPermCode.impl.refreshTable();
+      }).catch(e => {});
+    },
+    /**
+     * 删除
+     */
+    onDeleteClick (row) {
+      let params = {
+        permCodeId: row.permCodeId
+      };
+
+      this.$confirm('是否删除此权限字？').then(res => {
+        SystemController.deletePermCode(this, params).then(res => {
+          this.$message.success('删除成功');
+          this.formPermCode.SysPermCode.impl.refreshTable();
+        }).catch(e => {});
+      }).catch(e => {});
+    },
+    onResume () {
+      this.refreshFormPermCode();
+    },
+    initFormData () {
+    },
+    formInit () {
+      this.initFormData();
+      this.refreshFormPermCode();
+    }
+  },
+  computed: {
+    getPermCodeList () {
+      try {
+        if (Array.isArray(this.formPermCode.SysPermCode.impl.dataList)) {
+          let temp = this.formPermCode.SysPermCode.impl.dataList.filter((item) => {
+            if (this.formPermCode.formFilterCopy.showName == null || this.formPermCode.formFilterCopy.showName === '') return true;
+            return (item.showName.indexOf(this.formPermCode.formFilterCopy.showName) !== -1);
+          });
+          return temp;
+        }
+      } catch (e) {
+        console.log(e);
+      }
+      return [];
+    }
+  },
+  created () {
+    this.formInit();
+  }
+}
+</script>

orange-admin-web/src/views/upms/formSysRole/index.vue

@@ -0,0 +1,458 @@
+<template>
+  <div class="tab-dialog-box" style="position: relative;">
+    <el-tabs v-model="activeFragmentId" :before-leave="onFragmentChange">
+      <el-tab-pane label="角色管理" name="fragmentSysRole" style="width: 100%;"
+        v-if="checkPermCodeExist('formSysRole:fragmentSysRole')">
+        <el-scrollbar class="custom-scroll" :style="{height: getTabPaneHeight + 'px'}">
+          <el-form label-width="75px" size="mini" label-position="right" @submit.native.prevent>
+            <filter-box :item-width="350">
+              <el-form-item label="角色名称">
+                <el-input class="filter-item" v-model="fragmentSysRole.formFilter.sysRoleName"
+                  :clearable="true" placeholder="角色名称" />
+              </el-form-item>
+              <el-button slot="operator" type="primary" :plain="true" size="mini" @click="refreshFragmentSysRole(true)">查询</el-button>
+              <el-button slot="operator" type="primary" size="mini" :disabled="!checkPermCodeExist('formSysRole:fragmentSysRole:add')"
+                @click="onAddSysRoleClick()">
+                新建
+              </el-button>
+            </filter-box>
+          </el-form>
+          <el-row>
+            <el-col :span="24">
+              <el-table :data="fragmentSysRole.SysRole.impl.dataList" size="mini"
+                @sort-change="fragmentSysRole.SysRole.impl.onSortChange"
+                header-cell-class-name="table-header-gray">
+                <el-table-column label="序号" header-align="center" align="center" type="index" width="50px"
+                  :index="fragmentSysRole.SysRole.impl.getTableIndex" />
+                <el-table-column label="角色名称" prop="roleName">
+                </el-table-column>
+                <el-table-column label="创建人" prop="createUsername">
+                </el-table-column>
+                <el-table-column label="创建时间">
+                  <template slot-scope="scope">
+                    <span>{{formatDateByStatsType(scope.row.createTime, 'day')}}</span>
+                  </template>
+                </el-table-column>
+                <el-table-column label="操作" fixed="right" width="150px">
+                  <template slot-scope="scope">
+                  <el-button @click="onEditSysRoleClick(scope.row)" type="text" size="mini"
+                    :disabled="!checkPermCodeExist('formSysRole:fragmentSysRole:update')">
+                    编辑
+                  </el-button>
+                  <el-button @click="onDeleteClick(scope.row)" type="text" size="mini"
+                    :disabled="!checkPermCodeExist('formSysRole:fragmentSysRole:delete')">
+                    删除
+                  </el-button>
+                  </template>
+                </el-table-column>
+              </el-table>
+              <el-col :span="24">
+                <el-row type="flex" justify="end" style="margin-top: 10px;">
+                  <el-pagination
+                    :total="fragmentSysRole.SysRole.impl.totalCount"
+                    :current-page="fragmentSysRole.SysRole.impl.currentPage"
+                    :page-size="fragmentSysRole.SysRole.impl.pageSize"
+                    :page-sizes="[10, 20, 50, 100]"
+                    layout="total, prev, pager, next, sizes"
+                    @current-change="fragmentSysRole.SysRole.impl.onCurrentPageChange"
+                    @size-change="fragmentSysRole.SysRole.impl.onPageSizeChange">
+                  </el-pagination>
+                </el-row>
+              </el-col>
+            </el-col>
+          </el-row>
+        </el-scrollbar>
+      </el-tab-pane>
+      <el-tab-pane label="用户授权" name="fragmentSysRoleUser" style="width: 100%;"
+        v-if="checkPermCodeExist('formSysRole:fragmentSysRoleUser')">
+        <el-scrollbar class="custom-scroll" :style="{height: getTabPaneHeight + 'px'}">
+          <el-form label-width="75px" size="mini" label-position="right" @submit.native.prevent>
+            <filter-box :item-width="350">
+              <el-form-item label="用户角色">
+                <el-select class="filter-item" v-model="fragmentSysRoleUser.formFilter.sysRoleId" clearable
+                  placeholder="用户角色" :loading="fragmentSysRoleUser.sysRole.impl.loading"
+                  @visible-change="fragmentSysRoleUser.sysRole.impl.onVisibleChange"
+                  @change="onRoleChange">
+                  <el-option v-for="item in fragmentSysRoleUser.sysRole.impl.dropdownList" :key="item.roleId" :value="item.roleId" :label="item.roleName" />
+                </el-select>
+              </el-form-item>
+              <el-form-item label="用户名">
+                <el-input class="filter-item" v-model="fragmentSysRoleUser.formFilter.sysUserLoginName"
+                  :clearable="true" placeholder="输入用户名 / 昵称查询" @change="refreshFragmentSysRoleUser(true)" />
+              </el-form-item>
+              <el-button slot="operator" type="primary" :plain="true" size="mini" @click="refreshFragmentSysRoleUser(true)">
+                查询
+              </el-button>
+              <el-button slot="operator" type="primary" size="mini" @click="onAddRow()"
+                :disabled="!checkPermCodeExist('formSysRole:fragmentSysRoleUser:addUserRole') ||
+                fragmentSysRoleUser.formFilter.sysRoleId == null || fragmentSysRoleUser.formFilter.sysRoleId === ''">
+                添加用户
+              </el-button>
+            </filter-box>
+          </el-form>
+          <el-row>
+            <el-col :span="24">
+              <el-table :data="fragmentSysRoleUser.SysUser.impl.dataList" size="mini" @sort-change="fragmentSysRoleUser.SysUser.impl.onSortChange"
+                header-cell-class-name="table-header-gray">
+                <el-table-column label="序号" header-align="center" align="center" type="index" width="50px" :index="fragmentSysRoleUser.SysUser.impl.getTableIndex" />
+                <el-table-column label="用户名" prop="loginName">
+                </el-table-column>
+                <el-table-column label="昵称" prop="showName">
+                </el-table-column>
+                <el-table-column label="账号类型">
+                  <template slot-scope="scope">
+                    <span>{{SysUserType.getValue(scope.row.userType)}}</span>
+                  </template>
+                </el-table-column>
+                <el-table-column label="状态">
+                  <template slot-scope="scope">
+                    <el-tag :type="getUserStatusType(scope.row.userStatus)" size="mini">{{SysUserStatus.getValue(scope.row.userStatus)}}</el-tag>
+                  </template>
+                </el-table-column>
+                <el-table-column label="创建时间">
+                  <template slot-scope="scope">
+                    <span>{{formatDateByStatsType(scope.row.createTime, 'day')}}</span>
+                  </template>
+                </el-table-column>
+                <el-table-column label="操作" fixed="right" width="80px">
+                  <template slot-scope="scope">
+                    <el-button class="btn-table-delete" type="text" size="mini"
+                      :disabled="!checkPermCodeExist('formSysRole:fragmentSysRoleUser:deleteUserRole')"
+                      @click="onDeleteRow(scope.row)">移除</el-button>
+                  </template>
+                </el-table-column>
+              </el-table>
+              <el-col :span="24">
+                <el-row type="flex" justify="end" style="margin-top: 10px;">
+                  <el-pagination
+                    :total="fragmentSysRoleUser.SysUser.impl.totalCount"
+                    :current-page="fragmentSysRoleUser.SysUser.impl.currentPage"
+                    :page-size="fragmentSysRoleUser.SysUser.impl.pageSize"
+                    :page-sizes="[10, 20, 50, 100]"
+                    layout="total, prev, pager, next, sizes"
+                    @current-change="fragmentSysRoleUser.SysUser.impl.onCurrentPageChange"
+                    @size-change="fragmentSysRoleUser.SysUser.impl.onPageSizeChange">
+                  </el-pagination>
+                </el-row>
+              </el-col>
+            </el-col>
+          </el-row>
+        </el-scrollbar>
+      </el-tab-pane>
+    </el-tabs>
+  </div>
+</template>
+
+<script>
+import { mapGetters } from 'vuex';
+/* eslint-disable-next-line */
+import { DropdownWidget, TableWidget, UploadWidget, ChartWidget } from '@/utils/widget.js';
+/* eslint-disable-next-line */
+import { uploadMixin, statsDateRangeMixin, cachePageMixin, cachedPageChildMixin } from '@/core/mixins';
+/* eslint-disable-next-line */
+import { SystemController, DictionaryController } from '@/api';
+import formEditSysRole from '../formEditSysRole';
+import formSetRoleUsers from '@/views/upms/formSetRoleUsers';
+
+export default {
+  name: 'formSysRole',
+  props: {
+  },
+  mixins: [uploadMixin, statsDateRangeMixin, cachePageMixin],
+  data () {
+    return {
+      activeFragmentId: undefined,
+      fragmentSysRole: {
+        formFilter: {
+          sysRoleName: undefined
+        },
+        formFilterCopy: {
+          sysRoleName: undefined
+        },
+        SysRole: {
+          impl: new TableWidget(this.loadSysRoleData, this.loadSysRoleVerify, true, 'createTime', 1)
+        },
+        isInit: false
+      },
+      fragmentSysRoleUser: {
+        formFilter: {
+          sysRoleId: undefined,
+          sysUserLoginName: undefined
+        },
+        sysRole: {
+          impl: new DropdownWidget(this.loadSysRoleDropdownList)
+        },
+        SysUser: {
+          impl: new TableWidget(this.loadSysUserData, this.loadSysUserVerify, true, 'createTime', 1)
+        },
+        isInit: false
+      }
+    }
+  },
+  methods: {
+    /**
+     * 用户角色数据获取函数，返回Primise
+     */
+    loadSysRoleData (params) {
+      params.sysRoleFilter = {
+        roleName: this.fragmentSysRole.formFilterCopy.sysRoleName
+      }
+      return new Promise((resolve, reject) => {
+        SystemController.getRoleList(this, params).then(res => {
+          resolve({
+            dataList: res.data.dataList,
+            totalCount: res.data.totalCount
+          });
+        }).catch(e => {
+          reject(e);
+        });
+      });
+    },
+    /**
+     * 用户角色数据获取检测函数，返回true正常获取数据，返回false停止获取数据
+     */
+    loadSysRoleVerify () {
+      this.fragmentSysRole.formFilterCopy.sysRoleName = this.fragmentSysRole.formFilter.sysRoleName;
+      return true;
+    },
+    /**
+     * 更新角色列表
+     */
+    refreshFragmentSysRole (reloadData = false) {
+      // 重新获取数据组件的数据
+      if (reloadData) {
+        this.fragmentSysRole.SysRole.impl.refreshTable(true, 1);
+      } else {
+        this.fragmentSysRole.SysRole.impl.refreshTable();
+      }
+      this.fragmentSysRole.isInit = true;
+    },
+    /**
+     * 新建
+     */
+    onAddSysRoleClick () {
+      let params = {};
+
+      this.$dialog.show('新建', formEditSysRole, {
+        area: ['800px', '500px'],
+        offset: '100px'
+      }, params).then(res => {
+        this.refreshFragmentSysRole();
+      }).catch(e => {});
+    },
+    /**
+     * 编辑
+     */
+    onEditSysRoleClick (row) {
+      this.loadRowData(row).then(rowData => {
+        return this.$dialog.show('编辑角色', formEditSysRole, {
+          area: ['600px', '500px']
+        }, {
+          rowData
+        });
+      }).then(res => {
+        this.fragmentSysRole.SysRole.impl.refreshTable();
+      }).catch((e) => {});
+    },
+    /**
+     * 删除
+     */
+    onDeleteClick (row) {
+      let params = {
+        roleId: row.roleId
+      };
+
+      this.$confirm('是否删除此角色？').then(res => {
+        SystemController.deleteRole(this, params).then(res => {
+          this.$message.success('删除成功');
+          this.fragmentSysRole.SysRole.impl.refreshTable();
+        }).catch(e => {});
+      }).catch(e => {});
+    },
+    loadRowData (row) {
+      return new Promise((resolve, reject) => {
+        var params = {
+          roleId: row.roleId
+        }
+        SystemController.getRole(this, params).then(res => {
+          if (typeof res.data.permsJsonData === 'string') {
+            res.data.permsJsonData = JSON.parse(res.data.permsJsonData);
+          }
+          resolve(res.data);
+        }).catch(e => {
+          reject(e);
+        });
+      });
+    },
+    buildFragmentPermCodeMap () {
+      this.permCodeList = [
+        {
+          key: 'fragmentSysRole',
+          permCode: 'formSysRole:fragmentSysRole',
+          refresh: this.refreshFragmentSysRole
+        },
+        {
+          key: 'fragmentSysRoleUser',
+          permCode: 'formSysRole:fragmentSysRoleUser',
+          refresh: this.refreshFragmentSysRoleUser
+        }
+      ];
+    },
+    onFragmentChange (fragmentId) {
+      for (let i = 0; i < this.permCodeList.length; i++) {
+        if (this.permCodeList[i].key === fragmentId) {
+          this.activeFragmentId = fragmentId;
+          // if (this.permCodeList[i].refresh) this.permCodeList[i].refresh();
+          return true;
+        }
+      }
+      return false;
+    },
+    getActiveFragment () {
+      for (let i = 0; i < this.permCodeList.length; i++) {
+        if (this.permCodeList[i].key === this.activeFragmentId) {
+          return this.permCodeList[i];
+        }
+      }
+    },
+    /**
+     * 根据权限获取默认显示的fragment
+     */
+    getDefaultFragment () {
+      for (let i = 0; i < this.permCodeList.length; i++) {
+        if (this.checkPermCodeExist(this.permCodeList[i].permCode)) {
+          this.activeFragmentId = this.permCodeList[i].key;
+          return this.permCodeList[i];
+        }
+      }
+      return undefined;
+    },
+    onRoleChange (value) {
+      this.refreshFragmentSysRoleUser(true);
+    },
+    getUserStatusType (status) {
+      if (status === this.SysUserStatus.NORMAL) {
+        return 'success';
+      } else if (status === this.SysUserStatus.LOCKED) {
+        return 'danger';
+      } else {
+        return 'info';
+      }
+    },
+    onAddRow () {
+      if (this.fragmentSysRoleUser.formFilter.sysRoleId == null || this.fragmentSysRoleUser.formFilter.sysRoleId === '') {
+        this.$message.error('请选择角色');
+        return false;
+      }
+      this.$dialog.show('角色用户授权', formSetRoleUsers, {
+        area: ['1100px', '600px']
+      }, {
+        roleId: this.fragmentSysRoleUser.formFilter.sysRoleId
+      }).catch(e => {
+        this.refreshFragmentSysRoleUser(true);
+      });
+    },
+    onDeleteRow (row) {
+      this.$confirm('是否移除此用户?').then(res => {
+        let params = {
+          roleId: this.fragmentSysRoleUser.formFilter.sysRoleId,
+          userId: row.userId
+        }
+        return SystemController.deleteRoleUser(this, params);
+      }).then(res => {
+        this.$message.success('移除成功');
+        this.refreshFragmentSysRoleUser(true);
+      }).catch(e => {});
+    },
+    /**
+     * 用户管理数据获取函数，返回Primise
+     */
+    loadSysUserData (params) {
+      return new Promise((resolve, reject) => {
+        if (this.fragmentSysRoleUser.formFilter.sysRoleId == null || this.fragmentSysRoleUser.formFilter.sysRoleId === '') {
+          this.$message.error('请选择角色');
+          resolve({
+            dataList: [],
+            totalCount: 0
+          });
+          return;
+        }
+        params.roleId = this.fragmentSysRoleUser.formFilter.sysRoleId;
+        params.sysUserFilter = {
+          loginName: this.fragmentSysRoleUser.formFilter.sysUserLoginName
+        }
+        SystemController.listRoleUser(this, params).then(res => {
+          resolve({
+            dataList: res.data.dataList,
+            totalCount: res.data.totalCount
+          });
+        }).catch(e => {
+          reject(e);
+        });
+      });
+    },
+    /**
+     * 用户管理数据获取检测函数，返回true正常获取数据，返回false停止获取数据
+     */
+    loadSysUserVerify () {
+      if (this.fragmentSysRoleUser.formFilter.sysRoleId == null || this.fragmentSysRoleUser.formFilter.sysRoleId === '') {
+        this.$message.error('请选择角色');
+        return false;
+      }
+      return true;
+    },
+    /**
+     * 角色下拉数据获取函数
+     */
+    loadSysRoleDropdownList () {
+      return new Promise((resolve, reject) => {
+        let params = {};
+        SystemController.getRoleList(this, params).then(res => {
+          resolve(res.data.dataList);
+        }).catch(e => {
+          reject(e);
+        });
+      });
+    },
+    onRuleChange (value) {
+      this.refreshFragmentSysRoleUser(true);
+    },
+    /**
+     * 更新用户管理
+     */
+    refreshFragmentSysRoleUser (reloadData = false) {
+      // 重新获取数据组件的数据
+      if (reloadData) {
+        this.fragmentSysRoleUser.SysUser.impl.refreshTable(true, 1);
+      } else {
+        this.fragmentSysRoleUser.SysUser.impl.refreshTable();
+      }
+      this.fragmentSysRoleUser.sysRole.impl.onVisibleChange(true).catch(e => {});
+      this.fragmentSysRoleUser.isInit = true;
+    },
+    onResume () {
+      this.refreshFragmentSysRole();
+    },
+    initFormData () {
+    },
+    formInit () {
+      this.buildFragmentPermCodeMap();
+      let defaultFragment = this.getDefaultFragment();
+      if (defaultFragment == null) {
+        this.$message.error('您没有访问这个页面的权限，请与系统管理员联系！');
+      } else {
+        if (defaultFragment.refresh) defaultFragment.refresh();
+      }
+    }
+  },
+  computed: {
+    getTabPaneHeight () {
+      return (this.getClientHeight - 192);
+    },
+    ...mapGetters(['getClientHeight'])
+  },
+  created () {
+    this.formInit();
+  }
+}
+</script>

orange-admin-web/src/views/upms/formSysRoleUser/index.vue

@@ -0,0 +1,224 @@
+<template>
+  <div>
+    <el-form label-width="75px" size="mini" label-position="right" @submit.native.prevent>
+      <filter-box :item-width="350">
+        <el-form-item label="用户角色">
+          <el-select class="filter-item" v-model="formSysUser.formFilter.sysRoleId" clearable
+            placeholder="用户角色" :loading="formSysUser.sysRole.impl.loading"
+            @visible-change="formSysUser.sysRole.impl.onVisibleChange"
+            @change="onRoleChange">
+            <el-option v-for="item in formSysUser.sysRole.impl.dropdownList" :key="item.roleId" :value="item.roleId" :label="item.roleName" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="用户名">
+          <el-input class="filter-item" v-model="formSysUser.formFilter.sysUserLoginName"
+            :clearable="true" placeholder="输入用户名 / 昵称查询" @change="refreshFormSysUser(true)" />
+        </el-form-item>
+        <el-button slot="operator" type="primary" :plain="true" size="mini" @click="refreshFormSysUser(true)">
+          查询
+        </el-button>
+        <el-button slot="operator" type="primary" size="mini" @click="onAddRow()"
+          :disabled="!checkPermCodeExist('sysRoleUserManagement:addUserRole') || formSysUser.formFilter.sysRoleId == null || formSysUser.formFilter.sysRoleId === ''">
+          添加人员
+        </el-button>
+      </filter-box>
+    </el-form>
+    <el-row>
+      <el-col :span="24">
+        <el-table :data="formSysUser.SysUser.impl.dataList" size="mini" @sort-change="formSysUser.SysUser.impl.onSortChange"
+          header-cell-class-name="table-header-gray">
+          <el-table-column label="序号" header-align="center" align="center" type="index" width="50px" :index="formSysUser.SysUser.impl.getTableIndex" />
+          <el-table-column label="用户名" prop="loginName">
+          </el-table-column>
+          <el-table-column label="昵称" prop="showName">
+          </el-table-column>
+          <el-table-column label="账号类型">
+            <template slot-scope="scope">
+              <span>{{SysUserType.getValue(scope.row.userType)}}</span>
+            </template>
+          </el-table-column>
+          <el-table-column label="状态">
+            <template slot-scope="scope">
+              <el-tag :type="getUserStatusType(scope.row.userStatus)" size="mini">{{SysUserStatus.getValue(scope.row.userStatus)}}</el-tag>
+            </template>
+          </el-table-column>
+          <el-table-column label="创建时间">
+            <template slot-scope="scope">
+              <span>{{formatDateByStatsType(scope.row.createTime, 'day')}}</span>
+            </template>
+          </el-table-column>
+          <el-table-column label="操作" fixed="right" width="80px">
+            <template slot-scope="scope">
+              <el-button class="btn-table-delete" type="text" size="mini"
+                :disabled="!checkPermCodeExist('sysRoleUserManagement:deleteUserRole')" @click="onDeleteRow(scope.row)">移除</el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+        <el-col :span="24">
+          <el-row type="flex" justify="end" style="margin-top: 10px;">
+            <el-pagination
+              :total="formSysUser.SysUser.impl.totalCount"
+              :current-page="formSysUser.SysUser.impl.currentPage"
+              :page-size="formSysUser.SysUser.impl.pageSize"
+              :page-sizes="[10, 20, 50, 100]"
+              layout="total, prev, pager, next, sizes"
+              @current-change="formSysUser.SysUser.impl.onCurrentPageChange"
+              @size-change="formSysUser.SysUser.impl.onPageSizeChange">
+            </el-pagination>
+          </el-row>
+        </el-col>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+/* eslint-disable-next-line */
+import { DropdownWidget, TableWidget, UploadWidget, ChartWidget } from '@/utils/widget.js';
+/* eslint-disable-next-line */
+import { uploadMixin, statsDateRangeMixin, cachePageMixin, cachedPageChildMixin } from '@/core/mixins';
+/* eslint-disable-next-line */
+import { SystemController, DictionaryController } from '@/api';
+import formSetRoleUsers from '@/views/upms/formSetRoleUsers';
+
+export default {
+  name: 'sysRoleUserManagement',
+  props: {
+  },
+  mixins: [uploadMixin, statsDateRangeMixin, cachePageMixin],
+  data () {
+    return {
+      formSysUser: {
+        formFilter: {
+          sysRoleId: undefined,
+          sysUserLoginName: undefined
+        },
+        sysRole: {
+          impl: new DropdownWidget(this.loadSysRoleDropdownList)
+        },
+        SysUser: {
+          impl: new TableWidget(this.loadSysUserData, this.loadSysUserVerify, true, 'createTime', 1)
+        },
+        isInit: false
+      }
+    }
+  },
+  methods: {
+    onRoleChange (value) {
+      this.refreshFormSysUser(true);
+    },
+    getUserStatusType (status) {
+      if (status === this.SysUserStatus.NORMAL) {
+        return 'success';
+      } else if (status === this.SysUserStatus.LOCKED) {
+        return 'danger';
+      } else {
+        return 'info';
+      }
+    },
+    onAddRow () {
+      if (this.formSysUser.formFilter.sysRoleId == null || this.formSysUser.formFilter.sysRoleId === '') {
+        this.$message.error('请选择角色');
+        return false;
+      }
+      this.$dialog.show('角色用户授权', formSetRoleUsers, {
+        area: '1100px',
+        offset: '50px'
+      }, {
+        roleId: this.formSysUser.formFilter.sysRoleId
+      }).catch(e => {
+        this.refreshFormSysUser(true);
+      });
+    },
+    onDeleteRow (row) {
+      this.$confirm('是否移除此用户?').then(res => {
+        let params = {
+          roleId: this.formSysUser.formFilter.sysRoleId,
+          userId: row.userId
+        }
+        return SystemController.deleteRoleUser(this, params);
+      }).then(res => {
+        this.$message.success('移除成功');
+        this.refreshFormSysUser(true);
+      }).catch(e => {});
+    },
+    /**
+     * 用户列表数据获取函数，返回Primise
+     */
+    loadSysUserData (params) {
+      return new Promise((resolve, reject) => {
+        if (this.formSysUser.formFilter.sysRoleId == null || this.formSysUser.formFilter.sysRoleId === '') {
+          this.$message.error('请选择角色');
+          resolve({
+            dataList: [],
+            totalCount: 0
+          });
+          return;
+        }
+        params.roleId = this.formSysUser.formFilter.sysRoleId;
+        params.sysUserFilter = {
+          loginName: this.formSysUser.formFilter.sysUserLoginName
+        }
+        SystemController.listRoleUser(this, params).then(res => {
+          resolve({
+            dataList: res.data.dataList,
+            totalCount: res.data.totalCount
+          });
+        }).catch(e => {
+          reject(e);
+        });
+      });
+    },
+    /**
+     * 用户列表数据获取检测函数，返回true正常获取数据，返回false停止获取数据
+     */
+    loadSysUserVerify () {
+      if (this.formSysUser.formFilter.sysRoleId == null || this.formSysUser.formFilter.sysRoleId === '') {
+        this.$message.error('请选择角色');
+        return false;
+      }
+      return true;
+    },
+    /**
+     * 角色下拉数据获取函数
+     */
+    loadSysRoleDropdownList () {
+      return new Promise((resolve, reject) => {
+        let params = {};
+        SystemController.getRoleList(this, params).then(res => {
+          resolve(res.data.dataList);
+        }).catch(e => {
+          reject(e);
+        });
+      });
+    },
+    onRuleChange (value) {
+      this.refreshFormSysUser(true);
+    },
+    /**
+     * 更新用户列表
+     */
+    refreshFormSysUser (reloadData = false) {
+      // 重新获取数据组件的数据
+      if (reloadData) {
+        this.formSysUser.SysUser.impl.refreshTable(true, 1);
+      } else {
+        this.formSysUser.SysUser.impl.refreshTable();
+      }
+      this.formSysUser.sysRole.impl.onVisibleChange(true).catch(e => {});
+      this.formSysUser.isInit = true;
+    },
+    onResume () {
+      this.refreshFormSysUser();
+    },
+    initFormData () {
+    },
+    formInit () {
+      this.initFormData();
+    }
+  },
+  created () {
+    this.formInit();
+  }
+}
+</script>

orange-admin-web/src/views/upms/formSysUser/index.vue

@@ -0,0 +1,253 @@
+<template>
+  <div>
+    <el-form label-width="75px" size="mini" label-position="right" @submit.native.prevent>
+      <filter-box :item-width="350">
+        <el-form-item label="用户状态">
+          <el-select class="filter-item" v-model="formSysUser.formFilter.sysUserStatus" :clearable="true"
+            placeholder="用户状态" :loading="formSysUser.sysUserStatus.impl.loading"
+            @visible-change="formSysUser.sysUserStatus.impl.onVisibleChange"
+            @change="onSysUserStatusValueChange">
+            <el-option v-for="item in formSysUser.sysUserStatus.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="登录名称">
+          <el-input class="filter-item" v-model="formSysUser.formFilter.sysUserLoginName"
+            :clearable="true" placeholder="登录名称" />
+        </el-form-item>
+        <el-button slot="operator" type="primary" :plain="true" size="mini" @click="refreshFormSysUser(true)">查询</el-button>
+        <el-button slot="operator" type="primary" size="mini" :disabled="!checkPermCodeExist('formSysUser:fragmentSysUser:add')"
+          @click="onAddRow()">
+          新建
+        </el-button>
+      </filter-box>
+    </el-form>
+    <el-row>
+      <el-col :span="24">
+        <el-table :data="formSysUser.SysUser.impl.dataList" size="mini" @sort-change="formSysUser.SysUser.impl.onSortChange"
+          header-cell-class-name="table-header-gray">
+          <el-table-column label="序号" header-align="center" align="center" type="index" width="50px" :index="formSysUser.SysUser.impl.getTableIndex" />
+          <el-table-column label="用户名" prop="loginName" sortable="custom">
+          </el-table-column>
+          <el-table-column label="昵称" prop="showName">
+          </el-table-column>
+          <el-table-column label="账号类型" prop="userTypeDictMap.name" />
+          <el-table-column label="状态">
+            <template slot-scope="scope">
+              <el-tag :type="getUserStatusType(scope.row.userStatus)" size="mini">{{SysUserStatus.getValue(scope.row.userStatus)}}</el-tag>
+            </template>
+          </el-table-column>
+          <el-table-column label="创建时间">
+            <template slot-scope="scope">
+              <span>{{formatDateByStatsType(scope.row.createTime, 'day')}}</span>
+            </template>
+          </el-table-column>
+          <el-table-column label="操作" fixed="right" width="150">
+            <template slot-scope="scope">
+              <el-button class="btn-table-edit" type="text" size="mini" @click="onEditRow(scope.row)" :disabled="isAdmin(scope.row) || !checkPermCodeExist('formSysUser:fragmentSysUser:update')" >编辑</el-button>
+              <el-button class="btn-table-delete" type="text" size="mini" @click="onDeleteRow(scope.row)" :disabled="isAdmin(scope.row) || !checkPermCodeExist('formSysUser:fragmentSysUser:delete')">删除</el-button>
+              <el-button class="btn-table-delete" type="text" size="mini" :disabled="!checkPermCodeExist('formSysUser:fragmentSysUser:resetPassword')" @click="onResetPassword(scope.row)">重置密码</el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+        <el-col :span="24">
+          <el-row type="flex" justify="end" style="margin-top: 10px;">
+            <el-pagination
+              :total="formSysUser.SysUser.impl.totalCount"
+              :current-page="formSysUser.SysUser.impl.currentPage"
+              :page-size="formSysUser.SysUser.impl.pageSize"
+              :page-sizes="[10, 20, 50, 100]"
+              layout="total, prev, pager, next, sizes"
+              @current-change="formSysUser.SysUser.impl.onCurrentPageChange"
+              @size-change="formSysUser.SysUser.impl.onPageSizeChange">
+            </el-pagination>
+          </el-row>
+        </el-col>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+/* eslint-disable-next-line */
+import { DropdownWidget, TableWidget, UploadWidget, ChartWidget } from '@/utils/widget.js';
+/* eslint-disable-next-line */
+import { uploadMixin, statsDateRangeMixin, cachePageMixin, cachedPageChildMixin } from '@/core/mixins';
+/* eslint-disable-next-line */
+import { SystemController, DictionaryController } from '@/api';
+import editUser from '@/views/upms/formEditSysUser';
+
+export default {
+  name: 'formSysUser',
+  props: {
+  },
+  mixins: [uploadMixin, statsDateRangeMixin, cachePageMixin],
+  data () {
+    return {
+      formSysUser: {
+        formFilter: {
+          sysUserStatus: undefined,
+          sysUserLoginName: undefined
+        },
+        formFilterCopy: {
+          sysUserStatus: undefined,
+          sysUserLoginName: undefined
+        },
+        sysUserStatus: {
+          impl: new DropdownWidget(this.loadSysUserStatusDropdownList)
+        },
+        SysUser: {
+          impl: new TableWidget(this.loadSysUserData, this.loadSysUserVerify, true, 'createTime', 1)
+        },
+        isInit: false
+      }
+    }
+  },
+  methods: {
+    isAdmin (row) {
+      return (row.userType === this.SysUserType.ADMIN);
+    },
+    getUserStatusType (status) {
+      if (status === this.SysUserStatus.NORMAL) {
+        return 'success';
+      } else if (status === this.SysUserStatus.LOCKED) {
+        return 'danger';
+      } else {
+        return 'info';
+      }
+    },
+    onAddRow () {
+      this.$dialog.show('新建用户', editUser, {
+        area: '600px'
+      }).then((res) => {
+        this.refreshFormSysUser();
+      }).catch(() => {
+      });
+    },
+    onEditRow (row) {
+      this.loadRowData(row).then(rowData => {
+        this.$dialog.show('编辑用户', editUser, {
+          area: '600px'
+        }, {
+          rowData: rowData
+        }).then((res) => {
+          this.refreshFormSysUser();
+        }).catch(e => {
+        });
+      }).catch(e => {
+        //
+      });
+    },
+    onDeleteRow (row) {
+      let params = {
+        userId: row.userId
+      }
+      this.$confirm('是否删除用户？').then(res => {
+        return SystemController.deleteUser(this, params);
+      }).then(res => {
+        this.$message.success('删除成功');
+        this.refreshFormSysUser(true);
+      }).catch(e => {
+        //
+      });
+    },
+    onResetPassword (row) {
+      this.$confirm('是否重置用户密码？').then(res => {
+        return SystemController.resetUserPassword(this, {userId: row.userId});
+      }).then(res => {
+        this.$message.success('重置密码成功');
+      }).catch(e => {
+        //
+      });
+    },
+    /**
+     * 用户管理数据获取函数，返回Primise
+     */
+    loadSysUserData (params) {
+      params.sysUserFilter = {
+        loginName: this.formSysUser.formFilterCopy.sysUserLoginName,
+        userStatus: this.formSysUser.formFilterCopy.sysUserStatus
+      }
+      return new Promise((resolve, reject) => {
+        SystemController.getUserList(this, params).then(res => {
+          resolve({
+            dataList: res.data.dataList,
+            totalCount: res.data.totalCount
+          });
+        }).catch(e => {
+          reject(e);
+        });
+      });
+    },
+    /**
+     * 用户管理数据获取检测函数，返回true正常获取数据，返回false停止获取数据
+     */
+    loadSysUserVerify () {
+      this.formSysUser.formFilterCopy.sysUserLoginName = this.formSysUser.formFilter.sysUserLoginName;
+      this.formSysUser.formFilterCopy.sysUserStatus = this.formSysUser.formFilter.sysUserStatus;
+      return true;
+    },
+    /**
+     * 用户状态下拉数据获取函数
+     */
+    loadSysUserStatusDropdownList () {
+      return new Promise((resolve, reject) => {
+        let params = {};
+        DictionaryController.dictSysUserStatus(this, params).then(res => {
+          resolve(res.getList());
+        }).catch(e => {
+          reject(e);
+        });
+      });
+    },
+    /**
+     * 用户状态下拉框显隐
+     */
+    onSysUserStatusVisibleChange (show) {
+      this.formSysUser.sysUserStatus.impl.onVisibleChange(show).catch(e => {});
+    },
+    /**
+     * 用户状态选中值改变
+     */
+    onSysUserStatusValueChange (value) {
+    },
+    /**
+     * 更新用户管理
+     */
+    refreshFormSysUser (reloadData = false) {
+      // 重新获取数据组件的数据
+      if (reloadData) {
+        this.formSysUser.SysUser.impl.refreshTable(true, 1);
+      } else {
+        this.formSysUser.SysUser.impl.refreshTable();
+      }
+      this.formSysUser.sysUserStatus.impl.onVisibleChange(true).catch(e => {});
+      this.formSysUser.isInit = true;
+    },
+    loadRowData (row) {
+      return new Promise((resolve, reject) => {
+        var params = {
+          userId: row.userId
+        }
+        
+        SystemController.getUser(this, params).then(res => {
+          resolve(res.data);
+        }).catch(e => {
+          reject(e);
+        });
+      });
+    },
+    onResume () {
+      this.refreshFormSysUser();
+    },
+    initFormData () {
+    },
+    formInit () {
+      this.initFormData();
+      this.refreshFormSysUser();
+    }
+  },
+  created () {
+    this.formInit();
+  }
+}
+</script>

orange-admin-web/src/views/welcome/index.vue

@@ -0,0 +1,151 @@
+<template>
+  <div>
+    <div class="title">
+      <p>浏览完每个功能过后，自然会发现些与众不同。然而这一切都是<span> 橙单 </span>生成的。</p>
+    </div>
+    <el-row type="flex">
+      <div style="width: 100%;">
+        <el-card class="box-card" shadow="never" :body-style="{padding: '0px 20px'}">
+          <el-collapse v-model="currentItem">
+            <el-collapse-item title="选择我们的 5 个理由" name="1">
+              <ul class="item-list">
+                <li>是真正的生成器，而非脚手架。</li>
+                <li>技术选型、包名、作者署名都由您钦定。</li>
+                <li>手把手教的操作指南。</li>
+                <li>详尽、完善、免费、护眼的开发文档。</li>
+                <li>合理、低价的商业授权。</li>
+              </ul>
+            </el-collapse-item>
+            <el-collapse-item title="我们的技术选型" name="2">
+              <ul class="item-list">
+                <li>Element (Vue) / Ant Design (React) / ECharts / AntV / Axios / Webpack</li>
+                <li>Spring Boot / Spring Cloud / Spring Cloud Alibaba + Mybatis + Jwt</li>
+                <li>Hutool + Guava + Caffeine + Lombok + MapStruct + 通用 mapper</li>
+                <li>Redis + ZooKeeper + Apollo + XXL-Job + Kafka + Seata</li>
+                <li>ELK + PinPoint / SkyWalking + Grafana + Prometheus</li>
+              </ul>
+            </el-collapse-item>
+            <el-collapse-item title="可快速上手的高质量代码" name="3">
+              <ul class="item-list">
+                <li>无任何二次封装，只生成您最懂的代码。</li>
+                <li>遵循阿里巴巴标准的代码规范。</li>
+                <li>主流技术栈恣意组合，对面试大有裨益。</li>
+                <li>产品级代码强度，层次清晰、滴水不漏。</li>
+                <li>15年架构师优化的每一处细节。</li>
+              </ul>
+            </el-collapse-item>
+            <el-collapse-item title="设计理念和未来目标" name="4">
+              <ul class="item-list">
+                <li>前沿的单表组合式设计，使系统拆分SO EASY。</li>
+                <li>先代码，后SQL的原则，让服务扩充更具弹性。</li>
+                <li>全面、实用的日志跟踪和服务监控体系。</li>
+                <li>未来将演化为云原生架构，支持更多开发语言。</li>
+                <li>不会让数据中台成为我们的空白。</li>
+              </ul>
+            </el-collapse-item>
+          </el-collapse>
+        </el-card>
+      </div>
+      <el-card class="box-card" style="min-width: 450px; margin-left: 20px;" shadow="never" :body-style="{padding: '0px 20px'}">
+        <div class="item">
+          <span style="width: 120px;">产品名称</span>
+          <el-tag effect="dark">橙单代码生成器</el-tag>
+        </div>
+        <el-divider></el-divider>
+        <div class="item">
+          <span style="width: 120px;">网站首页</span>
+          <a href="http://101.200.178.51/" target="_blank">http://101.200.178.51/</a>
+        </div>
+        <el-divider></el-divider>
+        <div class="item">
+          <span style="width: 120px;">操作指南</span>
+          <a href="http://101.200.178.51/orange-doc/" target="_blank">http://101.200.178.51/orange-doc/</a>
+        </div>
+        <el-divider></el-divider>
+        <div class="item">
+          <span style="width: 120px;">开发文档</span>
+          <a href="http://101.200.178.51/development-doc/" target="_blank">http://101.200.178.51/development-doc/</a>
+        </div>
+        <el-divider></el-divider>
+        <div class="item">
+          <span style="width: 120px;">开源代码</span>
+          <a href="https://www.baidu.com" target="_blank">橙单代码生成器</a>
+        </div>
+        <el-divider></el-divider>
+        <div class="item">
+          <span style="width: 120px;">联系方式</span>
+          <span>
+            QQ群
+            <a target="_blank" style="margin-left: 5px;"
+            href="//shang.qq.com/wpa/qunwpa?idkey=590857a1b4c587e2be3d66b9a7e2015109772e777c6451c897dee393489b1661">
+            788581363
+            </a>
+          </span>
+        </div>
+        <el-divider></el-divider>
+        <div style="width: 100%; text-align: center; padding: 10px;">
+          <img src="../../assets/img/orange-group1.png" />
+        </div>
+      </el-card>
+    </el-row>
+  </div>
+</template>
+
+<script>
+export default {
+  data () {
+    return {
+      currentItem: ['1', '2', '3', '4']
+    }
+  }
+}
+</script>
+
+<style scoped>
+  >>> .el-collapse {
+    border: none;
+  }
+
+  >>> .el-divider--horizontal {
+    margin: 0px;
+  }
+  >>> .el-tag {
+    padding: 0px 30px;
+  }
+</style>
+
+<style lang="scss" scoped>
+  @import '../../assets/style/element-color.scss';
+  .title {
+    border: 1px solid #EDEDED;
+    border-left-width: 5px;
+    border-left-color: $--color-primary;
+    margin-bottom: 20px;
+  }
+
+  .title p {
+    height: 40px;
+    line-height: 40px;
+    font-size: 16px;
+    margin: 0px;
+    padding-left: 20px;
+  }
+
+  .title p span {
+    font-size: 20px;
+    color: $--color-primary;
+  }
+
+  .item-list {
+    margin: 0px;
+  }
+  .item-list li {
+    margin: 10px 0px;
+  }
+
+  .item {
+    height: 48px;
+    display: flex;
+    align-items: center;
+  }
+</style>