Browse Source

feat: add upload

wangyuan 2 years ago
parent
commit
cf6b21c84d

+ 4 - 1
ittpc/src/request/axios.js

@@ -1,4 +1,5 @@
 import axios from 'axios'
+import Router from '../router/index'
 import { Message, MessageBox } from 'element-ui';
 const service = axios.create({
   timeout: 10000
@@ -32,7 +33,9 @@ const service = axios.create({
           beforeClose: function (action, instance, done) {
             if (action == 'confirm') {
               sessionStorage.clear()
-              window.location.href = '/login'
+              Router.replace({
+                path: '/login'
+              })
             }
           }
         })

+ 17 - 0
ittpc/src/request/request.js

@@ -32,9 +32,18 @@ const cancelAppointmentURL = BASE_API + '/cancel/appointment/v1'
 // 地区列表
 const getRegionListURL = BASE_API + '/get/region/list/v1'
 
+// 添加地区
+const addRegionURL = BASE_API + '/add/region/v1'
+
+// 编辑地区
+const editRegionURL = BASE_API + '/edit/region/v1'
+
 // 配置地区可预约次数
 const setRegionConfigURL = BASE_API + '/set/region/config/v1'
 
+// 图片上传
+export const userUploadHeadImg = BASE_API + '/user/upload/headImg/v1'
+
 export const pwdLogin = (data) => {
   return request.post(pwdLoginURL, data)
 }
@@ -75,6 +84,14 @@ export const getRegionList = (data) => {
   return request.post(getRegionListURL, data)
 }
 
+export const addRegion = (data) => {
+  return request.post(addRegionURL, data)
+}
+
+export const editRegion = (data) => {
+  return request.post(editRegionURL, data)
+}
+
 export const setRegionConfig = (data) => {
   return request.post(setRegionConfigURL, data)
 }

+ 1 - 0
ittpc/src/views/modules/appointment/appointment.vue

@@ -31,6 +31,7 @@
           <el-form-item label="省/市/区">
             <el-cascader style="width:230px;"
               :options="options"
+              :props="{ checkStrictly: true }"
               v-model="selectedOptions"
               @change="handleChange">
             </el-cascader>

+ 64 - 11
ittpc/src/views/modules/staff/query.vue

@@ -80,10 +80,23 @@
             <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-col :span="24" style="display:flex;align-itmes:center;">
+              <el-avatar :size="40" :src="addForm.headImg" style="margin:0 20px">
+                <img src="https://cube.elemecdn.com/e/fd/0fc7d20532fdaf769a25683617711png.png"/>
+              </el-avatar>
+              <el-upload
+                class="upload-demo"
+                accept=".jepg,.png,.jpg"
+                :action="action"
+                :on-success="onAddSuccess"
+                :on-error="onAddError"
+                :on-preview="onAddPreview"
+                :headers="uploadHeaders"
+                :show-file-list="false"
+                :file-list="fileList">
+                <el-button size="small" type="primary">选择头像</el-button>
+              </el-upload>
+            </el-col>
           </el-form-item>
           <el-form-item label="状态">
             <!-- 状态 true 启用,false 禁用 -->
@@ -109,10 +122,23 @@
             <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-col :span="24" style="display:flex;align-itmes:center;">
+              <el-avatar :size="40" :src="editForm.headImg" v-if="editForm.realName !== null" style="margin:0 20px">
+                <img src="https://cube.elemecdn.com/e/fd/0fc7d20532fdaf769a25683617711png.png"/>
+              </el-avatar>
+              <el-upload
+                class="upload-demo"
+                accept=".jepg,.png,.jpg"
+                :action="action"
+                :on-success="onEditSuccess"
+                :on-error="onEditError"
+                :on-preview="onEditPreview"
+                :headers="uploadHeaders"
+                :show-file-list="false"
+                :file-list="fileList">
+                <el-button size="small" type="primary">选择头像</el-button>
+              </el-upload>
+            </el-col>
           </el-form-item>
           <el-form-item label="状态">
             <!-- 状态 true 启用,false 禁用 -->
@@ -132,7 +158,7 @@
 </template>
 
 <script>
-import { getWorkerList, addWorkerList, editWorkerList } from '@/request/request'
+import { getWorkerList, addWorkerList, editWorkerList, userUploadHeadImg } from '@/request/request'
 export default {
   data() {
     return {
@@ -141,6 +167,11 @@ export default {
       addDialogVisible: false,
       editLoading: false,
       editDialogVisible: false,
+      fileList: [],
+      uploadHeaders: {
+        AccessToken: sessionStorage.getItem('AccessToken') || ''
+      },
+      action: userUploadHeadImg,
       searchForm: {
         realName: ''
       },
@@ -157,7 +188,7 @@ export default {
         password: '',
         realName: '',
         status: '1',
-        headImg: 'https://ittfile.chl6zk.store/img/13/20221014/156cb2aeca7d48b2a86237a2b482e96f.png'
+        headImg: ''
       },
       addFormRules: {
         username: [
@@ -226,6 +257,28 @@ export default {
     handleCancelEdit () {
       this.editDialogVisible = false
     },
+    onEditSuccess (response, file, fileList) {
+      this.editLoading = false
+      this.editForm.headImg = response.data
+    },
+    onEditError (err, file, fileList) {
+      this.editLoading = false
+      this.$message.error('头像上传失败,请重新上传!')
+    },
+    onEditPreview () {
+      this.editLoading = true
+    },
+    onAddSuccess (response, file, fileList) {
+      this.addLoading = false
+      this.addForm.headImg = response.data
+    },
+    onAddError (err, file, fileList) {
+      this.addLoading = false
+      this.$message.error('头像上传失败,请重新上传!')
+    },
+    onAddPreview () {
+      this.addLoading = true
+    },
     handleSubmitEdit () {
       this.$refs['editForm'].validate((valid) => {
         if (valid) {
@@ -294,7 +347,7 @@ export default {
       this.addForm.username = ''
       this.addForm.password= ''
       this.addForm.realName = ''
-      // this.addForm.headImg = ''
+      this.addForm.headImg = ''
       this.addForm.status = '1'
     },
     handleAddDialogClose () {