驾驶舱修改

src/views/dashboard/hooks/usePublic.ts

@@ -255,6 +255,7 @@ export function usePublic() {
           },
           axisLabel: {
             color: '#8897BC',
+            interval: 0,
           },
         },
         yAxis: [
@@ -262,9 +263,6 @@ export function usePublic() {
             type: 'value',
             axisLabel: {
               color: '#8897BC',
-              formatter: function (item) {
-                return item / 10000 + '万'
-              },
             },
             splitLine: {
               lineStyle: {

src/views/dashboard/index.vue

@@ -18,7 +18,7 @@
                 </el-icon>
               </div>
             </div>
-            <div class="dashboard-content-top-left-item-bottom">
+            <div v-loading="loading1" element-loading-text="数据加载中..." element-loading-svg-view-box="-10, -10, 50, 50" element-loading-background="rgba(0,0,0, 0.3)" class="dashboard-content-top-left-item-bottom">
               <Echarts id="ww1" :option="hourlyPeakObj" />
             </div>
           </div>
@@ -36,7 +36,7 @@
                 </el-icon>
               </div>
             </div>
-            <div class="dashboard-content-top-left-item-bottom">
+            <div v-loading="loading2" element-loading-text="数据加载中..." element-loading-svg-view-box="-10, -10, 50, 50" element-loading-background="rgba(0,0,0, 0.3)" class="dashboard-content-top-left-item-bottom">
               <Echarts id="ww12" :option="waybillTrendObj" />
             </div>
           </div>
@@ -54,17 +54,17 @@
                 </el-icon>
               </div>
             </div>
-            <div class="dashboard-content-top-left-item-bottom">
+            <div v-loading="loading3" element-loading-text="数据加载中..." element-loading-svg-view-box="-10, -10, 50, 50" element-loading-background="rgba(0,0,0, 0.3)" class="dashboard-content-top-left-item-bottom">
               <Echarts id="ww4" :option="nodePeakObj" />
             </div>
           </div>
         </div>
         <!-- 地图 -->
         <div class="dashboard-content-top-center">
-          <div class="dashboard-content-top-center-top">
+          <div v-loading="loading4" element-loading-text="数据加载中..." element-loading-svg-view-box="-10, -10, 50, 50" element-loading-background="rgba(0,0,0, 0.3)" class="dashboard-content-top-center-top">
             <div class="dashboard-content-top-center-top-list">
               <div class="dashboard-content-top-center-top-list-txt">重量</div>
-              <div class="dashboard-content-top-center-top-list-num">{{ weight }}</div>
+              <div class="dashboard-content-top-center-top-list-num">{{ weightNums }}</div>
             </div>
             <div class="dashboard-content-top-center-top-list">
               <div class="dashboard-content-top-center-top-list-txt">航班数</div>
@@ -75,13 +75,13 @@
               <div class="dashboard-content-top-center-top-list-num">{{ stockNums }}</div>
             </div>
           </div>
-          <div class="dashboard-content-top-center-bottom">
+          <div v-loading="loading5" element-loading-text="数据加载中..." element-loading-svg-view-box="-10, -10, 50, 50" element-loading-background="rgba(0,0,0, 0.3)" class="dashboard-content-top-center-bottom">
             <div class="dashboard-content-top-center-bottom-title">航班动态跟踪</div>
             <div class="dashboard-content-top-center-bottom-content">
               <div class="dashboard-content-top-center-bottom-content-head">
                 <div class="dashboard-content-top-center-bottom-content-head-list">公司/航班号</div>
                 <div class="dashboard-content-top-center-bottom-content-head-list">航班状态</div>
-                <div class="dashboard-content-top-center-bottom-content-head-list">经停/到站</div>
+                <div class="dashboard-content-top-center-bottom-content-head-list">始发站/经停</div>
                 <div class="dashboard-content-top-center-bottom-content-head-list">计划起飞</div>
                 <div class="dashboard-content-top-center-bottom-content-head-list">实际起飞</div>
                 <div class="dashboard-content-top-center-bottom-content-head-list">机型</div>
@@ -109,7 +109,7 @@
               <div class="dashboard-content-top-right-item-top-title">
                 航司统计分析
               </div>
-              <div class="dashboard-content-top-right-item-top-time" @click="showDatePicker(showTimeMsg.AirlineAbnormal)">
+              <div class="dashboard-content-top-right-item-top-time" @click="showDatePicker(showTimeMsg.AirlineTraffic)">
                 <el-icon color="#ffffff" size="18">
                   <Calendar />
                 </el-icon>
@@ -118,7 +118,7 @@
                 </el-icon>
               </div>
             </div>
-            <div class="dashboard-content-top-right-item-bottom">
+            <div v-loading="loading6" element-loading-text="数据加载中..." element-loading-svg-view-box="-10, -10, 50, 50" element-loading-background="rgba(0,0,0, 0.3)" class="dashboard-content-top-right-item-bottom">
               <Echarts id="a1" :option="airlineTrafficObj" />
             </div>
           </div>
@@ -127,7 +127,7 @@
               <div class="dashboard-content-top-right-item-top-title">
                 航班动态统计
               </div>
-              <div class="dashboard-content-top-right-item-top-time" @click="showDatePicker(showTimeMsg.AirlineTraffic)">
+              <div class="dashboard-content-top-right-item-top-time" @click="showDatePicker(showTimeMsg.AirlineAbnormal)">
                 <el-icon color="#ffffff" size="18">
                   <Calendar />
                 </el-icon>
@@ -136,7 +136,7 @@
                 </el-icon>
               </div>
             </div>
-            <div class="dashboard-content-top-left-item-bottom">
+            <div v-loading="loading7" element-loading-text="数据加载中..." element-loading-svg-view-box="-10, -10, 50, 50" element-loading-background="rgba(0,0,0, 0.3)" class="dashboard-content-top-left-item-bottom">
               <Echarts id="ww44" :option="airlineObj" />
             </div>
           </div>
@@ -169,6 +169,13 @@ import * as _ from "lodash";
 const { optionLeft, airCompaneBaggage, airStutas, getPublicData } = usePublic();
 const timePickerName = ref<number>(0);
 const flag = ref<boolean>(false);
+const loading1 = ref<boolean>(false);
+const loading2 = ref<boolean>(false);
+const loading3 = ref<boolean>(false);
+const loading4 = ref<boolean>(false);
+const loading5 = ref<boolean>(false);
+const loading6 = ref<boolean>(false);
+const loading7 = ref<boolean>(false);
 const hourlyPeakObj = ref<any>({});
 const waybillTrendObj = ref<any>({});
 const nodePeakObj = ref<any>({});
@@ -176,7 +183,7 @@ const airlineTrafficObj = ref<any>({});
 const airlineObj = ref<any>({});
 const flightNums = ref<number>(0);
 const stockNums = ref<number>(0);
-const weight = ref<number>(0);
+const weightNums = ref<number | string>(0);
 const form = ref({
   startDate: parseTime(Date.now() - 24 * 60 * 60 * 1000 * 7, "{y}-{m}-{d}"),
   endDate: parseTime(Date.now(), "{y}-{m}-{d}"),
@@ -212,7 +219,7 @@ const submitForm = () => {
       airlineTrafficFunc();
       break;
     case showTimeMsg.AirlineAbnormal:
-      airlineAbnormalFunc();
+      airlineFunc();
       break;
     default:
       break;
@@ -242,7 +249,7 @@ const sortClass = (sortData) => {
   return sorted;
 };
 
-const pubFunc = (listValues, target) => {
+const pubFunc = (listValues, target, type?) => {
   const newObj = _.cloneDeep(target);
   const [jobTimes, stockNums, weights] = [<any>[], <any>[], <any>[]];
   listValues.forEach((item) => {
@@ -251,33 +258,43 @@ const pubFunc = (listValues, target) => {
     weights.push(item.weight);
   });
   newObj.xAxis.data = jobTimes;
-  newObj.series[0].data = stockNums;
-  newObj.series[1].data = weights;
+  if (type) {
+    newObj.series[1].data = stockNums;
+    newObj.series[0].data = weights;
+  } else {
+    newObj.series[0].data = stockNums;
+    newObj.series[1].data = weights;
+  }
   return newObj;
 };
 
 //获取小时峰值分布
 const hourlyPeakFunc = async () => {
+  loading1.value = true;
   const listValues = (await getPublicData(DATACONTENT_ID.jscCgHourlyPeakId, [
-    { fd1: form.value.startDate, fd2: form.value.endDate },
+    { flightDate1: form.value.startDate, flightDate2: form.value.endDate },
   ])) as any;
   if (listValues && isValue(listValues)) {
     hourlyPeakObj.value = pubFunc(listValues, optionLeft);
   }
+  loading1.value = false;
 };
 
 //运单趋势分析
 const waybillTrendFunc = async () => {
+  loading2.value = true;
   const listValues = (await getPublicData(DATACONTENT_ID.jscCgWaybillTrendId, [
-    { fd1: form.value.startDate, fd2: form.value.endDate },
+    { flightDate1: form.value.startDate, flightDate2: form.value.endDate },
   ])) as any;
   if (listValues && isValue(listValues)) {
     waybillTrendObj.value = pubFunc(listValues, optionLeft);
   }
+  loading2.value = false;
 };
 
 //始发站/目的站统计分析
 const nodePeakFunc = async () => {
+  loading3.value = true;
   const listValues = (await getPublicData(DATACONTENT_ID.jscAirlineAbnormalId, [
     { fd1: form.value.startDate, fd2: form.value.endDate, fttp: "国内进港" },
   ])) as any;
@@ -288,10 +305,12 @@ const nodePeakFunc = async () => {
     });
     nodePeakObj.value = pubFunc(listValues, newObj);
   }
+  loading3.value = false;
 };
 
 //航班数&运单数
 const numbersFunc = async () => {
+  loading4.value = true;
   const listValues = (await getPublicData(DATACONTENT_ID.jscCgNumbersId, [
     { fd1: form.value.startDate, fd2: form.value.endDate },
   ])) as any;
@@ -299,29 +318,42 @@ const numbersFunc = async () => {
     const { flightNum, stockNum, weight } = listValues[0];
     flightNums.value = flightNum;
     stockNums.value = stockNum;
-    weight.value = weight;
+    weightNums.value = weight;
   }
+  loading4.value = false;
 };
 
 //航司运量
 const airlineTrafficFunc = async () => {
+  loading6.value = true;
   const listValues = (await getPublicData(
     DATACONTENT_ID.jscCgAirlineTrafficId,
-    [{ fd1: form.value.startDate, fd2: form.value.endDate }]
+    [{ flightDate1: form.value.startDate, flightDate2: form.value.endDate }]
   )) as any;
   if (listValues && isValue(listValues)) {
-    listValues.forEach((item) => {
-      item.jobTime = item["IACACode"];
-    });
-    airlineTrafficObj.value = pubFunc(
-      listValues,
-      airCompaneBaggage.option.baseOption
-    );
+    const newObj: any = _.cloneDeep(airCompaneBaggage.option.baseOption);
+    (newObj.dataZoom = [
+      {
+        id: "dataZoomX",
+        type: "slider",
+        xAxisIndex: [0],
+        filterMode: "filter",
+        start: 0,
+        end: 20,
+      },
+    ]),
+      listValues.forEach((item) => {
+        item.jobTime = item["IACACode"];
+      });
+
+    airlineTrafficObj.value = pubFunc(listValues, newObj);
   }
+  loading6.value = false;
 };
 
 //航班表格
 const airlineAbnormalFunc = async () => {
+  loading5.value = true;
   const listValues = (await getPublicData(DATACONTENT_ID.jscFlightDynamicsId, [
     {
       fd1: form.value.startDate,
@@ -332,10 +364,12 @@ const airlineAbnormalFunc = async () => {
   if (listValues && isValue(listValues)) {
     listData.value = listValues;
   }
+  loading5.value = false;
 };
 
 //航班动态统计
 const airlineFunc = async () => {
+  loading7.value = true;
   const listValues = (await getPublicData(DATACONTENT_ID.jscCgAirlineId, [
     {
       fd1: form.value.startDate,
@@ -343,14 +377,24 @@ const airlineFunc = async () => {
     },
   ])) as any;
   if (listValues && isValue(listValues)) {
-    const newObj = _.cloneDeep(airCompaneBaggage.option.baseOption);
-    listValues.forEach((item) => {
-      item.jobTime = item["nodeCode"];
-      item.stockNum = item["flightNum"];
-      item.weight = item["stockNum"];
-    });
-    airlineObj.value = pubFunc(listValues, newObj);
+    const newObj: any = _.cloneDeep(airCompaneBaggage.option.baseOption);
+    (newObj.dataZoom = [
+      {
+        id: "dataZoomX",
+        type: "slider",
+        xAxisIndex: [0],
+        filterMode: "filter",
+        start: 0,
+        end: 20,
+      },
+    ]),
+      listValues.forEach((item) => {
+        item.jobTime = item["nodeCode"];
+        item.weight = item["flightNum"];
+      });
+    airlineObj.value = pubFunc(listValues, newObj, true);
   }
+  loading7.value = false;
 };
 
 onMounted(() => {

src/views/dashboard/indexHomeOut.vue

@@ -18,7 +18,7 @@
                 </el-icon>
               </div>
             </div>
-            <div class="dashboard-content-top-left-item-bottom">
+            <div v-loading="loading1" element-loading-text="数据加载中..." element-loading-svg-view-box="-10, -10, 50, 50" element-loading-background="rgba(0,0,0, 0.3)" class="dashboard-content-top-left-item-bottom">
               <Echarts id="ww1" :option="hourlyPeakObj" />
             </div>
           </div>
@@ -36,14 +36,14 @@
                 </el-icon>
               </div>
             </div>
-            <div class="dashboard-content-top-left-item-bottom">
+            <div v-loading="loading2" element-loading-text="数据加载中..." element-loading-svg-view-box="-10, -10, 50, 50" element-loading-background="rgba(0,0,0, 0.3)" class="dashboard-content-top-left-item-bottom">
               <Echarts id="ww12" :option="waybillTrendObj" />
             </div>
           </div>
           <div class="dashboard-content-top-left-item">
             <div class="dashboard-content-top-left-item-top">
               <div class="dashboard-content-top-left-item-top-title">
-                始发站统计分析
+                目的站统计分析
               </div>
               <div class="dashboard-content-bottom-left-top-time" @click="showDatePicker(showTimeMsg.NodePeak)">
                 <el-icon color="#ffffff" size="18">
@@ -54,17 +54,17 @@
                 </el-icon>
               </div>
             </div>
-            <div class="dashboard-content-top-left-item-bottom">
+            <div v-loading="loading3" element-loading-text="数据加载中..." element-loading-svg-view-box="-10, -10, 50, 50" element-loading-background="rgba(0,0,0, 0.3)" class="dashboard-content-top-left-item-bottom">
               <Echarts id="ww4" :option="nodePeakObj" />
             </div>
           </div>
         </div>
         <!-- 地图 -->
         <div class="dashboard-content-top-center">
-          <div class="dashboard-content-top-center-top">
+          <div v-loading="loading4" element-loading-text="数据加载中..." element-loading-svg-view-box="-10, -10, 50, 50" element-loading-background="rgba(0,0,0, 0.3)" class="dashboard-content-top-center-top">
             <div class="dashboard-content-top-center-top-list">
               <div class="dashboard-content-top-center-top-list-txt">重量</div>
-              <div class="dashboard-content-top-center-top-list-num">{{ weight }}</div>
+              <div class="dashboard-content-top-center-top-list-num">{{ weightNums }}</div>
             </div>
             <div class="dashboard-content-top-center-top-list">
               <div class="dashboard-content-top-center-top-list-txt">航班数</div>
@@ -75,13 +75,13 @@
               <div class="dashboard-content-top-center-top-list-num">{{ stockNums }}</div>
             </div>
           </div>
-          <div class="dashboard-content-top-center-bottom">
+          <div v-loading="loading5" element-loading-text="数据加载中..." element-loading-svg-view-box="-10, -10, 50, 50" element-loading-background="rgba(0,0,0, 0.3)" class="dashboard-content-top-center-bottom">
             <div class="dashboard-content-top-center-bottom-title">航班动态跟踪</div>
             <div class="dashboard-content-top-center-bottom-content">
               <div class="dashboard-content-top-center-bottom-content-head">
                 <div class="dashboard-content-top-center-bottom-content-head-list">公司/航班号</div>
                 <div class="dashboard-content-top-center-bottom-content-head-list">航班状态</div>
-                <div class="dashboard-content-top-center-bottom-content-head-list">经停/到站</div>
+                <div class="dashboard-content-top-center-bottom-content-head-list">经停/到达站</div>
                 <div class="dashboard-content-top-center-bottom-content-head-list">计划起飞</div>
                 <div class="dashboard-content-top-center-bottom-content-head-list">实际起飞</div>
                 <div class="dashboard-content-top-center-bottom-content-head-list">机型</div>
@@ -109,7 +109,7 @@
               <div class="dashboard-content-top-right-item-top-title">
                 航司统计分析
               </div>
-              <div class="dashboard-content-top-right-item-top-time" @click="showDatePicker(showTimeMsg.AirlineAbnormal)">
+              <div class="dashboard-content-top-right-item-top-time" @click="showDatePicker(showTimeMsg.AirlineTraffic)">
                 <el-icon color="#ffffff" size="18">
                   <Calendar />
                 </el-icon>
@@ -118,7 +118,7 @@
                 </el-icon>
               </div>
             </div>
-            <div class="dashboard-content-top-right-item-bottom">
+            <div v-loading="loading6" element-loading-text="数据加载中..." element-loading-svg-view-box="-10, -10, 50, 50" element-loading-background="rgba(0,0,0, 0.3)" class="dashboard-content-top-right-item-bottom">
               <Echarts id="a1" :option="airlineTrafficObj" />
             </div>
           </div>
@@ -127,7 +127,7 @@
               <div class="dashboard-content-top-right-item-top-title">
                 航班动态统计
               </div>
-              <div class="dashboard-content-top-right-item-top-time" @click="showDatePicker(showTimeMsg.AirlineTraffic)">
+              <div class="dashboard-content-top-right-item-top-time" @click="showDatePicker(showTimeMsg.AirlineAbnormal)">
                 <el-icon color="#ffffff" size="18">
                   <Calendar />
                 </el-icon>
@@ -136,7 +136,7 @@
                 </el-icon>
               </div>
             </div>
-            <div class="dashboard-content-top-left-item-bottom">
+            <div v-loading="loading7" element-loading-text="数据加载中..." element-loading-svg-view-box="-10, -10, 50, 50" element-loading-background="rgba(0,0,0, 0.3)" class="dashboard-content-top-left-item-bottom">
               <Echarts id="ww44" :option="airlineObj" />
             </div>
           </div>
@@ -154,7 +154,7 @@
                 </el-icon>
               </div>
             </div>
-            <div class="dashboard-content-top-left-item-bottom">
+            <div v-loading="loading8" element-loading-text="数据加载中..." element-loading-svg-view-box="-10, -10, 50, 50" element-loading-background="rgba(0,0,0, 0.3)" class="dashboard-content-top-left-item-bottom">
               <Echarts id="ww45" :option="pickingObj" />
             </div>
           </div>
@@ -187,6 +187,14 @@ import * as _ from "lodash";
 const { optionLeft, airCompaneBaggage, airStutas, getPublicData } = usePublic();
 const timePickerName = ref<number>(0);
 const flag = ref<boolean>(false);
+const loading1 = ref<boolean>(false);
+const loading2 = ref<boolean>(false);
+const loading3 = ref<boolean>(false);
+const loading4 = ref<boolean>(false);
+const loading5 = ref<boolean>(false);
+const loading6 = ref<boolean>(false);
+const loading7 = ref<boolean>(false);
+const loading8 = ref<boolean>(false);
 const hourlyPeakObj = ref<any>({});
 const waybillTrendObj = ref<any>({});
 const nodePeakObj = ref<any>({});
@@ -195,7 +203,7 @@ const airlineObj = ref<any>({});
 const pickingObj = ref<any>({});
 const flightNums = ref<number>(0);
 const stockNums = ref<number>(0);
-const weight = ref<number>(0);
+const weightNums = ref<number | string>(0);
 const form = ref({
   startDate: parseTime(Date.now() - 24 * 60 * 60 * 1000 * 7, "{y}-{m}-{d}"),
   endDate: parseTime(Date.now(), "{y}-{m}-{d}"),
@@ -231,7 +239,7 @@ const submitForm = () => {
       airlineTrafficFunc();
       break;
     case showTimeMsg.AirlineAbnormal:
-      airlineAbnormalFunc();
+      airlineFunc();
       break;
     case showTimeMsg.PickingStatistics:
       pickingFuncs();
@@ -264,7 +272,7 @@ const sortClass = (sortData) => {
   return sorted;
 };
 
-const pubFunc = (listValues, target) => {
+const pubFunc = (listValues, target, type?) => {
   const newObj = _.cloneDeep(target);
   const [jobTimes, stockNums, weights] = [<any>[], <any>[], <any>[]];
   listValues.forEach((item) => {
@@ -273,33 +281,43 @@ const pubFunc = (listValues, target) => {
     weights.push(item.weight);
   });
   newObj.xAxis.data = jobTimes;
-  newObj.series[0].data = stockNums;
-  newObj.series[1].data = weights;
+  if (type) {
+    newObj.series[1].data = stockNums;
+    newObj.series[0].data = weights;
+  } else {
+    newObj.series[0].data = stockNums;
+    newObj.series[1].data = weights;
+  }
   return newObj;
 };
 
 //获取小时峰值分布
 const hourlyPeakFunc = async () => {
+  loading1.value = true;
   const listValues = (await getPublicData(DATACONTENT_ID.jscHourlyPeakId, [
-    { fd1: form.value.startDate, fd2: form.value.endDate },
+    { flightDate1: form.value.startDate, flightDate2: form.value.endDate },
   ])) as any;
   if (listValues && isValue(listValues)) {
     hourlyPeakObj.value = pubFunc(listValues, optionLeft);
   }
+  loading1.value = false;
 };
 
 //运单趋势分析
 const waybillTrendFunc = async () => {
+  loading2.value = true;
   const listValues = (await getPublicData(DATACONTENT_ID.jscWaybillTrendId, [
-    { fd1: form.value.startDate, fd2: form.value.endDate },
+    { flightDate1: form.value.startDate, flightDate2: form.value.endDate },
   ])) as any;
   if (listValues && isValue(listValues)) {
     waybillTrendObj.value = pubFunc(listValues, optionLeft);
   }
+  loading2.value = false;
 };
 
 //始发站/目的站统计分析
 const nodePeakFunc = async () => {
+  loading3.value = true;
   const listValues = (await getPublicData(DATACONTENT_ID.jscAirlineAbnormalId, [
     { fd1: form.value.startDate, fd2: form.value.endDate, fttp: "国内出港" },
   ])) as any;
@@ -310,10 +328,12 @@ const nodePeakFunc = async () => {
     });
     nodePeakObj.value = pubFunc(listValues, newObj);
   }
+  loading3.value = false;
 };
 
 //航班数&运单数
 const numbersFunc = async () => {
+  loading4.value = true;
   const listValues = (await getPublicData(DATACONTENT_ID.jscNumbersId, [
     { fd1: form.value.startDate, fd2: form.value.endDate },
   ])) as any;
@@ -321,28 +341,40 @@ const numbersFunc = async () => {
     const { flightNum, stockNum, weight } = listValues[0];
     flightNums.value = flightNum;
     stockNums.value = stockNum;
-    weight.value = weight;
+    weightNums.value = weight;
   }
+  loading4.value = false;
 };
 
 //航司运量
 const airlineTrafficFunc = async () => {
+  loading6.value = true;
   const listValues = (await getPublicData(DATACONTENT_ID.jscAirlineTrafficId, [
-    { fd1: form.value.startDate, fd2: form.value.endDate },
+    { flightDate1: form.value.startDate, flightDate2: form.value.endDate },
   ])) as any;
   if (listValues && isValue(listValues)) {
-    listValues.forEach((item) => {
-      item.jobTime = item["IACACode"];
-    });
-    airlineTrafficObj.value = pubFunc(
-      listValues,
-      airCompaneBaggage.option.baseOption
-    );
+    const newObj: any = _.cloneDeep(airCompaneBaggage.option.baseOption);
+    (newObj.dataZoom = [
+      {
+        id: "dataZoomX",
+        type: "slider",
+        xAxisIndex: [0],
+        filterMode: "filter",
+        start: 0,
+        end: 20,
+      },
+    ]),
+      listValues.forEach((item) => {
+        item.jobTime = item["IACACode"];
+      });
+    airlineTrafficObj.value = pubFunc(listValues, newObj);
   }
+  loading6.value = false;
 };
 
 //航班表格
 const airlineAbnormalFunc = async () => {
+  loading5.value = true;
   const listValues = (await getPublicData(DATACONTENT_ID.jscFlightDynamicsId, [
     {
       fd1: form.value.startDate,
@@ -353,10 +385,12 @@ const airlineAbnormalFunc = async () => {
   if (listValues && isValue(listValues)) {
     listData.value = listValues;
   }
+  loading5.value = false;
 };
 
 //航班动态统计
 const airlineFunc = async () => {
+  loading7.value = true;
   const listValues = (await getPublicData(DATACONTENT_ID.jscAirlineId, [
     {
       fd1: form.value.startDate,
@@ -364,18 +398,29 @@ const airlineFunc = async () => {
     },
   ])) as any;
   if (listValues && isValue(listValues)) {
-    const newObj = _.cloneDeep(airCompaneBaggage.option.baseOption);
-    listValues.forEach((item) => {
-      item.jobTime = item["nodeCode"];
-      item.stockNum = item["flightNum"];
-      item.weight = item["stockNum"];
-    });
-    airlineObj.value = pubFunc(listValues, newObj);
+    const newObj: any = _.cloneDeep(airCompaneBaggage.option.baseOption);
+    (newObj.dataZoom = [
+      {
+        id: "dataZoomX",
+        type: "slider",
+        xAxisIndex: [0],
+        filterMode: "filter",
+        start: 0,
+        end: 20,
+      },
+    ]),
+      listValues.forEach((item) => {
+        item.jobTime = item["nodeCode"];
+        item.weight = item["flightNum"];
+      });
+    airlineObj.value = pubFunc(listValues, newObj, true);
   }
+  loading7.value = false;
 };
 
 //拉货统计
 const pickingFuncs = async () => {
+  loading8.value = true;
   const listValues = (await getPublicData(DATACONTENT_ID.jscGgPullId, [
     {
       fd1: form.value.startDate,
@@ -383,14 +428,24 @@ const pickingFuncs = async () => {
     },
   ])) as any;
   if (listValues && isValue(listValues)) {
-    const newObj = _.cloneDeep(airCompaneBaggage.option.baseOption);
-    listValues.forEach((item) => {
-      item.jobTime = item["flightDate"];
-      item.stockNum = item["flightNum"];
-      item.weight = item["stockNum"];
-    });
-    pickingObj.value = pubFunc(listValues, newObj);
+    const newObj: any = _.cloneDeep(airCompaneBaggage.option.baseOption);
+    (newObj.dataZoom = [
+      {
+        id: "dataZoomX",
+        type: "slider",
+        xAxisIndex: [0],
+        filterMode: "filter",
+        start: 0,
+        end: 40,
+      },
+    ]),
+      listValues.forEach((item) => {
+        item.jobTime = item["flightDate"];
+        item.weight = item["flightNum"];
+      });
+    pickingObj.value = pubFunc(listValues, newObj, true);
   }
+  loading8.value = false;
 };
 
 onMounted(() => {

src/views/dashboard/indexIn.vue

@@ -18,7 +18,7 @@
                 </el-icon>
               </div>
             </div>
-            <div class="dashboard-content-top-left-item-bottom">
+            <div v-loading="loading1" element-loading-text="数据加载中..." element-loading-svg-view-box="-10, -10, 50, 50" element-loading-background="rgba(0,0,0, 0.3)" class="dashboard-content-top-left-item-bottom">
               <Echarts id="ww1" :option="hourlyPeakObj" />
             </div>
           </div>
@@ -36,7 +36,7 @@
                 </el-icon>
               </div>
             </div>
-            <div class="dashboard-content-top-left-item-bottom">
+            <div v-loading="loading2" element-loading-text="数据加载中..." element-loading-svg-view-box="-10, -10, 50, 50" element-loading-background="rgba(0,0,0, 0.3)" class="dashboard-content-top-left-item-bottom">
               <Echarts id="ww12" :option="waybillTrendObj" />
             </div>
           </div>
@@ -54,17 +54,17 @@
                 </el-icon>
               </div>
             </div>
-            <div class="dashboard-content-top-left-item-bottom">
+            <div v-loading="loading3" element-loading-text="数据加载中..." element-loading-svg-view-box="-10, -10, 50, 50" element-loading-background="rgba(0,0,0, 0.3)" class="dashboard-content-top-left-item-bottom">
               <Echarts id="ww4" :option="nodePeakObj" />
             </div>
           </div>
         </div>
         <!-- 地图 -->
         <div class="dashboard-content-top-center">
-          <div class="dashboard-content-top-center-top">
+          <div v-loading="loading4" element-loading-text="数据加载中..." element-loading-svg-view-box="-10, -10, 50, 50" element-loading-background="rgba(0,0,0, 0.3)" class="dashboard-content-top-center-top">
             <div class="dashboard-content-top-center-top-list">
               <div class="dashboard-content-top-center-top-list-txt">重量</div>
-              <div class="dashboard-content-top-center-top-list-num">{{ weight }}</div>
+              <div class="dashboard-content-top-center-top-list-num">{{ weightNums }}</div>
             </div>
             <div class="dashboard-content-top-center-top-list">
               <div class="dashboard-content-top-center-top-list-txt">航班数</div>
@@ -75,13 +75,13 @@
               <div class="dashboard-content-top-center-top-list-num">{{ stockNums }}</div>
             </div>
           </div>
-          <div class="dashboard-content-top-center-bottom">
+          <div v-loading="loading5" element-loading-text="数据加载中..." element-loading-svg-view-box="-10, -10, 50, 50" element-loading-background="rgba(0,0,0, 0.3)" class="dashboard-content-top-center-bottom">
             <div class="dashboard-content-top-center-bottom-title">航班动态跟踪</div>
             <div class="dashboard-content-top-center-bottom-content">
               <div class="dashboard-content-top-center-bottom-content-head">
                 <div class="dashboard-content-top-center-bottom-content-head-list">公司/航班号</div>
                 <div class="dashboard-content-top-center-bottom-content-head-list">航班状态</div>
-                <div class="dashboard-content-top-center-bottom-content-head-list">经停/到站</div>
+                <div class="dashboard-content-top-center-bottom-content-head-list">始发站/经停</div>
                 <div class="dashboard-content-top-center-bottom-content-head-list">计划起飞</div>
                 <div class="dashboard-content-top-center-bottom-content-head-list">实际起飞</div>
                 <div class="dashboard-content-top-center-bottom-content-head-list">机型</div>
@@ -109,7 +109,7 @@
               <div class="dashboard-content-top-right-item-top-title">
                 航司统计分析
               </div>
-              <div class="dashboard-content-top-right-item-top-time" @click="showDatePicker(showTimeMsg.AirlineAbnormal)">
+              <div class="dashboard-content-top-right-item-top-time" @click="showDatePicker(showTimeMsg.AirlineTraffic)">
                 <el-icon color="#ffffff" size="18">
                   <Calendar />
                 </el-icon>
@@ -118,7 +118,7 @@
                 </el-icon>
               </div>
             </div>
-            <div class="dashboard-content-top-right-item-bottom">
+            <div v-loading="loading6" element-loading-text="数据加载中..." element-loading-svg-view-box="-10, -10, 50, 50" element-loading-background="rgba(0,0,0, 0.3)" class="dashboard-content-top-right-item-bottom">
               <Echarts id="a1" :option="airlineTrafficObj" />
             </div>
           </div>
@@ -127,7 +127,7 @@
               <div class="dashboard-content-top-right-item-top-title">
                 航班动态统计
               </div>
-              <div class="dashboard-content-top-right-item-top-time" @click="showDatePicker(showTimeMsg.AirlineTraffic)">
+              <div class="dashboard-content-top-right-item-top-time" @click="showDatePicker(showTimeMsg.AirlineAbnormal)">
                 <el-icon color="#ffffff" size="18">
                   <Calendar />
                 </el-icon>
@@ -136,7 +136,7 @@
                 </el-icon>
               </div>
             </div>
-            <div class="dashboard-content-top-left-item-bottom">
+            <div v-loading="loading7" element-loading-text="数据加载中..." element-loading-svg-view-box="-10, -10, 50, 50" element-loading-background="rgba(0,0,0, 0.3)" class="dashboard-content-top-left-item-bottom">
               <Echarts id="ww44" :option="airlineObj" />
             </div>
           </div>
@@ -169,6 +169,13 @@ import * as _ from "lodash";
 const { optionLeft, airCompaneBaggage, airStutas, getPublicData } = usePublic();
 const timePickerName = ref<number>(0);
 const flag = ref<boolean>(false);
+const loading1 = ref<boolean>(false);
+const loading2 = ref<boolean>(false);
+const loading3 = ref<boolean>(false);
+const loading4 = ref<boolean>(false);
+const loading5 = ref<boolean>(false);
+const loading6 = ref<boolean>(false);
+const loading7 = ref<boolean>(false);
 const hourlyPeakObj = ref<any>({});
 const waybillTrendObj = ref<any>({});
 const nodePeakObj = ref<any>({});
@@ -176,7 +183,7 @@ const airlineTrafficObj = ref<any>({});
 const airlineObj = ref<any>({});
 const flightNums = ref<number>(0);
 const stockNums = ref<number>(0);
-const weight = ref<number>(0);
+const weightNums = ref<number | string>(0);
 const form = ref({
   startDate: parseTime(Date.now() - 24 * 60 * 60 * 1000 * 7, "{y}-{m}-{d}"),
   endDate: parseTime(Date.now(), "{y}-{m}-{d}"),
@@ -212,7 +219,7 @@ const submitForm = () => {
       airlineTrafficFunc();
       break;
     case showTimeMsg.AirlineAbnormal:
-      airlineAbnormalFunc();
+      airlineFunc();
       break;
     default:
       break;
@@ -242,7 +249,7 @@ const sortClass = (sortData) => {
   return sorted;
 };
 
-const pubFunc = (listValues, target) => {
+const pubFunc = (listValues, target, type?) => {
   const newObj = _.cloneDeep(target);
   const [jobTimes, stockNums, weights] = [<any>[], <any>[], <any>[]];
   listValues.forEach((item) => {
@@ -251,35 +258,45 @@ const pubFunc = (listValues, target) => {
     weights.push(item.weight);
   });
   newObj.xAxis.data = jobTimes;
-  newObj.series[0].data = stockNums;
-  newObj.series[1].data = weights;
+  if (type) {
+    newObj.series[1].data = stockNums;
+    newObj.series[0].data = weights;
+  } else {
+    newObj.series[0].data = stockNums;
+    newObj.series[1].data = weights;
+  }
   return newObj;
 };
 
 //获取小时峰值分布
 const hourlyPeakFunc = async () => {
-  const listValues = (await getPublicData(DATACONTENT_ID.jscCgHourlyPeakId, [
-    { fd1: form.value.startDate, fd2: form.value.endDate },
+  loading1.value = true;
+  const listValues = (await getPublicData(DATACONTENT_ID.jscJgHourlyPeakId, [
+    { flightDate1: form.value.startDate, flightDate2: form.value.endDate },
   ])) as any;
   if (listValues && isValue(listValues)) {
     hourlyPeakObj.value = pubFunc(listValues, optionLeft);
   }
+  loading1.value = false;
 };
 
 //运单趋势分析
 const waybillTrendFunc = async () => {
-  const listValues = (await getPublicData(DATACONTENT_ID.jscCgWaybillTrendId, [
-    { fd1: form.value.startDate, fd2: form.value.endDate },
+  loading2.value = true;
+  const listValues = (await getPublicData(DATACONTENT_ID.jscJgWaybillTrendId, [
+    { flightDate1: form.value.startDate, flightDate2: form.value.endDate },
   ])) as any;
   if (listValues && isValue(listValues)) {
     waybillTrendObj.value = pubFunc(listValues, optionLeft);
   }
+  loading2.value = false;
 };
 
 //始发站/目的站统计分析
 const nodePeakFunc = async () => {
+  loading3.value = true;
   const listValues = (await getPublicData(DATACONTENT_ID.jscAirlineAbnormalId, [
-    { fd1: form.value.startDate, fd2: form.value.endDate, fttp: "国内进港" },
+    { fd1: form.value.startDate, fd2: form.value.endDate, fttp: "国际进港" },
   ])) as any;
   if (listValues && isValue(listValues)) {
     const newObj = _.cloneDeep(airCompaneBaggage.option.baseOption);
@@ -288,69 +305,95 @@ const nodePeakFunc = async () => {
     });
     nodePeakObj.value = pubFunc(listValues, newObj);
   }
+  loading3.value = false;
 };
 
 //航班数&运单数
 const numbersFunc = async () => {
-  const listValues = (await getPublicData(DATACONTENT_ID.jscCgNumbersId, [
+  loading4.value = true;
+  const listValues = (await getPublicData(DATACONTENT_ID.jscJgNumbersId, [
     { fd1: form.value.startDate, fd2: form.value.endDate },
   ])) as any;
   if (listValues && isValue(listValues)) {
     const { flightNum, stockNum, weight } = listValues[0];
     flightNums.value = flightNum;
     stockNums.value = stockNum;
-    weight.value = weight;
+    weightNums.value = weight;
   }
+  loading4.value = false;
 };
 
 //航司运量
 const airlineTrafficFunc = async () => {
+  loading6.value = true;
   const listValues = (await getPublicData(
-    DATACONTENT_ID.jscCgAirlineTrafficId,
-    [{ fd1: form.value.startDate, fd2: form.value.endDate }]
+    DATACONTENT_ID.jscJgAirlineTrafficId,
+    [{ flightDate1: form.value.startDate, flightDate2: form.value.endDate }]
   )) as any;
   if (listValues && isValue(listValues)) {
-    listValues.forEach((item) => {
-      item.jobTime = item["IACACode"];
-    });
-    airlineTrafficObj.value = pubFunc(
-      listValues,
-      airCompaneBaggage.option.baseOption
-    );
+    const newObj: any = _.cloneDeep(airCompaneBaggage.option.baseOption);
+    (newObj.dataZoom = [
+      {
+        id: "dataZoomX",
+        type: "slider",
+        xAxisIndex: [0],
+        filterMode: "filter",
+        start: 0,
+        end: 20,
+      },
+    ]),
+      listValues.forEach((item) => {
+        item.jobTime = item["IACACode"];
+      });
+    airlineTrafficObj.value = pubFunc(listValues, newObj);
   }
+  loading6.value = false;
 };
 
 //航班表格
 const airlineAbnormalFunc = async () => {
+  loading5.value = true;
   const listValues = (await getPublicData(DATACONTENT_ID.jscFlightDynamicsId, [
     {
       fd1: form.value.startDate,
       fd2: form.value.endDate,
-      fttp: "国内进港",
+      fttp: "国际进港",
     },
   ])) as any;
   if (listValues && isValue(listValues)) {
     listData.value = listValues;
   }
+  loading5.value = false;
 };
 
 //航班动态统计
 const airlineFunc = async () => {
-  const listValues = (await getPublicData(DATACONTENT_ID.jscCgAirlineId, [
+  loading7.value = true;
+  const listValues = (await getPublicData(DATACONTENT_ID.jscJgAirlineId, [
     {
       fd1: form.value.startDate,
       fd2: form.value.endDate,
     },
   ])) as any;
   if (listValues && isValue(listValues)) {
-    const newObj = _.cloneDeep(airCompaneBaggage.option.baseOption);
-    listValues.forEach((item) => {
-      item.jobTime = item["nodeCode"];
-      item.stockNum = item["flightNum"];
-      item.weight = item["stockNum"];
-    });
-    airlineObj.value = pubFunc(listValues, newObj);
+    const newObj: any = _.cloneDeep(airCompaneBaggage.option.baseOption);
+    (newObj.dataZoom = [
+      {
+        id: "dataZoomX",
+        type: "slider",
+        xAxisIndex: [0],
+        filterMode: "filter",
+        start: 0,
+        end: 20,
+      },
+    ]),
+      listValues.forEach((item) => {
+        item.jobTime = item["nodeCode"];
+        item.weight = item["flightNum"];
+      });
+    airlineObj.value = pubFunc(listValues, newObj, true);
   }
+  loading7.value = false;
 };
 
 onMounted(() => {

src/views/dashboard/indexOut.vue

@@ -18,7 +18,7 @@
                 </el-icon>
               </div>
             </div>
-            <div class="dashboard-content-top-left-item-bottom">
+            <div v-loading="loading1" element-loading-text="数据加载中..." element-loading-svg-view-box="-10, -10, 50, 50" element-loading-background="rgba(0,0,0, 0.3)" class="dashboard-content-top-left-item-bottom">
               <Echarts id="ww1" :option="hourlyPeakObj" />
             </div>
           </div>
@@ -36,14 +36,14 @@
                 </el-icon>
               </div>
             </div>
-            <div class="dashboard-content-top-left-item-bottom">
+            <div v-loading="loading2" element-loading-text="数据加载中..." element-loading-svg-view-box="-10, -10, 50, 50" element-loading-background="rgba(0,0,0, 0.3)" class="dashboard-content-top-left-item-bottom">
               <Echarts id="ww12" :option="waybillTrendObj" />
             </div>
           </div>
           <div class="dashboard-content-top-left-item">
             <div class="dashboard-content-top-left-item-top">
               <div class="dashboard-content-top-left-item-top-title">
-                始发站统计分析
+                目的站统计分析
               </div>
               <div class="dashboard-content-bottom-left-top-time" @click="showDatePicker(showTimeMsg.NodePeak)">
                 <el-icon color="#ffffff" size="18">
@@ -54,17 +54,17 @@
                 </el-icon>
               </div>
             </div>
-            <div class="dashboard-content-top-left-item-bottom">
+            <div v-loading="loading3" element-loading-text="数据加载中..." element-loading-svg-view-box="-10, -10, 50, 50" element-loading-background="rgba(0,0,0, 0.3)" class="dashboard-content-top-left-item-bottom">
               <Echarts id="ww4" :option="nodePeakObj" />
             </div>
           </div>
         </div>
         <!-- 地图 -->
         <div class="dashboard-content-top-center">
-          <div class="dashboard-content-top-center-top">
+          <div v-loading="loading4" element-loading-text="数据加载中..." element-loading-svg-view-box="-10, -10, 50, 50" element-loading-background="rgba(0,0,0, 0.3)" class="dashboard-content-top-center-top">
             <div class="dashboard-content-top-center-top-list">
               <div class="dashboard-content-top-center-top-list-txt">重量</div>
-              <div class="dashboard-content-top-center-top-list-num">{{ weight }}</div>
+              <div class="dashboard-content-top-center-top-list-num">{{ weightNums }}</div>
             </div>
             <div class="dashboard-content-top-center-top-list">
               <div class="dashboard-content-top-center-top-list-txt">航班数</div>
@@ -75,13 +75,13 @@
               <div class="dashboard-content-top-center-top-list-num">{{ stockNums }}</div>
             </div>
           </div>
-          <div class="dashboard-content-top-center-bottom">
+          <div v-loading="loading5" element-loading-text="数据加载中..." element-loading-svg-view-box="-10, -10, 50, 50" element-loading-background="rgba(0,0,0, 0.3)" class="dashboard-content-top-center-bottom">
             <div class="dashboard-content-top-center-bottom-title">航班动态跟踪</div>
             <div class="dashboard-content-top-center-bottom-content">
               <div class="dashboard-content-top-center-bottom-content-head">
                 <div class="dashboard-content-top-center-bottom-content-head-list">公司/航班号</div>
                 <div class="dashboard-content-top-center-bottom-content-head-list">航班状态</div>
-                <div class="dashboard-content-top-center-bottom-content-head-list">经停/到站</div>
+                <div class="dashboard-content-top-center-bottom-content-head-list">经停/到达站</div>
                 <div class="dashboard-content-top-center-bottom-content-head-list">计划起飞</div>
                 <div class="dashboard-content-top-center-bottom-content-head-list">实际起飞</div>
                 <div class="dashboard-content-top-center-bottom-content-head-list">机型</div>
@@ -109,7 +109,7 @@
               <div class="dashboard-content-top-right-item-top-title">
                 航司统计分析
               </div>
-              <div class="dashboard-content-top-right-item-top-time" @click="showDatePicker(showTimeMsg.AirlineAbnormal)">
+              <div class="dashboard-content-top-right-item-top-time" @click="showDatePicker(showTimeMsg.AirlineTraffic)">
                 <el-icon color="#ffffff" size="18">
                   <Calendar />
                 </el-icon>
@@ -118,7 +118,7 @@
                 </el-icon>
               </div>
             </div>
-            <div class="dashboard-content-top-right-item-bottom">
+            <div v-loading="loading6" element-loading-text="数据加载中..." element-loading-svg-view-box="-10, -10, 50, 50" element-loading-background="rgba(0,0,0, 0.3)" class="dashboard-content-top-right-item-bottom">
               <Echarts id="a1" :option="airlineTrafficObj" />
             </div>
           </div>
@@ -127,7 +127,7 @@
               <div class="dashboard-content-top-right-item-top-title">
                 航班动态统计
               </div>
-              <div class="dashboard-content-top-right-item-top-time" @click="showDatePicker(showTimeMsg.AirlineTraffic)">
+              <div class="dashboard-content-top-right-item-top-time" @click="showDatePicker(showTimeMsg.AirlineAbnormal)">
                 <el-icon color="#ffffff" size="18">
                   <Calendar />
                 </el-icon>
@@ -136,10 +136,28 @@
                 </el-icon>
               </div>
             </div>
-            <div class="dashboard-content-top-left-item-bottom">
+            <div v-loading="loading7" element-loading-text="数据加载中..." element-loading-svg-view-box="-10, -10, 50, 50" element-loading-background="rgba(0,0,0, 0.3)" class="dashboard-content-top-left-item-bottom">
               <Echarts id="ww44" :option="airlineObj" />
             </div>
           </div>
+          <div class="dashboard-content-top-right-item">
+            <div class="dashboard-content-top-right-item-top">
+              <div class="dashboard-content-top-right-item-top-title">
+                拉货统计分析
+              </div>
+              <div class="dashboard-content-top-right-item-top-time" @click="showDatePicker(showTimeMsg.PickingStatistics)">
+                <el-icon color="#ffffff" size="18">
+                  <Calendar />
+                </el-icon>
+                <el-icon color="#ffffff">
+                  <CaretBottom />
+                </el-icon>
+              </div>
+            </div>
+            <div v-loading="loading8" element-loading-text="数据加载中..." element-loading-svg-view-box="-10, -10, 50, 50" element-loading-background="rgba(0,0,0, 0.3)" class="dashboard-content-top-left-item-bottom">
+              <Echarts id="ww45" :option="pickingObj" />
+            </div>
+          </div>
         </div>
       </div>
     </div>
@@ -169,14 +187,23 @@ import * as _ from "lodash";
 const { optionLeft, airCompaneBaggage, airStutas, getPublicData } = usePublic();
 const timePickerName = ref<number>(0);
 const flag = ref<boolean>(false);
+const loading1 = ref<boolean>(false);
+const loading2 = ref<boolean>(false);
+const loading3 = ref<boolean>(false);
+const loading4 = ref<boolean>(false);
+const loading5 = ref<boolean>(false);
+const loading6 = ref<boolean>(false);
+const loading7 = ref<boolean>(false);
+const loading8 = ref<boolean>(false);
 const hourlyPeakObj = ref<any>({});
 const waybillTrendObj = ref<any>({});
 const nodePeakObj = ref<any>({});
 const airlineTrafficObj = ref<any>({});
 const airlineObj = ref<any>({});
+const pickingObj = ref<any>({});
 const flightNums = ref<number>(0);
 const stockNums = ref<number>(0);
-const weight = ref<number>(0);
+const weightNums = ref<number | string>(0);
 const form = ref({
   startDate: parseTime(Date.now() - 24 * 60 * 60 * 1000 * 7, "{y}-{m}-{d}"),
   endDate: parseTime(Date.now(), "{y}-{m}-{d}"),
@@ -212,7 +239,10 @@ const submitForm = () => {
       airlineTrafficFunc();
       break;
     case showTimeMsg.AirlineAbnormal:
-      airlineAbnormalFunc();
+      airlineFunc();
+      break;
+    case showTimeMsg.PickingStatistics:
+      pickingFuncs();
       break;
     default:
       break;
@@ -242,7 +272,7 @@ const sortClass = (sortData) => {
   return sorted;
 };
 
-const pubFunc = (listValues, target) => {
+const pubFunc = (listValues, target, type?) => {
   const newObj = _.cloneDeep(target);
   const [jobTimes, stockNums, weights] = [<any>[], <any>[], <any>[]];
   listValues.forEach((item) => {
@@ -251,35 +281,45 @@ const pubFunc = (listValues, target) => {
     weights.push(item.weight);
   });
   newObj.xAxis.data = jobTimes;
-  newObj.series[0].data = stockNums;
-  newObj.series[1].data = weights;
+  if (type) {
+    newObj.series[1].data = stockNums;
+    newObj.series[0].data = weights;
+  } else {
+    newObj.series[0].data = stockNums;
+    newObj.series[1].data = weights;
+  }
   return newObj;
 };
 
 //获取小时峰值分布
 const hourlyPeakFunc = async () => {
-  const listValues = (await getPublicData(DATACONTENT_ID.jscCgHourlyPeakId, [
-    { fd1: form.value.startDate, fd2: form.value.endDate },
+  loading1.value = true;
+  const listValues = (await getPublicData(DATACONTENT_ID.jscGjHourlyPeakId, [
+    { flightDate1: form.value.startDate, flightDate2: form.value.endDate },
   ])) as any;
   if (listValues && isValue(listValues)) {
     hourlyPeakObj.value = pubFunc(listValues, optionLeft);
   }
+  loading1.value = false;
 };
 
 //运单趋势分析
 const waybillTrendFunc = async () => {
-  const listValues = (await getPublicData(DATACONTENT_ID.jscCgWaybillTrendId, [
-    { fd1: form.value.startDate, fd2: form.value.endDate },
+  loading2.value = true;
+  const listValues = (await getPublicData(DATACONTENT_ID.jscGjWaybillTrendId, [
+    { flightDate1: form.value.startDate, flightDate2: form.value.endDate },
   ])) as any;
   if (listValues && isValue(listValues)) {
     waybillTrendObj.value = pubFunc(listValues, optionLeft);
   }
+  loading2.value = false;
 };
 
 //始发站/目的站统计分析
 const nodePeakFunc = async () => {
+  loading3.value = true;
   const listValues = (await getPublicData(DATACONTENT_ID.jscAirlineAbnormalId, [
-    { fd1: form.value.startDate, fd2: form.value.endDate, fttp: "国内进港" },
+    { fd1: form.value.startDate, fd2: form.value.endDate, fttp: "国际出港" },
   ])) as any;
   if (listValues && isValue(listValues)) {
     const newObj = _.cloneDeep(airCompaneBaggage.option.baseOption);
@@ -288,69 +328,125 @@ const nodePeakFunc = async () => {
     });
     nodePeakObj.value = pubFunc(listValues, newObj);
   }
+  loading3.value = false;
 };
 
 //航班数&运单数
 const numbersFunc = async () => {
-  const listValues = (await getPublicData(DATACONTENT_ID.jscCgNumbersId, [
+  loading4.value = true;
+  const listValues = (await getPublicData(DATACONTENT_ID.jscGjNumbersId, [
     { fd1: form.value.startDate, fd2: form.value.endDate },
   ])) as any;
   if (listValues && isValue(listValues)) {
     const { flightNum, stockNum, weight } = listValues[0];
     flightNums.value = flightNum;
     stockNums.value = stockNum;
-    weight.value = weight;
+    weightNums.value = weight;
   }
+  loading4.value = false;
 };
 
 //航司运量
 const airlineTrafficFunc = async () => {
+  loading6.value = true;
   const listValues = (await getPublicData(
-    DATACONTENT_ID.jscCgAirlineTrafficId,
-    [{ fd1: form.value.startDate, fd2: form.value.endDate }]
+    DATACONTENT_ID.jscGjAirlineTrafficId,
+    [{ flightDate1: form.value.startDate, flightDate2: form.value.endDate }]
   )) as any;
   if (listValues && isValue(listValues)) {
-    listValues.forEach((item) => {
-      item.jobTime = item["IACACode"];
-    });
-    airlineTrafficObj.value = pubFunc(
-      listValues,
-      airCompaneBaggage.option.baseOption
-    );
+    const newObj: any = _.cloneDeep(airCompaneBaggage.option.baseOption);
+    (newObj.dataZoom = [
+      {
+        id: "dataZoomX",
+        type: "slider",
+        xAxisIndex: [0],
+        filterMode: "filter",
+        start: 0,
+        end: 20,
+      },
+    ]),
+      listValues.forEach((item) => {
+        item.jobTime = item["IACACode"];
+      });
+    airlineTrafficObj.value = pubFunc(listValues, newObj);
   }
+  loading6.value = false;
 };
 
 //航班表格
 const airlineAbnormalFunc = async () => {
+  loading5.value = true;
   const listValues = (await getPublicData(DATACONTENT_ID.jscFlightDynamicsId, [
     {
       fd1: form.value.startDate,
       fd2: form.value.endDate,
-      fttp: "国内进港",
+      fttp: "国际出港",
     },
   ])) as any;
   if (listValues && isValue(listValues)) {
     listData.value = listValues;
   }
+  loading5.value = false;
 };
 
 //航班动态统计
 const airlineFunc = async () => {
-  const listValues = (await getPublicData(DATACONTENT_ID.jscCgAirlineId, [
+  loading7.value = true;
+  const listValues = (await getPublicData(DATACONTENT_ID.jscGjAirlineId, [
     {
       fd1: form.value.startDate,
       fd2: form.value.endDate,
     },
   ])) as any;
   if (listValues && isValue(listValues)) {
-    const newObj = _.cloneDeep(airCompaneBaggage.option.baseOption);
-    listValues.forEach((item) => {
-      item.jobTime = item["nodeCode"];
-      item.stockNum = item["flightNum"];
-      item.weight = item["stockNum"];
-    });
-    airlineObj.value = pubFunc(listValues, newObj);
+    const newObj: any = _.cloneDeep(airCompaneBaggage.option.baseOption);
+    (newObj.dataZoom = [
+      {
+        id: "dataZoomX",
+        type: "slider",
+        xAxisIndex: [0],
+        filterMode: "filter",
+        start: 0,
+        end: 20,
+      },
+    ]),
+      listValues.forEach((item) => {
+        item.jobTime = item["nodeCode"];
+        item.weight = item["flightNum"];
+      });
+    airlineObj.value = pubFunc(listValues, newObj, true);
+  }
+  loading7.value = false;
+};
+
+//拉货统计
+const pickingFuncs = async () => {
+  loading8.value = true;
+  const listValues = (await getPublicData(DATACONTENT_ID.jscGjPullId, [
+    {
+      fd1: form.value.startDate,
+      fd2: form.value.endDate,
+    },
+  ])) as any;
+  if (listValues && isValue(listValues)) {
+    const newObj: any = _.cloneDeep(airCompaneBaggage.option.baseOption);
+    (newObj.dataZoom = [
+      {
+        id: "dataZoomX",
+        type: "slider",
+        xAxisIndex: [0],
+        filterMode: "filter",
+        start: 0,
+        end: 40,
+      },
+    ]),
+      listValues.forEach((item) => {
+        item.jobTime = item["flightDate"];
+        item.weight = item["flightNum"];
+      });
+    pickingObj.value = pubFunc(listValues, newObj, true);
   }
+  loading8.value = false;
 };
 
 onMounted(() => {
@@ -361,6 +457,7 @@ onMounted(() => {
   airlineTrafficFunc();
   airlineAbnormalFunc();
   airlineFunc();
+  pickingFuncs();
 });
 </script>