You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
160 lines
4.7 KiB
160 lines
4.7 KiB
<template>
|
|
<view class="content">
|
|
|
|
<view class="cr mt40">
|
|
|
|
<view class="re-card-p32">
|
|
<view class="flex-sb">
|
|
<view class="re-from-label">请点击下方图片上传车辆照片</view>
|
|
<view class="re-card-show" @click="clickShowExample('https://relief.oss-cn-hangzhou.aliyuncs.com/car1.png')">查看示例</view>
|
|
</view>
|
|
<input-image :url="car.carimage" @success="(url) => car.carimage = url" :height="456"/>
|
|
<view class="re-card-context" v-if="edit">
|
|
请在<span>支腿收起状态下，在左前方45度角</span>进行拍摄
|
|
</view>
|
|
</view>
|
|
|
|
<view class="re-card-p32">
|
|
<view class="flex-sb">
|
|
<view class="re-from-label">请点击下方图片上传车辆行驶证</view>
|
|
<view class="re-card-show" @click="clickShowExample('https://relief.oss-cn-hangzhou.aliyuncs.com/car2.png')">查看示例</view>
|
|
</view>
|
|
<input-image :url="car.xszaimage" @success="(url) => car.xszaimage = url" :height="342"/>
|
|
<input-image :url="car.xszbimage" @success="(url) => car.xszbimage = url" :height="342"/>
|
|
<view class="re-card-context" v-if="edit">
|
|
<p>中华人民共和国机动车<span>行驶证</span>正反面</p>
|
|
<p>拍摄时确保行驶证<span>边框完整，字迹清晰，亮度均匀，无遮挡涂鸦。</span></p>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="re-card-p32">
|
|
<view class="flex-sb">
|
|
<view class="re-from-label">请点击下方图片上传车辆交强险截图</view>
|
|
<view class="re-card-show" @click="clickShowExample('https://relief.oss-cn-hangzhou.aliyuncs.com/car4.png')">查看示例</view>
|
|
</view>
|
|
<input-image :url="car.jqximage" @success="(url) => car.jqximage = url" :height="800"/>
|
|
<view class="re-card-context" v-if="edit">
|
|
<p>您需要提供有效期内<span>《机动车交通事故责任强制保险单》</span>的纸质保单正面或电子保单截图。</p>
|
|
<p>上传时需确保截图内包含<span>车牌号、车架号、以及有效期</span>等关键信息</p>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="re-card-p32">
|
|
<view class="flex-sb">
|
|
<view class="re-from-label">请点击下方图片上传车辆商业险截图</view>
|
|
<view class="re-card-show" @click="clickShowExample('https://relief.oss-cn-hangzhou.aliyuncs.com/car5.png')">查看示例</view>
|
|
</view>
|
|
<input-image :url="car.syximage" @success="(url) => car.syximage = url" :height="800"/>
|
|
<view class="re-card-context" v-if="edit">
|
|
<p>您需要提供有效期内<span>《机动车商业保险保险单》</span>的纸质保单正面或电子保单截图。</p>
|
|
<p>上传时需确保截图内包含<span>车牌号、车架号、以及有效期</span>等关键信息</p>
|
|
</view>
|
|
</view>
|
|
|
|
</view>
|
|
|
|
<!-- <view class="re-end-pand">
|
|
<button @click="clickSaveAndBack()">上传保存</button>
|
|
</view> -->
|
|
|
|
<show-example ref="showe" :show="show" :url="url" @close="show=false"/>
|
|
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import InputImage from "/components/input-image.vue"
|
|
import ShowExample from "/components/show-example.vue"
|
|
export default {
|
|
components: {
|
|
InputImage,
|
|
ShowExample
|
|
},
|
|
data() {
|
|
return {
|
|
edit: "",
|
|
show: false,
|
|
url: "",
|
|
id: "",
|
|
car: {
|
|
carimage:"",
|
|
xszaimage:"",
|
|
xszbimage:"",
|
|
jqximage:"",
|
|
syximage:""
|
|
},
|
|
}
|
|
},
|
|
onLoad(opn) {
|
|
console.log(opn);
|
|
this.id = opn.id
|
|
this.loadCar()
|
|
},
|
|
onShow(){
|
|
this.loadCar()
|
|
},
|
|
methods: {
|
|
clickShowExample(url){
|
|
if(url){
|
|
this.url = url
|
|
} else {
|
|
this.url = "https://relief.oss-cn-hangzhou.aliyuncs.com/yx.jpg"
|
|
}
|
|
this.show = true
|
|
},
|
|
clickSaveAndBack(){
|
|
if(!this.car.carimage){
|
|
uni.showToast({ icon: "none", title: "车辆照片缺失" })
|
|
return
|
|
}
|
|
if(!this.car.xszaimage || !this.car.xszbimage){
|
|
uni.showToast({ icon: "none", title: "行驶证照片缺失" })
|
|
return
|
|
}
|
|
if(!this.car.jqximage){
|
|
uni.showToast({ icon: "none", title: "交强险照片缺失" })
|
|
return
|
|
}
|
|
if(!this.car.syximage){
|
|
uni.showToast({ icon: "none", title: "商业险照片缺失" })
|
|
return
|
|
}
|
|
},
|
|
loadCar(){
|
|
const _this = this
|
|
this.$httpGet("/api/car/get", {id: this.id}, function(res) {
|
|
console.log('[/car/get]', res);
|
|
if(res.data){
|
|
_this.car=res.data
|
|
}
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
page {
|
|
background-color: #F5F5F5;
|
|
}
|
|
|
|
.cr {
|
|
min-height: calc(88vh);
|
|
}
|
|
|
|
/deep/ uni-radio .uni-radio-input{
|
|
background-color: #F40000 !important;
|
|
border-color: #F40000 !important;
|
|
}
|
|
|
|
/deep/ uni-radio .uni-radio-input:empty{
|
|
background-color: #ffffff !important;
|
|
border-color: #d1d1d1 !important;
|
|
}
|
|
|
|
.re-from-car{
|
|
width: 72rpx;
|
|
height: 60rpx;
|
|
margin: 0 16rpx -20rpx 0;
|
|
}
|
|
</style>
|