work/mvp/browser-extension/app/assets/HomeView-C5S1gwfg.js
2025-12-17 22:30:44 +08:00

2 lines
16 KiB
JavaScript
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

import{u as X,s as ee,a as se,c as x,b as re,T as W,m as ae,d as de,r as T,e as f,o as u,f as l,n as i,g as n,h as s,w as c,i as E,t as I,j as N,k as ce,l as J,F as M,p as q,q as ue,v as te,x as me,y as F,z as j,A as K,B as pe,C as ne,D as oe,E as ge,G as _e,H as fe,I as ke,J as ye,K as P,_ as ve,L as he,M as Y,N as Z}from"./index-C2he2kA3.js";const we="_container_2r5cm_1",Ce="_inner_2r5cm_7",be="_topRow_2r5cm_12",Se="_hero_2r5cm_18",xe="_heroNote_2r5cm_32",Te="_heroHeading_2r5cm_45",$e="_heroDescription_2r5cm_52",Ie="_heroActions_2r5cm_59",Le="_heroShortcut_2r5cm_66",Ae="_themeToggle_2r5cm_77",Re="_main_2r5cm_84",De="_section_2r5cm_89",Ee="_sectionContent_2r5cm_105",ze="_sectionHeader_2r5cm_111",Ve="_sectionTitle_2r5cm_123",Be="_sectionHint_2r5cm_130",He="_placeholder_2r5cm_135",y={container:we,inner:Ce,topRow:be,hero:Se,heroNote:xe,heroHeading:Te,heroDescription:$e,heroActions:Ie,heroShortcut:Le,themeToggle:Ae,main:Re,section:De,sectionContent:Ee,sectionHeader:ze,"view-switcher":"_view-switcher_2r5cm_119",sectionTitle:Ve,sectionHint:Be,placeholder:He},Ne={__name:"AppShell",props:{totalCount:{type:Number,default:0},shortcutLabel:{type:String,default:"Ctrl + K"}},emits:["open-search","create-link","import-data","import-browser-bookmarks","open-settings","view-change"],setup(g,{emit:A}){const t=A,k=X(),{state:r}=ee(k),{themeMode:p,cycleTheme:R}=se(),D=x({get:()=>r.value?.libraryView||"tag",set:b=>{k.updateSettings({libraryView:b}),t("view-change",b)}}),w=x(()=>{switch(p.value){case W.DARK:return de;case W.SYSTEM:return ae;default:return re}}),$=x(()=>{switch(p.value){case W.LIGHT:return"当前:浅色主题(点击切换)";case W.DARK:return"当前:深色主题(点击切换)";case W.SYSTEM:return"当前:跟随系统(点击切换)";default:return"切换主题"}});return(b,a)=>{const m=T("el-button"),d=T("el-tooltip"),e=T("el-empty"),o=T("el-radio-button"),v=T("el-radio-group");return u(),f("div",{class:i(n(y).container)},[l("div",{class:i(n(y).inner)},[l("div",{class:i(n(y).topRow)},[l("section",{class:i(n(y).hero),name:"hero"},[l("span",{class:i(n(y).heroNote)},"MVP 基础版",2),l("h1",{class:i(n(y).heroHeading)},"掌控你的网页书签",2),l("p",{class:i(n(y).heroDescription)}," 快速启动全局搜索,统一管理收藏链接,把日常必备的网页资源纳入一个高效的工作空间,配合筛选与快捷操作更有条理。 ",2),l("div",{class:i(n(y).heroActions)},[s(m,{type:"primary",size:"large",onClick:a[0]||(a[0]=_=>t("open-search"))},{default:c(()=>[E(" 打开搜索("+I(g.shortcutLabel)+" ",1)]),_:1}),s(m,{size:"large",onClick:a[1]||(a[1]=_=>t("create-link"))},{default:c(()=>[...a[6]||(a[6]=[E("新增书签",-1)])]),_:1}),s(m,{size:"large",text:"",onClick:a[2]||(a[2]=_=>t("import-data"))},{default:c(()=>[...a[7]||(a[7]=[E("导入数据",-1)])]),_:1}),s(m,{size:"large",text:"",onClick:a[3]||(a[3]=_=>t("import-browser-bookmarks"))},{default:c(()=>[...a[8]||(a[8]=[E("导入浏览器书签",-1)])]),_:1}),s(m,{size:"large",text:"",onClick:a[4]||(a[4]=_=>t("open-settings"))},{default:c(()=>[...a[9]||(a[9]=[E("偏好设置",-1)])]),_:1}),l("div",{class:i(n(y).themeToggle)},[s(d,{content:$.value,placement:"bottom"},{default:c(()=>[s(m,{size:"large",circle:"",onClick:n(R)},{default:c(()=>[(u(),N(ce(w.value)))]),_:1},8,["onClick"])]),_:1},8,["content"])],2)],2)],2),l("section",{class:i(n(y).section),name:"recent"},[l("header",{class:i(n(y).sectionHeader)},[l("h2",{class:i(n(y).sectionTitle)},"最近动态",2),l("span",{class:i(n(y).sectionHint)},"显示最近访问的链接与快捷操作。",2)],2),l("div",{class:i(n(y).sectionContent)},[J(b.$slots,"recent",{},()=>[l("div",{class:i(n(y).placeholder)},[s(e,{description:"暂无最近访问,先尝试新增一个书签吧。"})],2)])],2)],2)],2),l("main",{class:i(n(y).main)},[l("section",{class:i(n(y).section),name:"library"},[l("header",{class:i(n(y).sectionHeader)},[l("div",null,[l("h2",{class:i(n(y).sectionTitle)},"全部书签",2),l("span",{class:i(n(y).sectionHint)}," 当前本地保存 "+I(g.totalCount)+" 条记录。 ",3)]),s(v,{modelValue:D.value,"onUpdate:modelValue":a[5]||(a[5]=_=>D.value=_),size:"small",class:"view-switcher"},{default:c(()=>[s(o,{value:"tag"},{default:c(()=>[...a[10]||(a[10]=[E("标签视图",-1)])]),_:1}),s(o,{value:"all"},{default:c(()=>[...a[11]||(a[11]=[E("全部书签",-1)])]),_:1})]),_:1},8,["modelValue"])],2),J(b.$slots,"library",{},()=>[l("div",{class:i(n(y).placeholder)},[s(e,{description:"列表还是空的,可以导入或新增书签来填充。"})],2)])],2)],2)],2)],2)}}},We="_list_19vv1_1",Oe="_item_19vv1_6",Me="_icon_19vv1_23",qe="_info_19vv1_42",Ue="_title_19vv1_47",Ge="_meta_19vv1_54",Ke="_tags_19vv1_62",Pe="_tag_19vv1_62",B={list:We,item:Oe,icon:Me,info:qe,title:Ue,meta:Ge,tags:Ke,tag:Pe},Fe=["onClick","onKeyup"],je=["src"],Je={key:1},Ye={__name:"RecentLinks",props:{links:{type:Array,default:()=>[]}},emits:["open","edit"],setup(g,{emit:A}){const t=g,k=A,r=x(()=>t.links.slice(0,10));function p(w,$){if($)return $;try{const{origin:b}=new URL(w);return`https://t2.gstatic.com/faviconV2?client=SOCIAL&type=FAVICON&fallback_opts=TYPE,SIZE,URL&url=${encodeURIComponent(b)}&size=24`}catch{return""}}function R(w){return w?w[0]?.toUpperCase()??"B":"B"}function D(w){if(!w.lastVisitTime)return"尚未访问";try{return F(new Date(w.lastVisitTime),{addSuffix:!0,locale:j})}catch{return"最近"}}return(w,$)=>{const b=T("el-button"),a=T("el-empty");return u(),f("div",null,[r.value.length?(u(),f("div",{key:0,class:i(n(B).list)},[(u(!0),f(M,null,q(r.value,m=>(u(),f("div",{key:m.id,class:i(n(B).item),role:"button",tabindex:"0",onClick:d=>k("open",m),onKeyup:ue(d=>k("open",m),["enter"])},[l("div",{class:i(n(B).icon)},[p(m.url,m.icon)?(u(),f("img",{key:0,src:p(m.url,m.icon),alt:""},null,8,je)):(u(),f("span",Je,I(R(m.title)),1))],2),l("div",{class:i(n(B).info)},[l("h4",{class:i(n(B).title)},I(m.title),3),l("div",{class:i(n(B).meta)},[l("span",null,I(D(m)),1),s(b,{type:"text",size:"small",onClick:me(d=>k("edit",m),["stop"])},{default:c(()=>[...$[0]||($[0]=[E("编辑",-1)])]),_:1},8,["onClick"])],2),m.tags?.length?(u(),f("div",{key:0,class:i(n(B).tags)},[(u(!0),f(M,null,q(m.tags.slice(0,4),d=>(u(),f("span",{key:`${m.id}-${d}`,class:i(n(B).tag)},I(d),3))),128))],2)):te("",!0)],2)],42,Fe))),128))],2)):(u(),N(a,{key:1,description:"暂无访问记录。"}))])}}},Ze="_card_s57g6_1",Qe="_cardHeader_s57g6_32",Xe="_icon_s57g6_43",et="_title_s57g6_67",tt="_description_s57g6_86",O={card:Ze,cardHeader:Qe,icon:Xe,title:et,description:tt,"el-dropdown-menu__item":"_el-dropdown-menu__item_s57g6_102","danger-item":"_danger-item_s57g6_108"},nt=["data-link-id"],ot=["src"],it={key:1},Q={__name:"LinkCard",props:{link:{type:Object,required:!0}},emits:["open","edit","remove","view"],setup(g,{emit:A}){const t=g,k=A,r=x(()=>{if(t.link.icon)return t.link.icon;if(!t.link.url)return K;try{const{origin:d}=new URL(t.link.url);return d}catch{return K}}),p=x(()=>{if(t.link.title){const d=t.link.title.trim()[0];return d?d.toUpperCase():"B"}return"B"});x(()=>{const d=t.link.visitCount??0,e=t.link.lastVisitTime?new Date(t.link.lastVisitTime):null,o="次访问";return e?`${d} ${o} · ${F(e,{addSuffix:!0,locale:j})}`:`${d} ${o}`}),x(()=>{if(!t.link.createdAt)return"";try{return`添加于 ${F(new Date(t.link.createdAt),{addSuffix:!0,locale:j})}`}catch{return""}});function R(){k("open",t.link)}function D(){k("edit",t.link)}function w(){k("remove",t.link)}function $(){k("view",t.link)}async function b(){const d=t.link.url;if(!d){P.warning("当前链接没有可复制的地址");return}try{if(typeof navigator<"u"&&navigator.clipboard?.writeText)await navigator.clipboard.writeText(d);else if(typeof document<"u"){const e=document.createElement("textarea");e.value=d,e.setAttribute("readonly",""),e.style.position="absolute",e.style.left="-9999px",document.body.appendChild(e);const o=document.getSelection(),v=o&&o.rangeCount>0?o.getRangeAt(0):null;e.select();const _=document.execCommand("copy");if(document.body.removeChild(e),v&&o&&(o.removeAllRanges(),o.addRange(v)),!_)throw new Error("execCommand copy failed")}else throw new Error("Clipboard API 不可用");P.success("链接地址已复制")}catch(e){console.error(e),P.error("复制失败,请稍后再试")}}function a(d){switch(d){case"open":R();break;case"view":$();break;case"edit":D();break;case"copy":b();break;case"remove":w();break}}const m=pe(null);return ne(()=>{oe(()=>{const d=m.value;if(!d)return;const e=d.getBoundingClientRect(),o=window.getComputedStyle(d),v=d.querySelector("h3"),_=d.querySelector("p");fetch("http://127.0.0.1:7242/ingest/f96150ac-89c4-4b8b-bead-0078442f7ecb",{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({location:"LinkCard.vue:onMounted",message:"Card content measurement",data:{linkId:t.link.id,title:t.link.title,titleLength:t.link.title?.length||0,hasDescription:!!t.link.description,descriptionLength:t.link.description?.length||0,cardWidth:e.width,cardHeight:e.height,cardPadding:o.padding,cardBorder:o.borderWidth,cardBoxSizing:o.boxSizing,titleWidth:v?.getBoundingClientRect().width||null,titleText:v?.textContent||null,descWidth:_?.getBoundingClientRect().width||null},timestamp:Date.now(),sessionId:"debug-session",runId:"run1",hypothesisId:"A,C,D"})}).catch(()=>{})})}),(d,e)=>{const o=T("el-icon"),v=T("el-dropdown-item"),_=T("el-dropdown-menu"),S=T("el-dropdown");return u(),N(S,{trigger:"contextmenu",teleported:!0,onCommand:a},{dropdown:c(()=>[s(_,null,{default:c(()=>[s(v,{command:"open"},{default:c(()=>[s(o,null,{default:c(()=>[s(n(ge))]),_:1}),e[1]||(e[1]=l("span",null,"打开链接",-1))]),_:1}),s(v,{command:"view"},{default:c(()=>[s(o,null,{default:c(()=>[s(n(_e))]),_:1}),e[2]||(e[2]=l("span",null,"查看",-1))]),_:1}),s(v,{command:"edit"},{default:c(()=>[s(o,null,{default:c(()=>[s(n(fe))]),_:1}),e[3]||(e[3]=l("span",null,"编辑",-1))]),_:1}),s(v,{command:"copy"},{default:c(()=>[s(o,null,{default:c(()=>[s(n(ke))]),_:1}),e[4]||(e[4]=l("span",null,"复制地址",-1))]),_:1}),s(v,{divided:"",command:"remove",class:"danger-item"},{default:c(()=>[s(o,null,{default:c(()=>[s(n(ye))]),_:1}),e[5]||(e[5]=l("span",null,"删除",-1))]),_:1})]),_:1})]),default:c(()=>[l("article",{ref_key:"cardRef",ref:m,class:i(n(O).card),"data-link-id":g.link.id,onDblclick:$},[l("div",{class:i(n(O).cardHeader)},[l("div",{class:i(n(O).icon),"aria-hidden":"true"},[r.value?(u(),f("img",{key:0,src:r.value,alt:"",onError:e[0]||(e[0]=C=>C.target.src=n(K))},null,40,ot)):(u(),f("span",it,I(p.value),1))],2),l("h3",{class:i(n(O).title)},I(g.link.title),3)],2),g.link.description?(u(),f("p",{key:0,class:i(n(O).description)},I(g.link.description),3)):te("",!0)],42,nt)]),_:1})}}},lt="_grid_u6z2q_1",st="_linkCardItem_u6z2q_10",rt="_empty_u6z2q_40",at="_dragHint_u6z2q_48",H={grid:lt,linkCardItem:st,empty:rt,dragHint:at},dt={key:1},ct={class:"collapse-title"},ut={class:"tag-count"},mt=["data-link-id"],pt={__name:"LinkList",props:{links:{type:Array,default:()=>[]},loading:{type:Boolean,default:!1},columns:{type:Number,default:null},columnWidth:{type:Number,default:240}},emits:["open","edit","remove","view"],setup(g,{emit:A}){const t=g,k=A,r=he(),p=X(),{state:R}=ee(p),D=x(()=>R.value?.libraryView||"tag"),w=x(()=>{const e=R.value?.tagOrder||null;return r.getLinksByTagWithOrder(e)}),$=x(()=>{const e=Math.max(t.columnWidth??240,200);return t.columns&&t.columns>0?{gridTemplateColumns:`repeat(${t.columns}, ${e}px)`,gridAutoColumns:`${e}px`}:{gridTemplateColumns:`repeat(auto-fill, ${e}px)`,gridAutoColumns:`${e}px`,justifyContent:"start"}}),b=x(()=>{const e=w.value;if(!e||e.size===0)return[];const o=[],v=R.value?.tagOrder||[];return e.forEach((_,S)=>{const C=[..._].sort((L,h)=>{const G=L.order??0,z=h.order??0;return G-z});o.push({tag:S,links:C,count:C.length,order:v.includes(S)?v.indexOf(S):9999})}),o.sort((_,S)=>_.tag===Y.UNCATEGORIZED_TAG?1:S.tag===Y.UNCATEGORIZED_TAG?-1:_.order!==S.order?_.order-S.order:_.tag.localeCompare(S.tag,"zh-CN")),o}),a=x(()=>b.value.map(e=>e.tag)),m=x(()=>{const e=w.value;return e&&e.size>0}),d=()=>{oe(()=>{const e=document.querySelector(`.${H.grid}`);if(!e)return;const v=window.getComputedStyle(e).gridTemplateColumns,_=t.columnWidth??240,S=t.columns;fetch("http://127.0.0.1:7242/ingest/f96150ac-89c4-4b8b-bead-0078442f7ecb",{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({location:"LinkList.vue:measureCardWidths",message:"Grid style computed",data:{gridTemplateColumns:v,columnWidth:_,columns:S,libraryView:D.value},timestamp:Date.now(),sessionId:"debug-session",runId:"run2",hypothesisId:"F"})}).catch(()=>{}),e.querySelectorAll(`.${H.linkCardItem}`).forEach((L,h)=>{const G=L.getBoundingClientRect(),z=window.getComputedStyle(L),U=L.querySelector("article"),ie=U?U.getBoundingClientRect():null,V=U?window.getComputedStyle(U):null,le=L.closest("[data-link-id]")?.getAttribute("data-link-id")||`item-${h}`;fetch("http://127.0.0.1:7242/ingest/f96150ac-89c4-4b8b-bead-0078442f7ecb",{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({location:"LinkList.vue:measureCardWidths",message:"Card width measurement",data:{index:h,linkId:le,itemWidth:G.width,itemMaxWidth:z.maxWidth,itemMinWidth:z.minWidth,itemWidthStyle:z.width,itemDisplay:z.display,itemFlexDirection:z.flexDirection,itemBoxSizing:z.boxSizing,cardWidth:ie?.width||null,cardMaxWidth:V?.maxWidth||null,cardWidthStyle:V?.width||null,cardDisplay:V?.display||null,cardFlexShrink:V?.flexShrink||null,cardFlexGrow:V?.flexGrow||null,cardBoxSizing:V?.boxSizing||null,cardPadding:V?.padding||null,cardBorder:V?.borderWidth||null},timestamp:Date.now(),sessionId:"debug-session",runId:"run2",hypothesisId:"B,E"})}).catch(()=>{})})})};return ne(()=>{setTimeout(d,500)}),(e,o)=>{const v=T("el-skeleton"),_=T("el-collapse-item"),S=T("el-collapse");return u(),f("div",null,[g.loading?(u(),N(v,{key:0,animated:"",rows:3})):g.links.length?(u(),f("div",dt,[D.value==="tag"&&m.value?(u(),N(S,{key:0,"model-value":a.value},{default:c(()=>[(u(!0),f(M,null,q(b.value,C=>(u(),N(_,{key:C.tag,name:C.tag},{title:c(()=>[l("span",ct,[E(I(C.tag)+" ",1),l("span",ut,"("+I(C.count)+")",1)])]),default:c(()=>[l("div",{class:i([n(H).grid]),style:Z($.value)},[(u(!0),f(M,null,q(C.links,L=>(u(),f("div",{key:L.id,class:i(n(H).linkCardItem)},[s(Q,{link:L,onOpen:o[0]||(o[0]=h=>k("open",h)),onEdit:o[1]||(o[1]=h=>k("edit",h)),onRemove:o[2]||(o[2]=h=>k("remove",h)),onView:o[3]||(o[3]=h=>k("view",h))},null,8,["link"])],2))),128))],6)]),_:2},1032,["name"]))),128))]),_:1},8,["model-value"])):(u(),f("div",{key:1,class:i([n(H).grid]),style:Z($.value)},[(u(!0),f(M,null,q(g.links,(C,L)=>(u(),f("div",{key:C.id,class:i(n(H).linkCardItem),"data-link-id":C.id},[s(Q,{link:C,onOpen:o[4]||(o[4]=h=>k("open",h)),onEdit:o[5]||(o[5]=h=>k("edit",h)),onRemove:o[6]||(o[6]=h=>k("remove",h)),onView:o[7]||(o[7]=h=>k("view",h))},null,8,["link"])],10,mt))),128))],6))])):(u(),f("div",{key:2,class:i(n(H).empty)},"暂无书签,可通过新增或导入来开始使用。",2))])}}},gt=ve(pt,[["__scopeId","data-v-3587bddf"]]),ft={__name:"HomeView",props:{links:{type:Array,default:()=>[]},recentLinks:{type:Array,default:()=>[]},totalCount:{type:Number,default:0},listLoading:{type:Boolean,default:!1},shortcutLabel:{type:String,default:"Ctrl+K"},libraryColumns:{type:Number,default:null},libraryColumnWidth:{type:Number,default:null}},emits:["open-search","create-link","import-data","open-link","edit-link","delete-link","open-settings","view-link"],setup(g,{emit:A}){const t=A;return(k,r)=>(u(),N(Ne,{"total-count":g.totalCount,"shortcut-label":g.shortcutLabel,onOpenSearch:r[6]||(r[6]=p=>t("open-search")),onCreateLink:r[7]||(r[7]=p=>t("create-link")),onImportData:r[8]||(r[8]=p=>t("import-data")),onOpenSettings:r[9]||(r[9]=p=>t("open-settings"))},{recent:c(()=>[s(Ye,{links:g.recentLinks,onOpen:r[0]||(r[0]=p=>t("open-link",p)),onEdit:r[1]||(r[1]=p=>t("edit-link",p))},null,8,["links"])]),library:c(()=>[s(gt,{links:g.links,loading:g.listLoading,columns:g.libraryColumns,"column-width":g.libraryColumnWidth??void 0,onOpen:r[2]||(r[2]=p=>t("open-link",p)),onEdit:r[3]||(r[3]=p=>t("edit-link",p)),onRemove:r[4]||(r[4]=p=>t("delete-link",p)),onView:r[5]||(r[5]=p=>t("view-link",p))},null,8,["links","loading","columns","column-width"])]),_:1},8,["total-count","shortcut-label"]))}};export{ft as default};