feat: staff add & edit

ittpc/src/request/request.js

@@ -14,6 +14,12 @@ const getOperatorListURl = BASE_API + '/get/operator/list/v1'
 // 工作人员列表
 const getWorkerListURL = BASE_API + '/get/worker/list/v1'
 
+// 工作人员新增
+const addWorkerListURL = BASE_API + '/add/worker/list/v1'
+
+// 工作人员编辑
+const editWorkerListURl = BASE_API + '/edit/worker/list/v1'
+
 // 工作人员服务记录
 const getWorkerServiceURL = BASE_API + '/get/worker/service/v1'
 
@@ -45,6 +51,14 @@ export const getWorkerList = (data) => {
   return request.post(getWorkerListURL, data)
 }
 
+export const addWorkerList = (data) => {
+  return request.post(addWorkerListURL, data)
+}
+
+export const editWorkerList = (data) => {
+  return request.post(editWorkerListURl, data)
+}
+
 export const getWorkerService = (data) => {
   return request.post(getWorkerServiceURL, data)
 }

ittpc/src/views/modules/appointment/appointment.vue

@@ -65,7 +65,7 @@
           <el-table-column prop="addTime" label="预约申请时间" align="center"></el-table-column>
           <el-table-column prop="" label="操作" align="center">
             <template slot-scope="scope">
-              <el-button type="text" size="mini" :disabled="scope.row.status !== 1" @click="handleCancelAppoint(scope.row)">取消预约</el-button>
+              <el-button type="text" :disabled="scope.row.status !== 1" @click="handleCancelAppoint(scope.row)">取消预约</el-button>
             </template>
           </el-table-column>
         </el-table>

ittpc/src/views/modules/config/config.vue

@@ -24,8 +24,8 @@
           </el-table-column>
           <el-table-column prop="times" label="预约次数配置" align="center">
             <template slot-scope="scope">
-              <el-button type="text" size="small" @click="handleEdit(scope.row)">编辑</el-button>
-              <el-button type="text" size="small" @click="handleView(scope.row)">查看</el-button>
+              <el-button plain size="mini" @click="handleEdit(scope.row)">编辑</el-button>
+              <el-button plain size="mini" @click="handleView(scope.row)">查看</el-button>
             </template>
           </el-table-column>
           <!-- <el-table-column label="操作">

ittpc/src/views/modules/staff/query.vue

@@ -1,7 +1,7 @@
 <template>
-  <div class="staff-page-query" v-loading="loading" element-loading-text="加载中" element-loading-spinner="el-icon-loading">
+  <div class="staff-page-query">
     <el-row>
-      <el-col :span="24" class="padding20">
+      <el-col :span="24" class="padding20 no-padding-bottom">
         <el-form :inline="true" :model="searchForm" class="demo-form-inline" size="small">
           <el-form-item label="真实姓名">
             <el-input v-model="searchForm.realName" placeholder="请输入真实姓名"></el-input>
@@ -13,6 +13,11 @@
         </el-form>
       </el-col>
     </el-row>
+    <el-row>
+      <el-col :span="24" class="padding20 no-padding-top">
+        <el-button size="small" type="primary" @click="handleAdd" style="width:100px">新增</el-button>
+      </el-col>
+    </el-row>
     <el-row>
       <el-col :span="24" class="padding20 no-padding-top">
         <el-table :data="tableData" border stripe style="width: 100%" size="small" max-height="700" v-loading="loading" element-loading-text="加载中" element-loading-spinner="el-icon-loading">
@@ -42,8 +47,8 @@
           <!-- <el-table-column prop="admin" label="是否为管理员" align="center"></el-table-column> -->
           <el-table-column label="操作" align="center">
             <template slot-scope="scope">
-              <!-- <el-button type="text" size="small" @click="handleCancelAdmin(scope.row)">取消管理员</el-button> -->
-              <el-button type="text" size="small" @click="handleServeRecord(scope.row)">服务记录</el-button>
+              <el-button plain size="mini" @click="handleServeRecord(scope.row)">服务记录</el-button>
+              <el-button plain size="mini" @click="handleEdit(scope.row)">编辑</el-button>
             </template>
           </el-table-column>
         </el-table>
@@ -62,18 +67,117 @@
         </el-pagination>
       </el-col>
     </el-row>
+    <el-dialog title="新增" :visible.sync="addDialogVisible" width="700px" @closed="handleAddDialogClose">
+      <div class="staff-add" v-loading="addLoading" element-loading-text="加载中" element-loading-spinner="el-icon-loading">
+        <el-form label-width="100px" :model="addForm" class="demo-form-inline" size="small" :rules="addFormRules" ref="addForm">
+          <el-form-item label="登录名" prop="username">
+            <el-input v-model="addForm.username" placeholder="请输入登录名"></el-input>
+          </el-form-item>
+          <el-form-item label="密码" prop="password">
+            <el-input maxlength="20" v-model="addForm.password" show-password placeholder="请输入密码"></el-input>
+          </el-form-item>
+          <el-form-item label="真实姓名" prop="realName">
+            <el-input v-model="addForm.realName" placeholder="请输入真实姓名"></el-input>
+          </el-form-item>
+          <el-form-item label="头像" prop="headImg">
+            <el-avatar :size="40" :src="addForm.headImg">
+              <img src="https://cube.elemecdn.com/e/fd/0fc7d20532fdaf769a25683617711png.png"/>
+            </el-avatar>
+            <el-button type="text">选择头像</el-button>
+          </el-form-item>
+          <el-form-item label="状态">
+            <!-- 状态 true 启用，false 禁用 -->
+            <el-select style="width:100%"  v-model="addForm.status" placeholder="请选择">
+              <el-option label="启用" value="1"></el-option>
+              <el-option label="禁用" value="0"></el-option>
+            </el-select>
+          </el-form-item>
+        </el-form>
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button size="small" class="width100" @click="handleCancelAdd">取 消</el-button>
+        <el-button type="primary" size="small" class="width100" @click="handleSubmitAdd" :disabled="addLoading">确 定</el-button>
+      </span>
+    </el-dialog>
+    <el-dialog title="编辑" :visible.sync="editDialogVisible" width="700px" @closed="handleEditDialogClose">
+      <div class="staff-add" v-loading="editLoading" element-loading-text="加载中" element-loading-spinner="el-icon-loading">
+        <el-form label-width="100px" :model="editForm" class="demo-form-inline" size="small" :rules="editFormRules" ref="editForm">
+          <el-form-item label="密码" prop="password">
+            <el-input maxlength="20" v-model="editForm.password" :disabled="editForm.password == null" show-password placeholder="请输入密码"></el-input>
+          </el-form-item>
+          <el-form-item label="真实姓名" prop="realName">
+            <el-input v-model="editForm.realName" :disabled="editForm.realName == null" placeholder="请输入真实姓名"></el-input>
+          </el-form-item>
+          <el-form-item label="头像" prop="headImg">
+            <el-avatar :size="40" :src="editForm.headImg" v-if="editForm.realName !== null">
+              <img src="https://cube.elemecdn.com/e/fd/0fc7d20532fdaf769a25683617711png.png"/>
+            </el-avatar>
+            <el-button type="text" :disabled="editForm.realName == null">选择头像</el-button>
+          </el-form-item>
+          <el-form-item label="状态">
+            <!-- 状态 true 启用，false 禁用 -->
+            <el-select style="width:100%"  v-model="editForm.status" :disabled="editForm.status == null" placeholder="请选择">
+              <el-option label="启用" value="1"></el-option>
+              <el-option label="禁用" value="0"></el-option>
+            </el-select>
+          </el-form-item>
+        </el-form>
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button size="small" class="width100" @click="handleCancelEdit">取 消</el-button>
+        <el-button type="primary" size="small" class="width100" @click="handleSubmitEdit" :disabled="editLoading">确 定</el-button>
+      </span>
+    </el-dialog>
   </div>
 </template>
 
 <script>
-import { getWorkerList } from '@/request/request'
+import { getWorkerList, addWorkerList, editWorkerList } from '@/request/request'
 export default {
   data() {
     return {
       loading: false,
+      addLoading: false,
+      addDialogVisible: false,
+      editLoading: false,
+      editDialogVisible: false,
       searchForm: {
         realName: ''
       },
+      editForm: {
+        password: '',
+        workerId: '',
+        realName: '',
+        headImg: '',
+        status: '0'
+      },
+      addForm: {
+        workerId: '',
+        username: '',
+        password: '',
+        realName: '',
+        status: '1',
+        headImg: 'https://ittfile.chl6zk.store/img/13/20221014/156cb2aeca7d48b2a86237a2b482e96f.png'
+      },
+      editFormRules: {
+        workerId: [
+          { required: true, message: '请输入工作人员ID', trigger: 'change' }
+        ]
+      },
+      addFormRules: {
+        username: [
+          { required: true, message: '请输入登录名', trigger: 'change' }
+        ],
+        password: [
+          { required: true, message: '请输入密码', trigger: 'change' }
+        ],
+        realName: [
+          { required: true, message: '请输入真实姓名', trigger: 'change' }
+        ],
+        headImg: [
+          { required: true, message: '请选择头像', trigger: 'change' }
+        ]
+      },
       tableData: [],
       currentPage: 1,
       pageSize: 20,
@@ -107,6 +211,104 @@ export default {
         this.loading = false
       })
     },
+    handleAdd () {
+      this.addDialogVisible = true
+    },
+    handleEdit (row) {
+      this.editDialogVisible = true
+      this.editForm.workerId = row.workerId ? row.workerId : null
+      this.editForm.headImg = row.headImg ? row.headImg : null
+      this.editForm.realName = row.workerName ? row.workerName : null
+      this.editForm.password = row.password ? row.password : null
+      if (row.status == null) {
+        this.editForm.status = null
+      } else if (row.status == true) {
+        this.editForm.status = '1'
+      } else if (row.status == false) {
+        this.editForm.status = '0'
+      }
+    },
+    handleCancelEdit () {
+      this.editDialogVisible = false
+    },
+    handleSubmitEdit () {
+      this.$refs['editForm'].validate((valid) => {
+        if (valid) {
+          let data = {
+            workerId: this.editForm.workerId
+          }
+          if (this.editForm.headImg !== null) {
+            data.headImg = this.editForm.headImg
+          }
+          if (this.editForm.password !== null) {
+            data.password = this.editForm.password
+          }
+          if (this.editForm.realName !== null) {
+            data.realName = this.editForm.realName
+          }
+          if (this.editForm.status !== null) {
+            data.status = !!Number(this.editForm.status)
+          }
+          this.editLoading = true
+          editWorkerList(data).then(res => {
+            this.editLoading = false
+            this.editDialogVisible = false
+            this.$message({
+              message: '修改成功',
+              type: 'success'
+            })
+            this.getWorkerListFn()
+          }).catch(e => {
+            this.editLoading = false
+            console.log(e);
+          })
+        }
+      })
+    },
+    handleSubmitAdd () {
+      this.$refs['addForm'].validate((valid) => {
+        if (valid) {
+          let data = {
+            username: this.addForm.username,
+            password: this.addForm.password,
+            realName: this.addForm.realName,
+            status: !!Number(this.addForm.status),
+            headImg: this.addForm.headImg
+          }
+          this.addLoading = true
+          addWorkerList(data).then(res => {
+            this.addLoading = false
+            this.handleCancelAdd()
+            this.$message({
+              message: '新增成功',
+              type: 'success'
+            })
+            this.handleQuery()
+          }).catch(e => {
+            this.addLoading = false
+            console.log(e)
+          })
+        }
+      })
+    },
+    handleCancelAdd () {
+      this.addDialogVisible = false
+      this.resetaddForm()
+    },
+    resetaddForm () {
+      this.addForm.username = ''
+      this.addForm.password= ''
+      this.addForm.realName = ''
+      // this.addForm.headImg = ''
+      this.addForm.status = '1'
+    },
+    handleAddDialogClose () {
+      this.resetaddForm()
+      this.$refs.addForm.clearValidate()
+    },
+    handleEditDialogClose () {
+      this.$refs.editForm.clearValidate()
+    },
     handleCurrentChange (currentPage) {
       this.currentPage = currentPage
       this.getWorkerListFn()
@@ -135,9 +337,22 @@ export default {
   .no-padding-top {
     padding-top: 0;
   }
+  .no-padding-bottom {
+    padding-bottom: 0;
+  }
+  .width100 {
+    width: 100px;
+  }
   .flexend {
     display: flex;
     justify-content: flex-end;
   }
+  .staff-add {
+    width: 600px;
+    ::v-deep .el-select {
+      width: 100%
+    }
+  }
+  
 }
 </style>

ittpc/src/views/modules/staff/recoed.vue

@@ -9,7 +9,7 @@
     </el-row>
     <el-row>
       <el-col :span="24" class="padding10">
-        <el-button type="primary" size="mini" @click="handleRefresh">刷新</el-button>
+        <el-button type="primary" size="small" @click="handleRefresh">刷新</el-button>
       </el-col>
     </el-row>
     <el-row>

ittpc/src/views/modules/staff/staff.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="user-page">
+  <div class="staff-main-page">
     <transition name="el-fade-in-linear">
       <Query v-show="userModulesView == 0"></Query>
     </transition>
@@ -39,7 +39,7 @@ export default {
 </script>
 
 <style scoped lang="scss">
-.user-page {
+.staff-main-page {
   width: 100%;
   height: 100%;
 }