2 lines
5.3 KiB
JavaScript
2 lines
5.3 KiB
JavaScript
"use strict";(self["webpackChunknewfront"]=self["webpackChunknewfront"]||[]).push([[5],{2005:function(e,s,a){a.r(s),a.d(s,{default:function(){return g}});var l=a(6768),t=a(4232);const i={class:"user-demo"},n={class:"section"},r={class:"example"},d={class:"section"},o={class:"users-grid"},c={class:"card-content"};function u(e,s,a,u,v,f){const k=(0,l.g2)("UserMeta");return(0,l.uX)(),(0,l.CE)("div",i,[s[3]||(s[3]=(0,l.Lk)("h1",null,"用户信息组件示例",-1)),(0,l.Lk)("div",n,[s[0]||(s[0]=(0,l.Lk)("h2",null,"基本使用",-1)),(0,l.Lk)("div",r,[(0,l.bF)(k,{id:1})])]),(0,l.Lk)("div",d,[s[2]||(s[2]=(0,l.Lk)("h2",null,"多个用户展示",-1)),(0,l.Lk)("div",o,[((0,l.uX)(),(0,l.CE)(l.FK,null,(0,l.pI)([1,2,3,11],(e=>(0,l.Lk)("div",{key:e,class:"user-card"},[(0,l.bF)(k,{id:e},null,8,["id"]),(0,l.Lk)("div",c,[(0,l.Lk)("p",null,"这是用户ID为 "+(0,t.v_)(e)+" 的内容区域",1),s[1]||(s[1]=(0,l.Lk)("p",{class:"hint"},"将鼠标悬停在用户信息上查看详情",-1))])]))),64))])])])}var v=a(8701),f={name:"UserDemo",components:{UserMeta:v.A}},k=a(1241);const h=(0,k.A)(f,[["render",u],["__scopeId","data-v-0801b4ba"]]);var g=h},8701:function(e,s,a){a.d(s,{A:function(){return W}});var l=a(6768),t=a(4232),i=a(5130);const n={class:"user-meta"},r={class:"avatar-wrapper"},d=["src"],o={key:0,class:"avatar-loading"},c={class:"user-name"},u={class:"user-badges"},v=["title"],f=["title"],k={key:2,class:"badge medal"},h={class:"card-container"},g={class:"detail-header"},L=["src"],m={class:"detail-right"},p={class:"detail-name"},w={class:"user-badges"},I=["title"],b=["title"],C={key:2,class:"badge medal"},y={key:0,class:"user-sign"},E={class:"sign-text"},X={class:"user-stats"},U={class:"stat-item"},_={class:"stat-value"},D={class:"stat-item"},Q={class:"stat-value"},F={class:"card-footer"};function A(e,s,a,A,M,x){return(0,l.uX)(),(0,l.CE)("div",n,[(0,l.Lk)("div",{class:"user-basic",onMouseenter:s[0]||(s[0]=e=>M.showDetail=!0)},[(0,l.Lk)("div",r,[(0,l.Lk)("img",{src:M.userInfo.avatarUrl,alt:"用户头像",class:"avatar"},null,8,d),M.loading?((0,l.uX)(),(0,l.CE)("div",o,s[4]||(s[4]=[(0,l.Lk)("div",{class:"loading-spinner"},null,-1)]))):(0,l.Q3)("",!0)]),(0,l.Lk)("div",c,(0,t.v_)(M.userInfo.nickname),1),(0,l.Lk)("div",u,[M.userInfo.verified?((0,l.uX)(),(0,l.CE)("span",{key:0,class:"badge verified",title:M.userInfo.verified},"认证",8,v)):(0,l.Q3)("",!0),M.userInfo.invited?((0,l.uX)(),(0,l.CE)("span",{key:1,class:"badge invited",title:M.userInfo.invited},"特邀",8,f)):(0,l.Q3)("",!0),1===M.userInfo.medal?((0,l.uX)(),(0,l.CE)("span",k,"小站奖章")):(0,l.Q3)("",!0)])],32),(0,l.bF)(i.eB,{name:"detail-fade"},{default:(0,l.k6)((()=>[M.showDetail?((0,l.uX)(),(0,l.CE)("div",{key:0,class:"user-detail",onMouseenter:s[2]||(s[2]=e=>M.showDetail=!0),onMouseleave:s[3]||(s[3]=e=>M.showDetail=!1)},[(0,l.Lk)("div",h,[(0,l.Lk)("div",g,[s[5]||(s[5]=(0,l.Lk)("div",{class:"header-bg"},null,-1)),(0,l.Lk)("img",{src:M.userInfo.avatarUrl,alt:"用户头像",class:"detail-avatar"},null,8,L),(0,l.Lk)("div",m,[(0,l.Lk)("div",p,(0,t.v_)(M.userInfo.nickname),1),(0,l.Lk)("div",w,[M.userInfo.verified?((0,l.uX)(),(0,l.CE)("span",{key:0,class:"badge verified",title:M.userInfo.verified},"认证",8,I)):(0,l.Q3)("",!0),M.userInfo.invited?((0,l.uX)(),(0,l.CE)("span",{key:1,class:"badge invited",title:M.userInfo.invited},"特邀",8,b)):(0,l.Q3)("",!0),1===M.userInfo.medal?((0,l.uX)(),(0,l.CE)("span",C,"小站奖章")):(0,l.Q3)("",!0)])])]),M.userInfo.sign?((0,l.uX)(),(0,l.CE)("div",y,[s[6]||(s[6]=(0,l.Lk)("div",{class:"sign-icon"},"✍️",-1)),(0,l.Lk)("div",E,(0,t.v_)(M.userInfo.sign),1)])):(0,l.Q3)("",!0),(0,l.Lk)("div",X,[(0,l.Lk)("div",U,[(0,l.Lk)("div",_,(0,t.v_)(M.userInfo.follower),1),s[7]||(s[7]=(0,l.Lk)("div",{class:"stat-label"},"粉丝",-1))]),s[9]||(s[9]=(0,l.Lk)("div",{class:"stat-separator"},null,-1)),(0,l.Lk)("div",D,[(0,l.Lk)("div",Q,(0,t.v_)(M.userInfo.following),1),s[8]||(s[8]=(0,l.Lk)("div",{class:"stat-label"},"关注",-1))])]),(0,l.Lk)("div",F,[(0,l.Lk)("button",{class:"follow-btn",onClick:s[1]||(s[1]=(...e)=>x.handleFollow&&x.handleFollow(...e))},"+ 关注")])])],32)):(0,l.Q3)("",!0)])),_:1})])}var M=a(4373),x=a(6253),O={name:"UserMeta",props:{id:{type:[String,Number],required:!0}},data(){return{userInfo:{nickname:"默认用户",verified:null,invited:null,medal:0,avatarUrl:"https://download.东北大学.com/avatar/default.png",follower:0,following:0,sign:"Hello World!"},showDetail:!1,loading:!1,error:null}},created(){this.fetchUserInfo()},mounted(){document.addEventListener("click",this.handleClickOutside)},beforeUnmount(){document.removeEventListener("click",this.handleClickOutside)},watch:{id(){this.fetchUserInfo()}},methods:{async fetchUserInfo(){this.loading=!0;try{const e=await M.A.get(`https://userlogin.xn--xhq44jb2fzpc.com/submission/get-author-info?id=${this.id}`);e.data={...e.data,follower:e.data.follower||0,following:e.data.following||0,sign:e.data.sign||"Hello World!"},this.userInfo=e.data}catch(e){this.error="获取用户信息失败",console.error("获取用户信息失败:",e)}finally{this.loading=!1}},handleClickOutside(e){const s=this.$el;this.showDetail&&!s.contains(e.target)&&(this.showDetail=!1)},handleFollow(){x.A.alert("关注功能暂未开放，敬请期待","提示").then((()=>{})).catch((()=>{}))}}},q=a(1241);const H=(0,q.A)(O,[["render",A],["__scopeId","data-v-9156a04c"]]);var W=H}}]);
|
|
//# sourceMappingURL=5.56366bd5.js.map
|