fix: update widget name rules and the association selector options (#119)

src/locales/lang/en.ts

@@ -145,7 +145,7 @@ const msg = {
   associateOptions: "Association Options",
   widget: "Widget",
   nameTip:
-    "The name only supports Chinese and English, horizontal lines and underscores",
+    "The name only supports Chinese and English, horizontal lines and underscores. The length of the name is limited to 300 characters",
   duplicateName: "Duplicate name",
   seconds: "Seconds",
   hourTip: "Select Hour",
@@ -156,8 +156,6 @@ const msg = {
   monthsHead: "Jan_Feb_Mar_Apr_May_Jun_Jul_Aug_Sep_Oct_Nov_Dec",
   months: "Jan_Feb_Mar_Apr_May_Jun_Jul_Aug_Sep_Oct_Nov_Dec",
   weeks: "Mon_Tue_Wed_Thu_Fri_Sat_Sun",
-  hello: "Hello",
-  helloMessage: "Welcome Back, Apache SkyWalking APM System !",
   username: "Username",
   password: "Password",
   title: "Title",

src/locales/lang/es.ts

@@ -146,7 +146,7 @@ const msg = {
   widget: "Dispositivo pequeño",
   duplicateName: "Nombre duplicado",
   nameTip:
-    "Este nombre sólo admite chino e inglés, líneas cruzadas y subrayado",
+    "El nombre sólo admite chino e inglés, líneas horizontales y subrayado, y la longitud del nombre no excederá de 300 caracteres",
   seconds: "Segundos",
   hourTip: "Seleccione Hora",
   minuteTip: "Seleccione Minuto",
@@ -156,8 +156,6 @@ const msg = {
   monthsHead: "Ene_Feb_Mar_Abr_May_Jun_Jul_Ago_Set_Oct_Nov_Dic",
   months: "Ene_Feb_Mar_Abr_May_Jun_Jul_Ago_Set_Oct_Nov_Dic",
   weeks: "Lun_Mar_Mier_Jue_Vie_Sáb_Dom",
-  hello: "Hola",
-  helloMessage: "Bienvenido de vuelta, Apache SkyWalking APM System !",
   username: "Usuario",
   password: "Contraseña",
   title: "Título",

src/locales/lang/zh.ts

@@ -142,7 +142,7 @@ const msg = {
   begin: "开始",
   associateOptions: "关联选项",
   widget: "部件",
-  nameTip: "该名称仅支持中文和英文、横线和下划线",
+  nameTip: "该名称仅支持中文和英文、横线和下划线, 并且限制长度为300个字符",
   duplicateName: "重复的名称",
   seconds: "秒",
   hourTip: "选择小时",
@@ -153,8 +153,6 @@ const msg = {
   monthsHead: "1月_2月_3月_4月_5月_6月_7月_8月_9月_10月_11月_12月",
   months: "一月_二月_三月_四月_五月_六月_七月_八月_九月_十月_十一月_十二月",
   weeks: "一_二_三_四_五_六_日",
-  hello: "你好",
-  helloMessage: "欢迎来到, Apache SkyWalking APM 系统 !",
   username: "用户名",
   password: "密码",
   title: "标题",

src/views/dashboard/configuration/widget/AssociateOptions.vue

@@ -51,9 +51,15 @@ const widgets = computed(() => {
   const items = widgets.filter(
     (d: { value: string; label: string } & LayoutConfig) => {
       if (dashboardStore.selectedGrid.id !== d.id) {
-        if (isLinear && d.type === "Widget" && d.widget && d.id) {
+        if (
+          isLinear &&
+          d.type === "Widget" &&
+          d.widget &&
+          d.widget.name &&
+          d.id
+        ) {
           d.value = d.id;
-          d.label = d.widget.name || d.id;
+          d.label = d.widget.name;
           return d;
         }
         // if (isRank && d.type !== "Widget" && d.widget && d.id) {

src/views/dashboard/configuration/widget/WidgetOptions.vue

@@ -74,7 +74,7 @@ function updateWidgetConfig(param: { [key: string]: string }) {
 function updateWidgetName(param: { [key: string]: string }) {
   const key = Object.keys(param)[0];
   const n = decodeURIComponent(param[key]);
-  const pattern = /^[A-Za-z0-9-_\u4e00-\u9fa5]{1,30}$/;
+  const pattern = /^[A-Za-z0-9-_\u4e00-\u9fa5]{1,300}$/;
   if (!pattern.test(n)) {
     ElMessage.error(t("nameTip"));
     return;