好多好多好多字

✨ 增加对群成员头衔的显示支持 🎨 将多语言功能翻新为更常用的 POT/PO 格式 💄 优化 At 信息悬浮窗样式 💄 优化好友列表分组显示样式 ♿ 群成员列表现在改为按照拼音首字母排序 ➕ 新增依赖：gettext-parser
Stapxs · Sep 20, 2024 · 61c6627 · 61c6627
1 parent a5cafef
commit 61c6627
Show file tree

Hide file tree

Showing 50 changed files with 6,763 additions and 2,051 deletions.
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "stapxs-qq-lite",
-  "version": "2.8.6",
+  "version": "2.9.0",
   "private": false,
   "author": "Stapx Steve [林槐]",
   "description": "一个兼容 OneBot 的非官方网页版 QQ 客户端，使用 Vue 重制的全新版本。",
@@ -27,6 +27,7 @@
     "detect-browser": "^5.3.0",
     "electron-store": "^8.1.0",
     "electron-window-state": "^5.0.3",
+    "gettext-parser": "^8.0.0",
     "js-file-downloader": "^1.1.24",
     "js-yaml-loader": "^1.2.2",
     "jsonpath": "^1.1.1",
@@ -54,6 +55,7 @@
     "@types/animejs": "^3.1.12",
     "@types/css": "^0.0.33",
     "@types/electron-devtools-installer": "^2.2.0",
+    "@types/gettext-parser": "^4.0.4",
     "@types/jsonpath": "^0.2.3",
     "@types/semver-compare": "^1.0.3",
     "@typescript-eslint/eslint-plugin": "^5.4.0",

diff --git a/src/App.vue b/src/App.vue
@@ -35,38 +35,37 @@
                 </li>
             </ul>
             <div :style="get('fs_adaptation') > 0 ? `height: calc(100% - ${75 + Number(get('fs_adaptation'))}px);` : ''">
-                <div :name="$t('home_title')" v-if="tags.page == 'Home'">
+                <div :name="$t('主页')" v-if="tags.page == 'Home'">
                     <div class="home-body">
                         <div class="login-pan-card ss-card">
                             <font-awesome-icon :icon="['fas', 'circle-nodes']" />
-                            <p>{{ $t('home_card_title') }}</p>
+                            <p>{{ $t('连接到 OneBot') }}</p>
                             <form @submit.prevent @submit="connect">
                                 <label>
                                     <font-awesome-icon :icon="['fas', 'link']" />
-                                    <input v-model="loginInfo.address" :placeholder="$t('home_card_address')"
+                                    <input v-model="loginInfo.address" :placeholder="$t('连接地址')"
                                         class="ss-input" id="sev_address" autocomplete="off">
                                 </label>
                                 <label>
                                     <font-awesome-icon :icon="['fas', 'lock']" />
-                                    <input v-model="loginInfo.token" :placeholder="$t('home_card_key')" class="ss-input"
+                                    <input v-model="loginInfo.token" :placeholder="$t('连接密钥')" class="ss-input"
                                         type="password" id="access_token" autocomplete="off">
                                 </label>
                                 <div style="display: flex;">
                                     <label class="default">
                                         <input id="in_" type="checkbox" name="save_password" @click="savePassword" v-model="tags.savePassword">
-                                        <a>{{ $t('home_card_save_pwd') }}</a>
+                                        <a>{{ $t('记住密码') }}</a>
                                     </label>
                                     <div style="flex: 1;"></div>
                                     <label class="default" style="justify-content: flex-end;">
                                         <input type="checkbox" name="auto_connect" @click="saveAutoConnect" v-model="runtimeData.sysConfig.auto_connect">
-                                        <a>{{ $t('home_card_auto_con') }}</a>
+                                        <a>{{ $t('自动连接') }}</a>
                                     </label>
                                 </div>
-                                <button @mousemove="afd" id="connect_btn" class="ss-button" type="submit">{{ $t('home_card_connect')
-                                }}</button>
+                                <button @mousemove="afd" id="connect_btn" class="ss-button" type="submit">{{ $t('连接')}}</button>
                             </form>
                             <a href="https://github.com/Stapxs/Stapxs-QQ-Lite-2.0#%E5%BF%AB%E9%80%9F%E4%BD%BF%E7%94%A8"
-                                target="_blank" style="margin-bottom: -20px;">{{ $t('home_card_how_to_connect') }}</a>
+                                target="_blank" style="margin-bottom: -20px;">{{ $t('如何连接') }}</a>
                             <div class="wave-pan" style="margin-left: -30px;">
                                 <svg id="login-wave" xmlns="http://www.w3.org/2000/svg"
                                     xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 24 170 70"
@@ -401,11 +400,11 @@ export default defineComponent({
                 Option.save('save_password', true)
                 // 创建提示弹窗
                 const popInfo = {
-                    title: this.$t('popbox_tip'),
-                    html: `<span>${this.$t('auto_connect_tip')}</span>`,
+                    title: this.$t('提醒'),
+                    html: `<span>${this.$t('连接密钥将以明文存储在浏览器 Cookie 中，请确保设备安全以防止密钥泄漏。')}</span>`,
                     button: [
                         {
-                            text: app.config.globalProperties.$t('btn_know'),
+                            text: app.config.globalProperties.$t('知道了'),
                             master: true,
                             fun: () => { runtimeData.popBoxList.shift() }
                         }
@@ -519,8 +518,8 @@ export default defineComponent({
             }
             // =========================================================================
             // 初始化完成
-            logger.debug(this.$t('log_welcome'))
-            logger.debug(this.$t('log_runtime') + ': ' + process.env.NODE_ENV)
+            logger.debug('欢迎使用 Stapxs QQ Lite！')
+            logger.debug('当前启动模式为: ' + process.env.NODE_ENV)
             // UM：加载 Umami 统计功能
             if (!Option.get('close_ga') && process.env.NODE_ENV == 'production') {
                 // 给页面添加一个来源域名方便在 electron 中获取
@@ -533,7 +532,7 @@ export default defineComponent({
                 }
                 Umami.initialize(config)
             } else if (process.env.NODE_ENV == 'development') {
-                logger.debug(this.$t('log_GA_auto_closed'))
+                logger.debug('由于运行在调试模式下，分析组件并未加载 ……')
             }
             App.checkUpdate()                // 检查更新
             App.checkOpenTimes()             // 检查打开次数

diff --git a/src/assets/css/append/append_new.css b/src/assets/css/append/append_new.css
@@ -100,11 +100,23 @@
 }
 
 .mumber-info > div:first-child {
-    padding: 10px;
+    padding: 15px;
+}
+.mumber-info > div:first-child > div {
+    margin-left: 15px;
+}
+.mumber-info > div:first-child > div > div > a {
+    font-size: 0.8rem;
 }
 .mumber-info > div:first-child img {
-    height: 45px;
-    width: 45px;
+    height: 35px;
+    width: 35px;
+}
+.mumber-info > div:first-child > div > span {
+    font-size: 0.75rem;
+}
+.mumber-info > div:first-child > div > div > div > span {
+    font-size: 0.6rem;
 }
 
 .chat-pan {
@@ -222,6 +234,9 @@
     height: 30px;
     width: 30px;
 }
+.message-body > span {
+    font-size: 0.6rem;
+}
 .message-body > a {
     font-size: 0.8rem;
 

diff --git a/src/assets/css/chat.css b/src/assets/css/chat.css
@@ -492,14 +492,17 @@ input {
 .mumber-info > div:first-child {
     transform: translate(-20px, calc(-100% - 0.8rem));
     box-shadow: 0 0 5px var(--color-shader);
-    background: var(--color-card-2);
+    background: rgba(var(--color-card-2-rgb), 0.5);
+    border: 1px solid var(--color-card-2);
+    backdrop-filter: blur(15px);
     padding: 10px 20px 10px 10px;
     width: fit-content;
     overflow: hidden;
-    max-width: 35%;
+    max-width: 55%;
     display: flex;
 }
 .mumber-info > div:first-child img {
+    outline: 2px solid var(--color-main);
     border-radius: 7px;
     height: 60px;
     width: 60px;
@@ -510,6 +513,8 @@ input {
     flex: 1;
 }
 .mumber-info > div:first-child > div > span {
+    color: var(--color-font-1);
+    font-size: 0.9rem;
     white-space: nowrap;
 }
 .mumber-info > div:first-child > div > span[name=id] {
@@ -523,6 +528,9 @@ input {
     display: flex;
 }
 .mumber-info > div:first-child > div > div > a {
+    text-overflow: ellipsis;
+    width: 100%;
+    overflow: hidden;
     white-space: nowrap;
     margin-right: 10px;
     font-weight: bold;
@@ -535,10 +543,10 @@ input {
 .mumber-info > div:first-child > div > div > div > span {
     background: var(--color-main);
     color: var(--color-font-r);
-    padding: 4px 10px 0 10px;
+    padding: 2px 10px 2px 10px;
     border-radius: 2rem;
     margin-left: 5px;
-    font-size: 0.5rem;
+    font-size: 0.7rem;
 }
 .mumber-info > div:first-child > div > div > div > span:first-child {
     margin-left: 0;
@@ -700,12 +708,17 @@ input {
     width: 30px;
 }
 .chat-info-tab-member > div > div {
+    overflow: hidden;
     align-items: center;
     display: flex;
     flex: 1;
 }
 .chat-info-tab-member > div > div > a {
     color: var(--color-font);
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    max-width: 80%;
+    overflow: hidden;
 }
 .chat-info-tab-member > div > div > svg {
     color: var(--color-main);

diff --git a/src/assets/css/msg.css b/src/assets/css/msg.css
@@ -78,6 +78,13 @@
 .message-body.me a:link::before {
     text-shadow: 0 0 0 var(--color-font-1-r);
 }
+.message-body > span {
+    font-size: 0.7rem;
+    background: var(--color-main);
+    color: #fff;
+    border-radius: 10px;
+    padding: 1px 4px;
+}
 .message-body > a {
     color: var(--color-font-1);
     font-size: 0.9rem;