feat(uniapp_v2): 二开功能迁移与小程序主包优化
- 从 uniapp 迁移 HJF 页面、API、组件及用户/订单相关改动 - queue、assets 使用独立分包以降低主包体积 - 修复首页单根节点与支付结果页 v-if 链 - 关闭 HjfDemoPanel 全局注册；uniNoticeBar 注释 $getAppWebview 避免 __webviewId__ 报错 - 配置域名与 manifest 应用名称；cache/store 防御性处理 Made-with: Cursor
This commit is contained in:
apple
492
pro_v3.5.1/view/uniapp_v2/pages/discover/discoverUser/index.vue
Normal file
492
pro_v3.5.1/view/uniapp_v2/pages/discover/discoverUser/index.vue
Normal file
@@ -0,0 +1,492 @@
|
||||
<template>
|
||||
<view :style="colorStyle">
|
||||
<NavBar titleText="个人主页"
|
||||
textSize="34rpx"
|
||||
:isScrolling="pageScrollStatus"
|
||||
:iconColor="pageScrollStatus ? '#333333' : '#ffffff'"
|
||||
:textColor="pageScrollStatus ? '#333333' : '#ffffff'"
|
||||
showBack
|
||||
:showEmpty="false"></NavBar>
|
||||
<!-- :style="{'height': 552 + (sysHeight * 2) + 'rpx'}" -->
|
||||
<view class="info-card w-full relative" >
|
||||
<view class="blur-bg w-full h-full abs-lt" :style="[headerStyle]"></view>
|
||||
<view class="w-full h-full content" :style="[cardStyle]">
|
||||
<view class="info">
|
||||
<view class="flex-between-center">
|
||||
<view class="flex-y-center">
|
||||
<view class="w-140 h-140 rd-50-p111- relative" :class="userInfo.vip_status ? 'svip-border' : 'white-border'">
|
||||
<image class="w-full h-full rd-50-p111- block" :src="userInfo.author_image" mode="aspectFill"></image>
|
||||
<image class="vip-badge" src="@/static/img/svip_badge.png" v-show="userInfo.vip_status"></image>
|
||||
</view>
|
||||
<view class="pl-28 text--w111-fff">
|
||||
<view class="w-260 flex-y-center flex-wrap">
|
||||
<text class="fs-32 fw-500">{{userInfo.author}}</text>
|
||||
<view class="vip flex-center" v-show="userInfo.level_name">
|
||||
<text class="iconfont icon-huiyuandengji"></text>
|
||||
V{{userInfo.level_name}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="fs-24 pt-22">ID:{{userInfo.relation_id}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="flex-y-center">
|
||||
<view class="w-154 h-58 rd-30rpx flex-center fs-24 text--w111-fff bg-white-01"
|
||||
v-if="userInfo.is_self" @tap="authTo('/pages/discover/discoverCreate/index')">
|
||||
<text class="iconfont icon-ic_edit fs-26"></text>
|
||||
<text class="pl-8">去发布</text>
|
||||
|
||||
</view>
|
||||
<view v-else class="w-124 h-58 rd-30rpx flex-center fs-24 text--w111-fff bg-white-01"
|
||||
@tap="followChange">
|
||||
<text v-show="!userInfo.is_follow" class="iconfont icon-ic_increase fs-24"></text>
|
||||
<text>{{userInfo.is_follow ? '已关注' : '关注'}}</text>
|
||||
</view>
|
||||
<view class="w-58 h-58 rd-50-p111- ml-12 text--w111-fff bg-white-01 flex-center"
|
||||
:class="{'msg-icon': is_view == 0}" v-if="userInfo.is_self" @tap="authTo('/pages/discover/discoverMessage/index')">
|
||||
<text class="iconfont icon-ic_message2 w-32"></text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="fs-26 text--w111-fff lh-40rpx space-line user-desc mt-20">
|
||||
<text v-show="userInfo.desc">{{userInfo.desc}} </text>
|
||||
<text v-show="!userInfo.desc">此人很神秘，什么也没有留下～</text>
|
||||
<text class="iconfont icon-ic_edit fs-26" v-if="userInfo.is_self" @tap="toggleModal"></text>
|
||||
</view>
|
||||
<view class="mt-48 px-28 flex-between-center text--w111-fff">
|
||||
<view class="text-center" v-for="(item,index) in infoList" :key="index"
|
||||
@tap="userTo('/pages/discover/discoverFollow/index?type=' + index)">
|
||||
<view class="fs-30">{{item.count}}</view>
|
||||
<view class="pt-10 fs-24">{{item.name}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="h-56"></view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="list-box">
|
||||
<view class="list-tab flex-between-center relative" :class="showSearch ? 'pt-28' : 'pt-42'" v-if="userInfo.is_self">
|
||||
<text v-show="!showSearch"></text>
|
||||
<view class="flex-y-center fs-34 text--w111-999 center-tabs" v-show="!showSearch">
|
||||
<view :class="{'active-tab': active == 0}" @tap="changeTab(0)">作品</view>
|
||||
<view class="ml-66" :class="{'active-tab': active == 1}" @tap="changeTab(1)">赞过</view>
|
||||
</view>
|
||||
<view class="w-608 h-58 rd-30rpx bg--w111-f1f1f1 flex-y-center ml-12 pl-20" v-show="showSearch">
|
||||
<text class="iconfont icon-ic_search fs-30 text--w111-999"></text>
|
||||
<input type="text" v-model="params.keyword" placeholder="搜索笔记/用户/商品" @confirm="searchSubmit"
|
||||
class="flex-1 pl-14 fs-24" />
|
||||
</view>
|
||||
<text v-show="!showSearch && !params.keyword" class="iconfont icon-ic_search fs-40 pr-10" @tap="openSearch"></text>
|
||||
<text v-show="showSearch && params.keyword" class="fs-26 text--w111-999 pr-10" @tap="searchSubmit">搜索</text>
|
||||
<text v-show="showSearch && !params.keyword" class="fs-26 text--w111-999 pr-10" @tap="reset">取消</text>
|
||||
</view>
|
||||
<view class="list-tab" v-else></view>
|
||||
<view class="pt-20 pl-20 pr-20 bg--w111-f5f5f5" v-show="contentList.length">
|
||||
<waterfallsFlow :wfList="contentList" isSelf @onFlowLike="flowLike"></waterfallsFlow>
|
||||
</view>
|
||||
<view class="px-20 bg--w111-f5f5f5" v-show="!contentList.length">
|
||||
<emptyPage title="暂无内容～"></emptyPage>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 确认框 -->
|
||||
<tui-modal :show="showModal" maskClosable custom @cancel="toggleModal">
|
||||
<view class="tui-modal-custom">
|
||||
<view class="fs-32 fw-500 lh-44rpx text-center">编辑简介</view>
|
||||
<view class="mt-24 bg--w111-f5f5f5 rd-16rpx p-30rpx h-342" @tap="openFocus">
|
||||
<textarea class="w-full fs-26"
|
||||
ref="myTextarea"
|
||||
v-model="userInfo.desc"
|
||||
auto-height
|
||||
:focus="focus"
|
||||
wrap-style="wrap"
|
||||
:always-embed="true"
|
||||
:adjust-position="true"
|
||||
cursor-spacing="85rpx"
|
||||
:maxlength="50"
|
||||
name="desc" />
|
||||
</view>
|
||||
<view class="flex-between-center mt-40">
|
||||
<view class="w-244 h-72 rd-36rpx flex-center fs-26 font-num close-btn" @tap="toggleModal">取消</view>
|
||||
<view class="w-244 h-72 rd-36rpx flex-center bg-color text--w111-fff fs-26" @tap="saveDesc">保存</view>
|
||||
</view>
|
||||
</view>
|
||||
</tui-modal>
|
||||
<!-- 确认框 -->
|
||||
<tuiModal
|
||||
:show="showFollow"
|
||||
title="确认取消关注"
|
||||
:maskClosable="false"
|
||||
@click="handleClick"></tuiModal>
|
||||
<home></home>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
let sysHeight = uni.getWindowInfo().statusBarHeight;
|
||||
import colors from "@/mixins/color";
|
||||
import emptyPage from '@/components/emptyPage.vue';
|
||||
import NavBar from "@/components/NavBar.vue";
|
||||
import waterfallsFlow from "@/components/discoverWaterfall/WaterfallsFlow.vue";
|
||||
import tuiModal from "@/components/tui-modal/index.vue";
|
||||
import {
|
||||
communityListApi,
|
||||
communityUserInfoApi,
|
||||
communityUpdateDescApi,
|
||||
communitySetInsterestApi,
|
||||
communityLikeListApi
|
||||
} from "@/api/community.js"
|
||||
import {serviceRecord} from '@/api/user.js';
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
sysHeight,
|
||||
pageScrollStatus:false,
|
||||
id:0,
|
||||
params:{
|
||||
page:1,
|
||||
limit:20,
|
||||
topic_id:'', //话题
|
||||
keyword:'',
|
||||
is_interest:0, //是否关注
|
||||
relation_id:'',
|
||||
},
|
||||
infoList:[
|
||||
{name:'关注',count:'0'},
|
||||
{name:'好友',count:'0'},
|
||||
{name:'粉丝',count:'0'},
|
||||
{name:'获赞',count:'0'},
|
||||
],
|
||||
active:0,
|
||||
contentList:[],
|
||||
userInfo:{},
|
||||
showSearch:false,
|
||||
showModal:false,
|
||||
showFollow:false,
|
||||
focus:false,
|
||||
is_view: 1
|
||||
};
|
||||
},
|
||||
mixins: [colors],
|
||||
components:{ emptyPage, NavBar, waterfallsFlow, tuiModal },
|
||||
computed:{
|
||||
headerStyle(){
|
||||
return {
|
||||
// 'height': 552 + (this.sysHeight * 2) + 'rpx',
|
||||
'background-image':`url(${this.userInfo.author_image})`
|
||||
}
|
||||
},
|
||||
cardStyle(){
|
||||
return {
|
||||
'padding-top':40 + this.sysHeight + 'px',
|
||||
}
|
||||
}
|
||||
},
|
||||
provide() {
|
||||
return {
|
||||
flowLike: this.flowLike
|
||||
}
|
||||
},
|
||||
onPageScroll(object) {
|
||||
if (object.scrollTop > 130) {
|
||||
this.pageScrollStatus = true;
|
||||
} else if (object.scrollTop < 130) {
|
||||
this.pageScrollStatus = false;
|
||||
}
|
||||
uni.$emit('scroll');
|
||||
},
|
||||
onReachBottom() {
|
||||
this.getList();
|
||||
},
|
||||
onLoad(options) {
|
||||
this.id = options.id;
|
||||
this.getList();
|
||||
},
|
||||
onShow() {
|
||||
this.getUserInfo();
|
||||
},
|
||||
methods:{
|
||||
openFocus(){
|
||||
this.focus = true;
|
||||
},
|
||||
changeTab(val){
|
||||
if(this.active == val) return
|
||||
this.active = val;
|
||||
this.loading = false;
|
||||
this.contentList = [];
|
||||
this.params.page = 1;
|
||||
val == 1 ? this.getLike() : this.getList()
|
||||
},
|
||||
getList(){
|
||||
if (this.loading) return;
|
||||
this.loading = true;
|
||||
this.$set(this.params,'relation_id',this.id);
|
||||
communityListApi(this.params).then(res=>{
|
||||
let list = res.data;
|
||||
let loading = list.length < this.params.limit;
|
||||
this.contentList = this.contentList.concat(list);
|
||||
this.params.page++;
|
||||
this.loading = loading;
|
||||
}).catch(err => {
|
||||
return this.$util.Tips({
|
||||
title: err
|
||||
});
|
||||
});
|
||||
},
|
||||
getLike(){
|
||||
if (this.loading) return;
|
||||
this.loading = true;
|
||||
communityLikeListApi().then(res=>{
|
||||
let list = res.data.list;
|
||||
let loading = list.length < this.params.limit;
|
||||
this.contentList = this.contentList.concat(list);
|
||||
this.params.page++;
|
||||
this.loading = loading;
|
||||
}).catch(err => {
|
||||
return this.$util.Tips({
|
||||
title: err
|
||||
});
|
||||
});
|
||||
},
|
||||
getUserInfo(){
|
||||
communityUserInfoApi(this.id).then(res=>{
|
||||
this.userInfo = res.data;
|
||||
this.infoList[0].count = res.data.follow_num;
|
||||
this.infoList[1].count = res.data.friend_count;
|
||||
this.infoList[2].count = res.data.fans_num;
|
||||
this.infoList[3].count = res.data.like_num;
|
||||
serviceRecord({page: 1,limit: 1}).then(res => {
|
||||
this.is_view = res.data.community.is_viewed;
|
||||
})
|
||||
}).catch(err => {
|
||||
return this.$util.Tips({
|
||||
title: err
|
||||
},{
|
||||
tab: 3
|
||||
});
|
||||
});
|
||||
},
|
||||
userTo(url){
|
||||
if(this.userInfo.is_self){
|
||||
if(url == '/pages/discover/discoverFollow/index?type=3') return
|
||||
this.authTo(url);
|
||||
}
|
||||
},
|
||||
authTo(url){
|
||||
uni.navigateTo({
|
||||
url
|
||||
})
|
||||
},
|
||||
openSearch(){
|
||||
this.showSearch = !this.showSearch;
|
||||
if(!this.showSearch && this.params.keyword){
|
||||
this.params.keyword = '';
|
||||
this.params.page = 1;
|
||||
this.contentList = [];
|
||||
this.loading = false;
|
||||
this.getList();
|
||||
}
|
||||
},
|
||||
searchSubmit(){
|
||||
this.params.page = 1;
|
||||
this.contentList = [];
|
||||
this.loading = false;
|
||||
this.getList();
|
||||
},
|
||||
reset(){
|
||||
this.params.keyword = '';
|
||||
this.showSearch = false;
|
||||
// this.searchSubmit();
|
||||
},
|
||||
toggleModal(){
|
||||
this.showModal = !this.showModal;
|
||||
},
|
||||
saveDesc(){
|
||||
if(this.userInfo.desc == '') return this.$util.Tips({
|
||||
title: '请输入介绍'
|
||||
});
|
||||
communityUpdateDescApi({desc:this.userInfo.desc}).then(res=>{
|
||||
this.showModal = false;
|
||||
this.getUserInfo();
|
||||
uni.showToast({
|
||||
title:res.msg,
|
||||
icon:'none'
|
||||
})
|
||||
}).catch(err=>{
|
||||
return this.$util.Tips({
|
||||
title: err
|
||||
});
|
||||
})
|
||||
},
|
||||
followChange(){
|
||||
if(this.userInfo.is_follow == 0){
|
||||
communitySetInsterestApi(this.id,{status:1}).then(res=>{
|
||||
this.userInfo.is_follow = 1;
|
||||
return this.$util.Tips({
|
||||
title: res.msg
|
||||
});
|
||||
}).catch(err => {
|
||||
return this.$util.Tips({
|
||||
title: err
|
||||
});
|
||||
});
|
||||
}else{
|
||||
this.showFollow = true;
|
||||
}
|
||||
},
|
||||
handleClick(e){
|
||||
let index = e.index;
|
||||
let that = this;
|
||||
if(index == 1){
|
||||
communitySetInsterestApi(this.id,{status:0}).then(res=>{
|
||||
this.userInfo.is_follow = 0;
|
||||
this.showFollow = false;
|
||||
return this.$util.Tips({
|
||||
title: res.msg
|
||||
});
|
||||
|
||||
}).catch(err => {
|
||||
this.showFollow = false;
|
||||
return this.$util.Tips({
|
||||
title: err
|
||||
});
|
||||
});
|
||||
}else{
|
||||
this.showFollow = false;
|
||||
}
|
||||
},
|
||||
flowLike(data){
|
||||
let index = this.contentList.findIndex(item=> data.id == item.id);
|
||||
this.contentList[index].is_like = data.status;
|
||||
if(data.status == 1){
|
||||
this.contentList[index].like_num++;
|
||||
}else{
|
||||
this.contentList[index].like_num--;
|
||||
}
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.info-card{
|
||||
background-size: cover;
|
||||
}
|
||||
.blur-bg{
|
||||
filter: blur(50rpx);
|
||||
background-size: cover;
|
||||
}
|
||||
.content{
|
||||
position: relative; /* 设置为相对定位 */
|
||||
z-index: 2; /* 设置更高的层级以覆盖背景 */
|
||||
filter: blur(0);
|
||||
background: linear-gradient(180deg, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.1) 39%, rgba(0, 0, 0, 0.7) 100%);
|
||||
}
|
||||
.info{
|
||||
padding: 38rpx 34rpx 0 30rpx;
|
||||
}
|
||||
.bg-white-01{
|
||||
background-color:rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
.bg--w111-f1f1f1{
|
||||
background-color: #f1f1f1;
|
||||
}
|
||||
.border-white{
|
||||
border: 1rpx solid #fff;
|
||||
}
|
||||
.list-box{
|
||||
position: relative;
|
||||
left: 0;
|
||||
top: -24rpx;
|
||||
border-radius: 24rpx 24rpx 0 0;
|
||||
z-index: 90;
|
||||
}
|
||||
.list-tab{
|
||||
background: linear-gradient( 180deg, #FFFFFF 0%, #F5F5F5 100%);
|
||||
padding-left: 20rpx;
|
||||
padding-right: 20rpx;
|
||||
padding-bottom: 24rpx;
|
||||
border-radius: 24rpx 24rpx 0 0;
|
||||
}
|
||||
.center-tabs{
|
||||
position: absolute;
|
||||
top: 38rpx;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
.active-tab{
|
||||
font-weight: 500;
|
||||
color: #333;
|
||||
position: relative;
|
||||
&:after{
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: -14rpx;
|
||||
width: 64rpx;
|
||||
height: 5rpx;
|
||||
background: var(--view-theme);
|
||||
border-radius: 4rpx;
|
||||
}
|
||||
}
|
||||
.vip{
|
||||
width: 64rpx;
|
||||
height: 26rpx;
|
||||
background: #FEF0D9;
|
||||
border: 1px solid #FACC7D;
|
||||
border-radius: 50rpx;
|
||||
font-size: 18rpx;
|
||||
font-weight: 500;
|
||||
color: #DFA541;
|
||||
margin-left: 10rpx;
|
||||
.iconfont {
|
||||
font-size: 16rpx;
|
||||
margin-right: 4rpx;
|
||||
}
|
||||
}
|
||||
.vip-badge{
|
||||
position: absolute;
|
||||
top: -20rpx;
|
||||
right: 0;
|
||||
width: 48rpx;
|
||||
height: 46rpx;
|
||||
}
|
||||
.svip-border{
|
||||
border: 2rpx solid #F1BB0D;
|
||||
}
|
||||
.tui-modal-custom{
|
||||
height: 530rpx;
|
||||
.h-342{
|
||||
height: 342rpx;
|
||||
}
|
||||
}
|
||||
.white-border{
|
||||
border: 2rpx solid #FFFFFF;
|
||||
}
|
||||
.modal-btn{
|
||||
width: 244rpx;
|
||||
height: 72rpx;
|
||||
border-radius: 36rpx;
|
||||
}
|
||||
.close-btn{
|
||||
border: 1rpx solid var(--view-theme);
|
||||
}
|
||||
.confirm-btn{
|
||||
background-color: var(--view-theme);
|
||||
}
|
||||
.msg-icon{
|
||||
position: relative;
|
||||
&:after{
|
||||
content: '';
|
||||
position: absolute;
|
||||
right: 8rpx;
|
||||
top: 10rpx;
|
||||
width: 12rpx;
|
||||
height: 12rpx;
|
||||
border-radius: 6rpx;
|
||||
background-color: #e93323;
|
||||
}
|
||||
}
|
||||
.user-desc{
|
||||
max-height: 200rpx;
|
||||
overflow-y: scroll;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user