checkbox

public/mix-manifest.json

@@ -1,6 +1,6 @@
 {
-    "/js/vue/Authentication/app.js": "/js/vue/Authentication/app.js?id=ae0020c3ea87585d11e2",
-    "/js/vue/Home/app.js": "/js/vue/Home/app.js?id=a60eee632dda35e62e92",
-    "/js/vue/Modules/CRM/app.js": "/js/vue/Modules/CRM/app.js?id=7701333a8c35f7da26ba",
-    "/js/vue/User/app.js": "/js/vue/User/app.js?id=620f4775165bb2cb796d"
+    "/js/vue/Authentication/app.js": "/js/vue/Authentication/app.js?id=586f299c24bf749d2f3c",
+    "/js/vue/Home/app.js": "/js/vue/Home/app.js?id=f4ad28357a5e94487801",
+    "/js/vue/Modules/CRM/app.js": "/js/vue/Modules/CRM/app.js?id=c4391f11fc4c91ba84a6",
+    "/js/vue/User/app.js": "/js/vue/User/app.js?id=9169814f6c1ee0c82078"
 }

resources/js/Global/components/Inputs/Checkbox.vue

@@ -25,12 +25,11 @@ export default {
 		text: { default: " " },
 		item: { default: {} },
 		color: { default: "Red" },
-        value: {type: Array},
+		value: { type: Array }
 	},
 	data: function() {
 		return {
 			IconClass: "WMi-" + this.Icon,
-            values: this.value,
 			rand: Math.random()
 		};
 	},
@@ -47,6 +46,19 @@ export default {
 			}
 			return this.text;
 		},
+		values: {
+			get() {
+				if (this.itemValue) {
+					let newval = [];
+					for (const val of this.value) {
+                        newval.push(val[this.itemValue]);
+                    }
+					return newval;
+				}
+				return this.value;
+			},
+			set() {}
+		}
 	},
 	methods: {
 		changeValue($event) {
@@ -54,17 +66,23 @@ export default {
 				if ($event.target.checked) {
 					this.value.push(this.valueSelected);
 				} else {
-                    let index = this.value.findIndex(x => x == this.valueSelected);
+					let index = this.value.findIndex(
+						x => x == this.valueSelected
+					);
 					this.value.splice(index, 1);
 				}
 			}
-            this.$emit('change', this.ItemID, $event.target.checked);
+			this.$emit("change", this.item, $event.target.checked);
 		}
 	},
 	watch: {
 		value(value) {
+			if (this.itemValue) {
+				this.values = value[this.itemValue];
+			} else {
 				this.values = value;
 			}
 		}
+	}
 };
 </script>