fix:计费规则界面中英适配
This commit is contained in:
@@ -809,6 +809,26 @@ const local: any = {
|
|||||||
plestatus:'Please select status.',
|
plestatus:'Please select status.',
|
||||||
search:'Search',
|
search:'Search',
|
||||||
reset:'Reset',
|
reset:'Reset',
|
||||||
|
},
|
||||||
|
rule:{
|
||||||
|
title:'Configure Billing Rules',
|
||||||
|
edit:'Edit',
|
||||||
|
traffic:'Traffic',
|
||||||
|
pletraffic:'Please enter flow rate',
|
||||||
|
price:'Price',
|
||||||
|
pleprice:'Please enter price',
|
||||||
|
unit:'Unit',
|
||||||
|
pleunit:'Please select unit',
|
||||||
|
status:'Status',
|
||||||
|
close:'Cancel',
|
||||||
|
confirm:'Confirm',
|
||||||
|
modaltitle:'Edit rule',
|
||||||
|
use:'Enable',
|
||||||
|
unuse:'Not enabled',
|
||||||
|
action:'Operate',
|
||||||
|
geterr:'Failed to get the billing rule',
|
||||||
|
updatesuc:'Update successful',
|
||||||
|
updateerr:'Update failed'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
form: {
|
form: {
|
||||||
|
|||||||
@@ -809,6 +809,26 @@ const local:any = {
|
|||||||
plestatus:'请选择状态',
|
plestatus:'请选择状态',
|
||||||
search:'查询',
|
search:'查询',
|
||||||
reset:'重置',
|
reset:'重置',
|
||||||
|
},
|
||||||
|
rule:{
|
||||||
|
title:'计费规则配置',
|
||||||
|
edit:'编辑',
|
||||||
|
traffic:'流量',
|
||||||
|
pletraffic:'请输入流量大小',
|
||||||
|
price:'价格',
|
||||||
|
pleprice:'请输入价格',
|
||||||
|
unit:'单位',
|
||||||
|
pleunit:'请选择单位',
|
||||||
|
status:'状态',
|
||||||
|
close:'取消',
|
||||||
|
confirm:'确定',
|
||||||
|
modaltitle:'编辑规则',
|
||||||
|
use:'启用',
|
||||||
|
unuse:'未启用',
|
||||||
|
action:'操作',
|
||||||
|
geterr:'获取计费规则失败',
|
||||||
|
updatesuc:'更新成功',
|
||||||
|
updateerr:'更新失败'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
form: {
|
form: {
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="min-h-500px flex-col-stretch gap-16px overflow-hidden lt-sm:overflow-auto">
|
<div class="min-h-500px flex-col-stretch gap-16px overflow-hidden lt-sm:overflow-auto">
|
||||||
<ACard
|
<ACard
|
||||||
title="计费规则配置"
|
:title="t('page.rule.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"
|
class="flex-col-stretch sm:flex-1-hidden"
|
||||||
@@ -17,7 +17,7 @@
|
|||||||
<template #bodyCell="{ column, record }">
|
<template #bodyCell="{ column, record }">
|
||||||
<template v-if="column.key === 'action'">
|
<template v-if="column.key === 'action'">
|
||||||
<ASpace>
|
<ASpace>
|
||||||
<AButton type="primary" @click="handleEdit(record)">编辑</AButton>
|
<AButton type="primary" @click="handleEdit(record)">{{ t('page.rule.edit') }}</AButton>
|
||||||
</ASpace>
|
</ASpace>
|
||||||
</template>
|
</template>
|
||||||
</template>
|
</template>
|
||||||
@@ -39,29 +39,29 @@
|
|||||||
:rules="rules"
|
:rules="rules"
|
||||||
layout="vertical"
|
layout="vertical"
|
||||||
>
|
>
|
||||||
<AFormItem label="流量" name="traffic">
|
<AFormItem :label="t('page.rule.traffic')" name="traffic">
|
||||||
<AInputNumber
|
<AInputNumber
|
||||||
v-model:value="currentRule.traffic"
|
v-model:value="currentRule.traffic"
|
||||||
:min="1"
|
:min="1"
|
||||||
:precision="0"
|
:precision="0"
|
||||||
style="width: 100%"
|
style="width: 100%"
|
||||||
placeholder="请输入流量大小"
|
:placeholder="t('page.rule.pletraffic')"
|
||||||
/>
|
/>
|
||||||
</AFormItem>
|
</AFormItem>
|
||||||
<AFormItem label="价格" name="price">
|
<AFormItem :label="t('page.rule.price')" name="price">
|
||||||
<AInputNumber
|
<AInputNumber
|
||||||
v-model:value="currentRule.price"
|
v-model:value="currentRule.price"
|
||||||
:min="0"
|
:min="0"
|
||||||
:precision="2"
|
:precision="2"
|
||||||
style="width: 100%"
|
style="width: 100%"
|
||||||
placeholder="请输入价格"
|
:placeholder="t('page.rule.pleprice')"
|
||||||
/>
|
/>
|
||||||
</AFormItem>
|
</AFormItem>
|
||||||
<AFormItem label="单位" name="unit">
|
<AFormItem :label="t('page.rule.unit')" name="unit">
|
||||||
<ASelect
|
<ASelect
|
||||||
v-model:value="currentRule.unit"
|
v-model:value="currentRule.unit"
|
||||||
style="width: 100%"
|
style="width: 100%"
|
||||||
placeholder="请选择单位"
|
:placeholder="t('page.rule.pleunit')"
|
||||||
>
|
>
|
||||||
<ASelect.Option
|
<ASelect.Option
|
||||||
v-for="option in unitOptions"
|
v-for="option in unitOptions"
|
||||||
@@ -72,15 +72,15 @@
|
|||||||
</ASelect.Option>
|
</ASelect.Option>
|
||||||
</ASelect>
|
</ASelect>
|
||||||
</AFormItem>
|
</AFormItem>
|
||||||
<AFormItem label="状态" name="enable">
|
<AFormItem :label="t('page.rule.status')" name="enable">
|
||||||
<ASwitch v-model:checked="currentRule.enable" />
|
<ASwitch v-model:checked="currentRule.enable" />
|
||||||
</AFormItem>
|
</AFormItem>
|
||||||
</AForm>
|
</AForm>
|
||||||
|
|
||||||
<template #footer>
|
<template #footer>
|
||||||
<ASpace>
|
<ASpace>
|
||||||
<AButton @click="closeDrawer">取消</AButton>
|
<AButton @click="closeDrawer">{{ t('page.rule.close') }}</AButton>
|
||||||
<AButton type="primary" :loading="submitLoading" @click="handleSubmit">确定</AButton>
|
<AButton type="primary" :loading="submitLoading" @click="handleSubmit">{{ t('page.rule.confirm') }}</AButton>
|
||||||
</ASpace>
|
</ASpace>
|
||||||
</template>
|
</template>
|
||||||
</ADrawer>
|
</ADrawer>
|
||||||
@@ -105,6 +105,8 @@ import {
|
|||||||
} from 'ant-design-vue';
|
} from 'ant-design-vue';
|
||||||
import type { FormInstance } from 'ant-design-vue';
|
import type { FormInstance } from 'ant-design-vue';
|
||||||
import type { ColumnsType } from 'ant-design-vue/es/table';
|
import type { ColumnsType } from 'ant-design-vue/es/table';
|
||||||
|
import { useI18n } from 'vue-i18n';
|
||||||
|
const { t } = useI18n();
|
||||||
|
|
||||||
interface BillRule {
|
interface BillRule {
|
||||||
id: number;
|
id: number;
|
||||||
@@ -129,7 +131,7 @@ const loading = ref(false);
|
|||||||
const submitLoading = ref(false);
|
const submitLoading = ref(false);
|
||||||
const data = ref<BillRule[]>([]);
|
const data = ref<BillRule[]>([]);
|
||||||
const drawerVisible = ref(false);
|
const drawerVisible = ref(false);
|
||||||
const drawerTitle = ref('编辑规则');
|
const drawerTitle = ref(t('page.rule.modaltitle'));
|
||||||
const currentRule = ref<BillRuleUpdate | null>(null);
|
const currentRule = ref<BillRuleUpdate | null>(null);
|
||||||
const formRef = ref<FormInstance>();
|
const formRef = ref<FormInstance>();
|
||||||
|
|
||||||
@@ -149,21 +151,21 @@ const getUnitText = (unit: number) => {
|
|||||||
|
|
||||||
const columns: ColumnsType = [
|
const columns: ColumnsType = [
|
||||||
{
|
{
|
||||||
title: '流量',
|
title: t('page.rule.traffic'),
|
||||||
dataIndex: 'traffic',
|
dataIndex: 'traffic',
|
||||||
key: 'traffic',
|
key: 'traffic',
|
||||||
align: 'center',
|
align: 'center',
|
||||||
width: 150
|
width: 150
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '价格',
|
title: t('page.rule.price'),
|
||||||
dataIndex: 'price',
|
dataIndex: 'price',
|
||||||
key: 'price',
|
key: 'price',
|
||||||
align: 'center',
|
align: 'center',
|
||||||
width: 150
|
width: 150
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '单位',
|
title: t('page.rule.unit'),
|
||||||
dataIndex: 'unit',
|
dataIndex: 'unit',
|
||||||
key: 'unit',
|
key: 'unit',
|
||||||
align: 'center',
|
align: 'center',
|
||||||
@@ -171,15 +173,15 @@ const columns: ColumnsType = [
|
|||||||
customRender: ({ text }) => getUnitText(text)
|
customRender: ({ text }) => getUnitText(text)
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '状态',
|
title: t('page.rule.status'),
|
||||||
dataIndex: 'enable',
|
dataIndex: 'enable',
|
||||||
key: 'enable',
|
key: 'enable',
|
||||||
align: 'center',
|
align: 'center',
|
||||||
width: 100,
|
width: 100,
|
||||||
customRender: ({ text: enable }) => (enable ? '启用' : '未启用')
|
customRender: ({ text: enable }) => (enable ? t('page.rule.use') : t('page.rule.unuse'))
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '操作',
|
title: t('page.rule.action'),
|
||||||
key: 'action',
|
key: 'action',
|
||||||
align: 'center',
|
align: 'center',
|
||||||
width: 100,
|
width: 100,
|
||||||
@@ -188,9 +190,9 @@ const columns: ColumnsType = [
|
|||||||
];
|
];
|
||||||
|
|
||||||
const rules = {
|
const rules = {
|
||||||
traffic: [{ required: true, message: '请输入流量大小' }],
|
traffic: [{ required: true, message: t('page.rule.pletraffic') }],
|
||||||
price: [{ required: true, message: '请输入价格' }],
|
price: [{ required: true, message: t('page.rule.pleprice') }],
|
||||||
unit: [{ required: true, message: '请输入单位' }]
|
unit: [{ required: true, message: t('page.rule.pleunit') }]
|
||||||
};
|
};
|
||||||
|
|
||||||
// 获取列表数据
|
// 获取列表数据
|
||||||
@@ -204,8 +206,8 @@ const getData = async () => {
|
|||||||
data.value = [];
|
data.value = [];
|
||||||
}
|
}
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.error('获取计费规则失败:', error);
|
console.error('error:', error);
|
||||||
message.error('获取计费规则失败');
|
message.error(t('page.rule.geterr'));
|
||||||
data.value = [];
|
data.value = [];
|
||||||
} finally {
|
} finally {
|
||||||
loading.value = false;
|
loading.value = false;
|
||||||
@@ -234,12 +236,12 @@ const handleSubmit = async () => {
|
|||||||
submitLoading.value = true;
|
submitLoading.value = true;
|
||||||
|
|
||||||
await updateBillRule(currentRule.value);
|
await updateBillRule(currentRule.value);
|
||||||
message.success('更新成功');
|
message.success(t('page.rule.updatesuc'));
|
||||||
closeDrawer();
|
closeDrawer();
|
||||||
getData();
|
getData();
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.error('更新失败:', error);
|
console.error('update error:', error);
|
||||||
message.error('更新失败');
|
message.error(t('page.rule.updateerr'));
|
||||||
} finally {
|
} finally {
|
||||||
submitLoading.value = false;
|
submitLoading.value = false;
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user