deviceTable.vue 6.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187
  1. <template>
  2. <div class="table-container">
  3. <div class="table-list" :style="tableData && tableData.length?'height:calc(100% - 50px);':'height:100%;'">
  4. <el-table :data="tableData" style="width: 100%" height="100%" v-loading="loading" :header-cell-style="headerStyle">
  5. <el-table-column label="所属建筑楼层" show-overflow-tooltip min-width="100">
  6. <template slot-scope="scope">
  7. <div>{{scope.row.build}}-{{scope.row.floor}}</div>
  8. </template>
  9. </el-table-column>
  10. <el-table-column :label="`${inSpaceType}本地名称`" show-overflow-tooltip min-width="100">
  11. <template slot-scope="scope">
  12. <div>
  13. {{scope.row.EquipLocalName}}
  14. <el-badge :value="scope.row.partsNum" class="item" type="warning"></el-badge>
  15. </div>
  16. </template>
  17. </el-table-column>
  18. <el-table-column prop="EquipLocalID" :label="`${inSpaceType}本地编码`" show-overflow-tooltip min-width="100"></el-table-column>
  19. <el-table-column prop="EquipCategory.EquipName" :label="`${inSpaceType}类型`" show-overflow-tooltip min-width="100"></el-table-column>
  20. <el-table-column prop="CADID" label="安装位置" show-overflow-tooltip min-width="100"></el-table-column>
  21. <el-table-column prop="taskType" label="任务执行情况" show-overflow-tooltip min-width="100"></el-table-column>
  22. <el-table-column prop="action" label="操作" min-width="100">
  23. <template slot-scope="scope">
  24. <i v-if="scope.row.taskType == '待验证' || scope.row.taskType == '未找到'" title="查看详情" class="iconfont icon-xiangqing table-button" @click="handleDetail(scope.$index, scope.row)"></i>
  25. <i v-if="scope.row.taskType == '未找到'" title="重新生成任务" class="iconfont icon-Update table-button" @click="handleRegenerate(scope.$index, scope.row)"></i>
  26. <i v-if="scope.row.taskType == '待验证'" title="删除任务" class="iconfont icon-delete table-button" @click="handleDelete(scope.$index, scope.row)"></i>
  27. <i v-if="scope.row.taskType == '未找到'" title="认可此任务执行情况" class="iconfont icon-lijiqueren table-button" @click="handleConfirm(scope.$index, scope.row)"></i>
  28. </template>
  29. </el-table-column>
  30. <template slot="empty">
  31. <div style="height: 60%;transform: translateY(50%);">
  32. <i class="icon-wushuju iconfont"></i>
  33. 数据暂无
  34. </div>
  35. </template>
  36. </el-table>
  37. </div>
  38. <el-pagination class="right" v-show="tableData && tableData.length" @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="page.pageNumber"
  39. :page-sizes="page.pageSizes" :page-size="page.pageSize" layout="total, sizes, prev, pager, next, jumper" :total="page.total">
  40. </el-pagination>
  41. <el-drawer title="任务详情" :visible.sync="drawer" direction="rtl" size="600px">
  42. <span>我来啦!</span>
  43. </el-drawer>
  44. </div>
  45. </template>
  46. <script>
  47. import { } from "@/api/scan/request";
  48. import { mapGetters } from "vuex";
  49. export default {
  50. components: {
  51. },
  52. computed: {
  53. ...mapGetters("layout", ["projectId"])
  54. },
  55. props: {
  56. paramsData: Object,
  57. },
  58. data() {
  59. return {
  60. inSpaceType: '设备',
  61. loading: false, // loading
  62. drawer: false, // 详情侧弹窗
  63. page: {
  64. pageSize: 50,
  65. pageSizes: [10, 20, 50, 100],
  66. pageNumber: 1,
  67. total: 0
  68. },
  69. tableData: [{
  70. build: 'A栋',
  71. floor: '3F',
  72. EquipLocalName: '风机',
  73. partsNum: 8,
  74. EquipLocalID: 'AS123124343',
  75. EquipCategory: {
  76. EquipName: '风机'
  77. },
  78. CADID: '6486416846184879',
  79. taskType: '未找到'
  80. }], //列表数据
  81. headerStyle: {
  82. backgroundColor: '#e1e4e5',
  83. color: '#2b2b2b',
  84. lineHeight: '30px'
  85. }, // 列表样式
  86. };
  87. },
  88. created() {
  89. // this.getTableData()
  90. },
  91. methods: {
  92. // 获取列表数据
  93. getTableData() {
  94. let params = {
  95. Filters: `ProjectId='${this.projectId}'`,
  96. Cascade: [
  97. {
  98. Name: 'equipmentList',
  99. Cascade: [{ Name: 'equipCategory' }]
  100. }
  101. ],
  102. Orders: "createTime desc, EquipID asc",
  103. PageNumber: this.page.pageNumber,
  104. PageSize: this.page.pageSize
  105. }
  106. if (this.paramsData.buildfloor[0] == "noKnow") {
  107. param.Filters += `buildingId isNull`
  108. } else if (this.paramsData.buildfloor[0] && this.paramsData.buildfloor[0] != "all") {
  109. param.Filters += `buildingId='${this.paramsData.buildfloor[0]}'`
  110. if (this.paramsData.buildfloor[1] == "noKnow") {
  111. param.Filters += `;floorId isNull`
  112. } else if (this.paramsData.buildfloor[1] && this.paramsData.buildfloor[1] != "all") {
  113. param.Filters += `;floorId='${this.paramsData.buildfloor[1]}'`
  114. }
  115. }
  116. if(this.paramsData.taskState){
  117. params.Filters += `;TaskState='${this.paramsData.taskState}'`
  118. }
  119. if(this.paramsData.family){
  120. params.Filters += `;Family='${this.paramsData.family}'`
  121. }
  122. queryCenoteTableData(params, res => {
  123. this.tableData = res.Content[0].EquipmentList || []
  124. })
  125. },
  126. // 删除关系
  127. handleDelete(index, row) {
  128. this.$confirm("确认删除该任务?", "提示", {
  129. confirmButtonText: '确定',
  130. cancelButtonText: '取消',
  131. type: 'warning'
  132. }).then(() => {
  133. // let params = {
  134. // EquipId: row.EquipID,
  135. // ShaftId: this.params.ShaftID
  136. // }
  137. // this.deleteEqInSh(params);
  138. }).catch(() => {
  139. this.$message("取消删除")
  140. })
  141. },
  142. // 删除设备所在竖井关系
  143. deleteEqInSh(params) {
  144. // eqinshUnlink(params, res => {
  145. // this.$message.success('删除成功')
  146. // this.getTableData()
  147. // })
  148. },
  149. //查看任务详情
  150. handleDetail() {
  151. this.drawer = true
  152. },
  153. // 改变pagesize
  154. handleSizeChange(pageSize) {
  155. this.page.pageSize = pageSize;
  156. this.getTableData()
  157. },
  158. // 改变pageno
  159. handleCurrentChange(pageNo) {
  160. this.page.pageNumber = pageNo;
  161. this.getTableData()
  162. }
  163. },
  164. watch: {
  165. paramsData: {
  166. handler(newName, oldName) {
  167. this.page.pageNumber = 1
  168. this.getTableData()
  169. },
  170. immediate: true,
  171. deep: true
  172. }
  173. }
  174. };
  175. </script>
  176. <style lang="less" scoped>
  177. .table-container {
  178. height: 100%;
  179. background: #fff;
  180. .table-button{
  181. cursor: pointer;
  182. margin-right: 15px;
  183. }
  184. }
  185. </style>