修改界面显示

master
夜笙歌 12 months ago
parent c52384de3b
commit 04463db120

Binary file not shown.

After

Width:  |  Height:  |  Size: 13 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 689 KiB

@ -751,9 +751,9 @@ export default {
.meter {
position: absolute;
top: 19.7%;
left: 61.5%;
left: 62.2%;
transform: translateY(-50%);
font-size: 0.8vw;
font-size: 0.9vw;
color: #fff;
}
</style>

@ -677,7 +677,7 @@ export default {
top: 19.7%;
left: 62.5%;
transform: translateY(-50%);
font-size: 0.8vw;
font-size: 0.9vw;
color: #fff;
}
</style>

@ -7,9 +7,9 @@
</div>
<div class="loss">{{loss}}</div>
<div class="meter">{{meter}}</div>
<span style="position: absolute;top: 10%;left: 14%;color: #fff;font-size: 1vw;">目标1000&nbsp;&nbsp;进度目标1000&nbsp;&nbsp;实际1000&nbsp;&nbsp;差异0&nbsp;&nbsp;达成率100% </span>
<span style="position: absolute;top: 54.3%;left: 19%;color: #fff;font-size: 1vw">目标3% &nbsp;&nbsp;&nbsp;实际1% &nbsp;&nbsp;&nbsp;累计不良数1</span>
<span style="position: absolute;top: 54.3%;left: 66.7%;color: #CFD2D0;font-size: 1.0vw">合计111</span>
<span style="position: absolute;top: 10%;left: 14%;color: #fff;font-size: 0.9vw;">目标1000&nbsp;&nbsp;进度目标1000&nbsp;&nbsp;实际1000&nbsp;&nbsp;差异0&nbsp;&nbsp;达成率100% </span>
<span style="position: absolute;top: 54.3%;left: 19%;color: #fff;font-size: 0.9vw">目标3% &nbsp;&nbsp;&nbsp;实际1% &nbsp;&nbsp;&nbsp;累计不良数1</span>
<span style="position: absolute;top: 54.3%;left: 66.7%;color: #CFD2D0;font-size: 0.9vw">合计111</span>
<div class="scrollTable">
<div style="background-color: #094170">

@ -12,9 +12,9 @@
<div class="classSelect">
<el-button :class="nowLine === 1 ? 'clickLine':''" @click="setLine(1)">线1</el-button>
<el-button :class="nowLine === 2 ? 'clickLine':''" @click="setLine(2)">线2</el-button>
<el-button :class="nowLine === 3 ? 'clickLine':''" @click="setLine(3)"></el-button>
<el-button :class="nowLine === 1 ? 'clickLine':''" @click="setLine(1)" size="mini">产线1</el-button>
<el-button :class="nowLine === 2 ? 'clickLine':''" @click="setLine(2)" size="mini">产线2</el-button>
<el-button :class="nowLine === 3 ? 'clickLine':''" @click="setLine(3)" size="mini">合并</el-button>
<!-- <el-radio v-model="selectValue" label="1">线1</el-radio>-->
<!-- <el-radio v-model="selectValue" label="2">线2</el-radio>-->
<!-- <el-radio v-model="selectValue" label="3"></el-radio>-->
@ -226,7 +226,7 @@ export default {
},
show: true,
},
data: ['人A', '人B', '人C', '人D', '人E', '人F', '人G', '人H'],
data: ['组A', '组B', '组C', '组D', '组E', '组F', '组G', '组H'],
type: 'category',
},
yAxis: {
@ -1181,26 +1181,26 @@ export default {
.totalNum {
position: absolute;
top: 11.5%;
top: 11.3%;
left: 18%;
transform: translateY(-50%);
color: #fff;
font-size: 0.8vw;
font-size: 0.9vw;
}
.info1 {
position: absolute;
top: 11.5%;
top: 11.3%;
left: 44.5%;
transform: translateY(-50%);
color: #fff;
font-size: 0.8vw;
font-size: 1vw;
}
.classSelect {
position: absolute;
top: 5%;
left: 9%;
top: 6.5%;
left: 4%;
}
.el-radio {

File diff suppressed because it is too large Load Diff

@ -41,13 +41,13 @@
</div>
</el-col>
<el-col :span="3">
<div class="toolItem" @click="click1('质量')">
<div class="toolItem" @click="click1('quality')">
<i class="el-icon-s-tools" style="font-size:2.2vw"></i>
<div class="grid-content bg-purple-light">质量</div>
</div>
</el-col>
<el-col :span="3">
<div class="toolItem" @click="click1('厂房视角')">
<div class="toolItem" @click="click1('equipment')">
<i class="el-icon-s-tools" style="font-size:2.2vw"></i>
<div class="grid-content bg-purple-light">设备</div>
</div>
@ -70,13 +70,19 @@
<transition name="children">
<live :exit="exit" v-if="show === 'live'"/>
</transition>
<transition name="children">
<quality :exit="exit" v-if="show === 'quality'"/>
</transition>
<transition name="children">
<equipment :exit="exit" v-if="show === 'equipment'"/>
</transition>
<div class="flowChart" v-show="show1">
<div class="flowItem" v-for="(i,k) in flowItemOptions" @click="setNowFlowIndex(k)"
:class="nowFlowIndex === k ? 'wireAnimation' : ''"
:style="`width:${i.width}vw;height:${i.height}vw;top:${i.top}%;left:${i.left}%;background: linear-gradient(to bottom, ${nowFlowIndex === k ? '#00911F': i.bgColor+'66'}, ${nowFlowIndex === k ? '#00370C': i.bgColor});z-index:2;`">
<span>{{ i.text }}</span>
:style="`width:${i.width}vw;height:${i.height}vw;top:${i.top}%;left:${i.left}%;background: linear-gradient(to bottom, ${nowFlowIndex === k ? '#00911F': i.bgColor+'99'}, ${nowFlowIndex === k ? '#00370C': i.bgColor});z-index:2;`">
<span v-html="i.text"></span>
</div>
<div class="wire" v-for="i in wireOptions"
:style="`width:${i.width}vw;height:${i.height}vw;top:${i.top}%;left:${i.left}%;background-color:${i.bgColor};z-index:0;`"></div>
@ -97,6 +103,8 @@ import productDistribution from './productDistribution'
import dataCentre from './dataCentre'
import production from './production'
import live from './live'
import quality from './quality'
import equipment from './equipment'
const isAMRT = () => {
return new Promise((resolve, reject) => {
@ -118,7 +126,9 @@ export default {
productDistribution,
dataCentre,
production,
live
live,
quality,
equipment
},
data() {
return {
@ -133,15 +143,15 @@ export default {
left: 1,
width: 6,
height: 4,
bgColor: '#00aa00',
text: '内胆自助成型'
bgColor: '#2f5597',
text: '内胆<br>自动成型'
},
{
top: 2,
left: 9.3,
width: 6,
height: 4,
bgColor: '#00aa00',
bgColor: '#ed7d31',
text: '内胆预装'
},
{
@ -149,8 +159,8 @@ export default {
left: 17.6,
width: 6,
height: 4,
bgColor: '#00aa00',
text: '内胆集存库'
bgColor: '#7f7f7f',
text: '内胆<br>集存库'
},
//
@ -159,15 +169,15 @@ export default {
left: 1,
width: 6,
height: 4,
bgColor: '#00aa00',
text: '箱壳自动成型'
bgColor: '#2f5597',
text: '箱壳<br>自动成型'
},
{
top: 35,
left: 9.3,
width: 6,
height: 4,
bgColor: '#00aa00',
bgColor: '#ed7d31',
text: '箱壳预装'
},
{
@ -175,8 +185,8 @@ export default {
left: 17.6,
width: 6,
height: 4,
bgColor: '#00aa00',
text: '箱壳集存库'
bgColor: '#7f7f7f',
text: '箱壳<br>集存库'
},
//
@ -185,39 +195,39 @@ export default {
left: 25.9,
width: 6,
height: 4,
bgColor: '#00aa00',
text: '壳胆组装'
bgColor: '#f4b183',
text: '壳胆<br>组装'
},
{
top: 17,
left: 34.2,
width: 6,
height: 4,
bgColor: '#00aa00',
text: '箱体预装'
bgColor: '#7f7f7f',
text: '箱体<br>预装'
},
{
top: 17,
left: 42.5,
width: 6,
height: 4,
bgColor: '#00aa00',
text: '箱体发泡'
bgColor: '#00b050',
text: '箱体<br>发泡'
},
{
top: 17,
left: 50.8,
width: 6,
height: 4,
bgColor: '#00aa00',
text: '门体安装'
bgColor: '#f4b183',
text: '门体<br>安装'
},
{
top: 17,
left: 59.1,
width: 6,
height: 4,
bgColor: '#00aa00',
bgColor: '#7f7f7f',
text: '发泡箱体库'
},
{
@ -225,7 +235,7 @@ export default {
left: 67.4,
width: 6,
height: 4,
bgColor: '#00aa00',
bgColor: '#ffc000',
text: '焊接'
},
{
@ -233,24 +243,24 @@ export default {
left: 75.7,
width: 6,
height: 4,
bgColor: '#00aa00',
text: '抽空灌注'
bgColor: '#00b050',
text: '抽空<br>灌注'
},
{
top: 17,
left: 84,
width: 6,
height: 4,
bgColor: '#00aa00',
text: '性能检测'
bgColor: '#ffc000',
text: '性能<br>检测'
},
{
top: 17,
left: 92.3,
width: 6,
height: 4,
bgColor: '#00aa00',
text: '包装入库'
bgColor: '#f4b183',
text: '包装<br>入库'
},
//
@ -259,15 +269,15 @@ export default {
left: 1,
width: 6,
height: 4,
bgColor: '#00aa00',
text: '门壳自动成型'
bgColor: '#2f5597',
text: '门壳<br>自动成型'
},
{
top: 68,
left: 17.6,
width: 6,
height: 4,
bgColor: '#00aa00',
bgColor: '#ed7d31',
text: '门壳预装'
},
{
@ -275,16 +285,16 @@ export default {
left: 34.2,
width: 6,
height: 4,
bgColor: '#00aa00',
text: '门体发泡'
bgColor: '#00b050',
text: '门体<br>发泡'
},
{
top: 68,
left: 50.8,
width: 6,
height: 4,
bgColor: '#00aa00',
text: '箱、门匹配输送'
bgColor: '#7030a0',
text: '箱、门<br>匹配输送'
}
],
wireOptions: [
@ -637,8 +647,8 @@ export default {
.container {
width: 100vw;
//height: 33.33vw;
height: 100vh;
height: 33.33vw;
//height: 100vh;
}
.tool {
@ -664,8 +674,8 @@ export default {
.test {
//top: 20%;
width: 100vw;
//height: 33.33vw;
height: 100vh;
height: 33.33vw;
//height: 100vh;
position: absolute;
}

File diff suppressed because it is too large Load Diff
Loading…
Cancel
Save