Skip to content

M
mes-ui
Commit 6eae1e16 authored by 仇晓婷's avatar 仇晓婷
Browse files
Options

用户中心

parent 588e95de
Hide whitespace changes
Inline Side-by-side
Showing with 132 additions and 49 deletions
pages/home/component/materielChart.vue
View file @ 6eae1e16
<template>
<div class="stachart">
<div :gutter="16" class="row_head">
<div class="stachart" :style="setStatistics?{width:'620px',height:'300px'}:{width:'100%',height:'100%'}">
<div :gutter="16" class="row_head" v-if="setStatistics?false:true">
<Icon type="ios-images" class="f20" />
<span class="ml10">物料相关统计</span>
</div>
......@@ -24,6 +24,9 @@ export default {
components: {
"v-chart": ECharts,
},
props: {
setStatistics: Boolean,
},
data() {
return {
value2: "",
......@@ -198,7 +201,7 @@ export default {
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.16);
border-radius: 8px;
padding: 10px;
width: 100%;
margin: 0 auto;
.echarts-map {
width: 100%;
height: 300px;
......
pages/home/component/staChart.vue
View file @ 6eae1e16
......@@ -2,16 +2,19 @@
<div class="stachart">
<Row :gutter="16">
<Col :span="8" style="padding-right:50px;">
<div class="row_head">
<div class="row_head" v-if="setStatistics?false:true">
<Icon type="ios-images" class="f20" />
<span class="ml10">年度计划各产品类型总数量和各状态数量</span>
</div>
<div class="echarts-map">
<v-chart :options="braking" />
<v-chart
:options="braking"
:style="setStatistics?{width:'350px',height:'300px'}:{width:'100%',height:'100%'}"
/>
</div>
</Col>
<Col :span="16" style="padding-right:20px;">
<Row :gutter="16" class="row_head">
<Row :gutter="16" class="row_head" v-if="setStatistics?false:true">
<Col span="7">
<Icon type="ios-images" class="f20" />
<span class="ml10">各车间计划执行状态的详细情况</span>
......@@ -29,7 +32,10 @@
</Col>
</Row>
<div class="echarts-map">
<v-chart :options="braking1" />
<v-chart
:options="braking1"
:style="setStatistics?{width:'800px',height:'300px'}:{width:'100%',height:'100%'}"
/>
</div>
</Col>
</Row>
......@@ -50,6 +56,9 @@ export default {
components: {
"v-chart": ECharts,
},
props: {
setStatistics: Boolean,
},
data() {
return {
value2: "",
......@@ -57,6 +66,7 @@ export default {
braking1: {},
};
},
created() {},
mounted() {
this.statistics();
this.statistics1();
......@@ -183,7 +193,7 @@ export default {
],
type: "bar",
barWidth: 10, //柱图宽度
barGap: "-20%", //柱图间距
barGap: "10%", //柱图间距
},
],
};
......@@ -313,12 +323,16 @@ export default {
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.16);
border-radius: 8px;
padding: 10px;
.echarts-map {
width: 100%;
height: 300px;
.echarts {
height: 300px;
width: 100%;
height: 100%;
div {
width: 100%;
height: 100%;
}
}
}
.row_head {
......
pages/home/component/suspendChart.vue
View file @ 6eae1e16
<template>
<div class="stachart">
<div class="row_head">
<div class="stachart" :style="setStatistics?{width:'620px',height:'300px'}:{width:'100%',height:'100%'}">
<div class="row_head" v-if="setStatistics?false:true">
<Icon type="ios-images" class="f20" />
<span class="ml10">暂停任务统计</span>
</div>
<div class="echarts-map">
<v-chart :options="braking" />
<v-chart :options="braking" />
</div>
</div>
</template>
......@@ -24,6 +24,9 @@ export default {
components: {
"v-chart": ECharts,
},
props: {
setStatistics: Boolean,
},
data() {
return {
value2: "",
......@@ -190,7 +193,8 @@ export default {
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.16);
border-radius: 8px;
padding: 10px;
width: 100%;
margin: 0 auto;
.echarts-map {
width: 100%;
height: 300px;
......
pages/home/component/unqualifiedEcharts.vue
View file @ 6eae1e16
<template>
<div class="stachart">
<div :gutter="16" class="row_head">
<div :gutter="16" class="row_head" v-if="setStatistics?false:true">
<Icon type="ios-images" class="f20" />
<span class="ml10">不合格品审理单统计</span>
</div>
<Row :gutter="16">
<Col :span="8" style="padding-right:50px;">
<div class="echarts-map">
<v-chart :options="braking" />
<v-chart
:options="braking"
:style="setStatistics?{width:'400px',height:'300px'}:{width:'100%',height:'100%'}"
/>
</div>
</Col>
<Col :span="16">
......@@ -33,6 +36,9 @@ export default {
components: {
"v-chart": ECharts,
},
props: {
setStatistics: Boolean,
},
data() {
return {
value2: "",
......@@ -111,7 +117,7 @@ export default {
},
legend: {
orient: "vertical",
right: 10,
right: 0,
bottom: 10,
data: ["一车间", "三车间", "五车间", "六车间"],
},
......@@ -194,8 +200,8 @@ export default {
text-align: right;
}
}
.table-b{
margin-top:10px;
.table-b {
margin-top: 10px;
}
}
</style>
\ No newline at end of file
pages/home/component/workChart.vue
View file @ 6eae1e16
<template>
<div class="stachart">
<div :gutter="16" class="row_head">
<div
class="stachart"
:style="setStatistics?{width:'620px',height:'300px'}:{width:'100%',height:'100%'}"
>
<div :gutter="16" class="row_head" v-if="setStatistics?false:true">
<Icon type="ios-images" class="f20" />
<span class="ml10">工单任务状态分布</span>
</div>
<div class="echarts-map">
<v-chart :options="braking"/>
<v-chart :options="braking" />
</div>
</div>
</template>
......@@ -24,6 +27,9 @@ export default {
components: {
"v-chart": ECharts,
},
props: {
setStatistics: Boolean,
},
data() {
return {
value2: "",
......@@ -292,10 +298,13 @@ export default {
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.16);
border-radius: 8px;
padding: 10px;
width: 100%;
margin: 0 auto;
.echarts-map {
width: 100%;
height: 300px;
// margin: 0 auto;
// text-align: center;
.echarts {
height: 280px;
}
......
pages/home/index.vue
View file @ 6eae1e16
......@@ -55,49 +55,74 @@
<UnreadMessage />
</Col>
</Row>
<div class="table title-r">
<a class="a-r" @click="set">
<div class="table title-r" v-if="show">
<a class="a-r" @click="set(show)">
<Icon type="md-settings" class="f20" />
</a>
<StaChart />
</div>
<div class="table title-r">
<div class="table title-r" v-if="show1">
<a class="a-r" @click="set">
<Icon type="md-settings" class="f20" />
</a>
<UnqualifiedEcharts />
</div>
<Row class="table title-r" :gutter="16">
<Col :span="8" class="title-r">
<a class="a-r" @click="set">
<Col :span="8" class="title-r" v-if="show2">
<a class="a-r" @click="set(show2)">
<Icon type="md-settings" class="f20" />
</a>
<WorkChart />
</Col>
<Col :span="8" class="title-r">
<Col :span="8" class="title-r" v-if="show3">
<a class="a-r" @click="set">
<Icon type="md-settings" class="f20" />
</a>
<SuspendChart />
</Col>
<Col :span="8" class="title-r">
<Col :span="8" class="title-r" v-if="show4">
<a class="a-r" @click="set">
<Icon type="md-settings" class="f20" />
</a>
<MaterielChart />
</Col>
</Row>
<Modal v-model="modal1" title="统计列表显示设置" width="1300" footer-hide>
<Divider>生产计划状态监控</Divider>
<StaChart />
<Divider>不合格品审理单统计</Divider>
<UnqualifiedEcharts />
<Divider>班组工单监控</Divider>
<WorkChart />
<Divider>暂停任务统计</Divider>
<SuspendChart />
<Divider>物料相关统计</Divider>
<MaterielChart />
<Modal v-model="modal1" title="统计列表显示设置" width="1300" footer-hide>
<Divider>
<span style="color: #2680eb;">
生产计划状态监控
<Icon :type="show?'md-eye':'md-eye-off'" @click="clickEye" />
</span>
</Divider>
<StaChart :setStatistics="setStatistics" />
<Divider>
<span style="color: #2680eb;">
不合格品审理单统计
<Icon :type="show1?'md-eye':'md-eye-off'" @click="clickEye1" />
</span>
</Divider>
<UnqualifiedEcharts :setStatistics="setStatistics" />
<Divider>
<span style="color: #2680eb;">
班组工单监控
<Icon :type="show2?'md-eye':'md-eye-off'" @click="clickEye2" />
</span>
</Divider>
<WorkChart :setStatistics="setStatistics" />
<Divider>
<span style="color: #2680eb;">
暂停任务统计
<Icon :type="show3?'md-eye':'md-eye-off'" @click="clickEye3" />
</span>
</Divider>
<SuspendChart :setStatistics="setStatistics" />
<Divider>
<span style="color: #2680eb;">
物料相关统计
<Icon :type="show4?'md-eye':'md-eye-off'" @click="clickEye4" />
</span>
</Divider>
<MaterielChart :setStatistics="setStatistics" />
</Modal>
</div>
</template>
......@@ -131,6 +156,13 @@ export default {
userData: {},
avatorPath: "",
imgPath: true,
setStatistics: true,
show: true,
show1: false,
show2: false,
show3: false,
show4: false,
};
},
async fetch({ store, params }) {
......@@ -189,13 +221,23 @@ export default {
},
set() {
this.modal1 = true;
this.setStatistics = true;
},
clickEye() {
this.show = !this.show;
},
clickEye1() {
this.show1 = !this.show1;
},
clickEye2() {
this.show2 = !this.show2;
},
clickEye3() {
this.show3 = !this.show3;
},
clickEye4() {
this.show4 = !this.show4;
},
// ok() {
// this.$Message.info("Clicked ok");
// },
// cancel() {
// this.$Message.info("Clicked cancel");
// },
},
};
</script>
......@@ -330,12 +372,17 @@ export default {
}
.title-r {
position: relative;
// .echart-c {
// width: 600px;
// margin: auto;
// }
}
.a-r {
position: absolute;
top: 15px;
right: 15px;
z-index: 9999;
z-index: 100;
}
.set-p {
width: 100%;
......@@ -343,4 +390,4 @@ export default {
// text-align: center;
}
}
</style>
\ No newline at end of file
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment