graphy.vue 48 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440
  1. <template>
  2. <div id="graphy" ref="graphy" v-loading="canvasLoading">
  3. <div v-show="!FloorMap">
  4. <div style="margin-right:10px;width: 100%;margin-bottom: 10px" v-if="showOtherFlag">
  5. <!-- 平面图其他分区 -->
  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. <div style="margin-right:10px;width: 100%;margin-bottom: 10px" v-if="showOtherFlag">
  22. <!-- 平面图其他分区 -->
  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-show="type==5">
  75. <el-button type="primary" @click="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 == 'OtherZone' ? this.OtherValue : this.tab.code
  347. }
  348. getIspNotInSpace(pa, res => {
  349. // 类型需要重新获取,直接取pa.objecttype有问题
  350. let tempType = this.tab.code == 'OtherZone' ? this.OtherValue : this.tab.code
  351. if (res.floorId == this.buildFloor[1] && res.zoneType == tempType) {
  352. this.allUnRelatISP = res.content;
  353. }
  354. })
  355. },
  356. // 获取底图
  357. getGraphy() {
  358. let that = this;
  359. that.clearGraphy()
  360. that.scene = new DivideFloorScene();
  361. that.canvasLoading = true;
  362. const temp = this.FloorMap.split('.')[1];
  363. if (temp && (temp.toLowerCase() == 'png' || temp.toLowerCase() == 'jpg')) {
  364. that.scene.loadImg(`/image-service/common/image_get?systemId=dataPlatform&key=${this.FloorMap}`, res => {
  365. this.getGraphtSuc(res)
  366. })
  367. } else {
  368. that.scene.loadUrl(`/image-service/common/file_get?systemId=revit&key=${this.FloorMap}`).then(res => {
  369. this.getGraphtSuc(res)
  370. })
  371. }
  372. },
  373. getGraphtSuc(res) {
  374. let that = this
  375. that.canvasLoading = false;
  376. if (res == 'error') {
  377. this.FloorMap = '';
  378. this.$message.warning('数据解析异常');
  379. return;
  380. }
  381. that.view.scene = that.scene;
  382. // 蒙版
  383. if (this.FloorObj.outline) {
  384. let newArr = this.FloorObj.outline.map(t => {
  385. return new SPoint(t.X, t.Y);
  386. })
  387. this.scene.addSceneMark(newArr)
  388. }
  389. this.scene.isSpaceSelectable = false;
  390. // 绘制业务空间
  391. that.getBusinessSpace();
  392. that.fit();
  393. that.view.minScale = that.view.scale;
  394. if (that.$refs.canvasFun) {
  395. that.$refs.canvasFun.everyScale = that.view.scale;
  396. }
  397. },
  398. // 获取当前分区下的业务空间
  399. getBusinessSpace() {
  400. this.canvasLoading = true
  401. let ObjectType = this.tab.code == 'OtherZone' ? this.OtherValue : this.tab.code;
  402. let pa = {
  403. // cascader: [{name: 'spaceOutline'}],
  404. zoneType: ObjectType,
  405. filters: `not id isNull`,
  406. orders: "createTime desc, id asc",
  407. pageSize: 10000
  408. }
  409. if (this.buildFloor.length && this.buildFloor.length > 1) {
  410. pa.BuildingId = this.buildFloor[0];
  411. pa.FloorId = this.buildFloor[1];
  412. }
  413. // zoneQuery
  414. // zoneQueryOutline
  415. zoneQueryOutline(pa, res => {
  416. // 类型需要重新获取,直接取pa.ZoneType
  417. let tempType = this.tab.code == 'OtherZone' ? this.OtherValue : this.tab.code;
  418. if (res.floorId == this.buildFloor[1] && res.zoneType == tempType) {
  419. // 所有业务空间
  420. this.businessSpaceList = res.content;
  421. // 已关联元空间的业务空间
  422. this.BSPRelaISPList = [];
  423. res.content.map(t => {
  424. if (t.outline && t.outline.length) {
  425. this.BSPRelaISPList.push(t)
  426. }
  427. })
  428. // 绘制业务空间
  429. let tempArr = this.BSPRelaISPList.map((t, i) => {
  430. console.log(t);
  431. return {
  432. RoomLocalName: t.localName || t.name,
  433. OutLine: t.outline,
  434. RoomID: t.id,
  435. Color: colorArr[i % colorArr.length],
  436. Infected: t.state
  437. }
  438. }).filter(item => item)
  439. this.scene.removeAllZone();
  440. this.scene.addZoneList(tempArr);
  441. this.scene.click(this, this.canvasClick);
  442. this.zoneList = this.scene.zoneList;
  443. this.view._needDraw = true;
  444. this.canvasLoading = false;
  445. }
  446. })
  447. },
  448. // canvas点击事件
  449. canvasClick(item, event) {
  450. console.log(item)
  451. console.log(event)
  452. if (this.type == 4) {//重新划分
  453. } else if (this.type == 5) {//批量
  454. } else {
  455. if (item instanceof SpaceItem && item.selectable) {
  456. if (this.spaceHeight == 0) {
  457. this.spaceHeight = item.data.Height > 1000 ? item.data.Height / 1000 : item.data.Height
  458. }
  459. if (this.type == 2) {
  460. this.scene.clearZoneSelection();
  461. }
  462. this.type = 3;
  463. this.curZoneItem = {};
  464. }
  465. if (item instanceof ZoneItem && item.selectable) {
  466. if (this.type == 3) {
  467. this.scene.clearSpaceSelection();
  468. }
  469. this.zoneDisable = false;
  470. this.curZoneItem = item;
  471. this.scene.clearZoneSelection();
  472. item.selected = true;
  473. this.$emit('copyID', this.curZoneItem.data.RoomID)
  474. }
  475. }
  476. },
  477. // 编辑平面图
  478. editGraphy() {
  479. this.type = 3;
  480. this.config.isEdit = true;
  481. this.config.groupSelect = false;
  482. this.config.divide = true;
  483. this.scene.isSpaceSelectable = true;
  484. // 设置业务空间不可选
  485. this.scene.isZoneSelectable = false
  486. this.view._needDraw = true;
  487. },
  488. // 查看未关联的业务空间--flag--查看-or-选择
  489. lookUnrelatBSpace(flag) {
  490. this.isAction = flag;
  491. let arr = this.scene.getSelectedSpaces();
  492. if (flag && !arr.length) {
  493. this.$message.warning('请至少选择一个空间');
  494. return;
  495. }
  496. this.$refs.unRelateBSP.showDialog(this.buildFloor);
  497. },
  498. // 取消(所有取消公用)
  499. cancelGraphy() {
  500. this.init(2);
  501. this.$emit('copyID', '')
  502. },
  503. // 批量创建业务空间弹窗
  504. handleCommand(command) {
  505. this.groupCreateDialogVis = true;
  506. },
  507. // 创建弹窗确认
  508. confirm() {
  509. if (this.groupCreateType == 1) {
  510. this.groupCreateBSpace()
  511. } else if (this.groupCreateType == 2) {
  512. this.type = 5;
  513. this.config.isEdit = true;
  514. this.config.groupSelect = true;
  515. this.config.divide = false;
  516. this.groupCreateDialogVis = false;
  517. // 清空选中空间
  518. this.scene.clearSpaceSelection();
  519. // 设置空间可选
  520. this.scene.isSpaceSelectable = true;
  521. // 设置业务空间不可选
  522. this.scene.isZoneSelectable = false;
  523. }
  524. },
  525. // 根据未关联元空间批量创建业务空间
  526. groupCreateBSpace() {
  527. let text = []
  528. let Spaces = this.allUnRelatISP.map(t => {
  529. if (t.outline) {
  530. let area = 0;
  531. if (t.outline[0]) {
  532. area = this.getarea(t.outline[0]);
  533. if (t.outline.length > 1) {
  534. for (let i = 1; i < t.outline.length; i++) {
  535. let temp = this.getarea(t.outline[i]);
  536. area = area - temp
  537. }
  538. }
  539. area = (area / 1000000).toFixed(2);
  540. if (area < (this.areaValue / 100)) {
  541. return undefined
  542. }
  543. } else {
  544. return undefined;
  545. }
  546. text.push(t.localName || t.name)
  547. let obj = {
  548. ispaceId: t.id,
  549. localName: t.localName || t.name,
  550. outline: [t.outline],
  551. buildingId: this.buildFloor[0],
  552. floorId: this.buildFloor[1],
  553. height: this.spaceHeight
  554. }
  555. if (t.customParam) {
  556. obj.customParam = t.customParam
  557. }
  558. // 2020-12-20 演示用 -start
  559. if (t.infos) {
  560. obj.infos = {}
  561. if (t.infos.roomLocalFuncTypeID) {
  562. obj.infos.roomLocalFuncTypeID = t.infos.roomLocalFuncTypeID
  563. }
  564. if (t.infos.roomLocalFuncTypeName) {
  565. obj.infos.roomLocalFuncTypeName = t.infos.roomLocalFuncTypeName
  566. }
  567. }
  568. // 2020-12-20 演示用 -end
  569. return obj;
  570. } else {
  571. return undefined
  572. }
  573. }).filter(item => item);
  574. if (Spaces.length) {
  575. this.$confirm(
  576. "<p>确定根据未关联业务空间的空间批量创建业务空间</p>" +
  577. "<p>涉及的空间:</p>" +
  578. "<p style='line-height:20px;max-height:60px;overflow-y:auto;'>" +
  579. text.toString() +
  580. "</p>",
  581. "提示", {
  582. dangerouslyUseHTMLString: true,
  583. confirmButtonText: "确定",
  584. cancelButtonText: "取消",
  585. type: "warning"
  586. }
  587. ).then(() => {
  588. this.groupCreateDialogVis = false;
  589. this.canvasLoading = true;
  590. this.groupCreateBSP(Spaces)
  591. }).catch(() => {
  592. this.$message({
  593. type: "info",
  594. message: "已取消批量创建"
  595. });
  596. });
  597. } else {
  598. this.$message('没有未关联的空间')
  599. }
  600. },
  601. // 创建新的业务空间
  602. createNewZone() {
  603. let arr = this.scene.getSelectedSpaces();
  604. if (arr.length) {
  605. let tempArr = [];
  606. arr.map(t => {
  607. if (this.BIMIDToSIName[t.data.sourceId]) {
  608. tempArr.push(this.BIMIDToSIName[t.data.sourceId]);
  609. }
  610. })
  611. this.$refs.createBSP.showDialog(tempArr.toString());
  612. } else {
  613. this.$message.warning('请至少选择一个空间');
  614. }
  615. },
  616. // 根据图创建新的业务空间-弹窗返回确认创建
  617. createRoom(val) {
  618. const zoneObj = { outline: [], height: 0 }, IspaceIdList = [];
  619. let spaces = {};
  620. try {
  621. if (this.scene.cutItem || this.scene.sceneMark) {
  622. // 如果有划分,求交集
  623. // 格式为Poly(先与业务空间求差集)
  624. const obj = this.scene.getZoneDifference(true);
  625. // 差集与楼层平面图或用户划分区域求交集
  626. spaces = this.scene.getPloyIntersect(obj)
  627. } else {
  628. // 格式为SPoint[]
  629. spaces = this.scene.getZoneDifference();
  630. }
  631. for (let key in spaces) {
  632. spaces[key] = spaces[key].map(t => {
  633. let temp = t.map(item => {
  634. return {
  635. X: 1 * item.x.toFixed(2),
  636. Y: -item.y.toFixed(2),
  637. Z: 0
  638. }
  639. })
  640. return temp;
  641. })
  642. let newarr = this.makeMaxAreaFirst(spaces[key])
  643. zoneObj.outline.push(newarr);
  644. let curISP = this.sourceIdToISP[key];
  645. if (curISP) {
  646. curISP && IspaceIdList.push(curISP.id);
  647. zoneObj.height = this.spaceHeight;
  648. // 2020-12-20 演示用 -start
  649. console.log(curISP);
  650. if (curISP.infos) {
  651. zoneObj.infos = {}
  652. if (curISP.infos.roomLocalFuncTypeID) {
  653. zoneObj.infos.roomLocalFuncTypeID = curISP.infos.roomLocalFuncTypeID
  654. }
  655. if (curISP.infos.roomLocalFuncTypeName) {
  656. zoneObj.infos.roomLocalFuncTypeName = curISP.infos.roomLocalFuncTypeName
  657. }
  658. }
  659. // 2020-12-20 演示用 -end
  660. }
  661. }
  662. } catch (err) {
  663. console.log(err)
  664. let selectSpaces = this.scene.getSelectedSpaces();
  665. selectSpaces.map(t => {
  666. zoneObj.outline.push(t.data.outLine);
  667. let key = t.data.sourceId;
  668. let curISP = this.sourceIdToISP[key];
  669. if (curISP) {
  670. IspaceIdList.push(curISP.id);
  671. zoneObj.height = this.spaceHeight;
  672. // 2020-12-20 演示用 -start
  673. console.log(curISP);
  674. if (curISP.infos) {
  675. zoneObj.infos = {}
  676. if (curISP.infos.roomLocalFuncTypeID) {
  677. zoneObj.infos.roomLocalFuncTypeID = curISP.infos.roomLocalFuncTypeID
  678. }
  679. if (curISP.infos.roomLocalFuncTypeName) {
  680. zoneObj.infos.roomLocalFuncTypeName = curISP.infos.roomLocalFuncTypeName
  681. }
  682. }
  683. // 2020-12-20 演示用 -end
  684. }
  685. })
  686. // 如果有划分,求交集
  687. if (this.scene.cutItem || this.scene.sceneMark) {
  688. zoneObj.outline = [];
  689. let arr = this.scene.getIntersect();
  690. arr.map(t => {
  691. let temp = t.map(item => {
  692. return {
  693. X: 1 * item.x,
  694. Y: -item.y,
  695. Z: 0
  696. }
  697. })
  698. zoneObj.outline.push([temp]);
  699. })
  700. }
  701. }
  702. // 至此
  703. if (!zoneObj.outline.length) {
  704. zoneObj.outline = null;
  705. }
  706. zoneObj.localName = val;
  707. zoneObj.buildingId = this.buildFloor[0];
  708. zoneObj.floorId = this.buildFloor[1];
  709. this.createSingleBSP(zoneObj, IspaceIdList)
  710. },
  711. // 根据图从未关联平面图的业务空间中选择--按钮返回关联信号
  712. createFromUnrelated(zoneObj) {
  713. zoneObj.outline = [];
  714. zoneObj.height = 0;
  715. let spaces = {}, IspaceIdList = [];
  716. try {
  717. if (this.scene.cutItem || this.scene.sceneMark) {
  718. // 如果有划分,求交集
  719. // 格式为Poly(先与业务空间求差集)
  720. const obj = this.scene.getZoneDifference(true);
  721. // 差集与楼层平面图或用户划分区域求交集
  722. spaces = this.scene.getPloyIntersect(obj)
  723. } else {
  724. // 格式为SPoint[]
  725. spaces = this.scene.getZoneDifference();
  726. }
  727. for (let key in spaces) {
  728. spaces[key] = spaces[key].map(t => {
  729. let temp = t.map(item => {
  730. return {
  731. X: 1 * item.x.toFixed(2),
  732. Y: -item.y.toFixed(2),
  733. Z: 0
  734. }
  735. })
  736. return temp;
  737. })
  738. let newarr = this.makeMaxAreaFirst(spaces[key])
  739. zoneObj.outline.push(newarr);
  740. let curISP = this.sourceIdToISP[key];
  741. if (curISP) {
  742. curISP && IspaceIdList.push(curISP.id);
  743. zoneObj.height = this.spaceHeight;
  744. // 2020-12-20 演示用 -start
  745. if (curISP.infos) {
  746. zoneObj.infos = {}
  747. if (curISP.infos.roomLocalFuncTypeID) {
  748. zoneObj.infos.roomLocalFuncTypeID = curISP.infos.roomLocalFuncTypeID
  749. }
  750. if (curISP.infos.roomLocalFuncTypeName) {
  751. zoneObj.infos.roomLocalFuncTypeName = curISP.infos.roomLocalFuncTypeName
  752. }
  753. }
  754. // 2020-12-20 演示用 -end
  755. }
  756. }
  757. } catch (err) {
  758. console.log(err);
  759. let selectSpaces = this.scene.getSelectedSpaces();
  760. selectSpaces.map(t => {
  761. zoneObj.outline.push(t.data.outLine);
  762. let key = t.data.sourceId;
  763. let curISP = this.sourceIdToISP[key];
  764. if (curISP) {
  765. curISP && IspaceIdList.push(curISP.id);
  766. zoneObj.height = this.spaceHeight;
  767. // 2020-12-20 演示用 -start
  768. if (curISP.infos) {
  769. zoneObj.infos = {}
  770. if (curISP.infos.roomLocalFuncTypeID) {
  771. zoneObj.infos.roomLocalFuncTypeID = curISP.infos.roomLocalFuncTypeID
  772. }
  773. if (curISP.infos.roomLocalFuncTypeName) {
  774. zoneObj.infos.roomLocalFuncTypeName = curISP.infos.roomLocalFuncTypeName
  775. }
  776. }
  777. // 2020-12-20 演示用 -end
  778. }
  779. })
  780. // 如果有划分,求交集
  781. if (this.scene.cutItem || this.scene.sceneMark) {
  782. zoneObj.outline = [];
  783. let arr = this.scene.getIntersect();
  784. arr.map(t => {
  785. let temp = t.map(item => {
  786. return {
  787. X: 1 * item.x,
  788. Y: -item.y,
  789. Z: 0
  790. }
  791. })
  792. zoneObj.outline.push([temp]);
  793. })
  794. }
  795. }
  796. if (!zoneObj.outline.length) {
  797. zoneObj.outline = null;
  798. }
  799. this.updateBSPOutline(zoneObj, IspaceIdList)
  800. },
  801. // 编辑空间详情
  802. editeSpaceDetail() {
  803. let item = this.curZoneItem.data;
  804. let query = {
  805. RoomID: item.RoomID,
  806. zone: this.tab.code,
  807. isMyTab: 1,
  808. buildFloorSelectd: this.buildFloor
  809. }
  810. this.$router.push({
  811. path: "/ledger/spaceDetail",
  812. query: query
  813. })
  814. },
  815. // 重新划分业务空间
  816. refactorBSP() {
  817. this.config.isEdit = true;
  818. this.config.groupSelect = false;
  819. this.config.divide = true;
  820. this.type = 4;
  821. // 设置空间可选
  822. this.scene.isSpaceSelectable = true;
  823. // 将已关联的设置不可选,并将当前选的隐藏
  824. this.scene.isZoneSelectable = false;
  825. this.curZoneItem.visible = false;
  826. // 将当前业务空间的每个元素添加到场景中并选中
  827. this.scene.addAllLikeSpace(this.curZoneItem.data.OutLine);
  828. },
  829. // 确认业务空间
  830. confirmZoneSpace() {
  831. let ObjectType = this.tab.code == 'OtherZone' ? this.OtherValue : this.tab.code;
  832. let space = {
  833. id: this.curZoneItem.data.RoomID,
  834. state: 0,
  835. classCode: ObjectType
  836. }
  837. let pa = {
  838. content: [space],
  839. projection: ['state']
  840. }
  841. zoneUpdate(pa, res => {
  842. this.curZoneItem.isInfected = false;
  843. this.$emit('updateState');
  844. this.$message.success('更新成功');
  845. })
  846. },
  847. // 保存并确认业务空间
  848. confirmAndSave() {
  849. this.confirmAndSaveFlag = true;
  850. this.saveRefactorBSP();
  851. },
  852. // 重新划分--保存
  853. saveRefactorBSP() {
  854. let selectSpace = this.scene.getSelectedSpaces();
  855. let selectLikeSpace = this.scene.getSelectedLikeSpace();
  856. //更新业务空间
  857. let zoneObj = { outline: [], height: 0, state: this.confirmAndSaveFlag ? 0 : this.curZoneItem.isInfected ? 1 : 0 }, IspaceIdList = [];
  858. // 空间
  859. selectSpace.map(t => {
  860. zoneObj.outline.push(t.data.OutLine);
  861. if (this.BIMIDToSID[t.data.SourceId]) {
  862. IspaceIdList.push(this.BIMIDToSID[t.data.SourceId]);
  863. }
  864. // 2020-12-20 演示用 -start
  865. if (this.sourceIdToISP[t.data.sourceId] && this.sourceIdToISP[t.data.sourceId].infos) {
  866. zoneObj.infos = {};
  867. if (this.sourceIdToISP[t.data.sourceId].infos.roomLocalFuncTypeID) {
  868. zoneObj.infos.roomLocalFuncTypeID = this.sourceIdToISP[t.data.sourceId].infos.roomLocalFuncTypeID
  869. }
  870. if (this.sourceIdToISP[t.data.sourceId].infos.roomLocalFuncTypeName) {
  871. zoneObj.infos.roomLocalFuncTypeName = this.sourceIdToISP[t.data.sourceId].infos.roomLocalFuncTypeName
  872. }
  873. }
  874. // 2020-12-20 演示用 -end
  875. zoneObj.height = this.spaceHeight
  876. })
  877. // 类空间
  878. selectLikeSpace.map(t => {
  879. zoneObj.outline.push(t.data);
  880. })
  881. // 如果有划分,求交集
  882. if (this.scene.cutItem || this.scene.sceneMark) {
  883. zoneObj.outline = [];
  884. let spaceIntersect = this.scene.getIntersect();
  885. spaceIntersect.map(t => {
  886. let temp = t.map(item => {
  887. return {
  888. X: item.x,
  889. Y: -item.y,
  890. Z: 0
  891. }
  892. })
  893. zoneObj.outline.push([temp]);
  894. })
  895. let likeSpaceIntersect = this.scene.getLikeIntersect();
  896. likeSpaceIntersect.map(t => {
  897. let temp = t.map(item => {
  898. return {
  899. X: item.x,
  900. Y: -item.y,
  901. Z: 0
  902. }
  903. })
  904. zoneObj.outline.push([temp]);
  905. })
  906. }
  907. if (!zoneObj.outline.length) {
  908. zoneObj.outline = null;
  909. }
  910. zoneObj.id = this.curZoneItem.data.RoomID;
  911. this.updateBSPOutline(zoneObj, IspaceIdList)
  912. },
  913. // 根据图批量创建所选业务空间
  914. groupCreateZone() {
  915. let arr = this.scene.getSelectedSpaces();
  916. let createSpaces = [], spaces = {};
  917. try {
  918. if (this.scene.cutItem || this.scene.sceneMark) {
  919. // 如果有划分,求交集
  920. // 格式为Poly(先与业务空间求差集)
  921. const obj = this.scene.getZoneDifference(true);
  922. // 差集与楼层平面图或用户划分区域求交集
  923. spaces = this.scene.getPloyIntersect(obj)
  924. } else {
  925. // 格式为SPoint[]
  926. spaces = this.scene.getZoneDifference();
  927. }
  928. for (let key in spaces) {
  929. let zoneObj = { outline: [], height: 0 }
  930. spaces[key] = spaces[key].map(t => {
  931. let temp = t.map(item => {
  932. return {
  933. X: 1 * item.x.toFixed(2),
  934. Y: -item.y.toFixed(2),
  935. Z: 0
  936. }
  937. })
  938. return temp;
  939. })
  940. let newarr = this.makeMaxAreaFirst(spaces[key])
  941. zoneObj.outline.push(newarr);
  942. if (!zoneObj.outline.length) {
  943. continue
  944. }
  945. //计算面积
  946. let area = 0, line = zoneObj.outline;
  947. for (let i = 0; i < line.length; i++) {
  948. for (let j = 0; j < line[i].length; j++) {
  949. if (j == 0) {
  950. area += this.getarea(line[i][0]);
  951. } else {
  952. area -= this.getarea(line[i][j]);
  953. }
  954. }
  955. }
  956. area = (area / 1000000).toFixed(2);
  957. if (area < (this.areaValue / 100)) {
  958. continue
  959. }
  960. //生成空间对象
  961. let curISP = this.sourceIdToISP[key];
  962. if (curISP) {
  963. zoneObj.height = this.spaceHeight;
  964. // zoneObj.Height = zoneObj.Height == 0 ? curISP.Height : zoneObj.Height > curISP.Height ? curISP.Height : zoneObj.Height;
  965. zoneObj.ispaceId = curISP.id;
  966. zoneObj.localName = curISP.localName || '';
  967. // 2020-12-20 演示用 -start
  968. if (curISP.infos) {
  969. zoneObj.infos = {}
  970. if (curISP.infos.roomLocalFuncTypeID) {
  971. zoneObj.infos.roomLocalFuncTypeID = curISP.infos.roomLocalFuncTypeID
  972. }
  973. if (curISP.infos.roomLocalFuncTypeName) {
  974. zoneObj.infos.roomLocalFuncTypeName = curISP.infos.roomLocalFuncTypeName
  975. }
  976. }
  977. // 2020-12-20 演示用 -end
  978. }
  979. zoneObj.buildingId = this.buildFloor[0];
  980. zoneObj.floorId = this.buildFloor[1];
  981. createSpaces.push(zoneObj);
  982. }
  983. } catch (err) {
  984. console.log(err)
  985. let createSpaces = [];
  986. // 如果有划分,求交集
  987. if (this.scene.cutItem || this.scene.sceneMark) {
  988. let outlines = this.scene.getIntersectInSpace();
  989. for (let k in outlines) {
  990. outlines[k] = outlines[k].map(t => {
  991. t = t.map(item => {
  992. item = item.map(j => {
  993. return { X: j.x, Y: -j.y, Z: 0 }
  994. })
  995. return item
  996. })
  997. return t;
  998. })
  999. }
  1000. createSpaces = arr.map(t => {
  1001. let line = outlines[t.data.SourceId];
  1002. if (!line || !line.length) {
  1003. return undefined
  1004. } else {
  1005. let area = 0;
  1006. for (let i = 0; i < line.length; i++) {
  1007. for (let j = 0; j < line[i].length; j++) {
  1008. if (j == 0) {
  1009. area += this.getarea(line[i][0]);
  1010. } else {
  1011. area -= this.getarea(line[i][j]);
  1012. }
  1013. }
  1014. }
  1015. area = (area / 1000000).toFixed(2);
  1016. if (area < (this.areaValue / 100)) {
  1017. return undefined;
  1018. }
  1019. }
  1020. return {
  1021. ispaceId: this.BIMIDToSID[t.data.sourceId],
  1022. localName: this.BIMIDToSIName[t.data.sourceId] || '',
  1023. outline: line,
  1024. buildingId: this.buildFloor[0],
  1025. floorId: this.buildFloor[1],
  1026. height: this.spaceHeight,
  1027. // 2020-12-20 演示用 -start
  1028. infos: {
  1029. roomLocalFuncTypeID: this.sourceIdToISP[t.data.sourceId].infos ? this.sourceIdToISP[t.data.sourceId].infos.roomLocalFuncTypeID || '' : '',
  1030. roomLocalFuncTypeName: this.sourceIdToISP[t.data.sourceId].infos ? this.sourceIdToISP[t.data.sourceId].infos.roomLocalFuncTypeName || '' : ''
  1031. }
  1032. // 2020-12-20 演示用 -end
  1033. }
  1034. }).filter(item => item)
  1035. } else {
  1036. createSpaces = arr.map(t => {
  1037. let line = t.data.outLine;
  1038. if (!line || !line.length) {
  1039. return undefined
  1040. } else {
  1041. let area = this.getarea(line[0]);
  1042. if (line.length > 1) {
  1043. for (let i = 1; i < line.length; i++) {
  1044. area -= this.getarea(line[i]);
  1045. }
  1046. }
  1047. area = (area / 1000000).toFixed(2);
  1048. if (area < (this.areaValue / 100)) {
  1049. return undefined;
  1050. }
  1051. }
  1052. return {
  1053. ispaceId: this.BIMIDToSID[t.data.sourceId],
  1054. localName: this.BIMIDToSIName[t.data.sourceId] || '',
  1055. outline: [line],
  1056. buildingId: this.buildFloor[0],
  1057. floorId: this.buildFloor[1],
  1058. height: this.spaceHeight,
  1059. // 2020-12-20 演示用 -start
  1060. infos: {
  1061. roomLocalFuncTypeID: this.sourceIdToISP[t.data.sourceId].infos ? this.sourceIdToISP[t.data.sourceId].infos.roomLocalFuncTypeID || '' : '',
  1062. roomLocalFuncTypeName: this.sourceIdToISP[t.data.sourceId].infos ? this.sourceIdToISP[t.data.sourceId].infos.roomLocalFuncTypeName || '' : ''
  1063. }
  1064. // 2020-12-20 演示用 -end
  1065. }
  1066. }).filter(item => item);
  1067. }
  1068. }
  1069. if (createSpaces.length) {
  1070. this.canvasLoading = true;
  1071. this.groupCreateBSP(createSpaces)
  1072. } else {
  1073. this.$message.warning('未选择空间');
  1074. }
  1075. },
  1076. // 更新业务空间和元空间的关系
  1077. relationInBSPandISP(SpaceId, IspaceIdList) {
  1078. let ObjectType = this.tab.code == 'OtherZone' ? this.OtherValue : this.tab.code;
  1079. let pa = {
  1080. data: { spaceId: SpaceId, ispaceIdList: IspaceIdList },
  1081. type: ObjectType
  1082. }
  1083. createRelateInZoneAndISp(pa, res => {
  1084. this.$message.success('创建成功');
  1085. this.init(2);
  1086. if (this.confirmAndSaveFlag) {
  1087. this.confirmAndSaveFlag = false;
  1088. this.curZoneItem.selected = false;
  1089. this.curZoneItem = {};
  1090. this.$emit('updateState');
  1091. }
  1092. })
  1093. },
  1094. // 批量更新业务空间和元空间的关系
  1095. groupCreRelaZoneAndISp(Spaces) {
  1096. Spaces = Spaces.filter(item => item.ispaceId);
  1097. let ObjectType = this.tab.code == 'OtherZone' ? this.OtherValue : this.tab.code;
  1098. if (Spaces.length) {
  1099. let param = {
  1100. data: {
  1101. content: Spaces
  1102. },
  1103. type: ObjectType
  1104. }
  1105. groupCreRelaZoneAndISp(param, res => {
  1106. this.$message.success('创建成功')
  1107. this.canvasLoading = false;
  1108. this.init(2)
  1109. })
  1110. } else {
  1111. this.$message.success('创建成功')
  1112. this.canvasLoading = false;
  1113. this.init(2)
  1114. }
  1115. },
  1116. // 批量创建
  1117. groupCreateBSP(spaces) {
  1118. let ObjectType = this.tab.code == 'OtherZone' ? this.OtherValue : this.tab.code;
  1119. spaces = spaces.map(t => {
  1120. t.classCode = ObjectType;
  1121. t.bimLocation = this.getAverageVal(t.outline);
  1122. return t;
  1123. })
  1124. let pa = {
  1125. content: spaces,
  1126. }
  1127. zoneCreate(pa, res => {
  1128. res.entityList.map(t => {
  1129. spaces = spaces.map(item => {
  1130. if (t.localName == item.localName) {
  1131. item.spaceId = t.id
  1132. }
  1133. return item;
  1134. })
  1135. })
  1136. this.groupCreRelaZoneAndISp(spaces)
  1137. })
  1138. },
  1139. // 单个创建
  1140. createSingleBSP(space, IspaceIdList) {
  1141. let ObjectType = this.tab.code == 'OtherZone' ? this.OtherValue : this.tab.code;
  1142. space.bimLocation = space.outline ? this.getAverageVal(space.outline) : null;
  1143. space.classCode = ObjectType;
  1144. let pa = {
  1145. content: [space]
  1146. }
  1147. zoneCreate(pa, res => {
  1148. this.relationInBSPandISP(res.entityList[0].id, IspaceIdList)
  1149. })
  1150. },
  1151. // 更新业务空间区域
  1152. updateBSPOutline(zoneObj, IspaceIdList) {
  1153. let ObjectType = this.tab.code == 'OtherZone' ? this.OtherValue : this.tab.code;
  1154. zoneObj.bimLocation = zoneObj.outline ? this.getAverageVal(zoneObj.outline) : null;
  1155. zoneObj.classCode = ObjectType;
  1156. zoneObj.buildingId = this.buildFloor[0];
  1157. zoneObj.floorId = this.buildFloor[1];
  1158. let pa = {
  1159. content: [zoneObj],
  1160. projection: ['bimLocation', 'classCode', 'outline', 'height', 'buildingId', 'floorId']
  1161. }
  1162. zoneUpdate(pa, res => {
  1163. zoneUpdateOutline(pa, res => { console.log(res) })
  1164. this.updateZoneBF(zoneObj, IspaceIdList);
  1165. })
  1166. },
  1167. // 从未关联平面图的业务空间中选择时更新业务空间建筑楼层
  1168. updateZoneBF(zoneObj, IspaceIdList) {
  1169. let pa = [{
  1170. type: zoneObj.classCode,
  1171. spaceId: zoneObj.id,
  1172. id: zoneObj.floorId,
  1173. }]
  1174. handleZoneUpdateBd(pa, res => {
  1175. this.relationInBSPandISP(zoneObj.id, IspaceIdList)
  1176. })
  1177. },
  1178. // 查询未关联平面图的业务空间(项目下+当前分区)
  1179. getBSPunrelaISP() {
  1180. let ObjectType = this.tab.code == 'OtherZone' ? this.OtherValue : this.tab.code;
  1181. let pa = {
  1182. Filters: `outline isNull;classCode="${ObjectType}"`
  1183. }
  1184. zoneCount(pa, res => {
  1185. this.num = res.count;
  1186. })
  1187. },
  1188. // 计算平均值 作为业务空间BIMLocation
  1189. getAverageVal(Outline) {
  1190. let X = 0, Y = 0, Z = 0, len = 0;
  1191. Outline.map(t => {
  1192. if (t[0]) {
  1193. t[0].map(item => {
  1194. X += item.X;
  1195. Y += item.Y;
  1196. Z += item.Z;
  1197. })
  1198. len += t[0].length
  1199. }
  1200. })
  1201. X = (X / len).toFixed(2);
  1202. Y = (Y / len).toFixed(2);
  1203. Z = (Z / len).toFixed(2);
  1204. return `${X},${Y},${Z}`
  1205. },
  1206. // 计算面积
  1207. getarea(arr) {
  1208. if (!arr.length) {
  1209. return 0;
  1210. }
  1211. let sum = 0;
  1212. let n = arr.length;
  1213. arr[n] = arr[0];
  1214. for (let i = 1; i <= n; i++) {
  1215. sum += arr[i].X * arr[i - 1].Y - arr[i - 1].X * arr[i].Y;
  1216. }
  1217. return Math.abs(sum / 2)
  1218. },
  1219. // canvas 获取焦点
  1220. focus() {
  1221. document.getElementById(`floorCanvas`).focus()
  1222. },
  1223. // 清除canvas
  1224. clearGraphy() {
  1225. if (this.view) {
  1226. this.view.scene = null;
  1227. return
  1228. }
  1229. this.view = new FloorView('floorCanvas')
  1230. },
  1231. // 工具栏操作
  1232. // 吸附
  1233. changeAbsorb(isAbsorbing) {
  1234. this.scene.isAbsorbing = isAbsorbing;
  1235. },
  1236. // 框选
  1237. groupSelect() {
  1238. this.scene.isRectSelection = 1;
  1239. },
  1240. // 适配底图到窗口
  1241. fit() {
  1242. if (this.scene.sceneMark) {
  1243. this.view.fitItemToView([this.scene.sceneMark])
  1244. return
  1245. }
  1246. this.view.fitSceneToView()
  1247. },
  1248. // 保存为png
  1249. savePng() {
  1250. this.view.saveImage(`${this.projectName}-${this.buildFloorName}.png`, 'png');
  1251. },
  1252. // 保存为svg
  1253. saveSvg() {
  1254. this.view.saveSceneSvg(`${this.projectName}-${this.buildFloorName}.svg`, 6400, 4800);
  1255. },
  1256. // 保存json
  1257. saveJson() {
  1258. this.view.saveFloorJson(`${this.projectName}-${this.buildFloorName}.json`)
  1259. },
  1260. // 切割划分
  1261. divide() {
  1262. this.scene.isCutting = true;
  1263. },
  1264. // 清除切割划分
  1265. clearDivide() {
  1266. this.scene.clearCut();
  1267. },
  1268. // 撤销
  1269. undo() { },
  1270. // 反撤销
  1271. redo() { },
  1272. // 缩放
  1273. scale(val) {
  1274. if (!this.view) {
  1275. return;
  1276. }
  1277. let scale = this.view.scale;
  1278. this.view.scaleByPoint(val / scale, this.canvasWidth / 2, this.canvasHeight / 2);
  1279. },
  1280. // 给定多个轮廓线的数据,计算得到面积最大值,并把它放置数组第一项,并将第一项顺时针处理,第一项以后的每一项做逆时针处理
  1281. // list {XYZ}[][]
  1282. makeMaxAreaFirst(list) {
  1283. let arr = [], area = 0;
  1284. for (let i = 0; i < list.length; i++) {
  1285. let temp = this.getarea(list[i])
  1286. if (temp > area) {
  1287. arr.unshift(list[i])
  1288. } else {
  1289. arr.push(list[i])
  1290. }
  1291. }
  1292. arr.map((t, i) => {
  1293. if (!i) {
  1294. if (this.clockDir(t) > 0) {
  1295. return t
  1296. } else {
  1297. return t.reverse()
  1298. }
  1299. } else {
  1300. if (this.clockDir(t) > 0) {
  1301. return t.reverse()
  1302. } else {
  1303. return t
  1304. }
  1305. }
  1306. })
  1307. return arr;
  1308. },
  1309. // 数组为顺时针or逆时针 顺时针非负 逆时针为 负
  1310. clockDir(pointList) {
  1311. let l = pointList.length - 1
  1312. if (pointList[0].x == pointList[l].x && pointList[0].y == pointList[l].y) {
  1313. pointList.splice(l, 1);
  1314. }
  1315. if (pointList.length < 3) {
  1316. return 0;
  1317. }
  1318. let index = 0;
  1319. let len = pointList.length;
  1320. for (let i = 1; i < len; i++) {
  1321. if (pointList[i].X > pointList[index].X) {
  1322. index = i;
  1323. }
  1324. }
  1325. let p1 = pointList[index == 0 ? len - 1 : index - 1];
  1326. let p2 = pointList[index];
  1327. let p3 = pointList[(index + 1) % len];
  1328. return (p2.X - p1.X) * (p3.Y - p2.Y) - (p2.Y - p1.Y) * (p3.X - p2.X);
  1329. }
  1330. },
  1331. filters: {
  1332. cutString: function (str, len) {
  1333. //length属性读出来的汉字长度为1
  1334. if (!!str && typeof str == "string" && str.length > len) {
  1335. return str.substring(0, len) + "...";
  1336. } else {
  1337. return str || "--";
  1338. }
  1339. }
  1340. },
  1341. watch: {
  1342. projectId() {
  1343. this.FloorMap = '';
  1344. this.tab = {};
  1345. },
  1346. "view.scale": {
  1347. handler(n) {
  1348. if (this.$refs.canvasFun) {
  1349. let s = n * 10 / this.view.minScale
  1350. this.$refs.canvasFun.sliderVal = s > 1000 ? 1000 : s;
  1351. }
  1352. }
  1353. },
  1354. "scene.isRectSelection": {
  1355. handler(n) {
  1356. if (!n) {
  1357. this.$refs.canvasFun.active = '';
  1358. }
  1359. }
  1360. },
  1361. "scene.isCutting": {
  1362. handler(n) {
  1363. if (!n) {
  1364. this.$refs.canvasFun.active = '';
  1365. this.$refs.canvasFun.isSwitch = false;
  1366. this.scene.isAbsorbing = false;
  1367. }
  1368. }
  1369. },
  1370. }
  1371. }
  1372. </script>
  1373. <style lang="less" scoped>
  1374. #graphy {
  1375. position: relative;
  1376. width: 100%;
  1377. box-sizing: border-box;
  1378. padding: 0 10px 10px;
  1379. height: calc(100% - 56px);
  1380. .canvas-box {
  1381. width: 100%;
  1382. height: 100%;
  1383. }
  1384. .buttons-box {
  1385. position: absolute;
  1386. top: 0;
  1387. left: 0;
  1388. padding: 0 10px;
  1389. width: 100%;
  1390. z-index: 999;
  1391. & > div {
  1392. float: left;
  1393. }
  1394. /deep/ .el-autocomplete {
  1395. display: inline-block;
  1396. width: 320px;
  1397. margin-right: 10px;
  1398. }
  1399. .button-group button,
  1400. .button-group .el-dropdown {
  1401. display: block;
  1402. float: left;
  1403. }
  1404. .my-autocomplete {
  1405. li {
  1406. line-height: normal;
  1407. padding: 7px;
  1408. .name {
  1409. text-overflow: ellipsis;
  1410. overflow: hidden;
  1411. }
  1412. .addr {
  1413. font-size: 12px;
  1414. color: #b4b4b4;
  1415. }
  1416. .highlighted .addr {
  1417. color: #ddd;
  1418. }
  1419. }
  1420. }
  1421. }
  1422. .canvas-actions-box {
  1423. position: absolute;
  1424. bottom: 60px;
  1425. left: 50%;
  1426. transform: translateX(-50%);
  1427. z-index: 99;
  1428. }
  1429. #autoRelate {
  1430. /deep/ .el-slider__marks-text:nth-child(2) {
  1431. width: 25px;
  1432. }
  1433. }
  1434. }
  1435. </style>