79 lines
1.5 KiB
Vue
79 lines
1.5 KiB
Vue
<template>
|
|
<u-modal
|
|
:title="title"
|
|
:show="show"
|
|
:showCancelButton="true"
|
|
:showConfirmButton="true"
|
|
:show-title="showTitle"
|
|
:confirmText="options['confirm-text']"
|
|
:cancelText="options['cancel-text']"
|
|
confirmColor="#FF779E"
|
|
@confirm="confirmHandler"
|
|
@cancel="cancelHandler"
|
|
>
|
|
<view class="slot-content">
|
|
<text class="fs-32 text-center">{{ content }}</text>
|
|
</view>
|
|
</u-modal>
|
|
</template>
|
|
|
|
<script>
|
|
|
|
export default {
|
|
name: 'GModal',
|
|
props:{
|
|
showTitle:{
|
|
type:Boolean,
|
|
default:()=> false
|
|
},
|
|
title:{
|
|
type:String,
|
|
default:()=> ''
|
|
}
|
|
},
|
|
data() {
|
|
return {
|
|
show: false,
|
|
content: '',
|
|
resolve: null,
|
|
reject: null,
|
|
options: {},
|
|
timer: null
|
|
};
|
|
},
|
|
methods: {
|
|
open(content, options = {}) {
|
|
this.show = true;
|
|
this.content = content;
|
|
this.options = {
|
|
'confirm-text': '确定',
|
|
'cancel-text': '取消',
|
|
...options
|
|
};
|
|
return new Promise((resolve, reject) => {
|
|
this.reject = reject;
|
|
this.resolve = resolve;
|
|
});
|
|
},
|
|
confirmHandler() {
|
|
clearTimeout(this.timer);
|
|
this.timer = setTimeout(() => {
|
|
this.resolve();
|
|
this.show = false;
|
|
});
|
|
},
|
|
cancelHandler() {
|
|
this.reject();
|
|
this.show = false;
|
|
}
|
|
}
|
|
};
|
|
</script>
|
|
<style lang="scss" scoped>
|
|
.slot-content {
|
|
font-size: 32rpx;
|
|
padding: 54rpx 48rpx;
|
|
width: 650rpx;
|
|
}
|
|
</style>
|