This commit is contained in:
ann 2023-02-09 16:37:43 +08:00
parent e4d2f30e22
commit 8d572aeb56
3 changed files with 172 additions and 30 deletions

View File

@ -17,3 +17,19 @@ export function getEdgeServiceByIp(params) {
params: params
})
}
export function patchDeviceservice(params) {
return request({
url: edgePreUrl + '/patchData',
method: 'patch',
data: params
})
}
export function deleteService(params) {
return request({
url: edgePreUrl + '/deleteData',
method: 'delete',
params: params
})
}

View File

@ -1,6 +1,6 @@
<template>
<div>
<el-tabs v-model="activeName" shadow="never">
<el-tabs v-model="activeName" shadow="never" @tab-click="tabSwitch">
<el-tab-pane label="设备服务" name="1">
<List
ref="multipleTable"
@ -9,15 +9,54 @@
:table-list-data="blockList"
tooltip-effect="dark"
/>
<el-dialog :close-on-click-modal="false" title="编辑" :visible.sync="dialogSettingVisible">
<el-form ref="serviceData" :model="serviceData">
<el-form-item
prop="description"
label="描述"
>
<el-input v-model="serviceData.description" :maxlength="63" />
<span class="tips">最长 63 个字符只能包含小写字母数字及分隔符("-")且必须以小写字母或数字开头及结尾</span>
</el-form-item>
<el-form-item
prop="adminState"
label="管理状态"
>
<el-select v-model="serviceData.adminState">
<el-option
label="UNLOCKED"
value="UNLOCKED"
/>
<el-option
label="LOCKED"
value="LOCKED"
/>
</el-select>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button icon="el-icon-close" circle @click="dialogSettingVisible = false" />
<el-button icon="el-icon-check" circle @click="ok" />
</div>
</el-dialog>
</el-tab-pane>
<el-tab-pane label="设备" name="2">
<!-- <List
ref="multipleTable"
class="multipleTable"
:columns="columns"
:table-list-data="blockList"
<List
ref="multipleTable1"
class="multipleTable1"
:columns="columns1"
:table-list-data="blockList1"
tooltip-effect="dark"
/> -->
/>
</el-tab-pane>
<el-tab-pane label="设备元信息" name="3">
<List
ref="multipleTable2"
class="multipleTable2"
:columns="columns2"
:table-list-data="blockList2"
tooltip-effect="dark"
/>
</el-tab-pane>
<!-- <el-tab-pane label="角色管理" name="3">角色管理</el-tab-pane>
<el-tab-pane label="定时任务补偿" name="4">定时任务补偿</el-tab-pane> -->
@ -27,7 +66,7 @@
<script>
import List from '@/components/list'
import { getEdgeDataByIpPath } from '@/api/edge/edge'
import { deleteService, getEdgeDataByIpPath, patchDeviceservice } from '@/api/edge/edge'
export default {
components: {
@ -37,6 +76,10 @@ export default {
return {
activeName: '1',
blockList: [],
blockList1: [],
blockList2: [],
dialogSettingVisible: false,
serviceData: {},
columns: [
{ prop: 'name', label: '名字' },
{ prop: 'description', label: '描述' },
@ -48,7 +91,45 @@ export default {
{ prop: 'adminState', label: '管理状态' },
{ prop: '', label: '设置', formatter: (row) => {
return <div>
<el-button onClick={() => this.viewCredential(row)} type='text' icon='el-icon-s-setting' size='small'>查看</el-button>
<el-button onClick={() => this.viewSetting(row)} type='text' icon='el-icon-s-setting' size='small'>设置</el-button>
</div>
} }
],
columns1: [
{ prop: 'id', label: 'ID' },
{ prop: 'name', label: '名字' },
{ prop: 'description', label: '描述' },
{ prop: 'labels', label: '标签', formatter: (row) => {
return <div>
{row.labels.join(',')}
</div>
} },
{ prop: 'adminState', label: '管理状态' },
{ prop: 'operatingState', label: '操作状态' },
{ prop: 'profileName', label: '相关设备元信息' },
{ prop: 'serviceName', label: '相关设备服务' },
{ prop: '', label: '设置', formatter: (row) => {
return <div>
<el-button onClick={() => this.viewSetting(row)} type='text' icon='el-icon-s-setting' size='small'>编辑</el-button>
<el-button onClick={() => this.viewSetting(row)} type='text' icon='el-icon-s-setting' size='small'>删除</el-button>
</div>
} }
],
columns2: [
{ prop: 'id', label: 'ID' },
{ prop: 'name', label: '名字' },
{ prop: 'description', label: '描述' },
{ prop: 'labels', label: '标签', formatter: (row) => {
return <div>
{row.labels.join(',')}
</div>
} },
{ prop: 'manufacturer', label: '维护者' },
{ prop: 'model', label: '模式' },
{ prop: '', label: '设置', formatter: (row) => {
return <div>
<el-button onClick={() => this.viewSetting(row)} type='text' icon='el-icon-s-setting' size='small'>编辑</el-button>
<el-button onClick={() => this.deleteItem(row)} type='text' icon='el-icon-s-setting' size='small'>删除</el-button>
</div>
} }
]
@ -63,20 +144,45 @@ export default {
this.blockList = e.data.services || []
})
},
tabSwitch() {},
start() {
this.startBtnDisabled = true
this.getEventData()
this.eventsLoop = setInterval(this.getEventData, 3000)
tabSwitch() {
if (this.activeName === '2') {
this.getDevicelist()
} else if (this.activeName === '3') {
this.getProfileList()
}
},
getEventData() {
// getEventFlow(this.$route.query.ip).then(e => {
// console.log('hello')
// })
viewSetting(row) {
this.dialogSettingVisible = true
// this.getEventData()
this.serviceData = Object.assign({}, row)
},
pause() {
this.startBtnDisabled = false
clearInterval(this.eventsLoop)
deleteItem(row) {
this.$confirm(`您确定要删除吗?`, { type: 'warning' }).then(() => {
deleteService({ address: this.$route.query.ip, path: `/core-metadata/api/v2/${this.activeName === '2' ? 'device' : 'deviceprofile'}/name/` + row.name }).then(e => {
if (e.code === 200) {
this.$message.success('删除成功')
this.tabSwitch()
}
})
})
},
ok() {
patchDeviceservice({ address: this.$route.query.ip, path: '/core-metadata/api/v2/deviceservice', updateDeviceServiceRequests: [{ apiVersion: 'v2', service: this.serviceData }] }).then(e => {
if (e.code === 200) {
this.dialogSettingVisible = false
this.$message.success('修改成功')
}
})
},
getDevicelist() {
getEdgeDataByIpPath({ address: this.$route.query.ip, path: `core-metadata/api/v2/device/all?offset=0&limit=-1` }).then(e => {
this.blockList1 = e.data.devices || []
})
},
getProfileList() {
getEdgeDataByIpPath({ address: this.$route.query.ip, path: `core-metadata/api/v2/deviceprofile/all?offset=0&limit=-1` }).then(e => {
this.blockList2 = e.data.profiles || []
})
}
}
}

View File

@ -7,12 +7,15 @@
:table-list-data="blockList"
tooltip-effect="dark"
/>
<el-dialog :close-on-click-modal="false" title="查看配置文件" :visible.sync="dialogSettingVisible">
<codemirror v-model="code" class="code-mirror" :options="cmOption" />
</el-dialog>
</div>
</template>
<script>
import List from '@/components/list'
import { getEdgeServiceByIp } from '@/api/edge/edge'
import { getEdgeDataByIpPath, getEdgeServiceByIp } from '@/api/edge/edge'
export default {
components: {
@ -20,6 +23,17 @@ export default {
},
data() {
return {
code: ``,
cmOption: {
autoCloseBrackets: true,
tabSize: 4,
styleActiveLine: true,
lineNumbers: true,
line: true,
mode: 'text/x-yaml'
// keyMap: "emacs"
},
dialogSettingVisible: false,
blockList: [],
columns: [
{ prop: 'ServiceId', label: '名字' },
@ -30,16 +44,16 @@ export default {
} },
{ prop: 'name', label: '配置', formatter: (row) => {
return <div>
<el-button onClick={() => this.viewCredential(row)} type='text' icon='el-icon-s-tools' size='small'>配置</el-button>
</div>
} },
{ prop: 'more', label: '操作', formatter: (row) => {
return <div>
<el-button onClick={() => this.viewCredential(row)} type='text' size='small'>启动</el-button>
<el-button onClick={() => this.viewCredential(row)} type='text' size='small'>重启</el-button>
<el-button onClick={() => this.viewCredential(row)} type='text' size='small'>停止</el-button>
<el-button onClick={() => this.viewConfig(row)} type='text' icon='el-icon-s-tools' size='small'>配置</el-button>
</div>
} }
// { prop: 'more', label: '', formatter: (row) => {
// return <div>
// <el-button onClick={() => this.viewCredential(row)} type='text' size='small'></el-button>
// <el-button onClick={() => this.viewCredential(row)} type='text' size='small'></el-button>
// <el-button onClick={() => this.viewCredential(row)} type='text' size='small'></el-button>
// </div>
// } }
]
}
},
@ -53,6 +67,12 @@ export default {
// getEdgeDataByIpPath({ address: this.$route.query.ip, path: `sys-mgmt-agent/api/v2/system/health?services=${e.data.map(e => { return e.ServiceId }).join(',')}` }).then(e => {
// })
})
},
viewConfig(row) {
this.dialogSettingVisible = true
getEdgeDataByIpPath({ address: this.$route.query.ip, path: `sys-mgmt-agent/api/v2/system/config?services=${row.ServiceId}` }).then(e => {
this.code = JSON.stringify(e.data, null, 2)
})
}
}
}