feat 代码优化

src/App.vue

@@ -89,13 +89,7 @@ const menu = (i: number) => {
       window.open("http://www.liebaoai.cn/", "_blank");
       break;
     case 2:
-      if (token) {
-        // window.open("http://open-doc.liebaoai.cn:88/", "_blank");
-        router.push('/docsCenter')
-      } else {
-        router.push('/login')
-        message.warning('请登录后再点击文档中心！')
-      }
+      router.push('/docsCenter')
       break;
     case 3:
       if (token) {

src/components/AreaSelect.vue

@@ -0,0 +1,24 @@
+<script setup lang='ts'>
+import areaData from "@/util//areadata";
+import { onMounted, reactive, ref } from 'vue'
+import emitter from '@/util/eventBus'
+
+let selectedValues = reactive({ arr: [] })
+const onChange = (value: any, selectedOptions: any) => {
+  let address = {
+    province: selectedOptions[0].name,
+    city: selectedOptions[1].name,
+    district: selectedOptions[2].name,
+  }
+  emitter.emit('confirmAddress', address)
+}
+onMounted(() => {
+
+})
+</script>
+<template>
+  <a-cascader size="large" :fieldNames="{ label: 'name', value: 'code', children: 'children' }" :options="areaData"
+    placeholder="请选择省市区" v-model="selectedValues.arr" @change="onChange" />
+</template>
+<style lang='scss' scoped>
+</style>

src/router/index.ts

@@ -66,7 +66,7 @@ const router = createRouter({
   routes
 });
 router.beforeEach((to, from, next) => {
-  let paths = ['/', '/login', 'docsCenter', '/register']
+  let paths = ['/', '/login', '/docsCenter', '/register']
   if (paths.includes(to.path)) {
     next()
   } else {

src/views/login/index.vue

@@ -116,7 +116,7 @@ const resetPw = () => {
 </script>
 <template>
   <div class="flex items-center justify-center login-bg !bg-center">
-    <div class="relative login-item !bg-center mx-200px mt-60px w-full rounded-10px bg-white">
+    <div class="relative login-item !bg-center mx-200px mt-60px w-full rounded-20px bg-white">
       <div class="absolute top-60px right-190px flex flex-col items-center">
         <div class="text-32px font-500 text-dark-600 leading-38px">优巨引擎开发平台</div>
         <div class="w-400px mt-28px">
@@ -131,18 +131,18 @@ const resetPw = () => {
           <div class="flex flex-col items-center w-full mt-30px">
             <a-form :model="formData" class="w-400px" v-if="!currentIdx">
               <a-form-item>
-                <a-input v-model:value="formData.mobile" class="h-50px text-16px" :maxlength="11" allowClear
+                <a-input size="large" v-model:value="formData.mobile" class=" text-16px" :maxlength="11" allowClear
                   placeholder="请输入手机号">
                   <template #prefix>
-                    <img class="w-28px h-28px" src="@/assets/images/17-1.png" alt="">
+                    <img class="w-25px h-25px" src="@/assets/images/17-1.png" alt="">
                   </template>
                 </a-input>
               </a-form-item>
               <a-form-item>
-                <a-input-password v-model:value="formData.password" autocomplete class="h-50px" allowClear
+                <a-input-password size="large" v-model:value="formData.password" autocomplete class="" allowClear
                   placeholder="请输入登录密码">
                   <template #prefix>
-                    <img class="w-28px h-28px" src="@/assets/images/17-2.png" alt="">
+                    <img class="w-25px h-25px" src="@/assets/images/17-2.png" alt="">
                   </template>
                 </a-input-password>
               </a-form-item>
@@ -152,14 +152,14 @@ const resetPw = () => {
                 </div>
               </a-form-item>
               <a-form-item>
-                <a-button @click="loginPw" :disabled="!formData.mobile || !formData.password" class="w-full h-50px"
+                <a-button size="large" @click="loginPw" :disabled="!formData.mobile || !formData.password" class="w-full "
                   type="primary">登 录
                 </a-button>
               </a-form-item>
             </a-form>
             <a-form :model="formData" class="w-400px" v-else>
               <a-form-item>
-                <a-input v-model:value="formData.mobile" class="h-50px text-16px" :maxlength="11" allowClear
+                <a-input size="large" v-model:value="formData.mobile" class=" text-16px" :maxlength="11" allowClear
                   placeholder="请输入手机号">
                   <template #prefix>
                     <img class="w-28px h-28px" src="@/assets/images/17-1.png" alt="">
@@ -168,13 +168,13 @@ const resetPw = () => {
               </a-form-item>
               <a-form-item>
                 <a-input-group compact>
-                  <a-input v-model:value="formData.code" allowClear placeholder="请输入验证码" class="h-50px"
+                  <a-input size="large" v-model:value="formData.code" allowClear placeholder="请输入验证码" class=""
                     style="width: calc(100% - 130px)">
                     <template #prefix>
                       <img class="w-28px h-28px" src="@/assets/images/17-4.png" alt="">
                     </template>
                   </a-input>
-                  <a-button @click="doSendSms(1)" :disabled="!canSendSms" class="w-110px h-50px ml-20px" type="primary">
+                  <a-button size="large" @click="doSendSms(1)" :disabled="!canSendSms" class="w-110px  ml-20px" type="primary">
                     {{
                         verifyText
                     }}
@@ -182,7 +182,7 @@ const resetPw = () => {
                 </a-input-group>
               </a-form-item>
               <a-form-item>
-                <a-button @click="loginCode" :disabled="!formData.mobile || !formData.code" class="w-full h-50px"
+                <a-button size="large" @click="loginCode" :disabled="!formData.mobile || !formData.code" class="w-full "
                   type="primary">登 录
                 </a-button>
               </a-form-item>
@@ -199,38 +199,38 @@ const resetPw = () => {
   <a-modal class="reset" v-model:visible="visibleReset" :footer="null" centered title="重置密码">
     <a-form :model="formState" class="w-400px mx-auto my-0">
       <a-form-item>
-        <a-input v-model:value="formState.mobile" :maxlength="11" allowClear placeholder="输入手机号">
+        <a-input size="large" v-model:value="formState.mobile" :maxlength="11" allowClear placeholder="输入手机号">
           <template #prefix>
             <MobileOutlined style="color: rgba(0, 0, 0, 0.25)" />
           </template>
         </a-input>
       </a-form-item>
       <a-form-item>
-        <a-input-password v-model:value="formState.newPassword" allowClear placeholder="输入新密码">
+        <a-input-password size="large" v-model:value="formState.newPassword" allowClear placeholder="输入新密码">
           <template #prefix>
             <LockOutlined style="color: rgba(0, 0, 0, 0.25)" />
           </template>
         </a-input-password>
       </a-form-item>
       <a-form-item>
-        <a-input-password v-model:value="formState.passwordAgain" allowClear placeholder="再次输入新密码">
+        <a-input-password size="large" v-model:value="formState.passwordAgain" allowClear placeholder="再次输入新密码">
           <template #prefix>
             <LockOutlined style="color: rgba(0, 0, 0, 0.25)" />
           </template>
         </a-input-password>
       </a-form-item>
       <a-form-item>
-        <a-input v-model:value="formState.code" :maxlength="4" placeholder="输入短信验证码" allowClear
+        <a-input size="large" v-model:value="formState.code" :maxlength="4" placeholder="输入短信验证码" allowClear
           style="width: calc(100% - 130px)">
           <template #prefix>
             <MailOutlined style="color: rgba(0, 0, 0, 0.25)" />
           </template>
         </a-input>
-        <a-button @click="doSendSms(2)" :disabled="!canSendSms" class="ml-20px w-110px" type="primary">{{ verifyText }}
+        <a-button size="large" @click="doSendSms(2)" :disabled="!canSendSms" class="ml-20px w-110px" type="primary">{{ verifyText }}
         </a-button>
       </a-form-item>
       <a-form-item>
-        <a-button @click="resetPw"
+        <a-button size="large" @click="resetPw"
           :disabled="!formState.mobile || !formState.newPassword || !formState.passwordAgain || !formState.code"
           class="w-full" type="primary">确认</a-button>
       </a-form-item>
@@ -245,6 +245,7 @@ const resetPw = () => {
   .login-item {
     background-image: url(@/assets/images/4-1.png);
     height: calc(100vh - 280px);
+    background-size: 100% 100%;
   }
 }
 

src/views/register/index.vue

@@ -1,6 +1,8 @@
 <script lang="ts">
 import { MobileOutlined, MailOutlined, LockOutlined, PlusOutlined, LoadingOutlined } from '@ant-design/icons-vue';
 import DevelopAgreement from '@/components/developAgreement.vue';
+import AreaSelect from "@/components/AreaSelect.vue";
+import emitter from '@/util/eventBus'
 
 export default defineComponent({
   name: 'register',
@@ -10,7 +12,8 @@ export default defineComponent({
     LockOutlined,
     PlusOutlined,
     LoadingOutlined,
-    DevelopAgreement
+    DevelopAgreement,
+    AreaSelect
   },
 })
 </script>
@@ -35,7 +38,7 @@ let fileList = ref([]);
 let time = ref<number>(60)
 let timer = ref<any>()
 let canSendSms = ref<boolean>(true)
-let labelCol = ref<object>({ style: { width: '200px' } })
+let labelCol = ref<object>({ style: { width: '140px' } })
 let action = ref<string>('http://153.37.175.42:8070/app/common/upload')
 let checked = ref<boolean>(false)
 let showAgreement = ref<boolean>(false)
@@ -161,7 +164,7 @@ const submit = async () => {
     formState.cityCode = addressComponent.citycode
     formState.districtName = addressComponent.district
   } else {
-    message.error('请正确填写企业地址的省市区')
+    message.error('请重新选择省市区')
   }
   if (!util.mobile(formState.mobile)) {
     return message.error('请填写正确格式的联系电话！')
@@ -241,15 +244,21 @@ const handleChange3 = (info: UploadChangeParam) => {
 const handleChange4 = (info: UploadChangeParam) => {
   handleChanges(info, 4)
 };
+emitter.on('confirmAddress', (address: any) => {
+  console.log('address:', address);
+  formState.provinceName = address.province
+  formState.cityName = address.city
+  formState.districtName = address.district
+})
 </script>
 <template>
   <div class=" pt-120px flex flex-col items-center">
     <a-steps :current="current" labelPlacement="vertical" class="w-700px">
       <a-step v-for="item in steps" :key="item" :title="item" />
     </a-steps>
-    <div class="mt-60px">
+    <div class="mt-60px w-700px flex justify-center">
       <!-- 账号信息 -->
-      <a-form v-if="current === 0" :model="formState" class="w-600px">
+      <a-form v-if="current === 0" :model="formState" class="w-700px">
         <a-form-item>
           <a-input size="large" v-model:value="formState.userAccount" :maxlength="11" allowClear placeholder="输入注册手机号">
             <template #prefix>
@@ -296,9 +305,9 @@ const handleChange4 = (info: UploadChangeParam) => {
         </a-form-item>
       </a-form>
       <!-- 资料提交 -->
-      <a-form v-if="current === 1" :model="formState" :label-col="labelCol">
+      <a-form v-if="current === 1" :model="formState" :label-col="labelCol" class="w-600px">
         <a-form-item label="企业地址" :rules="[{ required: true }]">
-          <a-input size="large" v-model:value="formState.address" allowClear placeholder="输入企业地址省市区" />
+          <AreaSelect />
           <a-textarea size="large" class="mt-24px" v-model:value="formState.street" placeholder="输入企业详细地址" />
         </a-form-item>
         <a-form-item label="企业名称" :rules="[{ required: true }]">