添加验车二维码展示

src/views/Task/DaikeLetter.vue

@@ -148,12 +148,13 @@
         <el-table-column prop="leaderName" label="维护人" align="center"></el-table-column>
         <el-table-column prop="areaNewCode" label="地区" align="center" width="240px">
           <template slot-scope="scope">
-            <el-cascader  v-model="scope.row.areaNewCode"
-                          style="width: 100%"
-                          disabled
-                          :options="regionalTree"
-                          :props="{ checkStrictly: false, expandTrigger: 'hover', label: 'areaCname', value: 'areaCode', children: 'child'}"
-                          placeholder="">
+            <el-cascader
+              v-model="scope.row.areaNewCode"
+              style="width: 100%"
+              disabled
+              :options="regionalTree"
+              :props="{ checkStrictly: false, expandTrigger: 'hover', label: 'areaCname', value: 'areaCode', children: 'child'}"
+              placeholder="">
             </el-cascader>
           </template>
         </el-table-column>
@@ -272,7 +273,9 @@ export default {
           this.salespersonData = res.data;
           if(this.salespersonData.length>0) {
             this.salespersonData.forEach(item => {
-              item.areaNewCode = item.liveAddress.split(',')
+              if(item.liveAddress) {
+                item.areaNewCode = item.liveAddress.split(',')
+              }
             })
             console.log(123123123, this.salespersonData)
           }

src/views/Task/daikeComponents/KtLetter1.vue

@@ -1412,6 +1412,7 @@
                         @click="signature(reslistitem.result.companyId)" v-show="reslistitem.orderstatus == '2' &&
                           !('editStatus' in reslistitem.result) && reslistitem.namesimple == '平安财险'
                           ">生成签章</el-button>
+                      <el-button v-if="vehicleInspectionUrl" type="text" size="small" style="font-size: 14px" @click="validateCarCode">验车二维码</el-button>
                     </div>
                   </div>
                   <!-- <div style="line-height: 25px">
@@ -1579,7 +1580,6 @@
                     </div>
                   </div> -->
                 </el-col>
-
                 <!-- <el-col :gutter="20" :span="24" class="company-checked-left">
                   <div class="company-checked-card" v-if="reslistitem.programme">
                     <div>
@@ -4057,12 +4057,17 @@
 
     <floatingBar />
 
+    <!-- 生成验车二维码 -->
+    <el-dialog :visible.sync="validateCarCodeShow" width="30%" title="验车二维码">
+      <div class="QRCode" ref="myQrcode"></div>
+    </el-dialog>
 
   </div>
 </template>
 <script>
+import QrCode from "qrcodejs2";
+
 let _self;
-import QRCode from "qrcodejs2";
 import Cookies from "js-cookie";
 import CommonUtil from "@/utils/comutil.js";
 import floatingBar from '@/components/customerService/floatingBar.vue';
@@ -4121,6 +4126,8 @@ export default {
       }
     };
     return {
+      validateCarCodeShow: false,
+      vehicleInspectionUrl: '',
       colSpan: {
         xs: 24, // 超小屏幕
         sm: 12, // 小屏幕
@@ -5600,6 +5607,7 @@ export default {
       showLoading: false,
       detailJiaYiTitle: '查看详情',
       oldData: {},    // 旧获取公司参数
+      myQrCode: null
     };
   },
   watch: {
@@ -8435,6 +8443,7 @@ export default {
           vehicleAndVesselTax: this.vehicleAndVesselTaxForm,
         };
         this.$api.letter.generateOrder(param).then((res) => {
+          debugger
           if (res.code == "200") {
             //上传图片
             const mergedArray = [
@@ -8506,6 +8515,24 @@ export default {
       this.bbtbcarShowChange()
       this.bbczcarShowChange()
     },
+    validateCarCode() {
+      this.validateCarCodeShow = true
+      if(this.myQrCode) {
+        this.myQrCode.clear()
+      }
+      this.$nextTick(() => {
+        console.log('二维码', this.myQrCode)
+        this.myQrCode = new QrCode(this.$refs.myQrcode, {
+          // text 需要转二维码的内容 可以是文本也可以是一个链接 是链接会直接跳走
+          text: this.vehicleInspectionUrl,
+          width: 200,
+          height: 200,
+          colorDark: "#333", //二维码颜色
+          colorLight: "#fff", //二维码背景颜色
+          correctLevel: QrCode.CorrectLevel.L, //容错率,L/M/H
+        })
+      })
+    },
     //报价
     quote(index) {
       let starttime = new Date(this.carInfo.registerDate);
@@ -8569,6 +8596,7 @@ export default {
                   })
                 console.log(_this.totalCompanyList[index].kindList, '_this.totalCompanyList[index].kindList')
                 if (_this.jqchecked) {
+                  console.log('这里是什么啊？')
                   //交强
                   _this.jqstartDate = this.transformTime(_this.jqstartDate);
                   _this.jqendDate = this.transformTime(_this.jqendDate);
@@ -8582,6 +8610,7 @@ export default {
                   });
                 }
                 if (_this.sychecked) {
+                  console.log('这里又是什么呀？')
                   _this.systartDate = this.transformTime(_this.systartDate);
                   _this.syendDate = this.transformTime(_this.syendDate);
                   //商业
@@ -8930,6 +8959,7 @@ export default {
     },
     //订单生成前数据处理事件
     OrderStageProcessing(index) {
+      console.log('订单生成前数据处理')
       if (this.tbczcarShow && this.imageList2.length > 0) {
         //投保人同车主
         this.imageList3 = JSON.parse(JSON.stringify(this.imageList2));
@@ -9039,6 +9069,7 @@ export default {
         vehicleAndVesselTax: this.vehicleAndVesselTaxForm,
         productId: this.productId
       };
+      console.log('this.apiInterfaceName', this.apiInterfaceName)
       this.$api.letter[this.apiInterfaceName](param).then((res) => {
         if (res.code == "200") {
           //上传图片
@@ -9065,6 +9096,7 @@ export default {
           this.orderno = res.data.orderno;
           if (index >= 0) {
             this.totalCompanyList[index].quoteCode = 1
+            console.log('方法是干啥的', this.totalCompanyList[index].cnName)
             this.ToolClickFun(this.totalCompanyList[index].cnName, index, this.totalCompanyList[index].id, this.totalCompanyList[index].namesimple);
           } else {
             this.totalCompanyList.map((ele, index) => {
@@ -10174,6 +10206,7 @@ export default {
               }
               this.totalCompanyList[num].quoteCode = 200;
               this.totalCompanyList[num].result = res.data;
+              this.vehicleInspectionUrl = this.totalCompanyList[num].result.vehicleInspectionUrl
               if (namesimple == "中国人寿" && res.data.companyId) {
                 this.lastCompanyId = res.data.companyId;
               }
@@ -14212,4 +14245,13 @@ export default {
     text-align: center;
   }
 }
+
+.QRCode{
+  position: relative;
+  width: 200px;
+  height: 200px;
+  overflow: hidden;
+  margin: 0 auto;
+}
+
 </style>

src/views/Task/daikeComponents/KtOrder.vue

@@ -210,6 +210,10 @@
                       <el-button type="text" size="mini" style="color: #2d4d89"
                         @click="revokeCode(item.id)">撤销二维码</el-button>
                     </el-dropdown-item>
+                    <el-dropdown-item v-if="item.vehicleInspectionUrl">
+                      <el-button type="text" size="mini" style="color: #2d4d89"
+                                 @click="validateCarCode(scope.row, item)">验车二维码</el-button>
+                    </el-dropdown-item>
                   </el-dropdown-menu>
                 </el-dropdown>
               </el-button>
@@ -775,6 +779,12 @@
         <el-button size="small" type="primary" @click="uploadinformation">上传资料</el-button>
       </span>
     </el-dialog>
+
+    <!-- 生成验车二维码 -->
+    <el-dialog :visible.sync="validateCarCodeShow" width="30%" title="验车二维码">
+      <div class="QRCode" ref="qrcode" @click="resetCode"></div>
+    </el-dialog>
+
     <el-image-viewer v-if="showViewer" :on-close="closeViewer" :z-index="9999" :url-list="[ProViewImg]" />
     <!-- 报价单 -->
     <quotationDialog ref="quotationDialog" :queryOrders="queryOrders"></quotationDialog>
@@ -948,6 +958,8 @@ export default {
       showViewer: false,
       ProViewImg: "",
       managementSource:"",
+      validateCarCodeShow: false,
+      vehicleInspectionUrl: ''
     };
   },
   components: {
@@ -1334,8 +1346,28 @@ export default {
             message: '已取消撤销二维码'
           });
         });
-
-
+    },
+    // 验车二维码
+    validateCarCode(row, item) {
+      this.validateCarCodeShow = true
+      this.vehicleInspectionUrl = item.vehicleInspectionUrl
+      this.$nextTick(() => {
+        this.qrcode = new QRCode(this.$refs.qrcode, {
+          // text 需要转二维码的内容 可以是文本也可以是一个链接 是链接会直接跳走
+          text: item.vehicleInspectionUrl,
+          width: 200,
+          height: 200,
+          colorDark: "#333", //二维码颜色
+          colorLight: "#fff", //二维码背景颜色
+          correctLevel: QRCode.CorrectLevel.L, //容错率,L/M/H
+        })
+      })
+    },
+    resetCode() {
+      if(this.qrcode) {
+        this.qrcode.clear()
+        this.qrcode.makeCode(this.vehicleInspectionUrl)
+      }
     },
     bjdpreview(companyId, userId) {
       let params = {
@@ -3882,4 +3914,11 @@ export default {
   // display: none;
   opacity: 0;
 }
+.QRCode{
+  position: relative;
+  width: 200px;
+  height: 200px;
+  overflow: hidden;
+  margin: 0 auto;
+}
 </style>