17
This commit is contained in:
@@ -120,7 +120,7 @@
|
||||
const _this = this;
|
||||
let list = [...this.storeConversationList];
|
||||
if(this.keyword){
|
||||
list = list.filter((item)=>{77
|
||||
list = list.filter((item)=>{
|
||||
return item.showName.indexOf(_this.kw)>-1 || item.userID.indexOf(_this.kw)>-1 || item.groupID.indexOf(_this.kw)>-1
|
||||
})
|
||||
}
|
||||
|
||||
@@ -0,0 +1,261 @@
|
||||
<template>
|
||||
<view class="contact_choose_container">
|
||||
<custom-nav-bar title="群成员">
|
||||
<view slot="more" style="margin-right: 10rpx;">
|
||||
<u-button type="primary" @click="confirm" :disabled="!isConfirmEnable">确定</u-button>
|
||||
</view>
|
||||
</custom-nav-bar>
|
||||
|
||||
<view class="search_bar_wrap">
|
||||
<u-search shape="square" placeholder="搜索" :showAction="false" v-model="keyword" />
|
||||
</view>
|
||||
|
||||
<view class="tab_container">
|
||||
<view class="tab_pane">
|
||||
<choose-index-list
|
||||
@updateCheck="updateCheckedUser"
|
||||
:indexList="getChooseData.indexList"
|
||||
:itemArr="getChooseData.dataList"
|
||||
:checkedIDList="checkedUserIDList"
|
||||
:disabledIDList="disabledUserIDList"
|
||||
:showCheck="muitple" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {mapGetters} from "vuex";
|
||||
import {formatChooseData,toastWithCallback} from "@/util/common";
|
||||
import IMSDK from "openim-uniapp-polyfill";
|
||||
import CustomNavBar from "@/components/CustomNavBar/index.vue";
|
||||
import UserItem from "@/components/UserItem/index.vue";
|
||||
import ChooseIndexList from "@/components/ChooseIndexList/index.vue";
|
||||
|
||||
export default {
|
||||
components: {
|
||||
CustomNavBar,
|
||||
UserItem,
|
||||
ChooseIndexList
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
keyword: "",
|
||||
groupID: "",
|
||||
groupMemberList:[],
|
||||
hideUserIDList: [],
|
||||
checkedUserIDList: [],
|
||||
disabledUserIDList: [],
|
||||
comfirmLoading: false,
|
||||
muitple:true
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
getChooseData() {
|
||||
const list = [...this.groupMemberList];
|
||||
if (this.keyword) {
|
||||
return {
|
||||
indexList: ["#"],
|
||||
dataList: [
|
||||
list.filter(
|
||||
(friend) =>{
|
||||
if(friend.nickname && friend.nickname.indexOf(this.keyword) !==-1){
|
||||
return true;
|
||||
}
|
||||
if(friend.remark && friend.remark.includes(this.keyword)){
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
console.log(friend.nickname);
|
||||
return friend.nickname.indexOf(this.keyword) !==-1 || friend?.remark.indexOf(this.keyword) !==-1
|
||||
}
|
||||
),
|
||||
],
|
||||
};
|
||||
}
|
||||
return formatChooseData(list);
|
||||
},
|
||||
getCheckedUserInfo() {
|
||||
const tmpUserIDList = [...this.checkedUserIDList];
|
||||
const checkedFriends = this.groupMemberList.filter((friend) => {
|
||||
const idx = tmpUserIDList.findIndex(
|
||||
(userID) => userID === friend.userID
|
||||
);
|
||||
if (idx > -1) {
|
||||
tmpUserIDList.splice(idx, 1);
|
||||
}
|
||||
return idx > -1;
|
||||
});
|
||||
return [...checkedFriends];
|
||||
},
|
||||
isConfirmEnable(){
|
||||
if(this.checkedUserIDList.length){
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
}
|
||||
},
|
||||
async onLoad(options) {
|
||||
const {groupID,checkedUserIDList,hideUserIDList,muitple} = options;
|
||||
this.groupID = groupID;
|
||||
if(muitple){
|
||||
this.muitple = muitple;
|
||||
}
|
||||
this.checkedUserIDList = checkedUserIDList ? JSON.parse(checkedUserIDList) : [];
|
||||
this.hideUserIDList = hideUserIDList ? JSON.parse(hideUserIDList) : [];
|
||||
const list = await this.getGroupMemberList();
|
||||
|
||||
this.groupMemberList = list.filter(
|
||||
(friend) =>{
|
||||
return false == this.hideUserIDList.includes(friend.userID);
|
||||
}
|
||||
);
|
||||
if (this.checkedUserIDList.length > 0) {
|
||||
this.checkDisabledUser();
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
async getGroupMemberList() {
|
||||
const _this = this;
|
||||
return new Promise((resolve,reject)=>{
|
||||
if (!_this.groupID) {
|
||||
return reject('groupid is null');
|
||||
}
|
||||
IMSDK.asyncApi(IMSDK.IMMethods.GetGroupMemberList, IMSDK.uuid(), {
|
||||
groupID: _this.groupID,
|
||||
filter: 0,
|
||||
offset: 0,
|
||||
count: 6,
|
||||
}).then(({ data }) => {
|
||||
return resolve(data)
|
||||
}).catch(e=>{
|
||||
return reject(e);
|
||||
})
|
||||
});
|
||||
},
|
||||
checkDisabledUser() {
|
||||
const friendIDList = this.groupMemberList.map((friend) => friend.userID);
|
||||
IMSDK.asyncApi("getUsersInGroup", IMSDK.uuid(), {
|
||||
groupID: this.groupID,
|
||||
userIDList: friendIDList,
|
||||
}).then(({data}) => {
|
||||
this.disabledUserIDList = data;
|
||||
});
|
||||
},
|
||||
tabChange(idx) {
|
||||
this.keyword = "";
|
||||
this.activeTab = idx;
|
||||
},
|
||||
updateCheckedUser({userID}) {
|
||||
if(!this.muitple){
|
||||
this.checkedUserIDList = [userID];
|
||||
this.confirm();
|
||||
}else{
|
||||
if (this.checkedUserIDList.includes(userID)) {
|
||||
const idx = this.checkedUserIDList.findIndex((item) => item === userID);
|
||||
const tmpArr = [...this.checkedUserIDList];
|
||||
tmpArr.splice(idx, 1);
|
||||
this.checkedUserIDList = [...tmpArr];
|
||||
} else {
|
||||
this.checkedUserIDList = [...this.checkedUserIDList, userID];
|
||||
}
|
||||
}
|
||||
},
|
||||
confirm() {
|
||||
this.comfirmLoading = true;
|
||||
try{
|
||||
const eventChannel = this.getOpenerEventChannel();
|
||||
eventChannel.emit('onSelectedConfirm', this.getCheckedUserInfo);
|
||||
}catch(e){
|
||||
console.log(e);
|
||||
}
|
||||
this.comfirmLoading = false;
|
||||
uni.navigateBack({
|
||||
delta: 1,
|
||||
});
|
||||
this.comfirmLoading = false;
|
||||
},
|
||||
},
|
||||
onBackPress() {
|
||||
return false;
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
::v-deep.u-popup {
|
||||
flex: none;
|
||||
}
|
||||
|
||||
.contact_choose_container {
|
||||
height: 100vh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.search_bar_wrap {
|
||||
height: 34px;
|
||||
padding: 12px 22px;
|
||||
}
|
||||
|
||||
.tab_container {
|
||||
@include colBox(false);
|
||||
flex: 1;
|
||||
overflow: hidden;
|
||||
|
||||
.setting_item {
|
||||
padding: 32rpx 36rpx;
|
||||
}
|
||||
|
||||
.title {
|
||||
height: 60rpx;
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
// padding: 16rpx 8rpx;
|
||||
background: #f8f9fa;
|
||||
color: #8e9ab0;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
|
||||
.tabs_bar {
|
||||
@include vCenterBox();
|
||||
justify-content: space-evenly;
|
||||
|
||||
.tab_item {
|
||||
@include colBox(false);
|
||||
align-items: center;
|
||||
|
||||
image {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.tab_pane {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex: 1;
|
||||
overflow: hidden;
|
||||
|
||||
.member_list {
|
||||
flex: 1;
|
||||
height: 80% !important;
|
||||
|
||||
::v-deepuni-scroll-view {
|
||||
max-height: 100% !important;
|
||||
}
|
||||
}
|
||||
|
||||
.user_list {
|
||||
height: 100% !important;
|
||||
}
|
||||
|
||||
.member_anchor {
|
||||
background-color: #f8f8f8 !important;
|
||||
border: none !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,390 @@
|
||||
<template>
|
||||
<view class="page_container">
|
||||
<view class="login">
|
||||
<view class="logo">
|
||||
<img src="static/images/logo.png" alt="" />
|
||||
<view class="title">欢迎使用{{ config.name }}</view>
|
||||
</view>
|
||||
<u-tabs v-if="1 == 2" :list="list" :current="active" @click="click"></u-tabs>
|
||||
<u-form class="loginForm" labelPosition="top" :model="loginInfo" :labelStyle="{
|
||||
fontSize: '14px',
|
||||
marginTop: '20rpx',
|
||||
width: 'max-content',
|
||||
}" ref="loginForm">
|
||||
<u-form-item v-if="active === 0" label="" prop="phoneNumber">
|
||||
<u-input v-model="loginInfo.phoneNumber" border="surround" placeholder="请输入手机号码" clearable>
|
||||
<view slot="prefix" class="phoneNumber_areacode" @click="showPicker">
|
||||
<text class="areacode_content">+{{ loginInfo.region }}</text>
|
||||
<u-icon class="arrow_down" name="arrow-down"></u-icon>
|
||||
</view>
|
||||
</u-input>
|
||||
</u-form-item>
|
||||
<u-form-item v-if="active === 1" label="" prop="email">
|
||||
<u-input v-model="loginInfo.email" border="surround" placeholder="请输入您的邮箱" clearable>
|
||||
</u-input>
|
||||
</u-form-item>
|
||||
<u-form-item v-if="active > 1 || isPwdLogin" label="" prop="password">
|
||||
<u-input v-model="loginInfo.password" border="surround" placeholder="请输入密码" :password="!eying"
|
||||
clearable>
|
||||
<u-icon @click="updateEye" slot="suffix" :name="eying ? 'eye-off' : 'eye'">
|
||||
</u-icon>
|
||||
</u-input>
|
||||
</u-form-item>
|
||||
<u-form-item v-if="active <= 1 && !isPwdLogin" label="" prop="verificationCode">
|
||||
<u-input v-model="loginInfo.verificationCode" border="surround" placeholder="请输入验证码">
|
||||
<view class="code_btn" slot="suffix" @click="getCode">
|
||||
{{ count !== 0 ? `${count} s` : "获取验证码" }}
|
||||
</view>
|
||||
</u-input>
|
||||
</u-form-item>
|
||||
</u-form>
|
||||
<view v-if="active <= 1" class="other">
|
||||
<text @click="toRegisterOrForget(false)">忘记密码</text>
|
||||
<text class="forget" @click="toggleLoginMethod">{{ isPwdLogin ? "验证码登录" : "密码登录" }}</text>
|
||||
</view>
|
||||
<view class="login-btn">
|
||||
<u-button :loading="loading" type="primary" @click="startLogin" :disabled="!canLogin">
|
||||
登录
|
||||
</u-button>
|
||||
</view>
|
||||
|
||||
<AreaPicker ref="AreaPicker" @chooseArea="chooseArea" />
|
||||
</view>
|
||||
|
||||
<view class="action_bar">
|
||||
<text>还没有账号?<text class="register" @click="toRegisterOrForget(true)">立即注册</text></text>
|
||||
<text style="margin-bottom: 16rpx" @click="copy">{{ appversion }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapGetters } from "vuex";
|
||||
import { v4 as uuidv4 } from "uuid";
|
||||
import md5 from "md5";
|
||||
import { businessLogin, businessSendSms } from "@/api/login";
|
||||
import AreaPicker from "@/components/AreaPicker";
|
||||
import { checkLoginError } from "@/util/common";
|
||||
import { SmsUserFor } from "@/constant";
|
||||
import IMSDK from "openim-uniapp-polyfill";
|
||||
|
||||
let timer;
|
||||
|
||||
export default {
|
||||
components: {
|
||||
AreaPicker,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
list: [{
|
||||
name: '手机号',
|
||||
}, {
|
||||
name: '邮箱',
|
||||
}],
|
||||
loginInfo: {
|
||||
email: "",
|
||||
phoneNumber: "",
|
||||
password: "",
|
||||
region: "86",
|
||||
verificationCode: "",
|
||||
},
|
||||
appversion: 0,
|
||||
eying: false,
|
||||
loading: false,
|
||||
count: 0,
|
||||
isPwdLogin: true,
|
||||
active: 0,
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(["config"]),
|
||||
canLogin() {
|
||||
return (
|
||||
(this.loginInfo.phoneNumber || this.loginInfo.email) &&
|
||||
(this.loginInfo.password || this.loginInfo.verificationCode)
|
||||
);
|
||||
},
|
||||
},
|
||||
onLoad(options) {
|
||||
const _this = this;
|
||||
// #ifdef APP
|
||||
plus.runtime.getProperty(plus.runtime.appid, (inf) => {
|
||||
//console.log(inf);
|
||||
_this.appversion = inf.version
|
||||
});
|
||||
// if(options.isRedirect){
|
||||
// plus.navigator.closeSplashscreen();
|
||||
// }
|
||||
// #endif
|
||||
this.init();
|
||||
},
|
||||
methods: {
|
||||
click({ index }) {
|
||||
this.active = index;
|
||||
},
|
||||
copy() {
|
||||
uni.setClipboardData({
|
||||
showToast: false,
|
||||
data: version,
|
||||
success: function () {
|
||||
uni.showToast({
|
||||
icon: "none",
|
||||
title: "复制成功",
|
||||
});
|
||||
},
|
||||
});
|
||||
},
|
||||
init() {
|
||||
this.loginInfo.region = uni.getStorageSync("last_areaCode") || "86";
|
||||
this.loginInfo.email = uni.getStorageSync("last_email") || "";
|
||||
this.loginInfo.phoneNumber = uni.getStorageSync("last_phoneNumber") || "";
|
||||
|
||||
if (process.env.NODE_ENV == 'development') {
|
||||
this.loginInfo.email = "commiu@outlook.com";
|
||||
this.loginInfo.password = "qwe123";
|
||||
}
|
||||
},
|
||||
updateEye() {
|
||||
this.eying = !this.eying;
|
||||
},
|
||||
toRegisterOrForget(isRegister) {
|
||||
uni.$u.route("/pages/login/common/index", {
|
||||
isRegister,
|
||||
});
|
||||
},
|
||||
async startLogin() {
|
||||
// this.$refs.loginForm.validate().then(async (valid) => {
|
||||
this.loading = true;
|
||||
this.saveLoginInfo();
|
||||
let data = {};
|
||||
try {
|
||||
data = await businessLogin({
|
||||
mobile: this.loginInfo.phoneNumber,
|
||||
email: this.loginInfo.email,
|
||||
region: `+${this.loginInfo.region}`,
|
||||
password: this.isPwdLogin ? md5(this.loginInfo.password) : "",
|
||||
platform: uni.$u.os(),
|
||||
type: this.active === 0 ? 'mobile' : 'email',
|
||||
code: this.loginInfo.verificationCode,
|
||||
});
|
||||
const { imToken, userID } = data;
|
||||
// #ifdef APP
|
||||
await IMSDK.asyncApi(IMSDK.IMMethods.Login, uuidv4(), {
|
||||
userID,
|
||||
token: imToken,
|
||||
});
|
||||
// #endif
|
||||
this.saveLoginProfile(data);
|
||||
this.$store.commit("user/SET_AUTH_DATA", data);
|
||||
this.$store.dispatch("user/getSelfInfo");
|
||||
this.$store.dispatch("conversation/getConversationList");
|
||||
this.$store.dispatch("conversation/getUnReadCount");
|
||||
// this.$store.dispatch("contact/getFriendList");
|
||||
// this.$store.dispatch("contact/getGrouplist");
|
||||
this.$store.dispatch("contact/getBlacklist");
|
||||
this.$store.dispatch("contact/getRecvFriendApplications");
|
||||
this.$store.dispatch("contact/getSentFriendApplications");
|
||||
this.$store.dispatch("contact/getRecvGroupApplications");
|
||||
this.$store.dispatch("contact/getSentGroupApplications");
|
||||
uni.switchTab({
|
||||
url: "/pages/conversation/conversationList/index",
|
||||
});
|
||||
this.loginInfo.password = "";
|
||||
} catch (err) {
|
||||
console.error(err);
|
||||
uni.$u.toast(checkLoginError(err));
|
||||
}
|
||||
this.loading = false;
|
||||
// });
|
||||
},
|
||||
saveLoginProfile(data) {
|
||||
const { imToken, token, userID } = data;
|
||||
uni.setStorage({ key: "IMUserID", data: userID, });
|
||||
uni.setStorage({ key: "IMToken", data: imToken, });
|
||||
uni.setStorage({ key: "BusinessToken", data: token, });
|
||||
},
|
||||
saveLoginInfo() {
|
||||
uni.setStorage({key: "last_areaCode",data: this.loginInfo.region,});
|
||||
uni.setStorage({key: "last_phoneNumber",data: this.loginInfo.phoneNumber,});
|
||||
uni.setStorage({key: "last_email",data: this.loginInfo.email,});
|
||||
},
|
||||
showPicker() {
|
||||
this.$refs.AreaPicker.init();
|
||||
},
|
||||
chooseArea(areaCode) {
|
||||
this.loginInfo.region = areaCode;
|
||||
},
|
||||
toggleLoginMethod() {
|
||||
this.isPwdLogin = !this.isPwdLogin;
|
||||
},
|
||||
getCode() {
|
||||
if (!this.loginInfo.phoneNumber) {
|
||||
uni.$u.toast("请先输入手机号!");
|
||||
return;
|
||||
}
|
||||
|
||||
if (this.count !== 0) {
|
||||
return;
|
||||
}
|
||||
|
||||
const options = {
|
||||
phoneNumber: this.loginInfo.phoneNumber,
|
||||
region: `+${this.loginInfo.region}`,
|
||||
usedFor: SmsUserFor.Login,
|
||||
operationID: Date.now() + "",
|
||||
};
|
||||
businessSendSms(options)
|
||||
.then(() => {
|
||||
uni.$u.toast("验证码已发送!");
|
||||
this.startCount();
|
||||
})
|
||||
.catch((err) => {
|
||||
console.error(err);
|
||||
uni.$u.toast(checkLoginError(err));
|
||||
});
|
||||
},
|
||||
startCount() {
|
||||
if (timer) {
|
||||
clearInterval(timer);
|
||||
}
|
||||
this.count = 60;
|
||||
timer = setInterval(() => {
|
||||
if (this.count > 0) {
|
||||
this.count--;
|
||||
}
|
||||
}, 1000);
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.page_container {
|
||||
justify-content: space-between;
|
||||
|
||||
.login {
|
||||
color: #0c1c33;
|
||||
padding: 10vh 80rpx 0;
|
||||
background: linear-gradient(180deg,
|
||||
rgba(0, 137, 255, 0.1) 0%,
|
||||
rgba(255, 255, 255, 0) 100%);
|
||||
|
||||
.title {
|
||||
font-size: 34rpx;
|
||||
font-weight: 700;
|
||||
margin-bottom: 64rpx;
|
||||
// color: $u-primary;
|
||||
}
|
||||
|
||||
.logo {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: flex-start;
|
||||
align-items: flex-start;
|
||||
|
||||
img {
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.loginType {
|
||||
margin-bottom: 36rpx;
|
||||
|
||||
&-item {
|
||||
margin-right: 68rpx;
|
||||
font-size: 28rpx;
|
||||
font-weight: 400;
|
||||
border-radius: 4rpx;
|
||||
padding: 2rpx 0;
|
||||
}
|
||||
|
||||
&-active {
|
||||
color: $u-primary;
|
||||
border-bottom: 4rpx solid $u-primary;
|
||||
}
|
||||
}
|
||||
|
||||
.loginForm {
|
||||
.phoneNumber-code {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 36rpx;
|
||||
border-right: 2rpx solid #d8d8d8;
|
||||
margin-right: 58rpx;
|
||||
|
||||
.code {
|
||||
font-weight: 400;
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
|
||||
.icon {
|
||||
margin-right: 40rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.eye {
|
||||
.image {
|
||||
width: 44rpx;
|
||||
height: 32rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.code_btn {
|
||||
color: $u-primary;
|
||||
}
|
||||
}
|
||||
|
||||
.other {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
margin: 8rpx;
|
||||
font-size: 24rpx;
|
||||
font-weight: 400;
|
||||
color: $u-tips-color;
|
||||
|
||||
.forget {
|
||||
color: $u-primary;
|
||||
}
|
||||
}
|
||||
|
||||
.login-btn {
|
||||
margin-top: 8vh;
|
||||
}
|
||||
|
||||
.agreement {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
margin-top: 36rpx;
|
||||
|
||||
.detail {
|
||||
font-size: 24rpx;
|
||||
font-weight: 400;
|
||||
color: $u-primary;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.action_bar {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
text-align: center;
|
||||
margin-bottom: 96rpx;
|
||||
font-size: 24rpx;
|
||||
font-weight: 400;
|
||||
color: $u-tips-color;
|
||||
|
||||
.register {
|
||||
color: $u-primary;
|
||||
}
|
||||
|
||||
.tap_line {
|
||||
width: 1px;
|
||||
margin: 0 24rpx;
|
||||
background-color: #999;
|
||||
transform: scale(0.5, 0.8);
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -16,11 +16,11 @@
|
||||
<view class="search_container" v-if="1==2">
|
||||
<u-search placeholder="日照香炉生紫烟" v-model="keyword"></u-search>
|
||||
<u-cell-group :customStyle="{backgroundColor:'#FFF'}">
|
||||
<u-cell title="摇一摇" icon="/static/images/workbench/05.png" :size="cellSize"></u-cell>
|
||||
<u-cell title="看一看" icon="/static/images/workbench/06.png" :size="cellSize"></u-cell>
|
||||
<u-cell title="听一听" icon="/static/images/workbench/06.png" :size="cellSize"></u-cell>
|
||||
<u-cell title="附近" icon="/static/images/workbench/08.png" :size="cellSize"></u-cell>
|
||||
<u-cell title="购物" icon="/static/images/workbench/09.png" :size="cellSize"></u-cell>
|
||||
<u-cell title="摇一摇" icon="/static/images/find/05.png" :size="cellSize"></u-cell>
|
||||
<u-cell title="看一看" icon="/static/images/find/06.png" :size="cellSize"></u-cell>
|
||||
<u-cell title="听一听" icon="/static/images/find/06.png" :size="cellSize"></u-cell>
|
||||
<u-cell title="附近" icon="/static/images/find/08.png" :size="cellSize"></u-cell>
|
||||
<u-cell title="购物" icon="/static/images/find/09.png" :size="cellSize"></u-cell>
|
||||
</u-cell-group>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
@@ -0,0 +1,143 @@
|
||||
<template>
|
||||
<view class="register_container content_with_back">
|
||||
<view class="back_icon">
|
||||
<u-icon name="arrow-left" bold size="22" @click="back" />
|
||||
</view>
|
||||
<view class="title" v-if="isRegister">新用户注册</view>
|
||||
<view class="title" v-else>忘记密码</view>
|
||||
<u-form labelPosition="top" :model="userInfo" :rules="rules" :labelStyle="{
|
||||
fontSize: '14px',
|
||||
marginTop: '20rpx',
|
||||
minWidth: '200rpx',
|
||||
}" ref="registerForm">
|
||||
<u-form-item prop="email" label="邮箱" v-if="userInfo.type == 'email'">
|
||||
<u-input v-model="userInfo.email" border="surround" placeholder="请输入邮箱" clearable>
|
||||
</u-input>
|
||||
</u-form-item>
|
||||
<u-form-item prop="phoneNumber" label="手机号码" v-if="userInfo.type == 'mobile'">
|
||||
<u-input v-model="userInfo.mobile" border="surround" placeholder="请输入手机号码" clearable>
|
||||
<view slot="prefix" class="phoneNumber_areacode" @click="showPicker">
|
||||
<text class="areacode_content">+{{ userInfo.region }}</text>
|
||||
<u-icon class="arrow_down" name="arrow-down"></u-icon>
|
||||
</view>
|
||||
</u-input>
|
||||
</u-form-item>
|
||||
</u-form>
|
||||
<view class="action_btn">
|
||||
<u-button @click="sendSms" type="primary" :disabled="isRegister && !checked[0]">
|
||||
{{ isRegister ? "下一步" : "获取验证码" }}
|
||||
</u-button>
|
||||
</view>
|
||||
<AreaPicker ref="AreaPicker" @chooseArea="chooseArea" />
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import AreaPicker from "@/components/AreaPicker";
|
||||
import {
|
||||
businessSendSms
|
||||
} from "@/api/login";
|
||||
import {
|
||||
SmsUserFor
|
||||
} from "@/constant";
|
||||
import {
|
||||
checkLoginError
|
||||
} from "@/util/common";
|
||||
export default {
|
||||
components: {
|
||||
AreaPicker,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
userInfo: {
|
||||
mobile: "",
|
||||
email: "",
|
||||
region: "86",
|
||||
invitationCode: "",
|
||||
type:'mobile',
|
||||
},
|
||||
checked: [true],
|
||||
rules: {
|
||||
mobile: [{
|
||||
type: "string",
|
||||
required: true,
|
||||
message: "请输入手机号码",
|
||||
trigger: ["blur", "change"],
|
||||
pattern: /^\d{11}$/,
|
||||
}, ],
|
||||
email: [{
|
||||
type: "email",
|
||||
required: true,
|
||||
message: "请输入邮箱",
|
||||
trigger: ["blur", "change"]
|
||||
}, ],
|
||||
},
|
||||
isRegister: true,
|
||||
pageStatus: "normal",
|
||||
};
|
||||
},
|
||||
onLoad(param) {
|
||||
this.isRegister = JSON.parse(param.isRegister);
|
||||
if(process.env.NODE_ENV == 'development'){
|
||||
this.userInfo.email = "commiu@outlook.com";
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
sendSms() {
|
||||
this.$refs.registerForm.validate().then((valid) => {
|
||||
const options = {
|
||||
mobile: this.userInfo.mobile,
|
||||
email: this.userInfo.email,
|
||||
region: `+${this.userInfo.region}`,
|
||||
event: this.isRegister ? 'register' : "reset_pwd",
|
||||
invitationCode: this.userInfo.invitationCode,
|
||||
type:this.userInfo.type
|
||||
};
|
||||
businessSendSms(options)
|
||||
.then(() => {
|
||||
uni.$u.toast("验证码已发送!");
|
||||
setTimeout(
|
||||
() =>
|
||||
uni.$u.route("/pages/common/verifyCode/index", {
|
||||
userInfo: JSON.stringify(this.userInfo),
|
||||
isRegister: this.isRegister,
|
||||
}),
|
||||
1000,
|
||||
);
|
||||
})
|
||||
.catch((err) => {
|
||||
console.error(err);
|
||||
uni.$u.toast(checkLoginError(err));
|
||||
});
|
||||
});
|
||||
},
|
||||
back() {
|
||||
uni.$u.route("/pages/common/login/index");
|
||||
},
|
||||
showPicker() {
|
||||
this.$refs.AreaPicker.init();
|
||||
},
|
||||
chooseArea(areaCode) {
|
||||
this.userInfo.region = areaCode;
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.register_container {
|
||||
margin-top: var(--status-bar-height);
|
||||
background: linear-gradient(180deg,
|
||||
rgba(0, 137, 255, 0.1) 0%,
|
||||
rgba(255, 255, 255, 0) 100%);
|
||||
|
||||
.title {
|
||||
font-size: 44rpx;
|
||||
font-weight: 600;
|
||||
color: $u-primary;
|
||||
}
|
||||
|
||||
.action_btn {
|
||||
padding-top: 20vh;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,156 @@
|
||||
<template>
|
||||
<view class="set_password_container content_with_back">
|
||||
<view class="title">重置密码</view>
|
||||
<u-form class="loginForm commonPage-form" labelPosition="top" :model="formData" :rules="rules" :labelStyle="{
|
||||
fontSize: '14px',
|
||||
marginTop: '20rpx',
|
||||
minWidth: '200rpx',
|
||||
}" ref="loginForm">
|
||||
<u-form-item label="密码" prop="password">
|
||||
<u-input v-model="formData.password" border="surround" placeholder="请输入密码" :password="!passwordEying">
|
||||
<u-icon @click="updateEye('passwordEying')" slot="suffix"
|
||||
:name="passwordEying ? 'eye-off' : 'eye'"></u-icon>
|
||||
</u-input>
|
||||
</u-form-item>
|
||||
<view class="feild_desc">6~20位,至少包含数字、字母</view>
|
||||
<u-form-item label="确认密码" prop="confirmPassword">
|
||||
<u-input v-model="formData.confirmPassword" border="surround" placeholder="请输入密码"
|
||||
:password="!comfirmEying">
|
||||
<u-icon @click="updateEye('comfirmEying')" slot="suffix"
|
||||
:name="comfirmEying ? 'eye-off' : 'eye'"></u-icon>
|
||||
</u-input>
|
||||
</u-form-item>
|
||||
</u-form>
|
||||
<view class="action_btn">
|
||||
<u-button type="primary" @click="doNext">
|
||||
确认修改
|
||||
</u-button>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
businessReset
|
||||
} from "@/api/login";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
isRegister: false,
|
||||
codeValue: "",
|
||||
userInfo: {
|
||||
mobile: "",
|
||||
email:"",
|
||||
region: "",
|
||||
},
|
||||
formData: {
|
||||
password: "",
|
||||
confirmPassword: "",
|
||||
},
|
||||
passwordEying: false,
|
||||
comfirmEying: false,
|
||||
rules: {
|
||||
password: [{
|
||||
type: "string",
|
||||
required: true,
|
||||
message: "请输入密码",
|
||||
trigger: ["blur", "change"],
|
||||
pattern: /^(?=.*\d)(?=.*[a-zA-Z]).{7,}$/,
|
||||
},
|
||||
{
|
||||
validator: (rule, value, callback) => {
|
||||
return value.length >= 6;
|
||||
},
|
||||
message: "密码太短",
|
||||
trigger: ["change", "blur"],
|
||||
},
|
||||
],
|
||||
confirmPassword: [{
|
||||
type: "string",
|
||||
required: true,
|
||||
message: "请输入确认密码",
|
||||
trigger: ["blur", "change"],
|
||||
pattern: /^(?=.*\d)(?=.*[a-zA-Z]).{7,}$/,
|
||||
},
|
||||
{
|
||||
validator: (rule, value, callback) => {
|
||||
return value === this.formData.password;
|
||||
},
|
||||
message: "两次密码不一致",
|
||||
trigger: ["change", "blur"],
|
||||
},
|
||||
],
|
||||
},
|
||||
};
|
||||
},
|
||||
onLoad(options) {
|
||||
const {
|
||||
userInfo,
|
||||
isRegister,
|
||||
codeValue
|
||||
} = options;
|
||||
this.userInfo = JSON.parse(userInfo);
|
||||
this.isRegister = JSON.parse(isRegister);
|
||||
this.codeValue = codeValue;
|
||||
},
|
||||
onBackPress() {
|
||||
return true;
|
||||
},
|
||||
methods: {
|
||||
doNext() {
|
||||
this.$refs.loginForm.validate().then((valid) => {
|
||||
if (valid) {
|
||||
const options = {
|
||||
mobile: this.userInfo.mobile,
|
||||
email: this.userInfo.email,
|
||||
region: `+${this.userInfo.region}`,
|
||||
code: this.codeValue,
|
||||
password: this.formData.password,
|
||||
platform: uni.$u.os(),
|
||||
operationID: Date.now() + "",
|
||||
};
|
||||
businessReset(options)
|
||||
.then(() => {
|
||||
uni.$u.toast("密码重置成功,请前往登录!");
|
||||
setTimeout(() => uni.$u.route("/pages/login/index"), 1000);
|
||||
})
|
||||
.catch((err) => {
|
||||
console.log('err', err)
|
||||
uni.$u.toast("密码重置失败")
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
updateEye(key) {
|
||||
this[key] = !this[key];
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.set_password_container {
|
||||
margin-top: var(--status-bar-height);
|
||||
background: linear-gradient(180deg,
|
||||
rgba(0, 137, 255, 0.1) 0%,
|
||||
rgba(255, 255, 255, 0) 100%);
|
||||
padding-top: 150rpx;
|
||||
|
||||
.title {
|
||||
font-size: 34rpx;
|
||||
font-weight: 600;
|
||||
margin-bottom: 116rpx;
|
||||
padding-bottom: 8rpx;
|
||||
color: $u-primary;
|
||||
}
|
||||
|
||||
.feild_desc {
|
||||
font-size: 24rpx;
|
||||
color: $u-tips-color;
|
||||
margin-top: 4rpx;
|
||||
}
|
||||
|
||||
.action_btn {
|
||||
margin-top: 12vh;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,201 @@
|
||||
<template>
|
||||
<view class="set_info_container content_with_back">
|
||||
<view class="title">设置信息</view>
|
||||
<u-form class="loginForm commonPage-form" labelPosition="top" :model="userInfo" :rules="rules" :labelStyle="{
|
||||
fontSize: '14px',
|
||||
marginTop: '20rpx',
|
||||
minWidth: '200rpx',
|
||||
}" ref="loginForm">
|
||||
<u-form-item label="昵称" prop="nickname">
|
||||
<u-input v-model="userInfo.nickname" border="surround" placeholder="请输入您的昵称" clearable>
|
||||
</u-input>
|
||||
</u-form-item>
|
||||
<u-form-item label="密码" prop="password">
|
||||
<u-input v-model="userInfo.password" border="surround" placeholder="请输入密码" :password="!passwordEying">
|
||||
<u-icon @click="updateEye('passwordEying')" slot="suffix"
|
||||
:name="passwordEying ? 'eye-off' : 'eye'"></u-icon>
|
||||
</u-input>
|
||||
</u-form-item>
|
||||
<view class="feild_desc">6~20位,至少包含数字、字母</view>
|
||||
<u-form-item label="确认密码" prop="confirmPassword">
|
||||
<u-input v-model="userInfo.confirmPassword" border="surround" placeholder="请输入密码"
|
||||
:password="!comfirmEying">
|
||||
<u-icon @click="updateEye('comfirmEying')" slot="suffix"
|
||||
:name="comfirmEying ? 'eye-off' : 'eye'"></u-icon>
|
||||
</u-input>
|
||||
</u-form-item>
|
||||
</u-form>
|
||||
<view class="btn">
|
||||
<u-button :loading="loading" type="primary" @click="doNext">
|
||||
进入{{config.name}}
|
||||
</u-button>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import md5 from "md5";
|
||||
import MyAvatar from "@/components/MyAvatar/index.vue";
|
||||
import { mapGetters } from "vuex";
|
||||
import { businessRegister } from "@/api/login";
|
||||
import { checkLoginError } from "@/util/common";
|
||||
export default {
|
||||
components: {
|
||||
MyAvatar,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
passwordEying: false,
|
||||
comfirmEying: false,
|
||||
codeValue: "",
|
||||
userInfo: {
|
||||
mobile: "",
|
||||
email: "",
|
||||
region: "",
|
||||
nickname: "",
|
||||
password: "",
|
||||
confirmPassword: "",
|
||||
},
|
||||
rules: {
|
||||
nickname: [{
|
||||
type: "string",
|
||||
required: true,
|
||||
message: "请填写真实姓名",
|
||||
trigger: ["blur", "change"],
|
||||
}, ],
|
||||
password: [{
|
||||
type: "string",
|
||||
required: true,
|
||||
message: "请输入密码",
|
||||
trigger: ["blur", "change"],
|
||||
pattern: /^(?=.*\d)(?=.*[a-zA-Z]).{6,}$/,
|
||||
},
|
||||
{
|
||||
validator: (rule, value, callback) => {
|
||||
return value.length >= 6;
|
||||
},
|
||||
message: "密码太短",
|
||||
trigger: ["change", "blur"],
|
||||
},
|
||||
],
|
||||
confirmPassword: [{
|
||||
type: "string",
|
||||
required: true,
|
||||
message: "请输入确认密码",
|
||||
trigger: ["blur", "change"],
|
||||
pattern: /^(?=.*\d)(?=.*[a-zA-Z]).{6,}$/,
|
||||
},
|
||||
{
|
||||
validator: (rule, value, callback) => {
|
||||
return value === this.formData.password;
|
||||
},
|
||||
message: "两次密码不一致",
|
||||
trigger: ["change", "blur"],
|
||||
},
|
||||
],
|
||||
},
|
||||
};
|
||||
},
|
||||
computed:{
|
||||
...mapGetters(["config"]),
|
||||
},
|
||||
onLoad(options) {
|
||||
const {userInfo,codeValue} = options;
|
||||
this.userInfo = {
|
||||
...this.userInfo,
|
||||
...JSON.parse(userInfo),
|
||||
};
|
||||
this.codeValue = codeValue;
|
||||
if(process.env.NODE_ENV == 'development'){
|
||||
//this.userInfo.email = "commiu@outlook.com";
|
||||
this.userInfo.nickname = "";
|
||||
this.userInfo.password = "qwe123";
|
||||
this.userInfo.confirmPassword = "qwe123";
|
||||
}
|
||||
},
|
||||
onBackPress() {
|
||||
return true;
|
||||
},
|
||||
methods: {
|
||||
updateEye(key) {
|
||||
this[key] = !this[key];
|
||||
},
|
||||
doNext() {
|
||||
this.$refs.loginForm.validate().then((valid) => {
|
||||
if (valid) {
|
||||
this.doRegister();
|
||||
}
|
||||
});
|
||||
},
|
||||
async doRegister() {
|
||||
this.loading = true;
|
||||
const options = {
|
||||
code: this.codeValue,
|
||||
platform: uni.$u.os(),
|
||||
autoLogin: true,
|
||||
...this.userInfo,
|
||||
region: `+${this.userInfo.region}`,
|
||||
password: md5(this.userInfo.password),
|
||||
mobile: this.userInfo.mobile
|
||||
};
|
||||
try {
|
||||
await businessRegister(options);
|
||||
this.saveLoginInfo();
|
||||
uni.$u.toast('注册成功')
|
||||
uni.$u.route("/pages/login/index")
|
||||
} catch (err) {
|
||||
console.log(err);
|
||||
if(err.msg=="验证码过期" || err.msg=="验证码错误"){
|
||||
uni.$u.route("/pages/common/verifyCode/index", {
|
||||
userInfo: JSON.stringify(this.userInfo),
|
||||
isRegister: true,
|
||||
resend: 1,
|
||||
})
|
||||
return ;
|
||||
}
|
||||
// uni.$u.toast('注册失败')
|
||||
} finally {
|
||||
this.loading = false;
|
||||
}
|
||||
},
|
||||
saveLoginInfo() {
|
||||
uni.setStorage({
|
||||
key: "lastPhoneNumber",
|
||||
data: this.userInfo.mobile,
|
||||
});
|
||||
uni.setStorage({
|
||||
key: "lastAreaCode",
|
||||
data: this.userInfo.region,
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.set_info_container {
|
||||
margin-top: var(--status-bar-height);
|
||||
background: linear-gradient(180deg,
|
||||
rgba(0, 137, 255, 0.1) 0%,
|
||||
rgba(255, 255, 255, 0) 100%);
|
||||
padding-top: 150rpx;
|
||||
|
||||
.title {
|
||||
font-size: 34rpx;
|
||||
font-weight: 600;
|
||||
margin-bottom: 116rpx;
|
||||
padding-bottom: 8rpx;
|
||||
color: $u-primary;
|
||||
}
|
||||
|
||||
.feild_desc {
|
||||
font-size: 24rpx;
|
||||
color: $u-tips-color;
|
||||
margin-top: 4rpx;
|
||||
}
|
||||
|
||||
.btn {
|
||||
margin-top: 200rpx;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,171 @@
|
||||
<template>
|
||||
<view class="verify_code content_with_back">
|
||||
<view class="back_icon">
|
||||
<u-icon name="arrow-left" bold size="22" @click="back" />
|
||||
</view>
|
||||
<view class="title">验证码已发送至手机</view>
|
||||
<view class="sub_title">
|
||||
{{ `+${userInfo.region} ${userInfo.mobile}` }}
|
||||
</view>
|
||||
<view class="code_container">
|
||||
<!-- <view class="code_title">请输入验证码</view> -->
|
||||
<u-code-input fontSize="24" color="#000" :focus="true" v-model="codeValue" hairline space="16"
|
||||
@finish="checkCode" />
|
||||
<view class="code_des">
|
||||
<text v-if="count > 0">
|
||||
{{ `${count}s` }}
|
||||
后
|
||||
</text>
|
||||
<text @click="getSmsAgain"> 重发验证码 </text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
import user from "../../../store/modules/user";
|
||||
import { businessSendSms, businessVerifyCode } from "@/api/login";
|
||||
import { SmsUserFor } from "@/constant";
|
||||
import { checkLoginError } from "@/util/common";
|
||||
let timer;
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
codeValue: "",
|
||||
count: 60,
|
||||
userInfo: {
|
||||
mobile: "",
|
||||
region: "",
|
||||
email: "",
|
||||
code: "",
|
||||
type: "email",
|
||||
},
|
||||
isRegister: false,
|
||||
};
|
||||
},
|
||||
onLoad(options) {
|
||||
const {
|
||||
userInfo,
|
||||
isRegister,
|
||||
resend
|
||||
} = options;
|
||||
console.log(userInfo,isRegister)
|
||||
this.userInfo = JSON.parse(userInfo);
|
||||
this.isRegister = JSON.parse(isRegister);
|
||||
if(resend == 1){
|
||||
this.count = 0;
|
||||
this.getSmsAgain();
|
||||
}else{
|
||||
this.startCount();
|
||||
}
|
||||
},
|
||||
onReady() {},
|
||||
methods: {
|
||||
back() {
|
||||
uni.$u.route("/pages/login/common/index", {
|
||||
isRegister: this.isRegister,
|
||||
});
|
||||
},
|
||||
checkCode(value) {
|
||||
const options = {
|
||||
mobile: this.userInfo.mobile,
|
||||
email: this.userInfo.email,
|
||||
type: this.userInfo.type,
|
||||
region: `+${this.userInfo.region}`,
|
||||
event: this.isRegister ? 'register' : 'reset_pwd',
|
||||
code: value,
|
||||
};
|
||||
businessVerifyCode(options)
|
||||
.then(() => {
|
||||
if (this.isRegister) {
|
||||
uni.$u.route("/pages/common/setSelfInfo/index", {
|
||||
userInfo: JSON.stringify(this.userInfo),
|
||||
isRegister: this.isRegister,
|
||||
codeValue: this.codeValue,
|
||||
});
|
||||
} else {
|
||||
uni.$u.route("/pages/common/setPassword/index", {
|
||||
userInfo: JSON.stringify(this.userInfo),
|
||||
isRegister: !this.isRegister,
|
||||
codeValue: this.codeValue,
|
||||
});
|
||||
}
|
||||
})
|
||||
.catch((err) => {
|
||||
uni.$u.toast(checkLoginError(err));
|
||||
// uni.$u.toast('验证失败')
|
||||
});
|
||||
},
|
||||
startCount() {
|
||||
if (timer) {
|
||||
clearInterval(timer);
|
||||
}
|
||||
timer = setInterval(() => {
|
||||
if (this.count > 0) {
|
||||
this.count--;
|
||||
}
|
||||
}, 1000);
|
||||
},
|
||||
getSmsAgain() {
|
||||
if (this.count === 0) {
|
||||
const options = {
|
||||
mobile: this.userInfo.mobile,
|
||||
email: this.userInfo.email,
|
||||
type: this.userInfo.type,
|
||||
region: `+${this.userInfo.region}`,
|
||||
event: this.isRegister ? 'register' : 'reset_pwd',
|
||||
};
|
||||
businessSendSms(options)
|
||||
.then(() => {
|
||||
this.count = 60;
|
||||
this.startCount();
|
||||
uni.$u.toast("验证码已发送!");
|
||||
})
|
||||
.catch((err) => uni.$u.toast("验证码发送失败"));
|
||||
}
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.verify_code {
|
||||
margin-top: var(--status-bar-height);
|
||||
background: linear-gradient(180deg,
|
||||
rgba(0, 137, 255, 0.1) 0%,
|
||||
rgba(255, 255, 255, 0) 100%);
|
||||
|
||||
.title {
|
||||
padding-bottom: 6rpx;
|
||||
font-size: 44rpx;
|
||||
font-weight: 600;
|
||||
color: $u-primary;
|
||||
}
|
||||
|
||||
.sub_title {
|
||||
font-size: 24rpx;
|
||||
color: $u-tips-color;
|
||||
margin-top: 6rpx;
|
||||
}
|
||||
|
||||
.code_container {
|
||||
.code_title {
|
||||
font-size: 28rpx;
|
||||
margin-bottom: 24rpx;
|
||||
}
|
||||
|
||||
.code_des {
|
||||
margin-top: 24rpx;
|
||||
font-size: 24rpx;
|
||||
color: $u-tips-color;
|
||||
|
||||
.blue_text {
|
||||
color: $u-primary;
|
||||
|
||||
&:nth-child(2) {
|
||||
margin-left: 12rpx;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user