Browse Source

修改首页

caojunjie 3 years ago
parent
commit
69376fa95e

+ 14 - 0
src/api/wel.js

@@ -69,3 +69,17 @@ export const financeCheck = (query) => {
     params: query
   })
 }
+export const count = (query) => {
+  return request({
+    url: '/api/blade-land/order-index/count',
+    method: 'get',
+    params: query
+  })
+}
+export const active = (query) => {
+  return request({
+    url: '/api/blade-land/order-index/active',
+    method: 'get',
+    params: query
+  })
+}

+ 130 - 0
src/views/wel/home/landTransportation/components/audit-data.vue

@@ -0,0 +1,130 @@
+<template>
+  <div class="home-container">
+    <el-card class="home-container__card">
+      <div class="title">
+        <span>
+          业务看板
+        </span>
+        <span>
+          <i
+            class="el-icon-refresh-right"
+            style="cursor: pointer;font-size:20px"
+            @click="refresh"
+          ></i>
+        </span>
+      </div>
+      <div class="content" v-loading="loading">
+        <div class="content-item" v-for="(item, index) in list" :key="index">
+          <div class="card">
+            <i :class="item.icon" style="font-size:30px;color:#409EFF"></i>
+            <div class="card-content">
+              <span class="card-content-num">{{ item.qty }}</span>
+              <span class="card-content-text">{{ item.text }}</span>
+            </div>
+          </div>
+        </div>
+      </div>
+    </el-card>
+  </div>
+</template>
+
+<script>
+import {
+  checkDate,
+  shipCheckDate,
+  financeCheck,
+  count
+} from "@/api/wel";
+export default {
+  name: "basicContainer",
+  props: {
+    sysType: Number
+  },
+  data() {
+    return {
+      loading: false,
+      list: [
+        { icon: "el-icon-s-order", qty: "0", text: "今日新增柜数" },
+        { icon: "el-icon-s-order", qty: "0", text: "未安排柜数" },
+        { icon: "el-icon-s-goods", qty: "0", text: "今日派车数" },
+        { icon: "el-icon-s-home", qty: "0", text: "可用车辆数" }
+      ],
+      tradeType: null
+    };
+  },
+  created() {
+    this.getSysType();
+  },
+  methods: {
+    getCheckDate() {
+      this.loading = true;
+      count({ tradeType: this.tradeType })
+        .then(res => {
+          console.log(res.data.data)
+          this.list.forEach(e => {
+            if(e.text == "今日新增柜数")e.qty = res.data.data.newly
+            if(e.text == "未安排柜数")e.qty = res.data.data.inactive
+            if(e.text == "今日派车数")e.qty = res.data.data.send
+            if(e.text == "可用车辆数")e.qty = res.data.data.usable
+          });
+        })
+        .finally(() => {
+          this.loading = false;
+        });
+    },
+    refresh() {
+      this.getCheckDate()
+    }
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+.home-container {
+  padding: 0px 5px 5px 5px;
+  box-sizing: border-box;
+  height: 100%;
+  ::v-deep .el-card__body {
+    padding: 10px 15px;
+    font-size: 14px;
+  }
+  &__card {
+    width: 100%;
+    height: 100%;
+  }
+  .title {
+    display: flex;
+    justify-content: space-between;
+  }
+}
+.content {
+  display: flex;
+  &-item {
+    background-color: #f4f8ff;
+    margin-top: 0.5vh;
+    margin-right: 0.5vw;
+    height: 13vh;
+    width: 15vw;
+    display: flex;
+    align-items: center;
+    padding-left: 1.5vw;
+    .card {
+      display: flex;
+      align-items: center;
+      &-content {
+        padding-left: 1vw;
+        display: flex;
+        flex-direction: column;
+        //justify-content: space-around;
+        &-num {
+          font-size: 20px;
+          font-weight: 600;
+        }
+        &-text {
+          color: #909399;
+        }
+      }
+    }
+  }
+}
+</style>

+ 44 - 0
src/views/wel/home/landTransportation/components/butCard.vue

@@ -0,0 +1,44 @@
+<template>
+  <div style="padding:5px">
+    <div class="card el-button--primary">
+      <div class="card-content">
+        <i :class="iconName"></i>
+        <div>{{ name }}</div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {};
+  },
+  props: {
+    name: {
+      type: String
+    },
+    iconName: {
+      type: String
+    }
+  },
+  methods: {}
+};
+</script>
+
+<style lang="scss" scoped>
+.card{
+  //background: #ff7d13;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  height: 14vh;
+  .card-content{
+    text-align: center;
+    color: #fff;
+    i{
+      font-size: 30px;
+    }
+  }
+}
+</style>

+ 63 - 0
src/views/wel/home/landTransportation/components/card.vue

@@ -0,0 +1,63 @@
+<template>
+  <div style="width: 100%;">
+    <div class="card">
+      <div class="card-head">
+        <span> <i :class="iconName" class="index-icon"></i>{{ title }}</span>
+      </div>
+      <div class="card-select">
+        <slot name="select"></slot>
+      </div>
+      <div class="card-content">
+        <slot name="content"></slot>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {};
+  },
+  props: {
+    title: {
+      type: String
+    },
+    iconName: {
+      type: String
+    }
+  },
+  methods: {}
+};
+</script>
+
+<style lang="scss" scoped>
+.card {
+  margin: 5px;
+  .card-head {
+    height: 28px;
+    font-size: 12px;
+    background: #f4f4f4;
+    border: 1px solid #d6d6d6;
+    display: flex;
+    align-items: center;
+  }
+  .card-select {
+    padding: 10px;
+    display: flex;
+    justify-content: right;
+    border-left: 1px solid #d6d6d6;
+    border-right: 1px solid #d6d6d6;
+  }
+  .card-content {
+    border-left: 1px solid #d6d6d6;
+    border-right: 1px solid #d6d6d6;
+    border-bottom: 1px solid #d6d6d6;
+    padding: 10px;
+    height: 100%;
+  }
+}
+.index-icon {
+  margin: 0 10px;
+}
+</style>

+ 127 - 0
src/views/wel/home/landTransportation/components/charge-today.vue

@@ -0,0 +1,127 @@
+<template>
+  <div class="home-container">
+    <el-card class="home-container__card">
+      <div class="title">
+        <span>
+          今日收款
+        </span>
+        <span>
+          <i
+            class="el-icon-refresh-right"
+            style="cursor: pointer;font-size:20px"
+            @click="refresh"
+          ></i>
+        </span>
+      </div>
+      <div v-loading="loading">
+        <div class="content">
+          <div class="content_item divider">
+            <div>
+              <div class="content_item_num">10</div>
+              <div class="content_item_text">已收金额</div>
+            </div>
+          </div>
+          <div class="content_item divider">
+            <div>
+              <div class="content_item_num">100,000</div>
+              <div class="content_item_text">待收金额</div>
+            </div>
+          </div>
+          <div class="content_item">
+            <div>
+              <div class="content_item_num">1</div>
+              <div class="content_item_text">未结单据</div>
+            </div>
+          </div>
+        </div>
+        <div id="chargeData" ref="chargeData" style="width:45vw;height:30vh" />
+      </div>
+    </el-card>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "basicContainer",
+  data() {
+    return {
+      loading: false
+    };
+  },
+  mounted() {
+    this.chargeData();
+  },
+  methods: {
+    refresh() {
+      this.loading = true;
+      setTimeout(() => {
+        this.loading = false;
+      }, 1000);
+    },
+    chargeData() {
+      let chargeData = this.$echarts.init(
+        document.getElementById("chargeData")
+      );
+      chargeData.setOption({
+        xAxis: {
+          type: "category",
+          data: []
+        },
+        yAxis: {
+          type: "value"
+        },
+        series: [
+          {
+            data: [0.1, 0.4, 0.6, 0.7, 0.8, 0.9, 1],
+            type: "line",
+            smooth: true
+          }
+        ]
+      });
+    }
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+.home-container {
+  padding: 0px 5px 5px 5px;
+  box-sizing: border-box;
+  height: 100%;
+  ::v-deep .el-card__body {
+    padding: 10px 15px;
+    font-size: 14px;
+  }
+  &__card {
+    width: 100%;
+    height: 100%;
+  }
+  .title {
+    display: flex;
+    justify-content: space-between;
+        margin-bottom: 5px;
+  }
+}
+.content {
+  display: flex;
+  background-color: #fafafa;
+  justify-content: space-around;
+  .divider {
+    border-right: 1px dashed #dcdfe6;
+  }
+  &_item {
+    margin: 20px 0px 20px 20px;
+    height: 5vh;
+    width: 33.3%;
+    display: flex;
+    align-items: center;
+    &_num {
+      font-size: 18px;
+      font-weight: 600;
+    }
+    &_text {
+      color: #909399;
+    }
+  }
+}
+</style>

+ 125 - 0
src/views/wel/home/landTransportation/components/pay-today.vue

@@ -0,0 +1,125 @@
+<template>
+  <div class="home-container">
+    <el-card class="home-container__card">
+      <div class="title">
+        <span>
+          今日付款
+        </span>
+        <span>
+          <i
+            class="el-icon-refresh-right"
+            style="cursor: pointer;font-size:20px"
+            @click="refresh"
+          ></i>
+        </span>
+      </div>
+      <div v-loading="loading">
+        <div class="content">
+          <div class="content_item divider">
+            <div>
+              <div class="content_item_num">10</div>
+              <div class="content_item_text">已付金额</div>
+            </div>
+          </div>
+          <div class="content_item divider">
+            <div>
+              <div class="content_item_num">100,000</div>
+              <div class="content_item_text">待付金额</div>
+            </div>
+          </div>
+          <div class="content_item">
+            <div>
+              <div class="content_item_num">1</div>
+              <div class="content_item_text">未结单据</div>
+            </div>
+          </div>
+        </div>
+        <div id="payData" ref="payData" style="width:45vw;height:30vh" />
+      </div>
+    </el-card>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "basicContainer",
+  data() {
+    return {
+      loading: false
+    };
+  },
+  mounted() {
+    this.payData();
+  },
+  methods: {
+    refresh() {
+      this.loading = true;
+      setTimeout(() => {
+        this.loading = false;
+      }, 1000);
+    },
+    payData() {
+      let payData = this.$echarts.init(document.getElementById("payData"));
+      payData.setOption({
+        xAxis: {
+          type: "category",
+          data: []
+        },
+        yAxis: {
+          type: "value"
+        },
+        series: [
+          {
+            data: [0.1, 0.3, 0.4, 0.5, 0.6, 0.7, 1],
+            type: "line",
+            smooth: true
+          }
+        ]
+      });
+    }
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+.home-container {
+  padding: 0px 5px 5px 0px;
+  box-sizing: border-box;
+  height: 100%;
+  ::v-deep .el-card__body {
+    padding: 10px 15px;
+    font-size: 14px;
+  }
+  &__card {
+    width: 100%;
+    height: 100%;
+  }
+  .title {
+    display: flex;
+    justify-content: space-between;
+    margin-bottom: 5px;
+  }
+}
+.content {
+  display: flex;
+  background-color: #fafafa;
+  justify-content: space-around;
+  .divider {
+    border-right: 1px dashed #dcdfe6;
+  }
+  &_item {
+    margin: 20px 0px 20px 20px;
+    height: 5vh;
+    width: 33.3%;
+    display: flex;
+    align-items: center;
+    &_num {
+      font-size: 18px;
+      font-weight: 600;
+    }
+    &_text {
+      color: #909399;
+    }
+  }
+}
+</style>

+ 101 - 0
src/views/wel/home/landTransportation/components/quick-launch.vue

@@ -0,0 +1,101 @@
+<template>
+  <div class="home-container">
+    <el-card class="home-container__card">
+      <div class="title">
+        <span>
+          快速发起
+        </span>
+      </div>
+      <div class="content">
+        <div class="content-icon" @click="inPage('wt')">
+          <i class="tradingIcon icon-purchase" style="color:#75CD28"></i>
+          <span>委托</span>
+        </div>
+        <div class="content-icon" @click="inPage('dd')">
+          <i class="tradingIcon icon-receipt" style="color:#409EFF"></i>
+          <span>调度</span>
+        </div>
+        <div class="content-icon" @click="inPage('pc')">
+          <i class="tradingIcon icon-ship" style="color:#921939"></i>
+          <span>派车</span>
+        </div>
+        <div class="content-icon" @click="inPage('gz')">
+          <i class="tradingIcon icon-ship" style="color:#7db4ff"></i>
+          <span>跟踪</span>
+        </div>
+        <div class="content-icon" @click="inPage('lytz')">
+          <i class="tradingIcon icon-sales" style="color:#143056"></i>
+          <span>陆运台账</span>
+        </div>
+      </div>
+    </el-card>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "basicContainer",
+  data() {
+    return {};
+  },
+  props: {
+    sysType: Number
+  },
+  methods: {
+    inPage(type) {
+      switch (type) {
+        case "wt":
+          this.$router.push("/landTransportation/placeAnOrder/index");
+          break;
+        case "dd":
+          this.$router.push("/landTransportation/dispatchingCars/index");
+          break;
+        case "pc":
+          this.$router.push("/landTransportation/motorcadeDriver/index");
+          break;
+        case "gz":
+          this.$router.push("/landTransportation/driver/index");
+          break;
+        case "lytz":
+          this.$router.push("/landTransportation/reportAnalysis/index");
+          break;
+      }
+    }
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+.home-container {
+  padding: 5px;
+  box-sizing: border-box;
+  height: 100%;
+  ::v-deep .el-card__body {
+    padding: 10px 15px;
+    font-size: 14px;
+  }
+  &__card {
+    width: 100%;
+    height: 100%;
+  }
+  .title {
+    display: flex;
+    justify-content: space-between;
+  }
+}
+.tradingIcon {
+  font-size: 36px;
+}
+.content {
+  display: flex;
+  &-icon {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    margin: 1.5vh 1vw 0vh 1vw;
+    span {
+      margin-top: 1vh;
+    }
+  }
+}
+</style>

+ 344 - 0
src/views/wel/home/landTransportation/components/realtime-data.vue

@@ -0,0 +1,344 @@
+<template>
+  <div class="home-container">
+    <el-card class="home-container__card">
+      <div class="title">
+        <span>
+          实时数据
+        </span>
+        <span class="right">
+          <div class="right_but">
+            <div
+              class="right_but_left"
+              :class="{ right_but_active: isActive }"
+              @click="inDay"
+            >
+              本日
+            </div>
+            <div
+              class="right_but_right"
+              :class="{ right_but_active: !isActive }"
+              @click="inMoon"
+            >
+              本月
+            </div>
+          </div>
+          <i
+            class="el-icon-refresh-right"
+            style="cursor: pointer;font-size:20px;line-height: 15px;"
+            @click="refresh"
+          ></i>
+        </span>
+      </div>
+      <div style="display: flex;justify-content: center;">
+        <div class="content" v-if="sysType !== 5" v-loading="loading">
+          <div class="content-item">
+            <div class="card">
+              <div class="card-title card-title1">
+                <span>
+                  报
+                </span>
+              </div>
+              <div class="card-content">
+                <span class="card-content-num">{{ data1.offerNumber }}</span>
+                <span class="card-content-text">报价订单</span>
+              </div>
+            </div>
+          </div>
+          <div class="divider" />
+          <div class="content-item">
+            <div class="card">
+              <div class="card-title card-title1">
+                <span>
+                  销
+                </span>
+              </div>
+              <div class="card-content">
+                <span class="card-content-num">{{ data1.sellNumber }}</span>
+                <span class="card-content-text">销售订单</span>
+              </div>
+            </div>
+          </div>
+          <div class="divider" />
+          <div class="content-item">
+            <div class="card">
+              <div class="card-title card-title2">
+                <span>
+                  采
+                </span>
+              </div>
+              <div class="card-content">
+                <span class="card-content-num">{{ data1.purchaseNumber }}</span>
+                <span class="card-content-text">采购订单</span>
+              </div>
+            </div>
+          </div>
+          <div class="divider" />
+          <div class="content-item">
+            <div class="card">
+              <div class="card-title card-title3">
+                <span>
+                  发
+                </span>
+              </div>
+              <div class="card-content">
+                <span class="card-content-num">{{ data2.sellNumber }}</span>
+                <span class="card-content-text">发货重量</span>
+              </div>
+            </div>
+          </div>
+          <div class="divider" />
+          <div class="content-item">
+            <div class="card">
+              <div class="card-title card-title4">
+                <span>
+                  收
+                </span>
+              </div>
+              <div class="card-content">
+                <span class="card-content-num">{{ data2.purchaseNumber }}</span>
+                <span class="card-content-text">收货重量</span>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div class="content" v-if="sysType === 5" v-loading="loading">
+          <div class="content-item">
+            <div class="card">
+              <div class="card-title card-title1">
+                <span>
+                  主
+                </span>
+              </div>
+              <div class="card-content">
+                <span class="card-content-num">1</span>
+                <span class="card-content-text">主营业务</span>
+              </div>
+            </div>
+          </div>
+          <div class="divider" />
+          <div class="content-item">
+            <div class="card">
+              <div class="card-title card-title2">
+                <span>
+                  已
+                </span>
+              </div>
+              <div class="card-content">
+                <span class="card-content-num">1</span>
+                <span class="card-content-text">已结(条)</span>
+              </div>
+            </div>
+          </div>
+          <div class="divider" />
+          <div class="content-item">
+            <div class="card">
+              <div class="card-title card-title3">
+                <span>
+                  未
+                </span>
+              </div>
+              <div class="card-content">
+                <span class="card-content-num">1</span>
+                <span class="card-content-text">未结(条)</span>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </el-card>
+  </div>
+</template>
+
+<script>
+import { realTimeData, shipRealTimeData } from "@/api/wel";
+export default {
+  name: "basicContainer",
+  props: {
+    sysType: Number
+  },
+  data() {
+    return {
+      isActive: true,
+      loading: false,
+      data1: {},
+      data2: {},
+      tradeType: null
+    };
+  },
+  created() {
+    this.getSysType();
+  },
+  mounted() {
+    this.init();
+  },
+  methods: {
+    init() {
+      this.getrealTimeData();
+      this.getshipRealTimeData();
+    },
+    refresh() {
+      this.init();
+    },
+    getSysType() {
+      const sysType = localStorage.getItem("sysitemType");
+      if (sysType == 6) {
+        this.tradeType = "JXS";
+      } else if (sysType == 5) {
+        this.tradeType = "SW";
+      } else if (sysType == 4) {
+        this.tradeType = "CK";
+      } else if (sysType == 3) {
+        this.tradeType = "JK";
+      } else if (sysType == 2) {
+        this.tradeType = "GN";
+      } else if (sysType == 1) {
+        this.tradeType = "XX";
+      }
+    },
+    getrealTimeData() {
+      this.loading = true;
+      realTimeData({ tradeType: this.tradeType })
+        .then(res => {
+          this.data1 = res.data.data;
+        })
+        .finally(() => {
+          this.loading = false;
+        });
+    },
+    getshipRealTimeData() {
+      this.loading = true;
+      shipRealTimeData({ tradeType: this.tradeType})
+        .then(res => {
+          this.data2 = res.data.data;
+        })
+        .finally(() => {
+          this.loading = false;
+        });
+    },
+    inDay() {
+      this.isActive = true;
+      this.loading = true;
+      setTimeout(() => {
+        this.loading = false;
+      }, 1000);
+    },
+    inMoon() {
+      this.isActive = false;
+      this.loading = true;
+      setTimeout(() => {
+        this.loading = false;
+      }, 1000);
+    }
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+.home-container {
+  padding: 0px 5px 5px 5px;
+  box-sizing: border-box;
+  height: 100%;
+  ::v-deep .el-card__body {
+    padding: 10px 15px;
+    font-size: 14px;
+  }
+  &__card {
+    width: 100%;
+    height: 100%;
+  }
+  .title {
+    display: flex;
+    justify-content: space-between;
+    .right {
+      display: flex;
+      align-items: center;
+      &_but {
+        margin-right: 10px;
+        border: 1px solid #409eff;
+        width: 80px;
+        border-radius: 3px;
+        display: flex;
+        &_left {
+          width: 40px;
+          text-align: center;
+          color: #409eff;
+          cursor: pointer;
+        }
+        &_right {
+          width: 40px;
+          text-align: center;
+          color: #409eff;
+          cursor: pointer;
+        }
+        &_active {
+          color: #fff;
+          background-color: #409eff;
+        }
+      }
+    }
+  }
+}
+.content {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  height: 15vh;
+  width: 80vw;
+  .divider {
+    display: block;
+    height: 0px;
+    width: 100%;
+    border-top: 1px dashed #dcdfe6;
+  }
+  &-item {
+    margin-left: 1vw;
+    .card {
+      width: 130px;
+      display: flex;
+      align-items: center;
+      &-title {
+        width: 40px;
+        height: 40px;
+        text-align: center;
+        border-radius: 50%;
+        font-size: 20px;
+        font-weight: 600;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        span {
+          line-height: 20px;
+        }
+      }
+      &-title1 {
+        color: #037fe1;
+        background-color: rgba(3, 127, 225, 0.15);
+      }
+      &-title2 {
+        color: #ffa21e;
+        background-color: rgba(255, 162, 30, 0.15);
+      }
+      &-title3 {
+        color: #fb5b60;
+        background-color: rgba(251, 91, 96, 0.15);
+      }
+      &-title4 {
+        color: #42bc6f;
+        background-color: rgba(66, 188, 111, 0.15);
+      }
+      &-content {
+        padding-left: 1vw;
+        display: flex;
+        flex-direction: column;
+        &-num {
+          font-size: 20px;
+          font-weight: 600;
+        }
+        &-text {
+          color: #909399;
+        }
+      }
+    }
+  }
+}
+</style>

+ 115 - 0
src/views/wel/home/landTransportation/components/sales-reached.vue

@@ -0,0 +1,115 @@
+<template>
+  <div class="home-container">
+    <el-card class="home-container__card">
+      <div class="title">
+        <span>
+          业务待办
+        </span>
+        <span>
+          <i
+            class="el-icon-refresh-right"
+            style="cursor: pointer;font-size:20px"
+            @click="refresh"
+          ></i>
+        </span>
+      </div>
+      <div class="content" v-loading="loading">
+        <el-table
+            ref="singleTable"
+            :data="tableData"
+            highlight-current-row
+            :show-header="false"
+            @current-change="handleCurrentChange"
+            style="width: 100%">
+          <el-table-column
+              type="index"
+              width="50">
+          </el-table-column>
+          <el-table-column
+              property="date"
+              label="日期"
+              width="120">
+          </el-table-column>
+          <el-table-column
+              property="name"
+              label="姓名"
+              width="120">
+          </el-table-column>
+          <el-table-column
+              property="address"
+              label="地址">
+          </el-table-column>
+        </el-table>
+      </div>
+    </el-card>
+  </div>
+</template>
+
+<script>
+import { monthSales } from "@/api/wel";
+export default {
+  name: "basicContainer",
+  data() {
+    return {
+      loading: false,
+      tradeType: null,
+      tableData:[]
+    };
+  },
+  created() {
+    this.getSysType();
+  },
+  methods: {
+    init() {
+      this.getSysType();
+    },
+    getSysType() {
+      this.loading=true
+      this.loading=false
+    },
+    //刷新按钮
+    refresh() {
+      this.init();
+    },
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+.home-container {
+  padding: 0px 5px 5px 5px;
+  box-sizing: border-box;
+  height: 100%;
+  ::v-deep .el-card__body {
+    padding: 10px 15px;
+    font-size: 14px;
+  }
+  &__card {
+    width: 100%;
+    height: 100%;
+  }
+  .title {
+    display: flex;
+    justify-content: space-between;
+  }
+}
+.content {
+  display: flex;
+  &_item {
+    margin-top: 20px;
+    .divider {
+      display: block;
+      height: 0px;
+      width: 12vw;
+      border-top: 1px dashed #dcdfe6;
+    }
+    &_num {
+      font-size: 18px;
+      font-weight: 600;
+    }
+    &_text {
+      color: #909399;
+    }
+  }
+}
+</style>

+ 116 - 0
src/views/wel/home/landTransportation/components/sales-trend.vue

@@ -0,0 +1,116 @@
+<template>
+  <div class="home-container">
+    <el-card class="home-container__card">
+      <div>
+        <div class="title">
+          <span>
+            运行车辆
+          </span>
+          <span>
+            <i
+              class="el-icon-refresh-right"
+              style="cursor: pointer;font-size:20px"
+              @click="refresh"
+            ></i>
+          </span>
+        </div>
+        <div class="content" v-loading="loading">
+          <el-table
+              :data="tableData"
+              stripe
+              size="mini"
+              height="420"
+              style="width: 100%;">
+            <el-table-column
+                prop="billNo">
+            </el-table-column>
+            <el-table-column
+                width="90"
+                prop="plateNo">
+            </el-table-column>
+            <el-table-column
+                width="80"
+                prop="status">
+              <template slot-scope="{row}">
+                <span v-if="row.status == 0" style="color: #E45656;">未调度</span>
+                <span v-if="row.status == 1" style="color: #F56C6C;">未派车</span>
+                <span v-if="row.status == 2" style="color: #F1A532;">未受理</span>
+                <span v-if="row.status == 3" style="color: #53C21D;">未完工</span>
+                <span v-if="row.status == 5" style="color: #F56C6C;">未到厂</span>
+                <span v-if="row.status == 4" style="color: #3C9CFF;">工单关闭</span>
+                <span v-if="row.status == 6" style="color: #3C9CFF;">已提箱</span>
+              </template>
+            </el-table-column>
+            <el-table-column
+                show-overflow-tooltip
+                prop="corpName">
+            </el-table-column>
+          </el-table>
+        </div>
+      </div>
+    </el-card>
+  </div>
+</template>
+
+<script>
+import { active } from "@/api/wel";
+export default {
+  name: "basicContainer",
+  props: {
+    sysType: Number
+  },
+  data() {
+    return {
+      loading: false,
+      tableData:[]
+    };
+  },
+  mounted() {
+    this.init();
+  },
+  methods: {
+    init() {
+      this.getsalesTrend();
+    },
+    getsalesTrend() {
+      this.loading = true;
+      active().then(res=>{
+        this.tableData = res.data.data
+        this.tableData = this.tableData.concat(res.data.data)
+        this.tableData = this.tableData.concat(res.data.data)
+        this.tableData = this.tableData.concat(res.data.data)
+        this.tableData = this.tableData.concat(res.data.data)
+        this.tableData = this.tableData.concat(res.data.data)
+        this.tableData = this.tableData.concat(res.data.data)
+        this.tableData = this.tableData.concat(res.data.data)
+        this.loading = false;
+      })
+    },
+    refresh() {
+      this.init()
+    }
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+.home-container {
+  padding: 0px 5px 5px 0px;
+  box-sizing: border-box;
+  height: 100%;
+  ::v-deep .el-card__body {
+    padding: 10px 15px;
+    font-size: 14px;
+  }
+  &__card {
+    width: 100%;
+    height: 100%;
+  }
+  .title {
+    display: flex;
+    justify-content: space-between;
+  }
+}
+.content {
+}
+</style>

+ 64 - 0
src/views/wel/home/landTransportation/landTransportation.vue

@@ -0,0 +1,64 @@
+<template>
+  <div class="container">
+    <quick-launch class="item1" :sysType="sysType" />
+    <audit-data class="item2" :sysType="sysType"/>
+    <sales-reached class="item3" :sysType="sysType"/>
+    <sales-trend class="item4" :sysType="sysType"/>
+  </div>
+</template>
+
+<script>
+import quickLaunch from "./components/quick-launch";
+import auditData from "./components/audit-data";
+import realtimeData from "./components/realtime-data";
+import salesReached from "./components/sales-reached";
+import salesTrend from "./components/sales-trend";
+import chargeToday from "./components/charge-today";
+import payToday from "./components/pay-today";
+export default {
+  name: "wel",
+  data() {
+    return {};
+  },
+  props:{
+    sysType:Number
+  },
+  created() {},
+  components: {
+    quickLaunch,
+    auditData,
+    realtimeData,
+    salesReached,
+    salesTrend,
+    chargeToday,
+    payToday
+  },
+  computed: {},
+  methods: {}
+};
+</script>
+<style lang="scss" scoped>
+.item1 {
+  grid-area: a;
+}
+.item2 {
+  grid-area: b;
+}
+.item3 {
+  grid-area: c;
+}
+.item4 {
+  grid-area: d;
+}
+.container {
+  display: grid;
+  width: 100%;
+  height: 95.5vh;
+  grid-template-columns: repeat(auto-fill, 10%);
+  grid-template-rows: 140px 180px 480px 350px 400px;
+  grid-template-areas:
+    "a a a a a a a a a a"
+    "b b b b b b b b b b"
+    "c c c c d d d d d d"
+}
+</style>

+ 5 - 1
src/views/wel/index.vue

@@ -1,6 +1,7 @@
 <template>
   <div v-if="billType">
     <tongjiSchool v-if="billType == 1"></tongjiSchool>
+    <landTransportation v-else-if="billType == 7"></landTransportation>
     <defaultPage v-else :sysType="billType"></defaultPage>
   </div>
 </template>
@@ -8,6 +9,7 @@
 <script>
 import defaultPage from "@/views/wel/home/defaultPage";
 import tongjiSchool from "@/views/wel/home/tongjiSchool";
+import landTransportation from "@/views/wel/home/landTransportation/landTransportation";
 import { getUserInfo } from "@/api/system/user";
 import { setStore } from "@/util/store";
 export default {
@@ -19,13 +21,15 @@ export default {
   },
   created() {
     getUserInfo().then(res => {
+      console.log(res.data)
       this.billType = res.data.data.billType;
       localStorage.setItem('sysitemType',this.billType)
     });
   },
   components: {
     tongjiSchool,
-    defaultPage
+    defaultPage,
+    landTransportation
   },
   methods: {}
 };