| Current Path : /var/www/homesaver/www/bitrix/js/sale/checkout/view/element/input/src/ |
| Current File : /var/www/homesaver/www/bitrix/js/sale/checkout/view/element/input/src/property-checkbox.js |
import { BitrixVue } from 'ui.vue';
import { EventEmitter } from 'main.core.events';
import { Property as Const, EventType } from 'sale.checkout.const';
BitrixVue.component('sale-checkout-view-element-input-property-checkbox', {
props: ['item', 'index'],
data()
{
return {'showValue': this.item.value === 'Y'}
},
methods: {
validate()
{
EventEmitter.emit(EventType.property.validate, { index: this.index });
},
},
computed: {
checkedClassObject()
{
return {
'is-invalid': this.item.validated === Const.validate.failure,
'is-valid': this.item.validated === Const.validate.successful,
};
},
switchValue: {
get()
{
this.showValue = this.item.value === 'Y';
return this.item.value === 'Y';
},
set(value)
{
if (value)
{
this.item.value = 'Y';
this.showValue = true;
}
else
{
this.item.value = 'N';
this.showValue = false;
}
this.validate();
}
},
isAsteriskShown()
{
return this.item.required === 'Y';
},
},
// language=Vue
template: `
<div class="form-wrap form-control form-control-lg border-0 pl-0 form-asterisk" :class="checkedClassObject">
<input
@blur="validate"
type="checkbox"
:id="item.name"
:value="showValue"
v-model="switchValue"
/>
<label :for="item.name" class="ml-2">{{item.name}}</label>
<div
class="asterisk-item"
v-if="isAsteriskShown"
>
</div>
</div>
`,
});