Skip to content

Commit

Permalink
fetch: change export function in collection, expense, income views
Browse files Browse the repository at this point in the history
  • Loading branch information
@Jzow
Jzow committed Dec 3, 2023
1 parent 80cdf9e commit 4c4ea62
Show file tree
Hide file tree
Showing 3 changed files with 159 additions and 39 deletions.
67 changes: 54 additions & 13 deletions web/src/views/financial/collection/index.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -40,6 +40,14 @@
</template>
</template>
</BasicTable>
<a-modal v-model:open="openExportData" title="确认导出" :confirm-loading="confirmLoading"
@ok="handleExportOk" @cancel="handleExportCancel" okText="导出">
<div style="text-align: center">
<p>即将导出{{dataSum}}条数据，请耐心等待。</p>
<p>如需导出明细数据（可能耗时较长），请勾选下方复选框。</p>
<a-checkbox v-model:checked="exportDetailData">需要导出明细数据</a-checkbox>
</div>
</a-modal>
<AddEditCollectionModal ref="addEditModalRef" @cancel="handleCancel"/>
<ViewCollectionModal @register="receiptViewModal" />
</div>
Expand All @@ -52,22 +60,26 @@ import {defineComponent, ref} from "vue";
import {BasicTable, TableAction, useTable} from "@/components/Table";
import {useMessage} from "@/hooks/web/useMessage";
import {columns, searchFormSchema} from "@/views/financial/collection/collection.data";
import {exportXlsx} from "@/api/basic/common";
import {useI18n} from "vue-i18n";
import {getCollectionPageList, deleteBatchCollection, updateCollectionStatus} from "@/api/financial/collection";
import {Tag} from "ant-design-vue";
import {getCollectionPageList, deleteBatchCollection, updateCollectionStatus, exportCollection} from "@/api/financial/collection";
import {Checkbox, Modal, Tag} from "ant-design-vue";
import {useModal} from "@/components/Modal";
import ViewCollectionModal from "@/views/financial/collection/components/ViewCollectionModal.vue";
import AddEditCollectionModal from "@/views/financial/collection/components/AddEditCollectionModal.vue";
import {getTimestamp} from "@/utils/dateUtil";
export default defineComponent({
name: 'CollectionReceipt',
components: {ViewCollectionModal, Tag, TableAction, BasicTable, AddEditCollectionModal},
components: {'a-modal': Modal, 'a-checkbox': Checkbox, ViewCollectionModal, Tag, TableAction, BasicTable, AddEditCollectionModal},
setup() {
const { t } = useI18n();
const { createMessage } = useMessage();
const addEditModalRef = ref(null);
const exportDetailData = ref<boolean>(false);
const openExportData = ref<boolean>(false);
const confirmLoading = ref<boolean>(false);
const dataSum = ref<number>(0);
const [receiptViewModal, {openModal: openReceiptViewModal}] = useModal();
const [registerTable, { reload, getSelectRows }] = useTable({
const [registerTable, { reload, getSelectRows, getForm, getDataSource }] = useTable({
title: '收款单列表',
rowKey: 'id',
api: getCollectionPageList,
Expand Down Expand Up @@ -169,14 +181,37 @@ export default defineComponent({
}
async function handleExport() {
const file = await exportXlsx("收款单列表")
const blob = new Blob([file]);
const link = document.createElement("a");
link.href = URL.createObjectURL(blob);
const timestamp = getTimestamp(new Date());
link.download = "收款单数据" + timestamp + ".xlsx";
link.target = "_blank";
link.click();
dataSum.value = getDataSource().length;
if (dataSum.value === 0) {
createMessage.warn('当前查询条件下无数据可导出');
return;
}
openExportData.value = true;
}
const handleExportCancel = () => {
confirmLoading.value = false;
openExportData.value = false;
exportDetailData.value = false;
};
const handleExportOk = async () => {
confirmLoading.value = true;
const data: any = getForm().getFieldsValue();
data.isExportDetail = exportDetailData.value;
const file: any = await exportCollection(data)
if (file.size > 0) {
const blob = new Blob([file]);
const link = document.createElement("a");
link.href = URL.createObjectURL(blob);
const timestamp = getTimestamp(new Date());
link.download = "收款单数据" + timestamp + ".xlsx";
link.target = "_blank";
link.click();
}
confirmLoading.value = false;
openExportData.value = false;
exportDetailData.value = false;
}
Expand All @@ -195,6 +230,12 @@ export default defineComponent({
handleView,
handleOk,
handleExport,
openExportData,
confirmLoading,
exportDetailData,
dataSum,
handleExportOk,
handleExportCancel
}
}
})
Expand Down
66 changes: 53 additions & 13 deletions web/src/views/financial/expense/index.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -40,6 +40,14 @@
</template>
</template>
</BasicTable>
<a-modal v-model:open="openExportData" title="确认导出" :confirm-loading="confirmLoading"
@ok="handleExportOk" @cancel="handleExportCancel" okText="导出">
<div style="text-align: center">
<p>即将导出{{dataSum}}条数据，请耐心等待。</p>
<p>如需导出明细数据（可能耗时较长），请勾选下方复选框。</p>
<a-checkbox v-model:checked="exportDetailData">需要导出明细数据</a-checkbox>
</div>
</a-modal>
<AddEditExpenseModal ref="addEditModalRef" @cancel="handleCancel"/>
<ViewExpenseModal @register="receiptViewModal" />
</div>
Expand All @@ -52,22 +60,25 @@ import {defineComponent, ref} from "vue";
import {BasicTable, TableAction, useTable} from "@/components/Table";
import {useMessage} from "@/hooks/web/useMessage";
import {columns, searchFormSchema} from "@/views/financial/expense/expense.data";
import {exportXlsx} from "@/api/basic/common";
import {useI18n} from "vue-i18n";
import {getExpensePageList, deleteBatchExpense, updateExpenseStatus} from "@/api/financial/expense";
import {getExpensePageList, deleteBatchExpense, updateExpenseStatus, exportExpense} from "@/api/financial/expense";
import AddEditExpenseModal from "@/views/financial/expense/components/AddEditExpenseModal.vue"
import {Tag} from "ant-design-vue";
import {Checkbox, Modal, Tag} from "ant-design-vue";
import {useModal} from "@/components/Modal";
import ViewExpenseModal from "@/views/financial/expense/components/ViewExpenseModal.vue";
export default defineComponent({
name: 'ExpenseReceipt',
components: {ViewExpenseModal, Tag, TableAction, BasicTable, AddEditExpenseModal},
components: {'a-modal': Modal, 'a-checkbox': Checkbox, ViewExpenseModal, Tag, TableAction, BasicTable, AddEditExpenseModal},
setup() {
const { t } = useI18n();
const { createMessage } = useMessage();
const addEditModalRef = ref(null);
const exportDetailData = ref<boolean>(false);
const openExportData = ref<boolean>(false);
const confirmLoading = ref<boolean>(false);
const dataSum = ref<number>(0);
const [receiptViewModal, {openModal: openReceiptViewModal}] = useModal();
const [registerTable, { reload, getSelectRows }] = useTable({
const [registerTable, { reload, getSelectRows, getForm, getDataSource }] = useTable({
title: '支出单列表',
rowKey: 'id',
api: getExpensePageList,
Expand Down Expand Up @@ -169,14 +180,37 @@ export default defineComponent({
}
async function handleExport() {
const file = await exportXlsx("支出单列表")
const blob = new Blob([file]);
const link = document.createElement("a");
link.href = URL.createObjectURL(blob);
const timestamp = getTimestamp(new Date());
link.download = "支出单数据" + timestamp + ".xlsx";
link.target = "_blank";
link.click();
dataSum.value = getDataSource().length;
if (dataSum.value === 0) {
createMessage.warn('当前查询条件下无数据可导出');
return;
}
openExportData.value = true;
}
const handleExportCancel = () => {
confirmLoading.value = false;
openExportData.value = false;
exportDetailData.value = false;
};
const handleExportOk = async () => {
confirmLoading.value = true;
const data: any = getForm().getFieldsValue();
data.isExportDetail = exportDetailData.value;
const file: any = await exportExpense(data)
if (file.size > 0) {
const blob = new Blob([file]);
const link = document.createElement("a");
link.href = URL.createObjectURL(blob);
const timestamp = getTimestamp(new Date());
link.download = "支出单数据" + timestamp + ".xlsx";
link.target = "_blank";
link.click();
}
confirmLoading.value = false;
openExportData.value = false;
exportDetailData.value = false;
}
Expand All @@ -195,6 +229,12 @@ export default defineComponent({
handleView,
handleOk,
handleExport,
openExportData,
confirmLoading,
exportDetailData,
dataSum,
handleExportOk,
handleExportCancel
}
}
})
Expand Down
65 changes: 52 additions & 13 deletions web/src/views/financial/income/index.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -40,6 +40,14 @@
</template>
</template>
</BasicTable>
<a-modal v-model:open="openExportData" title="确认导出" :confirm-loading="confirmLoading"
@ok="handleExportOk" @cancel="handleExportCancel" okText="导出">
<div style="text-align: center">
<p>即将导出{{dataSum}}条数据，请耐心等待。</p>
<p>如需导出明细数据（可能耗时较长），请勾选下方复选框。</p>
<a-checkbox v-model:checked="exportDetailData">需要导出明细数据</a-checkbox>
</div>
</a-modal>
<AddEditIncomeModal ref="addEditModalRef" @cancel="handleCancel"/>
<ViewIncomeModal @register="receiptViewModal" />
</div>
Expand All @@ -52,22 +60,25 @@ import {defineComponent, ref} from "vue";
import {BasicTable, TableAction, useTable} from "@/components/Table";
import {useMessage} from "@/hooks/web/useMessage";
import {columns, searchFormSchema} from "@/views/financial/income/income.data";
import {exportXlsx} from "@/api/basic/common";
import {useI18n} from "vue-i18n";
import {getIncomePageList, deleteBatchIncome, updateIncomeStatus} from "@/api/financial/income";
import {getIncomePageList, deleteBatchIncome, updateIncomeStatus, exportIncome} from "@/api/financial/income";
import AddEditIncomeModal from "@/views/financial/income/components/AddEditIncomeModal.vue"
import {Tag} from "ant-design-vue";
import {Checkbox, Modal, Tag} from "ant-design-vue";
import {useModal} from "@/components/Modal";
import ViewIncomeModal from "@/views/financial/income/components/ViewIncomeModal.vue";
export default defineComponent({
name: 'IncomeReceipt',
components: {ViewIncomeModal, Tag, TableAction, BasicTable, AddEditIncomeModal},
components: {'a-modal': Modal, 'a-checkbox': Checkbox, ViewIncomeModal, Tag, TableAction, BasicTable, AddEditIncomeModal},
setup() {
const { t } = useI18n();
const { createMessage } = useMessage();
const addEditModalRef = ref(null);
const exportDetailData = ref<boolean>(false);
const openExportData = ref<boolean>(false);
const confirmLoading = ref<boolean>(false);
const dataSum = ref<number>(0);
const [receiptViewModal, {openModal: openReceiptViewModal}] = useModal();
const [registerTable, { reload, getSelectRows }] = useTable({
const [registerTable, { reload, getSelectRows, getForm, getDataSource }] = useTable({
title: '收入单列表',
rowKey: 'id',
api: getIncomePageList,
Expand Down Expand Up @@ -169,16 +180,38 @@ export default defineComponent({
}
async function handleExport() {
const file = await exportXlsx("收入单列表")
const blob = new Blob([file]);
const link = document.createElement("a");
link.href = URL.createObjectURL(blob);
const timestamp = getTimestamp(new Date());
link.download = "收入单数据" + timestamp + ".xlsx";
link.target = "_blank";
link.click();
dataSum.value = getDataSource().length;
if (dataSum.value === 0) {
createMessage.warn('当前查询条件下无数据可导出');
return;
}
openExportData.value = true;
}
const handleExportCancel = () => {
confirmLoading.value = false;
openExportData.value = false;
exportDetailData.value = false;
};
const handleExportOk = async () => {
confirmLoading.value = true;
const data: any = getForm().getFieldsValue();
data.isExportDetail = exportDetailData.value;
const file: any = await exportIncome(data)
if (file.size > 0) {
const blob = new Blob([file]);
const link = document.createElement("a");
link.href = URL.createObjectURL(blob);
const timestamp = getTimestamp(new Date());
link.download = "收入单数据" + timestamp + ".xlsx";
link.target = "_blank";
link.click();
}
confirmLoading.value = false;
openExportData.value = false;
exportDetailData.value = false;
}
return {
t,
Expand All @@ -195,6 +228,12 @@ export default defineComponent({
handleView,
handleOk,
handleExport,
openExportData,
confirmLoading,
exportDetailData,
dataSum,
handleExportOk,
handleExportCancel
}
}
})
Expand Down

0 comments on commit 4c4ea62

Please sign in to comment.