billListComponent.vue 3.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135
  1. <template>
  2. <view class="bill-list-component">
  3. <view class="chooseList u-flex" v-for="(item,index) in listData" :key="item.bizSn">
  4. <view class="checkbox" v-show="showCheck"><u-checkbox v-model="item.checked" :name="item.bizSn" @change="checkChange" size="40" shape="circle"></u-checkbox></view>
  5. <view class="choose_r" @click="jumpPage('/pages/sales/salesDetail?salesBillId='+item.bizSn)" >
  6. <view class="u-flex u-row-between">
  7. <view class="billInfo u-flex">
  8. <text>{{item.bizDate.substr(0,10)}}</text>
  9. <view v-if="item.bizStatusDictValue">{{item.bizStatusDictValue}}</view>
  10. <view v-if="item.bizSourceTypeDictValue && item.bizSourceTypeDictValue!='自建'">{{item.bizSourceTypeDictValue}}</view>
  11. <view v-if="item.distributionFlag && item.distributionFlag == 1">铺货</view>
  12. </view>
  13. <view class="billOrder">{{item.bizNo}}</view>
  14. </view>
  15. <view class="rigth_b u-flex u-row-between">
  16. <view>应收:¥{{toThousands(item.bizAmount||0,2)}}</view>
  17. <view>已收:¥{{toThousands(item.settledAmount ||0,2)}}</view>
  18. <view>
  19. 待收:
  20. <text>¥{{toThousands(item.unsettleAmount||0,2)}}</text>
  21. </view>
  22. </view>
  23. </view>
  24. </view>
  25. <view v-if="listData&&listData.length==0" @click="jumpPage('/pages/test')" style="padding-top:100rpx;">
  26. <u-empty :src="`/static/${$config('themePath')}/def_no_data@3x.png`" icon-size="180" :text="noDataText" mode="list"></u-empty>
  27. </view>
  28. </view>
  29. </template>
  30. <script>
  31. import { toThousands } from '@/libs/tools.js'
  32. export default {
  33. props: {
  34. list: {
  35. type: Array,
  36. default: () => {
  37. return [];
  38. }
  39. },
  40. showCheck:{
  41. type: Boolean,
  42. default:false
  43. }
  44. },
  45. data() {
  46. return {
  47. listData:this.list,
  48. noDataText:'暂无数据',
  49. toThousands
  50. };
  51. },
  52. methods: {
  53. setData(list){
  54. this.listData = list?list:[]
  55. },
  56. checkChange(e){
  57. const row = this.listData.find(item => item.bizSn == e.name)
  58. if(row){
  59. row.checked = !row.checked
  60. this.listData.splice()
  61. }
  62. // 判断是否全选
  63. const isAllNoChecked = this.listData.filter(item => !item.checked)
  64. this.$emit('allChecked',isAllNoChecked.length == 0,row)
  65. },
  66. // 获取所有数据
  67. getAllData(){
  68. return this.listData
  69. },
  70. // 全选
  71. allSelect(val){
  72. this.listData.map(item => {
  73. item.checked = val
  74. })
  75. this.listData.splice()
  76. },
  77. jumpPage(url){
  78. uni.navigateTo({
  79. url
  80. })
  81. }
  82. }
  83. };
  84. </script>
  85. <style lang="scss" scoped>
  86. .bill-list-component {
  87. height: 100%;
  88. .chooseList {
  89. padding: 30rpx 20rpx;
  90. border-bottom: 1rpx solid #e4e7ed;
  91. &:last-child {
  92. border-bottom: 0rpx solid #e4e7ed;
  93. }
  94. .checkbox {
  95. width: 74rpx;
  96. }
  97. .choose_r {
  98. flex: 1;
  99. .billInfo {
  100. text {
  101. font-weight: 600;
  102. }
  103. view {
  104. padding: 4rpx 10rpx;
  105. text-align: center;
  106. border-radius: 30rpx;
  107. border: 1rpx solid #e4e7ed;
  108. margin-left: 10rpx;
  109. font-size: 0.7rem;
  110. color: #666;
  111. }
  112. }
  113. .billOrder {
  114. font-size: 0.8rem;
  115. color: #666;
  116. }
  117. .rigth_b {
  118. color: #666;
  119. font-size: 0.8rem;
  120. margin-top: 20rpx;
  121. view {
  122. &:last-child {
  123. color: #333;
  124. text {
  125. color: #f0ad4e;
  126. }
  127. }
  128. }
  129. }
  130. }
  131. }
  132. }
  133. </style>