856 lines
21 KiB
Vue
856 lines
21 KiB
Vue
<template>
|
||
<view v-show="showPage">
|
||
<tabBar :currentPage="'pages/mine/index'"></tabBar>
|
||
<view class="logo">
|
||
<image src="../../static/image/home/fontree.png" mode="" class="img"></image>
|
||
</view>
|
||
<scroll-view scroll-y :scroll-anchoring="true" :style="'height:' + listHeight + 'px;'">
|
||
|
||
<view class="user-box">
|
||
<u-avatar :src="userInfo.avatar" class="avatar" size="75" fontSize="18" bg-color="#558BF2"></u-avatar>
|
||
<view class="info">
|
||
<view class="username">{{ userInfo.nickName }}</view>
|
||
<view class="blockchain">{{ $t("mine.blockchain") }}：{{ userInfo.account }}</view>
|
||
</view>
|
||
</view>
|
||
<view class="mine-icon">
|
||
<view class="message" @click="goMess">
|
||
<u-badge v-if="notReadNum > 0" class="point" numberType="overflow" max="99" :value="notReadNum">
|
||
</u-badge>
|
||
<image src="../../static/image/mine/message-icon.png" mode="" style="width: 60rpx; height: 60rpx">
|
||
</image>
|
||
<view class="value">{{ $t("mine.message") }}</view>
|
||
</view>
|
||
<view class="scan" @click="goScan" v-if="canScan">
|
||
<image src="../../static/image/mine/scan-icon.png" mode="" style="width: 60rpx; height: 60rpx"></image>
|
||
<view class="value">{{ $t("mine.scan") }}</view>
|
||
</view>
|
||
<view @click="goLang" class="tag">
|
||
<image src="../../static/image/mine/language.png" mode="" style="width: 60rpx; height: 60rpx"></image>
|
||
<view class="value">{{ $t("mine.language") }}</view>
|
||
</view>
|
||
<view class="setting" @click="goSets">
|
||
<image src="../../static/image/mine/setting-icon.png" mode="" style="width: 60rpx; height: 60rpx">
|
||
</image>
|
||
<view class="value">{{ $t("mine.setting") }}</view>
|
||
</view>
|
||
</view>
|
||
<view class="his-title-text">
|
||
<view>我的历史购买记录</view>
|
||
<view class="line"></view>
|
||
</view>
|
||
<view class="his-box">
|
||
<view class="item" v-for="(item, index) in paymentList" :key="index"
|
||
@click="goDetail(item.ID, item.artworkUid)">
|
||
<image src="../../static/image/mine/icon-logo1.png" v-if="item.artworkLevel == 'D'" mode=""
|
||
class="icon"></image>
|
||
<image src="../../static/image/mine/icon-logo2.png" v-if="item.artworkLevel == 'C'" mode=""
|
||
class="icon"></image>
|
||
<image src="../../static/image/mine/icon-logo3.png" v-if="item.artworkLevel == 'B'" mode=""
|
||
class="icon"></image>
|
||
<image src="../../static/image/mine/icon-logo4.png" v-if="item.artworkLevel == 'A'" mode=""
|
||
class="icon"></image>
|
||
<image :src="item.coverImg || item.artworkImg" mode="" class="img"> </image>
|
||
<view class="contentD content" v-if="item.artworkLevel == 'D'">{{
|
||
item.artworkName
|
||
}}</view>
|
||
<view class="contentC content" v-if="item.artworkLevel == 'C'">{{
|
||
item.artworkName
|
||
}}</view>
|
||
<view class="contentB content" v-if="item.artworkLevel == 'B'">{{
|
||
item.artworkName
|
||
}}</view>
|
||
<view class="contentA content" v-if="item.artworkLevel == 'A'">{{
|
||
item.artworkName
|
||
}}</view>
|
||
</view>
|
||
</view>
|
||
<u-empty mode="favor" v-if="!paymentList" :text="$t('mine.noData')" marginTop="100"></u-empty>
|
||
</scroll-view>
|
||
<u-popup :show="showLocale" mode="center" @close="closeLocale" @open="openLocale" bgColor="transparent">
|
||
<view class="popupLocale-box">
|
||
<view class="title">{{ $t("mine.updateLang") }}</view>
|
||
<view class="item" v-for="(item, index) in locales" :key="index"
|
||
:style="{ borderBottom: (item.code !== 'en' ? '1px solid #dedede' : 'none') }">
|
||
<view class="left">{{ item.text }}</view>
|
||
<view class="right">
|
||
<text v-if="item.code == applicationLocale">{{
|
||
$t("updateLang.done")
|
||
}}</text>
|
||
<u-tag v-else :text="$t('updateLang.change')" @click="onLocaleChange(item)" class="tag-btn"
|
||
shape="circle" bgColor="#699A70" borderColor="#699A70"></u-tag>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<u-button :text="$t('navbar.back')" color="#EDC466" @click="closeLocale" style="
|
||
width: 260rpx;
|
||
height: 56rpx;
|
||
border-radius: 40rpx;
|
||
margin-top: 30rpx;
|
||
"></u-button>
|
||
</u-popup>
|
||
<u-popup :show="showSetPass" mode="bottom" @close="closeBack" bgColor="transparent">
|
||
<view class="step-top">{{ $t("password.title") }}</view>
|
||
<view class="step-box">
|
||
<view class="title">{{ $t("password.set") }}</view>
|
||
<view class="step-pl">
|
||
{{ $t("password.name") }}
|
||
<text>{{ userInfo.telNum | disposeTel }}</text>
|
||
{{ $t("password.set") }}
|
||
</view>
|
||
<view class="verfy-box">
|
||
<view>
|
||
<view class="label">{{ $t("password.input") }}：</view>
|
||
<u-code-input v-model="setPwd" dot :maxlength="6" hairline color="#ffffff"
|
||
borderColor="transparent"></u-code-input>
|
||
</view>
|
||
</view>
|
||
<view class="verfy-box">
|
||
<view>
|
||
<view class="label">{{ $t("password.com") }}：</view>
|
||
<u-code-input v-model="confirmPwd" dot :maxlength="6" hairline color="#ffffff"
|
||
borderColor="transparent"></u-code-input>
|
||
</view>
|
||
</view>
|
||
<u-button :text="$t('password.step')" color="#699A70" @click="step2" style="
|
||
width: 484rpx;
|
||
height: 56rpx;
|
||
border-radius: 40rpx;
|
||
margin-top: 150rpx;
|
||
"></u-button>
|
||
</view>
|
||
</u-popup>
|
||
<u-popup :show="showVerfyPass" mode="bottom" @close="closeBack" bgColor="transparent">
|
||
<view class="step-top">{{ $t("password.title") }}</view>
|
||
<view class="step-box">
|
||
<view class="title">{{ $t("password.get") }}</view>
|
||
<view class="verfy-box">
|
||
<view>
|
||
<view class="label">{{ $t("password.input") }}：</view>
|
||
<u-code-input v-model="userPwd" dot :maxlength="6" hairline color="#ffffff"
|
||
borderColor="transparent"></u-code-input>
|
||
</view>
|
||
</view>
|
||
<view class="verfy-box" style="margin-top: 40upx">
|
||
<view>
|
||
<view class="label">{{ $t("password.com") }}：</view>
|
||
<u-code-input v-model="confirmUserPwd" dot :maxlength="6" hairline color="#ffffff"
|
||
borderColor="transparent"></u-code-input>
|
||
</view>
|
||
</view>
|
||
<u-button :text="$t('buyVerfy.done')" color="#699A70" @click="stepDone" style="
|
||
width: 484rpx;
|
||
height: 56rpx;
|
||
border-radius: 40rpx;
|
||
margin-top: 150rpx;
|
||
"></u-button>
|
||
</view>
|
||
</u-popup>
|
||
<u-popup :show="showAuthentication" mode="center" @close="closePass" bgColor="transparent">
|
||
<view class="pass-box">
|
||
<view class="title">{{ $t("password") }}</view>
|
||
<view class="verfy-box">
|
||
<view>
|
||
<view class="label" style="margin-top:30rpx">{{ $t("password.input") }}：</view>
|
||
<u-code-input v-model="userPwd" dot :maxlength="6" hairline color="#ffffff"
|
||
borderColor="transparent"></u-code-input>
|
||
</view>
|
||
</view>
|
||
<view class="flex-end">
|
||
{{ $t("password.vername") }}
|
||
<text>{{ userInfo.telNum | disposeTel }}</text>
|
||
{{ $t("password.username") }}
|
||
</view>
|
||
<u-button :text="$t('comfrim')" color="#699A70" @click="comPass" style="
|
||
width: 484rpx;
|
||
height: 56rpx;
|
||
border-radius: 40rpx;
|
||
margin-top:30rpx;
|
||
"></u-button>
|
||
<u-button :text="$t('payment.back')" color="#EDC466" @click="closePass" style="
|
||
width: 484rpx;
|
||
height: 56rpx;
|
||
border-radius: 40rpx;
|
||
margin-top: 30rpx;
|
||
"></u-button>
|
||
</view>
|
||
</u-popup>
|
||
<!-- 邀请码弹窗 -->
|
||
<u-popup :show="showInvite" mode="center" @close="closeInvite" bgColor="transparent">
|
||
<view class="invite-box">
|
||
<view style="margin-bottom: 20upx">{{ $t("payInfo.copyCode") }}</view>
|
||
<u-input v-model="codeSC" shape="circle" border="none" class="login-input"></u-input>
|
||
<u-button :text="$t('comfrim')" color="#558BF2" @click="sendConfirm" style="
|
||
width: 484rpx;
|
||
height: 56rpx;
|
||
border-radius: 40rpx;
|
||
margin-top: 20rpx;
|
||
"></u-button>
|
||
<u-button :text="$t('close')" color="rgb(224,119,115)" @click="closeInvite" style="
|
||
width: 484rpx;
|
||
height: 56rpx;
|
||
border-radius: 40rpx;
|
||
margin-top: 20rpx;
|
||
"></u-button>
|
||
</view>
|
||
</u-popup>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
data() {
|
||
return {
|
||
src: "",
|
||
showLocale: false,
|
||
applicationLocale: "",
|
||
userInfo: {},
|
||
showSetPass: false,
|
||
showVerfyPass: false,
|
||
showAuthentication: false,
|
||
setPwd: "",
|
||
confirmPwd: "",
|
||
userPwd: "",
|
||
confirmUserPwd: "",
|
||
paymentList: [],
|
||
notReadNum: 0,
|
||
showPage: false,
|
||
isAndroid: false,
|
||
canScan: false,
|
||
showInvite: false,
|
||
codeSC: "",
|
||
showPull: false,
|
||
listHeight: uni.getSystemInfoSync().windowHeight - 88 - 61,
|
||
};
|
||
},
|
||
computed: {
|
||
locales() {
|
||
return [
|
||
// {
|
||
// text: this.$t("locale.auto"),
|
||
// code: "auto",
|
||
// },
|
||
{
|
||
text: this.$t("locale.zh-hans"),
|
||
code: "zh-Hans",
|
||
},
|
||
{
|
||
text: this.$t("locale.zh-hant"),
|
||
code: "zh-Hant",
|
||
},
|
||
{
|
||
text: this.$t("locale.en"),
|
||
code: "en",
|
||
},
|
||
];
|
||
},
|
||
},
|
||
filters: {
|
||
disposeTel(phoneNum) {
|
||
return Number(phoneNum).toString().slice(0, 3) + '****' + Number(phoneNum).toString().slice(-4);
|
||
}
|
||
},
|
||
methods: {
|
||
|
||
toJSON() { },
|
||
|
||
goLang() {
|
||
this.showLocale = true;
|
||
},
|
||
closeLocale() {
|
||
this.showLocale = false;
|
||
},
|
||
closeInvite() {
|
||
this.showInvite = false;
|
||
this.codeSC = "";
|
||
},
|
||
openLocale() {
|
||
// console.log(uni.getLocale());
|
||
let systemInfo = uni.getSystemInfoSync();
|
||
this.systemLocale = systemInfo.language;
|
||
this.applicationLocale = uni.getLocale();
|
||
this.isAndroid = systemInfo.platform.toLowerCase() === "android";
|
||
uni.onLocaleChange((e) => {
|
||
this.applicationLocale = e.locale;
|
||
});
|
||
},
|
||
onLocaleChange(e) {
|
||
// console.log(e)
|
||
if (this.isAndroid) {
|
||
uni.showModal({
|
||
content: this.$t("index.language-change-confirm"),
|
||
success: (res) => {
|
||
if (res.confirm) {
|
||
uni.setLocale(e.code);
|
||
}
|
||
},
|
||
});
|
||
} else {
|
||
uni.setLocale(e.code);
|
||
this.$i18n.locale = e.code;
|
||
}
|
||
// console.log(this.$refs.tabbarRef);
|
||
this.$refs.tabbarRef.tabBarList = [{
|
||
pagePath: "pages/index/index",
|
||
iconPath: "../../static/image/tabbar/home.png",
|
||
selectedIconPath: "../../static/image/tabbar/home_check.png",
|
||
text: this.$t("tabbar.home"),
|
||
customIcon: false,
|
||
},
|
||
{
|
||
pagePath: "pages/mine/index",
|
||
iconPath: "../../static/image/tabbar/mine.png",
|
||
selectedIconPath: "../../static/image/tabbar/mine_check.png",
|
||
text: this.$t("tabbar.mine"),
|
||
customIcon: false,
|
||
},
|
||
];
|
||
},
|
||
goDetail(ID, artworkUid) {
|
||
uni.navigateTo({
|
||
url: "/pages/mine/detail/detail?ID=" + ID + "&artworkUid=" + artworkUid,
|
||
});
|
||
},
|
||
goMess() {
|
||
uni.navigateTo({
|
||
url: "/pages/mine/notice/notice",
|
||
});
|
||
},
|
||
goSets() {
|
||
uni.navigateTo({
|
||
url: "/pages/mine/setting/setting",
|
||
});
|
||
},
|
||
// 唤起扫描二维码
|
||
goScan() {
|
||
this.showInvite = true;
|
||
// 判断当前页面是不是H5
|
||
// try {
|
||
// uni.scanCode({
|
||
// success: (res) => {
|
||
// if (res.result) {
|
||
// console.log(res.result, "res.result");
|
||
// uni.navigateTo({
|
||
// url: `/pages/mine/confirmOrder/confirmOrder?code=${res.result}`,
|
||
// });
|
||
// }
|
||
// },
|
||
// });
|
||
// } catch (error) {
|
||
// console.log(123123);
|
||
// }
|
||
},
|
||
sendConfirm() {
|
||
uni.navigateTo({
|
||
url: `/pages/mine/confirmOrder/confirmOrder?code=${this.codeSC}`,
|
||
});
|
||
this.closeInvite();
|
||
},
|
||
// 获取未读消息
|
||
async getNotReadMsg() {
|
||
let res = await this.$api.airdrop.checkPoint();
|
||
if (res.status === 0) {
|
||
this.notReadNum = res.data.Count;
|
||
}
|
||
},
|
||
// 设置密码
|
||
step2() {
|
||
if (!this.setPwd || !this.confirmPwd) {
|
||
this.$common.msgToast(this.$t("password.inputPass"), null, "error");
|
||
return;
|
||
}
|
||
if (this.setPwd !== this.confirmPwd) {
|
||
this.$common.msgToast(this.$t("password.messError"), null, "error");
|
||
return;
|
||
}
|
||
this.setPassword();
|
||
},
|
||
// 设置密码接口
|
||
async setPassword() {
|
||
let res = await this.$api.mine.update({
|
||
password: this.confirmPwd,
|
||
});
|
||
if (res.status === 0) {
|
||
uni.$u.toast(this.$t("password.setSucc"));
|
||
this.showSetPass = false;
|
||
this.showVerfyPass = true;
|
||
} else {
|
||
uni.$u.toast(res.msg || this.$t("password.setError"));
|
||
}
|
||
},
|
||
// 验证密码接口
|
||
async verifyPwd(setFlag) {
|
||
let res = await this.$api.mine.verifyPwd({
|
||
password: this.userPwd,
|
||
});
|
||
if (res.status === 0) {
|
||
uni.$u.toast(this.$t("password.verSucc"));
|
||
this.showVerfyPass = false;
|
||
this.showAuthentication = false;
|
||
// 如果有setFlag 说明是验证操作密码,在localStorage中存储一个标识
|
||
if (setFlag) {
|
||
uni.setStorageSync("isSetPass", 1);
|
||
}
|
||
} else {
|
||
uni.$u.toast(res.msg || this.$t("password.verError"));
|
||
}
|
||
},
|
||
// 第一次验证操作密码
|
||
async stepDone() {
|
||
if (!this.userPwd || !this.confirmUserPwd) {
|
||
this.$common.msgToast(this.$t("password.inputPass"), null, "error");
|
||
return;
|
||
}
|
||
if (this.userPwd !== this.confirmUserPwd) {
|
||
this.$common.msgToast(this.$t("password.messError"), null, "error");
|
||
return;
|
||
}
|
||
await this.verifyPwd();
|
||
this.showVerfyPass = false;
|
||
},
|
||
// 验证操作密码
|
||
async comPass() {
|
||
let vef = this.$common.vefEmpty(
|
||
this.userPwd,
|
||
this.$t("password.inputPass")
|
||
);
|
||
if (!vef) return;
|
||
await this.verifyPwd(true);
|
||
this.userPwd = "";
|
||
//
|
||
},
|
||
// 返回
|
||
closePass() {
|
||
this.showAuthentication = false;
|
||
uni.switchTab({
|
||
url: "/pages/index/index",
|
||
});
|
||
},
|
||
// 返回主页
|
||
closeBack() {
|
||
this.showSetPass = false;
|
||
this.showVerfyPass = false;
|
||
uni.switchTab({
|
||
url: "/pages/index/index",
|
||
});
|
||
},
|
||
// 获取信息
|
||
async getInfo() {
|
||
uni.showLoading();
|
||
await this.$api.mine
|
||
.getInfo()
|
||
.then(async (res) => {
|
||
if (res.status === 0) {
|
||
this.userInfo = res.data;
|
||
this.showPage = true;
|
||
await this.getPaymentInfo();
|
||
await this.getNotReadMsg();
|
||
} else if (res.status === 401) {
|
||
uni.navigateTo({
|
||
url: "/pages/login/login",
|
||
});
|
||
uni.clearStorageSync();
|
||
} else {
|
||
this.$common.msgToast(res.msg, null, "error");
|
||
}
|
||
})
|
||
.catch((err) => {
|
||
uni.showToast({
|
||
title: this.$t("load.failed"),
|
||
icon: "none"
|
||
});
|
||
});
|
||
uni.hideLoading();
|
||
/* let res = await this.$api.mine.getInfo();
|
||
if (res.status === 0) {
|
||
this.userInfo = res.data;
|
||
} else {
|
||
this.$common.msgToast(res.msg , null, "error");
|
||
} */
|
||
},
|
||
// 获取藏品
|
||
async getPaymentInfo() {
|
||
let res = await this.$api.mine.paymentList();
|
||
console.log(1111, res)
|
||
if (res.status === 0) {
|
||
this.paymentList = res.data.data;
|
||
} else {
|
||
this.$common.msgToast(res.msg || this.$t("load.failed"), null, "error");
|
||
}
|
||
},
|
||
},
|
||
async onShow() {
|
||
this.showPage = false;
|
||
await this.getInfo();
|
||
this.canScan = uni.getStorageSync("mall-user-info")?.canScan;
|
||
|
||
// 判断是否是第一次设置
|
||
if (this.userInfo.isNeedChange === 1) {
|
||
this.showSetPass = true;
|
||
} else {
|
||
this.userPwd = "";
|
||
// 如果localStorage中有isSetPass 说明已经设置过操作密码,不需要再次验证
|
||
this.showAuthentication = uni.getStorageSync("isSetPass") !== 1;
|
||
}
|
||
},
|
||
};
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
page {
|
||
background: url("@/static/image/home/mine-bg.png") no-repeat;
|
||
background-size: 100% 100%;
|
||
background-attachment: fixed;
|
||
height: 100vh;
|
||
box-sizing: border-box;
|
||
// border: 1px solid red;696.1123
|
||
}
|
||
.login-input {
|
||
height: 68upx;
|
||
background-color: rgba(255, 255, 255, 0.6);
|
||
padding: 0 20rpx;
|
||
|
||
/deep/ .uni-input-placeholder {
|
||
padding: 0 20rpx;
|
||
}
|
||
|
||
/deep/ .uni-input-input {
|
||
color: #E4E4E4;
|
||
padding: 0 20rpx;
|
||
}
|
||
}
|
||
|
||
|
||
.logo {
|
||
width: 100vw;
|
||
height: 122rpx;
|
||
background: #FFFFFF;
|
||
overflow: hidden;
|
||
|
||
.img {
|
||
width: 188rpx;
|
||
height: 56rpx;
|
||
margin-top: 36rpx;
|
||
margin-left: 48rpx;
|
||
}
|
||
}
|
||
|
||
.user-box {
|
||
background: #FFFFFF;
|
||
border-radius: 20rpx;
|
||
height: 210rpx;
|
||
margin: 20rpx 28rpx 20rpx 28rpx;
|
||
padding: 22rpx 20rpx;
|
||
display: flex;
|
||
box-sizing: border-box;
|
||
align-items: center;
|
||
|
||
.avatar {
|
||
margin-left: 50rpx;
|
||
}
|
||
|
||
.info {
|
||
flex: 1;
|
||
display: flex;
|
||
flex-direction: column;
|
||
margin-left: 10rpx;
|
||
|
||
.username {
|
||
width: 75%;
|
||
color: #000000;
|
||
font-size: 34rpx;
|
||
// 超出一行显示省略号
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
display: -webkit-box;
|
||
-webkit-line-clamp: 1;
|
||
-webkit-box-orient: vertical;
|
||
}
|
||
|
||
.blockchain {
|
||
color: #699A70;
|
||
font-size: 20rpx;
|
||
margin-top: 10rpx;
|
||
width: 75%;
|
||
// 超出一行显示省略号
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
display: -webkit-box;
|
||
-webkit-line-clamp: 1;
|
||
-webkit-box-orient: vertical;
|
||
}
|
||
}
|
||
}
|
||
|
||
.mine-icon {
|
||
background: #FFFFFF;
|
||
border-radius: 20rpx;
|
||
height: 130rpx;
|
||
margin: 0rpx 28rpx 40rpx 28rpx;
|
||
padding: 20rpx 20rpx;
|
||
display: flex;
|
||
box-sizing: border-box;
|
||
justify-content: space-around;
|
||
align-items: center;
|
||
|
||
.value {
|
||
color: #000000;
|
||
font-size: 12px;
|
||
}
|
||
|
||
.tag,
|
||
.message,
|
||
.scan,
|
||
.setting {
|
||
display: flex;
|
||
flex-direction: column;
|
||
justify-content: center;
|
||
align-items: center;
|
||
}
|
||
|
||
.message {
|
||
position: relative;
|
||
|
||
.point {
|
||
position: absolute;
|
||
z-index: 999;
|
||
left: 35rpx;
|
||
top: 0rpx;
|
||
}
|
||
}
|
||
|
||
// .scan {
|
||
|
||
// width: 60rpx;
|
||
|
||
// font-size: 20rpx;
|
||
// }
|
||
|
||
|
||
}
|
||
|
||
.his-title-text {
|
||
font-size: 24rpx;
|
||
margin: 28rpx;
|
||
padding-bottom: 4upx;
|
||
color: #959595;
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
&>.line {
|
||
flex: 1;
|
||
height: 0.5rpx;
|
||
background: #D0D0D0;
|
||
margin-left: 5rpx;
|
||
}
|
||
}
|
||
|
||
.his-box {
|
||
margin: 0 8rpx;
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
|
||
.item {
|
||
width: 332rpx;
|
||
height: 418rpx;
|
||
// background: #000000;
|
||
// border-radius: 8rpx;
|
||
overflow: hidden;
|
||
position: relative;
|
||
margin: 20rpx 10rpx 0 18rpx;
|
||
box-sizing: border-box;
|
||
|
||
.icon {
|
||
width: 28rpx;
|
||
height: 28rpx;
|
||
position: absolute;
|
||
top: 16rpx;
|
||
right: 18rpx;
|
||
z-index: 10;
|
||
}
|
||
|
||
.img {
|
||
width: 100%;
|
||
height: 324rpx;
|
||
}
|
||
|
||
.content {
|
||
height: 96rpx;
|
||
width: 100%;
|
||
position: absolute;
|
||
bottom: 0;
|
||
font-size: 32rpx;
|
||
text-align: center;
|
||
line-height: 96rpx;
|
||
background-position: center center;
|
||
background-size:cover !important;
|
||
}
|
||
|
||
.contentD {
|
||
background: url("../../static/image/mine/item-bg1.png") no-repeat;
|
||
}
|
||
|
||
.contentC {
|
||
background: url("../../static/image/mine/item-bg2.png") no-repeat;
|
||
}
|
||
|
||
.contentB {
|
||
background: url("../../static/image/mine/item-bg3.png") no-repeat;
|
||
}
|
||
|
||
.contentA {
|
||
background: url("../../static/image/mine/item-bg4.png") no-repeat;
|
||
}
|
||
}
|
||
}
|
||
|
||
.invite-box {
|
||
text-align: center;
|
||
}
|
||
|
||
.popupLocale-box {
|
||
background: rgba(0, 0, 0, 0.8);
|
||
width: 582rpx;
|
||
overflow: hidden;
|
||
padding: 30rpx 42rpx;
|
||
|
||
.content3 {
|
||
background: url("../../static/image/mine/item-bg3.png") no-repeat;
|
||
}
|
||
|
||
.content4 {
|
||
background: url("../../static/image/mine/item-bg4.png") no-repeat;
|
||
}
|
||
|
||
.content {
|
||
height: 96rpx;
|
||
width: 100%;
|
||
background-size: 100% 100%;
|
||
position: absolute;
|
||
bottom: 0;
|
||
font-size: 32rpx;
|
||
text-align: center;
|
||
line-height: 96rpx;
|
||
}
|
||
}
|
||
|
||
.popupLocale-box {
|
||
background: rgba(0, 0, 0, 0.8);
|
||
width: 582rpx;
|
||
overflow: hidden;
|
||
padding: 30rpx 42rpx 0 42rpx;
|
||
|
||
.title {
|
||
font-size: 40rpx;
|
||
text-align: center;
|
||
margin-bottom: 40rpx;
|
||
}
|
||
|
||
.u-button {
|
||
width: 260rpx;
|
||
height: 56rpx;
|
||
border-radius: 40rpx;
|
||
}
|
||
|
||
.item {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
padding: 34rpx 50rpx 38rpx 0;
|
||
// border-bottom: 1px solid #dedede;
|
||
align-items: center;
|
||
|
||
.right {
|
||
font-size: 20rpx;
|
||
|
||
.tag-btn {
|
||
width: 100rpx;
|
||
|
||
/deep/ .u-tag {
|
||
justify-content: center;
|
||
}
|
||
|
||
/deep/ .u-tag__text--medium {
|
||
font-size: 20rpx;
|
||
text-align: center;
|
||
height: 40rpx;
|
||
line-height: 40rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.u-popup__content {
|
||
border-radius: 8rpx;
|
||
}
|
||
|
||
.step-top {
|
||
width: 466rpx;
|
||
padding: 16rpx 40rpx;
|
||
background: #699A70;
|
||
margin: auto;
|
||
text-align: center;
|
||
}
|
||
|
||
.step-box {
|
||
width: 100%;
|
||
margin-top: 26rpx;
|
||
background: #FFFFFF;
|
||
padding-bottom: 80rpx;
|
||
|
||
.title {
|
||
font-size: 40rpx;
|
||
text-align: center;
|
||
margin: 46rpx 0 34rpx 0;
|
||
color: #434343;
|
||
}
|
||
|
||
.step-pl {
|
||
text-align: center;
|
||
color: #878787;
|
||
font-size: 28rpx;
|
||
|
||
|
||
}
|
||
}
|
||
|
||
.verfy-box {
|
||
display: flex;
|
||
justify-content: center;
|
||
|
||
.label {
|
||
font-size: 24rpx;
|
||
text-align: left;
|
||
margin-bottom: 20rpx;
|
||
margin-top: 90rpx;
|
||
color: #878787;
|
||
}
|
||
|
||
/deep/ .u-code-input__item {
|
||
background: rgba(228, 228, 228, 0.7);
|
||
width: 60rpx !important;
|
||
height: 60rpx !important;
|
||
}
|
||
}
|
||
|
||
.pass-box {
|
||
width: 582rpx;
|
||
height: 484rpx;
|
||
background: #FFFFFF;
|
||
|
||
.title {
|
||
font-size: 40rpx;
|
||
text-align: center;
|
||
margin: 46rpx 0 34rpx 0;
|
||
color: #434343;
|
||
}
|
||
|
||
.flex-end {
|
||
margin-top: 70rpx;
|
||
padding: 58rpx;
|
||
text-align: right;
|
||
font-size: 24rpx;
|
||
color: #878787;
|
||
}
|
||
}</style>
|