提交国际化处理

src/api/dept.ts

@@ -35,6 +35,7 @@ export function queryDeptList(data: DeptRecord) {
   });
 }
 
+// 获取区域列表
 export function deptList() {
   return axios.get(`/api/rest/dept`);
 }

src/api/ticket.ts

@@ -25,6 +25,7 @@ export interface auditRecord {
   ticketId: string;
 }
 
+// 票据列表
 export function queryTicket(data: any) {
   return axios({
     url: '/api/rest/bill', // 路径
@@ -33,6 +34,7 @@ export function queryTicket(data: any) {
   });
 }
 
+// 详情
 export function getDetail(id: string) {
   return axios.get(`/api/rest/bill/${id}`);
 }

src/components/navbar/index.vue

@@ -10,7 +10,7 @@
           :style="{ margin: 0, fontSize: '18px' }"
           :heading="5"
         >
-          票据管理系统
+          {{ $t('ticket.manage.system') }}
         </a-typography-title>
         <icon-menu-fold
           v-if="!topMenu && appStore.device === 'mobile'"

src/locale/en-US.ts

@@ -31,11 +31,11 @@ import systemRole from '@/views/system/role/locale/en-US';
 import systemDept from '@/views/system/dept/locale/en-US';
 
 import ticketManage from '@/views/ticket/manage/locale/en-US';
-import ticketForm from '@/views/ticket/form/locale/en-US';
 
 import localeSettings from './en-US/settings';
 
 export default {
+  'ticket.manage.system':'Ticket Manage System',
   'menu.dashboard': 'Dashboard',
   'menu.server.dashboard': 'Dashboard-Server',
   'menu.server.workplace': 'Workplace-Server',
@@ -76,7 +76,6 @@ export default {
   ...localeUserInfo,
   ...localeUserSetting,
   ...ticketManage,
-  ...ticketForm,
   ...systemUser,
   ...systemRole,
   ...systemDept,

src/locale/zh-CN.ts

@@ -31,11 +31,11 @@ import systemRole from '@/views/system/role/locale/zh-CN';
 import systemDept from '@/views/system/dept/locale/zh-CN';
 
 import ticketManage from '@/views/ticket/manage/locale/zh-CN';
-import ticketForm from '@/views/ticket/form/locale/zh-CN'
 
 import localeSettings from './zh-CN/settings';
 
 export default {
+  'ticket.manage.system':'票据管理系统',
   'menu.dashboard': '仪表盘',
   'menu.server.dashboard': '仪表盘-服务端',
   'menu.server.workplace': '工作台-服务端',
@@ -76,7 +76,6 @@ export default {
   ...localeUserInfo,
   ...localeUserSetting,
   ...ticketManage,
-  ...ticketForm,
   ...systemUser,
   ...systemRole,
   ...systemDept,

src/store/modules/user/index.ts

@@ -56,7 +56,6 @@ const useUserStore = defineStore('user', {
 
     async info() {
       const res = await getUserInfo();
-      console.log("we",res);
       res.data.user.permissions = res.data.permissions
       this.setInfo(res.data.user);
     },

src/store/modules/user/types.ts

@@ -2,7 +2,6 @@ import { RoleRecord } from '@/api/role';
 
 export type RoleType = '' | '*' | 'admin' | 'user' | string[];
 export interface UserState {
-  [x: string]: { value: any; id: string; avatar: string; createAt: string; username: string; nickName: string; password: string; phone: string; email: string; enabled: string; address: string; deptId: { id: string; remark: string; createTime: string; name: string; enabled: string; }|undefined; roleId: string|{ id: string; name: string; dataScope: string; permissionIds: (number|undefined)[]; remark: string; authorities: (number|undefined)[]; }|undefined; permissionIds: (number|undefined)[]; authorities: string[]; };
   username?: string;
   nickName?: string;
   avatar?: string;

src/views/login/components/login-form.vue

@@ -79,51 +79,79 @@
     <a-form ref="userCreateRef" :model="formData" :style="{ width: '500px' }">
       <a-form-item
         field="username"
-        label="用户名"
+        :label="$t('user.info.username')"
         :validate-trigger="['change', 'input']"
-        :rules="[{ required: true, message: '用户名不能为空' }]"
+        :rules="[
+          { required: true, message: t('user.info.username.required') },
+          {
+            match: /^[a-zA-Z0-9\u4e00-\u9fa5]{1,20}$/,
+            message: t('user.info.username.format'),
+          },
+        ]"
       >
-        <a-input v-model="formData.username" />
+        <a-input
+          v-model="formData.username"
+          :placeholder="$t('user.info.username.placeholder')"
+        />
       </a-form-item>
       <a-form-item
         field="password"
-        label="密码"
+        :label="$t('user.info.password')"
         :validate-trigger="['change', 'input']"
-        :rules="[{ required: true, message: '密码不能为空' }]"
+        :rules="[{ required: true, message: t('user.info.password.required') }]"
       >
-        <a-input v-model="formData.password" />
+        <a-input
+          v-model="formData.password"
+          :placeholder="$t('user.info.password.placeholder')"
+        />
       </a-form-item>
-      <a-form-item field="nickName" label="昵称">
+      <a-form-item field="nickName" :label="$t('user.info.nickName')">
-        <a-input v-model="formData.nickName" />
+        <a-input
+          v-model="formData.nickName"
+          :placeholder="$t('user.info.nickName.placeholder')"
+        />
       </a-form-item>
       <a-form-item
         field="phone"
-        label="电话"
+        :label="$t('user.info.phone')"
         :rules="[
-          { required: true, message: '电话不能为空' },
+          { required: true, message: t('user.info.phone.required') },
-          { match: /^1[3-9]\d{9}$/, message: '请输入正确格式的电话号码' },
+          { match: /^1[3-9]\d{9}$/, message: t('user.info.phone.format') },
         ]"
         :validate-trigger="['change', 'input']"
       >
-        <a-input v-model="formData.phone" />
+        <a-input
+          v-model="formData.phone"
+          :placeholder="$t('user.info.phone.placeholder')"
+        />
       </a-form-item>
       <a-form-item
         field="email"
-        label="邮箱"
+        :label="$t('user.info.email')"
         :rules="[
-          { required: true, type: 'email', message: '请输入正确格式的邮箱' },
+          {
+            required: true,
+            type: 'email',
+            message: t('user.info.email.required'),
+          },
         ]"
         :validate-trigger="['change', 'input']"
       >
-        <a-input v-model="formData.email" />
+        <a-input
+          v-model="formData.email"
+          :placeholder="$t('user.info.email.placeholder')"
+        />
       </a-form-item>
-      <a-form-item field="address" label="地址">
+      <a-form-item field="address" :label="$t('user.info.address')">
-        <a-input v-model="formData.address" />
+        <a-input
+          v-model="formData.address"
+          :placeholder="$t('user.info.address.placeholder')"
+        />
       </a-form-item>
       <a-form-item
         field="deptId"
-        label="部门"
+        :label="$t('user.info.dept')"
-        :rules="[{ required: true, message: '请选择部门' }]"
+        :rules="[{ required: true, message: t('user.info.dept.required') }]"
         :validate-trigger="['change']"
       >
         <a-tree-select
@@ -135,7 +163,7 @@
           }"
           :data="deptOptions"
           allow-clear
-          placeholder="请选择父部门 ..."
+          :placeholder="$t('user.info.dept.placeholder')"
         />
       </a-form-item>
     </a-form>
@@ -164,7 +192,7 @@ const { loading, setLoading } = useLoading();
 const userStore = useUserStore();
 const { visible, setVisible } = useVisible(false);
 const userCreateRef = ref<FormInstance>();
-const modalTitle = '注册用户信息';
+const modalTitle = t('create.user');
 const formData = ref<CreateRecord>({
   username: '',
   nickName: '',
@@ -235,7 +263,7 @@ const handleSubmit = async ({
       loginConfig.value.password = rememberPassword ? password : '';
     } catch (err) {
       // errorMessage.value = (err as Error).message;
-      errorMessage.value = '登录失败';
+      errorMessage.value = t('login.form.login.errMsg');
     } finally {
       setLoading(false);
     }
@@ -260,7 +288,7 @@ const handleOk = async () => {
     const res = await userStore.createUser(formData.value);
     if (res.status === 200) {
       Message.success({
-        content: `${modalTitle}成功`,
+        content: t('create.sucess'),
         duration: 5 * 1000,
       });
     }

src/views/login/locale/en-US.ts

@@ -1,5 +1,5 @@
 export default {
-  'login.form.title': 'Login to Arco Design Pro',
+  'login.form.title': 'ZSC Learning Platform',
   'login.form.userName.errMsg': 'Username cannot be empty',
   'login.form.password.errMsg': 'Password cannot be empty',
   'login.form.login.errMsg': 'Login error, refresh and try again',
@@ -18,4 +18,5 @@ export default {
     'Internationalization, routing configuration, state management everything',
   'login.banner.slogan3': 'Access visualization enhancement tool AUX',
   'login.banner.subSlogan3': 'Realize flexible block development',
+  'create.user':'Create User'
 };

src/views/login/locale/zh-CN.ts

@@ -1,5 +1,5 @@
 export default {
-  'login.form.title': '学院学习平台',
+  'login.form.title': '中山学院学习平台',
   'login.form.userName.errMsg': '用户名不能为空',
   'login.form.password.errMsg': '密码不能为空',
   'login.form.login.errMsg': '登录出错，请刷新重试',
@@ -16,4 +16,5 @@ export default {
   'login.banner.subSlogan2': '国际化，路由配置，状态管理应有尽有',
   'login.banner.slogan3': '接入可视化增强工具AUX',
   'login.banner.subSlogan3': '实现灵活的区块式开发',
+  'create.user': '注册用户'
 };

src/views/system/dept/components/dept-edit.vue

@@ -22,20 +22,27 @@
     <a-form ref="createEditRef" :model="formData" :style="{ width: '500px' }">
       <a-form-item
         field="name"
-        label="部门名称"
+        :label="$t('dept.info.name')"
         :validate-trigger="['change', 'input']"
-        :rules="[{ required: true, message: '部门名称不能为空' }]"
+        :rules="[{ required: true, message: t('dept.info.name.required') }]"
       >
-        <a-input v-model="formData.name" />
+        <a-input
+          v-model="formData.name"
+          :placeholder="$t('dept.info.name.placeholder')"
+        />
       </a-form-item>
-      <a-form-item field="remark" label="备注">
+      <a-form-item field="remark" :label="$t('dept.info.remark')">
-        <a-textarea v-model="formData.remark" placeholder="部门备注" />
+        <a-textarea
+          v-model="formData.remark"
+          :placeholder="$t('dept.info.remark.placeholder')"
+        />
       </a-form-item>
     </a-form>
   </a-modal>
 </template>
 
 <script lang="ts" setup>
+import { useI18n } from 'vue-i18n';
 import useVisible from '@/hooks/visible';
 import { computed, PropType, ref } from 'vue';
 import { FormInstance } from '@arco-design/web-vue/es/form';
@@ -47,14 +54,11 @@ const props = defineProps({
   dept: {
     type: Object as PropType<DeptRecord>,
   },
-  trees: {
-    type: Array as PropType<TreeNodeData[]>,
-  },
   isCreate: Boolean,
 });
-
+const { t } = useI18n();
 const modalTitle = computed(() => {
-  return props.isCreate ? '新增' : '编辑';
+  return props.isCreate ? t('create') : t('edit');
 });
 const { visible, setVisible } = useVisible(false);
 const deptStore = useDeptStore();
@@ -71,27 +75,31 @@ const formData = ref<DeptRecord>({
 
 const emit = defineEmits(['refresh']);
 
+// 组件被点击
 const handleClick = () => {
   setVisible(true);
 };
 
+// 提交
 const handleSubmit = async () => {
   const valid = await createEditRef.value?.validate();
   if (!valid) {
+    // 新增
     if (props.isCreate) {
       const res = await deptStore.createDept(formData.value);
       if (res.status === 200) {
         Message.success({
-          content: `${modalTitle.value}成功`,
+          content: t('create.sucess'),
           duration: 5 * 1000,
         });
       }
       createEditRef.value?.resetFields();
     } else {
+      // 编辑
       const res = await deptStore.updateDept(formData.value);
       if (res.status === 200) {
         Message.success({
-          content: `${modalTitle.value}成功`,
+          content: t('modify.sucess'),
           duration: 5 * 1000,
         });
       }
@@ -101,6 +109,7 @@ const handleSubmit = async () => {
   }
 };
 
+// 关闭
 const handleCancel = async () => {
   createEditRef.value?.resetFields();
   setVisible(false);

src/views/system/dept/index.vue

@@ -11,11 +11,14 @@
             label-align="right"
           >
             <a-row :gutter="16">
-              <a-col :span="10">
+              <a-col :span="12">
-                <a-form-item field="title" label="部门名称">
+                <a-form-item
+                  field="title"
+                  :label="$t('searchTable.form.deptName')"
+                >
                   <a-input
                     v-model="formModel.name"
-                    placeholder="请输入部门名称"
+                    :placeholder="$t('searchTable.form.deptName.placeholder')"
                   />
                 </a-form-item>
               </a-col>
@@ -44,12 +47,7 @@
       <a-row style="margin-bottom: 16px">
         <a-col :span="12">
           <a-space>
-            <DeptEdit
+            <DeptEdit ref="createRef" :is-create="true" @refresh="search" />
-              ref="createRef"
-              :trees="renderData"
-              :is-create="true"
-              @refresh="search"
-            />
           </a-space>
         </a-col>
         <a-col
@@ -136,20 +134,20 @@
           />
         </template>
         <template #operations="{ record }">
+          <!-- 编辑 -->
           <DeptEdit
             ref="editRef"
             :dept="record"
-            :trees="renderData"
             :is-create="false"
             @refresh="search"
           />
           <a-popconfirm
-            content="确认删除此部门?"
+            :content="t('Confirm the deletion of this department')"
             type="error"
             @ok="handleDelete(record)"
           >
             <a-button type="primary" size="small" status="danger">
-              删除
+              {{ $t('delete') }}
             </a-button>
           </a-popconfirm>
         </template>
@@ -193,6 +191,8 @@ const generateFormModel = () => {
 const { t } = useI18n();
 const renderData = ref<DeptRecord[]>([]);
 const formModel = ref(generateFormModel());
+
+// 表格头部
 const columns = computed<TableColumnData[]>(() => [
   {
     title: t('deptTable.columns.index'),
@@ -228,6 +228,7 @@ const columns = computed<TableColumnData[]>(() => [
   },
 ]);
 
+// 获取表格
 const fetchData = async (params?: Partial<DeptRecord>) => {
   setLoading(true);
   try {
@@ -241,6 +242,7 @@ const fetchData = async (params?: Partial<DeptRecord>) => {
   }
 };
 
+// 查询
 const search = () => {
   fetchData({
     ...formModel.value,
@@ -249,6 +251,7 @@ const search = () => {
 
 search();
 
+// 重置
 const reset = () => {
   formModel.value = generateFormModel();
 };
@@ -268,17 +271,22 @@ const enabledStatus = async (record: string) => {
       duration: 3 * 1000,
     });
   }
-  // search();
 };
 
+// 删除
 const handleDelete = async (record) => {
   const res = await deptStore.removeDept(record.id);
   if (res.status === 200) {
     Message.success({
-      content: '删除成功',
+      content: t('delete.dept.sucess'),
       duration: 5 * 1000,
     });
     search();
+  } else {
+    Message.error({
+      content: t('delete.dept.fail'),
+      duration: 5 * 1000,
+    });
   }
 };
 

src/views/system/dept/locale/en-US.ts

@@ -1,3 +1,25 @@
 export default {
-  'menu.role.region': 'Region',
+  'menu.system.dept': 'Dept',
+  'menu.dept.list': 'Dept List',
+  'searchTable.form.deptName': 'Name',
+  'searchTable.form.deptName.placeholder': 'Please enter Name',
+
+  'deptTable.columns.index': '#',
+  'deptTable.columns.name': 'Name',
+  'deptTable.columns.id': 'ID',
+  'deptTable.columns.remark': 'Remark',
+  'deptTable.columns.enabled': 'Enabled',
+  'deptTable.columns.createTime': 'CreateTime',
+  'searchTable.columns.operations': 'Operations',
+
+  'delete.dept.sucess': 'Delete Dept Sucess',
+  'delete.dept.fail': 'Delete Dept Fail',
+
+  'dept.info.name': 'Name',
+  'dept.info.name.placeholder': 'Please enter Name',
+  'dept.info.name.required': 'Name is required',
+  'dept.info.remark': 'Remark',
+  'dept.info.remark.placeholder': 'Please enter Remark',
+
+  'Confirm the deletion of this department' :'Confirm the deletion of this department?'
 };

src/views/system/dept/locale/zh-CN.ts

@@ -1,8 +1,8 @@
 export default {
   'menu.system.dept': '部门管理',
   'menu.dept.list': '区域列表',
-  'searchTable.form.deptName': '区域名称',
+  'searchTable.form.deptName': '部门名称',
-  'searchTable.form.deptName.placeholder': '请输入区域名称',
+  'searchTable.form.deptName.placeholder': '请输入部门名称',
 
   'deptTable.columns.index': '序号',
   'deptTable.columns.name': '区域名称',
@@ -11,13 +11,15 @@ export default {
   'deptTable.columns.enabled': '是否启用',
   'deptTable.columns.createTime': '创建时间',
   'searchTable.columns.operations': '操作',
-  'searchTable.columns.operations.detail': '详细',
 
   'delete.dept.sucess': '删除区域成功',
   'delete.dept.fail': '删除区域失败',
 
-  'add.dept.info.name': '区域名称',
+  'dept.info.name': '部门名称',
-  'add.dept.info.name.placeholder': '请输入区域名称',
+  'dept.info.name.placeholder': '请输入部门名称',
-  'add.dept.info.remark': '备注',
+  'dept.info.name.required': '部门名称不能为空',
-  'add.dept.info.remark.placeholder': '请输入备注',
+  'dept.info.remark': '备注',
+  'dept.info.remark.placeholder': '请输入备注',
+
+  'Confirm the deletion of this department' :'确认删除此部门?'
 };

src/views/system/role/components/role-edit.vue

@@ -22,21 +22,28 @@
     <a-form ref="createEditRef" :model="formData" :style="{ width: '500px' }">
       <a-form-item
         field="name"
-        label="角色名"
+        :label="$t('role.info.name')"
         :validate-trigger="['change', 'input']"
-        :rules="[{ required: true, message: '角色名不能为空' }]"
+        :rules="[{ required: true, message: t('role.info.name.required') }]"
       >
-        <a-input v-model="formData.name" />
+        <a-input
+          v-model="formData.name"
+          :placeholder="$t('role.info.name.placeholder')"
+        />
       </a-form-item>
 
-      <a-form-item field="remark" label="备注">
+      <a-form-item field="remark" :label="$t('role.info.remark')">
-        <a-textarea v-model="formData.remark" placeholder="角色备注" />
+        <a-textarea
+          v-model="formData.remark"
+          :placeholder="$t('role.info.remark.placeholder')"
+        />
       </a-form-item>
     </a-form>
   </a-modal>
 </template>
 
 <script lang="ts" setup>
+import { useI18n } from 'vue-i18n';
 import useVisible from '@/hooks/visible';
 import { computed, PropType, ref } from 'vue';
 import { FormInstance } from '@arco-design/web-vue/es/form';
@@ -51,9 +58,9 @@ const props = defineProps({
   },
   isCreate: Boolean,
 });
-
+const { t } = useI18n();
 const modalTitle = computed(() => {
-  return props.isCreate ? '新增' : '编辑';
+  return props.isCreate ? t('create') : t('edit');
 });
 const { visible, setVisible } = useVisible(false);
 const createEditRef = ref<FormInstance>();
@@ -69,8 +76,10 @@ const formData = ref<RoleRecord>({
 
 const emit = defineEmits(['refresh']);
 
+// 组件被点击
 const handleClick = () => {
   const roleId = props.prem?.id;
+  // 编辑
   if (!props.isCreate && roleId) {
     roleStore
       .getRoleDetail(roleId)
@@ -85,23 +94,26 @@ const handleClick = () => {
   }
 };
 
+// 提交
 const handleSubmit = async () => {
   const valid = await createEditRef.value?.validate();
   if (!valid) {
+    // 新增
     if (props.isCreate) {
       const res = await roleStore.createRole(formData.value);
       if (res.status === 200) {
         Message.success({
-          content: `${modalTitle.value}成功`,
+          content: t('create.sucess'),
           duration: 5 * 1000,
         });
       }
       createEditRef.value?.resetFields();
     } else {
+      // 编辑
       const res = await roleStore.updateRole(formData.value);
       if (res.status === 200) {
         Message.success({
-          content: `${modalTitle.value}成功`,
+          content: t('modify.sucess'),
           duration: 5 * 1000,
         });
       }
@@ -111,6 +123,7 @@ const handleSubmit = async () => {
   }
 };
 
+// 关闭
 const handleCancel = async () => {
   createEditRef.value?.resetFields();
   setVisible(false);

src/views/system/role/index.vue

@@ -93,6 +93,7 @@
           />
         </template>
         <template #operations="{ record }">
+          <!-- 编辑 -->
           <RoleEdit
             ref="editRef"
             :prem="record"
@@ -100,12 +101,12 @@
             @refresh="fetchData"
           />
           <a-popconfirm
-            content="确认删除此角色?"
+            :content="t('Confirm the deletion of this role')"
             type="error"
             @ok="handleDelete(record)"
           >
             <a-button type="primary" size="small" status="danger">
-              删除
+              {{ $t('delete') }}
             </a-button>
           </a-popconfirm>
         </template>
@@ -143,6 +144,7 @@ const {
 } = useTableOption();
 const roleStore = useRoleStore();
 
+// 表格头部
 const columns = computed<TableColumnData[]>(() => [
   {
     title: t('roleTable.columns.index'),
@@ -157,10 +159,10 @@ const columns = computed<TableColumnData[]>(() => [
     title: t('roleTable.columns.remark'),
     dataIndex: 'remark',
   },
-  {
+  // {
-    title: t('roleTable.columns.authorities'),
+  //   title: t('roleTable.columns.authorities'),
-    dataIndex: 'authorities',
+  //   dataIndex: 'authorities',
-  },
+  // },
   {
     title: t('roleTable.columns.createTime'),
     dataIndex: 'createTime',
@@ -177,6 +179,8 @@ const columns = computed<TableColumnData[]>(() => [
     slotName: 'operations',
   },
 ]);
+
+// 获取表格数据
 const fetchData = async () => {
   setLoading(true);
   try {
@@ -206,17 +210,22 @@ const enabledStatus = async (record: string) => {
       duration: 3 * 1000,
     });
   }
-  // fetchData();
 };
 
+// 删除
 const handleDelete = async (record: RoleRecord) => {
   const res = await roleStore.removeRole(record.id);
   if (res.status === 200) {
     Message.success({
-      content: '删除成功',
+      content: t('delete.role.sucess'),
       duration: 5 * 1000,
     });
     fetchData();
+  } else {
+    Message.error({
+      content: t('delete.role.fail'),
+      duration: 3 * 1000,
+    });
   }
 };
 

src/views/system/role/locale/en-US.ts

@@ -1,6 +1,30 @@
 export default {
-  'menu.role.manage': 'Role Manage',
+  'menu.system.role': 'Role',
   'menu.role.list': 'Role List',
-  'searchTable.operation.create': 'Create',
+  // columns
-  'searchTable.operation.delete': 'Delete',
+  'roleTable.operation.create': 'Create',
+  'roleTable.operation.delete': 'Delete',
+  'roleTable.columns.index': '#',
+  'roleTable.columns.name': 'Name',
+  'roleTable.columns.remark': 'Remark',
+  'roleTable.columns.enabled': 'Enabled',
+  'roleTable.columns.createTime': 'CreateTime',
+  'roleTable.columns.operations': 'Operations',
+
+  'delete.role.sucess': 'Delete Role Sucess',
+  'delete.role.fail': 'Delete Role Fail',
+
+  'role.info.name': 'Name',
+  'role.info.name.placeholder': 'Please enter Name',
+  'role.info.name.required': 'Name is required',
+  'role.info.remark': 'Remark',
+  'role.info.remark.placeholder': 'Please enter Remark',
+
+  'from.ok': 'ok',
+  'from.cancel': 'cancel',
+
+  'Confirm the deletion of this role':'Confirm the deletion of this role?',
+
+  'modify.status.sucess':'Modify status sucess',
+  'modify.status.fail':'Modify status fail',
 };

src/views/system/role/locale/zh-CN.ts

@@ -1,5 +1,5 @@
 export default {
-  'menu.role.manage': '角色管理',
+  'menu.system.role': '角色管理',
   'menu.role.list': '角色列表',
   // columns
   'roleTable.operation.create': '添加',
@@ -8,30 +8,23 @@ export default {
   'roleTable.columns.name': '名称',
   'roleTable.columns.remark': '备注',
   'roleTable.columns.enabled': '是否启用',
-  'roleTable.columns.authorities': '权限',
   'roleTable.columns.createTime': '创建时间',
-  'roleTable.columns.updateTime': '更新时间',
   'roleTable.columns.operations': '操作',
-  'roleTable.columns.operations.detail': '详细',
 
   'delete.role.sucess': '删除角色成功',
   'delete.role.fail': '删除角色失败',
 
-  'add.role.info.name': '角色身份',
+  'role.info.name': '角色名称',
-  'add.role.info.name.placeholder': '请输入角色身份',
+  'role.info.name.placeholder': '请输入角色名称',
-  'add.role.info.remark': '备注',
+  'role.info.name.required': '角色不能为空',
-  'add.role.info.remark.placeholder': '请输入备注',
+  'role.info.remark': '备注',
-  'add.role.info.authorities': '管理权限',
+  'role.info.remark.placeholder': '请输入备注',
-  'add.role.info.authorities.placeholder': '请选择管理权限',
-
-  'add.role.info.sucess': '添加角色成功',
-  'add.role.info.fail': '添加角色失败',
-  'modify.role.info.sucess': '修改角色信息成功',
-  'modify.role.info.fail': '修改角色信息失败',
 
   'from.ok': '确认',
   'from.cancel': '取消',
 
-  'modify.status.sucess': '修改状态成功',
+  'Confirm the deletion of this role':'确认删除此角色?',
-  'modify.status.fail': '修改状态失败',
+
+  'modify.status.sucess':'修改状态成功',
+  'modify.status.fail':'修改状态失败',
 };

src/views/system/user/components/user-edit.vue

@@ -23,52 +23,83 @@
     <a-form ref="CreateRef" :model="formData" :style="{ width: '500px' }">
       <a-form-item
         field="username"
-        label="用户名"
+        :label="$t('user.info.username')"
         :validate-trigger="['change', 'input']"
-        :rules="[{ required: true, message: '用户名不能为空' }]"
+        :rules="[
+          { required: true, message: t('user.info.username.required') },
+          {
+            match: /^[a-zA-Z0-9\u4e00-\u9fa5]{1,20}$/,
+            message: t('user.info.username.format'),
+          },
+        ]"
       >
-        <a-input v-model="formData.username" />
+        <a-input
+          v-if="props.isCreate"
+          v-model="formData.username"
+          :placeholder="$t('user.info.username.placeholder')"
+        />
+
+        <div v-else>{{ formData.username }}</div>
       </a-form-item>
       <a-form-item
         field="password"
-        label="密码"
+        :label="$t('user.info.password')"
         v-if="isCreate"
         :validate-trigger="['change', 'input']"
-        :rules="[{ required: true, message: '密码不能为空' }]"
+        :rules="[{ required: true, message: t('user.info.password.required') }]"
       >
-        <a-input v-model="formData.password" />
+        <a-input
+          v-model="formData.password"
+          :placeholder="$t('user.info.password.placeholder')"
+        />
       </a-form-item>
-      <a-form-item field="nickName" label="昵称">
+      <a-form-item field="nickName" :label="$t('user.info.nickName')">
-        <a-input v-model="formData.nickName" />
+        <a-input
+          v-model="formData.nickName"
+          :placeholder="$t('user.info.nickName.placeholder')"
+        />
       </a-form-item>
       <a-form-item
         field="phone"
-        label="电话"
+        :label="$t('user.info.phone')"
         :rules="[
-          { required: true, message: '电话不能为空' },
+          { required: true, message: t('user.info.phone.required') },
-          { match: /^1[3-9]\d{9}$/, message: '请输入正确格式的电话号码' },
+          { match: /^1[3-9]\d{9}$/, message: t('user.info.phone.format') },
         ]"
         :validate-trigger="['change', 'input']"
       >
-        <a-input v-model="formData.phone" />
+        <a-input
+          v-model="formData.phone"
+          :placeholder="$t('user.info.phone.placeholder')"
+        />
       </a-form-item>
       <a-form-item
         field="email"
-        label="邮箱"
+        :label="$t('user.info.email')"
         :rules="[
-          { required: true, type: 'email', message: '请输入正确格式的邮箱' },
+          {
+            required: true,
+            type: 'email',
+            message: t('user.info.email.required'),
+          },
         ]"
         :validate-trigger="['change', 'input']"
       >
-        <a-input v-model="formData.email" />
+        <a-input
+          v-model="formData.email"
+          :placeholder="$t('user.info.email.placeholder')"
+        />
       </a-form-item>
-      <a-form-item field="address" label="地址">
+      <a-form-item field="address" :label="$t('user.info.address')">
-        <a-input v-model="formData.address" />
+        <a-input
+          v-model="formData.address"
+          :placeholder="$t('user.info.address.placeholder')"
+        />
       </a-form-item>
       <a-form-item
         field="deptId"
-        label="部门"
+        :label="$t('user.info.dept')"
-        :rules="[{ required: true, message: '请选择部门' }]"
+        :rules="[{ required: true, message: t('user.info.dept.required') }]"
         :validate-trigger="['change']"
       >
         <a-tree-select
@@ -80,16 +111,11 @@
           }"
           :data="deptOptions"
           allow-clear
-          placeholder="请选择父部门 ..."
+          :placeholder="$t('user.info.dept.placeholder')"
         />
       </a-form-item>
 
-      <a-form-item
+      <a-form-item field="roleId" :label="$t('user.info.role')">
-        field="roleIds"
-        label="角色"
-        :rules="[{ type: 'array', minLength: 1, message: '请选择一个' }]"
-        :validate-trigger="['change', 'input']"
-      >
         <a-radio-group
           v-for="i in roleOptions"
           :key="i.id"
@@ -103,6 +129,7 @@
 </template>
 
 <script lang="ts" setup>
+import { useI18n } from 'vue-i18n';
 import useVisible from '@/hooks/visible';
 import { computed, PropType, ref } from 'vue';
 import { CreateRecord, UserRecord } from '@/api/user';
@@ -120,14 +147,14 @@ const props = defineProps({
   },
   isCreate: Boolean,
 });
-
+const { t } = useI18n();
 const modalTitle = computed(() => {
-  return props.isCreate ? '新增' : '编辑';
+  return props.isCreate ? t('create') : t('edit');
 });
 const { visible, setVisible } = useVisible(false);
 const checkKeys = ref<number[]>([]);
 
-const userCreateRef = ref<FormInstance>();
+const CreateRef = ref<FormInstance>();
 
 const formData = ref<CreateRecord>({
   username: '',
@@ -145,23 +172,31 @@ const formData = ref<CreateRecord>({
 
 let formDifer = {};
 const userStore = useUserStore();
+
+// 部门数据
 const deptOptions = computedAsync(async () => {
   const { data } = await deptList();
   return data;
 });
 
+// 角色数据
 const roleOptions = computedAsync(async () => {
   const res = await queryRoleList();
   return res.data;
 });
+
 const emit = defineEmits(['refresh']);
 
+// 组件被点击
 const handleClick = () => {
   const userId = props.prem?.id;
+
+  // 编辑
   if (!props.isCreate && userId) {
     formData.value = props.prem;
     formDifer = { ...props.prem };
   }
+
   setVisible(true);
 };
 
@@ -176,24 +211,27 @@ const diffDataForm = (newData: any, oldData: any) => {
   return result;
 };
 
+// 提交
 const handleSubmit = async () => {
-  const valid = await userCreateRef.value?.validate();
+  const valid = await CreateRef.value?.validate();
   if (!valid) {
     formData.value.permissionIds = checkKeys.value;
+    // 新增
     if (props.isCreate) {
       const res = await userStore.createUser(formData.value);
       if (res.status === 200) {
         Message.success({
-          content: `${modalTitle.value}成功`,
+          content: t('create.sucess'),
           duration: 5 * 1000,
         });
       }
-      userCreateRef.value?.resetFields();
+      CreateRef.value?.resetFields();
     } else {
+      // 编辑
       formDifer = diffDataForm(formData.value, formDifer);
       if (Object.keys(formDifer).length === 0) {
         Message.success({
-          content: `未作任何修改`,
+          content: t('unmodified'),
           duration: 3 * 1000,
         });
       } else {
@@ -201,21 +239,19 @@ const handleSubmit = async () => {
         const res = await userStore.updateUser(formDifer);
         if (res.status === 200) {
           Message.success({
-            content: `${modalTitle.value}成功`,
+            content: t('modify.sucess'),
             duration: 5 * 1000,
           });
         }
       }
     }
-    // emit('refresh');
     checkKeys.value = [];
     setVisible(false);
   }
 };
 
+// 关闭
 const handleCancel = async () => {
-  /// emit('refresh');
-  // userCreateRef.value?.resetFields();
   checkKeys.value = [];
   setVisible(false);
 };

src/views/system/user/index.vue

@@ -302,6 +302,8 @@ const statusOptions = computed<SelectOptionData[]>(() => [
     value: 'false',
   },
 ]);
+
+// 获取用户列表
 const fetchData = async (
   params: UserParams = { page: 1, size: 10, current: 1 }
 ) => {
@@ -319,6 +321,7 @@ const fetchData = async (
   }
 };
 
+// 查询
 const search = () => {
   fetchData({
     ...basePagination,
@@ -326,12 +329,14 @@ const search = () => {
   } as unknown as UserParams);
 };
 
+// 分页
 const onPageChange = (current: number) => {
-  const page = current;
   fetchData({ ...basePagination, current });
 };
 
 fetchData();
+
+// 重置
 const reset = () => {
   formModel.value = generateFormModel();
 };
@@ -353,16 +358,17 @@ const enabledStatus = async (record: string) => {
   }
 };
 
-const handleDelete = async (record: UserRecord) => {
+// 删除
-  const res = await userStore.removeUser(record.id);
+// const handleDelete = async (record: UserRecord) => {
-  if (res.status === 200) {
+//   const res = await userStore.removeUser(record.id);
-    Message.success({
+//   if (res.status === 200) {
-      content: '删除成功',
+//     Message.success({
-      duration: 5 * 1000,
+//       content: '删除成功',
-    });
+//       duration: 5 * 1000,
-    search();
+//     });
-  }
+//     search();
-};
+//   }
+// };
 
 watch(() => columns.value, deepClone, { deep: true, immediate: true });
 </script>

src/views/system/user/locale/en-US.ts

@@ -1,21 +1,16 @@
 export default {
-  'menu.system.user': 'Users',
+  'menu.system.user': 'User',
   'menu.list.searchTable': 'Search Table',
-  'searchTable.form.number': 'Set Number',
+  'searchTable.form.username': 'Username',
-  'searchTable.form.number.placeholder': 'Please enter Set Number',
+  'searchTable.form.username.placeholder': 'Please enter Username',
-  'searchTable.form.name': 'Set Name',
+  'searchTable.form.phone': 'Phone',
-  'searchTable.form.name.placeholder': 'Please enter Set Name',
+  'searchTable.form.phone.placeholder': 'Please enter Phone',
-  'searchTable.form.contentType': 'Content Type',
+  'searchTable.form.email': 'Email',
-  'searchTable.form.contentType.img': 'image-text',
+  'searchTable.form.email.placeholder': 'Please enter Email',
-  'searchTable.form.contentType.horizontalVideo': 'Horizontal short video',
-  'searchTable.form.contentType.verticalVideo': 'Vertical short video',
-  'searchTable.form.filterType': 'Filter Type',
-  'searchTable.form.filterType.artificial': 'artificial',
-  'searchTable.form.filterType.rules': 'Rules',
-  'searchTable.form.createdTime': 'Create Date',
   'searchTable.form.status': 'Status',
-  'searchTable.form.status.online': 'Online',
+  'searchTable.form.status.placeholder': 'Please select Status',
-  'searchTable.form.status.offline': 'Offline',
+  'searchTable.form.status.enable': 'Online',
+  'searchTable.form.status.disable': 'Offline',
   'searchTable.form.search': 'Search',
   'searchTable.form.reset': 'Reset',
   'searchTable.form.selectDefault': 'All',
@@ -23,16 +18,14 @@ export default {
   'searchTable.operation.import': 'Import',
   'searchTable.operation.download': 'Download',
   // columns
-  'searchTable.columns.index': 'Index',
+  'userTable.columns.index': '#',
-  'searchTable.columns.number': 'Set Number',
+  'userTable.columns.nickName': 'NickName',
-  'searchTable.columns.name': 'Set Name',
+  'userTable.columns.username': 'Username',
-  'searchTable.columns.contentType': 'Content Type',
+  'userTable.columns.phone': 'Phone',
-  'searchTable.columns.filterType': 'Filter Type',
+  'userTable.columns.email': 'Email',
-  'searchTable.columns.count': 'Count',
+  'userTable.columns.enabled': 'Enabled',
-  'searchTable.columns.createdTime': 'CreatedTime',
+  'userTable.columns.avater': 'Avater',
-  'searchTable.columns.status': 'Status',
+  'userTable.columns.address': 'Address',
-  'searchTable.columns.operations': 'Operations',
-  'searchTable.columns.operations.view': 'View',
   // size
   'searchTable.size.mini': 'mini',
   'searchTable.size.small': 'small',
@@ -45,4 +38,30 @@ export default {
   // modify
   'modify.user.info.sucess': 'modify sucess',
   'modify.user.info.fail': 'modify fail',
+
+
+  'user.info.username':'Username',
+  'user.info.username.placeholder':'Please enter Username',
+  'user.info.username.required':'Username is required',  
+  'user.info.username.format':'Please enter the correct format',
+  'user.info.password':'Password',
+  'user.info.password.placeholder':'Please enter Password',
+  'user.info.password.required':'Password is required', 
+  'user.info.nickName':'NickName',
+  'user.info.nickName.placeholder':'Please enter NickName',
+  'user.info.phone':'Phone',
+  'user.info.phone.placeholder':'Please enter Phone',
+  'user.info.phone.required':'Phone is required',  
+  'user.info.phone.format':'Please enter the correct format',
+  'user.info.email':'Email',
+  'user.info.email.placeholder':'Please enter Email',
+  'user.info.email.required':'Email is required', 
+  'user.info.address':'Address',
+  'user.info.address.placeholder':'Please enter Address',
+  'user.info.dept':'Dept',
+  'user.info.dept.placeholder':'Please select Dept',
+  'user.info.dept.required': 'Dept is required',
+  'user.info.role':'Role',
+  'user.info.role.required': 'Role is required',
+
 };

src/views/system/user/locale/zh-CN.ts

@@ -1,7 +1,4 @@
 export default {
-  'menu.system.permission': '权限管理',
-  'menu.system.role': '角色管理',
-  'menu.system.dept': '部门管理',
   'menu.system.user': '用户管理',
   'menu.list.searchTable': '查询表格',
   'searchTable.form.username': '用户名',
@@ -42,4 +39,29 @@ export default {
   // modify
   'modify.user.info.sucess': '修改成功',
   'modify.user.info.fail': '修改失败',
-};
+
+  'user.info.username':'用户名',
+  'user.info.username.placeholder':'请输入用户名',
+  'user.info.username.required':'用户名不能为空',  
+  'user.info.username.format':'请输入正确格式的用户名',
+  'user.info.password':'密码',
+  'user.info.password.placeholder':'请输入密码',
+  'user.info.password.required':'密码不能为空', 
+  'user.info.nickName':'昵称',
+  'user.info.nickName.placeholder':'请输入昵称',
+  'user.info.phone':'电话号码',
+  'user.info.phone.placeholder':'请输入电话号码',
+  'user.info.phone.required':'电话号码不能为空',  
+  'user.info.phone.format':'请输入正确格式的电话号码',
+  'user.info.email':'Email',
+  'user.info.email.placeholder':'请输入Email',
+  'user.info.email.required':'Email不能为空', 
+  'user.info.address':'地址',
+  'user.info.address.placeholder':'请输入地址',
+  'user.info.dept':'部门',
+  'user.info.dept.placeholder':'请选择部门',
+  'user.info.dept.required': '部门不能为空',
+  'user.info.role':'角色',
+  'user.info.role.required': '请选择一个',
+
+}

src/views/ticket/form/components/form-edit.vue

@@ -1,289 +0,0 @@
-<template>
-  <a-space width="450px">
-    
-    <a-form
-      v-if="visible"
-      ref="createEditRef"
-      :model="formData"
-      :style="{ width: '450px' }"
-    >
-      <a-form style="text-align: center" v-model="formTitle">
-        <h2>{{ formTitle }}</h2>
-      </a-form>
-      <a-form-item
-        field="companyName"
-        label="公司"
-        :validate-trigger="['change', 'input']"
-        :rules="[{ required: true, message: '公司不能为空' }]"
-      >
-        <a-input v-model="formData.companyName" />
-      </a-form-item>
-
-      <a-form-item
-        field="title"
-        label="标题"
-        :validate-trigger="['change', 'input']"
-        :rules="[{ required: true, message: '标题不能为空' }]"
-      >
-        <a-input v-model="formData.title" />
-      </a-form-item>
-
-      <a-form-item
-        field="body"
-        label="内容"
-        :validate-trigger="['change', 'input']"
-        :rules="[{ required: true, message: '内容不能为空' }]"
-      >
-        <a-textarea v-model="formData.body" />
-      </a-form-item>
-
-      <a-form-item
-        field="money"
-        label="金额"
-        :validate-trigger="['change', 'input']"
-        :rules="[{ required: true, message: '金额不能为空' }]"
-      >
-        <a-input v-model="formData.money" />
-      </a-form-item>
-
-      <a-form-item
-        field="contactEmail"
-        label="联系邮箱"
-        :validate-trigger="['change', 'input']"
-        :rules="[{ required: true, message: '联系邮箱不能为空' }]"
-      >
-        <a-input v-model="formData.contactEmail" />
-      </a-form-item>
-
-      <a-form-item
-        field="type"
-        label="票据类型"
-        :validate-trigger="['change', 'input']"
-        :rules="[{ required: true, message: '票据类型不能为空' }]"
-      >
-        <a-select
-          v-model="formData.type"
-          :options="typesOptions"
-          :placeholder="$t('searchTable.form.type.placeholder')"
-        />
-      </a-form-item>
-
-      <a-form-item field="attachment" label="附件">
-        <a-upload
-          :file-list="fileList"
-          :custom-request="Onchange"
-          :limit="1"
-          :on-before-remove="removeAttact"
-          v-model="formData.attachId"
-        />
-      </a-form-item>
-
-      <a-form-item
-        field="deptId"
-        label="部门"
-        :rules="[{ required: true, message: '请选择部门' }]"
-        :validate-trigger="['change']"
-      >
-        <a-tree-select
-          v-model="formData.deptId"
-          :field-names="{
-            key: 'id',
-            title: 'name',
-            children: 'children',
-          }"
-          :data="deptOptions"
-          allow-clear
-          placeholder="请选择部门 ..."
-          @change="optionDept()"
-        />
-      </a-form-item>
-
-      <a-form-item field="auditorId" label="审核员">
-        <a-select v-model="formData.auditorId" placeholder="请选择审核员">
-          <div v-for="(item, id) in auditorOptions" :key="id">
-            <a-option :value="item.id">{{ item.username }} </a-option>
-          </div>
-        </a-select>
-      </a-form-item>
-
-      <a-form-item>
-        <a-button type="outline" @click="handleStorage">暂存</a-button>
-        <a-button type="primary" style="margin-left: 15px" @click="handleOk"
-          >提交</a-button
-        >
-      </a-form-item>
-    </a-form>
-  </a-space>
-</template>
-
-<script lang="ts" setup>
-import { useI18n } from 'vue-i18n';
-import useVisible from '@/hooks/visible';
-import { computed, PropType, ref, watch } from 'vue';
-import { FormInstance } from '@arco-design/web-vue/es/form';
-import { computedAsync } from '@vueuse/core';
-import { SelectOptionData } from '@arco-design/web-vue/es/select/interface';
-import { Message } from '@arco-design/web-vue';
-import useTableOption from '@/hooks/table-option';
-import { useTicketStore, useUserStore } from '@/store';
-import { TicketRecord } from '@/api/ticket';
-import { deptList } from '@/api/dept';
-
-const props = defineProps({
-  prem: {
-    type: Object as PropType<TicketRecord>,
-  },
-  isCreate: Boolean,
-  isVisible: Boolean,
-});
-console.log('ef', props);
-const { t } = useI18n();
-const ticketStore = useTicketStore();
-const userStore = useUserStore();
-const formTitle = computed(() => {
-  return props.isCreate ? '添加票据' : '修改票据信息';
-});
-const createEditRef = ref<FormInstance>();
-
-const formData = ref<TicketRecord>({
-  id: undefined,
-  title: '',
-  body: '',
-  money: undefined,
-  type: '',
-  contactEmail: '',
-  companyName: '',
-  attachId: '',
-  auditorId: '',
-  submit: '',
-});
-
-const emit = defineEmits(['refresh']);
-
-const deptOptions = computedAsync(async () => {
-  const { data } = await deptList();
-  return data;
-});
-const typesOptions = computed<SelectOptionData[]>(() => [
-  {
-    label: '银行支票',
-    value: 'BANK',
-  },
-  {
-    label: '税务支票',
-    value: 'TAX',
-  },
-  {
-    label: '其他支票',
-    value: 'OTHER',
-  },
-]);
-const statusOptions = computed<SelectOptionData[]>(() => [
-  {
-    label: '待审核',
-    value: 'EXAMINE',
-  },
-  {
-    label: '审核通过',
-    value: 'PASS',
-  },
-  {
-    label: '审核未通过',
-    value: 'FAILED',
-  },
-]);
-const auditorOptions = ref([]);
-const optionDept = async () => {
-  auditorOptions.value = [];
-  const res = await userStore.getUserList({
-    page: 1,
-    size: 100,
-    roleId: '54',
-    deptId: formData.value.deptId,
-  });
-  auditorOptions.value = res.data.list;
-};
-
-const fileList = ref([]);
-
-const Onchange = async (option: any) => {
-  // 发送请求给后端
-  const FormDatas = new FormData();
-  FormDatas.append('file', option.fileItem.file);
-  const res = await ticketStore.uploadFileTicket(FormDatas);
-  console.log('res', res);
-  if (res.status === 200) {
-    Message.success({
-      content: t('上传成功'),
-      duration: 3 * 1000,
-    });
-    res.data.name = res.data.fileName;
-    fileList.value.push(res.data);
-    formData.value.attachId = res.data.id;
-  } else {
-    Message.error({
-      content: t('上传失败'),
-      duration: 3 * 1000,
-    });
-  }
-};
-
-const removeAttact = () => {
-  fileList.value.pop();
-};
-
-const handleStorage = async () => {
-  const valid = await createEditRef.value?.validate();
-  if (!valid) {
-    formData.value.submit = false;
-    if (props.isCreate) {
-      const res = await ticketStore.createTicket(formData.value);
-      if (res.status === 200) {
-        Message.success({
-          content: '暂存成功',
-          duration: 5 * 1000,
-        });
-      }
-    } else {
-      const res = await ticketStore.updateTicket(formData.value);
-      if (res.status === 200) {
-        Message.success({
-          content: '暂存成功',
-          duration: 5 * 1000,
-        });
-      }
-    }
-    createEditRef.value?.resetFields();
-    removeAttact();
-  }
-};
-
-const handleOk = async () => {
-  const valid = await createEditRef.value?.validate();
-  if (!valid) {
-    formData.value.submit = true;
-    if (props.isCreate) {
-      const res = await ticketStore.createTicket(formData.value);
-      if (res.status === 200) {
-        Message.success({
-          content: `提交成功`,
-          duration: 5 * 1000,
-        });
-      }
-    } else {
-      const res = await ticketStore.updateTicket(formData.value);
-      if (res.status === 200) {
-        Message.success({
-          content: `提交成功`,
-          duration: 5 * 1000,
-        });
-      }
-    }
-
-    createEditRef.value?.resetFields();
-    removeAttact();
-  }
-};
-</script>
-
-<style scoped></style>

src/views/ticket/form/index.vue

@@ -1,207 +0,0 @@
-<template>
-  <div class="container">
-    <Breadcrumb :items="['menu.ticket', 'menu.ticket.form']" />
-    <a-card class="general-card" :title="$t('menu.ticket.form')">
-      <a-row>
-        <a-col :flex="2" style="margin-top: 10px">
-          <a-radio-group
-            v-model="ticketStatus"
-            type="button"
-            @change="changeStatus"
-          >
-            <a-radio value="SUBMIT">待提交</a-radio>
-            <a-radio value="FAILED">审核未通过</a-radio>
-          </a-radio-group>
-          <a-button
-            type="outline"
-            size="small"
-            @click="handleCreate"
-            style="margin-left: 120px"
-            >新建</a-button
-          >
-          <a-list
-            :style="{ width: `350px` }"
-            :virtualListProps="{
-              height: 550,
-            }"
-            :data="uncommitData"
-            :pagination-props="paginationProps"
-            @page-change="onPageChange"
-          >
-            <template #item="{ item, id }">
-              <a-list-item :key="id">
-                <a-list-item-meta :title="item.title"> </a-list-item-meta>
-                <template #actions>
-                  <icon-edit @click="handleEdit(item)" />
-                  <icon-delete @click="handleDelete(item)" />
-                </template>
-              </a-list-item>
-            </template>
-          </a-list>
-        </a-col>
-        <a-divider style="height: 600px" direction="vertical" />
-        <a-col :flex="3">
-          <TicketForm
-            ref="createEditRef"
-            :prem="ticketItem"
-            :is-create="true"
-            :is-visible="visible"
-          />
-        </a-col>
-      </a-row>
-    </a-card>
-  </div>
-</template>
-
-<script lang="ts" setup>
-import { computed, ref, watch, reactive } from 'vue';
-import { useI18n } from 'vue-i18n';
-import useLoading from '@/hooks/loading';
-import { Pagination } from '@/types/global';
-import { computedAsync } from '@vueuse/core';
-import type { SelectOptionData } from '@arco-design/web-vue/es/select/interface';
-import type { TableColumnData } from '@arco-design/web-vue/es/table/interface';
-import useTableOption from '@/hooks/table-option';
-import dayjs from 'dayjs';
-import { FileItem, Message } from '@arco-design/web-vue';
-import { FormInstance } from '@arco-design/web-vue/es/form';
-import useVisible from '@/hooks/visible';
-import { useTicketStore, useUserStore, useDeptStore } from '@/store';
-import { TicketRecord } from '@/api/ticket';
-import TicketForm from './components/form-edit.vue';
-
-const { deepClone } = useTableOption();
-const createEditRef = ref<FormInstance>();
-const { loading, setLoading } = useLoading(true);
-const ticketStore = useTicketStore();
-const userStore = useUserStore();
-const deptStore = useDeptStore();
-const { t } = useI18n();
-const uncommitData = ref<TicketRecord[]>([]);
-const ticketStatus = ref('SUBMIT');
-const renderData = () => {
-  return {
-    id: undefined,
-    title: '',
-    body: '',
-    money: undefined,
-    type: '',
-    contactEmail: '',
-    companyName: '',
-    attachId: '',
-    auditorId: '',
-    submit: Boolean,
-  };
-};
-
-const formData = ref(renderData());
-const { visible, setVisible } = useVisible(false);
-let formTitle = '新建票据';
-const isCreate = ref('true');
-const paginationProps = reactive({
-  defaultPageSize: 10,
-  total: 10,
-});
-
-let ticketItem = '';
-const params = {
-  page: 1,
-  current: 1,
-  size: 10,
-  status: ticketStatus.value,
-};
-
-// 获取未提交数据
-const fetchData = async () => {
-  setLoading(true);
-  try {
-    ticketStore.getTicketList(params).then((res) => {
-      uncommitData.value = res.data.records;
-      paginationProps.defaultPageSize = params.size;
-      paginationProps.total = res.data.total;
-    });
-  } catch (err) {
-    // you can report use errorHandler or other
-  } finally {
-    setLoading(false);
-  }
-};
-
-// 分页发生改变
-const onPageChange = (current: number) => {
-  params.current = current;
-  fetchData();
-};
-
-const changeStatus = () => {
-  fetchData();
-  setVisible(false);
-};
-
-fetchData();
-
-const handleCreate = () => {
-  formData.value = renderData();
-  isCreate.value = 'true';
-  formTitle = '新建票据';
-  setVisible(true);
-};
-
-const handleEdit = (item: any) => {
-  isCreate.value = 'false';
-  formTitle = '修改票据信息';
-  ticketItem = item.id;
-  // ticketStore.getDetail(item.id).then((res) => {
-  //   console.log('qwe', res);
-  // });
-  // formData.value = item;
-  setVisible(true);
-};
-
-const handleDelete = async (item: any) => {
-  const res = await ticketStore.removeTicket(item.id);
-  if (res.status === 200) {
-    Message.success({
-      content: '删除成功',
-      duration: 5 * 1000,
-    });
-    changeStatus();
-  }
-};
-</script>
-
-<script lang="ts">
-export default {
-  name: 'ticketForm',
-};
-</script>
-
-<style scoped lang="less">
-.container {
-  padding: 0 20px 20px 20px;
-}
-:deep(.arco-table-th) {
-  &:last-child {
-    .arco-table-th-item-title {
-      margin-left: 16px;
-    }
-  }
-}
-.action-icon {
-  margin-left: 12px;
-  cursor: pointer;
-}
-.active {
-  color: #0960bd;
-  background-color: #e3f4fc;
-}
-.setting {
-  display: flex;
-  align-items: center;
-  width: 200px;
-  .title {
-    margin-left: 12px;
-    cursor: pointer;
-  }
-}
-</style>

src/views/ticket/form/locale/en-US.ts

@@ -1,4 +0,0 @@
-export default {
-  'menu.ticket.manage': 'Ticket Manage',
-  'menu.ticket.list': 'Ticket List',
-};

src/views/ticket/form/locale/zh-CN.ts

@@ -1,15 +0,0 @@
-export default {
-  'menu.ticket.form': '票据表单',
-  'menu.ticket.list': '票据列表',
-
-  // columns
-  'ticketTable.columns.index': '序号',
-  'ticketTable.columns.companyName': '公司',
-  'ticketTable.columns.title': '标题',
-  'ticketTable.columns.money': '金额',
-  'ticketTable.columns.createTime': '创建时间',
-  'ticketTable.columns.status': '审核状态',
-  'ticketTable.columns.type': '类型',
-
-  'searchTable.form.type.placeholder': '请选择票据类型',
-};

src/views/ticket/manage/components/form-edit.vue

@@ -28,63 +28,82 @@
     <a-form ref="createEditRef" :model="formData" :style="{ width: '500px' }">
       <a-form-item
         field="companyName"
-        label="公司"
+        :label="$t('ticket.info.companyName')"
         :validate-trigger="['change', 'input']"
-        :rules="[{ required: true, message: '公司不能为空' }]"
+        :rules="[
+          { required: true, message: t('ticket.info.companyName.required') },
+        ]"
       >
-        <a-input v-model="formData.companyName" />
+        <a-input
+          v-model="formData.companyName"
+          :placeholder="$t('ticket.info.companyName.placeholder')"
+        />
       </a-form-item>
 
       <a-form-item
         field="title"
-        label="标题"
+        :label="$t('ticket.info.title')"
         :validate-trigger="['change', 'input']"
-        :rules="[{ required: true, message: '标题不能为空' }]"
+        :rules="[{ required: true, message: t('ticket.info.title.required') }]"
       >
-        <a-input v-model="formData.title" />
+        <a-input
+          v-model="formData.title"
+          :placeholder="$t('ticket.info.title.placeholder')"
+        />
       </a-form-item>
 
       <a-form-item
         field="body"
-        label="内容"
+        :label="$t('ticket.info.body')"
         :validate-trigger="['change', 'input']"
-        :rules="[{ required: true, message: '内容不能为空' }]"
+        :rules="[{ required: true, message: t('ticket.info.body.required') }]"
       >
-        <a-textarea v-model="formData.body" />
+        <a-textarea
+          v-model="formData.body"
+          :placeholder="$t('ticket.info.body.placeholder')"
+        />
       </a-form-item>
 
       <a-form-item
         field="money"
-        label="金额"
+        :label="$t('ticket.info.money')"
         :validate-trigger="['change', 'input']"
-        :rules="[{ required: true, message: '金额不能为空' }]"
+        :rules="[{ required: true, message: t('ticket.info.money.required') }]"
       >
-        <a-input v-model="formData.money" />
+        <a-input
+          v-model="formData.money"
+          :placeholder="$t('ticket.info.money.placeholder')"
+        />
       </a-form-item>
 
       <a-form-item
         field="contactEmail"
-        label="联系邮箱"
+        :label="$t('ticket.info.contactEmail')"
         :validate-trigger="['change', 'input']"
-        :rules="[{ required: true, message: '联系邮箱不能为空' }]"
+        :rules="[
+          { required: true, message: t('ticket.info.contactEmail.required') },
+        ]"
       >
-        <a-input v-model="formData.contactEmail" />
+        <a-input
+          v-model="formData.contactEmail"
+          :placeholder="$t('ticket.info.contactEmail.placeholder')"
+        />
       </a-form-item>
 
       <a-form-item
         field="type"
-        label="票据类型"
+        :label="$t('ticket.info.type')"
         :validate-trigger="['change', 'input']"
-        :rules="[{ required: true, message: '票据类型不能为空' }]"
+        :rules="[{ required: true, message: t('ticket.info.type.required') }]"
       >
         <a-select
           v-model="formData.type"
           :options="typesOptions"
-          :placeholder="$t('searchTable.form.type.placeholder')"
+          :placeholder="$t('ticket.info.type.placeholder')"
         />
       </a-form-item>
 
-      <a-form-item field="attachment" label="附件">
+      <a-form-item field="attachment" :label="$t('ticket.info.attachment')">
         <a-upload
           :file-list="fileList"
           :custom-request="Onchange"
@@ -96,8 +115,8 @@
 
       <a-form-item
         field="deptId"
-        label="部门"
+        :label="$t('ticket.info.dept')"
-        :rules="[{ required: true, message: '请选择部门' }]"
+        :rules="[{ required: true, message: t('ticket.info.dept.required') }]"
         :validate-trigger="['change']"
       >
         <a-tree-select
@@ -108,36 +127,57 @@
             children: 'children',
           }"
           :data="deptOptions"
-          placeholder="请选择部门 ..."
+          :placeholder="$t('ticket.info.dept.placeholder')"
           @change="optionDept(true)"
         />
       </a-form-item>
 
-      <a-form-item field="auditorId" label="审核员">
+      <a-form-item
-        <a-select v-model="formData.auditorId" placeholder="请选择审核员">
+        field="auditorId"
+        :label="$t('ticket.info.auditor')"
+        :rules="[
+          { required: true, message: t('ticket.info.auditor.required') },
+        ]"
+        :validate-trigger="['change']"
+      >
+        <a-select
+          v-model="formData.auditorId"
+          :placeholder="$t('ticket.info.auditor.placeholder')"
+        >
           <div v-for="(item, id) in auditorOptions" :key="id">
             <a-option :value="item.id">{{ item.username }} </a-option>
           </div>
         </a-select>
       </a-form-item>
 
-      <a-form-item field="status" label="审核状态" v-if="!props.isCreate">
+      <a-form-item
+        field="status"
+        :label="$t('ticket.info.status')"
+        v-if="!props.isCreate"
+      >
         {{ formData.status }}
       </a-form-item>
 
-      <a-form-item field="comment" label="审核意见" v-if="auditData.comment">
+      <a-form-item
+        field="comment"
+        :label="$t('ticket.info.comment')"
+        v-if="auditData.comment"
+      >
         {{ auditData.comment }}
       </a-form-item>
       <a-form-item>
-        <a-button type="dashed" @click="handleCancel">取消</a-button>
+        <a-button type="dashed" @click="handleCancel">
+          {{ $t('cancel') }}</a-button
+        >
         <a-button
           type="outline"
           style="margin-left: 15px"
           @click="handleStorage"
-          >暂存</a-button
         >
-        <a-button type="primary" style="margin-left: 15px" @click="handleOk"
+          {{ $t('storage') }}</a-button
-          >提交</a-button
+        >
+        <a-button type="primary" style="margin-left: 15px" @click="handleOk">
+          {{ $t('submit') }}</a-button
         >
       </a-form-item>
     </a-form>
@@ -168,7 +208,7 @@ const ticketStore = useTicketStore();
 const userStore = useUserStore();
 const roleStore = useRoleStore();
 const modalTitle = computed(() => {
-  return props.isCreate ? '新增' : '修改';
+  return props.isCreate ? t('create') : t('edit');
 });
 const { visible, setVisible } = useVisible(false);
 const createEditRef = ref<FormInstance>();
@@ -202,34 +242,36 @@ const deptOptions = computedAsync(async () => {
 });
 const typesOptions = computed<SelectOptionData[]>(() => [
   {
-    label: '银行支票',
+    label: t('bank'),
     value: 'BANK',
   },
   {
-    label: '税务支票',
+    label: t('tax'),
     value: 'TAX',
   },
   {
-    label: '其他支票',
+    label: t('other'),
     value: 'OTHER',
   },
 ]);
 const statusOptions = computed<SelectOptionData[]>(() => [
   {
-    label: '待审核',
+    label: t('unreviewed'),
     value: 'EXAMINE',
   },
   {
-    label: '审核通过',
+    label: t('pass'),
     value: 'PASS',
   },
   {
-    label: '审核未通过',
+    label: t('failed'),
     value: 'FAILED',
   },
 ]);
 
 let auiditRoleId = '';
+
+// 获取审核员ID
 const getRoleId = async () => {
   const res = await roleStore.getRoleList();
   res.data.forEach((item: any) => {
@@ -238,9 +280,10 @@ const getRoleId = async () => {
     }
   });
 };
-getRoleId();
 
 const auditorOptions = ref([]);
+
+// 根据部门ID查询该部门的审核员
 const optionDept = async (flag: boolean) => {
   if (flag) {
     formData.value.auditorId = undefined;
@@ -254,16 +297,18 @@ const optionDept = async (flag: boolean) => {
   });
   auditorOptions.value = res.data.records;
 };
+
 let formDifer = {};
 const fileList = ref([]);
+
+// 上传附件
 const Onchange = async (option: any) => {
-  // 发送请求给后端
   const FormDatas = new FormData();
   FormDatas.append('file', option.fileItem.file);
   const res = await ticketStore.uploadFileTicket(FormDatas);
   if (res.status === 200) {
     Message.success({
-      content: t('上传成功'),
+      content: t('upload.sucess'),
       duration: 3 * 1000,
     });
     res.data.name = res.data.fileName;
@@ -271,35 +316,44 @@ const Onchange = async (option: any) => {
     formData.value.attachId = res.data.id;
   } else {
     Message.error({
-      content: t('上传失败'),
+      content: t('upload.fail'),
       duration: 3 * 1000,
     });
   }
 };
 
+// 删除附件
 const removeAttact = () => {
   fileList.value.pop();
 };
 
+// 组件被点击时
 const handleClick = () => {
+  getRoleId();
   const ticketId = props.prem?.id;
+  // 获取需要修改的数据
   if (ticketId) {
     ticketStore
       .getDetail(ticketId)
       .then(async (res) => {
+        // 票据数据
         formData.value = res.data.bill;
+        // 审核数据
         auditData.value = res.data.audit;
 
+        // 附件内容
         if (formData.value.attachId) {
           const data = await ticketStore.getAttachment(formData.value.attachId);
           data.data.name = data.data.fileName;
           fileList.value.push(data.data);
         }
+        // 审核员信息
         const auditInfo = await userStore.getUserDetail(
           auditData.value.auditorId
         );
         formData.value.deptId = auditInfo.data.deptId;
         formData.value.auditorId = auditData.value.auditorId;
+
         formDifer = { ...res.data.bill };
       })
       .then(() => {
@@ -323,26 +377,30 @@ const diffDataForm = (newData: any, oldData: any) => {
   return result;
 };
 
+// 提交
 const handleOk = async () => {
   const valid = await createEditRef.value?.validate();
   if (!valid) {
     formData.value.submit = true;
     formData.value.status = 'EXAMINE';
+    // 新增
     if (props.isCreate) {
       formData.value.userId = userStore.id;
       const res = await ticketStore.createTicket(formData.value);
       if (res.status === 200) {
         Message.success({
-          content: `添加成功`,
+          content: t('create.sucess'),
           duration: 5 * 1000,
         });
       }
     } else {
+      // 修改
       formDifer = diffDataForm(formData.value, formDifer);
 
+      // 判断是否有进行修改
       if (Object.keys(formDifer).length === 0) {
         Message.success({
-          content: `未作任何修改`,
+          content: t('unmodified'),
           duration: 3 * 1000,
         });
       } else {
@@ -351,7 +409,7 @@ const handleOk = async () => {
         const res = await ticketStore.updateTicket(formDifer);
         if (res.status === 200) {
           Message.success({
-            content: `提交成功`,
+            content: t('submit.sucess'),
             duration: 5 * 1000,
           });
         }
@@ -364,23 +422,27 @@ const handleOk = async () => {
   }
 };
 
+// 暂存
 const handleStorage = async () => {
   const valid = await createEditRef.value?.validate();
   if (!valid) {
     formData.value.submit = false;
+    // 新增
     if (props.isCreate) {
       const res = await ticketStore.createTicket(formData.value);
       if (res.status === 200) {
         Message.success({
-          content: '暂存成功',
+          content: t('storage.sucess'),
           duration: 5 * 1000,
         });
       }
     } else {
+      formData.value.status = 'SUBMIT';
+      // 修改
       formDifer = diffDataForm(formData.value, formDifer);
       if (Object.keys(formDifer).length === 0) {
         Message.success({
-          content: `未作任何修改`,
+          content: t('unmodified'),
           duration: 3 * 1000,
         });
       } else {
@@ -389,7 +451,7 @@ const handleStorage = async () => {
         const res = await ticketStore.updateTicket(formDifer);
         if (res.status === 200) {
           Message.success({
-            content: `修改成功`,
+            content: t('modify.sucess'),
             duration: 5 * 1000,
           });
         }
@@ -402,6 +464,7 @@ const handleStorage = async () => {
   }
 };
 
+// 关闭
 const handleCancel = async () => {
   removeAttact();
   createEditRef.value?.resetFields();

src/views/ticket/manage/components/ticket-edit.vue

@@ -26,49 +26,49 @@
   >
     <template #title>{{ modalTitle }}</template>
     <a-form ref="createEditRef" :model="formData" :style="{ width: '500px' }">
-      <a-form-item field="companyName" label="公司">
+      <a-form-item field="companyName" :label="$t('ticket.info.companyName')">
         <div>
           {{ formData.companyName }}
         </div>
       </a-form-item>
 
-      <a-form-item field="title" label="标题">
+      <a-form-item field="title" :label="$t('ticket.info.title')">
         <div>
           {{ formData.title }}
         </div>
       </a-form-item>
 
-      <a-form-item field="body" label="内容">
+      <a-form-item field="body" :label="$t('ticket.info.body')">
         <div>
           {{ formData.body }}
         </div>
       </a-form-item>
 
-      <a-form-item field="money" label="金额">
+      <a-form-item field="money" :label="$t('ticket.info.money')">
         <div>
           {{ formData.money }}
         </div>
       </a-form-item>
 
-      <a-form-item field="createTime" label="创建时间">
+      <a-form-item field="createTime" :label="$t('ticket.info.createTime')">
         <div>
           {{ dayjs(formData.createTime).format('YYYY-MM-DD') }}
         </div>
       </a-form-item>
 
-      <a-form-item field="contactEmail" label="联系邮箱">
+      <a-form-item field="contactEmail" :label="$t('ticket.info.contactEmail')">
         <div>
           {{ formData.contactEmail }}
         </div>
       </a-form-item>
 
-      <a-form-item field="type" label="票据类型">
+      <a-form-item field="type" :label="$t('ticket.info.type')">
         <div>
           {{ formData.type }}
         </div>
       </a-form-item>
 
-      <a-form-item field="attachment" label="附件">
+      <a-form-item field="attachment" :label="$t('ticket.info.attachment')">
         <a-upload
           :file-list="fileList"
           :custom-request="Onchange"
@@ -79,7 +79,7 @@
         />
       </a-form-item>
 
-      <a-form-item field="deptId" label="部门">
+      <a-form-item field="deptId" :label="$t('ticket.info.dept')">
         <a-tree-select
           v-model="formData.deptId"
           :field-names="{
@@ -93,7 +93,7 @@
         />
       </a-form-item>
 
-      <a-form-item field="auditorId" label="审核员">
+      <a-form-item field="auditorId" :label="$t('ticket.info.auditor')">
         <a-select v-model="formData.auditorId" disabled style="color: black">
           <div v-for="(item, id) in auditorOptions" :key="id">
             <a-option :value="item.id">{{ item.username }} </a-option>
@@ -101,7 +101,11 @@
         </a-select>
       </a-form-item>
 
-      <a-form-item field="status" label="审核状态" v-if="props.isDetail">
+      <a-form-item
+        field="status"
+        :label="$t('ticket.info.status')"
+        v-if="props.isDetail"
+      >
         <div>
           {{ formData.status }}
         </div>
@@ -110,19 +114,19 @@
       <a-form-item
         v-else
         field="status"
-        label="审核状态"
+        :label="$t('ticket.info.status')"
         :disabled="props.isDetail"
         :validate-trigger="['change', 'input']"
-        :rules="[{ required: true, message: '审核状态不能为空' }]"
+        :rules="[{ required: true, message: t('ticket.info.status.required') }]"
       >
         <a-select
           v-model="formData.status"
           :options="statusOptions"
-          :placeholder="$t('searchTable.form.status.placeholder')"
+          :placeholder="$t('ticket.info.status.placeholder')"
         />
       </a-form-item>
 
-      <a-form-item field="comment" label="审核意见">
+      <a-form-item field="comment" :label="$t('ticket.info.comment')">
         <a-textarea v-model="auditData.comment" v-if="!props.isDetail" />
         <div v-else>{{ auditData.comment }} </div>
       </a-form-item>
@@ -131,6 +135,7 @@
 </template>
 
 <script lang="ts" setup>
+import { useI18n } from 'vue-i18n';
 import useVisible from '@/hooks/visible';
 import { computed, PropType, ref } from 'vue';
 import { computedAsync } from '@vueuse/core';
@@ -148,11 +153,13 @@ const props = defineProps({
   },
   isDetail: Boolean,
 });
+
+const { t } = useI18n();
 const userStore = useUserStore();
 const ticketStore = useTicketStore();
 const roleStore = useRoleStore();
 const modalTitle = computed(() => {
-  return props.isDetail ? '详情' : '审核';
+  return props.isDetail ? t('detail') : t('audit');
 });
 const { visible, setVisible } = useVisible(false);
 const createEditRef = ref<FormInstance>();
@@ -182,6 +189,8 @@ const deptOptions = computedAsync(async () => {
 });
 
 let auiditRoleId = '';
+
+// 获取审核员ID
 const getRoleId = async () => {
   const res = await roleStore.getRoleList();
   res.data.forEach((item: any) => {
@@ -190,40 +199,43 @@ const getRoleId = async () => {
     }
   });
 };
-getRoleId();
 
 const auditorOptions = ref([]);
+
+// 根据部门ID查询该部门的审核员
 const optionDept = async () => {
   auditorOptions.value = [];
   const res = await userStore.getUserList({
     page: 1,
-    size: auiditRoleId,
+    size: 100,
-    roleId: '54',
+    roleId: auiditRoleId,
     deptId: formData.value.deptId,
   });
   auditorOptions.value = res.data.records;
 };
+
 const statusOptions = computed<SelectOptionData[]>(() => [
-  // {
-  //   label: '待审核',
-  //   value: 'EXAMINE',
-  // },
   {
-    label: '审核通过',
+    label: t('pass'),
     value: 'PASS',
   },
   {
-    label: '审核未通过',
+    label: t('failed'),
     value: 'FAILED',
   },
 ]);
+
 const fileList = ref([]);
+// 组件被点击时
 const handleClick = async () => {
+  getRoleId();
   const ticketId = props.prem?.id;
-  ticketStore
+  // 获取票据数据
-    .getDetail(ticketId)
+  const res = await ticketStore.getDetail(ticketId);
-    .then(async (res) => {
+  // 票据数据
   formData.value = res.data.bill;
+
+  // 将票据状态转化未反显的格式
   if (!props.isDetail) {
     if (formData.value.status === '审核通过') {
       formData.value.status = 'PASS';
@@ -231,31 +243,34 @@ const handleClick = async () => {
       formData.value.status = 'FAILED';
     }
   }
+  // 附件数据
   auditData.value = res.data.audit;
+
+  // 附件内容
   if (formData.value.attachId) {
     const data = await ticketStore.getAttachment(formData.value.attachId);
     data.data.name = data.data.fileName;
     fileList.value.push(data.data);
   }
-      const auditInfo = await userStore.getUserDetail(
+
-        auditData.value.auditorId
+  // 审核员信息
-      );
+  const auditInfo = await userStore.getUserDetail(auditData.value.auditorId);
   formData.value.deptId = auditInfo.data.deptId;
   formData.value.auditorId = auditData.value.auditorId;
-    })
-    .then(() => {
   optionDept().then(() => {
     setVisible(true);
   });
-    });
 };
 
+// 提交
 const handleSubmit = async () => {
   const valid = await createEditRef.value?.validate();
   if (!valid) {
+    // 详情
     if (props.isDetail) {
       createEditRef.value?.resetFields();
     } else {
+      // 审核
       auditData.value.result = formData.value.status;
       const res = await ticketStore.auditTicket(
         formData.value.id,
@@ -263,7 +278,7 @@ const handleSubmit = async () => {
       );
       if (res.status === 200) {
         Message.success({
-          content: `${modalTitle.value}成功`,
+          content: t('audit.sucess'),
           duration: 5 * 1000,
         });
       }
@@ -274,6 +289,7 @@ const handleSubmit = async () => {
   }
 };
 
+// 关闭
 const handleCancel = async () => {
   fileList.value.pop();
   createEditRef.value?.resetFields();

src/views/ticket/manage/index.vue

@@ -12,24 +12,35 @@
           >
             <a-row :gutter="16">
               <a-col :span="8">
-                <a-form-item field="companyName" label="公司">
+                <a-form-item
+                  field="companyName"
+                  :label="$t('searchTable.form.companyName')"
+                >
                   <a-input
                     v-model="formModel.companyName"
-                    placeholder="请输入公司名称"
+                    :placeholder="
+                      $t('searchTable.form.companyName.placeholder')
+                    "
                   />
                 </a-form-item>
               </a-col>
 
               <a-col :span="8">
-                <a-form-item field="title" label="标题">
+                <a-form-item
-                  <a-input v-model="formModel.title" placeholder="请输入标题" />
+                  field="title"
+                  :label="$t('searchTable.form.title')"
+                >
+                  <a-input
+                    v-model="formModel.title"
+                    :placeholder="$t('searchTable.form.title.placeholder')"
+                  />
                 </a-form-item>
               </a-col>
             </a-row>
 
             <a-row :gutter="16">
               <a-col :span="8">
-                <a-form-item field="type" label="类型">
+                <a-form-item field="type" :label="$t('searchTable.form.type')">
                   <a-select
                     v-model="formModel.type"
                     :options="typesOptions"
@@ -39,7 +50,10 @@
               </a-col>
 
               <a-col :span="8">
-                <a-form-item field="status" label="状态">
+                <a-form-item
+                  field="status"
+                  :label="$t('searchTable.form.status')"
+                >
                   <a-select
                     v-model="formModel.status"
                     :options="statusOptions"
@@ -206,13 +220,13 @@
           />
 
           <a-popconfirm
-            content="确认删除此部门?"
+            :content="t('Confirm the deletion of this ticket')"
             type="error"
             @ok="handleDelete(record)"
             v-if="userStore.permissions === 'admin'"
           >
             <a-button type="primary" size="small" status="danger">
-              删除
+              {{ $t('delete') }}
             </a-button>
           </a-popconfirm>
         </template>
@@ -300,34 +314,34 @@ const columns = computed<TableColumnData[]>(() => [
 
 const typesOptions = computed<SelectOptionData[]>(() => [
   {
-    label: '银行支票',
+    label: t('bank'),
     value: 'BANK',
   },
   {
-    label: '税务支票',
+    label: t('tax'),
     value: 'TAX',
   },
   {
-    label: '其他支票',
+    label: t('other'),
     value: 'OTHER',
   },
 ]);
 
 const statusOptions = computed<SelectOptionData[]>(() => [
   {
-    label: '待提交',
+    label: t('unsubmitted'),
     value: 'SUBMIT',
   },
   {
-    label: '待审核',
+    label: t('unreviewed'),
     value: 'EXAMINE',
   },
   {
-    label: '审核通过',
+    label: t('pass'),
     value: 'PASS',
   },
   {
-    label: '审核未通过',
+    label: t('failed'),
     value: 'FAILED',
   },
 ]);
@@ -358,6 +372,8 @@ const fetchData = async (params: {
   setLoading(true);
   try {
     let res = {};
+
+    // 根据用户角色，调用不同接口获取票据列表
     if (userStore.permissions === 'admin') {
       res = await ticketStore.getTicketList(params);
     } else if (userStore.permissions === 'auditor') {
@@ -366,6 +382,7 @@ const fetchData = async (params: {
       params.userId = userStore.id;
       res = await ticketStore.getTicketList(params);
     }
+
     renderData.value = res.data.records;
     pagination.page = params.page;
     pagination.current = params.current;
@@ -393,14 +410,20 @@ const reset = () => {
   formModel.value = generateFormModel();
 };
 
+// 删除票据
 const handleDelete = async (record) => {
   const res = await ticketStore.removeTicket(record.id);
   if (res.status === 200) {
     Message.success({
-      content: '删除成功',
+      content: t('delete.ticket.sucess'),
       duration: 5 * 1000,
     });
     search();
+  } else {
+    Message.error({
+      content: t('delete.role.fail'),
+      duration: 3 * 1000,
+    });
   }
 };
 

src/views/ticket/manage/locale/en-US.ts

@@ -1,4 +1,89 @@
 export default {
   'menu.ticket.manage': 'Ticket Manage',
   'menu.ticket.list': 'Ticket List',
+
+  
+  // columns
+  'ticketTable.columns.index': '#',
+  'ticketTable.columns.companyName': 'CompanyName',
+  'ticketTable.columns.title': 'Title',   
+  'ticketTable.columns.money': 'Money',
+  'ticketTable.columns.createTime': 'CreateTime',
+  'ticketTable.columns.status': 'Status',
+  'ticketTable.columns.type': 'Type',
+
+  'searchTable.form.companyName':'Company',
+  'searchTable.form.companyName.placeholder': 'Please enter Company',
+  'searchTable.form.title':'Title',
+  'searchTable.form.title.placeholder': 'Please enter Title',
+  'searchTable.form.type':'Type',
+  'searchTable.form.type.placeholder': 'Please select Type',
+  'searchTable.form.status': 'Status',
+  'searchTable.form.status.placeholder': 'Please select Status',
+
+  'Confirm the deletion of this ticket': 'Confirm the deletion of this ticket?',
+
+  'delete.ticket.sucess': 'Delete ticket sucess',
+  'delete.ticket.fail': 'Delete ticket fail',
+
+  'delete':'Delete',
+  'cancel': 'Cancel',
+  'storage':'Storage',
+  'submit': 'Submit',
+
+  'create': 'Create',
+  'edit': 'Edit',
+  'detail': 'Detail',
+  'audit': 'Audit',
+
+  'bank': 'BANK',
+  'tax': 'TAX',
+  'other': 'OTHER',
+  
+  'unsubmitted': 'Unsubmitted',
+  'unreviewed': 'Unreviewed',
+  'pass': 'Pass',
+  'failed': 'Failed',
+
+  "ticket.info.companyName": 'Company',
+  "ticket.info.companyName.required": 'CompanyName is required',
+  "ticket.info.companyName.placeholder": 'Please enter CompanyName',
+  "ticket.info.title": 'Title',
+  "ticket.info.title.required": 'Title is required',
+  "ticket.info.title.placeholder": 'Please enter Title',
+  "ticket.info.body": 'Content',
+  "ticket.info.body.required": 'Content is required',
+  "ticket.info.body.placeholder": 'Please enter Content',
+  "ticket.info.money": 'Money',
+  "ticket.info.money.required": 'Money is required',
+  "ticket.info.money.placeholder": 'Please enter Money',
+  "ticket.info.contactEmail": 'Email',
+  "ticket.info.createTime": 'CreateTime',
+  "ticket.info.contactEmail.required": 'contactEmail is required',
+  "ticket.info.contactEmail.placeholder": 'Please enter contactEmail',
+  "ticket.info.type": 'Type',
+  "ticket.info.type.required": 'Type is required',
+  "ticket.info.type.placeholder": 'Please select Type',
+  "ticket.info.attachment": 'Attachment',
+  "ticket.info.dept": 'Dept',
+  "ticket.info.dept.required": 'Dept is required',
+  "ticket.info.dept.placeholder": 'Please select Dept',
+  "ticket.info.auditor": 'Auditor',
+  "ticket.info.auditor.required": 'Auditor is required',
+  "ticket.info.auditor.placeholder": 'Please select Auditor',
+  "ticket.info.status": 'Status',
+  "ticket.info.status.required": 'Status is required',
+  "ticket.info.status.placeholder": 'Please select Status',
+  "ticket.info.comment": 'Comment',
+
+  'upload.sucess': 'Upload Sucess',
+  'upload.fail': 'Upload Fail',
+
+  'create.sucess': 'Create Sucess',
+  'create.fail': 'Create Fail',
+  'unmodified': 'Unmodified',
+  'submit.sucess': 'Submit Sucess',
+  'storage.sucess': 'Storage Sucess',
+  'modify.sucess': 'Modify Sucess',
+  'audit.sucess': 'Audit Aucess',
 };

src/views/ticket/manage/locale/zh-CN.ts

@@ -11,5 +11,78 @@ export default {
   'ticketTable.columns.status': '审核状态',
   'ticketTable.columns.type': '类型',
 
+  'searchTable.form.companyName':'公司',
+  'searchTable.form.companyName.placeholder': '请输入公司名称',
+  'searchTable.form.title':'标题',
+  'searchTable.form.title.placeholder': '请输入标题',
+  'searchTable.form.type':'类型',
   'searchTable.form.type.placeholder': '请选择票据类型',
+  'searchTable.form.status': '状态',
+  'searchTable.form.status.placeholder': '请选择状态',
+
+  'Confirm the deletion of this ticket': '确定删除此票据?',
+
+  'delete.ticket.sucess': '删除票据成功',
+  'delete.ticket.fail': '删除票据失败',
+
+  'delete':'删除',
+  'cancel': '取消',
+  'storage':'暂存',
+  'submit': '提交',
+
+  'create': '新增',
+  'edit': '修改',
+  'detail': '详情',
+  'audit': '审核',
+
+  'bank': '银行支票',
+  'tax': '税务支票',
+  'other': '其他支票',
+  
+  'unsubmitted': '待提交',
+  'unreviewed': '待审核',
+  'pass': '审核通过',
+  'failed': '审核未通过',
+
+  "ticket.info.companyName": '公司',
+  "ticket.info.companyName.required": '公司名称不能为空',
+  "ticket.info.companyName.placeholder": '请输入公司名称',
+  "ticket.info.title": '标题',
+  "ticket.info.title.required": '标题不能为空',
+  "ticket.info.title.placeholder": '请输入标题',
+  "ticket.info.body": '内容',
+  "ticket.info.body.required": '内容不能为空',
+  "ticket.info.body.placeholder": '请输入内容',
+  "ticket.info.money": '金额',
+  "ticket.info.money.required": '金额不能为空',
+  "ticket.info.money.placeholder": '请输入金额',
+  "ticket.info.contactEmail": '联系邮箱',
+  "ticket.info.createTime": '创建时间',
+  "ticket.info.contactEmail.required": '联系邮箱不能为空',
+  "ticket.info.contactEmail.placeholder": '请输入联系邮箱',
+  "ticket.info.type": '票据类型',
+  "ticket.info.type.required": '票据类型不能为空',
+  "ticket.info.type.placeholder": '请选择票据类型',
+  "ticket.info.attachment": '附件',
+  "ticket.info.dept": '部门',
+  "ticket.info.dept.required": '部门不能为空',
+  "ticket.info.dept.placeholder": '请选择提交的部门',
+  "ticket.info.auditor": '审核员',
+  "ticket.info.auditor.required": '审核员不能为空',
+  "ticket.info.auditor.placeholder": '请选择审核员',
+  "ticket.info.status": '审核状态',
+  "ticket.info.status.required": '审核状态不能为空',
+  "ticket.info.status.placeholder": '请选择审核状态',
+  "ticket.info.comment": '审核意见',
+
+  'upload.sucess': '上传成功',
+  'upload.fail': '上传失败',
+
+  'create.sucess': '添加成功',
+  'create.fail': '上传失败',
+  'unmodified': '未作任何修改',
+  'submit.sucess': '提交成功',
+  'storage.sucess': '暂存成功',
+  'modify.sucess': '修改成功',
+  'audit.sucess': '审核成功',
 };

src/views/user/setting/components/basic-information.vue

@@ -8,11 +8,11 @@
   >
     <a-form-item
       field="phone"
-      label="手机号码"
+      :label="$t('user.info.phone')"
       :rules="[
         {
           required: true,
-          message: '手机号码不能为空',
+          message: $t('userSetting.form.error.phone.required'),
         },
       ]"
     >
@@ -23,7 +23,7 @@
     </a-form-item>
     <a-form-item
       field="email"
-      label="邮箱"
+      :label="$t('user.info.email')"
       :rules="[
         {
           required: true,
@@ -39,7 +39,7 @@
     </a-form-item>
     <a-form-item
       field="nickName"
-      label="昵称"
+      :label="$t('user.info.nickName')"
       :rules="[
         {
           required: true,
@@ -54,7 +54,7 @@
     </a-form-item>
     <a-form-item
       field="address"
-      label="地址"
+      :label="$t('user.info.address')"
       :rules="[
         {
           maxLength: 200,

src/views/user/setting/components/password-reset.vue

@@ -13,7 +13,9 @@
     >
       <a-input-password
         v-model="formData.oldPassword"
-        placeholder="请输入原密码"
+        :placeholder="
+          $t('userSetting.passwordReset.form.label.oldPassword.placeholder')
+        "
         allow-clear
       >
       </a-input-password>
@@ -27,7 +29,9 @@
     >
       <a-input-password
         v-model="formData.password"
-        placeholder="请输入新密码"
+        :placeholder="
+          $t('userSetting.passwordReset.form.label.newPassword.placeholder')
+        "
         allow-clear
       >
       </a-input-password>
@@ -40,7 +44,9 @@
     >
       <a-input-password
         v-model="formData.confirmPassword"
-        placeholder="请确认新密码"
+        :placeholder="
+          $t('userSetting.passwordReset.form.label.confirmPassword.placeholder')
+        "
         allow-clear
       >
       </a-input-password>
@@ -87,7 +93,6 @@ const checkEquals = (
 
 const user = useUser();
 
-
 const validate = async () => {
   const vali = await formRef.value?.validate();
   if (!vali) {

src/views/user/setting/locale/en-US.ts

@@ -24,6 +24,7 @@ export default {
   'userSetting.label.registrationDate': 'Registration Date',
   'userSetting.tab.basicInformation': 'Basic Information',
   'userSetting.tab.securitySettings': 'Security Settings',
+  'userSetting.tab.passwordReset': 'Password Reset',
   'userSetting.tab.certification': 'Certification',
   'userSetting.basicInfo.form.label.email': 'Email',
   'userSetting.basicInfo.placeholder.email': `Please enter your email address, such as xxx{'@'}bytedance.com`,
@@ -46,6 +47,14 @@ export default {
     'Please enter your profile, no more than 200 words',
   'userSetting.form.error.profile.maxLength': 'No more than 200 words',
   'userSetting.passwordReset.form.label.oldPassword': 'Orinal Password',
+  'userSetting.passwordReset.form.label.oldPassword.placeholder': 'Please enter oldPassword',
+
+    'userSetting.passwordReset.form.label.newPassword': 'New Password',
+      'userSetting.passwordReset.form.label.newPassword.placeholder': 'Please enter newPassword',
+
+  'userSetting.passwordReset.form.label.confirmPassword': 'Confirm Password',
+    'userSetting.passwordReset.form.label.confirmPassword.placeholder': 'Please confirm the new password',
+
   'userSetting.SecuritySettings.form.label.password': 'Login Password',
   'userSetting.SecuritySettings.placeholder.password':
     'Has been set. The password must contain at least six letters, digits, and special characters except Spaces. The password must contain both uppercase and lowercase letters.',

src/views/user/setting/locale/zh-CN.ts

@@ -26,6 +26,7 @@ export default {
   'userSetting.tab.securitySettings': '安全设置',
   'userSetting.tab.passwordReset': '密码重置',
   'userSetting.tab.certification': '实名认证',
+  'userSetting.form.error.phone.required':'电话号码不能为空',
   'userSetting.basicInfo.form.label.email': '邮箱',
   'userSetting.basicInfo.placeholder.email': `请输入邮箱地址，如xxx{'@'}qq.com`,
   'userSetting.form.error.email.required': '请输入正确格式的邮箱地址',
@@ -34,8 +35,11 @@ export default {
     '请输入您的个人简介，最多不超过200字。',
   'userSetting.form.error.profile.maxLength': '最多不超过200字',
   'userSetting.passwordReset.form.label.oldPassword': '原密码',
+  'userSetting.passwordReset.form.label.oldPassword.placeholder': '请输入原密码',
   'userSetting.passwordReset.form.label.newPassword': '新密码',
+  'userSetting.passwordReset.form.label.newPassword.placeholder': '请输入新密码',
   'userSetting.passwordReset.form.label.confirmPassword': '确认新密码',
+  'userSetting.passwordReset.form.label.confirmPassword.placeholder': '请确认新密码',
   'userSetting.SecuritySettings.form.label.password': '登录密码',
   'userSetting.passwordReset.form.validate.blank': '密码不能未空',
   'userSetting.passwordReset.form.validate.noEquals': '两次输入不一致',