10 changed files with 653 additions and 196 deletions
@ -0,0 +1,389 @@ |
|||
<template> |
|||
<!--自动门--> |
|||
<div> |
|||
<el-card class="box-card" shadow="never"> |
|||
<div slot="header" class="clearfix"> |
|||
<span class="role-span">扩展字段：</span> |
|||
</div> |
|||
<el-form ref="form" :inline="true" :model="form" :rules="rules" size="small" label-width="78px"> |
|||
<el-row> |
|||
<!-- <el-col :span="8"> |
|||
<el-form-item label="颜色" label-width="150px"> |
|||
<el-select |
|||
v-model="form.color" |
|||
placeholder="无" |
|||
clearable |
|||
filterable |
|||
> |
|||
<el-option |
|||
v-for="item in colorList" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
/> |
|||
</el-select> |
|||
</el-form-item> |
|||
</el-col>--> |
|||
</el-row> |
|||
</el-form> |
|||
</el-card> |
|||
|
|||
<el-card class="box-card" shadow="never"> |
|||
<div slot="header" class="clearfix"> |
|||
<span class="role-span">设备协议：</span> |
|||
</div> |
|||
|
|||
<el-row> |
|||
<el-col :span="12"> |
|||
OpcServer: |
|||
<el-select |
|||
v-model="opc_id" |
|||
placeholder="无" |
|||
clearable |
|||
filterable |
|||
@change="changeOpc" |
|||
> |
|||
<el-option |
|||
v-for="item in dataOpcservers" |
|||
:key="item.opc_id" |
|||
:label="item.opc_name" |
|||
:value="item.opc_id" |
|||
/> |
|||
</el-select> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
PLC: |
|||
<el-select |
|||
v-model="plc_id" |
|||
placeholder="无" |
|||
clearable |
|||
@change="changePlc" |
|||
> |
|||
<el-option |
|||
v-for="item in dataOpcPlcs" |
|||
:key="item.plc_id" |
|||
:label="item.plc_name" |
|||
:value="item.plc_id" |
|||
/> |
|||
</el-select> |
|||
</el-col> |
|||
</el-row> |
|||
</el-card> |
|||
|
|||
<el-card class="box-card" shadow="never"> |
|||
<div slot="header" class="clearfix"> |
|||
<span class="role-span">PLC读取字段：</span> |
|||
</div> |
|||
<el-form ref="form" :inline="true" :model="form" :rules="rules" size="small" label-width="78px"> |
|||
<el-table |
|||
v-loading="false" |
|||
:data="data1" |
|||
:max-height="550" |
|||
size="small" |
|||
style="width: 100%;margin-bottom: 15px" |
|||
> |
|||
|
|||
<el-table-column prop="name" label="用途" /> |
|||
<el-table-column prop="code" label="别名要求" /> |
|||
<el-table-column prop="db" label="DB块"> |
|||
<template slot-scope="scope"> |
|||
<el-input |
|||
v-model="data1[scope.$index].db" |
|||
size="mini" |
|||
class="edit-input" |
|||
@input="finishReadEdit(data1[scope.$index])" |
|||
/> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column prop="dbr_value"> |
|||
<template slot="header"> |
|||
<el-link type="primary" :underline="false" @click.native="test_read1()">测试读</el-link> |
|||
</template> |
|||
<template slot-scope="scope"> |
|||
<el-input v-model="data1[scope.$index].dbr_value" size="mini" class="edit-input" /> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
</el-form> |
|||
</el-card> |
|||
|
|||
<el-card class="box-card" shadow="never"> |
|||
<div slot="header" class="clearfix"> |
|||
<span class="role-span">PLC写入字段：</span> |
|||
</div> |
|||
<el-form ref="form" :inline="true" :model="form" :rules="rules" size="small" label-width="78px"> |
|||
<el-table |
|||
v-loading="false" |
|||
:data="data2" |
|||
:max-height="550" |
|||
size="small" |
|||
style="width: 100%;margin-bottom: 15px" |
|||
> |
|||
|
|||
<el-table-column prop="name" label="用途" /> |
|||
<el-table-column prop="code" label="别名要求" /> |
|||
<el-table-column prop="db" label="DB块"> |
|||
<template slot-scope="scope"> |
|||
<el-input |
|||
v-model="data2[scope.$index].db" |
|||
size="mini" |
|||
class="edit-input" |
|||
@input="finishWriteEdit(data2[scope.$index])" |
|||
/> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column prop="dbr_value2"> |
|||
<template slot="header"> |
|||
<el-link type="primary" :underline="false" @click.native="test_read2()">测试读</el-link> |
|||
</template> |
|||
<template slot-scope="scope"> |
|||
<el-input v-model="data2[scope.$index].dbr_value" size="mini" class="edit-input" /> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column prop="dbw_value"> |
|||
<template slot="header"> |
|||
<el-link type="primary" :underline="false" @click.native="test_write1()">测试写</el-link> |
|||
</template> |
|||
<template slot-scope="scope"> |
|||
<el-input v-model="data2[scope.$index].dbw_value" size="mini" class="edit-input" /> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
</el-form> |
|||
</el-card> |
|||
|
|||
<el-card class="box-card" shadow="never"> |
|||
<div slot="header" class="clearfix"> |
|||
<span class="role-span" /> |
|||
<el-button |
|||
:loading="false" |
|||
icon="el-icon-check" |
|||
size="mini" |
|||
style="float: right; padding: 6px 9px" |
|||
type="primary" |
|||
@click="doSubmit" |
|||
>保存 |
|||
</el-button> |
|||
</div> |
|||
</el-card> |
|||
|
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { |
|||
queryDriverConfig, |
|||
updateConfig, |
|||
testRead, |
|||
testwrite |
|||
} from '@/api/acs/device/driverConfig' |
|||
import { selectOpcList } from '@/api/acs/device/opc' |
|||
import { selectPlcList } from '@/api/acs/device/opcPlc' |
|||
import { selectListByOpcID } from '@/api/acs/device/opcPlc' |
|||
|
|||
import crud from '@/mixins/crud' |
|||
import deviceCrud from '@/api/acs/device/device' |
|||
|
|||
export default { |
|||
name: 'LampThreeColor', |
|||
dicts: ['is_yes_not'], |
|||
mixins: [crud], |
|||
props: { |
|||
parentForm: { |
|||
type: Object, |
|||
require: true |
|||
} |
|||
}, |
|||
data() { |
|||
return { |
|||
device_code: '', |
|||
device_id: '', |
|||
plc_id: '', |
|||
plc_code: '', |
|||
opc_id: '', |
|||
opc_code: '', |
|||
configLoading: false, |
|||
dataOpcservers: [], |
|||
dataOpcPlcs: [], |
|||
deviceList: [], |
|||
data1: [], |
|||
data2: [], |
|||
form: { |
|||
inspect_in_stocck: true, |
|||
ignore_pickup_check: true, |
|||
ignore_release_check: true, |
|||
apply_task: true, |
|||
manual_create_task: true, |
|||
is_pickup: true, |
|||
is_release: true, |
|||
link_device_code: [] |
|||
}, |
|||
rules: {} |
|||
} |
|||
}, |
|||
created() { |
|||
this.$nextTick(() => { |
|||
// 从父表单获取设备编码 |
|||
this.device_id = this.$props.parentForm.device_id |
|||
this.device_code = this.$props.parentForm.device_code |
|||
queryDriverConfig(this.device_id, this.$props.parentForm.driver_code).then(data => { |
|||
// 给表单赋值，并且属性不能为空 |
|||
if (data.form) { |
|||
const arr = Object.keys(data.form) |
|||
// 不为空 |
|||
if (arr.length > 0) { |
|||
this.form = data.form |
|||
} |
|||
} |
|||
|
|||
// 给表单赋值，并且属性不能为空 |
|||
if (data.parentForm) { |
|||
const arr = Object.keys(data.parentForm) |
|||
// 不为空 |
|||
if (arr.length > 0) { |
|||
this.opc_code = data.parentForm.opc_code |
|||
this.plc_code = data.parentForm.plc_code |
|||
} |
|||
} |
|||
this.data1 = data.rs |
|||
this.data2 = data.ws |
|||
this.sliceItem() |
|||
}) |
|||
selectPlcList().then(data => {updateConfig |
|||
this.dataOpcPlcs = data |
|||
this.plc_id = this.$props.parentForm.opc_plc_id |
|||
}) |
|||
selectOpcList().then(data => { |
|||
this.dataOpcservers = data |
|||
this.opc_id = this.$props.parentForm.opc_server_id |
|||
}) |
|||
deviceCrud.selectDeviceList().then(data => { |
|||
this.deviceList = data |
|||
}) |
|||
}) |
|||
}, |
|||
methods: { |
|||
changeOpc(val) { |
|||
this.dataOpcservers.forEach(item => { |
|||
if (item.opc_id === val) { |
|||
this.opc_code = item.opc_code |
|||
} |
|||
}) |
|||
|
|||
selectListByOpcID(val).then(data => { |
|||
this.dataOpcPlcs = data |
|||
this.plc_id = '' |
|||
this.plc_code = '' |
|||
if (this.dataOpcPlcs && this.dataOpcPlcs.length > 0) { |
|||
this.plc_id = this.dataOpcPlcs[0].plc_id |
|||
this.plc_code = this.dataOpcPlcs[0].plc_code |
|||
} |
|||
this.sliceItem() |
|||
}) |
|||
}, |
|||
finishReadEdit(data) { |
|||
// 编辑的是code列,并且值包含mode |
|||
if (data.code.indexOf('mode') !== -1) { |
|||
const dbValue = data.db |
|||
// .之前的字符串 |
|||
const beforeStr = dbValue.match(/(\S*)\./)[1] |
|||
// .之后的字符串 |
|||
const afterStr = dbValue.match(/\.(\S*)/)[1] |
|||
// 取最后数字 |
|||
const endNumber = afterStr.substring(1) |
|||
// 最后为非数字 |
|||
if (isNaN(parseInt(endNumber))) { |
|||
return |
|||
} |
|||
for (const val in this.data1) { |
|||
if (this.data1[val].code.indexOf('action') !== -1) { |
|||
this.data1[val].db = beforeStr + '.' + afterStr.substring(0, 1) + (parseInt(endNumber) + 1) |
|||
} |
|||
if (this.data1[val].code.indexOf('error') !== -1) { |
|||
this.data1[val].db = beforeStr + '.' + afterStr.substring(0, 1) + (parseInt(endNumber) + 3) |
|||
} |
|||
} |
|||
} |
|||
}, |
|||
changePlc(val) { |
|||
this.dataOpcPlcs.forEach(item => { |
|||
if (item.plc_id === val) { |
|||
this.plc_code = item.plc_code |
|||
this.sliceItem() |
|||
return |
|||
} |
|||
}) |
|||
}, |
|||
test_read2() { |
|||
testRead(this.data2, this.opc_id).then(data => { |
|||
this.data2 = data |
|||
console.log(this.data2) |
|||
this.notify('操作成功!', 'success') |
|||
}).catch(err => { |
|||
console.log(err.response.data.message) |
|||
}) |
|||
}, |
|||
test_read1() { |
|||
testRead(this.data1, this.opc_id).then(data => { |
|||
this.data1 = data |
|||
this.notify('操作成功!', 'success') |
|||
}).catch(err => { |
|||
console.log(err.response.data.message) |
|||
}) |
|||
}, |
|||
test_write1() { |
|||
testwrite(this.data2, this.opc_id).then(data => { |
|||
this.notify('操作成功!', 'success') |
|||
}).catch(err => { |
|||
console.log(err.response.data.message) |
|||
}) |
|||
}, |
|||
doSubmit() { |
|||
this.$refs['form'].validate((valid) => { |
|||
if (valid) { |
|||
this.configLoading = true |
|||
// 根据驱动类型判断是否为路由设备 |
|||
const parentForm = this.parentForm |
|||
parentForm.is_route = true |
|||
parentForm.plc_id = this.plc_id |
|||
parentForm.opc_id = this.opc_id |
|||
updateConfig(parentForm, this.form, {}, this.data1, this.data2).then(res => { |
|||
this.notify('保存成功', 'success') |
|||
this.configLoading = false |
|||
}).catch(err => { |
|||
this.configLoading = false |
|||
console.log(err.response.data.message) |
|||
}) |
|||
} |
|||
}) |
|||
}, |
|||
sliceItem() { // 拼接DB的Item值 |
|||
this.data1.forEach(item => { |
|||
const str = item.code |
|||
// 是否包含. |
|||
if (str.search('.') !== -1) { |
|||
// 截取最后一位 |
|||
item.code = this.opc_code + '.' + this.plc_code + '.' + this.device_code + '.' + str.slice(str.lastIndexOf('.') + 1) |
|||
} else { |
|||
item.code = this.opc_code + '.' + this.plc_code + '.' + this.device_code + '.' + item.code |
|||
} |
|||
}) |
|||
this.data2.forEach(item => { |
|||
const str = item.code |
|||
// 是否包含. |
|||
if (str.search('.') !== -1) { |
|||
// 截取最后一位 |
|||
item.code = this.opc_code + '.' + this.plc_code + '.' + this.device_code + '.' + str.slice(str.lastIndexOf('.') + 1) |
|||
} else { |
|||
item.code = this.opc_code + '.' + this.plc_code + '.' + this.device_code + '.' + item.code |
|||
} |
|||
}) |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style scoped> |
|||
|
|||
</style> |
|||
|
|||
Loading…
Reference in new issue