/**
 * 根据 fForm.name 决定要显示哪些设置项
 */
export const fieldEditors = {
	text: [
		{key: 'width', label: '组件宽度', type: 'input'},
		{key: 'props.placeholder', label: '占位提示', type: 'input'},
		{key: 'props.prefixIcon', label: '前图标', type: 'icon'},
		{key: 'props.suffixIcon', label: '后图标', type: 'icon'},
		{key: 'props.minlength', label: '最少输入', type: 'number'},
		{key: 'props.maxlength', label: '最多输入', type: 'number'},
		{key: 'props.showWordLimit', label: '显示字数', type: 'switch'},
		{key: 'props.clearable', label: '能否清空', type: 'switch'},
		{key: 'props.readonly', label: '是否只读', type: 'switch'},
		{key: 'props.disabled', label: '是否禁用', type: 'switch'},
	],
	textarea: [
		{key: 'width', label: '组件宽度', type: 'input'},
		{key: 'props.placeholder', label: '占位提示', type: 'input'},
		{key: 'props.rows', label: '默认行数', type: 'number'},
		{key: 'props.minlength', label: '最少输入', type: 'number'},
		{key: 'props.maxlength', label: '最多输入', type: 'number'},
		{key: 'props.showWordLimit', label: '显示字数', type: 'switch'},
		{key: 'props.clearable', label: '能否清空', type: 'switch'},
		{key: 'props.readonly', label: '是否只读', type: 'switch'},
		{key: 'props.disabled', label: '是否禁用', type: 'switch'},
	],
	password: [
		{key: 'width', label: '组件宽度', type: 'input'},
		{key: 'props.placeholder', label: '占位提示', type: 'input'},
		{key: 'props.prefixIcon', label: '前图标', type: 'icon'},
		{key: 'props.suffixIcon', label: '后图标', type: 'icon'},
		{key: 'props.minlength', label: '最少输入', type: 'number'},
		{key: 'props.maxlength', label: '最多输入', type: 'number'},
		{key: 'props.showWordLimit', label: '显示字数', type: 'switch'},
		{key: 'props.clearable', label: '能否清空', type: 'switch'},
		{key: 'props.readonly', label: '是否只读', type: 'switch'},
		{key: 'props.disabled', label: '是否禁用', type: 'switch'},
	],
	number: [
		{key: 'width', label: '组件宽度', type: 'input'},
		{key: 'props.placeholder', label: '占位提示', type: 'input'},
		{key: 'props.precision', label: '精度', type: 'number'},
		{key: 'props.step', label: '步长', type: 'number'},
		{key: 'props.stepStrictly', label: '严格步数', type: 'switch'},
		{
			key: 'props.controlsPosition', label: '按钮位置', type: 'radio', options: [
				{label: '默认', value: ''},
				{label: '右侧', value: 'right'},
			]
		},
		{key: 'props.readonly', label: '是否只读', type: 'switch'},
		{key: 'props.disabled', label: '是否禁用', type: 'switch'},
	],
	select: [
		{key: 'width', label: '组件宽度', type: 'input'},
		{key: 'props.placeholder', label: '占位提示', type: 'input'},
		{key: 'props.multiple', label: '是否多选', type: 'switch'},
		{key: 'props.filterable', label: '能否筛选', type: 'switch'},
		{key: 'props.clearable', label: '能否清空', type: 'switch'},
		{key: 'props.disabled', label: '是否禁用', type: 'switch'},
	],
	cascader: [
		{key: 'width', label: '组件宽度', type: 'input'},
		{key: 'props.placeholder', label: '占位提示', type: 'input'},
		{key: 'props.separator', label: '分隔符', type: 'input'},
		{key: 'props.showAllLevels', label: '展示全路径', type: 'switch'},
		{key: 'props.clearable', label: '能否清空', type: 'switch'},
		{key: 'props.props.multiple', label: '是否多选', type: 'switch'},
		{key: 'props.filterable', label: '能否筛选', type: 'switch'},
		{key: 'props.disabled', label: '是否禁用', type: 'switch'},
	],
	radio: [
		{
			key: 'style', label: '选项样式', type: 'radio', options: [
				{label: '默认', value: ''},
				{label: '按钮', value: 'button'},
			]
		},
		{key: 'props.disabled', label: '是否禁用', type: 'switch'},
	],
	checkbox: [
		{key: 'props.min', label: '最少应选', type: 'number'},
		{key: 'props.max', label: '最多可选', type: 'number'},
		{
			key: 'style', label: '选项样式', type: 'radio', options: [
				{label: '默认', value: ''},
				{label: '按钮', value: 'button'},
			]
		},
		{key: 'props.disabled', label: '是否禁用', type: 'switch'},
	],
	switch: [
		{key: 'props.activeText', label: '打开提示', type: 'input'},
		{key: 'props.inactiveText', label: '关闭提示', type: 'input'},
		{key: 'props.activeValue', label: '打开值', type: 'input'},
		{key: 'props.inactiveValue', label: '关闭值', type: 'input'},
		{key: 'props.activeActionIcon', label: '打开图标', type: 'icon'},
		{key: 'props.inactiveActionIcon', label: '关闭图标', type: 'icon'},
		{key: 'props.disabled', label: '是否禁用', type: 'switch'},
	],
	slider: [
		{key: 'width', label: '组件宽度', type: 'input'},
		{key: 'props.min', label: '最大值', type: 'number'},
		{key: 'props.max', label: '最小值', type: 'number'},
		{key: 'props.step', label: '步长', type: 'number'},
		{key: 'props.showStops', label: '显示间隔点', type: 'switch'},
		{key: 'props.range', label: '范围选择', type: 'switch'},
		{key: 'props.disabled', label: '是否禁用', type: 'switch'},
	],
	rate: [
		{key: 'props.max', label: '最大值', type: 'number'},
		{key: 'props.allowHalf', label: '是否半选', type: 'switch'},
		{key: 'props.showScore', label: '显示分数', type: 'switch'},
		{key: 'props.disabled', label: '是否禁用', type: 'switch'},
	],
	color: [
		{
			key: 'props.colorFormat', label: '颜色格式', type: 'select', options: [
				{label: 'hsl', value: 'hsl'},
				{label: 'hsv', value: 'hsv'},
				{label: 'hex(when show-alpha is false)', value: 'hex'},
				{label: 'rgb(when show-alpha is true)', value: 'rgb'},
			]
		},
		{key: 'props.showAlpha', label: '透明度', type: 'switch'},
		{key: 'props.disabled', label: '是否禁用', type: 'switch'},
	],
	upload: [
		{key: 'props.name', label: '文件字段名', type: 'input'},
		{key: 'btnText', label: '按钮文字', type: 'input'},
		{key: 'props.accept', label: '文件类型', type: 'input'},
		{
			key: 'props.listType', label: '列表类型', type: 'radio', options: [
				{label: 'text', value: 'text'},
				{label: 'picture', value: 'picture'},
				{label: 'picture-card', value: 'picture-card'}
			]
		},
		{key: 'tip', label: '提示信息', type: 'input'},
		{key: 'props.multiple', label: '是否多选', type: 'switch'},
		{key: 'props.autoUpload', label: '自动上传', type: 'switch'},
		{key: 'props.disabled', label: '是否禁用', type: 'switch'},
	],
	date: [
		{key: 'width', label: '组件宽度', type: 'input'},
		{
			key: 'props.type', label: '时间类型', type: 'select', options: [
				{label: '日', value: 'date'},
				{label: '周', value: 'week'},
				{label: '月', value: 'month'},
				{label: '年', value: 'year'},
				{label: '日期时间', value: 'datetime'},
			]
		},
		{key: 'props.format', label: '显示格式', type: 'input'},
		{key: 'props.valueFormat', label: '日期格式', type: 'input'},
		{key: 'props.clearable', label: '能否清空', type: 'switch'},
		{key: 'props.readonly', label: '是否只读', type: 'switch'},
		{key: 'props.disabled', label: '是否禁用', type: 'switch'},
	],
	daterange: [
		{
			key: 'props.type', label: '时间类型', type: 'select', options: [
				{label: '日期范围', value: 'daterange'},
				{label: '月范围', value: 'monthrange'},
				{label: '日期时间范围', value: 'datetimerange'},
			]
		},
		{key: 'props.rangeSeparator', label: '分隔符', type: 'input'},
		{key: 'props.format', label: '显示格式', type: 'input'},
		{key: 'props.valueFormat', label: '日期格式', type: 'input'},
		{key: 'props.clearable', label: '能否清空', type: 'switch'},
		{key: 'props.readonly', label: '是否只读', type: 'switch'},
		{key: 'props.disabled', label: '是否禁用', type: 'switch'},
	],
	time: [
		{key: 'props.editable', label: '可输入', type: 'switch'},
		{key: 'props.clearable', label: '能否清空', type: 'switch'},
		{key: 'props.readonly', label: '是否只读', type: 'switch'},
		{key: 'props.disabled', label: '是否禁用', type: 'switch'},
	],
	timerange: [
		{key: 'props.editable', label: '可输入', type: 'switch'},
		{key: 'props.rangeSeparator', label: '分隔符', type: 'input'},
		{key: 'props.clearable', label: '能否清空', type: 'switch'},
		{key: 'props.readonly', label: '是否只读', type: 'switch'},
		{key: 'props.disabled', label: '是否禁用', type: 'switch'},
	],
	button: [
		{key: 'labelWidth', label: '标签宽度', type: 'number'},
		{key: 'btnText', label: '按钮文字', type: 'input'},
		{
			key: 'props.type', label: '按钮类型', type: 'select', options: [
				{label: 'primary', value: 'primary'},
				{label: 'success', value: 'success'},
				{label: 'warning', value: 'warning'},
				{label: 'danger', value: 'danger'},
				{label: 'info', value: 'info'},
				{label: 'default', value: ''},
			]
		},
		{key: 'props.icon', label: '图标', type: 'icon'},
		{key: 'props.plain', label: '朴素按钮', type: 'switch'},
		{key: 'props.text', label: '文字按钮', type: 'switch'},
		{key: 'props.round', label: '圆角按钮', type: 'switch'},
		{key: 'props.circle', label: '圆形按钮', type: 'switch'},
		{key: 'props.disabled', label: '是否禁用', type: 'switch'},
	],
	layout: [
		{key: 'props.gutter', label: '分栏间隔', type: 'number'},
	]
}
// 'year' | 'years' |'month' | 'months' | 'date' | 'dates' | 'datetime' | 'week' | 'datetimerange' | 'daterange' | 'monthrange' | 'yearrange'
export const getComponent = (type) => {
	const map = {
		text: 'el-input',
		textarea: 'el-input',
		password: 'el-input',
		number: 'el-input-number',
		select: 'el-select',
		cascader: 'el-cascader',
		radio: 'el-radio-group',
		checkbox: 'el-checkbox-group',
		switch: 'el-switch',
		slider: 'el-slider',
		rate: 'el-rate',
		color: 'el-color-picker',
		upload: 'el-upload',
		date: 'el-date-picker',
		daterange: 'el-date-picker',
		time: 'el-time-picker',
		timerange: 'el-time-picker',
		button: 'el-button'
	}
	return map[type] || 'div'
}

export function getByPath(obj, path) {
	return path.split('.').reduce((o, k) => o?.[k], obj)
}

export function setByPath(obj, path, value) {
	const keys = path.split('.')
	let o = obj
	keys.slice(0, -1).forEach(k => o = o[k])
	o[keys[keys.length - 1]] = value
}

export const inputComps = [{
	title: "单行文本",
	icon: "pi-icon-line-input",
	name: "text",
	props: {
		type: 'text'
	},
	rules: [],
	width: "100%",
	required: false
}, {
	title: "多行文本",
	icon: "pi-icon-multi-input",
	name: "textarea",
	props: {
		type: 'textarea'
	},
	rules: [],
	width: "100%",
	required: false
}, {
	title: "密码",
	icon: "pi-icon-lock",
	name: "password",
	props: {
		type: 'password',
		showPassword: true
	},
	rules: [],
	width: "100%",
	required: false
}, {
	title: "计数器",
	icon: "pi-icon-number-input",
	name: "number",
	props: {
		controlsPosition: ''
	},
	rules: [],
	width: "100%",
	required: false,
	value: 1
}]
export const choiceComps = [{
	title: "下拉组件",
	icon: "pi-icon-select",
	name: "select",
	props: {},
	rules: [],
	options: [],
	width: "100%",
	required: false,
}, {
	title: "级联组件",
	icon: "pi-icon-cascader",
	name: "cascader",
	props: {
		props: {
			label: 'label',
			value: 'value',
			multiple: false,
		},
		options: [{label: '一号楼', value: 'r1', children: [{label: '二单元', value: 'c2'}]}]
	},
	rules: [],
	width: "100%",
	required: false,
}, {
	title: "单选组件",
	icon: "pi-icon-radio",
	name: "radio",
	props: {},
	rules: [],
	options: [],
	width: "100%",
	style: '',
	required: false,
}, {
	title: "多选组件",
	icon: "pi-icon-checkbox",
	name: "checkbox",
	props: {},
	rules: [],
	options: [],
	style: '',
	required: false,
}, {
	title: "开关",
	icon: "pi-icon-switch",
	name: "switch",
	props: {},
	rules: [],
	required: false,
}, {
	title: "滑块",
	icon: "pi-icon-slider",
	name: "slider",
	props: {},
	rules: [],
	width: "100%",
	required: false,
}, {
	title: "时间选择",
	icon: "pi-icon-time-picker",
	name: "time",
	props: {
		format: 'HH:mm:ss',
		valueFormat: 'HH:mm:ss'
	},
	rules: []
}, {
	title: "时间范围",
	icon: "pi-icon-time-range",
	name: "timerange",
	props: {
		isRange: true,
		format: 'HH:mm:ss',
		valueFormat: 'HH:mm:ss'
	},
	rules: [],
	width: "100%",
	required: false,
}, {
	title: "日期选择",
	icon: "pi-icon-date-picker",
	name: "date",
	props: {
		type: "date",
		format: 'YYYY-MM-DD',
		valueFormat: 'YYYY-MM-DD'
	},
	rules: [],
	width: "100%",
	required: false,
}, {
	title: "日期范围",
	icon: "pi-icon-date-range",
	name: "daterange",
	props: {
		type: "daterange",
		format: 'YYYY-MM-DD',
		valueFormat: 'YYYY-MM-DD'
	},
	rules: [],
	width: "100%",
	required: false,
}, {
	title: "评分",
	icon: "pi-icon-rate",
	name: "rate",
	props: {},
	rules: [],
	required: false,
}, {
	title: "颜色选择",
	icon: "pi-icon-color-picker",
	name: "color",
	props: {},
	rules: [],
	required: false,
}, {
	title: "上传",
	icon: "pi-icon-upload-file",
	name: "upload",
	props: {
		listType: 'text',
		name: 'file'
	},
	rules: [],
	required: false,
	btnText: "点击上传"
}]
export const layoutComps = [{
	title: "行容器",
	icon: "pi-icon-row-layout",
	name: "layout",
	props: {
		gutter: 15
	},
	children: []
}, {
	title: "按钮",
	icon: "pi-icon-button",
	name: "button",
	props: {
		type: 'primary'
	},
	btnText: "按钮文字"
}];