提交订单

zhc4dev
暖暖 2 years ago
parent 67b892ce29
commit e34520a3a8
  1. 113
      ant-design-vue-jeecg/src/views/shopping/pages/placeOrder.vue

@ -21,30 +21,30 @@
</div> </div>
<div class="steps"> <div class="steps">
<a-steps direction="vertical" size="small" :current="current"> <a-steps direction="vertical" size="small" :current="current">
<a-step title="提交订单" description="2022-12-24 12:23:00" > <a-step title="提交订单" :description="this.model.orderTime" >
<a-icon slot="icon" type="container" /> <a-icon slot="icon" type="container" />
</a-step> </a-step>
<a-step title="已支付" description="This is a description." > <a-step title="已支付" >
<a-icon slot="icon" type="credit-card" /> <a-icon slot="icon" type="credit-card" />
</a-step> </a-step>
<a-step title="待生产" description="This is a description." > <a-step title="待生产" >
<a-icon slot="icon" type="rocket" /> <a-icon slot="icon" type="rocket" />
</a-step> </a-step>
<a-step title="生产中" description="2022-12-24 12:23:00" > <a-step title="生产中" >
<a-icon slot="icon" type="reconciliation" /> <a-icon slot="icon" type="reconciliation" />
</a-step> </a-step>
<a-step title="已发货" description="2022-12-24 12:23:00"> <a-step title="已发货" >
<a-icon slot="icon" type="car" /> <a-icon slot="icon" type="car" />
</a-step> </a-step>
<a-step title="已到货" description="This is a description." > <a-step title="已到货" >
<a-icon slot="icon" type="home" /> <a-icon slot="icon" type="home" />
</a-step> </a-step>
<a-step title="已签收" description="This is a description." > <a-step title="已签收" >
<a-icon slot="icon" type="printer" /> <a-icon slot="icon" type="printer" />
</a-step> </a-step>
@ -53,40 +53,29 @@
</div> </div>
<div class="r"> <div class="r">
<div class="title d-flex"> <div class="title d-flex">
<span class="f_20 c_333">订单号#{{this.model.orderNum}}<span class="line f_16 c_1B">|</span>2022-08-19</span> <span class="f_20 c_333">订单号#{{this.model.orderNum}}<span class="line f_16 c_1B">|</span>{{this.model.orderTime}}</span>
<div class="right d-flex f_16"><span>数量</span><span>价格</span><span>总计</span></div> <div class="right d-flex f_16"><span>数量</span><span>价格</span><span>总计</span></div>
</div> </div>
<div class="d-flex orderDiv"> <div class="d-flex orderDiv">
<div class="orderAddr"> <div class="orderAddr">
<p class="headline">配送至</p> <p class="headline">配送至</p>
<a-button style="padding-top: 10px;word-wrap: break-word; <a-button
overflow-wrap: break-word; class="defaultAddr"
white-space: normal; style="padding-top: 10px;word-wrap: break-word;
height: auto;
text-align:left;
margin-bottom:10px;
overflow: hidden;">
<p class="text">河南省</p>
<p class="text">驻马店市 驿城区</p>
<p class="text">黄淮学院南校区学府花园26号楼3602</p>
<p class="text d-flex"><span>463000</span><span>默认地址</span></p>
</a-button>
<a-button style="padding-top: 10px;word-wrap: break-word;
overflow-wrap: break-word; overflow-wrap: break-word;
white-space: normal; white-space: normal;
height: auto; height: auto;
margin-bottom:10px; margin-bottom:10px;
text-align:left; text-align:left;
overflow: hidden;"> overflow: hidden;" v-for="(item,index) in addrList" :key="index" @click="chooseAddr(item)" >
<p class="text">河南省</p> <p class="text">{{item.addr1}}</p>
<p class="text">驻马店市 驿城区</p> <p class="text">{{item.addr2}}</p>
<p class="text">黄淮学院南校区学府花园26号楼3602</p> <p class="text d-flex"><span>463000</span><span v-if="item.flag">默认地址</span></p>
<p class="text">463000</p>
</a-button> </a-button>
<p class="headline">已发货</p> <!-- <p class="headline">已发货</p>-->
<p class="text">您的订单已经发出</p> <!-- <p class="text">您的订单已经发出</p>-->
<p class="headline">尊享免费配送您的物流单号</p> <!-- <p class="headline">尊享免费配送您的物流单号</p>-->
<p class="text">4263882788397</p> <!-- <p class="text">4263882788397</p>-->
</div> </div>
<div class="orderList "> <div class="orderList ">
<div class="item d-flex"> <div class="item d-flex">
@ -124,7 +113,10 @@
</div> </div>
</div> </div>
</div> </div>
<div class="btn"><router-link to="/shopping/person" class="c_fff f_16">返回</router-link></div> <div class="btn">
<a class="c_fff f_16" @click="handleBack">返回</a>
<a class="c_fff f_16">提交</a>
</div>
</div> </div>
</div> </div>
<Footer></Footer> <Footer></Footer>
@ -140,34 +132,48 @@
return { return {
current:0,// current:0,//
model:{ model:{
id:'', id:'',//id
orderNum:'', orderNum:'1111111',//
pay:false, orderTime:'2022-08-19',//
receipt:false pay:false,//
} // receipt:false
},
addrList:[//
{
id:1,
addr1:'河南省 驻马店市 驿城区',
addr2:'黄淮学院南校区学府花园26号楼3602',
flag:true//
},
{
id:2,
addr1:'河南省 驻马店市 驿城区',
addr2:'黄淮学院南校区学府花园26号楼3601',
flag:false
}
]
}; };
}, },
created() { methods:{
// this.model.id = this.$route.query.id chooseAddr(item){
// this.model.orderNum = this.$route.query.orderNum console.log(item)
// this.model.pay = JSON.parse(this.$route.query.pay) },
// this.model.receipt = JSON.parse(this.$route.query.receipt) handleBack(){
// switch (this.$route.query.key) { this.$router.push({
// case 'daizhifu': path: "/shopping/ClothDetail",
// this.current=0 query: {
// break; // id: item.id,
// case 'daishouhuo': },
// this.current=4 });
// break; }
// case 'yiwancheng': },
// this.current=6 mounted() {
// break;
// }
}, },
}; };
</script> </script>
<style> <style>
.placeOrder .top .middle .router-link-exact-active.router-link-active { .placeOrder .top .middle .fzlx {
border-bottom: 2px solid #000; border-bottom: 2px solid #000;
} }
</style> </style>
@ -315,6 +321,7 @@
height: 56px; height: 56px;
background: #1B1B1B; background: #1B1B1B;
line-height: 56px; line-height: 56px;
margin-right: 20px;
} }
&:hover{ &:hover{
color: red; color: red;

Loading…
Cancel
Save