首页国际化

src/views/Home/Index.vue

@@ -97,8 +97,8 @@
               :xl="20" :lg="20" :md="24" :sm="24" :xs="24">
               <el-card shadow="hover" class="mb-8px">
                 <el-select style="width: 200px;" v-model="days" @change="updataDays">
-                  <el-option :value="1" label="当日">当日</el-option>
-                  <el-option :value="7" label="近7日">近7日</el-option>
+                  <el-option :value="1" :label="t('home.today')">{{ t('home.today') }}</el-option>
+                  <el-option :value="7" :label="t('home.last7Days')">{{ t('home.last7Days') }}</el-option>
                 </el-select>
 
                 <el-skeleton :loading="loading" animated>
@@ -108,7 +108,7 @@
             </el-col>
             <el-col v-if="tenantLevel != 1" :xl="14" :lg="14" :md="24" :sm="24" :xs="24">
               <el-card shadow="hover" class="mb-8px">
-                <div>当日建联主播数量</div>
+                <div>{{ t('home.todayAnchorCount') }}</div>
                 {{ HostsOperationNum }}
               </el-card>
             </el-col>
@@ -125,9 +125,9 @@
               :xl="20" :lg="20" :md="24" :sm="24" :xs="24">
               <el-card shadow="hover" class="mb-8px">
                 <el-select style="width: 200px;" v-model="daysDsec" @change="updataDaysDsec">
-                  <el-option :value="1" label="当日">当日</el-option>
+                  <el-option :value="1" :label="t('home.today')">{{ t('home.today') }}</el-option>
 
-                  <el-option :value="7" label="近7日">近7日</el-option>
+                  <el-option :value="7" :label="t('home.last7Days')">{{ t('home.last7Days') }}</el-option>
                 </el-select>
 
                 <el-skeleton :loading="loading" animated>
@@ -138,7 +138,7 @@
 
             <el-col v-if="tenantLevel != 1" :xl="14" :lg="14" :md="24" :sm="24" :xs="24">
               <el-card shadow="hover" class="mb-8px">
-                <div>当日建联大哥数量</div>
+                <div>{{ t('home.todayBigBrotherCount') }}</div>
 
                 {{ HostsOperationNumDsec }}
               </el-card>

src/views/system/role/RoleAssignMenuForm.vue

@@ -1,46 +1,30 @@
 <template>
-  <Dialog v-model="dialogVisible" title="菜单权限">
+  <Dialog v-model="dialogVisible" :title="t('system.role.menuPermission')">
     <el-form ref="formRef" v-loading="formLoading" :model="formData" label-width="80px">
-      <el-form-item label="角色名称">
+      <el-form-item :label="t('system.role.name')">
         <el-tag>{{ formData.name }}</el-tag>
       </el-form-item>
-      <el-form-item label="角色标识">
+      <el-form-item :label="t('system.role.code')">
         <el-tag>{{ formData.code }}</el-tag>
       </el-form-item>
-      <el-form-item label="菜单权限">
+      <el-form-item :label="t('system.role.menuPermission')">
         <el-card class="w-full h-400px !overflow-y-scroll" shadow="never">
           <template #header>
-            全选/全不选:
-            <el-switch
-              v-model="treeNodeAll"
-              active-text="是"
-              inactive-text="否"
-              inline-prompt
-              @change="handleCheckedTreeNodeAll"
-            />
-            全部展开/折叠:
-            <el-switch
-              v-model="menuExpand"
-              active-text="展开"
-              inactive-text="折叠"
-              inline-prompt
-              @change="handleCheckedTreeExpand"
-            />
+            {{ t('common.selectAll') }}:
+            <el-switch v-model="treeNodeAll" active-text="是" inactive-text="否" inline-prompt
+              @change="handleCheckedTreeNodeAll" />
+            {{ t('common.expandAll') }}:
+            <el-switch v-model="menuExpand" active-text="展开" inactive-text="折叠" inline-prompt
+              @change="handleCheckedTreeExpand" />
           </template>
-          <el-tree
-            ref="treeRef"
-            :data="menuOptions"
-            :props="defaultProps"
-            empty-text="加载中，请稍候"
-            node-key="id"
-            show-checkbox
-          />
+          <el-tree ref="treeRef" :data="menuOptions" :props="defaultProps" :empty-text="t('common.loadingText')"
+            node-key="id" show-checkbox />
         </el-card>
       </el-form-item>
     </el-form>
     <template #footer>
-      <el-button :disabled="formLoading" type="primary" @click="submitForm">确 定</el-button>
-      <el-button @click="dialogVisible = false">取 消</el-button>
+      <el-button :disabled="formLoading" type="primary" @click="submitForm">{{ t('common.ok') }}</el-button>
+      <el-button @click="dialogVisible = false">{{ t('common.cancel') }}</el-button>
     </template>
   </Dialog>
 </template>

src/views/system/role/RoleDataPermissionForm.vue

@@ -1,64 +1,39 @@
 <template>
-  <Dialog v-model="dialogVisible" title="数据权限" width="800">
+  <Dialog v-model="dialogVisible" :title="t('system.role.dataPermission')" width="800">
     <el-form ref="formRef" v-loading="formLoading" :model="formData" label-width="80px">
-      <el-form-item label="角色名称">
+      <el-form-item :label="t('system.role.name')">
         <el-tag>{{ formData.name }}</el-tag>
       </el-form-item>
-      <el-form-item label="角色标识">
+      <el-form-item :label="t('system.role.code')">
         <el-tag>{{ formData.code }}</el-tag>
       </el-form-item>
-      <el-form-item label="权限范围">
+      <el-form-item :label="t('system.role.dataScope')">
         <el-select v-model="formData.dataScope">
-          <el-option
-            v-for="item in getIntDictOptions(DICT_TYPE.SYSTEM_DATA_SCOPE)"
-            :key="item.value"
-            :label="item.label"
-            :value="item.value"
-          />
+          <el-option v-for="item in getIntDictOptions(DICT_TYPE.SYSTEM_DATA_SCOPE)" :key="item.value"
+            :label="item.label" :value="item.value" />
         </el-select>
       </el-form-item>
     </el-form>
-    <el-form-item
-      v-if="formData.dataScope === SystemDataScopeEnum.DEPT_CUSTOM"
-      label="部门范围"
-      label-width="80px"
-    >
+    <el-form-item v-if="formData.dataScope === SystemDataScopeEnum.DEPT_CUSTOM" :label="t('system.role.deptScope')"
+      label-width="80px">
       <el-card class="w-full h-400px !overflow-y-scroll" shadow="never">
         <template #header>
-          全选/全不选:
-          <el-switch
-            v-model="treeNodeAll"
-            active-text="是"
-            inactive-text="否"
-            inline-prompt
-            @change="handleCheckedTreeNodeAll()"
-          />
-          全部展开/折叠:
-          <el-switch
-            v-model="deptExpand"
-            active-text="展开"
-            inactive-text="折叠"
-            inline-prompt
-            @change="handleCheckedTreeExpand"
-          />
-          父子联动(选中父节点，自动选择子节点):
+          {{ t('common.selectAll') }}:
+          <el-switch v-model="treeNodeAll" active-text="是" inactive-text="否" inline-prompt
+            @change="handleCheckedTreeNodeAll()" />
+          {{ t('common.expandAll') }}:
+          <el-switch v-model="deptExpand" active-text="展开" inactive-text="折叠" inline-prompt
+            @change="handleCheckedTreeExpand" />
+          {{ t('common.treeParent') }}(选中父节点，自动选择子节点):
           <el-switch v-model="checkStrictly" active-text="是" inactive-text="否" inline-prompt />
         </template>
-        <el-tree
-          ref="treeRef"
-          :check-strictly="!checkStrictly"
-          :data="deptOptions"
-          :props="defaultProps"
-          default-expand-all
-          empty-text="加载中，请稍后"
-          node-key="id"
-          show-checkbox
-        />
+        <el-tree ref="treeRef" :check-strictly="!checkStrictly" :data="deptOptions" :props="defaultProps"
+          default-expand-all :empty-text="t('common.loadingText')" node-key="id" show-checkbox />
       </el-card>
     </el-form-item>
     <template #footer>
-      <el-button :disabled="formLoading" type="primary" @click="submitForm">确 定</el-button>
-      <el-button @click="dialogVisible = false">取 消</el-button>
+      <el-button :disabled="formLoading" type="primary" @click="submitForm">{{ t('common.ok') }}</el-button>
+      <el-button @click="dialogVisible = false">{{ t('common.cancel') }}</el-button>
     </template>
   </Dialog>
 </template>

src/views/system/role/RoleForm.vue

@@ -1,38 +1,28 @@
 <template>
   <Dialog v-model="dialogVisible" :title="dialogTitle">
-    <el-form
-      ref="formRef"
-      v-loading="formLoading"
-      :model="formData"
-      :rules="formRules"
-      label-width="80px"
-    >
-      <el-form-item label="角色名称" prop="name">
-        <el-input v-model="formData.name" placeholder="请输入角色名称" />
+    <el-form ref="formRef" v-loading="formLoading" :model="formData" :rules="formRules">
+      <el-form-item :label="t('system.role.name')" prop="name">
+        <el-input v-model="formData.name" :placeholder="t('common.inputText') + t('system.role.name')" />
       </el-form-item>
-      <el-form-item label="角色标识" prop="code">
-        <el-input v-model="formData.code" placeholder="请输入角色标识" />
+      <el-form-item :label="t('system.role.code')" prop="code">
+        <el-input v-model="formData.code" :placeholder="t('common.inputText') + t('system.role.code')" />
       </el-form-item>
-      <el-form-item label="显示顺序" prop="sort">
-        <el-input v-model="formData.sort" placeholder="请输入显示顺序" />
+      <el-form-item :label="t('system.role.sort')" prop="sort">
+        <el-input v-model="formData.sort" :placeholder="t('common.inputText') + t('system.role.sort')" />
       </el-form-item>
-      <el-form-item label="状态" prop="status">
-        <el-select v-model="formData.status" clearable placeholder="请选择状态">
-          <el-option
-            v-for="dict in getIntDictOptions(DICT_TYPE.COMMON_STATUS)"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
-          />
+      <el-form-item :label="t('system.role.status')" prop="status">
+        <el-select v-model="formData.status" clearable :placeholder="t('common.selectText') + t('common.status')">
+          <el-option v-for="dict in getIntDictOptions(DICT_TYPE.COMMON_STATUS)" :key="dict.value" :label="dict.label"
+            :value="dict.value" />
         </el-select>
       </el-form-item>
-      <el-form-item label="备注" prop="remark">
-        <el-input v-model="formData.remark" placeholder="请输备注" type="textarea" />
+      <el-form-item :label="t('system.role.remark')" prop="remark">
+        <el-input v-model="formData.remark" :placeholder="t('common.inputText') + t('common.remark')" type="textarea" />
       </el-form-item>
     </el-form>
     <template #footer>
-      <el-button :disabled="formLoading" type="primary" @click="submitForm">确 定</el-button>
-      <el-button @click="dialogVisible = false">取 消</el-button>
+      <el-button :disabled="formLoading" type="primary" @click="submitForm">{{ t('common.ok') }}</el-button>
+      <el-button @click="dialogVisible = false">{{ t('common.cancel') }}</el-button>
     </template>
   </Dialog>
 </template>
@@ -59,11 +49,11 @@ const formData = ref({
   remark: ''
 })
 const formRules = reactive({
-  name: [{ required: true, message: '角色名称不能为空', trigger: 'blur' }],
-  code: [{ required: true, message: '角色标识不能为空', trigger: 'change' }],
-  sort: [{ required: true, message: '显示顺序不能为空', trigger: 'change' }],
-  status: [{ required: true, message: '状态不能为空', trigger: 'change' }],
-  remark: [{ required: false, message: '备注不能为空', trigger: 'blur' }]
+  name: [{ required: true, message: t('common.required'), trigger: 'blur' }],
+  code: [{ required: true, message: t('common.required'), trigger: 'change' }],
+  sort: [{ required: true, message: t('common.required'), trigger: 'change' }],
+  status: [{ required: true, message: t('common.required'), trigger: 'change' }],
+  remark: [{ required: false, message: t('common.required'), trigger: 'blur' }]
 })
 const formRef = ref() // 表单 Ref
 

src/views/system/role/index.vue

@@ -4,89 +4,50 @@
 
   <ContentWrap>
     <!-- 搜索工作栏 -->
-    <el-form
-      ref="queryFormRef"
-      :inline="true"
-      :model="queryParams"
-      class="-mb-15px"
-      label-width="68px"
-    >
-      <el-form-item label="角色名称" prop="name">
-        <el-input
-          v-model="queryParams.name"
-          class="!w-240px"
-          clearable
-          placeholder="请输入角色名称"
-          @keyup.enter="handleQuery"
-        />
+    <el-form ref="queryFormRef" :inline="true" :model="queryParams" class="-mb-15px">
+      <el-form-item :label="t('system.role.name')" prop="name">
+        <el-input v-model="queryParams.name" class="!w-240px" clearable
+          :placeholder="t('common.inputText') + t('system.role.name')" @keyup.enter="handleQuery" />
       </el-form-item>
-      <el-form-item label="角色标识" prop="code">
-        <el-input
-          v-model="queryParams.code"
-          class="!w-240px"
-          clearable
-          placeholder="请输入角色标识"
-          @keyup.enter="handleQuery"
-        />
+      <el-form-item :label="t('system.role.code')" prop="code">
+        <el-input v-model="queryParams.code" class="!w-240px" clearable
+          :placeholder="t('common.inputText') + t('system.role.code')" @keyup.enter="handleQuery" />
       </el-form-item>
-      <el-form-item label="状态" prop="status">
-        <el-select v-model="queryParams.status" class="!w-240px" clearable placeholder="请选择状态">
-          <el-option
-            v-for="dict in getIntDictOptions(DICT_TYPE.COMMON_STATUS)"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
-          />
+      <el-form-item :label="t('common.status')" prop="status">
+        <el-select v-model="queryParams.status" class="!w-240px" clearable
+          :placeholder="t('common.selectText') + t('common.status')">
+          <el-option v-for="dict in getIntDictOptions(DICT_TYPE.COMMON_STATUS)" :key="dict.value" :label="dict.label"
+            :value="dict.value" />
         </el-select>
       </el-form-item>
-      <el-form-item label="创建时间" prop="createTime">
-        <el-date-picker
-          v-model="queryParams.createTime"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-          end-placeholder="结束日期"
-          start-placeholder="开始日期"
-          type="daterange"
-          value-format="YYYY-MM-DD HH:mm:ss"
-        />
+      <el-form-item :label="t('common.createTime')" prop="createTime">
+        <el-date-picker v-model="queryParams.createTime"
+          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]" class="!w-240px"
+          :end-placeholder="t('common.endTimeText')" :start-placeholder="t('common.startTimeText')" type="daterange"
+          value-format="YYYY-MM-DD HH:mm:ss" />
       </el-form-item>
       <el-form-item>
         <el-button @click="handleQuery">
           <Icon class="mr-5px" icon="ep:search" />
-          搜索
+          {{ t('common.query') }}
         </el-button>
         <el-button @click="resetQuery">
           <Icon class="mr-5px" icon="ep:refresh" />
-          重置
+          {{ t('common.reset') }}
         </el-button>
-        <el-button
-          v-hasPermi="['system:role:create']"
-          plain
-          type="primary"
-          @click="openForm('create')"
-        >
+        <el-button v-hasPermi="['system:role:create']" plain type="primary" @click="openForm('create')">
           <Icon class="mr-5px" icon="ep:plus" />
-          新增
+          {{ t('action.add') }}
         </el-button>
-        <el-button
-          v-hasPermi="['system:role:export']"
-          :loading="exportLoading"
-          plain
-          type="success"
-          @click="handleExport"
-        >
+        <el-button v-hasPermi="['system:role:export']" :loading="exportLoading" plain type="success"
+          @click="handleExport">
           <Icon class="mr-5px" icon="ep:download" />
-          导出
+          {{ t('action.export') }}
         </el-button>
-        <el-button
-          v-hasPermi="['system:role:delete']"
-          :disabled="checkedIds.length === 0"
-          plain
-          type="danger"
-          @click="handleDeleteBatch"
-        >
+        <el-button v-hasPermi="['system:role:delete']" :disabled="checkedIds.length === 0" plain type="danger"
+          @click="handleDeleteBatch">
           <Icon class="mr-5px" icon="ep:delete" />
-          批量删除
+          {{ t('common.delDataMessage') }}
         </el-button>
       </el-form-item>
     </el-form>
@@ -96,76 +57,45 @@
   <ContentWrap>
     <el-table v-loading="loading" :data="list" @selection-change="handleRowCheckboxChange">
       <el-table-column type="selection" width="55" />
-      <el-table-column align="center" label="角色编号" prop="id" />
-      <el-table-column align="center" label="角色名称" prop="name" />
-      <el-table-column label="角色类型" align="center" prop="type">
+      <el-table-column align="center" :label="t('system.role.id')" prop="id" />
+      <el-table-column align="center" :label="t('system.role.name')" prop="name" />
+      <el-table-column :label="t('system.role.type')" align="center" prop="type">
         <template #default="scope">
           <dict-tag :type="DICT_TYPE.SYSTEM_ROLE_TYPE" :value="scope.row.type" />
         </template>
       </el-table-column>
-      <el-table-column align="center" label="角色标识" prop="code" />
-      <el-table-column align="center" label="显示顺序" prop="sort" />
-      <el-table-column align="center" label="备注" prop="remark" />
-      <el-table-column align="center" label="状态" prop="status">
+      <el-table-column align="center" :label="t('system.role.code')" prop="code" />
+      <el-table-column align="center" :label="t('system.role.sort')" prop="sort" />
+      <el-table-column align="center" :label="t('system.role.remark')" prop="remark" />
+      <el-table-column align="center" :label="t('system.role.status')" prop="status">
         <template #default="scope">
           <dict-tag :type="DICT_TYPE.COMMON_STATUS" :value="scope.row.status" />
         </template>
       </el-table-column>
-      <el-table-column
-        :formatter="dateFormatter"
-        align="center"
-        label="创建时间"
-        prop="createTime"
-        width="180"
-      />
-      <el-table-column :width="300" align="center" label="操作">
+      <el-table-column :formatter="dateFormatter" align="center" :label="t('common.createTime')" prop="createTime"
+        width="180" />
+      <el-table-column :width="300" align="center" :label="t('table.action')">
         <template #default="scope">
-          <el-button
-            v-hasPermi="['system:role:update']"
-            link
-            type="primary"
-            @click="openForm('update', scope.row.id)"
-          >
-            编辑
+          <el-button v-hasPermi="['system:role:update']" link type="primary" @click="openForm('update', scope.row.id)">
+            {{ t('action.edit') }}
           </el-button>
-          <el-button
-            v-hasPermi="['system:permission:assign-role-menu']"
-            link
-            preIcon="ep:basketball"
-            title="菜单权限"
-            type="primary"
-            @click="openAssignMenuForm(scope.row)"
-          >
-            菜单权限
+          <el-button v-hasPermi="['system:permission:assign-role-menu']" link preIcon="ep:basketball"
+            :title="t('system.role.menuPermission')" type="primary" @click="openAssignMenuForm(scope.row)">
+            {{ t('system.role.menuPermission') }}
           </el-button>
-          <el-button
-            v-hasPermi="['system:permission:assign-role-data-scope']"
-            link
-            preIcon="ep:coin"
-            title="数据权限"
-            type="primary"
-            @click="openDataPermissionForm(scope.row)"
-          >
-            数据权限
+          <el-button v-hasPermi="['system:permission:assign-role-data-scope']" link preIcon="ep:coin"
+            :title="t('system.role.dataPermission')" type="primary" @click="openDataPermissionForm(scope.row)">
+            {{ t('system.role.dataPermission') }}
           </el-button>
-          <el-button
-            v-hasPermi="['system:role:delete']"
-            link
-            type="danger"
-            @click="handleDelete(scope.row.id)"
-          >
-            删除
+          <el-button v-hasPermi="['system:role:delete']" link type="danger" @click="handleDelete(scope.row.id)">
+            {{ t('action.del') }}
           </el-button>
         </template>
       </el-table-column>
     </el-table>
     <!-- 分页 -->
-    <Pagination
-      v-model:limit="queryParams.pageSize"
-      v-model:page="queryParams.pageNo"
-      :total="total"
-      @pagination="getList"
-    />
+    <Pagination v-model:limit="queryParams.pageSize" v-model:page="queryParams.pageNo" :total="total"
+      @pagination="getList" />
   </ContentWrap>
 
   <!-- 表单弹窗：添加/修改 -->
@@ -255,7 +185,7 @@ const handleDelete = async (id: number) => {
     message.success(t('common.delSuccess'))
     // 刷新列表
     await getList()
-  } catch {}
+  } catch { }
 }
 
 /** 批量删除按钮操作 */
@@ -273,7 +203,7 @@ const handleDeleteBatch = async () => {
     message.success(t('common.delSuccess'))
     // 刷新列表
     await getList()
-  } catch {}
+  } catch { }
 }
 
 /** 导出按钮操作 */

src/views/system/user/DeptTree.vue

@@ -1,23 +1,14 @@
 <template>
   <div class="head-container">
-    <el-input v-model="deptName" class="mb-20px" clearable placeholder="请输入部门名称">
+    <el-input v-model="deptName" class="mb-20px" clearable :placeholder="t('common.inputText') + t('system.user.dept')">
       <template #prefix>
         <Icon icon="ep:search" />
       </template>
     </el-input>
   </div>
   <div class="head-container">
-    <el-tree
-      ref="treeRef"
-      :data="deptList"
-      :expand-on-click-node="false"
-      :filter-node-method="filterNode"
-      :props="defaultProps"
-      default-expand-all
-      highlight-current
-      node-key="id"
-      @node-click="handleNodeClick"
-    />
+    <el-tree ref="treeRef" :data="deptList" :expand-on-click-node="false" :filter-node-method="filterNode"
+      :props="defaultProps" default-expand-all highlight-current node-key="id" @node-click="handleNodeClick" />
   </div>
 </template>
 
@@ -28,6 +19,8 @@ import { defaultProps, handleTree } from '@/utils/tree'
 
 defineOptions({ name: 'SystemUserDeptTree' })
 
+const { t } = useI18n() // 国际化
+
 const deptName = ref('')
 const deptList = ref<Tree[]>([]) // 树形结构
 const treeRef = ref<InstanceType<typeof ElTree>>()

src/views/system/user/UserAssignRoleForm.vue

@@ -1,21 +1,21 @@
 <template>
-  <Dialog v-model="dialogVisible" title="分配角色">
+  <Dialog v-model="dialogVisible" :title="t('system.user.assignRole')">
     <el-form ref="formRef" v-loading="formLoading" :model="formData" label-width="80px">
-      <el-form-item label="用户名称">
+      <el-form-item :label="t('system.user.username')">
         <el-input v-model="formData.username" :disabled="true" />
       </el-form-item>
-      <el-form-item label="用户昵称">
+      <el-form-item :label="t('system.user.nickname')">
         <el-input v-model="formData.nickname" :disabled="true" />
       </el-form-item>
-      <el-form-item label="角色">
-        <el-select v-model="formData.roleIds" multiple placeholder="请选择角色">
+      <el-form-item :label="t('system.user.role')">
+        <el-select v-model="formData.roleIds" multiple :placeholder="t('common.selectText')">
           <el-option v-for="item in roleList" :key="item.id" :label="item.name" :value="item.id" />
         </el-select>
       </el-form-item>
     </el-form>
     <template #footer>
-      <el-button :disabled="formLoading" type="primary" @click="submitForm">确 定</el-button>
-      <el-button @click="dialogVisible = false">取 消</el-button>
+      <el-button :disabled="formLoading" type="primary" @click="submitForm">{{ t('common.ok') }}</el-button>
+      <el-button @click="dialogVisible = false">{{ t('common.cancel') }}</el-button>
     </template>
   </Dialog>
 </template>

src/views/system/user/UserForm.vue

@@ -1,97 +1,75 @@
 <template>
   <Dialog v-model="dialogVisible" :title="dialogTitle">
-    <el-form
-      ref="formRef"
-      v-loading="formLoading"
-      :model="formData"
-      :rules="formRules"
-      label-width="80px"
-    >
+    <el-form ref="formRef" v-loading="formLoading" :model="formData" :rules="formRules" label-width="80px">
       <el-row>
         <el-col :span="12">
-          <el-form-item label="用户昵称" prop="nickname">
-            <el-input v-model="formData.nickname" placeholder="请输入用户昵称" />
+          <el-form-item :label="t('system.user.nickname')" prop="nickname">
+            <el-input v-model="formData.nickname" :placeholder="t('common.inputText') + t('system.user.nickname')" />
           </el-form-item>
         </el-col>
         <el-col :span="12">
-          <el-form-item label="归属部门" prop="deptId">
-            <el-tree-select
-              v-model="formData.deptId"
-              :data="deptList"
-              :props="defaultProps"
-              check-strictly
-              node-key="id"
-              placeholder="请选择归属部门"
-            />
+          <el-form-item :label="t('system.user.deptDesc')" prop="deptId">
+            <el-tree-select v-model="formData.deptId" :data="deptList" :props="defaultProps" check-strictly
+              node-key="id" :placeholder="t('common.selectText') + t('system.user.deptDesc')" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row>
         <el-col :span="12">
-          <el-form-item label="手机号码" prop="mobile">
-            <el-input v-model="formData.mobile" maxlength="11" placeholder="请输入手机号码" />
+          <el-form-item :label="t('system.user.mobile')" prop="mobile">
+            <el-input v-model="formData.mobile" maxlength="11"
+              :placeholder="t('common.inputText') + t('system.user.mobile')" />
           </el-form-item>
         </el-col>
         <el-col :span="12">
-          <el-form-item label="邮箱" prop="email">
-            <el-input v-model="formData.email" maxlength="50" placeholder="请输入邮箱" />
+          <el-form-item :label="t('system.user.email')" prop="email">
+            <el-input v-model="formData.email" maxlength="50"
+              :placeholder="t('common.inputText') + t('system.user.email')" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row>
         <el-col :span="12">
-          <el-form-item v-if="formData.id === undefined" label="用户名称" prop="username">
-            <el-input v-model="formData.username" placeholder="请输入用户名称" />
+          <el-form-item v-if="formData.id === undefined" :label="t('system.user.username')" prop="username">
+            <el-input v-model="formData.username" :placeholder="t('common.inputText') + t('system.user.username')" />
           </el-form-item>
         </el-col>
         <el-col :span="12">
-          <el-form-item v-if="formData.id === undefined" label="用户密码" prop="password">
-            <el-input
-              v-model="formData.password"
-              placeholder="请输入用户密码"
-              show-password
-              type="password"
-            />
+          <el-form-item v-if="formData.id === undefined" :label="t('system.user.password')" prop="password">
+            <el-input v-model="formData.password" :placeholder="t('common.inputText') + t('system.user.password')"
+              show-password type="password" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row>
         <el-col :span="12">
-          <el-form-item label="用户性别">
-            <el-select v-model="formData.sex" placeholder="请选择">
-              <el-option
-                v-for="dict in getIntDictOptions(DICT_TYPE.SYSTEM_USER_SEX)"
-                :key="dict.value"
-                :label="dict.label"
-                :value="dict.value"
-              />
+          <el-form-item :label="t('system.user.sex')">
+            <el-select v-model="formData.sex" :placeholder="t('common.selectText')">
+              <el-option v-for="dict in getIntDictOptions(DICT_TYPE.SYSTEM_USER_SEX)" :key="dict.value"
+                :label="dict.label" :value="dict.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="12">
-          <el-form-item label="岗位">
-            <el-select v-model="formData.postIds" multiple placeholder="请选择">
-              <el-option
-                v-for="item in postList"
-                :key="item.id"
-                :label="item.name"
-                :value="item.id!"
-              />
+          <el-form-item :label="t('system.user.post')">
+            <el-select v-model="formData.postIds" multiple :placeholder="t('common.selectText')">
+              <el-option v-for="item in postList" :key="item.id" :label="item.name" :value="item.id!" />
             </el-select>
           </el-form-item>
         </el-col>
       </el-row>
       <el-row>
         <el-col :span="24">
-          <el-form-item label="备注">
-            <el-input v-model="formData.remark" placeholder="请输入内容" type="textarea" />
+          <el-form-item :label="t('system.user.remark')">
+            <el-input v-model="formData.remark" :placeholder="t('common.inputText') + t('system.user.remark')"
+              type="textarea" />
           </el-form-item>
         </el-col>
       </el-row>
     </el-form>
     <template #footer>
-      <el-button :disabled="formLoading" type="primary" @click="submitForm">确 定</el-button>
-      <el-button @click="dialogVisible = false">取 消</el-button>
+      <el-button :disabled="formLoading" type="primary" @click="submitForm">{{ t('common.ok') }}</el-button>
+      <el-button @click="dialogVisible = false">{{ t('common.cancel') }}</el-button>
     </template>
   </Dialog>
 </template>
@@ -128,20 +106,20 @@ const formData = ref({
   roleIds: []
 })
 const formRules = reactive<FormRules>({
-  username: [{ required: true, message: '用户名称不能为空', trigger: 'blur' }],
-  nickname: [{ required: true, message: '用户昵称不能为空', trigger: 'blur' }],
-  password: [{ required: true, message: '用户密码不能为空', trigger: 'blur' }],
+  username: [{ required: true, message: t('common.required'), trigger: 'blur' }],
+  nickname: [{ required: true, message: t('common.required'), trigger: 'blur' }],
+  password: [{ required: true, message: t('common.required'), trigger: 'blur' }],
   email: [
     {
       type: 'email',
-      message: '请输入正确的邮箱地址',
+      message: t('common.required'),
       trigger: ['blur', 'change']
     }
   ],
   mobile: [
     {
       pattern: /^(?:(?:\+|00)86)?1(?:3[\d]|4[5-79]|5[0-35-9]|6[5-7]|7[0-8]|8[\d]|9[189])\d{8}$/,
-      message: '请输入正确的手机号码',
+      message: t('common.required'),
       trigger: 'blur'
     }
   ]

src/views/system/user/UserImportForm.vue

@@ -1,42 +1,27 @@
 <template>
-  <Dialog v-model="dialogVisible" title="用户导入" width="400">
-    <el-upload
-      ref="uploadRef"
-      v-model:file-list="fileList"
-      :action="importUrl + '?updateSupport=' + updateSupport"
-      :auto-upload="false"
-      :disabled="formLoading"
-      :headers="uploadHeaders"
-      :limit="1"
-      :on-error="submitFormError"
-      :on-exceed="handleExceed"
-      :on-success="submitFormSuccess"
-      accept=".xlsx, .xls"
-      drag
-    >
+  <Dialog v-model="dialogVisible" :title="t('system.user.importTitle')" width="400">
+    <el-upload ref="uploadRef" v-model:file-list="fileList" :action="importUrl + '?updateSupport=' + updateSupport"
+      :auto-upload="false" :disabled="formLoading" :headers="uploadHeaders" :limit="1" :on-error="submitFormError"
+      :on-exceed="handleExceed" :on-success="submitFormSuccess" accept=".xlsx, .xls" drag>
       <Icon icon="ep:upload" />
-      <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
+      <div class="el-upload__text">{{ t('common.uploadText') }}<em>{{ t('common.clickUpload') }}</em></div>
       <template #tip>
         <div class="el-upload__tip text-center">
           <div class="el-upload__tip">
             <el-checkbox v-model="updateSupport" />
-            是否更新已经存在的用户数据
+            {{ t('system.user.importTip') }}
           </div>
-          <span>仅允许导入 xls、xlsx 格式文件。</span>
-          <el-link
-            :underline="false"
-            style="font-size: 12px; vertical-align: baseline"
-            type="primary"
-            @click="importTemplate"
-          >
-            下载模板
+          <span>{{ t('common.uploadFormat') }}</span>
+          <el-link :underline="false" style="font-size: 12px; vertical-align: baseline" type="primary"
+            @click="importTemplate">
+            {{ t('action.downloadTemplate') }}
           </el-link>
         </div>
       </template>
     </el-upload>
     <template #footer>
-      <el-button :disabled="formLoading" type="primary" @click="submitForm">确 定</el-button>
-      <el-button @click="dialogVisible = false">取 消</el-button>
+      <el-button :disabled="formLoading" type="primary" @click="submitForm">{{ t('common.ok') }}</el-button>
+      <el-button @click="dialogVisible = false">{{ t('common.cancel') }}</el-button>
     </template>
   </Dialog>
 </template>
@@ -47,6 +32,7 @@ import download from '@/utils/download'
 
 defineOptions({ name: 'SystemUserImportForm' })
 
+const { t } = useI18n() // 国际化
 const message = useMessage() // 消息弹窗
 
 const dialogVisible = ref(false) // 弹窗的是否展示
@@ -70,7 +56,7 @@ defineExpose({ open }) // 提供 open 方法，用于打开弹窗
 /** 提交表单 */
 const submitForm = async () => {
   if (fileList.value.length == 0) {
-    message.error('请上传文件')
+    message.error(t('system.user.import.fileRequired'))
     return
   }
   // 提交请求
@@ -92,15 +78,15 @@ const submitFormSuccess = (response: any) => {
   }
   // 拼接提示语
   const data = response.data
-  let text = '上传成功数量：' + data.createUsernames.length + ';'
+  let text = t('system.user.import.createSuccess') + data.createUsernames.length + ';'
   for (let username of data.createUsernames) {
     text += '< ' + username + ' >'
   }
-  text += '更新成功数量：' + data.updateUsernames.length + ';'
+  text += t('system.user.import.updateSuccess') + data.updateUsernames.length + ';'
   for (const username of data.updateUsernames) {
     text += '< ' + username + ' >'
   }
-  text += '更新失败数量：' + Object.keys(data.failureUsernames).length + ';'
+  text += t('system.user.import.failure') + Object.keys(data.failureUsernames).length + ';'
   for (const username in data.failureUsernames) {
     text += '< ' + username + ': ' + data.failureUsernames[username] + ' >'
   }
@@ -113,7 +99,7 @@ const submitFormSuccess = (response: any) => {
 
 /** 上传错误提示 */
 const submitFormError = (): void => {
-  message.error('上传失败，请您重新上传！')
+  message.error(t('system.user.import.uploadError'))
   formLoading.value = false
 }
 
@@ -127,12 +113,12 @@ const resetForm = async (): Promise<void> => {
 
 /** 文件数超出提示 */
 const handleExceed = (): void => {
-  message.error('最多只能上传一个文件！')
+  message.error(t('system.user.import.fileLimit'))
 }
 
 /** 下载模板操作 */
 const importTemplate = async () => {
   const res = await UserApi.importUserTemplate()
-  download.excel(res, '用户导入模版.xls')
+  download.excel(res, t('system.user.import.templateName'))
 }
 </script>

src/views/system/user/index.vue

@@ -13,45 +13,47 @@
     <el-col :span="20" :xs="24">
       <!-- 搜索 -->
       <ContentWrap>
-        <el-form class="-mb-15px" :model="queryParams" ref="queryFormRef" :inline="true" label-width="68px">
-          <el-form-item label="用户名称" prop="username">
-            <el-input v-model="queryParams.username" placeholder="请输入用户名称" clearable @keyup.enter="handleQuery"
-              class="!w-240px" />
+        <el-form class="-mb-15px" :model="queryParams" ref="queryFormRef" :inline="true">
+          <el-form-item :label="t('system.user.username')" prop="username">
+            <el-input v-model="queryParams.username" :placeholder="t('common.inputText') + t('system.user.username')"
+              clearable @keyup.enter="handleQuery" class="!w-240px" />
           </el-form-item>
-          <el-form-item label="手机号码" prop="mobile">
-            <el-input v-model="queryParams.mobile" placeholder="请输入手机号码" clearable @keyup.enter="handleQuery"
-              class="!w-240px" />
+          <el-form-item :label="t('system.user.mobile')" prop="mobile">
+            <el-input v-model="queryParams.mobile" :placeholder="t('common.inputText') + t('system.user.mobile')"
+              clearable @keyup.enter="handleQuery" class="!w-240px" />
           </el-form-item>
-          <el-form-item label="状态" prop="status">
-            <el-select v-model="queryParams.status" placeholder="请选择用户状态" clearable class="!w-240px">
+          <el-form-item :label="t('common.status')" prop="status">
+            <el-select v-model="queryParams.status" :placeholder="t('common.selectText') + t('common.status')" clearable
+              class="!w-240px">
               <el-option v-for="dict in getIntDictOptions(DICT_TYPE.COMMON_STATUS)" :key="dict.value"
                 :label="dict.label" :value="dict.value" />
             </el-select>
           </el-form-item>
-          <el-form-item label="创建时间" prop="createTime">
+          <el-form-item :label="t('common.createTime')" prop="createTime">
             <el-date-picker v-model="queryParams.createTime" value-format="YYYY-MM-DD HH:mm:ss" type="datetimerange"
-              start-placeholder="开始日期" end-placeholder="结束日期" class="!w-240px" />
+              :start-placeholder="t('common.startTimeText')" :end-placeholder="t('common.endTimeText')"
+              class="!w-240px" />
           </el-form-item>
           <el-form-item>
             <el-button @click="handleQuery">
-              <Icon icon="ep:search" />搜索
+              <Icon icon="ep:search" />{{ t('common.query') }}
             </el-button>
             <el-button @click="resetQuery">
-              <Icon icon="ep:refresh" />重置
+              <Icon icon="ep:refresh" />{{ t('common.reset') }}
             </el-button>
             <el-button type="primary" plain @click="openForm('create')" v-hasPermi="['system:user:create']">
-              <Icon icon="ep:plus" /> 新增
+              <Icon icon="ep:plus" /> {{ t('action.add') }}
             </el-button>
             <el-button type="warning" plain @click="handleImport" v-hasPermi="['system:user:import']">
-              <Icon icon="ep:upload" /> 导入
+              <Icon icon="ep:upload" /> {{ t('action.import') }}
             </el-button>
             <el-button type="success" plain @click="handleExport" :loading="exportLoading"
               v-hasPermi="['system:user:export']">
-              <Icon icon="ep:download" />导出
+              <Icon icon="ep:download" />{{ t('action.export') }}
             </el-button>
             <el-button type="danger" plain :disabled="checkedIds.length === 0" @click="handleDeleteBatch"
               v-hasPermi="['system:user:delete']">
-              <Icon icon="ep:delete" />批量删除
+              <Icon icon="ep:delete" />{{ t('common.delDataMessage') }}
             </el-button>
           </el-form-item>
         </el-form>
@@ -59,24 +61,28 @@
       <ContentWrap>
         <el-table v-loading="loading" :data="list" @selection-change="handleRowCheckboxChange">
           <el-table-column type="selection" width="55" />
-          <el-table-column label="用户编号" align="center" key="id" prop="id" />
-          <el-table-column label="用户名称" align="center" prop="username" :show-overflow-tooltip="true" />
-          <el-table-column label="用户昵称" align="center" prop="nickname" :show-overflow-tooltip="true" />
-          <el-table-column label="部门" align="center" key="deptName" prop="deptName" :show-overflow-tooltip="true" />
-          <el-table-column label="手机号码" align="center" prop="mobile" width="120" />
-          <el-table-column label="状态" key="status">
+          <el-table-column :label="t('system.user.id')" align="center" key="id" prop="id" />
+          <el-table-column :label="t('system.user.username')" align="center" prop="username"
+            :show-overflow-tooltip="true" />
+          <el-table-column :label="t('system.user.nickname')" align="center" prop="nickname"
+            :show-overflow-tooltip="true" />
+          <el-table-column :label="t('system.user.dept')" align="center" key="deptName" prop="deptName"
+            :show-overflow-tooltip="true" />
+          <el-table-column :label="t('system.user.mobile')" align="center" prop="mobile" width="120" />
+          <el-table-column :label="t('common.status')" key="status">
             <template #default="scope">
               <el-switch v-model="scope.row.status" :active-value="0" :inactive-value="1"
                 @change="handleStatusChange(scope.row)" :disabled="!checkPermi(['system:user:update'])" />
             </template>
           </el-table-column>
-          <el-table-column label="创建时间" align="center" prop="createTime" :formatter="dateFormatter" width="180" />
-          <el-table-column label="操作" align="center" width="160">
+          <el-table-column :label="t('common.createTime')" align="center" prop="createTime" :formatter="dateFormatter"
+            width="180" />
+          <el-table-column :label="t('table.action')" align="center" width="160">
             <template #default="scope">
               <div class="flex items-center justify-center">
                 <el-button type="primary" link @click="openForm('update', scope.row.id)"
                   v-hasPermi="['system:user:update']">
-                  <Icon icon="ep:edit" />修改
+                  <Icon icon="ep:edit" />{{ t('action.edit') }}
                 </el-button>
                 <el-dropdown @command="(command) => handleCommand(command, scope.row)" v-hasPermi="[
                   'system:user:delete',
@@ -84,20 +90,20 @@
                   'system:permission:assign-user-role'
                 ]">
                   <el-button type="primary" link>
-                    <Icon icon="ep:d-arrow-right" /> 更多
+                    <Icon icon="ep:d-arrow-right" /> {{ t('action.more') }}
                   </el-button>
                   <template #dropdown>
                     <el-dropdown-menu>
                       <el-dropdown-item command="handleDelete"
                         v-if="checkPermi(['system:user:delete']) && wsCache.get('user').user.id != scope.row.id">
-                        <Icon icon="ep:delete" />删除
+                        <Icon icon="ep:delete" />{{ t('action.del') }}
                       </el-dropdown-item>
                       <el-dropdown-item command="handleResetPwd" v-if="checkPermi(['system:user:update-password'])">
-                        <Icon icon="ep:key" />重置密码
+                        <Icon icon="ep:key" />{{ t('login.resetPassword') }}
                       </el-dropdown-item>
                       <el-dropdown-item command="handleRole"
                         v-if="checkPermi(['system:permission:assign-user-role']) && wsCache.get('user').user.id != scope.row.id">
-                        <Icon icon="ep:circle-check" />分配角色
+                        <Icon icon="ep:circle-check" />{{ t('system.user.assignRole') }}
                       </el-dropdown-item>
                     </el-dropdown-menu>
                   </template>