@jx3box/jx3box-ui 2.0.5 → 2.0.7

package/src/SuspendCommon.vue

@@ -32,7 +32,7 @@
             </div>
             <div class="m-more" v-if="btnConfig.showMore" @click="setMore">
                 <!--                <img class="u-icon" src="../assets/img/suspend/more.svg" svg-inline /> -->
-                更多
+                {{ $jx3boxT("jx3boxUi.suspendCommon.more", "更多") }}
             </div>
         </div>
         <!-- 样式分类（icon&more） -->
@@ -46,7 +46,7 @@
                 <div
                     v-if="btnConfig.showFixed"
                     class="u-icon-d"
-                    @click="clickDrawer({ type: 'pin', text: '固定按钮' }, 1)"
+                    @click="clickDrawer({ type: 'pin', text: $jx3boxT('jx3boxUi.suspendCommon.pinButton', '固定按钮') }, 1)"
                 >
                     <img
                         class="u-icon active"
@@ -60,7 +60,7 @@
                 <div
                     v-if="btnConfig.showCollect"
                     class="u-icon-d"
-                    @click="clickDrawer({ type: 'collect', text: '收藏' }, 1)"
+                    @click="clickDrawer({ type: 'collect', text: $jx3boxT('jx3boxUi.suspendCommon.collect', '收藏') }, 1)"
                 >
                     <img class="u-icon active" src="../assets/img/suspend/collect.svg" svg-inline v-if="!isCollect" />
                     <img class="u-icon active" src="../assets/img/suspend/collect_slash.svg" svg-inline v-else />
@@ -72,14 +72,14 @@
             </div>
             <div class="m-more" v-if="btnConfig.showMore" @click="setMore">
                 <!--                <img class="u-icon" src="../assets/img/suspend/more.svg" svg-inline /> -->
-                更多
+                {{ $jx3boxT("jx3boxUi.suspendCommon.more", "更多") }}
             </div>
         </div>
         <!-- 横向固定内容区域 -->
         <div class="m-pin-box" v-if="btnConfig.showPin && !btnConfig.showHome && !btnConfig.showIcon">
             <div class="u-item" v-for="(item, index) in fixList" :key="'fix' + index">
-                <div class="u-text-r" v-if="item.type == 'text'">
-                    {{ item.title.match(/[\u3400-\u9FFF\uF900-\uFAFF]/)?.[0] || "固" }}
+                    <div class="u-text-r" v-if="item.type == 'text'">
+                    {{ item.title.match(/[\u3400-\u9FFF\uF900-\uFAFF]/)?.[0] || $jx3boxT("jx3boxUi.suspendCommon.pinShort", "固") }}
                 </div>
                 <img :src="item.imgUrl" class="u-icon" v-else />
             </div>
@@ -94,7 +94,7 @@
             v-model="drawer"
             :direction="drawerConfig.direction"
             :with-header="false"
-            custom-class="u-drawer"
+            class="u-drawer"
             modal-class="p-drawer-suspend"
             :modal-append-to-body="false"
             append-to-body
@@ -119,7 +119,7 @@
                             <div class="u-circle-top">
                                 <div v-if="fixList?.[0]">
                                     <div class="u-text-r" v-if="fixList?.[0]?.type == 'text'">
-                                        {{ fixList?.[0]?.title.match(/[\u3400-\u9FFF\uF900-\uFAFF]/)?.[0] || "固" }}
+                                        {{ fixList?.[0]?.title.match(/[\u3400-\u9FFF\uF900-\uFAFF]/)?.[0] || $jx3boxT("jx3boxUi.suspendCommon.pinShort", "固") }}
                                     </div>
                                     <img :src="fixList?.[0]?.imgUrl" class="u-icon" v-else />
                                 </div>
@@ -131,7 +131,7 @@
                                         <div class="u-text-r" v-if="fixList?.[index + 1]?.type == 'text'">
                                             {{
                                                 fixList?.[index + 1].title.match(/[\u3400-\u9FFF\uF900-\uFAFF]/)?.[0] ||
-                                                "固"
+                                                $jx3boxT("jx3boxUi.suspendCommon.pinShort", "固")
                                             }}
                                         </div>
                                         <img :src="fixList?.[index + 1].imgUrl" class="u-icon" v-else />
@@ -214,28 +214,40 @@
                             class="u-text"
                             v-if="(areaKey === 'collect' && !isCollect) || (areaKey === 'rss' && !isSubscribe)"
                         >
-                            {{ areaKey === "collect" ? "收藏" : "订阅" }}作品
+                            {{
+                                areaKey === "collect"
+                                    ? $jx3boxT("jx3boxUi.suspendCommon.collectWork", "收藏作品")
+                                    : $jx3boxT("jx3boxUi.suspendCommon.subscribeWork", "订阅作品")
+                            }}
                         </div>
                     </div>
                     <div class="u-collect-tips" v-if="areaKey === 'collect'">
-                        {{ isCollect ? "你已经收藏该作品" : "喜欢程度不够？可以试试添加到稍后再看" }}
+                        {{
+                            isCollect
+                                ? $jx3boxT("jx3boxUi.suspendCommon.alreadyCollected", "你已经收藏该作品")
+                                : $jx3boxT("jx3boxUi.suspendCommon.tryWatchLater", "喜欢程度不够？可以试试添加到稍后再看")
+                        }}
                     </div>
                     <div class="u-collect-tips" v-if="areaKey === 'rss'">
-                        {{ isSubscribe ? "你已经订阅该作品" : "喜欢程度不够？可以试试添加到稍后再看" }}
+                        {{
+                            isSubscribe
+                                ? $jx3boxT("jx3boxUi.suspendCommon.alreadySubscribed", "你已经订阅该作品")
+                                : $jx3boxT("jx3boxUi.suspendCommon.tryWatchLater", "喜欢程度不够？可以试试添加到稍后再看")
+                        }}
                     </div>
                     <div class="u-btn-box">
                         <div class="u-btn collect" @click="collectOrSubscribe">
                             {{
                                 areaKey === "collect"
                                     ? isCollect
-                                        ? "取消收藏"
-                                        : "收藏"
+                                        ? $jx3boxT("jx3boxUi.suspendCommon.cancelCollect", "取消收藏")
+                                        : $jx3boxT("jx3boxUi.suspendCommon.collect", "收藏")
                                     : isSubscribe
-                                    ? "取消订阅"
-                                    : "订阅"
-                            }}作品
+                                    ? $jx3boxT("jx3boxUi.suspendCommon.cancelSubscribe", "取消订阅")
+                                    : $jx3boxT("jx3boxUi.suspendCommon.subscribe", "订阅")
+                            }}{{ $jx3boxT("jx3boxUi.suspendCommon.workSuffix", "作品") }}
                         </div>
-                        <div class="u-btn" @click="laterOn">添加到稍后再看</div>
+                        <div class="u-btn" @click="laterOn">{{ $jx3boxT("jx3boxUi.suspendCommon.addWatchLater", "添加到稍后再看") }}</div>
                     </div>
                 </div>
             </transition>
@@ -255,16 +267,16 @@
                             v-if="fixIsActive && !fixIsFull"
                         />
                         <img src="../assets/img/suspend/report_100.svg" svg-inline v-if="fixIsFull" />
-                        <div class="u-text">{{ fixIsActive ? "取消固定" : "固定内容" }}</div>
+                        <div class="u-text">{{ fixIsActive ? $jx3boxT("jx3boxUi.suspendCommon.cancelPin", "取消固定") : $jx3boxT("jx3boxUi.suspendCommon.pinContent", "固定内容") }}</div>
                     </div>
                     <div class="u-collect-tips" v-if="!fixIsActive && !fixIsEdit">
-                        你可以随时在其他页面查看固定的内容
+                        {{ $jx3boxT("jx3boxUi.suspendCommon.viewPinnedAnywhere", "你可以随时在其他页面查看固定的内容") }}
                     </div>
-                    <div class="u-edit-title" v-if="fixIsEdit">固定内容</div>
+                    <div class="u-edit-title" v-if="fixIsEdit">{{ $jx3boxT("jx3boxUi.suspendCommon.pinContent", "固定内容") }}</div>
                     <div class="u-pin-box">
                         <div class="u-item" v-if="!fixIsEdit">
                             <div class="u-text-r" v-if="fixPageConfig.type == 'text'">
-                                {{ fixPageConfig.title.match(/[\u3400-\u9FFF\uF900-\uFAFF]/)?.[0] || "固" }}
+                                {{ fixPageConfig.title.match(/[\u3400-\u9FFF\uF900-\uFAFF]/)?.[0] || $jx3boxT("jx3boxUi.suspendCommon.pinShort", "固") }}
                             </div>
                             <img :src="fixPageConfig.imgUrl" class="u-icon" v-else />
                             <div class="u-text">{{ fixPageConfig.title }}</div>
@@ -277,7 +289,7 @@
                             @click="fixDataClick(item)"
                         >
                             <div class="u-text-r" v-if="item.type == 'text'">
-                                {{ item.title.match(/[\u3400-\u9FFF\uF900-\uFAFF]/)?.[0] || "固" }}
+                                {{ item.title.match(/[\u3400-\u9FFF\uF900-\uFAFF]/)?.[0] || $jx3boxT("jx3boxUi.suspendCommon.pinShort", "固") }}
                             </div>
                             <img :src="item.imgUrl" class="u-icon" v-else />
                             <div class="u-text">{{ item.title }}</div>
@@ -295,14 +307,14 @@
                         </div>
                     </div>
                     <div class="u-btn-box" v-if="!fixIsEdit">
-                        <div class="u-btn collect" @click="fixClick">确定</div>
+                        <div class="u-btn collect" @click="fixClick">{{ $jx3boxT("jx3boxUi.common.confirm", "确定") }}</div>
                         <!-- <div class="u-btn">编辑固定内容</div> -->
                     </div>
-                    <div class="u-collect-tips" v-if="fixIsActive && !fixIsEdit">你可以在原页面再次将其固定</div>
+                    <div class="u-collect-tips" v-if="fixIsActive && !fixIsEdit">{{ $jx3boxT("jx3boxUi.suspendCommon.pinAgain", "你可以在原页面再次将其固定") }}</div>
                     <div class="u-collect-tips edit" v-if="fixIsEdit">
-                        在支持固定的页面可以按
+                        {{ $jx3boxT("jx3boxUi.suspendCommon.supportedPinPrefix", "在支持固定的页面可以按") }}
                         <img src="../assets/img/suspend/pin_touchbar_24.svg" svg-inline class="u-icon" />
-                        将页面固定
+                        {{ $jx3boxT("jx3boxUi.suspendCommon.supportedPinSuffix", "将页面固定") }}
                     </div>
                 </div>
             </transition>
@@ -321,7 +333,7 @@
                         v-if="iframeInfo?.url"
                         class="u-iframe"
                     />
-                    <span v-else>查找页面失败</span>
+                    <span v-else>{{ $jx3boxT("jx3boxUi.suspendCommon.openFailed", "查找页面失败") }}</span>
                 </div>
             </transition>
         </el-drawer>
@@ -357,9 +369,11 @@ import pinSlashTouchbar40 from "../assets/img/suspend/pin_slash_touchbar_40.svg"
 import collectTouchbar from "../assets/img/suspend/collect_touchbar.svg";
 import rssTouchbar from "../assets/img/suspend/rss_touchbar.svg";
 import lafterTouchbar from "../assets/img/suspend/lafter_touchbar.svg";
+import i18nMixin from "../i18n/mixin";
 
 export default {
     name: "SuspendCommon",
+    mixins: [i18nMixin],
     props: {
         btnOptions: {
             type: Object,
@@ -399,24 +413,24 @@ export default {
             //弹窗type组合
             drawerType: {
                 one: [
-                    { type: "search", text: "搜索内容", icon: searchTouchbar },
+                    { type: "search", text: this.$jx3boxT("jx3boxUi.suspendCommon.searchContent", "搜索内容"), icon: searchTouchbar },
                     {
                         type: "pin",
-                        text: "固定本页",
+                        text: this.$jx3boxT("jx3boxUi.suspendCommon.pinCurrent", "固定本页"),
                         icon: pinTouchbar,
-                        text_slash: "取消固定",
+                        text_slash: this.$jx3boxT("jx3boxUi.suspendCommon.cancelPin", "取消固定"),
                         icon_slash: pinSlashTouchbar40,
                     },
-                    { type: "fix", text: "查看固定", icon: null, isSlot: true },
+                    { type: "fix", text: this.$jx3boxT("jx3boxUi.suspendCommon.viewPinned", "查看固定"), icon: null, isSlot: true },
                 ],
                 two: [
-                    { type: "collect", text: "收藏作品", icon: collectTouchbar },
-                    { type: "rss", text: "订阅作品", icon: rssTouchbar },
-                    { type: "laterOn", text: "稍后再看", icon: lafterTouchbar },
+                    { type: "collect", text: this.$jx3boxT("jx3boxUi.suspendCommon.collectWork", "收藏作品"), icon: collectTouchbar },
+                    { type: "rss", text: this.$jx3boxT("jx3boxUi.suspendCommon.subscribeWork", "订阅作品"), icon: rssTouchbar },
+                    { type: "laterOn", text: this.$jx3boxT("jx3boxUi.suspendCommon.watchLater", "稍后再看"), icon: lafterTouchbar },
                 ],
                 three: [
-                    { type: "user", text: "作者", isSlot: true },
-                    { type: "report", text: "举报" },
+                    { type: "user", text: this.$jx3boxT("jx3boxUi.suspendCommon.author", "作者"), isSlot: true },
+                    { type: "report", text: this.$jx3boxT("jx3boxUi.suspendCommon.report", "举报") },
                 ],
             },
             fixList: [],
@@ -691,7 +705,7 @@ export default {
                 title: conf.title,
             };
             later(params).then((res) => {
-                ElMessage.success("已添加稍后再看");
+                ElMessage.success(this.$jx3boxT("jx3boxUi.suspendCommon.addedWatchLater", "已添加稍后再看"));
                 this.areaKey = "home";
                 this.$emit("laterOn");
             });

package/src/author/AuthorFans.vue

@@ -2,27 +2,27 @@
     <div class="c-author-fans" v-if="list && list.length">
         <div class="u-label">
             <img svg-inline src="../../assets/img/leftsidebar/fans.svg" />
-            <span>粉丝榜</span>
+            <span>{{ $jx3boxT("jx3boxUi.authorFans.title", "粉丝榜") }}</span>
         </div>
         <div class="f-avatar" v-if="list && list.length">
             <el-tooltip
                 class="item"
                 effect="dark"
-                :content="'累计打赏' + item.summary.toString() + '盒币'"
+                :content="$jx3boxT('jx3boxUi.authorFans.summary', '累计打赏{count}盒币', { count: item.summary.toString() })"
                 placement="top"
                 v-for="item in list"
                 :key="item.pay_user_id"
             >
                 <a class="u-fan" :href="authorLink(item.user_id)"
                     ><el-avatar class="u-avatar" shape="circle" :size="20" :src="showAvatar(item.user_info.avatar)"
-                        ><i class="el-icon-s-custom"></i></el-avatar
+                        ><el-icon><Avatar></Avatar></el-icon></el-avatar
                 ></a>
             </el-tooltip>
         </div>
         <div class="f-bottom">
-            粉丝数: <span class="u-count">{{ fans_count }}</span
+            {{ $jx3boxT("jx3boxUi.authorFans.fansCount", "粉丝数: {count}", { count: fans_count }) }}
             ><template v-if="boxcoin_count"
-                >，累计收到盒币打赏: <span class="u-count">{{ boxcoin_count }}</span></template
+                >{{ $jx3boxT("jx3boxUi.authorFans.boxcoinCount", "，累计收到盒币打赏: {count}", { count: boxcoin_count }) }}</template
             >
         </div>
     </div>
@@ -31,8 +31,10 @@
 <script>
 import { getFansList, getSummary } from "../../service/author";
 import { showAvatar, authorLink } from "@jx3box/jx3box-common/js/utils";
+import i18nMixin from "../../i18n/mixin";
 export default {
     name: "AuthorFans",
+    mixins: [i18nMixin],
     props: {
         uid: {
             type: [Number, String],

package/src/author/AuthorFollow.vue

@@ -33,8 +33,10 @@
 <script>
 import { follow, unfollow, getFansCount } from "../../service/follow";
 import User from "@jx3box/jx3box-common/js/user";
+import i18nMixin from "../../i18n/mixin";
 export default {
     name: "AuthorFollow",
+    mixins: [i18nMixin],
     props: {
         uid: {
             type: [Number, String],
@@ -50,7 +52,9 @@ export default {
     },
     computed: {
         btnText() {
-            return this.isFollow ? "已粉" : "关注";
+            return this.isFollow
+                ? this.$jx3boxT("jx3boxUi.authorFollow.followed", "已粉")
+                : this.$jx3boxT("jx3boxUi.authorFollow.follow", "关注");
         },
         btnType() {
             return this.isFollow ? "info" : "warning";
@@ -64,7 +68,7 @@ export default {
                 //     },
                 // },
                 {
-                    label: "取消关注",
+                    label: this.$jx3boxT("jx3boxUi.authorFollow.unfollow", "取消关注"),
                     action: () => {
                         this.unfollow();
                     },
@@ -106,7 +110,7 @@ export default {
             }
             follow(this.uid)
                 .then(() => {
-                    this.$message.success("关注成功");
+                    this.$message.success(this.$jx3boxT("jx3boxUi.authorFollow.followSuccess", "关注成功"));
                     this.isFollow = true;
                     this.loadFans();
                 })
@@ -116,14 +120,17 @@ export default {
         },
         // 取消关注
         unfollow() {
-            this.$confirm("确定不再关注此人？", "提示", {
-                confirmButtonText: "确定",
-                cancelButtonText: "取消",
+            this.$confirm(
+                this.$jx3boxT("jx3boxUi.authorFollow.confirmUnfollow", "确定不再关注此人？"),
+                this.$jx3boxT("jx3boxUi.common.tip", "提示"),
+                {
+                confirmButtonText: this.$jx3boxT("jx3boxUi.common.confirm", "确定"),
+                cancelButtonText: this.$jx3boxT("jx3boxUi.common.cancel", "取消"),
                 type: "warning",
             }).then(() => {
                 unfollow(this.uid)
                     .then(() => {
-                        this.$message.success("取关成功");
+                        this.$message.success(this.$jx3boxT("jx3boxUi.authorFollow.unfollowSuccess", "取关成功"));
                         this.isFollow = false;
                         this.loadFans();
                     })

package/src/author/AuthorGift.vue

@@ -8,33 +8,39 @@
             :title="btnTitle"
             plain
             size="small"
-            >赠礼</el-button
+            >{{ $jx3boxT("jx3boxUi.authorGift.button", "赠礼") }}</el-button
         >
 
-        <el-dialog title="赠礼" v-model="visible" :append-to-body="true" class="c-author-gift-dialog" v-if="status">
+        <el-dialog
+            :title="$jx3boxT('jx3boxUi.authorGift.dialogTitle', '赠礼')"
+            v-model="visible"
+            :append-to-body="true"
+            class="c-author-gift-dialog"
+            v-if="status"
+        >
             <div class="u-content">
                 <div class="u-left">
-                    <em class="u-label">🌟 金箔</em>
+                    <em class="u-label">🌟 {{ $jx3boxT("jx3boxUi.authorGift.leaf", "金箔") }}</em>
                     <b>{{ left }}</b>
-                    <a class="u-charge" :href="chargeLink" target="_blank">[充值]</a>
+                    <a class="u-charge" :href="chargeLink" target="_blank">[{{ $jx3boxT("jx3boxUi.authorGift.recharge", "充值") }}]</a>
                 </div>
                 <div class="u-list">
-                    <em class="u-label">❤️ 赠送</em>
+                    <em class="u-label">❤️ {{ $jx3boxT("jx3boxUi.authorGift.give", "赠送") }}</em>
                     <div class="u-points">
                         <el-radio-group v-model="count">
                             <el-radio :value="item" v-for="item in fitPoints" :key="item" border>
                                 <b>{{ item }}</b
-                                >金箔
+                                >{{ $jx3boxT("jx3boxUi.authorGift.leaf", "金箔") }}
                             </el-radio>
                         </el-radio-group>
                     </div>
                 </div>
                 <div class="u-msg">
-                    <em class="u-label">📝 寄语</em>
+                    <em class="u-label">📝 {{ $jx3boxT("jx3boxUi.authorGift.remark", "寄语") }}</em>
                     <div class="u-input">
                         <el-input
                             v-model="remark"
-                            placeholder="请输入寄语（必填）"
+                            :placeholder="$jx3boxT('jx3boxUi.authorGift.remarkPlaceholder', '请输入寄语（必填）')"
                             :minlength="2"
                             :maxlength="30"
                             show-word-limit
@@ -44,9 +50,9 @@
             </div>
             <template #footer>
                 <span class="dialog-footer">
-                    <el-button @click="visible = false">取 消</el-button>
+                    <el-button @click="visible = false">{{ $jx3boxT("jx3boxUi.common.cancel", "取消") }}</el-button>
                     <el-button type="primary" @click="submit" :disabled="!ready || loading" :loading="loading"
-                        >确 定</el-button
+                        >{{ $jx3boxT("jx3boxUi.common.confirm", "确定") }}</el-button
                     >
                 </span>
             </template>
@@ -57,8 +63,10 @@
 <script>
 import User from "@jx3box/jx3box-common/js/user";
 import { sendCny, checkCnyStatus, checkGiftStatus } from "../../service/thx";
+import i18nMixin from "../../i18n/mixin";
 export default {
     name: "AuthorGift",
+    mixins: [i18nMixin],
     props: {
         uid: {
             type: [Number, String],
@@ -77,7 +85,7 @@ export default {
             chargeLink: "/vip/cny?redirect=" + location.href,
 
             count: 0, //打赏数量
-            remark: "辛苦，感谢！",
+            remark: this.$jx3boxT("jx3boxUi.authorGift.defaultRemark", "辛苦，感谢！"),
         };
     },
     computed: {
@@ -96,9 +104,9 @@ export default {
         },
         btnTitle: function () {
             if (this.isSelf) {
-                return "不能给自己赠送礼物";
+                return this.$jx3boxT("jx3boxUi.authorGift.selfDisabled", "不能给自己赠送礼物");
             } else if (!this.status) {
-                return "作者没有开启接受礼物";
+                return this.$jx3boxT("jx3boxUi.authorGift.statusDisabled", "作者没有开启接受礼物");
             }
             return "";
         },
@@ -131,7 +139,7 @@ export default {
                 // 状态轮询
                 const loading = this.$loading({
                     lock: true,
-                    text: "正在处理中",
+                    text: this.$jx3boxT("jx3boxUi.authorGift.processing", "正在处理中"),
                     spinner: "el-icon-loading",
                     background: "rgba(255, 255, 255, 0.8)",
                 });
@@ -154,14 +162,14 @@ export default {
                                 this.visible = false;
                                 this.loading = false;
                                 this.$message({
-                                    message: "赠送成功",
+                                    message: this.$jx3boxT("jx3boxUi.authorGift.success", "赠送成功"),
                                     type: "success",
                                 });
 
                                 // 结算与重置
                                 this.left = this.left - this.count;
                                 this.count = 100;
-                                this.remark = "辛苦，感谢！";
+                                this.remark = this.$jx3boxT("jx3boxUi.authorGift.defaultRemark", "辛苦，感谢！");
                             } else {
                                 console.info(`[AUTHOR.CNY]重新轮询`);
                             }
@@ -180,7 +188,7 @@ export default {
                         // 关闭加载状态 & 消息提醒
                         this.visible = false;
                         this.loading = false;
-                        this.$message("交易繁忙，请稍后再试");
+                        this.$message(this.$jx3boxT("jx3boxUi.authorGift.busy", "交易繁忙，请稍后再试"));
                     }
                 }, 1000);
             });

package/src/author/AuthorInfo.vue

@@ -4,20 +4,32 @@
             <Avatar class="u-avatar" :uid="uid" :url="data.user_avatar" size="s" :frame="data.user_avatar_frame" />
             <div class="u-info">
                 <div class="u-name">
-                    <el-tooltip class="item" effect="dark" content="签约作者" placement="top" v-if="isSuperAuthor">
+                    <el-tooltip
+                        class="item"
+                        effect="dark"
+                        :content="$jx3boxT('jx3boxUi.authorInfo.superAuthor', '签约作者')"
+                        placement="top"
+                        v-if="isSuperAuthor"
+                    >
                         <a class="u-superauthor" href="/about/superauthor" target="_blank">
                             <img :src="super_author_icon" alt="superauthor" />
                         </a>
                     </el-tooltip>
                     <a class="u-displayname" :href="authorLink(uid)" target="_blank" v-if="!anonymous">
-                        {{ data.display_name || "未知" }}
+                        {{ data.display_name || $jx3boxT("jx3boxUi.authorInfo.unknown", "未知") }}
                     </a>
-                    <span class="u-displayname u-anonymous" v-else>神秘侠士</span>
+                    <span class="u-displayname u-anonymous" v-else>{{
+                        $jx3boxT("jx3boxUi.authorInfo.mysterious", "神秘侠士")
+                    }}</span>
                 </div>
                 <div class="u-extend">
                     <el-tooltip class="item" effect="dark" placement="top" v-if="!anonymous">
                         <template #content>
-                            <span class="u-tips">经验值：{{ data.experience }}</span>
+                            <span class="u-tips">{{
+                                $jx3boxT("jx3boxUi.authorInfo.experience", "经验值：{value}", {
+                                    value: data.experience,
+                                })
+                            }}</span>
                         </template>
                         <a
                             class="u-level"
@@ -37,7 +49,13 @@
                         target="_blank"
                         >Lv.{{ level }}</a
                     >
-                    <el-tooltip class="item" effect="dark" :content="vipTypeTitle" placement="top" v-if="isVip && !anonymous">
+                    <el-tooltip
+                        class="item"
+                        effect="dark"
+                        :content="vipTypeTitle"
+                        placement="top"
+                        v-if="isVip && !anonymous"
+                    >
                         <a class="u-vip" href="/vip/premium?from=sidebar_author" target="_blank">
                             <i class="i-icon-vip on">{{ vipType }}</i>
                         </a>
@@ -58,10 +76,12 @@ import User from "@jx3box/jx3box-common/js/user";
 import { getUserInfo } from "../../service/author";
 import Avatar from "./Avatar.vue";
 import Honor from "./AuthorHonor.vue";
+import i18nMixin from "../../i18n/mixin";
 
 const { __imgPath, __userLevelColor } = JX3BOX;
 export default {
     name: "AuthorInfo",
+    mixins: [i18nMixin],
     props: {
         uid: {
             type: [Number, String],
@@ -94,7 +114,9 @@ export default {
             return this.data?.is_pro ? "PRO" : "PRE";
         },
         vipTypeTitle: function () {
-            return this.data?.is_pro ? "专业版会员" : "高级版会员";
+            return this.data?.is_pro
+                ? this.$jx3boxT("jx3boxUi.authorInfo.proVip", "专业版会员")
+                : this.$jx3boxT("jx3boxUi.authorInfo.preVip", "高级版会员");
         },
         isVip: function () {
             return this.data?.is_pro || this.data?.is_pre;
@@ -135,22 +157,35 @@ export default {
 <style lang="less">
 .c-author-info {
     .u-author {
-        .clearfix;
-        .db;
+        .flex(y);
+        gap:15px;
+        // .db;
         .mb(10px);
         .pr;
     }
     .u-avatar {
-        .fl;
-        .mr(15px);
+        // .fl;
+        // .mr(15px);
         .size(68px);
+        flex-shrink: 0;
+    }
+    .u-info {
+        .pr;
+        // top: -4px;
+        // .h(68px);
+        display: flex;
+        flex-direction: column;
+        justify-content: center;
+        gap:8px;
     }
     .u-name {
         .flex;
         align-items: center;
+        max-width: 120px;
+        .break;
     }
     .u-displayname {
-        .lh(2.2);
+        .lh(1.2);
         .bold;
         color: @darkblue;
         .nobreak;
@@ -175,14 +210,6 @@ export default {
         }
     }
 
-    .u-info {
-        .pr;
-        top: -4px;
-        .h(68px);
-        display: flex;
-        flex-direction: column;
-        justify-content: center;
-    }
     .u-bio {
         .fz(12px, 2);
         .break(3);

package/src/author/AuthorLink.vue

@@ -25,7 +25,7 @@
             :class="'u-link__' + data.tv_type"
             :href="tv_link"
             target="_blank"
-            :title="`房间号:${data.tv_id}`"
+            :title="$jx3boxT('jx3boxUi.authorLink.roomId', '房间号:{id}', { id: data.tv_id })"
         >
             <img :src="getIcon(data.tv_type)" />
         </a>
@@ -35,9 +35,11 @@
 <script>
 import * as utilModule from "@jx3box/jx3box-common/js/utils";
 const { tvLink } = utilModule;
+import i18nMixin from "../../i18n/mixin";
 
 export default {
     name: "AuthorLink",
+    mixins: [i18nMixin],
     props: {
         data: {
             type: Object,