diff --git a/public/index.html b/public/index.html
index d9895573..5f8596f5 100644
--- a/public/index.html
+++ b/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` 上
diff --git a/src/assets/report/add_report_address.png b/src/assets/report/add_report_address.png
new file mode 100644
index 00000000..de86f725
Binary files /dev/null and b/src/assets/report/add_report_address.png differ
diff --git a/src/assets/report/add_report_arrow.png b/src/assets/report/add_report_arrow.png
new file mode 100644
index 00000000..da2bcce8
Binary files /dev/null and b/src/assets/report/add_report_arrow.png differ
diff --git a/src/assets/report/add_report_bg.png b/src/assets/report/add_report_bg.png
new file mode 100644
index 00000000..e08704a5
Binary files /dev/null and b/src/assets/report/add_report_bg.png differ
diff --git a/src/assets/report/add_report_close.png b/src/assets/report/add_report_close.png
new file mode 100644
index 00000000..d2c75539
Binary files /dev/null and b/src/assets/report/add_report_close.png differ
diff --git a/src/assets/report/add_report_dot.png b/src/assets/report/add_report_dot.png
new file mode 100644
index 00000000..61b4367a
Binary files /dev/null and b/src/assets/report/add_report_dot.png differ
diff --git a/src/assets/report/add_report_time.png b/src/assets/report/add_report_time.png
new file mode 100644
index 00000000..dbcc8f57
Binary files /dev/null and b/src/assets/report/add_report_time.png differ
diff --git a/src/assets/report/destMarker.png b/src/assets/report/destMarker.png
new file mode 100644
index 00000000..6048b23b
Binary files /dev/null and b/src/assets/report/destMarker.png differ
diff --git a/src/assets/report/report_address.png b/src/assets/report/report_address.png
new file mode 100644
index 00000000..ce0389f7
Binary files /dev/null and b/src/assets/report/report_address.png differ
diff --git a/src/assets/report/report_ai.png b/src/assets/report/report_ai.png
new file mode 100644
index 00000000..d9d95e0e
Binary files /dev/null and b/src/assets/report/report_ai.png differ
diff --git a/src/assets/report/report_cancel.png b/src/assets/report/report_cancel.png
new file mode 100644
index 00000000..586182c2
Binary files /dev/null and b/src/assets/report/report_cancel.png differ
diff --git a/src/assets/report/report_customer.png b/src/assets/report/report_customer.png
new file mode 100644
index 00000000..c4d7e8aa
Binary files /dev/null and b/src/assets/report/report_customer.png differ
diff --git a/src/assets/report/report_delay.png b/src/assets/report/report_delay.png
new file mode 100644
index 00000000..4b9d3dc8
Binary files /dev/null and b/src/assets/report/report_delay.png differ
diff --git a/src/assets/report/report_dispatch.png b/src/assets/report/report_dispatch.png
new file mode 100644
index 00000000..d5e1b577
Binary files /dev/null and b/src/assets/report/report_dispatch.png differ
diff --git a/src/assets/report/report_driver.png b/src/assets/report/report_driver.png
new file mode 100644
index 00000000..99d713bc
Binary files /dev/null and b/src/assets/report/report_driver.png differ
diff --git a/src/assets/report/report_fee.png b/src/assets/report/report_fee.png
new file mode 100644
index 00000000..bc98eb9f
Binary files /dev/null and b/src/assets/report/report_fee.png differ
diff --git a/src/assets/report/report_line.png b/src/assets/report/report_line.png
new file mode 100644
index 00000000..aa2691ce
Binary files /dev/null and b/src/assets/report/report_line.png differ
diff --git a/src/assets/report/report_logo.png b/src/assets/report/report_logo.png
new file mode 100644
index 00000000..93c0a03e
Binary files /dev/null and b/src/assets/report/report_logo.png differ
diff --git a/src/assets/report/report_other.png b/src/assets/report/report_other.png
new file mode 100644
index 00000000..39c7c008
Binary files /dev/null and b/src/assets/report/report_other.png differ
diff --git a/src/assets/report/report_unconnect.png b/src/assets/report/report_unconnect.png
new file mode 100644
index 00000000..2de06177
Binary files /dev/null and b/src/assets/report/report_unconnect.png differ
diff --git a/src/router/index.js b/src/router/index.js
index 56a0f1aa..628ff4d8 100644
--- a/src/router/index.js
+++ b/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: '/',
@@ -277,6 +278,7 @@ const routes = [
     ...kpiRouter,
     ...invoiceRouter,
     ...secondHandRouter,
+    ...reportRouter
   ]
 
 const router = new VueRouter({
diff --git a/src/router/report-router.js b/src/router/report-router.js
new file mode 100644
index 00000000..7260ab58
--- /dev/null
+++ b/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
diff --git a/src/utils/map.js b/src/utils/map.js
index 8ae80e92..f7deaedc 100644
--- a/src/utils/map.js
+++ b/src/utils/map.js
@@ -36,6 +36,7 @@ export function getAddress(mapContext, lnglat) {
         } else {
           console.log(result)
           alert(JSON.stringify(result))
+          reject(result)
         }
       })
     })
@@ -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);
 }
+*/
diff --git a/src/views/report/addressMap.vue b/src/views/report/addressMap.vue
new file mode 100644
index 00000000..c21bc175
--- /dev/null
+++ b/src/views/report/addressMap.vue
@@ -0,0 +1,206 @@
+<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 } from '@/utils/map'
+  export default {
+    name: "addressMap",
+    data() {
+      return {
+        keyword: '',
+        addressList: [],
+        activeIndex: '',
+        map: '',
+        marker: null,
+      }
+    },
+    watch: {
+      keyword() {
+        this.searchHandler()
+      }
+    },
+    async mounted() {
+      sessionStorage.setItem('reportAddress', '')
+      await this.initMap()
+    },
+    methods: {
+      initMap() {   // 初始化地图
+        this.map = new AMap.Map('mapId', {
+          viewMode: '2D',  // 默认使用 2D 模式
+          zoom:11,  //初始化地图层级
+        })
+      },
+      async searchHandler() {
+        this.activeIndex = null
+        if( this.keyword ) {
+          this.addressList = await searchFun(this.map, '', 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>
diff --git a/src/views/report/components/report-list-item.vue b/src/views/report/components/report-list-item.vue
new file mode 100644
index 00000000..b4ca8526
--- /dev/null
+++ b/src/views/report/components/report-list-item.vue
@@ -0,0 +1,61 @@
+<template>
+  <div class="bottom_wrap">
+    <div class="report_item">
+      <img class="report_icon" src="@/assets/report/report_delay.png" alt="">
+      <div class="report_title">救援延误</div>
+    </div>
+    <div class="report_item">
+      <img class="report_icon" src="@/assets/report/report_unconnect.png" alt="">
+      <div class="report_title">客户失联</div>
+    </div>
+    <div class="report_item">
+      <img class="report_icon" src="@/assets/report/report_cancel.png" alt="">
+      <div class="report_title">客户取消</div>
+    </div>
+    <div class="report_item">
+      <img class="report_icon" src="@/assets/report/report_address.png" alt="">
+      <div class="report_title">地址变更</div>
+    </div>
+    <div class="report_item">
+      <img class="report_icon" src="@/assets/report/report_fee.png" alt="">
+      <div class="report_title">费用报备</div>
+    </div>
+    <div class="report_item">
+      <img class="report_icon" src="@/assets/report/report_other.png" alt="">
+      <div class="report_title">其他报备</div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "report-list-item"
+}
+</script>
+
+<style scoped lang="scss">
+.bottom_wrap {
+  width: 100%;
+  /*position: fixed;*/
+  bottom: 0;
+  padding: 0 34px 20px;
+  display: flex;
+  flex-wrap: wrap;
+  background: #FFFFFF;
+  box-shadow: 0px 0px 20px 0px rgba(53,73,93,0.2);
+  .report_item {
+    width: 25%;
+    margin-top: 20px;
+    .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>
diff --git a/src/views/report/components/service-item.vue b/src/views/report/components/service-item.vue
new file mode 100644
index 00000000..fe4f4c49
--- /dev/null
+++ b/src/views/report/components/service-item.vue
@@ -0,0 +1,96 @@
+<template>
+  <div class="wrap">
+    <div class="service_title">
+      <span class="name">故障平板拖车</span>
+      <span class="status">调度成功，等待发车备份</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">单号：ZD20240878990</div>
+        <div class="company">单位：上海安昌汽车救援有限公司</div>
+        <div class="driver_info">
+          <span class="driver_name">张师傅</span>
+          <span>13666665577</span>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+  export default {
+    name: "service-item"
+  }
+</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;
+  }
+}
+.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>
diff --git a/src/views/report/reportIndex.vue b/src/views/report/reportIndex.vue
new file mode 100644
index 00000000..2f13fe4b
--- /dev/null
+++ b/src/views/report/reportIndex.vue
@@ -0,0 +1,402 @@
+<template>
+  <div class="main_wrap">
+    <div class="top_bg">
+      <div class="title">报备中心</div>
+    </div>
+    <div class="service_wrap">
+      <service-item></service-item>
+    </div>
+    <div class="chat_list">
+      <div class="top_tip_wrap">为了快速解决问题，请选择下方咨询类型</div>
+      <!--ai对话框 s -->
+      <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">张师傅你好，请选择报备内容</div>
+          <ul>
+            <li @click="addReportShow = true">“联系不上客户”</li>
+            <li>“联系不上客户”</li>
+            <li>“联系不上客户”</li>
+            <li>“联系不上客户”</li>
+            <li>“联系不上客户”</li>
+          </ul>
+        </div>
+      </div>
+      <!--ai对话框 e -->
+      <div class="tip_wrap">5月29日 10:48</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">客服已处理</div>
+          <div class="response_con">收到老师，这边反馈处理，请稍等2分钟，给您回复</div>
+        </div>
+      </div>
+      <!--客服对话框 e -->
+      <div class="tip_wrap">5月29日 10:48</div>
+      <!--服务人员对话框 s -->
+      <div class="server_item mb20">
+        <div class="common_right service_cls">
+          <div class="service_status">客服已处理</div>
+          <div class="response_con">收到老师，这边反馈处理，请稍等2分钟，给您回复</div>
+        </div>
+        <div class="customer_left">
+          <img class="profile_photo ml" src="@/assets/report/report_driver.png" alt="">
+        </div>
+      </div>
+      <!--服务人员对话框 e -->
+      <div class="tip_wrap">5月29日 10:48</div>
+      <!--服务人员对话框 s -->
+      <div class="server_item mb20">
+        <div class="common_right service_cls">
+          <div class="service_status">客服已处理</div>
+          <div class="response_con">收到老师，这边反馈处理，请稍等2分钟，给您回复</div>
+        </div>
+        <div class="customer_left">
+          <img class="profile_photo ml" src="@/assets/report/report_dispatch.png" alt="">
+        </div>
+      </div>
+      <!--服务人员对话框 e -->
+    </div>
+
+    <report-list-item />
+
+    <van-popup ref="addReportModal" v-model="addReportShow" 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">
+          <!--预约时间报备 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 -->
+
+          <!--修改地址报备 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 -->
+          <div class="report_title">
+            <img class="dot" src="@/assets/report/add_report_dot.png" alt="">
+            <span>补充报备内容</span>
+          </div>
+          <div class="report_common_content">
+            <van-field
+              v-model="remark"
+              class="report_textarea"
+              placeholder="点击这里输入补充报备内容" />
+          </div>
+        </div>
+        <div class="report_btn">
+          提交报备
+        </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"
+        @confirm="onConfirm"
+        @cancel="showDatetime = false"
+      />
+    </van-popup>
+  </div>
+</template>
+
+<script>
+  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"
+  export default {
+    name: "reportIndex",
+    components: { serviceItem, reportListItem },
+    mixins: [myMixins],
+    data() {
+      return {
+        addReportShow: false,
+        remark: '',
+        showDatetime: false,
+        appointTime: '',
+        address: '',
+        lat: '',
+        lng: '',
+        adCode: '',
+      }
+    },
+    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: {
+      onConfirm(data) {
+        this.appointTime = timeFormat(new Date(data))
+        this.showDatetime = false;
+      }
+    }
+  }
+</script>
+
+<style lang="scss" scoped>
+  #app {
+    background: #F9FCFF !important;
+  }
+  .main_wrap {
+    width: 100%;
+    height: 100%;
+    background: #F9FCFF !important;
+    display: flex;
+    flex-direction: column;
+  }
+.top_bg {
+  width: 100%;
+  height: 162px;
+  background: #334885;
+  .title {
+    color: #fff;
+    text-align: center;
+    padding-top: 52px;
+    font-size: 17px;
+    line-height: 24px;
+  }
+}
+.service_wrap {
+  margin-top: -75px;
+  margin-bottom: 20px;
+}
+.chat_list {
+  flex: 1;
+  overflow: auto;
+  .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;
+        }
+      }
+    }
+    .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;
+    }
+  }
+</style>