yh-i18n 2.2.21 → 2.2.22

package/excelTool.ts

@@ -5,6 +5,33 @@ import http from '@/libs/api.request';
 import {useI18nStore} from './index';
 
 const verificationCode = 'lkyhtranslateexcel';
+
+/**
+ * 解析翻译内容，将 JSON 字符串解析并合并到 item 对象中
+ * @param item 翻译项对象
+ * @param localKeys 本地语言键列表
+ * @returns 处理后的翻译项对象
+ */
+export function parseTranslateContent(item: any, localKeys: string[]): any {
+  try {
+    let content = JSON.parse(item.content);
+    let keys = Object.keys(content);
+
+    keys.forEach((key) => {
+      let val = content[key];
+      item[key] = val;
+    });
+
+    localKeys.forEach((k) => {
+      if (!keys.includes(k)) {
+        item[k] = '';
+      }
+    });
+  } catch (error) {
+    console.error('解析翻译内容失败:', error);
+  }
+  return item;
+}
 export async function exportExcel(total) {
   const loading = ElLoading.service({
     lock: true,
@@ -24,23 +51,7 @@ export async function exportExcel(total) {
     .then((res) => {
       let localKeys = i18nStore.localList.map((item) => item.value);
       let {records} = res.data.data;
-      records = records.map((item) => {
-        try {
-          let content = JSON.parse(item.content);
-          let keys = Object.keys(content);
-
-          keys.forEach((key) => {
-            let val = content[key];
-            item[key] = val;
-          });
-          localKeys.forEach((k) => {
-            if (!keys.includes(k)) {
-              item[k] = '';
-            }
-          });
-        } catch (error) {}
-        return item;
-      });
+      records = records.map((item) => parseTranslateContent(item, localKeys));
       return records;
     });
   loading.setText('正在序列化表格数据……');
@@ -77,8 +88,8 @@ export async function exportExcel(total) {
   sheet.addRow(title);
   sheet.addRows(
     records.map((item) => {
-      let {adTranslateId, tKey} = item;
-      let row = [adTranslateId, tKey];
+      let {id, name} = item;
+      let row = [id, name];
       Config.i18nList.forEach((valKey) => {
         row.push(item[valKey]);
       });
@@ -201,6 +212,7 @@ export async function importExcel(e, getDataList) {
           message: '您选择的文件不是系统导出的文件',
           type: 'warning',
         });
+        e.target.value = '';
         return false;
       }
       const loading = ElLoading.service({
@@ -215,14 +227,14 @@ export async function importExcel(e, getDataList) {
       let dataList: any[] = [];
       sheet.getRows(2, len)?.forEach((row) => {
         let id = row.getCell(1).value;
-        let tKey = row.getCell(2).value;
+        let name = row.getCell(2).value;
         let content: any = {};
         Config.i18nList.forEach((item, index) => {
           content[item] = row.getCell(index + 3).value;
         });
         dataList.push({
           id,
-          tKey,
+          name,
           content: JSON.stringify(content),
         });
       });
@@ -250,6 +262,8 @@ export async function importExcel(e, getDataList) {
       getDataList();
     } catch (error) {
       ElMessage.error('导入保存翻译数据遇到错误：', error.message);
+    } finally {
+      e.target.value = '';
     }
   }
 }

package/list.vue

@@ -5,7 +5,7 @@
         <el-form inline>
           <el-form-item :label="ct('翻译键名')">
             <el-input
-              v-model="listForm.tKey"
+              v-model="listForm.name"
               @keyup.enter.stop.prevent="getDataList(true)"
               :placeholder="ct('键入以筛选键名')"></el-input>
           </el-form-item>
@@ -48,7 +48,7 @@
       ref="i18nList"
       stripe
       :data="dataList"
-      row-key="adTranslateId"
+      row-key="id"
       @row-click="rowClickHandler">
       <el-table-column
         type="selection"
@@ -76,13 +76,13 @@
           <el-button
             link
             type="danger"
-            @click="delOne(row.adTranslateId)">
+            @click="delOne(row.id)">
             {{ ct('删除') }}
           </el-button>
         </template>
       </el-table-column>
       <el-table-column
-        prop="tkey"
+        prop="name"
         min-width="140"
         fixed="left"
         :label="ct('翻译键名')"></el-table-column>
@@ -107,7 +107,7 @@
     @close="cancelForm"
     :close-on-click-modal="false"
     draggable
-    :title="formData.adTranslateId ? ct('编辑翻译') : ct('新增翻译')">
+    :title="formData.id ? ct('编辑翻译') : ct('新增翻译')">
     <vxe-form
       title-align="right"
       title-width="100px"
@@ -115,7 +115,7 @@
       title-colon
       :data="formData"
       :items="formItems"
-      :rules="fromRules"></vxe-form>
+      :rules="formRules"></vxe-form>
     <template #footer>
       <div class="yh-i18n-form-actions">
         <el-button
@@ -146,16 +146,16 @@
   </el-dialog>
 </template>
 <script setup lang="ts">
-import {reactive, ref, onMounted, watch} from 'vue';
+import {reactive, ref, onMounted, onUnmounted, watch} from 'vue';
 import {ElLoadingService, ElMessage, ElMessageBox} from 'element-plus';
 import {useI18nStore, ct} from 'yh-i18n';
 import http from '@/libs/api.request';
 import {VxeFormInstance, VxeFormPropTypes} from 'vxe-table';
-import {exportExcel, importExcel} from './excelTool';
+import {exportExcel, importExcel, parseTranslateContent} from './excelTool';
 
 interface TranslateItem {
-  adTranslateId?: string;
-  tKey: string;
+  id?: string;
+  name: string;
   content: string;
   [key: string]: any;
 }
@@ -167,7 +167,7 @@ interface ListColumn {
 }
 
 interface SaveData {
-  tKey: string;
+  name: string;
   content: Record<string, string> | string;
   id?: string;
 }
@@ -180,7 +180,7 @@ const deleteUrl = '/translate/deleteTranslate';
 
 const i18nList = ref();
 const listForm = reactive({
-  tKey: '',
+  name: '',
   pageNum: 1,
   pageSize: 10,
   total: 0,
@@ -188,7 +188,7 @@ const listForm = reactive({
 const listColumns = reactive<ListColumn[]>([]);
 const dataList = ref<TranslateItem[]>([]);
 function getDataList(isReset = false) {
-  let {tKey, pageNum, pageSize} = listForm;
+  let {name, pageNum, pageSize} = listForm;
   if (isReset) {
     pageNum = 1;
   }
@@ -200,7 +200,7 @@ function getDataList(isReset = false) {
       url: '/translate/select',
       method: 'post',
       data: {
-        tKey,
+        name,
         pageNum,
         pageSize,
       },
@@ -208,28 +208,14 @@ function getDataList(isReset = false) {
     .then((res) => {
       let localKeys = i18nStore.localList.map((item) => item.value);
       let {records, total} = res.data.data;
-      records = records.map((item) => {
-        try {
-          let content = JSON.parse(item.content);
-          let keys = Object.keys(content);
-
-          keys.forEach((key) => {
-            let val = content[key];
-            item[key] = val;
-          });
-          localKeys.forEach((k) => {
-            if (!keys.includes(k)) {
-              item[k] = '';
-            }
-          });
-        } catch (error) {
-          console.error('解析翻译内容失败:', error);
-        }
-        return item;
-      });
+      records = records.map((item) => parseTranslateContent(item, localKeys));
       dataList.value = records;
       listForm.total = total;
     })
+    .catch((error) => {
+      ElMessage.error('获取数据失败');
+      console.error('获取列表数据失败:', error);
+    })
     .finally(() => {
       loading.close();
     });
@@ -253,7 +239,7 @@ function rowClickHandler(row) {
 }
 
 function resetList() {
-  listForm.tKey = '';
+  listForm.name = '';
   listForm.pageNum = 1;
   listForm.total = 0;
   getDataList();
@@ -262,16 +248,16 @@ function resetList() {
 const langList = Object.keys(i18nStore.langList);
 const formDataIndex = ref<number>();
 const formData = reactive<TranslateItem>({
-  tKey: '',
+  name: '',
   content: '',
 });
 const formShow = ref(false);
-let inputs: HTMLInputElement[] = [];
+
 function cancelForm() {
   vxeFormRef?.value?.reset();
   vxeFormRef?.value?.clearValidate();
   formDataIndex.value = void 0;
-  formData.id = null;
+  formData.id = undefined;
   formShow.value = false;
 }
 
@@ -289,6 +275,13 @@ function prevOne() {
 
 function editOne(item, index) {
   formDataIndex.value = index;
+  // 先清空表单数据，除了 id
+  for (const key in formData) {
+    if (key !== 'id') {
+      delete formData[key];
+    }
+  }
+  // 然后将新项目的数据复制到表单
   for (const key in item) {
     if (Object.prototype.hasOwnProperty.call(item, key)) {
       const val = item[key];
@@ -311,18 +304,18 @@ function nextOne() {
 }
 
 function saveOne() {
-  let isAdd = !formData.adTranslateId;
+  let isAdd = !formData.id;
   let url = updateUrl;
   vxeFormRef?.value?.validate().then((errMap) => {
     if (!errMap) {
       let data: SaveData = {
-        key: formData.tkey,
+        name: formData.name,
         content: {},
       };
       if (isAdd) {
         url = insertUrl;
       } else {
-        data.id = formData.adTranslateId;
+        data.id = formData.id;
       }
       for (const key in formData) {
         if (key !== 'key' && langList.includes(key)) {
@@ -344,10 +337,12 @@ function saveOne() {
               getDataList();
               cancelForm();
             } else {
-              dataList.value[formDataIndex.value] = {
-                ...formData,
-              };
-              nextOne();
+              if (formDataIndex.value !== undefined && formDataIndex.value !== null) {
+                dataList.value[formDataIndex.value] = {
+                  ...formData,
+                };
+                nextOne();
+              }
             }
           } else {
             ElMessage.error(res.data.msg);
@@ -380,7 +375,8 @@ function delOne(id) {
 
 function delMore() {
   ElMessageBox.confirm('确认删除选中的翻译记录吗？').then(async () => {
-    let ids = i18nList.value?.getSelectionRows().map((row) => row.adTranslateId);
+    const selectedRows = i18nList.value?.getSelectionRows();
+    const ids = selectedRows?.map((row) => row.id) || [];
     if (ids && ids.length) {
       let len = ids.length;
       let loading = ElLoadingService({
@@ -399,9 +395,11 @@ function delMore() {
           });
         } catch (error) {
           ElMessage.error(`删除第 ${i + 1} 条记录失败`);
+          console.error(`删除第 ${i + 1} 条记录失败:`, error);
         }
       }
       loading.close();
+      ElMessage.success(`删除完成，共 ${len} 条记录`);
       getDataList();
     }
   });
@@ -409,7 +407,7 @@ function delMore() {
 
 const formItems = reactive<VxeFormPropTypes.Items>([
   {
-    field: 'tkey',
+    field: 'name',
     span: 24,
     title: '翻译键值',
     itemRender: {
@@ -419,8 +417,8 @@ const formItems = reactive<VxeFormPropTypes.Items>([
   },
 ]);
 
-const fromRules = reactive<VxeFormPropTypes.Rules>({
-  tkey: [{required: true, type: 'string', message: '请输入翻译键值'}],
+const formRules = reactive<VxeFormPropTypes.Rules>({
+  name: [{required: true, type: 'string', message: '请输入翻译键值'}],
 });
 
 let needInit = true;
@@ -453,26 +451,32 @@ watch(
   }
 );
 
+const handleKeydown = (e: KeyboardEvent) => {
+  let {key, ctrlKey, altKey} = e;
+  if (key === 's' && ctrlKey) {
+    e.preventDefault();
+    e.stopPropagation();
+    saveOne();
+  }
+  if (key === 'ArrowRight' && (ctrlKey || altKey)) {
+    e.preventDefault();
+    e.stopPropagation();
+    nextOne();
+  }
+  if (key === 'ArrowLeft' && (ctrlKey || altKey)) {
+    e.preventDefault();
+    e.stopPropagation();
+    prevOne();
+  }
+};
+
 onMounted(() => {
   getDataList();
-  window.addEventListener('keydown', (e) => {
-    let {key, ctrlKey, altKey} = e;
-    if (key === 's' && ctrlKey) {
-      e.preventDefault();
-      e.stopPropagation();
-      saveOne();
-    }
-    if (key === 'ArrowRight' && (ctrlKey || altKey)) {
-      e.preventDefault();
-      e.stopPropagation();
-      nextOne();
-    }
-    if (key === 'ArrowLeft' && (ctrlKey || altKey)) {
-      e.preventDefault();
-      e.stopPropagation();
-      prevOne();
-    }
-  });
+  window.addEventListener('keydown', handleKeydown);
+});
+
+onUnmounted(() => {
+  window.removeEventListener('keydown', handleKeydown);
 });
 </script>
 <style lang="scss">

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "yh-i18n",
-  "version": "2.2.21",
+  "version": "2.2.22",
   "description": "对于国际化的封装",
   "main": "index.js",
   "scripts": {