You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
53 lines
1.3 KiB
53 lines
1.3 KiB
<template>
|
|
<div class="WM-Checkbox c-toggle-hide RTL WM-Align-R">
|
|
<input
|
|
type="checkbox"
|
|
:id="ItemID"
|
|
class="c-check"
|
|
:value="ItemID"
|
|
v-model="values"
|
|
@change="changeValue"
|
|
/>
|
|
<label :for="ItemID">
|
|
<span class="inc"></span>
|
|
<span class="check"></span>
|
|
<span class="box"></span>
|
|
{{ ItemText }}
|
|
</label>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
props: {
|
|
ItemID: { default: "Checkbox" },
|
|
ItemText: { default: " مقدار پیش فرض " },
|
|
color: { default: "Red" },
|
|
value: {type: Array}
|
|
},
|
|
data: function() {
|
|
return {
|
|
IconClass: "WMi-" + this.Icon,
|
|
values: this.value
|
|
};
|
|
},
|
|
methods:{
|
|
changeValue($event) {
|
|
if (this.value) {
|
|
if ($event.target.checked) {
|
|
this.value.push(this.ItemID);
|
|
} else {
|
|
let index = this.value.findIndex(x => x == this.ItemID);
|
|
this.value.splice(index, 1);
|
|
}
|
|
}
|
|
}
|
|
},
|
|
watch:{
|
|
value(value) {
|
|
this.values = value;
|
|
}
|
|
}
|
|
};
|
|
</script>
|