From 85428f0bf3bbf08d65200cffc38dd1e96af34da6 Mon Sep 17 00:00:00 2001
From: zhangwei <1504152376@qq.com>
Date: 星期一, 07 七月 2025 22:25:17 +0800
Subject: [PATCH] '-'
---
src/views/register/registernav.vue | 328 +++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 323 insertions(+), 5 deletions(-)
diff --git a/src/views/register/registernav.vue b/src/views/register/registernav.vue
index 12f11ea..7a2967d 100644
--- a/src/views/register/registernav.vue
+++ b/src/views/register/registernav.vue
@@ -1,25 +1,335 @@
<template>
- <div class="content">
+ <div class="content pb-6">
<div class="header">
<div class="headimg">
<img width="167px" height="44px" src="@/assets/home/logo.png" alt="" />
</div>
</div>
- <div class="center w-[70%] h-[584px] bg-white mx-auto mt-25">
- <el-button type="primary">淇濆瓨</el-button>
+ <div class="center w-[70%] bg-white mx-auto m-12">
+ <div class="flex items-center p-5 pl-6">
+ <img src="@/assets/home/xian.png" alt="" />
+ <span style="margin-left: 5px">娉ㄥ唽鍚戝</span>
+ </div>
+ <div class="w-[95%] border-1 border-[#E5E5E5] mx-auto pt-5 pb-2">
+ <el-steps style="max-width: 100%" :active="active" align-center>
+ <el-step title="闃呰娉ㄥ唽鍗忚" />
+ <el-step title="濉啓鍩烘湰淇℃伅" />
+ <el-step title="淇℃伅鐧昏瀹屾垚" />
+ </el-steps>
+ </div>
+ <div v-if="active == 1" class="h-[50%]">
+ <div class="text-center pt-5 pb-1.5">娉ㄥ唽鏉℃</div>
+ <div
+ class="w-[95%] h-[82%] border-1 border-[#E5E5E5] mx-auto p-2 overflow-y-auto"
+ >
+ <h3>娉ㄥ唽閲囪喘渚涘簲鍟嗗簲鍏峰浠ヤ笅鏉′欢</h3>
+ </div>
+ </div>
+ <div v-else-if="active == 2" class="flex justify-center mt-5">
+ <el-form
+ ref="ruleFormRef"
+ style="width: 95%"
+ :model="state.ruleForm"
+ :rules="state.rules"
+ label-width="auto"
+ >
+ <el-row>
+ <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+ <el-form-item label="浼佷笟绫诲瀷">
+ <el-select v-model="state.type" placeholder="璇烽�夋嫨" clearable>
+ <el-option label="鎴愮珛" value="Valid" />
+ <el-option label="椹冲洖" value="Rejected" />
+ <el-option label="鍏跺畠" value="Other" />
+ </el-select>
+ </el-form-item>
+ </el-col>
+ </el-row>
+ <el-row><div class="baseclass">鍩烘湰璧勬枡</div></el-row>
+ <el-row>
+ <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+ <el-form-item label="浜ゆ槗涓讳綋">
+ <el-input
+ v-model="state.ruleForm.nickName"
+ placeholder="璇疯緭鍏�"
+ />
+ </el-form-item>
+ </el-col>
+ </el-row>
+ <el-row>
+ <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+ <el-form-item label="钀ヤ笟鎵х収">
+ <el-upload>
+ <el-button type="primary">涓婁紶</el-button>
+ </el-upload>
+ </el-form-item>
+ </el-col>
+ </el-row>
+ <el-row>
+ <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+ <el-form-item label="浼佷笟鍚嶇О">
+ <el-input
+ v-model="state.ruleForm.nickName"
+ placeholder="璇疯緭鍏�"
+ />
+ </el-form-item>
+ </el-col>
+ </el-row>
+ <el-row>
+ <el-col :xs="24" :sm="24" :md="12" :lg="8" :xl="8">
+ <el-form-item label="缁熶竴绀句細淇＄敤浠ｇ爜">
+ <el-input
+ v-model="state.ruleForm.nickName"
+ placeholder="璇疯緭鍏�"
+ />
+ </el-form-item>
+ </el-col>
+ <el-col :xs="24" :sm="24" :md="12" :lg="8" :xl="8">
+ <el-form-item label="娉ㄥ唽璧勯噾">
+ <el-input
+ v-model="state.ruleForm.nickName"
+ placeholder="璇疯緭鍏�"
+ >
+ <template #append>涓囧厓</template></el-input
+ >
+ </el-form-item>
+ </el-col>
+ <el-col :xs="24" :sm="24" :md="24" :lg="8" :xl="8">
+ <el-form-item label="娉曞畾浠ｈ〃浜�">
+ <el-input
+ v-model="state.ruleForm.nickName"
+ placeholder="璇疯緭鍏�"
+ />
+ </el-form-item>
+ </el-col>
+
+ <el-col :xs="24" :sm="24" :md="24" :lg="16" :xl="16">
+ <el-form-item label="浣忔墍鍦�">
+ <el-input
+ v-model="state.ruleForm.nickName"
+ placeholder="璇疯緭鍏�"
+ />
+ </el-form-item>
+ </el-col>
+
+ <el-col :xs="24" :sm="24" :md="12" :lg="8" :xl="8">
+ <el-form-item label="鑱旂郴鐢佃瘽">
+ <el-input
+ v-model="state.ruleForm.nickName"
+ placeholder="璇疯緭鍏�"
+ />
+ </el-form-item>
+ </el-col>
+
+ <el-col :xs="24" :sm="24" :md="12" :lg="8" :xl="8">
+ <el-form-item label="鎴愮珛鏃堕棿">
+ <el-input
+ v-model="state.ruleForm.nickName"
+ placeholder="璇疯緭鍏�"
+ />
+ </el-form-item>
+ </el-col>
+
+ <el-col :xs="24" :sm="24" :md="12" :lg="8" :xl="8">
+ <el-form-item label="涓昏惀涓氬姟">
+ <el-input
+ v-model="state.ruleForm.nickName"
+ placeholder="璇疯緭鍏�"
+ />
+ </el-form-item>
+ </el-col>
+
+ <el-col :xs="24" :sm="24" :md="12" :lg="8" :xl="8">
+ <el-form-item label="閭">
+ <el-input
+ v-model="state.ruleForm.nickName"
+ placeholder="璇疯緭鍏�"
+ />
+ </el-form-item>
+ </el-col>
+ </el-row>
+ <el-row>
+ <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+ <el-form-item label="娉曞畾浠ｈ〃浜�">
+ <el-upload>
+ <el-button type="primary">涓婁紶韬唤璇�</el-button>
+ </el-upload>
+ </el-form-item>
+ </el-col>
+ </el-row>
+ <el-row>
+ <el-col :xs="24" :sm="24" :md="12" :lg="8" :xl="8">
+ <el-form-item label="濮撳悕">
+ <el-input
+ v-model="state.ruleForm.nickName"
+ placeholder="璇疯緭鍏�"
+ />
+ </el-form-item>
+ </el-col>
+ <el-col :xs="24" :sm="24" :md="12" :lg="8" :xl="8">
+ <el-form-item label="韬唤璇�">
+ <el-input
+ v-model="state.ruleForm.nickName"
+ placeholder="璇疯緭鍏�"
+ />
+ </el-form-item>
+ </el-col>
+ <el-col :xs="24" :sm="24" :md="12" :lg="8" :xl="8">
+ <el-form-item label="鑱旂郴鐢佃瘽">
+ <el-input
+ v-model="state.ruleForm.nickName"
+ placeholder="璇疯緭鍏�"
+ />
+ </el-form-item>
+ </el-col>
+ </el-row>
+ <el-row>
+ <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+ <el-form-item label="涓氬姟缁忓姙浜�">
+ <el-upload>
+ <el-button type="primary">涓婁紶韬唤璇�</el-button>
+ </el-upload>
+ </el-form-item>
+ </el-col>
+ </el-row>
+ <el-row>
+ <el-col :xs="24" :sm="24" :md="12" :lg="8" :xl="8">
+ <el-form-item label="濮撳悕">
+ <el-input
+ v-model="state.ruleForm.nickName"
+ placeholder="璇疯緭鍏�"
+ />
+ </el-form-item>
+ </el-col>
+ <el-col :xs="24" :sm="24" :md="12" :lg="8" :xl="8">
+ <el-form-item label="韬唤璇�">
+ <el-input
+ v-model="state.ruleForm.nickName"
+ placeholder="璇疯緭鍏�"
+ />
+ </el-form-item>
+ </el-col>
+ <el-col :xs="24" :sm="24" :md="12" :lg="8" :xl="8">
+ <el-form-item label="鑱旂郴鐢佃瘽">
+ <el-input
+ v-model="state.ruleForm.nickName"
+ placeholder="璇疯緭鍏�"
+ />
+ </el-form-item>
+ </el-col>
+ <el-col :xs="24" :sm="24" :md="12" :lg="8" :xl="8">
+ <el-form-item label="寮�鎴疯">
+ <el-input
+ v-model="state.ruleForm.nickName"
+ placeholder="璇疯緭鍏�"
+ />
+ </el-form-item>
+ </el-col>
+ <el-col :xs="24" :sm="24" :md="24" :lg="16" :xl="16">
+ <el-form-item label="閾惰璐﹀彿">
+ <el-input
+ v-model="state.ruleForm.nickName"
+ placeholder="璇疯緭鍏�"
+ />
+ </el-form-item>
+ </el-col>
+ </el-row>
+ </el-form>
+ </div>
+ <div class="mx-auto pt-2 pb-5 flex justify-center">
+ <el-button :disabled="active == 1" @click="backStep">涓婁竴姝�</el-button>
+ <el-button type="primary" @click="nextStep"
+ ><span v-if="active == 1">鍚屾剰</span>涓嬩竴姝�</el-button
+ >
+ </div>
</div>
</div>
+ <ReDialog />
</template>
-<script setup>
+<script setup lang="ts">
+import { h, ref, reactive } from "vue";
+import type { FormInstance, FormRules } from "element-plus";
+import { ReDialog } from "@/components/ReDialog";
+
defineOptions({
name: "RegisterNav"
});
+const ruleFormRef = ref<FormInstance>();
+const state = reactive({
+ isShowPassword: false,
+ ruleForm: {
+ account: "",
+ nickName: "",
+ phone: "",
+ phoneVCode: "",
+ // tenantId: props.tenantInfo.id,
+ code: "",
+ codeId: 0,
+ email: "",
+ exRoleCode: ""
+ },
+ type: "",
+ rules: {
+ phoneVCode: [
+ {
+ required: true,
+ message: "璇疯緭鍏ユ墜鏈洪獙璇佺爜",
+ trigger: "blur"
+ }
+ ],
+ nickName: [
+ {
+ required: true,
+ message: "璇疯緭鍏ュ鍚�",
+ trigger: "blur"
+ }
+ ],
+ phone: [
+ {
+ required: true,
+ message: "璇疯緭鍏ユ偍鐨勬墜鏈哄彿鐮�",
+ trigger: "blur"
+ }
+ ],
+ exRoleCode: [
+ {
+ required: true,
+ message: "璇烽�夋嫨瑙掕壊",
+ trigger: "blur"
+ }
+ ]
+ // code: [{ required: true, message: t('message.account.placeholder4'), trigger: 'blur' }],
+ },
+ loading: {
+ signIn: false
+ },
+ captchaImage: "",
+ rotateVerifyVisible: false,
+ // rotateVerifyImg: verifyImg,
+ // rotateVerifyImg: themeConfig.value.logoUrl,
+ secondVerEnabled: false,
+ // captchaEnabled: false,
+ isPassRotate: false,
+ capsLockVisible: false,
+ hideTenantForLogin: false,
+ expirySeconds: 60, // 楠岃瘉鐮佽繃鏈熸椂闂�
+ phoneSeconds: 0, // 鎵嬫満楠岃瘉鐮佸�掕鏃�
+ roleList: []
+});
+
+let active = ref(1);
+const nextStep = () => {
+ active.value += 1;
+ console.log(active.value + 1);
+};
+const backStep = () => {
+ active.value -= 1;
+};
</script>
<style lang="scss" scoped>
.content {
background-color: #f8f8f8;
width: 100%;
- height: 100%;
+ // height: 100%;
.header {
display: flex;
align-items: center;
@@ -32,5 +342,13 @@
margin: 0 auto;
}
}
+ :deep .el-step__icon {
+ font-size: 12px;
+ height: 20px;
+ width: 20px;
+ }
+}
+:deep .el-step__title {
+ font-size: 12px;
}
</style>
--
Gitblit v1.9.1