<template>
|
<view class="freightForwarder-index">
|
<view class="freightForwarder-index-body">
|
<card v-for="(item, index) in orderPlanData" :key="index" :name="item.id" @click="cardBodyClick" backgroundType="1">
|
<template v-slot:left>
|
<view class="card-left__top">
|
<text>{{ item.orderPlan.cars }}</text>
|
张
|
</view>
|
<view class="card-left__utils"><u-button text="转发" type="primary" @tap.stop="forwardClick(item.id)" shape="circle"></u-button></view>
|
</template>
|
<template v-slot:right-top>
|
<view class="right-top">
|
<view class="card-right-top-row">
|
<view>
|
<text>{{ item.orderPlan.compName }}</text>
|
</view>
|
<view>
|
<text>{{ item.orderPlan.coalName }}</text>
|
</view>
|
</view>
|
</view>
|
</template>
|
<template v-slot:right-bottom>
|
<view class="code">
|
<text>编号：{{ item.orderPlan.code }}</text>
|
</view>
|
</template>
|
</card>
|
</view>
|
</view>
|
</template>
|
|
<script>
|
export default {
|
data() {
|
return {
|
orderPlanData: []
|
};
|
},
|
onShow() {
|
this.init();
|
},
|
computed: {
|
huoDaiId() {
|
return uni.getStorageSync('userInfo').id;
|
}
|
},
|
methods: {
|
init() {
|
this.huoDaiList();
|
},
|
huoDaiList() {
|
this.$reqGet('huoDaiList').then(res => {
|
this.orderPlanData = res.data;
|
});
|
},
|
cardBodyClick(id) {
|
uni.navigateTo({
|
url: `/pages/customer-page/customer-index/fayunPlanDetails/fayunPlanDetails?orderPlanId=${id}`
|
});
|
},
|
// 转发
|
forwardClick(id) {
|
uni.navigateTo({
|
url: `/pages/public-page/forward/forward?orderPlanId=${id}`
|
});
|
}
|
}
|
};
|
</script>
|
|
<style lang="scss" scoped>
|
::v-deep.freightForwarder-index {
|
width: 94%;
|
margin: 0 auto;
|
// 主体
|
.freightForwarder-index-body {
|
margin-bottom: vww(56);
|
|
// 卡片样式
|
.card-left__top {
|
margin-top:vww(26);
|
text-align: center;
|
color: #ffffff;
|
text {
|
font-size: vww(48);
|
font-weight: 800;
|
}
|
}
|
.card-left__utils {
|
display: flex;
|
padding: 0 vww(15) 0 vww(15);
|
.u-button {
|
width: vww(55);
|
height: vww(24);
|
background-color: #fff;
|
color: #1987ff;
|
}
|
}
|
.right-top {
|
display: flex;
|
flex-flow: column nowrap;
|
align-content: space-around;
|
.card-right-top-row {
|
margin-top: vww(26);
|
text-align: center;
|
&:nth-child(1) {
|
display: flex;
|
justify-content: space-between;
|
view {
|
text-align: center;
|
width: 50%;
|
}
|
}
|
}
|
}
|
|
.code {
|
margin-top: vww(2);
|
text-align: center;
|
}
|
}
|
}
|
</style>
|
