|
|
@@ -0,0 +1,464 @@
|
|
|
+<template>
|
|
|
+ <view class="container">
|
|
|
+ <view class="hander-top">
|
|
|
+ <view class="icon-back-wrap" @click="onBack">
|
|
|
+ <image
|
|
|
+ class="icon-back"
|
|
|
+ src="@/static/preview/icon-back.png"
|
|
|
+ mode="widthFix"
|
|
|
+ />
|
|
|
+ </view>
|
|
|
+ <!-- <view class="count">数智钱包</view> -->
|
|
|
+ <view class="capsule"></view>
|
|
|
+ </view>
|
|
|
+ <div class="h_top">
|
|
|
+ <div class="balance_box">
|
|
|
+ <div class="b_teg">可提现余额(元)</div>
|
|
|
+ <div class="dinB balance">￥{{ count.unsettle_money }}</div>
|
|
|
+ <div class="b_static flex_r flex_ac flex_jb">
|
|
|
+ <div>
|
|
|
+ <span>总收入</span>
|
|
|
+ <span class="fw">￥{{ count.total_money || 0 }}</span>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <span>今日收入</span>
|
|
|
+ <span class="fw">￥{{ count.day_income || 0 }}</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!-- <div class="btn_bar flex_r flex_jb">
|
|
|
+ <div
|
|
|
+ class="btn_item"
|
|
|
+ @click="getToCash"
|
|
|
+ >
|
|
|
+ <span class="ico iconfont"></span>
|
|
|
+ <span class="btn_txt">去提现</span>
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ class="btn_item conv"
|
|
|
+ @click="goto('/pagesC/convert/index')"
|
|
|
+ >
|
|
|
+ <image class="ico" src="@/static/icon/convert.png" mode="widthFix" />
|
|
|
+ <span class="btn_txt">去转化</span>
|
|
|
+ </div>
|
|
|
+ </div> -->
|
|
|
+
|
|
|
+ <!-- 资金列表 -->
|
|
|
+ <div class="detailList">
|
|
|
+ <div class="tit"><span>订单明细</span></div>
|
|
|
+ <!-- 顶部导航 -->
|
|
|
+ <view class="Tab_con flex_r flex_ac flex_jb">
|
|
|
+ <view
|
|
|
+ class="tab_list flex_r flex_ac"
|
|
|
+ :class="current == index ? 'active' : ''"
|
|
|
+ v-for="(item, index) in TabList"
|
|
|
+ :key="index"
|
|
|
+ @tap="SetStatus(index)"
|
|
|
+ >{{ item.title }}</view
|
|
|
+ >
|
|
|
+ </view>
|
|
|
+ <!-- 顶部导航-end -->
|
|
|
+ <div class="li" v-for="(i, s) in list" :key="s">
|
|
|
+ <p class="flex_r flex_jb">
|
|
|
+ <span class="s5">消费:<span class="s2">{{i.pay_amount}}</span> <span class="s4" v-if="Number(i.not_discount)>0">（不优惠:{{i.not_discount}}）</span></span>
|
|
|
+ <span class="s5">结算:
|
|
|
+ <span class="s2">{{i.num}}</span>
|
|
|
+ </span>
|
|
|
+ </p>
|
|
|
+ <image class="settle" src="@/static/icon/settle.png" v-if="i.status == 0" />
|
|
|
+ <p class="flex_r flex_jb">
|
|
|
+ <span class="s3">{{ i.update_time }}</span>
|
|
|
+ <span class="s3">{{ i.type_id == 4 ? '智慧结算' : i.type_id == 1 ? '自助结算' : '其它' }}</span>
|
|
|
+ </p>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!-- <view class="con">
|
|
|
+ <view class="list" v-for="(item, index) in list" :key="index">
|
|
|
+ <view class="list_head flex_r flex_ac flex_jb">
|
|
|
+ <view class="head_name">{{ item.remark }}</view>
|
|
|
+ <view :class="['head_price',item.act == '+' ? 'g_color' : '']">{{ item.act }}{{item.num }}</view>
|
|
|
+ </view>
|
|
|
+ <view class="list_con flex_r flex_ac flex_jb">
|
|
|
+ <view class="list_time">{{ item.create_time }}</view>
|
|
|
+ <view class="list_balance">余额{{ item.after }}</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <not-goods v-if="haveGoods" textStr="暂无流水信息"></not-goods>
|
|
|
+ </view> -->
|
|
|
+ <!-- 资金列表 -->
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+let page = 1;
|
|
|
+import { post } from "@/request/api.js";
|
|
|
+import notGoods from "@/components/not-goods/index.vue";
|
|
|
+export default {
|
|
|
+ components: {
|
|
|
+ notGoods,
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ haveGoods: false, // 是否有商品
|
|
|
+ current: 0,
|
|
|
+ TabList: [
|
|
|
+ { title: "全部", sauts: 0 },
|
|
|
+ { title: "自助结算", sauts: 1 },
|
|
|
+ { title: "智慧结算", sauts: 2 },
|
|
|
+ ],
|
|
|
+ list: [],
|
|
|
+ page:1,
|
|
|
+ localInfo: uni.getStorageSync("localInfo"),
|
|
|
+ statusList: {},
|
|
|
+ shop_id: null,
|
|
|
+ count: {
|
|
|
+ day_income: 0,
|
|
|
+ total_money: 0,
|
|
|
+ unsettle_money: 0
|
|
|
+ }
|
|
|
+ };
|
|
|
+ },
|
|
|
+ onLoad(da) {
|
|
|
+ console.log(da);
|
|
|
+ this.current = da.s || 0
|
|
|
+ this.shop_id = da.shop_id
|
|
|
+ },
|
|
|
+ onShow() {
|
|
|
+ this.page = 1;
|
|
|
+ this.list = [];
|
|
|
+ this.loadData();
|
|
|
+ // this.getData()
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ loadData() {
|
|
|
+ let data = {
|
|
|
+ page: this.page,
|
|
|
+ rows:20,
|
|
|
+ type_id: this.current,
|
|
|
+ shop_id: this.shop_id
|
|
|
+ };
|
|
|
+ uni.showLoading({ mask: true });
|
|
|
+ post("v1/merchant/settleCommission", data).then((res) => {
|
|
|
+ uni.hideLoading();
|
|
|
+ if (res.code === 0) {
|
|
|
+ this.statusList = JSON.parse(res.data.statusList)
|
|
|
+ this.count = res.data.data.count
|
|
|
+ if (res.data.data.data.data.length > 0) {
|
|
|
+ this.list = this.list.concat(res.data.data.data.data);
|
|
|
+ } else {
|
|
|
+ if (this.page == 1) {
|
|
|
+ this.haveGoods = true;
|
|
|
+ this.page = -1;
|
|
|
+ } else {
|
|
|
+ this.page = -1;
|
|
|
+ this.$toast("暂无更多");
|
|
|
+ }
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ if (page == 1) {
|
|
|
+ this.haveGoods = true;
|
|
|
+ this.page = -1;
|
|
|
+ } else {
|
|
|
+ this.page = -1;
|
|
|
+ this.$toast("暂无更多");
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // getData(){
|
|
|
+ // post("v1/merchant/myShop").then((res) => {
|
|
|
+ // if (res.code == 0) {
|
|
|
+ // this.total_money = res.data.total_money,
|
|
|
+ // this.day_income = res.data.day_income
|
|
|
+ // }
|
|
|
+ // });
|
|
|
+ // },
|
|
|
+ SetStatus(i) {
|
|
|
+ this.current = i;
|
|
|
+ this.page = 1;
|
|
|
+ this.list = [];
|
|
|
+ this.haveGoods = false;
|
|
|
+ this.loadData();
|
|
|
+ },
|
|
|
+ onBack() {
|
|
|
+ uni.navigateBack();
|
|
|
+ },
|
|
|
+ // 跳转到提现页面
|
|
|
+ getToCash(type) {
|
|
|
+ this.goto("/pages/cash/index", { type })
|
|
|
+ },
|
|
|
+ },
|
|
|
+
|
|
|
+ /**
|
|
|
+ * 页面上拉触底事件的处理函数
|
|
|
+ */
|
|
|
+ onReachBottom() {
|
|
|
+ let _this = this
|
|
|
+ if (this.page != -1) {
|
|
|
+ setTimeout(function () {
|
|
|
+ ++_this.page;
|
|
|
+ _this.loadData();
|
|
|
+ }, 800);
|
|
|
+ }
|
|
|
+ },
|
|
|
+};
|
|
|
+</script>
|
|
|
+<style lang="scss">
|
|
|
+// 页面配置
|
|
|
+// 页面配置-end
|
|
|
+
|
|
|
+// 顶部列表
|
|
|
+.tab_list {
|
|
|
+ height: 100%;
|
|
|
+ box-sizing: border-box;
|
|
|
+ font-size: 30rpx;
|
|
|
+ color: #808080;
|
|
|
+
|
|
|
+}
|
|
|
+
|
|
|
+.Tab_con {
|
|
|
+ width: 100%;
|
|
|
+ height: 92rpx;
|
|
|
+ background: #fff;
|
|
|
+ padding: 0 30rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ border-bottom: 1rpx solid rgba($color: #d3aa79, $alpha: 0.3);
|
|
|
+}
|
|
|
+
|
|
|
+.active {
|
|
|
+ color: #1bbd89;
|
|
|
+ border-bottom: 6rpx solid #1bbd89;
|
|
|
+}
|
|
|
+
|
|
|
+// 顶部列表-end
|
|
|
+
|
|
|
+// 资金列表
|
|
|
+.con {
|
|
|
+ border-top: 16rpx solid #f4f4f4;
|
|
|
+}
|
|
|
+
|
|
|
+.list_con {
|
|
|
+ width: 100%;
|
|
|
+ overflow: hidden;
|
|
|
+}
|
|
|
+
|
|
|
+.list_head {
|
|
|
+ width: 100%;
|
|
|
+ overflow: hidden;
|
|
|
+ margin-bottom: 5rpx;
|
|
|
+}
|
|
|
+
|
|
|
+.list_time {
|
|
|
+ font-size: 24rpx;
|
|
|
+ color: #a1a1a1;
|
|
|
+}
|
|
|
+
|
|
|
+.list_balance {
|
|
|
+ font-size: 24rpx;
|
|
|
+ color: #a1a1a1;
|
|
|
+}
|
|
|
+
|
|
|
+.head_price {
|
|
|
+ font-size: 32rpx;
|
|
|
+ font-family: "SourceHanSansCN-Medium";
|
|
|
+}
|
|
|
+
|
|
|
+.head_name {
|
|
|
+ font-size: 30rpx;
|
|
|
+ color: #212121;
|
|
|
+ font-family: "SourceHanSansCN-Medium";
|
|
|
+}
|
|
|
+
|
|
|
+.list {
|
|
|
+ width: 100%;
|
|
|
+ overflow: hidden;
|
|
|
+ padding: 30rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ border-bottom: 3rpx solid #f4f4f4;
|
|
|
+}
|
|
|
+
|
|
|
+// 资金列表-end
|
|
|
+
|
|
|
+// 状态颜色
|
|
|
+.g_color {
|
|
|
+ color: #1bbd89;
|
|
|
+}
|
|
|
+
|
|
|
+.y_color {
|
|
|
+ color: #f15b21;
|
|
|
+}
|
|
|
+
|
|
|
+// 状态颜色-end
|
|
|
+
|
|
|
+.h_top {
|
|
|
+ background: linear-gradient(#d3aa79, #f3d6b2);
|
|
|
+ height: 420rpx;
|
|
|
+ position: relative;
|
|
|
+ .balance_box {
|
|
|
+ position: absolute;
|
|
|
+ bottom: 0;
|
|
|
+ left: 0;
|
|
|
+ padding: 0 32rpx 38rpx;
|
|
|
+ width: 100%;
|
|
|
+ text-align: center;
|
|
|
+ .b_teg {
|
|
|
+ font-size: 28rpx;
|
|
|
+ margin-bottom: 3rpx;
|
|
|
+ // color: rgba($color: #000, $alpha: 0.65);
|
|
|
+ }
|
|
|
+ .balance {
|
|
|
+ font-size: 60rpx;
|
|
|
+ color: #333;
|
|
|
+ }
|
|
|
+ .b_static {
|
|
|
+ font-size: 28rpx;
|
|
|
+ padding: 30rpx 30rpx 0;
|
|
|
+ .fw{
|
|
|
+ font-weight: 700;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+.hander-top {
|
|
|
+ position: absolute;
|
|
|
+ z-index: 1000;
|
|
|
+ top: 108rpx;
|
|
|
+ left: 0;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ width: 100%;
|
|
|
+ padding: 0 32rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+
|
|
|
+ .icon-back-wrap {
|
|
|
+ width: 64rpx;
|
|
|
+ height: 64rpx;
|
|
|
+
|
|
|
+ .icon-back {
|
|
|
+ width: 64rpx;
|
|
|
+ height: 64rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .count {
|
|
|
+ color: #222;
|
|
|
+ font-size: 35rpx;
|
|
|
+ line-height: 64rpx;
|
|
|
+ }
|
|
|
+ .capsule {
|
|
|
+ width: 120rpx;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.btn_bar {
|
|
|
+ padding: 30rpx 32rpx;
|
|
|
+ .btn_item {
|
|
|
+ width: 280rpx;
|
|
|
+ height: 70rpx;
|
|
|
+ line-height: 70rpx;
|
|
|
+ text-align: center;
|
|
|
+ background: rgba($color: #000, $alpha: 0.15);
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ border-radius: 10rpx;
|
|
|
+ &.corc {
|
|
|
+ background-color: #d3aa79;
|
|
|
+ color: #fff;
|
|
|
+ }
|
|
|
+ &.conv {
|
|
|
+ color: #fff;
|
|
|
+ background-color: #18bb88;
|
|
|
+ }
|
|
|
+ image {
|
|
|
+ width: 50rpx;
|
|
|
+ height: 50rpx;
|
|
|
+ background: #fff;
|
|
|
+ border-radius: 50%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .ico {
|
|
|
+ color: #d3aa79;
|
|
|
+ width: 50rpx;
|
|
|
+ height: 50rpx;
|
|
|
+ background: #fff;
|
|
|
+ border-radius: 50%;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ font-size: 36rpx;
|
|
|
+ }
|
|
|
+ .btn_txt {
|
|
|
+ height: 50rpx;
|
|
|
+ width: calc(76% - 50rpx);
|
|
|
+ line-height: 50rpx;
|
|
|
+ }
|
|
|
+}
|
|
|
+.detailList {
|
|
|
+ width: calc(100% - 64rpx);
|
|
|
+ padding: 0 10rpx;
|
|
|
+ border-radius: 12rpx;
|
|
|
+ margin-bottom: 36rpx;
|
|
|
+ margin-left: 32rpx;
|
|
|
+ margin-top: 32rpx;
|
|
|
+ background-color: #fff;
|
|
|
+
|
|
|
+ .tit {
|
|
|
+ padding: 28rpx 32rpx 10rpx;
|
|
|
+ span {
|
|
|
+ display: inline-block;
|
|
|
+ padding-left: 16rpx;
|
|
|
+ font-size: 32rpx;
|
|
|
+ font-weight: 700;
|
|
|
+ height: 32rpx;
|
|
|
+ line-height: 32rpx;
|
|
|
+ border-left: 8rpx solid #d3aa79;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .li {
|
|
|
+ padding: 22rpx 0;
|
|
|
+ border-bottom: 1px solid rgba($color: #d3aa79, $alpha: 0.3);
|
|
|
+ margin: 0 30rpx;
|
|
|
+ position: relative;
|
|
|
+
|
|
|
+ p {
|
|
|
+ margin-bottom: 8rpx;
|
|
|
+ font-size: 30rpx;
|
|
|
+ &:last-child {
|
|
|
+ margin-bottom: 0;
|
|
|
+ font-size: 25rpx;
|
|
|
+ color: #999;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .s5{
|
|
|
+ font-weight: bold;
|
|
|
+ }
|
|
|
+ .s2 {
|
|
|
+ font-weight: bold;
|
|
|
+ &::before {
|
|
|
+ content: "￥";
|
|
|
+ font-size: 25rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .s4{
|
|
|
+ font-size: 22rpx;
|
|
|
+ color: #999;
|
|
|
+ font-weight: normal;
|
|
|
+ }
|
|
|
+ &:last-child {
|
|
|
+ border: none;
|
|
|
+ }
|
|
|
+ .settle{
|
|
|
+ position: absolute;
|
|
|
+ opacity: 0.6;
|
|
|
+ width: 90rpx;
|
|
|
+ height: 78.3rpx;
|
|
|
+ right: calc((100% - 90rpx) / 2 - 80rpx);
|
|
|
+ top: calc((100% - 78.3rpx) / 2);
|
|
|
+ // margin: calc((100% - 100rpx) / 2);
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|
xiaomei
