This commit is contained in:
shijing 2024-10-25 17:20:12 +08:00
commit 642b94923f
11 changed files with 364 additions and 202 deletions

View File

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

View File

@ -35,7 +35,7 @@
</div> </div>
<div class="scTable-page" v-if="!hidePagination || !hideDo"> <div class="scTable-page" v-if="!hidePagination || !hideDo">
<div class="scTable-pagination"> <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" :page-size="scPageSize" :page-sizes="pageSizes" v-model:currentPage="currentPage"
@current-change="paginationChange" @update:page-size="pageSizeChange"></el-pagination> @current-change="paginationChange" @update:page-size="pageSizeChange"></el-pagination>
</div> </div>

View File

@ -106,7 +106,7 @@
[this.defaultProps.keyword]: this.keyword [this.defaultProps.keyword]: this.keyword
} }
Object.assign(reqData, this.params, this.formData) 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) var parseData = config.parseData(res)
this.tableData = parseData.rows; this.tableData = parseData.rows;
this.total = parseData.total; this.total = parseData.total;

View File

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

View File

@ -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>

View File

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

View File

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

View File

@ -503,7 +503,7 @@ export default {
}, },
splitLine: { splitLine: {
show: false, show: true,
lineStyle: { lineStyle: {
type: "dashed", //y线 type: "dashed", //y线
color: "rgba(102,102,102,0.9)", color: "rgba(102,102,102,0.9)",
@ -513,45 +513,6 @@ export default {
}, },
series: [], 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], radarSeriesData: [0, 0, 0, 0, 0],
radarOption: { radarOption: {
radar: { radar: {
@ -829,7 +790,6 @@ export default {
{ {
name: "熟料", name: "熟料",
type: "line", type: "line",
stack: "Total",
smooth: true, smooth: true,
lineStyle: { lineStyle: {
width: 0, width: 0,
@ -847,7 +807,6 @@ export default {
{ {
name: "水泥", name: "水泥",
type: "line", type: "line",
stack: "Total",
smooth: true, smooth: true,
lineStyle: { lineStyle: {
width: 0, width: 0,
@ -865,7 +824,6 @@ export default {
{ {
name: "出厂水泥", name: "出厂水泥",
type: "line", type: "line",
stack: "Total",
smooth: true, smooth: true,
lineStyle: { lineStyle: {
width: 0, width: 0,
@ -951,11 +909,11 @@ export default {
let myChart = echarts.init(chartDom); let myChart = echarts.init(chartDom);
// series // series
let seriesData = new Array(31).fill(0); // // let seriesData = new Array(31).fill(0); //
let seriesData1 = 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 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); // let seriesData5 = new Array(31).fill(0); //
// //
@ -974,10 +932,7 @@ export default {
this.$API.enm.enstat.req(query1).then((response) => { this.$API.enm.enstat.req(query1).then((response) => {
response.forEach((item) => { response.forEach((item) => {
if (item.mgroup_name === "原料压缩空气") { if (item.mgroup_name === "原料车间用水") {
let ind = item.day_s - 1;
seriesData[ind] = item.cair_consume || 0;
} else if (item.mgroup_name === "原料车间用水") {
let ind = item.day_s - 1; let ind = item.day_s - 1;
seriesData1[ind] = item.water_consume || 0; seriesData1[ind] = item.water_consume || 0;
} }
@ -988,10 +943,7 @@ export default {
return this.$API.enm.enstat.req(query2); return this.$API.enm.enstat.req(query2);
}).then((response) => { }).then((response) => {
response.forEach((item) => { response.forEach((item) => {
if (item.mgroup_name === "烧成压缩空气") { if (item.mgroup_name === "烧成车间用水") {
let ind = item.day_s - 1;
seriesData2[ind] = item.cair_consume || 0;
} else if (item.mgroup_name === "烧成车间用水") {
let ind = item.day_s - 1; let ind = item.day_s - 1;
seriesData3[ind] = item.water_consume || 0; seriesData3[ind] = item.water_consume || 0;
} }
@ -1002,50 +954,58 @@ export default {
return this.$API.enm.enstat.req(query3); return this.$API.enm.enstat.req(query3);
}).then((response) => { }).then((response) => {
response.forEach((item) => { response.forEach((item) => {
if (item.mgroup_name === "水泥压缩空气") { if (item.mgroup_name === "水泥车间用水") {
let ind = item.day_s - 1;
seriesData4[ind] = item.cair_consume || 0;
} else if (item.mgroup_name === "水泥车间用水") {
let ind = item.day_s - 1; let ind = item.day_s - 1;
seriesData5[ind] = item.water_consume || 0; seriesData5[ind] = item.water_consume || 0;
} }
}); });
// //
option3.series = [ option3.legend.data = [
{ {
name: '原料压缩空气', name: "原料车间用水",
type: 'line', textStyle: {
stack: 'Total', color: "#fff",
data: seriesData
}, },
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: '原料车间用水', name: '原料车间用水',
type: 'line', type: 'line',
stack: 'Total',
data: seriesData1 data: seriesData1
}, },
{ {
name: '烧成压缩空气',
type: 'line',
stack: 'Total',
data: seriesData2
},
{
name: '烧成车间用水', name: '烧成车间用水',
type: 'line', type: 'line',
stack: 'Total',
data: seriesData3 data: seriesData3
}, },
{ {
name: '水泥压缩空气',
type: 'line',
stack: 'Total',
data: seriesData4
},
{
name: '水泥车间用水', name: '水泥车间用水',
type: 'line', type: 'line',
stack: 'Total',
data: seriesData5 data: seriesData5
} }
] ]
@ -1310,31 +1270,26 @@ export default {
{ {
name: 'f-CaO', name: 'f-CaO',
type: 'line', type: 'line',
stack: 'Total',
data: seriesData data: seriesData
}, },
{ {
name: '立升重', name: '立升重',
type: 'line', type: 'line',
stack: 'Total',
data: seriesData1 data: seriesData1
}, },
{ {
name: 'SO3', name: 'SO3',
type: 'line', type: 'line',
stack: 'Total',
data: seriesData2 data: seriesData2
}, },
{ {
name: '比表面积', name: '比表面积',
type: 'line', type: 'line',
stack: 'Total',
data: seriesData3 data: seriesData3
}, },
{ {
name: '掺量', name: '掺量',
type: 'line', type: 'line',
stack: 'Total',
data: seriesData4 data: seriesData4
}, },
] ]

View File

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

View File

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

View File

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