670 lines
16 KiB
Vue
670 lines
16 KiB
Vue
|
<template>
|
|||
|
|
<view class="view-page" >
|
|||
|
|
<headerHeight />
|
|||
|
|
<navBar :navTitle="'公会详情'">
|
|||
|
|
<template #rightView>
|
|||
|
|
<view class="icon-right flex-line" @click="exit"
|
|||
|
|
v-if="detailData && detailData.is_join && detailData.is_leader === 0">
|
|||
|
|
<img :src="logout" alt="" />
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
</navBar>
|
|||
|
|
<view class="content" v-if="detailData">
|
|||
|
|
<view class="union-info">
|
|||
|
|
<view class="left-view">
|
|||
|
|
<view class="head-portrait">
|
|||
|
|
<img :src="detailData.cover || logo" alt="" />
|
|||
|
|
</view>
|
|||
|
|
<view class="info-detail">
|
|||
|
|
<view class="union-title">
|
|||
|
|
{{detailData.guild_name}}
|
|||
|
|
</view>
|
|||
|
|
<view class="union-id">
|
|||
|
|
ID:{{detailData.guild_special_id}}
|
|||
|
|
</view>
|
|||
|
|
<view class="union-date">
|
|||
|
|
{{detailData.createtime}}
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="like-box">
|
|||
|
|
<uni-icons type="heart" size="20"></uni-icons>
|
|||
|
|
<span class="ml-6">
|
|||
|
|
{{detailData.total_transaction}}
|
|||
|
|
</span>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<!-- 公会按钮 是会长可以看公会成员 不是不能看 -->
|
|||
|
|
<view class="icon-wrap">
|
|||
|
|
<img class="icon-box" @click.stop="viewDetails(0)" src="@/static/image/union/ghfj.png" alt="" />
|
|||
|
|
<img class="icon-box" @click.stop="viewDetails(1)" src="@/static/image/union/ghcy.png" alt="" />
|
|||
|
|
<img class="icon-box" v-if="detailData.is_leader" @click.stop="viewDetails(2)"
|
|||
|
|
src="@/static/image/union/ghbt.png" alt="" />
|
|||
|
|
<img class="icon-box" v-if="detailData.is_join" @click.stop="viewDetails(3)"
|
|||
|
|
src="@/static/image/union/qlsz.png" alt="" />
|
|||
|
|
</view>
|
|||
|
|
<!-- 公会会长信息 -->
|
|||
|
|
<view class="union-user">
|
|||
|
|
<view class="user-title">
|
|||
|
|
公会会长
|
|||
|
|
</view>
|
|||
|
|
<view class="user-info" @click="jumpHomePage(detailData)">
|
|||
|
|
<view class="flex-line">
|
|||
|
|
<view class="head-portrait">
|
|||
|
|
<img :src="detailData.user_data.avatar" alt="" />
|
|||
|
|
</view>
|
|||
|
|
<view class="info-view">
|
|||
|
|
<view class="">
|
|||
|
|
{{detailData.user_data.nickname}}
|
|||
|
|
</view>
|
|||
|
|
<view class="iconTag-view"
|
|||
|
|
v-if="detailData.user_data.icon || detailData.user_data.icon.length">
|
|||
|
|
<view class="icon-tag" v-for="icon in detailData.user_data.icon" :key="icon">
|
|||
|
|
<img :src="icon" alt="" />
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="">
|
|||
|
|
<uni-icons type="right" size="20"></uni-icons>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<!-- 公会介绍 -->
|
|||
|
|
<view class="union-dec">
|
|||
|
|
<view class="user-title">
|
|||
|
|
公会介绍
|
|||
|
|
</view>
|
|||
|
|
<view class="user-dec">
|
|||
|
|
{{detailData.intro || '暂无数据'}}
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="footer" v-if="!detailData.is_join">
|
|||
|
|
<view class="confirm-button" @click="applyToJoin">
|
|||
|
|
<view class="button">
|
|||
|
|
{{buttonText}}
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="footer" v-if="detailData.is_leader">
|
|||
|
|
<view class="confirm-button" @click="dissolveUnion">
|
|||
|
|
<view class="button">
|
|||
|
|
{{buttonText}}
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<uni-popup ref="message" type="message">
|
|||
|
|
<uni-popup-message :type="msgType" :message="messageText" :duration="2000"></uni-popup-message>
|
|||
|
|
</uni-popup>
|
|||
|
|
<uni-popup ref="popup" type="center">
|
|||
|
|
<view class="popup_view">
|
|||
|
|
<view class="color-3 font-32 popup_title">
|
|||
|
|
温馨提示
|
|||
|
|
</view>
|
|||
|
|
<view class="color-3 font-24 messageContent">
|
|||
|
|
{{messageContent}}
|
|||
|
|
</view>
|
|||
|
|
<view class="popup_button flex-line">
|
|||
|
|
<view class="close_button flex-line" @click="closePopup">
|
|||
|
|
取消
|
|||
|
|
</view>
|
|||
|
|
<view class="confirm-button flex-line" @click="confirmPopup">
|
|||
|
|
确认
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
</uni-popup>
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
import headerHeight from '@/component/headerHeight.vue';
|
|||
|
|
import navBar from '@/component/nav.vue';
|
|||
|
|
import http from '@/until/http.js';
|
|||
|
|
import logout from '@/static/image/union/logout.png'
|
|||
|
|
import logo from '@/static/image/logo.png';
|
|||
|
|
export default {
|
|||
|
|
components: {
|
|||
|
|
headerHeight,
|
|||
|
|
navBar
|
|||
|
|
},
|
|||
|
|
data() {
|
|||
|
|
return {
|
|||
|
|
detailData: null,
|
|||
|
|
logo,
|
|||
|
|
logout,
|
|||
|
|
buttonStatus: null,
|
|||
|
|
buttonText: '申请加入公会',
|
|||
|
|
// 弹出窗状态 null 不展示 0 申请退出 1申请加入公会 2 付费退出 3实名认证
|
|||
|
|
popupStstus: null,
|
|||
|
|
messageText: "",
|
|||
|
|
messageContent: '',
|
|||
|
|
msgType: "success"
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
onLoad(options) {
|
|||
|
|
const {
|
|||
|
|
id
|
|||
|
|
} = options
|
|||
|
|
if (id) {
|
|||
|
|
this.getDetail(id)
|
|||
|
|
this.getUserInfo()
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
methods: {
|
|||
|
|
// 获取用户信息 拿实名信息
|
|||
|
|
async getUserInfo() {
|
|||
|
|
http.get('/api/User/get_user_info', {
|
|||
|
|
token: uni.getStorageSync('token') ?? ''
|
|||
|
|
}).then(response => {
|
|||
|
|
const {
|
|||
|
|
data,
|
|||
|
|
code
|
|||
|
|
} = response
|
|||
|
|
this.isAuth = code ? data.auth : 0
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
// 获取公会信息
|
|||
|
|
async getDetail(Id) {
|
|||
|
|
uni.showLoading({
|
|||
|
|
mask:true,
|
|||
|
|
title:'加载中'
|
|||
|
|
})
|
|||
|
|
http.get('/api/Guild/guild_detail', {
|
|||
|
|
id: Id,
|
|||
|
|
token: uni.getStorageSync('token') ?? ''
|
|||
|
|
}).then(response => {
|
|||
|
|
uni.hideLoading()
|
|||
|
|
const {
|
|||
|
|
data,
|
|||
|
|
code
|
|||
|
|
} = response
|
|||
|
|
this.detailData = code ? data : null
|
|||
|
|
if(data) {
|
|||
|
|
this.buttonText = !data.is_leader ? data.is_join ? '退出公会' : '申请加入公会' : '解散公会'
|
|||
|
|
this.buttonStatus = !data.is_leader ? data.is_join ? 0 : 1 : 2
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
// 点击房间
|
|||
|
|
viewDetails(index) {
|
|||
|
|
// 0 公会房间 1 公会成员 2公会补贴 3 群聊设置
|
|||
|
|
if (index) {
|
|||
|
|
if (index === 1) {
|
|||
|
|
// 公会成员
|
|||
|
|
uni.navigateTo({
|
|||
|
|
url: `/pages/union/unionMembers?id=${this.detailData.id?? null}&leader=${this.detailData.is_leader || 0}`
|
|||
|
|
});
|
|||
|
|
} else if (index === 2) {
|
|||
|
|
// 公会补贴
|
|||
|
|
uni.navigateTo({
|
|||
|
|
url: `/pages/union/subsidy?id=${this.detailData.id?? null}&leader=${this.detailData.is_leader || 0}`
|
|||
|
|
});
|
|||
|
|
} else {
|
|||
|
|
// 群聊抛出
|
|||
|
|
const platform = uni.getSystemInfoSync().platform;
|
|||
|
|
const ParmData = {
|
|||
|
|
group_id: this.detailData.group_id,
|
|||
|
|
cover: this.detailData.cover,
|
|||
|
|
guild_name: this.detailData.guild_name
|
|||
|
|
}
|
|||
|
|
if (platform === 'ios') {
|
|||
|
|
// 通过 messageHandlers 调用 iOS 原生方法
|
|||
|
|
window.webkit.messageHandlers.nativeHandler.postMessage({
|
|||
|
|
'action': 'enterGroupChat',
|
|||
|
|
'data': ParmData
|
|||
|
|
});
|
|||
|
|
} else if (platform === 'android') {
|
|||
|
|
// 调用 Android 原生方法
|
|||
|
|
window.Android.enterGroupChat(this.detailData.group_id,this.detailData.cover,this.detailData.guild_name);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
} else {
|
|||
|
|
// 房间
|
|||
|
|
uni.navigateTo({
|
|||
|
|
url: `/pages/union/roomAndflow?id=${this.detailData.id?? null}&leader=${this.detailData.is_leader || 0}`
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
//申请加入公会
|
|||
|
|
applyToJoin() {
|
|||
|
|
if (this.buttonStatus === 1) {
|
|||
|
|
if (this.isAuth) {
|
|||
|
|
this.popupStstus = 1
|
|||
|
|
this.messageContent = "是否选择加入当前公会"
|
|||
|
|
this.$refs.popup.open('center')
|
|||
|
|
} else {
|
|||
|
|
this.popupStstus = 3
|
|||
|
|
this.messageContent = "当前尚未实名认证，是否跳转到实名认证页面？"
|
|||
|
|
this.$refs.popup.open('center')
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
// 申请加入公会
|
|||
|
|
async joinUnionize() {
|
|||
|
|
http.post('/api/Guild/join_guild', {
|
|||
|
|
guild_id: this.detailData.id,
|
|||
|
|
token: uni.getStorageSync('token') ?? ''
|
|||
|
|
}).then(response => {
|
|||
|
|
const {
|
|||
|
|
data,
|
|||
|
|
code,
|
|||
|
|
msg
|
|||
|
|
} = response
|
|||
|
|
if (code) {
|
|||
|
|
this.messageText = `加入成功`
|
|||
|
|
this.$refs.message.open()
|
|||
|
|
this.msgType = 'success'
|
|||
|
|
this.getDetail(this.detailData.id)
|
|||
|
|
} else {
|
|||
|
|
this.messageText = msg
|
|||
|
|
this.msgType = 'error'
|
|||
|
|
this.$refs.message.open()
|
|||
|
|
}
|
|||
|
|
this.closePopup()
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
// 退出公会
|
|||
|
|
exit() {
|
|||
|
|
uni.showActionSheet({
|
|||
|
|
itemList: ["申请退出", "付费退出"],
|
|||
|
|
success: (res) => {
|
|||
|
|
if (res.tapIndex === 0) {
|
|||
|
|
this.applyToWithdraw();
|
|||
|
|
} else if (res.tapIndex === 1) {
|
|||
|
|
this.paidWithdrawal();
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
fail: (err) => {
|
|||
|
|
console.error("用户取消选择：", err);
|
|||
|
|
},
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
// 申请退出
|
|||
|
|
applyToWithdraw() {
|
|||
|
|
this.popupStstus = 0
|
|||
|
|
this.messageContent = "亲爱的会员，会长将在3天内审核，若超时未通过，您将自动退出并可加入其他公会；若通过，则30天内无法加入其他公会，是否还需要申请退出？"
|
|||
|
|
this.$refs.popup.open('center')
|
|||
|
|
},
|
|||
|
|
// 付费退出
|
|||
|
|
paidWithdrawal() {
|
|||
|
|
this.popupStstus = 2
|
|||
|
|
this.messageContent = `亲爱的会员，支付${this.detailData.quit_guild_gold || 0}金币，即可及时退出公会！是否需要付费退出？`
|
|||
|
|
this.$refs.popup.open('center')
|
|||
|
|
},
|
|||
|
|
// 解散公会
|
|||
|
|
dissolveUnion() {
|
|||
|
|
this.popupStstus = 4
|
|||
|
|
this.messageContent = `亲爱的会长，您当前操作将解散公会，是否解散？`
|
|||
|
|
this.$refs.popup.open('center')
|
|||
|
|
},
|
|||
|
|
closePopup() {
|
|||
|
|
this.popupStstus = null
|
|||
|
|
this.messageContent = ""
|
|||
|
|
this.$refs.popup.close()
|
|||
|
|
},
|
|||
|
|
confirmPopup() {
|
|||
|
|
if (this.popupStstus !== null) {
|
|||
|
|
if (this.popupStstus === 0) {
|
|||
|
|
this.exitUnionize(1)
|
|||
|
|
} else if (this.popupStstus === 1) {
|
|||
|
|
this.joinUnionize()
|
|||
|
|
} else if (this.popupStstus === 2) {
|
|||
|
|
// 付费退出
|
|||
|
|
this.exitUnionize(2)
|
|||
|
|
} else if (this.popupStstus === 3) {
|
|||
|
|
// 实名认证页面
|
|||
|
|
this.authConfirm()
|
|||
|
|
} else if (this.popupStstus === 4) {
|
|||
|
|
// 解散公会
|
|||
|
|
if (this.detailData.is_leader) {
|
|||
|
|
this.unionDissolve()
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
authConfirm() {
|
|||
|
|
// 去实名认证页面
|
|||
|
|
const platform = uni.getSystemInfoSync().platform;
|
|||
|
|
if (platform === 'ios') {
|
|||
|
|
window.webkit.messageHandlers.nativeHandler.postMessage({
|
|||
|
|
'action': 'enterAuthent'
|
|||
|
|
});
|
|||
|
|
} else if (platform === 'android') {
|
|||
|
|
window.Android.enterAuthent();
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
// 跳转公会长个人页面
|
|||
|
|
jumpHomePage(data){
|
|||
|
|
const platform = uni.getSystemInfoSync().platform;
|
|||
|
|
if (platform === 'ios') {
|
|||
|
|
window.webkit.messageHandlers.nativeHandler.postMessage({
|
|||
|
|
'action': 'jumpWebPage',
|
|||
|
|
'data': {
|
|||
|
|
userId: data.user_id
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
} else if (platform === 'android') {
|
|||
|
|
window.Android.jumpWebPage(data.user_id);
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
// 会长解散公会
|
|||
|
|
async unionDissolve() {
|
|||
|
|
http.post('/api/Guild/diss_guild', {
|
|||
|
|
guild_id: this.detailData.id,
|
|||
|
|
token: uni.getStorageSync('token') ?? ''
|
|||
|
|
}).then(response => {
|
|||
|
|
const {
|
|||
|
|
data,
|
|||
|
|
code,
|
|||
|
|
msg
|
|||
|
|
} = response
|
|||
|
|
if (code === 1) {
|
|||
|
|
this.msgType = 'success'
|
|||
|
|
this.messageText = `操作成功，将返回上一页！`
|
|||
|
|
this.$refs.message.open()
|
|||
|
|
uni.navigateBack()
|
|||
|
|
} else {
|
|||
|
|
this.messageText = msg
|
|||
|
|
this.msgType = 'error'
|
|||
|
|
this.$refs.message.open()
|
|||
|
|
}
|
|||
|
|
this.closePopup()
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
// 申请退出公会接口
|
|||
|
|
async exitUnionize(type) {
|
|||
|
|
http.post('/api/Guild/quit_guild', {
|
|||
|
|
guild_id: this.detailData.id,
|
|||
|
|
type: type,
|
|||
|
|
token: uni.getStorageSync('token') ?? ''
|
|||
|
|
}).then(response => {
|
|||
|
|
const {
|
|||
|
|
data,
|
|||
|
|
code,
|
|||
|
|
msg
|
|||
|
|
} = response
|
|||
|
|
if (code === 1) {
|
|||
|
|
this.msgType = 'success'
|
|||
|
|
this.messageText = `${type === 1 ? '退出申请已提交，请等待审核' : '付费退出成功'}`
|
|||
|
|
this.$refs.message.open()
|
|||
|
|
this.getDetail(this.detailData.id)
|
|||
|
|
} else {
|
|||
|
|
this.messageText = msg
|
|||
|
|
this.msgType = 'error'
|
|||
|
|
this.$refs.message.open()
|
|||
|
|
}
|
|||
|
|
this.closePopup()
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style lang="scss">
|
|||
|
|
.view-page {
|
|||
|
|
// padding: 32rpx;
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
background-image: url('@/static/image/help/bg.png');
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
background-size: 100% 100%;
|
|||
|
|
min-height: 100vh;
|
|||
|
|
|
|||
|
|
.content {
|
|||
|
|
padding: 0 32rpx;
|
|||
|
|
flex: 1;
|
|||
|
|
/* 关键：撑满剩余空间 */
|
|||
|
|
overflow: auto;
|
|||
|
|
/* 允许内容滚动 */
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.icon-right {
|
|||
|
|
width: 56rpx;
|
|||
|
|
height: 56rpx;
|
|||
|
|
|
|||
|
|
img {
|
|||
|
|
width: 100%;
|
|||
|
|
height: 100%;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.popup_view {
|
|||
|
|
width: 550rpx;
|
|||
|
|
// height: 40vh;
|
|||
|
|
background-color: #fff;
|
|||
|
|
border-radius: 32rpx;
|
|||
|
|
padding: 32rpx;
|
|||
|
|
|
|||
|
|
.popup_title {
|
|||
|
|
text-align: center;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.messageContent {
|
|||
|
|
margin: 24rpx 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.popup_button {
|
|||
|
|
margin-top: 24rpx;
|
|||
|
|
width: 100%;
|
|||
|
|
justify-content: space-around;
|
|||
|
|
|
|||
|
|
.close_button,
|
|||
|
|
.confirm-button {
|
|||
|
|
width: 200rpx;
|
|||
|
|
height: 84rpx;
|
|||
|
|
background: #F3F3F3;
|
|||
|
|
border-radius: 106rpx;
|
|||
|
|
color: #999999;
|
|||
|
|
justify-content: center;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.confirm-button {
|
|||
|
|
background: #0DFFB9;
|
|||
|
|
color: #333;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.footer {
|
|||
|
|
// background: #f0f0f0;
|
|||
|
|
padding: 20rpx;
|
|||
|
|
text-align: center;
|
|||
|
|
/* 适配iPhoneX等刘海屏 */
|
|||
|
|
padding-bottom: calc(20rpx + env(safe-area-inset-bottom));
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* 确保容器占满屏幕 */
|
|||
|
|
.union-info {
|
|||
|
|
width: 100%;
|
|||
|
|
display: inline-flex;
|
|||
|
|
align-items: center;
|
|||
|
|
flex-wrap: nowrap;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
flex-direction: row;
|
|||
|
|
|
|||
|
|
/* 头像 */
|
|||
|
|
.head-portrait {
|
|||
|
|
width: 120rpx;
|
|||
|
|
height: 120rpx;
|
|||
|
|
border-radius: 50%;
|
|||
|
|
background-color: aquamarine;
|
|||
|
|
|
|||
|
|
img {
|
|||
|
|
width: 100%;
|
|||
|
|
height: 100%;
|
|||
|
|
border-radius: 50%;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.left-view {
|
|||
|
|
display: inline-flex;
|
|||
|
|
align-items: center;
|
|||
|
|
flex-wrap: nowrap;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
flex-direction: row;
|
|||
|
|
|
|||
|
|
.info-detail {
|
|||
|
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
|||
|
|
font-weight: 400;
|
|||
|
|
margin-left: 24rpx;
|
|||
|
|
|
|||
|
|
.union-title {
|
|||
|
|
font-weight: 500;
|
|||
|
|
font-size: 32rpx;
|
|||
|
|
color: #333333;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.union-id {
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
color: #666666;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.union-date {
|
|||
|
|
|
|||
|
|
font-size: 24rpx;
|
|||
|
|
color: #999999;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.like-box {
|
|||
|
|
display: inline-flex;
|
|||
|
|
align-items: center;
|
|||
|
|
flex-wrap: nowrap;
|
|||
|
|
flex-direction: row;
|
|||
|
|
padding: 6rpx 24rpx;
|
|||
|
|
background: #2AFEC0;
|
|||
|
|
border-radius: 35rpx;
|
|||
|
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
|||
|
|
font-weight: 400;
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
color: #333333;
|
|||
|
|
margin: 8rpx 0;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.icon-wrap {
|
|||
|
|
display: flex;
|
|||
|
|
flex-wrap: wrap;
|
|||
|
|
gap: 25px;
|
|||
|
|
margin: 24rpx 0;
|
|||
|
|
|
|||
|
|
.icon-box {
|
|||
|
|
width: 48%;
|
|||
|
|
height: 30%;
|
|||
|
|
flex: 1;
|
|||
|
|
max-width: calc(50% - 12.5px);
|
|||
|
|
border-radius: 15px;
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
justify-content: center;
|
|||
|
|
align-items: center;
|
|||
|
|
cursor: pointer;
|
|||
|
|
|
|||
|
|
img {
|
|||
|
|
width: 100%;
|
|||
|
|
height: 100%;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.union-user,
|
|||
|
|
.union-dec {
|
|||
|
|
padding: 24rpx;
|
|||
|
|
height: 220rpx;
|
|||
|
|
background: #fff;
|
|||
|
|
border-radius: 22rpx;
|
|||
|
|
margin-bottom: 24rpx;
|
|||
|
|
|
|||
|
|
.user-title {
|
|||
|
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
|||
|
|
font-weight: 500;
|
|||
|
|
font-size: 32rpx;
|
|||
|
|
color: #333333;
|
|||
|
|
margin-bottom: 24rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.user-info {
|
|||
|
|
display: inline-flex;
|
|||
|
|
align-items: center;
|
|||
|
|
flex-wrap: nowrap;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
flex-direction: row;
|
|||
|
|
width: 100%;
|
|||
|
|
|
|||
|
|
/* 头像 */
|
|||
|
|
.head-portrait {
|
|||
|
|
width: 120rpx;
|
|||
|
|
height: 120rpx;
|
|||
|
|
border-radius: 50%;
|
|||
|
|
background-color: aquamarine;
|
|||
|
|
|
|||
|
|
img {
|
|||
|
|
width: 100%;
|
|||
|
|
height: 100%;
|
|||
|
|
border-radius: 50%;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.info-view {
|
|||
|
|
margin-left: 24rpx;
|
|||
|
|
|
|||
|
|
.iconTag-view {
|
|||
|
|
display: inline-flex;
|
|||
|
|
align-items: center;
|
|||
|
|
flex-wrap: nowrap;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
flex-direction: row;
|
|||
|
|
padding: 12rpx 0;
|
|||
|
|
|
|||
|
|
.icon-tag {
|
|||
|
|
width: 75rpx;
|
|||
|
|
height: 30rpx;
|
|||
|
|
|
|||
|
|
img {
|
|||
|
|
width: 100%;
|
|||
|
|
height: 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.union-dec {
|
|||
|
|
min-height: 220rpx;
|
|||
|
|
|
|||
|
|
.user-dec {
|
|||
|
|
text-indent: 2em;
|
|||
|
|
font-weight: 400;
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
color: #333333;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.confirm-button {
|
|||
|
|
padding: 0 50rpx;
|
|||
|
|
|
|||
|
|
.button {
|
|||
|
|
display: block;
|
|||
|
|
width: 100%;
|
|||
|
|
height: 84rpx;
|
|||
|
|
border-radius: 106rpx;
|
|||
|
|
line-height: 84rpx;
|
|||
|
|
background-color: #0DFFB9;
|
|||
|
|
color: #333;
|
|||
|
|
text-align: center;
|
|||
|
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
|||
|
|
font-weight: 400;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</style>
|