@@ -2,7 +2,7 @@ | |||
<div class="left-content-equipment-check"> | |||
<!-- <TechyFakeTable :table-props="tableProps" :table-data="tableData" /> | |||
<TechyFakeTable :table-props="tableProps2" :table-data="tableData2" /> --> | |||
<div class="el-table-wrapper"> | |||
<div class="el-table-wrapper fix-table"> | |||
<!-- <TechyTable key="table-1" :showIndex="false" :table-config="tableProps" :table-data="tableData"></TechyTable> --> | |||
<el-table | |||
key="LeftContentEquipmentCheck1" | |||
@@ -10,10 +10,10 @@ | |||
:data="tableData" | |||
:header-cell-style="{ background: 'rgba(79,114,136,0.29)' }" | |||
> | |||
<el-table-column label="设备名称" prop="eqName" /> | |||
<el-table-column label="所属产线" prop="pl" /> | |||
<el-table-column label="提示等级" prop="warningLevel" /> | |||
<el-table-column label="提示等级" prop="checkContent" /> | |||
<el-table-column label="设备名称" prop="eqName" align="center" /> | |||
<el-table-column label="所属产线" prop="pl" align="center" /> | |||
<el-table-column label="提示等级" prop="warningLevel" align="center" /> | |||
<el-table-column label="提示等级" prop="checkContent" align="center" /> | |||
</el-table> | |||
</div> | |||
<!-- <div class="el-table-wrapper"> | |||
@@ -73,6 +73,12 @@ export default { | |||
</script> | |||
<style scoped> | |||
.fix-table >>> .el-table td .cell { | |||
width: 60% !important; | |||
margin: auto; | |||
text-align: left; | |||
} | |||
.left-content-equipment-check { | |||
height: calc(100% - 32px); | |||
display: flex; | |||
@@ -2,7 +2,7 @@ | |||
<div class="left-content-equipment-check"> | |||
<!-- <TechyFakeTable :table-props="tableProps" :table-data="tableData" /> | |||
<TechyFakeTable :table-props="tableProps2" :table-data="tableData2" /> --> | |||
<div class="el-table-wrapper"> | |||
<div class="el-table-wrapper fix-table"> | |||
<!-- <TechyTable key="table-1" :showIndex="false" :table-config="tableProps" :table-data="tableData"></TechyTable> --> | |||
<el-table | |||
key="LeftContentOrder1" | |||
@@ -10,10 +10,22 @@ | |||
:data="tableData" | |||
:header-cell-style="{ background: 'rgba(79,114,136,0.29)' }" | |||
> | |||
<el-table-column label="订单编号" prop="orderCode" :show-overflow-tooltip="true" :resizable="true" /> | |||
<el-table-column label="客户名称" prop="clientName" :show-overflow-tooltip="true" :resizable="true" /> | |||
<el-table-column label="规格" prop="specs" :resizable="true" /> | |||
<el-table-column label="完成度" prop="finished" :resizable="true"> | |||
<el-table-column | |||
label="订单编号" | |||
prop="orderCode" | |||
:show-overflow-tooltip="true" | |||
:resizable="true" | |||
align="center" | |||
/> | |||
<el-table-column | |||
label="客户名称" | |||
prop="clientName" | |||
:show-overflow-tooltip="true" | |||
:resizable="true" | |||
align="center" | |||
/> | |||
<el-table-column label="规格" prop="specs" :resizable="true" align="center" /> | |||
<el-table-column label="完成度" prop="finished" :resizable="true" align="center"> | |||
<template slot-scope="scope"> | |||
<el-progress | |||
class="lb-progress-bar" | |||
@@ -79,6 +91,12 @@ export default { | |||
</script> | |||
<style scoped> | |||
.fix-table >>> .el-table td .cell { | |||
width: 70% !important; | |||
margin: auto; | |||
text-align: left; | |||
} | |||
.left-content-equipment-check { | |||
display: flex; | |||
gap: calc(100vw / 1920 * 16); | |||
@@ -144,11 +162,11 @@ export default { | |||
} | |||
.lb-progress-bar { | |||
left: 40px; | |||
left: 30px; | |||
display: flex; | |||
} | |||
.lb-progress-bar >>> .el-progress__text { | |||
color: #fff9; | |||
left: -70%; | |||
left: -75%; | |||
} | |||
</style> |
@@ -1,17 +1,17 @@ | |||
<template> | |||
<div class="right-content-alert"> | |||
<div class="el-table-wrapper"> | |||
<div class="el-table-wrapper fix-table"> | |||
<el-table | |||
key="RightContentAlertTable" | |||
border | |||
:data="tableData" | |||
:header-cell-style="{ background: 'rgba(79,114,136,0.29)' }" | |||
> | |||
<el-table-column label="设备名称" prop="eqName" :show-overflow-tooltip="true" :resizable="true" /> | |||
<el-table-column label="所属产线" prop="plName" :show-overflow-tooltip="true" :resizable="true" /> | |||
<el-table-column label="故障等级" prop="level" :resizable="true" /> | |||
<el-table-column label="故障内容" prop="content" :resizable="true" /> | |||
<el-table-column label="累计时间(min)" prop="duration" :resizable="true" /> | |||
<el-table-column label="设备名称" prop="eqName" :show-overflow-tooltip="true" :resizable="true" align="center" /> | |||
<el-table-column label="所属产线" prop="plName" :show-overflow-tooltip="true" :resizable="true" align="center" /> | |||
<el-table-column label="故障等级" prop="level" :resizable="true" align="center" /> | |||
<el-table-column label="故障内容" prop="content" :resizable="true" align="center" /> | |||
<el-table-column label="累计时间(min)" prop="duration" :resizable="true" align="center" :width="128" /> | |||
</el-table> | |||
</div> | |||
</div> | |||
@@ -42,6 +42,12 @@ export default { | |||
</script> | |||
<style scoped> | |||
.fix-table >>> .el-table td .cell { | |||
width: 80% !important; | |||
margin: auto; | |||
text-align: left; | |||
} | |||
.right-content-alert { | |||
height: calc(100% - 32px); | |||
display: flex; | |||
@@ -19,7 +19,7 @@ | |||
<div class="techy-body-part__middle"> | |||
<TechyBox> | |||
<div class="flex"> | |||
<div class="techy-body-part__middle__inner"> | |||
<p> | |||
<b>产线名称 :</b> | |||
<span>A产线</span> | |||
@@ -29,7 +29,7 @@ | |||
<span>清洗机</span> | |||
</p> | |||
<p> | |||
<b>累计加工数量 :</b> | |||
<b>累计加工 :</b> | |||
<span>20</span> | |||
</p> | |||
<p> | |||
@@ -167,7 +167,7 @@ export default { | |||
} | |||
#v3d-outter *::-webkit-scrollbar-track { | |||
background-color: #14243F; | |||
background-color: #14243f; | |||
/* background-color: white; */ | |||
border-radius: 0; | |||
} | |||
@@ -244,19 +244,21 @@ export default { | |||
.techy-body-part__middle { | |||
position: absolute; | |||
top: 12%; | |||
left: 36%; | |||
height: 96px; | |||
width: 128px; | |||
top: 9%; | |||
left: 26%; | |||
height: 136px; | |||
width: 176px; | |||
} | |||
.flex { | |||
.techy-body-part__middle__inner { | |||
height: 100%; | |||
padding: 12px; | |||
display: flex; | |||
flex-direction: column; | |||
justify-content: space-between; | |||
} | |||
.flex p { | |||
.techy-body-part__middle__inner p { | |||
margin: 0; | |||
padding: 0; | |||
font-size: 12px; | |||
@@ -264,15 +266,15 @@ export default { | |||
color: #fff; | |||
} | |||
.flex p > span { | |||
.techy-body-part__middle__inner p > span { | |||
position: relative; | |||
padding-left: 6px; | |||
padding-left: 16px; | |||
} | |||
.round-dot::before { | |||
content: ''; | |||
position: absolute; | |||
top: 5px; | |||
left: -3px; | |||
top: 4px; | |||
left: 2px; | |||
width: 8px; | |||
height: 8px; | |||
background-color: rgb(82, 231, 82); | |||
@@ -8,7 +8,7 @@ | |||
<div class="equipment-exception"> | |||
<!-- 设备报修/异常上报 --> | |||
<techy-container :title="'设备报修/异常上报'" :icon="equipmentExceptionSVG"> | |||
<div class="table-wrapper"> | |||
<div class="table-wrapper fix-table-exception-report"> | |||
<techy-table | |||
:page="1" | |||
:limit="7" | |||
@@ -22,7 +22,7 @@ | |||
<div class="equipment-alarm"> | |||
<!-- 设备异常报警 --> | |||
<techy-container :title="'设备异常报警'" :icon="equipmentAlarmSVG"> | |||
<div class="table-wrapper"> | |||
<div class="table-wrapper fix-table-eq-exception"> | |||
<techy-table | |||
:page="1" | |||
:limit="7" | |||
@@ -325,6 +325,17 @@ export default { | |||
</script> | |||
<style scoped> | |||
.fix-table-eq-exception >>> .el-table td .cell { | |||
width: 80% !important; | |||
margin: auto; | |||
text-align: left; | |||
} | |||
.fix-table-exception-report >>> .el-table td .cell { | |||
width: 70% !important; | |||
margin: auto; | |||
text-align: left; | |||
} | |||
.visual-container { | |||
width: 100%; | |||
min-width: 1280px; | |||
@@ -27,18 +27,18 @@ const PriorityComponent = { | |||
} | |||
}, | |||
methods: {}, | |||
render: function(h) { | |||
return h('span', { style: { display: 'inline-block', borderRadius: '2px', padding: '2px 8px', color: '#fff', opacity: '0.6', backgroundColor: this.bgColor }}, this.priorityText) | |||
render: function (h) { | |||
return h('span', { style: { display: 'inline-block', borderRadius: '2px', padding: '2px 8px', color: '#fff', opacity: '0.6', backgroundColor: this.bgColor } }, this.priorityText) | |||
} | |||
} | |||
export const equipmentExceptionProps = [ | |||
{ label: '设备名称', prop: 'eqName' }, | |||
{ label: '所属产线', prop: 'pl' }, | |||
{ label: '报修/异常内容', prop: 'content' }, | |||
{ label: '报修/发现人', prop: 'creator' }, | |||
{ label: '时间', prop: 'time' }, | |||
{ label: '优先级', prop: 'priority', align: 'center', subcomponent: PriorityComponent } | |||
{ label: '设备名称', prop: 'eqName', align: 'center' }, | |||
{ label: '所属产线', prop: 'pl', align: 'center', width: 80 }, | |||
{ label: '报修/异常内容', prop: 'content', align: 'center' }, | |||
{ label: '报修/发现人', prop: 'creator', align: 'center', width: 100 }, | |||
{ label: '时间', prop: 'time', align: 'center' }, | |||
{ label: '优先级', prop: 'priority', align: 'center', subcomponent: PriorityComponent, width: 80 } | |||
] | |||
export const equipmentExceptionDatalist = [ | |||
@@ -70,21 +70,21 @@ const LifeRemainComponent = { | |||
} | |||
}, | |||
render: function(h) { | |||
render: function (h) { | |||
return h('span', { | |||
style: | |||
{ position: 'absolute', top: 0, left: 0, right: 0, bottom: 0, width: '100%', height: '100%', display: 'flex', justifyContent: 'center', alignItems: 'center', opacity: '0.8', backgroundColor: this.statusColor, color: '#fff' } | |||
}, | |||
this.injectData.remain) | |||
this.injectData.remain) | |||
} | |||
} | |||
export const equipmentAlarmProps = [ | |||
{ label: '设备名称', prop: 'eqName' }, | |||
{ label: '设备编码', prop: 'eqCode' }, | |||
{ label: '所属产线', prop: 'pl' }, | |||
{ label: '报警级别', prop: 'priority', align: 'center', subcomponent: PriorityComponent }, | |||
{ label: '报警内容', prop: 'content' } | |||
{ label: '设备名称', prop: 'eqName', align: 'center' }, | |||
{ label: '设备编码', prop: 'eqCode', align: 'center' }, | |||
{ label: '所属产线', prop: 'pl', align: 'center' }, | |||
{ label: '报警级别', prop: 'priority', align: 'center', width: 80, subcomponent: PriorityComponent }, | |||
{ label: '报警内容', prop: 'content', align: 'center' } | |||
] | |||
export const equipmentAlarmDatalist = [ | |||
@@ -122,13 +122,13 @@ export const equipmentAnalysisData = [ | |||
] | |||
export const sparepartsProps = [ | |||
{ prop: 'name', label: '部件名称' }, | |||
{ prop: 'eq', label: '所属设备' }, | |||
{ prop: 'pl', label: '所属产线' }, | |||
{ prop: 'update_time', label: '更换时间' }, | |||
{ prop: 'remain', label: '剩余寿命', subcomponent: LifeRemainComponent }, | |||
{ prop: 'stock', label: '备件库存量' }, | |||
{ prop: 'location', label: '库位' } | |||
{ prop: 'name', label: '部件名称', align: 'center' }, | |||
{ prop: 'eq', label: '所属设备', align: 'center' }, | |||
{ prop: 'pl', label: '所属产线', align: 'center' }, | |||
{ prop: 'update_time', label: '更换时间', align: 'center' }, | |||
{ prop: 'remain', label: '剩余寿命', align: 'center', subcomponent: LifeRemainComponent }, | |||
{ prop: 'stock', label: '备件库存量', align: 'center' }, | |||
{ prop: 'location', label: '库位', align: 'center' } | |||
] | |||
export const sparepartsDatalist = [ | |||
@@ -172,9 +172,9 @@ const StatusComponent = { | |||
][this.injectData.status - 1] | |||
} | |||
}, | |||
render: function(h) { | |||
return h('span', { style: { display: 'flex', justifyContent: 'center', alignItems: 'center', color: '#fff' }}, [ | |||
h('span', { style: { width: '6px', height: '6px', borderRadius: '50%', backgroundColor: this.statusColor, boxShadow: '0 0 2px 2px ' + this.statusColor, marginRight: '8px' }}, ''), | |||
render: function (h) { | |||
return h('span', { style: { display: 'flex', justifyContent: 'center', alignItems: 'center', color: '#fff' } }, [ | |||
h('span', { style: { width: '6px', height: '6px', borderRadius: '50%', backgroundColor: this.statusColor, boxShadow: '0 0 2px 2px ' + this.statusColor, marginRight: '8px' } }, ''), | |||
h('span', this.statusText) | |||
]) | |||
} | |||
@@ -5,7 +5,7 @@ | |||
<div class="part-1"> | |||
<div> | |||
<techy-container :title="'质量异常上报'" :icon="qualitySVG"> | |||
<div> | |||
<div class="fix-table-exception-report"> | |||
<techy-table | |||
:page="1" | |||
:limit="10" | |||
@@ -17,7 +17,7 @@ | |||
</techy-container> | |||
</div> | |||
<div> | |||
<div class="fix-table-exception-alert"> | |||
<techy-container :title="'质量异常报警'" :icon="qualityExceptionSVG"> | |||
<techy-table | |||
:page="1" | |||
@@ -337,6 +337,19 @@ export default { | |||
</script> | |||
<style scoped> | |||
.fix-table-exception-alert >>> .el-table td .cell { | |||
width: 75% !important; | |||
margin: auto; | |||
text-align: left; | |||
} | |||
.fix-table-exception-report >>> .el-table td .cell { | |||
width: 70% !important; | |||
margin: auto; | |||
text-align: left; | |||
} | |||
.visual-container { | |||
width: 100%; | |||
min-width: 1280px; | |||
@@ -101,7 +101,7 @@ export default { | |||
colorStops: [ | |||
{ | |||
offset: 0, | |||
color: '#FB418C' // 0% 处的颜色 | |||
color: '#FB418C66' // 0% 处的颜色 | |||
}, | |||
{ | |||
offset: 1, | |||
@@ -132,7 +132,7 @@ export default { | |||
colorStops: [ | |||
{ | |||
offset: 0, | |||
color: '#DDB112' // 0% 处的颜色 | |||
color: '#DDB11266' // 0% 处的颜色 | |||
}, | |||
{ | |||
offset: 1, | |||
@@ -163,7 +163,7 @@ export default { | |||
colorStops: [ | |||
{ | |||
offset: 0, | |||
color: '#1A99FF' // 0% 处的颜色 | |||
color: '#1A99FF66' // 0% 处的颜色 | |||
}, | |||
{ | |||
offset: 1, | |||
@@ -194,7 +194,7 @@ export default { | |||
colorStops: [ | |||
{ | |||
offset: 0, | |||
color: '#A691FF' // 0% 处的颜色 | |||
color: '#A691FF66' // 0% 处的颜色 | |||
}, | |||
{ | |||
offset: 1, | |||
@@ -229,7 +229,7 @@ export default { | |||
colorStops: [ | |||
{ | |||
offset: 0, | |||
color: '#49FBD6' // 0% 处的颜色 | |||
color: '#49FBD666' // 0% 处的颜色 | |||
}, | |||
{ | |||
offset: 1, | |||
@@ -30,20 +30,20 @@ const PriorityComponent = { | |||
console.log(this.injectData.priority) | |||
}, | |||
methods: {}, | |||
render: function(h) { | |||
return h('span', { style: { display: 'inline-block', borderRadius: '2px', padding: '2px 8px', color: '#fff', opacity: '0.6', backgroundColor: this.bgColor }}, this.priorityText) | |||
render: function (h) { | |||
return h('span', { style: { display: 'inline-block', borderRadius: '2px', padding: '2px 8px', color: '#fff', opacity: '0.6', backgroundColor: this.bgColor } }, this.priorityText) | |||
} | |||
} | |||
console.log('is component?', PriorityComponent) | |||
export const qualityTableProps = [ | |||
{ label: '工序名称', width: 80, prop: 'wsName' }, | |||
{ label: '所属产线', width: 80, prop: 'pl' }, | |||
{ label: '工序名称', width: 130, prop: 'wsName', align: 'center' }, | |||
{ label: '所属产线', width: 130, prop: 'pl', align: 'center' }, | |||
{ label: '异常内容', align: 'center', prop: 'content' }, | |||
{ label: '报告人', width: 80, prop: 'creator' }, | |||
{ label: '时间', prop: 'time' }, | |||
{ label: '优先级', width: 80, prop: 'priority', align: 'center', subcomponent: PriorityComponent } | |||
{ label: '报告人', width: 120, prop: 'creator', align: 'center' }, | |||
{ label: '时间', prop: 'time', align: 'center' }, | |||
{ label: '优先级', width: 100, prop: 'priority', align: 'center', subcomponent: PriorityComponent } | |||
] | |||
export const qualityDatalist = [ | |||
@@ -87,23 +87,23 @@ const StatusComponent = { | |||
][this.injectData.status - 1] | |||
} | |||
}, | |||
render: function(h) { | |||
return h('span', { style: { display: 'flex', justifyContent: 'center', alignItems: 'center', color: '#fff' }}, [ | |||
h('span', { style: { width: '6px', height: '6px', borderRadius: '50%', backgroundColor: this.statusColor, boxShadow: '0 0 2px 2px ' + this.statusColor, marginRight: '6px' }}, ''), | |||
render: function (h) { | |||
return h('span', { style: { display: 'flex', justifyContent: 'center', alignItems: 'center', color: '#fff' } }, [ | |||
h('span', { style: { width: '6px', height: '6px', borderRadius: '50%', backgroundColor: this.statusColor, boxShadow: '0 0 2px 2px ' + this.statusColor, marginRight: '6px' } }, ''), | |||
h('span', this.statusText) | |||
]) | |||
} | |||
} | |||
export const qualityExceptionTableProps = [ | |||
{ label: '工序名称', prop: 'wsName' }, | |||
{ label: '所属产线', prop: 'pl' }, | |||
{ label: '异常内容', prop: 'content' }, | |||
{ label: '发现人', prop: 'creator' }, | |||
{ label: '时间', prop: 'time' }, | |||
{ label: '优先级', prop: 'priority', align: 'center', subcomponent: PriorityComponent }, | |||
{ label: '处理人', prop: 'charger' }, | |||
{ label: '完成情况', prop: 'status', align: 'center', subcomponent: StatusComponent } | |||
{ label: '工序名称', prop: 'wsName', align: 'center', width: 120 }, | |||
{ label: '所属产线', prop: 'pl', align: 'center', width: 120 }, | |||
{ label: '异常内容', prop: 'content', align: 'center' }, | |||
{ label: '发现人', prop: 'creator', align: 'center', width: 100 }, | |||
{ label: '时间', prop: 'time', align: 'center' }, | |||
{ label: '优先级', prop: 'priority', align: 'center', subcomponent: PriorityComponent, width: 100 }, | |||
{ label: '处理人', prop: 'charger', align: 'center', width: 100 }, | |||
{ label: '完成情况', prop: 'status', align: 'center', subcomponent: StatusComponent, width: 100 } | |||
] | |||
export const qualityExceptionDatalist = [ | |||