|
@@ -2,240 +2,236 @@
|
|
|
revit空间管理
|
|
|
-->
|
|
|
<template>
|
|
|
- <div id="graphy">
|
|
|
- <!-- <div class="graphy-left">
|
|
|
- <graphy-tree v-if="show" :param="param" @change="getPoint"></graphy-tree>
|
|
|
- </div> -->
|
|
|
- <div class='condition'>
|
|
|
- <p>
|
|
|
- <span>建筑楼层</span>
|
|
|
- <el-cascader
|
|
|
- placeholder='请选择'
|
|
|
- :options="options"
|
|
|
- @active-item-change="handleItemChange"
|
|
|
- @change="changeFloor"
|
|
|
- filterable
|
|
|
- ></el-cascader>
|
|
|
- </p>
|
|
|
- </div>
|
|
|
- <div class="graphy-view">
|
|
|
- <div class="graphy-main">
|
|
|
- <graphy-canvas v-if="show" :param="param" @getDetails="getDetails" @resetPoint="resetPoint" ref="canvas"></graphy-canvas>
|
|
|
+ <div id="graphy">
|
|
|
+ <!-- <div class="graphy-left">
|
|
|
+ <graphy-tree v-if="show" :param="param" @change="getPoint"></graphy-tree>
|
|
|
+ </div> -->
|
|
|
+ <div class='condition'>
|
|
|
+ <p>
|
|
|
+ <span>建筑楼层</span>
|
|
|
+ <el-cascader placeholder='请选择' :options="options" @active-item-change="handleItemChange" @change="changeFloor" filterable></el-cascader>
|
|
|
+ </p>
|
|
|
</div>
|
|
|
- <div class="graphy-right">
|
|
|
- <graphy-tabs v-show="show"
|
|
|
- ref="tabs"
|
|
|
- :pointParam="pointParam"
|
|
|
- @setFalg="setFalg"
|
|
|
- @getLocation="getLocation"
|
|
|
- @getPointList="sendPointList"
|
|
|
- ></graphy-tabs>
|
|
|
+ <div class="graphy-view">
|
|
|
+ <div class="graphy-main">
|
|
|
+ <graphy-canvas v-if="show" :param="param" @getDetails="getDetails" @resetPoint="resetPoint" ref="canvas"></graphy-canvas>
|
|
|
+ </div>
|
|
|
+ <div class="graphy-right">
|
|
|
+ <graphy-tabs v-show="show" ref="tabs" :pointParam="pointParam" @setFalg="setFalg" @getLocation="getLocation" @getPointList="sendPointList"></graphy-tabs>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- </div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-//接口
|
|
|
-import graphyTree from "./graphyTree";
|
|
|
-import graphyTabs from "./graphyTabs";
|
|
|
-import graphyCanvas from "./graphyCanvas";
|
|
|
-import {mapGetters, mapActions} from 'vuex';
|
|
|
-import {getPT,getBuildSelect,getFloor} from "@/api/scan/request"; //获取点位坐标
|
|
|
-import Handsontable from "handsontable-pro"
|
|
|
-import 'handsontable-pro/dist/handsontable.full.css'
|
|
|
-import zhCN from 'handsontable-pro/languages/zh-CN';
|
|
|
-export default {
|
|
|
- components: {
|
|
|
- graphyTree,
|
|
|
- graphyTabs,
|
|
|
- graphyCanvas
|
|
|
- },
|
|
|
- data() {
|
|
|
- return {
|
|
|
- param: {
|
|
|
- ProjId: this.projectId, //项目id
|
|
|
- UserId: this.userId //用户id
|
|
|
- },
|
|
|
- pointParam: {
|
|
|
- //point请求参数
|
|
|
- ProjId: this.projectId, //项目id
|
|
|
- UserId: this.userId, //用户id
|
|
|
- fllorName: ""
|
|
|
- },
|
|
|
- options: [],
|
|
|
- map: null,
|
|
|
- pointId: null,
|
|
|
- show:false,
|
|
|
- buildVlaue: []
|
|
|
- };
|
|
|
- },
|
|
|
- mounted() {
|
|
|
- this.changeValue()
|
|
|
- this.getList()
|
|
|
- },
|
|
|
- computed: {
|
|
|
- ...mapGetters("peojMess", [
|
|
|
- "projectId",
|
|
|
- "userId",
|
|
|
- "secret"
|
|
|
- ])
|
|
|
- },
|
|
|
- methods: {
|
|
|
- //修改楼层
|
|
|
- changeFloor(val){
|
|
|
- console.log(val)
|
|
|
- let floorMap = "",name = ""
|
|
|
- this.options.map(item => {
|
|
|
- if(!!item.children && item.children.length){
|
|
|
- if(item.value == val[0]){
|
|
|
- item.children.map(child => {
|
|
|
- if(child.value == val[1]){
|
|
|
- console.log(child,'child')
|
|
|
- floorMap = child.map
|
|
|
- name = child.label
|
|
|
- }
|
|
|
- })
|
|
|
- }
|
|
|
- }
|
|
|
- })
|
|
|
- let obj = {
|
|
|
- code: val[1],
|
|
|
- map: floorMap,
|
|
|
- name: name
|
|
|
- }
|
|
|
- this.getPoint(obj)
|
|
|
- console.log(floorMap)
|
|
|
- },
|
|
|
- //获取建筑列表
|
|
|
- getList(){
|
|
|
- getBuildSelect(this.param).then(res => {
|
|
|
- console.log(res)
|
|
|
- this.options = res.data.BuildList.map(item => {
|
|
|
- return {
|
|
|
- value: item.BuildId,
|
|
|
- label: item.BuildLocalName,
|
|
|
- children: []
|
|
|
- }
|
|
|
- })
|
|
|
- })
|
|
|
- },
|
|
|
- //点击事件
|
|
|
- handleItemChange(val){
|
|
|
- if(val.length == 1){
|
|
|
- let obj = Object.assign({BuildId: val[0]},this.param)
|
|
|
- getFloor(obj).then(res => {
|
|
|
- console.log(res)
|
|
|
- this.options = this.options.map(item => {
|
|
|
- if(item.value == val[0]){
|
|
|
- item.children = res.data.FloorList.map(child => {
|
|
|
- return {
|
|
|
- value: child.FloorId,
|
|
|
- label: child.FloorLocalName + (child.FloorMap ? '' : '(需初始化数据)'),
|
|
|
- map: child.FloorMap
|
|
|
+ //接口
|
|
|
+ import graphyTree from "./graphyTree";
|
|
|
+ import graphyTabs from "./graphyTabs";
|
|
|
+ import graphyCanvas from "./graphyCanvas";
|
|
|
+ import {
|
|
|
+ mapGetters,
|
|
|
+ mapActions
|
|
|
+ } from 'vuex';
|
|
|
+ import {
|
|
|
+ getPT,
|
|
|
+ getBuildSelect,
|
|
|
+ getFloor
|
|
|
+ } from "@/api/scan/request"; //获取点位坐标
|
|
|
+ import Handsontable from "handsontable-pro"
|
|
|
+ import 'handsontable-pro/dist/handsontable.full.css'
|
|
|
+ import zhCN from 'handsontable-pro/languages/zh-CN';
|
|
|
+ export default {
|
|
|
+ components: {
|
|
|
+ graphyTree,
|
|
|
+ graphyTabs,
|
|
|
+ graphyCanvas
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ param: {
|
|
|
+ ProjId: this.projectId, //项目id
|
|
|
+ UserId: this.userId //用户id
|
|
|
+ },
|
|
|
+ pointParam: {
|
|
|
+ //point请求参数
|
|
|
+ ProjId: this.projectId, //项目id
|
|
|
+ UserId: this.userId, //用户id
|
|
|
+ fllorName: ""
|
|
|
+ },
|
|
|
+ options: [],
|
|
|
+ map: null,
|
|
|
+ pointId: null,
|
|
|
+ show: false,
|
|
|
+ buildVlaue: []
|
|
|
+ };
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ this.changeValue()
|
|
|
+ this.getList()
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ ...mapGetters("peojMess", [
|
|
|
+ "projectId",
|
|
|
+ "userId",
|
|
|
+ "secret"
|
|
|
+ ])
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ //修改楼层
|
|
|
+ changeFloor(val) {
|
|
|
+ console.log(val)
|
|
|
+ let floorMap = "",
|
|
|
+ name = ""
|
|
|
+ this.options.map(item => {
|
|
|
+ if (!!item.children && item.children.length) {
|
|
|
+ if (item.value == val[0]) {
|
|
|
+ item.children.map(child => {
|
|
|
+ if (child.value == val[1]) {
|
|
|
+ console.log(child, 'child')
|
|
|
+ floorMap = child.map
|
|
|
+ name = child.label
|
|
|
}
|
|
|
})
|
|
|
}
|
|
|
- return item
|
|
|
+ }
|
|
|
+ })
|
|
|
+ let obj = {
|
|
|
+ code: val[1],
|
|
|
+ map: floorMap,
|
|
|
+ name: name
|
|
|
+ }
|
|
|
+ this.getPoint(obj)
|
|
|
+ console.log(floorMap)
|
|
|
+ },
|
|
|
+ //获取建筑列表
|
|
|
+ getList() {
|
|
|
+ getBuildSelect(this.param).then(res => {
|
|
|
+ console.log(res)
|
|
|
+ this.options = res.data.BuildList.map(item => {
|
|
|
+ return {
|
|
|
+ value: item.BuildId,
|
|
|
+ label: item.BuildLocalName,
|
|
|
+ children: []
|
|
|
+ }
|
|
|
})
|
|
|
- console.log(this.options)
|
|
|
})
|
|
|
- }else if(val.length == 2){
|
|
|
-
|
|
|
- }
|
|
|
- },
|
|
|
- changeValue(){
|
|
|
- this.$set(this.param,'ProjId',this.projectId)
|
|
|
- this.$set(this.param,'UserId',this.userId)
|
|
|
- this.$set(this.pointParam,'ProjId',this.projectId)
|
|
|
- this.$set(this.pointParam,'UserId',this.userId)
|
|
|
- this.show = true
|
|
|
- },
|
|
|
-
|
|
|
- //渲染
|
|
|
- getPoint(data) {
|
|
|
- this.pointParam.FloorId = data.code;
|
|
|
- this.pointParam.fllorName = data.name;
|
|
|
- this.$refs.tabs.reset(this.pointParam, data.map);
|
|
|
- if (this.map != data.map) {
|
|
|
- this.map = data.map;
|
|
|
- this.$refs.canvas.getData(data);
|
|
|
- } else {
|
|
|
- return;
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
- //获取到点位标签坐标
|
|
|
- sendPointList(list) {
|
|
|
- if (list && list.length && list[0].Id == this.pointId) {
|
|
|
- this.$refs.canvas.doPoint(list);
|
|
|
- } else {
|
|
|
- if (list.length) {
|
|
|
- this.pointId = list[0].Id;
|
|
|
- this.$refs.canvas.doPoint(list);
|
|
|
- } else {
|
|
|
- this.$refs.canvas.doPoint([]);
|
|
|
+ },
|
|
|
+ //点击事件
|
|
|
+ handleItemChange(val) {
|
|
|
+ if (val.length == 1) {
|
|
|
+ let obj = Object.assign({
|
|
|
+ BuildId: val[0]
|
|
|
+ }, this.param)
|
|
|
+ getFloor(obj).then(res => {
|
|
|
+ console.log(res)
|
|
|
+ this.options = this.options.map(item => {
|
|
|
+ if (item.value == val[0]) {
|
|
|
+ item.children = res.data.FloorList.map(child => {
|
|
|
+ return {
|
|
|
+ value: child.FloorId,
|
|
|
+ label: child.FloorLocalName + (child.FloorMap ? '' : '(需初始化数据)'),
|
|
|
+ map: child.FloorMap
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ return item
|
|
|
+ })
|
|
|
+ console.log(this.options)
|
|
|
+ })
|
|
|
+ } else if (val.length == 2) {
|
|
|
+ }
|
|
|
+ },
|
|
|
+ changeValue() {
|
|
|
+ this.$set(this.param, 'ProjId', this.projectId)
|
|
|
+ this.$set(this.param, 'UserId', this.userId)
|
|
|
+ this.$set(this.pointParam, 'ProjId', this.projectId)
|
|
|
+ this.$set(this.pointParam, 'UserId', this.userId)
|
|
|
+ this.show = true
|
|
|
+ },
|
|
|
+ //渲染
|
|
|
+ getPoint(data) {
|
|
|
+ this.pointParam.FloorId = data.code;
|
|
|
+ this.pointParam.fllorName = data.name;
|
|
|
+ this.$refs.tabs.reset(this.pointParam, data.map);
|
|
|
+ if (this.map != data.map) {
|
|
|
+ this.map = data.map;
|
|
|
+ this.$refs.canvas.getData(data);
|
|
|
+ } else {
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //获取到点位标签坐标
|
|
|
+ sendPointList(list) {
|
|
|
+ if (list && list.length && list[0].Id == this.pointId) {
|
|
|
+ this.$refs.canvas.doPoint(list);
|
|
|
+ } else {
|
|
|
+ if (list.length) {
|
|
|
+ this.pointId = list[0].Id;
|
|
|
+ this.$refs.canvas.doPoint(list);
|
|
|
+ } else {
|
|
|
+ this.$refs.canvas.doPoint([]);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //插旗setFalg
|
|
|
+ setFalg(item) {
|
|
|
+ this.$refs.canvas.addPoint(item);
|
|
|
+ },
|
|
|
+ //定位getLocation
|
|
|
+ getLocation(item) {
|
|
|
+ this.$refs.canvas.locationGraphy({
|
|
|
+ X: item.X,
|
|
|
+ Y: item.Y * -1
|
|
|
+ });
|
|
|
+ },
|
|
|
+ //重新获取点位信息resetPoint
|
|
|
+ resetPoint() {
|
|
|
+ this.$refs.tabs.reset(this.pointParam, true);
|
|
|
+ },
|
|
|
+ //查看详情
|
|
|
+ getDetails(item) {
|
|
|
+ this.$refs.tabs.getDetails(item);
|
|
|
+ }
|
|
|
}
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
- //插旗setFalg
|
|
|
- setFalg(item) {
|
|
|
- this.$refs.canvas.addPoint(item);
|
|
|
- },
|
|
|
-
|
|
|
- //定位getLocation
|
|
|
- getLocation(item) {
|
|
|
- this.$refs.canvas.locationGraphy({ X: item.X, Y: item.Y * -1 });
|
|
|
- },
|
|
|
-
|
|
|
- //重新获取点位信息resetPoint
|
|
|
- resetPoint() {
|
|
|
- this.$refs.tabs.reset(this.pointParam, true);
|
|
|
- },
|
|
|
-
|
|
|
- //查看详情
|
|
|
- getDetails(item) {
|
|
|
- this.$refs.tabs.getDetails(item);
|
|
|
- }
|
|
|
- }
|
|
|
-};
|
|
|
+ };
|
|
|
</script>
|
|
|
|
|
|
<style lang="less" scoped>
|
|
|
-#graphy {
|
|
|
- // position: relative;
|
|
|
- display: flex;
|
|
|
- .graphy-view{
|
|
|
+ #graphy {
|
|
|
+ // position: relative;
|
|
|
display: flex;
|
|
|
- .graphy-main {
|
|
|
- flex: 1;
|
|
|
- // position: absolute;
|
|
|
- // left: 200px;
|
|
|
- // top: 0;
|
|
|
- // right: 400px;
|
|
|
- // bottom: 0;
|
|
|
- // overflow: auto;
|
|
|
+ flex-direction: column;
|
|
|
+ background-color: #fff;
|
|
|
+ .graphy-view {
|
|
|
+ display: flex;
|
|
|
+ flex: 1;
|
|
|
+ .graphy-main {
|
|
|
+ flex: 1;
|
|
|
+ // position: absolute;
|
|
|
+ // left: 200px;
|
|
|
+ // top: 0;
|
|
|
+ // right: 400px;
|
|
|
+ // bottom: 0;
|
|
|
+ // overflow: auto;
|
|
|
+ }
|
|
|
+ .graphy-right {
|
|
|
+ // position: absolute;
|
|
|
+ // right: 0;
|
|
|
+ width: 400px; // top: 0;
|
|
|
+ // bottom: 0;
|
|
|
+ // border-left: 1px solid #ccc;
|
|
|
+ // overflow: hidden;
|
|
|
+ }
|
|
|
}
|
|
|
- .graphy-right {
|
|
|
+ .graphy-left {
|
|
|
+ // width: 200px;
|
|
|
+ // height: 100%;
|
|
|
// position: absolute;
|
|
|
- // right: 0;
|
|
|
- width: 400px;
|
|
|
+ // overflow-y: auto;
|
|
|
+ // left: 0;
|
|
|
// top: 0;
|
|
|
// bottom: 0;
|
|
|
- // border-left: 1px solid #ccc;
|
|
|
- // overflow: hidden;
|
|
|
+ // border-right: 1px solid #ccc;
|
|
|
}
|
|
|
}
|
|
|
- .graphy-left {
|
|
|
- // width: 200px;
|
|
|
- // height: 100%;
|
|
|
- // position: absolute;
|
|
|
- // overflow-y: auto;
|
|
|
- // left: 0;
|
|
|
- // top: 0;
|
|
|
- // bottom: 0;
|
|
|
- // border-right: 1px solid #ccc;
|
|
|
- }
|
|
|
-}
|
|
|
</style>
|