Merge pull request #246 from zanllp/feat/add-default-sort-and-view-mode-to-global-settings

Add default sort method and view mode to global settings

.env.example

@@ -4,10 +4,12 @@
 # This attribute is used for authentication. If you input a key here, it will be validated for authentication purposes.
 # It will be prompted to enter your key when you open the extension. If the authentication fails, all your requests will be rejected.
 IIB_SECRET_KEY=
+
 # Configuring the server-side language for this extension,
 # including the tab title and most of the server-side error messages returned. Options are 'zh', 'en', or 'auto'.
 # If you want to configure the language for the front-end pages, please set it on the extension's global settings page.
 IIB_SERVER_LANG=auto
+
 # Used for configuring whether to enable access control to the file system. 
 # If enabled, only access to the provided pre-set folders (including those provided by sd-webui and manually added to Quick Move) will be allowed. 
 # The optional choices are 'enable', 'disable', and 'auto'.  

javascript/index.js

@@ -15,7 +15,7 @@
     <link rel="icon" href="/favicon.ico" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>Infinite Image Browsing</title>
-    <script type="module" crossorigin src="/infinite_image_browsing/fe-static/assets/index-0863793d.js"></script>
+    <script type="module" crossorigin src="/infinite_image_browsing/fe-static/assets/index-d77bcb54.js"></script>
     <link rel="stylesheet" href="/infinite_image_browsing/fe-static/assets/index-8961c2b3.css">
   </head>
 

vue/dist/assets/MatchedImageGrid-c6dd7328.js

@@ -0,0 +1 @@
+import{d as P,y as U,o as r,l as _,c as l,m as a,n as e,p as y,q as b,B as q,t as h,C as E,z as M,K as u,O as S,R as D,v as L,W as K}from"./index-d77bcb54.js";import{a as Q,f as W,L as j,R as H,b as J,S as X}from"./fullScreenContextMenu-c0cd1bbd.js";import{t as Y}from"./hook-b7fce3b0.js";import{g as Z}from"./db-f752a0b1.js";import{u as ee}from"./hook-7125bc0b.js";const se={class:"hint"},ie={key:1,class:"preview-switch"},te=P({__name:"MatchedImageGrid",props:{tabIdx:{},paneIdx:{},selectedTagIds:{},id:{}},setup(V){const m=V,{queue:p,images:i,onContextMenuClickU:f,stackViewEl:z,previewIdx:n,previewing:v,onPreviewVisibleChange:T,previewImgMove:g,canPreview:I,itemSize:k,gridItems:B,showGenInfo:o,imageGenInfo:C,q:$,multiSelectedIdxs:G,onFileItemClick:R,scroller:w,showMenuIdx:d}=ee();return U(()=>m.selectedTagIds,async()=>{var s;const{res:c}=p.pushAction(()=>Z(m.selectedTagIds));i.value=await c,(s=w.value)==null||s.scrollToItem(0)},{immediate:!0}),(c,s)=>{const A=D,F=L,N=X;return r(),_("div",{class:"container",ref_key:"stackViewEl",ref:z},[l(N,{size:"large",spinning:!e(p).isIdle},{default:a(()=>[l(F,{visible:e(o),"onUpdate:visible":s[1]||(s[1]=t=>y(o)?o.value=t:null),width:"70vw","mask-closable":"",onOk:s[2]||(s[2]=t=>o.value=!1)},{cancelText:a(()=>[]),default:a(()=>[l(A,{active:"",loading:!e($).isIdle},{default:a(()=>[b("div",{style:{width:"100%","word-break":"break-all","white-space":"pre-line","max-height":"70vh",overflow:"auto"},onDblclick:s[0]||(s[0]=t=>e(q)(e(C)))},[b("div",se,h(c.$t("doubleClickToCopy")),1),E(" "+h(e(C)),1)],32)]),_:1},8,["loading"])]),_:1},8,["visible"]),e(i)?(r(),M(e(Q),{key:0,ref_key:"scroller",ref:w,class:"file-list",items:e(i),"item-size":e(k).first,"key-field":"fullpath","item-secondary-size":e(k).second,gridItems:e(B)},{default:a(({item:t,index:x})=>[l(W,{idx:x,file:t,"show-menu-idx":e(d),"onUpdate:showMenuIdx":s[3]||(s[3]=O=>y(d)?d.value=O:null),onFileItemClick:e(R),"full-screen-preview-image-url":e(i)[e(n)]?e(Y)(e(i)[e(n)]):"",selected:e(G).includes(x),onContextMenuClick:e(f),onPreviewVisibleChange:e(T)},null,8,["idx","file","show-menu-idx","onFileItemClick","full-screen-preview-image-url","selected","onContextMenuClick","onPreviewVisibleChange"])]),_:1},8,["items","item-size","item-secondary-size","gridItems"])):u("",!0),e(v)?(r(),_("div",ie,[l(e(j),{onClick:s[4]||(s[4]=t=>e(g)("prev")),class:S({disable:!e(I)("prev")})},null,8,["class"]),l(e(H),{onClick:s[5]||(s[5]=t=>e(g)("next")),class:S({disable:!e(I)("next")})},null,8,["class"])])):u("",!0)]),_:1},8,["spinning"]),e(v)&&e(i)&&e(i)[e(n)]?(r(),M(J,{key:0,file:e(i)[e(n)],idx:e(n),onContextMenuClick:e(f)},null,8,["file","idx","onContextMenuClick"])):u("",!0)],512)}}});const de=K(te,[["__scopeId","data-v-2a47e96e"]]);export{de as default};

vue/dist/assets/MatchedImageGrid-e36168ea.js

@@ -1 +0,0 @@
-import{d as U,y as q,o as r,l as _,c as l,m as a,n as e,p as y,q as h,B as E,t as b,C as O,z as M,J as u,N as S,Q as D,v as L,V as Q}from"./index-0863793d.js";import{i as j,j as J,t as H,L as K,R as W,k as X,S as Y}from"./fullScreenContextMenu-ef26e94b.js";import{g as Z}from"./db-110fdf1b.js";import{u as ee}from"./hook-192c13e7.js";import"./index-b6ac558e.js";import"./_baseIteratee-b045ccb2.js";const ie={class:"hint"},se={key:1,class:"preview-switch"},te=U({__name:"MatchedImageGrid",props:{tabIdx:{},paneIdx:{},selectedTagIds:{},id:{}},setup(V){const m=V,{queue:p,images:s,onContextMenuClickU:v,stackViewEl:z,previewIdx:n,previewing:f,onPreviewVisibleChange:T,previewImgMove:g,canPreview:k,itemSize:I,gridItems:B,showGenInfo:o,imageGenInfo:C,q:$,multiSelectedIdxs:G,onFileItemClick:N,scroller:w,showMenuIdx:d}=ee();return q(()=>m.selectedTagIds,async()=>{var i;const{res:c}=p.pushAction(()=>Z(m.selectedTagIds));s.value=await c,(i=w.value)==null||i.scrollToItem(0)},{immediate:!0}),(c,i)=>{const A=D,F=L,P=Y;return r(),_("div",{class:"container",ref_key:"stackViewEl",ref:z},[l(P,{size:"large",spinning:!e(p).isIdle},{default:a(()=>[l(F,{visible:e(o),"onUpdate:visible":i[1]||(i[1]=t=>y(o)?o.value=t:null),width:"70vw","mask-closable":"",onOk:i[2]||(i[2]=t=>o.value=!1)},{cancelText:a(()=>[]),default:a(()=>[l(A,{active:"",loading:!e($).isIdle},{default:a(()=>[h("div",{style:{width:"100%","word-break":"break-all","white-space":"pre-line","max-height":"70vh",overflow:"auto"},onDblclick:i[0]||(i[0]=t=>e(E)(e(C)))},[h("div",ie,b(c.$t("doubleClickToCopy")),1),O(" "+b(e(C)),1)],32)]),_:1},8,["loading"])]),_:1},8,["visible"]),e(s)?(r(),M(e(j),{key:0,ref_key:"scroller",ref:w,class:"file-list",items:e(s),"item-size":e(I).first,"key-field":"fullpath","item-secondary-size":e(I).second,gridItems:e(B)},{default:a(({item:t,index:x})=>[l(J,{idx:x,file:t,"show-menu-idx":e(d),"onUpdate:showMenuIdx":i[3]||(i[3]=R=>y(d)?d.value=R:null),onFileItemClick:e(N),"full-screen-preview-image-url":e(s)[e(n)]?e(H)(e(s)[e(n)]):"",selected:e(G).includes(x),onContextMenuClick:e(v),onPreviewVisibleChange:e(T)},null,8,["idx","file","show-menu-idx","onFileItemClick","full-screen-preview-image-url","selected","onContextMenuClick","onPreviewVisibleChange"])]),_:1},8,["items","item-size","item-secondary-size","gridItems"])):u("",!0),e(f)?(r(),_("div",se,[l(e(K),{onClick:i[4]||(i[4]=t=>e(g)("prev")),class:S({disable:!e(k)("prev")})},null,8,["class"]),l(e(W),{onClick:i[5]||(i[5]=t=>e(g)("next")),class:S({disable:!e(k)("next")})},null,8,["class"])])):u("",!0)]),_:1},8,["spinning"]),e(f)&&e(s)&&e(s)[e(n)]?(r(),M(X,{key:0,file:e(s)[e(n)],idx:e(n),onContextMenuClick:e(v)},null,8,["file","idx","onContextMenuClick"])):u("",!0)],512)}}});const ce=Q(te,[["__scopeId","data-v-2a47e96e"]]);export{ce as default};

vue/dist/assets/SubstrSearch-58ca240b.js

@@ -1 +0,0 @@
-import{d as Q,r as V,aw as j,bo as H,bp as J,o,l as k,c as r,n as e,bu as W,z as m,m as u,C as w,t as v,J as f,p as $,q as A,B as X,N as U,bs as Y,ae as Z,I as ee,U as se,Q as te,v as ie,V as ne}from"./index-0863793d.js";import{i as ae,j as le,t as oe,L as re,R as ue,k as de,S as ce}from"./fullScreenContextMenu-ef26e94b.js";/* empty css              */import{a as D,b as pe,d as me,u as ve}from"./db-110fdf1b.js";import{u as fe}from"./hook-192c13e7.js";import"./index-b6ac558e.js";import"./_baseIteratee-b045ccb2.js";const ge={key:0,class:"search-bar"},ke={class:"hint"},we={key:1,class:"preview-switch"},ye=Q({__name:"SubstrSearch",setup(Ce){const{queue:l,images:n,onContextMenuClickU:y,stackViewEl:E,previewIdx:d,previewing:C,onPreviewVisibleChange:F,previewImgMove:b,canPreview:I,itemSize:_,gridItems:N,showGenInfo:c,imageGenInfo:x,q:R,multiSelectedIdxs:q,onFileItemClick:P,scroller:h,showMenuIdx:g}=fe(),p=V(""),t=V();j(async()=>{t.value=await D(),t.value.img_count&&t.value.expired&&S()});const S=H(()=>l.pushAction(async()=>(await ve(),t.value=await D(),t.value)).res),z=async()=>{var i;n.value=await l.pushAction(()=>me(p.value)).res,(i=h.value)==null||i.scrollToItem(0),n.value.length||Y.info(Z("fuzzy-search-noResults"))};return J("return-to-iib",async()=>{const i=await l.pushAction(pe).res;t.value.expired=i.expired}),(i,s)=>{const T=ee,M=se,G=te,K=ie,L=ce;return o(),k("div",{class:"container",ref_key:"stackViewEl",ref:E},[t.value?(o(),k("div",ge,[r(T,{value:p.value,"onUpdate:value":s[0]||(s[0]=a=>p.value=a),placeholder:i.$t("fuzzy-search-placeholder"),disabled:!e(l).isIdle,onKeydown:W(z,["enter"])},null,8,["value","placeholder","disabled","onKeydown"]),t.value.expired||!t.value.img_count?(o(),m(M,{key:0,onClick:e(S),loading:!e(l).isIdle,type:"primary"},{default:u(()=>[w(v(t.value.img_count===0?i.$t("generateIndexHint"):i.$t("UpdateIndex")),1)]),_:1},8,["onClick","loading"])):(o(),m(M,{key:1,type:"primary",onClick:z,loading:!e(l).isIdle,disabled:!p.value},{default:u(()=>[w(v(i.$t("search")),1)]),_:1},8,["loading","disabled"]))])):f("",!0),r(L,{size:"large",spinning:!e(l).isIdle},{default:u(()=>[r(K,{visible:e(c),"onUpdate:visible":s[2]||(s[2]=a=>$(c)?c.value=a:null),width:"70vw","mask-closable":"",onOk:s[3]||(s[3]=a=>c.value=!1)},{cancelText:u(()=>[]),default:u(()=>[r(G,{active:"",loading:!e(R).isIdle},{default:u(()=>[A("div",{style:{width:"100%","word-break":"break-all","white-space":"pre-line","max-height":"70vh",overflow:"auto"},onDblclick:s[1]||(s[1]=a=>e(X)(e(x)))},[A("div",ke,v(i.$t("doubleClickToCopy")),1),w(" "+v(e(x)),1)],32)]),_:1},8,["loading"])]),_:1},8,["visible"]),e(n)?(o(),m(e(ae),{key:0,ref_key:"scroller",ref:h,class:"file-list",items:e(n),"item-size":e(_).first,"key-field":"fullpath","item-secondary-size":e(_).second,gridItems:e(N)},{default:u(({item:a,index:B})=>[r(le,{idx:B,file:a,"show-menu-idx":e(g),"onUpdate:showMenuIdx":s[4]||(s[4]=O=>$(g)?g.value=O:null),onFileItemClick:e(P),"full-screen-preview-image-url":e(n)[e(d)]?e(oe)(e(n)[e(d)]):"",selected:e(q).includes(B),onContextMenuClick:e(y),onPreviewVisibleChange:e(F)},null,8,["idx","file","show-menu-idx","onFileItemClick","full-screen-preview-image-url","selected","onContextMenuClick","onPreviewVisibleChange"])]),_:1},8,["items","item-size","item-secondary-size","gridItems"])):f("",!0),e(C)?(o(),k("div",we,[r(e(re),{onClick:s[5]||(s[5]=a=>e(b)("prev")),class:U({disable:!e(I)("prev")})},null,8,["class"]),r(e(ue),{onClick:s[6]||(s[6]=a=>e(b)("next")),class:U({disable:!e(I)("next")})},null,8,["class"])])):f("",!0)]),_:1},8,["spinning"]),e(C)&&e(n)&&e(n)[e(d)]?(o(),m(de,{key:1,file:e(n)[e(d)],idx:e(d),onContextMenuClick:e(y)},null,8,["file","idx","onContextMenuClick"])):f("",!0)],512)}}});const Me=ne(ye,[["__scopeId","data-v-837e8af1"]]);export{Me as default};

vue/dist/assets/SubstrSearch-d97a6e0c.js

@@ -0,0 +1 @@
+import{d as H,r as V,ax as Q,bq as W,br as j,o,l as k,c as r,n as e,bw as J,z as m,m as u,C as w,t as v,K as f,p as $,q as A,B as X,O as U,bu as Y,af as Z,I as ee,V as se,R as te,v as ne,W as ie}from"./index-d77bcb54.js";import{a as ae,f as le,L as oe,R as re,b as ue,S as de}from"./fullScreenContextMenu-c0cd1bbd.js";/* empty css              */import{t as ce}from"./hook-b7fce3b0.js";import{a as R,c as pe,e as me,u as ve}from"./db-f752a0b1.js";import{u as fe}from"./hook-7125bc0b.js";const ge={key:0,class:"search-bar"},ke={class:"hint"},we={key:1,class:"preview-switch"},ye=H({__name:"SubstrSearch",setup(Ce){const{queue:l,images:i,onContextMenuClickU:y,stackViewEl:q,previewIdx:d,previewing:C,onPreviewVisibleChange:D,previewImgMove:b,canPreview:I,itemSize:_,gridItems:E,showGenInfo:c,imageGenInfo:x,q:F,multiSelectedIdxs:K,onFileItemClick:N,scroller:h,showMenuIdx:g}=fe(),p=V(""),t=V();Q(async()=>{t.value=await R(),t.value.img_count&&t.value.expired&&S()});const S=W(()=>l.pushAction(async()=>(await ve(),t.value=await R(),t.value)).res),z=async()=>{var n;i.value=await l.pushAction(()=>me(p.value)).res,(n=h.value)==null||n.scrollToItem(0),i.value.length||Y.info(Z("fuzzy-search-noResults"))};return j("return-to-iib",async()=>{const n=await l.pushAction(pe).res;t.value.expired=n.expired}),(n,s)=>{const O=ee,M=se,P=te,T=ne,G=de;return o(),k("div",{class:"container",ref_key:"stackViewEl",ref:q},[t.value?(o(),k("div",ge,[r(O,{value:p.value,"onUpdate:value":s[0]||(s[0]=a=>p.value=a),placeholder:n.$t("fuzzy-search-placeholder"),disabled:!e(l).isIdle,onKeydown:J(z,["enter"])},null,8,["value","placeholder","disabled","onKeydown"]),t.value.expired||!t.value.img_count?(o(),m(M,{key:0,onClick:e(S),loading:!e(l).isIdle,type:"primary"},{default:u(()=>[w(v(t.value.img_count===0?n.$t("generateIndexHint"):n.$t("UpdateIndex")),1)]),_:1},8,["onClick","loading"])):(o(),m(M,{key:1,type:"primary",onClick:z,loading:!e(l).isIdle,disabled:!p.value},{default:u(()=>[w(v(n.$t("search")),1)]),_:1},8,["loading","disabled"]))])):f("",!0),r(G,{size:"large",spinning:!e(l).isIdle},{default:u(()=>[r(T,{visible:e(c),"onUpdate:visible":s[2]||(s[2]=a=>$(c)?c.value=a:null),width:"70vw","mask-closable":"",onOk:s[3]||(s[3]=a=>c.value=!1)},{cancelText:u(()=>[]),default:u(()=>[r(P,{active:"",loading:!e(F).isIdle},{default:u(()=>[A("div",{style:{width:"100%","word-break":"break-all","white-space":"pre-line","max-height":"70vh",overflow:"auto"},onDblclick:s[1]||(s[1]=a=>e(X)(e(x)))},[A("div",ke,v(n.$t("doubleClickToCopy")),1),w(" "+v(e(x)),1)],32)]),_:1},8,["loading"])]),_:1},8,["visible"]),e(i)?(o(),m(e(ae),{key:0,ref_key:"scroller",ref:h,class:"file-list",items:e(i),"item-size":e(_).first,"key-field":"fullpath","item-secondary-size":e(_).second,gridItems:e(E)},{default:u(({item:a,index:B})=>[r(le,{idx:B,file:a,"show-menu-idx":e(g),"onUpdate:showMenuIdx":s[4]||(s[4]=L=>$(g)?g.value=L:null),onFileItemClick:e(N),"full-screen-preview-image-url":e(i)[e(d)]?e(ce)(e(i)[e(d)]):"",selected:e(K).includes(B),onContextMenuClick:e(y),onPreviewVisibleChange:e(D)},null,8,["idx","file","show-menu-idx","onFileItemClick","full-screen-preview-image-url","selected","onContextMenuClick","onPreviewVisibleChange"])]),_:1},8,["items","item-size","item-secondary-size","gridItems"])):f("",!0),e(C)?(o(),k("div",we,[r(e(oe),{onClick:s[5]||(s[5]=a=>e(b)("prev")),class:U({disable:!e(I)("prev")})},null,8,["class"]),r(e(re),{onClick:s[6]||(s[6]=a=>e(b)("next")),class:U({disable:!e(I)("next")})},null,8,["class"])])):f("",!0)]),_:1},8,["spinning"]),e(C)&&e(i)&&e(i)[e(d)]?(o(),m(ue,{key:1,file:e(i)[e(d)],idx:e(d),onContextMenuClick:e(y)},null,8,["file","idx","onContextMenuClick"])):f("",!0)],512)}}});const ze=ie(ye,[["__scopeId","data-v-837e8af1"]]);export{ze as default};

vue/dist/assets/_baseIteratee-b045ccb2.js

@@ -1 +0,0 @@
-import{cq as _,cr as d,bN as c,aJ as g,b3 as E,cs as O,b5 as P,ct as p,b1 as y,bl as C}from"./index-0863793d.js";function I(n){return function(r){return r==null?void 0:r[n]}}var L=1,b=2;function D(n,r,e,t){var i=e.length,A=i,a=!t;if(n==null)return!A;for(n=Object(n);i--;){var f=e[i];if(a&&f[2]?f[1]!==n[f[0]]:!(f[0]in n))return!1}for(;++i<A;){f=e[i];var u=f[0],s=n[u],o=f[1];if(a&&f[2]){if(s===void 0&&!(u in n))return!1}else{var l=new _;if(t)var R=t(s,o,u,n,r,l);if(!(R===void 0?d(o,s,L|b,t,l):R))return!1}}return!0}function h(n){return n===n&&!c(n)}function G(n){for(var r=g(n),e=r.length;e--;){var t=r[e],i=n[t];r[e]=[t,i,h(i)]}return r}function M(n,r){return function(e){return e==null?!1:e[n]===r&&(r!==void 0||n in Object(e))}}function w(n){var r=G(n);return r.length==1&&r[0][2]?M(r[0][0],r[0][1]):function(e){return e===n||D(e,n,r)}}function F(n,r,e){var t=n==null?void 0:E(n,r);return t===void 0?e:t}var N=1,S=2;function m(n,r){return O(n)&&h(r)?M(P(n),r):function(e){var t=F(e,n);return t===void 0&&t===r?p(e,n):d(r,t,N|S)}}function q(n){return function(r){return E(r,n)}}function x(n){return O(n)?I(P(n)):q(n)}function T(n){return typeof n=="function"?n:n==null?y:typeof n=="object"?C(n)?m(n[0],n[1]):w(n):x(n)}export{T as b};

vue/dist/assets/db-110fdf1b.js

@@ -1 +0,0 @@
-import{bT as t}from"./index-0863793d.js";const o=async()=>(await t.get("/db/basic_info")).data,c=async()=>(await t.get("/db/expired_dirs")).data,r=async()=>{await t.post("/db/update_image_data",{},{timeout:1/0})},d=async a=>(await t.post("/db/match_images_by_tags",a)).data,g=async a=>(await t.post("/db/add_custom_tag",a)).data,p=async a=>(await t.post("/db/toggle_custom_tag_to_img",a)).data,i=async a=>{await t.post("/db/remove_custom_tag",a)},m=async a=>(await t.get("/db/img_selected_custom_tag",{params:{path:a}})).data,u=async a=>(await t.get("/db/search_by_substr",{params:{substr:a}})).data,e="/db/scanned_paths",_=async a=>{await t.post(e,{path:a})},b=async a=>{await t.delete(e,{data:{path:a}})};export{o as a,c as b,g as c,u as d,b as e,_ as f,d as g,m as h,i as r,p as t,r as u};

vue/dist/assets/db-f752a0b1.js

@@ -0,0 +1 @@
+import{ct as I,cu as _,c3 as A,aL as P,b5 as m,cv as y,b7 as b,cw as C,b3 as E,bn as R,c9 as a}from"./index-d77bcb54.js";function O(t){return function(n){return n==null?void 0:n[t]}}var D=1,M=2;function T(t,n,e,s){var r=e.length,c=r,d=!s;if(t==null)return!c;for(t=Object(t);r--;){var i=e[r];if(d&&i[2]?i[1]!==t[i[0]]:!(i[0]in t))return!1}for(;++r<c;){i=e[r];var u=i[0],o=t[u],f=i[1];if(d&&i[2]){if(o===void 0&&!(u in t))return!1}else{var g=new I;if(s)var p=s(o,f,u,t,n,g);if(!(p===void 0?_(f,o,D|M,s,g):p))return!1}}return!0}function w(t){return t===t&&!A(t)}function L(t){for(var n=P(t),e=n.length;e--;){var s=n[e],r=t[s];n[e]=[s,r,w(r)]}return n}function h(t,n){return function(e){return e==null?!1:e[t]===n&&(n!==void 0||t in Object(e))}}function S(t){var n=L(t);return n.length==1&&n[0][2]?h(n[0][0],n[0][1]):function(e){return e===t||T(e,t,n)}}function v(t,n,e){var s=t==null?void 0:m(t,n);return s===void 0?e:s}var x=1,G=2;function F(t,n){return y(t)&&w(n)?h(b(t),n):function(e){var s=v(e,t);return s===void 0&&s===n?C(e,t):_(n,s,x|G)}}function B(t){return function(n){return m(n,t)}}function K(t){return y(t)?O(b(t)):B(t)}function U(t){return typeof t=="function"?t:t==null?E:typeof t=="object"?R(t)?F(t[0],t[1]):S(t):K(t)}const $=async()=>(await a.get("/db/basic_info")).data,q=async()=>(await a.get("/db/expired_dirs")).data,H=async()=>{await a.post("/db/update_image_data",{},{timeout:1/0})},J=async t=>(await a.post("/db/match_images_by_tags",t)).data,Q=async t=>(await a.post("/db/add_custom_tag",t)).data,W=async t=>(await a.post("/db/toggle_custom_tag_to_img",t)).data,X=async t=>{await a.post("/db/remove_custom_tag",t)},Y=async t=>(await a.get("/db/img_selected_custom_tag",{params:{path:t}})).data,Z=async t=>(await a.get("/db/search_by_substr",{params:{substr:t}})).data,l="/db/scanned_paths",z=async t=>{await a.post(l,{path:t})},k=async t=>{await a.delete(l,{data:{path:t}})};export{$ as a,U as b,q as c,Q as d,Z as e,Y as f,J as g,k as h,z as i,X as r,W as t,H as u};

vue/dist/assets/hook-192c13e7.js

@@ -1 +0,0 @@
-import{r as l,bn as F,b1 as S}from"./index-0863793d.js";import{u as y,b as q,f as P,c as z,d as E,e as G,l as Q}from"./fullScreenContextMenu-ef26e94b.js";const A=()=>{const e=l(),c=F(),i=l(),t={tabIdx:-1,target:"local",paneIdx:-1,walkMode:!1},{stackViewEl:r,multiSelectedIdxs:u,stack:m}=y({images:e}).toRefs(),{itemSize:f,gridItems:v}=q(t),{showMenuIdx:p}=P();z();const{showGenInfo:I,imageGenInfo:d,q:w,onContextMenuClick:o,onFileItemClick:g}=E(t,{openNext:S}),{previewIdx:x,previewing:k,onPreviewVisibleChange:M,previewImgMove:b,canPreview:h}=G(t,{scroller:i,files:e}),C=async(n,s,a)=>{m.value=[{curr:"",files:e.value}],await o(n,s,a)};return Q("removeFiles",async({paths:n})=>{var s;e.value=(s=e.value)==null?void 0:s.filter(a=>!n.includes(a.fullpath))}),{scroller:i,queue:c,images:e,onContextMenuClickU:C,stackViewEl:r,previewIdx:x,previewing:k,onPreviewVisibleChange:M,previewImgMove:b,canPreview:h,itemSize:f,gridItems:v,showGenInfo:I,imageGenInfo:d,q:w,onContextMenuClick:o,onFileItemClick:g,showMenuIdx:p,multiSelectedIdxs:u}};export{A as u};

vue/dist/assets/hook-7125bc0b.js

@@ -0,0 +1 @@
+import{r as c,bp as F,b3 as S}from"./index-d77bcb54.js";import{u as y,b as q,f as P,c as z,d as E,e as G,h as Q}from"./hook-b7fce3b0.js";const A=()=>{const e=c(),l=F(),n=c(),t={tabIdx:-1,target:"local",paneIdx:-1,walkMode:!1},{stackViewEl:r,multiSelectedIdxs:u,stack:m}=y({images:e}).toRefs(),{itemSize:f,gridItems:p}=q(t),{showMenuIdx:v}=P();z();const{showGenInfo:I,imageGenInfo:d,q:w,onContextMenuClick:o,onFileItemClick:g}=E(t,{openNext:S}),{previewIdx:x,previewing:k,onPreviewVisibleChange:h,previewImgMove:M,canPreview:b}=G(t,{scroller:n,files:e}),C=async(a,s,i)=>{m.value=[{curr:"",files:e.value}],await o(a,s,i)};return Q("removeFiles",async({paths:a})=>{var s;e.value=(s=e.value)==null?void 0:s.filter(i=>!a.includes(i.fullpath))}),{scroller:n,queue:l,images:e,onContextMenuClickU:C,stackViewEl:r,previewIdx:x,previewing:k,onPreviewVisibleChange:h,previewImgMove:M,canPreview:b,itemSize:f,gridItems:p,showGenInfo:I,imageGenInfo:d,q:w,onContextMenuClick:o,onFileItemClick:g,showMenuIdx:v,multiSelectedIdxs:u}};export{A as u};

vue/dist/assets/index-b6ac558e.js

@@ -1 +0,0 @@
-import{cp as i}from"./index-0863793d.js";var r=1/0,o=17976931348623157e292;function s(n){if(!n)return n===0?n:0;if(n=i(n),n===r||n===-r){var t=n<0?-1:1;return t*o}return n===n?n:0}function c(n){var t=n==null?0:n.length;return t?n[t-1]:void 0}export{c as l,s as t};

vue/dist/assets/stackView-16848e93.css

@@ -1 +1 @@
-.ant-breadcrumb{box-sizing:border-box;margin:0;padding:0;color:#000000d9;font-variant:tabular-nums;line-height:1.5715;list-style:none;font-feature-settings:"tnum";color:#00000073;font-size:14px}.ant-breadcrumb .anticon{font-size:14px}.ant-breadcrumb a{color:#00000073;transition:color .3s}.ant-breadcrumb a:hover{color:#de632f}.ant-breadcrumb>span:last-child{color:#000000d9}.ant-breadcrumb>span:last-child a{color:#000000d9}.ant-breadcrumb>span:last-child .ant-breadcrumb-separator{display:none}.ant-breadcrumb-separator{margin:0 8px;color:#00000073}.ant-breadcrumb-link>.anticon+span,.ant-breadcrumb-link>.anticon+a{margin-left:4px}.ant-breadcrumb-overlay-link>.anticon{margin-left:4px}.ant-breadcrumb-rtl{direction:rtl}.ant-breadcrumb-rtl:before{display:table;content:""}.ant-breadcrumb-rtl:after{display:table;clear:both;content:""}.ant-breadcrumb-rtl>span{float:right}.ant-breadcrumb-rtl .ant-breadcrumb-link>.anticon+span,.ant-breadcrumb-rtl .ant-breadcrumb-link>.anticon+a{margin-right:4px;margin-left:0}.ant-breadcrumb-rtl .ant-breadcrumb-overlay-link>.anticon{margin-right:4px;margin-left:0}.nprogress{pointer-events:none}.nprogress .bar{background:#29d;position:fixed;z-index:1031;top:0;left:0;width:100%;height:2px}.nprogress .peg{display:block;position:absolute;right:0px;width:100px;height:100%;box-shadow:0 0 10px #29d,0 0 5px #29d;opacity:1;-webkit-transform:rotate(3deg) translate(0px,-4px);-ms-transform:rotate(3deg) translate(0px,-4px);transform:rotate(3deg) translateY(-4px)}.nprogress .spinner{display:block;position:fixed;z-index:1031;top:15px;right:15px}.nprogress .spinner-icon{width:18px;height:18px;box-sizing:border-box;border:solid 2px transparent;border-top-color:#29d;border-left-color:#29d;border-radius:50%;-webkit-animation:nprogress-spinner .4s linear infinite;animation:nprogress-spinner .4s linear infinite}.nprogress-custom-parent{overflow:hidden;position:relative}.nprogress-custom-parent .nprogress .spinner,.nprogress-custom-parent .nprogress .bar{position:absolute}@-webkit-keyframes nprogress-spinner{0%{-webkit-transform:rotate(0deg)}to{-webkit-transform:rotate(360deg)}}@keyframes nprogress-spinner{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.preview-switch[data-v-a3f5bdd4]{position:fixed;top:0;bottom:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;z-index:11111;pointer-events:none}.preview-switch>*[data-v-a3f5bdd4]{color:#fff;margin:16px;font-size:4em;pointer-events:all;cursor:pointer}.preview-switch>*.disable[data-v-a3f5bdd4]{opacity:0;pointer-events:none;cursor:none}.container[data-v-a3f5bdd4]{background:var(--zp-secondary-background);height:var(--pane-max-height)}.location-bar[data-v-a3f5bdd4]{padding:4px 16px;background:var(--zp-primary-background);border-bottom:1px solid var(--zp-border);display:flex;align-items:center;justify-content:space-between}.location-bar .actions[data-v-a3f5bdd4]{display:flex;align-items:center;flex-shrink:0}.location-bar a.opt[data-v-a3f5bdd4]{margin-left:8px}.view[data-v-a3f5bdd4]{padding:8px;height:calc(100vh - 48px)}.view .file-list[data-v-a3f5bdd4]{list-style:none;padding:8px;height:100%;overflow:auto}.hint[data-v-a3f5bdd4]{padding:4px;border:4px;background:var(--zp-secondary-background);border:1px solid var(--zp-border)}
+.ant-breadcrumb{box-sizing:border-box;margin:0;padding:0;color:#000000d9;font-variant:tabular-nums;line-height:1.5715;list-style:none;font-feature-settings:"tnum";color:#00000073;font-size:14px}.ant-breadcrumb .anticon{font-size:14px}.ant-breadcrumb a{color:#00000073;transition:color .3s}.ant-breadcrumb a:hover{color:#de632f}.ant-breadcrumb>span:last-child{color:#000000d9}.ant-breadcrumb>span:last-child a{color:#000000d9}.ant-breadcrumb>span:last-child .ant-breadcrumb-separator{display:none}.ant-breadcrumb-separator{margin:0 8px;color:#00000073}.ant-breadcrumb-link>.anticon+span,.ant-breadcrumb-link>.anticon+a{margin-left:4px}.ant-breadcrumb-overlay-link>.anticon{margin-left:4px}.ant-breadcrumb-rtl{direction:rtl}.ant-breadcrumb-rtl:before{display:table;content:""}.ant-breadcrumb-rtl:after{display:table;clear:both;content:""}.ant-breadcrumb-rtl>span{float:right}.ant-breadcrumb-rtl .ant-breadcrumb-link>.anticon+span,.ant-breadcrumb-rtl .ant-breadcrumb-link>.anticon+a{margin-right:4px;margin-left:0}.ant-breadcrumb-rtl .ant-breadcrumb-overlay-link>.anticon{margin-right:4px;margin-left:0}.nprogress{pointer-events:none}.nprogress .bar{background:#29d;position:fixed;z-index:1031;top:0;left:0;width:100%;height:2px}.nprogress .peg{display:block;position:absolute;right:0px;width:100px;height:100%;box-shadow:0 0 10px #29d,0 0 5px #29d;opacity:1;-webkit-transform:rotate(3deg) translate(0px,-4px);-ms-transform:rotate(3deg) translate(0px,-4px);transform:rotate(3deg) translateY(-4px)}.nprogress .spinner{display:block;position:fixed;z-index:1031;top:15px;right:15px}.nprogress .spinner-icon{width:18px;height:18px;box-sizing:border-box;border:solid 2px transparent;border-top-color:#29d;border-left-color:#29d;border-radius:50%;-webkit-animation:nprogress-spinner .4s linear infinite;animation:nprogress-spinner .4s linear infinite}.nprogress-custom-parent{overflow:hidden;position:relative}.nprogress-custom-parent .nprogress .spinner,.nprogress-custom-parent .nprogress .bar{position:absolute}@-webkit-keyframes nprogress-spinner{0%{-webkit-transform:rotate(0deg)}to{-webkit-transform:rotate(360deg)}}@keyframes nprogress-spinner{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.preview-switch[data-v-316d8b15]{position:fixed;top:0;bottom:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;z-index:11111;pointer-events:none}.preview-switch>*[data-v-316d8b15]{color:#fff;margin:16px;font-size:4em;pointer-events:all;cursor:pointer}.preview-switch>*.disable[data-v-316d8b15]{opacity:0;pointer-events:none;cursor:none}.container[data-v-316d8b15]{background:var(--zp-secondary-background);height:var(--pane-max-height)}.location-bar[data-v-316d8b15]{padding:4px 16px;background:var(--zp-primary-background);border-bottom:1px solid var(--zp-border);display:flex;align-items:center;justify-content:space-between}.location-bar .actions[data-v-316d8b15]{display:flex;align-items:center;flex-shrink:0}.location-bar a.opt[data-v-316d8b15]{margin-left:8px}.view[data-v-316d8b15]{padding:8px;height:calc(100vh - 48px)}.view .file-list[data-v-316d8b15]{list-style:none;padding:8px;height:100%;overflow:auto}.hint[data-v-316d8b15]{padding:4px;border:4px;background:var(--zp-secondary-background);border:1px solid var(--zp-border)}

vue/dist/index.html

@@ -7,7 +7,7 @@
     <link rel="icon" href="/favicon.ico" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>Infinite Image Browsing</title>
-    <script type="module" crossorigin src="/infinite_image_browsing/fe-static/assets/index-0863793d.js"></script>
+    <script type="module" crossorigin src="/infinite_image_browsing/fe-static/assets/index-d77bcb54.js"></script>
     <link rel="stylesheet" href="/infinite_image_browsing/fe-static/assets/index-8961c2b3.css">
   </head>
 

vue/src/i18n.ts

@@ -135,14 +135,22 @@ const zh = {
   clear: '清除',
   toggleTagSelection: '切换 "{tag}" 标签选中',
   changlog: '更新日志',
-  accessControlModeTips: "为确保数据安全，您当前正以访问控制模式运行，仅能访问授权文件夹。您可以通过编辑本拓展根目录的下.env文件来调整访问权限设置.如果不存在.env文件, 你可以将.env.example文件复制并重命名为.env",
-  dontShowAgain: "不再显示"
+  accessControlModeTips:
+    '为确保数据安全，您当前正以访问控制模式运行，仅能访问授权文件夹。您可以通过编辑本拓展根目录的下.env文件来调整访问权限设置.如果不存在.env文件, 你可以将.env.example文件复制并重命名为.env',
+  dontShowAgain: '不再显示',
+  defaultSortingMethod: '默认排序方法',
+  defaultViewMode: '默认查看模式',
+  showPreviewImage: '显示预览图'
 }
 const en: Record<keyof typeof zh, string> = {
   //! MissingTranslations: "Mark missing translations like this""shortcutKey": "Keyboard Shortcuts",
   //! MissingTranslations
+  defaultSortingMethod: 'Default Sorting Method',
+  defaultViewMode: 'Default View Mode',
+  showPreviewImage: 'Show Preview Image',
   dontShowAgain: "Don't show again",
-  accessControlModeTips: "To ensure data security, you are currently running in access control mode, which only allows access to authorized folders. You can adjust the access permissions settings by editing the .env file in the root directory of this extension. If the .env file does not exist, you can copy the .env.example file and rename it to .env.",
+  accessControlModeTips:
+    'To ensure data security, you are currently running in access control mode, which only allows access to authorized folders. You can adjust the access permissions settings by editing the .env file in the root directory of this extension. If the .env file does not exist, you can copy the .env.example file and rename it to .env.',
   changlog: 'Change log',
   clear: 'Clear',
   toggleTagSelection: 'Toggle Selection of Tag "{tag}"',

vue/src/page/fileTransfer/FileItem.vue

@@ -20,7 +20,7 @@ const props = withDefaults(
     viewMode?: ViewMode
     fullScreenPreviewImageUrl?: string
   }>(),
-  { selected: false, viewMode: 'grid' }
+  { selected: false, viewMode: 'previewGrid' }
 )
 
 const emit = defineEmits<{
@@ -43,10 +43,13 @@ const onRightClick = () => {
 
 const q = createReactiveQueue()
 const thumbnailSize = computed(() =>
-  props.viewMode === 'grid'
+  props.viewMode === 'previewGrid'
     ? [global.gridThumbnailSize, global.gridThumbnailSize].join('x')
     : [global.largeGridThumbnailSize, global.largeGridThumbnailSize].join('x')
 )
+const imageSrc = computed(() => {
+  return global.enableThumbnail ? toImageThumbnailUrl(props.file, thumbnailSize.value) : toRawFileUrl(props.file)
+})
 </script>
 <template>
   <a-dropdown
@@ -61,8 +64,8 @@ const thumbnailSize = computed(() =>
       :class="{
         clickable: file.type === 'dir',
         selected,
-        grid: viewMode === 'grid' || viewMode === 'large-size-grid',
-        'large-grid': viewMode === 'large-size-grid'
+        grid: viewMode === 'previewGrid' || viewMode === 'largePreviewGrid',
+        'large-grid': viewMode === 'largePreviewGrid'
       }"
       :data-idx="idx"
       :key="file.name"
@@ -71,7 +74,7 @@ const thumbnailSize = computed(() =>
       @contextmenu="onRightClick"
       @click.capture="emit('fileItemClick', $event, file, idx)"
     >
-      <div v-if="viewMode !== 'line'">
+      <div v-if="viewMode !== 'detailList'">
         <a-dropdown>
           <div class="more">
             <ellipsis-outlined />
@@ -90,10 +93,8 @@ const thumbnailSize = computed(() =>
         <a-image
           :key="file.fullpath"
           :class="`idx-${idx}`"
-          v-if="isImageFile(file.name)"
-          :src="
-            global.enableThumbnail ? toImageThumbnailUrl(file, thumbnailSize) : toRawFileUrl(file)
-          "
+          v-if="isImageFile(file.name) "
+          :src="imageSrc"
           :fallback="fallbackImage"
           :preview="{
             src: fullScreenPreviewImageUrl,

vue/src/page/fileTransfer/fileSort.ts

@@ -1,7 +1,8 @@
 import type { FileNodeInfo } from '@/api/files'
 import { t } from '@/i18n'
+import { SearchSelectConv } from 'vue3-ts-util'
 
-export const sortMethodMap: Record<SortMethod, string> = {
+export const sortMethodMap = (): Record<SortMethod, string> => ({
   'date-asc': t('sortByDateAscending'),
   'date-desc': t('sortByDateDescending'),
   'name-asc': t('sortByNameAscending'),
@@ -10,7 +11,7 @@ export const sortMethodMap: Record<SortMethod, string> = {
   'size-desc': t('sortBySizeDescending'),
   'created-time-asc': t('sortByCreatedDateAscending'),
   'created-time-desc': t('sortByCreatedDateDescending')
-}
+})
 export enum SortMethod {
   DATE_ASC = 'date-asc',
   DATE_DESC = 'date-desc',
@@ -22,6 +23,13 @@ export enum SortMethod {
   CREATED_TIME_DESC = 'created-time-desc'
 }
 
+export const sortMethods = Object.values(SortMethod) as SortMethod[]
+
+
+export const sortMethodConv: SearchSelectConv<SortMethod> = {
+  value: (v) => v,
+  text: (v) => t('sortBy') + ' ' + sortMethodMap()[v].toLocaleLowerCase()
+}
 type FileList = FileNodeInfo[]
 
 const compareByType = (a: FileNodeInfo, b: FileNodeInfo) => {

vue/src/page/fileTransfer/hook.ts

@@ -5,7 +5,6 @@ import { gradioApp, parentWindow } from '@/util'
 import { genInfoCompleted, getImageGenerationInfo, openFolder, setImgPath } from '@/api'
 import {
   useWatchDocument,
-  type SearchSelectConv,
   ok,
   createTypedShareStateHook,
   delay,
@@ -20,7 +19,7 @@ import {
   globalEvents
 } from '@/util'
 import { getTargetFolderFiles, type FileNodeInfo, deleteFiles, moveFiles } from '@/api/files'
-import { sortFiles, sortMethodMap, SortMethod } from './fileSort'
+import { sortFiles, sortMethodConv } from './fileSort'
 import { cloneDeep, debounce, last, range, uniqBy, uniqueId } from 'lodash-es'
 import * as Path from '@/util/path'
 import type Progress from 'nprogress'
@@ -66,7 +65,7 @@ export const { useHookShareState } = createTypedShareStateHook(
       stack.value.map((v) => v.curr).slice(global.conf?.is_win ? 1 : 0)
     )
     const currLocation = computed(() => Path.join(...basePath.value))
-    const sortMethod = ref(SortMethod.CREATED_TIME_DESC)
+    const sortMethod = ref(global.defaultSortingMethod)
     const sortedFiles = computed(() => {
       if (images.value) {
         return images.value
@@ -135,7 +134,8 @@ export interface Props {
   walkModePath?: string
 }
 
-export type ViewMode = 'line' | 'grid' | 'large-size-grid'
+export type ViewMode = 'detailList' | 'previewGrid' | 'largePreviewGrid'
+export const viewModes: ViewMode[] = ['detailList', 'largePreviewGrid', 'previewGrid']
 
 export interface Page {
   files: FileNodeInfo[]
@@ -525,34 +525,25 @@ export function useFilesDisplay(props: Props) {
   } = useHookShareState().toRefs()
   const { state } = useHookShareState()
   const moreActionsDropdownShow = ref(false)
-  const viewMode = ref<ViewMode>('grid')
-  const viewModeMap: Record<ViewMode, string> = {
-    line: t('detailList'),
-    grid: t('previewGrid'),
-    'large-size-grid': t('largePreviewGrid')
-  }
-  const sortMethodConv: SearchSelectConv<SortMethod> = {
-    value: (v) => v,
-    text: (v) => t('sortBy') + ' ' + sortMethodMap[v].toLocaleLowerCase()
-  }
+  const viewMode = ref(global.defaultViewMode)  
   const gridSize = 272
   const profileHeight = 64
   const largeGridSize = gridSize * 2
   const { width } = useElementSize(stackViewEl)
   const gridItems = computed(() => {
     const w = width.value
-    if (viewMode.value === 'line' || !w) {
+    if (viewMode.value === 'detailList' || !w) {
       return
     }
-    return ~~(w / (viewMode.value === 'grid' ? gridSize : largeGridSize))
+    return ~~(w / (viewMode.value === 'previewGrid' ? gridSize : largeGridSize))
   })
 
   const itemSize = computed(() => {
     const mode = viewMode.value
-    if (mode === 'line') {
+    if (mode === 'detailList') {
       return { first: 80, second: undefined }
     }
-    const second = mode === 'grid' ? gridSize : largeGridSize
+    const second = mode === 'previewGrid' ? gridSize : largeGridSize
     const first = second + profileHeight
     return {
       first,
@@ -612,7 +603,6 @@ export function useFilesDisplay(props: Props) {
     gridItems,
     sortedFiles,
     sortMethodConv,
-    viewModeMap,
     moreActionsDropdownShow,
     viewMode,
     gridSize,

vue/src/page/fileTransfer/stackView.vue

@@ -1,6 +1,5 @@
 <script setup lang="ts">
 import { DownOutlined, LeftCircleOutlined, RightCircleOutlined } from '@/icon'
-import { sortMethodMap } from './fileSort'
 import { useGlobalStore } from '@/store/useGlobalStore'
 import {
   useFileTransfer,
@@ -8,11 +7,11 @@ import {
   useHookShareState,
   useLocation,
   usePreview,
-  type ViewMode,
   useFileItemActions,
   toRawFileUrl,
   stackCache,
-  useMobileOptimization
+  useMobileOptimization,
+  viewModes
 } from './hook'
 import { SearchSelect } from 'vue3-ts-util'
 
@@ -26,6 +25,7 @@ import FileItem from './FileItem.vue'
 import fullScreenContextMenu from './fullScreenContextMenu.vue'
 import { copy2clipboardI18n } from '@/util'
 import { openFolder } from '@/api'
+import { sortMethods } from './fileSort'
 
 const global = useGlobalStore()
 const props = defineProps<{
@@ -57,7 +57,6 @@ const {
   sortedFiles,
   sortMethod,
   viewMode,
-  viewModeMap,
   itemSize,
   loadNextDir,
   loadNextDirLoading,
@@ -158,12 +157,10 @@ watch(
                 }">
                   <a-form-item :label="$t('viewMode')">
                     <search-select v-model:value="viewMode" @click.stop
-                      :conv="{ value: v => v, text: v => viewModeMap[v as ViewMode] }"
-                      :options="Object.keys(viewModeMap)" />
+                      :conv="{ value: v => v, text: v => $t(v) }" :options="viewModes" />
                   </a-form-item>
                   <a-form-item :label="$t('sortingMethod')">
-                    <search-select v-model:value="sortMethod" @click.stop :conv="sortMethodConv"
-                      :options="Object.keys(sortMethodMap)" />
+                    <search-select v-model:value="sortMethod" @click.stop :conv="sortMethodConv" :options="sortMethods" />
                   </a-form-item>
                   <div style="padding: 4px;">
                     <a @click.prevent="copyLocation">{{ $t('copyPath') }}</a>

vue/src/page/globalSetting.vue

@@ -3,6 +3,8 @@ import { t } from '@/i18n'
 import { useGlobalStore, type Shortcut } from '@/store/useGlobalStore'
 import { ref } from 'vue'
 import { SearchSelect } from 'vue3-ts-util'
+import { sortMethodConv, sortMethods } from '../page/fileTransfer/fileSort'
+import { viewModes } from '../page/fileTransfer/hook'
 const globalStore = useGlobalStore()
 
 const langChanged = ref(false)
@@ -30,7 +32,12 @@ const onShortcutKeyDown = (e: KeyboardEvent, key: keyof Shortcut) => {
       <a-form-item :label="$t('useThumbnailPreview')">
         <a-switch v-model:checked="globalStore.enableThumbnail" />
       </a-form-item>
-
+      <a-form-item :label="$t('defaultSortingMethod')">
+        <search-select v-model:value="globalStore.defaultSortingMethod" :conv="sortMethodConv" :options="sortMethods" />
+      </a-form-item>
+      <a-form-item :label="$t('defaultViewMode')">
+        <search-select v-model:value="globalStore.defaultViewMode" :conv="{ value: v => v, text: v => $t(v) }" :options="viewModes" />
+      </a-form-item>
       <a-form-item :label="$t('gridThumbnailWidth')">
         <a-input-number v-model:value="globalStore.gridThumbnailSize" :min="256" :max="1024" /> (px)
       </a-form-item>

vue/src/store/useGlobalStore.ts

@@ -2,6 +2,8 @@ import type { GlobalConf } from '@/api'
 import type { MatchImageByTagsReq } from '@/api/db'
 import { i18n, t } from '@/i18n'
 import { getPreferredLang } from '@/i18n'
+import { SortMethod } from '@/page/fileTransfer/fileSort'
+import { ViewMode } from '@/page/fileTransfer/hook'
 import type { getAutoCompletedTagList } from '@/page/taskRecord/autoComplete'
 import type { Dict, ReturnTypeAsync } from '@/util'
 import { isAbsolute, join, normalize } from '@/util/path'
@@ -127,6 +129,9 @@ export const useGlobalStore = defineStore(
     const gridThumbnailSize = ref(256)
     const largeGridThumbnailSize = ref(512)
 
+    const defaultSortingMethod = ref(SortMethod.CREATED_TIME_DESC)
+    const defaultViewMode = ref<ViewMode>('previewGrid')
+
     const lang = ref(getPreferredLang())
     watch(lang, (v) => (i18n.global.locale.value = v as any))
 
@@ -154,6 +159,8 @@ export const useGlobalStore = defineStore(
       return Object.fromEntries(res)
     })
     return {
+      defaultSortingMethod,
+      defaultViewMode,
       pathAliasMap,
       createEmptyPane,
       lang,
@@ -180,6 +187,8 @@ export const useGlobalStore = defineStore(
     persist: {
       // debug: true,
       paths: [
+        'defaultSortingMethod',
+        'defaultViewMode',
         'dontShowAgain',
         'lang',
         'enableThumbnail',