recordCy.vue 3.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174
  1. <template>
  2. <view class="page" :style="{'min-height':(h)+'px','padding-top':mt+'px'}">
  3. <c-nav-bar title="核销记录"></c-nav-bar>
  4. <view class="top">
  5. <view class="time" @click="show=true">
  6. <u-icon name="calendar" :label="dateStr" labelPos="right" labelColor="#666" color="#666" space="7px"
  7. size="25px"></u-icon>
  8. <u-icon name="arrow-down" color="#999" size="20px" style="margin-left: 20rpx;"></u-icon>
  9. </view>
  10. <view class="right">共{{totalNum}}单 收入¥{{totalAmount}}</view>
  11. </view>
  12. <view class="list">
  13. <block v-if="data.length>0">
  14. <view class="item" v-for="(item,index) in data" :key="index">
  15. <image :src="item.productImg|delArr"></image>
  16. <view class="mid">
  17. <text>{{item.productName}}</text>
  18. <text>核销时间:{{item.writeOffTime}}</text>
  19. </view>
  20. <view class="price">¥{{item.realityPay}}</view>
  21. </view>
  22. </block>
  23. <block v-else>
  24. <NoData />
  25. </block>
  26. </view>
  27. <u-datetime-picker @confirm="confirmDate" @cancel="show=false" :show="show" v-model="value1"
  28. visibleItemCount="6" mode="year-month"></u-datetime-picker>
  29. </view>
  30. </template>
  31. <script>
  32. export default {
  33. data() {
  34. return {
  35. dateStr: new Date().Format('yyyy年-MM月'),
  36. date: new Date().Format('yyyy-MM'),
  37. show: false,
  38. k: '',
  39. data: [],
  40. value1: Number(new Date()),
  41. merchantId: uni.getStorageSync('merchantId'),
  42. totalAmount: 0,
  43. totalNum: 0
  44. }
  45. },
  46. filters: {
  47. delArr(val) {
  48. if (val) {
  49. return val.split(',')[0]
  50. }
  51. }
  52. },
  53. onLoad() {
  54. this.getdata();
  55. },
  56. methods: {
  57. getdata() {
  58. this.$api.post('/api/merchant/food/getMerchantFoodWriteOffList', {
  59. dateType: 1,
  60. merchantId: this.merchantId,
  61. dateTime: this.date
  62. }).then(res => {
  63. if (res.data.code == 0) {
  64. // this.totalAmount = res.data.data.orderAmount;
  65. this.totalNum = res.data.data.orders;
  66. this.data = res.data.data.merchantOrderDTOS;
  67. var num = res.data.data.orderAmount.toString(); // 转成字符串类型 如能确定类型 这步可省去
  68. if (num.indexOf(".") !== -1) {
  69. let [integerPart, decimalPart] = num.split(".");
  70. if (decimalPart.length > 2) {
  71. decimalPart = decimalPart.substring(0, 2);
  72. } else if (decimalPart.length === 1) {
  73. decimalPart += "0";
  74. }
  75. num = `${integerPart}.${decimalPart}`;
  76. } else {
  77. num += ".00";
  78. }
  79. console.log(num);
  80. this.totalAmount = num;
  81. return num;
  82. }
  83. console.log(res)
  84. })
  85. },
  86. confirmDate(e) {
  87. // 创建一个Date对象并传入时间戳
  88. const date = new Date(e.value);
  89. // 使用Date对象的方法获取年、月、日、小时、分钟和秒
  90. const year = date.getFullYear();
  91. const month = ('0' + (date.getMonth() + 1)).slice(-2);
  92. const day = ('0' + date.getDate()).slice(-2);
  93. // 格式化时间
  94. let formattedTime = "";
  95. formattedTime = `${year}-${month}`;
  96. this.dateStr = `${year}年-${month}月`
  97. this.date = formattedTime;
  98. this.show = false;
  99. this.getdata()
  100. },
  101. }
  102. }
  103. </script>
  104. <style lang="less" scoped>
  105. .page {
  106. box-sizing: border-box;
  107. }
  108. .top {
  109. padding: 24rpx 30rpx;
  110. display: flex;
  111. justify-content: space-between;
  112. align-items: center;
  113. .time {
  114. display: flex;
  115. align-items: center;
  116. gap: 0 10rpx;
  117. }
  118. .right {
  119. color: #999;
  120. font-size: 24rpx;
  121. }
  122. }
  123. .list {
  124. padding: 0 30rpx;
  125. .item {
  126. padding: 30rpx 0;
  127. border-bottom: 1rpx solid #EFEFEF;
  128. display: flex;
  129. justify-content: space-between;
  130. image {
  131. width: 136rpx;
  132. min-width: 136rpx;
  133. height: 136rpx;
  134. }
  135. .mid {
  136. margin: 0 30rpx 0 20rpx;
  137. text {
  138. display: inline-block;
  139. font-size: 28rpx;
  140. color: #777;
  141. &:first-child {
  142. font-size: 30rpx;
  143. color: #111;
  144. font-weight: bold;
  145. margin: 18rpx 0;
  146. }
  147. }
  148. }
  149. .price {
  150. font-size: 32rpx;
  151. margin-top: 10rpx;
  152. }
  153. }
  154. }
  155. </style>