hs-admin-ui 1.0.0 → 1.0.2

package/src/components/business/bcPageConfig/default/baseBtnConfig.ts

@@ -1,256 +0,0 @@
-// 按钮配置数据
-const data = {
-	name: '按钮名称',
-	key: '',
-	isApply: true, // 是否启用
-	isSlot: false, // 是否使用插槽
-	isShow: false, // 是否显示
-	// color: '', // 自定义颜色
-	// textColor: '', // 文本颜色
-	size: 'small', // 尺寸
-	btnIcon: '', // 按钮图标
-	type: 'primary', // 类型
-	plain: false, // 是否为朴素按钮
-	text: false, // 是否为文本按钮
-	bg: false, // 是否显示文字按钮背景颜色
-	link: false, // 是否为链接
-	round: false, // 是否为圆角按钮
-	circle: false, // 是否为圆形按钮
-	loading: false, // 是否为加载中状态
-	'loading-icon': 'Loading', // 自定义加载中状态图标组件
-	disabled: false, // 按钮是否为禁用状态
-	// icon: '', // 图标组件
-	autofocus: false, // 原生 autofocus 属性
-	'native-type': 'button',
-	// 'auto-insert-space':
-	// 'color':''
-	dark: false, // dark 模式
-	tag: 'button', //自定义元素标签
-};
-// 按钮配置表单校验
-const btnBaseRule = {
-	name: [{ required: true, message: '请输入按钮名称' }],
-	key: [{ required: true, message: '请输入按钮key值' }],
-};
-// 按钮数据配置
-const config = {
-	title: {
-		subTitle: '按钮配置',
-	},
-	visible: true,
-	list: [
-		{
-			prop: 'name',
-			label: '按钮名称',
-			el: 'hs-input',
-			slotValue: 'name',
-			tooltips: '按钮名称',
-		},
-		{
-			prop: 'key',
-			label: '按钮key值',
-			el: 'hs-input',
-			tooltips: '按钮key值',
-		},
-		{
-			prop: 'isApply',
-			label: '是否启用',
-			el: 'hs-switch',
-			tooltips: '是否启用',
-		},
-		{
-			prop: 'isSlot',
-			label: '插槽名称',
-			el: 'hs-switch',
-			tooltips: '是否自定义插槽， 如果用插槽则赋值，不用插槽则清空',
-		},
-		{
-			prop: 'isShow',
-			label: '是否显示',
-			el: 'hs-switch',
-			tooltips: '是否显示',
-		},
-		{
-			prop: 'color',
-			label: '自定义颜色',
-			el: 'hs-color-picker',
-			// slotValue: 'color',
-		},
-		{
-			prop: 'textColor',
-			label: '按钮文本色',
-			el: 'hs-color-picker',
-			// slotValue: 'textColor',
-		},
-		{
-			prop: 'btnIcon',
-			label: '按钮图标',
-			el: 'hs-input',
-			slotValue: 'btnIcon',
-		},
-		{
-			prop: 'iconPosition',
-			label: '图标位置',
-			el: 'hs-select',
-			cel: 'hs-option',
-			op: [
-				{ label: '左边', value: 'left' },
-				{ label: '右边', value: 'right' },
-			],
-		},
-		{
-			prop: 'fnName',
-			label: '方法名称',
-			el: 'hs-input',
-			type: 'textarea',
-		},
-		{
-			prop: 'size',
-			label: '尺寸',
-			el: 'hs-select',
-			cel: 'hs-option',
-			op: [
-				{ label: '大', value: 'large' },
-				{ label: '默认', value: 'default' },
-				{ label: '小', value: 'small' },
-			],
-			// tooltips: '',
-		},
-		{
-			prop: 'type',
-			label: '类型',
-			el: 'hs-select',
-			cel: 'hs-option',
-			op: [
-				{ label: 'primary', value: 'primary' },
-				{ label: 'success', value: 'success' },
-				{ label: 'warning', value: 'warning' },
-				{ label: 'danger', value: 'danger' },
-				{ label: 'info', value: 'info' },
-			],
-		},
-		{
-			prop: 'plain',
-			label: '朴素按钮',
-			el: 'hs-switch',
-			tooltips: '是否为朴素按钮',
-		},
-		{
-			prop: 'text',
-			label: '文字按钮',
-			el: 'hs-switch',
-			tooltips: '是否为文字按钮',
-		},
-		{
-			prop: 'bg',
-			label: '文字按钮背景颜色',
-			el: 'hs-switch',
-			tooltips: '是否显示文字按钮背景颜色',
-		},
-		{
-			prop: 'link',
-			label: '链接按钮',
-			el: 'hs-switch',
-			tooltips: '是否为链接按钮',
-		},
-		{
-			prop: 'round',
-			label: '圆角按钮',
-			el: 'hs-switch',
-			tooltips: '是否为圆角按钮',
-		},
-		{
-			prop: 'circle',
-			label: '圆形按钮',
-			el: 'hs-switch',
-			tooltips: '是否为圆形按钮',
-		},
-		{
-			prop: 'loading',
-			label: '加载状态',
-			el: 'hs-switch',
-			tooltips: '是否为加载中状态',
-		},
-		{
-			prop: 'loading-icon',
-			label: '加载状态图标',
-			el: 'hs-input',
-			tooltips: '自定义加载中状态图标组件',
-		},
-		{
-			prop: 'disabled',
-			label: '是否禁用',
-			el: 'hs-switch',
-			tooltips: '按钮是否为禁用状态',
-		},
-		{
-			prop: 'icon',
-			label: '图标组件',
-			el: 'hs-input',
-			tooltips: '图标组件',
-		},
-		{
-			prop: 'autofocus',
-			label: '自动聚焦',
-			el: 'hs-switch',
-			tooltips: '原生 autofocus 属性',
-		},
-		{
-			prop: 'native-type',
-			label: '原生 type 属性',
-			el: 'hs-select',
-			cel: 'hs-option',
-			op: [
-				{ label: '按钮', value: 'button' },
-				{ label: '提交', value: 'submit' },
-				{ label: '重置', value: 'reset' },
-			],
-			tooltips: '原生 type 属性',
-		},
-		{
-			prop: 'auto-insert-space',
-			label: '中文字符之间插入空格',
-			el: 'hs-switch',
-			tooltips: '自动在两个中文字符之间插入空格',
-		},
-		{
-			prop: 'color',
-			label: '按钮颜色',
-			el: 'hs-input',
-			tooltips: '自定义按钮颜色, 并自动计算 hover 和 active 触发后的颜色',
-		},
-		{
-			prop: 'dark',
-			label: 'dark 模式',
-			el: 'hs-switch',
-			tooltips: 'dark 模式, 意味着自动设置 color 为 dark 模式的颜色',
-		},
-		{
-			prop: 'tag',
-			label: '自定义元素标签',
-			el: 'hs-input',
-			tooltips: '自定义元素标签',
-		},
-	],
-	rules: btnBaseRule, // btnBaseRule,
-};
-// 默认按钮配置
-const btnItemConfig = {
-	id: '',
-	data: data,
-	// config: config,
-};
-// 空配置
-const emptyBtnItemData = {
-	id: '',
-	data: {},
-	config: {
-		title: {
-			subTitle: '按钮配置',
-		},
-		visible: false,
-		list: [],
-	},
-};
-
-export { btnItemConfig, emptyBtnItemData, btnBaseRule, data, config };

package/src/components/business/bcPageConfig/default/baseFormConfig.ts

@@ -1,380 +0,0 @@
-import { ref } from 'vue';
-import IFormTable from '/@/types/formTable';
-import ComponentAttr from '/@/types/components';
-import { inputAttrConfigMap } from '/@/components/config/inputAttrConfig/config';
-
-// 表单配置数据
-let parentFormData: IFormTable.FormBaseConfig = {
-	size: 'default',
-	rules: '', //  表单校验规则
-	inline: true, // 行内表单模式
-	labelPosition: 'left', // 表单域标签的位置
-	labelWidth: '80', // 表单域标签的宽度
-	labelSuffix: '', // 表单域标签的后缀
-	hideRequiredAsterisk: false, // 是否隐藏必填标识
-	requireAsteriskPosition: 'left', // 必填标识的位置
-	showMessage: true, // 是否显示校验错误信息
-	inlineMessage: false, // 是否以行内展示校验信息
-	statusIcon: false, // 是否框中显示校验反馈图标
-	validateOnRuleChange: true, // 是否触发第一次验证
-	disabled: false, // 是否禁用该表单项
-	scrollToError: false, // 滚动至首个校验失败的表单
-	gutter: 10, // 栅格间隔
-	justify: 'start', // flex 布局下的水平排列方式
-	align: '', // flex 布局下的垂直排列方式
-	isSetDictDefaultValue: true, // 是否取字典项的默认值
-	isSupportShortcutKey: true, // 是否支持表单回车快捷功能
-	submitUrl: '1', // 提交表单的请求api
-	submitSuccessMsg: '1', // 表单提交成功的提示信息
-};
-// 表单配置结构
-let parentFormConfig: Array<ComponentAttr.RecursivePartial<IFormTable.FormItem>> = [
-	{ prop: 'rules', label: '表单验证规则', type: 'textarea', el: 'hs-input' },
-	{ prop: 'inline', label: '行内表单模式', el: 'hs-switch' },
-	{
-		prop: 'labelPosition',
-		label: '表单域标签的位置',
-		el: 'hs-select',
-		tooltip: '表单域标签的位置， 当设置为 left 或 right 时，则也需要设置 label-width 属性',
-		required: false,
-		multiple: false,
-		op: [
-			{ label: ' 靠左', value: 'left' },
-			{ label: '靠右', value: 'right' },
-			{ label: '靠上', value: 'top' },
-		],
-		cel: 'hs-option',
-	},
-	{
-		prop: 'labelWidth',
-		label: '标签的宽度',
-		tooltip: '标签的长度，例如 "50px"。 作为 Form 直接子元素的 form-item 会继承该值。 可以使用 auto。',
-		el: 'hs-input',
-	},
-	{
-		prop: 'labelSuffix',
-		label: '表单域标签的后缀',
-		tooltip: '表单域标签的后缀',
-		el: 'hs-input',
-	},
-	{
-		prop: 'hideRequiredAsterisk',
-		label: '是否隐藏必填标识',
-		tooltip: '是否隐藏必填字段标签旁边的红色星号。',
-		el: 'hs-switch',
-	},
-	{
-		prop: 'requireAsteriskPosition',
-		label: '必填标识的位置',
-		tooltip: '星号的位置。',
-		el: 'hs-select',
-		op: [
-			{ label: ' 靠左', value: 'left' },
-			{ label: '靠右', value: 'right' },
-		],
-		cel: 'hs-option',
-	},
-	{
-		prop: 'showMessage',
-		label: '是否显示校验错误信息',
-		tooltip: '是否显示校验错误信息',
-		el: 'hs-switch',
-	},
-	{
-		prop: 'inlineMessage',
-		label: '是否以行内形式展示校验信息',
-		tooltip: '是否以行内形式展示校验信息',
-		el: 'hs-switch',
-	},
-	{
-		prop: 'statusIcon',
-		label: '是否框中显示校验反馈图标',
-		tooltip: '是否在输入框中显示校验结果反馈图标',
-		el: 'hs-switch',
-	},
-	{
-		prop: 'validateOnRuleChange',
-		label: '是否触发第一次验证',
-		tooltip: '是否在 rules 属性改变后立即触发一次验证',
-		el: 'hs-switch',
-	},
-	{
-		prop: 'size',
-		label: '表单项组件的尺寸',
-		el: 'hs-select',
-		tooltip: '用于控制该表单内组件的尺寸',
-		op: [
-			{ label: ' 大尺寸', value: 'large' },
-			{ label: '默认尺寸', value: 'default' },
-			{ label: '小尺寸', value: 'small' },
-		],
-		cel: 'hs-option',
-	},
-	{
-		prop: 'disabled',
-		label: '是否禁用表单项',
-		tooltip: '是否禁用该表单内的所有组件。 如果设置为 true, 它将覆盖内部组件的 disabled 属性',
-		el: 'hs-switch',
-	},
-	{
-		prop: 'scrollToError',
-		label: '滚动至首个校验失败的表单',
-		tooltip: '当校验失败时，滚动到第一个错误表单项',
-		el: 'hs-switch',
-	},
-	{
-		label: '是否取字典项的默认值',
-		prop: 'isSetDictDefaultValue',
-		el: 'hs-switch',
-		tooltip: '当校验有失败结果时，滚动到第一个失败的表单项目 可通过 scrollIntoView 配置',
-	},
-	{
-		label: '是否支持表单回车快捷功能',
-		prop: 'isSupportShortcutKey',
-		el: 'hs-switch',
-	},
-	{
-		label: '栅格间隔',
-		prop: 'gutter',
-		type: 'number',
-		el: 'hs-input',
-	},
-	{
-		label: '盒子布局下的水平排列方式',
-		prop: 'justify',
-		el: 'hs-select',
-		tooltip: 'flex 布局下的水平排列方式',
-		op: [
-			{ label: '从起始方向排列', value: 'start' },
-			{ label: '从末尾方向排列', value: 'end' },
-			{ label: '居中', value: 'center' },
-			{ label: '两端对齐均匀分布', value: 'space-between' },
-			{ label: '两端是中间间隔的一半均匀分布', value: 'space-around' },
-			{ label: '间隔相等均匀分布', value: 'space-evenly' },
-		],
-		cel: 'hs-option',
-	},
-	{
-		label: '盒子布局下的垂直排列方式',
-		prop: 'align',
-		el: 'hs-select',
-		tooltip: 'flex 布局下的垂直排列方式',
-		op: [
-			{ label: '自上而下', value: 'top' },
-			{ label: '居中', value: 'middle' },
-			{ label: '自下而上', value: 'bottom' },
-		],
-		cel: 'hs-option',
-	},
-	{
-		label: '自定义元素标签',
-		prop: 'tag',
-		el: 'hs-input',
-	},
-	{
-		label: '提交表单的请求api',
-		prop: 'submitUrl',
-		el: 'hs-input',
-	},
-	{
-		label: '表单提交成功的提示信息',
-		prop: 'submitSuccessMsg',
-		el: 'hs-input',
-	},
-];
-// 组件选择配置
-const configElList = ref([
-	{ label: '输入框', value: 'hs-input' },
-	{ label: '选择器', value: 'hs-select' },
-	{ label: '开关', value: 'hs-switch' },
-	{ label: '日期选择器', value: 'hs-date-picker' },
-	{ label: '按钮', value: 'hs-button' },
-	{ label: '自动补全', value: 'hs-autocomplete' },
-	{ label: '上传', value: 'hs-upload' },
-	{ label: '多选框', value: 'hs-checkbox' },
-	{ label: '单选框', value: 'hs-radio' },
-	{ label: '数字输入框', value: 'hs-input-number' },
-	{ label: '级联选择器', value: 'hs-cascader-panel' },
-	{ label: '树形选择', value: 'hs-tree-select' },
-]);
-
-// 组件字典类型
-interface CompConfigType {
-	/** 输入框 */
-	'hs-input': string;
-	/** 选择器 */
-	'hs-select': string;
-	/** 开关 */
-	'hs-switch': string;
-	/** 日期选择器 */
-	'hs-date-picker': string;
-	/** 按钮 */
-	'hs-button': string;
-	/** 自动补全 */
-	'hs-autocomplete': string;
-	/** 上传 */
-	'hs-upload': string;
-	/** 多选框 */
-	'hs-checkbox': string;
-	/** 单选框 */
-	'hs-radio': string;
-	/** 数字输入框 */
-	'hs-input-number': string;
-	/** 级联选择器 */
-	'hs-cascader-panel': string;
-	/** 树形选择 */
-	'hs-tree-select': string;
-}
-// 组件字典
-const compConfig: CompConfigType = {
-	'hs-input': 'hs-config-input',
-	'hs-select': 'hs-config-select',
-	'hs-switch': 'hs-config-switch',
-	'hs-date-picker': 'hs-config-date-picker',
-	'hs-button': 'hs-config-button',
-	'hs-autocomplete': 'hs-config-autocomplete',
-	'hs-upload': 'hs-config-upload',
-	'hs-checkbox': 'hs-config-checkbox',
-	'hs-radio': 'hs-config-radio',
-	'hs-input-number': 'hs-config-input-number',
-	'hs-cascader-panel': 'hs-config-cascader-panel',
-	'hs-tree-select': 'hs-config-tree-select',
-};
-// 表单项属性校验规则
-const formBaseRule: IFormTable.Data = {
-	label: [{ required: true, message: '请输入参数名称' }],
-	prop: [{ required: true, message: '请输入查询参数' }],
-	el: [{ required: true, message: '请选择组件类型' }],
-};
-// 表单项默认配置数据
-let formItemConfig = ref<ComponentAttr.RecursivePartial<IFormTable.ConfigItemType>>({
-	id: '',
-	// 配置绑定的值
-	data: {
-		baseData: {
-			label: '参数名称',
-			prop: '',
-			el: 'hs-input',
-			isSlot: false,
-			isApply: true,
-			isShow: true,
-		},
-		elData: inputAttrConfigMap,
-	},
-});
-let config = {
-	// 配置
-	baseConfig: {
-		title: {
-			subTitle: '表单项属性',
-		},
-		visible: true,
-		list: [
-			{
-				prop: 'label',
-				label: '参数名称',
-				el: 'hs-input',
-				slotValue: 'label',
-			},
-			{
-				prop: 'prop',
-				label: '查询参数',
-				el: 'hs-input',
-			},
-			{
-				prop: 'el',
-				label: '组件类型',
-				clearable: false,
-				tooltip: '下拉选择组件类型，组件类型取自配置文件',
-				el: 'hs-select',
-				cel: 'hs-option',
-				op: configElList.value,
-			},
-			{
-				prop: 'label-width',
-				label: '标签宽度',
-				el: 'hs-input',
-			},
-			{
-				prop: 'isSlot',
-				label: '是否自定义插槽',
-				el: 'hs-switch',
-				tooltip: '下拉选择，自定义模板，选择的名称就是模板名称',
-			},
-			{
-				prop: 'isApply',
-				label: '是否启用',
-				tooltip: '是否启用该表单项',
-				el: 'hs-switch',
-			},
-			{
-				prop: 'isShow',
-				label: '是否显示该表单项',
-				el: 'hs-switch',
-			},
-		],
-		rules: formBaseRule,
-	},
-	elConfig: {
-		title: {
-			subTitle: '元素项属性',
-		},
-		visible: true,
-		list: [],
-	},
-};
-
-let emptyFormItemData = ref<ComponentAttr.RecursivePartial<IFormTable.ConfigItemType>>({
-	id: '',
-	// 配置绑定的值
-	data: {
-		baseData: {},
-		elData: {
-			// hs-input组件属性
-		},
-	},
-	// 配置
-	baseConfig: {
-		title: {
-			subTitle: '表单项属性',
-		},
-		visible: true,
-		list: [],
-	}, // [],
-	elConfig: {
-		title: {
-			subTitle: '元素项属性',
-		},
-		visible: true,
-		list: [],
-	},
-});
-
-let formTitleConfig = ref({
-	code: {
-		visible: false,
-		subTitle: '表单配置代码',
-		class: 'font-bold my-3',
-		iconSize: 20,
-	},
-	form: {
-		visible: true,
-		subTitle: '表单配置',
-		class: 'font-bold my-3',
-		iconSize: 20,
-	},
-	formItem: {
-		visible: true,
-		subTitle: '表单元素配置项集合',
-		class: 'font-bold my-3',
-		iconSize: 20,
-	},
-	formExample: {
-		visible: false,
-		subTitle: '表单配置示例',
-		class: 'font-bold my-3',
-		iconSize: 20,
-	},
-});
-
-export { parentFormData, parentFormConfig, configElList, compConfig, formItemConfig, emptyFormItemData, formTitleConfig, config };