静音，订单详情

src/api/system/device.js

@@ -84,6 +84,13 @@ export function refreshDevice(deviceId) {
   })
 }
 
+// 静音
+export function mute(sn) {
+  return request({
+    url: '/system/device/mute/' + sn,
+    method: 'post'
+  })
+}
 
 // 查询所有车辆信息
 export function allDevice() {

src/views/system/device/device_detail.vue

@@ -207,7 +207,7 @@
                 <el-button type="info" icon="el-icon-unlock" @click="seatCushionLock">坐垫锁</el-button>
               </el-col>
               <el-col :span="6">
-                <el-button type="success" icon="el-icon-volume-off" @click="refresh">静音</el-button>
+                <el-button :type="deviceInfo.isSound === '0'?'success':'danger'" icon="el-icon-volume-off" @click="mute">{{ deviceInfo.isSound === '0'? '关闭静音': '静音' }}</el-button>
               </el-col>
             </el-row>
           </div>
@@ -348,7 +348,7 @@ import {
   refreshDevice,
   seatCushionLock,
   updateDevice,
-  getDeviceBySn
+  getDeviceBySn, mute
 } from '@/api/system/device'
 import LocationMap from "@/components/Map/location/LocationMapss.vue";
 import { listDept2 } from "@/api/system/dept";
@@ -649,6 +649,16 @@ export default {
         this.initData();
       }).catch(() => { });
     },
+    mute(){
+      if (!this.deviceInfo.sn) {
+        this.$modal.msgError("设备ID不能为空");
+        return;
+      }
+      mute(this.deviceInfo.sn).then(() => {
+        this.$modal.msgSuccess("更新成功");
+        this.initData();
+      }).catch(() => { });
+    },
     handleUpdate() {
       this.reset();
       this.open = true;

src/views/system/order/orderDetail.vue

@@ -39,15 +39,18 @@
           <span v-else>--</span>
         </el-descriptions-item>
         <el-descriptions-item label="还车定位">
-          <template v-if="detail.returnLon && detail.returnLat">
+          <template v-if="detail.returnType === '1'">
-            <a
+            <template v-if="detail.returnLon && detail.returnLat">
-              :href="`https://uri.amap.com/marker?position=${detail.returnLon},${detail.returnLat}`"
+              <a
-              target="_blank"
+                :href="`https://uri.amap.com/marker?position=${detail.returnLon},${detail.returnLat}`"
-              class="link-type">
+                target="_blank"
-              <dict-tag :options="dict.type.et_return_mode" :value="detail.returnMode" />
+                class="link-type">
-            </a>
+                <dict-tag :options="dict.type.et_return_mode" :value="detail.returnMode" />
+              </a>
+            </template>
+            <span v-else>--</span>
           </template>
-          <span v-else>--</span>
+          <el-tag v-else type="warning">辅助还车</el-tag>
         </el-descriptions-item>
       </el-descriptions>
       <div class="card-header2">
@@ -141,44 +144,57 @@
           <div slot="header" class="card-header">
             <span>行程记录</span>
           </div>
-          <el-timeline class="padding0" v-if="detail.tripLogs && detail.tripLogs.length > 0">
+          <!-- 添加一个包裹 el-timeline 的 div 并设置固定高度和滚动 -->
-            <el-timeline-item
+          <div class="timeline-container" v-if="detail.commandLogs && detail.commandLogs.length > 0">
-              v-for="log in detail.tripLogs"
+            <el-timeline class="padding0">
-              :key="log.createTime"
+              <el-timeline-item
-              :timestamp="parseTime(log.createTime)"
+                v-for="log in detail.commandLogs"
-              :color="getTimelineItemColor(log.type)"
+                :key="log.createTime"
-            >
+                :timestamp="parseTime(log.createTime)"
-              <div class="timeline-content">
+                :color="getTimelineItemColor(log.type)"
-                <span class="operation-type" :style="{ color: getTimelineItemColor(log.type) }">
+              >
-                  <dict-tag :options="dict.type.et_trip_log_type" :value="log.type" />
+                <div class="timeline-content">
-                    <span
+              <span class="operation-type" :style="{ color: getTimelineItemColor(log.type) }">
-                      class="link-type nobold"
+                <span>{{log.type}}</span>
-                      @click="$router.push('/system/device/sn/index/' + log.sn)">
+                <span
-                      {{ log.sn }}
+                  class="link-type nobold"
-                    </span>
+                  @click="$router.push('/system/device/sn/index/' + log.sn)">
+                  {{ log.sn }}
                 </span>
+              </span>
 
-                <el-tooltip placement="right" effect="light" popper-class="operation-tooltip">
+                  <!-- 如果最后一个对象是还车关锁，则显示辅助还车还是正常还车 -->
-                  <div slot="content">
+                  <span v-if="log.type === '4'">
-                    <div>{{ log.description }}</div>
+                <span v-if="detail.returnType === '1'">
-                    <div v-if="log.longitude && log.latitude">
+                  <el-tag type="success">正常还车</el-tag>
-                      位置:
+                </span>
-                      <a
+                <span v-else>
-                        :href="`https://uri.amap.com/marker?position=${log.longitude},${log.latitude}`"
+                  <el-tag type="warning">辅助还车</el-tag>
-                        target="_blank"
+                </span>
-                        class="link-type">
+              </span>
-                        {{ log.longitude }},{{ log.latitude }}
+
-                      </a>
+                  <el-tooltip placement="right" effect="light" popper-class="operation-tooltip">
+                    <div slot="content">
+                      <div>{{ log.description }}</div>
+                      <div v-if="log.longitude && log.latitude">
+                        位置:
+                        <!-- 点击位置链接时触发弹窗 -->
+                        <span
+                          class="link-type"
+                          @click.stop="openLocationDialog(log.longitude, log.latitude)">
+                      {{ log.longitude }},{{ log.latitude }}
+                    </span>
+                      </div>
                     </div>
-                  </div>
+                    <i
-                  <i
+                      class="el-icon-info tooltip-icon"
-                    class="el-icon-info tooltip-icon"
+                      :style="{ color: getTimelineItemColor(log.type) }"
-                    :style="{ color: getTimelineItemColor(log.type) }"
+                    ></i>
-                  ></i>
+                  </el-tooltip>
-                </el-tooltip>
+                </div>
-              </div>
+              </el-timeline-item>
-            </el-timeline-item>
+            </el-timeline>
-          </el-timeline>
+          </div>
           <div v-else class="empty-history">
             <i class="el-icon-document"></i>
             <p>暂无行程记录</p>
@@ -186,6 +202,21 @@
         </el-card>
       </el-col>
     </el-row>
+
+    <!-- 弹窗组件 -->
+    <el-dialog
+      title="位置详情"
+      :visible.sync="locationDialogVisible"
+      width="60%"
+      top="5vh"
+      custom-class="location-dialog"
+      @opened="initMap"
+    >
+      <div v-if="selectedLocation" id="mapContainer" style="width: 100%; height: 400px;"></div>
+      <span slot="footer" class="dialog-footer">
+          <el-button type="primary" @click="locationDialogVisible = false">关闭</el-button>
+        </span>
+    </el-dialog>
   </div>
 </template>
 
@@ -209,15 +240,48 @@ export default {
         areaId: '',
         tripRouteStr: '',
         tripLogs: [],
+        commandLogs: [],
         // 其他字段...
       },
-      loading: false
+      loading: false,
+      locationDialogVisible: false,
+      selectedLocation: null,
     }
   },
   created() {
     this.fetchData()
   },
   methods: {
+    initMap() {
+      if (this.selectedLocation) {
+        this.map = new AMap.Map('mapContainer', {
+          zoom: 15, // 缩放级别
+          center: [this.selectedLocation.longitude, this.selectedLocation.latitude], // 中心点坐标
+          viewMode: '3D', // 使用3D视图
+        });
+
+        // 清除之前的标记
+        if (this.marker) {
+          this.marker.setMap(null);
+        }
+
+        // 添加新的标记
+        this.marker = new AMap.Marker({
+          position: [this.selectedLocation.longitude, this.selectedLocation.latitude],
+          map: this.map,
+        });
+      }
+    },
+    // 其他方法...
+    openLocationDialog(longitude, latitude) {
+      this.selectedLocation = { longitude, latitude };
+      if (this.map) {
+        // 关闭当前地图实例
+        this.map.destroy();
+        this.map = null;
+      }
+      this.locationDialogVisible = true;
+    },
     async fetchData() {
       this.loading = true;
       const orderId = this.$route.params.orderId;
@@ -282,14 +346,20 @@ export default {
     // 获取时间轴项颜色
     getTimelineItemColor(type) {
       switch (type) {
-        case '1': // 开始骑行
+        case '编号开锁': // 开始骑行
           return '#67C23A';
-        case '2': // 结束骑行
+        case '临时锁车': // 结束骑行
           return '#F56C6C';
-        case '3': // 临时锁车
+        case '解锁': // 临时锁车
-          return '#E6A23C';
+          return '#67C23A';
-        case '4': // 关锁
+        case '还车关锁': // 关锁
           return '#409EFF';
+        case '换车关锁': // 关锁
+          return '#f63f3f';
+        case '换车开锁': // 关锁
+          return '#67C23A';
+        case '辅助还车关锁': // 关锁
+          return '#08913f';
         default:
           return '#909399';
       }
@@ -390,4 +460,13 @@ export default {
 .refund-card {
   margin-top: 20px;
 }
+#mapContainer {
+  margin-top: 20px;
+}
+/* 设置固定高度并启用垂直滚动 */
+.timeline-container {
+  max-height: 500px; /* 根据需要调整高度 */
+  overflow-y: auto;
+}
+
 </style>