index.vue 20 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555
  1. <template>
  2. <div class="report-index">
  3. <div class="statistics">
  4. <div class="building">
  5. <p>建筑模型文件夹:<b>{{ModelFileCount}}</b></p>
  6. </div>
  7. <div class="includefloor">
  8. <p>包含楼层模型文件:<b>{{modelFloorCount}}</b></p>
  9. </div>
  10. <div class="problematic">
  11. <p>检查出问题的楼层模型文件:<b>{{problemCount}}</b></p>
  12. </div>
  13. </div>
  14. <div class="main-content">
  15. <div class="tab-box">
  16. <el-tabs v-model="activeTab" type='card' @tab-click="getData">
  17. <template v-for="(item,index) in tableList">
  18. <el-tab-pane :name="item.Code" :key="index" :label="item.Name">
  19. <span slot="label">
  20. <i :class="item.flag?'msg-icon el-icon-success success-color':'msg-icon el-icon-error error-color'" style="font-size:14px;"></i>
  21. <span>{{ item.Name }}</span>
  22. </span>
  23. </el-tab-pane>
  24. </template>
  25. </el-tabs>
  26. </div>
  27. <div class="content-box">
  28. <div class="button">
  29. <el-button @click="del" :disabled="toBeDelCount?false:true" :title="toBeDelCount ? '':'没有待删除的设备'">需从模型中删除的设备
  30. </el-button>
  31. <el-button @click="supplement" :disabled="toBeSuppCount?false:true" :title="toBeSuppCount ? '':'没有待补充的设备'">模型待补充的设备
  32. </el-button>
  33. <el-button :loading="load" @click='getExportReport'>导出模型问题报告</el-button>
  34. </div>
  35. <div class="table"
  36. :style="tableList&&tableList.length?'width: 100%;height: calc(100% - 47px)':'width: 100%;height: calc(100% - 10px)'">
  37. <el-table
  38. ref="multipleTable"
  39. :data="tableData"
  40. stripe
  41. height="100%"
  42. :header-cell-style="headerStyle"
  43. v-loading='loading'
  44. :row-class-name="tableRowClassName"
  45. :cell-style="cellStyle"
  46. >
  47. <el-table-column prop="FloorName" label="模型楼层" fixed width="150"></el-table-column>
  48. <el-table-column prop="functionNo" label="待删除设备数量" fixed width="150">
  49. <template slot-scope="scope">
  50. <el-badge :value="scope.row.toBeDel" class="item" :type='scope.row.toBeDel?"danger":"success"'>
  51. </el-badge>
  52. </template>
  53. </el-table-column>
  54. <el-table-column prop="toBeSupplement" label="待补充设备数量" fixed width="150">
  55. <template slot-scope="scope">
  56. <el-badge :value="scope.row.toBeSupplement" class="item"
  57. :type='scope.row.toBeSupplement?"danger":"success"'>
  58. </el-badge>
  59. </template>
  60. </el-table-column>
  61. <el-table-column prop="questionItem" label="有问题的检查项" fixed width="150" style="border-right:1px solid red">
  62. <template slot-scope="scope">
  63. <el-badge :value="scope.row.questionItem" class="item" :type='scope.row.questionItem?"warning":"success"'>
  64. </el-badge>
  65. </template>
  66. </el-table-column>
  67. <el-table-column prop="ElementRangeCheck" label='构件范围检查' width="200">
  68. <template slot-scope="scope">
  69. <el-badge :value="scope.row.ElementRangeCheck" class="item" type='danger'
  70. v-if="scope.row.ElementRangeCheck"/>
  71. <i class="msg-icon el-icon-success success-color1" style="font-size:20px;"
  72. v-if="scope.row.ElementRangeCheck<=0"></i>
  73. </template>
  74. </el-table-column>
  75. <el-table-column prop="FamilyNameCheck" label='设备族编码检查' width="200">
  76. <template slot-scope="scope">
  77. <el-badge :value="scope.row.FamilyNameCheck" class="item" type='danger'
  78. v-if="scope.row.FamilyNameCheck"/>
  79. <i class="msg-icon el-icon-success success-color1" style="font-size:20px;"
  80. v-if="scope.row.FamilyNameCheck<=0"></i>
  81. </template>
  82. </el-table-column>
  83. <el-table-column prop="EquipPartLocationCheck" label='部件所在位置检查' width="200">
  84. <template slot-scope="scope">
  85. <el-badge :value="scope.row.EquipPartLocationCheck" class="item" type='danger'
  86. v-if="scope.row.EquipPartLocationCheck"/>
  87. <i class="msg-icon el-icon-success success-color1" style="font-size:20px;"
  88. v-if="scope.row.EquipPartLocationCheck<=0"></i>
  89. </template>
  90. </el-table-column>
  91. <el-table-column prop="ColumnCheck" label='柱边界检查' width="200">
  92. <template slot-scope="scope">
  93. <el-badge :value="scope.row.ColumnCheck" class="item" type='danger' v-if="scope.row.ColumnCheck"/>
  94. <i class="msg-icon el-icon-success success-color1" style="font-size:20px;"
  95. v-if="scope.row.ColumnCheck<=0"></i>
  96. </template>
  97. </el-table-column>
  98. <el-table-column prop="ConnectorCheck" label='连接件检查' width="200">
  99. <template slot-scope="scope">
  100. <el-badge :value="scope.row.ConnectorCheck" class="item" type='danger' v-if="scope.row.ConnectorCheck"/>
  101. <i class="msg-icon el-icon-success success-color1" style="font-size:20px;"
  102. v-if="scope.row.ConnectorCheck<=0"></i>
  103. </template>
  104. </el-table-column>
  105. <el-table-column prop="SystemNameCheck" label='系统类型名称检查' width="200">
  106. <template slot-scope="scope">
  107. <el-badge :value="scope.row.SystemNameCheck" class="item" type='danger'
  108. v-if="scope.row.SystemNameCheck"/>
  109. <i class="msg-icon el-icon-success success-color1" style="font-size:20px;"
  110. v-if="scope.row.SystemNameCheck<=0"></i>
  111. </template>
  112. </el-table-column>
  113. <el-table-column prop="EquipInSpaceCheck" label='未在空间中的设备' width="200">
  114. <template slot-scope="scope">
  115. <el-badge :value="scope.row.EquipInSpaceCheck" class="item" type='danger'
  116. v-if="scope.row.EquipInSpaceCheck"/>
  117. <i class="msg-icon el-icon-success success-color1" style="font-size:20px;"
  118. v-if="scope.row.EquipInSpaceCheck<=0"></i>
  119. </template>
  120. </el-table-column>
  121. <el-table-column prop="PipeCheck" label='管段检查' width="200">
  122. <template slot-scope="scope">
  123. <el-badge :value="scope.row.PipeCheck" class="item" type='danger' v-if="scope.row.PipeCheck"/>
  124. <i class="msg-icon el-icon-success success-color1" style="font-size:20px;"
  125. v-if="scope.row.PipeCheck<=0"></i>
  126. </template>
  127. </el-table-column>
  128. <el-table-column prop="SystemReferEquipCheck" label='管网及相关设备检查' width="200">
  129. <template slot-scope="scope">
  130. <el-badge :type='scope.row.SystemReferEquipCheck?"danger":"success"' :value="scope.row.SystemReferEquipCheck"
  131. class="item"
  132. v-if="scope.row.SystemReferEquipCheck"/>
  133. <i class="msg-icon el-icon-success success-color1" style="font-size:20px;"
  134. v-if="scope.row.SystemReferEquipCheck<=0"></i>
  135. </template>
  136. </el-table-column>
  137. <el-table-column prop="ParameterIntegrityCheck" label='Revit族参数完整性检查' width="200">
  138. <template slot-scope="scope">
  139. <el-badge :value="scope.row.ParameterIntegrityCheck" class="item" type='danger'
  140. v-if="scope.row.ParameterIntegrityCheck"/>
  141. <i class="msg-icon el-icon-success success-color1" style="font-size:20px;"
  142. v-if="scope.row.ParameterIntegrityCheck<=0"></i>
  143. </template>
  144. </el-table-column>
  145. <el-table-column prop="XyzOverlapCheck" label='xyz坐标重叠检查' width="200">
  146. <template slot-scope="scope">
  147. <el-badge :value="scope.row.XyzOverlapCheck" class="item" type='danger'
  148. v-if="scope.row.XyzOverlapCheck"/>
  149. <i class="msg-icon el-icon-success success-color1" style="font-size:20px;"
  150. v-if="scope.row.XyzOverlapCheck<=0"></i>
  151. </template>
  152. </el-table-column>
  153. <template slot="empty">
  154. <div style="height: 60%;transform: translate(-40%,50%);">
  155. <i class="icon-wushuju iconfont"></i>
  156. 暂无数据
  157. </div>
  158. </template>
  159. </el-table>
  160. <el-pagination class="right" @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="page.pageNumber"
  161. :page-sizes="page.pageSizes" :page-size="page.pageSize" layout="total, sizes, prev, pager, next, jumper" :total="page.total">
  162. </el-pagination>
  163. </div>
  164. </div>
  165. </div>
  166. </div>
  167. </template>
  168. <script>
  169. import { mapGetters } from "vuex";
  170. import dasBoard from "@/views/dasboard/index";
  171. import { queryFloorList, queryLostReportList, queryModel, queryReportList } from "@/api/model/report.js";
  172. import { getSupplement, getToBeDelEquip } from "@/api/scan/request.js";
  173. import axios from 'axios'
  174. export default {
  175. components: {
  176. dasBoard
  177. },
  178. data() {
  179. return {
  180. params: null,
  181. ModelFileCount: null,// 模型文件夹数量
  182. modelFloorCount: null,// 包含楼层模型文件数量
  183. problemCount: 0,// 检查出问题的楼层模型文件数量
  184. tableList: [], // tab数据
  185. tableData: [],// 列表数据
  186. activeTab: '', // tab当前选中项
  187. headerStyle: { // 列表样式
  188. backgroundColor: '#e1e4e5',
  189. color: '#2b2b2b',
  190. lineHeight: '30px'
  191. },
  192. page: {
  193. pageSize: 50,
  194. pageSizes: [10, 20, 50, 100],
  195. pageNumber: 1,
  196. total: 0
  197. },
  198. loading: false,
  199. load: false,
  200. floorIconType: null,
  201. toBeSuppCount: 0,
  202. toBeDelCount: 0
  203. }
  204. },
  205. mounted() {
  206. },
  207. created() {
  208. this.params = {
  209. Orders: "Name asc"
  210. }
  211. this.getModelFileCount();
  212. this.getModelFloorCount();
  213. },
  214. computed: {
  215. ...mapGetters('layout', ['projectId'])
  216. },
  217. methods: {
  218. cellStyle({row, column, rowIndex, columnIndex}) {
  219. if (column.label !== '模型楼层' && column.label !== '待删除设备数量' && column.label !== '待补充设备数量' && column.label !== '有问题的检查项') {
  220. return {
  221. background: '#f3f3f3',
  222. lineHeight: '30px'
  223. }
  224. }
  225. },
  226. getModelFloorCount() {// 获取楼层模型文件数量,计算出检查出问题的模型文件
  227. let promise1 = new Promise(resolve => {
  228. queryFloorList({Filters:"Status=4",pageNumber:1,PageSize: 500}, res => {
  229. resolve(res);
  230. })
  231. })
  232. Promise.all([promise1]).then(response => {
  233. this.problemCount = 0;
  234. let res = response[0];
  235. this.modelFloorCount = res.Total;
  236. this.modelFloor = res.Content;
  237. this.getModelFileIcon();
  238. this.modelFloor.forEach(item => {
  239. if (!item.DataCheckResult) {
  240. this.problemCount++;
  241. }
  242. })
  243. })
  244. },
  245. getModelFileIcon() {// 计算文件夹的图标
  246. this.tableList.forEach(item => {
  247. this.modelFloor.forEach(it => {
  248. if (item.Code === it.FolderId) {
  249. if (!it.DataCheckResult) {
  250. item.flag = false;
  251. }
  252. }
  253. })
  254. })
  255. },
  256. getData(tab) {// 切换tab时执行
  257. this.getModelFloor();
  258. },
  259. getModelFileCount() {// 获取项目下所有模型文件夹
  260. queryModel(this.params, res => {
  261. this.ModelFileCount = res.Content.length;
  262. this.tableList = res.Content;
  263. if (this.tableList && this.tableList.length) {
  264. this.tableList.forEach((item, index) => {
  265. item.Code = item.Id;
  266. })
  267. this.activeTab = this.tableList[0].Code;// 默认选中第一个模型文件夹
  268. }
  269. this.getModelFloor();
  270. });
  271. },
  272. getModelFloor() {// 获取当前楼层下的模型楼层和各个检查项的数据
  273. let params = {
  274. ProjectId: this.projectId,
  275. Id: `${this.activeTab}`,
  276. PageNumber: this.page.pageNumber,
  277. PageSize: this.page.pageSize
  278. }
  279. queryReportList(params, res => {
  280. this.FloorName = res.Content;
  281. this.tableData = [];
  282. if (this.FloorName && this.FloorName.length) {
  283. this.loading = true;
  284. let i = 0;
  285. this.FloorName.forEach(item => {
  286. item.questionItem = 0;
  287. for (let key in item) {
  288. if (item[key] > 0 && key !== "FloorName" && key !== "questionItem") {
  289. i += 1;
  290. item.questionItem += 1;
  291. }
  292. }
  293. })
  294. this.floorIconType = i;
  295. }
  296. this.getLostModelFloor();
  297. })
  298. },
  299. getLostModelFloor() {// 获取缺失楼层
  300. let params = {
  301. ProjectId: this.projectId,
  302. Filters: `FolderId='${this.activeTab}';Status=4`
  303. }
  304. queryLostReportList(params, res => {
  305. this.LostFloorName = res.Content;
  306. this.getToBeCount();
  307. })
  308. },
  309. getToBeCount() {// 根据模型ID获取待删除数量和待补充数量
  310. let equipComDelList = [],
  311. toBeAdded = []
  312. this.equipComDelList = [];
  313. this.LostFloorName.forEach(item => {
  314. if (item.CurrentModelId) {
  315. equipComDelList.push({
  316. modelId: item.CurrentModelId
  317. });
  318. this.equipComDelList.push(item.CurrentModelId)
  319. } else {
  320. item.flag = 'lost';
  321. item.FloorName = `${item.Note + item.FloorName}`
  322. }
  323. if (item.Id) {
  324. toBeAdded.push({
  325. modelId: item.Id
  326. })
  327. }
  328. })
  329. let params = {
  330. projectId: this.projectId,
  331. data: equipComDelList
  332. }, paramsToBe = {
  333. projectId: this.projectId,
  334. data: toBeAdded
  335. }
  336. let promise1 = new Promise(resolve => {
  337. getToBeDelEquip(params, res => {
  338. resolve(res);
  339. })
  340. })
  341. let promise2 = new Promise(resolve => {
  342. getSupplement(paramsToBe, res => {
  343. resolve(res);
  344. })
  345. })
  346. Promise.all([promise1, promise2]).then(response => {
  347. let res = response[0];
  348. let res1 = response[1];
  349. this.toBeDelCount = 0;
  350. this.toBeSuppCount = 0;
  351. res.content.forEach(item => {
  352. if (item.count > 0) {
  353. this.toBeDelCount += 1;
  354. }
  355. this.LostFloorName.forEach(it => {
  356. if (item.modelId === it.CurrentModelId) {
  357. it.toBeDel = item.count;
  358. }
  359. })
  360. })
  361. res1.content.forEach(item => {
  362. if (item.count > 0) {
  363. this.toBeSuppCount += 1;
  364. }
  365. this.LostFloorName.forEach(it => {
  366. if (item.modelId === it.Id) {
  367. it.toBeSupplement = item.count;
  368. }
  369. })
  370. })
  371. if (this.LostFloorName && this.LostFloorName.length) {
  372. this.LostFloorName.forEach(item => {
  373. this.FloorName.forEach(it => {
  374. if (item.FloorName === it.FloorName) {
  375. for (let key in it) {
  376. item[key] = it[key];
  377. }
  378. }
  379. })
  380. })
  381. this.tableData = this.LostFloorName;
  382. } else {
  383. this.tableData = [];
  384. }
  385. this.page.total = this.tableData.length;
  386. this.loading = false;
  387. })
  388. },
  389. del() {// 点击需从模型中删除的设备
  390. let equipComDelList = encodeURIComponent(JSON.stringify(this.equipComDelList));
  391. let jumpRouter = this.$router.resolve({ path: '/model/report/deleted', query: { equipComDelList: equipComDelList } })
  392. window.open(jumpRouter.href, '_blank')
  393. },
  394. supplement() {// 点击模型待补充的设备
  395. let equipComDelList = encodeURIComponent(JSON.stringify(this.equipComDelList));
  396. let jumpRouter = this.$router.resolve({ path: '/model/report/supplement', query: { equipComDelList: equipComDelList } })
  397. window.open(jumpRouter.href, '_blank')
  398. },
  399. getExportReport() {// 导出模型问题报告
  400. let that = this;
  401. this.load = true;
  402. axios({
  403. method: 'post',
  404. url: `/modelapi/report/non-blocking`,
  405. data: {
  406. Id: this.activeTab,
  407. ProjectId: this.projectId
  408. },
  409. headers: {
  410. ProjectId: this.projectId
  411. },
  412. responseType: 'blob'
  413. }).then(function (res) {
  414. if (res.data.type == 'application/vnd.ms-excel') {
  415. let blob = new Blob([res.data], { type: 'application/vnd.ms-excel;charset=utf-8' });
  416. let fileName = decodeURI(res.headers['content-disposition']);
  417. if (fileName)
  418. fileName = fileName.substring(fileName.indexOf('=') + 1);
  419. if ('download' in document.createElement('a')) { // 非IE下载
  420. const elink = document.createElement('a')
  421. elink.download = fileName
  422. elink.style.display = 'none'
  423. elink.href = URL.createObjectURL(blob)
  424. document.body.appendChild(elink)
  425. elink.click()
  426. URL.revokeObjectURL(elink.href) // 释放URL 对象
  427. document.body.removeChild(elink)
  428. that.load = false;
  429. } else { // IE10+下载
  430. navigator.msSaveBlob(blob, fileName)
  431. that.load = false;
  432. }
  433. } else {
  434. let reader = new FileReader()
  435. reader.onload = e => {
  436. if (e.target.readyState === 2) {
  437. let res = {}
  438. that.load = false;
  439. res = JSON.parse(e.target.result)
  440. that.$message.error(res.Message);
  441. }
  442. }
  443. reader.readAsText(res.data)
  444. }
  445. })
  446. },
  447. tableRowClassName({ row, rowIndex, column }) {// 设置缺失楼层所在行的背景色
  448. if (row.flag && row.flag === 'lost') {
  449. return 'warning-row';
  450. }
  451. },
  452. handleSizeChange(val) {// 切换每页显示数量
  453. this.page.pageSize = val;
  454. this.getModelFloor();
  455. },
  456. handleCurrentChange(val) {// 切换页码
  457. this.page.pageNumber = val;
  458. this.getModelFloor();
  459. }
  460. },
  461. watch: {
  462. projectId() {
  463. this.getModelFileCount();
  464. this.getModelFloorCount();
  465. }
  466. }
  467. }
  468. </script>
  469. <style lang="less" scoped>
  470. .report-index {
  471. .statistics {
  472. display: flex;
  473. width: 100%;
  474. padding: 20px 0;
  475. background: white;
  476. margin-bottom: 10px;
  477. div {
  478. flex: 1;
  479. text-align: center;
  480. p {
  481. b {
  482. font-size: 20px;
  483. margin-left: 20px;
  484. }
  485. }
  486. }
  487. }
  488. .main-content {
  489. width: 100%;
  490. height: calc(100% - 90px);
  491. background: white;
  492. .content-box {
  493. height: calc(100% - 105px);
  494. .table {
  495. margin-top: 15px;
  496. }
  497. }
  498. }
  499. .button {
  500. padding-left: 10px;
  501. }
  502. .success-color {
  503. color: #67c23a;
  504. }
  505. .error-color {
  506. color: #f56c6c;
  507. }
  508. .success-color1 {
  509. color: #67c23a60;
  510. }
  511. .error-color1 {
  512. color: #f56c6c60;
  513. }
  514. /deep/ .el-table_1_column_4 {
  515. border-right: 1px solid #e2e2e2 !important;
  516. }
  517. /deep/ .el-table {
  518. .el-table__fixed {
  519. height: auto !important;
  520. bottom: 17px;
  521. }
  522. }
  523. /deep/ .el-table__row.warning-row {
  524. td {
  525. background: #f9f9f9 !important;
  526. }
  527. }
  528. /deep/ .el-badge__content--danger {
  529. background-color: #F56C6C60;
  530. }
  531. }
  532. </style>