changes

app/components/datatable/ScrollBox.vue

@@ -1,32 +1,26 @@
 <template>
-  <div
-    class="px-2"
-    :style="`max-height: ${maxheight}; overflow-y: auto;`"
-  >
+  <div :style="`max-height: ${maxheight}; overflow-y: auto;`">
     <div
       v-for="(v, i) in rows"
       :key="i"
-      class="field is-grouped py-1 my-0"
-      :style="{
-        borderBottom: i !== rows.length - 1 && '1px solid red',
-      }"
+      class="field is-grouped my-0"
     >
-      <p
-        class="control is-expanded py-0 fs-14 hyperlink"
+      <button
+        class="button is-white fs-14 font-normal w-full is-justify-content-start py-1.5"
+        type="button"
         @click="doClick(v, i)"
       >
-        {{ $stripHtml(v[name] || v.fullname || v.code || "n/a", 75) }}
+        <span>{{ $stripHtml(v[name] || v.fullname || v.code || "n/a", 75) }}</span>
         <span
-          class="icon has-text-primary"
           v-if="checked[i] && notick !== true"
+          class="icon has-text-primary"
         >
-          <SvgIcon v-bind="{ name: 'tick.svg', type: 'primary', size: 15 }"></SvgIcon>
           <Icon
             name="material-symbols:check-rounded"
-            :size="15"
+            :size="17"
           />
         </span>
-      </p>
+      </button>
       <p
         class="control py-0"
         v-if="show"
@@ -117,10 +111,18 @@ export default {
     getdata() {
       this.currentPage = 1;
       this.array = this.$copy(this.data);
-      if (this.sort !== false) {
-        let f = {};
-        let showtime = this.show ? this.show.time : false;
-        showtime ? (f["create_time"] = "desc") : (f[this.name] = "asc");
+      if (this.sort) {
+        const f = {};
+        if (this.show?.time) {
+          f.create_time = "desc";
+        }
+
+        if (this.sort.startsWith("-")) {
+          f[this.sort.slice(1)] = "desc";
+        } else {
+          f[this.sort] = "asc";
+        }
+
         this.$multiSort(this.array, f);
       }
       this.rows = this.array.slice(0, this.perpage);
@@ -160,3 +162,12 @@ export default {
   },
 };
 </script>
+<style scoped>
+.button.is-ghost {
+  color: var(--bulma-button-text-color);
+}
+.button.is-ghost:hover,
+.button.is-ghost.is-hovered {
+  color: var(--bulma-button-ghost-hover-color);
+}
+</style>