|  |  |  | 
|---|
|  |  |  | <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(); | 
|---|
|  |  |  | 
|---|
|  |  |  | 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> | 
|---|