增加轨迹搜索

package-lock.json

@@ -9,7 +9,7 @@
       "version": "0.1.0",
       "dependencies": {
         "@iconfu/svg-inject": "^1.2.3",
-        "axios": "^1.6.8",
+        "axios": "^1.7.3",
         "bootstrap": "^4.4.1",
         "bootstrap-vue": "^2.2.2",
         "core-js": "^3.4.4",
@@ -2923,9 +2923,9 @@
       "dev": true
     },
     "node_modules/axios": {
-      "version": "1.6.8",
+      "version": "1.7.3",
-      "resolved": "https://registry.npmmirror.com/axios/-/axios-1.6.8.tgz",
+      "resolved": "https://registry.npmmirror.com/axios/-/axios-1.7.3.tgz",
-      "integrity": "sha512-v/ZHtJDU39mDpyBoFVkETcd/uNdxrWRrg3bKpOKzXFA6Bvqopts6ALSMU3y6ijYxbw2B+wPrIv46egTzJXCLGQ==",
+      "integrity": "sha512-Ar7ND9pU99eJ9GpoGQKhKf58GpUOgnzuaB7ueNQ5BMi0p+LZ5oaEnfF999fAArcTIBwXTCHAmGcHOZJaWPq9Nw==",
       "dependencies": {
         "follow-redirects": "^1.15.6",
         "form-data": "^4.0.0",
@@ -18813,9 +18813,9 @@
       "dev": true
     },
     "axios": {
-      "version": "1.6.8",
+      "version": "1.7.3",
-      "resolved": "https://registry.npmmirror.com/axios/-/axios-1.6.8.tgz",
+      "resolved": "https://registry.npmmirror.com/axios/-/axios-1.7.3.tgz",
-      "integrity": "sha512-v/ZHtJDU39mDpyBoFVkETcd/uNdxrWRrg3bKpOKzXFA6Bvqopts6ALSMU3y6ijYxbw2B+wPrIv46egTzJXCLGQ==",
+      "integrity": "sha512-Ar7ND9pU99eJ9GpoGQKhKf58GpUOgnzuaB7ueNQ5BMi0p+LZ5oaEnfF999fAArcTIBwXTCHAmGcHOZJaWPq9Nw==",
       "requires": {
         "follow-redirects": "^1.15.6",
         "form-data": "^4.0.0",

package.json

@@ -10,7 +10,7 @@
   },
   "dependencies": {
     "@iconfu/svg-inject": "^1.2.3",
-    "axios": "^1.6.8",
+    "axios": "^1.7.3",
     "bootstrap": "^4.4.1",
     "bootstrap-vue": "^2.2.2",
     "core-js": "^3.4.4",

src/assets/css/common.css

@@ -86,7 +86,7 @@
     -webkit-box-orient: vertical;
 }
 .scrollable-container {
-  height: 70px; 
+  max-height: 70px; 
   overflow-y: hidden; 
 
 }

src/components/dialog/searchTrackDialog.vue

@@ -0,0 +1,56 @@
+<template>
+    <el-dialog
+      :title="title"
+      :visible.sync="isDialogVisible"
+      width="50%"
+      @close="handleClose"
+    >
+      <div>
+        <slot>
+          <span>默认内容</span>
+        </slot>
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button 
+          @click="cancel" 
+          style="background: #00AFAF;color: #fff;"
+          round
+          >
+          关闭
+        </el-button>
+        <el-button type="primary" @click="confirm" v-show="false" >确定</el-button>
+      </span>
+    </el-dialog>
+  </template>
+  
+  <script>
+  export default {
+    props: {
+      isDialogVisible: {
+        type: Boolean,
+        required: true
+      },
+      title: {
+        type: String,
+        default: '对话框'
+      }
+    },
+    methods: {
+      handleClose() {
+        this.$emit('update:isVisible', false);
+      },
+      cancel() {
+        this.$emit('update:isVisible', false);
+        this.$emit('cancel');
+      },
+      confirm() {
+        this.$emit('confirm');
+      }
+    }
+  };
+  </script>
+  
+  <style scoped>
+  /* 这里可以添加特定于该组件的样式 */
+  </style>
+  

src/components/tabbar/navbar.vue

@@ -50,8 +50,9 @@
                 </div>
               </div> -->
             </div>
-            <div class="nav-people" @click="goClient">
+            <div class="nav-people" >
-              <img src="../../assets/images/home/people.png" alt="logo" class="logo-light" />
+              <img style="margin-right: 20px;cursor: pointer;"    src="../../assets/images/home/search.png"   @click="showDialog"/>
+              <img src="../../assets/images/home/people.png" alt="logo" class="logo-light" @click="goClient"/>
             </div>
           </div>
         </nav>
@@ -109,28 +110,133 @@
                   </div>
                 </div> -->
               </div>
-              <div class="nav-people" @click="goClient">
+              <div class="nav-people" >
-                <img src="../../assets/images/home/people_black.png" alt="logo" class="logo-light" />
+                <img style="margin-right: 20px;cursor: pointer;"    src="../../assets/images/home/search_black.png"   @click="showDialog"/>
+                <img src="../../assets/images/home/people_black.png" alt="logo" class="logo-light" @click="goClient"/>
               </div>
             </div>
           </nav>
         
         </div>
+        <DialogContent
+          :isDialogVisible.sync="dialogVisible"
+          title="请输入要查询的轨迹信息并按下键盘“←┘”"
+          @confirm="handleConfirm"
+          @cancel="handleCancel"
+      
+
+        >
+          <template v-slot>
+            <div class="scrollable-container" style="min-height: 200px;max-height: 500px;">
+              <el-input placeholder="请输入" v-model="orderNo" style="width: 60%;" @keyup.enter.native="handleConfirm"></el-input>
+                        <el-timeline>
+                  <el-timeline-item
+                    v-for="(item, index) in timelineData"
+                    :key="index"
+                    :timestamp="item.main.time"
+                    :color="item.color"
+                    placement="bottom"
+                  >
+                    <div class="timeline-content">
+                      <div>{{ item.main.info }}</div>
+                      <div v-if="item.showMore" style="margin-top: 15px;">
+                        <div v-for="(subItem, subIndex) in item.subItems" :key="subIndex" class="showMoreData">
+                          <span class="sub-item-info">{{ subItem.info }}</span>
+                          <span class="sub-item-time">{{ subItem.time }}</span>
+                        </div>
+                      </div>
+                      <div v-if="item.subItems && item.subItems.length && !item.showMore" @click="item.showMore = true" class="show-more">
+                          更多...
+                        </div>
+                    </div>
+                  </el-timeline-item>
+                </el-timeline>
+            </div>
+          </template>
+        </DialogContent>
     </div>
   </template>
   
   <script>
-  
+  import DialogContent from '../dialog/searchTrackDialog.vue';
+  import axios from 'axios';
   export default {
     name: 'Navbar',
+    components: {
+      DialogContent
+    },
     data() {
       return {
         color: 'white',
         path: this.$route.path,
+        dialogVisible: false,
+        orderNo:'',
+        rawData: {
+        // "ZSBL2407090170": [
+        //   { info: "已派送到目的地", time: "2024-07-24 15:22:05" },
+        //   { info: "预约送亚马逊仓库时间：2024-7-24", time: "2024-07-23 18:23:16" },
+        //   { info: "清关已放行", time: "2024-07-23 15:22:42" },
+        //   { info: "预计到监管仓：7月23日", time: "2024-07-22 15:06:05" },
+        //   { info: "已抵达(空运)", time: "2024-07-21 17:54:00" },
+        //   { info: "已离港", time: "2024-07-21 09:32:45" },
+        //   { info: "预计离港：7月21日，预计抵达：7月22日", time: "2024-07-19 17:36:36" },
+        //   { info: "深圳3号仓（机场仓） 已收货", time: "2024-07-18 20:00:36" },
+        //   { info: "已下单", time: "2024-07-17 09:18:29" }
+        // ],
+        // "ZSBL24070901701": [
+        //   { info: "已派送到目的地", time: "2024-07-24 15:22:05" },
+        //   { info: "预约送亚马逊仓库时间：2024-7-24", time: "2024-07-23 18:23:16" },
+        //   { info: "清关已放行", time: "2024-07-23 15:22:42" },
+        //   { info: "预计到监管仓：7月23日", time: "2024-07-22 15:06:05" },
+        //   { info: "已抵达(空运)", time: "2024-07-21 17:54:00" },
+        //   { info: "已离港", time: "2024-07-21 09:32:45" },
+        //   { info: "预计离港：7月21日，预计抵达：7月22日", time: "2024-07-19 17:36:36" },
+        //   { info: "深圳3号仓（机场仓） 已收货", time: "2024-07-18 20:00:36" },
+        //   { info: "已下单", time: "2024-07-17 09:18:29" }
+        // ],
+      },
+        timelineData: [
+        // {
+        //   main: { info: "已派送到目的地", time: "2024-07-24 15:22:05" },
+        //   color: "green",
+        //   subItems: [],
+        //   showMore: false
+        // },
+        // {
+        //   main: { info: "预约送亚马逊仓库时间：2024-7-24", time: "2024-07-23 18:23:16" },
+        //   color: "blue",
+        //   subItems: [
+        //     { info: "清关已放行", time: "2024-07-23 15:22:42" },
+        //     { info: "预计到监管仓：7月23日", time: "2024-07-22 15:06:05" }
+        //   ],
+        //   showMore: false
+        // },
+        // {
+        //   main: { info: "已抵达(空运)", time: "2024-07-21 17:54:00" },
+        //   color: "red",
+        //   subItems: [
+        //     { info: "已离港", time: "2024-07-21 09:32:45" },
+        //     { info: "预计离港：7月21日，预计抵达：7月22日", time: "2024-07-19 17:36:36" }
+        //   ],
+        //   showMore: false
+        // },
+        // {
+        //   main: { info: "深圳3号仓（机场仓） 已收货", time: "2024-07-18 20:00:36" },
+        //   color: "blue",
+        //   subItems: [],
+        //   showMore: false
+        // },
+        // {
+        //   main: { info: "已下单", time: "2024-07-17 09:18:29" },
+        //   color: "black",
+        //   subItems: [],
+        //   showMore: false
+        // }
+      ]
       };
     },
     created() {
-     
+      // this.timelineData = this.transformData(this.rawData);
     },
     mounted() {
       this.setColor()
@@ -148,15 +254,64 @@
         }else {
           this.color = 'white';
         }
-    },
+      },
-    goClient(){
+      goClient(){
-      window.location.href=  `http://56carrier.com:82/#/home/index`
+        window.location.href=  `http://56carrier.com:82/#/home/index`
-        }
+      },
+      showDialog() {
+        this.dialogVisible = true;
+      },
+      handleConfirm() {
+        // console.log('确认操作');
+        this.fetchOrderTrack()
+      },
+      handleCancel() {
+        // console.log('取消操作');
+        this.dialogVisible = false;
+      },
+      transformData(rawData) {
+      return Object.keys(rawData).map(key => ({
+        main: { info: key },
+        color: '', // 可以根据业务需求定义颜色映射
+        showMore:false,
+        subItems: rawData[key].map(event => ({
+          info: event.info,
+          time: event.time
+        }))
+      }));
+    }
+  ,
+      fetchOrderTrack() {
+        if (!this.orderNo) {
+        console.error('Order number is not set.');
+        return;
+      }
+              axios.get('https://track.szaaf.com:8089/trajectory/index', {
+                  //  axios.get('http://192.168.10.62:8088/api/sync/xzh/order/getTrackNew', {
+                params: {
+                  orderNo: this.orderNo // 设置请求的查询参数
+                }
+              })
+              .then(response => {
+                console.log(response,'response')
+                if(response.data.code===200){
+                  this.rawData = response.data.data;
+                  // this.timelineData = this.transformData(this.rawData);
+                  this.timelineData = this.transformData(this.rawData);
+                }else {
+                  this.rawData = {}
+                }
+
+              })
+              .catch(error => {
+                console.error('请求失败:', error);
+              });
+            },
     },
  
     watch: {
       '$route'(to, from) {
-        console.log(from,to,'from')
+        // console.log(from,to,'from')
         // 路由变化时调用
         if(to.path ==='/newsHome') {
           this.color = 'white';
@@ -174,4 +329,5 @@
     @import "./styles/navbar.css"
  
     </style>
+
   

src/components/tabbar/styles/navbar.css

@@ -65,6 +65,14 @@
     border-bottom: 2px solid #000;
    
 }
+.el-dialog {
+    border-radius: 4px;
+    background: #FFF;
+}
+.el-dialog__body {
+    max-height: 500px; /* 设置最大高度 */
+    overflow-y: auto; /* 超过高度时显示滚动条 */
+  }
 /* .titleImages {
     position: absolute;
     top: 213px;
@@ -88,4 +96,68 @@
     width: 558px;
     height: 44px;
     background: url('../../../assets/images/home/font.png') no-repeat center/cover;
-} */
+} */
+.el-timeline {
+    margin-top: 20px;
+}
+.timeline-container {
+    padding: 20px;
+  }
+  
+  .timeline-title {
+    color: #000;
+    font-family: "PingFang SC";
+    font-size: 14px;
+    font-style: normal;
+    font-weight: 400;
+    line-height: 24px;
+    margin-bottom: 8px; /* 给标题和时间之间留出空间 */
+  }
+  
+  .timeline-content {
+    color: #000;
+    font-family: "PingFang SC";
+    font-size: 14px;
+    font-style: normal;
+    font-weight: 400;
+    line-height: 24px;
+  }
+  .el-timeline-item__node {
+    position: relative;
+    width: 5px;
+    height: 5px;
+    border-radius: 50%;
+    background-color: transparent !important; /* 使用节点颜色 */
+    border: 1px solid transparent; /* 可选：如果需要边框 */
+  }
+  
+  .el-timeline-item__node::before {
+    position: absolute;
+    top: 12px;
+    content: '';
+    display: block;
+    width: 5px;
+    height: 5px;
+    border-radius: 50%;
+    background-color: #000; /* 使用节点颜色 */
+    border: 1px solid #000; /* 可选：如果需要边框 */
+  }
+  
+  .el-timeline-item__tail {
+    display: none;
+  }
+  .sub-item-info {
+    color: #000;
+    font-size: 14px;
+    margin-right: 15px;
+  }
+  .sub-item-time {
+    color: #CBCBCB;
+  }
+  .showMoreData {
+    margin-bottom: 10px;
+  }
+  .show-more {
+    color: #00afaf;
+    cursor: pointer;
+  }

src/view/developmentDocking/mainComponents.vue

@@ -1246,7 +1246,7 @@ export default {
     rowClassName({ row, rowIndex }) {
       const selected = this.$route.query.selectedVersion;
       // console.log(selectedVersion,row, rowIndex,'selectedVersionselectedVersion')
-    if ((row.id === 'transportMode' || row.id === 'shipmentType'||row.id === 'service'||row.id === 'takeType'||row.id === 'warehouseId')&&selected==='oldSystem') {
+    if ((row.id === 'transportMode' || row.id === 'shipmentType'||row.id === 'service'||row.id === 'takeType'||row.id === 'warehouseId'||row.id === 'to_warehouse_code')&&selected==='oldSystem') {
       return 'blueTips';
     }
   },

vue.config.js

@@ -60,24 +60,24 @@ module.exports = {
     ],
   },
   chainWebpack: config => {
-    config.plugin('define').use(DefinePlugin, [
+    // config.plugin('define').use(DefinePlugin, [
-      {
+    //   {
-        'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV),
+    //     'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV),
-      },
+    //   },
-    ]);
+    // ]);
 
-    config.module
+    // config.module
-      .rule('images')
+    //   .rule('images')
-      .use('url-loader')
+    //   .use('url-loader')
-      .loader('url-loader')
+    //   .loader('url-loader')
-      .tap(options => ({
+    //   .tap(options => ({
-        limit: 8192, // 图片小于8KB时转换为base64
+    //     limit: 8192, // 图片小于8KB时转换为base64
-        fallback: {
+    //     fallback: {
-          loader: 'file-loader',
+    //       loader: 'file-loader',
-          options: {
+    //       options: {
-            name: 'img/[name].[hash:8].[ext]',
+    //         name: 'img/[name].[hash:8].[ext]',
-          },
+    //       },
-        },
+    //     },
-      }));
+    //   }));
   },
 };

yarn.lock

@@ -1830,10 +1830,10 @@
   "resolved" "https://registry.npmmirror.com/aws4/-/aws4-1.12.0.tgz"
   "version" "1.12.0"
 
-"axios@^1.6.8":
+"axios@^1.7.3":
-  "integrity" "sha512-v/ZHtJDU39mDpyBoFVkETcd/uNdxrWRrg3bKpOKzXFA6Bvqopts6ALSMU3y6ijYxbw2B+wPrIv46egTzJXCLGQ=="
+  "integrity" "sha512-Ar7ND9pU99eJ9GpoGQKhKf58GpUOgnzuaB7ueNQ5BMi0p+LZ5oaEnfF999fAArcTIBwXTCHAmGcHOZJaWPq9Nw=="
-  "resolved" "https://registry.npmmirror.com/axios/-/axios-1.6.8.tgz"
+  "resolved" "https://registry.npmmirror.com/axios/-/axios-1.7.3.tgz"
-  "version" "1.6.8"
+  "version" "1.7.3"
   dependencies:
     "follow-redirects" "^1.15.6"
     "form-data" "^4.0.0"