调整客户端界面

This commit is contained in:
kerwincui
2022-05-12 18:07:39 +08:00
parent 1b345cbbdd
commit bc147649c7
2 changed files with 12 additions and 17 deletions

View File

@@ -53,16 +53,14 @@
<pagination v-show="total > 0" :total="total" :page.sync="queryParams._page" :limit.sync="queryParams._limit" @pagination="getList" />
<!-- MQTT客户端详细 -->
<el-dialog :title="title" :visible.sync="open" width="50%" append-to-body>
<el-dialog :title="title" :visible.sync="open" width="800px" append-to-body>
<el-tabs v-model="activeName" tab-position="top" style="padding: 10px">
<el-tab-pane name="basic">
<span slot="label">基本信息</span>
<el-form ref="form" :model="form" label-width="120px" size="mini">
<el-descriptions class="margin-top" title="基本信息" :column="4" direction="vertical">
<el-descriptions class="margin-top" :column="2" border size="medium">
<el-descriptions-item label="节点">{{form.node }}</el-descriptions-item>
<el-descriptions-item label="客户端ID">{{form.clientid}}</el-descriptions-item>
<el-descriptions-item label="Clean Session">{{form.clean_start}}</el-descriptions-item>
<el-descriptions-item label="清除Session">{{form.clean_start}}</el-descriptions-item>
<el-descriptions-item label="会话过期间隔(秒)">{{form.expiry_interval}}</el-descriptions-item>
<el-descriptions-item label="用户名">{{form.username}}</el-descriptions-item>
<el-descriptions-item label="协议类型">{{form.proto_ver}}</el-descriptions-item>
@@ -79,11 +77,11 @@
<el-descriptions-item label="连接时间">{{form.connected_at}}</el-descriptions-item>
<el-descriptions-item label="连接状态">
<div v-if="form.connected == true" style="color: green">
已连接
</div>
<div v-else-if="form.connected == false" style="color: red">
已断开
</div>
已连接
</div>
<div v-else-if="form.connected == false" style="color: red">
已断开
</div>
</el-descriptions-item>
<el-descriptions-item label="最大消息队列">{{form.max_mqueue}}</el-descriptions-item>
<el-descriptions-item label="未确认的PUBREC数据包计数">{{form.awaiting_rel}}</el-descriptions-item>
@@ -93,14 +91,11 @@
<el-descriptions-item label="接收的PUBLISH报文数量">{{form.recv_msg}}</el-descriptions-item>
<el-descriptions-item label="接收的字节数量">{{form.recv_oct}}</el-descriptions-item>
<el-descriptions-item label="接收的MQTT报文数量">{{form.recv_pkt}}</el-descriptions-item>
<el-descriptions-item label="发送的TCP报文数量">{{form.send_cnt}}</el-descriptions-item>
<el-descriptions-item label="发送的PUBLISH报文数量">{{form.send_msg}}</el-descriptions-item>
<el-descriptions-item label="发送的字节数量">{{form.send_oct}}</el-descriptions-item>
<el-descriptions-item label="发送的MQTT报文数量">{{form.send_pkt}}</el-descriptions-item>
</el-descriptions>
</el-form>
</el-descriptions>
</el-tab-pane>
<el-tab-pane name="subscribe">

View File

@@ -2,12 +2,12 @@
<div class="app-container">
<el-form v-show="showSearch" ref="queryForm" :inline="true" :model="queryParams" label-width="85px">
<el-form-item label="第三方平台" prop="platform">
<el-select v-model="queryParams.platform" clearable placeholder="请选择" size="small">
<el-select v-model="queryParams.platform" clearable placeholder="请选择平台" size="small">
<el-option v-for="dict in dict.type.iot_social_platform" :key="dict.value" :label="dict.label" :value="dict.value" />
</el-select>
</el-form-item>
<el-form-item label="状态" prop="status">
<el-select v-model="queryParams.status" clearable placeholder="请选择" size="small">
<el-select v-model="queryParams.status" clearable placeholder="请选择状态" size="small">
<el-option v-for="dict in dict.type.iot_social_platform_status" :key="dict.value" :label="dict.label" :value="dict.value" />
</el-select>
</el-form-item>
@@ -81,7 +81,7 @@
</el-select>
</el-form-item>
<el-form-item label="第三方平台状态" prop="status">
<el-select v-model="form.status" placeholder="请选择">
<el-select v-model="form.status" placeholder="请选择状态">
<el-option v-for="dict in dict.type.iot_social_platform_status" :key="dict.value" :label="dict.label" :value="dict.value"></el-option>
</el-select>
</el-form-item>