bill.vue 6.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277
  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="query">
  5. <u-icon @click="show=true" name="calendar" label="自定义查询" labelPos="right" labelColor="#666" color="#666"
  6. size="25px"></u-icon>
  7. </view>
  8. <view class="list">
  9. <view class="time">
  10. <text v-if="date==cdate">今日</text>
  11. <text>{{date}}</text>
  12. </view>
  13. <view class="money">
  14. <view>
  15. <text>收入金额</text>
  16. <text class="in">¥{{merchantType==10?info.paymentAmount||0:info.orderAmount||0}}</text>
  17. <text>{{merchantType==10?info.paymentCount:info.orders||0}}笔</text>
  18. </view>
  19. <view>
  20. <text>退款金额</text>
  21. <text>¥{{merchantType==10?info.refundAmount:info.refundOrderAmount||0}}</text>
  22. <text>{{merchantType==10?info.refundCount:info.refundOrders||0}}笔</text>
  23. </view>
  24. </view>
  25. <template v-if="merchantType==10">
  26. <view class="li" v-for="(item,index) in pageDataList" :key="index" @click="detail(item)">
  27. <view class="left">
  28. <text>{{item.playDate}}
  29. {{item.playTime}}出发/{{item.orderType==2?'包船':'拼船'}}/{{item.boatNo||'拼团中'}}</text>
  30. <text>{{item.payTime}}</text>
  31. </view>
  32. <view class="right" v-if="item.realPrice<0" style="color: #111">{{item.realPrice}}</text>
  33. </view>
  34. <view class="right" v-else>+{{item.realPrice}}</text>
  35. </view>
  36. </view>
  37. </template>
  38. <template v-if="merchantType==4">
  39. <view class="li" v-for="(item,index) in merchantOrderDTOSList" :key="index" @click="detail(item)">
  40. <view class="left">
  41. <text>{{item.productName}}</text>
  42. <text>{{item.orderTime}}</text>
  43. </view>
  44. <view class="right" v-if="item.realityPay<0" style="color: #111">{{item.realityPay}}</view>
  45. <view class="right" v-else>+{{item.realityPay}}</view>
  46. </view>
  47. </template>
  48. </view>
  49. <u-datetime-picker @confirm="confirmDate" @cancel="show=false" :show="show" v-model="value1"
  50. mode="date"></u-datetime-picker>
  51. </view>
  52. </template>
  53. <script>
  54. export default {
  55. data() {
  56. return {
  57. cdate: new Date().Format('yyyy-MM-dd'),
  58. date: new Date().Format('yyyy-MM-dd'),
  59. show: false,
  60. value1: Number(new Date()),
  61. mt: uni.getSystemInfoSync().statusBarHeight + 44,
  62. info: {
  63. orderAmount: 0,
  64. orders: 0,
  65. refundOrderAmount: 0,
  66. fishermanOrderDTOS: [],
  67. refundOrders: 0,
  68. },
  69. merchantId: uni.getStorageSync('merchantId'),
  70. merchantType: uni.getStorageSync('merchantType'),
  71. pageDataList:[],
  72. merchantOrderDTOSList:[],
  73. page:1,
  74. limit:10,
  75. isOver:false,
  76. }
  77. },
  78. onLoad() {
  79. if (this.merchantType == 10) {
  80. this.getList()
  81. } else {
  82. this.getList2()
  83. }
  84. },
  85. onReachBottom() {
  86. if (this.isOver) return;
  87. if (this.merchantType == 10) {
  88. this.getList()
  89. } else {
  90. this.getList2()
  91. }
  92. },
  93. methods: {
  94. confirmDate(e) {
  95. // 创建一个Date对象并传入时间戳
  96. const date = new Date(e.value);
  97. // 使用Date对象的方法获取年、月、日、小时、分钟和秒
  98. const year = date.getFullYear();
  99. const month = ('0' + (date.getMonth() + 1)).slice(-2);
  100. const day = ('0' + date.getDate()).slice(-2);
  101. // 格式化时间
  102. const formattedTime = `${year}-${month}-${day}`;
  103. this.date = formattedTime;
  104. if (this.merchantType == 10) {
  105. this.getList()
  106. } else {
  107. this.getList2()
  108. }
  109. this.show = false;
  110. },
  111. //渔家乐
  112. getList() {
  113. this.$api.get('/scenic/api/order/tradeBills', {
  114. startDate: this.date,
  115. endDate: '',
  116. dateType: '1',
  117. merchantId: uni.getStorageSync('merchantId'),
  118. page:this.page,
  119. limit:this.limit
  120. }).then(res => {
  121. if (res.data.code === 0) {
  122. this.info = res.data.data;
  123. this.page++;
  124. let { list, total } = res.data.data.pageData;
  125. if (this.pageDataList.length + list.length > total || list.length == 0) return this.isOver = true;
  126. this.pageDataList = [...this.pageDataList, ...list];
  127. this.merchantOrderDTOSList = this.info.merchantOrderDTOS;
  128. } else {
  129. this.info = {
  130. pageData: {
  131. list: []
  132. },
  133. paymentAmount: 0,
  134. paymentCount: 0,
  135. refundAmount: 0,
  136. refundCount: 0,
  137. };
  138. this.pageDataList = [];
  139. this.merchantOrderDTOSList = [];
  140. }
  141. })
  142. },
  143. //餐饮
  144. getList2() {
  145. this.$api.post('/api/merchant/food/getMerchantFoodDeal', {
  146. dateTime: this.date,
  147. dateType: '1',
  148. merchantId: uni.getStorageSync('merchantId')
  149. }).then(res => {
  150. if (res.data.code === 0) {
  151. this.info = res.data.data;
  152. this.merchantOrderDTOSList = this.info.merchantOrderDTOS;
  153. } else {
  154. this.info = {
  155. orderAmount: 0,
  156. orders: 0,
  157. refundOrderAmount: 0,
  158. fishermanOrderDTOS: [],
  159. refundOrders: 0,
  160. }
  161. this.merchantOrderDTOSList = [];
  162. }
  163. })
  164. },
  165. detail(item) {
  166. item.real
  167. let info = encodeURIComponent(JSON.stringify(item));
  168. uni.navigateTo({
  169. url: "/pagesHouse/home/orderBillDetail?info=" + info
  170. })
  171. }
  172. },
  173. }
  174. </script>
  175. <style lang="less" scoped>
  176. .page {
  177. background: #F3F4F4;
  178. padding-bottom: 40rpx;
  179. box-sizing: border-box;
  180. .query {
  181. height: 100rpx;
  182. display: flex;
  183. align-items: center;
  184. padding-left: 30rpx;
  185. background-color: #fff;
  186. }
  187. .list {
  188. width: calc(100% - 36rpx);
  189. margin: 20rpx auto;
  190. padding: 36rpx 24rpx;
  191. background-color: #fff;
  192. border-radius: 24rpx;
  193. .time {
  194. text {
  195. &:first-child {
  196. font-size: 40rpx;
  197. font-weight: bold;
  198. color: #666;
  199. margin-right: 10rpx;
  200. }
  201. }
  202. margin-bottom: 30rpx;
  203. }
  204. .money {
  205. display: flex;
  206. align-items: center;
  207. &>view {
  208. width: 50%;
  209. text {
  210. display: block;
  211. font-weight: bold;
  212. &:first-child {
  213. color: #111;
  214. font-size: 28rpx;
  215. }
  216. &:nth-child(2) {
  217. font-size: 40rpx;
  218. margin: 14rpx 0 16rpx;
  219. }
  220. &:last-child {
  221. color: #999;
  222. font-size: 26rpx;
  223. font-weight: inherit;
  224. }
  225. }
  226. .in {
  227. color: #FEA400;
  228. }
  229. }
  230. }
  231. .li {
  232. display: flex;
  233. justify-content: space-between;
  234. padding: 30rpx 0;
  235. border-bottom: 1rpx solid #EFEFEF;
  236. .left {
  237. text {
  238. &:first-child {
  239. font-size: 28rpx;
  240. color: #111;
  241. margin-bottom: 15rpx;
  242. }
  243. display: block;
  244. color: #999;
  245. font-size: 26rpx;
  246. }
  247. }
  248. .right {
  249. color: #FEA400;
  250. font-size: 36rpx;
  251. font-weight: bold;
  252. }
  253. }
  254. }
  255. }
  256. </style>