This commit is contained in:
cansnow
2025-12-23 00:18:46 +08:00
parent 59d1ba9a7e
commit f49f1f1ad1
54 changed files with 25338 additions and 333 deletions
+1 -1
View File
@@ -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>
+390
View File
@@ -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>
+5 -5
View File
@@ -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>
+143
View File
@@ -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>
+156
View File
@@ -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">620至少包含数字字母</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>
+201
View File
@@ -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">620至少包含数字字母</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>
+171
View File
@@ -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>