266 lines
11 KiB
Vue
266 lines
11 KiB
Vue
|
<template>
|
|||
|
|
<view>
|
|||
|
|
<view class="top-main-box">
|
|||
|
|
<view v-if="merch.merchname">
|
|||
|
|
<navigator @click="go2MerchIndex(merchid)" class="fukuan-top">
|
|||
|
|
<view>
|
|||
|
|
<view class="fukuan-title">付款给[{{ merch.merchname }}]</view>
|
|||
|
|
<view class="fukuan-shanghu"><text>(点击前往商家店铺)</text></view>
|
|||
|
|
</view>
|
|||
|
|
<image style="border-radius:12rpx;" :src="merch.logo"
|
|||
|
|
@error="this.merch.logo = 'http://yuledui.oss-cn-qingdao.aliyuncs.com/' + merch.logo"></image>
|
|||
|
|
</navigator>
|
|||
|
|
<view class="fui-cell-group fukuan-jin-e">
|
|||
|
|
<view class="top-money-remark" @click="toggleKeyboard(1)">
|
|||
|
|
<text @longpress="showSpreadRemark">金额</text>
|
|||
|
|
<text @click="showRemarkClick" class="reamrk-btn">备注</text>
|
|||
|
|
</view>
|
|||
|
|
<view class="fui-cell" @click="toggleKeyboard(1)">
|
|||
|
|
<view class="fui-cell-labelf">¥</view>
|
|||
|
|
<view class="fui-cell-remark noremark"
|
|||
|
|
style="margin-left:25rpx;text-align:left;font-size:58rpx;">
|
|||
|
|
<text v-if="!list.realprice" :style="'opacity:' + mockInputFocusText + ';'">|</text>
|
|||
|
|
<text v-if="list.realprice" class="fui-input textl" id="price">{{ list.realprice ?
|
|||
|
|
list.realprice : '' }}</text>
|
|||
|
|
<text v-else style="opacity:0.5;">在此输入金额</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="remark-money"><input v-if="showRemarkInput" @input="listChange" class="fui-input textl"
|
|||
|
|
id="remark" placeholder="请输入备注" type="text" /></view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<!-- 储值卡抵扣 -->
|
|||
|
|
<block v-if="recharge > 0"> <!-- 简单隐藏一下 -->
|
|||
|
|
<view class="fui-cell-group" v-if="!hideRechargeDeduct">
|
|||
|
|
<view class="fui-cell" v-if="list.realprice">
|
|||
|
|
<block v-if="recharge > 0">
|
|||
|
|
<view>
|
|||
|
|
<checkbox-group @change="useRechargeCheckBox" style="transform: scale(0.75);">
|
|||
|
|
<checkbox color="#ed6d00" :checked="use_deduct_recharge"></checkbox>
|
|||
|
|
</checkbox-group>
|
|||
|
|
</view>
|
|||
|
|
<view class="fui-cell-info" style="color:#666;flex:inherit;margin-right:15rpx;">
|
|||
|
|
<text v-if="merch.third_company_credit_order == 'yes'">使用{{
|
|||
|
|
merch.third_company_credit_merchname }}积分抵扣</text>
|
|||
|
|
<text v-else>使用储值卡抵扣</text>
|
|||
|
|
</view>
|
|||
|
|
<view class="flex">
|
|||
|
|
<view class="badge badge-danger " style="font-size:30rpx;"
|
|||
|
|
v-if="list.deduct_recharge && list.deduct_recharge != undefined">
|
|||
|
|
{{ list.deduct_recharge }}元
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</block>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</block>
|
|||
|
|
<!-- /储值卡抵扣 -->
|
|||
|
|
<!-- 金豆赠送活动抵扣 -->
|
|||
|
|
<view class="fui-cell-group" v-if="credit1_hot_set>0&&credit1_hot_set_jine>=20">
|
|||
|
|
<block v-if="ismobile">
|
|||
|
|
<view class="fui-cell" v-if="list.realprice">
|
|||
|
|
<view>
|
|||
|
|
<button open-type="getPhoneNumber" @getphonenumber="getPhoneNumber_hot" class="mini-btn"></button>
|
|||
|
|
</view>
|
|||
|
|
<view class="fui-cell-info" style="color:#666;flex:inherit;margin-right:15rpx;">{{ activity_platform }}赠送{{ credit1_hot_rang }}金豆</view>
|
|||
|
|
<view class="flex">
|
|||
|
|
<view class="" style="font-size:30rpx;color:red">可抵扣约{{ credit1_hot_rang*0.1|limitDecimal }}元
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</block>
|
|||
|
|
<block v-else>
|
|||
|
|
<view class="fui-cell" v-if="list.realprice">
|
|||
|
|
<view>
|
|||
|
|
<checkbox-group @change="useCreditCheckBox_hot" style="transform: scale(0.75);">
|
|||
|
|
<checkbox color="#ed6d00" value="1" :checked="use_deductprice_hot"></checkbox>
|
|||
|
|
</checkbox-group>
|
|||
|
|
</view>
|
|||
|
|
<view class="fui-cell-info" style="color:#666;flex:inherit;margin-right:15rpx;">{{ activity_platform }}赠送{{ credit1_hot_rang }}金豆</view>
|
|||
|
|
<view class="flex">
|
|||
|
|
<view class="" style="font-size:30rpx;color:red">可抵扣约{{ credit1_hot_rang*0.1|limitDecimal }}元
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</block>
|
|||
|
|
|
|||
|
|
</view>
|
|||
|
|
<!-- /金豆赠送活动抵扣 -->
|
|||
|
|
<!-- 金豆抵扣 -->
|
|||
|
|
<view class="fui-cell-group" v-if="!hideCreditDeduct">
|
|||
|
|
<!-- 小秦的版本1.0
|
|||
|
|
<view class="fui-cell" v-if="list.realprice">
|
|||
|
|
<block v-if="credit1 > 0">
|
|||
|
|
<view>
|
|||
|
|
<checkbox-group @change="useCreditCheckBox" style="transform: scale(0.75);">
|
|||
|
|
<checkbox color="#ed6d00" :checked="use_deductprice"></checkbox>
|
|||
|
|
</checkbox-group>
|
|||
|
|
</view>
|
|||
|
|
<view class="fui-cell-info" style="color:#666;flex:inherit;margin-right:15rpx;">使用金豆抵扣</view>
|
|||
|
|
<view class="flex">
|
|||
|
|
<block v-if="list.deductprice && list.deductprice != undefined&&list.deductcredit > 0">
|
|||
|
|
<view class="badge badge-danger " style="font-size:30rpx;">{{ list.deductprice }}元
|
|||
|
|
</view>
|
|||
|
|
<view class="fui-cell-info " style="color:#FF9933;widht:100%;margin-left:6.2px">-{{
|
|||
|
|
list.deductcredit }}豆</view>
|
|||
|
|
<text @click="showMiniCreditdeductTips" class="icox icox-bangzhuzhongxin"
|
|||
|
|
style="margin-left: 10rpx;"></text>
|
|||
|
|
</block>
|
|||
|
|
<text
|
|||
|
|
v-if="(list.realprice < min_deduct_credit_price && credit1 > 0) || (credit1 * merch.credit_pay_rate < 0.1 && credit1 > 0)"
|
|||
|
|
class="fui-cell-info"
|
|||
|
|
style="color:#666;flex:inherit;margin-left:15rpx;font-size:24rpx;">
|
|||
|
|
金豆可抵扣小于{{ min_deduct_credit_price }}元
|
|||
|
|
</text>
|
|||
|
|
</view>
|
|||
|
|
</block>
|
|||
|
|
<text class="text tip-txt" v-else>暂无可抵扣金豆</text>
|
|||
|
|
</view> -->
|
|||
|
|
<view class="fui-cell" style="flex-wrap:wrap;" v-if="list.realprice">
|
|||
|
|
<block v-if="credit1 > 0">
|
|||
|
|
<block v-if="ismobile">
|
|||
|
|
<view>
|
|||
|
|
<button open-type="getPhoneNumber" @getphonenumber="getPhoneNumber" class="mini-btn"></button>
|
|||
|
|
</view>
|
|||
|
|
<view class="fui-cell-info" style="color:#666;flex:inherit;margin-right:15rpx;">金豆会员享更多优惠</view>
|
|||
|
|
<view class="flex">
|
|||
|
|
<view style="font-size:30rpx;margin-left:60rpx;color:red">本次消费可用金豆抵扣约{{use_max_credit_money}}元
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</block>
|
|||
|
|
<block v-else>
|
|||
|
|
<view>
|
|||
|
|
<checkbox-group @change="useCreditCheckBox" style="transform: scale(0.75);">
|
|||
|
|
<checkbox color="#ed6d00" :checked="use_deductprice"></checkbox>
|
|||
|
|
</checkbox-group>
|
|||
|
|
</view>
|
|||
|
|
<view class="fui-cell-info" style="color:#666;flex:inherit;margin-right:10rpx;">金豆会员享更多优惠</view>
|
|||
|
|
<view class="flex">
|
|||
|
|
<view style="font-size:30rpx;margin-left:60rpx;color:red">本次消费可用金豆抵扣约{{use_max_credit_money}}元
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</block>
|
|||
|
|
</block>
|
|||
|
|
<text class="text tip-txt" v-else>暂无可抵扣金豆</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<!-- /金豆抵扣 -->
|
|||
|
|
|
|||
|
|
<view class="fui-cell-group">
|
|||
|
|
<!-- 满减 -->
|
|||
|
|
<view class="fui-cell ">
|
|||
|
|
<view v-if="list.money_sub > 0" class="fui-cell-info credit-title-txt">
|
|||
|
|
随机立减:
|
|||
|
|
<text style="color:#1aac19;">{{ list.money_sub }}元</text>
|
|||
|
|
<text class="tip-txt hide"><text style="margin-left:5rpx">(消费越多 优惠越多)</text></text>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view class="fui-cell-info credit-title-txt">
|
|||
|
|
<text v-if="merch.third_company_credit_order == 'yes'">{{ merch.third_company_credit_merchname
|
|||
|
|
}} {{ merch.third_company_credit_name }}</text>
|
|||
|
|
<text v-else>储值余额</text>
|
|||
|
|
<text>:</text>
|
|||
|
|
<text style="color:#0099CC;">{{ recharge?recharge:0.00 }}元</text>
|
|||
|
|
<view class="tip-txt"><text class="hide">(消费所得金豆可用于抵扣现金)</text></view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<navigator class="fui-cell " openType="navigate">
|
|||
|
|
<view v-if="list.credit" class="fui-cell-info credit-title-txt">
|
|||
|
|
金豆奖励:
|
|||
|
|
<text class="text-danger" style="color:#FF9933;">{{ list.credit }}豆</text>
|
|||
|
|
<view class="tip-txt hide"><text>(所得金豆可以再次抵现)</text></view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view class="fui-cell-info credit-title-txt">
|
|||
|
|
金豆余额:
|
|||
|
|
<text style="color:#FF9933;">{{ credit1?credit1:0.00 }}豆</text>
|
|||
|
|
<text @click="showMiniCreditdeductTips" class="icox icox-bangzhuzhongxin" style="margin-left: 5rpx;"></text>
|
|||
|
|
<view class="tip-txt"><text class="hide">(消费所得金豆可用于抵扣现金)</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</navigator>
|
|||
|
|
|
|||
|
|
<navigator target="miniProgram" :app-id="merch.third_company_credit_miniappid" path="/pages/index/index"
|
|||
|
|
class="fui-cell"
|
|||
|
|
v-if="merch.third_company_credit_order == 'yes' && merch.third_company_credit_miniappid">
|
|||
|
|
<image style="width: 90rpx;height: 90rpx;" v-if="merch.third_company_credit_merchlogo != ''"
|
|||
|
|
class="icon" :src="merch.third_company_credit_merchlogo"></image>
|
|||
|
|
|
|||
|
|
<view class="fui-cell-info credit-title-txt">
|
|||
|
|
<view class="text">
|
|||
|
|
<text>{{ merch.third_company_credit_miniappid_click_tips }}</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</navigator>
|
|||
|
|
|
|||
|
|
<view v-if="list.realprice > 0" class="fui-cell " openType="navigate">
|
|||
|
|
<view class="fui-cell-info credit-title-txt">
|
|||
|
|
最终应付:
|
|||
|
|
<text class="realprice">{{ list.needpay }}元</text>
|
|||
|
|
<view class="tip-txt hide"><text>(所得金豆可以再次抵现)</text></view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view class="fui-cell-group">
|
|||
|
|
<navigator class="fui-cell" openType="navigate" url="/pages/public/coupon/index?type=0"
|
|||
|
|
v-if="list.couponcount > 0">
|
|||
|
|
<view class="fui-cell-info" style="color:#666">{{ !data.couponname ? '选择优惠券' : '已选择优惠券：' +
|
|||
|
|
data.couponname }}</view>
|
|||
|
|
<view class="fui-cell-remark">
|
|||
|
|
<view class="badge badge-danger">{{ list.couponcount }}</view>
|
|||
|
|
</view>
|
|||
|
|
<text class="text" v-if="list.couponcount <= 0">无可用</text>
|
|||
|
|
</navigator>
|
|||
|
|
</view>
|
|||
|
|
<view :class="'fui-footer '" class="hide" v-if="list.realprice">
|
|||
|
|
<view class="tool nopadding">
|
|||
|
|
<view class="text">
|
|||
|
|
<view class="title text-right">
|
|||
|
|
需付：
|
|||
|
|
<text class="text-danger" style="font-size:32rpx;">{{ list.needpay }}元</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="text">
|
|||
|
|
<view class="title text-right" style="font-size:26rpx;color:gray;">
|
|||
|
|
获得金豆奖励
|
|||
|
|
<text class="text-danger" style="color:#FF9933;">{{ list.credit }}</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="btns">
|
|||
|
|
<text v-if="!on_paying" @tap="submitFun" class="btn btn-danger ">立即支付</text>
|
|||
|
|
<text v-if="on_paying" class="btn btn-danger ">支付中...</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<!-- 数字人民币显示 -->
|
|||
|
|
<!-- <button open-type="getPhoneNumber" @getphonenumber="getPhoneNumber" class="mini-btn" v-if="ismobile">授权手机号</button> -->
|
|||
|
|
<button @click="useEcnyPay" class="e-cny-button" v-if="merch.e_cny_qrurl_psbc">点我使用数字人民币支付</button>
|
|||
|
|
|
|||
|
|
<!-- /数字人民币 -->
|
|||
|
|
<view class="yuledui-biaoyu">
|
|||
|
|
<text>要省钱 就用2</text>
|
|||
|
|
<text class="yld-txt">余乐兑</text>
|
|||
|
|
<text class="shangbiao-txt">®</text>
|
|||
|
|
</view>
|
|||
|
|
<view style="text-align:center;"> <!-- 隐藏键盘按钮 -->
|
|||
|
|
<img @click="toggleKeyboard" class="hide-btn"
|
|||
|
|
src="http://yuledui.oss-cn-qingdao.aliyuncs.com/wx_miniapp/order/offlinepay/down-hide.png" />
|
|||
|
|
</view>
|
|||
|
|
<view :class="showKeyBoard ? '' : 'hide'" class="bottom-key">
|
|||
|
|
<cwx-keyboard v-if="option.cashierid && option.cashierid != '' && option.total > 0" ref="clearMoney"
|
|||
|
|
@confirmEvent="submitFun" :hideInputNumber="true" btn-color="#08c163" title="点我付款"></cwx-keyboard>
|
|||
|
|
<cwx-keyboard v-else ref="clearMoney" @oninputBind="onMoneyInput" @confirmEvent="submitFun"
|
|||
|
|
:money.sync="list.realprice" btn-color="#08c163" title="付款"></cwx-keyboard>
|
|||
|
|
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script src="./index.js"></script>
|
|||
|
|
<style>
|
|||
|
|
@import './index.css';
|
|||
|
|
</style>
|