1180 lines
32 KiB
Vue
1180 lines
32 KiB
Vue
<template>
|
||
<view>
|
||
<u-navbar back-text="" title="个人主页"></u-navbar>
|
||
<view class="flex-col section_2">
|
||
<view class="justify-between section_3">
|
||
<view class="flex-col text-wrapper_3">
|
||
<!-- <text class="text_1">{{userInfo.baseData.name || userInfo.baseData.userName }} -->
|
||
<!-- </text> -->
|
||
<text class="text_1">{{ attestation.name || "-" }} </text>
|
||
<view class="role-box">
|
||
<view
|
||
@click="baseShow = true"
|
||
v-if="otherUserType === 1"
|
||
class="role-item"
|
||
:class="baseShow ? 'active' : ''"
|
||
>
|
||
<image
|
||
src="/static/common/img/role2.png"
|
||
style="
|
||
width: 30rpx;
|
||
height: 30rpx;
|
||
transform: translateY(5rpx) scale(1.4);
|
||
margin-right: 15rpx;
|
||
"
|
||
/>
|
||
<text>教师</text>
|
||
</view>
|
||
<view
|
||
@click="baseShow = true"
|
||
v-if="otherUserType === 0"
|
||
class="role-item"
|
||
:class="baseShow ? 'active' : ''"
|
||
>
|
||
<image
|
||
src="/static/common/img/role3.png"
|
||
style="
|
||
width: 30rpx;
|
||
height: 30rpx;
|
||
transform: translateY(5rpx) scale(1.4);
|
||
margin-right: 15rpx;
|
||
"
|
||
/>
|
||
<text>学生</text>
|
||
</view>
|
||
<view
|
||
@click="baseShow = false"
|
||
v-if="qyShow"
|
||
class="role-item"
|
||
:class="!baseShow ? 'active' : ''"
|
||
style="margin-left: 20rpx"
|
||
>
|
||
<image
|
||
src="/static/common/img/role1.png"
|
||
style="
|
||
width: 30rpx;
|
||
height: 30rpx;
|
||
transform: translateY(5rpx) scale(1.4);
|
||
margin-right: 15rpx;
|
||
"
|
||
/>
|
||
<text>企业</text>
|
||
</view>
|
||
</view>
|
||
<!-- 学校信息 -->
|
||
<template v-if="baseShow === true">
|
||
<!-- 学生显示 -->
|
||
<template v-if="otherUserType === 0">
|
||
<!-- 学校名称 -->
|
||
<text class="text_2">{{ findRow.schoolName || "-" }}</text>
|
||
<!-- 年级 -->
|
||
<text class="text_2" v-if="findRow.startYear">{{
|
||
findRow.startYear + "级"
|
||
}}</text>
|
||
<!-- 学院 -->
|
||
<text class="text_2" v-if="findRow.college">{{
|
||
findRow.college
|
||
}}</text>
|
||
<!-- 专业 -->
|
||
<view class="flex-row">
|
||
<text
|
||
class="text_2"
|
||
style="margin-right: 0.05rem"
|
||
v-if="findRow.major"
|
||
>{{ findRow.major }}</text
|
||
>
|
||
</view>
|
||
</template>
|
||
<!-- 教师显示 -->
|
||
<template v-if="otherUserType === 1">
|
||
<!-- 学校名称 -->
|
||
<text class="text_2">{{ findRow.school || "-" }}</text>
|
||
<!-- 年级 -->
|
||
<text class="text_2">{{ findRow.schoolJob }}</text>
|
||
</template>
|
||
</template>
|
||
<!-- 企业信息 -->
|
||
<template v-if="baseShow === false && qyRow">
|
||
<text class="text_2">{{ qyRow.businessName || "-" }}</text>
|
||
<text class="text_2">{{ qyRow.businessAddress || "-" }}</text>
|
||
<text class="text_2">{{ qyRow.job || "-" }}</text>
|
||
</template>
|
||
</view>
|
||
<view class="flex-col img-box">
|
||
<u-avatar
|
||
class="image_2"
|
||
size="144"
|
||
:src="$u.http.config.imgUrl + userInfo.baseData.head"
|
||
>
|
||
</u-avatar>
|
||
<view class="flex-row group_3" v-if="vuex_user.id != userId">
|
||
<view class="flex-col items-center text-wrapper"
|
||
><text class="text_2" @click="GoChat">私信</text>
|
||
</view>
|
||
<view
|
||
class="flex-col items-center text-wrapper_1"
|
||
@click="onFollow"
|
||
>
|
||
<text class="text_3">{{ userInfo.carewState }}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view v-if="!userInfo.isCertifyStatus" class="flex-row group_4">
|
||
<image
|
||
src="/static/common/img/16535374500735010318.png"
|
||
class="image_3"
|
||
/>
|
||
<text class="text_4">该用户尚未进行认证，请注意信息的甄别</text>
|
||
</view>
|
||
</view>
|
||
<!-- 无数据 -->
|
||
<view class="flex-col items-center group_5" v-if="false">
|
||
<image
|
||
src="/static/common/img/16535374500948048054.png"
|
||
class="image_4"
|
||
/>
|
||
<text class="text_5">暂无数据，请尽快认证补充资料~</text>
|
||
</view>
|
||
<!--有数据 -->
|
||
<div class="detil">
|
||
<view class="slot-wrap">
|
||
<u-tabs-swiper
|
||
ref="uTabs"
|
||
:list="navList"
|
||
:current="current"
|
||
:is-scroll="true"
|
||
gutter="60"
|
||
:active-item-style="{ color: '#3CB5FB', transition: 'all 0.5s' }"
|
||
:bar-style="{ background: '#3CB5FB' }"
|
||
@change="tabsChange"
|
||
></u-tabs-swiper>
|
||
</view>
|
||
<swiper
|
||
:current="swiperCurrent"
|
||
@transition="transition"
|
||
@animationfinish="animationfinish"
|
||
style="height: calc(100vh - 2.8rem); width: 100%"
|
||
>
|
||
<swiper-item
|
||
class="swiper-item"
|
||
v-for="(item, index) in navList"
|
||
:key="index"
|
||
style="height: calc(100vh - 2.8rem); width: 100%"
|
||
>
|
||
<!-- 个人信息 -->
|
||
<template v-if="index === 0">
|
||
<scroll-view
|
||
scroll-y="true"
|
||
style="height: calc(100vh - 2.8rem); width: 100%"
|
||
@scrolltolower="onreachBottom"
|
||
:data-index="index"
|
||
>
|
||
<view class="flex-col section_7" v-if="userInfo">
|
||
<view class="flex-col items-start text-wrapper_2">
|
||
<text class="text_10">基本信息</text>
|
||
</view>
|
||
<view class="justify-between group_7">
|
||
<text class="text_11">手机号码</text>
|
||
<text class="text_12">{{ userInfo.baseData.phone }}</text>
|
||
</view>
|
||
<view class="group_8 justify-between view">
|
||
<text class="text_13 text_14">年龄</text>
|
||
<text class="text_15 text_16">{{
|
||
userInfo.baseData.age
|
||
}}</text>
|
||
</view>
|
||
<view class="group_8 justify-between">
|
||
<text class="text_13">现居地（区）</text>
|
||
<text class="text_15 text_18">{{
|
||
userInfo.baseData.address
|
||
}}</text>
|
||
</view>
|
||
<view class="group_8 justify-between">
|
||
<text class="text_13 text_19">工作领域</text>
|
||
<text class="text_15 text_20">{{
|
||
userInfo.baseData.workField
|
||
}}</text>
|
||
</view>
|
||
</view>
|
||
<!-- 教育经历 -->
|
||
<view
|
||
class="flex-col section_8"
|
||
v-if="userInfo && otherUserType === 0"
|
||
>
|
||
<view class="flex-col items-start text-wrapper_3"
|
||
><text class="text_21">教育经历</text>
|
||
</view>
|
||
<!-- <view class="flex-row group_9" v-for="(item, index) in userInfo.edcationList" v-if='item.certifyStatus==1' :key="index">
|
||
<text class="text_22">{{item.schoolName}}</text>
|
||
<text class="text_23" :class="item.certifyStatus==0?'color2':item.certifyStatus==1?'color1':'color3'">{{certifyArr[item.certifyStatus]}}</text>
|
||
<view class="flex-col group_10">
|
||
<view class="flex-row section_9">
|
||
<text class="text_24">{{item.startYear}}年入学</text>
|
||
<text class="text_25">{{item.major}}</text>
|
||
<text class="text_26">{{item.educationStr}}</text>
|
||
</view>
|
||
<image
|
||
:src="$u.http.config.imgUrl+item.schoolLogo"
|
||
class="image_4"
|
||
/>
|
||
</view>
|
||
</view> -->
|
||
<view
|
||
class="flex-col group_16"
|
||
v-for="(item, index) in userInfo.edcationList"
|
||
v-if="item.certifyStatus == 1 || true"
|
||
:key="index"
|
||
>
|
||
<view class="flex-row group_17">
|
||
<view class="flex-row">
|
||
<image
|
||
:src="$u.http.config.imgUrl + item.schoolLogo.slice(1)"
|
||
class="image_17"
|
||
/>
|
||
<view class="flex-col group_18">
|
||
<view class="flex-row">
|
||
<text class="text_24">{{ item.schoolName }}</text>
|
||
<text
|
||
class="text_25"
|
||
:class="
|
||
item.certifyStatus == 0
|
||
? 'color2'
|
||
: item.certifyStatus == 1
|
||
? 'color1'
|
||
: 'color3'
|
||
"
|
||
>{{ certifyArr[item.certifyStatus] }}</text
|
||
>
|
||
</view>
|
||
<view class="flex-row group_20">
|
||
<text>{{ item.startYear }}年入学</text>
|
||
<text class="text_27">{{ item.major }}</text>
|
||
<text class="text_28">{{ item.educationStr }}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="section_6" style="padding: 0"> </view>
|
||
</view>
|
||
</view>
|
||
<!-- 任职院校 -->
|
||
<view
|
||
class="flex-col section_8"
|
||
v-if="userInfo && otherUserType === 1"
|
||
>
|
||
<view class="flex-col items-start text-wrapper_3"
|
||
><text class="text_21">任职院校</text>
|
||
</view>
|
||
<view
|
||
class="flex-col group_16"
|
||
v-for="(item, index) in userInfo.edcationList"
|
||
v-if="item.certifyStatus == 1 || true"
|
||
:key="index"
|
||
>
|
||
<view class="flex-row group_17">
|
||
<view class="flex-row">
|
||
<image
|
||
:src="$u.http.config.imgUrl + item.logo.slice(1)"
|
||
class="image_17"
|
||
/>
|
||
<view class="flex-col group_18">
|
||
<view class="flex-row">
|
||
<text class="text_24">{{ item.school }}</text>
|
||
<text
|
||
class="text_25"
|
||
:class="
|
||
item.certifyStatus == 0
|
||
? 'color2'
|
||
: item.certifyStatus == 1
|
||
? 'color1'
|
||
: 'color3'
|
||
"
|
||
>{{ certifyArr[item.certifyStatus] }}</text
|
||
>
|
||
</view>
|
||
<view class="flex-row group_20">
|
||
<text>{{ item.schoolJob }}</text>
|
||
<!-- <text>{{item.startYear}}年入学</text> -->
|
||
<!-- <text class="text_27">{{item.major}}</text> -->
|
||
<!-- <text class="text_28">{{item.educationStr}}</text> -->
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="section_6" style="padding: 0"> </view>
|
||
</view>
|
||
</view>
|
||
<view style="height: 100rpx"></view>
|
||
</scroll-view>
|
||
</template>
|
||
<!-- 发布 -->
|
||
<template v-else>
|
||
<scroll-view
|
||
scroll-y="true"
|
||
style="height: calc(100vh - 2.8rem); width: 100%"
|
||
@scrolltolower="onreachBottom"
|
||
:data-index="index"
|
||
>
|
||
<information
|
||
:list="userList"
|
||
@onStar="onStar"
|
||
type="1"
|
||
:schoolId="schoolId"
|
||
route="2"
|
||
:flag="type"
|
||
></information>
|
||
<!-- <view class="flex-col section_6">
|
||
<view class="justify-between">
|
||
<view class="flex-row">
|
||
<image
|
||
src="https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/6216dee45a7e3f031061d0f1/624409975b22cf00110eafb0/16535374496764278404.png"
|
||
class="image_4 image_5"
|
||
/>
|
||
<view class="flex-col items-start group_8">
|
||
<text class="text_9">l李晓</text>
|
||
<text class="text_10">浙江大学</text>
|
||
</view>
|
||
</view>
|
||
<text class="text_11">8小时前</text>
|
||
</view>
|
||
<view class="flex-col group_9">
|
||
<view class="flex-col group_10">
|
||
<text class="text_12">求合租，地点浙江大学附近</text>
|
||
<text class="text_13"
|
||
>合租需求单身女性，爱护环境干净整洁优先，有爱心喜欢小动物优先....</text
|
||
>
|
||
</view>
|
||
<text class="text_14"># 租房</text>
|
||
<view class="flex-row equal-division">
|
||
<view class="flex-row">
|
||
<image
|
||
src="https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/6216dee45a7e3f031061d0f1/624409975b22cf00110eafb0/16535374496943753946.png"
|
||
class="image_6"
|
||
/>
|
||
<text class="text_15">686</text>
|
||
</view>
|
||
<view class="flex-row equal-division-item_1">
|
||
<image
|
||
src="https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/6216dee45a7e3f031061d0f1/624409975b22cf00110eafb0/16535374494367430312.png"
|
||
class="image_6"
|
||
/>
|
||
<text class="text_16">996</text>
|
||
</view>
|
||
<view class="flex-row equal-division-item_2">
|
||
<image
|
||
src="https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/6216dee45a7e3f031061d0f1/624409975b22cf00110eafb0/16535374491819437386.png"
|
||
class="image_6"
|
||
/>
|
||
<text class="text_17">100</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view> -->
|
||
</scroll-view>
|
||
</template>
|
||
</swiper-item>
|
||
</swiper>
|
||
</div>
|
||
<u-toast ref="uToast" />
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import information from "../../../components/Information.vue";
|
||
export default {
|
||
components: {
|
||
information: information,
|
||
},
|
||
data() {
|
||
return {
|
||
userId: "",
|
||
swiperCurrent: 0,
|
||
current: 0,
|
||
schoolId: "",
|
||
type: "",
|
||
userList: [],
|
||
navList: [
|
||
{
|
||
name: "个人信息",
|
||
},
|
||
{
|
||
name: "Ta的发布",
|
||
},
|
||
],
|
||
certifyArr: {
|
||
0: "未认证",
|
||
1: "已认证",
|
||
2: "审核中",
|
||
},
|
||
userInfo: {},
|
||
word: "",
|
||
otherUserType: true,
|
||
attestation: {},
|
||
// 基础信息
|
||
findRow: {},
|
||
// 企业信息
|
||
qyRow: {},
|
||
// 企业与基础信息切换
|
||
baseShow: true,
|
||
// 企业按钮是否存在
|
||
qyShow: false,
|
||
};
|
||
},
|
||
onLoad(e) {
|
||
if (!e.id) {
|
||
uni.switchTab({
|
||
url: "../../main/index/index",
|
||
});
|
||
return;
|
||
}
|
||
this.type = e.type;
|
||
this.userId = e.id;
|
||
this.word = e.word;
|
||
this.getDetail();
|
||
this.getUserSchool();
|
||
},
|
||
onShow() {
|
||
if (this.current == 1) {
|
||
this.getUserHelp();
|
||
}
|
||
},
|
||
methods: {
|
||
lookQY() {
|
||
console.log(7777777);
|
||
},
|
||
getUserHelp() {
|
||
const data = {
|
||
userId: this.userId,
|
||
pageIndex: 1,
|
||
pageSize: 10,
|
||
};
|
||
this.$u.apiList.UserHelp(data).then((res) => {
|
||
this.userList = res.items;
|
||
});
|
||
},
|
||
getDetail() {
|
||
this.$u.api
|
||
.getUserInfo({
|
||
userId: this.userId,
|
||
})
|
||
.then((res) => {
|
||
this.userInfo = res;
|
||
this.attestation = Object.assign(this.attestation, res.attestation);
|
||
this.otherUserType = res.userType;
|
||
// console.log(this.userInfo, 1)
|
||
this.findRow = res.edcationList[0];
|
||
if (res.qyAttestation) {
|
||
this.qyShow = true;
|
||
this.qyRow = res.qyAttestation;
|
||
}
|
||
});
|
||
},
|
||
// 去聊天
|
||
GoChat() {
|
||
uni.navigateTo({
|
||
url:
|
||
"../../message/dialogBox/dialogBox?id=" + this.userId + "&chatType=0",
|
||
});
|
||
},
|
||
// tabs通知swiper切换
|
||
tabsChange(index) {
|
||
if (index == 1) {
|
||
this.getUserHelp();
|
||
}
|
||
this.swiperCurrent = index;
|
||
},
|
||
// 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;
|
||
this.$refs.uTabs.setFinishCurrent(current);
|
||
this.swiperCurrent = current;
|
||
this.current = current;
|
||
},
|
||
onFollow() {
|
||
const data = {
|
||
userId: this.vuex_user.id,
|
||
carewId: this.userId,
|
||
};
|
||
this.$u.apiList.InsertOrDelFollow(data).then((res) => {
|
||
this.getDetail();
|
||
});
|
||
},
|
||
getUserSchool() {
|
||
this.$u.apiList.GetUserSchool().then((res) => {
|
||
// 学生时
|
||
if ([0,2].includes(this.vuex_user.userType)) {
|
||
this.schoolId = res.items.schoolId;
|
||
}
|
||
// 教师时
|
||
if (this.vuex_user.userType === 1) {
|
||
this.schoolId = res.jzgItems.schoolId;
|
||
}
|
||
});
|
||
},
|
||
async onStar(val) {
|
||
console.log("收藏--");
|
||
// 判断当前学校是否认证，未认证不可收藏
|
||
const req = {
|
||
userId: this.vuex_user.id,
|
||
};
|
||
const result = await this.$u.apiList.MyPage(req);
|
||
console.log(JSON.parse(JSON.stringify(result)), "result");
|
||
const edcationList = result.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",
|
||
});
|
||
}
|
||
// return
|
||
const data = {
|
||
id: val.id,
|
||
type: val.type,
|
||
};
|
||
this.$u.apiList
|
||
.LikeCollect(data)
|
||
.then((res) => {
|
||
if (val.type == 0) {
|
||
if (val.isCllect) {
|
||
val.isCllect = false;
|
||
val.collectCount -= 1;
|
||
this.$refs.uToast.show({
|
||
title: "取消收藏成功",
|
||
type: "success",
|
||
});
|
||
} else {
|
||
val.isCllect = true;
|
||
val.collectCount += 1;
|
||
this.$refs.uToast.show({
|
||
title: "收藏成功",
|
||
type: "success",
|
||
});
|
||
}
|
||
} else if (val.type == 1) {
|
||
if (val.isCllect) {
|
||
val.isCllect = false;
|
||
val.collectCount -= 1;
|
||
this.$refs.uToast.show({
|
||
title: "取消收藏成功",
|
||
type: "success",
|
||
});
|
||
} else {
|
||
val.isCllect = true;
|
||
val.collectCount += 1;
|
||
this.$refs.uToast.show({
|
||
title: "收藏成功",
|
||
type: "success",
|
||
});
|
||
}
|
||
}
|
||
})
|
||
.catch((err) => {
|
||
this.$refs.uToast.show({
|
||
title: "收藏失败",
|
||
type: "error",
|
||
});
|
||
});
|
||
},
|
||
//返回上一级
|
||
router() {
|
||
if (this.type == 0) {
|
||
uni.switchTab({
|
||
url: "../../message/msgList/msgList",
|
||
});
|
||
} else if (this.type == 1) {
|
||
uni.navigateTo({
|
||
url:
|
||
"../../message/dialogBox/dialogBox?id=" +
|
||
this.userId +
|
||
"&chatType=0&type=0",
|
||
});
|
||
} else if (this.type == 2) {
|
||
this.$u.route({
|
||
url: "pages/AlumniCircle/Alumni/Alumni",
|
||
});
|
||
} else if (this.type == 3) {
|
||
let url = "pages/main/search/search";
|
||
if (this.word) {
|
||
url = "pages/main/search/search?word=" + this.word;
|
||
}
|
||
this.$u.route({
|
||
url: url,
|
||
});
|
||
} else if (this.type == 4) {
|
||
uni.navigateBack({
|
||
delta: 1,
|
||
});
|
||
} else {
|
||
uni.switchTab({
|
||
url: "pages/main/index/index",
|
||
});
|
||
}
|
||
},
|
||
// scroll-view到底部加载更多
|
||
onreachBottom() {},
|
||
},
|
||
};
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.group_5 {
|
||
margin-top: 0.63rem;
|
||
|
||
.image_4 {
|
||
width: 1.95rem;
|
||
height: 1.73rem;
|
||
}
|
||
|
||
.text_5 {
|
||
margin-top: 0.18rem;
|
||
color: #a3b6ca;
|
||
font-size: 0.15rem;
|
||
font-family: PingFang;
|
||
line-height: 0.15rem;
|
||
}
|
||
}
|
||
|
||
.section_2 {
|
||
padding: 0.075rem 0.14rem 0 0.15rem;
|
||
background-color: #ffffff;
|
||
|
||
.section_3 {
|
||
// border:1px solid red;
|
||
min-height: 500rpx;
|
||
padding: 0.39rem 0.13rem 0.46rem 0.23rem;
|
||
background-image: url("https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/6216dee45a7e3f031061d0f1/624409975b22cf00110eafb0/16535374499958928799.png");
|
||
background-size: 100% 100%;
|
||
background-repeat: no-repeat;
|
||
position: relative;
|
||
.img-box {
|
||
position: absolute;
|
||
right: 30rpx;
|
||
}
|
||
|
||
.text-wrapper_3 {
|
||
position: absolute;
|
||
// min-height: 200rpx;
|
||
margin-top: 0.07rem;
|
||
|
||
.role-box {
|
||
display: flex;
|
||
margin-top: 20rpx;
|
||
.role-item {
|
||
font-size: 25rpx;
|
||
color: #ffffff;
|
||
padding-left: 5rpx;
|
||
padding-right: 10rpx;
|
||
border-radius: 10rpx;
|
||
}
|
||
.active {
|
||
color: aqua;
|
||
border: 1px solid #00a8ea;
|
||
background-color: #00a8ea;
|
||
}
|
||
}
|
||
.text_1 {
|
||
color: #ffffff;
|
||
font-size: 0.18rem;
|
||
font-family: PingFang;
|
||
line-height: 0.17rem;
|
||
}
|
||
|
||
.text_2 {
|
||
margin-left: 0.015rem;
|
||
margin-top: 0.17rem;
|
||
color: #ffffff;
|
||
font-size: 0.14rem;
|
||
font-family: PingFang;
|
||
line-height: 0.16rem;
|
||
max-width: 40vw;
|
||
}
|
||
}
|
||
|
||
.image_2 {
|
||
border-radius: 50%;
|
||
align-self: center;
|
||
width: 0.8rem;
|
||
height: 0.8rem;
|
||
margin: 0 0.3rem;
|
||
}
|
||
|
||
.group_3 {
|
||
margin-top: 0.14rem;
|
||
|
||
.text-wrapper {
|
||
padding: 0.03rem 0 0.03rem;
|
||
background-color: #ffffff;
|
||
border-radius: 0.11rem;
|
||
width: 0.6rem;
|
||
height: 0.22rem;
|
||
border: solid 0.005rem #f6f7fa;
|
||
|
||
.text_2 {
|
||
color: #2e9bff;
|
||
font-size: 0.13rem;
|
||
font-family: PingFang;
|
||
line-height: 0.16rem;
|
||
}
|
||
}
|
||
|
||
.text-wrapper_1 {
|
||
margin-left: 0.075rem;
|
||
padding: 0.03rem 0 0.03rem;
|
||
background-color: #ffffff;
|
||
border-radius: 0.11rem;
|
||
width: 0.6rem;
|
||
height: 0.22rem;
|
||
border: solid 0.005rem #f6f7fa;
|
||
|
||
.text_3 {
|
||
color: #2e9bff;
|
||
font-size: 0.13rem;
|
||
font-family: PingFang;
|
||
line-height: 0.16rem;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.group_4 {
|
||
padding: 0.09rem 0.02rem 0.085rem;
|
||
|
||
.image_3 {
|
||
margin-bottom: 0.02rem;
|
||
width: 0.13rem;
|
||
height: 0.11rem;
|
||
}
|
||
|
||
.text_4 {
|
||
margin-left: 0.025rem;
|
||
color: #2e9bff;
|
||
font-size: 0.13rem;
|
||
font-family: PingFang;
|
||
line-height: 0.13rem;
|
||
}
|
||
}
|
||
}
|
||
|
||
.detil {
|
||
.section_7 {
|
||
margin-top: 0.01rem;
|
||
padding: 0.05rem 0.12rem 0.2rem 0.17rem;
|
||
background-color: rgb(255, 255, 255);
|
||
|
||
.text-wrapper_2 {
|
||
margin-right: 0.03rem;
|
||
padding: 0.16rem 0 0.095rem;
|
||
color: rgb(55, 59, 72);
|
||
font-size: 0.15rem;
|
||
font-family: PingFang;
|
||
line-height: 0.14rem;
|
||
background-color: rgb(255, 255, 255);
|
||
box-shadow: 0.00018rem 0.005rem rgba(0, 0, 0, 0.03);
|
||
|
||
.text_10 {
|
||
margin-left: 0.015rem;
|
||
}
|
||
}
|
||
|
||
.group_7 {
|
||
margin-top: 0.15rem;
|
||
padding-left: 0.015rem;
|
||
|
||
.text_11 {
|
||
color: rgb(55, 59, 72);
|
||
font-size: 0.15rem;
|
||
font-family: PingFang;
|
||
line-height: 0.14rem;
|
||
}
|
||
|
||
.text_12 {
|
||
margin: 0.015rem 0;
|
||
color: rgb(160, 162, 172);
|
||
font-size: 0.15rem;
|
||
font-family: PingFang;
|
||
line-height: 0.12rem;
|
||
}
|
||
}
|
||
|
||
.group_8 {
|
||
margin-top: 0.16rem;
|
||
padding: 0 0.015rem;
|
||
|
||
.text_13 {
|
||
color: rgb(55, 59, 72);
|
||
font-size: 0.15rem;
|
||
font-family: PingFang;
|
||
line-height: 0.14rem;
|
||
}
|
||
|
||
.text_14 {
|
||
margin-top: 0.015rem;
|
||
}
|
||
|
||
.text_15 {
|
||
color: rgb(160, 162, 172);
|
||
font-size: 0.15rem;
|
||
font-family: PingFang;
|
||
line-height: 0.14rem;
|
||
}
|
||
|
||
.text_16 {
|
||
margin-right: 0.03rem;
|
||
margin-bottom: 0.02rem;
|
||
}
|
||
|
||
.text_18 {
|
||
margin-right: 0.045rem;
|
||
margin-bottom: 0.01rem;
|
||
}
|
||
|
||
.text_19 {
|
||
margin-bottom: 0.01rem;
|
||
}
|
||
|
||
.text_20 {
|
||
margin-right: 0.045rem;
|
||
margin-top: 0.015rem;
|
||
}
|
||
}
|
||
|
||
.view {
|
||
margin-top: 0.14rem;
|
||
}
|
||
}
|
||
|
||
.section_8 {
|
||
margin-top: 0.2rem;
|
||
padding: 0.05rem 0.14rem 0.06rem 0.17rem;
|
||
background-color: rgb(255, 255, 255);
|
||
position: relative;
|
||
|
||
.text-wrapper_3 {
|
||
padding: 0.16rem 0 0.1rem;
|
||
color: rgb(55, 59, 72);
|
||
font-size: 0.15rem;
|
||
font-family: PingFang;
|
||
line-height: 0.14rem;
|
||
background-color: rgb(255, 255, 255);
|
||
box-shadow: 0.00018rem 0.005rem rgba(0, 0, 0, 0.03);
|
||
|
||
.text_21 {
|
||
margin-left: 0.01rem;
|
||
}
|
||
}
|
||
|
||
.group_9 {
|
||
margin-top: 0.15rem;
|
||
padding: 0.035rem 0.56rem 0.46rem;
|
||
position: relative;
|
||
|
||
.text_22 {
|
||
color: rgb(55, 59, 72);
|
||
font-size: 0.15rem;
|
||
font-family: PingFang;
|
||
line-height: 0.14rem;
|
||
}
|
||
|
||
.text_23 {
|
||
margin-left: 0.12rem;
|
||
color: rgb(46, 155, 255);
|
||
font-size: 0.1rem;
|
||
font-family: PingFang;
|
||
line-height: 0.14rem;
|
||
}
|
||
|
||
.color1 {
|
||
color: rgb(21, 195, 73);
|
||
}
|
||
|
||
.color2 {
|
||
color: red;
|
||
}
|
||
|
||
.color3 {
|
||
color: #ff9900;
|
||
}
|
||
|
||
.group_10 {
|
||
padding-top: 0.23rem;
|
||
color: rgb(55, 59, 72);
|
||
font-size: 0.15rem;
|
||
font-family: PingFang;
|
||
line-height: 0.14rem;
|
||
top: 0;
|
||
right: 0;
|
||
bottom: 0;
|
||
left: 0;
|
||
position: absolute;
|
||
|
||
.section_9 {
|
||
padding: 0.03rem 0 0.23rem;
|
||
background-color: rgb(255, 255, 255);
|
||
box-shadow: 0.00018rem 0.005rem rgba(0, 0, 0, 0.03);
|
||
position: relative;
|
||
|
||
.text_24 {
|
||
margin-left: 0.56rem;
|
||
}
|
||
|
||
.text_25 {
|
||
margin-left: 0.06rem;
|
||
}
|
||
|
||
.text_26 {
|
||
margin-left: 0.035rem;
|
||
}
|
||
}
|
||
|
||
.image_4 {
|
||
width: 0.45rem;
|
||
height: 0.45rem;
|
||
position: absolute;
|
||
left: 0.01rem;
|
||
top: 0;
|
||
}
|
||
}
|
||
}
|
||
|
||
.group_11 {
|
||
margin-top: 0.13rem;
|
||
padding: 0 0.01rem;
|
||
|
||
.image_5 {
|
||
width: 0.45rem;
|
||
height: 0.45rem;
|
||
}
|
||
|
||
.group_12 {
|
||
margin-left: 0.095rem;
|
||
flex: 1 1 auto;
|
||
align-self: center;
|
||
|
||
.group_14 {
|
||
margin-top: 0.085rem;
|
||
padding: 0 0.005rem;
|
||
color: rgb(55, 59, 72);
|
||
font-size: 0.15rem;
|
||
font-family: PingFang;
|
||
line-height: 0.14rem;
|
||
|
||
.text_30 {
|
||
margin-left: 0.06rem;
|
||
}
|
||
|
||
.text_31 {
|
||
margin-left: 0.035rem;
|
||
}
|
||
}
|
||
|
||
.text_27 {
|
||
color: rgb(55, 59, 72);
|
||
font-size: 0.15rem;
|
||
font-family: PingFang;
|
||
line-height: 0.14rem;
|
||
}
|
||
|
||
.text_28 {
|
||
margin-left: 0.1rem;
|
||
color: rgb(46, 155, 255);
|
||
font-size: 0.15rem;
|
||
font-family: PingFang;
|
||
line-height: 0.14rem;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.section_6 {
|
||
margin-top: 0.01rem;
|
||
padding: 0.14rem 0.1rem 0.07rem 0.21rem;
|
||
background-color: rgb(255, 255, 255);
|
||
|
||
.group_9 {
|
||
margin-top: 0.12rem;
|
||
padding: 0 0.01rem;
|
||
|
||
.group_10 {
|
||
margin-right: 0.05rem;
|
||
|
||
.text_12 {
|
||
align-self: flex-start;
|
||
color: rgb(2, 2, 2);
|
||
font-size: 0.18rem;
|
||
font-family: Adobe Heiti Std;
|
||
line-height: 0.17rem;
|
||
}
|
||
|
||
.text_13 {
|
||
margin-top: 0.065rem;
|
||
color: rgb(73, 76, 87);
|
||
font-size: 0.15rem;
|
||
font-family: Adobe Heiti Std;
|
||
line-height: 0.24rem;
|
||
}
|
||
}
|
||
|
||
.text_14 {
|
||
margin-left: 0.015rem;
|
||
margin-top: 0.065rem;
|
||
align-self: flex-start;
|
||
color: rgb(44, 109, 255);
|
||
font-size: 0.14rem;
|
||
font-family: PingFang;
|
||
line-height: 0.14rem;
|
||
}
|
||
|
||
.equal-division {
|
||
margin: 0.095rem 0.14rem 0 0.23rem;
|
||
color: rgb(183, 183, 183);
|
||
font-size: 0.14rem;
|
||
font-family: PingFang;
|
||
line-height: 0.11rem;
|
||
|
||
.equal-division-item_1 {
|
||
margin-left: 0.69rem;
|
||
|
||
.text_16 {
|
||
margin: 0.063rem 0 0 0.085rem;
|
||
}
|
||
}
|
||
|
||
.equal-division-item_2 {
|
||
margin-left: 0.69rem;
|
||
|
||
.text_17 {
|
||
margin: 0.063rem 0 0 0.085rem;
|
||
}
|
||
}
|
||
|
||
.text_15 {
|
||
margin: 0.063rem 0 0 0.085rem;
|
||
}
|
||
|
||
.image_6 {
|
||
flex-shrink: 0;
|
||
width: 0.2rem;
|
||
height: 0.2rem;
|
||
}
|
||
}
|
||
}
|
||
|
||
.text_11 {
|
||
margin-top: 0.035rem;
|
||
color: rgb(184, 184, 184);
|
||
font-size: 0.12rem;
|
||
font-family: PingFang;
|
||
line-height: 0.12rem;
|
||
}
|
||
|
||
.image_4 {
|
||
width: 0.3rem;
|
||
height: 0.3rem;
|
||
}
|
||
|
||
.image_5 {
|
||
margin-bottom: 0.02rem;
|
||
}
|
||
|
||
.group_8 {
|
||
margin-left: 0.07rem;
|
||
margin-top: 0.02rem;
|
||
|
||
.text_9 {
|
||
color: rgb(2, 2, 2);
|
||
font-size: 0.14rem;
|
||
font-family: PingFang;
|
||
line-height: 0.13rem;
|
||
}
|
||
|
||
.text_10 {
|
||
margin-top: 0.055rem;
|
||
color: rgb(184, 184, 184);
|
||
font-size: 0.12rem;
|
||
font-family: PingFang;
|
||
line-height: 0.12rem;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.group_16 {
|
||
.section_6 {
|
||
margin-left: 0.015rem;
|
||
margin-right: 0.04rem;
|
||
box-shadow: 0.0002rem 0.005rem rgba(0, 0, 0, 0.11);
|
||
border-radius: 0.15rem 0.15rem 0px 0px;
|
||
height: 1px;
|
||
}
|
||
.group_17 {
|
||
justify-content: space-between;
|
||
padding: 0.1rem;
|
||
position: relative;
|
||
|
||
.image_17 {
|
||
width: 0.45rem;
|
||
height: 0.45rem;
|
||
border-radius: 50%;
|
||
}
|
||
|
||
.group_18 {
|
||
margin: 0.035rem 0 0.04rem 0.095rem;
|
||
width: 65vw;
|
||
.group_20 {
|
||
margin-top: 0.09rem;
|
||
color: #8d8e90;
|
||
font-size: 0.12rem;
|
||
line-height: 0.14rem;
|
||
white-space: nowrap;
|
||
> text {
|
||
margin-left: 0.06rem;
|
||
}
|
||
> text:first-child {
|
||
margin-left: 0;
|
||
}
|
||
}
|
||
.text_24 {
|
||
color: #373b48;
|
||
font-size: 0.15rem;
|
||
line-height: 0.14rem;
|
||
white-space: nowrap;
|
||
}
|
||
.text_25 {
|
||
margin-left: 0.04rem;
|
||
font-size: 0.1rem;
|
||
line-height: 0.14rem;
|
||
white-space: nowrap;
|
||
}
|
||
.color1 {
|
||
color: rgb(21, 195, 73);
|
||
}
|
||
|
||
.color2 {
|
||
color: red;
|
||
}
|
||
|
||
.color3 {
|
||
color: #ff9900;
|
||
}
|
||
}
|
||
.group_18 > view:first-child {
|
||
justify-content: space-between;
|
||
}
|
||
}
|
||
}
|
||
</style>
|