首頁 探索 說明
登入
teachcloud
/
teachcloud-print-web
2
0
複刻 0
檔案 問題管理 0 合併請求 0 Wiki
瀏覽代碼

login -f and init home

zhangjie 5 年之前
父節點
d32c85f15d
當前提交
e854a3527e
共有 56 個文件被更改，包括 511 次插入 和 389 次删除
統一視圖 顯示文件統計
  1. 1 1
      public/index.html
  2. 二進制
      src/assets/images/home-back.jpg
  3. 二進制
      src/assets/images/icon-account.png
  4. 二進制
      src/assets/images/icon-analyze.png
  5. 二進制
      src/assets/images/icon-arrow-right-act.png
  6. 二進制
      src/assets/images/icon-arrow-right.png
  7. 二進制
      src/assets/images/icon-base-gray.png
  8. 二進制
      src/assets/images/icon-base.png
  9. 二進制
      src/assets/images/icon-checked.png
  10. 二進制
      src/assets/images/icon-circle-caret-right.png
  11. 二進制
      src/assets/images/icon-circle-lock.png
  12. 二進制
      src/assets/images/icon-circle-right.png
  13. 二進制
      src/assets/images/icon-circle-stop.png
  14. 二進制
      src/assets/images/icon-close.png
  15. 二進制
      src/assets/images/icon-date.png
  16. 二進制
      src/assets/images/icon-delete.png
  17. 二進制
      src/assets/images/icon-doubt.png
  18. 二進制
      src/assets/images/icon-download.png
  19. 二進制
      src/assets/images/icon-edit.png
  20. 二進制
      src/assets/images/icon-error.png
  21. 二進制
      src/assets/images/icon-exam-center-gray.png
  22. 二進制
      src/assets/images/icon-exam-center.png
  23. 二進制
      src/assets/images/icon-files-act.png
  24. 二進制
      src/assets/images/icon-files.png
  25. 二進制
      src/assets/images/icon-great.png
  26. 二進制
      src/assets/images/icon-home.png
  27. 二進制
      src/assets/images/icon-lock.png
  28. 二進制
      src/assets/images/icon-modify.png
  29. 二進制
      src/assets/images/icon-plus-act.png
  30. 二進制
      src/assets/images/icon-plus.png
  31. 二進制
      src/assets/images/icon-radio-checked.png
  32. 二進制
      src/assets/images/icon-radio-uncheck.png
  33. 二進制
      src/assets/images/icon-role.png
  34. 二進制
      src/assets/images/icon-score-paper.png
  35. 二進制
      src/assets/images/icon-search.png
  36. 二進制
      src/assets/images/icon-share-gray.png
  37. 二進制
      src/assets/images/icon-share.png
  38. 二進制
      src/assets/images/icon-shut.png
  39. 二進制
      src/assets/images/icon-uncheck.png
  40. 二進制
      src/assets/images/icon-upload-act.png
  41. 二進制
      src/assets/images/icon-upload.png
  42. 二進制
      src/assets/images/icon-user.png
  43. 二進制
      src/assets/images/login-back.jpg
  44. 二進制
      src/assets/images/tempImg.png
  45. 11 19
      src/assets/styles/base.scss
  46. 73 4
      src/assets/styles/element-ui-costom.scss
  47. 99 115
      src/assets/styles/home.scss
  48. 81 0
      src/assets/styles/icons.scss
  49. 1 0
      src/assets/styles/index.scss
  50. 63 81
      src/assets/styles/login.scss
  51. 15 11
      src/assets/styles/variables.scss
  52. 39 48
      src/constants/navs.js
  53. 1 1
      src/main.js
  54. 73 36
      src/modules/login/views/Login.vue
  55. 0 12
      src/modules/login/views/LoginHome.vue
  56. 54 61
      src/views/Home.vue

+ 1 - 1
public/index.html
查看文件 

@@ -10,7 +10,7 @@
 
   <meta name="apple-mobile-web-app-capable" content="yes" />
 
   <meta name="apple-mobile-web-app-capable" content="yes" />
 
   <meta name="apple-mobile-web-app-status-bar-style" content="black" />
 
   <meta name="apple-mobile-web-app-status-bar-style" content="black" />
 
   <link rel="icon" href="<%= BASE_URL %>favicon.ico" />
 
   <link rel="icon" href="<%= BASE_URL %>favicon.ico" />
 
-  <title>管理后台</title>
 
+  <title>教务处平台</title>
 
 </head>
 
 </head>
 
 
 
 <body>
 
 <body>

二進制
src/assets/images/home-back.jpg
查看文件


二進制
src/assets/images/icon-account.png
查看文件


二進制
src/assets/images/icon-analyze.png
查看文件


二進制
src/assets/images/icon-arrow-right-act.png
查看文件


二進制
src/assets/images/icon-arrow-right.png
查看文件


二進制
src/assets/images/icon-base-gray.png
查看文件


二進制
src/assets/images/icon-base.png
查看文件


二進制
src/assets/images/icon-checked.png
查看文件


二進制
src/assets/images/icon-circle-caret-right.png
查看文件


二進制
src/assets/images/icon-circle-lock.png
查看文件


二進制
src/assets/images/icon-circle-right.png
查看文件


二進制
src/assets/images/icon-circle-stop.png
查看文件


二進制
src/assets/images/icon-close.png
查看文件


二進制
src/assets/images/icon-date.png
查看文件


二進制
src/assets/images/icon-delete.png
查看文件


二進制
src/assets/images/icon-doubt.png
查看文件


二進制
src/assets/images/icon-download.png
查看文件


二進制
src/assets/images/icon-edit.png
查看文件


二進制
src/assets/images/icon-error.png
查看文件


二進制
src/assets/images/icon-exam-center-gray.png
查看文件


二進制
src/assets/images/icon-exam-center.png
查看文件


二進制
src/assets/images/icon-files-act.png
查看文件


二進制
src/assets/images/icon-files.png
查看文件


二進制
src/assets/images/icon-great.png
查看文件


二進制
src/assets/images/icon-home.png
查看文件


二進制
src/assets/images/icon-lock.png
查看文件


二進制
src/assets/images/icon-modify.png
查看文件


二進制
src/assets/images/icon-plus-act.png
查看文件


二進制
src/assets/images/icon-plus.png
查看文件


二進制
src/assets/images/icon-radio-checked.png
查看文件


二進制
src/assets/images/icon-radio-uncheck.png
查看文件


二進制
src/assets/images/icon-role.png
查看文件


二進制
src/assets/images/icon-score-paper.png
查看文件


二進制
src/assets/images/icon-search.png
查看文件


二進制
src/assets/images/icon-share-gray.png
查看文件


二進制
src/assets/images/icon-share.png
查看文件


二進制
src/assets/images/icon-shut.png
查看文件


二進制
src/assets/images/icon-uncheck.png
查看文件


二進制
src/assets/images/icon-upload-act.png
查看文件


二進制
src/assets/images/icon-upload.png
查看文件


二進制
src/assets/images/icon-user.png
查看文件


二進制
src/assets/images/login-back.jpg
查看文件


二進制
src/assets/images/tempImg.png
查看文件


+ 11 - 19
src/assets/styles/base.scss
查看文件 

@@ -18,7 +18,8 @@ td,
 
 span,
 
 span,
 
 a,
 
 a,
 
 header,
 
 header,
 
-footer,i {
 
+footer,
 
+i {
 
   margin: 0;
 
   margin: 0;
 
   padding: 0;
 
   padding: 0;
 
   box-sizing: border-box;
 
   box-sizing: border-box;
 
@@ -35,9 +36,17 @@ u {
 
 input {
 
 input {
 
   outline: none;
 
   outline: none;
 
   border: none;
 
   border: none;
 
-  box-shadow: 100px 100px 100px #fff inset;
 
+  background: rgba(245, 245, 245, 1);
 
   font-family: $--font-family;
 
   font-family: $--font-family;
 
 }
 
 }
 
+input::-webkit-input-placeholder,
 
+input::-moz-placeholder,
 
+input:-ms-input-placeholder,
 
+input:-moz-placeholder {
 
+  font-size: 12px;
 
+  font-weight: bold;
 
+  color: $--color-text-placeholder;
 
+}
 
 button {
 
 button {
 
   font-family: $--font-family;
 
   font-family: $--font-family;
 
 }
 
 }
 
@@ -110,7 +119,6 @@ body {
 
   min-width: 1366px;
 
   min-width: 1366px;
 
 }
 
 }
 
 
 
-
 
 // color
 
 // color
 
 .color-primary {
 
 .color-primary {
 
   color: $--color-primary !important;
 
   color: $--color-primary !important;
 
@@ -127,22 +135,6 @@ body {
 
 .color-info {
 
 .color-info {
 
   color: $--color-info;
 
   color: $--color-info;
 
 }
 
 }
 
-// icon
 
-.icon {
 
-  display: inline-block;
 
-  vertical-align: middle;
 
-  width: 20px;
 
-  height: 20px;
 
-  background-repeat: no-repeat;
 
-  background-size: 100% 100%;
 
-
 
-  // &-help {
 
-  //   background-image: url(../images/icon-help.png);
 
-  //   width: 32px;
 
-  //   height: 32px;
 
-  // }
 
-
 
-}
 
 
 
 // other
 
 // other
 
 .btn--danger {
 
 .btn--danger {

+ 73 - 4
src/assets/styles/element-ui-costom.scss
查看文件 

@@ -63,10 +63,25 @@
 
 }
 
 }
 
 // form
 
 // form
 
 .el-form-item {
 
 .el-form-item {
 
-  margin-bottom: 26px;
 
   .el-form-item__error {
 
   .el-form-item__error {
 
-    font-size: 14px;
 
-    padding-top: 6px;
 
+    font-size: 12px;
 
+    font-weight: bold;
 
+    color: rgba(254, 108, 105, 1);
 
+  }
 
+}
 
+// input
 
+.el-input {
 
+  .el-input__inner {
 
+    border-radius: 7px;
 
+    border-color: #ddd;
 
+    background-color: #f5f5f5;
 
+  }
 
+  .el-input__prefix {
 
+    left: 9px;
 
+    > i {
 
+      height: 12px;
 
+      width: 12px;
 
+    }
 
   }
 
   }
 
 }
 
 }
 
 // upload
 
 // upload
 
@@ -75,11 +90,65 @@
 
   width: 100%;
 
   width: 100%;
 
 }
 
 }
 
 
 
-// other
 
+// button
 
+.el-button {
 
+  border-radius: $--border-radius;
 
+}
 
+.el-button--primary {
 
+  border-color: $--color-primary;
 
+  background-image: linear-gradient(
 
+    -90deg,
 
+    $--color-success 0%,
 
+    $--color-primary 100%
 
+  );
 
+
 
+  &:hover,
 
+  &:focus {
 
+    border-color: $--color-primary;
 
+    background-image: linear-gradient(
 
+      -90deg,
 
+      mix($--color-white, $--color-success, 20%) 0%,
 
+      mix($--color-white, $--color-primary, 20%) 100%
 
+    );
 
+  }
 
+}
 
+.el-button--warning {
 
+  border-color: $--color-warning-lighter;
 
+  background-image: linear-gradient(
 
+    -90deg,
 
+    $--color-warning-lighter 0%,
 
+    $--color-warning 100%
 
+  );
 
+
 
+  &:hover,
 
+  &:focus {
 
+    border-color: $--color-warning-lighter;
 
+    background-image: linear-gradient(
 
+      -90deg,
 
+      mix($--color-white, $--color-warning-lighter, 20%) 0%,
 
+      mix($--color-white, $--color-warning, 20%) 100%
 
+    );
 
+  }
 
+}
 
+.el-button--default {
 
+  color: $--color-text-secondary;
 
+  background: $--color-background;
 
+  border: 1px solid $--color-border;
 
+  &:hover,
 
+  &:focus {
 
+    color: $--color-text-secondary;
 
+    background: $--color-white;
 
+    border: 1px solid $--color-border;
 
+  }
 
+}
 
+
 
 .el-button + .popover-button,
 
 .el-button + .popover-button,
 
 .popover-button + .el-button {
 
 .popover-button + .el-button {
 
   margin-left: 10px;
 
   margin-left: 10px;
 
 }
 
 }
 
+.el-button + .el-button {
 
+  margin-left: 18px;
 
+}
 
 .el-button--text {
 
 .el-button--text {
 
   color: $--color-text-regular;
 
   color: $--color-text-regular;
 
 }
 
 }

+ 99 - 115
src/assets/styles/home.scss
查看文件 

@@ -13,7 +13,7 @@
 
   right: 0;
 
   right: 0;
 
   bottom: 0;
 
   bottom: 0;
 
   overflow: auto;
 
   overflow: auto;
 
-  background: $--color-background;
 
+  background: $--color-white;
 
   z-index: 98;
 
   z-index: 98;
 
 }
 
 }
 
 .home-main {
 
 .home-main {
 
@@ -51,18 +51,48 @@
 
 /* navs */
 
 /* navs */
 
 .home-navs {
 
 .home-navs {
 
   position: absolute;
 
   position: absolute;
 
-  width: 240px;
 
-  top: 60px;
 
+  width: 288px;
 
+  top: 72px;
 
   left: 0;
 
   left: 0;
 
   bottom: 0;
 
   bottom: 0;
 
   z-index: 99;
 
   z-index: 99;
 
   overflow: auto;
 
   overflow: auto;
 
   background: #fff;
 
   background: #fff;
 
-  padding: 15px 0;
 
   text-align: left;
 
   text-align: left;
 
-  transition: width 0.2s ease;
 
-  border-right: 1px solid #e9e9e9;
 
+  background: linear-gradient(
 
+    90deg,
 
+    rgba(247, 247, 247, 1) 0%,
 
+    rgba(238, 238, 238, 1) 100%
 
+  );
 
+
 
+  &::before {
 
+    content: "";
 
+    display: block;
 
+    position: absolute;
 
+    height: 100%;
 
+    width: 1px;
 
+    right: 0;
 
+    bottom: 0;
 
+    z-index: 9;
 
+    background: rgba(229, 229, 229, 1);
 
+  }
 
+
 
+  .nav-top {
 
+    padding: 30px;
 
+    color: $--color-text-secondary;
 
+    font-size: 22px;
 
+    font-weight: bold;
 
+    border-bottom: 1px solid #e9e9e9;
 
+    > i {
 
+      margin-right: 11px;
 
+    }
 
+    > span {
 
+      display: inline-block;
 
+      vertical-align: middle;
 
+    }
 
+  }
 
 }
 
 }
 
+
 
 .nav-item {
 
 .nav-item {
 
   overflow: hidden;
 
   overflow: hidden;
 
 }
 
 }
 
@@ -122,122 +152,77 @@
 
   border-color: $--color-primary;
 
   border-color: $--color-primary;
 
 }
 
 }
 
 
 
-/* tiny */
 
-.home-navs-tiny {
 
-  width: 60px;
 
-  overflow: visible;
 
-}
 
-.home-navs-tiny .nav-item-main {
 
-  padding: 10px;
 
-}
 
-.home-navs-tiny .nav-item-cont,
 
-.home-navs-tiny .nav-item-sublist,
 
-.home-navs-tiny .nav-item-icon-right {
 
-  display: none;
 
-}
 
-.home-navs-tiny .nav-item-icon-left {
 
-  left: 17px;
 
-  font-size: 24px;
 
-}
 
 /* head */
 
 /* head */
 
 .home-header {
 
 .home-header {
 
   position: absolute;
 
   position: absolute;
 
   width: 100%;
 
   width: 100%;
 
-  padding: 10px 0;
 
-  height: 60px;
 
+  height: 72px;
 
   top: 0;
 
   top: 0;
 
   left: 0;
 
   left: 0;
 
   z-index: 100;
 
   z-index: 100;
 
-  background: #fff;
 
-  box-shadow: 0 0 1px 0 $--border-color-light;
 
-  line-height: 40px;
 
-}
 
-.head-logo {
 
-  width: 240px;
 
-  float: left;
 
-  color: $--color-primary;
 
-  height: 60px;
 
-  margin-top: -10px;
 
-  padding: 10px 20px;
 
-  font-size: 20px;
 
-  text-align: center;
 
-  transition: width 0.2s ease;
 
-}
 
-.head-logo img {
 
-  display: block;
 
-  margin: 0 auto;
 
-  width: 160px;
 
-  height: 40px;
 
-}
 
-.head-logo-tiny {
 
-  width: 60px;
 
-  padding: 10px;
 
-  font-size: 18px;
 
-  overflow: hidden;
 
-}
 
-.head-logo-tiny img {
 
-  width: 40px;
 
-  height: 40px;
 
-}
 
-.head-switch {
 
-  float: left;
 
-  padding: 5px 25px 5px 15px;
 
-  height: 40px;
 
-  line-height: 30px;
 
-  cursor: pointer;
 
-}
 
-.head-switch:hover {
 
-  color: $--color-primary;
 
-}
 
-.head-switch i {
 
-  vertical-align: middle;
 
-  font-size: 20px;
 
-}
 
-.rotate-icon {
 
-  transform: rotate(-90deg);
 
-}
 
-.head-info {
 
-  float: left;
 
-  padding: 13px 0;
 
-  height: 40px;
 
-}
 
-.head-user {
 
-  padding-right: 20px;
 
-  float: right;
 
-  height: 40px;
 
-  line-height: 40px;
 
-  position: relative;
 
-  color: $--color-text-regular;
 
-  cursor: pointer;
 
-}
 
-.user-avatar {
 
-  display: inline-block;
 
-  vertical-align: top;
 
-}
 
-.user-name {
 
-  display: inline-block;
 
-  vertical-align: top;
 
-  margin-left: 10px;
 
-  min-width: 60px;
 
-  max-width: 120px;
 
+  color: #fff;
 
+  background-color: $--color-blue;
 
+
 
   overflow: hidden;
 
   overflow: hidden;
 
-  text-overflow: ellipsis;
 
-  white-space: nowrap;
 
-  font-weight: 600;
 
-}
 
-.user-logout {
 
-  display: inline-block;
 
-  vertical-align: top;
 
-  margin-left: 10px;
 
-  font-size: 20px;
 
-  cursor: pointer;
 
-}
 
-.user-logout i {
 
-  vertical-align: middle;
 
-  margin-top: -3px;
 
-}
 
-.user-logout:hover {
 
-  color: $--color-danger;
 
+
 
+  .head-logo {
 
+    width: 288px;
 
+    float: left;
 
+    padding: 16px 20px;
 
+    font-size: 24px;
 
+    padding: 16px 20px;
 
+    line-height: 40px;
 
+  }
 
+  .head-menu {
 
+    float: left;
 
+  }
 
+  .head-user {
 
+    float: right;
 
+    li {
 
+      &:first-child::before {
 
+        display: none;
 
+      }
 
+    }
 
+  }
 
+  .menu-list {
 
+    li {
 
+      display: inline-block;
 
+      vertical-align: top;
 
+      width: 190px;
 
+      padding: 16px 0;
 
+      line-height: 40px;
 
+      opacity: 0.5;
 
+      font-size: 19px;
 
+      position: relative;
 
+      text-align: center;
 
+      cursor: pointer;
 
+
 
+      &:hover {
 
+        opacity: 1;
 
+      }
 
+      &.menu-item-act {
 
+        background-color: $--color-blue-white;
 
+        opacity: 1;
 
+      }
 
+
 
+      &::before {
 
+        content: "";
 
+        display: block;
 
+        position: absolute;
 
+        left: 0;
 
+        top: 50%;
 
+        margin-top: -12px;
 
+        height: 24px;
 
+        border-left: 1px solid rgba(255, 255, 255, 0.1);
 
+      }
 
+
 
+      span {
 
+        display: inline-block;
 
+        vertical-align: middle;
 
+        margin-left: 14px;
 
+      }
 
+    }
 
+  }
 
 }
 
 }
 
 
 
 /* part */
 
 /* part */
 
@@ -336,7 +321,6 @@ h3.account-title {
 
   width: 120px;
 
   width: 120px;
 
 }
 
 }
 
 
 
-
 
 // other
 
 // other
 
 .tips-info {
 
 .tips-info {
 
   font-size: 14px;
 
   font-size: 14px;

+ 81 - 0
src/assets/styles/icons.scss
查看文件 

@@ -0,0 +1,81 @@
 
+// icon
 
+.icon {
 
+  display: inline-block;
 
+  vertical-align: middle;
 
+  width: 20px;
 
+  height: 20px;
 
+  background-repeat: no-repeat;
 
+  background-size: 100% 100%;
 
+
 
+  &-user {
 
+    background-image: url(../images/icon-user.png);
 
+    width: 16px;
 
+    height: 16px;
 
+  }
 
+  &-lock {
 
+    background-image: url(../images/icon-lock.png);
 
+    width: 16px;
 
+    height: 16px;
 
+  }
 
+  &-role {
 
+    background-image: url(../images/icon-role.png);
 
+    width: 16px;
 
+    height: 16px;
 
+  }
 
+  &-error {
 
+    background-image: url(../images/icon-error.png);
 
+    width: 16px;
 
+    height: 16px;
 
+  }
 
+  &-exam-center {
 
+    background-image: url(../images/icon-exam-center.png);
 
+  }
 
+  &-exam-center-gray {
 
+    background-image: url(../images/icon-exam-center-gray.png);
 
+    width: 24px;
 
+    height: 24px;
 
+  }
 
+  &-score-paper {
 
+    background-image: url(../images/icon-score-paper.png);
 
+  }
 
+  &-analyze {
 
+    background-image: url(../images/icon-analyze.png);
 
+  }
 
+  &-base {
 
+    background-image: url(../images/icon-base.png);
 
+  }
 
+  &-base-gray {
 
+    background-image: url(../images/icon-base-gray.png);
 
+    width: 24px;
 
+    height: 24px;
 
+  }
 
+  &-account {
 
+    background-image: url(../images/icon-account.png);
 
+  }
 
+  &-shut {
 
+    background-image: url(../images/icon-shut.png);
 
+  }
 
+  &-home {
 
+    background-image: url(../images/icon-home.png);
 
+  }
 
+  &-arrow-right {
 
+    background-image: url(../images/icon-arrow-right.png);
 
+    width: 10px;
 
+    height: 10px;
 
+  }
 
+  &-arrow-right-act {
 
+    background-image: url(../images/icon-arrow-right-act.png);
 
+    width: 10px;
 
+    height: 10px;
 
+  }
 
+  &-icon-circle-right {
 
+    background-image: url(../images/icon-circle-right.png);
 
+    width: 20px;
 
+    height: 20px;
 
+  }
 
+  &-search {
 
+    background-image: url(../images/icon-search.png);
 
+    width: 16px;
 
+    height: 16px;
 
+  }
 
+}

+ 1 - 0
src/assets/styles/index.scss
查看文件 

@@ -1,5 +1,6 @@
 
 @import "./variables.scss";
 
 @import "./variables.scss";
 
 @import "./base.scss";
 
 @import "./base.scss";
 
+@import "./icons.scss";
 
 @import "./home.scss";
 
 @import "./home.scss";
 
 
 
 @import "./login.scss";
 
 @import "./login.scss";

+ 63 - 81
src/assets/styles/login.scss
查看文件 

@@ -6,103 +6,85 @@
 
   bottom: 0;
 
   bottom: 0;
 
   right: 0;
 
   right: 0;
 
   z-index: 8;
 
   z-index: 8;
 
-  padding: 60px 0;
 
-  background-image: url(../images/home-back.jpg);
 
+  background-image: url(../images/login-back.jpg);
 
   background-repeat: no-repeat;
 
   background-repeat: no-repeat;
 
-  background-position: 0 60px;
 
+  background-size: cover;
 
   overflow: auto;
 
   overflow: auto;
 
-  .view-footer {
 
-    z-index: 99;
 
-    position: fixed;
 
-    background: #fff;
 
-  }
 
-}
 
-
 
-.view-header {
 
-  position: fixed;
 
-  width: 100%;
 
-  padding: 10px 0;
 
-  height: 60px;
 
-  top: 0;
 
-  left: 0;
 
-  z-index: 99;
 
-  background: #fff;
 
-  line-height: 40px;
 
-
 
-  .login-logo {
 
-    width: 500px;
 
-    float: left;
 
-    color: #17233d;
 
-    height: 60px;
 
-    margin-top: -10px;
 
-    padding: 10px 20px;
 
-    cursor: pointer;
 
-
 
-    h1 {
 
-      font-size: 22px;
 
-      line-height: 40px;
 
-      letter-spacing: 2px;
 
-    }
 
-  }
 
 }
 
 }
 
 
 
 .login-box {
 
 .login-box {
 
   position: absolute;
 
   position: absolute;
 
-  width: 400px;
 
+  width: 875px;
 
   top: 50%;
 
   top: 50%;
 
   left: 50%;
 
   left: 50%;
 
   transform: translate(-50%, -50%);
 
   transform: translate(-50%, -50%);
 
-  background-color: #fff;
 
-  box-shadow: 0 0 2px #999;
 
-  border-radius: 10px;
 
+}
 
+.login-shadow-top {
 
+  position: absolute;
 
+  top: 0;
 
+  left: 0;
 
+  width: 100%;
 
+  height: 100%;
 
+  z-index: 8;
 
   overflow: hidden;
 
   overflow: hidden;
 
-
 
-  &.register {
 
-    position: static;
 
-    transform: none;
 
-    margin: 20px auto;
 
+  &::before {
 
+    content: "";
 
+    display: block;
 
+    position: absolute;
 
+    width: 100%;
 
+    height: 200%;
 
+    background: radial-gradient(
 
+      circle,
 
+      rgba(255, 255, 255, 1) 0%,
 
+      rgba(85, 109, 255, 0) 60%
 
+    );
 
+    opacity: 0.6;
 
   }
 
   }
 
 }
 
 }
 
+.login-shadow-bottom {
 
+  position: absolute;
 
+  bottom: -300px;
 
+  left: 0;
 
+  width: 100%;
 
+  height: 300px;
 
+  z-index: 8;
 
+  overflow: hidden;
 
+  &::before {
 
+    content: "";
 
+    display: block;
 
+    position: absolute;
 
+    left: 0;
 
+    bottom: 0;
 
+    width: 100%;
 
+    height: 200%;
 
+    background: radial-gradient(
 
+      circle,
 
+      rgba(6, 44, 255, 1) 0%,
 
+      rgba(85, 109, 255, 0) 60%
 
+    );
 
+    opacity: 0.5;
 
+  }
 
+}
 
+.login-body {
 
+  position: relative;
 
+  z-index: 9;
 
+  width: 390px;
 
+  background-color: #fff;
 
+  box-shadow: 0px 25px 50px 0px rgba(0, 31, 208, 0.3);
 
+  overflow: hidden;
 
+  padding: 50px;
 
+  margin: 0 auto;
 
+}
 
 .login-title {
 
 .login-title {
 
-  height: 50px;
 
-  padding: 14px 15px;
 
-  background: #f6f6f6;
 
-  border-bottom: 1px solid #e6e6e6;
 
+  text-align: center;
 
+  margin-bottom: 26px;
 
   h1 {
 
   h1 {
 
-    line-height: 20px;
 
-    font-size: 18px;
 
+    font-size: 23px;
 
+    font-weight: bold;
 
   }
 
   }
 
 }
 
 }
 
 .login-form {
 
 .login-form {
 
-  padding: 30px 20px 0;
 
-
 
-  .ivu-form-item:last-child {
 
-    margin: 0;
 
-  }
 
-}
 
-
 
-.login-link {
 
-  padding: 10px 0;
 
-  overflow: hidden;
 
-  a {
 
-    color: $--color-text-primary;
 
-    font-size: 15px;
 
-    font-weight: 600;
 
-    margin-right: 18px;
 
-    letter-spacing: 1px;
 
-    text-decoration: none;
 
-    float: left;
 
-    &:last-child {
 
-      float: right;
 
-    }
 
+  .el-form-item:last-child {
 
+    margin-bottom: 0;
 
   }
 
   }
 
-  a:hover {
 
-    color: $--color-primary;
 
-    text-decoration: underline;
 
-  }
 
-}
 
-
 
-/* iview */
 
-.login-box .ivu-form-item {
 
-  margin-bottom: 26px;
 
 }
 
 }

+ 15 - 11
src/assets/styles/variables.scss
查看文件 

@@ -1,25 +1,28 @@
 
 // color ------------------->
 
 // color ------------------->
 
-$--color-text-primary: #303133 !default;
 
-$--color-text-regular: #606266 !default;
 
-$--color-text-secondary: #909399 !default;
 
+$--color-text-primary: #555555 !default;
 
+$--color-text-regular: #888888 !default;
 
+$--color-text-secondary: #bbbbbb !default;
 
 $--color-text-placeholder: #cccccc !default;
 
 $--color-text-placeholder: #cccccc !default;
 
 $--border-color-base: #dcdfe6 !default;
 
 $--border-color-base: #dcdfe6 !default;
 
 $--border-color-light: #e4e7ed !default;
 
 $--border-color-light: #e4e7ed !default;
 
 $--border-color-lighter: #ebeef5 !default;
 
 $--border-color-lighter: #ebeef5 !default;
 
 $--border-color-extra-light: #f2f6fc !default;
 
 $--border-color-extra-light: #f2f6fc !default;
 
 // status
 
 // status
 
-
 
-$--color-primary: #409eff !default;
 
-$--color-success: #67c23a !default;
 
-$--color-warning: #e6a23c !default;
 
-$--color-danger: #f56c6c !default;
 
+$--color-primary: rgba(35, 196, 185, 1) !default;
 
+$--color-success: rgba(28, 208, 161, 1) !default;
 
+$--color-warning: rgba(255, 159, 69, 1) !default;
 
+$--color-warning-lighter: rgba(253, 203, 90, 1) !default;
 
+$--color-danger: rgba(254, 108, 105, 1) !default;
 
 $--color-info: #909399 !default;
 
 $--color-info: #909399 !default;
 
+$--color-blue: #556dff !default;
 
+$--color-blue-white: #667cff !default;
 
+$--color-white: #ffffff;
 
 // skin
 
 // skin
 
-$--color-background: #ededed;
 
+$--color-background: #f5f5f5;
 
 $--color-background-dark: #21252b;
 
 $--color-background-dark: #21252b;
 
 $--color-background-act-dark: #2c313a;
 
 $--color-background-act-dark: #2c313a;
 
-// text
 
-$--color-text-base: #abb2bf;
 
+// border
 
+$--color-border: #e2e2e2;
 
 // shadow
 
 // shadow
 
 $--shadow-light: 0 0 1px rgba(0, 0, 0, 0.15) !default;
 
 $--shadow-light: 0 0 1px rgba(0, 0, 0, 0.15) !default;
 
 
 
@@ -27,6 +30,7 @@ $--shadow-light: 0 0 1px rgba(0, 0, 0, 0.15) !default;
 
 $--font-size-base: 14px !default;
 
 $--font-size-base: 14px !default;
 
 $--font-size-large: 18px !default;
 
 $--font-size-large: 18px !default;
 
 $--font-size-medium: 16px !default;
 
 $--font-size-medium: 16px !default;
 
+$--border-radius: 10px;
 
 
 
 $--font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB",
 
 $--font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB",
 
   "Microsoft YaHei", "微软雅黑", Arial, sans-serif;
 
   "Microsoft YaHei", "微软雅黑", Arial, sans-serif;

+ 39 - 48
src/constants/navs.js
查看文件 

@@ -1,78 +1,69 @@
 
 const navs = [
 
 const navs = [
 
   {
 
   {
 
-    title: "系统管理",
 
-    icon: "el-icon-s-platform",
 
-    showList: true,
 
+    title: "考试中心",
 
+    type: "exam-center",
 
     children: [
 
     children: [
 
       {
 
       {
 
-        title: "通用数据管理模板",
 
+        title: "待办任务",
 
         router: "DataManage"
 
         router: "DataManage"
 
-      }
 
-    ]
 
-  },
 
-  {
 
-    title: "通用组件",
 
-    icon: "el-icon-s-grid",
 
-    showList: true,
 
-    children: [
 
-      {
 
-        title: "文件上传",
 
-        router: "ImportFileInstance"
 
-      },
 
-      {
 
-        title: "图片编辑上传",
 
-        router: "ImageEditUploadInstance"
 
       },
 
       },
 
       {
 
       {
 
-        title: "图片列表上传",
 
-        router: "ImageListUploadInstance"
 
-      },
 
-      {
 
-        title: "富文本编辑器",
 
-        router: "RichEditInstance"
 
+        title: "已办任务",
 
+        router: "DataManage"
 
       },
 
       },
 
       {
 
       {
 
-        title: "echart图表",
 
-        router: "VueEchartsInstance"
 
+        title: "考试管理",
 
+        router: "DataManage"
 
       },
 
       },
 
       {
 
       {
 
-        title: "隔离级联选择",
 
-        router: "CascaderSplitInstance"
 
+        title: "题卡管理",
 
+        router: "DataManage"
 
       },
 
       },
 
       {
 
       {
 
-        title: "图片相册预览",
 
-        router: "ImagePreviewInstance"
 
+        title: "印刷管理",
 
+        router: "DataManage"
 
       },
 
       },
 
       {
 
       {
 
-        title: "多流程控制器",
 
-        router: "StepsProgressInstance"
 
-      },
 
+        title: "题卡审核",
 
+        router: "DataManage"
 
+      }
 
+    ]
 
+  },
 
+  {
 
+    title: "成绩报表",
 
+    type: "score-paper",
 
+    children: [
 
       {
 
       {
 
-        title: "多条件平列筛选",
 
-        router: "LabelFilterInstance"
 
-      },
 
+        title: "通用数据管理模板",
 
+        router: "DataManage"
 
+      }
 
+    ]
 
+  },
 
+  {
 
+    title: "教研分析",
 
+    type: "analyze",
 
+    children: [
 
       {
 
       {
 
-        title: "多维度表格自动生成",
 
-        router: "DimensionTreeTableInstance"
 
+        title: "通用数据管理模板",
 
+        router: "DataManage"
 
       }
 
       }
 
     ]
 
     ]
 
   },
 
   },
 
   {
 
   {
 
-    title: "个人中心",
 
-    icon: "el-icon-s-custom",
 
-    showList: true,
 
+    title: "基础配置",
 
+    type: "base",
 
     children: [
 
     children: [
 
       {
 
       {
 
-        title: "个人设置",
 
-        router: "UserSet"
 
+        title: "用户管理",
 
+        router: "DataManage"
 
       },
 
       },
 
       {
 
       {
 
-        title: "重置密码",
 
-        router: "ResetPswd"
 
+        title: "密码管理",
 
+        router: "DataManage"
 
       },
 
       },
 
       {
 
       {
 
-        title: "绑定手机",
 
-        router: "BindMobile"
 
+        title: "规则管理",
 
+        router: "DataManage"
 
       }
 
       }
 
     ]
 
     ]
 
   }
 
   }

+ 1 - 1
src/main.js
查看文件 

@@ -12,7 +12,7 @@ import VueLocalStorage from "vue-ls";
 
 import ElementUI from "element-ui";
 
 import ElementUI from "element-ui";
 
 import "element-ui/lib/theme-chalk/index.css";
 
 import "element-ui/lib/theme-chalk/index.css";
 
 import "./assets/styles/index.scss";
 
 import "./assets/styles/index.scss";
 
-Vue.use(ElementUI, { size: "large" });
 
+Vue.use(ElementUI);
 
 
 
 Vue.use(VueLocalStorage, { storage: "session" });
 
 Vue.use(VueLocalStorage, { storage: "session" });
 
 Vue.use(globalVuePlugins);
 
 Vue.use(globalVuePlugins);

+ 73 - 36
src/modules/login/views/Login.vue
查看文件 

@@ -1,41 +1,60 @@
 
 <template>
 
 <template>
 
   <div class="login login-box">
 
   <div class="login login-box">
 
-    <div class="login-title">
 
-      <h1>系统登录</h1>
 
-    </div>
 
-    <div class="login-form">
 
-      <el-form ref="loginForm" :model="loginModel" :rules="loginRules">
 
-        <el-form-item prop="username">
 
-          <el-input
 
-            v-model.trim="loginModel.username"
 
-            prefix-icon="el-icon-user"
 
-            placeholder="请输入用户名"
 
-            clearable
 
-          ></el-input>
 
-        </el-form-item>
 
-        <el-form-item prop="password">
 
-          <el-input
 
-            type="password"
 
-            v-model.trim="loginModel.password"
 
-            prefix-icon="el-icon-lock"
 
-            placeholder="请输入密码"
 
-            clearable
 
-          ></el-input>
 
-        </el-form-item>
 
-        <el-form-item>
 
-          <el-button
 
-            style="width:100%;"
 
-            type="primary"
 
-            :disabled="isSubmit"
 
-            @click="submit('loginForm')"
 
-            >登录</el-button
 
-          >
 
-          <div class="login-link">
 
-            <router-link :to="{ name: 'ForgetPwd' }">忘记密码</router-link>
 
-          </div>
 
-        </el-form-item>
 
-      </el-form>
 
+    <div class="login-body">
 
+      <div class="login-title">
 
+        <h1>逸教云</h1>
 
+      </div>
 
+      <div class="login-form">
 
+        <el-form ref="loginForm" :model="loginModel" :rules="loginRules">
 
+          <el-form-item prop="username">
 
+            <el-input
 
+              v-model.trim="loginModel.username"
 
+              placeholder="请输入账号"
 
+              clearable
 
+            >
 
+              <i class="icon icon-user" slot="prefix"></i>
 
+            </el-input>
 
+          </el-form-item>
 
+          <el-form-item prop="password">
 
+            <el-input
 
+              type="password"
 
+              v-model.trim="loginModel.password"
 
+              placeholder="请输入密码"
 
+              clearable
 
+            >
 
+              <i class="icon icon-lock" slot="prefix"></i
 
+            ></el-input>
 
+          </el-form-item>
 
+          <el-form-item prop="roleId">
 
+            <el-select
 
+              style="width:175px;"
 
+              v-model="loginModel.roleId"
 
+              placeholder="请选择角色"
 
+            >
 
+              <i class="icon icon-role" slot="prefix"></i>
 
+              <el-option
 
+                v-for="item in roles"
 
+                :key="item.id"
 
+                :label="item.name"
 
+                :value="item.id"
 
+              >
 
+              </el-option>
 
+            </el-select>
 
+          </el-form-item>
 
+          <el-form-item>
 
+            <el-button
 
+              style="width:116px;"
 
+              type="primary"
 
+              :disabled="isSubmit"
 
+              @click="submit('loginForm')"
 
+              >登录</el-button
 
+            >
 
+          </el-form-item>
 
+        </el-form>
 
+      </div>
 
     </div>
 
     </div>
 
+    <div class="login-shadow-top"></div>
 
+    <div class="login-shadow-bottom"></div>
 
   </div>
 
   </div>
 
 </template>
 
 </template>
 
 
 
@@ -49,7 +68,8 @@ export default {
 
     return {
 
     return {
 
       loginModel: {
 
       loginModel: {
 
         username: "",
 
         username: "",
 
-        password: ""
 
+        password: "",
 
+        roleId: ""
 
       },
 
       },
 
       loginRules: {
 
       loginRules: {
 
         username: [
 
         username: [
 
@@ -59,8 +79,25 @@ export default {
 
             trigger: "change"
 
             trigger: "change"
 
           }
 
           }
 
         ],
 
         ],
 
+        roleId: [
 
+          {
 
+            required: true,
 
+            message: "请选择角色",
 
+            trigger: "change"
 
+          }
 
+        ],
 
         password
 
         password
 
       },
 
       },
 
+      roles: [
 
+        {
 
+          id: "1",
 
+          name: "教师"
 
+        },
 
+        {
 
+          id: "2",
 
+          name: "主任"
 
+        }
 
+      ],
 
       isSubmit: false
 
       isSubmit: false
 
     };
 
     };
 
   },
 
   },

+ 0 - 12
src/modules/login/views/LoginHome.vue
查看文件 

@@ -1,24 +1,12 @@
 
 <template>
 
 <template>
 
   <div class="login-home">
 
   <div class="login-home">
 
-    <div class="view-header">
 
-      <div class="login-logo">
 
-        <h1>学测考试服务平台（后台管理系统）</h1>
 
-      </div>
 
-    </div>
 
     <router-view></router-view>
 
     <router-view></router-view>
 
-
 
-    <view-footer></view-footer>
 
   </div>
 
   </div>
 
 </template>
 
 </template>
 
 
 
 <script>
 
 <script>
 
-import ViewFooter from "@/components/ViewFooter";
 
-
 
 export default {
 
 export default {
 
   name: "login-home",
 
   name: "login-home",
 
-  components: {
 
-    ViewFooter
 
-  },
 
   data() {
 
   data() {
 
     return {};
 
     return {};
 
   },
 
   },

+ 54 - 61
src/views/Home.vue
查看文件 

@@ -1,41 +1,53 @@
 
 <template>
 
 <template>
 
   <div class="home">
 
   <div class="home">
 
     <div class="home-header">
 
     <div class="home-header">
 
-      <div class="head-logo" :class="{ 'head-logo-tiny': isCollapsed }">
 
-        <!-- big logo 160*40 -->
 
-        <h1 v-if="!isCollapsed">LOGO</h1>
 
-        <!-- small logo 40*40 -->
 
-        <h1 v-else>A</h1>
 
+      <div class="head-logo">
 
+        <h1>逸教云</h1>
 
       </div>
 
       </div>
 
-      <div class="head-switch" @click="collapsedSider">
 
-        <i :class="rotateIcon"></i>
 
-      </div>
 
-      <div class="head-info">
 
-        <el-breadcrumb>
 
-          <el-breadcrumb-item :to="{ name: 'Home' }">
 
-            <i class="el-icon-s-home" style="margin-top: -4px;"></i>
 
-          </el-breadcrumb-item>
 
-          <el-breadcrumb-item
 
-            v-for="(bread, index) in breadcrumbs"
 
+      <div class="head-menu menu-list">
 
+        <ul>
 
+          <li
 
+            v-for="(nav, index) in navs"
 
             :key="index"
 
             :key="index"
 
-            >{{ bread.title }}</el-breadcrumb-item
 
+            @click="toPage(index, 0)"
 
+            :class="{ 'menu-item-act': curNav.title === nav.title }"
 
           >
 
           >
 
-        </el-breadcrumb>
 
+            <div class="menu-item">
 
+              <i :class="['icon', `icon-${nav.type}`]"></i>
 
+              <span>{{ nav.title }}</span>
 
+            </div>
 
+          </li>
 
+        </ul>
 
       </div>
 
       </div>
 
-      <div class="head-user">
 
-        <div class="user-avatar">
 
-          <el-avatar icon="el-icon-user-solid"></el-avatar>
 
-        </div>
 
-        <span class="user-name">{{ username || "chulin" }}</span>
 
-        <span class="user-logout" @click="logout">
 
-          <i class="el-icon-switch-button"></i>
 
-        </span>
 
+      <div class="head-user menu-list">
 
+        <ul>
 
+          <li>
 
+            <div class="menu-item">
 
+              <i class="icon icon-account"></i>
 
+              <span>账户设置</span>
 
+            </div>
 
+          </li>
 
+          <li @click="logout">
 
+            <div class="menu-item">
 
+              <i class="icon icon-shut"></i>
 
+              <span>退出登录</span>
 
+            </div>
 
+          </li>
 
+        </ul>
 
       </div>
 
       </div>
 
     </div>
 
     </div>
 
 
 
     <div class="home-navs" :class="{ 'home-navs-tiny': isCollapsed }">
 
     <div class="home-navs" :class="{ 'home-navs-tiny': isCollapsed }">
 
+      <div class="nav-top">
 
+        <i :class="['icon', `icon-${curNav.type}-gray`]"></i>
 
+        <span>{{ curNav.title }}</span>
 
+      </div>
 
       <ul>
 
       <ul>
 
-        <li class="nav-item" v-for="(nav, index) in navs" :key="index">
 
+        <li
 
+          class="nav-item"
 
+          v-for="(nav, index) in curNav.children"
 
+          :key="index"
 
+        >
 
           <div
 
           <div
 
             :class="[
 
             :class="[
 
               'nav-item-main',
 
               'nav-item-main',
 
@@ -58,33 +70,27 @@
 
               ></i>
 
               ></i>
 
             </span>
 
             </span>
 
           </div>
 
           </div>
 
-          <ul
 
-            class="nav-item-sublist"
 
-            :class="{ 'nav-sublist-hide': !nav.showList }"
 
-            v-if="nav.children && nav.children.length"
 
-            :style="{ height: nav.children.length * 40 + 'px' }"
 
-          >
 
-            <li
 
-              v-for="(subnav, sindex) in nav.children"
 
-              :key="sindex"
 
-              :class="[
 
-                'nav-item-sub',
 
-                { 'nav-item-sub-act': curSub === index + '-' + sindex }
 
-              ]"
 
-              @click="toPage(index, sindex)"
 
-            >
 
-              {{ subnav.title }}
 
-            </li>
 
-          </ul>
 
         </li>
 
         </li>
 
       </ul>
 
       </ul>
 
     </div>
 
     </div>
 
 
 
     <div class="home-body" :class="{ 'home-body-big': isCollapsed }">
 
     <div class="home-body" :class="{ 'home-body-big': isCollapsed }">
 
       <div class="home-main">
 
       <div class="home-main">
 
-        <router-view />
 
+        <div class="home-breadcrumb">
 
+          <el-breadcrumb>
 
+            <el-breadcrumb-item :to="{ name: 'Home' }">
 
+              <i class="el-icon-s-home" style="margin-top: -4px;"></i>
 
+            </el-breadcrumb-item>
 
+            <el-breadcrumb-item
 
+              v-for="(bread, index) in breadcrumbs"
 
+              :key="index"
 
+              >{{ bread.title }}</el-breadcrumb-item
 
+            >
 
+          </el-breadcrumb>
 
+        </div>
 
 
 
-        <view-footer></view-footer>
 
+        <!-- page-detail -->
 
+        <router-view />
 
       </div>
 
       </div>
 
     </div>
 
     </div>
 
   </div>
 
   </div>
 
@@ -99,23 +105,12 @@ export default {
 
     return {
 
     return {
 
       isCollapsed: false,
 
       isCollapsed: false,
 
       navs,
 
       navs,
 
+      curNav: navs[0],
 
       curMain: 0,
 
       curMain: 0,
 
       curSub: "",
 
       curSub: "",
 
-      avatar: "",
 
       breadcrumbs: []
 
       breadcrumbs: []
 
     };
 
     };
 
   },
 
   },
 
-  computed: {
 
-    rotateIcon() {
 
-      return [
 
-        "menu-icon",
 
-        this.isCollapsed ? "el-icon-s-unfold" : "el-icon-s-fold"
 
-      ];
 
-    },
 
-    username() {
 
-      return this.$store.state.user.realName;
 
-    }
 
-  },
 
   watch: {
 
   watch: {
 
     $route(val) {
 
     $route(val) {
 
       this.actCurNav();
 
       this.actCurNav();
 
@@ -125,9 +120,6 @@ export default {
 
     this.actCurNav();
 
     this.actCurNav();
 
   },
 
   },
 
   methods: {
 
   methods: {
 
-    collapsedSider() {
 
-      this.isCollapsed = !this.isCollapsed;
 
-    },
 
     switchNav(item, mainIndex) {
 
     switchNav(item, mainIndex) {
 
       if (item.children) {
 
       if (item.children) {
 
         item.showList = !item.showList;
 
         item.showList = !item.showList;
 
@@ -168,6 +160,7 @@ export default {
 
         { title: item.title, router: item.router },
 
         { title: item.title, router: item.router },
 
         { title: elem.title, router: elem.router }
 
         { title: elem.title, router: elem.router }
 
       ];
 
       ];
 
+      this.curNav = this.navs[mainIndex];
 
       this.curMain = mainIndex;
 
       this.curMain = mainIndex;
 
       this.curSub = mainIndex + "-" + subIndex;
 
       this.curSub = mainIndex + "-" + subIndex;