room5.vue 8.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186
  1. <template>
  2. <div class='compute-item'>
  3. <div ref='tableBox5' class='compute-table'>
  4. <el-table
  5. :border='true'
  6. v-loading='loading'
  7. :max-height='tableMaxHeight'
  8. :data='table5'
  9. style='width: 100%'
  10. @row-click='innerTable'
  11. :header-cell-style='{background:"rgba(245,246,247,1)",fontFamily:"MicrosoftYaHei",color:"rgba(100,108,115,1)",lineHeight:"16px",fontSize:"12px"}'
  12. >
  13. <el-table-column type='index' label='序号' width='60' :index='indexMethod'></el-table-column>
  14. <el-table-column prop label='设备名称' show-overflow-tooltip resizable min-width='150'>
  15. <template slot-scope='{row}'>{{row.sbmc||'--'}}</template>
  16. </el-table-column>
  17. <el-table-column prop label='设备内码' :show-overflow-tooltip='true' width='80'>
  18. <template slot-scope='{row}'>{{row.assetnum||'--'}}</template>
  19. </el-table-column>
  20. <el-table-column prop label='核心维保事项记录' :show-overflow-tooltip='true' min-width='150'>
  21. <template slot-scope='{row}'>{{row.matters||'--'}}</template>
  22. </el-table-column>
  23. <el-table-column prop label='现场照片' :show-overflow-tooltip='true' width='80'>
  24. <template slot-scope='{row}'>
  25. <div
  26. v-if='row.glsmsImage'
  27. style='cursor:pointer;color: #0091ff;'
  28. @click.stop='clickPic(row.glsmsImage)'
  29. >{{row.glsmsImage.length+'张'}}</div>
  30. <div v-else>{{'--'}}</div>
  31. </template>
  32. </el-table-column>
  33. <el-table-column prop label='维保任务' align='center'>
  34. <el-table-column prop label='任务编号' :show-overflow-tooltip='true'>
  35. <template slot-scope='{row}'>
  36. <div style='cursor:pointer;color: #0091ff;'>{{row.wb_gzglid||'--'}}</div>
  37. </template>
  38. </el-table-column>
  39. <el-table-column prop label='维保任务名称' :show-overflow-tooltip='true' min-width='340'>
  40. <template slot-scope='{row}'>{{row.wbrwmc || '--'}}</template>
  41. </el-table-column>
  42. <el-table-column prop label='任务状态' :show-overflow-tooltip='true'>
  43. <template slot-scope='{row}'>{{row.status||'--'}}</template>
  44. </el-table-column>
  45. <el-table-column prop label='开始时间' :show-overflow-tooltip='true' width='130'>
  46. <template slot-scope='{row}'>{{row.sjkssj?formatter(row.sjkssj):'--'}}</template>
  47. </el-table-column>
  48. <el-table-column prop label='完成时间' :show-overflow-tooltip='true' width='130'>
  49. <template slot-scope='{row}'>{{row.sjwcsj?formatter(row.sjwcsj):'--'}}</template>
  50. </el-table-column>
  51. <el-table-column prop label='执行耗时(天)' :show-overflow-tooltip='true' min-width='130' :sortable='true'>
  52. <template slot-scope='{row}'>{{row.sjcxsjt||'--'}}</template>
  53. </el-table-column>
  54. </el-table-column>
  55. <el-table-column prop label='是否正常' :show-overflow-tooltip='true' width='80'>
  56. <template slot-scope='{row}'>{{row.zt||'--'}}</template>
  57. </el-table-column>
  58. <el-table-column prop label='异常工单' align='center'>
  59. <el-table-column prop label='异常工单编号' :show-overflow-tooltip='true' min-width='110'>
  60. <template slot-scope='{row}'>
  61. <div @click='ycgd(row)'>{{row.wonum||'--'}}</div>
  62. </template>
  63. </el-table-column>
  64. <el-table-column prop label='描述' :show-overflow-tooltip='true' width='900'>
  65. <template slot-scope='{row}'>{{row.description||'--'}}</template>
  66. </el-table-column>
  67. <el-table-column prop label='填报时间' :show-overflow-tooltip='true' width='130'>
  68. <template slot-scope='{row}'>{{row.reportdate?formatter(row.reportdate):'--'}}</template>
  69. </el-table-column>
  70. <el-table-column prop label='验收时间' :show-overflow-tooltip='true' width='130'>
  71. <template slot-scope='{row}'>{{row.sjjssj?formatter(row.sjjssj):'--'}}</template>
  72. </el-table-column>
  73. </el-table-column>
  74. </el-table>
  75. </div>
  76. <div class='foot'>
  77. <el-pagination
  78. background
  79. layout='prev, pager, next'
  80. :total='total'
  81. :current-page.sync="page"
  82. :page-size='size'
  83. @prev-click='pageChanged'
  84. @next-click='pageChanged'
  85. @current-change='pageChanged'
  86. ></el-pagination>
  87. <pic-large :imgUrl='imgUrl' ref='picLargeOpen'></pic-large>
  88. </div>
  89. </div>
  90. </template>
  91. <script>
  92. // import Select from '@/components/Select/Select.vue'
  93. import { Select } from 'meri-design'
  94. import moment from 'moment'
  95. export default {
  96. props: ['table5', 'total', 'page', 'size', 'loading'],
  97. data() {
  98. return {
  99. value1: '',
  100. searVal: '',
  101. dateVal: '',
  102. imgUrl: [],
  103. tableMaxHeight: 0,
  104. }
  105. },
  106. components: { Select },
  107. updated() {
  108. this.$nextTick(() => {
  109. // 页面渲染完成后的回调
  110. this.tableMaxHeight = this.$refs.tableBox5.offsetHeight
  111. })
  112. },
  113. methods: {
  114. //工单详情
  115. innerTable(row) {
  116. if (row.apptype == '外委' || row.apptype == '自维') {
  117. if (row.wb_gzglid) {
  118. window.open(`http://gcgl.wanda.cn/maximo/ui/?event=loadapp&value=WB_GZGL&uniqueid=${row.wb_gzglid}`)
  119. }
  120. } else if (row.apptype == '安全维保') {
  121. window.open(`http://gcgl.wanda.cn/maximo/ui/?event=loadapp&value=AQ_WB_GZGL&uniqueid=${row.wb_gzglid}`)
  122. }
  123. },
  124. // 工单
  125. ycgd(row) {
  126. if (row.apptype == '外委' || row.apptype == '自维') {
  127. if (row.wb_gzglid) {
  128. window.open(`http://gcgl.wanda.cn/maximo/ui/?event=loadapp&value=WB_GZGL&uniqueid=${row.wb_gzglid}`)
  129. }
  130. } else if (row.apptype == '安全维保') {
  131. window.open(`http://gcgl.wanda.cn/maximo/ui/?event=loadapp&value=WB_GZGL&uniqueid=${row.wb_gzglid}`)
  132. }
  133. },
  134. indexMethod(index) {
  135. return (this.page - 1) * this.size + index + 1
  136. },
  137. pageChanged(page) {
  138. // this.page = page
  139. this.$emit('Index4Emit', page)
  140. },
  141. formatter(date) {
  142. return moment.unix(date / 1000).format('YYYY.MM.DD HH:mm')
  143. },
  144. clickPic(row) {
  145. this.imgUrl = []
  146. if (row) {
  147. row.forEach((el) => {
  148. let obj = {
  149. name: el.description,
  150. url: el.url,
  151. }
  152. this.imgUrl.push(obj)
  153. })
  154. }
  155. this.$refs.picLargeOpen.open(this.imgUrl)
  156. },
  157. computedHeight() {
  158. this.$nextTick(() => {
  159. // 页面渲染完成后的回调
  160. this.tableMaxHeight = this.$refs.tableBox5.offsetHeight
  161. })
  162. },
  163. },
  164. }
  165. </script>
  166. <style lang="less" scoped>
  167. </style>
  168. <style lang="less">
  169. .compute-item {
  170. .compute-center {
  171. display: flex;
  172. align-items: center;
  173. margin-bottom: 12px;
  174. }
  175. .foot {
  176. height: 32px;
  177. display: flex;
  178. justify-content: flex-end;
  179. margin-top: 28px;
  180. }
  181. /deep/.el-table td {
  182. cursor: pointer;
  183. }
  184. }
  185. </style>