story#6932,子公司车辆处置的系统需求,售出信息更为图片

public/index.html

@@ -26,10 +26,11 @@
     <van-number-keyboard safe-area-inset-bottom />
     <script type="text/javascript">
         window._AMapSecurityConfig = {
-            serviceHost: 'https://api.sinoassist.com/_AMapService',
+            // serviceHost: 'https://api.sinoassist.com/_AMapService',
+          securityJsCode:'91ab1ebc492d5479a68b11527bd73dc9',
         }
     </script>
-    <script src="https://webapi.amap.com/maps?v=1.4.15&key=2560bbf04daef66c810c5e6a97e8c508&plugin=AMap.Polyline"></script>
+    <script type="text/javascript" src="https://webapi.amap.com/maps?v=2.0&key=2560bbf04daef66c810c5e6a97e8c508&plugin=AMap.AutoComplete,AMap.PlaceSearch,AMap.Geolocation,AMap.Geocoder,AMap.Marker,AMap.Driving"></script>
 <!--    <script src="https://unpkg.com/vconsole@latest/dist/vconsole.min.js"></script>-->
     <script>
         // VConsole 默认会挂载到 `window.VConsole` 上

src/api/order.js

@@ -112,3 +112,43 @@ export function correctionHandle(data) {
     data
   })
 }
+
+
+// 获取报警列表
+export function getAlarmList(data) {
+  return request({
+    url: '/supplierAppV2/dispatchApp/alarm/alarmList',
+    method:'POST',
+    contentType: 'application/json',
+    data
+  })
+}
+
+// 获取报警数目
+export function getAlarmCount(data) {
+  return request({
+    url: '/supplierAppV2/dispatchApp/alarm/alarmCount',
+    method:'POST',
+    data
+  })
+}
+
+// 获取报警详情
+export function getAlarmByCode(data) {
+  return request({
+    url: '/supplierAppV2/dispatchApp/alarm/getAlarmByCode',
+    method:'POST',
+    data
+  })
+}
+
+// 处理报警
+export function dealWithAlarm(data) {
+  return request({
+    url: '/supplierAppV2/dispatchApp/alarm/handAlarm',
+    method:'POST',
+    data
+  })
+}
+
+

src/api/report.js

@@ -0,0 +1,37 @@
+import request from '@/utils/http'
+// 根据订单 获取报备类型
+export function getReportListByOrder(key){
+  return request({
+    url: '/order/baseDriverReportConfigs/getByOrderId',
+    method:'GET',
+    params: key
+  })
+}
+
+// 添加报备
+export function newOrderReporting(data){
+  return request({
+    url: '/supplierAppV2/dispatchApp/order/newOrderReporting',
+    method:'POST',
+    contentType: 'application/json',
+    data
+  })
+}
+
+// 获取报备列表
+export function reportHistory(data){
+  return request({
+    url: '/supplierAppV2/dispatchApp/order/reportHistory',
+    method:'POST',
+    data
+  })
+}
+
+// 获取订单信息
+export function getOrderInfo(data){
+  return request({
+    url: '/supplierAppV2/dispatchApp/order/reportOrderDetail',
+    method:'POST',
+    data
+  })
+}

src/api/secondHandCar.js

@@ -93,4 +93,13 @@ export function saveRecord(data){
     contentType: 'application/json',
     data
   })
+}
+// 审核不通过再次提交
+export function auditCarInfoAgain(data){
+  return request({
+    url: '/toc-user/car-app/auditCarInfoAgain',
+    method:'POST',
+    contentType: 'application/json',
+    data
+  })
 }

src/router/index.js

@@ -4,6 +4,7 @@ Vue.use(VueRouter);
 import kpiRouter from './kpi-router'
 import invoiceRouter from "@/router/invoice-router";
 import secondHandRouter from "@/router/second-hand-router";
+import reportRouter from "@/router/report-router"
 const routes = [
     {
       path: '/',
@@ -250,6 +251,22 @@ const routes = [
             title:'车辆维保'
         }
     },
+    {
+        path: '/vehicleAlarmList',
+        name: 'vehicleAlarmList',
+        component:()=>import('@/views/vehicle-maintenance/vehicle-alarm-list.vue'),
+        meta: {
+            title:'车辆报警'
+        }
+    },
+    {
+        path: '/vehicleAlarmDetail',
+        name: 'vehicleAlarmDetail',
+        component:()=>import('@/views/vehicle-maintenance/vehicle-alarm-detail.vue'),
+        meta: {
+            title:'报警详情'
+        }
+    },
     {
         path: '/maintenanceApplication',
         name: 'maintenanceApplication',
@@ -277,6 +294,7 @@ const routes = [
     ...kpiRouter,
     ...invoiceRouter,
     ...secondHandRouter,
+    ...reportRouter
   ]
 
 const router = new VueRouter({

src/router/report-router.js

@@ -0,0 +1,21 @@
+const reportRouter = [
+  {
+    path: '/reportIndex',
+    name: 'reportIndex',
+    component: () => import('@/views/report/reportIndex'),
+    meta:{
+      title: '道路救援',
+      cache: true,
+      modalState: false,
+    }
+  },
+  {
+    path: '/addressMap',
+    name: 'addressMap',
+    component: () => import('@/views/report/addressMap'),
+    meta:{
+      title: '道路救援',
+    }
+  },
+]
+export default reportRouter

src/router/second-hand-router.js

@@ -55,5 +55,13 @@ const secondHandCar = [
             title: '免责声明',
         }
     },
+    {
+        path: '/sellingInfo',
+        name: 'sellingInfo',
+        component: () => import('@/views/secondHandCar/sellingInfo.vue'),
+        meta:{
+            title: '售出信息',
+        }
+    },
 ]
 export default secondHandCar

src/utils/http.js

@@ -11,7 +11,11 @@ const service = axios.create({
 })
 const urlParams = new URLSearchParams(window.location.search);
 let token = urlParams.get('token');
-localStorage.setItem('token', token);
+if( token ) {
+  localStorage.setItem('token', token);
+} else {
+  localStorage.setItem('token', '');
+}
 service.interceptors.request.use(
     config => {
       let reqUrl=config.url
@@ -21,11 +25,13 @@ service.interceptors.request.use(
       }
       config.headers['Content-Type'] = config.contentType || 'application/x-www-form-urlencoded'
       let token = localStorage.getItem('token');
-      // let token='4099761587129c46b03c9316c9e866c9'
+      // let token='eyJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJBTkNIQU5HIiwidXNlcklkIjo0NTY3MSwibmFtZSI6IuWuieeVhSIsInVzZXJOYW1lIjoiQU5DSEFORyIsInN1cHBsaWVySWQiOjExMjgsImlzWmQiOjAsImV4cCI6MTc1NTQyMjUyNX0.xzDZhaANJFnbeViIHJA0SEtOyTv7Ja3rKmXqRKRuFkc'
       // let token='eyJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJTSEhQWEIiLCJ1c2VySWQiOjU0NzI2LCJuYW1lIjoiI-a1i-ivleWwj-eZveeZvSIsInVzZXJOYW1lIjoiU0hIUFhCIiwic3VwcGxpZXJJZCI6MTAwMDE2NSwiZXhwIjoxNzQ0NTEwNzkwfQ.JPk0OA7slYJN3FIi_uhW4Y0CiWRvl6R1dK8MRTbyhD8'
        if(!(reqUrl=='/supplier/supplierTraining/trainingTask' || reqUrl=='/supplier/supplierTraining/normalList' || reqUrl=='/supplier/supplierTraining/trainingList')){
+         if(token) {
            config.headers['Authorization'] = `${token}`;
            config.headers['token'] = `${token}`;
+         }
        }
       return config
     },

src/utils/map.js

@@ -36,6 +36,7 @@ export function getAddress(mapContext, lnglat) {
         } else {
           console.log(result)
           alert(JSON.stringify(result))
+          reject(result)
         }
       })
     })
@@ -44,7 +45,7 @@ export function getAddress(mapContext, lnglat) {
 
 // 输入提示
 export function searchFun(mapContext, cityCode, keyword) {
-  return new Promise((resolve, reject) => {
+  return new Promise((resolve) => {
     mapContext.plugin('AMap.AutoComplete', function(){
       var autoOptions = {
         city: cityCode || '全国',
@@ -57,7 +58,7 @@ export function searchFun(mapContext, cityCode, keyword) {
         if(result.info == 'OK') {
           resolve(result.tips)
         } else {
-          reject(result)
+          resolve([])
         }
       })
     })
@@ -90,6 +91,7 @@ export function getRoad( mapContext, startLng, startLat, endLng, endLat ) {
 }
 
 
+/*
 function drawRoute(route, map) {
   let path = parseRouteToPath(route)
 
@@ -106,3 +108,4 @@ function drawRoute(route, map) {
 
   map.add(routeLine);
 }
+*/

src/views/report/addressMap.vue

@@ -0,0 +1,213 @@
+<template>
+  <div class="address_wrap">
+    <div class="map_wrap" id="mapId">
+    </div>
+    <div class="button_wrap">
+      <div class="cancel_btn" @click="cancelHandler">取消</div>
+      <div class="confirm_btn" @click="successHandler">完成</div>
+    </div>
+    <div class="search_wrap">
+      <div class="section">
+        <input type="text" v-model="keyword" @change="searchHandler" placeholder="请输入地址" />
+      </div>
+      <div class="server_list" v-if="keyword">
+        <div class="text_box" v-for="(item, index) in addressList" :key="index" @click="chooseHandler(item, index)" :class="{'active': index == activeIndex}">
+          <div class="address_name">{{ item.name }}</div>
+          <div class="address_detail">{{ ( item.district || '' ) + ( item.address || '' ) }}</div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+  import { searchFun, getLocal, getAddress } from '@/utils/map'
+  export default {
+    name: "addressMap",
+    data() {
+      return {
+        keyword: '',
+        addressList: [],
+        activeIndex: '',
+        map: '',
+        marker: null,
+        cityCode: ''
+      }
+    },
+    watch: {
+      keyword() {
+        this.searchHandler()
+      }
+    },
+    async mounted() {
+      sessionStorage.setItem('reportAddress', '')
+      await this.initMap()
+    },
+    methods: {
+      async initMap() {   // 初始化地图
+        this.map = new AMap.Map('mapId', {
+          viewMode: '2D',  // 默认使用 2D 模式
+          zoom:11,  //初始化地图层级
+        })
+        let res = await getLocal(this.map);
+        let lnglat = new AMap.LngLat(res?.lng, res?.lat);
+        let location = await getAddress(this.map, lnglat)
+        this.cityCode = location?.regeocode.addressComponent.adcode
+        //location?.regeocode?.addressComponent?.city || location?.regeocode?.addressComponent?.province
+        console.log('location', location);
+      },
+      async searchHandler() {
+        this.activeIndex = null
+        if( this.keyword ) {
+          this.addressList = await searchFun(this.map,  this.cityCode, this.keyword,)
+          this.addressList = this.addressList.filter(item => !!item.location)
+        } else {
+          this.addressList = []
+        }
+      },
+      chooseHandler(item, index) {
+        this.activeIndex = index;
+        this.addMarker()
+      },
+      addMarker() {
+        if( this.marker ) {
+          this.map.remove(this.marker)
+        }
+        let content = '<div class="dest-position"></div>';
+        let activeObj = this.addressList[this.activeIndex];
+        this.marker = new AMap.Marker({
+          position: new AMap.LngLat( activeObj.location.lng, activeObj.location.lat ),
+          content: content,
+          offset: new AMap.Pixel(-13, -30)
+        });
+        this.map.add(this.marker)
+        this.map.setCenter([activeObj.location.lng, activeObj.location.lat])
+      },
+      successHandler() {
+        if( this.activeIndex == null ) {
+          this.$toast('请选择具体地址')
+          return
+        }
+        let activeObj = this.addressList[this.activeIndex];
+        let _tempObj = {
+          startPoiAddress: activeObj?.district + activeObj?.address + activeObj?.name,
+          startLat: activeObj?.location?.lat,
+          startLng: activeObj?.location?.lng,
+          adCode: activeObj?.adcode,
+        }
+        sessionStorage.setItem('reportAddress', JSON.stringify(_tempObj))
+        setTimeout(() => {
+          this.$router.go(-1)
+        }, 1)
+      },
+      // 取消 返回上一页
+      cancelHandler() {
+        this.$router.go(-1)
+      },
+    }
+  }
+</script>
+<style>
+  .dest-position {
+    width: 30px;
+    height: 36px;
+    background-size: 100% 100%;
+    background-image: url("~@/assets/report/destMarker.png");
+  }
+</style>
+<style scoped lang="scss">
+  .address_wrap {
+    height: 100%;
+  }
+  .map_wrap {
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 60%;
+    z-index: -1;
+  }
+  .button_wrap {
+    width: 100%;
+    padding: 5px;
+    box-sizing: border-box;
+    zoom: 1;
+    position: fixed;
+    top: 0;
+    .cancel_btn {
+      width: 50px;
+      height: 27px;
+      background: #F37877;
+      font-size: 12px;
+      text-align: center;
+      line-height: 27px;
+      color: #fff;
+      border-radius: 3px;
+      float: left;
+    }
+    .confirm_btn {
+      width: 50px;
+      height: 27px;
+      background: rgba(5,193,98,1);
+      font-size: 12px;
+      text-align: center;
+      line-height: 27px;
+      color: #fff;
+      border-radius: 3px;
+      float: right;
+    }
+  }
+  .search_wrap {
+    background-color: #fff;
+    position: fixed;
+    width: 100%;
+    height: 60%;
+    bottom: 0;
+    left: 0;
+    overflow: auto;
+    .section {
+      height: 35px;
+      width: 100%;
+      background-color: #fff;
+      position: fixed;
+      top: 40%;
+      padding-top: 10px;
+      input {
+        width: 90%;
+        margin: 0 auto;
+        display: block;
+        border: none;
+        height: 30px;
+        border-radius: 3px;
+        padding: 0 10px;
+        background: #e2e0e0;
+        font-size: 14px;
+      }
+    }
+    .server_list {
+      overflow-y: auto;
+      padding-top: 30px;
+      .text_box {
+        margin: 10px 25px;
+        padding-top: 10px;
+        .address_name {
+          font-size: 14px !important;
+          color: rgba(0,0,0,0.8);
+        }
+        .address_detail {
+          margin-top: 3px;
+          color: #c3c3c3 !important;
+          font-size: 12px !important;
+        }
+      }
+      .active {
+        .address_name {
+          color: green !important;
+        }
+        .address_detail {
+          color: green !important;
+        }
+      }
+    }
+  }
+</style>

src/views/report/components/report-list-item.vue

@@ -0,0 +1,57 @@
+<template>
+  <div class="bottom_wrap">
+    <div class="report_item" v-for="(item, index) in reportList" @click="goReportHandler(item)" :key="index">
+      <img class="report_icon" :src="item?.iconUrl" alt="">
+      <div class="report_title">{{item.name}}</div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "report-list-item",
+  data() {
+    return {
+      addressReportCode: '',
+
+    }
+  },
+  props: ['reportList'],
+  methods: {
+    goReportHandler(data) {
+      this.$emit('getReport', data);
+    },
+
+  }
+}
+</script>
+
+<style scoped lang="scss">
+.bottom_wrap {
+  width: 100%;
+  /*position: fixed;*/
+  bottom: 0;
+  /*padding: 0 34px 20px;*/
+  padding-bottom: 20px;
+  display: flex;
+  flex-wrap: wrap;
+  background: #FFFFFF;
+  box-shadow: 0px 0px 20px 0px rgba(53,73,93,0.2);
+  box-sizing: border-box;
+  .report_item {
+    width: 25%;
+    margin-top: 20px;
+    text-align: center;
+    .report_icon {
+      width: 45px;
+      height: 45px;
+    }
+    .report_title {
+      color: rgba(53, 53, 53, 0.67);
+      font-size: 11px;
+      line-height: 16px;
+      margin-top: 6px;
+    }
+  }
+}
+</style>

src/views/report/components/service-item.vue

@@ -0,0 +1,112 @@
+<template>
+  <div class="wrap">
+    <div class="service_title">
+      <span class="name">{{orderInfo?.serviceName}}</span>
+      <span class="status">
+        {{orderInfo?.orderStatusString}}
+        <span class="refresh_btn" @click="refreshHandler">刷新</span>
+      </span>
+    </div>
+    <!--    <img class="report_line" src="@/assets/report/report_line.png" alt="">-->
+    <div class="service_content">
+      <div class="content_left">
+        <img class="report_logo" src="@/assets/report/report_logo.png" alt="">
+      </div>
+      <div class="content_right">
+        <div class="order_code">单号：{{orderInfo?.userOrderCode}}</div>
+        <div class="company">单位：{{orderInfo?.supplierName}}</div>
+        <div class="driver_info">
+          <span class="driver_name">{{orderInfo?.driverName}}</span>
+          <span>{{orderInfo?.phone}}</span>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+  export default {
+    name: "service-item",
+    props: ['orderInfo'],
+    methods: {
+      refreshHandler() {
+        this.$emit('refresh')
+      }
+    }
+  }
+</script>
+
+<style scoped lang="scss">
+  .wrap {
+    width: calc(100% - 20px);
+    background: #FFFFFF;
+    box-shadow: 0px 0px 9px 0px rgba(53,73,93,0.2);
+    border-radius: 8px;
+    border: 1px solid #E6E6E6;
+    backdrop-filter: blur(5.602678571428572px);
+    margin: 0 auto;
+  }
+.service_title {
+  height: 40px;
+  line-height: 42px;
+  padding-left: 22px;
+  padding-right: 14px;
+  background: #F9FDFF;
+  display: flex;
+  justify-content: space-between;
+  border-bottom: 1px solid #EFEFEF;
+  border-top-left-radius: 8px;
+  border-top-right-radius: 8px;
+  .name {
+    font-size: 16px;
+    font-weight: bold;
+    color: rgba(0, 0, 0, 0.9);
+  }
+  .status {
+    font-size: 13px;
+    color: #F19028;
+  }
+  .refresh_btn {
+    background-color: #267EF0;
+    color: #fff;
+    padding: 6px 12px;
+    margin-left: 5px;
+    border-radius: 3px;
+  }
+}
+.service_content {
+  padding: 11px 16px 18px;
+  display: flex;
+  .content_left {
+    .report_logo {
+      width: 56px;
+      height: 56px;
+      margin-right: 14px;
+    }
+  }
+  .content_right {
+    .order_code {
+      color: #323643;
+      font-size: 16px;
+      font-weight: 600;
+      margin-bottom: 1px;
+    }
+    .company {
+      color: #323643;
+      font-size: 13px;
+      margin-bottom: 3px;
+    }
+    .driver_info {
+      color: rgba(50, 54, 67, 0.65);
+      font-size: 12px;
+      margin-bottom: 3px;
+      .driver_name {
+        margin-right: 10px;
+      }
+    }
+  }
+}
+.report_line {
+
+}
+</style>

src/views/report/reportIndex.vue

@@ -0,0 +1,568 @@
+<template>
+<!--  <van-pull-refresh v-model="isLoading" class="custom-pull-refresh safe-pull-refresh" @refresh="onRefresh">-->
+    <div class="main_wrap">
+      <div class="top_bg" :class="{'dispatch' : type == 1 , 'driver' : type != 1}">
+<!--        <div class="title">报备中心</div>-->
+      </div>
+      <div class="service_wrap">
+        <service-item :order-info="orderInfo" @refresh="onRefreshHandler"></service-item>
+      </div>
+      <div class="chat_list" ref="chatList" >
+        <!--ai对话框 s -->
+        <div v-for="(item, index) in recordList" :key="index">
+          <template v-if="item.messageType == 4">
+            <div class="top_tip_wrap">为了快速解决问题，请选择下方咨询类型</div>
+            <div class="ai_chat" >
+              <div class="ai_left">
+                <img class="report_ai" src="@/assets/report/report_ai.png" alt="">
+              </div>
+              <div class="ai_right">
+                <div class="ai_title">{{ orderInfo?.driverName }}你好，请选择报备内容</div>
+                <ul>
+                  <li v-for="_item in item.content" :key="_item.id" @click="addReportHandler(_item)">“{{_item.name}}”</li>
+                </ul>
+              </div>
+            </div>
+          </template>
+          <template v-if="[2, 3].includes(Number(item.messageType))">
+            <!--ai对话框 e -->
+            <div class="tip_wrap">{{item.createTime}}</div>
+            <!--客服对话框 s -->
+            <div class="customer_item mb20">
+              <div class="customer_left">
+                <img class="profile_photo mr" src="@/assets/report/report_customer.png" alt="">
+              </div>
+              <div class="common_right customer_cls">
+                <div class="customer_status">{{item.reportConfigName}}</div>
+                <div class="response_con">{{item.remark}}</div>
+              </div>
+            </div>
+          </template>
+          <template v-if="item.messageType == 1">
+            <!--服务人员对话框 e -->
+            <div class="tip_wrap">{{item.createTime}}</div>
+            <!--服务人员对话框 s -->
+            <div class="server_item mb20">
+              <div class="common_right service_cls">
+                <div class="service_status">{{item.reportConfigName}}</div>
+                <div class="response_con">{{item.remark}}</div>
+              </div>
+              <div class="customer_left">
+                <img class="profile_photo ml" v-if="type == 1" src="@/assets/report/report_dispatch.png" alt="">
+                <img class="profile_photo ml" v-else src="@/assets/report/report_driver.png" alt="">
+              </div>
+            </div>
+            <!--服务人员对话框 e -->
+          </template>
+        </div>
+      </div>
+      <report-list-item :report-list.sync="reportList" @getReport="getReportHandler" />
+      <van-popup ref="addReportModal" v-model="addReportShow" :close-on-click-overlay="false" closeable duration="0" round position="bottom">
+        <div class="dialog_wrap">
+          <img class="add_report_bg" src="@/assets/report/add_report_bg.png" alt="">
+          <div class="report_content">
+            <template v-if="currentInfo.component == 'time'">
+              <!--预约时间报备 s -->
+              <div class="report_title">
+                <img class="dot" src="@/assets/report/add_report_dot.png" alt="">
+                <span>预约时间</span>
+              </div>
+              <div class="report_time_content" @click="showDatetime = true">
+                <div class="report_time_left">
+                  <img class="add_report_time" src="@/assets/report/add_report_time.png" alt="">
+                  <span>{{appointTime || '请选择时间'}}</span>
+                </div>
+                <img class="report_arrow" src="@/assets/report/add_report_arrow.png" alt="">
+              </div>
+              <!--预约时间报备 e -->
+            </template>
+            <template v-if="currentInfo.component == 'address'">
+              <!--修改地址报备 s -->
+              <div class="report_title">
+                <img class="dot" src="@/assets/report/add_report_dot.png" alt="">
+                <span>修改地址</span>
+              </div>
+              <div class="report_time_content" @click="goPage('addressMap')">
+                <div class="report_time_left">
+                  <img class="add_report_time" src="@/assets/report/add_report_address.png" alt="">
+                  <span>{{address || '请选择地址'}}</span>
+                </div>
+                <img class="report_arrow" src="@/assets/report/add_report_arrow.png" alt="">
+              </div>
+              <!--修改地址报备 e -->
+            </template>
+            <div class="report_title">
+              <img class="dot" src="@/assets/report/add_report_dot.png" alt="">
+              <span>补充报备内容</span>
+            </div>
+            <div class="report_common_content">
+              <textarea class="report_textarea" id="text-input" rows="4" placeholder="点击这里输入补充报备内容" v-model.trim="remark"></textarea>
+  <!--            <van-field-->
+  <!--              v-model="remark"-->
+  <!--              class="report_textarea"-->
+  <!--              placeholder="点击这里输入补充报备内容" />-->
+            </div>
+          </div>
+          <div class="report_btn" @click="saveHandler">
+            提交报备
+          </div>
+        </div>
+      </van-popup>
+
+      <van-popup v-model="showDatetime" round position="bottom">
+        <van-datetime-picker
+          class="dataTime"
+          v-if="showDatetime"
+          v-model="appointTime"
+          type="datetime"
+          :min-date="minDate"
+          @confirm="onConfirm"
+          @cancel="showDatetime = false"
+        />
+      </van-popup>
+    </div>
+<!--  </van-pull-refresh>-->
+</template>
+
+<script>
+  import { getReportListByOrder, reportHistory, newOrderReporting, getOrderInfo } from "@/api/report"
+  import { myMixins} from "@/utils/myMixins";
+  import {timeFormat} from "@/utils/common";
+  import reportListItem from '@/views/report/components/report-list-item'
+  import serviceItem from "@/views/report/components/service-item"
+  import {Dialog, Toast} from "vant";
+  export default {
+    name: "reportIndex",
+    components: { serviceItem, reportListItem },
+    mixins: [myMixins],
+    data() {
+      return {
+        addReportShow: false,
+        remark: '',
+        showDatetime: false,
+        appointTime: '',
+        minDate: new Date(),
+        address: '',
+        lat: '',
+        lng: '',
+        reportList: [],
+        recordList: [],
+        orderInfo: {},
+        type: '',   // 1 调度   2 司机
+        currentInfo: '',
+        userOrderId: '',
+        userOrderCode: '',
+        driverId: '',
+        clickFlag: true,
+        isLoading: false,
+      }
+    },
+    async mounted() {
+      const urlParams = new URLSearchParams(window.location.search);
+      this.userOrderId = this.$route.query.userOrderId || urlParams.get('userOrderId');
+      this.userOrderCode = this.$route.query.userOrderCode || urlParams.get('userOrderCode');
+      this.type = this.$route.query.type || urlParams.get('type');
+      this.driverId = this.$route.query.driverId || urlParams.get('driverId');
+      await this.getReportList();
+      await this.getDetail();
+      await this.getRecordList();
+      await this.scrollToBottom();
+    },
+    activated() {
+      let addressSession = sessionStorage.getItem('reportAddress');
+      if(addressSession) {
+        let _obj = JSON.parse(addressSession)
+        this.address = _obj.startPoiAddress;
+        this.lat = _obj.startLat;
+        this.lng = _obj.startLng;
+        this.adCode = _obj.adCode;
+      }
+    },
+    methods: {
+      onRefreshHandler() {
+        setTimeout(async () => {
+          try {
+            this.recordList = [];
+            await this.getReportList();
+            await this.getDetail();
+            await this.getRecordList();
+            await this.scrollToBottom();
+          } finally {
+            this.isLoading = false; // 结束加载状态
+          }
+        }, 100)
+      },
+      // 添加滚动方法
+      scrollToBottom() {
+        this.$nextTick(() => {
+          const container = this.$refs.chatList
+          container.scrollTop = container.scrollHeight
+        })
+      },
+      async getRecordList() {
+        let recordList = await reportHistory({
+          userOrderId: this.userOrderId,
+          userOrderCode: this.userOrderCode,
+          driverId: this.driverId,
+          source: Number(this.type),
+        })
+        this.recordList = recordList.data;
+      },
+      async saveHandler() {
+        if( this.clickFlag ) {
+          let data = {
+            source: Number(this.type),
+            reportContent: this.remark,
+            userOrderId: Number(this.userOrderId),
+            reportConfigId: this.currentInfo.id,
+            userOrderCode: this.userOrderCode,
+            driverId: this.driverId,
+          }
+          if(this.currentInfo.component == 'time') {
+            if( !this.appointTime ) {
+              Toast('预约时间不能为空')
+              return
+            }
+            if( new Date(this.appointTime).getTime() <= new Date().getTime() ) {
+              Toast('预约时间不能小于当前时间')
+              return
+            }
+            data.time = this.appointTime
+          }
+          if(this.currentInfo.component == 'address') {
+            if( !this.address ) {
+              Toast('地址不能为空')
+              return
+            }
+            data.address = this.address
+            data.lat = this.lat;
+            data.lng = this.lng;
+          }
+          if( !this.remark ) {
+            Toast('备注内容不能为空')
+            return
+          }
+          this.clickFlag = false;
+          try {
+            await newOrderReporting(data)
+            Dialog.alert({
+              title: '提示',
+              message: "报备添加成功"
+            }).then(async () => {
+              await this.getRecordList()
+              this.addReportShow = false
+              this.scrollToBottom();
+              this.initDialogData();
+              this.clickFlag = true
+            });
+          } finally {
+            this.clickFlag = true
+          }
+        }
+      },
+      initDialogData() {
+        this.appointTime = '';
+        this.address = '';
+        this.lat = '';
+        this.lng = '';
+        this.remark = '';
+      },
+      addReportHandler(data) {  // 点击添加报备弹框
+        this.currentInfo = data;
+        this.addReportShow = true
+      },
+      getReportHandler(data) {  // 点击获取当前报备信息
+        this.recordList.push({
+          messageType: 4,
+          content: data.child
+        })
+        this.scrollToBottom();
+      },
+      async getDetail(){  // 订单详情
+        if(this.userOrderId) {
+          let result = await getOrderInfo({
+            userOrderId: this.userOrderId,
+            userOrderCode: this.userOrderCode
+          })
+          this.orderInfo = result.data
+        } else {
+          this.orderInfo = {}
+        }
+
+      },
+      async getReportList() {   // 报备大类
+        let res = await getReportListByOrder({
+          orderId: this.userOrderId
+        });
+        this.reportList = res.data
+      },
+      onConfirm(data) {
+        this.appointTime = timeFormat(new Date(data))
+        this.showDatetime = false;
+      }
+    }
+  }
+</script>
+<style lang="scss">
+  .custom-pull-refresh {
+    height: 100% !important;
+  }
+</style>
+<style lang="scss" scoped>
+  #app {
+    background: #F9FCFF !important;
+    height: 100%;
+  }
+
+  .main_wrap {
+    width: 100%;
+    height: 100%;
+    background: #F9FCFF !important;
+    display: flex;
+    flex-direction: column;
+    // 添加以下样式确保正确的高度计算
+    position: absolute;
+    top: 0;
+    bottom: 0;
+    left: 0;
+    right: 0;
+  }
+.top_bg {
+  width: 100%;
+  height: 87px;
+  /*.title {
+    color: #fff;
+    text-align: center;
+    padding-top: 52px;
+    font-size: 17px;
+    line-height: 24px;
+  }*/
+}
+  .dispatch { // 调度app头部背景色
+    background: #354683;
+  }
+  .driver { // 司机app头部背景色
+    background: #334885;
+  }
+.service_wrap {
+  margin-top: -75px;
+  /*margin-bottom: 20px;*/
+}
+.chat_list {
+  flex: 1;
+  /*overflow: auto;*/
+  overflow-y: auto;
+  overflow-x: hidden;
+  -webkit-overflow-scrolling: touch; // 为了iOS平滑滚动
+  padding-top: 10px;
+  /* 修复 iOS 滚动问题 */
+  transform: translateZ(0);
+  .top_tip_wrap {
+    color: #7C8698;
+    text-align: center;
+    font-size: 13px;
+  }
+  .tip_wrap {
+    color: #7C8698;
+    text-align: center;
+    font-size: 13px;
+    margin-bottom: 10px;
+  }
+  .ai_chat {
+    padding: 25px 10px 20px;
+    display: flex;
+    .ai_left {
+      .report_ai {
+        width: 44px;
+        height: 44px;
+        margin-right: 12px;
+      }
+    }
+    .ai_right {
+      .ai_title {
+        color: #203152;
+        font-size: 15px;
+        font-weight: 600;
+        margin-bottom: 15px;
+      }
+      li {
+        font-size: 13px;
+        color: #267EF0;
+        line-height: 18px;
+        margin-bottom: 15px;
+        font-weight: bold;
+      }
+      li::before {
+        content: "";
+        display: inline-block;
+        width: 8px;
+        height: 8px;
+        background-color: #5680FA;
+        border-radius: 50%; /* 圆形 */
+        margin-right: 10px;
+      }
+    }
+  }
+}
+
+/*客服人员，服务人员对话弹框样式 s*/
+  .profile_photo {
+    width: 44px;
+    height: 44px;
+  }
+  .mr {
+    margin-right: 10px;
+  }
+  .ml {
+    margin-left: 10px;
+  }
+  .mb20 {
+    margin-bottom: 20px;
+  }
+  .customer_item {
+    display: flex;
+    padding-left: 10px;
+    padding-right: 64px;
+    .customer_left {
+    }
+  }
+  .common_right {
+    padding: 11px 13px;
+    flex: 1;
+    .customer_status::before {
+      content: "";
+      display: inline-block;
+      width: 8px;
+      height: 8px;
+      background-color: #5680FA;
+      border-radius: 50%; /* 圆形 */
+      margin-right: 10px;
+    }
+    .customer_status {
+      font-size: 14px;
+      color: #267EF0;
+      line-height: 20px;
+      font-weight: bold;
+    }
+    .service_status {
+      font-size: 14px;
+      color: #F07926;
+      line-height: 20px;
+      font-weight: bold;
+    }
+    .service_status::before {
+      content: "";
+      display: inline-block;
+      width: 8px;
+      height: 8px;
+      background-color: #F07926;
+      border-radius: 50%; /* 圆形 */
+      margin-right: 10px;
+    }
+  }
+  .customer_cls {
+    border-radius: 0px 6px 6px 6px;
+    background: #E3F0FF;
+  }
+  .service_cls {
+    background: #FAEBD8;
+    border-radius: 0px 6px 6px 6px;
+  }
+  .server_item {
+    display: flex;
+    padding-right: 10px;
+    padding-left: 64px;
+  }
+  .response_con {
+    font-size: 13px;
+    color: #242A37;
+    line-height: 18px;
+    font-weight: bold;
+    margin-top: 5px;
+  }
+  /*客服人员，服务人员对话弹框样式 e*/
+  .dialog_wrap {
+    .add_report_bg {
+      width: 100%;
+      height: 76px;
+    }
+    .report_content {
+      width: calc(100% - 12px);
+      margin: -30px auto 0;
+      padding-right: 14px;
+      padding-left: 20px;
+      box-sizing: border-box;
+      background: #fff;
+      position: relative;
+      padding-top: 25px;
+      border-radius: 10px;
+      .report_title {
+        font-size: 16px;
+        font-weight: 600;
+        color: #267EF0;
+        line-height: 22px;
+        margin-bottom: 10px;
+        .dot {
+          width: 7px;
+          height: 6px;
+          margin-right: 12px;
+        }
+      }
+      .report_time_content {
+        padding: 13px;
+        background: #F2F7FF;
+        border-radius: 6px;
+        border: 1px solid #E2EAF6;
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        margin-bottom: 30px;
+        .report_time_left {
+          font-size: 14px;
+          font-weight: bold;
+          color: rgba(0, 0, 0, 0.9);
+          display: flex;
+          align-items: flex-start;
+        }
+        .add_report_time {
+          width: 18px;
+          height: 18px;
+          margin-right: 8px;
+        }
+        .report_arrow {
+          width: 8px;
+          height: 12px;
+          margin-left: 5px;
+        }
+      }
+      .report_common_content {
+        margin-bottom: 27px;
+        .report_textarea {
+          width: 100%;
+          box-sizing: border-box;
+          background: #F8FAFC;
+          border-radius: 6px;
+          min-height: 95px;
+          border: 1px solid #E2EAF6;
+          padding: 10px;
+          font-size: 13px;
+        }
+      }
+    }
+    .report_btn {
+      width: calc(100% - 80px);
+      height: 46px;
+      line-height: 46px;
+      background: #005DD5;
+      border-radius: 23px;
+      color: #FFFFFF;
+      font-size: 15px;
+      font-weight: bold;
+      text-align: center;
+      margin: 0 auto 40px;
+    }
+  }
+  ::v-deep .van-popup__close-icon {
+    color: #0F458E;
+  }
+</style>

src/views/secondHandCar/carSource.vue

@@ -268,7 +268,6 @@ export default {
    if( this.form.vehicleRearPhoto ) {
      this.vehicleRearPhotoList = [{url: this.form.vehicleRearPhoto}]
    }
-    // console.log("carSourceFormInfo",carSourceFormInfo)
    if(carSourceFormInfo.otherImgSrc0){
      this.otherImgSrc.push(carSourceFormInfo.otherImgSrc0)
      this.otherImgSrcList.push({url:carSourceFormInfo.otherImgSrc0})
@@ -293,7 +292,6 @@ export default {
       this.otherImgSrc.push(carSourceFormInfo.otherImgSrc5)
       this.otherImgSrcList.push({url:carSourceFormInfo.otherImgSrc5})
     }
-    // console.log("--",this.vehicleLicensePhotoList,this.vehicleAnglePhotoList,this.otherImgSrcList)
   },
   methods:{
     validatePrice(value) {
@@ -480,21 +478,6 @@ export default {
           otherPhoto:this.otherImgSrc?.join(',')
         })
         this.clearStorageFormInfo()
-        if(res.code == 200 && !res.msg){
-          this.$toast('发布成功')
-          if(this.isWebFunc()){
-            setTimeout(()=>{
-              this.closeParentDialog()
-            },1000)
-          }else{
-            setTimeout(()=>{
-              this.$router.push({ name: "mineRelease"})
-              sessionStorage.setItem('mineActiveTab',String(1) )
-            },1000)
-          }
-        }else{
-          this.$toast(res.msg)
-        }
         console.log("车源发布publishCarInfo",res)
       } catch (e){
         console.log('e',e)
@@ -605,7 +588,6 @@ export default {
 }
 .navBar{
   margin-bottom: 46px;
-
 }
 .noContentAudit{
   height: calc(100% - 42px);

src/views/secondHandCar/components/upload-common.vue

@@ -8,10 +8,11 @@
       :preview-full-image="false"
       :max-count="multiple ? 6 : 1"
       @click-preview="handlePreviewClick"
+      :deletable="showDel"
   >
     <div class="upload">
       <img class="icon" src="@/assets/secondHandCar/upload.png"/>
-      <span class="text">{{ displayText }}</span>
+      <span class="text" v-show="!['交易合同','回收证明'].includes(displayText)">{{ displayText }}</span>
     </div>
     <template v-if="text.includes('其他照片')" #preview-cover="{ index }">
       <div class="preview-cover van-ellipsis">{{ index + 1 }}/6</div>
@@ -36,6 +37,10 @@ export default {
     files: {
       type: Array,
       default: () => []
+    },
+    showDel:{
+      type: Boolean,
+      default: true
     }
   },
   data() {

src/views/secondHandCar/forSale.vue

@@ -3,7 +3,7 @@
     <div class="headerWrap">
       <div v-if="isWebFunc()" style="opacity: 0;" class="back"></div>
       <img v-else class="back" @click="h5GoBack" src="@/assets/secondHandCar/back.png" />
-      <span>在售</span>
+      <span>{{detailInfo?.status?.code !== 6 ? '在售' : '已售出'}}</span>
       <div style="opacity: 0;" class="back"></div>
     </div>
     <van-loading v-show="!detailInfo"  class="loadingWrap"  type="spinner" color="#1989fa" />
@@ -46,7 +46,11 @@
               <span>{{ formatNumber(detailInfo.minPrice) }}</span>
               <span>万</span>
             </div>
-            <div class="viewNum">{{detailInfo.attentionCount}}人想要<span>{{detailInfo.browseCount}}浏览</span></div>
+            <div class="viewNum">{{detailInfo.attentionCount}}人想要<span>{{detailInfo.browseCount}}人浏览</span></div>
+          </div>
+          <div class="price commonColor">
+            车源ID: &nbsp;&nbsp;&nbsp;&nbsp;{{ detailInfo.code }}
+            <img class="copyIcon" @click="copyHandler(detailInfo.code)" src="@/assets/copy.png" />
           </div>
         </div>
         <div class="detailInfoWrap wrapCommon">
@@ -136,6 +140,7 @@ export default {
       startTime: null, // 记录进入时间
       recordType:1,
       isList:false,//是否是首页列表跳转过来的
+      recordResponseId:'',//信息记录获取的id，用于关闭界面掉接口所需参数
     }
   },
   async mounted() {
@@ -157,6 +162,7 @@ export default {
         queryType:this.queryType ,
       })
       this.detailInfo=res?.data
+      // console.log("this.detailInfo",this.detailInfo)
       const municipalities = ['北京市', '天津市', '上海市', '重庆市'];
       const isMunicipality = municipalities.some(city => res.data.areaName.includes(city));
       this.detailInfo.areaName= isMunicipality ? res.data.areaName?.substring(0, 3) : res.data.areaName;
@@ -167,12 +173,25 @@ export default {
         this.imgSrcList.unshift(res?.data?.vehicleRearPhoto)
       }
       this.imgSrcList.unshift(res?.data?.vehicleAnglePhoto)
+      let result=await saveRecord({type: 1, carInfoId: this.id, duration:'',id:''});
+      // console.log('resultresult',result)
+      this.recordResponseId=result?.data?.id
     }
   },
   destroyed() {
     this.getDuration(1)
   },
   methods:{
+    copyHandler(copyText){
+      let inputNode = document.createElement('input')  // 创建input
+      inputNode.value = copyText // 赋值给 input 值
+      document.body.appendChild(inputNode) // 插入进去
+      inputNode.select() // 选择对象
+      document.execCommand('Copy') // 原生调用执行浏览器复制命令
+      inputNode.className = 'oInput'
+      inputNode.style.display = 'none' // 隐藏
+      this.$toast('复制成功')
+    },
     showImagePreview(index) {
       ImagePreview({
         images: this.imgSrcList.map(item => item),
@@ -197,7 +216,7 @@ export default {
       this.saveRecord(duration,type);
     },
     async saveRecord(duration,type){
-      await saveRecord({type: type, carInfoId: this.id, duration})
+      await saveRecord({type: type, carInfoId: this.id, duration,id:this.recordResponseId || ''})
     },
     handle(){
       this.getDuration(2)
@@ -269,7 +288,7 @@ export default {
     margin-bottom: 12px;
   }
   .titleWrap{
-    height: 108px;
+    height: 120px;
     padding: 18px 0 15px 21px;
     display: flex;
     flex-direction: column;
@@ -300,7 +319,7 @@ export default {
       justify-content: space-between;
       align-items: center;
       .viewNum{
-        color: #ccc;
+        //color: #ccc;
         margin-right: 15px;
         span{
           margin-left: 10px;
@@ -432,4 +451,14 @@ export default {
     object-fit: cover;
     object-position: center;
   }
+.copyIcon {
+  width: 35px;
+  height: 15px;
+  margin-left: 10px
+}
+  .commonColor {
+    color: #999999 !important;
+    display: flex;
+    align-items: center;
+  }
 </style>

src/views/secondHandCar/indexList.vue

@@ -126,7 +126,7 @@
                   <div class="price">
                     售价（含税）：<span>￥</span> <span>{{formatNumber(item.minPrice) }}</span> <span>万</span>
                   </div>
-                  <div class="viewNum">{{item.attentionCount}}人想要<span>{{item.browseCount}}浏览</span></div>
+                  <div class="viewNum">{{item.attentionCount}}人想要<span>{{item.browseCount}}人浏览</span></div>
                 </div>
                 <div v-else class="priceWrap">
                   <div  class="priceRange">
@@ -135,7 +135,7 @@
                     <span class="su">~</span>
                     <span class="num">{{formatNumber(item.maxPrice) }}</span> <span  class="danwei">万</span>
                   </div>
-                  <div class="viewNum">{{item.attentionCount}}人想卖<span>{{item.browseCount}}浏览</span></div>
+                  <div class="viewNum">{{item.attentionCount}}人想卖<span>{{item.browseCount}}人浏览</span></div>
                 </div>
                 <div class="line"></div>
               </div>
@@ -719,7 +719,7 @@ export default {
         justify-content: space-between;
         align-items: center;*/
         .viewNum{
-          color: #ccc;
+          //color: #ccc;
           margin-right: 15px;
           span{
             margin-left: 10px;

src/views/secondHandCar/mineRelease.vue

@@ -32,7 +32,7 @@
               <div class="right">
                 <div class="title">
                   <span>{{item.vehicleType}}</span>
-                  <img class="titleImg"  :src="getStatus(item.status?.code)" />
+                  <img :class="{'titleImg':true,bigImg:[8,9].includes(item.status?.code)}"  :src="getStatus(item.status?.code)" />
                 </div>
 
                                 <div v-if="activeTab==0" class="type">{{ item.boardType?.label  ? item.boardType?.label+' | ' : ''}}  {{ item.licenseType?.label }} |
@@ -50,8 +50,10 @@
                 <div class="btnWrap">
                   <img v-if="(activeTab==1 && item.status?.code==3) || activeTab==2"  @click.stop="noMultipleClicks(reviseHandle,item)" class="revise"  src="@/assets/secondHandCar/revise.png" />
                   <img v-if="(activeTab==1 && (item.status?.code==1 || item.status?.code==3)) || activeTab==2"  @click.stop="noMultipleClicks(xiajiaHandle,item)" class="xiajia"  src="@/assets/secondHandCar/xiajia.png" />
+                  <img v-if="(activeTab==1 && item.status?.code==9)"  @click.stop="noMultipleClicks(reviseXiajiaHandle,item)" class="reshangjia"  src="@/assets/secondHandCar/reviseXiajia.png" />
                   <img v-if="((activeTab==3 && item.status?.code==7) || activeTab==2) && !isToday(item.wapTime)"  @click.stop="noMultipleClicks(polishHandle,item)" class="polish"  src="@/assets/secondHandCar/polish.png" />
                   <img v-if="activeTab==3 && item.type==1 && item.downReason=='不卖了' "  @click.stop="noMultipleClicks(reShangJiaHandle,item)" class="reshangjia"  src="@/assets/secondHandCar/reshangjia.png" />
+                  <img v-if="(activeTab==3 &&  [10,11].includes(item.status?.code)) || (activeTab==1 && [8,9].includes(item.status?.code))"  @click.stop="noMultipleClicks(viewXiajiaHandle,item)" class="reshangjia"  src="@/assets/secondHandCar/viewXiajia.png" />
                 </div>
                 <div class="line"></div>
               </div>
@@ -63,13 +65,14 @@
     <div class="empty" v-show="show">
       <img src="@/assets/empty.png" />
     </div>
-    <van-popup v-model="poupShow" closeable round  :style="{ width: '70%',height:'18%' }"  class="poupWrap">
+    <van-popup v-model="poupShow" closeable round  :style="{ width: '70%',height:xiajiaInfo.proprietary==1 && xiajiaInfo?.type==1 && radio==1 ? '20%' : '18%' }"  class="poupWrap">
       <span class="title">下架原因</span>
       <div class="poupContent">
         <van-radio-group v-model="radio" class="radioWrap">
           <van-radio name="1">{{xiajiaInfo?.type==1 ? '已售出' : '已买到'}}</van-radio>
           <van-radio name="2">{{xiajiaInfo?.type==1 ? '不卖了' : '不买了'}}</van-radio>
         </van-radio-group>
+        <div v-show="xiajiaInfo.proprietary==1 && xiajiaInfo?.type==1 && radio==1" class="tip">注：已售出需前往完善售出信息</div>
         <div class="btnWrap">
           <div class="btn" @click="noMultipleClicks(submitHandle)">确认</div>
         </div>
@@ -121,7 +124,9 @@ export default {
     },
     onRefresh() {
       this.pageNum=1
-      setTimeout(() => {
+      setTimeout(async () => {
+        // this.pageList=[]
+        await this.getList()
         this.$toast('刷新成功');
         this.isLoading = false;
       }, 1000);
@@ -158,13 +163,19 @@ export default {
         this.$toast('下架原因不能为空')
         return
       }
-      await usedCarRemove({
-        id:this.xiajiaInfo.id,
-        downReason:this.radio==1 ? (this.xiajiaInfo?.type==1 ? '已售出' : '已买到') : (this.xiajiaInfo?.type==1 ? '不卖了' : '不买了')
-      })
-      this.poupShow=false
-      this.radio = ''
-      await this.getList()
+      if(this.xiajiaInfo.proprietary==1 && this.xiajiaInfo?.type==1 && this.radio==1){
+        this.poupShow=false
+        this.radio = ''
+        this.$router.push({ name: "sellingInfo", query: {id:this.xiajiaInfo.id,type:'revise'}})
+      }else{
+        await usedCarRemove({
+          id:this.xiajiaInfo.id,
+          downReason:this.radio==1 ? (this.xiajiaInfo?.type==1 ? '已售出' : '已买到') : (this.xiajiaInfo?.type==1 ? '不卖了' : '不买了')
+        })
+        this.poupShow=false
+        this.radio = ''
+        await this.getList()
+      }
     },
     reviseHandle(item){//修改
       this.$router.push({
@@ -191,8 +202,17 @@ export default {
         console.log('reShangJiaHandle',e)
       }
     },
+    reviseXiajiaHandle(item){//修改下架
+      console.log("修改下架",item)
+      this.$router.push({ name: "sellingInfo", query: {id:item.id,type:'revise'}})
+    },
+    viewXiajiaHandle(item){//查看下架
+      console.log("查看下架",item)
+      this.$router.push({ name: "sellingInfo", query: {id:item.id,type:'view'}})
+    },
     xiajiaHandle(item){//下架
       this.poupShow=true
+      this.radio = ''
       this.xiajiaInfo=item
     },
     isToday(time) {
@@ -214,14 +234,24 @@ export default {
     },
     getStatus(i){
       switch (i){
+        case 1://待审核
+          return require('@/assets/secondHandCar/wait_verify.png')
+        case 3://审核不通过
+          return require('@/assets/secondHandCar/nopass.png')
         case 5://已发布
           return require('@/assets/secondHandCar/fabuing.png')
         case 6://已下架
           return require('@/assets/secondHandCar/alreayXiajia.png')
         case 7://信息过期
           return require('@/assets/secondHandCar/expire.png')
-        case 1://待审核
-          return require('@/assets/secondHandCar/wait_verify.png')
+        case 8://下架待审核
+          return require('@/assets/secondHandCar/xiajia_warting.png')
+        case 9://下架不通过
+          return require('@/assets/secondHandCar/xiajia_nopass.png')
+        case 10://下架售出
+          return require('@/assets/secondHandCar/xiajia_saled.png')
+        case 11://下架报废
+          return require('@/assets/secondHandCar/xiajia_scrap.png')
         default://未通过
           return require('@/assets/secondHandCar/nopass.png')
       }
@@ -364,6 +394,10 @@ export default {
         width: 43px;
         height: 14px;
       }
+      .bigImg{
+        width: 60px;
+        height: 16px;
+      }
     }
     .type{
       font-weight: 400;
@@ -477,6 +511,11 @@ export default {
       }
     }
   }
+  .tip{
+    color: red;
+    margin-left: 25px;
+    margin-bottom: 6px;
+  }
 }
 .empty{
   @include flexTwoCenter;

src/views/secondHandCar/sellingInfo.vue

@@ -0,0 +1,489 @@
+<template>
+  <div class="wrap" >
+    <div class="headerWrap">
+      <img class="bg" src="@/assets/secondHandCar/bg.png" />
+      <div class="navWrap">
+        <div v-if="isWebFunc()" style="opacity: 0;" class="back"></div>
+        <img v-else class="back" @click="h5GoBack" src="@/assets/secondHandCar/back.png" />
+        <img class="navIcon" src="@/assets/secondHandCar/sellingInfo.png" />
+<!--        <span class="title">售出信息</span>-->
+        <div style="opacity: 0;" class="back"></div>
+      </div>
+      <div class="audit" v-if="type=='revise' && status==9 && auditRemark">
+        <span><img class="noAudit" src="@/assets/secondHandCar/noAudit.png" />审核不通过：</span>
+        <span>{{auditRemark }}</span>
+      </div>
+    </div>
+    <div class="contentWrap" :class="[!(status==9 && auditRemark) ? 'noReasonWrap': 'hasReasonWrap']">
+      <div  class="content">
+        <div class="item" style="align-items: center">
+          <span> <span class="star">*</span>售出渠道 </span>
+          <van-radio-group v-model="form.salesChannel" direction="horizontal" class="radioWrap"  :disabled="type !== 'revise'">
+            <van-radio name="1" :class="{'checked':form.salesChannel==1,'salesChannelRadio':true,'radio':true}">中道二手拖车</van-radio>
+            <van-radio name="2" :class="{'checked':form.salesChannel==2,'salesChannelRadio':true}">本地线下</van-radio>
+            <van-radio name="3" :class="{'checked':form.salesChannel==3,'salesChannelRadio':true}">报废</van-radio>
+          </van-radio-group>
+        </div>
+        <template v-if="form.salesChannel==3">
+          <div class="item" style="margin-top: 8px">
+            <span style="line-height: 0.5rem"> <span class="star">*</span>报废机动车回收证明 </span>
+            <upload-common  @success3="getRecyclePhoto"   @delete3="deleteImgRecycle" :show-del="type == 'revise'"
+                            :text="'回收证明'" :multiple="false"  :files.sync="recyclePathList"/>
+          </div>
+          <div class="item">
+            <span> <span class="star">*</span>报废年月</span>
+            <van-field
+                :disabled="type !== 'revise'"
+                @focus="showDatetime = true"
+                class="radioWrap"
+                readonly
+                v-model="scrapTimeFormatShow"
+                input-align="right"
+            >
+            </van-field>
+          </div>
+        </template>
+        <template v-else>
+          <div class="item">
+            <span> <span class="star">*</span>购买方 </span>
+            <van-field
+                :disabled="type !== 'revise'"
+                class="radioWrap"
+                v-model="form.purchaser"
+                input-align="right"
+            > </van-field>
+          </div>
+          <div class="item">
+            <span> <span class="star">*</span>售出价格 </span>
+            <van-field
+                :disabled="type !== 'revise'"
+                type="number"
+                class="radioWrap"
+                v-model="form.sellPrice"
+                input-align="right"
+            >
+              <template slot="right-icon" >
+                <span style="white-space: nowrap;  margin-left: 8px;"> 元 </span>
+              </template>
+            </van-field>
+          </div>
+          <div class="item"  style="margin-top: 8px">
+            <span> <span class="star">*</span>交易合同 </span>
+            <upload-common @success3="getTradePhoto"   @delete3="deleteImgTrade" :show-del="type == 'revise'"
+                           :text="'交易合同'" :multiple="false"  :files.sync="tradeContractPathList"/>
+          </div>
+          <div class="item">
+            <span> <span class="star">*</span>交易年月</span>
+            <van-field
+                :disabled="type !== 'revise'"
+                @focus="showDatetime = true"
+                class="radioWrap"
+                readonly
+                v-model="tradeTimeFormatShow"
+                input-align="right"
+            > </van-field>
+          </div>
+        </template>
+      </div>
+      <div class="btnWrap" v-if="type !== 'view'">
+        <div v-if="type == 'revise'" class="btn commonBtn"  @click="noMultipleClicks(submitHandle)">确认售出</div>
+        <template  v-else-if="type=='audit'">
+          <div style="margin: 10px">不通过原因</div>
+          <el-input style="margin-bottom: 10px;margin-left: 10px"  class="ipt" v-model.trim="auditReason" type="textarea"  :autosize="{ minRows: 2, maxRows: 6 }"
+                    maxlength="200" show-word-limit placeholder="请填写不通过原因"></el-input>
+          <div  class="auditBtn">
+            <div  class="commonBtn" @click="noMultipleClicks(auditHandle,0)">审核不通过</div>
+            <div  class="commonBtn" @click="noMultipleClicks(auditHandle,1)"><span style="margin-right: 6px">✔</span>审核通过</div>
+          </div>
+        </template>
+      </div>
+    </div>
+    <van-popup v-model="showDatetime" round position="bottom">
+      <van-datetime-picker
+          class="dataTime"
+          v-if="showDatetime"
+          v-model="time"
+          type="date"
+          :min-date="minDate"
+          @confirm="onConfirm"
+          @cancel="showDatetime = false"
+      />
+    </van-popup>
+  </div>
+</template>
+
+<script>
+import {myMixins} from "@/utils/myMixins"
+import {auditCarInfo, usedCarRemove,carInfoDetail,auditCarInfoAgain} from "@/api/secondHandCar"
+import uploadCommon from "@/views/secondHandCar/components/upload-common.vue";
+import {timeFormat} from "@/utils/common";
+export default {
+  name: "sellingInfo",
+  mixins:[myMixins],
+  data(){
+    return{
+      noClick:true,
+      form:{
+        id:'',
+        downReason: '已售出',
+        salesChannel:'',
+        purchaser:'',
+        sellPrice:'',
+        tradeContractPath:'',
+        tradeTime:'',
+        recyclePath:'',
+        scrapTime:'',
+      },
+      tradeContractPathList:[],
+      recyclePathList:[],
+      otherImgSrc:[],
+      otherImgSrcList:[],
+      type:'',
+      auditRemark:'',
+      auditReason:'',
+      status:'' ,
+      time:'',
+      showDatetime:false,
+      minDate: new Date(),
+    }
+  },
+  async mounted() {
+    const urlParams = new URLSearchParams(window.location.search);
+    this.form.id=this.$route.query.id ||  urlParams.get('id');
+    this.type=this.$route.query.type || urlParams.get('type');
+    if( this.form.id){
+      let res = await carInfoDetail({
+        id:this.form.id,
+        queryType:4,
+      })
+      this.form={...res.data}
+      this.form.downReason='已售出'
+      this.auditRemark=res.data?.auditRemark
+      this.status=res.data?.status?.code
+      if(res.data?.tradeContractPath){
+        this.tradeContractPathList=[{url:res.data?.tradeContractPath}]
+      }
+      if(res.data?.recyclePath){
+        this.recyclePathList=[{url:res.data?.recyclePath}]
+      }
+    }
+  },
+  methods:{
+    onConfirm(data) {
+      this.time = timeFormat(new Date(data))
+      if(this.form.salesChannel==3){
+        this.form.scrapTime = timeFormat(new Date(data))
+      }else {
+        this.form.tradeTime = timeFormat(new Date(data))
+      }
+      this.showDatetime = false;
+    },
+    // 审核操作
+    async auditHandle(type){
+      if (!type && !this.auditReason){
+        this.$toast('请填写不通过原因')
+        return
+      }
+      try {
+        await auditCarInfo({
+          id: this.form.id,
+          auditResult: type  ? 1 : 0 ,
+          auditReason: this.auditReason,
+          ...this.form,
+          licenseType:this.form?.licenseType?.code,
+          boardType:this.form?.boardType?.code,
+          emissionStandard:this.form?.emissionStandard?.code,
+        })
+        setTimeout(()=>{
+          this.closeParentDialog()
+        },1000)
+      } finally {
+        console.log(type)
+      }
+    },
+    async submitHandle(){
+      let rule = this.validationRules.find(item =>
+          item.required && (item.value === null || item.value === undefined || item.value === ''))
+      if(rule){
+        this.$toast(rule.name)
+        return
+      }
+      try {
+        // 清除原本选择的信息
+        if(this.form.salesChannel==3){
+          this.form.purchaser=''
+          this.form.sellPrice=''
+          this.form.tradeContractPath=''
+          this.form.tradeTime=''
+        }else{
+          this.form.recyclePath=''
+          this.form.scrapTime=''
+        }
+        let res=''
+        if(this.status == 9){
+          res=await auditCarInfoAgain({// 审核不通过再次提交
+            ...this.form,
+            salesChannel:Number(this.form.salesChannel)
+          })
+        }else {
+          res=await usedCarRemove({
+            ...this.form,
+            salesChannel:Number(this.form.salesChannel)
+          })
+        }
+        if(res.code == 200 && !res.msg){
+          this.$toast('操作成功')
+          if(this.isWebFunc()){
+            setTimeout(()=>{
+              this.closeParentDialog()
+            },1000)
+          }else{
+            setTimeout(()=>{
+              this.h5GoBack()
+            },1000)
+          }
+        }else{
+          this.$toast(res.msg)
+        }
+      } catch (e) {
+        console.log(e)
+      }
+    },
+    getTradePhoto(data) {
+      this.form.tradeContractPath = data.url
+    },
+    deleteImgTrade() {
+      this.form.tradeContractPath = '';
+    },
+    getRecyclePhoto(data) {
+      this.form.recyclePath = data.url
+    },
+    deleteImgRecycle() {
+      this.form.recyclePath = '';
+    },
+  },
+  computed: {
+    tradeTimeFormatShow(){
+      return this.form.tradeTime ? this.form.tradeTime?.substring(0,10) :  '';
+    },
+    scrapTimeFormatShow(){
+      return this.form.scrapTime ? this.form.scrapTime?.substring(0,10) :  '';
+    },
+    validationRules() {
+      return [
+        {required:true, value: this.form.salesChannel, name: '售出渠道不能为空' },
+        {required:this.form.salesChannel==3 ? false : true, value: this.form.purchaser, name: '购买方不能为空' },
+        {required:this.form.salesChannel==3 ? false : true, value: this.form.sellPrice, name: '售出价格不能为空' },
+        {required:this.form.salesChannel==3 ? false : true, value: this.form.tradeContractPath, name: '交易合同文件不能为空' },
+        {required:this.form.salesChannel==3 ? false : true, value: this.form.tradeTime, name: '交易年月不能为空' },
+        {required:this.form.salesChannel==3 ? true : false, value: this.form.recyclePath, name: '报废机动车回收证明不能为空' },
+        {required:this.form.salesChannel==3 ? true : false, value: this.form.scrapTime, name: '报废年月不能为空' },
+      ];
+    },
+  },
+  components:{uploadCommon}
+}
+</script>
+
+<style scoped lang="scss">
+@import '@/styles/mixin.scss';
+.wrap {
+  @include wh(100%, 100%);
+  position: relative;
+}
+.headerWrap{
+  width: 100%;
+  box-sizing: border-box;
+  padding-top: 15px;
+  padding-bottom: 15px;
+  position: relative;
+  .navWrap{
+    width: 100%;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    box-sizing: border-box;
+    padding: 0 16px 10px;
+  }
+  .bg {
+    position: absolute;
+    width: 100%;
+    height: 120px;
+    line-height: 120px;
+    top: 0;
+    left: 0;
+    opacity: 0.5;
+    z-index: -1;
+  }
+  .back{
+    @include wh(15px,15px);
+  }
+  .title{
+    font-weight: bold;
+    font-size: 16px;
+    color: #203152;
+  }
+  .navIcon{
+    @include wh(84px,21px);
+  }
+  .audit{
+    @include wh(100%,43px);
+    background: #FFF7F4;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    font-size: 11px;
+    color: #FF6B3B;
+    .noAudit{
+      @include wh(13px,12px);
+      margin-right: 5px;
+      vertical-align: bottom;
+    }
+    span:first-child{
+      font-weight: 600;
+    }
+  }
+}
+.navBar{
+  margin-bottom: 46px;
+}
+.noReasonWrap{
+  height: calc(100% - 42px);
+}
+.hasReasonWrap{
+  height: calc(100% - 85px);
+}
+.contentWrap{
+  width: 100%;
+  overflow-y: auto;
+  @include sizingPadding(15px,15px);
+  @include flexBetween;
+  .btnWrap{
+    padding-bottom: 20px;
+    padding-top: 15px;
+  }
+  .commonBtn{
+    height: 46px;
+    line-height: 46px;
+    text-align: center;
+    font-weight: bold;
+    border-radius: 5px;
+    color: #FFFFFF;
+    cursor: pointer;
+  }
+  .btn{
+    width: 296px;
+    background: #4A7FEB;
+    margin: 0 auto;
+    font-size: 15px;
+  }
+  .auditBtn{
+    display: flex;
+    justify-content: space-between;
+    font-size: 14px;
+    box-sizing: border-box;
+    padding: 0 6px;
+    div:first-child{
+      width: 100px;
+      opacity: 0.79;
+      background: #1C2C49;
+    }
+    div:last-child{
+      width: 200px;
+      background: #4A7FEB;
+    }
+  }
+}
+
+.content{
+  width: 100%;
+  .item{
+    display: flex;
+    font-weight: 400;
+    font-size: 13px;
+    color: #2C3D54;
+    line-height: 44px;
+    width: 100%;
+    box-sizing: border-box;
+    padding-left: 21px;
+    padding-right: 9px;
+    span:first-child{
+      display: inline-block;
+      width:70px;
+      font-size: 13px;
+      color: rgba(44, 61, 84, 0.59);
+    }
+    span:last-child{
+      display: inline-block;
+      width:calc(100% - 70px);
+      border-bottom: 1px solid #E9E9EA;
+    }
+    .orc{
+      box-sizing: border-box;
+      padding-left: 6px;
+    }
+  }
+  .star{
+    color: #FF4B4B !important;
+    opacity: 1 !important;
+    font-weight: bold;
+    font-size: 12px;
+    margin-right: 6px;
+    margin-left: -6px;
+  }
+  .radioWrap{
+    width:calc(100% - 70px);
+    border-bottom: 1px solid #E9E9EA;
+  }
+}
+.lastLine{
+  margin-top: 3px !important;
+}
+::v-deep .van-icon-success{
+  display: none !important;
+}
+::v-deep .van-radio__label{
+  margin-left: 0;
+  width: 54px;
+  height: 23px;
+  border-radius: 13px;
+  border: 1px solid #9F9F9F;
+  opacity: 0.5;
+  text-align: center;
+  line-height: 23px;
+  font-size: 12px;
+  color: #323233;
+  opacity: 1;
+}
+::v-deep .van-radio--horizontal{
+  margin-right: 4px;
+}
+::v-deep .van-radio--horizontal:last-child{
+  margin-right: 0;
+}
+::v-deep  .checked .van-radio__label{
+  background: #FFF1EC !important;
+  border: 1px solid #FF5C26 !important;
+  color: #FE5006 !important;
+  border-radius: 13px !important;
+}
+::v-deep  .van-field__right-icon{
+  margin-right: 0;
+  padding: 0;
+}
+::v-deep .ipt .el-textarea__inner{
+  background: #F5F7F9;
+  border-radius: 4px;
+  font-size: 12px;
+  border: none;
+}
+::v-deep .van-popup__close-icon--top-right{
+  display: none;
+}
+::v-deep .salesChannelRadio .van-radio__label{
+  margin-bottom: 8px !important;
+}
+::v-deep .radio .van-radio__label{
+  width: 80px !important;
+}
+</style>

src/views/secondHandCar/wantBuySale.vue

@@ -21,7 +21,13 @@
             <span class="su">~</span>
             <span class="num">{{formatNumber(detailInfo.maxPrice) }}</span> <span  class="danwei">万</span>
           </div>
-          <div class="viewNum">{{detailInfo.attentionCount}}人想卖<span>{{detailInfo.browseCount}}浏览</span></div>
+          <div class="viewNum">{{detailInfo.attentionCount}}人想卖<span>{{detailInfo.browseCount}}人浏览</span></div>
+        </div>
+        <div class="priceWrap">
+          <div class="commonColor" style="margin-top: 5px">
+            车源ID: &nbsp;&nbsp;&nbsp;&nbsp;{{ detailInfo.code }}
+            <img class="copyIcon" @click="copyHandler(detailInfo.code)" src="@/assets/copy.png" />
+          </div>
         </div>
       </div>
       <div class="detailInfoWrap wrapCommon">
@@ -72,6 +78,7 @@ export default {
       duration:'',
       startTime: null, // 记录进入时间
       isList:false,
+      recordResponseId:'',//信息记录获取的id，用于关闭界面掉接口所需参数
     }
   },
   async mounted() {
@@ -92,19 +99,31 @@ export default {
         queryType: this.queryType,
       })
       this.detailInfo = res?.data
+      let result=await saveRecord({type: 1, carInfoId: this.id, duration:'',id:''});
+      this.recordResponseId=result?.data?.id
     }
   },
   destroyed() {
     this.getDuration(1)
   },
   methods:{
+    copyHandler(copyText){
+      let inputNode = document.createElement('input')  // 创建input
+      inputNode.value = copyText // 赋值给 input 值
+      document.body.appendChild(inputNode) // 插入进去
+      inputNode.select() // 选择对象
+      document.execCommand('Copy') // 原生调用执行浏览器复制命令
+      inputNode.className = 'oInput'
+      inputNode.style.display = 'none' // 隐藏
+      this.$toast('复制成功')
+    },
     getDuration(type){
       const endTime = new Date();
       const duration = (endTime - this.startTime) / 1000; // 计算时长（秒）
       this.saveRecord(duration,type);
     },
     async saveRecord(duration,type){
-      await saveRecord({type:type,carInfoId:this.id,duration})
+      await saveRecord({type:type,carInfoId:this.id,duration,id:this.recordResponseId || ''})
     },
     handle(){
       this.getDuration(2)
@@ -190,7 +209,7 @@ export default {
       justify-content: space-between;
       align-items: center;
       .viewNum{
-        color: #ccc;
+        //color: #ccc;
         margin-right: 15px;
         span{
           margin-left: 10px;
@@ -287,4 +306,14 @@ export default {
     cursor: pointer;
   }
 }
+.commonColor {
+  color: #999999 !important;
+  display: flex;
+  align-items: center;
+}
+.copyIcon {
+  width: 35px;
+  height: 15px;
+  margin-left: 10px
+}
 </style>

src/views/vehicle-maintenance/vehicle-alarm-detail.vue

@@ -0,0 +1,415 @@
+<template>
+  <div class="wrap">
+    <div class="alarm_info">
+      <div class="alarm_title">
+        <div class="title_left">
+          <span class="car_title">{{info.alarmTypeString}}</span>
+          <img class="alarm_level" v-if="info.level == 1" src="@/assets/alarm_one.png" alt="">
+          <img class="alarm_level" v-if="info.level == 2" src="@/assets/alarm_two.png" alt="">
+          <img class="alarm_level" v-if="info.level == 3" src="@/assets/alarm_three.png" alt="">
+        </div>
+        <div class="status">{{info.handStatusString}}</div>
+      </div>
+      <div class="content_list">
+        <div class="alarm_content">
+          <div class="label">报警时间:</div>
+          <div class="content">{{info.startTime}}</div>
+        </div>
+        <div class="alarm_content">
+          <div class="label">报警详情:</div>
+          <div class="content">{{info.alarmRemark}}</div>
+        </div>
+        <div class="alarm_content">
+          <div class="label">报警照片:</div>
+          <div class="content">
+            <img class="photo" v-if="info.url" :src="info.url" alt="">
+          </div>
+        </div>
+        <div class="alarm_content">
+          <div class="label">报警通道:</div>
+          <div class="content content_flex">
+            <span>{{ info.plateNumber + '_' + (info?.channel || '') }} <!--浙A7H1M2_1--></span>
+            <span class="btn" @click="goAlarmMonitoring">查看监控</span>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div class="alarm_info car_info">
+      <div class="car_title title">
+        车辆位置
+      </div>
+      <div class="car_map">
+        <div class="map_title">
+          <span class="driver_name">{{info.vehicleName}} / {{info.plateNumber}}</span>
+          <span class="driver_name">司机：{{info.onlineDriverName}} <a :href="'tel:' + info.onlinePhone">{{info.onlinePhone}}</a></span>
+        </div>
+        <div class="map_cover" id="container"></div>
+      </div>
+    </div>
+    <div class="deal_btn" v-if="[0, 3].includes(info.handStatus)" @click="dealWithShow = true">处理</div>
+    <van-popup v-model="dealWithShow" v-if="dealWithShow" round position="center">
+      <div class="dialog_wrap">
+        <div class="dialog_title">报警处理</div>
+        <div>
+          <van-radio-group v-model="radio" @change="change" class="horizontal-radio-group">
+            <van-radio v-for="item in radioList" :key="item.value" :name="item.value" :disabled="item.disabled" class="item">
+              <span :style="{ color: radio === item.value ? '#393230' : 'rgba(0, 0, 0, 0.5)' }">
+                {{ item.name }}
+              </span>
+              <img
+                slot="icon"
+                class="icon"
+                slot-scope="props"
+                :src="props.checked ? activeIcon : inactiveIcon"
+              >
+            </van-radio>
+          </van-radio-group>
+          <div class="alarm_tip" v-if="['1', '2', '3'].includes(String(info.alarmType))">
+            注：开始处理后将流转至技术支持进行处理。
+          </div>
+          <div class="alarm_text" v-if="radio == 5">
+            <textarea class="alarm_textarea" id="text-input" rows="6" placeholder="处理结果：" v-model.trim="remark"></textarea>
+          </div>
+          <div class="btn_wrap">
+            <div class="btn_confirm" @click="noMultipleClicks(operatorHandle)">确认</div>
+            <div class="btn_close" @click="dealWithShow = false">关闭</div>
+          </div>
+        </div>
+      </div>
+    </van-popup>
+  </div>
+</template>
+
+<script>
+  import {myMixins} from "@/utils/myMixins"
+  import { getAlarmByCode, dealWithAlarm } from "@/api/order"
+  import trailerPosition from "@/assets/alarm_trailer.png";
+  import repairPosition from "@/assets/alarm_repair.png";
+  export default {
+    name: "vehicleAlarmDetail",
+    mixins: [ myMixins ],
+    data() {
+      return {
+        noClick: true,
+        map: null,
+        lng: 121.553376,
+        lat: 31.247998,
+        radio: '',
+        activeIcon: require('@/assets/alarm_check.png'),
+        inactiveIcon: require('@/assets/alarm_unCheck.png'),
+        dealWithShow: false,
+        radioList: [{ name: '开始处理', value: 3, disabled: false }, { name: '处理完成', value: 5, disabled: false }],
+        remark: '',
+        code: '',
+        info: {}
+      }
+    },
+    mounted() {
+      this.code = this.$route.query.code;
+      this.getAlarmDetail();
+      this.initMap();
+    },
+    methods: {
+      // 新增方法：重置弹窗状态
+      resetPopupState() {
+        this.radio = '';
+        this.remark = '';
+        // 重置radioList状态
+        this.radioList = [
+          { name: '开始处理', value: 3, disabled: false },
+          { name: '处理完成', value: 5, disabled: false }
+        ];
+      },
+      goAlarmMonitoring() {
+        let data = {
+          "action":"goMonitoring",
+          "params": {
+            "code": this.code
+          }
+        };
+        let u = navigator.userAgent;
+        let isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);
+        if(isiOS){
+          window.webkit.messageHandlers.nativeObject.postMessage(data);
+        }else {
+          window.android.sendMessage("code=" + this.code);
+        }
+      },
+      async operatorHandle() {
+        try {
+          await dealWithAlarm({
+            alarmId: this.info.id,
+            handleStatus: this.radio,
+            remark: this.remark
+          })
+          this.$toast('操作成功')
+          this.resetPopupState();
+        } finally {
+           this.dealWithShow = false;
+           await this.getAlarmDetail();
+        }
+      },
+      change(e) {
+        this.radio = e
+      },
+      async getAlarmDetail() {
+        let res = await getAlarmByCode({
+          code: this.code
+        });
+        if(!res.data) {
+          this.$router.push({
+            name: 'vehicleAlarmList',
+            params: {
+              token: localStorage.getItem('token')
+            },
+            replace: true  // 关键：替换当前路由，而不是新增历史记录
+          });
+          return
+        }
+        this.info = res?.data;
+        // 每次获取详情时重置radioList
+        this.radioList = [
+          { name: '开始处理', value: 3, disabled: false },
+          { name: '处理完成', value: 5, disabled: false }
+        ];
+        if( this.info.handStatus == 0 && ['1', '2', '3'].includes(String(this.info.alarmType))) {    // 未处理，且需要技术处理
+          this.radio =  this.radioList[0].value
+          this.radioList[1].disabled = true
+        }
+        if(this.info.handStatus == 3) {
+          this.radioList[0].disabled = true
+        }
+      },
+      initMap() {
+        this.map = new AMap.Map('container',{
+          zoom:14,//级别(缩放比例 3-20 )
+          center: [this.lng, this.lat],//中心点坐标
+          viewMode:'2D',//使用3D视图
+        })
+        this.map.on('complete', () => {
+          this.mapMarkers();
+        });
+      },
+      mapMarkers() {
+        let url = String(this.info.vehicleType) == '5' ? repairPosition : trailerPosition
+        let marker = new AMap.Marker({
+          position: [this.lng, this.lat],
+          icon: new AMap.Icon({
+            image: url, // 图片的相对路径
+            size: new AMap.Size(42, 50),  // 图标的尺寸
+            imageSize: new AMap.Size(42, 50)  // 图片的实际尺寸
+          }),
+        });
+        this.map.add(marker);
+      }
+    }
+  }
+</script>
+<style scoped lang="scss">
+  .wrap {
+    width: 100%;
+    height: 100%;
+    background-color: #F4F5F7 !important;
+    box-sizing: border-box;
+    overflow-y: auto;
+    padding: 0 12px;
+    box-sizing: border-box;
+  }
+  .alarm_info {
+    padding-top: 12px;
+    padding-bottom: 16px;
+    background: #FFFFFF;
+    box-shadow: 0px 1px 4px 0px rgba(39,52,125,0.05);
+    border-radius: 6px;
+    backdrop-filter: blur(5.602678571428572px);
+    margin-top: 10px;
+    .alarm_title {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      border-bottom: 1px solid rgba(233, 233, 234, 0.6);
+      padding: 3px 20px 10px 18px;
+      .title_left {
+        display: flex;
+        align-items: center;
+        .alarm_level {
+          width: 32px;
+          height: 14px;
+          margin-left: 7px;
+        }
+      }
+      .status {
+        font-size: 11px;
+        color: #FA8D14;
+        font-weight: bold;
+      }
+    }
+    .content_list {
+      padding: 12px 18px 0px;
+    }
+    .alarm_content {
+      display: flex;
+      margin-bottom: 6px;
+      .content {
+        margin-left: 10px;
+        font-size: 12px;
+        color: rgba(0, 0, 0, 0.75);
+        flex: 1;
+        .btn {
+          /*display: inline-block;*/
+          padding: 5px 12px;
+          background: #FA8236;
+          border-radius: 3px;
+          color: #fff;
+          font-size: 12px;
+        }
+        .photo {
+          width: 75px;
+          height: 55px;
+          margin-right: 6px;
+          margin-bottom: 6px;
+        }
+      }
+    }
+  }
+
+  .label {
+    color: rgba(0, 0, 0, 0.5);
+  }
+  .content_flex {
+    display: flex;
+    justify-content: space-between;
+  }
+  .car_title {
+    font-size: 14px;
+    font-weight: bold;
+    color: rgba(0, 0, 0, 0.85);
+  }
+  .title {
+    padding-left: 18px;
+    margin-bottom: 8px;
+  }
+  .car_info {
+    padding: 12px 4px 5px 4px;
+  }
+  .car_map {
+    width: 100%;
+    /*height: 204px;*/
+    border-radius: 4px;
+    border: 1px solid #F0F0F0;
+    background-color: #F9FCFF;
+    box-sizing: border-box;
+    .map_title {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      padding: 10px 8px 10px 15px;
+      .driver_name {
+        font-size: 12px;
+        color: #000000;
+        a {
+          color: #377BE6;
+        }
+      }
+    }
+    .map_cover {
+      width: 100%;
+      height: 174px;
+      background-color: #fff;
+    }
+  }
+  .deal_btn {
+    width: calc(100% - 38px);
+    height: 48px;
+    text-align: center;
+    line-height: 48px;
+    position: fixed;
+    bottom: 10px;
+    left: 19px;
+    font-size: 15px;
+    color: #fff;
+    background: #354D93;
+    border-radius: 5px;
+  }
+  .dialog_wrap {
+    width: 325px;
+    border-radius: 13px;
+    .dialog_title {
+      height: 68px;
+      line-height: 82px;
+      background: linear-gradient( 180deg, #FFE8DA 0%, rgba(255,233,233,0) 100%);
+      font-size: 18px;
+      color: #E0481E;
+      text-align: center;
+      font-weight: bold;
+    }
+    .horizontal-radio-group {
+      display: flex;
+      flex-direction: row;
+      justify-content: space-around;
+      margin-bottom: 15px;
+      .icon {
+        width: 16px;
+        height: 16px;
+      }
+      .item {
+        font-size: 14px;
+        margin-bottom: 8px;
+        display: flex;
+        align-items: center;
+      }
+    }
+    .alarm_tip {
+      font-size: 14px;
+      color: #FF5D3B;
+      margin: 10px 0 20px;
+      text-align: center;
+    }
+    .alarm_text {
+      width: 100%;
+      padding: 0 25px 15px;
+      box-sizing: border-box;
+      .alarm_textarea {
+        width: 100%;
+        background: #FFFBFB;
+        border-radius: 3px;
+        border: 1px solid #F97C64;
+        backdrop-filter: blur(10px);
+        padding: 10px;
+        color: #FF5D3B;
+        box-sizing: border-box;
+      }
+      .alarm_textarea::placeholder {
+        color: rgba(255, 93, 59, 0.8);
+      }
+    }
+    .btn_wrap {
+      .btn_confirm {
+        width: 173px;
+        height: 42px;
+        line-height: 42px;
+        color: #FFFFFF;
+        font-size: 15px;
+        font-weight: bold;
+        text-align: center;
+        background: #F16363;
+        border-radius: 23px;
+        margin: 0 auto;
+      }
+      .btn_close {
+        margin-top: 12px;
+        margin-bottom: 22px;
+        font-size: 14px;
+        color: rgba(44, 65, 85, 0.6);
+        text-align: center;
+      }
+    }
+  }
+  ::v-deep .van-radio__icon {
+    display: flex;
+    align-items: center;
+  }
+  ::v-deep .van-radio__label--disabled {
+    opacity: 0.5;
+  }
+</style>

src/views/vehicle-maintenance/vehicle-alarm-list.vue

@@ -0,0 +1,239 @@
+<template>
+  <div class="wrap">
+    <div class="tab_wrap">
+      <div class="item_wrap" v-for="(item, index) in tabArr" :key="index" @click="changeTab(index)">
+        <span class="alpha" :class="{'active' : activeIndex == index }"> {{ item.name }}</span>
+        <span class="numTip" style="opacity: 1 !important;" v-if="item.num > 0">{{item.num}}</span>
+      </div>
+    </div>
+    <van-pull-refresh class="refresh" v-model="isLoading" @refresh="onRefresh" v-show="!show">
+      <van-list
+        v-model="loading"
+        :finished="finished"
+        finished-text="没有更多了"
+        @load="onLoad"
+      >
+        <div class="content_wrap">
+          <div class="alarm_wrap" v-for="(item, index) in pageList" :key="index" @click="goDetail(item)">
+            <div class="alarm_title">
+              <div class="title_left">
+                <span>{{item.alarmTypeString}}</span>
+                <img class="alarm_level" v-if="item.level == 1" src="@/assets/alarm_one.png" alt="">
+                <img class="alarm_level" v-if="item.level == 2" src="@/assets/alarm_two.png" alt="">
+                <img class="alarm_level" v-if="item.level == 3" src="@/assets/alarm_three.png" alt="">
+              </div>
+              <div class="label">{{item.startTime}}</div>
+            </div>
+            <div class="alarm_content">
+              <div class="label">车辆名称:</div>
+              <div class="content">{{item.vehicleName}}</div>
+            </div>
+            <div class="alarm_content">
+              <div class="label">报警详情:</div>
+              <div class="content">{{item.alarmRemark}}</div>
+            </div>
+          </div>
+        </div>
+      </van-list>
+    </van-pull-refresh>
+    <div class="bgEmptyImg" v-show="show" >
+      <img src="@/assets/emptyData.png" />
+    </div>
+  </div>
+</template>
+
+<script>
+  import {myMixins} from "@/utils/myMixins"
+  import { getAlarmList, getAlarmCount } from "@/api/order"
+  export default {
+    name: "vehicleAlarmList",
+    data() {
+      return {
+        tabArr: [{ name: '未处理',  num: 0 }, { name: '技术处理中', num: 0 }, {name: '处理中', num: 1 }],
+        activeIndex: 0,
+        pageNum:1,
+        pageSize:10,
+        total:'',
+        pageList: [],
+        isLoading: '',
+        loading: false,
+        finished: false,
+      }
+    },
+    mixins: [ myMixins ],
+    computed:{
+      show() {
+        return (this.pageList.length < 0 || this.pageList.length == 0); // 判断数组长度是否大于 0
+      },
+    },
+    async mounted() {
+      await this.getList()
+    },
+    methods: {
+      goDetail(item) {
+        this.goPage('vehicleAlarmDetail', { code: item.code })
+      },
+      async getCount() {
+        let res = await getAlarmCount();
+        this.tabArr[0].num = res?.data?.alarmCount || 0
+        this.tabArr[1].num = res?.data?.jxCount || 0
+        this.tabArr[2].num = res?.data?.yyCount || 0
+      },
+      async changeTab(index) {
+        this.activeIndex = index
+        this.pageNum = 1
+        this.pageList = [];
+        this.total= 0
+        await this.getList()
+      },
+      async getList() {
+        let handleStatus;
+        if( this.activeIndex == 2 ) {
+          handleStatus = 3
+        } else {
+          handleStatus = this.activeIndex
+        }
+        let res = await getAlarmList({
+          pageNum:this.pageNum,
+          pageSize:this.pageSize,
+          handStatus: handleStatus
+        })
+        this.total = res.total
+        if(this.pageNum == 1){// 第一页直接赋值
+          this.pageList=res.data
+        }else{// 第二页数据拼接
+          let preList = this.pageList;
+          let arr = res.data;
+          this.pageList = preList.concat(arr)
+        }
+        await this.getCount();
+      },
+      async onLoad(){
+        this.pageNum++;
+        await this.getList()
+        this.loading = false;
+        if (this.pageList.length >= this.total) {
+          this.finished = true;
+        }
+      },
+      async onRefresh() {
+        this.pageNum=1
+        await this.getList()
+        setTimeout(() => {
+          this.$toast('刷新成功');
+          this.isLoading = false;
+        }, 1000);
+      },
+    }
+  }
+</script>
+<style scoped lang="scss">
+  .wrap{
+    width: 100%;
+    height: 100%;
+    background-color: #F4F5F7 !important;
+    box-sizing: border-box;
+    overflow-y: auto;
+  }
+.tab_wrap {
+  display: flex;
+  justify-content: space-around;
+  padding-top: 15px;
+  padding-bottom: 10px;
+  position: fixed;
+  width: 100%;
+  top: 0;
+  left: 0;
+  background-color: #F4F5F7;
+  z-index: 100;
+  .item_wrap {
+    display: flex;
+    align-items: center;
+  }
+  .alpha {
+    color: rgba(115, 115, 115, 0.7);
+    font-size: 13px;
+    line-height: 13px;
+  }
+  .active {
+    font-size: 14px;
+    color: #3678FF;
+    position: relative;
+  }
+  .active:after {
+    content: '';
+    display: block;
+    width: 18px;
+    height: 3px;
+    background: linear-gradient( 270deg, #33A3FF 0%, #176AFE 100%);
+    border-radius: 2px;
+    position: absolute;
+    margin-top: 3px;
+    left: 50%;
+    transform: translateX(-50%);
+  }
+  .numTip {
+    border-radius: 4px;
+    background: #F95B45;
+    display: inline-block;
+    padding: 2px 4px;
+    font-weight: 600;
+    font-size: 11px;
+    color: #FFFFFF;
+    margin-left: 5px;
+  }
+}
+  .content_wrap {
+    padding: 50px 12px 0;
+    .alarm_wrap {
+      margin-top: 10px;
+      background: #FFFFFF;
+      box-shadow: 0px 2px 10px 0px rgba(216,216,216,0.5);
+      border-radius: 6px;
+      padding: 13px 13px 17px 18px;
+      box-sizing: border-box;
+      .alarm_title {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+      }
+      .label {
+        color: rgba(0, 0, 0, 0.5);
+      }
+      .title_left {
+        display: flex;
+        align-items: center;
+        span {
+          font-size: 14px;
+          font-weight: bold;
+          color: rgba(0, 0, 0, 0.85);
+        }
+        .alarm_level {
+          width: 32px;
+          height: 14px;
+          margin-left: 7px;
+        }
+      }
+      .alarm_content {
+        display: flex;
+        margin-top: 10px;
+        .content {
+          margin-left: 10px;
+          font-size: 13px;
+          color: rgba(0, 0, 0, 0.75);
+        }
+      }
+    }
+  }
+
+  .bgEmptyImg{
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    height: 90% ;
+    background-color: #F4F5F7;
+    img{
+      width: 100%;
+    }
+  }
+</style>