yinq
/
zs_aucma-mes-ui
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge branch 'master' of http://175.27.215.92:3000/yinq/aucma-mes-ui

Browse Source
master
yinq 2 years ago
parent 1a259f26f9 d972ec86b7
commit c5f59d2984
7 changed files with 1166 additions and 157 deletions
Show Stats Download Patch File Download Diff File

328
public/data.json
Unescape Escape View File

@ -269,6 +269,302 @@
"value17": "100", "value17": "100",
"value18": "100", "value18": "100",
"value19": "100" "value19": "100"
},
{
"value1": "7",
"value2": "A-06",
"value3": "生产中",
"value4": "1000",
"value5": "1000%",
"value6": "100%",
"value7": "100",
"value8": "100",
"value9": "100",
"value10": "100",
"value11": "100",
"value12": "100",
"value13": "100",
"value14": "100",
"value15": "100",
"value16": "100",
"value17": "100",
"value18": "100",
"value19": "100"
},
{
"value1": "8",
"value2": "A-06",
"value3": "生产中",
"value4": "1000",
"value5": "1000%",
"value6": "100%",
"value7": "100",
"value8": "100",
"value9": "100",
"value10": "100",
"value11": "100",
"value12": "100",
"value13": "100",
"value14": "100",
"value15": "100",
"value16": "100",
"value17": "100",
"value18": "100",
"value19": "100"
},
{
"value1": "9",
"value2": "A-06",
"value3": "生产中",
"value4": "1000",
"value5": "1000%",
"value6": "100%",
"value7": "100",
"value8": "100",
"value9": "100",
"value10": "100",
"value11": "100",
"value12": "100",
"value13": "100",
"value14": "100",
"value15": "100",
"value16": "100",
"value17": "100",
"value18": "100",
"value19": "100"
},
{
"value1": "10",
"value2": "A-06",
"value3": "生产中",
"value4": "1000",
"value5": "1000%",
"value6": "100%",
"value7": "100",
"value8": "100",
"value9": "100",
"value10": "100",
"value11": "100",
"value12": "100",
"value13": "100",
"value14": "100",
"value15": "100",
"value16": "100",
"value17": "100",
"value18": "100",
"value19": "100"
}
],
"table31": [
{
"value1": "1",
"value2": "A-07",
"value3": "生产中",
"value4": "1000",
"value5": "1000%",
"value6": "100%",
"value7": "100",
"value8": "100",
"value9": "100",
"value10": "100",
"value11": "100",
"value12": "100",
"value13": "100",
"value14": "100",
"value15": "100",
"value16": "100",
"value17": "100",
"value18": "100",
"value19": "100"
},
{
"value1": "2",
"value2": "A-08",
"value3": "生产中",
"value4": "1000",
"value5": "1000%",
"value6": "100%",
"value7": "100",
"value8": "100",
"value9": "100",
"value10": "100",
"value11": "100",
"value12": "100",
"value13": "100",
"value14": "100",
"value15": "100",
"value16": "100",
"value17": "100",
"value18": "100",
"value19": "100"
},
{
"value1": "3",
"value2": "A-09",
"value3": "生产中",
"value4": "1000",
"value5": "1000%",
"value6": "100%",
"value7": "100",
"value8": "100",
"value9": "100",
"value10": "100",
"value11": "100",
"value12": "100",
"value13": "100",
"value14": "100",
"value15": "100",
"value16": "100",
"value17": "100",
"value18": "100",
"value19": "100"
},
{
"value1": "4",
"value2": "A-010",
"value3": "生产中",
"value4": "1000",
"value5": "1000%",
"value6": "100%",
"value7": "100",
"value8": "100",
"value9": "100",
"value10": "100",
"value11": "100",
"value12": "100",
"value13": "100",
"value14": "100",
"value15": "100",
"value16": "100",
"value17": "100",
"value18": "100",
"value19": "100"
},
{
"value1": "5",
"value2": "A-11",
"value3": "生产中",
"value4": "1000",
"value5": "1000%",
"value6": "100%",
"value7": "100",
"value8": "100",
"value9": "100",
"value10": "100",
"value11": "100",
"value12": "100",
"value13": "100",
"value14": "100",
"value15": "100",
"value16": "100",
"value17": "100",
"value18": "100",
"value19": "100"
},
{
"value1": "6",
"value2": "A-12",
"value3": "生产中",
"value4": "1000",
"value5": "1000%",
"value6": "100%",
"value7": "100",
"value8": "100",
"value9": "100",
"value10": "100",
"value11": "100",
"value12": "100",
"value13": "100",
"value14": "100",
"value15": "100",
"value16": "100",
"value17": "100",
"value18": "100",
"value19": "100"
},
{
"value1": "7",
"value2": "A-12",
"value3": "生产中",
"value4": "1000",
"value5": "1000%",
"value6": "100%",
"value7": "100",
"value8": "100",
"value9": "100",
"value10": "100",
"value11": "100",
"value12": "100",
"value13": "100",
"value14": "100",
"value15": "100",
"value16": "100",
"value17": "100",
"value18": "100",
"value19": "100"
},
{
"value1": "8",
"value2": "A-12",
"value3": "生产中",
"value4": "1000",
"value5": "1000%",
"value6": "100%",
"value7": "100",
"value8": "100",
"value9": "100",
"value10": "100",
"value11": "100",
"value12": "100",
"value13": "100",
"value14": "100",
"value15": "100",
"value16": "100",
"value17": "100",
"value18": "100",
"value19": "100"
},
{
"value1": "9",
"value2": "A-12",
"value3": "生产中",
"value4": "1000",
"value5": "1000%",
"value6": "100%",
"value7": "100",
"value8": "100",
"value9": "100",
"value10": "100",
"value11": "100",
"value12": "100",
"value13": "100",
"value14": "100",
"value15": "100",
"value16": "100",
"value17": "100",
"value18": "100",
"value19": "100"
},
{
"value1": "10",
"value2": "A-12",
"value3": "生产中",
"value4": "1000",
"value5": "1000%",
"value6": "100%",
"value7": "100",
"value8": "100",
"value9": "100",
"value10": "100",
"value11": "100",
"value12": "100",
"value13": "100",
"value14": "100",
"value15": "100",
"value16": "100",
"value17": "100",
"value18": "100",
"value19": "100"
} }
], ],
"table32": [ "table32": [
@ -399,6 +695,38 @@
"value19": "100" "value19": "100"
} }
], ],
"table33": [
{
"value1": "1",
"value2": "A-01",
"value3": "2023-01-01"
},
{
"value1": "2",
"value2": "A-02",
"value3": "2023-01-01"
},
{
"value1": "3",
"value2": "A-03",
"value3": "2023-01-01"
},
{
"value1": "4",
"value2": "A-04",
"value3": "2023-01-01"
},
{
"value1": "5",
"value2": "A-05",
"value3": "2023-01-01"
},
{
"value1": "6",
"value2": "A-06",
"value3": "2023-01-01"
}
],
"table4": [ "table4": [
{ {
"value1": "01", "value1": "01",

BIN
src/assets/board/caseShell2.jpg
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 849 KiB

128
src/views/board/caseShell/index2.vue
Unescape Escape View File

@ -9,7 +9,7 @@
:style="'top:'+(titlePosition[k]&&titlePosition[k].top||0)+'%;left:'+(titlePosition[k]&&titlePosition[k].left||0)+'%'"> :style="'top:'+(titlePosition[k]&&titlePosition[k].top||0)+'%;left:'+(titlePosition[k]&&titlePosition[k].left||0)+'%'">
{{ i }} {{ i }}
</div> </div>
<div class="meter">平均节拍：{{meter}}</div> <div class="meter">平均节拍：{{ meter }}</div>
<div class="scrollTable"> <div class="scrollTable">
<div style="background-color: #094170"> <div style="background-color: #094170">
@ -88,6 +88,9 @@
<div class="chart3"> <div class="chart3">
<Chart ref="chart3"></Chart> <Chart ref="chart3"></Chart>
</div> </div>
<div class="chart4">
<Chart ref="chart4"></Chart>
</div>
<div class="inventoryInfo">内胆库剩余:{{ linerNum }}% 箱壳库剩余:{{ caseNum }}%</div> <div class="inventoryInfo">内胆库剩余:{{ linerNum }}% 箱壳库剩余:{{ caseNum }}%</div>
</div> </div>
</template> </template>
@ -108,11 +111,12 @@ export default {
return { return {
linerNum: 50, linerNum: 50,
caseNum: 44, caseNum: 44,
meter:30, meter: 30,
title: [ title: [
'工单计划', '工单计划',
'小时统计', '小时统计',
'库存统计', '库存统计',
'型号统计',
'发泡夹具状态', '发泡夹具状态',
], ],
titlePosition: [ titlePosition: [
@ -125,12 +129,16 @@ export default {
left: 53 left: 53
}, },
{ {
top: 60, top: 70.5,
left: 5.5 left: 5.5
}, },
{ {
top: 60, top: 70.5,
left: 53 left: 36.7
},
{
top: 70.5,
left: 68.5
}, },
], ],
team: '白班', team: '白班',
@ -152,7 +160,7 @@ export default {
} }
}, },
mounted() { mounted() {
getData().then(e=>{ getData().then(e => {
this.scrollTableData = e.table1 this.scrollTableData = e.table1
this.$refs.chart1.setData({ this.$refs.chart1.setData({
tooltip: { tooltip: {
@ -271,7 +279,7 @@ export default {
containLabel: true, containLabel: true,
}, },
legend: { legend: {
data: e.chart2.y.map(val=>val.name), data: e.chart2.y.map(val => val.name),
right: 'center', right: 'center',
top: 0, top: 0,
textStyle: { textStyle: {
@ -357,6 +365,75 @@ export default {
], ],
}) })
this.$refs.chart3.setData({ this.$refs.chart3.setData({
tooltip: {
trigger: "axis",
axisPointer: {
// 坐标轴指示器，坐标轴触发有效
type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
},
},
grid: {
left: "0",
right: "4%",
bottom: "0",
top: 20,
containLabel: true,
},
xAxis: {
type: "category",
data: e.liner.inventoryStatistics.x,
axisLine: {
lineStyle: {
color: "white",
},
},
axisLabel: {
// interval: 0,
// rotate: 40,
textStyle: {
fontFamily: "Microsoft YaHei",
},
},
},
yAxis: {
type: "value",
axisLine: {
show: false,
lineStyle: {
color: "white",
},
},
splitLine: {
show: false,
},
axisLabel: {},
},
series: [
{
name: e.liner.inventoryStatistics.y.name,
type: "bar",
barWidth: "30%",
barMaxWidth: 50,
itemStyle: {
normal: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{
offset: 0,
color: "#4adfff",
},
{
offset: 1,
color: "#3d7aff",
},
]),
},
},
data: e.liner.inventoryStatistics.y.data,
},
],
})
this.$refs.chart4.setData({
legend: { legend: {
data: ['运行中'], data: ['运行中'],
right: 'center', right: 'center',
@ -443,7 +520,7 @@ export default {
</script> </script>
<style scoped> <style scoped>
.app-container { .app-container {
background-image: url("../../../assets/board/caseShell.jpg"); background-image: url("../../../assets/board/caseShell2.jpg");
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: 100% 100%; background-size: 100% 100%;
width: 100%; width: 100%;
@ -504,7 +581,7 @@ export default {
top: 23%; top: 23%;
left: 4%; left: 4%;
width: 45%; width: 45%;
height: 31% height: 18%;
} }
@ -517,43 +594,52 @@ export default {
text-overflow: ellipsis; text-overflow: ellipsis;
text-align: center; text-align: center;
display: inline-block; display: inline-block;
width:calc(100% / 7); width: calc(100% / 7);
} }
.chart1 { .chart1 {
position: absolute; position: absolute;
top: 23.5%; top: 23%;
left: 51%; left: 51%;
width: 45%; width: 45%;
height: 31%; height: 18.5%;
} }
.chart2 { .chart2 {
position: absolute; position: absolute;
top: 64%; top: 74%;
left: 3.6%; left: 3.6%;
width: 45.5%; width: 29.8%;
height: 30.7%; height: 20.7%;
} }
.chart3 { .chart3 {
position: absolute; position: absolute;
top: 64%; top: 74%;
left: 51%; left: 35%;
width: 45.5%; width: 30%;
height: 30.7%; height: 20.7%;
}
.chart4 {
position: absolute;
top: 74%;
left: 66.5%;
width: 30%;
height: 20.7%;
} }
.inventoryInfo { .inventoryInfo {
position: absolute; position: absolute;
transform: translateY(-50%); transform: translateY(-50%);
font-size: 0.9vw; font-size: 0.9vw;
top: 59.6%; top: 70.4%;
left: 13.7%; left: 13.7%;
color: #fff; color: #fff;
letter-spacing: 1px; letter-spacing: 1px;
} }
.meter{
.meter {
position: absolute; position: absolute;
top: 19.7%; top: 19.7%;
left: 61.5%; left: 61.5%;

4
src/views/board/foaming/index.vue
Unescape Escape View File

@ -484,8 +484,8 @@ export default {
}, 30 * 1000) }, 30 * 1000)
getData().then(e => { getData().then(e => {
this.scrollTableData = e.table2 this.scrollTableData = e.table2
this.scrollTableData1 = e.table3 this.scrollTableData1 = e.table3.slice(0,6)
this.scrollTableData2 = e.table32 this.scrollTableData2 = e.table32.slice(0,6)
this.$refs.chart1.setData({ this.$refs.chart1.setData({
tooltip: { tooltip: {
trigger: "axis", trigger: "axis",

586
src/views/board/foaming/index2.vue
Unescape Escape View File

@ -1,26 +1,23 @@
<template> <template>
<div class="app-container"> <div class="app-container">
<div class="headTitle">门体发泡可视化平台</div> <div class="headTitle">箱、门匹配生产数据监控平台</div>
<div class="topNum planNum">{{ planNum }}</div> <div class="topNum planNum">{{ planNum }}</div>
<div class="topNum practicalNum">{{ practicalNum }}</div> <div class="topNum practicalNum">{{ practicalNum }}</div>
<div class="topNum differenceValue">{{ differenceValue }}</div> <div class="topNum differenceValue">{{ differenceValue }}</div>
<div class="supplementInfo">注射压力标准范围：10.0-12.0Mpa A、B组份枪头压力差＜1Mpa</div>
<div class="supplementInfo1">发泡料温度标准范围:18.0-24.0℃</div>
<div class="scrollTable"> <div class="scrollTable">
<div style="background-color: #094170"> <div style="background-color: #094170">
<div class="scrollTableItem" style="font-weight: bold;width: 20%"> <div class="scrollTableItem" style="font-weight: bold;width: 33%;padding:4px 0 ">
序号
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 33%;padding:4px 0 ">
型号 型号
</div> </div>
<div class="scrollTableItem" style="font-weight: bold;width: 20%"> <div class="scrollTableItem" style="font-weight: bold;width: 33%;padding:4px 0 ">
计划数 扫描时间
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 20%">
完成数
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 20%">
差异数
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 20%">
执行进度
</div> </div>
</div> </div>
<vue-seamless-scroll <vue-seamless-scroll
@ -32,29 +29,20 @@
<div <div
v-for="(item, index) in scrollTableData" v-for="(item, index) in scrollTableData"
:key="index" :key="index"
> >
<div :style='"background-color:" + ((index % 2 === 0)? "#053460":"#032d57") '> <div :style='"background-color:" + ((index % 2 === 0)? "#053460":"#032d57") '>
<div <div
class="scrollTableItem" style="width: 20%"> class="scrollTableItem" style="width: 33%;padding:4px 0 ">
{{ item.value1 }} {{ item.value1 }}
</div> </div>
<div <div
class="scrollTableItem" style="width: 20%"> class="scrollTableItem" style="width: 33%;padding:4px 0 ">
{{ item.value2 }} {{ item.value2 }}
</div> </div>
<div <div
class="scrollTableItem" style="width: 20%"> class="scrollTableItem" style="width: 33%;padding:4px 0 ">
{{ item.value3 }} {{ item.value3 }}
</div> </div>
<div
class="scrollTableItem" style="width: 20%">
{{ item.value4 }}
</div>
<div
class="scrollTableItem" style="width: 20%">
{{ item.value5 }}
</div>
</div> </div>
</div> </div>
</vue-seamless-scroll> </vue-seamless-scroll>
@ -71,8 +59,9 @@
<div class="chart4"> <div class="chart4">
<Chart ref="chart4"></Chart> <Chart ref="chart4"></Chart>
</div> </div>
<div class="scrollTable1"> <transition name="table1">
<div style="background-color: #094170"> <div class="scrollTable1" v-if="show === 0">
<div style="background-color: #094170; height: calc(25vh/11)">
<div class="scrollTableItem" style="font-weight: bold;width: 5%"> <div class="scrollTableItem" style="font-weight: bold;width: 5%">
工位 工位
</div> </div>
@ -131,16 +120,16 @@
18:30 18:30
</div> </div>
</div> </div>
<vue-seamless-scroll <!-- <vue-seamless-scroll-->
:class-option="scrollTableOption" <!-- :class-option="scrollTableOption"-->
:data="scrollTableData1" <!-- :data="scrollTableData1"-->
class="case-item" <!-- class="case-item"-->
style="height: 84%;overflow: hidden;" <!-- style="height: 84%;overflow: hidden;"-->
> <!-- >-->
<div <div
v-for="(item, index) in scrollTableData1" v-for="(item, index) in scrollTableData1"
:key="index" :key="index"
style="height: calc(25vh/11)"
> >
<div :style='"background-color:" + ((index % 2 === 0)? "#053460":"#032d57") '> <div :style='"background-color:" + ((index % 2 === 0)? "#053460":"#032d57") '>
<div <div
@ -221,8 +210,471 @@
</div> </div>
</div> </div>
</div> </div>
</vue-seamless-scroll> <!-- </vue-seamless-scroll>-->
</div> </div>
</transition>
<transition name="table1">
<div class="scrollTable1" v-if="show === 1">
<div style="background-color: #094170;height: calc(25vh/11)">
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
工位
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 8%">
型号
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
状态
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
目标
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
计划
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
累计
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 7%">
达成率
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
7:30
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
8:30
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
9:30
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
10:30
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
11:30
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
12:30
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
13:30
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
14:30
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
15:30
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
16:30
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
17:30
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
18:30
</div>
</div>
<!-- <vue-seamless-scroll-->
<!-- :class-option="scrollTableOption"-->
<!-- :data="scrollTableData1"-->
<!-- class="case-item"-->
<!-- style="height: 84%;overflow: hidden;"-->
<!-- >-->
<div
v-for="(item, index) in scrollTableData2"
:key="index"
style="height: calc(25vh/11)"
>
<div :style='"background-color:" + ((index % 2 === 0)? "#053460":"#032d57") '>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value1 }}
</div>
<div
class="scrollTableItem" style="width: 8%">
{{ item.value2 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value3 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value4 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value5 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value6 }}
</div>
<div
class="scrollTableItem" style="width: 7%">
{{ item.value7 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value8 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value9 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value10 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value11 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value12 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value13 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value14 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value15 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value16 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value17 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value18 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value19 }}
</div>
</div>
</div>
<!-- </vue-seamless-scroll>-->
</div>
</transition>
<transition name="table1">
<div class="scrollTable1" v-if="show === 2">
<div style="background-color: #094170; height: calc(25vh/11)">
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
工位
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 8%">
型号
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
状态
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
目标
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
计划
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
累计
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 7%">
达成率
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
7:30
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
8:30
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
9:30
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
10:30
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
11:30
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
12:30
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
13:30
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
14:30
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
15:30
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
16:30
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
17:30
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
18:30
</div>
</div>
<!-- <vue-seamless-scroll-->
<!-- :class-option="scrollTableOption"-->
<!-- :data="scrollTableData1"-->
<!-- class="case-item"-->
<!-- style="height: 84%;overflow: hidden;"-->
<!-- >-->
<div
v-for="(item, index) in scrollTableData1"
:key="index"
style="height: calc(25vh/11)"
>
<div :style='"background-color:" + ((index % 2 === 0)? "#053460":"#032d57") '>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value1 }}
</div>
<div
class="scrollTableItem" style="width: 8%">
{{ item.value2 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value3 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value4 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value5 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value6 }}
</div>
<div
class="scrollTableItem" style="width: 7%">
{{ item.value7 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value8 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value9 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value10 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value11 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value12 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value13 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value14 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value15 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value16 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value17 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value18 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value19 }}
</div>
</div>
</div>
<!-- </vue-seamless-scroll>-->
</div>
</transition>
<transition name="table1">
<div class="scrollTable1" v-if="show === 3">
<div style="background-color: #094170;height: calc(25vh/11)">
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
工位
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 8%">
型号
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
状态
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
目标
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
计划
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
累计
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 7%">
达成率
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
7:30
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
8:30
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
9:30
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
10:30
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
11:30
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
12:30
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
13:30
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
14:30
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
15:30
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
16:30
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
17:30
</div>
<div class="scrollTableItem" style="font-weight: bold;width: 5%">
18:30
</div>
</div>
<!-- <vue-seamless-scroll-->
<!-- :class-option="scrollTableOption"-->
<!-- :data="scrollTableData1"-->
<!-- class="case-item"-->
<!-- style="height: 84%;overflow: hidden;"-->
<!-- >-->
<div
v-for="(item, index) in scrollTableData2"
:key="index"
style="height: calc(25vh/11)"
>
<div :style='"background-color:" + ((index % 2 === 0)? "#053460":"#032d57") '>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value1 }}
</div>
<div
class="scrollTableItem" style="width: 8%">
{{ item.value2 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value3 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value4 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value5 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value6 }}
</div>
<div
class="scrollTableItem" style="width: 7%">
{{ item.value7 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value8 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value9 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value10 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value11 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value12 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value13 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value14 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value15 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value16 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value17 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value18 }}
</div>
<div
class="scrollTableItem" style="width: 5%">
{{ item.value19 }}
</div>
</div>
</div>
<!-- </vue-seamless-scroll>-->
</div>
</transition>
<div class="total"> <div class="total">
<div style="background-color: #094170"> <div style="background-color: #094170">
<div class="scrollTableItem" style="font-weight: bold;width: 5%"> <div class="scrollTableItem" style="font-weight: bold;width: 5%">
@ -300,6 +752,7 @@ export default {
name: "Liner", name: "Liner",
data() { data() {
return { return {
show: 0,
planNum: 1000, planNum: 1000,
practicalNum: 1000, practicalNum: 1000,
differenceValue: 1000, differenceValue: 1000,
@ -315,12 +768,17 @@ export default {
}, },
scrollTableData: [], scrollTableData: [],
scrollTableData1: [], scrollTableData1: [],
scrollTableData2: [],
} }
}, },
mounted() { mounted() {
getData().then(e=>{ let timeInter = setInterval(() => {
this.scrollTableData = e.table2 this.show = (this.show + 1) % 4
}, 10 * 1000)
getData().then(e => {
this.scrollTableData = e.table33
this.scrollTableData1 = e.table3 this.scrollTableData1 = e.table3
this.scrollTableData2 = e.table31
this.$refs.chart1.setData({ this.$refs.chart1.setData({
tooltip: { tooltip: {
trigger: "axis", trigger: "axis",
@ -337,7 +795,7 @@ export default {
containLabel: true, containLabel: true,
}, },
legend: { legend: {
data: e.chart5.y.map(val=>val.name), data: e.chart5.y.map(val => val.name),
right: 'center', right: 'center',
top: 0, top: 0,
textStyle: { textStyle: {
@ -515,7 +973,7 @@ export default {
}) })
this.$refs.chart3.setData({ this.$refs.chart3.setData({
legend: { legend: {
data: e.chart6.y.map(val=>val.name), data: e.chart6.y.map(val => val.name),
right: 'center', right: 'center',
top: 0, top: 0,
textStyle: { textStyle: {
@ -563,6 +1021,7 @@ export default {
}, },
xAxis: [ xAxis: [
{ {
show: false,
type: "category", type: "category",
axisLine: { axisLine: {
show: true, show: true,
@ -588,8 +1047,8 @@ export default {
yAxis: [ yAxis: [
{ {
type: "value", type: "value",
min: 0, min: 18,
// max: 140, max: 24,
splitNumber: 4, splitNumber: 4,
splitLine: { splitLine: {
show: true, show: true,
@ -616,9 +1075,7 @@ export default {
{ {
name: e.chart6.y[0].name, name: e.chart6.y[0].name,
type: "line", type: "line",
// smooth: true, //是否平滑
showAllSymbol: true, showAllSymbol: true,
// symbol: 'image://./static/images/guang-circle.png',
symbol: "circle", symbol: "circle",
symbolSize: 5, symbolSize: 5,
lineStyle: { lineStyle: {
@ -729,7 +1186,7 @@ export default {
}, },
xAxis: { xAxis: {
type: "category", type: "category",
data: e.chart7.x, data: e.chart3.x,
axisLine: { axisLine: {
lineStyle: { lineStyle: {
color: "white", color: "white",
@ -759,7 +1216,7 @@ export default {
}, },
series: [ series: [
{ {
name: e.chart7.y.name, name: e.chart3.y.name,
type: "bar", type: "bar",
barWidth: "33%", barWidth: "33%",
label: { label: {
@ -784,7 +1241,7 @@ export default {
borderRadius: 2, borderRadius: 2,
}, },
}, },
data: e.chart7.y.data, data: e.chart3.y.data,
}, },
], ],
}) })
@ -852,7 +1309,7 @@ export default {
.scrollTableItem { .scrollTableItem {
color: rgb(185, 186, 192); color: rgb(185, 186, 192);
margin: auto 0px; margin: auto 0px;
padding: 4px 0; padding: 0 0;
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
@ -908,4 +1365,39 @@ export default {
width: 68%; width: 68%;
height: 3%; height: 3%;
} }
.table1-enter-active {
animation: table-in .5s;
}
.table1-leave-active {
animation: table-in .5s reverse;
}
@keyframes table-in {
0% {
opacity: 0;
transform: scale(0);
}
100% {
opacity: 1;
transform: scale(1);
}
}
.supplementInfo {
position: absolute;
top: 35.5%;
left: 73.6%;
font-size: 0.7vw;
color: #fff;
}
.supplementInfo1 {
position: absolute;
top: 59%;
left: 73.6%;
font-size: 0.7vw;
color: #fff;
}
</style> </style>

98
src/views/board/week/index.vue
Unescape Escape View File

@ -98,6 +98,9 @@
<div class="equipmentPowerFive" id="equipmentPowerFive"> <div class="equipmentPowerFive" id="equipmentPowerFive">
<Chart ref="equipmentPowerFive"></Chart> <Chart ref="equipmentPowerFive"></Chart>
</div> </div>
<div class="equipmentPowerSix" id="equipmentPowerSix">
<Chart ref="equipmentPowerSix"></Chart>
</div>
<div class="topLeft" id="topLeft"> <div class="topLeft" id="topLeft">
@ -915,7 +918,7 @@ export default {
"{a|" + "{a|" +
params.value + params.value +
"%}" + "%}" +
"\n{b|终检}" "\n{b|测温}"
); );
}, },
position: "center", position: "center",
@ -951,6 +954,85 @@ export default {
}, },
], ],
}) })
this.$refs.equipmentPowerSix.setData({
series: [
{
type: "pie",
clockWise: false,
radius: ['60%', '75%'],
itemStyle: {
normal: {
label: {
show: false,
},
labelLine: {
show: false,
},
shadowBlur: 0,
shadowColor: "#5d73ff",
},
},
hoverAnimation: false,
center: ["50%", "50%"],
data: [
{
value: 50,
label: {
normal: {
rich: {
a: {
color: "#5d73ff",
align: "center",
fontSize: 1.1 * vw,
fontWeight: "bold",
},
b: {
color: "#fff",
align: "center",
fontSize: 0.5 * vw,
},
},
formatter: function (params) {
return (
"{a|" +
params.value +
"%}" +
"\n{b|终检}"
);
},
position: "center",
show: true,
textStyle: {
fontSize: "14",
fontWeight: "normal",
color: "#fff",
},
},
},
itemStyle: {
normal: {
color: "#5d73ff",
shadowColor: "#5d73ff",
shadowBlur: 0,
},
},
},
{
value: 50,
name: "invisible",
itemStyle: {
normal: {
color: "#412a4e",
},
emphasis: {
color: "#412a4e",
},
},
},
],
},
],
})
this.day() this.day()
}, },
methods: { methods: {
@ -1059,7 +1141,7 @@ export default {
.equipmentPowerFour { .equipmentPowerFour {
position: absolute; position: absolute;
width: 19%; width: 13%;
height: 16%; height: 16%;
top: 76%; top: 76%;
left: 30.5%; left: 30.5%;
@ -1067,10 +1149,18 @@ export default {
.equipmentPowerFive { .equipmentPowerFive {
position: absolute; position: absolute;
width: 19%; width: 13%;
height: 16%; height: 16%;
top: 76%; top: 76%;
left: 49.5%; left: 43.5%;
}
.equipmentPowerSix {
position: absolute;
width: 13%;
height: 16%;
top: 76%;
left: 56.5%;
} }
.scrollTableItem { .scrollTableItem {

59
src/views/model/model.vue
Unescape Escape View File

@ -109,24 +109,28 @@ export default {
appsecret: 'rXmhoLAiOPNKzbl7g2qxCV8tFwRdYuZM' appsecret: 'rXmhoLAiOPNKzbl7g2qxCV8tFwRdYuZM'
} }
const viewer = new AMRT.Viewer('container', param) const viewer = new AMRT.Viewer('container', param)
console.log(AMRT) console.log(viewer)
console.log(viewer.core)
console.log(viewer.core?.Object3D)
// const gui = new dat.GUI()
// console.log(gui)
let num = 0 let num = 0
let modelArr = [ let modelArr = [
// '1720315475507941376', '1720315475507941376',
// '1720315479907766272', '1720315479907766272',
// '1720315484513112064', '1720315484513112064',
// '1720315500866703360', '1720315500866703360',
// '1720315558030872576', '1720315558030872576',
// '1720315596551360512', '1720315596551360512',
// '1720315644550975488', '1720315644550975488',
// '1720315648946606080', '1720315648946606080',
// '1720315687114772480', '1720315687114772480',
// '1720315691422322688', '1720315691422322688',
// '1720315722275622912', '1720315722275622912',
// '1720315729129115648', '1720315729129115648',
// '1720315768454909952', '1720315768454909952',
// '1720316275214913536', '1720316275214913536',
// '1720316297822212096', '1720316297822212096',
] ]
modelArr.forEach(e => { modelArr.forEach(e => {
let model = viewer.loadModel(e, { let model = viewer.loadModel(e, {
@ -139,21 +143,30 @@ export default {
alert('加载完成'); alert('加载完成');
} }
m.on('click', function () { m.on('click', function () {
// console.log(this) console.log(m)
// console.log(m) console.log(e)
// let clickModel = model.getObjectById(this) console.log(m.getObjectById)
// console.log(clickModel)
// alert(`${e}`)
// viewer.operator.restore()
// viewer.operator.translucenceOthers(this.viewer)
}) })
} }
}) })
}) })
// viewer.container.addEventListener( 'click', e => {
// //通过鼠标拾取模型对象
// let object = viewer.picker.intersectObject( e )
// if( object ){
// console.log( '当前选中模型', object.object )
// viewer.operator.restore()
// viewer.operator.translucenceOthers(object)
// viewer.operator.translucenceOthers(object.object)
// }
// })
viewer.controls.setTarget(26.3, -19.8, -82) viewer.controls.setTarget(26.3, -19.8, -82)
viewer.controls.setPosition(31, 1721, 584) viewer.controls.setPosition(31, 1721, 584)
viewer.operator.enabled = true viewer.operator.enabled = true
// 灯光
viewer.sceneManager.setLightness(1)
// viewer.controls.startAutoRotate(1) // viewer.controls.startAutoRotate(1)
}, },
methods: { methods: {

Write Preview
Loading…
Cancel
Save