看板

ant-design-vue-jeecg/package-lock.json

@@ -39,6 +39,7 @@
         "vue-photo-preview": "^1.1.3",
         "vue-print-nb-jeecg": "^1.0.12",
         "vue-router": "^3.0.1",
+        "vue-seamless-scroll": "^1.1.23",
         "vue-splitpane": "^1.0.4",
         "vuedraggable": "^2.20.0",
         "vuex": "^3.1.0",
@@ -7655,6 +7656,11 @@
         "ms": "2.0.0"
       }
     },
+    "node_modules/comutils": {
+      "version": "1.1.19",
+      "resolved": "https://registry.npmjs.org/comutils/-/comutils-1.1.19.tgz",
+      "integrity": "sha512-JxXB67juILiwhdLwOsYyjUqwWEhHdObI0EClOPk+JDtEuTbac59s0pxGpfCBnNNQ5JommifmcMGneW/4Cg7YWw=="
+    },
     "node_modules/concat-map": {
       "version": "0.0.1",
       "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
@@ -21558,6 +21564,14 @@
       "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-3.3.4.tgz",
       "integrity": "sha512-SdKRBeoXUjaZ9R/8AyxsdTqkOfMcI5tWxPZOUX5Ie1BTL5rPSZ0O++pbiZCeYeythiZIdLEfkDiQPKIaWk5hDg=="
     },
+    "node_modules/vue-seamless-scroll": {
+      "version": "1.1.23",
+      "resolved": "https://registry.npmjs.org/vue-seamless-scroll/-/vue-seamless-scroll-1.1.23.tgz",
+      "integrity": "sha512-HBjUub8WwsKJzbFCrwKPDrZn4e+SSbkKgwWtjKtfLwesiFGwSsVxP44/Z6d3kpXy94qIFOiflJH6l0/9pj7SGA==",
+      "dependencies": {
+        "comutils": "^1.1.9"
+      }
+    },
     "node_modules/vue-splitpane": {
       "version": "1.0.6",
       "resolved": "https://registry.npmjs.org/vue-splitpane/-/vue-splitpane-1.0.6.tgz",
@@ -29189,6 +29203,11 @@
         }
       }
     },
+    "comutils": {
+      "version": "1.1.19",
+      "resolved": "https://registry.npmjs.org/comutils/-/comutils-1.1.19.tgz",
+      "integrity": "sha512-JxXB67juILiwhdLwOsYyjUqwWEhHdObI0EClOPk+JDtEuTbac59s0pxGpfCBnNNQ5JommifmcMGneW/4Cg7YWw=="
+    },
     "concat-map": {
       "version": "0.0.1",
       "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
@@ -40484,6 +40503,14 @@
       "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-3.3.4.tgz",
       "integrity": "sha512-SdKRBeoXUjaZ9R/8AyxsdTqkOfMcI5tWxPZOUX5Ie1BTL5rPSZ0O++pbiZCeYeythiZIdLEfkDiQPKIaWk5hDg=="
     },
+    "vue-seamless-scroll": {
+      "version": "1.1.23",
+      "resolved": "https://registry.npmjs.org/vue-seamless-scroll/-/vue-seamless-scroll-1.1.23.tgz",
+      "integrity": "sha512-HBjUub8WwsKJzbFCrwKPDrZn4e+SSbkKgwWtjKtfLwesiFGwSsVxP44/Z6d3kpXy94qIFOiflJH6l0/9pj7SGA==",
+      "requires": {
+        "comutils": "^1.1.9"
+      }
+    },
     "vue-splitpane": {
       "version": "1.0.6",
       "resolved": "https://registry.npmjs.org/vue-splitpane/-/vue-splitpane-1.0.6.tgz",

ant-design-vue-jeecg/package.json

@@ -41,6 +41,7 @@
     "vue-photo-preview": "^1.1.3",
     "vue-print-nb-jeecg": "^1.0.12",
     "vue-router": "^3.0.1",
+    "vue-seamless-scroll": "^1.1.23",
     "vue-splitpane": "^1.0.4",
     "vuedraggable": "^2.20.0",
     "vuex": "^3.1.0",

ant-design-vue-jeecg/src/components/ChartCard.vue

@@ -31,7 +31,7 @@
         default: ''
       },
       total: {
-        type: String,
+        type: String | Number,
         default: ''
       },
       loading: {

ant-design-vue-jeecg/src/views/dashboard/Analysis.vue

@@ -1,7 +1,7 @@
 <template>
   <div>
     <index-chart v-if="indexStyle==1"></index-chart>
-    <index-bdc v-if="indexStyle==2"></index-bdc>
+    <!-- <index-bdc v-if="indexStyle==2"></index-bdc>
     <index-task v-if="indexStyle==3"></index-task>
     <div style="width: 100%;text-align: right;margin-top: 20px">
       请选择首页样式：
@@ -10,7 +10,7 @@
         <a-radio :value="2">统计图表2</a-radio>
         <a-radio :value="3">任务表格</a-radio>
       </a-radio-group>
-    </div>
+    </div> -->
   </div>
 </template>
 

ant-design-vue-jeecg/src/views/dashboard/Delivery.vue

@@ -0,0 +1,91 @@
+<template>
+    <div class="inbox">
+      <table width="100%">
+        <tr align="center" style="color: #54ad4c; line-height: 40px">
+          <!-- <th width="8%">用车需求编号</th> -->
+          <th width="10%">发货类型</th>
+          <th width="12%">用车需求编号</th>
+          <th width="9%">料号</th>
+          <th width="9%">规格</th>
+          <th width="10%">发货数量</th>
+          <th width="10%">预估托盘数</th>
+          <th width="10%">送货地点</th>
+          <th width="10%">取货仓库</th>
+          <th width="10%">发货日期</th>
+          <th width="10%">当前状态</th>
+        </tr>
+      </table>
+      <vue-seamless-scroll :data="dataSource" class="seamless-warps-scroll" :class-option="classOption">
+        <table width="100%">
+          <tbody style="color: rgba(0, 0, 0, 0.65); font-weight: 100 !important;">
+            <tr v-for="(item, index) in dataSource" align="center" :key="index">
+              <!-- <th width="8%">{{ item.vdNo }}</th>  -->
+              <th width="10%">{{ item.shipType_dictText }}</th> 
+              <th width="12%">{{ item.vdNo }}</th> 
+              <th width="9%">{{ item.pn }}</th> 
+              <th width="9%">{{ item.spec }}</th> 
+              <th width="10%">{{ item.shipNumber }}</th> 
+              <th width="10%">{{ item.palletsNum }}</th> 
+              <th width="10%">{{ item.deliveryAddress }}</th> 
+              <th width="10%">{{ item.pickUpHub }}</th> 
+              <th width="10%">{{ item.shipDate }}</th>
+              <th width="10%">{{ item.currentStatus_dictText }}</th>
+            </tr>
+          </tbody>
+        </table>
+      </vue-seamless-scroll>
+    </div>
+  </template>
+  
+  <script>
+  import { getAction } from '@api/manage'
+  import vueSeamlessScroll from 'vue-seamless-scroll'
+  
+    export default {
+      name: 'Delivery',
+      props: {
+        height: Number,
+        dataSource: Array
+      },
+      components: {
+        vueSeamlessScroll
+      },
+      data() {
+        return {
+          timer: null,
+        };
+      },
+      computed: {
+        classOption() {
+          return {
+            step: 0.1, // 数值越大速度滚动越快
+            limitMoveNum: this.dataSource.length, // 开始无缝滚动的数据量 this.dataList.length
+            hoverStop: true, // 是否开启鼠标悬停stop
+            direction: 1, // 0向下 1向上 2向左 3向右
+            openWatch: true, // 开启数据实时监控刷新dom
+            singleHeight: 0, // 单步运动停止的高度(默认值0是无缝不停止的滚动) direction => 0/1
+            singleWidth: 0, // 单步运动停止的宽度(默认值0是无缝不停止的滚动) direction => 2/3
+            waitTime: 1000, // 单步运动停止的时间(默认值1000ms)
+          }
+        },
+      },
+      methods: {
+      },
+      created(){
+      },
+      mounted(){
+      }
+    };
+  </script>
+  
+  <style scoped>
+    .inbox{
+      padding:2px ;
+      max-height: 200px;
+      overflow: hidden;
+    }
+  
+    .seamless-warps-scroll {
+      overflow: hidden;
+    }
+  </style>

ant-design-vue-jeecg/src/views/dashboard/IndexChart.vue

@@ -2,11 +2,11 @@
   <div class="page-header-index-wide">
     <a-row :gutter="24">
       <a-col :sm="24" :md="12" :xl="6" :style="{ marginBottom: '24px' }">
-        <chart-card :loading="loading" title="总销售额" total="￥126,560">
+        <chart-card :loading="loading" title="今日计划入厂数" :total="model.planCount">
           <a-tooltip title="指标说明" slot="action">
             <a-icon type="info-circle-o" />
           </a-tooltip>
-          <div>
+          <!-- <div>
             <trend flag="up" style="margin-right: 16px;">
               <span slot="term">周同比</span>
               12%
@@ -16,37 +16,37 @@
               11%
             </trend>
           </div>
-          <template slot="footer">日均销售额<span>￥ 234.56</span></template>
+          <template slot="footer">日均销售额<span>￥ 234.56</span></template> -->
         </chart-card>
       </a-col>
       <a-col :sm="24" :md="12" :xl="6" :style="{ marginBottom: '24px' }">
-        <chart-card :loading="loading" title="订单量" :total="8846 | NumberFormat">
+        <chart-card :loading="loading" title="当前排队数" :total="model.lineUpCount | NumberFormat">
           <a-tooltip title="指标说明" slot="action">
             <a-icon type="info-circle-o" />
           </a-tooltip>
-          <div>
+          <!-- <div>
             <mini-area />
           </div>
-          <template slot="footer">日订单量<span> {{ '1234' | NumberFormat }}</span></template>
+          <template slot="footer">日订单量<span> {{ '1234' | NumberFormat }}</span></template> -->
         </chart-card>
       </a-col>
       <a-col :sm="24" :md="12" :xl="6" :style="{ marginBottom: '24px' }">
-        <chart-card :loading="loading" title="支付笔数" :total="6560 | NumberFormat">
+        <chart-card :loading="loading" title="已入厂" :total="model.inCount | NumberFormat">
           <a-tooltip title="指标说明" slot="action">
             <a-icon type="info-circle-o" />
           </a-tooltip>
-          <div>
+          <!-- <div>
             <mini-bar :height="40" />
           </div>
-          <template slot="footer">转化率 <span>60%</span></template>
+          <template slot="footer">转化率 <span>60%</span></template> -->
         </chart-card>
       </a-col>
       <a-col :sm="24" :md="12" :xl="6" :style="{ marginBottom: '24px' }">
-        <chart-card :loading="loading" title="运营活动效果" total="78%">
+        <chart-card :loading="loading" title="已离厂" :total="model.outCount">
           <a-tooltip title="指标说明" slot="action">
             <a-icon type="info-circle-o" />
           </a-tooltip>
-          <div>
+          <!-- <div>
             <mini-progress color="rgb(19, 194, 194)" :target="80" :percentage="78" :height="8" />
           </div>
           <template slot="footer">
@@ -58,7 +58,7 @@
               <span slot="term">日环比</span>
               80%
             </trend>
-          </template>
+          </template> -->
         </chart-card>
       </a-col>
     </a-row>
@@ -67,39 +67,41 @@
       <div class="salesCard">
         <a-tabs default-active-key="1" size="large" :tab-bar-style="{marginBottom: '24px', paddingLeft: '16px'}">
           <div class="extra-wrapper" slot="tabBarExtraContent">
-            <div class="extra-item">
+            <!-- <div class="extra-item">
               <a>今日</a>
               <a>本周</a>
               <a>本月</a>
               <a>本年</a>
-            </div>
+            </div> -->
-            <a-range-picker :style="{width: '256px'}" />
+            <a-range-picker :style="{width: '256px'}" v-model="param" valueFormat="YYYY-MM-DD"/>
+            <a-icon type="search"@click="getVehicleDelivery" style="margin-left: 20px; font-size: 20px;"></a-icon>
           </div>
-          <a-tab-pane loading="true" tab="销售额" key="1">
+          <a-tab-pane loading="true" tab="车辆" key="1">
             <a-row>
-              <a-col :xl="16" :lg="12" :md="12" :sm="24" :xs="24">
+              <a-col :xl="24" :lg="12" :md="12" :sm="24" :xs="24">
-                <bar title="销售额排行" :dataSource="barData"/>
+                <!-- <bar title="销售额排行" :dataSource="barData"/> -->
+                 <Vehicle :dataSource="VehicleList"></Vehicle>
               </a-col>
-              <a-col :xl="8" :lg="12" :md="12" :sm="24" :xs="24">
+              <!-- <a-col :xl="8" :lg="12" :md="12" :sm="24" :xs="24">
                 <rank-list title="门店销售排行榜" :list="rankList"/>
-              </a-col>
+              </a-col> -->
             </a-row>
           </a-tab-pane>
-          <a-tab-pane tab="销售趋势" key="2">
+          <a-tab-pane tab="发货计划" key="2">
             <a-row>
-              <a-col :xl="16" :lg="12" :md="12" :sm="24" :xs="24">
+              <a-col :xl="24" :lg="12" :md="12" :sm="24" :xs="24">
-                <bar title="销售额趋势" :dataSource="barData"/>
+                <Delivery :dataSource="DeliveryList"></Delivery>
               </a-col>
-              <a-col :xl="8" :lg="12" :md="12" :sm="24" :xs="24">
+              <!-- <a-col :xl="8" :lg="12" :md="12" :sm="24" :xs="24">
                 <rank-list title="门店销售排行榜" :list="rankList"/>
-              </a-col>
+              </a-col> -->
             </a-row>
           </a-tab-pane>
         </a-tabs>
       </div>
     </a-card>
 
-    <a-row>
+    <!-- <a-row>
       <a-col :span="24">
         <a-card :loading="loading" :bordered="false" title="最近一周访问量统计" :style="{ marginTop: '24px' }">
           <a-row>
@@ -131,7 +133,7 @@
           <line-chart-multid :fields="visitFields" :dataSource="visitInfo"></line-chart-multid>
         </a-card>
       </a-col>
-    </a-row>
+    </a-row> -->
   </div>
 </template>
 
@@ -149,6 +151,10 @@
 
   import Trend from '@/components/Trend'
   import { getLoginfo,getVisitInfo } from '@/api/api'
+  import { getAction } from '@/api/manage'
+  import moment from 'dayjs'
+  import Vehicle from './Vehicle.vue'
+  import Delivery from './Delivery.vue'
 
   const rankList = []
   for (let i = 0; i < 7; i++) {
@@ -177,10 +183,16 @@
       Bar,
       Trend,
       LineChartMultid,
-      HeadInfo
+      HeadInfo,
+      Vehicle,
+      Delivery
     },
     data() {
       return {
+        model: {},
+        param: [moment().format('YYYY-MM-DD'), moment().format('YYYY-MM-DD')],
+        VehicleList: [],
+        DeliveryList: [],
         loading: true,
         center: null,
         rankList,
@@ -188,10 +200,17 @@
         loginfo:{},
         visitFields:['ip','visit'],
         visitInfo:[],
-        indicator: <a-icon type="loading" style="font-size: 24px" spin />
+        indicator: <a-icon type="loading" style="font-size: 24px" spin />,
+        url:{
+          getCount: '/vehicleinout/vehicleInOut/getCount',
+          getVehicle: '/vehicleinout/vehicleInOut/getVehicle',
+          getDelivery: '/deliverydemand/deliveryDemand/getDelivery'
+        }
       }
     },
     created() {
+      this.getCount();
+      this.getVehicleDelivery();
       setTimeout(() => {
         this.loading = !this.loading
       }, 1000)
@@ -213,6 +232,39 @@
            }
          })
       },
+      getCount(){
+        getAction(this.url.getCount).then(res => {
+          if (res.success) {
+            this.model = res.result;
+          }
+        })
+      },
+      getVehicleDelivery(){
+        if (!this.param[0] || !this.param[1]) {
+          this.$message.warn("时间不能为空");
+          return;
+        }
+        let vehicleParam = {
+          beginDate: this.param[0],
+          endDate: this.param[1]
+        }
+        this.getVehicle(vehicleParam);
+        this.getDelivery(vehicleParam);
+      },
+      getVehicle(vehicleParam){
+        getAction(this.url.getVehicle, vehicleParam).then(res => {
+          if (res.success) {
+            this.VehicleList = res.result.records;
+          }
+        })
+      },
+      getDelivery(vehicleParam){
+        getAction(this.url.getDelivery, vehicleParam).then(res => {
+          if (res.success) {
+            this.DeliveryList = res.result.records;
+          }
+        })
+      }
     }
   }
 </script>

ant-design-vue-jeecg/src/views/dashboard/Vehicle.vue

@@ -0,0 +1,91 @@
+<template>
+    <div class="inbox">
+      <table width="100%">
+        <tr align="center" style="color: #54ad4c; line-height: 40px">
+          <!-- <th width="8%">用车需求编号</th> -->
+          <th width="10%">入厂类型</th>
+          <th width="13%">用车需求编号</th>
+          <th width="10%">物流公司</th>
+          <th width="9%">车牌号</th>
+          <th width="10%">司机姓名</th>
+          <th width="10%">司机电话</th>
+          <th width="10%">司机身份证</th>
+          <th width="9%">进厂门</th>
+          <th width="9%">出厂门</th>
+          <th width="10%">当前状态</th>
+        </tr>
+      </table>
+      <vue-seamless-scroll :data="dataSource" class="seamless-warps-scroll" :class-option="classOption">
+        <table width="100%">
+          <tbody style="color: rgba(0, 0, 0, 0.65); font-weight: 100 !important;">
+            <tr v-for="(item, index) in dataSource" align="center" :key="index">
+              <!-- <th width="8%">{{ item.vdNo }}</th>  -->
+              <th width="10%">{{ item.efType_dictText }}</th> 
+              <th width="13%">{{ item.vdNo }}</th> 
+              <th width="10%">{{ item.logistics }}</th> 
+              <th width="9%">{{ item.carNum }}</th> 
+              <th width="10%">{{ item.driverName }}</th> 
+              <th width="10%">{{ item.driverTel }}</th> 
+              <th width="10%">{{ item.driverIdCard }}</th> 
+              <th width="9%">{{ item.enterFactoryDoor }}</th> 
+              <th width="9%">{{ item.exitFactoryDoor }}</th>
+              <th width="10%">{{ item.currentStatus_dictText }}</th>
+            </tr>
+          </tbody>
+        </table>
+      </vue-seamless-scroll>
+    </div>
+  </template>
+  
+  <script>
+  import { getAction } from '@api/manage'
+  import vueSeamlessScroll from 'vue-seamless-scroll'
+  
+    export default {
+      name: 'Vehicle',
+      props: {
+        height: Number,
+        dataSource: Array
+      },
+      components: {
+        vueSeamlessScroll
+      },
+      data() {
+        return {
+          timer: null,
+        };
+      },
+      computed: {
+        classOption() {
+          return {
+            step: 0.1, // 数值越大速度滚动越快
+            limitMoveNum: this.dataSource.length, // 开始无缝滚动的数据量 this.dataList.length
+            hoverStop: true, // 是否开启鼠标悬停stop
+            direction: 1, // 0向下 1向上 2向左 3向右
+            openWatch: true, // 开启数据实时监控刷新dom
+            singleHeight: 0, // 单步运动停止的高度(默认值0是无缝不停止的滚动) direction => 0/1
+            singleWidth: 0, // 单步运动停止的宽度(默认值0是无缝不停止的滚动) direction => 2/3
+            waitTime: 1000, // 单步运动停止的时间(默认值1000ms)
+          }
+        },
+      },
+      methods: {
+      },
+      created(){
+      },
+      mounted(){
+      }
+    };
+  </script>
+  
+  <style scoped>
+    .inbox{
+      padding:2px ;
+      max-height: 200px;
+      overflow: hidden;
+    }
+  
+    .seamless-warps-scroll {
+      overflow: hidden;
+    }
+  </style>