feat(ui): 添加用户注册功能
- 在登录页面添加"立即注册"按钮，跳转至注册页面 - 新增 RegisterView 类实现注册界面与逻辑 - 注册界面包含租户名称、租户ID、账号、密码输入框 - 实现注册按钮事件处理，包含基本字段校验 - 添加注册过程中的加载指示器与按钮状态管理 - 提供注册成功或失败的提示弹窗 - 增加返回登录按钮，支持切换回登录页面
This commit is contained in:
159
src/main/java/com/fantaibao/page/RegisterView.java
Normal file
159
src/main/java/com/fantaibao/page/RegisterView.java
Normal file
@@ -0,0 +1,159 @@
|
||||
package com.fantaibao.page;
|
||||
|
||||
import javafx.application.Platform;
|
||||
import javafx.geometry.Insets;
|
||||
import javafx.geometry.Pos;
|
||||
import javafx.scene.Scene;
|
||||
import javafx.scene.control.*;
|
||||
import javafx.scene.layout.VBox;
|
||||
import javafx.stage.Stage;
|
||||
|
||||
public class RegisterView {
|
||||
|
||||
public RegisterView(Stage primaryStage) {
|
||||
initialize(primaryStage);
|
||||
}
|
||||
|
||||
private void initialize(Stage primaryStage) {
|
||||
// 创建主容器
|
||||
VBox root = new VBox();
|
||||
root.setAlignment(Pos.CENTER);
|
||||
root.setSpacing(15);
|
||||
root.setPadding(new Insets(20));
|
||||
root.setStyle("-fx-background-color: #ffffff; -fx-border-radius: 8px; -fx-effect: dropshadow(three-pass-box, rgba(0,0,0,0.2), 10, 0, 0, 0);");
|
||||
|
||||
// 标题
|
||||
Label titleLabel = new Label("账号注册");
|
||||
titleLabel.setStyle("-fx-font-size: 18px; -fx-font-weight: bold; -fx-text-fill: #333333;");
|
||||
|
||||
// 租户名称输入框
|
||||
TextField tenantNameField = new TextField();
|
||||
tenantNameField.setPromptText("请输入租户名称");
|
||||
tenantNameField.setPrefWidth(300);
|
||||
tenantNameField.setStyle("-fx-background-color: #f5f5f5; -fx-border-color: #cccccc; -fx-border-radius: 4px; -fx-padding: 10px;");
|
||||
|
||||
// 租户ID输入框
|
||||
TextField tenantIdField = new TextField();
|
||||
tenantIdField.setPromptText("请输入租户ID");
|
||||
tenantIdField.setPrefWidth(300);
|
||||
tenantIdField.setStyle("-fx-background-color: #f5f5f5; -fx-border-color: #cccccc; -fx-border-radius: 4px; -fx-padding: 10px;");
|
||||
|
||||
// 账号输入框
|
||||
TextField accountField = new TextField();
|
||||
accountField.setPromptText("请输入账号");
|
||||
accountField.setPrefWidth(300);
|
||||
accountField.setStyle("-fx-background-color: #f5f5f5; -fx-border-color: #cccccc; -fx-border-radius: 4px; -fx-padding: 10px;");
|
||||
|
||||
// 密码输入框
|
||||
PasswordField passwordField = new PasswordField();
|
||||
passwordField.setPromptText("请输入密码");
|
||||
passwordField.setPrefWidth(300);
|
||||
passwordField.setStyle("-fx-background-color: #f5f5f5; -fx-border-color: #cccccc; -fx-border-radius: 4px; -fx-padding: 10px;");
|
||||
|
||||
// 注册按钮
|
||||
Button registerButton = new Button("注 册");
|
||||
registerButton.setStyle("-fx-background-color: #3f51b5; -fx-text-fill: white; -fx-border-radius: 24px; -fx-padding: 10px 0;");
|
||||
registerButton.setPrefWidth(300);
|
||||
registerButton.setCursor(javafx.scene.Cursor.HAND);
|
||||
|
||||
// 返回登录按钮
|
||||
Button backButton = new Button("返回登录");
|
||||
backButton.setStyle("-fx-background-color: #cccccc; -fx-text-fill: #333333; -fx-border-radius: 24px; -fx-padding: 10px 0;");
|
||||
backButton.setPrefWidth(300);
|
||||
backButton.setCursor(javafx.scene.Cursor.HAND);
|
||||
|
||||
// 创建加载指示器（默认隐藏）
|
||||
ProgressIndicator progressIndicator = new ProgressIndicator();
|
||||
progressIndicator.setPrefSize(30, 30);
|
||||
progressIndicator.setVisible(false);
|
||||
|
||||
// 添加注册按钮事件处理
|
||||
registerButton.setOnAction(e -> {
|
||||
String tenantName = tenantNameField.getText();
|
||||
String tenantId = tenantIdField.getText();
|
||||
String account = accountField.getText();
|
||||
String password = passwordField.getText();
|
||||
|
||||
// 基本验证
|
||||
if (tenantName.isEmpty() || tenantId.isEmpty() || account.isEmpty() || password.isEmpty()) {
|
||||
showAlert(Alert.AlertType.WARNING, "注册失败", "请填写所有字段");
|
||||
return;
|
||||
}
|
||||
// 显示加载指示器，禁用注册按钮
|
||||
progressIndicator.setVisible(true);
|
||||
registerButton.setDisable(true);
|
||||
registerButton.setText("注册中...");
|
||||
// 在新线程中执行注册操作
|
||||
new Thread(() -> {
|
||||
try {
|
||||
// 这里应该调用实际的注册接口，目前我们模拟注册成功
|
||||
Thread.sleep(1000); // 模拟网络请求
|
||||
|
||||
// 在JavaFX主线程中更新UI
|
||||
Platform.runLater(() -> {
|
||||
// 隐藏加载指示器，启用注册按钮
|
||||
progressIndicator.setVisible(false);
|
||||
registerButton.setDisable(false);
|
||||
registerButton.setText("注 册");
|
||||
|
||||
// 显示成功提示弹窗
|
||||
Alert alert = new Alert(Alert.AlertType.INFORMATION);
|
||||
alert.setTitle("注册成功");
|
||||
alert.setHeaderText(null);
|
||||
alert.setContentText("账号注册成功，请返回登录页面登录");
|
||||
alert.showAndWait();
|
||||
});
|
||||
} catch (Exception ex) {
|
||||
// 发生异常时也要恢复UI状态
|
||||
Platform.runLater(() -> {
|
||||
progressIndicator.setVisible(false);
|
||||
registerButton.setDisable(false);
|
||||
registerButton.setText("注 册");
|
||||
// 显示错误提示弹窗
|
||||
showAlert(Alert.AlertType.ERROR, "注册失败", "注册过程中发生错误: " + ex.getMessage());
|
||||
});
|
||||
}
|
||||
}).start();
|
||||
});
|
||||
|
||||
// 返回登录按钮事件处理
|
||||
backButton.setOnAction(e -> {
|
||||
new LoginView(primaryStage);
|
||||
});
|
||||
|
||||
// 创建标签容器
|
||||
Label tenantNameLabel = new Label("租户名称：");
|
||||
tenantNameLabel.setPrefWidth(400);
|
||||
tenantNameLabel.setStyle("-fx-alignment: center-left;");
|
||||
|
||||
Label tenantIdLabel = new Label("租户ID：");
|
||||
tenantIdLabel.setPrefWidth(400);
|
||||
tenantIdLabel.setStyle("-fx-alignment: center-left;");
|
||||
|
||||
Label accountLabel = new Label("账号：");
|
||||
accountLabel.setPrefWidth(400);
|
||||
accountLabel.setStyle("-fx-alignment: center-left;");
|
||||
|
||||
Label passwordLabel = new Label("密码：");
|
||||
passwordLabel.setPrefWidth(400);
|
||||
passwordLabel.setStyle("-fx-alignment: center-left;");
|
||||
|
||||
// 添加组件到主容器
|
||||
root.getChildren().addAll(titleLabel, tenantNameLabel, tenantNameField,
|
||||
tenantIdLabel, tenantIdField, accountLabel, accountField,
|
||||
passwordLabel, passwordField, registerButton, backButton, progressIndicator);
|
||||
|
||||
// 设置场景并显示窗口
|
||||
Scene scene = new Scene(root, 400, 600);
|
||||
primaryStage.setScene(scene);
|
||||
primaryStage.show();
|
||||
}
|
||||
|
||||
private void showAlert(Alert.AlertType alertType, String title, String content) {
|
||||
Alert alert = new Alert(alertType);
|
||||
alert.setTitle(title);
|
||||
alert.setHeaderText(null);
|
||||
alert.setContentText(content);
|
||||
alert.showAndWait();
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user