fix:话单管理界面中英适配
This commit is contained in:
@@ -757,7 +757,25 @@ const local: any = {
|
|||||||
pleemail:'Please enter email address',
|
pleemail:'Please enter email address',
|
||||||
search:'Search',
|
search:'Search',
|
||||||
reset:'Reset',
|
reset:'Reset',
|
||||||
|
},
|
||||||
|
cdr:{
|
||||||
|
hour:'hour',
|
||||||
|
min:',in',
|
||||||
|
sec:'s',
|
||||||
|
username:'User Name',
|
||||||
|
clientname:'Client Name',
|
||||||
|
clientmac:'Client MAC',
|
||||||
|
up:'Traffic Up',
|
||||||
|
down:'Traffic Down',
|
||||||
|
start:'Start Time',
|
||||||
|
end:'End Time',
|
||||||
|
duration:'Duration',
|
||||||
|
title:'CDR Records',
|
||||||
|
total:'Total',
|
||||||
|
pleusername:'Please enter username',
|
||||||
|
pleclientname:'Please enter device name',
|
||||||
|
search:'Search',
|
||||||
|
reset:'Reset',
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
form: {
|
form: {
|
||||||
|
|||||||
@@ -757,6 +757,25 @@ const local:any = {
|
|||||||
pleemail:'请输入邮箱',
|
pleemail:'请输入邮箱',
|
||||||
search:'搜索',
|
search:'搜索',
|
||||||
reset:'重置',
|
reset:'重置',
|
||||||
|
},
|
||||||
|
cdr:{
|
||||||
|
hour:'时',
|
||||||
|
min:'分',
|
||||||
|
sec:'秒',
|
||||||
|
username:'用户名',
|
||||||
|
clientname:'设备名',
|
||||||
|
clientmac:'设备MAC地址',
|
||||||
|
up:'上行流量',
|
||||||
|
down:'下行流量',
|
||||||
|
start:'开始时间',
|
||||||
|
end:'结束时间',
|
||||||
|
duration:'时长',
|
||||||
|
title:'话单记录',
|
||||||
|
total:'共',
|
||||||
|
pleusername:'请输入用户名',
|
||||||
|
pleclientname:'请输入设备名',
|
||||||
|
search:'搜索',
|
||||||
|
reset:'重置',
|
||||||
|
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
|||||||
@@ -6,6 +6,9 @@ import { computed, shallowRef } from 'vue';
|
|||||||
import { useElementSize } from '@vueuse/core';
|
import { useElementSize } from '@vueuse/core';
|
||||||
import { fetchCdrHistory } from '@/service/api/auth';
|
import { fetchCdrHistory } from '@/service/api/auth';
|
||||||
import { formatStorage } from '@/utils/units';
|
import { formatStorage } from '@/utils/units';
|
||||||
|
import { useI18n } from 'vue-i18n';
|
||||||
|
const { t } = useI18n();
|
||||||
|
|
||||||
|
|
||||||
// 搜索模型
|
// 搜索模型
|
||||||
type SearchModel = {
|
type SearchModel = {
|
||||||
@@ -22,9 +25,9 @@ const formatDuration = (seconds: number) => {
|
|||||||
const remainingSeconds = seconds % 60;
|
const remainingSeconds = seconds % 60;
|
||||||
|
|
||||||
const parts = [];
|
const parts = [];
|
||||||
if (hours > 0) parts.push(`${hours}时`);
|
if (hours > 0) parts.push(`${hours}${t('page.cdr.hour')}`);
|
||||||
if (minutes > 0) parts.push(`${minutes}分`);
|
if (minutes > 0) parts.push(`${minutes}${t('page.cdr.min')}`);
|
||||||
parts.push(`${remainingSeconds}秒`);
|
parts.push(`${remainingSeconds}${t('page.cdr.sec')}`);
|
||||||
|
|
||||||
return parts.join('');
|
return parts.join('');
|
||||||
};
|
};
|
||||||
@@ -75,28 +78,28 @@ const { columns, columnChecks, data, loading, getData, mobilePagination, searchP
|
|||||||
{
|
{
|
||||||
key: 'userName',
|
key: 'userName',
|
||||||
dataIndex: 'userName',
|
dataIndex: 'userName',
|
||||||
title: '用户名',
|
title: t('page.cdr.username'),
|
||||||
align: 'center',
|
align: 'center',
|
||||||
width: 150
|
width: 150
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
key: 'clientName',
|
key: 'clientName',
|
||||||
dataIndex: 'clientName',
|
dataIndex: 'clientName',
|
||||||
title: '设备名',
|
title: t('page.cdr.clientname'),
|
||||||
align: 'center',
|
align: 'center',
|
||||||
width: 120
|
width: 120
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
key: 'clientMac',
|
key: 'clientMac',
|
||||||
dataIndex: 'clientMac',
|
dataIndex: 'clientMac',
|
||||||
title: '设备MAC地址',
|
title: t('page.cdr.clientmac'),
|
||||||
align: 'center',
|
align: 'center',
|
||||||
width: 120
|
width: 120
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
key: 'trafficUp',
|
key: 'trafficUp',
|
||||||
dataIndex: 'trafficUp',
|
dataIndex: 'trafficUp',
|
||||||
title: '上行流量',
|
title: t('page.cdr.up'),
|
||||||
align: 'center',
|
align: 'center',
|
||||||
width: 120,
|
width: 120,
|
||||||
customRender: ({ text }) => {
|
customRender: ({ text }) => {
|
||||||
@@ -107,7 +110,7 @@ const { columns, columnChecks, data, loading, getData, mobilePagination, searchP
|
|||||||
{
|
{
|
||||||
key: 'trafficDown',
|
key: 'trafficDown',
|
||||||
dataIndex: 'trafficDown',
|
dataIndex: 'trafficDown',
|
||||||
title: '下行流量',
|
title: t('page.cdr.down'),
|
||||||
align: 'center',
|
align: 'center',
|
||||||
width: 120,
|
width: 120,
|
||||||
customRender: ({ text }) => {
|
customRender: ({ text }) => {
|
||||||
@@ -118,7 +121,7 @@ const { columns, columnChecks, data, loading, getData, mobilePagination, searchP
|
|||||||
{
|
{
|
||||||
key: 'startTime',
|
key: 'startTime',
|
||||||
dataIndex: 'startTime',
|
dataIndex: 'startTime',
|
||||||
title: '开始时间',
|
title: t('page.cdr.start'),
|
||||||
align: 'center',
|
align: 'center',
|
||||||
width: 180,
|
width: 180,
|
||||||
customRender: ({ text }) => {
|
customRender: ({ text }) => {
|
||||||
@@ -129,7 +132,7 @@ const { columns, columnChecks, data, loading, getData, mobilePagination, searchP
|
|||||||
{
|
{
|
||||||
key: 'endTime',
|
key: 'endTime',
|
||||||
dataIndex: 'endTime',
|
dataIndex: 'endTime',
|
||||||
title: '结束时间',
|
title: t('page.cdr.end'),
|
||||||
align: 'center',
|
align: 'center',
|
||||||
width: 180,
|
width: 180,
|
||||||
customRender: ({ text }) => {
|
customRender: ({ text }) => {
|
||||||
@@ -140,7 +143,7 @@ const { columns, columnChecks, data, loading, getData, mobilePagination, searchP
|
|||||||
{
|
{
|
||||||
key: 'duration',
|
key: 'duration',
|
||||||
dataIndex: 'duration',
|
dataIndex: 'duration',
|
||||||
title: '时长',
|
title: t('page.cdr.duration'),
|
||||||
align: 'center',
|
align: 'center',
|
||||||
width: 120,
|
width: 120,
|
||||||
customRender: ({ text }) => formatDuration(text)
|
customRender: ({ text }) => formatDuration(text)
|
||||||
@@ -158,7 +161,7 @@ const { columns, columnChecks, data, loading, getData, mobilePagination, searchP
|
|||||||
@search="getData"
|
@search="getData"
|
||||||
/>
|
/>
|
||||||
<ACard
|
<ACard
|
||||||
title="话单记录"
|
:title="t('page.cdr.title')"
|
||||||
:bordered="false"
|
:bordered="false"
|
||||||
:body-style="{ flex: 1, overflow: 'hidden' }"
|
:body-style="{ flex: 1, overflow: 'hidden' }"
|
||||||
class="flex-col-stretch sm:flex-1-hidden card-wrapper"
|
class="flex-col-stretch sm:flex-1-hidden card-wrapper"
|
||||||
@@ -184,7 +187,7 @@ const { columns, columnChecks, data, loading, getData, mobilePagination, searchP
|
|||||||
total: mobilePagination.total,
|
total: mobilePagination.total,
|
||||||
current: searchParams.pageNum,
|
current: searchParams.pageNum,
|
||||||
pageSize: searchParams.pageSize,
|
pageSize: searchParams.pageSize,
|
||||||
showTotal: (total: number) => `共 ${total} 条`
|
showTotal: (total: number) => `${t('page.cdr.total')} ${total} `
|
||||||
}"
|
}"
|
||||||
:scroll="scrollConfig"
|
:scroll="scrollConfig"
|
||||||
class="h-full"
|
class="h-full"
|
||||||
|
|||||||
@@ -2,6 +2,8 @@
|
|||||||
import { ref, computed } from 'vue';
|
import { ref, computed } from 'vue';
|
||||||
import { Form } from 'ant-design-vue';
|
import { Form } from 'ant-design-vue';
|
||||||
import type { FormInstance } from 'ant-design-vue';
|
import type { FormInstance } from 'ant-design-vue';
|
||||||
|
import { useI18n } from 'vue-i18n';
|
||||||
|
const { t } = useI18n();
|
||||||
|
|
||||||
interface SearchModel {
|
interface SearchModel {
|
||||||
pageNum: number;
|
pageNum: number;
|
||||||
@@ -53,24 +55,30 @@ function handleSearch() {
|
|||||||
layout="inline"
|
layout="inline"
|
||||||
class="flex flex-wrap gap-16px items-center"
|
class="flex flex-wrap gap-16px items-center"
|
||||||
>
|
>
|
||||||
<AFormItem label="用户名">
|
<AFormItem :label="t('page.cdr.username')">
|
||||||
<AInput
|
<AInput
|
||||||
v-model:value="formModel.userName"
|
v-model:value="formModel.userName"
|
||||||
placeholder="请输入用户名"
|
:placeholder="t('page.cdr.pleusername')"
|
||||||
allow-clear
|
allow-clear
|
||||||
/>
|
/>
|
||||||
</AFormItem>
|
</AFormItem>
|
||||||
<AFormItem label="设备名">
|
<AFormItem :label="t('page.cdr.clientname')">
|
||||||
<AInput
|
<AInput
|
||||||
v-model:value="formModel.clientName"
|
v-model:value="formModel.clientName"
|
||||||
placeholder="请输入设备名"
|
:placeholder="t('page.cdr.pleclientname')"
|
||||||
allow-clear
|
allow-clear
|
||||||
/>
|
/>
|
||||||
</AFormItem>
|
</AFormItem>
|
||||||
<AFormItem class="flex-1 justify-end">
|
<AFormItem class="flex-1 justify-end">
|
||||||
<ASpace>
|
<ASpace>
|
||||||
<AButton @click="handleReset">重置</AButton>
|
<AButton type="primary" @click="handleSearch">
|
||||||
<AButton type="primary" @click="handleSearch">查询</AButton>
|
<template #icon>
|
||||||
|
<icon-mdi-search />
|
||||||
|
</template>{{ t('page.cdr.search') }}</AButton>
|
||||||
|
<AButton @click="handleReset"><template #icon>
|
||||||
|
<icon-mdi-refresh />
|
||||||
|
</template>
|
||||||
|
{{ t('page.cdr.reset') }}</AButton>
|
||||||
</ASpace>
|
</ASpace>
|
||||||
</AFormItem>
|
</AFormItem>
|
||||||
</AForm>
|
</AForm>
|
||||||
|
|||||||
Reference in New Issue
Block a user