指派工人弹窗样式重构

src/api/apiList.js

@@ -10,8 +10,8 @@ const baseUrl = '/api'
 // todo: url
 // const httpUrl = 'https://repairtest.zeruiedu.com' // 测试接口
 const httpUrl = 'https://repair.zeruiedu.com' // 正式接口
-// const h5Url = 'http://localhost:8080' // 测试h5线上地址
-const h5Url = 'http://repair.h5.zeruiedu.com' // 测试h5线上地址
+const h5Url = 'http://localhost:8080' // 测试h5线上地址
+// const h5Url = 'http://repair.h5.zeruiedu.com' // 测试h5线上地址
 window.localStorage.setItem('httpUrl', httpUrl)
 window.localStorage.setItem('h5Url', h5Url)
 // const httpUrl = 'https://fenghexm.xueyoubangedu.com' // 正式接口

src/assets/styles/tabbar/admin_index.scss

@@ -355,37 +355,32 @@
 // 选择工人弹窗样式
 .tc-box{
     width: 6.9rem;
+    height: 7rem;
     background: #fff;
-    padding-top: 0.3rem;
-    padding-left: 0.3rem;
-    padding-right: 0.3rem;
-    padding-bottom: 0.3rem;
+    padding: 0.3rem;
 }
 .tc-box .tc-title{
     color: #000000;
-    font-size: 0.26rem;
+    font-size: 0.28rem;
     margin-bottom: 0.3rem;
     font-weight: bold;
     text-align: center;
 }
-.tc-box .workers .worker-item{
-    width: 2rem;
-    height: 0.6rem;
-    background: #f2f2f2;
-    text-align: center;
-    line-height: 0.6rem;
-    border-radius: 0.35rem;
-    margin-bottom: 0.2rem;
+.tc-box .workers .gr-item{
+    margin-bottom: 0.4rem;
 }
-.tc-box .workers .activeItem {
-    width: 2rem;
-    height: 0.6rem;
-    background: #0054FF;
-    color: #fff;
-    text-align: center;
-    line-height: 0.6rem;
-    border-radius: 0.35rem;
-    margin-bottom: 0.2rem;
+.tc-box .workers .gr-item .gr-img {
+    width: 0.56rem;
+    height: 0.56rem;
+    margin-right: 0.27rem;
+}
+.tc-box .workers .gr-item .gr-name{
+    color: #000000;
+    font-size: 0.28rem;
+}
+.tc-box .workers .k-img {
+    width: 0.42rem;
+    height: 0.42rem;
 }
 .btn-box{
     margin-top: 0.6rem;

src/views/tabbar/admin_home.vue

@@ -55,13 +55,23 @@
             />-->
             <div class="tc-box">
               <div class="tc-title">选择工人</div>
-              <div class="workers flex-h flex-hw flex-hb">
-                <div
-                  :class="item.worker_id && item.worker_id.includes(child_item.id) ? 'activeItem' : 'worker-item'"
-                  @click="selectWorker(child_index,child_item,index)"
+              <div class="workers">
+                <!-- :class="item.worker_id && item.worker_id.includes(child_item.id) ? 'activeItem' : 'worker-item'" -->
+                <div class="gr-item flex-h flex-vc flex-hb" @click="selectWorker(child_index,child_item,index)"
                   v-for="(child_item,child_index) in columns"
                   :key="child_index"
-                >{{child_item.name}}</div>
+                >
+                <div class="flex-h flex-vc">
+                  <img class="gr-img" src="@assets/images/gr.png" />
+                  <div class="gr-name" v-if="child_item.repired_count !== 0 || child_item.repiring_count !== 0">
+                    {{child_item.name}} (已派工: {{child_item.repired_count}};维修中: {{child_item.repiring_count}})
+                  </div>
+                  <div class="gr-name" v-else>
+                    {{child_item.name}} (休息中)
+                  </div>
+                </div>
+                  <img class="k-img" :src="item.worker_id && item.worker_id.includes(child_item.id) ? select_img : unselect_img" />
+                </div>
               </div>
               <div class="allBtn btn-box flex-h flex-hc">
                 <div class="button" @click="Cancel(index)">取消</div>
@@ -215,6 +225,8 @@
 import myTabbar from '@components/common/tabbar.vue'
 import { trimStrSpace } from '@assets/js/format.js'
 import { ImagePreview, CellGroup } from 'vant';
+import select_img from '@assets/images/select.png'
+import unselect_img from '@assets/images/un_select.png'
 export default {
     name: 'home',
     components: {
@@ -222,6 +234,8 @@ export default {
     },
     data () {
         return {
+          select_img,
+          unselect_img,
             reson: '',//取消原因
             qxShow: false, // 发起转单弹窗
             workerName: '',
@@ -455,7 +469,9 @@ export default {
                             let options = {
                               name: data[i].name,
                               id: data[i].id,
-                              isCheck: false
+                              isCheck: false,
+                              repired_count: data[i].repired_count,
+                              repiring_count: data[i].repiring_count,
                             }
                             arr.push(options); //属性
                           }