feat: 交班管理增加交班数据导出功能
This commit is contained in:
parent
2fe360bcb2
commit
8ea8c257d2
|
|
@ -105,12 +105,12 @@ export function parseTime(time: string | number | Date | null, cFormat: string |
|
|||
}
|
||||
|
||||
// 下载文件
|
||||
export function downloadFile(obj: BlobPart, name: string, suffix: string) {
|
||||
export function downloadFile(obj: BlobPart, name: string, suffix: string, useUnix = true) {
|
||||
const url = window.URL.createObjectURL(new Blob([obj]));
|
||||
const link = document.createElement("a");
|
||||
link.style.display = "none";
|
||||
link.href = url;
|
||||
const fileName = parseTime(new Date(), undefined) + "-" + name + "." + suffix;
|
||||
const fileName = useUnix ? (parseTime(new Date(), undefined) + "-") : '' + name.trim() + "." + suffix;
|
||||
link.setAttribute("download", fileName);
|
||||
document.body.appendChild(link);
|
||||
link.click();
|
||||
|
|
|
|||
|
|
@ -48,6 +48,14 @@ const AuthAPI = {
|
|||
method: "delete",
|
||||
});
|
||||
},
|
||||
//导出
|
||||
export(id: string | number) {
|
||||
return request<any>({
|
||||
url: `${baseURL}/export/${id}`,
|
||||
method: "get",
|
||||
responseType: "blob",
|
||||
});
|
||||
}
|
||||
|
||||
};
|
||||
export interface Responseres {
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<div style="margin-top: 10px;">
|
||||
<div style="margin-top: 10px">
|
||||
<el-table :data="props.list" border style="width: 100%">
|
||||
<el-table-column prop="shopName" align="center" label="商户名称" />
|
||||
<el-table-column prop="staffName" align="center" label="职员名称" />
|
||||
|
|
@ -12,8 +12,12 @@
|
|||
<el-table-column prop="handoverTime" align="center" label="交班时间" />
|
||||
<el-table-column label="操作" align="center">
|
||||
<template #default="scope">
|
||||
<el-button size="small" type="primary" link icon="Edit" @click="handleEdit(scope.row)">查看</el-button>
|
||||
<el-button size="small" type="primary" link icon="Edit" @click="handleEdit(scope.row)">导出</el-button>
|
||||
<el-button size="small" type="primary" link icon="Edit" @click="handleEdit(scope.row)">
|
||||
查看
|
||||
</el-button>
|
||||
<el-button size="small" type="primary" link icon="Edit" @click="handleExport(scope.row)">
|
||||
导出
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
|
@ -21,19 +25,22 @@
|
|||
</template>
|
||||
|
||||
<script setup>
|
||||
const emit = defineEmits(['handleDelete', 'handleEdit'])
|
||||
const emit = defineEmits(["handleDelete", "handleEdit"]);
|
||||
const props = defineProps({
|
||||
list: {
|
||||
type: Array,
|
||||
default: () => []
|
||||
}
|
||||
})
|
||||
default: () => [],
|
||||
},
|
||||
});
|
||||
|
||||
function handleEdit(row) {
|
||||
emit('handleEdit', row)
|
||||
emit("handleEdit", row);
|
||||
}
|
||||
function handleDelete(index, row) {
|
||||
emit('handleDelete', row.id)
|
||||
emit("handleDelete", row.id);
|
||||
}
|
||||
// 导出
|
||||
function handleExport(row) {
|
||||
emit("handleExport", row);
|
||||
}
|
||||
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -1,9 +1,18 @@
|
|||
<template>
|
||||
<div class="Table">
|
||||
<!-- 表格 -->
|
||||
<my-table :list="datas.tableData" @handleDelete="handleDelete" @handleEdit="handleEdit"></my-table>
|
||||
<my-table
|
||||
@handleExport="handleExport"
|
||||
:list="datas.tableData"
|
||||
@handleDelete="handleDelete"
|
||||
@handleEdit="handleEdit"
|
||||
></my-table>
|
||||
<!-- 分页 -->
|
||||
<my-paging :pagingConfig="datas.pagingConfig" @sizeChange="sizeChange" @currentChange="currentChange"></my-paging>
|
||||
<my-paging
|
||||
:pagingConfig="datas.pagingConfig"
|
||||
@sizeChange="sizeChange"
|
||||
@currentChange="currentChange"
|
||||
></my-paging>
|
||||
<!-- 其他模板 -->
|
||||
<!-- 新增/编辑 -->
|
||||
<my-dialog ref="myDialogRef" title="商品销售" @confirm="confirm" width="30%">
|
||||
|
|
@ -23,6 +32,7 @@ import myPaging from "./component/my-paging.vue";
|
|||
import myDialog from "@/components/mycomponents/myDialog.vue";
|
||||
import eventBus from "@/utils/eventBus";
|
||||
import API from "./api";
|
||||
import { downloadFile } from "@/utils/index";
|
||||
|
||||
const datas = reactive({
|
||||
tableData: [], // 表格数据
|
||||
|
|
@ -81,7 +91,7 @@ function add() {
|
|||
async function handleEdit(row) {
|
||||
datas.title = "查看数据";
|
||||
const res = await API.getinfo(row.id);
|
||||
datas.tableDatas = res
|
||||
datas.tableDatas = res;
|
||||
// datas.DialogForm = res;
|
||||
// 有图片
|
||||
// datas.DialogForm.goodsImageUrl = res.goodsImageUrl.split(',')
|
||||
|
|
@ -89,7 +99,6 @@ async function handleEdit(row) {
|
|||
}
|
||||
async function confirm() {
|
||||
myDialogRef.value.close();
|
||||
|
||||
}
|
||||
// 重置
|
||||
function rest() {
|
||||
|
|
@ -133,6 +142,19 @@ function currentChange(val) {
|
|||
datas.pagingConfig.pageNumber = val;
|
||||
getList();
|
||||
}
|
||||
//导出
|
||||
async function handleExport(row) {
|
||||
try {
|
||||
const file = await API.export(row.id);
|
||||
downloadFile(
|
||||
file,
|
||||
`${row.staffName}-${row.loginTime}到${row.handoverTime}交班数据`,
|
||||
"xlsx",
|
||||
false
|
||||
);
|
||||
ElMessage.success("下载成功");
|
||||
} catch (error) {}
|
||||
}
|
||||
</script>
|
||||
<style scoped lang="scss">
|
||||
.Table {
|
||||
|
|
|
|||
Loading…
Reference in New Issue