diff --git a/web/package-lock.json b/web/package-lock.json index 7143d427..4aec088b 100644 --- a/web/package-lock.json +++ b/web/package-lock.json @@ -1765,63 +1765,6 @@ "integrity": "sha1-/q7SVZc9LndVW4PbwIhRpsY1IPo=", "dev": true }, - "ansi-styles": { - "version": "4.3.0", - "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz", - "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==", - "dev": true, - "optional": true, - "requires": { - "color-convert": "^2.0.1" - } - }, - "chalk": { - "version": "4.1.2", - "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz", - "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==", - "dev": true, - "optional": 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, - "optional": 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, - "optional": true - }, - "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, - "optional": true - }, - "loader-utils": { - "version": "2.0.0", - "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-2.0.0.tgz", - "integrity": "sha512-rP4F0h2RaWSvPEkD7BLDFQnvSf+nK+wr3ESUjNTyAGobqrijmW92zc+SO6d4p4B1wh7+B/Jg1mkQe5NYUEHtHQ==", - "dev": true, - "optional": true, - "requires": { - "big.js": "^5.2.2", - "emojis-list": "^3.0.0", - "json5": "^2.1.2" - } - }, "ssri": { "version": "8.0.1", "resolved": "https://registry.nlark.com/ssri/download/ssri-8.0.1.tgz", @@ -1830,28 +1773,6 @@ "requires": { "minipass": "^3.1.1" } - }, - "supports-color": { - "version": "7.2.0", - "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz", - "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==", - "dev": true, - "optional": true, - "requires": { - "has-flag": "^4.0.0" - } - }, - "vue-loader-v16": { - "version": "npm:vue-loader@16.5.0", - "resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-16.5.0.tgz", - "integrity": "sha512-WXh+7AgFxGTgb5QAkQtFeUcHNIEq3PGVQ8WskY5ZiFbWBkOwcCPRs4w/2tVyTbh2q6TVRlO3xfvIukUtjsu62A==", - "dev": true, - "optional": true, - "requires": { - "chalk": "^4.1.0", - "hash-sum": "^2.0.0", - "loader-utils": "^2.0.0" - } } } }, @@ -11612,6 +11533,87 @@ } } }, + "vue-loader-v16": { + "version": "npm:vue-loader@16.5.0", + "resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-16.5.0.tgz", + "integrity": "sha512-WXh+7AgFxGTgb5QAkQtFeUcHNIEq3PGVQ8WskY5ZiFbWBkOwcCPRs4w/2tVyTbh2q6TVRlO3xfvIukUtjsu62A==", + "dev": true, + "optional": true, + "requires": { + "chalk": "^4.1.0", + "hash-sum": "^2.0.0", + "loader-utils": "^2.0.0" + }, + "dependencies": { + "ansi-styles": { + "version": "4.3.0", + "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz", + "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==", + "dev": true, + "optional": true, + "requires": { + "color-convert": "^2.0.1" + } + }, + "chalk": { + "version": "4.1.2", + "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz", + "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==", + "dev": true, + "optional": 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, + "optional": 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, + "optional": true + }, + "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, + "optional": true + }, + "loader-utils": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-2.0.0.tgz", + "integrity": "sha512-rP4F0h2RaWSvPEkD7BLDFQnvSf+nK+wr3ESUjNTyAGobqrijmW92zc+SO6d4p4B1wh7+B/Jg1mkQe5NYUEHtHQ==", + "dev": true, + "optional": true, + "requires": { + "big.js": "^5.2.2", + "emojis-list": "^3.0.0", + "json5": "^2.1.2" + } + }, + "supports-color": { + "version": "7.2.0", + "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz", + "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==", + "dev": true, + "optional": true, + "requires": { + "has-flag": "^4.0.0" + } + } + } + }, "vue-particle-line": { "version": "0.1.4", "resolved": "https://registry.npmjs.org/vue-particle-line/-/vue-particle-line-0.1.4.tgz", diff --git a/web/src/assets/login_background.jpg b/web/src/assets/login_background.jpg new file mode 100644 index 00000000..e601f24a Binary files /dev/null and b/web/src/assets/login_background.jpg differ diff --git a/web/src/components/dashbordTable/dashbordTable.vue b/web/src/components/dashbordTable/dashbordTable.vue index 5c17a3c8..13e16174 100644 --- a/web/src/components/dashbordTable/dashbordTable.vue +++ b/web/src/components/dashbordTable/dashbordTable.vue @@ -48,6 +48,7 @@ export default { &-title{ color: rgb(56,137,206); font-size: 18px; + margin-bottom: 20px; } } diff --git a/web/src/style/newLogin.scss b/web/src/style/newLogin.scss index 57bea18a..335231b6 100644 --- a/web/src/style/newLogin.scss +++ b/web/src/style/newLogin.scss @@ -1,100 +1,99 @@ -#userLayout{ - margin: 0; - padding: 0; - // background-image: url("~@/assets/login_background.svg"); - background-size: cover; - width: 100%; - height: 100%; - position: relative; - .login_panle{ - position: absolute; - top: 3vh; - left: 2vw; - width: 96vw; - height: 94vh; - background-color: rgba(255,255,255,.8); - backdrop-filter: blur(5px); - border-radius: 10px; - display: flex; - align-items: center; - justify-content: space-evenly; - .login_panle_right{ - background-image: url("~@/assets/login_left.svg"); - background-size: cover; - width: 40%; - height: 60%; - float: right !important; - } - .login_panle_form{ - width: 420px; - background-color: #fff; - padding: 40px 40px 40px 40px; - border-radius: 10px; - box-shadow: 2px 3px 7px rgba(0,0,0,.2); - .login_panle_form_title{ - +#userLayout { + margin: 0; + padding: 0; + background-image: url("~@/assets/login_background.jpg"); + background-size: cover; + width: 100%; + height: 100%; + position: relative; + .login_panle { + position: absolute; + top: 3vh; + left: 2vw; + width: 96vw; + height: 94vh; + background-color: rgba(255, 255, 255, .8); + backdrop-filter: blur(5px); + border-radius: 10px; display: flex; align-items: center; - margin: 30px 0; - - .login_panle_form_title_logo{ - width: 90px; - height: 72px; + justify-content: space-evenly; + .login_panle_right { + background-image: url("~@/assets/login_left.svg"); + background-size: cover; + width: 40%; + height: 60%; + float: right !important; } - .login_panle_form_title_p{ - font-size: 40px; - - padding-left: 20px ; + .login_panle_form { + width: 420px; + background-color: #fff; + padding: 40px 40px 40px 40px; + border-radius: 10px; + box-shadow: 2px 3px 7px rgba(0, 0, 0, .2); + .login_panle_form_title { + display: flex; + align-items: center; + margin: 30px 0; + .login_panle_form_title_logo { + width: 90px; + height: 72px; + } + .login_panle_form_title_p { + font-size: 40px; + padding-left: 20px; + } + } + .vPic { + width: 33%; + height: 38px; + float: right !important; + background: #ccc; + img { + width: 100%; + height: 100%; + cursor: pointer; + vertical-align: middle; + } + } } - } - .vPic { - width: 33%; - height: 38px; - float: right !important; - background: #ccc; - img { - width: 100%; - height: 100%; - cursor: pointer; - vertical-align: middle; + .login_panle_foot { + position: absolute; + bottom: 20px; + .links { + display: flex; + align-items: center; + justify-content: space-between; + .link-icon { + width: 30px; + height: 30px; + } + } + .copyright { + color: #777777; + margin-top: 5px; + } } - } } - .login_panle_foot{ - position: absolute; - bottom: 20px; - .links{ - display: flex; - align-items: center; - justify-content: space-between; - .link-icon{ - width: 30px; - height: 30px; - } - } - .copyright{ - color: #777777; - margin-top: 5px; - } - } - } } + //小屏幕不显示右侧，将登陆框居中 @media (max-width: 750px) { - .login_panle_right{ - display: none; - } - .login_panle{ - width: 100vw; - height: 100vh; - top: 0; - left: 0; - } - .login_panle_form{ - width: 100%; - } + .login_panle_right { + display: none; + } + .login_panle { + width: 100vw; + height: 100vh; + top: 0; + left: 0; + } + .login_panle_form { + width: 100%; + } } + /* powerBy : bypanghu@163.com */ \ No newline at end of file diff --git a/web/src/view/init/index.vue b/web/src/view/init/index.vue index b1234704..65227ac2 100644 --- a/web/src/view/init/index.vue +++ b/web/src/view/init/index.vue @@ -116,7 +116,7 @@ export default { .init_page{ margin: 0; padding: 0; - background-image: url("~@/assets/login_background.svg"); + background-image: url("~@/assets/login_background.jpg"); background-size: cover; width: 100%; height: 100%;