add 添加模板文件; add 添加下载模板和上传功能

This commit is contained in:
lb 2023-04-11 10:36:14 +08:00
parent 84887dc9ac
commit 30d577e65b
4 changed files with 93 additions and 118 deletions

Binary file not shown.

Binary file not shown.

View File

@ -7,15 +7,24 @@
title="导入订单" title="导入订单"
:destroy-on-close="false" :destroy-on-close="false"
:close-on-click-modal="configs.clickModalToClose ?? true"> :close-on-click-modal="configs.clickModalToClose ?? true">
<el-upload style="margin-top: 24px; text-align: center" drag :action="urls.importOrderUrl"> <el-upload
style="margin-top: 24px; text-align: center"
drag
:action="urls.importOrderUrl"
:headers="uploadHeaders"
:show-file-list="false"
:on-error="handleError"
:on-success="handleSuccess">
<i class="el-icon-upload"></i> <i class="el-icon-upload"></i>
<div class="el-upload__text"> <div class="el-upload__text">
将文件拖到此处<em>点击上传</em> 将文件拖到此处
<em>点击上传</em>
</div> </div>
<div class="el-upload__tip" slot="tip">只能上传 Excel 文件</div> <div class="el-upload__tip" slot="tip">只能上传 Excel 文件</div>
</el-upload> </el-upload>
<div slot="footer"> <div slot="footer">
<el-button type="success" @click="handleBtnClick({ name: 'download-template' })">下载模板</el-button>
<el-button @click="handleBtnClick({ name: 'cancel' })">取消</el-button> <el-button @click="handleBtnClick({ name: 'cancel' })">取消</el-button>
</div> </div>
</el-dialog> </el-dialog>
@ -56,18 +65,38 @@ export default {
this.visible = true; this.visible = true;
}, },
/** handlers */ fileTypeCheck() {
handleSelectChange(col, eventValue) { // : Boolean
// console.log("[dialog] select change: ", col, eventValue);
this.$forceUpdate();
}, },
handleComponentModelUpdate(propName, { subject, payload: { data } }) { fileSizeCheck() {
this.dataForm[propName] = JSON.stringify(data); // : Boolean
// console.log("[DialogJustForm] handleComponentModelUpdate", this.dataForm[propName]);
}, },
handleUpload() {}, handleSuccess(response, file, fileList) {
// console.log("success response", response);
let message = "";
let isError = false;
if (typeof response === "object" && "msg" in response) message = response.msg;
if (typeof response === "object" && "data" in response) message = response.data.toString();
if (typeof response === "string") {
message = response;
isError = true;
}
this.handleClose();
this.$message({
message,
type: isError ? "error" : "info",
duration: 2000,
});
},
handleError(err, file, fileList) {
console.log("err", err);
},
handleBtnClick(payload) { handleBtnClick(payload) {
if ("name" in payload) { if ("name" in payload) {
@ -75,10 +104,29 @@ export default {
case "cancel": case "cancel":
this.handleClose(); this.handleClose();
break; break;
case "download-template":
this.handleDownloadTemplate();
break;
} }
} }
}, },
handleDownloadTemplate(filename) {
this.$notify({
title: "提示",
message: "开始下载",
type: "success",
});
//
let a = document.createElement("a");
a.href = "/importTemplates/orderImport.xlsx";
a.download = filename ?? "orderTemplate.xlsx";
document.body.appendChild(a);
a.click();
document.body.removeChild(a);
},
handleUploadChange(file, fileList) { handleUploadChange(file, fileList) {
// console.log("[Upload] handleUploadChange...", file, fileList); // console.log("[Upload] handleUploadChange...", file, fileList);
}, },
@ -122,6 +170,4 @@ export default {
.dialog-just-form >>> .dialog-demo { .dialog-just-form >>> .dialog-demo {
text-align: center; text-align: center;
} }
</style> </style>

View File

@ -10,8 +10,7 @@
:id="$attrs.id" :id="$attrs.id"
:head-title="headConfig.title" :head-title="headConfig.title"
:head-config="{ fields: headConfig.form }" :head-config="{ fields: headConfig.form }"
@btn-click="handleBtnClick" @btn-click="handleBtnClick" />
/>
<BaseListTable <BaseListTable
:key="headConfig.title" :key="headConfig.title"
v-loading="tableLoading" v-loading="tableLoading"
@ -19,8 +18,7 @@
:column-config="tableConfig.column" :column-config="tableConfig.column"
:table-data="dataList" :table-data="dataList"
@operate-event="handleOperate" @operate-event="handleOperate"
:refresh-layout-key="refreshLayoutKey" :refresh-layout-key="refreshLayoutKey" />
/>
<el-pagination <el-pagination
@size-change="handleSizeChange" @size-change="handleSizeChange"
@ -29,8 +27,7 @@
:page-sizes="[1, 5, 10, 20]" :page-sizes="[1, 5, 10, 20]"
:page-size="listQuery.limit" :page-size="listQuery.limit"
:total="totalPage" :total="totalPage"
layout="total, sizes, prev, pager, next, jumper" layout="total, sizes, prev, pager, next, jumper"></el-pagination>
></el-pagination>
<DialogJustForm <DialogJustForm
modal-append-to-body modal-append-to-body
@ -38,8 +35,7 @@
v-if="renderDialog" v-if="renderDialog"
fullscreen fullscreen
:configs="dialogConfig" :configs="dialogConfig"
@destroy-dialog="renderDialog = false" @destroy-dialog="renderDialog = false" />
/>
<DialogWithMenu <DialogWithMenu
modal-append-to-body modal-append-to-body
@ -47,14 +43,13 @@
v-if="renderMenuDialog" v-if="renderMenuDialog"
fullscreen fullscreen
:configs="dialogConfig" :configs="dialogConfig"
@destroy-dialog="renderMenuDialog = false" @destroy-dialog="renderMenuDialog = false" />
/>
<DialogUpload <DialogUpload
ref="uploadDialog" ref="uploadDialog"
v-if="uploadDialogVisible" v-if="uploadDialogVisible"
@destroy-dialog="uploadDialogVisible = false" @destroy-dialog="uploadDialogVisible = false"
/> @refresh-list="handleRefreshList" />
</section> </section>
</template> </template>
@ -111,14 +106,7 @@ export default {
watch: { watch: {
refreshKey(newVal) { refreshKey(newVal) {
// //
this.getAList( this.getAList(Object.assign({}, this.listQuery, this.extraSearchConditions, this.params));
Object.assign(
{},
this.listQuery,
this.extraSearchConditions,
this.params
)
);
}, },
}, },
data() { data() {
@ -139,14 +127,19 @@ export default {
}; };
}, },
mounted() { mounted() {
this.getAList( this.getAList(Object.assign({}, this.listQuery, this.extraSearchConditions));
Object.assign({}, this.listQuery, this.extraSearchConditions)
);
}, },
activated() { activated() {
this.refreshLayoutKey = this.layoutTable(); this.refreshLayoutKey = this.layoutTable();
}, },
methods: { methods: {
handleRefreshList() {
setTimeout(() => {
this.uploadDialogVisible = false;
}, 300);
this.getAList(Object.assign({}, this.listQuery, this.extraSearchConditions));
},
getAList(payload) { getAList(payload) {
if (this.pageUrl != "#") { if (this.pageUrl != "#") {
this.tableLoading = true; this.tableLoading = true;
@ -208,14 +201,7 @@ export default {
type: "success", type: "success",
duration: 2000, duration: 2000,
onClose: () => { onClose: () => {
this.getAList( this.getAList(Object.assign({}, this.listQuery, this.extraSearchConditions, this.params));
Object.assign(
{},
this.listQuery,
this.extraSearchConditions,
this.params
)
);
this.$emit("refresh-tables", ["ongoing"]); this.$emit("refresh-tables", ["ongoing"]);
}, },
}); });
@ -237,15 +223,11 @@ export default {
case "destroy-order": case "destroy-order":
// //
case "end-order": { case "end-order": {
this.$confirm( this.$confirm(`确定${type === "end-order" ? "结束订单" : "废除订单"}?`, "提示", {
`确定${type === "end-order" ? "结束订单" : "废除订单"}?`, confirmButtonText: "确定",
"提示", cancelButtonText: "取消",
{ type: "warning",
confirmButtonText: "确定", })
cancelButtonText: "取消",
type: "warning",
}
)
.then(() => { .then(() => {
return this.$http.post("/pms/order/end", data, { return this.$http.post("/pms/order/end", data, {
headers: { headers: {
@ -261,14 +243,7 @@ export default {
type: "success", type: "success",
duration: 2000, duration: 2000,
onClose: () => { onClose: () => {
this.getAList( this.getAList(Object.assign({}, this.listQuery, this.extraSearchConditions, this.params));
Object.assign(
{},
this.listQuery,
this.extraSearchConditions,
this.params
)
);
this.$emit("refresh-tables", ["finished"]); this.$emit("refresh-tables", ["finished"]);
}, },
}); });
@ -308,14 +283,7 @@ export default {
.then(({ data: res }) => { .then(({ data: res }) => {
if (res.code === 0) { if (res.code === 0) {
// success // success
this.getAList( this.getAList(Object.assign({}, this.listQuery, this.extraSearchConditions, this.params));
Object.assign(
{},
this.listQuery,
this.extraSearchConditions,
this.params
)
);
} else { } else {
// failed // failed
throw new Error(res.msg); throw new Error(res.msg);
@ -331,15 +299,11 @@ export default {
} }
case "delete": { case "delete": {
// //
return this.$confirm( return this.$confirm(`确定要删除 "${data.code ?? data.id}" 吗?`, "提示", {
`确定要删除 "${data.code ?? data.id}" 吗?`, confirmButtonText: "确认",
"提示", cancelButtonText: "我再想想",
{ type: "warning",
confirmButtonText: "确认", })
cancelButtonText: "我再想想",
type: "warning",
}
)
.then(() => { .then(() => {
// this.$http.delete(this.urls.base + `/${data}`).then((res) => { // this.$http.delete(this.urls.base + `/${data}`).then((res) => {
this.$http({ this.$http({
@ -350,14 +314,7 @@ export default {
if (res.code === 0) { if (res.code === 0) {
this.$message.success("删除成功!"); this.$message.success("删除成功!");
// //
this.getAList( this.getAList(Object.assign({}, this.listQuery, this.extraSearchConditions, this.params));
Object.assign(
{},
this.listQuery,
this.extraSearchConditions,
this.params
)
);
} }
}); });
}) })
@ -395,24 +352,13 @@ export default {
// //
if (!!payload.timerange) { if (!!payload.timerange) {
const [startTime, endTime] = payload["timerange"]; const [startTime, endTime] = payload["timerange"];
this.params.startTime = moment(startTime).format( this.params.startTime = moment(startTime).format("YYYY-MM-DDTHH:mm:ss");
"YYYY-MM-DDTHH:mm:ss" this.params.endTime = moment(endTime).format("YYYY-MM-DDTHH:mm:ss");
);
this.params.endTime = moment(endTime).format(
"YYYY-MM-DDTHH:mm:ss"
);
} }
delete this.params.timerange; delete this.params.timerange;
} }
// //
this.getAList( this.getAList(Object.assign({}, this.listQuery, this.extraSearchConditions, this.params));
Object.assign(
{},
this.listQuery,
this.extraSearchConditions,
this.params
)
);
break; break;
} }
case "新增": case "新增":
@ -436,25 +382,11 @@ export default {
handleSizeChange(newSize) { handleSizeChange(newSize) {
this.listQuery.page = 1; this.listQuery.page = 1;
this.listQuery.limit = newSize; this.listQuery.limit = newSize;
this.getAList( this.getAList(Object.assign({}, this.listQuery, this.extraSearchConditions, this.params));
Object.assign(
{},
this.listQuery,
this.extraSearchConditions,
this.params
)
);
}, },
handlePageChange(newPage) { handlePageChange(newPage) {
this.getAList( this.getAList(Object.assign({}, this.listQuery, this.extraSearchConditions, this.params));
Object.assign(
{},
this.listQuery,
this.extraSearchConditions,
this.params
)
);
}, },
/** 打开对话框 */ /** 打开对话框 */
@ -463,10 +395,7 @@ export default {
this.$nextTick(() => { this.$nextTick(() => {
// console.log("init dialog", row_id, detail_mode); // console.log("init dialog", row_id, detail_mode);
this.$refs["order-dialog"].init( this.$refs["order-dialog"].init(/** some args... */ row_id, detail_mode);
/** some args... */ row_id,
detail_mode
);
}); });
}, },