williamet/vis389
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

质量管理

Browse Source
This commit is contained in:
熊丽君
2021-12-10 19:19:57 +08:00
parent 3559204535
commit 2c509f3c1c
43 changed files with 4049 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

239
src/views/bigScreen/qualityManage/center2.vue Normal file
View File

@ -0,0 +1,239 @@
<template>
<div>
<center2 title="关键参数SPC分析">
<el-select v-model="value" slot="datePicker" size="mini" placeholder="请选择"> </el-select>
<div style="height: 100%; width: 100%" ref="chart"></div>
</center2>
</div>
</template>
<script>
import center2 from './components/center2/index.vue'
import rocketTit from '../components/rocketTit/index.vue'
import bigScreenTabs from '../components/bigScreenTabs/index.vue'
import echarts from 'echarts'
require('echarts/theme/macarons') // echarts theme
import resize from '../../dashboard/mixins/resize'
export default {
mixins: [resize],
name: 'left1',
components: {
center2,
rocketTit,
bigScreenTabs,
},
data() {
return {
value: '',
chart: null,
}
},
mounted() {
this.$nextTick(() => {
this.initChart()
})
},
beforeDestroy() {},
methods: {
initChart() {
this.chart = echarts.init(this.$refs.chart)
this.setOptions()
},
setOptions() {
this.chart.setOption({
legend: {
data: ['X管制图', 'R管制图'],
textStyle: {
color: '#fff',
},
},
grid: {
left: '3%',
right: '6%',
bottom: '3%',
containLabel: true,
},
xAxis: [
{
type: 'category',
data: [
'产品实物一',
'产品实物一',
'产品实物一',
'产品实物一',
'产品实物一',
'产品实物一',
'产品实物一',
'产品实物一',
'产品实物一',
'产品实物一',
'产品实物一',
'产品实物一',
],
axisPointer: {
type: 'shadow',
},
axisLine: {
lineStyle: {
color: 'rgb(255, 255, 255)',
},
},
},
],
yAxis: [
{
type: 'value',
name: '',
min: 0,
// max: 250,
// interval: 50,
axisLabel: {
formatter: '{value}',
},
splitLine: {
show: false, //不显示网格线
},
splitArea: {
show: false, //不显示网格区域
},
axisLine: {
lineStyle: {
color: 'rgb(255, 255, 255)',
},
},
},
{
type: 'value',
min: 0,
max: 0.8,
interval: 0.2,
axisLabel: {
formatter: '{value}',
},
splitLine: {
show: false, //不显示网格线
},
splitArea: {
show: false, //不显示网格区域
},
axisLine: {
lineStyle: {
color: 'rgb(255, 255, 255)',
},
},
},
],
grid: {
containLabel: true,
width: '99%',
left: 0,
top: 50,
bottom: 10,
},
// dataZoom: {},
series: [
{
name: 'R管制图',
type: 'line',
barWidth: 20,
data: [72.6, 75.9, 79.0, 26.4, 28.7, 70.7, 75.6, 82.2, 48.7, 18.8, 66.0, 62.3],
itemStyle: {
color: '#61DDAA',
},
symbol: 'none',
},
{
name: 'X管制图',
type: 'line',
smooth: false,
data: [2.0, 2.2, 3.3, 4.5, 6.3, 10.2, 20.3, 23.4, 30.0, 36.5, 42.0, 56.2],
itemStyle: {
color: '#7EA7FC',
},
symbol: 'none',
},
],
})
},
},
}
</script>
<style lang="scss" scoped>
.tit {
padding: 16px 24px;
}
.img {
position: absolute;
top: 0;
left: 0;
z-index: -1;
}
.warp-scroll {
height: 215px;
width: 100%;
margin: 0 auto;
overflow: hidden;
ul {
list-style: none;
padding: 0;
margin: 0 auto;
li,
a {
display: block;
display: flex;
justify-content: space-between;
font-size: 15px;
}
li {
display: block;
height: 42px;
line-height: 42px;
background: #2a437d;
opacity: 0.6;
// box-shadow: 0px 1px 0px 0px rgba(139, 177, 237, 0.5);
margin-bottom: 1px;
img {
vertical-align: sub;
margin-right: 5px;
}
}
}
}
.box {
display: flex;
justify-content: center;
align-items: center;
}
.warp {
height: 280px;
width: 440px;
margin: 0 auto;
overflow: hidden;
ul {
list-style: none;
padding: 0;
margin: 0 auto;
li,
a {
display: block;
display: flex;
justify-content: space-between;
font-size: 15px;
}
li {
display: block;
height: 30px;
line-height: 30px;
background: rgba(2, 18, 63, 0.33);
padding-left: 20px;
margin: 5px 0;
img {
vertical-align: sub;
margin-right: 5px;
}
}
}
}
</style>