<!-- * @Description: 附件信息 * @Author: your name * @Date: 2019-09-20 09:35:11 * @LastEditTime : 2019-12-26 14:42:49 * @LastEditors : Please set LastEditors --> <template> <h-view id="enclosure" class="public-style"> <h-header :proportion="[5,1,1]" class="bar-custom"> <div slot="left" class="h-header-btn" @click="$routeGo()"> <img src="@/assets/userBind/arrow.png"> <span>附件信息</span> </div> </h-header> <h-content> <div v-for="(list, index) in cddItemList" :key="index" class="card2"> <span class="descript-color">{{ list.description }}</span> <div class="img-content"> <!-- 房产 --> <div v-if="list.cdd_item==='HOUSE_CARD'"> <div v-if="!houseImg" class="card-upload plus" @click="ocrShow(list.cdd_item, '')"> <img src="@/assets/userBind/camera.png" class="upload-btn" > </div> <!-- 通过 --> <div v-if="houseImg&&isApproved" class="card-upload"> <img :src="houseImg" @click="showBigPicture(houseImg)"> </div> <!-- 未通过 --> <div v-if="houseImg&&!isApproved" class="card-upload"> <img :src="houseImg" @click="ocrShow(list.cdd_item, '')"> </div> </div> <div v-if="list.cdd_item==='HOUSE_CARD'"> <list-item :item-height="44" class="card-Info"> <item> <div slot="name">房屋所有权人</div> <input slot="content" v-model="hauseInfo.house_owner" placeholder="识别房产证自动填充" > </item> <item> <div slot="name">共有情况</div> <input slot="content" v-model="hauseInfo.public_situation" placeholder="识别房产证自动填充" > </item> <item> <div slot="name">房屋坐落</div> <textarea slot="content" v-model="hauseInfo.house_located" cols="22" rows="1" placeholder="识别房产证自动填充" @input="addRow(hauseInfo.house_located,$enent)" /> </item> <item> <div slot="name">登记时间</div> <input slot="content" v-model="hauseInfo.regist_date" placeholder="识别房产证自动填充" > </item> <item> <div slot="name">房屋性质</div> <input slot="content" v-model="hauseInfo.house_property" placeholder="识别房产证自动填充" > </item> <item> <div slot="name">规划用途</div> <input slot="content" v-model="hauseInfo.plan_purpose" placeholder="识别房产证自动填充" > </item> <item> <div slot="name">总层数</div> <input slot="content" v-model="hauseInfo.house_layers" placeholder="识别房产证自动填充" > </item> <item> <div slot="name">建筑面积</div> <input slot="content" v-model="hauseInfo.built_area" placeholder="识别房产证自动填充" > </item> <item> <div slot="name">套内建筑面积</div> <input slot="content" v-model="hauseInfo.built_in_area" placeholder="识别房产证自动填充" > </item> <item> <div slot="name">其他</div> <input slot="content" v-model="hauseInfo.others" placeholder="识别房产证自动填充" > </item> <item> <div slot="name">地号</div> <input slot="content" v-model="hauseInfo.land_number" placeholder="识别房产证自动填充" > </item> <item :proportion="[1,1]"> <div slot="name">土地使用权取得方式</div> <input slot="content" v-model="hauseInfo.land_get_method" placeholder="识别房产证自动填充" > </item> <item> <div slot="name">土地使用年限</div> <input slot="content" v-model="hauseInfo.land_use_limit" placeholder="识别房产证自动填充" > </item> </list-item> </div> <!-- 不动产 --> <div v-if="list.cdd_item==='REAL_EST_CERTIFICATE'"> <div v-if="!propertyImg" class="card-upload plus" @click="ocrShow(list.cdd_item, '')"> <img src="@/assets/userBind/camera.png" class="upload-btn" > </div> <div v-if="propertyImg&&isApproved" class="card-upload"> <img :src="propertyImg" @click="showBigPicture(propertyImg)"> </div> <div v-if="propertyImg&&!isApproved" class="card-upload"> <img :src="propertyImg" @click="ocrShow(list.cdd_item, '')"> </div> </div> <div v-if="list.cdd_item==='REAL_EST_CERTIFICATE'"> <list-item :item-height="44" class="card-Info"> <item> <div slot="name">权利人</div> <input slot="content" v-model="propertyInfo.right_person" placeholder="识别不动产权证自动填充" > </item> <item> <div slot="name">共有情况</div> <input slot="content" v-model="propertyInfo.public_situation" placeholder="识别不动产权证自动填充" > </item> <item> <div slot="name">坐落</div> <textarea slot="content" v-model="propertyInfo.house_located" cols="22" rows="1" contenteditable="true" placeholder="识别不动产权证自动填充" @input="addRow(propertyInfo.house_located,$event)" /> </item> <item> <div slot="name">不动产单元号</div> <textarea slot="content" v-model="propertyInfo.real_unit_number" cols="22" rows="1" placeholder="识别不动产权证自动填充" @input="addRow(propertyInfo.real_unit_number,$event)"/> </item> <item> <div slot="name">权利类型</div> <textarea slot="content" v-model="propertyInfo.right_type" cols="22" rows="1" placeholder="识别不动产权证自动填充" @input="addRow(propertyInfo.right_type,$event)"/> </item> <item> <div slot="name">权利性质</div> <textarea slot="content" v-model="propertyInfo.right_property" cols="22" rows="1" placeholder="识别不动产权证自动填充" @input="addRow(propertyInfo.right_property,$event)"/> </item> <item> <div slot="name">用途</div> <textarea slot="content" v-model="propertyInfo.house_purpose" cols="22" rows="2" placeholder="识别不动产权证自动填充" @input="addRow(propertyInfo.house_purpose,$event)"/> </item> <item> <div slot="name">面积</div> <textarea slot="content" v-model="propertyInfo.house_area" cols="22" rows="2" placeholder="识别不动产权证自动填充" @input="addRow(propertyInfo.house_area,$event)"/> </item> <item> <div slot="name">使用期限</div> <textarea slot="content" v-model="propertyInfo.land_use_limit" cols="22" rows="2" placeholder="识别不动产权证自动填充" @input="addRow(propertyInfo.land_use_limit,$event)"/> </item> <item> <div slot="name">权利其他状况</div> <textarea slot="content" v-model="propertyInfo.right_others" cols="22" rows="2" placeholder="识别不动产权证自动填充" @input="addRow(propertyInfo.right_others,$event)"/> </item> </list-item> </div> <!-- 车辆 --> <div v-if="list.cdd_item==='CAR_CARD'"> <div v-if="!carImg" class="card-upload plus" @click="ocrShow(list.cdd_item, '')"> <img src="@/assets/userBind/camera.png" class="upload-btn" > </div> <!-- 通过 --> <div v-if="carImg&&isApproved" class="card-upload"> <img :src="carImg" @click="showBigPicture(carImg)"> </div> <!-- 未通过 --> <div v-if="carImg&&!isApproved" class="card-upload"> <img :src="carImg" @click="ocrShow(list.cdd_item, '')"> </div> </div> <div v-if="list.cdd_item==='CAR_CARD'"> <list-item :item-height="44" class="card-Info"> <item> <div slot="name">车辆识别代号</div> <input slot="content" v-model="carInfo.vehicle_identify_num" placeholder="识别行驶证自动填充" > </item> <item> <div slot="name">住址</div> <textarea slot="content" v-model="carInfo.address" cols="22" rows="2" placeholder="识别行驶证自动填充" @input="addRow(carInfo.address,$event)" /> </item> <item> <div slot="name">品牌型号</div> <input slot="content" v-model="carInfo.brand_model_number" placeholder="识别行驶证自动填充" > </item> <item> <div slot="name">发证日期</div> <input slot="content" v-model="carInfo.start_date" placeholder="识别行驶证自动填充" > </item> <item> <div slot="name">车辆类型</div> <input slot="content" v-model="carInfo.vehicle_type" placeholder="识别行驶证自动填充" > </item> <item> <div slot="name">所有人</div> <input slot="content" v-model="carInfo.owner" placeholder="识别行驶证自动填充" > </item> <item> <div slot="name">使用性质</div> <input slot="content" v-model="carInfo.use_nature" placeholder="识别行驶证自动填充" > </item> <item> <div slot="name">发动机号码</div> <input slot="content" v-model="carInfo.engine_number" placeholder="识别行驶证自动填充" > </item> <item> <div slot="name">号牌号码</div> <input slot="content" v-model="carInfo.plate_number" placeholder="识别行驶证自动填充" > </item> <item> <div slot="name">注册日期</div> <input slot="content" v-model="carInfo.regist_date" placeholder="识别行驶证自动填充" > </item> </list-item> </div> <!-- 其他 --> <div v-if="list.cdd_item==='ASSETS_CARD'"> <!--待上传图片列表--> <div v-for="(item, index) in upload_list" v-if="item.check_id==list.check_id" :key="index" class="card-upload" > <img :src="item.picture" @click="showBigPicture(item.picture)" > <div class="close" @click="remove_pic(item.attachment_id,index)"> <img src="@/assets/userBind/deleteIcon.png" > </div> </div> <!--从服务器上下载的图片--> <div v-for="(pic, index) in dowload_list" :key="index"> <div v-if="pic.check_id==list.check_id" :key="index" class="card-upload"> <img :src="pic.url" @click="showBigPicture(pic.url)" > <div class="close" @click="delete_pic(pic.attachment_id)"> <img src="@/assets/userBind/deleteIcon.png" > </div> </div> </div> <div class="card-upload plus" @click="imgUploadShow(list.description,list.check_id)"> <img src="@/assets/userBind/camera.png" class="upload-btn" > </div> </div> </div> </div> <!-- </div> --> </h-content> <bottom-tab class="footer-button"> <tab-button class="save" @click.native="verified">下一步</tab-button> </bottom-tab> </h-view> </template> <script> export default { data () { return { house_id: '', // 房产证checkid car_id: '', // 车辆证checkid property_id: '', // 不动产checkid carFlag: false, // 行驶证查看标识,为false则用查询出来的,为true则用拍照出来的 houseFlag: false, // 房产证查看标识,为false则用查询出来的,为true则用拍照出来的 propertyFlag: false, // 不动产证查看标识,为false则用查询出来的,为true则用拍照出来的 carImg: '', houseImg: '', propertyImg: '', // 不动产识别图片 from: false, bp_id: '', flag: false, isApproved: false, isUploadCar: false, isUploadHouse: false, isUploadProperty: false, carAttachmentId: '', // 车辆证id houseAttachmentId: '', // 房产证id propertyAttachmentId: '', // 不动产证id cddItemList: [], // 资料清单列表 dowload_list: [], // 下载图片列表 upload_list: [], // 上传图片列表 carInfo: { // 行驶证 bp_id: this.$route.params.bp_id, vehicle_identify_num: '', address: '', brand_model_number: '', start_date: '', vehicle_type: '', owner: '', use_nature: '', engine_number: '', plate_number: '', regist_date: '', words_result_num: '', success: '', }, hauseInfo: { // 房产证 bp_id: this.$route.params.bp_id, house_owner: '', public_situation: '', house_located: '', regist_date: '', house_property: '', plan_purpose: '', house_layers: '', built_area: '', built_in_area: '', others: '', land_number: '', land_get_method: '', land_use_limit: '', }, propertyInfo: { // 不动产证 bp_id: this.$route.params.bp_id, right_person: '', public_situation: '', house_located: '', real_unit_number: '', right_type: '', right_property: '', house_purpose: '', house_area: '', land_use_limit: '', right_others: '', }, } }, watch: {}, beforeRouteEnter (to, from, next) { next(vm => { if (from.name === 'Invoice' && window.localStorage.from === 'true') { vm.carFlag = false, // 行驶证查看标识,为false则用查询出来的,为true则用拍照出来的 vm.houseFlag = false, // 房产证查看标识,为false则用查询出来的,为true则用拍照出来的 vm.propertyFlag = false, // 不动产证查看标识,为false则用查询出来的,为true则用拍照出来的 vm.isUploadCar = false, vm.isUploadHouse = false, vm.isUploadProperty = false, vm.carImg = '', vm.houseImg = '', vm.propertyImg = '', // 不动产识别图片 vm.propertyInfo = { // 不动产证 bp_id: vm.$route.params.bp_id, right_person: '', public_situation: '', house_located: '', real_unit_number: '', right_type: '', right_property: '', house_purpose: '', house_area: '', land_use_limit: '', right_others: '', } vm.hauseInfo = { // 房产证 bp_id: vm.$route.params.bp_id, house_owner: '', public_situation: '', house_located: '', regist_date: '', house_property: '', plan_purpose: '', house_layers: '', built_area: '', built_in_area: '', others: '', land_number: '', land_get_method: '', land_use_limit: '', } vm.carInfo = { // 行驶证 bp_id: vm.$route.params.bp_id, vehicle_identify_num: '', address: '', brand_model_number: '', start_date: '', vehicle_type: '', owner: '', use_nature: '', engine_number: '', plate_number: '', regist_date: '', words_result_num: '', success: '', } vm.upload_list = [] // 上传图片列表 vm.dowload_list = [] vm.cddItemList = [] vm.isApproved = window.localStorage.isApproved vm.bp_id = vm.$route.params.bp_id vm.loadItemList() // vm.houseQuery() // vm.carQuery() // vm.propertyQuery() // 不动产权证查询 } else if (from.name === 'Invoice' && window.localStorage.from === 'false') { vm.carFlag = false, // 行驶证查看标识,为false则用查询出来的,为true则用拍照出来的 vm.houseFlag = false, // 房产证查看标识,为false则用查询出来的,为true则用拍照出来的 vm.propertyFlag = false, // 不动产证查看标识,为false则用查询出来的,为true则用拍照出来的 vm.isUploadCar = false, vm.isUploadHouse = false, vm.isUploadProperty = false, vm.carImg = '', vm.houseImg = '', vm.propertyImg = '', // 不动产识别图片 vm.propertyInfo = { // 不动产证 bp_id: vm.$route.params.bp_id, right_person: '', public_situation: '', house_located: '', real_unit_number: '', right_type: '', right_property: '', house_purpose: '', house_area: '', land_use_limit: '', right_others: '', } vm.hauseInfo = { // 房产证 bp_id: vm.$route.params.bp_id, house_owner: '', public_situation: '', house_located: '', regist_date: '', house_property: '', plan_purpose: '', house_layers: '', built_area: '', built_in_area: '', others: '', land_number: '', land_get_method: '', land_use_limit: '', } vm.carInfo = { // 行驶证 bp_id: vm.$route.params.bp_id, vehicle_identify_num: '', address: '', brand_model_number: '', start_date: '', vehicle_type: '', owner: '', use_nature: '', engine_number: '', plate_number: '', regist_date: '', words_result_num: '', success: '', } vm.upload_list = [] // 上传图片列表 vm.dowload_list = [] vm.cddItemList = [] vm.isApproved = window.localStorage.isApproved vm.bp_id = vm.$route.params.bp_id } }) }, created () {}, updated () { let myArea = document.querySelectorAll('textarea') myArea.forEach(i => { let num = Math.ceil((i.scrollHeight - 42) / 20) if (num > 0) { i.rows = num + 2 } }) }, methods: { // 附件信息保存前校验 addCheck () { let vm = this let url = process.env.basePath + 'bp_attachment_check' let param = { bp_id: vm.bp_id, } hlsPopup.showLoading('请稍候') vm.$post(url, param).then(function (res) { vm.hlsPopup.hideLoading() if (res.result === 'S') { } else { hlsPopup.showLongCenter(res.message) } }) }, addRow (e, event) { // let num = Math.ceil((el.target.scrollHeight - 42) / 20) // if (num > 0) { // el.target.rows = num + 2 // } if (e) { let addNum = Math.ceil(e.length / 16) if (addNum === 0) { event.target.rows = 1 } else if (addNum >= addNum - 1 && addNum < addNum + 1) { event.target.rows = addNum + 1 } } }, // 房产证信息查询 async houseQuery () { let vm = this let url = process.env.basePath + 'bp_house_info_query' let flag = await vm.carQuery() let param = { bp_id: vm.bp_id, } if (flag) { // hlsPopup.showLoading('请稍候') let res = await vm.$post(url, param) // vm.hlsPopup.hideLoading() if (res.result === 'S') { Object.assign(vm.hauseInfo, res.info) // vm.hauseInfo = res.info return true } else { hlsPopup.showLongCenter(res.message) return false } } }, // 行驶证信息查询 async carQuery () { let vm = this let url = process.env.basePath + 'bp_vehicleLicense_query' let flag = await vm.propertyQuery() let param = { bp_id: vm.bp_id, } // hlsPopup.showLoading('请稍候') if (flag) { let res = await vm.$post(url, param) // vm.hlsPopup.hideLoading() console.log('行驶证信息查询', res) if (res.result === 'S') { Object.assign(vm.carInfo, res.info) // vm.carInfo = res.info return true } else { hlsPopup.showLongCenter(res.message) return false } } }, // 不动产权证查询 async propertyQuery () { let vm = this let url = process.env.basePath + 'bp_real_estate_query' let param = { bp_id: vm.bp_id, } hlsPopup.showLoading('请稍候') let res = await vm.$post(url, param) // vm.hlsPopup.hideLoading() console.log('不动产权证查询', res) if (res.result === 'S') { Object.assign(vm.propertyInfo, res.info) return true // vm.propertyInfo = res.info } else { hlsPopup.showLongCenter(res.message) return false } }, // 行驶证信息保存 async saveCarInfo () { let vm = this let url = process.env.basePath + 'bp_vehicleLicense_save' let param = { master: vm.carInfo, } hlsPopup.showLoading('请稍候') let res = await vm.$post(url, param) if (res.result === 'S') { vm.hlsPopup.hideLoading() return true } else { hlsPopup.showLongCenter(res.message) } }, // 不动产信息保存 async savePropertyInfo () { let vm = this let url = process.env.basePath + 'bp_real_estate_save' let isSaveCar = await vm.saveCarInfo() let param = { master: vm.propertyInfo, } if (isSaveCar) { let res = await vm.$post(url, param) if (res.result === 'S') { return true } else { hlsPopup.showLongCenter(res.message) } } }, // 房产证信息保存 async saveHouseInfo () { let vm = this let url = process.env.basePath + 'bp_house_info_save' let isSaveEstate = await vm.savePropertyInfo() let param = { master: vm.hauseInfo, } if (isSaveEstate) { hlsPopup.showLoading('请稍候') vm.$post(url, param).then(function (res) { vm.hlsPopup.hideLoading() if (res.result === 'S') { /* vm.$router.push({ name: 'BankInfo', params: { bp_id: vm.bp_id, }, }) */ vm.attachmentCheck() } else { hlsPopup.showLongCenter(res.message) } }) } }, attachmentCheck () { let vm = this let url = process.env.basePath + 'bp_attachment_check' let param = { bp_id: vm.bp_id, } vm.hlsPopup.showLoading('正在校验数据') vm.hlsHttp.post(url, param).then(function (res) { vm.hlsPopup.hideLoading() if (res.result === 'S') { vm.$router.push({ name: 'BankInfo', params: { bp_id: vm.bp_id, }, }) } else { hlsPopup.showError(res.message) } }) }, verified () { let vm = this if (vm.isUploadHouse) { vm.houseFlag = true vm.delete_pic_to_ocr(vm.houseAttachmentId) // 房产证修改,重新上传 let list = [] let obj = { pkvalue: vm.house_id, source_type: 'PRJ_CDD_ITEM_CHECK', picture: '', check_id: vm.house_id, filePath: vm.houseImg, attachment_id: '', user_id: 1, fileName: '房产证', } list.push(obj) vm.save_picture(list) vm.isUploadHouse = false // 置为false,防止再次保存重复上传,只有重新识别才会重新上传 } if (vm.isUploadCar) { vm.carFlag = true vm.delete_pic_to_ocr(vm.carAttachmentId) // 房产证修改,重新上传 let list = [] let obj = { pkvalue: vm.car_id, source_type: 'PRJ_CDD_ITEM_CHECK', picture: '', check_id: vm.car_id, filePath: vm.carImg, attachment_id: '', user_id: 1, fileName: '行驶证', } list.push(obj) vm.save_picture(list) vm.isUploadCar = false // 置为false,防止再次保存重复上传,只有重新识别才会重新上传 } if (vm.isUploadProperty) { vm.propertyFlag = true vm.delete_pic_to_ocr(vm.propertyAttachmentId) // 房产证修改,重新上传 let list = [] let obj = { pkvalue: vm.property_id, source_type: 'PRJ_CDD_ITEM_CHECK', picture: '', check_id: vm.property_id, filePath: vm.propertyImg, attachment_id: '', user_id: 1, fileName: '不动产权证', } list.push(obj) vm.save_picture(list) vm.isUploadProperty = false // 置为false,防止再次保存重复上传,只有重新识别才会重新上传 } // vm.savePropertyInfo() vm.saveHouseInfo() }, // 房产证/车辆证识别 ocrShow (ocrType, type) { let vm = this hlsPopup.showActionSheet({ titleText: '请选择照片', buttonArray: ['拍照', '从相册取'], callback: index => { if (index === 0) { vm.openCamera(ocrType, type) } else { vm.takePicture(ocrType, type) } }, }) }, openCamera (ocrType, type) { let vm = this let cameraoptions = { quality: 60, width: 1843, height: 1382, } let success = function (imgdata) { if (!imgdata) { hlsPopup.showLongCenter('请拍照') } else { if (ocrType === 'HOUSE_CARD') { vm.isUploadHouse = true vm.houseImg = imgdata vm.houseCardIdentify(imgdata) } else if (ocrType === 'CAR_CARD') { vm.isUploadCar = true vm.carImg = imgdata vm.carCardIdentify(imgdata) } else if (ocrType === 'REAL_EST_CERTIFICATE') { vm.isUploadProperty = true vm.propertyImg = imgdata vm.propertyIdentify(imgdata) } } } let error = function () { hlsPopup.showLongCenter('请拍照') } hlsUtil.openCamera(cameraoptions, success, error) }, takePicture (ocrType, type) { let vm = this var cameraoptions = { quality: 70, width: 1843, height: 1382, maxCount: 1, } let success = function (imgUrl) { if (imgUrl.length === 0) { hlsPopup.showLongCenter('请选择一张图片') } else { if (ocrType === 'HOUSE_CARD') { vm.houseImg = imgUrl[0] vm.isUploadHouse = true vm.houseCardIdentify(imgUrl[0]) } else if (ocrType === 'CAR_CARD') { vm.carImg = imgUrl[0] vm.isUploadCar = true vm.carCardIdentify(imgUrl[0]) } else if (ocrType === 'REAL_EST_CERTIFICATE') { vm.isUploadProperty = true vm.propertyImg = imgUrl[0] vm.propertyIdentify(imgUrl[0]) } } } let error = function () { hlsPopup.showLongCenter(error) } vm.hlsUtil.takePicture(cameraoptions, success, error) }, // 房产证识别 houseCardIdentify (fileUrl) { let vm = this hlsPopup.showLoading('正在识别') let url = process.env.ocrPath + '/baidu/ocr/house' hlsUtil.baiduOcr(fileUrl, url, function (res) { hlsPopup.hideLoading() let result = res.result.data vm.hauseInfo.house_owner = result.house_owner.word vm.hauseInfo.public_situation = result.public_situation.word vm.hauseInfo.house_located = result.house_located.word vm.hauseInfo.regist_date = result.regist_date.word vm.hauseInfo.house_property = result.house_property.word vm.hauseInfo.plan_purpose = result.plan_purpose.word vm.hauseInfo.house_layers = result.house_layers.word vm.hauseInfo.built_area = result.built_area.word vm.hauseInfo.built_in_area = result.built_in_area.word vm.hauseInfo.others = result.others.word vm.hauseInfo.land_number = result.land_number.word vm.hauseInfo.land_get_method = result.land_get_method.word vm.hauseInfo.land_use_limit = result.land_use_limit.word }) }, // 行驶证识别 carCardIdentify (fileUrl) { let vm = this hlsPopup.showLoading('正在识别') let url = process.env.ocrPath + '/baidu/ocr/vehicleLicense' hlsUtil.baiduOcr(fileUrl, url, function (res) { hlsPopup.hideLoading() let result = res.result.words_result vm.carInfo.vehicle_identify_num = result.车辆识别代号.words vm.carInfo.address = result.住址.words vm.carInfo.brand_model_number = result.品牌型号.words vm.carInfo.start_date = result.发证日期.words vm.carInfo.vehicle_type = result.车辆类型.words vm.carInfo.owner = result.所有人.words vm.carInfo.use_nature = result.使用性质.words vm.carInfo.engine_number = result.发动机号码.words vm.carInfo.plate_number = result.号牌号码.words vm.carInfo.regist_date = result.注册日期.words vm.carInfo.words_result_num = res.result.words_result_num vm.carInfo.success = res.success }) }, // 不动产证识别 propertyIdentify (fileUrl) { let vm = this hlsPopup.showLoading('正在识别') let url = process.env.ocrPath + '/baidu/ocr/houseRight' hlsUtil.baiduOcr(fileUrl, url, function (res) { hlsPopup.hideLoading() let result = res.result.data vm.propertyInfo.right_person = result.right_person.word vm.propertyInfo.public_situation = result.public_situation.word vm.propertyInfo.house_located = result.house_located.word vm.propertyInfo.real_unit_number = result.real_unit_number.word vm.propertyInfo.right_type = result.right_type.word vm.propertyInfo.right_property = result.right_property.word vm.propertyInfo.house_purpose = result.house_purpose.word vm.propertyInfo.house_area = result.house_area.word vm.propertyInfo.land_use_limit = result.land_use_limit.word vm.propertyInfo.right_others = result.right_others.word }) }, async loadItemList () { let vm = this let url = process.env.basePath + 'prj_cdd_check_list' let flag = await vm.houseQuery() let bpId = vm.bp_id if (bpId === 'undefined') { bpId = null } let param = { master: { 'document_id': bpId, 'document_table': 'HLS_BP_MASTER', 'tab_group': window.localStorage.authFlag ? 'HLS_ORG_NAUTH' : 'HLS_ORG_AUTH', }, } if (flag) { vm.hlsHttp.post(url, param).then(function (res) { hlsPopup.hideLoading() if (res.result === 'S') { vm.cddItemList = [] var listTemp = [...res.lists] listTemp.forEach(item => { switch (item.cdd_item) { case 'HOUSE_CARD': // 房产证 vm.house_id = item.check_id break case 'CAR_CARD': // 行驶证 vm.car_id = item.check_id break case 'REAL_EST_CERTIFICATE': // 不动产 vm.property_id = item.check_id break default: break } }) vm.cddItemList = res.lists.filter(item => { return item.cdd_item === 'HOUSE_CARD' || item.cdd_item === 'CAR_CARD' || item.cdd_item === 'ASSETS_CARD' || item.cdd_item === 'REAL_EST_CERTIFICATE' }) // 查询图片 console.log('cddItemList.........', vm.cddItemList) vm.cddItemList.forEach((item, index) => { vm.load_picture(item.check_id, index, item.cdd_item) }) } }) } }, load_picture (check_id, index, cdd_item) { console.log(check_id, cdd_item) let vm = this let url = process.env.basePath + 'attachment_list_query' + '&index' + index // 附件查询 let param = { check_id: check_id, } hlsPopup.showLoading('请稍候') vm.$post(url, param).then(function (res) { vm.hlsPopup.hideLoading() if (res.result === 'S') { console.log('load_picture....1111 ', res.lists) res.lists.forEach(item => { item['url'] = process.env.filePath + 'attachment_id=' + item.attachment_id + '&access_token=' + window.localStorage.access_token }) switch (cdd_item) { case 'HOUSE_CARD': // 房产证 if (!vm.houseFlag) { vm.houseImg = res.lists[0].url } vm.houseAttachmentId = res.lists[0].attachment_id break case 'CAR_CARD': // 行驶证 if (!vm.carFlag) { vm.carImg = res.lists[0].url } vm.carAttachmentId = res.lists[0].attachment_id break case 'REAL_EST_CERTIFICATE': // 不动产 if (!vm.propertyFlag) { vm.propertyImg = res.lists[0].url } vm.propertyAttachmentId = res.lists[0].attachment_id break case 'ASSETS_CARD': console.log('ASSETS_CARD............', res.lists) vm.dowload_list = [...res.lists] break default: } } else { hlsPopup.showLongCenter(res.message) } }) }, // 图片上传入口 imgUploadShow (description, check_id) { console.log(description, check_id) let vm = this hlsPopup.showActionSheet({ titleText: '请选择照片', buttonArray: ['拍照', '从相册取'], callback: index => { if (index === 0) { vm.imgUploadOpenCamera(description, check_id) } else { vm.imgUploadTakePicture(description, check_id) } }, }) }, imgUploadOpenCamera (description, check_id) { let vm = this let obj = { 'pkvalue': check_id, 'source_type': 'PRJ_CDD_ITEM_CHECK', 'picture': '', 'check_id': check_id, 'filePath': '', 'attachment_id': '', 'user_id': 1, 'fileName': description + '_' + new Date().getTime(), } let cameraoptions = { quality: 100, } let success = function (imgdata) { obj.picture = imgdata obj.filePath = imgdata let list = [] list.push(obj) // 拍完一张立马执行保存图片逻辑 vm.save_picture(list) } let error = function () { hlsPopup.showLongCenter('请拍照') } hlsUtil.openCamera(cameraoptions, success, error) }, imgUploadTakePicture (description, check_id) { let vm = this let cameraoptions = { quality: 100, } let success = function (imgUrl) { var list = [] for (let i = 0; i < imgUrl.length; i++) { let obj = { 'pkvalue': check_id, 'source_type': 'PRJ_CDD_ITEM_CHECK', 'picture': '', 'check_id': check_id, 'filePath': '', 'attachment_id': '', 'user_id': 1, 'fileName': description + '_' + new Date().getTime(), } obj.picture = imgUrl[i] obj.filePath = imgUrl[i] list.push(obj) } vm.save_picture(list) } let error = function () { } vm.hlsUtil.takePicture(cameraoptions, success, error) }, // 查看大图 showBigPicture (pic) { let vm = this vm.hlsPopup.showBigPicture({ imgUrl: pic, width: '100%', }) }, // 移除图片 remove_pic (attachment_id, index) { let vm = this var delete_list = [] let obj = {'attachment_id': attachment_id} delete_list.push(obj) let url = process.env.basePath + 'app_delete_attment' // 附件删除 let param = { 'picturelist': delete_list, } hlsPopup.showLoading('请稍候') vm.hlsHttp.post(url, param).then(function (res) { hlsPopup.hideLoading() if (res.result === 'S') { hlsPopup.showLongCenter('删除成功!') vm.remove_upload_list(attachment_id, index) } else if (res.result === 'E') { hlsPopup.showShortCenter(res.message) } }) }, remove_upload_list (attachment_id, index) { let vm = this vm.upload_list = vm.upload_list.filter(item => { return item.attachment_id !== attachment_id }) }, // 删除图片 delete_pic (attachment_id) { let vm = this var delete_list = [] let obj = {'attachment_id': attachment_id} delete_list.push(obj) let url = process.env.basePath + 'app_delete_attment' // 附件删除 let param = { 'picturelist': delete_list, } hlsPopup.showLoading('请稍候') vm.hlsHttp.post(url, param).then(function (res) { hlsPopup.hideLoading() if (res.result === 'S') { hlsPopup.showLongCenter('删除成功!') vm.remove_dowload_list(attachment_id) } else if (res.result === 'E') { hlsPopup.showShortCenter(res.message) } }) }, remove_dowload_list (attachment_id) { console.log('attachment_id', attachment_id) let vm = this vm.dowload_list = vm.dowload_list.filter(item => { return item.attachment_id !== attachment_id }) }, // 图片保存 save_picture (list) { let vm = this if (list.length) { // hlsPopup.showLoading('图片上传请稍候') var alreadyUploadNum = 0 var attLength = 0 var recordUploadInterval = setInterval(function () { if (alreadyUploadNum === attLength) { clearInterval(recordUploadInterval) /* hlsPopup.hideLoading() hlsPopup.showLongCenter('图片上传成功') */ } }, 500) for (var i = 0; i < list.length; i++) { let uploadSuccess = function (res) { if (res.result === 'S') { alreadyUploadNum++ for (var j = 0; j < list.length; j++) { if (list[j].filePath === res.response.filePath) { list[j].attachment_id = res.response.attachment_id vm.upload_list.push(list[j]) break } } } else { hlsPopup.hideLoading() } } if (!list[i].attachment_id) { attLength++ hlsUtil.fileUploadSvc(list[i], uploadSuccess) } } } else { hlsPopup.hideLoading() } }, // 删除重新识别之前的图 delete_pic_to_ocr (attachment_id) { let vm = this var delete_list = [] let obj = { attachment_id: attachment_id } delete_list.push(obj) let url = process.env.basePath + 'app_delete_attment' // 附件删除 let param = { picturelist: delete_list, } vm.hlsHttp.post(url, param).then(function (res) { hlsPopup.hideLoading() if (res.result === 'S') { } else if (res.result === 'E') { } }) }, }, } </script> <style lang='less'> #enclosure { textarea{ color:#666; resize: none; } textarea::placeholder{ text-align: right; } .footer-button { padding-top: 15px; padding-bottom: 15px; } .save { width: 100%; height: 45px; color: #fff; border-radius: 4px; background-color: @headerColor; } .card2 { padding-bottom: 8px; height: auto; background-color: #fff; display: flex; flex-direction: column; .descript-color { color: #1D3FFF } span { color: #656464; font-size: 13px; line-height: 18px; padding-top: 8px; display: block; margin-left: 16px; } .img-content { /* display: flex; flex-flow: row wrap; justify-content: flex-start; align-items: center;*/ } .plus { display: flex; justify-content: center; align-items: center; } .card-upload { position: relative; width: 80px; height: 80px; border: 1px dashed #dcdcdd; /* display: flex; justify-content: center; align-items: center;*/ margin-top: 12px; margin-left: 16px; float: left; .close { /* position: relative; color: #F96F68; margin-top: -100%; margin-left: -10%;*/ position: absolute; color: #F96F68; top: -6px; right: -6px; img { width: 14px; height: 14px; } } img { /*width: 88px; height: 88px;*/ width: 100%; height: 100%; } .upload-btn { width: 24px; height: 24px; } } } .upload-id-card { height: 122px; background-color: #fff; span { display: block; color: #656464; margin-left: 16px; padding-top: 16px; font-size: 13px; } .upload-box1 { width: 80px; height: 80px; border: 1px dashed #dcdcdd; text-align: center; margin-top: 8px; margin-left: 16px; .licenseBox { width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; } img { margin-top: 30px; width: 25px; height: 25px; } } } } </style>