| | |
| | | <template> |
| | | <div id="app"> |
| | | <el-container> |
| | | <el-header> |
| | | <uiHeader></uiHeader> |
| | | </el-header> |
| | | <el-main> |
| | | <div style="background-color: #FFFFFF; margin-bottom: 1rem; position: relative; padding: 0.5rem; text-align: left;"> |
| | | <span style="font-size: 1rem; font-weight: bold;">上级平台列表</span> |
| | | </div> |
| | | <div style="background-color: #FFFFFF; margin-bottom: 1rem; position: relative; padding: 0.5rem; text-align: left;font-size: 14px;"> |
| | | <el-button icon="el-icon-plus" size="mini" style="margin-right: 1rem;" type="primary" @click="addParentPlatform">添加</el-button> |
| | | </div> |
| | | <!--设备列表--> |
| | | <el-table :data="platformList" border style="width: 100%" :height="winHeight"> |
| | | <el-table-column prop="name" label="名称" width="240" align="center"></el-table-column> |
| | | <el-table-column prop="serverGBId" label="平台编号" width="180" align="center"></el-table-column> |
| | | <el-table-column label="是否启用" width="120" align="center"> |
| | | <template slot-scope="scope"> |
| | | <div slot="reference" class="name-wrapper"> |
| | | <el-tag size="medium" v-if="scope.row.enable">已启用</el-tag> |
| | | <el-tag size="medium" type="info" v-if="!scope.row.enable">未启用</el-tag> |
| | | </div> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="状态" width="120" align="center"> |
| | | <template slot-scope="scope"> |
| | | <div slot="reference" class="name-wrapper"> |
| | | <el-tag size="medium" v-if="scope.row.status">在线</el-tag> |
| | | <el-tag size="medium" type="info" v-if="!scope.row.status">离线</el-tag> |
| | | </div> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="地址" width="180" align="center"> |
| | | <template slot-scope="scope"> |
| | | <div slot="reference" class="name-wrapper"> |
| | | <el-tag size="medium">{{ scope.row.serverIP}}:{{scope.row.serverPort }}</el-tag> |
| | | </div> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="deviceGBId" label="设备国标编号" width="240" align="center"></el-table-column> |
| | | <el-table-column prop="transport" label="信令传输模式" width="120" align="center"></el-table-column> |
| | | <el-table-column prop="channelCount" label="通道数" align="center"></el-table-column> |
| | | <div id="app" style="width: 100%"> |
| | | <div class="page-header"> |
| | | <div class="page-title">上级平台列表</div> |
| | | <div class="page-header-btn"> |
| | | <el-button icon="el-icon-plus" size="mini" style="margin-right: 1rem;" type="primary" @click="addParentPlatform">添加</el-button> |
| | | <el-button icon="el-icon-refresh-right" circle size="mini" @click="refresh()"></el-button> |
| | | </div> |
| | | </div> |
| | | |
| | | <el-table-column label="操作" width="300" align="center" fixed="right"> |
| | | <template slot-scope="scope"> |
| | | <el-button size="mini" icon="el-icon-edit" @click="editPlatform(scope.row)">编辑</el-button> |
| | | <el-button size="mini" icon="el-icon-share" type="primary" @click="chooseChannel(scope.row)">选择通道</el-button> |
| | | <el-button size="mini" icon="el-icon-delete" type="danger" @click="deletePlatform(scope.row)">删除</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <el-pagination |
| | | style="float: right" |
| | | @size-change="handleSizeChange" |
| | | @current-change="currentChange" |
| | | :current-page="currentPage" |
| | | :page-size="count" |
| | | :page-sizes="[15, 25, 35, 50]" |
| | | layout="total, sizes, prev, pager, next" |
| | | :total="total"> |
| | | </el-pagination> |
| | | <platformEdit ref="platformEdit" ></platformEdit> |
| | | <chooseChannelDialog ref="chooseChannelDialog" ></chooseChannelDialog> |
| | | </el-main> |
| | | </el-container> |
| | | <!--设备列表--> |
| | | <el-table :data="platformList" style="width: 100%" :height="winHeight"> |
| | | <el-table-column prop="name" label="名称" ></el-table-column> |
| | | <el-table-column prop="serverGBId" label="平台编号" min-width="200"></el-table-column> |
| | | <el-table-column label="是否启用" min-width="80" > |
| | | <template slot-scope="scope"> |
| | | <div slot="reference" class="name-wrapper"> |
| | | <el-tag size="medium" v-if="scope.row.enable">已启用</el-tag> |
| | | <el-tag size="medium" type="info" v-if="!scope.row.enable">未启用</el-tag> |
| | | </div> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="状态" min-width="80" > |
| | | <template slot-scope="scope"> |
| | | <div slot="reference" class="name-wrapper"> |
| | | <el-tag size="medium" v-if="scope.row.status">在线</el-tag> |
| | | <el-tag size="medium" type="info" v-if="!scope.row.status">离线</el-tag> |
| | | </div> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="地址" min-width="160" > |
| | | <template slot-scope="scope"> |
| | | <div slot="reference" class="name-wrapper"> |
| | | <el-tag size="medium">{{ scope.row.serverIP}}:{{scope.row.serverPort }}</el-tag> |
| | | </div> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="deviceGBId" label="设备国标编号" min-width="200" ></el-table-column> |
| | | <el-table-column prop="transport" label="信令传输模式" min-width="120" ></el-table-column> |
| | | <el-table-column prop="channelCount" label="通道数" min-width="120" ></el-table-column> |
| | | <el-table-column label="订阅信息" min-width="120" fixed="right"> |
| | | <template slot-scope="scope"> |
| | | <i v-if="scope.row.alarmSubscribe" style="font-size: 20px" title="报警订阅" class="iconfont icon-gbaojings subscribe-on " ></i> |
| | | <i v-if="!scope.row.alarmSubscribe" style="font-size: 20px" title="报警订阅" class="iconfont icon-gbaojings subscribe-off " ></i> |
| | | <i v-if="scope.row.catalogSubscribe" title="目录订阅" class="iconfont icon-gjichus subscribe-on" ></i> |
| | | <i v-if="!scope.row.catalogSubscribe" title="目录订阅" class="iconfont icon-gjichus subscribe-off" ></i> |
| | | <i v-if="scope.row.mobilePositionSubscribe" title="位置订阅" class="iconfont icon-gxunjians subscribe-on" ></i> |
| | | <i v-if="!scope.row.mobilePositionSubscribe" title="位置订阅" class="iconfont icon-gxunjians subscribe-off" ></i> |
| | | </template> |
| | | </el-table-column> |
| | | |
| | | <el-table-column label="操作" min-width="240" fixed="right"> |
| | | <template slot-scope="scope"> |
| | | <el-button size="medium" icon="el-icon-edit" type="text" @click="editPlatform(scope.row)">编辑</el-button> |
| | | <el-button size="medium" icon="el-icon-share" type="text" @click="chooseChannel(scope.row)">选择通道</el-button> |
| | | <el-button size="medium" icon="el-icon-delete" type="text" style="color: #f56c6c" @click="deletePlatform(scope.row)">删除</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <el-pagination |
| | | style="float: right" |
| | | @size-change="handleSizeChange" |
| | | @current-change="currentChange" |
| | | :current-page="currentPage" |
| | | :page-size="count" |
| | | :page-sizes="[15, 25, 35, 50]" |
| | | layout="total, sizes, prev, pager, next" |
| | | :total="total"> |
| | | </el-pagination> |
| | | <platformEdit ref="platformEdit" ></platformEdit> |
| | | <chooseChannelDialog ref="chooseChannelDialog" ></chooseChannelDialog> |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | import platformEdit from './dialog/platformEdit.vue' |
| | | import uiHeader from './UiHeader.vue' |
| | | import uiHeader from '../layout/UiHeader.vue' |
| | | import chooseChannelDialog from './dialog/chooseChannel.vue' |
| | | export default { |
| | | name: 'app', |
| | |
| | | deletePlatformCommit: function(platform) { |
| | | var that = this; |
| | | that.$axios({ |
| | | method: 'delete', |
| | | url:`/api/platform/delete/${platform.serverGBId}` |
| | | method: 'delete', |
| | | url:`/api/platform/delete/${platform.serverGBId}` |
| | | }).then(function (res) { |
| | | if (res.data == "success") { |
| | | if (res.data.code === 0) { |
| | | that.$message({ |
| | | showClose: true, |
| | | message: '删除成功', |
| | |
| | | }); |
| | | }, |
| | | chooseChannel: function(platform) { |
| | | this.$refs.chooseChannelDialog.openDialog(platform.serverGBId, ()=>{ |
| | | this.initData() |
| | | }) |
| | | console.log("platform.name: " + platform.name) |
| | | this.$refs.chooseChannelDialog.openDialog(platform.serverGBId,platform.deviceGBId, platform.name, platform.catalogId, platform.treeType, this.initData) |
| | | }, |
| | | initData: function() { |
| | | this.getPlatformList(); |
| | |
| | | let that = this; |
| | | |
| | | this.$axios({ |
| | | method: 'get', |
| | | url:`/api/platform/query/${that.count}/${that.currentPage}` |
| | | method: 'get', |
| | | url:`/api/platform/query/${that.count}/${that.currentPage}` |
| | | }).then(function (res) { |
| | | that.total = res.data.total; |
| | | that.platformList = res.data.list; |
| | | if (res.data.code === 0) { |
| | | that.total = res.data.data.total; |
| | | that.platformList = res.data.data.list; |
| | | } |
| | | |
| | | }).catch(function (error) { |
| | | console.log(error); |
| | | }); |
| | | |
| | | }, |
| | | refresh: function (){ |
| | | this.initData(); |
| | | } |
| | | |
| | | } |
| | | }; |
| | | </script> |
| | | <style> |
| | | .subscribe-on{ |
| | | color: #409EFF; |
| | | font-size: 18px; |
| | | } |
| | | .subscribe-off{ |
| | | color: #afafb3; |
| | | font-size: 18px; |
| | | } |
| | | </style> |