github
/
halo-admin
mirror of https://github.com/halo-dev/halo-admin
1
0
Fork 0
Code Issues Releases Wiki Activity

pref: code optimization. (#213) 

* pref: code optimization.

* fix: theme configuration loading.

* pref: code optimization.
pull/214/head
Ryan Wang 2020-07-13 09:32:07 +08:00 committed by GitHub
parent e433a17a69
commit 4612ce592b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
59 changed files with 2777 additions and 1690 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

261
package-lock.json generated
View File

@ -1007,6 +1007,16 @@
"minimist": "^1.2.0" "minimist": "^1.2.0"
} }
}, },
"@fullhuman/postcss-purgecss": {
"version": "2.3.0",
"resolved": "https://registry.npmjs.org/@fullhuman/postcss-purgecss/-/postcss-purgecss-2.3.0.tgz",
"integrity": "sha512-qnKm5dIOyPGJ70kPZ5jiz0I9foVOic0j+cOzNDoo8KoCf6HjicIZ99UfO2OmE7vCYSKAAepEwJtNzpiiZAh9xw==",
"dev": true,
"requires": {
"postcss": "7.0.32",
"purgecss": "^2.3.0"
}
},
"@hapi/address": { "@hapi/address": {
"version": "2.1.4", "version": "2.1.4",
"resolved": "https://registry.npmjs.org/@hapi/address/-/address-2.1.4.tgz", "resolved": "https://registry.npmjs.org/@hapi/address/-/address-2.1.4.tgz",
@ -2712,6 +2722,31 @@
"integrity": "sha512-HiUX/+K2YpkpJ+SzBffkM/AQ2YE03S0U1kjTLVpoJdhZMOWy8qvXVN9JdLqv2QsaQ6MPYQIuNmwD8zOiYUofLQ==", "integrity": "sha512-HiUX/+K2YpkpJ+SzBffkM/AQ2YE03S0U1kjTLVpoJdhZMOWy8qvXVN9JdLqv2QsaQ6MPYQIuNmwD8zOiYUofLQ==",
"dev": true "dev": true
}, },
"acorn-node": {
"version": "1.8.2",
"resolved": "https://registry.npmjs.org/acorn-node/-/acorn-node-1.8.2.tgz",
"integrity": "sha512-8mt+fslDufLYntIoPAaIMUe/lrbrehIiwmR3t2k9LljIzoigEPF27eLk2hy8zSGzmR/ogr7zbRKINMo1u0yh5A==",
"dev": true,
"requires": {
"acorn": "^7.0.0",
"acorn-walk": "^7.0.0",
"xtend": "^4.0.2"
},
"dependencies": {
"acorn": {
"version": "7.3.1",
"resolved": "https://registry.npmjs.org/acorn/-/acorn-7.3.1.tgz",
"integrity": "sha512-tLc0wSnatxAQHVHUapaHdz72pi9KUyHjq5KyHjGg9Y8Ifdc79pTh2XvI6I1/chZbnM7QtNKzh66ooDogPZSleA==",
"dev": true
},
"acorn-walk": {
"version": "7.2.0",
"resolved": "https://registry.npmjs.org/acorn-walk/-/acorn-walk-7.2.0.tgz",
"integrity": "sha512-OPdCF6GsMIP+Az+aWfAAOEt2/+iVDKE7oy6lJ098aoe59oAmK76qV6Gw60SbZ8jHuG2wH058GF4pLFbYamYrVA==",
"dev": true
}
}
},
"acorn-walk": { "acorn-walk": {
"version": "6.2.0", "version": "6.2.0",
"resolved": "https://registry.npmjs.org/acorn-walk/-/acorn-walk-6.2.0.tgz", "resolved": "https://registry.npmjs.org/acorn-walk/-/acorn-walk-6.2.0.tgz",
@ -4424,6 +4459,12 @@
"integrity": "sha512-L28STB170nwWS63UjtlEOE3dldQApaJXZkOI1uMFfzf3rRuPegHaHesyee+YxQ+W6SvRDQV6UrdOdRiR153wJg==", "integrity": "sha512-L28STB170nwWS63UjtlEOE3dldQApaJXZkOI1uMFfzf3rRuPegHaHesyee+YxQ+W6SvRDQV6UrdOdRiR153wJg==",
"dev": true "dev": true
}, },
"camelcase-css": {
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/camelcase-css/-/camelcase-css-2.0.1.tgz",
"integrity": "sha512-QOSvevhslijgYwRx6Rv7zKdMF8lbRmx+uQGx2+vDc+KI/eBnsy9kit5aj23AgGu3pa4t9AgwbnXWqS+iOY+2aA==",
"dev": true
},
"caniuse-api": { "caniuse-api": {
"version": "3.0.0", "version": "3.0.0",
"resolved": "https://registry.npmjs.org/caniuse-api/-/caniuse-api-3.0.0.tgz", "resolved": "https://registry.npmjs.org/caniuse-api/-/caniuse-api-3.0.0.tgz",
@ -5616,6 +5657,12 @@
} }
} }
}, },
"css-unit-converter": {
"version": "1.1.2",
"resolved": "https://registry.npmjs.org/css-unit-converter/-/css-unit-converter-1.1.2.tgz",
"integrity": "sha512-IiJwMC8rdZE0+xiEZHeru6YoONC4rfPMqGm2W85jMIbkFvv5nFTwJVFHam2eFrN6txmoUYFAFXiv8ICVeTO0MA==",
"dev": true
},
"css-what": { "css-what": {
"version": "3.3.0", "version": "3.3.0",
"resolved": "https://registry.npmjs.org/css-what/-/css-what-3.3.0.tgz", "resolved": "https://registry.npmjs.org/css-what/-/css-what-3.3.0.tgz",
@ -6034,6 +6081,12 @@
} }
} }
}, },
"defined": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/defined/-/defined-1.0.0.tgz",
"integrity": "sha1-yY2bzvdWdBiOEQlpFRGZ45sfppM=",
"dev": true
},
"del": { "del": {
"version": "4.1.1", "version": "4.1.1",
"resolved": "https://registry.npmjs.org/del/-/del-4.1.1.tgz", "resolved": "https://registry.npmjs.org/del/-/del-4.1.1.tgz",
@ -6123,6 +6176,17 @@
"integrity": "sha512-ZIzRpLJrOj7jjP2miAtgqIfmzbxa4ZOr5jJc601zklsfEx9oTzmmj2nVpIPRpNlRTIh8lc1kyViIY7BWSGNmKw==", "integrity": "sha512-ZIzRpLJrOj7jjP2miAtgqIfmzbxa4ZOr5jJc601zklsfEx9oTzmmj2nVpIPRpNlRTIh8lc1kyViIY7BWSGNmKw==",
"dev": true "dev": true
}, },
"detective": {
"version": "5.2.0",
"resolved": "https://registry.npmjs.org/detective/-/detective-5.2.0.tgz",
"integrity": "sha512-6SsIx+nUUbuK0EthKjv0zrdnajCCXVYGmbYYiYjFVpzcjwEs/JMDZ8tPRG29J/HhN56t3GJp2cGSWDRjjot8Pg==",
"dev": true,
"requires": {
"acorn-node": "^1.6.1",
"defined": "^1.0.0",
"minimist": "^1.1.1"
}
},
"diff-sequences": { "diff-sequences": {
"version": "24.9.0", "version": "24.9.0",
"resolved": "https://registry.npmjs.org/diff-sequences/-/diff-sequences-24.9.0.tgz", "resolved": "https://registry.npmjs.org/diff-sequences/-/diff-sequences-24.9.0.tgz",
@ -11577,6 +11641,12 @@
"integrity": "sha512-U+JJi7duF1o+u2pynbp2zXDW2/PADgC30f0GsHZtRh+HOcXHnw137TrNlyxxRvWW5fjKd3bcLHPxofWuCjaeZg==", "integrity": "sha512-U+JJi7duF1o+u2pynbp2zXDW2/PADgC30f0GsHZtRh+HOcXHnw137TrNlyxxRvWW5fjKd3bcLHPxofWuCjaeZg==",
"dev": true "dev": true
}, },
"normalize.css": {
"version": "8.0.1",
"resolved": "https://registry.npmjs.org/normalize.css/-/normalize.css-8.0.1.tgz",
"integrity": "sha512-qizSNPO93t1YUuUhP22btGOo3chcvDFqFaj2TRybP0DMxkHOCTYwp3n34fel4a31ORXy4m1Xq0Gyqpb5m33qIg==",
"dev": true
},
"npm-run-path": { "npm-run-path": {
"version": "2.0.2", "version": "2.0.2",
"resolved": "https://registry.npmjs.org/npm-run-path/-/npm-run-path-2.0.2.tgz", "resolved": "https://registry.npmjs.org/npm-run-path/-/npm-run-path-2.0.2.tgz",
@ -12384,6 +12454,53 @@
"postcss": "^7.0.0" "postcss": "^7.0.0"
} }
}, },
"postcss-functions": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/postcss-functions/-/postcss-functions-3.0.0.tgz",
"integrity": "sha1-DpTQFERwCkgd4g3k1V+yZAVkJQ4=",
"dev": true,
"requires": {
"glob": "^7.1.2",
"object-assign": "^4.1.1",
"postcss": "^6.0.9",
"postcss-value-parser": "^3.3.0"
},
"dependencies": {
"postcss": {
"version": "6.0.23",
"resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.23.tgz",
"integrity": "sha512-soOk1h6J3VMTZtVeVpv15/Hpdl2cBLX3CAw4TAbkpTJiNPk9YP/zWcD1ND+xEtvyuuvKzbxliTOIyvkSeSJ6ag==",
"dev": true,
"requires": {
"chalk": "^2.4.1",
"source-map": "^0.6.1",
"supports-color": "^5.4.0"
}
},
"postcss-value-parser": {
"version": "3.3.1",
"resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-3.3.1.tgz",
"integrity": "sha512-pISE66AbVkp4fDQ7VHBwRNXzAAKJjw4Vw7nWI/+Q3vuly7SNfgYXvm6i5IgFylHGK5sP/xHAbB7N49OS4gWNyQ==",
"dev": true
},
"source-map": {
"version": "0.6.1",
"resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
"integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
"dev": true
}
}
},
"postcss-js": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/postcss-js/-/postcss-js-2.0.3.tgz",
"integrity": "sha512-zS59pAk3deu6dVHyrGqmC3oDXBdNdajk4k1RyxeVXCrcEDBUBHoIhE4QTsmhxgzXxsaqFDAkUZfmMa5f/N/79w==",
"dev": true,
"requires": {
"camelcase-css": "^2.0.1",
"postcss": "^7.0.18"
}
},
"postcss-load-config": { "postcss-load-config": {
"version": "2.1.0", "version": "2.1.0",
"resolved": "https://registry.npmjs.org/postcss-load-config/-/postcss-load-config-2.1.0.tgz", "resolved": "https://registry.npmjs.org/postcss-load-config/-/postcss-load-config-2.1.0.tgz",
@ -12592,6 +12709,16 @@
"postcss": "^7.0.6" "postcss": "^7.0.6"
} }
}, },
"postcss-nested": {
"version": "4.2.3",
"resolved": "https://registry.npmjs.org/postcss-nested/-/postcss-nested-4.2.3.tgz",
"integrity": "sha512-rOv0W1HquRCamWy2kFl3QazJMMe1ku6rCFoAAH+9AcxdbpDeBr6k968MLWuLjvjMcGEip01ak09hKOEgpK9hvw==",
"dev": true,
"requires": {
"postcss": "^7.0.32",
"postcss-selector-parser": "^6.0.2"
}
},
"postcss-normalize-charset": { "postcss-normalize-charset": {
"version": "4.0.1", "version": "4.0.1",
"resolved": "https://registry.npmjs.org/postcss-normalize-charset/-/postcss-normalize-charset-4.0.1.tgz", "resolved": "https://registry.npmjs.org/postcss-normalize-charset/-/postcss-normalize-charset-4.0.1.tgz",
@ -12917,6 +13044,12 @@
"react-is": "^16.8.4" "react-is": "^16.8.4"
} }
}, },
"pretty-hrtime": {
"version": "1.0.3",
"resolved": "https://registry.npmjs.org/pretty-hrtime/-/pretty-hrtime-1.0.3.tgz",
"integrity": "sha1-t+PqQkNaTJsnWdmeDyAesZWALuE=",
"dev": true
},
"process": { "process": {
"version": "0.11.10", "version": "0.11.10",
"resolved": "https://registry.npmjs.org/process/-/process-0.11.10.tgz", "resolved": "https://registry.npmjs.org/process/-/process-0.11.10.tgz",
@ -13061,6 +13194,26 @@
"integrity": "sha512-XRsRjdf+j5ml+y/6GKHPZbrF/8p2Yga0JPtdqTIY2Xe5ohJPD9saDJJLPvp9+NSBprVvevdXZybnj2cv8OEd0A==", "integrity": "sha512-XRsRjdf+j5ml+y/6GKHPZbrF/8p2Yga0JPtdqTIY2Xe5ohJPD9saDJJLPvp9+NSBprVvevdXZybnj2cv8OEd0A==",
"dev": true "dev": true
}, },
"purgecss": {
"version": "2.3.0",
"resolved": "https://registry.npmjs.org/purgecss/-/purgecss-2.3.0.tgz",
"integrity": "sha512-BE5CROfVGsx2XIhxGuZAT7rTH9lLeQx/6M0P7DTXQH4IUc3BBzs9JUzt4yzGf3JrH9enkeq6YJBe9CTtkm1WmQ==",
"dev": true,
"requires": {
"commander": "^5.0.0",
"glob": "^7.0.0",
"postcss": "7.0.32",
"postcss-selector-parser": "^6.0.2"
},
"dependencies": {
"commander": {
"version": "5.1.0",
"resolved": "https://registry.npmjs.org/commander/-/commander-5.1.0.tgz",
"integrity": "sha512-P0CysNDQ7rtVw4QIQtm+MRxV66vKFSvlsQvGYXZWR3qFU0jlMKHZZZgw8e+8DSah4UDKMqnknRDQz+xuQXQ/Zg==",
"dev": true
}
}
},
"q": { "q": {
"version": "1.5.1", "version": "1.5.1",
"resolved": "https://registry.npmjs.org/q/-/q-1.5.1.tgz", "resolved": "https://registry.npmjs.org/q/-/q-1.5.1.tgz",
@ -13264,6 +13417,24 @@
"util.promisify": "^1.0.0" "util.promisify": "^1.0.0"
} }
}, },
"reduce-css-calc": {
"version": "2.1.7",
"resolved": "https://registry.npmjs.org/reduce-css-calc/-/reduce-css-calc-2.1.7.tgz",
"integrity": "sha512-fDnlZ+AybAS3C7Q9xDq5y8A2z+lT63zLbynew/lur/IR24OQF5x98tfNwf79mzEdfywZ0a2wpM860FhFfMxZlA==",
"dev": true,
"requires": {
"css-unit-converter": "^1.1.1",
"postcss-value-parser": "^3.3.0"
},
"dependencies": {
"postcss-value-parser": {
"version": "3.3.1",
"resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-3.3.1.tgz",
"integrity": "sha512-pISE66AbVkp4fDQ7VHBwRNXzAAKJjw4Vw7nWI/+Q3vuly7SNfgYXvm6i5IgFylHGK5sP/xHAbB7N49OS4gWNyQ==",
"dev": true
}
}
},
"regenerate": { "regenerate": {
"version": "1.4.1", "version": "1.4.1",
"resolved": "https://registry.npmjs.org/regenerate/-/regenerate-1.4.1.tgz", "resolved": "https://registry.npmjs.org/regenerate/-/regenerate-1.4.1.tgz",
@ -14754,6 +14925,96 @@
} }
} }
}, },
"tailwindcss": {
"version": "1.4.6",
"resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-1.4.6.tgz",
"integrity": "sha512-qV0qInUq1FWih39Bc5CWECdgObSzRrbjGD4ke4kAPSIq6WXrPhv0wwOcUWJgJ66ltT9j+XnSRYikG8WNRU/fTQ==",
"dev": true,
"requires": {
"@fullhuman/postcss-purgecss": "^2.1.2",
"autoprefixer": "^9.4.5",
"browserslist": "^4.12.0",
"bytes": "^3.0.0",
"chalk": "^4.0.0",
"color": "^3.1.2",
"detective": "^5.2.0",
"fs-extra": "^8.0.0",
"lodash": "^4.17.15",
"node-emoji": "^1.8.1",
"normalize.css": "^8.0.1",
"postcss": "^7.0.11",
"postcss-functions": "^3.0.0",
"postcss-js": "^2.0.0",
"postcss-nested": "^4.1.1",
"postcss-selector-parser": "^6.0.0",
"pretty-hrtime": "^1.0.3",
"reduce-css-calc": "^2.1.6",
"resolve": "^1.14.2"
},
"dependencies": {
"ansi-styles": {
"version": "4.2.1",
"resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.2.1.tgz",
"integrity": "sha512-9VGjrMsG1vePxcSweQsN20KY/c4zN0h9fLjqAbwbPfahM3t+NL+M9HC8xeXG2I8pX5NoamTGNuomEUFI7fcUjA==",
"dev": true,
"requires": {
"@types/color-name": "^1.1.1",
"color-convert": "^2.0.1"
}
},
"chalk": {
"version": "4.1.0",
"resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.0.tgz",
"integrity": "sha512-qwx12AxXe2Q5xQ43Ac//I6v5aXTipYrSESdOgzrN+9XjgEpyjpKuvSGaN4qE93f7TQTlerQQ8S+EQ0EyDoVL1A==",
"dev": true,
"requires": {
"ansi-styles": "^4.1.0",
"supports-color": "^7.1.0"
}
},
"color-convert": {
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
"integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
"dev": true,
"requires": {
"color-name": "~1.1.4"
}
},
"color-name": {
"version": "1.1.4",
"resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
"integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
"dev": true
},
"fs-extra": {
"version": "8.1.0",
"resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-8.1.0.tgz",
"integrity": "sha512-yhlQgA6mnOJUKOsRUFsgJdQCvkKhcz8tlZG5HBQfReYZy46OwLcY+Zia0mtdHsOo9y/hP+CxMN0TU9QxoOtG4g==",
"dev": true,
"requires": {
"graceful-fs": "^4.2.0",
"jsonfile": "^4.0.0",
"universalify": "^0.1.0"
}
},
"has-flag": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
"integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
"dev": true
},
"supports-color": {
"version": "7.1.0",
"resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.1.0.tgz",
"integrity": "sha512-oRSIpR8pxT1Wr2FquTNnGet79b3BWljqOuoW/h4oBhxJ/HUbX5nX6JSruTkvXDCFMwDPvsaTTbvMLKZWSy0R5g==",
"dev": true,
"requires": {
"has-flag": "^4.0.0"
}
}
}
},
"tapable": { "tapable": {
"version": "1.1.3", "version": "1.1.3",
"resolved": "https://registry.npmjs.org/tapable/-/tapable-1.1.3.tgz", "resolved": "https://registry.npmjs.org/tapable/-/tapable-1.1.3.tgz",

6
package.json
View File

@ -51,6 +51,7 @@
"less": "^3.11.3", "less": "^3.11.3",
"less-loader": "^5.0.0", "less-loader": "^5.0.0",
"lint-staged": "^10.2.11", "lint-staged": "^10.2.11",
"tailwindcss": "^1.4.6",
"vue-svg-component-runtime": "^1.0.1", "vue-svg-component-runtime": "^1.0.1",
"vue-svg-icon-loader": "^2.1.1", "vue-svg-icon-loader": "^2.1.1",
"vue-template-compiler": "^2.6.11" "vue-template-compiler": "^2.6.11"
@ -131,11 +132,6 @@
"git add" "git add"
] ]
}, },
"postcss": {
"plugins": {
"autoprefixer": {}
}
},
"browserslist": [ "browserslist": [
"> 1%", "> 1%",
"last 2 versions", "last 2 versions",

6
postcss.config.js Normal file
View File

@ -0,0 +1,6 @@
module.exports = {
plugins: [
require('autoprefixer'),
require('tailwindcss')
]
}

8
src/App.vue
View File

@ -1,6 +1,6 @@
<template> <template>
<a-locale-provider :locale="locale"> <a-locale-provider :locale="locale">
<div id="app"> <div id="app" class="h-full">
<router-view /> <router-view />
</div> </div>
</a-locale-provider> </a-locale-provider>
@ -38,9 +38,3 @@ export default {
} }
} }
</script> </script>
<style>
#app {
height: 100%;
}
</style>

2
src/api/log.js
View File

@ -29,7 +29,7 @@ logApi.clear = () => {
}) })
} }
logApi.logType = { logApi.logTypes = {
BLOG_INITIALIZED: { BLOG_INITIALIZED: {
value: 0, value: 0,
text: '博客初始化' text: '博客初始化'

2
src/assets/css/tailwind.css Normal file
View File

@ -0,0 +1,2 @@
@tailwind components;
@tailwind utilities;

46
src/components/Attachment/AttachmentSelectDrawer.vue
View File

@ -24,12 +24,8 @@
type="flex" type="flex"
align="middle" align="middle"
> >
<a-skeleton <a-col :span="24">
active <a-spin :spinning="loading">
:loading="skeletonLoading"
:paragraph="{ rows: 18 }"
>
<a-col :span="24">
<a-empty v-if="attachments.length==0" /> <a-empty v-if="attachments.length==0" />
<div <div
v-else v-else
@ -45,8 +41,8 @@
loading="lazy" loading="lazy"
> >
</div> </div>
</a-col> </a-spin>
</a-skeleton> </a-col>
</a-row> </a-row>
<a-divider /> <a-divider />
<div class="page-wrapper"> <div class="page-wrapper">
@ -61,7 +57,7 @@
<div class="bottom-control"> <div class="bottom-control">
<a-button <a-button
type="dashed" type="dashed"
style="marginRight: 8px" class="mr-2"
v-if="isChooseAvatar" v-if="isChooseAvatar"
@click="handleSelectGravatar" @click="handleSelectGravatar"
>使用 Gravatar</a-button> >使用 Gravatar</a-button>
@ -123,7 +119,7 @@ export default {
data() { data() {
return { return {
uploadVisible: false, uploadVisible: false,
skeletonLoading: true, loading: true,
pagination: { pagination: {
page: 1, page: 1,
size: 12, size: 12,
@ -143,29 +139,30 @@ export default {
watch: { watch: {
visible: function(newValue, oldValue) { visible: function(newValue, oldValue) {
if (newValue) { if (newValue) {
this.loadSkeleton() this.handleListAttachments()
this.loadAttachments()
} }
} }
}, },
methods: { methods: {
loadSkeleton() {
this.skeletonLoading = true
setTimeout(() => {
this.skeletonLoading = false
}, 500)
},
handleShowUploadModal() { handleShowUploadModal() {
this.uploadVisible = true this.uploadVisible = true
}, },
loadAttachments() { handleListAttachments() {
this.loading = true
this.queryParam.page = this.pagination.page - 1 this.queryParam.page = this.pagination.page - 1
this.queryParam.size = this.pagination.size this.queryParam.size = this.pagination.size
this.queryParam.sort = this.pagination.sort this.queryParam.sort = this.pagination.sort
attachmentApi.query(this.queryParam).then(response => { attachmentApi
this.attachments = response.data.data.content .query(this.queryParam)
this.pagination.total = response.data.data.total .then(response => {
}) this.attachments = response.data.data.content
this.pagination.total = response.data.data.total
})
.finally(() => {
setTimeout(() => {
this.loading = false
}, 200)
})
}, },
handleQuery() { handleQuery() {
this.handlePaginationChange(1, this.pagination.size) this.handlePaginationChange(1, this.pagination.size)
@ -179,11 +176,10 @@ export default {
handlePaginationChange(page, pageSize) { handlePaginationChange(page, pageSize) {
this.pagination.page = page this.pagination.page = page
this.pagination.size = pageSize this.pagination.size = pageSize
this.loadAttachments() this.handleListAttachments()
}, },
onUploadClose() { onUploadClose() {
this.$refs.upload.handleClearFileList() this.$refs.upload.handleClearFileList()
this.loadSkeleton()
this.handlePaginationChange(1, this.pagination.size) this.handlePaginationChange(1, this.pagination.size)
}, },
handleJudgeMediaType(attachment) { handleJudgeMediaType(attachment) {

4
src/components/FooterToolbar/FooterToolBar.vue
View File

@ -1,9 +1,9 @@
<template> <template>
<div :class="prefixCls"> <div :class="prefixCls">
<div style="float: left"> <div class="float-left">
<slot name="extra">{{ extra }}</slot> <slot name="extra">{{ extra }}</slot>
</div> </div>
<div style="float: right"> <div class="float-right">
<slot></slot> <slot></slot>
</div> </div>
</div> </div>

14
src/components/GlobalFooter/GlobalFooter.vue
View File

@ -1,7 +1,7 @@
<template> <template>
<div <div
class="footer" class="footer text-center"
style="padding: 0 16px;margin: 48px 0 0;text-align: center;" style="padding: 0 16px;margin: 48px 0 0;"
> >
<div <div
class="copyright" class="copyright"
@ -9,7 +9,7 @@
> >
Proudly power by Proudly power by
<router-link :to="{ name:'About' }"> <router-link :to="{ name:'About' }">
<a href="javascript:void(0);">Halo</a> Halo
</router-link> </router-link>
</div> </div>
</div> </div>
@ -17,12 +17,6 @@
<script> <script>
export default { export default {
name: 'GlobalFooter', name: 'GlobalFooter'
data() {
return {}
}
} }
</script> </script>
<style lang="less" scoped>
</style>

2
src/components/GlobalHeader/GlobalHeader.vue
View File

@ -7,7 +7,7 @@
<a-layout-header <a-layout-header
v-if="visible" v-if="visible"
:class="[fixedHeader && 'ant-header-fixedHeader', sidebarOpened ? 'ant-header-side-opened' : 'ant-header-side-closed', ]" :class="[fixedHeader && 'ant-header-fixedHeader', sidebarOpened ? 'ant-header-side-opened' : 'ant-header-side-closed', ]"
:style="{ padding: '0' }" class="p-0"
> >
<div <div
v-if="mode === 'sidemenu'" v-if="mode === 'sidemenu'"

10
src/components/SettingDrawer/SettingDrawer.vue
View File

@ -10,7 +10,7 @@
:visible="layoutSetting" :visible="layoutSetting"
> >
<div class="setting-drawer-index-content"> <div class="setting-drawer-index-content">
<div :style="{ marginBottom: '24px' }"> <div class="mb-6">
<h3 class="setting-drawer-index-title">整体风格设置</h3> <h3 class="setting-drawer-index-title">整体风格设置</h3>
<div class="setting-drawer-index-blockChecbox"> <div class="setting-drawer-index-blockChecbox">
<a-tooltip> <a-tooltip>
@ -53,9 +53,9 @@
</div> </div>
</div> </div>
<a-divider /> <a-divider />
<div :style="{ marginBottom: '24px' }"> <div class="mb-6">
<h3 class="setting-drawer-index-title">主题色</h3> <h3 class="setting-drawer-index-title">主题色</h3>
<div style="height: 20px"> <div class="h-5">
<a-tooltip <a-tooltip
class="setting-drawer-theme-color-colorBlock" class="setting-drawer-theme-color-colorBlock"
v-for="(item, index) in colorList" v-for="(item, index) in colorList"
@ -75,7 +75,7 @@
</div> </div>
</div> </div>
<a-divider /> <a-divider />
<div :style="{ marginBottom: '24px' }"> <div class="mb-6">
<h3 class="setting-drawer-index-title">导航模式</h3> <h3 class="setting-drawer-index-title">导航模式</h3>
<div class="setting-drawer-index-blockChecbox"> <div class="setting-drawer-index-blockChecbox">
@ -113,7 +113,7 @@
</div> </div>
</div> </div>
<a-divider /> <a-divider />
<div :style="{ marginTop: '24px' }"> <div class="mt-6">
<a-list :split="false"> <a-list :split="false">
<a-list-item> <a-list-item>
<a-tooltip slot="actions"> <a-tooltip slot="actions">

3
src/components/Tools/Breadcrumb.vue
View File

@ -40,6 +40,3 @@ export default {
} }
} }
</script> </script>
<style scoped>
</style>

212
src/components/Tools/HeaderComment.vue
View File

@ -9,75 +9,79 @@
title="待审核评论" title="待审核评论"
> >
<template slot="content"> <template slot="content">
<a-spin :spinning="loading"> <div class="custom-tab-wrapper">
<div class="custom-tab-wrapper"> <a-tabs
<a-tabs> v-model="activeKey"
<a-tab-pane @change="handleTabsChanged"
tab="文章" >
key="1" <a-tab-pane
tab="文章"
key="post"
>
<a-list
:loading="postCommentsLoading"
:dataSource="converttedPostComments"
> >
<a-list :dataSource="converttedPostComments"> <a-list-item
<a-list-item slot="renderItem"
slot="renderItem" slot-scope="item"
slot-scope="item" >
> <a-list-item-meta>
<a-list-item-meta> <a-avatar
<a-avatar class="bg-white"
style="background-color: white" slot="avatar"
slot="avatar" :src="'//cn.gravatar.com/avatar/' + item.gravatarMd5 + '&d=mm'"
:src="'//cn.gravatar.com/avatar/' + item.gravatarMd5 + '&d=mm'" size="large"
size="large" />
/> <template slot="title">
<template slot="title"> <a
<a :href="item.authorUrl"
:href="item.authorUrl" target="_blank"
target="_blank" >{{ item.author }}</a>：<span v-html="item.content"></span>
>{{ item.author }}</a>：<span v-html="item.content"></span> </template>
</template> <template slot="description">
<template slot="description"> {{ item.createTime | timeAgo }}
{{ item.createTime | timeAgo }} </template>
</template> </a-list-item-meta>
</a-list-item-meta> </a-list-item>
</a-list-item> </a-list>
</a-list> </a-tab-pane>
</a-tab-pane> <a-tab-pane
<a-tab-pane tab="页面"
tab="页面" key="sheet"
key="2" >
<a-list
:loading="sheetCommentsLoading"
:dataSource="converttedSheetComments"
> >
<a-list :dataSource="converttedSheetComments"> <a-list-item
<a-list-item slot="renderItem"
slot="renderItem" slot-scope="item"
slot-scope="item" >
> <a-list-item-meta>
<a-list-item-meta> <a-avatar
<a-avatar class="bg-white"
style="background-color: white" slot="avatar"
slot="avatar" :src="'//cn.gravatar.com/avatar/' + item.gravatarMd5 + '&d=mm'"
:src="'//cn.gravatar.com/avatar/' + item.gravatarMd5 + '&d=mm'" size="large"
size="large" />
/> <template slot="title">
<template slot="title"> <a
<a :href="item.authorUrl"
:href="item.authorUrl" target="_blank"
target="_blank" >{{ item.author }}</a>：<span v-html="item.content"></span>
>{{ item.author }}</a>：<span v-html="item.content"></span> </template>
</template> <template slot="description">
<template slot="description"> {{ item.createTime | timeAgo }}
{{ item.createTime | timeAgo }} </template>
</template> </a-list-item-meta>
</a-list-item-meta> </a-list-item>
</a-list-item> </a-list>
</a-list> </a-tab-pane>
</a-tab-pane> </a-tabs>
</a-tabs> </div>
</div>
</a-spin>
</template> </template>
<span <span class="header-comment">
@click="fetchComment"
class="header-comment"
>
<a-badge <a-badge
dot dot
v-if="postComments.length > 0 || sheetComments.length > 0" v-if="postComments.length > 0 || sheetComments.length > 0"
@ -99,15 +103,14 @@ export default {
name: 'HeaderComment', name: 'HeaderComment',
data() { data() {
return { return {
loading: false, activeKey: 'post',
visible: false, visible: false,
postComments: [], postComments: [],
sheetComments: [] postCommentsLoading: false,
sheetComments: [],
sheetCommentsLoading: false
} }
}, },
created() {
this.getComment()
},
computed: { computed: {
converttedPostComments() { converttedPostComments() {
return this.postComments.map(comment => { return this.postComments.map(comment => {
@ -122,25 +125,58 @@ export default {
}) })
} }
}, },
methods: { created() {
fetchComment() { this.handleListPostAuditingComments(false)
if (!this.visible) { this.handleListSheetAuditingComments(false)
this.loading = true },
this.getComment() watch: {
} else { visible(value) {
this.loading = false if (value) {
if (this.activeKey === 'post') {
this.handleListPostAuditingComments(false)
} else if (this.activeKey === 'sheet') {
this.handleListSheetAuditingComments(false)
}
} }
this.visible = !this.visible }
},
methods: {
handleListPostAuditingComments(enableLoading = true) {
if (enableLoading) {
this.postCommentsLoading = true
}
commentApi
.latestComment('posts', 5, 'AUDITING')
.then(response => {
this.postComments = response.data.data
})
.finally(() => {
setTimeout(() => {
this.postCommentsLoading = false
}, 200)
})
}, },
getComment() { handleListSheetAuditingComments(enableLoading = true) {
commentApi.latestComment('posts', 5, 'AUDITING').then(response => { if (enableLoading) {
this.postComments = response.data.data this.sheetCommentsLoading = true
this.loading = false }
}) commentApi
commentApi.latestComment('sheets', 5, 'AUDITING').then(response => { .latestComment('sheets', 5, 'AUDITING')
this.sheetComments = response.data.data .then(response => {
this.loading = false this.sheetComments = response.data.data
}) })
.finally(() => {
setTimeout(() => {
this.sheetCommentsLoading = false
}, 200)
})
},
handleTabsChanged(activeKey) {
if (activeKey === 'post') {
this.handleListPostAuditingComments()
} else if (activeKey === 'sheet') {
this.handleListSheetAuditingComments()
}
} }
} }
} }

2
src/components/Upload/FilePondUpload.vue
View File

@ -133,5 +133,3 @@ export default {
} }
} }
</script> </script>
<style lang="less" scoped>
</style>

11
src/components/editor/MarkdownEditor.vue
View File

@ -49,14 +49,9 @@ export default {
formdata.append('file', $file) formdata.append('file', $file)
attachmentApi.upload(formdata).then(response => { attachmentApi.upload(formdata).then(response => {
var responseObject = response.data var responseObject = response.data
var HaloEditor = this.$refs.md
if (responseObject.status === 200) { HaloEditor.$img2Url(pos, encodeURI(responseObject.data.path))
var HaloEditor = this.$refs.md this.$message.success('图片上传成功！')
HaloEditor.$img2Url(pos, encodeURI(responseObject.data.path))
this.$message.success('图片上传成功！')
} else {
this.$message.error('图片上传失败：' + responseObject.message)
}
}) })
}, },
handleSaveDraft() { handleSaveDraft() {

19
src/components/global.less
View File

@ -842,7 +842,7 @@ body {
.vue-codemirror-wrap { .vue-codemirror-wrap {
.CodeMirror { .CodeMirror {
height: 560px; height: 700px;
} }
.CodeMirror-gutters { .CodeMirror-gutters {
@ -876,3 +876,20 @@ body {
.ant-input-group-addon { .ant-input-group-addon {
line-height: initial !important; line-height: initial !important;
} }
.theme-screenshot {
width: 100%;
margin: 0 auto;
position: relative;
padding-bottom: 56%;
overflow: hidden;
img {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
}
}

4
src/layouts/BlankLayout.vue
View File

@ -10,7 +10,3 @@ export default {
name: 'BlankLayout' name: 'BlankLayout'
} }
</script> </script>
<style scoped>
</style>

1
src/main.js
View File

@ -6,6 +6,7 @@ import Contextmenu from 'vue-contextmenujs'
import store from './store/' import store from './store/'
import './logger' import './logger'
import '@/assets/css/tailwind.css'
import './core/lazy_use' import './core/lazy_use'
import './permission' import './permission'
import '@/utils/filter' // global filter import '@/utils/filter' // global filter

55
src/views/attachment/AttachmentList.vue
View File

@ -7,7 +7,7 @@
> >
<a-col <a-col
:span="24" :span="24"
style="padding-bottom: 12px;" class="pb-3"
> >
<a-card <a-card
:bordered="false" :bordered="false"
@ -76,21 +76,16 @@
<span class="table-page-search-submitButtons"> <span class="table-page-search-submitButtons">
<a-button <a-button
type="primary" type="primary"
class="mr-2"
@click="handleQuery()" @click="handleQuery()"
>查询</a-button> >查询</a-button>
<a-button <a-button @click="handleResetParam()">重置</a-button>
style="margin-left: 8px;"
@click="handleResetParam()"
>重置</a-button>
</span> </span>
</a-col> </a-col>
</a-row> </a-row>
</a-form> </a-form>
</div> </div>
<div <div class="table-operator mb-0">
class="table-operator"
style="margin-bottom: 0;"
>
<a-button <a-button
type="primary" type="primary"
icon="cloud-upload" icon="cloud-upload"
@ -146,7 +141,7 @@
loading="lazy" loading="lazy"
/> />
</div> </div>
<a-card-meta style="padding: 0.8rem;"> <a-card-meta class="p-3">
<ellipsis <ellipsis
:length="isMobile() ? 12 : 16" :length="isMobile() ? 12 : 16"
tooltip tooltip
@ -194,7 +189,7 @@
v-if="selectAttachment" v-if="selectAttachment"
:attachment="selectAttachment" :attachment="selectAttachment"
:addToPhoto="true" :addToPhoto="true"
@delete="loadAttachments()" @delete="handleListAttachments()"
/> />
</page-view> </page-view>
</template> </template>
@ -259,9 +254,9 @@ export default {
} }
}, },
created() { created() {
this.loadAttachments() this.handleListAttachments()
this.loadMediaTypes() this.handleListMediaTypes()
this.loadTypes() this.handleListTypes()
}, },
destroyed: function() { destroyed: function() {
if (this.drawerVisible) { if (this.drawerVisible) {
@ -276,11 +271,11 @@ export default {
}, },
methods: { methods: {
...mapGetters(['color']), ...mapGetters(['color']),
loadAttachments() { handleListAttachments() {
this.listLoading = true
this.queryParam.page = this.pagination.page - 1 this.queryParam.page = this.pagination.page - 1
this.queryParam.size = this.pagination.size this.queryParam.size = this.pagination.size
this.queryParam.sort = this.pagination.sort this.queryParam.sort = this.pagination.sort
this.listLoading = true
attachmentApi attachmentApi
.query(this.queryParam) .query(this.queryParam)
.then(response => { .then(response => {
@ -293,7 +288,7 @@ export default {
}, 200) }, 200)
}) })
}, },
loadMediaTypes() { handleListMediaTypes() {
this.mediaTypesLoading = true this.mediaTypesLoading = true
attachmentApi attachmentApi
.getMediaTypes() .getMediaTypes()
@ -306,7 +301,7 @@ export default {
}, 200) }, 200)
}) })
}, },
loadTypes() { handleListTypes() {
this.typesLoading = true this.typesLoading = true
attachmentApi attachmentApi
.getTypes() .getTypes()
@ -371,15 +366,15 @@ export default {
this.$log.debug(`Current: ${page}, PageSize: ${size}`) this.$log.debug(`Current: ${page}, PageSize: ${size}`)
this.pagination.page = page this.pagination.page = page
this.pagination.size = size this.pagination.size = size
this.loadAttachments() this.handleListAttachments()
}, },
handleResetParam() { handleResetParam() {
this.queryParam.keyword = null this.queryParam.keyword = null
this.queryParam.mediaType = null this.queryParam.mediaType = null
this.queryParam.attachmentType = null this.queryParam.attachmentType = null
this.handlePaginationChange(1, this.pagination.size) this.handlePaginationChange(1, this.pagination.size)
this.loadMediaTypes() this.handleListMediaTypes()
this.loadTypes() this.handleListTypes()
}, },
handleQuery() { handleQuery() {
this.handlePaginationChange(1, this.pagination.size) this.handlePaginationChange(1, this.pagination.size)
@ -387,8 +382,8 @@ export default {
onUploadClose() { onUploadClose() {
this.$refs.upload.handleClearFileList() this.$refs.upload.handleClearFileList()
this.handlePaginationChange(1, this.pagination.size) this.handlePaginationChange(1, this.pagination.size)
this.loadMediaTypes() this.handleListMediaTypes()
this.loadTypes() this.handleListTypes()
}, },
handleJudgeMediaType(attachment) { handleJudgeMediaType(attachment) {
var mediaType = attachment.mediaType var mediaType = attachment.mediaType
@ -448,11 +443,15 @@ export default {
title: '确定要批量删除选中的附件吗?', title: '确定要批量删除选中的附件吗?',
content: '一旦删除不可恢复，请谨慎操作', content: '一旦删除不可恢复，请谨慎操作',
onOk() { onOk() {
attachmentApi.deleteInBatch(that.batchSelectedAttachments).then(res => { attachmentApi
that.handleCancelMultipleSelection() .deleteInBatch(that.batchSelectedAttachments)
that.loadAttachments() .then(res => {
that.$message.success('删除成功') that.handleCancelMultipleSelection()
}) that.$message.success('删除成功')
})
.finally(() => {
that.handleListAttachments()
})
}, },
onCancel() {} onCancel() {}
}) })

245
src/views/attachment/components/AttachmentDetailDrawer.vue
View File

@ -12,129 +12,116 @@
align="middle" align="middle"
> >
<a-col :span="24"> <a-col :span="24">
<a-skeleton <div class="attach-detail-img">
active <div v-show="nonsupportPreviewVisible">此文件不支持预览</div>
:loading="detailLoading" <a
:paragraph="{rows: 8}" :href="attachment.path"
> target="_blank"
<div class="attach-detail-img"> >
<div v-show="nonsupportPreviewVisible">此文件不支持预览</div> <img
<a :src="attachment.path"
:href="attachment.path" v-show="photoPreviewVisible"
target="_blank" class="w-full"
loading="lazy"
> >
<img </a>
:src="attachment.path" <d-player
v-show="photoPreviewVisible" ref="player"
style="width: 100%;" :options="videoOptions"
loading="lazy" v-show="videoPreviewVisible"
> class="video-player-box w-full"
</a> >
<d-player </d-player>
ref="player" </div>
:options="videoOptions"
v-show="videoPreviewVisible"
class="video-player-box"
style="width: 100%;"
>
</d-player>
</div>
</a-skeleton>
</a-col> </a-col>
<a-divider /> <a-divider />
<a-col :span="24"> <a-col :span="24">
<a-skeleton <a-list itemLayout="horizontal">
active <a-list-item>
:loading="detailLoading" <a-list-item-meta>
:paragraph="{rows: 8}" <template
> slot="description"
<a-list itemLayout="horizontal"> v-if="editable"
<a-list-item> >
<a-list-item-meta> <a-input
<template v-model="attachment.name"
slot="description" @blur="doUpdateAttachment"
v-if="editable" />
> </template>
<a-input <template
v-model="attachment.name" slot="description"
@blur="doUpdateAttachment" v-else
>{{ attachment.name }}</template>
<span slot="title">
附件名：
<a href="javascript:void(0);">
<a-icon
type="edit"
@click="editable = !editable"
/> />
</template> </a>
<template </span>
slot="description" </a-list-item-meta>
v-else </a-list-item>
>{{ attachment.name }}</template> <a-list-item>
<span slot="title"> <a-list-item-meta :description="attachment.mediaType">
附件名： <span slot="title">附件类型：</span>
<a href="javascript:void(0);"> </a-list-item-meta>
<a-icon </a-list-item>
type="edit" <a-list-item>
@click="handleEditName" <a-list-item-meta :description="attachment.typeProperty">
/> <span slot="title">存储位置：</span>
</a> </a-list-item-meta>
</span> </a-list-item>
</a-list-item-meta> <a-list-item>
</a-list-item> <a-list-item-meta>
<a-list-item> <template slot="description">
<a-list-item-meta :description="attachment.mediaType"> {{ attachment.size | fileSizeFormat }}
<span slot="title">附件类型：</span> </template>
</a-list-item-meta> <span slot="title">附件大小：</span>
</a-list-item> </a-list-item-meta>
<a-list-item> </a-list-item>
<a-list-item-meta :description="attachment.typeProperty"> <a-list-item v-if="photoPreviewVisible">
<span slot="title">存储位置：</span> <a-list-item-meta :description="attachment.height+'x'+attachment.width">
</a-list-item-meta> <span slot="title">图片尺寸：</span>
</a-list-item> </a-list-item-meta>
<a-list-item> </a-list-item>
<a-list-item-meta> <a-list-item>
<template slot="description"> <a-list-item-meta>
{{ attachment.size | fileSizeFormat }} <template slot="description">
</template> {{ attachment.createTime | moment }}
<span slot="title">附件大小：</span> </template>
</a-list-item-meta> <span slot="title">上传日期：</span>
</a-list-item> </a-list-item-meta>
<a-list-item v-if="photoPreviewVisible"> </a-list-item>
<a-list-item-meta :description="attachment.height+'x'+attachment.width"> <a-list-item>
<span slot="title">图片尺寸：</span> <a-list-item-meta :description="attachment.path">
</a-list-item-meta> <span slot="title">
</a-list-item> 普通链接：
<a-list-item> <a
<a-list-item-meta> href="javascript:void(0);"
<template slot="description"> @click="handleCopyNormalLink"
{{ attachment.createTime | moment }} >
</template> <a-icon type="copy" />
<span slot="title">上传日期：</span> </a>
</a-list-item-meta> </span>
</a-list-item> </a-list-item-meta>
<a-list-item> </a-list-item>
<a-list-item-meta :description="attachment.path"> <a-list-item v-if="photoPreviewVisible">
<span slot="title"> <a-list-item-meta>
普通链接： <span slot="description">![{{ attachment.name }}]({{ attachment.path }})</span>
<a <span slot="title">
href="javascript:void(0);" Markdown 格式：
@click="handleCopyNormalLink" <a
> href="javascript:void(0);"
<a-icon type="copy" /> @click="handleCopyMarkdownLink"
</a> >
</span> <a-icon type="copy" />
</a-list-item-meta> </a>
</a-list-item> </span>
<a-list-item v-if="photoPreviewVisible"> </a-list-item-meta>
<a-list-item-meta> </a-list-item>
<span slot="description">![{{ attachment.name }}]({{ attachment.path }})</span> </a-list>
<span slot="title">
Markdown 格式：
<a
href="javascript:void(0);"
@click="handleCopyMarkdownLink"
>
<a-icon type="copy" />
</a>
</span>
</a-list-item-meta>
</a-list-item>
</a-list>
</a-skeleton>
</a-col> </a-col>
</a-row> </a-row>
<a-divider class="divider-transparent" /> <a-divider class="divider-transparent" />
@ -148,7 +135,7 @@
> >
<a-button <a-button
type="dashed" type="dashed"
style="marginRight: 8px" class="mr-2"
>添加到图库</a-button> >添加到图库</a-button>
</a-popconfirm> </a-popconfirm>
<a-popconfirm <a-popconfirm
@ -180,7 +167,6 @@ export default {
}, },
data() { data() {
return { return {
detailLoading: true,
editable: false, editable: false,
photo: {}, photo: {},
photoPreviewVisible: false, photoPreviewVisible: false,
@ -220,27 +206,13 @@ export default {
this.player = this.$refs.player this.player = this.$refs.player
}, },
watch: { watch: {
visible: function(newValue, oldValue) {
this.$log.debug('old value', oldValue)
this.$log.debug('new value', newValue)
if (newValue) {
this.loadSkeleton()
}
},
attachment: function(newValue, oldValue) { attachment: function(newValue, oldValue) {
if (newValue) { if (newValue) {
var attachment = newValue this.handleJudgeMediaType(newValue)
this.handleJudgeMediaType(attachment)
} }
} }
}, },
methods: { methods: {
loadSkeleton() {
this.detailLoading = true
setTimeout(() => {
this.detailLoading = false
}, 500)
},
handleDeleteAttachment() { handleDeleteAttachment() {
attachmentApi.delete(this.attachment.id).then(response => { attachmentApi.delete(this.attachment.id).then(response => {
this.$message.success('删除成功！') this.$message.success('删除成功！')
@ -248,9 +220,6 @@ export default {
this.onClose() this.onClose()
}) })
}, },
handleEditName() {
this.editable = !this.editable
},
doUpdateAttachment() { doUpdateAttachment() {
if (!this.attachment.name) { if (!this.attachment.name) {
this.$notification['error']({ this.$notification['error']({

52
src/views/attachment/components/AttachmentDrawer.vue
View File

@ -24,12 +24,8 @@
type="flex" type="flex"
align="middle" align="middle"
> >
<a-skeleton <a-col :span="24">
active <a-spin :spinning="loading">
:loading="skeletonLoading"
:paragraph="{ rows: 18 }"
>
<a-col :span="24">
<a-empty v-if="formattedDatas.length==0" /> <a-empty v-if="formattedDatas.length==0" />
<div <div
v-else v-else
@ -46,8 +42,8 @@
loading="lazy" loading="lazy"
> >
</div> </div>
</a-col> </a-spin>
</a-skeleton> </a-col>
</a-row> </a-row>
<a-divider /> <a-divider />
<div class="page-wrapper"> <div class="page-wrapper">
@ -63,12 +59,12 @@
v-model="detailVisible" v-model="detailVisible"
v-if="selectedAttachment" v-if="selectedAttachment"
:attachment="selectedAttachment" :attachment="selectedAttachment"
@delete="handleDelete" @delete="loadAttachments"
/> />
<a-divider class="divider-transparent" /> <a-divider class="divider-transparent" />
<div class="bottom-control"> <div class="bottom-control">
<a-button <a-button
@click="handleShowUploadModal" @click="uploadVisible = true"
type="primary" type="primary"
>上传附件</a-button> >上传附件</a-button>
</div> </div>
@ -117,7 +113,7 @@ export default {
detailVisible: false, detailVisible: false,
attachmentDrawerVisible: false, attachmentDrawerVisible: false,
uploadVisible: false, uploadVisible: false,
skeletonLoading: true, loading: true,
pagination: { pagination: {
page: 1, page: 1,
size: 12, size: 12,
@ -144,23 +140,13 @@ export default {
} }
}, },
watch: { watch: {
visible: function(newValue, oldValue) { visible(value) {
if (newValue) { if (value) {
this.loadSkeleton()
this.loadAttachments() this.loadAttachments()
} }
} }
}, },
methods: { methods: {
loadSkeleton() {
this.skeletonLoading = true
setTimeout(() => {
this.skeletonLoading = false
}, 500)
},
handleShowUploadModal() {
this.uploadVisible = true
},
handleShowDetailDrawer(attachment) { handleShowDetailDrawer(attachment) {
this.selectedAttachment = attachment this.selectedAttachment = attachment
this.$log.debug('Show detail of', attachment) this.$log.debug('Show detail of', attachment)
@ -208,13 +194,21 @@ export default {
return false return false
}, },
loadAttachments() { loadAttachments() {
this.loading = true
this.queryParam.page = this.pagination.page - 1 this.queryParam.page = this.pagination.page - 1
this.queryParam.size = this.pagination.size this.queryParam.size = this.pagination.size
this.queryParam.sort = this.pagination.sort this.queryParam.sort = this.pagination.sort
attachmentApi.query(this.queryParam).then(response => { attachmentApi
this.attachments = response.data.data.content .query(this.queryParam)
this.pagination.total = response.data.data.total .then(response => {
}) this.attachments = response.data.data.content
this.pagination.total = response.data.data.total
})
.finally(() => {
setTimeout(() => {
this.loading = false
}, 200)
})
}, },
handleQuery() { handleQuery() {
this.handlePaginationChange(1, this.pagination.size) this.handlePaginationChange(1, this.pagination.size)
@ -226,12 +220,8 @@ export default {
}, },
onUploadClose() { onUploadClose() {
this.$refs.upload.handleClearFileList() this.$refs.upload.handleClearFileList()
this.loadSkeleton()
this.handlePaginationChange(1, this.pagination.size) this.handlePaginationChange(1, this.pagination.size)
}, },
handleDelete() {
this.loadAttachments()
},
handleJudgeMediaType(attachment) { handleJudgeMediaType(attachment) {
var mediaType = attachment.mediaType var mediaType = attachment.mediaType
// 判断文件类型 // 判断文件类型

187
src/views/comment/components/CommentDetail.vue
View File

@ -12,104 +12,101 @@
align="middle" align="middle"
> >
<a-col :span="24"> <a-col :span="24">
<a-skeleton <a-list itemLayout="horizontal">
active <a-list-item>
:loading="detailLoading" <a-list-item-meta :description="comment.author">
:paragraph="{rows: 8}" <span slot="title">评论者昵称：</span>
> </a-list-item-meta>
<a-list itemLayout="horizontal"> </a-list-item>
<a-list-item> <a-list-item>
<a-list-item-meta :description="comment.author"> <a-list-item-meta :description="comment.email">
<span slot="title">评论者昵称：</span> <span slot="title">评论者邮箱：</span>
</a-list-item-meta> </a-list-item-meta>
</a-list-item> </a-list-item>
<a-list-item> <a-list-item>
<a-list-item-meta :description="comment.email"> <a-list-item-meta :description="comment.ipAddress">
<span slot="title">评论者邮箱：</span> <span slot="title">评论者 IP：</span>
</a-list-item-meta> </a-list-item-meta>
</a-list-item> </a-list-item>
<a-list-item> <a-list-item>
<a-list-item-meta :description="comment.ipAddress"> <a-list-item-meta>
<span slot="title">评论者 IP：</span> <a
</a-list-item-meta> slot="description"
</a-list-item> target="_blank"
<a-list-item> :href="comment.authorUrl"
<a-list-item-meta> >{{ comment.authorUrl }}</a>
<a <span slot="title">评论者网址：</span>
slot="description" </a-list-item-meta>
target="_blank" </a-list-item>
:href="comment.authorUrl" <a-list-item>
>{{ comment.authorUrl }}</a> <a-list-item-meta>
<span slot="title">评论者网址：</span> <span slot="description">
</a-list-item-meta> <a-badge
</a-list-item> :status="comment.statusProperty.status"
<a-list-item> :text="comment.statusProperty.text"
<a-list-item-meta> />
<span slot="description"> </span>
<a-badge :status="comment.statusProperty.status" :text="comment.statusProperty.text"/> <span slot="title">评论状态：</span>
</span> </a-list-item-meta>
<span slot="title">评论状态：</span> </a-list-item>
</a-list-item-meta> <a-list-item>
</a-list-item> <a-list-item-meta>
<a-list-item> <a
<a-list-item-meta> slot="description"
<a target="_blank"
slot="description" :href="comment.post.fullPath"
target="_blank" v-if="this.type=='posts'"
:href="comment.post.fullPath" >{{ comment.post.title }}</a>
v-if="this.type=='posts'" <a
>{{ comment.post.title }}</a> slot="description"
<a target="_blank"
slot="description" :href="comment.sheet.fullPath"
target="_blank" v-else-if="this.type=='sheets'"
:href="comment.sheet.fullPath" >{{ comment.sheet.title }}</a>
v-else-if="this.type=='sheets'" <span
>{{ comment.sheet.title }}</a> slot="title"
<span v-if="this.type=='posts'"
slot="title" >评论文章：</span>
v-if="this.type=='posts'" <span
>评论文章：</span> slot="title"
<span v-else-if="this.type=='sheets'"
slot="title" >评论页面：</span>
v-else-if="this.type=='sheets'" </a-list-item-meta>
>评论页面：</span> </a-list-item>
</a-list-item-meta> <a-list-item>
</a-list-item> <a-list-item-meta>
<a-list-item> <template
<a-list-item-meta> slot="description"
<template v-if="editable"
slot="description" >
v-if="editable" <a-input
> type="textarea"
<a-input :autoSize="{ minRows: 5 }"
type="textarea" v-model="comment.content"
:autoSize="{ minRows: 5 }" />
v-model="comment.content" </template>
/> <span
</template> slot="description"
<span v-html="comment.content"
slot="description" v-else
v-html="comment.content" ></span>
v-else <span slot="title">评论内容：</span>
></span> </a-list-item-meta>
<span slot="title">评论内容：</span> </a-list-item>
</a-list-item-meta> </a-list>
</a-list-item>
</a-list>
</a-skeleton>
</a-col> </a-col>
</a-row> </a-row>
<a-divider class="divider-transparent" /> <a-divider class="divider-transparent" />
<div class="bottom-control"> <div class="bottom-control">
<a-button <a-button
type="dashed" type="dashed"
style="marginRight: 8px" class="mr-2"
@click="handleEditComment" @click="handleEditComment"
v-if="!editable" v-if="!editable"
>编辑</a-button> >编辑</a-button>
<a-button <a-button
type="primary" type="primary"
style="marginRight: 8px" class="mr-2"
@click="handleUpdateComment" @click="handleUpdateComment"
v-if="editable" v-if="editable"
>保存</a-button> >保存</a-button>
@ -132,7 +129,6 @@ export default {
components: {}, components: {},
data() { data() {
return { return {
detailLoading: true,
editable: false, editable: false,
commentStatus: commentApi.commentStatus, commentStatus: commentApi.commentStatus,
keys: ['blog_url'] keys: ['blog_url']
@ -161,22 +157,7 @@ export default {
} }
} }
}, },
watch: {
visible: function(newValue, oldValue) {
this.$log.debug('old value', oldValue)
this.$log.debug('new value', newValue)
if (newValue) {
this.loadSkeleton()
}
}
},
methods: { methods: {
loadSkeleton() {
this.detailLoading = true
setTimeout(() => {
this.detailLoading = false
}, 500)
},
handleEditComment() { handleEditComment() {
this.editable = true this.editable = true
}, },

84
src/views/comment/components/CommentTab.vue
View File

@ -45,12 +45,10 @@
<span class="table-page-search-submitButtons"> <span class="table-page-search-submitButtons">
<a-button <a-button
type="primary" type="primary"
class="mr-2"
@click="handleQuery()" @click="handleQuery()"
>查询</a-button> >查询</a-button>
<a-button <a-button @click="handleResetParam()">重置</a-button>
style="margin-left: 8px;"
@click="handleResetParam()"
>重置</a-button>
</span> </span>
</a-col> </a-col>
</a-row> </a-row>
@ -100,7 +98,7 @@
</a-button> </a-button>
</a-dropdown> </a-dropdown>
</div> </div>
<div style="margin-top:15px"> <div class="mt-4">
<!-- Mobile --> <!-- Mobile -->
<a-list <a-list
v-if="isMobile()" v-if="isMobile()"
@ -558,7 +556,7 @@ export default {
} }
}, },
created() { created() {
this.loadComments() this.handleListComments()
}, },
computed: { computed: {
formattedComments() { formattedComments() {
@ -570,7 +568,7 @@ export default {
} }
}, },
methods: { methods: {
loadComments() { handleListComments() {
this.loading = true this.loading = true
this.queryParam.page = this.pagination.page - 1 this.queryParam.page = this.pagination.page - 1
this.queryParam.size = this.pagination.size this.queryParam.size = this.pagination.size
@ -592,16 +590,24 @@ export default {
this.handlePaginationChange(1, this.pagination.size) this.handlePaginationChange(1, this.pagination.size)
}, },
handleEditStatusClick(commentId, status) { handleEditStatusClick(commentId, status) {
commentApi.updateStatus(this.type, commentId, status).then(response => { commentApi
this.$message.success('操作成功！') .updateStatus(this.type, commentId, status)
this.loadComments() .then(response => {
}) this.$message.success('操作成功！')
})
.finally(() => {
this.handleListComments()
})
}, },
handleDeleteClick(commentId) { handleDeleteClick(commentId) {
commentApi.delete(this.type, commentId).then(response => { commentApi
this.$message.success('删除成功！') .delete(this.type, commentId)
this.loadComments() .then(response => {
}) this.$message.success('删除成功！')
})
.finally(() => {
this.handleListComments()
})
}, },
handleReplyAndPassClick(comment) { handleReplyAndPassClick(comment) {
this.handleReplyClick(comment) this.handleReplyClick(comment)
@ -625,19 +631,23 @@ export default {
}) })
return return
} }
commentApi.create(this.type, this.replyComment).then(response => { commentApi
this.$message.success('回复成功！') .create(this.type, this.replyComment)
this.replyComment = {} .then(response => {
this.selectedComment = {} this.$message.success('回复成功！')
this.replyCommentVisible = false this.replyComment = {}
this.loadComments() this.selectedComment = {}
}) this.replyCommentVisible = false
})
.finally(() => {
this.handleListComments()
})
}, },
handlePaginationChange(page, pageSize) { handlePaginationChange(page, pageSize) {
this.$log.debug(`Current: ${page}, PageSize: ${pageSize}`) this.$log.debug(`Current: ${page}, PageSize: ${pageSize}`)
this.pagination.page = page this.pagination.page = page
this.pagination.size = pageSize this.pagination.size = pageSize
this.loadComments() this.handleListComments()
}, },
handleResetParam() { handleResetParam() {
this.queryParam.keyword = null this.queryParam.keyword = null
@ -650,22 +660,30 @@ export default {
this.$message.info('请至少选择一项！') this.$message.info('请至少选择一项！')
return return
} }
commentApi.updateStatusInBatch(this.type, this.selectedRowKeys, status).then(response => { commentApi
this.$log.debug(`commentIds: ${this.selectedRowKeys}, status: ${status}`) .updateStatusInBatch(this.type, this.selectedRowKeys, status)
this.selectedRowKeys = [] .then(response => {
this.loadComments() this.$log.debug(`commentIds: ${this.selectedRowKeys}, status: ${status}`)
}) this.selectedRowKeys = []
})
.finally(() => {
this.handleListComments()
})
}, },
handleDeleteMore() { handleDeleteMore() {
if (this.selectedRowKeys.length <= 0) { if (this.selectedRowKeys.length <= 0) {
this.$message.info('请至少选择一项！') this.$message.info('请至少选择一项！')
return return
} }
commentApi.deleteInBatch(this.type, this.selectedRowKeys).then(response => { commentApi
this.$log.debug(`delete: ${this.selectedRowKeys}`) .deleteInBatch(this.type, this.selectedRowKeys)
this.selectedRowKeys = [] .then(response => {
this.loadComments() this.$log.debug(`delete: ${this.selectedRowKeys}`)
}) this.selectedRowKeys = []
})
.finally(() => {
this.handleListComments()
})
}, },
handleClearRowKeys() { handleClearRowKeys() {
this.selectedRowKeys = [] this.selectedRowKeys = []

89
src/views/comment/components/TargetCommentDrawer.vue
View File

@ -28,16 +28,18 @@
</a-col> </a-col>
<a-divider /> <a-divider />
<a-col :span="24"> <a-col :span="24">
<a-empty v-if="comments.length == 0" /> <a-spin :spinning="loading">
<TargetCommentTree <a-empty v-if="comments.length == 0" />
v-else <TargetCommentTree
v-for="(comment, index) in comments" v-else
:key="index" v-for="(comment, index) in comments"
:comment="comment" :key="index"
@reply="handleCommentReply" :comment="comment"
@delete="handleCommentDelete" @reply="handleCommentReply"
@editStatus="handleEditStatusClick" @delete="handleCommentDelete"
/> @editStatus="handleEditStatusClick"
/>
</a-spin>
</a-col> </a-col>
</a-row> </a-row>
<a-divider /> <a-divider />
@ -120,6 +122,7 @@ export default {
data() { data() {
return { return {
comments: [], comments: [],
loading: false,
selectedComment: {}, selectedComment: {},
replyComment: {}, replyComment: {},
replyCommentVisible: false, replyCommentVisible: false,
@ -170,24 +173,32 @@ export default {
this.$log.debug('old value', oldValue) this.$log.debug('old value', oldValue)
this.$log.debug('new value', newValue) this.$log.debug('new value', newValue)
if (newValue) { if (newValue) {
this.loadComments() this.handleListComments()
} }
} }
}, },
methods: { methods: {
loadComments() { handleListComments() {
this.loading = true
this.queryParam.page = this.pagination.page - 1 this.queryParam.page = this.pagination.page - 1
this.queryParam.size = this.pagination.size this.queryParam.size = this.pagination.size
this.queryParam.sort = this.pagination.sort this.queryParam.sort = this.pagination.sort
commentApi.commentTree(this.target, this.id, this.queryParam).then(response => { commentApi
this.comments = response.data.data.content .commentTree(this.target, this.id, this.queryParam)
this.pagination.total = response.data.data.total .then(response => {
}) this.comments = response.data.data.content
this.pagination.total = response.data.data.total
})
.finally(() => {
setTimeout(() => {
this.loading = false
}, 200)
})
}, },
handlePaginationChange(page, pageSize) { handlePaginationChange(page, pageSize) {
this.pagination.page = page this.pagination.page = page
this.pagination.size = pageSize this.pagination.size = pageSize
this.loadComments() this.handleListComments()
}, },
handleCommentReply(comment) { handleCommentReply(comment) {
this.selectedComment = comment this.selectedComment = comment
@ -207,26 +218,38 @@ export default {
}) })
return return
} }
commentApi.create(this.target, this.replyComment).then(response => { commentApi
this.$message.success('回复成功！') .create(this.target, this.replyComment)
this.replyComment = {} .then(response => {
this.selectedComment = {} this.$message.success('回复成功！')
this.replyCommentVisible = false this.replyComment = {}
this.commentVisible = false this.selectedComment = {}
this.loadComments() this.replyCommentVisible = false
}) this.commentVisible = false
})
.finally(() => {
this.handleListComments()
})
}, },
handleEditStatusClick(comment, status) { handleEditStatusClick(comment, status) {
commentApi.updateStatus(this.target, comment.id, status).then(response => { commentApi
this.$message.success('操作成功！') .updateStatus(this.target, comment.id, status)
this.loadComments() .then(response => {
}) this.$message.success('操作成功！')
})
.finally(() => {
this.handleListComments()
})
}, },
handleCommentDelete(comment) { handleCommentDelete(comment) {
commentApi.delete(this.target, comment.id).then(response => { commentApi
this.$message.success('删除成功！') .delete(this.target, comment.id)
this.loadComments() .then(response => {
}) this.$message.success('删除成功！')
})
.finally(() => {
this.handleListComments()
})
}, },
onReplyClose() { onReplyClose() {
this.replyComment = {} this.replyComment = {}

89
src/views/dashboard/Dashboard.vue
View File

@ -7,10 +7,9 @@
:md="12" :md="12"
:sm="12" :sm="12"
:xs="12" :xs="12"
:style="{ marginBottom: '12px' }" class="mb-3"
> >
<analysis-card <analysis-card
:loading="statisticsLoading"
title="文章" title="文章"
:number="statisticsData.postCount" :number="statisticsData.postCount"
> >
@ -18,7 +17,14 @@
:to="{ name:'PostEdit' }" :to="{ name:'PostEdit' }"
slot="action" slot="action"
> >
<a-icon type="plus" /> <a-icon
v-if="statisticsLoading"
type="loading"
/>
<a-icon
v-else
type="plus"
/>
</router-link> </router-link>
</analysis-card> </analysis-card>
</a-col> </a-col>
@ -28,10 +34,9 @@
:md="12" :md="12"
:sm="12" :sm="12"
:xs="12" :xs="12"
:style="{ marginBottom: '12px' }" class="mb-3"
> >
<analysis-card <analysis-card
:loading="statisticsLoading"
title="评论" title="评论"
:number="statisticsData.commentCount" :number="statisticsData.commentCount"
> >
@ -39,7 +44,14 @@
:to="{ name:'Comments' }" :to="{ name:'Comments' }"
slot="action" slot="action"
> >
<a-icon type="unordered-list" /> <a-icon
v-if="statisticsLoading"
type="loading"
/>
<a-icon
v-else
type="unordered-list"
/>
</router-link> </router-link>
</analysis-card> </analysis-card>
</a-col> </a-col>
@ -49,10 +61,9 @@
:md="12" :md="12"
:sm="12" :sm="12"
:xs="12" :xs="12"
:style="{ marginBottom: '12px' }" class="mb-3"
> >
<analysis-card <analysis-card
:loading="statisticsLoading"
title="阅读量" title="阅读量"
:number="statisticsData.visitCount" :number="statisticsData.visitCount"
> >
@ -61,7 +72,14 @@
文章阅读共 {{ statisticsData.visitCount }} 次 文章阅读共 {{ statisticsData.visitCount }} 次
</template> </template>
<a href="javascript:void(0);"> <a href="javascript:void(0);">
<a-icon type="info-circle-o" /> <a-icon
v-if="statisticsLoading"
type="loading"
/>
<a-icon
v-else
type="info-circle-o"
/>
</a> </a>
</a-tooltip> </a-tooltip>
</analysis-card> </analysis-card>
@ -72,17 +90,23 @@
:md="12" :md="12"
:sm="12" :sm="12"
:xs="12" :xs="12"
:style="{ marginBottom: '12px' }" class="mb-3"
> >
<analysis-card <analysis-card
:loading="statisticsLoading"
title="建立天数" title="建立天数"
:number="statisticsData.establishDays" :number="statisticsData.establishDays"
> >
<a-tooltip slot="action"> <a-tooltip slot="action">
<template slot="title">博客建立于 {{ statisticsData.birthday | moment }}</template> <template slot="title">博客建立于 {{ statisticsData.birthday | moment }}</template>
<a href="javascript:void(0);"> <a href="javascript:void(0);">
<a-icon type="info-circle-o" /> <a-icon
v-if="statisticsLoading"
type="loading"
/>
<a-icon
v-else
type="info-circle-o"
/>
</a> </a>
</a-tooltip> </a-tooltip>
</analysis-card> </analysis-card>
@ -95,10 +119,9 @@
:md="12" :md="12"
:sm="24" :sm="24"
:xs="24" :xs="24"
:style="{ marginBottom: '12px' }" class="mb-3"
> >
<a-card <a-card
:loading="activityLoading"
:bordered="false" :bordered="false"
title="新动态" title="新动态"
:bodyStyle="{ padding: 0 }" :bodyStyle="{ padding: 0 }"
@ -109,7 +132,10 @@
key="1" key="1"
tab="最近文章" tab="最近文章"
> >
<a-list :dataSource="latestPosts"> <a-list
:loading="activityLoading"
:dataSource="latestPosts"
>
<a-list-item <a-list-item
slot="renderItem" slot="renderItem"
slot-scope="item, index" slot-scope="item, index"
@ -178,11 +204,10 @@
:md="12" :md="12"
:sm="24" :sm="24"
:xs="24" :xs="24"
:style="{ marginBottom: '12px' }" class="mb-3"
> >
<a-card <a-card
:bordered="false" :bordered="false"
:loading="writeLoading"
:bodyStyle="{ padding: '16px' }" :bodyStyle="{ padding: '16px' }"
> >
<template slot="title"> <template slot="title">
@ -218,10 +243,9 @@
:md="12" :md="12"
:sm="24" :sm="24"
:xs="24" :xs="24"
:style="{ marginBottom: '12px' }" class="mb-3"
> >
<a-card <a-card
:loading="logLoading"
:bordered="false" :bordered="false"
:bodyStyle="{ padding: '16px' }" :bodyStyle="{ padding: '16px' }"
> >
@ -239,7 +263,10 @@
</a> </a>
</a-tooltip> </a-tooltip>
</template> </template>
<a-list :dataSource="formattedLogDatas"> <a-list
:dataSource="formattedLogDatas"
:loading="logLoading"
>
<a-list-item <a-list-item
slot="renderItem" slot="renderItem"
slot-scope="item, index" slot-scope="item, index"
@ -287,9 +314,8 @@ export default {
}, },
data() { data() {
return { return {
logType: logApi.logType, logTypes: logApi.logTypes,
activityLoading: false, activityLoading: false,
writeLoading: false,
logLoading: false, logLoading: false,
statisticsLoading: true, statisticsLoading: true,
logListDrawerVisible: false, logListDrawerVisible: false,
@ -303,14 +329,14 @@ export default {
} }
}, },
created() { created() {
this.getStatistics() this.handleLoadStatistics()
this.listLatestPosts() this.handleListLatestPosts()
this.listLatestLogs() this.handleListLatestLogs()
}, },
computed: { computed: {
formattedLogDatas() { formattedLogDatas() {
return this.latestLogs.map(log => { return this.latestLogs.map(log => {
log.type = this.logType[log.type].text log.type = this.logTypes[log.type].text
return log return log
}) })
} }
@ -323,7 +349,7 @@ export default {
beforeRouteEnter(to, from, next) { beforeRouteEnter(to, from, next) {
next(vm => { next(vm => {
vm.interval = setInterval(() => { vm.interval = setInterval(() => {
vm.getStatistics() vm.handleLoadStatistics()
}, 5000) }, 5000)
}) })
}, },
@ -339,7 +365,7 @@ export default {
next() next()
}, },
methods: { methods: {
async listLatestPosts() { handleListLatestPosts() {
this.activityLoading = true this.activityLoading = true
postApi postApi
.listLatest(5) .listLatest(5)
@ -352,9 +378,8 @@ export default {
}, 200) }, 200)
}) })
}, },
async listLatestLogs() { handleListLatestLogs() {
this.logLoading = true this.logLoading = true
this.writeLoading = true
logApi logApi
.listLatest(5) .listLatest(5)
.then(response => { .then(response => {
@ -363,11 +388,10 @@ export default {
.finally(() => { .finally(() => {
setTimeout(() => { setTimeout(() => {
this.logLoading = false this.logLoading = false
this.writeLoading = false
}, 200) }, 200)
}) })
}, },
async getStatistics() { handleLoadStatistics() {
statisticsApi statisticsApi
.statistics() .statistics()
.then(response => { .then(response => {
@ -402,6 +426,7 @@ export default {
}, },
handleLogListClose() { handleLogListClose() {
this.logListDrawerVisible = false this.logListDrawerVisible = false
this.handleListLatestLogs()
} }
} }
} }

6
src/views/dashboard/components/AnalysisCard.vue
View File

@ -1,6 +1,5 @@
<template> <template>
<a-card <a-card
:loading="loading"
:body-style="{ padding: '24px' }" :body-style="{ padding: '24px' }"
:bordered="false" :bordered="false"
> >
@ -44,11 +43,6 @@ export default {
type: Number, type: Number,
required: false, required: false,
default: 0 default: 0
},
loading: {
type: Boolean,
required: false,
default: false
} }
}, },
data() { data() {

82
src/views/dashboard/components/LogListDrawer.vue
View File

@ -13,27 +13,24 @@
align="middle" align="middle"
> >
<a-col :span="24"> <a-col :span="24">
<a-skeleton <a-list
active
:loading="loading" :loading="loading"
:paragraph="{rows: 18}" :dataSource="formattedLogsDatas"
> >
<a-list :dataSource="formattedLogsDatas"> <a-list-item
<a-list-item slot="renderItem"
slot="renderItem" slot-scope="item, index"
slot-scope="item, index" :key="index"
:key="index" >
> <a-list-item-meta :description="item.createTime | timeAgo">
<a-list-item-meta :description="item.createTime | timeAgo"> <span slot="title">{{ item.type }}</span>
<span slot="title">{{ item.type }}</span> </a-list-item-meta>
</a-list-item-meta> <ellipsis
<ellipsis :length="35"
:length="35" tooltip
tooltip >{{ item.content }}</ellipsis>
>{{ item.content }}</ellipsis> </a-list-item>
</a-list-item> </a-list>
</a-list>
</a-skeleton>
<div class="page-wrapper"> <div class="page-wrapper">
<a-pagination <a-pagination
@ -72,7 +69,7 @@ export default {
mixins: [mixin, mixinDevice], mixins: [mixin, mixinDevice],
data() { data() {
return { return {
logType: logApi.logType, logTypes: logApi.logTypes,
loading: true, loading: true,
logs: [], logs: [],
pagination: { pagination: {
@ -98,46 +95,51 @@ export default {
computed: { computed: {
formattedLogsDatas() { formattedLogsDatas() {
return this.logs.map(log => { return this.logs.map(log => {
log.type = this.logType[log.type].text log.type = this.logTypes[log.type].text
return log return log
}) })
} }
}, },
watch: { watch: {
visible: function(newValue, oldValue) { visible(value) {
if (newValue) { if (value) {
this.loadSkeleton() this.handleListLogs()
this.loadLogs()
} }
} }
}, },
methods: { methods: {
loadSkeleton() { handleListLogs() {
this.loading = true this.loading = true
setTimeout(() => {
this.loading = false
}, 500)
},
loadLogs() {
this.logQueryParam.page = this.pagination.page - 1 this.logQueryParam.page = this.pagination.page - 1
this.logQueryParam.size = this.pagination.size this.logQueryParam.size = this.pagination.size
this.logQueryParam.sort = this.pagination.sort this.logQueryParam.sort = this.pagination.sort
logApi.pageBy(this.logQueryParam).then(response => { logApi
this.logs = response.data.data.content .pageBy(this.logQueryParam)
this.pagination.total = response.data.data.total .then(response => {
}) this.logs = response.data.data.content
this.pagination.total = response.data.data.total
})
.finally(() => {
setTimeout(() => {
this.loading = false
}, 200)
})
}, },
handleClearLogs() { handleClearLogs() {
logApi.clear().then(response => { logApi
this.$message.success('清除成功！') .clear()
this.loadLogs() .then(response => {
}) this.$message.success('清除成功！')
})
.finally(() => {
this.handleListLogs()
})
}, },
handlePaginationChange(page, pageSize) { handlePaginationChange(page, pageSize) {
this.$log.debug(`Current: ${page}, PageSize: ${pageSize}`) this.$log.debug(`Current: ${page}, PageSize: ${pageSize}`)
this.pagination.page = page this.pagination.page = page
this.pagination.size = pageSize this.pagination.size = pageSize
this.loadLogs() this.handleListLogs()
}, },
onClose() { onClose() {
this.$emit('close', false) this.$emit('close', false)

18
src/views/dashboard/components/RecentCommentTab.vue
View File

@ -103,15 +103,21 @@ export default {
} }
}, },
created() { created() {
this.loadComments() this.handleListTargetComments()
}, },
methods: { methods: {
loadComments() { handleListTargetComments() {
this.loading = true this.loading = true
commentApi.latestComment(this.type, 5, 'PUBLISHED').then(response => { commentApi
this.comments = response.data.data .latestComment(this.type, 5, 'PUBLISHED')
this.loading = false .then(response => {
}) this.comments = response.data.data
})
.finally(() => {
setTimeout(() => {
this.loading = false
}, 200)
})
}, },
handlePostPreview(postId) { handlePostPreview(postId) {
postApi.preview(postId).then(response => { postApi.preview(postId).then(response => {

6
src/views/interface/MenuList.vue
View File

@ -7,7 +7,7 @@
:md="10" :md="10"
:sm="24" :sm="24"
:xs="24" :xs="24"
:style="{ 'padding-bottom': '12px' }" class="mb-3"
> >
<a-card <a-card
:title="title" :title="title"
@ -104,7 +104,7 @@
>返回添加</a-button> >返回添加</a-button>
</a-button-group> </a-button-group>
<a <a
:style="{ marginLeft: '8px'}" class="ml-2"
@click="form.moreField = !form.moreField" @click="form.moreField = !form.moreField"
> >
更多选项 更多选项
@ -120,7 +120,7 @@
:md="14" :md="14"
:sm="24" :sm="24"
:xs="24" :xs="24"
:style="{ 'padding-bottom': '12px' }" class="pb-3"
> >
<a-card <a-card
title="所有菜单" title="所有菜单"

135
src/views/interface/ThemeEdit.vue
View File

@ -1,13 +1,50 @@
<template> <template>
<div> <div>
<a-row :gutter="12"> <a-row :gutter="12">
<a-col
:xl="6"
:lg="6"
:md="6"
:sm="24"
:xs="24"
class="pb-3"
>
<a-card :bodyStyle="{ padding: '16px' }">
<template slot="title">
<a-select
class="w-full"
@change="onSelectTheme"
v-model="selectedTheme.id"
:loading="themesLoading"
>
<a-select-option
v-for="(theme,index) in themes"
:key="index"
:value="theme.id"
>{{ theme.name }}
<a-icon
v-if="theme.activated"
type="check"
/>
</a-select-option>
</a-select>
</template>
<a-spin :spinning="filesLoading">
<theme-file
v-if="files"
:files="files"
@listenToSelect="handleSelectFile"
/>
</a-spin>
</a-card>
</a-col>
<a-col <a-col
:xl="18" :xl="18"
:lg="18" :lg="18"
:md="18" :md="18"
:sm="24" :sm="24"
:xs="24" :xs="24"
:style="{'padding-bottom':'12px'}" class="pb-3"
> >
<a-card :bodyStyle="{ padding: '16px' }"> <a-card :bodyStyle="{ padding: '16px' }">
<a-form layout="vertical"> <a-form layout="vertical">
@ -28,40 +65,6 @@
</a-form> </a-form>
</a-card> </a-card>
</a-col> </a-col>
<a-col
:xl="6"
:lg="6"
:md="6"
:sm="24"
:xs="24"
:style="{'padding-bottom':'12px'}"
>
<a-card :bodyStyle="{ padding: '16px' }">
<template slot="title">
<a-select
style="width: 100%"
@change="onSelectTheme"
v-model="selectedTheme.id"
>
<a-select-option
v-for="(theme,index) in themes"
:key="index"
:value="theme.id"
>{{ theme.name }}
<a-icon
v-if="theme.activated"
type="check"
/>
</a-select-option>
</a-select>
</template>
<theme-file
v-if="files"
:files="files"
@listenToSelect="handleSelectFile"
/>
</a-card>
</a-col>
</a-row> </a-row>
</div> </div>
</template> </template>
@ -85,40 +88,68 @@ export default {
lineNumbers: true, lineNumbers: true,
line: true line: true
}, },
files: null, files: [],
filesLoading: false,
file: {}, file: {},
content: '', content: '',
themes: [], themes: [],
themesLoading: false,
selectedTheme: {}, selectedTheme: {},
saving: false saving: false
} }
}, },
created() { created() {
this.loadActivatedTheme() this.handleGetActivatedTheme()
this.loadFiles() this.handleListThemeFiles()
this.loadThemes() this.handleListThemes()
}, },
methods: { methods: {
loadActivatedTheme() { handleGetActivatedTheme() {
themeApi.getActivatedTheme().then(response => { themeApi.getActivatedTheme().then(response => {
this.selectedTheme = response.data.data this.selectedTheme = response.data.data
}) })
}, },
loadFiles() { handleListThemeFiles() {
themeApi.listFilesActivated().then(response => { this.filesLoading = true
this.files = response.data.data themeApi
}) .listFilesActivated()
.then(response => {
this.files = response.data.data
})
.finally(() => {
setTimeout(() => {
this.filesLoading = false
}, 200)
})
}, },
loadThemes() { handleListThemes() {
themeApi.listAll().then(response => { this.themesLoading = true
this.themes = response.data.data themeApi
}) .listAll()
.then(response => {
this.themes = response.data.data
})
.finally(() => {
setTimeout(() => {
this.themesLoading = false
}, 200)
})
}, },
onSelectTheme(themeId) { onSelectTheme(themeId) {
this.files = null this.files = []
themeApi.listFiles(themeId).then(response => { this.filesLoading = true
this.files = response.data.data themeApi
}) .listFiles(themeId)
.then(response => {
this.files = response.data.data
this.content = ''
this.file = {}
})
.finally(() => {
setTimeout(() => {
this.filesLoading = false
}, 200)
})
}, },
handleSelectFile(file) { handleSelectFile(file) {
const _this = this const _this = this

133
src/views/interface/ThemeList.vue
View File

@ -21,7 +21,7 @@
:title="item.name" :title="item.name"
:bodyStyle="{ padding: 0 }" :bodyStyle="{ padding: 0 }"
> >
<div class="theme-thumb"> <div class="theme-screenshot">
<img <img
:alt="item.name" :alt="item.name"
:src="item.screenshots || '/images/placeholder.jpg'" :src="item.screenshots || '/images/placeholder.jpg'"
@ -106,13 +106,13 @@
</a-col> </a-col>
</a-row> </a-row>
<ThemeSetting <ThemeSettingDrawer
:theme="selectedTheme" :theme="selectedTheme"
v-if="themeSettingVisible" v-model="themeSettingVisible"
@close="onThemeSettingsClose" @close="onThemeSettingsClose"
/> />
<div class="upload-button"> <div style="position: fixed;bottom: 30px;right: 30px;">
<a-dropdown <a-dropdown
placement="topLeft" placement="topLeft"
:trigger="['click']" :trigger="['click']"
@ -289,11 +289,11 @@
</template> </template>
<script> <script>
import ThemeSetting from './components/ThemeSetting' import ThemeSettingDrawer from './components/ThemeSettingDrawer'
import themeApi from '@/api/theme' import themeApi from '@/api/theme'
export default { export default {
components: { components: {
ThemeSetting ThemeSettingDrawer
}, },
data() { data() {
return { return {
@ -323,7 +323,7 @@ export default {
} }
}, },
created() { created() {
this.loadThemes() this.handleListThemes()
}, },
destroyed: function() { destroyed: function() {
if (this.themeSettingVisible) { if (this.themeSettingVisible) {
@ -337,7 +337,7 @@ export default {
next() next()
}, },
methods: { methods: {
loadThemes() { handleListThemes() {
this.themeLoading = true this.themeLoading = true
themeApi themeApi
.listAll() .listAll()
@ -350,12 +350,15 @@ export default {
}, 200) }, 200)
}) })
}, },
activeTheme(themeId) { activeTheme(themeId) {
themeApi.active(themeId).then(response => { themeApi
this.$message.success('设置成功！') .active(themeId)
this.loadThemes() .then(response => {
}) this.$message.success('设置成功！')
})
.finally(() => {
this.handleListThemes()
})
}, },
handleUpdateTheme(themeId) { handleUpdateTheme(themeId) {
const hide = this.$message.loading('更新中...', 0) const hide = this.$message.loading('更新中...', 0)
@ -363,17 +366,21 @@ export default {
.update(themeId) .update(themeId)
.then(response => { .then(response => {
this.$message.success('更新成功！') this.$message.success('更新成功！')
this.loadThemes()
}) })
.finally(() => { .finally(() => {
hide() hide()
this.handleListThemes()
}) })
}, },
handleDeleteTheme(themeId) { handleDeleteTheme(themeId) {
themeApi.delete(themeId).then(response => { themeApi
this.$message.success('删除成功！') .delete(themeId)
this.loadThemes() .then(response => {
}) this.$message.success('删除成功！')
})
.finally(() => {
this.handleListThemes()
})
}, },
handleUploadSuccess() { handleUploadSuccess() {
if (this.uploadThemeVisible) { if (this.uploadThemeVisible) {
@ -385,7 +392,7 @@ export default {
if (this.fetchBranches) { if (this.fetchBranches) {
this.fetchBranches = false this.fetchBranches = false
} }
this.loadThemes() this.handleListThemes()
}, },
handleEditClick(theme) { handleEditClick(theme) {
this.settingDrawer(theme) this.settingDrawer(theme)
@ -412,28 +419,42 @@ export default {
this.releases = response.data.data this.releases = response.data.data
}) })
.finally(() => { .finally(() => {
this.fetchButtonLoading = false setTimeout(() => {
this.fetchButtonLoading = false
}, 200)
}) })
}, },
handleBranchFetching() { handleBranchFetching() {
themeApi.fetchingBranch(this.fetchingUrl, this.branches[this.selectedBranch].branch).then(response => { themeApi
this.$message.success('拉取成功') .fetchingBranch(this.fetchingUrl, this.branches[this.selectedBranch].branch)
this.uploadThemeVisible = false .then(response => {
this.loadThemes() this.$message.success('拉取成功')
}) this.uploadThemeVisible = false
})
.finally(() => {
this.handleListThemes()
})
}, },
handleReleaseFetching() { handleReleaseFetching() {
themeApi.fetchingRelease(this.fetchingUrl, this.releases[this.selectedBranch].branch).then(response => { themeApi
this.$message.success('拉取成功') .fetchingRelease(this.fetchingUrl, this.releases[this.selectedBranch].branch)
this.uploadThemeVisible = false .then(response => {
this.loadThemes() this.$message.success('拉取成功')
}) this.uploadThemeVisible = false
})
.finally(() => {
this.handleListThemes()
})
}, },
handleReload() { handleReload() {
themeApi.reload().then(response => { themeApi
this.loadThemes() .reload()
this.$message.success('刷新成功！') .then(response => {
}) this.$message.success('刷新成功！')
})
.finally(() => {
this.handleListThemes()
})
}, },
handleShowUpdateNewThemeModal(item) { handleShowUpdateNewThemeModal(item) {
this.prepareUpdateTheme = item this.prepareUpdateTheme = item
@ -444,13 +465,13 @@ export default {
this.themeSettingVisible = true this.themeSettingVisible = true
}, },
handleConfirmDelete(item) { handleConfirmDelete(item) {
const that = this const _this = this
this.$confirm({ this.$confirm({
title: '提示', title: '提示',
maskClosable: true, maskClosable: true,
content: '确定删除【' + item.name + '】主题？', content: '确定删除【' + item.name + '】主题？',
onOk() { onOk() {
that.handleDeleteTheme(item.id) _this.handleDeleteTheme(item.id)
}, },
onCancel() {} onCancel() {}
}) })
@ -483,7 +504,7 @@ export default {
if (this.selectedBranch) { if (this.selectedBranch) {
this.selectedBranch = null this.selectedBranch = null
} }
this.loadThemes() this.handleListThemes()
}, },
onThemeSettingsClose() { onThemeSettingsClose() {
this.themeSettingVisible = false this.themeSettingVisible = false
@ -492,41 +513,3 @@ export default {
} }
} }
</script> </script>
<style lang="less">
@keyframes scaleDraw {
0% {
transform: scale(1);
}
25% {
transform: scale(1.3);
}
50% {
transform: scale(1);
}
75% {
transform: scale(1.3);
}
}
.upload-button {
-webkit-animation: scaleDraw 4s ease-in-out infinite;
position: fixed;
bottom: 30px;
right: 30px;
}
.theme-thumb {
width: 100%;
margin: 0 auto;
position: relative;
padding-bottom: 56%;
overflow: hidden;
img {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
}
}
</style>

136
src/views/interface/components/ThemeSetting.vue → src/views/interface/components/ThemeSettingDrawer.vue
View File

@ -1,6 +1,6 @@
<template> <template>
<a-drawer <a-drawer
:title="selectedTheme.name + ' 主题设置'" :title="`${theme.name} 主题设置`"
width="100%" width="100%"
placement="right" placement="right"
closable closable
@ -20,38 +20,32 @@
:xs="24" :xs="24"
v-if="!viewMode" v-if="!viewMode"
> >
<a-skeleton <a-card :bordered="false">
active <img
:loading="settingLoading" :alt="theme.name"
:paragraph="{rows: 10}" :src="theme.screenshots"
> slot="cover"
<a-card :bordered="false"> >
<img <a-card-meta :description="theme.description">
:alt="selectedTheme.name" <template slot="title">
:src="selectedTheme.screenshots" <a
slot="cover" :href="author.website"
> target="_blank"
<a-card-meta :description="selectedTheme.description"> >{{ author.name }}</a>
<template slot="title"> </template>
<a <a-avatar
:href="selectedTheme.author.website" v-if="theme.logo"
target="_blank" :src="theme.logo"
>{{ selectedTheme.author.name }}</a> size="large"
</template> slot="avatar"
<a-avatar />
v-if="selectedTheme.logo" <a-avatar
:src="selectedTheme.logo" v-else
size="large" size="large"
slot="avatar" slot="avatar"
/> >{{ author.name }}</a-avatar>
<a-avatar </a-card-meta>
v-else </a-card>
size="large"
slot="avatar"
>{{ selectedTheme.author.name }}</a-avatar>
</a-card-meta>
</a-card>
</a-skeleton>
</a-col> </a-col>
<a-col <a-col
:xl="formColValue" :xl="formColValue"
@ -61,19 +55,15 @@
:xs="24" :xs="24"
style="padding-bottom: 50px;" style="padding-bottom: 50px;"
> >
<a-skeleton <a-spin :spinning="settingLoading">
active
:loading="settingLoading"
:paragraph="{rows: 20}"
>
<div class="card-container"> <div class="card-container">
<a-tabs <a-tabs
type="card" type="card"
defaultActiveKey="0" defaultActiveKey="0"
v-if="themeConfiguration.length>0" v-if="themeConfigurations.length>0"
> >
<a-tab-pane <a-tab-pane
v-for="(group, index) in themeConfiguration" v-for="(group, index) in themeConfigurations"
:key="index.toString()" :key="index.toString()"
:tab="group.label" :tab="group.label"
> >
@ -172,10 +162,10 @@
<a-alert <a-alert
message="当前主题暂无设置选项" message="当前主题暂无设置选项"
banner banner
v-else v-if="themeConfigurations.length <=0 && !settingLoading"
/> />
</div> </div>
</a-skeleton> </a-spin>
</a-col> </a-col>
<a-col <a-col
@ -212,21 +202,21 @@
/> />
<footer-tool-bar <footer-tool-bar
v-if="themeConfiguration.length>0" v-if="themeConfigurations.length>0"
:style="{ width : '100%'}" class="w-full"
> >
<a-button <a-button
v-if="!this.isMobile() && theme.activated && viewMode" v-if="!this.isMobile() && theme.activated && viewMode"
type="primary" type="primary"
@click="toggleViewMode" @click="toggleViewMode"
style="marginRight: 8px" class="mr-2"
ghost ghost
>普通模式</a-button> >普通模式</a-button>
<a-button <a-button
v-else-if="!this.isMobile() && theme.activated && !viewMode" v-else-if="!this.isMobile() && theme.activated && !viewMode"
type="dashed" type="dashed"
@click="toggleViewMode" @click="toggleViewMode"
style="marginRight: 8px" class="mr-2"
>预览模式</a-button> >预览模式</a-button>
<a-button <a-button
type="primary" type="primary"
@ -253,10 +243,9 @@ export default {
data() { data() {
return { return {
attachmentDrawerVisible: false, attachmentDrawerVisible: false,
selectedTheme: this.theme, themeConfigurations: [],
themeConfiguration: [],
themeSettings: [], themeSettings: [],
settingLoading: true, settingLoading: false,
selectedField: '', selectedField: '',
wrapperCol: { wrapperCol: {
xl: { span: 12 }, xl: { span: 12 },
@ -277,52 +266,55 @@ export default {
props: { props: {
theme: { theme: {
type: Object, type: Object,
required: true required: true,
default: () => {}
}, },
visible: { visible: {
type: Boolean, type: Boolean,
required: false, required: false,
default: true default: false
} }
}, },
created() {
this.loadSkeleton()
this.initData()
},
watch: { watch: {
visible: function(newValue, oldValue) { visible(value) {
if (newValue) { if (value) {
this.loadSkeleton() this.handleFetchConfiguration()
} }
} }
}, },
computed: { computed: {
...mapGetters(['options']) ...mapGetters(['options']),
author() {
if (this.theme.author) {
return this.theme.author
}
return {}
}
}, },
methods: { methods: {
loadSkeleton() { async handleFetchConfiguration() {
this.settingLoading = true this.settingLoading = true
setTimeout(() => { await themeApi.fetchConfiguration(this.theme.id).then(response => {
this.settingLoading = false this.themeConfigurations = response.data.data
}, 500) })
this.handleFetchSettings()
}, },
initData() { handleFetchSettings() {
this.settingLoading = true themeApi
.fetchSettings(this.theme.id)
themeApi.fetchConfiguration(this.selectedTheme.id).then(response => { .then(response => {
this.themeConfiguration = response.data.data
themeApi.fetchSettings(this.selectedTheme.id).then(response => {
this.themeSettings = response.data.data this.themeSettings = response.data.data
})
.finally(() => {
setTimeout(() => { setTimeout(() => {
this.settingLoading = false this.settingLoading = false
}, 300) }, 200)
}) })
})
}, },
handleSaveSettings() { handleSaveSettings() {
this.saving = true this.saving = true
themeApi themeApi
.saveSettings(this.selectedTheme.id, this.themeSettings) .saveSettings(this.theme.id, this.themeSettings)
.then(response => { .then(response => {
this.$message.success('保存成功！') this.$message.success('保存成功！')
if (this.viewMode) { if (this.viewMode) {

6
src/views/post/CategoryList.vue
View File

@ -7,7 +7,7 @@
:md="10" :md="10"
:sm="24" :sm="24"
:xs="24" :xs="24"
:style="{ 'padding-bottom': '12px' }" class="pb-3"
> >
<a-card <a-card
:title="title" :title="title"
@ -96,7 +96,7 @@
:md="14" :md="14"
:sm="24" :sm="24"
:xs="24" :xs="24"
:style="{ 'padding-bottom': '1rem' }" class="pb-3"
> >
<a-card <a-card
title="分类列表" title="分类列表"
@ -187,7 +187,7 @@
<span <span
slot="postCount" slot="postCount"
slot-scope="text,record" slot-scope="text,record"
style="cursor: pointer;" class="cursor-pointer"
@click="handleQueryCategoryPosts(record)" @click="handleQueryCategoryPosts(record)"
> >
<a-badge <a-badge

39
src/views/post/PostEdit.vue
View File

@ -2,7 +2,7 @@
<div> <div>
<a-row :gutter="12"> <a-row :gutter="12">
<a-col :span="24"> <a-col :span="24">
<div style="margin-bottom: 16px"> <div class="mb-4">
<a-input <a-input
v-model="postToStage.title" v-model="postToStage.title"
size="large" size="large"
@ -32,7 +32,7 @@
:categoryIds="selectedCategoryIds" :categoryIds="selectedCategoryIds"
:metas="selectedMetas" :metas="selectedMetas"
:visible="postSettingVisible" :visible="postSettingVisible"
@close="onPostSettingsClose" @close="postSettingVisible = false"
@onRefreshPost="onRefreshPostFromSetting" @onRefreshPost="onRefreshPostFromSetting"
@onRefreshTagIds="onRefreshTagIdsFromSetting" @onRefreshTagIds="onRefreshTagIdsFromSetting"
@onRefreshCategoryIds="onRefreshCategoryIdsFromSetting" @onRefreshCategoryIds="onRefreshCategoryIdsFromSetting"
@ -45,23 +45,23 @@
<footer-tool-bar :style="{ width: isSideMenu() && isDesktop() ? `calc(100% - ${sidebarOpened ? 256 : 80}px)` : '100%'}"> <footer-tool-bar :style="{ width: isSideMenu() && isDesktop() ? `calc(100% - ${sidebarOpened ? 256 : 80}px)` : '100%'}">
<a-button <a-button
type="danger" type="danger"
class="mr-2"
@click="handleSaveDraft(false)" @click="handleSaveDraft(false)"
:loading="draftSaving" :loading="draftSaving"
>保存草稿</a-button> >保存草稿</a-button>
<a-button <a-button
@click="handlePreview" @click="handlePreview"
style="margin-left: 8px;" class="mr-2"
:loading="previewSaving" :loading="previewSaving"
>预览</a-button> >预览</a-button>
<a-button <a-button
type="primary" type="primary"
@click="handleShowPostSetting" @click="postSettingVisible = true"
style="margin-left: 8px;" class="mr-2"
>发布</a-button> >发布</a-button>
<a-button <a-button
type="dashed" type="dashed"
@click="attachmentDrawerVisible = true" @click="attachmentDrawerVisible = true"
style="margin-left: 8px;"
>附件库</a-button> >附件库</a-button>
</footer-tool-bar> </footer-tool-bar>
</div> </div>
@ -194,7 +194,9 @@ export default {
this.$message.success('保存草稿成功！') this.$message.success('保存草稿成功！')
}) })
.finally(() => { .finally(() => {
this.draftSaving = false setTimeout(() => {
this.draftSaving = false
}, 200)
}) })
} else { } else {
postApi postApi
@ -205,7 +207,9 @@ export default {
this.postToStage = response.data.data this.postToStage = response.data.data
}) })
.finally(() => { .finally(() => {
this.draftSaving = false setTimeout(() => {
this.draftSaving = false
}, 200)
}) })
} }
} else { } else {
@ -218,13 +222,12 @@ export default {
this.postToStage = response.data.data this.postToStage = response.data.data
}) })
.finally(() => { .finally(() => {
this.draftSaving = false setTimeout(() => {
this.draftSaving = false
}, 200)
}) })
} }
}, },
handleShowPostSetting() {
this.postSettingVisible = true
},
handlePreview() { handlePreview() {
this.postToStage.status = 'DRAFT' this.postToStage.status = 'DRAFT'
if (!this.postToStage.title) { if (!this.postToStage.title) {
@ -241,7 +244,9 @@ export default {
window.open(response.data, '_blank') window.open(response.data, '_blank')
}) })
.finally(() => { .finally(() => {
this.previewSaving = false setTimeout(() => {
this.previewSaving = false
}, 200)
}) })
}) })
} else { } else {
@ -255,7 +260,9 @@ export default {
window.open(response.data, '_blank') window.open(response.data, '_blank')
}) })
.finally(() => { .finally(() => {
this.previewSaving = false setTimeout(() => {
this.previewSaving = false
}, 200)
}) })
}) })
} }
@ -263,10 +270,6 @@ export default {
onContentChange(val) { onContentChange(val) {
this.postToStage.originalContent = val this.postToStage.originalContent = val
}, },
// 关闭文章设置抽屉
onPostSettingsClose() {
this.postSettingVisible = false
},
onRefreshPostFromSetting(post) { onRefreshPostFromSetting(post) {
this.postToStage = post this.postToStage = post
}, },

93
src/views/post/PostList.vue
View File

@ -64,12 +64,10 @@
<span class="table-page-search-submitButtons"> <span class="table-page-search-submitButtons">
<a-button <a-button
type="primary" type="primary"
class="mr-2"
@click="handleQuery()" @click="handleQuery()"
>查询</a-button> >查询</a-button>
<a-button <a-button @click="handleResetParam()">重置</a-button>
style="margin-left: 8px;"
@click="handleResetParam()"
>重置</a-button>
</span> </span>
</a-col> </a-col>
</a-row> </a-row>
@ -130,14 +128,13 @@
</a> </a>
</a-menu-item> </a-menu-item>
</a-menu> </a-menu>
<a-button style="margin-left: 8px;"> <a-button class="ml-2">
批量操作 批量操作
<a-icon type="down" /> <a-icon type="down" />
</a-button> </a-button>
</a-dropdown> </a-dropdown>
</div> </div>
<div style="margin-top:15px"> <div class="mt-4">
<!-- Mobile --> <!-- Mobile -->
<a-list <a-list
v-if="isMobile()" v-if="isMobile()"
@ -242,7 +239,7 @@
v-if="item.status=='PUBLISHED' || item.status == 'INTIMATE'" v-if="item.status=='PUBLISHED' || item.status == 'INTIMATE'"
:href="item.fullPath" :href="item.fullPath"
target="_blank" target="_blank"
style="text-decoration: none;" class="no-underline"
> >
<a-tooltip <a-tooltip
placement="top" placement="top"
@ -252,7 +249,7 @@
<a <a
v-else-if="item.status=='DRAFT'" v-else-if="item.status=='DRAFT'"
href="javascript:void(0)" href="javascript:void(0)"
style="text-decoration: none;" class="no-underline"
@click="handlePreview(item.id)" @click="handlePreview(item.id)"
> >
<a-tooltip <a-tooltip
@ -263,7 +260,7 @@
<a <a
v-else v-else
href="javascript:void(0);" href="javascript:void(0);"
style="text-decoration: none;" class="no-underline"
disabled disabled
> >
{{ item.title }} {{ item.title }}
@ -323,7 +320,7 @@
v-if="record.status=='PUBLISHED' || record.status == 'INTIMATE'" v-if="record.status=='PUBLISHED' || record.status == 'INTIMATE'"
:href="record.fullPath" :href="record.fullPath"
target="_blank" target="_blank"
style="text-decoration: none;" class="no-underline"
> >
<a-tooltip <a-tooltip
placement="top" placement="top"
@ -333,7 +330,7 @@
<a <a
v-else-if="record.status=='DRAFT'" v-else-if="record.status=='DRAFT'"
href="javascript:void(0)" href="javascript:void(0)"
style="text-decoration: none;" class="no-underline"
@click="handlePreview(record.id)" @click="handlePreview(record.id)"
> >
<a-tooltip <a-tooltip
@ -344,7 +341,7 @@
<a <a
v-else v-else
href="javascript:void(0);" href="javascript:void(0);"
style="text-decoration: none;" class="no-underline"
disabled disabled
> >
{{ text }} {{ text }}
@ -625,8 +622,8 @@ export default {
} }
}, },
created() { created() {
this.loadPosts() this.handleListPosts()
this.loadCategories() this.handleListCategories()
}, },
destroyed: function() { destroyed: function() {
if (this.postSettingVisible) { if (this.postSettingVisible) {
@ -662,8 +659,10 @@ export default {
} }
}, },
methods: { methods: {
loadPosts() { handleListPosts(enableLoading = true) {
this.postsLoading = true if (enableLoading) {
this.postsLoading = true
}
// Set from pagination // Set from pagination
this.queryParam.page = this.pagination.page - 1 this.queryParam.page = this.pagination.page - 1
this.queryParam.size = this.pagination.size this.queryParam.size = this.pagination.size
@ -680,7 +679,7 @@ export default {
}, 200) }, 200)
}) })
}, },
loadCategories() { handleListCategories() {
this.categoriesLoading = true this.categoriesLoading = true
categoryApi categoryApi
.listAll(true) .listAll(true)
@ -712,7 +711,7 @@ export default {
this.$log.debug(`Current: ${page}, PageSize: ${pageSize}`) this.$log.debug(`Current: ${page}, PageSize: ${pageSize}`)
this.pagination.page = page this.pagination.page = page
this.pagination.size = pageSize this.pagination.size = pageSize
this.loadPosts() this.handleListPosts()
}, },
handleResetParam() { handleResetParam() {
this.queryParam.keyword = null this.queryParam.keyword = null
@ -726,38 +725,54 @@ export default {
this.handlePaginationChange(1, this.pagination.size) this.handlePaginationChange(1, this.pagination.size)
}, },
handleEditStatusClick(postId, status) { handleEditStatusClick(postId, status) {
postApi.updateStatus(postId, status).then(response => { postApi
this.$message.success('操作成功！') .updateStatus(postId, status)
this.loadPosts() .then(response => {
}) this.$message.success('操作成功！')
})
.finally(() => {
this.handleListPosts()
})
}, },
handleDeleteClick(postId) { handleDeleteClick(postId) {
postApi.delete(postId).then(response => { postApi
this.$message.success('删除成功！') .delete(postId)
this.loadPosts() .then(response => {
}) this.$message.success('删除成功！')
})
.finally(() => {
this.handleListPosts()
})
}, },
handleEditStatusMore(status) { handleEditStatusMore(status) {
if (this.selectedRowKeys.length <= 0) { if (this.selectedRowKeys.length <= 0) {
this.$message.info('请至少选择一项！') this.$message.info('请至少选择一项！')
return return
} }
postApi.updateStatusInBatch(this.selectedRowKeys, status).then(response => { postApi
this.$log.debug(`postId: ${this.selectedRowKeys}, status: ${status}`) .updateStatusInBatch(this.selectedRowKeys, status)
this.selectedRowKeys = [] .then(response => {
this.loadPosts() this.$log.debug(`postId: ${this.selectedRowKeys}, status: ${status}`)
}) this.selectedRowKeys = []
})
.finally(() => {
this.handleListPosts()
})
}, },
handleDeleteMore() { handleDeleteMore() {
if (this.selectedRowKeys.length <= 0) { if (this.selectedRowKeys.length <= 0) {
this.$message.info('请至少选择一项！') this.$message.info('请至少选择一项！')
return return
} }
postApi.deleteInBatch(this.selectedRowKeys).then(response => { postApi
this.$log.debug(`delete: ${this.selectedRowKeys}`) .deleteInBatch(this.selectedRowKeys)
this.selectedRowKeys = [] .then(response => {
this.loadPosts() this.$log.debug(`delete: ${this.selectedRowKeys}`)
}) this.selectedRowKeys = []
})
.finally(() => {
this.handleListPosts()
})
}, },
handleShowPostSettings(post) { handleShowPostSettings(post) {
postApi.get(post.id).then(response => { postApi.get(post.id).then(response => {
@ -787,14 +802,14 @@ export default {
this.postSettingVisible = false this.postSettingVisible = false
this.selectedPost = {} this.selectedPost = {}
setTimeout(() => { setTimeout(() => {
this.loadPosts() this.handleListPosts(false)
}, 500) }, 500)
}, },
onPostCommentsClose() { onPostCommentsClose() {
this.postCommentVisible = false this.postCommentVisible = false
this.selectedPost = {} this.selectedPost = {}
setTimeout(() => { setTimeout(() => {
this.loadPosts() this.handleListPosts(false)
}, 500) }, 500)
}, },
onRefreshPostFromSetting(post) { onRefreshPostFromSetting(post) {

6
src/views/post/TagList.vue
View File

@ -7,7 +7,7 @@
:md="10" :md="10"
:sm="24" :sm="24"
:xs="24" :xs="24"
:style="{ 'padding-bottom': '12px' }" class="pb-3"
> >
<a-card <a-card
:title="title" :title="title"
@ -75,7 +75,7 @@
> >
<a-button <a-button
type="danger" type="danger"
style="float:right" class="float-right"
>删除</a-button> >删除</a-button>
</a-popconfirm> </a-popconfirm>
</a-form-model-item> </a-form-model-item>
@ -88,7 +88,7 @@
:md="14" :md="14"
:sm="24" :sm="24"
:xs="24" :xs="24"
:style="{ 'padding-bottom': '12px' }" class="pb-3"
> >
<a-card <a-card
title="所有标签" title="所有标签"

423
src/views/post/components/PostSettingDrawer.vue
View File

@ -8,191 +8,185 @@
@close="onClose" @close="onClose"
:visible="visible" :visible="visible"
> >
<a-skeleton <div class="post-setting-drawer-content">
active <div class="mb-4">
:loading="settingLoading" <h3 class="post-setting-drawer-title">基本设置</h3>
:paragraph="{ rows: 24 }" <div class="post-setting-drawer-item">
> <a-form layout="vertical">
<div class="post-setting-drawer-content"> <a-form-item
<div :style="{ marginBottom: '16px' }"> label="文章标题："
<h3 class="post-setting-drawer-title">基本设置</h3> v-if="needTitle"
<div class="post-setting-drawer-item"> >
<a-form layout="vertical"> <a-input v-model="selectedPost.title" />
<a-form-item </a-form-item>
label="文章标题：" <a-form-item label="文章别名：">
v-if="needTitle" <template slot="help">
<span v-if="options.post_permalink_type === 'DEFAULT'">{{ options.blog_url }}/{{ options.archives_prefix }}/{{ selectedPost.slug?selectedPost.slug:'${slug}' }}{{ (options.path_suffix?options.path_suffix:'') }}</span>
<span v-else-if="options.post_permalink_type === 'DATE'">{{ options.blog_url }}{{ selectedPost.createTime?selectedPost.createTime:new Date() | moment_post_date }}{{ selectedPost.slug?selectedPost.slug:'${slug}' }}{{ (options.path_suffix?options.path_suffix:'') }}</span>
<span v-else-if="options.post_permalink_type === 'DAY'">{{ options.blog_url }}{{ selectedPost.createTime?selectedPost.createTime:new Date() | moment_post_day }}{{ selectedPost.slug?selectedPost.slug:'${slug}' }}{{ (options.path_suffix?options.path_suffix:'') }}</span>
<span v-else-if="options.post_permalink_type === 'ID'">{{ options.blog_url }}/?p={{ selectedPost.id?selectedPost.id:'${id}' }}</span>
</template>
<a-input v-model="selectedPost.slug" />
</a-form-item>
<a-form-item label="发表时间：">
<a-date-picker
showTime
:defaultValue="pickerDefaultValue"
format="YYYY-MM-DD HH:mm:ss"
placeholder="选择文章发表时间"
@change="onPostDateChange"
@ok="onPostDateOk"
/>
</a-form-item>
<a-form-item label="开启评论：">
<a-radio-group
v-model="selectedPost.disallowComment"
:defaultValue="false"
> >
<a-input v-model="selectedPost.title" /> <a-radio :value="false">开启</a-radio>
</a-form-item> <a-radio :value="true">关闭</a-radio>
<a-form-item label="文章别名："> </a-radio-group>
<template slot="help"> </a-form-item>
<span v-if="options.post_permalink_type === 'DEFAULT'">{{ options.blog_url }}/{{ options.archives_prefix }}/{{ selectedPost.slug?selectedPost.slug:'${slug}' }}{{ (options.path_suffix?options.path_suffix:'') }}</span> <a-form-item label="是否置顶：">
<span v-else-if="options.post_permalink_type === 'DATE'">{{ options.blog_url }}{{ selectedPost.createTime?selectedPost.createTime:new Date() | moment_post_date }}{{ selectedPost.slug?selectedPost.slug:'${slug}' }}{{ (options.path_suffix?options.path_suffix:'') }}</span> <a-radio-group
<span v-else-if="options.post_permalink_type === 'DAY'">{{ options.blog_url }}{{ selectedPost.createTime?selectedPost.createTime:new Date() | moment_post_day }}{{ selectedPost.slug?selectedPost.slug:'${slug}' }}{{ (options.path_suffix?options.path_suffix:'') }}</span> v-model="selectedPost.topPriority"
<span v-else-if="options.post_permalink_type === 'ID'">{{ options.blog_url }}/?p={{ selectedPost.id?selectedPost.id:'${id}' }}</span> :defaultValue="0"
</template>
<a-input v-model="selectedPost.slug" />
</a-form-item>
<a-form-item label="发表时间：">
<a-date-picker
showTime
:defaultValue="pickerDefaultValue"
format="YYYY-MM-DD HH:mm:ss"
placeholder="选择文章发表时间"
@change="onPostDateChange"
@ok="onPostDateOk"
/>
</a-form-item>
<a-form-item label="开启评论：">
<a-radio-group
v-model="selectedPost.disallowComment"
:defaultValue="false"
>
<a-radio :value="false">开启</a-radio>
<a-radio :value="true">关闭</a-radio>
</a-radio-group>
</a-form-item>
<a-form-item label="是否置顶：">
<a-radio-group
v-model="selectedPost.topPriority"
:defaultValue="0"
>
<a-radio :value="1">是</a-radio>
<a-radio :value="0">否</a-radio>
</a-radio-group>
</a-form-item>
<a-form-item
label="自定义模板："
v-if="customTpls.length > 0"
> >
<a-select v-model="selectedPost.template"> <a-radio :value="1">是</a-radio>
<a-select-option <a-radio :value="0">否</a-radio>
key="" </a-radio-group>
value="" </a-form-item>
>无</a-select-option> <a-form-item
<a-select-option label="自定义模板："
v-for="tpl in customTpls" v-if="customTpls.length > 0"
:key="tpl" >
:value="tpl" <a-select v-model="selectedPost.template">
>{{ tpl }}</a-select-option> <a-select-option
</a-select> key=""
</a-form-item> value=""
</a-form> >无</a-select-option>
</div> <a-select-option
v-for="tpl in customTpls"
:key="tpl"
:value="tpl"
>{{ tpl }}</a-select-option>
</a-select>
</a-form-item>
</a-form>
</div> </div>
<a-divider />
<div :style="{ marginBottom: '16px' }">
<h3 class="post-setting-drawer-title">分类目录</h3>
<div class="post-setting-drawer-item">
<a-form layout="vertical">
<a-form-item>
<category-tree
v-model="selectedCategoryIds"
:categories="categories"
/>
</a-form-item>
<a-form-item v-if="categoryFormVisible">
<category-select-tree
:categories="categories"
v-model="categoryToCreate.parentId"
/>
</a-form-item>
<a-form-item v-if="categoryFormVisible">
<a-input
placeholder="分类名称"
v-model="categoryToCreate.name"
/>
</a-form-item>
<a-form-item v-if="categoryFormVisible">
<a-input
placeholder="分类路径"
v-model="categoryToCreate.slug"
/>
</a-form-item>
<a-form-item>
<a-button
type="primary"
style="marginRight: 8px"
v-if="categoryFormVisible"
@click="handlerCreateCategory"
>保存</a-button>
<a-button
type="dashed"
style="marginRight: 8px"
v-if="!categoryFormVisible"
@click="toggleCategoryForm"
>新增</a-button>
<a-button
v-if="categoryFormVisible"
@click="toggleCategoryForm"
>取消</a-button>
</a-form-item>
</a-form>
</div>
</div>
<a-divider />
<div :style="{ marginBottom: '16px' }">
<h3 class="post-setting-drawer-title">标签</h3>
<div class="post-setting-drawer-item">
<a-form layout="vertical">
<a-form-item>
<TagSelect v-model="selectedTagIds" />
</a-form-item>
</a-form>
</div>
</div>
<a-divider />
<div :style="{ marginBottom: '16px' }">
<h3 class="post-setting-drawer-title">摘要</h3>
<div class="post-setting-drawer-item">
<a-form layout="vertical">
<a-form-item>
<a-input
type="textarea"
:autoSize="{ minRows: 5 }"
v-model="selectedPost.summary"
placeholder="如不填写，会从文章中自动截取"
/>
</a-form-item>
</a-form>
</div>
</div>
<a-divider />
<div :style="{ marginBottom: '16px' }">
<h3 class="post-setting-drawer-title">封面图</h3>
<div class="post-setting-drawer-item">
<div class="post-thumb">
<img
class="img"
:src="selectedPost.thumbnail || '/images/placeholder.jpg'"
@click="thumbDrawerVisible=true"
>
<a-form layout="vertial">
<a-form-item>
<a-input
v-model="selectedPost.thumbnail"
placeholder="点击封面图选择图片，或者输入外部链接"
></a-input>
</a-form-item>
</a-form>
<a-button
class="post-thumb-remove"
type="dashed"
@click="handleRemoveThumb"
>移除</a-button>
</div>
</div>
</div>
<a-divider class="divider-transparent" />
</div> </div>
</a-skeleton> <a-divider />
<div class="mb-4">
<h3 class="post-setting-drawer-title">分类目录</h3>
<div class="post-setting-drawer-item">
<a-form layout="vertical">
<a-form-item>
<category-tree
v-model="selectedCategoryIds"
:categories="categories"
/>
</a-form-item>
<a-form-item v-if="categoryFormVisible">
<category-select-tree
:categories="categories"
v-model="categoryToCreate.parentId"
/>
</a-form-item>
<a-form-item v-if="categoryFormVisible">
<a-input
placeholder="分类名称"
v-model="categoryToCreate.name"
/>
</a-form-item>
<a-form-item v-if="categoryFormVisible">
<a-input
placeholder="分类路径"
v-model="categoryToCreate.slug"
/>
</a-form-item>
<a-form-item>
<a-button
type="primary"
class="mr-2"
v-if="categoryFormVisible"
@click="handlerCreateCategory"
>保存</a-button>
<a-button
type="dashed"
class="mr-2"
v-if="!categoryFormVisible"
@click="categoryFormVisible = true"
>新增</a-button>
<a-button
v-if="categoryFormVisible"
@click="categoryFormVisible = false"
>取消</a-button>
</a-form-item>
</a-form>
</div>
</div>
<a-divider />
<div class="mb-4">
<h3 class="post-setting-drawer-title">标签</h3>
<div class="post-setting-drawer-item">
<a-form layout="vertical">
<a-form-item>
<TagSelect v-model="selectedTagIds" />
</a-form-item>
</a-form>
</div>
</div>
<a-divider />
<div class="mb-4">
<h3 class="post-setting-drawer-title">摘要</h3>
<div class="post-setting-drawer-item">
<a-form layout="vertical">
<a-form-item>
<a-input
type="textarea"
:autoSize="{ minRows: 5 }"
v-model="selectedPost.summary"
placeholder="如不填写，会从文章中自动截取"
/>
</a-form-item>
</a-form>
</div>
</div>
<a-divider />
<div class="mb-4">
<h3 class="post-setting-drawer-title">封面图</h3>
<div class="post-setting-drawer-item">
<div class="post-thumb">
<img
class="img"
:src="selectedPost.thumbnail || '/images/placeholder.jpg'"
@click="thumbDrawerVisible=true"
>
<a-form layout="vertial">
<a-form-item>
<a-input
v-model="selectedPost.thumbnail"
placeholder="点击封面图选择图片，或者输入外部链接"
></a-input>
</a-form-item>
</a-form>
<a-button
class="post-thumb-remove"
type="dashed"
@click="selectedPost.thumbnail = null"
>移除</a-button>
</div>
</div>
</div>
<a-divider class="divider-transparent" />
</div>
<AttachmentSelectDrawer <AttachmentSelectDrawer
v-model="thumbDrawerVisible" v-model="thumbDrawerVisible"
@listenToSelect="handleSelectPostThumb" @listenToSelect="handleSelectPostThumb"
@ -205,11 +199,11 @@
placement="right" placement="right"
closable closable
destroyOnClose destroyOnClose
@close="onAdvancedClose" @close="advancedVisible = false"
:visible="advancedVisible" :visible="advancedVisible"
> >
<div class="post-setting-drawer-content"> <div class="post-setting-drawer-content">
<div :style="{ marginBottom: '16px' }"> <div class="mb-4">
<h3 class="post-setting-drawer-title">加密设置</h3> <h3 class="post-setting-drawer-title">加密设置</h3>
<div class="post-setting-drawer-item"> <div class="post-setting-drawer-item">
<a-form layout="vertical"> <a-form layout="vertical">
@ -223,7 +217,7 @@
</div> </div>
</div> </div>
<a-divider /> <a-divider />
<div :style="{ marginBottom: '16px' }"> <div class="mb-4">
<h3 class="post-setting-drawer-title">SEO 设置</h3> <h3 class="post-setting-drawer-title">SEO 设置</h3>
<div class="post-setting-drawer-item"> <div class="post-setting-drawer-item">
<a-form layout="vertical"> <a-form layout="vertical">
@ -245,7 +239,7 @@
</div> </div>
</div> </div>
<a-divider /> <a-divider />
<div :style="{ marginBottom: '16px' }"> <div class="mb-4">
<h3 class="post-setting-drawer-title">元数据</h3> <h3 class="post-setting-drawer-title">元数据</h3>
<a-form layout="vertical"> <a-form layout="vertical">
<a-form-item <a-form-item
@ -285,12 +279,12 @@
<div class="bottom-control"> <div class="bottom-control">
<a-button <a-button
style="marginRight: 8px" class="mr-2"
type="dashed" type="dashed"
@click="advancedVisible = true" @click="advancedVisible = true"
>高级</a-button> >高级</a-button>
<a-button <a-button
style="marginRight: 8px" class="mr-2"
@click="handleDraftClick" @click="handleDraftClick"
v-if="saveDraftButton" v-if="saveDraftButton"
:loading="draftSaving" :loading="draftSaving"
@ -326,7 +320,6 @@ export default {
thumbDrawerVisible: false, thumbDrawerVisible: false,
categoryFormVisible: false, categoryFormVisible: false,
advancedVisible: false, advancedVisible: false,
settingLoading: true,
selectedPost: this.post, selectedPost: this.post,
selectedTagIds: this.tagIds, selectedTagIds: this.tagIds,
selectedCategoryIds: this.categoryIds, selectedCategoryIds: this.categoryIds,
@ -394,10 +387,9 @@ export default {
}, },
visible: function(newValue, oldValue) { visible: function(newValue, oldValue) {
if (newValue) { if (newValue) {
this.loadSkeleton() this.handleListCategories()
this.loadCategories() this.handleListPresetMetasField()
this.loadPresetMetasField() this.handleListCustomTpls()
this.loadCustomTpls()
} }
} }
}, },
@ -417,18 +409,12 @@ export default {
...mapGetters(['options']) ...mapGetters(['options'])
}, },
methods: { methods: {
loadSkeleton() { handleListCategories() {
this.settingLoading = true
setTimeout(() => {
this.settingLoading = false
}, 500)
},
loadCategories() {
categoryApi.listAll().then(response => { categoryApi.listAll().then(response => {
this.categories = response.data.data this.categories = response.data.data
}) })
}, },
loadPresetMetasField() { handleListPresetMetasField() {
if (this.metas.length <= 0) { if (this.metas.length <= 0) {
themeApi.getActivatedTheme().then(response => { themeApi.getActivatedTheme().then(response => {
const fields = response.data.data.postMetaField const fields = response.data.data.postMetaField
@ -443,7 +429,7 @@ export default {
}) })
} }
}, },
loadCustomTpls() { handleListCustomTpls() {
themeApi.customPostTpls().then(response => { themeApi.customPostTpls().then(response => {
this.customTpls = response.data.data this.customTpls = response.data.data
}) })
@ -452,9 +438,6 @@ export default {
this.selectedPost.thumbnail = encodeURI(data.path) this.selectedPost.thumbnail = encodeURI(data.path)
this.thumbDrawerVisible = false this.thumbDrawerVisible = false
}, },
handleRemoveThumb() {
this.selectedPost.thumbnail = null
},
handlerCreateCategory() { handlerCreateCategory() {
if (!this.categoryToCreate.name) { if (!this.categoryToCreate.name) {
this.$notification['error']({ this.$notification['error']({
@ -463,14 +446,15 @@ export default {
}) })
return return
} }
categoryApi.create(this.categoryToCreate).then(response => { categoryApi
this.loadCategories() .create(this.categoryToCreate)
this.categoryToCreate = {} .then(response => {
this.toggleCategoryForm() this.categoryToCreate = {}
}) this.categoryFormVisible = false
}, })
toggleCategoryForm() { .finally(() => {
this.categoryFormVisible = !this.categoryFormVisible this.handleListCategories()
})
}, },
handleDraftClick() { handleDraftClick() {
this.selectedPost.status = 'DRAFT' this.selectedPost.status = 'DRAFT'
@ -519,8 +503,10 @@ export default {
this.$router.push({ name: 'PostList' }) this.$router.push({ name: 'PostList' })
}) })
.finally(() => { .finally(() => {
this.saving = false setTimeout(() => {
this.draftSaving = false this.saving = false
this.draftSaving = false
}, 200)
}) })
} else { } else {
// Create the post // Create the post
@ -540,17 +526,16 @@ export default {
this.selectedPost = response.data.data this.selectedPost = response.data.data
}) })
.finally(() => { .finally(() => {
this.saving = false setTimeout(() => {
this.draftSaving = false this.saving = false
this.draftSaving = false
}, 200)
}) })
} }
}, },
onClose() { onClose() {
this.$emit('close', false) this.$emit('close', false)
}, },
onAdvancedClose() {
this.advancedVisible = false
},
onPostDateChange(value, dateString) { onPostDateChange(value, dateString) {
this.selectedPost.createTime = value.valueOf() this.selectedPost.createTime = value.valueOf()
}, },

8
src/views/post/components/TagSelect.vue
View File

@ -2,7 +2,7 @@
<div> <div>
<a-select <a-select
v-model="selectedTagNames" v-model="selectedTagNames"
style="width: 100%" class="w-full"
allowClear allowClear
mode="tags" mode="tags"
placeholder="选择或输入标签" placeholder="选择或输入标签"
@ -41,7 +41,7 @@ export default {
} }
}, },
created() { created() {
this.loadTags() this.handleListTags()
}, },
watch: { watch: {
tags(newValue, oldValue) { tags(newValue, oldValue) {
@ -68,7 +68,7 @@ export default {
} }
}, },
methods: { methods: {
loadTags(callback) { handleListTags(callback) {
tagApi.listAll(true).then(response => { tagApi.listAll(true).then(response => {
this.tags = response.data.data this.tags = response.data.data
if (callback) { if (callback) {
@ -93,7 +93,7 @@ export default {
axios.all(createPromises).then( axios.all(createPromises).then(
axios.spread(() => { axios.spread(() => {
this.loadTags(() => { this.handleListTags(() => {
this.$log.debug('Tag name map', this.tagNameMap) this.$log.debug('Tag name map', this.tagNameMap)
// Get all tag id // Get all tag id
const tagIds = this.selectedTagNames.map(tagName => this.tagNameMap[tagName].id) const tagIds = this.selectedTagNames.map(tagName => this.tagNameMap[tagName].id)

38
src/views/sheet/SheetEdit.vue
View File

@ -2,7 +2,7 @@
<div> <div>
<a-row :gutter="12"> <a-row :gutter="12">
<a-col :span="24"> <a-col :span="24">
<div style="margin-bottom: 16px"> <div class="mb-4">
<a-input <a-input
v-model="sheetToStage.title" v-model="sheetToStage.title"
size="large" size="large"
@ -30,7 +30,7 @@
:sheet="sheetToStage" :sheet="sheetToStage"
:metas="selectedMetas" :metas="selectedMetas"
:visible="sheetSettingVisible" :visible="sheetSettingVisible"
@close="onSheetSettingsClose" @close="sheetSettingVisible = false"
@onRefreshSheet="onRefreshSheetFromSetting" @onRefreshSheet="onRefreshSheetFromSetting"
@onRefreshSheetMetas="onRefreshSheetMetasFromSetting" @onRefreshSheetMetas="onRefreshSheetMetasFromSetting"
@onSaved="onSaved" @onSaved="onSaved"
@ -40,22 +40,22 @@
<footer-tool-bar :style="{ width: isSideMenu() && isDesktop() ? `calc(100% - ${sidebarOpened ? 256 : 80}px)` : '100%'}"> <footer-tool-bar :style="{ width: isSideMenu() && isDesktop() ? `calc(100% - ${sidebarOpened ? 256 : 80}px)` : '100%'}">
<a-button <a-button
type="danger" type="danger"
class="mr-2"
@click="handleSaveDraft(false)" @click="handleSaveDraft(false)"
:loading="draftSaving" :loading="draftSaving"
>保存草稿</a-button> >保存草稿</a-button>
<a-button <a-button
@click="handlePreview" @click="handlePreview"
style="margin-left: 8px;" class="mr-2"
:loading="previewSaving" :loading="previewSaving"
>预览</a-button> >预览</a-button>
<a-button <a-button
type="primary" type="primary"
style="margin-left: 8px;" class="mr-2"
@click="handleShowSheetSetting" @click="sheetSettingVisible = true"
>发布</a-button> >发布</a-button>
<a-button <a-button
type="dashed" type="dashed"
style="margin-left: 8px;"
@click="attachmentDrawerVisible = true" @click="attachmentDrawerVisible = true"
>附件库</a-button> >附件库</a-button>
</footer-tool-bar> </footer-tool-bar>
@ -184,7 +184,9 @@ export default {
this.$message.success('保存草稿成功！') this.$message.success('保存草稿成功！')
}) })
.finally(() => { .finally(() => {
this.draftSaving = false setTimeout(() => {
this.draftSaving = false
}, 200)
}) })
} else { } else {
sheetApi sheetApi
@ -195,7 +197,9 @@ export default {
this.sheetToStage = response.data.data this.sheetToStage = response.data.data
}) })
.finally(() => { .finally(() => {
this.draftSaving = false setTimeout(() => {
this.draftSaving = false
}, 200)
}) })
} }
} else { } else {
@ -207,13 +211,12 @@ export default {
this.sheetToStage = response.data.data this.sheetToStage = response.data.data
}) })
.finally(() => { .finally(() => {
this.draftSaving = false setTimeout(() => {
this.draftSaving = false
}, 200)
}) })
} }
}, },
handleShowSheetSetting() {
this.sheetSettingVisible = true
},
handlePreview() { handlePreview() {
this.sheetToStage.status = 'DRAFT' this.sheetToStage.status = 'DRAFT'
if (!this.sheetToStage.title) { if (!this.sheetToStage.title) {
@ -229,7 +232,9 @@ export default {
window.open(response.data, '_blank') window.open(response.data, '_blank')
}) })
.finally(() => { .finally(() => {
this.previewSaving = false setTimeout(() => {
this.previewSaving = false
}, 200)
}) })
}) })
} else { } else {
@ -242,7 +247,9 @@ export default {
window.open(response.data, '_blank') window.open(response.data, '_blank')
}) })
.finally(() => { .finally(() => {
this.previewSaving = false setTimeout(() => {
this.previewSaving = false
}, 200)
}) })
}) })
} }
@ -250,9 +257,6 @@ export default {
onContentChange(val) { onContentChange(val) {
this.sheetToStage.originalContent = val this.sheetToStage.originalContent = val
}, },
onSheetSettingsClose() {
this.sheetSettingVisible = false
},
onRefreshSheetFromSetting(sheet) { onRefreshSheetFromSetting(sheet) {
this.sheetToStage = sheet this.sheetToStage = sheet
}, },

52
src/views/sheet/components/CustomSheetList.vue
View File

@ -107,7 +107,7 @@
v-if="item.status=='PUBLISHED'" v-if="item.status=='PUBLISHED'"
:href="item.fullPath" :href="item.fullPath"
target="_blank" target="_blank"
style="text-decoration: none;" class="no-underline"
> >
<a-tooltip <a-tooltip
placement="top" placement="top"
@ -117,7 +117,7 @@
<a <a
v-else-if="item.status=='DRAFT'" v-else-if="item.status=='DRAFT'"
href="javascript:void(0)" href="javascript:void(0)"
style="text-decoration: none;" class="no-underline"
@click="handlePreview(item.id)" @click="handlePreview(item.id)"
> >
<a-tooltip <a-tooltip
@ -128,7 +128,7 @@
<a <a
v-else v-else
href="javascript:void(0);" href="javascript:void(0);"
style="text-decoration: none;" class="no-underline"
disabled disabled
> >
{{ item.title }} {{ item.title }}
@ -160,7 +160,7 @@
v-if="record.status=='PUBLISHED'" v-if="record.status=='PUBLISHED'"
:href="record.fullPath" :href="record.fullPath"
target="_blank" target="_blank"
style="text-decoration: none;" class="no-underline"
> >
<a-tooltip <a-tooltip
placement="top" placement="top"
@ -170,7 +170,7 @@
<a <a
v-else-if="record.status=='DRAFT'" v-else-if="record.status=='DRAFT'"
href="javascript:void(0)" href="javascript:void(0)"
style="text-decoration: none;" class="no-underline"
@click="handlePreview(record.id)" @click="handlePreview(record.id)"
> >
<a-tooltip <a-tooltip
@ -181,7 +181,7 @@
<a <a
v-else v-else
href="javascript:void(0);" href="javascript:void(0);"
style="text-decoration: none;" class="no-underline"
disabled disabled
> >
{{ text }} {{ text }}
@ -202,7 +202,7 @@
slot="commentCount" slot="commentCount"
slot-scope="text,record" slot-scope="text,record"
@click="handleShowSheetComments(record)" @click="handleShowSheetComments(record)"
style="cursor: pointer;" class="cursor-pointer"
> >
<a-badge <a-badge
:count="record.commentCount" :count="record.commentCount"
@ -421,7 +421,7 @@ export default {
} }
}, },
created() { created() {
this.loadSheets() this.handleListSheets()
}, },
destroyed: function() { destroyed: function() {
if (this.sheetSettingVisible) { if (this.sheetSettingVisible) {
@ -435,8 +435,10 @@ export default {
next() next()
}, },
methods: { methods: {
loadSheets() { handleListSheets(enableLoading = true) {
this.loading = true if (enableLoading) {
this.loading = true
}
this.queryParam.page = this.pagination.page - 1 this.queryParam.page = this.pagination.page - 1
this.queryParam.size = this.pagination.size this.queryParam.size = this.pagination.size
this.queryParam.sort = this.pagination.sort this.queryParam.sort = this.pagination.sort
@ -456,16 +458,24 @@ export default {
this.$router.push({ name: 'SheetEdit', query: { sheetId: sheet.id } }) this.$router.push({ name: 'SheetEdit', query: { sheetId: sheet.id } })
}, },
handleEditStatusClick(sheetId, status) { handleEditStatusClick(sheetId, status) {
sheetApi.updateStatus(sheetId, status).then(response => { sheetApi
this.$message.success('操作成功！') .updateStatus(sheetId, status)
this.loadSheets() .then(response => {
}) this.$message.success('操作成功！')
})
.finally(() => {
this.handleListSheets()
})
}, },
handleDeleteClick(sheetId) { handleDeleteClick(sheetId) {
sheetApi.delete(sheetId).then(response => { sheetApi
this.$message.success('删除成功！') .delete(sheetId)
this.loadSheets() .then(response => {
}) this.$message.success('删除成功！')
})
.finally(() => {
this.handleListSheets()
})
}, },
handleSheetToMenu(sheet) { handleSheetToMenu(sheet) {
this.menu['name'] = sheet.title this.menu['name'] = sheet.title
@ -497,20 +507,20 @@ export default {
this.$log.debug(`Current: ${page}, PageSize: ${pageSize}`) this.$log.debug(`Current: ${page}, PageSize: ${pageSize}`)
this.pagination.page = page this.pagination.page = page
this.pagination.size = pageSize this.pagination.size = pageSize
this.loadSheets() this.handleListSheets()
}, },
onSheetSettingsClose() { onSheetSettingsClose() {
this.sheetSettingVisible = false this.sheetSettingVisible = false
this.selectedSheet = {} this.selectedSheet = {}
setTimeout(() => { setTimeout(() => {
this.loadSheets() this.handleListSheets(false)
}, 500) }, 500)
}, },
onSheetCommentsClose() { onSheetCommentsClose() {
this.sheetCommentVisible = false this.sheetCommentVisible = false
this.selectedSheet = {} this.selectedSheet = {}
setTimeout(() => { setTimeout(() => {
this.loadSheets() this.handleListSheets(false)
}, 500) }, 500)
}, },
onRefreshSheetFromSetting(sheet) { onRefreshSheetFromSetting(sheet) {

255
src/views/sheet/components/SheetSettingDrawer.vue
View File

@ -8,115 +8,112 @@
@close="onClose" @close="onClose"
:visible="visible" :visible="visible"
> >
<a-skeleton <div class="post-setting-drawer-content">
active <div class="mb-4">
:loading="settingLoading" <h3 class="post-setting-drawer-title">基本设置</h3>
:paragraph="{ rows: 18 }" <div class="post-setting-drawer-item">
> <a-form layout="vertical">
<div class="post-setting-drawer-content"> <a-form-item
<div :style="{ marginBottom: '16px' }"> label="页面标题："
<h3 class="post-setting-drawer-title">基本设置</h3> v-if="needTitle"
<div class="post-setting-drawer-item"> >
<a-form layout="vertical"> <a-input v-model="selectedSheet.title" />
<a-form-item </a-form-item>
label="页面标题：" <a-form-item
v-if="needTitle" label="页面别名："
:help="options.blog_url+'/'+options.sheet_prefix+'/'+ (selectedSheet.slug ? selectedSheet.slug : '{slug}')+(options.path_suffix?options.path_suffix:'')"
>
<a-input v-model="selectedSheet.slug" />
</a-form-item>
<a-form-item label="发表时间：">
<a-date-picker
showTime
:defaultValue="pickerDefaultValue"
format="YYYY-MM-DD HH:mm:ss"
placeholder="选择页面发表时间"
@change="onSheetDateChange"
@ok="onSheetDateOk"
/>
</a-form-item>
<a-form-item label="开启评论：">
<a-radio-group
v-model="selectedSheet.disallowComment"
:defaultValue="false"
> >
<a-input v-model="selectedSheet.title" /> <a-radio :value="false">开启</a-radio>
</a-form-item> <a-radio :value="true">关闭</a-radio>
<a-form-item </a-radio-group>
label="页面别名：" </a-form-item>
:help="options.blog_url+'/'+options.sheet_prefix+'/'+ (selectedSheet.slug ? selectedSheet.slug : '{slug}')+(options.path_suffix?options.path_suffix:'')" <a-form-item
label="自定义模板："
v-if="customTpls.length>0"
>
<a-select
v-model="selectedSheet.template"
:loading="customTplsLoading"
> >
<a-input v-model="selectedSheet.slug" /> <a-select-option
</a-form-item> key=""
<a-form-item label="发表时间："> value=""
<a-date-picker >无</a-select-option>
showTime <a-select-option
:defaultValue="pickerDefaultValue" v-for="tpl in customTpls"
format="YYYY-MM-DD HH:mm:ss" :key="tpl"
placeholder="选择页面发表时间" :value="tpl"
@change="onSheetDateChange" >{{ tpl }}</a-select-option>
@ok="onSheetDateOk" </a-select>
/> </a-form-item>
</a-form-item> </a-form>
<a-form-item label="开启评论：">
<a-radio-group
v-model="selectedSheet.disallowComment"
:defaultValue="false"
>
<a-radio :value="false">开启</a-radio>
<a-radio :value="true">关闭</a-radio>
</a-radio-group>
</a-form-item>
<a-form-item
label="自定义模板："
v-if="customTpls.length>0"
>
<a-select v-model="selectedSheet.template">
<a-select-option
key=""
value=""
>无</a-select-option>
<a-select-option
v-for="tpl in customTpls"
:key="tpl"
:value="tpl"
>{{ tpl }}</a-select-option>
</a-select>
</a-form-item>
</a-form>
</div>
</div> </div>
<a-divider /> </div>
<a-divider />
<div :style="{ marginBottom: '16px' }"> <div class="mb-4">
<h3 class="post-setting-drawer-title">摘要</h3> <h3 class="post-setting-drawer-title">摘要</h3>
<div class="post-setting-drawer-item"> <div class="post-setting-drawer-item">
<a-form layout="vertical"> <a-form layout="vertical">
<a-form-item>
<a-input
type="textarea"
:autoSize="{ minRows: 5 }"
v-model="selectedSheet.summary"
placeholder="不填写则会自动生成"
/>
</a-form-item>
</a-form>
</div>
</div>
<a-divider />
<div class="mb-4">
<h3 class="post-setting-drawer-title">封面图</h3>
<div class="post-setting-drawer-item">
<div class="sheet-thumb">
<img
class="img"
:src="selectedSheet.thumbnail || '/images/placeholder.jpg'"
@click="thumbDrawerVisible = true"
>
<a-form layout="vertial">
<a-form-item> <a-form-item>
<a-input <a-input
type="textarea" v-model="selectedSheet.thumbnail"
:autoSize="{ minRows: 5 }" placeholder="点击封面图选择图片，或者输入外部链接"
v-model="selectedSheet.summary" ></a-input>
placeholder="不填写则会自动生成"
/>
</a-form-item> </a-form-item>
</a-form> </a-form>
<a-button
class="sheet-thumb-remove"
type="dashed"
@click="selectedSheet.thumbnail = null"
>移除</a-button>
</div> </div>
</div> </div>
<a-divider />
<div :style="{ marginBottom: '16px' }">
<h3 class="post-setting-drawer-title">封面图</h3>
<div class="post-setting-drawer-item">
<div class="sheet-thumb">
<img
class="img"
:src="selectedSheet.thumbnail || '/images/placeholder.jpg'"
@click="thumbDrawerVisible = true"
>
<a-form layout="vertial">
<a-form-item>
<a-input
v-model="selectedSheet.thumbnail"
placeholder="点击封面图选择图片，或者输入外部链接"
></a-input>
</a-form-item>
</a-form>
<a-button
class="sheet-thumb-remove"
type="dashed"
@click="handlerRemoveThumb"
>移除</a-button>
</div>
</div>
</div>
<a-divider class="divider-transparent" />
</div> </div>
</a-skeleton> <a-divider class="divider-transparent" />
</div>
<AttachmentSelectDrawer <AttachmentSelectDrawer
v-model="thumbDrawerVisible" v-model="thumbDrawerVisible"
@listenToSelect="handleSelectSheetThumb" @listenToSelect="handleSelectSheetThumb"
@ -129,11 +126,11 @@
placement="right" placement="right"
closable closable
destroyOnClose destroyOnClose
@close="onAdvancedClose" @close="advancedVisible = false"
:visible="advancedVisible" :visible="advancedVisible"
> >
<div class="post-setting-drawer-content"> <div class="post-setting-drawer-content">
<div :style="{ marginBottom: '16px' }"> <div class="mb-4">
<h3 class="post-setting-drawer-title">SEO 设置</h3> <h3 class="post-setting-drawer-title">SEO 设置</h3>
<div class="post-setting-drawer-item"> <div class="post-setting-drawer-item">
<a-form layout="vertical"> <a-form layout="vertical">
@ -155,7 +152,7 @@
</div> </div>
</div> </div>
<a-divider /> <a-divider />
<div :style="{ marginBottom: '16px' }"> <div class="mb-4">
<h3 class="post-setting-drawer-title">元数据</h3> <h3 class="post-setting-drawer-title">元数据</h3>
<a-form layout="vertical"> <a-form layout="vertical">
<a-form-item <a-form-item
@ -195,13 +192,13 @@
<div class="bottom-control"> <div class="bottom-control">
<a-button <a-button
style="marginRight: 8px" class="mr-2"
type="dashed" type="dashed"
@click="advancedVisible = true" @click="advancedVisible = true"
>高级</a-button> >高级</a-button>
<a-button <a-button
v-if="saveDraftButton" v-if="saveDraftButton"
style="marginRight: 8px" class="mr-2"
@click="handleDraftClick" @click="handleDraftClick"
:loading="draftSaving" :loading="draftSaving"
>保存草稿</a-button> >保存草稿</a-button>
@ -226,7 +223,7 @@ export default {
return { return {
thumbDrawerVisible: false, thumbDrawerVisible: false,
advancedVisible: false, advancedVisible: false,
settingLoading: true, customTplsLoading: false,
selectedSheet: this.sheet, selectedSheet: this.sheet,
customTpls: [], customTpls: [],
saving: false, saving: false,
@ -258,10 +255,6 @@ export default {
default: true default: true
} }
}, },
created() {
this.loadSkeleton()
this.loadCustomTpls()
},
watch: { watch: {
sheet(val) { sheet(val) {
this.selectedSheet = val this.selectedSheet = val
@ -274,8 +267,8 @@ export default {
}, },
visible: function(newValue, oldValue) { visible: function(newValue, oldValue) {
if (newValue) { if (newValue) {
this.loadSkeleton() this.handleListCustomTpls()
this.loadPresetMetasField() this.handleListPresetMetasField()
} }
} }
}, },
@ -293,13 +286,7 @@ export default {
...mapGetters(['options']) ...mapGetters(['options'])
}, },
methods: { methods: {
loadSkeleton() { handleListPresetMetasField() {
this.settingLoading = true
setTimeout(() => {
this.settingLoading = false
}, 500)
},
loadPresetMetasField() {
if (this.metas.length <= 0) { if (this.metas.length <= 0) {
themeApi.getActivatedTheme().then(response => { themeApi.getActivatedTheme().then(response => {
const fields = response.data.data.sheetMetaField const fields = response.data.data.sheetMetaField
@ -314,18 +301,23 @@ export default {
}) })
} }
}, },
loadCustomTpls() { handleListCustomTpls() {
themeApi.customSheetTpls().then(response => { this.customTplsLoading = true
this.customTpls = response.data.data themeApi
}) .customSheetTpls()
.then(response => {
this.customTpls = response.data.data
})
.finally(() => {
setTimeout(() => {
this.customTplsLoading = false
}, 200)
})
}, },
handleSelectSheetThumb(data) { handleSelectSheetThumb(data) {
this.selectedSheet.thumbnail = encodeURI(data.path) this.selectedSheet.thumbnail = encodeURI(data.path)
this.thumbDrawerVisible = false this.thumbDrawerVisible = false
}, },
handlerRemoveThumb() {
this.selectedSheet.thumbnail = null
},
handlePublishClick() { handlePublishClick() {
this.selectedSheet.status = 'PUBLISHED' this.selectedSheet.status = 'PUBLISHED'
this.createOrUpdateSheet() this.createOrUpdateSheet()
@ -364,8 +356,10 @@ export default {
this.$router.push({ name: 'SheetList', query: { activeKey: 'custom' } }) this.$router.push({ name: 'SheetList', query: { activeKey: 'custom' } })
}) })
.finally(() => { .finally(() => {
this.saving = false setTimeout(() => {
this.draftSaving = false this.saving = false
this.draftSaving = false
}, 200)
}) })
} else { } else {
sheetApi sheetApi
@ -384,17 +378,16 @@ export default {
this.selectedSheet = response.data.data this.selectedSheet = response.data.data
}) })
.finally(() => { .finally(() => {
this.saving = false setTimeout(() => {
this.draftSaving = false this.saving = false
this.draftSaving = false
}, 200)
}) })
} }
}, },
onClose() { onClose() {
this.$emit('close', false) this.$emit('close', false)
}, },
onAdvancedClose() {
this.advancedVisible = false
},
onSheetDateChange(value, dateString) { onSheetDateChange(value, dateString) {
this.selectedSheet.createTime = value.valueOf() this.selectedSheet.createTime = value.valueOf()
}, },

79
src/views/sheet/independent/JournalList.vue
View File

@ -45,12 +45,10 @@
<span class="table-page-search-submitButtons"> <span class="table-page-search-submitButtons">
<a-button <a-button
type="primary" type="primary"
class="mr-2"
@click="handleQuery()" @click="handleQuery()"
>查询</a-button> >查询</a-button>
<a-button <a-button @click="resetParam()">重置</a-button>
style="margin-left: 8px;"
@click="resetParam()"
>重置</a-button>
</span> </span>
</a-col> </a-col>
</a-row> </a-row>
@ -64,7 +62,7 @@
>写日志</a-button> >写日志</a-button>
</div> </div>
<a-divider /> <a-divider />
<div style="margin-top:15px"> <div class="mt-4">
<a-empty v-if="!listLoading && journals.length==0" /> <a-empty v-if="!listLoading && journals.length==0" />
<a-list <a-list
v-else v-else
@ -169,7 +167,7 @@
<a-modal <a-modal
v-model="optionFormVisible" v-model="optionFormVisible"
title="页面设置" title="页面设置"
:afterClose="onOptionFormClose" :afterClose="() => optionFormVisible = false"
> >
<template slot="footer"> <template slot="footer">
<a-button <a-button
@ -288,15 +286,15 @@ export default {
} }
}, },
created() { created() {
this.loadJournals() this.hanldeListJournals()
this.loadFormOptions() this.hanldeListOptions()
}, },
computed: { computed: {
...mapGetters(['user']) ...mapGetters(['user'])
}, },
methods: { methods: {
...mapActions(['loadOptions']), ...mapActions(['loadOptions']),
loadJournals() { hanldeListJournals() {
this.listLoading = true this.listLoading = true
this.queryParam.page = this.pagination.page - 1 this.queryParam.page = this.pagination.page - 1
this.queryParam.size = this.pagination.size this.queryParam.size = this.pagination.size
@ -313,7 +311,7 @@ export default {
}, 200) }, 200)
}) })
}, },
loadFormOptions() { hanldeListOptions() {
optionApi.listAll().then(response => { optionApi.listAll().then(response => {
this.options = response.data.data this.options = response.data.data
}) })
@ -333,10 +331,14 @@ export default {
this.visible = true this.visible = true
}, },
handleDelete(id) { handleDelete(id) {
journalApi.delete(id).then(response => { journalApi
this.$message.success('删除成功！') .delete(id)
this.loadJournals() .then(response => {
}) this.$message.success('删除成功！')
})
.finally(() => {
this.hanldeListJournals()
})
}, },
handleShowJournalComments(journal) { handleShowJournalComments(journal) {
this.journal = journal this.journal = journal
@ -354,17 +356,25 @@ export default {
} }
if (this.journal.id) { if (this.journal.id) {
journalApi.update(this.journal.id, this.journal).then(response => { journalApi
this.$message.success('更新成功！') .update(this.journal.id, this.journal)
this.loadJournals() .then(response => {
this.isPublic = true this.$message.success('更新成功！')
}) this.isPublic = true
})
.finally(() => {
this.hanldeListJournals()
})
} else { } else {
journalApi.create(this.journal).then(response => { journalApi
this.$message.success('发表成功！') .create(this.journal)
this.loadJournals() .then(response => {
this.isPublic = true this.$message.success('发表成功！')
}) this.isPublic = true
})
.finally(() => {
this.hanldeListJournals()
})
} }
this.visible = false this.visible = false
}, },
@ -372,7 +382,7 @@ export default {
this.$log.debug(`Current: ${page}, PageSize: ${pageSize}`) this.$log.debug(`Current: ${page}, PageSize: ${pageSize}`)
this.pagination.page = page this.pagination.page = page
this.pagination.size = pageSize this.pagination.size = pageSize
this.loadJournals() this.hanldeListJournals()
}, },
onJournalCommentsClose() { onJournalCommentsClose() {
this.journal = {} this.journal = {}
@ -384,15 +394,16 @@ export default {
this.handlePaginationChange(1, this.pagination.size) this.handlePaginationChange(1, this.pagination.size)
}, },
handleSaveOptions() { handleSaveOptions() {
optionApi.save(this.options).then(response => { optionApi
this.loadFormOptions() .save(this.options)
this.loadOptions() .then(response => {
this.$message.success('保存成功！') this.$message.success('保存成功！')
this.optionFormVisible = false this.optionFormVisible = false
}) })
}, .finally(() => {
onOptionFormClose() { this.hanldeListOptions()
this.optionFormVisible = false this.loadOptions()
})
} }
} }
} }

4
src/views/sheet/independent/LinkList.vue
View File

@ -7,7 +7,7 @@
:md="10" :md="10"
:sm="24" :sm="24"
:xs="24" :xs="24"
:style="{ 'padding-bottom': '12px' }" class="pb-3"
> >
<a-card <a-card
:title="title" :title="title"
@ -105,7 +105,7 @@
:md="14" :md="14"
:sm="24" :sm="24"
:xs="24" :xs="24"
:style="{ 'padding-bottom': '12px' }" class="pb-3"
> >
<a-card <a-card
title="所有友情链接" title="所有友情链接"

366
src/views/sheet/independent/PhotoList.vue
View File

@ -7,7 +7,7 @@
> >
<a-col <a-col
:span="24" :span="24"
style="padding-bottom: 12px;" class="pb-3"
> >
<a-card <a-card
:bordered="false" :bordered="false"
@ -48,21 +48,16 @@
<span class="table-page-search-submitButtons"> <span class="table-page-search-submitButtons">
<a-button <a-button
type="primary" type="primary"
class="mr-2"
@click="handleQuery()" @click="handleQuery()"
>查询</a-button> >查询</a-button>
<a-button <a-button @click="resetParam()">重置</a-button>
style="margin-left: 8px;"
@click="resetParam()"
>重置</a-button>
</span> </span>
</a-col> </a-col>
</a-row> </a-row>
</a-form> </a-form>
</div> </div>
<div <div class="table-operator mb-0">
class="table-operator"
style="margin-bottom: 0;"
>
<a-button <a-button
type="primary" type="primary"
icon="plus" icon="plus"
@ -93,7 +88,7 @@
loading="lazy" loading="lazy"
> >
</div> </div>
<a-card-meta style="padding: 0.8rem;"> <a-card-meta class="p-3">
<ellipsis <ellipsis
:length="isMobile()?12:16" :length="isMobile()?12:16"
tooltip tooltip
@ -128,7 +123,7 @@
<a-modal <a-modal
v-model="optionFormVisible" v-model="optionFormVisible"
title="页面设置" title="页面设置"
:afterClose="onOptionFormClose" :afterClose="() => optionFormVisible = false"
> >
<template slot="footer"> <template slot="footer">
<a-button <a-button
@ -165,137 +160,125 @@
align="middle" align="middle"
> >
<a-col :span="24"> <a-col :span="24">
<a-skeleton <div class="photo-detail-img">
active <img
:loading="drawerLoading" :src="photo.url || '/images/placeholder.jpg'"
:paragraph="{rows: 8}" @click="showThumbDrawer"
> class="w-full"
<div class="photo-detail-img"> >
<img </div>
:src="photo.url || '/images/placeholder.jpg'"
@click="showThumbDrawer"
style="width: 100%;"
>
</div>
</a-skeleton>
</a-col> </a-col>
<a-divider style="margin: 24px 0 12px 0;" /> <a-divider style="margin: 24px 0 12px 0;" />
<a-col :span="24"> <a-col :span="24">
<a-skeleton <a-list itemLayout="horizontal">
active <a-list-item>
:loading="drawerLoading" <a-list-item-meta>
:paragraph="{rows: 8}" <template
> slot="description"
<a-list itemLayout="horizontal"> v-if="editable"
<a-list-item> >
<a-list-item-meta> <a-input v-model="photo.thumbnail" />
<template </template>
slot="description" <template
v-if="editable" slot="description"
> v-else
<a-input v-model="photo.thumbnail" /> >{{ photo.thumbnail }}</template>
</template> <span slot="title">
<template 缩略图地址：
slot="description" </span>
v-else </a-list-item-meta>
>{{ photo.thumbnail }}</template> </a-list-item>
<span slot="title"> <a-list-item>
缩略图地址： <a-list-item-meta>
</span> <template
</a-list-item-meta> slot="description"
</a-list-item> v-if="editable"
<a-list-item> >
<a-list-item-meta> <a-input v-model="photo.name" />
<template </template>
slot="description" <template
v-if="editable" slot="description"
> v-else
<a-input v-model="photo.name" /> >{{ photo.name }}</template>
</template> <span slot="title">
<template 图片名称：
slot="description" </span>
v-else </a-list-item-meta>
>{{ photo.name }}</template> </a-list-item>
<span slot="title"> <a-list-item>
图片名称： <a-list-item-meta>
</span> <template
</a-list-item-meta> slot="description"
</a-list-item> v-if="editable"
<a-list-item> >
<a-list-item-meta> <a-date-picker
<template v-model="photo.takeTime"
slot="description" style="width:100%"
v-if="editable" />
> </template>
<a-date-picker <span
v-model="photo.takeTime" slot="description"
style="width:100%" v-else
/> >{{ photo.takeTime | moment }}</span>
</template> <span slot="title">拍摄日期：</span>
<span </a-list-item-meta>
slot="description" </a-list-item>
v-else <a-list-item>
>{{ photo.takeTime | moment }}</span> <a-list-item-meta>
<span slot="title">拍摄日期：</span> <template
</a-list-item-meta> slot="description"
</a-list-item> v-if="editable"
<a-list-item> >
<a-list-item-meta> <a-input v-model="photo.location" />
<template </template>
slot="description" <span
v-if="editable" slot="description"
> v-else
<a-input v-model="photo.location" /> >{{ photo.location || '无' }}</span>
</template> <span slot="title">拍摄地点：</span>
<span </a-list-item-meta>
slot="description" </a-list-item>
v-else <a-list-item>
>{{ photo.location || '无' }}</span> <a-list-item-meta>
<span slot="title">拍摄地点：</span> <template
</a-list-item-meta> slot="description"
</a-list-item> v-if="editable"
<a-list-item> >
<a-list-item-meta> <a-auto-complete
<template :dataSource="teams"
slot="description" v-model="photo.team"
v-if="editable" allowClear
> style="width:100%"
<a-auto-complete />
:dataSource="teams" </template>
v-model="photo.team" <span
allowClear slot="description"
style="width:100%" v-else
/> >{{ photo.team || '无' }}</span>
</template> <span slot="title">分组：</span>
<span </a-list-item-meta>
slot="description" </a-list-item>
v-else <a-list-item>
>{{ photo.team || '无' }}</span> <a-list-item-meta>
<span slot="title">分组：</span> <template
</a-list-item-meta> slot="description"
</a-list-item> v-if="editable"
<a-list-item> >
<a-list-item-meta> <a-input
<template v-model="photo.description"
slot="description" type="textarea"
v-if="editable" :autoSize="{ minRows: 5 }"
> />
<a-input </template>
v-model="photo.description" <span
type="textarea" slot="description"
:autoSize="{ minRows: 5 }" v-else
/> >{{ photo.description || '无' }}</span>
</template> <span slot="title">描述：</span>
<span </a-list-item-meta>
slot="description" </a-list-item>
v-else </a-list>
>{{ photo.description || '无' }}</span>
<span slot="title">描述：</span>
</a-list-item-meta>
</a-list-item>
</a-list>
</a-skeleton>
</a-col> </a-col>
</a-row> </a-row>
<AttachmentSelectDrawer <AttachmentSelectDrawer
@ -307,13 +290,13 @@
<div class="bottom-control"> <div class="bottom-control">
<a-button <a-button
type="dashed" type="dashed"
style="marginRight: 8px" class="mr-2"
@click="handleEditClick" @click="editable = true"
v-if="!editable" v-if="!editable"
>编辑</a-button> >编辑</a-button>
<a-button <a-button
type="primary" type="primary"
style="marginRight: 8px" class="mr-2"
@click="handleCreateOrUpdate" @click="handleCreateOrUpdate"
v-else v-else
>保存</a-button> >保存</a-button>
@ -341,7 +324,6 @@ export default {
data() { data() {
return { return {
drawerVisible: false, drawerVisible: false,
drawerLoading: false,
listLoading: true, listLoading: true,
thumDrawerVisible: false, thumDrawerVisible: false,
optionFormVisible: false, optionFormVisible: false,
@ -366,24 +348,30 @@ export default {
} }
}, },
created() { created() {
this.loadPhotos() this.hanldeListPhotos()
this.loadTeams() this.hanldeListPhotoTeams()
this.loadFormOptions() this.hanldeListOptions()
}, },
methods: { methods: {
...mapActions(['loadOptions']), ...mapActions(['loadOptions']),
loadPhotos() { hanldeListPhotos() {
this.listLoading = true this.listLoading = true
this.queryParam.page = this.pagination.page - 1 this.queryParam.page = this.pagination.page - 1
this.queryParam.size = this.pagination.size this.queryParam.size = this.pagination.size
this.queryParam.sort = this.pagination.sort this.queryParam.sort = this.pagination.sort
photoApi.query(this.queryParam).then(response => { photoApi
this.photos = response.data.data.content .query(this.queryParam)
this.pagination.total = response.data.data.total .then(response => {
this.listLoading = false this.photos = response.data.data.content
}) this.pagination.total = response.data.data.total
})
.finally(() => {
setTimeout(() => {
this.listLoading = false
}, 200)
})
}, },
loadFormOptions() { hanldeListOptions() {
optionApi.listAll().then(response => { optionApi.listAll().then(response => {
this.options = response.data.data this.options = response.data.data
}) })
@ -391,25 +379,33 @@ export default {
handleQuery() { handleQuery() {
this.handlePaginationChange(1, this.pagination.size) this.handlePaginationChange(1, this.pagination.size)
}, },
loadTeams() { hanldeListPhotoTeams() {
photoApi.listTeams().then(response => { photoApi.listTeams().then(response => {
this.teams = response.data.data this.teams = response.data.data
}) })
}, },
handleCreateOrUpdate() { handleCreateOrUpdate() {
if (this.photo.id) { if (this.photo.id) {
photoApi.update(this.photo.id, this.photo).then(response => { photoApi
this.$message.success('照片更新成功！') .update(this.photo.id, this.photo)
this.loadPhotos() .then(response => {
this.loadTeams() this.$message.success('照片更新成功！')
}) })
.finally(() => {
this.hanldeListPhotos()
this.hanldeListPhotoTeams()
})
} else { } else {
photoApi.create(this.photo).then(response => { photoApi
this.$message.success('照片添加成功！') .create(this.photo)
this.loadPhotos() .then(response => {
this.loadTeams() this.photo = response.data.data
this.photo = response.data.data this.$message.success('照片添加成功！')
}) })
.finally(() => {
this.hanldeListPhotos()
this.hanldeListPhotoTeams()
})
} }
this.editable = false this.editable = false
}, },
@ -421,22 +417,23 @@ export default {
this.$log.debug(`Current: ${page}, PageSize: ${size}`) this.$log.debug(`Current: ${page}, PageSize: ${size}`)
this.pagination.page = page this.pagination.page = page
this.pagination.size = size this.pagination.size = size
this.loadPhotos() this.hanldeListPhotos()
}, },
handleAddClick() { handleAddClick() {
this.editable = true this.editable = true
this.drawerVisible = true this.drawerVisible = true
}, },
handleEditClick() {
this.editable = true
},
handleDeletePhoto() { handleDeletePhoto() {
photoApi.delete(this.photo.id).then(response => { photoApi
this.$message.success('删除成功！') .delete(this.photo.id)
this.onDrawerClose() .then(response => {
this.loadPhotos() this.$message.success('删除成功！')
this.loadTeams() this.onDrawerClose()
}) })
.finally(() => {
this.hanldeListPhotos()
this.hanldeListPhotoTeams()
})
}, },
showThumbDrawer() { showThumbDrawer() {
this.thumDrawerVisible = true this.thumDrawerVisible = true
@ -450,7 +447,7 @@ export default {
this.queryParam.keyword = null this.queryParam.keyword = null
this.queryParam.team = null this.queryParam.team = null
this.handlePaginationChange(1, this.pagination.size) this.handlePaginationChange(1, this.pagination.size)
this.loadTeams() this.hanldeListPhotoTeams()
}, },
onDrawerClose() { onDrawerClose() {
this.drawerVisible = false this.drawerVisible = false
@ -458,15 +455,16 @@ export default {
this.editable = false this.editable = false
}, },
handleSaveOptions() { handleSaveOptions() {
optionApi.save(this.options).then(response => { optionApi
this.loadFormOptions() .save(this.options)
this.loadOptions() .then(response => {
this.$message.success('保存成功！') this.$message.success('保存成功！')
this.optionFormVisible = false this.optionFormVisible = false
}) })
}, .finally(() => {
onOptionFormClose() { this.hanldeListOptions()
this.optionFormVisible = false this.loadOptions()
})
} }
} }
} }

9
src/views/system/About.vue
View File

@ -40,7 +40,7 @@
></a-button> ></a-button>
</a-popover> </a-popover>
<ul style="margin: 0;padding: 0;list-style: none;"> <ul class="m-0 p-0 list-none">
<li>版本：{{ environments.version }}</li> <li>版本：{{ environments.version }}</li>
<li>数据库：{{ environments.database }}</li> <li>数据库：{{ environments.database }}</li>
<li>运行模式：{{ environments.mode }}</li> <li>运行模式：{{ environments.mode }}</li>
@ -50,19 +50,19 @@
<a <a
href="https://github.com/halo-dev" href="https://github.com/halo-dev"
target="_blank" target="_blank"
style="margin-right: 10px;" class="mr-3"
>开源组织 >开源组织
<a-icon type="link" /></a> <a-icon type="link" /></a>
<a <a
href="https://halo.run" href="https://halo.run"
target="_blank" target="_blank"
style="margin-right: 10px;" class="mr-3"
>用户文档 >用户文档
<a-icon type="link" /></a> <a-icon type="link" /></a>
<a <a
href="https://bbs.halo.run" href="https://bbs.halo.run"
target="_blank" target="_blank"
style="margin-right: 10px;" class="mr-3"
>在线社区 >在线社区
<a-icon type="link" /></a> <a-icon type="link" /></a>
</a-card> </a-card>
@ -104,6 +104,7 @@
ok-text="查看更多" ok-text="查看更多"
@cancel="versionContentVisible=false" @cancel="versionContentVisible=false"
@ok="handleOpenVersionUrl" @ok="handleOpenVersionUrl"
:width="620"
> >
<div v-html="versionContent"></div> <div v-html="versionContent"></div>
</a-modal> </a-modal>

8
src/views/system/Installation.vue
View File

@ -4,7 +4,7 @@
type="flex" type="flex"
justify="center" justify="center"
align="middle" align="middle"
style="height: 100vh;" class="h-screen"
> >
<a-col <a-col
:xl="8" :xl="8"
@ -312,10 +312,12 @@ export default {
this.$message.success('安装成功！') this.$message.success('安装成功！')
setTimeout(() => { setTimeout(() => {
this.$router.push({ name: 'Login' }) this.$router.push({ name: 'Login' })
}, 300) }, 200)
}) })
.finally(() => { .finally(() => {
this.installing = false setTimeout(() => {
this.installing = false
}, 200)
}) })
}, },
handleInstall() { handleInstall() {

25
src/views/system/SystemOptions.vue
View File

@ -130,7 +130,7 @@
shape="circle" shape="circle"
:icon="`${advancedOptions?'setting':'thunderbolt'}`" :icon="`${advancedOptions?'setting':'thunderbolt'}`"
size="large" size="large"
@click="handleAdvancedOptions()" @click="advancedOptions = !advancedOptions"
></a-button> ></a-button>
</a-tooltip> </a-tooltip>
</div> </div>
@ -170,14 +170,11 @@ export default {
} }
}, },
created() { created() {
this.loadFormOptions() this.hanldeListOptions()
}, },
methods: { methods: {
...mapActions(['loadUser', 'loadOptions']), ...mapActions(['loadUser', 'loadOptions']),
handleAdvancedOptions() { hanldeListOptions() {
this.advancedOptions = !this.advancedOptions
},
loadFormOptions() {
optionApi.listAll().then(response => { optionApi.listAll().then(response => {
this.options = response.data.data this.options = response.data.data
}) })
@ -186,12 +183,16 @@ export default {
this.options = val this.options = val
}, },
onSaveOptions() { onSaveOptions() {
optionApi.save(this.options).then(response => { optionApi
this.loadFormOptions() .save(this.options)
this.loadOptions() .then(response => {
this.loadUser() this.$message.success('保存成功！')
this.$message.success('保存成功！') })
}) .finally(() => {
this.hanldeListOptions()
this.loadOptions()
this.loadUser()
})
} }
} }
} }

19
src/views/system/ToolList.vue
View File

@ -9,7 +9,7 @@
:md="12" :md="12"
:sm="24" :sm="24"
:xs="24" :xs="24"
:style="{ marginBottom: '12px' }" class="pb-3"
> >
<a-card <a-card
:bordered="false" :bordered="false"
@ -21,7 +21,7 @@
<p style="min-height: 50px;">点击进入开发者选项页面</p> <p style="min-height: 50px;">点击进入开发者选项页面</p>
<a-button <a-button
type="primary" type="primary"
style="float:right" class="float-right"
@click="handleToDeveloperOptions()" @click="handleToDeveloperOptions()"
>进入</a-button> >进入</a-button>
</a-card> </a-card>
@ -55,7 +55,7 @@
:md="12" :md="12"
:sm="24" :sm="24"
:xs="24" :xs="24"
:style="{ marginBottom: '12px' }" class="mb-3"
> >
<a-card <a-card
:bordered="false" :bordered="false"
@ -66,7 +66,7 @@
</div> </div>
<p style="min-height: 50px;">支持备份全站数据和数据导出，支持下载到本地</p> <p style="min-height: 50px;">支持备份全站数据和数据导出，支持下载到本地</p>
<a-dropdown style="float:right"> <a-dropdown class="float-right">
<a-menu slot="overlay"> <a-menu slot="overlay">
<a-menu-item <a-menu-item
key="1" key="1"
@ -81,7 +81,7 @@
数据导出 数据导出
</a-menu-item> </a-menu-item>
</a-menu> </a-menu>
<a-button style="margin-left: 8px"> 备份 <a-button class="ml-2"> 备份
<a-icon type="down" /> <a-icon type="down" />
</a-button> </a-button>
</a-dropdown> </a-dropdown>
@ -93,7 +93,7 @@
:md="12" :md="12"
:sm="24" :sm="24"
:xs="24" :xs="24"
:style="{ marginBottom: '12px' }" class="pb-3"
> >
<a-card <a-card
:bordered="false" :bordered="false"
@ -105,8 +105,8 @@
<p style="min-height: 50px;">支持 Hexo/Jekyll 文章导入并解析元数据</p> <p style="min-height: 50px;">支持 Hexo/Jekyll 文章导入并解析元数据</p>
<a-button <a-button
type="primary" type="primary"
style="float:right" class="float-right"
@click="handleImportMarkdown" @click="markdownUpload = true"
>导入</a-button> >导入</a-button>
</a-card> </a-card>
</a-col> </a-col>
@ -152,9 +152,6 @@ export default {
...mapGetters(['options']) ...mapGetters(['options'])
}, },
methods: { methods: {
handleImportMarkdown() {
this.markdownUpload = true
},
handleChange(info) { handleChange(info) {
const status = info.file.status const status = info.file.status
if (status !== 'uploading') { if (status !== 'uploading') {

39
src/views/system/components/BackupWorkDirDrawer.vue
View File

@ -22,6 +22,7 @@
itemLayout="vertical" itemLayout="vertical"
size="small" size="small"
:dataSource="backups" :dataSource="backups"
:loading="loading"
> >
<a-list-item <a-list-item
slot="renderItem" slot="renderItem"
@ -49,13 +50,6 @@
<p slot="description">{{ backup.updateTime | timeAgo }}/{{ backup.fileSize | fileSizeFormat }}</p> <p slot="description">{{ backup.updateTime | timeAgo }}/{{ backup.fileSize | fileSizeFormat }}</p>
</a-list-item-meta> </a-list-item-meta>
</a-list-item> </a-list-item>
<div
v-if="loading"
class="loading-container"
style="position: absolute;bottom: 40px; width: 100%;text-align: center;"
>
<a-spin />
</div>
</a-list> </a-list>
</a-col> </a-col>
</a-row> </a-row>
@ -64,7 +58,7 @@
<a-button <a-button
type="primary" type="primary"
icon="download" icon="download"
style="marginRight: 8px" class="mr-2"
:loading="backuping" :loading="backuping"
@click="handleBackupClick" @click="handleBackupClick"
>备份</a-button> >备份</a-button>
@ -72,7 +66,7 @@
type="dashed" type="dashed"
icon="reload" icon="reload"
:loading="loading" :loading="loading"
@click="handleBackupRefreshClick" @click="handleListBackups"
>刷新</a-button> >刷新</a-button>
</div> </div>
</a-drawer> </a-drawer>
@ -105,19 +99,23 @@ export default {
watch: { watch: {
visible: function(newValue, oldValue) { visible: function(newValue, oldValue) {
if (newValue) { if (newValue) {
this.listBackups() this.handleListBackups()
} }
} }
}, },
methods: { methods: {
listBackups() { handleListBackups() {
this.loading = true this.loading = true
backupApi backupApi
.listWorkDirBackups() .listWorkDirBackups()
.then(response => { .then(response => {
this.backups = response.data.data this.backups = response.data.data
}) })
.finally(() => (this.loading = false)) .finally(() => {
setTimeout(() => {
this.loading = false
}, 200)
})
}, },
handleBackupClick() { handleBackupClick() {
this.backuping = true this.backuping = true
@ -125,10 +123,12 @@ export default {
.backupWorkDir() .backupWorkDir()
.then(response => { .then(response => {
this.$message.success('备份成功！') this.$message.success('备份成功！')
this.listBackups()
}) })
.finally(() => { .finally(() => {
this.backuping = false setTimeout(() => {
this.backuping = false
}, 200)
this.handleListBackups()
}) })
}, },
handleBackupDeleteClick(filename) { handleBackupDeleteClick(filename) {
@ -137,12 +137,13 @@ export default {
.deleteWorkDirBackup(filename) .deleteWorkDirBackup(filename)
.then(response => { .then(response => {
this.$message.success('删除成功！') this.$message.success('删除成功！')
this.listBackups()
}) })
.finally(() => (this.deleting = false)) .finally(() => {
}, setTimeout(() => {
handleBackupRefreshClick() { this.deleting = false
this.listBackups() }, 200)
this.handleListBackups()
})
}, },
onClose() { onClose() {
this.$emit('close', false) this.$emit('close', false)

39
src/views/system/components/ExportDataDrawer.vue
View File

@ -22,6 +22,7 @@
itemLayout="vertical" itemLayout="vertical"
size="small" size="small"
:dataSource="files" :dataSource="files"
:loading="loading"
> >
<a-list-item <a-list-item
slot="renderItem" slot="renderItem"
@ -49,13 +50,6 @@
<p slot="description">{{ file.updateTime | timeAgo }}/{{ file.fileSize | fileSizeFormat }}</p> <p slot="description">{{ file.updateTime | timeAgo }}/{{ file.fileSize | fileSizeFormat }}</p>
</a-list-item-meta> </a-list-item-meta>
</a-list-item> </a-list-item>
<div
v-if="loading"
class="loading-container"
style="position: absolute;bottom: 40px; width: 100%;text-align: center;"
>
<a-spin />
</div>
</a-list> </a-list>
</a-col> </a-col>
</a-row> </a-row>
@ -64,7 +58,7 @@
<a-button <a-button
type="primary" type="primary"
icon="download" icon="download"
style="marginRight: 8px" class="mr-2"
:loading="backuping" :loading="backuping"
@click="handleExportClick" @click="handleExportClick"
>备份</a-button> >备份</a-button>
@ -72,7 +66,7 @@
type="dashed" type="dashed"
icon="reload" icon="reload"
:loading="loading" :loading="loading"
@click="handleFilesRefreshClick" @click="handleListBackups"
>刷新</a-button> >刷新</a-button>
</div> </div>
</a-drawer> </a-drawer>
@ -105,19 +99,23 @@ export default {
watch: { watch: {
visible: function(newValue, oldValue) { visible: function(newValue, oldValue) {
if (newValue) { if (newValue) {
this.listFiles() this.handleListBackups()
} }
} }
}, },
methods: { methods: {
listFiles() { handleListBackups() {
this.loading = true this.loading = true
backupApi backupApi
.listExportedData() .listExportedData()
.then(response => { .then(response => {
this.files = response.data.data this.files = response.data.data
}) })
.finally(() => (this.loading = false)) .finally(() => {
setTimeout(() => {
this.loading = false
}, 200)
})
}, },
handleExportClick() { handleExportClick() {
this.backuping = true this.backuping = true
@ -125,10 +123,12 @@ export default {
.exportData() .exportData()
.then(response => { .then(response => {
this.$message.success('导出成功！') this.$message.success('导出成功！')
this.listFiles()
}) })
.finally(() => { .finally(() => {
this.backuping = false setTimeout(() => {
this.backuping = false
}, 200)
this.handleListBackups()
}) })
}, },
handleFileDeleteClick(filename) { handleFileDeleteClick(filename) {
@ -137,12 +137,13 @@ export default {
.deleteExportedData(filename) .deleteExportedData(filename)
.then(response => { .then(response => {
this.$message.success('删除成功！') this.$message.success('删除成功！')
this.listFiles()
}) })
.finally(() => (this.deleting = false)) .finally(() => {
}, setTimeout(() => {
handleFilesRefreshClick() { this.deleting = false
this.listFiles() }, 200)
this.handleListBackups()
})
}, },
onClose() { onClose() {
this.$emit('close', false) this.$emit('close', false)

36
src/views/system/developer/tabs/ApplicationConfig.vue
View File

@ -7,16 +7,12 @@
/> />
<a-form layout="vertical"> <a-form layout="vertical">
<a-form-item> <a-form-item>
<a-skeleton <a-spin :spinning="loading">
active
:loading="loading"
:paragraph="{rows: 12}"
>
<codemirror <codemirror
v-model="content" v-model="content"
:options="codemirrorOptions" :options="codemirrorOptions"
></codemirror> ></codemirror>
</a-skeleton> </a-spin>
</a-form-item> </a-form-item>
<a-form-item> <a-form-item>
<a-popconfirm <a-popconfirm
@ -27,7 +23,7 @@
> >
<a-button <a-button
type="primary" type="primary"
style="margin-right: 8px;" class="mr-2"
>保存</a-button> >保存</a-button>
</a-popconfirm> </a-popconfirm>
<a-popconfirm <a-popconfirm
@ -69,16 +65,26 @@ export default {
methods: { methods: {
loadConfig() { loadConfig() {
this.loading = true this.loading = true
adminApi.getApplicationConfig().then(response => { adminApi
this.content = response.data.data .getApplicationConfig()
this.loading = false .then(response => {
}) this.content = response.data.data
})
.finally(() => {
setTimeout(() => {
this.loading = false
}, 200)
})
}, },
handleUpdateConfig() { handleUpdateConfig() {
adminApi.updateApplicationConfig(this.content).then(response => { adminApi
this.$message.success(`配置保存成功！`) .updateApplicationConfig(this.content)
this.loadConfig() .then(response => {
}) this.$message.success(`配置保存成功！`)
})
.finally(() => {
this.loadConfig()
})
}, },
handleRestartApplication() { handleRestartApplication() {
adminApi.restartApplication().then(response => { adminApi.restartApplication().then(response => {

18
src/views/system/developer/tabs/Environment.vue
View File

@ -7,7 +7,7 @@
:md="24" :md="24"
:sm="24" :sm="24"
:xs="24" :xs="24"
:style="{ marginBottom: '12px' }" class="mb-3"
> >
<a-card <a-card
title="服务器" title="服务器"
@ -15,7 +15,7 @@
hoverable hoverable
:bodyStyle="{ padding: 0 }" :bodyStyle="{ padding: 0 }"
> >
<table style="width:100%"> <table class="w-full">
<tbody class="ant-table-tbody"> <tbody class="ant-table-tbody">
<tr> <tr>
<td>系统</td> <td>系统</td>
@ -52,7 +52,7 @@
:md="24" :md="24"
:sm="24" :sm="24"
:xs="24" :xs="24"
:style="{ marginBottom: '12px' }" class="mb-3"
> >
<a-card <a-card
title="使用情况" title="使用情况"
@ -60,10 +60,10 @@
hoverable hoverable
:bodyStyle="{ padding: 0 }" :bodyStyle="{ padding: 0 }"
> >
<table style="width:100%"> <table class="w-full">
<tbody class="ant-table-tbody"> <tbody class="ant-table-tbody">
<tr> <tr>
<td>CPU 数量</td> <td>CPU 核心数</td>
<td>{{ system.cpu.count }} 个</td> <td>{{ system.cpu.count }} 个</td>
</tr> </tr>
<tr> <tr>
@ -97,7 +97,7 @@
:md="24" :md="24"
:sm="24" :sm="24"
:xs="24" :xs="24"
:style="{ marginBottom: '12px' }" class="mb-3"
> >
<a-card <a-card
title="环境" title="环境"
@ -105,7 +105,7 @@
hoverable hoverable
:bodyStyle="{ padding: 0 }" :bodyStyle="{ padding: 0 }"
> >
<table style="width:100%"> <table class="w-full">
<tbody class="ant-table-tbody"> <tbody class="ant-table-tbody">
<tr> <tr>
<td>Java 名称</td> <td>Java 名称</td>
@ -137,7 +137,7 @@
:md="24" :md="24"
:sm="24" :sm="24"
:xs="24" :xs="24"
:style="{ marginBottom: '12px' }" class="mb-3"
> >
<a-card <a-card
title="应用" title="应用"
@ -145,7 +145,7 @@
hoverable hoverable
:bodyStyle="{ padding: 0 }" :bodyStyle="{ padding: 0 }"
> >
<table style="width:100%"> <table class="w-full">
<tbody class="ant-table-tbody"> <tbody class="ant-table-tbody">
<tr> <tr>
<td>端口</td> <td>端口</td>

80
src/views/system/developer/tabs/OptionsList.vue
View File

@ -45,12 +45,10 @@
<span class="table-page-search-submitButtons"> <span class="table-page-search-submitButtons">
<a-button <a-button
type="primary" type="primary"
class="mr-2"
@click="handleQuery()" @click="handleQuery()"
>查询</a-button> >查询</a-button>
<a-button <a-button @click="handleResetParam()">重置</a-button>
style="margin-left: 8px;"
@click="handleResetParam()"
>重置</a-button>
</span> </span>
</a-col> </a-col>
</a-row> </a-row>
@ -63,7 +61,7 @@
@click="formVisible=true" @click="formVisible=true"
>新增</a-button> >新增</a-button>
</div> </div>
<div style="margin-top:15px"> <div class="mt-4">
<a-table <a-table
:rowKey="option => option.id" :rowKey="option => option.id"
:columns="columns" :columns="columns"
@ -244,30 +242,40 @@ export default {
} }
}, },
created() { created() {
this.loadOptionsList() this.hanldeListOptions()
}, },
methods: { methods: {
...mapActions(['loadOptions']), ...mapActions(['loadOptions']),
loadOptionsList() { hanldeListOptions() {
this.loading = true this.loading = true
this.queryParam.page = this.pagination.page - 1 this.queryParam.page = this.pagination.page - 1
this.queryParam.size = this.pagination.size this.queryParam.size = this.pagination.size
this.queryParam.sort = this.pagination.sort this.queryParam.sort = this.pagination.sort
optionApi.query(this.queryParam).then(response => { optionApi
this.options = response.data.data.content .query(this.queryParam)
this.pagination.total = response.data.data.total .then(response => {
this.loading = false this.options = response.data.data.content
}) this.pagination.total = response.data.data.total
})
.finally(() => {
setTimeout(() => {
this.loading = false
}, 200)
})
}, },
handleQuery() { handleQuery() {
this.handlePaginationChange(1, this.pagination.size) this.handlePaginationChange(1, this.pagination.size)
}, },
handleDeleteOption(id) { handleDeleteOption(id) {
optionApi.delete(id).then(response => { optionApi
this.$message.success('删除成功！') .delete(id)
this.loadOptionsList() .then(response => {
this.loadOptions() this.$message.success('删除成功！')
}) })
.finally(() => {
this.hanldeListOptions()
this.loadOptions()
})
}, },
handleEditOption(option) { handleEditOption(option) {
this.optionToStage = option this.optionToStage = option
@ -277,7 +285,7 @@ export default {
this.$log.debug(`Current: ${page}, PageSize: ${pageSize}`) this.$log.debug(`Current: ${page}, PageSize: ${pageSize}`)
this.pagination.page = page this.pagination.page = page
this.pagination.size = pageSize this.pagination.size = pageSize
this.loadOptionsList() this.hanldeListOptions()
}, },
handleResetParam() { handleResetParam() {
this.queryParam.keyword = null this.queryParam.keyword = null
@ -304,22 +312,30 @@ export default {
return return
} }
if (this.optionToStage.id) { if (this.optionToStage.id) {
optionApi.update(this.optionToStage.id, this.optionToStage).then(response => { optionApi
this.$message.success('更新成功！') .update(this.optionToStage.id, this.optionToStage)
this.loadOptionsList() .then(response => {
this.loadOptions() this.$message.success('更新成功！')
this.optionToStage = {} this.optionToStage = {}
this.formVisible = false this.formVisible = false
}) })
.finally(() => {
this.hanldeListOptions()
this.loadOptions()
})
} else { } else {
this.optionToStage.type = this.optionType.CUSTOM.value this.optionToStage.type = this.optionType.CUSTOM.value
optionApi.create(this.optionToStage).then(response => { optionApi
this.$message.success('保存成功！') .create(this.optionToStage)
this.loadOptionsList() .then(response => {
this.loadOptions() this.$message.success('保存成功！')
this.optionToStage = {} this.optionToStage = {}
this.formVisible = false this.formVisible = false
}) })
.finally(() => {
this.hanldeListOptions()
this.loadOptions()
})
} }
} }
} }

38
src/views/system/developer/tabs/RuntimeLogs.vue
View File

@ -1,22 +1,19 @@
<template> <template>
<a-form layout="vertical"> <a-form layout="vertical">
<a-form-item> <a-form-item>
<a-skeleton <a-spin :spinning="loading">
active
:loading="loading"
:paragraph="{rows: 12}"
>
<codemirror <codemirror
v-model="logContent" v-model="logContent"
:options="codemirrorOptions" :options="codemirrorOptions"
></codemirror> ></codemirror>
</a-skeleton> </a-spin>
</a-form-item> </a-form-item>
<a-form-item> <a-form-item>
<a-select <a-select
defaultValue="200" defaultValue="200"
v-model="logLines"
@change="handleLoadLogsLines"
style="margin-right: 8px;width: 100px" style="margin-right: 8px;width: 100px"
@change="handleLinesChange"
> >
<a-select-option value="200">200 行</a-select-option> <a-select-option value="200">200 行</a-select-option>
<a-select-option value="500">500 行</a-select-option> <a-select-option value="500">500 行</a-select-option>
@ -25,8 +22,8 @@
</a-select> </a-select>
<a-button <a-button
type="primary" type="primary"
style="margin-right: 8px;" class="mr-2"
@click="loadLogs()" @click="handleLoadLogsLines()"
>刷新</a-button> >刷新</a-button>
<a-button <a-button
type="dashed" type="dashed"
@ -54,24 +51,30 @@ export default {
line: true line: true
}, },
logContent: '', logContent: '',
loading: true, loading: false,
logLines: 200 logLines: 200
} }
}, },
created() { created() {
this.loadLogs() this.handleLoadLogsLines()
}, },
updated() { updated() {
// 滚动条定位到底部 // 滚动条定位到底部
this.$el.querySelector('.CodeMirror-scroll').scrollTop = this.$el.querySelector('.CodeMirror-scroll').scrollHeight this.$el.querySelector('.CodeMirror-scroll').scrollTop = this.$el.querySelector('.CodeMirror-scroll').scrollHeight
}, },
methods: { methods: {
loadLogs() { handleLoadLogsLines() {
this.loading = true this.loading = true
adminApi.getLogFiles(this.logLines).then(response => { adminApi
this.logContent = response.data.data .getLogFiles(this.logLines)
this.loading = false .then(response => {
}) this.logContent = response.data.data
})
.finally(() => {
setTimeout(() => {
this.loading = false
}, 200)
})
}, },
handleDownloadLogFile() { handleDownloadLogFile() {
const hide = this.$message.loading('下载中...', 0) const hide = this.$message.loading('下载中...', 0)
@ -95,9 +98,6 @@ export default {
.finally(() => { .finally(() => {
hide() hide()
}) })
},
handleLinesChange(value) {
this.logLines = value
} }
} }
} }

110
src/views/system/developer/tabs/StaticStorage.vue
View File

@ -18,14 +18,13 @@
</a-button> </a-button>
<a-button <a-button
icon="sync" icon="sync"
@click="loadStaticList" @click="handleListStatics"
:loading="loading" :loading="loading"
:disabled="loading"
> >
刷新 刷新
</a-button> </a-button>
</div> </div>
<div style="margin-top:15px"> <div class="mt-4">
<a-table <a-table
:rowKey="record => record.id" :rowKey="record => record.id"
:columns="columns" :columns="columns"
@ -91,9 +90,7 @@
<a href="javascript:;">删除</a> <a href="javascript:;">删除</a>
</a-popconfirm> </a-popconfirm>
</a-menu-item> </a-menu-item>
<a-menu-item <a-menu-item key="3">
key="3"
>
<a <a
href="javascript:;" href="javascript:;"
@click="handleShowRenameModal(record)" @click="handleShowRenameModal(record)"
@ -268,7 +265,7 @@ export default {
} }
}, },
created() { created() {
this.loadStaticList() this.handleListStatics()
this.CodeMirror = require('codemirror') this.CodeMirror = require('codemirror')
this.CodeMirror.modeURL = 'codemirror/mode/%N/%N.js' this.CodeMirror.modeURL = 'codemirror/mode/%N/%N.js'
}, },
@ -277,23 +274,33 @@ export default {
sortedStatics() { sortedStatics() {
const data = this.statics.slice(0) const data = this.statics.slice(0)
return data.sort(function(a, b) { return data.sort(function(a, b) {
return b.createTime - a.createTime return a.isFile - b.isFile
}) })
} }
}, },
methods: { methods: {
loadStaticList() { handleListStatics() {
this.loading = true this.loading = true
staticApi.list().then(response => { staticApi
this.statics = response.data.data .list()
this.loading = false .then(response => {
}) this.statics = response.data.data
})
.finally(() => {
setTimeout(() => {
this.loading = false
}, 200)
})
}, },
handleDelete(path) { handleDelete(path) {
staticApi.delete(path).then(response => { staticApi
this.$message.success(`删除成功！`) .delete(path)
this.loadStaticList() .then(response => {
}) this.$message.success(`删除成功！`)
})
.finally(() => {
this.handleListStatics()
})
}, },
handleUpload(file) { handleUpload(file) {
this.selectedFile = file this.selectedFile = file
@ -303,10 +310,9 @@ export default {
this.selectedFile = file this.selectedFile = file
this.createFolderModal = true this.createFolderModal = true
const that = this const that = this
Vue.nextTick() Vue.nextTick().then(() => {
.then(() => { that.$refs.createFoldeInput.focus()
that.$refs.createFoldeInput.focus() })
})
}, },
handleShowRenameModal(file) { handleShowRenameModal(file) {
this.selectedFile = file this.selectedFile = file
@ -314,17 +320,16 @@ export default {
this.renameFile = file.isFile this.renameFile = file.isFile
this.renameModal = true this.renameModal = true
const that = this const that = this
Vue.nextTick() Vue.nextTick().then(() => {
.then(() => { const inputRef = that.$refs.renameModalInput
const inputRef = that.$refs.renameModalInput const tmp = inputRef.value.split('.')
const tmp = inputRef.value.split('.') inputRef.focus()
inputRef.focus() if (tmp.length <= 1) {
if (tmp.length <= 1) { inputRef.$el.setSelectionRange(0, inputRef.value.length)
inputRef.$el.setSelectionRange(0, inputRef.value.length) } else {
} else { inputRef.$el.setSelectionRange(0, inputRef.value.length - tmp.pop().length - 1)
inputRef.$el.setSelectionRange(0, inputRef.value.length - tmp.pop().length - 1) }
} })
})
}, },
handleShowEditModal(file) { handleShowEditModal(file) {
this.selectedFile = file this.selectedFile = file
@ -337,28 +342,35 @@ export default {
this.$message.error(`不支持编辑 "${postfix}" 类型的文件`) this.$message.error(`不支持编辑 "${postfix}" 类型的文件`)
} else { } else {
this.editModal = true this.editModal = true
Vue.nextTick() Vue.nextTick().then(() => {
.then(() => { const editor = this.$refs.editor.editor
const editor = this.$refs.editor.editor editor.setOption('mode', info.mime)
editor.setOption('mode', info.mime) this.CodeMirror.autoLoadMode(editor, info.mode)
this.CodeMirror.autoLoadMode(editor, info.mode) })
})
} }
}) })
}, },
handleCreateFolder() { handleCreateFolder() {
staticApi.createFolder(this.selectedFile.relativePath, this.createFolderName).then(response => { staticApi
this.$message.success(`创建文件夹成功！`) .createFolder(this.selectedFile.relativePath, this.createFolderName)
this.createFolderModal = false .then(response => {
this.loadStaticList() this.$message.success(`创建文件夹成功！`)
}) this.createFolderModal = false
})
.finally(() => {
this.handleListStatics()
})
}, },
handleRename() { handleRename() {
staticApi.rename(this.selectedFile.relativePath, this.renameName).then(response => { staticApi
this.$message.success(`重命名成功！`) .rename(this.selectedFile.relativePath, this.renameName)
this.renameModal = false .then(response => {
this.loadStaticList() this.$message.success(`重命名成功！`)
}) this.renameModal = false
})
.finally(() => {
this.handleListStatics()
})
}, },
handleEditSave() { handleEditSave() {
staticApi.save(this.selectedFile.relativePath, this.$refs.editor.editor.getValue()).then(response => { staticApi.save(this.selectedFile.relativePath, this.$refs.editor.editor.getValue()).then(response => {
@ -377,7 +389,7 @@ export default {
onUploadClose() { onUploadClose() {
this.$refs.upload.handleClearFileList() this.$refs.upload.handleClearFileList()
this.selectedFile = {} this.selectedFile = {}
this.loadStaticList() this.handleListStatics()
}, },
handleEditClose() { handleEditClose() {
this.editModal = false this.editModal = false

2
src/views/system/staticpages/tabs/StaticPagesList.vue
View File

@ -27,7 +27,7 @@
刷新 刷新
</a-button> </a-button>
</div> </div>
<div style="margin-top:15px"> <div class="mt-4">
<a-table <a-table
:rowKey="record => record.id" :rowKey="record => record.id"
:columns="columns" :columns="columns"

2
src/views/user/Login.vue
View File

@ -277,7 +277,7 @@ export default {
.finally(() => { .finally(() => {
setTimeout(() => { setTimeout(() => {
this.landing = false this.landing = false
}, 500) }, 200)
}) })
}, },
loginSuccess() { loginSuccess() {

16
src/views/user/Profile.vue
View File

@ -4,7 +4,7 @@
<a-col <a-col
:lg="10" :lg="10"
:md="24" :md="24"
:style="{ 'padding-bottom': '12px' }" class="pb-3"
> >
<a-card <a-card
:bordered="false" :bordered="false"
@ -63,7 +63,7 @@
<a-col <a-col
:lg="14" :lg="14"
:md="24" :md="24"
:style="{ 'padding-bottom': '12px' }" class="pb-3"
> >
<a-card <a-card
:bodyStyle="{ padding: '0' }" :bodyStyle="{ padding: '0' }"
@ -258,7 +258,7 @@
:help="`MFAKey:${mfaParam.mfaKey}`" :help="`MFAKey:${mfaParam.mfaKey}`"
> >
<template slot="extra"> <template slot="extra">
<span style="color:red">* 建议保存此二维码或 MFAKey，验证设备丢失将无法找回，只能通过重置密码关闭二步验证。</span> <span class="text-red-600">* 建议保存此二维码或 MFAKey，验证设备丢失将无法找回，只能通过重置密码关闭二步验证。</span>
</template> </template>
<img <img
width="100%" width="100%"
@ -332,7 +332,7 @@ export default {
} }
}, },
created() { created() {
this.getStatistics() this.handleLoadStatistics()
}, },
watch: { watch: {
mfaType(value) { mfaType(value) {
@ -346,7 +346,7 @@ export default {
}, },
methods: { methods: {
...mapMutations({ setUser: 'SET_USER' }), ...mapMutations({ setUser: 'SET_USER' }),
getStatistics() { handleLoadStatistics() {
this.statisticsLoading = true this.statisticsLoading = true
statisticsApi statisticsApi
.statisticsWithUser() .statisticsWithUser()
@ -356,8 +356,10 @@ export default {
this.mfaParam.mfaType = this.user.mfaType && this.user.mfaType this.mfaParam.mfaType = this.user.mfaType && this.user.mfaType
}) })
.finally(() => { .finally(() => {
this.statisticsLoading = false setTimeout(() => {
}, 200) this.statisticsLoading = false
}, 200)
})
}, },
handleUpdatePassword() { handleUpdatePassword() {
// Check confirm password // Check confirm password

727
tailwind.config.js Normal file
View File

@ -0,0 +1,727 @@
module.exports = {
purge: [],
target: 'relaxed',
prefix: '',
important: false,
separator: ':',
theme: {
screens: {
sm: '640px',
md: '768px',
lg: '1024px',
xl: '1280px'
},
colors: {
transparent: 'transparent',
current: 'currentColor',
black: '#000',
white: '#fff',
gray: {
100: '#f7fafc',
200: '#edf2f7',
300: '#e2e8f0',
400: '#cbd5e0',
500: '#a0aec0',
600: '#718096',
700: '#4a5568',
800: '#2d3748',
900: '#1a202c'
},
red: {
100: '#fff5f5',
200: '#fed7d7',
300: '#feb2b2',
400: '#fc8181',
500: '#f56565',
600: '#e53e3e',
700: '#c53030',
800: '#9b2c2c',
900: '#742a2a'
},
orange: {
100: '#fffaf0',
200: '#feebc8',
300: '#fbd38d',
400: '#f6ad55',
500: '#ed8936',
600: '#dd6b20',
700: '#c05621',
800: '#9c4221',
900: '#7b341e'
},
yellow: {
100: '#fffff0',
200: '#fefcbf',
300: '#faf089',
400: '#f6e05e',
500: '#ecc94b',
600: '#d69e2e',
700: '#b7791f',
800: '#975a16',
900: '#744210'
},
green: {
100: '#f0fff4',
200: '#c6f6d5',
300: '#9ae6b4',
400: '#68d391',
500: '#48bb78',
600: '#38a169',
700: '#2f855a',
800: '#276749',
900: '#22543d'
},
teal: {
100: '#e6fffa',
200: '#b2f5ea',
300: '#81e6d9',
400: '#4fd1c5',
500: '#38b2ac',
600: '#319795',
700: '#2c7a7b',
800: '#285e61',
900: '#234e52'
},
blue: {
100: '#ebf8ff',
200: '#bee3f8',
300: '#90cdf4',
400: '#63b3ed',
500: '#4299e1',
600: '#3182ce',
700: '#2b6cb0',
800: '#2c5282',
900: '#2a4365'
},
indigo: {
100: '#ebf4ff',
200: '#c3dafe',
300: '#a3bffa',
400: '#7f9cf5',
500: '#667eea',
600: '#5a67d8',
700: '#4c51bf',
800: '#434190',
900: '#3c366b'
},
purple: {
100: '#faf5ff',
200: '#e9d8fd',
300: '#d6bcfa',
400: '#b794f4',
500: '#9f7aea',
600: '#805ad5',
700: '#6b46c1',
800: '#553c9a',
900: '#44337a'
},
pink: {
100: '#fff5f7',
200: '#fed7e2',
300: '#fbb6ce',
400: '#f687b3',
500: '#ed64a6',
600: '#d53f8c',
700: '#b83280',
800: '#97266d',
900: '#702459'
}
},
spacing: {
px: '1px',
'0': '0',
'1': '0.25rem',
'2': '0.5rem',
'3': '0.75rem',
'4': '1rem',
'5': '1.25rem',
'6': '1.5rem',
'8': '2rem',
'10': '2.5rem',
'12': '3rem',
'16': '4rem',
'20': '5rem',
'24': '6rem',
'32': '8rem',
'40': '10rem',
'48': '12rem',
'56': '14rem',
'64': '16rem'
},
backgroundColor: theme => theme('colors'),
backgroundOpacity: theme => theme('opacity'),
backgroundPosition: {
bottom: 'bottom',
center: 'center',
left: 'left',
'left-bottom': 'left bottom',
'left-top': 'left top',
right: 'right',
'right-bottom': 'right bottom',
'right-top': 'right top',
top: 'top'
},
backgroundSize: {
auto: 'auto',
cover: 'cover',
contain: 'contain'
},
borderColor: theme => ({
...theme('colors'),
default: theme('colors.gray.300', 'currentColor')
}),
borderOpacity: theme => theme('opacity'),
borderRadius: {
none: '0',
sm: '0.125rem',
default: '0.25rem',
md: '0.375rem',
lg: '0.5rem',
full: '9999px'
},
borderWidth: {
default: '1px',
'0': '0',
'2': '2px',
'4': '4px',
'8': '8px'
},
boxShadow: {
xs: '0 0 0 1px rgba(0, 0, 0, 0.05)',
sm: '0 1px 2px 0 rgba(0, 0, 0, 0.05)',
default: '0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06)',
md: '0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)',
lg: '0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05)',
xl: '0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04)',
'2xl': '0 25px 50px -12px rgba(0, 0, 0, 0.25)',
inner: 'inset 0 2px 4px 0 rgba(0, 0, 0, 0.06)',
outline: '0 0 0 3px rgba(66, 153, 225, 0.5)',
none: 'none'
},
container: {},
cursor: {
auto: 'auto',
default: 'default',
pointer: 'pointer',
wait: 'wait',
text: 'text',
move: 'move',
'not-allowed': 'not-allowed'
},
divideColor: theme => theme('borderColor'),
divideOpacity: theme => theme('borderOpacity'),
divideWidth: theme => theme('borderWidth'),
fill: {
current: 'currentColor'
},
flex: {
'1': '1 1 0%',
auto: '1 1 auto',
initial: '0 1 auto',
none: 'none'
},
flexGrow: {
'0': '0',
default: '1'
},
flexShrink: {
'0': '0',
default: '1'
},
fontFamily: {
sans: [
'system-ui',
'-apple-system',
'BlinkMacSystemFont',
'"Segoe UI"',
'Roboto',
'"Helvetica Neue"',
'Arial',
'"Noto Sans"',
'sans-serif',
'"Apple Color Emoji"',
'"Segoe UI Emoji"',
'"Segoe UI Symbol"',
'"Noto Color Emoji"'
],
serif: ['Georgia', 'Cambria', '"Times New Roman"', 'Times', 'serif'],
mono: ['Menlo', 'Monaco', 'Consolas', '"Liberation Mono"', '"Courier New"', 'monospace']
},
fontSize: {
xs: '0.75rem',
sm: '0.875rem',
base: '1rem',
lg: '1.125rem',
xl: '1.25rem',
'2xl': '1.5rem',
'3xl': '1.875rem',
'4xl': '2.25rem',
'5xl': '3rem',
'6xl': '4rem'
},
fontWeight: {
hairline: '100',
thin: '200',
light: '300',
normal: '400',
medium: '500',
semibold: '600',
bold: '700',
extrabold: '800',
black: '900'
},
height: theme => ({
auto: 'auto',
...theme('spacing'),
full: '100%',
screen: '100vh'
}),
inset: {
'0': '0',
auto: 'auto'
},
letterSpacing: {
tighter: '-0.05em',
tight: '-0.025em',
normal: '0',
wide: '0.025em',
wider: '0.05em',
widest: '0.1em'
},
lineHeight: {
none: '1',
tight: '1.25',
snug: '1.375',
normal: '1.5',
relaxed: '1.625',
loose: '2',
'3': '.75rem',
'4': '1rem',
'5': '1.25rem',
'6': '1.5rem',
'7': '1.75rem',
'8': '2rem',
'9': '2.25rem',
'10': '2.5rem'
},
listStyleType: {
none: 'none',
disc: 'disc',
decimal: 'decimal'
},
margin: (theme, { negative }) => ({
auto: 'auto',
...theme('spacing'),
...negative(theme('spacing'))
}),
maxHeight: {
full: '100%',
screen: '100vh'
},
maxWidth: (theme, { breakpoints }) => ({
none: 'none',
xs: '20rem',
sm: '24rem',
md: '28rem',
lg: '32rem',
xl: '36rem',
'2xl': '42rem',
'3xl': '48rem',
'4xl': '56rem',
'5xl': '64rem',
'6xl': '72rem',
full: '100%',
...breakpoints(theme('screens'))
}),
minHeight: {
'0': '0',
full: '100%',
screen: '100vh'
},
minWidth: {
'0': '0',
full: '100%'
},
objectPosition: {
bottom: 'bottom',
center: 'center',
left: 'left',
'left-bottom': 'left bottom',
'left-top': 'left top',
right: 'right',
'right-bottom': 'right bottom',
'right-top': 'right top',
top: 'top'
},
opacity: {
'0': '0',
'25': '0.25',
'50': '0.5',
'75': '0.75',
'100': '1'
},
order: {
first: '-9999',
last: '9999',
none: '0',
'1': '1',
'2': '2',
'3': '3',
'4': '4',
'5': '5',
'6': '6',
'7': '7',
'8': '8',
'9': '9',
'10': '10',
'11': '11',
'12': '12'
},
padding: theme => theme('spacing'),
placeholderColor: theme => theme('colors'),
placeholderOpacity: theme => theme('opacity'),
space: (theme, { negative }) => ({
...theme('spacing'),
...negative(theme('spacing'))
}),
stroke: {
current: 'currentColor'
},
strokeWidth: {
'0': '0',
'1': '1',
'2': '2'
},
textColor: theme => theme('colors'),
textOpacity: theme => theme('opacity'),
width: theme => ({
auto: 'auto',
...theme('spacing'),
'1/2': '50%',
'1/3': '33.333333%',
'2/3': '66.666667%',
'1/4': '25%',
'2/4': '50%',
'3/4': '75%',
'1/5': '20%',
'2/5': '40%',
'3/5': '60%',
'4/5': '80%',
'1/6': '16.666667%',
'2/6': '33.333333%',
'3/6': '50%',
'4/6': '66.666667%',
'5/6': '83.333333%',
'1/12': '8.333333%',
'2/12': '16.666667%',
'3/12': '25%',
'4/12': '33.333333%',
'5/12': '41.666667%',
'6/12': '50%',
'7/12': '58.333333%',
'8/12': '66.666667%',
'9/12': '75%',
'10/12': '83.333333%',
'11/12': '91.666667%',
full: '100%',
screen: '100vw'
}),
zIndex: {
auto: 'auto',
'0': '0',
'10': '10',
'20': '20',
'30': '30',
'40': '40',
'50': '50'
},
gap: theme => theme('spacing'),
gridTemplateColumns: {
none: 'none',
'1': 'repeat(1, minmax(0, 1fr))',
'2': 'repeat(2, minmax(0, 1fr))',
'3': 'repeat(3, minmax(0, 1fr))',
'4': 'repeat(4, minmax(0, 1fr))',
'5': 'repeat(5, minmax(0, 1fr))',
'6': 'repeat(6, minmax(0, 1fr))',
'7': 'repeat(7, minmax(0, 1fr))',
'8': 'repeat(8, minmax(0, 1fr))',
'9': 'repeat(9, minmax(0, 1fr))',
'10': 'repeat(10, minmax(0, 1fr))',
'11': 'repeat(11, minmax(0, 1fr))',
'12': 'repeat(12, minmax(0, 1fr))'
},
gridColumn: {
auto: 'auto',
'span-1': 'span 1 / span 1',
'span-2': 'span 2 / span 2',
'span-3': 'span 3 / span 3',
'span-4': 'span 4 / span 4',
'span-5': 'span 5 / span 5',
'span-6': 'span 6 / span 6',
'span-7': 'span 7 / span 7',
'span-8': 'span 8 / span 8',
'span-9': 'span 9 / span 9',
'span-10': 'span 10 / span 10',
'span-11': 'span 11 / span 11',
'span-12': 'span 12 / span 12'
},
gridColumnStart: {
auto: 'auto',
'1': '1',
'2': '2',
'3': '3',
'4': '4',
'5': '5',
'6': '6',
'7': '7',
'8': '8',
'9': '9',
'10': '10',
'11': '11',
'12': '12',
'13': '13'
},
gridColumnEnd: {
auto: 'auto',
'1': '1',
'2': '2',
'3': '3',
'4': '4',
'5': '5',
'6': '6',
'7': '7',
'8': '8',
'9': '9',
'10': '10',
'11': '11',
'12': '12',
'13': '13'
},
gridTemplateRows: {
none: 'none',
'1': 'repeat(1, minmax(0, 1fr))',
'2': 'repeat(2, minmax(0, 1fr))',
'3': 'repeat(3, minmax(0, 1fr))',
'4': 'repeat(4, minmax(0, 1fr))',
'5': 'repeat(5, minmax(0, 1fr))',
'6': 'repeat(6, minmax(0, 1fr))'
},
gridRow: {
auto: 'auto',
'span-1': 'span 1 / span 1',
'span-2': 'span 2 / span 2',
'span-3': 'span 3 / span 3',
'span-4': 'span 4 / span 4',
'span-5': 'span 5 / span 5',
'span-6': 'span 6 / span 6'
},
gridRowStart: {
auto: 'auto',
'1': '1',
'2': '2',
'3': '3',
'4': '4',
'5': '5',
'6': '6',
'7': '7'
},
gridRowEnd: {
auto: 'auto',
'1': '1',
'2': '2',
'3': '3',
'4': '4',
'5': '5',
'6': '6',
'7': '7'
},
transformOrigin: {
center: 'center',
top: 'top',
'top-right': 'top right',
right: 'right',
'bottom-right': 'bottom right',
bottom: 'bottom',
'bottom-left': 'bottom left',
left: 'left',
'top-left': 'top left'
},
scale: {
'0': '0',
'50': '.5',
'75': '.75',
'90': '.9',
'95': '.95',
'100': '1',
'105': '1.05',
'110': '1.1',
'125': '1.25',
'150': '1.5'
},
rotate: {
'-180': '-180deg',
'-90': '-90deg',
'-45': '-45deg',
'0': '0',
'45': '45deg',
'90': '90deg',
'180': '180deg'
},
translate: (theme, { negative }) => ({
...theme('spacing'),
...negative(theme('spacing')),
'-full': '-100%',
'-1/2': '-50%',
'1/2': '50%',
full: '100%'
}),
skew: {
'-12': '-12deg',
'-6': '-6deg',
'-3': '-3deg',
'0': '0',
'3': '3deg',
'6': '6deg',
'12': '12deg'
},
transitionProperty: {
none: 'none',
all: 'all',
default: 'background-color, border-color, color, fill, stroke, opacity, box-shadow, transform',
colors: 'background-color, border-color, color, fill, stroke',
opacity: 'opacity',
shadow: 'box-shadow',
transform: 'transform'
},
transitionTimingFunction: {
linear: 'linear',
in: 'cubic-bezier(0.4, 0, 1, 1)',
out: 'cubic-bezier(0, 0, 0.2, 1)',
'in-out': 'cubic-bezier(0.4, 0, 0.2, 1)'
},
transitionDuration: {
'75': '75ms',
'100': '100ms',
'150': '150ms',
'200': '200ms',
'300': '300ms',
'500': '500ms',
'700': '700ms',
'1000': '1000ms'
},
transitionDelay: {
'75': '75ms',
'100': '100ms',
'150': '150ms',
'200': '200ms',
'300': '300ms',
'500': '500ms',
'700': '700ms',
'1000': '1000ms'
}
},
variants: {
accessibility: ['responsive', 'focus'],
alignContent: ['responsive'],
alignItems: ['responsive'],
alignSelf: ['responsive'],
appearance: ['responsive'],
backgroundAttachment: ['responsive'],
backgroundColor: ['responsive', 'hover', 'focus'],
backgroundOpacity: ['responsive', 'hover', 'focus'],
backgroundPosition: ['responsive'],
backgroundRepeat: ['responsive'],
backgroundSize: ['responsive'],
borderCollapse: ['responsive'],
borderColor: ['responsive', 'hover', 'focus'],
borderOpacity: ['responsive', 'hover', 'focus'],
borderRadius: ['responsive'],
borderStyle: ['responsive'],
borderWidth: ['responsive'],
boxShadow: ['responsive', 'hover', 'focus'],
boxSizing: ['responsive'],
cursor: ['responsive'],
display: ['responsive'],
divideColor: ['responsive'],
divideOpacity: ['responsive'],
divideWidth: ['responsive'],
fill: ['responsive'],
flex: ['responsive'],
flexDirection: ['responsive'],
flexGrow: ['responsive'],
flexShrink: ['responsive'],
flexWrap: ['responsive'],
float: ['responsive'],
clear: ['responsive'],
fontFamily: ['responsive'],
fontSize: ['responsive'],
fontSmoothing: ['responsive'],
fontStyle: ['responsive'],
fontWeight: ['responsive', 'hover', 'focus'],
height: ['responsive'],
inset: ['responsive'],
justifyContent: ['responsive'],
letterSpacing: ['responsive'],
lineHeight: ['responsive'],
listStylePosition: ['responsive'],
listStyleType: ['responsive'],
margin: ['responsive'],
maxHeight: ['responsive'],
maxWidth: ['responsive'],
minHeight: ['responsive'],
minWidth: ['responsive'],
objectFit: ['responsive'],
objectPosition: ['responsive'],
opacity: ['responsive', 'hover', 'focus'],
order: ['responsive'],
outline: ['responsive', 'focus'],
overflow: ['responsive'],
padding: ['responsive'],
placeholderColor: ['responsive', 'focus'],
placeholderOpacity: ['responsive', 'focus'],
pointerEvents: ['responsive'],
position: ['responsive'],
resize: ['responsive'],
space: ['responsive'],
stroke: ['responsive'],
strokeWidth: ['responsive'],
tableLayout: ['responsive'],
textAlign: ['responsive'],
textColor: ['responsive', 'hover', 'focus'],
textOpacity: ['responsive', 'hover', 'focus'],
textDecoration: ['responsive', 'hover', 'focus'],
textTransform: ['responsive'],
userSelect: ['responsive'],
verticalAlign: ['responsive'],
visibility: ['responsive'],
whitespace: ['responsive'],
width: ['responsive'],
wordBreak: ['responsive'],
zIndex: ['responsive'],
gap: ['responsive'],
gridAutoFlow: ['responsive'],
gridTemplateColumns: ['responsive'],
gridColumn: ['responsive'],
gridColumnStart: ['responsive'],
gridColumnEnd: ['responsive'],
gridTemplateRows: ['responsive'],
gridRow: ['responsive'],
gridRowStart: ['responsive'],
gridRowEnd: ['responsive'],
transform: ['responsive'],
transformOrigin: ['responsive'],
scale: ['responsive', 'hover', 'focus'],
rotate: ['responsive', 'hover', 'focus'],
translate: ['responsive', 'hover', 'focus'],
skew: ['responsive', 'hover', 'focus'],
transitionProperty: ['responsive'],
transitionTimingFunction: ['responsive'],
transitionDuration: ['responsive'],
transitionDelay: ['responsive']
},
corePlugins: {},
plugins: []
}