graphy.vue 53 KB

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