Vue.component('html-element', {
	template: 
	'<span style="font-size: 15px;"> \
		<div v-if="item.type == \'ul\'"> \
			<ul> \
				<li v-for="subitem in item.items" :style="item.style"><html-element :item="subitem"></html-element></li> \
			</ul> \
		</div> \
		<div v-else-if="item.type == \'ol\'"> \
			<ol> \
				<li v-for="subitem in item.items"><html-element :item="subitem"></html-element></li> \
			</ol> \
		</div> \
		<span v-else-if="item.type == \'img\'"> \
			<img :src="item.src" :style="item.style"></img> \
		</span> \
		<span v-else-if="item.type == \'p\'"> \
			<p :style="getStyle(item.style)"><html-element v-for="subitem in item.items" :item="subitem"></html-element></p> \
		</span> \
		<span v-else-if="item.type == \'span\'"> \
			<span :style="item.style"><html-element v-for="subitem in item.items" :item="subitem"></html-element></span> \
		</span> \
		<span v-else-if="item.type == \'sup\'"> \
			<sup :style="item.style">{{item.items}}</html-element></sup> \
		</span> \
		<div v-else-if="item.type == \'el-row\'"> \
			<el-row> \
				<el-col v-for="subitem in item.items" :style="getStyle(item.style)" :span="item.span"><html-element :item="subitem"></html-element></el-col> \
			</el-row> \
		</div> \
		<div v-else-if="item.type == \'div\'"> \
			<div v-for="subitem in item.items" :style="getStyle(item.style)" :span="item.span"><html-element :item="subitem"></html-element></div> \
		</div> \
		<a v-else-if="item.type == \'a\'" :href="item.href" :style="item.style"><html-element v-for="subitem in item.items" :item="subitem"></html-element></a> \
		<b v-else-if="item.type == \'b\'"><html-element v-for="subitem in item.items" :item="subitem"></html-element></b> \
		<blockquote v-else-if="item.type == \'blockquote\'"><img style="margin: 0px 0px 0px 0px; float: left; padding-right: 10px;" src="/assets/images/marker6-01.png"/><html-element v-for="subitem in item.items" :item="subitem"></html-element></blockquote> \
		<em v-else-if="item.type == \'em\'" style="item.style"><html-element v-for="subitem in item.items" :item="subitem"></html-element></em> \
		<!--<span v-else-if="item.items.length" v-for="subitem in item.items" :style="getStyle(item.style)">{{subitem}}</span>--> \
		<span v-else-if="item.type == \'br\'"></br></span> \
		<span v-else>{{item}}</span> \
	</span>',
	props: {item:{type:[Object,String,Number,Array], default:function() {return ''}}, 'type':{type:String, default:'NA'}},
	methods: {
		getStyle: function (obj) {
			return obj || '';
		}
	}
});