127 lines
2.2 KiB
Vue
127 lines
2.2 KiB
Vue
<template>
|
|
<tpx-dialog :show="show" :title="title" @onClose="handleCloseModal()" rootStyle="min-height:auto;"
|
|
:contentStyle="contentStyle"
|
|
>
|
|
<view :style="cptStyle">
|
|
<tpx-layout>
|
|
<template v-slot:body>
|
|
<view v-if="contShow" class="pl-30 pr-30">
|
|
<slot :value="submitVals"></slot>
|
|
</view>
|
|
</template>
|
|
|
|
<template v-slot:footer>
|
|
<view class="blcok-white-noradius" style="margin-top: 0;margin-bottom: 0;">
|
|
<u-button @click="handleSubmitValue()" type="primary" size="large" shape="circle"
|
|
custom-style="height:80rpx;font-size: 30rpx;"
|
|
>确认</u-button>
|
|
</view>
|
|
</template>
|
|
</tpx-layout>
|
|
</view>
|
|
</tpx-dialog>
|
|
</template>
|
|
|
|
<script>
|
|
|
|
export default {
|
|
computed:{
|
|
cptStyle(){
|
|
let sty = `position: relative;height: calc(${this.percentHeight}vh);`
|
|
return sty
|
|
}
|
|
},
|
|
components: { },
|
|
watch: {
|
|
show(v){
|
|
if(v) {
|
|
this.submitVals = JSON.parse(JSON.stringify(this.value))
|
|
}
|
|
setTimeout(()=> {
|
|
// 防止 弹框内容组件不更新、有缓存
|
|
this.contShow = v
|
|
}, 350)
|
|
}
|
|
},
|
|
props: {
|
|
title: {
|
|
default () {
|
|
return ''
|
|
}
|
|
},
|
|
contentStyle: {
|
|
default () {
|
|
return 'padding:0;'
|
|
}
|
|
},
|
|
percentHeight: {
|
|
default () {
|
|
return 60
|
|
}
|
|
},
|
|
show: {
|
|
default () {
|
|
return false
|
|
}
|
|
},
|
|
value: {
|
|
default () {
|
|
return {
|
|
}
|
|
}
|
|
},
|
|
okCloseModal: {
|
|
default () {
|
|
return true
|
|
}
|
|
},
|
|
sureCheckFun: {
|
|
default () {
|
|
return null
|
|
}
|
|
},
|
|
},
|
|
data() {
|
|
return {
|
|
contShow: false,
|
|
submitVals: {}
|
|
}
|
|
},
|
|
created() {
|
|
|
|
},
|
|
onHide() {
|
|
},
|
|
unmounted() {
|
|
},
|
|
|
|
methods: {
|
|
handleCloseModal() {
|
|
this.$emit('update:show', false)
|
|
this.$emit('onClose')
|
|
},
|
|
async handleSubmitValue() {
|
|
const val = this.submitVals
|
|
if(this.sureCheckFun) {
|
|
let bl = await this.sureCheckFun(val)
|
|
if(!bl){
|
|
return false
|
|
}
|
|
}
|
|
this.$emit('onSure', val)
|
|
this.$emit('update:value', val)
|
|
this.okCloseModal && this.handleCloseModal()
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.shet-cont{
|
|
padding: 10rpx 0 30rpx 0;
|
|
}
|
|
.jsfm-item{
|
|
margin-top: 30rpx;
|
|
}
|
|
|
|
</style> |