修改我的推广店铺页面和制作我的店铺列表页面
This commit is contained in:
parent
16f3e8b229
commit
d894e439d6
@ -369,3 +369,7 @@ export function makeMyWxImage() {
|
||||
export function localBalance(data) {
|
||||
return request.post('pay/localBalance', data)
|
||||
}
|
||||
|
||||
export function newShops(params) {
|
||||
return request.get('user/newShops', {params})
|
||||
}
|
||||
302
bundle/pages/user_spread_store/order.vue
Normal file
302
bundle/pages/user_spread_store/order.vue
Normal file
@ -0,0 +1,302 @@
|
||||
<template>
|
||||
<mescroll-body ref="mescrollRef" @init="mescrollInit" @up="upCallback" :up="upOption" :down="downOption"
|
||||
@down="downCallback">
|
||||
<view class="user-fans">
|
||||
<view class="header">
|
||||
<view class="flex row-center bg-white filter-date">
|
||||
<view>
|
||||
<input type="text" v-model="startDate" placeholder="起止时间" @click="showStartTime = true" :disabled="true">
|
||||
</view>
|
||||
<view class="line"></view>
|
||||
<view>
|
||||
<input type="text" v-model="endDate" placeholder="截止时间" @click="showEndTime = true" :disabled="true">
|
||||
</view>
|
||||
</view>
|
||||
<view class="top-bar flex bg-white md">
|
||||
<view class="bar-item flex row-center" :class="{'item-active': active == 'all'}" @tap="changeTab('all')">全部粉丝
|
||||
</view>
|
||||
<view class="bar-item flex row-center" :class="{'item-active': active == 'first'}" @tap="changeTab('first')">
|
||||
一级粉丝</view>
|
||||
<view class="bar-item flex row-center" :class="{'item-active': active == 'second'}" @tap="changeTab('second')">
|
||||
二级粉丝</view>
|
||||
</view>
|
||||
<view class="sort-bar flex bg-white">
|
||||
<view class="sort-bar-item flex row-center" @tap="sortChange(0)">
|
||||
<view :class="sortType == 0 ? 'item-active' : ''">团队排序</view>
|
||||
<view class="arrow-icon flex-col col-center row-center">
|
||||
<u-icon name="arrow-up-fill"
|
||||
:color="fansSort == 'asc' ? colorConfig.primary : colorConfig.normal"></u-icon>
|
||||
<u-icon name="arrow-down-fill"
|
||||
:color="fansSort == 'desc' ? colorConfig.primary : colorConfig.normal"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
<view class="sort-bar-item flex row-center" @tap="sortChange(1)">
|
||||
<view :class="sortType == 1 ? 'item-active' : ''">金额排序</view>
|
||||
<view class="arrow-icon flex-col col-center row-center">
|
||||
<u-icon name="arrow-up-fill"
|
||||
:color="moneySort == 'asc' ? colorConfig.primary : colorConfig.normal"></u-icon>
|
||||
<u-icon name="arrow-down-fill"
|
||||
:color="moneySort == 'desc' ? colorConfig.primary : colorConfig.normal"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
<view class="sort-bar-item flex row-center" @tap="sortChange(2)">
|
||||
<view :class="sortType == 2 ? 'item-active' : ''">订单排序</view>
|
||||
<view class="arrow-icon flex-col col-center row-center">
|
||||
<u-icon name="arrow-up-fill"
|
||||
:color="orderSort == 'asc' ? colorConfig.primary : colorConfig.normal"></u-icon>
|
||||
<u-icon name="arrow-down-fill"
|
||||
:color="orderSort == 'desc' ? colorConfig.primary : colorConfig.normal"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="content">
|
||||
<view class="card-box p-t-20">
|
||||
<view v-for="(item, index) in fansList" :key="index" class="card-item flex row-between bg-white p-20">
|
||||
<view class="flex">
|
||||
<u-image :src="item.avatar" border-radius="50%" width="100rpx" height="100rpx" />
|
||||
<view class="fans-info m-l-20">
|
||||
<view class="fans-name bold line-1">{{item.nickname}}</view>
|
||||
<view class="flex lighter m-t-20">
|
||||
<view v-if="item.mobile" class="m-r-20">{{item.mobile}}</view>
|
||||
<view>{{item.create_time}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="flex-col xs flex-none m-l-20">
|
||||
<view class="msg"><span class="primary">{{item.fans_team}} </span>人</view>
|
||||
<view class="m-t-5 msg"><span>{{item.fans_order}} </span>单</view>
|
||||
<view class="m-t-5 msg"><span>{{item.fans_money}} </span>元</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<u-picker mode="time" v-model="showStartTime" @confirm="startTimeChange"></u-picker>
|
||||
<u-picker mode="time" v-model="showEndTime" @confirm="endTimeChange"></u-picker>
|
||||
</mescroll-body>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
sortType,
|
||||
} from '@/utils/type';
|
||||
import {
|
||||
getUserFans
|
||||
} from '@/api/user';
|
||||
import MescrollMixin from "@/components/mescroll-uni/mescroll-mixins.js";
|
||||
export default {
|
||||
mixins: [MescrollMixin], // 使用mixin
|
||||
data() {
|
||||
return {
|
||||
upOption: {
|
||||
empty: {
|
||||
icon: 'https://zjeloong.oss-cn-hangzhou.aliyuncs.com/uniapp/order_null.png',
|
||||
tip: '暂无相关数据', // 提示
|
||||
}
|
||||
},
|
||||
active: 'all',
|
||||
sortType: -1,
|
||||
keyword: "",
|
||||
fansSort: sortType.NONE,
|
||||
moneySort: sortType.NONE,
|
||||
orderSort: sortType.NONE,
|
||||
fansList: [],
|
||||
startDate: '',
|
||||
endDate: '',
|
||||
showStartTime: false,
|
||||
showEndTime: false
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
onRefresh() {
|
||||
this.fansList = []
|
||||
this.mescroll.resetUpScroll();
|
||||
},
|
||||
|
||||
// 上拉加载
|
||||
upCallback(page) {
|
||||
const {
|
||||
fansSort,
|
||||
moneySort,
|
||||
orderSort,
|
||||
active,
|
||||
keyword,
|
||||
} = this;
|
||||
const params = {
|
||||
type: active,
|
||||
keyword,
|
||||
fans: fansSort,
|
||||
money: moneySort,
|
||||
order: orderSort,
|
||||
page_size: page.size,
|
||||
page_no: page.num,
|
||||
};
|
||||
getUserFans(params).then(({
|
||||
data
|
||||
}) => {
|
||||
if (page.num == 1) this.fansList = [];
|
||||
const curPageData = data.list;
|
||||
const curPageLen = curPageData.length;
|
||||
const hasNext = !!data.more;
|
||||
this.fansList = this.fansList.concat(curPageData);
|
||||
this.mescroll.endSuccess(curPageLen, hasNext);
|
||||
}).catch(() => {
|
||||
this.mescroll.endErr()
|
||||
})
|
||||
|
||||
},
|
||||
|
||||
changeTab(val) {
|
||||
this.active = val
|
||||
this.onRefresh()
|
||||
},
|
||||
|
||||
// 排序状态变化
|
||||
sortChange(type) {
|
||||
let {
|
||||
fansSort,
|
||||
moneySort,
|
||||
orderSort
|
||||
} = this;
|
||||
|
||||
this.sortType = parseInt(type)
|
||||
|
||||
switch (this.sortType) {
|
||||
case 0:
|
||||
// 团队排序
|
||||
if (fansSort == sortType.DESC || fansSort == sortType.NONE) {
|
||||
this.fansSort = sortType.ASC;
|
||||
this.moneySort = sortType.NONE
|
||||
this.orderSort = sortType.NONE
|
||||
} else if (fansSort == sortType.ASC) {
|
||||
this.fansSort = sortType.DESC;
|
||||
this.moneySort = sortType.NONE;
|
||||
this.orderSort = sortType.NONE;
|
||||
}
|
||||
break;
|
||||
|
||||
case 1:
|
||||
// 金额排序
|
||||
if (moneySort == sortType.DESC || moneySort == sortType.NONE) {
|
||||
this.moneySort = sortType.ASC;
|
||||
this.fansSort = sortType.NONE;
|
||||
this.orderSort = sortType.NONE
|
||||
} else if (moneySort == sortType.ASC) {
|
||||
this.moneySort = sortType.DESC;
|
||||
this.fansSort = sortType.NONE;
|
||||
this.orderSort = sortType.NONE;
|
||||
}
|
||||
|
||||
break;
|
||||
case 2:
|
||||
// 订单排序
|
||||
if (orderSort == sortType.DESC || orderSort == sortType.NONE) {
|
||||
this.orderSort = sortType.ASC;
|
||||
this.moneySort = sortType.NONE;
|
||||
this.fansSort = sortType.NONE;
|
||||
} else if (orderSort == sortType.ASC) {
|
||||
this.orderSort = sortType.DESC;
|
||||
this.moneySort = sortType.NONE;
|
||||
this.fansSort = sortType.NONE;
|
||||
}
|
||||
|
||||
break;
|
||||
}
|
||||
|
||||
this.onRefresh()
|
||||
},
|
||||
|
||||
startTimeChange(info) {
|
||||
this.startDate = info["year"]+"-"+info["month"]+"-"+info["day"]
|
||||
},
|
||||
|
||||
endTimeChange(info) {
|
||||
if (!this.startDate) {
|
||||
return this.$toast({
|
||||
title: '请选择开始时间'
|
||||
});
|
||||
}
|
||||
this.endDate = info["year"]+"-"+info["month"]+"-"+info["day"]
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.user-fans {
|
||||
.header {
|
||||
.top-bar {
|
||||
padding: 18rpx 50rpx;
|
||||
height: 100rpx;
|
||||
|
||||
.bar-item {
|
||||
flex: 1;
|
||||
padding: 0 30rpx;
|
||||
height: 58rpx;
|
||||
|
||||
&:not(:last-of-type) {
|
||||
margin-right: 54rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.item-active {
|
||||
color: white;
|
||||
background-color: $-color-primary;
|
||||
border-radius: 100rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.sort-bar {
|
||||
height: 80rpx;
|
||||
|
||||
.sort-bar-item {
|
||||
flex: 1;
|
||||
|
||||
.arrow-icon {
|
||||
transform: scale(0.36);
|
||||
}
|
||||
|
||||
.item-active {
|
||||
color: $-color-primary;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.content {
|
||||
.card-box {
|
||||
.card-item {
|
||||
.fans-name {
|
||||
width: 500rpx;
|
||||
}
|
||||
&:not(:last-of-type) {
|
||||
border-bottom: $-solid-border;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.filter-date {
|
||||
padding: 20rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
|
||||
view {
|
||||
width: 100%;
|
||||
|
||||
input {
|
||||
text-align: center;
|
||||
border-radius: 10rpx;
|
||||
padding: 10rpx 0;
|
||||
}
|
||||
}
|
||||
|
||||
.line {
|
||||
width: 6%;
|
||||
margin: 0 10rpx;
|
||||
border-bottom: 1px solid #000000;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -27,10 +27,16 @@
|
||||
</view> -->
|
||||
<view class="sort-bar flex bg-white">
|
||||
<view class="sort-bar-item flex row-center" @click="onChangType(1)">
|
||||
<view :class="active == 1 ? 'item-active' : ''">企业入驻</view>
|
||||
<view class="item-num">
|
||||
<view :class="active == 1 ? 'item-active' : ''">企业入驻</view>
|
||||
<view class="num" v-if="localStoreNum > 0">{{companyNum}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="sort-bar-item flex row-center" @click="onChangType(2)">
|
||||
<view :class="active == 2 ? 'item-active' : ''">本地生活商家</view>
|
||||
<view class="item-num">
|
||||
<view :class="active == 2 ? 'item-active' : ''">本地生活商家</view>
|
||||
<view class="num" v-if="localStoreNum > 0">{{localStoreNum}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@ -40,18 +46,18 @@
|
||||
<view class="flex">
|
||||
<u-image :src="item.avatar" border-radius="50%" width="100rpx" height="100rpx" />
|
||||
<view class="fans-info m-l-20">
|
||||
<view class="fans-name bold line-1">{{item.nickname}}</view>
|
||||
<view class="flex lighter m-t-20">
|
||||
<view v-if="item.mobile" class="m-r-20">{{item.mobile}}</view>
|
||||
<view>{{item.create_time}}</view>
|
||||
</view>
|
||||
<view class="fans-name bold line-1">{{item.name}}</view>
|
||||
<!-- <view class="flex lighter m-t-20"> -->
|
||||
<!-- <view v-if="item.mobile" class="m-r-20">{{item.mobile}}</view> -->
|
||||
<!-- <view>{{item.create_time}}</view> -->
|
||||
<!-- </view> -->
|
||||
</view>
|
||||
</view>
|
||||
<view class="flex-col xs flex-none m-l-20">
|
||||
<!-- <view class="flex-col xs flex-none m-l-20">
|
||||
<view class="msg"><span class="primary">{{item.fans_team}} </span>人</view>
|
||||
<view class="m-t-5 msg"><span>{{item.fans_order}} </span>单</view>
|
||||
<view class="m-t-5 msg"><span>{{item.fans_money}} </span>元</view>
|
||||
</view>
|
||||
</view> -->
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@ -64,7 +70,8 @@
|
||||
sortType,
|
||||
} from '@/utils/type';
|
||||
import {
|
||||
getSpreadStore
|
||||
getSpreadStore,
|
||||
newShops
|
||||
} from '@/api/user';
|
||||
import MescrollMixin from "@/components/mescroll-uni/mescroll-mixins.js";
|
||||
export default {
|
||||
@ -82,7 +89,9 @@
|
||||
keyword: "",
|
||||
moneySort: sortType.NONE,
|
||||
orderSort: sortType.NONE,
|
||||
fansList: []
|
||||
fansList: [],
|
||||
companyNum: 0,
|
||||
localStoreNum: 0
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
@ -107,7 +116,7 @@
|
||||
page_size: page.size,
|
||||
page_no: page.num,
|
||||
};
|
||||
getSpreadStore(params).then(({
|
||||
newShops(params).then(({
|
||||
data
|
||||
}) => {
|
||||
if (page.num == 1) this.fansList = [];
|
||||
@ -119,6 +128,19 @@
|
||||
}).catch(() => {
|
||||
this.mescroll.endErr()
|
||||
})
|
||||
|
||||
// getSpreadStore(params).then(({
|
||||
// data
|
||||
// }) => {
|
||||
// if (page.num == 1) this.fansList = [];
|
||||
// const curPageData = data.list;
|
||||
// const curPageLen = curPageData.length;
|
||||
// const hasNext = !!data.more;
|
||||
// this.fansList = this.fansList.concat(curPageData);
|
||||
// this.mescroll.endSuccess(curPageLen, hasNext);
|
||||
// }).catch(() => {
|
||||
// this.mescroll.endErr()
|
||||
// })
|
||||
|
||||
},
|
||||
|
||||
@ -225,4 +247,26 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.item-num {
|
||||
position: relative;
|
||||
|
||||
&:first-child {
|
||||
padding-right: 50rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.num {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
font-size: 24rpx;
|
||||
border: 1rpx solid #FF2C3C;
|
||||
border-radius: 10rpx;
|
||||
height: 28rpx;
|
||||
line-height: 28rpx;
|
||||
padding: 0 4rpx;
|
||||
color: #FF2C3C;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -17,7 +17,7 @@ const IS_H5 = false
|
||||
/** S API BaseURL **/
|
||||
const baseURLMap = {
|
||||
// 开发环境
|
||||
development: 'https://dlh.hainings.com',
|
||||
development: 'https://dlh.stnav.com',
|
||||
// 生产环境
|
||||
production: IS_H5 ? location.origin : 'https://dlh.hainings.com',
|
||||
|
||||
|
||||
@ -596,6 +596,15 @@
|
||||
"navigationBarTitleText": "我的推广店铺"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/user_spread_store/order",
|
||||
"meta": {
|
||||
"auth": true
|
||||
},
|
||||
"style": {
|
||||
"navigationBarTitleText": "商家订单"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/monthly_bill/monthly_bill",
|
||||
"meta": {
|
||||
|
||||
Loading…
Reference in New Issue
Block a user