mirror of
https://gitlab.com/CIEFWorldwideSdnBhd/exchange-2.0.git
synced 2026-08-19 04:23:55 +00:00
114 lines
4.7 KiB
Vue
114 lines
4.7 KiB
Vue
<template>
|
|
<div class="row m-t-15">
|
|
<div class="col">
|
|
<div class="row align-items-end">
|
|
<div class="col">
|
|
<div class="row">
|
|
<div class="col">
|
|
<div class="font-heading fs-10 muted all-caps">Order Reference No</div>
|
|
<p class="m-b-0 fs-12" v-if="!isUpdate">
|
|
{{ parameters.order_reference_no.join(', ') }}
|
|
</p>
|
|
<div class="row p-r-15 m-t-10" v-for="(order, index) in parameters.order_reference_no" v-else>
|
|
<div class="col p-r-0">
|
|
<div class="form-group no-margin form-group-default">
|
|
<label>
|
|
Order Reference No. {{ index + 1 }}
|
|
</label>
|
|
<input type="text" class="form-control" v-model="parameters.order_reference_no[index]">
|
|
</div>
|
|
</div>
|
|
<div class="col-auto bg-danger pointer" v-if="parameters.order_reference_no.length > 1" @click="parameters.order_reference_no.splice(index, 1)">
|
|
<div class="row h-100 align-items-center">
|
|
<div class="col">
|
|
<i class="fa fa-times fa-fw text-white"></i>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row m-t-5" v-if="booking_status !== 3 && !isUpdate">
|
|
<div class="col-auto">
|
|
<p class="text-complete text-underline m-b-0 fs-12 pointer" @click="isUpdate = true">Update Order References</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row" v-show="isUpdate">
|
|
<div class="col">
|
|
<div class="row m-t-10">
|
|
<div class="col">
|
|
<button class="btn btn-xs btn-outline-primary b-rad-none" @click="parameters.order_reference_no.push('')">
|
|
<i class="fa fa-plus m-r-5"></i>
|
|
Add Order Reference
|
|
</button>
|
|
</div>
|
|
</div>
|
|
<div class="row m-t-10">
|
|
<div class="col-8 p-r-5">
|
|
<button class="btn btn-block btn-sm btn-success b-rad-none" @click="updateOrderReferences">Update Order References</button>
|
|
</div>
|
|
<div class="col-4 p-l-5">
|
|
<button class="btn btn-block btn-sm btn-default b-rad-none" @click="resetOrderReference">Cancel</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import FormHandler from '../../../general/mixins/formHandler';
|
|
|
|
export default {
|
|
props: {
|
|
order_reference_no: {
|
|
type: Array,
|
|
default: [],
|
|
required: true
|
|
},
|
|
booking_id: {
|
|
type: Number,
|
|
required: true
|
|
},
|
|
booking_status: {
|
|
type: Number,
|
|
required: true
|
|
}
|
|
},
|
|
data(){
|
|
return {
|
|
parameters: {
|
|
order_reference_no: []
|
|
},
|
|
isUpdate: false
|
|
}
|
|
},
|
|
watch: {
|
|
pendingQueue(inComplete){
|
|
if(inComplete){
|
|
this.fetchBillingAddress();
|
|
}
|
|
}
|
|
},
|
|
created(){
|
|
this.parameters.order_reference_no = this.order_reference_no.map(attr => attr.value);
|
|
},
|
|
methods: {
|
|
resetOrderReference() {
|
|
this.isUpdate = false;
|
|
this.parameters.order_reference_no = this.order_reference_no.map(attr => attr.value);
|
|
},
|
|
updateOrderReferences(){
|
|
this.submit(this.route('api.booking.booking_order_reference.update', this.booking_id), 'put', this.section, true, true)
|
|
},
|
|
successHandler(response){
|
|
this.isUpdate = false;
|
|
this.updateList()
|
|
},
|
|
},
|
|
mixins: [FormHandler]
|
|
}
|
|
</script> |