mirror of
https://gitlab.com/CIEFWorldwideSdnBhd/shipping-portal.git
synced 2026-08-19 04:24:12 +00:00
wip-feat: request change order shipping address ui.
This commit is contained in:
@@ -28,6 +28,7 @@ class OrderResource extends JsonResource
|
||||
'company_module' => new CompanyModuleResource($this->companyModule),
|
||||
'warehouse' => new CompanyModuleResource($this->orderRoles()->where('role_id', '=', OrderRoleTypes::ORIGIN_WAREHOUSE)->first()->appointee),
|
||||
'address' => new AddressResource($this->addresses()->first()),
|
||||
'address_change_request' => new AddressResource($this->addressesPendingVerification()->first()),
|
||||
$this->mergeWhen($this->relationLoaded('parcels'), [
|
||||
'origin_warehouse_packages' => PackageResource::collection($this->parcels()->whereHas('packingList', function($query){
|
||||
return $query->where('type', PackingListType::SHIPPING_PACKING_LIST)->whereDoesntHave('containers', function($query) {
|
||||
|
||||
@@ -0,0 +1,22 @@
|
||||
<template>
|
||||
<i class="fa fa-edit pointer requestModal" data-type="addressesList" v-tooltip:right="data.address_change_request.reference">
|
||||
<modal-component class="animate__animated animate__fast animate__fadeIn" styleType="fill-in" type="addressesList" size="large">
|
||||
<change-order-address-form-component :data="data" :section="section" class="text-center"></change-order-address-form-component>
|
||||
</modal-component>
|
||||
</i>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
data: {
|
||||
type: Object,
|
||||
required: true,
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
section:"changeAddressSection"
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,74 @@
|
||||
<template>
|
||||
<div class="row justify-content-center">
|
||||
<div class="col col-md-10">
|
||||
<div class="row m-b-20">
|
||||
<div class="col">
|
||||
<div class="row m-b-20 text-info">
|
||||
<div class="col text-center">
|
||||
<h3>Please select the address where you want to receive this order</h3>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row justify-content-center">
|
||||
<div class="col col-md-10">
|
||||
<list-component style="min-height: 50px;" section="addressList" :emptyListSection=false :endpoint="route('api.address.list')" :options="{per_page: 10, HasMorphCompanyModule: data.company_module.id}">
|
||||
<template slot="list" slot-scope="{data}">
|
||||
<select-address-component :data="data" :value="parameters.address_id" v-model="parameters.address_id"></select-address-component>
|
||||
</template>
|
||||
</list-component>
|
||||
<div class="row m-b-10 animate__animated animate__fadeInUpBig animate__delay-1 animate__fast">
|
||||
<div class="col b-a p-t-15 p-b-15 pointer" :class="{ 'b-primary': !parameters.address_id, 'b-grey': parameters.address_id}" @click="parameters.address_id = null">
|
||||
<div class="row align-items-center">
|
||||
<div class="col-auto p-r-0">
|
||||
<i class="fa fs-20 p-t-5" :class="{'fa-circle-o': parameters.address_id, 'fa-check-circle': !parameters.address_id, 'text-primary': !parameters.address_id}"></i>
|
||||
</div>
|
||||
<div class="col-auto semi-bold">New Address</div>
|
||||
</div>
|
||||
<div class="row" v-show="!parameters.address_id">
|
||||
<div class="col">
|
||||
<address-form-component :id="data.company_module.id" section="addressList" @input="parameters.address_id = $event"></address-form-component>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row justify-content-center animate__animated animate__fadeInUpBig animate__delay-1 animate__fast">
|
||||
<div class="col col-md-8 no-padding">
|
||||
<div class="row">
|
||||
<div class="col p-l-5">
|
||||
<button type="button" class="btn btn-lg btn-block btn-primary b-rad-none" @click="changeAddress()" >Update</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import componentHandler from '../../../general/mixins/componentHandler';
|
||||
import ModalFormHandler from '../../../general/mixins/modalFormHandler';
|
||||
export default {
|
||||
props: {
|
||||
data: {
|
||||
type: Object,
|
||||
required: true,
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
parameters : {
|
||||
address_id: '',
|
||||
order_id: this.data.id,
|
||||
}
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
changeAddress(){
|
||||
this.submit((this.route('api.order.address.change.request')), 'post', 'orderListSection', true, true);
|
||||
},
|
||||
},
|
||||
mixins: [componentHandler, ModalFormHandler]
|
||||
}
|
||||
</script>
|
||||
@@ -23,7 +23,8 @@
|
||||
</div>
|
||||
<div class="row m-b-10">
|
||||
<div class="col-auto">
|
||||
<h6 class="no-margin"><b>Delivery Address:</b> {{order.address.reference}} <i class="fa fa-info-circle m-l-10" v-tooltip:right="order.address.street_one+' '+(order.address.street_two ? order.address.street_two : '')+', '+ order.address.district.name+', '+order.address.post_code+' '+order.address.state.name+', '+order.address.country.name" ></i></h6>
|
||||
<h6 class="no-margin"><b>Delivery Address:</b> {{order.address.reference}} <i class="fa fa-info-circle m-l-10" v-tooltip:right="order.address.street_one+' '+(order.address.street_two ? order.address.street_two : '')+', '+ order.address.district.name+', '+order.address.post_code+' '+order.address.state.name+', '+order.address.country.name" ></i>
|
||||
<change-address-component :data="order"></change-address-component></h6>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<h6 class="no-margin"><b>Warehouse:</b> {{order.warehouse.id === 3 ? 'Guang Zhou' : 'Yiwu'}}</h6>
|
||||
|
||||
Reference in New Issue
Block a user