changes

2026-06-04 16:12:51 +07:00
parent 2a1f85c2af
commit 3cfa103306
19 changed files with 106 additions and 106 deletions
--- a/app/components/SearchBox.vue
+++ b/app/components/SearchBox.vue
@@ -79,7 +79,6 @@
        <button
          class="button is-light"
          @click="clearValue"
-          style="height: 100%"
          type="button"
        >
          <span class="icon">
--- a/app/components/datatable/MenuSave.vue
+++ b/app/components/datatable/MenuSave.vue
@@ -4,9 +4,19 @@
    class="mb-4"
    v-if="currentsetting"
  >
-    <p>
-      Đang mở: <b>{{ $stripHtml(currentsetting.name, 40) }}</b>
-    </p>
+    <span>Đang mở: </span>
+    <b>{{ $stripHtml(currentsetting.name, 40) }}</b>
+    <button
+      class="button is-small size-7 p-0 ml-1 is-primary is-light is-rounded"
+      @click="$copyToClipboard(currentsetting.name)"
+    >
+      <span class="icon">
+        <Icon
+          name="material-symbols:content-copy-outline-rounded"
+          :size="14"
+        />
+      </span>
+    </button>
  </div>
  <div class="field">
    <label class="label">Chọn chế độ lưu</label>
@@ -100,7 +110,8 @@
 <script setup>
 import { ref } from "vue";
 import { useStore } from "@/stores/index";
-const emit = defineEmits([]);
+
+const emit = defineEmits(["modalevent", "close"]);
 const store = useStore();
 const props = defineProps({
  pagename: String,
@@ -109,7 +120,7 @@ const props = defineProps({
  data: Object,
  focus: Boolean,
 });
-const { $empty, $copy, $stripHtml, $updateapi, $insertapi, $findIndex, $snackbar } = useNuxtApp();
+const { $empty, $copy, $copyToClipboard, $stripHtml, $updateapi, $insertapi, $findIndex, $snackbar } = useNuxtApp();
 const radioOption = ref();
 const login = { id: 1 };
 const errors = ref([]);
--- a/app/components/datatable/ScrollBox.vue
+++ b/app/components/datatable/ScrollBox.vue
@@ -18,7 +18,7 @@
            <span>{{ $stripHtml(v[name] || v.fullname || v.code || "n/a", 75) }}</span>
            <span
              v-if="checked[i] && notick !== true"
-              class="icon right-3"
+              class="icon right-3 has-background-inherit"
            >
              <Icon
                name="material-symbols:check-rounded"
@@ -101,7 +101,7 @@
        <span>{{ $stripHtml(v[name] || v.fullname || v.code || "n/a", 75) }}</span>
        <span
          v-if="checked[i] && notick !== true"
-          class="icon right-3"
+          class="icon right-3 has-background-inherit"
        >
          <Icon
            name="material-symbols:check-rounded"
--- a/app/components/imports/AddIMEIForm.vue
+++ b/app/components/imports/AddIMEIForm.vue
@@ -26,16 +26,16 @@ async function submit() {
    <div class="grid">
      <div class="cell is-col-span-4">
        <div class="field">
-          <label class="label">Variant</label>
+          <label class="label">Mã Phiên bản</label>
          <SearchBox
            v-bind="{
              api: 'Product_Variant',
              field: 'code',
              column: ['code'],
              optionid: variant.id,
+              clearable: false,
              disabled: true,
              first: true,
-              placeholder: 'Variant',
            }"
            @option="body.variant = $event?.id ?? $event"
          />
--- a/app/components/imports/AddProductVariant.vue
+++ b/app/components/imports/AddProductVariant.vue
@@ -20,7 +20,6 @@ watch(product, () => {
              field: 'name',
              column: ['name'],
              first: true,
-              clearable: true,
              placeholder: 'Tìm sản phẩm',
              addon: {
                component: 'imports/AddProductForm',
--- a/app/components/imports/ProductForm.vue
+++ b/app/components/imports/ProductForm.vue
@@ -114,7 +114,6 @@ async function submit() {
              field: 'name',
              column: ['name'],
              first: true,
-              clearable: true,
              optionid: body.os,
              placeholder: 'OS',
              addon: {
@@ -137,7 +136,6 @@ async function submit() {
              field: 'name',
              column: ['name'],
              first: true,
-              clearable: true,
              optionid: body.manufacturer,
              placeholder: 'Hãng',
              addon: {
@@ -160,7 +158,6 @@ async function submit() {
              field: 'code',
              column: ['code'],
              first: true,
-              clearable: true,
              optionid: body.battery,
              placeholder: 'Pin',
              addon: {
@@ -183,7 +180,6 @@ async function submit() {
              field: 'label',
              column: ['resolution', 'standard', 'technology'],
              first: true,
-              clearable: true,
              optionid: body.screen,
              placeholder: 'Màn hình',
              addon: {
@@ -206,7 +202,6 @@ async function submit() {
              field: 'name',
              column: ['name'],
              first: true,
-              clearable: true,
              placeholder: 'CPU',
              optionid: body.cpu,
              addon: {
@@ -229,7 +224,6 @@ async function submit() {
              field: 'name',
              column: ['name'],
              first: true,
-              clearable: true,
              optionid: body.gpu,
              placeholder: 'GPU',
              addon: {
@@ -252,7 +246,6 @@ async function submit() {
              field: 'code',
              column: ['code'],
              first: true,
-              clearable: true,
              optionid: body.camera_system,
              placeholder: 'Camera',
              addon: {
@@ -275,7 +268,6 @@ async function submit() {
              field: 'code',
              column: ['code'],
              first: true,
-              clearable: true,
              optionid: body.sim,
              placeholder: 'SIM',
              addon: {
@@ -298,7 +290,6 @@ async function submit() {
              field: 'name',
              column: ['name'],
              first: true,
-              clearable: true,
              optionid: body.network_technology,
              placeholder: 'Kết nối',
              addon: {
@@ -321,7 +312,6 @@ async function submit() {
              field: 'code',
              column: ['code'],
              first: true,
-              clearable: true,
              optionid: body.charging_technology,
              placeholder: 'Công nghệ sạc',
              addon: {
@@ -344,7 +334,6 @@ async function submit() {
              field: 'code',
              column: ['code'],
              first: true,
-              clearable: true,
              optionid: body.external_storage,
              placeholder: 'Bộ nhớ ngoài',
              position: 'is-top-right',
@@ -368,7 +357,6 @@ async function submit() {
              field: 'name',
              column: ['name'],
              first: true,
-              clearable: true,
              optionid: body.ip_rating,
              placeholder: 'Chỉ số IP',
              position: 'is-top-right',
@@ -392,7 +380,6 @@ async function submit() {
              field: 'label',
              column: ['frame_material', 'back_material'],
              first: true,
-              clearable: true,
              optionid: body.design,
              placeholder: 'Chất liệu',
              position: 'is-top-right',
--- a/app/components/imports/ProductVariantForm.vue
+++ b/app/components/imports/ProductVariantForm.vue
@@ -137,7 +137,6 @@ async function submit() {
              field: 'name',
              column: ['name'],
              first: true,
-              clearable: true,
              optionid: body.color,
              placeholder: 'Màu sắc',
              addon: {
@@ -160,7 +159,6 @@ async function submit() {
              field: 'code',
              column: ['code'],
              first: true,
-              clearable: true,
              optionid: body.ram,
              placeholder: 'RAM',
              addon: {
@@ -183,7 +181,6 @@ async function submit() {
              field: 'code',
              column: ['code'],
              first: true,
-              clearable: true,
              optionid: body.internal_storage,
              placeholder: 'Bộ nhớ trong',
              addon: {
--- a/app/components/imports/ProductVariantFormNew.vue
+++ b/app/components/imports/ProductVariantFormNew.vue
@@ -77,7 +77,6 @@ async function submit() {
              field: 'name',
              column: ['name'],
              first: true,
-              clearable: true,
              placeholder: 'Sản phẩm',
              addon: {
                component: 'imports/ProductForm',
@@ -116,7 +115,6 @@ async function submit() {
              field: 'name',
              column: ['name'],
              first: true,
-              clearable: true,
              optionid: body.color,
              placeholder: 'Màu sắc',
              addon: {
@@ -139,7 +137,6 @@ async function submit() {
              field: 'code',
              column: ['code'],
              first: true,
-              clearable: true,
              optionid: body.ram,
              placeholder: 'RAM',
              addon: {
@@ -162,7 +159,6 @@ async function submit() {
              field: 'code',
              column: ['code'],
              first: true,
-              clearable: true,
              optionid: body.internal_storage,
              placeholder: 'Bộ nhớ trong',
              addon: {
--- a/app/components/menu/MenuFile.vue
+++ b/app/components/menu/MenuFile.vue
@@ -34,7 +34,7 @@ export default {
  props: ["api", "pagename", "row", "disable"],
  methods: {
    async openFile(row) {
-      let url = `${this.$getpath()}static/files/${row.file__file || row.file}`;
+      const url = `${this.$getpath()}static/files/${row.file__file || row.file}`;
      window.open(url, "_blank");
    },
    async downloadFile(url, fileName) {
--- a/app/components/pos/ChooseIMEIModal.vue
+++ b/app/components/pos/ChooseIMEIModal.vue
@@ -37,7 +37,7 @@ async function fetchImeis() {
    filter: { variant: props.variant.id },
  });

-  imeis.value = imeisFetched;
+  imeis.value = imeisFetched.filter((imeiRec) => !store.selectedImeis.find((i) => i.imei === imeiRec.imei));
  isLoading.value = false;
 }
 onMounted(fetchImeis);
@@ -84,27 +84,24 @@ onMounted(fetchImeis);
          v-for="(imeiRec, i) in imeis"
          :key="imeiRec.id"
          class="is-clickable"
-          :class="
-            (store.selectedImeis.find((i) => i.imei === imeiRec.imei) ||
-              selectedImeis.find((i) => i.imei === imeiRec.imei)) &&
-            'is-selected'
-          "
+          :class="selectedImeis.find((i) => i.imei === imeiRec.imei) && 'is-selected'"
          @click="toggleSelected(imeiRec)"
        >
          <td class="is-narrow">
            <label class="checkbox">
              <input
                type="checkbox"
-                :checked="
-                  store.selectedImeis.find((i) => i.imei === imeiRec.imei) ||
-                  selectedImeis.find((i) => i.imei === imeiRec.imei)
-                "
+                :checked="selectedImeis.find((i) => i.imei === imeiRec.imei)"
              />
            </label>
          </td>
          <td class="is-narrow">{{ i + 1 }}</td>
          <td class="is-family-monospace">{{ imeiRec.imei }}</td>
-          <td>{{ imeiRec.deleted ? "Không có sẵn" : "Có sẵn" }}</td>
+          <td>
+            <span :class="['tag is-light', imeiRec.deleted ? 'is-danger' : 'is-success']">{{
+              imeiRec.deleted ? "Không có sẵn" : "Có sẵn"
+            }}</span>
+          </td>
        </tr>
      </tbody>
    </table>
--- a/app/components/pos/POS.vue
+++ b/app/components/pos/POS.vue
@@ -3,6 +3,8 @@ import ProductCard from "@/components/pos/ProductCard.vue";
 import SearchBox from "@/components/SearchBox.vue";

 const store = useStore();
+const { $numtoString } = useNuxtApp();
+
 function openModal() {
  store.showmodal = {
    component: "pos/ProductSelection",
@@ -12,28 +14,31 @@ function openModal() {
  };
 }

-const customer = ref(null);
-const paymentMethod = ref(null);
+const record = ref({
+  customer: null,
+  paymentMethod: null,
+});
+const subtotal = computed(() => {
+  return store.selectedImeis.reduce((prev, curr) => prev + curr.variant__price, 0);
+});
 </script>

 <template>
-  <div class="card">
-    <div class="card-content">
-      <button
-        @click="openModal"
-        class="button is-primary"
-      >
-        <span class="icon">
-          <Icon
-            name="material-symbols:add-rounded"
-            :size="20"
-          />
-        </span>
-        <span>Chọn sản phẩm</span>
-      </button>
-    </div>
+  <div class="block">
+    <button
+      @click="openModal"
+      class="button is-primary"
+    >
+      <span class="icon">
+        <Icon
+          name="material-symbols:add-rounded"
+          :size="20"
+        />
+      </span>
+      <span>Chọn sản phẩm</span>
+    </button>
  </div>
-  <div class="fixed-grid has-12-cols">
+  <div class="fixed-grid has-1-cols-mobile has-12-cols">
    <div class="grid">
      <div class="cell is-col-span-8">
        <div class="card">
@@ -46,7 +51,6 @@ const paymentMethod = ref(null);
                />
              </span>
              <span>Giỏ hàng</span>
-              <span>({{ store.selectedImeis.length }})</span>
            </p>
            <div
              v-if="store.selectedImeis.length > 0"
@@ -86,7 +90,6 @@ const paymentMethod = ref(null);
                  field: 'label',
                  column: ['label'],
                  first: true,
-                  clearable: true,
                  placeholder: 'Khách hàng',
                  addon: {
                    component: 'customer/CustomerQuickAdd',
@@ -94,7 +97,7 @@ const paymentMethod = ref(null);
                    height: 'auto',
                    title: 'Tạo khách hàng',
                  },
-                  onOption: (e) => (customer = e),
+                  onOption: (e) => (record.customer = e),
                }"
              />
            </div>
@@ -118,14 +121,43 @@ const paymentMethod = ref(null);
                  field: 'name',
                  column: ['name'],
                  first: true,
-                  clearable: true,
                  placeholder: 'Phương thức thanh toán',
-                  onOption: (e) => (paymentMethod = e),
+                  onOption: (e) => (record.paymentMethod = e),
                }"
              />
            </div>
          </div>
        </div>
+        <div class="card mb-3">
+          <div class="card-content">
+            <p class="icon-text fs-17 font-semibold mb-4">Tổng cộng</p>
+            <div>
+              <table class="table is-fullwidth fs-13">
+                <tbody>
+                  <tr>
+                    <td>
+                      <span>Tạm tính</span>
+                      <span> ({{ store.selectedImeis.length }} sản phẩm)</span>
+                    </td>
+                    <td class="has-text-right">{{ $numtoString(subtotal, { hasUnit: true }) }}</td>
+                  </tr>
+                  <tr>
+                    <td class="font-bold fs-14">Tổng cộng</td>
+                    <td class="has-text-right has-text-success-35 font-bold fs-17">
+                      {{ $numtoString(subtotal, { hasUnit: true }) }}
+                    </td>
+                  </tr>
+                </tbody>
+              </table>
+              <button
+                class="button is-fullwidth is-success"
+                :disabled="!record.customer || !record.paymentMethod"
+              >
+                Thanh toán
+              </button>
+            </div>
+          </div>
+        </div>
      </div>
    </div>
  </div>
--- a/app/components/pos/ProductCard.vue
+++ b/app/components/pos/ProductCard.vue
@@ -4,7 +4,7 @@ import { remove } from "es-toolkit";
 const props = defineProps({
  imei: Object,
 });
-const { $copyToClipboard, $numtoString, $snackbar } = useNuxtApp();
+const { $numtoString, $snackbar } = useNuxtApp();
 const store = useStore();
 function removeFromCart() {
  remove(store.selectedImeis, (imeiRec) => imeiRec.id === props.imei.id);
@@ -14,7 +14,7 @@ function removeFromCart() {

 <template>
  <div class="card m-0">
-    <div class="card-content p-4 is-flex is-gap-3 is-justify-content-space-between is-align-items-center">
+    <div class="card-content p-4 is-flex is-gap-2 is-justify-content-space-between is-align-items-center">
      <div class="is-flex is-gap-4 is-justify-content-space-between is-align-items-center is-flex-grow-1">
        <div class="media m-0">
          <div class="media-left">
@@ -24,30 +24,16 @@ function removeFromCart() {
          </div>
          <div class="media-content">
            <p class="font-bold fs-15">{{ imei.variant__product__name }}</p>
-            <p class="fs-13">
+            <p class="fs-13 has-text-grey">
              <span>{{ imei.variant__ram__code }}</span>
              <span> • </span>
              <span>{{ imei.variant__internal_storage__code }}</span>
              <span> • </span>
              <span>{{ imei.variant__color__name }}</span>
            </p>
-            <div class="fs-13 is-flex is-gap-0.5 is-align-items-center">
-              <span class="is-family-monospace">IMEI: {{ imei.imei }}</span>
-              <button
-                class="button is-small size-7 p-0 is-primary is-light is-rounded"
-                @click="$copyToClipboard(imei.imei)"
-              >
-                <span class="icon">
-                  <Icon
-                    name="material-symbols:content-copy-outline-rounded"
-                    :size="14"
-                  />
-                </span>
-              </button>
-            </div>
          </div>
        </div>
-        <p class="has-text-primary-50 font-semibold">{{ $numtoString(imei.variant__price, { hasUnit: true }) }}</p>
+        <p class="has-text-primary-50 font-medium">{{ $numtoString(imei.variant__price, { hasUnit: true }) }}</p>
      </div>
      <div>
        <button
--- a/app/components/pos/ProductSelection.vue
+++ b/app/components/pos/ProductSelection.vue
@@ -18,7 +18,7 @@ function selected(api, chosen) {
            <div class="control">
              <input
                class="input"
-                v-model.trim="filter.name"
+                v-model.trim="filter.product__name__icontains"
                type="text"
                placeholder="Tên"
              />
@@ -34,7 +34,6 @@ function selected(api, chosen) {
                field: 'name',
                column: ['name'],
                first: true,
-                clearable: true,
                optionid: filter.os,
                placeholder: 'OS',
              }"
@@ -51,7 +50,6 @@ function selected(api, chosen) {
                field: 'name',
                column: ['name'],
                first: true,
-                clearable: true,
                optionid: filter.manufacturer,
                placeholder: 'Hãng',
              }"
@@ -68,7 +66,6 @@ function selected(api, chosen) {
                field: 'code',
                column: ['code'],
                first: true,
-                clearable: true,
                optionid: filter.battery,
                placeholder: 'Pin',
              }"
@@ -85,7 +82,6 @@ function selected(api, chosen) {
                field: 'label',
                column: ['resolution', 'standard', 'technology'],
                first: true,
-                clearable: true,
                optionid: filter.screen,
                placeholder: 'Màn hình',
              }"
@@ -102,7 +98,6 @@ function selected(api, chosen) {
                field: 'name',
                column: ['name'],
                first: true,
-                clearable: true,
                placeholder: 'CPU',
                optionid: filter.cpu,
              }"
@@ -119,7 +114,6 @@ function selected(api, chosen) {
                field: 'name',
                column: ['name'],
                first: true,
-                clearable: true,
                optionid: filter.gpu,
                placeholder: 'GPU',
              }"
@@ -136,7 +130,6 @@ function selected(api, chosen) {
                field: 'code',
                column: ['code'],
                first: true,
-                clearable: true,
                optionid: filter.external_storage,
                placeholder: 'Bộ nhớ ngoài',
                position: 'is-top-right',
--- a/app/components/snackbar/Error.vue
+++ b/app/components/snackbar/Error.vue
@@ -9,7 +9,7 @@
    </span>
    <p
      v-html="content"
-      class="control is-expanded"
+      class="control is-expanded fs-14"
    ></p>
  </div>
 </template>
--- a/app/components/snackbar/Info.vue
+++ b/app/components/snackbar/Info.vue
@@ -1,5 +1,8 @@
 <template>
-  <p v-html="props.content"></p>
+  <p
+    v-html="props.content"
+    class="fs-14"
+  ></p>
 </template>
 <script setup>
 const props = defineProps({
--- a/app/components/snackbar/SnackBar.vue
+++ b/app/components/snackbar/SnackBar.vue
@@ -13,7 +13,9 @@ setTimeout(() => store.commit("snackbar", undefined), 3900);
 </script>

 <template>
-  <div class="snackbar is-flex is-align-items-center is-gap-3 pl-3 pr-1.5 py-2 rounded-md has-text-white">
+  <div
+    class="snackbar is-flex is-justify-content-space-between is-align-items-center is-gap-3 pl-3 pr-1.5 py-2 rounded-md has-text-white"
+  >
    <Info
      v-if="component === 'Info'"
      v-bind="vbind"
@@ -47,13 +49,13 @@ setTimeout(() => store.commit("snackbar", undefined), 3900);
 .snackbar {
  position: fixed;
  z-index: 999;
-  top: 50px;
+  top: 40px;
  left: 0;
  right: 0;
  margin-inline: auto;
  width: fit-content;
-  max-width: 500px;
-  background-color: hsl(from var(--bulma-grey-darker) h s l / 0.9);
+  max-width: min(500px, 90vw);
+  background-color: hsl(from var(--bulma-grey-darker) h s l / 0.85);
 }

 .button.is-ghost {
--- a/app/components/snackbar/Success.vue
+++ b/app/components/snackbar/Success.vue
@@ -9,7 +9,7 @@
    </span>
    <p
      v-html="content"
-      class="control is-expanded"
+      class="control is-expanded fs-14"
    ></p>
  </div>
 </template>
--- a/app/plugins/01-common.js
+++ b/app/plugins/01-common.js
@@ -43,7 +43,7 @@ export default defineNuxtPlugin((nuxtApp) => {
    $store.commit("snackbar", {
      component,
      vbind: {
-        content: typeof content == "string" ? content : JSON.stringify(content),
+        content: typeof content === "string" ? content : JSON.stringify(content),
      },
    });
  };
@@ -190,7 +190,7 @@ export default defineNuxtPlugin((nuxtApp) => {
  };

  const copyToClipboard = function (text) {
-    snackbar("Copied to clipboard");
+    snackbar("Copied to clipboard", "Success");
    if (window.clipboardData && window.clipboardData.setData) {
      // IE specific code path to prevent textarea being shown while dialog is visible.
      return clipboardData.setData("Text", text);
@@ -296,8 +296,8 @@ export default defineNuxtPlugin((nuxtApp) => {
  };

  const download = async function (url, fileName) {
-    let name = dayjs(new Date()).format("YYYYMMDDhhmmss") + "-" + fileName;
-    const response = await fetch(url, { method: "GET" });
+    const name = dayjs(new Date()).format("YYYYMMDDhhmmss") + "-" + fileName;
+    const response = await fetch(url);
    const blob = await response.blob();
    const urlDownload = window.URL.createObjectURL(blob);
    const link = document.createElement("a");
--- a/app/plugins/02-connection.js
+++ b/app/plugins/02-connection.js
@@ -1516,9 +1516,7 @@ export default defineNuxtPlugin((nuxtApp) => {
    }

    try {
-      const response = await $fetch(url.toString(), {
-        method: "GET",
-      });
+      const response = await $fetch(url.toString());

      if (response && response.pdf) {
        const pdfUrl = `${apiBaseUrl}static/contract/${response.pdf}`;