src/pages/Account/AccountList.vue

@@ -1,17 +1,14 @@
 <script setup>
 import { useI18n } from 'vue-i18n';
-import { computed } from 'vue';
+import { ref, computed } from 'vue';
 import VnTable from 'components/VnTable/VnTable.vue';
 import VnSearchbar from 'components/ui/VnSearchbar.vue';
 import AccountSummary from './Card/AccountSummary.vue';
-import AccountFilter from './AccountFilter.vue';
-
 import { useSummaryDialog } from 'src/composables/useSummaryDialog';
-import { useStateStore } from 'stores/useStateStore';
 
-const stateStore = useStateStore();
 const { t } = useI18n();
 const { viewSummary } = useSummaryDialog();
+const tableRef = ref();
 
 const columns = computed(() => [
     {
@@ -27,6 +24,7 @@ const columns = computed(() => [
         name: 'nickname',
         label: t('nickname'),
         field: 'nickname',
+        isTitle: true,
         component: 'input',
         columnField: {
             component: null,
@@ -62,47 +60,20 @@ const columns = computed(() => [
 </script>
 
 <template>
-    <template v-if="stateStore.isHeaderMounted()">
+    <VnSearchbar
-        <Teleport to="#searchbar">
+        :label="t('account.search')"
-            <VnSearchbar
+        data-key="AccountUsers"
-                data-key="AccountList"
+        :info="t('account.searchInfo')"
-                url="VnUsers/preview"
+    />
-                :expr-builder="exprBuilder"
-                :label="t('account.search')"
-                :info="t('account.searchInfo')"
-            />
-        </Teleport>
-        <Teleport to="#actions-append">
-            <div class="row q-gutter-x-sm">
-                <QBtn
-                    flat
-                    @click="stateStore.toggleRightDrawer()"
-                    round
-                    dense
-                    icon="menu"
-                >
-                    <QTooltip bottom anchor="bottom right">
-                        {{ t('globals.collapseMenu') }}
-                    </QTooltip>
-                </QBtn>
-            </div>
-        </Teleport>
-    </template>
-    <QDrawer v-model="stateStore.rightDrawer" side="right" :width="256" show-if-above>
-        <QScrollArea class="fit text-grey-8">
-            <AccountFilter data-key="AccountList" :expr-builder="exprBuilder" />
-        </QScrollArea>
-    </QDrawer>
 
     <VnTable
         ref="tableRef"
         data-key="AccountUsers"
-        :url="`VnUsers`"
+        url="VnUsers"
         order="id DESC"
         :columns="columns"
         default-mode="table"
         auto-load
-        :is-editable="true"
         redirect="account"
         :use-model="true"
     />