<template>
|
<div id="full" class="cancel-success">
|
<div style="background: #d8dbe0">
|
<order-nav :back="false" @back="onBack()">
|
<template>
|
<div
|
class="flex items-center"
|
@click="
|
$router.push({
|
path: '/chat',
|
})
|
"
|
>
|
<img
|
class="w-35 h-33 mr-22"
|
src="~@/assets/image/c2c/Vector.png"
|
alt=""
|
/>
|
<span class="font-28">{{ $t("联系卖家") }}</span>
|
</div>
|
</template>
|
</order-nav>
|
<div class="">
|
<div
|
class="flex justify-between items-center pb-33 px-32"
|
style="background: #d8dbe0"
|
>
|
<div>
|
<p class="mb-8 font-48">
|
<slot name="title">{{ $t("已取消") }}</slot>
|
</p>
|
<p class="font-24">
|
<slot name="desc">{{ $t("您已取消订单") }}</slot>
|
</p>
|
</div>
|
<div>
|
<img
|
class="w-80 h-80"
|
src="~@/assets/image/c2c/Group1212.png"
|
alt=""
|
/>
|
</div>
|
</div>
|
</div>
|
</div>
|
<div class="px-32 pt-40 mainBackground">
|
<order-data :detail="detail" />
|
</div>
|
<div class="w-full h-16 my-40 diviLine"></div>
|
<van-cell-group class="px-32">
|
<van-cell @click="enterAppeal">
|
<template #title>
|
<span class="c2cColor font-30">{{ $t("对订单存在疑问") }}</span>
|
</template>
|
<template #default>
|
<van-icon class="font-700 text-grey" name="arrow" />
|
</template>
|
</van-cell>
|
</van-cell-group>
|
</div>
|
</template>
|
|
<script>
|
import { Cell, CellGroup, Icon } from "vant";
|
import OrderNav from "@/components/order-nav/OrderNav";
|
import OrderData from "@/page/c2cOrder/components/order-data/OrderData";
|
|
export default {
|
name: "CancelSuccess",
|
// props:['title','count', 'totalPrice', 'orderNumber', 'createOrderTime', 'sellerName', 'unitPrice'],
|
props: {
|
detail: {
|
type: Object,
|
default() {
|
return {};
|
},
|
},
|
},
|
methods: {
|
enterAppeal() {
|
this.$router.replace({
|
path: "/appeal",
|
});
|
},
|
onBack() {
|
this.$router.push("/wantBuy");
|
},
|
},
|
components: {
|
[Cell.name]: Cell,
|
[CellGroup.name]: CellGroup,
|
[Icon.name]: Icon,
|
OrderNav,
|
OrderData,
|
},
|
};
|
</script>
|
|
<style lang="scss" scoped>
|
#full {
|
::v-deep .buy_nav {
|
.van-icon {
|
color: #000;
|
}
|
}
|
::v-deep .van-nav-bar {
|
background: #d8dbe0;
|
}
|
|
::v-deep .order-number {
|
margin-top: 100px;
|
}
|
|
::v-deep .van-cell {
|
padding: 15px 20px !important;
|
@include themify() {
|
background: themed("main_background");
|
}
|
}
|
|
::v-deep {
|
.van-cell-group,
|
.van-cell {
|
@include themify() {
|
color: themed("text_color1");
|
}
|
|
@include themify() {
|
background: themed("main_background");
|
}
|
}
|
|
.van-cell__value {
|
@include themify() {
|
color: themed("text_color");
|
}
|
}
|
}
|
}
|
</style>
|