登录弹窗
This commit is contained in:
parent
ddb5369a26
commit
f0286d54cb
|
|
@ -1,369 +1,378 @@
|
|||
<template>
|
||||
<view>
|
||||
<u-toast ref="uToast" />
|
||||
<u-popup class="coreshop-bottom-popup-box" v-if="showLogin" v-model="showLogin" mode="center">
|
||||
<view class="radius coreshop-bg-white" @tap.stop style="background: none;overflow: visible;">
|
||||
<view class="modal-box">
|
||||
<view class="detail">
|
||||
<view class="shopDesc">
|
||||
<view class="coreshop-avatar sm round margin-left">
|
||||
<u-image width="48rpx" height="48rpx" :src="shopLogo"></u-image>
|
||||
</view>
|
||||
<text class="shopName">
|
||||
{{ shopName || '用户登录' }}
|
||||
</text>
|
||||
</view>
|
||||
<view class="title3">请输入您的账号密码</view>
|
||||
<view>
|
||||
<u-toast ref="uToast" />
|
||||
<u-popup class="coreshop-bottom-popup-box" v-if="showLogin" v-model="showLogin" mode="center">
|
||||
<view class="radius coreshop-bg-white" @tap.stop style="background: none;overflow: visible;">
|
||||
<view class="modal-box">
|
||||
<view class="detail">
|
||||
<view class="shopDesc">
|
||||
<view class="coreshop-avatar sm round margin-left">
|
||||
<u-image width="48rpx" height="48rpx" :src="shopLogo"></u-image>
|
||||
</view>
|
||||
<text class="shopName">
|
||||
用户登录
|
||||
</text>
|
||||
</view>
|
||||
<view class="title3">请输入您的账号密码</view>
|
||||
|
||||
<!-- 登录表单 -->
|
||||
<view class="login-form">
|
||||
<view class="form-item">
|
||||
<u-input v-model="loginForm.mobile" placeholder="请输入手机号" type="number" maxlength="11"
|
||||
:clearable="true" @input="onInputChange" />
|
||||
</view>
|
||||
<view class="form-item">
|
||||
<u-input v-model="loginForm.password" placeholder="请输入密码" type="password"
|
||||
:clearable="true" @input="onInputChange" />
|
||||
</view>
|
||||
</view>
|
||||
<!-- 登录表单 -->
|
||||
<view class="login-form">
|
||||
<view class="form-item">
|
||||
<u-input v-model="loginForm.mobile" placeholder="请输入手机号" type="number" maxlength="11"
|
||||
:clearable="true" @input="onInputChange" />
|
||||
</view>
|
||||
<view class="form-item">
|
||||
<u-input v-model="loginForm.password" placeholder="请输入密码" type="password"
|
||||
:clearable="true" @input="onInputChange" />
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!--服务协议-->
|
||||
<view class="u-margin-top-30 u-margin-bottom-30 agreement-checked-view">
|
||||
<u-checkbox v-model="agreement" @change="checkboxChange" size="30"
|
||||
active-color="#19be6b"></u-checkbox>
|
||||
<view class="coreshop-text-black-view">
|
||||
<text class="coreshop-text-black">同意</text>
|
||||
<text class="text-blue" @tap="goUserAgreementPage">《服务协议》</text>
|
||||
<text class="coreshop-text-black">与</text>
|
||||
<text class="text-blue" @tap="goUserPrivacyPolicy">《隐私协议》</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="u-flex u-row-between u-padding-left-30 u-padding-right-30">
|
||||
<u-button @click="closeAuth">取消</u-button>
|
||||
<u-button type="success" :disabled="isDisabled" @click="handleLogin"
|
||||
v-if="isDisabled">登录</u-button>
|
||||
<u-button type="success" @click="handleLogin" v-else>登录</u-button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</u-popup>
|
||||
</view>
|
||||
<!--服务协议-->
|
||||
<view class="u-margin-top-30 u-margin-bottom-30 agreement-checked-view">
|
||||
<u-checkbox v-model="agreement" @change="checkboxChange" size="30"
|
||||
active-color="#19be6b"></u-checkbox>
|
||||
<view class="coreshop-text-black-view">
|
||||
<text class="coreshop-text-black">同意</text>
|
||||
<text class="text-blue" @tap="goUserAgreementPage">《服务协议》</text>
|
||||
<text class="coreshop-text-black">与</text>
|
||||
<text class="text-blue" @tap="goUserPrivacyPolicy">《隐私协议》</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="u-flex u-row-between u-padding-left-30 u-padding-right-30">
|
||||
<u-button @click="closeAuth">取消</u-button>
|
||||
<u-button type="success" :disabled="isDisabled" @click="handleLogin"
|
||||
v-if="isDisabled">登录</u-button>
|
||||
<u-button type="success" @click="handleLogin" v-else>登录</u-button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</u-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
/**
|
||||
* 登录提示页
|
||||
* @property {Boolean} value=showLoginTip - 由v-model控制显示隐藏。
|
||||
* @property {Boolean} forceOauth - 小程序端特制的全屏登录提示。
|
||||
*/
|
||||
import { mapMutations, mapActions, mapState } from 'vuex';
|
||||
import { goods, articles, commonUse, tools } from '@/common/mixins/mixinsHelper.js'
|
||||
export default {
|
||||
mixins: [goods, articles, commonUse, tools],
|
||||
name: 'coreshopLoginModal',
|
||||
components: {},
|
||||
data() {
|
||||
return {
|
||||
agreement: false,
|
||||
isDisabled: true,
|
||||
loginForm: {
|
||||
mobile: '',
|
||||
password: ''
|
||||
}
|
||||
};
|
||||
},
|
||||
props: {
|
||||
value: {},
|
||||
modalType: {
|
||||
type: String,
|
||||
default: ''
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapState({
|
||||
showLoginTip: state => state.showLoginTip,
|
||||
sessionAuthId: state => state.sessionAuthId,
|
||||
hasLogin: state => state.hasLogin,
|
||||
}),
|
||||
shopLogo() {
|
||||
return this.$store.state.config.shopLogo
|
||||
},
|
||||
shopName() {
|
||||
return this.$store.state.config.shopName;
|
||||
},
|
||||
showLogin: {
|
||||
get() {
|
||||
return this.showLoginTip;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit('showLoginTip', val);
|
||||
}
|
||||
},
|
||||
sessionAuthIdTool: {
|
||||
get() {
|
||||
return this.sessionAuthId;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit('sessionAuthId', val);
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
// 初始化时清空表单
|
||||
this.loginForm = {
|
||||
mobile: '',
|
||||
password: ''
|
||||
};
|
||||
},
|
||||
//watch: {
|
||||
// 'hasLogin': {
|
||||
// handler(newVal) {
|
||||
// console.log(newVal);
|
||||
// if (newVal == false) {
|
||||
// console.log("watch监听");
|
||||
// this.doToken();
|
||||
// }
|
||||
// },
|
||||
// deep: true,
|
||||
// immediate: true,
|
||||
// }
|
||||
//},
|
||||
methods: {
|
||||
doToken() {
|
||||
const _this = this
|
||||
console.log("重新获取用户数据");
|
||||
_this.getCode(function (code) {
|
||||
var data = {
|
||||
code: code
|
||||
}
|
||||
_this.$u.api.onLogin(data).then(res => {
|
||||
if (res.status) {
|
||||
if (res.data.auth) {
|
||||
_this.$db.set('userToken', res.data.auth.token)
|
||||
_this.$store.commit('hasLogin', true);
|
||||
}
|
||||
if (res.data.user) {
|
||||
_this.$store.commit('userInfo', res.data.user);
|
||||
}
|
||||
_this.sessionAuthIdTool = res.otherData;
|
||||
console.log("成功后获取sessionAuthIdTool：" + _this.sessionAuthIdTool);
|
||||
} else {
|
||||
_this.sessionAuthIdTool = res.otherData;
|
||||
console.log("失败后获取sessionAuthIdTool：" + _this.sessionAuthIdTool);
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
// 勾选版权协议
|
||||
checkboxChange(e) {
|
||||
this.agreement = e.value;
|
||||
this.checkFormValid();
|
||||
},
|
||||
|
||||
// 输入框内容变化时触发
|
||||
onInputChange() {
|
||||
this.checkFormValid();
|
||||
},
|
||||
/**
|
||||
* 登录提示页
|
||||
* @property {Boolean} value=showLoginTip - 由v-model控制显示隐藏。
|
||||
* @property {Boolean} forceOauth - 小程序端特制的全屏登录提示。
|
||||
*/
|
||||
import {
|
||||
mapMutations,
|
||||
mapActions,
|
||||
mapState
|
||||
} from 'vuex';
|
||||
import {
|
||||
goods,
|
||||
articles,
|
||||
commonUse,
|
||||
tools
|
||||
} from '@/common/mixins/mixinsHelper.js'
|
||||
export default {
|
||||
mixins: [goods, articles, commonUse, tools],
|
||||
name: 'coreshopLoginModal',
|
||||
components: {},
|
||||
data() {
|
||||
return {
|
||||
agreement: false,
|
||||
isDisabled: true,
|
||||
loginForm: {
|
||||
mobile: '',
|
||||
password: ''
|
||||
}
|
||||
};
|
||||
},
|
||||
props: {
|
||||
value: {},
|
||||
modalType: {
|
||||
type: String,
|
||||
default: ''
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapState({
|
||||
showLoginTip: state => state.showLoginTip,
|
||||
sessionAuthId: state => state.sessionAuthId,
|
||||
hasLogin: state => state.hasLogin,
|
||||
}),
|
||||
shopLogo() {
|
||||
return this.$store.state.config.shopLogo
|
||||
},
|
||||
shopName() {
|
||||
return this.$store.state.config.shopName;
|
||||
},
|
||||
showLogin: {
|
||||
get() {
|
||||
return this.showLoginTip;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit('showLoginTip', val);
|
||||
}
|
||||
},
|
||||
sessionAuthIdTool: {
|
||||
get() {
|
||||
return this.sessionAuthId;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit('sessionAuthId', val);
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
// 初始化时清空表单
|
||||
this.loginForm = {
|
||||
mobile: '',
|
||||
password: ''
|
||||
};
|
||||
},
|
||||
//watch: {
|
||||
// 'hasLogin': {
|
||||
// handler(newVal) {
|
||||
// console.log(newVal);
|
||||
// if (newVal == false) {
|
||||
// console.log("watch监听");
|
||||
// this.doToken();
|
||||
// }
|
||||
// },
|
||||
// deep: true,
|
||||
// immediate: true,
|
||||
// }
|
||||
//},
|
||||
methods: {
|
||||
doToken() {
|
||||
const _this = this
|
||||
console.log("重新获取用户数据");
|
||||
_this.getCode(function(code) {
|
||||
var data = {
|
||||
code: code
|
||||
}
|
||||
_this.$u.api.onLogin(data).then(res => {
|
||||
if (res.status) {
|
||||
if (res.data.auth) {
|
||||
_this.$db.set('userToken', res.data.auth.token)
|
||||
_this.$store.commit('hasLogin', true);
|
||||
}
|
||||
if (res.data.user) {
|
||||
_this.$store.commit('userInfo', res.data.user);
|
||||
}
|
||||
_this.sessionAuthIdTool = res.otherData;
|
||||
console.log("成功后获取sessionAuthIdTool：" + _this.sessionAuthIdTool);
|
||||
} else {
|
||||
_this.sessionAuthIdTool = res.otherData;
|
||||
console.log("失败后获取sessionAuthIdTool：" + _this.sessionAuthIdTool);
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
// 勾选版权协议
|
||||
checkboxChange(e) {
|
||||
this.agreement = e.value;
|
||||
this.checkFormValid();
|
||||
},
|
||||
|
||||
// 检查表单是否有效
|
||||
checkFormValid() {
|
||||
const isValid = this.agreement &&
|
||||
this.loginForm.mobile.length === 11 &&
|
||||
this.loginForm.password.length >= 6;
|
||||
this.isDisabled = !isValid;
|
||||
return isValid;
|
||||
},
|
||||
// 隐藏登录弹窗
|
||||
hideModal() {
|
||||
this.showLogin = false;
|
||||
},
|
||||
// 取消登录
|
||||
closeAuth() {
|
||||
this.showLogin = false;
|
||||
this.resetForm();
|
||||
},
|
||||
// 输入框内容变化时触发
|
||||
onInputChange() {
|
||||
this.checkFormValid();
|
||||
},
|
||||
|
||||
// 重置表单
|
||||
resetForm() {
|
||||
this.loginForm = {
|
||||
mobile: '',
|
||||
password: ''
|
||||
};
|
||||
this.agreement = false;
|
||||
this.isDisabled = true;
|
||||
},
|
||||
// 检查表单是否有效
|
||||
checkFormValid() {
|
||||
const isValid = this.agreement &&
|
||||
this.loginForm.mobile.length === 11 &&
|
||||
this.loginForm.password.length >= 6;
|
||||
this.isDisabled = !isValid;
|
||||
return isValid;
|
||||
},
|
||||
// 隐藏登录弹窗
|
||||
hideModal() {
|
||||
this.showLogin = false;
|
||||
},
|
||||
// 取消登录
|
||||
closeAuth() {
|
||||
this.showLogin = false;
|
||||
this.resetForm();
|
||||
},
|
||||
|
||||
// 处理登录
|
||||
handleLogin() {
|
||||
if (!this.checkFormValid()) {
|
||||
this.$u.toast('请完善登录信息');
|
||||
return;
|
||||
}
|
||||
// 重置表单
|
||||
resetForm() {
|
||||
this.loginForm = {
|
||||
mobile: '',
|
||||
password: ''
|
||||
};
|
||||
this.agreement = false;
|
||||
this.isDisabled = true;
|
||||
},
|
||||
|
||||
// 验证手机号格式
|
||||
const mobileReg = /^1[3-9]\d{9}$/;
|
||||
if (!mobileReg.test(this.loginForm.mobile)) {
|
||||
this.$u.toast('请输入正确的手机号');
|
||||
return;
|
||||
}
|
||||
// 处理登录
|
||||
handleLogin() {
|
||||
if (!this.checkFormValid()) {
|
||||
this.$u.toast('请完善登录信息');
|
||||
return;
|
||||
}
|
||||
|
||||
this.doPasswordLogin();
|
||||
},
|
||||
// 密码登录
|
||||
doPasswordLogin() {
|
||||
const _this = this;
|
||||
const data = {
|
||||
mobile: this.loginForm.mobile,
|
||||
password: this.loginForm.password
|
||||
};
|
||||
// 验证手机号格式
|
||||
const mobileReg = /^1[3-9]\d{9}$/;
|
||||
if (!mobileReg.test(this.loginForm.mobile)) {
|
||||
this.$u.toast('请输入正确的手机号');
|
||||
return;
|
||||
}
|
||||
|
||||
// // 显示加载状态
|
||||
// this.$u.loading.show({
|
||||
// title: '登录中...'
|
||||
// });
|
||||
this.doPasswordLogin();
|
||||
},
|
||||
// 密码登录
|
||||
doPasswordLogin() {
|
||||
const _this = this;
|
||||
const data = {
|
||||
mobile: this.loginForm.mobile,
|
||||
password: this.loginForm.password
|
||||
};
|
||||
|
||||
this.$u.api.loginByPassword(data).then(res => {
|
||||
// this.$u.loading.hide();
|
||||
console.log('登录结果:', res);
|
||||
// // 显示加载状态
|
||||
// this.$u.loading.show({
|
||||
// title: '登录中...'
|
||||
// });
|
||||
|
||||
if (res.status) {
|
||||
if (res.data && res.data.token) {
|
||||
// 登录成功，保存token和用户信息
|
||||
_this.$db.set('userToken', res.data.token);
|
||||
_this.$store.commit('hasLogin', true);
|
||||
this.$u.api.loginByPassword(data).then(res => {
|
||||
// this.$u.loading.hide();
|
||||
console.log('登录结果:', res);
|
||||
|
||||
if (res.data.user) {
|
||||
_this.$store.commit('userInfo', res.data.user);
|
||||
}
|
||||
if (res.status) {
|
||||
if (res.data && res.data.token) {
|
||||
// 登录成功，保存token和用户信息
|
||||
_this.$db.set('userToken', res.data.token);
|
||||
_this.$store.commit('hasLogin', true);
|
||||
|
||||
_this.showLogin = false;
|
||||
_this.resetForm();
|
||||
_this.$refs.uToast.show({
|
||||
title: '登录成功',
|
||||
type: 'success'
|
||||
});
|
||||
} else {
|
||||
_this.$u.toast('登录失败，请检查账号密码');
|
||||
}
|
||||
} else {
|
||||
_this.$u.toast(res.msg || '登录失败，请重试');
|
||||
}
|
||||
}).catch(err => {
|
||||
this.$u.loading.hide();
|
||||
console.error('登录错误:', err);
|
||||
_this.$u.toast('网络错误，请重试');
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
if (res.data.user) {
|
||||
_this.$store.commit('userInfo', res.data.user);
|
||||
}
|
||||
|
||||
_this.showLogin = false;
|
||||
_this.resetForm();
|
||||
_this.$refs.uToast.show({
|
||||
title: '登录成功',
|
||||
type: 'success'
|
||||
});
|
||||
} else {
|
||||
_this.$u.toast('登录失败，请检查账号密码');
|
||||
}
|
||||
} else {
|
||||
_this.$u.toast(res.msg || '登录失败，请重试');
|
||||
}
|
||||
}).catch(err => {
|
||||
this.$u.loading.hide();
|
||||
console.error('登录错误:', err);
|
||||
_this.$u.toast('网络错误，请重试');
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.modal-box {
|
||||
width: 610rpx;
|
||||
border-radius: 20rpx;
|
||||
background: #fff;
|
||||
position: relative;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
padding: 30rpx;
|
||||
z-index: 11111;
|
||||
.modal-box {
|
||||
width: 610rpx;
|
||||
border-radius: 20rpx;
|
||||
background: #fff;
|
||||
position: relative;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
padding: 30rpx;
|
||||
z-index: 11111;
|
||||
|
||||
.head-bg {
|
||||
width: 100%;
|
||||
height: 210rpx;
|
||||
}
|
||||
.head-bg {
|
||||
width: 100%;
|
||||
height: 210rpx;
|
||||
}
|
||||
|
||||
.detail {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
.detail {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
|
||||
.title1 {
|
||||
color: #46351b;
|
||||
font-size: 35rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
.title1 {
|
||||
color: #46351b;
|
||||
font-size: 35rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.title2 {
|
||||
font-size: 28rpx;
|
||||
color: #999;
|
||||
padding-top: 20rpx;
|
||||
}
|
||||
.title2 {
|
||||
font-size: 28rpx;
|
||||
color: #999;
|
||||
padding-top: 20rpx;
|
||||
}
|
||||
|
||||
.title3 {
|
||||
color: #46351b;
|
||||
font-size: 35rpx;
|
||||
font-weight: bold;
|
||||
text-align: left;
|
||||
line-height: 35rpx;
|
||||
padding: 30rpx 0 30rpx 30rpx;
|
||||
}
|
||||
.title3 {
|
||||
color: #46351b;
|
||||
font-size: 35rpx;
|
||||
font-weight: bold;
|
||||
text-align: left;
|
||||
line-height: 35rpx;
|
||||
padding: 30rpx 0 30rpx 30rpx;
|
||||
}
|
||||
|
||||
.desc {
|
||||
font-size: 24rpx;
|
||||
line-height: 40rpx;
|
||||
color: #333;
|
||||
background: #f7f8fa;
|
||||
text-align: left;
|
||||
padding: 20rpx;
|
||||
}
|
||||
.desc {
|
||||
font-size: 24rpx;
|
||||
line-height: 40rpx;
|
||||
color: #333;
|
||||
background: #f7f8fa;
|
||||
text-align: left;
|
||||
padding: 20rpx;
|
||||
}
|
||||
|
||||
.user-avatar {
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
overflow: hidden;
|
||||
margin: 0 auto;
|
||||
margin-bottom: 40rpx;
|
||||
}
|
||||
.user-avatar {
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
overflow: hidden;
|
||||
margin: 0 auto;
|
||||
margin-bottom: 40rpx;
|
||||
}
|
||||
|
||||
.user-name {
|
||||
font-size: 35rpx;
|
||||
font-family: PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #845708;
|
||||
margin-bottom: 30rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
.user-name {
|
||||
font-size: 35rpx;
|
||||
font-family: PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #845708;
|
||||
margin-bottom: 30rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.shopDesc {
|
||||
padding: 30rpx 0rpx 0rpx 0rpx;
|
||||
text-align: left;
|
||||
.shopDesc {
|
||||
padding: 30rpx 0rpx 0rpx 0rpx;
|
||||
text-align: left;
|
||||
|
||||
.shopName {
|
||||
margin-left: 20rpx;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
.shopName {
|
||||
margin-left: 20rpx;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
|
||||
.get {
|
||||
margin-left: 20rpx;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
}
|
||||
.get {
|
||||
margin-left: 20rpx;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.agreement-checked-view {
|
||||
position: relative;
|
||||
padding: 18.18rpx 0rpx 18.18rpx 30rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin: 10rpx 0;
|
||||
font-size: 24rpx;
|
||||
.agreement-checked-view {
|
||||
position: relative;
|
||||
padding: 18.18rpx 0rpx 18.18rpx 30rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin: 10rpx 0;
|
||||
font-size: 24rpx;
|
||||
|
||||
.coreshop-checked {
|
||||
transform: scale(0.7);
|
||||
}
|
||||
}
|
||||
.coreshop-checked {
|
||||
transform: scale(0.7);
|
||||
}
|
||||
}
|
||||
|
||||
.login-form {
|
||||
padding: 20rpx 30rpx;
|
||||
.login-form {
|
||||
padding: 20rpx 30rpx;
|
||||
|
||||
.form-item {
|
||||
margin-bottom: 30rpx;
|
||||
.form-item {
|
||||
margin-bottom: 30rpx;
|
||||
|
||||
&:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
&:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue
Block a user