wyw/EdgeManager
1
0
Fork 0
Code Issues 1 Pull Requests Packages Projects Releases Wiki Activity

设备配置增加规则验证、组件是否显示&修改设备节点添加、修改

Browse Source
This commit is contained in:
wu
2022-08-18 14:21:08 +08:00
parent aca5946dc2
commit bf18a739ae
3 changed files with 557 additions and 236 deletions
Download Patch File Download Diff File Expand all files Collapse all files

171
src/views/edgeServer/edgeServerConfigure/device.vue
View File

@@ -44,22 +44,11 @@
:defaultFormData="defaultFormData" />
</el-card>
<el-card class="box-card" style="margin-top:5px;">
<d2-crud ref="d2Crud"
:columns="columns"
:data="devicePointData"
:rowHandle="rowHandle"
add-title="新增"
edit-title="绑定"
:add-template="addTemplate"
:add-rules="addRules"
:form-options="formOptions"
@row-add="addDevicePoint"
@row-edit="devicePointBandingNode"
@row-remove="delDevicePoint"
@dialog-cancel="handleDialogCancel"
@banding="bandingNodeTemplate"
@cell-data-change="handleCellDataChange"
@form-data-change="handleFormDataChange">
<d2-crud ref="d2Crud" :columns="columns" :data="devicePointData" :rowHandle="rowHandle" add-title="新增"
edit-title="绑定" :add-template="addTemplate" :add-rules="addRules" :form-options="formOptions"
@row-add="addDevicePoint" @row-edit="devicePointBandingNode" @row-remove="delDevicePoint"
@dialog-cancel="handleDialogCancel" @banding="bandingNodeTemplate" @cell-data-change="handleCellDataChange"
@form-data-change="handleFormDataChange">
<el-button slot="header" style="margin-bottom: 5px" @click="addRow">新增</el-button>
</d2-crud>
</el-card>
@@ -85,7 +74,7 @@ export default {
components: {
DeviceConfigure: () => import('./deviceConfigure')
},
data () {
data() {
return {
active: '',
columns: [
@@ -115,10 +104,33 @@ export default {
},
{
title: '类型',
key: '@RequestType',
key: '@DataTypeCode',
component: {
name: 'el-input',
size: 'small'
name: 'el-select',
size: 'small',
options: [
{
value: 'string',
label: 'string (字符串)'
},
{
value: 'int',
label: 'int (整数)'
},
{
value: 'float',
label: 'float (浮点数)'
},
{
value: 'short',
label: 'short'
},
{
value: 'bool',
label: 'bool (逻辑值)'
}
]
}
},
{
@@ -161,7 +173,7 @@ export default {
text: '绑定',
size: 'mini',
emit: 'banding',
show (index, row) {
show(index, row) {
if (row.showBindButton) {
return true
}
@@ -171,7 +183,7 @@ export default {
{
text: '发送',
size: 'mini',
show (index, row) {
show(index, row) {
if (row.showSendButton) {
return true
}
@@ -181,7 +193,7 @@ export default {
{
text: '复制',
size: 'mini',
show (index, row) {
show(index, row) {
if (row.showCopyButton) {
return true
}
@@ -193,7 +205,7 @@ export default {
size: 'mini',
confirm: true,
show (index, row) {
show(index, row) {
if (row.showRemoveButton) {
return true
}
@@ -210,12 +222,45 @@ export default {
'@Name': {
title: '名称'
},
'@Address': {
title: '地址'
},
'@DisplayName': {
title: '显示名称'
},
'@RequestType': {
title: '类型'
title: '请求类型'
},
'@DataTypeCode': {
title: '数据类型',
component: {
name: 'el-select',
options: [
{
value: 'string',
label: 'string (字符串)'
},
{
value: 'int',
label: 'int (整数)'
},
{
value: 'float',
label: 'float (浮点数)'
},
{
value: 'short',
label: 'short'
},
{
value: 'bool',
label: 'bool (逻辑值)'
}
],
span: 12
}
},
'@RequestInterval': {
title: '采集周期(ms)'
@@ -232,11 +277,12 @@ export default {
},
addRules: {
'@Name': [{ required: true, type: 'string', message: '请输入名称', trigger: 'blur' }],
'@Address': [{ required: true, message: '请输入地址', trigger: 'blur' }],
'@RequestType': [{ required: true, type: 'string', message: '请选择类型', trigger: 'blur' }],
'@Address': [{ required: true, type: 'string', message: '请输入地址', trigger: 'blur' }],
'@DisplayName': [{ required: true, type: 'string', message: '请输入显示名称', trigger: 'blur' }],
'@RequestType': [{ required: true, type: 'string', message: '请输入请求类型', trigger: 'blur' }],
'@DataTypeCode': [{ required: true, type: 'string', message: '请选择类型', trigger: 'blur' }],
'@RequestInterval': [{ required: true, message: '请输入采集周期(ms)', trigger: 'blur' }],
'@Length': [{ required: true, message: '请输入长度', trigger: 'blur' }],
'@Value': [{ required: true, message: '请输入当前值', trigger: 'blur' }]
'@Length': [{ required: true, message: '请输入长度', trigger: 'blur' }]
},
serverData: {},
devicePointData: [],
@@ -252,7 +298,7 @@ export default {
},
watch: {
server: {
handler (val) {
handler(val) {
this.serverData = val
this.getDevice()
},
@@ -260,23 +306,23 @@ export default {
}
},
methods: {
addRow () {
addRow() {
this.$refs.d2Crud.showDialog({
mode: 'add'
})
},
handleFormDataChange ({ key }) {
handleFormDataChange({ key }) {
if (key === 'workingSubclass') {
const { workingSubclass } = this.$refs.d2Crud.formData
this.getCodesByWorkingSubclass(workingSubclass)
this.$refs.d2Crud.$forceUpdate()
}
},
handleCellDataChange ({ rowIndex, row }) {
handleCellDataChange({ rowIndex, row }) {
this.devicePointData[rowIndex] = row
this.setDeviceConfigure()
},
bandingNodeTemplate ({ index }) {
bandingNodeTemplate({ index }) {
this.$refs.d2Crud.showDialog({
mode: 'edit',
rowIndex: index,
@@ -303,14 +349,14 @@ export default {
}
})
},
handleDialogCancel (done) {
handleDialogCancel(done) {
this.$message({
message: '用户取消保存',
type: 'warning'
})
done()
},
handleCommand (command) {
handleCommand(command) {
switch (command) {
case 'add':
this.addDevice()
@@ -320,7 +366,7 @@ export default {
break
}
},
async getCodesByWorkingSubclass (workingSubclass) {
async getCodesByWorkingSubclass(workingSubclass) {
try {
const nodeCode = await this.$api.QUERY_CODES(workingSubclass)
const nodeCodeData = []
@@ -337,7 +383,7 @@ export default {
console.log(e)
}
},
async getworkingSubclasses () {
async getworkingSubclasses() {
try {
const workingSubclasses = await this.$api.QUERY_WORKING_SUBCLASSES()
const workingSubclassesData = []
@@ -350,7 +396,7 @@ export default {
console.log(e)
}
},
async getDevice () {
async getDevice() {
try {
this.deviceData = await this.$api.GET_DEVICE(this.serverData.id)
if (this.deviceData.length > 0) {
@@ -360,7 +406,7 @@ export default {
console.log(e)
}
},
async getDeviceConfigure (e) {
async getDeviceConfigure(e) {
this.deviceActiveStatus = e
this.devicePointData = [] // 当切换设备时把保存configure、point的数据清空
this.defaultDeviceName = ''
@@ -386,7 +432,7 @@ export default {
}
}
},
addDevice () {
addDevice() {
const that = this
this.$prompt('输入设备名称', '新加设备', {
confirmButtonText: '确定',
@@ -401,10 +447,8 @@ export default {
})
})
},
async delDevice () {
const url = 'http://8.sctmes.com:20522'
// 'http://'+ this.serverData.url +':'+ this.serverData.port
const deviceConfigure = await this.$api.GET_HSLSERVER_CONFIGURE(url, 'admin', '123456')
async delDevice() {
let deviceConfigure = await this.$api.GET_HSLSERVER_CONFIGURE('http://' + this.serverData.url + ':' + this.serverData.port, 'admin', '123456')
let deviceNode = deviceConfigure.Content.Settings.GroupNode[0].DeviceNode
if (deviceNode !== undefined && isArray(deviceNode)) {
deviceNode = filter(deviceNode, item => {
@@ -414,8 +458,9 @@ export default {
} else {
unset(deviceConfigure, 'Content.Settings.GroupNode[0].DeviceNode')
}
try {
await this.$api.SET_HSLSERVER_CONFIGURE(url, 'admin', '123456', { data: deviceConfigure.Content })
await this.$api.SET_HSLSERVER_CONFIGURE('http://' + this.serverData.url + ':' + this.serverData.port, 'admin', '123456', { data: deviceConfigure.Content })
await this.$api.DEL_DEVICE({ action: 'remove_device', id: this.deviceData[this.deviceActiveStatus].id })
this.$message({
message: '删除设备成功',
@@ -426,7 +471,7 @@ export default {
console.log(e)
}
},
async addDevicePoint (row, done) {
async addDevicePoint(row, done) {
this.formOptions.saveLoading = true
if (!this.$refs.deviceConfigure.defaultDeviceTypeNameValue) {
this.$message({
@@ -442,12 +487,14 @@ export default {
}
this.formOptions.saveLoading = false
},
async delDevicePoint ({ index, row }, done) {
this.$refs.deviceConfigure.deviceConfigureModelValue.RequestNode = this.devicePointData.splice(index, 1)
async delDevicePoint({ index, row }, done) {
this.devicePointData.splice(index, 1)
this.$refs.deviceConfigure.deviceConfigureModelValue.RequestNode = this.devicePointData
await this.setDeviceConfigure()
done()
},
async getDevicePoint () {
async getDevicePoint() {
const data = { action: 'add_node', server_id: this.serverData.id, device_id: this.deviceData[this.deviceActiveStatus].id }
try {
this.devicePointData = await this.$api.GET_DEVICE_POINT(data)
@@ -455,16 +502,20 @@ export default {
console.log(e)
}
},
async devicePointBandingNode ({ index, row }, done) {
async devicePointBandingNode({ index, row }, done) {
this.devicePointData[index]['@Binding'] = row.nodeCode
this.setDeviceConfigure()
done()
},
async setDeviceConfigure () {
async setDeviceConfigure() {
try {
const url = 'http://8.sctmes.com:20522'
// 'http://'+ this.serverData.url +':'+ this.serverData.port
const deviceConfigure = await this.$api.GET_HSLSERVER_CONFIGURE(url, 'admin', '123456')
// 验证表单
this.$refs.deviceConfigure.$refs.form.validate((valid) => {
if (!valid) {
return false
}
})
const deviceConfigure = await this.$api.GET_HSLSERVER_CONFIGURE('http://' + this.serverData.url + ':' + this.serverData.port, 'admin', '123456')
if (this.devicePointData.length > 0) {
const devicePointData = this.devicePointData
each(devicePointData, (item) => {
@@ -478,7 +529,6 @@ export default {
this.$refs.deviceConfigure.deviceConfigureModelValue.RequestNode = devicePointData
}
this.$refs.deviceConfigure.deviceConfigureModelValue['@Name'] = this.deviceData[this.deviceActiveStatus].name
let deviceNode = deviceConfigure.Content.Settings.GroupNode[0].DeviceNode || []
let isExist = false
if (deviceNode !== undefined) {
@@ -495,10 +545,9 @@ export default {
if (!isExist) {
deviceNode.push(this.$refs.deviceConfigure.deviceConfigureModelValue)
}
deviceConfigure.Content.Settings.GroupNode[0].DeviceNode = deviceNode
await this.$api.SET_HSLSERVER_CONFIGURE('http://' + this.serverData.url + ':' + this.serverData.port, 'admin', '123456', { data: deviceConfigure.Content })
this.$refs.deviceConfigure.deviceConfigureModelValue.DeviceTypeName = this.$refs.deviceConfigure.defaultDeviceTypeNameValue
await this.$api.SET_HSLSERVER_CONFIGURE(url, 'admin', '123456', { data: deviceConfigure.Content })
const data = {
action: 'update_device',
conf: JSON.stringify(this.$refs.deviceConfigure.deviceConfigureModelValue),
@@ -513,7 +562,7 @@ export default {
console.log(e)
}
},
getDeviceStatus () {
getDeviceStatus() {
this.$api.GET_DEVICE_STATUS(this.serverData.id).then(res => {
each(this.deviceData, (item) => {
if (item.id in res.device_status) {
@@ -524,7 +573,7 @@ export default {
})
}
},
mounted () {
mounted() {
this.getDevice()
this.getworkingSubclasses()
// setInterval(this.getDeviceStatus, 2000)

54
src/views/edgeServer/edgeServerConfigure/deviceConfigure.vue
View File

@@ -1,6 +1,7 @@
<template>
<div>
<el-form :inline="true" size="mini" label-position="right" class="demo-form-inline">
<el-form :inline="true" size="mini" :model="deviceConfigureModelValue" ref="form" :rules="rules"
label-position="right" class="demo-form-inline">
<el-form-item label="设备">
<el-select @change="deviceChange" v-model="defaultDeviceTypeNameValue" placeholder="请选择">
<el-option v-for="item in deviceTypeData" :key="item" :label="item" :value="item">
@@ -8,33 +9,30 @@
</el-select>
</el-form-item>
<el-form-item v-for="(item, i) in deviceConfigureFormItem" :key="i" :label="item.labelName">
<template v-if="item.type === 'text'">
<el-input v-model='deviceConfigureModelValue[item.key]' :disabled="item.disabled"
:placeholder="item.placeholder"></el-input>
</template>
<template v-for="(item, i) in deviceConfigureFormItem">
<el-form-item :key="i" :label="item.labelName" :prop="item.key" v-if="!item.isShow">
<template v-if="item.type === 'text'">
<el-input v-model='deviceConfigureModelValue[item.key]' :disabled="item.disabled"
:placeholder="item.placeholder"></el-input>
</template>
<template v-if="item.type === 'select'">
<el-select v-model='deviceConfigureModelValue[item.key]' style="width:80px" :disabled="item.disabled"
:placeholder="item.placeholder">
<el-option v-for="index in item.option" :key="index.value" :label="index.label" :value="index.value">
</el-option>
</el-select>
</template>
<template v-if="item.type === 'select'">
<el-select v-model='deviceConfigureModelValue[item.key]' style="width:80px" :disabled="item.disabled"
:placeholder="item.placeholder">
<el-option v-for="index in item.option" :key="index.value" :label="index.label" :value="index.value">
</el-option>
</el-select>
</template>
<template v-if="item.type === 'time'">
<el-date-picker
v-model='deviceConfigureModelValue[item.key]'
type="datetime"
:placeholder="item.placeholder"
value-format='yyyy-MM-dd HH:mm:ss'
format='yyyy-MM-dd HH:mm:ss'
:disabled="item.disabled"
style="width:180px">
</el-date-picker>
</template>
<template v-if="item.type === 'time'">
<el-date-picker v-model='deviceConfigureModelValue[item.key]' type="datetime"
:placeholder="item.placeholder" value-format='yyyy-MM-dd HH:mm:ss' format='yyyy-MM-dd HH:mm:ss'
:disabled="item.disabled" style="width:180px">
</el-date-picker>
</template>
</el-form-item>
</el-form-item>
</template>
</el-form>
</div>
</template>
@@ -79,6 +77,7 @@ export default {
deviceConfigureFormItem: [],
defaultDeviceTypeNameValue: '',
deviceConfigureModelValue: {},
rules: {},
deviceSelectedVlaue: '',
deviceTypeData: [
]
@@ -88,13 +87,18 @@ export default {
deviceChange (e) {
// 获取所有字符串的key 用于v-model渲染
const deviceConfigureModelValue = {}
const rules = {}
each(deviceConfigureFormItemData[e], (item) => {
if (item.type === 'time') {
deviceConfigureModelValue[item.key] = item.defaultValue ? item.defaultValue : new Date()
} else {
deviceConfigureModelValue[item.key] = item.defaultValue ? item.defaultValue : ''
}
if (item.rules !== undefined) {
rules[item.key] = item.rules
}
})
this.rules = rules
this.deviceConfigureModelValue = deviceConfigureModelValue
this.deviceConfigureFormItem = deviceConfigureFormItemData[e]
},

568
src/views/edgeServer/edgeServerConfigure/deviceSetting/index.json
View File

File diff suppressed because it is too large Load Diff