<template>
	<el-form-item class="input-wrapper" :label="propertyName" content-float="right"
	              :content-width="contentWidth" :labelOffsetTop="labelOffsetTop">
		<el-tooltip placement="left" class="label" slot="label" trigger="hover" :open-delay="500" :enterable="false">
			<div slot="content" class="property-name-popover">
				<p>{{$t('Alias')}}：{{property.alias}}</p>
				<p>{{$t('Name')}}：{{propertyName}}</p>
			</div>
			<div>
				<p class="alias">{{property.alias||propertyName}}</p>
				<p class="property-name">{{propertyName}}</p>
			</div>
		</el-tooltip>
		<template>
			<slot></slot>
		</template>
	</el-form-item>
</template>

<script>
	import camelcase from 'camelcase'
	import ElFormItem from "./form-item";

	export default {
		name: "SampleInputWrapper",
		components: {ElFormItem},
		props: {
			property: Object,
			value: {},
			container: {},
			propertyName: String,
			editable: Boolean,
			switchable: Boolean,
			contentWidth: {
				type: String,
				default: '65%',
			},
			labelOffsetTop: {
				type: Number,
				default: 0,
			},
		},
		data() {
			return {}
		},
		watch: {

		},
		computed: {

		},
		methods: {
		}
	}
</script>

<style scoped>

</style>