gc_i18n 1.3.10 → 1.3.12

package/.qoder/repowiki/zh/content//346/240/270/345/277/203/345/272/223/345/256/236/347/216/260.md

@@ -9,6 +9,7 @@
 - [packages/components/earth.js](file://packages/components/earth.js) - *地球组件*
 - [packages/libs/textEditMode.js](file://packages/libs/textEditMode.js) - *文本编辑模式模块*
 - [packages/libs/textEditMode.css](file://packages/libs/textEditMode.css) - *文本编辑模式样式*
+- [packages/swal.css](file://packages/swal.css) - *SweetAlert2样式集成*
 - [lib/gc_i18n.css](file://lib/gc_i18n.css) - *样式文件*
 - [lib/gc_i18n.es.js](file://lib/gc_i18n.es.js) - *ES模块构建*
 - [lib/gc_i18n.umd.js](file://lib/gc_i18n.umd.js) - *UMD构建*
@@ -37,6 +38,8 @@
 - **集成$keyValueMap映射机制**，为文本编辑模式提供键值映射支持
 - **HTTP客户端现代化**，使用独立axios实例避免全局污染
 - **安全机制改进**，新增JWT令牌验证和权限控制
+- **SweetAlert2集成优化**，改进变量命名和代码组织结构，提升可读性和维护性
+- **新增智能语言列表缓存机制**，通过getLanguagesWithCache提供缓存和自动失效功能
 
 ## 目录
 1. [项目结构分析](#项目结构分析)
@@ -61,6 +64,7 @@ gc_i18n_es[gc_i18n.es.js]
 gc_i18n_umd[gc_i18n.umd.js]
 gc_i18n_css[gc_i18n.css]
 text_edit_css[textEditMode.css]
+swal_css[swal.css]
 end
 subgraph "语言资源"
 lang[index.js<br/>index.json]
@@ -436,10 +440,79 @@ globalThis.$t = this.i18n.global.t = (key, defaultValue) => {
 globalThis.__I18N_ALL_KEYS__ = new Set();
 ```
 
+### 智能语言列表缓存机制
+
+**新增** I18n类新增了智能语言列表缓存机制，通过getLanguagesWithCache函数提供缓存和自动失效功能：
+
+```javascript
+/**
+ * 获取语言列表（带缓存）
+ * @param {Object} options - 配置选项
+ * @param {string} options.baseUrl - API 基础 URL
+ * @param {string} options.token - 认证 token
+ * @param {string} options.appCode - 应用代码
+ * @param {boolean} options.isRemote - 是否强制从远程获取
+ * @returns {Promise<Array>} 语言列表
+ */
+export const getLanguagesWithCache = async ({
+  baseUrl,
+  token,
+  appCode,
+  isRemote = false
+}) => {
+  // 先从缓存获取
+  const cached = store2.get("I18N_LANGUAGES");
+  if (cached && Array.isArray(cached) && cached.length > 0 && !isRemote) {
+    return cached.map((l) => ({
+      langCode: l.language || l.langCode || l,
+      langName: l.langName || l.language || l
+    }));
+  }
+
+  // 从 API 获取
+  if (!appCode) {
+    return [];
+  }
+
+  try {
+    const res = await http.get(`${baseUrl}/i18n-web/language/languages`, {
+      headers: {
+        appCode,
+        Authorization: token
+      }
+    });
+    if (res.data && res.data.result === 0) {
+      const langs = _.get(res.data, "retVal", []);
+      const formattedLangs = langs.map((l) => ({
+        langCode: l.language || l.langCode || l,
+        langName: l.langName || l.language || l
+      }));
+      store2.set("I18N_LANGUAGES", langs);
+      return formattedLangs;
+    }
+  } catch (error) {
+    console.error("获取语言列表失败:", error);
+  }
+
+  return [];
+};
+```
+
+### 缓存策略和自动失效
+
+智能缓存机制具有以下特点：
+
+1. **本地缓存优先**：首次调用时从store2本地存储获取缓存数据
+2. **智能判断**：检查缓存数据的有效性（数组类型、长度大于0）
+3. **强制刷新**：通过isRemote参数强制从远程API获取最新数据
+4. **自动存储**：成功获取后自动存储到本地缓存
+5. **格式化输出**：统一返回标准化的语言列表格式
+
 **本节来源**
 - [packages/index.js:67-411](file://packages/index.js#L67-L411)
 - [packages/libs/i18nUtils.ts:1-54](file://packages/libs/i18nUtils.ts#L1-L54)
-- [packages/libs/service.js:1-136](file://packages/libs/service.js#L1-L136)
+- [packages/libs/service.js:1-188](file://packages/libs/service.js#L1-L188)
+- [packages/swal.css:1-18](file://packages/swal.css#L1-L18)
 
 ## Vue插件安装机制
 
@@ -625,9 +698,32 @@ if ($isRTL()) {
 }
 ```
 
+### $getLanguages() 方法
+
+获取语言列表，支持智能缓存和自动失效。
+
+**参数：**
+- `isRemote` (Boolean, 可选): 是否强制从远程获取，跳过缓存
+
+**返回值：**
+- Promise<Array>: 语言列表数组
+
+**调用上下文：**
+- 组件实例
+- 全局对象
+
+```javascript
+// 获取缓存的语言列表
+const languages = await $getLanguages()
+
+// 强制从远程获取最新数据
+const latestLanguages = await $getLanguages(true)
+```
+
 **本节来源**
 - [packages/index.js:257-307](file://packages/index.js#L257-L307)
 - [packages/index.js:369-371](file://packages/index.js#L369-L371)
+- [packages/index.js:412-420](file://packages/index.js#L412-L420)
 
 ## RTL方向管理功能
 
@@ -837,6 +933,7 @@ editKeyboard[editKeyboard配置]
 end
 subgraph "样式支持"
 textEditModeCSS[textEditMode.css]
+swalCSS[swal.css]
 i18nEditableText[i18n-editable-text类]
 i18nEditModeActive[i18n-edit-mode-active类]
 end
@@ -854,11 +951,13 @@ textEditMode --> saveTranslations
 keyboardJS --> editKeyboard
 textEditModeCSS --> i18nEditableText
 textEditModeCSS --> i18nEditModeActive
+swalCSS --> swal2Container
 ```
 
 **图示来源**
-- [packages/libs/textEditMode.js:14-475](file://packages/libs/textEditMode.js#L14-L475)
+- [packages/libs/textEditMode.js:14-623](file://packages/libs/textEditMode.js#L14-L623)
 - [packages/index.js:109-156](file://packages/index.js#L109-L156)
+- [packages/swal.css:1-18](file://packages/swal.css#L1-L18)
 
 ### 文本编辑模式快捷键配置
 
@@ -958,7 +1057,7 @@ scanTextNodes(rootElement) {
 findKeyByValue(value) {
   if (!value) return null;
 
-  // 首先尝试从全局映射中查找（由 $t 函数运行时记录）
+  // 从全局映射中查找（由 $t 函数运行时记录）
   if (
     globalThis.__I18N_KEY_VALUE_MAP__ &&
     globalThis.__I18N_KEY_VALUE_MAP__[value]
@@ -979,15 +1078,6 @@ findKeyByValue(value) {
     }
   }
 
-  // 尝试从当前路由的翻译中查找（如果存在）
-  const routeMessagesKey = `I18N_MESSAGES_${this.currentLocale}`;
-  const routeMessages = store2.get(routeMessagesKey) || {};
-  for (const [key, val] of Object.entries(routeMessages)) {
-    if (val === value) {
-      return key;
-    }
-  }
-
   // 如果找不到，返回 null
   return null;
 }
@@ -1006,7 +1096,7 @@ async openEditModal(key) {
         icon: "info",
         timer: 2000,
         showConfirmButton: false,
-        position: "top-end",
+        position: "top",
         toast: true
       });
       return;
@@ -1130,6 +1220,37 @@ async openEditModal(key) {
 }
 ```
 
+### SweetAlert2样式集成优化
+
+**更新** SweetAlert2样式集成经过优化，提供更好的视觉体验：
+
+```css
+/* SweetAlert2 容器样式 */
+.gc_i18n_html_container {
+  overflow: hidden;
+  padding: 0px;
+  margin: 5px 15px;
+}
+
+/* SweetAlert2 标题样式 */
+.gc_i18n_title {
+  font-size: 18px;
+  text-align: left;
+}
+
+/* SweetAlert2 关闭按钮样式 */
+.gc_i18n_close_button {
+  border: none;
+  outline: none;
+  box-shadow: none;
+}
+
+/* SweetAlert2 关闭按钮焦点样式修复 */
+div:where(.swal2-container) button:where(.swal2-close):focus-visible {
+  box-shadow: none !important;
+}
+```
+
 ### 非组件环境使用
 
 在非组件环境中使用文本编辑模式功能：
@@ -1165,9 +1286,10 @@ if ($isRTL()) {
 ```
 
 **本节来源**
-- [packages/libs/textEditMode.js:1-475](file://packages/libs/textEditMode.js#L1-L475)
-- [packages/libs/textEditMode.css:1-145](file://packages/libs/textEditMode.css#L1-L145)
+- [packages/libs/textEditMode.js:1-623](file://packages/libs/textEditMode.js#L1-L623)
+- [packages/libs/textEditMode.css:1-166](file://packages/libs/textEditMode.css#L1-L166)
 - [packages/index.js:109-156](file://packages/index.js#L109-L156)
+- [packages/swal.css:1-18](file://packages/swal.css#L1-L18)
 
 ## 非组件环境使用
 
@@ -1214,7 +1336,8 @@ const createI18nInstance = (options) => {
     },
     getLocale: () => i18n.locale,
     isRTL: () => i18n.isRTL(),
-    checkRTL: (locale) => I18n.checkRTL(locale)
+    checkRTL: (locale) => I18n.checkRTL(locale),
+    getLanguages: (isRemote) => i18n.getLanguages(isRemote)
   }
 }
 
@@ -1240,7 +1363,7 @@ const myI18n = createI18nInstance({
 ```css
 .gc_i18n_html_container {
   overflow: hidden;
-  padding: 0;
+  padding: 0px;
   margin: 5px 15px;
 }
 
@@ -1335,6 +1458,37 @@ div:where(.swal2-container) button:where(.swal2-close):focus-visible {
 }
 ```
 
+### SweetAlert2样式集成
+
+**更新** SweetAlert2样式集成优化，提供更好的用户体验：
+
+```css
+/* SweetAlert2 容器样式 */
+.gc_i18n_html_container {
+  overflow: hidden;
+  padding: 0px;
+  margin: 5px 15px;
+}
+
+/* SweetAlert2 标题样式 */
+.gc_i18n_title {
+  font-size: 18px;
+  text-align: left;
+}
+
+/* SweetAlert2 关闭按钮样式 */
+.gc_i18n_close_button {
+  border: none;
+  outline: none;
+  box-shadow: none;
+}
+
+/* SweetAlert2 关闭按钮焦点样式修复 */
+div:where(.swal2-container) button:where(.swal2-close):focus-visible {
+  box-shadow: none !important;
+}
+```
+
 ### 样式特性
 
 - **容器样式**: 为弹窗容器提供合适的内边距和溢出控制
@@ -1343,8 +1497,10 @@ div:where(.swal2-container) button:where(.swal2-close):focus-visible {
 - **无障碍支持**: 确保键盘导航时的焦点可见性
 - **RTL支持**: 自动适配RTL语言的文本方向和对齐方式
 - **编辑模式支持**: 为可编辑文本提供视觉反馈和交互效果
+- **SweetAlert2集成**: 提供完整的SweetAlert2样式支持和焦点管理
 
 **本节来源**
 - [lib/gc_i18n.css](file://lib/gc_i18n.css)
-- [packages/libs/textEditMode.css:1-145](file://packages/libs/textEditMode.css#L1-L145)
+- [packages/libs/textEditMode.css:1-166](file://packages/libs/textEditMode.css#L1-L166)
+- [packages/swal.css:1-18](file://packages/swal.css#L1-L18)
 - [packages/index.js:338-343](file://packages/index.js#L338-L343)