diff --git a/public/index.html b/public/index.html index 4123528..8e10503 100644 --- a/public/index.html +++ b/public/index.html @@ -1,17 +1,42 @@ - - - - + + + + <%= htmlWebpackPlugin.options.title %> + + + + -
+
+
+
+ + + + + + +
+

<%= VUE_APP_TITLE %>

+
+
diff --git a/public/static/css/loading.css b/public/static/css/loading.css new file mode 100644 index 0000000..a7433cc --- /dev/null +++ b/public/static/css/loading.css @@ -0,0 +1,96 @@ +.first-loading-wrp { + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + height: 90vh; + min-height: 90vh; +} + +.first-loading-wrp > h1 { + font-size: 30px; + font-weight: bolder; +} + +.first-loading-wrp .loading-wrp { + display: flex; + align-items: center; + justify-content: center; + padding: 98px; +} + +.dot { + position: relative; + box-sizing: border-box; + display: inline-block; + width: 64px; + height: 64px; + font-size: 64px; + transform: rotate(45deg); + animation: antRotate 1.2s infinite linear; +} + +.dot i { + position: absolute; + display: block; + width: 28px; + height: 28px; + background-color: #1890ff; + border-radius: 100%; + opacity: 0.3; + transform: scale(0.75); + transform-origin: 50% 50%; + animation: antSpinMove 1s infinite linear alternate; +} + +.dot i:nth-child(1) { + top: 0; + left: 0; +} + +.dot i:nth-child(2) { + top: 0; + right: 0; + -webkit-animation-delay: 0.4s; + animation-delay: 0.4s; +} + +.dot i:nth-child(3) { + right: 0; + bottom: 0; + -webkit-animation-delay: 0.8s; + animation-delay: 0.8s; +} + +.dot i:nth-child(4) { + bottom: 0; + left: 0; + -webkit-animation-delay: 1.2s; + animation-delay: 1.2s; +} + +@keyframes antRotate { + to { + -webkit-transform: rotate(405deg); + transform: rotate(405deg); + } +} + +@-webkit-keyframes antRotate { + to { + -webkit-transform: rotate(405deg); + transform: rotate(405deg); + } +} + +@keyframes antSpinMove { + to { + opacity: 1; + } +} + +@-webkit-keyframes antSpinMove { + to { + opacity: 1; + } +} diff --git a/src/assets/login_images/login_background.png b/src/assets/login_images/login_background.png new file mode 100644 index 0000000..d86f08f Binary files /dev/null and b/src/assets/login_images/login_background.png differ diff --git a/src/assets/login_images/login_form.png b/src/assets/login_images/login_form.png new file mode 100644 index 0000000..faa0569 Binary files /dev/null and b/src/assets/login_images/login_form.png differ diff --git a/src/config/settings.js b/src/config/settings.js index 87b9851..fa37548 100644 --- a/src/config/settings.js +++ b/src/config/settings.js @@ -21,7 +21,7 @@ module.exports = { //是否显示logo，不显示时设置false，显示时请填写remixIcon图标名称，暂时只支持设置remixIcon logo: "vuejs-fill", //标题 （包括初次加载雪花屏的标题 页面的标题 浏览器的标题） - title: "vue-admin-beautiful", + title: "vue-admin-beautiful-antdv", //标题分隔符 titleSeparator: " - ", //标题是否反转 如果为false:"page - title"，如果为ture:"title - page" diff --git a/src/layout/index.vue b/src/layout/index.vue index 01484f0..60c0edb 100644 --- a/src/layout/index.vue +++ b/src/layout/index.vue @@ -6,6 +6,7 @@ @click="handleFoldSideBar" >
-

登录页样式未开发，点击登录即可进入首页

- - - - - - - - - - - - - - 登录 - - - + + + + + + +
+