Merge branch 'master' of https://e.coding.net/ctcdevteam/ehs/ehs_web

package.json

@@ -29,7 +29,7 @@
 		"dagre-d3": "^0.6.4",
 		"dhtmlx-gantt": "^8.0.6",
 		"echarts": "^5.5.1",
-		"element-plus": "^2.7.4",
+		"element-plus": "^2.8.4",
 		"file-saver": "^2.0.5",
 		"html2canvas": "^1.4.1",
 		"json-editor-vue3": "^1.0.6",
@@ -42,7 +42,6 @@
 		"three": "^0.155.0",
 		"tinymce": "6.3.2",
 		"vue": "3.2.47",
-		"vue-echarts": "^7.0.3",
 		"vue-i18n": "9.2.2",
 		"vue-router": "4.1.6",
 		"vuedraggable": "4.0.3",

src/components/scTable/index.vue

@@ -35,7 +35,7 @@
     </div>
     <div class="scTable-page" v-if="!hidePagination || !hideDo">
       <div class="scTable-pagination">
-        <el-pagination v-if="!hidePagination" background :small="true" :layout="paginationLayout" :total="total"
+        <el-pagination v-if="!hidePagination" background size="small" :layout="paginationLayout" :total="total"
           :page-size="scPageSize" :page-sizes="pageSizes" v-model:currentPage="currentPage"
           @current-change="paginationChange" @update:page-size="pageSizeChange"></el-pagination>
       </div>

src/components/scTableSelect/index.vue

@@ -106,7 +106,7 @@
 					[this.defaultProps.keyword]: this.keyword
 				}
 				Object.assign(reqData, this.params, this.formData)
-				var res = await this.apiObj.get(reqData);
+				var res = await this.apiObj.req(reqData);
 				var parseData = config.parseData(res)
 				this.tableData = parseData.rows;
 				this.total = parseData.total;

src/components/xSelect/index.vue

@@ -1,8 +1,6 @@
 <template>
 	<div>
-		<el-input ref="inputRef0" style="display: none" v-model="inputValue">
-		</el-input>
-		<el-input ref="inputRef" v-model="inputLabel" :readonly="true">
+		<el-input ref="inputRef" v-model="selectLabel" :readonly="true">
 			<template #prefix>
 				<el-button
 					text
@@ -12,14 +10,13 @@
                     @click="showPopover=true"
 				></el-button>
 			</template>
-
 			<template #suffix>
 				<el-button
 					text
 					size="small"
 					circle
 					icon="el-icon-close"
-					v-show="inputLabel && edit"
+					v-show="selectLabel && edit"
 					@click="handleClear"
 				></el-button>
 			</template>
@@ -39,6 +36,7 @@
 				></el-input>
 				<div style="height: 2px"></div>
 				<scTable
+                    v-if="showPopover"
 					ref="table"
 					:apiObj="apiObj"
 					:params="params"
@@ -50,9 +48,12 @@
 					:hidePagination="hidePagination"
 					paginationLayout="prev, pager, next"
 					hideDo
+                    @dataChange="tdChange"
+                    @selection-change="selectionChange"
 				>
+                    <el-table-column v-if="multiple" type="selection" width="40" :reserve-selection="true"></el-table-column>
 					<slot></slot>
-				</scTable>
+            </scTable>
 			</el-popover>
 		</div>
 	</div>
@@ -62,26 +63,39 @@
 import { ref, defineProps, defineEmits, computed } from "vue";
 
 const props = defineProps({
+    multiple: { type: Boolean, default: false },
 	edit: { type: Boolean, default: true },
 	hidePagination: { type: Boolean, default: false },
 	tableWidth: { type: Number, default: 600 },
 	tableHeight: { type: Number, default: 400 },
 	apiObj: { type: Object, default: () => {}, required: true },
 	params: { type: Object, default: () => {} },
-	label: { type: String, default: "" },
-	modelValue: { type: String, default: null },
+	label: { type: [String, Number, Array], default: "" },
+    obj: { type: Object, default: () => {} },
+	modelValue: { type: [String, Number, Array], default: null },
 	labelField: { type: String, default: "name" },
 	valueField: { type: String, default: "id" },
 });
 
-const emit = defineEmits(["update:modelValue", "update:label"]);
+const emit = defineEmits(["update:modelValue", "update:label", "update:obj"]);
 
 // 控制 popover 显示与隐藏的状态
+const multiple = ref(props.multiple);
+const obj = ref(props.obj);
 const showPopover = ref(false);
 const inputRef = ref();
-const inputRef0 = ref();
 const table = ref();
-const inputLabel = computed({
+
+const selectObj = computed({
+	get() {
+		return props.obj;
+	},
+	set(val) {
+		emit("update:obj", val);
+    }
+})
+
+const selectLabel = computed({
 	get() {
 		return props.label;
 	},
@@ -89,7 +103,7 @@ const inputLabel = computed({
 		emit("update:label", val);
 	},
 });
-const inputValue = computed({
+const selectValue = computed({
 	get() {
 		return props.modelValue;
 	},
@@ -107,13 +121,31 @@ const handleQuery = () => {
 };
 
 const rowClick = (row) => {
-	inputLabel.value = row[props.labelField];
-	inputValue.value = row[props.valueField];
-	showPopover.value = false;
+    if(!multiple.value){
+        selectObj.value = row;
+        selectLabel.value = row[props.labelField];
+        selectValue.value = row[props.valueField];
+        showPopover.value = false;
+    }
 };
 
 const handleClear = () => {
-	inputLabel.value = "";
-	inputValue.value = null;
+    selectObj.value = {};
+	selectLabel.value = "";
+	selectValue.value = null;
 };
-</script>
+
+const tdChange = (res, tableData) =>{
+    // if(obj.value && multiple){
+
+    // }
+}
+
+const selectionChange = (val) => {
+    if(multiple.value){
+        selectObj.value = val;
+        selectLabel.value = val.map(item => item[props.labelField]).join(";");
+        selectValue.value = val.map(item => item[props.valueField]);
+    }
+};
+</script>

src/components/xSelect/index2.vue

@@ -0,0 +1,126 @@
+<template>
+	<div>
+		<el-select v-bind="$attrs" ref="selectRef"
+			v-model="selectValue"
+			:value-key="valueField"
+		>
+			<template #empty>
+				<div :style="{ width: tableWidth + 'px', padding: '2px' }">
+					<el-input
+						v-model="keyword"
+						placeholder="关键词查找"
+						@keyup.enter="handleQuery"
+					></el-input>
+					<div style="height: 2px"></div>
+					<scTable
+						ref="table"
+						:apiObj="apiObj"
+						:params="params"
+						:query="query"
+						:height="tableHeight"
+						row-key="id"
+						stripe
+						@row-click="rowClick"
+						:hidePagination="hidePagination"
+						paginationLayout="prev, pager, next"
+						hideDo
+						@dataChange="tdChange"
+						@selection-change="
+							(selection) => {
+								selections = selection;
+							}
+						"
+					>
+						<el-table-column
+							v-if="multiple"
+							type="selection"
+							width="40"
+							:reserve-selection="true"
+						></el-table-column>
+						<slot></slot>
+					</scTable>
+				</div>
+			</template>
+		</el-select>
+	</div>
+</template>
+
+<script setup>
+import { ref, defineProps, defineEmits, computed } from "vue";
+
+const props = defineProps({
+	multiple: { type: Boolean, default: false },
+	edit: { type: Boolean, default: true },
+	hidePagination: { type: Boolean, default: false },
+	tableWidth: { type: Number, default: 600 },
+	tableHeight: { type: Number, default: 400 },
+	apiObj: { type: Object, default: () => {}, required: true },
+	params: { type: Object, default: () => {} },
+	label: { type: String, default: "" },
+	obj: { type: Object, default: () => {} },
+	modelValue: { type: String, default: null },
+	labelField: { type: String, default: "name" },
+	valueField: { type: String, default: "id" },
+});
+
+const emit = defineEmits(["update:modelValue", "update:label", "rowSelect"]);
+
+// 控制 popover 显示与隐藏的状态
+const showPopover = ref(false);
+const table = ref();
+const selectRef = ref();
+
+const selectObj = computed({
+	get() {
+		return props.obj;
+	},
+	set(val) {
+		emit("update:obj", val);
+	},
+});
+
+const selectLabel = computed({
+	get() {
+		return props.label;
+	},
+	set(val) {
+		emit("update:label", val);
+	},
+});
+const selectValue = computed({
+	get() {
+		return props.modelValue;
+	},
+	set(val) {
+		emit("update:modelValue", val);
+	},
+});
+
+const keyword = ref("");
+const query = ref({ search: "" });
+
+const handleQuery = () => {
+	query.value.search = keyword.value;
+	table.value.queryData(query.value);
+};
+
+const rowClick = (row) => {
+	selectObj.value = row;
+	selectLabel.value = row[props.labelField];
+	selectValue.value = row[props.valueField];
+	initOptions();
+	showPopover.value = false;
+};
+
+const handleClear = () => {
+	selectObj.value = {};
+	selectLabel.value = "";
+	selectValue.value = null;
+};
+
+const initOptions = () => {
+    console.log(selectRef.value)
+}
+
+const tdChange = (res, tableData) => {};
+</script>

src/main.js

@@ -18,9 +18,6 @@ import htmlToPdf from "./utils/htmlToPdf";
 
 import * as Cesium from "cesium";
 
-import "echarts";
-import ECharts from 'vue-echarts';
-
 const app = createApp(App);
 
 app.use(store);
@@ -36,7 +33,6 @@ app.use(Xlsx);
 app.use(htmlToPdf);
 app.use(jsBarCode);
 app.use(DataVVue3);
-app.component('v-chart', ECharts);
 
 //挂载app
 app.mount("#app");

src/scui.js

@@ -22,6 +22,7 @@ import scTitle from './components/scTitle'
 import scWaterMark from './components/scWaterMark'
 import scQrCode from './components/scQrCode'
 import scIconSelect from './components/scIconSelect'
+import scEcharts from './components/scEcharts'
 
 import scStatusIndicator from './components/scMini/scStatusIndicator'
 import scTrend from './components/scMini/scTrend'
@@ -70,6 +71,7 @@ export default {
 		app.component('scTrend', scTrend);
 		app.component('scFire', scFire);
 		app.component('scIconSelect', scIconSelect);
+		app.component('scEcharts', scEcharts);
 
 		//注册全局指令
 		app.directive('auth', auth)

src/views/bigScreen/index_enm.vue

@@ -503,7 +503,7 @@ export default {
 					},
 
 					splitLine: {
-						show: false,
+						show: true,
 						lineStyle: {
 							type: "dashed", //y轴分割线类型
 							color: "rgba(102,102,102,0.9)",
@@ -513,45 +513,6 @@ export default {
 				},
 				series: [],
 			},
-			option2 :{
-				color: ["#80FFA5", "#00DDFF", "#37A2FF", "#FF0087", "#FFBF00"],
-				tooltip: {
-					trigger: 'axis',
-					axisPointer: {
-					type: 'cross',
-					label: {
-						backgroundColor: '#6a7985'
-					}
-					}
-				},
-				legend: {
-					data: []
-				},
-				toolbox: {
-					feature: {
-					saveAsImage: {}
-					}
-				},
-				grid: {
-					left: '3%',
-					right: '4%',
-					bottom: '3%',
-					containLabel: true
-				},
-				xAxis: [
-					{
-					type: 'category',
-					boundaryGap: false,
-					data: []
-					}
-				],
-				yAxis: [
-					{
-					type: 'value'
-					}
-				],
-				series: [],
-			},
 			radarSeriesData: [0, 0, 0, 0, 0],
 			radarOption: {
 				radar: {
@@ -829,7 +790,6 @@ export default {
 						{
 							name: "熟料",
 							type: "line",
-							stack: "Total",
 							smooth: true,
 							lineStyle: {
 								width: 0,
@@ -847,7 +807,6 @@ export default {
 						{
 							name: "水泥",
 							type: "line",
-							stack: "Total",
 							smooth: true,
 							lineStyle: {
 								width: 0,
@@ -865,7 +824,6 @@ export default {
 						{
 							name: "出厂水泥",
 							type: "line",
-							stack: "Total",
 							smooth: true,
 							lineStyle: {
 								width: 0,
@@ -951,11 +909,11 @@ export default {
 			let myChart = echarts.init(chartDom);
 
 			// 初始化各个series数据数组
-			let seriesData = new Array(31).fill(0); // 原料车间压缩空气
+			// let seriesData = new Array(31).fill(0); // 原料车间压缩空气
 			let seriesData1 = new Array(31).fill(0); // 原料车间用水
-			let seriesData2 = new Array(31).fill(0); // 烧成车间压缩空气
+			// let seriesData2 = new Array(31).fill(0); // 烧成车间压缩空气
 			let seriesData3 = new Array(31).fill(0); // 烧成车间用水
-			let seriesData4 = new Array(31).fill(0); // 水泥车间压缩空气
+			// let seriesData4 = new Array(31).fill(0); // 水泥车间压缩空气
 			let seriesData5 = new Array(31).fill(0); // 水泥车间用水
 
 			// 定义查询参数的生成函数
@@ -974,10 +932,7 @@ export default {
 			this.$API.enm.enstat.req(query1).then((response) => {
 				response.forEach((item) => {
 
-					if (item.mgroup_name === "原料压缩空气") {
-						let ind = item.day_s - 1;
-						seriesData[ind] = item.cair_consume || 0;
-					} else if (item.mgroup_name === "原料车间用水") {
+					if (item.mgroup_name === "原料车间用水") {
 						let ind = item.day_s - 1;
 						seriesData1[ind] = item.water_consume || 0;
 					}
@@ -988,10 +943,7 @@ export default {
 				return this.$API.enm.enstat.req(query2);
 			}).then((response) => {
 				response.forEach((item) => {
-					if (item.mgroup_name === "烧成压缩空气") {
-						let ind = item.day_s - 1;
-						seriesData2[ind] = item.cair_consume || 0;
-					} else if (item.mgroup_name === "烧成车间用水") {
+					if (item.mgroup_name === "烧成车间用水") {
 						let ind = item.day_s - 1;
 						seriesData3[ind] = item.water_consume || 0;
 					}
@@ -1002,50 +954,58 @@ export default {
 				return this.$API.enm.enstat.req(query3);
 			}).then((response) => {
 				response.forEach((item) => {
-					if (item.mgroup_name === "水泥压缩空气") {
-						let ind = item.day_s - 1;
-						seriesData4[ind] = item.cair_consume || 0;
-					} else if (item.mgroup_name === "水泥车间用水") {
+					if (item.mgroup_name === "水泥车间用水") {
 						let ind = item.day_s - 1;
 						seriesData5[ind] = item.water_consume || 0;
 					}
 				});
 			// 更新图表数据
-			option3.series = [
-				{
-				name: '原料压缩空气',
-				type: 'line',
-				stack: 'Total',
-				data: seriesData
+			option3.legend.data = [
+			{
+					name: "原料车间用水",
+					textStyle: {
+						color: "#fff",
+					},
+					borderRadius: 2,
+					itemStyle: {
+						color: that.linearGradientColors[0],
+					},
 				},
+				{
+					name: "烧成车间用水",
+					textStyle: {
+						color: "#fff",
+					},
+					borderRadius: 2,
+					itemStyle: {
+						color: that.linearGradientColors[1],
+					},
+				},
+				{
+					name: "水泥车间用水",
+					textStyle: {
+						color: "#fff",
+					},
+					borderRadius: 2,
+					itemStyle: {
+						color: that.linearGradientColors[2],
+					},
+				},
+			];
+			option3.series = [
 				{
 				name: '原料车间用水',
 				type: 'line',
-				stack: 'Total',
 				data: seriesData1
 				},
 				{
-				name: '烧成压缩空气',
-				type: 'line',
-				stack: 'Total',
-				data: seriesData2
-				},
-				{
 				name: '烧成车间用水',
 				type: 'line',
-				stack: 'Total',
 				data: seriesData3
 				},
 				{
-				name: '水泥压缩空气',
-				type: 'line',
-				stack: 'Total',
-				data: seriesData4
-				},
-				{
 				name: '水泥车间用水',
 				type: 'line',
-				stack: 'Total',
 				data: seriesData5
 				}
 			]
@@ -1310,31 +1270,26 @@ export default {
 				{
 				name: 'f-CaO',
 				type: 'line',
-				stack: 'Total',
 				data: seriesData
 				},
 				{
 				name: '立升重',
 				type: 'line',
-				stack: 'Total',
 				data: seriesData1
 				},
 				{
 				name: 'SO3',
 				type: 'line',
-				stack: 'Total',
 				data: seriesData2
 				},
 				{
 				name: '比表面积',
 				type: 'line',
-				stack: 'Total',
 				data: seriesData3
 				},
 				{
 				name: '掺量',
 				type: 'line',
-				stack: 'Total',
 				data: seriesData4
 				},
 			]

src/views/enm_mill/handoverLog.vue

@@ -219,7 +219,7 @@
 									class="numCell"
 									v-if="reportItem.出磨水泥_SO3_rate_pass"
 								>
-									{{ reportItem.出磨水泥_SO3_rate_pass * 100 }}
+									{{ (reportItem.出磨水泥_SO3_rate_pass * 100).toFixed(2) }}
 								</td>
 								<td class="numCell" v-else>0</td>
 								<td class="numCell">比表面积合格率（%）</td>
@@ -227,7 +227,7 @@
 									class="numCell"
 									v-if="reportItem.出磨水泥_比表面积_rate_pass"
 								>
-									{{ reportItem.出磨水泥_比表面积_rate_pass * 100 }}
+									{{ (reportItem.出磨水泥_比表面积_rate_pass * 100).toFixed(2) }}
 								</td>
 								<td class="numCell" v-else>0</td>
 								<td class="numCell">掺量合格率（%）</td>
@@ -235,7 +235,7 @@
 									class="numCell"
 									v-if="reportItem.出磨水泥_掺量_rate_pass"
 								>
-									{{ reportItem.出磨水泥_掺量_rate_pass * 100 }}
+									{{ (reportItem.出磨水泥_掺量_rate_pass * 100).toFixed(2) }}
 								</td>
 								<td class="numCell" v-else>0</td>
 							</tr>

src/views/home/testx.vue

@@ -1,15 +1,21 @@
 <template>
 	<el-container>
-        <el-aside width="200px">
-            <el-menu>
-                <el-menu-item v-for="item in menu" :key="item" :index="item" @click="currentM=item">{{item}}</el-menu-item>
-            </el-menu>
-        </el-aside>
+		<el-aside width="200px">
+			<el-menu>
+				<el-menu-item
+					v-for="item in menu"
+					:key="item"
+					:index="item"
+					@click="currentM = item"
+					>{{ item }}</el-menu-item
+				>
+			</el-menu>
+		</el-aside>
 		<el-main>
-			<div v-if="currentM=='二维码'">
+			<div v-if="currentM == '二维码'">
 				<scQrCode text="xxxx"></scQrCode>
 			</div>
-			<div v-if="currentM=='带默认的选择'">
+			<div v-if="currentM == 'ehsSelect'">
 				<ehsSelect
 					:apiObj="apiObj"
 					v-model="x"
@@ -19,108 +25,152 @@
 					:params="{ search: '生产' }"
 				></ehsSelect>
 			</div>
-			<div v-if="currentM=='图标选择'">
-				<scIconSelect></scIconSelect>
-			</div>
-			<div v-if="currentM=='xselect'">
-				<xSelect :apiObj="apiObj" v-model="x2" v-model:label="x2_name" style="width: 200px">
-          <el-table-column label="id" prop="id"></el-table-column>
-          <el-table-column label="名称" prop="name"></el-table-column>
-        </xSelect>
+			<div v-if="currentM == 'xSelect'">
+				<xSelect
+					:apiObj="apiObj"
+					v-model="x2"
+					v-model:label="x2_name"
+					v-model:obj="x2_obj"
+					style="width: 500px"
+					:multiple="true"
+				>
+					<el-table-column label="id" prop="id"></el-table-column>
+					<el-table-column label="名称" prop="name"></el-table-column>
+				</xSelect>
 
-        <div>当前选择：{{ x2 }}  {{ x2_name }}</div>
+				<div>
+					当前选择：
+					<h1>value: {{ x2 }}</h1>
+					<h1>label: {{ x2_name }}</h1>
+					<h1>obj: {{ x2_obj }}</h1>
+				</div>
+			</div>
+			<div v-if="currentM == 'scEcharts'">
+				<el-card title="测试图表">
+					<scEcharts :option="chartOption" height="400px" />
+				</el-card>
+			</div>
+			<div v-if="currentM == 'ehsUserSelect'">
+				<ehsUserSelect :multiple="true" @submit="getMember" />
+			</div>
+			<div v-if="currentM == 'ehsEpSelect'">
+				<ehsEpSelect :multiple="true" @submit="getMember" />
+			</div>
+			<div v-if="currentM == 'ehsTableSelect'">
+				<ehsTableSelect
+					:apiObj="apiObj"
+					v-model="x2"
+					:props="{ value: 'id', label: 'name' }"
+					:multiple="true"
+				>
+					<el-table-column label="id" prop="id"></el-table-column>
+					<el-table-column label="名称" prop="name"></el-table-column>
+				</ehsTableSelect>
+			</div>
+			<div v-if="currentM == 'scTableSelect'">
+				<scTableSelect :apiObj="apiObj" v-model="x3" :props="props">
+					<el-table-column label="id" prop="id"></el-table-column>
+					<el-table-column label="名称" prop="name"></el-table-column>
+				</scTableSelect>
+
+				<el-select v-model="x3" >
+
+				</el-select>
 			</div>
-            <div v-if="currentM=='vue-echarts'">
-                <v-chart :option="chartOption" autoresize  style="height: 400px; width: 400px"/>
-            </div>
-            <div v-if="currentM=='用户选择'">
-              <ehsUserSelect :multiple="true" @submit="getMember"/>
-            </div>
-            <div v-if="currentM=='员工选择'">
-              <ehsEpSelect :multiple="true" @submit="getMember"/>
-            </div>
 		</el-main>
 	</el-container>
 </template>
 <script>
+// import xSelects from "@/components/xSelect/index2.vue";
 export default {
 	name: "testx",
 	components: {},
 	data() {
 		return {
-      menu: [
-        '二维码',
-        '带默认的选择',
-        '图标选择',
-        'xselect',
-        'vue-echarts',
-        '用户选择',
-        '员工选择'
-      ],
-      currentM: "",
+			menu: [
+				"二维码",
+				"xSelect",
+				"ehsSelect",
+				"scEcharts",
+				"ehsUserSelect",
+				"ehsEpSelect",
+				"ehsTableSelect",
+				"scTableSelect",
+			],
+			props: {
+				label: "name",
+				value: "id",
+				keyword: "search",
+			},
+			x_3: {
+				value: "3347207082608115712",
+				label: "烧成车间",
+			},
+			currentM: "",
 			apiObj: this.$API.system.dept.list,
 			x: "3607937377546706944",
 			x_name: "光芯科技",
 			// x:null,
 			apiObj2: this.$API.system.user.list,
 			x2: "3347207082608115712",
-            x2_name: "烧成车间",
-            chartOption: {
-              textStyle: {
-                fontFamily: 'Inter, "Helvetica Neue", Arial, sans-serif',
-              },
-              title: {
-                text: 'Traffic Sources',
-                left: 'center',
-              },
-              tooltip: {
-                trigger: 'item',
-                formatter: '{a} <br/>{b} : {c} ({d}%)',
-              },
-              legend: {
-                orient: 'vertical',
-                left: 'left',
-                data: [
-                  'Direct',
-                  'Email',
-                  'Ad Networks',
-                  'Video Ads',
-                  'Search Engines',
-                ],
-              },
-              series: [
-                {
-                  name: 'Traffic Sources',
-                  type: 'pie',
-                  radius: '55%',
-                  center: ['50%', '60%'],
-                  data: [
-                    { value: 335, name: 'Direct' },
-                    { value: 310, name: 'Email' },
-                    { value: 234, name: 'Ad Networks' },
-                    { value: 135, name: 'Video Ads' },
-                    { value: 1548, name: 'Search Engines' },
-                  ],
-                  emphasis: {
-                    itemStyle: {
-                      shadowBlur: 10,
-                      shadowOffsetX: 0,
-                      shadowColor: 'rgba(0, 0, 0, 0.5)',
-                    },
-                  },
-                },
-              ],
-            },
+			x2_name: "烧成车间",
+			x2_obj: {},
+			chartOption: {
+				textStyle: {
+					fontFamily: 'Inter, "Helvetica Neue", Arial, sans-serif',
+				},
+				title: {
+					text: "Traffic Sources",
+					left: "center",
+				},
+				tooltip: {
+					trigger: "item",
+					formatter: "{a} <br/>{b} : {c} ({d}%)",
+				},
+				legend: {
+					orient: "vertical",
+					left: "left",
+					data: [
+						"Direct",
+						"Email",
+						"Ad Networks",
+						"Video Ads",
+						"Search Engines",
+					],
+				},
+				series: [
+					{
+						name: "Traffic Sources",
+						type: "pie",
+						radius: "55%",
+						center: ["50%", "60%"],
+						data: [
+							{ value: 335, name: "Direct" },
+							{ value: 310, name: "Email" },
+							{ value: 234, name: "Ad Networks" },
+							{ value: 135, name: "Video Ads" },
+							{ value: 1548, name: "Search Engines" },
+						],
+						emphasis: {
+							itemStyle: {
+								shadowBlur: 10,
+								shadowOffsetX: 0,
+								shadowColor: "rgba(0, 0, 0, 0.5)",
+							},
+						},
+					},
+				],
+			},
 		};
 	},
 	mounted() {},
 	methods: {
-    getMember(data) {
-      console.log(data)
-    },
-    showx2(){
-            // console.log(this.x2)
-        }
-    },
+		getMember(data) {
+			console.log(data);
+		},
+		showx2() {
+			// console.log(this.x2)
+		},
+	},
 };
 </script>

src/xui.js

@@ -1,12 +1,14 @@
 import ehsUserSelect from './components/ehsSelect/userselect'
 import ehsEpSelect from './components/ehsSelect/epselect'
 import ehsSelect from './components/ehsSelect/select'
+import ehsTableSelect from './components/ehsSelect/tableSelect'
 import xSelect from './components/xSelect/index.vue'
 export default {
 	install(app) {
 		app.component('ehsUserSelect', ehsUserSelect);
 		app.component('ehsEpSelect', ehsEpSelect);
 		app.component('ehsSelect', ehsSelect);
+		app.component('ehsTableSelect', ehsTableSelect);
 		app.component('xSelect', xSelect);
 	}
 }