<!-- 通用形配置 -->
<template>
	<div>
		<el-form-item label="配置列表">
			<el-button type="primary" @click="openCode">编辑</el-button>
			<el-button
				type="primary"
				@click="api.box = true"
				icon="el-icon-search"
			></el-button>
		</el-form-item>
		<el-form-item label="组件库">
			<div>
				<p>
					<a
						href="https://echarts.apache.org/examples/zh/index.html"
						target="_blank"
						>官方组件库</a
					>
				</p>
				<p>
					<a href="http://chart.majh.top" target="_blank"
						>三方组件库1</a
					>
				</p>
				<p>
					<a href="http://echarts.zhangmuchen.top" target="_blank"
						>三方组件库2</a
					>
				</p>
				<p>
					<a href="https://madeapie.com" target="_blank"
						>三方组件库3</a
					>
				</p>
				<p>
					<a href="http://ppchart.com" target="_blank">三方组件库4</a>
				</p>
			</div>
		</el-form-item>
		<codeedit
			@submit="codeClose"
			title="配置列表"
			v-model="code.obj"
			v-if="code.box"
			:type="code.type"
			v-model:visible="code.box"
		></codeedit>
		<!-- <el-dialog title="组件库" v-model="api.box" width="70%">
			<component-list
				v-if="api.box"
				:activeName="1"
				@change="handleApiChange"
				:menu="false"
			></component-list>
		</el-dialog> -->
	</div>
</template>

<script>
import codeedit from "../../page/group/code.vue";
// import componentList from "../../page/list/components.vue";
// import { getObj } from "@/datav/api/components";
export default {
	name: "common",
	inject: ["main"],
	data() {
		return {
			api: {
				box: false,
				item: {},
			},
			code: {
				type: "echartFormatter",
				box: false,
				obj: {},
			},
		};
	},
	components: {
		// componentList,
		codeedit,
	},
	methods: {
		// handleApiChange(val) {
		// 	this.api.item = val;
		// 	getObj(this.api.item.id).then((res) => {
		// 		const data = res.data.data;
		// 		this.main.activeObj[this.code.type] = data.content;
		// 		this.api.box = false;
		// 		this.api.item = {};
		// 	});
		// },
		codeClose(value) {
			this.main.activeObj[this.code.type] = value;
		},
		openCode() {
			this.code.obj = this.main.activeObj[this.code.type];
			this.code.box = true;
		},
	},
};
</script>

<style></style>
