From 6c5dd72f97a580382008bb6e01c679701abd82d4 Mon Sep 17 00:00:00 2001
From: Rodney Chen <rodney.chen@hotmail.com>
Date: 星期二, 18 六月 2024 21:16:05 +0800
Subject: [PATCH] 忽略internal
---
src/views/demo/table/UseTable.vue | 246 ++++++++++++++++++++++--------------------------
1 files changed, 112 insertions(+), 134 deletions(-)
diff --git a/src/views/demo/table/UseTable.vue b/src/views/demo/table/UseTable.vue
index 8b78b2f..c38faac 100644
--- a/src/views/demo/table/UseTable.vue
+++ b/src/views/demo/table/UseTable.vue
@@ -1,5 +1,5 @@
<template>
- <div class="p-4">
+ <div class="p-4 flex flex-col">
<div class="mb-4">
<a-button class="mr-2" @click="reloadTable"> 杩樺師 </a-button>
<a-button class="mr-2" @click="changeLoading"> 寮�鍚痩oading </a-button>
@@ -19,141 +19,119 @@
<BasicTable @register="registerTable" />
</div>
</template>
-<script lang="ts">
- import { defineComponent } from 'vue';
- import { BasicTable, ColumnChangeParam, useTable } from '/@/components/Table';
+<script lang="ts" setup>
+ import { BasicTable, ColumnChangeParam, useTable } from '@/components/Table';
import { getBasicColumns, getBasicShortColumns } from './tableData';
- import { useMessage } from '/@/hooks/web/useMessage';
- import { demoListApi } from '/@/api/demo/table';
+ import { useMessage } from '@/hooks/web/useMessage';
+ import { demoListApi } from '@/api/demo/table';
- export default defineComponent({
- components: { BasicTable },
- setup() {
- const { createMessage } = useMessage();
- function onChange() {
- console.log('onChange', arguments);
- }
- const [
- registerTable,
- {
- setLoading,
- setProps,
- getColumns,
- getDataSource,
- getRawDataSource,
- reload,
- getPaginationRef,
- setPagination,
- getSelectRows,
- getSelectRowKeys,
- setSelectedRowKeys,
- clearSelectedRowKeys,
- },
- ] = useTable({
- canResize: true,
- title: 'useTable绀轰緥',
- titleHelpMessage: '浣跨敤useTable璋冪敤琛ㄦ牸鍐呮柟娉�',
- api: demoListApi,
- columns: getBasicColumns(),
- defSort: {
- field: 'name',
- order: 'ascend',
- },
- rowKey: 'id',
- showTableSetting: true,
- onChange,
- rowSelection: {
- type: 'checkbox',
- },
- onColumnsChange: (data: ColumnChangeParam[]) => {
- console.log('ColumnsChanged', data);
- },
- });
-
- function changeLoading() {
- setLoading(true);
- setTimeout(() => {
- setLoading(false);
- }, 1000);
- }
- function changeColumns() {
- setProps({
- columns: getBasicShortColumns(),
- rowSelection: {
- type: 'checkbox',
- },
- showIndexColumn: true,
- });
- }
- function reloadTable() {
- setProps({
- columns: getBasicColumns(),
- rowSelection: {
- type: 'checkbox',
- },
- showIndexColumn: true,
- });
- reload({
- page: 1,
- });
- }
- function getColumn() {
- createMessage.info('璇峰湪鎺у埗鍙版煡鐪嬶紒');
- console.log(getColumns());
- }
-
- function getTableData() {
- createMessage.info('璇峰湪鎺у埗鍙版煡鐪嬶紒');
- console.log(getDataSource());
- }
-
- function getTableRawData() {
- createMessage.info('璇峰湪鎺у埗鍙版煡鐪嬶紒');
- console.log(getRawDataSource());
- }
-
- function getPagination() {
- createMessage.info('璇峰湪鎺у埗鍙版煡鐪嬶紒');
- console.log(getPaginationRef());
- }
-
- function setPaginationInfo() {
- setPagination({
- current: 2,
- });
- reload();
- }
- function getSelectRowList() {
- createMessage.info('璇峰湪鎺у埗鍙版煡鐪嬶紒');
- console.log(getSelectRows());
- }
- function getSelectRowKeyList() {
- createMessage.info('璇峰湪鎺у埗鍙版煡鐪嬶紒');
- console.log(getSelectRowKeys());
- }
- function setSelectedRowKeyList() {
- setSelectedRowKeys(['0', '1', '2']);
- }
- function clearSelect() {
- clearSelectedRowKeys();
- }
-
- return {
- registerTable,
- changeLoading,
- changeColumns,
- reloadTable,
- getColumn,
- getTableData,
- getTableRawData,
- getPagination,
- setPaginationInfo,
- getSelectRowList,
- getSelectRowKeyList,
- setSelectedRowKeyList,
- clearSelect,
- onChange,
- };
+ const { createMessage } = useMessage();
+ function onChange() {
+ console.log('onChange', arguments);
+ }
+ const [
+ registerTable,
+ {
+ setLoading,
+ setProps,
+ getColumns,
+ getDataSource,
+ getRawDataSource,
+ reload,
+ getPaginationRef,
+ setPagination,
+ getSelectRows,
+ getSelectRowKeys,
+ setSelectedRowKeys,
+ clearSelectedRowKeys,
},
+ ] = useTable({
+ canResize: true,
+ title: 'useTable绀轰緥',
+ titleHelpMessage: '浣跨敤useTable璋冪敤琛ㄦ牸鍐呮柟娉�',
+ api: demoListApi,
+ columns: getBasicColumns(),
+ defSort: {
+ field: 'name',
+ order: 'ascend',
+ },
+ rowKey: 'id',
+ showTableSetting: true,
+ onChange,
+ rowSelection: {
+ type: 'checkbox',
+ },
+ onColumnsChange: (data: ColumnChangeParam[]) => {
+ console.log('ColumnsChanged', data);
+ },
+ showSelectionBar: true, // 鏄剧ず澶氶�夌姸鎬佹爮
});
+
+ function changeLoading() {
+ setLoading(true);
+ setTimeout(() => {
+ setLoading(false);
+ }, 1000);
+ }
+ function changeColumns() {
+ setProps({
+ columns: getBasicShortColumns(),
+ rowSelection: {
+ type: 'checkbox',
+ },
+ showIndexColumn: true,
+ });
+ }
+ function reloadTable() {
+ setProps({
+ columns: getBasicColumns(),
+ rowSelection: {
+ type: 'checkbox',
+ },
+ showIndexColumn: true,
+ });
+ reload({
+ page: 1,
+ });
+ }
+ function getColumn() {
+ createMessage.info('璇峰湪鎺у埗鍙版煡鐪嬶紒');
+ console.log(getColumns());
+ }
+
+ function getTableData() {
+ createMessage.info('璇峰湪鎺у埗鍙版煡鐪嬶紒');
+ console.log(getDataSource());
+ }
+
+ function getTableRawData() {
+ createMessage.info('璇峰湪鎺у埗鍙版煡鐪嬶紒');
+ console.log(getRawDataSource());
+ }
+
+ function getPagination() {
+ createMessage.info('璇峰湪鎺у埗鍙版煡鐪嬶紒');
+ console.log(getPaginationRef());
+ }
+
+ function setPaginationInfo() {
+ setPagination({
+ current: 2,
+ });
+ reload();
+ }
+ function getSelectRowList() {
+ createMessage.info('璇峰湪鎺у埗鍙版煡鐪嬶紒');
+ console.log(getSelectRows());
+ }
+ function getSelectRowKeyList() {
+ createMessage.info('璇峰湪鎺у埗鍙版煡鐪嬶紒');
+ console.log(getSelectRowKeys());
+ }
+ function setSelectedRowKeyList() {
+ setSelectedRowKeys(['0', '1', '2']);
+ }
+ function clearSelect() {
+ clearSelectedRowKeys();
+ }
</script>
--
Gitblit v1.9.3