You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
850 lines
22 KiB
850 lines
22 KiB
<template>
|
|
<div class="app-container" style="position: relative; height: calc(100vh - 117px);">
|
|
<div class="container">
|
|
<el-tabs v-model="status" type="card" @tab-click="handleOrder">
|
|
<el-tab-pane name="0">
|
|
<span slot="label">
|
|
<i class="el-icon-s-order"></i>
|
|
全部订单
|
|
</span>
|
|
</el-tab-pane>
|
|
<el-tab-pane name="12">
|
|
<span slot="label">
|
|
<i class="el-icon-bank-card"></i>
|
|
待付款
|
|
</span>
|
|
</el-tab-pane>
|
|
<el-tab-pane name="2">
|
|
<span slot="label">
|
|
<i class="el-icon-refrigerator"></i>
|
|
待发货
|
|
</span>
|
|
</el-tab-pane>
|
|
<el-tab-pane name="3">
|
|
<span slot="label">
|
|
<i class="el-icon-truck"></i>
|
|
待收货
|
|
</span>
|
|
</el-tab-pane>
|
|
<!-- <el-tab-pane name="4">
|
|
<span slot="label">
|
|
<i class="el-icon-document"></i>
|
|
待评价
|
|
</span>
|
|
</el-tab-pane> -->
|
|
<el-tab-pane name="5">
|
|
<span slot="label">
|
|
<i class="el-icon-circle-check"></i>
|
|
交易完成
|
|
</span>
|
|
</el-tab-pane>
|
|
<!-- <el-tab-pane name="13">
|
|
<span slot="label">
|
|
<i class="el-icon-back"></i>
|
|
申请退款
|
|
</span>
|
|
</el-tab-pane>
|
|
<el-tab-pane name="14">
|
|
<span slot="label">
|
|
<i class="el-icon-finished"></i>
|
|
已退款
|
|
</span>
|
|
</el-tab-pane> -->
|
|
<el-tab-pane name="15">
|
|
<span slot="label">
|
|
<i class="el-icon-circle-close"></i>
|
|
已关闭
|
|
</span>
|
|
</el-tab-pane>
|
|
</el-tabs>
|
|
<!--工具栏-->
|
|
<el-card class="filter-container" shadow="never">
|
|
<div>
|
|
<i class="el-icon-search"></i>
|
|
<span>筛选搜索</span>
|
|
<el-button style="float:right" type="primary" @click="handleSearchList()" size="small">查询搜索
|
|
</el-button>
|
|
<el-button style="float:right;margin-right: 15px" @click="handleResetSearch()" size="small">重置
|
|
</el-button>
|
|
</div>
|
|
<div style="margin-top: 15px">
|
|
<el-form :inline="true" :model="listQuery" size="small" label-width="140px">
|
|
<el-form-item label="订单编号:">
|
|
<el-input v-model="listQuery.id" class="input-width" placeholder="编号"></el-input>
|
|
</el-form-item>
|
|
<!-- <el-form-item label="订单分类:">
|
|
<el-select v-model="listQuery.orderType" class="input-width" placeholder="全部" clearable>
|
|
<el-option v-for="item in orderTypeOptions" :key="item.value" :label="item.label"
|
|
:value="item.value"></el-option>
|
|
</el-select>
|
|
</el-form-item> -->
|
|
|
|
<el-form-item label="提交时间:">
|
|
<el-date-picker class="input-width" v-model="listQuery.createTime" value-format="yyyy-MM-dd"
|
|
type="date" placeholder="请选择时间"></el-date-picker>
|
|
</el-form-item>
|
|
<el-form-item label="收货信息 :">
|
|
<el-input v-model="listQuery.receiverPhone" class="input-width" placeholder="收货人电话">
|
|
</el-input>
|
|
</el-form-item>
|
|
|
|
<!-- <el-form-item label="订单来源:">
|
|
<el-select v-model="listQuery.sourceType" class="input-width" placeholder="全部" clearable>
|
|
<el-option v-for="item in sourceTypeOptions" :key="item.value" :label="item.label"
|
|
:value="item.value"></el-option>
|
|
</el-select>
|
|
</el-form-item> -->
|
|
</el-form>
|
|
</div>
|
|
</el-card>
|
|
|
|
<!--订单数据统计-->
|
|
<div class="order-caculate">
|
|
<a class="caculate-title">
|
|
订单数 :
|
|
<span class="caculate-num">{{ caculateInfo.orderCount }}</span>
|
|
</a>
|
|
|
|
<a class="caculate-title">
|
|
订单金额 :
|
|
<span class="caculate-num">{{ caculateInfo.orderPay }}</span>
|
|
</a>
|
|
<a class="caculate-title">
|
|
客户数 :
|
|
<span class="caculate-num">{{ caculateInfo.memberCount }}</span>
|
|
</a>
|
|
</div>
|
|
|
|
<el-card class="operate-container" shadow="never">
|
|
<i class="el-icon-tickets"></i>
|
|
<span>数据列表</span>
|
|
</el-card>
|
|
<!-- <div class="batch-operate-container">
|
|
<el-checkbox v-model="printChecked" @change="batchSelection"
|
|
style="margin-left:23px; margin-right: 20px;"></el-checkbox>
|
|
<el-select v-model="batchHandle" @change="handlePrintOption" clearable placeholder="批量操作"
|
|
class="filter-item" style="width: 130px; margin-right: 8px;">
|
|
<el-option v-for="item in handleOptions" :key="item.value" :label="item.label"
|
|
:value="item.value" />
|
|
</el-select>
|
|
<el-select v-model="batchExport" @change="handleExportOption" clearable placeholder="批量导出"
|
|
class="filter-item" style="width: 130px">
|
|
<el-option v-for="item in exportOptions" :key="item.value" :label="item.label"
|
|
:value="item.value" />
|
|
</el-select>
|
|
</div> -->
|
|
<div class="table-container">
|
|
<el-table ref="orderTable" :data="list" style="width: 100%;" @selection-change="handleSelectionChange"
|
|
v-loading="listLoading" border>
|
|
<el-table-column type="selection" width="60" align="center"></el-table-column>
|
|
<el-table-column label="编号" width="80" align="center">
|
|
<template slot-scope="scope">
|
|
{{ scope.row.id }}
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="订单编号" width="200" align="center">
|
|
<template slot-scope="scope">
|
|
{{ scope.row.orderSn }}
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="商品" align="center">
|
|
<template slot-scope="scope">
|
|
{{ scope.row.goodsName }}
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="提交时间" width="180" align="center">
|
|
<template slot-scope="scope">
|
|
{{ scope.row.createTime | formatCreateTime }}
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="用户账号" width="180" align="center">
|
|
<template slot-scope="scope">
|
|
{{ scope.row.memberUsername }}
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="订单金额" width="120" align="center">
|
|
<template slot-scope="scope">
|
|
¥{{ scope.row.totalAmount }}
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="支付金额" width="120" align="center">
|
|
<template slot-scope="scope">
|
|
¥{{ scope.row.payAmount }}
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="支付方式" width="120" align="center">
|
|
<template slot-scope="scope">
|
|
{{ scope.row.payType | formatPayType }}
|
|
</template>
|
|
</el-table-column>
|
|
<!-- <el-table-column label="订单来源" width="120" align="center">
|
|
<template slot-scope="scope">
|
|
{{ scope.row.sourceType | formatSourceType }}
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="订单类型" width="120" align="center">
|
|
<template slot-scope="scope">
|
|
{{ scope.row.orderType | formatOrderType }}
|
|
</template>
|
|
</el-table-column> -->
|
|
|
|
<el-table-column label="订单状态" width="120" align="center">
|
|
<template slot-scope="scope">
|
|
{{ scope.row.status | formatStatus }}
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="操作" width="200" align="center">
|
|
<template slot-scope="scope">
|
|
<el-button size="mini" @click="handleViewOrder(scope.$index, scope.row)">查看订单</el-button>
|
|
<!-- <el-button size="mini" @click="handleCloseOrder(scope.$index, scope.row)"
|
|
v-show="scope.row.status === 14">关闭订单</el-button> -->
|
|
<el-button size="mini" @click="handleDeliveryOrder(scope.$index, scope.row)"
|
|
v-show="scope.row.status === 2">订单发货</el-button>
|
|
<!-- <el-button size="mini" @click="handleViewLogistics(scope.$index, scope.row)"
|
|
v-show="scope.row.status > 2 || scope.row.status < 9">订单跟踪</el-button> -->
|
|
<!-- <el-button size="mini" type="danger" @click="handleDeleteOrder(scope.$index, scope.row)"
|
|
v-show="scope.row.status === 15">删除订单</el-button> -->
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
</div>
|
|
|
|
<div class="pagination-container">
|
|
<el-pagination background @size-change="handleSizeChange" @current-change="handleCurrentChange"
|
|
layout="total, sizes,prev, pager, next,jumper" :current-page.sync="listQuery.pageNum"
|
|
:page-size="listQuery.pageSize" :page-sizes="[5, 10, 15]" :total="total"></el-pagination>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import checkPermission from '@/utils/permission';
|
|
import {
|
|
formatTime
|
|
} from '@/utils/index';
|
|
import {
|
|
fetchList,
|
|
closeOrder,
|
|
deleteOrder,
|
|
orderData
|
|
} from '@/api/order';
|
|
import {
|
|
formatDate
|
|
} from '@/utils/date';
|
|
import LogisticsDialog from '@/views/oms/order/components/logisticsDialog';
|
|
const defaultListQuery = {
|
|
pageNum: 1,
|
|
pageSize: 10,
|
|
orderSn: null,
|
|
receiverKeyword: null,
|
|
status: null,
|
|
orderType: null,
|
|
sourceType: null,
|
|
createTime: null
|
|
};
|
|
|
|
export default {
|
|
name: 'orderList',
|
|
components: {
|
|
LogisticsDialog
|
|
},
|
|
data() {
|
|
return {
|
|
delLoading: false,
|
|
status: '0',
|
|
orderType: '0',
|
|
createTime: '',
|
|
checkList: [],
|
|
printChecked: false,
|
|
batchHandle: '',
|
|
batchExport: '',
|
|
listContent: [],
|
|
listQuery: Object.assign({}, defaultListQuery),
|
|
listLoading: true,
|
|
list: null,
|
|
total: null,
|
|
operateType: null,
|
|
multipleSelection: [],
|
|
closeOrder: {
|
|
dialogVisible: false,
|
|
content: null,
|
|
orderIds: []
|
|
},
|
|
statusOptions: [{
|
|
label: '待付款',
|
|
value: 12
|
|
},
|
|
{
|
|
label: '待发货',
|
|
value: 2
|
|
},
|
|
{
|
|
label: '已发货',
|
|
value: 3
|
|
},
|
|
{
|
|
label: '已完成',
|
|
value: 5
|
|
},
|
|
{
|
|
label: '申请退款',
|
|
value: 13
|
|
},
|
|
{
|
|
label: '已退款',
|
|
value: 14
|
|
},
|
|
{
|
|
label: '已关闭',
|
|
value: 15
|
|
}
|
|
],
|
|
orderTypeOptions: [{
|
|
label: '正常订单',
|
|
value: 1
|
|
},
|
|
{
|
|
label: '秒杀订单',
|
|
value: 6
|
|
},
|
|
{
|
|
value: 7,
|
|
label: '门店自取订单'
|
|
},
|
|
{
|
|
label: ' 拼团订单',
|
|
value: 2
|
|
},
|
|
{
|
|
label: '团购订单',
|
|
value: 3
|
|
},
|
|
{
|
|
label: '砍价订单',
|
|
value: 4
|
|
},
|
|
{
|
|
label: '积分订单',
|
|
value: 5
|
|
}
|
|
],
|
|
sourceTypeOptions: [{
|
|
label: '小程序订单',
|
|
value: 1
|
|
},
|
|
{
|
|
label: 'APP订单',
|
|
value: 4
|
|
},
|
|
{
|
|
label: 'h5订单',
|
|
value: 2
|
|
},
|
|
{
|
|
label: 'pc订单',
|
|
value: 3
|
|
}
|
|
],
|
|
operateOptions: [{
|
|
label: '批量发货',
|
|
value: 1
|
|
},
|
|
{
|
|
label: '关闭订单',
|
|
value: 2
|
|
},
|
|
{
|
|
label: '删除订单',
|
|
value: 3
|
|
}
|
|
],
|
|
logisticsDialogVisible: false,
|
|
|
|
handleOptions: [{
|
|
value: '',
|
|
label: '批量操作'
|
|
}, {
|
|
value: '0',
|
|
label: '批量打印'
|
|
}],
|
|
exportOptions: [{
|
|
value: '',
|
|
label: '批量导出'
|
|
}, {
|
|
value: '0',
|
|
label: '导出全部'
|
|
}, {
|
|
value: '1',
|
|
label: '导出选中'
|
|
}],
|
|
caculateInfo: {
|
|
orderCount: 0,
|
|
orderPay: 0,
|
|
memberCount: 0
|
|
}
|
|
};
|
|
},
|
|
created() {
|
|
this.$nextTick(() => {
|
|
this.getList();
|
|
this.orderDatas(0);
|
|
});
|
|
},
|
|
filters: {
|
|
formatCreateTime(time) {
|
|
let date = new Date(time);
|
|
return formatDate(date, 'yyyy-MM-dd hh:mm:ss');
|
|
},
|
|
formatPayType(value) { //支付方式:0->未支付;1->支付宝;2->微信
|
|
if (value === 1) {
|
|
return '支付宝';
|
|
} else if (value === 2) {
|
|
return '微信';
|
|
} else if (value === 3) {
|
|
return '余额支付';
|
|
} else if (value === 5) {
|
|
return '积分兑换';
|
|
}
|
|
},
|
|
formatSourceType(value) { //订单来源:0->PC订单;1->app订单
|
|
if (value === 4) {
|
|
return '小程序';
|
|
} else if (value === 2) {
|
|
return 'h5订单';
|
|
} else if (value === 3) {
|
|
return 'PC订单';
|
|
} else if (value === 1) {
|
|
return 'android订单';
|
|
} else if (value === 5) {
|
|
return 'ios订单';
|
|
}
|
|
},
|
|
formatOrderType(value) {
|
|
if (value === 2) {
|
|
return '拼团订单';
|
|
} else if (value === 3) {
|
|
return '团购订单';
|
|
} else if (value === 6) {
|
|
return '秒杀订单';
|
|
} else if (value === 1) {
|
|
return '普通订单';
|
|
} else if (value === 4) {
|
|
return '砍价订单';
|
|
} else if (value === 5) {
|
|
return '积分订单';
|
|
}
|
|
},
|
|
formatStatus(value) { //订单状态:0->待付款;1->待发货;2->已发货;3->已完成;4->已关闭;5->无效订单
|
|
if (value === 12) {
|
|
return '待付款';
|
|
}
|
|
if (value === 1) {
|
|
return '支付成功,没有回掉';
|
|
} else if (value === 2) {
|
|
return '待发货';
|
|
} else if (value === 3) {
|
|
return '待收货';
|
|
} else if (value === 4) {
|
|
return '待评价';
|
|
} else if (value === 5) {
|
|
return '已完成';
|
|
} else if (value === 6) {
|
|
return '维权中';
|
|
} else if (value === 7) {
|
|
return '维权已完成';
|
|
} else if (value === 8) {
|
|
return '待分享';
|
|
} else if (value === 13) {
|
|
return '申请退款';
|
|
} else if (value === 14) {
|
|
return '已退款';
|
|
} else if (value === 15) {
|
|
return '已关闭';
|
|
} else if (value === 16) {
|
|
return '无效订单';
|
|
} else if (value === 17) {
|
|
return '已删除';
|
|
}
|
|
}
|
|
},
|
|
methods: {
|
|
formatTime,
|
|
checkPermission,
|
|
handleOrder(tab, event) {
|
|
this.listQuery.status = tab.name;
|
|
this.getList();
|
|
this.orderDatas(tab.name);
|
|
console.log("tab", tab)
|
|
},
|
|
handleResetSearch() {
|
|
this.listQuery = Object.assign({}, defaultListQuery);
|
|
},
|
|
handleSearchList() {
|
|
this.listQuery.pageNum = 1;
|
|
this.getList();
|
|
},
|
|
handleSelectionChange(val) {
|
|
this.multipleSelection = val;
|
|
},
|
|
handleViewOrder(index, row) {
|
|
this.$router.push({
|
|
path: '/oms/orderDetail',
|
|
query: {
|
|
id: row.id
|
|
}
|
|
});
|
|
},
|
|
handleCloseOrder(index, row) {
|
|
this.closeOrder.dialogVisible = true;
|
|
this.closeOrder.orderIds = [row.id];
|
|
},
|
|
handleDeliveryOrder(index, row) {
|
|
let listItem = this.covertOrder(row);
|
|
console.log("listItem", listItem)
|
|
this.$router.push({
|
|
path: '/oms/deliverOrderList',
|
|
query: {
|
|
list: [listItem]
|
|
}
|
|
});
|
|
},
|
|
handleViewLogistics(index, row) {
|
|
this.logisticsDialogVisible = true;
|
|
},
|
|
handleDeleteOrder(index, row) { //删除订单
|
|
let id = [];
|
|
id.push(row.id);
|
|
this.deleteOrder(id);
|
|
},
|
|
handleBatchOperate() {
|
|
if (this.multipleSelection == null || this.multipleSelection.length < 1) {
|
|
this.$message({
|
|
message: '请选择要操作的订单',
|
|
type: 'warning',
|
|
duration: 1000
|
|
});
|
|
return;
|
|
}
|
|
if (this.operateType === 1) {
|
|
//批量发货
|
|
let list = [];
|
|
for (let i = 0; i < this.multipleSelection.length; i++) {
|
|
if (this.multipleSelection[i].status === 1) {
|
|
list.push(this.covertOrder(this.multipleSelection[i]));
|
|
}
|
|
}
|
|
if (list.length === 0) {
|
|
this.$message({
|
|
message: '选中订单中没有可以发货的订单',
|
|
type: 'warning',
|
|
duration: 1000
|
|
});
|
|
return;
|
|
}
|
|
this.$router.push({
|
|
path: '/oms/deliverOrderList',
|
|
query: {
|
|
list: list
|
|
}
|
|
});
|
|
} else if (this.operateType === 2) {
|
|
//关闭订单
|
|
this.closeOrder.orderIds = [];
|
|
for (let i = 0; i < this.multipleSelection.length; i++) {
|
|
this.closeOrder.orderIds.push(this.multipleSelection[i].id);
|
|
}
|
|
this.closeOrder.dialogVisible = true;
|
|
} else if (this.operateType === 3) {
|
|
//删除订单
|
|
let ids = [];
|
|
for (let i = 0; i < this.multipleSelection.length; i++) {
|
|
ids.push(this.multipleSelection[i].id);
|
|
}
|
|
this.deleteOrder(ids);
|
|
}
|
|
},
|
|
// 设置每页几条
|
|
handleSizeChange(val) {
|
|
this.listQuery.pageNum = 1;
|
|
this.listQuery.pageSize = val;
|
|
this.getList();
|
|
},
|
|
// 查看第几页数据
|
|
handleCurrentChange(val) {
|
|
this.listQuery.pageNum = val;
|
|
this.getList();
|
|
},
|
|
handleCloseOrderConfirm() {
|
|
if (this.closeOrder.content == null || this.closeOrder.content === '') {
|
|
this.$message({
|
|
message: '操作备注不能为空',
|
|
type: 'warning',
|
|
duration: 1000
|
|
});
|
|
return;
|
|
}
|
|
let params = new URLSearchParams();
|
|
params.append('ids', this.closeOrder.orderIds);
|
|
params.append('note', this.closeOrder.content);
|
|
closeOrder(params).then(response => {
|
|
this.closeOrder.orderIds = [];
|
|
this.closeOrder.dialogVisible = false;
|
|
this.getList();
|
|
this.$message({
|
|
message: '修改成功',
|
|
type: 'success',
|
|
duration: 1000
|
|
});
|
|
});
|
|
},
|
|
getList() {
|
|
this.listLoading = true;
|
|
if (this.listQuery.status == 0)
|
|
this.listQuery.status = null
|
|
console.log("listQuery", this.listQuery)
|
|
fetchList(this.listQuery).then(response => {
|
|
this.listLoading = false;
|
|
console.log("list", response.data.records)
|
|
this.list = response.data.records;
|
|
this.total = response.data.total;
|
|
});
|
|
},
|
|
orderDatas(status) {
|
|
orderData({
|
|
status: status
|
|
}).then(response => {
|
|
this.caculateInfo = response.data;
|
|
});
|
|
},
|
|
|
|
deleteOrder(id) {
|
|
this.$confirm('是否要进行该删除操作?', '提示', {
|
|
confirmButtonText: '确定',
|
|
cancelButtonText: '取消',
|
|
type: 'warning'
|
|
}).then(() => {
|
|
let params = new URLSearchParams();
|
|
params.append('id', id);
|
|
deleteOrder(params).then(response => {
|
|
this.$message({
|
|
message: '删除成功!',
|
|
type: 'success',
|
|
duration: 1000
|
|
});
|
|
this.getList();
|
|
});
|
|
});
|
|
},
|
|
covertOrder(order) {
|
|
let address = order.receiverRegion + order
|
|
.receiverDetailAddress;
|
|
|
|
let listItem = {
|
|
orderId: order.id,
|
|
orderSn: order.orderSn,
|
|
receiverName: order.receiverName,
|
|
receiverPhone: order.receiverPhone,
|
|
receiverPostCode: order.receiverPostCode,
|
|
address: address,
|
|
deliveryCompany: null,
|
|
deliverySn: null
|
|
};
|
|
return listItem;
|
|
},
|
|
beforeInit() {
|
|
this.url = 'api/yxStoreOrder';
|
|
const sort = 'id,desc';
|
|
this.params = {
|
|
page: this.page,
|
|
size: this.size,
|
|
sort: sort,
|
|
orderStatus: this.status,
|
|
orderType: this.orderType,
|
|
addTime: this.createTime,
|
|
listContent: this.listContent
|
|
};
|
|
const query = this.query;
|
|
const type = query.type;
|
|
|
|
return true;
|
|
},
|
|
|
|
getCaculateInfo() {},
|
|
clearCaculateInfo() {
|
|
this.caculateInfo = {
|
|
orderCount: 0,
|
|
orderPay: 0,
|
|
memberCount: 0
|
|
};
|
|
},
|
|
|
|
batchSelection(val) {
|
|
let rows = this.data;
|
|
if (val) {
|
|
rows.forEach(row => {
|
|
this.$refs.multipleTable.toggleRowSelection(row);
|
|
});
|
|
} else {
|
|
this.$refs.multipleTable.clearSelection();
|
|
}
|
|
},
|
|
handlePrintOption(val) {
|
|
switch (val) {
|
|
case '0':
|
|
this.getPrintList();
|
|
this.batchHandle = '';
|
|
break;
|
|
default:
|
|
break;
|
|
}
|
|
},
|
|
handleExportOption(val) {
|
|
let list = this.checkList;
|
|
this.page = 0;
|
|
this.size = 10000;
|
|
switch (val) {
|
|
case '0':
|
|
this.listContent = '';
|
|
this.beforeInit();
|
|
this.downloadMethod();
|
|
break;
|
|
case '1':
|
|
if (list.length == 0) {
|
|
this.$message({
|
|
message: '请选择订单',
|
|
type: 'warning'
|
|
});
|
|
} else {
|
|
this.listContent = [];
|
|
list.forEach(item => {
|
|
this.listContent.push(item.orderId);
|
|
});
|
|
this.listContent = JSON.stringify(this.listContent);
|
|
this.beforeInit();
|
|
this.downloadMethod();
|
|
}
|
|
break;
|
|
default:
|
|
break;
|
|
}
|
|
this.batchExport = '';
|
|
},
|
|
downloadMethod() {
|
|
this.beforeInit();
|
|
this.downloadLoading = true;
|
|
download(process.env.BASE_API + '/download', this.params)
|
|
.then(result => {
|
|
this.downloadFile(result, this.title + '数据', 'xlsx');
|
|
this.downloadLoading = false;
|
|
})
|
|
.catch(() => {
|
|
this.downloadLoading = false;
|
|
});
|
|
},
|
|
// 下载文件
|
|
downloadFile(obj, name, suffix) {
|
|
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()) + '-' + name + '.' + suffix;
|
|
link.setAttribute('download', fileName);
|
|
document.body.appendChild(link);
|
|
link.click();
|
|
document.body.removeChild(link);
|
|
},
|
|
getPrintList() {
|
|
let list = this.checkList;
|
|
if (list.length == 0) {
|
|
this.$message({
|
|
message: '请选择订单',
|
|
type: 'warning'
|
|
});
|
|
} else {
|
|
const _this = this.$refs.form5;
|
|
_this.dialog = true;
|
|
}
|
|
},
|
|
checkboxT(row, rowIndex) {
|
|
return row.id !== 1;
|
|
}
|
|
}
|
|
};
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.container {
|
|
height: calc(100% - 80px);
|
|
position: absolute;
|
|
overflow: auto;
|
|
width: calc(100% - 20px);
|
|
|
|
.order-caculate {
|
|
font-size: 14px;
|
|
color: #909399;
|
|
border-top: 1px solid #f0f0f0;
|
|
padding: 20px 10px;
|
|
|
|
.caculate-title {
|
|
display: inline-block;
|
|
margin-right: 50px;
|
|
}
|
|
|
|
.caculate-num {
|
|
font-size: 20px;
|
|
color: #ff4949;
|
|
}
|
|
}
|
|
|
|
.el-table th {
|
|
background-color: #fafafa;
|
|
}
|
|
}
|
|
|
|
.footer-contains {
|
|
position: absolute;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
background-color: #f6f6f6;
|
|
bottom: 0;
|
|
flex-align: center;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
width: 100%;
|
|
z-index: 999;
|
|
padding: 0 20px 0 13px;
|
|
}
|
|
|
|
/*打印单样式编辑*/
|
|
.order-list {
|
|
/* height: 297mm;*/
|
|
margin: 0 auto;
|
|
width: 210mm;
|
|
|
|
.order-title {
|
|
height: 16mm;
|
|
line-height: 16mm;
|
|
font-size: 8mm;
|
|
font-weight: bolder;
|
|
text-align: center;
|
|
}
|
|
|
|
.order-info {
|
|
span {
|
|
display: inline-block;
|
|
padding: 0 0 10px 0;
|
|
font-size: 3mm;
|
|
}
|
|
|
|
span.info {
|
|
width: 60mm;
|
|
}
|
|
}
|
|
|
|
.el-table--small th,
|
|
.el-table--small td {
|
|
padding: 4px 0;
|
|
}
|
|
}
|
|
</style>
|
|
|