<script>
import {Config} from '@/config.js'
import {mapState} from 'vuex'
import {LocalData, toast, WX} from '@/utils/common'
import {FileUtil} from '@/utils/FileUtil'
import {PayUtil} from '@/utils/PayUtil'
import Vue from 'vue'
import {Checklist, Indicator, Popup} from 'mint-ui'
import xImg from '@/components/x-img'
Vue.component(Checklist.name, Checklist)
Vue.component(Popup.name, Popup)
let imgLimit = 100
let vm
export default {
name: 'signing',
components: {
xImg
},
data() {
return {
contractno:undefined,//合同号
totle_sum: undefined,//总车辆数
totle_r: undefined,//常规租赁总租金
totle_s: undefined,//以租代购总租金
totle_b: undefined,//总保证金
first_t: undefined,//首付款总金额
sign_address: '',//签约地点
sing_time: '',//签约时间
sign_remark: '',//备注
operator_name: '',//经办人
imgs: {},
imgLen:0,
updataImg: '../../static/img/update.jpg ',
selectImgs: [{}],
images: [],
}
},
computed: {
...mapState({
signContract: state => state.signing.signContract,
totleRent: function () {
this.totle_sum = 0
this.totle_r = 0
this.totle_s = 0
this.totle_b = 0
this.first_t = 0
let _length = this.signContract.cardetail.length
let _array = this.signContract.cardetail
for (let i = 0; i < _length; i++) {
//获取车辆数
this.totle_sum += parseInt(_array[i].number)
//获取常规租赁租金
this.totle_r += parseInt(_array[i].rent_total)
//获取以租代购租金
this.totle_s += parseInt(_array[i].rent_sum)
//获取保证金
this.totle_b += parseInt(_array[i].bond_total)
//获取首付款总额
this.first_t += parseInt(_array[i].first_total)
}
},
}),
},
methods: {
getSignContract: function () {
let rel = this;
rel.$store.dispatch('signing/getsignContract', {
params: {
contractno: this.contractno
},
// callBack(data) {
// rel.operator_name = data.operator_name
// }
})
},
selectImage () {
if (this.$refs.fileInput[0].files.length > 0) {
const file = this.$refs.fileInput[0].files[0]
const vm = this
const temp = this.selectImgs[this.selectImgs.length - 1]
Vue.set(temp, 'src', 'loadding')
FileUtil.compress(file, {
onSuccess (result) {
let rst = result[0]
temp.src = rst.base64
temp.file = rst.file
temp.name = rst.origin.name
vm.images.push({
src: rst.base64
})
if (vm.selectImgs.length < imgLimit) {
vm.selectImgs.push({})
}
},
onFail (err) {
temp.src = undefined
toast.show(JSON.stringify(err))
},
onFinish () {
}
})
}
},
delImg (index) {
this.selectImgs.splice(index, 1)
this.images.splice(index, 1)
if (this.selectImgs.length > 0) {
let temp = this.selectImgs[this.selectImgs.length - 1]
if (temp.src) {
this.selectImgs.push({})
}
}
else {
this.selectImgs.push({})
}
},
submit() {
if (!this.sing_time) {
toast.show('请选着签约时间')
return
}
else if(!this.sign_address){
toast.show('请填写签约地址')
return
}
else if(!this.sign_remark){
toast.show('请简要填写备注')
return
}
let formData = new FormData()
formData.append('token', LocalData.getToken())
formData.append('contractno', this.contractno)
formData.append('sing_time', this.sing_time)
formData.append('sign_address', this.sign_address)
formData.append('sign_remark', this.sign_remark)
for (let index = 0; index < this.selectImgs.length - 1; index++) {
if (this.selectImgs[index] != null) {
formData.append('uploadImg', this.selectImgs[index].file, this.selectImgs[index].name)
}
}
let config = {
headers: {
'Content-Type': 'multipart/form-data'
}
}
Indicator.open()
this.$axios.post('applease/internallySignedImg', formData, config).then(
response => {
Indicator.close()
if (response.data.code == 0) {
}
toast.show(response.data.message)
}).catch(error => {
console.log(error)
Indicator.close()
toast.show('网络异常，上传失败')
})
}
},
created: function () {
vm = this
this.contractno = this.$route.query.contractNo
this.getSignContract()//合同车辆信息接口处理
}
}
</script>
<div class="img-box">
<div class="up-img">
<template v-for="(img,index) of selectImgs">
<template v-if="!img || !img.src">
<em>
<input type="file" accept="image/jpeg,image/jpg,image/png,image/x-png,image/gif" @change="selectImage"
ref="fileInput"/>
<img :src="updataImg"/>
</em>
</template>
<template v-else>
<label>
<template v-if="img.src && img.src != 'loadding'">
<i slot="icon" class="item-icon parent-h-right icon-close" @click="delImg(index)"></i>
</template>
<x-img :src="img.src" @on-click="preview(index)"></x-img>
</label>
</template>
</template>
</div>
</div>