ChartTable.vue 4.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141
  1. <template>
  2. <div class="app-table">
  3. <div class="table">
  4. <el-table
  5. :key="table.tableKey"
  6. v-loading="table.listLoading"
  7. element-loading-text="给我一点时间"
  8. :data="table.list"
  9. border
  10. fit
  11. highlight-current-row
  12. style="width: 100%;"
  13. :row-style="rowStyle"
  14. :cell-style="cellStyle"
  15. class="elTable table-fixed"
  16. >
  17. <el-table-column :key="1" label="序号" prop="sort" align="center" width="50px" />
  18. <el-table-column :key="2" label="栏舍名称" prop="barname" min-width="90px" align="center" />
  19. <el-table-column :key="3" label="第一层" min-width="90px" align="center">
  20. <el-table-column label="比例 (%)" prop="onerate" min-width="90px" align="center" />
  21. <el-table-column label="重量 (g)" prop="oneweight" min-width="90px" align="center" />
  22. </el-table-column>
  23. <el-table-column :key="4" label="第二层" min-width="90px" align="center">
  24. <el-table-column label="比例 (%)" prop="tworate" min-width="90px" align="center" />
  25. <el-table-column label="重量 (g)" prop="twoweight" min-width="90px" align="center" />
  26. </el-table-column>
  27. <el-table-column :key="5" label="第三层" min-width="90px" align="center">
  28. <el-table-column label="比例 (%)" prop="threerate" min-width="90px" align="center" />
  29. <el-table-column label="重量 (g)" prop="threeweight" min-width="90px" align="center" />
  30. </el-table-column>
  31. </el-table>
  32. <Pagination v-show="table.total>0" :total="table.total" :page.sync="table.getdataListParm.offset" :limit.sync="table.getdataListParm.pagecount" @pagination="getList" />
  33. </div>
  34. </div>
  35. </template>
  36. <script>
  37. import { GetDataByName } from '@/api/common'
  38. import draggable from 'vuedraggable'
  39. import Cookies from 'js-cookie'
  40. import { parseTime } from '@/utils/index.js'
  41. import Pagination from '@/components/Pagination'
  42. export default {
  43. name: 'MaterialIssuancePlan',
  44. display: 'Two list header slot',
  45. order: 14,
  46. components: { Pagination },
  47. data() {
  48. return {
  49. table: {
  50. getdataListParm: {
  51. name: 'getDungHistory',
  52. page: 1,
  53. offset: 1,
  54. pagecount: 12,
  55. returntype: 'Map',
  56. parammaps: {
  57. pastureid: Cookies.get('pastureid'),
  58. operatetime: ''
  59. }
  60. },
  61. list: [],
  62. total: 0,
  63. tableKey: 0,
  64. listLoading: false,
  65. temp: {},
  66. changeList: [],
  67. startObj: {}
  68. },
  69. textMap: {
  70. seeHistory: '粪便筛修改记录'
  71. },
  72. seeHistory: {
  73. dialogFormVisible: false, dialogStatus: '',
  74. total: 0, tableKey: 0, listLoading: false,
  75. getdataListParm: {
  76. name: 'getDungHistoryBar', page: 1, offset: 1, pagecount: 10, returntype: 'Map',
  77. parammaps: {
  78. pastureid: Cookies.get('pastureid'),
  79. barid: '',
  80. inputDatetime: '',
  81. time1: '',
  82. time2: ''
  83. }
  84. }
  85. },
  86. rowStyle: { maxHeight: 30 + 'px', height: 30 + 'px' },
  87. cellStyle: { padding: 0 + 'px' }
  88. }
  89. },
  90. created() {
  91. this.getList()
  92. },
  93. methods: {
  94. changeDate() {
  95. this.getList()
  96. },
  97. getList() {
  98. this.table.listLoading = true
  99. GetDataByName(this.table.getdataListParm).then(response => {
  100. console.log('table数据', response.data.list)
  101. if (response.data.list !== null) {
  102. this.table.list = response.data.list
  103. this.table.pageNum = response.data.pageNum
  104. this.table.pageSize = response.data.pageSize
  105. this.table.total = response.data.total
  106. } else {
  107. this.table.list = []
  108. }
  109. setTimeout(() => {
  110. this.table.listLoading = false
  111. }, 100)
  112. })
  113. },
  114. form_search() {
  115. if (this.table.getdataListParm.parammaps.operatetime == '' || this.table.getdataListParm.parammaps.operatetime == null ) {
  116. this.table.getdataListParm.parammaps.operatetime = ''
  117. } else {
  118. this.table.getdataListParm.parammaps.operatetime = parseTime(this.table.getdataListParm.parammaps.operatetime, '{y}-{m}-{d}')
  119. }
  120. this.getList()
  121. },
  122. handleRefresh() {
  123. this.table.getdataListParm.parammaps.operatetime = ''
  124. this.getList()
  125. },
  126. }
  127. }
  128. </script>
  129. <style lang="scss" scoped>
  130. .search{margin-bottom: 10px;}
  131. </style>