<template>
|
<view class="popConfirm" :class="isShow?'show':''">
|
<view class="box">
|
<view class="title" v-html="title?title:'温馨提示'"></view>
|
<view class="info" :class="center?'center':''" v-html="content"></view>
|
<view class="btn_box">
|
<view v-if="!hideCancel" class="btn cancle" @click="hide">{{cancelText?cancelText:'取消'}}</view>
|
<view class="btn ok" @click="confirm">{{confirmText?confirmText:'确认'}}</view>
|
</view>
|
<view class="pop_close" v-if="showClose" @click="close()"></view>
|
</view>
|
</view>
|
</template>
|
|
<script>
|
import parser from "@/components/jyf-parser/jyf-parser";
|
export default {
|
name:"showConfirm",
|
data() {
|
return {
|
isShow:false,
|
title:'温馨提示',
|
content:'sssss',
|
cancelText:'取消',
|
hideCancel:false,
|
confirmText:'确认',
|
center:false,
|
showClose:false
|
};
|
},
|
components: {
|
"jyf-parser": parser
|
},
|
mounted() {
|
this.init()
|
console.log(this.isShow);
|
},
|
methods:{
|
init() {
|
// uni.showConfirm = this.show;
|
// uni.hideConfirm = this.hide;
|
},
|
show(data) {
|
this.showClose=false;
|
for(var i in data){
|
this.$set(this,i,data[i]);
|
}
|
this.$set(this,'isShow',false);
|
this.$nextTick(()=>{
|
this.$set(this,'isShow',true);
|
console.log(this.isShow);
|
});
|
},
|
hide() {
|
if(this.success){
|
this.success({
|
'cancel':true
|
})
|
}
|
this.$set(this,'isShow',false);
|
},
|
close(){
|
this.$set(this,'isShow',false);
|
},
|
confirm(){
|
if(this.success){
|
this.success({
|
'confirm':true
|
})
|
}
|
this.$set(this,'isShow',false);
|
},
|
success(res){
|
|
}
|
}
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
.popConfirm {
|
position: fixed;
|
left: 0;
|
top: 0;
|
width: 100%;
|
height: 100%;
|
z-index: 11111;
|
background-color: rgba(0, 0, 0, .7);
|
display: none;
|
&.show{
|
display: block;
|
}
|
.box {
|
width: 460rpx;
|
padding: 45rpx 30rpx 45rpx 30rpx;
|
background: url("https://ossacmall.bluedeer.com.cn/app/static/images/confirm_bg.png") center top/100% auto no-repeat;
|
background-color: #f5f5f5;
|
position: absolute;
|
left: 50%;
|
top: 50%;
|
transform: translate(-50%, -50%);
|
border-radius: 14rpx;
|
}
|
|
.title {
|
lineh-height: 40rpx;
|
font-size: 27rpx;
|
font-weight: bold;
|
color: #000000;
|
text-align: center;
|
}
|
|
.info {
|
font-size: 23rpx;
|
margin: 0 auto;
|
color: #000000;
|
text-align: justify;
|
padding: 90rpx 0 40rpx 0;
|
&.center{
|
text-align: center;
|
}
|
.strong {
|
color: #FF780D;
|
}
|
}
|
|
.btn_box {
|
display: flex;
|
display: flex;
|
justify-content: space-around;
|
margin: 0 auto;
|
text-align: center;
|
}
|
|
.btn {
|
width: 168rpx;
|
font-size: 27rpx;
|
lineh-height: 57rpx;
|
padding: 10rpx 0 10rpx 0;
|
background: #979797;
|
color: #ffffff;
|
border-radius: 11rpx;
|
}
|
|
.ok {
|
background: #016DCC;
|
}
|
.pop_close {
|
position: absolute;
|
right: 10rpx;
|
top: 10rpx;
|
width: 90rpx;
|
height: 90rpx;
|
background: url("https://ossacmall.bluedeer.com.cn/app/static/images/pop_close.png") center center/30rpx auto no-repeat;
|
}
|
}
|
|
</style>
|
