YingXingAI/pages/AlumniCircle/alumnus/alumnus.vue

1282 lines
29 KiB
Vue
Raw Normal View History

2025-06-30 14:43:02 +08:00
<template>
<view>
<view class="page-title">校友圈</view>
<view class="content-top">
<!-- <u-navbar :is-back="false" title="" :border-bottom="false">
<view class="slot-wrap">
<u-search :input-style="searchStyle" placeholder="搜索资讯或需求" search-icon="search" :show-action="true"
action-text="搜索" v-model="Title" @custom="onSearch">
</u-search>
</view>
</u-navbar> -->
<drag-button :isDock="true" :current='current' :existTabBar="true" @reload='reload' />
<!-- <u-tabs-swiper ref="uTabs" :list="navList" :current="current" :is-scroll="false"
:active-item-style="{ color: '#3CB5FB', fontSize: '0.15rem' }" :bar-style="{ background: '#3CB5FB' }"
@change="tabsChange"></u-tabs-swiper> -->
<view class="tabs-wrap">
<view class="tabs-box">
<view class="tabs-item" :class="{ 'tabs-item-active': current == item.type }"
v-for="(item, index) in navList" :key="index" @click="tabsChange(item.type)">
<text>{{ item.name }}</text>
</view>
</view>
<view class="search-box" @click="searchClick">
<image src="/static/common/img/search.svg" style="width: 40rpx;height: 40rpx;"></image>
</view>
<view class="search-box" @click="btnClick"
v-if="(current == 0 && vuex_user.isAttestationGLY && vuex_user.isAttestationJZG && (vuex_user.isAttestationXY || true)) || (current == 1 && (vuex_user.isAttestationXY || true))">
<image src="/static/common/img/add.svg" style="width: 50rpx;height: 50rpx;"></image>
</view>
</view>
<view class="flex-row section_5" :class="{ NavShow: NavShow }" v-if="current == 1">
<text :class="{ 'text_3': currentIdx === index }" v-for="(item, index) in sysList" :key="index"
@click="oncurrent(index, item)">{{ item }}</text>
</view>
</view>
<swiper :current="swiperCurrent" @transition="transition" @animationfinish="animationfinish"
style="height: calc(100vh - 410rpx); width: 100%">
<swiper-item class="swiper-item" v-for="(item, index) in navList" :key="index"
style="height: calc(100vh - 410rpx); width: 100%">
<scroll-view scroll-y="true" style=" width: 100%"
:style="{ height: vuex_iPhone ? 'calc(100vh - 410rpx)' : 'calc(100vh - 1.5rem)' }"
@scrolltolower="onreachBottom" scroll-with-animation='true'
:scroll-top='index == 0 ? isScroll : isScroll2' @scroll='scroll' :data-index='index'>
<view class="flex-col group" v-if="index == 0">
<view class="flex-col" v-if="(state === false) && false">
<view class="flex-col group_1"> </view>
<view class="flex-col group_2">
<view class="flex-col section_4">
<view class="flex-row section_5">
<text class="text_3">待认证请先完成认证~</text>
<text class="text_4" @click="onAuto">去认证 >></text>
</view>
</view>
<view class="flex-col group_3">
<view class="flex-col">
<image src="/static/common/img/16535374500948048054.png" class="image_1" />
</view>
<text class="text_5">暂无数据请尽快认证补充资料~</text>
</view>
</view>
</view>
<template v-if="(state === true) && true">
<!-- <view class="flex-col xyzz" v-if='Alumn.length'>
<view class="flex-col group_3">
<view class="flex-col">
<view class="flex-row group_4">
<view>
<image src="/static/common/img/16486275579950463634.png"
class="image_2" />
<text class="text_3">校友找找</text>
</view>
<text style='float:right;' @click='toAlumni()'>更多</text>
</view>
<view class="group_23">
<view class="flex-row horiz-list">
<view class="flex-col items-center list-item_2" :key="idx"
v-for="(item, idx) in Alumn" v-if='idx < 5'
@click='toDetil(item.userId)'>
<u-avatar :src="$u.http.config.imgUrl + item.imageUrl"
class="image_3"></u-avatar>
<text class="text_4">{{ handleStr(item) }}</text>
</view>
</view>
</view>
</view>
</view>
</view> -->
<!-- <view class="info-item"> -->
<information @clickImg="clickImg" @onStar="onStar" :list="shoolList" type="0"
:bottom="bottomState2" :borderRadius="true"></information>
<!-- </view> -->
</template>
</view>
<view class="flex-col group" v-if="index == 1">
<view class="flex-col" v-if="(state === false) && false">
<view class="flex-col group_1"> </view>
<view class="flex-col group_2">
<view class="flex-col section_4">
<view class="flex-row section_5">
<text class="text_3">待认证请先完成认证~</text>
<text class="text_4" @click="onAuto">去认证 >></text>
</view>
</view>
<view class="flex-col group_3">
<view class="flex-col">
<image src="/static/common/img/16535374500948048054.png" class="image_1" />
</view>
<text class="text_5">暂无数据请尽快认证补充资料~</text>
</view>
</view>
</view>
<template v-if="(state === true) && true">
<view class="flex-col group_18">
<view class="flex-col group_17">
<u-sticky offset-top="85" @fixed="onFixed"> </u-sticky>
<u-sticky offset-top="84" @unfixed="onFixed"> </u-sticky>
<!-- <view class="info-item"> -->
<information @onStar="onStar" @clickImg="clickImg" :list="helpList" type="1"
:bottom="bottomState" @onSign="onSign" :borderRadius="true">
</information>
<!-- </view> -->
</view>
</view>
</template>
</view>
</scroll-view>
</swiper-item>
</swiper>
<u-toast ref="uToast" />
<u-tabbar :list="vuex_tabbar" :class="{ phone: vuex_iPhone }" :active-color="vuex_tabbar_config.activeColor"
:inactive-color="vuex_tabbar_config.inactiveColor"></u-tabbar>
<!-- <u-back-top :scroll-top="scrollTop"></u-back-top> -->
</view>
</template>
<script>
import dragButton from '../../../components/drag-button';
import information from "../../../components/Information.vue";
export default {
data() {
return {
scrollTop: 0,
isScroll: 0,
isScroll2: 0,
// 状态
state: false,
NavShow: false,
searchStyle: {
width: "100%",
},
sysList: ['全部', '企业招聘', '租房', '生活', '找工作', '其他'],
tabbar: "",
swiperCurrent: 0,
current: 0,
navList: [
{
name: "学校资讯",
type: 0
},
{
name: "校友帮帮",
type: 1
}
],
PageIndex: 1,
PageSize: 10,
PageIndex2: 1,
PageSize2: 10,
Keyword: "",
DateBegin: "",
DateEnd: "",
SkipCount: "",
helpList: [],
shoolList: [],
Alumn: [],
total1: 0,
total2: 0,
currentIdx: 0,
Keyword: '全部',
Title: "",
isonShow: true,
isLoad: false,
bottomState: false,
bottomState2: false,
isShool: '',
};
},
watch: {
isShool() {
this.bottomState = false,
this.bottomState2 = false,
this.helpList = []
this.shoolList = []
this.getList();
},
current() {
//改成切换就刷新
//if ((this.helpList.length == 0 && this.current == 1) || (this.shoolList.length == 0 && this.current == 0)) {
//}
this.getList();
},
currentIdx() {
this.getList();
}
},
onLoad(e) {
console.log('%c%s', 'color:red', 'onLoad--校友圈')
this.getList();
// this.getAlumnSearch();
},
onShow(e) {
//从我的界面点击回来
uni.$off('circle')
uni.$on('circle', () => {
console.log('circle')
// 获取当前页面的路径
let pages = getCurrentPages();
let currentPage = pages[pages.length - 1];
let url = '/' + currentPage.route;
uni.reLaunch({ url: url, });
})
// console.log('%c%s', 'color:red', 'onShow--校友圈')
// console.log(this.isonShow, 'this.isonShow--')
if (this.isonShow) {
if (uni.getStorageSync('Tag')) {
const value = uni.getStorageSync('Tag');
// this.current = 0
// this.swiperCurrent = 0
this.current = 1
this.swiperCurrent = 1
let arr = value.split(',')
let i = this.sysList.indexOf(arr[0])
this.oncurrent(i, arr[0])
uni.removeStorageSync('Tag');
} else {
// this.getList()
}
this.$u.api.getUser()
this.getList();
this.getAlumnSearch()
// this.getShoolList()
// this.state = this.vuex_user.isAttestationXY || this.vuex_user.isAttestationJZG;
this.state = true;
}
//this.isShool = this.vuex_user.schoolId
this.getSchool()
uni.$on('helpAdd', () => {
console.log('helpAdd回调')
// this.gethelpList();
this.reload();
})
},
methods: {
handleStr(item) {
if (item.name?.length && item.name?.length > 3) {
return item.name?.slice(0, 3) + "..."
}
return item.name
},
async getSchool() {
const req = {
userId: this.vuex_user.id,
};
const res = await this.$u.apiList.MyEducations(req);
// console.log(res, 'res---');
const findRow = res.find(x => x.isSelected === true)
if (findRow) {
this.isShool = findRow.schoolId
}
// console.log(this.isShool, 'this.isShool--')
},
// 刷新
reload() {
this.getList()
},
// 获取笑友找找
getAlumnSearch() {
this.$u.api.getAlumnSearch().then(res => {
this.Alumn = res
})
},
oncurrent(index, item) {
if (this.Keyword != item) {
this.helpList = []
this.Keyword = item
this.currentIdx = index
this.Title = ""
this.PageIndex = 1
this.PageSize = 10
// if (!uni.getStorageSync('Tag')) {
// console.log('没有缓存')
// this.gethelpList()
// }
}
},
onSearch(val) {
this.Title = val
if (this.current == 0) {
this.shoolList = []
this.getShoolList()
} else {
this.helpList = []
this.gethelpList()
}
},
scroll(e) {
this.scrollTop = e.detail.scrollTop;
},
onFixed() {
this.NavShow = !this.NavShow;
},
// 获取校友帮帮列表
gethelpList() {
this.isLoad = true
const data = {
PageIndex: this.PageIndex,
PageSize: this.PageSize,
Keyword: this.Keyword,
// DateBegin:'',
// DateEnd:'',
// SkipCount:1,
// key:,
};
if (this.Keyword != '全部') {
data.Keyword = this.Keyword
}
if (this.Title) {
// this.helpList = []
data.Title = this.Title
}
this.$u.api.GetHelpList(data).then((res) => {
console.log(res, 'res--帮帮列表')
this.isLoad = false
this.total2 = res.total
if (this.helpList.length >= this.total2) {
this.bottomState = true;
return
}
if (this.total2 == res.items.length) {
this.bottomState = true;
}
this.helpList.push(...res.items)
});
},
// 获取学校资讯列表
getShoolList() {
const data = {
PageIndex: this.PageIndex2,
PageSize: this.PageSize2,
// Keyword:this.Keyword,
// DateBegin:'',
// DateEnd:'',
// SkipCount:1,
// key:,
};
if (this.Title) {
// this.shoolList = []
data.Title = this.Title
}
this.$u.api.GetSchoolList(data).then((res) => {
this.total1 = res.total
if (this.shoolList.length >= this.total1) {
this.bottomState2 = true;
return
}
if (this.total1 == res.items.length) {
this.bottomState2 = true;
}
this.shoolList.push(...res.items)
});
},
getList() {
if (this.current == 0) {
this.shoolList = []
this.PageIndex2 = 1
this.PageSize2 = 10
this.getShoolList();
} else {
this.helpList = []
this.PageIndex = 1
this.PageSize = 10
if (!this.isLoad) {
this.gethelpList();
}
}
},
// tabs通知swiper切换
tabsChange(index) {
this.swiperCurrent = index;
this.current = index
this.Title = ""
},
// swiper-item左右移动通知tabs的滑块跟随移动
transition(e) {
let dx = e.detail.dx;
// this.$refs.uTabs.setDx(dx);
},
// 由于swiper的内部机制问速切题快换swiper不会触发dx的连续变化需要在结束时重置状态
// swiper滑动结束分别设置tabs和swiper的状态
animationfinish(e) {
let current = e.detail.current;
console.log(current, 'current--');
// this.$refs.uTabs.setFinishCurrent(current);
this.swiperCurrent = current;
this.current = current;
},
// scroll-view到底部加载更多
onreachBottom() {
let num = this.PageIndex * this.PageSize
let num1 = this.PageIndex2 * this.PageSize2
if (this.current == 0) {
if (num1 >= this.total1) {
this.bottomState2 = true;
return
}
this.PageIndex2++;
this.getShoolList();
} else {
if (num >= this.total2) {
this.bottomState = true;
return
}
this.PageIndex++;
this.gethelpList();
}
},
onAuto() {
this.$u.route({
url: "/pages/my/ShoolList/ShoolList"
})
},
toAlumni(data) {
this.$u.route({
url: "/pages/AlumniCircle/Alumni/Alumni",
})
},
toDetil(id) {
this.$u.route({
url: '/pages/AlumniCircle/userDetail/userDetail?id=' + id
})
},
//收藏
async onStar(val) {
console.log('收藏--');
// 判断当前学校是否认证,未认证不可收藏
const req = {
userId: this.vuex_user.id,
}
const res = await this.$u.apiList.MyPage(req)
console.log(JSON.parse(JSON.stringify(res)), 'res')
const edcationList = res.edcationList
if (!edcationList.length) {
return this.$refs.uToast.show({
title: '认证后可进行收藏操作',
type: 'none',
})
}
const findRow = edcationList.find(x => x.isSelected === true);
if ([0, 2].includes(findRow.certifyStatus)) {
return this.$refs.uToast.show({
title: '认证后可进行收藏操作',
type: 'none',
})
}
const data = {
id: val.id,
type: val.type
}
this.$u.apiList.LikeCollect(data)
.then((res) => {
if (val.isCllect) {
if (val.collectCount > 0) {
val.isCllect = false
val.collectCount--
this.$refs.uToast.show({
title: '取消收藏成功',
type: 'success',
})
}
} else {
val.isCllect = true
val.collectCount++
this.$refs.uToast.show({
title: '收藏成功',
type: 'success',
})
}
})
.catch((err) => {
this.$refs.uToast.show({
title: '收藏失败',
type: 'error',
})
})
},
//标签跳转
onSign(v) {
let i = this.sysList.indexOf(v)
this.oncurrent(i, v)
},
// 搜索校友圈
searchClick() {
this.$u.route({
url: "pages/AlumniCircle/searchAlumnus/searchAlumnus",
params: {
type: this.current, //0-学校咨询 1-校友帮帮
class: this.Keyword, //分类:全部 企业招聘 租房等
},
})
},
//发布资讯文章
async btnClick() {
// 判断当前学校是否认证,未认证不可发布
const req = {
userId: this.vuex_user.id,
}
const res = await this.$u.apiList.MyPage(req)
console.log(JSON.parse(JSON.stringify(res)), 'res')
const edcationList = res.edcationList
if (!edcationList.length) {
return this.$refs.uToast.show({
title: '认证后可进行发布操作',
type: 'none',
})
}
const findRow = edcationList.find(x => x.isSelected === true);
if ([0, 2].includes(findRow.certifyStatus)) {
return this.$refs.uToast.show({
title: '认证后可进行发布操作',
type: 'none',
})
}
this.$u.route({
url: "pages/AlumniCircle/release/release",
params: {
Id: this.isShool,
type: this.current,
url: true
},
})
},
//预览图片
clickImg(item) {
this.isonShow = false
item = this.$u.http.config.imgUrl + item
var images = [];
images.push(item);
uni.previewImage({ // 图片路径必须是一个数组 => ['']
current: 0,
urls: images,
});
}
},
components: {
information: information,
dragButton: dragButton
},
};
</script>
<style lang="scss" scoped>
::v-deep .u-tabs-scorll-flex {
width: 56%;
}
::v-deep .slot-wrap {
margin: 0 0.2rem;
}
::v-deep .u-slot-content {
display: block;
}
.group {
flex: 1 1 auto;
overflow-y: auto;
.group_1 {
padding-bottom: 0.015rem;
position: relative;
.section_1 {
background-color: rgb(255, 255, 255);
.section_2 {
padding: 0.13rem 0.23rem 0.085rem;
background-color: rgb(255, 255, 255);
box-shadow: 0.0002rem 0.005rem rgba(0, 0, 0, 0.03);
.text_1 {
color: rgb(2, 2, 2);
font-size: 0.15rem;
line-height: 0.14rem;
white-space: nowrap;
}
.text_2 {
margin-left: 0.47rem;
color: rgb(160, 162, 172);
font-size: 0.15rem;
line-height: 0.14rem;
white-space: nowrap;
}
}
}
.section_3 {
background-color: rgb(46, 155, 255);
border-radius: 0.015rem;
height: 0.035rem;
position: absolute;
left: 0.35rem;
right: 3.15rem;
bottom: 0;
}
}
.group_2 {
padding-bottom: 1.03rem;
.section_4 {
padding: 0.33rem 0 0.34rem;
background-color: rgb(255, 255, 255);
.section_5 {
margin-left: 0.18rem;
margin-right: 0.24rem;
padding: 0.2rem 0.18rem 0.18rem 0.24rem;
background-color: rgb(246, 247, 250);
.text_3 {
color: rgb(160, 162, 172);
font-size: 0.15rem;
line-height: 0.15rem;
letter-spacing: 0.015rem;
white-space: nowrap;
}
.text_4 {
margin-left: 0.05rem;
color: rgb(46, 155, 255);
font-size: 0.15rem;
line-height: 0.15rem;
white-space: nowrap;
text-transform: uppercase;
}
}
}
.group_3 {
margin-top: 0.76rem;
padding-left: 0.8rem;
padding-right: 0.69rem;
color: rgb(163, 182, 202);
font-size: 0.15rem;
line-height: 0.15rem;
white-space: nowrap;
.text_5 {
margin-left: 0.02rem;
margin-top: 0.13rem;
}
.image_1 {
margin-right: 0.14rem;
width: 2.12rem;
height: 1.89rem;
}
}
}
.info-item {
padding: 24rpx;
}
}
.xyzz {
margin-bottom: 0.05rem;
.group_3 {
padding: 0.1rem 0 0.1rem;
overflow-x: hidden;
background: #fff;
// border-top: 1px solid #ccc;
.group_4 {
justify-content: space-between;
width: 85%;
margin: 0 auto;
>text {
color: #2e9bff;
font-size: 0.15rem;
line-height: 0.16rem;
white-space: nowrap;
}
.image_2 {
flex-shrink: 0;
width: 0.17rem;
height: 0.17rem;
vertical-align: middle;
}
.text_3 {
margin-left: 0.05rem;
color: rgb(2, 2, 2);
font-size: 0.15rem;
line-height: 0.15rem;
letter-spacing: 0.015rem;
vertical-align: middle;
}
}
.group_23 {
width: 100vw;
overflow-x: scroll;
margin-top: 0.13rem;
.horiz-list {
overflow-x: auto;
padding: 0 0.15rem;
.list-item_2 {
padding: 0.05rem 0 0.065rem;
flex-shrink: 0;
width: 20%;
.image_3 {
border-radius: 50%;
width: 0.4rem;
height: 0.4rem;
box-shadow: 0 0 1px #6f6f6f;
}
.text_4 {
margin-top: 0.15rem;
color: rgb(2, 2, 2);
font-size: 0.12rem;
line-height: 0.12rem;
letter-spacing: 0.012rem;
}
}
}
}
}
}
.xyList {
.list {
margin-top: 0.055rem;
padding-bottom: 0.06rem;
.list-item_1 {
padding: 0.19rem 0 0.07rem;
background-color: rgb(255, 255, 255);
margin-bottom: 0.1rem;
.group_11 {
padding: 0 0.16rem;
.image_9 {
margin-bottom: 0.015rem;
width: 0.3rem;
height: 0.3rem;
}
.group_23 {
margin-left: 0.065rem;
margin-top: 0.02rem;
flex: 1 1 auto;
.text_10 {
color: rgb(2, 2, 2);
font-size: 0.14rem;
line-height: 0.13rem;
}
.text_11 {
margin-top: 0.055rem;
color: rgb(184, 184, 184);
font-size: 0.12rem;
line-height: 0.12rem;
}
}
}
.text_12 {
margin-top: 0.17rem;
align-self: center;
color: rgb(55, 59, 72);
font-size: 0.18rem;
line-height: 0.17rem;
}
.text_13 {
margin: 0.12rem 0.15rem 0 0.17rem;
color: rgb(73, 76, 87);
font-size: 0.15rem;
line-height: 0.24rem;
}
.equal-division {
margin-top: 0.035rem;
padding: 0.05rem 0.15rem;
.tool {
margin-top: 0.3rem;
.group_8 {
padding-left: 0.26rem;
padding-right: 0.24rem;
flex: 1 1 1.11rem;
.image_12 {
width: 0.22rem;
height: 0.21rem;
}
.text_17 {
margin-left: 0.08rem;
align-self: center;
color: rgb(180, 182, 189);
font-size: 0.14rem;
line-height: 0.11rem;
}
}
.group_9 {
margin-left: 0.055rem;
padding: 0 0.24rem;
flex: 1 1 1.11rem;
.image_14 {
width: 0.18rem;
height: 0.2rem;
}
.text_18 {
margin-left: 0.08rem;
align-self: center;
color: rgb(180, 182, 189);
font-size: 0.14rem;
line-height: 0.11rem;
}
}
.group_10 {
margin-left: 0.05rem;
padding: 0 0.23rem;
flex: 1 1 1.11rem;
width: 1.12rem;
.image_16 {
margin-left: 0.07rem;
width: 0.2rem;
height: 0.2rem;
}
.text_19 {
align-self: center;
color: rgb(180, 182, 189);
font-size: 0.14rem;
line-height: 0.11rem;
}
}
}
.image_10 {
flex: 1 1 1.11rem;
width: 1.11rem;
height: 1.11rem;
}
.image_13 {
margin-left: 0.055rem;
}
.image_15 {
margin-left: 0.05rem;
}
}
}
}
}
.group_18 {
.image_2 {
margin: 0 auto;
border-radius: 0.1rem;
width: 3.45rem;
height: 1.3rem;
}
.group_17 {
margin-top: 0rem;
.NavShow {
position: fixed;
top: 0;
width: 100%;
background: #fff;
z-index: 999;
border-top: 0.01rem solid #eee;
}
.section_6 {
background-color: rgb(246, 247, 250);
.list-item {
padding: 0.18rem 0.1rem 0.21rem 0.16rem;
background-color: rgb(255, 255, 255);
.view {
margin-right: 0.051rem;
}
.group_9 {
margin-right: 0.13rem;
margin-top: 0.17rem;
.text_14 {
align-self: flex-start;
color: rgb(2, 2, 2);
font-size: 0.18rem;
font-family: Adobe Heiti Std;
line-height: 0.17rem;
}
.text_15 {
margin-top: 0.11rem;
color: rgb(73, 76, 87);
font-size: 0.15rem;
font-family: Adobe Heiti Std;
line-height: 0.24rem;
}
.text_16 {
margin-left: 0.04rem;
margin-top: 0.12rem;
align-self: flex-start;
color: rgb(44, 109, 255);
font-size: 0.14rem;
font-family: PingFang;
line-height: 0.13rem;
}
}
.group_21 {
margin-left: 0.24rem;
margin-top: 0.1rem;
.group_20 {
margin: 0.025rem 0;
.image_6 {
flex-shrink: 0;
width: 0.22rem;
height: 0.21rem;
}
.text_17 {
margin-left: 0.08rem;
margin-top: 0.065rem;
color: rgb(180, 182, 189);
font-size: 0.14rem;
font-family: PingFang;
line-height: 0.11rem;
}
}
.group_10 {
margin-left: 0.63rem;
align-self: center;
.image_7 {
flex-shrink: 0;
width: 0.18rem;
height: 0.2rem;
}
.text_18 {
margin-left: 0.08rem;
margin-top: 0.06rem;
color: rgb(180, 182, 189);
font-size: 0.14rem;
font-family: PingFang;
line-height: 0.11rem;
}
}
.equal-division-item_1 {
margin-left: 0.33rem;
padding: 0.03rem 0;
width: 1.18rem;
.image_8 {
margin-left: 0.3rem;
width: 0.2rem;
height: 0.2rem;
}
.text_19 {
margin-left: 0.095rem;
margin-top: 0.06rem;
color: rgb(180, 182, 189);
font-size: 0.14rem;
font-family: PingFang;
line-height: 0.11rem;
}
}
}
}
.list-item_1 {
margin-top: 0.04rem;
padding: 0.18rem 0.099rem 0.17rem;
background-color: rgb(255, 255, 255);
.group_13 {
margin-left: 0.061rem;
margin-right: 0.056rem;
}
.group_14 {
margin: 0.17rem 0.12rem 0 0.071rem;
.text_23 {
align-self: flex-start;
color: rgb(2, 2, 2);
font-size: 0.18rem;
font-family: Adobe Heiti Std;
line-height: 0.17rem;
}
.text_24 {
margin-top: 0.085rem;
color: rgb(73, 76, 87);
font-size: 0.15rem;
font-family: Adobe Heiti Std;
line-height: 0.24rem;
}
.text_25 {
margin-left: 0.04rem;
margin-top: 0.03rem;
align-self: flex-start;
color: rgb(44, 109, 255);
font-size: 0.14rem;
font-family: PingFang;
line-height: 0.16rem;
}
}
.equal-division {
margin-top: 0.04rem;
.equal-division-item_2 {
flex: 1 1 1.18rem;
padding: 0.029rem 0;
.image_10 {
width: 0.2rem;
height: 0.2rem;
}
.text_26 {
margin: 0.062rem 0 0 0.085rem;
color: rgb(180, 182, 189);
font-size: 0.14rem;
font-family: PingFang;
line-height: 0.11rem;
}
}
}
}
.group_8 {
height: 0.32rem;
position: relative;
.image_3 {
width: 0.3rem;
height: 0.3rem;
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
}
.text_8 {
color: rgb(2, 2, 2);
font-size: 0.14rem;
font-family: PingFang;
line-height: 0.13rem;
}
.text_43 {
position: absolute;
left: 0.37rem;
top: 0.02rem;
}
.text_9 {
color: rgb(184, 184, 184);
font-size: 0.12rem;
font-family: PingFang;
line-height: 0.12rem;
position: absolute;
right: 0;
top: 0.035rem;
}
.text_11 {
color: rgb(184, 184, 184);
font-size: 0.12rem;
font-family: PingFang;
line-height: 0.12rem;
position: absolute;
left: 0.37rem;
bottom: 0;
}
.text_20 {
position: absolute;
left: 0.36rem;
top: 0.02rem;
}
}
}
}
}
.content-top {
background: #fff;
padding-bottom: 30rpx;
}
.tabs-wrap {
display: flex;
align-items: center;
}
.search-box {
width: 88rpx;
height: 88rpx;
display: flex;
align-items: center;
justify-content: center;
background: #F6F8F9;
border-radius: 50%;
margin-left: 20rpx;
}
.tabs-box {
display: flex;
width: 482rpx;
justify-content: space-between;
align-items: center;
padding: 10rpx;
background: #F6F8F9;
border-radius: 200rpx;
margin-left: 40rpx;
.tabs-item {
width: 218rpx;
height: 72rpx;
text-align: center;
line-height: 72rpx;
}
.tabs-item-active {
background: #FFFFFF;
box-shadow: 0rpx 16rpx 8rpx -8rpx rgba(18, 18, 18, 0.08), inset 0rpx 8rpx 8rpx 0rpx rgba(255, 255, 255, 0.05);
border-radius: 200rpx;
border: 3rpx solid;
border-image: linear-gradient(180deg, rgba(255, 255, 255, 0.4), rgba(255, 255, 255, 0), rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.1)) 3 3;
}
}
.page-title {
padding: 40rpx 40rpx 40rpx;
color: #000;
font-size: 36rpx;
font-weight: 800;
background: #fff;
}
.section_5 {
justify-content: space-between;
padding: 0.11rem 0.17rem 0rem;
background-color: rgb(255, 255, 255);
box-shadow: 0.00018rem 0.005rem rgba(0, 0, 0, 0.03);
position: relative;
font-size: 32rpx;
.tab-text {
// margin: 0 0.1rem;
}
.text_3 {
margin-bottom: 0.02rem;
// color: rgb(46, 155, 255);
// font-size: 0.18rem;
font-weight: 800;
font-size: 36rpx;
color: #000000;
font-family: PingFang;
line-height: 0.21rem;
position: relative;
z-index: 1;
&::after {
position: absolute;
content: '';
bottom: 2rpx;
right: 0;
width: 100%;
height: 12rpx;
background: linear-gradient(116deg, rgba(60, 181, 251, 0) 0%, #28C6FB 45%, #06E1FA 100%);
border-radius: 2rpx;
z-index: -1;
}
}
.text_4 {
margin: 0.025rem 0 0.015rem 0.34rem;
color: rgb(160, 162, 172);
font-size: 0.15rem;
font-family: PingFang;
line-height: 0.14rem;
}
.text_5 {
margin-left: 0.26rem;
margin-top: 0.015rem;
color: rgb(160, 162, 172);
font-size: 0.15rem;
font-family: PingFang;
line-height: 0.16rem;
}
.text_6 {
margin-left: 0.29rem;
margin-top: 0.02rem;
color: rgb(160, 162, 172);
font-size: 0.15rem;
font-family: PingFang;
line-height: 0.16rem;
}
.text_7 {
margin-left: 0.35rem;
margin-top: 0.015rem;
color: rgb(160, 162, 172);
font-size: 0.15rem;
font-family: PingFang;
line-height: 0.16rem;
}
}
</style>