@cybertale/form 0.1.3 → 0.1.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cybertale/form",
-  "version": "0.1.3",
+  "version": "0.1.5",
   "description": "ECS interface for Web Development, CyberTale edition.",
   "author": "Joso Marich <jspmari@proton.me>",
   "license": "GPL-3.0-only",

package/src/formComponents/CheckBoxComponent.vue

@@ -1,7 +1,7 @@
 <template>
   <div :class="object?.Stats[statTypeEnum.Design].Data">
     <input class="form-check-input mt-0" type="checkbox"
-           :checked="!!object?.Stats[statTypeEnum.Value].Data"
+           :checked="getValue(statTypeEnum.Value, statTypeEnum.ValueIndices)"
            :id="object?.Stats[statTypeEnum.Tag].Data"
            :required="attributeCheck(statTypeEnum.Required)"
            :disabled="attributeCheck(statTypeEnum.Disabled)"
@@ -42,6 +42,28 @@ export default class CheckBoxComponent extends Vue {
     return ''
   }
 
+  getValue (statEnum: number, indexStatTypeEnum = StatTypeEnum.Option) : string {
+    if (this.object.Stats[statEnum]) {
+      if (this.object.Stats[indexStatTypeEnum] && this.object.Stats[statEnum] && this.isJSON(this.object.Stats[statEnum].Data)) {
+        const data = JSON.parse(this.object.Stats[statEnum].Data)
+        return data[Number(this.object.Stats[indexStatTypeEnum].Data)]
+      } else {
+        return this.object.Stats[statEnum].Data
+      }
+    }
+    return ''
+  }
+
+  isJSON (str: string): boolean {
+    let temp = null
+    try {
+      temp = JSON.parse(str)
+    } catch (e) {
+      return false
+    }
+    return Array.isArray(temp)
+  }
+
   validate () : string {
     if (this.object.Stats[this.statTypeEnum.IsValid] === undefined) { return '' }
     if (this.object.Stats[this.statTypeEnum.IsValid].Data === '') { return '' }

package/src/formComponents/DataListComponent.vue

@@ -2,7 +2,7 @@
   <input class="form-control" :list="object.Stats[statTypeEnum.BelongsTo].Data"
          :class="returnIfExists(statTypeEnum.Design) + ' ' + validate()"
          :required="attributeCheck(statTypeEnum.Required)"
-         :disabled="attributeCheck(statTypeEnum.Disabled)"
+         :disabled="disabledCheck(statTypeEnum.Disabled)"
          :type="returnIfExists(statTypeEnum.ElementType)"
          :value="`${object?.Stats[statTypeEnum.Value].Data !== null ? object.Stats[statTypeEnum.Value].Data.name === undefined ? valueName : object.Stats[statTypeEnum.Value].Data.name : ''}`"
          :placeholder="returnIfExists(statTypeEnum.Placeholder)"
@@ -43,6 +43,7 @@ export default class DataListComponent extends Vue {
   object!: ObjectTemplate
   displayOptions = false
   options: Option[] = []
+  loading = true
 
   returnIfExists (tag: number): string {
     if (this.object.Stats[tag]) {
@@ -53,16 +54,18 @@ export default class DataListComponent extends Vue {
 
   async created() {
     await this.fetchOptions();
+    this.loading = false
   }
 
   // Extract the logic for fetching options data into a separate method
   async fetchOptions() {
+    console.log(this.object.Stats)
     try {
       const parsedObject: { link?: string } = JSON.parse(this.object.Stats[this.statTypeEnum.ItemList].Data)[0];
       if (parsedObject.link) {
-        const response = await http.get(parsedObject.link + '/' + this.object.Stats[this.statTypeEnum.Name].Data);
-        this.options = response.data;
-        this.displayOptions = true;
+        const response = await http.get(parsedObject.link + '/' + this.object.Stats[this.statTypeEnum.Name].Data)
+        this.options = response.data
+        this.object.Stats[this.statTypeEnum.ItemList].Data =  JSON.stringify(response.data)
       } else {
         this.options = JSON.parse(this.object.Stats[this.statTypeEnum.ItemList].Data);
       }
@@ -95,6 +98,12 @@ export default class DataListComponent extends Vue {
     return this.object.Stats[statType].Data
   }
 
+  disabledCheck (statType : number) : boolean | string {
+    if (this.object.Stats[statType] === undefined) { return (false || this.loading) }
+    if (this.object.Stats[statType].Data === '') { return (false || this.loading) }
+    return this.object.Stats[statType].Data
+  }
+
   validate () : string {
     if (this.object.Stats[this.statTypeEnum.IsValid] === undefined) { return '' }
     if (this.object.Stats[this.statTypeEnum.IsValid].Data === '') { return '' }