feat: restructure user parameters for PostUser and simplify email validation; refactor UserAvatar styles and improve user name handling

core/controllers/user.go

@@ -86,25 +86,27 @@ func GetUserList(_ *gin.Context, params *GetListParams) (response *ListResponse[
 }
 
 type PostUserParams struct {
-	Username string `json:"username" description:"Username" validate:"required"`
-	Password string `json:"password" description:"Password" validate:"required"`
-	Role     string `json:"role" description:"Role"`
-	RoleId   string `json:"role_id" description:"Role ID" format:"objectid" pattern:"^[0-9a-fA-F]{24}$"`
-	Email    string `json:"email" description:"Email"`
+	Data struct {
+		Username string `json:"username" description:"Username" validate:"required"`
+		Password string `json:"password" description:"Password" validate:"required"`
+		Role     string `json:"role" description:"Role"`
+		RoleId   string `json:"role_id" description:"Role ID" format:"objectid" pattern:"^[0-9a-fA-F]{24}$"`
+		Email    string `json:"email" description:"Email"`
+	} `json:"data" validate:"required"`
 }
 
 func PostUser(c *gin.Context, params *PostUserParams) (response *Response[models.User], err error) {
 	// Validate email format
-	if params.Email != "" {
+	if params.Data.Email != "" {
 		emailRegex := regexp.MustCompile(`^[a-zA-Z0-9._%+\-]+@[a-zA-Z0-9.\-]+\.[a-zA-Z]{2,}$`)
-		if !emailRegex.MatchString(params.Email) {
+		if !emailRegex.MatchString(params.Data.Email) {
 			return GetErrorResponse[models.User](errors.BadRequestf("invalid email format"))
 		}
 	}
 
 	var roleId primitive.ObjectID
-	if params.RoleId != "" {
-		roleId, err = primitive.ObjectIDFromHex(params.RoleId)
+	if params.Data.RoleId != "" {
+		roleId, err = primitive.ObjectIDFromHex(params.Data.RoleId)
 		if err != nil {
 			return GetErrorResponse[models.User](errors.BadRequestf("invalid role id: %v", err))
 		}
@@ -115,11 +117,11 @@ func PostUser(c *gin.Context, params *PostUserParams) (response *Response[models
 	}
 	u := GetUserFromContext(c)
 	model := models.User{
-		Username: params.Username,
-		Password: utils.EncryptMd5(params.Password),
-		Role:     params.Role,
+		Username: params.Data.Username,
+		Password: utils.EncryptMd5(params.Data.Password),
+		Role:     params.Data.Role,
 		RoleId:   roleId,
-		Email:    params.Email,
+		Email:    params.Data.Email,
 	}
 	model.SetCreated(u.Id)
 	model.SetUpdated(u.Id)

frontend/crawlab-ui/src/components/ui/avatar/UserAvatar.vue

@@ -35,18 +35,6 @@ const userLabel = computed<string>(() => {
   return '';
 });
 
-const labelClass = computed(() => {
-  const length = userLabel.value.length;
-  const isChineseName = /[\u4e00-\u9fa5]/.test(userLabel.value);
-
-  return {
-    label: true,
-    'label--small': length === 3 || (isChineseName && length === 2),
-    'label--smaller': length === 4 || (isChineseName && length === 3),
-    'label--smallest': isChineseName && length === 4,
-  };
-});
-
 defineOptions({ name: 'ClUserAvatar' });
 </script>
 
@@ -60,7 +48,7 @@ defineOptions({ name: 'ClUserAvatar' });
       >
         <slot v-if="slots.default" name="default" />
         <template v-else-if="user">
-          <span :class="labelClass">
+          <span class="label">
             {{ userLabel }}
           </span>
         </template>
@@ -93,22 +81,9 @@ defineOptions({ name: 'ClUserAvatar' });
       text-overflow: ellipsis;
       max-width: 100%;
       min-height: 100%;
-      font-size: 0.85em;
       line-height: 1.5;
       padding: 0 2px;
     }
-
-    .label--small {
-      font-size: 0.8em;
-    }
-
-    .label--smaller {
-      font-size: 0.75em;
-    }
-
-    .label--smallest {
-      font-size: 0.7em;
-    }
   }
 }
 </style>

frontend/crawlab-ui/src/router/index.ts

@@ -136,6 +136,7 @@ export function getDefaultSidebarMenuItems(): MenuItem[] {
       icon: getIconByRouteConcept('autoprobe'),
       badge: 'common.mode.preview',
       badgeType: 'primary',
+      hidden: true,
     },
     {
       path: '/users',

frontend/crawlab-ui/src/utils/user.ts

@@ -1,7 +1,9 @@
+export const isChinese = (text: string) => {
+  return /[\u4e00-\u9fa5]/.test(text);
+};
+
 export const isChineseName = (user: User) => {
-  return /[\u4e00-\u9fa5]/.test(
-    (user.first_name || '') + (user.last_name || '')
-  );
+  return isChinese((user.first_name || '') + (user.last_name || ''));
 };
 
 export const getUserFullName = (user: User) => {
@@ -21,7 +23,14 @@ export const getUserShortName = (user: User) => {
 
   // Fallback to username if no name provided
   if (!firstName && !lastName) {
-    return user.username || '';
+    if (!user.username) {
+      return 'User'; // Default fallback if no username or name
+    }
+    if (isChinese(user.username)) {
+      return user.username.substring(0, 2);
+    } else {
+      return user.username.substring(0, 2).toUpperCase();
+    }
   }
 
   // If Chinese name, return at most 4 characters