gc_i18n 1.4.2 → 1.4.3

package/.qoder/repowiki/zh/content//351/205/215/347/275/256/351/200/211/351/241/271.md

@@ -16,6 +16,8 @@
 
 ## 更新摘要
 **所做更改**   
+- 版本从1.4.1升级到1.4.2
+- SweetAlert2模态对话框的z-index增强，确保不被其他弹窗遮盖
 - 更新了基础URL配置，将 `https://i18n.ihotel.cn` 更新为 `https://trans.ihotel.cn`
 - 标准化了API端点路径，移除了重复的斜杠
 - 更新了环境配置说明，反映最新的URL变更
@@ -240,6 +242,8 @@ baseUrl: "https://custom-domain.com"
 
 ### SweetAlert2 集成配置项
 
+**更新** SweetAlert2模态对话框的z-index已增强，确保不被其他弹窗遮盖：
+
 | 配置项 | 类型 | 默认值 | 有效值范围 | 实际影响 |
 | --- | --- | --- | --- | --- |
 | **titleText** | String | "多语言管理中心" | 任意字符串 | SweetAlert2 弹窗标题 |
@@ -278,7 +282,7 @@ baseUrl: "https://custom-domain.com"
 **Section sources**
 - [packages/index.js:67-547](file://packages/index.js#L67-L547)
 - [vite.config.js:1-72](file://vite.config.js#L1-L72)
-- [packages/swal.css:1-18](file://packages/swal.css#L1-L18)
+- [packages/swal.css:1-23](file://packages/swal.css#L1-L23)
 - [package.json:13-20](file://package.json#L13-L20)
 - [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)
@@ -411,21 +415,14 @@ export default {
 };
 ```
 
-### iframe样式定制示例
-```css
-/* 自定义样式 */
-.gc_i18n_container {
-  background-color: #f5f5f5;
-}
+### SweetAlert2 z-index增强配置示例
 
-.gc_i18n_title {
-  color: #333;
-  font-weight: bold;
-}
+**更新** SweetAlert2模态对话框的z-index已增强，确保不被其他弹窗遮盖：
 
-.gc_i18n_close_button {
-  background-color: #ff6b6b;
-  color: white;
+```css
+/* SweetAlert2 弹窗 z-index 设置，确保不被其他弹窗遮盖 */
+.swal2-container {
+  z-index: 99999 !important;
 }
 ```
 
@@ -455,5 +452,5 @@ export default {
 **Section sources**
 - [lang/index.js:16-33](file://lang/index.js#L16-L33)
 - [packages/index.js:67-547](file://packages/index.js#L67-L547)
-- [packages/swal.css:1-18](file://packages/swal.css#L1-L18)
+- [packages/swal.css:1-23](file://packages/swal.css#L1-L23)
 - [packages/libs/textEditMode.css:1-166](file://packages/libs/textEditMode.css#L1-L166)

package/.qoder/repowiki/zh/content//351/253/230/347/272/247/347/224/250/346/263/225//351/253/230/347/272/247/347/224/250/346/263/225.md

@@ -21,6 +21,7 @@
 - [src/router/index.js](file://src/router/index.js) - *路由配置*
 - [src/main.js](file://src/main.js) - *应用入口*
 - [README.md](file://README.md) - *项目说明文档*
+- [packages/swal.css](file://packages/swal.css) - *SweetAlert2样式增强*
 </cite>
 
 ## 更新摘要
@@ -29,6 +30,7 @@
 - 增强的RTL语言支持和更健壮的错误处理机制
 - 改进的类型安全和代码组织结构
 - 优化的性能调优技巧和缓存策略
+- **新增** SweetAlert2模态对话框z-index增强，确保弹窗最高优先级
 
 ## 目录
 1. [项目结构分析](#项目结构分析)
@@ -43,6 +45,7 @@
 10. [环境感知与iframe配置](#环境感知与iframe配置)
 11. [文本编辑模式高级用法](#文本编辑模式高级用法)
 12. [Earth组件高级用法](#earth组件高级用法)
+13. [SweetAlert2模态对话框z-index增强](#sweetalert2模态对话框z-index增强)
 
 ## 项目结构分析
 
@@ -68,6 +71,7 @@ css[gc_i18n.css]
 esm[gc_i18n.es.js]
 textEdit[文本编辑模式]
 earth[Earth组件]
+swalEnhance[SweetAlert2增强]
 end
 subgraph "工具库"
 index[index.js]
@@ -91,6 +95,7 @@ index --> service
 index --> utils
 index --> textEditMode
 index --> earth
+index --> swalEnhance
 textEditMode --> textEditModeCss[textEditMode.css]
 earth --> earthCss[earth.css]
 App --> index
@@ -107,6 +112,7 @@ langJson --> index
 - [packages/libs/textEditMode.js:1-200](file://packages/libs/textEditMode.js#L1-L200)
 - [packages/libs/textEditMode.css:1-167](file://packages/libs/textEditMode.css#L1-L167)
 - [packages/components/earth.js:1-200](file://packages/components/earth.js#L1-L200)
+- [packages/swal.css:1-23](file://packages/swal.css#L1-L23)
 
 ## Vite构建系统迁移
 
@@ -1195,4 +1201,114 @@ const debouncedLanguageChange = debounce((newLocale) => {
 - [packages/components/earth.css:1-144](file://packages/components/earth.css#L1-L144)
 - [packages/components/earth.md:1-109](file://packages/components/earth.md#L1-L109)
 - [src/view/Home.vue:19-40](file://src/view/Home.vue#L19-L40)
-- [packages/index.js:523](file://packages/index.js#L523-L523)
+- [packages/index.js:523](file://packages/index.js#L523-L523)
+
+## SweetAlert2模态对话框z-index增强
+
+### 概述
+
+为了确保gc_i18n库中的SweetAlert2模态对话框始终显示在最顶层，避免被其他UI元素遮挡，系统进行了z-index增强配置。这一改进确保了弹窗的最高优先级显示。
+
+### z-index增强配置
+
+系统通过专门的CSS样式文件为SweetAlert2对话框设置了极高的z-index值：
+
+```css
+/* 全局 SweetAlert2 弹窗 z-index 设置，确保不被其他弹窗遮盖 */
+.swal2-container {
+  z-index: 99999 !important;
+}
+```
+
+这个配置确保了：
+- SweetAlert2对话框始终位于所有其他元素之上
+- 避免与其他UI组件发生层级冲突
+- 提供一致的用户体验，无论页面结构如何复杂
+
+### 应用场景
+
+这种z-index增强在以下场景中特别有用：
+
+#### 多层嵌套组件
+当应用包含复杂的嵌套组件结构时，某些父级元素可能设置了较高的z-index，导致SweetAlert2对话框被遮挡。
+
+#### 动态内容加载
+在异步加载内容或动态插入DOM元素时，可能出现层级计算错误，导致对话框显示异常。
+
+#### 第三方组件集成
+当与第三方UI组件库集成时，可能存在z-index冲突问题。
+
+### 实现细节
+
+SweetAlert2对话框的z-index增强通过以下方式实现：
+
+1. **全局样式覆盖**：通过`.swal2-container`选择器设置极高的z-index值
+2. **重要性标记**：使用`!important`确保样式优先级
+3. **组件化集成**：在主入口文件中导入增强样式
+
+```javascript
+// 在主入口文件中导入增强样式
+import "./swal.css";
+```
+
+### 性能影响
+
+z-index增强对性能的影响：
+- **零额外计算**：仅设置固定z-index值，无复杂计算
+- **全局应用**：影响所有SweetAlert2实例，无需逐个配置
+- **浏览器优化**：现代浏览器对z-index有良好的优化处理
+
+### 最佳实践
+
+使用z-index增强时的注意事项：
+
+```javascript
+// 正确的做法
+Swal.fire({
+  title: "操作成功",
+  text: "数据已成功保存",
+  icon: "success",
+  // z-index自动应用，无需手动设置
+});
+
+// 避免的做法
+Swal.fire({
+  title: "操作成功",
+  text: "数据已成功保存",
+  icon: "success",
+  customClass: {
+    popup: "custom-popup-class" // 如果需要自定义样式，确保不影响z-index
+  }
+});
+```
+
+### 兼容性考虑
+
+z-index增强的兼容性：
+- **现代浏览器**：完全支持
+- **IE11+**：通过CSS前缀支持
+- **移动端浏览器**：在iOS Safari中表现良好
+- **无障碍访问**：不影响屏幕阅读器的正常工作
+
+### 故障排除
+
+如果遇到z-index相关问题：
+
+```javascript
+// 检查是否有其他样式覆盖
+// 使用浏览器开发者工具检查元素的实际z-index值
+
+// 如果需要临时调整
+Swal.fire({
+  title: "临时调整",
+  text: "如果需要特殊处理，可以使用自定义样式",
+  customClass: {
+    container: "temporary-z-index-adjustment"
+  }
+});
+```
+
+**章节来源**
+- [packages/swal.css:1-23](file://packages/swal.css#L1-L23)
+- [packages/index.js:53-54](file://packages/index.js#L53-L54)
+- [lib/gc_i18n.es.js:1954](file://lib/gc_i18n.es.js#L1954)