no message
This commit is contained in:
DESKTOP-RQ919RC\Pc
409
css/signIn.css
409
css/signIn.css
@@ -30,6 +30,10 @@ body {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.flexcolumn {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.flex1 {
|
||||
flex: 1;
|
||||
}
|
||||
@@ -43,7 +47,6 @@ body {
|
||||
}
|
||||
.signInBox-mask .signInBox {
|
||||
width: 1060px;
|
||||
height: 658px;
|
||||
background-color: #fff;
|
||||
border-radius: 20px;
|
||||
position: relative;
|
||||
@@ -78,15 +81,21 @@ body {
|
||||
right: 10px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.signInBox-mask .signInBox .signInBox-content {
|
||||
align-items: flex-start;
|
||||
height: 595px;
|
||||
}
|
||||
.signInBox-mask .signInBox .signInBox-content .left-box {
|
||||
width: 538px;
|
||||
padding: 20px 30px;
|
||||
padding: 20px 30px 40px;
|
||||
border-right: 1px dotted #d7d7d7;
|
||||
}
|
||||
.signInBox-mask .signInBox .signInBox-content .left-box .content-header {
|
||||
font-size: 15px;
|
||||
color: #555555;
|
||||
line-height: 40px;
|
||||
margin-bottom: 16px;
|
||||
position: relative;
|
||||
}
|
||||
.signInBox-mask .signInBox .signInBox-content .left-box .content-header .bi-img {
|
||||
width: 25px;
|
||||
@@ -109,4 +118,400 @@ body {
|
||||
}
|
||||
.signInBox-mask .signInBox .signInBox-content .left-box .content-header .bi-rule {
|
||||
margin-left: auto;
|
||||
cursor: pointer;
|
||||
}
|
||||
.signInBox-mask .signInBox .signInBox-content .left-box .content-header .outer-ring {
|
||||
position: absolute;
|
||||
left: calc(100% + 31px);
|
||||
top: -21px;
|
||||
z-index: 1;
|
||||
width: 522px;
|
||||
height: 594px;
|
||||
background-color: #fdda55;
|
||||
padding: 20px;
|
||||
border-radius: 0 0 20px 0;
|
||||
}
|
||||
.signInBox-mask .signInBox .signInBox-content .left-box .content-header .outer-ring .rule-box {
|
||||
background-color: #fff;
|
||||
-moz-box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.07058824);
|
||||
-webkit-box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.07058824);
|
||||
box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.07058824);
|
||||
border-radius: 20px;
|
||||
height: 100%;
|
||||
flex-direction: column;
|
||||
padding-bottom: 62px;
|
||||
}
|
||||
.signInBox-mask .signInBox .signInBox-content .left-box .content-header .outer-ring .rule-box .rule-header {
|
||||
font-weight: 650;
|
||||
font-size: 24px;
|
||||
color: #ab8705;
|
||||
text-align: center;
|
||||
font-family: "PingFangSC-Semibold", "PingFang SC Semibold", "PingFang SC", sans-serif;
|
||||
padding-top: 37px;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
margin-bottom: 14px;
|
||||
}
|
||||
.signInBox-mask .signInBox .signInBox-content .left-box .content-header .outer-ring .rule-box .rule-header::after {
|
||||
content: "";
|
||||
display: block;
|
||||
position: absolute;
|
||||
bottom: -4px;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
width: 120px;
|
||||
height: 22px;
|
||||
background-color: #fdeeb7;
|
||||
border-radius: 219px;
|
||||
z-index: -1;
|
||||
}
|
||||
.signInBox-mask .signInBox .signInBox-content .left-box .content-header .outer-ring .rule-box .rule-list {
|
||||
flex-direction: column;
|
||||
margin: 0 23px;
|
||||
}
|
||||
.signInBox-mask .signInBox .signInBox-content .left-box .content-header .outer-ring .rule-box .rule-list .rule-item .rule-item-icon {
|
||||
width: 52px;
|
||||
height: 52px;
|
||||
background-color: #f6f6f6;
|
||||
border: 1px solid #ebebeb;
|
||||
border-radius: 20px;
|
||||
-moz-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.11764706);
|
||||
-webkit-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.11764706);
|
||||
box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.11764706);
|
||||
margin-right: 30px;
|
||||
}
|
||||
.signInBox-mask .signInBox .signInBox-content .left-box .content-header .outer-ring .rule-box .rule-list .rule-item .rule-item-img {
|
||||
width: 30px;
|
||||
height: 36px;
|
||||
}
|
||||
.signInBox-mask .signInBox .signInBox-content .left-box .content-header .outer-ring .rule-box .rule-list .rule-item .rule-item-text {
|
||||
color: #333;
|
||||
line-height: 28px;
|
||||
font-size: 16px;
|
||||
padding: 40px 0;
|
||||
}
|
||||
.signInBox-mask .signInBox .signInBox-content .left-box .content-header .outer-ring .rule-box .rule-list .rule-item:not(:last-of-type) .rule-item-text {
|
||||
border-bottom: 1px dotted #ebebeb;
|
||||
}
|
||||
.signInBox-mask .signInBox .signInBox-content .left-box .content-header .outer-ring .rule-box .rule-close {
|
||||
font-family: "PingFangSC-Regular", "PingFang SC", sans-serif;
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
font-size: 15px;
|
||||
color: #555555;
|
||||
text-decoration: underline;
|
||||
margin: 0 auto;
|
||||
line-height: normal;
|
||||
width: max-content;
|
||||
cursor: pointer;
|
||||
}
|
||||
.signInBox-mask .signInBox .signInBox-content .left-box .calendar-box {
|
||||
width: 477px;
|
||||
height: 479px;
|
||||
background-color: #fbfbfb;
|
||||
border-radius: 12px;
|
||||
flex-direction: column;
|
||||
padding: 38px 23px 0;
|
||||
}
|
||||
.signInBox-mask .signInBox .signInBox-content .left-box .calendar-box .sign-in-text {
|
||||
color: #555555;
|
||||
line-height: 28px;
|
||||
font-size: 14px;
|
||||
font-family: "PingFangSC-Regular", "PingFang SC", sans-serif;
|
||||
margin-bottom: 21px;
|
||||
}
|
||||
.signInBox-mask .signInBox .signInBox-content .left-box .calendar-box .sign-in-text .sign-in-value {
|
||||
font-family: "PingFangSC-Semibold", "PingFang SC Semibold", "PingFang SC", sans-serif;
|
||||
font-weight: 650;
|
||||
color: #000000;
|
||||
margin: 0 5px;
|
||||
}
|
||||
.signInBox-mask .signInBox .signInBox-content .left-box .calendar-box .calendar {
|
||||
margin: 0 0 14px;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.signInBox-mask .signInBox .signInBox-content .left-box .calendar-box .calendar .calendar-item {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
border-radius: 50%;
|
||||
margin-bottom: 10px;
|
||||
font-size: 17px;
|
||||
color: #aaaaaa;
|
||||
position: relative;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.signInBox-mask .signInBox .signInBox-content .left-box .calendar-box .calendar .calendar-item:not(:nth-child(7n)) {
|
||||
margin-right: 25px;
|
||||
}
|
||||
.signInBox-mask .signInBox .signInBox-content .left-box .calendar-box .calendar .calendar-item.formerly {
|
||||
background-color: #f6f6f6;
|
||||
}
|
||||
.signInBox-mask .signInBox .signInBox-content .left-box .calendar-box .calendar .calendar-item.already {
|
||||
background-color: #fdeeb7;
|
||||
color: #deae07;
|
||||
border: none;
|
||||
}
|
||||
.signInBox-mask .signInBox .signInBox-content .left-box .calendar-box .calendar .calendar-item.already .yellow-tick {
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: -2px;
|
||||
right: -2px;
|
||||
}
|
||||
.signInBox-mask .signInBox .signInBox-content .left-box .calendar-box .calendar .calendar-item .yellow-tick {
|
||||
display: none;
|
||||
}
|
||||
.signInBox-mask .signInBox .signInBox-content .left-box .calendar-box .calendar .calendar-item.today {
|
||||
border: 1px solid #deae07;
|
||||
color: #deae07;
|
||||
}
|
||||
.signInBox-mask .signInBox .signInBox-content .left-box .calendar-box .sign-in-btn {
|
||||
height: 48px;
|
||||
border-radius: 219px;
|
||||
background-color: #f7c308;
|
||||
color: #fff;
|
||||
font-size: 20px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.signInBox-mask .signInBox .signInBox-content .sign-in-box {
|
||||
margin: 0 15px;
|
||||
border-radius: 20px;
|
||||
font-family: "PingFangSC-Regular", "PingFang SC", sans-serif;
|
||||
font-weight: 400;
|
||||
color: #555555;
|
||||
font-size: 15px;
|
||||
flex-direction: column;
|
||||
height: inherit;
|
||||
overflow: auto;
|
||||
}
|
||||
.signInBox-mask .signInBox .signInBox-content .sign-in-box .sign-in-header {
|
||||
padding: 24px 30px 9px;
|
||||
font-size: 14px;
|
||||
line-height: 28px;
|
||||
}
|
||||
.signInBox-mask .signInBox .signInBox-content .sign-in-box .sign-in-header .sign-in-header-value {
|
||||
font-weight: 650;
|
||||
color: #000000;
|
||||
margin: 0 5px;
|
||||
border-bottom: 1px dotted #ebebeb;
|
||||
}
|
||||
.signInBox-mask .signInBox .signInBox-content .sign-in-box .sign-in-list .sign-in-item {
|
||||
padding: 11px 0 0 30px;
|
||||
}
|
||||
.signInBox-mask .signInBox .signInBox-content .sign-in-box .sign-in-list .sign-in-item:not(:last-of-type) .sign-in-info {
|
||||
border-bottom: 1px dotted #ebebeb;
|
||||
}
|
||||
.signInBox-mask .signInBox .signInBox-content .sign-in-box .sign-in-list .sign-in-item .sign-in-index {
|
||||
color: #aaaaaa;
|
||||
font-size: 15px;
|
||||
width: 40px;
|
||||
}
|
||||
.signInBox-mask .signInBox .signInBox-content .sign-in-box .sign-in-list .sign-in-item .sign-in-avatar {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
border-radius: 50%;
|
||||
margin-right: 10px;
|
||||
}
|
||||
.signInBox-mask .signInBox .signInBox-content .sign-in-box .sign-in-list .sign-in-item .sign-in-info {
|
||||
padding-bottom: 9px;
|
||||
}
|
||||
.signInBox-mask .signInBox .signInBox-content .sign-in-box .sign-in-list .sign-in-item .sign-in-info:not(:last-of-type) {
|
||||
border-bottom: 1px dotted #ebebeb;
|
||||
}
|
||||
.signInBox-mask .signInBox .signInBox-content .sign-in-box .sign-in-list .sign-in-item .sign-in-info .sign-in-info-left {
|
||||
flex-direction: column;
|
||||
}
|
||||
.signInBox-mask .signInBox .signInBox-content .sign-in-box .sign-in-list .sign-in-item .sign-in-info .sign-in-name {
|
||||
color: #555555;
|
||||
font-size: 14px;
|
||||
margin-bottom: 3px;
|
||||
}
|
||||
.signInBox-mask .signInBox .signInBox-content .sign-in-box .sign-in-list .sign-in-item .sign-in-info .sign-in-name .sign-in-my {
|
||||
margin-left: 10px;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
background-color: #f0f2f5;
|
||||
border: 1px solid #d7d7d7;
|
||||
border-radius: 5px;
|
||||
font-size: 12px;
|
||||
color: #7f7f7f;
|
||||
}
|
||||
.signInBox-mask .signInBox .signInBox-content .sign-in-box .sign-in-list .sign-in-item .sign-in-info .sign-in-time {
|
||||
color: #aaaaaa;
|
||||
font-size: 13px;
|
||||
}
|
||||
.signInBox-mask .signInBox .signInBox-content .sign-in-box .sign-in-list .sign-in-item .sign-in-value {
|
||||
border-radius: 50%;
|
||||
margin-right: 20px;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
background-color: #fdeeb7;
|
||||
font-family: PingFangSC-Regular, "PingFang SC", sans-serif;
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
font-size: 16px;
|
||||
color: #deae07;
|
||||
}
|
||||
.signInBox-mask .signInBox .signInBox-content .sign-in-box .sign-in-finish {
|
||||
font-size: 13px;
|
||||
color: #d7d7d7;
|
||||
padding-top: 10px;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
.signInBox-mask .signInBox .signInBox-content .sign-in-box .sign-in-more {
|
||||
color: #333333;
|
||||
font-size: 14px;
|
||||
padding-top: 10px;
|
||||
padding-bottom: 10px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.signInBox-mask .signInBox .signInBox-content .sign-in-box .sign-in-more .sign-in-more-icon {
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
margin-left: 6px;
|
||||
}
|
||||
.signInBox-mask .signInBox .signInBox-content .sign-in-box .discuss-list-no {
|
||||
flex-direction: column;
|
||||
}
|
||||
.signInBox-mask .signInBox .signInBox-content .sign-in-box .discuss-list-no .empty-icon {
|
||||
width: 101px;
|
||||
height: 120px;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
.signInBox-mask .signInBox .signInBox-content .sign-in-box .discuss-list-no .discuss-list-no-text {
|
||||
font-size: 12px;
|
||||
color: #555555;
|
||||
line-height: 22px;
|
||||
}
|
||||
.signInBox-mask .succeed-mask {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
}
|
||||
.signInBox-mask .succeed-mask .succeed-box {
|
||||
width: 263px;
|
||||
background-color: rgba(0, 0, 0, 0.70588235);
|
||||
border-radius: 43px;
|
||||
padding-bottom: 29px;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
animation: succeedShow 0.3s, succeedHide 0.3s;
|
||||
animation-delay: 0s, 1.8s;
|
||||
}
|
||||
.signInBox-mask .succeed-mask .succeed-box .succeed-icon {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
background-color: #fbf7e9;
|
||||
border: 1px solid #fdda55;
|
||||
border-radius: 10px;
|
||||
-moz-box-shadow: 3px 3px 5px #fdeeb7;
|
||||
-webkit-box-shadow: 3px 3px 5px #fdeeb7;
|
||||
box-shadow: 3px 3px 5px #fdeeb7;
|
||||
flex-direction: column;
|
||||
position: relative;
|
||||
margin-top: -48px;
|
||||
margin-bottom: 31px;
|
||||
}
|
||||
.signInBox-mask .succeed-mask .succeed-box .succeed-icon .succeed-icon-bj {
|
||||
width: 220px;
|
||||
height: 211px;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
z-index: -1;
|
||||
}
|
||||
.signInBox-mask .succeed-mask .succeed-box .succeed-icon .succeed-icon-header-dot {
|
||||
width: 6px;
|
||||
height: 16px;
|
||||
background-color: #f7c308;
|
||||
border-radius: 24px;
|
||||
position: absolute;
|
||||
top: -6px;
|
||||
}
|
||||
.signInBox-mask .succeed-mask .succeed-box .succeed-icon .succeed-icon-header-dot-left {
|
||||
left: 20px;
|
||||
}
|
||||
.signInBox-mask .succeed-mask .succeed-box .succeed-icon .succeed-icon-header-dot-right {
|
||||
left: 74px;
|
||||
}
|
||||
.signInBox-mask .succeed-mask .succeed-box .succeed-icon .succeed-icon-header {
|
||||
height: 24px;
|
||||
background-color: rgba(253, 223, 109, 0.77647059);
|
||||
border-radius: 10px 10px 0 0;
|
||||
}
|
||||
.signInBox-mask .succeed-mask .succeed-box .succeed-icon .succeed-icon-dot {
|
||||
flex-wrap: wrap;
|
||||
padding-top: 16px;
|
||||
padding-left: 15px;
|
||||
}
|
||||
.signInBox-mask .succeed-mask .succeed-box .succeed-icon .succeed-icon-dot .succeed-icon-dot-item {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
border-radius: 50%;
|
||||
background-color: #f7c308;
|
||||
margin-right: 10px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.signInBox-mask .succeed-mask .succeed-box .succeed-icon .yellow-tick-box {
|
||||
position: absolute;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
right: -10px;
|
||||
bottom: -10px;
|
||||
z-index: 1;
|
||||
}
|
||||
.signInBox-mask .succeed-mask .succeed-box .succeed-icon .yellow-tick-box .yellow-tick-circle {
|
||||
position: absolute;
|
||||
left: -5px;
|
||||
top: -5px;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
z-index: -1;
|
||||
}
|
||||
.signInBox-mask .succeed-mask .succeed-box .succeed-icon .yellow-tick-box .yellow-tick-faint-yellow {
|
||||
width: 19px;
|
||||
height: 16px;
|
||||
}
|
||||
.signInBox-mask .succeed-mask .succeed-box .succeed-award-list {
|
||||
color: #fff;
|
||||
font-size: 16px;
|
||||
line-height: 28px;
|
||||
}
|
||||
.signInBox-mask .succeed-mask .succeed-box .succeed-award-list .succeed-award-item:not(:last-of-type) {
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
.signInBox-mask .succeed-mask .succeed-box .succeed-award-list .succeed-award-item .succeed-award-name {
|
||||
margin-right: 9px;
|
||||
}
|
||||
.signInBox-mask .succeed-mask .succeed-box .succeed-award-list .succeed-award-item .succeed-award-value {
|
||||
height: 22px;
|
||||
padding: 0 13.5px;
|
||||
background-color: #f6f6f6;
|
||||
border-radius: 20px;
|
||||
font-size: 18px;
|
||||
letter-spacing: 1px;
|
||||
font-family: "PingFangSC-Semibold", "PingFang SC Semibold", "PingFang SC", sans-serif;
|
||||
color: #deae07;
|
||||
font-weight: 650;
|
||||
}
|
||||
@keyframes succeedShow {
|
||||
0% {
|
||||
transform: scale(0);
|
||||
}
|
||||
100% {
|
||||
transform: scale(1);
|
||||
}
|
||||
}
|
||||
@keyframes succeedHide {
|
||||
0% {
|
||||
transform: scale(1);
|
||||
}
|
||||
100% {
|
||||
transform: scale(0);
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
485
css/signIn.less
485
css/signIn.less
@@ -37,6 +37,11 @@ body {
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.flexcolumn {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.flex1 {
|
||||
flex: 1;
|
||||
}
|
||||
@@ -52,7 +57,6 @@ body {
|
||||
|
||||
.signInBox {
|
||||
width: 1060px;
|
||||
height: 658px;
|
||||
background-color: #fff;
|
||||
border-radius: 20px;
|
||||
position: relative;
|
||||
@@ -93,15 +97,19 @@ body {
|
||||
}
|
||||
|
||||
.signInBox-content {
|
||||
align-items: flex-start;
|
||||
height: 595px;
|
||||
.left-box {
|
||||
width: 538px;
|
||||
padding: 20px 30px;
|
||||
padding: 20px 30px 40px;
|
||||
border-right: 1px dotted #d7d7d7;
|
||||
|
||||
.content-header {
|
||||
font-size: 15px;
|
||||
color: rgb(85, 85, 85);
|
||||
line-height: 40px;
|
||||
margin-bottom: 16px;
|
||||
position: relative;
|
||||
|
||||
.bi-img {
|
||||
width: 25px;
|
||||
@@ -127,9 +135,482 @@ body {
|
||||
|
||||
.bi-rule {
|
||||
margin-left: auto;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.outer-ring {
|
||||
position: absolute;
|
||||
left: calc(100% + 31px);
|
||||
top: -21px;
|
||||
z-index: 1;
|
||||
width: 522px;
|
||||
height: 594px;
|
||||
background-color: rgba(253, 218, 85, 1);
|
||||
padding: 20px;
|
||||
border-radius: 0 0 20px 0;
|
||||
|
||||
.rule-box {
|
||||
background-color: #fff;
|
||||
-moz-box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.0705882352941176);
|
||||
-webkit-box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.0705882352941176);
|
||||
box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.0705882352941176);
|
||||
border-radius: 20px;
|
||||
height: 100%;
|
||||
flex-direction: column;
|
||||
padding-bottom: 62px;
|
||||
|
||||
.rule-header {
|
||||
font-weight: 650;
|
||||
font-size: 24px;
|
||||
color: #ab8705;
|
||||
text-align: center;
|
||||
font-family: "PingFangSC-Semibold", "PingFang SC Semibold", "PingFang SC", sans-serif;
|
||||
padding-top: 37px;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
margin-bottom: 14px;
|
||||
|
||||
&::after {
|
||||
content: "";
|
||||
display: block;
|
||||
position: absolute;
|
||||
bottom: -4px;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
width: 120px;
|
||||
height: 22px;
|
||||
background-color: rgba(253, 238, 183, 1);
|
||||
border-radius: 219px;
|
||||
z-index: -1;
|
||||
}
|
||||
}
|
||||
|
||||
.rule-list {
|
||||
flex-direction: column;
|
||||
margin: 0 23px;
|
||||
|
||||
.rule-item {
|
||||
.rule-item-icon {
|
||||
width: 52px;
|
||||
height: 52px;
|
||||
background-color: rgba(246, 246, 246, 1);
|
||||
border: 1px solid rgba(235, 235, 235, 1);
|
||||
border-radius: 20px;
|
||||
-moz-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.117647058823529);
|
||||
-webkit-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.117647058823529);
|
||||
box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.117647058823529);
|
||||
margin-right: 30px;
|
||||
}
|
||||
|
||||
.rule-item-img {
|
||||
width: 30px;
|
||||
height: 36px;
|
||||
}
|
||||
|
||||
.rule-item-text {
|
||||
color: #333;
|
||||
line-height: 28px;
|
||||
font-size: 16px;
|
||||
padding: 40px 0;
|
||||
}
|
||||
|
||||
&:not(:last-of-type) {
|
||||
.rule-item-text {
|
||||
border-bottom: 1px dotted #ebebeb;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.rule-close {
|
||||
font-family: "PingFangSC-Regular", "PingFang SC", sans-serif;
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
font-size: 15px;
|
||||
color: #555555;
|
||||
text-decoration: underline;
|
||||
margin: 0 auto;
|
||||
line-height: normal;
|
||||
width: max-content;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.calendar-box {
|
||||
width: 477px;
|
||||
height: 479px;
|
||||
background-color: rgb(251, 251, 251);
|
||||
border-radius: 12px;
|
||||
flex-direction: column;
|
||||
padding: 38px 23px 0;
|
||||
|
||||
.sign-in-text {
|
||||
color: #555555;
|
||||
line-height: 28px;
|
||||
font-size: 14px;
|
||||
font-family: "PingFangSC-Regular", "PingFang SC", sans-serif;
|
||||
margin-bottom: 21px;
|
||||
.sign-in-value {
|
||||
font-family: "PingFangSC-Semibold", "PingFang SC Semibold", "PingFang SC", sans-serif;
|
||||
font-weight: 650;
|
||||
color: #000000;
|
||||
margin: 0 5px;
|
||||
}
|
||||
}
|
||||
|
||||
.calendar {
|
||||
margin: 0 0 14px; // 30rpx÷1.5=20px，15rpx÷1.5=10px
|
||||
flex-wrap: wrap;
|
||||
|
||||
.calendar-item {
|
||||
width: 40px; // 60rpx÷1.5=40px
|
||||
height: 40px; // 60rpx÷1.5=40px
|
||||
border-radius: 50%;
|
||||
margin-bottom: 10px; // 15rpx÷1.5=10px
|
||||
font-size: 17px; // 25rpx÷1.5≈17px（四舍五入）
|
||||
color: #aaaaaa;
|
||||
position: relative;
|
||||
box-sizing: border-box;
|
||||
|
||||
// 非第7n个子元素的右边距
|
||||
&:not(:nth-child(7n)) {
|
||||
margin-right: 25px; // 37.5rpx÷1.5=25px
|
||||
}
|
||||
|
||||
// 过去日期样式
|
||||
&.formerly {
|
||||
background-color: rgba(246, 246, 246, 1);
|
||||
}
|
||||
|
||||
// 已完成日期样式
|
||||
&.already {
|
||||
background-color: rgba(253, 238, 183, 1);
|
||||
color: #deae07;
|
||||
border: none;
|
||||
|
||||
// 已完成状态下的对勾
|
||||
.yellow-tick {
|
||||
width: 14px; // 21rpx÷1.5=14px
|
||||
height: 14px; // 21rpx÷1.5=14px
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: -2px; // 3rpx÷1.5=2px
|
||||
right: -2px; // 3rpx÷1.5=2px
|
||||
}
|
||||
}
|
||||
|
||||
// 对勾默认隐藏
|
||||
.yellow-tick {
|
||||
display: none;
|
||||
}
|
||||
|
||||
// 今日日期样式
|
||||
&.today {
|
||||
border: 1px solid rgba(222, 174, 7, 1); // 1rpx÷1.5≈0.67px，取1px更清晰
|
||||
color: #deae07;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.sign-in-btn {
|
||||
height: 48px;
|
||||
border-radius: 219px; // 328.5rpx ÷ 1.5 = 219px（精确值）
|
||||
background-color: rgb(247, 195, 8);
|
||||
color: #fff;
|
||||
font-size: 20px;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.sign-in-box {
|
||||
margin: 0 15px;
|
||||
// padding-bottom: 22px;
|
||||
border-radius: 20px;
|
||||
font-family: "PingFangSC-Regular", "PingFang SC", sans-serif;
|
||||
font-weight: 400;
|
||||
color: #555555;
|
||||
font-size: 15px;
|
||||
flex-direction: column;
|
||||
height: inherit;
|
||||
overflow: auto;
|
||||
|
||||
.sign-in-header {
|
||||
padding: 24px 30px 9px;
|
||||
font-size: 14px;
|
||||
line-height: 28px;
|
||||
|
||||
.sign-in-header-value {
|
||||
font-weight: 650;
|
||||
color: #000000;
|
||||
margin: 0 5px;
|
||||
border-bottom: 1px dotted #ebebeb;
|
||||
}
|
||||
}
|
||||
|
||||
.sign-in-list {
|
||||
.sign-in-item {
|
||||
padding: 11px 0 0 30px;
|
||||
|
||||
&:not(:last-of-type) {
|
||||
.sign-in-info {
|
||||
border-bottom: 1px dotted #ebebeb;
|
||||
}
|
||||
}
|
||||
|
||||
.sign-in-index {
|
||||
color: #aaaaaa;
|
||||
font-size: 15px;
|
||||
width: 40px;
|
||||
}
|
||||
|
||||
.sign-in-avatar {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
border-radius: 50%;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.sign-in-info {
|
||||
padding-bottom: 9px;
|
||||
|
||||
&:not(:last-of-type) {
|
||||
border-bottom: 1px dotted #ebebeb;
|
||||
}
|
||||
|
||||
.sign-in-info-left {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.sign-in-name {
|
||||
color: #555555;
|
||||
font-size: 14px;
|
||||
margin-bottom: 3px;
|
||||
|
||||
.sign-in-my {
|
||||
margin-left: 10px;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
background-color: rgba(240, 242, 245, 1);
|
||||
border: 1px solid rgba(215, 215, 215, 1);
|
||||
border-radius: 5px;
|
||||
font-size: 12px;
|
||||
color: #7f7f7f;
|
||||
}
|
||||
}
|
||||
|
||||
.sign-in-time {
|
||||
color: #aaaaaa;
|
||||
font-size: 13px;
|
||||
}
|
||||
}
|
||||
|
||||
.sign-in-value {
|
||||
border-radius: 50%;
|
||||
margin-right: 20px;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
background-color: rgb(253, 238, 183);
|
||||
font-family: PingFangSC-Regular, "PingFang SC", sans-serif;
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
font-size: 16px;
|
||||
color: #deae07;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.sign-in-finish {
|
||||
font-size: 13px;
|
||||
color: rgb(215, 215, 215);
|
||||
padding-top: 10px;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
|
||||
.sign-in-more {
|
||||
color: #333333;
|
||||
font-size: 14px;
|
||||
padding-top: 10px;
|
||||
padding-bottom: 10px;
|
||||
cursor: pointer;
|
||||
|
||||
.sign-in-more-icon {
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
margin-left: 6px;
|
||||
}
|
||||
}
|
||||
|
||||
.discuss-list-no {
|
||||
flex-direction: column;
|
||||
.empty-icon {
|
||||
width: 101px;
|
||||
height: 120px;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
.discuss-list-no-text {
|
||||
font-size: 12px;
|
||||
color: #555555;
|
||||
line-height: 22px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.succeed-mask {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
|
||||
.succeed-box {
|
||||
width: 263px;
|
||||
background-color: rgba(0, 0, 0, 0.705882352941177);
|
||||
border-radius: 43px;
|
||||
padding-bottom: 29px;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
animation: succeedShow 0.3s, succeedHide 0.3s;
|
||||
animation-delay: 0s, 1.8s;
|
||||
|
||||
.succeed-icon {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
background-color: rgba(251, 247, 233, 1);
|
||||
border: 1px solid rgba(253, 218, 85, 1);
|
||||
border-radius: 10px;
|
||||
-moz-box-shadow: 3px 3px 5px rgba(253, 238, 183, 1);
|
||||
-webkit-box-shadow: 3px 3px 5px rgba(253, 238, 183, 1);
|
||||
box-shadow: 3px 3px 5px rgba(253, 238, 183, 1);
|
||||
flex-direction: column;
|
||||
position: relative;
|
||||
margin-top: -48px;
|
||||
margin-bottom: 31px;
|
||||
|
||||
.succeed-icon-bj {
|
||||
width: 220px;
|
||||
height: 211px;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
.succeed-icon-header-dot {
|
||||
width: 6px;
|
||||
height: 16px;
|
||||
background-color: rgba(247, 195, 8, 1);
|
||||
border-radius: 24px;
|
||||
position: absolute;
|
||||
top: -6px;
|
||||
}
|
||||
|
||||
.succeed-icon-header-dot-left {
|
||||
left: 20px;
|
||||
}
|
||||
|
||||
.succeed-icon-header-dot-right {
|
||||
left: 74px;
|
||||
}
|
||||
|
||||
.succeed-icon-header {
|
||||
height: 24px;
|
||||
background-color: rgba(253, 223, 109, 0.776470588235294);
|
||||
border-radius: 10px 10px 0 0;
|
||||
}
|
||||
|
||||
.succeed-icon-dot {
|
||||
flex-wrap: wrap;
|
||||
padding-top: 16px;
|
||||
padding-left: 15px;
|
||||
|
||||
.succeed-icon-dot-item {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
border-radius: 50%;
|
||||
background-color: rgba(247, 195, 8, 1);
|
||||
margin-right: 10px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.yellow-tick-box {
|
||||
position: absolute;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
right: -10px;
|
||||
bottom: -10px;
|
||||
z-index: 1;
|
||||
|
||||
.yellow-tick-circle {
|
||||
position: absolute;
|
||||
left: -5px;
|
||||
top: -5px;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
.yellow-tick-faint-yellow {
|
||||
width: 19px;
|
||||
height: 16px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.succeed-award-list {
|
||||
color: #fff;
|
||||
font-size: 16px;
|
||||
line-height: 28px;
|
||||
|
||||
.succeed-award-item {
|
||||
&:not(:last-of-type) {
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.succeed-award-name {
|
||||
margin-right: 9px;
|
||||
}
|
||||
|
||||
.succeed-award-value {
|
||||
height: 22px;
|
||||
padding: 0 13.5px;
|
||||
background-color: rgba(246, 246, 246, 1);
|
||||
border-radius: 20px;
|
||||
font-size: 18px;
|
||||
letter-spacing: 1px;
|
||||
font-family: "PingFangSC-Semibold", "PingFang SC Semibold", "PingFang SC", sans-serif;
|
||||
color: #deae07;
|
||||
font-weight: 650;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes succeedShow {
|
||||
0% {
|
||||
transform: scale(0);
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: scale(1);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes succeedHide {
|
||||
0% {
|
||||
transform: scale(1);
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: scale(0);
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
187
index.html
187
index.html
@@ -1,38 +1,17 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
{extend name="forum/base" /}
|
||||
{block name="link"}
|
||||
<link rel="stylesheet" href="{@css/index.css}" />
|
||||
{/block}
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>论坛首页</title>
|
||||
<link rel="stylesheet" href="./css/public.css" />
|
||||
<link rel="stylesheet" href="./css/index.css" />
|
||||
|
||||
<script src="./js/vue.global.js"></script>
|
||||
<script src="./component/bi/bi.js"></script>
|
||||
<style>
|
||||
[v-cloak] {
|
||||
display: none;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="container" id="appIndex" v-cloak>
|
||||
<head-top></head-top>
|
||||
|
||||
<div class="" @click="clickbtn()">按钮</div>
|
||||
<bi-card coins="20" token="_TXzU0MGGjdPFL8RR-Qmja2gGEbUCNPUddwAdczWPJctueas3yXWMkYCvr96dc95-Wu_WCMXYd1kHBCRMdIeydneWA5hsg4_a8hkH5tGKdrxdc_OPQtzsCPybE62xK9rPRFsdPwzQI9pqQYthZYqcANTqof0CpHcMS3yUP1NIvFnJ602njRjNTY~"></bi-card>
|
||||
{block name="main"}
|
||||
<div class="container" id="appIndex" v-cloak>
|
||||
<head-top page="index"></head-top>
|
||||
|
||||
<div class="header-content-box flexflex">
|
||||
<div class="header-content-left">
|
||||
<div class="adv-list flexacenter">
|
||||
<a class="adv-item" target="_blank">
|
||||
<img class="adv-img" src="https://o.x-php.com/bbs/common/cf/144405a5pqst6fakct81t8.gif" />
|
||||
</a>
|
||||
<a class="adv-item" target="_blank">
|
||||
<img class="adv-img" src="https://o.x-php.com/bbs/common/cf/144405a5pqst6fakct81t8.gif" />
|
||||
</a>
|
||||
<div class="headerbanner adv-item">{:html_entity_decode($ad['headerbanner'])}</div>
|
||||
<div class="subnavbanner adv-item">{:html_entity_decode($ad['subnavbanner'])}</div>
|
||||
</div>
|
||||
<!-- 话题和精选 -->
|
||||
<div class="topic-and-selectives flexflex">
|
||||
@@ -41,9 +20,9 @@
|
||||
<img class="icon" src="https://app.gter.net/image/miniApp/offer/well-white.svg" />
|
||||
<div class="text">话题</div>
|
||||
</div>
|
||||
<div class="topic-head flexflex" bind:tap="goDetails" data-uniqid="{{ ongoingbj.uniqid }}">
|
||||
<div class="title one-line-display">{{ ongoingbj.title }}</div>
|
||||
<div class="hint one-line-display">{{ ongoingbj.description }}</div>
|
||||
<div class="topic-head flexflex">
|
||||
<a class="title one-line-display" :href="'/details/' + ongoingbj.uniqid" target="_blank">{{ ongoingbj.title }}</a>
|
||||
<a class="hint one-line-display" :href="'/details/' + ongoingbj.uniqid" target="_blank"></a>
|
||||
<div class="people flexacenter">
|
||||
<div class="left flexacenter">
|
||||
<div class="number">{{ ongoingbj.comments }}</div>
|
||||
@@ -57,9 +36,9 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="topic-list">
|
||||
<a class="item flexacenter" v-for="(item, index) in pastList" :key="index" :href="'http://14.22.79.19:9551/?tpl=forum/details&uniqid=' + item.uniqid" target="_blank">
|
||||
<a class="item flexacenter" v-for="(item, index) in pastList" :key="index" :href="'/details/' + item.uniqid" target="_blank">
|
||||
<img class="img" src="https://app.gter.net/image/miniApp/offer/well-yellow.svg" />
|
||||
<div class="text one-line-display flex1">{{ item.title }}</div>
|
||||
<div class="text one-line-display flex1" v-html="item.title"></div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
@@ -70,60 +49,70 @@
|
||||
<div class="text">精选</div>
|
||||
</div>
|
||||
<div class="list flexflex">
|
||||
<a class="item flexacenter" v-for="(item, index) in topicHandpickedList" :key="index" :href="'http://14.22.79.19:9551/?tpl=forum/details&uniqid=' + item.uniqid" target="_blank">
|
||||
<a class="item flexacenter" v-for="(item, index) in topicHandpickedList" :key="index" :href="'/details/' + item.uniqid" target="_blank">
|
||||
<div class="dot"></div>
|
||||
<div class="text one-line-display">{{ item.title }}</div>
|
||||
<div class="text one-line-display" v-html="item.title"></div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="header-left-bottom-box flexflex">
|
||||
<a class="adv flexacenter" data-x-event="bbsindexslide" href="https://bbs.gter.net/thread-1663824-1-1.html" title="26Fall祈福，求offer得offer！" target="_blank">
|
||||
<img class="adv-icon" src="https://o.x-php.com/Zvt57TuJSUvkyhw-xG_Y2l-U_potcXiB1NFX9ddrB-ebU2ybYKMuA2kGH_7R-9lU990IXj3X-Q7x4Cg0NDI5" alt="26Fall祈福，求offer得offer！" />
|
||||
<a class="adv flexacenter" data-x-event="bbsindexslide" href="{$operation['bbsindexslide']['url']}" title="{$operation['bbsindexslide']['title']}" target="_blank">
|
||||
<img class="adv-icon" src="{$operation['bbsindexslide']['image']}" alt="{$operation['bbsindexslide']['title']}" />
|
||||
</a>
|
||||
<div class="list">
|
||||
<div class="item flexacenter" v-for="(item, index) in 4" :key="index">
|
||||
{foreach :array_slice($operation['bbsindexarticle'],0,4) as $key=>$vo }
|
||||
<div class="item flexacenter">
|
||||
<div class="icon dot-gray"></div>
|
||||
<a class="one-line-display text flex1" href="https://offer.gter.net/details/XynvPnSnX1KL" target="_blank">26Fall-香港理工大学 MSc Offer</a>
|
||||
<a class="one-line-display text flex1" href="{$vo['url']}" target="_blank">{$vo['title']}</a>
|
||||
</div>
|
||||
{/foreach}
|
||||
</div>
|
||||
<div class="list list2">
|
||||
<div class="item flexacenter" v-for="(item, index) in 4" :key="index">
|
||||
{foreach :array_slice($operation['bbsindexarticle'],4,8) as $key=>$vo }
|
||||
<div class="item flexacenter">
|
||||
<div class="icon dot-gray"></div>
|
||||
<a class="one-line-display text flex1" href="https://offer.gter.net/details/y9KbiuzHXbmr" target="_blank">26Fall-香港科技大学 MSc Offer</a>
|
||||
<a class="one-line-display text flex1" href="{$vo['url']}" target="_blank">{$vo['title']}</a>
|
||||
</div>
|
||||
{/foreach}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="header-content-right">
|
||||
<div class="post-entrance">
|
||||
<div class="entrance-top flexacenter"><img class="icon" src="./img/forum.png" />我要发帖</div>
|
||||
<a class="entrance-top flexacenter" href="/publish" target="_blank"><img class="icon" src="./img/forum.png" />我要发帖</a>
|
||||
<div class="entrance-bottom flexacenter">
|
||||
<a class="item flexcenter" href="https://offer.gter.net/post" target="_blank" style="position: relative">
|
||||
<img class="icon" src="./img/offer.svg" style="width: 16px" />
|
||||
<a class="item flexcenter" href="https://offer.gter.net/post" target="_blank">
|
||||
<div class="icon-box">
|
||||
<img class="icon" src="{@img/offer-icon-V2.svg}" />
|
||||
</div>
|
||||
<span class="text">报Offer</span>
|
||||
</a>
|
||||
<a class="item flexcenter" href="https://offer.gter.net/post/summary" target="_blank" style="position: relative">
|
||||
<img class="icon" src="./img/summarize.png" style="width: 16px" />
|
||||
<a class="item flexcenter" href="https://offer.gter.net/post/summary" target="_blank">
|
||||
<div class="icon-box">
|
||||
<img class="icon" src="{@img/summary-icon-V2.svg}" />
|
||||
</div>
|
||||
<span class="text">写总结</span>
|
||||
</a>
|
||||
<a class="item flexcenter" href="https://interviewexperience.gter.net/publish" target="_blank" style="position: relative">
|
||||
<img class="icon" src="./img/mj.png" style="width: 16px" />
|
||||
<a class="item flexcenter" href="https://interviewexperience.gter.net/publish" target="_blank">
|
||||
<div class="icon-box">
|
||||
<img class="icon" src="{@img/mj-icon-V2.svg}" />
|
||||
</div>
|
||||
<span class="text">写面经</span>
|
||||
</a>
|
||||
<a class="item flexcenter" href="https://vote.gter.net/publish" target="_blank" style="position: relative">
|
||||
<img class="icon" src="./img/vote.svg" style="width: 16px" />
|
||||
<a class="item flexcenter" href="https://vote.gter.net/publish" target="_blank" >
|
||||
<div class="icon-box">
|
||||
<img class="icon" src="{@img/vote-icon-V2.svg}" />
|
||||
</div>
|
||||
<span class="text">发起投票</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<a class="adv-broadside" ref="custom_2AdvRef">
|
||||
<img class="adv-broadside-img" src="https://o.x-php.com/bbs/common/cf/152158dpf5eh7pqpaealiq.gif" />
|
||||
</a>
|
||||
|
||||
{if $ad['custom_2']}
|
||||
<div class="custom_2 adv" ref="custom_2AdvRef">{:html_entity_decode($ad['custom_2'])}</div>
|
||||
{/if}
|
||||
<div class="group-box">
|
||||
<div class="group flexflex">
|
||||
<div class="group-item flexcenter" v-for="(item, index) in popList" :key="index">
|
||||
@@ -150,44 +139,54 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="matter flexflex">
|
||||
|
||||
<div class="admission">
|
||||
<a class="admission-header flexflex" target="_blank" href="https://admissionofficer.gter.net">
|
||||
<img class="admission-header-icon" src="/img/admission-officer-icon.png">
|
||||
<div class="admission-header-name flexflex">Hello Admission Officer</div>
|
||||
</a>
|
||||
<div class="admission-list flexflex">
|
||||
{foreach $OfficerToEnrolNewStudents as $key=>$item}
|
||||
<div class="admission-item flexcenter">
|
||||
<a class="admission-img" href="{$item['url']}" target="_blank">
|
||||
<img src="{$item['image']}" alt="{$item['name']}" />
|
||||
</a>
|
||||
</div>
|
||||
{/foreach}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="matter flexflex" ref="matterRef">
|
||||
<div class="matter-content flex1">
|
||||
<!-- 论坛板块列表 -->
|
||||
<div class="forum-sections-list">
|
||||
<img class="img" src="./img/sections-left.svg" />
|
||||
<img class="img" src="{@img/sections-left.svg}" />
|
||||
<div class="title">论坛版块</div>
|
||||
<div class="list">
|
||||
<template v-for="(item, index) in sectionList" :key="index">
|
||||
<div class="line flexacenter">
|
||||
<a class="item flexacenter" v-for="(item, index) in item" :key="index" target="_blank" :href="`/section-index.html?section=${item.uniqid}`">{{ item.name }}</a>
|
||||
<a class="item flexacenter" v-for="(item, index) in item" :key="index" target="_blank" :href="`/section/${item.uniqid}`">{{ item.name }}</a>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
<div class="list-load-box flexcenter">
|
||||
<img class="list-load-icon" src="./img/load-icon.svg" />
|
||||
<div class="list-load-text">加载中</div>
|
||||
</div>
|
||||
<item-forum :itemdata="item" v-for="(item, index) in list" :key="index"></item-forum>
|
||||
</div>
|
||||
<div class="sidebar" :style="{'top': sidebarHeight + 'px'}" ref="sidebarRef">
|
||||
<a class="ad-item flexacenter" href="" target="_blank">
|
||||
<img class="adv-icon" src="https://o.x-php.com/bbs/common/cf/1709075xdbbbvjd8cbxvdd.jpg" alt="26Fall祈福，求offer得offer！" />
|
||||
</a>
|
||||
<a class="ad-item flexacenter" href="" target="_blank">
|
||||
<img class="adv-icon" src="https://o.x-php.com/bbs/common/cf/1709075xdbbbvjd8cbxvdd.jpg" alt="26Fall祈福，求offer得offer！" />
|
||||
</a>
|
||||
|
||||
<item-forum :itemdata="item" v-for="(item, index) in list" :key="index"></item-forum>
|
||||
<load-box :loading="loading"></load-box>
|
||||
</div>
|
||||
<div class="sidebar" ref="sidebarRef" :style="{'top': sidebarHeight + 'px'}">
|
||||
{if $ad['custom_1']} <div class="custom_1 ad-item">{:html_entity_decode($ad['custom_1'])}</div> {/if}
|
||||
{if $ad['custom_3']} <div class="custom_3 ad-item">{:html_entity_decode($ad['custom_3'])}</div> {/if}
|
||||
<!-- offer -->
|
||||
<div class="offer-side-box side-box" v-if="offer.length != 0">
|
||||
<div class="side-header flexacenter">
|
||||
<div class="left flexacenter">
|
||||
<img class="header-icon" src="./img/offer-index-icon.png" />
|
||||
<img class="header-icon" src="{@img/offer-index-icon.png}" />
|
||||
<div class="title">Offer</div>
|
||||
</div>
|
||||
<a class="more flexacenter" href="https://offer.gter.net" target="_blank">
|
||||
<span>more</span>
|
||||
<img class="more-icon" src="./img/right-arrow-black.svg" />
|
||||
<img class="more-icon" src="{@img/right-arrow-black.svg}" />
|
||||
</a>
|
||||
</div>
|
||||
<div class="box">
|
||||
@@ -206,7 +205,7 @@
|
||||
</div>
|
||||
</a>
|
||||
<a class="add-btn flexcenter" style="position: relative" href="https://offer.gter.net/post" target="_blank" v-cloak>
|
||||
<img class="add-icon" src="./img/add-btn-black.svg" />
|
||||
<img class="add-icon" src="{@img/add-btn-black.svg}" />
|
||||
<div>报Offer</div>
|
||||
<div v-if="realname == 0 && userInfo.uin > 0" class="open-attest-btn" @click.prevent="openAttest"></div>
|
||||
</a>
|
||||
@@ -217,21 +216,21 @@
|
||||
<div class="vote-side-box side-box" v-if="vote.length != 0">
|
||||
<div class="side-header flexacenter">
|
||||
<div class="left flexacenter">
|
||||
<img class="header-icon" src="./img/vote-index-icon.png" />
|
||||
<img class="header-icon" src="{@img/vote-index-icon.png}" />
|
||||
<div class="title">投票</div>
|
||||
</div>
|
||||
<a class="more flexacenter" target="_blank" href="https://vote.gter.net">
|
||||
<span>more</span>
|
||||
<img class="more-icon" src="./img/right-arrow-black.svg" />
|
||||
<img class="more-icon" src="{@img/right-arrow-black.svg}" />
|
||||
</a>
|
||||
</div>
|
||||
<div class="box">
|
||||
<a class="item flexflex" v-cloak v-for="item in vote" :key="item" target="_blank" :href="'https://vote.gter.net/details/' + item['uniqid']">
|
||||
<a class="item flexflex" v-cloak v-for="item in vote" :key="item" target="_blank" :href="'/details/' + item['uniqid']">
|
||||
<div class="name one-line-display">{{item['title']}}</div>
|
||||
<div class="brief">{{ item['message'] }}</div>
|
||||
<div class="brief">{{ item['content'] }}</div>
|
||||
</a>
|
||||
<a class="add-btn flexcenter" style="position: relative" v-cloak target="_blank" href="https://vote.gter.net/publish">
|
||||
<img class="add-icon" src="./img/add-btn-black.svg" />
|
||||
<img class="add-icon" src="{@img/add-btn-black.svg}" />
|
||||
<div>发起投票</div>
|
||||
<div v-if="realname == 0 && userInfo.uin > 0" class="open-attest-btn" @click.prevent="openAttest"></div>
|
||||
</a>
|
||||
@@ -242,25 +241,25 @@
|
||||
<div class="interviewexperience-side-box side-box" v-if="interviewexperience.length != 0">
|
||||
<div class="side-header flexacenter">
|
||||
<div class="left flexacenter">
|
||||
<img class="header-icon" src="./img/mj-index-icon.png" />
|
||||
<img class="header-icon" src="{@img/mj-index-icon.png}" />
|
||||
<div class="title">面经</div>
|
||||
</div>
|
||||
<a class="more flexacenter" href="https://interviewexperience.gter.net/" target="_blank">
|
||||
<span>more</span>
|
||||
<img class="more-icon" src="./img/right-arrow-black.svg" />
|
||||
<img class="more-icon" src="{@img/right-arrow-black.svg}" />
|
||||
</a>
|
||||
</div>
|
||||
<div class="box">
|
||||
<a class="item flexflex" v-cloak v-for="(item,index) in interviewexperience" :key="item" :href="'https://interviewexperience.gter.net/details/' + item['uniqid']" target="_blank">
|
||||
<a class="item flexflex" v-cloak v-for="(item,index) in interviewexperience" :key="item" :href="'/details/' + item['uniqid']" target="_blank">
|
||||
<div class="school one-line-display">{{ item.data['schoolname'] }}</div>
|
||||
<div class="major one-line-display" v-if="item.data['profession']">{{ item.data['profession'] }}</div>
|
||||
<div class="major one-line-display">{{ item.data['profession'] || item.data['project'] }}</div>
|
||||
<div class="info">
|
||||
<img class="icon" :src="item.user['avatar']" />
|
||||
<span class="text">{{ item['content'] }}</span>
|
||||
</div>
|
||||
</a>
|
||||
<a class="add-btn flexcenter" style="position: relative" href="https://interviewexperience.gter.net/publish" target="_blank" v-cloak>
|
||||
<img class="add-icon" src="./img/add-btn-black.svg" />
|
||||
<img class="add-icon" src="{@img/add-btn-black.svg}" />
|
||||
<div>写面经</div>
|
||||
<div v-if="realname == 0 && userInfo.uin > 0" class="open-attest-btn" @click.prevent="openAttest"></div>
|
||||
</a>
|
||||
@@ -272,12 +271,12 @@
|
||||
<latest-list boxtype="essence"></latest-list>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/block}
|
||||
|
||||
<script src="./js/axios.min.js"></script>
|
||||
<script src="./js/public.js"></script>
|
||||
<script src="./js/scrolltext.js"></script>
|
||||
<script type="module" src="./js/index.js"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
{block name="module"}
|
||||
{__block__}
|
||||
<script src="/js/scrolltext.js"></script>
|
||||
<script type="module" src="/js/index.js"></script>
|
||||
<!-- <script type="module" src="https://f.gter.net/js/index.js"></script> -->
|
||||
{/block}
|
||||
231
js/signIn.js
231
js/signIn.js
@@ -3,15 +3,13 @@ const { createApp, ref, onMounted, nextTick, onUnmounted, computed, watch, provi
|
||||
const appSectionIndex = createApp({
|
||||
setup() {
|
||||
onMounted(() => {
|
||||
console.log("signIn");
|
||||
|
||||
getFirstDay();
|
||||
getList();
|
||||
});
|
||||
|
||||
let dayOfWeek = ref(0); // 当月第一天是星期几
|
||||
let totalDaysInMonth = ref(0); // 当月第一共今天
|
||||
let currentDay = ref(0); // 今天几号
|
||||
let showList = ref([]); // 展示的 签到列表
|
||||
|
||||
const getFirstDay = () => {
|
||||
const firstDayOfMonth = new Date();
|
||||
@@ -30,33 +28,228 @@ const appSectionIndex = createApp({
|
||||
init();
|
||||
};
|
||||
|
||||
let integral = ref(""); // 全部的寄托币
|
||||
let tips = ref([]);
|
||||
let issign = ref(0); // 是否签到了
|
||||
let signList = ref([]); // 签到列表
|
||||
let succeedState = ref(false); // 签到弹窗状态
|
||||
let extra_reward = ref(0); // 额外奖励
|
||||
let reward = ref(0); // 额外奖励
|
||||
let token = ref(""); //
|
||||
|
||||
let signnum = ref(0); // 签到多少天
|
||||
let signreward = ref(0); // 签到获得寄托币
|
||||
|
||||
// 初始化
|
||||
const init = () => {
|
||||
ajaxGet("https://api.gter.net/v2/api/forum/getSignInfo").then((res) => {
|
||||
fetchGetData("https://api.gter.net/v2/api/forum/getSignInfo").then((res) => {
|
||||
if (res.code != 200) return;
|
||||
console.log("res", res);
|
||||
const data = res.data;
|
||||
|
||||
const list = data.list || {};
|
||||
this.getDateList(list);
|
||||
getDateList(list);
|
||||
|
||||
const issign = data.issign || 0;
|
||||
if (issign == 1) wx.setStorageSync("signInState", util.getCurrentDate()); // 存储签到时间
|
||||
|
||||
this.setData({
|
||||
tips: data.tips || [],
|
||||
integral: Number(data.integral) || 0,
|
||||
token: data.token || "",
|
||||
signnum: data.signnum || 0,
|
||||
signreward: data.signreward || 0,
|
||||
issign,
|
||||
});
|
||||
|
||||
console.log("integral", this.data.integral);
|
||||
if (data.issign == 1) localStorage.setItem("signInState", getCurrentDate()); // 存储签到时间
|
||||
tips.value = data.tips || [];
|
||||
integral.value = Number(data.integral) || 0;
|
||||
token.value = data.token || "";
|
||||
signnum.value = data.signnum || 0;
|
||||
signreward.value = data.signreward || 0;
|
||||
issign.value = data.issign;
|
||||
});
|
||||
};
|
||||
|
||||
return { dayOfWeek };
|
||||
let dateList = ref([]); // 签到列表
|
||||
|
||||
const getDateList = (list = {}) => {
|
||||
let listT = [];
|
||||
// type 0 还没有到来 1 已经过去没有签到 2 签到 3 今天 没有签到的
|
||||
for (let i = 1; i < totalDaysInMonth.value + 1; i++) {
|
||||
let type = 0;
|
||||
let name = "";
|
||||
|
||||
let ii = i.toString().padStart(2, "0");
|
||||
|
||||
if (list[ii]) {
|
||||
type = 2;
|
||||
name = `+${list[ii]}`;
|
||||
} else if (currentDay.value > i) type = 1;
|
||||
else if (currentDay.value == i) type = 3;
|
||||
|
||||
if (!name) name = currentDay.value == i ? "今" : i;
|
||||
listT.push({
|
||||
type,
|
||||
name,
|
||||
});
|
||||
}
|
||||
dateList.value = listT;
|
||||
};
|
||||
|
||||
const calendarClass = ref({
|
||||
1: "formerly",
|
||||
2: "already",
|
||||
3: "today",
|
||||
});
|
||||
|
||||
let loading = ref(false);
|
||||
let list = ref([]);
|
||||
let showList = ref([]); // 展示的 签到列表
|
||||
let my = ref({}); // 我的签到信息
|
||||
let todaycount = ref(0); // 签到总数
|
||||
|
||||
const getList = () => {
|
||||
loading.value = true;
|
||||
|
||||
fetchGetData("https://api.gter.net/v2/api/forum/getSignRankList")
|
||||
.then((res) => {
|
||||
if (res.code != 200) return;
|
||||
const data = res.data || {};
|
||||
showList.value = data.list.slice(0, 10);
|
||||
list.value = data.list;
|
||||
my.value = data.my;
|
||||
todaycount.value = data.todaycount;
|
||||
})
|
||||
.finally(() => {
|
||||
loading.value = false;
|
||||
});
|
||||
};
|
||||
|
||||
let showPage = 1;
|
||||
// 签到列表更多 切割列表的
|
||||
const moreList = () => {
|
||||
// 10 开始 间隔20
|
||||
const arr = list.value.slice(showPage * 20 - 10, showPage * 20 + 10);
|
||||
showList.value = showList.value.concat(arr);
|
||||
showPage++;
|
||||
};
|
||||
|
||||
let ruleState = ref(false); // 规则弹窗
|
||||
|
||||
// 切换规则弹窗
|
||||
const cutRing = () => (ruleState.value = !ruleState.value);
|
||||
|
||||
const postSign = () => {
|
||||
const user = window.userInfoWin;
|
||||
// 没有绑定 寄托账号
|
||||
if (!user || (user?.uin <= 0 && user?.uid <= 0)) {
|
||||
console.log("user99999");
|
||||
creationAlertBox("error", "没有绑定寄托账号");
|
||||
showWindow("login", "https://passport.gter.net/login/ajax", "get", -1, { cover: true });
|
||||
return;
|
||||
}
|
||||
|
||||
fetchData("https://api.gter.net/v2/api/forum/sign").then((res) => {
|
||||
if (res.code != 200) {
|
||||
creationAlertBox("error", res.message);
|
||||
return;
|
||||
}
|
||||
|
||||
const data = res.data;
|
||||
|
||||
data.extra_reward = data.extra_reward * 1;
|
||||
data.reward = data.reward * 1;
|
||||
|
||||
const rewardT = data.extra_reward + data.reward || 0; // 一共加了多少寄托币
|
||||
|
||||
dateList.value[currentDay.value - 1]["type"] = 2;
|
||||
dateList.value[currentDay.value - 1]["name"] = `+${rewardT}`;
|
||||
|
||||
issign.value = 1;
|
||||
extra_reward.value = data.extra_reward || 0;
|
||||
reward.value = data.reward || 0;
|
||||
todaycount.value = todaycount.value + 1;
|
||||
signnum.value = signnum.value + 1;
|
||||
signreward.value = signreward.value + rewardT;
|
||||
integral.value = integral.value + rewardT;
|
||||
|
||||
my.value = {
|
||||
avatar: user.avatar || "",
|
||||
username: user.nickname || "匿名用户",
|
||||
uin: user.uin || 0,
|
||||
uid: user.uid || 0,
|
||||
rank: data.rank || 1,
|
||||
reward: rewardT,
|
||||
timestamp: getCurrentDateTime(),
|
||||
};
|
||||
|
||||
cutSucceed();
|
||||
localStorage.setItem("signInState", getCurrentDate());
|
||||
});
|
||||
};
|
||||
|
||||
// 打开签到弹窗 后关闭
|
||||
const cutSucceed = () => {
|
||||
succeedState.value = true;
|
||||
setTimeout(() => (succeedState.value = false), 1800);
|
||||
};
|
||||
|
||||
const getCurrentDateTime = () => {
|
||||
const currentDate = new Date();
|
||||
|
||||
const year = currentDate.getFullYear();
|
||||
const month = this.padNumber(currentDate.getMonth() + 1); // 月份从0开始，需要加1
|
||||
const day = this.padNumber(currentDate.getDate());
|
||||
const hours = this.padNumber(currentDate.getHours());
|
||||
const minutes = this.padNumber(currentDate.getMinutes());
|
||||
const seconds = this.padNumber(currentDate.getSeconds());
|
||||
|
||||
const formattedDateTime = year + "-" + month + "-" + day + " " + hours + ":" + minutes + ":" + seconds;
|
||||
|
||||
return formattedDateTime;
|
||||
};
|
||||
|
||||
const getCurrentDate = () => {
|
||||
const now = new Date();
|
||||
const year = now.getFullYear();
|
||||
const month = (now.getMonth() + 1).toString().padStart(2, "0"); // 月份从0开始，需要加1，并确保两位数
|
||||
const day = now.getDate().toString().padStart(2, "0"); // 确保两位数
|
||||
|
||||
return `${year}-${month}-${day}`;
|
||||
};
|
||||
|
||||
const fetchData = (url, data) => {
|
||||
return new Promise((resolve, reject) => {
|
||||
var xhr = new XMLHttpRequest();
|
||||
xhr.responseType = "json";
|
||||
xhr.withCredentials = true;
|
||||
|
||||
xhr.open("POST", url, true);
|
||||
xhr.setRequestHeader("Content-Type", "application/json");
|
||||
|
||||
if (["127.0.0.1", "localhost", "192.168.18.219"].includes(location.hostname)) xhr.setRequestHeader("Authorization", "3b01343c65e3b2fa3ce32ae26feb3a9b");
|
||||
|
||||
xhr.onreadystatechange = function () {
|
||||
if (xhr.readyState === 4 && xhr.status === 200) {
|
||||
let response = xhr.response;
|
||||
resolve(response);
|
||||
}
|
||||
};
|
||||
|
||||
xhr.send(JSON.stringify(data));
|
||||
});
|
||||
};
|
||||
|
||||
const fetchGetData = (url) => {
|
||||
return new Promise((resolve, reject) => {
|
||||
const xhr = new XMLHttpRequest();
|
||||
xhr.withCredentials = true;
|
||||
|
||||
xhr.open("GET", url, true);
|
||||
if (["127.0.0.1", "localhost", "192.168.18.219"].includes(location.hostname)) xhr.setRequestHeader("Authorization", "3b01343c65e3b2fa3ce32ae26feb3a9b");
|
||||
|
||||
xhr.onreadystatechange = function () {
|
||||
if (xhr.readyState === 4 && xhr.status === 200) {
|
||||
let response = xhr.response;
|
||||
resolve(JSON.parse(response));
|
||||
}
|
||||
};
|
||||
|
||||
xhr.send();
|
||||
});
|
||||
};
|
||||
|
||||
return { postSign, cutRing, moreList, todaycount, my, showList, list, loading, calendarClass, dateList, signreward, signnum, token, reward, extra_reward, succeedState, ruleState, signList, issign, tips, integral, currentDay, totalDaysInMonth, dayOfWeek };
|
||||
},
|
||||
});
|
||||
|
||||
|
||||
114
signIn.html
114
signIn.html
@@ -17,41 +17,131 @@
|
||||
<img class="header-bi" src="/img/coin-icon.png">
|
||||
<img class="header-cross" src="/img/cross-icon.png">
|
||||
</div>
|
||||
<div class="signInBox-content">
|
||||
<div class="signInBox-content flexflex">
|
||||
<div class="left-box">
|
||||
<div class="content-header">
|
||||
<div class="content-header-left flexcenter">
|
||||
<div class="content-header flexacenter">
|
||||
<img class="bi-img" src="/img/coin-icon.png">
|
||||
<div class="bi-value">216</div>
|
||||
<div class="bi-value">{{ integral || 0 }}</div>
|
||||
<div class="bi-text">寄托币</div>
|
||||
<div class="bi-rule" bindtap="cutRing">签到规则</div>
|
||||
<div class="bi-rule" @click="cutRing">签到规则</div>
|
||||
<div class="outer-ring" v-if="ruleState">
|
||||
<div class="rule-box flexflex">
|
||||
<div class="rule-header">签到规则</div>
|
||||
<div class="rule-list flexflex">
|
||||
<div class="rule-item flexacenter" v-for="(item, index) in tips" :key="index">
|
||||
<div class="rule-item-icon flexcenter">
|
||||
<img v-if="index == 0" class="rule-item-img" src="https://app.gter.net/image/miniApp/offer/bi.png">
|
||||
<img v-else class="rule-item-img" src="https://app.gter.net/image/miniApp/offer/hardworking-icon.png">
|
||||
</div>
|
||||
<div class="rule-item-text flex1">{{ item }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex1"></div>
|
||||
|
||||
<div class="calendar">
|
||||
|
||||
<div class="rule-close" @click="cutRing">关闭</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="calendar-box flexflex">
|
||||
<div class="sign-in-text flexacenter">
|
||||
本月已签到 <span class="sign-in-value">{{ signnum }}</span> 天，共领 <span class="sign-in-value">{{ signreward }}</span> 寄托币
|
||||
<div class="sign-in-text">
|
||||
本月已签到 <span class="sign-in-value">{{ signnum }}</span> 天，共领 <span class="sign-in-value">{{ signreward }}</span> 寄托币<template v-if="signnum < 25">，次月可获寄托勤务兵勋章</template>
|
||||
</div>
|
||||
<div class="calendar flexflex">
|
||||
<!-- formerly: 已经过去没有签到 already: 签到 today: 今天 没有签到的 -->
|
||||
<div class="calendar-item flexcenter" v-for="(item, index) in dayOfWeek" :key="index"></div>
|
||||
<div class="calendar-item flexcenter {{ calendarClass[item.type] }}" v-for="(item, index) in dateList" :key="index">
|
||||
<div class="calendar-item flexcenter " :class="calendarClass[item.type]" v-for="(item, index) in dateList" :key="index">
|
||||
{{ item.name }}
|
||||
<img class="yellow-tick" src="https://app.gter.net/image/miniApp/offer/yellow-tick.svg">
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="!islogin" class="sign-in-btn flexcenter" bind:tap="postSign">立即签到</div>
|
||||
<div v-if="!islogin" class="sign-in-btn flexcenter" @click="postSign">立即签到</div>
|
||||
<div v-else-if="issign == 1" class="sign-in-btn flexcenter already">今天已签到，明天记得来哦~</div>
|
||||
<div v-else class="sign-in-btn flexcenter" bind:tap="postSign">立即签到</div>
|
||||
<div v-else class="sign-in-btn flexcenter" @click="postSign">立即签到</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="sign-in-box flex1 flexflex">
|
||||
<div class="sign-in-header flexflex">
|
||||
今日已签到
|
||||
<div class="sign-in-header-value">{{ todaycount }}</div>人
|
||||
</div>
|
||||
|
||||
<div class="discuss-list-no flexcenter flex1" v-if="showList.length == 0 && !my.avatar">
|
||||
<img class="empty-icon" src="https://app.gter.net/image/miniApp/offer/empty-icon.png">
|
||||
<div class="discuss-list-no-text">暂无数据</div>
|
||||
</div>
|
||||
|
||||
<div class="sign-in-list">
|
||||
<div class="sign-in-item flexflex" v-if="my.avatar">
|
||||
<div class="sign-in-index">{{ my.rank }}</div>
|
||||
<a :href="`https://f.gter.net/u/${my.uniqid}`" target="_blank">
|
||||
<img class="sign-in-avatar" :src="my.avatar">
|
||||
</a>
|
||||
<div class="sign-in-info flex1 flexacenter">
|
||||
<div class="sign-in-info-left flex1">
|
||||
<a class="sign-in-name flexacenter" :href="`https://f.gter.net/u/${item.uniqid}`" target="_blank">{{ my.nickname }}
|
||||
<div class="sign-in-my flexcenter">我</div>
|
||||
</a>
|
||||
<div class="sign-in-time">{{ my.timestamp || '' }}</div>
|
||||
</div>
|
||||
<div class="sign-in-value flexcenter">+{{ my.reward }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="sign-in-item flexflex" v-for="(item, index) in showList" :key="index">
|
||||
<div class="sign-in-index">{{ item.rank }}</div>
|
||||
<a :href="`https://f.gter.net/u/${item.uniqid}`" target="_blank">
|
||||
<img class="sign-in-avatar" :src="item.avatar">
|
||||
</a>
|
||||
<div class="sign-in-info flex1 flexacenter">
|
||||
<div class="sign-in-info-left flex1">
|
||||
<a class="sign-in-name flexacenter" :href="`https://f.gter.net/u/${item.uniqid}`" target="_blank">{{ item.nickname }}</a>
|
||||
<div class="sign-in-time">{{ item.timestamp || '' }}</div>
|
||||
</div>
|
||||
<div class="sign-in-value flexcenter">+{{ item.reward }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<template v-if="list.length != 0">
|
||||
<div v-if="showList.length == list.length" class="sign-in-finish flexcenter">- End -</div>
|
||||
<div v-else class="sign-in-more flexcenter" @click="moreList">
|
||||
更多
|
||||
<img class="sign-in-more-icon" src="https://app.gter.net/image/miniApp/offer/arrows-circle-black.png">
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 签到成功 -->
|
||||
<div class="succeed-mask flexcenter" v-if="succeedState">
|
||||
<div class="succeed-box flexcenter flexcolumn">
|
||||
<div class="succeed-icon flexflex">
|
||||
<img class="succeed-icon-bj" src="https://app.gter.net/image/miniApp/offer/halo-icon.png">
|
||||
<div class="succeed-icon-header-dot succeed-icon-header-dot-left"></div>
|
||||
<div class="succeed-icon-header-dot succeed-icon-header-dot-right"></div>
|
||||
<div class="succeed-icon-header"></div>
|
||||
<div class="succeed-icon-dot flexflex">
|
||||
<div class="succeed-icon-dot-item" v-for="index in 8" :key="index"></div>
|
||||
</div>
|
||||
<div class="yellow-tick-box flexcenter">
|
||||
<img class="yellow-tick-circle" src="https://app.gter.net/image/miniApp/offer/circle-yellow.svg">
|
||||
<img class="yellow-tick-faint-yellow" src="https://app.gter.net/image/miniApp/offer/tick-faint-yellow.svg">
|
||||
</div>
|
||||
</div>
|
||||
<div class="succeed-award-list flexcolumn flexacenter">
|
||||
<div class="succeed-award-item flexacenter" v-if="reward != 0">
|
||||
<div class="succeed-award-name">随机奖励</div>
|
||||
<div class="succeed-award-value flexcenter">+{{ reward }}</div>
|
||||
</div>
|
||||
<div class="succeed-award-item flexacenter" v-if="extra_reward != 0">
|
||||
<div class="succeed-award-name">额外奖励</div>
|
||||
<div class="succeed-award-value flexcenter">+{{ extra_reward }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="/js/axios.min.js"></script>
|
||||
|
||||
Reference in New Issue
Block a user