维修大屏

src/views/drivingSchool/student/index.vue

@@ -28,7 +28,7 @@
       <el-form-item label="状态" prop="state">
         <el-select v-model="queryParams.state" placeholder="请选择状态" clearable>
           <el-option
-            v-for="dict in dict.type.jx_report_state"
+            v-for="dict in this.getDictDatas('jx_report_state')"
             :key="dict.value"
             :label="dict.label"
             :value="dict.value"
@@ -38,7 +38,7 @@
       <el-form-item label="是否面签" prop="isSign">
         <el-select v-model="queryParams.isSign" placeholder="请选择状态" clearable>
           <el-option
-            v-for="dict in dict.type.sign_status"
+            v-for="dict in  this.getDictDatas('sign_status')"
             :key="dict.value"
             :label="dict.label"
             :value="dict.value"
@@ -49,7 +49,7 @@
       <el-form-item label="是否退学" prop="isReturn">
         <el-select v-model="queryParams.isReturn" placeholder="请选择状态" clearable>
           <el-option
-            v-for="dict in dict.type.school_return"
+            v-for="dict in   this.getDictDatas('school_return')"
             :key="dict.value"
             :label="dict.label"
             :value="dict.value"
@@ -161,12 +161,12 @@
 <!--      <el-table-column label="身份证" align="center" prop="identity" />-->
       <el-table-column label="状态" align="center" prop="state">
         <template slot-scope="scope">
-          <dict-tag :options="dict.type.jx_report_state" :value="scope.row.state"/>
+          <dict-tag :options=" this.getDictDatas('jx_report_state')" :value="scope.row.state"/>
         </template>
       </el-table-column>
       <el-table-column label="职业" align="center" prop="prof">
         <template slot-scope="scope">
-          <dict-tag :options="dict.type.profession" :value="scope.row.prof"/>
+          <dict-tag :options="this.getDictDatas('profession')" :value="scope.row.prof"/>
         </template>
       </el-table-column>
 <!--      <el-table-column label="是否面签" align="center" prop="isSign">-->
@@ -245,7 +245,7 @@
         <el-form-item label="职业" prop="prof">
           <el-radio-group v-model="form.prof">
             <el-radio
-              v-for="dict in dict.type.profession"
+              v-for="dict in  this.getDictDatas('profession')"
               :key="dict.value"
               :label="dict.value"
             >{{dict.label}}</el-radio>
@@ -254,7 +254,7 @@
         <el-form-item label="状态" prop="state">
           <el-radio-group v-model="form.state">
             <el-radio
-              v-for="dict in dict.type.jx_report_state"
+              v-for="dict in this.getDictDatas('jx_report_state')"
               :key="dict.value"
               :label="parseInt(dict.value)"
             >{{dict.label}}</el-radio>
@@ -263,7 +263,7 @@
         <el-form-item label="是否已面签" prop="isSign">
           <el-radio-group v-model="form.isSign">
             <el-radio
-              v-for="dict in dict.type.sign_status"
+              v-for="dict in this.getDictDatas('sign_status')"
               :key="dict.value"
               :label="parseInt(dict.value)"
             >{{dict.label}}</el-radio>
@@ -272,7 +272,7 @@
         <el-form-item label="是否退学" prop="isReturn">
           <el-radio-group v-model="form.isReturn">
             <el-radio
-              v-for="dict in dict.type.school_return"
+              v-for="dict in  this.getDictDatas('school_return')"
               :key="dict.value"
               :label="dict.value"
             >{{dict.label}}</el-radio>
@@ -377,7 +377,7 @@
 <script>
 // import { listPay, getPay, delPay, addPay, updatePay } from "@/api/system/pay";
 import { listPay, getPay, delPay, addPay, updatePay, findJlListAll, updatePayById } from "./api/DriveSchoolPay";
-import {getToken} from "@/utils/auth";
+import {getAccessToken} from "@/utils/auth";
 
 export default {
   name: "Pay",
@@ -396,7 +396,7 @@ export default {
         // 是否更新已经存在的用户数据
         updateSupport: 0,
         // 设置上传的请求头部
-        headers: {Authorization: "Bearer " + getToken()},
+        headers: {Authorization: "Bearer " + getAccessToken()},
         // 上传的地址
         url: process.env.VUE_APP_BASE_API + "/system/pay/importData"
       },
@@ -455,6 +455,7 @@ export default {
     };
   },
   created() {
+    console.log(this.queryParams,458)
     this.getList();
   },
   methods: {
@@ -476,7 +477,7 @@ export default {
     async okJlClick(name, id) {
       await updatePayById(this.bmId, name, id)
       this.isJl = false
-
+      console.log(479479)
       listPay(this.queryParams).then(response => {
         this.payList = response.data.records;
         this.total = response.data.total;
@@ -493,6 +494,7 @@ export default {
     /** 查询订单列表 */
     getList() {
       this.loading = true;
+      console.log(this.queryParams,496)
       listPay(this.queryParams).then(response => {
         this.payList = response.rows;
         this.total = response.total;

src/views/repair/screen/repairBigScreen.vue

@@ -0,0 +1,423 @@
+<template>
+  <div class="cont">
+      <div class="top_">
+        <div>车辆维修数据分析</div>
+      </div>
+<!--    -->
+    <div class="content_">
+      <div class="c_left">
+        <div class="six_box">
+          <div class="s_title">
+            客户来源
+          </div>
+          <div class="echaets_box">
+            <div id="khly" style="width: 400px; height: 267px;"></div>
+          </div>
+        </div>
+        <div class="six_box">
+          <div class="s_title">
+            月工单数据来源
+          </div>
+          <div class="echaets_box"></div>
+        </div>
+        <div class="six_box">
+          <div class="s_title">
+            支付渠道统计
+          </div>
+          <div class="echaets_box"></div>
+        </div>
+      </div>
+      <div class="c_cont">
+        <div class="tab_">
+          <div class="tab_buttom tab_acvit" >数量</div>
+          <div class="tab_buttom">金额</div>
+        </div>
+        <div class="tab_bt">
+          <div class="yb_">
+            <div class="yb_title">工单总数</div>
+            <div class="numlist">
+                <div class="num_box" v-for="(item,index) in 6" :key="index">
+                  {{index}}
+                </div>
+            </div>
+          </div>
+          <div class="yb_">
+            <div class="yb_title">今日工单</div>
+            <div class="numlist">
+              <div class="num_box" v-for="(item,index) in 6" :key="index">
+                {{index}}
+              </div>
+            </div>
+          </div>
+        </div>
+        <div class="five_box">
+          <div class="f_box">
+            <div class="img_left">
+              <img src="./imgs/1.png" style="width: 60px;height: 60px">
+            </div>
+            <div>
+              <div class="f_size">未派工</div>
+              <div class="f_num">2082</div>
+            </div>
+          </div>
+          <div class="f_box">
+            <div class="img_left">
+              <img src="./imgs/2.png" style="width: 60px;height: 60px">
+            </div>
+            <div>
+              <div class="f_size">施工中</div>
+              <div class="f_num">2082</div>
+            </div>
+          </div>
+          <div class="f_box">
+            <div class="img_left">
+              <img src="./imgs/3.png" style="width: 60px;height: 60px">
+            </div>
+            <div>
+              <div class="f_size">未结账</div>
+              <div class="f_num">2082</div>
+            </div>
+          </div>
+          <div class="f_box">
+            <div class="img_left">
+              <img src="./imgs/4.png" style="width: 60px;height: 60px">
+            </div>
+            <div>
+              <div class="f_size">已结账</div>
+              <div class="f_num">2082</div>
+            </div>
+          </div>
+          <div class="f_box">
+            <div class="img_left">
+              <img src="./imgs/5.png" style="width: 60px;height: 60px">
+            </div>
+            <div>
+              <div class="f_size">挂账</div>
+              <div class="f_num">2082</div>
+            </div>
+          </div>
+        </div>
+        <div class="co_title">
+          最新工单
+        </div>
+        <div class="list_long">
+          <div class="long_title">
+            <div class="l_one">工单号</div>
+            <div class="l_two">服务客户</div>
+            <div class="l_three">服务顾问</div>
+            <div class="l_four">创建时间</div>
+          </div>
+          <div class="ot_vox">
+            <div class="long_box" v-for="(item,index) in 16" :key="index">
+              <div class="l_one">1209840149750105501</div>
+              <div class="l_two">张三</div>
+              <div class="l_three">李向东</div>
+              <div class="l_four">2024-10-20 12:00</div>
+            </div>
+          </div>
+
+        </div>
+      </div>
+      <div class="c_right">
+        <div class="six_box">
+          <div class="s_title">
+            维修类型统计
+          </div>
+          <div class="echaets_box"></div>
+        </div>
+        <div class="six_box">
+          <div class="s_title">
+            月工单金额走势
+          </div>
+          <div class="echaets_box"></div>
+        </div>
+        <div class="six_box">
+          <div class="s_title">
+            维修工人排行
+          </div>
+          <div class="echaets_box"></div>
+        </div>
+      </div>
+    </div>
+
+  </div>
+</template>
+
+<script>
+import * as echarts from 'echarts';
+export default {
+  name: 'Index',
+  components: {
+
+  },
+  data() {
+    return {
+
+    }
+  },
+  created() {
+
+  },
+  mounted() {
+    this.echaerCar();
+  },
+  methods: {
+    echaerCar(){
+      var chartDom = document.getElementById('khly');
+      var myChart = echarts.init(chartDom);
+      var option;
+      option = {
+        // legend: {
+        //   top: 'bottom'
+        // },
+        toolbox: {
+          show: true,
+
+        },
+        series: [
+          {
+            name: 'Nightingale Chart',
+            type: 'pie',
+            radius: [20, 100],
+            center: ['50%', '50%'],
+            roseType: 'area',
+            itemStyle: {
+              borderRadius: 2
+            },
+            data: [
+              { value: 40, name: '救援' },
+              { value: 38, name: '线下' },
+              { value: 32, name: '小程序预约' },
+
+            ]
+          }
+        ]
+      };
+
+      option && myChart.setOption(option);
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.cont{
+  background: #020F32;
+  //background: url("./imgs/back.png") no-repeat;
+  background-size: 100% 100%;
+  width: 100%;
+  height: 100vh;
+}
+.top_{
+  width: 100%;
+  height: 86px;
+  background: url("./imgs/top.png") no-repeat;
+  background-size: 100% 100%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 50px;
+  color: #FFFFFF;
+  font-weight: bold;
+  margin-bottom: 15px;
+}
+.content_{
+  width: 100%;
+  display: flex;
+  //align-items: center;
+  justify-content: space-between;
+}
+.c_left{
+  width: 25%;
+}
+.c_cont{
+  width: 50%;
+}
+.tab_{
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 100%;
+  font-size: 18px;
+  color: #FFFFFF;
+  margin: 15px auto;
+}
+.yb_title{
+  text-align: center;
+  font-size: 18px;
+  color: #FFFFFF;
+  margin: 15px auto;
+}
+.tab_bt{
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 100%;
+  border-bottom: 4px solid #0174F6;
+  box-sizing: border-box;
+  padding-bottom: 20px;
+}
+.tab_buttom{
+  width: 120px;
+  height: 32px;
+
+  border: 1px solid #0174F6;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+yb_title{
+  font-size: 16px;
+  color: #FFFFFF;
+  text-align: center;
+  width: 100%;
+}
+.numlist{
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+.num_box{
+  width: 38px;
+  height: 50px;
+  border-radius: 0px 0px 0px 0px;
+  font-weight: 600;
+  font-size: 32px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background: url("./imgs/numbcak.png") no-repeat;
+  background-size: 100% 100%;
+ color: #FFFFFF;
+  margin: 0px 10px;
+}
+.yb_{
+  width: 50%;
+}
+.tab_acvit{
+  background: #0174F6 !important;
+}
+.five_box{
+  display: flex;
+  align-items: center;
+  justify-content: space-around;
+  margin: 30px auto;
+}
+.f_size{
+  font-size: 14px;
+  color: #FFFFFF;
+}
+.f_num{
+  font-weight: bold;
+  font-size: 24px;
+  color: #FFFFFF;
+}
+.img_left{
+  width: 60px;
+  height: 60px;
+  margin-right: 10px;
+}
+.f_box{
+  display: flex;
+  align-items: center;
+}
+.co_title{
+  width: 100%;
+  height: 32px;
+  background: url("./imgs/c_title.png") no-repeat;
+  background-size: 100% 100%;
+  font-weight: 500;
+  font-size: 20px;
+  color: #FFFFFF;
+  box-sizing: border-box;
+  padding-left: 40px;
+}
+.s_title{
+  width: 90%;
+  height: 32px;
+  background: url("./imgs/title.png") no-repeat;
+  background-size: 100% 100%;
+  font-weight: 500;
+  font-size: 20px;
+  color: #FFFFFF;
+  box-sizing: border-box;
+  padding-left: 40px;
+  margin: 0px auto;
+}
+.echaets_box{
+  width: 90%;
+  height: 267px;
+  margin: 0px auto;
+  border-bottom: 1px solid #0174F6;
+}
+.list_long{
+  width: 100%;
+  height: 563px;
+
+}
+.l_one{
+  width: 30%;
+  text-align: left;
+  font-size: 18px;
+  color: rgba(255,255,255,0.7);
+  overflow: hidden;
+  box-sizing: border-box;
+  padding-left: 35px;
+}
+.l_two{
+  width: 20%;
+  text-align: center;
+  font-size: 18px;
+  color: rgba(255,255,255,0.7);
+  overflow: hidden;
+}
+.l_three{
+  width: 20%;
+  text-align: center;
+  font-size: 18px;
+  color: rgba(255,255,255,0.7);
+  overflow: hidden;
+}
+.l_four{
+  width: 30%;
+  text-align: right;
+  font-size: 18px;
+  color: rgba(255,255,255,0.7);
+  overflow: hidden;
+  box-sizing: border-box;
+  padding-right: 35px;
+}
+.long_title{
+  width: 100%;
+  height: 58px;
+  background: rgba(1,116,246,0.1);
+  background: url("./imgs/c_list.png") no-repeat;
+  background-size: 100% 100%;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin: 10px auto;
+}
+.ot_vox{
+  width: 100%;
+  height: 500px;
+  overflow: auto;
+  scrollbar-width: none;
+}
+.long_box{
+  width: 100%;
+  height: 58px;
+  background: rgba(1,116,246,0.1);
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin: 10px auto;
+}
+.six_box{
+  margin-bottom: 15px;
+}
+.c_right{
+  width: 25%;
+}
+
+</style>