<template>
	<el-container>
		<el-header>
			<div class="left-panel">
				<div class="right-panel-search">
					<el-input v-model="search.keyword" placeholder="编号" clearable @click="upsearch"></el-input>
					<el-button type="primary" icon="el-icon-search" @click="upsearch"></el-button>
				</div>
			</div>
		</el-header>
		<el-main class="nopadding">
			<scTable ref="table" :apiObj="apiObj" row-key="id" @selection-change="selectionChange" stripe @resetQuery="resetQuery"  >
				<el-table-column type="selection" width="50"></el-table-column>
				<el-table-column label="序号" type="index" width="50"></el-table-column>
				<el-table-column label="设备编号" prop="deviceCode" min-width="100"></el-table-column>
				<el-table-column label="通道编号" prop="channelCode" min-width="100"></el-table-column>
				<el-table-column label="通道名称" prop="channelName" min-width="150"></el-table-column>
				<el-table-column label="通道状态" prop="stat" min-width="150"></el-table-column>
				<el-table-column label="通道类型" min-width="100">
					<template #default="scope">{{scope.row.channelType}}</template>
				</el-table-column>
				<el-table-column label="设备类型" min-width="100">
					<template #default="scope">{{scope.row.cameraType}}</template>
				</el-table-column>
				<el-table-column label="是否在线" prop="isOnline" min-width="180"></el-table-column>
				<el-table-column label="创建时间" prop="createTime" width="160"></el-table-column>
			</scTable>
		</el-main>
	</el-container>
</template>
<script>
	import videoChannelView from './vchannel_view'
	export default {
		name: 'monitor',
		components: {
			videoChannelView
		},
		data() {
			return {
				apiObj: this.$API.am.tdevice.dchannel,
				dialogSave:  false,
				limitedVisible:  false,
				query: {},
				selection: [],
				search: {
					keyword: null
				},
				channelId:'',
			}
		},
		methods: {
			handlePosition(row){
				this.channelCode = row.channelCode;
				this.channelName = row.channelName;
				this.dialogSave = true;
			},
			//删除区域
			async handleDel(row){
				await this.$API.am.area.delete.req(row.id).then(res=>{
					if(res.err_msg){
						this.$message.error(res.err_msg);
					}else{
						this.$refs.table.refresh();
						this.$message.success("删除成功")
					}
				});
			},

			//批量删除区域
			async batch_del(){
				this.$confirm(`确定删除选中的 ${this.selection.length} 项吗？如果删除项中含有子集将会被一并删除`, '提示', {
					type: 'warning'
				}).then(() => {
					const loading = this.$loading();
					let params = {pk:{pks:this.selection}};
					this.$API.am.area.deletes.req(params).then(res=>{
						loading.close();
						if(res.err_msg){
							this.$message.error(res.err_msg);
						}else{
							this.$refs.table.refresh();
							this.$message.success("删除成功")
						}
					});
				}).catch(() => {
				})
			},
			//表格选择后回调事件
			selectionChange(selection){
				this.selection = selection;
			},


			//搜索
			upsearch(){

			},

			resetQuery(){
				this.query = {}
			}
		}
	}
</script>
