frontend-app/pages/rwa_add/rwa_add.vue

<template>
	<view class="rwa_add_warp">
		<Header leftTitle="注册交易所账户" left-path-type="navigateTo" left-path="/pages/rwa/rwa"/>
		<view class="rwa_add_content">
			<view class="rwa_add_form">
				<view class="rwa_add_item">
					<view class="rwa_add_item_title">交易所名称,示例值(ALPHACEX)</view>
					<up-input
					    placeholder="请输入交易所名称"
					    border="surround"
					    v-model="form.name"
						:customStyle="inputCss"
						disabled
					></up-input>
				</view>
				<view class="rwa_add_item">
					<view class="rwa_add_item_title">输入邮箱</view>
					<up-input
					    placeholder="请输入邮箱账户"
					    border="surround"
					    v-model="form.email"
						:customStyle="inputCss"
						disabled
					></up-input>
				</view>
				<view class="rwa_add_item">
					<view class="rwa_add_item_title">验证码</view>
					<up-input
						placeholder="请输入邮箱验证码"
						border="surround"
						v-model="form.emailCode"
						:customStyle="inputCss"
					>
						<template #suffix style="margin-right: 10rpx;">
							<view v-if="countdown" class="code-warp">
								<up-count-down :time="60 * 1000" format="ss" @finish="countdown = false"></up-count-down>
								<text style="margin-left: 10rpx;">s</text>
							</view>
							<view v-else @click="getMobileCode" class="code_msg">
								获取验证码
							</view>
						</template>
					</up-input>
				</view>
				<view class="rwa_add_item">
					<view class="rwa_add_item_title">登录密码</view>
					<up-input
					    placeholder="请输入登录密码"
					    border="surround"
					    v-model="form.password"
						:customStyle="inputCss"
					></up-input>
					<view class="rwa_add_item_msg">注：密码只能8-20位，数字+英文组合</view>
				</view>
			</view>
			<view class="add_but_css" @click="addRwa">
				创建
			</view>
		</view>
		<up-toast ref="uToastRef"></up-toast>
	</view>
</template>

<script>
	import Header from '@/components/header.vue';
	import { registerExchUser,sentEmailCode } from '@/api/finance.js';
	import { SMS_TYPE } from '@/utils/enumUtils.js';
	
	export default {
		components:{Header},
		data() {
			return {
				inputCss:{
					"height":'80rpx',
					"background": "#F5F5F5",
					"border-radius": "20rpx",
					"border": "0rpx",
					"padding-left": "16px",
				},
				form:{
					email:null,
					emailCode:null,
					password:null,
					name:null,
				},
				countdown:false,// 清空倒计时
			};
		},
		onLoad(option) {
			const email = option.email;
			if(email){
				this.form.email = email;
			}
			const name = option.name;
			if(name){
				this.form.name = name;
			}
		},
		methods: {
			async addRwa(){
				const params = this.form;
				
				if(!params.emailCode){
					this.$refs.uToastRef.show({
						type: 'error',
						message: "请输入邮箱账户验证码",
					});
					return;
				}
				if(!params.password){
					this.$refs.uToastRef.show({
						type: 'error',
						message: "请输入登录密码",
					});
					return;
				}else {
					const regex = /^[a-zA-Z0-9]{8,20}$/;
					if(!regex.test(params.password)){
						this.$refs.uToastRef.show({
							type: 'error',
							message: "登录密码只能8-20位，数字+英文组合",
						});
						return;
					}
				}
				
				const resp = await registerExchUser(params);
				if(resp.bizcode === 100){
					this.$refs.uToastRef.show({
						type: 'success',
						message: "添加成功",
					});
					setTimeout(()=>{
						uni.navigateTo({
							url:'/pages/rwa/rwa',
						})
					},2000)
				}
			},
			/**
			 * 获取手机验证码
			 */
			async getMobileCode(){
				const form = this.form;
				if(!form.email){
					this.$refs.uToastRef.show({
						type: 'error',
						message: "请输入账号",
					});
					return;
				}
				
				this.countdown = true;
				
				const params={
					email:form.email,
				}
				const response = await sentEmailCode(params);
				console.log("responseresponseresponse",response);
				if(response && response.bizcode === 100){
					this.$refs.uToastRef.show({
						type: 'success',
						message: response.msg,
					});
				}else{
					this.countdown = false;
				}
			},
		}
	}
</script>

<style lang="less">
.rwa_add_warp{
	background: #F5F5F5;
	.rwa_add_content{
		padding: 20rpx;
		height: calc(100vh - 198rpx);
	}
	.rwa_add_form{
		background: #FFFFFF;
		border-radius: 24rpx;
		padding: 30rpx;
		margin-bottom: 60rpx;
		.rwa_add_item{
			margin-bottom: 20rpx;
			.rwa_add_item_title{
				margin-bottom: 10rpx;
				font-weight: bold;
				font-size: 30rpx;
				color: #333333;
			}
			.rwa_add_item_msg{
				font-size: 20rpx;
				margin-top: 10rpx;
				color: red;
			}
		}
	}
}
</style>