forked from JointCloud/JCC-RIP
edge page add
This commit is contained in:
ann
parent
6c45c8a399
commit
2b904ee3cc
|
|
@ -82,6 +82,13 @@ const podRouter = {
|
|||
name: 'EdgeDeviceOnline',
|
||||
meta: { activeMenu: '/cluster/:clusterName/edgenodeManagement' },
|
||||
hidden: true
|
||||
},
|
||||
{
|
||||
path: 'edgeDetail',
|
||||
component: () => import('@/views/edgenodeManagement/edgeDetail'),
|
||||
name: 'EdgeDetail',
|
||||
meta: { activeMenu: '/cluster/:clusterName/edgenodeManagement' },
|
||||
hidden: true
|
||||
}
|
||||
]
|
||||
},
|
||||
|
|
|
|||
|
|
@ -0,0 +1,80 @@
|
|||
<template>
|
||||
<div class="list-detail">
|
||||
<el-card>
|
||||
<el-page-header content="详情" @back="$router.go(-1)" />
|
||||
<el-divider />
|
||||
<!-- <a class="back" @click.prevent=""> <i class="el-icon-back" /> 返回 </a> -->
|
||||
<el-tabs v-model="activeName" type="card">
|
||||
<el-tab-pane label="数据中心" name="1">
|
||||
<el-alert
|
||||
title="一个事件表示一个或多个传感器读值的集合，一些传感器设备一次一个读值，而有的可能一次提供多个读值，但是一个事件至少应该有一个读值，在GUI上操作数据中心是不合理的行为，数据中心的API只能是内部或者外部服务通信使用，因此这里仅仅是让用户预览数据流"
|
||||
type="info"
|
||||
show-icon
|
||||
/>
|
||||
<el-card shadow="never">
|
||||
<el-tabs v-model="eventTab" @tab-click="tabSwitch">
|
||||
<el-tab-pane label="事件" name="1" />
|
||||
<el-tab-pane label="读值" name="2" />
|
||||
</el-tabs>
|
||||
<p>{{ eventTab === '1' ? '事件' : '读值' }}数据流</p>
|
||||
<el-button type="success" icon="el-icon-video-play" plain :disabled="startBtnDisabled" @click="start">开始</el-button>
|
||||
<el-button type="warning" icon="el-icon-video-pause" plain :disabled="!startBtnDisabled" @click="pause">暂停</el-button>
|
||||
<el-card class="box-card" shadow="never">
|
||||
<div v-for="(item, index) in eventFlow" :key="index" class="text item">
|
||||
<p class="event-item">{{ JSON.stringify(item) }}</p>
|
||||
</div>
|
||||
</el-card>
|
||||
</el-card>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="设备管理" name="2">配置管理</el-tab-pane>
|
||||
<!-- <el-tab-pane label="角色管理" name="3">角色管理</el-tab-pane>
|
||||
<el-tab-pane label="定时任务补偿" name="4">定时任务补偿</el-tab-pane> -->
|
||||
</el-tabs>
|
||||
</el-card>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
export default {
|
||||
components: {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
activeName: '1',
|
||||
eventTab: '1',
|
||||
startBtnDisabled: false,
|
||||
eventFlow: []
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
},
|
||||
methods: {
|
||||
tabSwitch() {},
|
||||
start() {
|
||||
this.startBtnDisabled = true
|
||||
//
|
||||
},
|
||||
pause() {
|
||||
this.startBtnDisabled = false
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.box-card {
|
||||
border: 1px solid #eeeeee;
|
||||
width: 100%;
|
||||
height: 300px;
|
||||
margin: 0;
|
||||
border-radius: 0;
|
||||
.event-item{
|
||||
margin:0;
|
||||
margin-bottom: 10px;
|
||||
display: block;
|
||||
font-size: 14px;
|
||||
color: #212529;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -110,7 +110,8 @@ export default {
|
|||
],
|
||||
deviceColumn: [
|
||||
{ prop: 'icon', width: '50', label: '', formatter: row => <div class='icon'><svg-icon icon-class='bianyuanjiedian-leida' /></div> },
|
||||
{ prop: 'name', label: '', formatter: row => <div><a onClick={() => this.viewOnlineVideo(this.chooseRow.name)}> {row.name} </a></div> },
|
||||
{ prop: 'name', label: '', formatter: row => <div><a onClick={() => this.viewEdgeDetail(this.chooseRow)}> {row.name} </a></div> },
|
||||
{ prop: 'name', label: '', formatter: row => <div><a onClick={() => this.viewOnlineVideo(this.chooseRow.name)}> <i class='el-icon-camera-solid' /> </a></div> },
|
||||
// { prop: 'name', label: '', formatter: row => <div><a onClick={() => this.viewDevicesDetail(this.chooseRow.name)}> {row.name} </a></div> },
|
||||
{ prop: 'desiredStatus', label: '', formatter: (row, index) => <div>
|
||||
{'状态：' + row.desiredStatus}
|
||||
|
|
@ -206,6 +207,9 @@ export default {
|
|||
viewOnlineVideo(row) {
|
||||
this.$router.push({ name: 'EdgeDeviceOnline', params: { ...this.$route.params }})
|
||||
},
|
||||
viewEdgeDetail(row) {
|
||||
this.$router.push({ name: 'EdgeDetail', query: { ip: row.ip }})
|
||||
},
|
||||
viewDetail(row) {
|
||||
this.$router.push({ name: 'EdgeNodeManagementDetail', params: { ...this.$route.params, name: row.metadata.name }})
|
||||
},
|
||||
|
|
|
|||
|
|
@ -1,6 +1,7 @@
|
|||
<template>
|
||||
<div>
|
||||
<el-card>
|
||||
<a class="back" @click.prevent="$router.go(-1)"> <i class="el-icon-back" /> 返回 </a>
|
||||
<h3>摄像头-Left</h3>
|
||||
<video id="videoElement" controls autoplay muted width="100%" height="500px" />
|
||||
<!-- <d-player ref="player" :options="dplayerOptions" /> -->
|
||||
|
|
|
|||
|
|
@ -60,8 +60,8 @@ module.exports = {
|
|||
},
|
||||
'^/jcc-': {
|
||||
ws: false,
|
||||
target: 'https://10.101.15.6/apis', /* 测试环境 */
|
||||
// target: 'https://jointcloud.net/apis', /* 演示环境 */
|
||||
// target: 'https://10.101.15.6/apis', /* 测试环境 */
|
||||
target: 'https://jointcloud.net/apis', /* 演示环境 */
|
||||
changeOrigin: true,
|
||||
secure: false
|
||||
},
|
||||
|
|
@ -79,8 +79,8 @@ module.exports = {
|
|||
},
|
||||
'^/edgex': {
|
||||
ws: false,
|
||||
target: 'https://10.101.15.6/' /* 测试环境 */
|
||||
// target: 'https://jointcloud.net/prod-api/' /* 演示环境 */
|
||||
// target: 'https://10.101.15.6/' /* 测试环境 */
|
||||
target: 'https://jointcloud.net/prod-api/' /* 演示环境 */
|
||||
}
|
||||
}
|
||||
// before: require('./mock/mock-server.js')
|
||||
|
|
|
|||
Loading…
Reference in New Issue