vue-insagent-pc/src/views/Task/Modified.vue

<template>
  <div class="page-container">
    <!-- 查询条件（按车牌号查询） -->
    <div class="queryForm" title="检索区" style="padding-top:10px;padding-left:15px;">
      <el-form size="mini" ref="queryForm" :model="queryForm" label-width="120px">
        <el-row>
          <el-col :span="6" style="height: 40px;">
            <el-form-item label="所属机构">
              <!-- <el-input clearable placeholder="所属机构" v-model="queryForm.deptid"></el-input> -->
			  <el-select v-model="queryForm.deptid" filterable placeholder="所属机构" clearable style="width: 100%;">
			      <el-option
			        v-for="item in totalComapny"
			        :key="item.id"
			        :label="item.name"
			        :value="item.id">
			      </el-option>
			    </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="6" style="height: 40px;">
            <el-form-item label="任务号">
              <el-input clearable placeholder="任务号" v-model="queryForm.quoteno"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6" style="height: 40px;">
            <el-form-item label="订单号">
              <el-input clearable placeholder="订单号" v-model="queryForm.orderno"></el-input>
            </el-form-item>
          </el-col>
          <!-- <el-col :span="6" style="height: 40px;">
            <el-form-item label="任务状态">
              <el-select clearable  v-model="queryForm.orderstatus" placeholder="任务状态" style="width: 100%;" >
                <el-option label="报价中" value="0"></el-option>
                <el-option label="待核保" value="1"></el-option>
                <el-option label="已核保" value="2"></el-option>
                <el-option label="已核保待缴费" value="5"></el-option>
                <el-option label="已缴费待配送" value="6"></el-option>
                <el-option label="已承保" value="7"></el-option>
                <el-option label="已关闭" value="99"></el-option>
              </el-select>
            </el-form-item>
          </el-col> -->

          <el-col :span="6" style="height: 40px;">
            <el-form-item label="车牌号">
              <el-input clearable placeholder="车牌号" v-model="queryForm.licenseNo"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6" style="height: 40px;">
            <el-form-item label="车架号">
              <el-input clearable placeholder="车架号" v-model="queryForm.frameNo"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6" style="height: 40px;">
            <el-form-item label="发动机号">
              <el-input clearable placeholder="发动机号" v-model="queryForm.engineNo"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6" style="height: 40px;">
            <el-form-item label="投保险种">
				<el-select v-model="queryForm.riskCode" placeholder="请选择" style="width: 100%;" clearable>
					<el-option label="单交强" value="单交强"></el-option>
					<el-option label="单商业" value="单商业"></el-option>
					<el-option label="单三者" value="单三者"></el-option>
					<el-option label="交强+商业" value="交强+商业"></el-option>
					<el-option label="交强+三者" value="交强+三者"></el-option>
				  </el-select>
            </el-form-item>
          </el-col>

          <el-col :span="6" style="height: 40px;" v-if="!isUserOrder">
            <el-form-item label="代理人工号">
              <el-input clearable placeholder="代理人工号" v-model="queryForm.userid"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6" style="height: 40px;" v-if="!isUserOrder">
            <el-form-item label="代理人姓名">
              <el-input clearable placeholder="代理人姓名" v-model="queryForm.username"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6" style="height: 40px;" v-if="!isUserOrder">
            <el-form-item label="被保险人">
              <el-input clearable placeholder="被保人姓名" v-model="queryForm.insurename"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6" style="height: 40px;">
            <el-form-item label="保险公司">
				<el-select v-model="queryForm.inscompany" placeholder="请选择" style="width: 100%;" clearable>
					<el-option label="华农财险" value="华农财险"></el-option>
					<el-option label="恒邦财险" value="恒邦财险"></el-option>
					<el-option label="中煤财险" value="中煤财险"></el-option>
					<el-option label="天安财险" value="天安财险"></el-option>
				</el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12" style="height: 40px;">
            <el-form-item label="报价时间">
              <el-date-picker v-model="queryForm.quoteDate" style="width:100%"  type="daterange" align="left" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期"> </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="12" style="height: 40px;">
            <el-form-item label="起保时间">
               <el-date-picker v-model="queryForm.policyDate" style="width:100%"  type="daterange" align="left" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期"> </el-date-picker>
            </el-form-item>
          </el-col>

          <el-col :span="24" class="u-f u-f-je" style="height: 40px;">
            <div class="u-f" style="margin-bottom: 20px; width: 120px;height: 32px; border-radius: 5px;overflow: hidden;" @click="queryGetOrderList" >
                <div class="u-f u-f1 u-f-ajc" style="background: #409EFF;color:#fff">查询</div>
                <div class="u-f u-f1 u-f-ajc" style="background: #F78948;color:#fff">{{totalSize}}</div>
            </div>
          </el-col>
        </el-row>
      </el-form>
    </div>

    <!-- 任务区域 -->
    <div class="tasks">

      <div v-if="ordersList.length==0" class="u-f-ajc" style="padding: 240px 0;">
        暂无数据
      </div>


      <el-card v-if="ordersList.length>0" class="task" :body-style="{padding:'15px'}" shadow="never" v-for="(order,orderItem) in ordersList" :key="order.orderno">
        <el-row class="row">
          <el-col :span="2" class="u-f u-f-sa">
            <label class="label" style="font-size: 18px;font-weight:bold;">{{(currentPage-1)*pageSize+orderItem+1}}</label>
            <label class="label">任务号</label>
          </el-col>
          <el-col :span="3">
            <el-input size="mini" disabled v-model="order.quoteno"></el-input>
          </el-col>
          <el-col :span="2" class="u-f u-f-je">
            <label class="label">订单号</label>
          </el-col>
          <el-col :span="3">
            <el-input size="mini" disabled v-model="order.orderno"></el-input>
          </el-col>
          <el-col :span="2" class="u-f u-f-je">
            <label class="label">车牌号</label>
          </el-col>
          <el-col :span="3">
            <el-input size="mini" disabled v-model="order.carinfo.licenseNo"></el-input>
          </el-col>
          <el-col :span="2" class="u-f u-f-je">
            <label class="label">被保险人</label>
          </el-col>
          <el-col :span="3">
            <el-input size="mini" disabled v-model="order.insureinfo.name"></el-input>
          </el-col>
          <el-col :span="2" class="u-f u-f-je">
            <label class="label">任务状态</label>
          </el-col>
          <el-col :span="2">
            <div v-for="(orderStatusItem,orderStatusIndex) in global.orderStatus"  :key="orderStatusIndex">
             <template v-if="orderStatusItem.value == order.orderstatus">
                <el-input size="mini" disabled v-model="orderStatusItem.label"></el-input>
              </template>
            </div>
          </el-col>
        </el-row>

        <el-row class="row">
          <el-col :span="2" class="u-f u-f-je">
            <label class="label">代理人工号</label>
          </el-col>
          <el-col :span="3">
            <el-input size="mini" disabled v-model="order.userid"></el-input>
          </el-col>
          <el-col :span="2" class="u-f u-f-je">
            <label class="label">代理人名称</label>
          </el-col>
          <el-col :span="3">
            <el-input size="mini" disabled v-model="order.username"></el-input>
          </el-col>
          <el-col :span="2" class="u-f u-f-je">
            <label class="label">机构归属</label>
          </el-col>
          <el-col :span="3">
			<div v-for="(item,index) in totalComapny" :key="index" v-if="order.deptid.split('D')[0]==item.id">
				<el-input size="mini" disabled v-model="item.name"></el-input>
			</div>
            <!-- <el-input size="mini" disabled v-model="order.deptid" ></el-input> -->
          </el-col>
          <el-col :span="2" class="u-f u-f-je">
            <label class="label">团队归属</label>
          </el-col>
          <el-col :span="3">
            <el-input size="mini" disabled v-model="order.deptname"></el-input>
          </el-col>
          <el-col :span="2" class="u-f u-f-je">
            <label class="label">投保险种</label>
          </el-col>
          <el-col :span="2">
            <el-input size="mini" disabled  v-model="order.product"></el-input>
          </el-col>
        </el-row>
        <el-row class="row">
          <div v-for="(riskItem,riskIndex) in order.riskinfo" :key="riskIndex">
            <template v-if="riskItem.riskCode == '0507'">
              <el-col :span="2" class="u-f u-f-je">
                <label class="label">交强险起保时间</label>
              </el-col>
              <el-col :span="3">
                <el-input size="mini" disabled v-model="riskItem.startDate"></el-input>
              </el-col>
              <el-col :span="2" class="u-f u-f-je">
                <label class="label">交强险终保时间</label>
              </el-col>
              <el-col :span="3">
                 <el-input size="mini" disabled v-model="riskItem.endDate"></el-input>
              </el-col>
            </template>
          </div>
          <div v-for="(riskItem,riskIndex) in order.riskinfo" :key="riskIndex+'1'">
            <template v-if="riskItem.riskCode == '0510'">
              <el-col :span="2" class="u-f u-f-je">
                <label class="label">商业险起保时间</label>
              </el-col>
              <el-col :span="3">
                <el-input size="mini" disabled v-model="riskItem.startDate"></el-input>
              </el-col>
              <el-col :span="2" class="u-f u-f-je">
                <label class="label">交强险终保时间</label>
              </el-col>
              <el-col :span="3">
                 <el-input size="mini" disabled v-model="riskItem.endDate"></el-input>
              </el-col>
            </template>
          </div>
          <el-col :span="2" class="u-f u-f-je">
            <label class="label">报价公司</label>
          </el-col>
          <template v-if="(order.product != '单交强') && (order.product != '单商业') && (order.product != '单三者')">
            <el-col :span="2">
              <el-input size="mini" disabled v-model="order.inscompany"></el-input>
            </el-col>
          </template>
          <template v-else>
            <el-col :span="3">
              <el-input size="mini" disabled v-model="order.inscompany"></el-input>
            </el-col>
          </template>
        </el-row>
        <el-row class="row">
          <!-- <el-col :span="2" class="u-f u-f-je">
            <label class="label">受理人工号</label>
          </el-col>
          <el-col :span="3">
            <el-input size="mini" disabled  v-model="order.auditid"></el-input>
          </el-col>
          <el-col :span="2" class="u-f u-f-je">
            <label class="label">受理人名字</label>
          </el-col>
          <el-col :span="3">
            <el-input size="mini" disabled  v-model="order.auditname"></el-input>
          </el-col> -->
          <el-col :span="2" class="u-f u-f-je">
            <label class="label">报价时间</label>
          </el-col>
          <el-col :span="3">
            <el-input size="mini" disabled v-model="order.createtime"></el-input>
          </el-col>
        </el-row>
        <el-row class="task_bottom u-f u-f-je">
          <el-button size="mini" type="danger" style="background-color: #DE504C;border: 1px solid #DE504C;" @click="closeOrder(order.orderno)">关闭报价</el-button>
		  <el-button size="mini" type="primary" style="background-color: #F99070;border: 1px solid #F99070;" @click="getHistoryList(order.orderno,order.product,order.sumpremium)">查看轨迹</el-button>
          <el-button size="mini" type="primary" style="background-color: #C9D636;border: 1px solid #C9D636;" @click="getQuoteInfo(order.orderno)">查看详情</el-button>
        </el-row>
      </el-card>

      <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="currentPage"
        :page-sizes="[3, 5, 10]" :page-size="pageSize" layout="total, sizes, prev, pager, next, jumper" :total="totalSize" style="text-align: end;margin-bottom: 15px;">
      </el-pagination>
    </div>
    <el-dialog fullscreen lock-scroll title="车辆报价信息详情" :visible.sync="dialogVisible" width="40%" center>
      <!-- 这是报价信息区域 -->
      <el-container>
        <el-row class="leftContainer">
          <el-col id="level1">
            <a href="#demo1" @click="jump('level1')">
              <i class="el-icon-truck u-f-sa"></i>
              <span class="u-f-ajc">车辆</span>
            </a>
          </el-col>
          <el-col id="level2">
            <a href="#demo2" @click="jump('level2')">
              <i class="el-icon-user u-f-sa"></i>
              <span class="u-f-ajc">关系人</span>
            </a>
          </el-col>
          <el-col id="level3">
            <a href="#demo3" @click="jump('level3')">
              <i class="el-icon-s-custom u-f-sa"></i>
              <span class="u-f-ajc">代理人</span>
            </a>
          </el-col>
          <el-col id="level4">
            <a href="#demo4" @click="jump('level4')">
              <i class="el-icon-goods u-f-sa"></i>
              <span class="u-f-ajc">优惠</span>
            </a>
          </el-col>
          <el-col id="level5">
            <a href="#demo5" @click="jump('level5')">
              <i class="el-icon-s-platform u-f-sa"></i>
              <span class="u-f-ajc">公司</span>
            </a>
          </el-col>
			<el-col id="level6">
				<a href="#demo6" @click="jump('level6')">
					<i class="el-icon-s-platform u-f-sa"></i>
					<span class="u-f-ajc">影像</span>
				</a>
			</el-col>
        </el-row>

        <el-row class="rightContainer">
          <el-card id="demo1">
            <el-row class="header">
              <el-col>车辆信息</el-col>
            </el-row>
            <el-divider></el-divider>
            <el-row class="body">
              <el-row>
                <el-col :span="2">
                  <label>号牌号码</label>
                </el-col>
                <el-col :span="5">
                  <el-input size="small" disabled v-model="orderInfo.carinfo.licenseNo"></el-input>
                </el-col>
                <el-col :span="3">
                  <label>号牌种类</label>
                </el-col>
                <el-col :span="5">
                  <template v-if="orderInfo.carinfo.licenseTypeCode == '02'">
                    <el-input size="medium" disabled value="小型汽车号牌"></el-input>
                  </template>
                  <template v-if="orderInfo.carinfo.licenseTypeCode != '02'">
                    <el-input size="medium" disabled :value="'其它号牌'+orderInfo.carinfo.licenseTypeCode"></el-input>
                  </template>
                </el-col>
                <el-col :span="3">
                  <label>车架号</label>
                </el-col>
                <el-col :span="5">
                  <el-input size="medium" disabled v-model="orderInfo.carinfo.vinNo"></el-input>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="2">
                  <label>发动机号</label>
                </el-col>
                <el-col :span="5">
                  <el-input size="medium" disabled v-model="orderInfo.carinfo.engineNo"></el-input>
                </el-col>
                <el-col :span="3">
                  <label>厂牌型号</label>
                </el-col>
                <el-col :span="5">
                  <el-input size="medium" disabled v-model="orderInfo.carinfo.brandName"></el-input>
                </el-col>
                <el-col :span="3">
                  <label>车主</label>
                </el-col>
                <el-col :span="5">
                  <el-input size="medium" disabled v-model="orderInfo.ownerinfo.name"></el-input>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="2">
                  <label>核定载客量</label>
                </el-col>
                <el-col :span="5">
                  <el-input size="medium" disabled v-model="orderInfo.carinfo.seatCount"></el-input>
                </el-col>
                <el-col :span="3">
                  <label>是否过户</label>
                </el-col>
                <el-col :span="5">
                  <el-select disabled="" v-model="orderInfo.carinfo.transferFlag" placeholder="请选择" style="width: 100%;">
                    <el-option label="是" :value="true"></el-option>
                    <el-option label="否" :value="false"></el-option>
                  </el-select>
                </el-col>
                <el-col :span="3">
                  <label>注册日期</label>
                </el-col>
                <el-col :span="5">
                  <el-input size="medium" disabled v-model="registerDateFormat"></el-input>
                </el-col>

              </el-row>
              <el-row>
                <el-col :span="2">
                  <label>新车购置价</label>
                </el-col>
                <el-col :span="5">
                  <el-input size="medium" disabled v-model="orderInfo.carinfo.purchasePrice"></el-input>
                </el-col>
                <el-col :span="3">
                  <label>车型编码</label>
                </el-col>
                <el-col :span="5">
                  <el-input size="medium" disabled v-model="orderInfo.carinfo.modelCode"></el-input>
                </el-col>
                <el-col :span="3">
                  <label>发证日期</label>
                </el-col>
                <el-col :span="5">
                  <el-input size="medium" disabled v-model="issueDateFormat"></el-input>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="2">
                  <label>排量(L)</label>
                </el-col>
                <el-col :span="5">
                  <el-input size="medium" disabled v-model="orderInfo.carinfo.exhaustScale"></el-input>
                </el-col>
                <el-col :span="3">
                  <label>整备质量(KG)</label>
                </el-col>
                <el-col :span="5">
                  <el-input size="medium" disabled v-model="orderInfo.carinfo.completeKerbMass"></el-input>
                </el-col>
                <el-col :span="3">
                  <label>能源种类</label>
                </el-col>
                <el-col :span="5">
                  <el-input size="medium" disabled v-model="orderInfo.carinfo.powertype"></el-input>
                </el-col>
              </el-row>
            </el-row>
          </el-card>

          <!-- 关系人 -->
          <el-card id="demo2">
            <el-row class="header">
              <el-col>关系人信息</el-col>
            </el-row>
            <el-divider></el-divider>
            <div>
              <el-row class="u-f-ac bodyTitle"><label>车主</label></el-row>
              <el-row class="body">
                <el-row>
                  <el-col :span="2">
                    <label>证件类型</label>
                  </el-col>
                  <el-col :span="3">
                    <template v-if="orderInfo.ownerinfo.identifyType == '01'">
                      <el-input size="medium" disabled value="身份证"></el-input>
                    </template>
                    <template v-if="orderInfo.ownerinfo.identifyType != '01'">
                      <el-input size="medium" disabled :value="'其它证件类型'+orderInfo.ownerinfo.identifyType"></el-input>
                    </template>
                  </el-col>
                  <el-col :span="3">
                    <label>证件号码</label>
                  </el-col>
                  <el-col :span="3">
                    <el-input size="medium" disabled v-model="orderInfo.ownerinfo.identifyNumber"></el-input>
                  </el-col>
                  <el-col :span="3">
                    <label>姓名</label>
                  </el-col>
                  <el-col :span="3">
                    <el-input size="medium" disabled v-model="orderInfo.ownerinfo.name"></el-input>
                  </el-col>
                  <el-col :span="3">
                    <label>手机号</label>
                  </el-col>
                  <el-col :span="3">
                    <el-input size="medium" disabled v-model="orderInfo.ownerinfo.mobile"></el-input>
                  </el-col>
                </el-row>
                <el-row>
                  <el-col :span="2">
                    <label>地址</label>
                  </el-col>
                  <el-col :span="9">
                    <el-input size="medium" disabled v-model="orderInfo.ownerinfo.addr"></el-input>
                  </el-col>
                </el-row>
              </el-row>

              <el-row class="u-f-ac bodyTitle"><label>投保人</label></el-row>
              <el-row class="body">
                <el-row>
                  <el-col :span="2">
                    <label>证件类型</label>
                  </el-col>
                  <el-col :span="3">
                    <template v-if="orderInfo.applyinfo.identifyType == '01'">
                      <el-input size="medium" disabled value="身份证"></el-input>
                    </template>
                    <template v-if="orderInfo.applyinfo.identifyType != '01'">
                      <el-input size="medium" disabled :value="'其它证件类型'+orderInfo.applyinfo.identifyType"></el-input>
                    </template>
                  </el-col>
                  <el-col :span="3">
                    <label>证件号码</label>
                  </el-col>
                  <el-col :span="3">
                    <el-input size="medium" disabled v-model="orderInfo.applyinfo.identifyNumber"></el-input>
                  </el-col>
                  <el-col :span="3">
                    <label>姓名</label>
                  </el-col>
                  <el-col :span="3">
                    <el-input size="medium" disabled v-model="orderInfo.applyinfo.name"></el-input>
                  </el-col>
                  <el-col :span="3">
                    <label>手机号</label>
                  </el-col>
                  <el-col :span="3">
                    <el-input size="medium" disabled v-model="orderInfo.applyinfo.mobile"></el-input>
                  </el-col>
                </el-row>
                <el-row>
                  <el-col :span="2">
                    <label>地址</label>
                  </el-col>
                  <el-col :span="9">
                    <el-input size="medium" disabled v-model="orderInfo.applyinfo.addr"></el-input>
                  </el-col>
                </el-row>
              </el-row>

              <el-row class="u-f-ac bodyTitle"><label>被保险人</label></el-row>
              <el-row class="body">
                <el-row>
                  <el-col :span="2">
                    <label>证件类型</label>
                  </el-col>
                  <el-col :span="3">
                    <template v-if="orderInfo.insureinfo.identifyType == '01'">
                      <el-input size="medium" disabled value="身份证"></el-input>
                    </template>
                    <template v-if="orderInfo.insureinfo.identifyType != '01'">
                      <el-input size="medium" disabled :value="'其它证件类型'+orderInfo.insureinfo.identifyType"></el-input>
                    </template>
                  </el-col>
                  <el-col :span="3">
                    <label>证件号码</label>
                  </el-col>
                  <el-col :span="3">
                    <el-input size="medium" disabled v-model="orderInfo.insureinfo.identifyNumber"></el-input>
                  </el-col>
                  <el-col :span="3">
                    <label>姓名</label>
                  </el-col>
                  <el-col :span="3">
                    <el-input size="medium" disabled v-model="orderInfo.insureinfo.name"></el-input>
                  </el-col>
                  <el-col :span="3">
                    <label>手机号</label>
                  </el-col>
                  <el-col :span="3">
                    <el-input size="medium" disabled v-model="orderInfo.insureinfo.mobile"></el-input>
                  </el-col>
                </el-row>
                <el-row>
                  <el-col :span="2">
                    <label>地址</label>
                  </el-col>
                  <el-col :span="9">
                    <el-input size="medium" disabled v-model="orderInfo.insureinfo.addr"></el-input>
                  </el-col>
                </el-row>
              </el-row>
            </div>
          </el-card>

          <!-- 代理人 -->
          <el-card id="demo3">
            <el-row class="header">
              <el-col>代理人信息</el-col>
            </el-row>
            <el-divider></el-divider>

            <el-row class="body">
              <el-row>
                <el-col :span="2">
                  <label>代理人工号</label>
                </el-col>
                <el-col :span="3">
                  <el-input size="medium" disabled v-model="orderInfo.userid"></el-input>
                </el-col>
                <el-col :span="3">
                  <label>代理人姓名</label>
                </el-col>
                <el-col :span="3">
                  <el-input size="medium" disabled v-model="orderInfo.username"></el-input>
                </el-col>
                <el-col :span="3">
                  <label>代理人电话</label>
                </el-col>
                <el-col :span="3">
                  <el-input size="medium" disabled value="15234685241"></el-input>
                </el-col>
                <el-col :span="3">
                  <label>代理人团队</label>
                </el-col>
                <el-col :span="3">
                  <el-input size="medium" disabled v-model="orderInfo.deptname"></el-input>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="2">
                  <label>代理人状态</label>
                </el-col>
                <el-col :span="3">
                  <el-input size="medium" disabled value="在职"></el-input>
                </el-col>
                <el-col :span="3">
                  <label>代理人归属</label>
                </el-col>
                <el-col :span="3">
                  <el-input size="medium" disabled v-model="orderInfo.deptid"></el-input>
                </el-col>
              </el-row>
            </el-row>
          </el-card>


          <!-- 优惠政策 -->
          <el-card id="demo4">

            <el-row class="header">
              <el-col>优惠政策</el-col>
            </el-row>
            <el-divider></el-divider>

            <el-row class="body">
              <el-row class="u-f-ac" style="border-bottom: 1px solid #DDDDDD;height:40px;margin-bottom: 0;background: #F3F3F3;">
                <el-col class="u-f-ajc" :span="8">险种名称</el-col>
                <el-col class="u-f-ajc" :span="8">优惠比例</el-col>
                <el-col class="u-f-ajc" :span="8">优惠金额</el-col>
              </el-row>

              <el-row v-for="(riskItem,riskIndex) in orderInfo.riskinfo" :key="riskItem.riskCode+'2'" v-if="riskItem.riskCode == '0507'" class="u-f-ac" style="border-bottom: 1px solid #DDDDDD;height:40px;margin-bottom: 0;">
                <el-col class="u-f-ajc" :span="8">交强险</el-col>
                <el-col class="u-f-ajc" :span="8">{{orderInfo.jqdiscountrate}}%</el-col>
                <el-col class="u-f-ajc" :span="8">{{(riskItem.premium*orderInfo.jqdiscountrate/100).toFixed(2)}}</el-col>
              </el-row>
              <el-row v-for="(riskItem,riskIndex) in orderInfo.riskinfo" :key="riskItem.riskCode+'3'" v-if="riskItem.riskCode == '0510'" class="u-f-ac" style="border-bottom: 1px solid #DDDDDD;height:40px;margin-bottom: 0;">
                <el-col class="u-f-ajc" :span="8">商业险</el-col>
                <el-col class="u-f-ajc" :span="8">{{orderInfo.sydiscountrate}}%</el-col>
                <el-col class="u-f-ajc" :span="8">{{(riskItem.premium*orderInfo.sydiscountrate/100).toFixed(2)}}</el-col>
              </el-row>

            </el-row>
          </el-card>

          <!-- 正在报价的保险公司 -->
          <el-card id="demo5">
            <el-row class="header"><el-col>报价方案</el-col></el-row>
            <el-divider></el-divider>

            <el-row class="u-f-ac bodyTitle" style="margin-bottom: 20px;"><label>订 单 号 &nbsp;&nbsp;&nbsp;&nbsp; {{orderInfo.orderno}}</label></el-row>

            <el-row class="u-f-ac bodyTitle" style="margin-bottom: 20px;"><label style="margin: 0px 15px;font-weight: bold;">投保险种 &nbsp;&nbsp; {{orderInfo.product}}</label></el-row>

            <el-row class="u-f-ac bodyTitle" style="margin-bottom: 20px;"><label>报价结果</label></el-row>
            <el-row class="body">
              <el-row style="border-bottom: 1px solid #DDDDDD;padding-bottom: 10px;">
                <el-col class="u-f-ajc" :span="2">报价公司</el-col>
                <el-col class="u-f-ajc" :span="5" v-if="orderInfo.product != '单商业'">交强险</el-col>
                <el-col class="u-f-ajc" :span="5" v-if="orderInfo.product != '单商业'">车船税</el-col>
                <el-col class="u-f-ajc" :span="5" v-if="orderInfo.product != '单交强'">商业险</el-col>
                <el-col class="u-f-ajc" :span="5">总价</el-col>
                <el-col class="u-f-ajc" :span="2">操作</el-col>
              </el-row>
              <el-row>
                <el-col class="u-f-ajc" :span="2">{{orderInfo.inscompany}}
                </el-col>
                <el-col class="u-f-ajc" :span="5" v-if="orderInfo.product != '单商业'">{{orderInfo.jqpremium}}</el-col>
                <el-col class="u-f-ajc" :span="5" v-if="orderInfo.product != '单商业'">{{orderInfo.taxamount}}</el-col>
                <el-col class="u-f-ajc" :span="5" v-if="orderInfo.product != '单交强'">{{orderInfo.sypremium}}</el-col>
                <el-col class="u-f-ajc" :span="5">{{orderInfo.sumpremium}}</el-col>
                <el-col class="u-f-ajc" :span="2" >
                  <div class="u-f-ajc" style="color: #0086B3;cursor: pointer; " @click="showInsureList=!showInsureList">{{showInsureList?"收起":"展开"}}</div>
                </el-col>
              </el-row>
              <template v-if="showInsureList">
                <el-row style="margin: 20px 40px;">
                  <el-row class="u-f-ac" style="border-bottom: 1px solid #DDDDDD;height:40px;margin-bottom: 0;background: #F3F3F3;">
                    <el-col :span="8" class="u-f-ajc">险种名称</el-col>
                    <el-col :span="8" class="u-f-ajc">保额</el-col>
                    <el-col :span="8" class="u-f-ajc">保费</el-col>
                  </el-row>

                  <div v-for="(riskItem,riskIndex) in orderInfo.riskinfo" :key="riskItem.riskCode+'4'" v-if="riskItem.riskCode == '0507'">
                      <el-row class="u-f-ac" style="border-bottom: 1px solid #DDDDDD;height:40px;margin-bottom: 0;" >
                        <el-col :span="8" class="u-f-ajc">
                          <label class="disabledInput" >交强险</label>
                        </el-col>
                        <el-col :span="8" class="u-f-ajc">
                          <label class="disabledInput" >投保</label>
                        </el-col>
                        <el-col :span="8" class="u-f-ajc">
                          <label class="disabledInput" >{{riskItem.premium}}</label>
                        </el-col>
                      </el-row>
                      <el-row class="u-f-ac" style="border-bottom: 1px solid #DDDDDD;height:40px;margin-bottom: 0;" >
                        <el-col :span="8" class="u-f-ajc">
                          <label class="disabledInput" >车船税</label>
                        </el-col>
                        <el-col :span="8" class="u-f-ajc"> </el-col>
                        <el-col :span="8" class="u-f-ajc">
                          <label class="disabledInput" >{{orderInfo.taxamount}}</label>
                        </el-col>
                      </el-row>
                  </div>
                  <el-row class="u-f-ac" style="border-bottom: 1px solid #DDDDDD;height:40px;margin-bottom: 0;" v-for="(insureItem,insureIndex) in global.insureList" :key="insureIndex" v-if="insureItem.amount!=0">
                    <el-col :span="8" class="u-f-ajc">
                      <label class="disabledInput" >{{insureItem.kindName}}</label>
                    </el-col>
                    <el-col :span="8" class="u-f-ajc" v-for="(amtItem,amtIndex) in insureItem.amtList" :key="amtIndex" v-if="amtItem.value == insureItem.amount">
                      <label class="disabledInput" >{{amtItem.label}}</label>
                    </el-col>
                    <el-col :span="8" class="u-f-ajc">
                      <label class="disabledInput" >{{insureItem.coveragePremium}}</label>
                    </el-col>
                  </el-row>
                </el-row>
              </template>
            </el-row>
            <el-row class="u-f-ac bodyTitle"><label>保费合计</label></el-row>
            <el-row class="body">
              <el-row style="margin-top: 20px;"  class="u-f u-f-ac">
                 <label style="margin: 0px 20px 0 15px;width: 80px;">保费合计</label>
                 <el-input style="width:300px" disabled size="medium"  v-model="orderInfo.sumpremium" ></el-input>
              </el-row>
            </el-row>
          </el-card>
		  
		  <el-card id="demo6">
		  			  <el-row class="header">
		  				<el-col>影像</el-col>
		  			  </el-row>
		  			  <el-divider></el-divider>
		  			  <div style="margin-bottom: 10px;">
		  				<el-row class="u-f-ac bodyTitle"><label @click="pic1Control = !pic1Control">行驶证影像</label></el-row>
		  				<el-row class="body"  v-show="pic1Control" >
		  				  <el-row class="u-f">
		  					<viewer :images="carImageList" >
		  						<img class="imageStyle" v-for="(imageItem,imageIndex) in carImageList" :src="imageItem" :key="imageIndex">
		  					</viewer>
		  					<el-upload
		  						class="avatar-uploader"
		  						action=""
		  						name="carImageList"
		  						:show-file-list="false"
		  						:http-request="httpRequest"
		  						:before-upload="beforeAvatarUpload">
		  						<i class="el-icon-plus avatar-uploader-icon"></i>
		  					</el-upload>
		  				  </el-row>
		  				</el-row>
		  			  </div>
		  			  <div style="margin-bottom: 10px;">
		  				<el-row class="u-f-ac bodyTitle"><label @click="pic2Control = !pic2Control">车主身份证影像</label></el-row>
		  			  <el-row class="body" v-show="pic2Control">
		  				<el-row class="u-f">
		  					<viewer :images="ownerImageList" >
		  						<img class="imageStyle" v-for="(imageItem,imageIndex) in ownerImageList" :src="imageItem" :key="imageIndex">
		  					</viewer>
		  					<el-upload
		  						class="avatar-uploader"
		  						action=""
		  						name="ownerImageList"
		  						:show-file-list="false"
		  						:http-request="httpRequest"
		  						:before-upload="beforeAvatarUpload">
		  						<i class="el-icon-plus avatar-uploader-icon"></i>
		  					</el-upload>
		  				</el-row>
		  			  </el-row>
		  			  </div>
		  			  <div style="margin-bottom: 10px;">
		  				<el-row class="u-f-ac bodyTitle"><label @click="pic3Control = !pic3Control">投保人身份证影像</label></el-row>
		  			  <el-row class="body"  v-show="pic3Control">
		  				<el-row class="u-f">
		  					<viewer :images="policyImageList" >
		  						<img class="imageStyle" v-for="(imageItem,imageIndex) in policyImageList" :src="imageItem" :key="imageIndex">
		  					</viewer>
		  					<el-upload
		  						class="avatar-uploader"
		  						action=""
		  						name="policyImageList"
		  						:show-file-list="false"
		  						:http-request="httpRequest"
		  						:before-upload="beforeAvatarUpload">
		  						<i class="el-icon-plus avatar-uploader-icon"></i>
		  					</el-upload>
		  				</el-row>
		  			  </el-row>
		  			  </div>
		  			  <div style="margin-bottom: 10px;">
		  				<el-row class="u-f-ac bodyTitle"><label @click="pic4Control = !pic4Control">被保人身份证影像</label></el-row>
		  			  <el-row class="body"  v-show="pic4Control">
		  				<el-row class="u-f">
		  					<viewer :images="insuredImageList" >
		  						<img class="imageStyle" v-for="(imageItem,imageIndex) in insuredImageList" :src="imageItem" :key="imageIndex">
		  					</viewer>
		  					<el-upload
		  						class="avatar-uploader"
		  						action=""
		  						name="insuredImageList"
		  						:show-file-list="false"
		  						:http-request="httpRequest"
		  						:before-upload="beforeAvatarUpload">
		  						<i class="el-icon-plus avatar-uploader-icon"></i>
		  					</el-upload>
		  				</el-row>
		  			  </el-row>
		  			  </div>
		  			  <div style="margin-bottom: 10px;">
		  				<el-row class="u-f-ac bodyTitle"><label @click="pic5Control = !pic5Control">验车照影像</label></el-row>
		  			  <el-row class="body" v-show="pic5Control">
		  				<el-row class="u-f">
		  					<viewer :images="carCheckImageList" >
		  						<img class="imageStyle" v-for="(imageItem,imageIndex) in carCheckImageList" :src="imageItem" :key="imageIndex">
		  					</viewer>
		  					<el-upload
		  						class="avatar-uploader"
		  						action=""
		  						name="carCheckImageList"
		  						:show-file-list="false"
		  						:http-request="httpRequest"
		  						:before-upload="beforeAvatarUpload">
		  						<i class="el-icon-plus avatar-uploader-icon"></i>
		  					</el-upload>
		  				</el-row>
		  			  </el-row>
		  			  </div>
		  			</el-card>
					<el-card id="demo7">
					  <el-row class="header">
						<el-col>退回原因</el-col>
					  </el-row>
					  <el-divider></el-divider>
					  <div style="margin-bottom: 10px;">
							{{orderInfo.auditopinion}}
					  </div>
					</el-card>
        </el-row>
      </el-container>

      <span slot="footer" class="dialog-footer" style="position: fixed;bottom: 0px;left:0px;background: #fff;width: 100%;padding: 10px 0px;box-shadow: 0 -1px 0 0 #ddd;">
        <el-button size="small" @click="dialogVisible = false">关 闭</el-button>
		 <el-button size="small" type="primary" @click="submit(orderInfo.orderno)">再次提交核保</el-button>
      </span>
    </el-dialog>
	
	<el-dialog title="订单历史轨迹" :visible.sync="historyDialogVisible" width="1050px" >
	  <!-- 订单历史轨迹内容区域 -->
	  <div class="dialogBody" style="border: 1px solid #eaeaea;">
	    <div class="dialogBodyTop u-f">
	      <div class="dialogBodyTopLeft" style="border-right: 1px solid #eaeaea; width: 260px;margin-right: 20px;">
	        <el-row>
	          <el-col style="margin: 10px 0 10px 10px;font-size: 14px;">投保公司：{{history.company}}</el-col>
	          <el-col style="margin: 10px 0 10px 10px;font-size: 14px;">订单号：{{history.taskid}}</el-col>
	          <el-col style="margin: 10px 0 10px 10px;font-size: 14px;">投保险种：{{history.product}}</el-col>
	          <el-col style="margin: 10px 0 10px 10px;font-size: 14px;">保费金额：{{history.totalmoney}}</el-col>
	        </el-row>
	      </div>
	      <div class="dialogBodyTopRight u-f-ac"  style="width: 700px;padding-left: 20px;">
	        <el-steps style="width:100%" align-center :active="history.active" :space="220" finish-status="success">
	          <el-step title="报价中"></el-step>
	          <el-step title="待核保"></el-step>
	          <el-step title="已核保"></el-step>
	          <el-step title="已核保待缴费"></el-step>
	          <el-step title="已缴费待配送"></el-step>
	          <el-step title="已承保"></el-step>
	        </el-steps>
	      </div>
	    </div>
	    <div class="dialogBodyBottom">
	      <el-table border :header-cell-style="{background:'#F2F7FC',fontWeight: '700',color:'#606266'}" stripe :data="history.data" align="center"  height="350" style="width: 100%">
	          <el-table-column align="center" prop="remark" label="订单流程" width="180"></el-table-column>
	          <el-table-column align="center" prop="createtime" label="流程时间" width="180"></el-table-column>
	          <el-table-column align="center" prop="operatorid" label="操作人工号"> </el-table-column>
	          <el-table-column align="center" prop="operator" label="操作人名字"> </el-table-column>
	        </el-table>
	    </div>
	  </div>
	  <span slot="footer" class="dialog-footer">
	    <el-button size="small" type="primary" @click="historyDialogVisible = false">确 定</el-button>
	  </span>
	</el-dialog>

  </div>
</template>

<script>
  import Cookies from "js-cookie"
  import { formatWithSeperator,format } from "@/utils/datetime.js";
  export default {
    name: 'quote',
    data() {
      return {
        peopleid:"",
		
		totalComapny:[],//全部机构
        ordersList: [], //展示页面上的订单列表数据
        dialogVisible: false, //是否显示订单信息框
        showInsureList:false,//是否展示具体险种信息
        orderInfo: { //选中的订单
          ownerinfo:{},
          carinfo:{},
          applyinfo:{},
          insureinfo:{},
          kindinfo:[],
          riskinfo:[],
          ownerinfo:{}
        },

        historyDialogVisible: false,
        history:{
          taskid:"",
          company:"",
          data:[]
        },

        currentPage: 1, //当前页码
        pageSize:5,  //每页数据条数
        totalSize:0, //全部的数据条数

        optionProps: {  //公司下拉列表配置
          emitPath:false,
          checkStrictly: true,
          value: "id",
          label: "name",
          children: "children"
        },
        allIns:[],  //保险公司下拉列表

        //查询的表单
        queryForm: {
          "deptid": "",
          "licenseNo":"",
          "frameNo": "",
          "engineNo": "",
          "userid": "",
          "username": "",
          "inscompany":"",
          "riskCode": "",
          "startdate":"",
          "enddate": "",
          "policystartdate":"",
          "policyenddate":"",
          "insurename":"",
          "quoteno":"",
          "orderno":"",
          "auditid": "",
          "orderstatus":"3",
          "quoteDate":"",
          "policyDate":"",
          "policyDate":"",
          "editId":""
        },		
		
		carImageList:[],//车辆影像
		ownerImageList:[],//车主影像
		policyImageList:[],//投保人影像
		insuredImageList:[],//被保人影像
		carCheckImageList:[],//验车照影像
		// 影像控制
		pic1Control:false,
		pic2Control:false,
		pic3Control:false,
		pic4Control:false,
		pic5Control:false,
		
		isUserOrder:false,
		agentUserId:''
      }
    },
    created() {
		var query=this.$route.query;
		if(!!query.id){
			this.isUserOrder = true;
			this.agentUserId = query.id;
		}
		
		this.peopleid = Cookies.get('user');
		if(this.peopleid!='admin'){
			this.peopledeptid = Cookies.get('user').split('D')[0];
		}else{
			this.peopledeptid = '9';
		}
		this.getAllCompany();// 获取机构树的数据
		this.getOrderList();
		this.getAllIns();
    },
    computed:{
      allinsOption(){
        let cloneData = JSON.parse(JSON.stringify(this.allIns)); // 对源数据深度克隆
        return cloneData.filter(father => {
          // 循环所有项，并添加children属性
          let branchArr = cloneData.filter(child => father.id == child.parentId); // 返回每一项的子级数组
          branchArr.length > 0 ? (father.children = branchArr) : ""; //给父级添加一个children属性，并赋值
          return father.parentId == 0; //返回第一层
        });
      },
	  registerDateFormat(){
	  	let date = new Date(this.orderInfo.carinfo.registerDate);
	  	let year = date.getFullYear();
	  	let month = date.getMonth()+1;
	  	let day = date.getDate();
	  	return year+'-'+month+'-'+day;
	  },
	  issueDateFormat(){
	  	let date = new Date(this.orderInfo.carinfo.issueDate);
	  	let year = date.getFullYear();
	  	let month = date.getMonth()+1;
	  	let day = date.getDate();
	  	return year+'-'+month+'-'+day;
	  }
    },
    methods: {
		getAllCompany: function() {
		  // 获取数据
		  this.$api.dept.findLeftDeptTree(this.peopledeptid).then(res => {
			  for(let i=0;i<res.data.length;i++){
				  if(res.data[i].id.indexOf('D')<0){
					  this.totalComapny.push(res.data[i]);
				  }
			  }
		  });
		},		
      // 获取所有保险公司
      getAllIns(){
        this.$api.insCompany.findLeftInsTree("ZG").then(res => {
          this.allIns = res.data;
        });
      },
      closeOrder(quoteno){
        this.$confirm('是否确认关闭'+quoteno+'订单？')
          .then(_ => {

            this.$api.task.closeOrderno({'quoteno':quoteno}).then(res => {
              if(res.code == 200){
                this.currentPage=1; //当前页码
                this.totalSize=0; //全部的数据条数
                this.getOrderList();
                this.$message.success("已成功关闭订单")
              }
            });
          })
          .catch(_ => {
            this.$message.info("已取消关闭订单")
          });
      },


      //点击锚链接跳转Start
      jump(obj) {
        var s = document.getElementById(obj);
        var parent = s.parentNode
        for (let i = 0; i < parent.childNodes.length; i++) {
          if (parent.childNodes[i].tagName == 'DIV') {
            if (parent.childNodes[i].childNodes[0].classList.contains("active")) {
              parent.childNodes[i].childNodes[0].classList.remove("active");
            }
          }
        }
        s.childNodes[0].classList.add("active");
      },
      //点击锚链接跳转End

      queryGetOrderList(){
        this.currentPage = 1;
        this.getOrderList();
      },

      handleCurrentChange(page) {
        console.log("页码发生变化")
        this.currentPage = page;
        console.log(this.currentPage);
        this.getOrderList();
      },
      handleSizeChange(size) {
        console.log("每页显示个数变化")
        this.pageSize = size;
        console.log(this.pageSize);
        this.getOrderList();
      },

      //关闭报价任务Start
      closeTaskDialogVisible() {
        this.$confirm('确认关闭？')
          .then(_ => {
            this.dialogVisible = false;
          })
          .catch(_ => {});
      },
      queryHandleClose(done) {
        this.$confirm('确认关闭？')
          .then(_ => {
            done();
          })
          .catch(_ => {});
      },
      //关闭报价任务End

      // 获取报价成功订单信息Start
      getOrderList: function() {
        var data = {
          "columnFilters": {
            "deptid": {"name": "deptid","value": ""},
            "licenseNo": {"name": "licenseNo","value": ""},
            "frameNo": {"name": "frameNo","value": ""},
            "engineNo": {"name": "engineNo","value": ""},
            "userid": {"name": "userid","value": ""},
            "username": {"name": "username","value": ""},
            "inscompany": {"name": "inscompany","value": ""},
            "riskCode": {"name": "riskCode","value": ""},
            "startdate": {"name": "startdate","value": ""},
            "enddate": {"name": "enddate","value": ""},
            "policystartdate": {"name": "policystartdate","value": ""},
            "policyenddate": {"name": "policyenddate","value": ""},
            "insurename": {"name": "insurename","value": ""},
            "auditid": {"name": "auditid","value": ""},
            "quoteno": {"name": "quoteno","value": ""},
            "orderno": {"name": "orderno","value": ""},
            "orderstatus": {"name": "orderstatus","value": "3"},
            "quotestatus": {"name": "quotestatus","value": "1"},
            "editId": {"name": "editId","value": this.peopleid}
          },
          "pageNum": this.currentPage,
          "pageSize": this.pageSize
        }
        for(let key in this.queryForm){
          if((key !="quoteDate") && (key !="policyDate") && (key !="startdate") && (key !="enddate") &&(key !="policystartdate") && (key !="policyenddate")  && (key !="editId") ){
            data.columnFilters[key].value = this.queryForm[key];
          }
          if((key =="quoteDate") && (!!this.queryForm.quoteDate)){
            var startdate =formatWithSeperator(this.queryForm.quoteDate[0],'-',':').split(' ')[0];
            var enddate = formatWithSeperator(this.queryForm.quoteDate[1],'-',':').split(' ')[0];
            data.columnFilters.startdate.value = startdate;
            data.columnFilters.enddate.value = enddate;
          }
          if((key =="policyDate") && (!!this.queryForm.policyDate )){
            var policystartdate =formatWithSeperator(this.queryForm.policyDate[0],'-',':').split(' ')[0];
            var policyenddate = formatWithSeperator(this.queryForm.policyDate[1],'-',':').split(' ')[0];
            data.columnFilters.policystartdate.value = policystartdate;
            data.columnFilters.policyenddate.value = policyenddate;
          }
        }

		if(this.isUserOrder){
			data.columnFilters.userid.value = this.agentUserId;
		}else{
			if(this.peopleid!='admin'){
			  data.columnFilters.auditid.value = this.peopleid;
			}else{
			  data.columnFilters.auditid.value = "";
			}
		}
        

        this.$api.task.findPage(data).then(res => {
          this.ordersList = res.data.content;
          this.totalSize = res.data.totalSize;
        });
      },
      // 获取报价成功订单信息End

      //获取一个订单的全部信息Start
      getQuoteInfo: function(orderno) {
		  
		this.carImageList=[];
		this.ownerImageList=[];//车主影像
		this.policyImageList=[];//投保人影像
		this.insuredImageList=[];//被保人影像
		this.carCheckImageList=[];//验车照影像
		// 影像控制
		this.pic1Control=false;
		this.pic2Control=false;
		this.pic3Control=false;
		this.pic4Control=false;
		this.pic5Control=false;
		
        for(let i=0;i< this.global.insureList.length;i++){
          this.global.insureList[i].coveragePremium = "";
          this.global.insureList[i].amount = 0;
        }

        this.$api.task.getOrderInfoByOrderno(orderno).then(res => {
          console.log(res);
          if(res.code ==200){
            Object.assign(this.orderInfo,res.data);
            for(let i=0;i< this.orderInfo.riskinfo.length;i++){
            	if(this.orderInfo.riskinfo[i].riskCode=='0510'){
            		for(let j=0;j<this.orderInfo.kindinfo.length;j++){
            			for(let m =0;m<this.global.insureList.length;m++){
            				if(this.orderInfo.kindinfo[j].kindCode == this.global.insureList[m].kindCode){
            					this.global.insureList[m].coveragePremium = this.orderInfo.kindinfo[j].coveragePremium;
            					if(this.orderInfo.kindinfo[j].kindCode == 'B'){
            						this.global.insureList[9].amtList[0].value=this.orderInfo.kindinfo[j].amount;
            					}
            					if(this.orderInfo.kindinfo[j].kindCode == 'A'){
            						this.global.insureList[m].amount = '1';
            					}else if(this.global.insureList[m].kindCode == 'D4'){
            						this.global.insureList[m].amount = this.orderInfo.kindinfo[j].unitAmount;
            					}else if(this.global.insureList[m].isMainRisk ||(this.global.insureList[m].kindCode=='BD')|| (this.global.insureList[m].kindCode=='L')){
            						this.global.insureList[m].amount = this.orderInfo.kindinfo[j].amount;
            					}else{
            						this.global.insureList[m].amount = this.orderInfo.kindinfo[j].deductibleRate;
            					}

            				}
            			}
            		}
            	}
            }
            this.showInsureList=false;
            this.dialogVisible = true; //在页面上显示订单
          }else{
            this.$message.error("订单获取失败");
          }
        })
      },
      //获取一个订单的全部信息End

      //获取订单轨迹
	  getHistoryList: function(taskid,product,totalmoney) {
	    this.history.taskid = "";
	    this.history.company = "";
	    this.history.product = "";
	    this.history.totalmoney = "";
	    this.history.product = product;
	    this.history.totalmoney = totalmoney;
	    this.history.data = [];
	    this.$api.task.queryOrderHistory(taskid).then(res => {
	      if (res.code == 200) {
	        this.history.taskid = res.data[0].taskid;
	        this.history.company = res.data[res.data.length-1].company;
	        if(res.data[res.data.length-1].status=='0'){
	          this.history.active = 1;
	        }else if(res.data[res.data.length-1].status=='1'){
	          this.history.active = 2;
	        }else if(res.data[res.data.length-1].status=='2'){
	          this.history.active = 3;
	        }else if(res.data[res.data.length-1].status=='5'){
	          this.history.active = 4;
	        }else if(res.data[res.data.length-1].status=='6'){
	          this.history.active = 5;
	        }else if(res.data[res.data.length-1].status=='7'){
	          this.history.active = 6;
	        }
	        this.history.data=res.data;
	        this.historyDialogVisible = true;
	      }
	    })
	  },
	  // 上传图片的方法Start
	  	  beforeAvatarUpload(file) {
	  	    const isJPG = (file.type === 'image/jpeg' ||  file.type === 'image/png') ;
	  	    // const isLt2M = file.size / 1024 / 1024 < 0.2;
	  	    if (!isJPG) {
	  		  this.$message({message: '上传图片只能是 JPG 或者 PNG 格式!',type: 'error',duration:2000})
	  	    }
	  	    // if (!isLt2M) {
	  	    //   this.$message.error('上传图片大小不能超过 200KB!');
	  	    // }
	  	    // return isJPG && isLt2M;
	  	    return isJPG;
	  	  },
	  	  httpRequest(options) {
	  	      let file = options.file;
	  	      let filename = options.filename;
	  	      let reader  = new FileReader();
	  	      if (file) {
	  	          reader.readAsDataURL(file)
	  	      }
	  	      reader.onload = () => {
	  	          let base64Str = reader.result;
	  			  console.log(options.filename)
	  	          this[options.filename].push(base64Str);
	  	      }
	  	  },
	  	  // 上传图片的方法End
	  	  submit(orderno){
	  		  this.$confirm('是否确认提交核保？', '提示', {}).then(async() => {
	  			  await this.$api.user.savePersonImage({
	  				taskid:orderno,
	  				imgtype:"C01",
	  				imgList:this.carImageList
	  			  })
	  			  await this.$api.user.savePersonImage({
	  				taskid:orderno,
	  				imgtype:"C02",
	  				imgList:this.ownerImageList
	  			  })
	  			  await this.$api.user.savePersonImage({
	  				taskid:orderno,
	  				imgtype:"C03",
	  				imgList:this.policyImageList
	  			  })
	  			  await this.$api.user.savePersonImage({
	  				taskid:orderno,
	  				imgtype:"C04",
	  				imgList:this.insuredImageList
	  			  })
	  			  await this.$api.user.savePersonImage({
	  				taskid:orderno,
	  				imgtype:"C05",
	  				imgList:this.carCheckImageList
	  			  })
	  			  let param={
	  				  orderno:orderno,
					  jqappoint:'',
					  syappoint:''
	  			  }
	  			 await this.$api.task.submitAudit(param).then((res)=>{
	  				if(res.code == 200){
	  					this.$message({message: '操作成功',type: 'success',duration:2000})
	  					this.dialogVisible = false;
	  					this.currentPage= 1; //当前页码
	  					this.totalSize= 0; //全部的数据条数
	  					this.getOrderList();
	  				}else{
	  					this.$message({message: '操作失败, ' + res.msg,type: 'error',duration:2000})
	  				}
	  			}) 
	  		  })
			}
    }
  }
</script>

<style scoped>
  .queryForm{
      background: #F2F7FC;
      position:relative;
      border:1px solid #ddd;
      border-radius: 10px;
      margin-top: 15px;
      margin-bottom: 15px;
      padding: 10px 20px 0;
  }
  .queryForm:before{
      content:attr(title);
      position:absolute;
      left:10%;
      transform:translate(-50%,-120%);
      /* -webkit-transform:translate(-50%,-50%); */
      padding:0 10px;
      background-color:#fff;
  }


  /* 页面的整体布局 */
  .page-container {
    margin: 0px 10px;
  }

  /* 任务区域样式Start */
  .tasks {}
  .task {
    border-color: #A6A6A6;
    line-height: 25px;
    font-size: 14px;
    margin-bottom: 10px;
  }
  .task .row{
    margin-bottom: 10px;
    line-height: 28px;
    font-size: 12px;
  }
  .task .row .label{
    padding:0 10px;
  }
  .task_bottom {
    margin-top: 10px;
  }
  /* 任务区域样式End */

  /* 弹出窗口(订单详情)Start */
  .leftContainer {
    width: 80px;
    position: fixed;
    top: 79px;
    left: 30px;
  }
  .leftContainer .el-col {
    width: 80px;
    height: 80px;
    border-bottom: 1px solid #4D5C6F;
    background: #526176;
    cursor: pointer;
    color: #A6AEB9;
    border-radius: 0;
  }
  .leftContainer .el-col a {
    display: block;
    color: #A6AEB9;
    text-decoration: none;
  }
  .leftContainer .el-col a:hover {
    color: #fff;
  }
  .leftContainer .el-col a.active {
    color: #fff;
  }
  .leftContainer .el-col i {
    font-size: 30px;
    margin: 15px 0px 5px;
  }
  .rightContainer {
    width: calc(100vw - 160px);
    margin-left: 100px;
  }
  .rightContainer .header .el-col{
    font-size:18px;
    font-weight: bold;
  }
  .rightContainer .bodyTitle{
    height: 40px;
    background: #F3F3F3;
    border:1px solid #DDDDDD
  }
  .rightContainer .bodyTitle>label{
    margin: 0px 15px;
    font-weight: bold;
  }
  .rightContainer #demo2 .body,.rightContainer #demo6 .body{
    border: 1px solid #DDD;
    padding: 15px;
    border-top: none;
  }
  .rightContainer .el-card {
    margin-bottom: 15px;
  }
  /* 弹出窗口(订单详情)End */

  .body .el-row {
    margin-bottom: 15px;
  }

  .body .el-row .el-col label {
    text-align: right;
    width: 80px;
    font-size: 14px;
    width: 100%;
    line-height: 36px;
    display: inline-block;
    box-sizing: border-box;
    padding-right: 15px;
  }

  .disabledInput{
    width: 80%!important;
    background-color: #F5F7FA;
    text-align: center!important;
    max-width: 200px;
    border: 1px solid #E4E7ED;
    color: #C0C4CC;
    cursor: not-allowed;
    border-radius: 4px;
    box-sizing: border-box;
    padding: 0px 10px;
    height: 36px;
    margin: 20px 10%;
  }
  
  /* 上传图片样式Start */
    .avatar-uploader .el-upload {
       border: 1px dashed #d9d9d9;
       border-radius: 6px;
       cursor: pointer;
       position: relative;
       overflow: hidden;
     }
     .avatar-uploader .el-upload:hover {
       border-color: #409EFF;
     }
     .avatar-uploader-icon {
       font-size: 28px;
       color: #8c939d;
       width: 100px;
       height: 100px;
       line-height: 100px;
       text-align: center;
       border: 1px dashed #d9d9d9;
     }
     .avatar {
       border: 1px dashed #d9d9d9;
       padding: 5px;
       border-radius: 6px;
       width: 100px;
       height: 100px;
       display: block;
     }
     .imageStyle{
       display: inline-block;
       width: 100px;
       height: 100px;
       box-shadow:#ddd 0px 0px 5px;
       margin-right: 20px;
     }
    /* 上传图片样式End */
  
  /deep/ .el-input.is-disabled .el-input__inner{
	  color: #333;
  }
</style>