room2.vue 3.6 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697
  1. <template>
  2. <div class='compute-item'>
  3. <div class='compute-table'>
  4. <el-table
  5. :border='true'
  6. v-if='table2.length>=0'
  7. v-loading='loading'
  8. :data='table2'
  9. style='width: 100%'
  10. :header-cell-style='{background:"rgba(245,246,247,1)",fontFamily:"MicrosoftYaHei",color:"rgba(100,108,115,1)",lineHeight:"16px",fontSize:"12px"}'
  11. >
  12. <el-table-column type='index' label='序号' width='50' :index='indexMethod'></el-table-column>
  13. <el-table-column prop='a' label='抽屉编号' :show-overflow-tooltip='true' resizable>
  14. <template slot-scope='{row}'>{{row.drawernum||'--'}}</template>
  15. </el-table-column>
  16. <el-table-column prop='a' label='出线规格' :show-overflow-tooltip='true'>
  17. <template slot-scope='{row}'>{{row.outspec||'--'}}</template>
  18. </el-table-column>
  19. <el-table-column prop='a' label='楼层' :show-overflow-tooltip='true'>
  20. <template slot-scope='{row}'>{{row.floor||'--'}}</template>
  21. </el-table-column>
  22. <el-table-column prop='a' label='电井编号' :show-overflow-tooltip='true'>
  23. <template slot-scope='{row}'>{{row.wellnum||'--'}}</template>
  24. </el-table-column>
  25. <el-table-column prop='brand' label='电箱编号' :show-overflow-tooltip='true'>
  26. <template slot-scope='{row}'>{{row.boxnum||'--'}}</template>
  27. </el-table-column>
  28. <el-table-column prop='brand' label='供电容量(kw)' :show-overflow-tooltip='true'>
  29. <template slot-scope='{row}'>{{row.capacitynum||'--'}}</template>
  30. </el-table-column>
  31. <el-table-column prop='brand' label='控制回路' :show-overflow-tooltip='true'>
  32. <template slot-scope='{row}'>{{row.control||'--'}}</template>
  33. </el-table-column>
  34. </el-table>
  35. </div>
  36. <div class='foot'>
  37. <el-pagination
  38. background
  39. layout='prev, pager, next'
  40. :total='total'
  41. :page-size='size'
  42. @prev-click='pageChanged'
  43. @next-click='pageChanged'
  44. @current-change='pageChanged'
  45. ></el-pagination>
  46. </div>
  47. </div>
  48. </template>
  49. <script>
  50. import { Select } from 'meri-design'
  51. // import Select from '@/components/Select/Select.vue'
  52. import { mapGetters } from 'vuex'
  53. export default {
  54. props: ['table2', 'total', 'page', 'size', 'loading'],
  55. data() {
  56. return {
  57. dataSelect2: [
  58. { id: 'test1', name: '选择项' },
  59. { id: 'test2', name: '单平米' },
  60. { id: 'test3', name: '下级分项' },
  61. { id: 'test4', name: '滑动平均滑动平均' }
  62. ],
  63. searVal: ''
  64. }
  65. },
  66. computed: {
  67. ...mapGetters(['floorSelect'])
  68. },
  69. components: { Select },
  70. methods: {
  71. indexMethod(index) {
  72. return (this.page - 1) * this.size + index + 1
  73. },
  74. pageChanged(page) {
  75. this.$emit('Index1Emit', page)
  76. }
  77. },
  78. mounted() {}
  79. }
  80. </script>
  81. <style lang="less" scoped>
  82. </style>
  83. <style lang="less">
  84. .compute-item {
  85. .compute-center {
  86. display: flex;
  87. align-items: center;
  88. margin-bottom: 12px;
  89. }
  90. .foot {
  91. height: 32px;
  92. display: flex;
  93. justify-content: flex-end;
  94. margin-top: 28px;
  95. }
  96. }
  97. </style>