✨字典组件新增翻译

src/components/DictTag/index.vue

@@ -2,16 +2,27 @@
   <template v-for="(item, index) in props.options">
     <template v-if="values.includes(item.dictValue)">
       <span v-if="item.listClass == 'default' || item.listClass == ''" :key="item.dictValue" :index="index" :class="item.cssClass">
-        {{ item.dictLabel }} <i v-if="showValue">#{{ item.dictValue }}</i>
+        <template v-if="item.langKey">
+          {{ $t(item.langKey) }}
+        </template>
+        <template v-else>
+          {{ item.dictLabel }}
+        </template>
+        <i v-if="showValue">#{{ item.dictValue }}</i>
       </span>
       <el-tag
-        size="small"
         v-else
+        size="small"
         :disable-transitions="true"
         :index="index"
         :type="item.listClass == 'primary' ? '' : item.listClass"
         :class="item.cssClass">
-        {{ item.dictLabel }}
+        <template v-if="item.langKey">
+          {{ $t(item.langKey) }}
+        </template>
+        <template v-else>
+          {{ item.dictLabel }}
+        </template>
         <i v-if="showValue">#{{ item.dictValue }}</i>
       </el-tag>
     </template>

src/i18n/lang/en.json

@@ -116,7 +116,15 @@
     "female": "Female",
     "male": "male",
     "sex": "gender",
-    "systemTips": "system hint"
+    "systemTips": "system hint",
+    "default": "default",
+    "hidden": "hide",
+    "show": "show",
+    "system": "system",
+    "abnormal": "abnormal",
+    "unknow": "unknown",
+    "normal": "normal",
+    "disable": "deactivate"
   },
   "btn": {
     "add": "Add",

src/i18n/lang/zh-cn.json

@@ -116,7 +116,15 @@
     "sex": "性别",
     "male": "男",
     "female": "女",
-    "systemTips": "系统提示"
+    "unknow": "未知",
+    "systemTips": "系统提示",
+    "show": "显示",
+    "hidden": "隐藏",
+    "default": "默认",
+    "system": "系统",
+    "abnormal": "异常",
+    "normal": "正常",
+    "disable": "停用"
   },
   "btn": {
     "add": "新增",

src/i18n/lang/zh-tw.json

@@ -116,7 +116,15 @@
     "female": "女",
     "male": "男",
     "sex": "性別",
-    "systemTips": "系統提示"
+    "systemTips": "系統提示",
+    "abnormal": "異常",
+    "normal": "正常",
+    "disable": "停用",
+    "hidden": "隱藏",
+    "show": "顯示",
+    "system": "系統",
+    "default": "默認",
+    "unknow": "未知"
   },
   "btn": {
     "add": "新增",

src/views/components/dictData.vue

@@ -32,6 +32,7 @@
         </el-tag>
       </template>
     </el-table-column>
+    <el-table-column label="翻译键值" align="center" prop="langKey" />
     <el-table-column label="字典键值" align="center" prop="dictValue" sortable />
     <el-table-column label="字典排序" align="center" prop="dictSort" sortable />
     <el-table-column label="状态" align="center" prop="status">
@@ -60,6 +61,9 @@
       <el-form-item label="数据标签" prop="dictLabel">
         <el-input v-model="form.dictLabel" placeholder="请输入数据标签" />
       </el-form-item>
+      <el-form-item label="翻译键值" prop="langKey">
+        <el-input v-model="form.langKey" placeholder="请输入翻译键值" />
+      </el-form-item>
       <el-form-item label="数据键值" prop="dictValue">
         <el-input v-model="form.dictValue" placeholder="请输入数据键值" />
       </el-form-item>
@@ -227,7 +231,8 @@ const state = reactive({
   rules: {
     dictLabel: [{ required: true, message: '数据标签不能为空', trigger: 'blur' }],
     dictValue: [{ required: true, message: '数据键值不能为空', trigger: 'blur' }],
-    dictSort: [{ required: true, message: '数据顺序不能为空', trigger: 'blur' }]
+    dictSort: [{ required: true, message: '数据顺序不能为空', trigger: 'blur' }],
+    langKey: [{ pattern: /^[A-Za-z].+$/, message: '输入格式不正确,格式：login.ok', trigger: 'blur' }]
   }
 })