优化h5公会

This commit is contained in:
dragon
2024-08-01 14:56:41 +08:00
parent b1a29e48f7
commit db9c260edc
41 changed files with 6921 additions and 1416 deletions

View File

@@ -4,7 +4,7 @@ body {
height: 17.78667rem; height: 17.78667rem;
background: #F5F7F9; background: #F5F7F9;
box-sizing: border-box; box-sizing: border-box;
padding: 0 0.42667rem; padding: 1.73333rem 0rem 0 0;
} }
.back { .back {
@@ -30,91 +30,137 @@ body {
top: 54%; top: 54%;
} }
.nick { input {
margin-top: 2.93333rem; background: none;
outline: none;
bottom: none;
}
h3 {
color: #333333; color: #333333;
font-size: 0.42667rem; font-size: 0.42667rem;
font-weight: 800; margin-bottom: 0.57333rem;
font-weight: 500;
margin-left: 0.42667rem;
text-align: left;
} }
.nick input { .name {
border: none; width: 9.01333rem;
outline: none; height: 1.01333rem;
background: #F5F7F9; line-height: 1.01333rem;
width: 5.4rem;
height: 0.66667rem;
border-radius: 0.66667rem;
box-sizing: border-box;
color: #333;
font-size: 0.42667rem;
box-sizing: border-box;
padding-left: 0.13333rem;
margin-bottom: 0.74667rem;
}
.nick input::placeholder {
color: #515665;
}
.bg {
width: 100%;
height: 2.26667rem;
position: relative; position: relative;
margin: 0 auto 0.85333rem;
background: #fff;
border-radius: 0.09333rem;
} }
.bg span { .name input {
position: absolute;
left: 0;
top: 0;
width: 80%;
height: 100%;
color: #3C3C3C;
font-size: 0.37333rem;
font-weight: 400;
box-sizing: border-box;
padding-left: 0.37333rem;
}
.name span {
position: absolute;
right: 0.50667rem;
top: 0;
height: 100%;
color: #E13B3F;
font-size: 0.37333rem;
font-weight: 400;
}
.name .act {
color: #67D2A6;
}
.background {
position: relative;
width: 6.66667rem;
height: 4rem;
margin-bottom: 0.89333rem;
}
.background img {
display: inline-block; display: inline-block;
color: #333; margin-left: 0.42667rem;
font-size: 0.42667rem; margin-right: 0.22667rem;
line-height: 2.26667rem; width: 4rem;
font-weight: 800; height: 4rem;
border-radius: 0.06667rem;
} }
.bg img { .background span {
width: 2.26667rem; color: #E13B3F;
height: 2.26667rem; font-size: 0.37333rem;
font-weight: 400;
margin-top: 3.65333rem;
display: inline-block;
}
.background input {
position: absolute; position: absolute;
top: 0; right: 1.2rem;
left: 2.53333rem; bottom: -0.2rem;
z-index: 1; width: 0.93333rem;
border-radius: 0.13333rem; height: 0.8rem;
} }
.bg .upload { .background .act {
width: 2.26667rem; color: #67D2A6;
height: 2.26667rem; }
.account {
width: 9.01333rem;
height: 1.01333rem;
line-height: 1.01333rem;
position: relative;
margin: 0 auto 0.85333rem;
background: #fff;
border-radius: 0.09333rem;
}
.account i {
font-style: normal;
color: #3C3C3C;
font-weight: 400;
font-size: 0.37333rem;
height: 100%;
position: absolute; position: absolute;
left: 0.26667rem;
}
.account input {
position: absolute;
left: 2.13333rem;
top: 0; top: 0;
left: 2.53333rem; height: 100%;
z-index: 2; color: #000;
font-size: 0.37333rem;
font-weight: 500;
box-sizing: border-box;
padding-left: 0.46667rem;
width: 60%;
} }
.boxBut { .account span {
width: 7.06667rem; position: absolute;
height: 0.93333rem; right: 0.50667rem;
margin: 1.73333rem auto 0; top: 0;
display: flex; height: 100%;
justify-content: space-between; color: #E13B3F;
font-size: 0.37333rem;
font-weight: 400;
} }
.boxBut .close { .account .act {
width: 2.88rem; color: #67D2A6;
height: 0.93333rem;
line-height: 0.93333rem;
border-radius: 0.93333rem;
text-align: center;
color: #fff;
font-size: 0.42667rem;
background: #CCCBCE;
}
.boxBut .ok {
width: 2.88rem;
height: 0.93333rem;
line-height: 0.93333rem;
border-radius: 0.93333rem;
text-align: center;
color: #fff;
font-size: 0.42667rem;
background: linear-gradient(90deg, #867FFF, #66E3FF);
} }

View File

@@ -8,7 +8,7 @@ body {
height: px2rem(1334); height: px2rem(1334);
background: #F5F7F9; background: #F5F7F9;
box-sizing: border-box; box-sizing: border-box;
padding: 0 px2rem(32); padding: px2rem(130) px2rem(0) 0 0;
} }
.back { .back {
@@ -34,91 +34,138 @@ body {
} }
} }
.nick { input {
margin-top: px2rem(220); background: none;
outline: none;
bottom: none;
}
h3 {
color: #333333; color: #333333;
font-size: px2rem(32); font-size: px2rem(32);
font-weight: 800; margin-bottom: px2rem(43);
font-weight: 500;
margin-left: px2rem(32);
text-align: left;
}
.name {
width: px2rem(676);
height: px2rem(76);
line-height: px2rem(76);
position: relative;
margin: 0 auto px2rem(64);
background: #fff;
border-radius: px2rem(7);
input { input {
border: none; position: absolute;
outline: none; left: 0;
background: #F5F7F9; top: 0;
width: 5.4rem; width: 80%;
height: px2rem(50); height: 100%;
border-radius: px2rem(50); color: #3C3C3C;
font-size: px2rem(28);
font-weight: 400;
box-sizing: border-box; box-sizing: border-box;
color: #333; padding-left: px2rem(28);
font-size: px2rem(32);
box-sizing: border-box;
padding-left: px2rem(10);
margin-bottom: px2rem(56);
&::placeholder {
color: #515665;
}
} }
}
.bg {
width: 100%;
height: px2rem(170);
position: relative;
span { span {
display: inline-block; position: absolute;
color: #333; right: px2rem(38);
font-size: px2rem(32); top: 0;
line-height: px2rem(170); height: 100%;
font-weight: 800; color: #E13B3F;
font-size: px2rem(28);
font-weight: 400;
} }
img { .act {
width: px2rem(170); color: #67D2A6;
height: px2rem(170);
position: absolute;
top: 0;
left: px2rem(190);
z-index: 1;
border-radius: px2rem(10);
}
.upload {
width: px2rem(170);
height: px2rem(170);
position: absolute;
top: 0;
left: px2rem(190);
z-index: 2;
} }
} }
.boxBut { .background {
width: px2rem(530); position: relative;
height: px2rem(70); width: px2rem(500);
margin: px2rem(130) auto 0; height: px2rem(300);
display: flex; margin-bottom: px2rem(67);
justify-content: space-between;
.close { img {
width: px2rem(216); display: inline-block;
height: px2rem(70); margin-left: px2rem(32);
line-height: px2rem(70); margin-right: px2rem(17);
border-radius: px2rem(70); width: px2rem(300);
text-align: center; height: px2rem(300);
color: #fff; border-radius: px2rem(5);
font-size: px2rem(32);
background: #CCCBCE;
} }
.ok { span {
width: px2rem(216); color: #E13B3F;
height: px2rem(70); font-size: px2rem(28);
line-height: px2rem(70); font-weight: 400;
border-radius: px2rem(70); margin-top: px2rem(274);
text-align: center; display: inline-block;
color: #fff;
font-size: px2rem(32); }
background: linear-gradient(90deg, #867FFF, #66E3FF);
input {
position: absolute;
right: 1.2rem;
bottom: -0.2rem;
width: px2rem(70);
height: px2rem(60);
}
.act {
color: #67D2A6;
}
}
.account {
width: px2rem(676);
height: px2rem(76);
line-height: px2rem(76);
position: relative;
margin: 0 auto px2rem(64);
background: #fff;
border-radius: px2rem(7);
i {
font-style: normal;
color: #3C3C3C;
font-weight: 400;
font-size: px2rem(28);
height: 100%;
position: absolute;
left: px2rem(20);
}
input {
position: absolute;
left: px2rem(160);
top: 0;
height: 100%;
color: #000;
font-size: px2rem(28);
font-weight: 500;
box-sizing: border-box;
padding-left: px2rem(35);
width: 60%;
}
span {
position: absolute;
right: px2rem(38);
top: 0;
height: 100%;
color: #E13B3F;
font-size: px2rem(28);
font-weight: 400;
}
.act {
color: #67D2A6;
} }
} }

View File

@@ -94,86 +94,6 @@ body {
top: 5.64rem; top: 5.64rem;
} }
.header .adminSet {
padding: 0rem 0.21333rem;
box-sizing: border-box;
height: 0.58667rem;
line-height: 0.58667rem;
color: #fff;
font-size: 0.42667rem;
font-weight: 400;
background: linear-gradient(90deg, rgba(82, 59, 85, 0.98), rgba(21, 5, 16, 0.98));
border-radius: 0.58667rem 0px 0px 0.58667rem;
position: absolute;
right: 0;
top: 2.45333rem;
display: none;
}
.header .guildInfoSet {
padding: 0rem 0.21333rem;
box-sizing: border-box;
height: 0.58667rem;
line-height: 0.58667rem;
color: #fff;
font-size: 0.42667rem;
font-weight: 400;
background: linear-gradient(90deg, rgba(82, 59, 85, 0.7), rgba(21, 5, 16, 0.7));
border-radius: 0.58667rem 0px 0px 0.58667rem;
position: absolute;
right: 0;
top: 3.18667rem;
display: none;
}
.header .memberFlow {
width: 2.77333rem;
height: 0.74667rem;
line-height: 0.74667rem;
text-align: center;
color: #fff;
font-size: 0.42667rem;
font-weight: 400;
background: linear-gradient(90deg, rgba(128, 146, 255, 0.6) 0%, rgba(108, 208, 255, 0.6) 100%);
border-radius: 0.18667rem;
position: absolute;
left: 2.08rem;
top: 6.21333rem;
display: none;
}
.header .memberFlowMy {
width: 2.77333rem;
height: 0.74667rem;
line-height: 0.74667rem;
text-align: center;
color: #fff;
font-size: 0.42667rem;
font-weight: 400;
background: linear-gradient(90deg, rgba(128, 146, 255, 0.6) 0%, rgba(108, 208, 255, 0.6) 100%);
border-radius: 0.18667rem 0 0 0.18667rem;
position: absolute;
right: 0rem;
top: 2.90667rem;
display: none;
}
.header .inveMember {
width: 2.77333rem;
height: 0.74667rem;
line-height: 0.74667rem;
text-align: center;
color: #fff;
font-size: 0.42667rem;
font-weight: 400;
background: linear-gradient(90deg, rgba(128, 146, 255, 0.6) 0%, rgba(108, 208, 255, 0.6) 100%);
border-radius: 0.18667rem;
position: absolute;
right: 2.08rem;
top: 6.21333rem;
display: none;
}
.header .guildNick { .header .guildNick {
width: 100%; width: 100%;
position: absolute; position: absolute;
@@ -186,11 +106,50 @@ body {
display: none; display: none;
} }
.header .headerBox {
width: 8.86667rem;
display: flex;
justify-content: center;
flex-wrap: wrap;
position: absolute;
top: 6.37333rem;
left: 50%;
transform: translateX(-50%);
}
.header .headerBox div {
width: 3.62667rem;
height: 0.74667rem;
line-height: 0.74667rem;
color: #fff;
font-size: 0.34667rem;
text-align: center;
background: linear-gradient(90deg, rgba(128, 146, 255, 0.8) 0%, rgba(108, 208, 255, 0.8) 100%);
border-radius: 0.18667rem;
margin-bottom: 0.33333rem;
overflow: hidden;
white-space: nowrap;
margin: 0 auto 0.33333rem;
}
.header .headerBox div img {
width: 0.42667rem;
height: 0.42667rem;
margin-right: 0.17333rem;
float: left;
margin-top: 0.16rem;
margin-left: 0.38667rem;
}
.header .headerBox div span {
float: left;
}
.guildList { .guildList {
width: 9.25333rem; width: 9.25333rem;
height: 13.33333rem; height: 11rem;
border-radius: 0.26667rem; border-radius: 0.26667rem;
margin: -1.66667rem auto 0rem; margin: -0.3rem auto 0rem;
position: relative; position: relative;
background: #fff; background: #fff;
overflow: hidden; overflow: hidden;
@@ -260,7 +219,7 @@ body {
.guildList ul { .guildList ul {
width: 100%; width: 100%;
height: 11.8rem; height: 11rem;
margin: 0.52rem auto 0; margin: 0.52rem auto 0;
overflow-y: scroll; overflow-y: scroll;
} }
@@ -334,7 +293,7 @@ body {
.guildList ul li .but { .guildList ul li .but {
width: 1.17333rem; width: 1.17333rem;
height: 0.56rem; height: 0.56rem;
background: #7F95FF; background: #62D0A8;
border-radius: 0.56rem; border-radius: 0.56rem;
position: absolute; position: absolute;
right: 0.34667rem; right: 0.34667rem;
@@ -342,7 +301,7 @@ body {
text-align: center; text-align: center;
color: #fff; color: #fff;
line-height: 0.56rem; line-height: 0.56rem;
font-size: 0.34667rem; font-size: 0.29333rem;
font-weight: 400; font-weight: 400;
} }
@@ -434,3 +393,92 @@ body {
background: linear-gradient(90deg, #53C7D4, #7C5EFD); background: linear-gradient(90deg, #53C7D4, #7C5EFD);
color: #fff; color: #fff;
} }
.inveMember {
width: 4.08rem;
height: 1.28rem;
border-radius: 1.28rem;
line-height: 1.22667rem;
text-align: center;
background: linear-gradient(90deg, #7CDD9B, #62D0A8);
color: #fff;
font-size: 0.45333rem;
position: fixed;
left: 50%;
transform: translateX(-50%);
z-index: 5;
bottom: 1.06667rem;
}
.inveMember img {
display: inline-block;
width: 0.50667rem;
height: 0.56rem;
vertical-align: middle;
margin-top: -0.1rem;
}
.inveMember span {
display: inline-block;
vertical-align: middle;
}
.arabic .guildList .top img {
right: 0.4rem;
}
.arabic .guildList .top input {
padding-right: 0.5rem;
}
.arabic .guildList ul li .but {
left: 0.34667rem;
right: auto;
}
.arabic .guildList ul li .chairman,
.arabic .guildList ul li .administrator {
right: 0.1rem;
left: auto;
}
.arabic .guildList ul li .tx,
.arabic .guildList ul li .user {
float: right;
}
.arabic .guildList ul li .user {
padding-right: 0.2rem;
}
.arabic .header .headerBox div img {
float: right;
}
.arabic .header .headerBox div span {
float: right;
}
.english .header .headerBox {
width: 8rem;
}
.english .header .headerBox div {
width: 3.9rem;
}
.english .header .headerBox div span {
font-size: 0.21333rem;
}
.arabic .header .headerBox {
width: 8rem;
}
.arabic .header .headerBox div {
width: 3.9rem;
}
.arabic .header .headerBox div span {
font-size: 0.29333rem;
}

View File

@@ -98,85 +98,85 @@ body {
top: px2rem(423); top: px2rem(423);
} }
.adminSet { // .adminSet {
padding: px2rem(0) px2rem(16); // padding: px2rem(0) px2rem(16);
box-sizing: border-box; // box-sizing: border-box;
height: px2rem(44); // height: px2rem(44);
line-height: px2rem(44); // line-height: px2rem(44);
color: #fff; // color: #fff;
font-size: px2rem(32); // font-size: px2rem(32);
font-weight: 400; // font-weight: 400;
background: linear-gradient(90deg, rgba(82, 59, 85, 0.98), rgba(21, 5, 16, 0.98)); // background: linear-gradient(90deg, rgba(82, 59, 85, 0.98), rgba(21, 5, 16, 0.98));
border-radius: px2rem(44) 0px 0px px2rem(44); // border-radius: px2rem(44) 0px 0px px2rem(44);
position: absolute; // position: absolute;
right: 0; // right: 0;
top: px2rem(184); // top: px2rem(184);
display: none; // display: none;
} // }
.guildInfoSet { // .guildInfoSet {
padding: px2rem(0) px2rem(16); // padding: px2rem(0) px2rem(16);
box-sizing: border-box; // box-sizing: border-box;
height: px2rem(44); // height: px2rem(44);
line-height: px2rem(44); // line-height: px2rem(44);
color: #fff; // color: #fff;
font-size: px2rem(32); // font-size: px2rem(32);
font-weight: 400; // font-weight: 400;
background: linear-gradient(90deg, rgba(82, 59, 85, 0.7), rgba(21, 5, 16, 0.7)); // background: linear-gradient(90deg, rgba(82, 59, 85, 0.7), rgba(21, 5, 16, 0.7));
border-radius: px2rem(44) 0px 0px px2rem(44); // border-radius: px2rem(44) 0px 0px px2rem(44);
position: absolute; // position: absolute;
right: 0; // right: 0;
top: px2rem(239); // top: px2rem(239);
display: none; // display: none;
} // }
.memberFlow { // .memberFlow {
width: px2rem(208); // width: px2rem(208);
height: px2rem(56); // height: px2rem(56);
line-height: px2rem(56); // line-height: px2rem(56);
text-align: center; // text-align: center;
color: #fff; // color: #fff;
font-size: px2rem(32); // font-size: px2rem(32);
font-weight: 400; // font-weight: 400;
background: linear-gradient(90deg, rgba(128, 146, 255, .6) 0%, rgba(108, 208, 255, .6) 100%); // background: linear-gradient(90deg, rgba(128, 146, 255, .6) 0%, rgba(108, 208, 255, .6) 100%);
border-radius: px2rem(14); // border-radius: px2rem(14);
position: absolute; // position: absolute;
left: px2rem(156); // left: px2rem(156);
top: px2rem(466); // top: px2rem(466);
display: none; // display: none;
} // }
.memberFlowMy { // .memberFlowMy {
width: px2rem(208); // width: px2rem(208);
height: px2rem(56); // height: px2rem(56);
line-height: px2rem(56); // line-height: px2rem(56);
text-align: center; // text-align: center;
color: #fff; // color: #fff;
font-size: px2rem(32); // font-size: px2rem(32);
font-weight: 400; // font-weight: 400;
background: linear-gradient(90deg, rgba(128, 146, 255, .6) 0%, rgba(108, 208, 255, .6) 100%); // background: linear-gradient(90deg, rgba(128, 146, 255, .6) 0%, rgba(108, 208, 255, .6) 100%);
border-radius: px2rem(14) 0 0 px2rem(14); // border-radius: px2rem(14) 0 0 px2rem(14);
position: absolute; // position: absolute;
right: px2rem(0); // right: px2rem(0);
top: px2rem(218); // top: px2rem(218);
display: none; // display: none;
} // }
.inveMember { // .inveMember {
width: px2rem(208); // width: px2rem(208);
height: px2rem(56); // height: px2rem(56);
line-height: px2rem(56); // line-height: px2rem(56);
text-align: center; // text-align: center;
color: #fff; // color: #fff;
font-size: px2rem(32); // font-size: px2rem(32);
font-weight: 400; // font-weight: 400;
background: linear-gradient(90deg, rgba(128, 146, 255, .6) 0%, rgba(108, 208, 255, .6) 100%); // background: linear-gradient(90deg, rgba(128, 146, 255, .6) 0%, rgba(108, 208, 255, .6) 100%);
border-radius: px2rem(14); // border-radius: px2rem(14);
position: absolute; // position: absolute;
right: px2rem(156); // right: px2rem(156);
top: px2rem(466); // top: px2rem(466);
display: none; // display: none;
} // }
.guildNick { .guildNick {
width: 100%; width: 100%;
@@ -189,13 +189,53 @@ body {
text-align: center; text-align: center;
display: none; display: none;
} }
.headerBox {
width: px2rem(665);
display: flex;
justify-content: center;
flex-wrap: wrap;
position: absolute;
top: px2rem(478);
// left: px2rem(93);
left: 50%;
transform: translateX(-50%);
div {
width: px2rem(272);
height: px2rem(56);
line-height: px2rem(56);
color: #fff;
font-size: px2rem(26);
text-align: center;
background: linear-gradient(90deg, rgba(128, 146, 255, .8) 0%, rgba(108, 208, 255, .8) 100%);
border-radius: px2rem(14);
margin-bottom: px2rem(25);
overflow: hidden;
white-space: nowrap;
margin: 0 auto px2rem(25);
img {
width: px2rem(32);
height: px2rem(32);
margin-right: px2rem(13);
float: left;
margin-top: px2rem(12);
margin-left: px2rem(29);
}
span {
float: left;
}
}
}
} }
.guildList { .guildList {
width: px2rem(694); width: px2rem(694);
height: px2rem(1000); height: 11rem;
border-radius: px2rem(20); border-radius: px2rem(20);
margin: px2rem(-125) auto px2rem(0); margin: -0.3rem auto px2rem(0);
position: relative; position: relative;
background: #fff; background: #fff;
overflow: hidden; overflow: hidden;
@@ -265,7 +305,7 @@ body {
ul { ul {
width: 100%; width: 100%;
height: 11.8rem; height: 11rem;
margin: px2rem(39) auto 0; margin: px2rem(39) auto 0;
overflow-y: scroll; overflow-y: scroll;
@@ -337,7 +377,7 @@ body {
.but { .but {
width: px2rem(88); width: px2rem(88);
height: px2rem(42); height: px2rem(42);
background: #7F95FF; background: #62D0A8;
border-radius: px2rem(42); border-radius: px2rem(42);
position: absolute; position: absolute;
right: px2rem(26); right: px2rem(26);
@@ -345,7 +385,7 @@ body {
text-align: center; text-align: center;
color: #fff; color: #fff;
line-height: px2rem(42); line-height: px2rem(42);
font-size: px2rem(26); font-size: px2rem(22);
font-weight: 400; font-weight: 400;
} }
@@ -439,4 +479,100 @@ body {
} }
} }
} }
}
.inveMember {
width: px2rem(306);
height: px2rem(96);
border-radius: px2rem(96);
line-height: px2rem(92);
text-align: center;
background: linear-gradient(90deg, #7CDD9B, #62D0A8);
color: #fff;
font-size: px2rem(34);
position: fixed;
left: 50%;
transform: translateX(-50%);
z-index: 5;
bottom: px2rem(80);
img {
display: inline-block;
width: px2rem(38);
height: px2rem(42);
vertical-align: middle;
margin-top: -0.1rem;
}
span {
display: inline-block;
vertical-align: middle;
}
}
.arabic {
.guildList .top img {
right: px2rem(30);
}
.guildList .top input {
padding-right: 0.5rem;
}
.guildList ul li .but {
left: 0.34667rem;
right: auto;
}
.guildList ul li .chairman,
.guildList ul li .administrator {
right: 0.1rem;
left: auto;
}
.guildList ul li .tx,
.guildList ul li .user {
float: right;
}
.guildList ul li .user {
padding-right: 0.2rem;
}
.header .headerBox div img {
float: right;
}
.header .headerBox div span {
float: right;
}
}
.english {
.header .headerBox {
width: 8rem;
div {
width: 3.9rem;
span {
font-size: px2rem(16);
}
}
}
}
.arabic {
.header .headerBox {
width: 8rem;
div {
width: 3.9rem;
span {
font-size: px2rem(22);
}
}
}
} }

View File

@@ -0,0 +1,9 @@
/**
*
* 移动端底部抽屉选择器
* @author yyq
* @CSDN 慕云枫
* @date 2023-12-07
* @version 1.5
*/
ul,li{margin:0;padding:0}.lay-picker{position:fixed;left:0;top:0;width:100%;height:100%;z-index:99999999999999;display:none;overflow:hidden}.lay-picker-shade{position:absolute;left:0;top:0;width:100%;height:100%;background:rgba(0,0,0,.4);z-index:9}.lay-picker-container{position:absolute;left:0;bottom:0;z-index:99;width:100%;background:#fff;color:#333;font-size:17px;-webkit-transition:transform .25s;-webkit-transform:translate3d(0,100%,0);transition:transform .25s;transform:translate3d(0,100%,0)}.lay-picker-header{height:50px;line-height:50px;border-bottom:1px solid #f3f3f3;margin-bottom:1px;margin:0 15px}.lay-picker-title{text-align:center;position:absolute;top:0;left:0;z-index:9;width:100%;color:#333}.lay-picker-search{margin:0 15px;text-align:center;padding:5px 0}.lay-picker-search input{text-align:center;height:40px;line-height:40px;border:0;border-bottom:1px solid #f3f3f3;transition:all .2s;-webkit-transition:all .2s;box-shadow:none !important;font-size:14px}.lay-picker-search input:hover,.lay-picker-search input:focus{border:none !important;border-bottom:1px solid #e5e5e5 !important}.lay-picker-btn{position:relative;z-index:99}.lay-picker-cancel{color:#333}.lay-picker-confirm{float:right;color:#228fff}.lay-picker-shadowup,.lay-picker-shadowdown{height:120px;width:100%;position:absolute;left:0;z-index:50}.lay-picker-shadowup{height:115px;top:-1px;background:-webkit-linear-gradient(to bottom,#FFF,rgba(255,255,255,.6));background:linear-gradient(to bottom,#FFF,rgba(255,255,255,.6));pointer-events:none;border-bottom:1px solid #efefef}.lay-picker-shadowdown{height:130px;bottom:0;background:-webkit-linear-gradient(to top,#FFF,rgba(255,255,255,.6));background:linear-gradient(to top,#FFF,rgba(255,255,255,.6));pointer-events:none;border-top:1px solid #efefef}.lay-picker-content{position:relative;height:300px;margin:15px;overflow:hidden}.lay-picker-box{overflow:hidden}.lay-picker-box:after{display:table;height:0;clear:both;content:''}.lay-picker-list-wrap{float:left;height:300px;overflow:hidden;-webkit-transition:width .2s;transition:width .2s}.lay-picker-list-wrap ul{position:relative;padding:100px 0;margin-top:17px;-webkit-transition:transform .1s ease-out;transition:transform .1s ease-out}.lay-picker-list-wrap ul:after{position:absolute;top:0;left:0;right:0;bottom:0;z-index:55;content:''}.lay-picker-list-wrap li{line-height:50px;height:50px;text-align:center;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.lay-picker-bottom{text-align:center;margin-top:10px;margin-bottom:30px;font-size:16px}.lay-picker-bottom-btn{border-radius:6px;display:inline-block;width:30%;height:40px;line-height:40px}.lay-picker-bottom-btn-cancel{color:#333;background:#efefef;margin-right:3%}.lay-picker-bottom-btn-confirm{color:#fff;background:#33c119}

View File

@@ -38,6 +38,8 @@ body {
color: #333333; color: #333333;
font-size: 0.45333rem; font-size: 0.45333rem;
font-weight: bold; font-weight: bold;
width: 100%;
text-align: center;
} }
.back .text { .back .text {
@@ -50,207 +52,292 @@ body {
font-size: 0.4rem; font-size: 0.4rem;
} }
.timeBox { .header {
width: 9.46667rem; width: 9.46667rem;
height: 2.54667rem; height: 4.18667rem;
background: #fff; background: #fff;
border-radius: 0.4rem; border-radius: 0.4rem;
margin: 2.53333rem auto 0.25333rem; margin: 2.8rem auto 0.34667rem;
position: relative;
}
.timeBox .line {
width: 0.02667rem;
height: 1.90667rem;
background: #D7DCE6;
position: absolute;
left: 2.92rem;
top: 50%;
transform: translateY(-50%);
border-radius: 0.02667rem;
}
.timeBox .year {
width: 2.92rem;
position: absolute;
left: 0;
top: 0.33333rem;
color: #A4ABB2;
font-size: 0.32rem;
font-weight: bold;
text-align: center;
text-indent: -0.8rem;
}
.timeBox .startTime {
width: 2.92rem;
position: absolute;
left: 0;
top: 0.96rem;
color: #848D9C;
font-size: 0.37333rem;
font-weight: bold;
}
.timeBox .startTime b {
margin-right: 0.1rem;
text-indent: 0.45rem;
display: inline-block;
}
.timeBox .startTime img {
width: 0.32rem;
height: 0.21333rem;
display: inline-block;
margin-top: 0.1rem;
}
.timeBox .endTime {
width: 2.92rem;
position: absolute;
left: 0;
top: 1.62667rem;
color: #848D9C;
font-size: 0.37333rem;
font-weight: bold;
}
.timeBox .endTime b {
margin-right: 0.1rem;
text-indent: 0.45rem;
display: inline-block;
}
.timeBox .endTime img {
width: 0.32rem;
height: 0.21333rem;
display: inline-block;
margin-top: 0.1rem;
}
.timeBox .right {
width: 5.5rem;
height: 2.54667rem;
position: absolute;
right: 0.55rem;
top: 0;
display: flex;
justify-content: space-between;
}
.timeBox .right div {
width: 50%;
text-align: center;
overflow: hidden; overflow: hidden;
} }
.timeBox .right div p { .header .time {
color: #A4ABB2; width: 100%;
font-size: 0.32rem; height: 0.53333rem;
font-weight: bold; line-height: 0.53333rem;
margin-top: 0.53333rem;
margin-bottom: 0.33333rem;
line-height: 0.34rem;
}
.timeBox .right div b {
color: #848D9C;
font-size: 0.37333rem;
font-weight: bold;
}
.list {
width: 9.46667rem;
height: 12.8rem;
background: #fff;
border-radius: 0.4rem;
margin: 0.25333rem auto 0.13333rem;
overflow-y: scroll;
position: relative;
padding-top: 1.45rem;
box-sizing: border-box;
}
.list::-webkit-scrollbar {
display: none;
}
.list .top {
height: 1.5rem;
width: 9.46667rem;
box-sizing: border-box;
padding: 0.53333rem 0.26667rem 0;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
line-height: 0.4rem; box-sizing: border-box;
margin: 0.38667rem auto 0.76rem;
text-align: center;
padding: 0 0.53333rem;
color: #848D9C;
font-size: 0.4rem;
font-weight: 500;
}
.header .time div {
width: 3.06667rem;
}
.header .time div b {
display: inline-block;
vertical-align: middle;
}
.header .time div img {
width: 0.32rem;
height: 0.21333rem;
display: inline-block;
vertical-align: middle;
margin-left: 0.13333rem;
}
.header .time span {
display: block;
width: 0.53333rem;
height: 0.05333rem;
background: #848D9C;
margin-top: 0.25rem;
}
.header h3 {
width: 100%;
box-sizing: border-box;
padding-left: 0.65333rem;
color: #141515;
font-size: 0.45333rem;
font-weight: 500;
margin-bottom: 0.72rem;
}
.header p {
height: 0.53333rem;
line-height: 0.53333rem;
width: 100%;
text-align: center;
color: #232424;
font-size: 0.69333rem;
font-weight: 500;
}
.header p img {
display: inline-block;
width: 0.53333rem;
height: 0.53333rem;
}
.box {
width: 9.46667rem;
min-height: 10.66667rem;
background: #fff;
border-radius: 0.4rem;
margin: 0 auto 0.4rem;
box-sizing: border-box;
padding: 0.49333rem 0rem 0 0.30667rem;
}
.box h3 {
color: #141515;
font-size: 0.45333rem;
font-weight: 600;
margin: 0;
margin-left: 0.26667rem;
margin-bottom: 0.50667rem;
}
.box h3 span {
display: inline-block;
width: 0.06667rem;
height: 0.37333rem;
margin-left: -0.17333rem;
background: #62D0A8;
margin-right: 0.13333rem;
}
.box .box_in {
width: 100%;
height: 100%;
display: flex;
}
.box .box_in .fistBox {
width: 2.4rem;
float: left;
}
.box .box_in .fistBox .fist {
width: 2.26667rem;
height: 2.01333rem;
margin-right: 0.4rem;
}
.box .box_in .fistBox .fist .title {
color: #666666;
width: 100%;
text-align: center;
font-size: 0.37333rem;
margin-bottom: 0.30667rem;
white-space: nowrap;
}
.box .box_in .fistBox .fist .user {
position: relative;
}
.box .box_in .fistBox .fist .ts {
width: 0.42667rem;
height: 0.42667rem;
border-radius: 50%;
position: absolute; position: absolute;
left: 50%; left: 50%;
transform: translateX(-50%); transform: translateX(-50%);
top: 0rem; top: 0rem;
background: #fff; z-index: 2;
border-radius: 0.4rem 0.4rem 0 0; display: none;
} }
.list .top div { .box .box_in .fistBox .fist .ts i {
width: 25%; width: 100%;
border-radius: 0.16rem;
height: 0.16rem;
line-height: 0.16rem;
position: absolute;
bottom: 0;
left: 50%;
transform: translateX(-50%);
text-align: center; text-align: center;
color: #5D95FF; background: linear-gradient(90deg, #FFEB67, #FFFCE7);
font-size: 0.29333rem; color: #333333;
font-weight: 600; font-size: 0.16rem;
font-weight: 400;
font-style: normal;
} }
.list .other { .box .box_in .fistBox .fist .i {
width: 8.76rem; display: block;
height: 2.01333rem; }
margin: 0 auto 0;
border-bottom: 0.02667rem solid #D7DCE6; .box .box_in .fistBox .fist img {
display: flex;
justify-content: space-between;
}
.list .other:last-child {
border: none;
}
.list .other div {
width: 25%;
text-align: center;
height: 100%;
line-height: 2.01333rem;
color: #848D9C;
font-size: 0.32rem;
font-weight: 500;
white-space: nowrap;
}
.list .other div img {
display: block; display: block;
margin: 0.45333rem auto 0.06667rem;
width: 0.42667rem; width: 0.42667rem;
height: 0.42667rem; height: 0.42667rem;
border-radius: 50%; border-radius: 50%;
margin: 0 auto 0.06667rem;
} }
.list .other div p { .box .box_in .fistBox .fist p {
width: 98%; width: 100%;
height: 0.33333rem; text-align: center;
line-height: 0.32rem;
overflow: hidden; overflow: hidden;
white-space: nowrap; white-space: nowrap;
text-overflow: ellipsis; text-overflow: ellipsis;
color: #848D9C;
font-size: 0.32rem;
font-weight: 500;
margin-bottom: 0.06667rem;
}
.box .box_in .fistBox .fist b {
color: #A4ABB2;
font-size: 0.24rem;
font-weight: 500;
text-align: center;
display: block;
width: 100%;
}
.box .box_in .ordinaryBox {
height: 100%;
overflow-x: scroll;
}
.box .box_in .ordinaryBox .ordinaryBox_in {
width: 8rem;
height: 100%;
}
.box .box_in .ordinaryBox .ordinaryBox_in .ordinary {
width: 2.26667rem;
height: 2.01333rem;
float: left;
margin-right: 0.4rem;
}
.box .box_in .ordinaryBox .ordinaryBox_in .ordinary .title {
color: #666666;
width: 100%;
text-align: center;
font-size: 0.37333rem;
margin-bottom: 0.30667rem;
white-space: nowrap;
}
.box .box_in .ordinaryBox .ordinaryBox_in .ordinary p {
width: 100%;
text-align: center; text-align: center;
color: #848D9C; color: #848D9C;
font-size: 0.32rem; font-size: 0.32rem;
margin-bottom: 0.12rem; font-weight: 500;
line-height: 1.2rem;
white-space: nowrap;
} }
.list .other div .id { .box .box_in .ordinaryBox .ordinaryBox_in .ordinary .true {
width: 100%; color: #4EA686;
text-align: center;
color: #A4ABB2;
font-size: 0.24rem;
} }
.list .other .div11 { .box .box_in .ordinaryBox .ordinaryBox_in .ordinary .false {
line-height: 0rem; color: #DC865D;
}
.box .box_in .fistBox .fistAct .title {
opacity: 0;
}
.box .box_in .ordinaryBox_inAct .ordinary .title {
opacity: 0;
margin-bottom: -0.26667rem;
}
.english .box .box_in .ordinaryBox .ordinaryBox_in {
width: 11.6rem;
}
.english .box .box_in .ordinaryBox .ordinaryBox_in .ordinary {
width: 3.2rem;
}
.english .box .box_in .ordinaryBox .ordinaryBox_in .ordinary .title {
font-size: 0.30667rem;
}
.arabic .box .box_in .fistBox .fist {
margin-right: 0;
margin-left: 0.4rem;
}
.arabic .box .box_in .ordinaryBox .ordinaryBox_in {
width: 10rem;
}
.arabic .box .box_in .ordinaryBox .ordinaryBox_in .ordinary {
width: 2.8rem;
}
.arabic .header h3 {
margin-right: 0.3rem;
}
.arabic .box h3 span {
margin-right: 0.3rem;
margin-left: 0;
}
.arabic .box h3 b {
margin-right: 0.3rem;
}
.arabic .box .box_in .ordinaryBox .ordinaryBox_in .ordinary {
float: right;
} }

View File

@@ -41,6 +41,8 @@ body {
color: #333333; color: #333333;
font-size: px2rem(34); font-size: px2rem(34);
font-weight: bold; font-weight: bold;
width: 100%;
text-align: center;
} }
.text { .text {
@@ -54,211 +56,310 @@ body {
} }
} }
.timeBox { .header {
width: px2rem(710); width: px2rem(710);
height: px2rem(191); height: px2rem(314);
background: #fff; background: #fff;
border-radius: px2rem(30); border-radius: px2rem(30);
margin: px2rem(190) auto px2rem(19); margin: px2rem(210) auto px2rem(26);
position: relative; overflow: hidden;
.line { .time {
width: px2rem(2); width: 100%;
height: px2rem(143); height: px2rem(40);
background: #D7DCE6; line-height: px2rem(40);
position: absolute;
left: px2rem(219);
top: 50%;
transform: translateY(-50%);
border-radius: px2rem(2);
}
.year {
width: px2rem(219);
position: absolute;
left: 0;
top: px2rem(25);
color: #A4ABB2;
font-size: px2rem(24);
font-weight: bold;
text-align: center;
text-indent: -0.8rem;
}
.startTime {
width: px2rem(219);
position: absolute;
left: 0;
top: px2rem(72);
color: #848D9C;
font-size: px2rem(28);
font-weight: bold;
// text-align: center;
b {
margin-right: 0.1rem;
text-indent: 0.45rem;
display: inline-block;
}
img {
width: px2rem(24);
height: px2rem(16);
display: inline-block;
margin-top: 0.1rem;
}
}
.endTime {
width: px2rem(219);
position: absolute;
left: 0;
top: px2rem(122);
color: #848D9C;
font-size: px2rem(28);
font-weight: bold;
// text-align: center;
b {
margin-right: 0.1rem;
text-indent: 0.45rem;
display: inline-block;
}
img {
width: px2rem(24);
height: px2rem(16);
display: inline-block;
margin-top: 0.1rem;
}
}
.right {
width: 5.5rem;
height: px2rem(191);
position: absolute;
right: 0.55rem;
top: 0;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
box-sizing: border-box;
margin: px2rem(29) auto px2rem(57);
text-align: center;
padding: 0 px2rem(40);
color: #848D9C;
font-size: px2rem(30);
font-weight: 500;
div { div {
width: 50%; width: px2rem(230);
text-align: center;
overflow: hidden;
p {
color: #A4ABB2;
font-size: px2rem(24);
font-weight: bold;
margin-top: px2rem(40);
margin-bottom: px2rem(25);
line-height: 0.34rem;
}
b { b {
color: #848D9C; display: inline-block;
font-size: px2rem(28); vertical-align: middle;
font-weight: bold; }
img {
width: px2rem(24);
height: px2rem(16);
display: inline-block;
vertical-align: middle;
margin-left: px2rem(10);
}
}
span {
display: block;
width: px2rem(40);
height: px2rem(4);
background: #848D9C;
margin-top: 0.25rem;
}
}
h3 {
width: 100%;
box-sizing: border-box;
padding-left: px2rem(49);
color: #141515;
font-size: px2rem(34);
font-weight: 500;
margin-bottom: px2rem(54);
}
p {
height: px2rem(40);
line-height: px2rem(40);
width: 100%;
text-align: center;
color: #232424;
font-size: px2rem(52);
font-weight: 500;
img {
display: inline-block;
width: px2rem(40);
height: px2rem(40);
}
}
}
.box {
width: px2rem(710);
min-height: px2rem(800);
background: #fff;
border-radius: px2rem(30);
margin: 0 auto px2rem(30);
box-sizing: border-box;
padding: px2rem(37) px2rem(0) 0 px2rem(23);
h3 {
color: #141515;
font-size: px2rem(34);
font-weight: 600;
margin: 0;
margin-left: px2rem(20);
margin-bottom: px2rem(38);
span {
display: inline-block;
width: px2rem(5);
height: px2rem(28);
margin-left: px2rem(-13);
background: #62D0A8;
margin-right: px2rem(10);
}
}
.box_in {
width: 100%;
height: 100%;
display: flex;
.fistBox {
width: px2rem(180);
float: left;
.fist {
width: px2rem(170);
height: px2rem(151);
margin-right: px2rem(30);
.title {
color: #666666;
width: 100%;
text-align: center;
font-size: px2rem(28);
margin-bottom: px2rem(23);
white-space: nowrap;
}
.user {
position: relative;
}
.ts {
width: px2rem(32);
height: px2rem(32);
border-radius: 50%;
position: absolute;
left: 50%;
transform: translateX(-50%);
top: px2rem(0);
z-index: 2;
display: none;
i {
width: 100%;
border-radius: px2rem(12);
height: px2rem(12);
line-height: px2rem(12);
position: absolute;
bottom: 0;
left: 50%;
transform: translateX(-50%);
text-align: center;
background: linear-gradient(90deg, #FFEB67, #FFFCE7);
color: #333333;
font-size: px2rem(12);
font-weight: 400;
font-style: normal;
}
}
.i {
display: block;
}
img {
display: block;
width: px2rem(32);
height: px2rem(32);
border-radius: 50%;
margin: 0 auto px2rem(5);
}
p {
width: 100%;
text-align: center;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
color: #848D9C;
font-size: px2rem(24);
font-weight: 500;
margin-bottom: px2rem(5);
}
b {
color: #A4ABB2;
font-size: px2rem(18);
font-weight: 500;
text-align: center;
display: block;
width: 100%;
}
}
}
.ordinaryBox {
height: 100%;
overflow-x: scroll;
&::-webkit-scrollbar {
// display: none;
}
.ordinaryBox_in {
width: 8rem;
height: 100%;
.ordinary {
width: px2rem(170);
height: px2rem(151);
float: left;
margin-right: px2rem(30);
.title {
color: #666666;
width: 100%;
text-align: center;
font-size: px2rem(28);
margin-bottom: px2rem(23);
white-space: nowrap;
}
p {
width: 100%;
text-align: center;
color: #848D9C;
font-size: px2rem(24);
font-weight: 500;
line-height: px2rem(90);
white-space: nowrap;
}
.true {
color: #4EA686;
}
.false {
color: #DC865D;
}
}
}
}
.fistBox .fistAct {
.title {
opacity: 0;
}
}
.ordinaryBox_inAct .ordinary {
.title {
opacity: 0;
margin-bottom: px2rem(-20);
} }
} }
} }
} }
.list { .english {
width: px2rem(710); .box .box_in .ordinaryBox .ordinaryBox_in {
height: px2rem(960); width: 11.6rem;
background: #fff;
border-radius: px2rem(30);
margin: px2rem(19) auto px2rem(10);
overflow-y: scroll;
position: relative;
padding-top: 1.45rem;
box-sizing: border-box;
&::-webkit-scrollbar { .ordinary {
display: none; width: 3.2rem;
.title {
font-size: px2rem(23);
}
}
}
}
.arabic {
.box .box_in .fistBox .fist {
margin-right: 0;
margin-left: 0.4rem;
} }
.top { .box .box_in .ordinaryBox {
height: 1.5rem; .ordinaryBox_in {
width: px2rem(710); width: 10rem;
box-sizing: border-box;
padding: px2rem(40) px2rem(20) 0;
display: flex;
justify-content: space-between;
line-height: 0.4rem;
position: absolute;
left: 50%;
transform: translateX(-50%);
// top: 5.3rem;
top: 0rem;
background: #fff;
border-radius: px2rem(30) px2rem(30) 0 0;
div { .ordinary {
width: 25%; width: 2.8rem;
text-align: center;
color: #5D95FF; .title {
font-size: px2rem(22); // font-size: px2rem(28);
font-weight: 600; }
}
} }
} }
.other { .header h3 {
width: px2rem(657); margin-right: 0.3rem;
height: px2rem(151); }
margin: 0 auto 0;
border-bottom: px2rem(2) solid #D7DCE6;
display: flex;
justify-content: space-between;
// background: pink;
&:last-child { .box h3 span {
border: none; margin-right: 0.3rem;
} margin-left: 0;
}
div { .box h3 b {
width: 25%; margin-right: 0.3rem;
text-align: center; }
height: 100%;
line-height: px2rem(151);
color: #848D9C;
font-size: px2rem(24);
font-weight: 500;
white-space: nowrap;
img { .box .box_in .ordinaryBox .ordinaryBox_in .ordinary {
display: block; float: right;
margin: px2rem(34) auto px2rem(5);
width: px2rem(32);
height: px2rem(32);
border-radius: 50%;
}
p {
width: 98%;
height: px2rem(25);
line-height: 0.32rem;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
text-align: center;
color: #848D9C;
font-size: px2rem(24);
margin-bottom: px2rem(9);
}
.id {
width: 100%;
text-align: center;
color: #A4ABB2;
font-size: px2rem(18);
}
}
.div11 {
line-height: 0rem;
}
} }
} }

View File

@@ -38,6 +38,7 @@ body {
color: #333333; color: #333333;
font-size: 0.45333rem; font-size: 0.45333rem;
font-weight: bold; font-weight: bold;
width: 100%;
} }
.back .text { .back .text {
@@ -50,220 +51,472 @@ body {
font-size: 0.4rem; font-size: 0.4rem;
} }
.timeBox { .header {
width: 9.46667rem; width: 9.46667rem;
height: 2.54667rem; height: 6.34667rem;
background: #fff; background: #fff;
border-radius: 0.4rem; border-radius: 0.4rem;
margin: 2.53333rem auto 0.25333rem; margin: 2.8rem auto 0.34667rem;
position: relative;
}
.timeBox .line {
width: 0.02667rem;
height: 1.90667rem;
background: #D7DCE6;
position: absolute;
left: 2.92rem;
top: 50%;
transform: translateY(-50%);
border-radius: 0.02667rem;
}
.timeBox .year {
width: 2.92rem;
position: absolute;
left: 0;
top: 0.33333rem;
color: #A4ABB2;
font-size: 0.32rem;
font-weight: bold;
text-align: center;
text-indent: -0.8rem;
}
.timeBox .startTime {
width: 2.92rem;
position: absolute;
left: 0;
top: 0.96rem;
color: #848D9C;
font-size: 0.37333rem;
font-weight: bold;
}
.timeBox .startTime b {
margin-right: 0.1rem;
text-indent: 0.45rem;
display: inline-block;
}
.timeBox .startTime img {
width: 0.32rem;
height: 0.21333rem;
display: inline-block;
margin-top: 0.1rem;
}
.timeBox .endTime {
width: 2.92rem;
position: absolute;
left: 0;
top: 1.62667rem;
color: #848D9C;
font-size: 0.37333rem;
font-weight: bold;
}
.timeBox .endTime b {
margin-right: 0.1rem;
text-indent: 0.45rem;
display: inline-block;
}
.timeBox .endTime img {
width: 0.32rem;
height: 0.21333rem;
display: inline-block;
margin-top: 0.1rem;
}
.timeBox .right {
width: 5.5rem;
height: 2.54667rem;
position: absolute;
right: 0.55rem;
top: 0;
display: flex;
justify-content: space-between;
}
.timeBox .right div {
width: 50%;
text-align: center;
overflow: hidden; overflow: hidden;
position: relative; position: relative;
} }
.timeBox .right div p { .header .time {
color: #A4ABB2; width: 100%;
font-size: 0.32rem; height: 0.53333rem;
font-weight: bold; line-height: 0.53333rem;
margin-top: 0.53333rem;
margin-bottom: 0.33333rem;
line-height: 0.34rem;
}
.timeBox .right div b {
color: #848D9C;
font-size: 0.37333rem;
font-weight: bold;
position: absolute;
left: 50%;
transform: translateX(-50%);
bottom: 0.6rem;
}
.timeBox .right .goToExchangeGold {
position: absolute;
top: 2.06667rem;
right: 0rem;
color: #D25555;
font-size: 0.26667rem;
}
.list {
width: 9.46667rem;
height: 12.8rem;
background: #fff;
border-radius: 0.4rem;
margin: 0.25333rem auto 0.13333rem;
overflow-y: scroll;
position: relative;
padding-top: 1.45rem;
box-sizing: border-box;
}
.list::-webkit-scrollbar {
display: none;
}
.list .top {
height: 1.5rem;
width: 9.46667rem;
box-sizing: border-box;
padding: 0.53333rem 0.26667rem 0;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
line-height: 0.4rem; box-sizing: border-box;
position: absolute; margin: 0.38667rem auto 0.76rem;
left: 50%;
transform: translateX(-50%);
top: 0;
background: #fff;
border-radius: 0.4rem 0.4rem 0 0;
}
.list .top div {
width: 25%;
text-align: center; text-align: center;
color: #5D95FF; padding: 0 0.26667rem;
font-size: 0.29333rem;
font-weight: 600;
}
.list .other {
width: 8.76rem;
height: 2.01333rem;
margin: 0 auto 0;
border-bottom: 0.02667rem solid #D7DCE6;
display: flex;
justify-content: space-between;
}
.list .other:last-child {
border: none;
}
.list .other div {
width: 25%;
text-align: center;
height: 100%;
line-height: 2.01333rem;
color: #848D9C; color: #848D9C;
font-size: 0.32rem; font-size: 0.4rem;
font-weight: 500; font-weight: 500;
}
.header .time div {
color: #5D636E;
width: 4rem;
}
.header .time div b {
display: inline-block;
vertical-align: middle;
white-space: nowrap; white-space: nowrap;
} }
.list .other div img { .header .time div img {
display: block; width: 0.32rem;
margin: 0.45333rem auto 0.06667rem; height: 0.21333rem;
width: 0.42667rem; display: inline-block;
height: 0.42667rem; vertical-align: middle;
border-radius: 50%; margin-left: 0.13333rem;
} }
.list .other div p { .header .time span {
width: 98%; display: block;
height: 0.33333rem; width: 3rem;
line-height: 0.32rem; }
.header h3 {
width: 100%;
box-sizing: border-box;
padding-left: 0.53333rem;
color: #141515;
font-size: 0.45333rem;
margin-bottom: 0.72rem;
}
.header p {
height: 0.53333rem;
line-height: 0.53333rem;
width: 100%;
text-align: center;
color: #232424;
font-size: 0.69333rem;
font-weight: 500;
}
.header p img {
display: inline-block;
width: 0.28rem;
height: 0.61333rem;
margin-top: -0.05rem;
}
.header .user {
width: 1.70667rem;
height: 1.14667rem;
position: absolute;
left: 0.88rem;
top: 1.4rem;
text-align: center;
}
.header .user img {
display: block;
width: 1.14667rem;
height: 1.14667rem;
border-radius: 50%;
margin: 0 auto 0.05333rem;
}
.header .user p {
width: 100%;
overflow: hidden; overflow: hidden;
white-space: nowrap; white-space: nowrap;
text-overflow: ellipsis; text-overflow: ellipsis;
color: #333333;
font-size: 0.34667rem;
font-weight: 400;
margin-bottom: 0.02667rem;
}
.header .user b {
color: #A4ABB2;
font-size: 0.29333rem;
}
.header .line {
width: 8.76rem;
height: 0.01333rem;
background: #B0BACD;
position: absolute;
left: 50%;
transform: translateX(-50%);
top: 3.88rem;
}
.header .line1 {
width: 0.01333rem;
height: 1.02667rem;
background: #B0BACD;
position: absolute;
left: 2.94667rem;
top: 4.65333rem;
}
.header .line2 {
width: 0.01333rem;
height: 1.02667rem;
background: #B0BACD;
position: absolute;
left: 6.37333rem;
top: 4.65333rem;
}
.header .datas {
width: 8.76rem;
height: 1.24rem;
margin: 1.24rem auto 0;
display: flex;
justify-content: space-between;
}
.header .datas div {
width: 2.54667rem;
text-align: center;
}
.header .datas div p {
color: #232424;
font-size: 0.48rem;
font-weight: 500;
margin-bottom: 0.30667rem;
width: 100%;
}
.header .datas div p img {
display: inline-block;
width: 0.4rem;
height: 0.4rem;
vertical-align: middle;
}
.header .datas div p .dor {
width: 0.25333rem;
height: 0.56rem;
margin-top: -0.05rem;
}
.header .datas div p b {
display: inline-block;
vertical-align: middle;
}
.header .datas div span {
color: #666666;
font-size: 0.37333rem;
font-weight: 400;
white-space: nowrap;
}
.datasAct .line1 {
left: 50%;
transform: translateX(-50%);
}
.datasAct .line2 {
display: none;
}
.datasAct .datas {
width: 7rem;
}
.datasAct .datas .datas3 {
display: none;
}
.box {
width: 9.46667rem;
min-height: 10.66667rem;
background: #fff;
border-radius: 0.4rem;
margin: 0 auto 0.4rem;
box-sizing: border-box;
padding: 0.49333rem 0rem 0 0.30667rem;
}
.box h3 {
color: #141515;
font-size: 0.45333rem;
font-weight: 600;
margin: 0;
margin-left: 0.26667rem;
margin-bottom: 0.50667rem;
}
.box h3 span {
display: inline-block;
width: 0.06667rem;
height: 0.37333rem;
margin-left: -0.17333rem;
background: #62D0A8;
margin-right: 0.13333rem;
}
.box .box_in {
width: 100%;
height: 100%;
display: flex;
}
.box .box_in .fistBox {
width: 2.4rem;
float: left;
}
.box .box_in .fistBox .fist {
width: 2.26667rem;
height: 2.01333rem;
margin-right: 0.4rem;
}
.box .box_in .fistBox .fist .title {
color: #666666;
width: 100%;
text-align: center;
font-size: 0.37333rem;
margin-bottom: 0.30667rem;
white-space: nowrap;
}
.box .box_in .fistBox .fist .user {
position: relative;
}
.box .box_in .fistBox .fist .ts {
width: 0.42667rem;
height: 0.42667rem;
border-radius: 50%;
position: absolute;
left: 50%;
transform: translateX(-50%);
top: 0rem;
z-index: 2;
display: none;
}
.box .box_in .fistBox .fist .ts i {
width: 100%;
border-radius: 0.16rem;
height: 0.16rem;
line-height: 0.16rem;
position: absolute;
bottom: 0;
left: 50%;
transform: translateX(-50%);
text-align: center;
background: linear-gradient(90deg, #FFEB67, #FFFCE7);
color: #333333;
font-size: 0.16rem;
font-weight: 400;
font-style: normal;
}
.box .box_in .fistBox .fist .i {
display: block;
}
.box .box_in .fistBox .fist img {
display: block;
width: 0.42667rem;
height: 0.42667rem;
border-radius: 50%;
margin: 0 auto 0.06667rem;
}
.box .box_in .fistBox .fist p {
width: 100%;
text-align: center;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
color: #848D9C;
font-size: 0.32rem;
font-weight: 500;
margin-bottom: 0.06667rem;
}
.box .box_in .fistBox .fist b {
color: #A4ABB2;
font-size: 0.24rem;
font-weight: 500;
text-align: center;
display: block;
width: 100%;
}
.box .box_in .ordinaryBox {
height: 100%;
overflow-x: scroll;
}
.box .box_in .ordinaryBox .ordinaryBox_in {
width: 13.5rem;
height: 100%;
}
.box .box_in .ordinaryBox .ordinaryBox_in .ordinary {
width: 2.26667rem;
height: 2.01333rem;
float: left;
margin-right: 0.4rem;
white-space: nowrap;
}
.box .box_in .ordinaryBox .ordinaryBox_in .ordinary .title {
color: #666666;
width: 100%;
text-align: center;
font-size: 0.37333rem;
margin-bottom: 0.30667rem;
}
.box .box_in .ordinaryBox .ordinaryBox_in .ordinary p {
width: 100%;
text-align: center; text-align: center;
color: #848D9C; color: #848D9C;
font-size: 0.32rem; font-size: 0.32rem;
margin-bottom: 0.12rem; font-weight: 500;
line-height: 1.2rem;
} }
.list .other div .id { .box .box_in .ordinaryBox .ordinaryBox_in .ordinary .true {
width: 100%; color: #4EA686;
text-align: center;
color: #A4ABB2;
font-size: 0.24rem;
} }
.list .other .div11 { .box .box_in .ordinaryBox .ordinaryBox_in .ordinary .false {
line-height: 0rem; color: #DC865D;
}
.box .box_in .ordinaryBox .ordinaryBox_in .ordinary .details {
color: #269ceb;
}
.box .box_in .fistBox .fistAct .title {
opacity: 0;
}
.box .box_in .ordinaryBox_inAct .ordinary .title {
opacity: 0;
margin-bottom: -0.26667rem;
}
.english .header .time span {
font-size: 0.34667rem;
}
.english .header .datas div span {
font-size: 0.32rem;
}
.english .box h3 {
font-size: 0.4rem;
}
.english .box .box_in .ordinaryBox .ordinaryBox_in {
width: 15rem;
}
.english .box .box_in .ordinaryBox .ordinaryBox_in .ordinary {
width: 2.6rem;
}
.english .header .time span {
width: 2rem;
white-space: nowrap;
font-size: 0.32rem;
}
.english .header .time b {
white-space: nowrap;
font-size: 0.37333rem;
}
.english .header .time img {
margin-right: 0.1rem;
}
.english .header .time div {
width: 5rem;
}
.arabic .header h3 {
margin-right: 0.3rem;
}
.arabic .box h3 span {
margin-right: 0.3rem;
margin-left: 0;
}
.arabic .box h3 b {
margin-right: 0.3rem;
}
.arabic .box h3 strong {
margin-right: 0.3rem;
}
.arabic .box .box_in .ordinaryBox .ordinaryBox_in .ordinary {
float: right;
}
.arabic .box .box_in .ordinaryBox {
margin-right: 0.4rem;
}
.arabic .header .time span {
width: 2rem;
white-space: nowrap;
font-size: 0.32rem;
}
.arabic .header .time b {
white-space: nowrap;
font-size: 0.34667rem;
}
.arabic .header .time img {
margin-right: 0.1rem;
}
.arabic .header .time div {
width: 5rem;
}
.arabic .box .box_in .ordinaryBox .ordinaryBox_in .ordinary {
width: 3.2rem;
}
.arabic .box .box_in .ordinaryBox .ordinaryBox_in {
width: 18rem;
}
.arabic .header .datas div span {
font-size: 0.32rem;
} }

View File

@@ -19,7 +19,7 @@ body {
color: #FFFFFF; color: #FFFFFF;
font-size: px2rem(38); font-size: px2rem(38);
font-weight: bold; font-weight: bold;
z-index: 10; z-index: 10;
background: #fff; background: #fff;
.backs { .backs {
@@ -31,8 +31,6 @@ body {
z-index: 2; z-index: 2;
} }
.title { .title {
position: absolute; position: absolute;
left: 50%; left: 50%;
@@ -43,6 +41,7 @@ body {
color: #333333; color: #333333;
font-size: px2rem(34); font-size: px2rem(34);
font-weight: bold; font-weight: bold;
width: 100%;
} }
.text { .text {
@@ -56,223 +55,494 @@ body {
} }
} }
.timeBox { .header {
width: px2rem(710); width: px2rem(710);
height: px2rem(191); height: px2rem(476);
background: #fff; background: #fff;
border-radius: px2rem(30); border-radius: px2rem(30);
margin: px2rem(190) auto px2rem(19); margin: px2rem(210) auto px2rem(26);
overflow: hidden;
position: relative; position: relative;
.line { .time {
width: px2rem(2); width: 100%;
height: px2rem(143); height: px2rem(40);
background: #D7DCE6; line-height: px2rem(40);
position: absolute; display: flex;
left: px2rem(219); justify-content: space-between;
top: 50%; box-sizing: border-box;
transform: translateY(-50%); margin: px2rem(29) auto px2rem(57);
border-radius: px2rem(2);
}
.year {
width: px2rem(219);
position: absolute;
left: 0;
top: px2rem(25);
color: #A4ABB2;
font-size: px2rem(24);
font-weight: bold;
text-align: center; text-align: center;
text-indent: -0.8rem; padding: 0 px2rem(20);
color: #848D9C;
font-size: px2rem(30);
font-weight: 500;
div {
color: #5D636E;
width: 4rem;
b {
display: inline-block;
vertical-align: middle;
white-space: nowrap;
}
img {
width: px2rem(24);
height: px2rem(16);
display: inline-block;
vertical-align: middle;
margin-left: px2rem(10);
}
}
span {
display: block;
width: 3rem;
}
} }
.startTime { h3 {
width: px2rem(219); width: 100%;
position: absolute; box-sizing: border-box;
left: 0; padding-left: px2rem(40);
top: px2rem(72); color: #141515;
color: #848D9C; font-size: px2rem(34);
font-size: px2rem(28); // font-weight: 600;
font-weight: bold; margin-bottom: px2rem(54);
// text-align: center; // text-align: center;
}
b { p {
margin-right: 0.1rem; height: px2rem(40);
text-indent: 0.45rem; line-height: px2rem(40);
display: inline-block; width: 100%;
} text-align: center;
color: #232424;
font-size: px2rem(52);
font-weight: 500;
img { img {
width: px2rem(24);
height: px2rem(16);
display: inline-block; display: inline-block;
margin-top: 0.1rem; width: px2rem(21);
height: px2rem(46);
margin-top: -0.05rem;
} }
} }
.endTime { .user {
width: px2rem(219); width: px2rem(128);
height: px2rem(86);
position: absolute; position: absolute;
left: 0; left: px2rem(66);
top: px2rem(122); top: px2rem(105);
color: #848D9C; text-align: center;
font-size: px2rem(28);
font-weight: bold;
// text-align: center;
b {
margin-right: 0.1rem;
text-indent: 0.45rem;
display: inline-block;
}
img { img {
width: px2rem(24); display: block;
height: px2rem(16); width: px2rem(86);
display: inline-block; height: px2rem(86);
margin-top: 0.1rem; border-radius: 50%;
margin: 0 auto px2rem(4);
}
p {
width: 100%;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
color: #333333;
font-size: px2rem(26);
font-weight: 400;
margin-bottom: px2rem(2);
}
b {
color: #A4ABB2;
font-size: px2rem(22);
} }
} }
.right { .line {
width: 5.5rem; width: px2rem(657);
height: px2rem(191); height: px2rem(1);
background: #B0BACD;
position: absolute; position: absolute;
right: 0.55rem; left: 50%;
top: 0; transform: translateX(-50%);
top: px2rem(291);
}
.line1 {
width: px2rem(1);
height: px2rem(77);
background: #B0BACD;
position: absolute;
left: px2rem(221);
top: px2rem(349);
}
.line2 {
width: px2rem(1);
height: px2rem(77);
background: #B0BACD;
position: absolute;
left: px2rem(478);
top: px2rem(349);
}
.datas {
width: px2rem(657);
height: px2rem(93);
margin: px2rem(93) auto 0;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
div { div {
width: 50%; width: px2rem(191);
text-align: center; text-align: center;
overflow: hidden;
position: relative;
p { p {
color: #A4ABB2; color: #232424;
font-size: px2rem(24); font-size: px2rem(36);
font-weight: bold; font-weight: 500;
margin-top: px2rem(40); margin-bottom: px2rem(23);
margin-bottom: px2rem(25); width: 100%;
line-height: 0.34rem;
img {
display: inline-block;
width: px2rem(30);
height: px2rem(30);
vertical-align: middle;
}
.dor {
width: px2rem(19);
height: px2rem(42);
margin-top: -0.05rem;
}
b {
display: inline-block;
vertical-align: middle;
}
} }
b { span {
color: #848D9C; color: #666666;
font-size: px2rem(28); font-size: px2rem(28);
font-weight: bold; font-weight: 400;
position: absolute; white-space: nowrap;
left: 50%;
transform: translateX(-50%);
bottom: px2rem(45);
} }
} }
.goToExchangeGold {
position: absolute;
top: px2rem(155);
right: px2rem(0);
color: #D25555;
font-size: px2rem(20);
}
} }
} }
.list { .datasAct {
width: px2rem(710); .line1 {
height: px2rem(960); left: 50%;
background: #fff; transform: translateX(-50%);
border-radius: px2rem(30); }
margin: px2rem(19) auto px2rem(10);
overflow-y: scroll;
position: relative;
padding-top: 1.45rem;
box-sizing: border-box;
&::-webkit-scrollbar { .line2 {
display: none; display: none;
} }
.top {
height: 1.5rem;
width: px2rem(710);
box-sizing: border-box;
padding: px2rem(40) px2rem(20) 0;
display: flex;
justify-content: space-between;
line-height: 0.4rem;
position: absolute;
left: 50%;
transform: translateX(-50%);
// top: 5.3rem;
top: 0;
background: #fff;
border-radius: px2rem(30) px2rem(30) 0 0;
div { .datas {
width: 25%; width: 7rem;
text-align: center;
color: #5D95FF; .datas3 {
font-size: px2rem(22); display: none;
font-weight: 600; }
}
}
.box {
width: px2rem(710);
min-height: px2rem(800);
background: #fff;
border-radius: px2rem(30);
margin: 0 auto px2rem(30);
box-sizing: border-box;
padding: px2rem(37) px2rem(0) 0 px2rem(23);
h3 {
color: #141515;
font-size: px2rem(34);
font-weight: 600;
margin: 0;
margin-left: px2rem(20);
margin-bottom: px2rem(38);
span {
display: inline-block;
width: px2rem(5);
height: px2rem(28);
margin-left: px2rem(-13);
background: #62D0A8;
margin-right: px2rem(10);
} }
} }
.other { .box_in {
width: px2rem(657); width: 100%;
height: px2rem(151); height: 100%;
margin: 0 auto 0;
border-bottom: px2rem(2) solid #D7DCE6;
display: flex; display: flex;
justify-content: space-between;
&:last-child { .fistBox {
border: none; width: px2rem(180);
float: left;
.fist {
width: px2rem(170);
height: px2rem(151);
margin-right: px2rem(30);
.title {
color: #666666;
width: 100%;
text-align: center;
font-size: px2rem(28);
margin-bottom: px2rem(23);
white-space: nowrap;
}
.user {
position: relative;
}
.ts {
width: px2rem(32);
height: px2rem(32);
border-radius: 50%;
position: absolute;
left: 50%;
transform: translateX(-50%);
top: px2rem(0);
z-index: 2;
display: none;
i {
width: 100%;
border-radius: px2rem(12);
height: px2rem(12);
line-height: px2rem(12);
position: absolute;
bottom: 0;
left: 50%;
transform: translateX(-50%);
text-align: center;
background: linear-gradient(90deg, #FFEB67, #FFFCE7);
color: #333333;
font-size: px2rem(12);
font-weight: 400;
font-style: normal;
}
}
.i {
display: block;
}
img {
display: block;
width: px2rem(32);
height: px2rem(32);
border-radius: 50%;
margin: 0 auto px2rem(5);
}
p {
width: 100%;
text-align: center;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
color: #848D9C;
font-size: px2rem(24);
font-weight: 500;
margin-bottom: px2rem(5);
}
b {
color: #A4ABB2;
font-size: px2rem(18);
font-weight: 500;
text-align: center;
display: block;
width: 100%;
}
}
} }
div { .ordinaryBox {
width: 25%;
text-align: center;
height: 100%; height: 100%;
line-height: px2rem(151); overflow-x: scroll;
color: #848D9C;
font-size: px2rem(24);
font-weight: 500;
white-space: nowrap;
img { &::-webkit-scrollbar {
display: block; // display: none;
margin: px2rem(34) auto px2rem(5);
width: px2rem(32);
height: px2rem(32);
border-radius: 50%;
} }
p { .ordinaryBox_in {
width: 98%; width: 13.5rem;
height: px2rem(25); height: 100%;
line-height: 0.32rem;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
text-align: center;
color: #848D9C;
font-size: px2rem(24);
margin-bottom: px2rem(9);
}
.id { .ordinary {
width: 100%; width: px2rem(170);
text-align: center; height: px2rem(151);
color: #A4ABB2; float: left;
font-size: px2rem(18); margin-right: px2rem(30);
white-space: nowrap;
.title {
color: #666666;
width: 100%;
text-align: center;
font-size: px2rem(28);
margin-bottom: px2rem(23);
}
p {
width: 100%;
text-align: center;
color: #848D9C;
font-size: px2rem(24);
font-weight: 500;
line-height: px2rem(90);
}
.true {
color: #4EA686;
}
.false {
color: #DC865D;
}
.details {
color: rgb(38, 156, 235);
}
}
} }
} }
.div11 { .fistBox .fistAct {
line-height: 0rem; .title {
opacity: 0;
}
} }
.ordinaryBox_inAct .ordinary {
.title {
opacity: 0;
margin-bottom: px2rem(-20);
}
}
}
}
.english {
.header .time span {
font-size: px2rem(26);
}
.header .datas div span {
font-size: px2rem(24);
}
.box h3 {
font-size: px2rem(30);
}
.box .box_in .fistBox .fist {
// width: 4rem;
}
.box .box_in .ordinaryBox .ordinaryBox_in {
width: 15rem;
.ordinary {
width: 2.6rem;
}
}
.header .time span {
width: 2rem;
white-space: nowrap;
font-size: px2rem(24);
}
.header .time b {
white-space: nowrap;
font-size: px2rem(28);
}
.header .time img {
margin-right: 0.1rem;
}
.header .time div {
width: 5rem;
}
}
.arabic {
.header h3 {
margin-right: 0.3rem;
}
.box h3 span {
margin-right: 0.3rem;
margin-left: 0;
}
.box h3 b {
margin-right: 0.3rem;
}
.box h3 strong {
margin-right: 0.3rem;
}
.box .box_in .ordinaryBox .ordinaryBox_in .ordinary {
float: right;
}
.box .box_in .ordinaryBox {
margin-right: 0.4rem;
}
.header .time span {
width: 2rem;
white-space: nowrap;
font-size: px2rem(24);
}
.header .time b {
white-space: nowrap;
font-size: px2rem(26);
}
.header .time img {
margin-right: 0.1rem;
}
.header .time div {
width: 5rem;
}
.box .box_in .ordinaryBox .ordinaryBox_in .ordinary {
width: 3.2rem;
}
.box .box_in .ordinaryBox .ordinaryBox_in {
width: 18rem;
}
.header .datas div span {
font-size: px2rem(24);
} }
} }

View File

@@ -0,0 +1,488 @@
html,
body {
width: 100%;
height: 17.78667rem;
background: #F5F7F9;
}
.back {
width: 100%;
height: 2.4rem;
position: fixed;
left: 0;
top: 0rem;
text-align: center;
color: #FFFFFF;
font-size: 0.50667rem;
font-weight: bold;
z-index: 10;
background: #fff;
}
.back .backs {
width: 0.58667rem;
height: 0.58667rem;
position: absolute;
left: 0.24rem;
top: 58%;
z-index: 2;
}
.back .title {
position: absolute;
left: 50%;
transform: translateX(-50%);
height: 100%;
top: 0;
line-height: 3.46667rem;
color: #333333;
font-size: 0.45333rem;
font-weight: bold;
white-space: nowrap;
}
.back .text {
position: absolute;
right: 0.62667rem;
height: 100%;
top: 0;
line-height: 3.46667rem;
color: #333333;
font-size: 0.4rem;
}
.header {
width: 9.46667rem;
height: 6.34667rem;
background: #fff;
border-radius: 0.4rem;
margin: 2.8rem auto 0.34667rem;
overflow: hidden;
position: relative;
}
.header .time {
width: 100%;
height: 0.53333rem;
line-height: 0.53333rem;
display: flex;
justify-content: space-between;
box-sizing: border-box;
margin: 0.38667rem auto 0.76rem;
text-align: center;
padding: 0 0.26667rem;
color: #848D9C;
font-size: 0.4rem;
font-weight: 500;
}
.header .time div {
color: #5D636E;
width: 4rem;
}
.header .time div b {
display: inline-block;
vertical-align: middle;
white-space: nowrap;
}
.header .time div img {
width: 0.32rem;
height: 0.21333rem;
display: inline-block;
vertical-align: middle;
margin-left: 0.13333rem;
}
.header .time span {
display: block;
width: 3rem;
}
.header h3 {
width: 78%;
box-sizing: border-box;
padding-left: 0.65333rem;
color: #232424;
font-size: 0.37333rem;
font-weight: bold;
margin-bottom: 0.72rem;
text-align: center;
float: right;
}
.header p {
height: 0.53333rem;
line-height: 0.53333rem;
width: 70%;
text-align: center;
color: #232424;
font-size: 0.69333rem;
font-weight: 500;
float: right;
}
.header p img {
display: inline-block;
width: 0.28rem;
height: 0.61333rem;
margin-top: -0.05rem;
}
.header .user {
width: 1.70667rem;
height: 1.14667rem;
position: absolute;
left: 0.88rem;
top: 1.4rem;
text-align: center;
}
.header .user img {
display: block;
width: 1.14667rem;
height: 1.14667rem;
border-radius: 50%;
margin: 0 auto 0.05333rem;
}
.header .user p {
width: 100%;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
color: #333333;
font-size: 0.34667rem;
font-weight: 400;
margin-bottom: 0.02667rem;
}
.header .user b {
color: #A4ABB2;
font-size: 0.29333rem;
}
.header .line {
width: 8.76rem;
height: 0.01333rem;
background: #B0BACD;
position: absolute;
left: 50%;
transform: translateX(-50%);
top: 3.88rem;
}
.header .line1 {
width: 0.01333rem;
height: 1.02667rem;
background: #B0BACD;
position: absolute;
left: 2.94667rem;
top: 4.65333rem;
}
.header .line2 {
width: 0.01333rem;
height: 1.02667rem;
background: #B0BACD;
position: absolute;
left: 6.37333rem;
top: 4.65333rem;
}
.header .datas {
width: 8.76rem;
height: 1.24rem;
margin: 3.5rem auto 0;
display: flex;
justify-content: space-between;
}
.header .datas div {
width: 2.54667rem;
text-align: center;
}
.header .datas div p {
color: #232424;
font-size: 0.48rem;
font-weight: 500;
margin-bottom: 0.30667rem;
width: 100%;
}
.header .datas div p img {
display: inline-block;
width: 0.4rem;
height: 0.4rem;
vertical-align: middle;
}
.header .datas div p .dor {
width: 0.25333rem;
height: 0.56rem;
margin-top: -0.05rem;
}
.header .datas div p b {
display: inline-block;
vertical-align: middle;
}
.header .datas div span {
color: #666666;
font-size: 0.37333rem;
font-weight: 400;
white-space: nowrap;
}
.datasAct .line1 {
left: 50%;
transform: translateX(-50%);
}
.datasAct .line2 {
display: none;
}
.datasAct .datas {
width: 7rem;
}
.datasAct .datas .datas3 {
display: none;
}
.box {
width: 9.46667rem;
min-height: 10.66667rem;
background: #fff;
border-radius: 0.4rem;
margin: 0 auto 0.4rem;
box-sizing: border-box;
padding: 0.49333rem 0rem 0 0.30667rem;
}
.box h3 {
color: #141515;
font-size: 0.45333rem;
font-weight: 600;
margin: 0;
margin-left: 0.26667rem;
margin-bottom: 0.50667rem;
}
.box h3 span {
display: inline-block;
width: 0.06667rem;
height: 0.37333rem;
margin-left: -0.17333rem;
background: #62D0A8;
margin-right: 0.13333rem;
}
.box .box_in {
width: 100%;
height: 100%;
display: flex;
}
.box .box_in .fistBox {
width: 2.4rem;
float: left;
}
.box .box_in .fistBox .fist {
width: 2.26667rem;
height: 2.01333rem;
margin-right: 0.4rem;
}
.box .box_in .fistBox .fist .title {
color: #666666;
width: 100%;
text-align: center;
font-size: 0.37333rem;
margin-bottom: 0.30667rem;
white-space: nowrap;
}
.box .box_in .fistBox .fist img {
display: block;
width: 0.42667rem;
height: 0.42667rem;
border-radius: 50%;
margin: 0 auto 0.06667rem;
}
.box .box_in .fistBox .fist p {
width: 100%;
text-align: center;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
color: #848D9C;
font-size: 0.32rem;
font-weight: 500;
margin-bottom: 0.06667rem;
}
.box .box_in .fistBox .fist b {
color: #A4ABB2;
font-size: 0.24rem;
font-weight: 500;
text-align: center;
display: block;
width: 100%;
}
.box .box_in .ordinaryBox {
height: 100%;
overflow-x: scroll;
}
.box .box_in .ordinaryBox .ordinaryBox_in {
width: 14.5rem;
height: 100%;
}
.box .box_in .ordinaryBox .ordinaryBox_in .ordinary {
min-width: 2.4rem;
height: 2.01333rem;
float: left;
margin-right: 0.4rem;
}
.box .box_in .ordinaryBox .ordinaryBox_in .ordinary .title {
color: #666666;
width: 100%;
text-align: center;
font-size: 0.37333rem;
margin-bottom: 0.30667rem;
}
.box .box_in .ordinaryBox .ordinaryBox_in .ordinary p {
width: 100%;
text-align: center;
color: #848D9C;
font-size: 0.32rem;
font-weight: 500;
line-height: 1.2rem;
}
.box .box_in .ordinaryBox .ordinaryBox_in .ordinary .true {
color: #4EA686;
}
.box .box_in .ordinaryBox .ordinaryBox_in .ordinary .false {
color: #DC865D;
}
.box .box_in .ordinaryBox .ordinaryBox_in .ordinary .details {
color: #269ceb;
}
.box .box_in .fistBox .fistAct .title {
opacity: 0;
}
.box .box_in .ordinaryBox_inAct .ordinary .title {
opacity: 0;
margin-bottom: -0.26667rem;
}
.english .back .title {
font-size: 0.42667rem;
}
.english .header .datas div span {
font-size: 0.29333rem;
}
.english .box .box_in .ordinaryBox .ordinaryBox_in {
width: 15rem;
}
.english .box .box_in .ordinaryBox .ordinaryBox_in .title {
font-size: 0.34667rem;
}
.english .header .time span {
width: 2rem;
white-space: nowrap;
font-size: 0.32rem;
}
.english .header .time b {
white-space: nowrap;
font-size: 0.37333rem;
}
.english .header .time img {
margin-right: 0.1rem;
}
.english .header .time div {
width: 5rem;
}
.arabic .back .title {
font-size: 0.42667rem;
}
.arabic .header .datas div span {
font-size: 0.29333rem;
}
.arabic .box h3 {
margin-right: 0.26667rem;
}
.arabic .box span {
margin-left: 0;
margin-right: 0;
}
.arabic .box h3 b {
margin-right: 0.3rem;
}
.arabic .box h3 strong {
margin-right: 0.3rem;
}
.arabic .box .box_in .ordinaryBox .ordinaryBox_in {
width: 20rem;
}
.arabic .box .box_in .ordinaryBox .ordinaryBox_in .title {
font-size: 0.33333rem;
}
.arabic .box .box_in .ordinaryBox .ordinaryBox_in .ordinary {
float: right;
}
.arabic .box .box_in .ordinaryBox {
margin-right: 0.4rem;
}
.arabic .header .time span {
width: 2rem;
white-space: nowrap;
font-size: 0.32rem;
}
.arabic .header .time b {
white-space: nowrap;
font-size: 0.34667rem;
}
.arabic .header .time img {
margin-right: 0.1rem;
}
.arabic .header .time div {
width: 5rem;
}

View File

@@ -0,0 +1,508 @@
@function px2rem($px) {
@return $px / 75+rem;
}
html,
body {
width: 100%;
height: px2rem(1334);
background: #F5F7F9;
}
.back {
width: 100%;
height: px2rem(180);
position: fixed;
left: 0;
top: px2rem(0);
text-align: center;
color: #FFFFFF;
font-size: px2rem(38);
font-weight: bold;
z-index: 10;
background: #fff;
.backs {
width: px2rem(44);
height: px2rem(44);
position: absolute;
left: px2rem(18);
top: 58%;
z-index: 2;
}
.title {
position: absolute;
left: 50%;
transform: translateX(-50%);
height: 100%;
top: 0;
line-height: px2rem(260);
color: #333333;
font-size: px2rem(34);
font-weight: bold;
white-space: nowrap;
}
.text {
position: absolute;
right: px2rem(47);
height: 100%;
top: 0;
line-height: px2rem(260);
color: #333333;
font-size: px2rem(30);
}
}
.header {
width: px2rem(710);
height: px2rem(476);
background: #fff;
border-radius: px2rem(30);
margin: px2rem(210) auto px2rem(26);
overflow: hidden;
position: relative;
.time {
width: 100%;
height: px2rem(40);
line-height: px2rem(40);
display: flex;
justify-content: space-between;
box-sizing: border-box;
margin: px2rem(29) auto px2rem(57);
text-align: center;
padding: 0 px2rem(20);
color: #848D9C;
font-size: px2rem(30);
font-weight: 500;
div {
color: #5D636E;
width: 4rem;
b {
display: inline-block;
vertical-align: middle;
white-space: nowrap;
}
img {
width: px2rem(24);
height: px2rem(16);
display: inline-block;
vertical-align: middle;
margin-left: px2rem(10);
}
}
span {
display: block;
width: 3rem;
}
}
h3 {
width: 78%;
box-sizing: border-box;
padding-left: px2rem(49);
color: #232424;
font-size: px2rem(28);
font-weight: bold;
margin-bottom: px2rem(54);
text-align: center;
float: right;
}
p {
height: px2rem(40);
line-height: px2rem(40);
width: 70%;
text-align: center;
color: #232424;
font-size: px2rem(52);
font-weight: 500;
float: right;
img {
display: inline-block;
width: px2rem(21);
height: px2rem(46);
margin-top: -0.05rem;
}
}
.user {
width: px2rem(128);
height: px2rem(86);
position: absolute;
left: px2rem(66);
top: px2rem(105);
text-align: center;
img {
display: block;
width: px2rem(86);
height: px2rem(86);
border-radius: 50%;
margin: 0 auto px2rem(4);
}
p {
width: 100%;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
color: #333333;
font-size: px2rem(26);
font-weight: 400;
margin-bottom: px2rem(2);
}
b {
color: #A4ABB2;
font-size: px2rem(22);
}
}
.line {
width: px2rem(657);
height: px2rem(1);
background: #B0BACD;
position: absolute;
left: 50%;
transform: translateX(-50%);
top: px2rem(291);
}
.line1 {
width: px2rem(1);
height: px2rem(77);
background: #B0BACD;
position: absolute;
left: px2rem(221);
top: px2rem(349);
}
.line2 {
width: px2rem(1);
height: px2rem(77);
background: #B0BACD;
position: absolute;
left: px2rem(478);
top: px2rem(349);
}
.datas {
width: px2rem(657);
height: px2rem(93);
margin: 3.5rem auto 0;
display: flex;
justify-content: space-between;
div {
width: px2rem(191);
text-align: center;
p {
color: #232424;
font-size: px2rem(36);
font-weight: 500;
margin-bottom: px2rem(23);
width: 100%;
img {
display: inline-block;
width: px2rem(30);
height: px2rem(30);
vertical-align: middle;
}
.dor {
width: px2rem(19);
height: px2rem(42);
margin-top: -0.05rem;
}
b {
display: inline-block;
vertical-align: middle;
}
}
span {
color: #666666;
font-size: px2rem(28);
font-weight: 400;
white-space: nowrap;
}
}
}
}
.datasAct {
.line1 {
left: 50%;
transform: translateX(-50%);
}
.line2 {
display: none;
}
.datas {
width: 7rem;
.datas3 {
display: none;
}
}
}
.box {
width: px2rem(710);
min-height: px2rem(800);
background: #fff;
border-radius: px2rem(30);
margin: 0 auto px2rem(30);
box-sizing: border-box;
padding: px2rem(37) px2rem(0) 0 px2rem(23);
h3 {
color: #141515;
font-size: px2rem(34);
font-weight: 600;
margin: 0;
margin-left: px2rem(20);
margin-bottom: px2rem(38);
span {
display: inline-block;
width: px2rem(5);
height: px2rem(28);
margin-left: px2rem(-13);
background: #62D0A8;
margin-right: px2rem(10);
}
}
.box_in {
width: 100%;
height: 100%;
display: flex;
.fistBox {
width: px2rem(180);
float: left;
.fist {
width: px2rem(170);
height: px2rem(151);
margin-right: px2rem(30);
.title {
color: #666666;
width: 100%;
text-align: center;
font-size: px2rem(28);
margin-bottom: px2rem(23);
white-space: nowrap;
}
img {
display: block;
width: px2rem(32);
height: px2rem(32);
border-radius: 50%;
margin: 0 auto px2rem(5);
}
p {
width: 100%;
text-align: center;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
color: #848D9C;
font-size: px2rem(24);
font-weight: 500;
margin-bottom: px2rem(5);
}
b {
color: #A4ABB2;
font-size: px2rem(18);
font-weight: 500;
text-align: center;
display: block;
width: 100%;
}
}
}
.ordinaryBox {
height: 100%;
overflow-x: scroll;
&::-webkit-scrollbar {
// display: none;
}
.ordinaryBox_in {
width: 14.5rem;
height: 100%;
.ordinary {
min-width: px2rem(180);
height: px2rem(151);
float: left;
margin-right: px2rem(30);
.title {
color: #666666;
width: 100%;
text-align: center;
font-size: px2rem(28);
margin-bottom: px2rem(23);
}
p {
width: 100%;
text-align: center;
color: #848D9C;
font-size: px2rem(24);
font-weight: 500;
line-height: px2rem(90);
}
.true {
color: #4EA686;
}
.false {
color: #DC865D;
}
.details {
color: rgb(38, 156, 235);
}
}
}
}
.fistBox .fistAct {
.title {
opacity: 0;
}
}
.ordinaryBox_inAct .ordinary {
.title {
opacity: 0;
margin-bottom: px2rem(-20);
}
}
}
}
.english {
.back .title {
font-size: px2rem(32);
}
.header .datas div span {
font-size: px2rem(22);
}
.box .box_in .ordinaryBox .ordinaryBox_in {
width: 15rem;
.title {
font-size: px2rem(26);
}
}
.header .time span {
width: 2rem;
white-space: nowrap;
font-size: px2rem(24);
}
.header .time b {
white-space: nowrap;
font-size: px2rem(28);
}
.header .time img {
margin-right: 0.1rem;
}
.header .time div {
width: 5rem;
}
}
.arabic {
.back .title {
font-size: px2rem(32);
}
.header .datas div span {
font-size: px2rem(22);
}
.box h3 {
margin-right: px2rem(20);
}
.box span {
// margin-right: px2rem();
margin-left: 0;
margin-right: 0;
}
.box h3 b {
margin-right: 0.3rem;
}
.box h3 strong {
margin-right: 0.3rem;
}
.box .box_in .ordinaryBox .ordinaryBox_in {
width: 20rem;
.title {
font-size: px2rem(25);
}
}
.box .box_in .ordinaryBox .ordinaryBox_in .ordinary {
float: right;
}
.box .box_in .ordinaryBox {
margin-right: 0.4rem;
}
.header .time span {
width: 2rem;
white-space: nowrap;
font-size: px2rem(24);
}
.header .time b {
white-space: nowrap;
font-size: px2rem(26);
}
.header .time img {
margin-right: 0.1rem;
}
.header .time div {
width: 5rem;
}
}

View File

@@ -0,0 +1,344 @@
html,
body {
width: 100%;
height: 17.78667rem;
background: #F5F7F9;
}
.back {
width: 100%;
height: 2.4rem;
position: fixed;
left: 0;
top: 0rem;
text-align: center;
color: #FFFFFF;
font-size: 0.50667rem;
font-weight: bold;
z-index: 10;
background: #fff;
}
.back .backs {
width: 0.58667rem;
height: 0.58667rem;
position: absolute;
left: 0.24rem;
top: 58%;
z-index: 2;
}
.back .title {
position: absolute;
left: 50%;
transform: translateX(-50%);
height: 100%;
top: 0;
line-height: 3.46667rem;
color: #333333;
font-size: 0.45333rem;
font-weight: bold;
}
.back .text {
position: absolute;
right: 0.62667rem;
height: 100%;
top: 0;
line-height: 3.46667rem;
color: #333333;
font-size: 0.4rem;
}
.header {
width: 9.46667rem;
height: 6.34667rem;
background: #fff;
border-radius: 0.4rem;
margin: 2.8rem auto 0.34667rem;
overflow: hidden;
position: relative;
}
.header .time {
width: 100%;
height: 0.53333rem;
line-height: 0.53333rem;
display: flex;
justify-content: space-between;
box-sizing: border-box;
margin: 0.38667rem auto 0.76rem;
text-align: center;
padding: 0 0.26667rem;
color: #848D9C;
font-size: 0.4rem;
font-weight: 500;
}
.header .time div {
color: #5D636E;
width: 3rem;
}
.header .time span {
display: block;
width: 3rem;
}
.header h3 {
width: 100%;
box-sizing: border-box;
padding-left: 0.65333rem;
color: #141515;
font-size: 0.42667rem;
font-weight: 500;
margin-bottom: 0.72rem;
}
.header p {
height: 0.53333rem;
line-height: 0.53333rem;
width: 100%;
text-align: center;
color: #232424;
font-size: 0.69333rem;
font-weight: 500;
}
.header p img {
display: inline-block;
width: 0.53333rem;
height: 0.53333rem;
}
.header .user {
width: 1.70667rem;
height: 1.14667rem;
position: absolute;
left: 0.88rem;
top: 1.4rem;
text-align: center;
}
.header .user img {
display: block;
width: 1.14667rem;
height: 1.14667rem;
border-radius: 50%;
margin: 0 auto 0.05333rem;
}
.header .user p {
width: 100%;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
color: #333333;
font-size: 0.34667rem;
font-weight: 400;
margin-bottom: 0.02667rem;
}
.header .user b {
color: #A4ABB2;
font-size: 0.29333rem;
}
.header .line {
width: 8.76rem;
height: 0.01333rem;
background: #B0BACD;
position: absolute;
left: 50%;
transform: translateX(-50%);
top: 3.88rem;
}
.header .line1 {
width: 0.01333rem;
height: 1.02667rem;
background: #B0BACD;
position: absolute;
left: 2.94667rem;
top: 4.65333rem;
}
.header .line2 {
width: 0.01333rem;
height: 1.02667rem;
background: #B0BACD;
position: absolute;
left: 6.37333rem;
top: 4.65333rem;
}
.header .datas {
width: 8.76rem;
height: 1.24rem;
margin: 1.24rem auto 0;
display: flex;
justify-content: space-between;
}
.header .datas div {
width: 2.54667rem;
text-align: center;
}
.header .datas div p {
color: #232424;
font-size: 0.48rem;
font-weight: 500;
margin-bottom: 0.30667rem;
width: 100%;
}
.header .datas div p img {
display: inline-block;
width: 0.4rem;
height: 0.4rem;
vertical-align: middle;
}
.header .datas div p b {
display: inline-block;
vertical-align: middle;
}
.header .datas div span {
color: #666666;
font-size: 0.37333rem;
font-weight: 400;
}
.box {
width: 9.46667rem;
min-height: 10.66667rem;
background: #fff;
border-radius: 0.4rem;
margin: 0 auto 0.4rem;
box-sizing: border-box;
padding: 0.49333rem 0rem 0 0.30667rem;
}
.box h3 {
color: #141515;
font-size: 0.45333rem;
font-weight: 600;
margin: 0;
margin-left: 0.26667rem;
margin-bottom: 0.50667rem;
}
.box h3 span {
display: inline-block;
width: 0.06667rem;
height: 0.37333rem;
margin-left: -0.17333rem;
background: #62D0A8;
margin-right: 0.13333rem;
}
.box .box_in {
width: 100%;
height: 100%;
display: flex;
}
.box .box_in .fistBox {
width: 2.4rem;
float: left;
}
.box .box_in .fistBox .fist {
width: 2.26667rem;
height: 2.01333rem;
margin-right: 0.4rem;
}
.box .box_in .fistBox .fist .title {
color: #666666;
width: 100%;
text-align: center;
font-size: 0.37333rem;
margin-bottom: 0.30667rem;
white-space: nowrap;
}
.box .box_in .fistBox .fist img {
display: block;
width: 0.42667rem;
height: 0.42667rem;
border-radius: 50%;
margin: 0 auto 0.06667rem;
}
.box .box_in .fistBox .fist p {
width: 100%;
text-align: center;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
color: #848D9C;
font-size: 0.32rem;
font-weight: 500;
}
.box .box_in .fistBox .fist b {
color: #A4ABB2;
font-size: 0.24rem;
font-weight: 500;
text-align: center;
display: block;
width: 100%;
}
.box .box_in .ordinaryBox {
height: 100%;
overflow-x: scroll;
}
.box .box_in .ordinaryBox .ordinaryBox_in {
width: 15rem;
}
.box .box_in .ordinaryBox .ordinaryBox_in .ordinary {
width: 2.26667rem;
height: 2.01333rem;
float: left;
margin-right: 0.4rem;
}
.box .box_in .ordinaryBox .ordinaryBox_in .ordinary .title {
color: #666666;
width: 100%;
text-align: center;
font-size: 0.37333rem;
margin-bottom: 0.30667rem;
}
.box .box_in .ordinaryBox .ordinaryBox_in .ordinary p {
width: 100%;
text-align: center;
color: #848D9C;
font-size: 0.32rem;
font-weight: 500;
line-height: 1.2rem;
}
.box .box_in .ordinaryBox .ordinaryBox_in .ordinary .true {
color: #4EA686;
}
.box .box_in .ordinaryBox .ordinaryBox_in .ordinary .false {
color: #DC865D;
}
.box .box_in .fistBox .fistAct .title {
opacity: 0;
}
.box .box_in .ordinaryBox_inAct .ordinary .title {
opacity: 0;
margin-bottom: -0.26667rem;
}

View File

@@ -0,0 +1,355 @@
@function px2rem($px) {
@return $px / 75+rem;
}
html,
body {
width: 100%;
height: px2rem(1334);
background: #F5F7F9;
}
.back {
width: 100%;
height: px2rem(180);
position: fixed;
left: 0;
top: px2rem(0);
text-align: center;
color: #FFFFFF;
font-size: px2rem(38);
font-weight: bold;
z-index: 10;
background: #fff;
.backs {
width: px2rem(44);
height: px2rem(44);
position: absolute;
left: px2rem(18);
top: 58%;
z-index: 2;
}
.title {
position: absolute;
left: 50%;
transform: translateX(-50%);
height: 100%;
top: 0;
line-height: px2rem(260);
color: #333333;
font-size: px2rem(34);
font-weight: bold;
}
.text {
position: absolute;
right: px2rem(47);
height: 100%;
top: 0;
line-height: px2rem(260);
color: #333333;
font-size: px2rem(30);
}
}
.header {
width: px2rem(710);
height: px2rem(476);
background: #fff;
border-radius: px2rem(30);
margin: px2rem(210) auto px2rem(26);
overflow: hidden;
position: relative;
.time {
width: 100%;
height: px2rem(40);
line-height: px2rem(40);
display: flex;
justify-content: space-between;
box-sizing: border-box;
margin: px2rem(29) auto px2rem(57);
text-align: center;
padding: 0 px2rem(20);
color: #848D9C;
font-size: px2rem(30);
font-weight: 500;
div {
color: #5D636E;
width: 3rem;
}
span {
display: block;
width: 3rem;
}
}
h3 {
width: 100%;
box-sizing: border-box;
padding-left: px2rem(49);
color: #141515;
font-size: px2rem(32);
font-weight: 500;
margin-bottom: px2rem(54);
}
p {
height: px2rem(40);
line-height: px2rem(40);
width: 100%;
text-align: center;
color: #232424;
font-size: px2rem(52);
font-weight: 500;
img {
display: inline-block;
width: px2rem(40);
height: px2rem(40);
}
}
.user {
width: px2rem(128);
height: px2rem(86);
position: absolute;
left: px2rem(66);
top: px2rem(105);
text-align: center;
img {
display: block;
width: px2rem(86);
height: px2rem(86);
border-radius: 50%;
margin: 0 auto px2rem(4);
}
p {
width: 100%;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
color: #333333;
font-size: px2rem(26);
font-weight: 400;
margin-bottom: px2rem(2);
}
b {
color: #A4ABB2;
font-size: px2rem(22);
}
}
.line {
width: px2rem(657);
height: px2rem(1);
background: #B0BACD;
position: absolute;
left: 50%;
transform: translateX(-50%);
top: px2rem(291);
}
.line1 {
width: px2rem(1);
height: px2rem(77);
background: #B0BACD;
position: absolute;
left: px2rem(221);
top: px2rem(349);
}
.line2 {
width: px2rem(1);
height: px2rem(77);
background: #B0BACD;
position: absolute;
left: px2rem(478);
top: px2rem(349);
}
.datas {
width: px2rem(657);
height: px2rem(93);
margin: px2rem(93) auto 0;
display: flex;
justify-content: space-between;
div {
width: px2rem(191);
text-align: center;
p {
color: #232424;
font-size: px2rem(36);
font-weight: 500;
margin-bottom: px2rem(23);
width: 100%;
img {
display: inline-block;
width: px2rem(30);
height: px2rem(30);
vertical-align: middle;
}
b{
display: inline-block;
vertical-align: middle;
}
}
span {
color: #666666;
font-size: px2rem(28);
font-weight: 400;
}
}
}
}
.box {
width: px2rem(710);
min-height: px2rem(800);
background: #fff;
border-radius: px2rem(30);
margin: 0 auto px2rem(30);
box-sizing: border-box;
padding: px2rem(37) px2rem(0) 0 px2rem(23);
h3 {
color: #141515;
font-size: px2rem(34);
font-weight: 600;
margin: 0;
margin-left: px2rem(20);
margin-bottom: px2rem(38);
span {
display: inline-block;
width: px2rem(5);
height: px2rem(28);
margin-left: px2rem(-13);
background: #62D0A8;
margin-right: px2rem(10);
}
}
.box_in {
width: 100%;
height: 100%;
display: flex;
.fistBox {
width: px2rem(180);
float: left;
.fist {
width: px2rem(170);
height: px2rem(151);
margin-right: px2rem(30);
.title {
color: #666666;
width: 100%;
text-align: center;
font-size: px2rem(28);
margin-bottom: px2rem(23);
white-space: nowrap;
}
img {
display: block;
width: px2rem(32);
height: px2rem(32);
border-radius: 50%;
margin: 0 auto px2rem(5);
}
p {
width: 100%;
text-align: center;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
color: #848D9C;
font-size: px2rem(24);
font-weight: 500;
}
b {
color: #A4ABB2;
font-size: px2rem(18);
font-weight: 500;
text-align: center;
display: block;
width: 100%;
}
}
}
.ordinaryBox {
height: 100%;
overflow-x: scroll;
&::-webkit-scrollbar {
// display: none;
}
.ordinaryBox_in {
width: 15rem;
.ordinary {
width: px2rem(170);
height: px2rem(151);
float: left;
margin-right: px2rem(30);
.title {
color: #666666;
width: 100%;
text-align: center;
font-size: px2rem(28);
margin-bottom: px2rem(23);
}
p {
width: 100%;
text-align: center;
color: #848D9C;
font-size: px2rem(24);
font-weight: 500;
line-height: px2rem(90);
}
.true {
color: #4EA686;
}
.false {
color: #DC865D;
}
}
}
}
.fistBox .fistAct {
.title {
opacity: 0;
}
}
.ordinaryBox_inAct .ordinary {
.title {
opacity: 0;
margin-bottom: px2rem(-20);
}
}
}
}

View File

@@ -17,19 +17,35 @@
<b class="text2"></b> <b class="text2"></b>
</div> </div>
<!-- 公会昵称 --> <!-- 公会昵称 -->
<div class="nick"><span class="text3"></span><input class="text4" type="text" placeholder=""></div> <h3>公会名称</h3>
<!-- 公会背景 --> <div class="name">
<div class="bg"> <input disabled="true" type="text" placeholder="">
<span class="text5"></span> <span class="textConte2">修改</span>
<img src="./images/upDate.png" alt=""> </div>
<!-- 公会背景图 -->
<h3>公会背景图</h3>
<div class="background">
<img src="./images/logo.png" alt="" class="">
<span class="textConte2">修改</span>
<input type="file" id="backImageUpload" accept="image/*" onchange="fileChangeF(event)" class="upload" <input type="file" id="backImageUpload" accept="image/*" onchange="fileChangeF(event)" class="upload"
style="opacity: 0;"> style="opacity: 0;">
</div> </div>
<div class="boxBut"> <!-- 收款帐户 -->
<!-- 取消按钮 --> <h3 class="textConte4">收款帐户</h3>
<div class="close text6"></div> <div class="account payoneer">
<!-- 保存按钮 --> <i>payoneer:</i>
<div class="ok text7"></div> <input type="text" placeholder="请添加">
<span class="textConte1 act">添加</span>
</div>
<div class="account usdt">
<i>USDT-erc20:</i>
<input type="text" placeholder="请添加">
<span class="textConte1 act">添加</span>
</div>
<div class="account paypal">
<i>paypal:</i>
<input type="text" placeholder="请添加">
<span class="textConte1 act">添加</span>
</div> </div>
</body> </body>

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.3 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.8 MiB

After

Width:  |  Height:  |  Size: 2.6 MiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 21 KiB

After

Width:  |  Height:  |  Size: 3.8 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 20 KiB

After

Width:  |  Height:  |  Size: 1.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.1 KiB

View File

@@ -23,19 +23,43 @@
<!-- 工会长昵称 --> <!-- 工会长昵称 -->
<div class="nick"></div> <div class="nick"></div>
<div class="id"></div> <div class="id"></div>
<!-- 管理员设置 -->
<div class="adminSet text3"></div>
<!-- 公会信息设置 -->
<div class="guildInfoSet text4"></div>
<!-- 查看成员流水 -->
<div class="memberFlow text5"></div>
<!-- 邀请成员 -->
<div class="inveMember text6"></div>
<!-- 查看成员流水 -->
<div class="memberFlowMy text7"></div>
<!-- 工会昵称 --> <!-- 工会昵称 -->
<!-- 公会:公会昵称 --> <!-- 公会:公会昵称 -->
<div class="guildNick"></div> <!-- <div class="guildNick"></div> -->
<!-- 管理员设置 -->
<!-- <div class="adminSet text3"></div> -->
<!-- 公会信息设置 -->
<!-- <div class="guildInfoSet text4"></div> -->
<!-- 查看成员流水 -->
<!-- <div class="memberFlow text5"></div> -->
<!-- 查看成员流水 -->
<!-- <div class="memberFlowMy text7"></div> -->
<!-- 邀请成员 -->
<!-- <div class="inveMember text6"></div> -->
<div class="headerBox">
<div class="memberFlow">
<img src="./images/icon1.png" alt="">
<span class="texts1"></span>
</div>
<div class="memberFlow2">
<img src="./images/icon2.png" alt="">
<span class="texts2"></span>
</div>
<div class="guildInfoSet">
<img src="./images/icon3.png" alt="">
<span class="texts3"></span>
</div>
<div class="adminSet">
<img src="./images/icon4.png" alt="">
<span class="texts4"></span>
</div>
<div class="myWages">
<img src="./images/icon2.png" alt="">
<span class="texts5"></span>
</div>
</div>
</div> </div>
<!-- 公会成员列表 --> <!-- 公会成员列表 -->
<div class="guildList"> <div class="guildList">
@@ -71,6 +95,11 @@
</div> </div>
</div> </div>
</div> </div>
<!-- 邀请成员 -->
<div class="inveMember">
<img src="./images/inveMemberIcon.png" alt="">
<span class="text6">邀请成员</span>
</div>
</body> </body>
</html> </html>

View File

@@ -4,11 +4,14 @@ let env = EnvCheck();
if (env == 'test') { if (env == 'test') {
new VConsole(); new VConsole();
} }
var urlDate = getQueryString().guildNick; var urlDate = getQueryString();
// 封裝layer消息提醒框 // 封裝layer消息提醒框
let layerIndex let layerIndex
var langReplace; var langReplace;
var localLang; var localLang;
var newBg;
var textConte1;
var textConte2;
const showLoading = (content = langReplace(localLang.demoModule.layerIndex1)) => { const showLoading = (content = langReplace(localLang.demoModule.layerIndex1)) => {
layer.open({ layer.open({
type: 2, type: 2,
@@ -44,14 +47,33 @@ $(function () {
}; };
// 頂部返回事件 // 頂部返回事件
$('.back img').click(() => { $('.back img').click(() => {
window.location.href = document.referrer; window.location.href = './index.html';
}) })
// pubInfo['Accept-Language'] = 'ar' // pubInfo['Accept-Language'] = 'ar'
fuzzyMatchUpdateQueryStringParameterFun(); // 判断语言 fuzzyMatchUpdateQueryStringParameterFun(); // 判断语言
langReplace = window.lang.replace; langReplace = window.lang.replace;
localLang = window.lang; localLang = window.lang;
translateFun(); translateFun();
$('.nick input').val(urlDate); textConte1 = langReplace(localLang.guildInfoSet.textConte1);
textConte2 = langReplace(localLang.guildInfoSet.textConte2);
$('.name input').val(urlDate.guildNick);
$('.payoneer input').val(urlDate.payoneer);
$('.usdt input').val(urlDate.usdt);
$('.paypal input').val(urlDate.payPal);
$('.background img').attr('src', urlDate.backgroundUrl);
newBg = urlDate.backgroundUrl;
if (urlDate.payoneer != '') {
$('.payoneer span').hide();
$('.payoneer input').attr('disabled', true);
}
if (urlDate.usdt != '') {
$('.usdt span').hide();
$('.usdt input').attr('disabled', true);
}
if (urlDate.payPal != '') {
$('.paypal span').hide();
$('.paypal input').attr('disabled', true);
}
}, 100) }, 100)
}) })
function translateFun() { function translateFun() {
@@ -64,8 +86,13 @@ function translateFun() {
$('.text5').text(langReplace(localLang.guildInfoSet.text5)); $('.text5').text(langReplace(localLang.guildInfoSet.text5));
$('.text6').text(langReplace(localLang.guildInfoSet.text6)); $('.text6').text(langReplace(localLang.guildInfoSet.text6));
$('.text7').text(langReplace(localLang.guildInfoSet.text7)); $('.text7').text(langReplace(localLang.guildInfoSet.text7));
$('.textConte2').text(langReplace(localLang.guildInfoSet.textConte2));
$('.textConte3').text(langReplace(localLang.guildInfoSet.textConte3));
$('.textConte1').text(langReplace(localLang.guildInfoSet.textConte1));
$('.textConte4').text(langReplace(localLang.guildInfoSet.textConte4));
} }
// 上傳身份證接口 // 上傳图片接口
function getUploadToken() { function getUploadToken() {
const backImage = document.getElementById('backImageUpload').files[0]; const backImage = document.getElementById('backImageUpload').files[0];
showLoading() showLoading()
@@ -85,9 +112,9 @@ function getUploadToken() {
observable.subscribe({ observable.subscribe({
complete: (res) => { complete: (res) => {
console.log(res); console.log(res);
$('.bg img').attr('src', res.path); $('.background img').attr('src', res.path);
hideLoading(layerIndex) setInfo(null, res.path, function () { });
toastMsg(langReplace(localLang.guildInfoSet.text8)) // toastMsg(langReplace(localLang.guildInfoSet.text8))
}, },
}); });
} else { } else {
@@ -110,7 +137,7 @@ function fileChangeF(e) {
} }
// 保存接口 // 保存接口
function setInfo(name, backgroundUrl) { function setInfo(name, backgroundUrl, fun) {
showLoading() showLoading()
networkRequest({ networkRequest({
type: 'post', type: 'post',
@@ -118,7 +145,8 @@ function setInfo(name, backgroundUrl) {
data: { name, backgroundUrl }, data: { name, backgroundUrl },
success(res) { success(res) {
if (res.code === 200) { if (res.code === 200) {
window.location.href = "./index.html" fun();
// window.location.href = "./index.html"
} else { } else {
toastMsg(res.message) toastMsg(res.message)
} }
@@ -135,4 +163,67 @@ $('.boxBut .ok').click(function () {
var name = $('.nick input').val(); var name = $('.nick input').val();
var bgUrl = $('.bg img').attr('src'); var bgUrl = $('.bg img').attr('src');
setInfo(name, bgUrl); setInfo(name, bgUrl);
})
// 修改昵称按钮
var statusName = true;
$('.name span').click(function () {
if (statusName) {
$('.name span').addClass('act');
$('.name span').text(textConte1);
$('.name input').attr("disabled", false);
$('.name input').val("");
$('.name input').focus();
statusName = false;
} else {
var funParams = function (params) {
$('.name span').removeClass('act');
$('.name span').text(textConte2);
$('.name input').attr("disabled", true);
$('.name input').val($('.name input').val())
statusName = true;
}
setInfo($('.name input').val(), null, funParams)
}
})
// 保存账户接口
function savePayAccount(payoneer, usdt, payPal, fun) {
showLoading()
networkRequest({
type: 'post',
url: urlPrefix + '/family/savePayAccount',
data: { payoneer, usdt, payPal },
success(res) {
if (res.code === 200) {
fun();
} else {
toastMsg(res.message)
}
hideLoading(layerIndex)
},
error(err) {
hideLoading(layerIndex)
toastMsg(langReplace(localLang.demoModule.layerIndex3))
}
})
}
$('.payoneer span').click(function () {
var funParams = function (params) {
$('.payoneer input').val($('.payoneer input').val())
$('.payoneer span').hide();
}
savePayAccount($('.payoneer input').val(), null, null, funParams)
})
$('.usdt span').click(function () {
var funParams = function (params) {
$('.usdt input').val($('.usdt input').val())
$('.usdt span').hide();
}
savePayAccount(null, $('.usdt input').val(), null, funParams)
})
$('.paypal span').click(function () {
var funParams = function (params) {
$('.paypal input').val($('.paypal input').val())
$('.paypal span').hide();
}
savePayAccount(null, null, $('.paypal input').val(), funParams)
}) })

View File

@@ -31,6 +31,11 @@ const toastMsg = (content = langReplace(localLang.demoModule.layerIndex2), time
var roleTypes; var roleTypes;
var searTime; var searTime;
var guildNick; var guildNick;
var backgroundUrl;
var payoneer;
var usdt;
var payPal;
var familyMemberId;
// 初始化函數 // 初始化函數
$(function () { $(function () {
getInfoFromClient(); getInfoFromClient();
@@ -73,30 +78,37 @@ function translateFun() {
$('.text9').text(langReplace(localLang.demoModule.text9)); $('.text9').text(langReplace(localLang.demoModule.text9));
$('.text10').text(langReplace(localLang.demoModule.text10)); $('.text10').text(langReplace(localLang.demoModule.text10));
$('.text16').attr('placeholder', langReplace(localLang.demoModule.text16)); $('.text16').attr('placeholder', langReplace(localLang.demoModule.text16));
$('.texts1').text(langReplace(localLang.demoModule.texts1));
$('.texts2').text(langReplace(localLang.demoModule.texts2));
$('.texts3').text(langReplace(localLang.demoModule.texts3));
$('.texts4').text(langReplace(localLang.demoModule.texts4));
$('.texts5').text(langReplace(localLang.demoModule.texts5));
} }
// 判断公会身份函数 // 判断公会身份函数
function guildFun(type) { function guildFun(type) {
// 公会长 // 公会长
if (type == 1) { if (type == 1) {
$('.header .adminSet').show()
$('.header .guildInfoSet').show()
$('.header .memberFlow').show()
$('.header .inveMember').show()
$('.guildList .top img').show() $('.guildList .top img').show()
$('.guildList .top input').show() $('.guildList .top input').show()
$('.header .headerBox .myWages').hide()
} }
// 管理员 // 管理员
else if (type == 2) { else if (type == 2) {
$('.header .memberFlow').show() $('.header .headerBox .guildInfoSet').hide();
$('.header .inveMember').show() $('.header .headerBox .adminSet').hide();
$('.guildList .top img').show()
$('.guildList .top input').show() $('.guildList .top input').show()
$('.memberFlow2').hide()
} }
// 普通成员 // 普通成员
else if (type == 3) { else if (type == 3) {
$('.header .headerBox .guildInfoSet').hide();
$('.header .headerBox .adminSet').hide();
$('.header .headerBox .memberFlow').hide();
$('.header .memberFlowMy').show() $('.header .memberFlowMy').show()
$('.header .guildNick').show() $('.header .guildNick').show()
$('.guildList .top input').show() $('.guildList .top input').show()
$('.memberFlow2').hide();
} }
// 非公会成员 // 非公会成员
else { else {
@@ -113,11 +125,22 @@ function get() {
// 判断身份 // 判断身份
roleTypes = res.data.roleType; roleTypes = res.data.roleType;
guildFun(roleTypes); guildFun(roleTypes);
if (res.data.wageEnable == false) {
// $('.memberFlow2').hide();
}
$('.text2').text(res.data.name) $('.text2').text(res.data.name)
// 渲染基本信息 // 渲染基本信息
$('.header .tx').attr('src', res.data.me.avatar); $('.header .tx').attr('src', res.data.me.avatar);
$('.header .nick').text(res.data.me.nick); $('.header .nick').text(res.data.me.nick);
guildNick = res.data.name; guildNick = res.data.name;
backgroundUrl = res.data.backgroundUrl;
console.log(res.data);
if (res.data.payAccount) {
payoneer = res.data.payAccount.payoneer;
usdt = res.data.payAccount.usdt;
payPal = res.data.payAccount.payPal;
}
familyMemberId = res.data.familyMemberId;
$('.header .id').text('ID' + res.data.me.erbanNo); $('.header .id').text('ID' + res.data.me.erbanNo);
$('.header').css({ "background": `url(${res.data.backgroundUrl}) no-repeat`, "background-size": "100% 100%" }); $('.header').css({ "background": `url(${res.data.backgroundUrl}) no-repeat`, "background-size": "100% 100%" });
$('.header .guildNick').text(langReplace(localLang.demoModule.text11) + res.data.name); $('.header .guildNick').text(langReplace(localLang.demoModule.text11) + res.data.name);
@@ -263,17 +286,21 @@ $('.header .adminSet').click(function () {
}) })
// 公会信息设置 // 公会信息设置
$('.header .guildInfoSet').click(function () { $('.header .guildInfoSet').click(function () {
window.location.href = `./guildInfoSet.html?guildNick=${guildNick}` window.location.href = `./guildInfoSet.html?guildNick=${guildNick}&backgroundUrl=${backgroundUrl}&payoneer=${payoneer}&usdt=${usdt}&payPal=${payPal}`
}) })
// 查看成员流水 // 金币收入统计
$('.header .memberFlow').click(function (params) { $('.header .memberFlow').click(function (params) {
window.location.href = `./memberFlow.html` window.location.href = `./memberFlow.html`
}) })
// 查看个人流水 // 工资收入统计
$('.header .memberFlowMy').click(function (params) { $('.header .memberFlow2').click(function (params) {
window.location.href = `./memberFlow2.html` window.location.href = `./memberFlow2.html`
}) })
// 查看成员流水 // 邀请成员
$('.header .inveMember').click(function (params) { $('.inveMember').click(function (params) {
window.location.href = `./invitation.html` window.location.href = `./invitation.html`
})
// 我的工资
$(`.myWages`).click(function (params) {
window.location.href = `./memberFlow222.html?familyMemberId=${familyMemberId}`
}) })

File diff suppressed because it is too large Load Diff

View File

@@ -28,11 +28,10 @@ const toastMsg = (content = langReplace(localLang.demoModule.layerIndex2), time
skin: 'msg' skin: 'msg'
}) })
} }
// var times = new Date().getTime() - 86400000; var date_obj = lay_picker_date.getDateTime();
var times = new Date().getTime(); var date_obj2 = lay_picker_date.getDateTime();
var startDates; var startDates;
var endDates; var endDates;
var timestamp;
// 初始化函數 // 初始化函數
$(function () { $(function () {
getInfoFromClient(); getInfoFromClient();
@@ -54,8 +53,53 @@ $(function () {
langReplace = window.lang.replace; langReplace = window.lang.replace;
localLang = window.lang; localLang = window.lang;
translateFun(); translateFun();
//初始化时间插件 // 选择日期1
this.initTime() layPicker.init({
elem: '#date', // 绑定元素
type: 2, // 类型2微信效果 类型3自定义不设置则默认效果
radius: 15,
options: 'date', // 设置为日期选择器日期选择器可设置year、month、date、time、timesecond、datetime、datetimesecond不设置默认取data作为选择值
onSuccess: function (index, elem) { // 渲染成功回调
$('.header .time div').eq(0).children('b').text(`${date_obj.year}-${date_obj.month}-${date_obj.day}`)
startDates = `${date_obj.year}-${date_obj.month}-${date_obj.day}`
// 选择日期2
layPicker.init({
elem: '#date2', // 绑定元素
type: 2, // 类型2微信效果 类型3自定义不设置则默认效果
radius: 15,
options: 'date', // 设置为日期选择器日期选择器可设置year、month、date、time、timesecond、datetime、datetimesecond不设置默认取data作为选择值
onSuccess: function (index, elem) { // 渲染成功回调
endDates = `${date_obj2.year}-${date_obj2.month}-${date_obj2.day}`
$('.header .time div').eq(1).children('b').text(`${date_obj2.year}-${date_obj2.month}-${date_obj2.day}`)
memberIncome();
},
onConfirm: function (index, value, result) { // 点击确认回调
endDates = `${result[0].value}-${result[1].value}-${result[2].value}`
if (Date.parse(startDates) > Date.parse(endDates)) {
toastMsg(langReplace(localLang.memberFlow.text15))
} else if ((Date.parse(endDates) - Date.parse(startDates)) > (30 * 24 * 60 * 60 * 1000)) {
toastMsg(langReplace(localLang.memberFlow.text16))
} else {
$('.header .time div').eq(1).children('b').text(`${result[0].value}-${result[1].value}-${result[2].value}`)
memberIncome();
}
},
})
},
onConfirm: function (index, value, result) { // 点击确认回调
startDates = `${result[0].value}-${result[1].value}-${result[2].value}`;
if (Date.parse(startDates) > Date.parse(endDates)) {
toastMsg(langReplace(localLang.memberFlow.text4))
} else if ((Date.parse(endDates) - Date.parse(startDates)) > (30 * 24 * 60 * 60 * 1000) * 3) {
toastMsg(langReplace(localLang.memberFlow.text5))
} else {
$('.header .time div').eq(0).children('b').text(`${result[0].value}-${result[1].value}-${result[2].value}`)
memberIncome();
}
},
})
}, 100) }, 100)
}) })
function translateFun() { function translateFun() {
@@ -64,78 +108,55 @@ function translateFun() {
$('.text1').text(langReplace(localLang.memberFlow.text1)); $('.text1').text(langReplace(localLang.memberFlow.text1));
$('.text2').text(langReplace(localLang.memberFlow.text2)); $('.text2').text(langReplace(localLang.memberFlow.text2));
$('.text3').text(langReplace(localLang.memberFlow.text3)); $('.text3').text(langReplace(localLang.memberFlow.text3));
$('.text4').text(langReplace(localLang.memberFlow.text4));
$('.text5').text(langReplace(localLang.memberFlow.text5));
$('.text6').text(langReplace(localLang.memberFlow.text6));
$('.text7').text(langReplace(localLang.memberFlow.text7));
$('.text8').text(langReplace(localLang.memberFlow.text8));
$('.text9').text(langReplace(localLang.memberFlow.text9));
$('.text10').text(langReplace(localLang.memberFlow.text10));
$('.text11').text(langReplace(localLang.memberFlow.text11));
} }
function initTime() { // 获取数据接口
// console.log(dateFormat(times, 'yyyy-MM-dd')); function memberIncome() {
$('.timeBox .year b').text(dateFormat(times, 'yyyy')); $('.box .box_in .fistBox .fist').remove();
$('.timeBox .startTime b').text(`${dateFormat(times, 'MM')}-${dateFormat(times, 'dd')}`); $('.box .box_in .ordinaryBox .ordinaryBox_in').remove();
$('.timeBox .endTime b').text(`${dateFormat(times, 'MM')}-${dateFormat(times, 'dd')}`);
startDates = endDates = dateFormat(times, 'yyyy-MM-dd');
$.selectYY_MM_DD("#select_0", {}, function (data) {
$('.timeBox .year b').text(data.year);
$('.timeBox .startTime b').text(`${data.month}-${data.day}`)
startDates = `${data.year}-${data.month}-${data.day}`;
})
$.selectYY_MM_DD("#select_1", {}, function (data) {
$('.timeBox .year b').text(data.year);
$('.timeBox .endTime b').text(`${data.month}-${data.day}`)
endDates = `${data.year}-${data.month}-${data.day}`;
})
memberIncome(dateFormat(times, 'yyyy-MM-dd'), dateFormat(times, 'yyyy-MM-dd'));
}
// 流水接口
function memberIncome(startDate, endDate) {
$('.list .other').remove();
showLoading()
networkRequest({ networkRequest({
type: 'get', type: 'get',
url: urlPrefix + '/family/memberIncome', url: urlPrefix + '/family/memberIncome',
data: { startDate, endDate }, data: { startDate: startDates, endDate: endDates },
success(res) { success(res) {
if (res.code === 200) { if (res.code === 200) {
var str = ''; // 处理头部数值
if (res.data.length == 0) { $('.totalGoldIncome').text(res.data.totalGoldIncome);
str += ` // $('.totalGoldIncome').text(unitProcessingAr(res.data.totalGoldIncome, 0));
<li class="other"> var strLeft = '';
<div class="div11" style="line-height: 2.01333rem;">${langReplace(localLang.memberFlow.text12)}</div> var strRight = '';
<div>${langReplace(localLang.memberFlow.text12)}</div> res.data.memberIncomeList.forEach((res, i) => {
<div>${langReplace(localLang.memberFlow.text12)}</div> strLeft += `
<div>${langReplace(localLang.memberFlow.text12)}</div> <div class="fist ${i > 0 ? 'fistAct' : ''}">
<div>${langReplace(localLang.memberFlow.text12)}</div> <div class="title">${localLang.memberFlow2.text10}</div>
</li> <div class="user">
<img src="${res.member.avatar}" alt="" class="tx">
<div class="ts ${res.member.roleType == 1 ? 'i' : ''}"><i>${langReplace(localLang.memberFlow.text9)}</i></div>
<p>${res.member.nick}</p>
<b>ID:${res.member.erbanNo}${res.member.enable ? '' : `(${langReplace(localLang.lay.departed)})`}</b>
</div>
</div>
` `
} else { strRight += `
$('.timeBox .right .div1 b').text(res.data.totalGoldIncome); <div class="ordinaryBox_in ${i > 0 ? 'ordinaryBox_inAct' : ''}">
$('.timeBox .right .div2 b').text(res.data.totalDiamondRemain); <div class="ordinary">
res.data.memberIncomeList.forEach(val => { <div class="title">${langReplace(localLang.memberFlow.text6)}</div>
str += ` <p class="">${res.goldIncome}</p>
<li class="other"> </div>
<div class="div11"> <div class="ordinary">
<img src="${val.member.avatar}" alt=""> <div class="title">${langReplace(localLang.memberFlow.text7)}</div>
<p class="nick">${val.member.nick}</p> <p class="">${res.micRemainTime}</p>
<b class="id">ID:${val.member.erbanNo}</b> </div>
</div> <div class="ordinary">
<div>${val.micRemainTime}</div> <div class="title">${langReplace(localLang.memberFlow.text8)}</div>
<div>${val.goldIncome}</div> <p class="">${res.sendGiftUserNum}</p>
<div>${val.diamondRemain}</div> </div>
<div>${val.sendGiftUserNum}</div> </div>
</li>
` `
}) })
} $('.box .box_in .fistBox').append(strLeft);
$('.list').append(str); $('.box .box_in .ordinaryBox').append(strRight);
timestamp = res.timestamp;
} else { } else {
toastMsg(res.message) toastMsg(res.message)
timestamp = res.timestamp;
} }
hideLoading(layerIndex) hideLoading(layerIndex)
}, },
@@ -144,20 +165,7 @@ function memberIncome(startDate, endDate) {
toastMsg(langReplace(localLang.demoModule.layerIndex3)) toastMsg(langReplace(localLang.demoModule.layerIndex3))
} }
}) })
}
// 查询按钮
$('.back .text').click(function () {
// if ((Date.parse(endDates)) >= timestamp) {
// toastMsg(langReplace(localLang.memberFlow.text13))
// } else if (endDates == dateFormat(timestamp, 'yyyy-MM-dd')) {
// toastMsg(langReplace(localLang.memberFlow.text14))
// } else
if (Date.parse(startDates) > Date.parse(endDates)) { }
toastMsg(langReplace(localLang.memberFlow.text15))
} else if ((Date.parse(endDates) - Date.parse(startDates)) > (30 * 24 * 60 * 60 * 1000)) {
toastMsg(langReplace(localLang.memberFlow.text16))
} else {
memberIncome(startDates, endDates)
}
})

View File

@@ -28,11 +28,17 @@ const toastMsg = (content = langReplace(localLang.demoModule.layerIndex2), time
skin: 'msg' skin: 'msg'
}) })
} }
// var times = new Date().getTime() - 86400000; var nowTime;
var times = new Date().getTime(); var indexTime = 0;
var startDates; var date_obj = lay_picker_date.getDateTime();
var endDates; var years = lay_picker_date.getYear();
var timestamp; var months = lay_picker_date.getMonth(
[
{ value: date_obj.year },
]
);
const date = new Date();
const currentMonth = date.getMonth() + 1 < 10 ? "0" + (date.getMonth() + 1) : date.getMonth() + 1;
// 初始化函數 // 初始化函數
$(function () { $(function () {
getInfoFromClient(); getInfoFromClient();
@@ -54,8 +60,44 @@ $(function () {
langReplace = window.lang.replace; langReplace = window.lang.replace;
localLang = window.lang; localLang = window.lang;
translateFun(); translateFun();
//初始化时间插件 // 选择年月
this.initTime() layPicker.init({
elem: '#month', // 绑定元素
type: 2, // 类型2微信效果 类型3自定义不设置则默认效果
title: '',
radius: 15,
data: [years, months], // 列数值
onSuccess: function (index, elem) { // 渲染成功回调
// 默认值设置(赋值)
layPicker.setValue(index, [
{ value: date_obj.year },
{ value: date_obj.month },
])
indexTime = index;
nowTime = `${date_obj.year}-${date_obj.month}`
var currentMonthVal = currentMonth == date_obj.month ? ` (${langReplace(localLang.memberFlow2.text17)}) ` : ''
$('.header .time div b').text(`${date_obj.year}-${date_obj.month}${currentMonthVal}`)
$('.box h3 b').text(`${date_obj.year}-${date_obj.month}`)
if (currentMonth == date_obj.month) {
$('.header').removeClass('datasAct')
} else {
$('.header').addClass('datasAct')
}
familyWage(nowTime)
},
onConfirm: function (index, value, result) { // 点击确认回调
indexTime = index;
nowTime = value;
$('.header .time div b').text(value + `${result[index].value == currentMonth ? ` (${langReplace(localLang.memberFlow2.text17)}) ` : ''}`)
$('.box h3 b').text(`${nowTime}`)
if (result[index].value == currentMonth) {
$('.header').removeClass('datasAct')
} else {
$('.header').addClass('datasAct')
}
familyWage(nowTime)
},
})
}, 100) }, 100)
}) })
function translateFun() { function translateFun() {
@@ -70,69 +112,66 @@ function translateFun() {
$('.text7').text(langReplace(localLang.memberFlow2.text7)); $('.text7').text(langReplace(localLang.memberFlow2.text7));
$('.text8').text(langReplace(localLang.memberFlow2.text8)); $('.text8').text(langReplace(localLang.memberFlow2.text8));
$('.text9').text(langReplace(localLang.memberFlow2.text9)); $('.text9').text(langReplace(localLang.memberFlow2.text9));
$('.text10').text(langReplace(localLang.memberFlow2.text10));
$('.text11').text(langReplace(localLang.memberFlow2.text11));
$('.text12').text(langReplace(localLang.memberFlow2.text12));
} }
function initTime() { // 获取数据接口
// console.log(dateFormat(times, 'yyyy-MM-dd')); function familyWage(month) {
$('.timeBox .year b').text(dateFormat(times, 'yyyy')); $('.box .box_in .fistBox .fist').remove();
$('.timeBox .startTime b').text(`${dateFormat(times, 'MM')}-${dateFormat(times, 'dd')}`); $('.box .box_in .ordinaryBox .ordinaryBox_in').remove();
$('.timeBox .endTime b').text(`${dateFormat(times, 'MM')}-${dateFormat(times, 'dd')}`);
startDates = endDates = dateFormat(times, 'yyyy-MM-dd');
$.selectYY_MM_DD("#select_0", {}, function (data) {
$('.timeBox .year b').text(data.year);
$('.timeBox .startTime b').text(`${data.month}-${data.day}`)
startDates = `${data.year}-${data.month}-${data.day}`;
})
$.selectYY_MM_DD("#select_1", {}, function (data) {
$('.timeBox .year b').text(data.year);
$('.timeBox .endTime b').text(`${data.month}-${data.day}`)
endDates = `${data.year}-${data.month}-${data.day}`;
})
memberIncome(dateFormat(times, 'yyyy-MM-dd'), dateFormat(times, 'yyyy-MM-dd'));
}
// 流水接口
function memberIncome(startDate, endDate) {
$('.list .other').remove();
showLoading()
networkRequest({ networkRequest({
type: 'get', type: 'get',
url: urlPrefix + '/family/income', url: urlPrefix + '/family/wage',
data: { startDate, endDate }, data: { month },
success(res) { success(res) {
if (res.code === 200) { if (res.code === 200) {
var str = ''; // 处理头部数值
if (res.data.length == 0) { $('.totalWage').text(res.data.totalWage);
str += ` // $('.totalWage').text(unitProcessingAr(res.data.totalWage, 0));
<li class="other"> $('.header .datas1 p b').text(unitProcessingAr(res.data.goldWage, 1))
<div>${langReplace(localLang.memberFlow.text12)}</div> $('.header .datas2 p b').text(unitProcessingAr(res.data.agentWage, 1))
<div>${langReplace(localLang.memberFlow.text12)}</div> $('.header .datas3 p b').text(unitProcessingAr(res.data.diamondRemain, 1))
<div>${langReplace(localLang.memberFlow.text12)}</div> var strLeft = '';
<div>${langReplace(localLang.memberFlow.text12)}</div> var strRight = '';
<div>${langReplace(localLang.memberFlow.text12)}</div> res.data.memberWageList.forEach((res, i) => {
</li> strLeft += `
<div class="fist ${i > 0 ? 'fistAct' : ''}">
<div class="title">${localLang.memberFlow2.text10}</div>
<div class="user">
<img src="${res.avatar}" alt="" class="tx">
<div class="ts ${pubInfo.uid == res.uid ? 'i' : ''}"><i>${langReplace(localLang.memberFlow.text9)}</i></div>
<p>${res.nick}</p>
<b>ID:${res.erbanNo}${res.enable ? '' : `(${langReplace(localLang.lay.departed)})`}</b>
</div>
</div>
` `
} else { strRight += `
$('.timeBox .right .div1 b').text(res.data.totalGoldIncome); <div class="ordinaryBox_in ${i > 0 ? 'ordinaryBox_inAct' : ''}">
$('.timeBox .right .div2 b').text(res.data.totalDiamondRemain); <div class="ordinary">
res.data.incomeList.forEach(val => { <div class="title">${localLang.memberFlow2.text11}</div>
str += ` <p class="">${res.micVaildDays}</p>
<li class="other"> </div>
<div>${dateFormat(val.date, 'yyyy-MM-dd')}</div> <div class="ordinary">
<div>${val.micRemainTime}</div> <div class="title">${localLang.memberFlow2.text12}</div>
<div>${val.goldIncome}</div> <p class="">${unitProcessingAr(res.goldIncome, 1)}</p>
<div>${val.diamondRemain}</div> </div>
<div>${val.sendGiftUserNum}</div> <div class="ordinary">
</li> <div class="title">${localLang.memberFlow2.text13}</div>
<p class="tre">${unitProcessingAr(res.goldWage, 1)}</p>
</div>
<div class="ordinary">
<div class="title">${localLang.memberFlow2.text14}</div>
<p class="">${unitProcessingAr(res.diamondRemain, 1)}</p>
</div>
<div class="ordinary">
<div class="title">${localLang.memberFlow2.text15}</div>
<p class=" details" familyMemberId=${res.familyMemberId} avatar=${res.avatar} nick=${res.nick} erbanNo=${res.erbanNo}>${localLang.memberFlow2.text16}</p>
</div>
</div>
` `
}) })
} $('.box .box_in .fistBox').append(strLeft);
$('.list').append(str); $('.box .box_in .ordinaryBox').append(strRight);
timestamp = res.timestamp;
} else { } else {
toastMsg(res.message) toastMsg(res.message)
timestamp = res.timestamp;
} }
hideLoading(layerIndex) hideLoading(layerIndex)
}, },
@@ -141,28 +180,105 @@ function memberIncome(startDate, endDate) {
toastMsg(langReplace(localLang.demoModule.layerIndex3)) toastMsg(langReplace(localLang.demoModule.layerIndex3))
} }
}) })
}
// 跳转客户端兑换金币页面
$('.timeBox .right .goToExchangeGold').click(function () {
if (browser.android) {
window.androidJsObj.goToExchangeGold()
} else {
window.webkit.messageHandlers.goToExchangeGold.postMessage(0)
}
})
// 查询按钮
$('.back .text').click(function () {
// if ((Date.parse(endDates)) >= timestamp) {
// toastMsg(langReplace(localLang.memberFlow.text13))
// } else if (endDates == dateFormat(timestamp, 'yyyy-MM-dd')) {
// toastMsg(langReplace(localLang.memberFlow.text14))
// } else
if (Date.parse(startDates) > Date.parse(endDates)) { }
toastMsg(langReplace(localLang.memberFlow.text15)) // 前一个月
} else if ((Date.parse(endDates) - Date.parse(startDates)) > (30 * 24 * 60 * 60 * 1000)) { $('.previousMonth').click(function () {
toastMsg(langReplace(localLang.memberFlow.text16)) var obj = getPreMonth(nowTime, 1);
layPicker.setValue(indexTime, [
{ value: obj.year },
{ value: obj.month },
])
nowTime = `${obj.year}-${obj.month}`
$('.box h3 b').text(`${nowTime}`)
$('.header .time div b').text(`${obj.year}-${obj.month}` + `${obj.month == currentMonth ? ` (${langReplace(localLang.memberFlow2.text17)}) ` : ''}`)
if (obj.month == currentMonth) {
$('.header').removeClass('datasAct')
} else { } else {
memberIncome(startDates, endDates) $('.header').addClass('datasAct')
} }
familyWage(nowTime)
})
// 后一个月
$('.nextMonth').click(function () {
var obj = getPreMonth(nowTime, 2);
layPicker.setValue(indexTime, [
{ value: obj.year },
{ value: obj.month },
])
nowTime = `${obj.year}-${obj.month}`
$('.header .time div b').text(`${obj.year}-${obj.month}` + `${obj.month == currentMonth ? ` (${langReplace(localLang.memberFlow2.text17)}) ` : ''}`)
$('.box h3 b').text(`${nowTime}`)
if (obj.month == currentMonth) {
$('.header').removeClass('datasAct')
} else {
$('.header').addClass('datasAct')
}
familyWage(nowTime)
})
function getPreMonth(date, type) {//1上2下
if (type == 1) {
var arr = date.split('-');
var year = arr[0]; //获取当前日期的年份
var month = arr[1]; //获取当前日期的月份
var day = arr[2]; //获取当前日期的日
var days = new Date(year, month, 0);
days = days.getDate(); //获取当前日期中月的天数
var year2 = year;
var month2 = parseInt(month) - 1;
if (month2 == 0) {
year2 = parseInt(year2) - 1;
month2 = 12;
}
var day2 = day;
var days2 = new Date(year2, month2, 0);
days2 = days2.getDate();
if (day2 > days2) {
day2 = days2;
}
if (month2 < 10) {
month2 = '0' + month2;
}
var t2 = year2 + '-' + month2;
return {
year: year2,
month: month2,
};
} else {
var arr = date.split('-');
var year = arr[0]; //获取当前日期的年份
var month = arr[1]; //获取当前日期的月份
var day = arr[2]; //获取当前日期的日
var days = new Date(year, month, 0);
days = days.getDate(); //获取当前日期中的月的天数
var year2 = year;
var month2 = parseInt(month) + 1;
if (month2 == 13) {
year2 = parseInt(year2) + 1;
month2 = 1;
}
var day2 = day;
var days2 = new Date(year2, month2, 0);
days2 = days2.getDate();
if (day2 > days2) {
day2 = days2;
}
if (month2 < 10) {
month2 = '0' + month2;
}
var t2 = year2 + '-' + month2;
return {
year: year2,
month: month2,
};
}
}
// 查看详情
$('.box .box_in').on('click', '.ordinaryBox .ordinaryBox_in .ordinary .details', function () {
var familymemberid = $(this).attr(`familymemberid`);
var avatar = $(this).attr(`avatar`);
var nick = $(this).attr(`nick`);
var erbanNo = $(this).attr(`erbanNo`);
window.location.href = `./memberFlow22.html?familymemberid=${familymemberid}&avatar=${avatar}&nick=${nick}&erbanNo=${erbanNo}`;
}) })

View File

@@ -0,0 +1,267 @@
let urlPrefix = getUrlPrefix()
let browser = checkVersion()
let env = EnvCheck();
if (env == 'test') {
new VConsole();
}
// 封裝layer消息提醒框
let layerIndex
var langReplace;
var localLang;
const showLoading = (content = langReplace(localLang.demoModule.layerIndex1)) => {
layer.open({
type: 2,
shadeClose: false,
content,
success(e) {
layerIndex = $(e).attr('index')
}
})
}
const hideLoading = (index) => {
layer.close(index)
}
const toastMsg = (content = langReplace(localLang.demoModule.layerIndex2), time = 2) => {
layer.open({
content,
time,
skin: 'msg'
})
}
var nowTime;
var indexTime = 0;
var date_obj = lay_picker_date.getDateTime();
var years = lay_picker_date.getYear();
var urlData = getQueryString();
var months = lay_picker_date.getMonth(
[
{ value: date_obj.year },
]
);
const date = new Date();
const currentMonth = date.getMonth() + 1 < 10 ? "0" + (date.getMonth() + 1) : date.getMonth() + 1;
// 初始化函數
$(function () {
getInfoFromClient();
fuzzyMatchUpdateQueryStringParameterFun(); // 判断语言
setTimeout(function () {
// 頁面全屏
if (browser.app) {
if (browser.android) {
window.androidJsObj.initShowNav(false)
} else {
window.webkit.messageHandlers.initShowNav.postMessage(0)
}
};
// 頂部返回事件
$('.back .backs').click(() => {
// window.location.href = './memberFlow2.html';
history.back();
})
fuzzyMatchUpdateQueryStringParameterFun(); // 判断语言
langReplace = window.lang.replace;
localLang = window.lang;
translateFun();
// 选择年月
layPicker.init({
elem: '#month', // 绑定元素
type: 2, // 类型2微信效果 类型3自定义不设置则默认效果
title: '',
radius: 15,
data: [years, months], // 列数值
onSuccess: function (index, elem) { // 渲染成功回调
// 默认值设置(赋值)
layPicker.setValue(index, [
{ value: date_obj.year },
{ value: date_obj.month },
])
indexTime = index;
nowTime = `${date_obj.year}-${date_obj.month}`
var currentMonthVal = currentMonth == date_obj.month ? ` (${langReplace(localLang.memberFlow2.text17)}) ` : ''
$('.header .time div b').text(`${date_obj.year}-${date_obj.month}${currentMonthVal}`)
if (currentMonth == date_obj.month) {
$('.header').removeClass('datasAct')
} else {
$('.header').addClass('datasAct')
}
familyMemberWage(nowTime)
},
onConfirm: function (index, value, result) { // 点击确认回调
indexTime = index;
nowTime = value;
$('.header .time div b').text(value)
$('.header .time div b').text(value + `${result[index].value == currentMonth ? ` (${langReplace(localLang.memberFlow2.text17)}) ` : ''}`)
if (result[index].value == currentMonth) {
$('.header').removeClass('datasAct')
} else {
$('.header').addClass('datasAct')
}
familyMemberWage(nowTime)
},
})
}, 100)
})
function translateFun() {
var langReplace = window.lang.replace;
var localLang = window.lang;
$('.text1').text(langReplace(localLang.memberFlow22.text1));
$('.text2').text(langReplace(localLang.memberFlow22.text2));
$('.text3').text(langReplace(localLang.memberFlow22.text3));
$('.text4').text(langReplace(localLang.memberFlow22.text4));
$('.text5').text(langReplace(localLang.memberFlow22.text5));
$('.text6').text(langReplace(localLang.memberFlow22.text6));
$('.text7').text(langReplace(localLang.memberFlow22.text7));
$('.text8').text(langReplace(localLang.memberFlow22.text8));
}
// 获取数据接口
function familyMemberWage(month) {
$('.box .box_in .fistBox .fist').remove();
$('.box .box_in .ordinaryBox .ordinaryBox_in').remove();
networkRequest({
type: 'get',
url: urlPrefix + '/family/memberWage',
data: { month, familyMemberId: urlData.familymemberid, },
success(res) {
if (res.code === 200) {
// 处理头部数值
$('.totalWage').text(res.data.goldWage);
// $('.totalWage').text(unitProcessingAr(res.data.goldIncome, 0));
$('.header .datas1 p b').text(unitProcessingAr(res.data.goldIncome, 1))
$('.header .datas2 p b').text(unitProcessingAr(res.data.micVaildDays, 1))
$('.header .datas3 p b').text(unitProcessingAr(res.data.diamondRemain, 1))
$('.header .user img').attr('src', urlData.avatar)
$('.header .user p').text(urlData.nick)
$('.header .user b').text("ID:" + urlData.erbanNo)
var strLeft = '';
var strRight = '';
res.data.dayWageList.forEach((res, i) => {
strRight += `
<div class="ordinaryBox_in ${i > 0 ? 'ordinaryBox_inAct' : ''}">
<div class="ordinary">
<div class="title">${langReplace(localLang.memberFlow22.text10)}</div>
<p class="">${res.date}</p>
</div>
<div class="ordinary">
<div class="title">${langReplace(localLang.memberFlow22.text11)}</div>
<p class="${res.micVaild}">${res.micRemainTime}</p>
</div>
<div class="ordinary">
<div class="title">${langReplace(localLang.memberFlow22.text12)}</div>
<p class="">${unitProcessingAr(res.goldIncome, 1)}</p>
</div>
<div class="ordinary">
<div class="title">${langReplace(localLang.memberFlow22.text13)}</div>
<p class="">${unitProcessingAr(res.savedGoldIncome, 1)}</p>
</div>
<div class="ordinary">
<div class="title">${langReplace(localLang.memberFlow22.text14)}</div>
<p class="">${res.savedGoldWage}</p>
</div>
</div>
`
})
$('.box .box_in .ordinaryBox').append(strRight);
} else {
toastMsg(res.message)
}
hideLoading(layerIndex)
},
error(err) {
hideLoading(layerIndex)
toastMsg(langReplace(localLang.demoModule.layerIndex3))
}
})
}
// 前一个月
$('.previousMonth').click(function () {
var obj = getPreMonth(nowTime, 1);
layPicker.setValue(indexTime, [
{ value: obj.year },
{ value: obj.month },
])
nowTime = `${obj.year}-${obj.month}`
$('.header .time div b').text(`${obj.year}-${obj.month}`)
$('.header .time div b').text(`${obj.year}-${obj.month}` + `${obj.month == currentMonth ? ` (${langReplace(localLang.memberFlow2.text17)}) ` : ''}`)
if (obj.month == currentMonth) {
$('.header').removeClass('datasAct')
} else {
$('.header').addClass('datasAct')
}
familyMemberWage(nowTime)
})
// 后一个月
$('.nextMonth').click(function () {
var obj = getPreMonth(nowTime, 2);
layPicker.setValue(indexTime, [
{ value: obj.year },
{ value: obj.month },
])
nowTime = `${obj.year}-${obj.month}`
$('.header .time div b').text(`${obj.year}-${obj.month}`)
$('.header .time div b').text(`${obj.year}-${obj.month}` + `${obj.month == currentMonth ? ` (${langReplace(localLang.memberFlow2.text17)}) ` : ''}`)
if (obj.month == currentMonth) {
$('.header').removeClass('datasAct')
} else {
$('.header').addClass('datasAct')
}
familyMemberWage(nowTime)
})
function getPreMonth(date, type) {//1上2下
if (type == 1) {
var arr = date.split('-');
var year = arr[0]; //获取当前日期的年份
var month = arr[1]; //获取当前日期的月份
var day = arr[2]; //获取当前日期的日
var days = new Date(year, month, 0);
days = days.getDate(); //获取当前日期中月的天数
var year2 = year;
var month2 = parseInt(month) - 1;
if (month2 == 0) {
year2 = parseInt(year2) - 1;
month2 = 12;
}
var day2 = day;
var days2 = new Date(year2, month2, 0);
days2 = days2.getDate();
if (day2 > days2) {
day2 = days2;
}
if (month2 < 10) {
month2 = '0' + month2;
}
var t2 = year2 + '-' + month2;
return {
year: year2,
month: month2,
};
} else {
var arr = date.split('-');
var year = arr[0]; //获取当前日期的年份
var month = arr[1]; //获取当前日期的月份
var day = arr[2]; //获取当前日期的日
var days = new Date(year, month, 0);
days = days.getDate(); //获取当前日期中的月的天数
var year2 = year;
var month2 = parseInt(month) + 1;
if (month2 == 13) {
year2 = parseInt(year2) + 1;
month2 = 1;
}
var day2 = day;
var days2 = new Date(year2, month2, 0);
days2 = days2.getDate();
if (day2 > days2) {
day2 = days2;
}
if (month2 < 10) {
month2 = '0' + month2;
}
var t2 = year2 + '-' + month2;
return {
year: year2,
month: month2,
};
}
}

View File

@@ -0,0 +1,267 @@
let urlPrefix = getUrlPrefix()
let browser = checkVersion()
let env = EnvCheck();
if (env == 'test') {
new VConsole();
}
// 封裝layer消息提醒框
let layerIndex
var langReplace;
var localLang;
const showLoading = (content = langReplace(localLang.demoModule.layerIndex1)) => {
layer.open({
type: 2,
shadeClose: false,
content,
success(e) {
layerIndex = $(e).attr('index')
}
})
}
const hideLoading = (index) => {
layer.close(index)
}
const toastMsg = (content = langReplace(localLang.demoModule.layerIndex2), time = 2) => {
layer.open({
content,
time,
skin: 'msg'
})
}
var nowTime;
var indexTime = 0;
var date_obj = lay_picker_date.getDateTime();
var years = lay_picker_date.getYear();
var urlData = getQueryString();
var months = lay_picker_date.getMonth(
[
{ value: date_obj.year },
]
);
const date = new Date();
const currentMonth = date.getMonth() + 1 < 10 ? "0" + (date.getMonth() + 1) : date.getMonth() + 1;
// 初始化函數
$(function () {
getInfoFromClient();
fuzzyMatchUpdateQueryStringParameterFun(); // 判断语言
setTimeout(function () {
// 頁面全屏
if (browser.app) {
if (browser.android) {
window.androidJsObj.initShowNav(false)
} else {
window.webkit.messageHandlers.initShowNav.postMessage(0)
}
};
// 頂部返回事件
$('.back .backs').click(() => {
// window.location.href = './memberFlow2.html';
history.back();
})
fuzzyMatchUpdateQueryStringParameterFun(); // 判断语言
langReplace = window.lang.replace;
localLang = window.lang;
translateFun();
// 选择年月
layPicker.init({
elem: '#month', // 绑定元素
type: 2, // 类型2微信效果 类型3自定义不设置则默认效果
title: '',
radius: 15,
data: [years, months], // 列数值
onSuccess: function (index, elem) { // 渲染成功回调
// 默认值设置(赋值)
layPicker.setValue(index, [
{ value: date_obj.year },
{ value: date_obj.month },
])
indexTime = index;
nowTime = `${date_obj.year}-${date_obj.month}`
var currentMonthVal = currentMonth == date_obj.month ? ` (${langReplace(localLang.memberFlow2.text17)}) ` : ''
$('.header .time div b').text(`${date_obj.year}-${date_obj.month}${currentMonthVal}`)
if (currentMonth == date_obj.month) {
$('.header').removeClass('datasAct')
} else {
$('.header').addClass('datasAct')
}
familyMemberWage(nowTime)
},
onConfirm: function (index, value, result) { // 点击确认回调
indexTime = index;
nowTime = value;
$('.header .time div b').text(value)
$('.header .time div b').text(value + `${result[index].value == currentMonth ? ` (${langReplace(localLang.memberFlow2.text17)}) ` : ''}`)
if (result[index].value == currentMonth) {
$('.header').removeClass('datasAct')
} else {
$('.header').addClass('datasAct')
}
familyMemberWage(nowTime)
},
})
}, 100)
})
function translateFun() {
var langReplace = window.lang.replace;
var localLang = window.lang;
$('.text1').text(langReplace(localLang.memberFlow222.text1));
$('.text2').text(langReplace(localLang.memberFlow222.text2));
$('.text3').text(langReplace(localLang.memberFlow222.text3));
$('.text4').text(langReplace(localLang.memberFlow222.text4));
$('.text5').text(langReplace(localLang.memberFlow222.text5));
$('.text6').text(langReplace(localLang.memberFlow222.text6));
$('.text7').text(langReplace(localLang.memberFlow222.text7));
$('.text8').text(langReplace(localLang.memberFlow222.text8));
}
// 获取数据接口
function familyMemberWage(month) {
$('.box .box_in .fistBox .fist').remove();
$('.box .box_in .ordinaryBox .ordinaryBox_in').remove();
networkRequest({
type: 'get',
url: urlPrefix + '/family/memberWage',
data: { month, familyMemberId: urlData.familyMemberId, },
success(res) {
if (res.code === 200) {
// 处理头部数值
$('.totalWage').text(res.data.goldWage);
// $('.totalWage').text(unitProcessingAr(res.data.goldIncome, 0));
$('.header .datas1 p b').text(unitProcessingAr(res.data.goldIncome, 1))
$('.header .datas2 p b').text(unitProcessingAr(res.data.micVaildDays, 1))
$('.header .datas3 p b').text(unitProcessingAr(res.data.diamondRemain, 1))
$('.header .user img').attr('src', res.data.avatar)
$('.header .user p').text(res.data.nick)
$('.header .user b').text("ID:" + res.data.erbanNo)
var strLeft = '';
var strRight = '';
res.data.dayWageList.forEach((res, i) => {
strRight += `
<div class="ordinaryBox_in ${i > 0 ? 'ordinaryBox_inAct' : ''}">
<div class="ordinary">
<div class="title">${langReplace(localLang.memberFlow222.text10)}</div>
<p class="">${res.date}</p>
</div>
<div class="ordinary">
<div class="title">${langReplace(localLang.memberFlow222.text11)}</div>
<p class="${res.micVaild }">${res.micRemainTime}</p>
</div>
<div class="ordinary">
<div class="title">${langReplace(localLang.memberFlow222.text12)}</div>
<p class="">${unitProcessingAr(res.goldIncome, 1)}</p>
</div>
<div class="ordinary">
<div class="title">${langReplace(localLang.memberFlow222.text13)}</div>
<p class="">${unitProcessingAr(res.savedGoldIncome, 1)}</p>
</div>
<div class="ordinary">
<div class="title">${langReplace(localLang.memberFlow222.text14)}</div>
<p class="">${res.savedGoldWage}</p>
</div>
</div>
`
})
$('.box .box_in .ordinaryBox').append(strRight);
} else {
toastMsg(res.message)
}
hideLoading(layerIndex)
},
error(err) {
hideLoading(layerIndex)
toastMsg(langReplace(localLang.demoModule.layerIndex3))
}
})
}
// 前一个月
$('.previousMonth').click(function () {
var obj = getPreMonth(nowTime, 1);
layPicker.setValue(indexTime, [
{ value: obj.year },
{ value: obj.month },
])
nowTime = `${obj.year}-${obj.month}`
$('.header .time div b').text(`${obj.year}-${obj.month}`)
$('.header .time div b').text(`${obj.year}-${obj.month}` + `${obj.month == currentMonth ? ` (${langReplace(localLang.memberFlow2.text17)}) ` : ''}`)
if (obj.month == currentMonth) {
$('.header').removeClass('datasAct')
} else {
$('.header').addClass('datasAct')
}
familyMemberWage(nowTime)
})
// 后一个月
$('.nextMonth').click(function () {
var obj = getPreMonth(nowTime, 2);
layPicker.setValue(indexTime, [
{ value: obj.year },
{ value: obj.month },
])
nowTime = `${obj.year}-${obj.month}`
$('.header .time div b').text(`${obj.year}-${obj.month}`)
$('.header .time div b').text(`${obj.year}-${obj.month}` + `${obj.month == currentMonth ? ` (${langReplace(localLang.memberFlow2.text17)}) ` : ''}`)
if (obj.month == currentMonth) {
$('.header').removeClass('datasAct')
} else {
$('.header').addClass('datasAct')
}
familyMemberWage(nowTime)
})
function getPreMonth(date, type) {//1上2下
if (type == 1) {
var arr = date.split('-');
var year = arr[0]; //获取当前日期的年份
var month = arr[1]; //获取当前日期的月份
var day = arr[2]; //获取当前日期的日
var days = new Date(year, month, 0);
days = days.getDate(); //获取当前日期中月的天数
var year2 = year;
var month2 = parseInt(month) - 1;
if (month2 == 0) {
year2 = parseInt(year2) - 1;
month2 = 12;
}
var day2 = day;
var days2 = new Date(year2, month2, 0);
days2 = days2.getDate();
if (day2 > days2) {
day2 = days2;
}
if (month2 < 10) {
month2 = '0' + month2;
}
var t2 = year2 + '-' + month2;
return {
year: year2,
month: month2,
};
} else {
var arr = date.split('-');
var year = arr[0]; //获取当前日期的年份
var month = arr[1]; //获取当前日期的月份
var day = arr[2]; //获取当前日期的日
var days = new Date(year, month, 0);
days = days.getDate(); //获取当前日期中的月的天数
var year2 = year;
var month2 = parseInt(month) + 1;
if (month2 == 13) {
year2 = parseInt(year2) + 1;
month2 = 1;
}
var day2 = day;
var days2 = new Date(year2, month2, 0);
days2 = days2.getDate();
if (day2 > days2) {
day2 = days2;
}
if (month2 < 10) {
month2 = '0' + month2;
}
var t2 = year2 + '-' + month2;
return {
year: year2,
month: month2,
};
}
}

View File

@@ -0,0 +1,178 @@
let urlPrefix = getUrlPrefix()
let browser = checkVersion()
let env = EnvCheck();
if (env == 'test') {
new VConsole();
}
// 封裝layer消息提醒框
let layerIndex
var langReplace;
var localLang;
const showLoading = (content = langReplace(localLang.demoModule.layerIndex1)) => {
layer.open({
type: 2,
shadeClose: false,
content,
success(e) {
layerIndex = $(e).attr('index')
}
})
}
const hideLoading = (index) => {
layer.close(index)
}
const toastMsg = (content = langReplace(localLang.demoModule.layerIndex2), time = 2) => {
layer.open({
content,
time,
skin: 'msg'
})
}
var nowTime;
var indexTime = 0;
var date_obj = lay_picker_date.getDateTime();
var years = lay_picker_date.getYear();
var months = lay_picker_date.getMonth(
[
{ value: date_obj.year },
]
);
// 初始化函數
$(function () {
getInfoFromClient();
fuzzyMatchUpdateQueryStringParameterFun(); // 判断语言
setTimeout(function () {
// 頁面全屏
if (browser.app) {
if (browser.android) {
window.androidJsObj.initShowNav(false)
} else {
window.webkit.messageHandlers.initShowNav.postMessage(0)
}
};
// 頂部返回事件
$('.back .backs').click(() => {
window.location.href = './index.html';
})
// 选择年月
layPicker.init({
elem: '#month', // 绑定元素
type: 2, // 类型2微信效果 类型3自定义不设置则默认效果
title: '选择器标题',
radius: 15,
data: [years, months], // 列数值
onSuccess: function (index, elem) { // 渲染成功回调
// 默认值设置(赋值)
layPicker.setValue(index, [
{ value: date_obj.year },
{ value: date_obj.month },
])
indexTime = index;
nowTime = `${date_obj.year}-${date_obj.month}`
$('.header .time div').text(`${date_obj.year}-${date_obj.month}`)
},
onConfirm: function (index, value, result) { // 点击确认回调
indexTime = index;
nowTime = value;
$('.header .time div').text(value)
},
})
fuzzyMatchUpdateQueryStringParameterFun(); // 判断语言
langReplace = window.lang.replace;
localLang = window.lang;
translateFun();
}, 100)
})
function translateFun() {
var langReplace = window.lang.replace;
var localLang = window.lang;
// $('.text1').text(langReplace(localLang.memberFlow.text1));
// $('.text2').text(langReplace(localLang.memberFlow.text2));
// $('.text3').text(langReplace(localLang.memberFlow.text3));
// $('.text4').text(langReplace(localLang.memberFlow.text4));
// $('.text5').text(langReplace(localLang.memberFlow.text5));
// $('.text6').text(langReplace(localLang.memberFlow.text6));
// $('.text7').text(langReplace(localLang.memberFlow.text7));
// $('.text8').text(langReplace(localLang.memberFlow.text8));
// $('.text9').text(langReplace(localLang.memberFlow.text9));
// $('.text10').text(langReplace(localLang.memberFlow.text10));
// $('.text11').text(langReplace(localLang.memberFlow.text11));
}
// 前一个月
$('.previousMonth').click(function () {
var obj = getPreMonth(nowTime, 1);
layPicker.setValue(indexTime, [
{ value: obj.year },
{ value: obj.month },
])
nowTime = `${obj.year}-${obj.month}`
$('.header .time div').text(`${obj.year}-${obj.month}`)
})
// 后一个月
$('.nextMonth').click(function () {
var obj = getPreMonth(nowTime, 2);
layPicker.setValue(indexTime, [
{ value: obj.year },
{ value: obj.month },
])
nowTime = `${obj.year}-${obj.month}`
$('.header .time div').text(`${obj.year}-${obj.month}`)
})
function getPreMonth(date, type) {//1上2下
if (type == 1) {
var arr = date.split('-');
var year = arr[0]; //获取当前日期的年份
var month = arr[1]; //获取当前日期的月份
var day = arr[2]; //获取当前日期的日
var days = new Date(year, month, 0);
days = days.getDate(); //获取当前日期中月的天数
var year2 = year;
var month2 = parseInt(month) - 1;
if (month2 == 0) {
year2 = parseInt(year2) - 1;
month2 = 12;
}
var day2 = day;
var days2 = new Date(year2, month2, 0);
days2 = days2.getDate();
if (day2 > days2) {
day2 = days2;
}
if (month2 < 10) {
month2 = '0' + month2;
}
var t2 = year2 + '-' + month2;
return {
year: year2,
month: month2,
};
} else {
var arr = date.split('-');
var year = arr[0]; //获取当前日期的年份
var month = arr[1]; //获取当前日期的月份
var day = arr[2]; //获取当前日期的日
var days = new Date(year, month, 0);
days = days.getDate(); //获取当前日期中的月的天数
var year2 = year;
var month2 = parseInt(month) + 1;
if (month2 == 13) {
year2 = parseInt(year2) + 1;
month2 = 1;
}
var day2 = day;
var days2 = new Date(year2, month2, 0);
days2 = days2.getDate();
if (day2 > days2) {
day2 = days2;
}
if (month2 < 10) {
month2 = '0' + month2;
}
var t2 = year2 + '-' + month2;
return {
year: year2,
month: month2,
};
}
}

View File

@@ -20,7 +20,12 @@ langAr = {
text13: `المشرف`, text13: `المشرف`,
text14: `حذف`, text14: `حذف`,
text15: `هل أنت متأكد أنك تريد إزالة هذا الشخص؟`, text15: `هل أنت متأكد أنك تريد إزالة هذا الشخص؟`,
text16: `MoliStarID بحث عن `, text16: `أدخل أي دي مولي ستار للبحث`,
texts1: "إحصائيات دخل العملات",
texts2: "إحصائيات دخل الرواتب",
texts3: "إعدادات معلومات الوكالة",
texts4: "إعدادات مشرف الوكالة",
texts5: "راتبي",
}, },
adminSet: { adminSet: {
text1: `إعدادات المشرف`, text1: `إعدادات المشرف`,
@@ -56,14 +61,18 @@ langAr = {
text8: 'تم تقديم الطلب بنجاح', text8: 'تم تقديم الطلب بنجاح',
}, },
guildInfoSet: { guildInfoSet: {
text1: `إعدادات معلومات الوكالة`, text1: `إعدادات معلومات الوكالة `,
text2: `إعدادات معلومات الوكالة`, text2: `إعدادات معلومات الوكالة`,
text3: `أسم الوكالة: `, text3: `اسم الوكالة: `,
text4: `أسم الوكالة`, text4: `أسم الوكالة`,
text5: `خلفية الوكالة:`, text5: `خلفية الوكالة:`,
text6: `حذف`, text6: `حذف`,
text7: `حفظ`, text7: `حفظ`,
text8: `تم التحميل بنجاح`, text8: `تم التحميل بنجاح`,
textConte1: `حفظ`,
textConte2: `تعديل `,
textConte3: `إضافة`,
textConte4: `حساب أستلام الراتب `,
}, },
invitation: { invitation: {
text1: `البحث`, text1: `البحث`,
@@ -78,41 +87,66 @@ langAr = {
text10: 'تمت الدعوة بنجاح', text10: 'تمت الدعوة بنجاح',
}, },
memberFlow: { memberFlow: {
close: `حذف`, text1: `مجموع دخل العملات الذهبية`,
ok: `تأكيد`, text2: `إجمالي دخل الوكالة من العملات الذهبية`,
text1: `إجمالي دخل الأعضاء`, text3: `دخل العملات الذهبية للأعضاء `,
text2: `إجمالي دخل الأعضاء`, text4: `لا يمكن أن يكون وقت البدء بعد وقت الانتهاء`,
text3: `استعلام`, text5: `لا يمكن أن يتجاوز الفترة الزمنية المحددة 90 يومًا`,
text4: `سنة`, text6: `دخل العملات الذهبية `,
text5: `الدخل الإجمالي للعملات الذهبية`, text7: `مدة البث المباشر `,
text6: `الدخل الإجمالي للماس`, text8: `عدد المستخدمين الراسلين للهدايا `,
text7: `معلومات الأعضاء`, text9: `أنا`,
text8: `وقت البث`,
text9: `دخل كوينز `,
text10: `دخل الماسات`,
text11: `عدد المُرسلين للهدايا`,
text12: `لا يوجد`,
text13: 'وقت الانتهاء يجب أن يكون قبل اليوم السابق كحد أقصى.',
text14: 'وقت الانتهاء يجب أن يكون قبل اليوم السابق كحد أقصى.',
text15: `لا يمكن أن يكون وقت البدء أقل من وقت الانتهاء.`,
text16: 'المدة الزمنية يجب أن تكون داخل الثلاثين يومًا.',
}, },
memberFlow2: { memberFlow2: {
close: `حذف`, text1: `مجموع دخل الرواتب `,
ok: `تأكيد`, text2: `الشهر الماضي `,
text1: `الدخل الشخصي`, text3: `الشهر التالي`,
text2: `الدخل الشخصي`, text4: `راتبي الشهري `,
text3: `استعلام`, text5: `راتب العملات الذهبية `,
text4: `سنة`, text6: `راتب الوكالة `,
text5: `الدخل الإجمالي للعملات الذهبية`, text7: `رصيد الماس الحالي `,
text6: `الدخل الإجمالي للماس`, text8: `الراتب الشهري للأعضاء`,
text7: `استبدال >>`, text9: `شهر`,
text8: `التاريخ`, text10: `معلومات الأعضاء `,
text9: `وقت البث`, text11: `عدد الأيام الصالحة`,
text10: `دخل كوينز `, text12: `دخل العملات الذهبية`,
text11: `دخل الماسات`, text13: `راتب العملات الذهبية `,
text12: `عدد المُرسلين للهدايا`, text14: `رصيد الماس `,
text13: ``, text15: ``,
text16: `تفاصيل`,
text17: `الشهر الحالي `,
},
memberFlow22: {
text1: `الراتب الشهري للأعضاء `,
text2: `الشهر الماضي `,
text3: `الشهر التالي`,
text4: `راتب العملات الذهبية `,
text5: `دخل العملات الذهبية `,
text6: `عدد الأيام الصالحة `,
text7: `رصيد الماس الحالي `,
text8: `تفاصيل يومية`,
text9: ``,
text10: `التاريخ`,
text11: `مدة البث المباشر `,
text12: `الدخل اليومي للعملات الذهبية`,
text13: `الدخل الشهري التراكمي للعملات الذهبية`,
text14: `راتب العملات الذهبية للشهر الحالي `,
},
memberFlow222: {
text1: `الراتب الشهري للأعضاء `,
text2: `الشهر الماضي `,
text3: `الشهر التالي`,
text4: `راتب العملات الذهبية `,
text5: `دخل العملات الذهبية `,
text6: `عدد الأيام الصالحة `,
text7: `رصيد الماس الحالي `,
text8: `تفاصيل يومية`,
text9: ``,
text10: `التاريخ`,
text11: `مدة البث المباشر `,
text12: `الدخل اليومي للعملات الذهبية`,
text13: `الدخل الشهري التراكمي للعملات الذهبية`,
text14: `راتب العملات الذهبية للشهر الحالي `,
}, },
search: { search: {
text1: `بحث`, text1: `بحث`,
@@ -124,4 +158,9 @@ langAr = {
text7: `تأكيد`, text7: `تأكيد`,
text8: 'تم تقديم الطلب بنجاح', text8: 'تم تقديم الطلب بنجاح',
}, },
lay: {
ok: 'تأكيد',
close: 'إلغاء',
departed: 'غادر',
}
} }

View File

@@ -5,7 +5,7 @@ langEn = {
layerIndex3: `Network error`, layerIndex3: `Network error`,
text1: `Agency Name`, text1: `Agency Name`,
text2: `Agency Name`, text2: `Agency Name`,
text3: `Admin`, text3: `Administrator`,
text4: `Settings`, text4: `Settings`,
text5: `Income`, text5: `Income`,
text6: `Invite`, text6: `Invite`,
@@ -14,32 +14,37 @@ langEn = {
text9: `Cancel`, text9: `Cancel`,
text10: `Confirm`, text10: `Confirm`,
text11: 'Guild Name:', text11: 'Guild Name:',
text12: `Chair`, text12: `Master`,
text13: `Admin`, text13: `Administrator`,
text14: `Delete`, text14: `Delete`,
text15: `Are you sure you want to remove this person?`, text15: `Are you sure you want to remove this person?`,
text16: `Find MoliStarID`, text16: `Enter MoliStar ID to Search`,
texts1: "Coin Income Statistics",
texts2: "Salary Income Statistics",
texts3: "Agency Settings",
texts4: "Administrator Settings",
texts5: "My Salary",
}, },
adminSet: { adminSet: {
text1: `Admin`, text1: `Administrator`,
text2: `Find`, text2: `Find`,
text3: `No data`, text3: `No data`,
text4: `Appoint admin?`, text4: `Appoint Administrator?`,
text5: `Cancel`, text5: `Cancel`,
text6: `Confirm`, text6: `Confirm`,
text7: `Add`, text7: `Add`,
text8: `Added`, text8: `Added`,
}, },
adminSet2: { adminSet2: {
text1: `Admin`, text1: `Administrator`,
text2: `Settings`, text2: `Settings`,
text3: `Add Admin`, text3: `Add Administrator`,
text4: `No data`, text4: `No data`,
text5: `Remove admin?`, text5: `Remove Administrator?`,
text6: `Cancel`, text6: `Cancel`,
text7: `Confirm`, text7: `Confirm`,
text8: `Chair`, text8: `Master`,
text9: `Admin`, text9: `Administrator`,
text10: `Delete`, text10: `Delete`,
text11: 'Removed', text11: 'Removed',
}, },
@@ -54,14 +59,18 @@ langEn = {
text8: 'Submitted', text8: 'Submitted',
}, },
guildInfoSet: { guildInfoSet: {
text1: `Guild Info`, text1: `Agency Settings`,
text2: `Settings`, text2: `Agency Settings`,
text3: `Agency Name: `, text3: `Name: `,
text4: `Agency Name`, text4: `Name`,
text5: `Background:`, text5: `Background:`,
text6: `Delete`, text6: `Delete`,
text7: `Save`, text7: `Save`,
text8: `Loaded`, text8: `Loaded`,
textConte1: `Save`,
textConte2: `Edit`,
textConte3: `Add`,
textConte4: `Payment Account`,
}, },
invitation: { invitation: {
text1: `Find`, text1: `Find`,
@@ -76,41 +85,66 @@ langEn = {
text10: 'Sent invitation', text10: 'Sent invitation',
}, },
memberFlow: { memberFlow: {
close: `Cancel`, text1: `Income Statistics`,
ok: `Confirm`, text2: `Total Coins Income`,
text1: `Total Income`, text3: `Members Coins Income`,
text2: `Total Income`, text4: `Start time cannot be later than end time`,
text3: `Query`, text5: `Selected time period cannot exceed 90 days`,
text4: `Year`, text6: `Coins Income`,
text5: `Total Gold`, text7: `Duration`,
text6: `Total Diamond`, text8: `Num of Givers`,
text7: `Member Info`, text9: `Me`,
text8: `Broadcast Time`,
text9: `Coins`,
text10: `Diamonds`,
text11: `Gift Senders`,
text12: `None`,
text13: 'End time before previous day.',
text14: 'End time before previous day.',
text15: `Start time cannot be after end time.`,
text16: 'Duration within 30 days.',
}, },
memberFlow2: { memberFlow2: {
close: `Cancel`, text1: `Salaries Statistics`,
ok: `Confirm`, text2: `Previous`,
text1: `Personal Income`, text3: `Next`,
text2: `Personal Income`, text4: `My Salary`,
text3: `Query`, text5: `Coin Salary`,
text4: `Year`, text6: `Commission`,
text5: `Total Gold`, text7: `Remaining Diamonds`,
text6: `Total Diamond`, text8: `Member Salaries`,
text7: `Gold Coin Agen >>`, text9: `Month`,
text8: `Date`, text10: `Member`,
text9: `Broadcast Time`, text11: `Valid days`,
text10: `Coins`, text12: `Coins Income`,
text11: `Diamonds`, text13: `Coin Salary`,
text12: `Gift Senders`, text14: `Remaining Diamonds`,
text13: ``, text15: ``,
text16: `Details`,
text17: `Current`,
},
memberFlow22: {
text1: `Member Salary`,
text2: `Previous`,
text3: `Next`,
text4: `Coin Salary`,
text5: `Coins Income`,
text6: `Valid Days`,
text7: `Remaining Diamonds`,
text8: `Daily Details`,
text9: ``,
text10: `Date`,
text11: `Duration`,
text12: `Daily Income`,
text13: `Monthly Income`,
text14: `Coin Salary`,
},
memberFlow222: {
text1: `Member Salary`,
text2: `Previous`,
text3: `Next`,
text4: `Coin Salary`,
text5: `Coins Income`,
text6: `Valid Days`,
text7: `Remaining Diamonds`,
text8: `Daily Details`,
text9: ``,
text10: `Date`,
text11: `Duration`,
text12: `Daily Income`,
text13: `Monthly Income`,
text14: `Coin Salary`,
}, },
search: { search: {
text1: `Find`, text1: `Find`,
@@ -122,4 +156,9 @@ langEn = {
text7: `Cancel`, text7: `Cancel`,
text8: 'Submitted', text8: 'Submitted',
}, },
lay: {
ok: 'Confirm',
close: 'Cancel',
departed: 'Departed',
}
} }

View File

@@ -21,6 +21,11 @@ langZh = {
text14: `刪除`, text14: `刪除`,
text15: `確定要將此人移除嗎?`, text15: `確定要將此人移除嗎?`,
text16: `搜索MoliStarID`, text16: `搜索MoliStarID`,
texts1: `金幣收入統計`,
texts2: `工資收入統計`,
texts3: `公會信息設置`,
texts4: `公會管理員設置`,
texts5: `我的工資`,
}, },
adminSet: { adminSet: {
text1: `管理員設置`, text1: `管理員設置`,
@@ -64,6 +69,10 @@ langZh = {
text6: `刪除`, text6: `刪除`,
text7: `保存`, text7: `保存`,
text8: `加載成功`, text8: `加載成功`,
textConte1: `保存`,
textConte2: `修改`,
textConte3: `添加`,
textConte4: `收款賬戶`,
}, },
invitation: { invitation: {
text1: `搜索`, text1: `搜索`,
@@ -78,41 +87,66 @@ langZh = {
text10: '邀請成功發送', text10: '邀請成功發送',
}, },
memberFlow: { memberFlow: {
close: `刪除`, text1: `金幣收入統計`,
ok: `確認`, text2: `金額收入總額`,
text1: `成員收入`, text3: `成員金幣收入`,
text2: `成員總收入`, text4: `開始時間不能大於結束時間`,
text3: `查詢`, text5: `所選時間段不能大於90天`,
text4: `年份`, text6: `金幣收入`,
text5: `總金幣收入`, text7: `直播時長`,
text6: `總鉆石收入`, text8: `贈送禮物人數`,
text7: `成員信息`, text9: ``,
text8: `直播時間`,
text9: `金幣收入`,
text10: `鉆石收入`,
text11: `贈送禮物人數`,
text12: ``,
text13: '結束時間不得晚於前一天。',
text14: '結束時間不得晚於前一天。',
text15: `開始時間不能早於結束時間.`,
text16: '持續時間必須在三十天內.',
}, },
memberFlow2: { memberFlow2: {
close: `刪除`, text1: `工資收入統計`,
ok: `確認`, text2: `前一個月`,
text1: `個人收入`, text3: `後一個月`,
text2: `個人收入`, text4: `我的月工資`,
text3: `查詢`, text5: `金幣工資`,
text4: `年份`, text6: `代理工資`,
text5: `總金幣收入`, text7: `當前鉆石`,
text6: `總鉆石收入`, text8: `成員月工資`,
text7: `兌換金幣 >>`, text9: ``,
text8: `日期`, text10: `成員信息`,
text9: `直播時間`, text11: `有效天數`,
text10: `金幣收入`, text12: `金幣收入`,
text11: `鉆石收入`, text13: `金幣工資`,
text12: `贈送禮物人數`, text14: `鉆石余額`,
text13: ``, text15: `查看`,
text16: `詳情`,
text17: `本月`,
},
memberFlow22: {
text1: `成員月工資`,
text2: `前一個月`,
text3: `後一個月`,
text4: `金幣工資`,
text5: `金幣收入`,
text6: `有效天數`,
text7: `當前鉆石`,
text8: `單日明細`,
text9: ``,
text10: `日期`,
text11: `直播時長`,
text12: `單日金幣收入`,
text13: `月累計金幣收入`,
text14: `本月金幣工資`,
},
memberFlow222: {
text1: `成員月工資`,
text2: `前一個月`,
text3: `後一個月`,
text4: `金幣工資`,
text5: `金幣收入`,
text6: `有效天數`,
text7: `當前鉆石`,
text8: `單日明細`,
text9: ``,
text10: `日期`,
text11: `直播時長`,
text12: `單日金幣收入`,
text13: `月累計金幣收入`,
text14: `本月金幣工資`,
}, },
search: { search: {
text1: `搜索`, text1: `搜索`,
@@ -124,4 +158,9 @@ langZh = {
text7: `確認`, text7: `確認`,
text8: '請求成功提交', text8: '請求成功提交',
}, },
lay: {
ok: '確認',
close: '取消',
departed: '已离开',
},
} }

View File

@@ -5,9 +5,10 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title class="text1"></title> <title class="text1"></title>
<!-- 成员收入统计 --> <!-- 金币收入统计 -->
<link rel="stylesheet" href="../../common/css/reset.css"> <link rel="stylesheet" href="../../common/css/reset.css">
<link rel="stylesheet" href="./css/mobile.css"> <link rel="stylesheet" href="./css/mobile.css">
<link rel="stylesheet" href="./css/lay-picker.min.css">
<link rel="stylesheet" href="./css/memberFlow.css?v=1.0"> <link rel="stylesheet" href="./css/memberFlow.css?v=1.0">
</head> </head>
@@ -15,54 +16,78 @@
<!-- 顶部 --> <!-- 顶部 -->
<div class="back"> <div class="back">
<img src="./images/travel/backB.png" alt="" class="backs"> <img src="./images/travel/backB.png" alt="" class="backs">
<div class="title text2"></div> <div class="title text1"></div>
<div class="text text3"></div>
</div> </div>
<!-- 时间选择器筛选 --> <!-- 头部 -->
<div class="timeBox"> <div class="header">
<div class="line"></div> <!-- 时间筛选 -->
<div class="year"><b>2024</b><span class="text4"></span></div> <div class="time">
<div class="startTime" id="select_0"><b>00-00</b><img src="./images/xjt.png" alt=""></div> <div class="starTime" id="date"><b></b><img src="./images/xjt.png" alt=""></div>
<div class="endTime" id="select_1"><b>00-00</b><img src="./images/xjt.png" alt=""></div> <span></span>
<div class="right"> <div class="endTime" id="date2"><b></b><img src="./images/xjt.png" alt=""></div>
<div class="div1"> </div>
<!-- 金币总收入 --> <h3 class="text2"></h3>
<p class="text5"></p> <p>
<b>0</b> <img src="./images/goldIcon.png" alt="">
<span class="totalGoldIncome">0</span>
</p>
</div>
<!-- 列表 -->
<div class="box">
<h3><span></span><b class="text3"></b></h3>
<div class="box_in">
<!-- 左边 -->
<div class="fistBox">
<!-- <div class="fist">
<div class="title">成员信息</div>
<div class="user">
<img src="./images/logo.png" alt="" class="tx">
<p>用户昵称</p>
<b>ID:0</b>
</div>
</div>
<div class="fist fistAct">
<div class="title">赠送礼物人数</div>
<div class="user">
<img src="./images/logo.png" alt="" class="tx">
<p>用户昵称</p>
<b>ID:0</b>
</div>
</div> -->
</div> </div>
<div class="div2"> <!-- 右边 -->
<!-- 钻石总收入 --> <div class="ordinaryBox">
<p class="text6"></p> <!-- <div class="ordinaryBox_in">
<b>0</b> <div class="ordinary">
<div class="title">金币收入</div>
<p class="true">x</p>
</div>
<div class="ordinary">
<div class="title">直播时长</div>
<p class="true">54min</p>
</div>
<div class="ordinary">
<div class="title">赠送礼物人数</div>
<p class="true">x</p>
</div>
</div>
<div class="ordinaryBox_in ordinaryBox_inAct">
<div class="ordinary">
<div class="title">金币收入</div>
<p class="true">x</p>
</div>
<div class="ordinary">
<div class="title">直播时长</div>
<p class="true">54min</p>
</div>
<div class="ordinary">
<div class="title">赠送礼物人数</div>
<p class="true">x</p>
</div>
</div> -->
</div> </div>
</div> </div>
</div> </div>
<!-- 数据内容 -->
<ul class="list">
<li class="top">
<!-- 成员信息 -->
<div class="text7"></div>
<!-- 开播时长 -->
<div class="text8"></div>
<!-- 金币收入 -->
<div class="text9"></div>
<!-- 钻石收入 -->
<div class="text10"></div>
<!-- 送礼用户数 -->
<div class="text11"></div>
</li>
<li class="other">
<div class="div11">
<img src="./images/logo.png" alt="">
<p class="nick">虚位以待</p>
<b class="id">ID:0</b>
</div>
<div>0</div>
<div>0</div>
<div>0</div>
<div>0</div>
</li>
</ul>
</body> </body>
<script src="../../common/js/flexible.js"></script> <script src="../../common/js/flexible.js"></script>
@@ -76,6 +101,7 @@
<script src="./local/ar.js"></script> <script src="./local/ar.js"></script>
<script src="./js/mobileSelect.js"></script> <script src="./js/mobileSelect.js"></script>
<script src="./js/selectDate.js"></script> <script src="./js/selectDate.js"></script>
<script src="./js/lay-picker.min.js"></script>
<script src="./js/memberFlow.js?v=1.0"></script> <script src="./js/memberFlow.js?v=1.0"></script>
<script src="../../common/local/langHandler.js"></script> <script src="../../common/local/langHandler.js"></script>

View File

@@ -5,9 +5,10 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title class="text1"></title> <title class="text1"></title>
<!-- 个人收入统计 --> <!-- 工资收入统计 -->
<link rel="stylesheet" href="../../common/css/reset.css"> <link rel="stylesheet" href="../../common/css/reset.css">
<link rel="stylesheet" href="./css/mobile.css"> <link rel="stylesheet" href="./css/mobile.css">
<link rel="stylesheet" href="./css/lay-picker.min.css">
<link rel="stylesheet" href="./css/memberFlow2.css?v=1.0"> <link rel="stylesheet" href="./css/memberFlow2.css?v=1.0">
</head> </head>
@@ -15,51 +16,125 @@
<!-- 顶部 --> <!-- 顶部 -->
<div class="back"> <div class="back">
<img src="./images/travel/backB.png" alt="" class="backs"> <img src="./images/travel/backB.png" alt="" class="backs">
<div class="title text2"></div> <div class="title text1"></div>
<div class="text text3"></div>
</div> </div>
<!-- 时间选择器筛选 --> <!-- 头部 -->
<div class="timeBox"> <div class="header">
<!-- 时间筛选 -->
<div class="time">
<span class="previousMonth text2"></span>
<div id="month"><b></b><img src="./images/xjt.png" alt=""></div>
<span class="nextMonth text3"></span>
</div>
<h3 class="text4"></h3>
<p>
<img src="./images/dor.png" alt="">
<span class="totalWage">0</span>
</p>
<!-- <div class="user">
<img src="./images/logo.png" alt="" class="tx">
<p>用户昵称</p>
<b>ID:0</b>
</div> -->
<div class="line"></div> <div class="line"></div>
<div class="year"><b>2024</b><span class="text4"></span></div> <div class="line1"></div>
<div class="startTime" id="select_0"><b>00-00</b><img src="./images/xjt.png" alt=""></div> <div class="line2"></div>
<div class="endTime" id="select_1"><b>00-00</b><img src="./images/xjt.png" alt=""></div> <div class="datas ">
<div class="right"> <div class="datas1">
<div class="div1"> <p>
<!-- 金币总收入 --> <img class="dor" src="./images/dor.png" alt="">
<p class="text5"></p> <b>0</b>
<b>0</b> </p>
<span class="text5"></span>
</div> </div>
<div class="div2"> <div class="datas2">
<!-- 钻石总收入 --> <p>
<p class="text6"></p> <img class="dor" src="./images/dor.png" alt="">
<b>0</b> <b>0</b>
</p>
<span class="text6"></span>
</div>
<div class="datas3">
<p>
<img src="./images/dos.png" alt="">
<b>0</b>
</p>
<span class="text7"></span>
</div>
</div>
</div>
<!-- 列表 -->
<div class="box">
<h3><span></span><strong class="text8"></strong> <b></b></h3>
<div class="box_in">
<!-- 左边 -->
<div class="fistBox">
<!-- <div class="fist">
<div class="title">成员信息</div>
<div class="user">
<img src="./images/logo.png" alt="" class="tx">
<p>用户昵称</p>
<b>ID:0</b>
</div>
</div>
<div class="fist fistAct">
<div class="title">成员信息</div>
<div class="user">
<img src="./images/logo.png" alt="" class="tx">
<p>用户昵称</p>
<b>ID:0</b>
</div>
</div> -->
</div>
<!-- 右边 -->
<div class="ordinaryBox">
<!-- <div class="ordinaryBox_in">
<div class="ordinary">
<div class="title">有效天数</div>
<p class="true">x</p>
</div>
<div class="ordinary">
<div class="title">金币收入</div>
<p class="true">x</p>
</div>
<div class="ordinary">
<div class="title">金币工资</div>
<p class="true">x</p>
</div>
<div class="ordinary">
<div class="title">钻石余额</div>
<p class="true">x</p>
</div>
<div class="ordinary">
<div class="title">查看</div>
<p class="true details">详情</p>
</div>
</div>
<div class="ordinaryBox_in ordinaryBox_inAct">
<div class="ordinary">
<div class="title">有效天数</div>
<p class="true">x</p>
</div>
<div class="ordinary">
<div class="title">金币收入</div>
<p class="true">x</p>
</div>
<div class="ordinary">
<div class="title">金币工资</div>
<p class="true">x</p>
</div>
<div class="ordinary">
<div class="title">钻石余额</div>
<p class="true">x</p>
</div>
<div class="ordinary">
<div class="title">查看</div>
<p class="true details">详情</p>
</div>
</div> -->
</div> </div>
<div class="goToExchangeGold text7"></div>
</div> </div>
</div> </div>
<!-- 数据内容 -->
<ul class="list">
<li class="top">
<!-- 日期 -->
<div class="text8"></div>
<!-- 开播时长 -->
<div class="text9"></div>
<!-- 金币收入 -->
<div class="text10"></div>
<!-- 钻石收入 -->
<div class="text11"></div>
<!-- 送礼用户数 -->
<div class="text12"></div>
</li>
<li class="other">
<div>0000/0/0</div>
<div>0</div>
<div>0</div>
<div>0</div>
<div>0</div>
</li>
</ul>
</body> </body>
<script src="../../common/js/flexible.js"></script> <script src="../../common/js/flexible.js"></script>
@@ -73,6 +148,7 @@
<script src="./local/ar.js"></script> <script src="./local/ar.js"></script>
<script src="./js/mobileSelect.js"></script> <script src="./js/mobileSelect.js"></script>
<script src="./js/selectDate.js"></script> <script src="./js/selectDate.js"></script>
<script src="./js/lay-picker.min.js"></script>
<script src="./js/memberFlow2.js?v=1.0"></script> <script src="./js/memberFlow2.js?v=1.0"></script>
<script src="../../common/local/langHandler.js"></script> <script src="../../common/local/langHandler.js"></script>

View File

@@ -0,0 +1,162 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title class="text1"></title>
<!-- 单个成员工资明细 -->
<link rel="stylesheet" href="../../common/css/reset.css">
<link rel="stylesheet" href="./css/mobile.css">
<link rel="stylesheet" href="./css/lay-picker.min.css">
<link rel="stylesheet" href="./css/memberFlow22.css?v=1.0">
</head>
<body>
<!-- 顶部 -->
<div class="back">
<img src="./images/travel/backB.png" alt="" class="backs">
<div class="title text1"></div>
</div>
<!-- 头部 -->
<div class="header">
<!-- 时间筛选 -->
<div class="time">
<span class="previousMonth text2"></span>
<div id="month"><b></b><img src="./images/xjt.png" alt=""></div>
<span class="nextMonth text3"></span>
</div>
<h3 class="text4"></h3>
<p>
<img src="./images/dor.png" alt="">
<span class="totalWage">0</span>
</p>
<div class="user">
<img src="./images/logo.png" alt="" class="tx">
<p></p>
<b>ID:0</b>
</div>
<div class="line"></div>
<div class="line1"></div>
<div class="line2"></div>
<div class="datas">
<div class="datas1">
<p>
<img class="" src="./images/gold2.png" alt="">
<b>0</b>
</p>
<span class="text5"></span>
</div>
<div class="datas2">
<p>
<b>0</b>
</p>
<span class="text6"></span>
</div>
<div class="datas3">
<p>
<img src="./images/dos.png" alt="">
<b>0</b>
</p>
<span class="text7"></span>
</div>
</div>
</div>
<!-- 列表 -->
<div class="box">
<h3><span></span><b class="text8"></b></h3>
<div class="box_in">
<!-- 左边 -->
<!-- <div class="fistBox">
<div class="fist">
<div class="title">赠送礼物人数</div>
<div class="user">
<img src="./images/logo.png" alt="" class="tx">
<p>用户昵称</p>
<b>ID:0</b>
</div>
</div>
<div class="fist fistAct">
<div class="title">赠送礼物人数</div>
<div class="user">
<img src="./images/logo.png" alt="" class="tx">
<p>用户昵称</p>
<b>ID:0</b>
</div>
</div>
<div class="fist fistAct">
<div class="title">赠送礼物人数</div>
<div class="user">
<img src="./images/logo.png" alt="" class="tx">
<p>用户昵称</p>
<b>ID:0</b>
</div>
</div>
</div> -->
<!-- 右边 -->
<div class="ordinaryBox">
<!-- <div class="ordinaryBox_in">
<div class="ordinary">
<div class="title">日期</div>
<p class="">x</p>
</div>
<div class="ordinary">
<div class="title">直播时长</div>
<p class="true">x</p>
</div>
<div class="ordinary">
<div class="title">单日金币收入</div>
<p class="">x</p>
</div>
<div class="ordinary">
<div class="title">月累计金币收入</div>
<p class="">x</p>
</div>
<div class="ordinary">
<div class="title">本月金币工资</div>
<p class="">x</p>
</div>
</div>
<div class="ordinaryBox_in ordinaryBox_inAct">
<div class="ordinary">
<div class="title">日期</div>
<p class="">x</p>
</div>
<div class="ordinary">
<div class="title">直播时长</div>
<p class="">x</p>
</div>
<div class="ordinary">
<div class="title">单日金币收入</div>
<p class="">x</p>
</div>
<div class="ordinary">
<div class="title">月累计金币收入</div>
<p class="">x</p>
</div>
<div class="ordinary">
<div class="title">本月金币工资</div>
<p class="">x</p>
</div>
</div> -->
</div>
</div>
</div>
</body>
<script src="../../common/js/flexible.js"></script>
<script src="../../common/js/jquery-3.2.1.min.js"></script>
<script src="../../common/js/common2.js"></script>
<script src="../../common/js/layer.js"></script>
<script src="../../common/js/vconsole.min.js"></script>
<script src="../../common/js/route-constant.js"></script>
<script src="./local/en.js"></script>
<script src="./local/zh.js"></script>
<script src="./local/ar.js"></script>
<script src="./js/mobileSelect.js"></script>
<script src="./js/selectDate.js"></script>
<script src="./js/lay-picker.min.js"></script>
<script src="./js/memberFlow22.js?v=1.0"></script>
<script src="../../common/local/langHandler.js"></script>
</html>

View File

@@ -0,0 +1,163 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title class="text1"></title>
<!-- 我的工资 -->
<link rel="stylesheet" href="../../common/css/reset.css">
<link rel="stylesheet" href="./css/mobile.css">
<link rel="stylesheet" href="./css/lay-picker.min.css">
<link rel="stylesheet" href="./css/memberFlow22.css?v=1.0">
</head>
<body>
<!-- 顶部 -->
<div class="back">
<img src="./images/travel/backB.png" alt="" class="backs">
<div class="title text1"></div>
</div>
<!-- 头部 -->
<div class="header">
<!-- 时间筛选 -->
<div class="time">
<span class="previousMonth text2"></span>
<div id="month"><b></b><img src="./images/xjt.png" alt=""></div>
<span class="nextMonth text3"></span>
</div>
<h3 class="text4"></h3>
<p>
<img src="./images/dor.png" alt="">
<span class="totalWage">0</span>
</p>
<div class="user">
<img src="./images/logo.png" alt="" class="tx">
<p></p>
<b>ID:0</b>
</div>
<div class="line"></div>
<div class="line1"></div>
<div class="line2"></div>
<div class="datas">
<div class="datas1">
<p>
<img class="" src="./images/gold2.png" alt="">
<b>0</b>
</p>
<span class="text5"></span>
</div>
<div class="datas2">
<p>
<!-- <img class="dor" src="./images/dor.png" alt=""> -->
<b>0</b>
</p>
<span class="text6"></span>
</div>
<div class="datas3">
<p>
<img src="./images/dos.png" alt="">
<b>0</b>
</p>
<span class="text7"></span>
</div>
</div>
</div>
<!-- 列表 -->
<div class="box">
<h3><span></span><b class="text8"></b></h3>
<div class="box_in">
<!-- 左边 -->
<!-- <div class="fistBox">
<div class="fist">
<div class="title">赠送礼物人数</div>
<div class="user">
<img src="./images/logo.png" alt="" class="tx">
<p>用户昵称</p>
<b>ID:0</b>
</div>
</div>
<div class="fist fistAct">
<div class="title">赠送礼物人数</div>
<div class="user">
<img src="./images/logo.png" alt="" class="tx">
<p>用户昵称</p>
<b>ID:0</b>
</div>
</div>
<div class="fist fistAct">
<div class="title">赠送礼物人数</div>
<div class="user">
<img src="./images/logo.png" alt="" class="tx">
<p>用户昵称</p>
<b>ID:0</b>
</div>
</div>
</div> -->
<!-- 右边 -->
<div class="ordinaryBox">
<!-- <div class="ordinaryBox_in">
<div class="ordinary">
<div class="title">日期</div>
<p class="">x</p>
</div>
<div class="ordinary">
<div class="title">直播时长</div>
<p class="true">x</p>
</div>
<div class="ordinary">
<div class="title">单日金币收入</div>
<p class="">x</p>
</div>
<div class="ordinary">
<div class="title">月累计金币收入</div>
<p class="">x</p>
</div>
<div class="ordinary">
<div class="title">本月金币工资</div>
<p class="">x</p>
</div>
</div>
<div class="ordinaryBox_in ordinaryBox_inAct">
<div class="ordinary">
<div class="title">日期</div>
<p class="">x</p>
</div>
<div class="ordinary">
<div class="title">直播时长</div>
<p class="">x</p>
</div>
<div class="ordinary">
<div class="title">单日金币收入</div>
<p class="">x</p>
</div>
<div class="ordinary">
<div class="title">月累计金币收入</div>
<p class="">x</p>
</div>
<div class="ordinary">
<div class="title">本月金币工资</div>
<p class="">x</p>
</div>
</div> -->
</div>
</div>
</div>
</body>
<script src="../../common/js/flexible.js"></script>
<script src="../../common/js/jquery-3.2.1.min.js"></script>
<script src="../../common/js/common2.js"></script>
<script src="../../common/js/layer.js"></script>
<script src="../../common/js/vconsole.min.js"></script>
<script src="../../common/js/route-constant.js"></script>
<script src="./local/en.js"></script>
<script src="./local/zh.js"></script>
<script src="./local/ar.js"></script>
<script src="./js/mobileSelect.js"></script>
<script src="./js/selectDate.js"></script>
<script src="./js/lay-picker.min.js"></script>
<script src="./js/memberFlow222.js?v=1.0"></script>
<script src="../../common/local/langHandler.js"></script>
</html>

View File

@@ -0,0 +1,184 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title class="">工资收入统计</title>
<!-- 成员收入统计 -->
<link rel="stylesheet" href="../../common/css/reset.css">
<link rel="stylesheet" href="./css/mobile.css">
<link rel="stylesheet" href="./css/lay-picker.min.css">
<link rel="stylesheet" href="./css/memberFlow3.css?v=1.0">
</head>
<body>
<!-- 顶部 -->
<div class="back">
<img src="./images/travel/backB.png" alt="" class="backs">
<div class="title ">工资收入统计</div>
</div>
<!-- 头部 -->
<div class="header">
<!-- 时间筛选 -->
<div class="time">
<span class="previousMonth">前一个月</span>
<div id="month">2024-01</div>
<span class="nextMonth">后一个月</span>
</div>
<h3>我的月工资</h3>
<p>
<img src="./images/goldIcon.png" alt="">
<span>0</span>
</p>
<!-- <div class="user">
<img src="./images/logo.png" alt="" class="tx">
<p>用户昵称</p>
<b>ID:0</b>
</div> -->
<div class="line"></div>
<div class="line1"></div>
<div class="line2"></div>
<div class="datas">
<div>
<p>
<img src="./images/gold2.png" alt="">
<b>0</b>
</p>
<span>金币收入</span>
</div>
<div>
<p>
<b>0</b>
</p>
<span>有效天数</span>
</div>
<div>
<p>
<img src="./images/dos.png" alt="">
<b>0</b>
</p>
<span>当前钻石</span>
</div>
</div>
</div>
<!-- 列表 -->
<div class="box">
<h3><span></span><b>单日明细</b></h3>
<div class="box_in">
<!-- 左边 -->
<div class="fistBox">
<div class="fist">
<div class="title">赠送礼物人数</div>
<div class="user">
<img src="./images/logo.png" alt="" class="tx">
<p>用户昵称</p>
<b>ID:0</b>
</div>
</div>
<div class="fist fistAct">
<div class="title">赠送礼物人数</div>
<div class="user">
<img src="./images/logo.png" alt="" class="tx">
<p>用户昵称</p>
<b>ID:0</b>
</div>
</div>
<div class="fist fistAct">
<div class="title">赠送礼物人数</div>
<div class="user">
<img src="./images/logo.png" alt="" class="tx">
<p>用户昵称</p>
<b>ID:0</b>
</div>
</div>
</div>
<!-- 右边 -->
<div class="ordinaryBox">
<div class="ordinaryBox_in">
<div class="ordinary">
<div class="title">直播时长</div>
<p class="true">54min</p>
</div>
<div class="ordinary">
<div class="title">金币收入</div>
<p class="true">54min</p>
</div>
<div class="ordinary">
<div class="title">赠送礼物人数</div>
<p class="true">54min</p>
</div>
<div class="ordinary">
<div class="title">赠送礼物人数</div>
<p class="true">54min</p>
</div>
<div class="ordinary">
<div class="title">赠送礼物人数</div>
<p class="true">54min</p>
</div>
</div>
<div class="ordinaryBox_in ordinaryBox_inAct">
<div class="ordinary">
<div class="title">直播时长</div>
<p class="true">54min</p>
</div>
<div class="ordinary">
<div class="title">金币收入</div>
<p class="true">54min</p>
</div>
<div class="ordinary">
<div class="title">赠送礼物人数</div>
<p class="true">54min</p>
</div>
<div class="ordinary">
<div class="title">赠送礼物人数</div>
<p class="true">54min</p>
</div>
<div class="ordinary">
<div class="title">赠送礼物人数</div>
<p class="true">54min</p>
</div>
</div>
<div class="ordinaryBox_in ordinaryBox_inAct">
<div class="ordinary">
<div class="title">直播时长</div>
<p class="true">54min</p>
</div>
<div class="ordinary">
<div class="title">金币收入</div>
<p class="true">54min</p>
</div>
<div class="ordinary">
<div class="title">赠送礼物人数</div>
<p class="true">54min</p>
</div>
<div class="ordinary">
<div class="title">赠送礼物人数</div>
<p class="true">54min</p>
</div>
<div class="ordinary">
<div class="title">赠送礼物人数</div>
<p class="true">54min</p>
</div>
</div>
</div>
</div>
</div>
</body>
<script src="../../common/js/flexible.js"></script>
<script src="../../common/js/jquery-3.2.1.min.js"></script>
<script src="../../common/js/common2.js"></script>
<script src="../../common/js/layer.js"></script>
<script src="../../common/js/vconsole.min.js"></script>
<script src="../../common/js/route-constant.js"></script>
<script src="./local/en.js"></script>
<script src="./local/zh.js"></script>
<script src="./local/ar.js"></script>
<script src="./js/mobileSelect.js"></script>
<script src="./js/selectDate.js"></script>
<script src="./js/lay-picker.min.js"></script>
<script src="./js/memberFlow3.js?v=1.0"></script>
<script src="../../common/local/langHandler.js"></script>
</html>