@jx3box/jx3box-ui 2.0.4 → 2.0.6

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">
@@ -17,9 +17,35 @@
                     <template #reference>
                         <a
                             class="flex h-12 items-center rounded-xl border border-gray-700 bg-gray-800 px-4 text-xs text-gray-300 transition hover:border-blue-500 hover:bg-gray-700"
-                            :href="item.href || 'javascript:;'"
+                            :href="item.href || '#'"
                             :target="item.href ? '_blank' : null"
                             :rel="item.href ? 'noopener noreferrer' : null"
+                            @click="handleLinkClick($event, item)"
+                        >
+                            <span class="mr-2.5 flex h-4 w-4 items-center justify-center">
+                                <img class="h-4 w-4" :src="item.icon" :alt="getDownloadName(item)" />
+                            </span>
+                            <span>{{ getDownloadName(item) }}</span>
+                        </a>
+                    </template>
+                </el-popover>
+                <el-popover
+                    v-else-if="item.placeholder"
+                    trigger="hover"
+                    placement="top"
+                    :show-after="150"
+                    popper-class="c-footer--v4__popover"
+                >
+                    <div class="p-3 text-center text-xs font-semibold">
+                        {{ item.placeholder }}
+                    </div>
+                    <template #reference>
+                        <a
+                            class="flex h-12 items-center rounded-xl border border-gray-700 bg-gray-800 px-4 text-xs text-gray-300 transition hover:border-blue-500 hover:bg-gray-700"
+                            :href="item.href || '#'"
+                            :target="item.href ? '_blank' : null"
+                            :rel="item.href ? 'noopener noreferrer' : null"
+                            @click="handleLinkClick($event, item)"
                         >
                             <span class="mr-2.5 flex h-4 w-4 items-center justify-center">
                                 <img class="h-4 w-4" :src="item.icon" :alt="getDownloadName(item)" />
@@ -31,9 +57,10 @@
                 <a
                     v-else
                     class="flex h-12 items-center rounded-xl border border-gray-700 bg-gray-800 px-4 text-xs text-gray-300 transition hover:border-blue-500 hover:bg-gray-700"
-                    :href="item.href || 'javascript:;'"
+                    :href="item.href || '#'"
                     :target="item.href ? '_blank' : null"
                     :rel="item.href ? 'noopener noreferrer' : null"
+                    @click="handleLinkClick($event, item)"
                 >
                     <span class="mr-2.5 flex h-4 w-4 items-center justify-center">
                         <img class="h-4 w-4" :src="item.icon" :alt="getDownloadName(item)" />
@@ -59,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>
@@ -75,7 +102,7 @@
                 target="_blank"
                 rel="noopener noreferrer"
             >
-                {{ $jx3boxT("jx3boxUi.footer.add", "添加") }}
+                {{ $jx3boxT("jx3boxUi.commonFooter.add", "添加") }}
             </a>
         </div>
     </section>
@@ -98,6 +125,7 @@ export default {
                     href: "",
                     icon: require("../../assets/img/common/ios.svg"),
                     // qrcode: require("../../assets/img/common/ios.jpg"),
+                    placeholder: "即将上线",
                 },
                 {
                     key: "android",
@@ -105,6 +133,7 @@ export default {
                     href: "",
                     icon: require("../../assets/img/common/android.svg"),
                     // qrcode: require("../../assets/img/common/android.jpg"),
+                    placeholder: "即将上线",
                 },
                 {
                     key: "harmonyNext",
@@ -112,6 +141,7 @@ export default {
                     href: "",
                     icon: require("../../assets/img/common/harmony.svg"),
                     // qrcode: require("../../assets/img/common/harmony.jpg"),
+                    placeholder: "即将上线",
                 },
                 {
                     key: "miniProgram",
@@ -132,15 +162,18 @@ 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) {
+            if (!item?.href) e.preventDefault();
+        },
     },
     created: function () {},
     mounted: function () {},

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>
@@ -92,11 +97,16 @@ export default {
             return this.data.filter((item) => {
                 const currentClient = String(this.client || "").toLowerCase();
                 const rawClient = item.client;
-                const matchedClient = !rawClient
-                    ? true
+                const clients = !rawClient
+                    ? []
                     : Array.isArray(rawClient)
-                    ? rawClient.map((c) => String(c || "").toLowerCase()).includes(currentClient)
-                    : String(rawClient || "").toLowerCase().includes(currentClient);
+                    ? rawClient.map((c) => String(c || "").toLowerCase())
+                    : String(rawClient || "")
+                          .split(",")
+                          .map((c) => String(c || "").trim().toLowerCase())
+                          .filter(Boolean);
+                const matchedClient =
+                    !clients.length || clients.includes("all") || clients.includes(currentClient);
                 return matchedClient;
             });
         },
@@ -115,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: {
@@ -329,6 +339,8 @@ export default {
         width: min(460px, 100%);
         margin-left: auto;
         position: relative;
+        .flex;
+        align-items: center;
     }
 
     .u-search-input {