70 lines
1.4 KiB
Vue
70 lines
1.4 KiB
Vue
<template>
|
|
<view class="cu-modal" :class="showModal?'show':''" >
|
|
<view class="cu-dialog">
|
|
<view class="cu-bar bg-blue u-f-ajc solid-bottom">
|
|
<view class="modal-title">{{modalTitle}}</view>
|
|
</view>
|
|
<view class="cu-bar u-f-ajc">
|
|
<slot name="content">{{note}}</slot>
|
|
</view>
|
|
<view class="cu-bar bg-white solid-top" v-if="showCancelFlag||showOkFlag">
|
|
<view v-if="showCancelFlag" class="action margin-0 flex-sub solid-right" @tap="cancelModal">{{cancelText}}</view>
|
|
<view v-if="showOkFlag" class="action margin-0 flex-sub solid-left text-blue" @tap="okModal">{{okText}}</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
props: {
|
|
modalTitle:{
|
|
type:String,
|
|
default:"标题",
|
|
},
|
|
note:{
|
|
type:String,
|
|
default:"内容",
|
|
},
|
|
showModal:{
|
|
type:Boolean,
|
|
default: false,
|
|
},
|
|
okText:{
|
|
type: String,
|
|
default: "确认"
|
|
},
|
|
cancelText:{
|
|
type: String,
|
|
default: "取消"
|
|
},
|
|
showCancelFlag:{
|
|
type: Boolean,
|
|
default: true,
|
|
},
|
|
showOkFlag:{
|
|
type: Boolean,
|
|
default: true,
|
|
}
|
|
},
|
|
methods:{
|
|
cancelModal(e){
|
|
this.$emit("cancelModal");
|
|
},
|
|
okModal(e){
|
|
this.$emit("okModal");
|
|
}
|
|
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
@import "main.css";
|
|
.u-f-ajc{
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
</style>
|