修改用户注册

src/layout/index.vue

@@ -240,7 +240,6 @@ provide('selectMenu', selectMenu)
 
     .top_3 {
       display: flex;
-      justify-content: space-between;
       .example-showcase .el-dropdown-link {
         cursor: pointer;
         color: #1c66e7;

src/views/demand/detail.vue

@@ -129,10 +129,8 @@ import { get } from 'lodash-es'
 const $checkRes = inject('$checkRes')
 // 接口
 import { DemandStore } from '@/store/api/platform/demand'
-import { AchievementStore } from '@/store/api/platform/achievement'
 import { DictDataStore } from '@/store/api/system/dictData'
 const store = DemandStore()
-const achievementStore = AchievementStore()
 const dictDataStore = DictDataStore()
 import { UserStore } from '@/store/user'
 const userStore = UserStore()
@@ -176,7 +174,7 @@ const searchAchieve = async (query = { skip: 0, limit }) => {
     is_use: '0',
     status: '1'
   }
-  const res = await achievementStore.query(info)
+  const res = await store.query(info)
   if (res.errcode == '0') {
     list.value = res.data
     total.value = res.total

src/views/innovation/detail.vue

@@ -81,7 +81,48 @@
           </el-col>
           <el-col :span="24" class="thr">
             <el-col :span="24" class="thr_1"> 相关推荐 </el-col>
-            <el-col :span="24" class="thr_2"> 1111 </el-col>
+            <el-col :span="24" class="thr_2">
+              <el-col
+                :span="11"
+                class="list"
+                v-for="(item, index) in list"
+                :key="index"
+                @click="toView(item)"
+              >
+                <div class="join" :class="[item.match_status == '0' ? 'join0' : 'join1']">
+                  {{ getDict(item.match_status, 'status') }}
+                </div>
+                <el-col :span="6" class="left">
+                  <el-image
+                    v-if="item.file && item.file.length > 0"
+                    class="image"
+                    :src="item.file[0].url"
+                    fit="fill"
+                  />
+                  <el-image v-else class="image" :src="news" fit="fill" />
+                </el-col>
+                <el-col :span="18" class="right">
+                  <el-col :span="24" class="right_1">
+                    <span class="type">{{ getDict(item.form, 'form') }}</span>
+                    <span class="title">{{ item.name || '暂无比赛名称' }}</span>
+                  </el-col>
+                  <el-col :span="24" class="right_2">
+                    组织单位：{{ item.organization || '暂无组织单位' }}
+                  </el-col>
+                  <el-col :span="24" class="right_3">
+                    <el-col :span="16" class="right_3Left">
+                      比赛日期：{{ getTime(item.time) }}
+                    </el-col>
+                    <el-col :span="8" class="right_3Right">
+                      {{ item.money || '免费' }}
+                    </el-col>
+                  </el-col>
+                  <el-col :span="24" class="right_4">
+                    <el-tag type="primary">{{ getDict(item.type, 'type') }}</el-tag>
+                  </el-col>
+                </el-col>
+              </el-col>
+            </el-col>
           </el-col>
         </div>
       </el-col>
@@ -106,6 +147,7 @@ const dictDataStore = DictDataStore()
 import news from '@/assets/news.png'
 // 路由
 const route = useRoute()
+const router = useRouter()
 // 加载中
 const loading = ref(false)
 const info = ref({})
@@ -143,11 +185,14 @@ const rules = reactive({
   brief: [{ required: true, message: '请输入简介', trigger: 'blur' }]
 })
 const dialog = ref(false)
+// 列表
+const list = ref([])
 // 请求
 onMounted(async () => {
   loading.value = true
   await searchOther()
   await search()
+  await searchMatch()
   loading.value = false
 })
 const searchOther = async () => {
@@ -162,7 +207,16 @@ const searchOther = async () => {
   result = await dictDataStore.query({ code: 'matchStatus', is_use: '0' })
   if ($checkRes(result)) statusList.value = result.data
 }
-
+const searchMatch = async () => {
+  const info = {
+    skip: 0,
+    limit: 10,
+    is_use: '0',
+    status: '1'
+  }
+  const res = await store.query(info)
+  if (res.errcode == '0') list.value = res.data
+}
 const search = async () => {
   let id = route.query.id
   if (id) {
@@ -191,6 +245,10 @@ const selectOpen = (key, keyPath) => {
     rulesInfo.value = { title: get(res, 'title'), key, content: get(info.value.rules, key) }
   }
 }
+// 查看
+const toView = (item) => {
+  router.push({ path: '/innovation/detail', query: { id: item.id || item._id } })
+}
 // 报名参赛
 const toSign = () => {
   dialog.value = true
@@ -396,6 +454,130 @@ provide('submitForm', submitForm)
       line-height: 18px;
       font-weight: 600;
     }
+    .thr_2 {
+      display: flex;
+      justify-content: space-around;
+      margin: 10px 0 0 0;
+      .list {
+        display: flex;
+        align-items: center;
+        min-height: 150px;
+        width: 100%;
+        margin-bottom: 10px;
+        position: relative;
+        overflow: hidden;
+        border: 1px solid #f5f5f5;
+        .left {
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          .image {
+            width: 120px;
+            height: 120px;
+          }
+        }
+        .right {
+          .right_1 {
+            padding: 10px 0 0 0;
+            .type {
+              padding-left: 4px;
+              padding-right: 4px;
+              height: 22px;
+              line-height: 20px;
+              background: #f8f9fc;
+              border-radius: 1px;
+              border: 1px solid #dde2e7;
+              font-size: 12px;
+              font-family:
+                PingFangSC-Regular,
+                PingFang SC;
+              font-weight: 400;
+              color: #a9b2c6;
+              text-align: center;
+              vertical-align: top;
+              display: inline-block;
+              margin-right: 8px;
+            }
+            .title {
+              max-width: 88%;
+              display: inline-block;
+              overflow: hidden;
+              text-overflow: ellipsis;
+              white-space: nowrap;
+              font-size: 16px;
+              font-family:
+                PingFangSC-Medium,
+                PingFang SC;
+              font-weight: 500;
+              color: #222;
+              line-height: 22px;
+            }
+          }
+          .right_2 {
+            padding: 5px 0;
+            font-size: 12px;
+            font-family:
+              PingFangSC-Regular,
+              PingFang SC;
+            font-weight: 400;
+            color: #666;
+          }
+          .right_3 {
+            padding: 5px 5px 5px 0;
+            display: flex;
+            justify-content: space-between;
+            .right_3Left {
+              font-size: 12px;
+              font-family:
+                PingFangSC-Regular,
+                PingFang SC;
+              font-weight: 400;
+              color: #949fb8;
+            }
+            .right_3Right {
+              text-align: right;
+              font-size: 16px;
+              font-family:
+                PingFangSC-Semibold,
+                PingFang SC;
+              font-weight: 600;
+              color: #ff5602;
+            }
+          }
+          .right_4 {
+            padding-top: 10px;
+            border-top: 1px solid #f3f3f3;
+          }
+        }
+        .join {
+          position: absolute;
+          right: -23px;
+          top: 10px;
+          font-size: 12px;
+          font-family:
+            PingFangSC-Normal,
+            PingFang SC;
+          color: #fff;
+          line-height: 21px;
+          height: 21px;
+          width: 100px;
+          text-align: center;
+          -ms-transform: rotate(45deg);
+          transform: rotate(45deg);
+          -webkit-transform: rotate(45deg);
+          -moz-transform: rotate(45deg);
+          padding-left: 9px;
+        }
+        .join0 {
+          background: #e6f4fe;
+          color: #638aa5;
+        }
+        .join1 {
+          background: #ededed;
+          color: #666c7d;
+        }
+      }
+    }
   }
 }
 </style>

src/views/login/index.vue

@@ -124,7 +124,9 @@
         </el-col>
       </el-col>
     </el-row>
-    <el-dialog v-model="dialog" title="使用协议">使用协议</el-dialog>
+    <el-dialog v-model="dialog" title="使用协议">
+      <div v-html="configInfo.agreement"></div>
+    </el-dialog>
   </div>
 </template>
 <script setup>
@@ -132,8 +134,11 @@
 import { siteInfo } from '@/layout/site'
 import { cloneDeep } from 'lodash-es'
 // 接口
+import { DesignStore } from '@/store/api/platform/design'
 import { LoginStore } from '@/store/api/login'
 const loginStore = LoginStore()
+const designStore = DesignStore()
+const $checkRes = inject('$checkRes')
 // 路由
 const router = useRouter()
 // 加载中
@@ -146,13 +151,18 @@ const rules = reactive({
   password: [{ required: true, message: '请输入密码', trigger: 'blur' }]
 })
 const activeName = ref(0)
+const configInfo = ref({})
 // 请求
 onMounted(async () => {
   loading.value = true
   search()
   loading.value = false
 })
-const search = async () => {}
+const search = async () => {
+  // 基础设置
+  const result = await designStore.query({})
+  if ($checkRes(result)) configInfo.value = result.data[0] || {}
+}
 // 选择
 const toTab = async (active) => {
   activeName.value = active

src/views/register/index.vue

@@ -4,14 +4,42 @@
       <el-col :span="24" class="main animate__animated animate__backInRight" v-loading="loading">
         <el-col :span="24" class="one">
           <div class="loginform">
-            <el-col :span="24" class="content">
-              <User></User>
+            <el-col :span="24" class="content_1">
+              <div class="type-list">
+                <el-tooltip
+                  v-for="(item, index) in typeList"
+                  :key="index"
+                  effect="dark"
+                  :content="item.remark"
+                  placement="top"
+                >
+                  <span
+                    class="span"
+                    :class="[item.value === type ? 'active' : '']"
+                    @click="toSelect(item.value)"
+                    >{{ item.label }}</span
+                  >
+                </el-tooltip>
+              </div>
+            </el-col>
+            <el-col :span="24" class="content_2">
+              <user v-if="type == '0'"></user>
+              <expert v-if="type == '1'"></expert>
+              <company v-if="type == '2'"></company>
+              <Incubator v-if="type == '3'"></Incubator>
+              <competition v-if="type == '4'"></competition>
+              <Investment v-if="type == '5'"></Investment>
+              <association v-if="type == '6'"></association>
+              <state v-if="type == '7'"></state>
+              <unit v-if="type == '8'"></unit>
             </el-col>
           </div>
         </el-col>
       </el-col>
     </el-row>
-    <el-dialog v-model="dialog" title="使用协议">使用协议</el-dialog>
+    <el-dialog v-model="dialog" title="使用协议">
+      <div v-html="configInfo.agreement"></div>
+    </el-dialog>
   </div>
 </template>
 <script setup>
@@ -21,44 +49,29 @@ import { cloneDeep } from 'lodash-es'
 // 接口
 import { UserStore } from '@/store/api/user/user'
 import { DictDataStore } from '@/store/api/system/dictData'
+import { DesignStore } from '@/store/api/platform/design'
 const store = UserStore()
 const dictDataStore = DictDataStore()
+const designStore = DesignStore()
 // 组件
-import User from './parts/user.vue'
+import user from './parts/user.vue'
+import association from './parts/association.vue'
+import company from './parts/company.vue'
+import competition from './parts/competition.vue'
+import expert from './parts/expert.vue'
+import Incubator from './parts/Incubator.vue'
+import state from './parts/state.vue'
+import unit from './parts/unit.vue'
+import Investment from './parts/Investment.vue'
 // 路由
 const router = useRouter()
 // 加载中
 const loading = ref(false)
 const form = ref({ role: ['user'] })
 const dialog = ref(false)
-const validatePhoneNumber = (rule, value, callback) => {
-  const reg = /^1[3-9]\d{9}$/
-  if (!value) {
-    return callback(new Error('手机号不能为空'))
-  }
-  if (!reg.test(value)) {
-    return callback(new Error('请输入正确的手机号'))
-  }
-  callback()
-}
-const validatePassword = (rule, value, callback) => {
-  if (!value) {
-    return callback(new Error('请输入确认密码'))
-  }
-  if (form.value.password !== value) {
-    callback(new Error('两次输入的密码不一致'))
-  } else {
-    callback()
-  }
-}
-const rules = reactive({
-  nick_name: [{ required: true, message: '请输入昵称', trigger: 'blur' }],
-  gender: [{ required: true, message: '请选择性别', trigger: 'blur' }],
-  phone: [{ required: true, validator: validatePhoneNumber, trigger: 'blur' }],
-  account: [{ required: true, message: '请输入账号', trigger: 'blur' }],
-  password: [{ required: true, message: '请输入密码', trigger: 'blur' }],
-  refpassword: [{ required: true, validator: validatePassword, trigger: 'blur' }]
-})
+const configInfo = ref({})
+const typeList = ref([])
+const type = ref('0')
 const isAgree = ref(false)
 const genderList = ref(false)
 // 请求
@@ -73,6 +86,12 @@ const searchOther = async () => {
   // 性别
   result = await dictDataStore.query({ code: 'gender', is_use: '0' })
   if ($checkRes(result)) genderList.value = result.data
+  // 用户类型
+  result = await dictDataStore.query({ code: 'userType', is_use: '0' })
+  if ($checkRes(result)) typeList.value = result.data
+  // 基础设置
+  result = await designStore.query({})
+  if ($checkRes(result)) configInfo.value = result.data[0] || {}
 }
 const search = async () => {
   // let res: IQueryResult = await toolsAxios.dataCount();
@@ -80,6 +99,10 @@ const search = async () => {
   //     info.value = res.data;
   // }
 }
+// 选择用户类型
+const toSelect = async (data) => {
+  type.value = data
+}
 // 注册
 const submitForm = async (formEl) => {
   if (!isAgree.value) {
@@ -118,7 +141,7 @@ const toBack = () => {
 // provide
 provide('siteInfo', siteInfo)
 provide('form', form)
-provide('rules', rules)
+provide('dialog', dialog)
 provide('isAgree', isAgree)
 provide('genderList', genderList)
 provide('submitForm', submitForm)
@@ -131,7 +154,7 @@ provide('toBack', toBack)
     background-image: url(@/assets/loginbg.jpeg);
     background-position: center center;
     background-repeat: no-repeat;
-    height: calc(100vh - 22.6vh);
+    height: calc(100vh - 23vh);
     width: 100%;
     background-size: cover;
     display: flex;
@@ -142,95 +165,47 @@ provide('toBack', toBack)
       position: absolute;
       top: 50%;
       left: 50%;
-      min-height: 460px;
+      min-height: 400px;
       background: hsla(0, 0%, 100%, 0.6);
       box-shadow: 0 0 30px 0 rgba(51, 51, 51, 0.2);
       -webkit-transform: translate(-50%, -50%);
       transform: translate(-50%, -50%);
       border-top: 10px solid #1492ff;
 
-      .tab {
-        display: flex;
-        align-items: center;
-        justify-content: center;
-
-        .title {
-          text-align: center;
-          margin: 0 20px;
-          font-family: PingFangSC-Semibold !important;
-          font-size: 15px;
-          letter-spacing: -0.14px;
-          line-height: 30px;
-          font-weight: bold;
-        }
-
-        .tab0 {
-          color: #1492ff;
-          border-bottom: 2px solid;
-          border-bottom-color: #1492ff;
-          padding-bottom: 10px;
-        }
-
-        .tab1 {
-          color: #333333;
-          padding-bottom: 10px;
-        }
-      }
-
-      .content {
-        margin: 30px 30px 0 30px;
-        overflow-y: auto;
-
-        .remark {
-          display: flex;
-          justify-content: space-between;
-
-          span {
-            cursor: pointer;
-            font-family: PingFangSC-Regular;
-            font-size: 14px;
-            color: #333333;
-            letter-spacing: -0.09px;
-            text-align: right;
-            line-height: 32px;
+      .content_1 {
+        text-align: center;
+        padding: 10px;
+        .type-list {
+          margin: 10px 0 0 0;
+          .span {
+            padding: 0 10px;
+            margin-left: 5px;
+            height: 26px;
+            line-height: 24px;
+            border: 1px solid #ddd;
+            border-radius: 3px;
+            background-color: #f4f4f4;
           }
-
-          span:hover {
-            color: #2374ff;
+          .span:hover {
+            border-color: #3497fc;
+            background-color: #d2f1fe;
           }
-        }
-
-        .button {
-          padding: 10px 0;
-
-          :deep(.el-button) {
-            width: 100% !important;
-            height: 44px !important;
-            border: 0 !important;
-            color: #f8f8f8 !important;
-            font-size: 16px !important;
-            text-align: center !important;
-            line-height: 40px !important;
-            cursor: pointer !important;
-            font-family: PingFangSC-Regular !important;
-            background-color: #1492ff !important;
+          .active {
+            border-color: #3497fc;
+            background-color: #d2f1fe;
+            background-image: url(@/assets/icon_2.png);
+            background-position: top right;
+            background-repeat: no-repeat;
           }
         }
+      }
 
-        .agree {
-          display: flex;
-          align-items: center;
-          padding: 0 0 40px 0;
-          color: #999;
-          font-size: 12px;
-
-          span:last-child {
-            color: #2374ff;
-          }
-        }
+      .content_2 {
+        margin: 0 20px;
+        overflow-y: auto;
       }
 
-      .content::-webkit-scrollbar {
+      .content_2::-webkit-scrollbar {
         display: none;
       }
     }

src/views/register/parts/Incubator.vue

@@ -0,0 +1,187 @@
+<template>
+  <div class="index">
+    <el-form
+      ref="ruleFormRef"
+      :model="form"
+      :rules="rules"
+      label-width="80px"
+      class="form"
+      label-position="left"
+    >
+      <el-form-item label="账号" prop="account">
+        <el-input v-model="form.account" placeholder="请输入账号">
+          <template #prefix>
+            <el-icon>
+              <User />
+            </el-icon>
+          </template>
+        </el-input>
+      </el-form-item>
+      <el-form-item label="密码" prop="password">
+        <el-input
+          v-model="form.password"
+          type="password"
+          show-password
+          placeholder="请输入登录密码"
+        >
+          <template #prefix>
+            <el-icon>
+              <Unlock />
+            </el-icon>
+          </template>
+        </el-input>
+      </el-form-item>
+      <el-form-item label="确认密码" prop="refpassword">
+        <el-input
+          v-model="form.refpassword"
+          type="password"
+          show-password
+          placeholder="请再次确认输入密码"
+        >
+          <template #prefix>
+            <el-icon>
+              <Unlock />
+            </el-icon>
+          </template>
+        </el-input>
+      </el-form-item>
+      <el-form-item label="昵称" prop="nick_name">
+        <el-input v-model="form.nick_name" placeholder="请输入昵称">
+          <template #prefix>
+            <el-icon>
+              <Avatar />
+            </el-icon>
+          </template>
+        </el-input>
+      </el-form-item>
+      <el-form-item label="性别" prop="gender">
+        <el-select v-model="form.gender" placeholder="请选择性别">
+          <el-option
+            v-for="(item, index) in genderList"
+            :key="index"
+            :label="item.label"
+            :value="item.value"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="手机号" prop="phone">
+        <el-input v-model="form.phone" placeholder="请输入手机号">
+          <template #prefix>
+            <el-icon>
+              <Iphone />
+            </el-icon>
+          </template>
+        </el-input>
+      </el-form-item>
+      <el-col :span="24" class="remark">
+        <span @click="toLogin">已有账号去登录</span>
+        <span @click="toBack">返回首页</span>
+      </el-col>
+      <el-col :span="24" class="button">
+        <el-button type="primary" @click="submitForm(ruleFormRef)">注册</el-button>
+      </el-col>
+      <el-col :span="24" class="agree">
+        <el-checkbox v-model="isAgree"></el-checkbox>
+        <span style="margin: 0 0 0 5px">我已阅读并同意</span>
+        <span @click="dialog = true">《{{ siteInfo.zhTitle }}使用协议》</span>
+      </el-col>
+    </el-form>
+  </div>
+</template>
+<script setup>
+const siteInfo = inject('siteInfo')
+const form = inject('form')
+const dialog = inject('dialog')
+const isAgree = inject('isAgree')
+const genderList = inject('genderList')
+const ruleFormRef = inject('ruleFormRef')
+const submitForm = inject('submitForm')
+const toLogin = inject('toLogin')
+const toBack = inject('toBack')
+const validatePhoneNumber = (rule, value, callback) => {
+  const reg = /^1[3-9]\d{9}$/
+  if (!value) {
+    return callback(new Error('手机号不能为空'))
+  }
+  if (!reg.test(value)) {
+    return callback(new Error('请输入正确的手机号'))
+  }
+  callback()
+}
+const validatePassword = (rule, value, callback) => {
+  if (!value) {
+    return callback(new Error('请输入确认密码'))
+  }
+  if (form.value.password !== value) {
+    callback(new Error('两次输入的密码不一致'))
+  } else {
+    callback()
+  }
+}
+const rules = reactive({
+  nick_name: [{ required: true, message: '请输入昵称', trigger: 'blur' }],
+  gender: [{ required: true, message: '请选择性别', trigger: 'blur' }],
+  phone: [{ required: true, validator: validatePhoneNumber, trigger: 'blur' }],
+  account: [{ required: true, message: '请输入账号', trigger: 'blur' }],
+  password: [{ required: true, message: '请输入密码', trigger: 'blur' }],
+  refpassword: [{ required: true, validator: validatePassword, trigger: 'blur' }]
+})
+</script>
+<style scoped lang="scss">
+.index {
+  margin: 10px 30px 0 30px;
+  overflow-y: auto;
+
+  .remark {
+    display: flex;
+    justify-content: space-between;
+
+    span {
+      cursor: pointer;
+      font-family: PingFangSC-Regular;
+      font-size: 14px;
+      color: #333333;
+      letter-spacing: -0.09px;
+      text-align: right;
+      line-height: 32px;
+    }
+
+    span:hover {
+      color: #2374ff;
+    }
+  }
+
+  .button {
+    padding: 10px 0;
+
+    :deep(.el-button) {
+      width: 100% !important;
+      height: 44px !important;
+      border: 0 !important;
+      color: #f8f8f8 !important;
+      font-size: 16px !important;
+      text-align: center !important;
+      line-height: 40px !important;
+      cursor: pointer !important;
+      font-family: PingFangSC-Regular !important;
+      background-color: #1492ff !important;
+    }
+  }
+
+  .agree {
+    display: flex;
+    align-items: center;
+    padding: 0 0 10px 0;
+    color: #999;
+    font-size: 12px;
+
+    span:last-child {
+      color: #2374ff;
+    }
+  }
+}
+
+.index::-webkit-scrollbar {
+  display: none;
+}
+</style>

src/views/register/parts/Investment.vue

@@ -0,0 +1,187 @@
+<template>
+  <div class="index">
+    <el-form
+      ref="ruleFormRef"
+      :model="form"
+      :rules="rules"
+      label-width="80px"
+      class="form"
+      label-position="left"
+    >
+      <el-form-item label="账号" prop="account">
+        <el-input v-model="form.account" placeholder="请输入账号">
+          <template #prefix>
+            <el-icon>
+              <User />
+            </el-icon>
+          </template>
+        </el-input>
+      </el-form-item>
+      <el-form-item label="密码" prop="password">
+        <el-input
+          v-model="form.password"
+          type="password"
+          show-password
+          placeholder="请输入登录密码"
+        >
+          <template #prefix>
+            <el-icon>
+              <Unlock />
+            </el-icon>
+          </template>
+        </el-input>
+      </el-form-item>
+      <el-form-item label="确认密码" prop="refpassword">
+        <el-input
+          v-model="form.refpassword"
+          type="password"
+          show-password
+          placeholder="请再次确认输入密码"
+        >
+          <template #prefix>
+            <el-icon>
+              <Unlock />
+            </el-icon>
+          </template>
+        </el-input>
+      </el-form-item>
+      <el-form-item label="昵称" prop="nick_name">
+        <el-input v-model="form.nick_name" placeholder="请输入昵称">
+          <template #prefix>
+            <el-icon>
+              <Avatar />
+            </el-icon>
+          </template>
+        </el-input>
+      </el-form-item>
+      <el-form-item label="性别" prop="gender">
+        <el-select v-model="form.gender" placeholder="请选择性别">
+          <el-option
+            v-for="(item, index) in genderList"
+            :key="index"
+            :label="item.label"
+            :value="item.value"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="手机号" prop="phone">
+        <el-input v-model="form.phone" placeholder="请输入手机号">
+          <template #prefix>
+            <el-icon>
+              <Iphone />
+            </el-icon>
+          </template>
+        </el-input>
+      </el-form-item>
+      <el-col :span="24" class="remark">
+        <span @click="toLogin">已有账号去登录</span>
+        <span @click="toBack">返回首页</span>
+      </el-col>
+      <el-col :span="24" class="button">
+        <el-button type="primary" @click="submitForm(ruleFormRef)">注册</el-button>
+      </el-col>
+      <el-col :span="24" class="agree">
+        <el-checkbox v-model="isAgree"></el-checkbox>
+        <span style="margin: 0 0 0 5px">我已阅读并同意</span>
+        <span @click="dialog = true">《{{ siteInfo.zhTitle }}使用协议》</span>
+      </el-col>
+    </el-form>
+  </div>
+</template>
+<script setup>
+const siteInfo = inject('siteInfo')
+const form = inject('form')
+const dialog = inject('dialog')
+const isAgree = inject('isAgree')
+const genderList = inject('genderList')
+const ruleFormRef = inject('ruleFormRef')
+const submitForm = inject('submitForm')
+const toLogin = inject('toLogin')
+const toBack = inject('toBack')
+const validatePhoneNumber = (rule, value, callback) => {
+  const reg = /^1[3-9]\d{9}$/
+  if (!value) {
+    return callback(new Error('手机号不能为空'))
+  }
+  if (!reg.test(value)) {
+    return callback(new Error('请输入正确的手机号'))
+  }
+  callback()
+}
+const validatePassword = (rule, value, callback) => {
+  if (!value) {
+    return callback(new Error('请输入确认密码'))
+  }
+  if (form.value.password !== value) {
+    callback(new Error('两次输入的密码不一致'))
+  } else {
+    callback()
+  }
+}
+const rules = reactive({
+  nick_name: [{ required: true, message: '请输入昵称', trigger: 'blur' }],
+  gender: [{ required: true, message: '请选择性别', trigger: 'blur' }],
+  phone: [{ required: true, validator: validatePhoneNumber, trigger: 'blur' }],
+  account: [{ required: true, message: '请输入账号', trigger: 'blur' }],
+  password: [{ required: true, message: '请输入密码', trigger: 'blur' }],
+  refpassword: [{ required: true, validator: validatePassword, trigger: 'blur' }]
+})
+</script>
+<style scoped lang="scss">
+.index {
+  margin: 10px 30px 0 30px;
+  overflow-y: auto;
+
+  .remark {
+    display: flex;
+    justify-content: space-between;
+
+    span {
+      cursor: pointer;
+      font-family: PingFangSC-Regular;
+      font-size: 14px;
+      color: #333333;
+      letter-spacing: -0.09px;
+      text-align: right;
+      line-height: 32px;
+    }
+
+    span:hover {
+      color: #2374ff;
+    }
+  }
+
+  .button {
+    padding: 10px 0;
+
+    :deep(.el-button) {
+      width: 100% !important;
+      height: 44px !important;
+      border: 0 !important;
+      color: #f8f8f8 !important;
+      font-size: 16px !important;
+      text-align: center !important;
+      line-height: 40px !important;
+      cursor: pointer !important;
+      font-family: PingFangSC-Regular !important;
+      background-color: #1492ff !important;
+    }
+  }
+
+  .agree {
+    display: flex;
+    align-items: center;
+    padding: 0 0 10px 0;
+    color: #999;
+    font-size: 12px;
+
+    span:last-child {
+      color: #2374ff;
+    }
+  }
+}
+
+.index::-webkit-scrollbar {
+  display: none;
+}
+</style>

src/views/register/parts/association.vue

@@ -0,0 +1,187 @@
+<template>
+  <div class="index">
+    <el-form
+      ref="ruleFormRef"
+      :model="form"
+      :rules="rules"
+      label-width="80px"
+      class="form"
+      label-position="left"
+    >
+      <el-form-item label="账号" prop="account">
+        <el-input v-model="form.account" placeholder="请输入账号">
+          <template #prefix>
+            <el-icon>
+              <User />
+            </el-icon>
+          </template>
+        </el-input>
+      </el-form-item>
+      <el-form-item label="密码" prop="password">
+        <el-input
+          v-model="form.password"
+          type="password"
+          show-password
+          placeholder="请输入登录密码"
+        >
+          <template #prefix>
+            <el-icon>
+              <Unlock />
+            </el-icon>
+          </template>
+        </el-input>
+      </el-form-item>
+      <el-form-item label="确认密码" prop="refpassword">
+        <el-input
+          v-model="form.refpassword"
+          type="password"
+          show-password
+          placeholder="请再次确认输入密码"
+        >
+          <template #prefix>
+            <el-icon>
+              <Unlock />
+            </el-icon>
+          </template>
+        </el-input>
+      </el-form-item>
+      <el-form-item label="昵称" prop="nick_name">
+        <el-input v-model="form.nick_name" placeholder="请输入昵称">
+          <template #prefix>
+            <el-icon>
+              <Avatar />
+            </el-icon>
+          </template>
+        </el-input>
+      </el-form-item>
+      <el-form-item label="性别" prop="gender">
+        <el-select v-model="form.gender" placeholder="请选择性别">
+          <el-option
+            v-for="(item, index) in genderList"
+            :key="index"
+            :label="item.label"
+            :value="item.value"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="手机号" prop="phone">
+        <el-input v-model="form.phone" placeholder="请输入手机号">
+          <template #prefix>
+            <el-icon>
+              <Iphone />
+            </el-icon>
+          </template>
+        </el-input>
+      </el-form-item>
+      <el-col :span="24" class="remark">
+        <span @click="toLogin">已有账号去登录</span>
+        <span @click="toBack">返回首页</span>
+      </el-col>
+      <el-col :span="24" class="button">
+        <el-button type="primary" @click="submitForm(ruleFormRef)">注册</el-button>
+      </el-col>
+      <el-col :span="24" class="agree">
+        <el-checkbox v-model="isAgree"></el-checkbox>
+        <span style="margin: 0 0 0 5px">我已阅读并同意</span>
+        <span @click="dialog = true">《{{ siteInfo.zhTitle }}使用协议》</span>
+      </el-col>
+    </el-form>
+  </div>
+</template>
+<script setup>
+const siteInfo = inject('siteInfo')
+const form = inject('form')
+const dialog = inject('dialog')
+const isAgree = inject('isAgree')
+const genderList = inject('genderList')
+const ruleFormRef = inject('ruleFormRef')
+const submitForm = inject('submitForm')
+const toLogin = inject('toLogin')
+const toBack = inject('toBack')
+const validatePhoneNumber = (rule, value, callback) => {
+  const reg = /^1[3-9]\d{9}$/
+  if (!value) {
+    return callback(new Error('手机号不能为空'))
+  }
+  if (!reg.test(value)) {
+    return callback(new Error('请输入正确的手机号'))
+  }
+  callback()
+}
+const validatePassword = (rule, value, callback) => {
+  if (!value) {
+    return callback(new Error('请输入确认密码'))
+  }
+  if (form.value.password !== value) {
+    callback(new Error('两次输入的密码不一致'))
+  } else {
+    callback()
+  }
+}
+const rules = reactive({
+  nick_name: [{ required: true, message: '请输入昵称', trigger: 'blur' }],
+  gender: [{ required: true, message: '请选择性别', trigger: 'blur' }],
+  phone: [{ required: true, validator: validatePhoneNumber, trigger: 'blur' }],
+  account: [{ required: true, message: '请输入账号', trigger: 'blur' }],
+  password: [{ required: true, message: '请输入密码', trigger: 'blur' }],
+  refpassword: [{ required: true, validator: validatePassword, trigger: 'blur' }]
+})
+</script>
+<style scoped lang="scss">
+.index {
+  margin: 10px 30px 0 30px;
+  overflow-y: auto;
+
+  .remark {
+    display: flex;
+    justify-content: space-between;
+
+    span {
+      cursor: pointer;
+      font-family: PingFangSC-Regular;
+      font-size: 14px;
+      color: #333333;
+      letter-spacing: -0.09px;
+      text-align: right;
+      line-height: 32px;
+    }
+
+    span:hover {
+      color: #2374ff;
+    }
+  }
+
+  .button {
+    padding: 10px 0;
+
+    :deep(.el-button) {
+      width: 100% !important;
+      height: 44px !important;
+      border: 0 !important;
+      color: #f8f8f8 !important;
+      font-size: 16px !important;
+      text-align: center !important;
+      line-height: 40px !important;
+      cursor: pointer !important;
+      font-family: PingFangSC-Regular !important;
+      background-color: #1492ff !important;
+    }
+  }
+
+  .agree {
+    display: flex;
+    align-items: center;
+    padding: 0 0 10px 0;
+    color: #999;
+    font-size: 12px;
+
+    span:last-child {
+      color: #2374ff;
+    }
+  }
+}
+
+.index::-webkit-scrollbar {
+  display: none;
+}
+</style>

src/views/register/parts/company.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="user">
+  <div class="index">
     <el-form
       ref="ruleFormRef"
       :model="form"
@@ -64,8 +64,8 @@
           />
         </el-select>
       </el-form-item>
-      <el-form-item label="联系电话" prop="phone">
-        <el-input v-model="form.phone" placeholder="请输入联系电话">
+      <el-form-item label="手机号" prop="phone">
+        <el-input v-model="form.phone" placeholder="请输入手机号">
           <template #prefix>
             <el-icon>
               <Iphone />
@@ -91,16 +91,45 @@
 <script setup>
 const siteInfo = inject('siteInfo')
 const form = inject('form')
-const rules = inject('rules')
+const dialog = inject('dialog')
 const isAgree = inject('isAgree')
+const genderList = inject('genderList')
 const ruleFormRef = inject('ruleFormRef')
 const submitForm = inject('submitForm')
 const toLogin = inject('toLogin')
 const toBack = inject('toBack')
+const validatePhoneNumber = (rule, value, callback) => {
+  const reg = /^1[3-9]\d{9}$/
+  if (!value) {
+    return callback(new Error('手机号不能为空'))
+  }
+  if (!reg.test(value)) {
+    return callback(new Error('请输入正确的手机号'))
+  }
+  callback()
+}
+const validatePassword = (rule, value, callback) => {
+  if (!value) {
+    return callback(new Error('请输入确认密码'))
+  }
+  if (form.value.password !== value) {
+    callback(new Error('两次输入的密码不一致'))
+  } else {
+    callback()
+  }
+}
+const rules = reactive({
+  nick_name: [{ required: true, message: '请输入昵称', trigger: 'blur' }],
+  gender: [{ required: true, message: '请选择性别', trigger: 'blur' }],
+  phone: [{ required: true, validator: validatePhoneNumber, trigger: 'blur' }],
+  account: [{ required: true, message: '请输入账号', trigger: 'blur' }],
+  password: [{ required: true, message: '请输入密码', trigger: 'blur' }],
+  refpassword: [{ required: true, validator: validatePassword, trigger: 'blur' }]
+})
 </script>
 <style scoped lang="scss">
-.user {
-  margin: 30px 30px 0 30px;
+.index {
+  margin: 10px 30px 0 30px;
   overflow-y: auto;
 
   .remark {
@@ -142,7 +171,7 @@ const toBack = inject('toBack')
   .agree {
     display: flex;
     align-items: center;
-    padding: 0 0 40px 0;
+    padding: 0 0 10px 0;
     color: #999;
     font-size: 12px;
 
@@ -152,7 +181,7 @@ const toBack = inject('toBack')
   }
 }
 
-.user::-webkit-scrollbar {
+.index::-webkit-scrollbar {
   display: none;
 }
 </style>

src/views/register/parts/competition.vue

@@ -0,0 +1,187 @@
+<template>
+  <div class="index">
+    <el-form
+      ref="ruleFormRef"
+      :model="form"
+      :rules="rules"
+      label-width="80px"
+      class="form"
+      label-position="left"
+    >
+      <el-form-item label="账号" prop="account">
+        <el-input v-model="form.account" placeholder="请输入账号">
+          <template #prefix>
+            <el-icon>
+              <User />
+            </el-icon>
+          </template>
+        </el-input>
+      </el-form-item>
+      <el-form-item label="密码" prop="password">
+        <el-input
+          v-model="form.password"
+          type="password"
+          show-password
+          placeholder="请输入登录密码"
+        >
+          <template #prefix>
+            <el-icon>
+              <Unlock />
+            </el-icon>
+          </template>
+        </el-input>
+      </el-form-item>
+      <el-form-item label="确认密码" prop="refpassword">
+        <el-input
+          v-model="form.refpassword"
+          type="password"
+          show-password
+          placeholder="请再次确认输入密码"
+        >
+          <template #prefix>
+            <el-icon>
+              <Unlock />
+            </el-icon>
+          </template>
+        </el-input>
+      </el-form-item>
+      <el-form-item label="昵称" prop="nick_name">
+        <el-input v-model="form.nick_name" placeholder="请输入昵称">
+          <template #prefix>
+            <el-icon>
+              <Avatar />
+            </el-icon>
+          </template>
+        </el-input>
+      </el-form-item>
+      <el-form-item label="性别" prop="gender">
+        <el-select v-model="form.gender" placeholder="请选择性别">
+          <el-option
+            v-for="(item, index) in genderList"
+            :key="index"
+            :label="item.label"
+            :value="item.value"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="手机号" prop="phone">
+        <el-input v-model="form.phone" placeholder="请输入手机号">
+          <template #prefix>
+            <el-icon>
+              <Iphone />
+            </el-icon>
+          </template>
+        </el-input>
+      </el-form-item>
+      <el-col :span="24" class="remark">
+        <span @click="toLogin">已有账号去登录</span>
+        <span @click="toBack">返回首页</span>
+      </el-col>
+      <el-col :span="24" class="button">
+        <el-button type="primary" @click="submitForm(ruleFormRef)">注册</el-button>
+      </el-col>
+      <el-col :span="24" class="agree">
+        <el-checkbox v-model="isAgree"></el-checkbox>
+        <span style="margin: 0 0 0 5px">我已阅读并同意</span>
+        <span @click="dialog = true">《{{ siteInfo.zhTitle }}使用协议》</span>
+      </el-col>
+    </el-form>
+  </div>
+</template>
+<script setup>
+const siteInfo = inject('siteInfo')
+const form = inject('form')
+const dialog = inject('dialog')
+const isAgree = inject('isAgree')
+const genderList = inject('genderList')
+const ruleFormRef = inject('ruleFormRef')
+const submitForm = inject('submitForm')
+const toLogin = inject('toLogin')
+const toBack = inject('toBack')
+const validatePhoneNumber = (rule, value, callback) => {
+  const reg = /^1[3-9]\d{9}$/
+  if (!value) {
+    return callback(new Error('手机号不能为空'))
+  }
+  if (!reg.test(value)) {
+    return callback(new Error('请输入正确的手机号'))
+  }
+  callback()
+}
+const validatePassword = (rule, value, callback) => {
+  if (!value) {
+    return callback(new Error('请输入确认密码'))
+  }
+  if (form.value.password !== value) {
+    callback(new Error('两次输入的密码不一致'))
+  } else {
+    callback()
+  }
+}
+const rules = reactive({
+  nick_name: [{ required: true, message: '请输入昵称', trigger: 'blur' }],
+  gender: [{ required: true, message: '请选择性别', trigger: 'blur' }],
+  phone: [{ required: true, validator: validatePhoneNumber, trigger: 'blur' }],
+  account: [{ required: true, message: '请输入账号', trigger: 'blur' }],
+  password: [{ required: true, message: '请输入密码', trigger: 'blur' }],
+  refpassword: [{ required: true, validator: validatePassword, trigger: 'blur' }]
+})
+</script>
+<style scoped lang="scss">
+.index {
+  margin: 10px 30px 0 30px;
+  overflow-y: auto;
+
+  .remark {
+    display: flex;
+    justify-content: space-between;
+
+    span {
+      cursor: pointer;
+      font-family: PingFangSC-Regular;
+      font-size: 14px;
+      color: #333333;
+      letter-spacing: -0.09px;
+      text-align: right;
+      line-height: 32px;
+    }
+
+    span:hover {
+      color: #2374ff;
+    }
+  }
+
+  .button {
+    padding: 10px 0;
+
+    :deep(.el-button) {
+      width: 100% !important;
+      height: 44px !important;
+      border: 0 !important;
+      color: #f8f8f8 !important;
+      font-size: 16px !important;
+      text-align: center !important;
+      line-height: 40px !important;
+      cursor: pointer !important;
+      font-family: PingFangSC-Regular !important;
+      background-color: #1492ff !important;
+    }
+  }
+
+  .agree {
+    display: flex;
+    align-items: center;
+    padding: 0 0 10px 0;
+    color: #999;
+    font-size: 12px;
+
+    span:last-child {
+      color: #2374ff;
+    }
+  }
+}
+
+.index::-webkit-scrollbar {
+  display: none;
+}
+</style>

src/views/register/parts/expert.vue

@@ -0,0 +1,187 @@
+<template>
+  <div class="index">
+    <el-form
+      ref="ruleFormRef"
+      :model="form"
+      :rules="rules"
+      label-width="80px"
+      class="form"
+      label-position="left"
+    >
+      <el-form-item label="账号" prop="account">
+        <el-input v-model="form.account" placeholder="请输入账号">
+          <template #prefix>
+            <el-icon>
+              <User />
+            </el-icon>
+          </template>
+        </el-input>
+      </el-form-item>
+      <el-form-item label="密码" prop="password">
+        <el-input
+          v-model="form.password"
+          type="password"
+          show-password
+          placeholder="请输入登录密码"
+        >
+          <template #prefix>
+            <el-icon>
+              <Unlock />
+            </el-icon>
+          </template>
+        </el-input>
+      </el-form-item>
+      <el-form-item label="确认密码" prop="refpassword">
+        <el-input
+          v-model="form.refpassword"
+          type="password"
+          show-password
+          placeholder="请再次确认输入密码"
+        >
+          <template #prefix>
+            <el-icon>
+              <Unlock />
+            </el-icon>
+          </template>
+        </el-input>
+      </el-form-item>
+      <el-form-item label="昵称" prop="nick_name">
+        <el-input v-model="form.nick_name" placeholder="请输入昵称">
+          <template #prefix>
+            <el-icon>
+              <Avatar />
+            </el-icon>
+          </template>
+        </el-input>
+      </el-form-item>
+      <el-form-item label="性别" prop="gender">
+        <el-select v-model="form.gender" placeholder="请选择性别">
+          <el-option
+            v-for="(item, index) in genderList"
+            :key="index"
+            :label="item.label"
+            :value="item.value"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="手机号" prop="phone">
+        <el-input v-model="form.phone" placeholder="请输入手机号">
+          <template #prefix>
+            <el-icon>
+              <Iphone />
+            </el-icon>
+          </template>
+        </el-input>
+      </el-form-item>
+      <el-col :span="24" class="remark">
+        <span @click="toLogin">已有账号去登录</span>
+        <span @click="toBack">返回首页</span>
+      </el-col>
+      <el-col :span="24" class="button">
+        <el-button type="primary" @click="submitForm(ruleFormRef)">注册</el-button>
+      </el-col>
+      <el-col :span="24" class="agree">
+        <el-checkbox v-model="isAgree"></el-checkbox>
+        <span style="margin: 0 0 0 5px">我已阅读并同意</span>
+        <span @click="dialog = true">《{{ siteInfo.zhTitle }}使用协议》</span>
+      </el-col>
+    </el-form>
+  </div>
+</template>
+<script setup>
+const siteInfo = inject('siteInfo')
+const form = inject('form')
+const dialog = inject('dialog')
+const isAgree = inject('isAgree')
+const genderList = inject('genderList')
+const ruleFormRef = inject('ruleFormRef')
+const submitForm = inject('submitForm')
+const toLogin = inject('toLogin')
+const toBack = inject('toBack')
+const validatePhoneNumber = (rule, value, callback) => {
+  const reg = /^1[3-9]\d{9}$/
+  if (!value) {
+    return callback(new Error('手机号不能为空'))
+  }
+  if (!reg.test(value)) {
+    return callback(new Error('请输入正确的手机号'))
+  }
+  callback()
+}
+const validatePassword = (rule, value, callback) => {
+  if (!value) {
+    return callback(new Error('请输入确认密码'))
+  }
+  if (form.value.password !== value) {
+    callback(new Error('两次输入的密码不一致'))
+  } else {
+    callback()
+  }
+}
+const rules = reactive({
+  nick_name: [{ required: true, message: '请输入昵称', trigger: 'blur' }],
+  gender: [{ required: true, message: '请选择性别', trigger: 'blur' }],
+  phone: [{ required: true, validator: validatePhoneNumber, trigger: 'blur' }],
+  account: [{ required: true, message: '请输入账号', trigger: 'blur' }],
+  password: [{ required: true, message: '请输入密码', trigger: 'blur' }],
+  refpassword: [{ required: true, validator: validatePassword, trigger: 'blur' }]
+})
+</script>
+<style scoped lang="scss">
+.index {
+  margin: 10px 30px 0 30px;
+  overflow-y: auto;
+
+  .remark {
+    display: flex;
+    justify-content: space-between;
+
+    span {
+      cursor: pointer;
+      font-family: PingFangSC-Regular;
+      font-size: 14px;
+      color: #333333;
+      letter-spacing: -0.09px;
+      text-align: right;
+      line-height: 32px;
+    }
+
+    span:hover {
+      color: #2374ff;
+    }
+  }
+
+  .button {
+    padding: 10px 0;
+
+    :deep(.el-button) {
+      width: 100% !important;
+      height: 44px !important;
+      border: 0 !important;
+      color: #f8f8f8 !important;
+      font-size: 16px !important;
+      text-align: center !important;
+      line-height: 40px !important;
+      cursor: pointer !important;
+      font-family: PingFangSC-Regular !important;
+      background-color: #1492ff !important;
+    }
+  }
+
+  .agree {
+    display: flex;
+    align-items: center;
+    padding: 0 0 10px 0;
+    color: #999;
+    font-size: 12px;
+
+    span:last-child {
+      color: #2374ff;
+    }
+  }
+}
+
+.index::-webkit-scrollbar {
+  display: none;
+}
+</style>

src/views/register/parts/state.vue

@@ -0,0 +1,187 @@
+<template>
+  <div class="index">
+    <el-form
+      ref="ruleFormRef"
+      :model="form"
+      :rules="rules"
+      label-width="80px"
+      class="form"
+      label-position="left"
+    >
+      <el-form-item label="账号" prop="account">
+        <el-input v-model="form.account" placeholder="请输入账号">
+          <template #prefix>
+            <el-icon>
+              <User />
+            </el-icon>
+          </template>
+        </el-input>
+      </el-form-item>
+      <el-form-item label="密码" prop="password">
+        <el-input
+          v-model="form.password"
+          type="password"
+          show-password
+          placeholder="请输入登录密码"
+        >
+          <template #prefix>
+            <el-icon>
+              <Unlock />
+            </el-icon>
+          </template>
+        </el-input>
+      </el-form-item>
+      <el-form-item label="确认密码" prop="refpassword">
+        <el-input
+          v-model="form.refpassword"
+          type="password"
+          show-password
+          placeholder="请再次确认输入密码"
+        >
+          <template #prefix>
+            <el-icon>
+              <Unlock />
+            </el-icon>
+          </template>
+        </el-input>
+      </el-form-item>
+      <el-form-item label="昵称" prop="nick_name">
+        <el-input v-model="form.nick_name" placeholder="请输入昵称">
+          <template #prefix>
+            <el-icon>
+              <Avatar />
+            </el-icon>
+          </template>
+        </el-input>
+      </el-form-item>
+      <el-form-item label="性别" prop="gender">
+        <el-select v-model="form.gender" placeholder="请选择性别">
+          <el-option
+            v-for="(item, index) in genderList"
+            :key="index"
+            :label="item.label"
+            :value="item.value"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="手机号" prop="phone">
+        <el-input v-model="form.phone" placeholder="请输入手机号">
+          <template #prefix>
+            <el-icon>
+              <Iphone />
+            </el-icon>
+          </template>
+        </el-input>
+      </el-form-item>
+      <el-col :span="24" class="remark">
+        <span @click="toLogin">已有账号去登录</span>
+        <span @click="toBack">返回首页</span>
+      </el-col>
+      <el-col :span="24" class="button">
+        <el-button type="primary" @click="submitForm(ruleFormRef)">注册</el-button>
+      </el-col>
+      <el-col :span="24" class="agree">
+        <el-checkbox v-model="isAgree"></el-checkbox>
+        <span style="margin: 0 0 0 5px">我已阅读并同意</span>
+        <span @click="dialog = true">《{{ siteInfo.zhTitle }}使用协议》</span>
+      </el-col>
+    </el-form>
+  </div>
+</template>
+<script setup>
+const siteInfo = inject('siteInfo')
+const form = inject('form')
+const dialog = inject('dialog')
+const isAgree = inject('isAgree')
+const genderList = inject('genderList')
+const ruleFormRef = inject('ruleFormRef')
+const submitForm = inject('submitForm')
+const toLogin = inject('toLogin')
+const toBack = inject('toBack')
+const validatePhoneNumber = (rule, value, callback) => {
+  const reg = /^1[3-9]\d{9}$/
+  if (!value) {
+    return callback(new Error('手机号不能为空'))
+  }
+  if (!reg.test(value)) {
+    return callback(new Error('请输入正确的手机号'))
+  }
+  callback()
+}
+const validatePassword = (rule, value, callback) => {
+  if (!value) {
+    return callback(new Error('请输入确认密码'))
+  }
+  if (form.value.password !== value) {
+    callback(new Error('两次输入的密码不一致'))
+  } else {
+    callback()
+  }
+}
+const rules = reactive({
+  nick_name: [{ required: true, message: '请输入昵称', trigger: 'blur' }],
+  gender: [{ required: true, message: '请选择性别', trigger: 'blur' }],
+  phone: [{ required: true, validator: validatePhoneNumber, trigger: 'blur' }],
+  account: [{ required: true, message: '请输入账号', trigger: 'blur' }],
+  password: [{ required: true, message: '请输入密码', trigger: 'blur' }],
+  refpassword: [{ required: true, validator: validatePassword, trigger: 'blur' }]
+})
+</script>
+<style scoped lang="scss">
+.index {
+  margin: 10px 30px 0 30px;
+  overflow-y: auto;
+
+  .remark {
+    display: flex;
+    justify-content: space-between;
+
+    span {
+      cursor: pointer;
+      font-family: PingFangSC-Regular;
+      font-size: 14px;
+      color: #333333;
+      letter-spacing: -0.09px;
+      text-align: right;
+      line-height: 32px;
+    }
+
+    span:hover {
+      color: #2374ff;
+    }
+  }
+
+  .button {
+    padding: 10px 0;
+
+    :deep(.el-button) {
+      width: 100% !important;
+      height: 44px !important;
+      border: 0 !important;
+      color: #f8f8f8 !important;
+      font-size: 16px !important;
+      text-align: center !important;
+      line-height: 40px !important;
+      cursor: pointer !important;
+      font-family: PingFangSC-Regular !important;
+      background-color: #1492ff !important;
+    }
+  }
+
+  .agree {
+    display: flex;
+    align-items: center;
+    padding: 0 0 10px 0;
+    color: #999;
+    font-size: 12px;
+
+    span:last-child {
+      color: #2374ff;
+    }
+  }
+}
+
+.index::-webkit-scrollbar {
+  display: none;
+}
+</style>

src/views/register/parts/unit.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="user">
+  <div class="index">
     <el-form
       ref="ruleFormRef"
       :model="form"
@@ -64,8 +64,8 @@
           />
         </el-select>
       </el-form-item>
-      <el-form-item label="联系电话" prop="phone">
-        <el-input v-model="form.phone" placeholder="请输入联系电话">
+      <el-form-item label="手机号" prop="phone">
+        <el-input v-model="form.phone" placeholder="请输入手机号">
           <template #prefix>
             <el-icon>
               <Iphone />
@@ -91,16 +91,45 @@
 <script setup>
 const siteInfo = inject('siteInfo')
 const form = inject('form')
-const rules = inject('rules')
+const dialog = inject('dialog')
 const isAgree = inject('isAgree')
+const genderList = inject('genderList')
 const ruleFormRef = inject('ruleFormRef')
 const submitForm = inject('submitForm')
 const toLogin = inject('toLogin')
 const toBack = inject('toBack')
+const validatePhoneNumber = (rule, value, callback) => {
+  const reg = /^1[3-9]\d{9}$/
+  if (!value) {
+    return callback(new Error('手机号不能为空'))
+  }
+  if (!reg.test(value)) {
+    return callback(new Error('请输入正确的手机号'))
+  }
+  callback()
+}
+const validatePassword = (rule, value, callback) => {
+  if (!value) {
+    return callback(new Error('请输入确认密码'))
+  }
+  if (form.value.password !== value) {
+    callback(new Error('两次输入的密码不一致'))
+  } else {
+    callback()
+  }
+}
+const rules = reactive({
+  nick_name: [{ required: true, message: '请输入昵称', trigger: 'blur' }],
+  gender: [{ required: true, message: '请选择性别', trigger: 'blur' }],
+  phone: [{ required: true, validator: validatePhoneNumber, trigger: 'blur' }],
+  account: [{ required: true, message: '请输入账号', trigger: 'blur' }],
+  password: [{ required: true, message: '请输入密码', trigger: 'blur' }],
+  refpassword: [{ required: true, validator: validatePassword, trigger: 'blur' }]
+})
 </script>
 <style scoped lang="scss">
-.user {
-  margin: 30px 30px 0 30px;
+.index {
+  margin: 10px 30px 0 30px;
   overflow-y: auto;
 
   .remark {
@@ -142,7 +171,7 @@ const toBack = inject('toBack')
   .agree {
     display: flex;
     align-items: center;
-    padding: 0 0 40px 0;
+    padding: 0 0 10px 0;
     color: #999;
     font-size: 12px;
 
@@ -152,7 +181,7 @@ const toBack = inject('toBack')
   }
 }
 
-.user::-webkit-scrollbar {
+.index::-webkit-scrollbar {
   display: none;
 }
 </style>

src/views/register/parts/user.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="user">
+  <div class="index">
     <el-form
       ref="ruleFormRef"
       :model="form"
@@ -91,17 +91,45 @@
 <script setup>
 const siteInfo = inject('siteInfo')
 const form = inject('form')
-const rules = inject('rules')
+const dialog = inject('dialog')
 const isAgree = inject('isAgree')
 const genderList = inject('genderList')
 const ruleFormRef = inject('ruleFormRef')
 const submitForm = inject('submitForm')
 const toLogin = inject('toLogin')
 const toBack = inject('toBack')
+const validatePhoneNumber = (rule, value, callback) => {
+  const reg = /^1[3-9]\d{9}$/
+  if (!value) {
+    return callback(new Error('手机号不能为空'))
+  }
+  if (!reg.test(value)) {
+    return callback(new Error('请输入正确的手机号'))
+  }
+  callback()
+}
+const validatePassword = (rule, value, callback) => {
+  if (!value) {
+    return callback(new Error('请输入确认密码'))
+  }
+  if (form.value.password !== value) {
+    callback(new Error('两次输入的密码不一致'))
+  } else {
+    callback()
+  }
+}
+const rules = reactive({
+  nick_name: [{ required: true, message: '请输入昵称', trigger: 'blur' }],
+  gender: [{ required: true, message: '请选择性别', trigger: 'blur' }],
+  phone: [{ required: true, validator: validatePhoneNumber, trigger: 'blur' }],
+  account: [{ required: true, message: '请输入账号', trigger: 'blur' }],
+  password: [{ required: true, message: '请输入密码', trigger: 'blur' }],
+  refpassword: [{ required: true, validator: validatePassword, trigger: 'blur' }]
+})
 </script>
 <style scoped lang="scss">
-.user {
-  margin: 30px 30px 0 30px;
+.index {
+  margin: 10px 30px 0 30px;
   overflow-y: auto;
 
   .remark {
@@ -143,7 +171,7 @@ const toBack = inject('toBack')
   .agree {
     display: flex;
     align-items: center;
-    padding: 0 0 40px 0;
+    padding: 0 0 10px 0;
     color: #999;
     font-size: 12px;
 
@@ -153,7 +181,7 @@ const toBack = inject('toBack')
   }
 }
 
-.user::-webkit-scrollbar {
+.index::-webkit-scrollbar {
   display: none;
 }
 </style>