24
pages.json
|
|
@ -65,6 +65,30 @@
|
|||
"style": {
|
||||
"navigationBarTitleText": "系统设置"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/info/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "消息通知"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/callphone/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "联系客服"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/extension/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "我的推广"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/request/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "常见问题"
|
||||
}
|
||||
}
|
||||
],
|
||||
"globalStyle": {
|
||||
|
|
|
|||
|
|
@ -0,0 +1,180 @@
|
|||
<template>
|
||||
<view class="call-box">
|
||||
<view class="call-phone" v-for="(item, index) in list" :key="index">
|
||||
<view class="head">
|
||||
<view class="imgname">
|
||||
<image src="../../static/img/fz_icon_gb/fz_icon_gb@2x.png" class="portrait"></image>
|
||||
<view>{{item.title}}</view>
|
||||
</view>
|
||||
<view class="call">
|
||||
<view class="call-btn" @click="calllPhone">
|
||||
<image src="../../static/img/kf_icon_dh/kf_icon_dh.png" mode="aspectFit" class="dh-class"></image>
|
||||
拨打电话
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="footer">
|
||||
<view class="item" v-for="(item1, index1) in item.contact" :key="index1">
|
||||
<view class="wx-qq">
|
||||
<image :src="item1.image" class="wx-qq-image"></image>
|
||||
<view>{{item1.qq}}</view>
|
||||
</view>
|
||||
<view class="copy" @click="copy">复制</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data () {
|
||||
return {
|
||||
list: [
|
||||
{
|
||||
title: '客户主管',
|
||||
contact: [
|
||||
{
|
||||
qq: 'QQ:123',
|
||||
image: '../../static/img/kf_icon_qq/kf_icon_qq.png'
|
||||
},
|
||||
{
|
||||
qq: '微信:4231',
|
||||
image: '../../static/img/kf_icon_wx/kf_icon_wx.png'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
title: '客户主管',
|
||||
contact: [
|
||||
{
|
||||
qq: 'QQ:123',
|
||||
image: '../../static/img/kf_icon_qq/kf_icon_qq.png'
|
||||
},
|
||||
{
|
||||
qq: '微信:4231',
|
||||
image: '../../static/img/kf_icon_wx/kf_icon_wx.png'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
title: '客户主管',
|
||||
contact: [
|
||||
{
|
||||
qq: 'QQ:123',
|
||||
image: '../../static/img/kf_icon_qq/kf_icon_qq.png'
|
||||
},
|
||||
{
|
||||
qq: '微信:4231',
|
||||
image: '../../static/img/kf_icon_wx/kf_icon_wx.png'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
title: '客户主管',
|
||||
contact: [
|
||||
{
|
||||
qq: 'QQ:123',
|
||||
image: '../../static/img/kf_icon_qq/kf_icon_qq.png'
|
||||
},
|
||||
{
|
||||
qq: '微信:4231',
|
||||
image: '../../static/img/kf_icon_wx/kf_icon_wx.png'
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 调用打电话
|
||||
calllPhone () {
|
||||
uni.makePhoneCall({
|
||||
phoneNumber: '18398608857' //仅为示例
|
||||
});
|
||||
},
|
||||
// 复制
|
||||
copy () {
|
||||
uni.setClipboardData({
|
||||
data: 'hello',
|
||||
success: function () {
|
||||
console.log('success');
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.call-box {
|
||||
margin: 30rpx 20rpx;
|
||||
}
|
||||
.call-phone {
|
||||
margin-top: 30rpx;
|
||||
color: #FFFFFF;
|
||||
font-size: 28rpx;
|
||||
padding-bottom: 0;
|
||||
padding: 30rpx;
|
||||
font-weight: 400;
|
||||
background: #2B3062;
|
||||
border-radius: 14rpx;
|
||||
& .head {
|
||||
padding-bottom: 20rpx;
|
||||
border-bottom: 1rpx solid #576699;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
& .imgname {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
& .portrait {
|
||||
margin-right: 20rpx;
|
||||
width: 80rpx;
|
||||
height: 80rpx;
|
||||
}
|
||||
}
|
||||
& .call-btn {
|
||||
width: 151rpx;
|
||||
height: 50rpx;
|
||||
background: linear-gradient(143deg, #EF6F5F 0%, #FB2636 100%);
|
||||
border-radius: 26rpx;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding: 0 12rpx;
|
||||
& .dh-class {
|
||||
width: 20rpx;
|
||||
height: 20rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
& .footer {
|
||||
margin-top: 20rpx;
|
||||
& .item {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
& .copy {
|
||||
font-size: 24rpx;
|
||||
color: #FE192F;
|
||||
line-height: 33rpx;
|
||||
}
|
||||
& .wx-qq {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 24rpx;
|
||||
color: #FFFFFF;
|
||||
line-height: 33px;
|
||||
& .wx-qq-image {
|
||||
margin-right: 24rpx;
|
||||
width: 28rpx;
|
||||
height: 30rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,125 @@
|
|||
<template>
|
||||
<view class="ex-box">
|
||||
<view class="census">
|
||||
<view class="acount">{{list.length}}人</view>
|
||||
<view>当前粉丝</view>
|
||||
</view>
|
||||
<view class="name-list" v-for="(item, index) in list" :key="index">
|
||||
<u-image :src="item.photo" width="80"
|
||||
shape="circle"
|
||||
height="80" class="photo-box"></u-image>
|
||||
<view>{{item.name}}</view>
|
||||
</view>
|
||||
<u-loadmore :status="status" :icon-type="iconType" :load-text="loadText" @loadmore="loadmore"/>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data () {
|
||||
return {
|
||||
status: 'loadmore',
|
||||
iconType: 'flower',
|
||||
loadText: {
|
||||
loadmore: '上拉加载更多',
|
||||
loading: '努力加载中',
|
||||
nomore: '没有更多了'
|
||||
},
|
||||
list: [
|
||||
{
|
||||
photo: '../../static/img/fz_icon_gb/fz_icon_gb.png',
|
||||
name: '1234'
|
||||
},
|
||||
{
|
||||
photo: '../../static/img/fz_icon_gb/fz_icon_gb.png',
|
||||
name: '1234'
|
||||
},
|
||||
{
|
||||
photo: '../../static/img/fz_icon_gb/fz_icon_gb.png',
|
||||
name: '1234'
|
||||
},
|
||||
{
|
||||
photo: '../../static/img/fz_icon_gb/fz_icon_gb.png',
|
||||
name: '1234'
|
||||
},
|
||||
{
|
||||
photo: '../../static/img/fz_icon_gb/fz_icon_gb.png',
|
||||
name: '1234'
|
||||
},
|
||||
{
|
||||
photo: '../../static/img/fz_icon_gb/fz_icon_gb.png',
|
||||
name: '1234'
|
||||
},
|
||||
{
|
||||
photo: '../../static/img/fz_icon_gb/fz_icon_gb.png',
|
||||
name: '1234'
|
||||
},
|
||||
{
|
||||
photo: '../../static/img/fz_icon_gb/fz_icon_gb.png',
|
||||
name: '1234'
|
||||
},
|
||||
{
|
||||
photo: '../../static/img/fz_icon_gb/fz_icon_gb.png',
|
||||
name: '1234'
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 加载更多
|
||||
loadmore () {
|
||||
console.log('触发加载更多')
|
||||
}
|
||||
},
|
||||
onReachBottom () {
|
||||
console.log('onReachBottom')
|
||||
if(this.page >= 3) return ;
|
||||
this.status = 'loading';
|
||||
this.page = ++ this.page;
|
||||
setTimeout(() => {
|
||||
this.list += 10;
|
||||
if(this.page >= 3) this.status = 'nomore';
|
||||
else this.status = 'loading';
|
||||
}, 2000)
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.ex-box {
|
||||
font-weight: 400;
|
||||
margin: 0 20rpx;
|
||||
& .census {
|
||||
margin-top: 40rpx;
|
||||
margin-bottom: 54rpx;
|
||||
height: 180rpx;
|
||||
background: #2B3062;
|
||||
border-radius: 14rpx;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
font-size: 30rpx;
|
||||
color: #FFFFFF;
|
||||
letter-spacing: 0.86rpx;
|
||||
& .acount {
|
||||
letter-spacing: 1.31rpx;
|
||||
font-size: 46rpx;
|
||||
}
|
||||
}
|
||||
& .name-list {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin: 20rpx 50rpx;
|
||||
|
||||
font-size: 28rpx;
|
||||
color: #FE192F;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
& .photo-box {
|
||||
margin-right: 32rpx;
|
||||
// width: 80rpx;
|
||||
// height: 80rpx;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,124 @@
|
|||
<template>
|
||||
<view class="info-box">
|
||||
<view v-if="list.length === 0" class="nothing-info">
|
||||
<image src="../../static/img/fz_icon_wc/fz_icon_wc.png" class="image"></image>
|
||||
<view class="zw">暂无消息</view>
|
||||
<view class="noinfo">还没有消失通知</view>
|
||||
</view>
|
||||
<view v-else class="card-list">
|
||||
<view v-for="(item, index) in list" :key="index">
|
||||
<view class="time-class">{{item.time}}</view>
|
||||
<view v-for="(item1, index1) in item.item" :key="index1">
|
||||
<u-card :title="item1.title" :thumb="item1.thumb" :border="false">
|
||||
<view class="" slot="body">
|
||||
{{item1.content}}
|
||||
</view>
|
||||
</u-card>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data () {
|
||||
return {
|
||||
list: [
|
||||
// {
|
||||
// time: '2021-01-12 14:23:12',
|
||||
// item: [
|
||||
// {
|
||||
// title: '短视频服务抖达人正式上线',
|
||||
// thumb: '../../static/img/xx_icon_tz/xx_icon_tz.png',
|
||||
// content: '抖达人是一款短视频服务型的APP,致力于扶持视频创作者、助力商家打造爆款视频和品牌宣传,真正做到帮助大家达到流量变现。邀请好友一起使用抖达人,塑造专属自己的资源圈,让短视频创业更简单!'
|
||||
// },
|
||||
// {
|
||||
// title: '短视频服务抖达人正式上线',
|
||||
// thumb: '../../static/img/xx_icon_tz/xx_icon_tz.png',
|
||||
// content: '抖达人是一款短视频服务型的APP,致力于扶持视频创作者、助力商家打造爆款视频和品牌宣传,真正做到帮助大家达到流量变现。邀请好友一起使用抖达人,塑造专属自己的资源圈,让短视频创业更简单!'
|
||||
// }
|
||||
// ]
|
||||
// },
|
||||
// {
|
||||
// time: '2021-01-12 14:23:12',
|
||||
// item: [
|
||||
// {
|
||||
// title: '短视频服务抖达人正式上线',
|
||||
// thumb: '../../static/img/xx_icon_tz/xx_icon_tz.png',
|
||||
// content: '抖达人是一款短视频服务型的APP,致力于扶持视频创作者、助力商家打造爆款视频和品牌宣传,真正做到帮助大家达到流量变现。邀请好友一起使用抖达人,塑造专属自己的资源圈,让短视频创业更简单!'
|
||||
// },
|
||||
// {
|
||||
// title: '短视频服务抖达人正式上线',
|
||||
// thumb: '../../static/img/xx_icon_tz/xx_icon_tz.png',
|
||||
// content: '抖达人是一款短视频服务型的APP,致力于扶持视频创作者、助力商家打造爆款视频和品牌宣传,真正做到帮助大家达到流量变现。邀请好友一起使用抖达人,塑造专属自己的资源圈,让短视频创业更简单!'
|
||||
// }
|
||||
// ]
|
||||
// }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.info-box {
|
||||
height: 100%;
|
||||
}
|
||||
.nothing-info {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
& .image {
|
||||
// width: 170rpx;
|
||||
// height: 200rpx;
|
||||
}
|
||||
& .zw {
|
||||
margin-top: 100rpx;
|
||||
font-size: 40rpx;
|
||||
font-weight: 400;
|
||||
color: #CED6F1;
|
||||
line-height: 56rpx;
|
||||
letter-spacing: 1rpx;
|
||||
}
|
||||
& .noinfo {
|
||||
margin-top: 20rpx;
|
||||
font-size: 28rpx;
|
||||
font-weight: 400;
|
||||
color: #9496B1;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
}
|
||||
.card-list {
|
||||
.time-class {
|
||||
color: #FFFFFF;
|
||||
font-size: 28rpx;
|
||||
text-align: center;
|
||||
margin-top: 30rpx;
|
||||
}
|
||||
& /deep/ .u-card {
|
||||
font-size: 28rpx;
|
||||
font-weight: 400;
|
||||
padding: 30rpx;
|
||||
background-color: #2B3062;
|
||||
}
|
||||
& /deep/ .u-card__head {
|
||||
margin-bottom: 25rpx;
|
||||
border-bottom: 1rpx solid #576699;
|
||||
padding: 0 0 20rpx 0 !important;
|
||||
& /deep/ .u-card__head--left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
& /deep/ .u-card__head--left__title {
|
||||
color: #FFFFFF !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
& /deep/ .u-card__body {
|
||||
padding: 0 !important;
|
||||
color: #9093B7;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,108 @@
|
|||
<template>
|
||||
<view class="request-box">
|
||||
<view class="tags">
|
||||
<view class="tag" @click="click(index)" :class="{'active': checkList(index)}" v-for="(item, index) in list" :key="index">{{item}}</view>
|
||||
</view>
|
||||
<view class="all-req">
|
||||
<view v-for="(item, index) in allList" :key="index">
|
||||
<view class="item" :class="{'active': checkAllList(index)}" @click="allClick(index)">
|
||||
<view class="title">{{item}}</view>
|
||||
<image src="../../static/img/cj_icon_xjt/cj_icon_xjt.png" class="img"></image>
|
||||
</view>
|
||||
<view v-if="checkAllList(index)">A 抖达人是一款新媒体服务平台,致力于KOL红人孵化,用户可以通过抖达人来提升作品曝光指数、用户关注,帮助更多红人和创作者解决“创作难”难题,让短视频创作没有门槛,让创业更简单。</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data () {
|
||||
return {
|
||||
show: true,
|
||||
list: [
|
||||
'关于我们', '关于提现和会员', '关于分站', '关于订单', '关于签到'
|
||||
],
|
||||
clickList: [],
|
||||
|
||||
allList: [
|
||||
'Q 关于我们', 'Q 怎么赚钱'
|
||||
],
|
||||
allClickList: []
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
tagClick () {
|
||||
},
|
||||
checkList (index) {
|
||||
return this.clickList.indexOf(index) >= 0
|
||||
},
|
||||
click (index) {
|
||||
let le = this.clickList.indexOf(index)
|
||||
if (le >= 0) {
|
||||
this.clickList.splice(le, 1)
|
||||
} else {
|
||||
this.clickList.push(index)
|
||||
}
|
||||
},
|
||||
checkAllList (index) {
|
||||
return this.allClickList.indexOf(index) >= 0
|
||||
},
|
||||
allClick (index) {
|
||||
console.log(index)
|
||||
let le = this.allClickList.indexOf(index)
|
||||
if (le >= 0) {
|
||||
this.allClickList.splice(le, 1)
|
||||
} else {
|
||||
this.allClickList.push(index)
|
||||
}
|
||||
console.log(this.allClickList)
|
||||
},
|
||||
// 加载数据
|
||||
loadData () {
|
||||
|
||||
}
|
||||
},
|
||||
onLoad () {
|
||||
this.loadData()
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.request-box {
|
||||
margin: 20rpx;
|
||||
}
|
||||
.tag {
|
||||
margin: 18rpx 20rpx;
|
||||
color: #FFFFFF;
|
||||
display: inline-block;
|
||||
background: #2B3062;
|
||||
border-radius: 100rpx;
|
||||
font-size: 28rpx;
|
||||
padding: 0 20rpx 10rpx 20rpx;
|
||||
&.active {
|
||||
background: linear-gradient(143deg, #EF6F5F 0%, #FB2636 100%);
|
||||
}
|
||||
}
|
||||
.all-req {
|
||||
margin-top: 45rpx;
|
||||
font-size: 32rpx;
|
||||
color: #FFFFFF;
|
||||
& .item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin: 30rpx 0;
|
||||
color: #9093B7;
|
||||
&.active {
|
||||
color: #FE192F;
|
||||
}
|
||||
}
|
||||
& .img {
|
||||
height: 12rpx;
|
||||
width: 24rpx;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
|
After Width: | Height: | Size: 843 B |
|
After Width: | Height: | Size: 1.7 KiB |
|
After Width: | Height: | Size: 427 B |
|
After Width: | Height: | Size: 833 B |
|
After Width: | Height: | Size: 989 B |
|
After Width: | Height: | Size: 2.1 KiB |
|
After Width: | Height: | Size: 1.1 KiB |
|
After Width: | Height: | Size: 2.4 KiB |
|
After Width: | Height: | Size: 1.7 KiB |
|
After Width: | Height: | Size: 4.3 KiB |