867 lines
20 KiB
Vue
867 lines
20 KiB
Vue
|
<template>
|
|||
|
<view class="main">
|
|||
|
<status-nav :backgroudColor="backgroudColor" returnColor="#fff" navBarTitle="水卡管理"
|
|||
|
titleColor="#fff"></status-nav>
|
|||
|
<!-- 页面背景 -->
|
|||
|
<image class="page-bg" src="/static/public/blue-bg2.jpg" mode="widthFix"></image>
|
|||
|
<view class="user-spread content">
|
|||
|
<view class="fs14 u-m-b-20 flex tc white" v-if="giftData.code">
|
|||
|
<u-icon name="gift-fill" color="#fff" size="23"></u-icon>
|
|||
|
<view class="u-m-l-10">当前充值金额 <text class="fs12 u-m-l-10">¥</text><text
|
|||
|
class="fs20 bold">{{giftData.money}}</text></view>
|
|||
|
</view>
|
|||
|
<view class="main-boxs u-p-t-30">
|
|||
|
<view v-if="cardList.length > 0">
|
|||
|
<view class="user-vip" v-for="(item,index) in cardList" :key="index"
|
|||
|
:class="item.status != 'normal' ? 'actionType' : ''">
|
|||
|
|
|||
|
<u-skeleton rows="1" :loading="ifLoading" :animate="true">
|
|||
|
<view class="user-assets-box" :class="index == checked ? 'checkSe' : ''">
|
|||
|
<view class="user-assets-header flex row-between">
|
|||
|
<view class="flex nr bold" style="line-height: 80rpx;color: #8F430E;">
|
|||
|
卡号:
|
|||
|
<text style="color: #FF2C3C;font-weight: bold;" class="price-format">
|
|||
|
<text style="font-size: 30rpx;margin-right: 2rpx;">{{item.number}}</text>
|
|||
|
</text>
|
|||
|
</view>
|
|||
|
|
|||
|
<view class="white flex row-center" v-if="giftData.code">
|
|||
|
<u-radio-group v-model="checked" placement="column" @change="groupChange">
|
|||
|
<u-radio :name="index" activeColor="#3d9f3d" size="22" shape="circle"></u-radio>
|
|||
|
</u-radio-group>
|
|||
|
</view>
|
|||
|
|
|||
|
<view v-else>
|
|||
|
<view hover-class="none" class="primary-btn white flex row-center fs12"
|
|||
|
v-if="item.status == 'normal'" @tap="lossTap(index,'lost')">卡片挂失
|
|||
|
</view>
|
|||
|
<view hover-class="none" class="primary-btn white flex row-center fs12"
|
|||
|
v-else-if="item.status == 'lost'" style="background: #999;">卡片已挂失
|
|||
|
</view>
|
|||
|
<view hover-class="none" class="primary-btn white flex row-center fs12"
|
|||
|
v-else-if="item.status == 'cancel'" style="background: #999;">卡片已注销
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
<view class="user-assets-content flex flex-wrap">
|
|||
|
<view class="user-item flex-col col-center">
|
|||
|
<tool-tip class="m-t-20" id="today-profit" content="今日预估收益金额"
|
|||
|
style="position: absolute;right: -66rpx;"></tool-tip>
|
|||
|
<view class="nr user-assets-name flex" style="color: #8F430E">
|
|||
|
当前余额
|
|||
|
</view>
|
|||
|
<view class="assets m-l-10">
|
|||
|
<text style="color: #ff5200;font-weight: bold;" class="price-format">
|
|||
|
<text style="font-size: 13px;margin-right: 2rpx;">¥</text>
|
|||
|
<text style="font-size: 16px;margin-left: 4rpx;">{{item.value}}</text>
|
|||
|
</text>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
|
|||
|
<view class="user-item flex-col col-center">
|
|||
|
<view class="nr user-assets-name flex" style="color: #8F430E">
|
|||
|
上次刷卡设备号
|
|||
|
</view>
|
|||
|
<view class="assets m-l-10">
|
|||
|
<text style="color: #ff5200;font-weight: bold;" class="price-format">
|
|||
|
<text
|
|||
|
style="font-size: 13px;margin-right: 2rpx;">{{item.shopname || ''}}</text>
|
|||
|
</text>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
|
|||
|
<view class="usual-tools-box" v-if="!giftData.code">
|
|||
|
<view class="usual-content flex">
|
|||
|
<view class="usual-item" @tap="cardTap(index,1)">
|
|||
|
<view class="flex-col col-center">
|
|||
|
<image src="/static/distribution/icon_yongjin.png" class="usual-item-img">
|
|||
|
</image>
|
|||
|
<view class="nr normal m-t-18" style="line-height: 40rpx">充值记录</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
<view class="usual-item" @tap="cardTap(index,2)">
|
|||
|
<view class="flex-col col-center">
|
|||
|
<image src="/static/distribution/icon_invite.png" class="usual-item-img">
|
|||
|
</image>
|
|||
|
<view class="nr normal m-t-18" style="line-height: 40rpx">消费记录</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
|
|||
|
<view class="usual-item" @tap="cardTap(index,3)">
|
|||
|
<view class="flex-col col-center">
|
|||
|
<image src="/static/distribution/icon_delet.png" class="usual-item-img"></image>
|
|||
|
<view class="nr normal m-t-18" style="line-height: 40rpx">删除</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
|
|||
|
</u-skeleton>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
|
|||
|
|
|||
|
<view class="kong" v-else>
|
|||
|
<u-empty mode="list" text="水卡是空的哟~">
|
|||
|
<view class="mt10">
|
|||
|
<u-button size="small" type="success" text="去添加水卡" @tap="goPage('/pagesA/addCard/addCard')">
|
|||
|
</u-button>
|
|||
|
</view>
|
|||
|
</u-empty>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
|
|||
|
<view class="pl50 pr50 u-m-t-60" v-if="giftData.code">
|
|||
|
<view v-if="!disabled">
|
|||
|
<u-button size="large" shape="circle" text="提交充值" @click="submitForm"
|
|||
|
color="linear-gradient(to left, #0aa00a,#11ca11)"></u-button>
|
|||
|
</view>
|
|||
|
|
|||
|
<view class="op" v-else>
|
|||
|
<u-button loadingText="加载中" shape="circle" size="large" loading loadingMode="circle" type="success"
|
|||
|
color="linear-gradient(to left, #0aa00a,#11ca11)"></u-button>
|
|||
|
</view>
|
|||
|
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
|
|||
|
<!-- 记录 -->
|
|||
|
<u-popup :show="popShow" @close="close" :round="10">
|
|||
|
<view class="record">
|
|||
|
<view class="top_title">
|
|||
|
<text class="text" v-if="recordValue == 1">充值记录</text>
|
|||
|
<text class="text" v-if="recordValue == 2">消费记录</text>
|
|||
|
<text class="num">当前卡号:<text class="st">{{cardList[recordIndex].number}}</text></text>
|
|||
|
</view>
|
|||
|
|
|||
|
<scroll-view :scroll-top="0" style="height: 800rpx;" scroll-y="true" @scrolltolower="scrolltolower">
|
|||
|
<view class="pub-tableList" v-if="recordValue == 1">
|
|||
|
<view class="a2">
|
|||
|
<view class="boxs">
|
|||
|
<view class="b1 b1-top">
|
|||
|
<view class="st">充值金额</view>
|
|||
|
<view class="st">充值时间</view>
|
|||
|
<view class="st">实际到账</view>
|
|||
|
<view class="st">操作人</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
|
|||
|
<view class="boxs">
|
|||
|
<view class="b1" v-for="(item,index) in rechargeList" :key="index">
|
|||
|
<view class="st">{{item.value}}</view>
|
|||
|
<view class="st">{{item.time}}</view>
|
|||
|
<view class="st">{{item.value_afterdiscount}}</view>
|
|||
|
<view class="st">{{item.operater}}</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
|
|||
|
<view class="pub-tableList" v-if="recordValue == 2">
|
|||
|
<view class="a2">
|
|||
|
<view class="boxs">
|
|||
|
<view class="b1 b1-top">
|
|||
|
<view class="st">消费时间</view>
|
|||
|
<view class="st">设备地址</view>
|
|||
|
<view class="st">实际扣款</view>
|
|||
|
<view class="st">余额</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
|
|||
|
<view class="boxs">
|
|||
|
<view class="b1" v-for="(item,index) in userList" :key="index">
|
|||
|
<view class="st">{{item.time}}</view>
|
|||
|
<view class="st">{{item.location}}</view>
|
|||
|
<view class="st">{{item.cost_value}}</view>
|
|||
|
<view class="st">{{item.after_value}}</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</scroll-view>
|
|||
|
</view>
|
|||
|
</u-popup>
|
|||
|
|
|||
|
<!-- 删除模态框 -->
|
|||
|
<u-modal :show="showDel" @cancel="cancelDel" :content="contentDel" :title="titleDel" @confirm="confirmDel"
|
|||
|
ref="uModal" :asyncClose="true" :showCancelButton="true"></u-modal>
|
|||
|
</view>
|
|||
|
</template>
|
|||
|
|
|||
|
<script>
|
|||
|
import {
|
|||
|
getCardList,
|
|||
|
postCardLost,
|
|||
|
postGiftUse,
|
|||
|
postCardDel
|
|||
|
} from "@/api/index";
|
|||
|
import {
|
|||
|
getaddvalue,
|
|||
|
getconsume,
|
|||
|
getLossreport,
|
|||
|
getCardinfo,
|
|||
|
getproducts,
|
|||
|
postAddvalue
|
|||
|
} from "@/api/water";
|
|||
|
|
|||
|
export default {
|
|||
|
data() {
|
|||
|
return {
|
|||
|
ifLoading: true,
|
|||
|
baseHttps: `${getApp().globalData.hostapi}`, //接口链接
|
|||
|
backgroudColor: 'none', //导航栏背景
|
|||
|
|
|||
|
popShow: false,
|
|||
|
recordValue: 1, //1充值、2消费
|
|||
|
recordIndex: '', //点击的第几个
|
|||
|
otherCardList: [], //循环之后遍历的卡片列表
|
|||
|
cardList: [], //本地存储卡片列表
|
|||
|
|
|||
|
rechargeList: [], //充值记录
|
|||
|
userList: [], //消费记录
|
|||
|
page: 1,
|
|||
|
size: 100,
|
|||
|
total: 0,
|
|||
|
|
|||
|
|
|||
|
giftData: {
|
|||
|
code: '',
|
|||
|
money: '',
|
|||
|
}, //礼品卡信息
|
|||
|
checked: '-1',
|
|||
|
disabled: false,
|
|||
|
|
|||
|
titleDel: '水卡删除',
|
|||
|
showDel: false,
|
|||
|
contentDel: '',
|
|||
|
delCardIndex: '',
|
|||
|
};
|
|||
|
},
|
|||
|
onPageScroll(object) {
|
|||
|
if (object.scrollTop >= 5) {
|
|||
|
this.backgroudColor = '#3a9e3a';
|
|||
|
}
|
|||
|
if (object.scrollTop <= 0) {
|
|||
|
this.backgroudColor = 'none';
|
|||
|
}
|
|||
|
},
|
|||
|
onLoad(op) {
|
|||
|
if (op) {
|
|||
|
this.giftData.code = op.code;
|
|||
|
this.giftData.money = op.money;
|
|||
|
this.getCardData();
|
|||
|
} else {
|
|||
|
this.getCardData();
|
|||
|
}
|
|||
|
},
|
|||
|
onShow(options) {},
|
|||
|
|
|||
|
methods: {
|
|||
|
close() {
|
|||
|
this.popShow = false;
|
|||
|
},
|
|||
|
|
|||
|
// 跳转页面
|
|||
|
goPage(url){
|
|||
|
uni.navigateTo({
|
|||
|
url:url
|
|||
|
})
|
|||
|
},
|
|||
|
// 获取卡片列表
|
|||
|
getCardData() {
|
|||
|
let params = {
|
|||
|
page: this.page,
|
|||
|
size: this.size
|
|||
|
}
|
|||
|
getCardList(params).then(res => {
|
|||
|
this.total = res.data.total;
|
|||
|
let newArray = res.data.list.map(item => ({
|
|||
|
appid: item.appid,
|
|||
|
user: item.saler,
|
|||
|
card: item.number
|
|||
|
}));
|
|||
|
this.fetchAllDataByIds(newArray);
|
|||
|
})
|
|||
|
},
|
|||
|
|
|||
|
async fetchAllDataByIds(array) {
|
|||
|
await array.forEach((item, index) => {
|
|||
|
this.cardListData(item);
|
|||
|
})
|
|||
|
this.ifLoading = false;
|
|||
|
|
|||
|
console.log(this.cardList)
|
|||
|
},
|
|||
|
|
|||
|
// 请求生钛圈水卡详情
|
|||
|
cardListData(data) {
|
|||
|
let params = {
|
|||
|
appid: data.appid,
|
|||
|
user: data.user,
|
|||
|
card: data.card
|
|||
|
}
|
|||
|
getCardinfo(params).then(res => {
|
|||
|
if (res.error == 0) {
|
|||
|
let newData = {
|
|||
|
appid: data.appid,
|
|||
|
...res.data
|
|||
|
}
|
|||
|
if (this.giftData.code) {
|
|||
|
newData.checked = false
|
|||
|
}
|
|||
|
this.cardList.push(newData);
|
|||
|
//会员卡状态 normal(正常) lost(挂失) cancel 已注销(不能使用)
|
|||
|
}
|
|||
|
})
|
|||
|
},
|
|||
|
|
|||
|
//1、充值记录 2、消费记录 3、删除
|
|||
|
cardTap(index, type) {
|
|||
|
this.recordIndex = index;
|
|||
|
let params = {
|
|||
|
appid: this.cardList[index].appid,
|
|||
|
user: this.cardList[index].saler,
|
|||
|
card: this.cardList[index].number,
|
|||
|
}
|
|||
|
this.recordValue = type;
|
|||
|
if (type == 1) {
|
|||
|
getaddvalue(params).then(res => {
|
|||
|
if (res.error == 0) {
|
|||
|
if (res.data.length > 0) {
|
|||
|
this.rechargeList = res.data;
|
|||
|
this.popShow = true;
|
|||
|
} else {
|
|||
|
this.$toolAll.tools.showToast('还没有充值记录~')
|
|||
|
}
|
|||
|
}
|
|||
|
})
|
|||
|
} else if (type == 2) {
|
|||
|
getconsume(params).then(res => {
|
|||
|
if (res.error == 0) {
|
|||
|
if (res.data.length > 0) {
|
|||
|
this.userList = res.data;
|
|||
|
this.popShow = true;
|
|||
|
} else {
|
|||
|
this.$toolAll.tools.showToast('还没有消费记录~')
|
|||
|
}
|
|||
|
}
|
|||
|
})
|
|||
|
} else if (type == 3) {
|
|||
|
this.delCardIndex = index;
|
|||
|
this.contentDel = '您确定要删除' + this.cardList[index].number + '这张水卡?';
|
|||
|
this.showDel = true;
|
|||
|
}
|
|||
|
},
|
|||
|
// 取消删除
|
|||
|
cancelDel() {
|
|||
|
this.showDel = false;
|
|||
|
},
|
|||
|
// 确定删除
|
|||
|
confirmDel() {
|
|||
|
let paramsData = {
|
|||
|
number: this.cardList[this.delCardIndex].number,
|
|||
|
}
|
|||
|
postCardDel(paramsData).then(res => {
|
|||
|
if (res.code == 0) {
|
|||
|
this.showDel = false;
|
|||
|
this.$toolAll.tools.showToast('删除成功');
|
|||
|
setTimeout(() => {
|
|||
|
uni.redirectTo({
|
|||
|
url: "/pagesA/waterCard/waterCard"
|
|||
|
})
|
|||
|
}, 1000)
|
|||
|
|
|||
|
} else {
|
|||
|
this.$toolAll.tools.showToast(res.msg)
|
|||
|
}
|
|||
|
})
|
|||
|
},
|
|||
|
|
|||
|
|
|||
|
// 卡片挂失
|
|||
|
lossTap(index, type) {
|
|||
|
let params = {
|
|||
|
appid: this.cardList[index].appid,
|
|||
|
saler: this.cardList[index].saler,
|
|||
|
card: this.cardList[index].number,
|
|||
|
action: type
|
|||
|
}
|
|||
|
getLossreport(params).then(res => {
|
|||
|
if (res.code == 0) {
|
|||
|
this.$toolAll.tools.showToast('挂失成功');
|
|||
|
uni.redirectTo({
|
|||
|
url:"/pagesA/waterCard/waterCard"
|
|||
|
})
|
|||
|
}
|
|||
|
})
|
|||
|
},
|
|||
|
|
|||
|
// 选择卡片充值
|
|||
|
groupChange(e) {
|
|||
|
this.checked = e;
|
|||
|
},
|
|||
|
|
|||
|
// 提交充值
|
|||
|
submitForm() {
|
|||
|
if (this.checked >= 0) {
|
|||
|
this.disabled = true;
|
|||
|
setTimeout(() => {
|
|||
|
this.disabled = false;
|
|||
|
}, 2500)
|
|||
|
// 充值
|
|||
|
let params = {
|
|||
|
appid: this.cardList[this.checked].appid,
|
|||
|
user: this.cardList[this.checked].saler,
|
|||
|
card: this.cardList[this.checked].number,
|
|||
|
value: this.giftData.money,
|
|||
|
income: this.giftData.money,
|
|||
|
password: this.cardList[this.checked].saler,
|
|||
|
}
|
|||
|
postAddvalue(params).then(res => {
|
|||
|
if (res.error == 0) {
|
|||
|
let paramsData = {
|
|||
|
code: this.giftData.code
|
|||
|
}
|
|||
|
postGiftUse(paramsData).then(resData => {
|
|||
|
if (resData.code == 0) {
|
|||
|
this.$toolAll.tools.showToast('充值成功');
|
|||
|
setTimeout(() => {
|
|||
|
uni.redirectTo({
|
|||
|
url: "/pagesA/waterCard/waterCard"
|
|||
|
})
|
|||
|
}, 1200)
|
|||
|
}
|
|||
|
})
|
|||
|
} else {
|
|||
|
this.$toolAll.tools.showToast('充值失败')
|
|||
|
}
|
|||
|
})
|
|||
|
} else {
|
|||
|
this.$toolAll.tools.showToast('请选择您要充值的卡号!')
|
|||
|
}
|
|||
|
|
|||
|
},
|
|||
|
|
|||
|
}
|
|||
|
};
|
|||
|
</script>
|
|||
|
<style lang="scss" scoped>
|
|||
|
.page-bg {
|
|||
|
width: 100%;
|
|||
|
position: absolute;
|
|||
|
left: 0;
|
|||
|
top: 0;
|
|||
|
z-index: 0;
|
|||
|
}
|
|||
|
|
|||
|
.user-spread {
|
|||
|
|
|||
|
.header {
|
|||
|
justify-content: space-between;
|
|||
|
|
|||
|
.user-info {
|
|||
|
.user-avatar {
|
|||
|
position: relative;
|
|||
|
width: 120rpx;
|
|||
|
height: 120rpx;
|
|||
|
overflow: hidden;
|
|||
|
background-color: #ececec;
|
|||
|
border-radius: 50%;
|
|||
|
|
|||
|
.image {
|
|||
|
width: 110rpx;
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
.avatar-tag {
|
|||
|
display: inline-flex;
|
|||
|
align-items: center;
|
|||
|
line-height: 40rpx;
|
|||
|
}
|
|||
|
|
|||
|
.user-message {
|
|||
|
.write-btn {
|
|||
|
height: 42rpx;
|
|||
|
width: 100rpx;
|
|||
|
background-color: #FF838D;
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
.main-boxs {
|
|||
|
|
|||
|
.user-vip {
|
|||
|
background: linear-gradient(90deg, #FBEFDB 0%, #FED09E 100%);
|
|||
|
border-radius: 20rpx;
|
|||
|
margin-bottom: 40rpx;
|
|||
|
|
|||
|
&.actionType {
|
|||
|
background: #ddd;
|
|||
|
}
|
|||
|
|
|||
|
.user-assets-box {
|
|||
|
border: 1px solid transparent;
|
|||
|
padding: 14rpx 30rpx;
|
|||
|
border-radius: 10rpx;
|
|||
|
|
|||
|
&.checkSe {
|
|||
|
border: 1px solid #f00;
|
|||
|
}
|
|||
|
|
|||
|
.user-assets-header {
|
|||
|
border-bottom: 1rpx dashed #8F430E;
|
|||
|
padding-bottom: 4rpx;
|
|||
|
|
|||
|
.primary-btn {
|
|||
|
height: 54rpx;
|
|||
|
border-radius: 120rpx;
|
|||
|
width: 144rpx;
|
|||
|
background: linear-gradient(180deg, #FF3067 0%, #FF2C3C 100%);
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
.user-assets-content {
|
|||
|
margin-top: 30rpx;
|
|||
|
|
|||
|
.user-item {
|
|||
|
flex: 1;
|
|||
|
position: relative;
|
|||
|
|
|||
|
.user-assets-name {
|
|||
|
text-align: left;
|
|||
|
align-self: flex-start;
|
|||
|
}
|
|||
|
|
|||
|
.assets {
|
|||
|
margin-top: 6rpx;
|
|||
|
text-align: left;
|
|||
|
align-self: flex-start;
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
.fans-msg-box {
|
|||
|
border-radius: 10rpx;
|
|||
|
line-height: 42rpx;
|
|||
|
|
|||
|
.my-fans {
|
|||
|
height: 100rpx;
|
|||
|
}
|
|||
|
|
|||
|
.line {
|
|||
|
width: 3rpx;
|
|||
|
height: 60rpx;
|
|||
|
background-color: #E5E5E5;
|
|||
|
}
|
|||
|
|
|||
|
.invite-fans {
|
|||
|
height: 120rpx;
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
.my-invite-box {
|
|||
|
padding: 26rpx 0 57rpx;
|
|||
|
border-radius: 10rpx;
|
|||
|
|
|||
|
.invite-copy-btn {
|
|||
|
line-height: 30rpx;
|
|||
|
padding: 10rpx;
|
|||
|
background: linear-gradient(90deg, #FEE4B4 0%, #FBCB96 100%);
|
|||
|
color: #8F430E;
|
|||
|
border-radius: 4rpx;
|
|||
|
}
|
|||
|
|
|||
|
.my-promote-banner {
|
|||
|
margin-top: 30rpx;
|
|||
|
height: 148rpx;
|
|||
|
width: 542rpx;
|
|||
|
border-radius: 10rpx;
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
.usual-tools-box {
|
|||
|
border-radius: 10rpx;
|
|||
|
padding: 0 25rpx;
|
|||
|
|
|||
|
.usual-tools-header {
|
|||
|
height: 100rpx;
|
|||
|
line-height: 44rpx;
|
|||
|
border-bottom: 1px solid #ececec;
|
|||
|
}
|
|||
|
|
|||
|
.usual-content {
|
|||
|
padding: 40rpx 0;
|
|||
|
|
|||
|
.usual-item {
|
|||
|
flex: 1;
|
|||
|
box-sizing: border-box;
|
|||
|
|
|||
|
.usual-item-img {
|
|||
|
width: 44rpx;
|
|||
|
height: 44rpx;
|
|||
|
flex: none;
|
|||
|
}
|
|||
|
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
.user-apply-box {
|
|||
|
.user-apply-vip {
|
|||
|
background-color: white;
|
|||
|
padding: 40rpx 0 0rpx;
|
|||
|
border-radius: 20rpx;
|
|||
|
|
|||
|
.title {
|
|||
|
line-height: 30rpx;
|
|||
|
font-weight: bold;
|
|||
|
}
|
|||
|
|
|||
|
.explain {
|
|||
|
margin-top: 20rpx;
|
|||
|
|
|||
|
image {
|
|||
|
width: 24rpx;
|
|||
|
height: 24rpx;
|
|||
|
flex: none;
|
|||
|
}
|
|||
|
|
|||
|
span {
|
|||
|
font-size: 20rpx;
|
|||
|
line-height: 30rpx;
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
.vip-form {
|
|||
|
width: 100%;
|
|||
|
margin-top: 60rpx;
|
|||
|
|
|||
|
.form-item {
|
|||
|
border: 1px solid #ececec;
|
|||
|
margin: 0 30rpx 30rpx;
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
.apply-btn {
|
|||
|
line-height: 30rpx;
|
|||
|
height: 82rpx;
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
.user-result-box {
|
|||
|
.user-result {
|
|||
|
background-color: white;
|
|||
|
padding: 36rpx 14rpx 50rpx;
|
|||
|
border-radius: 20rpx;
|
|||
|
|
|||
|
.user-result-header {
|
|||
|
.title {
|
|||
|
line-height: 30rpx;
|
|||
|
font-weight: bold;
|
|||
|
}
|
|||
|
|
|||
|
}
|
|||
|
|
|||
|
.user-result-content {
|
|||
|
padding: 60rpx 0 22rpx;
|
|||
|
width: 100%;
|
|||
|
border-bottom: 1px solid #ececec;
|
|||
|
|
|||
|
.apply-result-img {
|
|||
|
width: 100rpx;
|
|||
|
height: 100rpx;
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
.user-result-info {
|
|||
|
margin-top: 42rpx;
|
|||
|
width: 100%;
|
|||
|
|
|||
|
.info-item {
|
|||
|
margin-left: 60rpx;
|
|||
|
margin-bottom: 28rpx;
|
|||
|
line-height: 30rpx;
|
|||
|
|
|||
|
.label {
|
|||
|
width: 140rpx;
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
.apply-btn {
|
|||
|
line-height: 30rpx;
|
|||
|
height: 82rpx;
|
|||
|
}
|
|||
|
|
|||
|
.bg-gray {
|
|||
|
background-color: #CCCCCC;
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
|
|||
|
.main .user-apply-box .apply-btn {
|
|||
|
line-height: 30rpx;
|
|||
|
height: 82rpx;
|
|||
|
}
|
|||
|
|
|||
|
.main .user-result-box .user-result-content .apply-fail-reason {
|
|||
|
color: #333;
|
|||
|
line-height: 36rpx;
|
|||
|
margin-top: 10rpx;
|
|||
|
}
|
|||
|
|
|||
|
.shareEvm {
|
|||
|
width: 300rpx;
|
|||
|
height: 300rpx;
|
|||
|
background-color: #ececec;
|
|||
|
overflow: hidden;
|
|||
|
}
|
|||
|
|
|||
|
.shareEvm .image {
|
|||
|
width: 100%;
|
|||
|
height: auto;
|
|||
|
}
|
|||
|
|
|||
|
.vip-grade-rule {
|
|||
|
padding: 30rpx 0rpx;
|
|||
|
|
|||
|
.title {
|
|||
|
.line {
|
|||
|
width: 8rpx;
|
|||
|
height: 34rpx;
|
|||
|
background-color: #f79c0c;
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
.price-format {
|
|||
|
line-height: 50rpx;
|
|||
|
}
|
|||
|
|
|||
|
.record {
|
|||
|
padding: 30rpx;
|
|||
|
|
|||
|
.top_title {
|
|||
|
display: flex;
|
|||
|
align-items: center;
|
|||
|
justify-content: space-between;
|
|||
|
border-bottom: 1px solid #ececec;
|
|||
|
padding-bottom: 20rpx;
|
|||
|
|
|||
|
.text {
|
|||
|
font-size: 34rpx;
|
|||
|
font-weight: bold;
|
|||
|
color: #3d9f3d;
|
|||
|
}
|
|||
|
|
|||
|
.num {
|
|||
|
font-size: 28rpx;
|
|||
|
color: #ff5200;
|
|||
|
|
|||
|
.st {
|
|||
|
font-size: 32rpx;
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
.pub-tableList {
|
|||
|
background-color: #fff;
|
|||
|
margin-top: 30rpx;
|
|||
|
|
|||
|
.a1 {
|
|||
|
font-size: 32rpx;
|
|||
|
color: #2ab2ee;
|
|||
|
letter-spacing: 1px;
|
|||
|
}
|
|||
|
|
|||
|
.a2 {
|
|||
|
.boxs {
|
|||
|
.b1 {
|
|||
|
border-bottom: 1px solid #e8e8e8;
|
|||
|
display: flex;
|
|||
|
align-items: center;
|
|||
|
justify-content: space-between;
|
|||
|
padding: 20rpx;
|
|||
|
|
|||
|
.st {
|
|||
|
font-size: 26rpx;
|
|||
|
text-align: center;
|
|||
|
overflow-wrap: break-word;
|
|||
|
padding:0 6rpx;
|
|||
|
box-sizing: border-box;
|
|||
|
&:nth-child(1) {
|
|||
|
width: 25%;
|
|||
|
}
|
|||
|
|
|||
|
&:nth-child(2) {
|
|||
|
width: 30%;
|
|||
|
font-size: 24rpx;
|
|||
|
}
|
|||
|
|
|||
|
&:nth-child(3) {
|
|||
|
width: 20%;
|
|||
|
}
|
|||
|
|
|||
|
&:nth-child(4) {
|
|||
|
width: 25%;
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
&.b1-top {
|
|||
|
background-image: linear-gradient(90deg, #3d9f3d, #008b00);
|
|||
|
|
|||
|
.st {
|
|||
|
font-size: 28rpx;
|
|||
|
color: #fff;
|
|||
|
font-weight: bold;
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
.b2 {
|
|||
|
background-color: #f1f7f7;
|
|||
|
height: 0;
|
|||
|
visibility: hidden;
|
|||
|
opacity: 0;
|
|||
|
transition: opacity .8s ease;
|
|||
|
|
|||
|
&.on {
|
|||
|
height: auto;
|
|||
|
visibility: visible;
|
|||
|
opacity: 1;
|
|||
|
}
|
|||
|
|
|||
|
.td {
|
|||
|
font-size: 24rpx;
|
|||
|
display: flex;
|
|||
|
align-items: center;
|
|||
|
justify-content: space-between;
|
|||
|
height: 100rpx;
|
|||
|
color: #333;
|
|||
|
border-bottom: 1px solid #e8e8e8;
|
|||
|
}
|
|||
|
|
|||
|
.b2-top {
|
|||
|
font-size: 24rpx;
|
|||
|
font-weight: bold;
|
|||
|
}
|
|||
|
|
|||
|
.st {
|
|||
|
text-align: center;
|
|||
|
flex: 1;
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
</style>
|