order finish
This commit is contained in:
kimsanghoon1
@@ -1,60 +1,76 @@
|
||||
<template>
|
||||
|
||||
|
||||
<v-container style="width: 700px">
|
||||
|
||||
<v-card style="padding-top: 70px;">
|
||||
<v-card-title style="color: crimson; font-size: 25px; justify-content: center" >주문이 완료되었습니다.</v-card-title>
|
||||
<v-divider></v-divider>
|
||||
<v-card-title style="font-size: 15px; justify-content: center">
|
||||
{{ UserInfo.name }} / {{OrderInfo.toAddr}}
|
||||
</v-card-title>
|
||||
<v-card style="padding-top: 70px;"
|
||||
class="mx-auto"
|
||||
outlined>
|
||||
<v-card-title style="color: crimson; font-size: 25px; justify-content: center">주문이 완료되었습니다.</v-card-title>
|
||||
<v-divider></v-divider>
|
||||
<v-card-title style="font-size: 15px; justify-content: center">
|
||||
2019-09-04 15:00
|
||||
{{ $store.state.nickname }} / {{orderData.address}}
|
||||
</v-card-title>
|
||||
<!--<v-card-title style="font-size: 15px; justify-content: center">-->
|
||||
<!--2019-09-04 15:00-->
|
||||
<!--</v-card-title>-->
|
||||
|
||||
</v-card>
|
||||
|
||||
<v-card>
|
||||
<v-card class="mx-auto"
|
||||
outlined
|
||||
>
|
||||
<v-card-title>> 상품 정보 확인</v-card-title>
|
||||
<v-divider></v-divider>
|
||||
<v-card-text>상품명: {{ItemInfo.name}}
|
||||
<br>상품금액: {{ ItemInfo.price }} | 수량: {{ ItemInfo.qty }}
|
||||
<br>배송비: {{ OrderInfo.deliveryFee }}
|
||||
<v-card-text>
|
||||
상품명: {{ orderData.productInfo.name }}
|
||||
<br>상품금액: {{ orderData.productInfo.price }} | 수량: {{ orderData.productInfo.stock }}
|
||||
</v-card-text>
|
||||
</v-card>
|
||||
|
||||
<v-card>
|
||||
<v-card
|
||||
class="mx-auto"
|
||||
outlined
|
||||
>
|
||||
<v-card-title>> 주문자 정보 확인</v-card-title>
|
||||
<v-divider></v-divider>
|
||||
<v-card-text>주문자: {{UserInfo.name}}
|
||||
<br>주문자 번호: {{UserInfo.phone}}
|
||||
<br>주문번호: {{ItemInfo.name}}
|
||||
<br>주문내역: {{ItemInfo.name}}
|
||||
<br>총 주문금액: {{OrderInfo.orderPrice}}
|
||||
<v-card-text>
|
||||
주문자: {{$store.state.nickname}}
|
||||
<!--<br>주문자 연락처: {{UserInfo.phone}}-->
|
||||
<!--<br>주문번호: {{ItemInfo.name}}-->
|
||||
<!--<br>주문내역: {{ItemInfo.name}}-->
|
||||
<br>총 주문금액: {{orderData.totalAmount}}
|
||||
</v-card-text>
|
||||
</v-card>
|
||||
|
||||
<v-card>
|
||||
<v-card
|
||||
class="mx-auto"
|
||||
outlined
|
||||
>
|
||||
<v-card-title>> 수령자 정보 확인</v-card-title>
|
||||
<v-divider></v-divider>
|
||||
<v-card-text>수령자: {{OrderInfo.toName}}
|
||||
<br>수령자 휴대번호: {{OrderInfo.toPhone}}
|
||||
<br>수령지: {{OrderInfo.toAddr}}
|
||||
<v-card-text>
|
||||
수령자: {{$store.state.nickname}}
|
||||
<!--<br>수령자 휴대번호: {{OrderInfo.toPhone}}-->
|
||||
<br>수령지: {{orderData.address}}
|
||||
</v-card-text>
|
||||
</v-card>
|
||||
|
||||
<v-card>
|
||||
<v-card
|
||||
class="mx-auto"
|
||||
outlined
|
||||
>
|
||||
<v-card-title>> 결제 정보</v-card-title>
|
||||
<v-divider></v-divider>
|
||||
<v-card-text>
|
||||
결제 전 잔액: {{UserInfo.balance}}
|
||||
<br>주문 총 금액: {{OrderInfo.orderPrice}}
|
||||
<br>결제 후 잔액: {{UserInfo.balance}}
|
||||
결제 전 잔액: {{ orderData.totalAmount + $store.state.money }}
|
||||
<br>주문 총 금액: {{orderData.totalAmount}}
|
||||
<br>결제 후 잔액: {{$store.state.money}}
|
||||
</v-card-text>
|
||||
</v-card>
|
||||
|
||||
<v-card>
|
||||
<v-card
|
||||
class="mx-auto"
|
||||
outlined
|
||||
>
|
||||
<v-row justify="end" align="center" wrap>
|
||||
<v-btn text @click="goDetail()">주문 상세보기</v-btn>
|
||||
<v-btn text @click="goShop()">쇼핑 계속하기</v-btn>
|
||||
@@ -64,60 +80,35 @@
|
||||
</v-container>
|
||||
|
||||
|
||||
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
productInfo: Object,
|
||||
props: {},
|
||||
data: () => ({
|
||||
orderData: {}
|
||||
}),
|
||||
created() {
|
||||
this.orderData = this.$route.params
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
|
||||
UserInfo:
|
||||
{
|
||||
name: 'I',
|
||||
balance: 1000000,
|
||||
phone:'010-3333-4444',
|
||||
addr: '서울시 강남구 로즈 5층',
|
||||
}
|
||||
,
|
||||
ItemInfo:
|
||||
{
|
||||
name: 'TV',
|
||||
price: '5000',
|
||||
qty:1,
|
||||
},
|
||||
OrderInfo:
|
||||
{
|
||||
toName:'U',
|
||||
toAddr:'서울시 강남구 유엔진 5층',
|
||||
toPhone:'010-1111-2222',
|
||||
orderPrice:12500,
|
||||
deliveryFee: 2500,
|
||||
}
|
||||
}
|
||||
beforeDestroy() {
|
||||
},
|
||||
watch: {},
|
||||
mounted() {
|
||||
this.$EventBus.$on('message', function (e) {
|
||||
console.log(e);
|
||||
})
|
||||
},
|
||||
computed: {
|
||||
|
||||
},
|
||||
computed: {},
|
||||
methods: {
|
||||
goShop(){
|
||||
goShop() {
|
||||
this.$router.push('/products');
|
||||
},
|
||||
goDetail(){
|
||||
goDetail() {
|
||||
|
||||
}
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
</style>
|
||||
|
||||
@@ -30,13 +30,36 @@
|
||||
</template>
|
||||
|
||||
<template v-slot:item.action="{ item }">
|
||||
<v-icon
|
||||
small
|
||||
class="mr-2"
|
||||
@click="openDelivery(item)"
|
||||
>
|
||||
local_shipping
|
||||
</v-icon>
|
||||
<!--<v-icon-->
|
||||
<!--small-->
|
||||
<!--class="mr-2"-->
|
||||
<!--@click="openDelivery(item)"-->
|
||||
<!-->-->
|
||||
<!--배송완료-->
|
||||
<!--</v-icon>-->
|
||||
<v-chip :color="'green'"
|
||||
dark
|
||||
v-if="item.deliveryStarted && item.deliveryCompleted"
|
||||
> 배송 완료
|
||||
</v-chip>
|
||||
<v-chip :color="'green'"
|
||||
dark
|
||||
v-else-if="item.deliveryStarted"
|
||||
> 배송 시작
|
||||
</v-chip>
|
||||
<v-chip :color="'red'"
|
||||
dark
|
||||
v-else="item.deliveryStarted"
|
||||
> 배송 준비 중
|
||||
</v-chip>
|
||||
<!--<v-icon-->
|
||||
<!--small-->
|
||||
<!--class="mr-2"-->
|
||||
<!--@click="openDelivery(item)"-->
|
||||
<!--v-if="item.deliveryStarted"-->
|
||||
<!-->-->
|
||||
<!--배송중-->
|
||||
<!--</v-icon>-->
|
||||
</template>
|
||||
</v-data-table>
|
||||
|
||||
@@ -73,11 +96,12 @@
|
||||
value: 'productName',
|
||||
},
|
||||
{text: '주문자', value: 'username'},
|
||||
{text: 'Stock', value: 'stock'},
|
||||
{text: '결제금액', value: 'payment', align: 'center'},
|
||||
{text: '구매수량', value: 'quantity', align: 'center'},
|
||||
{text: '결제시각', value: 'timestamp', align: 'center'},
|
||||
{text: 'Delivery', value: 'action', sortable: false}
|
||||
],
|
||||
orderList: [
|
||||
],
|
||||
orderList: [],
|
||||
editedIndex: -1,
|
||||
editedItem: {
|
||||
name: '',
|
||||
|
||||
@@ -99,11 +99,7 @@
|
||||
<div class="flex-grow-1"></div>
|
||||
<v-card-actions>
|
||||
<div class="flex-grow-1"></div>
|
||||
<<<<<<< HEAD
|
||||
<v-btn color="red accent-4" text @click="submit()">결제하기</v-btn>
|
||||
=======
|
||||
<v-btn color="primary accent-4" text @click="check()">결제하기</v-btn>
|
||||
>>>>>>> 0382a9ae150a71eebd5b102cb1e33012923103a7
|
||||
<v-btn color="red accent-4" text @click="close()">취소</v-btn>
|
||||
</v-card-actions>
|
||||
</v-card-text>
|
||||
@@ -174,14 +170,10 @@
|
||||
me.$emit('update:buyDialog', false)
|
||||
console.log(me.buyDialog)
|
||||
},
|
||||
<<<<<<< HEAD
|
||||
submit() {
|
||||
var me = this
|
||||
console.log(me.card, me.qty,me.name,this.productInfo.price, me.address, me.phoneNumber,me.totalAmount);
|
||||
me.$EventBus.$emit('message', this.productInfo, me.address, me.phoneNumber,me.totalAmount);
|
||||
this.$router.push('/OrderFinish');
|
||||
|
||||
=======
|
||||
console.log(me.card, me.qty, me.name, this.productInfo.price, me.address, me.phoneNumber, me.totalAmount);
|
||||
},
|
||||
check() {
|
||||
var me = this
|
||||
me.$v.$touch();
|
||||
@@ -234,8 +226,15 @@
|
||||
localStorage.setItem("nickname", e.data.nickname)
|
||||
localStorage.setItem("money", e.data.money)
|
||||
localStorage.setItem("address", e.data.address)
|
||||
var data = {
|
||||
'productInfo' : me.productInfo,
|
||||
'address': me.address,
|
||||
'phoneNumber': me.phoneNumber,
|
||||
'totalAmount': me.totalAmount
|
||||
}
|
||||
me.$router.push({name: 'OrderFinish', params: data});
|
||||
// me.$EventBus.$emit('message', JSON.parse(JSON.stringify(data)));
|
||||
})
|
||||
>>>>>>> 0382a9ae150a71eebd5b102cb1e33012923103a7
|
||||
}
|
||||
},
|
||||
}
|
||||
|
||||
@@ -26,7 +26,7 @@ import OrderPage from './components/order/OrderPage'
|
||||
Vue.prototype.$http = axios;
|
||||
Vue.use(VueNumberInput);
|
||||
Vue.use(VueTheMask)
|
||||
Vue.prototype.$EventBus = new Vue();
|
||||
// Vue.prototype.$EventBus = new Vue();
|
||||
|
||||
if( process.env.NODE_ENV == "development" ){
|
||||
window.API_HOST = "http://localhost:8088";
|
||||
|
||||
@@ -30,7 +30,7 @@ export default new Router({
|
||||
{
|
||||
path:'/OrderFinish',
|
||||
name: 'OrderFinish',
|
||||
component: OrderFinish ,
|
||||
component: OrderFinish,
|
||||
},
|
||||
{
|
||||
path:'/products/:name',
|
||||
|
||||
Reference in New Issue
Block a user