| | |
| | | <div class="page-header"> |
| | | <div class="page-title"> |
| | | <el-button icon="el-icon-back" size="mini" style="font-size: 20px; color: #000;" type="text" @click="showDevice" ></el-button> |
| | | 通道列表</div> |
| | | <el-divider direction="vertical"></el-divider> |
| | | 通道列表 |
| | | </div> |
| | | <div class="page-header-btn"> |
| | | 搜索: |
| | | <el-input @input="search" style="margin-right: 1rem; width: auto;" size="mini" placeholder="关键字" |
| | |
| | | <el-table-column prop="name" label="通道名称" min-width="200"> |
| | | </el-table-column> |
| | | <el-table-column label="快照" min-width="120"> |
| | | <template slot-scope="scope"> |
| | | <template v-slot:default="scope"> |
| | | <el-image |
| | | :src="getSnap(scope.row)" |
| | | :preview-src-list="getBigSnap(scope.row)" |
| | | @error="getSnapErrorEvent(scope.row.deviceId, cope.row.channelId)" |
| | | @error="getSnapErrorEvent(scope.row.deviceId, scope.row.channelId)" |
| | | :fit="'contain'" |
| | | style="width: 60px"> |
| | | <div slot="error" class="image-slot"> |
| | |
| | | <el-table-column label="状态" min-width="120"> |
| | | <template slot-scope="scope"> |
| | | <div slot="reference" class="name-wrapper"> |
| | | <el-tag size="medium" v-if="scope.row.status == 1">在线</el-tag> |
| | | <el-tag size="medium" type="info" v-if="scope.row.status == 0">离线</el-tag> |
| | | <el-tag size="medium" v-if="scope.row.status === 1">在线</el-tag> |
| | | <el-tag size="medium" type="info" v-if="scope.row.status === 0">离线</el-tag> |
| | | </div> |
| | | </template> |
| | | </el-table-column> |
| | |
| | | </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, 20, 30, 50]" |
| | | layout="total, sizes, prev, pager, next" :total="total"> |
| | | <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> |
| | | </div> |
| | | </template> |
| | |
| | | import devicePlayer from './dialog/devicePlayer.vue' |
| | | import uiHeader from '../layout/UiHeader.vue' |
| | | import moment from "moment"; |
| | | import DviceService from "./service/DeviceService"; |
| | | import DeviceService from "./service/DeviceService"; |
| | | |
| | | export default { |
| | | name: 'channelList', |
| | |
| | | }, |
| | | data() { |
| | | return { |
| | | deviceService: new DeviceService(), |
| | | device: null, |
| | | deviceId: this.$route.params.deviceId, |
| | | parentChannelId: this.$route.params.parentChannelId, |
| | | deviceChannelList: [], |
| | |
| | | }, |
| | | |
| | | mounted() { |
| | | if (this.deviceId) { |
| | | this.deviceService.getDevice(this.deviceId, (result)=>{ |
| | | this.device = result; |
| | | |
| | | }, (error)=>{ |
| | | console.log("获取设备信息失败") |
| | | console.error(error) |
| | | }) |
| | | } |
| | | this.initData(); |
| | | |
| | | }, |
| | | destroyed() { |
| | | this.$destroy('videojs'); |
| | |
| | | }) |
| | | }, |
| | | handleSizeChange: function (val) { |
| | | var url = `/${this.$router.currentRoute.name}/${this.$router.params.deviceId}/${this.$router.params.parentChannelId}/${val}/1` |
| | | this.$router.push(url).then(() => { |
| | | this.initParam(); |
| | | this.initData(); |
| | | }) |
| | | |
| | | this.count = val; |
| | | this.getDeviceChannelList(); |
| | | }, |
| | | getDeviceChannelList: function () { |
| | | let that = this; |