implemtn api on segment_constants service chrages

This commit is contained in:
edmondlang
2022-03-06 00:17:16 +08:00
parent 4e3365ba97
commit ee85127c96
2 changed files with 106 additions and 0 deletions
@@ -34,15 +34,33 @@
</div>
</div>
</div>
<div class="col">
<div class="row">
<div class="col-auto p-r-10">
<div class="font-heading all-caps fs-8 muted">Service Charge</div>
</div>
</div>
<div class="row">
<div class="col">
<div class="font-heading all-caps fs-10">0.00</div>
</div>
</div>
</div>
<div class="col-auto">
<div class="row">
<div class="col">
<button class="btn btn-xs btn-outline-warning b-rad-none m-r-5 requestModal" data-type="editServiceCharge">
<i class="fa fa-pencil"></i>
</button>
<button class="btn btn-xs btn-outline-danger b-rad-none m-r-5 requestModal" data-type="deleteSupplier">
<i class="fa fa-times"></i>
</button>
<button class="btn btn-xs btn-complete p-l-10 p-r-10 b-rad-none" @click="expanded = !expanded">
<i class="fa" :class="[{'fa-angle-up': expanded}, {'fa-angle-down': !expanded}]"></i>
</button>
<modal-component class="animate__animated animate__fast animate__fadeIn" type="editServiceCharge">
<supplier-service-charge-form-component :details="item" :defaultCharge="null" section="suppliersServiceChargeSection"></supplier-service-charge-form-component>
</modal-component>
<modal-component class="animate__animated animate__fast animate__fadeIn" styleType="fill-in" type="deleteSupplier">
<delete-supplier-form-component :data="item" section="suppliersSection" class="text-center"></delete-supplier-form-component>
</modal-component>
@@ -0,0 +1,88 @@
<template>
<div class="row">
<div class="col">
<loading-component style="height: 50px; top: 0;" key="1" color="success" v-show="$store.getters.isLoading(section)"></loading-component>
<div class="row" v-show="!$store.getters.isLoading(section)">
<div class="col">
<div class="row m-b-20">
<div class="col">
<h6 class="all-caps m-b-5 bold no-margiPsn">Edit Service Charge</h6>
</div>
</div>
<div class="row m-b-5 animate__animated animate__fadeInUpBig animate__fast" v-if="error">
<div class="col">
<small class="bold fs-10 text-danger">{{error}}</small>
</div>
</div>
<div class="row m-b-10">
<div class="col">
<validation-wrapper-component :validator="$v.parameters.amount">
<label>Service Charge %</label>
<input type="text" class="form-control" v-model="parameters.detail.service_charge.amount" v-money="exchangeRate">
</validation-wrapper-component>
</div>
</div>
<div class="row">
<div class="col p-r-5">
<div class="btn btn-sm btn-default bg-master-lightest btn-block b-rad-none" data-dismiss="modal">Cancel</div>
</div>
<div class="col p-l-5">
<div class="btn btn-sm btn-success btn-block b-rad-none" @click="submitForm()">Confirm</div>
</div>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import ModalFormHandler from '../../../general/mixins/modalFormHandler';
import { required, requiredIf } from "vuelidate/lib/validators";
export default {
props: {
details: {
type: Object,
required: true
},
defaultCharge: {
type: Number,
required: false
}
},
data(){
return {
parameters: {
name: 'Service Charge',
reference: 'SERVICE_CHARGE',
detail: {
service_charge: {
id: this.details.id,
type: "percentage",
amount: this.defaultCharge,
},
},
segment_id: 1
},
}
},
validations: {
parameters: {
amount: {
required: true
}
}
},
methods: {
submitForm(){
if (this.defaultCharge == null) {
this.submit(this.route('api.segment_constant.create'), 'post', this.section, true, true);
}
else {
this.submit(this.route('api.segment_constant.update', this.service_charges.id), 'post', this.section, true, true);
}
},
},
mixins: [ModalFormHandler]
}
</script>