businessCard.vue 10.6 KB
<template>
    <view>
        <uni-section title="50%(折扣券)" type="line">
            <uni-card padding="0" spacing="0">

                <uni-list>
                    <uni-list-item title="适应车场" rightText="万达商业广场">
                        <text></text>
                    </uni-list-item>
                    <uni-list-item title="价格:¥5/张" rightText="商户库存:0张"></uni-list-item>
                </uni-list>
                <view slot="actions" class="card-actions no-border">

                    <view class="card-actions-item" @click="actionsClick('购买')">
                        <uni-icons type="cart-filled" size="18" color="#999"></uni-icons>
                        <text class="card-actions-item-text">购买</text>
                    </view>
                    <view class="card-actions-item" @click="actionsClick('发放')">
                        <uni-icons type="redo-filled" size="18" color="#999"></uni-icons>
                        <text class="card-actions-item-text">发放</text>
                    </view>
                    <view class="card-actions-item" @click="actionsClick('打印')">
                        <uni-icons type="shop-filled" size="18" color="#999"></uni-icons>
                        <text class="card-actions-item-text">打印</text>
                    </view>


                </view>
            </uni-card>
        </uni-section>

        <uni-section title="2小时(时长券)" type="line">
            <uni-card padding="0" spacing="0">
                <!--<template v-slot:cover>-->
                <!--<view class="custom-cover">-->
                <!--<image class="cover-image" mode="aspectFill" :src="cover">-->
                <!--</image>-->
                <!--<view class="cover-content">-->
                <!--<text class="uni-subtitle uni-white">今日新闻热点</text>-->
                <!--</view>-->
                <!--</view>-->
                <!--</template>-->
                <uni-list>
                    <uni-list-item title="适应车场" rightText="万达商业广场">
                        <text></text>
                    </uni-list-item>
                    <uni-list-item title="价格:¥5/张" rightText="商户库存:0张"></uni-list-item>
                </uni-list>
                <view slot="actions" class="card-actions no-border">

                    <view class="card-actions-item" @click="actionsClick('购买')">
                        <uni-icons type="cart-filled" size="18" color="#999"></uni-icons>
                        <text class="card-actions-item-text">购买</text>
                    </view>

                </view>
            </uni-card>
        </uni-section>

        <uni-section title="5元(金额券)" type="line">
            <uni-card padding="0" spacing="0">
                <!--<template v-slot:cover>-->
                <!--<view class="custom-cover">-->
                <!--<image class="cover-image" mode="aspectFill" :src="cover">-->
                <!--</image>-->
                <!--<view class="cover-content">-->
                <!--<text class="uni-subtitle uni-white">今日新闻热点</text>-->
                <!--</view>-->
                <!--</view>-->
                <!--</template>-->
                <uni-list>
                    <uni-list-item title="适应车场" rightText="万达商业广场">
                        <text></text>
                    </uni-list-item>
                    <uni-list-item title="价格:¥5/张" rightText="商户库存:0张"></uni-list-item>
                </uni-list>
                <view slot="actions" class="card-actions no-border">

                    <view class="card-actions-item" @click="actionsClick('购买')">
                        <uni-icons type="cart-filled" size="18" color="#999"></uni-icons>
                        <text class="card-actions-item-text">购买</text>
                    </view>

                </view>
            </uni-card>
        </uni-section>


        <uni-section title="满10减5(满减券)" type="line">
            <uni-card padding="0" spacing="0">
                <!--<template v-slot:cover>-->
                <!--<view class="custom-cover">-->
                <!--<image class="cover-image" mode="aspectFill" :src="cover">-->
                <!--</image>-->
                <!--<view class="cover-content">-->
                <!--<text class="uni-subtitle uni-white">今日新闻热点</text>-->
                <!--</view>-->
                <!--</view>-->
                <!--</template>-->
                <uni-list>
                    <uni-list-item title="适应车场" rightText="万达商业广场">
                        <text></text>
                    </uni-list-item>
                    <uni-list-item title="价格:¥5/张" rightText="商户库存:0张"></uni-list-item>
                </uni-list>
                <view slot="actions" class="card-actions no-border">

                    <view class="card-actions-item" @click="actionsClick('购买')">
                        <uni-icons type="cart-filled" size="18" color="#999"></uni-icons>
                        <text class="card-actions-item-text">购买</text>
                    </view>

                </view>
            </uni-card>
        </uni-section>


        <uni-section title="单次(单次券)" type="line">
            <uni-card padding="0" spacing="0">
                <!--<template v-slot:cover>-->
                <!--<view class="custom-cover">-->
                <!--<image class="cover-image" mode="aspectFill" :src="cover">-->
                <!--</image>-->
                <!--<view class="cover-content">-->
                <!--<text class="uni-subtitle uni-white">今日新闻热点</text>-->
                <!--</view>-->
                <!--</view>-->
                <!--</template>-->
                <uni-list>
                    <uni-list-item title="适应车场" rightText="万达商业广场">
                        <text></text>
                    </uni-list-item>
                    <uni-list-item title="价格:¥5/张" rightText="商户库存:0张"></uni-list-item>
                </uni-list>
                <view slot="actions" class="card-actions no-border">

                    <view class="card-actions-item" @click="actionsClick('购买')">
                        <uni-icons type="cart-filled" size="18" color="#999"></uni-icons>
                        <text class="card-actions-item-text">购买</text>
                    </view>

                </view>
            </uni-card>
        </uni-section>

        <uni-section title="单天(包天券)" type="line">
            <uni-card padding="0" spacing="0">
                <!--<template v-slot:cover>-->
                <!--<view class="custom-cover">-->
                <!--<image class="cover-image" mode="aspectFill" :src="cover">-->
                <!--</image>-->
                <!--<view class="cover-content">-->
                <!--<text class="uni-subtitle uni-white">今日新闻热点</text>-->
                <!--</view>-->
                <!--</view>-->
                <!--</template>-->
                <uni-list>
                    <uni-list-item title="适应车场" rightText="万达商业广场">
                        <text></text>
                    </uni-list-item>
                    <uni-list-item title="价格:¥5/张" rightText="商户库存:0张"></uni-list-item>
                </uni-list>
                <view slot="actions" class="card-actions no-border">

                    <view class="card-actions-item" @click="actionsClick('购买')">
                        <uni-icons type="cart-filled" size="18" color="#999"></uni-icons>
                        <text class="card-actions-item-text">购买</text>
                    </view>

                </view>
            </uni-card>
        </uni-section>

    </view>
</template>

<script>
import common from "../../common/common.js";
export default {
  data() {
    const currentDate = this.getDate({
      format: true
    })
    return {
      title: 'picker',
      array: ['全部', '充值', '支付'],
      arrayWay: ['所有方式', '微信', '线下公对公'],
      index: 0,
      indexWay: 0,
      benginDate: currentDate,
      overDate: currentDate,
      rows: [],
      pageNum: 1,//当前页
      pageSize: 1,//每页条数
      reload: false,
      status: 'more',
      contentText: {
        contentdown: '上拉加载更多~',
        contentrefresh: '正在加载更多~',
        contentmore: '我是有底线的~'
      },
      iconType: 'auto', // 图标样式
    }
  },
  onLoad(params) {
    wx.showShareMenu({
      withShareTicket: true
    })
    this.couponRuleParkPage()
  },
  onShow() {
    var me = this;

  },
  computed: {

  },
  methods: {
    // 通过商户ID查询停车记录信息
    couponRuleParkPage() {
      let that = this
      let paramsData = {
        pageNum: '1',
        pageSize: '10'
      }
      // 首页信息获取 接口
      that.$myRequest({
        url: that.$common.getBusinessParkOrderByBusIdForPage,
        method: 'POST',
        data: that.$common.requestSign(paramsData)
      }).then(res => {
        this.recordList = res.data.dataList
      })
    },

  }
}
</script>

<style lang="scss" scoped>
    /deep/ .uni-section {
        padding-bottom: 10px;
    }

    .rechargeWrap {
        position: relative;
        .rechargeArrow {
            position: absolute;
            right: 10px;
            top: 30px;
            font-size: 20px;
            color: #999;
        }
    }

    .recordCon {
        padding-right: 35px;
        color: #999;
        display: flex;
        justify-content: space-between;
    }

    .container {
        overflow: hidden;
    }

    .custom-cover {
        flex: 1;
        flex-direction: row;
        position: relative;
    }

    .cover-content {
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        height: 40px;
        background-color: rgba($color: #000000, $alpha: 0.4);
        display: flex;
        flex-direction: row;
        align-items: center;
        padding-left: 15px;
        font-size: 14px;
        color: #fff;
    }

    .card-actions {
        display: flex;
        flex-direction: row;
        justify-content: space-around;
        align-items: center;
        height: 45px;
        border-top: 1px #eee solid;
    }

    .card-actions-item {
        display: flex;
        flex-direction: row;
        align-items: center;
    }

    .card-actions-item-text {
        font-size: 12px;
        color: #666;
        margin-left: 5px;
    }

    .cover-image {
        flex: 1;
        height: 150px;
    }

    .no-border {
        border-width: 0;
    }
</style>