提交结构修改

src/api/ticket.ts

@@ -0,0 +1,37 @@
+// import axios from 'axios';
+
+// export interface ListRecord {
+//   id: undefined;
+//   username: string;
+//   phone: string;
+//   email: string;
+//   enable: string;
+//   nickname: string;
+//   avater: string;
+//   address: string;
+// }
+
+// // 更新用户
+// export function update(data: ListRecord) {
+//   return axios.patch(`/api/rest/user/${data.id}`, data);
+// }
+
+// // 删除用户
+// export function remove(id: string) {
+//   return axios.delete(`/api/rest/role/${id}`);
+// }
+
+// // 模糊查询用户列表
+// export function queryRoles(params?: ListParams<Partial<ListRecord>>) {
+//   return queryList(`/api/rest/user/query`, params);
+// }
+
+// // 添加用户
+// export function addUser(params: ListRecord) {
+//   return axios.post('/api/rest/user/register', params);
+// }
+
+// // 是否启用
+// export function enabled(id: string) {
+//   return axios.patch(`/api/rest/user/${id}/toggle`);
+// }

src/locale/en-US.ts

@@ -28,10 +28,12 @@ import localeUserSetting from '@/views/user/setting/locale/en-US';
 
 import systemUser from '@/views/system/user/locale/en-US';
 
-import localCustomer from '@/views/customer/manage/locale/en-US';
+import localCustomer from '@/views/systemManage/user/locale/en-US';
 
-import localRole from '@/views/role/manage/locale/en-US';
-import localRegion from '@/views/role/region/locale/en-US';
+import localRole from '@/views/systemManage/role/locale/en-US';
+import localRegion from '@/views/systemManage/region/locale/en-US';
+
+import localTicket from '@/views/ticket/manage/locale/en-US';
 
 import localeSettings from './en-US/settings';
 
@@ -51,6 +53,8 @@ export default {
   'menu.faq': 'FAQ',
   'menu.system': 'System',
   'menu.role': 'Role',
+  'menu.customer': 'Customer',
+  'menu.ticket': 'Ticket',
   'navbar.docs': 'Docs',
   'navbar.action.locale': 'Switch to English',
   ...localeSettings,
@@ -76,5 +80,6 @@ export default {
   ...localCustomer,
   ...localRole,
   ...localRegion,
+  ...localTicket,
   ...systemUser,
 };

src/locale/zh-CN.ts

@@ -28,10 +28,12 @@ import localeUserSetting from '@/views/user/setting/locale/zh-CN';
 
 import systemUser from '@/views/system/user/locale/zh-CN';
 
-import localCustomer from '@/views/customer/manage/locale/zh-CN';
+import localCustomer from '@/views/systemManage/user/locale/zh-CN';
 
-import localRole from '@/views/role/manage/locale/zh-CN';
-import localRegion from '@/views/role/region/locale/zh-CN';
+import localRole from '@/views/systemManage/role/locale/zh-CN';
+import localRegion from '@/views/systemManage/region/locale/zh-CN';
+
+import localTicket from '@/views/ticket/manage/locale/zh-CN';
 
 import localeSettings from './zh-CN/settings';
 
@@ -52,6 +54,7 @@ export default {
   'menu.system': '系统管理',
   'menu.role': '角色中心',
   'menu.customer': '用户中心',
+  'menu.ticket': '票据中心',
   'navbar.docs': '文档中心',
   'navbar.action.locale': '切换为中文',
   ...localeSettings,
@@ -77,5 +80,6 @@ export default {
   ...localCustomer,
   ...localRole,
   ...localRegion,
+  ...localTicket,
   ...systemUser,
 };

src/router/routes/modules/customer.ts

@@ -25,4 +25,4 @@ const CUSTOMER: AppRouteRecordRaw = {
   ],
 };
 
-export default CUSTOMER;
+// export default CUSTOMER;

src/router/routes/modules/role.ts

@@ -35,4 +35,4 @@ const ROLE: AppRouteRecordRaw = {
   ],
 };
 
-export default ROLE;
+// export default ROLE;

src/router/routes/modules/systemManage.ts

@@ -0,0 +1,48 @@
+import { DEFAULT_LAYOUT } from '../base';
+import { AppRouteRecordRaw } from '../types';
+
+const STSTEMMANAGE: AppRouteRecordRaw = {
+  path: '/systemManage',
+  name: 'systemManage',
+  component: DEFAULT_LAYOUT,
+  meta: {
+    locale: 'menu.system',
+    icon: 'icon-computer',
+    requiresAuth: true,
+    order: 4,
+  },
+  children: [
+    {
+      path: 'user',
+      name: 'UserManage',
+      component: () => import('@/views/systemManage/user/index.vue'),
+      meta: {
+        locale: 'menu.system.user',
+        requiresAuth: true,
+        permissions: ['*'],
+      },
+    },
+    {
+      path: 'role',
+      name: 'RoleManage',
+      component: () => import('@/views/systemManage/role/index.vue'),
+      meta: {
+        locale: 'menu.system.role',
+        requiresAuth: true,
+        permissions: ['*'],
+      },
+    },
+    {
+      path: 'region',
+      name: 'RgioneManage',
+      component: () => import('@/views/systemManage/region/index.vue'),
+      meta: {
+        locale: 'menu.system.region',
+        requiresAuth: true,
+        permissions: ['*'],
+      },
+    },
+  ],
+};
+
+export default STSTEMMANAGE;

src/router/routes/modules/ticket.ts

@@ -0,0 +1,28 @@
+import { DEFAULT_LAYOUT } from '../base';
+import { AppRouteRecordRaw } from '../types';
+
+const TICKET: AppRouteRecordRaw = {
+  path: '/ticket',
+  name: 'ticket',
+  component: DEFAULT_LAYOUT,
+  meta: {
+    locale: 'menu.ticket',
+    icon: 'icon-folder-add',
+    requiresAuth: true,
+    order: 4,
+  },
+  children: [
+    {
+      path: 'manage',
+      name: 'TicketManage',
+      component: () => import('@/views/ticket/manage/index.vue'),
+      meta: {
+        locale: 'menu.ticket.manage',
+        requiresAuth: true,
+        permissions: ['*'],
+      },
+    },
+  ],
+};
+
+export default TICKET;

src/views/customer/manage/index.vue

@@ -307,6 +307,8 @@ const handleClick = (record: any, type: string) => {
     formDifer = record;
     formDate.value = { ...record };
     dialogTitle.value = '修改用户信息';
+  } else {
+    dialogTitle.value = '添加用户';
   }
   visible.value = true;
 };
@@ -365,7 +367,7 @@ const handleOk = async (done: any) => {
       // you can report use errorHandler or other
     } finally {
       formDate.value = form();
-      dialogTitle.value = '添加用户';
+      // dialogTitle.value = '添加用户';
       search();
     }
   }
@@ -402,9 +404,9 @@ const handleDelete = async () => {
 
 // 关闭弹窗
 const handleCancel = () => {
-  formDate.value = form();
   visible.value = false;
-  dialogTitle.value = '添加用户';
+  formDate.value = form();
+  // dialogTitle.value = '添加用户';
 };
 
 // 映射到formModel
@@ -428,7 +430,7 @@ const onPageChange = (current: number) => {
 
 // 调用接口请求数据
 const fetchData = async (params: { page: 1; size: 10 }) => {
-  setLoading(true);
+  // setLoading(true);
   try {
     const { data } = await customerStore.getUserInfo(params);
     renderData.value = data.list;
@@ -437,7 +439,7 @@ const fetchData = async (params: { page: 1; size: 10 }) => {
   } catch (err) {
     // you can report use errorHandler or other
   } finally {
-    setLoading(false);
+    // setLoading(false);
   }
 };
 

src/views/role/manage/index.vue

@@ -154,7 +154,7 @@ const formDate = ref(form());
 
 // 调用接口请求数据
 const fetchData = async () => {
-  setLoading(true);
+  // setLoading(true);
   try {
     const { data } = await roleStore.getRoleList();
     renderData.value = data;
@@ -191,7 +191,18 @@ const handleDelete = async () => {
 
 // 是否启用
 const enabledStatus = async (record: string) => {
-  await roleStore.enabledStatus(record.id);
+  const res = await roleStore.enabledStatus(record.id);
+  if (res.status === 200) {
+    Message.success({
+      content: t('modify.status.sucess'),
+      duration: 3 * 1000,
+    });
+  } else {
+    Message.error({
+      content: t('modify.status.fail'),
+      duration: 3 * 1000,
+    });
+  }
   fetchData();
 };
 
@@ -202,6 +213,8 @@ const handleClick = (record: any, type: string) => {
     formDifer = record;
     formDate.value = { ...record };
     dialogTitle.value = '修改角色信息';
+  } else {
+    dialogTitle.value = '添加角色';
   }
   visible.value = true;
 };
@@ -256,7 +269,6 @@ const validate = async () => {
       // you can report use errorHandler or other
     } finally {
       formDate.value = form();
-      dialogTitle.value = '添加角色';
       fetchData();
     }
   }
@@ -264,9 +276,8 @@ const validate = async () => {
 
 // 关闭弹窗
 const handleCancel = () => {
-  formDate.value = form();
   visible.value = false;
-  dialogTitle.value = '添加角色';
+  formDate.value = form();
 };
 
 // 表格头部

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

@@ -30,4 +30,7 @@ export default {
 
   'from.ok': '确认',
   'from.cancel': '取消',
+
+  'modify.status.sucess': '修改状态成功',
+  'modify.status.fail': '修改状态失败',
 };

src/views/role/region/index.vue

@@ -202,6 +202,8 @@ const handleClick = (record: any, type: string) => {
     messageType.value = 'modify';
     formDate.value = { ...record };
     dialogTitle.value = '修改区域信息';
+  } else {
+    dialogTitle.value = '添加区域';
   }
   visible.value = true;
 };
@@ -243,7 +245,6 @@ const handleOk = async (done: any) => {
       // you can report use errorHandler or other
     } finally {
       formDate.value = form();
-      dialogTitle.value = '添加区域';
       search();
     }
   }
@@ -252,6 +253,17 @@ const handleOk = async (done: any) => {
 // 是否启用
 const enabledStatus = async (record: string) => {
   const res = await regionStore.enabledStatus(record.id);
+  if (res.status === 200) {
+    Message.success({
+      content: t('modify.status.sucess'),
+      duration: 3 * 1000,
+    });
+  } else {
+    Message.error({
+      content: t('modify.status.fail'),
+      duration: 3 * 1000,
+    });
+  }
   search();
 };
 
@@ -280,9 +292,8 @@ const handleDelete = async () => {
 
 // 关闭弹窗
 const handleCancel = () => {
-  formDate.value = form();
   visible.value = false;
-  dialogTitle.value = '添加区域';
+  formDate.value = form();
 };
 
 // 映射到formModel
@@ -290,7 +301,7 @@ const formModel = ref(generateFormModel());
 
 // 调用接口请求数据
 const fetchData = async (params: any) => {
-  setLoading(true);
+  // setLoading(true);
   try {
     const { data } = await regionStore.getRegionList(params);
     renderData.value = data;

src/views/systemManage/region/index.vue

@@ -0,0 +1,389 @@
+<template>
+  <div class="container">
+    <Breadcrumb :items="['menu.role', 'menu.system.region']" />
+
+    <a-card class="general-card" :title="$t('menu.region.list')">
+      <a-row>
+        <a-col :flex="1">
+          <a-form
+            :model="formModel"
+            :label-col-props="{ span: 6 }"
+            :wrapper-col-props="{ span: 18 }"
+            label-align="left"
+          >
+            <a-row :gutter="16">
+              <a-col :span="9">
+                <a-form-item
+                  field="username"
+                  :label="$t('searchTable.form.regionName')"
+                >
+                  <a-input
+                    v-model="formModel.name"
+                    :placeholder="$t('searchTable.form.regionName.placeholder')"
+                  />
+                </a-form-item>
+              </a-col>
+            </a-row>
+          </a-form>
+        </a-col>
+        <a-divider style="height: 84px" direction="vertical" />
+
+        <!-- 更新和重置按钮 -->
+        <a-col :flex="'86px'" style="text-align: right">
+          <a-space direction="vertical" :size="18">
+            <a-button type="primary" @click="search">
+              <template #icon>
+                <icon-search />
+              </template>
+              {{ $t('searchTable.form.search') }}
+            </a-button>
+            <a-button @click="reset">
+              <template #icon>
+                <icon-refresh />
+              </template>
+              {{ $t('searchTable.form.reset') }}
+            </a-button>
+          </a-space>
+        </a-col>
+      </a-row>
+
+      <a-divider style="margin-top: 0" />
+      <a-row :gutter="10">
+        <a-col :span="9">
+          <a-button
+            type="primary"
+            @click="handleClick"
+            style="margin-right: 16px"
+          >
+            <template #icon>
+              <icon-plus />
+            </template>
+            {{ $t('searchTable.operation.create') }}
+          </a-button>
+
+          <a-button type="primary" status="danger" @click="handleDelete">
+            <template #icon>
+              <icon-close />
+            </template>
+            {{ $t('searchTable.operation.delete') }}
+          </a-button>
+        </a-col>
+      </a-row>
+
+      <a-divider style="margin-top: 16px" />
+
+      <a-table
+        row-key="id"
+        :loading="loading"
+        :pagination="false"
+        :columns="(cloneColumns as TableColumnData[])"
+        :data="renderData"
+        :bordered="false"
+        :size="size"
+        :row-selection="true"
+        @select="selectRow"
+      >
+        <template #index="{ rowIndex }">
+          {{ rowIndex + 1 }}
+        </template>
+        <template #createTime="{ record }">
+          {{ dayjs(record.createTime).format('YYYY-MM-DD') }}
+        </template>
+        <template #enabled="{ record }">
+          <a-switch
+            :model-value="record.enabled"
+            :checked-value="true"
+            :unchecked-value="false"
+            @change="enabledStatus(record)"
+          />
+        </template>
+        <template #operations="{ record }">
+          <a-button
+            type="text"
+            size="small"
+            @click="handleClick(record, 'modify')"
+          >
+            {{ $t('searchTable.columns.operations.detail') }}
+          </a-button>
+        </template>
+      </a-table>
+
+      <a-modal
+        v-model:visible="visible"
+        :title="dialogTitle"
+        :mask-closable="false"
+        :footer="false"
+        @cancel="handleCancel"
+        @before-ok="handleBeforeOk"
+      >
+        <a-form :model="formDate">
+          <a-form-item
+            field="name"
+            :label="$t('add.region.info.name')"
+            :rules="[
+              {
+                required: true,
+                message: '区域名不能为空',
+              },
+            ]"
+            :validate-trigger="['change', 'input']"
+          >
+            <a-input
+              v-model="formDate.name"
+              :placeholder="$t('add.region.info.name.placeholder')"
+            />
+          </a-form-item>
+
+          <a-form-item field="remark" :label="$t('add.region.info.remark')">
+            <a-input
+              v-model="formDate.remark"
+              :placeholder="$t('add.region.info.remark.placeholder')"
+              :required="required"
+            />
+          </a-form-item>
+          <a-form-item>
+            <a-space style="margin-top: 10px">
+              <a-button html-type="submit" type="primary" @click="handleOk"
+                >提交</a-button
+              >
+              <a-button @click="handleCancel">取消</a-button>
+            </a-space>
+          </a-form-item>
+        </a-form>
+      </a-modal>
+    </a-card>
+  </div>
+</template>
+<script lang="ts" setup>
+import { ref, computed, reactive, watch } from 'vue';
+import { useI18n } from 'vue-i18n';
+import type { SelectOptionData } from '@arco-design/web-vue/es/select/interface';
+import type { TableColumnData } from '@arco-design/web-vue/es/table/interface';
+import { useRegionStore } from '@/store';
+import { ListParams } from '@/api/list';
+import { Pagination } from '@/types/global';
+import { ListRecord } from '@/api/customer';
+import { Message } from '@arco-design/web-vue';
+import useLoading from '@/hooks/loading';
+import dayjs from 'dayjs';
+
+type SizeProps = 'mini' | 'small' | 'medium' | 'large';
+type Column = TableColumnData & { checked?: true };
+
+// 搜索的条件数据
+const generateFormModel = () => {
+  return {
+    name: '',
+  };
+};
+
+const { t } = useI18n();
+const { loading, setLoading } = useLoading();
+const regionStore = useRegionStore();
+const renderData = ref<ListRecord[]>([]);
+const cloneColumns = ref<Column[]>([]);
+const showColumns = ref<Column[]>([]);
+const size = ref<SizeProps>('medium');
+const seleteRowList = ref();
+const visible = ref(false);
+const messageType = ref();
+const dialogTitle = ref('添加区域');
+const form = () => {
+  return {
+    name: '',
+    remark: '',
+  };
+};
+
+const formDate = ref(form());
+// 打开弹窗
+const handleClick = (record: any, type: string) => {
+  if (type === 'modify') {
+    messageType.value = 'modify';
+    formDate.value = { ...record };
+    dialogTitle.value = '修改区域信息';
+  } else {
+    dialogTitle.value = '添加区域';
+  }
+  visible.value = true;
+};
+
+// 提交
+const handleOk = async (done: any) => {
+  if (formDate.value.name !== '') {
+    try {
+      if (dialogTitle.value === '修改区域信息') {
+        const res = await regionStore.updateRegion(formDate.value);
+        if (res.status === 200) {
+          visible.value = false;
+          Message.success({
+            content: t('modify.user.info.sucess'),
+            duration: 3 * 1000,
+          });
+        } else {
+          Message.error({
+            content: t('modify.user.info.fail'),
+            duration: 3 * 1000,
+          });
+        }
+      } else {
+        const res = await regionStore.addRegion(formDate.value);
+        if (res.status === 200) {
+          visible.value = false;
+          Message.success({
+            content: t('add.user.info.sucess'),
+            duration: 3 * 1000,
+          });
+        } else {
+          Message.error({
+            content: t('add.user.info.fail'),
+            duration: 3 * 1000,
+          });
+        }
+      }
+    } catch (err) {
+      // you can report use errorHandler or other
+    } finally {
+      formDate.value = form();
+      search();
+    }
+  }
+};
+
+// 是否启用
+const enabledStatus = async (record: string) => {
+  const res = await regionStore.enabledStatus(record.id);
+  if (res.status === 200) {
+    Message.success({
+      content: t('modify.status.sucess'),
+      duration: 3 * 1000,
+    });
+  } else {
+    Message.error({
+      content: t('modify.status.fail'),
+      duration: 3 * 1000,
+    });
+  }
+  search();
+};
+
+// 选择
+const selectRow = (rowKeys: string[]) => {
+  seleteRowList.value = rowKeys[rowKeys.length - 1];
+};
+
+// 删除
+const handleDelete = async () => {
+  const res = await regionStore.deleteRegion(seleteRowList.value);
+  if (res.status === 200) {
+    search();
+    Message.success({
+      content: t('delete.region.sucess'),
+      duration: 3 * 1000,
+    });
+    seleteRowList.value = '';
+  } else {
+    Message.error({
+      content: t('delete.region.fail'),
+      duration: 3 * 1000,
+    });
+  }
+};
+
+// 关闭弹窗
+const handleCancel = () => {
+  visible.value = false;
+  formDate.value = form();
+};
+
+// 映射到formModel
+const formModel = ref(generateFormModel());
+
+// 调用接口请求数据
+const fetchData = async (params: any) => {
+  // setLoading(true);
+  try {
+    const { data } = await regionStore.getRegionList(params);
+    renderData.value = data;
+  } catch (err) {
+    // you can report use errorHandler or other
+  } finally {
+    setLoading(false);
+  }
+};
+
+// 查询
+const search = () => {
+  fetchData({
+    ...formModel.value,
+  } as unknown as any);
+};
+
+search();
+
+// 重置
+const reset = () => {
+  formModel.value = generateFormModel();
+};
+
+// 表格
+const columns = computed<TableColumnData[]>(() => [
+  {
+    title: t('searchTable.columns.regionIndex'),
+    dataIndex: 'index',
+    slotName: 'index',
+  },
+  {
+    title: t('searchTable.columns.regionName'),
+    dataIndex: 'name',
+  },
+  {
+    title: t('searchTable.columns.id'),
+    dataIndex: 'id',
+  },
+  {
+    title: t('searchTable.columns.remark'),
+    dataIndex: 'remark',
+  },
+  {
+    title: t('searchTable.columns.createTime'),
+    dataIndex: 'createTime',
+    slotName: 'createTime',
+  },
+  {
+    title: t('searchTable.columns.enabled'),
+    dataIndex: 'enabled',
+    slotName: 'enabled',
+  },
+  {
+    title: t('searchTable.columns.operations'),
+    dataIndex: 'operations',
+    slotName: 'operations',
+  },
+]);
+
+// 将表格数据可视化
+watch(
+  () => columns.value,
+  (val) => {
+    cloneColumns.value = val;
+    cloneColumns.value.forEach((item, index) => {
+      item.checked = true;
+    });
+    showColumns.value = cloneColumns.value;
+  },
+  { deep: true, immediate: true }
+);
+</script>
+
+<script lang="ts">
+export default {
+  name: 'RegionManage',
+};
+</script>
+
+<style scoped lang="less">
+.container {
+  padding: 0 20px 20px 20px;
+}
+</style>

src/views/systemManage/region/locale/en-US.ts

@@ -0,0 +1,3 @@
+export default {
+  'menu.role.region': 'Region',
+};

src/views/systemManage/region/locale/zh-CN.ts

@@ -0,0 +1,22 @@
+export default {
+  'menu.system.region': '区域管理',
+  'menu.region.list': '区域列表',
+  'searchTable.form.regionName': '区域名称',
+  'searchTable.form.regionName.placeholder': '请输入区域名称',
+
+  'searchTable.columns.regionIndex': '序号',
+  'searchTable.columns.regionName': '区域名称',
+  'searchTable.columns.id': '区域ID',
+  'searchTable.columns.remark': '备注',
+  'searchTable.columns.createTime': '创建时间',
+  'searchTable.columns.operations': '操作',
+  'searchTable.columns.operations.detail': '详细',
+
+  'delete.region.sucess': '删除区域成功',
+  'delete.region.fail': '删除区域失败',
+
+  'add.region.info.name': '区域名称',
+  'add.region.info.name.placeholder': '请输入区域名称',
+  'add.region.info.remark': '备注',
+  'add.region.info.remark.placeholder': '请输入备注',
+};

src/views/systemManage/role/index.vue

@@ -0,0 +1,349 @@
+<template>
+  <div class="container">
+    <Breadcrumb :items="['menu.role', 'menu.role.manage']" />
+
+    <a-card class="general-card" :title="$t('menu.role.list')">
+      <a-row :gutter="10">
+        <a-col :span="9">
+          <a-button
+            type="primary"
+            @click="handleClick"
+            style="margin-right: 16px"
+          >
+            <template #icon>
+              <icon-plus />
+            </template>
+            {{ $t('roleTable.operation.create') }}
+          </a-button>
+
+          <a-button type="primary" status="danger" @click="handleDelete">
+            <template #icon>
+              <icon-close />
+            </template>
+            {{ $t('roleTable.operation.delete') }}
+          </a-button>
+        </a-col>
+      </a-row>
+
+      <a-divider style="margin-top: 16px" />
+
+      <a-table
+        row-key="id"
+        :loading="loading"
+        :pagination="false"
+        :columns="(cloneColumns as TableColumnData[])"
+        :data="renderData"
+        :bordered="false"
+        :size="size"
+        :row-selection="true"
+        @select="selectRow"
+      >
+        <template #index="{ rowIndex }">
+          {{ rowIndex + 1 }}
+        </template>
+        <template #createTime="{ record }">
+          {{ dayjs(record.createTime).format('YYYY-MM-DD') }}
+        </template>
+        <template #enabled="{ record }">
+          <a-switch
+            :model-value="record.enabled"
+            :checked-value="true"
+            :unchecked-value="false"
+            @change="enabledStatus(record)"
+          />
+        </template>
+        <template #operations="{ record }">
+          <a-button
+            type="text"
+            size="small"
+            @click="handleClick(record, 'modify')"
+          >
+            {{ $t('roleTable.columns.operations.detail') }}
+          </a-button>
+        </template>
+      </a-table>
+
+      <a-modal
+        v-model:visible="visible"
+        :title="dialogTitle"
+        :mask-closable="false"
+        :footer="false"
+        @cancel="handleCancel"
+      >
+        <a-form :model="formDate">
+          <a-form-item
+            field="name"
+            :label="$t('add.role.info.name')"
+            :rules="[{ required: true, message: 'name is required' }]"
+            :validate-trigger="['change', 'input']"
+          >
+            <a-input
+              v-model="formDate.name"
+              :placeholder="$t('add.role.info.name.placeholder')"
+            />
+          </a-form-item>
+
+          <a-form-item field="remark" :label="$t('add.role.info.remark')">
+            <a-input
+              v-model="formDate.remark"
+              :placeholder="$t('add.role.info.remark.placeholder')"
+            />
+          </a-form-item>
+
+          <a-form-item
+            field="authorities"
+            :label="$t('add.role.info.authorities')"
+          >
+            <a-select
+              v-model="formDate.authorities"
+              :placeholder="$t('add.role.info.authorities.placeholder')"
+            >
+              <a-option value="user">user</a-option>
+              <a-option value="auditor">auditor</a-option>
+              <a-option value="admin">admin</a-option>
+            </a-select>
+          </a-form-item>
+          <a-form-item>
+            <a-space style="margin-top: 10px">
+              <a-button html-type="submit" type="primary" @click="validate"
+                >提交</a-button
+              >
+              <a-button @click="handleCancel">取消</a-button>
+            </a-space>
+          </a-form-item>
+        </a-form>
+      </a-modal>
+    </a-card>
+  </div>
+</template>
+
+<script lang="ts" setup>
+import { ref, computed, watch } from 'vue';
+import { useI18n } from 'vue-i18n';
+import { RoleList } from '@/api/role';
+import type { TableColumnData } from '@arco-design/web-vue/es/table/interface';
+import { Message } from '@arco-design/web-vue';
+import { useRoleStore } from '@/store';
+import useLoading from '@/hooks/loading';
+import dayjs from 'dayjs';
+
+type SizeProps = 'mini' | 'small' | 'medium' | 'large';
+type Column = TableColumnData & { checked?: true };
+
+const { t } = useI18n();
+const { loading, setLoading } = useLoading();
+const size = ref<SizeProps>('medium');
+const roleStore = useRoleStore();
+const renderData = ref<RoleList[]>([]);
+const cloneColumns = ref<Column[]>([]);
+const showColumns = ref<Column[]>([]);
+const seleteRowList = ref();
+const visible = ref(false);
+const dialogTitle = ref('添加角色');
+const messageType = ref();
+let formDifer = {};
+const form = () => {
+  return {
+    name: '',
+    remark: '',
+    authorities: [],
+  };
+};
+
+const formDate = ref(form());
+
+// 调用接口请求数据
+const fetchData = async () => {
+  // setLoading(true);
+  try {
+    const { data } = await roleStore.getRoleList();
+    renderData.value = data;
+  } catch (err) {
+    // you can report use errorHandler or other
+  } finally {
+    setLoading(false);
+  }
+};
+fetchData();
+
+// 选择
+const selectRow = (rowKeys: string) => {
+  seleteRowList.value = rowKeys[rowKeys.length - 1];
+};
+
+// 删除
+const handleDelete = async () => {
+  const res = await roleStore.deleteRole(seleteRowList.value);
+  seleteRowList.value = [];
+  if (res.status === 200) {
+    fetchData();
+    Message.success({
+      content: t('delete.role.sucess'),
+      duration: 3 * 1000,
+    });
+  } else {
+    Message.error({
+      content: t('delete.role.fail'),
+      duration: 3 * 1000,
+    });
+  }
+};
+
+// 是否启用
+const enabledStatus = async (record: string) => {
+  const res = await roleStore.enabledStatus(record.id);
+  if (res.status === 200) {
+    Message.success({
+      content: t('modify.status.sucess'),
+      duration: 3 * 1000,
+    });
+  } else {
+    Message.error({
+      content: t('modify.status.fail'),
+      duration: 3 * 1000,
+    });
+  }
+  fetchData();
+};
+
+// 打开弹窗
+const handleClick = (record: any, type: string) => {
+  if (type === 'modify') {
+    messageType.value = 'modify';
+    formDifer = record;
+    formDate.value = { ...record };
+    dialogTitle.value = '修改角色信息';
+  } else {
+    dialogTitle.value = '添加角色';
+  }
+  visible.value = true;
+};
+
+// 做出只修改的部分
+const diffDataForm = (newData: any, oldData: any) => {
+  const result = {}; // 报错修改的字段内容
+  Object.keys(oldData).forEach((key) => {
+    if (oldData[key] !== newData[key] || key === 'id') {
+      result[key] = newData[key];
+    }
+  });
+  return result;
+};
+
+// 提交
+const validate = async () => {
+  if (formDate.value.name !== '') {
+    try {
+      formDifer = diffDataForm(formDate.value, formDifer);
+
+      if (dialogTitle.value === '修改角色信息') {
+        const res = await roleStore.updateRole(formDifer);
+        if (res.status === 200) {
+          visible.value = false;
+          Message.success({
+            content: t('modify.role.info.sucess'),
+            duration: 3 * 1000,
+          });
+        } else {
+          Message.error({
+            content: t('modify.role.info.fail'),
+            duration: 3 * 1000,
+          });
+        }
+      } else {
+        const res = await roleStore.addRole(formDate.value);
+        if (res.status === 200) {
+          visible.value = false;
+          Message.success({
+            content: t('add.role.info.sucess'),
+            duration: 3 * 1000,
+          });
+        } else {
+          Message.error({
+            content: t('add.role.info.fail'),
+            duration: 3 * 1000,
+          });
+        }
+      }
+    } catch (err) {
+      // you can report use errorHandler or other
+    } finally {
+      formDate.value = form();
+      fetchData();
+    }
+  }
+};
+
+// 关闭弹窗
+const handleCancel = () => {
+  visible.value = false;
+  formDate.value = form();
+};
+
+// 表格头部
+const columns = computed<TableColumnData[]>(() => [
+  {
+    title: t('roleTable.columns.index'),
+    dataIndex: 'index',
+    slotName: 'index',
+  },
+  {
+    title: t('roleTable.columns.name'),
+    dataIndex: 'name',
+  },
+  {
+    title: t('roleTable.columns.remark'),
+    dataIndex: 'remark',
+  },
+  {
+    title: t('roleTable.columns.authorities'),
+    dataIndex: 'authorities',
+  },
+  {
+    title: t('roleTable.columns.createTime'),
+    dataIndex: 'createTime',
+    slotName: 'createTime',
+  },
+  // {
+  //   title: t('roleTable.columns.updateTime'),
+  //   dataIndex: 'updateTime',
+  //   slotName: 'updateTime',
+  // },
+  {
+    title: t('roleTable.columns.enabled'),
+    dataIndex: 'enabled',
+    slotName: 'enabled',
+  },
+
+  {
+    title: t('roleTable.columns.operations'),
+    dataIndex: 'operations',
+    slotName: 'operations',
+  },
+]);
+
+// 将表格数据可视化
+watch(
+  () => columns.value,
+  (val) => {
+    cloneColumns.value = val;
+    cloneColumns.value.forEach((item, index) => {
+      item.checked = true;
+    });
+    showColumns.value = cloneColumns.value;
+  },
+  { deep: true, immediate: true }
+);
+</script>
+
+<script lang='ts'>
+export default {
+  name: 'RoleManage',
+};
+</script>
+
+<style scoped lang="less">
+.container {
+  padding: 0 20px 20px 20px;
+}
+</style>

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

@@ -0,0 +1,6 @@
+export default {
+  'menu.role.manage': 'Role Manage',
+  'menu.role.list': 'Role List',
+  'searchTable.operation.create': 'Create',
+  'searchTable.operation.delete': 'Delete',
+};

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

@@ -0,0 +1,36 @@
+export default {
+  'menu.role.manage': '角色管理',
+  'menu.role.list': '角色列表',
+  'roleTable.operation.create': '添加',
+  'roleTable.operation.delete': '删除',
+  'roleTable.columns.index': '序号',
+  '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': '角色身份',
+  'add.role.info.name.placeholder': '请输入角色身份',
+  'add.role.info.remark': '备注',
+  'add.role.info.remark.placeholder': '请输入备注',
+  'add.role.info.authorities': '管理权限',
+  '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': '修改状态成功',
+  'modify.status.fail': '修改状态失败',
+};

src/views/systemManage/user/index.vue

@@ -0,0 +1,535 @@
+<template>
+  <div class="container">
+    <Breadcrumb :items="['menu.customer', 'menu.customer.manage']" />
+
+    <a-card class="general-card" :title="$t('menu.list.searchTable')">
+      <a-row>
+        <a-col :flex="1">
+          <a-form
+            :model="formModel"
+            :label-col-props="{ span: 6 }"
+            :wrapper-col-props="{ span: 18 }"
+            label-align="left"
+          >
+            <a-row :gutter="16">
+              <a-col :span="7">
+                <a-form-item
+                  field="username"
+                  :label="$t('searchTable.form.username')"
+                >
+                  <a-input
+                    v-model="formModel.username"
+                    :placeholder="$t('searchTable.form.username.placeholder')"
+                  />
+                </a-form-item>
+              </a-col>
+
+              <a-col :span="9">
+                <a-form-item
+                  field="phone"
+                  :label="$t('searchTable.form.phone')"
+                >
+                  <a-input
+                    v-model="formModel.phone"
+                    :placeholder="$t('searchTable.form.phone.placeholder')"
+                  />
+                </a-form-item>
+              </a-col>
+
+              <a-col :span="8">
+                <a-form-item
+                  field="email"
+                  :label="$t('searchTable.form.email')"
+                >
+                  <a-input
+                    v-model="formModel.email"
+                    :placeholder="$t('searchTable.form.email.placeholder')"
+                  />
+                </a-form-item>
+              </a-col>
+
+              <!-- <a-col :span="9">
+                <a-form-item field="role" :label="$t('searchTable.form.role')">
+                  <a-select
+                    v-model="formModel.role"
+                    :options="roleOptions"
+                    :placeholder="$t('searchTable.form.role.placeholder')"
+                  />
+                </a-form-item>
+              </a-col> -->
+            </a-row>
+          </a-form>
+        </a-col>
+        <a-divider style="height: 84px" direction="vertical" />
+
+        <!-- 更新和重置按钮 -->
+        <a-col :flex="'86px'" style="text-align: right">
+          <a-space direction="vertical" :size="18">
+            <a-button type="primary" @click="search">
+              <template #icon>
+                <icon-search />
+              </template>
+              {{ $t('searchTable.form.search') }}
+            </a-button>
+            <a-button @click="reset">
+              <template #icon>
+                <icon-refresh />
+              </template>
+              {{ $t('searchTable.form.reset') }}
+            </a-button>
+          </a-space>
+        </a-col>
+      </a-row>
+
+      <a-divider style="margin-top: 0" />
+      <a-row :gutter="10">
+        <a-col :span="9">
+          <a-button
+            type="primary"
+            @click="handleClick"
+            style="margin-right: 16px"
+          >
+            <template #icon>
+              <icon-plus />
+            </template>
+            {{ $t('searchTable.operation.create') }}
+          </a-button>
+
+          <!-- <a-button type="primary" status="danger" @click="handleDelete">
+            <template #icon>
+              <icon-close />
+            </template>
+            {{ $t('searchTable.operation.delete') }}
+          </a-button> -->
+        </a-col>
+      </a-row>
+
+      <a-divider style="margin-top: 16px" />
+      <a-table
+        row-key="id"
+        :loading="loading"
+        :pagination="false"
+        :columns="(cloneColumns as TableColumnData[])"
+        :data="renderData"
+        :bordered="false"
+        :size="size"
+        :row-selection="true"
+        @select="selectRow"
+      >
+        <template #index="{ rowIndex }">
+          {{ rowIndex + 1 + (pagination.page - 1) * pagination.size }}
+        </template>
+        <template #enabled="{ record }">
+          <a-switch
+            :model-value="record.enabled"
+            :checked-value="true"
+            :unchecked-value="false"
+            @change="enabledStatus(record)"
+          />
+        </template>
+        <template #operations="{ record }">
+          <a-button
+            type="text"
+            size="small"
+            @click="handleClick(record, 'modify')"
+          >
+            {{ $t('searchTable.columns.operations.detail') }}
+          </a-button>
+        </template>
+      </a-table>
+      <a-space direction="vertical" size="large" style="margin-top: 16px">
+        <a-pagination
+          show-total
+          :current="pagination.page"
+          @change="onPageChange"
+          :page-size="pagination.pageSize"
+          :total="pagination.total"
+        />
+      </a-space>
+
+      <a-modal
+        v-model:visible="visible"
+        :title="dialogTitle"
+        :mask-closable="false"
+        :footer="false"
+        @cancel="handleCancel"
+        @before-ok="handleBeforeOk"
+      >
+        <a-form :model="formDate">
+          <a-form-item
+            field="username"
+            :label="$t('add.user.info.username')"
+            :rules="[
+              {
+                required: true,
+                message: '用户名不能为空',
+              },
+            ]"
+            :validate-trigger="['change', 'input']"
+          >
+            <a-input
+              v-model="formDate.username"
+              :placeholder="$t('add.user.info.username.placeholder')"
+            />
+          </a-form-item>
+          <a-form-item
+            field="password"
+            :label="$t('add.user.info.password')"
+            :rules="[
+              {
+                required: true,
+                message: '密码不能为空',
+              },
+            ]"
+            :validate-trigger="['change', 'input']"
+          >
+            <a-input-password
+              v-model="formDate.password"
+              :placeholder="$t('add.user.info.password.placeholder')"
+            />
+          </a-form-item>
+          <a-form-item
+            field="phone"
+            :label="$t('add.user.info.phone')"
+            :rules="[
+              {
+                required: true,
+                message: '手机号码不能为空',
+              },
+              {
+                length: 11,
+                message: '请输入正确手机号码',
+              },
+            ]"
+            :validate-trigger="['change', 'input']"
+          >
+            <a-input
+              v-model="formDate.phone"
+              :placeholder="$t('add.user.info.phone.placeholder')"
+            />
+          </a-form-item>
+          <a-form-item field="email" :label="$t('add.user.info.email')">
+            <a-input
+              v-model="formDate.email"
+              :placeholder="$t('add.user.info.email.placeholder')"
+            />
+          </a-form-item>
+          <a-form-item field="nickName" :label="$t('add.user.info.nickName')">
+            <a-input
+              v-model="formDate.nickName"
+              :placeholder="$t('add.user.info.nickName.placeholder')"
+            />
+          </a-form-item>
+          <a-form-item field="address" :label="$t('add.user.info.address')">
+            <a-input
+              v-model="formDate.address"
+              :placeholder="$t('add.user.info.address.placeholder')"
+            />
+          </a-form-item>
+          <a-form-item field="dept" :label="$t('add.user.info.dept')">
+            <a-select
+              v-model="formDate.dept"
+              :placeholder="$t('add.user.info.dept.placeholder')"
+            >
+              <a-option value="user">user</a-option>
+              <a-option value="auditor">auditor</a-option>
+              <a-option value="admin">admin</a-option>
+            </a-select>
+          </a-form-item>
+          <a-form-item>
+            <a-space style="margin-top: 10px">
+              <a-button html-type="submit" type="primary" @click="handleOk"
+                >提交
+              </a-button>
+              <a-button @click="handleCancel">取消</a-button>
+            </a-space>
+          </a-form-item>
+        </a-form>
+      </a-modal>
+    </a-card>
+  </div>
+</template>
+<script lang="ts" setup>
+import { ref, computed, reactive, watch } from 'vue';
+import { useI18n } from 'vue-i18n';
+import type { SelectOptionData } from '@arco-design/web-vue/es/select/interface';
+import type { TableColumnData } from '@arco-design/web-vue/es/table/interface';
+import { useCustomerStore } from '@/store';
+import { ListParams } from '@/api/list';
+import { Pagination } from '@/types/global';
+import { ListRecord } from '@/api/customer';
+import { Message } from '@arco-design/web-vue';
+import useLoading from '@/hooks/loading';
+
+type SizeProps = 'mini' | 'small' | 'medium' | 'large';
+type Column = TableColumnData & { checked?: true };
+
+// 搜索的条件数据
+const generateFormModel = () => {
+  return {
+    username: '',
+    phone: '',
+    email: '',
+    role: '',
+  };
+};
+
+const { t } = useI18n();
+const { loading, setLoading } = useLoading();
+const customerStore = useCustomerStore();
+const renderData = ref<ListRecord[]>([]);
+const cloneColumns = ref<Column[]>([]);
+const showColumns = ref<Column[]>([]);
+const size = ref<SizeProps>('medium');
+const seleteRowList = ref();
+const visible = ref(false);
+const messageType = ref();
+let formDifer = {};
+const dialogTitle = ref('添加用户');
+const form = () => {
+  return {
+    id: '',
+    username: '',
+    password: '',
+    phone: '',
+    email: '',
+    nickName: '',
+    address: '',
+    dept: '',
+  };
+};
+
+const formDate = ref(form());
+// 打开弹窗
+const handleClick = (record: any, type: string) => {
+  if (type === 'modify') {
+    messageType.value = 'modify';
+    formDifer = record;
+    formDate.value = { ...record };
+    dialogTitle.value = '修改用户信息';
+  } else {
+    dialogTitle.value = '添加用户';
+  }
+  visible.value = true;
+};
+
+// 做出只修改的部分
+const diffDataForm = (newData: any, oldData: any) => {
+  const result = {}; // 报错修改的字段内容
+  Object.keys(oldData).forEach((key) => {
+    if (oldData[key] !== newData[key] || key === 'id') {
+      result[key] = newData[key];
+    }
+  });
+  return result;
+};
+
+// 提交
+const handleOk = async (done: any) => {
+  if (
+    formDate.value.username !== '' &&
+    formDate.value.password !== '' &&
+    formDate.value.phone !== ''
+  ) {
+    try {
+      formDifer = diffDataForm(formDate.value, formDifer);
+
+      if (dialogTitle.value === '修改用户信息') {
+        const res = await customerStore.updateUser(formDifer);
+        if (res.status === 200) {
+          visible.value = false;
+          Message.success({
+            content: t('modify.user.info.sucess'),
+            duration: 3 * 1000,
+          });
+        } else {
+          Message.error({
+            content: t('modify.user.info.fail'),
+            duration: 3 * 1000,
+          });
+        }
+      } else {
+        const res = await customerStore.addUser(formDate.value);
+        if (res.status === 200) {
+          visible.value = false;
+          Message.success({
+            content: t('add.user.info.sucess'),
+            duration: 3 * 1000,
+          });
+        } else {
+          Message.error({
+            content: t('add.user.info.fail'),
+            duration: 3 * 1000,
+          });
+        }
+      }
+    } catch (err) {
+      // you can report use errorHandler or other
+    } finally {
+      formDate.value = form();
+      // dialogTitle.value = '添加用户';
+      search();
+    }
+  }
+};
+
+// 是否启用
+const enabledStatus = async (record: string) => {
+  const res = await customerStore.enabledStatus(record.id);
+  search();
+};
+
+// 选择
+const selectRow = (rowKeys: string[]) => {
+  seleteRowList.value = rowKeys[rowKeys.length - 1];
+};
+
+// 删除
+const handleDelete = async () => {
+  const res = await customerStore.deleteUser(seleteRowList.value);
+  seleteRowList.value = [];
+  if (res.status === 200) {
+    search();
+    Message.success({
+      content: t('delete.user.sucess'),
+      duration: 3 * 1000,
+    });
+  } else {
+    Message.error({
+      content: t('delete.user.fail'),
+      duration: 3 * 1000,
+    });
+  }
+};
+
+// 关闭弹窗
+const handleCancel = () => {
+  visible.value = false;
+  formDate.value = form();
+  // dialogTitle.value = '添加用户';
+};
+
+// 映射到formModel
+const formModel = ref(generateFormModel());
+
+// 基础分页查询的信息
+const basePagination: Pagination = {
+  page: 1,
+  size: 10,
+};
+
+const pagination = reactive({
+  ...basePagination,
+});
+
+//
+const onPageChange = (current: number) => {
+  const page = current;
+  fetchData({ ...basePagination, page });
+};
+
+// 调用接口请求数据
+const fetchData = async (params: { page: 1; size: 10 }) => {
+  // setLoading(true);
+  try {
+    const { data } = await customerStore.getUserInfo(params);
+    renderData.value = data.list;
+    pagination.page = params.page;
+    pagination.total = data.total;
+  } catch (err) {
+    // you can report use errorHandler or other
+  } finally {
+    // setLoading(false);
+  }
+};
+
+// 查询
+const search = () => {
+  fetchData({
+    ...basePagination,
+    ...formModel.value,
+  } as unknown as any);
+};
+
+search();
+
+// 重置
+const reset = () => {
+  formModel.value = generateFormModel();
+};
+
+// 表格
+const columns = computed<TableColumnData[]>(() => [
+  {
+    title: t('searchTable.columns.index'),
+    dataIndex: 'index',
+    slotName: 'index',
+  },
+  {
+    title: t('searchTable.columns.username'),
+    dataIndex: 'username',
+  },
+  {
+    title: t('searchTable.columns.phone'),
+    dataIndex: 'phone',
+  },
+  {
+    title: t('searchTable.columns.email'),
+    dataIndex: 'email',
+  },
+  {
+    title: t('searchTable.columns.nickName'),
+    dataIndex: 'nickName',
+  },
+  {
+    title: t('searchTable.columns.address'),
+    dataIndex: 'address',
+  },
+  {
+    title: t('searchTable.columns.enabled'),
+    dataIndex: 'enabled',
+    slotName: 'enabled',
+  },
+  {
+    title: t('searchTable.columns.operations'),
+    dataIndex: 'operations',
+    slotName: 'operations',
+  },
+]);
+
+// 将表格数据可视化
+watch(
+  () => columns.value,
+  (val) => {
+    cloneColumns.value = val;
+    cloneColumns.value.forEach((item, index) => {
+      item.checked = true;
+    });
+    showColumns.value = cloneColumns.value;
+  },
+  { deep: true, immediate: true }
+);
+// 用户身份
+const roleOptions = computed<SelectOptionData[]>(() => [
+  {
+    label: t('searchTable.form.role.user'),
+    vlaue: 'user',
+  },
+  {
+    label: t('searchTable.form.role.auditor'),
+    vlaue: 'auditor',
+  },
+]);
+</script>
+
+<script lang="ts">
+export default {
+  name: 'UserManage',
+};
+</script>
+
+<style scoped lang="less">
+.container {
+  padding: 0 20px 20px 20px;
+}
+</style>

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

@@ -0,0 +1,45 @@
+export default {
+  'menu.list.searchTable': 'Search Table',
+  'menu.role.manage': 'Role Manage',
+  'searchTable.form.number': 'Set Number',
+  'searchTable.form.number.placeholder': 'Please enter Set Number',
+  'searchTable.form.name': 'Set Name',
+  'searchTable.form.name.placeholder': 'Please enter Set Name',
+  'searchTable.form.contentType': 'Content Type',
+  'searchTable.form.contentType.img': 'image-text',
+  '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.offline': 'Offline',
+  'searchTable.form.search': 'Search',
+  'searchTable.form.reset': 'Reset',
+  'searchTable.form.selectDefault': 'All',
+  'searchTable.operation.create': 'Create',
+  'searchTable.operation.import': 'Import',
+  'searchTable.operation.download': 'Download',
+  // columns
+  'searchTable.columns.index': '#',
+  'searchTable.columns.number': 'Set Number',
+  'searchTable.columns.name': 'Set Name',
+  'searchTable.columns.contentType': 'Content Type',
+  'searchTable.columns.filterType': 'Filter Type',
+  'searchTable.columns.count': 'Count',
+  'searchTable.columns.createdTime': 'CreatedTime',
+  'searchTable.columns.status': 'Status',
+  'searchTable.columns.operations': 'Operations',
+  'searchTable.columns.operations.view': 'View',
+  // size
+  'searchTable.size.mini': 'mini',
+  'searchTable.size.small': 'small',
+  'searchTable.size.medium': 'middle',
+  'searchTable.size.large': 'large',
+  // actions
+  'searchTable.actions.refresh': 'refresh',
+  'searchTable.actions.density': 'density',
+  'searchTable.actions.columnSetting': 'columnSetting',
+};

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

@@ -0,0 +1,48 @@
+export default {
+  'menu.list.searchTable': '查询表格',
+  'menu.customer.manage': '用户管理',
+  'roleManage.username': '用户名',
+  'searchTable.form.username': '用户名',
+  'searchTable.form.username.placeholder': '请输入用户名',
+  'searchTable.form.phone': '电话号码',
+  'searchTable.form.phone.placeholder': '请输入电话号码',
+  'searchTable.form.role': '角色',
+  'searchTable.form.role.placeholder': '请选择角色',
+  'searchTable.form.role.user': '普通用户',
+  'searchTable.form.email': 'Email',
+  'searchTable.form.email.placeholder': '请输入Email',
+  'searchTable.form.role.auditor': '审核员',
+  'searchTable.form.search': '查询',
+  'searchTable.form.reset': '重置',
+  'searchTable.columns.nickName': '昵称',
+  'searchTable.columns.username': '用户名',
+  'searchTable.columns.phone': '电话',
+  'searchTable.columns.email': 'Email',
+  'searchTable.columns.enabled': '是否启用',
+  'searchTable.columns.avater': '头像',
+  'searchTable.columns.address': '地址',
+  'searchTable.columns.operations.detail': '详细',
+  'searchTable.operation.create': '添加',
+  'searchTable.operation.delete': '删除',
+  'add.user.info': '添加用户',
+  'add.user.info.username': '用户名',
+  'add.user.info.username.placeholder': '请输入用户名',
+  'add.user.info.password': '密码',
+  'add.user.info.password.placeholder': '请输入密码',
+  'add.user.info.phone': '电话号码',
+  'add.user.info.phone.placeholder': '请输入电话号码',
+  'add.user.info.email': 'Email',
+  'add.user.info.email.placeholder': '请输入Email',
+  'add.user.info.nickName': '昵称',
+  'add.user.info.nickName.placeholder': '请输入昵称',
+  'add.user.info.address': '地址',
+  'add.user.info.address.placeholder': '请输入地址',
+  'add.user.info.dept': '角色',
+  'add.user.info.dept.placeholder': '请选择角色',
+  'add.user.info.sucess': '添加成功',
+  'add.user.info.fail': '添加失败',
+  'modify.user.info.sucess': '修改成功',
+  'modify.user.info.fail': '修改失败',
+  'delete.user.sucess': '删除用户成功',
+  'delete.user.fail': '删除用户失败',
+};

src/views/ticket/manage/index.vue

@@ -0,0 +1,10 @@
+<template> 1234567890 </template>
+
+<script lang='ts'>
+export default {
+  name: 'TicketManage',
+};
+</script>
+
+<style>
+</style>

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

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

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

@@ -0,0 +1,4 @@
+export default {
+  'menu.ticket.manage': '票据管理',
+  'menu.ticket.list': '票据列表',
+};