596 lines
18 KiB
Vue
596 lines
18 KiB
Vue
<template>
|
|
<view class="content">
|
|
<!-- 临时 style="padding-top: 22%;" -->
|
|
<view class="userTop" >
|
|
<!-- :class="{active : !userLogin}" -->
|
|
<img class="userTop-back" src="https://douhuo-storage.oss-cn-beijing.aliyuncs.com/images/2023/06/06/04e656417170e100efdd3443b0b8a6c8.png">
|
|
<view class="userTop-cont">
|
|
<view class="userTop-height" v-if="userLogin">
|
|
<view class="userTop-head">
|
|
<image :src="userData.avatar ? userData.avatar : 'https://douhuo-storage.oss-cn-beijing.aliyuncs.com/images/2023/06/06/5641d82e94651198a0a2236f368ff9ba.png'" mode="aspectFill"></image>
|
|
</view>
|
|
<view class="userTop-text">
|
|
<view class="userTop-name">
|
|
{{userData.nickname}} <image v-if="userData.certification" class="userTop-icon" src="@/static/imgs/user_attestation.png"></image>
|
|
</view>
|
|
<view class="userTop-identity-tips">
|
|
{{userData.identity.name}}<image class="userTop-arrow" src="@/static/imgs/use_arrow.png"></image>
|
|
</view>
|
|
</view>
|
|
<view class="user-vip" @click="$Router.push({name: 'vip'})">{{!userData.identity.can_open_vip && !userData.identity.can_renew_vip ? '会员权益': ''}}{{userData.identity.can_open_vip ? '开通会员': ''}}{{userData.identity.can_renew_vip ? '开通会员': ''}}</view>
|
|
</view>
|
|
<view class="userTop-height" v-else @click="$Router.push({name: 'Login'})">
|
|
<view class="userTop-head">
|
|
<image src="https://douhuo-storage.oss-cn-beijing.aliyuncs.com/images/2023/06/06/5641d82e94651198a0a2236f368ff9ba.png" mode="aspectFill"></image>
|
|
</view>
|
|
<view class="userTop-text">
|
|
<view class="userTop-login">
|
|
请先登录
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<!-- 临时 style="display: none;" -->
|
|
<view class="userTop-see" v-if="userLogin">
|
|
<!-- <view class="userTop-label" @click="$Router.push({name: 'sheetIndex'})">
|
|
<view class="userSee-name">
|
|
协商调解类
|
|
</view>
|
|
<view class="userSee-number" v-if="userData.business_orders_count">
|
|
{{ userData.business_orders_count.all ? userData.business_orders_count.all : '0'}}<text>单</text>
|
|
</view>
|
|
<view class="userSee-tips">
|
|
信用卡、贷款业务
|
|
</view>
|
|
<block v-if="userData.business_orders_count">
|
|
<view class="userSee-new" v-if="userData.business_orders_count.all">
|
|
新订单
|
|
</view>
|
|
</block>
|
|
<img class="userSee-icon" src="https://douhuo-storage.oss-cn-beijing.aliyuncs.com/images/2023/06/06/2823f7c9ed144df424ca8ee6c47b0ff6.png">
|
|
</view> -->
|
|
|
|
<view class="userTop-label" @click="$Router.push({name: 'AccountWork'})" style="display: none;">
|
|
<view class="userSee-name">
|
|
账户管理资讯类
|
|
</view>
|
|
<view class="userSee-number">
|
|
<!-- {{ userData.business_orders_count.all ? userData.business_orders_count.all : '0'}}<text>单</text> -->
|
|
</view>
|
|
<view class="userSee-tips">
|
|
客户账户管理资讯类订单
|
|
</view>
|
|
<img class="userSee-icon" src="https://douhuo-storage.oss-cn-beijing.aliyuncs.com/images/2023/06/06/2823f7c9ed144df424ca8ee6c47b0ff6.png">
|
|
</view>
|
|
<view class="userTop-label" @click="$Router.push({name: 'DelegationWork'})" style="display: none;">
|
|
<view class="userSee-name">
|
|
委托管理类
|
|
</view>
|
|
<view class="userSee-number">
|
|
<!-- {{ userData.business_orders_count.all ? userData.business_orders_count.all : '0'}}<text>单</text> -->
|
|
</view>
|
|
<view class="userSee-tips">
|
|
客户委托管理类订单
|
|
</view>
|
|
<img class="userSee-icon" src="https://douhuo-storage.oss-cn-beijing.aliyuncs.com/images/2023/06/06/2823f7c9ed144df424ca8ee6c47b0ff6.png">
|
|
</view>
|
|
|
|
<view class="userTop-label" @click="$Router.push({name: 'synthesisOrder', params: {type: 'legal'}})">
|
|
<view class="userSee-name">
|
|
法律咨询类
|
|
</view>
|
|
<view class="userSee-number" v-if="userData.business_orders_count">
|
|
{{synthesisAll.legal_consulting ? synthesisAll.legal_consulting : '0'}}<text>单</text>
|
|
</view>
|
|
<view class="userSee-tips">
|
|
<!-- 个人、 -->
|
|
企业法律
|
|
</view>
|
|
<img class="userSee-icon" src="https://douhuo-storage.oss-cn-beijing.aliyuncs.com/images/2023/06/06/84e573c04d3dcb7fa1cccefbde9bf851.png">
|
|
</view>
|
|
<view class="userTop-label" @click="$Router.push({name: 'synthesisOrder', params: {type: 'lawsuit'}})">
|
|
<view class="userSee-name">
|
|
诉讼委托类
|
|
</view>
|
|
<view class="userSee-number">
|
|
{{synthesisAll.lawsuit ? synthesisAll.lawsuit : '0'}}<text>单</text>
|
|
</view>
|
|
<view class="userSee-tips">
|
|
案件委托、拓展服务
|
|
</view>
|
|
<img class="userSee-icon" src="https://douhuo-storage.oss-cn-beijing.aliyuncs.com/images/2023/06/19/08e5c39f136d84e9754d4ac4d16af181.png">
|
|
</view>
|
|
<view class="userTop-label" @click="$Router.push({name: 'EmpowerOrder'})" style="display: none;">
|
|
<view class="userSee-name">
|
|
增收赋能类
|
|
</view>
|
|
<view class="userSee-number">
|
|
0<text>单</text>
|
|
</view>
|
|
<view class="userSee-tips">
|
|
增收赋能类
|
|
</view>
|
|
<img class="userSee-icon" src="https://douhuo-storage.oss-cn-beijing.aliyuncs.com/images/2023/06/19/a1d7c2b05053dabfeb9ac03e639d3311.png">
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<!-- 临时 style="display: none;" -->
|
|
<view class="board" v-if="userLogin" style="display: none;">
|
|
<view class="board-title">
|
|
数据看板
|
|
</view>
|
|
<view class="board-item" v-if="userData.business_orders_count">
|
|
<view class="board-lable" :class="{active : userData.business_orders_count.confirm_count}" @click="$Router.push({name: 'OrderModify'})">
|
|
<img class="board-icon" src="https://douhuo-storage.oss-cn-beijing.aliyuncs.com/images/2023/06/06/935384ea494f72085a705087f871e047.png">
|
|
<view class="board-name">待确认方案</view>
|
|
<view class="board-number">{{userData.business_orders_count.confirm_count}}</view>
|
|
</view>
|
|
<view class="board-lable" :class="{active : userData.business_orders_count.modify_count}" @click="$Router.push({name: 'OrderAffirm'})">
|
|
<img class="board-icon" src="https://douhuo-storage.oss-cn-beijing.aliyuncs.com/images/2023/06/06/548b870435f7396bdeb67fc08535420b.png">
|
|
<view class="board-name active">修改订单资料</view>
|
|
<view class="board-number active">{{userData.business_orders_count.modify_count}}</view>
|
|
</view>
|
|
<view class="board-lable" :class="{active : userData.business_orders_count.diff_count}" @click="$Router.push({name: 'OrderMake'})">
|
|
<img class="board-icon" src="https://douhuo-storage.oss-cn-beijing.aliyuncs.com/images/2023/06/06/e0b00a53e089c46678b32f94b02b3ec0.png">
|
|
<view class="board-name">补交服务费</view>
|
|
<view class="board-number">{{userData.business_orders_count.diff_count}}</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="block-flex" v-if="userData.salesman" @click="onCallPhone(userData.salesman.username)">
|
|
<view class="block-flex-title">业务联系人</view>
|
|
<view>{{userData.salesman.nickname || '-'}}</view>
|
|
</view>
|
|
<!-- v-if="userData.identity.id > 1" -->
|
|
<view class="block-flex" @click="$Router.push({name: 'Tema'})">
|
|
<view class="block-flex-title">我的推荐</view>
|
|
<u-icon name="arrow-right"></u-icon>
|
|
</view>
|
|
<view class="tool">
|
|
<view class="tool-title">
|
|
其他工具
|
|
</view>
|
|
<view class="tool-item">
|
|
<view class="tool-lable" @click="$Router.push({name: 'indexCollect'})">
|
|
<img class="tool-icon" src="@/static/imgs/userTool_01.png">
|
|
<view class="tool-name">我的收藏</view>
|
|
</view>
|
|
<view class="tool-lable" @click="$Router.push({name: 'Manage'})">
|
|
<img class="tool-icon" src="@/static/imgs/userTool_03.png">
|
|
<view class="tool-name">信息管理</view>
|
|
</view>
|
|
<view class="tool-lable" @click="$Router.push({name: 'Coupon'})">
|
|
<img class="tool-icon" src="@/static/imgs/userTool_02.png">
|
|
<view class="tool-name">优惠券</view>
|
|
</view>
|
|
<view class="tool-lable" @click="$Router.push({name: 'Setup'})">
|
|
<img class="tool-icon" src="@/static/imgs/userTool_04.png">
|
|
<view class="tool-name">其他功能</view>
|
|
</view>
|
|
<!-- <view class="tool-lable" @click="$Router.push({name: 'Modify'})">
|
|
<img class="tool-icon" src="@/static/imgs/userTool_03.png">
|
|
<view class="tool-name">修改密码</view>
|
|
</view>
|
|
<view class="tool-lable" @click="$Router.push({name: 'Modify'})">
|
|
<img class="tool-icon" src="@/static/imgs/userTool_05.png">
|
|
<view class="tool-name">基本信息</view>
|
|
</view>
|
|
<view class="tool-lable" @click="outLogin" v-if="userLogin">
|
|
<img class="tool-icon" src="@/static/imgs/userTool_04.png">
|
|
<view class="tool-name">退出登录</view>
|
|
</view> -->
|
|
</view>
|
|
</view>
|
|
<view class="tool" v-if="listArr.length > 0">
|
|
<view class="tool-title">
|
|
常识推荐
|
|
</view>
|
|
<view class="list-item" >
|
|
<view class="list-item-label" v-for="(item, index) in listArr" :key="index" @click="$Router.push({name: 'indexDetails', params: {id: item.article_id}})" v-if="index<4">
|
|
<view class="list-item-img">
|
|
<!-- 5:6 -->
|
|
<image :src="item.cover" mode="widthFix"></image>
|
|
</view>
|
|
<view class="list-item-cont">
|
|
<view class="nowrap list-item-name">
|
|
{{item.title}}
|
|
</view>
|
|
<view class="list-item-see">
|
|
<image class="list-item-icon" src="@/static/imgs/indexSee.png"></image>{{item .clicks}} 游览
|
|
</view>
|
|
<view class="list-item-tips" v-for="(items, itemsIndex) in item.categories" :key="itemsIndex">
|
|
{{items.title}}
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import { articleList } from '@/apis/interfaces/index'
|
|
import { userIndex } from '@/apis/interfaces/user'
|
|
import { synthesisCount } from '@/apis/interfaces/synthesis'
|
|
export default {
|
|
data() {
|
|
return {
|
|
userLogin : false, //登录状态
|
|
userData : {
|
|
identity: {
|
|
can_open_vip : false,
|
|
can_renew_vip : false
|
|
}
|
|
}, //用户数据
|
|
synthesisAll : '', // 综法数量
|
|
listArr : [], // 文章列表
|
|
page : {}, // 分页信息
|
|
lodingStats : false, // 加载状态
|
|
};
|
|
},
|
|
|
|
onShow() {
|
|
if(this.$store.getters.getToken) {
|
|
this.userLogin = true
|
|
// 获取用户信息
|
|
this.userInfo();
|
|
|
|
// 获取综法订单数据数量
|
|
this.synthesisInfo();
|
|
}
|
|
|
|
// 获取文章列表
|
|
this.articleItem();
|
|
},
|
|
|
|
methods:{
|
|
// 用户信息
|
|
userInfo() {
|
|
userIndex().then(res => {
|
|
this.userData = res
|
|
}).catch(err => {
|
|
uni.showToast({
|
|
title: err.message,
|
|
icon: "none"
|
|
})
|
|
})
|
|
},
|
|
|
|
// 拨打电话
|
|
onCallPhone(e){
|
|
wx.makePhoneCall({
|
|
phoneNumber: e,
|
|
fail: () => {}
|
|
})
|
|
},
|
|
|
|
// 综法订单数据数量
|
|
synthesisInfo() {
|
|
synthesisCount({channel: 'self'}).then(res => {
|
|
this.synthesisAll = res
|
|
}).catch(err => {
|
|
uni.showToast({
|
|
title: err.message,
|
|
icon: "none"
|
|
})
|
|
})
|
|
},
|
|
|
|
// 文章列表
|
|
articleItem(page) {
|
|
articleList({
|
|
category_id: 1,
|
|
page : page || 1
|
|
}).then(res => {
|
|
let list = this.listArr,
|
|
newData = []
|
|
if(page == 1 || page == undefined) list = []
|
|
newData = list.concat(res.data)
|
|
this.listArr = newData
|
|
this.page = res.page
|
|
this.lodingStats = false
|
|
uni.stopPullDownRefresh()
|
|
}).catch(err => {
|
|
uni.showToast({
|
|
title: err.message,
|
|
icon: "none"
|
|
})
|
|
})
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.block-flex{
|
|
display: flex; color: gray; font-size: 32rpx; align-items: center; justify-content: space-between; padding: 20rpx 30rpx; line-height: 60rpx;
|
|
&-title{ color: #333; }
|
|
}
|
|
|
|
.userTop {
|
|
position: relative;
|
|
width: 100%;
|
|
&.active {
|
|
padding-top: 22%;
|
|
}
|
|
.userTop-back{
|
|
position: absolute;
|
|
left: 0;
|
|
top: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
.userTop-cont {
|
|
z-index: 2;
|
|
padding: $padding;
|
|
box-sizing: border-box;
|
|
.userTop-height {
|
|
height: 110rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
flex-wrap: wrap;
|
|
.userTop-head {
|
|
width: 110rpx;
|
|
height: 110rpx;
|
|
float: left;
|
|
border-radius: 50%;
|
|
overflow: hidden;
|
|
background-color: #fdeff0;
|
|
padding: 10rpx;
|
|
box-sizing: border-box;
|
|
image {
|
|
width: 100%;
|
|
height: 100%;
|
|
border-radius: 50%;
|
|
}
|
|
}
|
|
.userTop-text {
|
|
width: calc(100% - 310rpx);
|
|
float: left;
|
|
margin-left: 30rpx;
|
|
padding-top: $padding - 20;
|
|
box-sizing: border-box;
|
|
position: relative;
|
|
z-index: 1;
|
|
.userTop-login {
|
|
line-height: 90rpx;
|
|
font-weight: 600;
|
|
}
|
|
.userTop-name {
|
|
display: flex;
|
|
font-weight: 600;
|
|
margin-bottom: 8rpx;
|
|
.userTop-icon {
|
|
width: 38rpx;
|
|
height: 38rpx;
|
|
margin: 3rpx 0 0 10rpx;
|
|
}
|
|
}
|
|
.userTop-identity-tips {
|
|
font-size: $title-size-sm - 4;
|
|
display: inline-block;
|
|
box-sizing: border-box;
|
|
background-color: #fbe0e2;
|
|
border-radius: $radius-m;
|
|
padding: 0 10rpx;
|
|
line-height: 34rpx;
|
|
color: $mian-color;
|
|
.userTop-arrow {
|
|
width: 26rpx;
|
|
height: 26rpx;
|
|
vertical-align: -6rpx;
|
|
margin-left: 4rpx;
|
|
}
|
|
}
|
|
}
|
|
.user-vip{
|
|
background: $mian-color;
|
|
color: white;
|
|
position: relative;
|
|
z-index: 1;
|
|
width: 170rpx;
|
|
font-size: 28rpx;
|
|
line-height: 70rpx;
|
|
border-radius: 35rpx;
|
|
text-align: center;
|
|
}
|
|
}
|
|
.userTop-see {
|
|
margin: 0 -10rpx;
|
|
padding-top: 20rpx;
|
|
flex-wrap: wrap;
|
|
justify-content: flex-start;
|
|
.userTop-label {
|
|
display: inline-block;
|
|
background-color: #ffffff;
|
|
border-radius: $radius-lg;
|
|
margin: 10rpx 10rpx 0;
|
|
width: calc(50% - 20rpx);
|
|
padding: $padding - 10 $padding - 10 $padding - 5;
|
|
box-sizing: border-box;
|
|
position: relative;
|
|
overflow: hidden;
|
|
.userSee-tips {
|
|
font-size: $title-size-sm - 4;
|
|
background-color: #fff6ea;
|
|
color: $yellow-color;
|
|
display: inline-block;
|
|
padding: 0 15rpx;
|
|
line-height: 40rpx;
|
|
border-radius: $radius-m - 4;
|
|
}
|
|
.userSee-number {
|
|
margin: 10rpx 0;
|
|
font-weight: 600;
|
|
text {
|
|
font-weight: normal;
|
|
font-size: $title-size-sm - 4;
|
|
padding-left: 5rpx;
|
|
}
|
|
}
|
|
&:nth-child(2) .userSee-tips, &:nth-child(3) .userSee-tips{
|
|
background-color: #fff2f2;
|
|
color: $mian-color;
|
|
}
|
|
.userSee-icon {
|
|
width: 110rpx;
|
|
height: 110rpx;
|
|
position: absolute;
|
|
right: -20rpx;
|
|
bottom: -10rpx;
|
|
}
|
|
.userSee-new {
|
|
position: absolute;
|
|
top: -2rpx;
|
|
right: 20rpx;
|
|
font-size: $title-size-sm - 4;
|
|
transform: scale(.9);
|
|
background-color: $mian-color;
|
|
color: #ffffff;
|
|
padding: 0 10rpx;
|
|
line-height: 36rpx;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
// 看板
|
|
.board {
|
|
padding: $padding $padding $padding - 15;
|
|
box-sizing: border-box;
|
|
.board-title {
|
|
font-weight: 600;
|
|
margin-bottom: 20rpx;
|
|
}
|
|
.board-item {
|
|
display: flex;
|
|
margin: 0 -15rpx;
|
|
.board-lable {
|
|
width: calc(33.33% - 30rpx);
|
|
box-shadow: 0 0 8rpx rgba(0, 0, 0, .05);
|
|
padding: $padding - 10 $padding - 5 $padding + 10;
|
|
box-sizing: border-box;
|
|
overflow: hidden;
|
|
border-radius: $radius-sm;
|
|
position: relative;
|
|
color: #969696;
|
|
margin: 0 15rpx;
|
|
&::after {
|
|
position: absolute;
|
|
content: '';
|
|
right: 15rpx;
|
|
top: 15rpx;
|
|
width: 12rpx;
|
|
height: 12rpx;
|
|
border-radius: 50%;
|
|
background-color: transparent;
|
|
}
|
|
&.active::after {
|
|
background-color: $mian-color;
|
|
}
|
|
.board-name {
|
|
margin-bottom: 20rpx;
|
|
font-size: $title-size-sm;
|
|
&.active {
|
|
color: #000000;
|
|
}
|
|
}
|
|
.board-number {
|
|
font-weight: 600;
|
|
color: #000000;
|
|
font-size: $title-size + 4;
|
|
&.active {
|
|
color: $mian-color;
|
|
}
|
|
}
|
|
.board-icon {
|
|
width: 74rpx;
|
|
height: 74rpx;
|
|
position: absolute;
|
|
bottom: 0;
|
|
right: 0;
|
|
}
|
|
}
|
|
}
|
|
|
|
}
|
|
|
|
// 工具
|
|
.tool {
|
|
padding: $padding $padding $padding - 15;
|
|
box-sizing: border-box;
|
|
.tool-title {
|
|
font-weight: 600;
|
|
margin-bottom: 20rpx;
|
|
color: $text-color;
|
|
}
|
|
.tool-item {
|
|
padding: $padding 0;
|
|
border-radius: $radius-sm;
|
|
display: flex;
|
|
.tool-lable {
|
|
flex: 4;
|
|
text-align: center;
|
|
font-size: 24rpx;
|
|
.tool-icon {
|
|
width: 56rpx;
|
|
height: 56rpx;
|
|
margin-bottom: 5rpx;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
// 常识推荐
|
|
.list-item {
|
|
margin-top: $margin;
|
|
.list-item-label {
|
|
margin-bottom: $margin;
|
|
position: relative;
|
|
.list-item-img {
|
|
width: 200rpx;
|
|
height: 150rpx;
|
|
border:1px solid #d2d2d2;
|
|
border-radius: $radius - 10;
|
|
overflow: hidden;
|
|
box-sizing: border-box;
|
|
image {
|
|
width: 100%;
|
|
vertical-align:middle;
|
|
}
|
|
}
|
|
.list-item-cont {
|
|
position: absolute;
|
|
left: 0;
|
|
top: 0;
|
|
width: 100%;
|
|
padding-left: 220rpx;
|
|
box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
.list-item-name {
|
|
color: $text-color;
|
|
line-height: 44rpx;
|
|
font-size: $title-size-m;
|
|
}
|
|
.list-item-see {
|
|
font-size: $title-size-sm - 4;
|
|
margin-top: 30rpx;
|
|
display: flex;
|
|
line-height: 30rpx;
|
|
.list-item-icon {
|
|
width: 30rpx;
|
|
height: 30rpx;
|
|
margin-right: 10rpx;
|
|
}
|
|
}
|
|
.list-item-tips {
|
|
font-size: $title-size-sm - 4;
|
|
display: inline-block;
|
|
color: #a1a1a1;
|
|
padding-left: 40rpx;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</style> |