| | |
| | | :show-checkbox="TreeDataPool.multiple" |
| | | :readonly="TreeDataPool.readonly" |
| | | :gb28181="gb28181" |
| | | :setting="setting" |
| | | @onCreated="handleCreated" |
| | | @onClick="itemClick" |
| | | @onCheck="itemCheck" |
| | |
| | | @onImport="importCameras" |
| | | @onExpand="itemExpand" |
| | | @onCollapse="itemCollapse" |
| | | @onShowPic="showCameraPic" |
| | | /> |
| | | <div class="dialog-box-bg" v-show="showDialog" @click="hideDialogBox"></div> |
| | | <div |
| | |
| | | <el-card :body-style="{ padding: '10px' }"> |
| | | <el-form :model="dialogForm" size="mini" :rules="rules" ref="dialogForm" label-width="70px"> |
| | | <el-form-item label="名称:" prop="name"> |
| | | <el-input v-model="dialogForm.text"></el-input> |
| | | <el-input v-model="dialogForm.text" oninput="if(value.length>10)value=value.slice(0,10)"></el-input> |
| | | </el-form-item> |
| | | <div class="text-center pb-2"> |
| | | <el-button size="mini" type="primary" @click="submitForm">保存</el-button> |
| | |
| | | </template> |
| | | |
| | | <script> |
| | | // import VJstree from "./jsTree"; |
| | | import ZTree from "./zTree/ztree" |
| | | |
| | | export default { |
| | |
| | | height: { |
| | | type: Number, |
| | | default: 0 |
| | | } |
| | | }, |
| | | setting: { |
| | | type: Object, |
| | | require: false, |
| | | default: function () { |
| | | return {}; |
| | | }, |
| | | }, |
| | | }, |
| | | data() { |
| | | return { |
| | | hoverNodeId: "", |
| | | showDialog: false, |
| | | clientX: 0, |
| | | clientY: 0, |
| | |
| | | }; |
| | | }, |
| | | created() { |
| | | // console.log(this.height, '树高度') |
| | | this.TreeDataPool.zTree = true; |
| | | |
| | | this.TreeDataPool.activeVideoIndex = sessionStorage.activeIndexVideo |
| | | ? Number(sessionStorage.activeIndexVideo) |
| | | : this.TreeDataPool.activeVideoIndex; |
| | |
| | | handleCreated: function (ztreeObj) { |
| | | let _this = this; |
| | | this.ztreeObj = ztreeObj; |
| | | // console.log("handleCreated") |
| | | ztreeObj.expandAll(true) |
| | | // onCreated 中操作ztreeObj对象展开第一个节点 |
| | | // ztreeObj.expandNode(ztreeObj.getNodes()[0], true); |
| | | |
| | |
| | | //摄像机信息更新信息后,如果节点位置有变tId就不准了,this.TreeDataPool.selectedNode此时还是旧的信息 |
| | | let ztreeNodes = ztreeObj.getNodes(); |
| | | //var curNodeTid = ''; |
| | | console.log(ztreeNodes) |
| | | _this.findTidByIdFromArr(ztreeNodes); |
| | | console.log('curNodeTid', _this.curNodeTid) |
| | | this.TreeDataPool.selectedNode.tId = _this.curNodeTid; |
| | | let node = this.ztreeObj.getNodeByTId(this.TreeDataPool.selectedNode.tId) |
| | | console.log('selecBode', this.TreeDataPool.selectedNode) |
| | | console.log('selectedNode.tId', this.TreeDataPool.selectedNode.tId) |
| | | |
| | | // 多选时, 选中单选单击的节点 |
| | | if (this.TreeDataPool.multiple) { |
| | | this.ztreeObj.checkAllNodes(false); |
| | |
| | | if (item.type !== "4" || this.app !== "Camera") { |
| | | return; |
| | | } |
| | | // console.log('activeForceChoose', this.TreeDataPool.activeForceChoose) |
| | | this.TreeDataPool.activeVideoId = item.id; |
| | | let videoArr = this.TreeDataPool.videoArr; |
| | | let nullVideoIndex = ""; |
| | |
| | | this.showDialog = true; |
| | | }, |
| | | itemClick(evt, treeId, treeNode) { |
| | | console.log(evt, treeId) |
| | | |
| | | this.TreeDataPool.selectedNode = treeNode; |
| | | this.TreeDataPool.treeType = this.treeName; |
| | |
| | | itemCheck(evt, treeId, treeNode) { |
| | | this.TreeDataPool.selectedNode = treeNode; |
| | | this.TreeDataPool.treeType = this.treeName; |
| | | |
| | | debugger |
| | | // 多选 |
| | | // this.ztreeObj.checkNode(treeNode, true, false, false); |
| | | let checkedNodes = this.ztreeObj.getCheckedNodes(true); |
| | | this.TreeDataPool.updateZTreeCheckNodes(checkedNodes); |
| | | |
| | | // 实时统计选中个数 |
| | | this.TreeDataPool.countCheckedNodes(checkedNodes); |
| | | |
| | | // 保存一份数据 |
| | | this.TreeDataPool.activeTreeData = this.ztreeObj.getNodes() |
| | | |
| | | }, |
| | | //展开 |
| | | itemExpand(e, id, node) { |
| | |
| | | dropNode(node, item, draggedItem, e) { |
| | | // console.log('dropNode', node, item, draggedItem); |
| | | this.TreeDataPool.dropNode(draggedItem.id, item.id) |
| | | }, |
| | | showCameraPic(nodeId) { |
| | | this.TreeDataPool.showBaseImage(nodeId) |
| | | } |
| | | } |
| | | }; |