|
@@ -48,10 +48,11 @@
|
|
top: 140px;
|
|
top: 140px;
|
|
bottom: 0;
|
|
bottom: 0;
|
|
width: 100%;
|
|
width: 100%;
|
|
|
|
+ user-select: none !important;
|
|
}
|
|
}
|
|
|
|
|
|
&-left {
|
|
&-left {
|
|
- .rowSpan(20%);
|
|
|
|
|
|
+ .colSpan(18%);
|
|
margin-left: -1px;
|
|
margin-left: -1px;
|
|
|
|
|
|
.col-order {
|
|
.col-order {
|
|
@@ -94,7 +95,7 @@
|
|
|
|
|
|
|
|
|
|
.period-item {
|
|
.period-item {
|
|
- position:relative;
|
|
|
|
|
|
+ position: relative;
|
|
padding: 10px 10px 10px 30px;
|
|
padding: 10px 10px 10px 30px;
|
|
border-bottom: 1px solid @borderColor;
|
|
border-bottom: 1px solid @borderColor;
|
|
cursor: pointer;
|
|
cursor: pointer;
|
|
@@ -104,12 +105,13 @@
|
|
background-image: -o-linear-gradient(90deg, rgba(30,30,30,0) 0%, rgba(110,110,110,.2) 50%, rgba(110,110,110,.4) 100%);
|
|
background-image: -o-linear-gradient(90deg, rgba(30,30,30,0) 0%, rgba(110,110,110,.2) 50%, rgba(110,110,110,.4) 100%);
|
|
background-image: -moz-linear-gradient(90deg, rgba(30,30,30,0) 0%, rgba(110,110,110,.2) 50%, rgba(110,110,110,.4) 100%);
|
|
background-image: -moz-linear-gradient(90deg, rgba(30,30,30,0) 0%, rgba(110,110,110,.2) 50%, rgba(110,110,110,.4) 100%);
|
|
background-image: linear-gradient(90deg, rgba(30,30,30,0) 0%, rgba(110,110,110,.2) 50%, rgba(110,110,110,.4) 100%);
|
|
background-image: linear-gradient(90deg, rgba(30,30,30,0) 0%, rgba(110,110,110,.2) 50%, rgba(110,110,110,.4) 100%);
|
|
- .period-btn-edit{
|
|
|
|
- display:inline-block;
|
|
|
|
|
|
+
|
|
|
|
+ .period-btn-edit {
|
|
|
|
+ display: inline-block;
|
|
}
|
|
}
|
|
|
|
|
|
- &-tool{
|
|
|
|
- display:unset;
|
|
|
|
|
|
+ .period-item-tool {
|
|
|
|
+ display: unset;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
@@ -127,16 +129,16 @@
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
- &-tool{
|
|
|
|
- position:absolute;
|
|
|
|
- right:30px;
|
|
|
|
- top:40px;
|
|
|
|
- font-size:24px;
|
|
|
|
- color:@primary-textColor;
|
|
|
|
- display:none;
|
|
|
|
|
|
+ &-tool {
|
|
|
|
+ position: absolute;
|
|
|
|
+ right: 30px;
|
|
|
|
+ top: 40px;
|
|
|
|
+ font-size: 24px;
|
|
|
|
+ color: @primary-textColor;
|
|
|
|
+ display: none;
|
|
|
|
|
|
- .ivu-icon{
|
|
|
|
- margin-left:5px;
|
|
|
|
|
|
+ .ivu-icon {
|
|
|
|
+ margin-left: 5px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
@@ -157,19 +159,190 @@
|
|
}
|
|
}
|
|
|
|
|
|
&-center {
|
|
&-center {
|
|
- .rowSpan(28%);
|
|
|
|
|
|
+ .colSpan(30%);
|
|
|
|
+
|
|
|
|
+ .col-body {
|
|
|
|
+ width: 100%;
|
|
|
|
+ height: 100%;
|
|
|
|
+ .fl-row-center;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ .term-list {
|
|
|
|
+ width: 70%;
|
|
|
|
+ height: 100%;
|
|
|
|
+ border-right: 1px solid @borderColor;
|
|
|
|
+
|
|
|
|
+ .term-item {
|
|
|
|
+ width: 100%;
|
|
|
|
+ border-bottom: 1px solid @borderColor;
|
|
|
|
+ padding: 10px 20px;
|
|
|
|
+
|
|
|
|
+ &-name {
|
|
|
|
+ font-size: 24px;
|
|
|
|
+ font-weight: bold;
|
|
|
|
+ color: @primary-textColor;
|
|
|
|
+
|
|
|
|
+ span {
|
|
|
|
+ .lineSpan(18px,3px,red,15px)
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ &-students-num {
|
|
|
|
+ color: @second-textColor;
|
|
|
|
+ font-size: @primary-fontSize;
|
|
|
|
+ margin: 10px;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ &-start {
|
|
|
|
+ color: @second-textColor;
|
|
|
|
+ font-size: @primary-fontSize;
|
|
|
|
+ margin-left: 10px;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ .term-item-time-line {
|
|
|
|
+ position: relative;
|
|
|
|
+ width: 30%;
|
|
|
|
+ height: 100%;
|
|
|
|
+ padding-right: 9%;
|
|
|
|
+ color: @second-textColor;
|
|
|
|
+ .fl-col-center;
|
|
|
|
+
|
|
|
|
+ ul {
|
|
|
|
+ position: relative;
|
|
|
|
+ list-style: none;
|
|
|
|
+ width: 100%;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ li {
|
|
|
|
+ margin: 25px 0;
|
|
|
|
+ font-size: @second-fontSize;
|
|
|
|
+ font-weight: bold;
|
|
|
|
+ justify-content: flex-end;
|
|
|
|
+ .fl-row-center;
|
|
|
|
+
|
|
|
|
+ &:last-child .time-line-tail {
|
|
|
|
+ display: none;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ &:nth-of-type(odd) .time-line-tail {
|
|
|
|
+ border-color: #6d6d6d;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ &:nth-of-type(even) .time-line-tail {
|
|
|
|
+ border-color: #959595;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ &:nth-of-type(odd) .time-dot {
|
|
|
|
+ border-color: #6d6d6d;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ &:nth-of-type(even) .time-dot {
|
|
|
|
+ border-color: #959595;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ .time-dot {
|
|
|
|
+ position: relative;
|
|
|
|
+ width: 25px;
|
|
|
|
+ height: 25px;
|
|
|
|
+ border-radius: 50%;
|
|
|
|
+ padding: 5px;
|
|
|
|
+ border: 3px solid @second-textColor;
|
|
|
|
+ margin-left: 10px;
|
|
|
|
+ z-index: 2;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ .time-inner-dot {
|
|
|
|
+ display: inline-block;
|
|
|
|
+ width: 9px;
|
|
|
|
+ height: 9px;
|
|
|
|
+ background: #08d0c8;
|
|
|
|
+ border-radius: 50%;
|
|
|
|
+ position: absolute;
|
|
|
|
+ top: 5px;
|
|
|
|
+ left: 5px;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ .time-line-tail {
|
|
|
|
+ height: 26px;
|
|
|
|
+ border-left: 3px solid @second-textColor;
|
|
|
|
+ position: absolute;
|
|
|
|
+ top: 22px;
|
|
|
|
+ left: 8px;
|
|
|
|
+ z-index: -1;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
}
|
|
}
|
|
|
|
|
|
&-right {
|
|
&-right {
|
|
- .rowSpan(52%);
|
|
|
|
- }
|
|
|
|
|
|
+ .colSpan(52%);
|
|
|
|
|
|
- .rowSpan(@width) {
|
|
|
|
|
|
+ .grade-body {
|
|
|
|
+ width: 100%;
|
|
|
|
+ display: flex;
|
|
|
|
+ flex-direction: row;
|
|
|
|
+ flex-wrap: wrap;
|
|
|
|
+ padding: 20px;
|
|
|
|
+ border-bottom: 1px solid @borderColor;
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ .grade-item {
|
|
|
|
+ display: inline-block;
|
|
|
|
+ background: #5d5d5d;
|
|
|
|
+ color: #9b9b9b;
|
|
|
|
+ padding: 5px 20px;
|
|
|
|
+ font-size: @second-fontSize;
|
|
|
|
+ font-weight: bold;
|
|
|
|
+ border-radius: 50px;
|
|
|
|
+ margin: 10px;
|
|
|
|
+ cursor: pointer;
|
|
|
|
+
|
|
|
|
+ &:hover {
|
|
|
|
+ .item-active;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ &-icon {
|
|
|
|
+ display: inline-block;
|
|
|
|
+ width: 10px;
|
|
|
|
+ height: 10px;
|
|
|
|
+ background: #404040;
|
|
|
|
+ border-radius: 50%;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ &-name {
|
|
|
|
+ margin: 0 10px;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ .ivu-icon {
|
|
|
|
+ font-size: 24px;
|
|
|
|
+ color: #08ff11;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ .item-active {
|
|
|
|
+ color: #fff;
|
|
|
|
+ background-color: #717171;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ //一行分成几列
|
|
|
|
+ .colSpan(@width) {
|
|
.fl-col-center;
|
|
.fl-col-center;
|
|
width: @width;
|
|
width: @width;
|
|
height: 100%;
|
|
height: 100%;
|
|
border-left: 1px solid @borderColor;
|
|
border-left: 1px solid @borderColor;
|
|
}
|
|
}
|
|
|
|
+ //分隔小横线
|
|
|
|
+ .lineSpan(@height,@width,@color,@mr) {
|
|
|
|
+ display: inline-block;
|
|
|
|
+ height: @height;
|
|
|
|
+ width: @width;
|
|
|
|
+ background: @color;
|
|
|
|
+ margin-right: @mr;
|
|
|
|
+ }
|
|
|
|
|
|
.col-title {
|
|
.col-title {
|
|
.fl-row-center;
|
|
.fl-row-center;
|