|
@@ -2,27 +2,27 @@
|
|
|
<div id="form-1">
|
|
|
<el-row>
|
|
|
<el-col :span="24" class="main animate__animated animate__backInRight">
|
|
|
- <el-col class="top_btn">
|
|
|
- <el-button type="primary" size="mini" @click="toBack()">返回</el-button>
|
|
|
- </el-col>
|
|
|
- <el-col :span="24" class="one" v-if="data"> <span>发货清单</span> </el-col>
|
|
|
- <el-col :span="24" class="two" v-if="data">
|
|
|
- <el-col :span="12" v-for="(item, index) in data" :key="index">
|
|
|
+ <el-col class="top_btn"><el-button type="primary" size="mini" @click="toBack()">返回</el-button></el-col>
|
|
|
+ <el-col :span="24" class="one"> <span>发货清单</span> </el-col>
|
|
|
+ <el-col class="top_btn"> <el-button type="primary" @click="toFile()">导出清单</el-button></el-col>
|
|
|
+ <el-col :span="24" class="two">
|
|
|
+ <el-col :span="15" v-for="(item, index) in list" :key="index">
|
|
|
<el-card class="box-card">
|
|
|
- <div slot="header" class="clearfix">
|
|
|
- <el-col class="shop">{{ item.shop.name }}</el-col>
|
|
|
- <el-col>买家:{{ item.customer.name }}</el-col>
|
|
|
+ <el-col class="clearfix">
|
|
|
<el-col>收货人:{{ item.address.name }},{{ item.address.phone }}</el-col>
|
|
|
<el-col>收货人地址:{{ item.address.province }},{{ item.address.city }},{{ item.address.area }},{{ item.address.address }}</el-col>
|
|
|
- <el-button style="float: right" type="primary" @click="toFile()">导出</el-button>
|
|
|
- </div>
|
|
|
- <el-table border :data="item.goods" style="width: 100%">
|
|
|
- <el-table-column prop="goods.name" label="商品姓名" width="180"> </el-table-column>
|
|
|
- <el-table-column prop="name" label="商品规格"> </el-table-column>
|
|
|
- <el-table-column prop="buy_num" label="商品数量"> </el-table-column>
|
|
|
- </el-table>
|
|
|
- <el-col>
|
|
|
- <!-- <data-table :fields="fields" :data="item.goods"> </data-table> -->
|
|
|
+ </el-col>
|
|
|
+ <el-col class="two_1">
|
|
|
+ <data-table
|
|
|
+ :select="true"
|
|
|
+ :selected="selected"
|
|
|
+ @handleSelect="(e) => handleSelect(e, item.address)"
|
|
|
+ rowKey="index"
|
|
|
+ :usePage="false"
|
|
|
+ :fields="fields"
|
|
|
+ :data="item.goodsList"
|
|
|
+ >
|
|
|
+ </data-table>
|
|
|
</el-col>
|
|
|
</el-card>
|
|
|
</el-col>
|
|
@@ -34,7 +34,6 @@
|
|
|
|
|
|
<script>
|
|
|
const _ = require('lodash');
|
|
|
-const moment = require('moment');
|
|
|
import { mapState, mapGetters, createNamespacedHelpers } from 'vuex';
|
|
|
const { mapActions } = createNamespacedHelpers('order');
|
|
|
export default {
|
|
@@ -43,11 +42,16 @@ export default {
|
|
|
components: {},
|
|
|
data: function () {
|
|
|
return {
|
|
|
+ list: [],
|
|
|
fields: [
|
|
|
+ { label: '订单id', model: 'order_id' },
|
|
|
+ { label: '订单编号', model: 'order_no' },
|
|
|
{ label: '商品名称', model: 'goods.name' },
|
|
|
{ label: '商品规格', model: 'name' },
|
|
|
{ label: '商品数量', model: 'buy_num' },
|
|
|
],
|
|
|
+ selected: [],
|
|
|
+ fileList: [],
|
|
|
};
|
|
|
},
|
|
|
async created() {
|
|
@@ -57,9 +61,53 @@ export default {
|
|
|
...mapActions(['query', 'fetch', 'create', 'update']),
|
|
|
// 查询
|
|
|
async search() {
|
|
|
- console.log(this.data);
|
|
|
+ let data = this.data;
|
|
|
+ let test = _(data).groupBy('address._id').values().value();
|
|
|
+ let list = [];
|
|
|
+ for (const p1 of test) {
|
|
|
+ let goodsList = [];
|
|
|
+ for (const p2 of p1) {
|
|
|
+ for (const p3 of p2.goods) {
|
|
|
+ p3.order_id = p2.id;
|
|
|
+ p3.order_no = p2.no;
|
|
|
+ }
|
|
|
+ goodsList.push(...p2.goods);
|
|
|
+ let i = 0;
|
|
|
+ for (const p4 of goodsList) {
|
|
|
+ p4.index = i;
|
|
|
+ i++;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ let address = p1[0].address;
|
|
|
+ list.push({ goodsList, address });
|
|
|
+ }
|
|
|
+ this.$set(this, 'list', list);
|
|
|
+ },
|
|
|
+ handleSelect(goodsList, address) {
|
|
|
+ let fileList = [];
|
|
|
+ if (this.fileList.length == 0) {
|
|
|
+ fileList.push({ goodsList, address });
|
|
|
+ this.$set(this, 'fileList', fileList);
|
|
|
+ } else {
|
|
|
+ for (const val of this.fileList) {
|
|
|
+ // 判断this.fileList里是否有和选中的地址id相同的
|
|
|
+ if (val.address._id == address._id) {
|
|
|
+ // 判断是否有选中的商品,没有就过滤掉
|
|
|
+ if (goodsList.length == 0) {
|
|
|
+ let p2 = this.fileList.filter((f) => f.address._id != address._id);
|
|
|
+ this.fileList = p2;
|
|
|
+ } else {
|
|
|
+ val.goodsList = goodsList;
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ this.fileList.push({ goodsList, address });
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ console.log(this.fileList);
|
|
|
},
|
|
|
toFile() {
|
|
|
+ console.log(this.fileList);
|
|
|
this.$message({ message: '导出成功', type: 'success' });
|
|
|
},
|
|
|
// 返回
|
|
@@ -92,7 +140,6 @@ export default {
|
|
|
}
|
|
|
.one {
|
|
|
margin: 0 0 10px 0;
|
|
|
-
|
|
|
span:nth-child(1) {
|
|
|
font-size: 20px;
|
|
|
font-weight: 700;
|
|
@@ -100,9 +147,19 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
.two {
|
|
|
- // margin: 5px;
|
|
|
+ margin: 5px 10%;
|
|
|
+ .data-table {
|
|
|
+ margin: 5px 0;
|
|
|
+ }
|
|
|
+ .clearfix {
|
|
|
+ margin: 4px 0;
|
|
|
+ .el-col {
|
|
|
+ margin: 4px 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
.box-card {
|
|
|
margin: 5px;
|
|
|
+ padding: 5px 0 20px 0;
|
|
|
}
|
|
|
.shop {
|
|
|
text-align: center;
|
|
@@ -111,15 +168,6 @@ export default {
|
|
|
.item {
|
|
|
margin-bottom: 18px;
|
|
|
}
|
|
|
-
|
|
|
- .clearfix:before,
|
|
|
- .clearfix:after {
|
|
|
- display: table;
|
|
|
- content: '';
|
|
|
- }
|
|
|
- .clearfix:after {
|
|
|
- clear: both;
|
|
|
- }
|
|
|
}
|
|
|
}
|
|
|
</style>
|