<template> <view class="user"> <view class="order-navbar"> <u-navbar :title="title" :border-bottom="false" :background="background"></u-navbar> </view> <view class="user-hd"> <view class="avater"> <image :src="form.avatar_url?form.avatar_url:`${$picUrl}/static/news/avater.png`"></image> </view> <view class="info"> <!-- p会员 无p游客 --> <view class="name">{{form.nick_name}}<text class="p">{{form.user_type_text}}</text></view> <!-- <view class="desc">真实姓名:张三</view> --> <view class="desc">{{form.mobile}}</view> </view> </view> <view class="user-show"> <view class="a"> <text>余额(元)</text>¥{{form.balance?form.balance:0.00}} </view> <view class="a"> <text>积分(分)</text>{{form.points?form.points:0.00}} </view> </view> <view class="user-order" @click="goJump()"> <view class="a">关联订单</view> <view class="b"> <view class="num" v-show="form.order_num>0">{{form.order_num}}</view> <u-icon name="arrow-right"></u-icon> </view> </view> <view class="user-do"> <view class="a">用户信息</view> <view class="b">编辑信息</view> </view> <view class="user-bd"> <!-- <view class="item"> <view class="a">登录密码</view> <view class="b"><view class="select select-on">****</view></view> </view> --> <view class="item"> <view class="a">上级推广人</view> <view class="b"> <view class="select select-on">{{form.inviter?form.inviter.nick_name:''}}</view> <!-- <u-icon style="margin-left: 10rpx;" name="arrow-right"></u-icon> --> </view> </view> <!-- <view class="item"> <view class="a">用户分组</view> <view class="b"> <view class="select">请选择用户分组</view> <u-icon style="margin-left: 10rpx;" name="arrow-right"></u-icon> </view> </view> <view class="item"> <view class="a">用户标签</view> <view class="b"> <view class="select">请选择用户分组</view> <u-icon style="margin-left: 10rpx;" name="arrow-right"></u-icon> </view> </view> <view class="items"> <view class="a">推广资格 <u-switch v-model="checked" active-color="#55BD6A" ></u-switch></view> <view class="b"> 指定分销模式下,开启或关闭用户的推广权限 </view> </view> --> <view class="items"> <view class="a">用户状态 <u-switch v-model="form.is_allow_promotion" :activeValue="1" :inactiveValue="0" active-color="#55BD6A" ></u-switch> </view> <view class="b"> 指定分销模式下,开启或关闭用户的推广权限 </view> </view> <view class="item"> <view class="a">会员状态</view> <view class="b"> <u-switch v-model="form.status" :activeValue="1" :inactiveValue="0" active-color="#55BD6A" ></u-switch> </view> </view> </view> <view class="user-fd" @click="updateVipHandle"> <view class="b"> 确认修改 </view> </view> </view> </template> <script> import * as Vip from '@/api/user/vip' import * as newFunApi from '@/api/newFun' // import img from "@/static/news/login-bg.png" export default { data() { return { form:{ address_id: null, avatar: null, avatar_id: null, avatar_url: null, balance: "", city: null, country: null, create_time: "", effective_time: null, expend_money: "", gender: "", grade: null, grade_id: null, inviter:null, is_allow_promotion:null, is_delete: null, last_login_time: null, mobile: "", nick_name: "", order_num:'', pay_money: "", platform: "", points: null, province: null, status:null, store_id: null, update_time: "", user_id: null, user_type: null, user_type_text: "" }, checked: true, isScroll: true, background: { background: 'url(https://www.royaum.com.cn/static/news/login-bg.png) centertop no-repeat', // background: 'url('+ img+') center top no-repeat', backgroundSize: '100% auto', }, title:'会员管理', total:0 } }, onPageScroll(e){ if(e.scrollTop <= 44){ this.isScroll = true; }else{ this.isScroll = false; } }, methods: { goJump(){ if(this.title=='会员管理'){ uni.navigateTo({ url:"/pages/news3/shopOrder?user_id="+this.form.user_id+'&dataType='+'all' }) }else{ uni.navigateTo({ url:"/pages/news3/shopDealerOrder?user_id="+this.form.user_id }) } }, async updateVipHandle(){ let params={ "user_id":this.form.user_id, "status":this.form.status?1:0, "is_allow_promotion":this.form.is_allow_promotion?1:0, } let res = await Vip.updateVip(params) if(res.status==200){ uni.showToast({ title: '修改成功' }); } }, }, async onLoad(option) { console.log(JSON.parse(option.item)) this.form = Object.assign({},this.form,JSON.parse(option.item)) this.form.is_allow_promotion = this.form.is_allow_promotion==1?true:false this.form.status = this.form.status==1?true:false; this.title = option.title; } } </script> <style lang="scss" scoped> .user{ width: 100%; padding: 0 0 150rpx; box-sizing: border-box; overflow: hidden; background: url(https://www.royaum.com.cn/static/news/login-bg.png) center top no-repeat; background-size: 100% auto; min-height: 100vh; &-hd{ padding: 60rpx 40rpx 30rpx; display: flex; align-items: flex-start; .avater{ width: 114rpx; height: 114rpx; margin-right: 30rpx; image{ width: 100%; height: 100%; border-radius: 50%; } } .info{ flex: 1; overflow: hidden; font-size: 28rpx; font-weight: 400; color: #5E5E5E; line-height: 55rpx; .name{ font-size: 32rpx; font-weight: 500; color: #2A2A2A; display: flex; align-items: center; text{ display: block; // width: 98rpx; border: 1px solid #FFB950; // height: 40rpx; padding:0 10rpx; font-size: 28rpx; font-weight: 400; color: #FFB343; line-height: 40rpx; border-radius: 40rpx; text-align: center; margin-left: 20rpx; background-color: #fff; &.p{ color: #F34A40; border-color: #F34A40; } } } } } &-show{ width: 704rpx; height: 170rpx; background: #FFFFFF; border-radius: 8rpx; margin: 0 auto; padding: 35rpx; box-sizing: border-box; display: flex; align-items: center; .a{ flex: 1; text-align: center; font-size: 36rpx; font-weight: 400; color: #383838; text-align: center; &:first-child{ border-right: 1px solid #F3F3F3; } text{ display: block; font-size: 28rpx; font-weight: 400; color: #B2B2B2; margin-bottom: 20rpx; } } } &-order{ width: 704rpx; background: #FFFFFF; border-radius: 8rpx; margin: 0 auto; padding: 25rpx 20rpx; box-sizing: border-box; display: flex; align-items: center; justify-content: space-between; margin-top: 16rpx; .a{ } .b{ flex: 1; display: flex; align-items: center; justify-content: flex-end; color: #9E9E9E; .num{ width: 44rpx; height: 44rpx; background: #FF6257; border-radius:44rpx; line-height: 44rpx; color: #fff; text-align: center; font-size: 20rpx; margin-right: 10rpx; } } } &-do{ width: 704rpx; margin: 0 auto; padding: 35rpx 25rpx; box-sizing: border-box; display: flex; align-items: center; justify-content: space-between; .a{ font-size: 28rpx; font-weight: 400; color: #A3A3A3; } .b{ font-size: 28rpx; font-weight: 400; color: #307BF6; } } &-bd{ width: 704rpx; background: #FFFFFF; border-radius: 8rpx; margin: 0 auto; padding: 0 20rpx; box-sizing: border-box; .item{ padding: 25rpx 0; border-top: 1px solid rgba(242,242,242,0.83); display: flex; align-items: center; justify-content: space-between; &:first-child{ border-top-color: #fff; } .a{ font-size: 28rpx; font-weight: 400; color: #454545; } .b{ flex: 1; font-size: 28rpx; font-weight: 400; color: #9d9d9d; display: flex; align-items: center; justify-content: flex-end; .select{ &-on{ color:#454545; } color: #9d9d9d; } } } .items{ padding: 25rpx 0; border-top: 1px solid rgba(242,242,242,0.83); &:first-child{ border-top-color: #fff; } .a{ font-size: 28rpx; font-weight: 400; color: #454545; display: flex; align-items: center; justify-content: space-between; } .b{ flex: 1; font-size: 28rpx; font-weight: 400; color: #9d9d9d; text-align: left; padding-top: 10rpx; } } } &-fd{ width: 100%; background-color: #fafafa; box-sizing: border-box; position: fixed; left: 0; bottom: 0; z-index: 200; padding: 20rpx 40rpx; display: flex; align-items: center; justify-content: space-between; .b{ // width: 630rpx; width:100%; line-height: 83rpx; // background: #FFAAA4; background: #FF6257; border-radius: 83rpx; text-align: center; font-size: 28rpx; font-weight: 500; color: #FFFFFF; } } } </style>