From e0028a87cb4fc37759c9c33ecd20591fe6dd0aa7 Mon Sep 17 00:00:00 2001 From: 648540858 <648540858@qq.com> Date: 星期一, 07 二月 2022 14:12:34 +0800 Subject: [PATCH] 为推流列表增加搜索功能 --- web_src/src/components/dialog/chooseChannelForGb.vue | 128 ++++++++++++++++++++++++++++++------------ 1 files changed, 90 insertions(+), 38 deletions(-) diff --git a/web_src/src/components/dialog/chooseChannelForGb.vue b/web_src/src/components/dialog/chooseChannelForGb.vue index b21416c..e46d3e5 100644 --- a/web_src/src/components/dialog/chooseChannelForGb.vue +++ b/web_src/src/components/dialog/chooseChannelForGb.vue @@ -21,15 +21,14 @@ <el-option label="绂荤嚎" value="false"></el-option> </el-select> - <el-checkbox @change="shareAllCheckedChanage">鍏ㄩ儴鍏变韩</el-checkbox> +<!-- <el-checkbox @change="shareAllCheckedChange">鍏ㄩ儴鍏变韩</el-checkbox>--> </div> - <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 ref="gbChannelsTable" :data="gbChannels" border style="width: 100%" :height="winHeight"> + <el-table-column prop="channelId" label="閫氶亾缂栧彿" width="180" align="center"> </el-table-column> - <el-table-column prop="name" label="閫氶亾鍚嶇О"> + <el-table-column prop="name" label="閫氶亾鍚嶇О" show-overflow-tooltip align="center"> </el-table-column> - <el-table-column prop="deviceId" label="璁惧缂栧彿" width="210" > + <el-table-column prop="deviceId" label="璁惧缂栧彿" width="180" align="center"> </el-table-column> <el-table-column label="璁惧鍦板潃" width="180" align="center"> <template slot-scope="scope"> @@ -40,6 +39,14 @@ </el-table-column> <el-table-column prop="manufacturer" label="鍘傚" align="center"> </el-table-column> + <el-table-column label="鎿嶄綔" width="100" align="center" fixed="right"> + <template slot-scope="scope"> + <el-button-group> + <el-button size="mini" icon="el-icon-plus" v-if="!scope.row.platformId" @click="add(scope.row)">娣诲姞</el-button> + <el-button size="mini" icon="el-icon-delete" v-if="scope.row.platformId" type="danger" @click="remove(scope.row)">绉婚櫎</el-button> + </el-button-group> + </template> + </el-table-column> </el-table> <el-pagination style="float: right;margin-top: 1rem;" @size-change="handleSizeChange" @current-change="currentChange" :current-page="currentPage" :page-size="count" :page-sizes="[10, 20, 30, 50]" layout="total, sizes, prev, pager, next" :total="total"> </el-pagination> @@ -49,7 +56,6 @@ <script> export default { name: 'chooseChannelForGb', - props: {}, computed: { // getPlayerShared: function () { // return { @@ -59,7 +65,7 @@ // }; // } }, - props: ['platformId'], + props: ['platformId','catalogId', 'updateChoosedCallback'], created() { this.initData(); }, @@ -71,10 +77,11 @@ channelType: "", online: "", choosed: "", - currentPage: 0, + currentPage: 1, count: 10, total: 0, - eventEnanle: false + eventEnanle: false, + winHeight: window.innerHeight - 400, }; }, @@ -82,7 +89,7 @@ platformId(newData, oldData){ console.log(newData) this.initData() - + }, }, methods: { @@ -97,28 +104,61 @@ this.count = val; console.log(val) this.initData(); - }, - rowcheckedChanage: function (val, row) { + rowcheckedChange: function (val, row) { console.log(val) console.log(row) }, - checkedChanage: function (val) { - var that = this; + add: function (row) { + console.log(row) + row.catalogId = this.catalogId + row.platformId = this.platformId + this.$axios({ + method:"post", + url:"/api/platform/update_channel_for_gb", + data:{ + platformId: this.platformId, + channelReduces: [row], + catalogId: this.catalogId + } + }).then((res)=>{ + console.log("淇濆瓨鎴愬姛") + if(this.updateChoosedCallback)this.updateChoosedCallback(this.catalogId) + }).catch(function (error) { + console.log(error); + }); + }, + remove: function (row) { + console.log(row) + + this.$axios({ + method:"delete", + url:"/api/platform/del_channel_for_gb", + data:{ + platformId: this.platformId, + channelReduces: [row] + } + }).then((res)=>{ + console.log("绉婚櫎鎴愬姛") + if(this.updateChoosedCallback)this.updateChoosedCallback(row.catalogId) + row.platformId = null; + row.catalogId = null + }).catch(function (error) { + console.log(error); + }); + }, + checkedChange: function (val) { + let 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 = []; + let newData = {}; + let addData = []; + let delData = []; if (val.length > 0) { for (let i = 0; i < val.length; i++) { const element = val[i]; - var key = element.deviceId + "_" + element.channelId; + let key = element.deviceId + "_" + element.channelId; newData[key] = element; if (!!!that.gbChoosechannel[key]){ addData.push(element) @@ -126,17 +166,17 @@ delete that.gbChoosechannel[key] } } - - var oldKeys = Object.keys(that.gbChoosechannel); + + let 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); + let oldKeys = Object.keys(that.gbChoosechannel); if (oldKeys.length > 0) { for (let i = 0; i < oldKeys.length; i++) { const key = oldKeys[i]; @@ -149,40 +189,48 @@ if (Object.keys(addData).length >0) { that.$axios({ method:"post", - url:"/api/platforms/updateChannelForGB", + url:"/api/platform/update_channel_for_gb", data:{ platformId: that.platformId, - channelReduces: addData + channelReduces: addData, + catalogId: that.catalogId } }).then((res)=>{ console.log("淇濆瓨鎴愬姛") + if(that.updateChoosedCallback)that.updateChoosedCallback(that.catalogId) }).catch(function (error) { console.log(error); }); } - if (Object.keys(delData).length >0) { + if (delData.length >0) { that.$axios({ - method:"post", - url:"/api/platforms/delChannelForGB", + method:"delete", + url:"/api/platform/del_channel_for_gb", data:{ platformId: that.platformId, channelReduces: delData } }).then((res)=>{ console.log("绉婚櫎鎴愬姛") + let nodeIds = new Array(); + for (let i = 0; i < delData.length; i++) { + nodeIds.push(delData[i].channelId) + } + if(that.updateChoosedCallback)that.updateChoosedCallback(null, nodeIds) }).catch(function (error) { console.log(error); }); } - }, - shareAllCheckedChanage: function (val) { - this.chooseChanage(null, val) + shareAllCheckedChange: function (val) { + }, getChannelList: function () { let that = this; - this.$axios.get(`/api/platforms/channelList`, { + this.$axios({ + method:"get", + url:`/api/platform/channel_list`, params: { page: that.currentPage, count: that.count, @@ -209,11 +257,11 @@ that.$refs.gbChannelsTable.toggleRowSelection(row, true); chooseGBS.push(row) that.gbChoosechannel[row.deviceId+ "_" + row.channelId] = row; - + } } that.eventEnanle = true; - // that.checkedChanage(chooseGBS) + // that.checkedChange(chooseGBS) }) console.log(that.gbChoosechannel) }) @@ -228,6 +276,10 @@ handleGBSelectionChange: function() { this.initData(); }, + // catalogIdChange: function(id) { + // this.catalogId = id; + // console.log("閫氶亾閫夋嫨妯″潡鏀跺埌锛� " + id) + // }, } }; </script> -- Gitblit v1.8.0