refactor: use formkit

Signed-off-by: Ryan Wang <i@ryanc.cc>
pull/588/head
Ryan Wang 2022-07-06 14:31:42 +08:00
parent abe0f3787d
commit d4f40481ab
6 changed files with 338 additions and 305 deletions

View File

@ -25,6 +25,8 @@
"packages/*"
],
"dependencies": {
"@formkit/themes": "1.0.0-beta.9",
"@formkit/vue": "1.0.0-beta.9",
"@halo-dev/admin-api": "^1.1.0",
"@halo-dev/admin-shared": "workspace:*",
"@halo-dev/components": "workspace:*",

View File

@ -4,6 +4,8 @@ importers:
.:
specifiers:
'@formkit/themes': 1.0.0-beta.9
'@formkit/vue': 1.0.0-beta.9
'@halo-dev/admin-api': ^1.1.0
'@halo-dev/admin-shared': workspace:*
'@halo-dev/components': workspace:*
@ -60,6 +62,8 @@ importers:
vue-router: ^4.0.16
vue-tsc: ^0.38.2
dependencies:
'@formkit/themes': 1.0.0-beta.9_tailwindcss@3.1.4
'@formkit/vue': 1.0.0-beta.9_rkpirzljteu3gouykqigqhmb7i
'@halo-dev/admin-api': 1.1.0
'@halo-dev/admin-shared': link:packages/shared
'@halo-dev/components': link:packages/components
@ -1455,6 +1459,98 @@ packages:
dependencies:
'@floating-ui/core': 0.3.1
/@formkit/core/1.0.0-beta.9:
resolution: {integrity: sha512-TFU2dTY/0DS9CLv0djwG0WgfSX1Hx0hvLzqCZWSx2Jw0ivO4jtMOEJjagy4LZSEvrE8yu4MTolZVSi3PbEEXug==}
dependencies:
'@formkit/utils': 1.0.0-beta.9
dev: false
/@formkit/dev/1.0.0-beta.9:
resolution: {integrity: sha512-8SVN3uZSUot02rA0Kg4wssjHTIgUwzAlwJKf90fFNdztFIMo1QYoQ36HA2tssoHUHVuRO/39lLh3eIkIx7Cx+A==}
dependencies:
'@formkit/core': 1.0.0-beta.9
'@formkit/utils': 1.0.0-beta.9
dev: false
/@formkit/i18n/1.0.0-beta.9:
resolution: {integrity: sha512-l5AkMZ2+trFuXFbuc8Pzrbntg3HAtf/tqV2lG75IAYSOTQlpTsOC5GWF0Hxly9LaKpzdTHAUJBQjEqD5pQwqsA==}
dependencies:
'@formkit/core': 1.0.0-beta.9
'@formkit/utils': 1.0.0-beta.9
'@formkit/validation': 1.0.0-beta.9
dev: false
/@formkit/inputs/1.0.0-beta.9:
resolution: {integrity: sha512-a+SLj/RtfuM23eUYJJeW1V99ga1FfwDE8raNT/DV4lURikdvg4XU2OJT3ZL3Q0UCK/CI70sdIskudEzk8NESmA==}
dependencies:
'@formkit/core': 1.0.0-beta.9
dev: false
/@formkit/observer/1.0.0-beta.9:
resolution: {integrity: sha512-7xfA+9OWsdHTi/Z2zAotqDhKWpToyGoFMjyTw1dnWLh2sphq/+05Lpi/UcLCrX+uvYQjKtGkUBNH+EyjXZ1wPA==}
dependencies:
'@formkit/core': 1.0.0-beta.9
'@formkit/utils': 1.0.0-beta.9
dev: false
/@formkit/rules/1.0.0-beta.9:
resolution: {integrity: sha512-8h7eAQ9Iw4V1dV+U9NXV6L6BaOoitCv33VAgBO2muQaHf/KAOWq5Hebkm1OXt8N/o6f42KrsCIU8VuPbe5P0fA==}
dependencies:
'@formkit/core': 1.0.0-beta.9
'@formkit/utils': 1.0.0-beta.9
'@formkit/validation': 1.0.0-beta.9
dev: false
/@formkit/themes/1.0.0-beta.9_tailwindcss@3.1.4:
resolution: {integrity: sha512-FF5M6X9B6mjxxMOYBkCTd0QhGZtPRXMMCtyDWDOwqKUPXf5+CVfwbTgicO3rSF2AMzeP9K+9wmvoniECKqgvAA==}
peerDependencies:
tailwindcss: ^3.0.0
unocss: ^0.31.0
windicss: ^3.0.0
peerDependenciesMeta:
tailwindcss:
optional: true
unocss:
optional: true
windicss:
optional: true
dependencies:
'@formkit/core': 1.0.0-beta.9
tailwindcss: 3.1.4
dev: false
/@formkit/utils/1.0.0-beta.9:
resolution: {integrity: sha512-kl+saz6zEMCv/LM5LAsZC5fEACbuINTztmINQYDFhMxURA5MF5gM5p+Vj9kIa+Owwc/SN/YLREI8rAPT/qfNmg==}
dev: false
/@formkit/validation/1.0.0-beta.9:
resolution: {integrity: sha512-qhorOzyZJmjm7jqXHaJUBjQeQxGVpvWVkH0kgyuLodE4tUUdK61DQ/b0qEL0gmdE4yh3GJpeVZfv1bp75nbzZg==}
dependencies:
'@formkit/core': 1.0.0-beta.9
'@formkit/observer': 1.0.0-beta.9
dev: false
/@formkit/vue/1.0.0-beta.9_rkpirzljteu3gouykqigqhmb7i:
resolution: {integrity: sha512-qhhte5JyUIkPBmk5EjWxSiKuOzir/0vi+lBEpfSa1KykyDhelcNtrVWcFI7qjhYhRj+7P/sF6Eo5/EFGfIznYQ==}
peerDependencies:
vue: ^3.2.1
dependencies:
'@formkit/core': 1.0.0-beta.9
'@formkit/dev': 1.0.0-beta.9
'@formkit/i18n': 1.0.0-beta.9
'@formkit/inputs': 1.0.0-beta.9
'@formkit/observer': 1.0.0-beta.9
'@formkit/rules': 1.0.0-beta.9
'@formkit/themes': 1.0.0-beta.9_tailwindcss@3.1.4
'@formkit/utils': 1.0.0-beta.9
'@formkit/validation': 1.0.0-beta.9
vue: 3.2.37
transitivePeerDependencies:
- tailwindcss
- unocss
- windicss
dev: false
/@halo-dev/admin-api/1.1.0:
resolution: {integrity: sha512-2K8ulSucPudWfBo8SWz92hLtlu8C7hVVfYNejlns0BZfMxFyivvGyTgeYiMYHgNR5n4K6tF903Zn1DkS7jnv0g==}
engines: {node: '>=12'}
@ -1853,12 +1949,10 @@ packages:
dependencies:
'@nodelib/fs.stat': 2.0.5
run-parallel: 1.2.0
dev: true
/@nodelib/fs.stat/2.0.5:
resolution: {integrity: sha512-RkhPPp2zrqDAQA/2jNhnztcPAlv64XdhIp7a7454A5ovI7Bukxgt7MX7udwAu3zg1DcpPU0rz3VV1SeaqvY4+A==}
engines: {node: '>= 8'}
dev: true
/@nodelib/fs.walk/1.2.8:
resolution: {integrity: sha512-oGB+UxlgWcgQkgwo8GcEGwemoTFt3FIO9ababBmaGwXIoBKZ+GTy0pP185beGg7Llih/NSHSV2XAs1lnznocSg==}
@ -1866,7 +1960,6 @@ packages:
dependencies:
'@nodelib/fs.scandir': 2.1.5
fastq: 1.13.0
dev: true
/@polka/url/1.0.0-next.21:
resolution: {integrity: sha512-a5Sab1C4/icpTZVzZc5Ghpz88yQtGOyNqYXcZgOssB2uuAr+wF/MvN6bgtW32q7HHrvBki+BsZ0OuNv6EV3K9g==}
@ -2574,18 +2667,15 @@ packages:
acorn: 7.4.1
acorn-walk: 7.2.0
xtend: 4.0.2
dev: true
/acorn-walk/7.2.0:
resolution: {integrity: sha512-OPdCF6GsMIP+Az+aWfAAOEt2/+iVDKE7oy6lJ098aoe59oAmK76qV6Gw60SbZ8jHuG2wH058GF4pLFbYamYrVA==}
engines: {node: '>=0.4.0'}
dev: true
/acorn/7.4.1:
resolution: {integrity: sha512-nQyp0o1/mNdbTO1PO6kHkwSrmgZ0MT/jCCpNiwbUjGoRN4dlBhqJtoQuCnEOKzgTVwg0ZWiCoQy6SxMebQVh8A==}
engines: {node: '>=0.4.0'}
hasBin: true
dev: true
/acorn/8.7.0:
resolution: {integrity: sha512-V/LGr1APy+PXIwKebEWrkZPwoeoF+w1jiOBUmuxuiUIaOHtob8Qc9BTrYo7VuI5fR8tqsy+buA2WFooR5olqvQ==}
@ -2671,7 +2761,6 @@ packages:
dependencies:
normalize-path: 3.0.0
picomatch: 2.3.1
dev: true
/arch/2.2.0:
resolution: {integrity: sha512-Of/R0wqp83cgHozfIYLbBMnej79U/SVGOOyuB3VVFv1NRM/PSFMK12x9KVtiYzJqmnU5WR2qp0Z5rHb7sWGnFQ==}
@ -2679,7 +2768,6 @@ packages:
/arg/5.0.2:
resolution: {integrity: sha512-PYjyFOLKQ9y57JvQ6QLo8dAgNqswh8M1RMJYdQduT6xbWSgK36P/Z/v+p888pM69jMMfS8Xd8F6I1kQ/I9HUGg==}
dev: true
/argparse/1.0.10:
resolution: {integrity: sha512-o5Roy6tNG4SL/FOkCAN6RzjiakZS25RLYFrcMttJqbdd8BWrnA+fGz57iN5Pb06pvBGvl5gQ0B48dJlslXvoTg==}
@ -2844,7 +2932,6 @@ packages:
/binary-extensions/2.2.0:
resolution: {integrity: sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==}
engines: {node: '>=8'}
dev: true
/birpc/0.1.1:
resolution: {integrity: sha512-B64AGL4ug2IS2jvV/zjTYDD1L+2gOJTT7Rv+VaK7KVQtQOo/xZbCDsh7g727ipckmU+QJYRqo5RcifVr0Kgcmg==}
@ -2880,7 +2967,6 @@ packages:
engines: {node: '>=8'}
dependencies:
fill-range: 7.0.1
dev: true
/browser-process-hrtime/1.0.0:
resolution: {integrity: sha512-9o5UecI3GhkpM6DrXr69PblIuWxPKk9Y0jHBRhdocZ2y7YECBFCsHm79Pr3OyR2AvjhDkabFJaDJMYRazHgsow==}
@ -2968,7 +3054,6 @@ packages:
/camelcase-css/2.0.1:
resolution: {integrity: sha512-QOSvevhslijgYwRx6Rv7zKdMF8lbRmx+uQGx2+vDc+KI/eBnsy9kit5aj23AgGu3pa4t9AgwbnXWqS+iOY+2aA==}
engines: {node: '>= 6'}
dev: true
/camelcase/6.3.0:
resolution: {integrity: sha512-Gmy6FhYlCY7uOElZUSbxo2UCDH8owEk996gkbrpsgGtrJLM3J7jGxl9Ic7Qwwj4ivOE5AWZWRMecDdF7hqGjFA==}
@ -3044,7 +3129,6 @@ packages:
readdirp: 3.6.0
optionalDependencies:
fsevents: 2.3.2
dev: true
/ci-info/3.3.0:
resolution: {integrity: sha512-riT/3vI5YpVH6/qomlDnJow6TBee2PBKSEpx3O32EGPYbWGIRsIlGRms3Sm74wYE1JMo8RnO04Hb12+v1J5ICw==}
@ -3112,7 +3196,6 @@ packages:
/color-name/1.1.4:
resolution: {integrity: sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==}
dev: true
/colorette/2.0.16:
resolution: {integrity: sha512-hUewv7oMjCp+wkBv5Rm0v87eJhq4woh5rSR+42YSQJKecCqgIqNkZ6lAlQms/BwHPJA5NKMRlpxPRv0n8HQW6g==}
@ -3219,7 +3302,6 @@ packages:
resolution: {integrity: sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==}
engines: {node: '>=4'}
hasBin: true
dev: true
/cssom/0.3.8:
resolution: {integrity: sha512-b0tGHbfegbhPJpxpiBPU2sCkigAqtM9O121le6bbOlgyV+NyGyCmVfJ6QW9eRjz8CpNfWEOYBIMIGRYkLwsIYg==}
@ -3411,7 +3493,6 @@ packages:
/defined/1.0.0:
resolution: {integrity: sha512-Y2caI5+ZwS5c3RiNDJ6u53VhQHv+hHKwhkI1iHvceKUHw9Df6EK2zRLfjejRgMuCuxK7PfSWIMwWecceVvThjQ==}
dev: true
/defu/6.0.0:
resolution: {integrity: sha512-t2MZGLf1V2rV4VBZbWIaXKdX/mUcYW0n2znQZoADBkGGxYL8EWqCuCZBmJPJ/Yy9fofJkyuuSuo5GSwo0XdEgw==}
@ -3429,7 +3510,6 @@ packages:
acorn-node: 1.8.2
defined: 1.0.0
minimist: 1.2.6
dev: true
/diacritics/1.3.0:
resolution: {integrity: sha512-wlwEkqcsaxvPJML+rDh/2iS824jbREk6DUMUKkEaSlxdYHeS43cClJtsWglvw2RfeXGm6ohKDqsXteJ5sP5enA==}
@ -3437,7 +3517,6 @@ packages:
/didyoumean/1.2.2:
resolution: {integrity: sha512-gxtyfqMg7GKyhQmb056K7M3xszy/myH8w+B4RT+QXBQsvAOdc3XymqDDPHx1BgPgsdAA5SIifona89YtRATDzw==}
dev: true
/dir-glob/3.0.1:
resolution: {integrity: sha512-WkrWp9GR4KXfKGYzOLmTuGVi1UWFfws377n9cc55/tb6DuqyF6pcQ5AbiHEshaDpY9v6oaSr2XCDidGmMwdzIA==}
@ -3448,7 +3527,6 @@ packages:
/dlv/1.1.3:
resolution: {integrity: sha512-+HlytyjlPKnIG8XuRG8WvmBP8xs8P71y+SKKS6ZXWoEgLuePxtDoUEiH7WkdePWrQ5JBpE6aoVqfZfJUQkjXwA==}
dev: true
/doctrine/3.0.0:
resolution: {integrity: sha512-yS+Q5i3hBf7GBkd4KG8a7eBNNWNGLTaEwwYWUijIYM7zrlYDM0BFXHjjPWlWZ1Rg7UaddZeIDmi9jF3HmqiQ2w==}
@ -4086,7 +4164,6 @@ packages:
glob-parent: 5.1.2
merge2: 1.4.1
micromatch: 4.0.4
dev: true
/fast-json-stable-stringify/2.1.0:
resolution: {integrity: sha512-lhd/wF+Lk98HZoTCtlVraHtfh5XYijIjalXck7saUtuanSDyLMxnHhSXEDJqHxD7msR8D0uCmqlkwjCV8xvwHw==}
@ -4100,7 +4177,6 @@ packages:
resolution: {integrity: sha512-YpkpUnK8od0o1hmeSc7UUs/eB/vIPWJYjKck2QKIzAf71Vm1AAQ3EbuZB3g2JIy+pg+ERD0vqI79KyZiB2e2Nw==}
dependencies:
reusify: 1.0.4
dev: true
/fd-slicer/1.1.0:
resolution: {integrity: sha512-cE1qsB/VwyQozZ+q1dGxR8LBYNZeofhEdUNGSMbQD3Gw2lAzX9Zb3uIU6Ebc/Fmyjo9AWWfnn0AUCHqtevs/8g==}
@ -4145,7 +4221,6 @@ packages:
engines: {node: '>=8'}
dependencies:
to-regex-range: 5.0.1
dev: true
/finalhandler/1.1.2:
resolution: {integrity: sha512-aAWcW57uxVNrQZqFXjITpW3sIUQmHGG3qSb9mUah9MgMC4NeWhNOlNjXEYq3HjRAvL6arUviZGGJsBg6z0zsWA==}
@ -4287,7 +4362,6 @@ packages:
engines: {node: ^8.16.0 || ^10.6.0 || >=11.0.0}
os: [darwin]
requiresBuild: true
dev: true
optional: true
/function-bind/1.1.1:
@ -4378,14 +4452,12 @@ packages:
engines: {node: '>= 6'}
dependencies:
is-glob: 4.0.3
dev: true
/glob-parent/6.0.2:
resolution: {integrity: sha512-XxwI8EOhVQgWp6iDL+3b0r86f4d6AX6zSU55HfB4ydCEuXLXc5FcYeOu+nnGftS4TEju/11rt4KJPTMgbfmv4A==}
engines: {node: '>=10.13.0'}
dependencies:
is-glob: 4.0.3
dev: true
/glob/7.2.0:
resolution: {integrity: sha512-lmLf6gtyrPq8tTjSmrO94wBeQbFR3HbLHbuyD69wuyQkImp2hWqMGB47OX65FBkPffO641IP9jWa1z4ivqG26Q==}
@ -4714,7 +4786,6 @@ packages:
engines: {node: '>=8'}
dependencies:
binary-extensions: 2.2.0
dev: true
/is-boolean-object/1.1.2:
resolution: {integrity: sha512-gDYaKHJmnj4aWxyj6YHyXVpdQawtVLHU5cb+eztPGczf6cjuTdwve5ZIEfgXqH4e57An1D1AKf8CZ3kYrQRqYA==}
@ -4740,7 +4811,6 @@ packages:
resolution: {integrity: sha512-SdNCUs284hr40hFTFP6l0IfZ/RSrMXF3qgoRHd3/79unUTvrFO/JoXwkGm+5J/Oe3E/b5GsnG330uUNgRpu1PA==}
dependencies:
has: 1.0.3
dev: true
/is-date-object/1.0.5:
resolution: {integrity: sha512-9YQaSxsAiSwcvS33MBk3wTCVnWK+HhF8VZR2jRxehM16QcVOdHqPn4VPHmRK4lSr38n9JriurInLcP90xsYNfQ==}
@ -4752,7 +4822,6 @@ packages:
/is-extglob/2.1.1:
resolution: {integrity: sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==}
engines: {node: '>=0.10.0'}
dev: true
/is-fullwidth-code-point/3.0.0:
resolution: {integrity: sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==}
@ -4764,7 +4833,6 @@ packages:
engines: {node: '>=0.10.0'}
dependencies:
is-extglob: 2.1.1
dev: true
/is-installed-globally/0.4.0:
resolution: {integrity: sha512-iwGqO3J21aaSkC7jWnHP/difazwS7SFeIqxv6wEtLU8Y5KlzFTjyqcSIT0d8s4+dDhKytsk9PJZ2BkS5eZwQRQ==}
@ -4793,7 +4861,6 @@ packages:
/is-number/7.0.0:
resolution: {integrity: sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==}
engines: {node: '>=0.12.0'}
dev: true
/is-obj/1.0.1:
resolution: {integrity: sha512-l4RyHgRqGN4Y3+9JHVrNqO+tN0rV5My76uW5/nuO4K1b6vw5G8d/cmFjP9tRfEsdhZNt0IFdZuK/c2Vr4Nb+Qg==}
@ -5094,7 +5161,6 @@ packages:
/lilconfig/2.0.5:
resolution: {integrity: sha512-xaYmXZtTHPAw5m+xLN8ab9C+3a8YmV3asNSPOATITbtwrfbwaLJj8h66H1WMIpALCkqsIzK3h7oQ+PdX+LQ9Eg==}
engines: {node: '>=10'}
dev: true
/linkify-it/3.0.3:
resolution: {integrity: sha512-ynTsyrFSdE5oZ/O9GEf00kPngmOfVwazR5GKDq6EYfhlpFug3J2zybX56a2PRRpc9P+FuSoGNAwjlbDs9jJBPQ==}
@ -5258,7 +5324,6 @@ packages:
/merge2/1.4.1:
resolution: {integrity: sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==}
engines: {node: '>= 8'}
dev: true
/micromatch/4.0.4:
resolution: {integrity: sha512-pRmzw/XUcwXGpD9aI9q/0XOwLNygjETJ8y0ao0wdqprrzDa4YnxLcz7fQRZr8voh8V10kGhABbNcHVk5wHgWwg==}
@ -5266,7 +5331,6 @@ packages:
dependencies:
braces: 3.0.2
picomatch: 2.3.1
dev: true
/mime-db/1.51.0:
resolution: {integrity: sha512-5y8A56jg7XVQx2mbv1lu49NR4dokRnhZYTtL+KGfaa27uq4pSTXkwQkFJl4pkRMyNFz/EtYDSkiiEHx3F7UN6g==}
@ -5302,7 +5366,6 @@ packages:
/minimist/1.2.6:
resolution: {integrity: sha512-Jsjnk4bw3YJqYzbdyBiNsPWHPfO++UGG749Cxs6peCu5Xg4nrena6OVxOYxrQTqww0Jmwt+Ref8rggumkTLz9Q==}
dev: true
/mitt/2.1.0:
resolution: {integrity: sha512-ILj2TpLiysu2wkBbWjAmww7TkZb65aiQO+DkVdUTBpBXq+MHYiETENkKFMtsJZX1Lf4pe4QOrTSjIfUwN5lRdg==}
@ -5379,7 +5442,6 @@ packages:
/normalize-path/3.0.0:
resolution: {integrity: sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==}
engines: {node: '>=0.10.0'}
dev: true
/normalize-range/0.1.2:
resolution: {integrity: sha1-LRDAa9/TEuqXd2laTShDlFa3WUI=}
@ -5406,7 +5468,6 @@ packages:
/object-hash/3.0.0:
resolution: {integrity: sha512-RSn9F68PjH9HqtltsSnqYC1XXoWe9Bju5+213R98cNGttag9q9yAOTzdbsqvIa7aNm5WffBZFpWYr2aWrklWAw==}
engines: {node: '>= 6'}
dev: true
/object-inspect/1.12.0:
resolution: {integrity: sha512-Ho2z80bVIvJloH+YzRmpZVQe87+qASmBUKZDWgx9cu+KDrX2ZDH/3tMy+gXbZETVGs2M8YdxObOh7XAtim9Y0g==}
@ -5536,7 +5597,6 @@ packages:
/path-parse/1.0.7:
resolution: {integrity: sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==}
dev: true
/path-type/4.0.0:
resolution: {integrity: sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw==}
@ -5571,12 +5631,10 @@ packages:
/picomatch/2.3.1:
resolution: {integrity: sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==}
engines: {node: '>=8.6'}
dev: true
/pify/2.3.0:
resolution: {integrity: sha512-udgsAY+fTnvv7kI7aaxbqwWNb0AHiB0qBO89PZKPkoTmGOgdbrHDKD+0B2X4uTfJ/FT1R09r9gTsjUjNJotuog==}
engines: {node: '>=0.10.0'}
dev: true
/pinia/2.0.14_j6bzmzd4ujpabbp5objtwxyjp4:
resolution: {integrity: sha512-0nPuZR4TetT/WcLN+feMSjWJku3SQU7dBbXC6uw+R6FLQJCsg+/0pzXyD82T1FmAYe0lsx+jnEDQ1BLgkRKlxA==}
@ -5631,7 +5689,6 @@ packages:
postcss-value-parser: 4.2.0
read-cache: 1.0.0
resolve: 1.22.0
dev: true
/postcss-js/4.0.0_postcss@8.4.14:
resolution: {integrity: sha512-77QESFBwgX4irogGVPgQ5s07vLvFqWr228qZY+w6lW599cRlK/HmnlivnnVUxkjHnCu4J16PDMHcH+e+2HbvTQ==}
@ -5641,7 +5698,6 @@ packages:
dependencies:
camelcase-css: 2.0.1
postcss: 8.4.14
dev: true
/postcss-load-config/3.1.4_postcss@8.4.14:
resolution: {integrity: sha512-6DiM4E7v4coTE4uzA8U//WhtPwyhiim3eyjEMFCnUpzbrkK9wJHgKDT2mR+HbtSrd/NubVaYTOpSpjUl8NQeRg==}
@ -5658,7 +5714,6 @@ packages:
lilconfig: 2.0.5
postcss: 8.4.14
yaml: 1.10.2
dev: true
/postcss-nested/5.0.6_postcss@8.4.14:
resolution: {integrity: sha512-rKqm2Fk0KbA8Vt3AdGN0FB9OBOMDVajMG6ZCf/GoHgdxUJ4sBFp0A/uMIRm+MJUdo33YXEtjqIz8u7DAp8B7DA==}
@ -5668,7 +5723,6 @@ packages:
dependencies:
postcss: 8.4.14
postcss-selector-parser: 6.0.10
dev: true
/postcss-selector-parser/6.0.10:
resolution: {integrity: sha512-IQ7TZdoaqbT+LCpShg46jnZVlhWD2w6iQYAcYXfHARZ7X1t/UGhhceQDs5X0cGqKvYlHNOuv7Oa1xmb0oQuA3w==}
@ -5676,11 +5730,9 @@ packages:
dependencies:
cssesc: 3.0.0
util-deprecate: 1.0.2
dev: true
/postcss-value-parser/4.2.0:
resolution: {integrity: sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==}
dev: true
/postcss/8.4.14:
resolution: {integrity: sha512-E398TUmfAYFPBSdzgeieK2Y1+1cpdxJx8yXbK/m57nRhKSmk1GB2tO4lbLBtlkfPQTDKfe4Xqv1ASWPpayPEig==}
@ -5791,12 +5843,10 @@ packages:
/queue-microtask/1.2.3:
resolution: {integrity: sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==}
dev: true
/quick-lru/5.1.1:
resolution: {integrity: sha512-WuyALRjWPDGtt/wzJiadO5AXY+8hZ80hVpe6MyivgraREW751X3SbhRvG3eLKOYN+8VEvqLcf3wdnt44Z4S4SA==}
engines: {node: '>=10'}
dev: true
/randombytes/2.1.0:
resolution: {integrity: sha512-vYl3iOX+4CKUWuxGi9Ukhie6fsqXqS9FE2Zaic4tNFD2N2QQaXOMFbuKK4QmDHC0JO6B1Zp41J0LpT0oR68amQ==}
@ -5808,7 +5858,6 @@ packages:
resolution: {integrity: sha512-Owdv/Ft7IjOgm/i0xvNDZ1LrRANRfew4b2prF3OWMQLxLfu3bS8FVhCsrSCMK4lR56Y9ya+AThoTpDCTxCmpRA==}
dependencies:
pify: 2.3.0
dev: true
/readable-stream/2.3.7:
resolution: {integrity: sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==}
@ -5827,7 +5876,6 @@ packages:
engines: {node: '>=8.10.0'}
dependencies:
picomatch: 2.3.1
dev: true
/regenerate-unicode-properties/10.0.1:
resolution: {integrity: sha512-vn5DU6yg6h8hP/2OkQo3K7uVILvY4iu0oI4t3HFa81UPkhGJwkRwM10JEc3upjdhHjs/k8GJY1sRBhk5sr69Bw==}
@ -5928,7 +5976,6 @@ packages:
is-core-module: 2.8.1
path-parse: 1.0.7
supports-preserve-symlinks-flag: 1.0.0
dev: true
/restore-cursor/3.1.0:
resolution: {integrity: sha512-l+sSefzHpj5qimhFSE5a8nufZYAM3sBSVMAPtYkmC+4EH2anSGaEMXSD0izRQbu9nfyQ9y5JrVmp7E8oZrUjvA==}
@ -5941,7 +5988,6 @@ packages:
/reusify/1.0.4:
resolution: {integrity: sha512-U9nH88a3fc/ekCF1l0/UP1IosiuIjyTh7hBvXVMHYgVcfGvt897Xguj2UOLDeI5BG2m7/uwyaLVT6fbtCwTyzw==}
engines: {iojs: '>=1.0.0', node: '>=0.10.0'}
dev: true
/rfdc/1.3.0:
resolution: {integrity: sha512-V2hovdzFbOi77/WajaSMXk2OLm+xNIeQdMMuB7icj7bk6zi2F8GGAxigcnDFpJHbNyNcgyJDiP+8nOrY5cZGrA==}
@ -5986,7 +6032,6 @@ packages:
resolution: {integrity: sha512-5l4VyZR86LZ/lDxZTR6jqL8AFE2S0IFLMP26AbjsLVADxHdhB/c0GUsH+y39UfCi3dzz8OlQuPmnaJOMoDHQBA==}
dependencies:
queue-microtask: 1.2.3
dev: true
/rxjs/7.5.4:
resolution: {integrity: sha512-h5M3Hk78r6wAheJF0a5YahB1yRQKCsZ4MsGdZ5O9ETbVtjPcScGfrMmoOq7EBsCRzd4BDkvDJ7ogP8Sz5tTFiQ==}
@ -6323,7 +6368,6 @@ packages:
/supports-preserve-symlinks-flag/1.0.0:
resolution: {integrity: sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w==}
engines: {node: '>= 0.4'}
dev: true
/svg-tags/1.0.0:
resolution: {integrity: sha1-WPcc7jvVGbWdSyqEO2x95krAR2Q=}
@ -6385,7 +6429,6 @@ packages:
resolve: 1.22.0
transitivePeerDependencies:
- ts-node
dev: true
/temp-dir/2.0.0:
resolution: {integrity: sha512-aoBAniQmmwtcKp/7BzsH8Cxzv8OL736p7v1ihGb5e9DJ9kTwGWHrQrVB5+lfVDzfGrdRzXch+ig7LHaY1JTOrg==}
@ -6486,7 +6529,6 @@ packages:
engines: {node: '>=8.0'}
dependencies:
is-number: 7.0.0
dev: true
/totalist/3.0.0:
resolution: {integrity: sha512-eM+pCBxXO/njtF7vdFsHuqb+ElbxqtI4r5EAvk6grfAFyJ6IvWlSkfZ5T9ozC6xWw3Fj1fGoSmrl0gUs46JVIw==}
@ -6746,7 +6788,6 @@ packages:
/util-deprecate/1.0.2:
resolution: {integrity: sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==}
dev: true
/utils-merge/1.0.1:
resolution: {integrity: sha1-n5VxD1CiZ5R7LMwSR0HBAoQn5xM=}
@ -7362,7 +7403,6 @@ packages:
/xtend/4.0.2:
resolution: {integrity: sha512-LKYU1iAXJXUgAXn9URjiu+MWhyUXHsvfp7mcuYm9dSUKK0/CjtrUwFAxD82/mCWbtLsGjFIad0wIsod4zrTAEQ==}
engines: {node: '>=0.4'}
dev: true
/y18n/5.0.8:
resolution: {integrity: sha512-0pfFzegeDWJHJIAmTLRP2DwHjdF5s7jo9tuztdQxAhINCdvS+3nGINqPd00AphqJR/0LhANUS6/+7SCb98YOfA==}
@ -7376,7 +7416,6 @@ packages:
/yaml/1.10.2:
resolution: {integrity: sha512-r3vXyErRCYJ7wg28yvBY5VSoAF8ZvlcW9/BwUzEtUsjvX/DKs24dIkuwjtuprwJJHsbyUbLApepYTR1BN4uHrg==}
engines: {node: '>= 6'}
dev: true
/yargs-parser/20.2.9:
resolution: {integrity: sha512-y11nGElTIV+CT3Zv9t7VKl+Q3hTQoT9a1Qzezhhl6Rp21gJ/IVTW7Z3y9EWXhuUBC2Shnf+DX0antecpAwSP8w==}

View File

@ -2,22 +2,17 @@
import {
IconAddCircle,
IconArrowDown,
IconArrowLeft,
IconArrowRight,
IconBookRead,
IconDeleteBin,
IconSettings,
VButton,
VCard,
VInput,
VModal,
VPageHeader,
VSpace,
VTabItem,
VTabs,
VTag,
VTextarea,
} from "@halo-dev/components";
import PostSettingModal from "./components/PostSettingModal.vue";
import { posts } from "./posts-mock";
import { computed, onMounted, ref } from "vue";
import { useRouter } from "vue-router";
@ -38,10 +33,8 @@ const postsRef = ref(
const router = useRouter();
const checkAll = ref(false);
const postSettings = ref(false);
const settingActiveId = ref("general");
// eslint-disable-next-line
const selected = ref<Post | Record<string, any>>({});
const saving = ref(false);
const selected = ref<Post | Record<string, unknown> | null>({});
const users = ref<User[]>([]);
const checkedCount = computed(() => {
@ -70,14 +63,18 @@ const handleSelect = (post: any) => {
};
const handleSelectPrevious = () => {
const currentIndex = posts.findIndex((post) => post.id === selected.value.id);
const currentIndex = posts.findIndex(
(post) => post.id === selected.value?.id
);
if (currentIndex > 0) {
selected.value = posts[currentIndex - 1];
}
};
const handleSelectNext = () => {
const currentIndex = posts.findIndex((post) => post.id === selected.value.id);
const currentIndex = posts.findIndex(
(post) => post.id === selected.value?.id
);
if (currentIndex < posts.length - 1) {
selected.value = posts[currentIndex + 1];
}
@ -98,228 +95,12 @@ onMounted(() => {
});
</script>
<template>
<VModal v-model:visible="postSettings" :width="680" title="文章设置">
<template #actions>
<div class="modal-header-action" @click="handleSelectPrevious">
<IconArrowLeft />
</div>
<div class="modal-header-action" @click="handleSelectNext">
<IconArrowRight />
</div>
</template>
<VTabs v-model:active-id="settingActiveId" type="outline">
<VTabItem id="general" label="常规">
<form>
<div class="space-y-6 divide-y-0 sm:divide-y sm:divide-gray-200">
<div class="sm:grid sm:grid-cols-3 sm:items-start sm:gap-4 sm:pt-5">
<label
class="block text-sm font-medium text-gray-700 sm:mt-px sm:pt-2"
>
标题
</label>
<div class="mt-1 sm:col-span-2 sm:mt-0">
<VInput v-model="selected.title"></VInput>
</div>
</div>
<div class="sm:grid sm:grid-cols-3 sm:items-start sm:gap-4 sm:pt-5">
<label
class="block text-sm font-medium text-gray-700 sm:mt-px sm:pt-2"
>
别名
</label>
<div class="mt-1 sm:col-span-2 sm:mt-0">
<VInput v-model="selected.slug"></VInput>
</div>
</div>
<div
class="sm:grid sm:grid-cols-3 sm:items-center sm:gap-4 sm:pt-5"
>
<label class="block text-sm font-medium text-gray-700">
分类目录
</label>
<div class="mt-1 sm:col-span-2 sm:mt-0">
<VInput></VInput>
</div>
</div>
<div class="sm:grid sm:grid-cols-3 sm:items-start sm:gap-4 sm:pt-5">
<label
class="block text-sm font-medium text-gray-700 sm:mt-px sm:pt-2"
>
标签
</label>
<div class="mt-1 sm:col-span-2 sm:mt-0">
<VInput></VInput>
</div>
</div>
<div class="sm:grid sm:grid-cols-3 sm:items-start sm:gap-4 sm:pt-5">
<label
class="block text-sm font-medium text-gray-700 sm:mt-px sm:pt-2"
>
摘要
</label>
<div class="mt-1 sm:col-span-2 sm:mt-0">
<VTextarea v-model="selected.summary"></VTextarea>
</div>
</div>
</div>
</form>
</VTabItem>
<VTabItem id="advanced" label="高级">
<form>
<div class="space-y-6 divide-y-0 sm:divide-y sm:divide-gray-200">
<div class="sm:grid sm:grid-cols-3 sm:items-start sm:gap-4 sm:pt-5">
<label
class="block text-sm font-medium text-gray-700 sm:mt-px sm:pt-2"
>
禁止评论
</label>
<div class="mt-1 sm:col-span-2 sm:mt-0">
<VInput v-model="selected.disallowComment"></VInput>
</div>
</div>
<div class="sm:grid sm:grid-cols-3 sm:items-start sm:gap-4 sm:pt-5">
<label
class="block text-sm font-medium text-gray-700 sm:mt-px sm:pt-2"
>
是否置顶
</label>
<div class="mt-1 sm:col-span-2 sm:mt-0">
<VInput v-model="selected.topPriority"></VInput>
</div>
</div>
<div class="sm:grid sm:grid-cols-3 sm:items-start sm:gap-4 sm:pt-5">
<label
class="block text-sm font-medium text-gray-700 sm:mt-px sm:pt-2"
>
发表时间
</label>
<div class="mt-1 sm:col-span-2 sm:mt-0">
<VInput></VInput>
</div>
</div>
<div class="sm:grid sm:grid-cols-3 sm:items-start sm:gap-4 sm:pt-5">
<label
class="block text-sm font-medium text-gray-700 sm:mt-px sm:pt-2"
>
自定义模板
</label>
<div class="mt-1 sm:col-span-2 sm:mt-0">
<VInput v-model="selected.template"></VInput>
</div>
</div>
<div class="sm:grid sm:grid-cols-3 sm:items-start sm:gap-4 sm:pt-5">
<label
class="block text-sm font-medium text-gray-700 sm:mt-px sm:pt-2"
>
访问密码
</label>
<div class="mt-1 sm:col-span-2 sm:mt-0">
<VInput v-model="selected.password"></VInput>
</div>
</div>
<div class="sm:grid sm:grid-cols-3 sm:items-start sm:gap-4 sm:pt-5">
<label
class="block text-sm font-medium text-gray-700 sm:mt-px sm:pt-2"
>
封面图
</label>
<div class="mt-1 sm:col-span-2 sm:mt-0">
<VSpace align="start" class="w-full" direction="column">
<div class="w-full sm:w-1/2">
<div
class="aspect-w-10 aspect-h-7 block cursor-pointer overflow-hidden rounded bg-gray-100"
>
<img
:src="selected.thumbnail"
alt=""
class="pointer-events-none object-cover"
/>
</div>
</div>
<VInput v-model="selected.thumbnail"></VInput>
</VSpace>
</div>
</div>
</div>
</form>
</VTabItem>
<VTabItem id="seo" label="SEO">
<form>
<div class="space-y-6 divide-y-0 sm:divide-y sm:divide-gray-200">
<div class="sm:grid sm:grid-cols-3 sm:items-start sm:gap-4 sm:pt-5">
<label
class="block text-sm font-medium text-gray-700 sm:mt-px sm:pt-2"
>
自定义关键词
</label>
<div class="mt-1 sm:col-span-2 sm:mt-0">
<VTextarea
v-model="selected.metaKeywords"
:rows="5"
></VTextarea>
</div>
</div>
<div class="sm:grid sm:grid-cols-3 sm:items-start sm:gap-4 sm:pt-5">
<label
class="block text-sm font-medium text-gray-700 sm:mt-px sm:pt-2"
>
自定义描述
</label>
<div class="mt-1 sm:col-span-2 sm:mt-0">
<VTextarea
v-model="selected.metaDescription"
:rows="5"
></VTextarea>
</div>
</div>
</div>
</form>
</VTabItem>
<VTabItem id="metas" label="元数据"></VTabItem>
<VTabItem id="inject-code" label="代码注入">
<form>
<div class="space-y-6 divide-y-0 sm:divide-y sm:divide-gray-200">
<div class="sm:grid sm:grid-cols-3 sm:items-start sm:gap-4 sm:pt-5">
<label
class="block text-sm font-medium text-gray-700 sm:mt-px sm:pt-2"
>
CSS
</label>
<div class="mt-1 sm:col-span-2 sm:mt-0">
<VTextarea :rows="5"></VTextarea>
</div>
</div>
<div class="sm:grid sm:grid-cols-3 sm:items-start sm:gap-4 sm:pt-5">
<label
class="block text-sm font-medium text-gray-700 sm:mt-px sm:pt-2"
>
JavaScript
</label>
<div class="mt-1 sm:col-span-2 sm:mt-0">
<VTextarea :rows="5"></VTextarea>
</div>
</div>
</div>
</form>
</VTabItem>
</VTabs>
<template #footer>
<VSpace>
<VButton :loading="saving" type="secondary" @click="saving = !saving">
保存
</VButton>
<VButton type="default" @click="postSettings = false">取消</VButton>
</VSpace>
</template>
</VModal>
<PostSettingModal
v-model:visible="postSettings"
:post="selected"
@next="handleSelectNext"
@previous="handleSelectPrevious"
/>
<VPageHeader title="文章">
<template #icon>
<IconBookRead class="mr-2 self-center" />
@ -544,19 +325,15 @@ onMounted(() => {
</div>
</template>
<ul class="box-border h-full w-full divide-y divide-gray-100" role="list">
<li
v-for="(post, index) in postsRef"
:key="index"
@click="handleRouteToEditor(post)"
>
<li v-for="(post, index) in postsRef" :key="index">
<div
:class="{
'bg-gray-100': selected.id === post.id || post.checked,
'bg-gray-100': selected?.id === post.id || post.checked,
}"
class="relative block cursor-pointer px-4 py-3 transition-all hover:bg-gray-50"
>
<div
v-show="selected.id === post.id || post.checked"
v-show="selected?.id === post.id || post.checked"
class="absolute inset-y-0 left-0 w-0.5 bg-themeable-primary"
></div>
<div class="relative flex flex-row items-center">
@ -571,6 +348,7 @@ onMounted(() => {
<div class="flex flex-col sm:flex-row">
<span
class="mr-0 truncate text-sm font-medium text-gray-900 sm:mr-2"
@click="handleRouteToEditor(post)"
>
{{ post.title }}
</span>

View File

@ -0,0 +1,177 @@
<script lang="ts" setup>
import {
IconArrowLeft,
IconArrowRight,
VButton,
VModal,
VSpace,
VTabItem,
VTabs,
} from "@halo-dev/components";
import type { PropType } from "vue";
import { ref, unref, watch } from "vue";
import type { Post } from "@halo-dev/admin-api";
interface FormState {
post: Post | Record<string, unknown>;
saving: boolean;
}
const props = defineProps({
visible: {
type: Boolean,
default: false,
},
post: {
type: Object as PropType<Post | Record<string, unknown> | null>,
default: null,
},
});
const emit = defineEmits(["update:visible", "close", "previous", "next"]);
const settingActiveId = ref("general");
const formState = ref<FormState>({
post: {},
saving: false,
});
watch([() => props.visible, () => props.post], () => {
formState.value.post = unref(props.post) || {};
});
const handleVisibleChange = (visible: boolean) => {
emit("update:visible", visible);
if (!visible) {
emit("close");
}
};
</script>
<template>
<VModal
:visible="visible"
:width="680"
title="文章设置"
@update:visible="handleVisibleChange"
>
<template #actions>
<div class="modal-header-action" @click="emit('previous')">
<IconArrowLeft />
</div>
<div class="modal-header-action" @click="emit('next')">
<IconArrowRight />
</div>
</template>
<VTabs v-model:active-id="settingActiveId" type="outline">
<VTabItem id="general" label="常规">
<FormKit
id="basic"
:actions="false"
:model-value="formState.post"
:preserve="true"
type="form"
>
<FormKit
label="标题"
name="title"
type="text"
validation="required"
></FormKit>
<FormKit
label="别名"
name="slug"
type="text"
validation="required"
></FormKit>
<FormKit label="分类目录" type="select"></FormKit>
<FormKit label="标签" type="select"></FormKit>
<FormKit label="摘要" name="summary" type="textarea"></FormKit>
</FormKit>
</VTabItem>
<VTabItem id="advanced" label="高级">
<FormKit
id="advanced"
:actions="false"
:model-value="formState.post"
:preserve="true"
type="form"
>
<FormKit
:options="[
{ label: '是', value: true },
{ label: '否', value: false },
]"
label="禁止评论"
name="disallowComment"
type="radio"
></FormKit>
<FormKit
:options="[
{ label: '是', value: true },
{ label: '否', value: false },
]"
label="是否置顶"
name="topPriority"
type="radio"
></FormKit>
<FormKit
label="发表时间"
name="createTime"
type="datetime-local"
></FormKit>
<FormKit label="自定义模板" type="select"></FormKit>
<FormKit label="封面图" name="thumbnail" type="text"></FormKit>
</FormKit>
</VTabItem>
<VTabItem id="seo" label="SEO">
<FormKit
id="seo"
:actions="false"
:model-value="formState.post"
:preserve="true"
type="form"
>
<FormKit
label="自定义关键词"
name="metaKeywords"
type="textarea"
></FormKit>
<FormKit
label="自定义描述"
name="metaDescription"
type="textarea"
></FormKit>
</FormKit>
</VTabItem>
<VTabItem id="metas" label="元数据"></VTabItem>
<VTabItem id="inject-code" label="代码注入">
<FormKit
id="inject-code"
:actions="false"
:model-value="formState.post"
:preserve="true"
type="form"
>
<FormKit label="CSS" type="textarea"></FormKit>
<FormKit label="JavaScript" type="textarea"></FormKit>
</FormKit>
</VTabItem>
</VTabs>
<template #footer>
<VSpace>
<VButton
:loading="formState.saving"
type="secondary"
@click="formState.saving = !formState.saving"
>
保存
</VButton>
<VButton type="default" @click="handleVisibleChange(false)"
>取消
</VButton>
</VSpace>
</template>
</VModal>
</template>

View File

@ -1,11 +1,16 @@
<script lang="ts" setup>
import { VButton, VInput, VSpace } from "@halo-dev/components";
import {
IconShieldUser,
IconUserSettings,
VButton,
} from "@halo-dev/components";
import { v4 as uuid } from "uuid";
import { axiosInstance } from "@halo-dev/admin-shared";
import qs from "qs";
import logo from "../../../assets/logo.svg";
import { onMounted, ref } from "vue";
import { useRouter } from "vue-router";
import { submitForm } from "@formkit/vue";
interface LoginForm {
_csrf: string;
@ -64,14 +69,43 @@ onMounted(() => {
<div class="flex h-screen flex-col items-center justify-center">
<img :src="logo" alt="Logo" class="mb-8 w-20" />
<div class="login-form w-72">
<VSpace class="w-full" direction="column" spacing="lg">
<VInput
v-model="loginForm.state.username"
<FormKit
id="login"
v-model="loginForm.state"
:actions="false"
type="form"
@submit="handleLogin"
>
<FormKit
:validation-messages="{
required: '请输入用户名',
}"
name="username"
placeholder="用户名"
></VInput>
<VInput v-model="loginForm.state.password" placeholder="密码"></VInput>
<VButton block type="secondary" @click="handleLogin"></VButton>
</VSpace>
type="text"
validation="required"
>
<template #prefixIcon>
<IconUserSettings />
</template>
</FormKit>
<FormKit
:validation-messages="{
required: '请输入密码',
}"
name="password"
placeholder="密码"
type="password"
validation="required"
>
<template #prefixIcon>
<IconShieldUser />
</template>
</FormKit>
<VButton block type="secondary" @click="submitForm('login')">
登录
</VButton>
</FormKit>
</div>
</div>
</template>

View File

@ -3,9 +3,12 @@ import { Dropdown, Menu, Tooltip, VClosePopper, VTooltip } from "floating-vue";
import "floating-vue/dist/style.css";
// @ts-ignore
import VueGridLayout from "vue-grid-layout";
import { defaultConfig, plugin as FormKit } from "@formkit/vue";
import "@formkit/themes/genesis";
export function setupComponents(app: App) {
app.use(VueGridLayout);
app.use(FormKit, defaultConfig({}));
app.directive("tooltip", VTooltip);
app.directive("close-popper", VClosePopper);