1

src/components/common/Sidebar.vue

@@ -51,26 +51,6 @@ export default {
           index: 'homeIndex',
           title: '系统首页',
         },
-        {
-          icon: 'el-icon-s-home',
-          index: 'gly',
-          title: '管理员管理',
-        },
-        {
-          icon: 'el-icon-s-home',
-          index: 'jg',
-          title: '机构管理员',
-        },
-        {
-          icon: 'el-icon-s-home',
-          index: 'yw',
-          title: '业务管理员',
-        },
-        {
-          icon: 'el-icon-s-home',
-          index: 'user',
-          title: '用户管理',
-        },
       ],
     };
   },
@@ -94,7 +74,38 @@ export default {
       let user = this.user;
       // 复制列表
       let list = _.cloneDeep(this.items);
-      let data = [];
+      let data = [
+        {
+          icon: 'el-icon-s-home',
+          index: 'menu',
+          title: '菜单管理',
+        },
+        {
+          icon: 'el-icon-s-home',
+          index: 'gly',
+          title: '管理员管理',
+        },
+        {
+          icon: 'el-icon-s-home',
+          index: 'jg',
+          title: '机构管理员',
+        },
+        {
+          icon: 'el-icon-s-home',
+          index: 'yw',
+          title: '业务管理员',
+        },
+        {
+          icon: 'el-icon-s-home',
+          index: 'qx',
+          title: '权限管理',
+        },
+        {
+          icon: 'el-icon-s-home',
+          index: 'user',
+          title: '用户管理',
+        },
+      ];
       list.push(...data);
       this.$set(this, `items`, _.uniqBy(list, 'index'));
     },

src/router/index.js

@@ -20,6 +20,12 @@ export default new Router({
           component: () => import('../views/homeIndex.vue'),
           meta: { title: '系统首页' },
         },
+        // 菜单管理
+        {
+          path: '/menu',
+          component: () => import('../views/menu/index.vue'),
+          meta: { title: '菜单管理' },
+        },
         // 管理员
         {
           path: '/gly',
@@ -53,6 +59,12 @@ export default new Router({
           component: () => import('../views/yw/detail.vue'),
           meta: { title: '业务管理员信息管理' },
         },
+        // 权限管理
+        {
+          path: '/qx',
+          component: () => import('../views/qx/index.vue'),
+          meta: { title: '权限管理' },
+        },
         // 用户管理
         {
           path: '/user',

src/util/iconmenu.js

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

src/views/menu/index.vue

@@ -0,0 +1,118 @@
+<template>
+  <div id="index">
+    <el-row>
+      <el-col :span="24" class="main">
+        <el-col :span="24" class="add">
+          <el-button type="primary" size="mini" @click="dialog = true">添加</el-button>
+        </el-col>
+        <el-col :span="24" class="list">
+          <data-table :fields="fields" :opera="opera" :data="list" :total="total" @query="search" @edit="toEdit" @delete="toDelete"></data-table>
+        </el-col>
+      </el-col>
+    </el-row>
+    <el-dialog title="菜单信息管理" width="40%" :visible.sync="dialog" @closed="handleClose" :destroy-on-close="true">
+      <data-form :data="form" :fields="fields" :rules="rules" @save="toSave">
+        <template #custom="{item, form}">
+          <template v-if="item.model === 'sort'">
+            <el-input-number v-model="form.sort" controls-position="right" :min="1" :max="20"></el-input-number>
+            <el-col :span="24"><el-link type="danger">数值越小，菜单等级越高！</el-link></el-col>
+          </template>
+        </template>
+        <template #options="{item}">
+          <template v-if="item.model === 'icon'">
+            <!-- <el-option v-for="(i, index) in iconList" :key="index" :label="i.name" :value="i.iconIndex"></el-option> -->
+            <el-option v-for="(i, index) in iconList" :key="index" :label="i.name" :value="i.iconkey">
+              <span style="float: left">{{ i.name }}</span>
+              <span style="float: right; color: #8492a6; font-size: 13px"><i :class="i.iconkey"></i></span>
+            </el-option>
+          </template>
+        </template>
+      </data-form>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import dataTable from '@common/src/components/frame/filter-page-table.vue';
+import dataForm from '@common/src/components/frame/form.vue';
+import { iconmenu } from '@common/src/util/iconmenu';
+import { mapState, createNamespacedHelpers } from 'vuex';
+export default {
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+  name: 'index',
+  props: {},
+  components: {
+    dataTable,
+    dataForm,
+  },
+  data: function() {
+    return {
+      opera: [
+        {
+          label: '编辑',
+          method: 'edit',
+        },
+        {
+          label: '删除',
+          method: 'delete',
+        },
+      ],
+      fields: [
+        { label: '名称', prop: 'title', model: 'title' },
+        { label: '路由', prop: 'index', model: 'index' },
+        { label: '菜单等级', prop: 'sort', model: 'sort', custom: true },
+        { label: '菜单图标', prop: 'icon', model: 'icon', type: 'select' },
+      ],
+      list: [],
+      total: 0,
+      dialog: false,
+      form: {},
+      rules: {},
+      // 图标列表
+      iconList: iconmenu,
+    };
+  },
+  async created() {
+    await this.search();
+  },
+  methods: {
+    // 查询列表
+    search({ skip = 0, limit = 10, ...info } = {}) {
+      console.log('列表');
+    },
+    // 提交
+    toSave({ data }) {
+      console.log(data);
+    },
+    // 修改
+    toEdit({ data }) {
+      console.log('修改');
+    },
+    // 删除
+    toDelete({ data }) {
+      console.log('删除');
+    },
+    // 取消添加
+    handleClose() {
+      this.form = {};
+      this.dialog = false;
+      this.search();
+    },
+  },
+  computed: {
+    ...mapState(['user']),
+  },
+  watch: {},
+};
+</script>
+
+<style lang="less" scoped>
+.main {
+  .add {
+    text-align: right;
+    margin: 0 0 10px 0;
+  }
+}
+</style>

src/views/qx/index.vue

@@ -0,0 +1,139 @@
+<template>
+  <div id="index">
+    <el-row>
+      <el-col :span="24" class="main">
+        <data-table :fields="fields" :opera="opera" :data="list" :total="total" @query="search" @edit="toEdit"></data-table>
+      </el-col>
+    </el-row>
+    <el-dialog title="菜单信息管理" width="40%" :visible.sync="dialog" @closed="handleClose" :destroy-on-close="true">
+      <data-form :data="form" :fields="formfields" :rules="rules" @save="toSave">
+        <template #custom="{item}">
+          <template v-if="item.model == 'menus'">
+            <el-checkbox-group v-model="menus">
+              <el-checkbox v-for="(i, index) in menuList" :key="index" :label="i">{{ i.title }}</el-checkbox>
+            </el-checkbox-group>
+          </template>
+        </template>
+      </data-form>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import dataTable from '@common/src/components/frame/filter-page-table.vue';
+import dataForm from '@common/src/components/frame/form.vue';
+import { iconmenu } from '@common/src/util/iconmenu';
+import { mapState, createNamespacedHelpers } from 'vuex';
+export default {
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+  name: 'index',
+  props: {},
+  components: {
+    dataTable,
+    dataForm,
+  },
+  data: function() {
+    return {
+      opera: [
+        {
+          label: '分配权限',
+          method: 'edit',
+        },
+      ],
+      fields: [
+        { label: '用户名', prop: 'name' },
+        { label: '机构名称', prop: 'deptname' },
+      ],
+      list: [
+        {
+          name: '年',
+        },
+      ],
+      total: 0,
+      // 分配权限
+      dialog: false,
+      formfields: [
+        { label: '用户名', model: 'name' },
+        { label: '机构名称', model: 'deptname' },
+        { label: '权限', model: 'menus', custom: true },
+      ],
+      form: {},
+      rules: {},
+      // 菜单列表
+      menuList: [
+        {
+          icon: 'el-icon-s-home',
+          index: 'menu',
+          title: '菜单管理',
+        },
+        {
+          icon: 'el-icon-s-home',
+          index: 'gly',
+          title: '管理员管理',
+        },
+        {
+          icon: 'el-icon-s-home',
+          index: 'jg',
+          title: '机构管理员',
+        },
+        {
+          icon: 'el-icon-s-home',
+          index: 'yw',
+          title: '业务管理员',
+        },
+        {
+          icon: 'el-icon-s-home',
+          index: 'qx',
+          title: '权限管理',
+        },
+        {
+          icon: 'el-icon-s-home',
+          index: 'user',
+          title: '用户管理',
+        },
+      ],
+      menus: [],
+    };
+  },
+  async created() {
+    await this.search();
+  },
+  methods: {
+    // 查询列表
+    search({ skip = 0, limit = 10, ...info } = {}) {
+      console.log('列表');
+    },
+    // 分配权限
+    toEdit({ data }) {
+      this.dialog = true;
+      console.log('分配权限');
+    },
+    // 提交分配
+    toSave({ data }) {
+      data.menus = this.menus;
+      console.log(data);
+    },
+    // 取消添加
+    handleClose() {
+      this.form = {};
+      this.dialog = false;
+      this.search();
+    },
+  },
+  computed: {
+    ...mapState(['user']),
+  },
+  watch: {},
+};
+</script>
+
+<style lang="less" scoped>
+.main {
+  .add {
+    text-align: right;
+    margin: 0 0 10px 0;
+  }
+}
+</style>