From 9aa1830a1bea8a5bd502d292ef6a1614f977c995 Mon Sep 17 00:00:00 2001
From: zhangrenyuan <18990852002@163.com>
Date: Thu, 27 Nov 2025 18:16:58 +0800
Subject: [PATCH] =?UTF-8?q?=F0=9F=A6=84=20refactor:=20=E5=AE=8C=E6=88=90?=
 =?UTF-8?q?=E5=A4=9A=E8=AF=AD=E8=A8=80=E9=85=8D=E7=BD=AE=E9=A1=B5=E9=9D=A2?=
 =?UTF-8?q?=E7=9A=84=E7=BC=96=E5=86=99=EF=BC=8C=E6=8E=A5=E5=8F=A3=E5=AF=B9?=
 =?UTF-8?q?=E6=8E=A5=E5=AE=8C=E6=AF=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/language/languageTranslate.vue | 207 ++++++++++++++-----------------
 1 file changed, 95 insertions(+), 112 deletions(-)

diff --git a/src/views/language/languageTranslate.vue b/src/views/language/languageTranslate.vue
index e8e17d3..7101170 100644
--- a/src/views/language/languageTranslate.vue
+++ b/src/views/language/languageTranslate.vue
@@ -6,28 +6,7 @@
                 <el-text size="large">搜索：</el-text>
                 <el-input v-model="searchForm.chineseSimplified" style="width: 12vw" placeholder="请输入原文内容" clearable />
             </div>
-            <div class="condition-item">
-                <el-text size="large">语言状态：</el-text>
-                <el-select v-model="searchForm.languageStatus" placeholder="全部" style="width: 12vw" clearable>
-                    <el-option label="全部" value="" />
-                    <el-option label="已翻译" value="translated" />
-                    <el-option label="未翻译" value="untranslated" />
-                </el-select>
-            </div>
-            <!-- <div class="condition-item">
-                <el-text size="large">所属模块：</el-text>
-                <el-select v-model="searchForm.module" placeholder="请选择功能模块" style="width: 9vw" clearable multiple>
-                    <el-option label="工作台" value="dashboard" />
-                    <el-option label="财务审核" value="finance" />
-                    <el-option label="充值管理" value="recharge" />
-                    <el-option label="消耗管理" value="consumption" />
-                </el-select>
-            </div>
-            <div class="condition-item">
-                <el-text size="large">配置时间：</el-text>
-                <el-date-picker v-model="searchForm.timeRange" type="daterange" range-separator="至"
-                    start-placeholder="开始日期" end-placeholder="结束日期" format="YYYY-MM-DD" style="width: 16vw" clearable />
-            </div> -->
+            <!-- 移除语言状态筛选 -->
             <div class="btn">
                 <el-button type="primary" @click="search">搜索</el-button>
                 <el-button type="success" @click="reset">重置</el-button>
@@ -50,7 +29,7 @@
                     </template>
                 </el-table-column>
 
-                <el-table-column prop="chineseSimplified" label="原文（中文）" width="200px">
+                <el-table-column prop="chineseSimplified" label="原文（中文）" width="180px" >
                     <template #default="scope">
                         <el-tooltip :content="scope.row.chineseSimplified" placement="top"
                             v-if="scope.row.chineseSimplified && scope.row.chineseSimplified.length > 20">
@@ -60,83 +39,104 @@
                     </template>
                 </el-table-column>
 
-                <el-table-column prop="english" label="英文" width="150px">
+                <el-table-column prop="english" label="英文" width="180px" header-align="center">
                     <template #default="scope">
-                        <el-tooltip :content="scope.row.english" placement="top"
-                            v-if="scope.row.english && scope.row.english.length > 15">
-                            <span>{{ truncateText(scope.row.english) }}</span>
-                        </el-tooltip>
-                        <span v-else>{{ scope.row.english }}</span>
+                        <div style="display: flex; align-items: center; justify-content: space-between;">
+                            <div style="flex: 1;">
+                                <el-tooltip :content="scope.row.english" placement="top"
+                                    v-if="scope.row.english && scope.row.english.length > 15">
+                                    <span>{{ truncateText(scope.row.english) }}</span>
+                                </el-tooltip>
+                                <span v-else>{{ scope.row.english }}</span>
+                            </div>
+                            <el-tag :type="scope.row.english ? 'success' : 'info'" size="small" style="margin-left: 8px;">
+                                {{ scope.row.english ? '已翻译' : '未翻译' }}
+                            </el-tag>
+                        </div>
                     </template>
                 </el-table-column>
 
-                <el-table-column prop="thai" label="泰语" width="150px">
+                <el-table-column prop="thai" label="泰语" width="180px" header-align="center">
                     <template #default="scope">
-                        <el-tooltip :content="scope.row.thai" placement="top"
-                            v-if="scope.row.thai && scope.row.thai.length > 15">
-                            <span>{{ truncateText(scope.row.thai) }}</span>
-                        </el-tooltip>
-                        <span v-else>{{ scope.row.thai }}</span>
-                    </template>
-                </el-table-column>
-
-                <el-table-column prop="chineseTraditional" label="繁体中文" width="150px">
-                    <template #default="scope">
-                        <el-tooltip :content="scope.row.chineseTraditional" placement="top"
-                            v-if="scope.row.chineseTraditional && scope.row.chineseTraditional.length > 15">
-                            <span>{{ truncateText(scope.row.chineseTraditional) }}</span>
-                        </el-tooltip>
-                        <span v-else>{{ scope.row.chineseTraditional }}</span>
+                        <div style="display: flex; align-items: center; justify-content: space-between;">
+                            <div style="flex: 1;">
+                                <el-tooltip :content="scope.row.thai" placement="top"
+                                    v-if="scope.row.thai && scope.row.thai.length > 15">
+                                    <span>{{ truncateText(scope.row.thai) }}</span>
+                                </el-tooltip>
+                                <span v-else>{{ scope.row.thai }}</span>
+                            </div>
+                            <el-tag :type="scope.row.thai ? 'success' : 'info'" size="small" style="margin-left: 8px;">
+                                {{ scope.row.thai ? '已翻译' : '未翻译' }}
+                            </el-tag>
+                        </div>
                     </template>
                 </el-table-column>
 
-                <el-table-column prop="malay" label="马来语" width="150px">
+                <el-table-column prop="chineseTraditional" label="繁体中文" width="150px" header-align="center">
                     <template #default="scope">
-                        <el-tooltip :content="scope.row.malay" placement="top"
-                            v-if="scope.row.malay && scope.row.malay.length > 15">
-                            <span>{{ truncateText(scope.row.malay) }}</span>
-                        </el-tooltip>
-                        <span v-else>{{ scope.row.malay }}</span>
+                        <div style="display: flex; align-items: center; justify-content: space-between;">
+                            <div style="flex: 1;">
+                                <el-tooltip :content="scope.row.chineseTraditional" placement="top"
+                                    v-if="scope.row.chineseTraditional && scope.row.chineseTraditional.length > 15">
+                                    <span>{{ truncateText(scope.row.chineseTraditional) }}</span>
+                                </el-tooltip>
+                                <span v-else>{{ scope.row.chineseTraditional }}</span>
+                            </div>
+                            <el-tag :type="scope.row.chineseTraditional ? 'success' : 'info'" size="small" style="margin-left: 8px;">
+                                {{ scope.row.chineseTraditional ? '已翻译' : '未翻译' }}
+                            </el-tag>
+                        </div>
                     </template>
                 </el-table-column>
 
-                <el-table-column prop="vietnamese" label="越南语" width="150px">
+                <el-table-column prop="malay" label="马来语" width="150px" header-align="center">
                     <template #default="scope">
-                        <el-tooltip :content="scope.row.vietnamese" placement="top"
-                            v-if="scope.row.vietnamese && scope.row.vietnamese.length > 15">
-                            <span>{{ truncateText(scope.row.vietnamese) }}</span>
-                        </el-tooltip>
-                        <span v-else>{{ scope.row.vietnamese }}</span>
+                        <div style="display: flex; align-items: center; justify-content: space-between;">
+                            <div style="flex: 1;">
+                                <el-tooltip :content="scope.row.malay" placement="top"
+                                    v-if="scope.row.malay && scope.row.malay.length > 15">
+                                    <span>{{ truncateText(scope.row.malay) }}</span>
+                                </el-tooltip>
+                                <span v-else>{{ scope.row.malay }}</span>
+                            </div>
+                            <el-tag :type="scope.row.malay ? 'success' : 'info'" size="small" style="margin-left: 8px;">
+                                {{ scope.row.malay ? '已翻译' : '未翻译' }}
+                            </el-tag>
+                        </div>
                     </template>
                 </el-table-column>
 
-                <!-- <el-table-column prop="modules" label="所属模块" width="180px">
-                    <template #default="scope">
-                        <el-tag v-for="module in scope.row.modules" :key="module" size="small"
-                            style="margin-right: 4px; margin-bottom: 4px;">
-                            {{ getModuleLabel(module) }}
-                        </el-tag>
-                    </template>
-                </el-table-column> -->
-
-                <el-table-column prop="status" label="状态" width="120px">
+                <el-table-column prop="vietnamese" label="越南语" width="150px" header-align="center">
                     <template #default="scope">
-                        <el-tag :type="getStatusType(scope.row.status)" size="small">
-                            {{ scope.row.status === 'translated' ? '已翻译' : '未翻译' }}
-                        </el-tag>
+                        <div style="display: flex; align-items: center; justify-content: space-between;">
+                            <div style="flex: 1;">
+                                <el-tooltip :content="scope.row.vietnamese" placement="top"
+                                    v-if="scope.row.vietnamese && scope.row.vietnamese.length > 15">
+                                    <span>{{ truncateText(scope.row.vietnamese) }}</span>
+                                </el-tooltip>
+                                <span v-else>{{ scope.row.vietnamese }}</span>
+                            </div>
+                            <el-tag :type="scope.row.vietnamese ? 'success' : 'info'" size="small" style="margin-left: 8px;">
+                                {{ scope.row.vietnamese ? '已翻译' : '未翻译' }}
+                            </el-tag>
+                        </div>
                     </template>
                 </el-table-column>
 
-                <el-table-column prop="configTime" label="配置时间" width="180px">
+                <!-- 移除状态列 -->
+                <el-table-column prop="configTime" label="配置时间" width="180px" header-align="center">
                     <template #default="scope">
                         {{ moment(scope.row.configTime).format('YYYY-MM-DD HH:mm:ss') }}
                     </template>
                 </el-table-column>
 
-                <el-table-column prop="operation" label="操作" width="150px" fixed="right">
+                <el-table-column prop="operation" label="操作" width="155px" fixed="right" header-align="center">
                     <template #default="scope">
-                        <el-button type="primary" text @click="handleEdit(scope.row)">编辑</el-button>
-                        <el-button type="danger" text @click="handleDelete(scope.row)">删除</el-button>
+                        <div style="display:flex; justify-content:center; ">
+                            <el-button type="primary" text @click="handleEdit(scope.row)">编辑</el-button>
+                            <el-button type="danger" text @click="handleDelete(scope.row)">删除</el-button>
+                        </div>
                     </template>
                 </el-table-column>
             </el-table>
@@ -187,14 +187,6 @@
                 <el-input v-model="editForm.vietnamese" placeholder="请输入越南语翻译"  show-word-limit />
             </el-form-item>
 
-            <!-- <el-form-item label="所属模块：">
-                <el-select v-model="editForm.modules" placeholder="请选择功能模块" multiple style="width: 100%">
-                    <el-option label="工作台" value="dashboard" />
-                    <el-option label="财务审核" value="finance" />
-                    <el-option label="充值管理" value="recharge" />
-                    <el-option label="消耗管理" value="consumption" />
-                </el-select>
-            </el-form-item> -->
         </el-form>
 
         <template #footer>
@@ -235,15 +227,13 @@ import ConfirmDialog from '@/components/dialogs/ConfirmDialog.vue'
 const tableData = ref([])
 const pagination = ref({
     pageNum: 1,
-    pageSize: 10,
+    pageSize: 20,
     total: 0
 })
 
 const searchForm = ref({
     chineseSimplified: '',
-    languageStatus: '',
-    // module: [],
-    // timeRange: []
+    // 移除languageStatus字段
 })
 
 const showEditDialog = ref(false)
@@ -263,13 +253,13 @@ const editForm = ref({
     configTime: new Date()
 })
 
-// 计算属性 - 判断翻译状态
-const translationStatus = computed(() => {
-    return (row) => {
-        const hasTranslation = row.english || row.thai || row.chineseTraditional || row.malay || row.vietnamese
-        return hasTranslation ? 'translated' : 'untranslated'
-    }
-})
+// 移除计算属性 - 不再需要统一的状态计算
+// const translationStatus = computed(() => {
+//     return (row) => {
+//         const hasTranslation = row.english || row.thai || row.chineseTraditional || row.malay || row.vietnamese
+//         return hasTranslation ? 'translated' : 'untranslated'
+//     }
+// })
 
 // 方法定义
 const truncateText = (text) => {
@@ -277,20 +267,11 @@ const truncateText = (text) => {
     return text.length > 20 ? text.substring(0, 20) + '...' : text
 }
 
-// const getModuleLabel = (module) => {
-//     const moduleMap = {
-//         'dashboard': '工作台',
-//         'finance': '财务审核',
-//         'recharge': '充值管理',
-//         'consumption': '消耗管理',
-//     }
-//     return moduleMap[module] || module
+// 移除getStatusType方法，因为现在每个语言列单独判断状态
+// const getStatusType = (status) => {
+//     return status === 'translated' ? 'success' : 'info'
 // }
 
-const getStatusType = (status) => {
-    return status === 'translated' ? 'success' : 'info'
-}
-
 // 搜索功能
 const search = async () => {
     await getTranslationList()
@@ -300,9 +281,7 @@ const search = async () => {
 const reset = () => {
     searchForm.value = {
         chineseSimplified: '',
-        languageStatus: '',
-        // module: [],
-        // timeRange: []
+        // 移除languageStatus
     }
     getTranslationList()
 }
@@ -323,10 +302,8 @@ const getTranslationList = async () => {
         })
 
         if (res.code === 200) {
-            tableData.value = res.data.list.map(item => ({
-                ...item,
-                status: translationStatus.value(item)
-            }))
+            // 不再需要设置统一的状态字段
+            tableData.value = res.data.list
             pagination.value.total = res.data.total
         }
     } catch (error) {
@@ -375,6 +352,12 @@ const handleSave = async () => {
             ElMessage.success(editForm.value.id ? '编辑成功' : '添加成功')
             showEditDialog.value = false
             getTranslationList()
+        } else if (res.code === 0) {
+            // 处理后端返回的错误信息
+            ElMessage.error(res.msg || '操作失败')
+        } else {
+            // 处理其他错误码
+            ElMessage.error(res.msg || '操作失败')
         }
     } catch (error) {
         console.error('保存失败:', error)