Merge branch 'feature/task1.0.0_xg' into 'feature/task1.0.0'

feat: 完善物流列表

See merge request yanxuan-frontend/shop-pc!22
merge-requests/23/head
肖广 2 years ago
commit 889ea111be

@ -11,27 +11,29 @@
<div class="home-logisitcs-label">我的物流</div>
<!-- 无物流信息 -->
<div
v-if="loadFinish && total === 0"
v-if="loadFinish && list.length === 0"
class="home-logisitcs-empty flex flex-center flex-middle"
>
<img src="~/assets/img/account/home/logisitcs-empty.png" />
</div>
<!-- 有物流信息 -->
<div v-else v-loading="loading">
<div v-infinite-scroll="handleListload" class="home-logisitcs-content">
<div class="home-logisitcs-content">
<div
v-for="item in list"
:key="item.orderNo"
:key="item.orderId"
class="home-logisitcs-content__item flex flex-middle flex-between"
>
<div class="logisitcs-content-item__info flex flex-start">
<img :src="item.img" />
<img :src="item.cover" />
<div class="content-item-info__wrap flex-1">
<p class="item-info-wrap__title">
{{ item.title }}
{{ item.logisticsContext }}
</p>
<div class="item-info-wrap__orderNo">
<span>{{ `${item.companyName}: ${item.orderNo}` }}</span>
<span>{{
`${item.logistics.companyName}: ${item.logistics.trackingNo}`
}}</span>
<span class="item-info-wrap__orderNo--light">查看详情</span>
</div>
</div>
@ -39,7 +41,7 @@
<UiButton
type="yellow_line"
:radius="true"
@click="onOrderEnsure(item)"
@click="onOrderConfirm(item)"
>确认收货</UiButton
>
</div>
@ -47,27 +49,26 @@
</div>
<UiConfirm
title="确认收到货了吗?"
:visible.sync="ensureOrderVisible"
:visible.sync="confirmOrderVisible"
@confirm="handleOrderEnsure"
/>
</div>
</template>
<script>
import { Message } from "element-ui";
import UiButton from "@/components/UiButton.vue";
import UiConfirm from "@/components/UiConfirm.vue";
import { ApiGetOrderLogisticsList } from "@/plugins/api/order";
import {
ApiGetOrderLogisticsList,
ApiPutOrderReceive,
} from "@/plugins/api/order";
export default {
components: { UiButton, UiConfirm },
data() {
return {
total: 0,
query: {
pageIndex: 1,
length: 10,
},
selectOrderId: 0,
ensureOrderVisible: false,
confirmOrderVisible: false,
list: [],
loading: false,
loadFinish: false,
@ -80,31 +81,36 @@ export default {
//
async getLogisticsList() {
this.loading = true;
const { result } = await ApiGetOrderLogisticsList({ ...this.query });
const { result } = await ApiGetOrderLogisticsList();
this.loading = false;
this.loadFinish = true;
if (result) {
const { total, list } = result;
this.total = total;
if (list && list.length > 0) {
this.list = this.list.concat(list);
}
this.list = result.map((item) => {
const goods = item.products || [{ productImageUrl: "" }];
const logisticsList = item.logistics.logisticsDataList || [
{ context: "暂无物流信息" },
];
return {
...item,
cover: goods[0].productImageUrl, //
logisticsContext: logisticsList[0].context, //
};
});
}
},
onOrderEnsure({ orderNo }) {
this.selectOrderId = orderNo;
this.ensureOrderVisible = true;
onOrderConfirm({ orderId }) {
this.selectOrderId = orderId;
this.confirmOrderVisible = true;
},
//
handleOrderEnsure() {},
//
handleListload() {
console.log("enter");
if (this.total > 0 && this.list.length < this.total) {
//
this.query.pageIndex += 1;
async handleOrderEnsure() {
const { result } = await ApiPutOrderReceive({
orderId: this.selectOrderId,
});
this.confirmOrderVisible = false;
if (result) {
Message.success("收货成功");
this.getLogisticsList();
}
},
@ -164,6 +170,7 @@ export default {
font-size: 14px;
color: #666666;
margin-bottom: 8px;
@include ellipses(2);
}
.item-info-wrap__orderNo {
display: inline-block;

@ -68,15 +68,15 @@ export const ApiGetOrderLogistics = ({orderId}) =>
* 获取物流列表
* @param {*} params
*/
export const ApiGetOrderLogisticsList = (params) =>
ToAsyncAwait(axiosTk.get('http://yapi.smart-xwork.cn/mock/148902/logisitcs/list'), { params });
export const ApiGetOrderLogisticsList = () =>
ToAsyncAwait(axiosTk.get(`${BASE_URL}/app/tradeOrder/listReceiveOrder`));
/**
* 确认收货
* @param {*} orderId
*/
export const ApiPutOrderReceive = (params) =>
ToAsyncAwait(axiosTk.put(`${BASE_URL}/app/tradeOrder/receive`, params));
export const ApiPutOrderReceive = (data) =>
ToAsyncAwait(axiosTk.put(`${BASE_URL}/app/tradeOrder/receive`, data));
/**
* 提交订单
* @param {*} data

Loading…
Cancel
Save