gcfz2.vue 4.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130
  1. <template>
  2. <div class='gcfz2'>
  3. <div class='table-2-input'>
  4. <el-date-picker
  5. v-model='dateVal'
  6. value-format='yyyyMMdd'
  7. type='daterange'
  8. size='small'
  9. style='margin-right:12px;width:230px'
  10. range-separator='-'
  11. start-placeholder='记录日期开始'
  12. end-placeholder='记录日期结束'
  13. ></el-date-picker>
  14. <Select
  15. width='146'
  16. tipPlace='top'
  17. @change='changelc'
  18. caption='楼层:'
  19. v-model='cg.floors'
  20. size='small'
  21. style='margin-right:12px'
  22. :selectdata='floorSelect'
  23. :placeholder='"选择楼层"'
  24. ></Select>
  25. <el-input @change='changelc' placeholder='搜索区域' size='small' style='width:192px' prefix-icon='el-icon-search' v-model='cg.searVal'></el-input>
  26. </div>
  27. <div class='table-2-table'>
  28. <el-table
  29. :header-cell-style='{background:"rgba(245,246,247,1)",fontFamily:"MicrosoftYaHei",color:"rgba(100,108,115,1)",lineHeight:"16px",fontSize:"12px"}'
  30. v-loading='loading'
  31. :data='bgjlTable'
  32. style='width: 100%'
  33. border
  34. >
  35. <el-table-column label='序号' type='index' width='50'></el-table-column>
  36. <el-table-column prop label='楼层' width='130'>
  37. <template slot-scope='{row}'>{{row.floor||'--'}}</template>
  38. </el-table-column>
  39. <el-table-column prop label='库存变化' align='center'>
  40. <el-table-column prop label='新增(间)'>
  41. <template slot-scope='{row}'>{{row.xzkf||'--'}}</template>
  42. </el-table-column>
  43. <el-table-column prop label='减少(间)'>
  44. <template slot-scope='{row}'>{{row.jskf||'--'}}</template>
  45. </el-table-column>
  46. </el-table-column>
  47. <el-table-column prop label='区域(㎡)'>
  48. <template slot-scope='{row}'>{{row.region||'--'}}</template>
  49. </el-table-column>
  50. <el-table-column prop label='面积(㎡)'>
  51. <template slot-scope='{row}'>{{row.area||'--'}}</template>
  52. </el-table-column>
  53. <el-table-column prop label='调整后库房总数(间)' width='170'>
  54. <template slot-scope='{row}'>{{row.afterkf||'--'}}</template>
  55. </el-table-column>
  56. <el-table-column prop label='记录日期' width='130' :sortable='true'>
  57. <template slot-scope='{row}'>{{row.changedate||'--'}}</template>
  58. </el-table-column>
  59. </el-table>
  60. </div>
  61. <div class='table-2-p'>注:广场辅助用房使用信息变更时,需同步调整对应楼层辅助用房管理平面图</div>
  62. <div class='foot'>
  63. <el-pagination
  64. background
  65. layout='prev, pager, next'
  66. :total='total'
  67. :page-size='size'
  68. @prev-click='pageChanged'
  69. @next-click='pageChanged'
  70. @current-change='pageChanged'
  71. ></el-pagination>
  72. </div>
  73. </div>
  74. </template>
  75. <script>
  76. import Select from '@/components/Select/Select.vue'
  77. import { mapGetters } from 'vuex'
  78. export default {
  79. data() {
  80. return {
  81. dateVal: '',
  82. searVal: '',
  83. cg: {
  84. floors: '',
  85. searVal: ''
  86. }
  87. }
  88. },
  89. computed: {
  90. ...mapGetters(['floorSelect'])
  91. },
  92. props: ['bgjlTable', 'total', 'page', 'size', 'loading'],
  93. components: { Select },
  94. methods: {
  95. pageChanged(page) {
  96. this.page = page
  97. this.$emit('queryChange')
  98. },
  99. changelc() {
  100. console.log(this.cg)
  101. this.$emit('changeEmit', this.cg)
  102. }
  103. }
  104. }
  105. </script>
  106. <style lang="less" scoped>
  107. .gcfz2 {
  108. .table-2-input {
  109. display: flex;
  110. align-items: center;
  111. }
  112. .table-2-table {
  113. margin-top: 10px;
  114. }
  115. .table-2-p {
  116. height: 48px;
  117. font-size: 14px;
  118. font-family: MicrosoftYaHei;
  119. color: rgba(31, 36, 41, 1);
  120. line-height: 48px;
  121. }
  122. .foot {
  123. height: 32px;
  124. display: flex;
  125. justify-content: flex-end;
  126. margin-top: 28px;
  127. }
  128. }
  129. </style>