1693 lines
35 KiB
Vue
1693 lines
35 KiB
Vue
<template>
|
||
<view class="mine">
|
||
<uni-nav-bar left-text="我的" color="#fff" backgroundColor="transparent" :border="false" :statusBar="true"
|
||
:fixed="false"></uni-nav-bar>
|
||
|
||
<view class="user-card">
|
||
<view class="user-info" @click="$c.to({ url: '/pages/user/change' })">
|
||
<view class="avatar">
|
||
<image :src="userinfo.headimg" mode="scaleToFill" />
|
||
</view>
|
||
|
||
<view class="info">
|
||
<view v-if="userinfo.nickname" class="nick hang1">
|
||
{{ userinfo.nickname }}
|
||
</view>
|
||
|
||
<view v-else class="nick">未登录</view>
|
||
|
||
<view v-if="userinfo" class="user-day">
|
||
吧唧一番赏已经陪你走过了{{ userinfo.day }}天
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<view v-if="userinfo" class="lv-box align-center justify-between">
|
||
<text class="lv-box-dengji">LV.{{userinfo.quan_yi_level.level}}</text>
|
||
<view class="lv-box-ouqi column">
|
||
<text>
|
||
<template v-if="userinfo.quan_yi_level.cha > 0">还差{{userinfo.quan_yi_level.cha}}欧气值升级</template>
|
||
<template v-if="userinfo.quan_yi_level.cha == -1">已满级</template>
|
||
</text>
|
||
<view class="mt10 relative">
|
||
<text class="lv-box-num">{{userinfo.quan_yi_level.jindu+'%'}}</text>
|
||
<cmd-progress :percent="userinfo.quan_yi_level.jindu" :show-info="false"
|
||
stroke-color="#4BCAFF" :strokeWidth="12"></cmd-progress>
|
||
</view>
|
||
</view>
|
||
<text class="lv-box-detail" @click="$c.to({ url: '/package/mine/equity' })">查看详情</text>
|
||
</view>
|
||
<view class="rbtn flex" @click="$c.to({ url: '/pages/user/vip' })">
|
||
<image class="img100" :src="$img1('my/huiyuan.png')"></image>
|
||
</view>
|
||
<view class="rbtn btn1 flex" @click="$c.to({ url: '/package/index/sign' })">
|
||
<image class="img100" :src="$img1('my/sign.png')"></image>
|
||
</view>
|
||
<!-- <view class="rbtn btn1 flex">
|
||
<button class="hide" open-type="contact"></button>
|
||
<image class="img100" :src="$img1('my/kefu.png')"></image>
|
||
</view> -->
|
||
</view>
|
||
<view class="">
|
||
|
||
</view>
|
||
|
||
<view class="money-card">
|
||
<view class="other-num">
|
||
<view class="other-item" @click="$c.to({ url: '/pages/user/bi_jl' })">
|
||
<view class="title">吧唧币</view>
|
||
<view class="num" style="color: #ff873a;">{{ userinfo.integral || 0 }}</view>
|
||
</view>
|
||
|
||
<view class="other-item" @click="$c.to({ url: '/pages/user/jf_jl' })">
|
||
<view class="title">积分</view>
|
||
<view class="num" style="color: #479EE3;">{{ userinfo.score || 0 }}</view>
|
||
</view>
|
||
|
||
<view class="other-item" @click="$c.to({ url: '/pages/user/my_coupon' })">
|
||
<view class="title">欧气券</view>
|
||
<view class="num">{{ userinfo.coupon || 0 }}</view>
|
||
</view>
|
||
</view>
|
||
<view class="moneyTitle mt30">我的星钻</view>
|
||
<view class="money mt20 align-center justify-between br20">
|
||
<view class="align-center">
|
||
<image :src="$img1('my/yue.png')"></image>
|
||
<text>¥</text>
|
||
<text>{{ userinfo.money || '0.00' }}</text>
|
||
</view>
|
||
<view class="money-detail" @click="$c.to({ url: '/pages/user/yetx' })">
|
||
<text>查看明细</text>
|
||
<uni-icons type="right" color="#FFFFFF"></uni-icons>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<view v-if="taskList.length > 0" class="task">
|
||
<view class="task-title">主要任务</view>
|
||
<view class="task-list">
|
||
<view class="task-item" v-for="(item, i) in taskList" :key="i">
|
||
<view class="task-l">
|
||
<view class="title">{{ item.title }}</view>
|
||
|
||
<view class="num">欧气值+{{ item.z_number }}</view>
|
||
|
||
<view class="progress">
|
||
<view class="progress-inner">
|
||
<cmd-progress :percent="item.percentage" :show-info="false"
|
||
stroke-color="linear-gradient(90deg, #7836FF 0%, #A465F2 100%)"
|
||
:strokeWidth="8"></cmd-progress>
|
||
</view>
|
||
|
||
{{ item.ywc_count }}/{{ item.number }}
|
||
</view>
|
||
</view>
|
||
|
||
<view class="task-r">
|
||
<view v-if="item.is_complete == 0" class="btn"
|
||
@click="$c.to({ type: 3, url: '/pages/shouye/index' })">
|
||
<text>去完成</text>
|
||
</view>
|
||
|
||
<view v-if="item.is_complete == 1" class="btn act" @click="completeTask(item)">
|
||
<text>待领取</text>
|
||
</view>
|
||
|
||
<view v-if="item.is_complete == 2" class="btn dis">
|
||
<text>已领取</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
</view>
|
||
<view class="qita mt30">
|
||
<view class="qita-title">其他服务</view>
|
||
<view class="menu-card">
|
||
<template v-for="(item, i) in menuList">
|
||
<view v-if="item.show" class="menu-item" :key="i" @click="menuTo(item)">
|
||
<view class="icon">
|
||
<image :src="$img1(item.icon)" mode=""></image>
|
||
</view>
|
||
<view class="title">
|
||
{{ item.title }}
|
||
</view>
|
||
</view>
|
||
</template>
|
||
<view class="menu-item relative" :key="-1">
|
||
<view class="icon">
|
||
<image :src="$img1('my/s9.png')" mode=""></image>
|
||
</view>
|
||
<view class="title">
|
||
客服
|
||
</view>
|
||
<button class="hide" open-type="contact"></button>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<!-- #ifdef MP -->
|
||
<!-- <view class="copyright"></view> -->
|
||
<!-- #endif -->
|
||
<!-- 群聊弹窗 -->
|
||
<uni-popup ref="qunliao_show" type="center" maskBackgroundColor="rgba(0,0,0,0.8)">
|
||
<view class="pop">
|
||
<view class="flex">
|
||
<image class="img100" :src="ewm" :show-menu-by-longpress="true" mode="aspectFit"></image>
|
||
</view>
|
||
<view class="pop-view column">
|
||
<text class="ziti">添加客服领优惠</text>
|
||
<text>识别图中二维码</text>
|
||
</view>
|
||
<image class="pop-liwu" :src="$img1('index/liwu.png')"></image>
|
||
<view @click="$refs.qunliao_show.close()" class="pop-close flex">
|
||
<image :src="$img1('common/close.png')" class="img100" />
|
||
</view>
|
||
</view>
|
||
</uni-popup>
|
||
|
||
<!-- 星钻充值弹窗 -->
|
||
<uni-popup ref="chongzhi_show" type="bottom">
|
||
<view class="order animated fadeInUp">
|
||
<view class="order_title">
|
||
<view class="title">星钻充值</view>
|
||
<view class="ca" @click="$refs.chongzhi_show.close()">
|
||
<image :src="$img('/static/icon/close1.png')"
|
||
style="width: 30rpx; height: 30rpx; margin-top: 14rpx"></image>
|
||
</view>
|
||
</view>
|
||
<view class="pop_coucent">
|
||
<view>选择充值金额</view>
|
||
<view class="pop_box">
|
||
<view class="common_bg" @click="money_1 = v" v-for="(v, i) in moneyArr" :key="i" :style="{
|
||
'background-image': `url(${$img(
|
||
money_1 == v
|
||
? '/static/img/mine_chong_tab_bg_act.png'
|
||
: '/static/img/mine_chong_tab_bg.png'
|
||
)})`
|
||
}">
|
||
¥
|
||
<text style="font-size: 32rpx">{{ v }}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="pop_coucent">
|
||
<view>输入充值金额</view>
|
||
<input type="text" placeholder="请输入金额,最低1元" v-model="money_1" placeholder-style="color:#999999" />
|
||
</view>
|
||
|
||
<view class="chong-bt">
|
||
<view class="money">需支付:{{ money_1 || 0 }}元</view>
|
||
|
||
<view @click="chongzhi_click" class="pay-btn common_bg" :style="{
|
||
'background-image': `url(${$img('/static/img/mine_qrcz.png')})`
|
||
}"></view>
|
||
</view>
|
||
|
||
<!-- <view
|
||
class="pop_chongzhi"
|
||
@click="chongzhi_click"
|
||
:style="
|
||
'background: url(' +
|
||
z_imgPath +
|
||
'mine/allBtn_bg.png' +
|
||
') no-repeat 0 0 / 100% 100%;'
|
||
"
|
||
>
|
||
确认充值
|
||
</view> -->
|
||
</view>
|
||
</uni-popup>
|
||
<!-- 星钻提现 -->
|
||
<view class="mengban animated fadeIn" v-if="tixian_show">
|
||
<view class="order animated fadeInUp">
|
||
<view class="order_title">
|
||
<image :src="z_imgPath + 'mine/tx_tips.png'" style="width: 162rpx; height: 47rpx"></image>
|
||
<view class="ca" @click="tixian_show = false">
|
||
<image :src="z_imgPath + 'mine/qu_close.png?11'"
|
||
style="width: 48rpx; height: 48rpx; margin-top: 14rpx"></image>
|
||
</view>
|
||
</view>
|
||
<view class="pop_head">
|
||
<view @click="tixian_index = 1">
|
||
<text :class="tixian_index == 1 ? 'xzs' : 'wzs'">微信零钱</text>
|
||
<view class="qiehuan_line" v-if="tixian_index == 1"></view>
|
||
</view>
|
||
<view @click="tixian_index = 2">
|
||
<text :class="tixian_index == 2 ? 'xzs' : 'wzs'">支付宝</text>
|
||
<view class="qiehuan_line" v-if="tixian_index == 2">
|
||
<!-- <image src="../../static/shouye/top.png"></image> -->
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="pop_coucent" v-if="tixian_index == 1">
|
||
<view>输入提现金额</view>
|
||
<view class="flex_center pop_tixian_input">
|
||
<input type="number" placeholder="¥请输入金额,最低1元" placeholder-style="font-size:24rpx"
|
||
:value="money_2" @input="getmoney_2" />
|
||
<view style="color: #1ff7f0" @click="money_2 = userinfo.money">
|
||
全部提现
|
||
</view>
|
||
</view>
|
||
<view class="flex_center" style="justify-content: space-between">
|
||
<view>到账账户</view>
|
||
<view style="color: #999999">微信零钱</view>
|
||
</view>
|
||
</view>
|
||
<view class="pop_coucent" style="padding: 0 30rpx" v-if="tixian_index == 2">
|
||
<view class="flex_center name_phone">
|
||
<view>姓名</view>
|
||
<input type="text" placeholder="请输入姓名" @input="getname" />
|
||
</view>
|
||
<view class="flex_center name_phone">
|
||
<view>账户</view>
|
||
<input type="text" placeholder="请输入支付宝账号" @input="getnumber" />
|
||
</view>
|
||
<view style="margin-top: 30rpx">输入提现金额</view>
|
||
<view class="flex_center pop_tixian_input" style="border: none">
|
||
<input type="number" placeholder="¥请输入金额,最低1元" placeholder-style="font-size:24rpx"
|
||
:value="money_2" @input="getmoney_2" />
|
||
<view style="color: #1ff7f0" @click="money_2 = userinfo.money">
|
||
全部提现
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="pop_chongzhi" @click="tixian_click" :style="
|
||
'background: url(' +
|
||
z_imgPath +
|
||
'mine/allBtn_bg.png' +
|
||
') no-repeat 0 0 / 100% 100%;'
|
||
">
|
||
确认提现
|
||
</view>
|
||
<!-- <image :src="z_imgPath+'mine/qrtx.png'" class="pop_chongzhi" @click="tixian_click()"></image> -->
|
||
</view>
|
||
</view>
|
||
<!-- <tab-bar :index="4"></tab-bar> -->
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
components: {},
|
||
data() {
|
||
return {
|
||
z_imgPath: this.$z_img2,
|
||
userinfo: '',
|
||
moneyArr: [100, 200, 500, 1000, 3000],
|
||
menuList: [{
|
||
id: 1,
|
||
show: true,
|
||
title: '消费记录',
|
||
icon: 'my/s1.png',
|
||
path: '/pages/user/xfjl'
|
||
},
|
||
{
|
||
id: 2,
|
||
show: true,
|
||
title: '兑换记录',
|
||
icon: 'my/s2.png',
|
||
path: '/pages/user/hsjl'
|
||
},
|
||
{
|
||
id: 3,
|
||
show: true,
|
||
title: '我的收藏',
|
||
icon: 'my/s3.png',
|
||
path: '/package/mine/collect'
|
||
},
|
||
{
|
||
id: 4,
|
||
show: true,
|
||
title: '优惠券',
|
||
icon: 'my/s4.png',
|
||
path: '/pages/user/coupon'
|
||
},
|
||
{
|
||
id: 5,
|
||
show: true,
|
||
title: '邀请好友',
|
||
icon: 'my/s5.png',
|
||
path: '/pages/user/tui-guang'
|
||
},
|
||
{
|
||
id: 6,
|
||
show: true,
|
||
title: '加入福利群',
|
||
icon: 'my/s6.png',
|
||
path: ''
|
||
},
|
||
{
|
||
id: 7,
|
||
show: true,
|
||
title: '用户协议',
|
||
icon: 'my/s7.png',
|
||
path: '/pages/guize/guize?type=4'
|
||
},
|
||
{
|
||
id: 8,
|
||
show: true,
|
||
title: '道具卡',
|
||
icon: 'my/s8.png',
|
||
path: '/package/mine/skill-card'
|
||
},
|
||
// {
|
||
// id: 9,
|
||
// show:true,
|
||
// title: '挂售记录',
|
||
// icon: '/static/img/2_gsjl.png',
|
||
// path: ''
|
||
// },
|
||
// {
|
||
// id: 10,
|
||
// show:true,
|
||
// title: '晋升排行榜',
|
||
// icon: '/static/img/2_jsphb.png',
|
||
// path: '/pages/shouye/bangdan'
|
||
// },
|
||
],
|
||
// 星钻充值金额
|
||
money_1: '',
|
||
// 二维码
|
||
ewm: '',
|
||
// 1:微信提现 2:支付宝提现
|
||
tixian_index: 1,
|
||
// 星钻提现金额
|
||
money_2: '',
|
||
// 提现姓名
|
||
name: '',
|
||
// 提现账户
|
||
number: '',
|
||
// 收藏数组
|
||
mycollectArr: [],
|
||
|
||
list: [{
|
||
// img: 'mine/img01.png?1',
|
||
// sel: 'mine/sel01.png?1',
|
||
name: '一番赏收藏'
|
||
},
|
||
{
|
||
// img: 'mine/img02.png?1',
|
||
// sel: 'mine/sel02.png?1'
|
||
name: '无限池收藏'
|
||
}
|
||
],
|
||
show: 1,
|
||
tixian_show: false,
|
||
taskList: []
|
||
}
|
||
},
|
||
onLoad(e) {
|
||
if (e.ou_coupon_id) {
|
||
uni.setStorageSync('_ou_coupon_id', e.ou_coupon_id)
|
||
}
|
||
if (e.pid) {
|
||
uni.setStorageSync('pid', e.pid)
|
||
}
|
||
},
|
||
onHide() {
|
||
uni.setStorageSync('page', this.$mp.page.route)
|
||
},
|
||
onShareAppMessage() {
|
||
return {
|
||
title: "吧唧一番,正版潮玩手办一番赏",
|
||
// imageUrl: '',
|
||
path: '/pages/user/index?pid=' + uni.getStorageSync('userinfo').ID
|
||
}
|
||
},
|
||
onShow() {
|
||
this.getdata()
|
||
// this.getmycollect()
|
||
let that = this
|
||
const curPages = getCurrentPages()[0]; // 获取当前页面实例
|
||
if (typeof curPages.getTabBar === 'function' && curPages.getTabBar()) {
|
||
this.$mp.page.getTabBar().setData({
|
||
selected: 4
|
||
});
|
||
}
|
||
},
|
||
methods: {
|
||
receiveCoupon() {
|
||
const coupon_id = uni.getStorageSync('_ou_coupon_id')
|
||
|
||
this.req({
|
||
url: 'coupon_ling',
|
||
data: {
|
||
coupon_id
|
||
},
|
||
success: res => {
|
||
uni.removeStorageSync('_ou_coupon_id')
|
||
|
||
if (res.status == 1) {
|
||
this.$c.toast({
|
||
title: res.msg,
|
||
duration: 500,
|
||
success: () => {
|
||
this.$c.to({
|
||
url: '/package/mine/coupon-detail',
|
||
query: {
|
||
id: coupon_id
|
||
}
|
||
})
|
||
}
|
||
})
|
||
} else if (res.status == 2222) {
|
||
this.$c.to({
|
||
url: '/package/mine/coupon-detail',
|
||
query: {
|
||
id: coupon_id
|
||
}
|
||
})
|
||
}
|
||
}
|
||
})
|
||
},
|
||
|
||
completeTask(item) {
|
||
this.req({
|
||
url: 'ling_task',
|
||
data: {
|
||
task_list_id: item.id
|
||
},
|
||
success: res => {
|
||
if (res.status == 1) {
|
||
this.$c.toast({
|
||
title: res.msg,
|
||
duration: 500,
|
||
success: () => {
|
||
this.getdata()
|
||
}
|
||
})
|
||
}
|
||
}
|
||
})
|
||
},
|
||
|
||
menuTo(item) {
|
||
switch (item.id) {
|
||
case 6:
|
||
this.$refs.qunliao_show.open()
|
||
break
|
||
default:
|
||
this.$c.to({
|
||
url: item.path
|
||
})
|
||
break
|
||
}
|
||
},
|
||
|
||
copy(e) {
|
||
uni.setClipboardData({
|
||
data: `${e}`,
|
||
success: result => {},
|
||
fail: error => {}
|
||
})
|
||
},
|
||
|
||
tokefu() {
|
||
// #ifdef MP-WEIXIN
|
||
wx.openCustomerServiceChat({
|
||
extInfo: {
|
||
url: uni.getStorageSync('wx_link') //客服地址链接
|
||
},
|
||
corpId: uni.getStorageSync('corpid'), //必须和你小程序上的一致
|
||
success(res) {
|
||
console.log(res, 1)
|
||
},
|
||
fail(res) {
|
||
console.log(res, 2)
|
||
}
|
||
})
|
||
// #endif
|
||
},
|
||
getPhoneNumber(e) {
|
||
// console.log(e)
|
||
let that = this
|
||
uni.login({
|
||
success(res) {
|
||
// console.log(res)
|
||
uni.checkSession({
|
||
success() {
|
||
that.req({
|
||
url: 'login_bind_mobile',
|
||
data: {
|
||
code: e.detail.code,
|
||
encryptedData: e.detail.encryptedData,
|
||
iv: e.detail.iv
|
||
},
|
||
success(res) {
|
||
if (res.status == 1) {
|
||
uni.showToast({
|
||
title: '绑定成功~',
|
||
success() {
|
||
that.getdata()
|
||
}
|
||
})
|
||
}
|
||
}
|
||
})
|
||
}
|
||
})
|
||
}
|
||
})
|
||
},
|
||
|
||
getlist(index) {
|
||
this.show = index
|
||
this.mycollectArr = []
|
||
this.getmycollect()
|
||
},
|
||
todetail(a) {
|
||
if (a.type == 2) {
|
||
uni.navigateTo({
|
||
url: '/pages/shouye/detail_wuxian?goods_id=' + a.goods_id
|
||
})
|
||
} else {
|
||
uni.navigateTo({
|
||
url: '/pages/shouye/detail?goods_id=' +
|
||
a.goods_id +
|
||
'&goods_num=' +
|
||
a.num
|
||
})
|
||
}
|
||
},
|
||
|
||
del_soucang(a) {
|
||
let that = this
|
||
that.req({
|
||
url: 'delCollect',
|
||
data: {
|
||
id: a
|
||
},
|
||
success(res) {
|
||
if (res.status == 1) {
|
||
that.getmycollect()
|
||
}
|
||
}
|
||
})
|
||
},
|
||
|
||
chongzhi_click() {
|
||
let that = this
|
||
that.req({
|
||
url: 'recharge',
|
||
data: {
|
||
money: that.money_1
|
||
},
|
||
success(res) {
|
||
if (res.status == 1) {
|
||
uni.requestPayment({
|
||
provider: 'wxpay',
|
||
timeStamp: res.data.timeStamp,
|
||
nonceStr: res.data.nonceStr,
|
||
package: res.data.package,
|
||
signType: 'MD5',
|
||
paySign: res.data.paySign,
|
||
complete(res) {
|
||
if (res.errMsg == 'requestPayment:fail cancel') {
|
||
uni.showToast({
|
||
title: '取消支付',
|
||
icon: 'loading',
|
||
duration: 1000
|
||
})
|
||
}
|
||
if (res.errMsg == 'requestPayment:ok') {
|
||
that.$refs.chongzhi_show.close()
|
||
that.getdata()
|
||
}
|
||
}
|
||
})
|
||
}
|
||
}
|
||
})
|
||
},
|
||
|
||
getdata() {
|
||
let that = this
|
||
that.req({
|
||
url: 'user',
|
||
success(res) {
|
||
if (res.status == 1) {
|
||
that.ewm = res.data.other.erweima
|
||
that.moneyArr = res.data.other.recharge
|
||
that.userinfo = res.data.userinfo
|
||
that.taskList = res.data.task_list
|
||
uni.setStorageSync('userinfo', that.userinfo)
|
||
uni.setStorageSync('jump_appid', res.data.other.jump_appid)
|
||
uni.setStorageSync('wx_link', res.data.other.wx_link)
|
||
uni.setStorageSync('corpid', res.data.other.corpid)
|
||
console.log(res.data.userinfo.js_is_open)
|
||
if (
|
||
uni.getStorageSync('_ou_coupon_id') &&
|
||
uni.getStorageSync('token')
|
||
) {
|
||
setTimeout(() => {
|
||
that.receiveCoupon()
|
||
}, 100)
|
||
}
|
||
that.menuList.map(item => {
|
||
/* 判断集市是否展示 */
|
||
if (
|
||
item.id == 11 &&
|
||
res.data.userinfo.js_is_open == 1 &&
|
||
res.data.userinfo.is_show_js == 1
|
||
) {
|
||
item.show = true
|
||
}else{
|
||
if(item.id == 11){
|
||
item.show = false
|
||
}
|
||
}
|
||
})
|
||
}
|
||
}
|
||
})
|
||
},
|
||
getmycollect() {
|
||
let that = this
|
||
that.req({
|
||
url: 'listCollect',
|
||
Loading: true,
|
||
data: {
|
||
type: that.show
|
||
},
|
||
success(res) {
|
||
if (res.status == 1) {
|
||
that.mycollectArr = res.data.data
|
||
}
|
||
}
|
||
})
|
||
},
|
||
tixian_click() {
|
||
let that = this
|
||
console.log(that.money_2)
|
||
that.req({
|
||
url: 'withdraw',
|
||
data: {
|
||
type: that.tixian_index,
|
||
money: that.money_2,
|
||
name: that.name,
|
||
number: that.number
|
||
},
|
||
success(res) {
|
||
that.money_2 = ''
|
||
if (res.status == 0) {
|
||
that.tixian_show = false
|
||
}
|
||
}
|
||
})
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
.pop_title {
|
||
font-size: 48rpx;
|
||
font-family: YouSheBiaoTiHei;
|
||
font-weight: 400;
|
||
color: #ffffff;
|
||
text-align: center;
|
||
margin-bottom: 30rpx;
|
||
}
|
||
|
||
.mineInfo {
|
||
width: 720rpx;
|
||
/* height: 323rpx; */
|
||
/* background: url(https://xiongmaomh.languoyun.cn/newindex/mineTop.png) no-repeat; */
|
||
background-size: 100% 100%;
|
||
box-sizing: border-box;
|
||
margin: 0 auto;
|
||
box-sizing: border-box;
|
||
padding: 35rpx 36rpx 0;
|
||
}
|
||
|
||
page {
|
||
/* background: #000000; */
|
||
}
|
||
|
||
.selTitle {
|
||
font-size: 36rpx;
|
||
font-family: YouSheBiaoTiHei;
|
||
font-weight: 400;
|
||
color: #ffffff;
|
||
text-shadow: 0px 3px 8px rgba(48, 251, 253, 0.32);
|
||
}
|
||
|
||
.noTitle {
|
||
font-size: 36rpx;
|
||
font-family: YouSheBiaoTiHei;
|
||
font-weight: 400;
|
||
color: #666666;
|
||
}
|
||
|
||
.qiehuan {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
width: 750rpx;
|
||
}
|
||
|
||
.qiehuan_line {
|
||
margin: -10rpx auto;
|
||
width: 30rpx;
|
||
height: 20rpx;
|
||
border-bottom: 4rpx solid #1ff7f0;
|
||
border-radius: 4rpx;
|
||
}
|
||
|
||
.qiehuan image {
|
||
width: 169rpx;
|
||
height: 38rpx;
|
||
}
|
||
|
||
.qiehuan>view {
|
||
flex: 1;
|
||
text-align: center;
|
||
}
|
||
|
||
.wzs {
|
||
font-size: 28rpx;
|
||
color: rgb(255, 255, 255);
|
||
}
|
||
|
||
.xzs {
|
||
font-size: 32rpx;
|
||
color: #ffffff;
|
||
text-shadow: 0px 0px 12rpx rgba(150, 255, 254, 0.7);
|
||
}
|
||
|
||
button::after {
|
||
border: none;
|
||
}
|
||
|
||
button {
|
||
background-color: transparent;
|
||
padding-left: 0;
|
||
padding-right: 0;
|
||
line-height: inherit;
|
||
border-radius: 0;
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 54rpx;
|
||
height: 54rpx;
|
||
}
|
||
|
||
.name_phone>input {
|
||
font-size: 28rpx;
|
||
margin-left: 40rpx;
|
||
}
|
||
|
||
.name_phone {
|
||
padding: 20rpx 0;
|
||
box-sizing: border-box;
|
||
border-bottom: 1px solid #eeeeee;
|
||
}
|
||
|
||
.pop_tixian_input {
|
||
margin: 20rpx 0;
|
||
padding-bottom: 20rpx;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
font-size: 24rpx;
|
||
border-bottom: 1px solid #eeeeee;
|
||
}
|
||
|
||
.pop_head>view {
|
||
flex: 1;
|
||
text-align: center;
|
||
font-size: 28rpx;
|
||
margin-top: 20rpx;
|
||
}
|
||
|
||
.pop_head {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
}
|
||
|
||
.pop_box>view {
|
||
width: 180rpx;
|
||
height: 80rpx;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
margin-top: 30rpx;
|
||
margin-right: 35rpx;
|
||
|
||
font-size: 28rpx;
|
||
font-family: zihun152hao-jijiachaojihei;
|
||
font-weight: 400;
|
||
color: #ffffff;
|
||
}
|
||
|
||
.pop_box>view:nth-child(3n + 3) {
|
||
margin-right: 0;
|
||
}
|
||
|
||
.pop_box {
|
||
display: flex;
|
||
justify-content: center;
|
||
flex-wrap: wrap;
|
||
}
|
||
|
||
.pop_coucent>input {
|
||
width: 630rpx;
|
||
height: 88rpx;
|
||
background: #222222;
|
||
border: none;
|
||
border-radius: 10rpx;
|
||
padding-left: 40rpx;
|
||
font-size: 24rpx;
|
||
box-sizing: border-box;
|
||
margin-top: 30rpx;
|
||
}
|
||
|
||
.pop_coucent {
|
||
width: 690rpx;
|
||
// border: 1rpx solid #fff;
|
||
// box-shadow: 0px 0px 10rpx 0px #1ff7f0;
|
||
padding: 30rpx;
|
||
background: rgba(34, 34, 34, 0.5);
|
||
box-sizing: border-box;
|
||
margin-top: 20rpx;
|
||
font-size: 28rpx;
|
||
color: #ffffff;
|
||
}
|
||
|
||
.pop_chongzhi {
|
||
width: 692rpx;
|
||
height: 88rpx;
|
||
margin: 48rpx auto 0;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
font-size: 36rpx;
|
||
font-family: YouSheBiaoTiHei;
|
||
font-weight: 400;
|
||
color: #ffffff;
|
||
}
|
||
|
||
.ca {
|
||
position: absolute;
|
||
right: 0;
|
||
top: 50%;
|
||
transform: translateY(-50%);
|
||
}
|
||
|
||
.order_title {
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
font-size: 32rpx;
|
||
color: #ffffff;
|
||
position: relative;
|
||
font-weight: normal;
|
||
padding: 10rpx 0;
|
||
|
||
.title {
|
||
text-align: center;
|
||
|
||
font-size: 36rpx;
|
||
font-family: zihun152hao-jijiachaojihei;
|
||
font-weight: 400;
|
||
color: #ffffff;
|
||
}
|
||
}
|
||
|
||
.order {
|
||
width: 750rpx;
|
||
background: #0d0d0d;
|
||
border-radius: 30rpx 30rpx 0px 0px;
|
||
padding: 10rpx 30rpx 48rpx;
|
||
box-sizing: border-box;
|
||
position: absolute;
|
||
bottom: var(--window-bottom);
|
||
|
||
border-top: 2px solid transparent;
|
||
background-clip: padding-box, border-box;
|
||
background-origin: padding-box, border-box;
|
||
background-image: linear-gradient(to right, #000, #000),
|
||
linear-gradient(20deg, #ffffff, #a11aff, #85dfff, #ba39ff);
|
||
|
||
.chong-bt {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
padding: 40rpx 0 0;
|
||
|
||
.money {
|
||
font-size: 28rpx;
|
||
font-family: zihun152hao-jijiachaojihei;
|
||
font-weight: 400;
|
||
color: #ffffff;
|
||
}
|
||
|
||
.pay-btn {
|
||
width: 206rpx;
|
||
height: 84rpx;
|
||
}
|
||
}
|
||
}
|
||
|
||
.pop {
|
||
width: 506rpx;
|
||
height: 380px;
|
||
position: relative;
|
||
background: #B198E2;
|
||
box-shadow: 0rpx 0rpx 16rpx 0rpx rgba(137,77,211,0.33);
|
||
border-radius: 44rpx;
|
||
>view:nth-child(1){
|
||
padding-top: 40rpx;
|
||
>image{
|
||
width: 430rpx;
|
||
height: 430rpx;
|
||
margin: 0 auto 0;
|
||
background: #FFFFFF;
|
||
}
|
||
}
|
||
&-view{
|
||
position: absolute;
|
||
left: 0;
|
||
bottom: 0;
|
||
width: 506rpx;
|
||
height: 276rpx;
|
||
box-sizing: border-box;
|
||
padding: 68rpx 0 0 40rpx;
|
||
background: url($imgurl+'index/hudu.png') no-repeat 0 0 / 100% 100%;
|
||
|
||
>text:nth-child(1){
|
||
font-weight: 400;
|
||
font-size: 52rpx;
|
||
color: #894DD3;
|
||
text-shadow: #fff 1px 0 0, #fff 0 1px 0, #fff -1px 0 0, #fff 0 -1px 0;
|
||
}
|
||
>text:nth-child(2){
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #894DD3;
|
||
margin-top: 10rpx;
|
||
}
|
||
}
|
||
&-liwu{
|
||
position: absolute;
|
||
right: -160rpx;
|
||
width: 380rpx;
|
||
height: 260rpx;
|
||
bottom: -60rpx;
|
||
z-index: 10;
|
||
}
|
||
&-close{
|
||
width: 94rpx;
|
||
height: 94rpx;
|
||
position: absolute;
|
||
bottom: -140rpx;
|
||
left: 50%;
|
||
transform: translateX(-50%);
|
||
opacity: 0.6;
|
||
}
|
||
}
|
||
|
||
.mengban {
|
||
width: 100%;
|
||
height: 100%;
|
||
position: fixed;
|
||
top: 0;
|
||
left: 0;
|
||
right: 0;
|
||
z-index: 999;
|
||
background: rgba(0, 0, 0, 0.45);
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
}
|
||
|
||
.p_t_r {
|
||
position: absolute;
|
||
top: -20rpx;
|
||
right: -10rpx;
|
||
width: 32rpx !important;
|
||
height: 32rpx !important;
|
||
}
|
||
|
||
.shop_item>image {
|
||
width: 216rpx;
|
||
height: 216rpx;
|
||
border-radius: 8rpx 8rpx 0 0;
|
||
margin: 13rpx auto;
|
||
display: block;
|
||
}
|
||
|
||
.shop_text>.hang1 {
|
||
margin-bottom: 10rpx;
|
||
}
|
||
|
||
.shop_text {
|
||
padding: 2rpx 23rpx;
|
||
box-sizing: border-box;
|
||
}
|
||
|
||
.shop_item {
|
||
width: 242rpx;
|
||
height: 343rpx;
|
||
/* border-radius: 10rpx; */
|
||
margin-top: 10rpx;
|
||
position: relative;
|
||
color: #ffffff;
|
||
font-size: 24rpx;
|
||
}
|
||
|
||
.shop_coucent>view:nth-child(3n-1) {
|
||
margin: 10rpx 0rpx 0;
|
||
}
|
||
|
||
.shop_coucent {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
font-size: 24rpx;
|
||
}
|
||
|
||
.sc_title {
|
||
width: 686rpx;
|
||
height: 22rpx;
|
||
margin: 0 auto;
|
||
}
|
||
|
||
.tuijian {
|
||
width: 750rpx;
|
||
padding: 0 13rpx 100rpx 13rpx;
|
||
box-sizing: border-box;
|
||
margin: 30rpx auto;
|
||
/* background-color: #222; */
|
||
}
|
||
|
||
.list>view>view>image {
|
||
margin-right: 20rpx;
|
||
}
|
||
|
||
.list image {
|
||
width: 12rpx;
|
||
height: 22rpx;
|
||
}
|
||
|
||
.list>view>view>image:nth-of-type(1) {
|
||
width: 32rpx;
|
||
height: 32rpx;
|
||
}
|
||
|
||
.list>view>view {
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
|
||
.list>view {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
/* border-bottom: 1px solid #EEEEEE; */
|
||
padding: 24rpx 0;
|
||
}
|
||
|
||
.list {
|
||
width: 710rpx;
|
||
/* height: 700rpx; */
|
||
margin: 0 auto;
|
||
padding: 0rpx 20rpx;
|
||
box-sizing: border-box;
|
||
font-size: 28rpx;
|
||
color: #ffffff;
|
||
|
||
/* background: linear-gradient(135deg, transparent 10px, #F07D17 0); */
|
||
/* background: url(https://hdyfs.languowangluo.cn/zcq/mine/cz_bg.png) no-repeat; */
|
||
/* background-size: 100% 100%; */
|
||
}
|
||
|
||
.hegui image {
|
||
width: 32rpx;
|
||
height: 32rpx;
|
||
margin-right: 20rpx;
|
||
}
|
||
|
||
.hegui>image {
|
||
width: 40rpx;
|
||
height: 40rpx;
|
||
margin: 0;
|
||
}
|
||
|
||
.hegui>view {
|
||
display: flex;
|
||
align-items: center;
|
||
color: #ffffff;
|
||
font-size: 28rpx;
|
||
}
|
||
|
||
.hegui {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
width: 690rpx;
|
||
height: 99rpx;
|
||
background: rgba(15, 31, 67, 0.43);
|
||
border: 1px solid;
|
||
border-image: linear-gradient(269deg, #1ed3f9, #a31f9e, #2ad3f3, #c41fc1) 1 1;
|
||
border-radius: 10rpx;
|
||
margin: 30rpx auto;
|
||
padding: 0 20rpx;
|
||
box-sizing: border-box;
|
||
}
|
||
|
||
.tixian_r>image {
|
||
width: 143rpx;
|
||
height: 59rpx;
|
||
}
|
||
|
||
.tixian_r {
|
||
text-align: right;
|
||
}
|
||
|
||
.tixian_r>view:nth-child(2) {
|
||
width: 132rpx;
|
||
height: 48rpx;
|
||
background: #1ac762;
|
||
border-radius: 24rpx;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
font-size: 28rpx;
|
||
color: #ffffff;
|
||
margin-top: 20rpx;
|
||
}
|
||
|
||
.tixian_r>view:nth-child(1) {
|
||
width: 132rpx;
|
||
height: 48rpx;
|
||
border: 1px solid #1ac762;
|
||
color: #1ac762;
|
||
border-radius: 24rpx;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
font-size: 28rpx;
|
||
/* text-shadow: 0px 0px 14rpx rgba(237, 87, 255, 0.7);
|
||
font-family: 'zcq'; */
|
||
}
|
||
|
||
.tixian_l image {
|
||
width: 12rpx;
|
||
height: 22rpx;
|
||
margin-left: 10rpx;
|
||
}
|
||
|
||
.tixian_l {
|
||
font-size: 28rpx;
|
||
font-family: zihun152hao-jijiachaojihei;
|
||
font-weight: 400;
|
||
color: #ffffff;
|
||
}
|
||
|
||
.tixian {
|
||
width: 720rpx;
|
||
height: 210rpx;
|
||
margin: 30rpx auto 0;
|
||
border-radius: 20rpx;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
padding: 0 46rpx;
|
||
box-sizing: border-box;
|
||
color: #ffffff;
|
||
}
|
||
|
||
.youhui text {
|
||
margin-right: 10rpx;
|
||
font-size: 32rpx;
|
||
/* font-family: 'zcq'; */
|
||
}
|
||
|
||
.youhui>view>view:nth-of-type(2) {
|
||
font-size: 24rpx;
|
||
margin-top: 28rpx;
|
||
}
|
||
|
||
.youhui>view:nth-of-type(1)::after,
|
||
.youhui>view:nth-of-type(2)::after {
|
||
content: '';
|
||
width: 2rpx;
|
||
height: 40rpx;
|
||
/* background: #FFFFFF; */
|
||
position: absolute;
|
||
right: 0;
|
||
top: 0;
|
||
bottom: 0;
|
||
margin: auto;
|
||
}
|
||
|
||
.youhuiTitle {
|
||
font-size: 28rpx;
|
||
font-family: YouSheBiaoTiHei;
|
||
font-weight: 400;
|
||
}
|
||
|
||
.youhui>view {
|
||
font-size: 24rpx;
|
||
text-align: center;
|
||
position: relative;
|
||
flex: 1;
|
||
}
|
||
|
||
.youhui {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
/* width: 690rpx; */
|
||
height: 193rpx;
|
||
margin: 0rpx auto 0;
|
||
color: #ffffff;
|
||
padding-bottom: 30rpx;
|
||
}
|
||
|
||
.id_z>image {
|
||
width: 84rpx;
|
||
height: 20rpx;
|
||
margin-left: 20rpx;
|
||
}
|
||
|
||
.id_z {
|
||
font-size: 24rpx;
|
||
margin-top: 10rpx;
|
||
color: #999999;
|
||
}
|
||
|
||
.phone_z {
|
||
font-size: 32rpx;
|
||
/* font-weight: bold; */
|
||
}
|
||
|
||
.headimg {
|
||
width: 105rpx;
|
||
height: 105rpx;
|
||
border-radius: 50%;
|
||
margin-right: 30rpx;
|
||
}
|
||
|
||
.jp_headimg>image {
|
||
width: 132rpx;
|
||
height: 132rpx;
|
||
/* border: 1px solid #FE0032; */
|
||
border-radius: 50%;
|
||
/* clip-path: polygon(50% 10%, 85% 30%, 85% 70%, 50% 92%, 17% 71%, 16% 30%); */
|
||
/* polygon(75% 0, 100% 50%, 75% 100%, 25% 100%, 0 50%, 25% 0) */
|
||
}
|
||
|
||
.jp_headimg {
|
||
width: 132rpx;
|
||
height: 132rpx;
|
||
margin: 25rpx 0 0 12rpx;
|
||
}
|
||
|
||
.head_name {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
position: relative;
|
||
/* text-shadow: rgba(150, 255, 254, 0.7) 0px 0px 10rpx; */
|
||
}
|
||
|
||
.header_title {
|
||
font-size: 40rpx;
|
||
font-family: iFontszhounianti;
|
||
font-weight: bold;
|
||
font-style: oblique;
|
||
color: #ffffff;
|
||
}
|
||
|
||
.header {
|
||
width: 100%;
|
||
color: #ffffff;
|
||
position: relative;
|
||
box-sizing: border-box;
|
||
|
||
padding-top: calc(var(--status-bar-height) + 80rpx);
|
||
}
|
||
|
||
.mine {
|
||
width: 750rpx;
|
||
position: relative;
|
||
padding-bottom: 100px;
|
||
min-height: 100vh;
|
||
box-sizing: border-box;
|
||
background: #1C1B20 url($imgurl+'my/myBg.png') no-repeat 0 0 / 750rpx 500rpx;
|
||
|
||
.user-card {
|
||
position: relative;
|
||
padding: 20rpx 30rpx;
|
||
|
||
.user-info {
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.avatar {
|
||
width: 100rpx;
|
||
height: 100rpx;
|
||
border-radius: 50%;
|
||
overflow: hidden;
|
||
background: #000;
|
||
|
||
image {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
|
||
.info {
|
||
width: calc(100% - 100rpx);
|
||
box-sizing: border-box;
|
||
padding-left: 30rpx;
|
||
|
||
.nick {
|
||
max-width: 200rpx;
|
||
|
||
font-size: 32rpx;
|
||
font-family: Source Han Sans CN;
|
||
font-weight: 400;
|
||
color: #ffffff;
|
||
}
|
||
|
||
.user-day {
|
||
margin-top: 10rpx;
|
||
|
||
font-size: 24rpx;
|
||
font-family: Source Han Sans CN;
|
||
font-weight: 400;
|
||
color: #cccccc;
|
||
}
|
||
}
|
||
}
|
||
|
||
.lv-box {
|
||
height: 100rpx;
|
||
margin-top: 80rpx;
|
||
box-sizing: border-box;
|
||
background: url($imgurl+'my/userVip.png') no-repeat 0 0 / 100% 100%;
|
||
padding-left: 136rpx;
|
||
&-dengji{
|
||
font-weight: 500;
|
||
font-size: 40rpx;
|
||
color: #FFFFFF;
|
||
width: 100rpx;
|
||
text-shadow: #121212 1rpx 0 0, #121212 0 1rpx 0, #121212 -1rpx 0 0, #121212 0 -1rpx 0;
|
||
}
|
||
&-ouqi{
|
||
>text{
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #FFFFFF;
|
||
}
|
||
>view{
|
||
width: 280rpx;
|
||
// height: 24rpx;
|
||
border-radius: 12rpx;
|
||
border: 1px solid #111111;
|
||
>text{
|
||
font-weight: 400;
|
||
font-size: 20rpx;
|
||
color: #D2DBFF;
|
||
position: absolute;
|
||
left: 50%;
|
||
top: 0;
|
||
line-height: 24rpx;
|
||
transform: translateX(-50%);
|
||
z-index: 10;
|
||
}
|
||
}
|
||
}
|
||
|
||
&-detail{
|
||
width: 140rpx;
|
||
text-align: center;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #FFFFFF;
|
||
text-shadow: #121212 1rpx 0 0, #121212 0 1rpx 0, #121212 -1rpx 0 0, #121212 0 -1rpx 0;
|
||
}
|
||
}
|
||
|
||
.rbtn {
|
||
position: absolute;
|
||
z-index: 10;
|
||
right: 10rpx;
|
||
top: 10rpx;
|
||
width: 110rpx;
|
||
height: 50rpx;
|
||
font-size: 28rpx;
|
||
font-family: Source Han Sans CN;
|
||
font-weight: 400;
|
||
color: #ffffff;
|
||
|
||
&.btn1 {
|
||
top: 80rpx;
|
||
}
|
||
}
|
||
}
|
||
|
||
.money-card {
|
||
width: 690rpx;
|
||
margin: 0 auto 0;
|
||
.other-num {
|
||
display: flex;
|
||
justify-content: space-around;
|
||
padding: 40rpx 0 0;
|
||
|
||
.other-item {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 200rpx;
|
||
height: 110rpx;
|
||
background: #1C1B20;
|
||
border: 4rpx solid #5B5B5D;
|
||
border-radius: 20rpx;
|
||
|
||
.title {
|
||
font-size: 24rpx;
|
||
font-family: Source Han Sans CN;
|
||
font-weight: 400;
|
||
color: #ffffff;
|
||
}
|
||
|
||
.num {
|
||
margin-top: 10rpx;
|
||
font-size: 40rpx;
|
||
font-family: Source Han Sans CN;
|
||
font-weight: 500;
|
||
color: #ffffff;
|
||
}
|
||
}
|
||
}
|
||
.moneyTitle{
|
||
font-weight: 500;
|
||
font-size: 32rpx;
|
||
color: #FFFFFF;
|
||
}
|
||
.money {
|
||
display: flex;
|
||
align-items: flex-end;
|
||
padding: 0 10rpx;
|
||
font-size: 60rpx;
|
||
font-family: Source Han Sans CN;
|
||
font-weight: 500;
|
||
color: #FFFFFF;
|
||
height: 120rpx;
|
||
background: #313133;
|
||
border: 6rpx solid #5B5B5D;
|
||
>view:nth-child(1){
|
||
>image{
|
||
width: 100rpx;
|
||
height: 80rpx;
|
||
}
|
||
>text:nth-of-type(1){
|
||
font-weight: 400;
|
||
font-size: 40rpx;
|
||
color: #F8D300;
|
||
}
|
||
>text:nth-of-type(2){
|
||
font-weight: 500;
|
||
font-size: 48rpx;
|
||
color: #F8D300;
|
||
}
|
||
}
|
||
|
||
.money-detail {
|
||
display: flex;
|
||
align-items: center;
|
||
padding-left: 16rpx;
|
||
font-size: 24rpx;
|
||
font-weight: 400;
|
||
color: #FFFFFF;
|
||
}
|
||
}
|
||
}
|
||
|
||
.task {
|
||
margin: 30rpx auto 0;
|
||
width: 690rpx;
|
||
box-sizing: border-box;
|
||
padding: 0 0 20rpx;
|
||
|
||
.task-title {
|
||
position: relative;
|
||
z-index: 1;
|
||
margin-bottom: 30rpx;
|
||
font-size: 32rpx;
|
||
font-family: Source Han Sans CN;
|
||
font-weight: 400;
|
||
color: #ffffff
|
||
}
|
||
.task-list{
|
||
background: #313133;
|
||
border-radius: 20rpx;
|
||
border: 4rpx solid #5B5B5D;
|
||
padding: 30rpx;
|
||
}
|
||
|
||
.task-item {
|
||
padding: 20rpx 0;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
|
||
.task-l {
|
||
.title {
|
||
font-size: 32rpx;
|
||
font-family: Source Han Sans CN;
|
||
font-weight: 400;
|
||
color: #ffffff;
|
||
}
|
||
|
||
.num {
|
||
margin: 20rpx 0;
|
||
|
||
font-size: 26rpx;
|
||
font-family: Source Han Sans CN;
|
||
font-weight: 400;
|
||
color: #cccccc;
|
||
}
|
||
|
||
.progress {
|
||
display: flex;
|
||
align-items: center;
|
||
font-size: 24rpx;
|
||
font-family: Source Han Sans CN;
|
||
font-weight: 400;
|
||
color: #cccccc;
|
||
|
||
.progress-inner {
|
||
width: 300rpx;
|
||
margin-right: 6rpx;
|
||
|
||
/deep/.cmd-progress-inner {
|
||
background: #5B5B5D;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.task-r {
|
||
flex: 1;
|
||
display: flex;
|
||
justify-content: flex-end;
|
||
padding-left: 30rpx;
|
||
|
||
.btn {
|
||
width: 150rpx;
|
||
height: 60rpx;
|
||
border-radius: 40rpx;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
border: 1px solid #ff873a;
|
||
|
||
text {
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #ff873a;
|
||
}
|
||
|
||
&.act {
|
||
background: #ff873a;
|
||
|
||
text {
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #FFFFFF;
|
||
}
|
||
}
|
||
|
||
&.dis {
|
||
background: #1C1B20;
|
||
border-radius: 30rpx;
|
||
|
||
text {
|
||
color: #CCCCCC;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
.qita{
|
||
&-title{
|
||
font-weight: 500;
|
||
font-size: 32rpx;
|
||
color: #FFFFFF;
|
||
padding-left: 40rpx;
|
||
}
|
||
.menu-card {
|
||
margin: 30rpx auto 0;
|
||
width: 690rpx;
|
||
padding: 1rpx 0 40rpx;
|
||
display: flex;
|
||
flex-flow: row wrap;
|
||
|
||
.menu-item {
|
||
margin-top: 40rpx;
|
||
display: flex;
|
||
flex-flow: column nowrap;
|
||
align-items: center;
|
||
width: 25%;
|
||
|
||
.icon {
|
||
width: 60rpx;
|
||
height: 60rpx;
|
||
}
|
||
|
||
.title {
|
||
margin-top: 10rpx;
|
||
font-size: 28rpx;
|
||
font-family: Source Han Sans CN;
|
||
font-weight: 400;
|
||
color: #dddddd;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.copyright {
|
||
padding: 30rpx;
|
||
text-align: center;
|
||
font-size: 24rpx;
|
||
color: #888;
|
||
}
|
||
|
||
.status_bar {
|
||
height: var(--status-bar-height);
|
||
width: 100%;
|
||
font-size: 40rpx;
|
||
font-family: iFontszhounianti;
|
||
font-weight: bold;
|
||
font-style: oblique;
|
||
color: #ffffff;
|
||
margin-bottom: 10rpx;
|
||
}
|
||
</style> |