增加通道关联以及录制计划接口完善
This commit is contained in:
648540858
@@ -9,82 +9,30 @@
|
||||
搜索:
|
||||
<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" style="width: 8rem; margin-right: 1rem;" @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-select size="mini" style="width: 8rem; margin-right: 1rem;" @change="search" v-model="hasRecordPlan"
|
||||
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="width: 8rem; margin-right: 1rem;" @change="getChannelList"
|
||||
v-model="channelType" placeholder="请选择"
|
||||
default-first-option>
|
||||
<el-option label="全部" value=""></el-option>
|
||||
<el-option label="国标设备" :value="0"></el-option>
|
||||
<el-option label="推流设备" :value="1"></el-option>
|
||||
<el-option label="拉流代理" :value="2"></el-option>
|
||||
</el-select>
|
||||
<el-button size="mini" type="primary" @click="add()">
|
||||
按国标设备添加
|
||||
添加
|
||||
</el-button>
|
||||
<el-button size="mini" type="danger" @click="remove()">
|
||||
按国标设备移除
|
||||
</el-button>
|
||||
<el-button icon="el-icon-refresh-right" circle size="mini" @click="getChannelList()"></el-button>
|
||||
<el-button icon="el-icon-refresh-right" circle size="mini" @click="getRecordPlanList()"></el-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<el-table size="medium" ref="channelListTable" :data="channelList" :height="winHeight" style="width: 100%"
|
||||
<el-table size="medium" ref="recordPlanListTable" :data="recordPlanList" :height="winHeight" style="width: 100%"
|
||||
header-row-class-name="table-header" >
|
||||
<el-table-column type="selection" width="55" >
|
||||
</el-table-column>
|
||||
<el-table-column prop="gbName" label="名称" min-width="180">
|
||||
<el-table-column prop="name" label="名称" >
|
||||
</el-table-column>
|
||||
<el-table-column prop="gbDeviceId" label="编号" min-width="180">
|
||||
<el-table-column prop="channelCount" label="关联通道" >
|
||||
</el-table-column>
|
||||
<el-table-column prop="gbManufacturer" label="厂家" min-width="100">
|
||||
<el-table-column prop="updateTime" label="更新时间">
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column label="类型" min-width="100">
|
||||
<el-table-column prop="createTime" label="创建时间">
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" width="300" fixed="right">
|
||||
<template v-slot:default="scope">
|
||||
<div slot="reference" class="name-wrapper">
|
||||
<el-tag size="medium" effect="plain" v-if="scope.row.gbDeviceDbId">国标设备</el-tag>
|
||||
<el-tag size="medium" effect="plain" type="success" v-if="scope.row.streamPushId">推流设备</el-tag>
|
||||
<el-tag size="medium" effect="plain" type="warning" v-if="scope.row.streamProxyId">拉流代理</el-tag>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="状态" min-width="100">
|
||||
<template v-slot:default="scope">
|
||||
<div slot="reference" class="name-wrapper">
|
||||
<el-tag size="medium" v-if="scope.row.gbStatus === 'ON'">在线</el-tag>
|
||||
<el-tag size="medium" type="info" v-if="scope.row.gbStatus !== 'ON'">离线</el-tag>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="录制计划" min-width="100">
|
||||
<template v-slot:default="scope">
|
||||
<div slot="reference" class="name-wrapper">
|
||||
<el-tag size="medium" effect="dark" v-if="scope.row.recordPlanId">已设置</el-tag>
|
||||
<el-tag size="medium" effect="dark" v-else>未设置</el-tag>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" width="200" fixed="right">
|
||||
<template v-slot:default="scope">
|
||||
<el-button size="medium" icon="el-icon-edit" type="text" v-if="scope.row.recordPlan" @click="edit(scope.row)">编辑</el-button>
|
||||
<el-button size="medium" icon="el-icon-plus" type="text" v-else @click="edit(scope.row)">添加</el-button>
|
||||
<el-button size="medium" icon="el-icon-link" type="text" @click="link(scope.row)">关联通道</el-button>
|
||||
<el-button size="medium" icon="el-icon-edit" type="text" @click="edit(scope.row)">编辑</el-button>
|
||||
<el-button size="medium" icon="el-icon-delete" style="color: #f56c6c" type="text" @click="deletePlan(scope.row)">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
@@ -99,37 +47,31 @@
|
||||
:total="total">
|
||||
</el-pagination>
|
||||
<editRecordPlan ref="editRecordPlan"></editRecordPlan>
|
||||
<LinkChannelRecord ref="linkChannelRecord"></LinkChannelRecord>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import uiHeader from '../layout/UiHeader.vue'
|
||||
import EditRecordPlan from "./dialog/editRecordPlan.vue";
|
||||
import LinkChannelRecord from "./dialog/linkChannelRecord.vue";
|
||||
|
||||
export default {
|
||||
name: 'recordPLan',
|
||||
components: {
|
||||
EditRecordPlan,
|
||||
LinkChannelRecord,
|
||||
uiHeader,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
channelList: [],
|
||||
recordPlanList: [],
|
||||
searchSrt: "",
|
||||
channelType: "",
|
||||
online: "",
|
||||
hasRecordPlan: "",
|
||||
hasGroup: "false",
|
||||
winHeight: window.innerHeight - 180,
|
||||
currentPage: 1,
|
||||
count: 15,
|
||||
total: 0,
|
||||
loading: false,
|
||||
loadSnap: {},
|
||||
groupId: "",
|
||||
businessGroup: "",
|
||||
regionParents: ["请选择虚拟组织"],
|
||||
multipleSelection: []
|
||||
};
|
||||
},
|
||||
|
||||
@@ -140,7 +82,7 @@ export default {
|
||||
},
|
||||
methods: {
|
||||
initData: function () {
|
||||
this.getChannelList();
|
||||
this.getRecordPlanList();
|
||||
},
|
||||
currentChange: function (val) {
|
||||
this.currentPage = val;
|
||||
@@ -148,27 +90,24 @@ export default {
|
||||
},
|
||||
handleSizeChange: function (val) {
|
||||
this.count = val;
|
||||
this.getChannelList();
|
||||
this.getRecordPlanList();
|
||||
},
|
||||
getChannelList: function () {
|
||||
getRecordPlanList: function () {
|
||||
this.$axios({
|
||||
method: 'get',
|
||||
url: `/api/common/channel/list`,
|
||||
url: `/api/record/plan/query`,
|
||||
params: {
|
||||
page: this.currentPage,
|
||||
count: this.count,
|
||||
query: this.searchSrt,
|
||||
online: this.online,
|
||||
hasRecordPlan: this.hasRecordPlan,
|
||||
channelType: this.channelType,
|
||||
}
|
||||
}).then((res) => {
|
||||
if (res.data.code === 0) {
|
||||
this.total = res.data.data.total;
|
||||
this.channelList = res.data.data.list;
|
||||
this.recordPlanList = res.data.data.list;
|
||||
// 防止出现表格错位
|
||||
this.$nextTick(() => {
|
||||
this.$refs.channelListTable.doLayout();
|
||||
this.$refs.recordPlanListTable.doLayout();
|
||||
})
|
||||
}
|
||||
|
||||
@@ -188,14 +127,56 @@ export default {
|
||||
refresh: function () {
|
||||
this.initData();
|
||||
},
|
||||
onChannelChange: function (deviceId) {
|
||||
//
|
||||
},
|
||||
edit: function (channel) {
|
||||
this.$refs.editRecordPlan.openDialog(channel, ()=>{
|
||||
add: function () {
|
||||
this.$refs.editRecordPlan.openDialog(null, ()=>{
|
||||
this.initData()
|
||||
})
|
||||
},
|
||||
edit: function (plan) {
|
||||
this.$refs.editRecordPlan.openDialog(plan, ()=>{
|
||||
this.initData()
|
||||
})
|
||||
},
|
||||
link: function (plan) {
|
||||
this.$refs.linkChannelRecord.openDialog(plan.id, ()=>{
|
||||
this.initData()
|
||||
})
|
||||
},
|
||||
deletePlan: function (plan) {
|
||||
this.$confirm('确定删除?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
this.$axios({
|
||||
method: 'delete',
|
||||
url: "/api/record/plan/delete",
|
||||
params: {
|
||||
planId: plan.id,
|
||||
}
|
||||
}).then((res) => {
|
||||
if (res.data.code === 0) {
|
||||
this.$message({
|
||||
showClose: true,
|
||||
message: '删除成功',
|
||||
type: 'success',
|
||||
});
|
||||
this.initData();
|
||||
} else {
|
||||
this.$message({
|
||||
showClose: true,
|
||||
message: res.data.msg,
|
||||
type: 'error'
|
||||
});
|
||||
}
|
||||
}).catch((error) => {
|
||||
console.error(error)
|
||||
});
|
||||
}).catch(() => {
|
||||
|
||||
});
|
||||
|
||||
},
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
@@ -10,8 +10,13 @@
|
||||
@close="close()"
|
||||
>
|
||||
<div id="shared" style="margin-right: 20px;">
|
||||
<ByteWeektimePicker v-model="byteTime" name="name"/>
|
||||
<el-form >
|
||||
<el-form-item label="名称">
|
||||
<el-input type="text" v-model="planName"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<ByteWeektimePicker v-model="byteTime" name="name"/>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<div style="float: right; margin-top: 20px">
|
||||
<el-button type="primary" @click="onSubmit">保存</el-button>
|
||||
@@ -38,67 +43,111 @@ export default {
|
||||
return {
|
||||
options: [],
|
||||
loading: false,
|
||||
edit: false,
|
||||
planName: null,
|
||||
id: null,
|
||||
showDialog: false,
|
||||
channel: "",
|
||||
deviceDbId: "",
|
||||
endCallback: "",
|
||||
byteTime: "",
|
||||
planList: [],
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
openDialog: function (channel, deviceDbId, endCallback) {
|
||||
this.channel = channel;
|
||||
this.deviceDbId = deviceDbId;
|
||||
openDialog: function (recordPlan, endCallback) {
|
||||
console.log(recordPlan);
|
||||
this.endCallback = endCallback;
|
||||
this.showDialog = true;
|
||||
this.byteTime= "";
|
||||
if (channel.recordPlanId) {
|
||||
// 请求plan信息
|
||||
if (recordPlan) {
|
||||
this.edit = true
|
||||
this.planName = recordPlan.name
|
||||
this.id = recordPlan.id
|
||||
this.$axios({
|
||||
method: 'get',
|
||||
url: "/api/record/plan/get",
|
||||
params: {
|
||||
planId: recordPlan.id,
|
||||
}
|
||||
}).then((res) => {
|
||||
if (res.data.code === 0) {
|
||||
this.byteTime = this.plan2Byte(res.data.data.planItemList)
|
||||
}
|
||||
}).catch((error) => {
|
||||
console.error(error)
|
||||
});
|
||||
|
||||
}
|
||||
},
|
||||
onSubmit: function () {
|
||||
let planList = this.byteTime2PlanList();
|
||||
console.log(planList)
|
||||
this.$axios({
|
||||
method: 'post',
|
||||
url: "/api/record/plan/add",
|
||||
params: {
|
||||
channelId: this.channel?this.channel.id:null,
|
||||
deviceDbId: this.deviceDbId,
|
||||
planList: planList
|
||||
}
|
||||
}).then((res) => {
|
||||
if (res.data.code === 0) {
|
||||
this.$message({
|
||||
showClose: true,
|
||||
message: '添加成功',
|
||||
type: 'success',
|
||||
});
|
||||
this.showDialog = false;
|
||||
this.endCallback()
|
||||
} else {
|
||||
this.$message({
|
||||
showClose: true,
|
||||
message: res.data.msg,
|
||||
type: 'error'
|
||||
});
|
||||
}
|
||||
}).catch((error) => {
|
||||
console.error(error)
|
||||
});
|
||||
if (!this.edit) {
|
||||
this.$axios({
|
||||
method: 'post',
|
||||
url: "/api/record/plan/add",
|
||||
data: {
|
||||
name: this.planName,
|
||||
planItemList: planList
|
||||
}
|
||||
}).then((res) => {
|
||||
if (res.data.code === 0) {
|
||||
this.$message({
|
||||
showClose: true,
|
||||
message: '添加成功',
|
||||
type: 'success',
|
||||
});
|
||||
this.showDialog = false;
|
||||
this.endCallback()
|
||||
} else {
|
||||
this.$message({
|
||||
showClose: true,
|
||||
message: res.data.msg,
|
||||
type: 'error'
|
||||
});
|
||||
}
|
||||
}).catch((error) => {
|
||||
console.error(error)
|
||||
});
|
||||
}else {
|
||||
this.$axios({
|
||||
method: 'post',
|
||||
url: "/api/record/plan/update",
|
||||
data: {
|
||||
id: this.id,
|
||||
name: this.planName,
|
||||
planItemList: planList
|
||||
}
|
||||
}).then((res) => {
|
||||
if (res.data.code === 0) {
|
||||
this.$message({
|
||||
showClose: true,
|
||||
message: '更新成功',
|
||||
type: 'success',
|
||||
});
|
||||
this.showDialog = false;
|
||||
this.endCallback()
|
||||
} else {
|
||||
this.$message({
|
||||
showClose: true,
|
||||
message: res.data.msg,
|
||||
type: 'error'
|
||||
});
|
||||
}
|
||||
}).catch((error) => {
|
||||
console.error(error)
|
||||
});
|
||||
}
|
||||
|
||||
},
|
||||
close: function () {
|
||||
this.channel = "";
|
||||
this.deviceDbId = "";
|
||||
this.showDialog = false;
|
||||
this.id = null
|
||||
this.planName = null
|
||||
this.byteTime = ""
|
||||
this.endCallback = ""
|
||||
if(this.endCallback) {
|
||||
this.endCallback();
|
||||
}
|
||||
},
|
||||
byteTime2PlanList() {
|
||||
this.planList = []
|
||||
if (this.byteTime.length === 0) {
|
||||
return;
|
||||
}
|
||||
@@ -114,8 +163,8 @@ export default {
|
||||
continue
|
||||
}
|
||||
for (let j = 0; j < planArray.length; j++) {
|
||||
console.log(planArray[j])
|
||||
planList.push({
|
||||
id: this.id,
|
||||
startTime: planArray[j].startTime,
|
||||
stopTime: planArray[j].stopTime,
|
||||
weekDay: week
|
||||
@@ -149,6 +198,27 @@ export default {
|
||||
}
|
||||
}
|
||||
return result;
|
||||
},
|
||||
plan2Byte(planList) {
|
||||
console.log(planList);
|
||||
let byte = ""
|
||||
let indexArray = {}
|
||||
for (let i = 0; i < planList.length; i++) {
|
||||
let index = planList[i].startTime/1000/60/30
|
||||
let endIndex = planList[i].stopTime/1000/60/30
|
||||
for (let j = index; j <= endIndex; j++) {
|
||||
indexArray[j + (planList[i].weekDay - 1 )*48] = j + i*48
|
||||
}
|
||||
}
|
||||
console.log(indexArray)
|
||||
for (let i = 0; i < 336; i++) {
|
||||
if (indexArray[i]){
|
||||
byte += "1"
|
||||
}else {
|
||||
byte += "0"
|
||||
}
|
||||
}
|
||||
return byte
|
||||
}
|
||||
},
|
||||
};
|
||||
|
||||
500
web_src/src/components/dialog/linkChannelRecord.vue
Executable file
500
web_src/src/components/dialog/linkChannelRecord.vue
Executable file
@@ -0,0 +1,500 @@
|
||||
<template>
|
||||
<div id="linkChannelRecord" style="width: 100%; background-color: #FFFFFF; display: grid; grid-template-columns: 200px auto;">
|
||||
<el-dialog title="通道共享" v-loading="dialogLoading" v-if="showDialog" top="2rem" width="80%" :close-on-click-modal="false" :visible.sync="showDialog" :destroy-on-close="true" @close="close()">
|
||||
<div style="display: grid; grid-template-columns: 100px auto;">
|
||||
<el-tabs tab-position="left" style="" v-model="hasLink" @tab-click="search">
|
||||
<el-tab-pane label="未关联" name="false"></el-tab-pane>
|
||||
<el-tab-pane label="已关联" name="true"></el-tab-pane>
|
||||
</el-tabs>
|
||||
<div>
|
||||
<div class="page-header">
|
||||
<div class="page-header-btn" >
|
||||
<div style="display: inline;">
|
||||
搜索:
|
||||
<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" style="width: 8rem; margin-right: 1rem;" @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-select size="mini" style="width: 8rem; margin-right: 1rem;" @change="search" v-model="channelType" placeholder="请选择"
|
||||
default-first-option>
|
||||
<el-option label="全部" value=""></el-option>
|
||||
<el-option label="国标设备" :value="0"></el-option>
|
||||
<el-option label="推流设备" :value="1"></el-option>
|
||||
<el-option label="拉流代理" :value="2"></el-option>
|
||||
</el-select>
|
||||
<el-button v-if="hasLink !=='true'" size="mini" type="primary" @click="add()">
|
||||
添加
|
||||
</el-button>
|
||||
<el-button v-if="hasLink ==='true'" size="mini" type="danger" @click="remove()">
|
||||
移除
|
||||
</el-button>
|
||||
<el-button size="mini" v-if="hasLink !=='true'" @click="addByDevice()">按设备添加</el-button>
|
||||
<el-button size="mini" v-if="hasLink ==='true'" @click="removeByDevice()">按设备移除</el-button>
|
||||
<el-button size="mini" v-if="hasLink !=='true'" @click="addAll()">全部添加</el-button>
|
||||
<el-button size="mini" v-if="hasLink ==='true'" @click="removeAll()">全部移除</el-button>
|
||||
<el-button size="mini" @click="getChannelList()">刷新</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<el-table size="small" ref="channelListTable" :data="channelList" :height="winHeight"
|
||||
header-row-class-name="table-header" @selection-change="handleSelectionChange" >
|
||||
<el-table-column type="selection" width="55" >
|
||||
</el-table-column>
|
||||
<el-table-column prop="gbName" label="名称" min-width="180">
|
||||
</el-table-column>
|
||||
<el-table-column prop="gbDeviceId" label="编号" min-width="180">
|
||||
</el-table-column>
|
||||
<el-table-column prop="gbManufacturer" label="厂家" min-width="100">
|
||||
</el-table-column>
|
||||
<el-table-column label="类型" min-width="100">
|
||||
<template v-slot:default="scope">
|
||||
<div slot="reference" class="name-wrapper">
|
||||
<el-tag size="medium" effect="plain" v-if="scope.row.gbDeviceDbId">国标设备</el-tag>
|
||||
<el-tag size="medium" effect="plain" type="success" v-if="scope.row.streamPushId">推流设备</el-tag>
|
||||
<el-tag size="medium" effect="plain" type="warning" v-if="scope.row.streamProxyId">拉流代理</el-tag>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="状态" min-width="100">
|
||||
<template v-slot:default="scope">
|
||||
<div slot="reference" class="name-wrapper">
|
||||
<el-tag size="medium" v-if="scope.row.gbStatus === 'ON'">在线</el-tag>
|
||||
<el-tag size="medium" type="info" v-if="scope.row.gbStatus !== 'ON'">离线</el-tag>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-pagination
|
||||
style="text-align: 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>
|
||||
<gbDeviceSelect ref="gbDeviceSelect"></gbDeviceSelect>
|
||||
</div>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
import gbDeviceSelect from "./GbDeviceSelect.vue";
|
||||
|
||||
export default {
|
||||
name: 'linkChannelRecord',
|
||||
components: {gbDeviceSelect},
|
||||
data() {
|
||||
return {
|
||||
dialogLoading: false,
|
||||
showDialog: false,
|
||||
chooseData: {},
|
||||
channelList: [],
|
||||
searchSrt: "",
|
||||
channelType: "",
|
||||
online: "",
|
||||
hasLink: "false",
|
||||
winHeight: window.innerHeight - 250,
|
||||
currentPage: 1,
|
||||
count: 15,
|
||||
total: 0,
|
||||
loading: false,
|
||||
planId: null,
|
||||
loadSnap: {},
|
||||
multipleSelection: []
|
||||
};
|
||||
},
|
||||
|
||||
created() {
|
||||
this.initData();
|
||||
},
|
||||
destroyed() {},
|
||||
methods: {
|
||||
openDialog(planId, closeCallback) {
|
||||
this.planId = planId
|
||||
this.showDialog = true
|
||||
this.closeCallback = closeCallback
|
||||
},
|
||||
initData: function () {
|
||||
this.getChannelList();
|
||||
},
|
||||
currentChange: function (val) {
|
||||
this.currentPage = val;
|
||||
this.initData();
|
||||
},
|
||||
handleSizeChange: function (val) {
|
||||
this.count = val;
|
||||
this.getChannelList();
|
||||
},
|
||||
getChannelList: function () {
|
||||
this.$axios({
|
||||
method: 'get',
|
||||
url: `/api/record/plan/channel/list`,
|
||||
params: {
|
||||
page: this.currentPage,
|
||||
count: this.count,
|
||||
query: this.searchSrt,
|
||||
online: this.online,
|
||||
channelType: this.channelType,
|
||||
planId: this.planId,
|
||||
hasLink: this.hasLink
|
||||
}
|
||||
}).then((res)=> {
|
||||
if (res.data.code === 0) {
|
||||
this.total = res.data.data.total;
|
||||
this.channelList = res.data.data.list;
|
||||
// 防止出现表格错位
|
||||
this.$nextTick(() => {
|
||||
this.$refs.channelListTable.doLayout();
|
||||
})
|
||||
}
|
||||
|
||||
}).catch((error)=> {
|
||||
|
||||
console.log(error);
|
||||
});
|
||||
},
|
||||
handleSelectionChange: function (val){
|
||||
this.multipleSelection = val;
|
||||
},
|
||||
add: function (row) {
|
||||
let channels = []
|
||||
for (let i = 0; i < this.multipleSelection.length; i++) {
|
||||
channels.push(this.multipleSelection[i].gbId)
|
||||
}
|
||||
if (channels.length === 0) {
|
||||
this.$message.info({
|
||||
showClose: true,
|
||||
message: "请选择通道"
|
||||
})
|
||||
return;
|
||||
}
|
||||
this.loading = true
|
||||
|
||||
this.$axios({
|
||||
method: 'post',
|
||||
url: `/api/record/plan/link`,
|
||||
data: {
|
||||
planId: this.planId,
|
||||
all: true,
|
||||
channelIds: channels
|
||||
}
|
||||
}).then((res)=> {
|
||||
if (res.data.code === 0) {
|
||||
this.$message.success({
|
||||
showClose: true,
|
||||
message: "保存成功"
|
||||
})
|
||||
this.getChannelList()
|
||||
}else {
|
||||
this.$message.error({
|
||||
showClose: true,
|
||||
message: res.data.msg
|
||||
})
|
||||
}
|
||||
this.loading = false
|
||||
}).catch((error)=> {
|
||||
this.$message.error({
|
||||
showClose: true,
|
||||
message: error
|
||||
})
|
||||
this.loading = false
|
||||
});
|
||||
},
|
||||
addAll: function (row) {
|
||||
this.$confirm("确定全部添加？", '提示', {
|
||||
dangerouslyUseHTMLString: true,
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
this.loading = true
|
||||
|
||||
this.$axios({
|
||||
method: 'post',
|
||||
url: `/api/platform/channel/add`,
|
||||
data: {
|
||||
platformId: this.platformId,
|
||||
all: true
|
||||
}
|
||||
}).then((res)=> {
|
||||
if (res.data.code === 0) {
|
||||
this.$message.success({
|
||||
showClose: true,
|
||||
message: "保存成功"
|
||||
})
|
||||
this.getChannelList()
|
||||
}else {
|
||||
this.$message.error({
|
||||
showClose: true,
|
||||
message: res.data.msg
|
||||
})
|
||||
}
|
||||
this.loading = false
|
||||
}).catch((error)=> {
|
||||
this.$message.error({
|
||||
showClose: true,
|
||||
message: error
|
||||
})
|
||||
this.loading = false
|
||||
});
|
||||
}).catch(() => {
|
||||
});
|
||||
},
|
||||
|
||||
addByDevice: function (row) {
|
||||
this.$refs.gbDeviceSelect.openDialog((rows)=>{
|
||||
let deviceIds = []
|
||||
for (let i = 0; i < rows.length; i++) {
|
||||
deviceIds.push(rows[i].id)
|
||||
}
|
||||
this.$axios({
|
||||
method: 'post',
|
||||
url: `/api/platform/channel/device/add`,
|
||||
data: {
|
||||
platformId: this.platformId,
|
||||
deviceIds: deviceIds,
|
||||
}
|
||||
}).then((res)=> {
|
||||
if (res.data.code === 0) {
|
||||
this.$message.success({
|
||||
showClose: true,
|
||||
message: "保存成功"
|
||||
})
|
||||
this.initData()
|
||||
}else {
|
||||
this.$message.error({
|
||||
showClose: true,
|
||||
message: res.data.msg
|
||||
})
|
||||
}
|
||||
}).catch((error)=> {
|
||||
this.$message.error({
|
||||
showClose: true,
|
||||
message: error
|
||||
})
|
||||
this.loading = false
|
||||
});
|
||||
})
|
||||
},
|
||||
|
||||
removeByDevice: function (row) {
|
||||
this.$refs.gbDeviceSelect.openDialog((rows)=>{
|
||||
let deviceIds = []
|
||||
for (let i = 0; i < rows.length; i++) {
|
||||
deviceIds.push(rows[i].id)
|
||||
}
|
||||
this.$axios({
|
||||
method: 'post',
|
||||
url: `/api/platform/channel/device/remove`,
|
||||
data: {
|
||||
platformId: this.platformId,
|
||||
deviceIds: deviceIds,
|
||||
}
|
||||
}).then((res)=> {
|
||||
if (res.data.code === 0) {
|
||||
this.$message.success({
|
||||
showClose: true,
|
||||
message: "保存成功"
|
||||
})
|
||||
this.initData()
|
||||
}else {
|
||||
this.$message.error({
|
||||
showClose: true,
|
||||
message: res.data.msg
|
||||
})
|
||||
}
|
||||
}).catch((error)=> {
|
||||
this.$message.error({
|
||||
showClose: true,
|
||||
message: error
|
||||
})
|
||||
this.loading = false
|
||||
});
|
||||
})
|
||||
},
|
||||
remove: function (row) {
|
||||
let channels = []
|
||||
for (let i = 0; i < this.multipleSelection.length; i++) {
|
||||
channels.push(this.multipleSelection[i].gbId)
|
||||
}
|
||||
if (channels.length === 0) {
|
||||
this.$message.info({
|
||||
showClose: true,
|
||||
message: "请选择通道"
|
||||
})
|
||||
return;
|
||||
}
|
||||
this.loading = true
|
||||
|
||||
this.$axios({
|
||||
method: 'delete',
|
||||
url: `/api/platform/channel/remove`,
|
||||
data: {
|
||||
platformId: this.platformId,
|
||||
channelIds: channels
|
||||
}
|
||||
}).then((res)=> {
|
||||
if (res.data.code === 0) {
|
||||
this.$message.success({
|
||||
showClose: true,
|
||||
message: "保存成功"
|
||||
})
|
||||
this.getChannelList()
|
||||
}else {
|
||||
this.$message.error({
|
||||
showClose: true,
|
||||
message: res.data.msg
|
||||
})
|
||||
}
|
||||
this.loading = false
|
||||
}).catch((error)=> {
|
||||
this.$message.error({
|
||||
showClose: true,
|
||||
message: error
|
||||
})
|
||||
this.loading = false
|
||||
});
|
||||
},
|
||||
removeAll: function (row) {
|
||||
|
||||
this.$confirm("确定全部移除？", '提示', {
|
||||
dangerouslyUseHTMLString: true,
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
this.loading = true
|
||||
this.$axios({
|
||||
method: 'delete',
|
||||
url: `/api/platform/channel/remove`,
|
||||
data: {
|
||||
platformId: this.platformId,
|
||||
all: true
|
||||
}
|
||||
}).then((res)=> {
|
||||
if (res.data.code === 0) {
|
||||
this.$message.success({
|
||||
showClose: true,
|
||||
message: "保存成功"
|
||||
})
|
||||
this.getChannelList()
|
||||
}else {
|
||||
this.$message.error({
|
||||
showClose: true,
|
||||
message: res.data.msg
|
||||
})
|
||||
}
|
||||
this.loading = false
|
||||
}).catch((error)=> {
|
||||
this.$message.error({
|
||||
showClose: true,
|
||||
message: error
|
||||
})
|
||||
this.loading = false
|
||||
});
|
||||
}).catch(() => {
|
||||
});
|
||||
|
||||
},
|
||||
saveCustom: function (row) {
|
||||
this.$axios({
|
||||
method: 'post',
|
||||
url: `/api/platform/channel/custom/update`,
|
||||
data: row
|
||||
}).then((res)=> {
|
||||
if (res.data.code === 0) {
|
||||
this.$message.success({
|
||||
showClose: true,
|
||||
message: "保存成功"
|
||||
})
|
||||
this.initData()
|
||||
}else {
|
||||
this.$message.error({
|
||||
showClose: true,
|
||||
message: res.data.msg
|
||||
})
|
||||
}
|
||||
}).catch((error)=> {
|
||||
this.$message.error({
|
||||
showClose: true,
|
||||
message: error
|
||||
})
|
||||
});
|
||||
},
|
||||
search: function () {
|
||||
this.currentPage = 1;
|
||||
this.total = 0;
|
||||
this.initData();
|
||||
},
|
||||
refresh: function () {
|
||||
this.initData();
|
||||
},
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.videoList {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-content: flex-start;
|
||||
}
|
||||
|
||||
.video-item {
|
||||
position: relative;
|
||||
width: 15rem;
|
||||
height: 10rem;
|
||||
margin-right: 1rem;
|
||||
background-color: #000000;
|
||||
}
|
||||
|
||||
.video-item-img {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
margin: auto;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.video-item-img:after {
|
||||
content: "";
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
z-index: 2;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
margin: auto;
|
||||
width: 3rem;
|
||||
height: 3rem;
|
||||
background-image: url("../../assets/loading.png");
|
||||
background-size: cover;
|
||||
background-color: #000000;
|
||||
}
|
||||
|
||||
.video-item-title {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
color: #000000;
|
||||
background-color: #ffffff;
|
||||
line-height: 1.5rem;
|
||||
padding: 0.3rem;
|
||||
width: 14.4rem;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user