lrf402788946 5 jaren geleden
bovenliggende
commit
46ce14caf0

+ 1 - 1
src/components/form.md

@@ -41,7 +41,7 @@
 |:-:|:-:|
 |options|fields中type为select的,选项都写在这个插槽中,多个select则需要区分options所属问题|
 |radios|fields中type为radio的,选项都写在这个插槽中,多个radio则需要区分radios所属问题|
-|checkbox|fields中type为checkbox的,选项都写在这个插槽中,多个checkbox则需要区分checkboxs所属问题|
+|checkboxs|fields中type为checkbox的,选项都写在这个插槽中,多个checkbox则需要区分checkboxs所属问题|
 |custom|自定义插槽,完全自己去写|
 |submit|提交按钮部分,当needSave为false时才可以使用|
 >>关于自定义的用法:

+ 55 - 55
src/components/form.vue

@@ -16,61 +16,61 @@
           <el-form-item v-if="display(item)" :key="'form-field-' + index" :label="getField('label', item)" :prop="item.model" :required="item.required">
             <template v-if="!item.custom">
               <template v-if="item.type !== 'text'">
-                <el-tooltip class="item" effect="dark" :content="item.tip" placement="top-start" :disabled="!item.tip">
-                  <template v-if="item.type === `date` || item.type === `datetime`">
-                    <el-date-picker
-                      v-model="form[item.model]"
-                      :type="item.type"
-                      placeholder="选择择"
-                      format="yyyy-MM-dd"
-                      value-format="yyyy-MM-dd"
-                      v-bind="item.options"
-                    >
-                    </el-date-picker>
-                  </template>
-                  <template v-else-if="item.type === `year` || item.type === `week` || item.type === `day`">
-                    <el-date-picker
-                      v-model="form[item.model]"
-                      :type="item.type"
-                      placeholder="选择择"
-                      :format="`${item.type === 'year' ? 'yyyy' : item.type === 'week' ? 'MM' : 'dd'}`"
-                      :value-format="`${item.type === 'year' ? 'yyyy' : item.type === 'week' ? 'MM' : 'dd'}`"
-                      v-bind="item.options"
-                    >
-                    </el-date-picker>
-                  </template>
-                  <template v-else-if="item.type === 'radio'">
-                    <el-radio-group v-model="form[item.model]" size="mini" v-bind="item.options">
-                      <slot name="radios" v-bind="{ item, form, fieldChange }"></slot>
-                    </el-radio-group>
-                  </template>
-                  <template v-else-if="item.type === 'checkbox'">
-                    <el-checkbox-group v-model="form[item.model]" v-bind="item.options">
-                      <slot name="checkboxs" v-bind="{ item, form, fieldChange }"></slot>
-                    </el-checkbox-group>
-                  </template>
-                  <template v-else-if="item.type === 'select'">
-                    <el-select v-model="form[item.model]" v-bind="item.options" filterable clearable>
-                      <slot name="options" v-bind="{ item, form, fieldChange }"></slot>
-                    </el-select>
-                  </template>
-                  <template v-else-if="item.type === 'textarea'">
-                    <el-input clearable v-model="form[item.model]" type="textarea" :autosize="{ minRows: 3, maxRows: 5 }"></el-input>
-                  </template>
-                  <template v-else-if="item.type === 'editor'">
-                    <wang-editor v-model="form[item.model]"></wang-editor>
-                  </template>
-                  <template v-else>
-                    <el-input
-                      clearable
-                      v-model="form[item.model]"
-                      :type="getField('type', item)"
-                      :placeholder="getField('placeholder', item)"
-                      :show-password="getField('type', item) === 'password'"
-                      v-bind="item.options"
-                    ></el-input>
-                  </template>
-                </el-tooltip>
+                <!-- <el-tooltip class="item" effect="dark" :content="item.tip" placement="top-start" :disabled="!item.tip"> -->
+                <template v-if="item.type === `date` || item.type === `datetime`">
+                  <el-date-picker
+                    v-model="form[item.model]"
+                    :type="item.type"
+                    placeholder="选择择"
+                    format="yyyy-MM-dd"
+                    value-format="yyyy-MM-dd"
+                    v-bind="item.options"
+                  >
+                  </el-date-picker>
+                </template>
+                <template v-else-if="item.type === `year` || item.type === `week` || item.type === `day`">
+                  <el-date-picker
+                    v-model="form[item.model]"
+                    :type="item.type"
+                    placeholder="选择择"
+                    :format="`${item.type === 'year' ? 'yyyy' : item.type === 'week' ? 'MM' : 'dd'}`"
+                    :value-format="`${item.type === 'year' ? 'yyyy' : item.type === 'week' ? 'MM' : 'dd'}`"
+                    v-bind="item.options"
+                  >
+                  </el-date-picker>
+                </template>
+                <template v-else-if="item.type === 'radio'">
+                  <el-radio-group v-model="form[item.model]" size="mini" v-bind="item.options">
+                    <slot name="radios" v-bind="{ item, form, fieldChange }"></slot>
+                  </el-radio-group>
+                </template>
+                <template v-else-if="item.type === 'select'">
+                  <el-select v-model="form[item.model]" v-bind="item.options" filterable clearable>
+                    <slot name="options" v-bind="{ item, form, fieldChange }"></slot>
+                  </el-select>
+                </template>
+                <template v-else-if="item.type === 'textarea'">
+                  <el-input clearable v-model="form[item.model]" type="textarea" :autosize="{ minRows: 3, maxRows: 5 }"></el-input>
+                </template>
+                <template v-else-if="item.type === 'editor'">
+                  <wang-editor v-model="form[item.model]"></wang-editor>
+                </template>
+                <template v-else-if="item.type === 'checkbox'">
+                  <el-checkbox-group v-model="form[item.model]" v-bind="item.options">
+                    <slot name="checkboxs" v-bind="{ item, form, fieldChange }"></slot>
+                  </el-checkbox-group>
+                </template>
+                <template v-else>
+                  <el-input
+                    clearable
+                    v-model="form[item.model]"
+                    :type="getField('type', item)"
+                    :placeholder="getField('placeholder', item)"
+                    :show-password="getField('type', item) === 'password'"
+                    v-bind="item.options"
+                  ></el-input>
+                </template>
+                <!-- </el-tooltip> -->
               </template>
               <template v-else>
                 {{ form[item.model] }}

+ 0 - 1
src/layout/enterprise/transaction.vue

@@ -125,4 +125,3 @@ export default {
   text-align: center;
 }
 </style>
-

+ 16 - 8
src/layout/layout-part/heads.vue

@@ -11,13 +11,13 @@
         <span class="mr14">|</span>
         <span class="mr14">
           <span class="el-icon-s-custom info_icon"></span>
-          &nbsp;测试
+          &nbsp;{{ user.name || '请登录' }}
         </span>
-        <a class="mr14">
+        <!-- <a class="mr14">
           <el-link class="el-icon-edit-outline info_icon">修改密码</el-link>
-        </a>
+        </a> -->
         <span class="mr14">|</span>
-        <a style="color: #333;"
+        <a style="color: #333;" @click="toLogout"
           ><span class="el-icon-switch-button info_icon"></span>
           &nbsp;退出
         </a>
@@ -27,8 +27,8 @@
 </template>
 
 <script>
-import { mapActions, mapState, mapMutations } from 'vuex';
-
+import { mapActions, mapState, mapMutations, createNamespacedHelpers } from 'vuex';
+const { mapActions: login } = createNamespacedHelpers('login');
 export default {
   name: 'heads',
   props: {},
@@ -36,8 +36,16 @@ export default {
   data: () => ({}),
   created() {},
   watch: {},
-  computed: {},
-  methods: {},
+  computed: {
+    ...mapState(['user']),
+  },
+  methods: {
+    ...login(['logout']),
+    toLogout() {
+      this.logout();
+      //TODO 跳转到首页
+    },
+  },
 };
 </script>
 

+ 24 - 53
src/layout/layout-part/newmenu.vue

@@ -32,10 +32,10 @@
 </template>
 
 <script>
-import { system, personnel, government, record, serve, enterprise, duijiehui, site, user, links, permission, dictionary } from '@/util/role_menu.js';
+import { index, personnel, government, record, serve, enterprise, duijiehui, site, user, links, defaultMenu } from '@/util/role_menu.js';
 import * as menus from '@/util/role_menu.js';
 import { mapState, createNamespacedHelpers } from 'vuex';
-const { mapActions } = createNamespacedHelpers('marketcolumn');
+const { mapActions } = createNamespacedHelpers('login');
 import _ from 'lodash';
 export default {
   name: 'sideMenu',
@@ -48,67 +48,38 @@ export default {
   computed: {
     ...mapState(['user']),
   },
-  created() {
-    this.serrch();
-    if (this.menu.length === 0) this.getMenuList();
-  },
+  created() {},
   methods: {
-    ...mapActions(['fetch', 'create', 'update', 'query']),
-    async serrch() {
-      const res = await this.query();
+    ...mapActions(['toGetMenu', 'logout']),
+    async search() {
+      if (!this.user.uid) return;
       if (this.user.role == '1') {
-        this.menu.push(system, personnel, government, record, serve, enterprise, duijiehui, site, user, links, permission, dictionary);
+        this.menu.push(index, ...defaultMenu, personnel, government, record, serve, enterprise, duijiehui, site, user, links);
         return;
       }
-      for (const val of this.user.columnid) {
-        var result = res.data.filter(item => item.id == val);
-        for (const acc of result) {
-          if (acc.name == system.name) {
-            this.menu.push(system);
-          } else if (acc.name == personnel.name) {
-            this.menu.push(personnel);
-          } else if (acc.name == government.name) {
-            this.menu.push(government);
-          } else if (acc.name == record.name) {
-            this.menu.push(record);
-          } else if (acc.name == serve.name) {
-            this.menu.push(serve);
-          } else if (acc.name == enterprise.name) {
-            this.menu.push(enterprise);
-          } else if (acc.name == site.name) {
-            this.menu.push(site);
-          } else if (acc.name == user.name) {
-            this.menu.push(user);
-          } else if (acc.name == links.name) {
-            this.menu.push(links);
-          } else if (acc.name == permission.name) {
-            this.menu.push(permission);
-          } else if (acc.name == dictionary.name) {
-            this.menu.push(dictionary);
-          }
-          console.log(this.menu);
-        }
+      const res = await this.toGetMenu({ id: this.user.uid });
+      if (this.$checkRes(res)) {
+        let menu = res.data.menus;
+        menu = menu.map(i => {
+          return { name: i.role_name, path: i.url };
+        });
+        let duplicate = JSON.parse(JSON.stringify(this.menu));
+        duplicate.push(...menu);
+        let nm = _.uniqBy(duplicate, 'path');
+        this.$set(this, `menu`, nm);
       }
     },
 
     selectMenu(path) {
       this.$router.push({ path: path });
     },
-    getMenuList() {
-      let res = _.uniqBy(this.menuList, 'menuid');
-      for (const item of res) {
-        this.menu.push(_.get(menus, item.code));
-      }
-    },
-    openMenuList(index) {
-      if (!this.$refs.collapse[index].show) {
-        this.$refs.collapse.forEach(item => {
-          item.show = false;
-        });
-        this.$refs.collapse[index].show = true;
-      } else {
-        this.$refs.collapse[index].show = false;
-      }
+  },
+  watch: {
+    user: {
+      handler(val, oval) {
+        if (val && !_.isEqual(val, oval)) this.search();
+      },
+      immediate: true,
     },
   },
 };

+ 1 - 2
src/layout/pesmisson/pesmissondetail.vue

@@ -19,7 +19,6 @@
   </div>
 </template>
 <script>
-import upload from '@/components/upload.vue';
 import { mapActions, mapState, createNamespacedHelpers } from 'vuex';
 
 export default {
@@ -37,7 +36,7 @@ export default {
       this.$emit('handleSave', { data: this.form, id: this.form.id });
     },
     handleCancel() {
-      this.$router.push({ path: '/pesmisson/index' });
+      this.$router.push({ path: './index' });
     },
   },
   computed: {

+ 0 - 19
src/router/before.js

@@ -1,19 +0,0 @@
-import store from '@/store/index';
-
-const checkLogin = router => {
-  router.beforeEach((to, form, next) => {
-    store.commit('setUser');
-    // if (to.name === 'login') {
-    //   next();
-    //   return;
-    // }
-    // let user = store.state.user;
-    // if (user) {
-    //   next();
-    // }
-    // //下面是没登录的情况,需要跳转页面到用户未登录页
-    // else next({ name: 'login' });
-    next();
-  });
-};
-export default checkLogin;

+ 11 - 1
src/router/index.js

@@ -1,6 +1,6 @@
 import Vue from 'vue';
 import VueRouter from 'vue-router';
-import checkLogin from './before';
+import checkLogin from '@common/router/before';
 
 Vue.use(VueRouter);
 
@@ -229,6 +229,16 @@ const routes = [
     path: '/lanmu/detali',
     component: () => import('../views/lanmu/detali.vue'),
   },
+  {
+    path: '/menu',
+    meta: { title: '菜单管理' },
+    component: () => import('../views/menu/index.vue'),
+  },
+  {
+    path: '/adminUser',
+    meta: { title: '子管理员管理' },
+    component: () => import('../views/admin-user/index.vue'),
+  },
 ];
 
 const router = new VueRouter({

+ 9 - 2
src/store/index.js

@@ -32,8 +32,12 @@ import marketcolumn from './marketcolumn';
 import users from './user';
 import codeCategory from './code-category';
 import codeItem from './code-item';
-import * as ustate from './user/state';
-import * as umutations from './user/mutations';
+
+import login from '@common/store/login';
+import authUser from '@common/store/user/auth-user';
+import role from '@common/store/user/role';
+import * as ustate from '@common/store/user/state';
+import * as umutations from '@common/store/user/mutations';
 Vue.use(Vuex);
 
 export default new Vuex.Store({
@@ -65,6 +69,9 @@ export default new Vuex.Store({
     live,
     apply,
     marketcolumn,
+    login,
+    role,
+    authUser,
   },
   state: { ...ustate },
   mutations: { ...umutations },

+ 8 - 9
src/util/role_menu.js

@@ -1,4 +1,4 @@
-export const system = {
+export const index = {
   name: '首页',
   path: '/',
 };
@@ -99,11 +99,10 @@ export const links = {
   name: '友情链接管理',
   path: '/links/index',
 };
-export const permission = {
-  name: '权限管理',
-  path: '/permission/index',
-};
-export const dictionary = {
-  name: '平台字典管理',
-  path: '/dictionary',
-};
+
+export const defaultMenu = [
+  { name: '权限管理', path: '/permission/index' },
+  { name: '菜单管理', path: '/menu' },
+  { name: '子管理员管理', path: '/adminUser' },
+  { name: '平台字典管理', path: '/dictionary' },
+];

+ 148 - 0
src/views/admin-user/index.vue

@@ -0,0 +1,148 @@
+<template>
+  <div id="index">
+    <el-row>
+      <el-col :span="24" class="info">
+        <el-col :span="24" class="top">
+          <topInfo :topTitle="pageTitle"></topInfo>
+          <el-col :span="24" class="topAdd">
+            <el-button type="primary" size="mini" @click="toAdd()"><i class="el-icon-plus"></i></el-button>
+          </el-col>
+        </el-col>
+        <el-col :span="24" class="main">
+          <data-table :fields="fields" @delete="toDelete" :data="list" :opera="opera" @edit="toEdit" :usePage="false"></data-table>
+        </el-col>
+      </el-col>
+    </el-row>
+    <el-drawer title="子管理员" :visible.sync="drawer" direction="rtl" @closed="handleClose" :destroy-on-close="true">
+      <data-form :fields="formFields" :data="form" :rules="{}" @save="drawerSave" :isNew="drawerIsNew"> </data-form>
+    </el-drawer>
+  </div>
+</template>
+
+<script>
+import dataTable from '@/components/data-table.vue';
+import topInfo from '@/layout/public/top.vue';
+import dataForm from '@/components/form.vue';
+import { mapState, createNamespacedHelpers } from 'vuex';
+const { mapActions: authUser } = createNamespacedHelpers('authUser');
+export default {
+  name: 'index',
+  props: {},
+  components: {
+    topInfo, //头部标题
+    dataTable,
+    dataForm,
+  },
+  data: () => {
+    return {
+      drawer: false,
+      form: {},
+      drawerIsNew: true,
+      opera: [
+        {
+          label: '编辑',
+          icon: 'el-icon-edit',
+          method: 'edit',
+        },
+        {
+          label: '删除',
+          icon: 'el-icon-delete',
+          method: 'delete',
+          confirm: true,
+        },
+      ],
+      fields: [
+        { label: '用户名', prop: 'name', model: 'name' },
+        { label: '手机号', prop: 'phone', model: 'phone' },
+        { label: '备注', prop: 'remark', model: 'phone' },
+      ],
+      formFields: [
+        { label: '用户名', model: 'name' },
+        { label: '手机号', model: 'phone' },
+        { label: '密码', model: 'passwd', type: 'password' },
+        { label: '备注', model: 'remark' },
+      ],
+      list: [],
+      total: 0,
+    };
+  },
+  created() {
+    this.search();
+  },
+  methods: {
+    ...authUser(['query', 'update', 'create']),
+    async search({ skip = 0, limit = 10, ...info } = {}) {
+      const res = await this.query({ skip, limit, ...info });
+      if (this.$checkRes(res)) {
+        this.$set(this, `list`, res.data);
+        this.$set(this, `total`, res.total);
+      }
+    },
+    toAdd() {
+      this.drawer = true;
+    },
+    async drawerSave({ data, isNew }) {
+      let res;
+      let msg;
+      if (isNew) {
+        res = await this.create(data);
+        msg = '创建成功';
+      } else {
+        res = await this.update(data);
+        msg = '修改成功';
+      }
+      if (this.$checkRes(res, msg, res.errmsg)) {
+        this.handleClose();
+        this.search();
+      }
+    },
+    toEdit({ data }) {
+      this.$set(this, 'form', data);
+      this.drawer = true;
+      this.drawerIsNew = false;
+    },
+    async toDelete({ data }) {
+      const res = await this.delete(data.id);
+      if (this.$checkRes(res, '删除成功', res.errmsg || '删除失败')) this.search();
+    },
+    handleClose() {
+      this.drawer = false;
+      this.form = {};
+      this.drawerIsNew = true;
+    },
+  },
+  computed: {
+    ...mapState(['user']),
+    pageTitle() {
+      return `${this.$route.meta.title}`;
+    },
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.main {
+  padding: 20px;
+  margin: 10px 20px;
+  border: 1px solid #ccc;
+  width: 96%;
+}
+.column {
+  width: 258px;
+  min-height: 500px;
+  border: 1px solid #ccc;
+  margin: 0 20px 0 0;
+}
+.top .topAdd {
+  padding: 0 10px 0 0;
+  text-align: right;
+}
+.message {
+  border: 1px solid #ccc;
+  min-height: 500px;
+  // min-width: 715px;
+}
+</style>

+ 138 - 0
src/views/menu/index.vue

@@ -0,0 +1,138 @@
+<template>
+  <div id="index">
+    <el-row>
+      <el-col :span="24" class="info">
+        <el-col :span="24" class="top">
+          <topInfo :topTitle="pageTitle"></topInfo>
+          <el-col :span="24" class="topAdd">
+            <el-button type="primary" size="mini" @click="toAdd()"><i class="el-icon-plus"></i></el-button>
+          </el-col>
+        </el-col>
+
+        <el-col :span="24" class="main">
+          <data-table :fields="fields" @delete="toDelete" :data="list" :opera="opera" @edit="toEdit" :usePage="false"></data-table>
+        </el-col>
+      </el-col>
+    </el-row>
+    <el-drawer title="菜单" :visible.sync="drawer" direction="rtl" @closed="handleClose" :destroy-on-close="true">
+      <data-form :fields="fields" :data="form" :rules="{}" @save="drawerSave" :isNew="drawerIsNew"> </data-form>
+    </el-drawer>
+  </div>
+</template>
+
+<script>
+import topInfo from '@/layout/public/top.vue';
+import dataForm from '@/components/form.vue';
+import dataTable from '@/components/data-table.vue';
+import { mapState, createNamespacedHelpers } from 'vuex';
+const { mapActions } = createNamespacedHelpers('role');
+export default {
+  name: 'index',
+  props: {},
+  components: { topInfo, dataTable, dataForm },
+  data: () => {
+    return {
+      drawer: false,
+      form: {},
+      drawerIsNew: true,
+      opera: [
+        {
+          label: '编辑',
+          icon: 'el-icon-edit',
+          method: 'edit',
+        },
+        {
+          label: '删除',
+          icon: 'el-icon-delete',
+          method: 'delete',
+          confirm: true,
+        },
+      ],
+      fields: [
+        { label: '名称', prop: 'role_name', model: 'role_name' },
+        { label: '路由', prop: 'url', model: 'url' },
+      ],
+      list: [],
+      total: 0,
+    };
+  },
+  created() {
+    this.search();
+  },
+  methods: {
+    ...mapActions(['query', 'create', 'update', 'delete']),
+    async search({ skip = 0, limit = 10, ...info } = {}) {
+      const res = await this.query({ ...info, category: this.category });
+      if (this.$checkRes(res)) {
+        this.$set(this, `list`, res.data);
+        this.$set(this, `total`, res.total);
+      }
+    },
+    toAdd() {
+      this.drawer = true;
+    },
+    async drawerSave({ data, isNew }) {
+      let res;
+      let msg;
+      if (isNew) {
+        res = await this.create(data);
+        msg = '创建成功';
+      } else {
+        res = await this.update(data);
+        msg = '修改成功';
+      }
+      if (this.$checkRes(res, msg, res.errmsg)) {
+        this.handleClose();
+        this.search();
+      }
+    },
+    toEdit({ data }) {
+      this.$set(this, 'form', data);
+      this.drawer = true;
+      this.drawerIsNew = false;
+    },
+    async toDelete({ data }) {
+      const res = await this.delete(data.id);
+      if (this.$checkRes(res, '删除成功', res.errmsg || '删除失败')) this.search();
+    },
+    handleClose() {
+      this.drawer = false;
+      this.form = {};
+      this.drawerIsNew = true;
+    },
+  },
+  computed: {
+    ...mapState(['user']),
+    pageTitle() {
+      return `${this.$route.meta.title}`;
+    },
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.main {
+  padding: 20px;
+  margin: 10px 20px;
+  border: 1px solid #ccc;
+  width: 96%;
+}
+.column {
+  width: 258px;
+  min-height: 500px;
+  border: 1px solid #ccc;
+  margin: 0 20px 0 0;
+}
+.top .topAdd {
+  padding: 0 10px 0 0;
+  text-align: right;
+}
+.message {
+  border: 1px solid #ccc;
+  min-height: 500px;
+  // min-width: 715px;
+}
+</style>

+ 58 - 9
src/views/permission/index.vue

@@ -5,32 +5,44 @@
         <el-col :span="24" class="top">
           <topInfo :topTitle="topTitle"></topInfo>
         </el-col>
-        <el-col :span="24" class="search" style="text-align:right">
-          <el-button size="mini" type="primary" @click="$router.push({ path: './detail' })" icon="el-icon-plus">分配权限</el-button>
-        </el-col>
         <el-col :span="24" class="main">
           <!-- <mainData :tableData="tableData" :total="total" @delete="deleteData"></mainData> -->
-          <data-table :fields="fields" @delete="toDelete" :data="list" :opera="opera" @edit="toEdit" :total="total" @query="search"></data-table>
+          <data-table :fields="fields" @delete="toDelete" :data="list" :opera="opera" @edit="toEdit" :usePage="false"></data-table>
         </el-col>
       </el-col>
     </el-row>
+    <el-drawer title="权限分配" :visible.sync="drawer" direction="rtl" @closed="handleClose" :destroy-on-close="false">
+      <data-form :fields="formFields" :data="form" :rules="{}" @save="drawerSave" :isNew="drawerIsNew">
+        <template #custom="{item, form}">
+          <el-checkbox-group v-model="form.menus">
+            <el-checkbox v-for="(i, index) in menuList" :key="index" :label="i._id">{{ i.role_name }}</el-checkbox>
+          </el-checkbox-group>
+        </template>
+      </data-form>
+    </el-drawer>
   </div>
 </template>
 
 <script>
 import topInfo from '@/layout/public/top.vue';
+import dataForm from '@/components/form.vue';
 import dataTable from '@/components/data-table.vue';
 import { mapActions, mapState, createNamespacedHelpers } from 'vuex';
-const { mapActions: users } = createNamespacedHelpers('users');
+const { mapActions: authUser } = createNamespacedHelpers('authUser');
+const { mapActions: role } = createNamespacedHelpers('role');
 export default {
   name: 'index',
   props: {},
   components: {
     topInfo, //头部标题
     dataTable,
+    dataForm,
   },
   data: () => ({
     topTitle: '权限管理',
+    drawer: false,
+    form: {},
+    drawerIsNew: true,
     opera: [
       {
         label: '编辑',
@@ -45,30 +57,67 @@ export default {
       },
     ],
     fields: [{ label: '用户名', prop: 'name' }],
+    formFields: [
+      { label: '用户名', model: 'name', type: 'text' },
+      { label: '权限', model: 'menus', custom: true },
+    ],
     list: [],
+    menuList: [],
     total: 0,
   }),
   created() {
     this.search();
+    this.getOtherList();
   },
   computed: {},
   methods: {
-    ...users(['query', 'delete', 'update']),
+    ...authUser(['fetch', 'query', 'update']),
+    ...role({ getRoleList: 'query' }),
     async search({ skip = 0, limit = 10, ...info } = {}) {
       const res = await this.query({ skip, limit, ...info });
       if (this.$checkRes(res)) {
         this.$set(this, `list`, res.data);
-        console.log(res.data);
         this.$set(this, `total`, res.total);
       }
     },
-    toEdit({ data }) {
-      this.$router.push({ path: './detail', query: { id: data.id } });
+    async drawerSave({ data, isNew }) {
+      let res;
+      let msg;
+      let duplicate = JSON.parse(JSON.stringify(data));
+      if (isNew) {
+        res = await this.create(duplicate);
+        msg = '创建成功';
+      } else {
+        res = await this.update(duplicate);
+        msg = '修改成功';
+      }
+      if (this.$checkRes(res, msg, res.errmsg)) {
+        this.handleClose();
+        this.search();
+      }
+    },
+    async toEdit({ data }) {
+      const res = await this.fetch({ id: data.id });
+      if (this.$checkRes(res)) {
+        let menus = res.data.menus;
+        this.$set(this, 'form', { ...data, menus: menus.map(i => i.id) });
+      }
+      this.drawer = true;
+      this.drawerIsNew = false;
     },
     async toDelete({ data }) {
       const res = await this.delete(data.id);
       if (this.$checkRes(res, '删除成功', res.errmsg || '删除失败')) this.search();
     },
+    handleClose() {
+      this.drawer = false;
+      this.form = { menus: [] };
+      this.drawerIsNew = true;
+    },
+    async getOtherList() {
+      const res = await this.getRoleList();
+      if (this.$checkRes(res)) this.$set(this, `menuList`, res.data);
+    },
   },
 };
 </script>

+ 47 - 40
vue.config.js

@@ -1,4 +1,5 @@
 const path = require('path');
+const common = path.resolve(__dirname, '../common');
 module.exports = {
   publicPath: process.env.NODE_ENV === 'development' ? '/' : process.env.VUE_APP_ROUTER,
   // outputDir: process.env.VUE_APP_ROUTER,
@@ -10,6 +11,7 @@ module.exports = {
           '@': path.resolve(__dirname, './src'),
           '@c': path.resolve(__dirname, './src/components'),
           '@a': path.resolve(__dirname, './src/assets'),
+          '@common': common,
         },
       },
     });
@@ -30,50 +32,55 @@ module.exports = {
       '/files': {
         target: 'http://free.liaoningdoupo.com',
       },
-      '/api/setting': {
-        target: 'http://10.16.10.72:9000',
-        changeOrigin: true,
-        ws: true,
-      },
-      '/api/affairs': {
-        target: 'http://free.liaoningdoupo.com',
-        changeOrigin: true,
-        ws: true,
-      },
-      '/api/policy': {
-        target: 'http://free.liaoningdoupo.com',
-        changeOrigin: true,
-        ws: true,
-      },
-      '/api/record': {
+      '/api': {
         target: 'http://free.liaoningdoupo.com',
         changeOrigin: true,
         ws: true,
       },
-      '/api/serve': {
-        target: 'http://free.liaoningdoupo.com',
-        changeOrigin: true,
-        ws: true,
-        // pathRewrite: { '^/api/affairs': '/api' },
-      },
-      '/api/talent': {
-        target: 'http://free.liaoningdoupo.com',
-        changeOrigin: true,
-        ws: true,
-        // pathRewrite: { '^/api/affairs': '/api' },
-      },
-      '/api/market': {
-        target: 'http://free.liaoningdoupo.com',
-        changeOrigin: true,
-        ws: true,
-        // pathRewrite: { '^/api/affairs': '/api' },
-      },
-      '/api/live': {
-        target: 'http://free.liaoningdoupo.com',
-        changeOrigin: true,
-        ws: true,
-        // pathRewrite: { '^/api/affairs': '/api' },
-      },
+      // '/api/setting': {
+      //   target: 'http://10.16.10.72:9000',
+      //   changeOrigin: true,
+      //   ws: true,
+      // },
+      // '/api/affairs': {
+      //   target: 'http://free.liaoningdoupo.com',
+      //   changeOrigin: true,
+      //   ws: true,
+      // },
+      // '/api/policy': {
+      //   target: 'http://free.liaoningdoupo.com',
+      //   changeOrigin: true,
+      //   ws: true,
+      // },
+      // '/api/record': {
+      //   target: 'http://free.liaoningdoupo.com',
+      //   changeOrigin: true,
+      //   ws: true,
+      // },
+      // '/api/serve': {
+      //   target: 'http://free.liaoningdoupo.com',
+      //   changeOrigin: true,
+      //   ws: true,
+      //   // pathRewrite: { '^/api/affairs': '/api' },
+      // },
+      // '/api/talent': {
+      //   target: 'http://free.liaoningdoupo.com',
+      //   changeOrigin: true,
+      //   ws: true,
+      //   // pathRewrite: { '^/api/affairs': '/api' },
+      // },
+      // '/api/market': {
+      //   target: 'http://free.liaoningdoupo.com',
+      //   changeOrigin: true,
+      //   ws: true,
+      //   // pathRewrite: { '^/api/affairs': '/api' },
+      // },
+      // '/api/live': {
+      //   target: 'http://free.liaoningdoupo.com',
+      //   changeOrigin: true,
+      //   ws: true,
+      //   // pathRewrite: { '^/api/affairs': '/api' },
+      // },
     },
   },
 };