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

修改界面显示

Browse Source
master
夜笙歌 1 year ago
parent 8b4c92b690
commit 56c7d8eb6f
5 changed files with 475 additions and 608 deletions
Show Stats Download Patch File Download Diff File

56
public/data.json
Unescape Escape View File

@ -1166,16 +1166,16 @@
],
"ImportAndExportStatistics": {
"x": [
"A-01",
"A-02",
"A-03",
"A-04",
"A-05",
"A-06",
"A-07",
"A-08",
"A-09",
"A-10"
"1时",
"2时",
"3时",
"4时",
"5时",
"6时",
"7时",
"8时",
"9时",
"10时"
],
"y": [
{
@ -1287,44 +1287,18 @@
},
"foamFixtureState": {
"x": [
"运行中",
"停止",
"故障"
"A",
"B",
"C"
],
"y": [
{
"name": "A",
"y": {
"name": "运行中",
"data": [
5,
1,
3
]
},
{
"name": "B",
"data": [
2,
5,
2
]
},
{
"name": "C",
"data": [
4,
3,
6
]
},
{
"name": "D",
"data": [
3,
8,
2
]
}
]
}
}
}

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

@ -9,6 +9,7 @@
:style="'top:'+(titlePosition[k]&&titlePosition[k].top||0)+'%;left:'+(titlePosition[k]&&titlePosition[k].left||0)+'%'">
{{ i }}
</div>
<div class="meter">平均节拍：{{meter}}</div>
<div class="scrollTable">
<div style="background-color: #094170">
@ -87,6 +88,7 @@
<div class="chart3">
<Chart ref="chart3"></Chart>
</div>
<div class="inventoryInfo">内胆库剩余:{{ linerNum }}% 箱壳库剩余:{{ caseNum }}%</div>
</div>
</template>
@ -104,9 +106,12 @@ export default {
name: "Liner",
data() {
return {
linerNum: 50,
caseNum: 44,
meter:30,
title: [
'工单计划',
'出入库统计',
'小时统计',
'库存统计',
'发泡夹具状态',
],
@ -353,7 +358,7 @@ export default {
})
this.$refs.chart3.setData({
legend: {
data: e.liner.foamFixtureState.y.map(val => val.name),
data: ['运行中'],
right: 'center',
top: 0,
textStyle: {
@ -407,11 +412,11 @@ export default {
},
axisLabel: {},
},
series: e.liner.foamFixtureState.y.map(val => {
return {
name: val.name,
series: [
{
name: e.liner.foamFixtureState.y.name,
type: "bar",
barWidth: 100 / (e.liner.foamFixtureState.y.length + 2) + "%",
barWidth: '30%',
barMaxWidth: 50,
itemStyle: {
normal: {
@ -427,9 +432,9 @@ export default {
]),
},
},
data: val.data,
data: e.liner.foamFixtureState.y.data,
}
})
]
})
})
},
@ -538,4 +543,22 @@ export default {
width: 45.5%;
height: 30.7%;
}
.inventoryInfo {
position: absolute;
transform: translateY(-50%);
font-size: 0.9vw;
top: 59.6%;
left: 13.7%;
color: #fff;
letter-spacing: 1px;
}
.meter{
position: absolute;
top: 19.7%;
left: 61.5%;
transform: translateY(-50%);
font-size: 0.8vw;
color: #fff;
}
</style>

30
src/views/board/liner/index.vue
Unescape Escape View File

@ -72,6 +72,7 @@
</div>
</vue-seamless-scroll>
</div>
<div class="meter">平均节拍：{{meter}}</div>
<div class="chart1">
<Chart ref="chart1"></Chart>
</div>
@ -102,12 +103,13 @@ export default {
data() {
return {
title: [
'工单计划',
'出入库统计',
'箱壳生产计划',
'小时入库统计',
'库存状态',
'泡前库库存统计',
'发泡夹具状态',
'箱体发泡实时状态',
],
meter:30,
linerNum: 50,
caseNum: 44,
titlePosition: [
@ -426,7 +428,7 @@ export default {
})
this.$refs.chart4.setData({
legend: {
data: e.liner.foamFixtureState.y.map(val => val.name),
data: ['运行中'],
right: 'center',
top: 0,
textStyle: {
@ -480,11 +482,11 @@ export default {
},
axisLabel: {},
},
series: e.liner.foamFixtureState.y.map(val => {
return {
name: val.name,
series: [
{
name: e.liner.foamFixtureState.y.name,
type: "bar",
barWidth: 100 / (e.liner.foamFixtureState.y.length + 2) + "%",
barWidth: '30%',
barMaxWidth: 50,
itemStyle: {
normal: {
@ -500,9 +502,9 @@ export default {
]),
},
},
data: val.data,
data: e.liner.foamFixtureState.y.data,
}
})
]
})
})
},
@ -641,4 +643,12 @@ export default {
color: #fff;
letter-spacing: 1px;
}
.meter{
position: absolute;
top: 19.7%;
left: 62.5%;
transform: translateY(-50%);
font-size: 0.8vw;
color: #fff;
}
</style>

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

@ -9,6 +9,16 @@
<div class="manpowerAttendance" id="manpowerAttendance">
<Chart ref="manpowerAttendance"></Chart>
</div>
<div class="classSelect">
<el-select v-model="selectValue" placeholder="请选择">
<el-option
v-for="item in selectOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</div>
<!--IQC-->
<div class="IQC" id="IQC">
@ -95,6 +105,7 @@
</div>
<div v-html="safeDayHtml"></div>
<div class="totalNum">总数：{{ totalNum }}</div>
</div>
</template>
@ -112,14 +123,30 @@ export default {
name: "Liner",
data() {
return {
selectOptions: [
{
value: '1',
label: '老线'
},
{
value: '2',
label: '新线'
},
{
value: '3',
label: '合计'
},
],
selectValue: '1',
title: [
'产量统计',
'三日订单执行情况',
'班组 6s 排行榜',
'周生产型号统计',
'周质量分析',
'重点工序监控',
'安全生产',
],
totalNum: 10000,
titlePosition: [
{
top: 11.5,
@ -372,7 +399,7 @@ export default {
color: "#F1F1F3",
},
},
data: ['A-01', 'A-02', 'A-03', 'A-04', 'A-05', 'A-06', 'A-07']
data: ['1日', '2日', '3日', '4日', '5日', '6日', '7日']
}
],
yAxis: [
@ -527,585 +554,402 @@ export default {
},
],
})
this.$refs.equipmentPowerOne.setData({
grid: {
top: '28%',
left: '5%',
right: '5%',
bottom: '0%',
containLabel: true,
},
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'shadow',
label: {
show: true,
},
},
},
legend: {
top: '5%',
itemWidth: 20,
itemHeight: 10,
series: [
{
type: "pie",
clockWise: false,
radius: ['60%', '75%'],
itemStyle: {
borderWidth: 1,
borderHeight: 1,
normal: {
label: {
show: false,
},
formatter: function (val) {
return `${val} `
labelLine: {
show: false,
},
textStyle: {
fontSize: 0.75 * vw,
color: function () {
shadowBlur: 0,
shadowColor: "#389af4",
},
},
hoverAnimation: false,
center: ["50%", "50%"],
data: [
{
value: 50,
label: {
normal: {
rich: {
a: {
color: "#389af4",
align: "center",
fontSize: 1.1 * vw,
fontWeight: "bold",
},
b: {
color: "#fff",
align: "center",
fontSize: 0.5 * vw,
},
xAxis: {
type: 'category',
data: ["1月", "2月", "3月", "4月", "5月", "6月", "7月", "8月", "9月", "10月", "11月", "12月"],
axisLine: {
show: true,
},
axisTick: {
show: false,
formatter: function (params) {
return (
"{a|" +
params.value +
"%}" +
"\n{b|内胆检漏}"
);
},
axisLabel: {
position: "center",
show: true,
textStyle: {
color: '#ffffff', //X轴文字颜色
fontSize: "14",
fontWeight: "normal",
color: "#fff",
},
},
},
yAxis: [
{
name: '合格率',
min: (min - 2 < 0) ? 0 : min - 2,
max: (max + 2 > 100) ? 100 : max + 2,
type: 'value',
nameTextStyle: {
color: '#fff',
itemStyle: {
normal: {
color: "#389af4",
shadowColor: "#389af4",
shadowBlur: 0,
},
splitLine: {
show: false,
lineStyle: {
color: '#eeeeee',
},
},
axisTick: {
show: false,
{
value: 50,
name: "invisible",
itemStyle: {
normal: {
color: "#412a4e",
},
axisLine: {
show: false,
emphasis: {
color: "#412a4e",
},
axisLabel: {
show: true,
interval: 0,
textStyle: {
color: '#ffffff',
},
},
],
},
],
})
this.$refs.equipmentPowerTwo.setData({
series: [
{
name: "内胆检漏",
type: 'line',
smooth: false,
showAllSymbol: true, //显示所有图形。
symbol: 'circle', //标记的图形为实心圆
symbolSize: 4, //标记的大小
type: "pie",
clockWise: false,
radius: ['60%', '75%'],
itemStyle: {
//折线拐点标志的样式
color: '#389af4',
borderWidth: '2',
borderColor: '#389af4',
normal: {
label: {
show: false,
},
lineStyle: {
color: '#389af4',
labelLine: {
show: false,
},
shadowBlur: 0,
shadowColor: "#ff8c37",
},
},
hoverAnimation: false,
center: ["50%", "50%"],
data: [
{
value: 50,
label: {
//图形上的文本标签
normal: {
formatter: `{c}${''}`,
show: true,
position: "top",
textStyle: {
color: '#389af4',
fontStyle: "normal",
fontFamily: "微软雅黑",
rich: {
a: {
color: "#ff8c37",
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|灌注}"
);
},
data: [61, 25, 57, 83, 87, 73, 17, 25, 57, 83, 87, 73],
},
]
})
this.$refs.equipmentPowerTwo.setData({
grid: {
top: '28%',
left: '5%',
right: '5%',
bottom: '0%',
containLabel: true,
},
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'shadow',
label: {
position: "center",
show: true,
textStyle: {
fontSize: "14",
fontWeight: "normal",
color: "#fff",
},
},
},
legend: {
top: '5%',
itemWidth: 20,
itemHeight: 10,
itemStyle: {
borderWidth: 1,
borderHeight: 1,
},
formatter: function (val) {
return `${val} `
},
textStyle: {
fontSize: 0.75 * vw,
color: function () {
normal: {
color: "#ff8c37",
shadowColor: "#ff8c37",
shadowBlur: 0,
},
},
},
xAxis: {
type: 'category',
data: ["1月", "2月", "3月", "4月", "5月", "6月", "7月", "8月", "9月", "10月", "11月", "12月"],
axisLine: {
show: true,
{
value: 50,
name: "invisible",
itemStyle: {
normal: {
color: "#412a4e",
},
axisTick: {
show: false,
emphasis: {
color: "#412a4e",
},
axisLabel: {
show: true,
textStyle: {
color: '#ffffff', //X轴文字颜色
},
},
],
},
yAxis: [
],
})
this.$refs.equipmentPowerThree.setData({
series: [
{
name: '合格率',
min: (min - 2 < 0) ? 0 : min - 2,
max: (max + 2 > 100) ? 100 : max + 2,
type: 'value',
nameTextStyle: {
color: '#fff',
},
splitLine: {
show: false,
lineStyle: {
color: '#eeeeee',
},
},
axisTick: {
type: "pie",
clockWise: false,
radius: ['60%', '75%'],
itemStyle: {
normal: {
label: {
show: false,
},
axisLine: {
labelLine: {
show: false,
},
axisLabel: {
show: true,
interval: 0,
textStyle: {
color: '#ffffff',
},
shadowBlur: 0,
shadowColor: "#ffc257",
},
},
],
series: [
hoverAnimation: false,
center: ["50%", "50%"],
data: [
{
name: "安全检测",
type: 'line',
smooth: false,
showAllSymbol: true, //显示所有图形。
symbol: 'circle', //标记的图形为实心圆
symbolSize: 4, //标记的大小
itemStyle: {
//折线拐点标志的样式
color: '#ff8c37',
borderWidth: '2',
borderColor: '#ff8c37',
},
lineStyle: {
color: '#ff8c37',
},
value: 50,
label: {
//图形上的文本标签
normal: {
formatter: `{c}${''}`,
show: true,
position: "top",
textStyle: {
color: '#ff8c37',
fontStyle: "normal",
fontFamily: "微软雅黑",
rich: {
a: {
color: "#ffc257",
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|低压检漏}"
);
},
data: [61, 25, 57, 83, 87, 73, 17, 25, 57, 83, 87, 73],
},
]
})
this.$refs.equipmentPowerThree.setData({
grid: {
top: '28%',
left: '5%',
right: '5%',
bottom: '0%',
containLabel: true,
},
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'shadow',
label: {
position: "center",
show: true,
textStyle: {
fontSize: "14",
fontWeight: "normal",
color: "#fff",
},
},
},
legend: {
top: '5%',
itemWidth: 20,
itemHeight: 10,
itemStyle: {
borderWidth: 1,
borderHeight: 1,
},
formatter: function (val) {
return `${val} `
},
textStyle: {
fontSize: 0.75 * vw,
color: function () {
normal: {
color: "#ffc257",
shadowColor: "#ffc257",
shadowBlur: 0,
},
},
},
xAxis: {
type: 'category',
data: ["1月", "2月", "3月", "4月", "5月", "6月", "7月", "8月", "9月", "10月", "11月", "12月"],
axisLine: {
show: true,
{
value: 50,
name: "invisible",
itemStyle: {
normal: {
color: "#412a4e",
},
axisTick: {
show: false,
emphasis: {
color: "#412a4e",
},
axisLabel: {
show: true,
textStyle: {
color: '#ffffff', //X轴文字颜色
},
},
],
},
yAxis: [
],
})
this.$refs.equipmentPowerFour.setData({
series: [
{
name: '合格率',
min: (min - 2 < 0) ? 0 : min - 2,
max: (max + 2 > 100) ? 100 : max + 2,
type: 'value',
nameTextStyle: {
color: '#fff',
},
splitLine: {
show: false,
lineStyle: {
color: '#eeeeee',
},
},
axisTick: {
type: "pie",
clockWise: false,
radius: ['60%', '75%'],
itemStyle: {
normal: {
label: {
show: false,
},
axisLine: {
labelLine: {
show: false,
},
axisLabel: {
show: true,
interval: 0,
textStyle: {
color: '#ffffff',
},
shadowBlur: 0,
shadowColor: "#fd6f97",
},
},
],
series: [
hoverAnimation: false,
center: ["50%", "50%"],
data: [
{
name: "成品检漏",
type: 'line',
smooth: false,
showAllSymbol: true, //显示所有图形。
symbol: 'circle', //标记的图形为实心圆
symbolSize: 4, //标记的大小
itemStyle: {
//折线拐点标志的样式
color: '#ffc257',
borderWidth: '2',
borderColor: '#ffc257',
},
lineStyle: {
color: '#ffc257',
},
value: 50,
label: {
//图形上的文本标签
normal: {
formatter: `{c}${''}`,
show: true,
position: "top",
textStyle: {
color: '#ffc257',
fontStyle: "normal",
fontFamily: "微软雅黑",
rich: {
a: {
color: "#fd6f97",
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|安规检}"
);
},
data: [61, 25, 57, 83, 87, 73, 17, 25, 57, 83, 87, 73],
},
]
})
this.$refs.equipmentPowerFour.setData({
grid: {
top: '28%',
left: '5%',
right: '5%',
bottom: '0%',
containLabel: true,
},
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'shadow',
label: {
position: "center",
show: true,
},
},
},
legend: {
top: '5%',
itemWidth: 20,
itemHeight: 10,
itemStyle: {
borderWidth: 1,
borderHeight: 1,
},
formatter: function (val) {
return `${val} `
},
textStyle: {
fontSize: 0.75 * vw,
color: function () {
},
},
fontSize: "14",
fontWeight: "normal",
color: "#fff",
},
xAxis: {
type: 'category',
data: ["1月", "2月", "3月", "4月", "5月", "6月", "7月", "8月", "9月", "10月", "11月", "12月"],
axisLine: {
show: true,
},
axisTick: {
show: false,
},
axisLabel: {
show: true,
textStyle: {
color: '#ffffff', //X轴文字颜色
itemStyle: {
normal: {
color: "#fd6f97",
shadowColor: "#fd6f97",
shadowBlur: 0,
},
},
},
yAxis: [
{
name: '合格率',
min: (min - 2 < 0) ? 0 : min - 2,
max: (max + 2 > 100) ? 100 : max + 2,
type: 'value',
nameTextStyle: {
color: '#fff',
},
splitLine: {
show: false,
lineStyle: {
color: '#eeeeee',
},
},
axisTick: {
show: false,
value: 50,
name: "invisible",
itemStyle: {
normal: {
color: "#412a4e",
},
axisLine: {
show: false,
emphasis: {
color: "#412a4e",
},
axisLabel: {
show: true,
interval: 0,
textStyle: {
color: '#ffffff',
},
},
],
},
],
})
this.$refs.equipmentPowerFive.setData({
series: [
{
name: "测温性能",
type: 'line',
smooth: false,
showAllSymbol: true, //显示所有图形。
symbol: 'circle', //标记的图形为实心圆
symbolSize: 4, //标记的大小
type: "pie",
clockWise: false,
radius: ['60%', '75%'],
itemStyle: {
//折线拐点标志的样式
color: '#fd6f97',
borderWidth: '2',
borderColor: '#fd6f97',
},
lineStyle: {
color: '#fd6f97',
},
label: {
//图形上的文本标签
normal: {
formatter: `{c}${''}`,
show: true,
position: "top",
textStyle: {
color: '#fd6f97',
fontStyle: "normal",
fontFamily: "微软雅黑",
fontSize: 0.5 * vw,
},
},
},
data: [61, 25, 57, 83, 87, 73, 17, 25, 57, 83, 87, 73],
},
]
})
this.$refs.equipmentPowerFive.setData({
grid: {
top: '28%',
left: '5%',
right: '5%',
bottom: '0%',
containLabel: true,
},
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'shadow',
label: {
show: true,
},
},
},
legend: {
top: '5%',
itemWidth: 20,
itemHeight: 10,
itemStyle: {
borderWidth: 1,
borderHeight: 1,
},
formatter: function (val) {
return `${val} `
},
textStyle: {
fontSize: 0.75 * vw,
color: function () {
},
},
},
xAxis: {
type: 'category',
data: ["1月", "2月", "3月", "4月", "5月", "6月", "7月", "8月", "9月", "10月", "11月", "12月"],
axisLine: {
show: true,
},
axisTick: {
show: false,
},
axisLabel: {
show: true,
textStyle: {
color: '#ffffff', //X轴文字颜色
labelLine: {
show: false,
},
shadowBlur: 0,
shadowColor: "#a181fc",
},
},
yAxis: [
hoverAnimation: false,
center: ["50%", "50%"],
data: [
{
name: '合格率',
min: (min - 2 < 0) ? 0 : min - 2,
max: (max + 2 > 100) ? 100 : max + 2,
type: 'value',
nameTextStyle: {
color: '#fff',
},
splitLine: {
show: false,
lineStyle: {
color: '#eeeeee',
},
value: 50,
label: {
normal: {
rich: {
a: {
color: "#a181fc",
align: "center",
fontSize: 1.1 * vw,
fontWeight: "bold",
},
b: {
color: "#fff",
align: "center",
fontSize: 0.5 * vw,
},
axisTick: {
show: false,
},
axisLine: {
show: false,
formatter: function (params) {
return (
"{a|" +
params.value +
"%}" +
"\n{b|终检}"
);
},
axisLabel: {
position: "center",
show: true,
interval: 0,
textStyle: {
color: '#ffffff',
fontSize: "14",
fontWeight: "normal",
color: "#fff",
},
},
},
],
series: [
{
name: "成品外观",
type: 'line',
smooth: false,
showAllSymbol: true, //显示所有图形。
symbol: 'circle', //标记的图形为实心圆
symbolSize: 4, //标记的大小
itemStyle: {
//折线拐点标志的样式
color: '#a181fc',
borderWidth: '2',
borderColor: '#a181fc',
normal: {
color: "#a181fc",
shadowColor: "#a181fc",
shadowBlur: 0,
},
lineStyle: {
color: '#a181fc',
},
label: {
//图形上的文本标签
},
{
value: 50,
name: "invisible",
itemStyle: {
normal: {
formatter: `{c}${''}`,
show: true,
position: "top",
textStyle: {
color: '#a181fc',
fontStyle: "normal",
fontFamily: "微软雅黑",
fontSize: 0.5 * vw,
color: "#412a4e",
},
emphasis: {
color: "#412a4e",
},
},
data: [61, 25, 57, 83, 87, 73, 17, 25, 57, 83, 87, 73],
},
]
],
},
],
})
this.day()
},
@ -1240,4 +1084,20 @@ export default {
display: inline-block;
width: 16.6%;
}
.totalNum {
position: absolute;
top: 11.5%;
left: 18%;
transform: translateY(-50%);
color: #fff;
font-size: 0.8vw;
}
.classSelect {
position: absolute;
top: 6%;
left: 4%;
width: 5vw;
}
</style>

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

@ -112,21 +112,21 @@ export default {
console.log(AMRT)
let num = 0
let modelArr = [
'1720315475507941376',
'1720315479907766272',
'1720315484513112064',
'1720315500866703360',
'1720315558030872576',
'1720315596551360512',
'1720315644550975488',
'1720315648946606080',
'1720315687114772480',
'1720315691422322688',
'1720315722275622912',
'1720315729129115648',
'1720315768454909952',
'1720316275214913536',
'1720316297822212096',
// '1720315475507941376',
// '1720315479907766272',
// '1720315484513112064',
// '1720315500866703360',
// '1720315558030872576',
// '1720315596551360512',
// '1720315644550975488',
// '1720315648946606080',
// '1720315687114772480',
// '1720315691422322688',
// '1720315722275622912',
// '1720315729129115648',
// '1720315768454909952',
// '1720316275214913536',
// '1720316297822212096',
]
modelArr.forEach(e => {
let model = viewer.loadModel(e, {

Write Preview
Loading…
Cancel
Save