129 lines
2.7 KiB
Vue
129 lines
2.7 KiB
Vue
<template>
|
|
<view class="">
|
|
|
|
<view class="jsfm-item">
|
|
<u-row justify="between" align="top">
|
|
<!-- <text class="font-28 pt-20 font-weight">尺寸</text> -->
|
|
<view style="width: 100%;">
|
|
<u-row justify="between">
|
|
<u-col span="3.7">
|
|
<tpx-input v-model:value="modelInfo.length" placeholder="长" inputAlign="right" suffix="cm" _digit="4"></tpx-input>
|
|
</u-col>
|
|
<u-col span="3.7">
|
|
<tpx-input v-model:value="modelInfo.width" placeholder="宽" inputAlign="right" suffix="cm" _digit="4"></tpx-input>
|
|
</u-col>
|
|
<u-col span="3.7">
|
|
<tpx-input v-model:value="modelInfo.height" placeholder="高" inputAlign="right" suffix="cm" _digit="4"></tpx-input>
|
|
</u-col>
|
|
</u-row>
|
|
</view>
|
|
</u-row>
|
|
</view>
|
|
<view class="jsfm-item">
|
|
<tpx-text-item :required="true" label="件数" >
|
|
<template #right>
|
|
<tpx-input placeholder="请填写" v-model:value="modelInfo.cargoQty" inputAlign="right" :customStyle="`${comInSty}`" type="number" suffix="件" :_maxNum="cargoQtyMaxNum"></tpx-input>
|
|
</template>
|
|
</tpx-text-item>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
computed: {
|
|
modelInfo: {
|
|
get(){
|
|
return this.value
|
|
}
|
|
},
|
|
calChangeVal(){
|
|
const { length, width, height, cargoQty } = this.modelInfo
|
|
return {
|
|
length, width, height, cargoQty
|
|
}
|
|
},
|
|
cargoQtyMaxNum(){
|
|
// 限制数量的最大值
|
|
let { cargoList, parcelQty } = this.submitVal
|
|
let curQty = (+this.modelInfo.cargoQty) || 0
|
|
let qtMaxNum = parcelQty + curQty
|
|
cargoList.map(t=> {
|
|
if(t.cargoQty) {
|
|
qtMaxNum = qtMaxNum - t.cargoQty
|
|
}
|
|
})
|
|
if(qtMaxNum < 0) {
|
|
qtMaxNum = 0
|
|
}
|
|
return qtMaxNum
|
|
}
|
|
},
|
|
watch: {
|
|
calChangeVal: {
|
|
handler: function(newVal){
|
|
this.calculateVplume(newVal)
|
|
},
|
|
deep: true
|
|
}
|
|
},
|
|
props: {
|
|
value: {
|
|
default () {
|
|
return { }
|
|
}
|
|
},
|
|
submitVal: {
|
|
default () {
|
|
return {}
|
|
}
|
|
},
|
|
comInSty: {
|
|
default () {
|
|
return ''
|
|
}
|
|
},
|
|
},
|
|
data() {
|
|
return {
|
|
}
|
|
},
|
|
created() {
|
|
},
|
|
onHide() {
|
|
|
|
},
|
|
unmounted() {
|
|
|
|
},
|
|
|
|
methods: {
|
|
calculateVplume(calVal) {
|
|
setTimeout(()=> {
|
|
let volume = this.modelInfo.volume
|
|
const { length, width, height, cargoQty } = calVal
|
|
console.log("cargoQty======v", cargoQty)
|
|
if(length && width && height && cargoQty){
|
|
volume = length/100 * width/100 * height/100 * cargoQty
|
|
}
|
|
if(volume && volume.toFixed) {
|
|
volume = volume.toFixed(4)
|
|
this.modelInfo.volume = volume
|
|
} else {
|
|
this.modelInfo.volume = 0
|
|
}
|
|
}, 500);
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.shet-cont{
|
|
padding: 0;
|
|
}
|
|
.jsfm-item{
|
|
margin-top: 30rpx;
|
|
}
|
|
|
|
</style> |