DeXun/industry-ui
10
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Initial commit

Browse Source
This commit is contained in:
86156
2024-11-25 09:33:57 +08:00
commit a80c644265
521 changed files with 29740 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

862
src/views/work/abnormal_process/index.vue Normal file
View File

@@ -0,0 +1,862 @@
<template>
<div>
<!--导航栏 -->
<div class="hxjx_root">
<div style="width:55%;overflow:hidden;">
<table class="table table-hover table-bordered table-striped table-condensed text-nowrap">
<thead class="hxjx_table_th">
<tr>
<th class="hxjx_table_th_width">序号</th>
<th class="hxjx_table_th_width">钽靶批号</th>
<th class="hxjx_table_th_width">规格</th>
<th class="hxjx_table_th_width">工艺</th>
<th class="hxjx_table_th_width">直径</th>
</tr>
</thead>
<tbody>
<tr v-if="dataList.length>0" v-for="(item,index) in dataList">
<td class="hxjx_table_btnColumn"
:class="[{table_td_warn: item.operation==1},{table_td_error:item.state==3}]"
>{{ index + 1 }}
</td>
<td class="hxjx_table_btnColumn"
:class="[{table_td_warn: item.operation==1},{table_td_error:item.state==3}]"
>{{ item.id }}
</td>
<td class="hxjx_table_btnColumn"
:class="[{table_td_warn: item.operation==1},{table_td_error:item.state==3}]"
>
{{ item.specification }}
</td>
<td class="hxjx_table_btnColumn"
:class="[{table_td_warn: item.operation==1},{table_td_error:item.state==3}]"
>
{{ item.technology }}
</td>
<td class="hxjx_table_btnColumn"
:class="[{table_td_warn: item.operation==1},{table_td_error:item.state==3}]"
>{{ item.diameter }}
</td>
</tr>
<tr v-if="dataList.length<=0">
<td class="hxjx_table_btnColumn"
style="height: 150px;vertical-align: middle;text-align: center;" colspan="5" rowspan="8"
>
等待下一批次材料轧制
</td>
</tr>
</tbody>
</table>
<!-- 按钮操作 -->
<table class="table">
<tr>
<td class="hxjx_footer_main" style="padding: 0;">
<div class="btn-group btn-group-sm">
<a href="#" class="btn btn-primary btn-sm custom hxjx_foot_btn_custom"
@click="nextStep" v-loading="nextStepLoading"
>下道次</a>
<a href="#" class="btn btn-primary btn-sm custom hxjx_foot_btn_custom"
@click="startProcess"
>开始轧制</a>
<a href="#" class="btn btn-primary btn-sm custom hxjx_foot_btn_custom"
@click="finishProcess"
style="margin-right: 0;"
>轧制完成</a>
</div>
</td>
</tr>
</table>
</div>
<div style="width:45%;">
<table class="table table-hover table-bordered table-striped table-condensed text-nowrap" style="font-size: small">
<thead class="hxjx_table_th">
<tr>
<th class="hxjx_table_th_width">批号</th>
<th class="hxjx_table_th_width">轧制道次</th>
<th class="hxjx_table_th_width">压下量</th>
<th class="hxjx_table_th_width">辊缝设定值</th>
<th class="hxjx_table_th_width">喂料角度</th>
<th class="hxjx_table_th_width">完成</th>
</tr>
</thead>
<tbody>
<td class="hxjx_table_btnColumn" rowspan="5"
style="vertical-align: middle;text-align: center;" v-if="processing.id!=null"
>
{{ processing.id }}
</td>
<td class="hxjx_table_btnColumn" rowspan="5"
style="vertical-align: middle;text-align: center;" v-else
>
当前无可用操作批号
</td>
<tr v-for="(item,index) in passList">
<td class="hxjx_table_btnColumn" :class="{table_td_unstart: item.operation==1}">{{ item.step }}</td>
<td class="hxjx_table_btnColumn" :class="{table_td_unstart: item.operation==1}">
{{ item.reduction }}
</td>
<td class="hxjx_table_btnColumn" :class="{table_td_unstart: item.operation==1}">{{ item.setValue }}
</td>
<td class="hxjx_table_btnColumn" :class="{table_td_unstart: item.operation==1}">{{ item.angle }}</td>
<td class="hxjx_table_btnColumn" :class="{table_td_unstart: item.operation==1}">
<div class="circle_finish" v-if="item.state==1"></div>
<div class="circle_error" v-if="item.state==2"></div>
<div class="circle_unstart" v-if="item.state==0 && item.operation===1"></div>
<div class="circle_unstart2" v-if="item.state==0 && item.operation!==1"></div>
</td>
</tr>
<tr v-if="passList==[]" v-for="item in 4">
<td class="hxjx_table_btnColumn"></td>
<td class="hxjx_table_btnColumn"></td>
<td class="hxjx_table_btnColumn"></td>
<td class="hxjx_table_btnColumn"></td>
<td class="hxjx_table_btnColumn">
<div class="circle_unstart"></div>
</td>
</tr>
</tbody>
</table>
<!-- 旋转角度 -->
<div style="width:100%;height:350px;display: flex;justify-content: space-between">
<div style="display: flex;margin-bottom: 15px;">
<img src="../../../assets/img/FlowChart-2-1.png" class="imageCircle"
:style="{transform: 'rotate(-' + circleStart + 'deg)'}"
/>
<img src="../../../assets/img/FlowChart-2-2.png" class="image-circle-rows">
</div>
<div style="">
<el-button type="success" plain
@click="submit(1)" :loading="!submitButton"
>确认
</el-button>
<el-button type="danger" plain
style="margin-right: 0;" :loading="!submitButton" @click="submit(2)"
>异常
</el-button>
</div>
</div>
</div>
</div>
<div style="margin-top: -150px">
<table class="table table-borderless hxjx_table_text_left">
<tbody>
<tr>
<td class="hxjx_table_label_format hxjx_table_label">传动侧油缸位置:</td>
<td class="hxjx_table_label_format hxjx_table_text">
<input class="text-nowrap form-control" type="text" name="runPosition"
style="background-color: rgb(255, 192, 0);color:#fff;text-align: right;width:300px;"
:value="plcData.circleContainerAddress+'mm'"
/>
</td>
<td class="hxjx_table_label_format hxjx_table_label">操作侧油缸位置:</td>
<td class="hxjx_table_label_format hxjx_table_text">
<input class="text-nowrap form-control" type="text" name="operatePosition"
style="background-color: rgb(255, 192, 0);color:#fff;text-align: right;width:300px;"
:value="plcData.operationContainerAddress+'mm'"
/>
</td>
</tr>
<tr>
<td class="hxjx_table_label_format hxjx_table_label">传动侧压力:</td>
<td class="hxjx_table_label_format hxjx_table_text">
<input class="text-nowrap form-control" type="text" name="runPressure"
style="background-color: rgb(255, 192, 0);color:#fff;text-align: right;width:300px;"
:value="plcData.convey+'吨'"
/>
</td>
<td class="hxjx_table_label_format hxjx_table_label">操作侧压力:</td>
<td class="hxjx_table_label_format hxjx_table_text">
<input class="text-nowrap form-control" type="text" name="operatePressure"
style="background-color: rgb(255, 192, 0);color:#fff;text-align: right;width:300px;"
:value="plcData.operation+'吨'"
/>
</td>
</tr>
<tr>
<td class="hxjx_table_label_format hxjx_table_label">上辊电流:</td>
<td class="hxjx_table_label_format hxjx_table_text">
<input class="text-nowrap form-control" type="text" name="upElectric"
style="background-color: rgb(255, 192, 0);color:#fff;text-align: right;width:300px;"
:value="plcData.highElectric+'A'"
/>
</td>
<td class="hxjx_table_label_format hxjx_table_label">下辊电流:</td>
<td class="hxjx_table_label_format hxjx_table_text">
<input class="text-nowrap form-control" type="text" name="downElectric"
style="background-color: rgb(255, 192, 0);color:#fff;text-align: right;width:300px;"
:value="plcData.lowElectric+'A'"
/>
</td>
</tr>
<tr>
<td class="hxjx_table_label_format hxjx_table_label">轧机反馈速度:</td>
<td class="hxjx_table_label_format hxjx_table_text">
<input class="text-nowrap form-control" type="text" name="speed"
style="background-color: rgb(255, 192, 0);color:#fff;text-align: right;width:300px;"
:value="plcData.machineBackSpeed+'米/分钟'"
/>
</td>
<td class="hxjx_table_label_format hxjx_table_label"></td>
<td class="hxjx_table_label_format hxjx_table_text"></td>
</tr>
</tbody>
</table>
</div>
<div id="hxjx_popup" class="hxjx_popup" v-if="showFault">
<!-- 表头-->
<div class="hxjx_popup_header_danger">
<span style="float:left">故障</span>
<!-- <span id="hxjx_popup_header_close" style="float:right"><i class='fa fa-times' style="font-size: 20px;cursor: pointer;"></i></span> -->
</div>
<!-- body-->
<div class="hxjx_popup_body_danger">
<div style="width:100%;height:227px;">
<table class="table table-borderless hxjx_table_text_left">
<tbody>
<tr>
<td class="hxjx_table_label_format hxjx_table_label" style="padding:0.25rem;">时间:</td>
<td class="hxjx_table_label_format hxjx_table_text" style="padding:0.25rem;">{{ messageData.createTime }}
</td>
<td class="hxjx_table_label_format hxjx_table_text_rule"
style="padding:0.25rem;vertical-align: middle;"
></td>
</tr>
<tr>
<td class="hxjx_table_label_format hxjx_table_label" style="padding:0.25rem;">故障名称:</td>
<td class="hxjx_table_label_format hxjx_table_text" style="padding:0.25rem;">{{ messageData.faultName }}
</td>
<td class="hxjx_table_label_format hxjx_table_text_rule"
style="padding:0.25rem;vertical-align: middle;"
></td>
</tr>
<tr>
<td class="hxjx_table_label_format hxjx_table_label" style="padding:0.25rem;">故障信息:</td>
<td class="hxjx_table_label_format hxjx_table_text" style="padding:0.25rem;">
{{ messageData.faultMessage }}
</td>
<td class="hxjx_table_label_format hxjx_table_text_rule"
style="padding:0.25rem;vertical-align: middle;"
></td>
</tr>
</tbody>
</table>
</div>
<!-- 按钮操作 -->
<table class="table">
<tr>
<td style="padding: 20px 0 0 0;text-align: right; border-top:0px solid #dc3545">
<div class="btn-group btn-group-sm">
<a href="#" class="hxjx-button-ensure btn btn-danger btn-sm custom hxjx_foot_btn_custom"
style="margin-right: 0;" @click="ensure"
>确定</a>
</div>
</td>
</tr>
</table>
</div>
</div>
<el-dialog
title="请填写轧制后的最终厚度与直径"
:visible.sync="dialogVisible"
width="70%"
>
<el-table
:data="finalData"
stripe
style="width: 100%"
>
<el-table-column
prop="id"
label="钽靶批号"
width="180"
>
<templete slot-scope="scope">
<div v-if="scope.row.id">{{ scope.row.id }}</div>
<div class="kong" v-else>-</div>
</templete>
</el-table-column>
<el-table-column
prop="finalWidth"
label="最终厚度"
>
<templete slot-scope="scope">
<el-input v-if="scope.row.id && scope.row.state!=3" v-model="scope.row.finalWidth"
placeholder="请输入该批号的最终厚度"
></el-input>
<el-input v-if="scope.row.id && scope.row.state==3" v-model="scope.row.finalWidth"
placeholder="该批次发生异常" disabled
></el-input>
<div class="kong" v-if="!scope.row.id">-</div>
</templete>
</el-table-column>
<el-table-column
prop="finalDiameter"
label="最终直径"
>
<templete slot-scope="scope">
<el-input v-if="scope.row.id && scope.row.state!=3" v-model="scope.row.finalDiameter"
placeholder="请输入该批号的最终直径"
></el-input>
<el-input v-if="scope.row.id && scope.row.state==3 " placeholder="该批次发生异常" disabled></el-input>
<div class="kong" v-if="!scope.row.id">-</div>
</templete>
</el-table-column>
</el-table>
<span slot="footer" class="dialog-footer">
<!-- <el-button @click="dialogVisible = false">取 消</el-button>-->
<el-button type="primary" @click="submitFinalData">确 定</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import { messageData, messageUpdate } from '@/api/system/resource'
import {
listMaterial,
materialFinalData,
materialUpdate,
stepCheck, stepPLC, stepProcess,
stepSubmit,
stepUpdate
} from '@/api/system/process'
import {
materialAbnormalStart,
materialCheckFlagError, materialNextError,
materialNextStepFlagError, stepCheckAbnormal, stepFinishError,
stepNextError
} from '@/api/system/abnormal'
import { getFaultMessage, newIP } from '@/api/system/common'
export default {
name: 'index',
data() {
return {
MessageParams: {
state: 0
},
showFault: false,
dialogVisible: false,
passList: [],
dataList: [],
processing: {
id: null,
batchId: ''
},
finalData: [],
activeIndex: 0,
batchSize: 0,
flag: 1,
intervalTime: '',
submitButton: false,
// 保证同一批次只弹出一次
finalFlag: 0,
plcData: {
circleContainerAddress: 0.00,
operationContainerAddress: 0.00,
convey: 0.00,
operation: 0.00,
highElectric: 0.00,
lowElectric: 0.00,
machineBackSpeed: 0.00,
agc: 0.00,
ordinary: 0.00
},
nextStepFlagError: -1,
messageData: {},
newHTML: true,
nowPass: {},
nextStepLoading:false
}
},
methods: {
ensure() {
let data = {
state: 1
}
messageUpdate(data).then(res => {
this.showFault = false
})
},
submit(state) {
// 获取正在运行的对象
let params = this.passList.filter(item => item.operation == 1)[0]
if (state == 2) {
if (confirm('是否将钽靶【' + params.materialId + '】移动至异常品内处理？')) {
params.state = state
let data = this.processing
data.state = 3
materialUpdate(data)
stepSubmit(params).then(res => {
this.getStepDataList()
})
materialCheckFlagError(this.processing).then(res => {
this.nextStepFlagError = params.state
setTimeout(() => {
this.nextMaterial()
}, 1000)
if (res.data === 0) {
this.$notify({
title: '提醒',
message: '该道次已完成，请点击下道次'
})
}
})
}
} else if (state == 1) {
let processing = this.processing
let pass = this.passList.filter(item => item.operation == 1)[0]
pass.state = 1
stepUpdate(pass).then(res => {
this.getStepDataList()
materialCheckFlagError(processing).then(res => {
this.nextStepFlagError = pass.state
setTimeout(() => {
this.nextMaterial()
}, 1000)
if (res.data === 0) {
this.$notify({
title: '提醒',
message: '该道次已完成，请点击下道次'
})
}
})
})
}
// 表示这是第一次穷尽
if (this.finalFlag == 0) {
// 检测是否穷尽
this.checkFinal()
}
},
// 下道次
nextStep() {
let params = this.passList.filter(item => item.operation == 1)[0]
if (params && params.state === 0) {
alert('请操作当前道次')
this.nextStepLoading = false
} else {
this.nextStepLoading = true
stepNextError(params).then(res => {
this.getDataList()
this.nextStepLoading = false
materialNextStepFlagError().then(res => {
this.submitButton = res.data === 0
})
})
}
},
nextMaterial() {
let params = this.passList.filter(item => item.operation == 1)[0]
let stepFlag = this.nextStepFlagError
if (params && params.state != 0 && stepFlag != -1 && stepFlag != 0) {
params = this.processing
params.stepFlag = stepFlag
materialNextError(params).then(res => {
this.getDataList()
})
setTimeout(() => {
materialNextStepFlagError().then(res => {
this.submitButton = res.data === 0
})
}, 500)
}
},
startProcess() {
let params = {
state: 5
}
materialAbnormalStart(params).then(res => {
if (res.data !== 0) {
materialNextStepFlagError().then(res => {
this.submitButton = res.data === 0
})
alert('开始轧制')
this.getDataList()
} else {
alert('该批次已经开始轧制')
}
})
},
finishProcess() {
stepCheck(this.processing.batchId).then(res => {
if (res.msg == -1) {
// get
stepFinishError(this.processing.batchId)
alert('该批次轧制完成')
this.dataList = []
this.passList = []
this.processing = { batchId: -1, id: null }
} else {
alert('该批次存在某道次尚未处理')
}
})
},
checkFinal() {
stepCheckAbnormal(this.processing.batchId).then(res => {
if (res.msg == -1) {
this.finalFlag = 1
this.dialogVisible = true
this.finalData = this.dataList
}
})
},
// 提交最终数据
submitFinalData() {
let data = this.finalData
materialFinalData(data).then(res => {
if (res.code === 200) {
this.$message('提交成功，请点击轧制完成')
this.dialogVisible = false
}
})
},
getDataList() {
//state==0表示并未送进轧制页面的新进材料
let params = {
state: 5
}
listMaterial(params).then(res => {
if (res.total != 0) {
this.batchSize = res.total
this.dataList = res.rows
this.processing = res.rows.filter(item => item.operation == 1)[0] ? res.rows.filter(item => item.operation == 1)[0] : {
batchId: -1,
id: null
}
if (this.processing.state === 3) {
params = this.processing
params.stepFlag = 1
materialNextError(params).then(res => {
this.getDataList()
})
setTimeout(() => {
materialNextStepFlagError().then(res => {
this.submitButton = res.data === 0
})
}, 500)
}
if (this.processing.batchId != -1 && this.processing.state != 3) {
this.getStepDataList()
if (this.newHTML) {
this.submitButtonCheck()
this.newHTML = false
}
}
}
})
},
getStepDataList() {
let params = {
materialId: this.processing.id,
delFlag: 1,
batchId: this.processing.batchId
}
stepProcess(params).then(res => {
this.passList = res.data
this.nextStepFlagError = res.data.filter(item => item.operation == 1)[0].state
this.nowPass = this.passList.filter(item => item.operation == 1)[0]
})
let nowPass = this.nowPass
let temp = nowPass.step % 8
if (temp === 1) {
this.circleStart = 0
} else if (temp === 2) {
this.circleStart = 90
} else if (temp === 3) {
this.circleStart = 45
} else if (temp === 0) {
this.circleStart = 315
} else if (temp === 4) {
this.circleStart = 135
} else if (temp === 5) {
this.circleStart = 180
} else if (temp === 6) {
this.circleStart = 225
} else if (temp === 7) {
this.circleStart = 270
}
},
getPLCData() {
let params = this.passList.filter(item => item.operation == 1)[0]
stepPLC(params).then(res => {
this.plcData = res.data
})
},
getFault() {
getFaultMessage().then(res => {
if (res.data !== 0) {
this.showFault = true
messageData(this.MessageParams).then(res => {
this.messageData = res.data
})
}
})
},
submitButtonCheck() {
materialNextStepFlagError().then(res => {
this.submitButton = res.data === 0
this.passList.forEach(item => {
if (item.operation === 1 && item.state === 0) {
this.submitButton = true
}
})
})
}
},
mounted() {
clearInterval(this.intervalTime)
this.getDataList() // 接口方法
this.intervalTime = setInterval(() => {
this.getFault()
this.getPLCData()
this.getDataList() // 接口方法
}, 3000)
},
computed: {},
created() {
newIP()
this.getFault()
materialNextStepFlagError().then(res => {
this.submitButton = res.data === 0
})
},
beforeDestroy() {
// 清除定时器
clearInterval(this.intervalTime)
}
}
</script>
<style scoped>
.imageCircle {
position: absolute;
width: 200px;
height: 200px;
}
.image-circle-rows {
z-index: 999;
position: relative;
width: 200px;
height: 200px;
}
.hxjx_root {
padding: 20px;
display: flex;
flex-wrap: wrap;
width: 100%;
font-size: 0.875rem;
}
.hxjx_navigator_info {
height: 40px;
border-radius: 5px;
position: relative;
font-size: 1rem;
font-weight: 700;
}
.hxjx_table_label_format {
word-break: keep-all;
white-space: nowrap;
}
.hxjx_table_text_rule {
color: red;
}
.hxjx_table_text {
width: 300px !important;
text-align: left;
padding: 6px;
}
.hxjx_table_label {
padding: 0px !important;
vertical-align: middle !important;
width: 100px;
}
.hxjx_table_text_left {
text-align: left;
}
.hxjx_btn_margin_right5 {
margin-right: 5px;
}
.hxjx_footer_main {
background-color: white;
border: solid 1px transparent !important;
}
.hxjx_table_btnColumn {
word-break: keep-all !important;
white-space: nowrap !important;
}
.hxjx_foot_btn_custom {
width: 90px !important;
margin-right: 5px;
}
/* 后添加的样式 */
.hxjx_footer_main {
text-align: right !important;
}
.hxjx_table_btnColumn {
border-top: 0 !important;
}
.hxjx_table_btn {
width: 50px !important;
margin: 2px;
}
.hxix_table_border {
border: 1px solid #CCC;
}
.table td, .table th {
padding: 0.5rem;
}
.hxjx_table_th {
background-color: rgb(91, 155, 213);
color: #fff;
}
.circle_finish {
width: 20px;
height: 20px;
background-color: #28a745;
border-radius: 50%;
}
.circle_error {
width: 20px;
height: 20px;
background-color: #dc3545;
border-radius: 50%;
}
.circle_unstart {
width: 20px;
height: 20px;
background-color: yellow;
border-radius: 50%;
}
.circle_unstart2 {
width: 20px;
height: 20px;
background-color: #ccc;
border-radius: 50%;
}
.table_td_warn {
background-color: yellow;
}
.table_td_error {
background-color: #ccc;
}
.table_td_unstart {
background-color: #eaeaea;
}
.kong {
display: flex;
justify-content: center;
}
.hxjx_table_text_rule {
color: red;
}
.hxjx_popup {
position: fixed;
left: 400px;
top: 200px;
width: 640px;
height: 360px;
font-size: 14px;
}
.hxjx_popup_header_danger {
width: 100%;
height: 40px;
padding: 9px;
background-color: #dc3545;
color: #fff;
}
.hxjx_popup_body_danger {
width: 100%;
height: 320px;
padding: 20px;
background-color: #fff;
border: 1px solid #dc3545;
}
</style>