hs-admin-ui 1.0.0 → 1.0.2

package/src/components/business/bcFormTable/utils/onTableKey.ts

@@ -1,119 +0,0 @@
-import { onKeyStroke } from '@vueuse/core';
-import ComponentAttr from '/@/types/components';
-import ICustomData from '/@/types/customData';
-import { fetchTableData } from '/@parseTable';
-import BcFormTable from '../bcFormTable.vue';
-import { VxeTableInstance, VxePagerDefines } from 'vxe-table';
-import { Ref, reactive, computed, toValue } from 'vue';
-import _ from 'lodash';
-
-export const tableIndex = reactive({
-	rowIndex: 0,
-	columnIndex: 0,
-});
-export function onTableKey(
-	formRef: Ref<ICustomData.ANY>,
-	tablesRef: Ref<Record<string, VxeTableInstance>>,
-	activeTabs: Ref<string>,
-	props: ComponentAttr.Props<typeof BcFormTable>
-) {
-	const tableRef = computed(() => tablesRef.value[activeTabs.value]);
-	const cursor = ['checkbox', 'expand', 'radio', 'seq'];
-	const menuTable = [
-		{ label: '右键1', value: '111' },
-		{ label: '右键2', value: '222' },
-		{ label: '右键3', value: '333' },
-		{ label: '右键4', value: '444' },
-		{ label: '右键5', value: '555' },
-	];
-
-	function setFocus() {
-		const row = tableRef.value?.getData(tableIndex.rowIndex);
-		// 获取可视列数据
-		const { visibleColumn } = tableRef.value!.getTableColumn();
-		const columnField = visibleColumn[tableIndex.columnIndex].field;
-		tableRef.value?.setCurrentRow(row); // 设置当前行
-		tableRef.value?.setEditRow(row, columnField).then(() => {
-			const { rowIndex, columnIndex } = tableRef.value!.getEditRecord()!;
-			tableIndex.rowIndex = rowIndex ?? 0;
-			tableIndex.columnIndex = columnIndex ?? 0;
-		});
-	}
-
-	// 分页加载
-	async function onPageChange(params: VxePagerDefines.PageChangeEventParams) {
-		const table = props.data!.tables.find((i) => i.id === activeTabs.value)!;
-		const pager = table.baseData.table_page_data;
-		pager!.currentPage = params.currentPage;
-		table.tableData = await fetchTableData(pager!, props.data!.form!.formData);
-	}
-
-	// 键盘右移动
-	onKeyStroke('ArrowRight', (e) => {
-		e.preventDefault();
-		const activeElement = document.activeElement as Element;
-		if (!activeElement.closest('.bc-table__content')) return;
-		const { visibleColumn } = tableRef.value!.getTableColumn();
-		tableIndex.columnIndex++;
-		if (tableIndex.columnIndex > visibleColumn.length - 1) {
-			tableIndex.columnIndex = 0;
-		}
-		if (cursor.includes(visibleColumn[tableIndex.columnIndex]?.type as string)) {
-			const num = visibleColumn.filter((i) => i.type).length;
-			tableIndex.columnIndex = tableIndex.columnIndex + num;
-		}
-		setFocus();
-	});
-
-	// 键盘左移动
-	onKeyStroke('ArrowLeft', (e) => {
-		e.preventDefault();
-		const activeElement = document.activeElement as Element;
-		if (!activeElement.closest('.bc-table__content')) return;
-		const { visibleColumn } = tableRef.value!.getTableColumn();
-		tableIndex.columnIndex--;
-		if (cursor.includes(visibleColumn[tableIndex.columnIndex]?.type as string)) {
-			const num = visibleColumn.filter((i) => i.type).length;
-			tableIndex.columnIndex = tableIndex.columnIndex - num;
-		}
-		if (tableIndex.columnIndex < 0) {
-			tableIndex.columnIndex = visibleColumn.length - 1;
-		}
-		setFocus();
-	});
-
-	// 键盘上移动
-	onKeyStroke('ArrowUp', (e) => {
-		e.preventDefault();
-		const activeElement = document.activeElement as Element;
-		if (!activeElement.closest('.bc-table__content')) return;
-		const tableData = tableRef.value!.getData();
-		tableIndex.rowIndex--;
-		if (tableIndex.rowIndex < 0) {
-			// 1. 表格循环上下切换
-			tableIndex.rowIndex = tableData.length - 1;
-			// 2. 切换表单查询
-			// tableIndex.rowIndex = 0
-			// _.get(toValue(formRef), 'componentRef.0')?.focus();
-		}
-		setFocus();
-	});
-
-	// 键盘下移动
-	onKeyStroke('ArrowDown', (e) => {
-		e.preventDefault();
-		const activeElement = document.activeElement as Element;
-		if (!activeElement.closest('.bc-table__content')) return;
-		const tableData = tableRef.value!.getData();
-		tableIndex.rowIndex++;
-		if (tableIndex.rowIndex > tableData.length - 1) {
-			tableIndex.rowIndex = 0;
-		}
-		setFocus();
-	});
-
-	return {
-		menuTable,
-		onPageChange,
-	};
-}

package/src/components/business/bcFormTable/utils/parseTable.ts

@@ -1,201 +0,0 @@
-import _ from 'lodash';
-import { Ref, ComputedRef } from 'vue';
-import { VxeTableInstance, VxePagerProps } from 'vxe-table';
-import { Component } from '/@/components/component';
-import IFormTable from '/@/types/formTable';
-import IFormData from '/@/types/form';
-import ICustomData from '/@/types/customData';
-import { formStore } from '/@/utils/storage';
-import { getFormDataType } from '/@/utils/getDataType';
-import { getTableDataType } from '/@/utils/getDataType';
-import CustomeMethods from '../methods';
-
-/** 对外导出表格参数实例 */
-export interface TableParams {
-	tableApi: Ref<Record<string, VxeTableInstance>>;
-	activeTabs: Ref<string>;
-	api: ComputedRef<VxeTableInstance>;
-}
-
-/** 递归遍历属性，设置更新值 */
-export function setPropertyData<T extends IFormTable.Data>(params: T) {
-	const method = /method=/;
-	const string = /string=/;
-
-	function setProperty(property: T) {
-		for (let i in property) {
-			// 1.解析自定义方法
-			if (method.test(property[`${i}_2`])) {
-				property[i] = CustomeMethods[property[`${i}_2`].split('=')[1]];
-			} else if (method.test(property[i]) && property[i].split('=')[1]) {
-				(property as ICustomData.ANY)[`${i}_2`] = property[i];
-				property[i] = CustomeMethods[property[i].split('=')[1]];
-			}
-			// 2.解析自定义数据
-			if (string.test(property[i])) {
-				if (property[i].split('=')[1]) {
-					property[i] = new Function('return ' + property[i].split('=')[1])();
-				} else {
-					(property as ICustomData.ANY)[i] = [];
-				}
-			}
-			if (_.isObject(property[i]) && !_.isEmpty(property[i])) {
-				setProperty(property[i]);
-			}
-		}
-	}
-	setProperty(params);
-
-	return params;
-}
-
-/** 根据权限获取是否显示 */
-function getAuth(config: ICustomData.FormItemConfigData['baseData']) {
-	if (!config.isShow) return false;
-	return true;
-}
-
-export function getRender(el: Component) {
-	// 解析下拉框
-	if (el === 'hs-select') return 'bc-select';
-	// 解析下拉树组件
-	if (el === 'hs-tree-select') return 'bc-tree-select';
-	return el;
-}
-
-/** 格式化搜索区域表单数据 */
-export async function getSearchForm<T = ICustomData.Form>(data: ICustomData.FormTable): Promise<T> {
-	if (!data.form) return Promise.resolve({} as T);
-	// 获取缓存类配置项信息
-	const { form } = await formStore.get<ICustomData.FormTable>(data.config_unique_id);
-	const formConfig = form?.formConfig.filter((i) => {
-		const isShow = getAuth(i.data.baseData);
-		if (isShow) {
-			// 解构属性数据
-			const elData = setPropertyData(i.data.elData);
-			i.data.elData = {
-				...elData.attrs,
-				..._.omit(elData, 'attrs'),
-			};
-
-			i.data.baseData.el = getRender(i.data.baseData.el);
-		}
-
-		return isShow;
-	});
-
-	const baseData = _.omit(setPropertyData(data.form.baseData), ['inline', 'gutter', 'justify', 'align']);
-
-	return {
-		baseData,
-		formConfig,
-		formData: data.form.formData,
-	} as T;
-}
-
-export function getTableDatas<T = ICustomData.Table[]>(params: ICustomData.FormTable) {
-	const tables = params.tables.map((i) => getTableCache(i, params));
-	return Promise.all(tables) as Promise<T>;
-}
-
-/** 获取表格缓存本地列配置信息 */
-async function getTableCache(data: ICustomData.Table, config: ICustomData.FormTable) {
-	const result = await formStore.get<ICustomData.FormTable>(config.config_unique_id);
-	const cache = result?.tables?.find((i) => i.id === data.id);
-	if (!cache) {
-		return [];
-	}
-
-	const table = await getTableData(cache, config.form!.formData);
-	return table;
-}
-
-/** 格式化表数据 */
-export async function getTableData(data: ICustomData.Table, formData: ICustomData.Form['formData']) {
-	const params = _.cloneDeep(data) as ICustomData.Table;
-	params.baseData = setPropertyData(_.omit(params.baseData, 'data'));
-	params.tableConfig = params.tableConfig.filter((i) => {
-		const isShow = getAuth(i.data as ICustomData.ANY);
-
-		if (isShow) {
-			i.data = setPropertyData(i.data);
-			i.btnData = i.btnData?.map((i) => setPropertyData(i)) || [];
-		}
-
-		return isShow;
-	});
-	const tableData = await fetchTableData(params.baseData.table_page_data!, formData);
-
-	return {
-		id: params.id,
-		baseData: params.baseData,
-		tableConfig: params.tableConfig,
-		tableData,
-	};
-}
-
-/** 调用接口获取表格数据 */
-export async function fetchTableData(pager: VxePagerProps, formData: ICustomData.Form['formData']) {
-	pager.pagerCount = 2;
-	pager.total = 18;
-	const item = (i: number) => {
-		return {
-			order_no: i,
-			order_type: i,
-			pay_state: i,
-			commodity_no: i,
-			common_name: i,
-			btns: i,
-		};
-	};
-	if (pager.currentPage === 2) {
-		return Array.from({ length: 8 }, (_, i) => item(i));
-	}
-	return Array.from({ length: 10 }, (_, i) => item(i));
-}
-
-/** 接口数据
- * 1. 获取配置项目
- * 2. 加载权限数据
- * 3. 整合配置数据信息
- * 4. 根据配置项获取数据
- */
-export async function getLoadData(data: ICustomData.FormTable) {
-	const config = _.cloneDeep(data) as ICustomData.FormTable;
-	// 1.更新原始缓存
-	await formStore.set(`${config.config_unique_id}_origin`, config);
-	// 2.获取当前缓存
-	const cache = await formStore.get<ICustomData.FormTable>(config.config_unique_id);
-	if (!cache) {
-		await formStore.set(config.config_unique_id, config);
-	}
-	const form = await getSearchForm(config);
-	const tables = await getTableDatas(config);
-
-	if (__IS_DEV__) {
-		getTableDataType(tables);
-	}
-
-	return {
-		...config,
-		form,
-		tables,
-	} as ICustomData.FormTable;
-}
-
-export function getFormData(data: IFormData.Form) {
-	const result = _.cloneDeep(data) as IFormData.Form;
-	const form = result.form.map((i) => {
-		i.config = setPropertyData(i.config);
-		return i;
-	});
-
-	if (__IS_DEV__) {
-		console.debug(getFormDataType(result));
-	}
-
-	return {
-		...result,
-		form,
-	};
-}

package/src/components/business/bcFormTable/utils/useButon.ts

@@ -1,20 +0,0 @@
-import ICustomData from '/@/types/customData';
-import ComponentAttr from '/@/types/components';
-import { Ref, ComputedRef, computed } from 'vue';
-import { VxeTableInstance } from 'vxe-table';
-import BcFormTable from '../bcFormTable.vue';
-
-export function useButon(
-	formRef: Ref<ICustomData.ANY>,
-	tablesRef: Ref<Record<string, VxeTableInstance>>,
-	activeTabs: Ref<string>,
-	props: ComponentAttr.Props<typeof BcFormTable>
-) {
-	const btns: ComputedRef<ICustomData.Btns[]> = computed(() => {
-		return props.data?.btns || [];
-	});
-
-	return {
-		btns,
-	};
-}

package/src/components/business/bcFormTable/utils/useTableHeight.ts

@@ -1,44 +0,0 @@
-import { computed, ref, nextTick } from 'vue';
-import { VxeTableInstance } from 'vxe-table';
-import { useElementSize } from '@vueuse/core';
-
-export function useTableHeight() {
-	const isOverHide = ref(false); // 解决切换查询条件时，出现滚动条造成弹屏问题
-	const wrapRef = ref<HTMLElement>();
-	const btnRef = ref<HTMLElement>();
-	const formRef = ref<HTMLElement>();
-	const tableApi = ref<Record<string, VxeTableInstance>>({});
-
-	const { height: wrapHeight } = useElementSize(wrapRef);
-	const { height: btnHeight } = useElementSize(btnRef, { height: 0, width: 0 });
-	const { height: formHeight } = useElementSize(formRef, { height: 0, width: 0 });
-
-	const style = computed(() => {
-		const height = wrapHeight.value > 0 ? `${wrapHeight.value - btnHeight.value - formHeight.value}px` : '0px';
-		return {
-			height,
-		};
-	});
-
-	function onReady(api: VxeTableInstance, id: string) {
-		tableApi.value[id] = api;
-	}
-
-	function onHeightChange() {
-		isOverHide.value = true;
-		nextTick(() => {
-			isOverHide.value = false;
-		});
-	}
-
-	return {
-		wrapRef,
-		btnRef,
-		formRef,
-		tableApi,
-		style,
-		isOverHide,
-		onReady,
-		onHeightChange,
-	};
-}

package/src/components/business/bcPageConfig/bcPageConfig.vue

@@ -1,79 +0,0 @@
-<template>
-	<div class="flex flex-col h-full">
-		<div class="flex-1 system-user-container" style="height: 300px">
-			<hs-tabs ref="tabsRef" v-model="tabsActiveName" class="h-full tabs" type="border-card" addable @edit="handleTabsEdit">
-				<hs-tab-pane class="tab-pane" label="按钮配置" name="btn">
-					<component :is="hsBtnPanel" v-model="panelConfig.btns" />
-				</hs-tab-pane>
-				<hs-tab-pane class="tab-pane" label="查询条件配置" name="form">
-					<component :is="hsFormPanel" v-model="panelConfig" />
-				</hs-tab-pane>
-				<hs-tab-pane
-					v-for="(item, index) in panelConfig.tables"
-					:key="index"
-					class="tab-pane"
-					:label="item.baseData['tableName'] || '表格配置名称'"
-					:name="item.id"
-					closable
-				>
-					<component :is="hsTablePanels" closable v-model="panelConfig.tables[index]" />
-				</hs-tab-pane>
-			</hs-tabs>
-		</div>
-		<component :configs="configs" ref="saveFormRef" :is="saveForm" @change="changeConfig" @save="saveFormTableConfig"></component>
-	</div>
-</template>
-
-<script setup lang="ts">
-import { ref } from 'vue';
-import hsFormPanel from './components/hsForm/src/hsFormPanel.vue';
-// import hsTablePanel from './components/hsTable/src/hsTablePanel.vue';
-import IFormTable from '/@/types/formTable';
-import hsTablePanels from './components/hsTables/src/hsTablePanel.vue';
-import hsBtnPanel from './components/hsBtn/src/hsBtnPanel.vue';
-import saveForm from './components/hsSaveForm/src/saveForm.vue';
-import { useHsPageConfig } from './usePageConfig'; //'./usePageConfig';
-
-let panelConfig = ref<IFormTable.FormTable>({
-	id: '', // 配置id
-	config_type: '1', // 配置类型
-	config_unique_id: '', // 配置唯一标识
-	config_name: '', // 配置名称
-	btns: [], // 按钮配置
-	tables: [
-		{
-			id: 'table_' + new Date().getTime().toString(),
-			baseData: { id: '', tableName: '表格配置名称' },
-			tableConfig: [],
-		},
-	],
-});
-// 页面所在的所有配置
-let configs = ref<Array<IFormTable.FormTable>>([]);
-let saveFormRef = ref();
-const emits = defineEmits(['refresh']);
-
-// 将方法暴露
-const { handleTabsEdit, saveFormTableConfig, changeConfig, initData, tabsActiveName } = useHsPageConfig(panelConfig, configs, saveFormRef, emits);
-defineExpose({ initData });
-</script>
-
-<style scoped lang="scss">
-.system-user-container {
-	:deep(.el-card__body) {
-		height: 100% !important;
-	}
-
-	:deep(.el-tabs__content) {
-		height: calc(100% - 39px);
-	}
-}
-.tabs {
-	:deep(.el-tabs__new-tab) {
-		margin: 10px 10px 10px 0px;
-	}
-}
-.tab-pane {
-	height: 100% !important;
-}
-</style>

package/src/components/business/bcPageConfig/components/hsBtn/src/hsAttrBtn.vue

@@ -1,39 +0,0 @@
-<template>
-	<div class="bg-blue-200 h-full flex flex-col">
-		<div style="height: calc(100% -50px)" class="overflow-y-auto flex-1">
-			<component :is="hsExpand" v-model="visible" :expandConfig="{ subTitle: '按钮项代码' }"></component>
-			<div v-if="visible">
-				{{ btnItemConfig }}
-			</div>
-			<component :is="hsExpand" v-model="btnConfig.visible" :expandConfig="btnConfig.title"></component>
-			<component :is="hsBtnItemConfig" v-show="btnConfig.visible" ref="btnItemRef" v-model="btnItemConfig.data" :config="btnConfig"></component>
-		</div>
-
-		<div class="text-center grow-0" style="height: 50rpx">
-			<hs-button @click="saveData" type="primary">保存</hs-button>
-		</div>
-	</div>
-</template>
-
-<script setup lang="ts">
-import { ref } from 'vue';
-import hsExpand from '../../hsExpand/src/hsExpand.vue';
-import hsBtnItemConfig from './hsBtnItemConfig.vue';
-import { useHsAttrBtn } from './../useAttrBtn';
-import IFormTable from '/@/types/formTable';
-const props = defineProps({
-	current: {
-		type: Object,
-		default: () => {},
-	},
-	btnList: {
-		type: Array<IFormTable.BtnItem>,
-		default: () => [],
-	},
-});
-const btnItemRef = ref();
-const { visible, btnItemConfig, btnConfig, saveData } = useHsAttrBtn(props, btnItemRef);
-</script>
-
-<style lang="scss" scoped></style>
-<!--  -->

package/src/components/business/bcPageConfig/components/hsBtn/src/hsBtnConfigList.vue

@@ -1,45 +0,0 @@
-<!-- 
-  desc: 表单配置项集合
-  author: lvling
- -->
-<template>
-	<div>
-		<div class="flex flex-wrap">
-			<div class="p-2 relative" v-for="(item, index) in btnsModel" :key="index" @click="choseTagItem(item)">
-				<div class="border border-solid border-zinc-300 hover:bg-blue-200 p-2 rounded" :class="current['id'] == item['id'] ? 'bg-blue-200' : ''">
-					{{ item['data'] && item['data']['name'] }}
-				</div>
-				<div
-					v-if="current['id'] == item['id']"
-					@click.stop.prevent="deleteTagItem(item)"
-					style="position: absolute; top: 0px; right: 5px; cursor: pointer"
-				>
-					✖️
-				</div>
-			</div>
-			<div class="p-2">
-				<div @click="appendField" class="p-2 bg-pink-200 w-10 h-10 flex justify-center align-center rounded-full">+</div>
-			</div>
-		</div>
-	</div>
-</template>
-
-<script setup lang="ts">
-import { PropType, defineModel } from 'vue';
-import { useHsBtnListConfig } from './../useBtnConfigList';
-import IFormTable from '/@/types/formTable';
-
-const emit = defineEmits(['chose']);
-
-const btnsModel = defineModel<Array<IFormTable.BtnItem>>([]);
-const props = defineProps({
-	current: {
-		type: Object as PropType<Record<'id', string>>,
-		default: () => {},
-	},
-});
-
-const { appendField, deleteTagItem, choseTagItem } = useHsBtnListConfig(emit, props, btnsModel);
-</script>
-
-<style lang="scss" scoped></style>

package/src/components/business/bcPageConfig/components/hsBtn/src/hsBtnItemConfig.vue

@@ -1,32 +0,0 @@
-<template>
-	<component ref="baseConfigRef" :parentConfig="parentConfig" :is="'bc-form-config'" :data="data" :config="config.list" :rules="config.rules">
-		<template #name>
-			<bc-auto-complete type="btn" v-model="data.name" @change="onChangeItem"></bc-auto-complete>
-		</template>
-		<template #btnIcon>
-			<IconSelector placeholder="请选择图标" clearable :isShowPrepend="false" v-model="data.btnIcon" title="" />
-		</template>
-	</component>
-</template>
-
-<script setup lang="ts">
-import { ref } from 'vue';
-import IconSelector from '/@/components/iconSelector/index.vue';
-import { useHsBtnItemConfig } from './../useBtnItemConfig';
-// const props =
-defineProps({
-	config: {
-		type: Object,
-		default: () => {},
-	},
-});
-
-const data: Record<string, any> = defineModel();
-const baseConfigRef = ref();
-
-const { parentConfig, onChangeItem, getSubmitData } = useHsBtnItemConfig(data, baseConfigRef);
-
-defineExpose({ getSubmitData });
-</script>
-
-<style lang="scss" scoped></style>

package/src/components/business/bcPageConfig/components/hsBtn/src/hsBtnPanel.vue

@@ -1,45 +0,0 @@
-<!-- 
-	desc: 配置按钮面板
-	author: 吕玲
- -->
-<template>
-	<div class="mx-auto flex flex-row h-full">
-		<div class="flex-1 grow overflow-y-auto">
-			<!-- 按钮配置 -->
-			<hsExpand v-model="btnTitleConfig.visible" :expandConfig="btnTitleConfig"></hsExpand>
-			<component v-if="btnTitleConfig.visible" :is="hsBtnConfigList" v-model="btnsConfig" :current="currentItem" @chose="onChoseItem"></component>
-		</div>
-		<div v-if="(btnsConfig || []).length > 0 && !!currentItem.id" class="flex-none basis-1/4 ml-4">
-			<component :is="hsAttrBtn" :btnList="btnsConfig" :current="currentItem"></component>
-		</div>
-	</div>
-</template>
-<script setup lang="ts" name="formPanel">
-import { defineModel, ref } from 'vue';
-import hsBtnConfigList from './hsBtnConfigList.vue';
-import hsAttrBtn from './hsAttrBtn.vue';
-import hsExpand from '../../hsExpand/src/hsExpand.vue';
-import IFormTable from '/@/types/formTable';
-import { emptyBtnItemData } from './../../../default/baseBtnConfig';
-
-import _ from 'lodash';
-
-const btnsConfig = defineModel<Array<IFormTable.BtnItem>>();
-const btnTitleConfig = ref({
-	visible: true,
-	subTitle: '按钮配置',
-	class: 'font-bold my-3',
-	iconSize: 20,
-});
-// 当前选中项配置
-let currentItem = ref(_.cloneDeep(emptyBtnItemData));
-
-/**
- * 选择某配置回调
- */
-const onChoseItem = (item: IFormTable.BtnItem) => {
-	currentItem.value = item;
-};
-</script>
-
-<style lang="scss" scoped></style>

package/src/components/business/bcPageConfig/components/hsBtn/useAttrBtn.ts

@@ -1,58 +0,0 @@
-import { ref, Ref, watch } from 'vue';
-import ComponentAttr from '/@/types/components';
-import hsAttrBtn from './src/hsAttrBtn.vue';
-import IFormTable from '/@/types/formTable';
-import { config } from '../../default/baseBtnConfig';
-import { ElMessage } from 'element-plus';
-import _ from 'lodash';
-interface BtnRef {
-	getSubmitData: () => boolean;
-}
-export function useHsAttrBtn(props: ComponentAttr.Props<typeof hsAttrBtn>, btnItemRef: Ref<BtnRef>) {
-	// 原始数据
-	let oldItem = ref(props.current);
-	// 当前项绑定数据
-	let btnItemConfig = ref(_.cloneDeep(props.current));
-	/**
-	 * 监听当前项
-	 */
-	watch(
-		() => props.current,
-		(value) => {
-			// 解决切换不同表单项不及时更新数据问题
-			if (value.id != btnItemConfig.value.id) {
-				console.log('value', value);
-				// value.elConfig.visible = false;
-				oldItem.value = value;
-				btnItemConfig.value = _.cloneDeep(value);
-				// formData.value = props.data;
-			}
-		},
-		{ deep: true }
-	);
-	const btnConfig = ref(_.cloneDeep(config));
-	// 控制表单项属性的展开关闭
-	const visible = ref(false);
-	// 基本配置属性实例
-	/**
-	 * 保存功能
-	 */
-	const saveData = async function () {
-		try {
-			// 校验表单项属性
-			let flag = await btnItemRef.value.getSubmitData();
-			if (!flag) return;
-			// 增加按钮重复校验
-			let keys = _.map(props.btnList, (item: Record<string, IFormTable.Data>) => item.data.key);
-			if (_.includes(keys, btnItemConfig.value.data.key)) {
-				return ElMessage.warning('按钮key值重复');
-			}
-			// 保存表单配置
-			oldItem.value = Object.assign(oldItem.value, _.cloneDeep(btnItemConfig.value));
-		} catch (err) {
-			console.log('er', err);
-		}
-	};
-
-	return { visible, btnItemConfig, btnConfig, saveData };
-}