graphy.vue 48 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343134413451346134713481349135013511352135313541355135613571358135913601361136213631364136513661367136813691370137113721373137413751376137713781379138013811382138313841385138613871388138913901391139213931394139513961397139813991400140114021403140414051406140714081409141014111412141314141415141614171418141914201421142214231424142514261427142814291430143114321433143414351436143714381439144014411442144314441445144614471448144914501451145214531454145514561457145814591460
  1. <template>
  2. <div id="graphy" ref="graphy" v-loading="canvasLoading">
  3. <div v-show="!FloorMap">
  4. <!-- 平面图其他分区 -->
  5. <!-- <div style="margin-right:10px;width: 100%;margin-bottom: 10px" v-if="showOtherFlag">
  6. <el-button type="primary" @click="addZoneBtn">添加分区</el-button>
  7. <el-select v-model="OtherValue" placeholder="请选择分区类型" @change="changeOtherZone">
  8. <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
  9. </el-option>
  10. </el-select>
  11. </div> -->
  12. <div class="center" style="height: 400px;padding-top:182px;box-sizing:border-box;">
  13. <i class="icon-wushuju iconfont"></i>
  14. 暂无数据
  15. </div>
  16. </div>
  17. <div class="canvas-box" v-show="FloorMap">
  18. <canvas id="floorCanvas" :width="canvasWidth" :height="canvasHeight" ref="canvas" tabindex="0"></canvas>
  19. <!-- 初始两个按钮 -->
  20. <el-row class="buttons-box">
  21. <!-- 平面图其他分区 -->
  22. <!-- <div style="margin-right:10px;width: 100%;margin-bottom: 10px" v-if="showOtherFlag">
  23. <el-button type="primary" @click="addZoneBtn">添加分区</el-button>
  24. <el-select v-model="OtherValue" placeholder="请选择分区类型" @change="changeOtherZone">
  25. <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
  26. </el-option>
  27. </el-select>
  28. </div> -->
  29. <div>
  30. <el-autocomplete popper-class="my-autocomplete" v-model="search" :fetch-suggestions="querySearch" placeholder="输入平面图中已有的业务空间名称进行查找"
  31. width="180px" @select="handleSelect">
  32. <i class="el-icon-search el-input__icon" slot="suffix" @click="handleSelect"></i>
  33. <template slot-scope="{ item }">
  34. <div class="name" style="position: relative;padding-right:40px;overflow: hidden;text-overflow:ellipsis;white-space: nowrap;"
  35. :title="item.data.RoomLocalName">
  36. {{ item.data.RoomLocalName }}
  37. <span class="addr" style="position: absolute;right:0;color:#409EFF;">定位</span>
  38. </div>
  39. </template>
  40. </el-autocomplete>
  41. </div>
  42. <div class="button-group">
  43. <!-- 默认操作模式 -->
  44. <div v-show="type==1">
  45. <el-dropdown split-button type="primary" @click="editGraphy" @command="handleCommand">
  46. 创建业务空间
  47. <el-dropdown-menu slot="dropdown">
  48. <el-dropdown-item command="groupCreateBSpace">批量创建业务空间</el-dropdown-item>
  49. </el-dropdown-menu>
  50. </el-dropdown>
  51. <!-- 点击已经关联的业务空间 -->
  52. <el-button type="primary" plain @click="refactorBSP" :disabled="zoneDisable" style="margin-left:10px;">重新划分业务空间</el-button>
  53. <el-button type="primary" @click="editeSpaceDetail" :disabled="zoneDisable">查看空间详情</el-button>
  54. <el-button type="primary" plain @click="confirmZoneSpace" :disabled="zoneDisable||(!zoneDisable&&!curZoneItem.isInfected)">确认业务空间
  55. </el-button>
  56. <el-button plain @click="cancelGraphy" v-show="!zoneDisable">取 消</el-button>
  57. </div>
  58. <!-- 点击已经关联的业务空间 -->
  59. <!-- <div v-show="type==2">
  60. </div> -->
  61. <!-- 点击未关联的业务空间 -->
  62. <div v-show="type==3">
  63. <el-button plain @click="createNewZone">创建单个全新的业务空间</el-button>
  64. <el-button plain @click="lookUnrelatBSpace(true)">从未关联平面图的业务空间中选择</el-button>
  65. <el-button plain @click="cancelGraphy">取 消</el-button>
  66. </div>
  67. <!-- 重新划分业务空间 -->
  68. <div v-show="type==4">
  69. <el-button plain @click="cancelGraphy">取 消</el-button>
  70. <el-button type="primary" @click="saveRefactorBSP">保存</el-button>
  71. <el-button type="primary" v-show='curZoneItem.isInfected' @click="confirmAndSave">保存并确认业务空间</el-button>
  72. </div>
  73. <!-- 批量创建所选业务空间 -->
  74. <div v-if="type==5">
  75. <el-button type="primary" @click.prevent.once="groupCreateZone">批量创建所选业务空间</el-button>
  76. <el-button plain @click="cancelGraphy">取 消</el-button>
  77. </div>
  78. <div style="position: absolute;right: 10px;">
  79. <el-button type="text" @click="lookUnrelatBSpace(false)">未关联平面图的业务空间 {{num}} 条</el-button>
  80. </div>
  81. </div>
  82. </el-row>
  83. <!-- 底部操作按钮 -->
  84. <el-row class="canvas-actions-box">
  85. <canvasFun @fit="fit" @savePng="savePng" @saveSvg="saveSvg" @divide="divide" @clearDivide="clearDivide" @undo="undo" @redo="redo"
  86. @changeAbsorb="changeAbsorb" @scale="scale" @groupSelect="groupSelect" :config="config" ref="canvasFun" @saveJson="saveJson"></canvasFun>
  87. </el-row>
  88. </div>
  89. <!-- -->
  90. <!-- 未关联元空间的业务空间 -->
  91. <unRelateBSP ref="unRelateBSP" :isAction="isAction" @createFromUnrelated="createFromUnrelated" :code="tab.code"></unRelateBSP>
  92. <!-- 创建新的业务空间 -->
  93. <createBSP ref="createBSP" @createRoom="createRoom"></createBSP>
  94. <!-- 批量创建选择弹窗 -->
  95. <el-dialog title="提示" :visible.sync="groupCreateDialogVis" width="30%" :close-on-click-modal="false">
  96. <div id="autoRelate">
  97. <p>批量创建面积大于此值的默认空间为业务空间:</p>
  98. <div style="padding:10px 20px;margin:0 0 10px 0;">
  99. <el-slider v-model="areaValue" :marks="areaMarks" :step="10" :format-tooltip='val=>val/100'> </el-slider>
  100. </div>
  101. <p>请选择批量创建方式:</p>
  102. <p>
  103. <el-radio v-model="groupCreateType" :label="1">批量将所有的空白空间创建业务空间</el-radio>
  104. </p>
  105. <p>
  106. <el-radio v-model="groupCreateType" :label="2">批量选择空白空间创建业务空间</el-radio>
  107. </p>
  108. </div>
  109. <span slot="footer" class="dialog-footer">
  110. <el-button size="small" @click="groupCreateDialogVis=false">取消</el-button>
  111. <el-button size="small" type="primary" @click="confirm">确认</el-button>
  112. </span>
  113. </el-dialog>
  114. <!-- <dialogZone ref="zone" @createSuccess="getOtherType" /> -->
  115. </div>
  116. </template>
  117. <script>
  118. import canvasFun from "./canvasFun"
  119. import { mapGetters } from "vuex";
  120. import { SColor, SPoint } from "@saga-web/draw/lib";
  121. import { DivideFloorScene, FloorView, Opt, SpaceItem, ZoneItem } from "@saga-web/cad-engine/lib";
  122. import { colorArr } from "@/utils/spaceColor"
  123. import unRelateBSP from "./unRelateBSP";
  124. import createBSP from "./createBSP";
  125. // import dialogZone from "../../ledger/addDialog/dialogZone";
  126. import {
  127. createRelateInZoneAndISp,
  128. getIspNotInSpace,
  129. groupCreRelaZoneAndISp,
  130. handleZoneUpdateBd,
  131. queryAllZoneType,
  132. queryZone,
  133. zoneCount,
  134. zoneCreate,
  135. zoneQuery,
  136. zoneQueryOutline,
  137. zoneUpdate,
  138. zoneUpdateOutline
  139. } from "@/api/scan/request"
  140. export default {
  141. components: {
  142. canvasFun,
  143. unRelateBSP,
  144. createBSP,
  145. // dialogZone
  146. },
  147. data() {
  148. return {
  149. canvasWidth: 800,
  150. canvasHeight: 600,
  151. type: 1, // 默认操作模式
  152. search: '',//搜索
  153. buildFloor: ['', ''],
  154. FloorObj: {}, //楼层对象
  155. FloorMap: '', //楼层底图
  156. tab: {},
  157. config: {
  158. isEdit: false,
  159. divide: true,
  160. groupSelect: true
  161. },
  162. canvasLoading: false,
  163. view: null,
  164. scene: null,
  165. Outline: [], // 当前选中的多个空间组成的轮廓线->三维数组
  166. businessSpaceList: [], // 所有业务空间
  167. num: 0, // 未关联元空间的业务空间统计
  168. BSPRelaISPList: [], // 已关联元空间的业务空间
  169. // 未关联元空间的业务空间弹窗
  170. isAction: false,
  171. curOutline: [],
  172. BIMIDToSID: {}, //bimid映射元空间id
  173. BIMIDToSIName: {}, //bimid映射元空间名称
  174. curZoneItem: {}, //当前选中的业务空间item
  175. allUnRelatISP: [], //
  176. zoneList: [], // 业务空间-canvas图中
  177. groupCreateDialogVis: false, //批量创建业务空间弹窗
  178. groupCreateType: 1, //批量创建方式
  179. zoneDisable: true, // 重新划分是否禁用
  180. sourceIdToISP: {},
  181. areaValue: 40,
  182. areaMarks: { 0: '0m²', 100: '1m²' },
  183. options: [], //其他分区类型
  184. OtherValue: '',
  185. showOtherFlag: false, //是否显示其他分区类型添加
  186. buildFloorName: "", //建筑楼层名称
  187. spaceHeight: 0,
  188. }
  189. },
  190. computed: {
  191. ...mapGetters("layout", ["projectId", "projects"]),
  192. projectName() {
  193. let projectObj = this.projects.find(item => {
  194. return item.id == this.projectId
  195. })
  196. return projectObj ? projectObj.name ? projectObj.name : projectObj.id : this.projectId
  197. }
  198. },
  199. created() {
  200. Opt.sceneMarkColor = new SColor('#ffffff');
  201. },
  202. mounted() {
  203. this.canvasWidth = this.$refs.graphy.offsetWidth - 20;
  204. this.canvasHeight = this.$refs.graphy.offsetHeight - 20;
  205. },
  206. methods: {
  207. // 初始化
  208. init(initType) {
  209. this.type = 1;
  210. if (this.scene) {
  211. this.scene.clearSpaceSelection();
  212. this.scene.clearZoneSelection();
  213. this.scene.clearCut();
  214. this.scene.clearLikeSpaces();
  215. this.zoneDisable = true;
  216. this.scene.isZoneSelectable = true;
  217. this.scene.isSpaceSelectable = false;
  218. }
  219. if (this.buildFloor.indexOf('all') > -1 || this.buildFloor.indexOf('noKnow') > -1) {
  220. return;
  221. }
  222. if (initType == 1) {
  223. // 底图
  224. this.getGraphy();
  225. } else {
  226. // 业务空间
  227. this.getBusinessSpace();
  228. }
  229. this.config = {
  230. isEdit: false,
  231. divide: true,
  232. groupSelect: true,
  233. }
  234. // 获取当前楼层的元空间
  235. this.getFloorISpace();
  236. // 查询未关联业务空间的元空间
  237. this.getISPSPUnrelaBSP();
  238. // 查询未关联平面图的业务空间
  239. this.getBSPunrelaISP();
  240. },
  241. // 获取当前楼层的元空间-元空间接口不变
  242. getFloorISpace() {
  243. let pa = {
  244. zone: 'Ispace',
  245. data: {
  246. // Filters: `FloorId='${this.buildFloor[1]}'`,
  247. pageSize: 2000,
  248. floorId: this.buildFloor[1]
  249. }
  250. }
  251. queryZone(pa, res => {
  252. if (res.message == this.buildFloor[1]) {
  253. this.BIMIDToSID = {}
  254. this.BIMIDToSIName = {}
  255. this.sourceIdToISP = {}
  256. res.content.map(t => {
  257. let key = t.bimId.split(":")[1];
  258. this.BIMIDToSID[key] = t.id;
  259. this.BIMIDToSIName[key] = t.localName || t.name;
  260. this.sourceIdToISP[key] = t;
  261. })
  262. }
  263. })
  264. },
  265. //添加其他分区
  266. addZoneBtn() {
  267. this.$refs.zone.dialogFormVisible = true
  268. },
  269. // 搜索
  270. querySearch(queryString, cb) {
  271. let restaurants = this.zoneList;
  272. let results = queryString ?
  273. restaurants.filter(this.createFilter(queryString)) :
  274. restaurants;
  275. // 调用 callback 返回建议列表的数据
  276. cb(results);
  277. },
  278. // 过滤器
  279. createFilter(queryString) {
  280. return restaurant => {
  281. return restaurant.data.RoomLocalName.indexOf(queryString) > -1;
  282. };
  283. },
  284. // 查询选中,定位
  285. handleSelect(zone) {
  286. // 清空选中
  287. this.scene.clearSpaceSelection();
  288. this.scene.clearZoneSelection();
  289. // 选中当前
  290. zone.selected = true;
  291. this.curZoneItem = zone;
  292. this.zoneDisable = false;
  293. this.view.fitSelectedToView(0.1);
  294. },
  295. // 父组件调用
  296. getData(buildFloor, FloorObj, tab) {
  297. let initType = 1;
  298. if (FloorObj.id == this.FloorObj.id) {
  299. initType = 2;
  300. }
  301. this.buildFloor = buildFloor;
  302. this.FloorObj = FloorObj;
  303. this.FloorMap = FloorObj.infos ? FloorObj.infos.floorMap : '';
  304. this.tab = tab;
  305. this.buildFloorName = `${FloorObj.buildName}-${FloorObj.label}`;
  306. console.log(arguments);
  307. if (tab.code == "OtherZone") {
  308. // 其他分区
  309. this.showOtherFlag = true
  310. // this.getOtherType();
  311. // this.OtherValue = (localStorage.getItem('otherZone')) || ''
  312. } else {
  313. this.showOtherFlag = false;
  314. }
  315. this.init(initType);
  316. },
  317. // 其他分区类型查询
  318. // getOtherType() {
  319. // let pa = {
  320. // Cascade: [{ Filters: `ProjectId='${this.projectId}'` }],
  321. // Filters: `Code="OtherZone"`
  322. // }
  323. // queryAllZoneType(pa, res => {
  324. // if (res.content[0].zoneType && res.content[0].zoneType.length) {
  325. // this.options = res.content[0].zoneType.map(t => {
  326. // t.value = t.code;
  327. // t.label = t.name;
  328. // return t;
  329. // })
  330. // } else {
  331. // this.options = []
  332. // }
  333. // })
  334. // },
  335. // 其他类型下拉change
  336. changeOtherZone(val) {
  337. this.init(2);
  338. },
  339. // 获取未绑定业务空间的元空间
  340. getISPSPUnrelaBSP() {
  341. let pa = {
  342. data: {
  343. pageSize: 1000,
  344. floorId: this.buildFloor[1]
  345. },
  346. objectType: this.tab.code
  347. // objectType: this.tab.code == 'OtherZone' ? this.OtherValue : this.tab.code
  348. }
  349. getIspNotInSpace(pa, res => {
  350. // 类型需要重新获取,直接取pa.objecttype有问题
  351. let tempType = this.tab.code
  352. // let tempType = this.tab.code == 'OtherZone' ? this.OtherValue : this.tab.code
  353. if (res.floorId == this.buildFloor[1] && res.zoneType == tempType) {
  354. this.allUnRelatISP = res.content;
  355. }
  356. })
  357. },
  358. // 获取底图
  359. getGraphy() {
  360. let that = this;
  361. that.clearGraphy()
  362. that.scene = new DivideFloorScene();
  363. that.canvasLoading = true;
  364. const temp = this.FloorMap.split('.')[1];
  365. if (temp && (temp.toLowerCase() == 'png' || temp.toLowerCase() == 'jpg')) {
  366. that.scene.loadImg(`/image-service/common/image_get?systemId=dataPlatform&key=${this.FloorMap}`, res => {
  367. this.getGraphtSuc(res)
  368. })
  369. } else {
  370. that.scene.loadUrl(`/image-service/common/file_get?systemId=revit&key=${this.FloorMap}`).then(res => {
  371. this.getGraphtSuc(res)
  372. })
  373. }
  374. },
  375. getGraphtSuc(res) {
  376. let that = this
  377. that.canvasLoading = false;
  378. if (res == 'error') {
  379. this.FloorMap = '';
  380. console.log('数据解析异常', `/image-service/common/file_get?systemId=revit&key=${this.FloorMap}`);
  381. return;
  382. }
  383. that.view.scene = that.scene;
  384. // 蒙版
  385. if (this.FloorObj.outline) {
  386. let newArr = this.FloorObj.outline.map(t => {
  387. return new SPoint(t.X, t.Y);
  388. })
  389. this.scene.addSceneMark(newArr)
  390. }
  391. this.scene.isSpaceSelectable = false;
  392. // 绘制业务空间
  393. that.getBusinessSpace();
  394. that.fit();
  395. that.view.minScale = that.view.scale;
  396. if (that.$refs.canvasFun) {
  397. that.$refs.canvasFun.everyScale = that.view.scale;
  398. }
  399. },
  400. // 获取当前分区下的业务空间
  401. getBusinessSpace() {
  402. this.canvasLoading = true
  403. // 其他分区 已删除在其他分区下添加子分区
  404. // let ObjectType = this.tab.code == 'OtherZone' ? this.OtherValue : this.tab.code;
  405. let ObjectType = this.tab.code;
  406. let pa = {
  407. // cascader: [{name: 'spaceOutline'}],
  408. zoneType: ObjectType,
  409. filters: `not id isNull`,
  410. orders: "createTime desc, id asc",
  411. pageSize: 10000
  412. }
  413. if (this.buildFloor.length && this.buildFloor.length > 1) {
  414. pa.BuildingId = this.buildFloor[0];
  415. pa.FloorId = this.buildFloor[1];
  416. }
  417. // zoneQuery
  418. // zoneQueryOutline
  419. zoneQueryOutline(pa, res => {
  420. // 类型需要重新获取,直接取pa.ZoneType
  421. // 其他分区已删除 在其他分区下添加子分区
  422. // let tempType = this.tab.code == 'OtherZone' ? this.OtherValue : this.tab.code;
  423. let tempType = this.tab.code;
  424. if (res.floorId == this.buildFloor[1] && res.zoneType == tempType) {
  425. // 所有业务空间
  426. this.businessSpaceList = res.content;
  427. // 已关联元空间的业务空间
  428. this.BSPRelaISPList = [];
  429. res.content.map(t => {
  430. if (t.outline && t.outline.length) {
  431. this.BSPRelaISPList.push(t)
  432. }
  433. })
  434. // 绘制业务空间
  435. let tempArr = this.BSPRelaISPList.map((t, i) => {
  436. return {
  437. RoomLocalName: t.localName || t.name,
  438. OutLine: t.outline,
  439. RoomID: t.id,
  440. Color: colorArr[i % colorArr.length],
  441. Infected: t.state
  442. }
  443. }).filter(item => item)
  444. try {
  445. this.scene.removeAllZone();
  446. this.scene.addZoneList(tempArr);
  447. this.scene.click(this, this.canvasClick);
  448. this.zoneList = this.scene.zoneList;
  449. this.view._needDraw = true;
  450. this.fit();
  451. } catch (err) {
  452. console.log(err,'------------');
  453. console.log(this)
  454. }
  455. this.canvasLoading = false;
  456. }
  457. })
  458. },
  459. // canvas点击事件
  460. canvasClick(item, event) {
  461. console.log(item)
  462. console.log(event)
  463. if (this.type == 4) {//重新划分
  464. } else if (this.type == 5) {//批量
  465. } else {
  466. if (item instanceof SpaceItem && item.selectable) {
  467. if (this.spaceHeight == 0) {
  468. this.spaceHeight = item.data.Height > 1000 ? item.data.Height / 1000 : item.data.Height
  469. }
  470. if (this.type == 2) {
  471. this.scene.clearZoneSelection();
  472. }
  473. this.type = 3;
  474. this.curZoneItem = {};
  475. }
  476. if (item instanceof ZoneItem && item.selectable) {
  477. if (this.type == 3) {
  478. this.scene.clearSpaceSelection();
  479. }
  480. this.zoneDisable = false;
  481. this.curZoneItem = item;
  482. this.scene.clearZoneSelection();
  483. item.selected = true;
  484. this.$emit('copyID', this.curZoneItem.data.RoomID)
  485. }
  486. }
  487. },
  488. // 编辑平面图
  489. editGraphy() {
  490. this.type = 3;
  491. this.config.isEdit = true;
  492. this.config.groupSelect = false;
  493. this.config.divide = true;
  494. this.scene.isSpaceSelectable = true;
  495. // 设置业务空间不可选
  496. this.scene.isZoneSelectable = false
  497. this.view._needDraw = true;
  498. },
  499. // 查看未关联的业务空间--flag--查看-or-选择
  500. lookUnrelatBSpace(flag) {
  501. this.isAction = flag;
  502. let arr = this.scene.getSelectedSpaces();
  503. if (flag && !arr.length) {
  504. this.$message.warning('请至少选择一个空间');
  505. return;
  506. }
  507. // this.$refs.unRelateBSP.showDialog(this.buildFloor);
  508. this.$refs.unRelateBSP.showDialog();
  509. },
  510. // 取消(所有取消公用)
  511. cancelGraphy() {
  512. this.init(2);
  513. this.$emit('copyID', '')
  514. },
  515. // 批量创建业务空间弹窗
  516. handleCommand(command) {
  517. this.groupCreateDialogVis = true;
  518. },
  519. // 创建弹窗确认
  520. confirm() {
  521. if (this.groupCreateType == 1) {
  522. this.groupCreateBSpace()
  523. } else if (this.groupCreateType == 2) {
  524. this.type = 5;
  525. this.config.isEdit = true;
  526. this.config.groupSelect = true;
  527. this.config.divide = false;
  528. this.groupCreateDialogVis = false;
  529. // 清空选中空间
  530. this.scene.clearSpaceSelection();
  531. // 设置空间可选
  532. this.scene.isSpaceSelectable = true;
  533. // 设置业务空间不可选
  534. this.scene.isZoneSelectable = false;
  535. // 刷新
  536. this.view.update()
  537. }
  538. },
  539. // 根据未关联元空间批量创建业务空间
  540. groupCreateBSpace() {
  541. let text = []
  542. let Spaces = this.allUnRelatISP.map(t => {
  543. if (t.outline) {
  544. let area = 0;
  545. if (t.outline[0]) {
  546. area = this.getarea(t.outline[0]);
  547. if (t.outline.length > 1) {
  548. for (let i = 1; i < t.outline.length; i++) {
  549. let temp = this.getarea(t.outline[i]);
  550. area = area - temp
  551. }
  552. }
  553. area = (area / 1000000).toFixed(2);
  554. if (area < (this.areaValue / 100)) {
  555. return undefined
  556. }
  557. } else {
  558. return undefined;
  559. }
  560. text.push(t.localName || t.name)
  561. let obj = {
  562. ispaceId: t.id,
  563. localName: t.localName || t.name,
  564. outline: [t.outline],
  565. buildingId: this.buildFloor[0],
  566. floorId: this.buildFloor[1],
  567. height: this.spaceHeight
  568. }
  569. if (t.customParam) {
  570. obj.customParam = t.customParam
  571. }
  572. // 2020-12-20 演示用 -start
  573. if (t.infos) {
  574. obj.infos = {}
  575. if (t.infos.roomLocalFuncTypeID) {
  576. obj.infos.roomLocalFuncTypeID = t.infos.roomLocalFuncTypeID
  577. }
  578. if (t.infos.roomLocalFuncTypeName) {
  579. obj.infos.roomLocalFuncTypeName = t.infos.roomLocalFuncTypeName
  580. }
  581. }
  582. // 2020-12-20 演示用 -end
  583. return obj;
  584. } else {
  585. return undefined
  586. }
  587. }).filter(item => item);
  588. if (Spaces.length) {
  589. this.$confirm(
  590. "<p>确定根据未关联业务空间的空间批量创建业务空间</p>" +
  591. "<p>涉及的空间:</p>" +
  592. "<p style='line-height:20px;max-height:60px;overflow-y:auto;'>" +
  593. text.toString() +
  594. "</p>",
  595. "提示", {
  596. dangerouslyUseHTMLString: true,
  597. confirmButtonText: "确定",
  598. cancelButtonText: "取消",
  599. type: "warning"
  600. }
  601. ).then(() => {
  602. this.groupCreateDialogVis = false;
  603. this.canvasLoading = true;
  604. this.groupCreateBSP(Spaces)
  605. }).catch(() => {
  606. this.$message({
  607. type: "info",
  608. message: "已取消批量创建"
  609. });
  610. });
  611. } else {
  612. this.$message('没有未关联的空间')
  613. }
  614. },
  615. // 创建新的业务空间
  616. createNewZone() {
  617. let arr = this.scene.getSelectedSpaces();
  618. if (arr.length) {
  619. let tempArr = [];
  620. arr.map(t => {
  621. if (this.BIMIDToSIName[t.data.SourceId]) {
  622. tempArr.push(this.BIMIDToSIName[t.data.SourceId]);
  623. }
  624. })
  625. this.$refs.createBSP.showDialog(tempArr.toString());
  626. } else {
  627. this.$message.warning('请至少选择一个空间');
  628. }
  629. },
  630. // 根据图创建新的业务空间-弹窗返回确认创建
  631. createRoom(val) {
  632. const zoneObj = { outline: [], height: 0 }, IspaceIdList = [];
  633. let spaces = {};
  634. try {
  635. if (this.scene.cutItem || this.scene.sceneMark) {
  636. // 如果有划分,求交集
  637. // 格式为Poly(先与业务空间求差集)
  638. const obj = this.scene.getZoneDifference(true);
  639. // 差集与楼层平面图或用户划分区域求交集
  640. spaces = this.scene.getPloyIntersect(obj)
  641. } else {
  642. // 格式为SPoint[]
  643. spaces = this.scene.getZoneDifference();
  644. }
  645. for (let key in spaces) {
  646. spaces[key] = spaces[key].map(t => {
  647. let temp = t.map(item => {
  648. return {
  649. X: 1 * item.x.toFixed(2),
  650. Y: -item.y.toFixed(2),
  651. Z: 0
  652. }
  653. })
  654. return temp;
  655. })
  656. let newarr = this.makeMaxAreaFirst(spaces[key])
  657. zoneObj.outline.push(newarr);
  658. let curISP = this.sourceIdToISP[key];
  659. if (curISP) {
  660. curISP && IspaceIdList.push(curISP.id);
  661. zoneObj.height = this.spaceHeight;
  662. // 2020-12-20 演示用 -start
  663. console.log(curISP);
  664. if (curISP.infos) {
  665. zoneObj.infos = {}
  666. if (curISP.infos.roomLocalFuncTypeID) {
  667. zoneObj.infos.roomLocalFuncTypeID = curISP.infos.roomLocalFuncTypeID
  668. }
  669. if (curISP.infos.roomLocalFuncTypeName) {
  670. zoneObj.infos.roomLocalFuncTypeName = curISP.infos.roomLocalFuncTypeName
  671. }
  672. }
  673. // 2020-12-20 演示用 -end
  674. }
  675. }
  676. } catch (err) {
  677. console.log(err)
  678. let selectSpaces = this.scene.getSelectedSpaces();
  679. selectSpaces.map(t => {
  680. zoneObj.outline.push(t.data.outLine);
  681. let key = t.data.sourceId;
  682. let curISP = this.sourceIdToISP[key];
  683. if (curISP) {
  684. IspaceIdList.push(curISP.id);
  685. zoneObj.height = this.spaceHeight;
  686. // 2020-12-20 演示用 -start
  687. console.log(curISP);
  688. if (curISP.infos) {
  689. zoneObj.infos = {}
  690. if (curISP.infos.roomLocalFuncTypeID) {
  691. zoneObj.infos.roomLocalFuncTypeID = curISP.infos.roomLocalFuncTypeID
  692. }
  693. if (curISP.infos.roomLocalFuncTypeName) {
  694. zoneObj.infos.roomLocalFuncTypeName = curISP.infos.roomLocalFuncTypeName
  695. }
  696. }
  697. // 2020-12-20 演示用 -end
  698. }
  699. })
  700. // 如果有划分,求交集
  701. if (this.scene.cutItem || this.scene.sceneMark) {
  702. zoneObj.outline = [];
  703. let arr = this.scene.getIntersect();
  704. arr.map(t => {
  705. let temp = t.map(item => {
  706. return {
  707. X: 1 * item.x,
  708. Y: -item.y,
  709. Z: 0
  710. }
  711. })
  712. zoneObj.outline.push([temp]);
  713. })
  714. }
  715. }
  716. // 至此
  717. if (!zoneObj.outline.length) {
  718. zoneObj.outline = null;
  719. }
  720. zoneObj.localName = val;
  721. zoneObj.buildingId = this.buildFloor[0];
  722. zoneObj.floorId = this.buildFloor[1];
  723. this.createSingleBSP(zoneObj, IspaceIdList)
  724. },
  725. // 根据图从未关联平面图的业务空间中选择--按钮返回关联信号
  726. createFromUnrelated(zoneObj) {
  727. zoneObj.outline = [];
  728. zoneObj.height = 0;
  729. let spaces = {}, IspaceIdList = [];
  730. try {
  731. if (this.scene.cutItem || this.scene.sceneMark) {
  732. // 如果有划分,求交集
  733. // 格式为Poly(先与业务空间求差集)
  734. const obj = this.scene.getZoneDifference(true);
  735. // 差集与楼层平面图或用户划分区域求交集
  736. spaces = this.scene.getPloyIntersect(obj)
  737. } else {
  738. // 格式为SPoint[]
  739. spaces = this.scene.getZoneDifference();
  740. }
  741. for (let key in spaces) {
  742. spaces[key] = spaces[key].map(t => {
  743. let temp = t.map(item => {
  744. return {
  745. X: 1 * item.x.toFixed(2),
  746. Y: -item.y.toFixed(2),
  747. Z: 0
  748. }
  749. })
  750. return temp;
  751. })
  752. let newarr = this.makeMaxAreaFirst(spaces[key])
  753. zoneObj.outline.push(newarr);
  754. let curISP = this.sourceIdToISP[key];
  755. if (curISP) {
  756. curISP && IspaceIdList.push(curISP.id);
  757. zoneObj.height = this.spaceHeight;
  758. // 2020-12-20 演示用 -start
  759. if (curISP.infos) {
  760. zoneObj.infos = {}
  761. if (curISP.infos.roomLocalFuncTypeID) {
  762. zoneObj.infos.roomLocalFuncTypeID = curISP.infos.roomLocalFuncTypeID
  763. }
  764. if (curISP.infos.roomLocalFuncTypeName) {
  765. zoneObj.infos.roomLocalFuncTypeName = curISP.infos.roomLocalFuncTypeName
  766. }
  767. }
  768. // 2020-12-20 演示用 -end
  769. }
  770. }
  771. } catch (err) {
  772. console.log(err);
  773. let selectSpaces = this.scene.getSelectedSpaces();
  774. selectSpaces.map(t => {
  775. zoneObj.outline.push(t.data.outLine);
  776. let key = t.data.sourceId;
  777. let curISP = this.sourceIdToISP[key];
  778. if (curISP) {
  779. curISP && IspaceIdList.push(curISP.id);
  780. zoneObj.height = this.spaceHeight;
  781. // 2020-12-20 演示用 -start
  782. if (curISP.infos) {
  783. zoneObj.infos = {}
  784. if (curISP.infos.roomLocalFuncTypeID) {
  785. zoneObj.infos.roomLocalFuncTypeID = curISP.infos.roomLocalFuncTypeID
  786. }
  787. if (curISP.infos.roomLocalFuncTypeName) {
  788. zoneObj.infos.roomLocalFuncTypeName = curISP.infos.roomLocalFuncTypeName
  789. }
  790. }
  791. // 2020-12-20 演示用 -end
  792. }
  793. })
  794. // 如果有划分,求交集
  795. if (this.scene.cutItem || this.scene.sceneMark) {
  796. zoneObj.outline = [];
  797. let arr = this.scene.getIntersect();
  798. arr.map(t => {
  799. let temp = t.map(item => {
  800. return {
  801. X: 1 * item.x,
  802. Y: -item.y,
  803. Z: 0
  804. }
  805. })
  806. zoneObj.outline.push([temp]);
  807. })
  808. }
  809. }
  810. if (!zoneObj.outline.length) {
  811. zoneObj.outline = null;
  812. }
  813. this.updateBSPOutline(zoneObj, IspaceIdList)
  814. },
  815. // 编辑空间详情
  816. editeSpaceDetail() {
  817. let item = this.curZoneItem.data;
  818. let query = {
  819. RoomID: item.RoomID,
  820. zone: this.tab.code,
  821. isMyTab: 1,
  822. buildFloorSelectd: this.buildFloor
  823. }
  824. this.$router.push({
  825. path: "/ledger/spaceDetail",
  826. query: query
  827. })
  828. },
  829. // 重新划分业务空间
  830. refactorBSP() {
  831. this.config.isEdit = true;
  832. this.config.groupSelect = false;
  833. this.config.divide = true;
  834. this.type = 4;
  835. // 设置空间可选
  836. this.scene.isSpaceSelectable = true;
  837. // 将已关联的设置不可选,并将当前选的隐藏
  838. this.scene.isZoneSelectable = false;
  839. this.curZoneItem.visible = false;
  840. // 将当前业务空间的每个元素添加到场景中并选中
  841. this.scene.addAllLikeSpace(this.curZoneItem.data.OutLine);
  842. },
  843. // 确认业务空间
  844. confirmZoneSpace() {
  845. let ObjectType = this.tab.code
  846. // let ObjectType = this.tab.code == 'OtherZone' ? this.OtherValue : this.tab.code;
  847. let space = {
  848. id: this.curZoneItem.data.RoomID,
  849. state: 0,
  850. classCode: ObjectType
  851. }
  852. let pa = {
  853. content: [space],
  854. projection: ['state']
  855. }
  856. zoneUpdate(pa, res => {
  857. this.curZoneItem.isInfected = false;
  858. this.$emit('updateState');
  859. this.$message.success('更新成功');
  860. })
  861. },
  862. // 保存并确认业务空间
  863. confirmAndSave() {
  864. this.confirmAndSaveFlag = true;
  865. this.saveRefactorBSP();
  866. },
  867. // 重新划分--保存
  868. saveRefactorBSP() {
  869. let selectSpace = this.scene.getSelectedSpaces();
  870. let selectLikeSpace = this.scene.getSelectedLikeSpace();
  871. //更新业务空间
  872. let zoneObj = { outline: [], height: 0, state: this.confirmAndSaveFlag ? 0 : this.curZoneItem.isInfected ? 1 : 0 }, IspaceIdList = [];
  873. // 空间
  874. selectSpace.map(t => {
  875. zoneObj.outline.push(t.data.OutLine);
  876. if (this.BIMIDToSID[t.data.SourceId]) {
  877. IspaceIdList.push(this.BIMIDToSID[t.data.SourceId]);
  878. }
  879. // 2020-12-20 演示用 -start
  880. if (this.sourceIdToISP[t.data.sourceId] && this.sourceIdToISP[t.data.sourceId].infos) {
  881. zoneObj.infos = {};
  882. if (this.sourceIdToISP[t.data.sourceId].infos.roomLocalFuncTypeID) {
  883. zoneObj.infos.roomLocalFuncTypeID = this.sourceIdToISP[t.data.sourceId].infos.roomLocalFuncTypeID
  884. }
  885. if (this.sourceIdToISP[t.data.sourceId].infos.roomLocalFuncTypeName) {
  886. zoneObj.infos.roomLocalFuncTypeName = this.sourceIdToISP[t.data.sourceId].infos.roomLocalFuncTypeName
  887. }
  888. }
  889. // 2020-12-20 演示用 -end
  890. zoneObj.height = this.spaceHeight
  891. })
  892. // 类空间
  893. selectLikeSpace.map(t => {
  894. zoneObj.outline.push(t.data);
  895. })
  896. // 如果有划分,求交集
  897. if (this.scene.cutItem || this.scene.sceneMark) {
  898. zoneObj.outline = [];
  899. let spaceIntersect = this.scene.getIntersect();
  900. spaceIntersect.map(t => {
  901. let temp = t.map(item => {
  902. return {
  903. X: item.x,
  904. Y: -item.y,
  905. Z: 0
  906. }
  907. })
  908. zoneObj.outline.push([temp]);
  909. })
  910. let likeSpaceIntersect = this.scene.getLikeIntersect();
  911. likeSpaceIntersect.map(t => {
  912. let temp = t.map(item => {
  913. return {
  914. X: item.x,
  915. Y: -item.y,
  916. Z: 0
  917. }
  918. })
  919. zoneObj.outline.push([temp]);
  920. })
  921. }
  922. if (!zoneObj.outline.length) {
  923. zoneObj.outline = null;
  924. }
  925. zoneObj.id = this.curZoneItem.data.RoomID;
  926. this.updateBSPOutline(zoneObj, IspaceIdList)
  927. },
  928. // 根据图批量创建所选业务空间
  929. groupCreateZone() {
  930. let arr = this.scene.getSelectedSpaces();
  931. let createSpaces = [], spaces = {};
  932. try {
  933. if (this.scene.cutItem || this.scene.sceneMark) {
  934. // 如果有划分,求交集
  935. // 格式为Poly(先与业务空间求差集)
  936. const obj = this.scene.getZoneDifference(true);
  937. // 差集与楼层平面图或用户划分区域求交集
  938. spaces = this.scene.getPloyIntersect(obj)
  939. } else {
  940. // 格式为SPoint[]
  941. spaces = this.scene.getZoneDifference();
  942. }
  943. for (let key in spaces) {
  944. let zoneObj = { outline: [], height: 0 }
  945. spaces[key] = spaces[key].map(t => {
  946. let temp = t.map(item => {
  947. return {
  948. X: 1 * item.x.toFixed(2),
  949. Y: -item.y.toFixed(2),
  950. Z: 0
  951. }
  952. })
  953. return temp;
  954. })
  955. let newarr = this.makeMaxAreaFirst(spaces[key])
  956. zoneObj.outline.push(newarr);
  957. if (!zoneObj.outline.length) {
  958. continue
  959. }
  960. //计算面积
  961. let area = 0, line = zoneObj.outline;
  962. for (let i = 0; i < line.length; i++) {
  963. for (let j = 0; j < line[i].length; j++) {
  964. if (j == 0) {
  965. area += this.getarea(line[i][0]);
  966. } else {
  967. area -= this.getarea(line[i][j]);
  968. }
  969. }
  970. }
  971. area = (area / 1000000).toFixed(2);
  972. if (area < (this.areaValue / 100)) {
  973. continue
  974. }
  975. //生成空间对象
  976. let curISP = this.sourceIdToISP[key];
  977. if (curISP) {
  978. zoneObj.height = this.spaceHeight;
  979. // zoneObj.Height = zoneObj.Height == 0 ? curISP.Height : zoneObj.Height > curISP.Height ? curISP.Height : zoneObj.Height;
  980. zoneObj.ispaceId = curISP.id;
  981. zoneObj.localName = curISP.localName || '';
  982. // 2020-12-20 演示用 -start
  983. if (curISP.infos) {
  984. zoneObj.infos = {}
  985. if (curISP.infos.roomLocalFuncTypeID) {
  986. zoneObj.infos.roomLocalFuncTypeID = curISP.infos.roomLocalFuncTypeID
  987. }
  988. if (curISP.infos.roomLocalFuncTypeName) {
  989. zoneObj.infos.roomLocalFuncTypeName = curISP.infos.roomLocalFuncTypeName
  990. }
  991. }
  992. // 2020-12-20 演示用 -end
  993. }
  994. zoneObj.buildingId = this.buildFloor[0];
  995. zoneObj.floorId = this.buildFloor[1];
  996. createSpaces.push(zoneObj);
  997. }
  998. } catch (err) {
  999. console.log(err)
  1000. let createSpaces = [];
  1001. // 如果有划分,求交集
  1002. if (this.scene.cutItem || this.scene.sceneMark) {
  1003. let outlines = this.scene.getIntersectInSpace();
  1004. for (let k in outlines) {
  1005. outlines[k] = outlines[k].map(t => {
  1006. t = t.map(item => {
  1007. item = item.map(j => {
  1008. return { X: j.x, Y: -j.y, Z: 0 }
  1009. })
  1010. return item
  1011. })
  1012. return t;
  1013. })
  1014. }
  1015. createSpaces = arr.map(t => {
  1016. let line = outlines[t.data.SourceId];
  1017. if (!line || !line.length) {
  1018. return undefined
  1019. } else {
  1020. let area = 0;
  1021. for (let i = 0; i < line.length; i++) {
  1022. for (let j = 0; j < line[i].length; j++) {
  1023. if (j == 0) {
  1024. area += this.getarea(line[i][0]);
  1025. } else {
  1026. area -= this.getarea(line[i][j]);
  1027. }
  1028. }
  1029. }
  1030. area = (area / 1000000).toFixed(2);
  1031. if (area < (this.areaValue / 100)) {
  1032. return undefined;
  1033. }
  1034. }
  1035. return {
  1036. ispaceId: this.BIMIDToSID[t.data.sourceId],
  1037. localName: this.BIMIDToSIName[t.data.sourceId] || '',
  1038. outline: line,
  1039. buildingId: this.buildFloor[0],
  1040. floorId: this.buildFloor[1],
  1041. height: this.spaceHeight,
  1042. // 2020-12-20 演示用 -start
  1043. infos: {
  1044. roomLocalFuncTypeID: this.sourceIdToISP[t.data.sourceId].infos ? this.sourceIdToISP[t.data.sourceId].infos.roomLocalFuncTypeID || '' : '',
  1045. roomLocalFuncTypeName: this.sourceIdToISP[t.data.sourceId].infos ? this.sourceIdToISP[t.data.sourceId].infos.roomLocalFuncTypeName || '' : ''
  1046. }
  1047. // 2020-12-20 演示用 -end
  1048. }
  1049. }).filter(item => item)
  1050. } else {
  1051. createSpaces = arr.map(t => {
  1052. let line = t.data.outLine;
  1053. if (!line || !line.length) {
  1054. return undefined
  1055. } else {
  1056. let area = this.getarea(line[0]);
  1057. if (line.length > 1) {
  1058. for (let i = 1; i < line.length; i++) {
  1059. area -= this.getarea(line[i]);
  1060. }
  1061. }
  1062. area = (area / 1000000).toFixed(2);
  1063. if (area < (this.areaValue / 100)) {
  1064. return undefined;
  1065. }
  1066. }
  1067. return {
  1068. ispaceId: this.BIMIDToSID[t.data.sourceId],
  1069. localName: this.BIMIDToSIName[t.data.sourceId] || '',
  1070. outline: [line],
  1071. buildingId: this.buildFloor[0],
  1072. floorId: this.buildFloor[1],
  1073. height: this.spaceHeight,
  1074. // 2020-12-20 演示用 -start
  1075. infos: {
  1076. roomLocalFuncTypeID: this.sourceIdToISP[t.data.sourceId].infos ? this.sourceIdToISP[t.data.sourceId].infos.roomLocalFuncTypeID || '' : '',
  1077. roomLocalFuncTypeName: this.sourceIdToISP[t.data.sourceId].infos ? this.sourceIdToISP[t.data.sourceId].infos.roomLocalFuncTypeName || '' : ''
  1078. }
  1079. // 2020-12-20 演示用 -end
  1080. }
  1081. }).filter(item => item);
  1082. }
  1083. }
  1084. if (createSpaces.length) {
  1085. this.canvasLoading = true;
  1086. this.groupCreateBSP(createSpaces)
  1087. } else {
  1088. this.$message.warning('未选择空间');
  1089. }
  1090. },
  1091. // 更新业务空间和元空间的关系
  1092. relationInBSPandISP(SpaceId, IspaceIdList) {
  1093. let ObjectType = this.tab.code;
  1094. // let ObjectType = this.tab.code == 'OtherZone' ? this.OtherValue : this.tab.code;
  1095. let pa = {
  1096. data: { spaceId: SpaceId, ispaceIdList: IspaceIdList },
  1097. type: ObjectType
  1098. }
  1099. createRelateInZoneAndISp(pa, res => {
  1100. this.$message.success('创建成功');
  1101. this.init(2);
  1102. if (this.confirmAndSaveFlag) {
  1103. this.confirmAndSaveFlag = false;
  1104. this.curZoneItem.selected = false;
  1105. this.curZoneItem = {};
  1106. this.$emit('updateState');
  1107. }
  1108. })
  1109. },
  1110. // 批量更新业务空间和元空间的关系
  1111. groupCreRelaZoneAndISp(Spaces) {
  1112. Spaces = Spaces.filter(item => item.ispaceId);
  1113. let ObjectType = this.tab.code;
  1114. // let ObjectType = this.tab.code == 'OtherZone' ? this.OtherValue : this.tab.code;
  1115. if (Spaces.length) {
  1116. let param = {
  1117. data: {
  1118. content: Spaces
  1119. },
  1120. type: ObjectType
  1121. }
  1122. groupCreRelaZoneAndISp(param, res => {
  1123. this.$message.success('创建成功')
  1124. this.canvasLoading = false;
  1125. this.init(2)
  1126. })
  1127. } else {
  1128. this.$message.success('创建成功')
  1129. this.canvasLoading = false;
  1130. this.init(2)
  1131. }
  1132. },
  1133. // 批量创建
  1134. groupCreateBSP(spaces) {
  1135. let ObjectType = this.tab.code;
  1136. // let ObjectType = this.tab.code == 'OtherZone' ? this.OtherValue : this.tab.code;
  1137. spaces = spaces.map(t => {
  1138. t.classCode = ObjectType;
  1139. t.bimLocation = this.getAverageVal(t.outline);
  1140. return t;
  1141. })
  1142. let pa = {
  1143. content: spaces,
  1144. }
  1145. zoneCreate(pa, res => {
  1146. res.entityList.map(t => {
  1147. spaces = spaces.map(item => {
  1148. if (t.localName == item.localName) {
  1149. item.spaceId = t.id
  1150. }
  1151. return item;
  1152. })
  1153. })
  1154. this.groupCreRelaZoneAndISp(spaces)
  1155. })
  1156. },
  1157. // 单个创建
  1158. createSingleBSP(space, IspaceIdList) {
  1159. let ObjectType = this.tab.code;
  1160. // let ObjectType = this.tab.code == 'OtherZone' ? this.OtherValue : this.tab.code;
  1161. space.bimLocation = space.outline ? this.getAverageVal(space.outline) : null;
  1162. space.classCode = ObjectType;
  1163. let pa = {
  1164. content: [space]
  1165. }
  1166. zoneCreate(pa, res => {
  1167. this.relationInBSPandISP(res.entityList[0].id, IspaceIdList)
  1168. })
  1169. },
  1170. // 更新业务空间区域
  1171. updateBSPOutline(zoneObj, IspaceIdList) {
  1172. let ObjectType = this.tab.code;
  1173. // let ObjectType = this.tab.code == 'OtherZone' ? this.OtherValue : this.tab.code;
  1174. zoneObj.bimLocation = zoneObj.outline ? this.getAverageVal(zoneObj.outline) : null;
  1175. zoneObj.classCode = ObjectType;
  1176. zoneObj.buildingId = this.buildFloor[0];
  1177. zoneObj.floorId = this.buildFloor[1];
  1178. let pa = {
  1179. content: [zoneObj],
  1180. projection: ['bimLocation', 'classCode', 'outline', 'height', 'buildingId', 'floorId']
  1181. }
  1182. zoneUpdate(pa, res => {
  1183. zoneUpdateOutline(pa, res => { console.log(res) })
  1184. this.updateZoneBF(zoneObj, IspaceIdList);
  1185. })
  1186. },
  1187. // 从未关联平面图的业务空间中选择时更新业务空间建筑楼层
  1188. updateZoneBF(zoneObj, IspaceIdList) {
  1189. let pa = [{
  1190. type: zoneObj.classCode,
  1191. spaceId: zoneObj.id,
  1192. id: zoneObj.floorId,
  1193. }]
  1194. handleZoneUpdateBd(pa, res => {
  1195. this.relationInBSPandISP(zoneObj.id, IspaceIdList)
  1196. })
  1197. },
  1198. // 查询未关联平面图的业务空间(项目下+当前分区)
  1199. getBSPunrelaISP() {
  1200. let ObjectType = this.tab.code;
  1201. // let ObjectType = this.tab.code == 'OtherZone' ? this.OtherValue : this.tab.code;
  1202. let pa = {
  1203. Filters: `outline isNull;classCode="${ObjectType}"`
  1204. }
  1205. zoneCount(pa, res => {
  1206. this.num = res.count;
  1207. })
  1208. },
  1209. // 计算平均值 作为业务空间BIMLocation
  1210. getAverageVal(Outline) {
  1211. let X = 0, Y = 0, Z = 0, len = 0;
  1212. Outline.map(t => {
  1213. if (t[0]) {
  1214. t[0].map(item => {
  1215. X += item.X;
  1216. Y += item.Y;
  1217. Z += item.Z;
  1218. })
  1219. len += t[0].length
  1220. }
  1221. })
  1222. X = (X / len).toFixed(2);
  1223. Y = (Y / len).toFixed(2);
  1224. Z = (Z / len).toFixed(2);
  1225. return `${X},${Y},${Z}`
  1226. },
  1227. // 计算面积
  1228. getarea(arr) {
  1229. if (!arr.length) {
  1230. return 0;
  1231. }
  1232. let sum = 0;
  1233. let n = arr.length;
  1234. arr[n] = arr[0];
  1235. for (let i = 1; i <= n; i++) {
  1236. sum += arr[i].X * arr[i - 1].Y - arr[i - 1].X * arr[i].Y;
  1237. }
  1238. return Math.abs(sum / 2)
  1239. },
  1240. // canvas 获取焦点
  1241. focus() {
  1242. document.getElementById(`floorCanvas`).focus()
  1243. },
  1244. // 清除canvas
  1245. clearGraphy() {
  1246. if (this.view) {
  1247. this.view.scene = null;
  1248. return
  1249. }
  1250. this.view = new FloorView('floorCanvas')
  1251. },
  1252. // 工具栏操作
  1253. // 吸附
  1254. changeAbsorb(isAbsorbing) {
  1255. this.scene.isAbsorbing = isAbsorbing;
  1256. },
  1257. // 框选
  1258. groupSelect() {
  1259. this.scene.isRectSelection = 1;
  1260. },
  1261. // 适配底图到窗口
  1262. fit() {
  1263. if (this.scene.sceneMark) {
  1264. this.view.fitItemToView([this.scene.sceneMark])
  1265. return
  1266. }
  1267. this.view.fitSceneToView()
  1268. },
  1269. // 保存为png
  1270. savePng() {
  1271. this.view.saveImage(`${this.projectName}-${this.buildFloorName}.png`, 'png');
  1272. },
  1273. // 保存为svg
  1274. saveSvg() {
  1275. this.view.saveSceneSvg(`${this.projectName}-${this.buildFloorName}.svg`, 6400, 4800);
  1276. },
  1277. // 保存json
  1278. saveJson() {
  1279. this.view.saveFloorJson(`${this.projectName}-${this.buildFloorName}.json`)
  1280. },
  1281. // 切割划分
  1282. divide() {
  1283. this.scene.isCutting = true;
  1284. },
  1285. // 清除切割划分
  1286. clearDivide() {
  1287. this.scene.clearCut();
  1288. },
  1289. // 撤销
  1290. undo() { },
  1291. // 反撤销
  1292. redo() { },
  1293. // 缩放
  1294. scale(val) {
  1295. if (!this.view) {
  1296. return;
  1297. }
  1298. let scale = this.view.scale;
  1299. this.view.scaleByPoint(val / scale, this.canvasWidth / 2, this.canvasHeight / 2);
  1300. },
  1301. // 给定多个轮廓线的数据,计算得到面积最大值,并把它放置数组第一项,并将第一项顺时针处理,第一项以后的每一项做逆时针处理
  1302. // list {XYZ}[][]
  1303. makeMaxAreaFirst(list) {
  1304. let arr = [], area = 0;
  1305. for (let i = 0; i < list.length; i++) {
  1306. let temp = this.getarea(list[i])
  1307. if (temp > area) {
  1308. arr.unshift(list[i])
  1309. } else {
  1310. arr.push(list[i])
  1311. }
  1312. }
  1313. arr.map((t, i) => {
  1314. if (!i) {
  1315. if (this.clockDir(t) > 0) {
  1316. return t
  1317. } else {
  1318. return t.reverse()
  1319. }
  1320. } else {
  1321. if (this.clockDir(t) > 0) {
  1322. return t.reverse()
  1323. } else {
  1324. return t
  1325. }
  1326. }
  1327. })
  1328. return arr;
  1329. },
  1330. // 数组为顺时针or逆时针 顺时针非负 逆时针为 负
  1331. clockDir(pointList) {
  1332. let l = pointList.length - 1
  1333. if (pointList[0].x == pointList[l].x && pointList[0].y == pointList[l].y) {
  1334. pointList.splice(l, 1);
  1335. }
  1336. if (pointList.length < 3) {
  1337. return 0;
  1338. }
  1339. let index = 0;
  1340. let len = pointList.length;
  1341. for (let i = 1; i < len; i++) {
  1342. if (pointList[i].X > pointList[index].X) {
  1343. index = i;
  1344. }
  1345. }
  1346. let p1 = pointList[index == 0 ? len - 1 : index - 1];
  1347. let p2 = pointList[index];
  1348. let p3 = pointList[(index + 1) % len];
  1349. return (p2.X - p1.X) * (p3.Y - p2.Y) - (p2.Y - p1.Y) * (p3.X - p2.X);
  1350. }
  1351. },
  1352. filters: {
  1353. cutString: function (str, len) {
  1354. //length属性读出来的汉字长度为1
  1355. if (!!str && typeof str == "string" && str.length > len) {
  1356. return str.substring(0, len) + "...";
  1357. } else {
  1358. return str || "--";
  1359. }
  1360. }
  1361. },
  1362. watch: {
  1363. projectId() {
  1364. this.FloorMap = '';
  1365. this.tab = {};
  1366. },
  1367. "view.scale": {
  1368. handler(n) {
  1369. if (this.$refs.canvasFun) {
  1370. let s = n * 10 / this.view.minScale
  1371. this.$refs.canvasFun.sliderVal = s > 1000 ? 1000 : s;
  1372. }
  1373. }
  1374. },
  1375. "scene.isRectSelection": {
  1376. handler(n) {
  1377. if (!n) {
  1378. this.$refs.canvasFun.active = '';
  1379. }
  1380. }
  1381. },
  1382. "scene.isCutting": {
  1383. handler(n) {
  1384. if (!n) {
  1385. this.$refs.canvasFun.active = '';
  1386. this.$refs.canvasFun.isSwitch = false;
  1387. this.scene.isAbsorbing = false;
  1388. }
  1389. }
  1390. },
  1391. }
  1392. }
  1393. </script>
  1394. <style lang="less" scoped>
  1395. #graphy {
  1396. position: relative;
  1397. width: 100%;
  1398. box-sizing: border-box;
  1399. padding: 0 10px 10px;
  1400. height: calc(100% - 56px);
  1401. .canvas-box {
  1402. width: 100%;
  1403. height: 100%;
  1404. }
  1405. .buttons-box {
  1406. position: absolute;
  1407. top: 0;
  1408. left: 0;
  1409. padding: 0 10px;
  1410. width: 100%;
  1411. z-index: 999;
  1412. & > div {
  1413. float: left;
  1414. }
  1415. /deep/ .el-autocomplete {
  1416. display: inline-block;
  1417. width: 320px;
  1418. margin-right: 10px;
  1419. }
  1420. .button-group button,
  1421. .button-group .el-dropdown {
  1422. display: block;
  1423. float: left;
  1424. }
  1425. .my-autocomplete {
  1426. li {
  1427. line-height: normal;
  1428. padding: 7px;
  1429. .name {
  1430. text-overflow: ellipsis;
  1431. overflow: hidden;
  1432. }
  1433. .addr {
  1434. font-size: 12px;
  1435. color: #b4b4b4;
  1436. }
  1437. .highlighted .addr {
  1438. color: #ddd;
  1439. }
  1440. }
  1441. }
  1442. }
  1443. .canvas-actions-box {
  1444. position: absolute;
  1445. bottom: 60px;
  1446. left: 50%;
  1447. transform: translateX(-50%);
  1448. z-index: 99;
  1449. }
  1450. #autoRelate {
  1451. /deep/ .el-slider__marks-text:nth-child(2) {
  1452. width: 25px;
  1453. }
  1454. }
  1455. }
  1456. </style>