1.部分页面位置调整

2.修改部分样式颜色
3.新增物流页面

src/assets/styles/variable.scss

@@ -31,6 +31,6 @@ $txtGray:#8792A4;
 
 //订单状态颜色
 $orderReturn:#D9001B;
-$orderCold:#02a7f0;
-$orderJm:#4b7902;
+$orderJm:#02a7f0;
+$orderCold:#4b7902;
 

src/components/MapView.vue

@@ -15,13 +15,15 @@
 </template>
 
 <script>
-import { AMapManager} from 'vue-amap';
+import {AMapManager} from 'vue-amap'
 import VueAMap from 'vue-amap'
-let amapManager = new VueAMap.AMapManager();
 // var map = amapManager.getMap();
 import AMap from 'AMap'
-//引入高德地图ui组件
-import { lazyAMapApiLoaderInstance } from "vue-amap"; 
+// 引入高德地图ui组件
+import {lazyAMapApiLoaderInstance} from 'vue-amap'
+
+let amapManager = new VueAMap.AMapManager()
+
 export default {
   name: 'MapView',
   props: {
@@ -31,17 +33,17 @@ export default {
     }
   },
   data() {
-    let _obj = this;
+    let _obj = this
     return {
       status: this.value,
       amapManager,
       center: [116.379028, 39.865042],
       plugin: [
         {
-          pName: "Scale",
+          pName: 'Scale',
           events: {
             init(instance) {
-              console.log(instance);
+              console.log(instance)
             }
           }
         }
@@ -50,33 +52,33 @@ export default {
       events: {
         init(o) {
           // _obj.createMap();
-          o.setMapStyle('amap://styles/macaron'); //自定义的高德地图的样式，我选的是马卡龙
-          let marker = new AMap.Marker({ //点图标
+          o.setMapStyle('amap://styles/macaron') // 自定义的高德地图的样式，我选的是马卡龙
+          let marker = new AMap.Marker({ // 点图标
             position: [116.379028, 39.865042]
-          });
+          })
           // o.setZoomAndCenter(16, [116.379028, 39.865042])
-          marker.setMap(o);
-          o.plugin(["AMap.Driving"], function() {
+          marker.setMap(o)
+          o.plugin(['AMap.Driving'], function () {
             var driving = new AMap.Driving({
               map: o,
               showTraffic: false // 是否显示拥堵状态
             })
-            //地点关键字+ 驾车路线规划
-            driving.search(new AMap.LngLat(116.379028, 39.865042), new AMap.LngLat(116.427281, 39.903719), function(status, result) {
-                // result 即是对应的驾车导航信息，相关数据结构文档请参考  https://lbs.amap.com/api/javascript-api/reference/route-search#m_DrivingResult
-                if (status === 'complete') {
-                  console.log('绘制驾车路线完成');
-                } else {
-                  console.log('获取驾车数据失败：' + result);
-                }
+            // 地点关键字+ 驾车路线规划
+            driving.search(new AMap.LngLat(116.379028, 39.865042), new AMap.LngLat(116.427281, 39.903719), function (status, result) {
+              // result 即是对应的驾车导航信息，相关数据结构文档请参考  https://lbs.amap.com/api/javascript-api/reference/route-search#m_DrivingResult
+              if (status === 'complete') {
+                console.log('绘制驾车路线完成')
+              } else {
+                console.log('获取驾车数据失败：' + result)
               }
+            }
             )
-            o.addControl(driving);
+            o.addControl(driving)
           })
         }
       },
       marker: {},
-      map: {} //保存地图对象
+      map: {} // 保存地图对象
     }
   },
   watch: {
@@ -93,10 +95,10 @@ export default {
 
     },
     createMap() {
-      o.setMapStyle('amap://styles/macaron'); //自定义的高德地图的样式，我选的是马卡龙
-      let marker = new AMap.Marker({ //点图标
+      o.setMapStyle('amap://styles/macaron') // 自定义的高德地图的样式，我选的是马卡龙
+      let marker = new AMap.Marker({ // 点图标
         position: [116.379028, 39.865042]
-      });
+      })
     },
     action() {
       this.$emit('action', '')
@@ -105,7 +107,7 @@ export default {
 }
 </script>
 <style lang="scss" scoped>
-  #MapView {
-    // height: 44px;
-  }
-</style>
\ No newline at end of file
+#MapView {
+  // height: 44px;
+}
+</style>

src/router/myOrder/index.js

@@ -15,7 +15,15 @@ const myOrder = [
       title: '订单详情',
       auth: false
     },
-    component: resolve => require(['@/views/myOrder/orderDetail'], resolve)
+    component: resolve => require(['@/views/myOrder/detail/orderDetail'], resolve)
+  },
+  {
+    path: '/logisticsDetail',
+    name: 'logisticsDetail',
+    meta: {
+      title: '物流详情',
+      auth: false
+    }
   }
 ]
 export default myOrder

src/views/myOrder/detail/logisticsDetail.vue

+<template>
+  <div class="logistics-content">
+    <map-view/>
+    <div class="logistics-head">
+      <van-icon :name="icons.logo"/>
+      <span>承运商: 绥德库</span>
+      <span>市内</span>
+    </div>
+    <div >运单号: 3902202102250062</div>
+    <div >配送人: 罗平行 13300992222</div>
+
+  </div>
+</template>
+
+<script>
+import MapView from '../../../components/MapView'
+export default {
+  name: 'logisticsDetail',
+  components: {MapView},
+  data () {
+    return {
+      icons: {
+        logo: require('@/assets/img/u48.png')
+      }
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+
+</style>

src/views/myOrder/orderDetail.vue → src/views/myOrder/detail/orderDetail.vue

@@ -75,10 +75,10 @@
 </template>
 
 <script>
-import OrderStateItem from './components/orderStateItem'
-import OrderState from './components/orderState'
-import GoodsSimpleItem from './components/goodsSimpleItem'
-import InvoiceSimpleItem from './components/invoiceSimpleItem'
+import OrderStateItem from '../components/orderStateItem'
+import OrderState from '../components/orderState'
+import GoodsSimpleItem from '../components/goodsSimpleItem'
+import InvoiceSimpleItem from '../components/invoiceSimpleItem'
 
 export default {
   name: 'orderDetail',