replaceTable.vue 7.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216
  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>
  8. {{scope.row.building?scope.row.building.localName?scope.row.building.localName:'':''}} -
  9. {{scope.row.floor?scope.row.floor.localName?scope.row.floor.localName:'':''}}
  10. </div>
  11. </template>
  12. </el-table-column>
  13. <el-table-column :label="`${inSpaceType}本地名称`" show-overflow-tooltip min-width="100">
  14. <template slot-scope="scope">
  15. <div>
  16. {{scope.row.localName || '--'}}
  17. </div>
  18. </template>
  19. </el-table-column>
  20. <el-table-column :label="`${inSpaceType}本地编码`" show-overflow-tooltip min-width="100">
  21. <template slot-scope="scope">
  22. <div>
  23. {{scope.row.localId || '--'}}
  24. </div>
  25. </template>
  26. </el-table-column>
  27. <el-table-column prop="equipFamily.familyName" label="设备族" show-overflow-tooltip min-width="100"></el-table-column>
  28. <el-table-column prop="installLocation" label="安装位置" show-overflow-tooltip min-width="100"></el-table-column>
  29. <el-table-column prop="taskState" label="任务执行情况" show-overflow-tooltip min-width="100"></el-table-column>
  30. <!-- <el-table-column prop="action" label="操作" min-width="100">
  31. <template slot-scope="scope">
  32. <i v-if="scope.row.TaskState == '待验证' || scope.row.TaskState == '未找到'" title="查看详情" class="iconfont icon-xiangqing table-button" @click="handleDetail(scope.$index, scope.row)"></i>
  33. <i v-if="scope.row.TaskState == '未找到'" title="重新生成任务" class="iconfont icon-Update table-button" @click="handleRegenerate(scope.$index, scope.row)"></i>
  34. <i v-if="scope.row.TaskState == '待验证'" title="删除任务" class="iconfont icon-delete table-button" @click="handleDelete(scope.$index, scope.row)"></i>
  35. <i v-if="scope.row.TaskState == '未找到'" title="认可此任务执行情况" class="iconfont icon-lijiqueren table-button" @click="handleConfirm(scope.$index, scope.row)"></i>
  36. </template>
  37. </el-table-column> -->
  38. <template slot="empty">
  39. <div style="height: 60%;transform: translateY(50%);">
  40. <i class="icon-wushuju iconfont"></i>
  41. 暂无数据
  42. </div>
  43. </template>
  44. </el-table>
  45. </div>
  46. <el-pagination class="right" v-show="tableData && tableData.length" @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="page.pageNumber"
  47. :page-sizes="page.pageSizes" :page-size="page.pageSize" layout="total, sizes, prev, pager, next, jumper" :total="page.total">
  48. </el-pagination>
  49. <el-drawer title="任务详情" :visible.sync="drawer" direction="rtl" size="600px">
  50. <assets-detail :id="detailId"></assets-detail>
  51. </el-drawer>
  52. </div>
  53. </template>
  54. <script>
  55. import { queryAssetsTask, deleteAssetsTask } from "@/api/data_admin/buildTaskApi"
  56. import tools from "@/utils/tools"
  57. import { mapGetters } from "vuex"
  58. import assetsDetail from '../detail/assetsDetail'
  59. export default {
  60. components: {
  61. assetsDetail
  62. },
  63. computed: {
  64. ...mapGetters("layout", ["projectId"])
  65. },
  66. props: {
  67. paramsData: Object,
  68. },
  69. data() {
  70. return {
  71. inSpaceType: '资产',
  72. loading: false, // loading
  73. drawer: false, // 详情侧弹窗
  74. detailId: '',
  75. tableData: [], //列表数据
  76. page: {
  77. pageSize: 50,
  78. pageSizes: [10, 20, 50, 100],
  79. pageNumber: 1,
  80. total: 0
  81. },
  82. taskTypeMap: {//待撕码,待换码
  83. '-5': '已撕码',
  84. '3': '待撕码',
  85. '2': '待换码',
  86. '0': '正常贴码'
  87. },
  88. taskStateMap: {
  89. '-1': '未找到',
  90. '0': '已完成',
  91. '1': '待验证'
  92. },
  93. headerStyle: {
  94. backgroundColor: '#e1e4e5',
  95. color: '#2b2b2b',
  96. lineHeight: '30px'
  97. }, // 列表样式
  98. };
  99. },
  100. created() {
  101. this.getTableData()
  102. },
  103. methods: {
  104. // 获取列表数据
  105. getTableData() {
  106. this.loading = true
  107. let params = {
  108. filters: `projectId='${this.projectId}';taskType in ['2']`,
  109. cascade: [
  110. {
  111. name: 'equipFamily'
  112. }, {
  113. name: 'building',
  114. }, {
  115. name: 'floor',
  116. }
  117. ],
  118. orders: "createTime desc, id asc",
  119. pageNumber: this.page.pageNumber,
  120. pageSize: this.page.pageSize
  121. }
  122. // if (this.paramsData.buildfloor[0] == "noKnow") {
  123. // params.Filters += `;BuildingId isNull`
  124. // } else if (this.paramsData.buildfloor[0] && this.paramsData.buildfloor[0] != "all") {
  125. // params.Filters += `;BuildingId='${this.paramsData.buildfloor[0]}'`
  126. // if (this.paramsData.buildfloor[1] == "noKnow") {
  127. // params.Filters += `;FloorId isNull`
  128. // } else if (this.paramsData.buildfloor[1] && this.paramsData.buildfloor[1] != "all") {
  129. // params.Filters += `;FloorId='${this.paramsData.buildfloor[1]}'`
  130. // }
  131. // }
  132. // if(this.paramsData.taskState !== ''){
  133. // params.Filters += `;TaskState=${this.paramsData.taskState}`
  134. // }
  135. // if(this.paramsData.family){
  136. // params.Filters += `;Family='${this.paramsData.family}'`
  137. // }
  138. queryAssetsTask(params, res => {
  139. this.loading = false
  140. this.page.total = res.total;
  141. this.tableData = res.content.map(item => {
  142. item.taskState = this.taskStateMap[item.taskState]
  143. item.taskType = this.taskTypeMap[item.taskType]
  144. return item
  145. })
  146. })
  147. },
  148. // 删除关系
  149. handleDelete(index, row) {
  150. this.$confirm("确认删除该任务?", "提示", {
  151. confirmButtonText: '确定',
  152. cancelButtonText: '取消',
  153. type: 'warning'
  154. }).then(() => {
  155. let params = [{id: row.id}]
  156. deleteAssetsTask(params, res => {
  157. this.$message.success('删除成功')
  158. this.getTableData()
  159. })
  160. }).catch(() => {
  161. this.$message("取消删除")
  162. })
  163. },
  164. //查看任务详情
  165. handleDetail() {
  166. this.drawer = true
  167. this.detailId = row.TaskId
  168. },
  169. // 改变pagesize
  170. handleSizeChange(pageSize) {
  171. this.page.pageNumber = 1
  172. this.page.pageSize = pageSize;
  173. this.getTableData()
  174. },
  175. // 改变pageno
  176. handleCurrentChange(pageNo) {
  177. this.page.pageNumber = pageNo;
  178. this.getTableData()
  179. }
  180. },
  181. watch: {
  182. paramsData: {
  183. handler(newName, oldName) {
  184. if(!tools.isSimilarly(newName, oldName)){
  185. this.page.pageNumber = 1
  186. this.getTableData()
  187. }
  188. },
  189. immediate: true,
  190. deep: true
  191. },
  192. projectId() {
  193. this.page.pageNumber = 1
  194. this.getTableData()
  195. }
  196. }
  197. };
  198. </script>
  199. <style lang="less" scoped>
  200. /deep/ .el-drawer__body {
  201. height: calc(100% - 80px);
  202. border-top: 1px solid #c9c9c9;
  203. }
  204. /deep/ .el-drawer__header {
  205. margin-bottom: 12px;
  206. }
  207. .table-container {
  208. height: 100%;
  209. background: #fff;
  210. .table-button{
  211. cursor: pointer;
  212. margin-right: 15px;
  213. }
  214. }
  215. </style>