You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 
 
yanzong_qianduan/pages/news/user/index.vue

421 lines
9.5 KiB

<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>