list.vue 2.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116
  1. <template>
  2. <view class="home bg-f9">
  3. <header-bar title="线边管理"></header-bar>
  4. <uni-search-bar v-model="req.keyword" placeholder="输入关键词" @confirm="search" @cancel="cancel" bgColor="#fff"
  5. cancel-text="取消">
  6. </uni-search-bar>
  7. <common-list :config="config" @listClick="toDtl" :data="dataList"></common-list>
  8. <button type="default" @click="getList()" style="margin-top:10rpx">
  9. {{status == 'more' ? '点击加载更多' : status == 'noMore' ? '已经到底了' : '加载中..'}}
  10. </button>
  11. </view>
  12. </template>
  13. <script>
  14. import headerBar from '../../../components/header-bar/index.vue'
  15. import commonList from '../../../components/common-list/common-list.vue'
  16. import {formateObjToParamStr} from '../../../util/uitl.js'
  17. import Vue from 'vue'
  18. export default {
  19. components: {
  20. headerBar,
  21. commonList
  22. },
  23. data() {
  24. return {
  25. status: 'more',
  26. config: [{
  27. label: "产线名称",
  28. key: 'typeName',
  29. },
  30. {
  31. label: "产品名称",
  32. key: 'name',
  33. },
  34. {
  35. label: "线边数量",
  36. key: 'unit',
  37. }
  38. ],
  39. types:[{},{
  40. text: '原料',
  41. value: '1'
  42. }, {
  43. text: '辅料',
  44. value: '2'
  45. }, {
  46. text: '配件',
  47. value: '3'
  48. }, {
  49. text: '包材',
  50. value: '4'
  51. }, {
  52. text: '其他',
  53. value: '5'
  54. }],
  55. dataList: [],
  56. req: {
  57. pageNum: 1,
  58. pageSize: 10,
  59. keyword: null,
  60. },
  61. }
  62. },
  63. onLoad() {
  64. this.search()
  65. },
  66. onShow() {
  67. if(this.needRefresh) this.search();
  68. },
  69. methods: {
  70. toDtl(i){
  71. console.log(i)
  72. uni.navigateTo({
  73. url: '/pages/lineManagement/details?' + formateObjToParamStr(i)
  74. })
  75. },
  76. cancel() {
  77. this.req.keyword = null
  78. },
  79. search() {
  80. this.req.pageNum = 1
  81. this.status = 'more'
  82. this.dataList = []
  83. this.getList()
  84. },
  85. getList() {
  86. const v = this
  87. if (v.status === 'more') {
  88. v.status = 'loading'
  89. } else {
  90. return
  91. }
  92. v.$post('/api/basics/material/page', v.req).then(res => {
  93. res.data.records.map(items => {
  94. items.typeName = this.types[items.type].text
  95. })
  96. v.dataList = [...v.dataList, ...res.data.records]
  97. if (res.data.pages === v.req.pageNum || res.data.pages === 0) {
  98. v.status = 'noMore'
  99. } else {
  100. v.status = 'more'
  101. v.req.pageNum++
  102. }
  103. })
  104. },
  105. },
  106. }
  107. </script>
  108. <style lang="less">
  109. </style>