增加user的增删改查

bigsys-auth/bigsys-auth-project/vue/src/router/index.js

@@ -8,7 +8,7 @@ Vue.use(Router)
 import Layout from '../views/layout/Layout'
 import Login from '../views/Login'
 import MyTable from '../views/components/MyTable'
-import MyTableWithFilter from '../views/components/MyTableWithFilter'
+import user from '../views/pages/user'
 
 /**
  * icon : the icon show in the sidebar
@@ -21,16 +21,16 @@ export const constantRouterMap = [
   {
     path: '/auth',
     component: Layout,
-    name: '用户管理',
+    name: '权限管理',
     children: [
-      {path: 'index', component: MyTableWithFilter, name: '主页1'}
+      {path: 'index', component: MyTable, name: '主页1'}
     ]
   }, {
     path: '/user',
     component: Layout,
     name: '权限',
     children: [
-      {path: 'index', component: MyTable, name: '主页2'}
+      {path: 'index', component: user, name: '主页2'}
     ]
   }, {
     path: '/',

bigsys-auth/bigsys-auth-project/vue/src/store/getter.js

 const getters = {
-  menus: state => state.sidebar.menus
+  menus: state => state.sidebar.menus,
+  users: state => state.users.users
 }
 export default getters

bigsys-auth/bigsys-auth-project/vue/src/store/index.js

 import Vue from 'vue'
 import Vuex from 'vuex'
 import sidebar from './modules/sidebar'
+import users from './modules/users'
 import getters from './getter'
 
 Vue.use(Vuex)
 
 const store = new Vuex.Store({
   modules: {
-    sidebar
+    sidebar,
+    users
   },
   getters
 })

bigsys-auth/bigsys-auth-project/vue/src/views/components/MyTableWithFilter.vue

-<template>
-  <div>
-    <div>
-      <div class="tb-filter">
-        <el-input placeholder="用户名" class="my-input" v-model="username">
-          <template slot="prepend">用户名:</template>
-        </el-input>
-        <el-input placeholder="电话" class="my-input" v-model="username">
-          <template slot="prepend">电话:</template>
-        </el-input>
-        <el-button type="primary" @click="dialogFormVisible = true">新增</el-button>
-      </div>
-    </div>
-    <my-table :thead="thead" :tdata="tdata"></my-table>
-    <el-dialog title="新增用户" :visible.sync="dialogFormVisible">
-      <el-form :label-position="labelPosition" label-width="80px" :model="formLabelAlign">
-        <el-form-item label="用户名">
-          <el-input v-model="formLabelAlign.name"></el-input>
-        </el-form-item>
-        <el-form-item label="电话">
-          <el-input v-model="formLabelAlign.phone"></el-input>
-        </el-form-item>
-        <el-form-item label="密码">
-          <el-input v-model="formLabelAlign.password" type="password"></el-input>
-        </el-form-item>
-      </el-form>
-      <div slot="footer" class="dialog-footer">
-        <el-button @click="dialogFormVisible = false">取 消</el-button>
-        <el-button type="primary" @click="addUser()">确 定</el-button>
-      </div>
-    </el-dialog>
-  </div>
-</template>
-
-<style>
-  .tb-filter {
-    margin-bottom: 20px;
-  }
-  .my-input {
-    width: 200px;
-  }
-</style>
-
-<script>
-  import MyTable from './MyTable'
-  import {thead, inittdata} from '../../mock/table'
-  export default {
-    components: {
-      MyTable
-    },
-    data () {
-      return {
-        username: 'fds',
-        tdata: inittdata,
-        dialogFormVisible: false,
-        labelPosition: 'right',
-        formLabelAlign: {
-          name: '',
-          region: '',
-          type: ''
-        }
-      }
-    },
-    computed: {
-      thead () {
-        return thead
-      }
-    },
-    watch: {
-      username () {
-        var filterdata = []
-        if (!this.username) {
-          this.tdata = inittdata
-          return
-        }
-        inittdata.forEach((data, index) => {
-          if (data.name.indexOf(this.username) !== -1) {
-            filterdata.push(data)
-          }
-        })
-        this.tdata = filterdata
-      }
-    },
-    methods: {
-      addUser: function () {
-        this.dialogFormVisible = false
-        this.$store.dispatch('TEST', this.formLabelAlign).then(() => {
-          alert('新增成功')
-        }).catch(() => {
-          alert('新增失败')
-        })
-      }
-    }
-  }
-
-</script>

bigsys-auth/bigsys-auth-project/vue/src/views/components/User.vue

-<template>
-  <div>
-    <div>
-      <div class="tb-filter">
-        <el-input placeholder="用户名" class="my-input" v-model="username">
-          <template slot="prepend">用户名:</template>
-        </el-input>
-        <el-input placeholder="电话" class="my-input" v-model="username">
-          <template slot="prepend">电话:</template>
-        </el-input>
-        <el-button type="primary" @click="addUser()">新增</el-button>
-      </div>
-    </div>
-    <my-table :thead="thead" :tdata="tdata"></my-table>
-  </div>
-</template>
-
-<style>
-  .tb-filter {
-    margin-bottom: 20px;
-  }
-  .my-input {
-    width: 200px;
-  }
-</style>
-
-<script>
-  import MyTable from './MyTable'
-  export default {
-    components: {
-      MyTable
-    },
-    data () {
-      return {
-        username: '测试',
-        thead: [
-          {
-            prop: 'date',
-            label: '日期',
-            width: '180'
-          }, {
-            prop: 'name',
-            label: '名称',
-            width: '180'
-          }, {
-            prop: 'address',
-            label: '地址'
-          }
-        ],
-        tdata: [{
-          date: '2016-05-04',
-          name: '王小虎',
-          address: '上海市普陀区金沙江路 1517 弄'
-        }, {
-          date: '2016-05-04',
-          name: '王小虎',
-          address: '上海市普陀区金沙江路 1517 弄'
-        }, {
-          date: '2016-05-01',
-          name: '王小虎',
-          address: '上海市普陀区金沙江路 1519 弄'
-        }, {
-          date: '2016-05-03',
-          name: '王小虎',
-          address: '上海市普陀区金沙江路 1516 弄'
-        }]
-      }
-    },
-    methods: {
-      addUser: function () {
-        alert('添加一个用户')
-      }
-    }
-  }
-
-</script>