hs-admin-ui 1.0.0 → 1.0.2

package/src/components/business/bcPageConfig/usePageConfig.ts

@@ -1,469 +0,0 @@
-import _ from 'lodash';
-import { Ref, ref } from 'vue';
-import { ElMessageBox, ElMessage, TabPaneName } from 'element-plus';
-import ICustomData from '/@/types/customData';
-import IFormTable from '/@/types/formTable';
-import { useFieldConfigController } from '/@/api/fieldConfigController/index';
-import { find } from 'lodash';
-const fieldConfig = useFieldConfigController();
-interface saveForm {
-	initOriginConfig: (list: Array<IFormTable.FormTable>, index: number) => {};
-}
-export function useHsPageConfig(
-	panelConfig: Ref<IFormTable.FormTable>,
-	configs: Ref<Array<IFormTable.FormTable>>,
-	saveFormRef: Ref<saveForm>,
-	emits: (event: 'refresh', ...args: ICustomData.Data[]) => void
-) {
-	/**
-	 * 添加表格配置
-	 */
-	const addTabPanel = () => {
-		panelConfig.value.tables.push({
-			id: 'table_' + new Date().getTime().toString(),
-			baseData: { id: '' },
-			tableConfig: [],
-		});
-	};
-	/**
-	 * 移除tabs项
-	 * @param targetName
-	 * @returns
-	 */
-	const removeTabPanel = (targetName: TabPaneName | undefined) => {
-		// 查询当前表格配置对象
-		let table = find(panelConfig.value.tables, (item: IFormTable.Table) => item['id'] == targetName);
-
-		// 删除表格配置提示
-		ElMessageBox.confirm(`确定删除${table?.baseData['tableName'] || '表格配置'}吗？`, '提示', {
-			confirmButtonText: '确认',
-			cancelButtonText: '取消',
-			type: 'warning',
-		})
-			.then(() => {
-				// 移除配置
-				_.remove(panelConfig.value.tables, (item: IFormTable.Table) => targetName && item.id == targetName);
-				// 给出操作成功提示
-				ElMessage.success('删除成功');
-			})
-			.catch((err) => {
-				console.log('err', err);
-			});
-	};
-	/**
-	 * 编辑tabs
-	 * @param targetName
-	 * @param action
-	 */
-	const handleTabsEdit = (targetName: TabPaneName | undefined, action: 'remove' | 'add') => {
-		switch (action) {
-			case 'remove':
-				// 删除配置
-				removeTabPanel(targetName);
-				break;
-			case 'add':
-				// 新增配置
-				addTabPanel();
-				break;
-		}
-	};
-	let config = ref();
-	/**
-	 * 过滤出无效配置
-	 * @param originConfig
-	 * @returns
-	 */
-	const filterInvalidConfig = (originConfig: IFormTable.FormTable) => {
-		if (originConfig.form) {
-			// 如果表单项没有配置字段参数，则将该表单项删除
-			if (originConfig.form.formConfig.length > 0) {
-				originConfig.form.formConfig = _.filter(
-					originConfig.form.formConfig,
-					(item: IFormTable.ConfigItemType) => item.data.baseData.prop && item.data.baseData.isApply
-				);
-			}
-			// 如果表单中没有表单项，则将表单配置删除
-			if (originConfig.form.formConfig.length <= 0) {
-				delete originConfig.form;
-			}
-		}
-		// 过滤掉表格配置项字段名为空的值
-		originConfig.tables.map((table: IFormTable.Table) => {
-			table.tableConfig = _.filter(table.tableConfig, (item: IFormTable.TableItem) => {
-				if ((item.data.field || item.data.type) && item.data.isApply) {
-					// =============== 如果存在列类型，则清空【列字段名】和【返回值类型】 【start】 =================
-					if (item.data.type) {
-						item.data.field = ''; // 清空列字段名
-						item.data.returnValueType = ''; // 清空返回值类型
-					}
-					// =============== 如果存在列类型，则清空【列字段名】和【返回值类型】 【end】 =================
-					// =============== 筛选条件：filters 和filterConfig顺序不可调整【start】==============
-					// 过滤生效的筛选条件配置及数据
-					// item.filterConfig = _.filter(
-					// 	item.filterConfig,
-					// 	(filterItem: ICustomData.Data, index: number) => item.data.filters && item.data.filters[index]['value']
-					// );
-					// 过滤有value值的筛选条件数据
-					item.data.filters = _.filter(item.data.filters, (filterData: ICustomData.Data) => filterData.value);
-					// =============== 筛选条件：filters 和filterConfig顺序不可调整【end】==============
-					// ===================== TODO: btnData和btnConfig处理顺序不可修改【start】=================
-					// 过滤有按钮key的配置【btnConfig】
-					// item.btnConfig = _.filter(item.btnConfig, (btnItem: IFormTable.BtnItem, index: number) => item.btnData[index].key);
-					// 过滤没有按钮key的数据【btnData】
-					item.btnData = _.filter(item.btnData, (btnItem: IFormTable.BtnItem, index: number) => item.btnData[index].key);
-					// ===================== TODO: btnData和btnConfig处理顺序不可修改【end】=================
-					return true;
-				}
-			});
-			return table;
-		});
-		// 过滤掉没有表格配置项的表格
-		originConfig.tables = _.filter(originConfig.tables, (item: IFormTable.Table) => {
-			return item.tableConfig.length > 0;
-		});
-
-		// 过滤掉按钮配置项按钮key值为空的值
-		originConfig.btns = _.filter(originConfig.btns, (item: IFormTable.BtnItem) => item.data.key && item.data.isApply);
-		return originConfig;
-	};
-	/**
-	 * 过滤对象中的空值【递归方法】
-	 * @param data
-	 */
-	const filterEmptyData = (data: ICustomData.Data = {}) => {
-		Object.keys(data).forEach((key) => {
-			// 过滤空值
-			if (
-				data[key] == '' ||
-				data[key] == null ||
-				data[key] == undefined ||
-				(data[key] instanceof Array && data[key].length <= 0) ||
-				(data[key] instanceof Object && _.isEmpty(data[key]))
-			) {
-				// 删除值为空的属性
-				delete data[key];
-			} else if (data[key] instanceof Object) {
-				// 如果值是对象则用递归过滤空值
-				filterEmptyData(data[key]);
-			} else if (data[key] instanceof Array) {
-				// 如果是数据则遍历数组并将数组对象调用递归
-				data[key].map((item: ICustomData.Data) => {
-					return filterEmptyData(item);
-				});
-			}
-		});
-		return data;
-	};
-	/**
-	 * 过滤配置保留配置数据【给业务配置解析使用数据】
-	 * @param originConfig
-	 */
-	const filterConfigReserveData = (originConfig: IFormTable.FormTable) => {
-		// 整理按钮配置数据
-		originConfig.btns = _.map(originConfig.btns, (item: IFormTable.BtnItem) => {
-			// 返回{id, data}
-			return {
-				id: item.id,
-				data: filterEmptyData(item.data),
-			};
-		});
-		if (originConfig.form) {
-			// 整理过滤空值表单配置数据
-			originConfig.form.baseData = _.assign({}, filterEmptyData(originConfig.form.baseData));
-			// 整理过滤出表单项配置
-			originConfig.form.formConfig = _.map(originConfig.form.formConfig, (item: IFormTable.ConfigItemType) => {
-				return {
-					data: filterEmptyData(item.data),
-					id: item.id,
-				};
-			});
-			// 删除表单配置
-			delete originConfig.form.baseConfig;
-		}
-		// 整理表格配置数据
-		originConfig.tables = _.map(originConfig.tables, (table: IFormTable.Table) => {
-			let tableConfig = table.tableConfig.map((item: IFormTable.TableItem) => {
-				// 表格配置数据删除无用值字段
-				let list = item.btnData.map((btnItem: ICustomData.BtnData) => filterEmptyData(btnItem));
-				return {
-					id: item.id,
-					data: filterEmptyData(item.data), // 过滤空值
-					btnData: list,
-				};
-			});
-			// 过滤空值
-			let baseData = filterEmptyData(table.baseData);
-			// 合并过滤空值后的数据
-			table = _.assign(table, { tableConfig, baseData });
-			// 删除表格配置
-			delete table.baseConfig;
-			return table;
-		});
-		return originConfig;
-	};
-
-	/**
-	 * 格式化数据池数据
-	 * @param originConfig
-	 */
-	const formatDataPool = (originConfig: IFormTable.FormTable) => {
-		// 数据池数据类型
-		interface PoolData {
-			field_code: string;
-			field_name: string;
-			field_type: string; // 数据池中字段类型【1:按钮   2:表单   3:表格】
-			json_data: ICustomData.Data;
-		}
-		// 定义数据池数据
-		let pool_data: PoolData[] = [];
-		// 遍历按钮向数据池中追加数据
-		originConfig.btns.forEach((item: IFormTable.BtnItem) => {
-			pool_data.push({
-				field_code: item.data.key,
-				field_name: item.data.name,
-				field_type: '1', // 数据池中字段类型【1:按钮   2:表单   3:表格】
-				json_data: item,
-			});
-		});
-		// 遍历表格向数据池中追加数据
-		originConfig.tables.forEach((table: IFormTable.Table) => {
-			table.tableConfig.forEach((item: IFormTable.TableItem) => {
-				pool_data.push({
-					field_code: item.data.field || '',
-					field_name: item.data.title || '',
-					field_type: '3', // 数据池中字段类型【1:按钮   2:表单   3:表格】
-					json_data: item,
-				});
-			});
-		});
-		if (originConfig.form) {
-			// 遍历表单向数据池中追加数据
-			originConfig.form.formConfig.forEach((item: IFormTable.ConfigItemType) => {
-				pool_data.push({
-					field_code: item.data.baseData.prop,
-					field_name: item.data.baseData.label,
-					field_type: '2', // 数据池中字段类型【1:按钮   2:表单   3:表格】
-					json_data: item,
-				});
-			});
-		}
-		return pool_data;
-	};
-	/**
-	 * 整理发送接口的权限数据
-	 */
-	const formatAPIAuthData = () => {
-		// 配置数据
-		let configList = _.cloneDeep(configs.value);
-		// 给出默认空数据
-		let listData: Array<ICustomData.Data> = [];
-		// 遍历配置向默认数据listData追加数据
-		configList.forEach((config: IFormTable.FormTable) => {
-			let obj = filterConfigReserveData(config);
-			listData.push(obj);
-		});
-		// 返回数据
-		return listData;
-	};
-	/**
-	 * 过滤数据权限配置
-	 * @param originConfig
-	 */
-	const getDataAuthConfig = () => {
-		interface AuthData {
-			/** 按钮权限数据 */
-			btns: ICustomData.Data;
-			/** form权限数据 */
-			form: ICustomData.Data;
-			/** 表格权限数据 */
-			tables: ICustomData.Data;
-		}
-		// 定义一个空页面权限数据
-		let pageAuthData: AuthData[] = [];
-		// 获取页面中的所有配置
-		let configList = _.cloneDeep(configs.value);
-		// 【configlist】正常是过滤冗余字段
-		configList.forEach((config: IFormTable.FormTable) => {
-			let authData = {
-				code: config.config_unique_id,
-				name: config.config_name,
-				btns: {},
-				form: {},
-				tables: {},
-			};
-			// 将表单、表格、按钮配置转为map数据
-			authData.btns = _.keyBy(
-				(config.btns || []).map((item: IFormTable.BtnItem) => {
-					return {
-						code: item.data.key, // 字段值
-						name: item.data.name, // 字段名
-						is_export: true, // 是否导出
-						show: true, // 是否显示
-					};
-				}),
-				'code'
-			);
-			if (config.form) {
-				let form = config.form.formConfig.map((item: IFormTable.ConfigItemType) => {
-					return {
-						code: item.data.baseData.prop, // 字段值
-						name: item.data.baseData.label, // 字段名
-						is_export: true, // 是否导出
-						show: true, // 是否显示
-					};
-				});
-				authData.form = _.keyBy(form, 'code');
-			}
-			(config.tables || []).forEach((table: IFormTable.Table) => {
-				let tableObject = _.keyBy(
-					table.tableConfig.map((item: IFormTable.TableItem) => {
-						return {
-							name: item.data.title,
-							code: item.data.field,
-							is_export: true, // 是否导出
-							show: true, // 是否显示
-						};
-					}),
-					'code'
-				);
-				authData.tables = _.assign(authData.tables, {
-					[table.id]: tableObject,
-				});
-			});
-			pageAuthData.push(authData);
-		});
-		// 将数组转为对象
-		let data: ICustomData.Data = {};
-		// 将数据转为map数据
-		data = _.keyBy(pageAuthData, 'code');
-		return data;
-	};
-	// 当前tab项
-	let tabsActiveName = ref('btn');
-	/**
-	 * 切换表单表格配置
-	 * @param config
-	 */
-	const changeConfig = (config: IFormTable.FormTable) => {
-		// 更新配置
-		panelConfig.value = config;
-		// 切换tab至按钮配置
-		tabsActiveName.value = 'btn';
-	};
-
-	const initConfigData = (index: number) => {
-		// 切换页面，将当前切为默认按钮配置
-		tabsActiveName.value = 'btn';
-		// 调用保存组件的初始化数据的方法
-		// console.log('configs.value', configs.value);
-
-		if (saveFormRef.value) {
-			saveFormRef.value.initOriginConfig(configs.value, index);
-		}
-	};
-
-	let systemData = ref(); // 系统数据
-	let menuData = ref(); // 菜单数据
-
-	/**
-	 * 初始化数据
-	 * @param configs
-	 */
-	const initData = (
-		configList: Array<IFormTable.FormTable>,
-		menu: Record<string, IFormTable.Data | string>,
-		system: Record<string, IFormTable.Data | string>
-	) => {
-		// 更新页面配置数据
-		configs.value = configList;
-		systemData.value = system; // 系统信息
-		menuData.value = menu; // 页面信息
-
-		initConfigData(0);
-	};
-	/**
-	 * 保存表单表格配置
-	 */
-	const saveFormTableConfig = async (form: { config_name: string; config_unique_id: string }) => {
-		// ===================== 过滤掉无效配置 start =======================
-		// 清除表单、表格、按钮中 无用的项
-		let originConfig = await filterInvalidConfig(_.cloneDeep(panelConfig.value));
-		originConfig = _.assign(originConfig, form);
-		// 当前配置项在配置数组中所在的下标
-		let ids = configs.value.map((item) => item.config_unique_id);
-		let idx = ids.indexOf(originConfig.config_unique_id);
-		// 判断是修改配置还是新增配置
-		if (idx > -1) {
-			// 替换配置数据
-			configs.value.splice(idx, 1, originConfig);
-		} else {
-			// 新增配置
-			configs.value.push(originConfig);
-		}
-		// ===================== 过滤掉无效配置 end =======================
-		// ===================== 新增数据池数据 start =======================
-		let data_pool = await formatDataPool(originConfig);
-		// ===================== 新增数据池数据 end =======================
-		// ===================== 过滤掉配置项保留配置数据 start =======================
-		// 清除表单、表格、按钮中 无用的项
-		let baseConfig = await filterConfigReserveData(_.cloneDeep(originConfig));
-		// ===================== 过滤掉配置项保留配置数据 end =======================
-		// ===================== 过滤出权限所需配置 start =======================
-		// 将页面中的全部配置 整合 为一个权限配置数据
-		formatAPIAuthData();
-		let authConfig = await getDataAuthConfig();
-		// ===================== 过滤出权限所需配置 end =======================
-
-		console.log(
-			'originConfig系统配置',
-			originConfig,
-			JSON.stringify(originConfig),
-			'baseConfig==业务配置',
-			baseConfig,
-			'authConfig权限配置数组',
-			authConfig,
-			'data_pool 数据池数据',
-			data_pool
-		);
-		let obj = {
-			business_json: JSON.stringify(originConfig), //	表格字段业务json数据
-			config_name: originConfig.config_name, //	配置名称
-			config_type: '1', //	配置类型 默认1
-			config_unique_id: originConfig.config_unique_id, //	配置标识
-			field_json: JSON.stringify(baseConfig), //	表格字段json数据
-			menu_id: menuData.value.id || '', //	菜单id
-			page_name: menuData.value.meta.title, //	页面名称
-			field_pool_json: JSON.stringify(data_pool), //字段池json数据
-			id: originConfig.id || '', //	id
-			project_code: systemData.value.project_code, // 所属系统
-			update_time: originConfig.update_time || '',
-		};
-		console.log('obj', obj);
-		// fieldConfig
-		// 	.postAddField(obj)
-		// 	.then((res) => {
-		// 		console.log('res---保存配置', res);
-		// 		ElMessage.success('保存配置成功, 可在控制台打印中查看配置数据');
-
-		// 		config.value = originConfig;
-		// 		// 初始化页面
-		// 		// let len = idx > -1 ? idx : configs.value.length - 1;
-		// 		// initConfigData(len);
-
-		// 		// 更新页面数据
-		// 		emits('refresh');
-		// 	})
-		// 	.catch((err) => {
-		// 		console.log('er', err);
-		// 	});
-	};
-
-	return {
-		handleTabsEdit,
-		saveFormTableConfig,
-		changeConfig,
-		initData,
-		tabsActiveName,
-		config,
-	};
-}

package/src/components/business/bcSelect/bcSelect.vue

@@ -1,50 +0,0 @@
-<template>
-	<hs-select ref="selectRef" v-bind="$attrs">
-		<template v-if="groupAttrs.isGroupEnabled">
-			<hs-option-group v-for="group in optionsList" :key="group.label" :label="group.label">
-				<hs-option v-for="option in group.options" :key="option.value" :value="option[optionAttrs.value]" :label="option[optionAttrs.label]" />
-			</hs-option-group>
-		</template>
-		<template v-else>
-			<hs-option
-				v-for="option in optionsList"
-				:disabled="optionAttrs.disabled"
-				:key="option.value"
-				:value="option[optionAttrs.value]"
-				:label="option[optionAttrs.label]"
-			></hs-option>
-		</template>
-	</hs-select>
-</template>
-<script lang="ts" setup name="BcSelect">
-import { computed, ref } from 'vue';
-import ICustomData from '/@/types/customData';
-import { Selelct } from '/@/types/formItem/selelct';
-
-interface Props {
-	options: ICustomData.Data[];
-	groupAttrs: Selelct['groupAttrs'];
-	optionAttrs: Selelct['optionAttrs'];
-}
-
-const props = defineProps<Props>();
-const selectRef = ref();
-const optionsList = computed(() => {
-	if (props.options) {
-		return props.options as unknown as ICustomData.Data[];
-	}
-	return [];
-});
-function focus() {
-	selectRef.value.selectRef.focus();
-}
-function blur() {
-	selectRef.value.selectRef.blur();
-}
-function activeElement() {
-	return selectRef.value.selectRef.inputRef;
-}
-
-defineExpose({ focus, blur, activeElement });
-</script>
-<style scoped lang="scss"></style>

package/src/components/business/bcSwitchSystems/bcSwitchSystems.vue

@@ -1,36 +0,0 @@
-<template>
-	<div class="flex">
-		<div v-if="props.showLabel" class="basis-1/4 flex flex-col justify-center">{{ props.labelText }}</div>
-		<hs-select class="flex-1" v-model="curSys" @change="onChange">
-			<hs-option v-for="item in systems" :key="item.value" :label="item.label" :value="item.value" />
-		</hs-select>
-	</div>
-</template>
-
-<script setup lang="ts">
-import { onMounted } from 'vue';
-import { useHsSwitchSystems } from './useSwitchSystems';
-const props = defineProps({
-	// 是否显示label
-	showLabel: {
-		type: Boolean,
-		default: false,
-	},
-	// 自定义label文本内容
-	labelText: {
-		type: String,
-		default: '当前系统：',
-	},
-});
-const emits = defineEmits(['change']);
-// 结构hook中的方法数据
-const { onChange, initData, curSys, systems } = useHsSwitchSystems(emits);
-/**
- * 生命周期函数
- */
-onMounted(() => {
-	initData();
-});
-</script>
-
-<style lang="scss" scoped></style>

package/src/components/business/bcSwitchSystems/useSwitchSystems.ts

@@ -1,74 +0,0 @@
-import { ref, Ref } from 'vue';
-import _ from 'lodash';
-import IFormTable from '/@/types/formTable';
-// import ComponentAttr from '/@/types/components';
-import { Session } from '/@/utils/storage';
-import { useSystemController } from '/@/api/systemController';
-const system = useSystemController();
-import { GetAllSystemInfo } from '/@/api/systemController/type';
-export function useHsSwitchSystems(emits: (event: 'change', ...args: IFormTable.Data[]) => void) {
-	// 类型
-	type Option = Record<'value' | 'label', string>;
-
-	// 当前系统绑定值
-	let curSys = ref('');
-	// 下拉选择数据
-	let systems = ref<GetAllSystemInfo.data>();
-	/**
-	 * 切换选择系统回调
-	 */
-	const onChange = (value: string) => {
-		// 获取操作对象
-		let item = systems.value.find((item: Option) => item.value == value);
-		// 对象赋值
-		curSys.value = _.cloneDeep(item?.value || '');
-		// 将对象存到缓存中【当前系统】
-		Session.set('CURRENT_SYSTEM', item);
-		emits('change', item);
-	};
-	/**
-	 * 获取所有系统信息列表
-	 */
-	const getSystemData = () => {
-		system
-			.getAllSystemInfo<GetAllSystemInfo>()
-			.then((res) => {
-				if (res.code == 1) {
-					// 将返回的所有系统数据
-					systems.value = (res.data || []).map((item) => {
-						let obj = {
-							...item,
-							label: item.project_name || '',
-							value: item.project_code || '',
-						};
-						return obj;
-					});
-					// 如果缓存中存在系统项则用缓存中的数据，如果缓存中没有则取接口返回的第一条数据 否则为空
-					let systemData: Option | undefined = Session.get('CURRENT_SYSTEM') || systems.value[0];
-					// 调用回调change事件，则更新第一个系统的菜单
-					onChange((systemData && systemData.value) || '');
-				}
-			})
-			.catch((err) => {
-				console.log('err', err);
-			});
-	};
-	/**
-	 * 从缓存中获取数据，初始化数据方法
-	 */
-	const initData = () => {
-		// 从缓存中取系统数据
-		let systemData: Option | undefined = Session.get('CURRENT_SYSTEM');
-
-		// 赋值
-		curSys.value = systemData?.value || '';
-		// 获取所有配置
-		getSystemData();
-	};
-	return {
-		onChange,
-		initData,
-		curSys,
-		systems,
-	};
-}

package/src/components/business/bcTable/bcTable.vue

@@ -1,63 +0,0 @@
-<template>
-	<div ref="wrapRef" class="bc-table__wrapper bg-white">
-		<div class="bc-table__content" :style="style">
-			<vxe-table ref="tableRef" v-bind="baseData" @cell-click="handleCellClick" @header-cell-click="headerCellClick" :data="tableData">
-				<vxe-column v-for="item in tableConfig" :key="item.id" v-bind="item.data">
-					<!-- 自定义插槽 -->
-					<template v-for="(value, name) in $slots" #[name]="scopeData" :key="name">
-						<slot :name="name" v-bind="scopeData || {}"></slot>
-					</template>
-
-					<!-- 列单元格插槽渲染 -->
-					<template v-if="item.data.isSlot" #default="scopeData">
-						<slot :name="item.data.field" v-bind="scopeData || {}"></slot>
-					</template>
-
-					<!-- 按钮渲染 -->
-					<template v-else-if="item.btnData && item.btnData.length" #default="scopeData">
-						<template v-for="btn in item.btnData" :key="btn.key">
-							<slot v-if="btn.isSlot" :name="`hs_btn_${item.data.field}`" v-bind="scopeData || {}"></slot>
-							<bc-btn :data="btn" @click="btn.fnName(scopeData)" v-else />
-						</template>
-					</template>
-				</vxe-column>
-			</vxe-table>
-		</div>
-		<!-- 分页设置 -->
-		<div ref="pagerRef">
-			<vxe-pager v-if="baseData.is_apply_page" v-bind="baseData.table_page_data" @page-change="pageChange">
-				<template v-for="(value, name) in $slots" #[name]="scopeData" :key="name">
-					<slot :name="'hs_pager_' + name" v-bind="scopeData || {}"></slot>
-				</template>
-			</vxe-pager>
-		</div>
-	</div>
-</template>
-<script lang="ts" setup name="bcTable">
-import { onMounted } from 'vue';
-import ICustomData from '/@/types/customData';
-import { useTable } from './useTable';
-import { useTableHeight } from './useTableHeight';
-
-interface Props {
-	uniqueId: string;
-	id: string;
-	baseData: ICustomData.TableBaseData;
-	tableData: ICustomData.Data[];
-	tableConfig: ICustomData.TableItem[];
-}
-
-const props = defineProps<Props>();
-const emit = defineEmits(['ready', 'cell-click', 'header-cell-click', 'page-change']);
-const { wrapRef, pagerRef, tableRef, style } = useTableHeight();
-const { handleCellClick, headerCellClick, pageChange } = useTable(props, tableRef, emit);
-
-onMounted(() => {
-	emit('ready', tableRef.value);
-});
-</script>
-<style scoped lang="scss">
-:deep(.col--seq) {
-	cursor: pointer;
-}
-</style>