wbTable.vue 6.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183
  1. <!-- 维保 -->
  2. <template>
  3. <div class='wb-list'>
  4. <div class='eq-list-top'>
  5. <el-input
  6. placeholder='请按照设备名称、设备编号搜索'
  7. size='small'
  8. @change='getList'
  9. prefix-icon='el-icon-search'
  10. v-model='keyword'
  11. style='width:192px;margin-right:12px'
  12. ></el-input>
  13. <el-input
  14. placeholder='请按照重要事项记录、描述搜索'
  15. size='small'
  16. @change='getList'
  17. prefix-icon='el-icon-search'
  18. v-model='keyword'
  19. style='width:192px;margin-right:12px'
  20. ></el-input>
  21. <el-input
  22. placeholder='请按照任务编号搜索'
  23. size='small'
  24. @change='getList'
  25. prefix-icon='el-icon-search'
  26. v-model='keyword'
  27. style='width:192px;margin-right:12px'
  28. ></el-input>
  29. <el-date-picker
  30. size='small'
  31. v-model='reportdate'
  32. type='date'
  33. placeholder='选择填报时间'
  34. @change='getList'
  35. style='width:180px;margin-right:12px'
  36. ></el-date-picker>
  37. <el-date-picker size='small' v-model='sjjssj' type='date' placeholder='选择验收时间' @change='getList' style='width:180px;margin-right:12px'></el-date-picker>
  38. <Select @change='getList' v-model='ischange' width='120' tipPlace='top' caption='是否更换配件信息 :' :selectdata='changeOption'></Select>
  39. </div>
  40. <el-table :data='tableData' style='width: 100%'>
  41. <el-table-column type='index' label='序号' width='80'></el-table-column>
  42. <el-table-column prop='sbjc' label='设备名称' width='160' show-overflow-tooltip resizable>
  43. <template slot-scope='{row}'>{{row.sbjc || '--'}}</template>
  44. </el-table-column>
  45. <el-table-column prop='sbjbm' label='设备编码' show-overflow-tooltip resizable>
  46. <template slot-scope='{row}'>{{row.sbjbm || '--'}}</template>
  47. </el-table-column>
  48. <el-table-column prop='matters' label='重要事项记录' width='240' show-overflow-tooltip resizable>
  49. <template slot-scope='{row}'>{{row.matters || '--'}}</template>
  50. </el-table-column>
  51. <el-table-column prop='description' label='描述' width='200' show-overflow-tooltip resizable>
  52. <template slot-scope='{row}'>{{row.description || '--'}}</template>
  53. </el-table-column>
  54. <el-table-column label='更换配件信息' align='center'>
  55. <el-table-column prop='ischangepj' label='是/否更换' width='120'>
  56. <template slot-scope='{row}'>{{row.ischangepj || '--'}}</template>
  57. </el-table-column>
  58. <el-table-column prop='model' label='配件名称型号' width='120' show-overflow-tooltip resizable>
  59. <template slot-scope='{row}'>{{row.model || '--'}}</template>
  60. </el-table-column>
  61. <el-table-column prop='sl' label='数量'>
  62. <template slot-scope='{row}'>{{row.sl || '--'}}</template>
  63. </el-table-column>
  64. <el-table-column prop='cost' label='费用(万元)' width='120'>
  65. <template slot-scope='{row}'>{{row.cost || '--'}}</template>
  66. </el-table-column>
  67. <el-table-column prop='source' label='费用出处' width='120' show-overflow-tooltip resizable>
  68. <template slot-scope='{row}'>{{row.source || '--'}}</template>
  69. </el-table-column>
  70. </el-table-column>
  71. <el-table-column prop='brand' label='现场照片'>
  72. <template slot-scope='{row}'>{{row.brand || '--'}}</template>
  73. </el-table-column>
  74. <el-table-column prop='reportdate' label='填报时间'>
  75. <template slot-scope='{row}'>{{row.reportdate || '--'}}</template>
  76. </el-table-column>
  77. <el-table-column prop='sjjssj' label='验收时间'>
  78. <template slot-scope='{row}'>{{row.sjjssj || '--'}}</template>
  79. </el-table-column>
  80. <el-table-column prop='wonum' label='工单编号' show-overflow-tooltip resizable>
  81. <template slot-scope='{row}'>{{row.wonum || '--'}}</template>
  82. </el-table-column>
  83. </el-table>
  84. <div class='foot'>
  85. <el-pagination
  86. background
  87. layout='prev, pager, next'
  88. :total='total'
  89. :page-size='size'
  90. @prev-click='pageChanged'
  91. @next-click='pageChanged'
  92. @current-change='pageChanged'
  93. ></el-pagination>
  94. </div>
  95. </div>
  96. </template>
  97. <script>
  98. import { queryWbsms } from '@/api/equipmentList.js'
  99. import { mapGetters } from 'vuex'
  100. import Select from '@/components/Select/Select.vue'
  101. export default {
  102. components: { Select },
  103. data() {
  104. return {
  105. tableData: [],
  106. total: 0,
  107. currentPage: 1,
  108. size: 10,
  109. sjjssj: '',
  110. reportdate: '',
  111. ischange: '',
  112. changeOption: [
  113. {
  114. id: '1',
  115. name: '是'
  116. },
  117. {
  118. id: ' 0',
  119. name: '否'
  120. }
  121. ],
  122. keyword: ''
  123. }
  124. },
  125. props: ['smsxt', 'major'],
  126. computed: {
  127. ...mapGetters(['floorSelect'])
  128. },
  129. methods: {
  130. onSearch() {},
  131. pageChanged(page, size) {
  132. this.currentPage = page
  133. this.size = size
  134. this.getList()
  135. },
  136. getList() {
  137. let getParams = {
  138. data: {
  139. smsxt: this.smsxt,
  140. // tab: this.major,
  141. // plazaId: this.$store.state.plazaId,
  142. plazaId: '1000287',
  143. page: this.currentPage,
  144. size: this.size
  145. }
  146. }
  147. queryWbsms(getParams).then(res => {
  148. this.tableData = res.data || []
  149. this.total = res.count
  150. })
  151. }
  152. },
  153. watch: {
  154. smsxt(newV, oldV) {
  155. if (newV !== oldV) {
  156. this.getList()
  157. }
  158. }
  159. },
  160. mounted() {
  161. this.getList()
  162. }
  163. }
  164. </script>
  165. <style lang="less" scoped>
  166. .wb-list {
  167. .eq-list-top {
  168. display: flex;
  169. margin-bottom: 12px;
  170. }
  171. td {
  172. overflow: hidden;
  173. text-overflow: ellipsis;
  174. white-space: nowrap;
  175. }
  176. .foot {
  177. height: 32px;
  178. display: flex;
  179. justify-content: flex-end;
  180. margin-top: 28px;
  181. }
  182. }
  183. </style>