|
|
@@ -1,314 +0,0 @@
|
|
|
-<template>
|
|
|
- <div class="app-content">
|
|
|
- <app-tabs borderLeft :tabs="optionsType" :currentTab="roleIndex" @change="roleChange" itemWidth="50%" :padding="0" />
|
|
|
- <div class="rank-wrap">
|
|
|
- <div class="user-blo">
|
|
|
- <div class="user-wrap">
|
|
|
- <div class="user-wrap-left">
|
|
|
- <app-avatar-module :width="100" />
|
|
|
- <div class="user-det">
|
|
|
- <div class="user-name">{{ userInfo.merchantName }}</div>
|
|
|
- <div class="app-color-3">三级代理</div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <!-- #ifdef H5 -->
|
|
|
- <!-- <div class="user-wrap-right" @click="showShare = true">
|
|
|
- <img :src="`${constant.imgUrl}/retail/interest/invite-store.png`" alt mode="widthFix" />
|
|
|
- </div> -->
|
|
|
- <!-- #endif -->
|
|
|
- <!-- #ifdef MP-WEIXIN -->
|
|
|
- <button
|
|
|
- v-if="roleIndex == 1"
|
|
|
- class="user-wrap-right" open-type="share">
|
|
|
- <img :src="`${constant.imgUrl}/retail/interest/invite-store.png`" alt mode="widthFix" />
|
|
|
- </button>
|
|
|
- <button
|
|
|
- v-else
|
|
|
- class="user-wrap-right" open-type="share">
|
|
|
- <img :src="`${constant.imgUrl}/ghs/me/yqghs.png`" alt mode="widthFix" />
|
|
|
- </button>
|
|
|
- <!-- #endif -->
|
|
|
- </div>
|
|
|
- <!-- 数据 -->
|
|
|
- <div class="user-data">
|
|
|
- <div class="data-list" v-for="(item, index) in userData" :key="index">
|
|
|
- <div class="app-size-30 app-bold">{{ item.value }}</div>
|
|
|
- <div class="app-color-3">{{ item.name }}</div>
|
|
|
- <div class="app-color-1" v-if="item.btn" @click="withdrawFn">{{ item.btn }}</div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="prompt-text">花店列表</div>
|
|
|
- <app-tabs :tabs="tabs" :currentTab="tabIndex" @change="change" itemWidth="20%" :padding="0" />
|
|
|
- </div>
|
|
|
- <!-- list -->
|
|
|
- <div class="rank-list">
|
|
|
- <block v-if="!$util.isEmpty(list.data)">
|
|
|
- <div class="list" v-for="(item, index) in list.data" :key="index">
|
|
|
- <app-avatar-module :src="item.userAvatar" :width="80" />
|
|
|
- <div class="list-det">
|
|
|
- <div class="list-det-right">
|
|
|
- <div class="list-name">{{ item.name }}</div>
|
|
|
- <div class="list-detail">
|
|
|
- <span>{{ item.mobile }}</span>
|
|
|
- <span class="app-price">¥{{ item.fee }}</span>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div>
|
|
|
- <i v-if="item.status == 3" class="iconfont icondagou"></i>
|
|
|
- <span v-else class="app-price">{{ item.status | constantfilter('PROXY_STATUS') }}</span>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </block>
|
|
|
- <block v-else>
|
|
|
- <app-wrapper-empty title="暂无数据" :is-empty="$util.isEmpty(list.data)" />
|
|
|
- </block>
|
|
|
- </div>
|
|
|
- <app-share-mask :show="showShare" @click="showShare = false" />
|
|
|
- </div>
|
|
|
-</template>
|
|
|
-
|
|
|
-<script>
|
|
|
-import { mapGetters } from "vuex";
|
|
|
-import AppTabs from "@/components/plugin/tabs";
|
|
|
-import AppAvatarModule from "@/components/module/app-avatar";
|
|
|
-import AppWrapperEmpty from "@/components/app-wrapper-empty";
|
|
|
-import AppShareMask from "@/components/module/app-share-mask";
|
|
|
-import { list, share } from "@/mixins";
|
|
|
-// api
|
|
|
-import { getUser } from "@/utils/auth";
|
|
|
-// assetDet
|
|
|
-import { applyList } from "@/api/store/index";
|
|
|
-export default {
|
|
|
- name: "my-invite-list",
|
|
|
- components: {
|
|
|
- AppTabs,
|
|
|
- AppAvatarModule,
|
|
|
- AppWrapperEmpty,
|
|
|
- AppShareMask
|
|
|
- },
|
|
|
- mixins: [list, share],
|
|
|
- data() {
|
|
|
- return {
|
|
|
- constant: this.$constant,
|
|
|
- showShare: false,
|
|
|
- data: {},
|
|
|
- tabIndex: 0,
|
|
|
- roleIndex: 0,
|
|
|
- optionsType:[
|
|
|
- {
|
|
|
- name:'供货商'
|
|
|
- },
|
|
|
- {
|
|
|
- name:'零售店铺'
|
|
|
- }
|
|
|
- ],
|
|
|
- tabs: [
|
|
|
- {
|
|
|
- name: "全部"
|
|
|
- },
|
|
|
- {
|
|
|
- name: "待审核"
|
|
|
- },
|
|
|
- {
|
|
|
- name: "试用中"
|
|
|
- },
|
|
|
- {
|
|
|
- name: "已付费"
|
|
|
- },
|
|
|
- {
|
|
|
- name: "已到期"
|
|
|
- }
|
|
|
- ],
|
|
|
- // 用户数据
|
|
|
- userData: [
|
|
|
- {
|
|
|
- name: "账号余额(¥)",
|
|
|
- value: 0
|
|
|
- // btn: '提现'
|
|
|
- },
|
|
|
- {
|
|
|
- name: "邀请花店",
|
|
|
- value: 0
|
|
|
- },
|
|
|
- {
|
|
|
- name: "付费花店",
|
|
|
- value: 0
|
|
|
- },
|
|
|
- {
|
|
|
- name: "累计收益(¥)",
|
|
|
- value: 0
|
|
|
- }
|
|
|
- ]
|
|
|
- };
|
|
|
- },
|
|
|
- computed: {
|
|
|
- ...mapGetters({ userInfo: "getUser" })
|
|
|
- },
|
|
|
- onLoad() {},
|
|
|
- methods: {
|
|
|
- roleChange(e){
|
|
|
- if (this.roleIndex == e.index) {
|
|
|
- return false;
|
|
|
- } else {
|
|
|
- this.roleIndex = e.index;
|
|
|
- this.init()
|
|
|
- }
|
|
|
- },
|
|
|
- init() {
|
|
|
- // this._assetDet();
|
|
|
- this._applyList();
|
|
|
- getUser().then(res => {
|
|
|
- let params = {
|
|
|
- title: "更懂您的花卉宝",
|
|
|
- desc: "",
|
|
|
- imgUrl: this.constant.imgUrl + "/retail/official/banner-1.png",
|
|
|
- pagePath: "pagesClient/official/index?introMerchantId=" + res.id
|
|
|
- };
|
|
|
- this.jweixinFn(params);
|
|
|
- });
|
|
|
- },
|
|
|
- // _assetDet() {
|
|
|
- // assetDet().then(res => {
|
|
|
- // if (this.$util.isEmpty(res.data)) {
|
|
|
- // return false;
|
|
|
- // }
|
|
|
- // this.data = res.data;
|
|
|
- // this.userData[0].value = res.data.balance | 0.0;
|
|
|
- // this.userData[1].value = res.data.inviteNum | 0;
|
|
|
- // this.userData[2].value = res.data.payNum | 0;
|
|
|
- // this.userData[3].value = res.data.income | 0.0;
|
|
|
- // });
|
|
|
- // },
|
|
|
- _applyList() {
|
|
|
- let status = this.getStatus(this.tabIndex);
|
|
|
- return applyList({ status: status, style:this.roleIndex==0?2:1}).then(res => {
|
|
|
- this.userData[0].value = res.data.balance | 0.0;
|
|
|
- this.userData[1].value = res.data.inviteNum | 0;
|
|
|
- this.userData[2].value = res.data.payNum | 0;
|
|
|
- this.userData[3].value = res.data.income | 0.0;
|
|
|
- this.completes(res);
|
|
|
- });
|
|
|
- },
|
|
|
- // operate
|
|
|
- change(e) {
|
|
|
- if (this.tabIndex == e.index) {
|
|
|
- return false;
|
|
|
- } else {
|
|
|
- this.tabIndex = e.index;
|
|
|
- this.resetList();
|
|
|
- this._applyList();
|
|
|
- }
|
|
|
- },
|
|
|
- withdrawFn() {
|
|
|
- this.$msg("功能开发中...");
|
|
|
- },
|
|
|
- getStatus(e) {
|
|
|
- let val = "";
|
|
|
- switch (e) {
|
|
|
- case 0:
|
|
|
- val = -1;
|
|
|
- break;
|
|
|
- case 1:
|
|
|
- val = 0;
|
|
|
- break;
|
|
|
- case 2:
|
|
|
- val = 1;
|
|
|
- break;
|
|
|
- case 3:
|
|
|
- val = 3;
|
|
|
- break;
|
|
|
- case 4:
|
|
|
- val = 4;
|
|
|
- break;
|
|
|
- default:
|
|
|
- val = -1;
|
|
|
- break;
|
|
|
- }
|
|
|
- return val;
|
|
|
- }
|
|
|
- }
|
|
|
-};
|
|
|
-</script>
|
|
|
-
|
|
|
-<style lang="scss" scoped>
|
|
|
-// 头部
|
|
|
-.rank-wrap {
|
|
|
- background-color: #fff;
|
|
|
- margin-top: 20upx;
|
|
|
- .user-blo {
|
|
|
- padding: 40px 30px 28px 30px;
|
|
|
- }
|
|
|
- .user-wrap {
|
|
|
- @include disFlex(center, space-between);
|
|
|
- margin-bottom: 60px;
|
|
|
- .user-wrap-left {
|
|
|
- @include disFlex(center, flex-start);
|
|
|
- .user-det {
|
|
|
- margin-left: 20px;
|
|
|
- }
|
|
|
- .user-name {
|
|
|
- font-size: 32px;
|
|
|
- margin-bottom: 10px;
|
|
|
- }
|
|
|
- }
|
|
|
- .user-wrap-right {
|
|
|
- width: 230px;
|
|
|
- background-color: #fff;
|
|
|
- margin-right: 0;
|
|
|
- padding: 0;
|
|
|
- &::after {
|
|
|
- border: none;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- .user-data {
|
|
|
- @include disFlex(flex-start, space-between);
|
|
|
- .data-list {
|
|
|
- text-align: center;
|
|
|
- & > div {
|
|
|
- margin-top: 10px;
|
|
|
- &:first-child {
|
|
|
- margin-top: 0;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- .prompt-text {
|
|
|
- color: $fontColor3;
|
|
|
- padding: 26px 0 16px 30px;
|
|
|
- background-color: $backColor;
|
|
|
- }
|
|
|
-}
|
|
|
-// list
|
|
|
-.rank-list {
|
|
|
- background-color: #fff;
|
|
|
- .list {
|
|
|
- @include disFlex(center, flex-start);
|
|
|
- margin: 0 30px;
|
|
|
- padding: 24px 0;
|
|
|
- .list-det {
|
|
|
- @include disFlex(center, space-between);
|
|
|
- width: calc(100% - 100px);
|
|
|
- margin-left: 20px;
|
|
|
- .list-det-right {
|
|
|
- color: $fontColor3;
|
|
|
- .list-name {
|
|
|
- color: #333;
|
|
|
- font-size: 30px;
|
|
|
- margin-bottom: 6px;
|
|
|
- }
|
|
|
- .list-detail {
|
|
|
- & > span {
|
|
|
- margin-right: 20px;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- .icondagou {
|
|
|
- color: $mainColor;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
-</style>
|