状态修正，订单卡片调整
This commit is contained in:
parent
e470a4fc56
commit
388eb48dc1
|
|
@ -406,42 +406,15 @@ export default {
|
|||
// 更新步骤列表
|
||||
updateStepList() {
|
||||
this.stepList = [
|
||||
{ title: '待接单', description: '' },
|
||||
{ title: '待出库', description: '' },
|
||||
{ title: '待收货', description: '' },
|
||||
{ title: '共享中', description: '' },
|
||||
{ title: '订单完成', description: '' }
|
||||
{ title: '待确认', description: '' },
|
||||
{ title: '已确认', description: '' }
|
||||
];
|
||||
|
||||
if (this.orderStatus == 1) {
|
||||
if (this.orderStatus === 1) {
|
||||
this.currentActive = 0;
|
||||
} else if (this.orderStatus == 2) {
|
||||
} else if (this.orderStatus === 2) {
|
||||
this.currentActive = 1;
|
||||
this.stepList[0].title = '已接单';
|
||||
} else if (this.orderStatus == 3) {
|
||||
this.stepList[0].title = '已接单';
|
||||
this.stepList[1].title = '已出库';
|
||||
this.currentActive = 2;
|
||||
} else if (this.orderStatus == 4) {
|
||||
this.stepList[0].title = '已接单';
|
||||
this.stepList[1].title = '已出库';
|
||||
this.stepList[2].title = '已收货';
|
||||
this.currentActive = 3;
|
||||
} else if (this.orderStatus == 5) {
|
||||
this.stepList[0].title = '已接单';
|
||||
this.stepList[1].title = '已出库';
|
||||
this.stepList[2].title = '已收货';
|
||||
this.currentActive = 4;
|
||||
} else if (this.orderStatus == 20) {
|
||||
this.stepList[0].title = '已接单';
|
||||
this.stepList[1].title = '已出库';
|
||||
this.stepList[2].title = '已收货';
|
||||
this.stepList[3].title = '共享结束';
|
||||
this.currentActive = 4;
|
||||
} else if (this.orderStatus == 99) {
|
||||
this.stepList[0].title = '订单取消';
|
||||
this.isReject = true;
|
||||
this.currentActive = 0;
|
||||
this.stepList[0].title = '已确认';
|
||||
}
|
||||
|
||||
this.$forceUpdate();
|
||||
|
|
|
|||
|
|
@ -50,6 +50,8 @@
|
|||
maxlength="20"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">查询</el-button>
|
||||
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
||||
</el-row>
|
||||
<!-- <el-form-item prop="lowerBound">
|
||||
<el-input
|
||||
|
|
@ -72,10 +74,7 @@
|
|||
style="width:100px"
|
||||
/>
|
||||
</el-form-item>-->
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">查询</el-button>
|
||||
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
||||
</el-form-item>
|
||||
|
||||
</el-form>
|
||||
<template v-if="cardList.length > 0">
|
||||
<div class="cart-tbody" v-for="(item, index) in cardList" :key="index">
|
||||
|
|
@ -155,7 +154,7 @@
|
|||
class="order-items order-info"
|
||||
:style="
|
||||
j != item.detailsList.length - 1
|
||||
? 'border-bottom:1px solid #eee'
|
||||
? 'border-bottom:1px solid #f0f0f0'
|
||||
: ''
|
||||
"
|
||||
style="min-height: 80px"
|
||||
|
|
@ -238,7 +237,7 @@
|
|||
class="order-info"
|
||||
:style="
|
||||
j != item.detailsList.length - 1
|
||||
? 'border-bottom:1px solid #eee'
|
||||
? 'border-bottom:1px solid #f0f0f0'
|
||||
: ''
|
||||
"
|
||||
style="min-height: 80px"
|
||||
|
|
@ -260,7 +259,7 @@
|
|||
: ''
|
||||
"
|
||||
>
|
||||
{{ goods.rentBeginTime }}至{{ goods.rentEndTime }}
|
||||
{{ formatDate(goods.rentBeginTime) }}至{{ formatDate(goods.rentEndTime) }}
|
||||
</div>
|
||||
|
||||
<div
|
||||
|
|
@ -285,7 +284,7 @@
|
|||
"
|
||||
style="min-height: 80px; width: 95%"
|
||||
>
|
||||
<el-tag effect="light">{{ item.orderStatus == '1' ? '待接单' : '已接单'}}
|
||||
<el-tag effect="light">{{ item.orderStatus == '1' ? '待确认' : '已确认'}}
|
||||
</el-tag>
|
||||
</div>
|
||||
</el-col>-->
|
||||
|
|
@ -366,7 +365,7 @@
|
|||
<el-table-column prop="days" align="center" label="共享天数"/>
|
||||
<el-table-column prop="days" align="center" label="租期">
|
||||
<template #default="{ row }">
|
||||
{{ `${row.preOutboundTime}至${row.rentOverTime} ` }}
|
||||
{{ formatDate(row.preOutboundTime) + '至' + formatDate(row.rentOverTime) }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!-- <el-table-column prop="costs" align="center" label="共享费用(元)" width="160">
|
||||
|
|
@ -633,8 +632,8 @@ export default {
|
|||
orderId: '',
|
||||
statusList:
|
||||
[
|
||||
{ id: '1', name: '待接单' },
|
||||
{ id: '2', name: '已接单' }
|
||||
{ id: '1', name: '待确认' },
|
||||
{ id: '2', name: '已确认' }
|
||||
],
|
||||
ids: [],
|
||||
// 总条数
|
||||
|
|
@ -677,6 +676,12 @@ export default {
|
|||
this.getList()
|
||||
},
|
||||
methods: {
|
||||
// 仅保留日期（YYYY-MM-DD）
|
||||
formatDate(dateStr) {
|
||||
if (!dateStr) return ''
|
||||
const s = String(dateStr)
|
||||
return s.length >= 10 ? s.slice(0, 10) : s
|
||||
},
|
||||
orderText(status) {
|
||||
const foundStatus = this.statusList.find(e => e.id === status)
|
||||
return foundStatus ? foundStatus.name : '未知状态'
|
||||
|
|
@ -827,10 +832,11 @@ export default {
|
|||
|
||||
.cart-tbody {
|
||||
background: #fff;
|
||||
padding: 8px 12px;
|
||||
margin-bottom: 6px;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
|
||||
padding: 16px;
|
||||
margin-bottom: 14px;
|
||||
border-radius: 10px;
|
||||
border: 1px solid #ddd;
|
||||
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
|
||||
|
||||
.cart-user-info {
|
||||
display: flex;
|
||||
|
|
@ -923,9 +929,20 @@ export default {
|
|||
|
||||
.order-title-info {
|
||||
position: relative;
|
||||
padding: 6px 4px;
|
||||
padding: 8px 0;
|
||||
font-size: 14px;
|
||||
color: #999;
|
||||
color: #666;
|
||||
|
||||
span:first-child {
|
||||
color: #666;
|
||||
}
|
||||
span + span {
|
||||
color: #333;
|
||||
}
|
||||
|
||||
&:not(:last-child) {
|
||||
margin-bottom: 6px;
|
||||
}
|
||||
|
||||
.order-type-box {
|
||||
position: absolute;
|
||||
|
|
@ -935,12 +952,12 @@ export default {
|
|||
}
|
||||
|
||||
.order-items {
|
||||
border-right: 1px solid #eee;
|
||||
border-right: 1px solid #f0f0f0;
|
||||
}
|
||||
|
||||
.order-info {
|
||||
display: flex;
|
||||
padding: 4px 0;
|
||||
padding: 8px 0;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
|
@ -950,7 +967,7 @@ export default {
|
|||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-right: 1px solid #eee;
|
||||
border-right: 1px solid #f0f0f0;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -61,12 +61,10 @@
|
|||
maxlength="20"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-row>
|
||||
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">查询</el-button>
|
||||
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-row>
|
||||
|
||||
</el-form>
|
||||
|
||||
<!-- 订单列表 -->
|
||||
|
|
@ -129,7 +127,7 @@
|
|||
v-for="(goods, j) in item.detailsList"
|
||||
:key="j"
|
||||
class="order-items order-info"
|
||||
:style="j != item.detailsList.length - 1 ? 'border-bottom:1px solid #eee' : ''"
|
||||
:style="j != item.detailsList.length - 1 ? 'border-bottom:1px solid #f0f0f0' : ''"
|
||||
style="min-height: 80px"
|
||||
>
|
||||
<img :src="goods.url" style="width: 110px; height: 70px" alt="装备图片"/>
|
||||
|
|
@ -171,7 +169,7 @@
|
|||
v-for="(goods, j) in item.detailsList"
|
||||
:key="j"
|
||||
class="order-info"
|
||||
:style="j != item.detailsList.length - 1 ? 'border-bottom:1px solid #eee' : ''"
|
||||
:style="j != item.detailsList.length - 1 ? 'border-bottom:1px solid #f0f0f0' : ''"
|
||||
style="min-height: 80px"
|
||||
>
|
||||
<div style="display: flex; justify-content: center; align-items: center; flex-direction: column">
|
||||
|
|
@ -180,7 +178,7 @@
|
|||
style="font-weight: bold; margin-top: 10px"
|
||||
:style="item.orderStatus == 20 ? 'text-decoration: line-through' : ''"
|
||||
>
|
||||
{{ goods.rentBeginTime }}至{{ goods.rentEndTime }}
|
||||
{{ formatDate(goods.rentBeginTime) }}至{{ formatDate(goods.rentEndTime) }}
|
||||
</div>
|
||||
<div style="font-weight: bold; margin-top: 10px" v-if="item.orderStatus == 20">
|
||||
{{ goods.takeOverTime ? goods.takeOverTime.slice(0, 10) : '' }}至
|
||||
|
|
@ -273,7 +271,7 @@
|
|||
<el-table-column prop="days" align="center" label="共享天数"/>
|
||||
<el-table-column align="center" label="租期">
|
||||
<template #default="{ row }">
|
||||
{{ `${row.preOutboundTime}至${row.rentOverTime} ` }}
|
||||
{{ formatDate(row.preOutboundTime) + '至' + formatDate(row.rentOverTime) }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
|
@ -474,8 +472,8 @@ export default {
|
|||
orderStatus: '',
|
||||
orderId: '',
|
||||
statusList: [
|
||||
{ id: '1', name: '待接单' },
|
||||
{ id: '2', name: '已接单' }
|
||||
{ id: '1', name: '待确认' },
|
||||
{ id: '2', name: '已确认' }
|
||||
],
|
||||
|
||||
// 分页和查询
|
||||
|
|
@ -514,6 +512,13 @@ export default {
|
|||
this.getList()
|
||||
},
|
||||
methods: {
|
||||
// 仅保留日期（YYYY-MM-DD）
|
||||
formatDate(dateStr) {
|
||||
if (!dateStr) return ''
|
||||
// 兼容 'YYYY-MM-DD HH:mm:ss' 或 ISO 字符串
|
||||
const s = String(dateStr)
|
||||
return s.length >= 10 ? s.slice(0, 10) : s
|
||||
},
|
||||
// 获取订单状态文本
|
||||
orderText(status) {
|
||||
const foundStatus = this.statusList.find(e => e.id === status)
|
||||
|
|
@ -606,10 +611,11 @@ export default {
|
|||
<style lang="scss" scoped>
|
||||
.cart-tbody {
|
||||
background: #fff;
|
||||
padding: 8px 12px;
|
||||
margin-bottom: 6px;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
|
||||
padding: 16px;
|
||||
margin-bottom: 14px;
|
||||
border-radius: 10px;
|
||||
border: 1px solid #ddd;
|
||||
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
|
||||
}
|
||||
|
||||
:deep .el-form--inline .el-form-item {
|
||||
|
|
@ -619,9 +625,21 @@ export default {
|
|||
|
||||
.order-title-info {
|
||||
position: relative;
|
||||
padding: 6px 4px;
|
||||
padding: 8px 0;
|
||||
font-size: 14px;
|
||||
color: #999;
|
||||
color: #666;
|
||||
|
||||
// 标签与内容的层级：标签次要、内容主要
|
||||
span:first-child {
|
||||
color: #666;
|
||||
}
|
||||
span + span {
|
||||
color: #333;
|
||||
}
|
||||
|
||||
&:not(:last-child) {
|
||||
margin-bottom: 6px;
|
||||
}
|
||||
|
||||
.order-type-box {
|
||||
position: absolute;
|
||||
|
|
@ -631,12 +649,12 @@ export default {
|
|||
}
|
||||
|
||||
.order-items {
|
||||
border-right: 1px solid #eee;
|
||||
border-right: 1px solid #f0f0f0;
|
||||
}
|
||||
|
||||
.order-info {
|
||||
display: flex;
|
||||
padding: 4px 0;
|
||||
padding: 8px 0;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
|
@ -646,7 +664,7 @@ export default {
|
|||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-right: 1px solid #eee;
|
||||
border-right: 1px solid #f0f0f0;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue