414 lines
		
	
	
		
			9.1 KiB
		
	
	
	
		
			Vue
		
	
	
	
			
		
		
	
	
			414 lines
		
	
	
		
			9.1 KiB
		
	
	
	
		
			Vue
		
	
	
	
| 
 | |
| <template>
 | |
|   <view class="main">
 | |
|     <view v-if="userInfo.pkCountry != 1" class="top">
 | |
|       <view class="search-bottom">
 | |
|         <view class="time-text">{{ '查询时间' }}</view>
 | |
|         <view class="time1">
 | |
|           <picker :value="query.startDate" mode="date" @change="bindDateChange">
 | |
|             <view v-if="query.startDate != ''" class="uni-input">{{
 | |
|               query.startDate
 | |
|             }}</view>
 | |
|             <view v-else class="uni-input">{{ '开始日期' }}</view>
 | |
|           </picker>
 | |
|         </view>
 | |
|         <view class="text_s">{{ '至' }}</view>
 | |
|         <view class="time1">
 | |
|           <picker :value="query.endDate" mode="date" @change="bindDateChange1">
 | |
|             <view v-if="query.endDate != ''" class="uni-input">{{
 | |
|               query.endDate
 | |
|             }}</view>
 | |
|             <view v-else class="uni-input">{{ '结束日期' }}</view>
 | |
|           </picker>
 | |
|         </view>
 | |
|         <view class="search-icons" @click="submit">
 | |
|           <image
 | |
|             class="search-icon-s"
 | |
|             src="../../static/images/search.png"
 | |
|           ></image>
 | |
|         </view>
 | |
|       </view>
 | |
|     </view>
 | |
|     <view class="search-content">
 | |
|       <view class="search-list">
 | |
|         <view v-for="item in dataList" class="search-view">
 | |
|           <view class="flex_s">
 | |
|             <view class="data-left">
 | |
|               {{ '奖金日期' }}
 | |
|             </view>
 | |
|             <view class="data-right">
 | |
|               {{ item.settleDate }}
 | |
|             </view>
 | |
|           </view>
 | |
|           <view class="flex_s">
 | |
|             <view class="data-left"> {{ '创客直推收益' }}(¥) </view>
 | |
|             <view class="data-right style1" @click="getDetails(item, 20)">
 | |
|               {{ item.makerDirectIncome | toThousandthAndKeepDecimal }}
 | |
|             </view>
 | |
|           </view>
 | |
|           <view class="flex_s">
 | |
|             <view class="data-left"> {{ '创客共享收益' }}(¥) </view>
 | |
|             <view class="data-right style1" @click="getDetails(item, 21)">
 | |
|               {{ item.makerShareIncome | toThousandthAndKeepDecimal }}
 | |
|             </view>
 | |
|           </view>
 | |
|           <view class="flex_s">
 | |
|             <view class="data-left"> {{ '平台服务费' }}(¥) </view>
 | |
|             <view class="data-right">
 | |
|               {{ item.serviceSpend | toThousandthAndKeepDecimal }}
 | |
|             </view>
 | |
|           </view>
 | |
|           <view class="flex_s">
 | |
|             <view class="data-left"> {{ '实发小计' }}(¥) </view>
 | |
|             <view class="data-right">
 | |
|               {{ item.makerRealSubtotal | toThousandthAndKeepDecimal }}
 | |
|             </view>
 | |
|           </view>
 | |
|           <!-- <view class="border_s">
 | |
|             <view class="button" v-if="checkRule == true" @click="urlTap">
 | |
|               {{ '查看详情' }}
 | |
|             </view>
 | |
|           </view> -->
 | |
|           <view style="clear: both"></view>
 | |
|           <view style="height: 20rpx; background-color: #fff"></view>
 | |
|         </view>
 | |
|       </view>
 | |
|     </view>
 | |
|     <u-popup
 | |
|       :show="show"
 | |
|       mode="center"
 | |
|       closeOnClickOverlay
 | |
|       closeable
 | |
|       round="10"
 | |
|       @close="close"
 | |
|     >
 | |
|       <view class="kuang">
 | |
|         <view
 | |
|           v-for="item in tableDetails"
 | |
|           v-show="tableDetails.length > 0"
 | |
|           class="kuang_i"
 | |
|         >
 | |
|           <view class="kuang_ii">
 | |
|             <view>来源会员编号</view>
 | |
|             <view>{{ item.sourceMemberCode }}</view>
 | |
|           </view>
 | |
|           <view class="kuang_ii">
 | |
|             <view>来源会员名称</view>
 | |
|             <view>{{ item.sourceMemberName }}</view>
 | |
|           </view>
 | |
|           <view class="kuang_ii">
 | |
|             <view>奖金金额</view>
 | |
|             <view>{{ item.realIncome | toThousandthAndKeepDecimal}}</view>
 | |
|           </view>
 | |
|         </view>
 | |
|         <view v-show="tableDetails.length == 0" class="kong"> 暂无数据 </view>
 | |
|       </view>
 | |
|     </u-popup>
 | |
|   </view>
 | |
| </template>
 | |
| 
 | |
| <script>
 | |
| import * as api from "@/config/login.js";
 | |
| import { setToken } from "@/config/auth.js";
 | |
| import store from "@/store";
 | |
| export default {
 | |
|   data() {
 | |
|     return {
 | |
|       tableDetails: [],
 | |
|       show: false,
 | |
|       getBonusTypeList: [],
 | |
|       index: null,
 | |
|       dataList: [],
 | |
|       userInfo: [],
 | |
|       query: {
 | |
|         startDate: "",
 | |
|         endDate: "",
 | |
|         sourceMemberCode: "",
 | |
|         sourceMemberName: "",
 | |
|         pkBonusItems: "",
 | |
|       },
 | |
|       page: {
 | |
|         pageNum: 1,
 | |
|         pageSize: 50,
 | |
|       },
 | |
|     };
 | |
|   },
 | |
|   props: ["num", "checkRule"],
 | |
|   onLoad() {},
 | |
|   created() {
 | |
|     // this.getType()
 | |
|     this.userInfo = uni.getStorageSync("User");
 | |
|     this.getDataList();
 | |
|   },
 | |
|   methods: {
 | |
|     getDetails(row, bonusValue) {
 | |
|       api
 | |
|         .markBonus({
 | |
|           startDate: row.settleDate,
 | |
|           bonusValue: bonusValue,
 | |
|         })
 | |
|         .then((res) => {
 | |
|           console.log(
 | |
|             "%c [ res ]-151",
 | |
|             "font-size:13px; background:#fb0ce4; color:#ff50ff;",
 | |
|             res
 | |
|           );
 | |
|           this.tableDetails = res.rows;
 | |
|           this.show = true;
 | |
|         });
 | |
|     },
 | |
|     close() {
 | |
|       this.show = false;
 | |
|     },
 | |
|     urlTap() {
 | |
|       uni.navigateTo({ url: "/pages/bonusSource/index" });
 | |
|     },
 | |
|     getInfo() {
 | |
|       api
 | |
|         .getInfo()
 | |
|         .then((res) => {
 | |
|           if (res) {
 | |
|             this.userInfo = res.data;
 | |
|           }
 | |
|         })
 | |
|         .catch((error) => {
 | |
|           reject(error);
 | |
|         });
 | |
|     },
 | |
|     submit() {
 | |
|       this.getDataList();
 | |
|     },
 | |
|     getType() {
 | |
|       api
 | |
|         .getBonusType()
 | |
|         .then((res) => {
 | |
|           if (res) {
 | |
|             this.getBonusTypeList = res.rows;
 | |
|           }
 | |
|         })
 | |
|         .catch((error) => {
 | |
|           reject(error);
 | |
|         });
 | |
|     },
 | |
|     bindPickerChange(e) {
 | |
|       this.index = e.detail.value;
 | |
|     },
 | |
|     bindDateChange(e) {
 | |
|       this.query.startDate = e.detail.value;
 | |
|     },
 | |
|     bindDateChange1(e) {
 | |
|       this.query.endDate = e.detail.value;
 | |
|     },
 | |
|     getDataList(num) {
 | |
|       api
 | |
|         .queryBonusMaker(
 | |
|           this.query,
 | |
|           `?pageNum=${num || 1}&pageSize=${this.page.pageSize}`
 | |
|         )
 | |
|         .then((res) => {
 | |
|           if (res) {
 | |
|             this.dataList.push(...res.rows);
 | |
|           }
 | |
|         })
 | |
|         .catch((error) => {
 | |
|           reject(error);
 | |
|         });
 | |
|     },
 | |
|     submit() {},
 | |
|   },
 | |
| };
 | |
| </script>
 | |
| <style>
 | |
| .border_s {
 | |
|   border-bottom: 1rpx solid #eee;
 | |
|   height: 10rpx;
 | |
| }
 | |
| .button {
 | |
|   padding: 0 30rpx;
 | |
|   /* width: 150rpx; */
 | |
|   height: 52rpx;
 | |
|   line-height: 52rpx;
 | |
|   color: #fff;
 | |
|   font-size: 28rpx;
 | |
|   text-align: center;
 | |
|   background: #005BAC;
 | |
|   margin: 30rpx 0 0 0;
 | |
|   float: right;
 | |
|   border-radius: 24rpx;
 | |
| }
 | |
| .type {
 | |
|   color: #005BAC !important;
 | |
| }
 | |
| .flex_s {
 | |
|   width: 100%;
 | |
|   display: flex;
 | |
|   justify-content: space-between;
 | |
|   padding-bottom: 15rpx;
 | |
| }
 | |
| .data-left {
 | |
|   color: #999;
 | |
|   font-size: 26rpx;
 | |
| }
 | |
| .data-right {
 | |
|   color: #333;
 | |
|   font-size: 26rpx;
 | |
| }
 | |
| .search-view {
 | |
|   /* display: flex; */
 | |
|   /* justify-content: space-between; */
 | |
|   padding: 30rpx 20rpx 0 20rpx;
 | |
|   border-bottom: 20rpx solid #eee;
 | |
|   /* border-bottom: 1px solid #eee; */
 | |
|   margin: 0;
 | |
| }
 | |
| .search-list {
 | |
|   margin-bottom: 25rpx;
 | |
|   background-color: #fff;
 | |
| }
 | |
| .search-content {
 | |
|   margin-top: 25rpx;
 | |
| }
 | |
| .text_s {
 | |
|   color: #333;
 | |
|   font-size: 26rpx;
 | |
| }
 | |
| .search-icon-s {
 | |
|   width: 22rpx;
 | |
|   height: 22rpx;
 | |
| }
 | |
| .search-icons {
 | |
|   width: 47rpx;
 | |
|   height: 47rpx;
 | |
|   background: #005BAC;
 | |
|   border-radius: 50%;
 | |
|   margin-left: 20rpx;
 | |
|   display: flex;
 | |
|   justify-content: center;
 | |
|   align-items: center;
 | |
|   margin: 30rpx 20rpx 0 0;
 | |
| }
 | |
| .time1 {
 | |
|   width: 158rpx;
 | |
|   height: 75rpx;
 | |
|   border-bottom: 1rpx solid #eee;
 | |
|   margin: 0 50rpx 30rpx 50rpx;
 | |
|   color: #999;
 | |
|   text-align: center;
 | |
|   font-size: 24rpx;
 | |
|   /* margin-bottom: 30rpx; */
 | |
| }
 | |
| .time-text {
 | |
|   color: #999;
 | |
|   font-size: 26rpx;
 | |
| }
 | |
| .search-bottom {
 | |
|   height: 100rpx;
 | |
|   line-height: 100rpx;
 | |
|   display: flex;
 | |
|   margin-left: 20rpx;
 | |
| }
 | |
| .texts {
 | |
|   color: #333;
 | |
|   font-size: 26rpx;
 | |
|   overflow: hidden;
 | |
|   white-space: nowrap;
 | |
|   text-overflow: ellipsis;
 | |
|   /* width:200rpx; */
 | |
|   text-align: right;
 | |
| }
 | |
| .select-text {
 | |
|   display: flex;
 | |
|   margin-right: 20rpx;
 | |
|   font-size: 26rpx;
 | |
|   color: #333;
 | |
|   position: relative;
 | |
| }
 | |
| .selIcon {
 | |
|   width: 20rpx;
 | |
|   height: 20rpx;
 | |
|   margin-top: 10rpx;
 | |
|   margin-left: 5rpx;
 | |
| }
 | |
| .text-s {
 | |
|   font-size: 26rpx;
 | |
|   color: #999;
 | |
|   margin-right: 10rpx;
 | |
| }
 | |
| .place {
 | |
|   font-size: 26rpx;
 | |
|   color: #999;
 | |
| }
 | |
| .border-colors {
 | |
|   border: none;
 | |
|   font-size: 26rpx;
 | |
|   color: #333;
 | |
|   margin-left: 30rpx;
 | |
| }
 | |
| page {
 | |
|   background-color: #f2f2f2;
 | |
| }
 | |
| .search-icon {
 | |
|   width: 25rpx;
 | |
|   height: 25rpx;
 | |
|   position: absolute;
 | |
|   left: 30rpx;
 | |
|   top: 12rpx;
 | |
| }
 | |
| .search-bg {
 | |
| }
 | |
| .top {
 | |
|   /* height: 200rpx; */
 | |
|   background-color: #fff;
 | |
|   padding: 20rpx 0 20rpx 0;
 | |
| }
 | |
| .search-tops {
 | |
|   display: flex;
 | |
|   justify-content: space-between;
 | |
|   height: 65rpx;
 | |
|   line-height: 65rpx;
 | |
|   padding-bottom: 40rpx;
 | |
|   border-bottom: 1px solid #eee;
 | |
| }
 | |
| .search-bg {
 | |
|   width: 432rpx;
 | |
|   height: 35rpx;
 | |
|   background: #f5f6f8;
 | |
|   border-radius: 33rpx;
 | |
|   display: flex;
 | |
|   position: relative;
 | |
|   padding: 20rpx 50rpx;
 | |
|   margin-left: 20rpx;
 | |
| }
 | |
| .style1 {
 | |
|   cursor: pointer;
 | |
|   text-decoration: underline;
 | |
|   color: #d61820;
 | |
| }
 | |
| .kuang {
 | |
|   height: 800rpx;
 | |
|   background: #eee;
 | |
|   padding: 60rpx 20rpx;
 | |
|   overflow-y: auto;
 | |
| }
 | |
| .kuang_i {
 | |
|   padding: 20rpx 20rpx;
 | |
|   border-radius: 8px;
 | |
|   background: #fff;
 | |
|   font-size: 14px;
 | |
|   color: #999;
 | |
|   margin-bottom: 20rpx;
 | |
| }
 | |
| .kuang_ii {
 | |
|   display: flex;
 | |
|   align-items: center;
 | |
|   justify-content: space-between;
 | |
| }
 | |
| ::v-deep .u-popup__content {
 | |
|   width: 80%;
 | |
| }
 | |
| .kong {
 | |
|   text-align: center;
 | |
|   line-height: 250px;
 | |
| }
 | |
| </style>
 |