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