登录界面添加新用户注册功能

src/views/login/components/login-form.vue

@@ -52,12 +52,66 @@
         <a-button type="primary" html-type="submit" long :loading="loading">
           {{ $t('login.form.login') }}
         </a-button>
+        <div class="container">
+          没有账户？
+          <button class="register-button" @click="showRegisterModal = true">
+            <span>
+              注册
+            </span>
+          </button>
+        </div>
         <!-- <a-button type="text" long class="login-form-register-btn">
           {{ $t('login.form.register') }}
         </a-button> -->
       </a-space>
     </a-form>
   </div>
+  <a-modal
+    v-model:visible="showRegisterModal"
+    title="注册账户"
+    @ok="handleRegister()"
+    @cancel="showRegisterModal = false"
+  >
+    <a-form
+      ref="registerForm"
+      :model="registerInfo"
+      class="register-form"
+      layout="vertical"
+    >
+      <a-form-item field="loginName" :rules="[{ required: true, message: '请输入用户名!' }]" hide-label>
+        <a-input v-model="registerInfo.loginName" placeholder="请输入用户名">
+        </a-input>
+      </a-form-item>
+
+      <a-form-item field="email" :rules="[{ required: true, message: '请输入邮箱!' }]" hide-label>
+        <a-input v-model="registerInfo.email" placeholder="请输入邮箱">
+        </a-input>
+      </a-form-item>
+
+      <a-form-item field="userName" :rules="[{ required: true, message: '请输入姓名!' }]" hide-label>
+        <a-input v-model="registerInfo.userName" placeholder="请输入姓名">
+        </a-input>
+      </a-form-item>
+
+      <a-form-item field="phoneNumber" :rules="[{ required: true, message: '请输入电话号码!' }]" hide-label>
+        <a-input v-model="registerInfo.phoneNumber" placeholder="请输入电话号码">
+        </a-input>
+      </a-form-item>
+
+      <a-form-item field="psw" :rules="[{ required: true, message: '请输入密码!' }]" hide-label>
+        <a-input-password v-model="registerInfo.psw" placeholder="请输入密码">
+        </a-input-password>
+      </a-form-item>
+
+      <a-space direction="vertical" size="large">
+        <a-select :style="{width:'320px'}" placeholder="选择Tenant"  v-model="registerInfo.selectedTenant" allow-create>
+          <a-option :value="registerInfo.loginName">{{ registerInfo.loginName }}</a-option>
+          <a-option>1</a-option>
+          <a-option>2</a-option>
+        </a-select>
+      </a-space>
+    </a-form>
+  </a-modal>
 </template>
 
 <script lang="ts" setup>
@@ -71,6 +125,7 @@
   import useLoading from '@/hooks/loading';
   import type { LoginData } from '@/api/user';
   import { rsaPsw } from '@/utils/ras';
+  import axios from 'axios';
 
   const router = useRouter();
   const { t } = useI18n();
@@ -134,6 +189,45 @@
   const setRememberPassword = (value: boolean) => {
     loginConfig.value.rememberPassword = value;
   };
+
+  const showRegisterModal = ref(false);
+  const registerInfo = reactive({
+    createTime: '',
+    deptName: '',
+    email: '',
+    loginName: '',
+    nickName: '',
+    phoneNumber: '',
+    psw: '',
+    role: '',
+    status: '',
+    userId: '',
+    userName: '',
+  });
+
+  const handleRegister = async () => {
+    const user = {
+      createTime: registerInfo.createTime,
+      deptName: registerInfo.deptName,
+      email: registerInfo.email,
+      loginName: registerInfo.loginName,
+      nickName: registerInfo.nickName,
+      phoneNumber: registerInfo.phoneNumber,
+      psw: registerInfo.psw,
+      role: registerInfo.role,
+      status: registerInfo.status,
+      userId: registerInfo.userId,
+      userName: registerInfo.userName,
+    };
+    try {
+      const response = await axios.post('/system/sign_in', { user });
+      console.log('注册成功：', response.data);
+      showRegisterModal.value = false;
+    } catch (error) {
+      console.error('注册失败：', error);
+    }
+  };
+
 </script>
 
 <style lang="less" scoped>
@@ -170,4 +264,25 @@
       color: var(--color-text-3) !important;
     }
   }
+  .container {
+    text-align: right;
+    padding: 1px;
+  }
+  .register-button {
+    display: inline-block;
+    padding: 5px 10px;
+    font-size: 13px;
+    color: #ffffff;
+    background-color: #3573f8;
+    border: none;
+    border-radius: 3px;
+    cursor: pointer;
+    transition: background-color 0.3s;
+  }
+  .register-button:hover {
+    background-color: #63a1ef;
+  }
+  .register-form {
+    width: 100%;
+  }
 </style>