You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 

135 lines
2.4 KiB

<!-- 弹窗组件 -->
<template>
<view v-if="show" class="popup-windown bx popup-bx">
<div class="popup-content">
<uni-icons @click="close" class="popup-close" type="closeempty" size="20" color="#000"></uni-icons>
<view class="popup-main">
<div class="bg">
<image src="../../static/popUpWindow/bg.png" mode="widthFix"></image>
</div>
<view class="popup-desc">
{{ tip[type[$i18n.locale]] }}
</view>
<view class="popup-btn">
<view @click="close" class="">ok</view>
</view>
</view>
</div>
</view>
</template>
<script>
export default {
data() {
return {
tip: {}, //弹窗提示内容
type: {
en: 'keyEnglish',
es: "keySpanish",
zh: "keyChinese",
ar : "keyA",
fr : "keyF",
ru : "keyE"
},
}
},
created() {
this.getIndexTip()
},
props: {
show: {
type: Boolean,
default: false
}
},
methods: {
//关闭
close() {
uni.setStorageSync('clickPopUp', {}); //用户是否点击过关闭弹框
this.$emit('close')
},
//获取首页提示
getIndexTip() {
this.request('getIndexTip').then(res => {
if (res.code == 200) {
this.tip = res.result
}
})
}
}
}
</script>
<style lang="scss" scoped>
.popup-windown {
display: flex;
justify-content: center;
align-items: center;
position: fixed;
height: 100vh;
width: 750rpx;
background: rgba(0, 0, 0, .1);
left: 0;
top: 0;
z-index: 1000;
margin: 0rpx auto;
.popup-content {
position: relative;
width: 96%;
margin: 0rpx auto;
background: white;
border-radius: 15rpx;
.popup-close {
position: absolute;
right: -20rpx;
top: -20rpx;
z-index: 200;
background: white;
border-radius: 50%;
}
.popup-main {
border-radius: 15rpx;
overflow: hidden;
.bg {
height: 200rpx;
overflow: hidden;
image {
width: 100%;
}
}
.popup-desc {
box-sizing: border-box;
padding: 20rpx;
}
.popup-btn {
display: flex;
align-items: center;
justify-content: center;
height: 140rpx;
box-shadow: 0rpx 10rpx 20rpx rgba(0, 0, 0, .1);
view {
display: flex;
align-items: center;
justify-content: center;
width: 96%;
margin: 0rpx auto;
height: 80rpx;
background: $uni-bg-color-app;
border-radius: 40rpx;
color: $uni-bg-color;
}
}
}
}
}
</style>