changes

app/components/datatable/ContextMenu.vue

@@ -149,8 +149,7 @@
     <p class="control">
       <button
         class="button"
-        :class="currentField.format !== 'number' && 'has-text-grey-light'"
-        @click="currentField.format === 'number' && $emit('modalevent', { name: 'copyfield', data: currentField })"
+        @click="$copyToClipboard(currentField.name)"
       >
         <span class="icon">
           <Icon
@@ -262,7 +261,7 @@
       <span>{{ currentField.name }}</span>
       <button
         class="button is-small size-8 is-primary is-light is-rounded"
-        @click="copyContent(currentField.name)"
+        @click="$copyToClipboard(currentField.name)"
       >
         <span class="icon">
           <Icon
@@ -430,23 +429,24 @@
 <script setup>
 import { useStore } from "@/stores/index";
 import ScrollBox from "@/components/datatable/ScrollBox.vue";
-const store = useStore();
-const { $copy, $stripHtml, $clone, $arrayMove, $snackbar, $copyToClipboard } = useNuxtApp();
-var props = defineProps({
+
+const props = defineProps({
   pagename: String,
   field: Object,
   filters: Object,
   filterData: Object,
   width: String,
 });
+const { $copy, $stripHtml, $clone, $arrayMove, $snackbar, $copyToClipboard } = useNuxtApp();
 const emit = defineEmits(["modalevent", "changepos", "close"]);
-var colorchoice = store.colorchoice;
+const store = useStore();
+const { colorchoice } = store;
 const errors = ref([]);
 const currentTab = ref("value");
-var currentField = $copy(props.field);
 var pagedata = store[props.pagename];
 var fields = [];
-var label = currentField.label;
+var currentField = $copy(props.field);
+var { label } = currentField;
 const showmodal = ref();
 const checkFilter = function () {};
 const getMenu = function () {
@@ -587,9 +587,6 @@ function createField() {
     height: "630px",
   };
 }
-function copyContent(value) {
-  $copyToClipboard(value);
-}
 function close() {
   showmodal.value = undefined;
 }

app/components/datatable/DataTable.vue

@@ -186,7 +186,7 @@ var scrollbar;
 var fields;
 var currentRow;
 var data = $copy(pagedata.data);
-var showmodal = ref();
+const showmodal = ref();
 watch(
   () => store[props.pagename],
   () => {
@@ -239,8 +239,8 @@ function confirmRemove() {
   $deleterow(pagedata.api.name, currentRow.id, props.pagename, true);
 }
 const clickEvent = function (event, row, field) {
-  let name = typeof event === "string" ? event : event.name;
-  let data = typeof event === "string" ? event : event.data;
+  const name = typeof event === "string" ? event : event.name;
+  const data = typeof event === "string" ? event : event.data;
   if (name === "remove") {
     currentRow = row;
     showmodal.value = {

app/components/datatable/Pagination.vue

@@ -18,7 +18,6 @@
         >
         <a
           v-else
-          href="#"
           class="pagination-link"
           :aria-label="`Goto page ${v}`"
           @click="changePage(v)"
@@ -26,45 +25,32 @@
         >
       </li>
       <a
-        @click="previous()"
+        @click="previous"
         class="pagination-previous ml-5"
       >
-        <SvgIcon
-          v-bind="{
-            name: 'left1.svg',
-            type: 'dark',
-            size: 20,
-            alt: 'Tìm kiếm',
-          }"
-        ></SvgIcon>
+        <Icon name="material-symbols:arrow-back-ios-new-rounded" />
       </a>
       <a
-        @click="next()"
+        @click="next"
         class="pagination-next"
       >
-        <SvgIcon
-          v-bind="{
-            name: 'right.svg',
-            type: 'dark',
-            size: 20,
-            alt: 'Tìm kiếm',
-          }"
-        ></SvgIcon>
+        <Icon name="material-symbols:arrow-forward-ios-rounded" />
       </a>
     </ul>
   </nav>
 </template>
 <script setup>
-const emit = defineEmits(["changepage"]);
-var props = defineProps({
+const props = defineProps({
   data: Array,
   perPage: Number,
 });
-var currentPage = 1;
-var totalRows = props.data.length;
-var lastPage = parseInt(totalRows / props.perPage);
+const emit = defineEmits(["changepage"]);
+let currentPage = 1;
+let totalRows = props.data.length;
+let lastPage = parseInt(totalRows / props.perPage);
 if (lastPage * props.perPage < totalRows) lastPage += 1;
-var pageInfo = ref();
+const pageInfo = ref();
+
 function pages(current_page, last_page, onSides = 2) {
   // pages
   let pages = [];
@@ -81,6 +67,7 @@ function pages(current_page, last_page, onSides = 2) {
   }
   return pages;
 }
+
 function changePage(page) {
   if (page === "...") return;
   currentPage = page;
@@ -90,7 +77,7 @@ function changePage(page) {
 pageInfo.value = pages(1, lastPage, 2);
 watch(
   () => props.data,
-  (newVal, oldVal) => {
+  () => {
     totalRows = props.data.length;
     lastPage = parseInt(totalRows / props.perPage);
     if (lastPage * props.perPage < totalRows) lastPage += 1;