|
@@ -75,7 +75,7 @@
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="detail-table">
|
|
<div class="detail-table">
|
|
- <a-table :columns="columnsDetail" :data="dataDetail" />
|
|
|
|
|
|
+ <a-table :columns="columnsDetail" @page-change="evChangePage" :data="dataDetail" :pagination="pagination" />
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<template #footer>
|
|
<template #footer>
|
|
@@ -124,7 +124,15 @@ const state = ref({
|
|
const { tariffForm, showCard, res1, res2, res3, userType } = toRefs(state.value)
|
|
const { tariffForm, showCard, res1, res2, res3, userType } = toRefs(state.value)
|
|
const columnsDetail = [{ title: 'ICCID', dataIndex: 'iccid' }, { title: t('order.CardStatus'), dataIndex: 'status' }, { title: t('order.CreationTime'), dataIndex: 'createdAt' }
|
|
const columnsDetail = [{ title: 'ICCID', dataIndex: 'iccid' }, { title: t('order.CardStatus'), dataIndex: 'status' }, { title: t('order.CreationTime'), dataIndex: 'createdAt' }
|
|
]
|
|
]
|
|
|
|
+// 初始数据
|
|
|
|
+const tableDataList = ref([])
|
|
|
|
+// 处理后的数据
|
|
const dataDetail = ref([])
|
|
const dataDetail = ref([])
|
|
|
|
+const pagination = ref({
|
|
|
|
+ current: 1,
|
|
|
|
+ pageSize: 10,
|
|
|
|
+ total: 0
|
|
|
|
+})
|
|
|
|
|
|
// 分配卡号
|
|
// 分配卡号
|
|
const customRequest = (options) => {
|
|
const customRequest = (options) => {
|
|
@@ -134,9 +142,13 @@ const customRequest = (options) => {
|
|
DistributionCard(formData).then(res => {
|
|
DistributionCard(formData).then(res => {
|
|
if (res.code == 200) {
|
|
if (res.code == 200) {
|
|
Message.success(res.message)
|
|
Message.success(res.message)
|
|
- res.data[0].forEach(val => [
|
|
|
|
- dataDetail.value.push({ iccid: val })
|
|
|
|
- ])
|
|
|
|
|
|
+ // 更新完整数据
|
|
|
|
+ tableDataList.value = res.data[0];
|
|
|
|
+
|
|
|
|
+ // 更新总条目数
|
|
|
|
+ pagination.value.total = res.data[0].length;
|
|
|
|
+
|
|
|
|
+ updatePageData();
|
|
}
|
|
}
|
|
})
|
|
})
|
|
}
|
|
}
|
|
@@ -164,6 +176,18 @@ watch(() => FormDataList.value, val => {
|
|
})
|
|
})
|
|
}, { deep: true })
|
|
}, { deep: true })
|
|
|
|
|
|
|
|
+const evChangePage = (page) => {
|
|
|
|
+ pagination.value.current = page
|
|
|
|
+ updatePageData();
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+// 更新分页数据方法
|
|
|
|
+const updatePageData = () => {
|
|
|
|
+ const startIndex = (pagination.value.current - 1) * pagination.value.pageSize;
|
|
|
|
+ const endIndex = startIndex + pagination.value.pageSize; // 每次切 10 条
|
|
|
|
+ dataDetail.value = tableDataList.value.slice(startIndex, endIndex);
|
|
|
|
+};
|
|
|
|
+
|
|
onMounted(async () => {
|
|
onMounted(async () => {
|
|
res1.value = await Getdictionary('Billingcycle')
|
|
res1.value = await Getdictionary('Billingcycle')
|
|
res2.value = await Getdictionary('billingMethod')
|
|
res2.value = await Getdictionary('billingMethod')
|