Update UI based on kexin feedback

This commit is contained in:
Dillon Ngo
2023-12-03 23:13:52 +08:00
parent 1ac2ac3102
commit 52c2dade88
2 changed files with 18 additions and 15 deletions
@@ -3,18 +3,21 @@
<div class="col">
<div class="row text-left no-margin bg-white" v-if="!isLoading" v-for="item in vouchers" v-bind:key="item.id" >
<div id="select-option" name="select-option" class="col b-b b-grey p-t-10 p-b-10 pointer p-t-10 p-b-10" @click="selectVoucher(item)">
<div class="row parentContainer">
<div class="col">
<p>{{ item.voucher.code }}</p>
<div class="row fs-10 p-b-5">List of Vouchers, click to select</div>
<div class="row">
<!-- <div class="col">
<p v-if="item.voucher.type == 'AMOUNT'">RM{{ item.voucher.value/100 }} Discount</p>
<p v-if="item.voucher.type == 'PERCENT'">{{ item.voucher.value }}% Discount</p>
</div>
<div class="col" v-if="item.voucher.end_date">
</div> -->
<span>{{ item.voucher.code }}</span>
</div>
<div class="row">
<span v-if="item.voucher.end_date">
Valid till {{ item.voucher.end_date }}
</div>
<div class="col" v-else>
</span>
<span v-else>
No expiry date
</div>
</span>
</div>
</div>
</div>
@@ -244,11 +244,11 @@
<i class="fa fa-times muted"></i>
</div>
</div>
<div class="col-auto p-r-10 p-l-10">
<!-- <div class="col-auto p-r-10 p-l-10">
<button class="btn btn-xs btn-outline-info b-rad-none m-r-5 requestModal" data-type="voucherList">
<i class="fa fa-list"></i>
</button>
</div>
</div> -->
</div>
</validation-wrapper-component>
</div>
@@ -256,17 +256,17 @@
<list-vouchers-component :employee="data.company.employee" @selected-voucher="handleSelectedVoucher"></list-vouchers-component>
</modal-component>
</div>
<div class="row m-l-0 m-r-0" v-show="showApplyVoucher">
<div class="col">
<available-vouchers-component :employee="data.company.employee" @selected-voucher="handleSelectedVoucher"></available-vouchers-component>
</div>
</div>
<span class="text-primary bold text-underline m-l-5 cursor text-small fs-12" style="margin-bottom: -10px; margin-top: -5px;" @click="showApplyVoucher=!showApplyVoucher" v-show="!showApplyVoucher">Apply a voucher</span>
<div class="row m-l-0 m-r-0" style="height: 20px">
<i class="fa fa-spinner fa-spin m-b-5" v-if="voucherIsChecking"></i>
<span class="text-danger" v-if="voucherCodeFailedReason">{{ voucherCodeFailedReason }}</span>
<span class="text-success" v-if="voucherCodeFailedReason === '' && voucherValidated">Voucher applied</span>
</div>
<div class="row m-l-0 m-r-0">
<div class="col">
<available-vouchers-component :employee="data.company.employee" @selected-voucher="handleSelectedVoucher"></available-vouchers-component>
</div>
</div>
<div class="row m-t-5">
<div class="col">
<div class="row p-l-15 p-r-15">