1690 lines
41 KiB
Vue
1690 lines
41 KiB
Vue
<template>
|
||
<view class="content">
|
||
<view class="container">
|
||
<view class="top">
|
||
<!-- 店铺信息 -->
|
||
<view class="dis">
|
||
<view class="top-img">
|
||
<image v-if="!store.logo" src="../../static/logo.png" mode="aspectFit"></image>
|
||
<image v-else :src="baseUrl+store.logo" mode="aspectFit"></image>
|
||
</view>
|
||
<view style="width: 80%;">
|
||
<view class="top-title">{{store.name}}{{store.description ? "("+store.description+")" : ""}}
|
||
</view><!--九州加油站（总站）-->
|
||
<view class="top-hui">{{store.address}}</view><!--平安大道东200米-->
|
||
|
||
</view>
|
||
</view>
|
||
<!-- 油品信息 -->
|
||
<view class="pkuang">
|
||
<view class="title_">
|
||
选择油品油枪
|
||
</view>
|
||
<view class="input_kuang">
|
||
<view class="leftIput" @click="selectShow = true">{{oilTypeName || '--'}}{{oilGunName || ''}}
|
||
</view>
|
||
<view class="rr_box" @click="Selectemployees = true">{{staffName || '--'}}</view>
|
||
</view>
|
||
<view style="display: flex;justify-content: space-between;">
|
||
<view class="title_">
|
||
加油金额
|
||
</view>
|
||
<view class="sm_r-zie" style="font-weight: bold;">{{oilPrice || 0}}元/{{oilUnit || 'L'}}</view>
|
||
</view>
|
||
<view class="input_kuang">
|
||
<view class="leftIput">
|
||
￥<input style="width: 100%;" v-model="oilOrder.orderAmount" @input="changeAmount()"
|
||
type="text" placeholder="请输入金额" />
|
||
</view>
|
||
<view class="rr_box">{{oilOrder.oilNum || 0}}L</view>
|
||
</view>
|
||
<view class="title_">
|
||
付款备注
|
||
</view>
|
||
<view class="input_kuang">
|
||
<input type="text" placeholder="备注" v-model="oilOrder.remark" style="margin-left: 10px;" />
|
||
</view>
|
||
</view>
|
||
<view class="b_"></view>
|
||
<!-- 支付方式 -->
|
||
<view class="pkuang">
|
||
<view class="title_">
|
||
支付方式
|
||
</view>
|
||
<view class="d-bs">
|
||
<image src="../../static/icon/hyk.png" style="width: 35px; height: 35px; "></image>
|
||
<view class="br-box">
|
||
<view style="font-size: 14px;">
|
||
<view class="">会员卡类型</view>
|
||
<view class="d-bs" style="align-items: center;border-bottom: none;"
|
||
@click="cardType = true">
|
||
<view style="font-size: 12px;">储值卡（余额：{{user.cardBalance}}）</view>
|
||
<view style="line-height: 20px;">
|
||
<u-icon name="arrow-right" size="12px"></u-icon>
|
||
</view>
|
||
|
||
</view>
|
||
</view>
|
||
<view class="anxuan">
|
||
<view class="dian"></view>
|
||
</view>
|
||
|
||
</view>
|
||
</view>
|
||
<view class="d-bs">
|
||
<image src="../../static/icon/wz.png" style="width: 35px; height: 35px; "></image>
|
||
<view class="br-box">
|
||
<view class="">微信</view>
|
||
<view class="anxuan">
|
||
<view class="dian"></view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="title_">
|
||
优惠信息
|
||
</view>
|
||
</view>
|
||
<!-- 优惠券信息 -->
|
||
<view class="d-bs" style="box-sizing: border-box; padding: 20px;" @click="selectCoupon = true">
|
||
<view class="">优惠券</view>
|
||
<view class="d-s">
|
||
<view class="">-20.00</view>
|
||
<u-icon name="arrow-right"></u-icon>
|
||
</view>
|
||
</view>
|
||
<!-- 消费有礼信息 -->
|
||
<view class="new-box" style="padding-top: 0px;">
|
||
<view class="title_">
|
||
消费有礼
|
||
</view>
|
||
<view class="bsd">
|
||
<view class="">积分</view>
|
||
<view class="">+289</view>
|
||
</view>
|
||
<view class="bsd">
|
||
<view class="">洗车券</view>
|
||
<view class="">+3</view>
|
||
</view>
|
||
</view>
|
||
<!-- 支付信息 -->
|
||
<view class="bs-box">
|
||
<view class="">
|
||
<view class="onetitle">¥{{oilOrder.payAmount}}</view>
|
||
<view class="orsize">共优惠¥{{oilOrder.discountAmount || 0}}</view>
|
||
</view>
|
||
<view class="d-s">
|
||
<view class="d-s" style="color: #999999;font-size: 12px; margin-right: 10px;"
|
||
@click="PaymentDetails = true">
|
||
<view class="">明细</view>
|
||
<u-icon name="arrow-down" size="12"></u-icon>
|
||
</view>
|
||
<view class="anniuf" @click="goPayment()">立即支付</view>
|
||
</view>
|
||
</view>
|
||
|
||
<view style="width: 100%; height: 60px; "></view>
|
||
</view>
|
||
|
||
<view style="margin-top: 50px;">
|
||
<uni-popup ref="popup1" type="bottom" background-color="white" mask-background-color="rgba(0,0,0,0.0)">
|
||
<keyboard :pApplt="appltType" @isPay="submitAmount" @amount="changeVal" @backVal="backspaceVal">
|
||
</keyboard>
|
||
</uni-popup>
|
||
</view>
|
||
<view>
|
||
<!-- 优惠券 -->
|
||
<u-popup :show="selectCoupon" closeable="true" mode="bottom" :round="10" @close="Couponclose">
|
||
<view class="popup-box">
|
||
<view class="p_title">选择优惠券</view>
|
||
<view class="p-tab">
|
||
<view :class="{'or' :tabIndex ==index }" v-for=" (item,index) in tabList"
|
||
@click="setabIndex(index)" :key="index">
|
||
<text>{{item.name}}</text> <text>( {{item.num}} )</text>
|
||
</view>
|
||
</view>
|
||
<view class="couponBox" v-if="tabIndex == 0">
|
||
<view class="cou_top">
|
||
<view class="d-s">
|
||
<view class="qaz"></view>
|
||
<view class="c_title">油品消费满减券</view>
|
||
</view>
|
||
<view class="c-r-num">¥10</view>
|
||
</view>
|
||
<view class="cou_top">
|
||
<view class="sm_size">有效期：2024-08-05 14:15:12~2024-08-15 14:15:11</view>
|
||
<view class="sm_r-zie">满200可用</view>
|
||
</view>
|
||
<view class="dashed_box"></view>
|
||
<view class="cou_top">
|
||
<view class="sb_size" :class="{ 'sb_xl' : RandR == true }">
|
||
以下支付方式可用：微信、支付宝、云闪付、pos刷卡、会以下支付方式可用：微信、支付宝、云闪付、pos刷卡、会以下支付方式可用：微信、支付宝、云闪付、pos刷卡、会以下支付方式可用：微信、支付宝、云闪付、pos刷卡、会以下支付方式可用：微信、支付宝、云闪付、pos刷卡、会以下支付方式可用：微信、支付宝、云闪付、pos刷卡、会以下支付方式可用：微信、支付宝、云闪付、pos刷卡
|
||
</view>
|
||
<view class="sm_r-zie" style="height: 14px; " @click="RandR =! RandR">适用详情 <u-icon
|
||
name="arrow-right" color="#E02020" size="10"></u-icon> </view>
|
||
</view>
|
||
</view>
|
||
<view class="couponBox_h" v-if="tabIndex == 1">
|
||
<view class="cou_top">
|
||
<view class="d-s">
|
||
<view class="qaz"></view>
|
||
<view class="c_title">油品消费满减券</view>
|
||
</view>
|
||
<view class="c-h-num">¥10</view>
|
||
</view>
|
||
<view class="cou_top">
|
||
<view class="sm_size">有效期：2024-08-05 14:15:12~2024-08-15 14:15:11</view>
|
||
<view class="sm_h-zie">满200可用</view>
|
||
</view>
|
||
<view class="dashed_box_h"></view>
|
||
<view class="cou_top">
|
||
<view class="sb_size" :class="{ 'sb_xl' : RandR == true }">
|
||
以下支付方式可用：微信、支付宝、云闪付、pos刷卡、会以下支付方式可用：微信、支付宝、云闪付、pos刷卡、会以下支付方式可用：微信、支付宝、云闪付、pos刷卡、会以下支付方式可用：微信、支付宝、云闪付、pos刷卡、会以下支付方式可用：微信、支付宝、云闪付、pos刷卡、会以下支付方式可用：微信、支付宝、云闪付、pos刷卡、会以下支付方式可用：微信、支付宝、云闪付、pos刷卡
|
||
</view>
|
||
<view class="sm_h-zie" style="height: 14px; " @click="RandR =! RandR">适用详情 <u-icon
|
||
name="arrow-right" color="#999" size="10"></u-icon> </view>
|
||
</view>
|
||
<view class="dashed_box_h"></view>
|
||
<view class="sm_r-zie" style="height: 14px; margin-bottom: 10px; " @click="RandR =! RandR">
|
||
不可用原因 <u-icon name="arrow-right" color="#E02020" size="10"></u-icon> </view>
|
||
<view class="sb_size">
|
||
不满足优惠券使用时间
|
||
不与其他优惠同时使用
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</u-popup>
|
||
<!-- 会员卡 -->
|
||
<u-popup :show="cardType" closeable="true" mode="bottom" :round="10" @close="cardTypeclose">
|
||
<view class="popup-box">
|
||
<view class="p_title">选择会员卡类型</view>
|
||
<view class="c_pox">
|
||
<view class="c_bs" style="margin-bottom: 15px;">
|
||
<view class="">储值卡</view>
|
||
<view class="anniubai">充值</view>
|
||
</view>
|
||
<view class="c_bs">
|
||
<view class="">{{user.cardBalance}}</view>
|
||
<!-- <view class="">NO.xxxxxxxxxxxxxxxxx</view> -->
|
||
</view>
|
||
</view>
|
||
<view class="c_pox" style="background: url('../../static/imgs/tyktc.png'); "
|
||
v-for="(item,index) in oilCardList" :key="index">
|
||
<view class="c_bs" style="margin-bottom: 15px; ">
|
||
<view class="">囤油卡</view>
|
||
<view class="anniubai" style="color: #70D0C7;">充值</view>
|
||
</view>
|
||
<view class="c_bs">
|
||
<view class="">{{item.fuelAmount}}</view>
|
||
<!-- <view class="">NO.xxxxxxxxxxxxxxxxx</view> -->
|
||
</view>
|
||
</view>
|
||
<view class="c_pox">
|
||
<view class="c_bs" style="margin-bottom: 15px;" v-for="(item,index) in fleetList" :key="index">
|
||
<view class="">{{item.fleetName}}</view>
|
||
<view class="anniubai">充值</view>
|
||
</view>
|
||
<view class="c_bs">
|
||
<view class="">{{item.totalBalance || 0}}</view>
|
||
<!-- <view class="">NO.xxxxxxxxxxxxxxxxx</view> -->
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</u-popup>
|
||
<!-- 选择员工 -->
|
||
<u-popup :show="Selectemployees" closeable="true" mode="bottom" :round="10" @close="Selectclose">
|
||
<view class="popup-box">
|
||
<view class="p_title">选择员工</view>
|
||
<view class="wr_box">
|
||
<view class="xanniu" :class="{'acvit' : anIndex == index }"
|
||
v-for="(item,index) in staffList" :key="index" @click="setadindex(index,item)">
|
||
|
||
<view class="">{{item.realName}}</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</u-popup>
|
||
<!-- 选择油品油枪 -->
|
||
<u-popup :show="selectShow" closeable="true" mode="bottom" :round="10" @close="ypClose">
|
||
<view class="popup-box">
|
||
<view class="p_title">选择油品油枪</view>
|
||
<scroll-view scroll-x="true" class="tap-top">
|
||
<view class="sz" :class="{'acvit': qhindex == index}" v-for="(item,index) in oilNumberList"
|
||
:key="index" @click="setQindex(index,item)">
|
||
<view>{{item.oilName}}</view>
|
||
</view>
|
||
|
||
</scroll-view>
|
||
<view class="wr_box">
|
||
<view class="xanniu" :class="{'acvit' : anIndex == index }"
|
||
v-for="(item,index) in oilGunList" :key="index" @click="setQhindex(index,item)">
|
||
<view class="">{{item.gunName}}</view>
|
||
<view class="">{{item.oilName}}</view>
|
||
</view>
|
||
</view>
|
||
|
||
</view>
|
||
</u-popup>
|
||
<!-- 应支付 -->
|
||
<u-popup :show="ConfirmPayment" closeable="true" mode="bottom" :round="10" @close="Confirmclose">
|
||
<view class="popup-box">
|
||
<view class="p_title">确认支付</view>
|
||
<view class="p_ds">
|
||
<image src="../../static/imgs/zficon.png" style="width: 36px; height: 36px; "></image>
|
||
<view class="p_ds" style="width: 85%;">
|
||
<view class="">
|
||
<view class="">消费应支付{{oilOrder.payAmount}}元</view>
|
||
<view class="sm-size">会员-储值卡（余额：{{user.cardBalance}}）</view>
|
||
</view>
|
||
<view class="anxuan">
|
||
<view class="dian"></view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="annius" @click="payment()">立即支付{{oilOrder.payAmount}}元</view>
|
||
</view>
|
||
</u-popup>
|
||
<!-- 订单明细 -->
|
||
<u-popup :show="PaymentDetails" closeable="true" mode="bottom" :round="10" @close="close">
|
||
<view class="popup-box">
|
||
<view class="p_title">待支付明细</view>
|
||
<view class="">商品信息</view>
|
||
<view class="p_bs">
|
||
<view class="">油品油枪</view>
|
||
<view class="">{{oilTypeName || '--'}}{{oilGunName || ''}}</view>
|
||
</view>
|
||
<view class="p_bs">
|
||
<view class="">员工</view>
|
||
<view class="">{{staffName || '--'}}</view>
|
||
</view>
|
||
<view class="p_bs">
|
||
<view class="">油品单价</view>
|
||
<view class="">{{oilPrice || 0}}元/{{oilUnit || 'L'}}</view>
|
||
</view>
|
||
<view class="p_bs">
|
||
<view class="">加油升数</view>
|
||
<view class="">约{{oilOrder.oilNum}}L</view>
|
||
</view>
|
||
<view class="p_bs">
|
||
<view class="">加油金额</view>
|
||
<view class="">{{oilOrder.orderAmount}}元</view>
|
||
</view>
|
||
<view class="p_x"></view>
|
||
<view class="">优惠信息</view>
|
||
<view class="p_bs">
|
||
<view class="">优惠券</view>
|
||
<view class="r-size">-10.00</view>
|
||
</view>
|
||
<view class="p_x"></view>
|
||
<view class="">消费有礼</view>
|
||
<view class="p_bs">
|
||
<view class="">积分</view>
|
||
<view class="r-size">+567</view>
|
||
</view>
|
||
<view class="p_bs">
|
||
<view class="">洗车券</view>
|
||
<view class="r-size">+6</view>
|
||
</view>
|
||
<view class="p_x"></view>
|
||
<view class="p_bs">
|
||
<view class="">合计待支付</view>
|
||
<view class="r-size">{{oilOrder.payAmount}}</view>
|
||
</view>
|
||
<view class="p_x"></view>
|
||
</view>
|
||
</u-popup>
|
||
|
||
</view>
|
||
|
||
<tabbar :msg="msg"></tabbar>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import tabbar from "../../components/tabbar/tabbar.vue"
|
||
import config from '@/config'
|
||
import request from '../../utils/request'
|
||
export default {
|
||
data() {
|
||
return {
|
||
selectCoupon: false,
|
||
cardType: false,
|
||
selectShow: false,
|
||
Selectemployees: false,
|
||
ConfirmPayment: false,
|
||
PaymentDetails: false,
|
||
anIndex: 0,
|
||
qhindex: 0,
|
||
msg: "2",
|
||
RandR: false,
|
||
tabList: [{
|
||
name: '可用优惠券',
|
||
num: 1
|
||
},
|
||
{
|
||
name: '不可用优惠券',
|
||
num: 2
|
||
},
|
||
],
|
||
tabIndex: 0,
|
||
appltType: uni.getStorageSync("appltType"),
|
||
value: '',
|
||
liters: 0,
|
||
show: false,
|
||
pic: 0,
|
||
hindex: 0,
|
||
qindex: 0,
|
||
aindex: null,
|
||
sindex: null,
|
||
// 店铺信息
|
||
store: {
|
||
name: "测试油站",
|
||
description: "济南分店",
|
||
address: "济南槐荫区"
|
||
},
|
||
// 当前店铺id
|
||
storeId: "",
|
||
// 油号列表信息
|
||
oilNumberList: [],
|
||
// 油枪列表信息
|
||
oilGunList: [],
|
||
// 员工列表信息
|
||
staffList: [],
|
||
// 加油金额列表
|
||
amountList: [100, 200, 300],
|
||
// url信息
|
||
baseUrl: this.$baseUrl,
|
||
// 油价
|
||
oilPrice: 0,
|
||
// 油品单位
|
||
oilUnit: "",
|
||
AppToken: uni.getStorageSync("App-Token"),
|
||
|
||
// 选择的油品类型信息
|
||
oilTypeName: '',
|
||
// 选择的油枪信息
|
||
oilGunName: '',
|
||
// 店员名称
|
||
staffName: '',
|
||
// 油品订单信息
|
||
oilOrder: {
|
||
storeId: "",
|
||
couponId: "",
|
||
commissionAmount: 0,
|
||
staffId: "",
|
||
terminal: "applet",
|
||
oils: "",
|
||
oilGunNum: "",
|
||
oilNum: 0,
|
||
orderAmount: 0,
|
||
discountAmount: 0,
|
||
payAmount: 0,
|
||
payType: uni.getStorageSync("appltType"),
|
||
},
|
||
// 优惠券列表
|
||
couponList: [],
|
||
// 是否登录
|
||
ifLogin: false,
|
||
orderInfo: {},
|
||
user: {},
|
||
oilCardList: [],
|
||
fleetList: []
|
||
}
|
||
},
|
||
components: {
|
||
tabbar
|
||
},
|
||
onLoad(query) {
|
||
if (uni.getStorageSync("appltType") == "WECHAT") {
|
||
const q = decodeURIComponent(query.q) // 获取到二维码原始链接内容
|
||
if (query.q) {
|
||
let str = q.split("?")[1];
|
||
let storeId = "19";
|
||
|
||
let staffId = "";
|
||
let sn = "";
|
||
if (str.includes("&")) {
|
||
let arr = str.split("&");
|
||
arr.forEach(item => {
|
||
if (item.includes("storeId")) {
|
||
storeId = item.split("=")[1]
|
||
} else if (item.includes("staffId")) {
|
||
staffId = item.split("=")[1]
|
||
} else {
|
||
sn = item.split("=")[1]
|
||
}
|
||
})
|
||
} else {
|
||
if (str.includes("storeId")) {
|
||
storeId = str.split("=")[1]
|
||
} else {
|
||
sn = str.split("=")[1]
|
||
this.getStoreIdBySn(sn);
|
||
}
|
||
}
|
||
uni.setStorageSync("storeId", storeId)
|
||
uni.setStorageSync("sn", sn)
|
||
uni.setStorageSync("inviteStaffId", staffId)
|
||
this.storeId = uni.getStorageSync("storeId")
|
||
this.staffId = uni.getStorageSync("inviteStaffId")
|
||
if (uni.getStorageSync("storeId")) {
|
||
this.getStore(uni.getStorageSync("storeId"));
|
||
}
|
||
|
||
}
|
||
} else {
|
||
if (uni.getStorageSync("storeId")) {
|
||
this.getStore(uni.getStorageSync("storeId"));
|
||
} else {
|
||
this.getStoreIdBySn(uni.getStorageSync("sn"));
|
||
}
|
||
}
|
||
|
||
if (query.staffId) {
|
||
uni.setStorageSync("inviteStaffId", query.staffId)
|
||
uni.setStorageSync("storeId", query.storeId)
|
||
this.staffId = query.staffId
|
||
this.storeId = query.storeId
|
||
this.getStore(uni.getStorageSync("storeId"));
|
||
}
|
||
|
||
},
|
||
onShow() {
|
||
this.getStore(uni.getStorageSync("storeId"));
|
||
this.getTheJudgmentIsTheSame()
|
||
this.getOilCard()
|
||
},
|
||
|
||
methods: {
|
||
// 获取储值卡信息
|
||
getOilCard() {
|
||
request({
|
||
url: "business/userManager/user/storeUserInfo/" + uni.getStorageSync("storeId"),
|
||
method: 'get',
|
||
}).then(res => {
|
||
console.log(res, 491);
|
||
this.user = res.data
|
||
this.oilCardList = res.data.userFuels
|
||
this.fleetList = res.data.fleetInfoUniVos
|
||
})
|
||
},
|
||
// 支付接口
|
||
payment() {
|
||
this.ifLogin = this.AppToken ? true : false
|
||
let map = {
|
||
orderNo: this.oilOrder.orderNo,
|
||
payAmount: this.oilOrder.payAmount,
|
||
discountAmount: this.oilOrder.discountAmount,
|
||
oilCardAmount: '',
|
||
oilCardLiters: this.oilOrder.oilCardAmount || 0,
|
||
balanceAmount: this.oilOrder.balanceAmount || 0,
|
||
isOilStorageCard: false,
|
||
tankId: this.oilOrder.tankId,
|
||
isUseChildCard: false,
|
||
// activeId: this.preferentialData.activeId,
|
||
// cardFavorableId: this.preferentialData.cardFavorableId,
|
||
// recordId: this.preferentialData.recordId,
|
||
// type: this.preferentialData.type,
|
||
// balanceAmountSale: this.balanceRedece,
|
||
// oilCardAmountSale: this.oilCardRedece,
|
||
ifLogin: this.ifLogin,
|
||
// levelAmount: this.levelAmount,
|
||
// activeAmount: this.activeAmount
|
||
};
|
||
let _this = this;
|
||
request({
|
||
url: "business/oilOrder/appletPay",
|
||
method: 'post',
|
||
data: map,
|
||
}).then(res => {
|
||
let payProvider = "wxpay"
|
||
if (_this.appltType == "WECHAT") {
|
||
payProvider = "wxpay"
|
||
} else {
|
||
payProvider = "alipay"
|
||
}
|
||
if (res.data.error) {
|
||
request({
|
||
url: "/business/allOrderInfo/orderStatus",
|
||
method: 'post',
|
||
data: {
|
||
"orderNo": _this.oilOrder.orderNo,
|
||
"status": "payFail"
|
||
},
|
||
}).then((ress) => {})
|
||
uni.showToast({
|
||
title: res.data.error,
|
||
icon: "none"
|
||
})
|
||
return;
|
||
}
|
||
if (res.data.code == "error") {
|
||
request({
|
||
url: "/business/allOrderInfo/orderStatus",
|
||
method: 'post',
|
||
data: {
|
||
"orderNo": _this.oilOrder.orderNo,
|
||
"status": "payFail"
|
||
},
|
||
}).then((ress) => {})
|
||
uni.showToast({
|
||
title: "支付失败，请联系商家",
|
||
icon: "none"
|
||
})
|
||
return;
|
||
}
|
||
if (res.data.success == "ok") {
|
||
uni.redirectTo({
|
||
url: '/pagesRefuel/orderSuccess/index?orderNo=' + _this.oilOrder.orderNo,
|
||
})
|
||
return;
|
||
}
|
||
if (res.data.resultMsg == "商户订单号重复") {
|
||
uni.showToast({
|
||
title: "商户订单号重复，请重新选择订单信息进行支付！",
|
||
icon: "none"
|
||
})
|
||
}
|
||
if (res.data.data.reservedPayInfo) {
|
||
_this.orderInfo = JSON.parse(res.data.data.reservedPayInfo);
|
||
uni.requestPayment({
|
||
// 微信支付provider: 'wxpay' 支付宝支付 'alipay'
|
||
provider: payProvider,
|
||
// 时间戳
|
||
timeStamp: _this.orderInfo.timeStamp,
|
||
// 随机字符串
|
||
nonceStr: _this.orderInfo.nonceStr,
|
||
// 固定值
|
||
package: _this.orderInfo.package,
|
||
// 解密方式
|
||
signType: 'MD5',
|
||
// 支付签名
|
||
paySign: _this.orderInfo.paySign,
|
||
success: function(res) {
|
||
console.log('success');
|
||
uni.redirectTo({
|
||
url: '/pagesRefuel/orderSuccess/index?orderNo=' + _this
|
||
.oilOrder.orderNo,
|
||
})
|
||
},
|
||
fail: function(err) {
|
||
request({
|
||
url: "/business/allOrderInfo/orderStatus",
|
||
method: 'post',
|
||
data: {
|
||
"orderNo": res.data.data.orderNo,
|
||
"status": "payFail"
|
||
},
|
||
}).then((res) => {
|
||
uni.showToast({
|
||
title: "支付失败!",
|
||
icon: "error"
|
||
})
|
||
})
|
||
console.log('fail:', err);
|
||
}
|
||
});
|
||
}
|
||
if (_this.appltType == "ALIPAY") {
|
||
my.tradePay({
|
||
tradeNO: res.data.data.reservedTransactionId
|
||
}, function(resp) {
|
||
if (resp.resultCode == '9000') {
|
||
console.log("支付成功")
|
||
uni.redirectTo({
|
||
url: '/pagesRefuel/orderSuccess/index?orderNo=' + _this
|
||
.oilOrder.orderNo,
|
||
})
|
||
} else {
|
||
request({
|
||
url: "/business/allOrderInfo/orderStatus",
|
||
method: 'post',
|
||
data: {
|
||
"orderNo": res.data.data.orderNo,
|
||
"status": "payFail"
|
||
},
|
||
}).then((res) => {
|
||
uni.showToast({
|
||
title: "支付失败!",
|
||
icon: "error"
|
||
})
|
||
})
|
||
console.log('支付失败，' + resp.resultCode);
|
||
}
|
||
});
|
||
}
|
||
})
|
||
},
|
||
changeAmount() {
|
||
if (this.oilOrder.orderAmount) {
|
||
this.oilOrder.payAmount = this.oilOrder.orderAmount - this.oilOrder.discountAmount
|
||
this.oilOrder.oilNum = (this.oilOrder.orderAmount / this.oilPrice).toFixed(2)
|
||
}
|
||
},
|
||
getCouponList() {
|
||
request({
|
||
url: "pay/paycenter/getCoupon",
|
||
method: 'post',
|
||
data: {
|
||
userId: uni.getStorageSync('userId'),
|
||
oilId: this.oilOrder.oils,
|
||
oilAmount: this.oilOrder.amount,
|
||
oilLiter: this.oilOrder.oilNum,
|
||
payWay: this.oilOrder.payType,
|
||
},
|
||
}).then((res) => {
|
||
|
||
}).catch(err => {})
|
||
},
|
||
Couponclose() {
|
||
this.selectCoupon = false
|
||
},
|
||
setabIndex(index) {
|
||
this.tabIndex = index
|
||
},
|
||
cardTypeclose() {
|
||
this.cardType = false
|
||
},
|
||
setQindex(index, data) {
|
||
this.qhindex = index
|
||
this.oilGunList = data.oilGunList
|
||
if (data.oilGunList.length > 0) {
|
||
this.oilOrder.oilGunNum = data.oilGunList[0].id
|
||
this.oilPrice = data.oilPrice
|
||
this.oilUnit = data.unit
|
||
this.oilOrder.oils = data.oilNameId
|
||
this.oilOrder.tankId = data.oilGunList[0].tankId
|
||
uni.setStorageSync("tankId", data.oilGunList[0].tankId)
|
||
this.oilGunName = data.oilGunList[0].gunName
|
||
}
|
||
|
||
this.oilTypeName = data.oilType + data.oilName
|
||
},
|
||
ypClose() {
|
||
this.selectShow = false
|
||
},
|
||
setadindex(index, data) {
|
||
this.anIndex = index
|
||
this.Selectemployees = false
|
||
this.oilOrder.staffId = data.id
|
||
this.staffName = data.realName
|
||
},
|
||
setQhindex(index, data) {
|
||
this.qhindex = index
|
||
this.selectShow = false
|
||
this.oilOrder.oilGunNum = data.id
|
||
this.oilOrder.tankId = data.tankId
|
||
uni.setStorageSync("tankId", data.tankId)
|
||
this.oilGunName = data.gunName
|
||
},
|
||
|
||
Confirmclose() {
|
||
this.ConfirmPayment = false
|
||
},
|
||
goPayment() {
|
||
// 判断一下按照什么方式支付的
|
||
if (this.oilOrder.orderAmount <= 0) {
|
||
uni.showToast({
|
||
title: "请先输入加油金额",
|
||
icon: 'none'
|
||
})
|
||
return;
|
||
}
|
||
request({
|
||
url: "business/petrolStationManagement/oilTank/" + uni.getStorageSync('tankId'),
|
||
method: 'get',
|
||
}).then((res) => {
|
||
if (res.data.storedQuantity - this.oilOrder.oilNum < 0) {
|
||
uni.showToast({
|
||
title: "所加油的升数大于油罐内的升数，请重新选择加油升数",
|
||
icon: "none"
|
||
})
|
||
return;
|
||
} else {
|
||
this.ConfirmPayment = true
|
||
this.addOrder()
|
||
}
|
||
})
|
||
|
||
},
|
||
// 点击支付添加油品订单信息
|
||
addOrder() {
|
||
this.oilOrder.storeId = uni.getStorageSync('storeId')
|
||
request({
|
||
url: "business/oilOrder/addOilOrder",
|
||
method: 'post',
|
||
data: this.oilOrder,
|
||
}).then((res) => {
|
||
this.oilOrder = res.data
|
||
})
|
||
},
|
||
Selectclose() {
|
||
this.Selectemployees = false
|
||
},
|
||
close() {
|
||
this.PaymentDetails = false
|
||
},
|
||
// 获取当前位置
|
||
getAddress(storeId) {
|
||
let _this = this;
|
||
uni.getLocation({
|
||
// 谷歌使用wgs84 其他使用gcj02
|
||
type: 'gcj02', // 使用国测局坐标系
|
||
success: function(res) {
|
||
if (_this.longitude == "" && _this.latitude == "") {
|
||
|
||
_this.longitude = res.longitude;
|
||
_this.latitude = res.latitude
|
||
}
|
||
console.log('经度: ' + _this.longitude);
|
||
console.log('纬度: ' + _this.latitude);
|
||
request({
|
||
url: 'business/storeInformation/store/recentlyStore',
|
||
method: 'post',
|
||
data: {
|
||
"lon": _this.longitude,
|
||
"lat": _this.latitude,
|
||
"storeId": storeId,
|
||
"isLogin": _this.AppToken ? "0" : "1", // 0为登录
|
||
|
||
},
|
||
}).then((response) => {
|
||
console.log(response, "2154");
|
||
// uni.showToast({
|
||
// title:"121984:"+storeId
|
||
// })
|
||
if (response.data.store) {
|
||
_this.store = response.data.store
|
||
uni.setStorageSync("storeId", response.data.store.id)
|
||
uni.setStorageSync("chainStoreId", response.data.store.chainStoreId)
|
||
_this.getOilNumber(response.data.store.id);
|
||
} else {
|
||
uni.showToast({
|
||
title: "当前店铺已关闭！！！",
|
||
icon: "none"
|
||
})
|
||
}
|
||
|
||
}).catch(err => {})
|
||
},
|
||
fail: function(err) {
|
||
_this.getStore(2);
|
||
console.log('获取位置信息失败: ' + err.errMsg);
|
||
}
|
||
});
|
||
},
|
||
// 通过sn获取storeId
|
||
getStoreIdBySn(sn) {
|
||
request({
|
||
url: "business/tag/oilTag/getSn/" + sn,
|
||
method: 'get'
|
||
}).then((res) => {
|
||
uni.setStorageSync("storeId", res.data.storeId)
|
||
if (res.data.storeId) {
|
||
this.getStore(uni.getStorageSync("storeId"));
|
||
} else {
|
||
this.getAddress(uni.getStorageSync("storeId"));
|
||
}
|
||
})
|
||
},
|
||
// 获取门店信息
|
||
getStore(id) {
|
||
if (!id) {
|
||
return;
|
||
}
|
||
let _this = this;
|
||
request({
|
||
url: "business/storeInformation/store/queryStoreById",
|
||
method: 'post',
|
||
data: {
|
||
"storeId": id
|
||
},
|
||
}).then((res) => {
|
||
_this.getOilNumber(id);
|
||
_this.getStaffList(id)
|
||
_this.store = res.data
|
||
_this.storeId = res.data.id;
|
||
uni.setStorageSync("storeId", _this.store.id)
|
||
uni.setStorageSync("chainStoreId", _this.store.chainStoreId)
|
||
}).catch(err => {})
|
||
},
|
||
// 获取当前店铺油号信息
|
||
getOilNumber(storeId) {
|
||
let _this = this;
|
||
request({
|
||
// url: "business/petrolStationManagement/oilNumber/getOilNumberName/" + storeId,
|
||
url: "business/petrolStationManagement/oilGun/selectByNumber/" + storeId,
|
||
method: 'get',
|
||
}).then((res) => {
|
||
_this.oilNumberList = res.data;
|
||
if (res.data.length > 0) {
|
||
// _this.getOilGun(res.data[0].numberId);
|
||
_this.oilPrice = res.data[0].oilPrice
|
||
_this.oilUnit = res.data[0].unit
|
||
_this.oilOrder.oils = res.data[0].oilNameId
|
||
_this.oilTypeName = res.data[0].oilType + res.data[0].oilName
|
||
if (res.data[0].oilGunList) {
|
||
_this.oilGunList = res.data[0].oilGunList
|
||
_this.oilOrder.oilGunNum = res.data[0].oilGunList[0].id
|
||
_this.oilOrder.tankId = res.data[0].oilGunList[0].tankId
|
||
uni.setStorageSync("tankId", res.data[0].oilGunList[0].tankId)
|
||
_this.oilGunName = res.data[0].oilGunList[0].gunName
|
||
}
|
||
}
|
||
})
|
||
},
|
||
// 获取当前店铺油号对应的油枪信息
|
||
getOilGun(numberId) {
|
||
let _this = this;
|
||
request({
|
||
url: "business/petrolStationManagement/oilGun/queryGunList/" + numberId,
|
||
method: 'get',
|
||
}).then((res) => {
|
||
_this.oilGunList = res.data
|
||
_this.oilOrder.oilGunNum = res.data[0].id
|
||
})
|
||
},
|
||
// 获取当前店铺员工信息列表
|
||
getStaffList(storeId) {
|
||
if (!storeId) {
|
||
return;
|
||
}
|
||
let _this = this;
|
||
request({
|
||
url: "business/member/staff/queryList1/" + storeId,
|
||
method: 'get',
|
||
}).then((res) => {
|
||
_this.staffList = res.data
|
||
if (res.data && res.data.length > 0) {
|
||
_this.oilOrder.staffId = res.data[0].id
|
||
_this.staffName = res.data[0].realName
|
||
}
|
||
})
|
||
},
|
||
// 跳转订单详情页，并支付
|
||
getSIndex(index, id) {
|
||
this.sindex = index
|
||
// 校验油罐内油量是否足够
|
||
request({
|
||
url: "business/petrolStationManagement/oilTank/" + uni.getStorageSync('tankId'),
|
||
method: 'get',
|
||
}).then((res) => {
|
||
if (res.data.storedQuantity - this.liters < 0) {
|
||
uni.showToast({
|
||
title: "所加油的升数大于油罐内的升数，请重新选择加油升数",
|
||
icon: "none"
|
||
})
|
||
return;
|
||
} else {
|
||
this.toPayment(id)
|
||
}
|
||
})
|
||
},
|
||
// 去支付（之前的）
|
||
toPayment(id) {
|
||
this.oilOrder.orderAmount = this.value
|
||
this.oilOrder.storeId = this.storeId
|
||
this.oilOrder.staffId = id
|
||
this.oilOrder.oilNum = (this.value / this.oilPrice).toFixed(2)
|
||
this.oilOrder.tankId = uni.getStorageSync("tankId")
|
||
this.oilOrder.oilTagSn = uni.getStorageSync("sn")
|
||
let _this = this;
|
||
// 添加油品订单信息
|
||
request({
|
||
url: "business/oilOrder/addOilOrder",
|
||
method: 'post',
|
||
data: _this.oilOrder,
|
||
}).then((res) => {
|
||
uni.navigateTo({
|
||
url: '/pagesRefuel/orderDetail/index?orderNo=' + res.data,
|
||
})
|
||
})
|
||
},
|
||
// 选择加油金额
|
||
getAIndex(index, amount) {
|
||
this.value = amount + ""
|
||
this.aindex = index
|
||
this.liters = (amount / this.oilPrice).toFixed(2)
|
||
},
|
||
// 选择油品信息
|
||
getHIndex(index, data) {
|
||
this.hindex = index
|
||
// console.log(data)
|
||
// this.getOilGun(data.numberId)
|
||
this.oilGunList = data.oilGunList
|
||
this.oilOrder.oilGunNum = data.oilGunList[0].id
|
||
this.oilPrice = data.oilPrice
|
||
this.oilUnit = data.unit
|
||
this.oilOrder.oils = data.oilNameId
|
||
uni.setStorageSync("tankId", data.oilGunList[0].tankId)
|
||
},
|
||
// 选择油枪信息
|
||
getQIndex(index, data) {
|
||
this.qindex = index
|
||
this.oilOrder.oilGunNum = data.id
|
||
uni.setStorageSync("tankId", data.tankId)
|
||
},
|
||
// 数字键盘确定按钮
|
||
submitAmount() {
|
||
// 校验油罐内油量是否足够
|
||
request({
|
||
url: "business/petrolStationManagement/oilTank/" + uni.getStorageSync('tankId'),
|
||
method: 'get',
|
||
}).then((res) => {
|
||
if (res.data.storedQuantity - this.liters < 0) {
|
||
uni.showToast({
|
||
title: "所加油的升数大于油罐内的升数，请重新选择加油升数",
|
||
icon: "none"
|
||
})
|
||
return;
|
||
} else {
|
||
if (this.value != "" && this.qindex != null) {
|
||
this.show = false
|
||
if (uni.getStorageSync("inviteStaffId") || this.staffList.length == 0) {
|
||
this.toPayment(uni.getStorageSync("inviteStaffId"))
|
||
} else {
|
||
// this.$refs.popup.open('bottom')
|
||
this.toPayment(uni.getStorageSync("inviteStaffId"))
|
||
}
|
||
} else {
|
||
if (this.value == "") {
|
||
uni.showToast({
|
||
title: "请输入加油金额",
|
||
icon: "error"
|
||
})
|
||
} else {
|
||
uni.showToast({
|
||
title: "请选择油枪号",
|
||
icon: "error"
|
||
})
|
||
}
|
||
}
|
||
}
|
||
})
|
||
|
||
|
||
},
|
||
changeVal(val) {
|
||
this.value = val;
|
||
this.liters = (this.value / this.oilPrice).toFixed(2)
|
||
},
|
||
backspaceVal(val) {
|
||
this.value = val;
|
||
if (val == "") {
|
||
this.amount = 0
|
||
this.liters = 0
|
||
} else {
|
||
this.amount = val;
|
||
this.liters = (this.value / this.oilPrice).toFixed(2)
|
||
}
|
||
},
|
||
// 判断token是否与当前连锁店id相同
|
||
async getTheJudgmentIsTheSame() {
|
||
if (this.AppToken) {
|
||
await request({
|
||
url: 'chainStoreInfo/theJudgmentIsTheSame',
|
||
method: 'get',
|
||
data: {
|
||
"chainStoreId": uni.getStorageSync("chainStoreId")
|
||
}
|
||
}).then(res => {
|
||
if (!res.data) {
|
||
uni.removeStorageSync("App-Token");
|
||
}
|
||
})
|
||
}
|
||
|
||
if (uni.getStorageSync("appltType") == "WECHAT") {
|
||
// 判断当前登录的code是否相同
|
||
wx.login({
|
||
success(res) {
|
||
console.log(res);
|
||
if (res.code) {
|
||
//发起网络请求
|
||
request({
|
||
url: 'clientApi/sign/mpWxLogin2',
|
||
method: "POST",
|
||
data: {
|
||
code: res.code,
|
||
isRefuel: true,
|
||
}
|
||
}).then(resp => {
|
||
if (!resp.data) {
|
||
uni.removeStorageSync("App-Token");
|
||
}
|
||
})
|
||
} else {
|
||
console.log('登录失败！' + res.errMsg)
|
||
}
|
||
}
|
||
})
|
||
}
|
||
|
||
if (uni.getStorageSync("appltType") == "ALIPAY") {
|
||
my.getAuthCode({
|
||
scopes: 'auth_base',
|
||
success: res => {
|
||
const authCode = res.authCode;
|
||
console.log(res)
|
||
request({
|
||
url: "clientApi/sign/alipayLogin/getUserid2",
|
||
method: 'post',
|
||
data: {
|
||
authCode: authCode,
|
||
storeId: uni.getStorageSync("storeId"),
|
||
isRefuel: true,
|
||
},
|
||
}).then((resp) => {
|
||
if (!resp.data) {
|
||
uni.removeStorageSync("App-Token");
|
||
}
|
||
})
|
||
},
|
||
fail: err => {
|
||
console.log('my.getAuthCode 调用失败', err)
|
||
}
|
||
});
|
||
}
|
||
},
|
||
}
|
||
|
||
}
|
||
</script>
|
||
|
||
<style scoped lang="scss">
|
||
.content {
|
||
background: #ffffff;
|
||
}
|
||
|
||
.container {
|
||
width: 100%;
|
||
height: 100vh;
|
||
box-sizing: border-box;
|
||
padding-top: 10px;
|
||
|
||
}
|
||
|
||
.my-header {
|
||
width: 100%;
|
||
height: 88px;
|
||
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
color: white;
|
||
|
||
.my-text {
|
||
margin-top: 40px
|
||
}
|
||
|
||
position: fixed;
|
||
top: 0px;
|
||
}
|
||
|
||
.top {
|
||
width: 100%;
|
||
height: 200px;
|
||
box-sizing: border-box;
|
||
padding: 1px;
|
||
|
||
}
|
||
|
||
.top-box {
|
||
width: 90%;
|
||
height: 110px;
|
||
background-color: #ffffff;
|
||
border-radius: 8px;
|
||
margin: 10px auto;
|
||
box-sizing: border-box;
|
||
padding: 10px;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
|
||
}
|
||
|
||
.top-title {
|
||
font-size: 16px;
|
||
}
|
||
|
||
.top-img {
|
||
width: 46px;
|
||
height: 46px;
|
||
background-color: #eee;
|
||
border-radius: 6px;
|
||
overflow: hidden;
|
||
margin-right: 10px;
|
||
|
||
image {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
|
||
.top-hui {
|
||
font-size: 14px;
|
||
margin: 5px 0px;
|
||
color: #999999;
|
||
text-overflow: -o-ellipsis-lastline;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
display: -webkit-box;
|
||
-webkit-line-clamp: 2;
|
||
line-clamp: 2;
|
||
-webkit-box-orient: vertical;
|
||
}
|
||
|
||
.top-hong {
|
||
font-size: 16px;
|
||
font-weight: bold;
|
||
color: #ff0000;
|
||
}
|
||
|
||
.dis {
|
||
display: flex;
|
||
margin: 0px 20px;
|
||
}
|
||
|
||
.bulu {
|
||
color: #304fff;
|
||
}
|
||
|
||
.bulu-icon {
|
||
width: 120px;
|
||
height: 20px;
|
||
font-size: 12px;
|
||
color: #304fff;
|
||
border: 1px solid #304fff;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
}
|
||
|
||
.wrap-box {
|
||
width: 100%;
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
}
|
||
|
||
.wrap-box1 {
|
||
width: 100%;
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
|
||
overflow-y: scroll;
|
||
}
|
||
|
||
.box-oil {
|
||
width: 23%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
color: #666666;
|
||
background: #f7f7f7;
|
||
margin-right: 5px;
|
||
margin-top: 5px;
|
||
padding: 12px 0px;
|
||
border-radius: 6px;
|
||
}
|
||
|
||
.box-oil1 {
|
||
width: 29%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
color: #666666;
|
||
background: #f7f7f7;
|
||
margin-right: 13px;
|
||
margin-top: 5px;
|
||
padding: 12px 0px;
|
||
border-radius: 6px;
|
||
margin-bottom: 10px;
|
||
}
|
||
|
||
.box-oil2 {
|
||
width: 28%;
|
||
height: 25px;
|
||
line-height: 25px;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
color: #666666;
|
||
background: white;
|
||
margin-right: 13px;
|
||
|
||
padding: 12px 0px;
|
||
border-radius: 6px;
|
||
}
|
||
|
||
.fa-box {
|
||
width: 90%;
|
||
margin: 20px auto;
|
||
}
|
||
|
||
.fa-title {
|
||
font-size: 18px;
|
||
margin: 10px 0px;
|
||
}
|
||
|
||
.xz {
|
||
color: #ffffff;
|
||
background: #1678ff;
|
||
}
|
||
|
||
.anniu {
|
||
width: 90%;
|
||
margin: 10px auto;
|
||
height: 40px;
|
||
background: #1678ff;
|
||
color: white;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
border-radius: 6px;
|
||
}
|
||
|
||
.inputkuang {
|
||
width: 100%;
|
||
height: 40px;
|
||
border: 1px solid #304fff;
|
||
border-radius: 6px;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
box-sizing: border-box;
|
||
padding: 0px 10px;
|
||
}
|
||
|
||
.sbox {
|
||
width: 33%;
|
||
|
||
}
|
||
|
||
.sbox-hui {
|
||
width: 33%;
|
||
text-align: right;
|
||
color: #999999;
|
||
}
|
||
|
||
.input_kuang {
|
||
width: 100%;
|
||
border-radius: 4px;
|
||
border: 1px solid #EEEEEE;
|
||
height: 40px;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
}
|
||
|
||
.leftIput {
|
||
box-sizing: border-box;
|
||
padding-left: 10px;
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
|
||
.rr_box {
|
||
width: 80px;
|
||
height: 40px;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
border-left: 1px solid #eee;
|
||
}
|
||
|
||
.pkuang {
|
||
box-sizing: border-box;
|
||
padding: 10px 20px;
|
||
}
|
||
|
||
.title_ {
|
||
font-weight: 600;
|
||
font-size: 16px;
|
||
color: #333333;
|
||
margin: 10px 0px;
|
||
}
|
||
|
||
.b_ {
|
||
width: 90%;
|
||
border-bottom: 1px solid #eee;
|
||
margin: 5px auto;
|
||
}
|
||
|
||
.d-bs {
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
border-bottom: 1px solid #EEEEEE;
|
||
box-sizing: border-box;
|
||
padding: 10px 0px;
|
||
}
|
||
|
||
.br-box {
|
||
width: 85%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
}
|
||
|
||
.d-s {
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
|
||
.new-box {
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
padding: 20px;
|
||
border-bottom: 1px solid #EEEEEE;
|
||
}
|
||
|
||
.bsd {
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
}
|
||
|
||
.bs-box {
|
||
box-sizing: border-box;
|
||
width: 100%;
|
||
padding: 20px 15px;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
}
|
||
|
||
.anniuf {
|
||
width: 90px;
|
||
height: 30px;
|
||
background: #FA6400;
|
||
border-radius: 50px;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
color: #fff;
|
||
}
|
||
|
||
.onetitle {
|
||
font-weight: 600;
|
||
font-size: 24px;
|
||
color: #333333;
|
||
}
|
||
|
||
.orsize {
|
||
font-size: 12px;
|
||
color: #FA6400;
|
||
}
|
||
|
||
.popup-box {
|
||
border-radius: 10px;
|
||
background: #fff;
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
padding: 15px;
|
||
}
|
||
|
||
.p_title {
|
||
text-align: center;
|
||
width: 100%;
|
||
border-bottom: 1px solid #EEEEEE;
|
||
box-sizing: border-box;
|
||
padding-bottom: 15px;
|
||
margin-bottom: 15px;
|
||
}
|
||
|
||
.p-tab {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-around;
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
padding: 0px 15px;
|
||
color: #333333;
|
||
}
|
||
|
||
.p_bs {
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
font-size: 14px;
|
||
color: #666666;
|
||
margin: 5px auto;
|
||
}
|
||
|
||
.p_x {
|
||
width: 100%;
|
||
background: #eee;
|
||
height: 1px;
|
||
margin: 10px auto;
|
||
}
|
||
|
||
.r-size {
|
||
font-size: 14px;
|
||
color: #E02020;
|
||
}
|
||
|
||
.p_ds {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
|
||
}
|
||
|
||
.anxuan {
|
||
width: 15px;
|
||
height: 15px;
|
||
border-radius: 50%;
|
||
border: 1px solid #999999;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
|
||
}
|
||
|
||
.dian {
|
||
width: 7px;
|
||
height: 7px;
|
||
border-radius: 50%;
|
||
background: #999999;
|
||
|
||
|
||
|
||
}
|
||
|
||
.sm-size {
|
||
font-size: 12px;
|
||
color: #333333;
|
||
}
|
||
|
||
.annius {
|
||
width: 305px;
|
||
height: 40px;
|
||
background: #FA6400;
|
||
border-radius: 20px;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
color: #fff;
|
||
margin: 15px auto;
|
||
margin-top: 35px;
|
||
}
|
||
|
||
.wr_box {
|
||
display: flex;
|
||
align-items: center;
|
||
width: 100%;
|
||
flex-wrap: wrap;
|
||
}
|
||
|
||
.xanniu {
|
||
width: 32%;
|
||
box-sizing: border-box;
|
||
padding: 10px;
|
||
text-align: center;
|
||
border: 1px solid #EEEEEE;
|
||
margin-right: 1%;
|
||
margin-bottom: 4%;
|
||
font-size: 14px;
|
||
}
|
||
|
||
.acvit {
|
||
border: 1px solid #FA6400 !important;
|
||
background: rgba(250, 100, 0, 0.15) !important;
|
||
color: #FA6400 !important;
|
||
|
||
}
|
||
|
||
.tap-top {
|
||
white-space: nowrap;
|
||
margin-bottom: 15px;
|
||
}
|
||
|
||
.sz {
|
||
|
||
border: 1px solid #EEEEEE;
|
||
box-sizing: border-box;
|
||
display: inline-block;
|
||
font-size: 14px;
|
||
color: #333333;
|
||
border-radius: 50px;
|
||
padding: 5px 15px;
|
||
margin-right: 10px;
|
||
}
|
||
|
||
.c_pox {
|
||
height: 75px;
|
||
width: 100%;
|
||
margin: 10px auto;
|
||
background: #FA6400;
|
||
box-sizing: border-box;
|
||
padding: 10px;
|
||
color: #fff;
|
||
background: url('../../static/imgs/czktc.png') no-repeat;
|
||
background-size: 100% 100%;
|
||
}
|
||
|
||
.c_bs {
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
}
|
||
|
||
.anniubai {
|
||
width: 50px;
|
||
height: 20px;
|
||
background: #FFFFFF;
|
||
border-radius: 10px;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
color: #FA6400;
|
||
font-size: 14px;
|
||
}
|
||
|
||
.or {
|
||
color: #FA6400 !important;
|
||
}
|
||
|
||
.couponBox {
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
padding: 10px;
|
||
margin: 15px auto;
|
||
border: 1px solid #FA6400;
|
||
}
|
||
|
||
.couponBox_h {
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
padding: 10px;
|
||
margin: 15px auto;
|
||
border: 1px solid #999;
|
||
}
|
||
|
||
.cou_top {
|
||
width: 100%;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
}
|
||
|
||
.c-r-num {
|
||
font-weight: 600;
|
||
font-size: 16px;
|
||
color: #E02020;
|
||
}
|
||
|
||
.c-h-num {
|
||
font-weight: 600;
|
||
font-size: 16px;
|
||
color: #999;
|
||
}
|
||
|
||
.c_title {
|
||
font-size: 14px;
|
||
color: #333333;
|
||
}
|
||
|
||
.qaz {
|
||
width: 12px;
|
||
height: 12px;
|
||
border-radius: 50%;
|
||
border: 1px solid #999999;
|
||
margin-right: 5px;
|
||
}
|
||
|
||
.sm_r-zie {
|
||
font-weight: 400;
|
||
font-size: 10px;
|
||
color: #E02020;
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
}
|
||
|
||
.sm_h-zie {
|
||
font-weight: 400;
|
||
font-size: 10px;
|
||
color: #999;
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
}
|
||
|
||
.sm_size {
|
||
font-size: 10px;
|
||
color: #333333;
|
||
width: 80%;
|
||
white-space: nowrap;
|
||
//不换行
|
||
overflow: hidden; //超出部分隐藏
|
||
text-overflow: ellipsis; //文本溢出显示省略号
|
||
}
|
||
|
||
.sb_size {
|
||
font-size: 10px;
|
||
color: #333333;
|
||
width: 80%;
|
||
white-space: nowrap; //不换行
|
||
overflow: hidden; //超出部分隐藏
|
||
text-overflow: ellipsis; //文本溢出显示省略号
|
||
}
|
||
|
||
.sb_xl {
|
||
white-space: pre-wrap !important;
|
||
}
|
||
|
||
.dashed_box {
|
||
width: 100%;
|
||
border-bottom: 1px dashed #E02020;
|
||
margin: 10px auto;
|
||
}
|
||
|
||
.dashed_box_h {
|
||
width: 100%;
|
||
border-bottom: 1px dashed #999;
|
||
margin: 10px auto;
|
||
}
|
||
</style> |