临时提交
This commit is contained in:
648540858
@@ -27,6 +27,7 @@ export default {
|
||||
created() {},
|
||||
data() {
|
||||
return {
|
||||
endCallBack: null,
|
||||
syncStatus: null,
|
||||
percentage: 0,
|
||||
total: 0,
|
||||
@@ -40,7 +41,7 @@ export default {
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
openDialog: function (deviceId) {
|
||||
openDialog: function (deviceId, endCallBack) {
|
||||
console.log("deviceId: " + deviceId)
|
||||
this.deviceId = deviceId;
|
||||
this.showDialog = true;
|
||||
@@ -50,6 +51,7 @@ export default {
|
||||
this.current= 0;
|
||||
this.syncFlag= false;
|
||||
this.syncStatus = null;
|
||||
this.endCallBack = endCallBack;
|
||||
this.getProgress()
|
||||
},
|
||||
getProgress(){
|
||||
@@ -105,6 +107,9 @@ export default {
|
||||
});
|
||||
},
|
||||
close: function (){
|
||||
if (this.endCallBack) {
|
||||
this.endCallBack()
|
||||
}
|
||||
window.clearTimeout(this.timmer)
|
||||
}
|
||||
},
|
||||
|
||||
@@ -1,313 +0,0 @@
|
||||
<template>
|
||||
<div id="chooseChannelForCatalog" >
|
||||
<div style="background-color: #FFFFFF; margin-bottom: 1rem; position: relative; padding: 0.5rem; text-align: left;font-size: 14px;">
|
||||
<el-tree class="el-scrollbar"
|
||||
ref="tree"
|
||||
id="catalogTree"
|
||||
empty-text="未知节点"
|
||||
node-key="id"
|
||||
default-expand-all
|
||||
:highlight-current="false"
|
||||
:expand-on-click-node="false"
|
||||
:props="props"
|
||||
:load="loadNode"
|
||||
@node-contextmenu="contextmenuEventHandler"
|
||||
@node-click="nodeClickHandler"
|
||||
lazy>
|
||||
<span class="custom-tree-node" slot-scope="{ node, data }" style="width: 100%">
|
||||
<el-radio v-if="node.data.type === 0 || node.data.type === -1" style="margin-right: 0" v-model="chooseId" :label="node.data.id">{{''}}</el-radio>
|
||||
<span v-if="node.data.type === -1 && node.level === 1" style="font-size: 12px" class="iconfont icon-ziyuan"></span>
|
||||
<span v-if="node.data.type === 0 && node.level === 1" class="el-icon-s-home"></span>
|
||||
<span v-if="node.data.type === 0 && node.level > 1" class="el-icon-folder-opened"></span>
|
||||
<span v-if="node.data.type === 1" class="iconfont icon-shexiangtou"></span>
|
||||
<span v-if="node.data.type === 2" class="iconfont icon-zhibo"></span>
|
||||
<span style=" padding-left: 1px">{{ node.label }}</span>
|
||||
<span>
|
||||
<i style="margin-left: 5rem; color: #9d9d9d; padding-right: 20px" v-if="node.data.id === defaultCatalogIdSign">默认</i>
|
||||
</span>
|
||||
</span>
|
||||
</el-tree>
|
||||
</div>
|
||||
<catalogEdit ref="catalogEdit" :platformId="platformId" :platformDeviceId="platformDeviceId"></catalogEdit>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
<script>
|
||||
|
||||
import catalogEdit from './catalogEdit.vue'
|
||||
export default {
|
||||
name: 'chooseChannelForCatalog',
|
||||
props: ['platformId', 'platformDeviceId', 'platformName', 'defaultCatalogId', 'catalogIdChange'],
|
||||
created() {
|
||||
this.chooseId = this.defaultCatalogId;
|
||||
this.defaultCatalogIdSign = this.defaultCatalogId;
|
||||
this.initData();
|
||||
setTimeout(()=>{
|
||||
if (this.catalogIdChange)this.catalogIdChange(this.defaultCatalogId, this.platformName);
|
||||
}, 100)
|
||||
|
||||
},
|
||||
components: {
|
||||
catalogEdit,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
props: {
|
||||
label: 'name',
|
||||
children: 'children',
|
||||
isLeaf: 'leaf'
|
||||
},
|
||||
defaultCatalogIdSign: null,
|
||||
chooseNode: null,
|
||||
chooseId: "",
|
||||
chooseName: "",
|
||||
catalogTree: null,
|
||||
contextmenuShow: false
|
||||
|
||||
};
|
||||
},
|
||||
watch:{
|
||||
platformId(newData, oldData){
|
||||
console.log(newData)
|
||||
this.initData()
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
initData: function () {
|
||||
this.getCatalog();
|
||||
},
|
||||
|
||||
getCatalog: function(parentId, callback) {
|
||||
let that = this;
|
||||
this.$axios({
|
||||
method:"get",
|
||||
url:`/api/platform/catalog`,
|
||||
params: {
|
||||
platformId: that.platformId,
|
||||
parentId: parentId
|
||||
}
|
||||
}).then((res)=> {
|
||||
if (res.data.code === 0) {
|
||||
if (typeof(callback) === 'function') {
|
||||
callback(res.data.data)
|
||||
}
|
||||
}
|
||||
})
|
||||
.catch(function (error) {
|
||||
console.log(error);
|
||||
});
|
||||
|
||||
},
|
||||
addCatalog: function (parentId, node){
|
||||
// 打开添加弹窗
|
||||
this.$refs.catalogEdit.openDialog(false, null, null, parentId, node.level, ()=>{
|
||||
node.loaded = false
|
||||
node.expand();
|
||||
});
|
||||
|
||||
},
|
||||
refreshCatalog: function (node){
|
||||
node.loaded = false
|
||||
node.expand();
|
||||
},
|
||||
refreshCatalogById: function (id) {
|
||||
if (id) {
|
||||
let node = this.$refs.tree.getNode(id);
|
||||
this.refreshCatalog(node);
|
||||
}
|
||||
},
|
||||
editCatalog: function (data, node){
|
||||
// 打开添加弹窗
|
||||
this.$refs.catalogEdit.openDialog(true, data.id, data.name, data.parentId, node.level, (newData)=>{
|
||||
node.parent.loaded = false
|
||||
node.parent.expand();
|
||||
if (data.id === this.chooseId && newData.name !== data.name) {
|
||||
if (this.catalogIdChange)this.catalogIdChange(this.chooseId, newData.name);
|
||||
}
|
||||
});
|
||||
|
||||
},
|
||||
removeCatalog: function (id, node){
|
||||
this.$axios({
|
||||
method:"delete",
|
||||
url:`/api/platform/catalog/del`,
|
||||
params: {
|
||||
id: id,
|
||||
platformId: this.platformId,
|
||||
}
|
||||
}).then((res) => {
|
||||
if (res.data.code === 0) {
|
||||
console.log("移除成功")
|
||||
node.parent.loaded = false
|
||||
node.parent.expand();
|
||||
if (res.data.data) {
|
||||
this.defaultCatalogIdSign = res.data.data;
|
||||
}
|
||||
}
|
||||
})
|
||||
.catch(function (error) {
|
||||
console.log(error);
|
||||
});
|
||||
},
|
||||
setDefaultCatalog: function (id){
|
||||
this.$axios({
|
||||
method:"post",
|
||||
url:`/api/platform/catalog/default/update`,
|
||||
params: {
|
||||
platformId: this.platformId,
|
||||
catalogId: id,
|
||||
}
|
||||
}).then((res)=> {
|
||||
if (res.data.code === 0) {
|
||||
this.defaultCatalogIdSign = id;
|
||||
}
|
||||
})
|
||||
.catch(function (error) {
|
||||
console.log(error);
|
||||
});
|
||||
},
|
||||
loadNode: function(node, resolve){
|
||||
console.log("this.platformDeviceId： " + this.platformDeviceId)
|
||||
if (node.level === 0) {
|
||||
resolve([
|
||||
{
|
||||
name: "未分配",
|
||||
id: null,
|
||||
type: -1
|
||||
},{
|
||||
name: this.platformName,
|
||||
id: this.platformDeviceId,
|
||||
type: 0
|
||||
}
|
||||
]);
|
||||
}
|
||||
if (node.level >= 1){
|
||||
this.getCatalog(node.data.id, resolve)
|
||||
}
|
||||
},
|
||||
contextmenuEventHandler: function (event,data,node,element){
|
||||
if (node.data.type !== 0) {
|
||||
data.parentId = node.parent.data.id;
|
||||
this.$contextmenu({
|
||||
items: [
|
||||
{
|
||||
label: "移除通道",
|
||||
icon: "el-icon-delete",
|
||||
disabled: false,
|
||||
onClick: () => {
|
||||
this.$axios({
|
||||
method:"delete",
|
||||
url:"/api/platform/catalog/relation/del",
|
||||
data: data
|
||||
}).then((res)=>{
|
||||
console.log("移除成功")
|
||||
node.parent.loaded = false
|
||||
node.parent.expand();
|
||||
}).catch(function (error) {
|
||||
console.log(error);
|
||||
});
|
||||
}
|
||||
}
|
||||
],
|
||||
event, // 鼠标事件信息
|
||||
customClass: "custom-class", // 自定义菜单 class
|
||||
zIndex: 3000, // 菜单样式 z-index
|
||||
});
|
||||
}else {
|
||||
this.$contextmenu({
|
||||
items: [
|
||||
{
|
||||
label: "刷新节点",
|
||||
icon: "el-icon-refresh",
|
||||
disabled: false,
|
||||
onClick: () => {
|
||||
this.refreshCatalog(node);
|
||||
}
|
||||
},
|
||||
{
|
||||
label: "新建节点",
|
||||
icon: "el-icon-plus",
|
||||
disabled: false,
|
||||
onClick: () => {
|
||||
this.addCatalog(data.id, node);
|
||||
}
|
||||
},
|
||||
{
|
||||
label: "修改节点",
|
||||
icon: "el-icon-edit",
|
||||
disabled: node.level === 1,
|
||||
onClick: () => {
|
||||
this.editCatalog(data, node);
|
||||
}
|
||||
},
|
||||
{
|
||||
label: "删除节点",
|
||||
icon: "el-icon-delete",
|
||||
disabled: node.level === 1,
|
||||
divided: true,
|
||||
onClick: () => {
|
||||
this.$confirm('确定删除?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
this.removeCatalog(data.id, node)
|
||||
}).catch(() => {
|
||||
|
||||
});
|
||||
}
|
||||
},
|
||||
{
|
||||
label: "设为默认",
|
||||
icon: "el-icon-folder-checked",
|
||||
disabled: node.data.id === this.defaultCatalogIdSign,
|
||||
onClick: () => {
|
||||
this.setDefaultCatalog(data.id)
|
||||
},
|
||||
},
|
||||
// {
|
||||
// label: "导出",
|
||||
// icon: "el-icon-download",
|
||||
// disabled: false,
|
||||
// children: [
|
||||
// {
|
||||
// label: "导出到文件",
|
||||
// onClick: () => {
|
||||
//
|
||||
// },
|
||||
// },
|
||||
// {
|
||||
// label: "导出到其他平台",
|
||||
// onClick: () => {
|
||||
//
|
||||
// },
|
||||
// }
|
||||
// ]
|
||||
// },
|
||||
|
||||
],
|
||||
event, // 鼠标事件信息
|
||||
customClass: "custom-class", // 自定义菜单 class
|
||||
zIndex: 3000, // 菜单样式 z-index
|
||||
});
|
||||
}
|
||||
|
||||
return false;
|
||||
},
|
||||
nodeClickHandler: function (data, node, tree){
|
||||
console.log(data)
|
||||
console.log(node)
|
||||
this.chooseId = data.id;
|
||||
this.chooseName = data.name;
|
||||
if (this.catalogIdChange)this.catalogIdChange(this.chooseId, this.chooseName);
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
#catalogTree{
|
||||
display: inline-block;
|
||||
}
|
||||
</style>
|
||||
@@ -1,351 +0,0 @@
|
||||
<template>
|
||||
<div id="chooseChannelForGb" v-loading="loading">
|
||||
<div style="font-size: 17px; color: #606060; white-space: nowrap; line-height: 30px; font-family: monospace;">
|
||||
<span v-if="catalogId == null">{{catalogName}}的国标通道</span>
|
||||
<span v-if="catalogId != null">{{catalogName}}({{catalogId}})的国标通道</span>
|
||||
</div>
|
||||
<div style="background-color: #FFFFFF; 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; 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; 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-button v-if="catalogId !== null" icon="el-icon-delete" size="mini" :disabled="gbChannels.length === 0 || multipleSelection.length === 0" type="danger" @click="batchDel">批量移除</el-button>
|
||||
<el-button v-if="catalogId === null" icon="el-icon-plus" size="mini" :disabled="gbChannels.length === 0 || multipleSelection.length === 0" @click="batchAdd">批量添加</el-button>
|
||||
<el-button v-if="catalogId === null" icon="el-icon-plus" size="mini" @click="add()">全部添加</el-button>
|
||||
<el-button v-if="catalogId !== null" type="danger" icon="el-icon-delete" size="mini" @click="remove()">全部移除</el-button>
|
||||
</div>
|
||||
|
||||
<el-table size="medium" ref="gbChannelsTable" :data="gbChannels" border style="width: 100%" :height="winHeight" :row-key="(row)=> row.deviceId + row.channelId" @selection-change="handleSelectionChange">
|
||||
<el-table-column align="center" type="selection" :reserve-selection="true" width="55">
|
||||
</el-table-column>
|
||||
<el-table-column prop="channelId" label="通道编号" width="180" align="center">
|
||||
</el-table-column>
|
||||
<el-table-column prop="name" label="通道名称" show-overflow-tooltip align="center">
|
||||
</el-table-column>
|
||||
<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">
|
||||
<div slot="reference" class="name-wrapper">
|
||||
<el-tag size="medium">{{ scope.row.hostAddress }}</el-tag>
|
||||
</div>
|
||||
</template>
|
||||
</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="catalogId === null" @click="add(scope.row)">添加</el-button>
|
||||
<el-button size="mini" icon="el-icon-delete" v-if="catalogId !== null" type="danger" @click="remove(scope.row)">移除</el-button>
|
||||
</el-button-group>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-pagination style="text-align: 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>
|
||||
<getCatalog ref="getCatalog" :platformId="platformId" ></getCatalog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import getCatalog from './getCatalog'
|
||||
export default {
|
||||
name: 'chooseChannelForGb',
|
||||
computed: {
|
||||
// getPlayerShared: function () {
|
||||
// return {
|
||||
// sharedUrl: window.location.host + '/' + this.videoUrl,
|
||||
// sharedIframe: '<iframe src="' + window.location.host + '/' + this.videoUrl + '"></iframe>',
|
||||
// sharedRtmp: this.videoUrl
|
||||
// };
|
||||
// }
|
||||
},
|
||||
props: ['platformId','catalogId', 'catalogName'],
|
||||
created() {
|
||||
this.initData();
|
||||
},
|
||||
components: {
|
||||
getCatalog,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
gbChannels: [],
|
||||
gbChoosechannel:{},
|
||||
searchSrt: "",
|
||||
channelType: "",
|
||||
online: "",
|
||||
choosed: "",
|
||||
currentPage: 1,
|
||||
count: 10,
|
||||
total: 0,
|
||||
eventEnable: false,
|
||||
multipleSelection: [],
|
||||
winHeight: window.innerHeight - 400,
|
||||
|
||||
};
|
||||
},
|
||||
watch:{
|
||||
platformId(newData, oldData){
|
||||
console.log(newData)
|
||||
this.getChannelList()
|
||||
},
|
||||
catalogId(newData, oldData){
|
||||
this.getChannelList()
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
initData: function() {
|
||||
this.getChannelList();
|
||||
},
|
||||
currentChange: function (val) {
|
||||
this.currentPage = val;
|
||||
this.initData();
|
||||
},
|
||||
handleSizeChange: function (val) {
|
||||
this.count = val;
|
||||
console.log(val)
|
||||
this.initData();
|
||||
},
|
||||
add: function (row) {
|
||||
let all = typeof(row) === "undefined"
|
||||
|
||||
this.getCatalogFromUser((catalogId)=> {
|
||||
let task = null;
|
||||
this.$axios({
|
||||
method:"post",
|
||||
url:"/api/platform/update_channel_for_gb",
|
||||
data:{
|
||||
platformId: this.platformId,
|
||||
all: all,
|
||||
channelReduces: all?[]:[row],
|
||||
catalogId: catalogId
|
||||
}
|
||||
}).then((res)=>{
|
||||
console.log("保存成功")
|
||||
window.clearTimeout(task);
|
||||
this.loading = false;
|
||||
this.getChannelList();
|
||||
}).catch((error)=> {
|
||||
window.clearTimeout(task);
|
||||
this.loading = false;
|
||||
console.log(error);
|
||||
});
|
||||
task= setTimeout(()=>{
|
||||
this.loading = true;
|
||||
}, 200)
|
||||
})
|
||||
|
||||
|
||||
},
|
||||
remove: function (row) {
|
||||
let all = typeof(row) === "undefined"
|
||||
this.$confirm(`确定移除${all?"所有通道":""}吗？`, '提示', {
|
||||
dangerouslyUseHTMLString: true,
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
console.log(row)
|
||||
|
||||
this.$axios({
|
||||
method:"delete",
|
||||
url:"/api/platform/del_channel_for_gb",
|
||||
data:{
|
||||
platformId: this.platformId,
|
||||
all: all,
|
||||
channelReduces: all?[]:[row],
|
||||
}
|
||||
}).then((res)=>{
|
||||
console.log("移除成功")
|
||||
this.getChannelList();
|
||||
}).catch(function (error) {
|
||||
console.log(error);
|
||||
});
|
||||
}).catch(() => {
|
||||
|
||||
});
|
||||
|
||||
|
||||
},
|
||||
// checkedChange: function (val) {
|
||||
// let that = this;
|
||||
// if (!that.eventEnable) {
|
||||
// return;
|
||||
// }
|
||||
// let newData = {};
|
||||
// let addData = [];
|
||||
// let delData = [];
|
||||
// if (val.length > 0) {
|
||||
// for (let i = 0; i < val.length; i++) {
|
||||
// const element = val[i];
|
||||
// let key = element.deviceId + "_" + element.channelId;
|
||||
// newData[key] = element;
|
||||
// if (!!!that.gbChoosechannel[key]){
|
||||
// addData.push(element)
|
||||
// }else{
|
||||
// delete that.gbChoosechannel[key]
|
||||
// }
|
||||
// }
|
||||
//
|
||||
// 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{
|
||||
// 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])
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
//
|
||||
// that.gbChoosechannel = newData;
|
||||
// if (Object.keys(addData).length >0) {
|
||||
// that.$axios({
|
||||
// method:"post",
|
||||
// url:"/api/platform/update_channel_for_gb",
|
||||
// data:{
|
||||
// platformId: that.platformId,
|
||||
// channelReduces: addData,
|
||||
// catalogId: that.catalogId
|
||||
// }
|
||||
// }).then((res)=>{
|
||||
// console.log("保存成功")
|
||||
// }).catch(function (error) {
|
||||
// console.log(error);
|
||||
// });
|
||||
// }
|
||||
// if (delData.length >0) {
|
||||
// that.$axios({
|
||||
// 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)
|
||||
// }
|
||||
// }).catch(function (error) {
|
||||
// console.log(error);
|
||||
// });
|
||||
// }
|
||||
// },
|
||||
// shareAllCheckedChange: function (val) {
|
||||
//
|
||||
// },
|
||||
getChannelList: function () {
|
||||
let that = this;
|
||||
|
||||
this.$axios({
|
||||
method:"get",
|
||||
url:`/api/platform/channel_list`,
|
||||
params: {
|
||||
page: that.currentPage,
|
||||
count: that.count,
|
||||
query: that.searchSrt,
|
||||
online: that.online,
|
||||
catalogId: that.catalogId,
|
||||
platformId: that.platformId,
|
||||
channelType: that.channelType
|
||||
}
|
||||
})
|
||||
.then(function (res) {
|
||||
if (res.data.code === 0 ) {
|
||||
that.total = res.data.data.total;
|
||||
that.gbChannels = res.data.data.list;
|
||||
that.gbChoosechannel = {};
|
||||
}
|
||||
// 防止出现表格错位
|
||||
that.$nextTick(() => {
|
||||
that.$refs.gbChannelsTable.doLayout();
|
||||
that.eventEnable = true;
|
||||
})
|
||||
})
|
||||
.catch(function (error) {
|
||||
console.log(error);
|
||||
});
|
||||
|
||||
},
|
||||
search: function() {
|
||||
this.initData();
|
||||
},
|
||||
handleGBSelectionChange: function() {
|
||||
this.initData();
|
||||
},
|
||||
batchDel: function() {
|
||||
this.$confirm(`确认这${this.multipleSelection.length}个通道吗？`, '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
this.$axios({
|
||||
method:"delete",
|
||||
url:"/api/platform/del_channel_for_gb",
|
||||
data:{
|
||||
platformId: this.platformId,
|
||||
channelReduces: this.multipleSelection
|
||||
}
|
||||
}).then((res)=>{
|
||||
console.log("移除成功")
|
||||
this.$refs.gbChannelsTable.clearSelection()
|
||||
this.getChannelList();
|
||||
}).catch(function (error) {
|
||||
console.log(error);
|
||||
});
|
||||
}).catch(() => {
|
||||
});
|
||||
},
|
||||
batchAdd: function() {
|
||||
this.getCatalogFromUser((catalogId)=> {
|
||||
|
||||
this.$axios({
|
||||
method: "post",
|
||||
url: "/api/platform/update_channel_for_gb",
|
||||
data: {
|
||||
platformId: this.platformId,
|
||||
channelReduces: this.multipleSelection,
|
||||
catalogId: catalogId,
|
||||
}
|
||||
}).then((res) => {
|
||||
console.log("保存成功")
|
||||
this.$refs.gbChannelsTable.clearSelection()
|
||||
this.getChannelList();
|
||||
}).catch(function (error) {
|
||||
console.log(error);
|
||||
});
|
||||
});
|
||||
},
|
||||
handleSelectionChange: function (val) {
|
||||
this.multipleSelection = val;
|
||||
},
|
||||
getCatalogFromUser(callback){
|
||||
this.$refs.getCatalog.openDialog(callback)
|
||||
},
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
||||
@@ -1,281 +0,0 @@
|
||||
<template>
|
||||
<div id="chooseChannelFoStream" v-loading="loading">
|
||||
<div style="font-size: 17px; color: #606060; white-space: nowrap; line-height: 30px; font-family: monospace;">
|
||||
<span v-if="catalogId == null">{{catalogName}}的直播通道</span>
|
||||
<span v-if="catalogId != null">{{catalogName}}({{catalogId}})的直播通道</span>
|
||||
</div>
|
||||
<div style="background-color: #FFFFFF; margin-bottom: 1rem; position: relative; padding: 0.5rem; text-align: left;font-size: 14px;">
|
||||
|
||||
搜索: <el-input @input="getChannelList" 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="getChannelList" style="margin-right: 1rem;" v-model="mediaServerId" placeholder="请选择" default-first-option>-->
|
||||
<!-- <el-option label="全部" value=""></el-option>-->
|
||||
<!-- <el-option-->
|
||||
<!-- v-for="item in mediaServerList"-->
|
||||
<!-- :key="item.id"-->
|
||||
<!-- :label="item.id"-->
|
||||
<!-- :value="item.id">-->
|
||||
<!-- </el-option>-->
|
||||
<!-- </el-select>-->
|
||||
推流状态: <el-select size="mini" style="margin-right: 1rem;" @change="getChannelList" v-model="pushing" 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-button v-if="catalogId !== null" icon="el-icon-delete" size="mini" style="margin-right: 1rem;" :disabled="gbStreams.length === 0 || multipleSelection.length === 0" type="danger" @click="batchDel">批量移除</el-button>
|
||||
<el-button v-if="catalogId === null" icon="el-icon-plus" size="mini" style="margin-right: 1rem;" :disabled="gbStreams.length === 0 || multipleSelection.length === 0" @click="batchAdd">批量添加</el-button>
|
||||
<el-button v-if="catalogId === null" icon="el-icon-plus" size="mini" style="margin-right: 1rem;" @click="add()">全部添加</el-button>
|
||||
<el-button v-if="catalogId !== null" type="danger" icon="el-icon-delete" size="mini" style="margin-right: 1rem;" @click="remove()">全部移除</el-button>
|
||||
</div>
|
||||
<el-table size="medium" ref="gbStreamsTable" :data="gbStreams" border style="width: 100%" :height="winHeight" :row-key="(row)=> row.app + row.stream" @selection-change="handleSelectionChange">
|
||||
<el-table-column align="center" type="selection" :reserve-selection="true" width="55">
|
||||
</el-table-column>
|
||||
<el-table-column prop="name" label="名称" show-overflow-tooltip align="center">
|
||||
</el-table-column>
|
||||
<el-table-column prop="app" label="应用名" show-overflow-tooltip align="center">
|
||||
</el-table-column>
|
||||
<el-table-column prop="stream" label="流ID" show-overflow-tooltip align="center">
|
||||
</el-table-column>
|
||||
<el-table-column prop="gbId" label="国标编码" show-overflow-tooltip align="center">
|
||||
</el-table-column>
|
||||
<el-table-column label="流来源" width="100" align="center">
|
||||
<template slot-scope="scope">
|
||||
<div slot="reference" class="name-wrapper">
|
||||
<el-tag size="medium" v-if="scope.row.streamType == 'proxy'">拉流代理</el-tag>
|
||||
<el-tag size="medium" v-if="scope.row.streamType == 'push'">推流</el-tag>
|
||||
</div>
|
||||
</template>
|
||||
</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="catalogId === null" @click="add(scope.row, scope)">添加</el-button>
|
||||
<el-button size="mini" icon="el-icon-delete" v-if="catalogId !== null" type="danger" @click="remove(scope.row, scope)">移除</el-button>
|
||||
</el-button-group>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-pagination style="text-align: 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>
|
||||
<getCatalog ref="getCatalog" :platformId="platformId" ></getCatalog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import MediaServer from './../service/MediaServer'
|
||||
import getCatalog from './getCatalog'
|
||||
export default {
|
||||
name: 'chooseChannelFoStream',
|
||||
computed: {
|
||||
// getPlayerShared: function () {
|
||||
// return {
|
||||
// sharedUrl: window.location.host + '/' + this.videoUrl,
|
||||
// sharedIframe: '<iframe src="' + window.location.host + '/' + this.videoUrl + '"></iframe>',
|
||||
// sharedRtmp: this.videoUrl
|
||||
// };
|
||||
// }
|
||||
},
|
||||
props: ['platformId', 'catalogId', 'catalogName'],
|
||||
created() {
|
||||
this.initData();
|
||||
console.log(this.catalogId)
|
||||
},
|
||||
components: {
|
||||
getCatalog,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
gbStreams: [],
|
||||
gbChoosechannel:{},
|
||||
channelType: "",
|
||||
online: "",
|
||||
choosed: "",
|
||||
currentPage: 1,
|
||||
count: 10,
|
||||
total: 0,
|
||||
searchSrt: "",
|
||||
pushing: "",
|
||||
mediaServerId: "",
|
||||
mediaServerList: [],
|
||||
mediaServerObj : new MediaServer(),
|
||||
eventEnable: false,
|
||||
multipleSelection: [],
|
||||
winHeight: window.innerHeight - 350,
|
||||
|
||||
};
|
||||
},
|
||||
watch:{
|
||||
platformId(newData, oldData){
|
||||
this.getChannelList()
|
||||
},
|
||||
catalogId(newData, oldData){
|
||||
this.getChannelList()
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
initData: function() {
|
||||
this.mediaServerObj.getOnlineMediaServerList((data)=>{
|
||||
this.mediaServerList = data.data;
|
||||
})
|
||||
this.getChannelList();
|
||||
},
|
||||
currentChange: function (val) {
|
||||
this.currentPage = val;
|
||||
this.getChannelList();
|
||||
},
|
||||
handleSizeChange: function (val) {
|
||||
this.count = val;
|
||||
console.log(val)
|
||||
this.getChannelList();
|
||||
|
||||
},
|
||||
add: function (row, scope) {
|
||||
let all = typeof(row) === "undefined"
|
||||
this.getCatalogFromUser((catalogId)=>{
|
||||
let task = null;
|
||||
this.$axios({
|
||||
method:"post",
|
||||
url:"/api/gbStream/add",
|
||||
data:{
|
||||
platformId: this.platformId,
|
||||
catalogId: catalogId,
|
||||
all: all,
|
||||
gbStreams: all?[]:[row],
|
||||
}
|
||||
}).then((res)=>{
|
||||
console.log("保存成功")
|
||||
window.clearTimeout(task);
|
||||
this.loading = false;
|
||||
// this.gbStreams.splice(scope.$index,1)
|
||||
this.getChannelList();
|
||||
}).catch(function (error) {
|
||||
window.clearTimeout(task);
|
||||
this.loading = false;
|
||||
console.log(error);
|
||||
});
|
||||
task= setTimeout(()=>{
|
||||
this.loading = true;
|
||||
}, 200)
|
||||
})
|
||||
|
||||
|
||||
},
|
||||
remove: function (row, scope) {
|
||||
let all = typeof(row) === "undefined"
|
||||
this.$confirm(`确定移除${all?"所有通道":""}吗？`, '提示', {
|
||||
dangerouslyUseHTMLString: true,
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
|
||||
this.$axios({
|
||||
method:"delete",
|
||||
url:"/api/gbStream/del",
|
||||
data:{
|
||||
platformId: this.platformId,
|
||||
all: all,
|
||||
gbStreams: all?[]:[row],
|
||||
}
|
||||
}).then((res)=>{
|
||||
console.log("移除成功")
|
||||
// this.gbStreams.splice(scope.$index,1)
|
||||
this.getChannelList();
|
||||
}).catch(function (error) {
|
||||
console.log(error);
|
||||
});
|
||||
}).catch(() => {
|
||||
|
||||
});
|
||||
|
||||
},
|
||||
getChannelList: function () {
|
||||
let that = this;
|
||||
|
||||
this.$axios({
|
||||
method: 'get',
|
||||
url:`/api/gbStream/list`,
|
||||
params: {
|
||||
page: that.currentPage,
|
||||
count: that.count,
|
||||
query: that.searchSrt,
|
||||
platformId: that.platformId,
|
||||
catalogId: that.catalogId,
|
||||
mediaServerId: that.mediaServerId
|
||||
}
|
||||
})
|
||||
.then(function (res) {
|
||||
if (res.data.code === 0) {
|
||||
that.total = res.data.data.total;
|
||||
that.gbStreams = res.data.data.list;
|
||||
that.gbChoosechannel = {};
|
||||
// 防止出现表格错位
|
||||
that.$nextTick(() => {
|
||||
that.$refs.gbStreamsTable.doLayout();
|
||||
// 默认选中
|
||||
that.eventEnable = true;
|
||||
})
|
||||
}
|
||||
})
|
||||
.catch(function (error) {
|
||||
console.log(error);
|
||||
});
|
||||
|
||||
},
|
||||
batchDel: function() {
|
||||
this.$confirm(`确认这${this.multipleSelection.length}个通道吗？`, '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
this.$axios({
|
||||
method:"delete",
|
||||
url:"/api/gbStream/del",
|
||||
data:{
|
||||
platformId: this.platformId,
|
||||
gbStreams: this.multipleSelection,
|
||||
}
|
||||
}).then((res)=>{
|
||||
console.log("移除成功")
|
||||
this.$refs.gbStreamsTable.clearSelection()
|
||||
this.getChannelList();
|
||||
}).catch(function (error) {
|
||||
console.log(error);
|
||||
});
|
||||
}).catch(() => {
|
||||
});
|
||||
|
||||
},
|
||||
batchAdd: function() {
|
||||
this.getCatalogFromUser((catalogId)=>{
|
||||
this.$axios({
|
||||
method:"post",
|
||||
url:"/api/gbStream/add",
|
||||
data:{
|
||||
platformId: this.platformId,
|
||||
catalogId: catalogId,
|
||||
gbStreams: this.multipleSelection,
|
||||
}
|
||||
}).then((res)=>{
|
||||
console.log("保存成功")
|
||||
this.$refs.gbStreamsTable.clearSelection()
|
||||
this.getChannelList();
|
||||
}).catch(function (error) {
|
||||
console.log(error);
|
||||
});
|
||||
})
|
||||
},
|
||||
getCatalogFromUser(callback){
|
||||
this.$refs.getCatalog.openDialog(callback)
|
||||
},
|
||||
handleSelectionChange: function (val) {
|
||||
this.multipleSelection = val;
|
||||
},
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
||||
@@ -1,167 +0,0 @@
|
||||
<template>
|
||||
<div id="getCatalog" >
|
||||
|
||||
<el-dialog title="选择要添加到的节点" v-if="showDialog" width="50%" :append-to-body="true" :close-on-click-modal="false" :visible.sync="showDialog" :destroy-on-close="true" @close="close()" center>
|
||||
<div>
|
||||
<el-tree class="el-scrollbar"
|
||||
ref="tree"
|
||||
id="catalogTree"
|
||||
empty-text="未知节点"
|
||||
node-key="id"
|
||||
default-expand-all
|
||||
:highlight-current="false"
|
||||
:expand-on-click-node="false"
|
||||
:props="props"
|
||||
:load="loadNode"
|
||||
@node-click="nodeClickHandler"
|
||||
lazy>
|
||||
<span class="custom-tree-node" slot-scope="{ node, data }" style="width: 100%">
|
||||
<el-radio v-if="node.data.type === 0 || node.data.type === -1" style="margin-right: 0" v-model="chooseId" :label="node.data.id">{{''}}</el-radio>
|
||||
<span v-if="node.data.type === -1 && node.level === 1" style="font-size: 12px" class="iconfont icon-ziyuan"></span>
|
||||
<span v-if="node.data.type === 0 && node.level === 1" class="el-icon-s-home"></span>
|
||||
<span v-if="node.data.type === 0 && node.level > 1" class="el-icon-folder-opened"></span>
|
||||
<span v-if="node.data.type === 1" class="iconfont icon-shexiangtou"></span>
|
||||
<span v-if="node.data.type === 2" class="iconfont icon-zhibo"></span>
|
||||
<span style=" padding-left: 1px">{{ node.label }}</span>
|
||||
<span>
|
||||
<i style="margin-left: 5rem; color: #9d9d9d; padding-right: 20px" v-if="node.data.id === defaultCatalogIdSign">默认</i>
|
||||
</span>
|
||||
</span>
|
||||
</el-tree>
|
||||
</div>
|
||||
<div style="float: right; height: 13rem">
|
||||
<el-button type="primary" size="mini" @click="submit()" >确认</el-button>
|
||||
<el-button @click="close()" size="mini">取消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
<script>
|
||||
|
||||
export default {
|
||||
name: 'getCatalog',
|
||||
beforeCreate(){
|
||||
|
||||
},
|
||||
created() {
|
||||
this.chooseId = this.defaultCatalogId;
|
||||
this.defaultCatalogIdSign = this.defaultCatalogId;
|
||||
this.initData();
|
||||
setTimeout(()=>{
|
||||
if (this.catalogIdChange)this.catalogIdChange(this.defaultCatalogId);
|
||||
}, 100)
|
||||
|
||||
},
|
||||
props: ['platformId'],
|
||||
data() {
|
||||
return {
|
||||
props: {
|
||||
label: 'name',
|
||||
children: 'children',
|
||||
isLeaf: 'leaf'
|
||||
},
|
||||
platformName: null,
|
||||
defaultCatalogId: null,
|
||||
catalogIdResult: null,
|
||||
showDialog: false,
|
||||
defaultCatalogIdSign: null,
|
||||
chooseNode: null,
|
||||
chooseId: "",
|
||||
catalogTree: null,
|
||||
contextmenuShow: false,
|
||||
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
openDialog(catalogIdResult) {
|
||||
console.log(this.chooseId)
|
||||
this.showDialog = true
|
||||
this.catalogIdResult = catalogIdResult
|
||||
},
|
||||
initData: function () {
|
||||
this.getCatalog();
|
||||
},
|
||||
|
||||
getCatalog: function(parentId, callback) {
|
||||
let that = this;
|
||||
this.$axios({
|
||||
method:"get",
|
||||
url:`/api/platform/catalog`,
|
||||
params: {
|
||||
platformId: that.platformId,
|
||||
parentId: parentId
|
||||
}
|
||||
})
|
||||
.then((res)=> {
|
||||
if (res.data.code === 0) {
|
||||
if (typeof(callback) === 'function') {
|
||||
callback(res.data.data)
|
||||
}
|
||||
}
|
||||
})
|
||||
.catch(function (error) {
|
||||
console.log(error);
|
||||
});
|
||||
|
||||
},
|
||||
loadNode: function(node, resolve){
|
||||
if (node.level === 0) {
|
||||
this.$axios({
|
||||
method:"get",
|
||||
url:`/api/platform/info/` + this.platformId,
|
||||
})
|
||||
.then((res)=> {
|
||||
if (res.data.code === 0) {
|
||||
this.platformName = res.data.data.name;
|
||||
this.defaultCatalogId = res.data.data.catalogId;
|
||||
this.defaultCatalogIdSign = res.data.data.catalogId;
|
||||
this.chooseId = res.data.data.catalogId;
|
||||
resolve([
|
||||
{
|
||||
name: this.platformName,
|
||||
id: res.data.data.deviceGBId,
|
||||
type: 0
|
||||
}
|
||||
]);
|
||||
}
|
||||
})
|
||||
.catch(function (error) {
|
||||
console.log(error);
|
||||
});
|
||||
}
|
||||
if (node.level >= 1){
|
||||
this.getCatalog(node.data.id, resolve)
|
||||
}
|
||||
},
|
||||
nodeClickHandler: function (data, node, tree){
|
||||
this.chooseId = data.id;
|
||||
},
|
||||
close: function() {
|
||||
this.chooseId = null;
|
||||
this.showDialog = false;
|
||||
},
|
||||
submit: function() {
|
||||
console.log(this.chooseId)
|
||||
if (this.chooseId === null) {
|
||||
this.$message({
|
||||
showClose: true,
|
||||
message: '未选择任何节点,',
|
||||
type: 'warning'
|
||||
});
|
||||
return;
|
||||
}
|
||||
if (this.catalogIdResult)this.catalogIdResult(this.chooseId)
|
||||
this.showDialog = false;
|
||||
},
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
#catalogTree{
|
||||
display: inline-block;
|
||||
}
|
||||
</style>
|
||||
@@ -20,6 +20,11 @@
|
||||
<el-form-item label="节点名称" prop="name">
|
||||
<el-input v-model="group.name" clearable></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="行政区划" prop="name">
|
||||
<el-input v-model="group.civilCode" >
|
||||
<el-button slot="append" @click="buildCivilCode(group.civilCode)">生成</el-button>
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item>
|
||||
<div style="float: right;">
|
||||
@@ -32,15 +37,17 @@
|
||||
</div>
|
||||
</el-dialog>
|
||||
<channelCode ref="channelCode"></channelCode>
|
||||
<regionCode ref="regionCode"></regionCode>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import channelCode from "./channelCode.vue";
|
||||
import regionCode from "./regionCode.vue";
|
||||
|
||||
export default {
|
||||
name: "groupEdit",
|
||||
components: {channelCode},
|
||||
components: {channelCode, regionCode},
|
||||
computed: {},
|
||||
props: [],
|
||||
created() {},
|
||||
@@ -56,6 +63,7 @@ export default {
|
||||
name: "",
|
||||
parentDeviceId: "",
|
||||
businessGroup: "",
|
||||
civilCode: "",
|
||||
platformId: "",
|
||||
|
||||
},
|
||||
@@ -107,6 +115,13 @@ export default {
|
||||
this.group.deviceId = code;
|
||||
}, deviceId, 5 , lockContent);
|
||||
},
|
||||
buildCivilCode: function (deviceId){
|
||||
this.$refs.regionCode.openDialog(code=>{
|
||||
console.log("2222")
|
||||
console.log(code)
|
||||
this.group.civilCode = code;
|
||||
}, deviceId)
|
||||
},
|
||||
close: function () {
|
||||
this.showDialog = false;
|
||||
console.log(this.group)
|
||||
|
||||
@@ -60,13 +60,8 @@
|
||||
</el-input>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
<el-form ref="form" style=" display: grid; padding: 1rem 2rem 0 2rem;grid-template-columns: 1fr 1fr 1fr; gap: 1rem;">
|
||||
<el-form-item label="名称" prop="name" size="mini" >
|
||||
<el-input v-model="form.name" autocomplete="off"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="编号" prop="deviceId" size="mini" >
|
||||
<el-input v-model="form.deviceId" autocomplete="off"></el-input>
|
||||
</el-form-item>
|
||||
<el-form style="">
|
||||
|
||||
<el-form-item style="margin-top: 22px; margin-bottom: 0;">
|
||||
<div style="float:right;">
|
||||
<el-button type="primary" @click="handleOk">保存</el-button>
|
||||
@@ -86,11 +81,6 @@ export default {
|
||||
return {
|
||||
showVideoDialog: false,
|
||||
activeKey: '0',
|
||||
form: {
|
||||
name: "",
|
||||
deviceId: "",
|
||||
parentId: ""
|
||||
},
|
||||
allVal: [
|
||||
{
|
||||
id: [1, 2],
|
||||
@@ -129,11 +119,10 @@ export default {
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
openDialog: function (endCallBck, region, code, lockContent) {
|
||||
openDialog: function (endCallBck, code, lockContent) {
|
||||
this.showVideoDialog = true
|
||||
this.activeKey= '0';
|
||||
this.regionList = []
|
||||
this.form = region
|
||||
this.allVal = [
|
||||
{
|
||||
id: [1, 2],
|
||||
@@ -164,38 +153,23 @@ export default {
|
||||
lock: false,
|
||||
}
|
||||
]
|
||||
if (this.form.deviceId) {
|
||||
if (this.form.deviceId.length >= 2) {
|
||||
this.allVal[0].val = this.form.deviceId.substring(0, 2)
|
||||
if (code) {
|
||||
if (code.length >= 2) {
|
||||
this.allVal[0].val = code.substring(0, 2)
|
||||
this.activeKey = "0"
|
||||
}
|
||||
if (this.form.deviceId.length >= 4) {
|
||||
this.allVal[1].val = this.form.deviceId.substring(2, 4)
|
||||
if (code.length >= 4) {
|
||||
this.allVal[1].val = code.substring(2, 4)
|
||||
this.activeKey = "1"
|
||||
}
|
||||
if (this.form.deviceId.length >= 6) {
|
||||
this.allVal[2].val = this.form.deviceId.substring(4, 6)
|
||||
if (code.length >= 6) {
|
||||
this.allVal[2].val = code.substring(4, 6)
|
||||
this.activeKey = "2"
|
||||
}
|
||||
if (this.form.deviceId.length === 8) {
|
||||
this.allVal[3].val = this.form.deviceId.substring(6, 8)
|
||||
if (code.length === 8) {
|
||||
this.allVal[3].val = code.substring(6, 8)
|
||||
this.activeKey = "3"
|
||||
}
|
||||
}else {
|
||||
if (this.form.parentDeviceId) {
|
||||
if (this.form.parentDeviceId.length >= 2) {
|
||||
this.allVal[0].val = this.form.parentDeviceId.substring(0, 2)
|
||||
this.activeKey = "1"
|
||||
}
|
||||
if (this.form.parentDeviceId.length >= 4) {
|
||||
this.allVal[1].val = this.form.parentDeviceId.substring(2, 4)
|
||||
this.activeKey = "2"
|
||||
}
|
||||
if (this.form.parentDeviceId.length >= 6) {
|
||||
this.allVal[2].val = this.form.parentDeviceId.substring(4, 6)
|
||||
this.activeKey = "3"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
this.getRegionList()
|
||||
@@ -256,6 +230,18 @@ export default {
|
||||
});
|
||||
});
|
||||
},
|
||||
handleOk: function (){
|
||||
const code =
|
||||
this.allVal[0].val +
|
||||
this.allVal[1].val +
|
||||
this.allVal[2].val +
|
||||
this.allVal[3].val
|
||||
console.log(code)
|
||||
if (this.endCallBck) {
|
||||
this.endCallBck(code)
|
||||
}
|
||||
this.showVideoDialog = false
|
||||
},
|
||||
closeModel: function (){
|
||||
this.showVideoDialog = false
|
||||
},
|
||||
@@ -276,63 +262,7 @@ export default {
|
||||
this.allVal[2].val = ""
|
||||
this.allVal[3].val = ""
|
||||
}
|
||||
this.form.deviceId = code
|
||||
if (item) {
|
||||
this.form.name = item.name
|
||||
}
|
||||
|
||||
},
|
||||
handleOk: function() {
|
||||
if (this.form.id) {
|
||||
this.$axios({
|
||||
method: 'post',
|
||||
url: "/api/region/update",
|
||||
data: this.form
|
||||
}).then((res) => {
|
||||
if (res.data.code === 0) {
|
||||
if (typeof this.endCallBck == "function") {
|
||||
this.endCallBck(this.form)
|
||||
}
|
||||
this.showVideoDialog = false
|
||||
} else {
|
||||
this.$message.error({
|
||||
showClose: true,
|
||||
message: res.data.msg
|
||||
})
|
||||
}
|
||||
}).catch((error) => {
|
||||
this.$message.error({
|
||||
showClose: true,
|
||||
message: error
|
||||
});
|
||||
});
|
||||
}else {
|
||||
this.$axios({
|
||||
method: 'post',
|
||||
url: "/api/region/add",
|
||||
data: this.form
|
||||
}).then((res) => {
|
||||
if (res.data.code === 0) {
|
||||
if (typeof this.endCallBck == "function") {
|
||||
this.endCallBck(this.form)
|
||||
}
|
||||
this.showVideoDialog = false
|
||||
} else {
|
||||
this.$message.error({
|
||||
showClose: true,
|
||||
message: res.data.msg
|
||||
})
|
||||
}
|
||||
}).catch((error) => {
|
||||
this.$message.error({
|
||||
showClose: true,
|
||||
message: error
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
345
web_src/src/components/dialog/regionEdit.vue
Normal file
345
web_src/src/components/dialog/regionEdit.vue
Normal file
@@ -0,0 +1,345 @@
|
||||
<template>
|
||||
<el-dialog
|
||||
title="生成行政区划编码"
|
||||
width="65rem"
|
||||
top="2rem"
|
||||
center
|
||||
:close-on-click-modal="false"
|
||||
:visible.sync="showVideoDialog"
|
||||
:destroy-on-close="false"
|
||||
>
|
||||
<el-tabs v-model="activeKey" style="padding: 0 1rem; margin: auto 0" @tab-click="getRegionList">
|
||||
<el-tab-pane name="0" >
|
||||
<div slot="label" >
|
||||
<div class="show-code-item">{{ allVal[0].val }}</div>
|
||||
<div style="text-align: center">{{ allVal[0].meaning }}</div>
|
||||
</div>
|
||||
<el-radio v-for="item in regionList" v-model="allVal[0].val" :key="item.deviceId" :name="item.name" :label="item.deviceId" @input="deviceChange(item)" style="line-height: 2rem">
|
||||
{{ item.name }} - {{ item.deviceId }}
|
||||
</el-radio>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane name="1">
|
||||
<div slot="label">
|
||||
<div class="show-code-item">{{ allVal[1].val?allVal[1].val:"--" }}</div>
|
||||
<div style="text-align: center">{{ allVal[1].meaning }}</div>
|
||||
</div>
|
||||
<el-radio :key="-1" v-model="allVal[1].val" @input="deviceChange" label="" style="line-height: 2rem">
|
||||
不添加
|
||||
</el-radio>
|
||||
<el-radio v-for="item in regionList" v-model="allVal[1].val" @input="deviceChange(item)" :key="item.deviceId" :label="item.deviceId.substring(2)" style="line-height: 2rem">
|
||||
{{ item.name }} - {{ item.deviceId.substring(2) }}
|
||||
</el-radio>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane name="2">
|
||||
<div slot="label">
|
||||
<div class="show-code-item">{{ allVal[2].val?allVal[2].val:"--" }}</div>
|
||||
<div style="text-align: center">{{ allVal[2].meaning }}</div>
|
||||
</div>
|
||||
<el-radio :key="-1" label="" v-model="allVal[2].val" style="line-height: 2rem" @input="deviceChange">
|
||||
不添加
|
||||
</el-radio>
|
||||
<el-radio v-for="item in regionList" v-model="allVal[2].val" @input="deviceChange(item)" :key="item.deviceId" :label="item.deviceId.substring(4)" style="line-height: 2rem">
|
||||
{{ item.name }} - {{ item.deviceId.substring(4) }}
|
||||
</el-radio>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane name="3">
|
||||
请手动输入基层接入单位编码,两位数字
|
||||
<div slot="label">
|
||||
<div class="show-code-item">{{ allVal[3].val?allVal[3].val:"--" }}</div>
|
||||
<div style="text-align: center">{{ allVal[3].meaning }}</div>
|
||||
</div>
|
||||
<el-input
|
||||
type="text"
|
||||
placeholder="请输入内容"
|
||||
v-model="allVal[3].val"
|
||||
maxlength="2"
|
||||
:disabled="allVal[3].lock"
|
||||
show-word-limit
|
||||
@input="deviceChange"
|
||||
>
|
||||
</el-input>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
<el-form ref="form" style=" display: grid; padding: 1rem 2rem 0 2rem;grid-template-columns: 1fr 1fr 1fr; gap: 1rem;">
|
||||
<el-form-item label="名称" prop="name" size="mini" >
|
||||
<el-input v-model="form.name" autocomplete="off"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="编号" prop="deviceId" size="mini" >
|
||||
<el-input v-model="form.deviceId" autocomplete="off"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item style="margin-top: 22px; margin-bottom: 0;">
|
||||
<div style="float:right;">
|
||||
<el-button type="primary" @click="handleOk">保存</el-button>
|
||||
<el-button @click="closeModel">取消</el-button>
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
export default {
|
||||
props: {},
|
||||
computed: {},
|
||||
data() {
|
||||
return {
|
||||
showVideoDialog: false,
|
||||
activeKey: '0',
|
||||
form: {
|
||||
name: "",
|
||||
deviceId: "",
|
||||
parentId: ""
|
||||
},
|
||||
allVal: [
|
||||
{
|
||||
id: [1, 2],
|
||||
meaning: '省级编码',
|
||||
val: '11',
|
||||
type: '中心编码',
|
||||
lock: false,
|
||||
},
|
||||
{
|
||||
id: [3, 4],
|
||||
meaning: '市级编码',
|
||||
val: '',
|
||||
type: '中心编码',
|
||||
lock: false,
|
||||
},
|
||||
{
|
||||
id: [5, 6],
|
||||
meaning: '区级编码',
|
||||
val: '',
|
||||
type: '中心编码',
|
||||
lock: false,
|
||||
},
|
||||
{
|
||||
id: [7, 8],
|
||||
meaning: '基层接入单位编码',
|
||||
val: '',
|
||||
type: '中心编码',
|
||||
lock: false,
|
||||
}
|
||||
],
|
||||
regionList: [],
|
||||
deviceTypeList: [],
|
||||
industryCodeTypeList: [],
|
||||
networkIdentificationTypeList: [],
|
||||
endCallBck: null,
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
openDialog: function (endCallBck, region, code, lockContent) {
|
||||
this.showVideoDialog = true
|
||||
this.activeKey= '0';
|
||||
this.regionList = []
|
||||
this.form = region
|
||||
this.allVal = [
|
||||
{
|
||||
id: [1, 2],
|
||||
meaning: '省级编码',
|
||||
val: '11',
|
||||
type: '中心编码',
|
||||
lock: false,
|
||||
},
|
||||
{
|
||||
id: [3, 4],
|
||||
meaning: '市级编码',
|
||||
val: '',
|
||||
type: '中心编码',
|
||||
lock: false,
|
||||
},
|
||||
{
|
||||
id: [5, 6],
|
||||
meaning: '区级编码',
|
||||
val: '',
|
||||
type: '中心编码',
|
||||
lock: false,
|
||||
},
|
||||
{
|
||||
id: [7, 8],
|
||||
meaning: '基层接入单位编码',
|
||||
val: '',
|
||||
type: '中心编码',
|
||||
lock: false,
|
||||
}
|
||||
]
|
||||
if (this.form.deviceId) {
|
||||
if (this.form.deviceId.length >= 2) {
|
||||
this.allVal[0].val = this.form.deviceId.substring(0, 2)
|
||||
this.activeKey = "0"
|
||||
}
|
||||
if (this.form.deviceId.length >= 4) {
|
||||
this.allVal[1].val = this.form.deviceId.substring(2, 4)
|
||||
this.activeKey = "1"
|
||||
}
|
||||
if (this.form.deviceId.length >= 6) {
|
||||
this.allVal[2].val = this.form.deviceId.substring(4, 6)
|
||||
this.activeKey = "2"
|
||||
}
|
||||
if (this.form.deviceId.length === 8) {
|
||||
this.allVal[3].val = this.form.deviceId.substring(6, 8)
|
||||
this.activeKey = "3"
|
||||
}
|
||||
}else {
|
||||
if (this.form.parentDeviceId) {
|
||||
if (this.form.parentDeviceId.length >= 2) {
|
||||
this.allVal[0].val = this.form.parentDeviceId.substring(0, 2)
|
||||
this.activeKey = "1"
|
||||
}
|
||||
if (this.form.parentDeviceId.length >= 4) {
|
||||
this.allVal[1].val = this.form.parentDeviceId.substring(2, 4)
|
||||
this.activeKey = "2"
|
||||
}
|
||||
if (this.form.parentDeviceId.length >= 6) {
|
||||
this.allVal[2].val = this.form.parentDeviceId.substring(4, 6)
|
||||
this.activeKey = "3"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
this.getRegionList()
|
||||
this.endCallBck = endCallBck;
|
||||
},
|
||||
getRegionList: function() {
|
||||
console.log("getRegionList")
|
||||
if (this.activeKey === '0' ) {
|
||||
this.queryChildList();
|
||||
}else if (this.activeKey === '1' || this.activeKey === '2') {
|
||||
let parent = ''
|
||||
if (this.activeKey === '1') {
|
||||
parent = this.allVal[0].val
|
||||
}
|
||||
if (this.activeKey === '2') {
|
||||
if (this.allVal[1].val === ""){
|
||||
parent = ""
|
||||
} else {
|
||||
parent = this.allVal[0].val + this.allVal[1].val
|
||||
}
|
||||
}
|
||||
if (this.activeKey !== '0' && parent === '') {
|
||||
this.$message.error({
|
||||
showClose: true,
|
||||
message: "请先选择上级行政区划"
|
||||
})
|
||||
}
|
||||
if (parent !== "") {
|
||||
this.queryChildList(parent);
|
||||
}else {
|
||||
this.regionList = []
|
||||
}
|
||||
|
||||
}
|
||||
},
|
||||
queryChildList: function(parent){
|
||||
console.log("queryChildList")
|
||||
this.regionList = []
|
||||
this.$axios({
|
||||
method: 'get',
|
||||
url: "/api/region/base/child/list",
|
||||
params: {
|
||||
parent: parent,
|
||||
}
|
||||
}).then((res) => {
|
||||
if (res.data.code === 0) {
|
||||
this.regionList = res.data.data
|
||||
} else {
|
||||
this.$message.error({
|
||||
showClose: true,
|
||||
message: res.data.msg
|
||||
})
|
||||
}
|
||||
}).catch((error) => {
|
||||
this.$message.error({
|
||||
showClose: true,
|
||||
message: error
|
||||
});
|
||||
});
|
||||
},
|
||||
closeModel: function (){
|
||||
this.showVideoDialog = false
|
||||
},
|
||||
deviceChange: function (item){
|
||||
console.log(item)
|
||||
let code = this.allVal[0].val
|
||||
if (this.allVal[1].val) {
|
||||
code += this.allVal[1].val
|
||||
if (this.allVal[2].val) {
|
||||
code += this.allVal[2].val
|
||||
if (this.allVal[3].val) {
|
||||
code += this.allVal[3].val
|
||||
}
|
||||
}else {
|
||||
this.allVal[3].val = ""
|
||||
}
|
||||
}else {
|
||||
this.allVal[2].val = ""
|
||||
this.allVal[3].val = ""
|
||||
}
|
||||
this.form.deviceId = code
|
||||
if (item) {
|
||||
this.form.name = item.name
|
||||
}
|
||||
|
||||
},
|
||||
handleOk: function() {
|
||||
if (this.form.id) {
|
||||
this.$axios({
|
||||
method: 'post',
|
||||
url: "/api/region/update",
|
||||
data: this.form
|
||||
}).then((res) => {
|
||||
if (res.data.code === 0) {
|
||||
if (typeof this.endCallBck == "function") {
|
||||
this.endCallBck(this.form)
|
||||
}
|
||||
this.showVideoDialog = false
|
||||
} else {
|
||||
this.$message.error({
|
||||
showClose: true,
|
||||
message: res.data.msg
|
||||
})
|
||||
}
|
||||
}).catch((error) => {
|
||||
this.$message.error({
|
||||
showClose: true,
|
||||
message: error
|
||||
});
|
||||
});
|
||||
}else {
|
||||
this.$axios({
|
||||
method: 'post',
|
||||
url: "/api/region/add",
|
||||
data: this.form
|
||||
}).then((res) => {
|
||||
if (res.data.code === 0) {
|
||||
if (typeof this.endCallBck == "function") {
|
||||
this.endCallBck(this.form)
|
||||
}
|
||||
this.showVideoDialog = false
|
||||
} else {
|
||||
this.$message.error({
|
||||
showClose: true,
|
||||
message: res.data.msg
|
||||
})
|
||||
}
|
||||
}).catch((error) => {
|
||||
this.$message.error({
|
||||
showClose: true,
|
||||
message: error
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.show-code-item {
|
||||
text-align: center;
|
||||
font-size: 3rem;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user