城市下拉框

src/api/system/js.js

@@ -95,4 +95,13 @@ export function block(data) {
     method: 'post',
     data:data
   })
+}
+
+// 獲取部門
+export function getDept(data) {
+  return request({
+    url: '/system/dept/list',
+    method: 'get',
+    data:data
+  })
 }

src/views/technician/details/details.vue

@@ -1,13 +1,13 @@
 <template>
   <!-- 查看技师详情 -->
   <div class="details">
+    <div class="title">
+      基本信息
+    </div>
     <el-form :model="uploadInfos" label-position="left">
       <el-form-item label="姓名：">
         <el-input v-model="jsInfos.cName"></el-input>
       </el-form-item>
-      <el-form-item label="昵称：">
-        <el-input v-model="jsInfos.cNickName"></el-input>
-      </el-form-item>
       <el-form-item label="性别：">
         <el-radio-group v-model="jsInfos.nSex">
           <el-radio :label="0">女</el-radio>
@@ -17,24 +17,27 @@
       <el-form-item label="电话：">
         <el-input v-model="jsInfos.cPhone"></el-input>
       </el-form-item>
+      <el-form-item label="城市：">
+        <el-select v-model="jsInfos.city" placeholder="请选择" @change="handleSelectionChange">
+          <el-option v-for="item in options" :key="item.deptId" :label="item.deptName" :value="item.deptName">
+          </el-option>
+        </el-select>
+      </el-form-item>
+      <div class="title">
+        详细信息
+      </div>
+      <el-form-item label="昵称：">
+        <el-input v-model="jsInfos.cNickName"></el-input>
+      </el-form-item>
       <el-form-item label="头像：">
         <!-- <el-input v-model="jsInfos.cName"></el-input> -->
         <!-- <div class="image">
 
            <img :src="jsInfos.cPortrait" alt="" />
          </div> -->
-        <el-upload
-          action="#"
-          class="avatar-uploader"
-          :http-request="handleAvatarSuccess"
-          :before-upload="beforeAvatarUpload"
-          :show-file-list="false"
-        >
-          <img
-            v-if="jsInfos.cPortrait"
-            :src="jsInfos.cPortrait"
-            class="avatar"
-          />
+        <el-upload action="#" class="avatar-uploader" :http-request="handleAvatarSuccess"
+          :before-upload="beforeAvatarUpload" :show-file-list="false">
+          <img v-if="jsInfos.cPortrait" :src="jsInfos.cPortrait" class="avatar" />
           <i v-else class="el-icon-plus avatar-uploader-icon"></i>
         </el-upload>
       </el-form-item>
@@ -48,21 +51,12 @@
         </div> -->
         <div class="allbox">
           <div class="imgslist">
-            <div
-              class="imgs"
-              v-for="(item, index) in jsInfos.cSfzImg"
-              :key="index"
-            >
+            <div class="imgs" v-for="(item, index) in jsInfos.cSfzImg" :key="index">
               <img :src="item" alt="" />
               <div class="ifnone" @click="removesfzImgs(index)">删除</div>
             </div>
-            <el-upload
-              class="images_box"
-              action="#"
-              :http-request="handlesfzSuccess"
-              :before-upload="beforesfzImagesUpload"
-              :show-file-list="false"
-            >
+            <el-upload class="images_box" action="#" :http-request="handlesfzSuccess"
+              :before-upload="beforesfzImagesUpload" :show-file-list="false">
               <i class="el-icon-plus avatar-uploader-icon"></i>
             </el-upload>
           </div>
@@ -81,19 +75,8 @@
         <el-input v-model="uploadInfos.cName"></el-input>
       </el-form-item> -->
       <el-form-item label="项目：">
-        <el-select
-          v-model="jsProjectList"
-          multiple
-          filterable
-          allow-create
-          value-key="cId"
-        >
-          <el-option
-            v-for="item in projectList"
-            :key="item.cId"
-            :label="item.cTitle"
-            :value="item"
-          ></el-option>
+        <el-select v-model="jsProjectList" multiple filterable allow-create value-key="cId">
+          <el-option v-for="item in projectList" :key="item.cId" :label="item.cTitle" :value="item"></el-option>
         </el-select>
       </el-form-item>
       <el-form-item label="生活照：">
@@ -103,21 +86,12 @@
          </div> -->
         <div class="allbox">
           <div class="imgslist">
-            <div
-              class="imgs"
-              v-for="(item, index) in jsInfos.cImgList"
-              :key="index"
-            >
+            <div class="imgs" v-for="(item, index) in jsInfos.cImgList" :key="index">
               <img :src="item" alt="" />
               <div class="ifnone" @click="removeLifeImgs(index)">删除</div>
             </div>
-            <el-upload
-              class="images_box"
-              action="#"
-              :http-request="handleLifeSuccess"
-              :before-upload="beforeLifeImagesUpload"
-              :show-file-list="false"
-            >
+            <el-upload class="images_box" action="#" :http-request="handleLifeSuccess"
+              :before-upload="beforeLifeImagesUpload" :show-file-list="false">
               <i class="el-icon-plus avatar-uploader-icon"></i>
             </el-upload>
           </div>
@@ -149,21 +123,13 @@
       </el-form-item> -->
 
       <div style="text-align: justify; margin-top: 20px; margin-bottom: 20px">
-        <el-button type="primary" @click="addComplaintShow(jsInfos.id)"
-          >添加评论</el-button
-        >
-        <el-button type="primary" @click="work" v-if="jsInfos.nStatus2 == -1"
-          >上 岗</el-button
-        >
+        <el-button type="primary" @click="addComplaintShow(jsInfos.id)">添加评论</el-button>
+        <el-button type="primary" @click="work" v-if="jsInfos.nStatus2 == -1">上 岗</el-button>
         <el-button type="primary" @click="work" v-else>下 岗</el-button>
         <el-button type="primary" @click="auditJs(jsInfos.id)">审 核</el-button>
-        <el-button type="primary" @click="returnJs(jsInfos.id)"
-          >退 回</el-button
-        >
+        <el-button type="primary" @click="returnJs(jsInfos.id)">退 回</el-button>
         <el-button type="primary" @click="submitForm">修 改</el-button>
-        <el-button type="primary" @click="blacklist" v-if="jsInfos.nTong == 3"
-          >恢 复</el-button
-        >
+        <el-button type="primary" @click="blacklist" v-if="jsInfos.nTong == 3">恢 复</el-button>
         <el-button type="primary" @click="blacklist" v-else>拉 黑</el-button>
       </div>
       <div class="dialog-footer"></div>
@@ -177,24 +143,13 @@
     <el-dialog title="添加评论" :visible.sync="dialogFormVisible">
       <el-form :model="complainForm">
         <el-form-item label="评分:">
-          <el-input
-            type="number"
-            max="5"
-            min="0"
-            v-model="complainForm.nStar"
-            autocomplete="off"
-          ></el-input>
+          <el-input type="number" max="5" min="0" v-model="complainForm.nStar" autocomplete="off"></el-input>
         </el-form-item>
         <el-form-item label="内容:">
           <el-input v-model="complainForm.cText" autocomplete="off"></el-input>
         </el-form-item>
         <el-form-item label="时间:">
-          <el-date-picker
-            v-model="complainForm.dTime"
-            type="datetime"
-            placeholder="选择日期时间"
-            default-time="12:00:00"
-          >
+          <el-date-picker v-model="complainForm.dTime" type="datetime" placeholder="选择日期时间" default-time="12:00:00">
           </el-date-picker>
         </el-form-item>
       </el-form>
@@ -207,6 +162,10 @@
 </template>
 
 <script>
+
+
+
+
 import {
   listJs,
   getJs,
@@ -219,11 +178,15 @@ import {
   getProject,
   changeWork,
   block,
+  getDept,
 } from "@/api/system/js";
 import { upload } from "@/api/public";
 export default {
   data() {
     return {
+      options: [],
+        value: '',
+
       dialogFormVisible: false,
       jsInfos: {},
       uploadInfos: {
@@ -244,8 +207,22 @@ export default {
     this.complainForm.cJsid = this.$route.query.id;
     this.getJsInfo();
     this.getProjictList();
+    this.getDept();
   },
   methods: {
+
+    handleSelectionChange(value){
+        console.log(value);
+    },
+
+    getDept(){
+      getDept().then(res=>{
+        if(res.code == 200){
+          this.options = res.data;
+        }
+      })
+    },
+
     getProjictList() {
       getProject({}).then((res) => {
         if (res.code == 200) {
@@ -267,7 +244,7 @@ export default {
         });
         var imgs = [];
         var imgs2 = [];
-        response.data.cPortrait == "" ? response.data.cPortrait = "": this.jsInfos.cPortrait =process.env.VUE_APP_BASE_API + response.data.cPortrait;
+        response.data.cPortrait == "" ? response.data.cPortrait = "" : this.jsInfos.cPortrait = process.env.VUE_APP_BASE_API + response.data.cPortrait;
 
         // response.data.cImgList.length == 0 ? this.jsInfos.cImgList = [] : response.data.cImgList.forEach((element) => {
         //   element = process.env.VUE_APP_BASE_API + element;
@@ -547,7 +524,7 @@ export default {
           });
         });
     },
-    rest() {},
+    rest() { },
   },
 };
 </script>
@@ -556,23 +533,36 @@ export default {
 .el-form-item {
   align-items: center;
 }
+
 .details {
   padding: 20px;
+
+  .title {
+    border-left: 3px solid #2cb8d4;
+    padding-left: 5px;
+    font-size: 30rpx;
+    margin-top: 10px;
+    text-align: left;
+  }
+
   .image {
     width: 100px;
     height: 100px;
     display: flex;
     margin-right: 20px;
+
     img {
       width: 100%;
     }
   }
 }
+
 .images_box {
   width: 100px;
   height: 100px;
   float: left;
 }
+
 .imgslist .imgs {
   float: left;
   margin-right: 10px;
@@ -582,6 +572,7 @@ export default {
   margin-bottom: 10px;
   cursor: pointer;
 }
+
 .imgslist .imgs:hover:before {
   content: "";
   position: absolute;
@@ -592,6 +583,7 @@ export default {
   background: rgba(0, 0, 0, 0.5);
   color: #fff;
 }
+
 .imgslist .imgs .ifnone {
   position: absolute;
   top: 0;
@@ -602,27 +594,34 @@ export default {
   text-align: center;
   line-height: 100px;
 }
+
 .imgslist .imgs:hover .ifnone {
   display: block;
 }
+
 .images_box {
   float: left;
 }
+
 .imgslist img {
   width: 100px;
   height: 100px;
 }
+
 .el-form-item {
   display: flex;
+
   ::v-deep .el-form-item__label {
     width: 9%;
     text-align: left;
   }
+
   ::v-deep.el-form-item__content {
     flex: 1;
     display: flex;
   }
 }
+
 .avatar-uploader .el-upload {
   border: 1px dashed #d9d9d9;
   border-radius: 6px;
@@ -630,9 +629,11 @@ export default {
   position: relative;
   overflow: hidden;
 }
+
 .avatar-uploader .el-upload:hover {
   border-color: #409eff;
 }
+
 .avatar-uploader-icon {
   font-size: 28px;
   color: #8c939d;
@@ -641,15 +642,18 @@ export default {
   line-height: 100px;
   text-align: center;
 }
+
 .avatar {
   width: 100px;
   height: 100px;
   display: block;
 }
+
 .el-pagination {
   float: right;
   padding: 30px 0;
 }
+
 ::v-deep .el-select {
   width: 100%;
 }