类型：开发

描述：

src/api/workOrder.js

@@ -7,7 +7,13 @@ export function getListApi() {
     method: 'get'
   })
 }
-
+// 统计
+export function getDetailApi(id) {
+  return request({
+    url: '/fjtcc-api/api/largeScreen/workorder/detail/'+id,
+    method: 'get'
+  })
+}
 // 统计
 export function getTotalApi() {
   return request({

src/views/hotel/components/video-box.vue

@@ -427,13 +427,12 @@
 	    cameraName: cameraName.value,
 	    businessScenicArea: params.businessScenicArea
 	  })
-	  console.log(res,11111111111111)
 	  regionList.value = res.data
 	  regionList.value.forEach((item,index)=>{
 	  	// item.show = true
 	  	item.videoResources=item.resourcesList[0].videoResources
 	  })
-	  regionList.value[0].show = true
+	  regionList.value[0].show = false
 
 	}
 	const handleRegions = (e) => {

src/views/scenic/components/box-1.vue

@@ -22,8 +22,8 @@
     </div>
     <div class="main">
 		<a @click="hanldeToDetails"  class="look-btn">
-			查看详情
+<!--			查看详情-->
-			<!-- <img src="@/assets/images/d-ico-1.png" /> -->
+			 <img src="@/assets/images/d-icon-1.png" />
 		</a>
       <iframe v-if="scenicSpotId == 'root000000'" width="100%" height="100%" src="/map/sxzd/bdc.html"></iframe>
       <iframe v-if="scenicSpotId == 'root00000000'" width="100%" height="100%" src="/map/sxzd/sxzd.html"></iframe>
@@ -110,10 +110,8 @@
           <template v-if="scenicSpotId == 'root00000000'">
             <div>徒步订票</div>
           </template>
-          <template v-else>
           <div>团队订票</div>
           <div>散客订票</div>
-          </template>
 	      </div>
 	      <div class="list">
 	        <div class="item" v-for="(item, index) in gridData" :key="index">
@@ -122,10 +120,8 @@
             <template v-if="scenicSpotId == 'root00000000'">
               <div>{{ item.walk }}</div>
             </template>
-            <template v-else>
             <div>{{ item.group }}</div>
             <div>{{ item.single }}</div>
-            </template>
 	        </div>
 	      </div>
 	    </div>
@@ -329,14 +325,14 @@ import pubSub from 'pubsub-js'
 		  padding: vw(20);
 		  display: flex;
 		  align-items: center;
-		  background: #0a4190;
+		  //background: #0a4190;
 		  border-radius: vw(4);
 		  font-size: vw(16);
 		  font-weight:700;
 		  color: #fff;
 		  z-index: 999;
 		  img{
-			  width:vw(100);
+			  width:vw(80);
 			  // height:;
 		  }
 	  }

src/views/scenic/components/box-2.vue

@@ -393,10 +393,11 @@
 	  hIndex.value = index;
   }
   const handlePop2 = async()=>{
+      if(props.scenicSpotId=="root00000000"){
         dialogTableVisible2.value = true
         let res = await getSpotPassengerFlow({scenicSpotId:props.scenicSpotId})
         tjArr.value = res.data
-  	  console.log(res,'res')
+      }
   }
   let show = ref(false)
   let scenicChange = null

src/views/workOrder/components/box-1.vue

@@ -8,24 +8,236 @@
         <span :class="item.level">{{ item.level_text }}</span>
         <p>{{ item.title }}</p>
         <span class="time">{{ item.time }}</span>
+        <span class="btn" @click="showDetail(item.id)">详情</span>
       </div>
     </div>
+    <el-dialog :title="'工单详情'" center v-model="dialogVisible">
+      <div class="bom-box">
+        <div class="modal-body">
+          <div class="m-modal">
+            <div class="item-title--primary">工单信息</div>
+            <div class="item-col">
+              <div class="detail-item">
+                <span class="label">所属景区：</span>
+                <span class="value">{{ detail.road }}</span>
+              </div>
+              <div class="detail-item">
+                <span class="label">工单类型：</span>
+                <span class="value">{{ detail.type }}</span>
+              </div>
+              <div class="detail-item">
+                <span class="label">紧急程度：</span>
+                <span :class="'value '+detail.level">{{ detail.levelText }}</span>
+              </div>
+            </div>
+            <div class="item-col">
+              <div class="detail-item">
+                <span class="label">具体地点：</span>
+                <span class="value">{{ detail.address }}</span>
+              </div>
+              <div class="detail-item">
+                <span class="label">创建时间：</span>
+                <span class="value">{{ detail.createTime }}</span>
+              </div>
+              <div class="detail-item">
+                <span class="label">完成期限：</span>
+                <span class="value">{{ detail.completionDeadline }}</span>
+              </div>
+            </div>
+            <div class="item-col">
+              <div class="detail-item">
+                <span class="label">创建人：</span>
+                <span class="value">{{ detail.unidName }}</span>
+              </div>
+              <div class="detail-item">
+                <span class="label">状态：</span>
+                <span class="value important" v-if="detail.status==0">待处理</span>
+                <span class="value warn" v-else-if="detail.status==1">进行中</span>
+                <span class="value normal" v-else-if="detail.status==2">已完成</span>
+                <span class="value" v-else>已关闭</span>
+              </div>
+              <div class="detail-item">
+                <span class="label">工单内容：</span>
+                <span class="value">{{ detail.title }}</span>
+              </div>
+            </div>
+            <div class="detail-item" v-if="detail.imgs">
+              <el-image class="img" :preview-src-list="detail.imgs.split(',')" :src="src" v-for="(src, index) in detail.imgs.split(',')"></el-image>
+            </div>
+            <div class="item-title--warning" v-if="detail.follow && detail.follow.length>0">跟进信息</div>
+            <template  v-for="item in detail.follow">
+              <div class="item-col" >
+                <div class="detail-item">
+                  <span class="label">跟进人：</span>
+                  <span class="value">{{ item.unidName }}</span>
+                </div>
+                <div class="detail-item">
+                  <span class="label">跟进地点：</span>
+                  <span class="value">{{ item.address }}</span>
+                </div>
+                <div class="detail-item">
+                  <span class="label">完成率：</span>
+                  <span class="value">{{ item.rate }}%</span>
+                </div>
+              </div>
+              <div class="item-col">
+                <div class="detail-item" style="flex: 2">
+                  <span class="label">跟进内容：</span>
+                  <span class="value">{{ item.title }}</span>
+                </div>
+                <div class="detail-item">
+                  <span class="label">跟进时间：</span>
+                  <span class="value">{{ item.createTime }}</span>
+                </div>
+              </div>
+              <div class="detail-item" v-if="item.img">
+                <el-image class="img" :preview-src-list="item.img.split(',')" :src="src" v-for="(src, index) in item.img.split(',')"></el-image>
+              </div>
+              <div style="border-bottom: 1px solid #ffffff;margin: 10px 0;"></div>
+            </template>
+            <div class="item-title--warning" v-if="detail.evaluate && detail.evaluate.length>0">评价信息</div>
+            <template v-for="item in detail.evaluate">
+              <div class="item-col" >
+                <div class="detail-item">
+                  <span class="label">评价人：</span>
+                  <span class="value warn">{{ item.unidName }}</span>
+                </div>
+                <div class="detail-item">
+                  <span class="label">评价内容：</span>
+                  <span class="value">{{ item.title }}</span>
+                </div>
+                <div class="detail-item">
+                  <span class="label">评价时间：</span>
+                  <span class="value">{{ item.createTime }}</span>
+                </div>
+              </div>
+              <div class="detail-item" v-if="item.img">
+                <el-image class="img" :preview-src-list="item.img.split(',')" :src="src" v-for="(src, index) in item.img.split(',')"></el-image>
+              </div>
+              <div style="border-bottom: 1px solid #ffffff;margin: 10px 0;"></div>
+            </template>
+          </div>
+        </div>
+      </div>
+    </el-dialog>
   </div>
 </template>
 
 <script setup>
-  import { getListApi } from '@/api/workOrder'
+import {getDetailApi, getListApi} from '@/api/workOrder'
+  let dialogVisible = ref(false)
   let list = ref([])
+  let detail = ref({})
   const getList = async () => {
     let res = await getListApi()
     list.value = res.data
   }
+  const showDetail = async (id) => {
+    dialogVisible.value = true
+    let res = await getDetailApi(id)
+    console.log( res.data);
+    detail.value = res.data
+  }
   onMounted(() => {
     getList()
   })
 </script>
 
 <style lang="scss" scoped>
+:deep(.el-dialog__headerbtn .el-dialog__close){
+  color:#fff;
+  font-size:40px;
+  position:relative;
+  top:15px;
+  right:15px;
+}
+:deep(.el-dialog__header.show-close){
+  padding-right:0;
+}
+:deep(.el-dialog) {
+  background: url('/src/assets/images/map-bg-2.png') no-repeat top center;
+  background-size: 100% 100%;
+  width:vw(1500);
+}
+:deep(.el-dialog__title) {
+  color: #fff;
+  font-weight: bold;
+}
+.m-modal{
+  padding: vw(30);
+  .normal {
+    padding:3px 10px;
+    background: #2380fb;
+  }
+  .warn {
+    padding:3px 10px;
+    background: #feae00;
+  }
+  .important {
+    padding:3px 10px;
+    background: #d9011b;
+  }
+  .item-title{
+    font-size: 18px;
+    margin-bottom: vw(30);
+    &--primary {
+      @extend .item-title;
+      color: #02f9fa;
+      background-image: url('@/assets/images/mask-primary.png');
+      background-size: 100% 100%;
+    }
+    &--error {
+      @extend .item-title;
+      background-image: url('@/assets/images/mask-error.png');
+      background-size: 100% 100%;
+    }
+    &--warning {
+      @extend .item-title;
+      background-image: url('@/assets/images/mask-warning.png');
+      background-size: 100% 100%;
+    }
+    &--success {
+      @extend .item-title;
+      background-image: url('@/assets/images/mask-success.png');
+      background-size: 100% 100%;
+    }
+  }
+  .item-col{
+    display: flex;
+    justify-content: space-between;
+  }
+}
+.detail-item {
+  flex:1;
+  margin-bottom: 12px;
+  line-height: 1.5;
+  .img{
+    width:vw(200);
+    height: vw(200);
+    margin: 10px;
+  }
+}
+.bom-box {
+  .modal-body {
+    padding: 16px;
+    color:#fff;
+    height:vh(780);
+    overflow:auto;
+    /* 滚动条整体样式 */
+    &::-webkit-scrollbar {
+      width: vw(4); /* 滚动条的宽度 */
+    }
+    /* 滚动条轨道 */
+    &::-webkit-scrollbar-track {
+      background: 'transparent'; /* 轨道的背景色 */
+    }
+    /* 滚动条滑块 */
+    &::-webkit-scrollbar-thumb {
+      background: rgba(0, 150, 255, 0.63); /* 滑块的背景色 */
+      border-radius: 5px; /* 滑块的圆角 */
+    }
+  }
+}
   .work-box-1 {
     width: vw(815);
     height: vh(950);
@@ -84,7 +296,7 @@
           @extend .label;
           background: #d9011b;
         }
-        .time {
+        .time,.btn {
           font-weight: 400;
           font-size: vw(12);
           color: rgba(255, 255, 255, 0.6);
@@ -94,9 +306,13 @@
           text-transform: none;
           margin-left: vw(30);
         }
+        .btn{
+          color: #2380fb;
+          cursor: pointer;
+        }
         p {
           font-weight: 400;
-          font-size: vw(15);
+          //font-size: vw(15);
           color: #ffffff;
           text-align: left;
           font-style: normal;

src/views/workOrder/components/box-2.vue

@@ -12,12 +12,13 @@
         <div class="item item1">
           工单完成数 <span class="color1"><countup :end-val="totalData.complete" /></span>
         </div>
-        <div class="item item3">
+
-          紧急工单数 <span class=""><countup :end-val="totalData.warn" /></span>
-        </div>
         <div class="item item2">
           重要工单数 <span class=""><countup :end-val="totalData.important" /></span>
         </div>
+        <div class="item item3">
+          紧急工单数 <span class=""><countup :end-val="totalData.warn" /></span>
+        </div>
         <div class="item item1">
           普通工单数 <span class=""><countup :end-val="totalData.normal" /></span>
         </div>
@@ -311,11 +312,11 @@
           background-size: 100% 100%;
         }
         .item2 {
-          background-image: url('@/assets/images/work-n-bg-2.png');
+          background-image: url('@/assets/images/work-n-bg-3.png');
           background-size: 100% 100%;
         }
         .item3 {
-          background-image: url('@/assets/images/work-n-bg-3.png');
+          background-image: url('@/assets/images/work-n-bg-2.png');
           background-size: 100% 100%;
         }
       }