chore: install prettier

app/components/dialog/ApprovalCode.vue

@@ -1,10 +1,20 @@
 <template>
   <div>
-    <Caption v-bind="{title: 'Nhập mã duyệt'}"></Caption>
+    <Caption v-bind="{ title: 'Nhập mã duyệt' }"></Caption>
     <div class="field is-grouped mt-5">
-      <div class="control mr-5" v-for="v in [1,2,3,4]">
-        <input class="input is-dark" style="font-size: 18px; max-width: 40px; font-weight:bold; text-align: center;" type="password" 
-        maxlength="1" :id="`input${v}`" v-model="data[v]" @keyup="changeNext(v)" />
+      <div
+        class="control mr-5"
+        v-for="v in [1, 2, 3, 4]"
+      >
+        <input
+          class="input is-dark"
+          style="font-size: 18px; max-width: 40px; font-weight: bold; text-align: center"
+          type="password"
+          maxlength="1"
+          :id="`input${v}`"
+          v-model="data[v]"
+          @keyup="changeNext(v)"
+        />
       </div>
     </div>
     <div class="mt-4">
@@ -17,53 +27,58 @@ export default {
   data() {
     return {
       data: {},
-      code: undefined
-    }
+      code: undefined,
+    };
   },
   async created() {
-    if(!this.approvalcode && this.$store.state.login.approval_code) this.approvalcode = this.$store.state.login.approval_code
-    if(!this.approvalcode) {
-      let user = await this.$getdata('user', {id: this.$store.state.login.id}, undefined, true)
-      this.approvalcode = user.approval_code
+    if (!this.approvalcode && this.$store.state.login.approval_code)
+      this.approvalcode = this.$store.state.login.approval_code;
+    if (!this.approvalcode) {
+      let user = await this.$getdata("user", { id: this.$store.state.login.id }, undefined, true);
+      this.approvalcode = user.approval_code;
     }
   },
   mounted() {
-    this.reset()
+    this.reset();
   },
   computed: {
     approvalcode: {
-      get: function() {return this.$store.state['approvalcode']},
-      set: function(val) {this.$store.commit('updateStore', {name: 'approvalcode', data: val})}
-    }
+      get: function () {
+        return this.$store.state["approvalcode"];
+      },
+      set: function (val) {
+        this.$store.commit("updateStore", { name: "approvalcode", data: val });
+      },
+    },
   },
   methods: {
     checkError() {
-      if(Object.keys(this.data).length<4) return true
-      let code = ''
+      if (Object.keys(this.data).length < 4) return true;
+      let code = "";
       for (const [key, value] of Object.entries(this.data)) {
-        if(!this.$empty(value)) code += value.toString() 
+        if (!this.$empty(value)) code += value.toString();
       }
-      if(this.$empty(code) || !this.$isNumber(code)) return true
-      this.code = code
-      return false
+      if (this.$empty(code) || !this.$isNumber(code)) return true;
+      this.code = code;
+      return false;
     },
     checkValid() {
-      if(this.checkError()) return this.$snackbar('Mã phê duyệt không hợp lệ')
-      if(this.code!==this.approvalcode) return this.$snackbar('Mã phê duyệt không chính xác')
-      this.$emit('modalevent', {name: 'approvalcode', data: this.code})
-      this.$emit('close')
+      if (this.checkError()) return this.$snackbar("Mã phê duyệt không hợp lệ");
+      if (this.code !== this.approvalcode) return this.$snackbar("Mã phê duyệt không chính xác");
+      this.$emit("modalevent", { name: "approvalcode", data: this.code });
+      this.$emit("close");
     },
     changeNext(v) {
-      if(this.$empty(this.data[v])) return
-      else if(v===4) return this.checkValid()
-      let doc = document.getElementById(`input${v+1}`)
-      if(doc) doc.focus()
+      if (this.$empty(this.data[v])) return;
+      else if (v === 4) return this.checkValid();
+      let doc = document.getElementById(`input${v + 1}`);
+      if (doc) doc.focus();
     },
     reset() {
-      this.data = {}
-      let doc = document.getElementById(`input1`)
-      if(doc) doc.focus()
-    }
-  }
-}
-</script>
+      this.data = {};
+      let doc = document.getElementById(`input1`);
+      if (doc) doc.focus();
+    },
+  },
+};
+</script>

app/components/dialog/Confirm.vue

@@ -4,26 +4,42 @@
     <p class="border-bottom mt-3 mb-5"></p>
     <div class="field is-grouped">
       <div class="control is-expanded">
-        <button class="button is-primary has-text-white" @click="confirm()">Đồng ý</button>
-        <button class="button is-dark ml-5" @click="cancel()">Hủy bỏ</button>
+        <button
+          class="button is-primary has-text-white"
+          @click="confirm()"
+        >
+          Đồng ý
+        </button>
+        <button
+          class="button is-dark ml-5"
+          @click="cancel()"
+        >
+          Hủy bỏ
+        </button>
       </div>
-      <div class="control" v-if="duration">
-        <CountDown v-bind="{duration: duration}" @close="cancel()"></CountDown>
+      <div
+        class="control"
+        v-if="duration"
+      >
+        <CountDown
+          v-bind="{ duration: duration }"
+          @close="cancel()"
+        ></CountDown>
       </div>
     </div>
   </div>
 </template>
 <script>
 export default {
-  props: ['content', 'duration'],
+  props: ["content", "duration"],
   methods: {
     cancel() {
-      this.$emit('close')
+      this.$emit("close");
     },
     confirm() {
-      this.$emit('modalevent', {name: 'confirm'})
-      this.cancel()
-    }
-  }
-}
-</script>
+      this.$emit("modalevent", { name: "confirm" });
+      this.cancel();
+    },
+  },
+};
+</script>

app/components/dialog/CountDown.vue

@@ -1,38 +1,45 @@
 <template>
-<div id="countdown">
-  <div id="countdown-number"></div>
-  <svg><circle r="18" cx="20" cy="20" color="red"></circle></svg>
-</div>
+  <div id="countdown">
+    <div id="countdown-number"></div>
+    <svg>
+      <circle
+        r="18"
+        cx="20"
+        cy="20"
+        color="red"
+      ></circle>
+    </svg>
+  </div>
 </template>
 <script>
 export default {
-  props: ['duration'],
+  props: ["duration"],
   data() {
     return {
       timer: undefined,
-      countdown: this.duration || 10
-    }
+      countdown: this.duration || 10,
+    };
   },
   mounted() {
-    var countdownNumberEl = document.getElementById('countdown-number')
+    var countdownNumberEl = document.getElementById("countdown-number");
     countdownNumberEl.textContent = this.countdown;
-    this.timer = setInterval(()=>this.startCount(), 1000)
+    this.timer = setInterval(() => this.startCount(), 1000);
   },
   beforeDestroy() {
-    clearInterval(this.timer)
+    clearInterval(this.timer);
   },
   methods: {
     startCount() {
-      this.countdown -= 1
-      var countdownNumberEl = document.getElementById('countdown-number')
+      this.countdown -= 1;
+      var countdownNumberEl = document.getElementById("countdown-number");
       countdownNumberEl.textContent = this.countdown;
-      if(this.countdown===0) {
-        clearInterval(this.timer)
-        this.$emit('close')
+      if (this.countdown === 0) {
+        clearInterval(this.timer);
+        this.$emit("close");
       }
-    }
-  }
-}
+    },
+  },
+};
 </script>
 <style scoped>
 #countdown {
@@ -72,4 +79,4 @@ export default {
     stroke-dashoffset: 113px;
   }
 }
-</style>
+</style>

app/components/dialog/Delete.vue

@@ -4,44 +4,64 @@
     <p class="border-bottom mt-4 mb-5"></p>
     <div class="field is-grouped">
       <div class="control is-expanded">
-        <button class="button is-danger" @click="remove()">Đồng ý</button>
-        <button class="button is-dark ml-5" @click="cancel()">Hủy bỏ</button>
+        <button
+          class="button is-danger"
+          @click="remove()"
+        >
+          Đồng ý
+        </button>
+        <button
+          class="button is-dark ml-5"
+          @click="cancel()"
+        >
+          Hủy bỏ
+        </button>
       </div>
-      <div class="control" v-if="duration">
-        <CountDown v-bind="{duration: duration}" @close="cancel()"></CountDown>
+      <div
+        class="control"
+        v-if="duration"
+      >
+        <CountDown
+          v-bind="{ duration: duration }"
+          @close="cancel()"
+        ></CountDown>
       </div>
     </div>
   </div>
 </template>
 <script>
 export default {
-  props: ['content', 'duration', 'vbind', 'setdeleted'],
+  props: ["content", "duration", "vbind", "setdeleted"],
   methods: {
     cancel() {
-      this.$emit('close')
+      this.$emit("close");
     },
     async remove() {
-      let pagename = this.vbind.pagename
-      let pagedata = this.$store.state[pagename]
-      let name = pagedata.origin_api.name || this.vbind.api
-      let id = this.vbind.row.id
-      let result
-      if(this.setdeleted) {
-        let record = await this.$getdata(name, {id: id}, undefined, true)
-        record.deleted = 1
-        result = await this.$updateapi(name, record)
-      } else result = await this.$deleteapi(name, id)
-      if(result==='error') return this.$dialog('Đã xảy ra lỗi, xóa dữ liệu thất bại', 'Lỗi', 'Error')
-      this.$snackbar('Dữ liệu đã được xoá khỏi hệ thống', undefined, 'Success')
-      let arr = Array.isArray(id)? id : [{id: id}]
-      let copy = this.$copy(this.$store.state[pagename].data)
-      arr.map(x=>{
-        let index = copy.findIndex(v=>v.id===x.id)
-        index>=0? this.$delete(copy,index) : false
-      })
-      this.$store.commit('updateState', {name: pagename, key: 'update', data: {data: copy}})
-      this.cancel()
-    }
-  }
-}
-</script>
+      let pagename = this.vbind.pagename;
+      let pagedata = this.$store.state[pagename];
+      let name = pagedata.origin_api.name || this.vbind.api;
+      let id = this.vbind.row.id;
+      let result;
+      if (this.setdeleted) {
+        let record = await this.$getdata(name, { id: id }, undefined, true);
+        record.deleted = 1;
+        result = await this.$updateapi(name, record);
+      } else result = await this.$deleteapi(name, id);
+      if (result === "error") return this.$dialog("Đã xảy ra lỗi, xóa dữ liệu thất bại", "Lỗi", "Error");
+      this.$snackbar("Dữ liệu đã được xoá khỏi hệ thống", undefined, "Success");
+      let arr = Array.isArray(id) ? id : [{ id: id }];
+      let copy = this.$copy(this.$store.state[pagename].data);
+      arr.map((x) => {
+        let index = copy.findIndex((v) => v.id === x.id);
+        index >= 0 ? this.$delete(copy, index) : false;
+      });
+      this.$store.commit("updateState", {
+        name: pagename,
+        key: "update",
+        data: { data: copy },
+      });
+      this.cancel();
+    },
+  },
+};
+</script>

app/components/dialog/Error.vue

@@ -1,31 +1,44 @@
 <template>
   <div>
     <div class="field is-grouped">
-      <div class="control is-expanded pr-3" v-html="content"></div>
+      <div
+        class="control is-expanded pr-3"
+        v-html="content"
+      ></div>
       <div class="control">
-        <SvgIcon v-bind="{name: 'error.svg', type: 'danger', size: 24}"></SvgIcon>
+        <SvgIcon v-bind="{ name: 'error.svg', type: 'danger', size: 24 }"></SvgIcon>
       </div>
     </div>
     <p class="border-bottom mt-3 mb-5"></p>
     <div class="field is-grouped">
       <div class="control is-expanded">
-        <button class="button is-danger has-text-white" @click="cancel()">Đóng</button>
+        <button
+          class="button is-danger has-text-white"
+          @click="cancel()"
+        >
+          Đóng
+        </button>
       </div>
-      <div class="control" v-if="duration">
-        <CountDown v-bind="{duration: duration}" @close="cancel()"></CountDown>
+      <div
+        class="control"
+        v-if="duration"
+      >
+        <CountDown
+          v-bind="{ duration: duration }"
+          @close="cancel()"
+        ></CountDown>
       </div>
     </div>
   </div>
 </template>
 <script setup>
-
-  import { useStore } from '@/stores/index'
-  const store = useStore()
-  var props = defineProps({
-    content: String,
-    duration: Number
-  })
-  function cancel() {
-    this.$emit('close')
-  }
-</script>
+import { useStore } from "@/stores/index";
+const store = useStore();
+var props = defineProps({
+  content: String,
+  duration: Number,
+});
+function cancel() {
+  this.$emit("close");
+}
+</script>

app/components/dialog/Info.vue

@@ -4,21 +4,32 @@
     <p class="border-bottom mt-3 mb-5"></p>
     <div class="field is-grouped">
       <div class="control is-expanded">
-        <button class="button is-dark" @click="cancel()">Đóng</button>
+        <button
+          class="button is-dark"
+          @click="cancel()"
+        >
+          Đóng
+        </button>
       </div>
-      <div class="control" v-if="duration">
-        <CountDown v-bind="{duration: duration}" @close="cancel()"></CountDown>
+      <div
+        class="control"
+        v-if="duration"
+      >
+        <CountDown
+          v-bind="{ duration: duration }"
+          @close="cancel()"
+        ></CountDown>
       </div>
     </div>
   </div>
 </template>
 <script>
 export default {
-  props: ['content', 'duration'],
+  props: ["content", "duration"],
   methods: {
     cancel() {
-      this.$emit('close')
-    }
-  }
-}
-</script>
+      this.$emit("close");
+    },
+  },
+};
+</script>

app/components/dialog/NoteInput.vue

@@ -1,10 +1,17 @@
 <template>
   <div class="modal-card">
-    <header class="modal-card-head" :class="headerClass">
+    <header
+      class="modal-card-head"
+      :class="headerClass"
+    >
       <p class="modal-card-title has-text-white">
         <span class="icon-text">
           <span class="icon">
-            <SvgIcon :name="iconName" type="white" :size="24" />
+            <SvgIcon
+              :name="iconName"
+              type="white"
+              :size="24"
+            />
           </span>
           <span>{{ title }}</span>
         </span>
@@ -14,14 +21,34 @@
       <div class="field">
         <label class="label">{{ label }}</label>
         <div class="control">
-          <textarea class="textarea" v-model="note" :placeholder="placeholder"></textarea>
+          <textarea
+            class="textarea"
+            v-model="note"
+            :placeholder="placeholder"
+          ></textarea>
         </div>
-        <p v-if="error" class="help is-danger">{{ error }}</p>
+        <p
+          v-if="error"
+          class="help is-danger"
+        >
+          {{ error }}
+        </p>
       </div>
     </section>
     <footer class="modal-card-foot is-justify-content-flex-end">
-      <button class="button" @click="$emit('close')">{{ cancelText }}</button>
-      <button class="button" :class="buttonClass" @click="confirm">{{ confirmText }}</button>
+      <button
+        class="button"
+        @click="$emit('close')"
+      >
+        {{ cancelText }}
+      </button>
+      <button
+        class="button"
+        :class="buttonClass"
+        @click="confirm"
+      >
+        {{ confirmText }}
+      </button>
     </footer>
   </div>
 </template>
@@ -33,78 +60,81 @@ export default {
   props: {
     title: {
       type: String,
-      default: 'Nhập nội dung'
+      default: "Nhập nội dung",
     },
     label: {
       type: String,
-      default: 'Ghi chú'
+      default: "Ghi chú",
     },
     placeholder: {
       type: String,
-      default: 'Nhập nội dung...'
+      default: "Nhập nội dung...",
     },
     type: {
       type: String,
-      default: 'primary', // primary, warning, danger
+      default: "primary", // primary, warning, danger
     },
     confirmText: {
       type: String,
-      default: 'Xác nhận'
+      default: "Xác nhận",
     },
     cancelText: {
       type: String,
-      default: 'Hủy'
-    }
+      default: "Hủy",
+    },
   },
-  emits: ['close', 'modalevent'],
+  emits: ["close", "modalevent"],
   setup() {
     const store = useStore();
     return { store };
   },
   data() {
     return {
-      note: '',
-      error: ''
+      note: "",
+      error: "",
     };
   },
   computed: {
     isVietnamese() {
-      return this.store.lang === 'vi';
+      return this.store.lang === "vi";
     },
     headerClass() {
       const colorMap = {
-        primary: 'has-background-primary',
-        warning: 'has-background-warning',
-        danger: 'has-background-danger',
+        primary: "has-background-primary",
+        warning: "has-background-warning",
+        danger: "has-background-danger",
       };
-      return colorMap[this.type] || 'has-background-primary';
+      return colorMap[this.type] || "has-background-primary";
     },
     buttonClass() {
       const colorMap = {
-        primary: 'is-primary',
-        warning: 'is-warning',
-        danger: 'is-danger',
+        primary: "is-primary",
+        warning: "is-warning",
+        danger: "is-danger",
       };
-      return colorMap[this.type] || 'is-primary';
+      return colorMap[this.type] || "is-primary";
     },
     iconName() {
       const iconMap = {
-        primary: 'edit.svg',
-        warning: 'warning.svg',
-        danger: 'alert.svg',
+        primary: "edit.svg",
+        warning: "warning.svg",
+        danger: "alert.svg",
       };
-      return iconMap[this.type] || 'edit.svg';
-    }
+      return iconMap[this.type] || "edit.svg";
+    },
   },
   methods: {
     confirm() {
       if (!this.note.trim()) {
-        this.error = this.isVietnamese ? 'Nội dung không được để trống.' : 'Content cannot be empty.';
+        this.error = this.isVietnamese ? "Nội dung không được để trống." : "Content cannot be empty.";
         return;
       }
-      this.$emit('modalevent', { name: 'noteConfirm', data: { note: this.note } });
-      this.$emit('close');
-    }
-  }
+      this.$emit("modalevent", {
+        name: "noteConfirm",
+        data: { note: this.note },
+      });
+      this.$emit("close");
+    },
+  },
 };
-</script>
+</script>

app/components/dialog/Success.vue

@@ -1,29 +1,43 @@
 <template>
   <div>
     <div class="field is-grouped">
-      <div class="control is-expanded pr-3" v-html="content"></div>
+      <div
+        class="control is-expanded pr-3"
+        v-html="content"
+      ></div>
       <div class="control">
-        <SvgIcon v-bind="{name: 'check2.svg', type: 'primary', size: 24}"></SvgIcon>
+        <SvgIcon v-bind="{ name: 'check2.svg', type: 'primary', size: 24 }"></SvgIcon>
       </div>
     </div>
     <p class="border-bottom mt-3 mb-5"></p>
     <div class="field is-grouped">
       <div class="control is-expanded">
-        <button class="button is-primary" @click="cancel()">Đóng</button>
+        <button
+          class="button is-primary"
+          @click="cancel()"
+        >
+          Đóng
+        </button>
       </div>
-      <div class="control" v-if="duration">
-        <CountDown v-bind="{duration: duration}" @close="cancel()"></CountDown>
+      <div
+        class="control"
+        v-if="duration"
+      >
+        <CountDown
+          v-bind="{ duration: duration }"
+          @close="cancel()"
+        ></CountDown>
       </div>
     </div>
   </div>
 </template>
 <script>
 export default {
-  props: ['content', 'duration'],
+  props: ["content", "duration"],
   methods: {
     cancel() {
-      this.$emit('close')
-    }
-  }
-}
-</script>
+      this.$emit("close");
+    },
+  },
+};
+</script>