changes

app/components/datatable/ContextMenu.vue

@@ -1,44 +1,6 @@
 <template>
   <div class="is-flex is-flex-direction-column max-h-full">
     <div class="is-flex-shrink-0 toolbar field has-addons is-justify-content-center">
-      <!-- <div class="control">
-        <button
-          class="button is-light is-primary"
-          @click="checkFilter() ? false : $emit('modalevent', { name: 'dosort', data: 'az' })"
-        >
-          <span class="icon">
-            <Icon
-              name="mdi:sort-alphabetical-ascending"
-              :size="22"
-              :class="checkFilter() && 'has-text-grey-70'"
-            />
-          </span>
-        </button>
-        <span
-          class="tooltiptext"
-          style="top: 110%; bottom: unset; min-width: max-content; left: 25px"
-          >Sắp xếp tăng dần</span
-        >
-      </div>
-      <div class="control">
-        <button
-          class="button is-light is-primary"
-          @click="checkFilter() ? false : $emit('modalevent', { name: 'dosort', data: 'za' })"
-        >
-          <span class="icon">
-            <Icon
-              name="mdi:sort-alphabetical-descending"
-              :size="22"
-              :class="checkFilter() && 'has-text-grey-70'"
-            />
-          </span>
-        </button>
-        <span
-          class="tooltiptext"
-          style="top: 110%; bottom: unset; min-width: max-content; left: 25px"
-          >Sắp xếp giảm dần</span
-        >
-      </div> -->
       <div class="control">
         <button
           class="button"
@@ -51,11 +13,7 @@
             />
           </span>
         </button>
-        <span
-          class="tooltiptext"
-          style="top: 110%; bottom: unset; min-width: max-content; left: 0"
-          >Chuyển cột sang trái</span
-        >
+        <span class="tooltiptext">Chuyển cột sang trái</span>
       </div>
       <div class="control">
         <button
@@ -69,11 +27,7 @@
             />
           </span>
         </button>
-        <span
-          class="tooltiptext"
-          style="top: 110%; bottom: unset; min-width: max-content; left: 0"
-          >Chuyển cột sang phải</span
-        >
+        <span class="tooltiptext">Chuyển cột sang phải</span>
       </div>
       <div class="control">
         <button
@@ -87,11 +41,7 @@
             />
           </span>
         </button>
-        <span
-          class="tooltiptext"
-          style="top: 110%; bottom: unset; min-width: max-content; left: 0"
-          >Tăng độ rộng cột</span
-        >
+        <span class="tooltiptext">Tăng độ rộng cột</span>
       </div>
       <div class="control">
         <button
@@ -105,11 +55,7 @@
             />
           </span>
         </button>
-        <span
-          class="tooltiptext"
-          style="top: 110%; bottom: unset; min-width: max-content; left: 0"
-          >Giảm độ rộng cột</span
-        >
+        <span class="tooltiptext">Giảm độ rộng cột</span>
       </div>
       <div class="control">
         <button
@@ -123,11 +69,7 @@
             />
           </span>
         </button>
-        <span
-          class="tooltiptext"
-          style="top: 110%; bottom: unset; min-width: max-content; left: 0"
-          >Ẩn cột</span
-        >
+        <span class="tooltiptext">Ẩn cột</span>
       </div>
       <div class="control">
         <button
@@ -141,11 +83,7 @@
             />
           </span>
         </button>
-        <span
-          class="tooltiptext"
-          style="top: 110%; bottom: unset; min-width: max-content; left: 0"
-          >Xóa cột</span
-        >
+        <span class="tooltiptext">Xóa cột</span>
       </div>
       <div class="control">
         <button
@@ -159,11 +97,7 @@
             />
           </span>
         </button>
-        <span
-          class="tooltiptext"
-          style="top: 110%; bottom: unset; min-width: max-content; left: 0"
-          >Sao chép cột</span
-        >
+        <span class="tooltiptext">Sao chép cột</span>
       </div>
       <div class="control">
         <button
@@ -177,11 +111,7 @@
             />
           </span>
         </button>
-        <span
-          class="tooltiptext"
-          style="top: 110%; bottom: unset; min-width: max-content; left: 0"
-          >Danh sách cột</span
-        >
+        <span class="tooltiptext">Danh sách cột</span>
       </div>
       <div class="control">
         <button
@@ -195,11 +125,7 @@
             />
           </span>
         </button>
-        <span
-          class="tooltiptext"
-          style="top: 110%; bottom: unset; min-width: max-content; left: 0"
-          >Tạo cột mới</span
-        >
+        <span class="tooltiptext left-auto right-0">Tạo cột mới</span>
       </div>
       <div class="control">
         <button
@@ -213,11 +139,7 @@
             />
           </span>
         </button>
-        <span
-          class="tooltiptext"
-          style="top: 110%; bottom: unset; min-width: max-content; right: 0"
-          >Tùy chọn bảng</span
-        >
+        <span class="tooltiptext left-auto right-0">Tùy chọn bảng</span>
       </div>
       <div class="control">
         <button
@@ -231,12 +153,7 @@
             />
           </span>
         </button>
-        <p
-          class="tooltiptext"
-          style="top: 110%; bottom: unset; min-width: max-content; right: 0"
-        >
-          Lưu thiết lập
-        </p>
+        <p class="tooltiptext left-auto right-0">Lưu thiết lập</p>
       </div>
     </div>
     <div class="is-flex-shrink-0 tabs">