index.vue 17 KB

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