样式美化，添加tocken刷新按钮
This commit is contained in:
@@ -1,6 +1,7 @@
|
|||||||
// 操作相关图标
|
// 操作相关图标
|
||||||
export const actionIcons = {
|
export const actionIcons = {
|
||||||
'download': 'M19 9h-4V3H9v6H5l7 7 7-7zM5 18v2h14v-2H5z',
|
'download': 'M731.428571 341.333333h73.142858a73.142857 73.142857 0 0 1 73.142857 73.142857v414.476191a73.142857 73.142857 0 0 1-73.142857 73.142857H219.428571a73.142857 73.142857 0 0 1-73.142857-73.142857V414.47619a73.142857 73.142857 0 0 1 73.142857-73.142857h73.142858v73.142857H219.428571v414.476191h585.142858V414.47619h-73.142858v-73.142857z m-176.90819-242.590476l0.048762 397.092572 84.577524-84.601905 51.687619 51.712-172.373334 172.397714-172.397714-172.373333 51.712-51.736381 83.626667 83.626666V98.742857h73.142857z',
|
||||||
|
'upload':'M731.428571 341.333333h73.142858a73.142857 73.142857 0 0 1 73.142857 73.142857v414.476191a73.142857 73.142857 0 0 1-73.142857 73.142857H219.428571a73.142857 73.142857 0 0 1-73.142857-73.142857V414.47619a73.142857 73.142857 0 0 1 73.142857-73.142857h73.142858v73.142857H219.428571v414.476191h585.142858V414.47619h-73.142858v-73.142857zM518.460952 93.671619l172.373334 172.373333-51.687619 51.736381-84.601905-84.577523v348.306285h-73.142857V234.22781l-83.626667 83.577904-51.712-51.712 172.373333-172.397714z',
|
||||||
'settings': 'M19.14,12.94c0.04-0.3,0.06-0.61,0.06-0.94c0-0.32-0.02-0.64-0.07-0.94l2.03-1.58c0.18-0.14,0.23-0.41,0.12-0.61 l-1.92-3.32c-0.12-0.22-0.37-0.29-0.59-0.22l-2.39,0.96c-0.5-0.38-1.03-0.7-1.62-0.94L14.4,2.81c-0.04-0.24-0.24-0.41-0.48-0.41 h-3.84c-0.24,0-0.43,0.17-0.47,0.41L9.25,5.35C8.66,5.59,8.12,5.92,7.63,6.29L5.24,5.33c-0.22-0.08-0.47,0-0.59,0.22L2.74,8.87 C2.62,9.08,2.66,9.34,2.86,9.48l2.03,1.58C4.84,11.36,4.8,11.69,4.8,12s0.02,0.64,0.07,0.94l-2.03,1.58 c-0.18,0.14-0.23,0.41-0.12,0.61l1.92,3.32c0.12,0.22,0.37,0.29,0.59,0.22l2.39-0.96c0.5,0.38,1.03,0.7,1.62,0.94l0.36,2.54 c0.05,0.24,0.24,0.41,0.48,0.41h3.84c0.24,0,0.44-0.17,0.47-0.41l0.36-2.54c0.59-0.24,1.13-0.56,1.62-0.94l2.39,0.96 c0.22,0.08,0.47,0,0.59-0.22l1.92-3.32c0.12-0.22,0.07-0.47-0.12-0.61L19.14,12.94z M12,15.6c-1.98,0-3.6-1.62-3.6-3.6 s1.62-3.6,3.6-3.6s3.6,1.62,3.6,3.6S13.98,15.6,12,15.6z',
|
'settings': 'M19.14,12.94c0.04-0.3,0.06-0.61,0.06-0.94c0-0.32-0.02-0.64-0.07-0.94l2.03-1.58c0.18-0.14,0.23-0.41,0.12-0.61 l-1.92-3.32c-0.12-0.22-0.37-0.29-0.59-0.22l-2.39,0.96c-0.5-0.38-1.03-0.7-1.62-0.94L14.4,2.81c-0.04-0.24-0.24-0.41-0.48-0.41 h-3.84c-0.24,0-0.43,0.17-0.47,0.41L9.25,5.35C8.66,5.59,8.12,5.92,7.63,6.29L5.24,5.33c-0.22-0.08-0.47,0-0.59,0.22L2.74,8.87 C2.62,9.08,2.66,9.34,2.86,9.48l2.03,1.58C4.84,11.36,4.8,11.69,4.8,12s0.02,0.64,0.07,0.94l-2.03,1.58 c-0.18,0.14-0.23,0.41-0.12,0.61l1.92,3.32c0.12,0.22,0.37,0.29,0.59,0.22l2.39-0.96c0.5,0.38,1.03,0.7,1.62,0.94l0.36,2.54 c0.05,0.24,0.24,0.41,0.48,0.41h3.84c0.24,0,0.44-0.17,0.47-0.41l0.36-2.54c0.59-0.24,1.13-0.56,1.62-0.94l2.39,0.96 c0.22,0.08,0.47,0,0.59-0.22l1.92-3.32c0.12-0.22,0.07-0.47-0.12-0.61L19.14,12.94z M12,15.6c-1.98,0-3.6-1.62-3.6-3.6 s1.62-3.6,3.6-3.6s3.6,1.62,3.6,3.6S13.98,15.6,12,15.6z',
|
||||||
'user': 'M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z',
|
'user': 'M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z',
|
||||||
'edit': 'M3 17.25V21h3.75L17.81 9.94l-3.75-3.75L3 17.25zM20.71 7.04c.39-.39.39-1.02 0-1.41l-2.34-2.34c-.39-.39-1.02-.39-1.41 0l-1.83 1.83 3.75 3.75 1.83-1.83z',
|
'edit': 'M3 17.25V21h3.75L17.81 9.94l-3.75-3.75L3 17.25zM20.71 7.04c.39-.39.39-1.02 0-1.41l-2.34-2.34c-.39-.39-1.02-.39-1.41 0l-1.83 1.83 3.75 3.75 1.83-1.83z',
|
||||||
@@ -16,9 +17,12 @@ export const actionIcons = {
|
|||||||
'error': 'M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-2h2v2zm0-4h-2V7h2v6z',
|
'error': 'M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-2h2v2zm0-4h-2V7h2v6z',
|
||||||
'sort-desc': 'M3 12l2-2 7 7 10-10 2 2L12 21z',
|
'sort-desc': 'M3 12l2-2 7 7 10-10 2 2L12 21z',
|
||||||
'sort-asc': 'M12 3l10 10-2 2-7-7-7 7-2-2z',
|
'sort-asc': 'M12 3l10 10-2 2-7-7-7 7-2-2z',
|
||||||
|
'rebuild':'M885.58 554.65c-22.86 0-41.39-18.53-41.39-41.39V182.17c0-22.86 18.53-41.39 41.39-41.39s41.39 18.53 41.39 41.39v331.09c-0.01 22.86-18.54 41.39-41.39 41.39zM140.62 885.74c-22.86 0-41.39-18.53-41.39-41.39V513.26c0-22.86 18.53-41.39 41.39-41.39s41.39 18.53 41.39 41.39v331.09c0 22.86-18.53 41.39-41.39 41.39z" p-id="2634"></path><path d="M513.1 927.12c-228.21 0-413.86-185.65-413.86-413.86 0-22.86 18.53-41.39 41.39-41.39s41.39 18.53 41.39 41.39c0 182.56 148.53 331.09 331.09 331.09 86.23 0 167.89-32.98 229.93-92.86 16.45-15.82 42.66-15.42 58.52 1.05 15.86 16.45 15.4 42.64-1.05 58.52-77.57 74.84-179.64 116.06-287.41 116.06zM885.6 554.65c-22.86 0-41.39-18.53-41.39-41.39 0-182.56-148.53-331.09-331.09-331.09-90.65 0-175.27 35.93-238.25 101.16-15.82 16.51-42.07 16.95-58.5 1.03-16.45-15.86-16.91-42.07-1.03-58.5C294.04 144.3 399.81 99.4 513.12 99.4c228.21 0 413.86 185.65 413.86 413.86 0 22.86-18.53 41.39-41.38 41.39z',
|
||||||
'empty': 'M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-5 14H7v-2h7v2zm3-4H7v-2h10v2zm0-4H7V7h10v2z',
|
'empty': 'M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-5 14H7v-2h7v2zm3-4H7v-2h10v2zm0-4H7V7h10v2z',
|
||||||
'empty2': 'M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-2 15l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z',
|
'empty2': 'M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-2 15l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z',
|
||||||
'refresh': 'M17.65 6.35C16.2 4.9 14.21 4 12 4c-4.42 0-7.99 3.58-7.99 8s3.57 8 7.99 8c3.73 0 6.84-2.55 7.73-6h-2.08c-.82 2.33-3.04 4-5.65 4-3.31 0-6-2.69-6-6s2.69-6 6-6c1.66 0 3.14.69 4.22 1.78L13 11h7V4l-2.35 2.35z',
|
'refresh': 'M17.65 6.35C16.2 4.9 14.21 4 12 4c-4.42 0-7.99 3.58-7.99 8s3.57 8 7.99 8c3.73 0 6.84-2.55 7.73-6h-2.08c-.82 2.33-3.04 4-5.65 4-3.31 0-6-2.69-6-6s2.69-6 6-6c1.66 0 3.14.69 4.22 1.78L13 11h7V4l-2.35 2.35z',
|
||||||
'cleanup': 'M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM19 4h-3.5l-1-1h-5l-1 1H5v2h14V4z',
|
'cleanup': 'M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM19 4h-3.5l-1-1h-5l-1 1H5v2h14V4z',
|
||||||
'down':"M18.414 10.656a2 2 0 0 0-2.828 0L14 12.242V5a2 2 0 0 0-4 0v7.242l-1.586-1.586a2 2 0 1 0-2.828 2.828L12 19.898l6.414-6.414a2 2 0 0 0 0-2.828"
|
'clean': 'M622 112c17.673 0 32 14.327 32 32l-0.001 139H879c17.673 0 32 14.327 32 32v164c0 17.673-14.327 32-32 32h-25.001L854 880c0 17.673-14.327 32-32 32H201c-17.673 0-32-14.327-32-32l-0.001-369H144c-17.673 0-32-14.327-32-32V315c0-17.673 14.327-32 32-32h224.999L369 144c0-17.673 14.327-32 32-32h221z m176 400H225v344h87.343V739.4c0-30.927 25.072-56 56-56V856h115.656L484 739.4c0-30.927 25.072-56 56-56l-0.001 172.6h115L655 739.4c0-30.927 25.072-56 56-56l-0.001 172.6H798V512z m49-165H176v100h671V347zM590 176H433v100h157V176z',
|
||||||
|
'down':'M18.414 10.656a2 2 0 0 0-2.828 0L14 12.242V5a2 2 0 0 0-4 0v7.242l-1.586-1.586a2 2 0 1 0-2.828 2.828L12 19.898l6.414-6.414a2 2 0 0 0 0-2.828',
|
||||||
|
'reset':'M624.593455 23.272727a93.090909 93.090909 0 0 1 93.090909 93.090909v168.587637l143.406545 0.023272a116.363636 116.363636 0 0 1 116.247273 111.313455l0.116363 5.050182V861.090909a116.363636 116.363636 0 0 1-116.363636 116.363636H162.909091a116.363636 116.363636 0 0 1-116.363636-116.363636V401.338182a116.363636 116.363636 0 0 1 116.363636-116.363637l146.664727-0.023272V116.363636a93.090909 93.090909 0 0 1 88.459637-92.974545l4.654545-0.116364zM139.636364 581.818182v279.272727a23.272727 23.272727 0 0 0 23.272727 23.272727h302.545454v-162.909091a46.545455 46.545455 0 1 1 93.09091 0v162.909091h93.090909v-162.909091a46.545455 46.545455 0 1 1 93.090909 0v162.909091h116.363636a23.272727 23.272727 0 0 0 23.272727-23.272727V581.818182H139.636364z m0-93.090909h744.727272v-87.389091a23.272727 23.272727 0 0 0-23.272727-23.272727h-166.679273a69.818182 69.818182 0 0 1-69.818181-69.818182V116.363636h-221.905455v191.883637a69.818182 69.818182 0 0 1-69.818182 69.818182H162.909091a23.272727 23.272727 0 0 0-23.272727 23.272727V488.727273z'
|
||||||
}
|
}
|
||||||
@@ -1,6 +1,12 @@
|
|||||||
// 品牌相关图标
|
// 装饰相关图标
|
||||||
export const brandIcons = {
|
export const brandIcons = {
|
||||||
'home2': 'M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 16H5V5h14v14zM7 12h2v5H7zm4-3h2v8h-2zm4-3h2v11h-2z',
|
'home2': 'M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 16H5V5h14v14zM7 12h2v5H7zm4-3h2v8h-2zm4-3h2v11h-2z',
|
||||||
'home3': 'M20 6h-8l-2-2H4c-1.1 0-1.99.9-1.99 2L2 18c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V8c0-1.1-.9-2-2-2zm0 12H4V8h16v10z',
|
'home3': 'M20 6h-8l-2-2H4c-1.1 0-1.99.9-1.99 2L2 18c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V8c0-1.1-.9-2-2-2zm0 12H4V8h16v10z',
|
||||||
|
'database':'M510.664 0C271.44 0 84 84.352 84 192v640c0 107.648 187.44 192 426.664 192 239.232 0 426.672-84.352 426.672-192V192c0-107.648-187.44-192-426.672-192z m384 832c0 70.616-157.696 149.336-384 149.336s-384-78.72-384-149.336V703.232c68.4 64.08 212.696 107.44 384 107.44s315.608-43.36 384-107.44V832z m0-213.336c0 70.616-157.696 149.336-384 149.336s-384-78.72-384-149.336V489.896c68.4 64.088 212.696 107.44 384 107.44s315.608-43.36 384-107.44v128.768z m0-213.328c0 70.608-157.696 149.336-384 149.336s-384-78.72-384-149.336V276.56C195.064 340.64 339.36 384 510.664 384s315.608-43.352 384-107.44v128.776z m-384-64c-226.304 0-384-78.72-384-149.336 0-70.616 157.696-149.336 384-149.336s384 78.72 384 149.336c0 70.616-157.696 149.336-384 149.336z',
|
||||||
|
'folder-search':'M42.688 106.688H404.48l85.376 106.624h491.52v277.376H896v-192H448.832L363.52 192H128v618.688h405.312V896H42.688V106.688z m736 512a117.312 117.312 0 0 1 83.008 200.192l-0.32 0.384a117.312 117.312 0 1 1-82.688-200.576z m170.304 227.2a202.688 202.688 0 1 0-60.288 60.352l71.232 71.424 60.416-60.224-71.36-71.552z',
|
||||||
|
'layers':'M118.979048 637.074286l137.99619 66.243047 255.171048 123.587048 246.076952-119.222857 147.163429-70.485334a73.142857 73.142857 0 0 1-34.230857 97.109334l-327.119239 158.427428a73.142857 73.142857 0 0 1-63.780571 0L153.136762 734.305524A73.142857 73.142857 0 0 1 118.979048 637.074286z m786.090666-153.063619a73.142857 73.142857 0 0 1-33.913904 97.767619L544.01219 740.205714a73.142857 73.142857 0 0 1-63.780571 0L153.136762 581.778286A73.142857 73.142857 0 0 1 117.51619 487.862857l362.300953 170.886095 32.329143 15.652572 327.119238-158.427429 65.80419-31.939047zM544.036571 139.190857l327.094858 158.403048a73.142857 73.142857 0 0 1 0 131.657143l-327.094858 158.427428a73.142857 73.142857 0 0 1-63.780571 0L153.136762 429.251048a73.142857 73.142857 0 0 1 0-131.657143L480.256 139.215238a73.142857 73.142857 0 0 1 63.780571 0z m-31.890285 65.828572L185.027048 363.422476l327.119238 158.427429 327.119238-158.427429L512.146286 205.04381z',
|
||||||
|
'clock':'M501.84 393.44h16a16 16 0 0 1 16 16v151.584a16 16 0 0 1-6.768 13.072l-84.928 59.952a16 16 0 0 1-22.304-3.84l-9.216-13.072a16 16 0 0 1 3.84-22.304l71.376-50.4V409.44a16 16 0 0 1 16-16z m3.552 458.96C332.304 852.4 192 712.08 192 539.008s140.32-313.392 313.392-313.392c173.088 0 313.392 140.32 313.392 313.392 0 173.088-140.32 313.392-313.392 313.392z m0-48c146.56 0 265.392-118.816 265.392-265.392 0-146.56-118.816-265.392-265.392-265.392-146.56 0-265.392 118.832-265.392 265.392 0 146.576 118.816 265.392 265.392 265.392z m-100.288-617.6l4.752 17.36c4.224 13.632-4.48 17.712-8.784 19.088a333.824 333.824 0 0 0-156.72 106.448c-4.032 4.912-11.408 13.952-26.24 4.528l-11.952-8.688c-11.472-9.088-5.648-17.904-2.176-22.24a381.792 381.792 0 0 1 183.44-126.08c4.608-1.456 13.968-3.344 17.68 9.568z m396.768 137.376l-13.184 9.696c-13.04 8.912-19.84 0.48-23.424-3.904a333.84 333.84 0 0 0-155.12-106.032c-5.44-1.76-15.936-5.376-11.664-23.04l3.728-13.856c5.104-14.64 15.328-11.136 21.008-9.328a381.808 381.808 0 0 1 180.608 123.6c3.616 4.48 11.136 14.288-1.952 22.864z',
|
||||||
|
'trending-up':'M896 298.666667a33.28 33.28 0 0 0 0-8.96 27.306667 27.306667 0 0 0-2.133333-7.253334 46.933333 46.933333 0 0 0-3.84-5.973333 32 32 0 0 0-5.973334-7.253333l-5.12-2.986667a29.44 29.44 0 0 0-8.106666-4.266667h-8.533334A29.866667 29.866667 0 0 0 853.333333 256h-213.333333a42.666667 42.666667 0 0 0 0 85.333333h120.746667l-170.666667 200.96-184.32-109.653333a42.666667 42.666667 0 0 0-54.613333 9.386667l-213.333334 256a42.666667 42.666667 0 0 0 5.546667 60.16A42.666667 42.666667 0 0 0 170.666667 768a42.666667 42.666667 0 0 0 32.853333-15.36l189.866667-227.84 182.186666 109.226667a42.666667 42.666667 0 0 0 54.186667-8.96L810.666667 413.866667V512a42.666667 42.666667 0 0 0 85.333333 0V298.666667z',
|
||||||
|
'trending-down':'M896 512a42.666667 42.666667 0 0 0-85.333333 0v98.133333l-180.906667-213.333333a42.666667 42.666667 0 0 0-54.186667-8.96L393.386667 499.2 203.52 271.36a42.666667 42.666667 0 1 0-65.706667 54.613333l213.333334 256a42.666667 42.666667 0 0 0 54.613333 9.386667l182.613333-109.653333 170.666667 200.96H640a42.666667 42.666667 0 0 0 0 85.333333h213.333333a46.933333 46.933333 0 0 0 15.36-2.986667l5.973334-3.413333a50.773333 50.773333 0 0 0 6.4-3.84 32 32 0 0 0 5.973333-7.253333 46.933333 46.933333 0 0 0 3.84-5.973334 27.306667 27.306667 0 0 0 2.133333-7.253333A33.28 33.28 0 0 0 896 725.333333z',
|
||||||
'github': 'M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z'
|
'github': 'M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z'
|
||||||
}
|
}
|
||||||
@@ -0,0 +1,36 @@
|
|||||||
|
/**
|
||||||
|
* 图标viewBox配置表
|
||||||
|
* 定义不同图标使用的viewBox尺寸
|
||||||
|
*/
|
||||||
|
|
||||||
|
// 默认viewBox尺寸
|
||||||
|
export const DEFAULT_VIEWBOX = '0 0 24 24'
|
||||||
|
|
||||||
|
// 大尺寸viewBox的图标配置
|
||||||
|
export const LARGE_VIEWBOX_ICONS: Record<string, string> = {
|
||||||
|
'clock': '0 0 1024 1024',
|
||||||
|
'rebuild': '0 0 1024 1024',
|
||||||
|
'download': '0 0 1024 1024',
|
||||||
|
'clean': '0 0 1024 1024',
|
||||||
|
'upload': '0 0 1024 1024',
|
||||||
|
'reset': '0 0 1024 1024',
|
||||||
|
'folder-search': '0 0 1024 1024',
|
||||||
|
'layers': '0 0 1024 1024',
|
||||||
|
'trending-up': '0 0 1024 1024',
|
||||||
|
'trending-down': '0 0 1024 1024',
|
||||||
|
'database': '0 0 1024 1024',
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 获取指定图标的viewBox
|
||||||
|
* @param iconName 图标名称
|
||||||
|
* @param customViewBox 自定义viewBox（优先级最高）
|
||||||
|
* @returns viewBox字符串
|
||||||
|
*/
|
||||||
|
export function getIconViewBox(iconName: string, customViewBox?: string): string {
|
||||||
|
if (customViewBox) {
|
||||||
|
return customViewBox
|
||||||
|
}
|
||||||
|
|
||||||
|
return LARGE_VIEWBOX_ICONS[iconName] || DEFAULT_VIEWBOX
|
||||||
|
}
|
||||||
File diff suppressed because it is too large
Load Diff
@@ -134,18 +134,47 @@
|
|||||||
|
|
||||||
<!-- 缓存操作 -->
|
<!-- 缓存操作 -->
|
||||||
<div class="cache-actions">
|
<div class="cache-actions">
|
||||||
<button @click="saveConfig" class="btn btn-primary" :disabled="saving">
|
<!-- 主要操作按钮组 -->
|
||||||
{{ saving ? '保存中...' : '保存配置' }}
|
<div class="action-group primary-actions">
|
||||||
</button>
|
<h6 class="action-group-title">配置管理</h6>
|
||||||
<button @click="clearExpiredCache" class="btn btn-secondary" :disabled="clearing">
|
<div class="action-buttons grid grid-cols-2">
|
||||||
{{ clearing ? '清理中...' : '清理过期缓存' }}
|
<button @click="saveConfig" class="btn btn-primary btn-enhanced" :disabled="saving">
|
||||||
</button>
|
<SvgIcon name="save" class="btn-icon" />
|
||||||
<button @click="clearAllCache" class="btn btn-danger" :disabled="clearing">
|
{{ saving ? '保存中...' : '保存配置' }}
|
||||||
{{ clearing ? '清理中...' : '清理所有缓存' }}
|
</button>
|
||||||
</button>
|
<button @click="refreshToken" class="btn btn-info btn-enhanced" :disabled="refreshing">
|
||||||
<button @click="resetConfig" class="btn btn-warning" :disabled="resetting">
|
<SvgIcon name="refresh" class="btn-icon" />
|
||||||
{{ resetting ? '重置中...' : '重置配置' }}
|
{{ refreshing ? '刷新中...' : '刷新Token' }}
|
||||||
</button>
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 缓存管理按钮组 -->
|
||||||
|
<div class="action-group secondary-actions">
|
||||||
|
<h6 class="action-group-title">缓存管理</h6>
|
||||||
|
<div class="action-buttons grid grid-cols-2">
|
||||||
|
<button @click="clearExpiredCache" class="btn btn-secondary btn-enhanced hover-primary"
|
||||||
|
:disabled="clearing">
|
||||||
|
<SvgIcon name="clean" class="btn-icon" />
|
||||||
|
{{ clearing ? '清理中...' : '清理过期' }}
|
||||||
|
</button>
|
||||||
|
<button @click="clearAllCache" class="btn btn-warning btn-enhanced hover-danger" :disabled="clearing">
|
||||||
|
<SvgIcon name="delete" class="btn-icon" />
|
||||||
|
{{ clearing ? '清理中...' : '清理全部' }}
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 危险操作按钮组 -->
|
||||||
|
<div class="action-group danger-actions">
|
||||||
|
<h6 class="action-group-title">重置操作</h6>
|
||||||
|
<div class="action-buttons">
|
||||||
|
<button @click="resetConfig" class="btn btn-danger btn-enhanced" :disabled="resetting">
|
||||||
|
<SvgIcon name="reset" class="btn-icon" />
|
||||||
|
{{ resetting ? '重置中...' : '重置为默认配置' }}
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -157,6 +186,7 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, computed, onMounted } from 'vue';
|
import { ref, computed, onMounted } from 'vue';
|
||||||
import cacheService, { type CacheConfig, type CacheStats } from '@/services/cache';
|
import cacheService, { type CacheConfig, type CacheStats } from '@/services/cache';
|
||||||
|
import authService from '@/services/auth';
|
||||||
import LoadingSpinner from './LoadingSpinner.vue';
|
import LoadingSpinner from './LoadingSpinner.vue';
|
||||||
import ErrorMessage from './ErrorMessage.vue';
|
import ErrorMessage from './ErrorMessage.vue';
|
||||||
|
|
||||||
@@ -167,6 +197,7 @@ const error = ref<string | null>(null);
|
|||||||
const clearing = ref(false);
|
const clearing = ref(false);
|
||||||
const resetting = ref(false);
|
const resetting = ref(false);
|
||||||
const saving = ref(false);
|
const saving = ref(false);
|
||||||
|
const refreshing = ref(false);
|
||||||
const successMessage = ref<string | null>(null);
|
const successMessage = ref<string | null>(null);
|
||||||
|
|
||||||
// 数据
|
// 数据
|
||||||
@@ -448,6 +479,24 @@ const resetConfig = async () => {
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const refreshToken = async () => {
|
||||||
|
try {
|
||||||
|
refreshing.value = true;
|
||||||
|
error.value = null;
|
||||||
|
const response = await authService.refreshToken();
|
||||||
|
if (response.success) {
|
||||||
|
showSuccess('Token刷新成功');
|
||||||
|
} else {
|
||||||
|
error.value = response.error || 'Token刷新失败';
|
||||||
|
}
|
||||||
|
} catch (err) {
|
||||||
|
error.value = err instanceof Error ? err.message : 'Token刷新失败';
|
||||||
|
console.error('Token刷新失败:', err);
|
||||||
|
} finally {
|
||||||
|
refreshing.value = false;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
const clearError = () => {
|
const clearError = () => {
|
||||||
error.value = null;
|
error.value = null;
|
||||||
};
|
};
|
||||||
@@ -490,56 +539,63 @@ onMounted(() => {
|
|||||||
width: 3.5rem;
|
width: 3.5rem;
|
||||||
height: 3.5rem;
|
height: 3.5rem;
|
||||||
border-radius: 50%;
|
border-radius: 50%;
|
||||||
background: #3b82f6;
|
background: var(--color-primary, #3b82f6);
|
||||||
color: white;
|
color: white;
|
||||||
border: none;
|
border: none;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
box-shadow: 0 4px 12px rgba(59, 130, 246, 0.3);
|
box-shadow: var(--shadow-lg, 0 4px 12px rgba(59, 130, 246, 0.3));
|
||||||
transition: all 0.3s ease;
|
transition: all var(--transition-normal, 0.3s ease);
|
||||||
position: relative;
|
position: relative;
|
||||||
}
|
}
|
||||||
|
|
||||||
.settings-toggle:hover {
|
.settings-toggle:hover {
|
||||||
background: #2563eb;
|
background: var(--color-primary-hover, #2563eb);
|
||||||
transform: translateY(-2px);
|
transform: translateY(-2px);
|
||||||
box-shadow: 0 6px 16px rgba(59, 130, 246, 0.4);
|
box-shadow: var(--shadow-xl, 0 6px 16px rgba(59, 130, 246, 0.4));
|
||||||
}
|
}
|
||||||
|
|
||||||
.settings-toggle.active {
|
.settings-toggle.active {
|
||||||
background: #1d4ed8;
|
background: var(--color-primary-active, #1d4ed8);
|
||||||
|
box-shadow: var(--shadow-inner, inset 0 2px 4px rgba(0, 0, 0, 0.1));
|
||||||
}
|
}
|
||||||
|
|
||||||
.settings-icon {
|
.settings-icon {
|
||||||
width: 1.5rem;
|
width: 1.5rem;
|
||||||
height: 1.5rem;
|
height: 1.5rem;
|
||||||
|
transition: transform var(--transition-normal);
|
||||||
|
}
|
||||||
|
|
||||||
|
.settings-toggle.active .settings-icon {
|
||||||
|
transform: rotate(45deg);
|
||||||
}
|
}
|
||||||
|
|
||||||
.settings-panel {
|
.settings-panel {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
bottom: 4rem;
|
bottom: 4rem;
|
||||||
right: 0;
|
right: 0;
|
||||||
width: 400px;
|
width: 420px;
|
||||||
max-height: 600px;
|
max-height: 650px;
|
||||||
background: white;
|
background: var(--color-bg-primary, white);
|
||||||
border-radius: 1rem;
|
border-radius: var(--radius-xl, 1rem);
|
||||||
box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
|
box-shadow: var(--shadow-2xl, 0 10px 25px rgba(0, 0, 0, 0.15));
|
||||||
border: 1px solid #e5e7eb;
|
border: 1px solid var(--color-border, #e5e7eb);
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
animation: slideUp 0.3s ease-out;
|
animation: slideUp 0.3s ease-out;
|
||||||
|
backdrop-filter: blur(10px);
|
||||||
}
|
}
|
||||||
|
|
||||||
@keyframes slideUp {
|
@keyframes slideUp {
|
||||||
from {
|
from {
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
transform: translateY(20px);
|
transform: translateY(20px) scale(0.95);
|
||||||
}
|
}
|
||||||
|
|
||||||
to {
|
to {
|
||||||
opacity: 1;
|
opacity: 1;
|
||||||
transform: translateY(0);
|
transform: translateY(0) scale(1);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -547,31 +603,54 @@ onMounted(() => {
|
|||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
padding: 1.5rem;
|
padding: var(--spacing-xl, 1.5rem);
|
||||||
border-bottom: 1px solid #e5e7eb;
|
border-bottom: 1px solid var(--color-border, #e5e7eb);
|
||||||
background: #f9fafb;
|
background: var(--color-bg-secondary, #f9fafb);
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.settings-header::before {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
height: 3px;
|
||||||
|
background: linear-gradient(90deg, var(--color-primary), var(--color-info), var(--color-success));
|
||||||
}
|
}
|
||||||
|
|
||||||
.settings-header h3 {
|
.settings-header h3 {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
font-size: 1.25rem;
|
font-size: 1.25rem;
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
color: #1f2937;
|
color: var(--color-text-primary, #1f2937);
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: var(--spacing-sm);
|
||||||
|
}
|
||||||
|
|
||||||
|
.settings-header h3::before {
|
||||||
|
content: '⚙️';
|
||||||
|
font-size: 1.125rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.close-btn {
|
.close-btn {
|
||||||
background: none;
|
background: none;
|
||||||
border: none;
|
border: none;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
padding: 0.5rem;
|
padding: var(--spacing-sm, 0.5rem);
|
||||||
border-radius: 0.375rem;
|
border-radius: var(--radius-md, 0.375rem);
|
||||||
color: #6b7280;
|
color: var(--color-text-secondary, #6b7280);
|
||||||
transition: all 0.2s;
|
transition: all var(--transition-normal);
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.close-btn:hover {
|
.close-btn:hover {
|
||||||
background: #e5e7eb;
|
background: var(--color-bg-hover, #e5e7eb);
|
||||||
color: #374151;
|
color: var(--color-text-primary, #374151);
|
||||||
|
transform: scale(1.1);
|
||||||
}
|
}
|
||||||
|
|
||||||
.close-icon {
|
.close-icon {
|
||||||
@@ -580,45 +659,98 @@ onMounted(() => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.settings-content {
|
.settings-content {
|
||||||
padding: 1.5rem;
|
padding: var(--spacing-xl, 1.5rem);
|
||||||
max-height: 500px;
|
max-height: 550px;
|
||||||
overflow-y: auto;
|
overflow-y: auto;
|
||||||
|
scrollbar-width: thin;
|
||||||
|
scrollbar-color: var(--color-border) transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
.settings-content::-webkit-scrollbar {
|
||||||
|
width: 6px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.settings-content::-webkit-scrollbar-track {
|
||||||
|
background: transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
.settings-content::-webkit-scrollbar-thumb {
|
||||||
|
background: var(--color-border);
|
||||||
|
border-radius: 3px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.settings-content::-webkit-scrollbar-thumb:hover {
|
||||||
|
background: var(--color-border-hover);
|
||||||
}
|
}
|
||||||
|
|
||||||
.settings-section {
|
.settings-section {
|
||||||
margin-bottom: 2rem;
|
margin-bottom: var(--spacing-2xl, 2rem);
|
||||||
}
|
}
|
||||||
|
|
||||||
.settings-section h4 {
|
.settings-section h4 {
|
||||||
margin: 0 0 1rem 0;
|
margin: 0 0 var(--spacing-lg) 0;
|
||||||
font-size: 1.125rem;
|
font-size: 1.125rem;
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
color: #1f2937;
|
color: var(--color-text-primary, #1f2937);
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: var(--spacing-sm);
|
||||||
|
}
|
||||||
|
|
||||||
|
.settings-section h4::before {
|
||||||
|
content: '';
|
||||||
|
width: 4px;
|
||||||
|
height: 20px;
|
||||||
|
background: var(--color-primary);
|
||||||
|
border-radius: 2px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.loading {
|
.loading {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
padding: 2rem;
|
padding: var(--spacing-2xl, 2rem);
|
||||||
}
|
}
|
||||||
|
|
||||||
.error {
|
.error {
|
||||||
margin-bottom: 1rem;
|
margin-bottom: var(--spacing-lg, 1rem);
|
||||||
}
|
}
|
||||||
|
|
||||||
.success-message {
|
.success-message {
|
||||||
background: #10b981;
|
background: var(--color-success, #10b981);
|
||||||
color: white;
|
color: white;
|
||||||
padding: 0.75rem 1rem;
|
padding: var(--spacing-md) var(--spacing-lg);
|
||||||
border-radius: 0.5rem;
|
border-radius: var(--radius-md, 0.5rem);
|
||||||
margin-bottom: 1rem;
|
margin-bottom: var(--spacing-lg, 1rem);
|
||||||
animation: slideIn 0.3s ease-out;
|
animation: slideIn 0.3s ease-out;
|
||||||
|
position: relative;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.success-message::before {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: -100%;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
|
||||||
|
animation: shimmer 2s infinite;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes shimmer {
|
||||||
|
0% {
|
||||||
|
left: -100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
left: 100%;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.success-content {
|
.success-content {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
gap: 0.5rem;
|
gap: var(--spacing-sm, 0.5rem);
|
||||||
}
|
}
|
||||||
|
|
||||||
.success-icon {
|
.success-icon {
|
||||||
@@ -640,18 +772,31 @@ onMounted(() => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.cache-stats {
|
.cache-stats {
|
||||||
background: #f9fafb;
|
background: var(--color-bg-secondary, #f9fafb);
|
||||||
border-radius: 0.5rem;
|
border-radius: var(--radius-lg, 0.5rem);
|
||||||
padding: 1rem;
|
padding: var(--spacing-lg, 1rem);
|
||||||
margin-bottom: 1.5rem;
|
margin-bottom: var(--spacing-xl, 1.5rem);
|
||||||
border: 1px solid #e5e7eb;
|
border: 1px solid var(--color-border, #e5e7eb);
|
||||||
|
position: relative;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cache-stats::before {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
height: 2px;
|
||||||
|
background: linear-gradient(90deg, var(--color-info), var(--color-success));
|
||||||
}
|
}
|
||||||
|
|
||||||
.stat-item {
|
.stat-item {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
margin-bottom: 0.5rem;
|
margin-bottom: var(--spacing-sm, 0.5rem);
|
||||||
|
padding: var(--spacing-xs, 0.25rem) 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.stat-item:last-child {
|
.stat-item:last-child {
|
||||||
@@ -659,78 +804,245 @@ onMounted(() => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.stat-label {
|
.stat-label {
|
||||||
color: #6b7280;
|
color: var(--color-text-secondary, #6b7280);
|
||||||
font-size: 0.875rem;
|
font-size: 0.875rem;
|
||||||
|
font-weight: 500;
|
||||||
}
|
}
|
||||||
|
|
||||||
.stat-value {
|
.stat-value {
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
color: #1f2937;
|
color: var(--color-text-primary, #1f2937);
|
||||||
|
font-family: var(--font-mono, 'Courier New', monospace);
|
||||||
|
text-align: center;
|
||||||
|
justify-content: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.config-form {
|
.config-form {
|
||||||
margin-bottom: 1.5rem;
|
margin-bottom: var(--spacing-xl, 1.5rem);
|
||||||
}
|
}
|
||||||
|
|
||||||
.form-group {
|
.form-group {
|
||||||
margin-bottom: 1rem;
|
margin-bottom: var(--spacing-lg, 1rem);
|
||||||
}
|
}
|
||||||
|
|
||||||
.form-group label {
|
.form-group label {
|
||||||
display: block;
|
display: block;
|
||||||
margin-bottom: 0.5rem;
|
margin-bottom: var(--spacing-sm, 0.5rem);
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
color: #374151;
|
color: var(--color-text-primary, #374151);
|
||||||
font-size: 0.875rem;
|
font-size: 0.875rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.form-group input[type="number"],
|
.form-group input[type="number"],
|
||||||
.form-group input[type="text"] {
|
.form-group input[type="text"] {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
padding: 0.5rem 0.75rem;
|
padding: var(--spacing-sm) var(--spacing-md);
|
||||||
border: 1px solid #d1d5db;
|
border: 1px solid var(--color-border, #d1d5db);
|
||||||
border-radius: 0.375rem;
|
border-radius: var(--radius-md, 0.375rem);
|
||||||
font-size: 0.875rem;
|
font-size: 0.875rem;
|
||||||
transition: border-color 0.2s;
|
transition: all var(--transition-normal);
|
||||||
|
background: var(--color-bg-primary, white);
|
||||||
}
|
}
|
||||||
|
|
||||||
.form-group input[type="number"]:focus,
|
.form-group input[type="number"]:focus,
|
||||||
.form-group input[type="text"]:focus {
|
.form-group input[type="text"]:focus {
|
||||||
outline: none;
|
outline: none;
|
||||||
border-color: #3b82f6;
|
border-color: var(--color-primary, #3b82f6);
|
||||||
box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
|
box-shadow: 0 0 0 3px var(--color-primary-alpha, rgba(59, 130, 246, 0.1));
|
||||||
|
transform: translateY(-1px);
|
||||||
}
|
}
|
||||||
|
|
||||||
.form-group input[type="checkbox"] {
|
.form-group input[type="checkbox"] {
|
||||||
margin-right: 0.5rem;
|
margin-right: var(--spacing-sm, 0.5rem);
|
||||||
|
transform: scale(1.1);
|
||||||
}
|
}
|
||||||
|
|
||||||
.config-section {
|
.config-section {
|
||||||
margin-bottom: 1.5rem;
|
margin-bottom: var(--spacing-xl, 1.5rem);
|
||||||
padding: 1rem;
|
padding: var(--spacing-lg, 1rem);
|
||||||
background: #f8fafc;
|
background: var(--color-bg-tertiary, #f8fafc);
|
||||||
border-radius: 0.5rem;
|
border-radius: var(--radius-lg, 0.5rem);
|
||||||
border: 1px solid #e2e8f0;
|
border: 1px solid var(--color-border-light, #e2e8f0);
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.config-section::before {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 3px;
|
||||||
|
height: 100%;
|
||||||
|
background: var(--color-info);
|
||||||
|
border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.config-section h5 {
|
.config-section h5 {
|
||||||
margin: 0 0 1rem 0;
|
margin: 0 0 var(--spacing-lg) 0;
|
||||||
font-size: 1rem;
|
font-size: 1rem;
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
color: #2d3748;
|
color: var(--color-text-primary, #2d3748);
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: var(--spacing-sm);
|
||||||
|
}
|
||||||
|
|
||||||
|
.config-section h5::before {
|
||||||
|
content: '📊';
|
||||||
|
font-size: 0.875rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.form-help {
|
.form-help {
|
||||||
display: block;
|
display: block;
|
||||||
font-size: 0.75rem;
|
font-size: 0.75rem;
|
||||||
color: #718096;
|
color: var(--color-text-tertiary, #718096);
|
||||||
margin-top: 0.25rem;
|
margin-top: var(--spacing-xs, 0.25rem);
|
||||||
|
font-style: italic;
|
||||||
}
|
}
|
||||||
|
|
||||||
.cache-actions {
|
.cache-actions {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
gap: 0.75rem;
|
gap: var(--spacing-xl);
|
||||||
|
margin-top: var(--spacing-xl);
|
||||||
|
}
|
||||||
|
|
||||||
|
.action-group {
|
||||||
|
background: var(--color-bg-secondary);
|
||||||
|
border-radius: var(--radius-lg);
|
||||||
|
padding: var(--spacing-lg);
|
||||||
|
border: 1px solid var(--color-border);
|
||||||
|
transition: all var(--transition-normal);
|
||||||
|
}
|
||||||
|
|
||||||
|
.action-group:hover {
|
||||||
|
box-shadow: var(--shadow-sm);
|
||||||
|
border-color: var(--color-border-hover);
|
||||||
|
}
|
||||||
|
|
||||||
|
.action-group-title {
|
||||||
|
margin: 0 0 var(--spacing-md) 0;
|
||||||
|
font-size: 0.875rem;
|
||||||
|
font-weight: 600;
|
||||||
|
color: var(--color-text-secondary);
|
||||||
|
text-transform: uppercase;
|
||||||
|
letter-spacing: 0.05em;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: var(--spacing-sm);
|
||||||
|
}
|
||||||
|
|
||||||
|
.action-group-title::before {
|
||||||
|
content: '';
|
||||||
|
width: 3px;
|
||||||
|
height: 12px;
|
||||||
|
border-radius: 2px;
|
||||||
|
background: var(--color-primary);
|
||||||
|
}
|
||||||
|
|
||||||
|
.primary-actions .action-group-title::before {
|
||||||
|
background: var(--color-primary);
|
||||||
|
}
|
||||||
|
|
||||||
|
.secondary-actions .action-group-title::before {
|
||||||
|
background: var(--color-info);
|
||||||
|
}
|
||||||
|
|
||||||
|
.danger-actions .action-group-title::before {
|
||||||
|
background: var(--color-danger);
|
||||||
|
}
|
||||||
|
|
||||||
|
.action-buttons {
|
||||||
|
gap: var(--spacing-md);
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-icon {
|
||||||
|
width: 1rem;
|
||||||
|
height: 1rem;
|
||||||
|
margin-right: var(--spacing-sm);
|
||||||
|
flex-shrink: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 使用主题中的按钮增强样式 */
|
||||||
|
.btn-enhanced {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
font-size: 0.875rem;
|
||||||
|
font-weight: 500;
|
||||||
|
padding: var(--spacing-md) var(--spacing-lg);
|
||||||
|
border-radius: var(--radius-md);
|
||||||
|
transition: all var(--transition-normal);
|
||||||
|
position: relative;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-enhanced::before {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: -100%;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
|
||||||
|
transition: left 0.5s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-enhanced:hover::before {
|
||||||
|
left: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-enhanced:hover:not(:disabled) {
|
||||||
|
transform: translateY(-1px);
|
||||||
|
box-shadow: var(--shadow-md);
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-enhanced:active:not(:disabled) {
|
||||||
|
transform: translateY(0);
|
||||||
|
box-shadow: var(--shadow-sm);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 特殊悬停效果 */
|
||||||
|
.hover-primary:hover:not(:disabled) {
|
||||||
|
background: var(--color-primary) !important;
|
||||||
|
color: white !important;
|
||||||
|
border-color: var(--color-primary) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hover-danger:hover:not(:disabled) {
|
||||||
|
background: var(--color-danger) !important;
|
||||||
|
color: white !important;
|
||||||
|
border-color: var(--color-danger) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 网格布局适配 */
|
||||||
|
.grid {
|
||||||
|
display: grid;
|
||||||
|
}
|
||||||
|
|
||||||
|
.grid-cols-2 {
|
||||||
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 响应式优化 */
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
.action-buttons.grid-cols-2 {
|
||||||
|
grid-template-columns: 1fr;
|
||||||
|
}
|
||||||
|
|
||||||
|
.action-group {
|
||||||
|
padding: var(--spacing-md);
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-enhanced {
|
||||||
|
padding: var(--spacing-md);
|
||||||
|
font-size: 0.8rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-icon {
|
||||||
|
width: 0.875rem;
|
||||||
|
height: 0.875rem;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.btn {
|
.btn {
|
||||||
@@ -787,6 +1099,15 @@ onMounted(() => {
|
|||||||
background: #d97706;
|
background: #d97706;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.btn-info {
|
||||||
|
background: #06b6d4;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-info:hover:not(:disabled) {
|
||||||
|
background: #0891b2;
|
||||||
|
}
|
||||||
|
|
||||||
@media (max-width: 768px) {
|
@media (max-width: 768px) {
|
||||||
.settings-widget {
|
.settings-widget {
|
||||||
bottom: 1rem;
|
bottom: 1rem;
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
<template>
|
<template>
|
||||||
<svg :viewBox="viewBox" :fill="fill" v-bind="$attrs">
|
<svg :viewBox="viewBox" :fill="fill" :width="displayWidth" :height="displayHeight" v-bind="$attrs">
|
||||||
<path v-if="iconData" :d="iconData" />
|
<path v-if="iconData" :d="iconData" />
|
||||||
</svg>
|
</svg>
|
||||||
</template>
|
</template>
|
||||||
@@ -7,19 +7,38 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { computed } from 'vue'
|
import { computed } from 'vue'
|
||||||
import { iconRegistry } from '@/assets/icons'
|
import { iconRegistry } from '@/assets/icons'
|
||||||
|
import { getIconViewBox } from '@/assets/icons/viewbox-config'
|
||||||
|
|
||||||
interface Props {
|
interface Props {
|
||||||
name: string
|
name: string
|
||||||
viewBox?: string
|
viewBox?: string
|
||||||
fill?: string
|
fill?: string
|
||||||
|
width?: string | number
|
||||||
|
height?: string | number
|
||||||
}
|
}
|
||||||
|
|
||||||
const props = withDefaults(defineProps<Props>(), {
|
const props = withDefaults(defineProps<Props>(), {
|
||||||
viewBox: '0 0 24 24',
|
viewBox: undefined,
|
||||||
fill: 'currentColor'
|
fill: 'currentColor',
|
||||||
|
width: undefined,
|
||||||
|
height: undefined
|
||||||
})
|
})
|
||||||
|
|
||||||
const iconData = computed(() => {
|
const iconData = computed(() => {
|
||||||
return iconRegistry[props.name] || ''
|
return iconRegistry[props.name] || ''
|
||||||
})
|
})
|
||||||
|
|
||||||
|
// 使用配置表来获取合适的viewBox
|
||||||
|
const viewBox = computed(() => {
|
||||||
|
return getIconViewBox(props.name, props.viewBox)
|
||||||
|
})
|
||||||
|
|
||||||
|
// 统一默认大小为24px，如果没有指定width/height则使用默认值
|
||||||
|
const displayWidth = computed(() => {
|
||||||
|
return props.width ? (typeof props.width === 'number' ? `${props.width}px` : props.width) : '24px'
|
||||||
|
})
|
||||||
|
|
||||||
|
const displayHeight = computed(() => {
|
||||||
|
return props.height ? (typeof props.height === 'number' ? `${props.height}px` : props.height) : '24px'
|
||||||
|
})
|
||||||
</script>
|
</script>
|
||||||
@@ -47,6 +47,13 @@ class AuthService {
|
|||||||
return apiService.post('/api/auth/relogin');
|
return apiService.post('/api/auth/relogin');
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 手动刷新token
|
||||||
|
*/
|
||||||
|
async refreshToken(): Promise<ApiResponse> {
|
||||||
|
return apiService.post('/api/auth/refresh-token');
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 登出
|
* 登出
|
||||||
*/
|
*/
|
||||||
@@ -56,4 +63,4 @@ class AuthService {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export const authService = new AuthService();
|
export const authService = new AuthService();
|
||||||
export default authService;
|
export default authService;
|
||||||
Reference in New Issue
Block a user