页面样式美化

2026-08-22 00:23:44 +08:00 · 2026-01-29 21:15:15 +08:00
parent 58249e784b
commit 1d26366fcb
90 changed files with 154 additions and 1 deletions
@@ -1 +1 @@
-<!doctype html><html lang=""><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1"><link rel="icon" href="/logo.png"><link rel="apple-touch-icon" href="/logo.png"><link rel="mask-icon" href="/logo.png" color="#f4b400"><meta name="description" content="Sanyue ImgHub - A modern file hosting platform"><meta name="keywords" content="Sanyue, ImgHub, file hosting, image hosting, cloud storage"><meta name="author" content="SanyueQi"><title>Sanyue ImgHub</title><script defer="defer" src="/js/chunk-vendors.92518219.js"></script><script defer="defer" src="/js/app.c84f6cf6.js"></script><link href="/css/chunk-vendors.4363ed49.css" rel="stylesheet"><link href="/css/app.7feab2de.css" rel="stylesheet"></head><body><noscript><strong>We're sorry but sanyue_imghub doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id="app"></div></body></html>
+<!doctype html><html lang=""><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1"><link rel="icon" href="/logo.png"><link rel="apple-touch-icon" href="/logo.png"><link rel="mask-icon" href="/logo.png" color="#f4b400"><meta name="description" content="Sanyue ImgHub - A modern file hosting platform"><meta name="keywords" content="Sanyue, ImgHub, file hosting, image hosting, cloud storage"><meta name="author" content="SanyueQi"><title>Sanyue ImgHub</title><script defer="defer" src="/js/chunk-vendors.92518219.js"></script><script defer="defer" src="/js/app.fa7ef1c9.js"></script><link href="/css/chunk-vendors.4363ed49.css" rel="stylesheet"><link href="/css/app.82f041ea.css" rel="stylesheet"></head><body><noscript><strong>We're sorry but sanyue_imghub doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id="app"></div></body></html>
@@ -0,0 +1,2 @@
+"use strict";(self["webpackChunksanyue_imghub"]=self["webpackChunksanyue_imghub"]||[]).push([[100],{1823:function(e,t,i){i.d(t,{A:function(){return F}});var s=i(6975),n=i(47),a=(i(5331),i(9648),i(9623)),o=(i(6711),i(813)),l=(i(4896),i(732)),r=i(4453),d=i(6768),u=i(4232),c=i(5130);const h={class:"login-container"},p={class:"login-title",tabindex:"0"},g={class:"input-wrapper"},m={key:0,class:"loading-ring"},f={key:1};function b(e,t,i,b,y,k){const w=r.A,L=l.A,v=o.tk,F=a.WK,C=n.S2,A=s.A;return(0,d.uX)(),(0,d.CE)("div",{class:(0,u.C4)(["login",{"is-focused":y.isFocused}])},[(0,d.bF)(w,{class:"toggle-dark"}),(0,d.bF)(L),(0,d.Lk)("div",h,[(0,d.Lk)("h1",p,(0,u.v_)(i.title),1),((0,d.uX)(!0),(0,d.CE)(d.FK,null,(0,d.pI)(i.fields,(e,t)=>((0,d.uX)(),(0,d.CE)("div",{key:e.key,class:"input-container"},[(0,d.Lk)("label",{class:"input-name",ref_for:!0,ref:`inputLabel${t}`,style:(0,u.Tr)({"--underline-width":y.labelUnderlineWidths[t]+"px"})},(0,u.v_)(e.label),5),(0,d.Lk)("div",g,[(0,d.bF)(F,{modelValue:y.formData[e.key],"onUpdate:modelValue":t=>y.formData[e.key]=t,placeholder:e.placeholder,type:e.type||"text","show-password":e.showPassword,class:"password-input",onKeyup:(0,c.jR)(k.handleSubmit,["enter","native"]),onFocus:k.handleInputFocus,onBlur:k.handleInputBlur},(0,d.eX)({_:2},[e.icon?{name:"prefix",fn:(0,d.k6)(()=>[(0,d.bF)(v,{class:"el-input__icon"},{default:(0,d.k6)(()=>[((0,d.uX)(),(0,d.Wv)((0,d.$y)(e.icon)))]),_:2},1024)]),key:"0"}:void 0]),1032,["modelValue","onUpdate:modelValue","placeholder","type","show-password","onKeyup","onFocus","onBlur"])])]))),128)),(0,d.bF)(C,{class:(0,u.C4)(["submit",{"is-loading":i.loading}]),type:"primary",onClick:k.handleSubmit,disabled:i.loading},{default:(0,d.k6)(()=>[i.loading?((0,d.uX)(),(0,d.CE)("div",m)):((0,d.uX)(),(0,d.CE)("span",f,(0,u.v_)(i.submitText),1))]),_:1},8,["class","onClick","disabled"])]),(0,d.bF)(A,{class:"footer"})],2)}i(8111),i(7588);var y=i(8401),k=i(8903),w={name:"BaseLogin",mixins:[k.A],props:{title:{type:String,required:!0},fields:{type:Array,required:!0},submitText:{type:String,default:"登录"},backgroundKey:{type:String,required:!0},isAdmin:{type:Boolean,default:!1},loading:{type:Boolean,default:!1}},data(){return{formData:{},labelUnderlineWidths:[],isFocused:!1}},computed:{...(0,y.L8)(["userConfig"])},watch:{fields:{handler(){this.$nextTick(()=>{this.calculateLabelWidths()})},deep:!0}},components:{Footer:s.A,ToggleDark:r.A,Logo:l.A},mounted(){this.initFormData(),this.initializeBackground(this.backgroundKey,".login",!this.isAdmin,!0),this.$nextTick(()=>{this.calculateLabelWidths()})},methods:{initFormData(){const e={};this.fields.forEach(t=>{e[t.key]=""}),this.formData=e,this.labelUnderlineWidths=new Array(this.fields.length).fill(0)},calculateLabelWidths(){this.$nextTick(()=>{this.fields.forEach((e,t)=>{const i=this.$refs[`inputLabel${t}`];if(i&&i[0]){const s=document.createElement("canvas"),n=s.getContext("2d"),a=i[0],o=window.getComputedStyle(a);n.font=`${o.fontWeight} ${o.fontSize} ${o.fontFamily}`;const l=n.measureText(e.label).width;this.labelUnderlineWidths[t]=Math.ceil(l)+3}})})},handleSubmit(){this.loading||this.$emit("submit",{...this.formData})},handleInputFocus(e){this.isFocused=!0;const t=e.target.closest(".input-container");if(t){const e=t.querySelector(".input-wrapper");e&&e.classList.add("focused")}},handleInputBlur(e){this.isFocused=!1;const t=e.target.closest(".input-container");if(t){const e=t.querySelector(".input-wrapper");e&&e.classList.remove("focused")}}}},L=i(1241);const v=(0,L.A)(w,[["render",b],["__scopeId","data-v-c6b76020"]]);var F=v},2560:function(e,t,i){i.r(t),i.d(t,{default:function(){return p}});var s=i(1823),n=i(6768);function a(e,t,i,a,o,l){const r=s.A;return(0,n.uX)(),(0,n.Wv)(r,{title:l.loginTitle,fields:o.loginFields,"submit-text":"登录","background-key":"loginBkImg","is-admin":!1,loading:o.isLoading,onSubmit:l.handleLogin},null,8,["title","fields","loading","onSubmit"])}i(4114);var o=i(4570),l=i.n(o),r=i(457),d=i(8401),u={data(){return{isLoading:!1,loginFields:[{key:"password",label:"密码",placeholder:"请输入认证码",type:"password",showPassword:!0,icon:"Lock"}]}},computed:{...(0,d.L8)(["userConfig"]),ownerName(){return this.userConfig?.ownerName||"Sanyue"},loginTitle(){return`登录到 ${this.ownerName} 图床`}},components:{BaseLogin:s.A},methods:{async handleLogin(e){const{password:t}=e,i=""===t?"unset":t;this.isLoading=!0;const s=new Promise(e=>setTimeout(e,500)),n=r.A.post("/api/login",{authCode:t}).then(e=>({res:e})).catch(e=>({err:e}));try{const[e]=await Promise.all([n,s]);e.res&&200===e.res.status?(l().set("authCode",i,"14d"),this.$router.push("/"),this.$message.success("登录成功")):(this.isLoading=!1,this.$message.error("登录失败，请检查密码是否正确"))}catch(a){this.isLoading=!1,this.$message.error("系统错误")}}}},c=i(1241);const h=(0,c.A)(u,[["render",a]]);var p=h}}]);
+//# sourceMappingURL=100.d7a2e066.js.map
@@ -0,0 +1,2 @@
+"use strict";(self["webpackChunksanyue_imghub"]=self["webpackChunksanyue_imghub"]||[]).push([[214],{1823:function(e,t,s){s.d(t,{A:function(){return F}});var i=s(6975),n=s(47),a=(s(5331),s(9648),s(9623)),o=(s(6711),s(813)),l=(s(4896),s(732)),r=s(4453),d=s(6768),u=s(4232),c=s(5130);const h={class:"login-container"},p={class:"login-title",tabindex:"0"},m={class:"input-wrapper"},g={key:0,class:"loading-ring"},f={key:1};function b(e,t,s,b,y,k){const w=r.A,L=l.A,v=o.tk,F=a.WK,$=n.S2,A=i.A;return(0,d.uX)(),(0,d.CE)("div",{class:(0,u.C4)(["login",{"is-focused":y.isFocused}])},[(0,d.bF)(w,{class:"toggle-dark"}),(0,d.bF)(L),(0,d.Lk)("div",h,[(0,d.Lk)("h1",p,(0,u.v_)(s.title),1),((0,d.uX)(!0),(0,d.CE)(d.FK,null,(0,d.pI)(s.fields,(e,t)=>((0,d.uX)(),(0,d.CE)("div",{key:e.key,class:"input-container"},[(0,d.Lk)("label",{class:"input-name",ref_for:!0,ref:`inputLabel${t}`,style:(0,u.Tr)({"--underline-width":y.labelUnderlineWidths[t]+"px"})},(0,u.v_)(e.label),5),(0,d.Lk)("div",m,[(0,d.bF)(F,{modelValue:y.formData[e.key],"onUpdate:modelValue":t=>y.formData[e.key]=t,placeholder:e.placeholder,type:e.type||"text","show-password":e.showPassword,class:"password-input",onKeyup:(0,c.jR)(k.handleSubmit,["enter","native"]),onFocus:k.handleInputFocus,onBlur:k.handleInputBlur},(0,d.eX)({_:2},[e.icon?{name:"prefix",fn:(0,d.k6)(()=>[(0,d.bF)(v,{class:"el-input__icon"},{default:(0,d.k6)(()=>[((0,d.uX)(),(0,d.Wv)((0,d.$y)(e.icon)))]),_:2},1024)]),key:"0"}:void 0]),1032,["modelValue","onUpdate:modelValue","placeholder","type","show-password","onKeyup","onFocus","onBlur"])])]))),128)),(0,d.bF)($,{class:(0,u.C4)(["submit",{"is-loading":s.loading}]),type:"primary",onClick:k.handleSubmit,disabled:s.loading},{default:(0,d.k6)(()=>[s.loading?((0,d.uX)(),(0,d.CE)("div",g)):((0,d.uX)(),(0,d.CE)("span",f,(0,u.v_)(s.submitText),1))]),_:1},8,["class","onClick","disabled"])]),(0,d.bF)(A,{class:"footer"})],2)}s(8111),s(7588);var y=s(8401),k=s(8903),w={name:"BaseLogin",mixins:[k.A],props:{title:{type:String,required:!0},fields:{type:Array,required:!0},submitText:{type:String,default:"登录"},backgroundKey:{type:String,required:!0},isAdmin:{type:Boolean,default:!1},loading:{type:Boolean,default:!1}},data(){return{formData:{},labelUnderlineWidths:[],isFocused:!1}},computed:{...(0,y.L8)(["userConfig"])},watch:{fields:{handler(){this.$nextTick(()=>{this.calculateLabelWidths()})},deep:!0}},components:{Footer:i.A,ToggleDark:r.A,Logo:l.A},mounted(){this.initFormData(),this.initializeBackground(this.backgroundKey,".login",!this.isAdmin,!0),this.$nextTick(()=>{this.calculateLabelWidths()})},methods:{initFormData(){const e={};this.fields.forEach(t=>{e[t.key]=""}),this.formData=e,this.labelUnderlineWidths=new Array(this.fields.length).fill(0)},calculateLabelWidths(){this.$nextTick(()=>{this.fields.forEach((e,t)=>{const s=this.$refs[`inputLabel${t}`];if(s&&s[0]){const i=document.createElement("canvas"),n=i.getContext("2d"),a=s[0],o=window.getComputedStyle(a);n.font=`${o.fontWeight} ${o.fontSize} ${o.fontFamily}`;const l=n.measureText(e.label).width;this.labelUnderlineWidths[t]=Math.ceil(l)+3}})})},handleSubmit(){this.loading||this.$emit("submit",{...this.formData})},handleInputFocus(e){this.isFocused=!0;const t=e.target.closest(".input-container");if(t){const e=t.querySelector(".input-wrapper");e&&e.classList.add("focused")}},handleInputBlur(e){this.isFocused=!1;const t=e.target.closest(".input-container");if(t){const e=t.querySelector(".input-wrapper");e&&e.classList.remove("focused")}}}},L=s(1241);const v=(0,L.A)(w,[["render",b],["__scopeId","data-v-c6b76020"]]);var F=v},3950:function(e,t,s){s.r(t),s.d(t,{default:function(){return u}});var i=s(1823),n=s(6768);function a(e,t,s,a,o,l){const r=i.A;return(0,n.uX)(),(0,n.Wv)(r,{title:"管理端登录",fields:o.loginFields,"submit-text":"登录","background-key":"adminLoginBkImg","is-admin":!0,loading:o.isLoading,onSubmit:l.handleLogin},null,8,["fields","loading","onSubmit"])}s(4114),s(4979);var o=s(457),l={data(){return{isLoading:!1,loginFields:[{key:"username",label:"用户名",placeholder:"请输入用户名",type:"text",icon:"User"},{key:"password",label:"密码",placeholder:"请输入密码",type:"password",showPassword:!0,icon:"Lock"}]}},components:{BaseLogin:i.A},methods:{async handleLogin(e){const{username:t,password:s}=e,i=btoa(`${t}:${s}`);this.isLoading=!0;const n=new Promise(e=>setTimeout(e,1e3)),a=o.A.get("/api/manage/check",{headers:{Authorization:`Basic ${i}`},withCredentials:!0}).then(e=>({response:e})).catch(e=>({error:e}));try{const[e]=await Promise.all([a,n]);if(e.response&&200===e.response.status)this.$store.commit("setCredentials",i),this.$router.push("/dashboard");else{const t=e.error||new Error("Unknown error");this.isLoading=!1,t.response&&401===t.response.status?this.$message.error("用户名或密码错误"):this.$message.error("服务器错误")}}catch(l){this.isLoading=!1,this.$message.error("系统错误")}}}},r=s(1241);const d=(0,r.A)(l,[["render",a]]);var u=d}}]);
+//# sourceMappingURL=214.e7ecaacc.js.map