信件详情

src/api/datascreen.ts

@@ -30,4 +30,6 @@ export function dutyDay(params: Record<string, any>) {
 export function threeRate(params: Record<string, any>) {
     return request.get({ url:  '/dataScreen/threeRate', params})
 }
-
+export function getMailDetail(params: Record<string, any>) {
+    return request.get({ url:  '/dataScreen/getMailDetail', params})
+}

src/views/datascreen/assets/css/index.css

@@ -49,7 +49,7 @@ a:active {
     position: relative;
     margin-top: 15px;
     padding: 10px;
-    height: 400px;
+    height: 45%;
     background-color: #041149;
    #border: 1px solid #54dcf2;
 }
@@ -146,7 +146,6 @@ a:active {
     font-size: 32px;
     font-weight: 600;
     height: 300px;
-    min-width: 410px;
 }
 
 .echart-tabs  .el-tabs__nav{
@@ -225,7 +224,9 @@ a:active {
     border: 0;
 }
 
-.boxnav{height: calc(100% - 2rem);}
+.boxnav{
+    height: 350px
+}
 .row>li{ float: left; height: 100%;}
 .col-6{width: 50%;}
 .col-3{width: 25%;}
@@ -245,7 +246,7 @@ a:active {
 .pmnav p{color: #fff;
     padding-bottom: 2px; white-space: nowrap;
     overflow: hidden; text-overflow: ellipsis; font-family: SourceHanSansCN-Normal;
-    font-size: 16px;
+    font-size: 12px;
     letter-spacing: 0.53px;
     font-weight: 400;}
 .paim li>span{width: 3rem; height: 3rem;font-family: SourceHanSansCN-Bold;
@@ -255,9 +256,7 @@ a:active {
     text-align: center;
     font-weight: 700;
     text-align: center; line-height: 3rem;  border-radius: .05rem; margin-right: .1rem; }
-/*.paim li:nth-child(1)>span{ background: #ed405d}
+
-.paim li:nth-child(2)>span{background: #f78c44}
-.paim li:nth-child(3)>span{background: #49bcf7}*/
 .paim li{display: flex; align-items: center; height:12%;}
 
 .pmsum{
@@ -319,7 +318,7 @@ a:active {
     list-style: none;
     color: #fff;
     padding: 0px;
-    width: 407px;
+    width: 97%;
     height: 50px;
     background-image: linear-gradient(270deg, rgba(16,151,255,0.10) 0%, rgba(0,55,236,0.87) 98%);
 
@@ -419,6 +418,10 @@ a:active {
     font-weight: 400;  line-height: 3rem;  padding-right: 5px; border-radius: .05rem; margin-right: .1rem;  }
 .ratesum{
     font-size: 1.6rem;
+    float: right;
+    min-width: 75px;
+    height: 30px;
+    overflow: hidden;
 }
 .ratesum p{
     float: left;
@@ -533,11 +536,12 @@ ul.h100 li:nth-of-type(n+6) .pmbar span {
 
 
 .el-select-dropdown__item {
-    background: linear-gradient(180deg, #010457 0%, #031577 100%);
+    background:  linear-gradient(180deg, #010457 0%, #031577 100%);
     border: 0;
     padding: 0;
     color: #fff;
     text-align: center;
+    font-size: 12px;
 }
 
 
@@ -546,43 +550,52 @@ ul.h100 li:nth-of-type(n+6) .pmbar span {
     background: #1C3472;;
     border: 0;
     box-shadow: 0 0 0 0;
+    font-size: 12px;
 }
 
 
 :deep(.el-input__wrapper) {
     background: linear-gradient(180deg, #010457 0%, #031577 100%);
     box-shadow: 0 0 0 0 var(--el-input-border-color, var(--el-border-color)) inset;
+    font-size: 12px;
 }
 
 :deep(.el-select:hover:not(.el-select--disabled) .el-input__wrapper) {
     box-shadow: 0 0 0 0 var(--el-select-input-focus-border-color) inset !important;
+    font-size: 12px;
 }
 
 :deep(.el-select .el-input.is-focus .el-input__wrapper) {
     box-shadow: 0 0 0 0 var(--el-select-input-focus-border-color) inset !important;
+    font-size: 12px;
 }
 
 :deep(.el-select:hover:not(.el-select--disabled) .el-input__wrapper) {
     background: linear-gradient(180deg, #010457 0%, #031577 100%);
+    font-size: 12px;
 }
 
 :deep(.el-select .el-input__wrapper) {
     background: linear-gradient(180deg, #010457 0%, #031577 100%);
     box-shadow: 0 0 0 0;
+    font-size: 12px;
 }
 .el-popper.is-light.blueBack {
     background: linear-gradient(180deg, #010457 0%, #031577 100%);
     border: 1px solid #4E8FFF;
+    font-size: 12px;
 }
 
 .blueBack.el-popper[data-popper-placement^=bottom] .el-popper__arrow::before {
     background: linear-gradient(180deg, #010457 0%, #031577 100%);
     border: 1px solid #4E8FFF;
+    font-size: 12px;
 }
 
 .blueBack.el-popper[data-popper-placement^=top] .el-popper__arrow::before {
     background: linear-gradient(180deg, #010457 0%, #031577 100%);
     border: 1px solid #4E8FFF;
+    font-size: 12px;
 }
 
 .blueBack {

src/views/datascreen/assets/js/map/aomen.js

@@ -1,27 +0,0 @@
-(function (root, factory) {
-    if (typeof define === 'function' && define.amd) {
-        // AMD. Register as an anonymous module.
-        define(['exports', 'echarts'], factory);
-    } else if (typeof exports === 'object' && typeof exports.nodeName !== 'string') {
-        // CommonJS
-        factory(exports, require('echarts'));
-    } else {
-        // Browser globals
-        factory({}, root.echarts);
-    }
-}(this, function (exports, echarts) {
-    var log = function (msg) {
-        if (typeof console !== 'undefined') {
-            console && console.error && console.error(msg);
-        }
-    }
-    if (!echarts) {
-        log('ECharts is not Loaded');
-        return;
-    }
-    if (!echarts.registerMap) {
-        log('ECharts Map is not loaded')
-        return;
-    }
-    echarts.registerMap('澳门', {"type":"FeatureCollection","features":[{"id":"820001","type":"Feature","geometry":{"type":"MultiPolygon","coordinates":[["@@LADC^umZ@DONWE@DALBBF@H@DFBBTC"],["@@P@LC@AGM@OECMBABBTCD@DDH"]],"encodeOffsets":[[[116285,22746]],[[116303,22746]]]},"properties":{"cp":[113.552965,22.207882],"name":"花地玛堂区","childNum":2}},{"id":"820002","type":"Feature","geometry":{"type":"Polygon","coordinates":["@@MK@CA@AAGDEB@NVFJG"],"encodeOffsets":[[116281,22734]]},"properties":{"cp":[113.549052,22.199175],"name":"花王堂区","childNum":1}},{"id":"820003","type":"Feature","geometry":{"type":"Polygon","coordinates":["@@EGOB@DNLHE@C"],"encodeOffsets":[[116285,22729]]},"properties":{"cp":[113.550252,22.193791],"name":"望德堂区","childNum":1}},{"id":"820004","type":"Feature","geometry":{"type":"Polygon","coordinates":["@@ŸYMVAN@BFCBBDAFHDBBFDHIJJEFDPCHHlYJQ"],"encodeOffsets":[[116313,22707]]},"properties":{"cp":[113.55374,22.188119],"name":"大堂区","childNum":1}},{"id":"820005","type":"Feature","geometry":{"type":"Polygon","coordinates":["@@JICGAECACGEBAAEDBFNXB@"],"encodeOffsets":[[116266,22728]]},"properties":{"cp":[113.54167,22.187778],"name":"风顺堂区","childNum":1}},{"id":"820006","type":"Feature","geometry":{"type":"Polygon","coordinates":["@@ ZNWRquZCBCC@AEA@@ADCDCAACEAGBQ@INEL"],"encodeOffsets":[[116265,22694]]},"properties":{"cp":[113.558783,22.154124],"name":"嘉模堂区","childNum":1}},{"id":"820007","type":"Feature","geometry":{"type":"Polygon","coordinates":["@@MOIAIEI@@GE@AAUCBdCFIFR@HAFBBDDBDCBC@@FB@BDDDA\\M"],"encodeOffsets":[[116316,22676]]},"properties":{"cp":[113.56925,22.136546],"name":"路凼填海区","childNum":1}},{"id":"820008","type":"Feature","geometry":{"type":"Polygon","coordinates":["@@DKMMa_GC_COD@dVDBBF@@HJ@JFJBNPZK"],"encodeOffsets":[[116329,22670]]},"properties":{"cp":[113.559954,22.124049],"name":"圣方济各堂区","childNum":1}}],"UTF8Encoding":true});
-}));

src/views/datascreen/countyData.vue

@@ -13,7 +13,7 @@
           </div>
           <div >
             <el-tabs  v-model="dutyActiveName" class="echart-tabs"  type="card" @tab-click="dutyResetTimer">
-              <el-tab-pane label="市局专班" name="dutySj">
+              <el-tab-pane label="市局" name="dutySj">
                 <div class="boxRightMailCon">
                   <ul class="dutyUl">
                     <li v-for="item in dutySjList" :key="item.id">
@@ -24,7 +24,7 @@
                 </div>
 
               </el-tab-pane>
-              <el-tab-pane label="市局" name="dutyFj">
+              <el-tab-pane label="本单位" name="dutyFj">
                 <ul class="dutyUl">
                   <li v-for="item in dutyList.dutyFjList" :key="item.id">
                     <p><span class="dutyDept">{{ item.departName }}</span> <span class="dutyULspan">{{ item.mobile }}</span> <span class="dutyULspan">{{ item.policeName }}</span></p>
@@ -261,7 +261,9 @@
 </template>
 <style   >
 @import 'assets/css/index.css';
-
+body{
+  background-color: #030b39;
+}
 .body{
 
   background-image: url('@/assets/bg.png'); /* 背景图片的路径 */
@@ -719,12 +721,17 @@ const changsMap = () =>{
           show: true,
           color: "white",
         },
+        itemStyle: {
+          normal: {
+            areaColor: '#02215E'   // 这里将地图区域的颜色修改为红色
+          }
+        },
         data: mapDataList,
       }
     ]
   });
 
-  switchRegion(); // 开始自动切换
+  //switchRegion(); // 开始自动切换
 
 }
 

src/views/datascreen/details.vue

@@ -3,7 +3,7 @@
     <popup
         ref="popupRef"
         :title="popupTitle"
-		:number="mailNumber"
+		:number="formData.id"
         :async="true"
         width="1800px"
         :clickModalClose="true"
@@ -32,51 +32,51 @@
           <span class="head-lable">受理编号</span>
         </el-col>
         <el-col :span="7">
-          <span class="head-value">2114131413423432423</span>
+          <span class="head-value">{{formData.id}}</span>
         </el-col>
         <el-col :span="1">
           <span class="head-lable">信件分类</span>
         </el-col>
           <el-col :span="7">
-            <span class="head-value">张三</span>
+            <span class="head-value">{{formData.mailFirstCategory}} > {{formData.mailSecondCategory}} > {{formData.mailThreeCategory}}   </span>
           </el-col>
           <el-col :span="1">
             <span class="head-lable">信件等级</span>
           </el-col>
           <el-col :span="7">
-            <span class="head-value">一般信件</span>
+            <span class="head-value">{{formData.mailLevel}} </span>
           </el-col>
       </el-row>
       </div>
       <div class="info-content ">
       <div>
         <div slot="header" class="info-header">
-          举报人/投诉人基本情况 <span>收起</span>
+          举报人/投诉人基本情况
         </div>
         <el-row>
 			  <el-col :span="3">
 				<span class="info-label">姓名</span>
 			  </el-col>
 			  <el-col :span="3">
-				<span class="info-value">张三</span>
+				<span class="info-value">{{ formData.contactName }}</span>
 			  </el-col>
 					  <el-col :span="2">
 				<span class="info-label">性别</span>
 			  </el-col>
 			  <el-col :span="4">
-				<span class="info-value">张三</span>
+				<span class="info-value">{{ formData.contactSex=='M'?'男':'女' }}</span>
 			  </el-col>
 					  <el-col :span="2">
 				<span class="info-label">证件号码</span>
 			  </el-col>
 			  <el-col :span="4">
-				<span class="info-value">张三</span>
+				<span class="info-value">{{ formData.contactIdCard}}</span>
 			  </el-col>
 							  <el-col :span="2">
 				<span class="info-label">联系电话</span>
 			  </el-col>
 			  <el-col :span="4">
-				<span class="info-value">张三</span>
+				<span class="info-value">{{ formData.contactPhone}}</span>
 			  </el-col>
 
 			</el-row>
@@ -86,32 +86,32 @@
           <div slot="header" class="info-header">
             举报/投诉对象基本情况
           </div>
-          <el-row>
+          <div v-for="item in  formData.verifyPoliceList">
+          <el-row >
             <el-col :span="3">
               <span class="info-label">被举报对象</span>
             </el-col>
             <el-col :span="3">
-              <span class="info-value">张三</span>
+              <span class="info-value">{{ item.name }}</span>
             </el-col>
             <el-col :span="2">
               <span class="info-label">警号</span>
             </el-col>
             <el-col :span="4">
-              <span class="info-value">张三</span>
+              <span class="info-value">{{ item.emp_no }}</span>
             </el-col>
             <el-col :span="2">
               <span class="info-label">性别</span>
             </el-col>
             <el-col :span="4">
-              <span class="info-value">张三</span>
+              <span class="info-value">{{ item.gender }}</span>
             </el-col>
             <el-col :span="2">
               <span class="info-label">出生年月</span>
             </el-col>
             <el-col :span="4">
-              <span class="info-value">张三</span>
+              <span class="info-value">{{ item.birthday }}</span>
             </el-col>
-
           </el-row>
           <el-row>
             <el-col :span="3">
@@ -124,11 +124,12 @@
               <span class="info-label">工作单位</span>
             </el-col>
             <el-col :span="4">
-              <span class="info-value">张三</span>
+              <span class="info-value">{{ item.deptname }}</span>
             </el-col>
 
 
           </el-row>
+          </div>
           <hr >
         </div>
         <div>
@@ -137,7 +138,7 @@
           </div>
           <el-row>
             <el-col :span="24">
-              <div class="info-textarea">   </div>
+              <div class="info-textarea">{{ formData.content}}   </div>
             </el-col>
 
           </el-row>
@@ -166,21 +167,21 @@
               <span class="info-label">接访形式</span>
             </el-col>
             <el-col :span="3">
-              <span class="info-value">张三</span>
+              <span class="info-value">{{ formData.interviewType }}</span>
             </el-col>
 
             <el-col :span="2">
               <span class="info-label">是否一把手接访</span>
             </el-col>
             <el-col :span="4">
-              <span class="info-value">张三</span>
+              <span class="info-value">{{ formData.interviewIsLeader?'是':'否' }}</span>
             </el-col>
 
             <el-col :span="2">
               <span class="info-label">接访领导</span>
             </el-col>
             <el-col :span="4">
-              <span class="info-value">张三</span>
+              <span class="info-value">{{ formData.interviewPoliceName }}</span>
             </el-col>
 
           </el-row>
@@ -190,7 +191,7 @@
               <span class="info-label">接访情况</span>
             </el-col>
             <el-col :span="21">
-              <div class="info-textarea">   </div>
+              <div class="info-textarea">  {{ formData.interviewDetails}} </div>
             </el-col>
 
 
@@ -208,13 +209,13 @@
               <span class="info-label">是否属实</span>
             </el-col>
             <el-col :span="3">
-              <span class="info-value">张三</span>
+              <span class="info-value">{{ formData.verifyIsTrue }}</span>
             </el-col>
             <el-col :span="2">
               <span class="info-label">是否需要问责</span>
             </el-col>
             <el-col :span="4">
-              <span class="info-value">张三</span>
+              <span class="info-value">{{ formData.verifyNeedAccountability?'需要':'不需要' }}</span>
             </el-col>
 
           </el-row>
@@ -224,7 +225,9 @@
               <span class="info-label">查证属实问题</span>
             </el-col>
             <el-col :span="21">
-              <span class="info-value">张三</span>
+              <span class="info-value" v-for="item in  formData.verifyProblem">
+                {{item}}
+              </span>
             </el-col>
 
 
@@ -235,7 +238,7 @@
               <span class="info-label">核办结果</span>
             </el-col>
             <el-col :span="21">
-              <div class="info-textarea">   </div>
+              <div class="info-textarea"> {{formData.verifyDetails}}  </div>
             </el-col>
 
 
@@ -251,7 +254,9 @@
               <span class="info-label">责任追究</span>
             </el-col>
             <el-col :span="21">
-              <span class="info-value">张三</span>
+              <span class="info-value" v-for="item in  formData.verifyPunish">
+                {{item}}
+              </span>
             </el-col>
 
 
@@ -267,13 +272,13 @@
               <span class="info-label">群众反应实现解决情况</span>
             </el-col>
             <el-col :span="3">
-              <span class="info-value">张三</span>
+              <span class="info-value">{{  formData.verifyIsResolved?'已解决':'未解决' }}</span>
             </el-col>
             <el-col :span="2">
               <span class="info-label">办理反馈情况</span>
             </el-col>
             <el-col :span="4">
-              <span class="info-value">张三</span>
+              <span class="info-value">{{  formData.verifyFeedback}}</span>
             </el-col>
 
           </el-row>
@@ -282,25 +287,27 @@
               <span class="info-label">回访人姓名</span>
             </el-col>
             <el-col :span="3">
-              <span class="info-value">张三</span>
+              <span class="info-value">{{formData.followName}}</span>
             </el-col>
             <el-col :span="2">
               <span class="info-label">回访人电话</span>
             </el-col>
             <el-col :span="4">
-              <span class="info-value">张三</span>
+              <span class="info-value">{{formData.followMobile}}</span>
             </el-col>
             <el-col :span="2">
               <span class="info-label">回访人警号</span>
             </el-col>
             <el-col :span="4">
-              <span class="info-value">张三</span>
+              <span class="info-value">{{formData.followEmpNo}}</span>
             </el-col>
           </el-row>
           <hr >
         </div>
 
+
         <div>
+
           <div slot="header" class="info-header">
             办结佐证材料
           </div>
@@ -309,7 +316,7 @@
               <span class="info-label">材料</span>
             </el-col>
             <el-col :span="21">
-              <span class="info-value">张三</span>
+              <div class="img-box" v-for="(item, index) in formData.verifyAttachments" :key="index" :style="{ backgroundImage: `url(${VITE_API_URL}/api/file/stream/${item.filepath})`}"></div>
             </el-col>
 
 
@@ -325,16 +332,22 @@
 		 <div class="details-right">
 		 <el-timeline>
 		<el-timeline-item
-		  v-for="(activity, index) in activities"
+		  v-for="(activity, index) in formData.mailFlowList"
 		  :key="index"
 		  :icon="activity.icon"
 		  :type="activity.type"
-		  :color="activity.color"
+		  color="#0bbd87"
-		  :size="activity.size"
+		  size="large"
 		  :hollow="activity.hollow"
-		  :timestamp="activity.timestamp"
+
 		>
-		  {{ activity.content }}
+      <div class="timeline-text">
+      <span class="timeline-span"> {{ activity.createTime }}</span>&nbsp;&nbsp;   <span>  {{ activity.handlerDeptName }}</span> &nbsp;&nbsp;<span class="timeline-span">  {{ activity.flowAfterName }}</span>
+      </div>
+      <div class="timeline-right">
+        用时<span>{{convert(activity.consumingTime)  }}</span>
+      </div>
+
 		</el-timeline-item>
 	  </el-timeline>
 		 </div>
@@ -346,11 +359,10 @@
 </template>
 <script lang="ts" setup>
 import type { FormInstance, ListItem } from 'element-plus'
-import { dutyEdit, dutyAdd, dutyDetail, dutyLists } from '@/api/duty'
+import {getMailDetail} from '@/api/datascreen'
-import { dictDataDelete, dictDataLists, dictTypeAll } from '@/api/setting/dict'
 import Popup from '@/components/popup/details.vue'
 import feedback from '@/utils/feedback'
-import type { PropType } from 'vue'
+import {PropType, ref} from 'vue'
 import { useDictOptions } from '@/hooks/useDictOptions'
 import { roleAll } from '@/api/perms/role'
 import { postAll } from '@/api/org/post'
@@ -360,6 +372,10 @@ import { usePaging } from '@/hooks/usePaging'
 import { loginCaptcha } from '@/api/user'
 import { isFunction } from 'lodash'
 import { MoreFilled } from '@element-plus/icons-vue'
+
+const {
+  VITE_API_URL
+} = process.env
 defineProps({
   dictData: {
     type: Object as PropType<Record<string, any[]>>,
@@ -373,7 +389,10 @@ const mode = ref('details')
 const popupTitle = computed(() => {
   return mode.value == 'details' ? '信件详情' : '信件详情'
 })
-const mailNumber='11111111111'
+
+let mailDetail=  reactive([]) as any[];
+let verifyFollowupPolice= {
+}
 const flowNode = ref({});
 const steps = ref([
   "信件签收",
@@ -408,184 +427,111 @@ watch(flowNode, (val) => {
 });
 
 const formData = reactive({
-  startTime: '',
-  departId: '',
-  departName: '',
-  policeName: '',
-  mobile: '',
-  typeName: '',
-  empNo: '',
-  endTime: '',
-  deptType: ''
 })
 
 const activities = [
   {
     content: 'Custom icon',
     timestamp: '2018-04-12 20:46',
-    size: 'large',
- 
-  color: '#0bbd87',
   },
   {
     content: 'Custom color',
     timestamp: '2018-04-03 20:46',
-    color: '#0bbd87',
+
   },
   {
     content: 'Custom size',
     timestamp: '2018-04-03 20:46',
-    size: 'large',
+
   },
   {
     content: 'Custom hollow',
     timestamp: '2018-04-03 20:46',
-    type: 'primary',
-    hollow: true,
   },
   {
     content: 'Default node',
     timestamp: '2018-04-03 20:46',
-  },
-]
 
-const { optionsData } = useDictOptions<{
-  deptTypes: any[],
-  policeList: any[],
-  dept: any[]
-}>({
-  dept: {
-    api: deptLists
-  },
-  deptTypes: {
-    api: dictDataLists,
-    params: {
-      dictType: 'dept_type'
-    }
   },
-})
+]
-
 
 
 
 
-const formRules = {
+const setFormData = async (data: Record<string, any>) => {
+  for (const key in data) {
+    if (data[key] != null && data[key] != undefined) {
+      //@ts-ignore
+        if(isJsonString(data[key])){
+          formData[key] =JSON.parse( data[key])
+        }else {
+          formData[key] = data[key]
+        }
 
-  departId: [
-    {
-      required: true,
-      message: '请输入',
-      trigger: ['blur']
-    }
-  ],
 
 
-  empNo: [
-    {
-      required: true,
-      message: '请输入',
-      trigger: ['blur']
-    }
-  ],
-  startTime: [
-    {
-      required: true,
-      message: '请选择',
-      trigger: ['blur']
     }
-  ],
+  }
-  endTime: [
-    {
-      required: true,
-      message: '请选择',
-      trigger: ['blur']
-    }
-  ],
-  deptType: [
-    {
-      required: true,
-      message: '请选择',
-      trigger: ['blur']
-    }
-  ],
-
-
-
-}
 
-const handleSubmit = async () => {
-  await formRef.value?.validate()
-  const data: any = { ...formData }
-  mode.value == 'edit' ? await dutyEdit(data) : await dutyAdd(data)
-  popupRef.value?.close()
-  feedback.msgSuccess('操作成功')
-  emit('success')
 }
 
 
 
-const open = (type = 'add') => {
+const open = (type = 'details') => {
   mode.value = type
   popupRef.value?.open()
 }
+function isJsonString(value) {
+  try {
+    JSON.parse(value); // 尝试将字符串解析为JSON对象
+    return true; // 若能成功解析，说明是有效的JSON字符串
+  } catch (error) {
+    return false; // 若无法解析，说明不是有效的JSON字符串
+  }
+}
 
-const setFormData = async (data: Record<string, any>) => {
+const convert = (time: number) => {
-  for (const key in formData) {
+  let a: number | string = ~~(time / 3600);
-    if (data[key] != null && data[key] != undefined) {
+  let b: number | string = ~~(time / 60) - a * 60;
-      //@ts-ignore
+  let c: number | string = time % 60;
-      if(key=='departId'){
-        formData[key]= parseInt( data[key])
-      }else{
-        formData[key] = data[key]
-      }
-
 
+  a = String(a).padStart(2, "0");
+  b = String(b).padStart(2, "0");
+  c = String(c).padStart(2, "0");
 
-    }
+  if (a === '00') {
+      if(b === '00'){
+        return `${c}秒`;
+     }else {
+        return `${b}分${c}秒`;
+      }
+  } else{
+    return `${a}小时${b}分${c}秒`;
   }
-
 }
 
-const getDetail = async (row: Record<string, any>) => {
+
-  //const data = await dutyDetail({
+const getDetail = async (row: Record<string, any>) =>  {
-  //  id: row.id
+  try {
-  //})
+
-  //setFormData(data)
+    mailDetail = await getMailDetail({
-}
+      id: row.id
-const searchPoliceUser = (query: string) => {
+    })
-  if (query) {
+    console.log(mailDetail)
-    setTimeout(() => {
+    setFormData(mailDetail)
-      console.log(query)
+    console.log(verifyFollowupPolice)
-      const params= {
+  } catch (error) {
-        searchName: query
-      }
-      const  policeList   = searchPolice(params).then((res: any) => {
-        optionsData.policeList=res;
-        return Promise.resolve(res)
-      })
-          .catch((err: any) => {
-            return Promise.reject(err)
-          })
-
-
-    }, 200)
-  } else {
-    optionsData.policeList = []
   }
 }
 
 
-const handleSelectChange = (newValue) => {
+
-  formData.empNo=newValue
-  console.log('选中的值：', newValue);
-};
 const handleClose = () => {
   emit('close')
 }
 
 defineExpose({
   open,
-  setFormData,
   getDetail
 })
 </script>
@@ -603,13 +549,33 @@ defineExpose({
 }
 .details-right{
 	width:350px;
-
+  height: 100%;
+  overflow: auto;
 	float: left;
 	margin-left: 10px;
 	padding-left: 10px;
 		padding-top: 10px;
 	background:#09256d
 }
+
+
+.details-right::-webkit-scrollbar {
+  width: 8px;  /* 宽度 */
+}
+.details-right::-webkit-scrollbar-track {
+  background: #071a4e;  /* 滚动条背景色 */
+}
+
+.details-right::-webkit-scrollbar-thumb {
+  background: #005dfe;  /* 滚动条颜色 */
+  border-radius: 6px;  /* 圆角 */
+  background-clip: padding-box;  /* 背景剪裁 */
+  border: 8px solid transparent;  /* 边框 */
+}
+
+.details-right::-webkit-scrollbar-thumb:hover {
+  background: #0060fe;  /* 鼠标悬停时的滚动条颜色 */
+}
 .details{
 	width:1400px;
 	height: 700px;
@@ -690,5 +656,31 @@ border-top: 1px solid #4E8FFF; /* 设置上边框为1px实线，颜色为黑色
   margin-bottom: 5px;
   margin-left: 5px;
 }
-
+.timeline-right{
+  width: 129px;
+  height: 28px;
+  background: #252D7A;
+  box-shadow: inset 2px 0px 0px 0px #00D050;
+  border-radius: 0px 100px 100px 0px;
+  color: #fff;
+  line-height: 28px;
+  text-align: center;
+}
+.timeline-text{
+  color:#fff;
+  font-size: 12px;
+  font-family: SourceHanSansCN, SourceHanSansCN;
+}
+.timeline-span{
+  font-size: 12px;
+  font-family: SourceHanSansCN, SourceHanSansCN;
+  font-weight: 500;
+  color: #4BDBFC;
+  line-height: 18px;
+}
+.img-box{
+  width: 50px;
+  height: 50px;
+  margin-left: 20px;
+}
 </style>

src/views/datascreen/index.vue

@@ -57,7 +57,7 @@
         <div class="name-title">
          分县市局三率排名
         </div>
-        <div id="graduate">
+        <div >
           <el-tabs v-model="rateActiveName" class="echart-tabs"  @tab-click="rateResetTimer"   type="card"  >
             <el-tab-pane label="办结率" name="completionRate">
               <div class="ratesbox rates">
@@ -262,12 +262,15 @@
 </template>
 <style   >
 @import 'assets/css/index.css';
-
+body{
+  background-color: #030b39;
+}
 .body{
 
  background-image: url('@/assets/bg.png'); /* 背景图片的路径 */
  background-size: cover; /* 背景图片大小适应容器 */
  overflow: auto;
+  background-color: #1C3472;
 
 }
 </style>
@@ -687,6 +690,11 @@ const changsMap = () =>{
           show: true,
           color: "white",
         },
+        itemStyle: {
+          normal: {
+            areaColor: '#02215E'   // 这里将地图区域的颜色修改为红色
+          }
+        },
         data: mapDataList,
       }
     ]