|
|
@@ -0,0 +1,1116 @@
|
|
|
+<template>
|
|
|
+ <div>
|
|
|
+ <el-dialog :visible.sync="imageUploaddialogVisible" width="1070px">
|
|
|
+ <div slot="title" class="dialog-title">
|
|
|
+ <span>影像上传</span>
|
|
|
+ </div>
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="4">
|
|
|
+ <div class="tab-style">
|
|
|
+ <li class="liMenu" :class="idx == tabLiIndex ? 'tabLi-style' : ''"
|
|
|
+ @click="tabLiScroll(item.scroll, idx)" v-for="(item, idx) in tabLimenu" :key="idx">
|
|
|
+ {{ item.name }}
|
|
|
+ </li>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="20" style="height: 320px; overflow-y: auto">
|
|
|
+ <div class="flex f-wrap" id="vehicle">
|
|
|
+ <div class="aaa">
|
|
|
+ <span>1.行驶证主页</span>
|
|
|
+ <el-upload action="#" list-type="picture-card" :auto-upload="false" :limit="1" drag :on-change="(file) => drivingupload(file, 'imageList1', 'imgList1', 'C01')
|
|
|
+ " :file-list="imgList1" ref="upload1" :class="{ styleB: imgList1.length == 1 }">
|
|
|
+ <img v-show="imgList1.length == 0" src="../../../../static/carfront.png"
|
|
|
+ style="width: 100%; height: 100%" />
|
|
|
+ <div slot="file" slot-scope="{ file }" v-if="imgList1.length > 0">
|
|
|
+ <img class="el-upload-list__item-thumbnail" :src="file.url" alt />
|
|
|
+ <span class="el-upload-list__item-actions">
|
|
|
+ <span class="el-upload-list__item-delete"
|
|
|
+ @click="handleRemove1(file, 'imageList1', 'imgList1')">
|
|
|
+ <i class="el-icon-zoom-in" @click.stop="handlePictureCardPreview(file.url)"></i>
|
|
|
+ <i class="el-icon-delete"></i>
|
|
|
+ </span>
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ </el-upload>
|
|
|
+ </div>
|
|
|
+ <div class="aaa">
|
|
|
+ <span>2.行驶证副页</span>
|
|
|
+ <el-upload action="#" list-type="picture-card" :auto-upload="false" :limit="1" drag :on-change="(file) => drivingupload(file, 'imageList1', 'imgList2', 'D01')
|
|
|
+ " :file-list="imgList2" ref="upload2" :class="{ styleB: imgList2.length === 1 }">
|
|
|
+ <img v-show="imgList2.length == 0" src="../../../../static/carback.png"
|
|
|
+ style="width: 100%; height: 100%" />
|
|
|
+ <div slot="file" slot-scope="{ file }">
|
|
|
+ <img class="el-upload-list__item-thumbnail" :src="file.url" alt />
|
|
|
+ <span class="el-upload-list__item-actions">
|
|
|
+ <span class="el-upload-list__item-delete"
|
|
|
+ @click="handleRemove1(file, 'imageList1', 'imgList2')">
|
|
|
+ <i class="el-icon-zoom-in" @click.stop="handlePictureCardPreview(file.url)"></i>
|
|
|
+ <i class="el-icon-delete"></i>
|
|
|
+ </span>
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ </el-upload>
|
|
|
+ </div>
|
|
|
+ <div class="aaa">
|
|
|
+ <span>3.机动车辆登记证书</span>
|
|
|
+ <el-upload action="#" list-type="picture-card" :auto-upload="false" :limit="1" drag :on-change="(file) => drivingupload(file, 'imageList1', 'imgList12', 'TAR05')
|
|
|
+ " :file-list="imgList12" ref="upload2" :class="{ styleB: imgList12.length === 1 }">
|
|
|
+ <img v-show="imgList12.length == 0" src="../../../../static/carback.png"
|
|
|
+ style="width: 100%; height: 100%" />
|
|
|
+ <div slot="file" slot-scope="{ file }">
|
|
|
+ <img class="el-upload-list__item-thumbnail" :src="file.url" alt />
|
|
|
+ <span class="el-upload-list__item-actions">
|
|
|
+ <span class="el-upload-list__item-delete"
|
|
|
+ @click="handleRemove1(file, 'imageList1', 'imgList12')">
|
|
|
+ <i class="el-icon-zoom-in" @click.stop="handlePictureCardPreview(file.url)"></i>
|
|
|
+ <i class="el-icon-delete"></i>
|
|
|
+ </span>
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ </el-upload>
|
|
|
+ </div>
|
|
|
+ <div class="aaa">
|
|
|
+ <span>4.新车合格证</span>
|
|
|
+ <el-upload action="#" list-type="picture-card" :auto-upload="false" :limit="1" drag :on-change="(file) =>
|
|
|
+ drivingupload(file, 'imageList5', 'imgList9', 'XC00')
|
|
|
+ " :file-list="imgList9" multiple ref="upload3" :class="{ styleB: imgList9.length === 1 }">
|
|
|
+ <img v-show="imgList9.length == 0" src="../../../../static/userfront.png"
|
|
|
+ style="width: 100%; height: 100%" />
|
|
|
+ <div slot="file" slot-scope="{ file }">
|
|
|
+ <img class="el-upload-list__item-thumbnail" :src="file.url" alt />
|
|
|
+ <span class="el-upload-list__item-actions">
|
|
|
+ <span class="el-upload-list__item-delete"
|
|
|
+ @click="handleRemove1(file, 'imageList5', 'imgList9')">
|
|
|
+ <i class="el-icon-zoom-in" @click.stop="handlePictureCardPreview(file.url)"></i>
|
|
|
+ <i class="el-icon-delete"></i>
|
|
|
+ </span>
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ </el-upload>
|
|
|
+ </div>
|
|
|
+ <div class="aaa">
|
|
|
+ <span>5.购车发票</span>
|
|
|
+ <el-upload action="#" list-type="picture-card" :auto-upload="false" :limit="1" drag :on-change="(file) =>
|
|
|
+ drivingupload(file, 'imageList5', 'imgList10', 'GC00')
|
|
|
+ " :file-list="imgList10" multiple ref="upload4"
|
|
|
+ :class="{ styleB: imgList10.length === 1 }">
|
|
|
+ <img v-show="imgList10.length == 0" src="../../../../static/userfront.png"
|
|
|
+ style="width: 100%; height: 100%" />
|
|
|
+ <div slot="file" slot-scope="{ file }">
|
|
|
+ <img class="el-upload-list__item-thumbnail" :src="file.url" alt />
|
|
|
+ <span class="el-upload-list__item-actions">
|
|
|
+ <span class="el-upload-list__item-delete"
|
|
|
+ @click="handleRemove1(file, 'imageList5', 'imgList10')">
|
|
|
+ <i class="el-icon-zoom-in" @click.stop="handlePictureCardPreview(file.url)"></i>
|
|
|
+ <i class="el-icon-delete"></i>
|
|
|
+ </span>
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ </el-upload>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ </div>
|
|
|
+ <div class="flex f-wrap" id="owner">
|
|
|
+ <div class="aaa">
|
|
|
+ <span>1.车主身份证（正面）</span>
|
|
|
+ <el-upload action="#" list-type="picture-card" :auto-upload="false" :limit="1" drag :on-change="(file) => drivingupload(file, 'imageList2', 'imgList3', 'C02')
|
|
|
+ " :file-list="imgList3" multiple ref="upload3" :class="{ styleB: imgList3.length === 1 }">
|
|
|
+ <img v-show="imgList3.length == 0" src="../../../../static/userfront.png"
|
|
|
+ style="width: 100%; height: 100%" />
|
|
|
+ <div slot="file" slot-scope="{ file }">
|
|
|
+ <img class="el-upload-list__item-thumbnail" :src="file.url" alt />
|
|
|
+ <span class="el-upload-list__item-actions">
|
|
|
+ <span class="el-upload-list__item-delete"
|
|
|
+ @click="handleRemove1(file, 'imageList2', 'imgList3')">
|
|
|
+ <i class="el-icon-zoom-in" @click.stop="handlePictureCardPreview(file.url)"></i>
|
|
|
+ <i class="el-icon-delete"></i>
|
|
|
+ </span>
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ </el-upload>
|
|
|
+ </div>
|
|
|
+ <div class="aaa">
|
|
|
+ <span>2.车主身份证（反面）</span>
|
|
|
+ <el-upload action="#" list-type="picture-card" :auto-upload="false" :limit="1" drag :on-change="(file) => drivingupload(file, 'imageList2', 'imgList4', 'D02')
|
|
|
+ " :file-list="imgList4" multiple ref="upload4" :class="{ styleB: imgList4.length === 1 }">
|
|
|
+ <img v-show="imgList4.length == 0" src="../../../../static/userback.png"
|
|
|
+ style="width: 100%; height: 100%" />
|
|
|
+ <div slot="file" slot-scope="{ file }">
|
|
|
+ <img class="el-upload-list__item-thumbnail" :src="file.url" alt />
|
|
|
+ <span class="el-upload-list__item-actions">
|
|
|
+ <span class="el-upload-list__item-delete"
|
|
|
+ @click="handleRemove1(file, 'imageList2', 'imgList4')">
|
|
|
+ <i class="el-icon-zoom-in" @click.stop="handlePictureCardPreview(file.url)"></i>
|
|
|
+ <i class="el-icon-delete"></i>
|
|
|
+ </span>
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ </el-upload>
|
|
|
+ </div>
|
|
|
+ <div class="aaa">
|
|
|
+ <span>3.营业执照</span>
|
|
|
+ <el-upload action="#" list-type="picture-card" :auto-upload="false" :limit="1" drag multiple
|
|
|
+ ref="upload4">
|
|
|
+ <img src="../../../../static/userfront.png" style="width: 100%; height: 100%" />
|
|
|
+ <div slot="file" slot-scope="{ file }">
|
|
|
+ <img class="el-upload-list__item-thumbnail" :src="file.url" alt />
|
|
|
+ <span class="el-upload-list__item-actions">
|
|
|
+ <span class="el-upload-list__item-delete"
|
|
|
+ @click="handleRemove1(file, 'imageList2', 'imgList4')">
|
|
|
+ <i class="el-icon-zoom-in" @click.stop="handlePictureCardPreview(file.url)"></i>
|
|
|
+ <i class="el-icon-delete"></i>
|
|
|
+ </span>
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ </el-upload>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="flex f-wrap" id="applicant">
|
|
|
+ <div class="aaa">
|
|
|
+ <span>1.投保人身份证（正面）</span>
|
|
|
+ <el-upload action="#" list-type="picture-card" :auto-upload="false" :limit="1" drag :on-change="(file) => drivingupload(file, 'imageList3', 'imgList5', 'C03')
|
|
|
+ " :file-list="imgList5" multiple ref="upload5" :class="{ styleB: imgList5.length === 1 }">
|
|
|
+ <img v-show="imgList5.length == 0" src="../../../../static/userfront.png"
|
|
|
+ style="width: 100%; height: 100%" />
|
|
|
+ <div slot="file" slot-scope="{ file }">
|
|
|
+ <img class="el-upload-list__item-thumbnail" :src="file.url" alt />
|
|
|
+ <span class="el-upload-list__item-actions">
|
|
|
+ <span class="el-upload-list__item-delete"
|
|
|
+ @click="handleRemove1(file, 'imageList3', 'imgList5')">
|
|
|
+ <i class="el-icon-zoom-in" @click.stop="handlePictureCardPreview(file.url)"></i>
|
|
|
+ <i class="el-icon-delete"></i>
|
|
|
+ </span>
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ </el-upload>
|
|
|
+ </div>
|
|
|
+ <div class="aaa">
|
|
|
+ <span>2.投保人身份证（反面）</span>
|
|
|
+ <el-upload action="#" list-type="picture-card" :auto-upload="false" :limit="1" drag :on-change="(file) => drivingupload(file, 'imageList3', 'imgList6', 'D03')
|
|
|
+ " :file-list="imgList6" multiple ref="upload6" :class="{ styleB: imgList6.length === 1 }">
|
|
|
+ <img v-show="imgList6.length == 0" src="../../../../static/userback.png"
|
|
|
+ style="width: 100%; height: 100%" />
|
|
|
+ <div slot="file" slot-scope="{ file }">
|
|
|
+ <img class="el-upload-list__item-thumbnail" :src="file.url" alt />
|
|
|
+ <span class="el-upload-list__item-actions">
|
|
|
+ <span class="el-upload-list__item-delete"
|
|
|
+ @click="handleRemove1(file, 'imageList3', 'imgList6')">
|
|
|
+ <i class="el-icon-zoom-in" @click.stop="handlePictureCardPreview(file.url)"></i>
|
|
|
+ <i class="el-icon-delete"></i>
|
|
|
+ </span>
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ </el-upload>
|
|
|
+ </div>
|
|
|
+ <div class="aaa">
|
|
|
+ <span>3.营业执照</span>
|
|
|
+ <el-upload action="#" list-type="picture-card" :auto-upload="false" :limit="1" drag multiple
|
|
|
+ ref="upload4">
|
|
|
+ <img src="../../../../static/userfront.png" style="width: 100%; height: 100%" />
|
|
|
+ <div slot="file" slot-scope="{ file }">
|
|
|
+ <img class="el-upload-list__item-thumbnail" :src="file.url" alt />
|
|
|
+ <span class="el-upload-list__item-actions">
|
|
|
+ <span class="el-upload-list__item-delete"
|
|
|
+ @click="handleRemove1(file, 'imageList2', 'imgList4')">
|
|
|
+ <i class="el-icon-zoom-in" @click.stop="handlePictureCardPreview(file.url)"></i>
|
|
|
+ <i class="el-icon-delete"></i>
|
|
|
+ </span>
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ </el-upload>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="flex f-wrap">
|
|
|
+ <div class="aaa">
|
|
|
+ <span id="insured">1.被保人身份证（正面）</span>
|
|
|
+ <el-upload action="#" list-type="picture-card" :auto-upload="false" :limit="1" drag :on-change="(file) => drivingupload(file, 'imageList4', 'imgList7', 'C04')
|
|
|
+ " :file-list="imgList7" multiple ref="upload7" :class="{ styleB: imgList7.length === 1 }">
|
|
|
+ <img v-show="imgList7.length == 0" src="../../../../static/userfront.png"
|
|
|
+ style="width: 100%; height: 100%" />
|
|
|
+ <div slot="file" slot-scope="{ file }">
|
|
|
+ <img class="el-upload-list__item-thumbnail" :src="file.url" alt />
|
|
|
+ <span class="el-upload-list__item-actions">
|
|
|
+ <span class="el-upload-list__item-delete"
|
|
|
+ @click="handleRemove1(file, 'imageList4', 'imgList7')">
|
|
|
+ <i class="el-icon-zoom-in" @click.stop="handlePictureCardPreview(file.url)"></i>
|
|
|
+ <i class="el-icon-delete"></i>
|
|
|
+ </span>
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ </el-upload>
|
|
|
+ </div>
|
|
|
+ <div class="aaa">
|
|
|
+ <span>2.被保人身份证（反面）</span>
|
|
|
+ <el-upload action="#" list-type="picture-card" :auto-upload="false" :limit="1" drag :on-change="(file) => drivingupload(file, 'imageList4', 'imgList8', 'D04')
|
|
|
+ " :file-list="imgList8" multiple ref="upload8" :class="{ styleB: imgList8.length === 1 }">
|
|
|
+ <img v-show="imgList8.length == 0" src="../../../../static/userback.png"
|
|
|
+ style="width: 100%; height: 100%" />
|
|
|
+ <div slot="file" slot-scope="{ file }">
|
|
|
+ <img class="el-upload-list__item-thumbnail" :src="file.url" alt />
|
|
|
+ <span class="el-upload-list__item-actions">
|
|
|
+ <span class="el-upload-list__item-delete"
|
|
|
+ @click="handleRemove1(file, 'imageList4', 'imgList8')">
|
|
|
+ <i class="el-icon-zoom-in" @click.stop="handlePictureCardPreview(file.url)"></i>
|
|
|
+ <i class="el-icon-delete"></i>
|
|
|
+ </span>
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ </el-upload>
|
|
|
+ </div>
|
|
|
+ <div class="aaa">
|
|
|
+ <span>3.营业执照</span>
|
|
|
+ <el-upload action="#" list-type="picture-card" :auto-upload="false" :limit="1" drag multiple
|
|
|
+ ref="upload4">
|
|
|
+ <img src="../../../../static/userfront.png" style="width: 100%; height: 100%" />
|
|
|
+ <div slot="file" slot-scope="{ file }">
|
|
|
+ <img class="el-upload-list__item-thumbnail" :src="file.url" alt />
|
|
|
+ <span class="el-upload-list__item-actions">
|
|
|
+ <span class="el-upload-list__item-delete"
|
|
|
+ @click="handleRemove1(file, 'imageList2', 'imgList4')">
|
|
|
+ <i class="el-icon-zoom-in" @click.stop="handlePictureCardPreview(file.url)"></i>
|
|
|
+ <i class="el-icon-delete"></i>
|
|
|
+ </span>
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ </el-upload>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="flex f-wrap" id="relationship">
|
|
|
+ <div class="aaa">
|
|
|
+ <span>1.关系证明</span>
|
|
|
+ <el-upload action="#" list-type="picture-card" :auto-upload="false" :limit="1" drag :on-change="(file) =>
|
|
|
+ drivingupload(file, 'imageList5', 'imgList11', 'GX00')
|
|
|
+ " :file-list="imgList11" multiple ref="upload3"
|
|
|
+ :class="{ styleB: imgList11.length === 1 }">
|
|
|
+ <img v-show="imgList11.length == 0" src="../../../../static/userfront.png"
|
|
|
+ style="width: 100%; height: 100%" />
|
|
|
+ <div slot="file" slot-scope="{ file }">
|
|
|
+ <img class="el-upload-list__item-thumbnail" :src="file.url" alt />
|
|
|
+ <span class="el-upload-list__item-actions">
|
|
|
+ <span class="el-upload-list__item-delete"
|
|
|
+ @click="handleRemove1(file, 'imageList5', 'imgList11')">
|
|
|
+ <i class="el-icon-zoom-in" @click.stop="handlePictureCardPreview(file.url)"></i>
|
|
|
+ <i class="el-icon-delete"></i>
|
|
|
+ </span>
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ </el-upload>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="flex f-wrap" id="yanchezhao">
|
|
|
+ <div class="aaa">
|
|
|
+ <span>1.验车照（车架）</span>
|
|
|
+ <el-upload action="#" list-type="picture-card" :auto-upload="false" :limit="1" drag :on-change="(file) =>
|
|
|
+ drivingupload(file, 'imageList6', 'imgList13', 'C0500')
|
|
|
+ " :file-list="imgList13" multiple ref="upload3"
|
|
|
+ :class="{ styleB: imgList13.length === 1 }">
|
|
|
+ <img v-show="imgList13.length == 0" src="../../../../static/userfront.png"
|
|
|
+ style="width: 100%; height: 100%" />
|
|
|
+ <div slot="file" slot-scope="{ file }">
|
|
|
+ <img class="el-upload-list__item-thumbnail" :src="file.url" alt />
|
|
|
+ <span class="el-upload-list__item-actions">
|
|
|
+ <span class="el-upload-list__item-delete"
|
|
|
+ @click="handleRemove1(file, 'imageList6', 'imgList13')">
|
|
|
+ <i class="el-icon-zoom-in" @click.stop="handlePictureCardPreview(file.url)"></i>
|
|
|
+ <i class="el-icon-delete"></i>
|
|
|
+ </span>
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ </el-upload>
|
|
|
+ </div>
|
|
|
+ <div class="aaa">
|
|
|
+ <span>2.验车照（后左）</span>
|
|
|
+ <el-upload action="#" list-type="picture-card" :auto-upload="false" :limit="1" drag :on-change="(file) =>
|
|
|
+ drivingupload(file, 'imageList6', 'imgList14', 'C0501')
|
|
|
+ " :file-list="imgList14" multiple ref="upload3"
|
|
|
+ :class="{ styleB: imgList14.length === 1 }">
|
|
|
+ <img v-show="imgList14.length == 0" src="../../../../static/userfront.png"
|
|
|
+ style="width: 100%; height: 100%" />
|
|
|
+ <div slot="file" slot-scope="{ file }">
|
|
|
+ <img class="el-upload-list__item-thumbnail" :src="file.url" alt />
|
|
|
+ <span class="el-upload-list__item-actions">
|
|
|
+ <span class="el-upload-list__item-delete"
|
|
|
+ @click="handleRemove1(file, 'imageList6', 'imgList14')">
|
|
|
+ <i class="el-icon-zoom-in" @click.stop="handlePictureCardPreview(file.url)"></i>
|
|
|
+ <i class="el-icon-delete"></i>
|
|
|
+ </span>
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ </el-upload>
|
|
|
+ </div>
|
|
|
+ <div class="aaa">
|
|
|
+ <span>3.验车照（后右）</span>
|
|
|
+ <el-upload action="#" list-type="picture-card" :auto-upload="false" :limit="1" drag :on-change="(file) =>
|
|
|
+ drivingupload(file, 'imageList6', 'imgList15', 'C0502')
|
|
|
+ " :file-list="imgList15" multiple ref="upload3"
|
|
|
+ :class="{ styleB: imgList15.length === 1 }">
|
|
|
+ <img v-show="imgList15.length == 0" src="../../../../static/userfront.png"
|
|
|
+ style="width: 100%; height: 100%" />
|
|
|
+ <div slot="file" slot-scope="{ file }">
|
|
|
+ <img class="el-upload-list__item-thumbnail" :src="file.url" alt />
|
|
|
+ <span class="el-upload-list__item-actions">
|
|
|
+ <span class="el-upload-list__item-delete"
|
|
|
+ @click="handleRemove1(file, 'imageList6', 'imgList15')">
|
|
|
+ <i class="el-icon-zoom-in" @click.stop="handlePictureCardPreview(file.url)"></i>
|
|
|
+ <i class="el-icon-delete"></i>
|
|
|
+ </span>
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ </el-upload>
|
|
|
+ </div>
|
|
|
+ <div class="aaa">
|
|
|
+ <span>4.验车照（前右）</span>
|
|
|
+ <el-upload action="#" list-type="picture-card" :auto-upload="false" :limit="1" drag :on-change="(file) =>
|
|
|
+ drivingupload(file, 'imageList6', 'imgList16', 'C0503')
|
|
|
+ " :file-list="imgList16" multiple ref="upload3"
|
|
|
+ :class="{ styleB: imgList16.length === 1 }">
|
|
|
+ <img v-show="imgList16.length == 0" src="../../../../static/userfront.png"
|
|
|
+ style="width: 100%; height: 100%" />
|
|
|
+ <div slot="file" slot-scope="{ file }">
|
|
|
+ <img class="el-upload-list__item-thumbnail" :src="file.url" alt />
|
|
|
+ <span class="el-upload-list__item-actions">
|
|
|
+ <span class="el-upload-list__item-delete"
|
|
|
+ @click="handleRemove1(file, 'imageList6', 'imgList16')">
|
|
|
+ <i class="el-icon-zoom-in" @click.stop="handlePictureCardPreview(file.url)"></i>
|
|
|
+ <i class="el-icon-delete"></i>
|
|
|
+ </span>
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ </el-upload>
|
|
|
+ </div>
|
|
|
+ <div class="aaa">
|
|
|
+ <span>5.验车照（前左）</span>
|
|
|
+ <el-upload action="#" list-type="picture-card" :auto-upload="false" :limit="1" drag :on-change="(file) =>
|
|
|
+ drivingupload(file, 'imageList6', 'imgList17', 'C0504')
|
|
|
+ " :file-list="imgList17" multiple ref="upload3"
|
|
|
+ :class="{ styleB: imgList17.length === 1 }">
|
|
|
+ <img v-show="imgList17.length == 0" src="../../../../static/userfront.png"
|
|
|
+ style="width: 100%; height: 100%" />
|
|
|
+ <div slot="file" slot-scope="{ file }">
|
|
|
+ <img class="el-upload-list__item-thumbnail" :src="file.url" alt />
|
|
|
+ <span class="el-upload-list__item-actions">
|
|
|
+ <span class="el-upload-list__item-delete"
|
|
|
+ @click="handleRemove1(file, 'imageList6', 'imgList17')">
|
|
|
+ <i class="el-icon-zoom-in" @click.stop="handlePictureCardPreview(file.url)"></i>
|
|
|
+ <i class="el-icon-delete"></i>
|
|
|
+ </span>
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ </el-upload>
|
|
|
+ </div>
|
|
|
+ <div class="aaa">
|
|
|
+ <span>6.验车照（正前）</span>
|
|
|
+ <el-upload action="#" list-type="picture-card" :auto-upload="false" :limit="1" drag :on-change="(file) =>
|
|
|
+ drivingupload(file, 'imageList6', 'imgList18', 'C0506')
|
|
|
+ " :file-list="imgList18" multiple ref="upload3"
|
|
|
+ :class="{ styleB: imgList18.length === 1 }">
|
|
|
+ <img v-show="imgList18.length == 0" src="../../../../static/userfront.png"
|
|
|
+ style="width: 100%; height: 100%" />
|
|
|
+ <div slot="file" slot-scope="{ file }">
|
|
|
+ <img class="el-upload-list__item-thumbnail" :src="file.url" alt />
|
|
|
+ <span class="el-upload-list__item-actions">
|
|
|
+ <span class="el-upload-list__item-delete"
|
|
|
+ @click="handleRemove1(file, 'imageList6', 'imgList18')">
|
|
|
+ <i class="el-icon-zoom-in" @click.stop="handlePictureCardPreview(file.url)"></i>
|
|
|
+ <i class="el-icon-delete"></i>
|
|
|
+ </span>
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ </el-upload>
|
|
|
+ </div>
|
|
|
+ <div class="aaa">
|
|
|
+ <span>7.验车照（正后）</span>
|
|
|
+ <el-upload action="#" list-type="picture-card" :auto-upload="false" :limit="1" drag :on-change="(file) =>
|
|
|
+ drivingupload(file, 'imageList6', 'imgList19', 'C0507')
|
|
|
+ " :file-list="imgList19" multiple ref="upload3"
|
|
|
+ :class="{ styleB: imgList19.length === 1 }">
|
|
|
+ <img v-show="imgList19.length == 0" src="../../../../static/userfront.png"
|
|
|
+ style="width: 100%; height: 100%" />
|
|
|
+ <div slot="file" slot-scope="{ file }">
|
|
|
+ <img class="el-upload-list__item-thumbnail" :src="file.url" alt />
|
|
|
+ <span class="el-upload-list__item-actions">
|
|
|
+ <span class="el-upload-list__item-delete"
|
|
|
+ @click="handleRemove1(file, 'imageList6', 'imgList19')">
|
|
|
+ <i class="el-icon-zoom-in" @click.stop="handlePictureCardPreview(file.url)"></i>
|
|
|
+ <i class="el-icon-delete"></i>
|
|
|
+ </span>
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ </el-upload>
|
|
|
+ </div>
|
|
|
+ <div class="aaa">
|
|
|
+ <span>8.验车照（人车合影）</span>
|
|
|
+ <el-upload action="#" list-type="picture-card" :auto-upload="false" :limit="1" drag :on-change="(file) =>
|
|
|
+ drivingupload(file, 'imageList6', 'imgList20', 'C0505')
|
|
|
+ " :file-list="imgList20" multiple ref="upload3"
|
|
|
+ :class="{ styleB: imgList20.length === 1 }">
|
|
|
+ <img v-show="imgList20.length == 0" src="../../../../static/userfront.png"
|
|
|
+ style="width: 100%; height: 100%" />
|
|
|
+ <div slot="file" slot-scope="{ file }">
|
|
|
+ <img class="el-upload-list__item-thumbnail" :src="file.url" alt />
|
|
|
+ <span class="el-upload-list__item-actions">
|
|
|
+ <span class="el-upload-list__item-delete"
|
|
|
+ @click="handleRemove1(file, 'imageList6', 'imgList20')">
|
|
|
+ <i class="el-icon-zoom-in" @click.stop="handlePictureCardPreview(file.url)"></i>
|
|
|
+ <i class="el-icon-delete"></i>
|
|
|
+ </span>
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ </el-upload>
|
|
|
+ </div>
|
|
|
+ <div class="aaa">
|
|
|
+ <span>9.验车照（地标合影）</span>
|
|
|
+ <el-upload action="#" list-type="picture-card" :auto-upload="false" :limit="1" drag :on-change="(file) =>
|
|
|
+ drivingupload(file, 'imageList6', 'imgList21', 'C0508')
|
|
|
+ " :file-list="imgList21" multiple ref="upload3"
|
|
|
+ :class="{ styleB: imgList21.length === 1 }">
|
|
|
+ <img v-show="imgList21.length == 0" src="../../../../static/userfront.png"
|
|
|
+ style="width: 100%; height: 100%" />
|
|
|
+ <div slot="file" slot-scope="{ file }">
|
|
|
+ <img class="el-upload-list__item-thumbnail" :src="file.url" alt />
|
|
|
+ <span class="el-upload-list__item-actions">
|
|
|
+ <span class="el-upload-list__item-delete"
|
|
|
+ @click="handleRemove1(file, 'imageList6', 'imgList21')">
|
|
|
+ <i class="el-icon-zoom-in" @click.stop="handlePictureCardPreview(file.url)"></i>
|
|
|
+ <i class="el-icon-delete"></i>
|
|
|
+ </span>
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ </el-upload>
|
|
|
+ </div>
|
|
|
+ <div class="aaa">
|
|
|
+ <span>10.验车照（工作台）</span>
|
|
|
+ <el-upload action="#" list-type="picture-card" :auto-upload="false" :limit="1" drag :on-change="(file) =>
|
|
|
+ drivingupload(file, 'imageList6', 'imgList22', 'C0509')
|
|
|
+ " :file-list="imgList22" multiple ref="upload3"
|
|
|
+ :class="{ styleB: imgList22.length === 1 }">
|
|
|
+ <img v-show="imgList22.length == 0" src="../../../../static/userfront.png"
|
|
|
+ style="width: 100%; height: 100%" />
|
|
|
+ <div slot="file" slot-scope="{ file }">
|
|
|
+ <img class="el-upload-list__item-thumbnail" :src="file.url" alt />
|
|
|
+ <span class="el-upload-list__item-actions">
|
|
|
+ <span class="el-upload-list__item-delete"
|
|
|
+ @click="handleRemove1(file, 'imageList6', 'imgList22')">
|
|
|
+ <i class="el-icon-zoom-in" @click.stop="handlePictureCardPreview(file.url)"></i>
|
|
|
+ <i class="el-icon-delete"></i>
|
|
|
+ </span>
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ </el-upload>
|
|
|
+ </div>
|
|
|
+ <div class="aaa">
|
|
|
+ <span>11.验车照（天窗）</span>
|
|
|
+ <el-upload action="#" list-type="picture-card" :auto-upload="false" :limit="1" drag :on-change="(file) =>
|
|
|
+ drivingupload(file, 'imageList6', 'imgList23', 'C0510')
|
|
|
+ " :file-list="imgList23" multiple ref="upload3"
|
|
|
+ :class="{ styleB: imgList23.length === 1 }">
|
|
|
+ <img v-show="imgList23.length == 0" src="../../../../static/userfront.png"
|
|
|
+ style="width: 100%; height: 100%" />
|
|
|
+ <div slot="file" slot-scope="{ file }">
|
|
|
+ <img class="el-upload-list__item-thumbnail" :src="file.url" alt />
|
|
|
+ <span class="el-upload-list__item-actions">
|
|
|
+ <span class="el-upload-list__item-delete"
|
|
|
+ @click="handleRemove1(file, 'imageList6', 'imgList23')">
|
|
|
+ <i class="el-icon-zoom-in" @click.stop="handlePictureCardPreview(file.url)"></i>
|
|
|
+ <i class="el-icon-delete"></i>
|
|
|
+ </span>
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ </el-upload>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="flex f-wrap" id="snbaodan">
|
|
|
+ <div class="aaa">
|
|
|
+ <span>1.上年商业险保单</span>
|
|
|
+ <el-upload action="#" list-type="picture-card" :auto-upload="false" :limit="1" drag :on-change="(file) =>
|
|
|
+ drivingupload(file, 'imageList6', 'imgList24', 'LAST_INSURANCE_POLICY')
|
|
|
+ " :file-list="imgList24" multiple ref="upload3"
|
|
|
+ :class="{ styleB: imgList24.length === 1 }">
|
|
|
+ <img v-show="imgList24.length == 0" src="../../../../static/userfront.png"
|
|
|
+ style="width: 100%; height: 100%" />
|
|
|
+ <div slot="file" slot-scope="{ file }">
|
|
|
+ <img class="el-upload-list__item-thumbnail" :src="file.url" alt />
|
|
|
+ <span class="el-upload-list__item-actions">
|
|
|
+ <span class="el-upload-list__item-delete"
|
|
|
+ @click="handleRemove1(file, 'imageList6', 'imgList24')">
|
|
|
+ <i class="el-icon-zoom-in" @click.stop="handlePictureCardPreview(file.url)"></i>
|
|
|
+ <i class="el-icon-delete"></i>
|
|
|
+ </span>
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ </el-upload>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+
|
|
|
+ <span slot="footer" class="dialog-footer">
|
|
|
+ <el-button size="small" @click="imageUploaddialogVisible = false">取 消</el-button>
|
|
|
+ <el-button v-if="type == 1" size="small" type="primary" @click="uploadinformation">上传资料</el-button>
|
|
|
+ <el-button v-if="type == 2" size="small" type="primary" @click="repairinformation">补传资料</el-button>
|
|
|
+ </span>
|
|
|
+ </el-dialog>
|
|
|
+ <el-image-viewer v-if="showViewer" :on-close="closeViewer" :z-index="9999" :url-list="[ProViewImg]" />
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ imageUploaddialogVisible: false,
|
|
|
+ tabLiIndex: 0,
|
|
|
+ tabLimenu: [
|
|
|
+ {
|
|
|
+ name: "车辆信息",
|
|
|
+ scroll: "vehicle",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "车主信息",
|
|
|
+ scroll: "owner",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "投保人信息",
|
|
|
+ scroll: "applicant",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "被保人信息",
|
|
|
+ scroll: "insured",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "关系证明",
|
|
|
+ scroll: "relationship",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "验车照",
|
|
|
+ scroll: "yanchezhao",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "上年商业险保单",
|
|
|
+ scroll: "snbaodan",
|
|
|
+ },
|
|
|
+
|
|
|
+ ],
|
|
|
+ showViewer: false,
|
|
|
+ ProViewImg: "", //预览图片
|
|
|
+ carfrontImg: "", //行驶证正面
|
|
|
+ carbackImg: "", //行驶证背面
|
|
|
+ userfrontImg: "", //身份证正面
|
|
|
+ userbackImg: "", //身份证背面
|
|
|
+ businessImg: "",
|
|
|
+ CarFrontFile: "", //车正面文件流
|
|
|
+ CarBackFile: "", //车背面文件流
|
|
|
+ C02File: "",
|
|
|
+ D02File: "",
|
|
|
+ C03File: "",
|
|
|
+ D03File: "",
|
|
|
+ C04File: "",
|
|
|
+ D04File: "",
|
|
|
+ //影像回显列表
|
|
|
+ imgList1: [],
|
|
|
+ imgList2: [],
|
|
|
+ imgList3: [],
|
|
|
+ imgList4: [],
|
|
|
+ imgList5: [],
|
|
|
+ imgList6: [],
|
|
|
+ imgList7: [],
|
|
|
+ imgList8: [],
|
|
|
+ imgList9: [],
|
|
|
+ imgList10: [],
|
|
|
+ imgList11: [],
|
|
|
+ imgList12: [],
|
|
|
+ imgList13: [],
|
|
|
+ imgList14: [],
|
|
|
+ imgList15: [],
|
|
|
+ imgList16: [],
|
|
|
+ imgList17: [],
|
|
|
+ imgList18: [],
|
|
|
+ imgList19: [],
|
|
|
+ imgList20: [],
|
|
|
+ imgList21: [],
|
|
|
+ imgList22: [],
|
|
|
+ imgList23: [],
|
|
|
+ imgList24: [],
|
|
|
+ //影像上传列表
|
|
|
+ imageList1: [],
|
|
|
+ imageList2: [],
|
|
|
+ imageList3: [],
|
|
|
+ imageList4: [],
|
|
|
+ imageList5: [],
|
|
|
+ imageList6: [],
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ props: {
|
|
|
+ quoteno: String,
|
|
|
+ type: {
|
|
|
+ type: Number,
|
|
|
+ default: 1
|
|
|
+ },
|
|
|
+ companyId: String
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ setBackupVisible: function (backupVisible) {
|
|
|
+ this.imageUploaddialogVisible = backupVisible
|
|
|
+ },
|
|
|
+ tabLiScroll(id, idx) {
|
|
|
+ this.tabLiIndex = idx;
|
|
|
+ document.getElementById(id).scrollIntoView({ behavior: "smooth" });
|
|
|
+ },
|
|
|
+ //预览图片
|
|
|
+ handlePictureCardPreview(img) {
|
|
|
+ this.ProViewImg = img;
|
|
|
+ this.showViewer = true;
|
|
|
+ },
|
|
|
+ // 关闭查看器
|
|
|
+ closeViewer() {
|
|
|
+ this.showViewer = false;
|
|
|
+ },
|
|
|
+ //影像上传
|
|
|
+ drivingupload(file, imageIdList, imgurl, type) {
|
|
|
+ let that = this;
|
|
|
+ let size = file.size / 1024 / 1024 < 5;
|
|
|
+ const isJPG =
|
|
|
+ file.raw.type === "image/jpeg" || file.raw.type === "image/png";
|
|
|
+ if (!size) {
|
|
|
+ this.$message.error("上传图片大小不能超过 5MB!");
|
|
|
+ this[imgurl] = [];
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ if (!isJPG) {
|
|
|
+ this.$message.error("上传图片只能是 JPG、PNG 格式!");
|
|
|
+ this[imgurl] = [];
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ this[imgurl].push(file);
|
|
|
+
|
|
|
+ var file = file.raw;
|
|
|
+ const params = new FormData(); // 声明formData数据类型
|
|
|
+ params.append("multipartFile", file);
|
|
|
+ params.append("type", "image");
|
|
|
+ this.$api.letter.uploadFile(params).then((res) => {
|
|
|
+ if (res.code == "200") {
|
|
|
+ if (this[imageIdList].some((v) => v.imageType == type)) {
|
|
|
+ this[imageIdList].map((val) => {
|
|
|
+ if (val.imageType == type) {
|
|
|
+ val.imageId = res.data.id;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ this[imageIdList].push({
|
|
|
+ imageId: res.data.id,
|
|
|
+ imageType: type,
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ imageEcho(quotenos) {
|
|
|
+ //影像查询
|
|
|
+ this.$api.letter.findByQuoteNo(quotenos).then((res) => {
|
|
|
+ if (res.code == "200") {
|
|
|
+ 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 = [];
|
|
|
+ Object.keys(res.data).forEach((keys) => {
|
|
|
+ if (res.data[keys].url) {
|
|
|
+ res.data[keys].url = process.env.BASE_URL + res.data[keys].url;
|
|
|
+ switch (keys) {
|
|
|
+ case "C01":
|
|
|
+ this.imageList1.push({
|
|
|
+ imageId: res.data[keys].imageId,
|
|
|
+ imageType: res.data[keys].imageType,
|
|
|
+ });
|
|
|
+ this.imgList1.push(res.data[keys]);
|
|
|
+ break;
|
|
|
+ case "D01":
|
|
|
+ this.imageList1.push({
|
|
|
+ imageId: res.data[keys].imageId,
|
|
|
+ imageType: res.data[keys].imageType,
|
|
|
+ });
|
|
|
+ this.imgList2.push(res.data[keys]);
|
|
|
+ break;
|
|
|
+ case "C02":
|
|
|
+ this.imageList2.push({
|
|
|
+ imageId: res.data[keys].imageId,
|
|
|
+ imageType: res.data[keys].imageType,
|
|
|
+ });
|
|
|
+ this.imgList3.push(res.data[keys]);
|
|
|
+ break;
|
|
|
+
|
|
|
+ case "D02":
|
|
|
+ this.imageList2.push({
|
|
|
+ imageId: res.data[keys].imageId,
|
|
|
+ imageType: res.data[keys].imageType,
|
|
|
+ });
|
|
|
+ this.imgList4.push(res.data[keys]);
|
|
|
+ break;
|
|
|
+ case "C03":
|
|
|
+ this.imageList3.push({
|
|
|
+ imageId: res.data[keys].imageId,
|
|
|
+ imageType: res.data[keys].imageType,
|
|
|
+ });
|
|
|
+ this.imgList5.push(res.data[keys]);
|
|
|
+ break;
|
|
|
+ case "D03":
|
|
|
+ this.imageList3.push({
|
|
|
+ imageId: res.data[keys].imageId,
|
|
|
+ imageType: res.data[keys].imageType,
|
|
|
+ });
|
|
|
+ this.imgList6.push(res.data[keys]);
|
|
|
+ break;
|
|
|
+ case "C04":
|
|
|
+ this.imageList4.push({
|
|
|
+ imageId: res.data[keys].imageId,
|
|
|
+ imageType: res.data[keys].imageType,
|
|
|
+ });
|
|
|
+ this.imgList7.push(res.data[keys]);
|
|
|
+ break;
|
|
|
+ case "D04":
|
|
|
+ this.imageList4.push({
|
|
|
+ imageId: res.data[keys].imageId,
|
|
|
+ imageType: res.data[keys].imageType,
|
|
|
+ });
|
|
|
+ this.imgList8.push(res.data[keys]);
|
|
|
+ break;
|
|
|
+ case "XC00":
|
|
|
+ this.imageList5.push({
|
|
|
+ imageId: res.data[keys].imageId,
|
|
|
+ imageType: res.data[keys].imageType,
|
|
|
+ });
|
|
|
+ this.imgList9.push(res.data[keys]);
|
|
|
+ break;
|
|
|
+ case "GC00":
|
|
|
+ this.imageList5.push({
|
|
|
+ imageId: res.data[keys].imageId,
|
|
|
+ imageType: res.data[keys].imageType,
|
|
|
+ });
|
|
|
+ this.imgList10.push(res.data[keys]);
|
|
|
+ break;
|
|
|
+ case "GX00":
|
|
|
+ this.imageList5.push({
|
|
|
+ imageId: res.data[keys].imageId,
|
|
|
+ imageType: res.data[keys].imageType,
|
|
|
+ });
|
|
|
+ this.imgList11.push(res.data[keys]);
|
|
|
+ break;
|
|
|
+ case "TAR05":
|
|
|
+ this.imageList1.push({
|
|
|
+ imageId: res.data[keys].imageId,
|
|
|
+ imageType: res.data[keys].imageType,
|
|
|
+ });
|
|
|
+ this.imgList12.push(res.data[keys]);
|
|
|
+ break;
|
|
|
+ case "C0500":
|
|
|
+ this.imageList6.push({
|
|
|
+ imageId: res.data[keys].imageId,
|
|
|
+ imageType: res.data[keys].imageType,
|
|
|
+ });
|
|
|
+ this.imgList13.push(res.data[keys]);
|
|
|
+ break;
|
|
|
+ case "C0501":
|
|
|
+ this.imageList6.push({
|
|
|
+ imageId: res.data[keys].imageId,
|
|
|
+ imageType: res.data[keys].imageType,
|
|
|
+ });
|
|
|
+ this.imgList14.push(res.data[keys]);
|
|
|
+ break;
|
|
|
+ case "C0502":
|
|
|
+ this.imageList6.push({
|
|
|
+ imageId: res.data[keys].imageId,
|
|
|
+ imageType: res.data[keys].imageType,
|
|
|
+ });
|
|
|
+ this.imgList15.push(res.data[keys]);
|
|
|
+ break;
|
|
|
+ case "C0503":
|
|
|
+ this.imageList6.push({
|
|
|
+ imageId: res.data[keys].imageId,
|
|
|
+ imageType: res.data[keys].imageType,
|
|
|
+ });
|
|
|
+ this.imgList16.push(res.data[keys]);
|
|
|
+ break;
|
|
|
+ case "C0504":
|
|
|
+ this.imageList6.push({
|
|
|
+ imageId: res.data[keys].imageId,
|
|
|
+ imageType: res.data[keys].imageType,
|
|
|
+ });
|
|
|
+ this.imgList17.push(res.data[keys]);
|
|
|
+ break;
|
|
|
+ case "C0506":
|
|
|
+ this.imageList6.push({
|
|
|
+ imageId: res.data[keys].imageId,
|
|
|
+ imageType: res.data[keys].imageType,
|
|
|
+ });
|
|
|
+ this.imgList18.push(res.data[keys]);
|
|
|
+ break;
|
|
|
+ case "C0507":
|
|
|
+ this.imageList6.push({
|
|
|
+ imageId: res.data[keys].imageId,
|
|
|
+ imageType: res.data[keys].imageType,
|
|
|
+ });
|
|
|
+ this.imgList19.push(res.data[keys]);
|
|
|
+ break;
|
|
|
+ case "C0505":
|
|
|
+ this.imageList6.push({
|
|
|
+ imageId: res.data[keys].imageId,
|
|
|
+ imageType: res.data[keys].imageType,
|
|
|
+ });
|
|
|
+ this.imgList20.push(res.data[keys]);
|
|
|
+ break;
|
|
|
+ case "C0508":
|
|
|
+ this.imageList6.push({
|
|
|
+ imageId: res.data[keys].imageId,
|
|
|
+ imageType: res.data[keys].imageType,
|
|
|
+ });
|
|
|
+ this.imgList21.push(res.data[keys]);
|
|
|
+ break;
|
|
|
+ case "C0509":
|
|
|
+ this.imageList6.push({
|
|
|
+ imageId: res.data[keys].imageId,
|
|
|
+ imageType: res.data[keys].imageType,
|
|
|
+ });
|
|
|
+ this.imgList22.push(res.data[keys]);
|
|
|
+ break;
|
|
|
+ case "C0510":
|
|
|
+ this.imageList6.push({
|
|
|
+ imageId: res.data[keys].imageId,
|
|
|
+ imageType: res.data[keys].imageType,
|
|
|
+ });
|
|
|
+ this.imgList23.push(res.data[keys]);
|
|
|
+ break;
|
|
|
+ case "LAST_INSURANCE_POLICY":
|
|
|
+ this.imageList6.push({
|
|
|
+ imageId: res.data[keys].imageId,
|
|
|
+ imageType: res.data[keys].imageType,
|
|
|
+ });
|
|
|
+ this.imgList24.push(res.data[keys]);
|
|
|
+ break;
|
|
|
+ default:
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ this.$message({ message: res.msg, type: "info" });
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ 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 = [];
|
|
|
+ },
|
|
|
+ handleRemove1(file, imageIdList, imgList) {
|
|
|
+ this[imageIdList].map((ele, index) => {
|
|
|
+ if (file.imageId === ele.imageId) {
|
|
|
+ this[imageIdList].splice(index, 1);
|
|
|
+ }
|
|
|
+ return ele;
|
|
|
+ });
|
|
|
+ if (file.imageId) {
|
|
|
+ this[imgList].map((ele, index) => {
|
|
|
+ if (file.imageId === ele.imageId) {
|
|
|
+ this[imgList].splice(index, 1);
|
|
|
+ }
|
|
|
+ return ele;
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ this[imgList].map((ele, index) => {
|
|
|
+ if (file.uid === ele.uid) {
|
|
|
+ this[imgList].splice(index, 1);
|
|
|
+ }
|
|
|
+ return ele;
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ uploadinformation() {
|
|
|
+ // //上传图片
|
|
|
+ const mergedArray = [
|
|
|
+ ...this.imageList1,
|
|
|
+ ...this.imageList2,
|
|
|
+ ...this.imageList3,
|
|
|
+ ...this.imageList4,
|
|
|
+ ...this.imageList5,
|
|
|
+ ...this.imageList6,
|
|
|
+ ];
|
|
|
+ let imageparam = {
|
|
|
+ imageList: mergedArray,
|
|
|
+ quoteNo: this.quoteno,
|
|
|
+ };
|
|
|
+ this.$api.letter.uploadImages(imageparam).then((responses) => {
|
|
|
+ if (responses.code == "200") {
|
|
|
+ this.imageEcho(this.quoteno);
|
|
|
+ this.$message({ message: responses.msg, type: "success" });
|
|
|
+ } else {
|
|
|
+ this.$message({ message: responses.msg, type: "error" });
|
|
|
+ }
|
|
|
+ });
|
|
|
+ this.imageUploaddialogVisible = false;
|
|
|
+ },
|
|
|
+
|
|
|
+ repairinformation() {
|
|
|
+ // //上传图片
|
|
|
+ const mergedArray = [
|
|
|
+ ...this.imageList1,
|
|
|
+ ...this.imageList2,
|
|
|
+ ...this.imageList3,
|
|
|
+ ...this.imageList4,
|
|
|
+ ...this.imageList5,
|
|
|
+ ...this.imageList6,
|
|
|
+ ];
|
|
|
+ let imageparam = {
|
|
|
+ imageList: mergedArray,
|
|
|
+ companyId: this.companyId,
|
|
|
+ };
|
|
|
+ this.$api.letter.additionalInformation(imageparam).then((responses) => {
|
|
|
+ if (responses.code == "200") {
|
|
|
+ this.imageUploaddialogVisible = false;
|
|
|
+ this.$message({ message: responses.msg, type: "success" });
|
|
|
+ } else {
|
|
|
+ this.$message({ message: responses.msg, type: "error" });
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ }
|
|
|
+
|
|
|
+}
|
|
|
+</script>
|
|
|
+<style lang="scss" scoped>
|
|
|
+.tab-style {
|
|
|
+ width: 120px;
|
|
|
+
|
|
|
+ li {
|
|
|
+ text-align: right;
|
|
|
+ padding-right: 20px;
|
|
|
+ line-height: 40px;
|
|
|
+ cursor: pointer;
|
|
|
+ box-sizing: border-box;
|
|
|
+ border-right: 1px solid #e2e5eb;
|
|
|
+ }
|
|
|
+
|
|
|
+ li:focus {
|
|
|
+ background: rgba(212, 36, 38, 0.1);
|
|
|
+ border-right: 2px solid var(--themeColor);
|
|
|
+ color: var(--themeColor);
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.tabLi-style {
|
|
|
+ background: rgba(212, 36, 38, 0.1);
|
|
|
+ border-right: 2px solid var(--themeColor);
|
|
|
+ color: var(--themeColor);
|
|
|
+}
|
|
|
+
|
|
|
+/deep/{
|
|
|
+ .styleB .el-upload--picture-card {
|
|
|
+ // display: none;
|
|
|
+ opacity: 0;
|
|
|
+}
|
|
|
+
|
|
|
+.styleB {
|
|
|
+ height: 128px;
|
|
|
+}
|
|
|
+
|
|
|
+.styleB .el-upload--picture-card {
|
|
|
+ display: none;
|
|
|
+}
|
|
|
+}
|
|
|
+.aaa {
|
|
|
+ /deep/ {
|
|
|
+ margin-bottom: 20px;
|
|
|
+ margin-right: 30px;
|
|
|
+
|
|
|
+ span {
|
|
|
+ display: inline-block;
|
|
|
+ margin-bottom: 10px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .el-upload .el-upload-dragger {
|
|
|
+ width: 180px;
|
|
|
+ height: 120px;
|
|
|
+ border: 1px dashed #c0ccda;
|
|
|
+ padding: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .el-upload-list--picture-card .el-upload-list__item {
|
|
|
+ width: 180px;
|
|
|
+ height: 120px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .el-upload-list__item:first-child {
|
|
|
+ margin-top: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .el-upload--picture-card {
|
|
|
+ width: 180px;
|
|
|
+ height: 120px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .el-upload-list__item {
|
|
|
+ width: 180px;
|
|
|
+ height: 120px;
|
|
|
+ margin: 0 !important;
|
|
|
+ display: block !important;
|
|
|
+ }
|
|
|
+
|
|
|
+ .el-upload-list--picture-card .el-upload-list__item-thumbnail {
|
|
|
+ width: 180px;
|
|
|
+ height: 120px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+}</style>
|
