@jx3box/jx3box-ui 2.0.5 → 2.0.7

package/src/filters/zlpBy.vue

@@ -1,33 +1,33 @@
 <template>
-    <span class="w-filter-menu">
-        <el-dropdown>
-            <span class="el-dropdown-link">
-                <span class="u-menu-label">
-                    <el-icon> <operation /> </el-icon>
-                    {{ value ? value : "资料片" }}
-                    <el-icon>
-                        <arrow-down />
-                    </el-icon>
-                </span>
+    <el-dropdown class="w-filter-menu w-filter-zlp">
+        <span class="el-dropdown-link">
+            <span class="u-menu-label">
+                <el-icon> <operation /> </el-icon>
+                {{ value ? value : $jx3boxT("jx3boxUi.zlpBy.default", "资料片") }}
+                <el-icon>
+                    <arrow-down />
+                </el-icon>
             </span>
-            <template #dropdown>
-                <el-dropdown-menu>
-                    <el-dropdown-item @click="filter('')">
-                        {{ "全部" }}
-                    </el-dropdown-item>
-                    <el-dropdown-item v-for="item in data" :key="item" @click="filter(item)">{{
-                        item
-                    }}</el-dropdown-item>
-                </el-dropdown-menu>
-            </template>
-        </el-dropdown>
-    </span>
+        </span>
+        <template #dropdown>
+            <el-dropdown-menu class="w-filter-zlp__list">
+                <el-dropdown-item @click="filter('')">
+                    {{ $jx3boxT("jx3boxUi.zlpBy.all", "全部") }}
+                </el-dropdown-item>
+                <el-dropdown-item v-for="item in data" :key="item" @click="filter(item)">{{
+                    item
+                }}</el-dropdown-item>
+            </el-dropdown-menu>
+        </template>
+    </el-dropdown>
 </template>
 
 <script>
 import zlps from "@jx3box/jx3box-common/data/jx3_zlp.json";
+import i18nMixin from "../../i18n/mixin";
 export default {
     name: "zlpBy",
+    mixins: [i18nMixin],
     emits: ["filter"],
     props: {
         client: {
@@ -66,10 +66,14 @@ export default {
 .w-filter-menu {
     .pointer;
     .u-menu-label {
-        i {
-            .mr(5px);
-        }
+        .flex;
+        align-items: center;
+        gap: 5px;
         .fz(12px);
     }
 }
+.w-filter-zlp__list{
+    max-height: 200px;
+    overflow-y: auto;
+}
 </style>

package/src/footer/copyright.vue

@@ -5,9 +5,9 @@
     >
         <div class="flex flex-wrap items-center justify-center gap-x-6 gap-y-2 md:justify-start">
             <span>{{
-                $jx3boxT("jx3boxUi.footer.copyright", "© 2019-{year} JX3BOX {poweredBy}", {
+                $jx3boxT("jx3boxUi.commonFooter.copyright", "© 2019-{year} JX3BOX {poweredBy}", {
                     year: new Date().getFullYear(),
-                    poweredBy: $jx3boxT("jx3boxUi.footer.poweredBy", "All rights reserved."),
+                    poweredBy: $jx3boxT("jx3boxUi.commonFooter.poweredBy", "All rights reserved."),
                 })
             }}</span>
             <a
@@ -16,7 +16,7 @@
                 target="_blank"
                 rel="noopener noreferrer"
             >
-                {{ $jx3boxT("jx3boxUi.footer.icp", "湘ICP备2021002288号") }}
+                {{ $jx3boxT("jx3boxUi.commonFooter.icp", "湘ICP备2021002288号") }}
             </a>
         </div>
         <div class="mt-4 flex items-center space-x-6 md:mt-0">
@@ -26,7 +26,7 @@
                 target="_blank"
                 rel="noopener noreferrer"
             >
-                {{ $jx3boxT("jx3boxUi.footer.contactUs", "联系我们") }}
+                {{ $jx3boxT("jx3boxUi.commonFooter.contactUs", "联系我们") }}
             </a>
             <a
                 class="text-gray-500 transition-colors hover:text-white"
@@ -34,7 +34,7 @@
                 target="_blank"
                 rel="noopener noreferrer"
             >
-                {{ $jx3boxT("jx3boxUi.footer.feedback", "反馈建议") }}
+                {{ $jx3boxT("jx3boxUi.commonFooter.feedback", "反馈建议") }}
             </a>
         </div>
     </div>

package/src/footer/links.vue

@@ -3,7 +3,7 @@
         <div class="grid grid-cols-1 gap-8 sm:grid-cols-3">
             <div v-for="group in footerGroups" :key="group.title">
                 <h3 class="text-sm font-semibold tracking-wide text-white">
-                    {{ $jx3boxT(`jx3boxUi.footer.${group.key}`, group.title) }}
+                    {{ $jx3boxT(`jx3boxUi.commonFooter.${group.key}`, group.title) }}
                 </h3>
                 <div class="mt-4 space-y-3">
                     <a
@@ -14,7 +14,7 @@
                         target="_blank"
                         rel="noopener noreferrer"
                     >
-                        {{ $jx3boxT(`jx3boxUi.footer.${item.key}`, item.name) }}
+                        {{ $jx3boxT(`jx3boxUi.commonFooter.${item.key}`, item.name) }}
                     </a>
                 </div>
             </div>

package/src/footer/official.vue

@@ -123,7 +123,7 @@ export default {
                 douyin: "douyin",
             };
             const tKey = map[item.key] || item.key;
-            return this.$jx3boxT(`jx3boxUi.footer.${tKey}`, item.name || tKey);
+            return this.$jx3boxT(`jx3boxUi.commonFooter.${tKey}`, item.name || tKey);
         },
     },
     created: function () {},

package/src/footer/resource.vue

@@ -1,7 +1,7 @@
 <template>
     <section class="lg:col-span-4 lg:col-start-9">
         <h3 class="text-sm font-semibold tracking-wide text-white">
-            {{ $jx3boxT("jx3boxUi.footer.downloadCenter", "下载中心") }}
+            {{ $jx3boxT("jx3boxUi.commonFooter.downloadCenter", "下载中心") }}
         </h3>
         <div class="mt-4 grid grid-cols-1 gap-3 sm:grid-cols-2">
             <div v-for="item in downloadLinks" :key="item.name">
@@ -86,12 +86,12 @@
                         class="h-6 w-6"
                         svg-inline
                         src="../../assets/img/common/qqbot.svg"
-                        :alt="$jx3boxT('jx3boxUi.footer.qqBot', 'QQ机器人')"
+                        :alt="$jx3boxT('jx3boxUi.commonFooter.qqBot', 'QQ机器人')"
                     />
                 </div>
                 <div @click="copyText('3889010020')" class="cursor-pointer">
                     <p class="font-bold uppercase tracking-wider text-gray-500" style="font-size: 10px">
-                        {{ $jx3boxT("jx3boxUi.footer.qqBotService", "QQ 机器人服务") }}
+                        {{ $jx3boxT("jx3boxUi.commonFooter.qqBotService", "QQ 机器人服务") }}
                     </p>
                     <p class="mt-1 font-mono text-sm font-semibold text-white">3889 010 020</p>
                 </div>
@@ -102,7 +102,7 @@
                 target="_blank"
                 rel="noopener noreferrer"
             >
-                {{ $jx3boxT("jx3boxUi.footer.add", "添加") }}
+                {{ $jx3boxT("jx3boxUi.commonFooter.add", "添加") }}
             </a>
         </div>
     </section>
@@ -162,13 +162,13 @@ export default {
         getDownloadName(item) {
             if (item?.key) {
                 const k = item.key === "harmonyNext" ? "harmonyNext" : item.key;
-                const maybe = `jx3boxUi.footer.${k}`;
+                const maybe = `jx3boxUi.commonFooter.${k}`;
                 return this.$jx3boxT(maybe, item.name || k);
             }
             return item?.name || "";
         },
         getDownloadLabel(item) {
-            if (item?.labelKey) return this.$jx3boxT(`jx3boxUi.footer.${item.labelKey}`, item.label || item.labelKey);
+            if (item?.labelKey) return this.$jx3boxT(`jx3boxUi.commonFooter.${item.labelKey}`, item.label || item.labelKey);
             return item?.label || "";
         },
         handleLinkClick(e, item) {

package/src/header/alternate.vue

@@ -4,7 +4,7 @@
         v-model="visible"
         custom-class="c-alternate"
         width="320px"
-        :title="$jx3boxT('jx3boxUi.alternate.title', '切换马甲')"
+        :title="$jx3boxT('jx3boxUi.commonHeader.alternate.title', '切换马甲')"
     >
         <div class="c-alternate__content">
             <div
@@ -20,14 +20,14 @@
                 </div>
                 <div class="m-misc">
                     <span class="u-name"
-                        ><span class="u-label">{{ $jx3boxT("jx3boxUi.alternate.userNickname", "用户昵称：") }}</span
+                        ><span class="u-label">{{ $jx3boxT("jx3boxUi.commonHeader.alternate.userNickname", "用户昵称：") }}</span
                         >{{ item.name }}</span
                     >
                     <span class="u-time">
-                        <span class="u-label">{{ $jx3boxT("jx3boxUi.alternate.lastLogin", "上次登录：") }}</span
+                        <span class="u-label">{{ $jx3boxT("jx3boxUi.commonHeader.alternate.lastLogin", "上次登录：") }}</span
                         >{{ getFormatTime(item.created_at) }}
                         <span class="u-extra" v-if="isExpired(item.created_at)">{{
-                            $jx3boxT("jx3boxUi.alternate.expired", "(已过期)")
+                            $jx3boxT("jx3boxUi.commonHeader.alternate.expired", "(已过期)")
                         }}</span>
                     </span>
                 </div>
@@ -75,11 +75,18 @@ export default {
         },
     },
     mounted() {
-        Bus.on("showAlternate", () => {
+        this.__showAlternateHandler = () => {
             this.visible = true;
-        });
+        };
+        Bus.on("showAlternate", this.__showAlternateHandler);
         this.init();
     },
+    beforeUnmount() {
+        if (this.__showAlternateHandler) {
+            Bus.off("showAlternate", this.__showAlternateHandler);
+            this.__showAlternateHandler = null;
+        }
+    },
     methods: {
         init() {
             // 获取localStorage中以jx3box-alternate-开头的数据
@@ -138,17 +145,23 @@ export default {
         // 选择马甲
         onSelectAlternate(item) {
             if (this.isExpired(item.created_at)) {
-                this.$message.error(this.$jx3boxT("jx3boxUi.alternate.expiredNeedRelogin", "该马甲已过期，请重新登录"));
+                this.$message.error(
+                    this.$jx3boxT("jx3boxUi.commonHeader.alternate.expiredNeedRelogin", "该马甲已过期，请重新登录")
+                );
                 return;
             }
             if (this.profile.uid == item.uid) {
                 return;
             }
-            this.$confirm(this.$jx3boxT("jx3boxUi.alternate.switchConfirm", "确定要切换到该马甲吗？"), this.$jx3boxT("jx3boxUi.common.tip", "提示"), {
-                confirmButtonText: this.$jx3boxT("jx3boxUi.common.confirm", "确定"),
-                cancelButtonText: this.$jx3boxT("jx3boxUi.common.cancel", "取消"),
-                type: "warning",
-            })
+            this.$confirm(
+                this.$jx3boxT("jx3boxUi.commonHeader.alternate.switchConfirm", "确定要切换到该马甲吗？"),
+                this.$jx3boxT("jx3boxUi.common.tip", "提示"),
+                {
+                    confirmButtonText: this.$jx3boxT("jx3boxUi.common.confirm", "确定"),
+                    cancelButtonText: this.$jx3boxT("jx3boxUi.common.cancel", "取消"),
+                    type: "warning",
+                }
+            )
                 .then(() => {
                     User.update(item).then(async () => {
                         localStorage.setItem(
@@ -167,11 +180,15 @@ export default {
         },
         // 删除马甲
         onRemoveAlternate(item) {
-            this.$confirm(this.$jx3boxT("jx3boxUi.alternate.deleteConfirm", "确定要删除该马甲吗？"), this.$jx3boxT("jx3boxUi.common.tip", "提示"), {
-                confirmButtonText: this.$jx3boxT("jx3boxUi.common.confirm", "确定"),
-                cancelButtonText: this.$jx3boxT("jx3boxUi.common.cancel", "取消"),
-                type: "warning",
-            })
+            this.$confirm(
+                this.$jx3boxT("jx3boxUi.commonHeader.alternate.deleteConfirm", "确定要删除该马甲吗？"),
+                this.$jx3boxT("jx3boxUi.common.tip", "提示"),
+                {
+                    confirmButtonText: this.$jx3boxT("jx3boxUi.common.confirm", "确定"),
+                    cancelButtonText: this.$jx3boxT("jx3boxUi.common.cancel", "取消"),
+                    type: "warning",
+                }
+            )
                 .then(() => {
                     localStorage.removeItem("jx3box-alternate-" + item.uid);
 
@@ -182,7 +199,7 @@ export default {
         // 新增马甲
         onAddAlternate() {
             if (this.overLength) {
-                this.$message.error(this.$jx3boxT("jx3boxUi.alternate.maxFive", "最多只能添加5个马甲"));
+                this.$message.error(this.$jx3boxT("jx3boxUi.commonHeader.alternate.maxFive", "最多只能添加5个马甲"));
                 return;
             }
             // 跳转至登录页

package/src/header/asset.vue

@@ -5,7 +5,7 @@
                 class="u-icon"
                 svg-inline
                 src="../../assets/img/common/coin.svg"
-                :alt="$jx3boxT('jx3boxUi.header.asset', '资产')"
+                :alt="$jx3boxT('jx3boxUi.commonHeader.asset', '资产')"
             />
         </a>
 
@@ -14,7 +14,7 @@
                 <span class="u-item">
                     <a class="u-item-primary" href="/about/incentives" :target="target">
                         <span class="u-label"
-                            ><el-icon><User /></el-icon> {{ $jx3boxT("jx3boxUi.header.level", "等级") }}</span
+                            ><el-icon><User /></el-icon> {{ $jx3boxT("jx3boxUi.commonHeader.level", "等级") }}</span
                         >
                         <span class="u-value u-level" :style="levelStyle">Lv.{{ level }}</span>
                     </a>
@@ -23,49 +23,39 @@
                 <span class="u-item">
                     <a class="u-item-primary" href="/dashboard/boxcoin" :target="target"
                         ><span class="u-label"
-                            ><el-icon><Coin /></el-icon> {{ $jx3boxT("jx3boxUi.header.boxCoin", "盒币") }}</span
+                            ><el-icon><Coin /></el-icon> {{ $jx3boxT("jx3boxUi.commonHeader.boxCoin", "盒币") }}</span
                         >
                         <span class="u-value">{{ asset.box_coin }}</span></a
                     >
                     <span class="u-item-extend"
                         ><a href="/dashboard/boxcoin" :target="target"
-                            >[{{ $jx3boxT("jx3boxUi.header.exchangeTongbao", "兑换通宝") }}]</a
+                            >[{{ $jx3boxT("jx3boxUi.commonHeader.exchangeTongbao", "兑换通宝") }}]</a
                         ></span
                     >
                 </span>
-                <!-- <span class="u-item">
-                    <a class="u-item-primary" href="/dashboard/cny" :target="target"
-                        ><span class="u-label"><i class="el-icon-wallet"></i> 金箔</span
-                        ><span class="u-value">{{ asset.cny }}</span></a
-                    >
-                    <span class="u-item-extend"
-                        ><a href="/vip/cny" :target="target">[充值]</a>
-                        <a href="/dashboard/cny" :target="target">[提现]</a></span
-                    >
-                </span> -->
                 <span class="u-item">
                     <a class="u-item-primary" href="/dashboard/points" :target="target"
                         ><span class="u-label"
-                            ><el-icon><Sugar /></el-icon> {{ $jx3boxT("jx3boxUi.header.points", "积分") }}</span
+                            ><el-icon><Sugar /></el-icon> {{ $jx3boxT("jx3boxUi.commonHeader.points", "积分") }}</span
                         >
                         <span class="u-value">{{ asset.points }}</span></a
                     >
                     <span class="u-item-extend"
-                        ><a href="/vip/mall" :target="target">[{{ $jx3boxT("jx3boxUi.header.redeem", "兑礼") }}]</a
+                        ><a href="/vip/mall" :target="target">[{{ $jx3boxT("jx3boxUi.commonHeader.redeem", "兑礼") }}]</a
                         ><a href="/vip/lottery" :target="target"
-                            >[{{ $jx3boxT("jx3boxUi.header.lottery", "抽奖") }}]</a
+                            >[{{ $jx3boxT("jx3boxUi.commonHeader.lottery", "抽奖") }}]</a
                         ></span
                     >
                 </span>
                 <span class="u-item">
                     <a class="u-item-primary" href="/dashboard/card" :target="target"
                         ><span class="u-label"
-                            ><el-icon><CreditCard /></el-icon> {{ $jx3boxT("jx3boxUi.header.card", "卡密") }}</span
+                            ><el-icon><CreditCard /></el-icon> {{ $jx3boxT("jx3boxUi.commonHeader.card", "卡密") }}</span
                         >
                         <span class="u-value">{{ asset.ext_info ? asset.ext_info.keycode : 0 }}</span></a
                     >
                     <span class="u-item-extend"
-                        ><a href="/dashboard/card" :target="target">[{{ $jx3boxT("jx3boxUi.header.view", "查看") }}]</a></span
+                        ><a href="/dashboard/card" :target="target">[{{ $jx3boxT("jx3boxUi.commonHeader.view", "查看") }}]</a></span
                     >
                 </span>
             </div>

package/src/header/box.vue

@@ -9,20 +9,19 @@
                 <a class="u-item" href="/index">
                     <img class="u-pic" svg-inline :src="homeicon" />
                     <img class="u-pic-hover" svg-inline :src="homeicon" />
-                    <span class="u-txt">{{ $jx3boxT("jx3boxUi.header.home", "首页") }}</span>
+                    <span class="u-txt">{{ $jx3boxT("jx3boxUi.commonHeader.home", "首页") }}</span>
                 </a>
             </li>
             <li v-for="(item, i) in list" :key="i" :class="{ 'u-app-start': item.lf }">
                 <a class="u-item" :href="item.href" :target="getTarget(item.href)">
                     <img class="u-pic" :src="getBoxIcon(item.img)" />
-                    <!-- <img class="u-pic-hover" svg-inline :src="item.hover | getBoxIcon" /> -->
                     <span class="u-txt">{{ item.abbr }}</span>
                 </a>
             </li>
         </ul>
         <span class="u-close" @click="closeBox($event)">
-            <i class="el-icon-upload2"></i>
-            <span>{{ $jx3boxT("jx3boxUi.header.collapse", "收起") }}</span>
+            <el-icon><Upload /></el-icon>
+            <span>{{ $jx3boxT("jx3boxUi.commonHeader.collapse", "收起") }}</span>
         </span>
     </div>
 </template>
@@ -126,16 +125,29 @@ export default {
         this.loadMenu();
     },
     mounted: function () {
-        Bus.on("toggleBox", (status) => {
+        this.__toggleBoxHandler = (status) => {
             if (status == undefined) {
                 this.status = !this.status;
             } else {
                 this.status = status;
             }
-        });
-        document.addEventListener("click", function () {
+        };
+        Bus.on("toggleBox", this.__toggleBoxHandler);
+
+        this.__docClickHandler = () => {
             Bus.emit("toggleBox", false);
-        });
+        };
+        document.addEventListener("click", this.__docClickHandler);
+    },
+    beforeUnmount() {
+        if (this.__toggleBoxHandler) {
+            Bus.off("toggleBox", this.__toggleBoxHandler);
+            this.__toggleBoxHandler = null;
+        }
+        if (this.__docClickHandler) {
+            document.removeEventListener("click", this.__docClickHandler);
+            this.__docClickHandler = null;
+        }
     },
     components: {
         "header-search": search,

package/src/header/box2.vue

@@ -10,15 +10,20 @@
                             <img svg-inline src="../../assets/img/common/logo.svg" alt="JX3BOX" />
                         </div>
                         <div>
-                            <h2 class="u-title">魔盒矩阵</h2>
+                            <h2 class="u-title">{{ $jx3boxT("jx3boxUi.box2.title", "魔盒矩阵") }}</h2>
                             <p class="u-subtitle">THE BOX MATRIX NAVIGATION</p>
                         </div>
                     </div>
                     <div class="u-search">
-                        <i class="el-icon-search u-search-icon"></i>
-                        <input v-model.trim="searchQuery" class="u-search-input" type="text" placeholder="搜索应用" />
+                        <el-icon class="u-search-icon"><Search></Search></el-icon>
+                        <input
+                            v-model.trim="searchQuery"
+                            class="u-search-input"
+                            type="text"
+                            :placeholder="$jx3boxT('jx3boxUi.box2.searchPlaceholder', '搜索应用')"
+                        />
                         <button v-if="searchQuery" class="u-search-clear" type="button" @click="searchQuery = ''">
-                            <i class="el-icon-close"></i>
+                            <el-icon><Close /></el-icon>
                         </button>
                     </div>
                 </div>
@@ -30,7 +35,7 @@
                                 <div class="u-icon-wrap">
                                     <img class="u-pic" svg-inline :src="homeicon" />
                                 </div>
-                                <span class="u-txt">{{ $jx3boxT("jx3boxUi.header.home", "首页") }}</span>
+                                <span class="u-txt">{{ $jx3boxT("jx3boxUi.commonHeader.home", "首页") }}</span>
                             </a>
                         </li>
                         <li v-for="(item, i) in filteredList" :key="i">
@@ -46,12 +51,12 @@
                                 <div class="u-icon-wrap">
                                     <img class="u-pic" svg-inline :src="allicon" />
                                 </div>
-                                <span class="u-txt">{{ $jx3boxT("jx3boxUi.header.all", "全部") }}</span>
+                                <span class="u-txt">{{ $jx3boxT("jx3boxUi.commonHeader.all", "全部") }}</span>
                             </a>
                         </li>
                     </ul>
                     <div v-if="searchQuery && !homeMatched && filteredList.length === 0" class="u-empty">
-                        未找到匹配应用
+                        {{ $jx3boxT("jx3boxUi.box2.empty", "未找到匹配应用") }}
                     </div>
                 </div>
             </section>
@@ -120,12 +125,12 @@ export default {
         homeMatched: function () {
             const query = (this.searchQuery || "").toLowerCase().trim();
             if (!query) return true;
-            return this.$jx3boxT("jx3boxUi.header.home", "首页").includes(query);
+            return this.$jx3boxT("jx3boxUi.commonHeader.home", "首页").includes(query);
         },
         allMatched: function () {
             const query = (this.searchQuery || "").toLowerCase().trim();
             if (!query) return true;
-            return this.$jx3boxT("jx3boxUi.header.all", "全部").includes(query);
+            return this.$jx3boxT("jx3boxUi.commonHeader.all", "全部").includes(query);
         },
     },
     methods: {
@@ -334,6 +339,8 @@ export default {
         width: min(460px, 100%);
         margin-left: auto;
         position: relative;
+        .flex;
+        align-items: center;
     }
 
     .u-search-input {

package/src/header/client.vue

@@ -25,7 +25,7 @@
             role="menu"
         >
             <div class="px-3 py-2 text-[10px] text-gray-500 uppercase tracking-widest border-b border-gray-800 mb-1">
-                {{ $jx3boxT("jx3boxUi.header.chooseGameVersion", "选择游戏版本") }}
+                {{ $jx3boxT("jx3boxUi.commonHeader.chooseGameVersion", "选择游戏版本") }}
             </div>
 
             <!-- 剑网3 -->
@@ -45,13 +45,13 @@
                             class="w-4 h-4"
                             svg-inline
                             src="../../assets/img/common/jx3-www.svg"
-                            :alt="$jx3boxT('jx3boxUi.header.jx3Full', '剑网3 / 无界')"
+                            :alt="$jx3boxT('jx3boxUi.commonHeader.jx3Full', '剑网3 / 无界')"
                         />
                         <!-- <Jx3Icon class="w-4 h-4" /> -->
                     </span>
                     <div>
                         <div class="text-sm font-bold text-gray-200 group-hover/item:text-white">
-                            {{ $jx3boxT("jx3boxUi.header.jx3Full", "剑网3 / 无界") }}
+                            {{ $jx3boxT("jx3boxUi.commonHeader.jx3Full", "剑网3 / 无界") }}
                         </div>
                         <div class="text-[10px] text-gray-500 group-hover/item:text-indigo-200">www.jx3box.com</div>
                     </div>
@@ -79,13 +79,13 @@
                             class="w-4 h-4"
                             svg-inline
                             src="../../assets/img/common/jx3-origin.svg"
-                            :alt="$jx3boxT('jx3boxUi.header.originFull', '剑网3·缘起')"
+                            :alt="$jx3boxT('jx3boxUi.commonHeader.originFull', '剑网3·缘起')"
                         />
                         <!-- <OriginIcon class="w-4 h-4" /> -->
                     </span>
                     <div>
                         <div class="text-sm font-bold text-gray-200 group-hover/item:text-white">
-                            {{ $jx3boxT("jx3boxUi.header.originFull", "剑网3·缘起") }}
+                            {{ $jx3boxT("jx3boxUi.commonHeader.originFull", "剑网3·缘起") }}
                         </div>
                         <div class="text-[10px] text-gray-500 group-hover/item:text-indigo-200">origin.jx3box.com</div>
                     </div>
@@ -121,8 +121,8 @@ export default {
     computed: {
         currentGameLabel: function () {
             return this.activeKey === "origin"
-                ? this.$jx3boxT("jx3boxUi.header.originShort", "缘起")
-                : this.$jx3boxT("jx3boxUi.header.jx3Short", "剑网3");
+                ? this.$jx3boxT("jx3boxUi.commonHeader.originShort", "缘起")
+                : this.$jx3boxT("jx3boxUi.commonHeader.jx3Short", "剑网3");
         },
     },
     watch: {

package/src/header/lang.vue

@@ -5,7 +5,7 @@
                 class="u-icon"
                 svg-inline
                 src="../../assets/img/common/lang.svg"
-                :alt="$jx3boxT('jx3boxUi.header.langSwitch', '语言切换')"
+                :alt="$jx3boxT('jx3boxUi.commonHeader.langSwitch', '语言切换')"
             />
         </span>
         <ul class="u-menu u-pop-content">
@@ -25,6 +25,8 @@
 // import langIcon from "@/assets/img/components/common/header/lang.svg";
 import { getJx3boxUiAvailableLocales, setJx3boxUiLocale } from "../../i18n";
 import i18nMixin from "../../i18n/mixin";
+import User from "@jx3box/jx3box-common/js/user";
+import { getUserConfig, setUserConfig } from "../../service/cms";
 
 function normalizeLocaleKey(key) {
     if (!key) return null;
@@ -41,6 +43,11 @@ export default {
     components: {
         // langIcon,
     },
+    computed: {
+        isLogin() {
+            return User.isLogin();
+        }
+    },
     data() {
         const supported = getJx3boxUiAvailableLocales();
         return {
@@ -70,10 +77,7 @@ export default {
         };
     },
     mounted() {
-        const lang = localStorage.getItem("lang") || "zh-cn";
-        this.currentLang = lang;
-        const normalized = normalizeLocaleKey(lang);
-        normalized && setJx3boxUiLocale(normalized);
+        this.init();
     },
     methods: {
         onLangChange({ disabled, key }) {
@@ -85,8 +89,39 @@ export default {
             if (!normalized) return;
 
             const ok = setJx3boxUiLocale(normalized);
-            if (ok) location.reload();
+            if (ok) {
+                if (this.isLogin) {
+                    setUserConfig({ default_lang: key }).then(() => {
+                        location.reload();
+                    });
+                } else {
+                    location.reload();
+                }
+            }
         },
+        init() {
+            if (!this.isLogin) {
+                const lang = localStorage.getItem("lang") || "zh-cn";
+                this.currentLang = lang;
+                const normalized = normalizeLocaleKey(lang);
+                normalized && setJx3boxUiLocale(normalized);
+            } else {
+                const lang = localStorage.getItem("lang");
+                if (lang) {
+                    this.currentLang = lang;
+                    const normalized = normalizeLocaleKey(lang);
+                    normalized && setJx3boxUiLocale(normalized);
+                } else {
+                    getUserConfig({ key: "default_lang" }).then((res) => {
+                        const defaultLang = res || "zh-cn";
+                        this.currentLang = defaultLang;
+                        const normalized = normalizeLocaleKey(defaultLang);
+                        normalized && setJx3boxUiLocale(normalized);
+                        localStorage.setItem("lang", defaultLang);
+                    });
+                }
+            }
+        }
     },
 };
 </script>