XW-AIOT/wvp-platform
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

完成向上级联->选择通道-003

Browse Source
This commit is contained in:
panlinlin
2021-01-13 17:08:26 +08:00
parent b613747153
commit f082797d9b
14 changed files with 285 additions and 60 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
web_src/src/components/ParentPlatformList.vue
View File

@@ -89,9 +89,9 @@ export default {
};
},
computed: {
getcurrentDeviceChannels: function() {
}
},
mounted() {
@@ -155,7 +155,7 @@ export default {
getPlatformList: function() {
let that = this;
this.$axios.get(`/api/platforms/${that.count}/${that.currentPage - 1}`)
this.$axios.get(`/api/platforms/${that.count}/${that.currentPage}`)
.then(function (res) {
that.total = res.data.total;
that.platformList = res.data.list;

2
web_src/src/components/channelList.vue
View File

@@ -110,7 +110,7 @@ export default {
if (this.autoList) {
this.updateLooper = setInterval(this.initData, 5000);
}
},
destroyed() {
this.$destroy('videojs');

20
web_src/src/components/gb28181/chooseChannel.vue
View File

@@ -4,17 +4,13 @@
<el-dialog title="选择通道" top="2rem" width="70%" :close-on-click-modal="false" :visible.sync="showDialog" :destroy-on-close="true" @close="close()">
<el-tabs v-model="tabActiveName" >
<el-tab-pane label="国标通道" name="gbChannel">
<el-container>
<el-main style="background-color: #FFF;">
<chooseChannelForGb :chooseChanage=chooseChanage ></chooseChannelForGb>
<chooseChannelForGb :platformId=platformId ></chooseChannelForGb>
</el-main>
<el-footer>
<el-button size="mini" type="primary" style="float: right" @click="save()">保存</el-button>
</el-footer>
</el-container>
</el-tab-pane>
<el-tab-pane label="直播流通道" name="streamchannel">
<!-- TODO -->
@@ -41,7 +37,6 @@ export default {
// };
// }
},
created() {},
data() {
return {
isLoging: false,
@@ -49,12 +44,11 @@ export default {
platformId: "",
isLoging: false,
showDialog: false,
chooseData: []
chooseData: {}
};
},
methods: {
openDialog: function (platformId, closeCallback) {
console.log(platformId)
this.platformId = platformId
@@ -88,10 +82,6 @@ export default {
}).catch(function (error) {
console.log(error);
});
},
chooseChanage: function(val) {
console.log(val)
this.chooseData = val;
}
}
};

141
web_src/src/components/gb28181/chooseChannelForGb.vue
View File

@@ -3,19 +3,28 @@
<div style="background-color: #FFFFFF; margin-bottom: 1rem; position: relative; padding: 0.5rem; text-align: left;font-size: 14px;">
搜索: <el-input @input="search" style="margin-right: 1rem; width: auto;" size="mini" placeholder="关键字" prefix-icon="el-icon-search" v-model="searchSrt" clearable> </el-input>
通道类型: <el-select size="mini" @change="search" style="margin-right: 1rem;" v-model="channelType" placeholder="请选择" default-first-option>
通道类型: <el-select size="mini" @change="search" style="margin-right: 1rem; width:6rem" v-model="channelType" placeholder="请选择" default-first-option>
<el-option label="全部" value=""></el-option>
<el-option label="设备" value="false"></el-option>
<el-option label="子目录" value="true"></el-option>
</el-select>
在线状态: <el-select size="mini" style="margin-right: 1rem;" @change="search" v-model="online" placeholder="请选择" default-first-option>
选择状态: <el-select size="mini" style="margin-right: 1rem; width:6rem" v-model="choosed" @change="search" placeholder="请选择" default-first-option>
<el-option label="全部" value=""></el-option>
<el-option label="已选择" value="true"></el-option>
<el-option label="未选择" value="false"></el-option>
</el-select>
在线状态: <el-select size="mini" style="margin-right: 1rem; width:6rem" @change="search" v-model="online" placeholder="请选择" default-first-option>
<el-option label="全部" value=""></el-option>
<el-option label="在线" value="true"></el-option>
<el-option label="离线" value="false"></el-option>
</el-select>
<el-checkbox @change="shareAllCheckedChanage">全部共享</el-checkbox>
</div>
<el-table ref="gbChannelsTable" :data="gbChannels" border style="width: 100%" @selection-change="chooseChanage" >
<el-table-column type="selection" width="55" align="center" fixed> </el-table-column>
<el-table ref="gbChannelsTable" :data="gbChannels" border style="width: 100%" @selection-change="checkedChanage" >
<el-table-column type="selection" width="55" align="center" fixed > </el-table-column>
<el-table-column prop="channelId" label="通道编号" width="210">
</el-table-column>
<el-table-column prop="name" label="通道名称">
@@ -50,22 +59,32 @@ export default {
// };
// }
},
props: ['chooseChanage'],
props: ['platformId'],
created() {
this.initData();
},
data() {
return {
gbChannels: [],
gbChoosechannel:{},
searchSrt: "",
channelType: "",
online: "",
currentPage: parseInt(this.$route.params.page),
count: parseInt(this.$route.params.count),
total: 0
choosed: "",
currentPage: 0,
count: 15,
total: 0,
eventEnanle: false
};
},
watch:{
platformId(newData, oldData){
console.log(newData)
this.initData()
},
},
methods: {
initData: function() {
this.getChannelList();
@@ -75,30 +94,128 @@ export default {
this.initData();
},
handleSizeChange: function (val) {
this.count = val;
this.count = val;
console.log(val)
this.initData();
},
rowcheckedChanage: function (val, row) {
console.log(val)
console.log(row)
},
checkedChanage: function (val) {
var that = this;
if (!that.eventEnanle) {
return;
}
var tabelData = JSON.parse(JSON.stringify(this.$refs.gbChannelsTable.data));
console.log("checkedChanage")
console.log(val)
var newData = {};
var addData = [];
var delData = [];
if (val.length > 0) {
for (let i = 0; i < val.length; i++) {
const element = val[i];
var key = element.deviceId + "_" + element.channelId;
newData[key] = element;
if (!!!that.gbChoosechannel[key]){
addData.push(element)
}else{
delete that.gbChoosechannel[key]
}
}
var oldKeys = Object.keys(that.gbChoosechannel);
if (oldKeys.length > 0) {
for (let i = 0; i < oldKeys.length; i++) {
const key = oldKeys[i];
delData.push(that.gbChoosechannel[key])
}
}
}else{
var oldKeys = Object.keys(that.gbChoosechannel);
if (oldKeys.length > 0) {
for (let i = 0; i < oldKeys.length; i++) {
const key = oldKeys[i];
delData.push(that.gbChoosechannel[key])
}
}
}
that.gbChoosechannel = newData;
if (Object.keys(addData).length >0) {
that.$axios({
method:"post",
url:"/api/platforms/updateChannelForGB",
data:{
platformId: that.platformId,
channelReduces: addData
}
}).then((res)=>{
console.log("保存成功")
}).catch(function (error) {
console.log(error);
});
}
if (Object.keys(delData).length >0) {
that.$axios({
method:"post",
url:"/api/platforms/delChannelForGB",
data:{
platformId: that.platformId,
channelReduces: delData
}
}).then((res)=>{
console.log("移除成功")
}).catch(function (error) {
console.log(error);
});
}
},
shareAllCheckedChanage: function (val) {
this.chooseChanage(null, val)
},
getChannelList: function () {
let that = this;
this.$axios.get(`/api/platforms/channelList`, {
params: {
page: that.currentPage - 1,
page: that.currentPage,
count: that.count,
query: that.searchSrt,
online: that.online,
choosed: that.choosed,
platformId: that.platformId,
channelType: that.channelType
}
})
.then(function (res) {
console.log(res);
that.total = res.data.total;
that.gbChannels = res.data.list;
that.gbChoosechannel = {};
// 防止出现表格错位
that.$nextTick(() => {
that.$refs.gbChannelsTable.doLayout();
// 默认选中
var chooseGBS = [];
for (let i = 0; i < res.data.list.length; i++) {
const row = res.data.list[i];
console.log(row.platformId)
if (row.platformId == that.platformId) {
that.$refs.gbChannelsTable.toggleRowSelection(row, true);
chooseGBS.push(row)
that.gbChoosechannel[row.deviceId+ "_" + row.channelId] = row;
}
}
that.eventEnanle = true;
// that.checkedChanage(chooseGBS)
})
console.log(that.gbChoosechannel)
})
.catch(function (error) {
console.log(error);