Merge branch 'master' of http://git.zthymaoyi.com/gongdecai/wangluohuoyun-htqd

# Conflicts:
#	vue.config.js

src/views/administrationManagement/driverInformationReporting.vue

@@ -16,8 +16,8 @@
               <el-input class='find' placeholder="可按司机姓名和账号查找" @keyup.enter.native="find" v-model="searchkeyWord"
                 clearable @change="find"></el-input>
               <el-button class="search" @click="find"><img width="16" height="16" style="margin-left: -8px"
-                  src="../../../public/img/sousuo.png" /></el-button><span
-                class="count_css">共{{ deptBudgetTotal }}条</span>
+                  src="../../../public/img/sousuo.png" /></el-button><span class="count_css">共{{ deptBudgetTotal
+                  }}条</span>
             </div>
           </el-col>
         </el-row>
@@ -38,13 +38,13 @@
               </div>-->
               <div :class="search == '' ? 'search' : 'searchNo'" class="search_item" @click="searchBtn('')">
                 全部
-              </div> 
+              </div>
             </div>
           </el-col>
         </el-row>
       </div>
       <el-table :data="tableData" style="width: 98%; margin: 0 auto; border-radius: 10px" height="55.8vh" border
-        highlight-current-row @row-click="handleRowClick" @selection-change="handleSelectionChange" >
+        highlight-current-row @row-click="handleRowClick" @selection-change="handleSelectionChange">
         <el-table-column type="selection" width="55" :selectable="selectInit">
         </el-table-column>
         <el-table-column type="index" label="序号" width="50">
@@ -57,36 +57,36 @@
         <el-table-column prop="driverPhone" label="账号"></el-table-column>
         <el-table-column prop="driverLicenseValidityStartDate" label="驾驶证有效期">
           <template slot-scope="scope">
-            <span :class="scope.row.driverOverdueFlag == 1?'red_text':''">{{scope.row.driverLicenseValidityStartDate}}</span>
+            <span :class="scope.row.driverOverdueFlag == 1 ? 'red_text' : ''">{{
+                scope.row.driverLicenseValidityStartDate
+            }}</span>
           </template>
         </el-table-column>
         <el-table-column prop="qualificationCertificateValidityDate" label="从业资格证有效期">
-           <template slot-scope="scope">
-            <span :class="scope.row.qualificationOverdueFlag == 1?'red_text':''">{{scope.row.qualificationCertificateValidityDate}}</span>
+          <template slot-scope="scope">
+            <span :class="scope.row.qualificationOverdueFlag == 1 ? 'red_text' : ''">{{
+                scope.row.qualificationCertificateValidityDate
+            }}</span>
           </template>
         </el-table-column>
         <el-table-column prop="cardValidityDate" label="身份证有效期">
-             <template slot-scope="scope">
-            <span :class="scope.row.overdueFlag == 1?'red_text':''">{{scope.row.cardValidityDate}}</span>
-          </template>
-        </el-table-column>
-        <el-table-column prop="updateDate" label="上报时间" min-width="156">
           <template slot-scope="scope">
-            <span v-if="scope.row.escalationStatus != '未认证' && scope.row.escalationStatus != '待上报'">{{scope.row.updateDate}}</span><!-- 未认证和待上报不显示时间 -->
+            <span :class="scope.row.overdueFlag == 1 ? 'red_text' : ''">{{ scope.row.cardValidityDate }}</span>
           </template>
         </el-table-column>
+        <el-table-column prop="reportedDate" label="上报时间" min-width="156"></el-table-column>
         <el-table-column prop="paymentDate" label="附件">
-          <template slot-scope="scope" style="text-align: center" v-if="scope.row.backStageStatus !='未认证'">
+          <template slot-scope="scope" style="text-align: center" v-if="scope.row.backStageStatus != '未认证'">
             <span class="btn_css btn_css1" @click="fujianLook(scope.row)">查看</span>
             <el-tooltip placement="top" v-if="
-                scope.row.overdueFlag == 1 ||
-                scope.row.driverOverdueFlag == 1 ||
-                scope.row.drivingOverdueFlag == 1 ||
-                scope.row.trailerOverdueFlag == 1 ||
-                scope.row.qualificationOverdueFlag == 1 ||
-                scope.row.operationOverdueFlag == 1 ||
-                scope.row.trailerOperationOverdueFlag == 1
-              ">
+              scope.row.overdueFlag == 1 ||
+              scope.row.driverOverdueFlag == 1 ||
+              scope.row.drivingOverdueFlag == 1 ||
+              scope.row.trailerOverdueFlag == 1 ||
+              scope.row.qualificationOverdueFlag == 1 ||
+              scope.row.operationOverdueFlag == 1 ||
+              scope.row.trailerOperationOverdueFlag == 1
+            ">
               <div slot="content">
                 <span v-if="scope.row.overdueFlag == 1">身份证已过有效期<br /></span>
                 <span v-if="scope.row.driverOverdueFlag == 1">驾驶证已过有效期<br /></span><span
@@ -99,16 +99,16 @@
         </el-table-column>
         <el-table-column prop="reportedStatus" label="状态" min-width="100">
           <template scope="scope">
-            {{scope.row.reportedStatus}}
-            <el-tooltip class="item" effect="dark" :content="scope.row.reportedFailureReason" placement="top" v-if="scope.row.reportedStatus == '未通过'">
+            {{ scope.row.reportedStatus }}
+            <el-tooltip class="item" effect="dark" :content="scope.row.reportedFailureReason" placement="top"
+              v-if="scope.row.reportedStatus == '未通过'">
               <i class="el-icon-warning-outline red_text"></i>
             </el-tooltip>
           </template>
         </el-table-column>
         <el-table-column label="操作" min-width="200">
           <template slot-scope="scope">
-            <el-link target="_blank" @click="see(scope.row)" type="primary" :underline="false"
-              >查看</el-link>
+            <el-link target="_blank" @click="see(scope.row)" type="primary" :underline="false">查看</el-link>
             <el-divider direction="vertical"></el-divider>
             <el-link target="_blank" @click="reportInfo(scope.row)" type="primary" :underline="false"
               :disabled="scope.row.reportedStatus != '未上报' && scope.row.reportedStatus != '未通过'">上报</el-link>
@@ -158,9 +158,10 @@
           </div> -->
         </div>
         <div class="file_tips">
-          <span v-if="count == 1">有效期：{{file.cardValidityDate}} </span><span v-if="count == 2">
-            准驾车型：{{file.quasiDrivingVehicle}} </span> <span v-if="count == 2"> 发证机关：{{file.lssuingAuthority}} </span>
-          <span v-if="count == 4"> 从业资格证号：{{file.qualificationCertificateNumber}}</span>
+          <span v-if="count == 1">有效期：{{ file.cardValidityDate }} </span><span v-if="count == 2">
+            准驾车型：{{ file.quasiDrivingVehicle }} </span> <span v-if="count == 2"> 发证机关：{{ file.lssuingAuthority }}
+          </span>
+          <span v-if="count == 4"> 从业资格证号：{{ file.qualificationCertificateNumber }}</span>
         </div>
         <div class="file_img">
           <img :src="img[index]" class="img_css" @click="enlarge(img[index])" />
@@ -176,447 +177,461 @@
     <el-drawer title="司机信息" :visible.sync="rightSee" style="overflow-y: auto !important">
       <div class="right_css">
         <div class="title_name">基本信息</div>
-        <div class="right_item">姓名：{{costData.driverName}}</div>
+        <div class="right_item">姓名：{{ costData.driverName }}</div>
         <div class="right_title">性别</div>
-        <div class="right_item">{{costData.driverSex}} </div>
-         <div class="right_title">手机号码</div>
-        <div class="right_item">{{costData.driverPhone}} </div>
-         <div class="right_title">身份证照片(人像面)</div>
+        <div class="right_item">{{ costData.driverSex }} </div>
+        <div class="right_title">手机号码</div>
+        <div class="right_item">{{ costData.driverPhone }} </div>
+        <div class="right_title">身份证照片(人像面)</div>
         <img :src="costData.cardAddressUrl" alt="" class="img_css" @click="enlarge(costData.cardAddressUrl)">
         <div class="right_title">身份证照片(国徽面)</div>
-         <img :src="costData.cardBackAddressUrl" alt="" class="img_css"  @click="enlarge(costData.cardBackAddressUrl)">
+        <img :src="costData.cardBackAddressUrl" alt="" class="img_css" @click="enlarge(costData.cardBackAddressUrl)">
         <div class="right_title">身份证号：</div>
-        <div class="right_item">{{costData.numberCard}}</div>
+        <div class="right_item">{{ costData.numberCard }}</div>
         <div class="right_title">身份证有效期</div>
-        <div class="right_item">{{costData.cardValidityDate}} </div>
-         <div class="right_title">驾驶证照片(正页)</div>
-        <img :src="costData.driverLicenseHomePage" alt="" class="img_css" @click="enlarge(costData.driverLicenseHomePage)">
+        <div class="right_item">{{ costData.cardValidityDate }} </div>
+        <div class="right_title">驾驶证照片(正页)</div>
+        <img :src="costData.driverLicenseHomePage" alt="" class="img_css"
+          @click="enlarge(costData.driverLicenseHomePage)">
         <div class="right_title">驾驶证照片(副页)</div>
-        <img :src="costData.driverLicenseBackPage" alt="" class="img_css" @click="enlarge(costData.driverLicenseBackPage)">
+        <img :src="costData.driverLicenseBackPage" alt="" class="img_css"
+          @click="enlarge(costData.driverLicenseBackPage)">
         <div class="right_title">准驾车型</div>
-        <div class="right_item">{{costData.quasiDrivingVehicle}}</div>
+        <div class="right_item">{{ costData.quasiDrivingVehicle }}</div>
         <div class="right_title">驾驶证发证机关</div>
-        <div class="right_item">{{costData.lssuingAuthority}}</div>
+        <div class="right_item">{{ costData.lssuingAuthority }}</div>
         <div class="right_title">驾驶证有效期</div>
-        <div class="right_item">{{costData.driverLicenseValidityDate}}</div>
+        <div class="right_item">{{ costData.driverLicenseValidityDate }}</div>
         <div class="right_title">道路运输从业资格证照片</div>
-        <img :src="costData.qualificationCertificate" alt="" class="img_css" @click="enlarge(costData.qualificationCertificate)">
+        <img :src="costData.qualificationCertificate" alt="" class="img_css"
+          @click="enlarge(costData.qualificationCertificate)">
         <div class="right_title">从业资格证有效期</div>
-        <div class="right_item">{{costData.qualificationCertificateValidityDate}} </div>
+        <div class="right_item">{{ costData.qualificationCertificateValidityDate }} </div>
         <div class="right_title">从业资格证号</div>
-        <div class="right_item">{{costData.qualificationCertificateNumber}} </div>
+        <div class="right_item">{{ costData.qualificationCertificateNumber }} </div>
       </div>
     </el-drawer>
     <el-image-viewer v-if="imgsVisible" :on-close="closeImgViewer" :url-list="srcList" style="z-index:9999" />
   </div>
 </template>
 <script>
-  import {
-    getList,
-    report,
-    getInfo
-  } from "@/api/administrationManagement";
-  export default {
-    components: {
-      "el-image-viewer": () =>
-        import("element-ui/packages/image/src/image-viewer"),
-    },
-    data() {
-      return {
-        tableData: [],
-        //分页
-        searchkeyWord: "",
-        currentPage: 1,
-        pageSize: 10,
-        deptBudgetTotal: 0,
-        deptCircularPage: {},
-        search: "",
-        disabled: false,
-        userInfo: false,
-        fujianInfo: false,
-        file: {},
-        img: [],
-        index: "0",
-        count: "1",
-        abilityName: "身份证人像面",
-        abilityName1: "身份证国徽面",
-        //图片预览
-        srcList: [],
-        imgsVisible: false,
-        //筛选时间
-        startDate: "",
-        endDate: "",
-        value1: [],
-        //侧边查看
-        rightSee: false,
-        costData: {
-          publishTaskInfo: {}
-        },
-        musterList:[],
-      };
-    },
-    mounted() {
-      let date = new Date()
-      let date1 = new Date().setTime(date.getTime() - 365 * 60 * 60 * 24 * 1000) //一年前的时间蹉
-      date1 = new Date(parseInt(date1)).toLocaleString().split(" ")[0].replaceAll("/", "-")
-      let nian = date1.split("-")[0]
-      let yue = date1.split("-")[1]
-      if (yue < 10) {
-        yue = "0" + yue
-      }
-      let ri = date1.split("-")[2]
-      if (ri < 10) {
-        ri = "0" + ri
+import {
+  getList,
+  report,
+  getInfo
+} from "@/api/administrationManagement";
+export default {
+  components: {
+    "el-image-viewer": () =>
+      import("element-ui/packages/image/src/image-viewer"),
+  },
+  data() {
+    return {
+      tableData: [],
+      //分页
+      searchkeyWord: "",
+      currentPage: 1,
+      pageSize: 10,
+      deptBudgetTotal: 0,
+      deptCircularPage: {},
+      search: "",
+      disabled: false,
+      userInfo: false,
+      fujianInfo: false,
+      file: {},
+      img: [],
+      index: "0",
+      count: "1",
+      abilityName: "身份证人像面",
+      abilityName1: "身份证国徽面",
+      //图片预览
+      srcList: [],
+      imgsVisible: false,
+      //筛选时间
+      startDate: "",
+      endDate: "",
+      value1: [],
+      //侧边查看
+      rightSee: false,
+      costData: {
+        publishTaskInfo: {}
+      },
+      musterList: [],
+    };
+  },
+  mounted() {
+    let date = new Date()
+    let date1 = new Date().setTime(date.getTime() - 365 * 60 * 60 * 24 * 1000) //一年前的时间蹉
+    date1 = new Date(parseInt(date1)).toLocaleString().split(" ")[0].replaceAll("/", "-")
+    let nian = date1.split("-")[0]
+    let yue = date1.split("-")[1]
+    if (yue < 10) {
+      yue = "0" + yue
+    }
+    let ri = date1.split("-")[2]
+    if (ri < 10) {
+      ri = "0" + ri
+    }
+    this.startDate = nian + "-" + yue + "-" + ri //一年前的時間
+    this.endDate = date.getFullYear() + "-" + (Number(date.getMonth() + 1) < 10 ? "0" + (Number(date.getMonth() + 1)) : Number(date.getMonth() + 1)) + "-" + (date.getDate() < 10 ? "0" + date.getDate() : date.getDate()) //當前時間
+    this.value1.push(this.startDate)
+    this.value1.push(this.endDate)
+    this.getList();
+  },
+  methods: {
+    //上报
+    escalation() {
+      var that = this
+      if (this.musterList.length == 0) {
+        this.$message.error("请勾选要上报的条目")
+        return
       }
-      this.startDate = nian + "-" + yue + "-" + ri //一年前的時間
-      this.endDate = date.getFullYear() + "-" + (Number(date.getMonth() + 1) < 10 ? "0" + (Number(date.getMonth() + 1)) : Number(date.getMonth() + 1)) + "-" + (date.getDate() < 10 ? "0" + date.getDate() : date.getDate()) //當前時間
-      this.value1.push(this.startDate)
-      this.value1.push(this.endDate)
-      this.getList();
-    },
-    methods: {
-      //上报
-      escalation(){
-        var that =this
-        if(this.musterList.length == 0){
-          this.$message.error("请勾选要上报的条目")
-          return
-        }
-          this.$confirm("确定上报司机信息？", "提示", {
-          confirmButtonText: "确定",
-          cancelButtonText: "取消",
-          type: "warning",
-        }).then(() => {
-          report({hyDriverInfoList:this.musterList})
+      this.$confirm("确定上报司机信息？", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      }).then(() => {
+        report({ hyDriverInfoList: this.musterList })
           .then((response) => {
-             if (response.code == 200) {
+            if (response.code == 200) {
               that.$notify({
                 title: "成功",
                 message: "司机信息上报成功！",
                 type: "success",
               });
               that.musterList = []
-              that.getList();
+              setTimeout(function () { that.getList(); }, 2000);
             }
+          }).catch(() => {
+            that.musterList = []
+            that.listLoading = false
           })
+      })
+    },
+    handleRowClick(row) {
+      return true
+    },
+    handleSelectionChange(val) {
+      this.musterList = val;
+      console.log(this.musterList)
+    },
+    see(row) {
+      this.loading = true
+      this.rightSee = true
+      getInfo({
+        commonId: row.commonId
+      }).then(response => {
+        this.costData = response.data
+        this.listLoading = false
+      })
+        .catch(() => {
+          this.listLoading = false
         })
-      },
-       handleRowClick(row) {
-        return true
-       },
-      handleSelectionChange(val){
-         this.musterList = val;
-         console.log(this.musterList)
-      },
-      see(row) { 
-        this.loading = true
-        this.rightSee = true
-        getInfo({
-            commonId: row.commonId
-          }).then(response => {
-            this.costData = response.data
-            this.listLoading = false
-          })
-          .catch(() => {
-            this.listLoading = false
-          })
-      },
-      reportInfo(row) { //上报
+    },
+    reportInfo(row) { //上报
       this.musterList.push(row)
       this.escalation()
-      },
-      dateChange(e) {
-        console.log(this.value1)
-        this.startDate = e[0]
-        this.endDate = e[1]
-        this.getList()
-      },
-      closeImgViewer() {
-        this.srcList = []
-        this.imgsVisible = false;
-      },
-      enlarge(url) {
-        this.imgsVisible = true;
-        this.srcList.push(url)
-      },
+    },
+    dateChange(e) {
+      console.log(this.value1)
+      this.startDate = e[0]
+      this.endDate = e[1]
+      this.getList()
+    },
+    closeImgViewer() {
+      this.srcList = []
+      this.imgsVisible = false;
+    },
+    enlarge(url) {
+      this.imgsVisible = true;
+      this.srcList.push(url)
+    },
 
-      getList() {
-        this.listLoading = true;
-        let _obj = {};
-        _obj.currentPage = this.currentPage;
-        _obj.pageSize = this.pageSize;
-        _obj.searchKeyWord = this.searchkeyWord;
-        _obj.administrationType = this.search;
-        _obj.startDate = this.startDate
-        _obj.endDate = this.endDate
-        getList(_obj)
-          .then((response) => {
-            this.tableData = response.data.records;
-            for (let i = 0; i < this.tableData.length; i++) {
-              this.tableData[i].iconShow = true;
-            }
-            this.deptBudgetTotal = response.data.total;
-            this.listLoading = false;
-          })
-          .catch(() => {
-            this.listLoading = false;
-          });
-      },
-      btnChange(num) {
-        this.count = num;
-        if (num == 1) {
-          this.abilityName = "身份证人像面";
-          this.abilityName1 = "身份证国徽面";
-          this.img[0] = this.file.cardAddressUrl;
-          this.img[1] = this.file.cardBackAddressUrl;
-        } else if (num == 2) {
-          this.abilityName = "驾驶证主页";
-          this.abilityName1 = "驾驶证副页";
-          this.img[0] = this.file.driverLicenseHomePage;
-          this.img[1] = this.file.driverLicenseBackPage;
-        } else if (num == 3) {
-          this.abilityName = "行驶证主页";
-          this.abilityName1 = "行驶证副页";
-          this.img[0] = this.file.drivingLicenseHomePage;
-          this.img[1] = this.file.drivingLicenseBackPage;
-        } else if (num == 4) {
-          this.index = 0;
-          this.img[0] = this.file.qualificationCertificate;
-        } else if (num == 5) {
-          this.abilityName = "挂车行驶证主页";
-          this.abilityName1 = "挂车行驶证副页";
-          this.img[0] = this.file.trailerLicenseHomePage;
-          this.img[1] = this.file.trailerLicenseBackPage;
-        } else if (num == 6) {
-          this.index = 0;
-          this.img[0] = this.file.operationCertificate;
-        } else if (num == 7) {
-          this.index = 0;
-          this.img[0] = this.file.trailerOperationCertificate;
-        }
-      },
-      fujianLook(row) {
-        this.file = row;
-        this.index = 0;
+    getList() {
+      this.listLoading = true;
+      this.musterList = []
+      let _obj = {};
+      _obj.currentPage = this.currentPage;
+      _obj.pageSize = this.pageSize;
+      _obj.searchKeyWord = this.searchkeyWord;
+      _obj.administrationType = this.search;
+      _obj.startDate = this.startDate
+      _obj.endDate = this.endDate
+      getList(_obj)
+        .then((response) => {
+          this.tableData = response.data.records;
+          for (let i = 0; i < this.tableData.length; i++) {
+            this.tableData[i].iconShow = true;
+          }
+          this.deptBudgetTotal = response.data.total;
+          this.listLoading = false;
+        })
+        .catch(() => {
+          this.listLoading = false;
+        });
+    },
+    btnChange(num) {
+      this.count = num;
+      if (num == 1) {
+        this.abilityName = "身份证人像面";
+        this.abilityName1 = "身份证国徽面";
         this.img[0] = this.file.cardAddressUrl;
         this.img[1] = this.file.cardBackAddressUrl;
-        this.fujianInfo = true;
-      },
-      fujianClose() {
-        this.count = 1;
-        this.fujianInfo = false;
-      },
-      searchBtn(num) {
-        this.search = num;
-        this.getList();
-      },
-      find() {
-        this.currentPage = 1
-        this.getList();
-      },
-      selectInit(row) {
-        if (row.escalationStatus != '未上报'&& row.escalationStatus != '未通过') {  
-          return false;
-        }else{
-          return true;
-        }
-      },
-      handleSizeChange(val) {
-        console.log(`每页 ${val} 条`);
-        this.pageSize = val;
-        this.getList();
-      },
-      handleCurrentChange(val) {
-        this.currentPage = val;
-        console.log(`当前页: ${val}`);
-        this.getList();
-      },
+      } else if (num == 2) {
+        this.abilityName = "驾驶证主页";
+        this.abilityName1 = "驾驶证副页";
+        this.img[0] = this.file.driverLicenseHomePage;
+        this.img[1] = this.file.driverLicenseBackPage;
+      } else if (num == 3) {
+        this.abilityName = "行驶证主页";
+        this.abilityName1 = "行驶证副页";
+        this.img[0] = this.file.drivingLicenseHomePage;
+        this.img[1] = this.file.drivingLicenseBackPage;
+      } else if (num == 4) {
+        this.index = 0;
+        this.img[0] = this.file.qualificationCertificate;
+      } else if (num == 5) {
+        this.abilityName = "挂车行驶证主页";
+        this.abilityName1 = "挂车行驶证副页";
+        this.img[0] = this.file.trailerLicenseHomePage;
+        this.img[1] = this.file.trailerLicenseBackPage;
+      } else if (num == 6) {
+        this.index = 0;
+        this.img[0] = this.file.operationCertificate;
+      } else if (num == 7) {
+        this.index = 0;
+        this.img[0] = this.file.trailerOperationCertificate;
+      }
+    },
+    fujianLook(row) {
+      this.file = row;
+      this.index = 0;
+      this.img[0] = this.file.cardAddressUrl;
+      this.img[1] = this.file.cardBackAddressUrl;
+      this.fujianInfo = true;
+    },
+    fujianClose() {
+      this.count = 1;
+      this.fujianInfo = false;
+    },
+    searchBtn(num) {
+      this.search = num;
+      this.getList();
+    },
+    find() {
+      this.currentPage = 1
+      this.getList();
+    },
+    selectInit(row) {
+      if (row.escalationStatus != '未上报' && row.escalationStatus != '未通过') {
+        return false;
+      } else {
+        return true;
+      }
+    },
+    handleSizeChange(val) {
+      console.log(`每页 ${val} 条`);
+      this.pageSize = val;
+      this.getList();
+    },
+    handleCurrentChange(val) {
+      this.currentPage = val;
+      console.log(`当前页: ${val}`);
+      this.getList();
     },
-  };
+  },
+};
 </script>
 <style lang="scss" scoped>
-  .center {
-    padding: 10px 20px;
-    background: #f5f6f7;
-    height: calc(100vh - 5vh);
-
-    .top_css {
-      padding: 10px;
-
-      .search_btn {
-        height: 80px;
-        background: linear-gradient(#fafbfb, #ffffff);
-        display: flex;
-        margin-top: 20px;
-
-        .search_block {
-          margin-left: 20px;
-        }
-
-        .search_item {
-          text-align: center;
-          font-size: 14px;
-          font-weight: 600;
-          line-height: 40px;
-          width: 112px;
-          height: 40px;
-          background: #f7f8f9;
-          cursor: pointer;
-          margin-top: 30px;
-        }
-
-        .searchNo {
-          color: #323233;
-        }
-
-        .search {
-          color: #2f53eb;
-          background: #ffffff;
-        }
-      }
-    }
-
-    .ask_css {
-      position: absolute;
-      margin: 3px 0 0 10px;
-    }
+.center {
+  padding: 10px 20px;
+  background: #f5f6f7;
+  height: calc(100vh - 5vh);
 
-    .center_css {
-      background: #ffffff;
-      border-radius: 1px;
-      margin-top: 10px;
-      padding-bottom: 10px;
-    }
+  .top_css {
+    padding: 10px;
 
-    .screen {
-      // float: right;
+    .search_btn {
+      height: 80px;
+      background: linear-gradient(#fafbfb, #ffffff);
       display: flex;
+      margin-top: 20px;
 
-      .search {
-        width: 40px;
-        height: 40px;
-        background: #2f53eb;
-        border-radius: 0px 2px 2px 0px;
-        border: 1px solid #DCDFE6;
-        margin-left: -1px;
+      .search_block {
+        margin-left: 20px;
       }
 
-      .count_css {
-        width: 80px;
+      .search_item {
         text-align: center;
+        font-size: 14px;
+        font-weight: 600;
         line-height: 40px;
-        color: #666666;
-      }
-    }
-
-    .el-button {
-      padding: 10px 20px !important;
-    }
-
-    .center_css {
-
-      ::v-deep .el-table th,
-      ::v-deep .el-table td {
-        text-align: center;
+        width: 112px;
+        height: 40px;
+        background: #f7f8f9;
+        cursor: pointer;
+        margin-top: 30px;
       }
 
-      .fujian {
-        font-size: 24px;
-        color: #409eff;
+      .searchNo {
+        color: #323233;
       }
 
-      .warning {
-        font-size: 14px;
-        color: #ed1d1d;
+      .search {
+        color: #2f53eb;
+        background: #ffffff;
       }
     }
   }
 
-  ::v-deep .el-table--border .el-table__header th {
-    background: #f7f8f9;
+  .ask_css {
+    position: absolute;
+    margin: 3px 0 0 10px;
   }
 
-  .btn_css {
-    color: #409eff;
-    cursor: pointer;
+  .center_css {
+    background: #ffffff;
+    border-radius: 1px;
+    margin-top: 10px;
+    padding-bottom: 10px;
   }
 
-  .btn_css1 {
-    margin-left: -20px;
-  }
+  .screen {
+    // float: right;
+    display: flex;
 
-  //批量上报按钮
-  .batch_btn {
-    margin: 0 10px;
-  }
+    .search {
+      width: 40px;
+      height: 40px;
+      background: #2f53eb;
+      border-radius: 0px 2px 2px 0px;
+      border: 1px solid #DCDFE6;
+      margin-left: -1px;
+    }
 
-  //附件
-  .file {
-    .fujian_css {
-      width: 270px;
-      display: flex;
-      margin: 0 auto;
+    .count_css {
+      width: 80px;
       text-align: center;
-      line-height: 32px;
-      border: 1px solid #f0f1f2;
-      border-right: 0px;
-      border-radius: 2px 0px 0px 2px;
+      line-height: 40px;
+      color: #666666;
+    }
+  }
 
-      .fujian_item {
-        cursor: pointer;
-        width: 90px;
-        height: 32px;
-        border-right: 1px solid #f0f1f2;
-      }
+  .el-button {
+    padding: 10px 20px !important;
+  }
 
-      .file_btn {
-        color: #2f53eb;
-        background-color: #cfdbfe;
-      }
+  .center_css {
+
+    ::v-deep .el-table th,
+    ::v-deep .el-table td {
+      text-align: center;
     }
 
-    .file_tips {
-      margin: 10px auto;
-      width: 50%;
+    .fujian {
+      font-size: 24px;
+      color: #409eff;
     }
 
-    .file_img {
-      width: 525px;
-      height: 332px;
-      margin: 20px auto;
+    .warning {
+      font-size: 14px;
+      color: #ed1d1d;
     }
+  }
+}
+
+::v-deep .el-table--border .el-table__header th {
+  background: #f7f8f9;
+}
+
+.btn_css {
+  color: #409eff;
+  cursor: pointer;
+}
 
-    .img_css {
-      width: 525px;
-      height: 332px;
+.btn_css1 {
+  margin-left: -20px;
+}
+
+//批量上报按钮
+.batch_btn {
+  margin: 0 10px;
+}
+
+//附件
+.file {
+  .fujian_css {
+    width: 270px;
+    display: flex;
+    margin: 0 auto;
+    text-align: center;
+    line-height: 32px;
+    border: 1px solid #f0f1f2;
+    border-right: 0px;
+    border-radius: 2px 0px 0px 2px;
+
+    .fujian_item {
+      cursor: pointer;
+      width: 90px;
+      height: 32px;
+      border-right: 1px solid #f0f1f2;
     }
 
-    .btn {
-      width: 410px;
-      margin: 0 auto;
+    .file_btn {
+      color: #2f53eb;
+      background-color: #cfdbfe;
     }
   }
-  .right_css{
-    .title_name,.right_title{
-      color: #9D9D9D;
-      margin-left: 20px;
-    }
-    .right_item{
-       color: #333333;
-       margin: 10px 0;
-        margin-left: 20px;
-    }
-    .img_css{
-      width: 100px;
-      height: 100px;
-      margin: 10px 0;
-      margin-left: 20px;
-    }
+
+  .file_tips {
+    margin: 10px auto;
+    width: 50%;
+  }
+
+  .file_img {
+    width: 525px;
+    height: 332px;
+    margin: 20px auto;
+  }
+
+  .img_css {
+    width: 525px;
+    height: 332px;
+  }
+
+  .btn {
+    width: 410px;
+    margin: 0 auto;
   }
-  ::v-deep .el-drawer.rtl{
-    overflow-y: scroll;
+}
+
+.right_css {
+
+  .title_name,
+  .right_title {
+    color: #9D9D9D;
+    margin-left: 20px;
   }
-  .red_text{
-    color: red;
+
+  .right_item {
+    color: #333333;
+    margin: 10px 0;
+    margin-left: 20px;
   }
+
+  .img_css {
+    width: 100px;
+    height: 100px;
+    margin: 10px 0;
+    margin-left: 20px;
+  }
+}
+
+::v-deep .el-drawer.rtl {
+  overflow-y: scroll;
+}
+
+.red_text {
+  color: red;
+}
 </style>

src/views/administrationManagement/vehicleInformationReporting.vue

@@ -72,11 +72,7 @@
             <span :class="scope.row.operationOverdueFlag == 1?'red_text':''">{{scope.row.operationCertificateValidityDate}}</span>
           </template>
         </el-table-column>
-        <el-table-column prop="updateDate" label="上报时间" min-width="156">
-          <template slot-scope="scope">
-            <span v-if="scope.row.escalationStatus&&scope.row.escalationStatus != '未认证' && scope.row.escalationStatus != '待上报'">{{scope.row.updateDate}}</span><!-- 未认证和待上报不显示时间 -->
-          </template>
-        </el-table-column>
+        <el-table-column prop="reportedDate" label="上报时间" min-width="156"></el-table-column>
         <el-table-column prop="paymentDate" label="附件">
           <template slot-scope="scope" style="text-align: center" v-if="scope.row.backStageStatus !='未认证'">
             <span class="btn_css btn_css1" @click="fujianLook(scope.row)">查看</span>
@@ -313,8 +309,11 @@
                 type: "success",
               });
               that.musterList = []
-              that.getList();
+              setTimeout(function () { that.getList(); }, 2000);//两秒后调用接口查看列表接口，解决上报成功后 后台状态没有及时更改
             }
+          }) .catch(() => {
+            that.musterList = []
+            that.listLoading = false
           })
         })
       },
@@ -359,6 +358,7 @@
 
       getList() {
         this.listLoading = true;
+        this.musterList = []
         let _obj = {};
         _obj.currentPage = this.currentPage;
         _obj.pageSize = this.pageSize;

src/views/orderManagement/orderAudit.vue

@@ -12,10 +12,11 @@
           </el-col>
           <el-col :span="10">
             <div class="screen">
-              <el-input class='find' placeholder="可按订单编号、姓名、账号查找" @keyup.enter.native="find" v-model="searchkeyWord" clearable @change="find"></el-input>
+              <el-input class='find' placeholder="可按订单编号、姓名、账号查找" @keyup.enter.native="find" v-model="searchkeyWord"
+                clearable @change="find"></el-input>
               <el-button class="search" @click="find"><img width="16" height="16" style="margin-left: -8px"
-                  src="../../../public/img/sousuo.png" /></el-button><span
-                class="count_css">共{{ deptBudgetTotal }}条</span>
+                  src="../../../public/img/sousuo.png" /></el-button><span class="count_css">共{{ deptBudgetTotal
+                  }}条</span>
             </div>
           </el-col>
         </el-row>
@@ -57,19 +58,19 @@
         </el-table-column>
         <el-table-column fixed="left" prop="orderNo" label="订单编号" min-width="182">
           <template scope="scope">
-            <div>{{scope.row.orderNo}} <span class="pad_css" v-if="scope.row.freightAdvance == '垫付'">垫</span></div>
+            <div>{{ scope.row.orderNo }} <span class="pad_css" v-if="scope.row.freightAdvance == '垫付'">垫</span></div>
           </template>
         </el-table-column>
         <el-table-column min-width="160" prop="cargoOwner" label="货主">
           <template scope="scope">
-            <div>{{scope.row.cargoOwner}} </div>
-            <div>（{{scope.row.cargoOwnerPhone}}）</div>
+            <div>{{ scope.row.cargoOwner }} </div>
+            <div>（{{ scope.row.cargoOwnerPhone }}）</div>
           </template>
         </el-table-column>
         <el-table-column min-width="160" prop="driverName" label="司机">
           <template scope="scope">
-            <div>{{scope.row.driverName}} </div>
-            <div>（{{scope.row.driverPhone}}）</div>
+            <div>{{ scope.row.driverName }} </div>
+            <div>（{{ scope.row.driverPhone }}）</div>
           </template>
         </el-table-column>
         <!-- <el-table-column prop="freight" label="运费(元)">
@@ -92,7 +93,7 @@
           <el-table-column prop="ownerServiceCharge" label="工本费(元)"></el-table-column>
           <el-table-column prop="overdueFee" label="超期费(元)">
             <template slot-scope="scope">
-              <span class="btn_css" @click="costLook(scope.row)">{{scope.row.overdueFee }}</span>
+              <span class="btn_css" @click="costLook(scope.row)">{{ scope.row.overdueFee }}</span>
             </template>
           </el-table-column>
           <el-table-column prop="receivable" label="应收(元)"></el-table-column>
@@ -101,8 +102,9 @@
         <el-table-column prop="invoicing" label="发票"></el-table-column>
         <el-table-column prop="driverContractUrl" label="合同">
           <template scope="scope">
-          <span @click="contract(scope.row)" class="btn_css" v-if="scope.row.orderStatusKey>3 && scope.row.cargoOwnerStatus != '已终止'">查看</span>
-         </template>
+            <span @click="contract(scope.row)" class="btn_css"
+              v-if="scope.row.orderStatusKey > 3 && scope.row.cargoOwnerStatus != '已终止'">查看</span>
+          </template>
         </el-table-column>
         <el-table-column prop="updateDate" label="更新时间" min-width="160"></el-table-column>
         <!-- <el-table-column prop="cargoOwnerStatus" label="状态" min-width="92">
@@ -113,15 +115,12 @@
         </el-table-column> -->
         <el-table-column prop="cargoOwnerStatus" label="状态" min-width="92">
           <template slot-scope="scope">
-            <span>{{scope.row.cargoOwnerStatus}}</span>
-            <el-popover
-              v-if='scope.row.terminator==1||scope.row.terminator==2'
-              placement="top-start"
-              :title="scope.row.terminator==1?'司机终止订单':'货主终止订单'"
-              width="200"
-              trigger="hover">
+            <span>{{ scope.row.cargoOwnerStatus }}</span>
+            <el-popover v-if='scope.row.terminator == 1 || scope.row.terminator == 2' placement="top-start"
+              :title="scope.row.terminator == 1 ? '司机终止订单' : '货主终止订单'" width="200" trigger="hover">
               <div v-html='scope.row.content'></div>
-              <i v-if='scope.row.cargoOwnerStatus=="已终止"&&scope.row.terminator' slot="reference" class="el-icon-question"></i>
+              <i v-if='scope.row.cargoOwnerStatus == "已终止" && scope.row.terminator' slot="reference"
+                class="el-icon-question"></i>
             </el-popover>
           </template>
         </el-table-column>
@@ -151,7 +150,7 @@
                 </el-dropdown-item>
                 <el-dropdown-item>
                   <el-link target="_blank" @click="see(scope.row)" type="primary" :underline="false"
-                    :disabled="scope.row.freightAdvance =='非垫付' && scope.row.cargoOwnerStatusKey != 29">完结</el-link>
+                    :disabled="scope.row.freightAdvance == '非垫付' && scope.row.cargoOwnerStatusKey != 29">完结</el-link>
                   <!-- 完结：支付完尾款后从未进行过完结操作前显示的操作。 -->
                 </el-dropdown-item>
                 <el-dropdown-item>
@@ -169,7 +168,8 @@
                   <!-- 垫付类型的订单，平台确认卸车后从未进行过尾款操作（即尾款=0）时显示的按钮。 -->
                 </el-dropdown-item>
                 <el-dropdown-item>
-                  <el-link :disabled="scope.row.orderStatus != '运输中'&&scope.row.orderStatus != '已完结'" target="_blank" type="primary" :underline="false" @click="toMapPage(scope.row)">轨迹</el-link>
+                  <el-link :disabled="scope.row.orderStatus != '运输中' && scope.row.orderStatus != '已完结'" target="_blank"
+                    type="primary" :underline="false" @click="toMapPage(scope.row)">轨迹</el-link>
                 </el-dropdown-item>
               </el-dropdown-menu>
             </el-dropdown>
@@ -181,7 +181,8 @@
       style="text-align: center; margin-top: 10px" :page-size="deptCircularPage.pageSize"
       layout="total, sizes, prev, pager, next, jumper" :total="deptBudgetTotal">
     </el-pagination>
-    <el-dialog :close-on-click-modal='false' title="超期费用" :visible.sync="costInfo" width="500px" :before-close="costClose">
+    <el-dialog :close-on-click-modal='false' title="超期费用" :visible.sync="costInfo" width="500px"
+      :before-close="costClose">
       <div class="cost_css">
         <div class="cost_item">
           <div class="cost_title">起计日期</div>
@@ -193,24 +194,25 @@
         </div>
         <div class="cost_item">
           <div class="cost_title">超期费率</div>
-          <div class="cost_value">{{costData.interestRate}}</div>
+          <div class="cost_value">{{ costData.interestRate }}</div>
         </div>
         <el-divider></el-divider>
         <div class="cost_item">
           <div class="cost_title">已付运费</div>
-          <div class="cost_value">{{costData.interestRate}}</div>
+          <div class="cost_value">{{ costData.interestRate }}</div>
         </div>
         <div class="cost_item">
           <div class="cost_title">超期费用</div>
-          <div class="cost_value">{{costData.interestRate}}</div>
+          <div class="cost_value">{{ costData.interestRate }}</div>
         </div>
         <div class="right_btn">
           <el-button @click="costInfo = false" type="primary">关闭</el-button>
         </div>
       </div>
     </el-dialog>
-    <el-dialog :close-on-click-modal='false' title="账户信息" :visible.sync="userInfo" width="500px" :before-close="userClose">
-      <div class="user" v-for="(item,index) in 2" :key="index">
+    <el-dialog :close-on-click-modal='false' title="账户信息" :visible.sync="userInfo" width="500px"
+      :before-close="userClose">
+      <div class="user" v-for="(item, index) in 2" :key="index">
         <div class="user_id">
           <div class="id_css">12121212121212121212</div>
           <div class="name_css">张三</div>
@@ -224,86 +226,94 @@
       <div class="right_css">
         <div style='height:80vh;overflow-y:scroll;'>
           <div class="title_name">基本信息</div>
-          <div class="right_item">订单编号：{{costData.orderNo}}</div>
+          <div class="right_item">订单编号：{{ costData.orderNo }}</div>
           <div class="right_title">货主</div>
-          <div class="right_item">{{costData.cargoOwner}}</div>
+          <div class="right_item">{{ costData.cargoOwner }}</div>
           <div class="right_title">司机</div>
-          <div class="right_item">{{costData.driverName}}</div>
+          <div class="right_item">{{ costData.driverName }}</div>
           <div class="right_title">发货单位</div>
-          <div class="right_item">{{costData.compName}}</div>
+          <div class="right_item">{{ costData.compName }}</div>
           <div class="right_title">发货地</div>
           <div class="right_item">
-            {{costData.sendPrivate}}{{costData.sendCity}}{{costData.sendArea}}{{costData.sendDetailedAddress}}
+            {{ costData.sendPrivate }}{{ costData.sendCity }}{{ costData.sendArea }}{{ costData.sendDetailedAddress }}
           </div>
           <div class="right_title">卸货地</div>
           <div class="right_item">
-            {{costData.unloadPrivate}}{{costData.unloadCity}}{{costData.unloadArea}}{{costData.unloadDetailedAddress}}
+            {{ costData.unloadPrivate }}{{ costData.unloadCity }}{{ costData.unloadArea }}{{
+                costData.unloadDetailedAddress
+            }}
           </div>
           <div class="right_title">货物类别</div>
-          <div class="right_item">{{costData.goodsType}}</div>
+          <div class="right_item">{{ costData.goodsType }}</div>
           <div class="right_title">货名</div>
-          <div class="right_item">{{costData.goodsName}}</div>
+          <div class="right_item">{{ costData.goodsName }}</div>
           <div class="right_title">发货联系人</div>
-          <div class="right_item">{{costData.publishTaskInfo.sender}}</div>
+          <div class="right_item">{{ costData.publishTaskInfo.sender }}</div>
           <div class="right_title">发货联系人电话</div>
-          <div class="right_item">{{costData.publishTaskInfo.senderPhone}}</div>
+          <div class="right_item">{{ costData.publishTaskInfo.senderPhone }}</div>
 
           <div class="right_title">收货联系人</div>
-          <div class="right_item">{{costData.publishTaskInfo.receiver}}</div>
+          <div class="right_item">{{ costData.publishTaskInfo.receiver }}</div>
           <div class="right_title">收货联系人电话</div>
-          <div class="right_item">{{costData.publishTaskInfo.receiverPhone}}</div>
+          <div class="right_item">{{ costData.publishTaskInfo.receiverPhone }}</div>
           <div class="right_title">收货人身份证号</div>
-          <div class="right_item">{{costData.publishTaskInfo.receiverIdcard}}</div>
-            <div class="right_title">收货方信用代码（选填）</div>
-          <div class="right_item">{{costData.publishTaskInfo.receiverCreditCode?costData.publishTaskInfo.receiverCreditCode:'暂无'}}</div>
+          <div class="right_item">{{ costData.publishTaskInfo.receiverIdcard }}</div>
+          <div class="right_title">收货方信用代码（选填）</div>
+          <div class="right_item">
+            {{ costData.publishTaskInfo.receiverCreditCode ? costData.publishTaskInfo.receiverCreditCode : '暂无' }}</div>
 
 
           <div class="right_title">距离</div>
-          <div class="right_item">约{{costData.distance ? costData.distance : 0}}km</div>
+          <div class="right_item">约{{ costData.distance ? costData.distance : 0 }}km</div>
           <div class="right_title">运费</div>
-          <div class="right_item">{{costData.freight}}</div>
+          <div class="right_item">{{ costData.freight }}</div>
           <el-divider v-if="costData.hyCarrierInfo"></el-divider>
           <div v-if="costData.hyCarrierInfo">
             <div class="title_name">承运信息</div>
             <div class="right_title">承运合同编号</div>
-            <div class="right_item">{{costData.contractNo}}</div>
+            <div class="right_item">{{ costData.contractNo }}</div>
             <div class="right_title">委托合同编号</div>
-            <div class="right_item">{{costData.wtContractNo}}</div>
+            <div class="right_item">{{ costData.wtContractNo }}</div>
             <div class="right_title">车牌号</div>
-            <div class="right_item">{{costData.hyCarrierInfo.carNo}}</div>
+            <div class="right_item">{{ costData.hyCarrierInfo.carNo }}</div>
             <div class="right_title" v-if="costData.hyCarrierInfo.loadingWeight">装车净重(吨)</div>
-            <div class="right_item"  v-if="costData.hyCarrierInfo.loadingWeight">{{costData.hyCarrierInfo.loadingWeight}}</div>
+            <div class="right_item" v-if="costData.hyCarrierInfo.loadingWeight">{{ costData.hyCarrierInfo.loadingWeight
+            }}
+            </div>
             <div class="right_title" v-if="costData.hyCarrierInfo.unloadingWeight">卸车净重(吨)</div>
-            <div class="right_item"  v-if="costData.hyCarrierInfo.unloadingWeight">{{costData.hyCarrierInfo.unloadingWeight}}</div>
+            <div class="right_item" v-if="costData.hyCarrierInfo.unloadingWeight">
+              {{ costData.hyCarrierInfo.unloadingWeight }}</div>
             <div class="right_title">预计运费</div>
-            <div class="right_item">{{costData.hyCarrierInfo.estimatedFreight}}</div>
+            <div class="right_item">{{ costData.hyCarrierInfo.estimatedFreight }}</div>
             <div class="right_title">装车时间</div>
-            <div class="right_item">{{costData.hyCarrierInfo.loadingDate}}</div>
+            <div class="right_item">{{ costData.hyCarrierInfo.loadingDate }}</div>
             <div class="right_title">运输时长</div>
-            <div class="right_item">{{costData.hyCarrierInfo.transportationDuration}}</div>
+            <div class="right_item">{{ costData.hyCarrierInfo.transportationDuration }}</div>
             <div class="right_title" v-if="costData.hyCarrierInfo.loadingCity">装车定位</div>
-            <div class="right_item">{{costData.hyCarrierInfo.loadingCity}}{{costData.hyCarrierInfo.loadingArea}}</div>
+            <div class="right_item">{{ costData.hyCarrierInfo.loadingCity }}{{ costData.hyCarrierInfo.loadingArea }}
+            </div>
             <div class="right_title">装车照片</div>
             <div style="display: flex;" v-if="costData.hyCarrierInfo.loadingImg">
-              <div v-for="(item,index) in costData.hyCarrierInfo.loadingImg.split(',')" :key="index">
+              <div v-for="(item, index) in costData.hyCarrierInfo.loadingImg.split(',')" :key="index">
                 <img :src="item" class="img_css" @click="enlarge(item)">
               </div>
             </div>
             <div class="right_title" v-if="costData.hyCarrierInfo.totalFreight">合计应付运费</div>
-            <div class="right_item">{{costData.hyCarrierInfo.totalFreight}}</div>
+            <div class="right_item">{{ costData.hyCarrierInfo.totalFreight }}</div>
             <div class="right_title" v-if="costData.hyCarrierInfo.unloadingDate">卸车时间</div>
-            <div class="right_item">{{costData.hyCarrierInfo.unloadingDate}}</div>
+            <div class="right_item">{{ costData.hyCarrierInfo.unloadingDate }}</div>
             <div class="right_title" v-if="costData.hyCarrierInfo.unloadingCity">卸车定位</div>
-            <div class="right_item">{{costData.hyCarrierInfo.unloadingCity}}{{costData.hyCarrierInfo.unloadingArea}}</div>
+            <div class="right_item">{{ costData.hyCarrierInfo.unloadingCity }}{{ costData.hyCarrierInfo.unloadingArea }}
+            </div>
             <div class="right_title" v-if="costData.hyCarrierInfo.unloadingImg">卸车照片</div>
             <div style="display: flex;" v-if="costData.hyCarrierInfo.unloadingImg">
-              <div v-for="(item,index) in costData.hyCarrierInfo.unloadingImg.split(',')" :key="index">
+              <div v-for="(item, index) in costData.hyCarrierInfo.unloadingImg.split(',')" :key="index">
                 <img :src="item" class="img_css" @click="enlarge(item)">
               </div>
             </div>
             <div class="right_title" v-if="costData.hyCarrierInfo.receiptImg">回单照片</div>
             <div style="display: flex;" v-if="costData.hyCarrierInfo.receiptImg">
-              <div v-for="(item,index) in costData.hyCarrierInfo.receiptImg.split(',')" :key="index">
+              <div v-for="(item, index) in costData.hyCarrierInfo.receiptImg.split(',')" :key="index">
                 <img :src="item" class="img_css" @click="enlarge(item)">
               </div>
             </div>
@@ -312,27 +322,37 @@
           <div v-if="costData.freightInfo">
             <div class="title_name">运费信息（单位：元）</div>
             <div class="right_title">预付运费</div>
-            <div class="right_item">{{costData.freightInfo.prepaidFreight}} <span
-                style="margin-left: 100px;">{{costData.freightInfo.prepaidFreightDate}}</span></div>
+            <div class="right_item">{{ costData.freightInfo.prepaidFreight }} <span style="margin-left: 100px;">{{
+                costData.freightInfo.prepaidFreightDate
+            }}</span></div>
             <div class="right_title">运费尾款</div>
-            <div class="right_item">{{costData.freightInfo.freightBalance?costData.freightInfo.freightBalance:'未支付'}}
-              <span style="margin-left: 100px;">{{costData.freightInfo.freightBalanceDate}}</span></div>
+            <div class="right_item">{{ costData.freightInfo.freightBalance ? costData.freightInfo.freightBalance : '未支付'
+            }}
+              <span style="margin-left: 100px;">{{ costData.freightInfo.freightBalanceDate }}</span>
+            </div>
             <div class="right_title" v-if="costData.freightInfo.freightBalance">明细</div>
             <div class="right_item" v-if="costData.freightInfo.freightBalance">
-              预付{{costData.freightInfo.prepaidFreight ? costData.freightInfo.prepaidFreight : 0}}元，服务费{{costData.freightInfo.driverServiceCharge ? costData.freightInfo.driverServiceCharge:0}}元，尾款{{costData.freightInfo.freightBalance ? costData.freightInfo.freightBalance:0}}元，合计收款{{costData.freightInfo.totalCollection ? costData.freightInfo.totalCollection:0}}元。
+              预付{{ costData.freightInfo.prepaidFreight ? costData.freightInfo.prepaidFreight :
+                  0
+              }}元，服务费{{ costData.freightInfo.driverServiceCharge ? costData.freightInfo.driverServiceCharge : 0
+              }}元，尾款{{ costData.freightInfo.freightBalance ?
+                  costData.freightInfo.freightBalance : 0
+              }}元，合计收款{{ costData.freightInfo.totalCollection ?
+                  costData.freightInfo.totalCollection : 0
+              }}元。
             </div>
           </div>
           <el-divider v-if="costData.repaymentInfo"></el-divider>
           <div v-if="costData.repaymentInfo">
             <div class="title_name">还款信息</div>
             <div class="right_title">运费</div>
-            <div class="right_item">{{costData.freight}}</div>
+            <div class="right_item">{{ costData.freight }}</div>
             <div class="right_title">超期费（每天3%）</div>
-            <div class="right_item">{{costData.repaymentInfo.overdueFee}}</div>
+            <div class="right_item">{{ costData.repaymentInfo.overdueFee }}</div>
             <div class="right_title">合计应还</div>
-            <div class="right_item">{{costData.repaymentInfo.totalRepayable}}</div>
+            <div class="right_item">{{ costData.repaymentInfo.totalRepayable }}</div>
             <div class="right_title">还款（尾号6666）</div>
-            <div class="right_item">{{costData.repaymentInfo.alreadyRepaid}}</div>
+            <div class="right_item">{{ costData.repaymentInfo.alreadyRepaid }}</div>
           </div>
         </div>
         <div class="right_btn">
@@ -349,596 +369,619 @@
   </div>
 </template>
 <script>
-  import {
-    getListData,
-    getData,
-    auditData,
-    endData,
-    editEndData,
-    batchData,
-    preMoney,
-    tailMoney
-  } from '@/api/orderManagement'
-  export default {
-    components: {
-      "el-image-viewer": () =>
-        import("element-ui/packages/image/src/image-viewer"),
-    },
-    data() {
-      return {
-        tableData: [],
-        //分页
-        searchkeyWord: "",
-        currentPage: 1,
-        pageSize: 10,
-        deptBudgetTotal: 0,
-        deptCircularPage: {},
-        search: "",
-        addressUrl: [],
-        disabled: false,
-        costInfo: false,
-        userInfo: false,
-        rejectInfo: false,
-        startDate: "",
-        endDate: "",
-        form: {
-          checkList: [],
-          textarea: "",
-        },
-        value1: "",
-        costData: {
-          publishTaskInfo:{}
-        },
-        rightSee: false,
-        modification: [],
-        //图片预览
-        srcList: [],
-        imgsVisible: false,
-      };
-    },
-    mounted() {
-      this.getList()
-    },
-    methods: {
-      //预付
-      preMoneyChange(val){
-        this.$confirm('垫付预付款'+val.advanceCharge+'元?', '提示', {
-            confirmButtonText: '确定',
-            cancelButtonText: '取消',
-            type: 'warning',
-          })
-          .then(() => {
-            this.listLoading = true
-            preMoney({
-                id: val.freightId,
-                prepaidFreight:val.advanceCharge
-              }).then(response => {
-                 this.$notify({
-                  title: '成功',
-                  message: '操作成功！',
-                  type: 'success'
-                });
-                this.getList()
-                this.listLoading = false
-              })
-              .catch(() => {
-                this.listLoading = false
-              })
-          })
+import {
+  getListData,
+  getData,
+  auditData,
+  endData,
+  editEndData,
+  batchData,
+  preMoney,
+  tailMoney
+} from '@/api/orderManagement'
+export default {
+  components: {
+    "el-image-viewer": () =>
+      import("element-ui/packages/image/src/image-viewer"),
+  },
+  data() {
+    return {
+      tableData: [],
+      //分页
+      searchkeyWord: "",
+      currentPage: 1,
+      pageSize: 10,
+      deptBudgetTotal: 0,
+      deptCircularPage: {},
+      search: "",
+      addressUrl: [],
+      disabled: false,
+      costInfo: false,
+      userInfo: false,
+      rejectInfo: false,
+      startDate: "",
+      endDate: "",
+      form: {
+        checkList: [],
+        textarea: "",
+      },
+      value1: [],
+      costData: {
+        publishTaskInfo: {}
       },
-      //尾款
-      tailmoneyChange(val){
-        // 合计运费-预付款-司机服务费=尾款
-        let money = Number(val.actualFreight) - Number(val.prepaidFreight) - Number(val.driverServiceCharge)
-        this.$confirm('确定垫付尾款：'+ money+'元？', '提示', {
-            confirmButtonText: '确定',
-            cancelButtonText: '取消',
-            type: 'warning',
+      rightSee: false,
+      modification: [],
+      //图片预览
+      srcList: [],
+      imgsVisible: false,
+    };
+  },
+  mounted() {
+    this.getDate()
+    this.getList()
+  },
+  methods: {
+    getDate() {//获取默认时间
+      let date = new Date()
+      let date1 = new Date().setTime(date.getTime() - 3 * 60 * 60 * 24 * 1000) //三天前的时间蹉
+      date1 = new Date(parseInt(date1)).toLocaleString().split(" ")[0].replaceAll("/", "-")
+      let nian = date1.split("-")[0]
+      let yue = date1.split("-")[1]
+      if (yue < 10) {
+        yue = "0" + yue
+      }
+      let ri = date1.split("-")[2]
+      if (ri < 10) {
+        ri = "0" + ri
+      }
+      this.startDate = nian + "-" + yue + "-" + ri //三天前的時間
+      this.endDate = date.getFullYear() + "-" + (date.getMonth() + 1 < 10 ? "0" + (date.getMonth() + 1) : date
+        .getMonth() + 1) + "-" + (date.getDate() < 10 ? "0" + date.getDate() : date.getDate()) //當前時間
+      this.value1.push(this.startDate)
+      this.value1.push(this.endDate)
+    },
+    //预付
+    preMoneyChange(val) {
+      this.$confirm('垫付预付款' + val.advanceCharge + '元?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning',
+      })
+        .then(() => {
+          this.listLoading = true
+          preMoney({
+            id: val.freightId,
+            prepaidFreight: val.advanceCharge
+          }).then(response => {
+            this.$notify({
+              title: '成功',
+              message: '操作成功！',
+              type: 'success'
+            });
+            this.getList()
+            this.listLoading = false
           })
-          .then(() => {
-            this.listLoading = true
-            tailMoney({
-                id: val.freightId,
-                freightBalance:money
-              }).then(response => {
-                 this.$notify({
-                  title: '成功',
-                  message: '操作成功！',
-                  type: 'success'
-                });
-                this.getList()
-                this.listLoading = false
-              })
-              .catch(() => {
-                this.listLoading = false
-              })
+            .catch(() => {
+              this.listLoading = false
+            })
+        })
+    },
+    //尾款
+    tailmoneyChange(val) {
+      // 合计运费-预付款-司机服务费=尾款
+      let money = Number(val.actualFreight) - Number(val.prepaidFreight) - Number(val.driverServiceCharge)
+      this.$confirm('确定垫付尾款：' + money + '元？', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning',
+      })
+        .then(() => {
+          this.listLoading = true
+          tailMoney({
+            id: val.freightId,
+            freightBalance: money
+          }).then(response => {
+            this.$notify({
+              title: '成功',
+              message: '操作成功！',
+              type: 'success'
+            });
+            this.getList()
+            this.listLoading = false
           })
-
-      },
-      closeImgViewer() {
-        this.srcList = []
-        this.imgsVisible = false;
-      },
-      enlarge(url) {
-        this.imgsVisible = true;
-        this.srcList.push(url)
-      },
-      toMapPage(row) {
-        this.$router.push({
-          path: 'trajectory',
-          query: {
-            id: row.id,
-            orderNo:row.orderNo,
-            sendPrivate:row.sendPrivate,
-            sendCity:row.sendCity,
-            sendArea:row.sendArea,
-            sendDetailedAddress:row.sendDetailedAddress,
-            unloadPrivate:row.unloadPrivate,
-            unloadCity:row.unloadCity,
-            unloadArea:row.unloadArea,
-            unloadDetailedAddress:row.unloadDetailedAddress,
-            orderStatus:row.orderStatus
-          }
+            .catch(() => {
+              this.listLoading = false
+            })
         })
-      },
-      getList() {
-        this.loading = true
-        let _obj = {}
-        _obj.currentPage = this.currentPage
-        _obj.pageSize = this.pageSize
-        _obj.searchKeyWord = this.searchkeyWord
-        _obj.searchType = this.search
-        _obj.startDate = this.startDate
-        _obj.endDate = this.endDate
-        getListData(_obj).then(response => {
-          if(response.data.records){
-            for (let i = 0; i < response.data.records.length; i++) {
-              if(response.data.records[i].cargoOwnerStatus=='已终止'){
-                if(response.data.records[i].terminator==1){
-                  if(response.data.records[i].terminationReason==1){
-                    response.data.records[i].content='原因：已与货主协商<br/>描述：'+response.data.records[i].terminationReasonDescription
-                  }else if(response.data.records[i].terminationReason==2){
-                    response.data.records[i].content='原因：货主原因终止<br/>描述：'+response.data.records[i].terminationReasonDescription
-                  }else if(response.data.records[i].terminationReason==3){
-                    response.data.records[i].content='原因：货主个人原因终止<br/>描述：'+response.data.records[i].terminationReasonDescription
-                  }else if(response.data.records[i].terminationReason==4){
-                    response.data.records[i].content='原因：其他<br/>描述：'+response.data.records[i].terminationReasonDescription
-                  }
-                }else if(response.data.records[i].terminator==2){
-                  if(response.data.records[i].terminationReason==1){
-                    response.data.records[i].content='原因：已与司机协商<br/>描述：'+response.data.records[i].terminationReasonDescription
-                  }else if(response.data.records[i].terminationReason==2){
-                    response.data.records[i].content='原因：司机原因终止<br/>描述：'+response.data.records[i].terminationReasonDescription
-                  }else if(response.data.records[i].terminationReason==3){
-                    response.data.records[i].content='原因：司机个人原因终止<br/>描述：'+response.data.records[i].terminationReasonDescription
-                  }else if(response.data.records[i].terminationReason==4){
-                    response.data.records[i].content='原因：其他<br/>描述：'+response.data.records[i].terminationReasonDescription
-                  }
+
+    },
+    closeImgViewer() {
+      this.srcList = []
+      this.imgsVisible = false;
+    },
+    enlarge(url) {
+      this.imgsVisible = true;
+      this.srcList.push(url)
+    },
+    toMapPage(row) {
+      this.$router.push({
+        path: 'trajectory',
+        query: {
+          id: row.id,
+          orderNo: row.orderNo,
+          sendPrivate: row.sendPrivate,
+          sendCity: row.sendCity,
+          sendArea: row.sendArea,
+          sendDetailedAddress: row.sendDetailedAddress,
+          unloadPrivate: row.unloadPrivate,
+          unloadCity: row.unloadCity,
+          unloadArea: row.unloadArea,
+          unloadDetailedAddress: row.unloadDetailedAddress,
+          orderStatus: row.orderStatus
+        }
+      })
+    },
+    getList() {
+      this.loading = true
+      let _obj = {}
+      _obj.currentPage = this.currentPage
+      _obj.pageSize = this.pageSize
+      _obj.searchKeyWord = this.searchkeyWord
+      _obj.searchType = this.search
+      _obj.startDate = this.startDate
+      _obj.endDate = this.endDate
+      getListData(_obj).then(response => {
+        if (response.data.records) {
+          for (let i = 0; i < response.data.records.length; i++) {
+            if (response.data.records[i].cargoOwnerStatus == '已终止') {
+              if (response.data.records[i].terminator == 1) {
+                if (response.data.records[i].terminationReason == 1) {
+                  response.data.records[i].content = '原因：已与货主协商<br/>描述：' + response.data.records[i].terminationReasonDescription
+                } else if (response.data.records[i].terminationReason == 2) {
+                  response.data.records[i].content = '原因：货主原因终止<br/>描述：' + response.data.records[i].terminationReasonDescription
+                } else if (response.data.records[i].terminationReason == 3) {
+                  response.data.records[i].content = '原因：货主个人原因终止<br/>描述：' + response.data.records[i].terminationReasonDescription
+                } else if (response.data.records[i].terminationReason == 4) {
+                  response.data.records[i].content = '原因：其他<br/>描述：' + response.data.records[i].terminationReasonDescription
+                }
+              } else if (response.data.records[i].terminator == 2) {
+                if (response.data.records[i].terminationReason == 1) {
+                  response.data.records[i].content = '原因：已与司机协商<br/>描述：' + response.data.records[i].terminationReasonDescription
+                } else if (response.data.records[i].terminationReason == 2) {
+                  response.data.records[i].content = '原因：司机原因终止<br/>描述：' + response.data.records[i].terminationReasonDescription
+                } else if (response.data.records[i].terminationReason == 3) {
+                  response.data.records[i].content = '原因：司机个人原因终止<br/>描述：' + response.data.records[i].terminationReasonDescription
+                } else if (response.data.records[i].terminationReason == 4) {
+                  response.data.records[i].content = '原因：其他<br/>描述：' + response.data.records[i].terminationReasonDescription
                 }
-                
-                
-              }else{
-                response.data.records[i].content=''
               }
+
+
+            } else {
+              response.data.records[i].content = ''
             }
           }
-            this.tableData = response.data.records
-            this.deptBudgetTotal = response.data.total
-            this.listLoading = false
-          })
-          .catch(() => {
-            this.listLoading = false
-          })
-      },
-      //开票
-      billing() {
-        if(this.modification.length==0){
-          this.$message.error('请选择一条未开票条目！');
-        }
-        let data = {
-          orderInfoList: this.modification,
         }
-        this.listLoading = true
-        batchData(data).then(response => {
+        this.tableData = response.data.records
+        this.deptBudgetTotal = response.data.total
+        this.listLoading = false
+      })
+        .catch(() => {
+          this.listLoading = false
+        })
+    },
+    //开票
+    billing() {
+      if (this.modification.length == 0) {
+        this.$message.error('请选择一条未开票条目！');
+      }
+      let data = {
+        orderInfoList: this.modification,
+      }
+      this.listLoading = true
+      batchData(data).then(response => {
+        this.getList()
+        this.listLoading = false
+      })
+        .catch(() => {
+          this.listLoading = false
+        })
+    },
+    selectInit() {
+      return true;
+    },
+    handleRowClick() { },
+    handleSelectionChange(val) {
+      this.modification = val
+    },
+    see(row) {
+      this.loading = true
+      getData({
+        id: row.id
+      }).then(response => {
+        this.costData = response.data
+        this.rightSee = true
+        // this.deptBudgetTotal = response.data.total
+        this.listLoading = false
+      })
+        .catch(() => {
+          this.listLoading = false
+        })
+    },
+    complete() {
+      this.$confirm('确定订单已完结？', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning',
+      })
+        .then(() => {
+          this.listLoading = true
+          editEndData({
+            id: this.costData.id
+          }).then(response => {
             this.getList()
             this.listLoading = false
           })
-          .catch(() => {
-            this.listLoading = false
-          })
-      },
-      selectInit() {
-        return true;
-      },
-      handleRowClick() {},
-      handleSelectionChange(val) {
-        this.modification = val
-      },
-      see(row) {
-        this.loading = true
-        getData({
-            id: row.id
+            .catch(() => {
+              this.listLoading = false
+            })
+        })
+
+    },
+    end(row) {
+      this.$confirm('确定终止该订单？', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning',
+      })
+        .then(() => {
+          this.listLoading = true
+          endData({
+            id: row.id,
+            terminator: '3'
           }).then(response => {
-            this.costData = response.data
-            this.rightSee = true
-            // this.deptBudgetTotal = response.data.total
+            this.$notify({
+              title: '成功',
+              message: '终止成功！',
+              type: 'success'
+            });
+            this.getList()
             this.listLoading = false
           })
-          .catch(() => {
+            .catch(() => {
+              this.listLoading = false
+            })
+        })
+    },
+    dateChange(e) {
+      this.startDate = e[0]
+      this.endDate = e[1]
+      this.getList()
+    },
+    contract(row) {
+      window.open(row.driverContractUrl)
+      // this.userInfo = true;
+    },
+    userClose() {
+      this.userInfo = false;
+    },
+    costLook(row) {
+      this.costData = row
+      this.costInfo = true;
+    },
+    costClose() {
+      this.costInfo = false;
+    },
+    searchBtn(num) {
+      this.search = num;
+      this.getList();
+    },
+    find() {
+      this.currentPage = 1
+      this.getList();
+    },
+    submit(num) {
+      var _data = {}
+      _data.id = this.costData.id
+      _data.examineFlag = num
+      if (this.costData.orderStatusKey == 9) {
+        _data.loadingFlag = 1
+      } else if (this.costData.orderStatusKey == 19) {
+        _data.loadingFlag = 2
+      }
+      this.$confirm(num == 1 ? '确定通过订单？' : '确定驳回订单？', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning',
+      })
+        .then(() => {
+          this.listLoading = true
+          auditData(_data).then(response => {
+            this.$notify({
+              title: '成功',
+              message: '操作成功！',
+              type: 'success'
+            });
+            this.rightSee = false
+            this.getList()
             this.listLoading = false
           })
-      },
-      complete() {
-        this.$confirm('确定订单已完结？', '提示', {
-            confirmButtonText: '确定',
-            cancelButtonText: '取消',
-            type: 'warning',
-          })
-          .then(() => {
-            this.listLoading = true
-            editEndData({
-                id: this.costData.id
-              }).then(response => {
-                this.getList()
-                this.listLoading = false
-              })
-              .catch(() => {
-                this.listLoading = false
-              })
-          })
-
-      },
-      end(row) {
-        this.$confirm('确定终止该订单？', '提示', {
-            confirmButtonText: '确定',
-            cancelButtonText: '取消',
-            type: 'warning',
-          })
-          .then(() => {
-            this.listLoading = true
-            endData({
-                id: row.id,
-                terminator: '3'
-              }).then(response => {
-                this.$notify({
-                  title: '成功',
-                  message: '终止成功！',
-                  type: 'success'
-                });
-                this.getList()
-                this.listLoading = false
-              })
-              .catch(() => {
-                this.listLoading = false
-              })
-          })
-      },
-      dateChange(e) {
-        this.startDate = e[0]
-        this.endDate = e[1]
-        this.getList()
-      },
-      contract(row) {
-        window.open(row.driverContractUrl)
-        // this.userInfo = true;
-      },
-      userClose() {
-        this.userInfo = false;
-      },
-      costLook(row) {
-        this.costData = row
-        this.costInfo = true;
-      },
-      costClose() {
-        this.costInfo = false;
-      },
-      searchBtn(num) {
-        this.search = num;
-        this.getList();
-      },
-      find() {
-        this.currentPage = 1
-        this.getList();
-      },
-      submit(num) {
-        var _data = {}
-        _data.id = this.costData.id
-        _data.examineFlag = num
-        if (this.costData.orderStatusKey == 9) {
-          _data.loadingFlag = 1
-        } else if (this.costData.orderStatusKey == 19) {
-          _data.loadingFlag = 2
-        }
-        this.$confirm(num==1?'确定通过订单？':'确定驳回订单？', '提示', {
-            confirmButtonText: '确定',
-            cancelButtonText: '取消',
-            type: 'warning',
-          })
-          .then(() => {
-            this.listLoading = true
-            auditData(_data).then(response => {
-                this.$notify({
-                  title: '成功',
-                  message: '操作成功！',
-                  type: 'success'
-                });
-                this.rightSee = false
-                this.getList()
-                this.listLoading = false
-              })
-              .catch(() => {
-                this.listLoading = false
-              })
-          })
-      },
-      reject(row) {
-        this.rejectInfo = true
-      },
-      rejectClose() {
-        this.form = {}
-        this.form.checkList = []
-        this.rejectInfo = false
-      },
-      onChange() {
-        this.$refs.upload
-          .handleSaveBill()
-          .then(async (response) => {
-            this.formData.addressUrl = response;
-          })
-          .catch((res) => {
-            EventBus.$emit("error", (JSON.parse(res) || {}).message);
-            this.$refs.upload.clearFiles();
-          });
-      },
-      handleSizeChange(val) {
-        console.log(`每页 ${val} 条`);
-        this.pageSize = val;
-        this.getList();
-      },
-      handleCurrentChange(val) {
-        this.currentPage = val;
-        console.log(`当前页: ${val}`);
-        this.getList();
-      },
+            .catch(() => {
+              this.listLoading = false
+            })
+        })
+    },
+    reject(row) {
+      this.rejectInfo = true
+    },
+    rejectClose() {
+      this.form = {}
+      this.form.checkList = []
+      this.rejectInfo = false
+    },
+    onChange() {
+      this.$refs.upload
+        .handleSaveBill()
+        .then(async (response) => {
+          this.formData.addressUrl = response;
+        })
+        .catch((res) => {
+          EventBus.$emit("error", (JSON.parse(res) || {}).message);
+          this.$refs.upload.clearFiles();
+        });
+    },
+    handleSizeChange(val) {
+      console.log(`每页 ${val} 条`);
+      this.pageSize = val;
+      this.getList();
     },
-  };
+    handleCurrentChange(val) {
+      this.currentPage = val;
+      console.log(`当前页: ${val}`);
+      this.getList();
+    },
+  },
+};
 </script>
 <style lang="scss" scoped>
-  .center {
-    padding: 10px 20px;
-    background: #f5f6f7;
-    height: calc(100vh - 5vh);
-
+.center {
+  padding: 10px 20px;
+  background: #f5f6f7;
+  height: calc(100vh - 5vh);
 
-    .top_css {
-      padding: 10px;
 
-      .search_btn {
-        height: 80px;
-        background: linear-gradient(#fafbfb, #ffffff);
-        display: flex;
-        margin-top: 20px;
-
-        .search_block {
-          margin-left: 20px;
-        }
+  .top_css {
+    padding: 10px;
 
-        .search_item {
-          text-align: center;
-          font-size: 14px;
-          font-weight: 600;
-          line-height: 40px;
-          width: 112px;
-          height: 40px;
-          background: #f7f8f9;
-          cursor: pointer;
-          margin-top: 30px;
-        }
-
-        .searchNo {
-          color: #323233;
-        }
-
-        .search {
-          color: #2f53eb;
-          background: #ffffff;
-        }
-      }
-    }
-
-    .center_css {
-      background: #ffffff;
-      border-radius: 1px;
-      margin-top: 10px;
-      padding-bottom: 10px;
-    }
-
-    .screen {
+    .search_btn {
+      height: 80px;
+      background: linear-gradient(#fafbfb, #ffffff);
       display: flex;
+      margin-top: 20px;
 
-      .search {
-        width: 40px;
-        height: 40px;
-        background: #2f53eb;
-        border-radius: 0px 2px 2px 0px;
-        border: 1px solid #DCDFE6;
-        margin-left:-1px;
+      .search_block {
+        margin-left: 20px;
       }
 
-      .count_css {
-        width: 80px;
+      .search_item {
         text-align: center;
+        font-size: 14px;
+        font-weight: 600;
         line-height: 40px;
-        color: #666666;
+        width: 112px;
+        height: 40px;
+        background: #f7f8f9;
+        cursor: pointer;
+        margin-top: 30px;
       }
-    }
 
-    .el-button {
-      padding: 10px 20px !important;
+      .searchNo {
+        color: #323233;
+      }
+
+      .search {
+        color: #2f53eb;
+        background: #ffffff;
+      }
     }
+  }
 
-    .center_css {
+  .center_css {
+    background: #ffffff;
+    border-radius: 1px;
+    margin-top: 10px;
+    padding-bottom: 10px;
+  }
 
-      ::v-deep .el-table th,
-      ::v-deep .el-table td {
-        text-align: center;
-      }
+  .screen {
+    display: flex;
 
-      .fujian {
-        font-size: 24px;
-        color: #409eff;
-      }
+    .search {
+      width: 40px;
+      height: 40px;
+      background: #2f53eb;
+      border-radius: 0px 2px 2px 0px;
+      border: 1px solid #DCDFE6;
+      margin-left: -1px;
+    }
 
-      .warning {
-        font-size: 14px;
-        color: #ed1d1d;
-      }
+    .count_css {
+      width: 80px;
+      text-align: center;
+      line-height: 40px;
+      color: #666666;
     }
   }
-.el-button--primary {
-    color: #FFF;
-    background-color: #2f53eb;
-    border-color: #2f53eb;
-}
-  .cost_css {
-    .cost_item {
-      width: 100%;
-      display: flex;
-      margin-bottom: 20px;
 
-      .cost_title {
-        width: 50%;
-        text-align: left;
-        color: #9D9D9D;
-      }
+  .el-button {
+    padding: 10px 20px !important;
+  }
 
-      .cost_value {
-        width: 50%;
-        color: #0D0D0D;
-        text-align: right;
-      }
+  .center_css {
 
+    ::v-deep .el-table th,
+    ::v-deep .el-table td {
+      text-align: center;
     }
 
-    .right_btn {
-      text-align: right;
-      margin-top: 10px;
+    .fujian {
+      font-size: 24px;
+      color: #409eff;
+    }
+
+    .warning {
+      font-size: 14px;
+      color: #ed1d1d;
     }
   }
+}
 
-  .user {
-    margin-bottom: 20px;
+.el-button--primary {
+  color: #FFF;
+  background-color: #2f53eb;
+  border-color: #2f53eb;
+}
 
-    .user_id {
-      display: flex;
-      height: 30px;
-    }
+.cost_css {
+  .cost_item {
+    width: 100%;
+    display: flex;
+    margin-bottom: 20px;
 
-    .name_css,
-    .id_css {
+    .cost_title {
       width: 50%;
+      text-align: left;
+      color: #9D9D9D;
     }
 
-    .name_css {
+    .cost_value {
+      width: 50%;
+      color: #0D0D0D;
       text-align: right;
     }
 
-    .user_item {
-      width: 450px;
-      height: 300px;
-    }
   }
 
-  ::v-deep .el-table--border .el-table__header th {
-    background: #f7f8f9;
+  .right_btn {
+    text-align: right;
+    margin-top: 10px;
   }
+}
 
-  .btn_css {
-    color: #409EFF;
-    cursor: pointer
+.user {
+  margin-bottom: 20px;
+
+  .user_id {
+    display: flex;
+    height: 30px;
   }
 
-  .sign {
-    font-size: 14px;
-    color: red;
+  .name_css,
+  .id_css {
+    width: 50%;
   }
 
-  .form_css {
-    width: 100%;
-    margin: 20px auto 20px;
+  .name_css {
+    text-align: right;
+  }
 
-    ::v-deep .el-checkbox {
-      width: 40%;
-      height: 30px;
-    }
+  .user_item {
+    width: 450px;
+    height: 300px;
+  }
+}
 
-    // ::v-deep .el-dialog__body{
-    // 	padding: 10px 20px;
-    // }
-    ::v-deep .el-dialog__title {
-      font-size: 16px;
-    }
+::v-deep .el-table--border .el-table__header th {
+  background: #f7f8f9;
+}
 
-    ::v-deep .el-textarea__inner {
-      background: #F0F1F2;
-    }
+.btn_css {
+  color: #409EFF;
+  cursor: pointer
+}
 
-    .form_btn {
-      text-align: right;
-      margin-top: 10px;
-    }
+.sign {
+  font-size: 14px;
+  color: red;
+}
+
+.form_css {
+  width: 100%;
+  margin: 20px auto 20px;
+
+  ::v-deep .el-checkbox {
+    width: 40%;
+    height: 30px;
   }
 
-  .right_css {
-    // overflow-y: auto !important;
-    min-height: 1266px;
-    padding: 0 20px;
+  // ::v-deep .el-dialog__body{
+  // 	padding: 10px 20px;
+  // }
+  ::v-deep .el-dialog__title {
+    font-size: 16px;
+  }
 
-    .right_title {
-      color: #9D9D9D;
-      font-size: 14px;
-      margin-bottom: 4px;
-    }
+  ::v-deep .el-textarea__inner {
+    background: #F0F1F2;
+  }
 
-    .title_name {
-      margin-bottom: 10px;
-    }
+  .form_btn {
+    text-align: right;
+    margin-top: 10px;
+  }
+}
 
-    .right_item {
-      color: #0D0D0D;
-      font-size: 14px;
-      margin-bottom: 10px;
-    }
+.right_css {
+  // overflow-y: auto !important;
+  min-height: 1266px;
+  padding: 0 20px;
 
-    .right_btn {
-      text-align: right;
-      margin: 10px 0;
-    }
+  .right_title {
+    color: #9D9D9D;
+    font-size: 14px;
+    margin-bottom: 4px;
+  }
 
-    .img_css {
-      width: 100px;
-      height: 80px;
-      margin-right: 5px;
-    }
+  .title_name {
+    margin-bottom: 10px;
+  }
 
-    .right_img {
-      width: 200px;
-      height: 120px;
-      margin-top: 10px;
-    }
+  .right_item {
+    color: #0D0D0D;
+    font-size: 14px;
+    margin-bottom: 10px;
   }
 
-  .pad_css {
-    background: #F0F4FF;
-    color: #2F53EB;
-    padding: 2px;
-    margin-left: 10px;
+  .right_btn {
+    text-align: right;
+    margin: 10px 0;
   }
 
-  ::v-deep .el-drawer {
-    overflow: auto;
+  .img_css {
+    width: 100px;
+    height: 80px;
+    margin-right: 5px;
   }
-  .find::v-deep input.el-input__inner{
-    border-radius:0;
+
+  .right_img {
+    width: 200px;
+    height: 120px;
+    margin-top: 10px;
   }
+}
+
+.pad_css {
+  background: #F0F4FF;
+  color: #2F53EB;
+  padding: 2px;
+  margin-left: 10px;
+}
+
+::v-deep .el-drawer {
+  overflow: auto;
+}
+
+.find::v-deep input.el-input__inner {
+  border-radius: 0;
+}
 </style>

src/views/parkReportManagement/driverInformationReporting.vue

@@ -16,16 +16,15 @@
               <el-input class='find' placeholder="可按司机姓名和账号查找" @keyup.enter.native="find" v-model="searchkeyWord"
                 clearable @change="find"></el-input>
               <el-button class="search" @click="find"><img width="16" height="16" style="margin-left: -8px"
-                  src="../../../public/img/sousuo.png" /></el-button><span
-                class="count_css">共{{ deptBudgetTotal }}条</span>
+                  src="../../../public/img/sousuo.png" /></el-button><span class="count_css">共{{ deptBudgetTotal
+                  }}条</span>
             </div>
           </el-col>
         </el-row>
         <el-row>
           <el-col>
             <div class="search_btn">
-              <div :class="search == 1 ? 'search' : 'searchNo'" class="search_item search_block"
-                @click="searchBtn(1)">
+              <div :class="search == 1 ? 'search' : 'searchNo'" class="search_item search_block" @click="searchBtn(1)">
                 待上报
               </div>
               <div :class="search == 2 ? 'search' : 'searchNo'" class="search_item" @click="searchBtn(2)">
@@ -45,7 +44,7 @@
         </el-row>
       </div>
       <el-table :data="tableData" style="width: 98%; margin: 0 auto; border-radius: 10px" height="55.8vh" border
-        highlight-current-row @row-click="handleRowClick" @selection-change="handleSelectionChange" >
+        highlight-current-row @row-click="handleRowClick" @selection-change="handleSelectionChange">
         <el-table-column type="selection" width="55" :selectable="selectInit">
         </el-table-column>
         <el-table-column type="index" label="序号" width="50">
@@ -58,36 +57,40 @@
         <el-table-column prop="driverPhone" label="账号"></el-table-column>
         <el-table-column prop="driverLicenseValidityStartDate" label="驾驶证有效期">
           <template slot-scope="scope">
-            <span :class="scope.row.driverOverdueFlag == 1?'red_text':''">{{scope.row.driverLicenseValidityStartDate}}</span>
+            <span
+              :class="scope.row.driverOverdueFlag == 1 ? 'red_text' : ''">{{ scope.row.driverLicenseValidityStartDate }}</span>
           </template>
         </el-table-column>
         <el-table-column prop="qualificationCertificateValidityDate" label="从业资格证有效期">
-           <template slot-scope="scope">
-            <span :class="scope.row.qualificationOverdueFlag == 1?'red_text':''">{{scope.row.qualificationCertificateValidityDate}}</span>
+          <template slot-scope="scope">
+            <span
+              :class="scope.row.qualificationOverdueFlag == 1 ? 'red_text' : ''">{{ scope.row.qualificationCertificateValidityDate }}</span>
           </template>
         </el-table-column>
         <el-table-column prop="cardValidityDate" label="身份证有效期">
-             <template slot-scope="scope">
-            <span :class="scope.row.overdueFlag == 1?'red_text':''">{{scope.row.cardValidityDate}}</span>
+          <template slot-scope="scope">
+            <span :class="scope.row.overdueFlag == 1 ? 'red_text' : ''">{{ scope.row.cardValidityDate }}</span>
           </template>
         </el-table-column>
         <el-table-column prop="updateDate" label="上报时间">
           <template slot-scope="scope">
-            <span v-if="scope.row.escalationStatus != '未认证' && scope.row.escalationStatus != '待上报'">{{scope.row.updateDate}}</span><!-- 未认证和待上报不显示时间 -->
+            <span
+              v-if="scope.row.escalationStatus != '未认证' && scope.row.escalationStatus != '待上报'">{{ scope.row.updateDate }}</span>
+            <!-- 未认证和待上报不显示时间 -->
           </template>
         </el-table-column>
         <el-table-column prop="paymentDate" label="附件">
-          <template slot-scope="scope" style="text-align: center" v-if="scope.row.backStageStatus !='未认证'">
+          <template slot-scope="scope" style="text-align: center" v-if="scope.row.backStageStatus != '未认证'">
             <span class="btn_css btn_css1" @click="fujianLook(scope.row)">查看</span>
             <el-tooltip placement="top" v-if="
-                scope.row.overdueFlag == 1 ||
-                scope.row.driverOverdueFlag == 1 ||
-                scope.row.drivingOverdueFlag == 1 ||
-                scope.row.trailerOverdueFlag == 1 ||
-                scope.row.qualificationOverdueFlag == 1 ||
-                scope.row.operationOverdueFlag == 1 ||
-                scope.row.trailerOperationOverdueFlag == 1
-              ">
+              scope.row.overdueFlag == 1 ||
+              scope.row.driverOverdueFlag == 1 ||
+              scope.row.drivingOverdueFlag == 1 ||
+              scope.row.trailerOverdueFlag == 1 ||
+              scope.row.qualificationOverdueFlag == 1 ||
+              scope.row.operationOverdueFlag == 1 ||
+              scope.row.trailerOperationOverdueFlag == 1
+            ">
               <div slot="content">
                 <span v-if="scope.row.overdueFlag == 1">身份证已过有效期<br /></span>
                 <span v-if="scope.row.driverOverdueFlag == 1">驾驶证已过有效期<br /></span><span
@@ -100,16 +103,16 @@
         </el-table-column>
         <el-table-column prop="escalationStatus" label="状态" min-width="100">
           <template slot-scope="scope">
-            <span>{{scope.row.escalationStatus}}</span>
-              <el-tooltip class="item" effect="dark" content="提示文字" placement="top" v-if="scope.row.escalationStatus == '未通过'">
-                 <img src="../../../public/img/wenhao.png" alt="" class="ask_css" />
-              </el-tooltip>
+            <span>{{ scope.row.escalationStatus }}</span>
+            <el-tooltip class="item" effect="dark" content="提示文字" placement="top"
+              v-if="scope.row.escalationStatus == '未通过'">
+              <img src="../../../public/img/wenhao.png" alt="" class="ask_css" />
+            </el-tooltip>
           </template>
         </el-table-column>
         <el-table-column label="操作" min-width="200">
           <template slot-scope="scope">
-            <el-link target="_blank" @click="see(scope.row)" type="primary" :underline="false"
-              >查看</el-link>
+            <el-link target="_blank" @click="see(scope.row)" type="primary" :underline="false">查看</el-link>
             <el-divider direction="vertical"></el-divider>
             <el-link target="_blank" @click="reportInfo(scope.row)" type="primary" :underline="false"
               :disabled="scope.row.escalationStatus != '未上报' && scope.row.escalationStatus != '未通过'">上报</el-link>
@@ -159,9 +162,9 @@
           </div> -->
         </div>
         <div class="file_tips">
-          <span v-if="count == 1">有效期：{{file.cardValidityDate}} </span><span v-if="count == 2">
-            准驾车型：{{file.quasiDrivingVehicle}} </span> <span v-if="count == 2"> 发证机关：{{file.lssuingAuthority}} </span>
-          <span v-if="count == 4"> 从业资格证号：{{file.qualificationCertificateNumber}}</span>
+          <span v-if="count == 1">有效期：{{ file.cardValidityDate }} </span><span v-if="count == 2">
+            准驾车型：{{ file.quasiDrivingVehicle }} </span> <span v-if="count == 2"> 发证机关：{{ file.lssuingAuthority }} </span>
+          <span v-if="count == 4"> 从业资格证号：{{ file.qualificationCertificateNumber }}</span>
         </div>
         <div class="file_img">
           <img :src="img[index]" class="img_css" @click="enlarge(img[index])" />
@@ -177,121 +180,124 @@
     <el-drawer title="司机信息" :visible.sync="rightSee" style="overflow-y: auto !important">
       <div class="right_css">
         <div class="title_name">基本信息</div>
-        <div class="right_item">姓名：{{costData.driverName}}</div>
+        <div class="right_item">姓名：{{ costData.driverName }}</div>
         <div class="right_title">性别</div>
-        <div class="right_item">{{costData.driverSex}} </div>
-         <div class="right_title">手机号码</div>
-        <div class="right_item">{{costData.driverPhone}} </div>
-         <div class="right_title">身份证照片(人像面)</div>
+        <div class="right_item">{{ costData.driverSex }} </div>
+        <div class="right_title">手机号码</div>
+        <div class="right_item">{{ costData.driverPhone }} </div>
+        <div class="right_title">身份证照片(人像面)</div>
         <img :src="costData.cardAddressUrl" alt="" class="img_css" @click="enlarge(costData.cardAddressUrl)">
         <div class="right_title">身份证照片(国徽面)</div>
-         <img :src="costData.cardBackAddressUrl" alt="" class="img_css"  @click="enlarge(costData.cardBackAddressUrl)">
+        <img :src="costData.cardBackAddressUrl" alt="" class="img_css" @click="enlarge(costData.cardBackAddressUrl)">
         <div class="right_title">身份证号：</div>
-        <div class="right_item">{{costData.numberCard}}</div>
+        <div class="right_item">{{ costData.numberCard }}</div>
         <div class="right_title">身份证有效期</div>
-        <div class="right_item">{{costData.cardValidityDate}} </div>
-         <div class="right_title">驾驶证照片(正页)</div>
-        <img :src="costData.driverLicenseHomePage" alt="" class="img_css" @click="enlarge(costData.driverLicenseHomePage)">
+        <div class="right_item">{{ costData.cardValidityDate }} </div>
+        <div class="right_title">驾驶证照片(正页)</div>
+        <img :src="costData.driverLicenseHomePage" alt="" class="img_css"
+          @click="enlarge(costData.driverLicenseHomePage)">
         <div class="right_title">驾驶证照片(副页)</div>
-        <img :src="costData.driverLicenseBackPage" alt="" class="img_css" @click="enlarge(costData.driverLicenseBackPage)">
+        <img :src="costData.driverLicenseBackPage" alt="" class="img_css"
+          @click="enlarge(costData.driverLicenseBackPage)">
         <div class="right_title">准驾车型</div>
-        <div class="right_item">{{costData.quasiDrivingVehicle}}</div>
+        <div class="right_item">{{ costData.quasiDrivingVehicle }}</div>
         <div class="right_title">驾驶证发证机关</div>
-        <div class="right_item">{{costData.lssuingAuthority}}</div>
+        <div class="right_item">{{ costData.lssuingAuthority }}</div>
         <div class="right_title">驾驶证有效期</div>
-        <div class="right_item">{{costData.driverLicenseValidityDate}}</div>
+        <div class="right_item">{{ costData.driverLicenseValidityDate }}</div>
         <div class="right_title">道路运输从业资格证照片</div>
-        <img :src="costData.qualificationCertificate" alt="" class="img_css" @click="enlarge(costData.qualificationCertificate)">
+        <img :src="costData.qualificationCertificate" alt="" class="img_css"
+          @click="enlarge(costData.qualificationCertificate)">
         <div class="right_title">从业资格证有效期</div>
-        <div class="right_item">{{costData.qualificationCertificateValidityDate}} </div>
+        <div class="right_item">{{ costData.qualificationCertificateValidityDate }} </div>
         <div class="right_title">从业资格证号</div>
-        <div class="right_item">{{costData.qualificationCertificateNumber}} </div>
+        <div class="right_item">{{ costData.qualificationCertificateNumber }} </div>
       </div>
     </el-drawer>
     <el-image-viewer v-if="imgsVisible" :on-close="closeImgViewer" :url-list="srcList" style="z-index:9999" />
   </div>
 </template>
 <script>
-  import {
-    getList,
-    report,
-    getInfo
-  } from "@/api/parkReportManagement";
-  export default {
-    components: {
-      "el-image-viewer": () =>
-        import("element-ui/packages/image/src/image-viewer"),
-    },
-    data() {
-      return {
-        tableData: [],
-        //分页
-        searchkeyWord: "",
-        currentPage: 1,
-        pageSize: 10,
-        deptBudgetTotal: 0,
-        deptCircularPage: {},
-        search: 1,
-        disabled: false,
-        userInfo: false,
-        fujianInfo: false,
-        file: {},
-        img: [],
-        index: "0",
-        count: "1",
-        abilityName: "身份证人像面",
-        abilityName1: "身份证国徽面",
-        //图片预览
-        srcList: [],
-        imgsVisible: false,
-        //筛选时间
-        startDate: "",
-        endDate: "",
-        value1: [],
-        //侧边查看
-        rightSee: false,
-        costData: {
-          publishTaskInfo: {}
-        },
-        musterList:[],
-      };
-    },
-    mounted() {
-      let date = new Date()
-      let date1 = new Date().setTime(date.getTime() - 365 * 60 * 60 * 24 * 1000) //一年前的时间蹉
-      date1 = new Date(parseInt(date1)).toLocaleString().split(" ")[0].replaceAll("/", "-")
-      let nian = date1.split("-")[0]
-      let yue = date1.split("-")[1]
-      if (yue < 10) {
-        yue = "0" + yue
-      }
-      let ri = date1.split("-")[2]
-      if (ri < 10) {
-        ri = "0" + ri
+import {
+  getList,
+  report,
+  getInfo
+} from "@/api/parkReportManagement";
+export default {
+  components: {
+    "el-image-viewer": () =>
+      import("element-ui/packages/image/src/image-viewer"),
+  },
+  data() {
+    return {
+      tableData: [],
+      //分页
+      searchkeyWord: "",
+      currentPage: 1,
+      pageSize: 10,
+      deptBudgetTotal: 0,
+      deptCircularPage: {},
+      search: 1,
+      disabled: false,
+      userInfo: false,
+      fujianInfo: false,
+      file: {},
+      img: [],
+      index: "0",
+      count: "1",
+      abilityName: "身份证人像面",
+      abilityName1: "身份证国徽面",
+      //图片预览
+      srcList: [],
+      imgsVisible: false,
+      //筛选时间
+      startDate: "",
+      endDate: "",
+      value1: [],
+      //侧边查看
+      rightSee: false,
+      costData: {
+        publishTaskInfo: {}
+      },
+      musterList: [],
+    };
+  },
+  mounted() {
+    let date = new Date()
+    let date1 = new Date().setTime(date.getTime() - 365 * 60 * 60 * 24 * 1000) //一年前的时间蹉
+    date1 = new Date(parseInt(date1)).toLocaleString().split(" ")[0].replaceAll("/", "-")
+    let nian = date1.split("-")[0]
+    let yue = date1.split("-")[1]
+    if (yue < 10) {
+      yue = "0" + yue
+    }
+    let ri = date1.split("-")[2]
+    if (ri < 10) {
+      ri = "0" + ri
+    }
+    this.startDate = nian + "-" + yue + "-" + ri //一年前的時間
+    this.endDate = date.getFullYear() + "-" + (date.getMonth() + 1 < 10 ? "0" + (date.getMonth() + 1) : date
+      .getMonth() + 1) + "-" + (date.getDate() < 10 ? "0" + date.getDate() : date.getDate()) //當前時間
+    this.value1.push(this.startDate)
+    this.value1.push(this.endDate)
+    this.getList();
+  },
+  methods: {
+    //上报
+    escalation() {
+      let that = this
+      if (this.musterList.length == 0) {
+        this.$message.error("请勾选要上报的条目")
+        return
       }
-      this.startDate = nian + "-" + yue + "-" + ri //一年前的時間
-      this.endDate = date.getFullYear() + "-" + (date.getMonth() + 1 < 10 ? "0" + (date.getMonth() + 1) : date
-        .getMonth()+1) + "-" + (date.getDate() < 10 ? "0" + date.getDate() : date.getDate()) //當前時間
-      this.value1.push(this.startDate)
-      this.value1.push(this.endDate)
-      this.getList();
-    },
-    methods: {
-      //上报
-      escalation(){
-        let that =this
-        if(this.musterList.length == 0){
-          this.$message.error("请勾选要上报的条目")
-          return
-        }
-          this.$confirm("确定上报司机信息？", "提示", {
-          confirmButtonText: "确定",
-          cancelButtonText: "取消",
-          type: "warning",
-        }).then(() => {
-          report({hyDriverInfoList:this.musterList})
+      this.$confirm("确定上报司机信息？", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      }).then(() => {
+        report({ hyDriverInfoList: this.musterList })
           .then((response) => {
-             if (response.code == 200) {
+            if (response.code == 200) {
               that.$notify({
                 title: "成功",
                 message: "司机信息上报成功！",
@@ -300,325 +306,335 @@
               that.musterList = []
               that.getList();
             }
+          }).catch(() => {
+            that.musterList = []
+            that.listLoading = false
           })
+      })
+    },
+    handleRowClick(row) {
+      return true
+    },
+    handleSelectionChange(val) {
+      this.musterList = val;
+      console.log(this.musterList)
+    },
+    see(row) {
+      this.loading = true
+      this.rightSee = true
+      getInfo({
+        commonId: row.commonId
+      }).then(response => {
+        this.costData = response.data
+        this.listLoading = false
+      })
+        .catch(() => {
+          this.listLoading = false
         })
-      },
-       handleRowClick(row) {
-        return true
-       },
-      handleSelectionChange(val){
-         this.musterList = val;
-         console.log(this.musterList)
-      },
-      see(row) { 
-        this.loading = true
-        this.rightSee = true
-        getInfo({
-            commonId: row.commonId
-          }).then(response => {
-            this.costData = response.data
-            this.listLoading = false
-          })
-          .catch(() => {
-            this.listLoading = false
-          })
-      },
-      reportInfo(row) { //上报
+    },
+    reportInfo(row) { //上报
       this.musterList.push(row)
       this.escalation()
-      },
-      dateChange(e) {
-        console.log(this.value1)
-        this.startDate = e[0]
-        this.endDate = e[1]
-        this.getList()
-      },
-      closeImgViewer() {
-        this.srcList = []
-        this.imgsVisible = false;
-      },
-      enlarge(url) {
-        this.imgsVisible = true;
-        this.srcList.push(url)
-      },
+    },
+    dateChange(e) {
+      console.log(this.value1)
+      this.startDate = e[0]
+      this.endDate = e[1]
+      this.getList()
+    },
+    closeImgViewer() {
+      this.srcList = []
+      this.imgsVisible = false;
+    },
+    enlarge(url) {
+      this.imgsVisible = true;
+      this.srcList.push(url)
+    },
 
-      getList() {
-        this.listLoading = true;
-        let _obj = {};
-        _obj.currentPage = this.currentPage;
-        _obj.pageSize = this.pageSize;
-        _obj.searchKeyWord = this.searchkeyWord;
-        _obj.searchType = this.search;
-        _obj.startDate = this.startDate
-        _obj.endDate = this.endDate
-        getList(_obj)
-          .then((response) => {
-            this.tableData = response.data.records;
-            for (let i = 0; i < this.tableData.length; i++) {
-              this.tableData[i].iconShow = true;
-            }
-            this.deptBudgetTotal = response.data.total;
-            this.listLoading = false;
-          })
-          .catch(() => {
-            this.listLoading = false;
-          });
-      },
-      btnChange(num) {
-        this.count = num;
-        if (num == 1) {
-          this.abilityName = "身份证人像面";
-          this.abilityName1 = "身份证国徽面";
-          this.img[0] = this.file.cardAddressUrl;
-          this.img[1] = this.file.cardBackAddressUrl;
-        } else if (num == 2) {
-          this.abilityName = "驾驶证主页";
-          this.abilityName1 = "驾驶证副页";
-          this.img[0] = this.file.driverLicenseHomePage;
-          this.img[1] = this.file.driverLicenseBackPage;
-        } else if (num == 3) {
-          this.abilityName = "行驶证主页";
-          this.abilityName1 = "行驶证副页";
-          this.img[0] = this.file.drivingLicenseHomePage;
-          this.img[1] = this.file.drivingLicenseBackPage;
-        } else if (num == 4) {
-          this.index = 0;
-          this.img[0] = this.file.qualificationCertificate;
-        } else if (num == 5) {
-          this.abilityName = "挂车行驶证主页";
-          this.abilityName1 = "挂车行驶证副页";
-          this.img[0] = this.file.trailerLicenseHomePage;
-          this.img[1] = this.file.trailerLicenseBackPage;
-        } else if (num == 6) {
-          this.index = 0;
-          this.img[0] = this.file.operationCertificate;
-        } else if (num == 7) {
-          this.index = 0;
-          this.img[0] = this.file.trailerOperationCertificate;
-        }
-      },
-      fujianLook(row) {
-        this.file = row;
-        this.index = 0;
+    getList() {
+      this.listLoading = true;
+      let _obj = {};
+      _obj.currentPage = this.currentPage;
+      _obj.pageSize = this.pageSize;
+      _obj.searchKeyWord = this.searchkeyWord;
+      _obj.searchType = this.search;
+      _obj.startDate = this.startDate
+      _obj.endDate = this.endDate
+      getList(_obj)
+        .then((response) => {
+          this.tableData = response.data.records;
+          for (let i = 0; i < this.tableData.length; i++) {
+            this.tableData[i].iconShow = true;
+          }
+          this.deptBudgetTotal = response.data.total;
+          this.listLoading = false;
+        })
+        .catch(() => {
+          this.listLoading = false;
+        });
+    },
+    btnChange(num) {
+      this.count = num;
+      if (num == 1) {
+        this.abilityName = "身份证人像面";
+        this.abilityName1 = "身份证国徽面";
         this.img[0] = this.file.cardAddressUrl;
         this.img[1] = this.file.cardBackAddressUrl;
-        this.fujianInfo = true;
-      },
-      fujianClose() {
-        this.count = 1;
-        this.fujianInfo = false;
-      },
-      searchBtn(num) {
-        this.search = num;
-        this.getList();
-      },
-      find() {
-        this.currentPage = 1
-        this.getList();
-      },
-      selectInit(row) {
-        if (row.escalationStatus != '未上报'&& row.escalationStatus != '未通过') {  
-          return false;
-        }else{
-          return true;
-        }
-      },
-      handleSizeChange(val) {
-        console.log(`每页 ${val} 条`);
-        this.pageSize = val;
-        this.getList();
-      },
-      handleCurrentChange(val) {
-        this.currentPage = val;
-        console.log(`当前页: ${val}`);
-        this.getList();
-      },
+      } else if (num == 2) {
+        this.abilityName = "驾驶证主页";
+        this.abilityName1 = "驾驶证副页";
+        this.img[0] = this.file.driverLicenseHomePage;
+        this.img[1] = this.file.driverLicenseBackPage;
+      } else if (num == 3) {
+        this.abilityName = "行驶证主页";
+        this.abilityName1 = "行驶证副页";
+        this.img[0] = this.file.drivingLicenseHomePage;
+        this.img[1] = this.file.drivingLicenseBackPage;
+      } else if (num == 4) {
+        this.index = 0;
+        this.img[0] = this.file.qualificationCertificate;
+      } else if (num == 5) {
+        this.abilityName = "挂车行驶证主页";
+        this.abilityName1 = "挂车行驶证副页";
+        this.img[0] = this.file.trailerLicenseHomePage;
+        this.img[1] = this.file.trailerLicenseBackPage;
+      } else if (num == 6) {
+        this.index = 0;
+        this.img[0] = this.file.operationCertificate;
+      } else if (num == 7) {
+        this.index = 0;
+        this.img[0] = this.file.trailerOperationCertificate;
+      }
+    },
+    fujianLook(row) {
+      this.file = row;
+      this.index = 0;
+      this.img[0] = this.file.cardAddressUrl;
+      this.img[1] = this.file.cardBackAddressUrl;
+      this.fujianInfo = true;
+    },
+    fujianClose() {
+      this.count = 1;
+      this.fujianInfo = false;
+    },
+    searchBtn(num) {
+      this.search = num;
+      this.getList();
+    },
+    find() {
+      this.currentPage = 1
+      this.getList();
+    },
+    selectInit(row) {
+      if (row.escalationStatus != '未上报' && row.escalationStatus != '未通过') {
+        return false;
+      } else {
+        return true;
+      }
+    },
+    handleSizeChange(val) {
+      console.log(`每页 ${val} 条`);
+      this.pageSize = val;
+      this.getList();
+    },
+    handleCurrentChange(val) {
+      this.currentPage = val;
+      console.log(`当前页: ${val}`);
+      this.getList();
     },
-  };
+  },
+};
 </script>
 <style lang="scss" scoped>
-  .center {
-    padding: 10px 20px;
-    background: #f5f6f7;
-    height: calc(100vh - 5vh);
-
-    .top_css {
-      padding: 10px;
-
-      .search_btn {
-        height: 80px;
-        background: linear-gradient(#fafbfb, #ffffff);
-        display: flex;
-        margin-top: 20px;
-
-        .search_block {
-          margin-left: 20px;
-        }
-
-        .search_item {
-          text-align: center;
-          font-size: 14px;
-          font-weight: 600;
-          line-height: 40px;
-          width: 112px;
-          height: 40px;
-          background: #f7f8f9;
-          cursor: pointer;
-          margin-top: 30px;
-        }
-
-        .searchNo {
-          color: #323233;
-        }
-
-        .search {
-          color: #2f53eb;
-          background: #ffffff;
-        }
-      }
-    }
-
-    .ask_css {
-      position: absolute;
-      margin: 3px 0 0 10px;
-    }
+.center {
+  padding: 10px 20px;
+  background: #f5f6f7;
+  height: calc(100vh - 5vh);
 
-    .center_css {
-      background: #ffffff;
-      border-radius: 1px;
-      margin-top: 10px;
-      padding-bottom: 10px;
-    }
+  .top_css {
+    padding: 10px;
 
-    .screen {
-      // float: right;
+    .search_btn {
+      height: 80px;
+      background: linear-gradient(#fafbfb, #ffffff);
       display: flex;
+      margin-top: 20px;
 
-      .search {
-        width: 40px;
-        height: 40px;
-        background: #2f53eb;
-        border-radius: 0px 2px 2px 0px;
-        border: 1px solid #DCDFE6;
-        margin-left: -1px;
+      .search_block {
+        margin-left: 20px;
       }
 
-      .count_css {
-        width: 80px;
+      .search_item {
         text-align: center;
+        font-size: 14px;
+        font-weight: 600;
         line-height: 40px;
-        color: #666666;
-      }
-    }
-
-    .el-button {
-      padding: 10px 20px !important;
-    }
-
-    .center_css {
-
-      ::v-deep .el-table th,
-      ::v-deep .el-table td {
-        text-align: center;
+        width: 112px;
+        height: 40px;
+        background: #f7f8f9;
+        cursor: pointer;
+        margin-top: 30px;
       }
 
-      .fujian {
-        font-size: 24px;
-        color: #409eff;
+      .searchNo {
+        color: #323233;
       }
 
-      .warning {
-        font-size: 14px;
-        color: #ed1d1d;
+      .search {
+        color: #2f53eb;
+        background: #ffffff;
       }
     }
   }
 
-  ::v-deep .el-table--border .el-table__header th {
-    background: #f7f8f9;
+  .ask_css {
+    position: absolute;
+    margin: 3px 0 0 10px;
   }
 
-  .btn_css {
-    color: #409eff;
-    cursor: pointer;
+  .center_css {
+    background: #ffffff;
+    border-radius: 1px;
+    margin-top: 10px;
+    padding-bottom: 10px;
   }
 
-  .btn_css1 {
-    margin-left: -20px;
-  }
+  .screen {
+    // float: right;
+    display: flex;
 
-  //批量上报按钮
-  .batch_btn {
-    margin: 0 10px;
-  }
+    .search {
+      width: 40px;
+      height: 40px;
+      background: #2f53eb;
+      border-radius: 0px 2px 2px 0px;
+      border: 1px solid #DCDFE6;
+      margin-left: -1px;
+    }
 
-  //附件
-  .file {
-    .fujian_css {
-      width: 270px;
-      display: flex;
-      margin: 0 auto;
+    .count_css {
+      width: 80px;
       text-align: center;
-      line-height: 32px;
-      border: 1px solid #f0f1f2;
-      border-right: 0px;
-      border-radius: 2px 0px 0px 2px;
+      line-height: 40px;
+      color: #666666;
+    }
+  }
 
-      .fujian_item {
-        cursor: pointer;
-        width: 90px;
-        height: 32px;
-        border-right: 1px solid #f0f1f2;
-      }
+  .el-button {
+    padding: 10px 20px !important;
+  }
 
-      .file_btn {
-        color: #2f53eb;
-        background-color: #cfdbfe;
-      }
+  .center_css {
+
+    ::v-deep .el-table th,
+    ::v-deep .el-table td {
+      text-align: center;
     }
 
-    .file_tips {
-      margin: 10px auto;
-      width: 50%;
+    .fujian {
+      font-size: 24px;
+      color: #409eff;
     }
 
-    .file_img {
-      width: 525px;
-      height: 332px;
-      margin: 20px auto;
+    .warning {
+      font-size: 14px;
+      color: #ed1d1d;
     }
+  }
+}
+
+::v-deep .el-table--border .el-table__header th {
+  background: #f7f8f9;
+}
+
+.btn_css {
+  color: #409eff;
+  cursor: pointer;
+}
 
-    .img_css {
-      width: 525px;
-      height: 332px;
+.btn_css1 {
+  margin-left: -20px;
+}
+
+//批量上报按钮
+.batch_btn {
+  margin: 0 10px;
+}
+
+//附件
+.file {
+  .fujian_css {
+    width: 270px;
+    display: flex;
+    margin: 0 auto;
+    text-align: center;
+    line-height: 32px;
+    border: 1px solid #f0f1f2;
+    border-right: 0px;
+    border-radius: 2px 0px 0px 2px;
+
+    .fujian_item {
+      cursor: pointer;
+      width: 90px;
+      height: 32px;
+      border-right: 1px solid #f0f1f2;
     }
 
-    .btn {
-      width: 410px;
-      margin: 0 auto;
+    .file_btn {
+      color: #2f53eb;
+      background-color: #cfdbfe;
     }
   }
-  .right_css{
-    .title_name,.right_title{
-      color: #9D9D9D;
-      margin-left: 20px;
-    }
-    .right_item{
-       color: #333333;
-       margin: 10px 0;
-        margin-left: 20px;
-    }
-    .img_css{
-      width: 100px;
-      height: 100px;
-      margin: 10px 0;
-      margin-left: 20px;
-    }
+
+  .file_tips {
+    margin: 10px auto;
+    width: 50%;
+  }
+
+  .file_img {
+    width: 525px;
+    height: 332px;
+    margin: 20px auto;
+  }
+
+  .img_css {
+    width: 525px;
+    height: 332px;
+  }
+
+  .btn {
+    width: 410px;
+    margin: 0 auto;
   }
-  ::v-deep .el-drawer.rtl{
-    overflow-y: scroll;
+}
+
+.right_css {
+
+  .title_name,
+  .right_title {
+    color: #9D9D9D;
+    margin-left: 20px;
   }
-  .red_text{
-    color: red;
+
+  .right_item {
+    color: #333333;
+    margin: 10px 0;
+    margin-left: 20px;
   }
+
+  .img_css {
+    width: 100px;
+    height: 100px;
+    margin: 10px 0;
+    margin-left: 20px;
+  }
+}
+
+::v-deep .el-drawer.rtl {
+  overflow-y: scroll;
+}
+
+.red_text {
+  color: red;
+}
 </style>

src/views/parkReportManagement/vehicleInformationReporting.vue

@@ -16,16 +16,15 @@
               <el-input class='find' placeholder="可按司机姓名和账号查找" @keyup.enter.native="find" v-model="searchkeyWord"
                 clearable @change="find"></el-input>
               <el-button class="search" @click="find"><img width="16" height="16" style="margin-left: -8px"
-                  src="../../../public/img/sousuo.png" /></el-button><span
-                class="count_css">共{{ deptBudgetTotal }}条</span>
+                  src="../../../public/img/sousuo.png" /></el-button><span class="count_css">共{{ deptBudgetTotal
+                  }}条</span>
             </div>
           </el-col>
         </el-row>
         <el-row>
           <el-col>
             <div class="search_btn">
-              <div :class="search == 1 ? 'search' : 'searchNo'" class="search_item search_block"
-                @click="searchBtn(1)">
+              <div :class="search == 1 ? 'search' : 'searchNo'" class="search_item search_block" @click="searchBtn(1)">
                 待上报
               </div>
               <div :class="search == 2 ? 'search' : 'searchNo'" class="search_item" @click="searchBtn(2)">
@@ -45,7 +44,7 @@
         </el-row>
       </div>
       <el-table :data="tableData" style="width: 98%; margin: 0 auto; border-radius: 10px" height="55.8vh" border
-        highlight-current-row @row-click="handleRowClick" @selection-change="handleSelectionChange" >
+        highlight-current-row @row-click="handleRowClick" @selection-change="handleSelectionChange">
         <el-table-column type="selection" width="55" :selectable="selectInit">
         </el-table-column>
         <el-table-column type="index" label="序号" width="50">
@@ -60,45 +59,50 @@
         <el-table-column prop="guaCarNumber" label="挂车车牌号"></el-table-column>
         <el-table-column prop="drivingLicenseValidityDate" label="行驶证有效期">
           <template slot-scope="scope">
-            <span :class="scope.row.drivingOverdueFlag == 1?'red_text':''">{{scope.row.drivingLicenseValidityDate}}</span>
+            <span
+              :class="scope.row.drivingOverdueFlag == 1 ? 'red_text' : ''">{{ scope.row.drivingLicenseValidityDate }}</span>
           </template>
         </el-table-column>
         <el-table-column prop="trailerLicenseValidityDate" label="挂车行驶证有效期">
-           <template slot-scope="scope">
-            <span :class="scope.row.trailerOverdueFlag == 1?'red_text':''">{{scope.row.trailerLicenseValidityDate}}</span>
+          <template slot-scope="scope">
+            <span
+              :class="scope.row.trailerOverdueFlag == 1 ? 'red_text' : ''">{{ scope.row.trailerLicenseValidityDate }}</span>
           </template>
         </el-table-column>
         <el-table-column prop="operationCertificateValidityDate" label="道路运输证有效期">
           <template slot-scope="scope">
-            <span :class="scope.row.operationOverdueFlag == 1?'red_text':''">{{scope.row.operationCertificateValidityDate}}</span>
+            <span
+              :class="scope.row.operationOverdueFlag == 1 ? 'red_text' : ''">{{ scope.row.operationCertificateValidityDate }}</span>
           </template>
         </el-table-column>
         <el-table-column prop="updateDate" label="上报时间">
           <template slot-scope="scope">
-            <span v-if="scope.row.escalationStatus&&scope.row.escalationStatus != '未认证' && scope.row.escalationStatus != '待上报'">{{scope.row.updateDate}}</span><!-- 未认证和待上报不显示时间 -->
+            <span
+              v-if="scope.row.escalationStatus && scope.row.escalationStatus != '未认证' && scope.row.escalationStatus != '待上报'">{{ scope.row.updateDate }}</span>
+            <!-- 未认证和待上报不显示时间 -->
           </template>
         </el-table-column>
         <el-table-column prop="paymentDate" label="附件">
-          <template slot-scope="scope" style="text-align: center" v-if="scope.row.backStageStatus !='未认证'">
+          <template slot-scope="scope" style="text-align: center" v-if="scope.row.backStageStatus != '未认证'">
             <span class="btn_css btn_css1" @click="fujianLook(scope.row)">查看</span>
             <el-tooltip placement="top" v-if="
-                scope.row.overdueFlag == 1 ||
-                scope.row.driverOverdueFlag == 1 ||
-                scope.row.drivingOverdueFlag == 1 ||
-                scope.row.trailerOverdueFlag == 1 ||
-                scope.row.qualificationOverdueFlag == 1 ||
-                scope.row.operationOverdueFlag == 1 ||
-                scope.row.trailerOperationOverdueFlag == 1
-              ">
+              scope.row.overdueFlag == 1 ||
+              scope.row.driverOverdueFlag == 1 ||
+              scope.row.drivingOverdueFlag == 1 ||
+              scope.row.trailerOverdueFlag == 1 ||
+              scope.row.qualificationOverdueFlag == 1 ||
+              scope.row.operationOverdueFlag == 1 ||
+              scope.row.trailerOperationOverdueFlag == 1
+            ">
               <div slot="content">
-                  <!-- <span v-if="scope.row.overdueFlag == 1">身份证已过有效期<br /></span> -->
-                  <!-- <span v-if="scope.row.driverOverdueFlag == 1">驾驶证已过有效期<br /></span> -->
-                  <span v-if="scope.row.drivingOverdueFlag == 1">行驶证已过有效期<br /></span>
-                  <span v-if="scope.row.trailerOverdueFlag == 1">挂车行驶证已过有效期<br /></span>
-                  <span v-if="scope.row.operationOverdueFlag == 1">运营证已过有效期<br /></span>
-                  <span v-if="scope.row.operationOverdueFlag == 1">道路运输证已过有效期<br /></span>
-                  <span v-if="scope.row.trailerOperationOverdueFlag == 1">挂车道路运输证已过有效期<br /></span>
-                </div>
+                <!-- <span v-if="scope.row.overdueFlag == 1">身份证已过有效期<br /></span> -->
+                <!-- <span v-if="scope.row.driverOverdueFlag == 1">驾驶证已过有效期<br /></span> -->
+                <span v-if="scope.row.drivingOverdueFlag == 1">行驶证已过有效期<br /></span>
+                <span v-if="scope.row.trailerOverdueFlag == 1">挂车行驶证已过有效期<br /></span>
+                <span v-if="scope.row.operationOverdueFlag == 1">运营证已过有效期<br /></span>
+                <span v-if="scope.row.operationOverdueFlag == 1">道路运输证已过有效期<br /></span>
+                <span v-if="scope.row.trailerOperationOverdueFlag == 1">挂车道路运输证已过有效期<br /></span>
+              </div>
               <span style="margin-top: 10px"></span>
               <img src="../../../public/img/wenhao.png" alt="" class="ask_css" />
             </el-tooltip>
@@ -107,8 +111,7 @@
         <el-table-column prop="escalationStatus" label="状态" min-width="100"></el-table-column>
         <el-table-column label="操作" min-width="200">
           <template slot-scope="scope">
-            <el-link target="_blank" @click="see(scope.row)" type="primary" :underline="false"
-              >查看</el-link>
+            <el-link target="_blank" @click="see(scope.row)" type="primary" :underline="false">查看</el-link>
             <el-divider direction="vertical"></el-divider>
             <el-link target="_blank" @click="reportInfo(scope.row)" type="primary" :underline="false"
               :disabled="scope.row.escalationStatus != '未上报' && scope.row.escalationStatus != '未通过'">上报</el-link>
@@ -158,9 +161,9 @@
           </div>
         </div>
         <div class="file_tips">
-          <span v-if="count == 1">有效期：{{file.cardValidityDate}} </span><span v-if="count == 2">
-            准驾车型：{{file.quasiDrivingVehicle}} </span> <span v-if="count == 2"> 发证机关：{{file.lssuingAuthority}} </span>
-          <span v-if="count == 4"> 从业资格证号：{{file.qualificationCertificateNumber}}</span>
+          <span v-if="count == 1">有效期：{{ file.cardValidityDate }} </span><span v-if="count == 2">
+            准驾车型：{{ file.quasiDrivingVehicle }} </span> <span v-if="count == 2"> 发证机关：{{ file.lssuingAuthority }} </span>
+          <span v-if="count == 4"> 从业资格证号：{{ file.qualificationCertificateNumber }}</span>
         </div>
         <div class="file_img">
           <img :src="img[index]" class="img_css" @click="enlarge(img[index])" />
@@ -176,131 +179,135 @@
     <el-drawer title="司机信息" :visible.sync="rightSee" style="overflow-y: auto !important">
       <div class="right_css">
         <div class="title_name">基本信息</div>
-        <div class="right_item">车辆号{{costData.carNumber}}</div>
+        <div class="right_item">车辆号{{ costData.carNumber }}</div>
         <div class="right_title">所有人</div>
-        <div class="right_item">{{costData.owner}} </div>
-         <div class="right_title">使用性质</div>
-        <div class="right_item">{{costData.useNature}} </div>
-         <!-- <div class="right_title">车辆识别代号</div>
+        <div class="right_item">{{ costData.owner }} </div>
+        <div class="right_title">使用性质</div>
+        <div class="right_item">{{ costData.useNature }} </div>
+        <!-- <div class="right_title">车辆识别代号</div>
         <div class="right_item">{{costData.useNature}} </div> -->
         <div class="right_title">发证机关</div>
-          <div class="right_item">{{costData.lssuingAuthority}} </div>
+        <div class="right_item">{{ costData.lssuingAuthority }} </div>
         <div class="right_title">车长(毫米)</div>
-        <div class="right_item">{{costData.carLong}}</div>
+        <div class="right_item">{{ costData.carLong }}</div>
         <div class="right_title">车宽(毫米)</div>
-        <div class="right_item">{{costData.carWidth}} </div>
-         <div class="right_title">车高(毫米)</div>
-        <div class="right_item">{{costData.carHeight}} </div>
+        <div class="right_item">{{ costData.carWidth }} </div>
+        <div class="right_title">车高(毫米)</div>
+        <div class="right_item">{{ costData.carHeight }} </div>
         <div class="right_title">注册日期</div>
-      <div class="right_item">{{costData.trailerLicenseRegistrationDate}} </div>
+        <div class="right_item">{{ costData.trailerLicenseRegistrationDate }} </div>
         <div class="right_title">发证日期</div>
-        <div class="right_item">{{costData.drivingLicenseIssueDate}}</div>
+        <div class="right_item">{{ costData.drivingLicenseIssueDate }}</div>
         <div class="right_title">车辆能源类型</div>
-        <div class="right_item">{{costData.energyType}}</div>
+        <div class="right_item">{{ costData.energyType }}</div>
         <div class="right_title">挂车核定载质量</div>
-        <div class="right_item">{{costData.guaCarApprovedWeight}}</div>
+        <div class="right_item">{{ costData.guaCarApprovedWeight }}</div>
         <div class="right_title">挂车总质量</div>
-        <div class="right_item">{{costData.carTotalWeight}}</div>
+        <div class="right_item">{{ costData.carTotalWeight }}</div>
         <div class="right_title">道路运输证号</div>
-        <div class="right_item">{{costData.operationCertificateNumber}} </div>
+        <div class="right_item">{{ costData.operationCertificateNumber }} </div>
         <div class="right_title">行驶证有效期</div>
-        <div class="right_item">{{costData.drivingLicenseValidityDate}} </div>
+        <div class="right_item">{{ costData.drivingLicenseValidityDate }} </div>
         <div class="right_title">行驶证照片（正页）</div>
-         <img :src="costData.drivingLicenseHomePage" alt="" class="img_css" @click="enlarge(costData.drivingLicenseHomePage)">
+        <img :src="costData.drivingLicenseHomePage" alt="" class="img_css"
+          @click="enlarge(costData.drivingLicenseHomePage)">
         <div class="right_title">行驶证照片（副页）</div>
-         <img :src="costData.drivingLicenseBackPage" alt="" class="img_css" @click="enlarge(costData.drivingLicenseBackPage)">
+        <img :src="costData.drivingLicenseBackPage" alt="" class="img_css"
+          @click="enlarge(costData.drivingLicenseBackPage)">
         <div class="right_title">道路运输证照片</div>
-         <img :src="costData.operationCertificate" alt="" class="img_css" @click="enlarge(costData.operationCertificate)">
+        <img :src="costData.operationCertificate" alt="" class="img_css"
+          @click="enlarge(costData.operationCertificate)">
         <div class="right_title">挂车道路运输证照片</div>
-         <img :src="costData.trailerOperationCertificate" alt="" class="img_css" @click="enlarge(costData.trailerOperationCertificate)">
+        <img :src="costData.trailerOperationCertificate" alt="" class="img_css"
+          @click="enlarge(costData.trailerOperationCertificate)">
         <div class="right_title">人车合影照片</div>
-         <img :src="costData.addressUrl" alt="" class="img_css" @click="enlarge(costData.addressUrl)">
+        <img :src="costData.addressUrl" alt="" class="img_css" @click="enlarge(costData.addressUrl)">
       </div>
     </el-drawer>
     <el-image-viewer v-if="imgsVisible" :on-close="closeImgViewer" :url-list="srcList" style="z-index:9999" />
   </div>
 </template>
 <script>
-  import {
-    carGetList,
-    carReport,
-    carGetInfo
-  } from "@/api/parkReportManagement";
-  export default {
-    components: {
-      "el-image-viewer": () =>
-        import("element-ui/packages/image/src/image-viewer"),
-    },
-    data() {
-      return {
-        tableData: [],
-        //分页
-        searchkeyWord: "",
-        currentPage: 1,
-        pageSize: 10,
-        deptBudgetTotal: 0,
-        deptCircularPage: {},
-        search: 1,
-        disabled: false,
-        userInfo: false,
-        fujianInfo: false,
-        file: {},
-        img: [],
-        index: "0",
-        count: "1",
-        abilityName: "身份证人像面",
-        abilityName1: "身份证国徽面",
-        //图片预览
-        srcList: [],
-        imgsVisible: false,
-        //筛选时间
-        startDate: "",
-        endDate: "",
-        value1: [],
-        //侧边查看
-        rightSee: false,
-        costData: {
-          publishTaskInfo: {}
-        },
-        musterList:[],
-      };
-    },
-    mounted() {
-      let date = new Date()
-      let date1 = new Date().setTime(date.getTime() - 365 * 60 * 60 * 24 * 1000) //一年前的时间蹉
-      date1 = new Date(parseInt(date1)).toLocaleString().split(" ")[0].replaceAll("/", "-")
-      let nian = date1.split("-")[0]
-      let yue = date1.split("-")[1]
-      if (yue < 10) {
-        yue = "0" + yue
-      }
-      let ri = date1.split("-")[2]
-      if (ri < 10) {
-        ri = "0" + ri
+import {
+  carGetList,
+  carReport,
+  carGetInfo
+} from "@/api/parkReportManagement";
+export default {
+  components: {
+    "el-image-viewer": () =>
+      import("element-ui/packages/image/src/image-viewer"),
+  },
+  data() {
+    return {
+      tableData: [],
+      //分页
+      searchkeyWord: "",
+      currentPage: 1,
+      pageSize: 10,
+      deptBudgetTotal: 0,
+      deptCircularPage: {},
+      search: 1,
+      disabled: false,
+      userInfo: false,
+      fujianInfo: false,
+      file: {},
+      img: [],
+      index: "0",
+      count: "1",
+      abilityName: "身份证人像面",
+      abilityName1: "身份证国徽面",
+      //图片预览
+      srcList: [],
+      imgsVisible: false,
+      //筛选时间
+      startDate: "",
+      endDate: "",
+      value1: [],
+      //侧边查看
+      rightSee: false,
+      costData: {
+        publishTaskInfo: {}
+      },
+      musterList: [],
+    };
+  },
+  mounted() {
+    let date = new Date()
+    let date1 = new Date().setTime(date.getTime() - 365 * 60 * 60 * 24 * 1000) //一年前的时间蹉
+    date1 = new Date(parseInt(date1)).toLocaleString().split(" ")[0].replaceAll("/", "-")
+    let nian = date1.split("-")[0]
+    let yue = date1.split("-")[1]
+    if (yue < 10) {
+      yue = "0" + yue
+    }
+    let ri = date1.split("-")[2]
+    if (ri < 10) {
+      ri = "0" + ri
+    }
+    this.startDate = nian + "-" + yue + "-" + ri //一年前的時間
+    this.endDate = date.getFullYear() + "-" + (date.getMonth() + 1 < 10 ? "0" + (date.getMonth() + 1) : date
+      .getMonth() + 1) + "-" + (date.getDate() < 10 ? "0" + date.getDate() : date.getDate()) //當前時間
+    this.value1.push(this.startDate)
+    this.value1.push(this.endDate)
+    this.getList();
+  },
+  methods: {
+    //上报
+    escalation() {
+      let that = this
+      if (this.musterList.length == 0) {
+        this.$message.error("请勾选要上报的条目")
+        return
       }
-      this.startDate = nian + "-" + yue + "-" + ri //一年前的時間
-      this.endDate = date.getFullYear() + "-" + (date.getMonth() + 1 < 10 ? "0" + (date.getMonth() + 1) : date
-        .getMonth()+1) + "-" + (date.getDate() < 10 ? "0" + date.getDate() : date.getDate()) //當前時間
-      this.value1.push(this.startDate)
-      this.value1.push(this.endDate)
-      this.getList();
-    },
-    methods: {
-      //上报
-      escalation(){
-        let that = this
-        if(this.musterList.length == 0){
-          this.$message.error("请勾选要上报的条目")
-          return
-        }
-          this.$confirm("确定上报信息？", "提示", {
-          confirmButtonText: "确定",
-          cancelButtonText: "取消",
-          type: "warning",
-        }).then(() => {
-          carReport({hyDriverCarInfoList:this.musterList})
+      this.$confirm("确定上报信息？", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      }).then(() => {
+        carReport({ hyDriverCarInfoList: this.musterList })
           .then((response) => {
-             if (response.code == 200) {
+            if (response.code == 200) {
               that.$notify({
                 title: "成功",
                 message: "车辆上报成功！",
@@ -309,325 +316,335 @@
               that.musterList = []
               that.getList();
             }
+          }).catch(() => {
+            that.musterList = []
+            that.listLoading = false
           })
+      })
+    },
+    handleRowClick(row) {
+      return true
+    },
+    handleSelectionChange(val) {
+      this.musterList = val;
+      console.log(this.musterList)
+    },
+    see(row) {
+      this.loading = true
+      this.rightSee = true
+      carGetInfo({
+        id: row.id
+      }).then(response => {
+        this.costData = response.data
+        this.listLoading = false
+      })
+        .catch(() => {
+          this.listLoading = false
         })
-      },
-       handleRowClick(row) {
-        return true
-       },
-      handleSelectionChange(val){
-         this.musterList = val;
-         console.log(this.musterList)
-      },
-      see(row) { 
-        this.loading = true
-        this.rightSee = true
-        carGetInfo({
-            id: row.id
-          }).then(response => {
-            this.costData = response.data
-            this.listLoading = false
-          })
-          .catch(() => {
-            this.listLoading = false
-          })
-      },
-      reportInfo(row) { //上报
+    },
+    reportInfo(row) { //上报
       this.musterList.push(row)
       this.escalation()
-      },
-      dateChange(e) {
-        console.log(this.value1)
-        this.startDate = e[0]
-        this.endDate = e[1]
-        this.getList()
-      },
-      closeImgViewer() {
-        this.srcList = []
-        this.imgsVisible = false;
-      },
-      enlarge(url) {
-        this.imgsVisible = true;
-        this.srcList.push(url)
-      },
+    },
+    dateChange(e) {
+      console.log(this.value1)
+      this.startDate = e[0]
+      this.endDate = e[1]
+      this.getList()
+    },
+    closeImgViewer() {
+      this.srcList = []
+      this.imgsVisible = false;
+    },
+    enlarge(url) {
+      this.imgsVisible = true;
+      this.srcList.push(url)
+    },
 
-      getList() {
-        this.listLoading = true;
-        let _obj = {};
-        _obj.currentPage = this.currentPage;
-        _obj.pageSize = this.pageSize;
-        _obj.searchKeyWord = this.searchkeyWord;
-        _obj.searchType = this.search;
-        _obj.startDate = this.startDate
-        _obj.endDate = this.endDate
-        carGetList(_obj)
-          .then((response) => {
-            this.tableData = response.data.records;
-            for (let i = 0; i < this.tableData.length; i++) {
-              this.tableData[i].iconShow = true;
-            }
-            this.deptBudgetTotal = response.data.total;
-            this.listLoading = false;
-          })
-          .catch(() => {
-            this.listLoading = false;
-          });
-      },
-      btnChange(num) {
-        this.count = num;
-        if (num == 1) {
-          this.abilityName = "身份证人像面";
-          this.abilityName1 = "身份证国徽面";
-          this.img[0] = this.file.cardAddressUrl;
-          this.img[1] = this.file.cardBackAddressUrl;
-        } else if (num == 2) {
-          this.abilityName = "驾驶证主页";
-          this.abilityName1 = "驾驶证副页";
-          this.img[0] = this.file.driverLicenseHomePage;
-          this.img[1] = this.file.driverLicenseBackPage;
-        } else if (num == 3) {
-          this.abilityName = "行驶证主页";
-          this.abilityName1 = "行驶证副页";
-          this.img[0] = this.file.drivingLicenseHomePage;
-          this.img[1] = this.file.drivingLicenseBackPage;
-        } else if (num == 4) {
-          this.index = 0;
-          this.img[0] = this.file.qualificationCertificate;
-        } else if (num == 5) {
-          this.abilityName = "挂车行驶证主页";
-          this.abilityName1 = "挂车行驶证副页";
-          this.img[0] = this.file.trailerLicenseHomePage;
-          this.img[1] = this.file.trailerLicenseBackPage;
-        } else if (num == 6) {
-          this.index = 0;
-          this.img[0] = this.file.operationCertificate;
-        } else if (num == 7) {
-          this.index = 0;
-          this.img[0] = this.file.trailerOperationCertificate;
-        }
-      },
-      fujianLook(row) {
-        this.file = row;
-        this.index = 0;
+    getList() {
+      this.listLoading = true;
+      let _obj = {};
+      _obj.currentPage = this.currentPage;
+      _obj.pageSize = this.pageSize;
+      _obj.searchKeyWord = this.searchkeyWord;
+      _obj.searchType = this.search;
+      _obj.startDate = this.startDate
+      _obj.endDate = this.endDate
+      carGetList(_obj)
+        .then((response) => {
+          this.tableData = response.data.records;
+          for (let i = 0; i < this.tableData.length; i++) {
+            this.tableData[i].iconShow = true;
+          }
+          this.deptBudgetTotal = response.data.total;
+          this.listLoading = false;
+        })
+        .catch(() => {
+          this.listLoading = false;
+        });
+    },
+    btnChange(num) {
+      this.count = num;
+      if (num == 1) {
+        this.abilityName = "身份证人像面";
+        this.abilityName1 = "身份证国徽面";
         this.img[0] = this.file.cardAddressUrl;
         this.img[1] = this.file.cardBackAddressUrl;
-        this.fujianInfo = true;
-      },
-      fujianClose() {
-        this.count = 1;
-        this.fujianInfo = false;
-      },
-      searchBtn(num) {
-        this.search = num;
-        this.getList();
-      },
-      find() {
-        this.currentPage = 1
-        this.getList();
-      },
-      selectInit(row) {
-        if (row.escalationStatus != '未上报' && row.escalationStatus != '未通过') {  
-          return false;
-        }else{
-          return true;
-        }
-      },
-      handleSizeChange(val) {
-        console.log(`每页 ${val} 条`);
-        this.pageSize = val;
-        this.getList();
-      },
-      handleCurrentChange(val) {
-        this.currentPage = val;
-        console.log(`当前页: ${val}`);
-        this.getList();
-      },
+      } else if (num == 2) {
+        this.abilityName = "驾驶证主页";
+        this.abilityName1 = "驾驶证副页";
+        this.img[0] = this.file.driverLicenseHomePage;
+        this.img[1] = this.file.driverLicenseBackPage;
+      } else if (num == 3) {
+        this.abilityName = "行驶证主页";
+        this.abilityName1 = "行驶证副页";
+        this.img[0] = this.file.drivingLicenseHomePage;
+        this.img[1] = this.file.drivingLicenseBackPage;
+      } else if (num == 4) {
+        this.index = 0;
+        this.img[0] = this.file.qualificationCertificate;
+      } else if (num == 5) {
+        this.abilityName = "挂车行驶证主页";
+        this.abilityName1 = "挂车行驶证副页";
+        this.img[0] = this.file.trailerLicenseHomePage;
+        this.img[1] = this.file.trailerLicenseBackPage;
+      } else if (num == 6) {
+        this.index = 0;
+        this.img[0] = this.file.operationCertificate;
+      } else if (num == 7) {
+        this.index = 0;
+        this.img[0] = this.file.trailerOperationCertificate;
+      }
+    },
+    fujianLook(row) {
+      this.file = row;
+      this.index = 0;
+      this.img[0] = this.file.cardAddressUrl;
+      this.img[1] = this.file.cardBackAddressUrl;
+      this.fujianInfo = true;
+    },
+    fujianClose() {
+      this.count = 1;
+      this.fujianInfo = false;
+    },
+    searchBtn(num) {
+      this.search = num;
+      this.getList();
+    },
+    find() {
+      this.currentPage = 1
+      this.getList();
+    },
+    selectInit(row) {
+      if (row.escalationStatus != '未上报' && row.escalationStatus != '未通过') {
+        return false;
+      } else {
+        return true;
+      }
+    },
+    handleSizeChange(val) {
+      console.log(`每页 ${val} 条`);
+      this.pageSize = val;
+      this.getList();
+    },
+    handleCurrentChange(val) {
+      this.currentPage = val;
+      console.log(`当前页: ${val}`);
+      this.getList();
     },
-  };
+  },
+};
 </script>
 <style lang="scss" scoped>
-  .center {
-    padding: 10px 20px;
-    background: #f5f6f7;
-    height: calc(100vh - 5vh);
-
-    .top_css {
-      padding: 10px;
-
-      .search_btn {
-        height: 80px;
-        background: linear-gradient(#fafbfb, #ffffff);
-        display: flex;
-        margin-top: 20px;
-
-        .search_block {
-          margin-left: 20px;
-        }
-
-        .search_item {
-          text-align: center;
-          font-size: 14px;
-          font-weight: 600;
-          line-height: 40px;
-          width: 112px;
-          height: 40px;
-          background: #f7f8f9;
-          cursor: pointer;
-          margin-top: 30px;
-        }
-
-        .searchNo {
-          color: #323233;
-        }
-
-        .search {
-          color: #2f53eb;
-          background: #ffffff;
-        }
-      }
-    }
-
-    .ask_css {
-      position: absolute;
-      margin: 3px 0 0 10px;
-    }
+.center {
+  padding: 10px 20px;
+  background: #f5f6f7;
+  height: calc(100vh - 5vh);
 
-    .center_css {
-      background: #ffffff;
-      border-radius: 1px;
-      margin-top: 10px;
-      padding-bottom: 10px;
-    }
+  .top_css {
+    padding: 10px;
 
-    .screen {
-      // float: right;
+    .search_btn {
+      height: 80px;
+      background: linear-gradient(#fafbfb, #ffffff);
       display: flex;
+      margin-top: 20px;
 
-      .search {
-        width: 40px;
-        height: 40px;
-        background: #2f53eb;
-        border-radius: 0px 2px 2px 0px;
-        border: 1px solid #DCDFE6;
-        margin-left: -1px;
+      .search_block {
+        margin-left: 20px;
       }
 
-      .count_css {
-        width: 80px;
+      .search_item {
         text-align: center;
+        font-size: 14px;
+        font-weight: 600;
         line-height: 40px;
-        color: #666666;
-      }
-    }
-
-    .el-button {
-      padding: 10px 20px !important;
-    }
-
-    .center_css {
-
-      ::v-deep .el-table th,
-      ::v-deep .el-table td {
-        text-align: center;
+        width: 112px;
+        height: 40px;
+        background: #f7f8f9;
+        cursor: pointer;
+        margin-top: 30px;
       }
 
-      .fujian {
-        font-size: 24px;
-        color: #409eff;
+      .searchNo {
+        color: #323233;
       }
 
-      .warning {
-        font-size: 14px;
-        color: #ed1d1d;
+      .search {
+        color: #2f53eb;
+        background: #ffffff;
       }
     }
   }
 
-  ::v-deep .el-table--border .el-table__header th {
-    background: #f7f8f9;
+  .ask_css {
+    position: absolute;
+    margin: 3px 0 0 10px;
   }
 
-  .btn_css {
-    color: #409eff;
-    cursor: pointer;
+  .center_css {
+    background: #ffffff;
+    border-radius: 1px;
+    margin-top: 10px;
+    padding-bottom: 10px;
   }
 
-  .btn_css1 {
-    margin-left: -20px;
-  }
+  .screen {
+    // float: right;
+    display: flex;
 
-  //批量上报按钮
-  .batch_btn {
-    margin: 0 10px;
-  }
+    .search {
+      width: 40px;
+      height: 40px;
+      background: #2f53eb;
+      border-radius: 0px 2px 2px 0px;
+      border: 1px solid #DCDFE6;
+      margin-left: -1px;
+    }
 
-  //附件
-  .file {
-    .fujian_css {
-      width: 330px;
-      display: flex;
-      margin: 0 auto;
+    .count_css {
+      width: 80px;
       text-align: center;
-      line-height: 32px;
-      border: 1px solid #f0f1f2;
-      border-right: 0px;
-      border-radius: 2px 0px 0px 2px;
+      line-height: 40px;
+      color: #666666;
+    }
+  }
 
-      .fujian_item {
-        cursor: pointer;
-        width: 90px;
-        height: 32px;
-        border-right: 1px solid #f0f1f2;
-      }
+  .el-button {
+    padding: 10px 20px !important;
+  }
 
-      .file_btn {
-        color: #2f53eb;
-        background-color: #cfdbfe;
-      }
+  .center_css {
+
+    ::v-deep .el-table th,
+    ::v-deep .el-table td {
+      text-align: center;
     }
 
-    .file_tips {
-      margin: 10px auto;
-      width: 50%;
+    .fujian {
+      font-size: 24px;
+      color: #409eff;
     }
 
-    .file_img {
-      width: 525px;
-      height: 332px;
-      margin: 20px auto;
+    .warning {
+      font-size: 14px;
+      color: #ed1d1d;
     }
+  }
+}
+
+::v-deep .el-table--border .el-table__header th {
+  background: #f7f8f9;
+}
+
+.btn_css {
+  color: #409eff;
+  cursor: pointer;
+}
 
-    .img_css {
-      width: 525px;
-      height: 332px;
+.btn_css1 {
+  margin-left: -20px;
+}
+
+//批量上报按钮
+.batch_btn {
+  margin: 0 10px;
+}
+
+//附件
+.file {
+  .fujian_css {
+    width: 330px;
+    display: flex;
+    margin: 0 auto;
+    text-align: center;
+    line-height: 32px;
+    border: 1px solid #f0f1f2;
+    border-right: 0px;
+    border-radius: 2px 0px 0px 2px;
+
+    .fujian_item {
+      cursor: pointer;
+      width: 90px;
+      height: 32px;
+      border-right: 1px solid #f0f1f2;
     }
 
-    .btn {
-      width: 410px;
-      margin: 0 auto;
+    .file_btn {
+      color: #2f53eb;
+      background-color: #cfdbfe;
     }
   }
-  .right_css{
-    .title_name,.right_title{
-      color: #9D9D9D;
-      margin-left: 20px;
-    }
-    .right_item{
-       color: #333333;
-       margin: 10px 0;
-        margin-left: 20px;
-    }
-    .img_css{
-      width: 100px;
-      height: 100px;
-      margin: 10px 0;
-      margin-left: 20px;
-    }
+
+  .file_tips {
+    margin: 10px auto;
+    width: 50%;
+  }
+
+  .file_img {
+    width: 525px;
+    height: 332px;
+    margin: 20px auto;
+  }
+
+  .img_css {
+    width: 525px;
+    height: 332px;
+  }
+
+  .btn {
+    width: 410px;
+    margin: 0 auto;
   }
-  ::v-deep .el-drawer.rtl{
-    overflow-y: scroll;
+}
+
+.right_css {
+
+  .title_name,
+  .right_title {
+    color: #9D9D9D;
+    margin-left: 20px;
   }
-  .red_text{
-    color: red;
+
+  .right_item {
+    color: #333333;
+    margin: 10px 0;
+    margin-left: 20px;
   }
+
+  .img_css {
+    width: 100px;
+    height: 100px;
+    margin: 10px 0;
+    margin-left: 20px;
+  }
+}
+
+::v-deep .el-drawer.rtl {
+  overflow-y: scroll;
+}
+
+.red_text {
+  color: red;
+}
 </style>

vue.config.js

@@ -56,7 +56,7 @@ module.exports = {
         },
         proxy: {
             '/pb': {
-                target: 'https://api.changyuntong56.com/', 
+                target: 'http://192.168.110.55:8099/', 
                 // target: 'http://192.168.110.9:8099/',       
                 // target: 'https://apitest.changyuntong56.com',
                 changeOrigin: true, // 开启代理：在本地会创建一个虚拟服务端，然后发送请求的数据，并同时接收请求的数据，这样服务端和服务端进行数据的交互就不会有跨域问题