Commit b0175e9b authored by zhangjianguo's avatar zhangjianguo

分销中心

parent b0368046
<template>
<view class="s_addStyle" :style="{'height':contentHeight}">
<image :src="bg_img" style="width: 100%;height: 165px;"></image>
<view style='width: 94%;margin-left: 3%;margin-top: 10px;'>
<Text style='padding: 10px 0;width: 100%;border-bottom: 1px solid #f5f5f5;display: inline-block;'>
欢迎加入
<Text :style="{color:mainColor}">{{topname}}</Text>
,请填写申请信息
</Text>
<view class='addTbox'>
<view class="addTbox_l">
<Text>邀请人</Text>
</view>
<Text :style="{color:mainColor}">{{userinfo.identity.parent_name}} <Text style='color: #6F6666;'>(请核对)</Text> </Text>
</view>
<view class='addTbox'>
<view class="addTbox_l">
<Text>姓名</Text>
</view>
<input class="uni-input" v-model="name" placeholder="请输入真实姓名" />
</view>
<view class='addTbox'>
<view class="addTbox_l">
<Text>手机号码</Text>
</view>
<input class="uni-input" type="number" v-model="mobile" placeholder="请填写手机号码" />
</view>
<view class='addTbox'>
<u-checkbox-group @change="Select">
<u-checkbox v-model="checked" shape="circle" :active-color="mainColor" label-size='24'
>我已经阅读并了解</u-checkbox
>
</u-checkbox-group>
<Text style='font-size: 12px;color: #1F4C87;' @click='showagreement'>【分销申请协议】</Text>
</view>
</view>
<view style="width: 100%;height:70px ;background: #F7F7F7;display: flex;align-items: center;justify-content: center;">
<view :style="{background:mainColor}" class="apply" @click="apply">
<Text style='color: #fff;font-weight: 500;'>申请成为分销商</Text>
</view>
</view>
<view class="addbottom">
<view class="add_b_box" style="border-bottom: 1px solid #f5f5f5">
<Text style='font-size: 13px;color:#666666 ;'>分销商特权</Text>
</view>
<view class="add_b_box" style="border-bottom: 1px solid #f5f5f5">
<u-icon name="gold-coin-o" color="#F0A158" size='50'></u-icon>
<view style='display: flex;flex-direction: column;margin-left: 10px;'>
<Text>销售拿佣金</Text>
<Text style='font-size: 13px;color:#666666 ;margin-top: 5px;'>成为分销商后卖的商品,您可以获得佣金</Text>
</view>
</view>
<view class="add_b_box" >
<Text style='font-size: 12px;color:#666666 ;'>分销商的商品销售统一由厂家直接收款、直接发货,并提供产品的售后服务,分销佣金由厂家统一设置。</Text>
</view>
</view>
<view class="agreementbox" v-if='isshowagreement==true'></view>
<view class="agreementbox_t" v-if='isshowagreement==true'>
<view class="agreement_b">
<Text style='height: 40px;line-height: 40px;'>分销申请协议</Text>
<!-- <view>TODO内容</view> -->
<view style="width: 100%;height: 760rpx;padding: 20rpx;">
</view>
<view class="agreement_bottom" :style="{background:mainColor}" @click="read">
<Text style='color: #fff;'>我已阅读</Text>
</view>
</view>
</view>
<u-toast ref="uToast" />
</view>
</template>
<script>
export default {
data() {
return {
pageTitle: "分销申请",
contentHeight:0,
mainColor:'',
secondary:'',
bg_img:'',
userinfo:{},
topname:'',
checked:false,
isshowagreement:false,
name:'',
mobile:'',
}
},
onLoad(option){
if(option.u!=undefined){
let u = JSON.parse(decodeURIComponent(option.u))
this.userinfo = u
}
},
created(){
this.contentHeight = this.$utils.calcContentHeight(-40)+'px';
this.mainColor = this.$uiConfig.mainColor;
this.secondary = this.$uiConfig.secondary;
},
mounted() {
let currentPages = getCurrentPages();
let u = "/" + currentPages[currentPages.length-1].route;
let pages = wx.getStorageSync("basedata")
? wx.getStorageSync("basedata").bar_title
: [];
pages.forEach((x) => {
if (x.value == u) {
this.pageTitle = x.new_name ? x.new_name : x.name;
}
});
this.bg_img = wx.getStorageSync("basedata")
? wx.getStorageSync("basedata").__wxapp_img.share.apply
: '';
this.topname = wx.getStorageSync("basedata")
? wx.getStorageSync("basedata").mall.name
: '';
uni.setNavigationBarTitle({
title: this.pageTitle,
});
},
methods: {
Select(){
console.log(this.checked)
},
showagreement(){
this.isshowagreement = true
},
read(){
this.checked = true;
this.isshowagreement = false
},
apply(){
if(this.checked==false){
this.$refs.uToast.show({
title: "请先查看分销协议并同意"
});
return false
}
if(this.name==''){
this.$refs.uToast.show({
title: "请输入真实姓名"
});
return false
}
if(this.mobile==''){
this.$refs.uToast.show({
title: "请填写手机号码"
});
return false
}
// TODO 接口暂时不知道是哪个
}
}
}
</script>
<style>
.s_addStyle{
background: #fff;
position: relative;
}
.s_addStyle .addTbox{
width: 100%;
border-bottom: 1px solid #f5f5f5;
display: flex;
flex-direction: row;
align-items: center;
height: 50px;
}
.addTbox .addTbox_l{
width:180rpx ;
}
.s_addStyle .apply{
width: 93%;
height: 45px;
border-radius: 22.5px;
display: flex;
align-items: center;
justify-content: center;
}
.s_addStyle .addbottom{
width: 100%;
border-bottom: 1px solid #f5f5f5;
display: flex;
flex-direction: column;
align-items: center;
margin-bottom: 50px;
}
.s_addStyle .addbottom .add_b_box{
width: 90%;
padding: 10px 0;
display: flex;
flex-direction: row;
align-items: center;
}
.s_addStyle .agreementbox{
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 100%;
background: #333333;
opacity: 0.3;
z-index: 888;
}
.s_addStyle .agreementbox_t{
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 100%;
z-index: 999;
display: flex;
align-items: center;
justify-content: center;
}
.s_addStyle .agreementbox_t .agreement_b{
width:80% ;
border-radius: 10px;
background: #fff;
display: flex;
flex-direction: column;
align-items: center;
overflow: hidden;
}
.s_addStyle .agreementbox_t .agreement_bottom{
width: 100%;
height: 50px;
display: flex;
align-items: center;
justify-content: center;
}
</style>
<template>
<view class="shareindexStyle" :style="{'height':contentHeight}">
<view class="shareadd" v-if="sharestatus.is_can_apply==true && sharestatus.status==2">
<u-empty text=" " mode="data"></u-empty>
<Text style='margin: 10px 0;'>您还不是分销商,请先提交申请!</Text>
<view class="shareadd_b" :style="{background:mainColor}" @click="goaddurl">
<Text>立即前往</Text>
</view>
</view>
<view style="width: 100%;height: 100%;">
<view class="sharebox_top" :style="{background:mainColor}">
<view class="sharebox_top_t">
<view class="top_t_l">
<image :src="userinfo.avatar" style="width: 66px;height: 66px;border-radius: 33px;" mode='aspectFit'></image>
<view style="display: flex;flex-direction: column;color: #fff;margin-left: 5px;">
<Text style='font-size: 16px;'>{{sharestatus.share.name}}</Text>
<Text>推荐人:{{userinfo.identity.parent_name}}</Text>
<Text>分销等级:{{sharestatus.share.level==1?'分销商':''}}</Text>
</view>
</view>
<view style="display: flex;flex-direction: row;align-items: center;color: #fff;">
<Text>升级条件</Text>
<u-icon name="arrow" color='#fff'></u-icon>
</view>
</view>
<view style="width: 100%;height: 1px;background: #fff;margin: 10px 0;"></view>
<view class="sharebox_top_t">
<view style="display: flex;flex-direction: column;color: #fff;">
<Text>可提现佣金</Text>
<Text style='font-size: 18px;'>{{sharestatus.share.money}} <Text style='font-size: 14px;'></Text> </Text>
</view>
<view style="width: 55px;height: 30px;border-radius: 15px;border:1px solid #fff;display: flex;align-items: center;justify-content: center;color: #fff;">
<Text>提现</Text>
</view>
</view>
</view>
<view class="sharebox_c">
<view class="center_item">
<Text style='color: #57AC4F;font-size: 14px;'>已提现佣金</Text>
<Text>{{sharestatus.share.total_money - sharestatus.share.money}}</Text>
</view>
<view style="width: 2px;height: 60px;background: #f5f5f5;"></view>
<view class="center_item">
<Text :style="{color:secondary,fontSize:'14px'}">未结算佣金</Text>
<Text>{{sharestatus.share.total_money - sharestatus.share.money}}</Text>
</view>
</view>
<view class="sharebox_menus">
<view class="menus_item"></view>
</view>
</view>
<!-- <auth v-if="showAuth" @changeuserinfo="reloadUserinfo"></auth> -->
</view>
</template>
<script>
import auth from "../../../components/auth/index.vue";
export default {
components:{
auth,
},
data() {
return {
pageTitle: "分销中心",
contentHeight:0,
mainColor:'',
secondary:'',
sharestatus:{},
userinfo:{},
}
},
created(){
this.contentHeight = this.$utils.calcContentHeight(-40)+'px';
this.mainColor = this.$uiConfig.mainColor;
this.secondary = this.$uiConfig.secondary;
this.init()
this.getuserinfo()
},
mounted() {
let currentPages = getCurrentPages();
let u = "/" + currentPages[currentPages.length-1].route;
let pages = wx.getStorageSync("basedata")
? wx.getStorageSync("basedata").bar_title
: [];
pages.forEach((x) => {
if (x.value == u) {
this.pageTitle = x.new_name ? x.new_name : x.name;
}
});
uni.setNavigationBarTitle({
title: this.pageTitle,
});
},
onLoad(){
this.u = uni.getStorageSync("userinfo");
if (!this.u) {
this.u = {
nickName: "未登录",
avatarUrl: ""
};
this.showAuth = true;
}
},
methods: {
reloadUserinfo() {
this.u = uni.getStorageSync("userinfo");
this.showAuth=false
},
init(){
uni.showNavigationBarLoading();
let h = this.apiheader();
this.request(
{
url: "",
header:h,
data: {
r: "api/share/new-apply-status",
},
},
(res) => {
uni.hideNavigationBarLoading()
this.sharestatus = res.data
}
);
},
getuserinfo(){
uni.showNavigationBarLoading();
let h = this.apiheader();
this.request(
{
url: "",
header:h,
data: {
r: "api/user/user-info",
},
},
(res) => {
uni.hideNavigationBarLoading()
this.userinfo = res.data
}
);
},
goaddurl(){
uni.navigateTo({
url: "/pages/share/add/add?u=" + encodeURIComponent(JSON.stringify(this.userinfo)),
});
}
}
}
</script>
<style>
.shareindexStyle{
background: #f3f4f6;
}
.shareindexStyle .shareadd{
width: 100%;
display: flex;
flex-direction: column;align-items: center;
padding-top: 50px;
}
.shareindexStyle .shareadd .shareadd_b{
width: 60%;height: 45px;border-radius: 22.5px;display: flex;align-items: center;justify-content: center;color: #fff;margin-top: 20px;
}
.shareindexStyle .sharebox_top{
width: 100%;
padding: 10px;
display: flex;
flex-direction: column;
align-items: center;
}
.shareindexStyle .sharebox_top .sharebox_top_t{
width: 100%;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
padding: 5px 0;
}
.shareindexStyle .sharebox_top .sharebox_top_t .top_t_l{
display: flex;
flex-direction: row;
align-items: center;
}
.shareindexStyle .sharebox_c{
width: 94%;
margin-left: 3%;
height: 90px;
border-radius: 10rpx;
background: #fff;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-around;
padding: 10px 20px;
margin-top: 10px;
}
.shareindexStyle .center_item{
display: flex;
flex-direction: column;
align-items: center;
justify-content: space-between;
}
.shareindexStyle .sharebox_menus{
width: 94%;
margin-left: 3%;
border-radius: 10rpx;
background: #fff;
display: flex;
flex-direction: row;
align-items: center;
flex-wrap: wrap;
padding: 10px 20px;
margin-top: 10px;
}
.sharebox_menus .menus_item{
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment