完善权限+正则

src/api/emp.js

@@ -2,7 +2,7 @@ import request from '@/utils/request'
 
 export function fetchEmp(data) {
   return request({
-    url: '/manage/emp/list',
+    url: '/manage/emp/listEmp',
     method: 'post',
     data
   })

src/api/manager.js

@@ -2,7 +2,7 @@ import request from '@/utils/request'
 
 export function fetchManager(data) {
   return request({
-    url: '/manage/manager/list',
+    url: '/manage/manager/listManager',
     method: 'post',
     data
   })

src/api/role.js

@@ -0,0 +1,15 @@
+import request from '@/utils/request'
+
+export function findRoles() {
+  return request({
+    url: '/manage/role/findRole',
+    method: 'post'
+  })
+}
+
+export function findPosts() {
+  return request({
+    url: '/manage/role/findPost',
+    method: 'post'
+  })
+}

src/views/employees/index.vue

@@ -47,41 +47,51 @@
 
     <el-button type="danger" @click="batchDelEmp">删除员工</el-button>
 
-    <el-dialog title="新增员工" :visible.sync="dialogFormVisible3">
+    <el-dialog title="新增管理员" :visible.sync="dialogFormVisible3">
-      <el-form :model="emp">
+      <el-form :model="emp" :rules="rules" ref="emp">
-        <el-form-item label="员工姓名" :label-width="formLabelWidth">
+        <el-form-item label="员工姓名" :label-width="formLabelWidth" prop="empName">
           <el-input v-model="emp.empName" autocomplete="off"></el-input>
         </el-form-item>
-        <el-form-item label="员工用户名" :label-width="formLabelWidth">
+        <el-form-item label="员工用户名" :label-width="formLabelWidth" prop="username">
           <el-input v-model="emp.username" autocomplete="off"></el-input>
         </el-form-item>
-        <el-form-item label="员工密码" :label-width="formLabelWidth">
+        <el-form-item label="员工密码" :label-width="formLabelWidth" prop="password">
           <el-input v-model="emp.password" autocomplete="off" :key="passwordType" :type="passwordType" tabindex="2" auto-complete="on"></el-input>
           <span class="show-pwd" @click="showPwd">
                     <svg-icon :icon-class="passwordType === 'password' ? 'eye' : 'eye-open'"/>
                   </span>
         </el-form-item>
-        <el-form-item label="员工手机号" :label-width="formLabelWidth">
+        <el-form-item label="员工手机号" :label-width="formLabelWidth" prop="empTel">
           <el-input v-model="emp.empTel" autocomplete="off"></el-input>
         </el-form-item>
-        <el-form-item label="员工身份证号" :label-width="formLabelWidth">
+        <el-form-item label="员工身份证号" :label-width="formLabelWidth" prop="empIdCard">
           <el-input v-model="emp.empIdCard" autocomplete="off"></el-input>
         </el-form-item>
-        <el-form-item label="员工年龄" :label-width="formLabelWidth">
+        <el-form-item label="员工年龄" :label-width="formLabelWidth" prop="empAge">
           <el-input v-model="emp.empAge" autocomplete="off"></el-input>
         </el-form-item>
-        <el-form-item label="员工性别" :label-width="formLabelWidth">
+        <el-form-item label="员工性别" :label-width="formLabelWidth" prop="empGender">
           <el-radio-group v-model="emp.empGender">
             <el-radio :label="1">男</el-radio>
             <el-radio :label="2">女</el-radio>
           </el-radio-group>
         </el-form-item>
-        <el-form-item label="员工住址" :label-width="formLabelWidth">
+        <el-form-item label="员工住址" :label-width="formLabelWidth" prop="empAddress">
           <el-input v-model="emp.empAddress" autocomplete="off"></el-input>
         </el-form-item>
-        <el-form-item label="员工薪资" :label-width="formLabelWidth">
+        <el-form-item label="员工薪资" :label-width="formLabelWidth" prop="empSal">
           <el-input v-model="emp.empSal" autocomplete="off"></el-input>
         </el-form-item>
+        <el-form-item label="员工角色" :label-width="formLabelWidth" prop="empSal">
+          <el-select v-model="emp.roleId" clearable placeholder="请选择">
+            <el-option v-for="item in roles" :key="item.roleId" :label="item.roleName" :value="item.roleId"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="员工岗位" :label-width="formLabelWidth" prop="empSal">
+          <el-select v-model="emp.postId" clearable placeholder="请选择">
+            <el-option v-for="item in posts" :key="item.postId" :label="item.postName" :value="item.postId"></el-option>
+          </el-select>
+        </el-form-item>
       </el-form>
       <div slot="footer" class="dialog-footer">
         <el-button @click="dialogFormVisible3 = false">取 消</el-button>
@@ -89,41 +99,51 @@
       </div>
     </el-dialog>
 
-    <el-dialog title="编辑员工" :visible.sync="dialogFormVisible4">
+    <el-dialog title="编辑管理员" :visible.sync="dialogFormVisible4">
-      <el-form :model="emp">
+      <el-form :model="emp" :rules="rules" ref="emp">
-        <el-form-item label="员工姓名" :label-width="formLabelWidth">
+        <el-form-item label="员工姓名" :label-width="formLabelWidth" prop="empName">
           <el-input v-model="emp.empName" autocomplete="off"></el-input>
         </el-form-item>
-        <el-form-item label="员工用户名" :label-width="formLabelWidth">
+        <el-form-item label="员工用户名" :label-width="formLabelWidth" prop="username">
           <el-input v-model="emp.username" autocomplete="off"></el-input>
         </el-form-item>
-        <el-form-item label="员工密码" :label-width="formLabelWidth">
+        <el-form-item label="员工密码" :label-width="formLabelWidth" prop="password">
           <el-input v-model="emp.password" autocomplete="off" :key="passwordType" :type="passwordType" tabindex="2" auto-complete="on"></el-input>
           <span class="show-pwd" @click="showPwd">
                     <svg-icon :icon-class="passwordType === 'password' ? 'eye' : 'eye-open'"/>
                   </span>
         </el-form-item>
-        <el-form-item label="员工手机号" :label-width="formLabelWidth">
+        <el-form-item label="员工手机号" :label-width="formLabelWidth" prop="empTel">
           <el-input v-model="emp.empTel" autocomplete="off"></el-input>
         </el-form-item>
-        <el-form-item label="员工身份证号" :label-width="formLabelWidth">
+        <el-form-item label="员工身份证号" :label-width="formLabelWidth" prop="empIdCard">
           <el-input v-model="emp.empIdCard" autocomplete="off"></el-input>
         </el-form-item>
-        <el-form-item label="员工年龄" :label-width="formLabelWidth">
+        <el-form-item label="员工年龄" :label-width="formLabelWidth" prop="empAge">
           <el-input v-model="emp.empAge" autocomplete="off"></el-input>
         </el-form-item>
-        <el-form-item label="员工性别" :label-width="formLabelWidth">
+        <el-form-item label="员工性别" :label-width="formLabelWidth" prop="empGender">
           <el-radio-group v-model="emp.empGender">
             <el-radio :label="1">男</el-radio>
             <el-radio :label="2">女</el-radio>
           </el-radio-group>
         </el-form-item>
-        <el-form-item label="员工住址" :label-width="formLabelWidth">
+        <el-form-item label="员工住址" :label-width="formLabelWidth" prop="empAddress">
           <el-input v-model="emp.empAddress" autocomplete="off"></el-input>
         </el-form-item>
-        <el-form-item label="员工薪资" :label-width="formLabelWidth">
+        <el-form-item label="员工薪资" :label-width="formLabelWidth" prop="empSal">
           <el-input v-model="emp.empSal" autocomplete="off"></el-input>
         </el-form-item>
+        <el-form-item label="员工角色" :label-width="formLabelWidth" prop="empSal">
+          <el-select v-model="emp.roleId" clearable placeholder="请选择">
+            <el-option v-for="item in roles" :key="item.roleId" :label="item.roleName" :value="item.roleId"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="员工岗位" :label-width="formLabelWidth" prop="empSal">
+          <el-select v-model="emp.postId" clearable placeholder="请选择">
+            <el-option v-for="item in posts" :key="item.postId" :label="item.postName" :value="item.postId"></el-option>
+          </el-select>
+        </el-form-item>
       </el-form>
       <div slot="footer" class="dialog-footer">
         <el-button @click="dialogFormVisible4 = false">取 消</el-button>

src/views/market/index.vue

@@ -5,6 +5,9 @@
       <el-tab-pane label="人员管理" v-if="role == 1 || role == 3">
         <el-tabs :tab-position="tabPosition2" style="height: 80%">
           <el-tab-pane label="管理员管理">
+            <div>
+              <el-button @click="fetchManager">刷新</el-button>
+            </div>
             <el-form :inline="true" :model="empRequest" class="demo-form-inline">
               <el-form-item label="管理员姓名">
                 <el-input v-model="empRequest.empName" placeholder="管理员姓名" clearable></el-input>
@@ -90,6 +93,16 @@
                 <el-form-item label="员工薪资" :label-width="formLabelWidth" prop="empSal">
                   <el-input v-model="emp.empSal" autocomplete="off"></el-input>
                 </el-form-item>
+                <el-form-item label="员工角色" :label-width="formLabelWidth" prop="empSal">
+                  <el-select v-model="emp.roleId" clearable placeholder="请选择">
+                    <el-option v-for="item in roles" :key="item.roleId" :label="item.roleName" :value="item.roleId"></el-option>
+                  </el-select>
+                </el-form-item>
+                <el-form-item label="员工岗位" :label-width="formLabelWidth" prop="empSal">
+                  <el-select v-model="emp.postId" clearable placeholder="请选择">
+                    <el-option v-for="item in posts" :key="item.postId" :label="item.postName" :value="item.postId"></el-option>
+                  </el-select>
+                </el-form-item>
               </el-form>
               <div slot="footer" class="dialog-footer">
                 <el-button @click="dialogFormVisible1 = false">取 消</el-button>
@@ -132,6 +145,16 @@
                 <el-form-item label="员工薪资" :label-width="formLabelWidth" prop="empSal">
                   <el-input v-model="emp.empSal" autocomplete="off"></el-input>
                 </el-form-item>
+                <el-form-item label="员工角色" :label-width="formLabelWidth" prop="empSal">
+                  <el-select v-model="emp.roleId" clearable placeholder="请选择">
+                    <el-option v-for="item in roles" :key="item.roleId" :label="item.roleName" :value="item.roleId"></el-option>
+                  </el-select>
+                </el-form-item>
+                <el-form-item label="员工岗位" :label-width="formLabelWidth" prop="empSal">
+                  <el-select v-model="emp.postId" clearable placeholder="请选择">
+                    <el-option v-for="item in posts" :key="item.postId" :label="item.postName" :value="item.postId"></el-option>
+                  </el-select>
+                </el-form-item>
               </el-form>
               <div slot="footer" class="dialog-footer">
                 <el-button @click="dialogFormVisible2 = false">取 消</el-button>
@@ -140,7 +163,159 @@
             </el-dialog>
           </el-tab-pane>
           <el-tab-pane label="员工管理">
+            <div>
+              <el-button @click="fetchEmp">刷新</el-button>
+            </div>
+            <el-form :inline="true" :model="empRequest" class="demo-form-inline">
+              <el-form-item label="员工编号">
+                <el-input v-model="empRequest.empId" placeholder="员工编号" clearable></el-input>
+              </el-form-item>
+              <el-form-item>
+                <el-button type="primary" @click="fetchEmp" icon="el-icon-search">查询</el-button>
+              </el-form-item>
+            </el-form>
 
+            <el-button type="primary" @click="dialogFormVisible3 = true">新增员工</el-button>
+
+            <el-table :data="empResponse.list" border stripe @selection-change="handleSelectionChange"  tooltip-effect="dark" style="width: 100%">
+              <el-table-column type="selection" width="55"/>
+              <el-table-column label="员工Id" prop="empId"/>
+              <el-table-column label="员工姓名" prop="empName"/>
+              <el-table-column label="员工用户名" prop="username"/>
+              <el-table-column label="员工手机号" prop="empTel"/>
+              <el-table-column label="员工身份证号" prop="empIdCard"/>
+              <el-table-column label="员工年龄" prop="empAge"/>
+              <el-table-column label="员工性别" >
+                <template slot-scope="scope">
+                  <span v-if="scope.row.empGender == 1">男</span>
+                  <span v-if="scope.row.empGender == 2">女</span>
+                </template>
+              </el-table-column>
+              <el-table-column label="员工住址" prop="empAddress"/>
+              <el-table-column label="员工薪资" prop="empSal"/>
+              <el-table-column label="操作">
+                <template slot-scope="scope">
+                  <el-button type="warning" @click="openEmp(scope.row.empId)">编辑</el-button>
+                  <el-button type="danger" @click="delEmp(scope.row.empId)">删除</el-button>
+                </template>
+              </el-table-column>
+            </el-table>
+
+            <el-pagination
+              @size-change="handleSizeChange"
+              @current-change="handleCurrentChange"
+              :current-page="empRequest.pageNum"
+              :page-sizes="[1, 5, 10, 20]"
+              :page-size="empRequest.pageSize"
+              layout="total, sizes, prev, pager, next, jumper"
+              :total="empResponse.total">
+            </el-pagination>
+
+            <el-button type="danger" @click="batchDelEmp">删除员工</el-button>
+
+            <el-dialog title="新增管理员" :visible.sync="dialogFormVisible3">
+              <el-form :model="emp" :rules="rules" ref="emp">
+                <el-form-item label="员工姓名" :label-width="formLabelWidth" prop="empName">
+                  <el-input v-model="emp.empName" autocomplete="off"></el-input>
+                </el-form-item>
+                <el-form-item label="员工用户名" :label-width="formLabelWidth" prop="username">
+                  <el-input v-model="emp.username" autocomplete="off"></el-input>
+                </el-form-item>
+                <el-form-item label="员工密码" :label-width="formLabelWidth" prop="password">
+                  <el-input v-model="emp.password" autocomplete="off" :key="passwordType" :type="passwordType" tabindex="2" auto-complete="on"></el-input>
+                  <span class="show-pwd" @click="showPwd">
+                    <svg-icon :icon-class="passwordType === 'password' ? 'eye' : 'eye-open'"/>
+                  </span>
+                </el-form-item>
+                <el-form-item label="员工手机号" :label-width="formLabelWidth" prop="empTel">
+                  <el-input v-model="emp.empTel" autocomplete="off"></el-input>
+                </el-form-item>
+                <el-form-item label="员工身份证号" :label-width="formLabelWidth" prop="empIdCard">
+                  <el-input v-model="emp.empIdCard" autocomplete="off"></el-input>
+                </el-form-item>
+                <el-form-item label="员工年龄" :label-width="formLabelWidth" prop="empAge">
+                  <el-input v-model="emp.empAge" autocomplete="off"></el-input>
+                </el-form-item>
+                <el-form-item label="员工性别" :label-width="formLabelWidth" prop="empGender">
+                  <el-radio-group v-model="emp.empGender">
+                    <el-radio :label="1">男</el-radio>
+                    <el-radio :label="2">女</el-radio>
+                  </el-radio-group>
+                </el-form-item>
+                <el-form-item label="员工住址" :label-width="formLabelWidth" prop="empAddress">
+                  <el-input v-model="emp.empAddress" autocomplete="off"></el-input>
+                </el-form-item>
+                <el-form-item label="员工薪资" :label-width="formLabelWidth" prop="empSal">
+                  <el-input v-model="emp.empSal" autocomplete="off"></el-input>
+                </el-form-item>
+                <el-form-item label="员工角色" :label-width="formLabelWidth" prop="empSal">
+                  <el-select v-model="emp.roleId" clearable placeholder="请选择">
+                    <el-option v-for="item in roles" :key="item.roleId" :label="item.roleName" :value="item.roleId"></el-option>
+                  </el-select>
+                </el-form-item>
+                <el-form-item label="员工岗位" :label-width="formLabelWidth" prop="empSal">
+                  <el-select v-model="emp.postId" clearable placeholder="请选择">
+                    <el-option v-for="item in posts" :key="item.postId" :label="item.postName" :value="item.postId"></el-option>
+                  </el-select>
+                </el-form-item>
+              </el-form>
+              <div slot="footer" class="dialog-footer">
+                <el-button @click="dialogFormVisible3 = false">取 消</el-button>
+                <el-button type="primary" @click="addEmp">确 定</el-button>
+              </div>
+            </el-dialog>
+
+            <el-dialog title="编辑管理员" :visible.sync="dialogFormVisible4">
+              <el-form :model="emp" :rules="rules" ref="emp">
+                <el-form-item label="员工姓名" :label-width="formLabelWidth" prop="empName">
+                  <el-input v-model="emp.empName" autocomplete="off"></el-input>
+                </el-form-item>
+                <el-form-item label="员工用户名" :label-width="formLabelWidth" prop="username">
+                  <el-input v-model="emp.username" autocomplete="off"></el-input>
+                </el-form-item>
+                <el-form-item label="员工密码" :label-width="formLabelWidth" prop="password">
+                  <el-input v-model="emp.password" autocomplete="off" :key="passwordType" :type="passwordType" tabindex="2" auto-complete="on"></el-input>
+                  <span class="show-pwd" @click="showPwd">
+                    <svg-icon :icon-class="passwordType === 'password' ? 'eye' : 'eye-open'"/>
+                  </span>
+                </el-form-item>
+                <el-form-item label="员工手机号" :label-width="formLabelWidth" prop="empTel">
+                  <el-input v-model="emp.empTel" autocomplete="off"></el-input>
+                </el-form-item>
+                <el-form-item label="员工身份证号" :label-width="formLabelWidth" prop="empIdCard">
+                  <el-input v-model="emp.empIdCard" autocomplete="off"></el-input>
+                </el-form-item>
+                <el-form-item label="员工年龄" :label-width="formLabelWidth" prop="empAge">
+                  <el-input v-model="emp.empAge" autocomplete="off"></el-input>
+                </el-form-item>
+                <el-form-item label="员工性别" :label-width="formLabelWidth" prop="empGender">
+                  <el-radio-group v-model="emp.empGender">
+                    <el-radio :label="1">男</el-radio>
+                    <el-radio :label="2">女</el-radio>
+                  </el-radio-group>
+                </el-form-item>
+                <el-form-item label="员工住址" :label-width="formLabelWidth" prop="empAddress">
+                  <el-input v-model="emp.empAddress" autocomplete="off"></el-input>
+                </el-form-item>
+                <el-form-item label="员工薪资" :label-width="formLabelWidth" prop="empSal">
+                  <el-input v-model="emp.empSal" autocomplete="off"></el-input>
+                </el-form-item>
+                <el-form-item label="员工角色" :label-width="formLabelWidth" prop="empSal">
+                  <el-select v-model="emp.roleId" clearable placeholder="请选择">
+                    <el-option v-for="item in roles" :key="item.roleId" :label="item.roleName" :value="item.roleId"></el-option>
+                  </el-select>
+                </el-form-item>
+                <el-form-item label="员工岗位" :label-width="formLabelWidth" prop="empSal">
+                  <el-select v-model="emp.postId" clearable placeholder="请选择">
+                    <el-option v-for="item in posts" :key="item.postId" :label="item.postName" :value="item.postId"></el-option>
+                  </el-select>
+                </el-form-item>
+              </el-form>
+              <div slot="footer" class="dialog-footer">
+                <el-button @click="dialogFormVisible4 = false">取 消</el-button>
+                <el-button type="primary" @click="updateEmp">确 定</el-button>
+              </div>
+            </el-dialog>
           </el-tab-pane>
         </el-tabs>
       </el-tab-pane>
@@ -157,6 +332,7 @@
 
 import { add, batchDel, del, fetchManager, findById, update } from '@/api/manager'
 import { fetchEmp } from '@/api/emp'
+import { findRoles, findPosts } from '@/api/role'
 
 export default {
   //import引入的组件需要注入到对象中才能使用
@@ -176,7 +352,11 @@ export default {
         empAge: null,
         empGender: null,
         empAddress: '',
-        empSal: null
+        empSal: null,
+        roleId: null,
+        roleName: '',
+        postId: null,
+        postName: ''
       },
       empRequest: {
         empId: null,
@@ -221,12 +401,15 @@ export default {
           { required: true, message: '请输入薪资', trigger: 'blur' },
           { pattern: /^(\d+|\d+\.\d+)$/, message: '只能输入数字', trigger: 'blur' }
         ]
-      }
+      },
+      roles: [],
+      posts: []
     }
   },
   methods: {
     fetchManager() {
       fetchManager(this.empRequest).then(res => {
+        this.empResponse.list = []
         this.empResponse = res.data
       })
     },
@@ -284,11 +467,65 @@ export default {
         this.$message.success(res.msg)
         this.fetchManager()
       })
+    },
+    fetchEmp(){
+      fetchEmp(this.empRequest).then(res =>{
+        console.log(res)
+        this.empResponse.list = []
+        this.empResponse = res.data
+      })
+    },
+    addEmp() {
+      add(this.emp).then(res => {
+        this.$message.success(res.msg)
+        this.dialogFormVisible3 = false
+        this.emp = {}
+        this.fetchManager()
+      })
+    },
+    openEmp(empId){
+      this.dialogFormVisible4 = true
+      findById(empId).then(res =>{
+        this.emp = res.data
+      })
+    },
+    updateEmp() {
+      update(this.emp).then(res => {
+        this.$message.success(res.msg)
+        this.dialogFormVisible4 = false
+        this.emp = {}
+        this.fetchManager()
+      })
+    },
+    delEmp(empId){
+      del(empId).then(res =>{
+        this.$message.success(res.msg)
+        this.fetchManager()
+      })
+    },
+    batchDelEmp() {
+      batchDel(this.multipleSelection.map(item => item.empId)).then(res => {
+        this.$message.success(res.msg)
+        this.fetchManager()
+      })
+    },
+    findRoles() {
+      findRoles().then(res => {
+        this.roles = res.data
+      })
+    },
+    findPosts() {
+      findPosts().then(res => {
+        this.posts = res.data
+      })
     }
   },
   //声明周期 - 创建完成（可以访问当前this实例）,
   created() {
     this.fetchManager()
+    this.findRoles()
+    this.findPosts()
+    this.fetchEmp()
   }
 }
 </script>