Răsfoiți Sursa

Merge branch 'dev' of http://www.baoxianzhanggui.com:8090/sxzgd/vue-insagent-pc into dev

ChengHongYu 2 ani în urmă
părinte
comite
fa983b46d1

+ 2 - 2
config/dev.env.js

@@ -5,7 +5,7 @@ const prodEnv = require('./prod.env')
 module.exports = merge(prodEnv, {
   NODE_ENV: '"development"',
   ENV_CONFIG: '"dev"',
-  // BASE_URL: '"https://test.baoxianzhanggui.com/web-api"',//测试服务器
+  BASE_URL: '"https://test.baoxianzhanggui.com/web-api"',//测试服务器
   // BASE_URL:'"https://sxzgkj.baoxianzhanggui.com/web-api"',//正式服务器
   // BASE_URL:'"https://sxzgkj.baoxianzhanggui.com/web-api"'//正式服务器
   // BASE_URL: '"http://192.168.0.115:8080/"', //凯森
@@ -17,7 +17,7 @@ module.exports = merge(prodEnv, {
   // BASE_URL: '"http://192.168.1.101:8080/"',
   // BASE_URL: '"http://192.168.0.250:8080/"',//
   // BASE_URL: '"http:///192.168.0.103:8080/"',//霍续亮
-  BASE_URL: '"http://192.168.0.52:8080/"',//贺礼霄
+  // BASE_URL: '"http://192.168.0.52:8080/"',//贺礼霄
   // BASE_URL: '"http:///192.168.0.55:8080/"',// 董鑫
   CONSOLE_BASE_URL: '"http://localhost:8080/"', //控制台测试服务器
   // CONSOLE_BASE_URL: '"https://test.baoxianzhanggui.com/console-api"' //控制台正式服务器

+ 2 - 2
config/test.env.js

@@ -6,8 +6,8 @@ module.exports = merge(prodEnv, {
   NODE_ENV: '"testing"',
   ENV_CONFIG: '"test"',
   // BASE_URL: '"http://proxy.517game.site:6100"',//测试服务器
-  // BASE_URL: '"https://test.baoxianzhanggui.com/web-api"',//测试服务器
-  BASE_URL: '"https://pre.baoxianzhanggui.com/test/"',
+  BASE_URL: '"https://test.baoxianzhanggui.com/web-api"',//测试服务器
+  // BASE_URL: '"https://pre.baoxianzhanggui.com/test/"',
   APP_BASE_URL: '"https://test.baoxianzhanggui.com/web-api"',    // app打包上传地址
   CONSOLE_BASE_URL: '"https://test.baoxianzhanggui.com/console-api"', //控制台测试服务器
   SOCKET_Url: '"wss://test.baoxianzhanggui.com/web-api/"',

+ 4 - 0
src/components/TemplateTable/index.vue

@@ -217,6 +217,7 @@
       element-loading-spinner="el-icon-loading"
       @selection-change="handleSelectionChange"
       @select-all="selectAll"
+      @row-click="rowClick"
       :row-style="{ height: '55px' }"
       :cell-style="{ padding: '0px' }"
       @current-change="handleCurrentTableChange"
@@ -562,6 +563,9 @@ export default {
     selectAll(currentRow) {
       this.$emit("selectAll", currentRow, this.$refs.table);
     },
+    rowClick(currentRow) {
+      this.$emit("rowClick", currentRow, this.$refs.table);
+    },
     handleSizeChange(value) {
       this.pagination.pageSize = value;
       this.pagination.pageNum = 1;

+ 22 - 0
src/http/moudules/insCompany.js

@@ -825,6 +825,28 @@ export const queryExtractFeeAll = (data) => {
     data
   })
 }
+export const queryAgencyUser = (params) => {
+  return axios({
+    url: '/agency/queryAgencyUser',
+    method: "get",
+    params
+  })
+}
+export const queryAgencyUserInsAreaPage = (data) => {
+  return axios({
+    url: '/agency/queryAgencyUserInsAreaPage',
+    method: "post",
+    data
+  })
+}
+export const queryAgencyLeaderById = (data) => {
+  return axios({
+    url: '/sysPartner/queryAgencyLeaderById',
+    method: "post",
+    data
+  })
+}
+
 // 合伙人、工作室管理机构树
 export const getSysDeptTree = () => {
   return axios({

+ 446 - 237
src/views/Core/components/quotationDialog.vue

@@ -1,47 +1,121 @@
 <template>
-    <el-dialog :visible.sync="dialogVisible" width="1080px" class="quotation_style">
-        <div id="pdfContentsDiv" style="padding: 25px;height: auto;" v-watermark='userId'>
-            <div slot="title" class="dialog-title quotation-title">
-                <img :src="queryOrders.logoImg" class="align" alt
-                    style="width: 28px; height: 28px;vertical-align: middle" />
-                <span>{{ queryOrders.inscompany }}-报价单</span>
-            </div>
-            <div class="vehicle">
-                <li>
-                    <span>订单号:</span>{{ queryOrders.orderno }}
-                </li>
-                <li>
-                    <span>发动机号:</span>{{ queryOrders.carinfo.engineNo }}
-                </li>
-                <li>
-                    <span>车主姓名:</span>{{ queryOrders.ownerinfo.name }}
-                </li>
-                <li>
-                    <span>车牌号:</span>{{ queryOrders.carinfo.licenseNo }}
-                </li>
-                <li>
-                    <span>车架号:</span>{{ queryOrders.carinfo.vinNo }}
-                </li>
-                <li>
-                    <span>投保人姓名:</span>{{ queryOrders.applyinfo.name }}
-                </li>
-                <li>
-                    <span>车型:</span>{{ queryOrders.carinfo.modelcname }}
-                </li>
-                <li>
-                    <span>座位数:</span>{{ queryOrders.carinfo.seatCount }}
-                </li>
-                <li>
-                    <span>被保人姓名:</span>{{ queryOrders.insureinfo.name }}
-                </li>
-                <li style="width: 100%;">
-                    <span>车辆交强险保险期间:</span>{{ queryOrders.jqstartdate }} 至 {{ queryOrders.jqenddate }}
-                </li>
-                <li style="width: 100%;" v-if="queryOrders.systartdate && queryOrders.syenddate">
-                    <span>车辆商业险保险期间:</span>{{ queryOrders.systartdate }} 至 {{ queryOrders.syenddate }}
-                </li>
-            </div>
-            <!-- <el-descriptions :column="5" border direction="vertical">
+  <el-dialog :visible.sync="dialogVisible" width="1080px" class="quotation_style">
+    <div id="pdfContentsDiv" style="padding: 25px;height: auto;" v-watermark='userId'>
+      <div slot="title" class="dialog-title quotation-title flex a-c j-s">
+        <div>
+          <img :src="queryOrders.logoImg" class="align" alt style="width: 28px; height: 28px;vertical-align: middle" />
+          <span>{{ queryOrders.inscompany }}-报价单</span>
+        </div>
+        <span style="margin-right: 30px;">{{ queryOrders.orderno }}</span>
+      </div>
+      <div class="tableInfo">
+        <div class="header">车辆信息</div>
+        <el-descriptions :column="3" border>
+          <el-descriptions-item label="车牌号">{{
+            queryOrders.carinfo.licenseNo }}</el-descriptions-item>
+          <el-descriptions-item label="车架号">{{ queryOrders.carinfo.vinNo }}</el-descriptions-item>
+          <el-descriptions-item label="发动机号">{{ queryOrders.carinfo.engineNo }}</el-descriptions-item>
+          <el-descriptions-item label="座位数">
+            {{ queryOrders.carinfo.seatCount }}
+          </el-descriptions-item>
+          <el-descriptions-item label="车型" :span="2">{{ queryOrders.carinfo.modelcname }}</el-descriptions-item>
+          <el-descriptions-item label="注册日期" :span="1.5">{{ queryOrders.carinfo.registerDate }}</el-descriptions-item>
+          <el-descriptions-item label="发证日期" :span="1.5">{{ queryOrders.carinfo.issueDate }}</el-descriptions-item>
+        </el-descriptions>
+      </div>
+      <div class="tableInfo">
+        <div class="header">投被保人信息</div>
+        <el-descriptions :column="3" border>
+          <el-descriptions-item label="车主姓名">{{
+            queryOrders.ownerinfo.name }}</el-descriptions-item>
+          <el-descriptions-item label="投保人姓名">{{ queryOrders.applyinfo.name }}</el-descriptions-item>
+          <el-descriptions-item label="被保人姓名">{{ queryOrders.insureinfo.name }}</el-descriptions-item>
+          <el-descriptions-item label="车主身份证号">
+            {{ queryOrders.ownerinfo.identifyNumber}}
+          </el-descriptions-item>
+          <el-descriptions-item label="投保人身份证号">{{ queryOrders.applyinfo.identifyNumber }}</el-descriptions-item>
+          <el-descriptions-item label="被保人身份证号">{{ queryOrders.insureinfo.identifyNumber }}</el-descriptions-item>
+        </el-descriptions>
+      </div>
+      <div class="tableInfo">
+        <div class="header">投保信息</div>
+        <el-descriptions :column="2" border>
+          <el-descriptions-item v-if="queryOrders.jqstartdate && queryOrders.jqenddate" label="交强险起保日期">{{
+            queryOrders.jqstartdate }}</el-descriptions-item>
+          <el-descriptions-item v-if="queryOrders.jqstartdate && queryOrders.jqenddate" label="交强险终保日期">{{
+            queryOrders.jqenddate }}</el-descriptions-item>
+          <el-descriptions-item v-if="queryOrders.systartdate && queryOrders.syenddate" label="商业险起保日期">{{
+            queryOrders.systartdate }}</el-descriptions-item>
+          <el-descriptions-item v-if="queryOrders.systartdate && queryOrders.syenddate" label="商业险终保日期">
+            {{ queryOrders.syenddate }}
+          </el-descriptions-item>
+        </el-descriptions>
+      </div>
+
+      <!-- <div class="tableInfo">
+        <div class="header flex a-c j-start">
+          <span>车辆信息</span>
+        </div>
+        <div class="content flex a-c  f-wrap">
+          <div class="flex a-c">
+            <div class="textBlock flex j-c a-c">车牌号</div>
+            <div class="dataBlock flex j-c a-c"></div>
+          </div>
+          <div class="flex a-c">
+            <div class="textBlock flex j-c a-c">车架号</div>
+            <div class="dataBlock flex j-c a-c">{{ queryOrders.carinfo.vinNo }}</div>
+          </div>
+          <div class="flex a-c">
+            <div class="textBlock flex j-c a-c">发动机号</div>
+            <div class="dataBlock flex j-c a-c">{{ queryOrders.carinfo.engineNo }}</div>
+          </div>
+          <div class="flex a-c">
+            <div class="textBlock flex j-c a-c" >座位数</div>
+            <div class="dataBlock flex j-c a-c">{{ queryOrders.carinfo.seatCount }}</div>
+          </div>
+          <div class="flex a-c">
+            <div class="textBlock flex j-c a-c">车型</div>
+            <div class="dataBlock flex j-c a-c">{{ queryOrders.carinfo.modelcname }}</div>
+          </div>
+        </div>
+      </div> -->
+
+      <!-- <div class="vehicle">
+        <li>
+          <span>订单号:</span>
+        </li>
+        <li>
+          <span>发动机号:</span>{{ queryOrders.carinfo.engineNo }}
+        </li>
+        <li>
+          <span>车主姓名:</span>{{ queryOrders.ownerinfo.name }}
+        </li>
+        <li>
+          <span>车牌号:</span>{{ queryOrders.carinfo.licenseNo }}
+        </li>
+        <li>
+          <span>车架号:</span>{{ queryOrders.carinfo.vinNo }}
+        </li>
+        <li>
+          <span>投保人姓名:</span>{{ queryOrders.applyinfo.name }}
+        </li>
+        <li>
+          <span>车型:</span>{{ queryOrders.carinfo.modelcname }}
+        </li>
+        <li>
+          <span>座位数:</span>{{ queryOrders.carinfo.seatCount }}
+        </li>
+        <li>
+          <span>被保人姓名:</span>{{ queryOrders.insureinfo.name }}
+        </li>
+        <li style="width: 100%;">
+          <span>车辆交强险保险期间:</span>{{ queryOrders.jqstartdate }} 至 {{ queryOrders.jqenddate }}
+        </li>
+        <li style="width: 100%;" v-if="queryOrders.systartdate && queryOrders.syenddate">
+          <span>车辆商业险保险期间:</span>{{ queryOrders.systartdate }} 至 {{ queryOrders.syenddate }}
+        </li>
+      </div> -->
+      <!-- <el-descriptions :column="5" border direction="vertical">
                 <el-descriptions-item label="交强险">{{ queryOrders.jqpremium ? '¥' + queryOrders.jqpremium : '-'
                 }}</el-descriptions-item>
                 <el-descriptions-item label="车船税">{{ queryOrders.taxamount ? '¥' + queryOrders.taxamount : '-'
@@ -54,57 +128,99 @@
                     <span style="color:#D42426">¥{{ queryOrders.sumpremium }}</span>
                 </el-descriptions-item>
             </el-descriptions> -->
-            <el-table :data="allProducts" stripe border :span-method="objectSpanMethod"
-                :header-cell-style="{ background: '#D42426 ', fontWeight: '500', color: '#fff' }" style="width: 100%">
-                <el-table-column width="100" prop="label" align="center" label="产品类型">
-                </el-table-column>
-                <el-table-column width="450" prop="name" align="center" label="险别/名称">
-                </el-table-column>
-                <el-table-column align="center" prop="amount" label="保额">
-                    <template slot-scope="scope">
-                        <div v-if="['D4', 'SY_FJ_YBW2'].includes(scope.row.kindCode)">
-                            <span>{{ scope.row.unitAmount }}</span>/<span>{{ queryOrders.carinfo.seatCount - 1 }}座</span>
-                        </div>
-                        <div v-else-if="['MJ1', 'MJ2', 'MJ3', 'MJ4'].includes(
-                            scope.row.kindCode
-                        )
-                            ">
-                            <span>{{ scope.row.deductibleRate }}</span>
-                        </div>
-                        <div v-else-if="['TY1', 'TY2', 'TY3', 'TY4'].includes(
-                            scope.row.kindCode
-                        )
-                            ">
-                            <span>{{ scope.row.serviceTimes }}/次</span>
-                        </div>
-                        <div v-else>
-                            <span>{{ scope.row.amount }}</span>
-                        </div>
-                    </template>
-                </el-table-column>
-                <el-table-column align="center" prop="coveragePremium" label="保费(元)">
-                    <template slot-scope="scope">
-                        {{ scope.row.label=='商业险'?scope.row.coveragePremium:scope.row.label=='驾意险'?scope.row.premium!=0?scope.row.premium:'-':'-' }}
-                    </template>
-                </el-table-column>
-                <el-table-column align="center" prop="totalPremium" label="总计(元)">
-                    <template slot-scope="scope">
-                        <span style="color:#D42426;font-weight: bold;">{{ scope.row.totalPremium }}</span>
-                    </template>
-                </el-table-column>
-            </el-table>
-            <div class="payable_amount">
-                <h3>
-                  <span v-if="queryOrders.jqpremium">交强险:{{  queryOrders.jqpremium + '元' }}</span>
-                    <span v-if="queryOrders.sypremium">车辆商业险:{{  queryOrders.sypremium +  '元' }}</span>
-                    <span v-if="queryOrders.jypremium">驾意险:{{  queryOrders.jypremium +  '元' }}</span>
-                    <span v-if="queryOrders.taxamount">车船税:{{  queryOrders.taxamount +  '元' }}</span>
-                </h3>
-                <h2>
-                    <span v-if="queryOrders.sumpremium">应缴金额:<b style="color:#D42426;font-size:26px">{{  queryOrders.sumpremium }}</b> <span style="color:#D42426;font-size:20px">元</span></span>
-                </h2>
+      <el-table :data="allProducts" stripe border :span-method="objectSpanMethod"
+        :header-cell-style="{ background: '#D42426 ', fontWeight: '500', color: '#fff' }" style="width: 100%">
+        <el-table-column width="100" prop="label" align="center" label="产品类型">
+        </el-table-column>
+        <el-table-column width="450" prop="name" align="center" label="险别/名称">
+        </el-table-column>
+        <el-table-column align="center" prop="amount" label="保额">
+          <template slot-scope="scope">
+            <div v-if="['D4', 'SY_FJ_YBW2'].includes(scope.row.kindCode)">
+              <span>{{ scope.row.unitAmount }}</span>/<span>{{ queryOrders.carinfo.seatCount - 1 }}座</span>
+            </div>
+            <div v-else-if="['MJ1', 'MJ2', 'MJ3', 'MJ4'].includes(
+              scope.row.kindCode
+            )
+              ">
+              <span>{{ scope.row.deductibleRate }}</span>
             </div>
-            <!-- <el-table v-if="queryOrders.jqInsuranceType && queryOrders.jqInsuranceType.length > 0"
+            <div v-else-if="['TY1', 'TY2', 'TY3', 'TY4'].includes(
+              scope.row.kindCode
+            )
+              ">
+              <span>{{ scope.row.serviceTimes }}/次</span>
+            </div>
+            <div v-else>
+              <span>{{ scope.row.amount }}</span>
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column align="center" prop="coveragePremium" label="保费(元)">
+          <template slot-scope="scope">
+            {{
+              scope.row.label == '商业险' ? scope.row.coveragePremium : '-'
+            }}
+          </template>
+        </el-table-column>
+        <el-table-column align="center" prop="totalPremium" label="总计(元)">
+          <template slot-scope="scope">
+            <span style="color:#D42426;font-weight: bold;font-size: 16px;">{{ scope.row.totalPremium }}</span>
+          </template>
+        </el-table-column>
+      </el-table>
+      <el-table v-if="jyProducts.length>0" :data="jyProducts" stripe border :span-method="objectSpanMethod1"
+        :header-cell-style="{ background: '#D42426 ', fontWeight: '500', color: '#fff' }" style="width: 100%;margin-top:20px;">
+        <el-table-column width="100" prop="label" align="center" label="驾意险名称">
+        </el-table-column>
+        <el-table-column width="450" prop="name" align="center" label="保险责任">
+        </el-table-column>
+        <el-table-column align="center" prop="amount" label="保额"></el-table-column>
+        <el-table-column align="center" prop="premium" label="保费(元)">
+          <template slot-scope="scope">
+            {{
+              scope.row.premium && scope.row.premium != 0 ? scope.row.premium : '-'
+            }}
+          </template>
+        </el-table-column>
+        <el-table-column align="center" prop="each" label="每份">
+        </el-table-column>
+        <el-table-column align="center" prop="totalPremium" label="总计(元)">
+          <template slot-scope="scope">
+            <span style="color:#D42426;font-weight: bold;font-size: 16px;">{{ queryOrders.jypremium /
+            (queryOrders.jyQuantity ? queryOrders.jyQuantity : 1)
+          }}/每份</span>
+          </template>
+        </el-table-column>
+      </el-table>
+      <div class="tableInfo" style="margin-top:20px;" v-if="queryOrders.jyName">
+        <el-descriptions direction="vertical" :column="5" border>
+          <el-descriptions-item label="驾意险名称" label-class-name="my-label">{{ queryOrders.jyName }}</el-descriptions-item>
+          <el-descriptions-item label="座位数" label-class-name="my-label">{{ queryOrders.carinfo.seatCount
+          }}座</el-descriptions-item>
+          <el-descriptions-item label="份数" label-class-name="my-label">{{ queryOrders.jyQuantity ? queryOrders.jyQuantity : 1
+          }}份</el-descriptions-item>
+          <el-descriptions-item label="每份" label-class-name="my-label">{{ queryOrders.jypremium /
+            (queryOrders.jyQuantity ? queryOrders.jyQuantity : 1)
+          }}/每份
+          </el-descriptions-item>
+          <el-descriptions-item label="合计(元)" label-class-name="my-label" content-class-name="my-content">合计:{{
+            queryOrders.jypremium }}</el-descriptions-item>
+        </el-descriptions>
+      </div>
+      <div class="payable_amount">
+        <h3>
+          <span v-if="queryOrders.jqpremium">交强险:{{ queryOrders.jqpremium + '元' }}</span>
+          <span v-if="queryOrders.sypremium">车辆商业险:{{ queryOrders.sypremium + '元' }}</span>
+          <span v-if="queryOrders.jypremium">驾意险:{{ queryOrders.jypremium + '元' }}</span>
+          <span v-if="queryOrders.taxamount">车船税:{{ queryOrders.taxamount + '元' }}</span>
+        </h3>
+        <h2>
+          <span v-if="queryOrders.sumpremium">应缴金额:<b style="color:#D42426;font-size:26px">{{ queryOrders.sumpremium
+          }}</b> <span style="color:#D42426;font-size:20px">元</span></span>
+        </h2>
+      </div>
+      <!-- <el-table v-if="queryOrders.jqInsuranceType && queryOrders.jqInsuranceType.length > 0"
                 :data="queryOrders.jqInsuranceType" stripe border
                 :header-cell-style="{ background: '#F7F7F9 ', fontWeight: '500', color: '#333333' }" style="width: 100%">
                 <el-table-column prop="name" align="center" label="交强险名称">
@@ -173,185 +289,278 @@
                     </template>
                 </el-table-column>
             </el-table> -->
-            <div style="margin: 10px 0;">报价时间:{{ queryOrders.createtime }}</div>
-            <div>注:本报价单仅供参考,最终以出单价格为准。</div>
-        </div>
-        <span slot="footer" class="dialog-footer">
-            <el-button type="primary" size="small" @click="copybjd()">截图</el-button>
-            <el-button size="small" type="primary" plain @click="dialogVisible = false;allProducts=[]">关闭</el-button>
-        </span>
-    </el-dialog>
+      <div style="margin: 10px 0;">报价时间:{{ queryOrders.createtime }}</div>
+      <div>注:本报价单仅供参考,最终以出单价格为准。</div>
+    </div>
+    <span slot="footer" class="dialog-footer">
+      <el-button type="primary" size="small" @click="copybjd()">截图</el-button>
+      <el-button size="small" type="primary" plain @click="dialogVisible = false; allProducts = []">关闭</el-button>
+    </span>
+  </el-dialog>
 </template>
 <script>
 import html2Canvas from "html2canvas";
 import Cookies from "js-cookie";
 
 export default {
-    name: "quotationDialog",
-    props: {
-        queryOrders: {
-            type: Object,
-            default: {}
-        }
-    },
-    data() {
-        return {
-            dialogVisible: false,
-            logoImg: '',
-            userId: Cookies.get("user"),
-            allProducts: []
-        }
-    },
+  name: "quotationDialog",
+  props: {
+    queryOrders: {
+      type: Object,
+      default: {}
+    }
+  },
+  data() {
+    return {
+      dialogVisible: false,
+      logoImg: '',
+      userId: Cookies.get("user"),
+      allProducts: [],
+      jyProducts: [],
+    }
+  },
 
-    created() {
+  created() {
 
+  },
+  methods: {
+    setBackupVisible: function (backupVisible) {
+      this.dialogVisible = backupVisible
+      this.queryOrders.ownerinfo.identifyNumber=this.queryOrders.ownerinfo.identifyNumber.slice(0,4)+'******'+this.queryOrders.ownerinfo.identifyNumber.slice(14,18);
+      this.queryOrders.applyinfo.identifyNumber=this.queryOrders.applyinfo.identifyNumber.slice(0,4)+'******'+this.queryOrders.applyinfo.identifyNumber.slice(14,18);
+      this.queryOrders.insureinfo.identifyNumber=this.queryOrders.insureinfo.identifyNumber.slice(0,4)+'******'+this.queryOrders.insureinfo.identifyNumber.slice(14,18);
+      let data = JSON.parse(JSON.stringify(this.queryOrders))
+      data.jqInsuranceType.forEach(e => { e.label = '交强险'; e.totalPremium = data.jqpremium });
+      if ((data.kindinfo && data.kindinfo.length > 0) || (data.accidentInfo && data.accidentInfo.length > 0)) {
+        data.kindinfo && data.kindinfo.length > 0 ? data.kindinfo.forEach(el => { el.label = '商业险', el.name = el.kindName; el.totalPremium = data.sypremium }) : data.kindinfo
+        data.accidentInfo && data.accidentInfo.length > 0 ? data.accidentInfo.forEach(e => { e.label = '驾意险'; e.totalPremium = data.jypremium; e.each = "每份" }) : data.accidentInfo
+        this.allProducts = data.jqInsuranceType.concat(data.kindinfo && data.kindinfo.length > 0 ? data.kindinfo : [])
+        this.jyProducts = data.accidentInfo && data.accidentInfo.length > 0 ? data.accidentInfo : [];
+      }
+      else {
+        this.allProducts = data.jqInsuranceType
+      }
     },
-    methods: {
-        setBackupVisible: function (backupVisible) {
-            this.dialogVisible = backupVisible
-            let data = JSON.parse(JSON.stringify(this.queryOrders))
-            data.jqInsuranceType.forEach(e => {e.label = '交强险';e.totalPremium=data.jqpremium});
-            if((data.kindinfo && data.kindinfo.length > 0)  || (data.accidentInfo && data.accidentInfo.length > 0)){
-                data.kindinfo && data.kindinfo.length > 0 ? data.kindinfo.forEach(el => {el.label = '商业险', el.name = el.kindName;el.totalPremium=data.sypremium}) : data.kindinfo
-                data.accidentInfo && data.accidentInfo.length > 0 ? data.accidentInfo.forEach(e => {e.label = '驾意险';e.totalPremium=data.jypremium}) : data.accidentInfo
-                this.allProducts =data.jqInsuranceType.concat(data.kindinfo && data.kindinfo.length > 0?data.kindinfo:[],data.accidentInfo && data.accidentInfo.length > 0? data.accidentInfo:[])
-
+    objectSpanMethod({ row, column, rowIndex, columnIndex }) {
+      if (columnIndex === 0) { // 假设我们要合并第三列(类型列)
+        const rows = this.allProducts;
+        let prevRow = rows[rowIndex - 1];
+        if (prevRow && row.label === prevRow.label) {
+          return [1, 0]; // 上一行与当前行相同,合并当前单元格
+        } else {
+          let rowspan = 1;
+          for (let i = rowIndex + 1; i < rows.length; i++) {
+            if (rows[i].label === row.label) {
+              rowspan++;
+            } else {
+              break;
             }
-            else{
-                this.allProducts=data.jqInsuranceType
+          }
+          return [rowspan, 1]; // 返回行合并数目和列合并数目
+        }
+      }
+      if (columnIndex === 4) { // 假设我们要合并第三列(类型列)
+        const rows = this.allProducts;
+        let prevRow = rows[rowIndex - 1];
+        if (prevRow && row.totalPremium === prevRow.totalPremium) {
+          return [1, 0]; // 上一行与当前行相同,合并当前单元格
+        } else {
+          let rowspan = 1;
+          for (let i = rowIndex + 1; i < rows.length; i++) {
+            if (rows[i].totalPremium === row.totalPremium) {
+              rowspan++;
+            } else {
+              break;
             }
-        },
-        objectSpanMethod({ row, column, rowIndex, columnIndex }) {
-            if (columnIndex === 0) { // 假设我们要合并第三列(类型列)
-                const rows = this.allProducts;
-                let prevRow = rows[rowIndex - 1];
-                if (prevRow && row.label === prevRow.label) {
-                    return [1, 0]; // 上一行与当前行相同,合并当前单元格
-                } else {
-                    let rowspan = 1;
-                    for (let i = rowIndex + 1; i < rows.length; i++) {
-                        if (rows[i].label === row.label) {
-                            rowspan++;
-                        } else {
-                        break;
-                        }
-                    }
-                return [rowspan, 1]; // 返回行合并数目和列合并数目
-                }
+          }
+          return [rowspan, 1]; // 返回行合并数目和列合并数目
+        }
+      }
+    },
+    objectSpanMethod1({ row, column, rowIndex, columnIndex }) {
+      if (columnIndex === 0) { // 假设我们要合并第三列(类型列)
+        const rows = this.jyProducts;
+        let prevRow = rows[rowIndex - 1];
+        if (prevRow && row.label === prevRow.label) {
+          return [1, 0]; // 上一行与当前行相同,合并当前单元格
+        } else {
+          let rowspan = 1;
+          for (let i = rowIndex + 1; i < rows.length; i++) {
+            if (rows[i].label === row.label) {
+              rowspan++;
+            } else {
+              break;
             }
-            if (columnIndex === 4) { // 假设我们要合并第三列(类型列)
-                const rows = this.allProducts;
-                let prevRow = rows[rowIndex - 1];
-                if (prevRow && row.totalPremium === prevRow.totalPremium) {
-                    return [1, 0]; // 上一行与当前行相同,合并当前单元格
-                } else {
-                    let rowspan = 1;
-                    for (let i = rowIndex + 1; i < rows.length; i++) {
-                        if (rows[i].totalPremium === row.totalPremium) {
-                            rowspan++;
-                        } else {
-                        break;
-                        }
-                    }
-                return [rowspan, 1]; // 返回行合并数目和列合并数目
-                }
+          }
+          return [rowspan, 1]; // 返回行合并数目和列合并数目
+        }
+      }
+      if (columnIndex === 4) { // 假设我们要合并第三列(类型列)
+        const rows = this.jyProducts;
+        let prevRow = rows[rowIndex - 1];
+        if (prevRow && row.each === prevRow.each) {
+          return [1, 0]; // 上一行与当前行相同,合并当前单元格
+        } else {
+          let rowspan = 1;
+          for (let i = rowIndex + 1; i < rows.length; i++) {
+            if (rows[i].each === row.each) {
+              rowspan++;
+            } else {
+              break;
             }
-        },
-
-        // 截图粘贴
-        copybjd() {
-            html2Canvas(document.getElementById("pdfContentsDiv"), {
-                allowTaint: true,
-                taintTest: false,
-                // useCORS: true
-            }).then(function (canvas) {
-                let base64Data = "";
-                base64Data = canvas.toDataURL("image/png", 1);
-                const date = new Date();
-                const saveInfo = {
-                    download: date.getTime() + `.png`,
-                    href: base64Data,
-                };
-                const element = document.createElement("a");
-                element.style.display = "none";
-                for (const key in saveInfo) {
-                    element.setAttribute(key, saveInfo[key]);
-                }
-                document.body.appendChild(element);
-                element.click();
-                setTimeout(() => {
-                    document.body.removeChild(element);
-                }, 300);
-            });
-        },
-    }
+          }
+          return [rowspan, 1]; // 返回行合并数目和列合并数目
+        }
+      }
+      if (columnIndex === 5) { // 假设我们要合并第三列(类型列)
+        const rows = this.jyProducts;
+        let prevRow = rows[rowIndex - 1];
+        if (prevRow && row.totalPremium === prevRow.totalPremium) {
+          return [1, 0]; // 上一行与当前行相同,合并当前单元格
+        } else {
+          let rowspan = 1;
+          for (let i = rowIndex + 1; i < rows.length; i++) {
+            if (rows[i].totalPremium === row.totalPremium) {
+              rowspan++;
+            } else {
+              break;
+            }
+          }
+          return [rowspan, 1]; // 返回行合并数目和列合并数目
+        }
+      }
+    },
+    // 截图粘贴
+    copybjd() {
+      html2Canvas(document.getElementById("pdfContentsDiv"), {
+        allowTaint: true,
+        taintTest: false,
+        // useCORS: true
+      }).then(function (canvas) {
+        let base64Data = "";
+        base64Data = canvas.toDataURL("image/png", 1);
+        const date = new Date();
+        const saveInfo = {
+          download: date.getTime() + `.png`,
+          href: base64Data,
+        };
+        const element = document.createElement("a");
+        element.style.display = "none";
+        for (const key in saveInfo) {
+          element.setAttribute(key, saveInfo[key]);
+        }
+        document.body.appendChild(element);
+        element.click();
+        setTimeout(() => {
+          document.body.removeChild(element);
+        }, 300);
+      });
+    },
+  }
 }
 </script>
+
 <style scoped lang="scss">
+.tableInfo {
+  margin-bottom: 20px;
+
+  .header {
+    background: rgba(212,36,38,0.06);
+    color: #000;
+    font-size: 16px;
+    font-weight: bold;
+    padding: 18px 20px;
+    box-sizing: border-box;
+    border: 1px solid #000;
+    border-bottom: none;
+  }
+}
+
 .vehicle {
-    li {
-        width: 33%;
-        padding-top: 13px;
-        display: inline-block;
-    }
+  li {
+    width: 33%;
+    padding-top: 13px;
+    display: inline-block;
+  }
 
-    span {
-        color: #868B98;
-    }
+  span {
+    color: #868B98;
+  }
 
-    margin: 10px 0 20px 0
+  margin: 10px 0 20px 0
 }
 
 .dialog-footer {
-    button {
-        width: 96px;
-        text-align: center;
-    }
+  button {
+    width: 96px;
+    text-align: center;
+  }
 }
 
 .quotation-title {
-    color: var(--themeColor);
-    font-weight: bold;
-    font-size: 16px;
+  color: var(--themeColor);
+  font-weight: bold;
+  font-size: 16px;
 }
-.payable_amount{
-    margin-top: 15px;
-    text-align: right;
-    padding: 5px 10px 0 0;
-    background: rgba(212,36,38,0.06);
-    border-bottom: 4px  #D42426 solid;
-    h3>span{
-        margin-left: 50px;
-    }
+
+.payable_amount {
+  margin-top: 15px;
+  text-align: right;
+  padding: 5px 10px 0 0;
+  background: rgba(212, 36, 38, 0.06);
+  border-bottom: 4px #D42426 solid;
+
+  h3>span {
+    margin-left: 50px;
+  }
 }
+
 /deep/ {
-    .el-dialog__header {
-        padding: 0;
+  .el-table td.el-table__cell,
+  .el-table th.el-table__cell.is-leaf {
+    border-bottom: 1px solid #000;
+  }
 
-    }
+  .el-table--border .el-table__cell,
+  .el-table__body-wrapper .el-table--border.is-scrolling-left~.el-table__fixed {
+    border-right: 1px solid #000;
+  }
 
-    .el-dialog__body {
-        padding: 0;
-        border-bottom: 1px solid #EEF1F6
-    }
+  .el-table--border,
+  .el-table--group {
+    border-top: 1px solid #000;
+  }
+  .el-dialog__header {
+    padding: 0;
 
-    .el-descriptions__body {
-        padding: 0
-    }
+  }
 
-    .el-descriptions__body .el-descriptions__table .el-descriptions-item__cell {
-        text-align: center;
-    }
+  .el-dialog__body {
+    padding: 0;
+    border-bottom: 1px solid #EEF1F6
+  }
 
-    .el-descriptions-item__content {
-        color: #333333;
-        font-weight: bold;
-    }
+  .el-descriptions-item__label.is-bordered-label {
+    color: #000;
+    font-weight: bold;
+  }
 
-    .el-descriptions-item__label.is-bordered-label {
-        background: var(--themeColor);
-        color: #fff;
+  .el-descriptions .is-bordered .el-descriptions-item__cell {
+    text-align: center;
+    border: 1px solid #000;
+  }
+
+  .el-descriptions-row {
+    .my-label {
+      background: #FFD6D7;
+      color: #000;
+      font-weight: bold;
     }
 
+    .my-content {
+      color: #D42426;
+      font-weight: bold;
+    }
+  }
 }
 </style>

+ 431 - 228
src/views/Core/components/quotationDialogPro.vue

@@ -1,25 +1,65 @@
 <template>
-     <el-dialog
-      :visible.sync="dialogVisible"
-      width="1080px"
-      class="quotation_style"
-    >
-        <div id="pdfContentsDiv" style="padding: 25px;">
-            <div slot="title" class="dialog-title quotation-title">
-                <img
-                :src="queryOrders.logoImg"
-                class="align"
-                alt
-                style="width: 28px; height: 28px;vertical-align: middle;"
-            />
-                <span style="color:#000">{{queryOrders.inscompany}}-报价单</span>
-            </div>
-            <div style="border: 1px solid #000000;margin:10px 0">
-                <div  class="quotation_title">
-                    <div style="font-weight: 500;font-size: 24px;margin-bottom:5px">{{queryOrders.inscompany}}报价单</div>
-                    <div>报价时间:{{ queryOrders.createtime }}</div>
-                </div>
-            <div class="vehicle">
+  <el-dialog :visible.sync="dialogVisible" width="1080px" class="quotation_style">
+    <div id="pdfContentsDiv" style="padding: 25px;">
+      <div slot="title" class="dialog-title quotation-title">
+        <img :src="queryOrders.logoImg" class="align" alt style="width: 28px; height: 28px;vertical-align: middle;" />
+        <span style="color:#000">{{ queryOrders.inscompany }}-报价单</span>
+      </div>
+      <div style="border: 1px solid #000000;margin:10px 0">
+        <div class="quotation_title">
+          <div style="font-weight: 500;font-size: 24px;margin-bottom:5px">{{ queryOrders.inscompany }}报价单</div>
+          <div class="flex j-s a-c" style="padding:0 20px">
+            <div>订单号:{{ queryOrders.orderno }}</div>
+            <div>报价时间:{{ queryOrders.createtime }}</div>
+          </div>
+        </div>
+        <div style="margin:16px 0">
+          <div class="tableInfo flex ">
+            <div class="header flex a-c j-c">车辆信息</div>
+            <el-descriptions :column="3" border style="width: calc(100% - 100px);">
+              <el-descriptions-item label="车牌号">{{
+                queryOrders.carinfo.licenseNo }}</el-descriptions-item>
+              <el-descriptions-item label="车架号">{{ queryOrders.carinfo.vinNo }}</el-descriptions-item>
+              <el-descriptions-item label="发动机号">{{ queryOrders.carinfo.engineNo }}</el-descriptions-item>
+              <el-descriptions-item label="座位数">
+                {{ queryOrders.carinfo.seatCount }}
+              </el-descriptions-item>
+              <el-descriptions-item label="车型" :span="2">{{ queryOrders.carinfo.modelcname }}</el-descriptions-item>
+              <el-descriptions-item label="注册日期" :span="1.5">{{ queryOrders.carinfo.registerDate }}</el-descriptions-item>
+              <el-descriptions-item label="发证日期" :span="1.5">{{ queryOrders.carinfo.issueDate }}</el-descriptions-item>
+            </el-descriptions>
+          </div>
+          <div class="tableInfo flex ">
+            <div class="header flex a-c j-c">投被保人信息</div>
+            <el-descriptions :column="3" border style="width: calc(100% - 100px);">
+              <el-descriptions-item label="车主姓名">{{
+                queryOrders.ownerinfo.name }}</el-descriptions-item>
+              <el-descriptions-item label="投保人姓名">{{ queryOrders.applyinfo.name }}</el-descriptions-item>
+              <el-descriptions-item label="被保人姓名">{{ queryOrders.insureinfo.name }}</el-descriptions-item>
+              <el-descriptions-item label="车主身份证号">
+                {{ queryOrders.ownerinfo.identifyNumber }}
+              </el-descriptions-item>
+              <el-descriptions-item label="投保人身份证号">{{ queryOrders.applyinfo.identifyNumber }}</el-descriptions-item>
+              <el-descriptions-item label="被保人身份证号">{{ queryOrders.insureinfo.identifyNumber }}</el-descriptions-item>
+            </el-descriptions>
+          </div>
+          <div class="tableInfo flex ">
+            <div class="header flex a-c j-c">投保信息</div>
+            <el-descriptions :column="2" border style="width: calc(100% - 100px);">
+              <el-descriptions-item v-if="queryOrders.jqstartdate && queryOrders.jqenddate" label="交强险起保日期">{{
+                queryOrders.jqstartdate }}</el-descriptions-item>
+              <el-descriptions-item v-if="queryOrders.jqstartdate && queryOrders.jqenddate" label="交强险终保日期">{{
+                queryOrders.jqenddate }}</el-descriptions-item>
+              <el-descriptions-item v-if="queryOrders.systartdate && queryOrders.syenddate" label="商业险起保日期">{{
+                queryOrders.systartdate }}</el-descriptions-item>
+              <el-descriptions-item v-if="queryOrders.systartdate && queryOrders.syenddate" label="商业险终保日期">
+                {{ queryOrders.syenddate }}
+              </el-descriptions-item>
+            </el-descriptions>
+          </div>
+        </div>
+
+        <!-- <div class="vehicle">
                 <li>
                     <span>订单号:</span>{{ queryOrders.orderno }}
                 </li>
@@ -47,15 +87,15 @@
                 <li>
                     <span>座位数:</span>{{ queryOrders.carinfo.seatCount }}
                 </li>
-               
+
                 <li style="width: 100%;">
                     <span>车辆交强险保险期间:</span>{{ queryOrders.jqstartdate }} 至 {{ queryOrders.jqenddate }}
                 </li>
                 <li style="width: 100%;" v-if="queryOrders.systartdate &&queryOrders.syenddate">
                     <span>车辆商业险保险期间:</span>{{ queryOrders.systartdate }} 至 {{ queryOrders.syenddate }}
                 </li>
-            </div>
-            <!-- <div class="quotation-style tax-arrears" v-if="queryOrders.kindinfo && queryOrders.kindinfo.length>0">
+            </div> -->
+        <!-- <div class="quotation-style tax-arrears" v-if="queryOrders.kindinfo && queryOrders.kindinfo.length>0">
                 <b>商业险险别</b>
                 <b>保额(元)</b>
                 <b style=" border-right:0">保费(元)</b>
@@ -85,138 +125,238 @@
                 <div v-if="queryOrders.jypremium">驾意险:<span>¥{{ queryOrders.jypremium }}</span></div>
                 <div style="font-weight: bold;">应缴金额:<span>¥{{ queryOrders.sumpremium }}</span></div>
             </div> -->
-            <el-table :data="allProducts" stripe border :span-method="objectSpanMethod"
-                :header-cell-style="{ background: 'rgba(45,77,137,0.1) ', fontWeight: 'bold', color: '#333333' }" style="width: 100%">
-                <el-table-column width="100" prop="label" align="center" label="产品类型">
-                </el-table-column>
-                <el-table-column width="450" prop="name" align="center" label="险别/名称">
-                </el-table-column>
-                <el-table-column align="center" prop="amount" label="保额">
-                    <template slot-scope="scope">
-                        <div v-if="['D4', 'SY_FJ_YBW2'].includes(scope.row.kindCode)">
-                            <span>{{ scope.row.unitAmount }}</span>/<span>{{ queryOrders.carinfo.seatCount - 1 }}座</span>
-                        </div>
-                        <div v-else-if="['MJ1', 'MJ2', 'MJ3', 'MJ4'].includes(
-                            scope.row.kindCode
-                        )
-                            ">
-                            <span>{{ scope.row.deductibleRate }}</span>
-                        </div>
-                        <div v-else-if="['TY1', 'TY2', 'TY3', 'TY4'].includes(
-                            scope.row.kindCode
-                        )
-                            ">
-                            <span>{{ scope.row.serviceTimes }}/次</span>
-                        </div>
-                        <div v-else>
-                            <span>{{ scope.row.amount }}</span>
-                        </div>
-                    </template>
-                </el-table-column>
-                <el-table-column align="center" prop="coveragePremium" label="保费(元)">
-                    <template slot-scope="scope">
-                        {{ scope.row.label=='商业险'?scope.row.coveragePremium:scope.row.label=='驾意险'?scope.row.premium:'-' }}
-                    </template>
-                </el-table-column>
-                <el-table-column align="center" prop="totalPremium" label="总计(元)">
-                    <template slot-scope="scope">
-                        <span style="color:#2D4D89 ;font-weight: bold;">{{ scope.row.totalPremium }}</span>
-                    </template>
-                </el-table-column>
-            </el-table>
-            <div class="payable_amount">
-                <h3>
-                    <span v-if="queryOrders.sypremium">车辆商业险:{{ '¥'+ queryOrders.sypremium  }}</span>
-                    <span v-if="queryOrders.jqpremium">交强险:{{ '¥'+  queryOrders.jqpremium }}</span>
-                    <span v-if="queryOrders.taxamount">车船税:{{ '¥'+  queryOrders.taxamount  }}</span>
-                    <span v-if="queryOrders.jypremium">驾意险:{{'¥'+   queryOrders.jypremium }}</span>
-                </h3>
-                <h2>
-                    <span v-if="queryOrders.sumpremium">应缴金额:<span style="color:#2D4D89;font-size:20px">¥</span><b style="color:#2D4D89 ;font-size:26px">{{  queryOrders.sumpremium }}</b> </span>
-                </h2>
-            </div>
+        <el-table :data="allProducts" stripe border :span-method="objectSpanMethod"
+          :header-cell-style="{ background: 'rgba(45,77,137,0.1) ', fontWeight: 'bold', color: '#333333' }"
+          style="width: 100%">
+          <el-table-column width="100" prop="label" align="center" label="产品类型">
+          </el-table-column>
+          <el-table-column width="450" prop="name" align="center" label="险别/名称">
+          </el-table-column>
+          <el-table-column align="center" prop="amount" label="保额">
+            <template slot-scope="scope">
+              <div v-if="['D4', 'SY_FJ_YBW2'].includes(scope.row.kindCode)">
+                <span>{{ scope.row.unitAmount }}</span>/<span>{{ queryOrders.carinfo.seatCount - 1 }}座</span>
+              </div>
+              <div v-else-if="['MJ1', 'MJ2', 'MJ3', 'MJ4'].includes(
+                scope.row.kindCode
+              )
+                ">
+                <span>{{ scope.row.deductibleRate }}</span>
+              </div>
+              <div v-else-if="['TY1', 'TY2', 'TY3', 'TY4'].includes(
+                scope.row.kindCode
+              )
+                ">
+                <span>{{ scope.row.serviceTimes }}/次</span>
+              </div>
+              <div v-else>
+                <span>{{ scope.row.amount }}</span>
+              </div>
+            </template>
+          </el-table-column>
+          <el-table-column align="center" prop="coveragePremium" label="保费(元)">
+            <template slot-scope="scope">
+              {{ scope.row.label == '商业险' ? scope.row.coveragePremium : '-'
+              }}
+            </template>
+          </el-table-column>
+          <el-table-column align="center" prop="totalPremium" label="总计(元)">
+            <template slot-scope="scope">
+              <span style="color:#2D4D89 ;font-weight: bold;font-size: 16px;">{{ scope.row.totalPremium }}</span>
+            </template>
+          </el-table-column>
+        </el-table>
+        <el-table :data="jyProducts" v-if="jyProducts.length>0" stripe border :span-method="objectSpanMethod1"
+        :header-cell-style="{ background: 'rgba(45,77,137,0.1) ', fontWeight: 'bold', color: '#333333' }" style="width: 100%">
+        <el-table-column width="100" prop="label" align="center" label="驾意险名称">
+        </el-table-column>
+        <el-table-column width="450" prop="name" align="center" label="保险责任">
+        </el-table-column>
+        <el-table-column align="center" prop="amount" label="保额"></el-table-column>
+        <el-table-column align="center" prop="premium" label="保费(元)">
+          <template slot-scope="scope">
+            {{
+              scope.row.premium && scope.row.premium != 0 ? scope.row.premium : '-'
+            }}
+          </template>
+        </el-table-column>
+        <el-table-column align="center" prop="each" label="每份">
+        </el-table-column>
+        <el-table-column align="center" prop="totalPremium" label="总计(元)">
+          <template slot-scope="scope">
+            <span style="color:#2D4D89;font-weight: bold;font-size: 16px;">{{ queryOrders.jypremium /
+            (queryOrders.jyQuantity ? queryOrders.jyQuantity : 1)
+          }}/每份</span>
+          </template>
+        </el-table-column>
+      </el-table>
+        <div class="tableInfo" v-if="queryOrders.jyName">
+          <el-descriptions direction="vertical" :column="5" border>
+            <el-descriptions-item label="驾意险名称" label-class-name="my-label">{{ queryOrders.jyName
+            }}</el-descriptions-item>
+            <el-descriptions-item label="座位数" label-class-name="my-label">{{ queryOrders.carinfo.seatCount
+            }}座</el-descriptions-item>
+            <el-descriptions-item label="份数" label-class-name="my-label">{{ queryOrders.jyQuantity ? queryOrders.jyQuantity : 1
+            }}份</el-descriptions-item>
+            <el-descriptions-item label="每份" label-class-name="my-label">{{ queryOrders.jypremium /
+              (queryOrders.jyQuantity ? queryOrders.jyQuantity : 1)
+            }}/每份
+            </el-descriptions-item>
+            <el-descriptions-item label="合计(元)" label-class-name="my-label" content-class-name="my-content">合计:{{
+              queryOrders.jypremium }}</el-descriptions-item>
+          </el-descriptions>
+        </div>
+        <div class="payable_amount">
+          <h3>
+            <span v-if="queryOrders.sypremium">车辆商业险:{{ '¥' + queryOrders.sypremium }}</span>
+            <span v-if="queryOrders.jqpremium">交强险:{{ '¥' + queryOrders.jqpremium }}</span>
+            <span v-if="queryOrders.taxamount">车船税:{{ '¥' + queryOrders.taxamount }}</span>
+            <span v-if="queryOrders.jypremium">驾意险:{{ '¥' + queryOrders.jypremium }}</span>
+          </h3>
+          <h2>
+            <span v-if="queryOrders.sumpremium">应缴金额:<span style="color:#2D4D89;font-size:20px">¥</span><b
+                style="color:#2D4D89 ;font-size:26px">{{ queryOrders.sumpremium }}</b> </span>
+          </h2>
         </div>
-        <div >注:本报价单仅供参考,最终以出单价格为准。</div>
+      </div>
+      <div>注:本报价单仅供参考,最终以出单价格为准。</div>
 
     </div>
     <span slot="footer" class="dialog-footer">
-        <el-button type="primary" class="blue_color" size="small" @click="copybjd()">截图</el-button>
-        <el-button size="small" class="blueplain_color"  @click="dialogVisible = false">关闭</el-button>
+      <el-button type="primary" class="blue_color" size="small" @click="copybjd()">截图</el-button>
+      <el-button size="small" class="blueplain_color" @click="dialogVisible = false">关闭</el-button>
     </span>
-    </el-dialog>
+  </el-dialog>
 </template>
 <script>
 import html2Canvas from "html2canvas";
 
 export default {
   name: "quotationDialog",
-    props:{
-        queryOrders:{
-            type:Object,
-            default:{}
-        }
+  props: {
+    queryOrders: {
+      type: Object,
+      default: {}
+    }
+  },
+  data() {
+    return {
+      dialogVisible: false,
+      logoImg: '',
+      allProducts: [],
+      jyProducts: [],
+    }
+  },
+  created() {
+  },
+  methods: {
+    setBackupVisible: function (backupVisible) {
+      this.dialogVisible = backupVisible
+      this.queryOrders.ownerinfo.identifyNumber=this.queryOrders.ownerinfo.identifyNumber.slice(0,4)+'******'+this.queryOrders.ownerinfo.identifyNumber.slice(14,18);
+      this.queryOrders.applyinfo.identifyNumber=this.queryOrders.applyinfo.identifyNumber.slice(0,4)+'******'+this.queryOrders.applyinfo.identifyNumber.slice(14,18);
+      this.queryOrders.insureinfo.identifyNumber=this.queryOrders.insureinfo.identifyNumber.slice(0,4)+'******'+this.queryOrders.insureinfo.identifyNumber.slice(14,18);
+      let data = JSON.parse(JSON.stringify(this.queryOrders))
+      data.jqInsuranceType.forEach(e => { e.label = '交强险'; e.totalPremium = data.jqpremium });
+      if ((data.kindinfo && data.kindinfo.length > 0) || (data.accidentInfo && data.accidentInfo.length > 0)) {
+        data.kindinfo && data.kindinfo.length > 0 ? data.kindinfo.forEach(el => { el.label = '商业险', el.name = el.kindName; el.totalPremium = data.sypremium }) : data.kindinfo
+        data.accidentInfo && data.accidentInfo.length > 0 ? data.accidentInfo.forEach(e => { e.label = '驾意险'; e.totalPremium = data.jypremium; e.each = "每份" }) : data.accidentInfo
+        this.allProducts = data.jqInsuranceType.concat(data.kindinfo && data.kindinfo.length > 0 ? data.kindinfo : [])
+        this.jyProducts = data.accidentInfo && data.accidentInfo.length > 0 ? data.accidentInfo : [];
+      }
+      else {
+        this.allProducts = data.jqInsuranceType
+      }
     },
-    data(){
-        return{
-            dialogVisible:false,
-            logoImg:'',
-            allProducts:[]
+    objectSpanMethod({ row, column, rowIndex, columnIndex }) {
+      if (columnIndex === 0) { // 假设我们要合并第三列(类型列)
+        const rows = this.allProducts;
+        let prevRow = rows[rowIndex - 1];
+        if (prevRow && row.label === prevRow.label) {
+          return [1, 0]; // 上一行与当前行相同,合并当前单元格
+        } else {
+          let rowspan = 1;
+          for (let i = rowIndex + 1; i < rows.length; i++) {
+            if (rows[i].label === row.label) {
+              rowspan++;
+            } else {
+              break;
+            }
+          }
+          return [rowspan, 1]; // 返回行合并数目和列合并数目
         }
-    },
-    created(){
-    },
-    methods:{
-        setBackupVisible: function (backupVisible) {
-            this.dialogVisible = backupVisible
-            let data = JSON.parse(JSON.stringify(this.queryOrders))
-            data.jqInsuranceType.forEach(e => {e.label = '交强险';e.totalPremium=data.jqpremium});
-            if((data.kindinfo && data.kindinfo.length > 0)  || (data.accidentInfo && data.accidentInfo.length > 0)){
-                data.kindinfo && data.kindinfo.length > 0 ? data.kindinfo.forEach(el => {el.label = '商业险', el.name = el.kindName;el.totalPremium=data.sypremium}) : data.kindinfo
-                data.accidentInfo && data.accidentInfo.length > 0 ? data.accidentInfo.forEach(e => {e.label = '驾意险';e.totalPremium=data.jypremium}) : data.accidentInfo
-                this.allProducts =data.jqInsuranceType.concat(data.kindinfo && data.kindinfo.length > 0?data.kindinfo:[],data.accidentInfo && data.accidentInfo.length > 0? data.accidentInfo:[])
-
+      }
+      if (columnIndex === 4) { // 假设我们要合并第三列(类型列)
+        const rows = this.allProducts;
+        let prevRow = rows[rowIndex - 1];
+        if (prevRow && row.totalPremium === prevRow.totalPremium) {
+          return [1, 0]; // 上一行与当前行相同,合并当前单元格
+        } else {
+          let rowspan = 1;
+          for (let i = rowIndex + 1; i < rows.length; i++) {
+            if (rows[i].totalPremium === row.totalPremium) {
+              rowspan++;
+            } else {
+              break;
             }
-            else{
-                this.allProducts=data.jqInsuranceType
+          }
+          return [rowspan, 1]; // 返回行合并数目和列合并数目
+        }
+      }
+    },
+    objectSpanMethod1({ row, column, rowIndex, columnIndex }) {
+      if (columnIndex === 0) { // 假设我们要合并第三列(类型列)
+        const rows = this.jyProducts;
+        let prevRow = rows[rowIndex - 1];
+        if (prevRow && row.label === prevRow.label) {
+          return [1, 0]; // 上一行与当前行相同,合并当前单元格
+        } else {
+          let rowspan = 1;
+          for (let i = rowIndex + 1; i < rows.length; i++) {
+            if (rows[i].label === row.label) {
+              rowspan++;
+            } else {
+              break;
             }
-        },
-        objectSpanMethod({ row, column, rowIndex, columnIndex }) {
-            if (columnIndex === 0) { // 假设我们要合并第三列(类型列)
-                const rows = this.allProducts;
-                let prevRow = rows[rowIndex - 1];
-                if (prevRow && row.label === prevRow.label) {
-                    return [1, 0]; // 上一行与当前行相同,合并当前单元格
-                } else {
-                    let rowspan = 1;
-                    for (let i = rowIndex + 1; i < rows.length; i++) {
-                        if (rows[i].label === row.label) {
-                            rowspan++;
-                        } else {
-                        break;
-                        }
-                    }
-                return [rowspan, 1]; // 返回行合并数目和列合并数目
-                }
+          }
+          return [rowspan, 1]; // 返回行合并数目和列合并数目
+        }
+      }
+      if (columnIndex === 4) { // 假设我们要合并第三列(类型列)
+        const rows = this.jyProducts;
+        let prevRow = rows[rowIndex - 1];
+        if (prevRow && row.each === prevRow.each) {
+          return [1, 0]; // 上一行与当前行相同,合并当前单元格
+        } else {
+          let rowspan = 1;
+          for (let i = rowIndex + 1; i < rows.length; i++) {
+            if (rows[i].each === row.each) {
+              rowspan++;
+            } else {
+              break;
             }
-            if (columnIndex === 4) { // 假设我们要合并第三列(类型列)
-                const rows = this.allProducts;
-                let prevRow = rows[rowIndex - 1];
-                if (prevRow && row.totalPremium === prevRow.totalPremium) {
-                    return [1, 0]; // 上一行与当前行相同,合并当前单元格
-                } else {
-                    let rowspan = 1;
-                    for (let i = rowIndex + 1; i < rows.length; i++) {
-                        if (rows[i].totalPremium === row.totalPremium) {
-                            rowspan++;
-                        } else {
-                        break;
-                        }
-                    }
-                return [rowspan, 1]; // 返回行合并数目和列合并数目
-                }
+          }
+          return [rowspan, 1]; // 返回行合并数目和列合并数目
+        }
+      }
+      if (columnIndex === 5) { // 假设我们要合并第三列(类型列)
+        const rows = this.jyProducts;
+        let prevRow = rows[rowIndex - 1];
+        if (prevRow && row.totalPremium === prevRow.totalPremium) {
+          return [1, 0]; // 上一行与当前行相同,合并当前单元格
+        } else {
+          let rowspan = 1;
+          for (let i = rowIndex + 1; i < rows.length; i++) {
+            if (rows[i].totalPremium === row.totalPremium) {
+              rowspan++;
+            } else {
+              break;
             }
-        },
-        // 截图粘贴
+          }
+          return [rowspan, 1]; // 返回行合并数目和列合并数目
+        }
+      }
+    },
+    // 截图粘贴
     copybjd() {
       html2Canvas(document.getElementById("pdfContentsDiv"), {
         allowTaint: true,
@@ -242,116 +382,179 @@ export default {
         }, 300);
       });
     },
-    }
+  }
 }
 </script>
 <style scoped lang="scss">
-.vehicle{
-    li{
-        width: 49%;
-        padding-top: 13px;
-        display: inline-block;
-    }
-    span{
-       color: #868B98 ;
-    }
-    margin: 10px 0 20px 5px
-}
-.dialog-footer{
-    button{
-        width: 96px;
-        text-align: center;
-    }
-}
-.quotation-title{
-    color: var(--themeColor);
-    font-weight: bold;
+.tableInfo {
+  .header {
+    width: 100px;
+    background: #EAEDF3;
+    color: #000;
+    padding: 0 18px;
+    box-sizing: border-box;
+    text-align: center;
     font-size: 16px;
+    font-weight: bold;
+    border: 1px solid #000;
+    border-left: none;
+    border-right: none;
+  }
 }
-.quotation_title{
+
+.vehicle {
+  li {
+    width: 49%;
+    padding-top: 13px;
+    display: inline-block;
+  }
+
+  span {
+    color: #868B98;
+  }
+
+  margin: 10px 0 20px 5px
+}
+
+.dialog-footer {
+  button {
+    width: 96px;
     text-align: center;
-    padding: 10px 0;
-    border-bottom: 1px solid #000000;
+  }
 }
-.tax-arrears{
-    b,span{
-        width: 33.3%;
-    }
+
+.quotation-title {
+  color: var(--themeColor);
+  font-weight: bold;
+  font-size: 16px;
 }
-.quotation-style{
-    font-size: 0;
-    b{
-        font-size: 14px;
-        border-top: 1px solid #000 ;
-    }
-    b,span{
-        display: inline-block;
-        box-sizing: border-box;
-        width: 33.3%;
-        text-align: center;
-        line-height: 40px;
-        border-bottom: 1px solid #000 ;
-        border-right: 1px solid #000 ;
-        font-size: 14px;
-    }
-    span:last-child{
-        border-right:0;
-        // border-bottom: 1px solid #000 ;
-    }
+
+.quotation_title {
+  text-align: center;
+  padding: 10px 0;
+  color: #000;
+  border-bottom: 1px solid #000000;
+}
+
+.tax-arrears {
+
+  b,
+  span {
+    width: 33.3%;
+  }
 }
-.blue_color{
+
+.quotation-style {
+  font-size: 0;
+
+  b {
+    font-size: 14px;
+    border-top: 1px solid #000;
+  }
+
+  b,
+  span {
+    display: inline-block;
+    box-sizing: border-box;
+    width: 33.3%;
+    text-align: center;
+    line-height: 40px;
+    border-bottom: 1px solid #000;
+    border-right: 1px solid #000;
+    font-size: 14px;
+  }
+
+  span:last-child {
+    border-right: 0;
+    // border-bottom: 1px solid #000 ;
+  }
+}
+
+.blue_color {
   color: #fff;
   background: #2D4D89;
   border: 1px solid #2D4D89;
 }
-.blueplain_color{
+
+.blueplain_color {
   color: #2D4D89;
   background: #EAEDF1;
   border: 1px solid #EAEDF1;
 }
-.money_style{
-    text-align: right ;
-    div{
-        line-height: 30px;
-    }
-    span{
-        display: inline-block;
-        width: 100px;
-        text-align: left;
-    }
+
+.money_style {
+  text-align: right;
+
+  div {
+    line-height: 30px;
+  }
+
+  span {
+    display: inline-block;
+    width: 100px;
+    text-align: left;
+  }
 }
-.payable_amount{
-    margin-top: 15px;
-    text-align: right;
-    padding-right: 10px;
-    // padding: 5px 10px 0 0;
-    h3>span{
-        margin-left: 50px;
-    }
+
+.payable_amount {
+  margin-top: 15px;
+  text-align: right;
+  padding-right: 10px;
+
+  // padding: 5px 10px 0 0;
+  h3>span {
+    margin-left: 50px;
+  }
 }
+
 /deep/ {
-    .el-dialog__header{
-        padding: 0 ;
+  .el-table td.el-table__cell,
+  .el-table th.el-table__cell.is-leaf {
+    border-bottom: 1px solid #000;
+  }
 
+  .el-table--border .el-table__cell,
+  .el-table__body-wrapper .el-table--border.is-scrolling-left~.el-table__fixed {
+    border-right: 1px solid #000;
+  }
+
+  .el-table--border,
+  .el-table--group {
+    border-top: 1px solid #000;
+  }
+
+  .el-dialog__header {
+    padding: 0;
+
+  }
+
+  .el-dialog__body {
+    padding: 0;
+    border-bottom: 1px solid #EEF1F6
+  }
+
+  .el-descriptions-item__label.is-bordered-label {
+    color: #000;
+    font-weight: bold;
+  }
+
+  .el-descriptions .is-bordered .el-descriptions-item__cell {
+    text-align: center;
+    border: 1px solid #000;
+  }
+
+  .el-descriptions-row {
+    .my-label {
+      background: #EAEDF3;
+      color: #000;
+      font-weight: bold;
     }
-    .el-dialog__body{
-        padding: 0;
-        border-bottom: 1px solid #EEF1F6
-    }
-     .el-descriptions__body{
-        padding:0
-     }
-    .el-descriptions__body .el-descriptions__table .el-descriptions-item__cell{
-        text-align: center;
-    }
-    .el-descriptions-item__content{
-        color: #333333 ;
-        font-weight: bold;
-    }
-    .el-descriptions-item__label.is-bordered-label{
-        background: var(--themeColor);
-        color: #fff;
+
+    .my-content {
+      color: #2D4D89;
+      font-weight: bold;
+      font-size: 18px;
     }
+  }
 
-}
-</style>
+}</style>

+ 47 - 49
src/views/Login.vue

@@ -159,18 +159,18 @@ import { login } from "@/api/user";
 import CryptoJS from "crypto-js";
 // import { getSysList } from "../http/moudules/sys";
 
-import { sendWebsocket,closeWebsocket  } from '@/utils/websocket.js'
+import { sendWebsocket, closeWebsocket } from "@/utils/websocket.js";
 import {
   getUserIP,
   getUserLocation,
-  getAddressLocation
+  getAddressLocation,
 } from "@/utils/ipAndAddress.js";
 export default {
   name: "Login",
   inject: ["reload"],
   components: {
     ThemePicker,
-    LangSelector
+    LangSelector,
   },
   data() {
     return {
@@ -182,12 +182,12 @@ export default {
         account: "",
         password: "",
         captcha: "",
-        src: ""
+        src: "",
       },
       fieldRules: {
         account: [{ required: true, message: "请输入账号", trigger: "blur" }],
         password: [{ required: true, message: "请输入密码", trigger: "blur" }],
-        captcha: [{ required: true, message: "请输入验证码", trigger: "blur" }]
+        captcha: [{ required: true, message: "请输入验证码", trigger: "blur" }],
       },
       checked: true,
       toggleQrCode: false,
@@ -197,7 +197,7 @@ export default {
       optionList: [],
       sysId: null,
       systemType: "1", //系统类型
-      addressInfo: {} //当前登录信息
+      addressInfo: {}, //当前登录信息
     };
   },
   created() {
@@ -213,7 +213,7 @@ export default {
   },
   methods: {
     getSysList() {
-      this.$api.sys.sysDictList().then(res => {
+      this.$api.sys.sysDictList().then((res) => {
         if (res.code === 200) {
           this.optionList = [...res.data];
           this.sysId = res.data && res.data.length > 0 && res.data[0].id;
@@ -222,7 +222,7 @@ export default {
     },
     enterEvent() {
       if (this.$route.name === "登录") {
-        document.onkeydown = e => {
+        document.onkeydown = (e) => {
           const url = e.target.baseURI.match(/login/);
           if (e.keyCode == 13 && url.includes("login")) {
             this.login();
@@ -231,7 +231,6 @@ export default {
       }
     },
     login(formName) {
-      
       // let token = CryptoJS.AES.encrypt(
       //   "2856c49f-7b34-4e83-b3c8-2c37dba7cb3b",
       //   "token"
@@ -239,7 +238,7 @@ export default {
       // console.log(token);
       // window.location.href =
       //   "http://localhost:8080/#/form/agreement?token=" + token;
-      this.$refs[formName].validate(valid => {
+      this.$refs[formName].validate((valid) => {
         if (valid) {
           this.loading = true;
           let userInfo = {
@@ -247,7 +246,7 @@ export default {
             password: this.loginForm.password,
             captcha: this.loginForm.captcha.toLowerCase(),
             captchaId: this.loginForm.captchaId,
-            sysId: this.sysId
+            sysId: this.sysId,
             // systemType: this.systemType
           };
 
@@ -275,12 +274,12 @@ export default {
 
           this.$api.login
             .login2(userInfo)
-            .then(res => {
+            .then((res) => {
               if (res.code != 200) {
                 this.$message({
                   message: res.msg,
                   type: "error",
-                  duration: 2000
+                  duration: 2000,
                 });
                 if (res.code == 500 && res.msg == "验证码不正确") {
                   this.refreshCaptcha();
@@ -290,7 +289,7 @@ export default {
                   //是否保存密码
                   Cookies.set("accountInfo", {
                     account: this.loginForm.account,
-                    password: this.loginForm.password
+                    password: this.loginForm.password,
                   });
                 } else {
                   Cookies.remove("accountInfo");
@@ -302,36 +301,35 @@ export default {
                   ).toString();
 
                   window.location.href =
-                    process.env.CONSOLE_BASE_URL +
-                    "/#/agreement/index?token=" +
-                    token;
+                    process.env.CONSOLE_BASE_URL + "/#/index?token=" + token;
                   // alert(res.data);
                 } else {
                   this.getUser();
                   Cookies.set("token", res.data); // 放置token到Cookie
                   // this.submitLocation();
                   this.getDictItems();
-                  setTimeout(()=>{
-                    let userId=sessionStorage.getItem("user")
-                    let data={
-                    ...this.addressInfo,
-                    userId,
-                    systemType:this.systemType
-                  }
-                  sendWebsocket(`${process.env.SOCKET_Url}/pcWebsocket/${userId}`,data)
-                  // sendWebsocket(`/pcWebsocket/${userId}`,data)
-                  },1000)
-                  
-
+                  setTimeout(() => {
+                    let userId = sessionStorage.getItem("user");
+                    let data = {
+                      ...this.addressInfo,
+                      userId,
+                      systemType: this.systemType,
+                    };
+                    sendWebsocket(
+                      `${process.env.SOCKET_Url}/pcWebsocket/${userId}`,
+                      data
+                    );
+                    // sendWebsocket(`/pcWebsocket/${userId}`,data)
+                  }, 1000);
                 }
               }
               this.loading = false;
             })
-            .catch(res => {
+            .catch((res) => {
               this.$message({
                 message: res.message,
                 type: "error",
-                duration: 2000
+                duration: 2000,
               });
             });
         } else {
@@ -343,13 +341,13 @@ export default {
     submitLocation() {
       let location = {
         systemType: this.systemType,
-        ...this.addressInfo
+        ...this.addressInfo,
       };
-      this.$api.login.uploadLocationInfo(location).then(res => {
+      this.$api.login.uploadLocationInfo(location).then((res) => {
         if (res.code !== 200) {
           this.$message({
             message: res.msg,
-            type: "error"
+            type: "error",
           });
         }
       });
@@ -358,11 +356,11 @@ export default {
     getDictItems() {
       //--数据字典--
       // 性别
-      this.$api.dict.findByLableName("sex").then(response => {
+      this.$api.dict.findByLableName("sex").then((response) => {
         localStorage.setItem("sexOptions", JSON.stringify(response.data)); // 保存用户到本地会话
       });
       // 状态
-      this.$api.dict.findByLableName("user_status").then(response => {
+      this.$api.dict.findByLableName("user_status").then((response) => {
         localStorage.setItem(
           "user_statusoptions",
           JSON.stringify(response.data)
@@ -371,7 +369,7 @@ export default {
     },
     // 用户信息
     getUser() {
-      this.$api.user.getLoginUser().then(response => {
+      this.$api.user.getLoginUser().then((response) => {
         if (response.code == 200) {
           //头像地址拼接
           if (
@@ -394,7 +392,7 @@ export default {
           this.$message.error(response.msg);
         }
       });
-      this.$api.role.findAll().then(res => {
+      this.$api.role.findAll().then((res) => {
         localStorage.setItem("find_all", JSON.stringify(res.data));
       });
     },
@@ -412,7 +410,7 @@ export default {
       this.$refs.loginForm.resetFields();
     },
     // 切换主题
-    onThemeChange: function(themeColor) {
+    onThemeChange: function (themeColor) {
       this.$store.commit("setThemeColor", themeColor);
     },
     switchLogin() {
@@ -429,14 +427,14 @@ export default {
       let url = process.env.BASE_URL + "/scanQrCode?uuid=" + uuid;
       this.$nextTick(() => {
         this.creatQrCode(url);
-        this.$api.login.getQRCode(uuid).then(res => {
+        this.$api.login.getQRCode(uuid).then((res) => {
           this.uuid = res.data.uuid;
           this.startPolling();
         });
       });
     },
     checkScanStatus() {
-      this.$api.login.QrCodeStatusQuery(this.uuid).then(res => {
+      this.$api.login.QrCodeStatusQuery(this.uuid).then((res) => {
         if (res.data.statusCode == 20000) {
           this.tipVisibility = true;
           this.loadingCode = true;
@@ -477,10 +475,10 @@ export default {
           height: 200,
           colorDark: "#000000",
           colorLight: "#ffffff",
-          correctLevel: QRCode.CorrectLevel.H
+          correctLevel: QRCode.CorrectLevel.H,
         });
       }
-    }
+    },
   },
 
   beforeDestroy() {
@@ -490,22 +488,22 @@ export default {
   mounted() {
     this.refreshCaptcha();
     /**获取当前登录的ip地址 */
-    getUserIP(ip => {
-      getAddressLocation(ip, info => {
-        console.log(info,22222222222);
+    getUserIP((ip) => {
+      getAddressLocation(ip, (info) => {
+        console.log(info, 22222222222);
         this.addressInfo = info;
       });
     });
   },
   computed: {
     ...mapState({
-      themeColor: state => state.app.themeColor
-    })
+      themeColor: (state) => state.app.themeColor,
+    }),
   },
   //销毁函数
   destroyed() {
     document.onkeydown = null;
-  }
+  },
 };
 </script>
 

+ 149 - 28
src/views/PeopleManage/InstitutionalExtraction.vue

@@ -1,19 +1,26 @@
 <template>
   <div>
-    <div>
-      
-          <templateTable
-            :formList="formList"
-            :searchData.sync="queryFrom"
-            :tableConfig="tableConfig"
-            :data="pageResult"
-            @getList="findPage"
-            @handleSearchList="handleSearchList"
-            :pagination="pageData"
-          >
+    <templateTable :formList="formList" :searchData.sync="queryFrom" :tableConfig="tableConfig" :data="pageResult"
+      @getList="findPage" @handleSearchList="handleSearchList" :pagination="pageData">
+    </templateTable>
+    <el-dialog title="详情" :visible.sync="dialogVisible" width="70%">
+      <el-row>
+        <el-col :span="5">
+          <templateTable :tableConfig="personneltableConfig" :data="pageResultpersonnel" @getList="findPagepersonnel"
+            @rowClick="rowClick">
           </templateTable>
-    </div>
-    
+        </el-col>
+        <el-col :span="18" :offset="1">
+          <templateTable :tableConfig="depttableConfig" :data="pageResultdept" @getList="findPagedept"
+            :pagination="pageDatadept">
+          </templateTable>
+        </el-col>
+      </el-row>
+
+      <div slot="footer" class="dialog-footer">
+        <el-button size="small" @click="dialogVisible = false">关 闭</el-button>
+      </div>
+    </el-dialog>
   </div>
 </template>
 
@@ -25,8 +32,9 @@ export default {
   },
   data() {
     return {
+      dialogVisible: false,
       formList: [
-      {
+        {
           label: "工号",
           prop: "userId",
           type: "input",
@@ -55,33 +63,148 @@ export default {
           { prop: "cashFee", label: "可提现金额", type: "text" },
           { prop: "startTime", label: "核算开始时间", type: "text" },
         ],
+        optBtns: [
+          {
+            type: "primary",
+            label: "详情",
+            click: (row, index) => {
+              return this.detail(row);
+            },
+          },
+        ],
         loading: true,
         isPaginationShow: true,
         isShowIndex: true,
       },
-      rules:{
+      personneltableConfig: {
+        columns: [
+          // 数据列
+          { prop: "name", label: "姓名", type: "text" },
+        ],
+        tableHeight:480,
+        loading: true,
+        isPaginationShow: false,
+        isShowIndex: true,
+      },
+      depttableConfig: {
+        columns: [
+          // 数据列
+          { prop: "userId", label: "员工编号", type: "text" },
+          { prop: "userName", label: "员工姓名", type: "text" },
+          { prop: "companyId", label: "子订单编号", type: "text" },
+          { prop: "orderstatus", label: "订单状态", type: "statMap",options:[
+            {
+              label:'报价中',
+              value:'0'
+            },
+            {
+              label:'待核保',
+              value:'1'
+            },
+            {
+              label:'已核保待缴费',
+              value:'2'
+            },
+            {
+              label:'已承保',
+              value:'3'
+            },
+            {
+              label:'核保退回',
+              value:'4'
+            },
+          ]},
+          { prop: "licenseno", label: "车牌号", type: "text" },
+          { prop: "sypremium", label: "商业险", type: "text" },
+          { prop: "jqpremium", label: "交强险", type: "text" },
+          { prop: "jypremium", label: "驾意险", type: "text" },
+          { prop: "sumpremium", label: "总保费", type: "text" },
+
+          { prop: "createtime", label: "创建时间 ", type: "text" },
+        ],
+        tableHeight:450,
+        loading: true,
+        isPaginationShow: true,
+        isShowIndex: true,
+      },
+      pageResultpersonnel: [],
+      pageResultdept: [],
+      rules: {
         proportional: [
-            { required: true, message: '请输入抽成比例', trigger: 'blur' },
-          ],
-          userName: [
-            { required: true, message: '请选择名称', trigger: 'change' }
-          ],
-         
+          { required: true, message: '请输入抽成比例', trigger: 'blur' },
+        ],
+        userName: [
+          { required: true, message: '请选择名称', trigger: 'change' }
+        ],
+
       },
       pageData: {
         pageNum: 1,
         pageSize: 10,
         totalSize: 0,
       },
-     
+      pageDatadept: {
+        pageNum: 1,
+        pageSize: 10,
+        totalSize: 0,
+      },
       queryFrom: {},
       pageResult: [],
+      rowDept: '',
+      userId: '',
+      startTime:''
     };
   },
   created() {
     this.findPage();
   },
   methods: {
+    detail(row) {
+      this.dialogVisible = true
+      this.rowDept = row.deptId
+      this.startTime = row.startTime
+      this.findPagepersonnel({ deptId: row.deptId })
+      this.findPagedept()
+    },
+    rowClick(val) {
+      this.userId =''
+      this.userId = val.id
+      this.pageDatadept=   {
+        pageNum: 1,
+        pageSize: 10,
+        totalSize: 0,
+      },
+      this.findPagedept()
+    },
+    findPagepersonnel(data) {
+      this.personneltableConfig.loading = true;
+      this.$api.insCompany
+        .queryAgencyUser({
+          ...data,
+        })
+        .then((res) => {
+          this.personneltableConfig.loading = false;
+          this.pageResultpersonnel = res.data;
+        });
+    },
+    findPagedept(data) {
+      this.depttableConfig.loading = true;
+      this.$api.insCompany
+        .queryAgencyUserInsAreaPage({
+          userId: this.userId,
+          deptId: this.rowDept,
+          startTime:this.startTime,
+          ...data,
+          ...this.pageDatadept
+        })
+        .then((res) => {
+          this.depttableConfig.loading = false;
+          this.pageResultdept = res.data.records;
+          this.pageDatadept.pageNum = res.data.current;
+          this.pageDatadept.pageSize = res.data.size;
+          this.pageDatadept.totalSize = res.data.total;
+        });
+    },
     // 查询Start
     queryStaffInfo() {
       this.findPage();
@@ -103,17 +226,15 @@ export default {
           this.pageData.totalSize = res.data.totalSize;
         });
     },
-   
+
     handleSearchList(data) {
       this.findPage(data);
     },
-   
+
     // 下一步
-    
+
   },
 };
 </script>
 
-<style scoped>
-
-</style>
+<style scoped></style>

+ 91 - 0
src/views/PeopleManage/MobileZoomDiv.vue

@@ -0,0 +1,91 @@
+<template>
+    <div class="resizable-draggable" :style="{ transform: `scale(${scale})`, left: `${x}px`, top: `${y}px` }"
+        @mousedown="startDrag" @wheel="zoom">
+        <slot></slot>
+    </div>
+</template>  
+  
+<script>
+export default {
+    name: 'ResizableDraggable',
+    data() {
+        return {
+            dragging: false,
+            resizing: false,
+            startX: 0,
+            startY: 0,
+            scale: 1,
+            x: 0,
+            y: 0
+        };
+    },
+    methods: {
+        zoom(event) {
+                event.preventDefault();
+                const delta = event.deltaY < 0 ? 1.1 : 0.9;
+                this.scale *= delta;
+                },
+
+        startDrag(event) {
+            this.dragging = true;
+            this.startX = event.clientX - this.x;
+            this.startY = event.clientY - this.y;
+            console.log(this.startX ,this.startY,11111111111);
+            document.addEventListener('mousemove', this.drag);
+            document.addEventListener('mouseup', this.stopDrag);
+        },
+        drag(event) {
+            if (!this.dragging) return;
+            this.x = event.clientX - this.startX;
+            this.y = event.clientY - this.startY;
+            console.log(this.x ,this.y,2222222222);
+
+        },
+        stopDrag() {
+            if (!this.dragging) return;
+            this.dragging = false;
+            document.removeEventListener('mousemove', this.drag);
+            document.removeEventListener('mouseup', this.stopDrag);
+        },
+        startResize(type) {
+            this.resizing = true;
+            const num = type === 'narrow' ? -0.2 : 0.2;
+            this.scale += num;
+            this.scale = Math.max(1, Math.min(this.scale, 2)); // 限制缩放范围
+        },
+        reset() {
+            this.dragging = false;
+            this.resizing = false;
+            this.startX = 0;
+            this.startY = 0;
+            this.scale = 1;
+            this.x = 0;
+            this.y = 0;
+        }
+        // startResize(event) {
+        //   this.resizing = true;
+        //   const rect = this.$el.getBoundingClientRect();
+        //   const scaleFactor = event.clientX - rect.left > rect.width / 2 ? 1.1 : 0.9;
+        //   this.scale *= scaleFactor;
+        //   this.scale = Math.max(0.1, Math.min(this.scale, 2)); // 限制缩放范围
+        //   event.preventDefault();
+        // }
+    }
+};
+</script>  
+    
+<style scoped>
+.resizable-draggable {
+    /* width: 100%;
+    height: 100%; */
+    width: 500px;
+    height: auto;
+    position: absolute;
+    transition: transform 0.2s ease-in-out;
+    cursor: move;
+    /* 其他样式 */
+}
+
+
+</style>
+  

+ 88 - 0
src/views/PeopleManage/MobileZoomDivR.vue

@@ -0,0 +1,88 @@
+<template>
+    <div class="resizable-draggable" :style="{ transform: `scale(${scale})`, right: `${x}px`, bottom: `${y}px` }"
+        @mousedown="startDrag" @wheel="zoom">
+        <slot></slot>
+    </div>
+</template>  
+  
+<script>
+export default {
+    name: 'ResizableDraggable',
+    data() {
+        return {
+            dragging: false,
+            resizing: false,
+            startX: 0,
+            startY: 0,
+            scale: 1,
+            x: 0,
+            y: 0
+        };
+    },
+    methods: {
+        zoom(event) {
+            event.preventDefault();
+            const delta = event.deltaY < 0 ? 1.1 : 0.9;
+            this.scale *= delta;
+        },
+
+        startDrag(event) {
+            this.dragging = true;
+            this.startX = event.clientX + this.x;
+            this.startY = event.clientY + this.y;
+            document.addEventListener('mousemove', this.drag);
+            document.addEventListener('mouseup', this.stopDrag);
+        },
+        drag(event) {
+            if (!this.dragging) return;
+            this.x = this.startX - event.clientX;
+            this.y = this.startY - event.clientY;
+
+        },
+        stopDrag() {
+            if (!this.dragging) return;
+            this.dragging = false;
+            document.removeEventListener('mousemove', this.drag);
+            document.removeEventListener('mouseup', this.stopDrag);
+
+        },
+        startResize(type) {
+            this.resizing = true;
+            const num = type === 'narrow' ? -0.2 : 0.2;
+            this.scale += num;
+            this.scale = Math.max(1, Math.min(this.scale, 2)); // 限制缩放范围
+        },
+        reset() {
+            this.dragging = false;
+            this.resizing = false;
+            this.startX = 0;
+            this.startY = 0;
+            this.scale = 1;
+            this.x = 0;
+            this.y = 0;
+        }
+        // startResize(event) {
+        //   this.resizing = true;
+        //   const rect = this.$el.getBoundingClientRect();
+        //   const scaleFactor = event.clientX - rect.left > rect.width / 2 ? 1.1 : 0.9;
+        //   this.scale *= scaleFactor;
+        //   this.scale = Math.max(0.1, Math.min(this.scale, 2)); // 限制缩放范围
+        //   event.preventDefault();
+        // }
+    }
+};
+</script>  
+    
+<style scoped>
+.resizable-draggable {
+    /* width: 100%;
+    height: 100%; */
+    width: 500px;
+    height: auto;
+    position: absolute;
+    transition: transform 0.2s ease-in-out;
+    cursor: move;
+    /* 其他样式 */
+}
+</style>
+  

+ 88 - 0
src/views/PeopleManage/MobileZoomDivTR.vue

@@ -0,0 +1,88 @@
+<template>
+    <div class="resizable-draggable" :style="{ transform: `scale(${scale})`, right: `${x}px`, top: `${y}px` }"
+        @mousedown="startDrag" @wheel="zoom">
+        <slot></slot>
+    </div>
+</template>  
+  
+<script>
+export default {
+    name: 'ResizableDraggable',
+    data() {
+        return {
+            dragging: false,
+            resizing: false,
+            startX: 0,
+            startY: 0,
+            scale: 1,
+            x: 0,
+            y: 0
+        };
+    },
+    methods: {
+        zoom(event) {
+                event.preventDefault();
+                const delta = event.deltaY < 0 ? 1.1 : 0.9;
+                this.scale *= delta;
+                },
+
+        startDrag(event) {
+            this.dragging = true;
+            this.startX = event.clientX +this.x;
+            this.startY = event.clientY - this.y;
+            document.addEventListener('mousemove', this.drag);
+            document.addEventListener('mouseup', this.stopDrag);
+        },
+        drag(event) {
+            if (!this.dragging) return;
+            this.x = this.startX-event.clientX ;
+            this.y = event.clientY - this.startY;
+        },
+        stopDrag() {
+            if (!this.dragging) return;
+            this.dragging = false;
+            document.removeEventListener('mousemove', this.drag);
+            document.removeEventListener('mouseup', this.stopDrag);
+        },
+        startResize(type) {
+            this.resizing = true;
+            const num = type === 'narrow' ? -0.2 : 0.2;
+            this.scale += num;
+            this.scale = Math.max(1, Math.min(this.scale, 2)); // 限制缩放范围
+        },
+        reset() {
+            this.dragging = false;
+            this.resizing = false;
+            this.startX = 0;
+            this.startY = 0;
+            this.scale = 1;
+            this.x = 0;
+            this.y = 0;
+        }
+        // startResize(event) {
+        //   this.resizing = true;
+        //   const rect = this.$el.getBoundingClientRect();
+        //   const scaleFactor = event.clientX - rect.left > rect.width / 2 ? 1.1 : 0.9;
+        //   this.scale *= scaleFactor;
+        //   this.scale = Math.max(0.1, Math.min(this.scale, 2)); // 限制缩放范围
+        //   event.preventDefault();
+        // }
+    }
+};
+</script>  
+    
+<style scoped>
+.resizable-draggable {
+    /* width: 100%;
+    height: 100%; */
+    width: 500px;
+    height: auto;
+    position: absolute;
+    transition: transform 0.2s ease-in-out;
+    cursor: move;
+    /* 其他样式 */
+}
+
+
+</style>
+  

+ 209 - 26
src/views/PeopleManage/PartnerExtraction.vue

@@ -1,19 +1,34 @@
 <template>
   <div>
-    <div>
-      
-          <templateTable
-            :formList="formList"
-            :searchData.sync="queryFrom"
-            :tableConfig="tableConfig"
-            :data="pageResult"
-            @getList="findPage"
-            @handleSearchList="handleSearchList"
-            :pagination="pageData"
+    <templateTable :formList="formList" :searchData.sync="queryFrom" :tableConfig="tableConfig" :data="pageResult"
+      @getList="findPage" @handleSearchList="handleSearchList" :pagination="pageData">
+    </templateTable>
+    <el-dialog title="详情" :visible.sync="dialogVisibledetail" width="40%">
+        <templateTable :tableConfig="detailtableConfig" :data="pageResultdetail" @getList="findPagedetail"
+        :pagination="pageDetailData"
           >
+        </templateTable>
+      <div slot="footer" class="dialog-footer">
+        <el-button size="small" @click="dialogVisibledetail = false">关 闭</el-button>
+      </div>
+    </el-dialog>
+    <el-dialog title="详情" :visible.sync="dialogVisible" width="70%">
+      <el-row>
+        <el-col :span="5">
+          <templateTable :tableConfig="personneltableConfig" :data="pageResultpersonnel" @getList="findPagepersonnel"
+            @rowClick="rowClick">
           </templateTable>
-    </div>
-    
+        </el-col>
+        <el-col :span="18" :offset="1">
+          <templateTable :tableConfig="depttableConfig" :data="pageResultdept" @getList="findPagedept"
+            :pagination="pageDatadept">
+          </templateTable>
+        </el-col>
+      </el-row>
+      <div slot="footer" class="dialog-footer">
+        <el-button size="small" @click="dialogVisible = false">关 闭</el-button>
+      </div>
+    </el-dialog>
   </div>
 </template>
 
@@ -25,6 +40,8 @@ export default {
   },
   data() {
     return {
+      pageResultdetail:[],
+
       formList: [
         {
           label: "工号",
@@ -53,33 +70,201 @@ export default {
           { prop: "cashFee", label: "可提现金额", type: "text" },
           { prop: "startTime", label: "核算开始时间", type: "text" },
         ],
+        optBtns: [
+          {
+            type: "primary",
+            label: "详情",
+            click: (row, index) => {
+              return this.detail(row);
+            },
+          },
+        ],
         loading: true,
         isPaginationShow: true,
         isShowIndex: true,
       },
-      rules:{
-        proportional: [
-            { required: true, message: '请输入抽成比例', trigger: 'blur' },
-          ],
-          userName: [
-            { required: true, message: '请选择名称', trigger: 'change' }
-          ],
+      detailtableConfig: {
+        columns: [
+          // 数据列
+          // { prop: "userId", label: "工号", type: "text" },
+          // {
+          //   prop: "userName",
+          //   label: "名称",
+          //   type: "text",
+          // },
          
+          { prop: "deptId", label: "机构编码", type: "text" },
+          { prop: "deptName", label: "机构名称", type: "text" },
+           { prop: "sumpremium", label: "总保费", type: "text" },
+          // { prop: "proportional", label: "抽成比例", type: "text" },
+          // { prop: "extractFee", label: "总保费抽成费用", type: "text" },
+          { prop: "startTime", label: "核算开始时间", type: "text",width:170 },
+        ],
+        optBtns: [
+          {
+            type: "primary",
+            label: "查看",
+            click: (row, index) => {
+              return this.rowDetail(row);
+            },
+          },
+        ],
+        loading: true,
+        isPaginationShow: true,
+        isShowIndex: true,
+      },
+      rules: {
+        proportional: [
+          { required: true, message: '请输入抽成比例', trigger: 'blur' },
+        ],
+        userName: [
+          { required: true, message: '请选择名称', trigger: 'change' }
+        ],
+
       },
       pageData: {
         pageNum: 1,
         pageSize: 10,
         totalSize: 0,
       },
-     
+      pageDetailData: {
+        pageNum: 1,
+        pageSize: 10,
+        totalSize: 0,
+      },
       queryFrom: {},
       pageResult: [],
+      dialogVisible: false,
+      personneltableConfig: {
+        columns: [
+          // 数据列
+          { prop: "name", label: "姓名", type: "text" },
+        ],
+        tableHeight: 480,
+        loading: true,
+        isPaginationShow: false,
+        isShowIndex: true,
+      },
+      depttableConfig: {
+        columns: [
+          // 数据列
+          { prop: "userId", label: "员工编号", type: "text" },
+          { prop: "userName", label: "员工姓名", type: "text" },
+          { prop: "companyId", label: "子订单编号", type: "text" },
+          { prop: "orderstatus", label: "订单状态", type: "statMap",options:[
+            {
+              label:'报价中',
+              value:'0'
+            },
+            {
+              label:'待核保',
+              value:'1'
+            },
+            {
+              label:'已核保待缴费',
+              value:'2'
+            },
+            {
+              label:'已承保',
+              value:'3'
+            },
+            {
+              label:'核保退回',
+              value:'4'
+            },
+          ]},
+          { prop: "licenseno", label: "车牌号", type: "text" },
+          { prop: "sypremium", label: "商业险", type: "text" },
+          { prop: "jqpremium", label: "交强险", type: "text" },
+          { prop: "jypremium", label: "驾意险", type: "text" },
+          { prop: "sumpremium", label: "总保费", type: "text" },
+          { prop: "createtime", label: "创建时间 ", type: "text" },
+        ],
+        tableHeight: 450,
+        loading: true,
+        isPaginationShow: true,
+        isShowIndex: true,
+      },
+      pageResultpersonnel: [],
+      pageResultdept: [],
+      pageDatadept: {
+        pageNum: 1,
+        pageSize: 10,
+        totalSize: 0,
+      },
+      rowDept: '',
+      userId: '',
+      startTime: '',
+      dialogVisibledetail:false
     };
   },
   created() {
     this.findPage();
   },
   methods: {
+    detail(row) {
+      this.dialogVisibledetail = true
+      this.rowUserId=row.userId
+      this.findPagedetail()
+    },
+    rowDetail(row) {
+      this.dialogVisible = true
+      this.rowDept = row.deptId
+      this.startTime = row.startTime
+      this.findPagepersonnel({ deptId: row.deptId })
+      this.findPagedept()
+    },
+    rowClick(val) {
+      this.userId =''
+      this.userId = val.id
+      this.pageDatadept=   {
+        pageNum: 1,
+        pageSize: 10,
+        totalSize: 0,
+      },
+      this.findPagedept()
+    },
+    findPagedetail(data) {
+      this.detailtableConfig.loading = true;
+      this.$api.insCompany
+        .queryAgencyLeaderById({userId:this.rowUserId,...this.pageDetailData})
+        .then((res) => {
+          this.detailtableConfig.loading = false;
+          this.pageResultdetail = res.data.content;
+          this.pageDetailData.pageNum = res.data.pageNum;
+          this.pageDetailData.pageSize = res.data.pageSize;
+          this.pageDetailData.totalSize = res.data.totalSize;
+        });
+    },
+    findPagepersonnel(data) {
+      this.personneltableConfig.loading = true;
+      this.$api.insCompany
+        .queryAgencyUser({
+          ...data,
+        })
+        .then((res) => {
+          this.personneltableConfig.loading = false;
+          this.pageResultpersonnel = res.data;
+        });
+    },
+    findPagedept(data) {
+      this.depttableConfig.loading = true;
+      this.$api.insCompany
+        .queryAgencyUserInsAreaPage({
+          userId: this.userId,
+          deptId: this.rowDept,
+          startTime: this.startTime,
+          ...data,
+          ...this.pageDatadept
+        })
+        .then((res) => {
+          this.depttableConfig.loading = false;
+          this.pageResultdept = res.data.records;
+          this.pageDatadept.pageNum = res.data.current;
+          this.pageDatadept.pageSize = res.data.size;
+          this.pageDatadept.totalSize = res.data.total;
+        });
+    },
     // 查询Start
     queryStaffInfo() {
       this.findPage();
@@ -101,17 +286,15 @@ export default {
           this.pageData.totalSize = res.data.totalSize;
         });
     },
-   
+
     handleSearchList(data) {
       this.findPage(data);
     },
-   
+
     // 下一步
-    
+
   },
 };
 </script>
 
-<style scoped>
-
-</style>
+<style scoped></style>

+ 326 - 210
src/views/PeopleManage/PcLoginRecord.vue

@@ -3,199 +3,211 @@
     <div id="containerMap" style="width: 100%; height: 87vh;position: relative" v-loading="loading"
       element-loading-text="数据量较大,正在为您加载......" element-loading-spinner="el-icon-loading"
       element-loading-background="rgba(0, 0, 0, 0.8)"></div>
-    <div class="province-window">
-      <el-select size="small" v-model="provinceName" clearable placeholder="请选择省" @change="provinceChange"
-        @clear="provinceClear">
-        <el-option v-for="(option, index) in provinceOption" :key="index" :label="option.name"
-          :value="option.code"></el-option>
-      </el-select>
-      <el-select size="small" v-model="cityName" clearable placeholder="请选择市" @change="cityChange" @clear="cityClear">
-        <el-option v-for="(option, index) in cityOption" :key="index" :label="option.name"
-          :value="option.code"></el-option>
-      </el-select>
-      <el-select size="small" v-model="districtName" clearable placeholder="请选择区" @change="districtChange"
-        @clear="districtClear">
-        <el-option v-for="(option, index) in districtOption" :key="index" :label="option.name"
-          :value="option.code"></el-option>
-      </el-select>
-      <el-button size="small" type="primary" @click="onSearch">搜索</el-button>
-      <!-- <el-button size="small" type="primary" @click="onCircular">圆形定位</el-button> -->
-      <!-- <el-button size="small" type="primary" @click="map.remove(circle)">删除定位</el-button> -->
-    </div>
-    <div class="source-window">
-      <div>
-        <span>全部</span>
-        <el-switch v-model="sourceqb" @change="sourceqbChange">
-        </el-switch>
+    <div class="dragContainerEl">
+      <div class="province-window">
+        <el-select size="small" v-model="provinceName" clearable placeholder="请选择省" @change="provinceChange"
+          @clear="provinceClear">
+          <el-option v-for="(option, index) in provinceOption" :key="index" :label="option.name"
+            :value="option.code"></el-option>
+        </el-select>
+        <el-select size="small" v-model="cityName" clearable placeholder="请选择市" @change="cityChange" @clear="cityClear">
+          <el-option v-for="(option, index) in cityOption" :key="index" :label="option.name"
+            :value="option.code"></el-option>
+        </el-select>
+        <el-select size="small" v-model="districtName" clearable placeholder="请选择区" @change="districtChange"
+          @clear="districtClear">
+          <el-option v-for="(option, index) in districtOption" :key="index" :label="option.name"
+            :value="option.code"></el-option>
+        </el-select>
+        <el-button size="small" type="primary" @click="onSearch">搜索</el-button>
+        <!-- <el-button size="small" type="primary" @click="onCircular">圆形定位</el-button> -->
+        <!-- <el-button size="small" type="primary" @click="map.remove(circle)">删除定位</el-button> -->
       </div>
-      <div>
-        <span>代理</span>
-        <el-switch v-model="sourcedl" @change="sourcedlChange">
-        </el-switch>
-        <!-- <span style="margin-left: 15px;">在线</span>
+      <div class="source-window">
+        <div>
+          <span>全部</span>
+          <el-switch v-model="sourceqb" @change="sourceqbChange">
+          </el-switch>
+        </div>
+        <div>
+          <span>代理</span>
+          <el-switch v-model="sourcedl" @change="sourcedlChange">
+          </el-switch>
+          <!-- <span style="margin-left: 15px;">在线</span>
         <el-switch v-model="lineZx" @change="onLineChange">
         </el-switch> -->
-      </div>
-      <div>
-        <span>渠道</span>
-        <el-switch v-model="sourceqd" @change="sourceqdChange">
-        </el-switch>
-        <!-- <span style="margin-left: 15px;">离线</span>
+        </div>
+        <div>
+          <span>渠道</span>
+          <el-switch v-model="sourceqd" @change="sourceqdChange">
+          </el-switch>
+          <!-- <span style="margin-left: 15px;">离线</span>
         <el-switch v-model="lineLx" @change="offlineChange">
         </el-switch> -->
-      </div>
-    </div>
-    <div v-if="infoWindowVisible" class="infohis-window">
-      <p class="close flex j-s">
-        <span>历史记录</span>
-        <span style="color: #c3c3c3;font-size:18px" @click="infoWindowVisible = false"> ×</span>
-      </p>
-      <el-table :data="tableData" border style="width: 98%; max-height: 45vh;
-    overflow-y: auto; " 
-    :cell-style="{padding: '3px 8px'}"
-    :header-cell-style="{
-        background: '#F2F7FC',
-        fontWeight: '700',
-        color: '#606266',
-        
-      }">
-        <el-table-column prop="userId" label="工号" width="150">
-        </el-table-column>
-        <el-table-column prop="userName" label="姓名" width="80">
-        </el-table-column>
-        <el-table-column prop="address" label="地址">
-        </el-table-column>
-        <el-table-column prop="operationTime" label="登录时间">
-        </el-table-column>
-      </el-table>
-      <div class="bottomFixed">
-        <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="pageNum"
-          :page-sizes="[5, 10, 20, 30, 50, 100]" :page-size="pageSize" layout="total, sizes, prev, pager, next"
-          :total="totalSum">
-        </el-pagination>
-      </div>
-    </div>
-    <div class="personnel-window ">
-      <p class="close flex j-s ">
-        <!-- <span>人员分布</span> -->
-        <el-tabs style="position: relative;width: 100%;" v-model="activeName" @tab-click="handHistory">
-          <el-tab-pane label="人员分布" name="1"></el-tab-pane>
-          <el-tab-pane label="历史在线人数" name="2"></el-tab-pane>
-        </el-tabs>
-        <span style="color: #3865E9 ; cursor: pointer; font-size: 14px;position: absolute;line-height: 40px;
-    right: 30px;" @click="isCollapse = !isCollapse;if(isCollapse)infoWindowVisible=false">{{
-      isCollapse ? '收起' : '展开' }} </span>
-      </p>
-      <div v-show="activeName == 1">
-        <div class="flex j-s">
-          <div class="info-title"><i></i>人员数量概览</div>
-          <div class="info-online"><i></i>在线人数:{{ onlineData }}</div>
-        </div>
-        <div style="padding: 10px 0;" class="flex j-s">
-          <div v-for="(item, index) in overviewOption" :key="index"
-            :class="currentIndex === index ? 'overview after-img' : 'overview '" @click="checkPrice(index)">
-            <span>{{ item.active }}</span>
-            <span>{{ item.name }}</span>
-          </div>
         </div>
-        <div v-show="isCollapse" class="info-title"><i></i>区域人员概览</div>
-        <el-table v-show="isCollapse" :data="overviewData" border
-          style="width: 100%; max-height: 50vh; overflow: auto;margin:15px 0" :header-cell-style="{
-            background: '#F7F7F9',
-            fontWeight: '700',
-            color: '#000',
-          }">
-          <el-table-column type="index" align="center" width="50" label="序号">
-            <template slot-scope="scope">
-              <img v-if="scope.$index == 0" src="../../assets/序号1.png" />
-              <img v-else-if="scope.$index == 1" src="../../assets/序号2.png" />
-              <img v-else-if="scope.$index == 2" src="../../assets/序号3.png" />
-              <span v-else style="text-decoration-line: underline;">{{ scope.$index + 1 }}</span>
-            </template>
+      </div>
+      <MobileZoomDivTR>
+      <div v-if="infoWindowVisible"  class="infohis-window">
+        <p class="close flex j-s">
+          <span>历史记录</span>
+          <span style="color: #c3c3c3;font-size:18px" @click="infoWindowVisible = false"> ×</span>
+        </p>
+        <el-table :data="tableData" border style="width: 98%; max-height: 45vh;
+    overflow-y: auto; " :cell-style="{ padding: '3px 8px' }" :header-cell-style="{
+      background: '#F2F7FC',
+      fontWeight: '700',
+      color: '#606266',
+
+    }">
+          <el-table-column prop="userId" label="工号" width="150">
           </el-table-column>
-          <el-table-column prop="districtName" align="center" label="区域">
+          <el-table-column prop="userName" label="姓名" width="80">
           </el-table-column>
-          <el-table-column prop="number" align="center" label="人数">
+          <el-table-column prop="address" label="地址">
+          </el-table-column>
+          <el-table-column prop="operationTime" label="登录时间">
           </el-table-column>
-          <div slot="empty" class="empty">
-            <img src="../../assets/暂无数据.png" />
-            <div class="txt">暂无数据哦</div>
-          </div>
         </el-table>
+        <div class="bottomFixed">
+          <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="pageNum"
+            :page-sizes="[5, 10, 20, 30, 50, 100]" :page-size="pageSize" layout="total, sizes, prev, pager, next"
+            :total="totalSum">
+          </el-pagination>
+        </div>
       </div>
-      <div v-show="activeName == 2">
-        <div style="margin-bottom: 10px;">
-          <span style="color: #262626;font-weight: 700;font-size: 14px;">时间筛选 </span>
-          <el-date-picker v-model="historyDate" type="daterange" size="small" @change="historyDateFun"
-            value-format="yyyy-MM-dd" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期">
-          </el-date-picker>
-          <!-- <el-date-picker size="small" @change="historyDateFun"  v-model="historyDate" type="date" placeholder="选择日期" format="yyyy 年 MM 月 dd 日"
+    </MobileZoomDivTR>
+      <MobileZoomDivR>
+        <div class="personnel-window ">
+          <p class="close flex j-s ">
+            <!-- <span>人员分布</span> -->
+            <el-tabs style="position: relative;width: 100%;" v-model="activeName" @tab-click="handHistory">
+              <el-tab-pane label="人员分布" name="1"></el-tab-pane>
+              <el-tab-pane label="历史在线人数" name="2"></el-tab-pane>
+            </el-tabs>
+            <span style="color: #3865E9 ; cursor: pointer; font-size: 14px;position: absolute;line-height: 40px;
+    right: 30px;" @click="isCollapse = !isCollapse; if (isCollapse) infoWindowVisible = false">{{
+      isCollapse ? '收起' : '展开' }} </span>
+          </p>
+          <div v-show="activeName == 1">
+            <div class="flex j-s">
+              <div class="info-title"><i></i>人员数量概览</div>
+              <div class="info-online"><i></i>在线人数:{{ onlineData }}</div>
+            </div>
+            <div style="padding: 10px 0;" class="flex j-s">
+              <div v-for="(item, index) in overviewOption" :key="index"
+                :class="currentIndex === index ? 'overview after-img' : 'overview '" @click="checkPrice(index)">
+                <span>{{ item.active }}</span>
+                <span>{{ item.name }}</span>
+              </div>
+            </div>
+            <div v-show="isCollapse" class="info-title"><i></i>区域人员概览</div>
+            <el-table v-show="isCollapse" :data="overviewData" border
+              style="width: 100%; max-height: 50vh; overflow: auto;margin:15px 0" :header-cell-style="{
+                background: '#F7F7F9',
+                fontWeight: '700',
+                color: '#000',
+              }">
+              <el-table-column type="index" align="center" width="50" label="序号">
+                <template slot-scope="scope">
+                  <img v-if="scope.$index == 0" src="../../assets/序号1.png" />
+                  <img v-else-if="scope.$index == 1" src="../../assets/序号2.png" />
+                  <img v-else-if="scope.$index == 2" src="../../assets/序号3.png" />
+                  <span v-else style="text-decoration-line: underline;">{{ scope.$index + 1 }}</span>
+                </template>
+              </el-table-column>
+              <el-table-column prop="districtName" align="center" label="区域">
+              </el-table-column>
+              <el-table-column prop="number" align="center" label="人数">
+              </el-table-column>
+              <div slot="empty" class="empty">
+                <img src="../../assets/暂无数据.png" />
+                <div class="txt">暂无数据哦</div>
+              </div>
+            </el-table>
+          </div>
+          <div v-show="activeName == 2">
+            <div style="margin-bottom: 10px;">
+              <span style="color: #262626;font-weight: 700;font-size: 14px;">时间筛选 </span>
+              <el-date-picker v-model="historyDate" type="daterange" size="small" @change="historyDateFun"
+                value-format="yyyy-MM-dd" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期">
+              </el-date-picker>
+              <!-- <el-date-picker size="small" @change="historyDateFun"  v-model="historyDate" type="date" placeholder="选择日期" format="yyyy 年 MM 月 dd 日"
             value-format="yyyy-MM-dd"> 
           </el-date-picker>-->
-        </div>
-        <div class="flex j-s">
-          <div class="info-title"><i></i>历史在线人数统计</div>
-          <div class="info-online"><i></i>使用人数:{{ onlineHisData }}</div>
-        </div>
-        <div id="echarts_box" v-show="isCollapse" style="width: 460px;height:300px;"></div>
+            </div>
+            <div class="flex j-s">
+              <div class="info-title"><i></i>历史在线人数统计</div>
+              <div class="info-online"><i></i>使用人数:{{ onlineHisData }}</div>
+            </div>
+            <div id="echarts_box" v-show="isCollapse" style="width: 460px;height:300px;"></div>
 
-      </div>
+          </div>
+        </div>
 
+      </MobileZoomDivR>
 
-    </div>
-    <div v-if="personnelVisible" class="info-window">
-      <p class="close flex j-s">
-        <span>人员详情</span>
-        <span style="color: #c3c3c3;font-size:18px;cursor: pointer" @click="personnelVisible = false"> ×</span>
-      </p>
-      <el-table :data="personnelData" border style="width: 100%; " :header-cell-style="{
-        background: '#F7F7F9',
-        fontWeight: '700',
-        color: '#606266',
-      }">
-        <el-table-column type="index" align="center" width="50" label="序号">
-          <template slot-scope="scope">
-            <img v-if="scope.$index == 0" src="../../assets/序号1.png" />
-            <img v-else-if="scope.$index == 1" src="../../assets/序号2.png" />
-            <img v-else-if="scope.$index == 2" src="../../assets/序号3.png" />
-            <span v-else style="text-decoration-line: underline;">{{ scope.$index + 1 }}</span>
-          </template>
-        </el-table-column>
-        <el-table-column prop="userName" label="姓名" width="100">
-        </el-table-column>
-        <el-table-column prop="userId" label="工号">
-        </el-table-column>
-        <el-table-column prop="address" label="地址">
-        </el-table-column>
-        <el-table-column prop="operationTime" label="登录时间">
-        </el-table-column>
-        <el-table-column prop="source" label="分类">
-          <template slot-scope="scope">
-            {{ scope.row.source == '1' ? '渠道' : '代理' }}
-          </template>
-        </el-table-column>
-        <el-table-column label="操作">
-          <template slot-scope="scope">
-            <el-button style="color:#3865E9 " @click.native.prevent="historicRecords(scope.row)" type="text" size="small">
-              历史记录
-            </el-button>
-          </template>
-        </el-table-column>
-        <div slot="empty" class="empty">
-          <img src="../../assets/暂无数据.png" />
-          <div class="txt">暂无数据哦</div>
+      <MobileZoomDiv>
+        <div v-if="personnelVisible" class="info-window">
+          <p class="close flex j-s">
+            <span>人员详情</span>
+            <span style="color: #c3c3c3;font-size:18px;cursor: pointer" @click="personnelVisible = false"> ×</span>
+          </p>
+          <el-table :data="personnelData" border style="width: 100%; " :header-cell-style="{
+            background: '#F7F7F9',
+            fontWeight: '700',
+            color: '#606266',
+          }">
+            <el-table-column type="index" align="center" width="50" label="序号">
+              <template slot-scope="scope">
+                <img v-if="scope.$index == 0" src="../../assets/序号1.png" />
+                <img v-else-if="scope.$index == 1" src="../../assets/序号2.png" />
+                <img v-else-if="scope.$index == 2" src="../../assets/序号3.png" />
+                <span v-else style="text-decoration-line: underline;">{{ scope.$index + 1 }}</span>
+              </template>
+            </el-table-column>
+            <el-table-column prop="userName" label="姓名" width="100">
+            </el-table-column>
+            <el-table-column prop="userId" label="工号">
+            </el-table-column>
+            <el-table-column prop="address" label="地址">
+            </el-table-column>
+            <el-table-column prop="operationTime" label="登录时间">
+            </el-table-column>
+            <el-table-column prop="source" label="分类">
+              <template slot-scope="scope">
+                {{ scope.row.source == '1' ? '渠道' : '代理' }}
+              </template>
+            </el-table-column>
+            <el-table-column label="操作">
+              <template slot-scope="scope">
+                <el-button style="color:#3865E9 " @click.native.prevent="historicRecords(scope.row)" type="text"
+                  size="small">
+                  历史记录
+                </el-button>
+              </template>
+            </el-table-column>
+            <div slot="empty" class="empty">
+              <img src="../../assets/暂无数据.png" />
+              <div class="txt">暂无数据哦</div>
+            </div>
+          </el-table>
+
+          <div class="bottomFixed">
+            <el-pagination @current-change="handlePersonnelChange" :current-page="personnelPageNum" :page-size="5"
+              layout="total, prev, pager, next" :total="personnelTotalSize">
+            </el-pagination>
+          </div>
         </div>
-      </el-table>
-      <div class="bottomFixed">
-        <el-pagination @current-change="handlePersonnelChange" :current-page="personnelPageNum" :page-size="5"
-          layout="total, prev, pager, next" :total="personnelTotalSize">
-        </el-pagination>
+      </MobileZoomDiv>
+
+      <div class="info-window input-card" v-if="circle">
+        <el-button size="small" round @click="circleEditor.open()" style="margin-bottom: 5px">开始编辑</el-button>
+        <el-button size="small" round @click="circleEditor.close()" style="margin-left:0">结束编辑</el-button>
       </div>
-    </div>
-    <div class="info-window input-card" v-if="circle">
-      <el-button size="small" round @click="circleEditor.open()" style="margin-bottom: 5px">开始编辑</el-button>
-      <el-button size="small" round @click="circleEditor.close()" style="margin-left:0">结束编辑</el-button>
 
+      <!-- <div class="dragContainerEl">
+      <div id="Drag" @mousedown="mousedown($event)"  :style="{ transform: `translate(${x}px, ${y}px) scale(${scale})` }" @wheel="zoom" class="drag">可移动和放大缩小的区域</div>
+    </div> -->
     </div>
   </div>
 </template>
@@ -203,11 +215,15 @@
 <script>
 import echarts from 'echarts';
 import yongchengData from '../../assets/js/yongchengData';
+import MobileZoomDiv from './MobileZoomDiv.vue'
+import MobileZoomDivR from './MobileZoomDivR.vue'
+import MobileZoomDivTR from './MobileZoomDivTR.vue'
 import AMapLoader from "@amap/amap-jsapi-loader";
 window._AMapSecurityConfig = {
   securityJsCode: 'd62687dd438cfadd859bbab66d8e41a2',		//安全密钥
 }
 var myChart;
+
 export default {
   data() {
     return {
@@ -266,9 +282,21 @@ export default {
       lineLx: null,
       status: null,
       positionType: null,
-      historyData: []
+      historyData: [],
+      scale: 1,
+      DragEl: null,//拖动元素
+      dragContainerEl: null,//容器元素
+      // 位置差
+      // disX: 0,
+      // disY: 0,
+      // x: 0,
+      // y: 0,
+      top: 60,
+      left: 20,
+      isMoving: false,
     };
   },
+  components: { MobileZoomDiv, MobileZoomDivR,MobileZoomDivTR },
   mounted() {
     myChart = echarts.init(document.getElementById('echarts_box'))
     this.initMap();
@@ -287,18 +315,88 @@ export default {
     this.map.destroy();
   },
   methods: {
+    startMove(event) {
+      this.isMoving = true;
+      this.initialX = event.clientX;
+      this.initialY = event.clientY;
+    },
+    doMove(event) {
+      if (this.isMoving) {
+        this.left += event.clientX - this.initialX;
+        this.top += event.clientY - this.initialY;
+        this.initialX = event.clientX;
+        this.initialY = event.clientY;
+      }
+    },
+    stopMove() {
+      this.isMoving = false;
+    },
+    mousedown(event) {
+      // 1,计算位置差
+      // 因为clientX和offsetLeft的属性返回的位置不一样 要相减得到鼠标在拖动元素内实际点击的位置
+      // 后面每一次拖动时都要减去这个差值 否则就会造成你拖动的位置一直都是元素的左上角 而不是你之前点击的位置
+
+      console.log(event.clientX, this.DragEl.offsetLeft, 222222222);
+
+      this.disX = event.clientX - this.DragEl.offsetLeft;
+      this.disY = event.clientY - this.DragEl.offsetTop;
+
+      //2, 获取拖动元素的高度和容器的高度 为了下面进行限制元素拖动的范围
+      let dragHeight = this.DragEl.offsetHeight;
+      let dragWidth = this.DragEl.offsetWidth;
+      let dragContainerWidth = this.dragContainerEl.offsetWidth; //获取容器的高度和宽度
+      let dragContainerHeight = this.dragContainerEl.offsetHeight;
+
+      // 添加鼠标移动事件
+      document.onmousemove = (el) => {
+        // 3,获取鼠标移动位置
+        let moveX = el.clientX - this.disX;
+        let moveY = el.clientY - this.disY;
+
+
+        // 左边界
+        if (moveX <= 0) {
+          moveX = 0;
+        }
+        // 上边界
+        if (moveY <= 0) {
+          moveY = 0;
+        }
+        //下边界  容器高度 - 拖动元素高度
+        if (moveY >= dragContainerHeight - dragHeight) {
+          moveY = dragContainerHeight - dragHeight;
+        }
+        //右边界   容器宽度 - 拖动元素宽度
+        if (moveX >= dragContainerWidth - dragWidth) {
+          moveX = dragContainerWidth - dragWidth;
+        }
+
+        // 5, 开始移动
+        this.DragEl.style.left = moveX + "px";
+        this.DragEl.style.top = moveY + "px";
+      };
+      /* 6,鼠标抬起解除事件 */
+      document.onmouseup = () => {
+        document.onmousemove = null;
+      };
+    },
+    zoom(event) {
+      event.preventDefault();
+      const delta = event.deltaY > 0 ? 1.1 : 0.9;
+      this.scale *= delta;
+    },
     historicRecords(row) {
       this.rowId = row.userId
-      this.isCollapse=false
-      this.infoWindowVisible=true
+      this.isCollapse = false
+      this.infoWindowVisible = true
       this.detail()
     },
     handHistory(tab, event) {
       if (tab.name == '2') {
         this.queryAnalysis();
       }
-      else{
-        this.positionType=1
+      else {
+        this.positionType = 1
         this.initMap();
       }
     },
@@ -307,7 +405,7 @@ export default {
       this.queryAnalysis({ startTime: val[0], endTime: val[1] });
     },
     queryAnalysis(param) {
-      this.$api.user.ipAddrGetPcAddress({source:this.source ,...param}).then((res) => {
+      this.$api.user.ipAddrGetPcAddress({ source: this.source, ...param }).then((res) => {
         if (res.code == 200) {
           this.onlineHisData = res.data.onlineNum
           this.formatAnalysisDate(res.data.list)
@@ -324,25 +422,25 @@ export default {
           _this.map.on("complete", () => {
             //处理后台返回要用到的数据
             // _this.positionData = res.data.data
-            if (res.data.pcAddressList.length > 0){
+            if (res.data.pcAddressList.length > 0) {
 
               _this.positionType = res.data.pcAddressList[0].type
-            _this.positionData = res.data.pcAddressList.map(item => ({
-              userName: item.userName,
-              id: item.id,
-              userId: item.userId,
-              address: item.address,
-              leaderName: item.leaderName ? item.leaderName : '无',
-              // onlineImg: item.status ? "Frame-1(2).png" : "Frame(2).png",
-              onlineImg: "Frame-1(2).png",
-              operationTime: item.operationTime,
-              source: item.source,
-              status: item.status ? "#1CE247" : "#B2B2B2",
-              // status: item.status ? "在线" : "离线",
-              positionArr: [item.longitude, item.latitude]
-            }));
-            _this.mapPoint();
-          }
+              _this.positionData = res.data.pcAddressList.map(item => ({
+                userName: item.userName,
+                id: item.id,
+                userId: item.userId,
+                address: item.address,
+                leaderName: item.leaderName ? item.leaderName : '无',
+                // onlineImg: item.status ? "Frame-1(2).png" : "Frame(2).png",
+                onlineImg: "Frame-1(2).png",
+                operationTime: item.operationTime,
+                source: item.source,
+                status: item.status ? "#1CE247" : "#B2B2B2",
+                // status: item.status ? "在线" : "离线",
+                positionArr: [item.longitude, item.latitude]
+              }));
+              _this.mapPoint();
+            }
           });
           // if (location.href.indexOf("&guide=1") !== -1) {
           //   _this.map.setStatus({ scrollWheel: fal0e });
@@ -629,11 +727,11 @@ export default {
         this.sourceqd = null
       }
       this.source = null
-      if(this.positionType==1){
+      if (this.positionType == 1) {
         this.initMap();
       }
-      else{
-      this.queryAnalysis({ startTime: this.historyData[0], endTime: this.historyData[1] });
+      else {
+        this.queryAnalysis({ startTime: this.historyData[0], endTime: this.historyData[1] });
       }
     },
     sourcedlChange(val) {
@@ -642,11 +740,11 @@ export default {
         this.sourceqd = null
       }
       this.source = 2
-      if(this.positionType==1){
+      if (this.positionType == 1) {
         this.initMap();
       }
-      else{
-      this.queryAnalysis({ startTime: this.historyData[0], endTime: this.historyData[1] });
+      else {
+        this.queryAnalysis({ startTime: this.historyData[0], endTime: this.historyData[1] });
       }
     },
     sourceqdChange(val) {
@@ -655,11 +753,11 @@ export default {
         this.sourcedl = null
       }
       this.source = 1
-      if(this.positionType==1){
+      if (this.positionType == 1) {
         this.initMap();
       }
-      else{
-      this.queryAnalysis({ startTime: this.historyData[0], endTime: this.historyData[1] });
+      else {
+        this.queryAnalysis({ startTime: this.historyData[0], endTime: this.historyData[1] });
       }
     },
     onLineChange(val) {
@@ -958,15 +1056,17 @@ export default {
 }
 
 .personnel-window {
-  position: fixed;
-  bottom: 10px;
-  right: 5px;
+  position: absolute;
+  // bottom: 10px;
+  // right: 5px;
+  bottom: 0;
+  right: 0;
   z-index: 100;
   background-color: white;
   padding: 10px;
   box-shadow: 0px 5px 10px #ddd;
   box-sizing: border-box;
-    width: 500px;
+  width: 500px;
 }
 
 .bottomFixed {
@@ -1098,5 +1198,21 @@ export default {
     }
   }
 
+  .dragContainerEl {
+    // position: absolute;
+    // top: 0;
+    width: 100%;
+    height: 100%;
+  }
+
+  .drag {
+    position: absolute;
+    width: 50px;
+    height: 50px;
+    border: 5px solid yellowgreen;
+    background-color: red;
+    text-align: center;
+  }
+
 }
 </style>

+ 12 - 0
src/views/PeopleManage/UserMap.vue

@@ -46,6 +46,7 @@
         </el-switch> -->
       </div>
     </div>
+    <MobileZoomDivTR>
     <div v-if="infoWindowVisible" class="infohis-window">
       <p class="close flex j-s">
         <span>历史记录</span>
@@ -75,6 +76,8 @@
         </el-pagination>
       </div>
     </div>
+  </MobileZoomDivTR>
+      <MobileZoomDivR>
     <div class="personnel-window ">
       <p class="close flex j-s ">
         <!-- <span>人员分布</span> -->
@@ -144,6 +147,9 @@
           </div> -->
       </div>
     </div>
+  </MobileZoomDivR>
+
+<MobileZoomDiv>
     <div v-if="personnelVisible" class="info-window">
       <p class="close flex j-s">
         <span>人员详情</span>
@@ -195,12 +201,17 @@
         </el-pagination>
       </div>
     </div>
+  </MobileZoomDiv>
+
   </div>
 </template>
 
 <script>
 import echarts from 'echarts';
 import yongchengData from '../../assets/js/yongchengData';
+import MobileZoomDiv from './MobileZoomDiv.vue'
+import MobileZoomDivR from './MobileZoomDivR.vue'
+import MobileZoomDivTR from './MobileZoomDivTR.vue'
 import AMapLoader from "@amap/amap-jsapi-loader";
 window._AMapSecurityConfig = {
   securityJsCode: 'd62687dd438cfadd859bbab66d8e41a2',		//安全密钥
@@ -266,6 +277,7 @@ export default {
 
     };
   },
+  components: { MobileZoomDiv, MobileZoomDivR,MobileZoomDivTR },
   mounted() {
     myChart = echarts.init(document.getElementById('echarts_box'))
     this.initMap();

+ 58 - 44
src/views/Task/daikeComponents/KtLetter1.vue

@@ -1129,7 +1129,7 @@
                             <div class="table-list-line" style="border-right: none; padding-left: 0;" v-show="reslistitem.programme.description != '单交'">
                               <span style="margin-left: 0; font-size: 10px;">商业险</span>
                             </div>
-                            <div class="table-list-line table-list-line-last" style="border-right: none; padding-left: 0;" v-show="reslistitem.result.noExportFee">
+                            <div class="table-list-line table-list-line-last" style="border-right: none; padding-left: 0;" v-show="reslistitem.result.jyPremium">
                               <span style="margin-left: 0; font-size: 10px;">驾意险</span>
                             </div>
                           </div>
@@ -1140,7 +1140,7 @@
                             <div class="table-list-line" style="border-right: none;" v-show="reslistitem.programme.description != '单交'">
                               <span style="margin-left: 0;">{{ reslistitem.result.syExportFee ? reslistitem.result.syExportRadio : '无' }}</span>
                             </div>
-                            <div class="table-list-line table-list-line-last" style="border-right: none;"  v-show="reslistitem.result.noExportFee">
+                            <div class="table-list-line table-list-line-last" style="border-right: none;"  v-show="reslistitem.result.jyPremium">
                               <span style="margin-left: 0;">{{ reslistitem.result.noExportRadio }}</span>
                             </div>
                           </div>
@@ -1151,7 +1151,7 @@
                             <div class="table-list-line"  v-show="reslistitem.programme.description != '单交'">
                               <span style="margin-left: 0;">{{ reslistitem.result.syExportFee ? reslistitem.result.syExportFee : '无' }}</span>
                             </div>
-                            <div class="table-list-line table-list-line-last" v-show="reslistitem.result.noExportFee">
+                            <div class="table-list-line table-list-line-last" v-show="reslistitem.result.jyPremium">
                               <span style="margin-left: 0;">{{ reslistitem.result.noExportFee ? reslistitem.result.noExportFee : '无' }}</span>
                             </div>
                           </div>
@@ -1176,7 +1176,7 @@
                             <div class="table-list-line" style="border-right: none; padding-left: 0;" v-show="reslistitem.programme.description != '单交'">
                               <span style="margin-left: 0; font-size: 10px;">商业险</span>
                             </div>
-                            <div class="table-list-line table-list-line-last" style="border-right: none; padding-left: 0;" v-show="reslistitem.result.noExportFee">
+                            <div class="table-list-line table-list-line-last" style="border-right: none; padding-left: 0;" v-show="reslistitem.result.jyPremium">
                               <span style="margin-left: 0; font-size: 10px;">驾意险</span>
                             </div>
                           </div>
@@ -3615,7 +3615,7 @@
                       </el-select>
                     </el-col>
                   </el-row>
-                  <el-table v-if="item.tableData" :data="item.tableData" border style="width: 100%; margin-top: 20px;" stripe
+                  <el-table v-if="item.tableData && item.tableData.length" :data="item.tableData" border style="width: 100%; margin-top: 20px;" stripe
                     header-cell-class-name="table-header">
                     <el-table-column prop="name" label="保险责任" align="center">
                       <template slot-scope="scope">
@@ -3730,7 +3730,7 @@
     </el-dialog>
 
     <!-- 驾意险 -->
-    <el-dialog title="调整险种" :visible.sync="addYiwaiDialogVisible" width="60%" top="5vh"
+    <el-dialog title="驾意险" :visible.sync="addYiwaiDialogVisible" width="60%" top="5vh"
     :before-close="handleCloseAddYiwai" class="addyiwai">
       <div class="typedialog-style">
         <el-card>
@@ -5665,9 +5665,13 @@ export default {
     this.getCompanyList(this.$route.query.data)
     this.onScroll();
     if (this.$route.query.data) {
-      this.jqstartDate = this.$route.query.data.jqstartdate;
-      this.jqendDate = this.$route.query.data.jqenddate;
-
+      if(this.isDateBeforeToday(this.$route.query.data.jqstartdate)){
+        this.jqstartDate = this.transformTime1();
+        this.jqendDate = this.oneYearPast1(this.jqstartDate);
+      }else{
+          this.jqstartDate = this.$route.query.data.jqstartdate;
+          this.jqendDate = this.$route.query.data.jqenddate;
+      }
       if (this.$route.query.data.jqstartdate.split(" ")[1] == "00:00:00") {
         this.immediatelyValue = false;
       } else {
@@ -5984,6 +5988,7 @@ export default {
       })
       this.totalCompanyList[this.typeDialogIndex].zxProgramme.drivingList = arr;
       this.totalCompanyList[this.typeDialogIndex].programme.drivingList = arr
+      console.log(arr, 'arr')
       this.handleCloseAddYiwai()
     },
     // 驾意输入框按钮
@@ -6010,12 +6015,11 @@ export default {
     },
     // 选中驾意
     handleChangeSelect(index) {
-      console.log(index)
       if (this.totalCompanyList[this.typeDialogIndex].cnName == 'zijin') {
         this.checkList[index].tableData = []
         this.checkList[index].detail.forEach((val) => {
           this.checkList[index].selectList.forEach((value) => {
-            if (val.projectName == value) {
+            if (val.alias == value) {
               this.checkList[index].tableData.push(val)
               this.$forceUpdate()
             }
@@ -10330,7 +10334,7 @@ export default {
         }
       });
     },
-  
+
     hbsubmitdialog(data, index) {
       this.typeDialogIndex = index     // 当前的公司index
       if (this.imageList1.length == 0 && this.imageList2.length == 0) {
@@ -10609,7 +10613,7 @@ export default {
                           companyId: this.companyId,
                           engageList: this.zijinengageList,
                         })
-                        
+
                         .then((res) => {
                           if (res.code == "200") {
                             loading.close();
@@ -11081,6 +11085,16 @@ export default {
       var datastr = strYear + "-" + strMonth + "-" + strDay + " " + "00:00:00";
       return datastr;
     },
+    isDateBeforeToday(date) {
+				const inputDate = new Date(date); // 将输入的日期转换为 Date 对象
+				const today = new Date(); // 获取当前日期
+				// 比较日期是否小于当前日期
+				if (inputDate < today) {
+					return true; // 输入日期小于当前日期
+				} else {
+					return false; // 输入日期大于等于当前日期
+				}
+			},
     //时间转换
     transformTime(date) {
       var d = new Date(date);
@@ -12148,7 +12162,7 @@ export default {
       this.syendDate = this.jqendDate;
     },
     add() {
-      this.obtainProtocol();
+      // this.obtainProtocol();
       if (this.isLetter == "1") {
         this.$router.push({ path: "/letter/letter" });
       }
@@ -12181,35 +12195,35 @@ export default {
         this.bbtbcarShow = true //被保人同投保人
         // this.$refs.imageDialog.emptyList()
         this.imageList1 = [];
-            this.imageList2 = [];
-            this.imageList3 = [];
-            this.imageList4 = [];
-            this.imageList5 = [];
-            this.imageList6 = [];
-            this.imgList1 = [];
-            this.imgList2 = [];
-            this.imgList3 = [];
-            this.imgList4 = [];
-            this.imgList5 = [];
-            this.imgList6 = [];
-            this.imgList7 = [];
-            this.imgList8 = [];
-            this.imgList9 = [];
-            this.imgList10 = [];
-            this.imgList11 = [];
-            this.imgList12 = [];
-            this.imgList13 = [];
-            this.imgList14 = [];
-            this.imgList15 = [];
-            this.imgList16 = [];
-            this.imgList17 = [];
-            this.imgList18 = [];
-            this.imgList19 = [];
-            this.imgList20 = [];
-            this.imgList21 = [];
-            this.imgList22 = [];
-            this.imgList23 = [];
-            this.imgList24 = [];
+        this.imageList2 = [];
+        this.imageList3 = [];
+        this.imageList4 = [];
+        this.imageList5 = [];
+        this.imageList6 = [];
+        this.imgList1 = [];
+        this.imgList2 = [];
+        this.imgList3 = [];
+        this.imgList4 = [];
+        this.imgList5 = [];
+        this.imgList6 = [];
+        this.imgList7 = [];
+        this.imgList8 = [];
+        this.imgList9 = [];
+        this.imgList10 = [];
+        this.imgList11 = [];
+        this.imgList12 = [];
+        this.imgList13 = [];
+        this.imgList14 = [];
+        this.imgList15 = [];
+        this.imgList16 = [];
+        this.imgList17 = [];
+        this.imgList18 = [];
+        this.imgList19 = [];
+        this.imgList20 = [];
+        this.imgList21 = [];
+        this.imgList22 = [];
+        this.imgList23 = [];
+        this.imgList24 = [];
       // 清空保险公司选中的意外险
       this.zijintemplateSelection = "";
       this.zhongantemplateSelection = "";
@@ -12226,7 +12240,7 @@ export default {
         allQuantity: "1",
         quantity: "1",
       };
-
+      this.productId = ''
       this.hengbangaccidentalDrivingVo = {};
       this.huanongaccidentalDrivingVo = {};
       this.taipingaccidentalDrivingVo = {};