修改设备添加、删除,修复动态组件日期格式

This commit is contained in:
wu
2022-08-17 00:05:22 +08:00
parent 0ed5eddd9a
commit ce6e09b03b
5 changed files with 224 additions and 165 deletions

View File

@@ -72,7 +72,14 @@ export default ({ service, request, serviceForMock, requestForMock, mock, faker,
GET_DEVICE_CONFIGURE (id) { GET_DEVICE_CONFIGURE (id) {
return request({ url: '?query=device&id=' + id }) return request({ url: '?query=device&id=' + id })
}, },
GET_SERVE_MONITORING () { GET_SERVE_DEVICE_MONITORING (url, username, password) {
return request({ url: '?query=all_status' }) return request({
auth: {
username: username,
password: password
},
method: 'get',
url: url + '/Edge/DeviceData'
})
} }
}) })

View File

@@ -6,9 +6,9 @@
<div slot="header" class="menu-header"> <div slot="header" class="menu-header">
<div class="header-title">设备</div> <div class="header-title">设备</div>
<el-dropdown size="small" style="vertical-align: middle;" @command="handleCommand"> <el-dropdown size="small" style="vertical-align: middle;" @command="handleCommand">
<el-button type="primary" round > <el-button type="primary" round>
<i class="el-icon-s-tools" style="font-size:14px;"></i><i <i class="el-icon-s-tools" style="font-size:14px;"></i><i class="el-icon-arrow-down el-icon--right"
class="el-icon-arrow-down el-icon--right" style="font-size:14px;"></i> style="font-size:14px;"></i>
</el-button> </el-button>
<el-dropdown-menu slot="dropdown"> <el-dropdown-menu slot="dropdown">
<el-dropdown-item command="add">新加设备</el-dropdown-item> <el-dropdown-item command="add">新加设备</el-dropdown-item>
@@ -20,10 +20,8 @@
</el-dropdown> </el-dropdown>
</div> </div>
<el-menu :style="{ 'borderRight': 'none' }" :defaultActive="deviceActiveStatus" <el-menu :style="{ 'borderRight': 'none' }" :defaultActive="deviceActiveStatus" @select="getDeviceConfigure">
@select="getDeviceConfigure"> <el-menu-item class="serve-item" shadow="always" v-for="(item, i) in deviceData" :key="i" :index="i + ''">
<el-menu-item class="serve-item" shadow="always" v-for="(item, i) in deviceData" :key="i"
:index="i + ''">
<div style="position:relative;"> <div style="position:relative;">
<div style="display:inline-block;">{{ item.name }}</div> <div style="display:inline-block;">{{ item.name }}</div>
<div <div
@@ -42,7 +40,8 @@
<div class="header-title">设备配置</div> <div class="header-title">设备配置</div>
<el-button class="header-button" type="primary" @click="setDeviceConfigure">应用</el-button> <el-button class="header-button" type="primary" @click="setDeviceConfigure">应用</el-button>
</div> </div>
<device-configure ref="deviceConfigure" :defaultDeviceName="defaultDeviceName" :defaultFormData="defaultFormData" /> <device-configure ref="deviceConfigure" :defaultDeviceName="defaultDeviceName"
:defaultFormData="defaultFormData" />
</el-card> </el-card>
<el-card class="box-card" style="margin-top:5px;"> <el-card class="box-card" style="margin-top:5px;">
<d2-crud ref="d2Crud" <d2-crud ref="d2Crud"
@@ -71,11 +70,16 @@
<script> <script>
import { each, assign } from 'lodash' import { each, assign, unset, filter, isArray, map } from 'lodash'
export default { export default {
props: { props: {
server_id: { server: {
default: 0 default: {
id: 0,
url: '',
port: ''
}
} }
}, },
components: { components: {
@@ -93,7 +97,6 @@ export default {
title: '名称', title: '名称',
key: '@Name', key: '@Name',
component: { component: {
size: 'small' size: 'small'
} }
}, },
@@ -235,7 +238,7 @@ export default {
'@Length': [{ required: true, message: '请输入长度', trigger: 'blur' }], '@Length': [{ required: true, message: '请输入长度', trigger: 'blur' }],
'@Value': [{ required: true, message: '请输入当前值', trigger: 'blur' }] '@Value': [{ required: true, message: '请输入当前值', trigger: 'blur' }]
}, },
serverId: 0, serverData: {},
devicePointData: [], devicePointData: [],
nodeCodeData: [], nodeCodeData: [],
workingSubclasses: [], workingSubclasses: [],
@@ -248,9 +251,9 @@ export default {
} }
}, },
watch: { watch: {
server_id: { server: {
handler (val) { handler (val) {
this.serverId = val this.serverData = val
this.getDevice() this.getDevice()
}, },
immediate: true immediate: true
@@ -273,9 +276,10 @@ export default {
this.devicePointData[rowIndex] = row this.devicePointData[rowIndex] = row
this.setDeviceConfigure() this.setDeviceConfigure()
}, },
bandingNodeTemplate () { bandingNodeTemplate ({ index }) {
this.$refs.d2Crud.showDialog({ this.$refs.d2Crud.showDialog({
mode: 'edit', mode: 'edit',
rowIndex: index,
template: { template: {
workingSubclass: { workingSubclass: {
title: '工序编码', title: '工序编码',
@@ -348,7 +352,7 @@ export default {
}, },
async getDevice () { async getDevice () {
try { try {
this.deviceData = await this.$api.GET_DEVICE(this.serverId) this.deviceData = await this.$api.GET_DEVICE(this.serverData.id)
if (this.deviceData.length > 0) { if (this.deviceData.length > 0) {
this.getDeviceConfigure(this.deviceActiveStatus) this.getDeviceConfigure(this.deviceActiveStatus)
} }
@@ -361,10 +365,11 @@ export default {
this.devicePointData = [] // 当切换设备时把保存configure、point的数据清空 this.devicePointData = [] // 当切换设备时把保存configure、point的数据清空
this.defaultDeviceName = '' this.defaultDeviceName = ''
const deviceData = await this.$api.GET_DEVICE_CONFIGURE(this.deviceData[e].id) const deviceData = await this.$api.GET_DEVICE_CONFIGURE(this.deviceData[e].id)
if (deviceData[0].conf) { if (deviceData[0].conf) {
const conf = JSON.parse(deviceData[0].conf) const conf = JSON.parse(deviceData[0].conf)
if (conf['@Name'] !== undefined) { if (conf.DeviceTypeName !== undefined) {
this.defaultDeviceName = conf['@Name'] this.defaultDeviceName = conf.DeviceTypeName
this.defaultFormData = conf this.defaultFormData = conf
} }
// 获取point信息 // 获取point信息
@@ -388,7 +393,7 @@ export default {
inputPattern: /^[\s\S]*.*[^\s][\s\S]*$/, inputPattern: /^[\s\S]*.*[^\s][\s\S]*$/,
inputErrorMessage: '请输入设备名称' inputErrorMessage: '请输入设备名称'
}).then(({ value }) => { }).then(({ value }) => {
this.$api.ADD_DEVICE({ action: 'add_device', name: value, server_id: this.serverId }) this.$api.ADD_DEVICE({ action: 'add_device', name: value, server_id: this.serverData.id })
that.getDevice() that.getDevice()
this.$message({ this.$message({
message: '新加设备成功', message: '新加设备成功',
@@ -397,7 +402,20 @@ export default {
}) })
}, },
async delDevice () { 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')
let deviceNode = deviceConfigure.Content.Settings.GroupNode[0].DeviceNode
if (deviceNode !== undefined && isArray(deviceNode)) {
deviceNode = filter(deviceNode, item => {
return item['@Name'] === this.deviceData[this.deviceActiveStatus].name ? null : item
})
deviceConfigure.Content.Settings.GroupNode[0].DeviceNode = deviceNode
} else {
unset(deviceConfigure, 'Content.Settings.GroupNode[0].DeviceNode')
}
try { try {
await this.$api.SET_HSLSERVER_CONFIGURE(url, 'admin', '123456', { data: deviceConfigure.Content })
await this.$api.DEL_DEVICE({ action: 'remove_device', id: this.deviceData[this.deviceActiveStatus].id }) await this.$api.DEL_DEVICE({ action: 'remove_device', id: this.deviceData[this.deviceActiveStatus].id })
this.$message({ this.$message({
message: '删除设备成功', message: '删除设备成功',
@@ -410,7 +428,7 @@ export default {
}, },
async addDevicePoint (row, done) { async addDevicePoint (row, done) {
this.formOptions.saveLoading = true this.formOptions.saveLoading = true
if (!this.$refs.defaultDeviceTypeNameValue) { if (!this.$refs.deviceConfigure.defaultDeviceTypeNameValue) {
this.$message({ this.$message({
message: '请先应用设备配置', message: '请先应用设备配置',
type: 'error' type: 'error'
@@ -430,7 +448,7 @@ export default {
done() done()
}, },
async getDevicePoint () { async getDevicePoint () {
const data = { action: 'add_node', server_id: this.serverId, device_id: this.deviceData[this.deviceActiveStatus].id } const data = { action: 'add_node', server_id: this.serverData.id, device_id: this.deviceData[this.deviceActiveStatus].id }
try { try {
this.devicePointData = await this.$api.GET_DEVICE_POINT(data) this.devicePointData = await this.$api.GET_DEVICE_POINT(data)
} catch (e) { } catch (e) {
@@ -444,19 +462,48 @@ export default {
}, },
async setDeviceConfigure () { async setDeviceConfigure () {
try { try {
const deviceConfigure = await this.$api.GET_HSLSERVER_CONFIGURE('http://8.sctmes.com:20522', 'admin', '123456') 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')
if (this.devicePointData.length > 0) { if (this.devicePointData.length > 0) {
this.$refs.deviceConfigure.deviceConfigureModelValue.RequestNode = this.devicePointData const devicePointData = this.devicePointData
each(devicePointData, (item) => {
unset(item, 'id')
unset(item, 'showBindButton')
unset(item, 'showCopyButton')
unset(item, 'showRemoveButton')
unset(item, 'showSendButton')
item['@Binding'] = item['@Binding'] || ''
})
this.$refs.deviceConfigure.deviceConfigureModelValue.RequestNode = devicePointData
} }
console.log(this.$refs.deviceConfigure.deviceConfigureModelValue) this.$refs.deviceConfigure.deviceConfigureModelValue['@Name'] = this.deviceData[this.deviceActiveStatus].name
deviceConfigure.Content.Settings.GroupNode[0].DeviceNode = [this.$refs.deviceConfigure.deviceConfigureModelValue]
await this.$api.SET_HSLSERVER_CONFIGURE('http://8.sctmes.com:20522', 'admin', '123456', { data: deviceConfigure.Content }) let deviceNode = deviceConfigure.Content.Settings.GroupNode[0].DeviceNode || []
let isExist = false
if (deviceNode !== undefined) {
deviceNode = isArray(deviceNode) ? deviceNode : [deviceNode]
deviceNode = map(deviceNode, (item) => {
if (item['@Name'] === this.deviceData[this.deviceActiveStatus].name) {
isExist = true
item = this.$refs.deviceConfigure.deviceConfigureModelValue
}
return item
})
}
if (!isExist) {
deviceNode.push(this.$refs.deviceConfigure.deviceConfigureModelValue)
}
deviceConfigure.Content.Settings.GroupNode[0].DeviceNode = deviceNode
this.$refs.deviceConfigure.deviceConfigureModelValue.DeviceTypeName = this.$refs.deviceConfigure.defaultDeviceTypeNameValue
await this.$api.SET_HSLSERVER_CONFIGURE(url, 'admin', '123456', { data: deviceConfigure.Content })
const data = { const data = {
action: 'update_device', action: 'update_device',
conf: JSON.stringify(this.$refs.deviceConfigure.deviceConfigureModelValue), conf: JSON.stringify(this.$refs.deviceConfigure.deviceConfigureModelValue),
id: this.deviceData[this.deviceActiveStatus].id id: this.deviceData[this.deviceActiveStatus].id
} }
this.$api.SET_DEVICE_CONFIGURE(data) this.$api.SET_DEVICE_CONFIGURE(data)
this.$message({ this.$message({
message: '操作成功', message: '操作成功',
@@ -467,7 +514,7 @@ export default {
} }
}, },
getDeviceStatus () { getDeviceStatus () {
this.$api.GET_DEVICE_STATUS(this.serverId).then(res => { this.$api.GET_DEVICE_STATUS(this.serverData.id).then(res => {
each(this.deviceData, (item) => { each(this.deviceData, (item) => {
if (item.id in res.device_status) { if (item.id in res.device_status) {
item.status = res.device_status[item.id] item.status = res.device_status[item.id]
@@ -480,7 +527,7 @@ export default {
mounted () { mounted () {
this.getDevice() this.getDevice()
this.getworkingSubclasses() this.getworkingSubclasses()
setInterval(this.getDeviceStatus, 2000) // setInterval(this.getDeviceStatus, 2000)
} }
} }
</script> </script>

View File

@@ -17,15 +17,20 @@
<template v-if="item.type === 'select'"> <template v-if="item.type === 'select'">
<el-select v-model='deviceConfigureModelValue[item.key]' style="width:80px" :disabled="item.disabled" <el-select v-model='deviceConfigureModelValue[item.key]' style="width:80px" :disabled="item.disabled"
:placeholder="item.placeholder"> :placeholder="item.placeholder">
<el-option v-for="index in item.option" :key="index.value" :label="index.label" <el-option v-for="index in item.option" :key="index.value" :label="index.label" :value="index.value">
:value="index.value">
</el-option> </el-option>
</el-select> </el-select>
</template> </template>
<template v-if="item.type === 'time'"> <template v-if="item.type === 'time'">
<el-date-picker v-model='deviceConfigureModelValue[item.key]' type="datetime" :placeholder="item.placeholder" <el-date-picker
defaultValue="2022-06-17 16:36:00" :disabled="item.disabled" style="width:180px"> 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> </el-date-picker>
</template> </template>

View File

@@ -13,8 +13,8 @@
"type":"text", "type":"text",
"placeholder":"", "placeholder":"",
"key":"@Name", "key":"@Name",
"disabled":false, "disabled":true,
"defaultValue":"" "defaultValue":"三菱PLC-MC"
}, },
{ {
"labelName":"Description", "labelName":"Description",
@@ -147,8 +147,8 @@
"type":"text", "type":"text",
"placeholder":"", "placeholder":"",
"key":"@Name", "key":"@Name",
"disabled":false, "disabled":true,
"defaultValue":"" "defaultValue":"三菱PLC-A1E"
}, },
{ {
"labelName":"Description", "labelName":"Description",
@@ -273,8 +273,8 @@
"type":"text", "type":"text",
"placeholder":"", "placeholder":"",
"key":"@Name", "key":"@Name",
"disabled":false, "disabled":true,
"defaultValue":"" "defaultValue":"三菱PLC-MC-UDP"
}, },
{ {
"labelName":"Description", "labelName":"Description",
@@ -407,8 +407,8 @@
"type":"text", "type":"text",
"placeholder":"", "placeholder":"",
"key":"@Name", "key":"@Name",
"disabled":false, "disabled":true,
"defaultValue":"" "defaultValue":"三菱PLC-FxSerial"
}, },
{ {
"labelName":"Description", "labelName":"Description",
@@ -559,8 +559,8 @@
"type":"text", "type":"text",
"placeholder":"", "placeholder":"",
"key":"@Name", "key":"@Name",
"disabled":false, "disabled":true,
"defaultValue":"" "defaultValue":"三菱PLC-FxSerial-OverTcp"
}, },
{ {
"labelName":"Description", "labelName":"Description",
@@ -713,8 +713,8 @@
"type":"text", "type":"text",
"placeholder":"", "placeholder":"",
"key":"@Name", "key":"@Name",
"disabled":false, "disabled":true,
"defaultValue":"" "defaultValue":"三菱PLC-FxLinks"
}, },
{ {
"labelName":"Description", "labelName":"Description",
@@ -864,7 +864,7 @@
"placeholder":"", "placeholder":"",
"key":"@Name", "key":"@Name",
"disabled":false, "disabled":false,
"defaultValue":"" "defaultValue":"三菱PLC-A3C"
}, },
{ {
"labelName":"Description", "labelName":"Description",
@@ -1014,7 +1014,7 @@
"placeholder":"", "placeholder":"",
"key":"@Name", "key":"@Name",
"disabled":false, "disabled":false,
"defaultValue":"" "defaultValue":"三菱PLC-A3C-OverTcp"
}, },
{ {
"labelName":"Description", "labelName":"Description",

View File

@@ -34,7 +34,7 @@
{{serveStatus[selectedServerData.status].name}} {{serveStatus[selectedServerData.status].name}}
</el-tag> </el-tag>
</div> </div>
<device :server_id='server_id' @changeStatus='changeSelectedServerStatus'/> <device :server='server' @changeStatus='changeSelectedServerStatus'/>
</el-drawer> </el-drawer>
</d2-container> </d2-container>
</template> </template>
@@ -81,7 +81,7 @@ export default {
} }
], ],
isDrawerShow: false, isDrawerShow: false,
server_id: 0, server: {},
serveStatus: { serveStatus: {
online: { online: {
name: '在线', name: '在线',
@@ -337,7 +337,7 @@ export default {
port: row.port, port: row.port,
status: row.status ? row.status : 'offline' status: row.status ? row.status : 'offline'
} }
this.server_id = row.id this.server = { id: row.id, url: row.url, port: row.port }
this.isDrawerShow = true this.isDrawerShow = true
}, },
changeSelectedServerStatus (status) { changeSelectedServerStatus (status) {