diff --git a/view/molistar/modules/guildAr/css/guildInfoSet.css b/view/molistar/modules/guildAr/css/guildInfoSet.css index b2ce18c0..8c06e6e7 100644 --- a/view/molistar/modules/guildAr/css/guildInfoSet.css +++ b/view/molistar/modules/guildAr/css/guildInfoSet.css @@ -4,7 +4,7 @@ body { height: 17.78667rem; background: #F5F7F9; box-sizing: border-box; - padding: 0 0.42667rem; + padding: 1.73333rem 0rem 0 0; } .back { @@ -30,91 +30,137 @@ body { top: 54%; } -.nick { - margin-top: 2.93333rem; +input { + background: none; + outline: none; + bottom: none; +} + +h3 { color: #333333; font-size: 0.42667rem; - font-weight: 800; + margin-bottom: 0.57333rem; + font-weight: 500; + margin-left: 0.42667rem; + text-align: left; } -.nick input { - border: none; - outline: none; - background: #F5F7F9; - 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; +.name { + width: 9.01333rem; + height: 1.01333rem; + line-height: 1.01333rem; 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; - color: #333; - font-size: 0.42667rem; - line-height: 2.26667rem; - font-weight: 800; + margin-left: 0.42667rem; + margin-right: 0.22667rem; + width: 4rem; + height: 4rem; + border-radius: 0.06667rem; } -.bg img { - width: 2.26667rem; - height: 2.26667rem; +.background span { + color: #E13B3F; + font-size: 0.37333rem; + font-weight: 400; + margin-top: 3.65333rem; + display: inline-block; +} + +.background input { position: absolute; - top: 0; - left: 2.53333rem; - z-index: 1; - border-radius: 0.13333rem; + right: 1.2rem; + bottom: -0.2rem; + width: 0.93333rem; + height: 0.8rem; } -.bg .upload { - width: 2.26667rem; - height: 2.26667rem; +.background .act { + color: #67D2A6; +} + +.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; + left: 0.26667rem; +} + +.account input { + position: absolute; + left: 2.13333rem; top: 0; - left: 2.53333rem; - z-index: 2; + height: 100%; + color: #000; + font-size: 0.37333rem; + font-weight: 500; + box-sizing: border-box; + padding-left: 0.46667rem; + width: 60%; } -.boxBut { - width: 7.06667rem; - height: 0.93333rem; - margin: 1.73333rem auto 0; - display: flex; - justify-content: space-between; +.account span { + position: absolute; + right: 0.50667rem; + top: 0; + height: 100%; + color: #E13B3F; + font-size: 0.37333rem; + font-weight: 400; } -.boxBut .close { - width: 2.88rem; - 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); +.account .act { + color: #67D2A6; } diff --git a/view/molistar/modules/guildAr/css/guildInfoSet.scss b/view/molistar/modules/guildAr/css/guildInfoSet.scss index 8cf46924..f31a6b5c 100644 --- a/view/molistar/modules/guildAr/css/guildInfoSet.scss +++ b/view/molistar/modules/guildAr/css/guildInfoSet.scss @@ -8,7 +8,7 @@ body { height: px2rem(1334); background: #F5F7F9; box-sizing: border-box; - padding: 0 px2rem(32); + padding: px2rem(130) px2rem(0) 0 0; } .back { @@ -34,91 +34,138 @@ body { } } -.nick { - margin-top: px2rem(220); +input { + background: none; + outline: none; + bottom: none; +} + +h3 { color: #333333; 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 { - border: none; - outline: none; - background: #F5F7F9; - width: 5.4rem; - height: px2rem(50); - border-radius: px2rem(50); + position: absolute; + left: 0; + top: 0; + width: 80%; + height: 100%; + color: #3C3C3C; + font-size: px2rem(28); + font-weight: 400; box-sizing: border-box; - color: #333; - font-size: px2rem(32); - box-sizing: border-box; - padding-left: px2rem(10); - margin-bottom: px2rem(56); - - &::placeholder { - color: #515665; - } + padding-left: px2rem(28); } -} - -.bg { - width: 100%; - height: px2rem(170); - position: relative; span { - display: inline-block; - color: #333; - font-size: px2rem(32); - line-height: px2rem(170); - font-weight: 800; + position: absolute; + right: px2rem(38); + top: 0; + height: 100%; + color: #E13B3F; + font-size: px2rem(28); + font-weight: 400; } - img { - width: px2rem(170); - 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; + .act { + color: #67D2A6; } } -.boxBut { - width: px2rem(530); - height: px2rem(70); - margin: px2rem(130) auto 0; - display: flex; - justify-content: space-between; +.background { + position: relative; + width: px2rem(500); + height: px2rem(300); + margin-bottom: px2rem(67); - .close { - width: px2rem(216); - height: px2rem(70); - line-height: px2rem(70); - border-radius: px2rem(70); - text-align: center; - color: #fff; - font-size: px2rem(32); - background: #CCCBCE; + img { + display: inline-block; + margin-left: px2rem(32); + margin-right: px2rem(17); + width: px2rem(300); + height: px2rem(300); + border-radius: px2rem(5); } - .ok { - width: px2rem(216); - height: px2rem(70); - line-height: px2rem(70); - border-radius: px2rem(70); - text-align: center; - color: #fff; - font-size: px2rem(32); - background: linear-gradient(90deg, #867FFF, #66E3FF); + span { + color: #E13B3F; + font-size: px2rem(28); + font-weight: 400; + margin-top: px2rem(274); + display: inline-block; + + } + + 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; } } \ No newline at end of file diff --git a/view/molistar/modules/guildAr/css/index.css b/view/molistar/modules/guildAr/css/index.css index f2120ea2..15fa8899 100644 --- a/view/molistar/modules/guildAr/css/index.css +++ b/view/molistar/modules/guildAr/css/index.css @@ -94,86 +94,6 @@ body { 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 { width: 100%; position: absolute; @@ -186,11 +106,50 @@ body { 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 { width: 9.25333rem; - height: 13.33333rem; + height: 11rem; border-radius: 0.26667rem; - margin: -1.66667rem auto 0rem; + margin: -0.3rem auto 0rem; position: relative; background: #fff; overflow: hidden; @@ -260,7 +219,7 @@ body { .guildList ul { width: 100%; - height: 11.8rem; + height: 11rem; margin: 0.52rem auto 0; overflow-y: scroll; } @@ -334,7 +293,7 @@ body { .guildList ul li .but { width: 1.17333rem; height: 0.56rem; - background: #7F95FF; + background: #62D0A8; border-radius: 0.56rem; position: absolute; right: 0.34667rem; @@ -342,7 +301,7 @@ body { text-align: center; color: #fff; line-height: 0.56rem; - font-size: 0.34667rem; + font-size: 0.29333rem; font-weight: 400; } @@ -434,3 +393,92 @@ body { background: linear-gradient(90deg, #53C7D4, #7C5EFD); 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; +} diff --git a/view/molistar/modules/guildAr/css/index.scss b/view/molistar/modules/guildAr/css/index.scss index c33a59fc..f0f6fc84 100644 --- a/view/molistar/modules/guildAr/css/index.scss +++ b/view/molistar/modules/guildAr/css/index.scss @@ -98,85 +98,85 @@ body { top: px2rem(423); } - .adminSet { - padding: px2rem(0) px2rem(16); - box-sizing: border-box; - height: px2rem(44); - line-height: px2rem(44); - color: #fff; - font-size: px2rem(32); - font-weight: 400; - background: linear-gradient(90deg, rgba(82, 59, 85, 0.98), rgba(21, 5, 16, 0.98)); - border-radius: px2rem(44) 0px 0px px2rem(44); - position: absolute; - right: 0; - top: px2rem(184); - display: none; - } + // .adminSet { + // padding: px2rem(0) px2rem(16); + // box-sizing: border-box; + // height: px2rem(44); + // line-height: px2rem(44); + // color: #fff; + // font-size: px2rem(32); + // font-weight: 400; + // background: linear-gradient(90deg, rgba(82, 59, 85, 0.98), rgba(21, 5, 16, 0.98)); + // border-radius: px2rem(44) 0px 0px px2rem(44); + // position: absolute; + // right: 0; + // top: px2rem(184); + // display: none; + // } - .guildInfoSet { - padding: px2rem(0) px2rem(16); - box-sizing: border-box; - height: px2rem(44); - line-height: px2rem(44); - color: #fff; - font-size: px2rem(32); - font-weight: 400; - background: linear-gradient(90deg, rgba(82, 59, 85, 0.7), rgba(21, 5, 16, 0.7)); - border-radius: px2rem(44) 0px 0px px2rem(44); - position: absolute; - right: 0; - top: px2rem(239); - display: none; - } + // .guildInfoSet { + // padding: px2rem(0) px2rem(16); + // box-sizing: border-box; + // height: px2rem(44); + // line-height: px2rem(44); + // color: #fff; + // font-size: px2rem(32); + // font-weight: 400; + // background: linear-gradient(90deg, rgba(82, 59, 85, 0.7), rgba(21, 5, 16, 0.7)); + // border-radius: px2rem(44) 0px 0px px2rem(44); + // position: absolute; + // right: 0; + // top: px2rem(239); + // display: none; + // } - .memberFlow { - width: px2rem(208); - height: px2rem(56); - line-height: px2rem(56); - text-align: center; - color: #fff; - font-size: px2rem(32); - font-weight: 400; - background: linear-gradient(90deg, rgba(128, 146, 255, .6) 0%, rgba(108, 208, 255, .6) 100%); - border-radius: px2rem(14); - position: absolute; - left: px2rem(156); - top: px2rem(466); - display: none; - } + // .memberFlow { + // width: px2rem(208); + // height: px2rem(56); + // line-height: px2rem(56); + // text-align: center; + // color: #fff; + // font-size: px2rem(32); + // font-weight: 400; + // background: linear-gradient(90deg, rgba(128, 146, 255, .6) 0%, rgba(108, 208, 255, .6) 100%); + // border-radius: px2rem(14); + // position: absolute; + // left: px2rem(156); + // top: px2rem(466); + // display: none; + // } - .memberFlowMy { - width: px2rem(208); - height: px2rem(56); - line-height: px2rem(56); - text-align: center; - color: #fff; - font-size: px2rem(32); - font-weight: 400; - background: linear-gradient(90deg, rgba(128, 146, 255, .6) 0%, rgba(108, 208, 255, .6) 100%); - border-radius: px2rem(14) 0 0 px2rem(14); - position: absolute; - right: px2rem(0); - top: px2rem(218); - display: none; - } + // .memberFlowMy { + // width: px2rem(208); + // height: px2rem(56); + // line-height: px2rem(56); + // text-align: center; + // color: #fff; + // font-size: px2rem(32); + // font-weight: 400; + // background: linear-gradient(90deg, rgba(128, 146, 255, .6) 0%, rgba(108, 208, 255, .6) 100%); + // border-radius: px2rem(14) 0 0 px2rem(14); + // position: absolute; + // right: px2rem(0); + // top: px2rem(218); + // display: none; + // } - .inveMember { - width: px2rem(208); - height: px2rem(56); - line-height: px2rem(56); - text-align: center; - color: #fff; - font-size: px2rem(32); - font-weight: 400; - background: linear-gradient(90deg, rgba(128, 146, 255, .6) 0%, rgba(108, 208, 255, .6) 100%); - border-radius: px2rem(14); - position: absolute; - right: px2rem(156); - top: px2rem(466); - display: none; - } + // .inveMember { + // width: px2rem(208); + // height: px2rem(56); + // line-height: px2rem(56); + // text-align: center; + // color: #fff; + // font-size: px2rem(32); + // font-weight: 400; + // background: linear-gradient(90deg, rgba(128, 146, 255, .6) 0%, rgba(108, 208, 255, .6) 100%); + // border-radius: px2rem(14); + // position: absolute; + // right: px2rem(156); + // top: px2rem(466); + // display: none; + // } .guildNick { width: 100%; @@ -189,13 +189,53 @@ body { text-align: center; 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 { width: px2rem(694); - height: px2rem(1000); + height: 11rem; border-radius: px2rem(20); - margin: px2rem(-125) auto px2rem(0); + margin: -0.3rem auto px2rem(0); position: relative; background: #fff; overflow: hidden; @@ -265,7 +305,7 @@ body { ul { width: 100%; - height: 11.8rem; + height: 11rem; margin: px2rem(39) auto 0; overflow-y: scroll; @@ -337,7 +377,7 @@ body { .but { width: px2rem(88); height: px2rem(42); - background: #7F95FF; + background: #62D0A8; border-radius: px2rem(42); position: absolute; right: px2rem(26); @@ -345,7 +385,7 @@ body { text-align: center; color: #fff; line-height: px2rem(42); - font-size: px2rem(26); + font-size: px2rem(22); 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); + } + } + } } \ No newline at end of file diff --git a/view/molistar/modules/guildAr/css/lay-picker.min.css b/view/molistar/modules/guildAr/css/lay-picker.min.css new file mode 100644 index 00000000..a814ae0f --- /dev/null +++ b/view/molistar/modules/guildAr/css/lay-picker.min.css @@ -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} diff --git a/view/molistar/modules/guildAr/css/memberFlow.css b/view/molistar/modules/guildAr/css/memberFlow.css index 827c5eae..a7eb3781 100644 --- a/view/molistar/modules/guildAr/css/memberFlow.css +++ b/view/molistar/modules/guildAr/css/memberFlow.css @@ -38,6 +38,8 @@ body { color: #333333; font-size: 0.45333rem; font-weight: bold; + width: 100%; + text-align: center; } .back .text { @@ -50,207 +52,292 @@ body { font-size: 0.4rem; } -.timeBox { +.header { width: 9.46667rem; - height: 2.54667rem; + height: 4.18667rem; background: #fff; border-radius: 0.4rem; - margin: 2.53333rem auto 0.25333rem; - 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; + margin: 2.8rem auto 0.34667rem; overflow: hidden; } -.timeBox .right div p { - color: #A4ABB2; - font-size: 0.32rem; - font-weight: bold; - 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; +.header .time { + width: 100%; + height: 0.53333rem; + line-height: 0.53333rem; display: flex; 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; left: 50%; transform: translateX(-50%); top: 0rem; - background: #fff; - border-radius: 0.4rem 0.4rem 0 0; + z-index: 2; + display: none; } -.list .top div { - width: 25%; +.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; - color: #5D95FF; - font-size: 0.29333rem; - font-weight: 600; + background: linear-gradient(90deg, #FFEB67, #FFFCE7); + color: #333333; + font-size: 0.16rem; + font-weight: 400; + font-style: normal; } -.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; - font-size: 0.32rem; - font-weight: 500; - white-space: nowrap; -} - -.list .other div img { +.box .box_in .fistBox .fist .i { + display: block; +} + +.box .box_in .fistBox .fist img { display: block; - margin: 0.45333rem auto 0.06667rem; width: 0.42667rem; height: 0.42667rem; border-radius: 50%; + margin: 0 auto 0.06667rem; } -.list .other div p { - width: 98%; - height: 0.33333rem; - line-height: 0.32rem; +.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: 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; color: #848D9C; font-size: 0.32rem; - margin-bottom: 0.12rem; + font-weight: 500; + line-height: 1.2rem; + white-space: nowrap; } -.list .other div .id { - width: 100%; - text-align: center; - color: #A4ABB2; - font-size: 0.24rem; +.box .box_in .ordinaryBox .ordinaryBox_in .ordinary .true { + color: #4EA686; } -.list .other .div11 { - line-height: 0rem; +.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; +} + +.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; } diff --git a/view/molistar/modules/guildAr/css/memberFlow.scss b/view/molistar/modules/guildAr/css/memberFlow.scss index 4695f091..017ffd24 100644 --- a/view/molistar/modules/guildAr/css/memberFlow.scss +++ b/view/molistar/modules/guildAr/css/memberFlow.scss @@ -41,6 +41,8 @@ body { color: #333333; font-size: px2rem(34); font-weight: bold; + width: 100%; + text-align: center; } .text { @@ -54,211 +56,310 @@ body { } } -.timeBox { +.header { width: px2rem(710); - height: px2rem(191); + height: px2rem(314); background: #fff; border-radius: px2rem(30); - margin: px2rem(190) auto px2rem(19); - position: relative; + margin: px2rem(210) auto px2rem(26); + overflow: hidden; - .line { - width: px2rem(2); - height: px2rem(143); - background: #D7DCE6; - 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; + .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(40); + color: #848D9C; + font-size: px2rem(30); + font-weight: 500; div { - width: 50%; - 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; - } + width: px2rem(230); b { - color: #848D9C; - font-size: px2rem(28); - font-weight: bold; + display: inline-block; + vertical-align: middle; + } + + 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 { - width: px2rem(710); - height: px2rem(960); - 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; +.english { + .box .box_in .ordinaryBox .ordinaryBox_in { + width: 11.6rem; - &::-webkit-scrollbar { - display: none; + .ordinary { + width: 3.2rem; + + .title { + font-size: px2rem(23); + } + } + } +} + +.arabic { + .box .box_in .fistBox .fist { + margin-right: 0; + margin-left: 0.4rem; } - .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: 0rem; - background: #fff; - border-radius: px2rem(30) px2rem(30) 0 0; + .box .box_in .ordinaryBox { + .ordinaryBox_in { + width: 10rem; - div { - width: 25%; - text-align: center; - color: #5D95FF; - font-size: px2rem(22); - font-weight: 600; + .ordinary { + width: 2.8rem; + + .title { + // font-size: px2rem(28); + } + } } } - .other { - width: px2rem(657); - height: px2rem(151); - margin: 0 auto 0; - border-bottom: px2rem(2) solid #D7DCE6; - display: flex; - justify-content: space-between; - // background: pink; + .header h3 { + margin-right: 0.3rem; + } - &:last-child { - border: none; - } + .box h3 span { + margin-right: 0.3rem; + margin-left: 0; + } - div { - width: 25%; - text-align: center; - height: 100%; - line-height: px2rem(151); - color: #848D9C; - font-size: px2rem(24); - font-weight: 500; - white-space: nowrap; + .box h3 b { + margin-right: 0.3rem; + } - img { - display: block; - 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; - } + .box .box_in .ordinaryBox .ordinaryBox_in .ordinary { + float: right; } } \ No newline at end of file diff --git a/view/molistar/modules/guildAr/css/memberFlow2.css b/view/molistar/modules/guildAr/css/memberFlow2.css index 1bf92ff6..309e3000 100644 --- a/view/molistar/modules/guildAr/css/memberFlow2.css +++ b/view/molistar/modules/guildAr/css/memberFlow2.css @@ -38,6 +38,7 @@ body { color: #333333; font-size: 0.45333rem; font-weight: bold; + width: 100%; } .back .text { @@ -50,220 +51,472 @@ body { font-size: 0.4rem; } -.timeBox { +.header { width: 9.46667rem; - height: 2.54667rem; + height: 6.34667rem; background: #fff; border-radius: 0.4rem; - margin: 2.53333rem auto 0.25333rem; - 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; + margin: 2.8rem auto 0.34667rem; overflow: hidden; position: relative; } -.timeBox .right div p { - color: #A4ABB2; - font-size: 0.32rem; - font-weight: bold; - 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; +.header .time { + width: 100%; + height: 0.53333rem; + line-height: 0.53333rem; display: flex; justify-content: space-between; - line-height: 0.4rem; - position: absolute; - left: 50%; - transform: translateX(-50%); - top: 0; - background: #fff; - border-radius: 0.4rem 0.4rem 0 0; -} - -.list .top div { - width: 25%; + box-sizing: border-box; + margin: 0.38667rem auto 0.76rem; text-align: center; - color: #5D95FF; - 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; + padding: 0 0.26667rem; color: #848D9C; - font-size: 0.32rem; + 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; } -.list .other div img { - display: block; - margin: 0.45333rem auto 0.06667rem; - width: 0.42667rem; - height: 0.42667rem; - border-radius: 50%; +.header .time div img { + width: 0.32rem; + height: 0.21333rem; + display: inline-block; + vertical-align: middle; + margin-left: 0.13333rem; } -.list .other div p { - width: 98%; - height: 0.33333rem; - line-height: 0.32rem; +.header .time span { + display: block; + width: 3rem; +} + +.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; 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 .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; color: #848D9C; font-size: 0.32rem; - margin-bottom: 0.12rem; + font-weight: 500; + line-height: 1.2rem; } -.list .other div .id { - width: 100%; - text-align: center; - color: #A4ABB2; - font-size: 0.24rem; +.box .box_in .ordinaryBox .ordinaryBox_in .ordinary .true { + color: #4EA686; } -.list .other .div11 { - line-height: 0rem; +.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 .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; } diff --git a/view/molistar/modules/guildAr/css/memberFlow2.scss b/view/molistar/modules/guildAr/css/memberFlow2.scss index b837f022..cb225f6d 100644 --- a/view/molistar/modules/guildAr/css/memberFlow2.scss +++ b/view/molistar/modules/guildAr/css/memberFlow2.scss @@ -19,7 +19,7 @@ body { color: #FFFFFF; font-size: px2rem(38); font-weight: bold; - z-index: 10; + z-index: 10; background: #fff; .backs { @@ -31,8 +31,6 @@ body { z-index: 2; } - - .title { position: absolute; left: 50%; @@ -43,6 +41,7 @@ body { color: #333333; font-size: px2rem(34); font-weight: bold; + width: 100%; } .text { @@ -56,223 +55,494 @@ body { } } -.timeBox { +.header { width: px2rem(710); - height: px2rem(191); + height: px2rem(476); background: #fff; border-radius: px2rem(30); - margin: px2rem(190) auto px2rem(19); + margin: px2rem(210) auto px2rem(26); + overflow: hidden; position: relative; - .line { - width: px2rem(2); - height: px2rem(143); - background: #D7DCE6; - 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; + .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; - 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 { - width: px2rem(219); - position: absolute; - left: 0; - top: px2rem(72); - color: #848D9C; - font-size: px2rem(28); - font-weight: bold; + h3 { + width: 100%; + box-sizing: border-box; + padding-left: px2rem(40); + color: #141515; + font-size: px2rem(34); + // font-weight: 600; + margin-bottom: px2rem(54); // text-align: center; + } - b { - margin-right: 0.1rem; - text-indent: 0.45rem; - display: inline-block; - } + p { + height: px2rem(40); + line-height: px2rem(40); + width: 100%; + text-align: center; + color: #232424; + font-size: px2rem(52); + font-weight: 500; img { - width: px2rem(24); - height: px2rem(16); display: inline-block; - margin-top: 0.1rem; + width: px2rem(21); + height: px2rem(46); + margin-top: -0.05rem; } } - .endTime { - width: px2rem(219); + .user { + width: px2rem(128); + height: px2rem(86); 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; - } + left: px2rem(66); + top: px2rem(105); + text-align: center; img { - width: px2rem(24); - height: px2rem(16); - display: inline-block; - margin-top: 0.1rem; + 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); } } - .right { - width: 5.5rem; - height: px2rem(191); + .line { + width: px2rem(657); + height: px2rem(1); + background: #B0BACD; position: absolute; - right: 0.55rem; - top: 0; + 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: 50%; + width: px2rem(191); text-align: center; - overflow: hidden; - position: relative; p { - color: #A4ABB2; - font-size: px2rem(24); - font-weight: bold; - margin-top: px2rem(40); - margin-bottom: px2rem(25); - line-height: 0.34rem; + 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; + } } - b { - color: #848D9C; + span { + color: #666666; font-size: px2rem(28); - font-weight: bold; - position: absolute; - left: 50%; - transform: translateX(-50%); - bottom: px2rem(45); + font-weight: 400; + white-space: nowrap; } } - - .goToExchangeGold { - position: absolute; - top: px2rem(155); - right: px2rem(0); - color: #D25555; - font-size: px2rem(20); - } } } -.list { - width: px2rem(710); - height: px2rem(960); - 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; +.datasAct { + .line1 { + left: 50%; + transform: translateX(-50%); + } - &::-webkit-scrollbar { + .line2 { 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 { - width: 25%; - text-align: center; - color: #5D95FF; - font-size: px2rem(22); - font-weight: 600; + .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); } } - .other { - width: px2rem(657); - height: px2rem(151); - margin: 0 auto 0; - border-bottom: px2rem(2) solid #D7DCE6; + .box_in { + width: 100%; + height: 100%; display: flex; - justify-content: space-between; - &:last-child { - border: none; + .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%; + } + } } - div { - width: 25%; - text-align: center; + .ordinaryBox { height: 100%; - line-height: px2rem(151); - color: #848D9C; - font-size: px2rem(24); - font-weight: 500; - white-space: nowrap; + overflow-x: scroll; - img { - display: block; - margin: px2rem(34) auto px2rem(5); - width: px2rem(32); - height: px2rem(32); - border-radius: 50%; + &::-webkit-scrollbar { + // display: none; } - 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); - } + .ordinaryBox_in { + width: 13.5rem; + height: 100%; - .id { - width: 100%; - text-align: center; - color: #A4ABB2; - font-size: px2rem(18); + .ordinary { + width: px2rem(170); + height: px2rem(151); + float: left; + 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 { - line-height: 0rem; + .fistBox .fistAct { + .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); } } \ No newline at end of file diff --git a/view/molistar/modules/guildAr/css/memberFlow22.css b/view/molistar/modules/guildAr/css/memberFlow22.css new file mode 100644 index 00000000..86d8d576 --- /dev/null +++ b/view/molistar/modules/guildAr/css/memberFlow22.css @@ -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; +} diff --git a/view/molistar/modules/guildAr/css/memberFlow22.scss b/view/molistar/modules/guildAr/css/memberFlow22.scss new file mode 100644 index 00000000..a24c6c02 --- /dev/null +++ b/view/molistar/modules/guildAr/css/memberFlow22.scss @@ -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; + } +} \ No newline at end of file diff --git a/view/molistar/modules/guildAr/css/memberFlow3.css b/view/molistar/modules/guildAr/css/memberFlow3.css new file mode 100644 index 00000000..c3b10b1c --- /dev/null +++ b/view/molistar/modules/guildAr/css/memberFlow3.css @@ -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; +} diff --git a/view/molistar/modules/guildAr/css/memberFlow3.scss b/view/molistar/modules/guildAr/css/memberFlow3.scss new file mode 100644 index 00000000..2e7e17c2 --- /dev/null +++ b/view/molistar/modules/guildAr/css/memberFlow3.scss @@ -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); + } + } + } +} \ No newline at end of file diff --git a/view/molistar/modules/guildAr/guildInfoSet.html b/view/molistar/modules/guildAr/guildInfoSet.html index 9ffd0215..7d28413b 100644 --- a/view/molistar/modules/guildAr/guildInfoSet.html +++ b/view/molistar/modules/guildAr/guildInfoSet.html @@ -17,19 +17,35 @@ -
- -
- - +

公会名称

+
+ + 修改 +
+ +

公会背景图

+
+ + 修改
-
- -
- -
+ +

收款帐户

+ + + diff --git a/view/molistar/modules/guildAr/images/dor.png b/view/molistar/modules/guildAr/images/dor.png new file mode 100644 index 00000000..e3ccbd18 Binary files /dev/null and b/view/molistar/modules/guildAr/images/dor.png differ diff --git a/view/molistar/modules/guildAr/images/dos.png b/view/molistar/modules/guildAr/images/dos.png new file mode 100644 index 00000000..2a582365 Binary files /dev/null and b/view/molistar/modules/guildAr/images/dos.png differ diff --git a/view/molistar/modules/guildAr/images/gold2.png b/view/molistar/modules/guildAr/images/gold2.png new file mode 100644 index 00000000..eb859266 Binary files /dev/null and b/view/molistar/modules/guildAr/images/gold2.png differ diff --git a/view/molistar/modules/guildAr/images/goldIcon.png b/view/molistar/modules/guildAr/images/goldIcon.png new file mode 100644 index 00000000..da09003d Binary files /dev/null and b/view/molistar/modules/guildAr/images/goldIcon.png differ diff --git a/view/molistar/modules/guildAr/images/header.png b/view/molistar/modules/guildAr/images/header.png index 5c27a7ef..42f5d09f 100644 Binary files a/view/molistar/modules/guildAr/images/header.png and b/view/molistar/modules/guildAr/images/header.png differ diff --git a/view/molistar/modules/guildAr/images/icon1.png b/view/molistar/modules/guildAr/images/icon1.png index d147cadf..59de8e7c 100644 Binary files a/view/molistar/modules/guildAr/images/icon1.png and b/view/molistar/modules/guildAr/images/icon1.png differ diff --git a/view/molistar/modules/guildAr/images/icon2.png b/view/molistar/modules/guildAr/images/icon2.png index e55a68a2..21f9cf24 100644 Binary files a/view/molistar/modules/guildAr/images/icon2.png and b/view/molistar/modules/guildAr/images/icon2.png differ diff --git a/view/molistar/modules/guildAr/images/icon3.png b/view/molistar/modules/guildAr/images/icon3.png new file mode 100644 index 00000000..52c9b23e Binary files /dev/null and b/view/molistar/modules/guildAr/images/icon3.png differ diff --git a/view/molistar/modules/guildAr/images/icon4.png b/view/molistar/modules/guildAr/images/icon4.png new file mode 100644 index 00000000..ded56447 Binary files /dev/null and b/view/molistar/modules/guildAr/images/icon4.png differ diff --git a/view/molistar/modules/guildAr/images/inveMemberIcon.png b/view/molistar/modules/guildAr/images/inveMemberIcon.png new file mode 100644 index 00000000..5469936d Binary files /dev/null and b/view/molistar/modules/guildAr/images/inveMemberIcon.png differ diff --git a/view/molistar/modules/guildAr/index.html b/view/molistar/modules/guildAr/index.html index cc71abf1..d722dbc5 100644 --- a/view/molistar/modules/guildAr/index.html +++ b/view/molistar/modules/guildAr/index.html @@ -23,19 +23,43 @@
- -
- -
- -
- -
- -
-
+ + + + + + + + + + + + + +
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
@@ -71,6 +95,11 @@
+ +
+ + 邀请成员 +
diff --git a/view/molistar/modules/guildAr/js/guildInfoSet.js b/view/molistar/modules/guildAr/js/guildInfoSet.js index 3ca69d69..3b0980b3 100644 --- a/view/molistar/modules/guildAr/js/guildInfoSet.js +++ b/view/molistar/modules/guildAr/js/guildInfoSet.js @@ -4,11 +4,14 @@ let env = EnvCheck(); if (env == 'test') { new VConsole(); } -var urlDate = getQueryString().guildNick; +var urlDate = getQueryString(); // 封裝layer消息提醒框 let layerIndex var langReplace; var localLang; +var newBg; +var textConte1; +var textConte2; const showLoading = (content = langReplace(localLang.demoModule.layerIndex1)) => { layer.open({ type: 2, @@ -44,14 +47,33 @@ $(function () { }; // 頂部返回事件 $('.back img').click(() => { - window.location.href = document.referrer; + window.location.href = './index.html'; }) // pubInfo['Accept-Language'] = 'ar' fuzzyMatchUpdateQueryStringParameterFun(); // 判断语言 langReplace = window.lang.replace; localLang = window.lang; 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) }) function translateFun() { @@ -64,8 +86,13 @@ function translateFun() { $('.text5').text(langReplace(localLang.guildInfoSet.text5)); $('.text6').text(langReplace(localLang.guildInfoSet.text6)); $('.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() { const backImage = document.getElementById('backImageUpload').files[0]; showLoading() @@ -85,9 +112,9 @@ function getUploadToken() { observable.subscribe({ complete: (res) => { console.log(res); - $('.bg img').attr('src', res.path); - hideLoading(layerIndex) - toastMsg(langReplace(localLang.guildInfoSet.text8)) + $('.background img').attr('src', res.path); + setInfo(null, res.path, function () { }); + // toastMsg(langReplace(localLang.guildInfoSet.text8)) }, }); } else { @@ -110,7 +137,7 @@ function fileChangeF(e) { } // 保存接口 -function setInfo(name, backgroundUrl) { +function setInfo(name, backgroundUrl, fun) { showLoading() networkRequest({ type: 'post', @@ -118,7 +145,8 @@ function setInfo(name, backgroundUrl) { data: { name, backgroundUrl }, success(res) { if (res.code === 200) { - window.location.href = "./index.html" + fun(); + // window.location.href = "./index.html" } else { toastMsg(res.message) } @@ -135,4 +163,67 @@ $('.boxBut .ok').click(function () { var name = $('.nick input').val(); var bgUrl = $('.bg img').attr('src'); 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) }) \ No newline at end of file diff --git a/view/molistar/modules/guildAr/js/index.js b/view/molistar/modules/guildAr/js/index.js index 4cc81557..caa9aaa3 100644 --- a/view/molistar/modules/guildAr/js/index.js +++ b/view/molistar/modules/guildAr/js/index.js @@ -31,6 +31,11 @@ const toastMsg = (content = langReplace(localLang.demoModule.layerIndex2), time var roleTypes; var searTime; var guildNick; +var backgroundUrl; +var payoneer; +var usdt; +var payPal; +var familyMemberId; // 初始化函數 $(function () { getInfoFromClient(); @@ -73,30 +78,37 @@ function translateFun() { $('.text9').text(langReplace(localLang.demoModule.text9)); $('.text10').text(langReplace(localLang.demoModule.text10)); $('.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) { // 公会长 if (type == 1) { - $('.header .adminSet').show() - $('.header .guildInfoSet').show() - $('.header .memberFlow').show() - $('.header .inveMember').show() $('.guildList .top img').show() $('.guildList .top input').show() + $('.header .headerBox .myWages').hide() } // 管理员 else if (type == 2) { - $('.header .memberFlow').show() - $('.header .inveMember').show() - $('.guildList .top img').show() + $('.header .headerBox .guildInfoSet').hide(); + $('.header .headerBox .adminSet').hide(); $('.guildList .top input').show() + $('.memberFlow2').hide() } // 普通成员 else if (type == 3) { + $('.header .headerBox .guildInfoSet').hide(); + $('.header .headerBox .adminSet').hide(); + $('.header .headerBox .memberFlow').hide(); $('.header .memberFlowMy').show() $('.header .guildNick').show() $('.guildList .top input').show() + $('.memberFlow2').hide(); + } // 非公会成员 else { @@ -113,11 +125,22 @@ function get() { // 判断身份 roleTypes = res.data.roleType; guildFun(roleTypes); + if (res.data.wageEnable == false) { + // $('.memberFlow2').hide(); + } $('.text2').text(res.data.name) // 渲染基本信息 $('.header .tx').attr('src', res.data.me.avatar); $('.header .nick').text(res.data.me.nick); 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').css({ "background": `url(${res.data.backgroundUrl}) no-repeat`, "background-size": "100% 100%" }); $('.header .guildNick').text(langReplace(localLang.demoModule.text11) + res.data.name); @@ -263,17 +286,21 @@ $('.header .adminSet').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) { window.location.href = `./memberFlow.html` }) -// 查看个人流水 -$('.header .memberFlowMy').click(function (params) { +// 工资收入统计 +$('.header .memberFlow2').click(function (params) { window.location.href = `./memberFlow2.html` }) -// 查看成员流水 -$('.header .inveMember').click(function (params) { +// 邀请成员 +$('.inveMember').click(function (params) { window.location.href = `./invitation.html` +}) +// 我的工资 +$(`.myWages`).click(function (params) { + window.location.href = `./memberFlow222.html?familyMemberId=${familyMemberId}` }) \ No newline at end of file diff --git a/view/molistar/modules/guildAr/js/lay-picker.min.js b/view/molistar/modules/guildAr/js/lay-picker.min.js new file mode 100644 index 00000000..22b96cc2 --- /dev/null +++ b/view/molistar/modules/guildAr/js/lay-picker.min.js @@ -0,0 +1,1086 @@ +/** + * + * 移动端底部抽屉选择器 + * + * @author yyq + * @CSDN 慕云枫 + * @date 2024-01-12 + * @version 1.7 + */ +var layPicker = { + index: 0, // 递增的index,作为元素的唯一标识 + indexList: [], // 每个index的集合 + offset: {}, // 每个ul元素的滚动位置 + liHeight: 50, // 每个li的高度 + selectList: {}, // 存储每个被选中的值,li下标 + textField: 'name', // 参数名称-内容 + valueField: 'value',// 参数名称-值 + fieldList: {}, // 参数名称集 + dataList: {}, // 数据集合 + tempSearchList: {}, // 临时存储搜索前的主数据 + minMaxData: {}, // 最小最大限制数据 + init: function (data) { + layPicker.index++; + layPicker.indexList.push(layPicker.index); + var key = '' + layPicker.index; + // 参数名称替换 + layPicker.fieldList[key] = { + textField: data.textField || layPicker.textField, + valueField: data.valueField || layPicker.valueField, + }; + // 滚动位置初始化 + layPicker.offset[key] = { + start: {}, + move: {}, + end: { state: false }, + }; + // 日期选择器-获取对应值 + if (data.options) { + var minObj = lay_picker_date.getMinOrMaxDate(data.minDate); + var maxObj = lay_picker_date.getMinOrMaxDate(data.maxDate); + layPicker.minMaxData[key] = {}; + layPicker.minMaxData[key]['minObj'] = minObj; + layPicker.minMaxData[key]['maxObj'] = maxObj; + layPicker.minMaxData[key]['options'] = data.options; + data.data = lay_picker_date.getData(data.options, key); + } + // 选中值初始化 + layPicker.selectList[key] = {}; + // 数据集 + layPicker.dataList[key] = data.data; + // 渲染标签 + var html = layPicker.initBody(data, key); + $('body').append(html); + // 给绑定元素添加标识 + $(data.elem).attr('readonly', true); + $(data.elem).attr('lay-picker-id', key); + + // 不等于自定义html才需要执行这些操作 + if (!data.type || data.type != 3) { + // 初始化标签和值 + layPicker.initBox(data.data, key); + layPicker.initSelect(key); + // 日期选择器-赋值 + if (data.options) { + layPicker.setValue(key, lay_picker_date.getVoluation(data.options, layPicker.fieldList[key].valueField), data.options); + } + // 搜索监听 + if (data.search) { + layPicker.tempSearchList[key] = data.data[0]; + var temp_keyup; + $('#lay-picker-input-' + key).on('keyup', function () { + var value = $(this).val(); + clearTimeout(temp_keyup); + temp_keyup = setTimeout(function () { + var tempArray = []; + if (value) { + var arr = layPicker.tempSearchList[key]; + for (var i = 0; i < arr.length; i++) { + var obj = arr[i]; + var text = layPicker.fieldList[key].textField; + if (obj[text].indexOf(value) != -1) { + tempArray.push(obj); + } + } + } else { + tempArray = layPicker.tempSearchList[key]; + } + layPicker.setData(key, -1, tempArray); + }, 500) + }); + } + // 滑动-开始(手指放在页面时触发) + $('.lay-picker-' + key).on('touchstart', '.lay-picker-list-wrap', function (e) { + var touch = e.originalEvent.targetTouches[0]; + if (layPicker.tempInter) { + clearInterval(layPicker.tempInter); + layPicker.tempInter = null; + layPicker.offset[key].move.y = touch.clientY; + } + layPicker.offset[key].move.len = 0; + layPicker.offset[key].end.state = true; + layPicker.offset[key].start.y = touch.clientY; + var ul = $(this).find('ul')[0]; + layPicker.offset[key].start.top = parseInt(ul.style.transform.split(",")[1].replace('px', '')) || 0; + e.stopPropagation(); // 防止屏幕滑动 + }); + // 滑动-中(手指移动时触发) + $('.lay-picker-' + key).on('touchmove', '.lay-picker-list-wrap', function (e) { + var touch = e.originalEvent.targetTouches[0]; + layPicker.offset[key].move.y = touch.clientY; + var y = layPicker.offset[key].move.y - layPicker.offset[key].start.y + layPicker.offset[key].start.top; + $(this).find('ul').css('transform', 'translate3d(0px, ' + y + 'px, 0px)'); + layPicker.offset[key].end.y = y; + e.stopPropagation(); + e.preventDefault();// 防止屏幕滑动 + }); + // 滑动-结束(手指离开页面时触发) + $('.lay-picker-' + key).on('touchend', '.lay-picker-list-wrap', function (e) { + layPicker.offset[key].move.state = true; + var tempLen = 1; + if (layPicker.offset[key].start.y > layPicker.offset[key].move.y) { + layPicker.offset[key].move.num = true; + tempLen = layPicker.offset[key].start.y - layPicker.offset[key].move.y; + } else { + layPicker.offset[key].move.num = false; + tempLen = layPicker.offset[key].move.y - layPicker.offset[key].start.y; + } + tempLen = tempLen / layPicker.liHeight; + var _this = this; + var ul = $(_this).find('ul')[0], ul2 = $(_this).find('ul'); + var tempNum = 1; + layPicker.tempInter = setInterval(function () { + tempNum++; + var tempTop = layPicker.offset[key].start.top; + layPicker.offset[key].start.top = parseInt(ul.style.transform.split(",")[1].replace('px', '')) || 0; + if (tempLen <= 3 + || tempTop >= 0 + || layPicker.offset[key].start.top >= 0 + || ((ul.children.length - 1) * layPicker.liHeight) <= Math.abs(tempTop) + || ((ul.children.length - 1) * layPicker.liHeight) <= Math.abs(layPicker.offset[key].start.top)) { + tempNum = tempLen; + } else { + layPicker.offset[key].start.y = layPicker.offset[key].move.y; + if (layPicker.offset[key].move.num) { + layPicker.offset[key].move.y = layPicker.offset[key].move.y - ((tempLen - tempNum) * layPicker.liHeight); + } else { + if (layPicker.offset[key].move.y < 0) { + layPicker.offset[key].move.y = layPicker.offset[key].move.y - ((tempLen - tempNum) * layPicker.liHeight); + } else { + layPicker.offset[key].move.y = layPicker.offset[key].move.y + ((tempLen - tempNum) * layPicker.liHeight); + } + } + var y = layPicker.offset[key].move.y - layPicker.offset[key].start.y + layPicker.offset[key].start.top; + ul2.css('transform', 'translate3d(0px, ' + y + 'px, 0px)'); + layPicker.offset[key].end.y = y; + } + // 在这前面的都是实现延迟继续滚动效果,这下面的则是原来的效果 + if (tempNum >= tempLen) { + clearInterval(layPicker.tempInter); + layPicker.offset[key].end.state = false; + var itemHeight = layPicker.liHeight; + var sign = layPicker.offset[key].end.y >= 0 ? 1 : -1; + var thisIndex = $(_this).attr("index"); + // 计算超出回弹 + var fieldIndex = Math.round(Math.abs(layPicker.offset[key].end.y) / itemHeight); + var len = sign * (fieldIndex * itemHeight); + if (len > 0) { + len = 0; + fieldIndex = 0; + } else if (len < -(ul.children.length - 1) * itemHeight) { + len = -(ul.children.length - 1) * itemHeight; + fieldIndex = ul.children.length - 1; + }; + ul2.css('transform', 'translate3d(0px, ' + len + 'px, 0px)'); + layPicker.selectList[key][thisIndex] = fieldIndex; + // 获取选中值 + var list = layPicker.dataList[key]; + var resultArray = []; + for (var k in layPicker.selectList[key]) { + var arr = list[Number(k)] + if (arr && arr.length > 0) { + var obj = arr[layPicker.selectList[key][k]] + resultArray.push(obj); + } + } + // 回调 + if (data.onSelect) { + data.onSelect(key, thisIndex, resultArray); + } + // 日期选择器-赋值day + if (data.options) { + var valList = layPicker.setOptions(data.options, key, resultArray, thisIndex); + layPicker.setValue(key, valList); // 赋值,以位置类推 + } + } + }, 100) + e.stopPropagation();// 防止屏幕滑动 + }); + // 取消-点击 + $('.lay-picker-' + key).on("click", ".lay-picker-cancel-click", function (e) { + layPicker.hiden($(this).parents('.lay-picker').attr('lay-index')); + if (data.onCancel) { + data.onCancel(key); + } + }); + // 确认-点击 + $('.lay-picker-' + key).on("click", ".lay-picker-confirm-click", function (e) { + layPicker.hiden($(this).parents('.lay-picker').attr('lay-index')); + var list = layPicker.dataList[key]; + var v = '', resultArray = []; + for (var k in layPicker.selectList[key]) { + var arr = list[Number(k)] + if (arr && arr.length > 0) { + var obj = arr[layPicker.selectList[key][k]] + if (data.options && (data.options == 'time' || data.options == 'timesecond' || data.options == 'datetime' || data.options == 'datetimesecond')) { + if (data.options == 'time' || data.options == 'timesecond') { + v += obj[layPicker.fieldList[key].valueField] + ":"; + } else if ((data.options == 'datetime' || data.options == 'datetimesecond') && Number(k) == 2) { + v += obj[layPicker.fieldList[key].valueField] + " "; + } else if ((data.options == 'datetime' || data.options == 'datetimesecond') && Number(k) > 2) { + v += obj[layPicker.fieldList[key].valueField] + ":"; + } else { + v += obj[layPicker.fieldList[key].valueField] + "-"; + } + } else { + v += obj[layPicker.fieldList[key].valueField] + "-"; + } + resultArray.push(obj); + } + } + if (data.onConfirm) { + data.onConfirm(key, v.substring(0, v.length - 1), resultArray); + } + }); + } + // 绑定元素-点击 + $(data.elem).on('click', function (e) { + layPicker.show($(this).attr('lay-picker-id')); + if (data.onShow) { + data.onShow(key); + } + }) + // 遮罩-点击 + $('.lay-picker-' + key).on("click", ".lay-picker-shade", function (e) { + layPicker.hiden($(this).parents('.lay-picker').attr('lay-index')); + if (data.onShade) { + data.onShade(key); + } + }); + // 成功回调 + if (data.onSuccess) { + data.onSuccess(key, '.lay-picker-' + key); + } + return key; + }, + /** 重置值*/ + setOptions: function (options, key, resultArray, thisIndex) { + var valList = []; + if (options == 'month' || options == 'date' || options == 'datetime' || options == 'datetimesecond') { + if (thisIndex == 0) { + layPicker.setData(key, Number(thisIndex), lay_picker_date.getMonth(resultArray, key)); + if (options != 'month') { + layPicker.setData(key, Number(thisIndex) + 1, lay_picker_date.getDay(resultArray, key)); + } + } else if (thisIndex == 1 && options != 'month') { + layPicker.setData(key, Number(thisIndex), lay_picker_date.getDay(resultArray, key)); + } + if (options != 'month') { + var tempDay = resultArray[2][layPicker.fieldList[key].valueField]; + var lastDay = lay_picker_date.getLastDay(resultArray); + if (Number(tempDay) > lastDay) { + tempDay = lastDay; + } + valList = [ + { value: resultArray[0][layPicker.fieldList[key].valueField] }, + { value: resultArray[1][layPicker.fieldList[key].valueField] }, + { value: tempDay }, + ]; + if (options == 'datetime' || options == 'datetimesecond') { + if (thisIndex == 0) { + layPicker.setData(key, Number(thisIndex) + 2, lay_picker_date.getHours(resultArray, key)); + layPicker.setData(key, Number(thisIndex) + 3, lay_picker_date.getMinutes(resultArray, key)); + } else if (thisIndex == 1) { + layPicker.setData(key, Number(thisIndex) + 1, lay_picker_date.getHours(resultArray, key)); + layPicker.setData(key, Number(thisIndex) + 2, lay_picker_date.getMinutes(resultArray, key)); + } else if (thisIndex == 2) { + layPicker.setData(key, Number(thisIndex), lay_picker_date.getHours(resultArray, key)); + layPicker.setData(key, Number(thisIndex) + 1, lay_picker_date.getMinutes(resultArray, key)); + } else if (thisIndex == 3) { + layPicker.setData(key, thisIndex, lay_picker_date.getMinutes(resultArray, key)); + } + valList.push({ value: resultArray[3][layPicker.fieldList[key].valueField] }) + valList.push({ value: resultArray[4][layPicker.fieldList[key].valueField] }) + if (options == 'datetimesecond') { + if (thisIndex == 0) { + layPicker.setData(key, Number(thisIndex) + 4, lay_picker_date.getSeconds(resultArray, key)); + } else if (thisIndex == 1) { + layPicker.setData(key, Number(thisIndex) + 3, lay_picker_date.getSeconds(resultArray, key)); + } else if (thisIndex == 2) { + layPicker.setData(key, Number(thisIndex) + 2, lay_picker_date.getSeconds(resultArray, key)); + } else if (thisIndex == 3) { + layPicker.setData(key, Number(thisIndex) + 1, lay_picker_date.getSeconds(resultArray, key)); + } else if (thisIndex == 4) { + layPicker.setData(key, Number(thisIndex), lay_picker_date.getSeconds(resultArray, key)); + } + valList.push({ value: resultArray[5][layPicker.fieldList[key].valueField] }) + } + } + } + } + if (options == 'time' || options == 'timesecond') { + if (thisIndex == 0) { + layPicker.setData(key, thisIndex, lay_picker_date.getMinutes(resultArray, key, 1)); + } + valList = [ + { value: resultArray[0][layPicker.fieldList[key].valueField] }, + { value: resultArray[1][layPicker.fieldList[key].valueField] }, + ]; + if (options == 'timesecond') { + if (thisIndex == 0) { + layPicker.setData(key, Number(thisIndex) + 1, lay_picker_date.getSeconds(resultArray, key, 1)); + } else if (thisIndex == 1) { + layPicker.setData(key, Number(thisIndex), lay_picker_date.getSeconds(resultArray, key, 1)); + } + valList.push({ value: resultArray[2][layPicker.fieldList[key].valueField] }); + } + } + return valList; + }, + initBody: function (data, index) { + var s = ''; + s += ''; + } else if (data.type == 2) { + var sumHeight = 350; // 高度超出出现滚动条 + sumHeight = (data.title) ? sumHeight += 80 : sumHeight; + sumHeight = (data.search) ? sumHeight += 80 : sumHeight; + var h = $(window).height(); + var radius = (data.radius ? 'border-radius: ' + data.radius + 'px ' + data.radius + 'px 0px 0;' : ''); + s += '
'; + if (data.title) { + s += '
'; + s += '
' + (data.title || '') + '
'; + s += '
'; + } + if (data.search) { + s += ' '; + } + s += '
'; + s += '
'; + s += '
'; + s += '
'; + s += '
'; + s += '
'; + s += ' ' + cancel + ''; + s += ' ' + confirm + ''; + s += '
'; + s += '
'; + s += ''; + } else { + var sumHeight = 350; // 高度超出出现滚动条 + sumHeight = (data.search) ? sumHeight += 80 : sumHeight; + var h = $(window).height(); + var radius = (data.radius ? 'border-radius: ' + data.radius + 'px ' + data.radius + 'px 0px 0;' : ''); + s += '
'; + s += '
'; + s += '
' + (data.title || '') + '
'; + s += '
'; + s += ' ' + cancel + ''; + s += ' ' + confirm + ''; + s += '
'; + s += '
'; + if (data.search) { + s += ' '; + } + s += '
'; + s += '
'; + s += '
'; + s += '
'; + s += '
'; + s += '
'; + s += ''; + } + return s; + }, + initBox: function (data, index) { + var len = 100 / data.length; + var box = $('.lay-picker-' + index).find('.lay-picker-box'); + for (var i = 0; i < data.length; i++) { + var div = $('
'); + var ul = $(''); + for (var j = 0; j < data[i].length; j++) { + var li = $('
  • ' + data[i][j][layPicker.fieldList[index].textField] + '
  • '); + ul.append(li); + } + div.append(ul); + box.append(div); + } + }, + initSelect: function (index) { + var list = layPicker.dataList[index]; + for (var i = 0; i < list.length; i++) { + layPicker.selectList[index][i + ''] = 0; + } + }, + setData: function (index, i, data, trends) { + var t_index = (Number(i) + 1); + var ul = $('.lay-picker-' + index).find('.lay-picker-box').find('[index=' + t_index + ']>ul'); + ul.empty(); + ul.css('transform', 'translate3d(0px, 0px, 0px)'); + for (var i = 0; i < data.length; i++) { + var li = $('
  • ' + data[i][layPicker.fieldList[index].textField] + '
  • '); + ul.append(li); + } + layPicker.selectList[index][t_index + ''] = 0; + layPicker.dataList[index][t_index] = data; + + }, + setDataTrends: function (index, i, data) { + var t_index = (Number(i) + 1); + if (!data || data.length == 0) { + layPicker.deleteData(index, i, t_index); + var len = 100 / layPicker.dataList[index].length; + $('.lay-picker-' + index).find('.lay-picker-list-wrap').css('width', len + '%'); + return; + } + var data_len = t_index > layPicker.dataList[index].length - 1; + if (data_len) { + layPicker.dataList[index].push(data); + } else { + layPicker.dataList[index][t_index] = data; + layPicker.deleteData(index, t_index, t_index + 1); + } + var box = $('.lay-picker-' + index).find('.lay-picker-box'); + var len = 100 / layPicker.dataList[index].length; + $('.lay-picker-' + index).find('.lay-picker-list-wrap').css('width', len + '%'); + if (data_len) { + var div = $('
    '); + box.append(div); + } + var ul = $('.lay-picker-' + index).find('.lay-picker-box').find('[index=' + t_index + ']>ul'); + ul.empty(); + ul.css('transform', 'translate3d(0px, 0px, 0px)'); + for (var i = 0; i < data.length; i++) { + var li = $('
  • ' + data[i][layPicker.fieldList[index].textField] + '
  • '); + ul.append(li); + } + layPicker.selectList[index][t_index + ''] = 0; + }, + deleteData: function (index, i, t_index) { + if (layPicker.dataList[index].length > Number(i)) { + for (var i = t_index; i < layPicker.dataList[index].length; i++) { + layPicker.dataList[index].splice(i, 1); + $('.lay-picker-' + index).find('.lay-picker-box').find('[index=' + i + ']').remove(); + return layPicker.deleteData(index, i, t_index); + } + } + }, + setValue: function (index, data, options) { + var list = layPicker.dataList[index]; + var box = $('.lay-picker-' + index).find('.lay-picker-box'); + for (var i = 0; i < data.length; i++) { + data[i].value = Number(data[i].value) < 10 ? '0' + Number(data[i].value) : data[i].value; + } + if (!options && layPicker.minMaxData[index]) { + options = layPicker.minMaxData[index]['options']; + } + for (var i = 0; i < data.length; i++) { + var arr = list[i]; + for (var j = 0; j < arr.length; j++) { + if (arr[j][layPicker.fieldList[index].valueField] == data[i][layPicker.fieldList[index].valueField]) { + layPicker.selectList[index][i + ''] = j; + if (options) { + layPicker.setOptionsValue(options, index, data, i); + } + var y = j * layPicker.liHeight; + box.find('[index=' + i + ']>ul').css('transform', 'translate3d(0px, -' + y + 'px, 0px)'); + } + } + } + }, + setOptionsValue: function (options, key, resultArray, thisIndex) { + if (options == 'month' || options == 'date' || options == 'datetime' || options == 'datetimesecond') { + if (thisIndex == 0) { + layPicker.setData(key, Number(thisIndex), lay_picker_date.getMonth(resultArray, key)); + } else if (thisIndex == 1 && options != 'month') { + layPicker.setData(key, Number(thisIndex), lay_picker_date.getDay(resultArray, key)); + } + if (options == 'datetime' || options == 'datetimesecond') { + if (thisIndex == 2) { + layPicker.setData(key, Number(thisIndex), lay_picker_date.getHours(resultArray, key)); + } else if (thisIndex == 3) { + layPicker.setData(key, thisIndex, lay_picker_date.getMinutes(resultArray, key)); + } + if (options == 'datetimesecond') { + if (thisIndex == 4) { + layPicker.setData(key, Number(thisIndex), lay_picker_date.getSeconds(resultArray, key)); + } + } + } + } + if (options == 'time' || options == 'timesecond') { + if (thisIndex == 0) { + layPicker.setData(key, thisIndex, lay_picker_date.getMinutes(resultArray, key, 1)); + } + if (options == 'timesecond') { + if (thisIndex == 1) { + layPicker.setData(key, Number(thisIndex), lay_picker_date.getSeconds(resultArray, key, 1)); + } + } + } + }, + hiden: function (index) { + $('.lay-picker-' + index).find('.lay-picker-container').css('transform', 'translate3d(0px, 100%, 0px)'); + $('.lay-picker-' + index).find('.lay-picker-shade').fadeOut(200); + setTimeout(function () { + $('.lay-picker-' + index).css('display', 'none'); + }, 100) + }, + show: function (index) { + $('.lay-picker-' + index).css('display', 'block'); + $('.lay-picker-' + index).find('.lay-picker-shade').fadeIn(200); + setTimeout(function () { + $('.lay-picker-' + index).find('.lay-picker-container').css('transform', 'translate3d(0px, 0px, 0px)'); + }, 10) + $(".lay-picker-not-mobile").remove(); + if (!layPicker.isMobile()) { + $(".lay-picker-container").append("
    非手机模式无法滑动
    ") + } + }, + remove: function (index) { + layPicker.hiden(index); + setTimeout(function () { + $('.lay-picker-' + index).remove(); + }, 200) + for (var i = 0; i < layPicker.indexList.length; i++) { + if (layPicker.indexList[i] == index) { + layPicker.indexList.splice(i, 1); + break; + } + } + }, + removeAll: function () { + if (layPicker.indexList.length > 0) { + for (var i = 0; i < layPicker.indexList.length; i++) { + layPicker.hiden(layPicker.indexList[i]); + var index = layPicker.indexList[i]; + layPicker.removeTime(index); + layPicker.indexList.splice(i, 1); + return layPicker.removeAll(); + } + } + }, + removeTime: function (index) { + setTimeout(function () { + $('.lay-picker-' + index).remove(); + }, 200) + }, + /** 判断是否是手机打开*/ + isMobile: function () { + return /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|DingTalk|Opera Mini/i.test(navigator.userAgent); + }, +} + +/** + * 日期对象 + */ +var lay_picker_date = { + getVoluation: function (value, key) { + var date_obj = lay_picker_date.getDateTime(); + var year_obj = {}; + year_obj['' + key] = date_obj.year; + var month_obj = {}; + month_obj['' + key] = date_obj.month; + var day_obj = {}; + day_obj['' + key] = date_obj.day; + var hours_obj = {}; + hours_obj['' + key] = date_obj.hours; + var minutes_obj = {}; + minutes_obj['' + key] = date_obj.minutes; + var seconds_obj = {}; + seconds_obj['' + key] = date_obj.seconds; + if (value == 'year') { + return [year_obj]; + } else if (value == 'month') { + return [year_obj, month_obj]; + } else if (value == 'date') { + return [year_obj, month_obj, day_obj]; + } else if (value == 'time') { + return [hours_obj, minutes_obj]; + } else if (value == 'timesecond') { + return [hours_obj, minutes_obj, seconds_obj]; + } else if (value == 'datetime') { + return [year_obj, month_obj, day_obj, hours_obj, minutes_obj]; + } else if (value == 'datetimesecond') { + return [year_obj, month_obj, day_obj, hours_obj, minutes_obj, seconds_obj]; + } + }, + getData: function (value, key) { + if (value == 'year') { + var years = lay_picker_date.getYear(key); + return [years]; + } else if (value == 'month') { + var years = lay_picker_date.getYear(key); + var date_obj = lay_picker_date.getDateTime(); + var months = lay_picker_date.getMonth( + [ + { value: years[0].value }, + { value: date_obj.month }, + ] + , key); + return [years, months]; + } else if (value == 'date') { + var years = lay_picker_date.getYear(key); + var date_obj = lay_picker_date.getDateTime(); + var months = lay_picker_date.getMonth( + [ + { value: years[0].value }, + { value: date_obj.month }, + ] + , key); + var days = lay_picker_date.getDay( + [ + { value: years[0].value }, + { value: months[0].value }, + { value: date_obj.day }, + ] + , key); + return [years, months, days]; + } else if (value == 'time') { + var hourss = lay_picker_date.getHours(null, key, 1); + var date_obj = lay_picker_date.getDateTime(); + var minutess = lay_picker_date.getMinutes( + [ + { value: hourss[0].value }, + { value: date_obj.minutes }, + ] + , key, 1); + return [hourss, minutess]; + } else if (value == 'timesecond') { + var hourss = lay_picker_date.getHours(null, key, 1); + var date_obj = lay_picker_date.getDateTime(); + var minutess = lay_picker_date.getMinutes( + [ + { value: hourss[0].value }, + { value: date_obj.minutes }, + ] + , key, 1); + var secondss = lay_picker_date.getSeconds( + [ + { value: hourss[0].value }, + { value: minutess[0].value }, + { value: date_obj.seconds }, + ] + , key, 1); + return [hourss, minutess, secondss]; + } else if (value == 'datetime') { + var years = lay_picker_date.getYear(key); + var date_obj = lay_picker_date.getDateTime(); + var months = lay_picker_date.getMonth( + [ + { value: years[0].value }, + { value: date_obj.month }, + ] + , key); + var days = lay_picker_date.getDay( + [ + { value: years[0].value }, + { value: months[0].value }, + { value: date_obj.day }, + ] + , key); + var hourss = lay_picker_date.getHours( + [ + { value: years[0].value }, + { value: months[0].value }, + { value: days[0].value }, + ], key); + var minutess = lay_picker_date.getMinutes( + [ + { value: years[0].value }, + { value: months[0].value }, + { value: days[0].value }, + { value: hourss[0].value }, + ], key); + return [years, months, days, hourss, minutess]; + } else if (value == 'datetimesecond') { + var years = lay_picker_date.getYear(key); + var date_obj = lay_picker_date.getDateTime(); + var months = lay_picker_date.getMonth( + [ + { value: years[0].value }, + { value: date_obj.month }, + ] + , key); + var days = lay_picker_date.getDay( + [ + { value: years[0].value }, + { value: months[0].value }, + { value: date_obj.day }, + ] + , key); + var hourss = lay_picker_date.getHours( + [ + { value: years[0].value }, + { value: months[0].value }, + { value: days[0].value }, + ], key); + var minutess = lay_picker_date.getMinutes( + [ + { value: years[0].value }, + { value: months[0].value }, + { value: days[0].value }, + { value: hourss[0].value }, + ], key); + var secondss = lay_picker_date.getSeconds( + [ + { value: years[0].value }, + { value: months[0].value }, + { value: days[0].value }, + { value: hourss[0].value }, + { value: minutess[0].value }, + ], key); + return [years, months, days, hourss, minutess, secondss]; + } + }, + getDateTime: function () { + var myDate = new Date(); + var year = myDate.getFullYear(); //获取年 + var month = myDate.getMonth() + 1; //获取月,默认从0开始,所以要加一 + month = ('00' + month).slice(-2); + var day = ('00' + myDate.getDate()).slice(-2); //获取日 + var hours = ('00' + myDate.getHours()).slice(-2); //获取小时 + var minutes = ('00' + myDate.getMinutes()).slice(-2); //获取分 + var seconds = ('00' + myDate.getSeconds()).slice(-2); //获取秒 + return { + year: year, + month: month, + day: day, + hours: hours, + minutes: minutes, + seconds: seconds, + } + }, + getYear: function (key) { + var arr = [], + now = new Date(); + var minYear = 1900; + var maxYear = now.getFullYear() + 60; + if (key) { + var minObj = layPicker.minMaxData[key].minObj; + if (minObj && minObj.ymd) { + minYear = Number(minObj.ymd[0]); + } + var maxObj = layPicker.minMaxData[key].maxObj; + if (maxObj && maxObj.ymd) { + maxYear = Number(maxObj.ymd[0]); + } + } + for (var i = minYear; i <= maxYear; i++) { + var lang = getQueryString().lang; + arr.push({ + // name: i + `${lang == 'zh' ? '年' : lang == 'en' ? 'Year' : 'سنة'}`, + name: i, + value: i + }); + } + return arr; + }, + getMonth: function (result, key) { + var year = result[0].value; + var arr = []; + var minMonth = 1; + var maxMonth = 12; + if (key) { + var minObj = layPicker.minMaxData[key].minObj; + if (minObj && minObj.ymd) { + if (year == minObj.ymd[0]) { + minMonth = Number(minObj.ymd[1]); + } else { + var d1 = Number(year + '' + result[1].value); + var d2 = Number(minObj.ymd[0] + '' + minObj.ymd[1]); + if (d1 <= d2) { + minMonth = Number(minObj.ymd[1]); + } + } + } + var maxObj = layPicker.minMaxData[key].maxObj; + if (maxObj && maxObj.ymd) { + if (year == maxObj.ymd[0]) { + maxMonth = Number(maxObj.ymd[1]); + } else { + var d1 = Number(year + '' + result[1].value); + var d2 = Number(maxObj.ymd[0] + '' + maxObj.ymd[1]); + if (d1 >= d2) { + maxMonth = Number(maxObj.ymd[1]); + } + } + } + } + for (var i = minMonth; i <= maxMonth; i++) { + var code = ('00' + i).slice(-2); + var lang = getQueryString().lang; + arr.push({ + // name: i + `${lang == 'zh' ? '月' : lang == 'en' ? 'Month' : 'شهر'}`, + name: i, + value: code + }); + } + return arr; + }, + getDay: function (result, key) { + var year = result[0].value, + month = result[1].value; + var thisDate = new Date(Number(year), Number(month), 0); + var maxDay = thisDate.getDate(); + var minDay = 1; + if (key) { + var minObj = layPicker.minMaxData[key].minObj; + if (minObj && minObj.ymd) { + if (year == minObj.ymd[0] && month == minObj.ymd[1]) { + minDay = Number(minObj.ymd[2]); + } else { + var d1 = Number(year + '' + month + '' + result[1].value); + var d2 = Number(minObj.ymd[0] + '' + minObj.ymd[1] + '' + minObj.ymd[2]); + if (d1 <= d2) { + minDay = Number(minObj.ymd[2]); + } + } + } + var maxObj = layPicker.minMaxData[key].maxObj; + if (maxObj && maxObj.ymd) { + if (year == maxObj.ymd[0] && month == maxObj.ymd[1]) { + maxDay = Number(maxObj.ymd[2]); + } else { + var d1 = Number(year + '' + month + '' + result[1].value); + var d2 = Number(maxObj.ymd[0] + '' + maxObj.ymd[1] + '' + maxObj.ymd[2]); + if (d1 >= d2) { + maxDay = Number(maxObj.ymd[2]); + } + } + } + } + var arr = []; + for (var i = minDay; i <= maxDay; i++) { + var code = ('00' + i).slice(-2); + var lang = getQueryString().lang + arr.push({ + // name: i + `${lang == 'zh' ? '日' : lang == 'en' ? 'Day' : 'يوم'}`, + name: i, + value: code + }); + } + return arr; + }, + getHours: function (result, key, type) { + var arr = []; + var minHour = 0; + var maxHour = 23; + if (key) { + if (type) { + var minObj = layPicker.minMaxData[key].minObj; + if (minObj && minObj.hms) { + minHour = Number(minObj.hms[0]); + } + var maxObj = layPicker.minMaxData[key].maxObj; + if (maxObj && maxObj.hms) { + maxHour = Number(maxObj.hms[0]); + } + } else { + var year = result[0].value, + month = result[1].value, + day = result[2].value; + var minObj = layPicker.minMaxData[key].minObj; + if (minObj && minObj.hms) { + if (minObj && minObj.ymd) { + var d1 = Number(year + '' + month + '' + day + '' + minObj.hms[0]); + var d2 = Number(minObj.ymd[0] + '' + minObj.ymd[1] + '' + minObj.ymd[2] + '' + minObj.hms[0]); + if (d1 <= d2) { + minHour = Number(minObj.hms[0]); + } + } else { + minHour = Number(minObj.hms[0]); + } + } + var maxObj = layPicker.minMaxData[key].maxObj; + if (maxObj && maxObj.hms) { + if (maxObj && maxObj.ymd) { + var d1 = Number(year + '' + month + '' + day + '' + maxObj.hms[0]); + var d2 = Number(maxObj.ymd[0] + '' + maxObj.ymd[1] + '' + maxObj.ymd[2] + '' + maxObj.hms[0]); + if (d1 >= d2) { + maxHour = Number(maxObj.hms[0]); + } + } else { + maxHour = Number(maxObj.hms[0]); + } + } + } + } + for (var i = minHour; i <= maxHour; i++) { + var value = ('00' + i).slice(-2); + arr.push({ + name: value + '时', + value: value + }) + } + return arr; + }, + getMinutes: function (result, key, type) { + var arr = []; + var minMinute = 0; + var maxMinute = 59; + if (key) { + if (type) { + var hours = result[0].value; + var minObj = layPicker.minMaxData[key].minObj; + if (minObj && minObj.hms) { + var d1 = Number(hours + '' + minObj.hms[1]); + var d2 = Number(minObj.hms[0] + '' + minObj.hms[1]); + if (d1 <= d2) { + minMinute = Number(minObj.hms[1]); + } + } + var maxObj = layPicker.minMaxData[key].maxObj; + if (maxObj && maxObj.hms) { + var d1 = Number(hours + '' + maxObj.hms[1]); + var d2 = Number(maxObj.hms[0] + '' + maxObj.hms[1]); + if (d1 >= d2) { + maxMinute = Number(maxObj.hms[1]); + } + } + } else { + var year = result[0].value, + month = result[1].value, + day = result[2].value; + hours = result[3].value; + var minObj = layPicker.minMaxData[key].minObj; + if (minObj && minObj.hms) { + if (minObj && minObj.ymd) { + var d1 = Number(year + '' + month + '' + day + '' + hours + '' + minObj.hms[1]); + var d2 = Number(minObj.ymd[0] + '' + minObj.ymd[1] + '' + minObj.ymd[2] + '' + minObj.hms[0] + '' + minObj.hms[1]); + if (d1 <= d2) { + minMinute = Number(minObj.hms[1]); + } + } else { + minMinute = Number(minObj.hms[1]); + } + } + var maxObj = layPicker.minMaxData[key].maxObj; + if (maxObj && maxObj.hms) { + if (maxObj && maxObj.ymd) { + var d1 = Number(year + '' + month + '' + day + '' + hours + '' + maxObj.hms[1]); + var d2 = Number(maxObj.ymd[0] + '' + maxObj.ymd[1] + '' + maxObj.ymd[2] + '' + maxObj.hms[0] + '' + maxObj.hms[1]); + if (d1 >= d2) { + maxMinute = Number(maxObj.hms[1]); + } + } else { + maxMinute = Number(maxObj.hms[1]); + } + } + } + } + for (var i = minMinute; i <= maxMinute; i++) { + var value = ('00' + i).slice(-2); + arr.push({ + name: value + '分', + value: value + }) + } + return arr; + }, + getSeconds: function (result, key, type) { + var arr = []; + var minSecond = 0; + var maxSecond = 59 + if (key) { + if (type) { + var hours = result[0].value; + var minute = result[1].value; + var minObj = layPicker.minMaxData[key].minObj; + if (minObj && minObj.hms && minObj.hms.length > 2) { + var d1 = Number(hours + '' + minute + '' + minObj.hms[2]); + var d2 = Number(minObj.hms[0] + '' + minObj.hms[1] + '' + minObj.hms[2]); + if (d1 <= d2) { + minSecond = Number(minObj.hms[2]); + } + } + var maxObj = layPicker.minMaxData[key].maxObj; + if (maxObj && maxObj.hms && maxObj.hms.length > 2) { + var d1 = Number(hours + '' + minute + '' + maxObj.hms[2]); + var d2 = Number(maxObj.hms[0] + '' + maxObj.hms[1] + '' + maxObj.hms[2]); + if (d1 >= d2) { + maxSecond = Number(maxObj.hms[2]); + } + } + } else { + var year = result[0].value, + month = result[1].value, + day = result[2].value; + hours = result[3].value; + minute = result[4].value; + var minObj = layPicker.minMaxData[key].minObj; + if (minObj && minObj.hms) { + if (minObj && minObj.ymd) { + var d1 = Number(year + '' + month + '' + day + '' + hours + '' + minute + '' + minObj.hms[2]); + var d2 = Number(minObj.ymd[0] + '' + minObj.ymd[1] + '' + minObj.ymd[2] + '' + minObj.hms[0] + '' + minObj.hms[1] + '' + minObj.hms[2]); + if (d1 <= d2) { + minSecond = Number(minObj.hms[2]); + } + } else { + minSecond = Number(minObj.hms[2]); + } + } + var maxObj = layPicker.minMaxData[key].maxObj; + if (maxObj && maxObj.hms) { + if (maxObj && maxObj.ymd) { + var d1 = Number(year + '' + month + '' + day + '' + hours + '' + minute + '' + maxObj.hms[2]); + var d2 = Number(maxObj.ymd[0] + '' + maxObj.ymd[1] + '' + maxObj.ymd[2] + '' + maxObj.hms[0] + '' + maxObj.hms[1] + '' + maxObj.hms[2]); + if (d1 >= d2) { + maxSecond = Number(maxObj.hms[2]); + } + } else { + maxSecond = Number(maxObj.hms[2]); + } + } + } + } + for (var i = minSecond; i <= maxSecond; i++) { + var value = ('00' + i).slice(-2); + arr.push({ + name: value + '秒', + value: value + }) + } + return arr; + }, + getLastDay: function (result) { + var year = result[0].value, + month = result[1].value; + var thisDate = new Date(Number(year), Number(month), 0); + return thisDate.getDate(); + }, + getMinOrMaxDate: function (date) { + if (!date) { + return; + } + var arr = date.split(" "); + var obj = {}; + if (arr.length > 0) { + if (arr.length == 2) { + obj.ymd = arr[0].split("-"); + obj.hms = arr[1].split(":"); + } else if (arr.length == 1 && date.indexOf(":") == -1) { + obj.ymd = arr[0].split("-"); + } else { + obj.hms = arr[0].split(":"); + } + } + return obj; + }, +} + diff --git a/view/molistar/modules/guildAr/js/memberFlow.js b/view/molistar/modules/guildAr/js/memberFlow.js index 29e1f54e..47c4ff3e 100644 --- a/view/molistar/modules/guildAr/js/memberFlow.js +++ b/view/molistar/modules/guildAr/js/memberFlow.js @@ -28,11 +28,10 @@ const toastMsg = (content = langReplace(localLang.demoModule.layerIndex2), time skin: 'msg' }) } -// var times = new Date().getTime() - 86400000; -var times = new Date().getTime(); +var date_obj = lay_picker_date.getDateTime(); +var date_obj2 = lay_picker_date.getDateTime(); var startDates; var endDates; -var timestamp; // 初始化函數 $(function () { getInfoFromClient(); @@ -54,8 +53,53 @@ $(function () { langReplace = window.lang.replace; localLang = window.lang; translateFun(); - //初始化时间插件 - this.initTime() + // 选择日期1 + 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) }) function translateFun() { @@ -64,78 +108,55 @@ function translateFun() { $('.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)); } -function initTime() { - // console.log(dateFormat(times, 'yyyy-MM-dd')); - $('.timeBox .year b').text(dateFormat(times, 'yyyy')); - $('.timeBox .startTime b').text(`${dateFormat(times, 'MM')}-${dateFormat(times, 'dd')}`); - $('.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() +// 获取数据接口 +function memberIncome() { + $('.box .box_in .fistBox .fist').remove(); + $('.box .box_in .ordinaryBox .ordinaryBox_in').remove(); networkRequest({ type: 'get', url: urlPrefix + '/family/memberIncome', - data: { startDate, endDate }, + data: { startDate: startDates, endDate: endDates }, success(res) { if (res.code === 200) { - var str = ''; - if (res.data.length == 0) { - str += ` -
  • -
    ${langReplace(localLang.memberFlow.text12)}
    -
    ${langReplace(localLang.memberFlow.text12)}
    -
    ${langReplace(localLang.memberFlow.text12)}
    -
    ${langReplace(localLang.memberFlow.text12)}
    -
    ${langReplace(localLang.memberFlow.text12)}
    -
  • + // 处理头部数值 + $('.totalGoldIncome').text(res.data.totalGoldIncome); + // $('.totalGoldIncome').text(unitProcessingAr(res.data.totalGoldIncome, 0)); + var strLeft = ''; + var strRight = ''; + res.data.memberIncomeList.forEach((res, i) => { + strLeft += ` +
    +
    ${localLang.memberFlow2.text10}
    +
    + +
    ${langReplace(localLang.memberFlow.text9)}
    +

    ${res.member.nick}

    + ID:${res.member.erbanNo}${res.member.enable ? '' : `(${langReplace(localLang.lay.departed)})`} +
    +
    ` - } else { - $('.timeBox .right .div1 b').text(res.data.totalGoldIncome); - $('.timeBox .right .div2 b').text(res.data.totalDiamondRemain); - res.data.memberIncomeList.forEach(val => { - str += ` -
  • -
    - -

    ${val.member.nick}

    - ID:${val.member.erbanNo} -
    -
    ${val.micRemainTime}
    -
    ${val.goldIncome}
    -
    ${val.diamondRemain}
    -
    ${val.sendGiftUserNum}
    -
  • + strRight += ` +
    +
    +
    ${langReplace(localLang.memberFlow.text6)}
    +

    ${res.goldIncome}

    +
    +
    +
    ${langReplace(localLang.memberFlow.text7)}
    +

    ${res.micRemainTime}

    +
    +
    +
    ${langReplace(localLang.memberFlow.text8)}
    +

    ${res.sendGiftUserNum}

    +
    +
    ` - }) - } - $('.list').append(str); - timestamp = res.timestamp; + }) + $('.box .box_in .fistBox').append(strLeft); + $('.box .box_in .ordinaryBox').append(strRight); } else { toastMsg(res.message) - timestamp = res.timestamp; } hideLoading(layerIndex) }, @@ -144,20 +165,7 @@ function memberIncome(startDate, endDate) { 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) - } -}) \ No newline at end of file +} + + diff --git a/view/molistar/modules/guildAr/js/memberFlow2.js b/view/molistar/modules/guildAr/js/memberFlow2.js index 927503b3..6bf1d4f4 100644 --- a/view/molistar/modules/guildAr/js/memberFlow2.js +++ b/view/molistar/modules/guildAr/js/memberFlow2.js @@ -28,11 +28,17 @@ const toastMsg = (content = langReplace(localLang.demoModule.layerIndex2), time skin: 'msg' }) } -// var times = new Date().getTime() - 86400000; -var times = new Date().getTime(); -var startDates; -var endDates; -var timestamp; +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 }, + ] +); +const date = new Date(); +const currentMonth = date.getMonth() + 1 < 10 ? "0" + (date.getMonth() + 1) : date.getMonth() + 1; // 初始化函數 $(function () { getInfoFromClient(); @@ -54,8 +60,44 @@ $(function () { langReplace = window.lang.replace; localLang = window.lang; 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) }) function translateFun() { @@ -70,69 +112,66 @@ function translateFun() { $('.text7').text(langReplace(localLang.memberFlow2.text7)); $('.text8').text(langReplace(localLang.memberFlow2.text8)); $('.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')); - $('.timeBox .year b').text(dateFormat(times, 'yyyy')); - $('.timeBox .startTime b').text(`${dateFormat(times, 'MM')}-${dateFormat(times, 'dd')}`); - $('.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() +// 获取数据接口 +function familyWage(month) { + $('.box .box_in .fistBox .fist').remove(); + $('.box .box_in .ordinaryBox .ordinaryBox_in').remove(); networkRequest({ type: 'get', - url: urlPrefix + '/family/income', - data: { startDate, endDate }, + url: urlPrefix + '/family/wage', + data: { month }, success(res) { if (res.code === 200) { - var str = ''; - if (res.data.length == 0) { - str += ` -
  • -
    ${langReplace(localLang.memberFlow.text12)}
    -
    ${langReplace(localLang.memberFlow.text12)}
    -
    ${langReplace(localLang.memberFlow.text12)}
    -
    ${langReplace(localLang.memberFlow.text12)}
    -
    ${langReplace(localLang.memberFlow.text12)}
    -
  • + // 处理头部数值 + $('.totalWage').text(res.data.totalWage); + // $('.totalWage').text(unitProcessingAr(res.data.totalWage, 0)); + $('.header .datas1 p b').text(unitProcessingAr(res.data.goldWage, 1)) + $('.header .datas2 p b').text(unitProcessingAr(res.data.agentWage, 1)) + $('.header .datas3 p b').text(unitProcessingAr(res.data.diamondRemain, 1)) + var strLeft = ''; + var strRight = ''; + res.data.memberWageList.forEach((res, i) => { + strLeft += ` +
    +
    ${localLang.memberFlow2.text10}
    +
    + +
    ${langReplace(localLang.memberFlow.text9)}
    +

    ${res.nick}

    + ID:${res.erbanNo}${res.enable ? '' : `(${langReplace(localLang.lay.departed)})`} +
    +
    ` - } else { - $('.timeBox .right .div1 b').text(res.data.totalGoldIncome); - $('.timeBox .right .div2 b').text(res.data.totalDiamondRemain); - res.data.incomeList.forEach(val => { - str += ` -
  • -
    ${dateFormat(val.date, 'yyyy-MM-dd')}
    -
    ${val.micRemainTime}
    -
    ${val.goldIncome}
    -
    ${val.diamondRemain}
    -
    ${val.sendGiftUserNum}
    -
  • + strRight += ` +
    +
    +
    ${localLang.memberFlow2.text11}
    +

    ${res.micVaildDays}

    +
    +
    +
    ${localLang.memberFlow2.text12}
    +

    ${unitProcessingAr(res.goldIncome, 1)}

    +
    +
    +
    ${localLang.memberFlow2.text13}
    +

    ${unitProcessingAr(res.goldWage, 1)}

    +
    +
    +
    ${localLang.memberFlow2.text14}
    +

    ${unitProcessingAr(res.diamondRemain, 1)}

    +
    +
    +
    ${localLang.memberFlow2.text15}
    +

    ${localLang.memberFlow2.text16}

    +
    +
    ` - }) - } - $('.list').append(str); - timestamp = res.timestamp; + }) + $('.box .box_in .fistBox').append(strLeft); + $('.box .box_in .ordinaryBox').append(strRight); } else { toastMsg(res.message) - timestamp = res.timestamp; } hideLoading(layerIndex) }, @@ -141,28 +180,105 @@ function memberIncome(startDate, endDate) { 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)) { - toastMsg(langReplace(localLang.memberFlow.text16)) +} +// 前一个月 +$('.previousMonth').click(function () { + 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 { - 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}`; }) \ No newline at end of file diff --git a/view/molistar/modules/guildAr/js/memberFlow22.js b/view/molistar/modules/guildAr/js/memberFlow22.js new file mode 100644 index 00000000..29f8bc66 --- /dev/null +++ b/view/molistar/modules/guildAr/js/memberFlow22.js @@ -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 += ` +
    +
    +
    ${langReplace(localLang.memberFlow22.text10)}
    +

    ${res.date}

    +
    +
    +
    ${langReplace(localLang.memberFlow22.text11)}
    +

    ${res.micRemainTime}

    +
    +
    +
    ${langReplace(localLang.memberFlow22.text12)}
    +

    ${unitProcessingAr(res.goldIncome, 1)}

    +
    +
    +
    ${langReplace(localLang.memberFlow22.text13)}
    +

    ${unitProcessingAr(res.savedGoldIncome, 1)}

    +
    +
    +
    ${langReplace(localLang.memberFlow22.text14)}
    +

    ${res.savedGoldWage}

    +
    +
    + ` + }) + $('.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, + }; + } +} \ No newline at end of file diff --git a/view/molistar/modules/guildAr/js/memberFlow222.js b/view/molistar/modules/guildAr/js/memberFlow222.js new file mode 100644 index 00000000..79054b61 --- /dev/null +++ b/view/molistar/modules/guildAr/js/memberFlow222.js @@ -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 += ` +
    +
    +
    ${langReplace(localLang.memberFlow222.text10)}
    +

    ${res.date}

    +
    +
    +
    ${langReplace(localLang.memberFlow222.text11)}
    +

    ${res.micRemainTime}

    +
    +
    +
    ${langReplace(localLang.memberFlow222.text12)}
    +

    ${unitProcessingAr(res.goldIncome, 1)}

    +
    +
    +
    ${langReplace(localLang.memberFlow222.text13)}
    +

    ${unitProcessingAr(res.savedGoldIncome, 1)}

    +
    +
    +
    ${langReplace(localLang.memberFlow222.text14)}
    +

    ${res.savedGoldWage}

    +
    +
    + ` + }) + $('.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, + }; + } +} \ No newline at end of file diff --git a/view/molistar/modules/guildAr/js/memberFlow3.js b/view/molistar/modules/guildAr/js/memberFlow3.js new file mode 100644 index 00000000..12bb8ffa --- /dev/null +++ b/view/molistar/modules/guildAr/js/memberFlow3.js @@ -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, + }; + } +} \ No newline at end of file diff --git a/view/molistar/modules/guildAr/local/ar.js b/view/molistar/modules/guildAr/local/ar.js index 0a636033..32d09158 100644 --- a/view/molistar/modules/guildAr/local/ar.js +++ b/view/molistar/modules/guildAr/local/ar.js @@ -20,7 +20,12 @@ langAr = { text13: `المشرف`, text14: `حذف`, text15: `هل أنت متأكد أنك تريد إزالة هذا الشخص؟`, - text16: `MoliStarID بحث عن `, + text16: `أدخل أي دي مولي ستار للبحث`, + texts1: "إحصائيات دخل العملات", + texts2: "إحصائيات دخل الرواتب", + texts3: "إعدادات معلومات الوكالة", + texts4: "إعدادات مشرف الوكالة", + texts5: "راتبي", }, adminSet: { text1: `إعدادات المشرف`, @@ -56,14 +61,18 @@ langAr = { text8: 'تم تقديم الطلب بنجاح', }, guildInfoSet: { - text1: `إعدادات معلومات الوكالة`, + text1: `إعدادات معلومات الوكالة `, text2: `إعدادات معلومات الوكالة`, - text3: `أسم الوكالة: `, + text3: `اسم الوكالة: `, text4: `أسم الوكالة`, text5: `خلفية الوكالة:`, text6: `حذف`, text7: `حفظ`, text8: `تم التحميل بنجاح`, + textConte1: `حفظ`, + textConte2: `تعديل `, + textConte3: `إضافة`, + textConte4: `حساب أستلام الراتب `, }, invitation: { text1: `البحث`, @@ -78,41 +87,66 @@ langAr = { text10: 'تمت الدعوة بنجاح', }, memberFlow: { - close: `حذف`, - ok: `تأكيد`, - text1: `إجمالي دخل الأعضاء`, - text2: `إجمالي دخل الأعضاء`, - text3: `استعلام`, - text4: `سنة`, - text5: `الدخل الإجمالي للعملات الذهبية`, - text6: `الدخل الإجمالي للماس`, - text7: `معلومات الأعضاء`, - text8: `وقت البث`, - text9: `دخل كوينز `, - text10: `دخل الماسات`, - text11: `عدد المُرسلين للهدايا`, - text12: `لا يوجد`, - text13: 'وقت الانتهاء يجب أن يكون قبل اليوم السابق كحد أقصى.', - text14: 'وقت الانتهاء يجب أن يكون قبل اليوم السابق كحد أقصى.', - text15: `لا يمكن أن يكون وقت البدء أقل من وقت الانتهاء.`, - text16: 'المدة الزمنية يجب أن تكون داخل الثلاثين يومًا.', + text1: `مجموع دخل العملات الذهبية`, + text2: `إجمالي دخل الوكالة من العملات الذهبية`, + text3: `دخل العملات الذهبية للأعضاء `, + text4: `لا يمكن أن يكون وقت البدء بعد وقت الانتهاء`, + text5: `لا يمكن أن يتجاوز الفترة الزمنية المحددة 90 يومًا`, + text6: `دخل العملات الذهبية `, + text7: `مدة البث المباشر `, + text8: `عدد المستخدمين الراسلين للهدايا `, + text9: `أنا`, }, memberFlow2: { - close: `حذف`, - ok: `تأكيد`, - text1: `الدخل الشخصي`, - text2: `الدخل الشخصي`, - text3: `استعلام`, - text4: `سنة`, - text5: `الدخل الإجمالي للعملات الذهبية`, - text6: `الدخل الإجمالي للماس`, - text7: `استبدال >>`, - text8: `التاريخ`, - text9: `وقت البث`, - text10: `دخل كوينز `, - text11: `دخل الماسات`, - text12: `عدد المُرسلين للهدايا`, - text13: ``, + text1: `مجموع دخل الرواتب `, + text2: `الشهر الماضي `, + text3: `الشهر التالي`, + text4: `راتبي الشهري `, + text5: `راتب العملات الذهبية `, + text6: `راتب الوكالة `, + text7: `رصيد الماس الحالي `, + text8: `الراتب الشهري للأعضاء`, + text9: `شهر`, + text10: `معلومات الأعضاء `, + text11: `عدد الأيام الصالحة`, + text12: `دخل العملات الذهبية`, + text13: `راتب العملات الذهبية `, + text14: `رصيد الماس `, + 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: { text1: `بحث`, @@ -124,4 +158,9 @@ langAr = { text7: `تأكيد`, text8: 'تم تقديم الطلب بنجاح', }, + lay: { + ok: 'تأكيد', + close: 'إلغاء', + departed: 'غادر', + } } \ No newline at end of file diff --git a/view/molistar/modules/guildAr/local/en.js b/view/molistar/modules/guildAr/local/en.js index bea58fbb..cb5cf066 100644 --- a/view/molistar/modules/guildAr/local/en.js +++ b/view/molistar/modules/guildAr/local/en.js @@ -5,7 +5,7 @@ langEn = { layerIndex3: `Network error`, text1: `Agency Name`, text2: `Agency Name`, - text3: `Admin`, + text3: `Administrator`, text4: `Settings`, text5: `Income`, text6: `Invite`, @@ -14,32 +14,37 @@ langEn = { text9: `Cancel`, text10: `Confirm`, text11: 'Guild Name:', - text12: `Chair`, - text13: `Admin`, + text12: `Master`, + text13: `Administrator`, text14: `Delete`, 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: { - text1: `Admin`, + text1: `Administrator`, text2: `Find`, text3: `No data`, - text4: `Appoint admin?`, + text4: `Appoint Administrator?`, text5: `Cancel`, text6: `Confirm`, text7: `Add`, text8: `Added`, }, adminSet2: { - text1: `Admin`, + text1: `Administrator`, text2: `Settings`, - text3: `Add Admin`, + text3: `Add Administrator`, text4: `No data`, - text5: `Remove admin?`, + text5: `Remove Administrator?`, text6: `Cancel`, text7: `Confirm`, - text8: `Chair`, - text9: `Admin`, + text8: `Master`, + text9: `Administrator`, text10: `Delete`, text11: 'Removed', }, @@ -54,14 +59,18 @@ langEn = { text8: 'Submitted', }, guildInfoSet: { - text1: `Guild Info`, - text2: `Settings`, - text3: `Agency Name: `, - text4: `Agency Name`, + text1: `Agency Settings`, + text2: `Agency Settings`, + text3: `Name: `, + text4: `Name`, text5: `Background:`, text6: `Delete`, text7: `Save`, text8: `Loaded`, + textConte1: `Save`, + textConte2: `Edit`, + textConte3: `Add`, + textConte4: `Payment Account`, }, invitation: { text1: `Find`, @@ -76,41 +85,66 @@ langEn = { text10: 'Sent invitation', }, memberFlow: { - close: `Cancel`, - ok: `Confirm`, - text1: `Total Income`, - text2: `Total Income`, - text3: `Query`, - text4: `Year`, - text5: `Total Gold`, - text6: `Total Diamond`, - text7: `Member Info`, - 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.', + text1: `Income Statistics`, + text2: `Total Coins Income`, + text3: `Members Coins Income`, + text4: `Start time cannot be later than end time`, + text5: `Selected time period cannot exceed 90 days`, + text6: `Coins Income`, + text7: `Duration`, + text8: `Num of Givers`, + text9: `Me`, }, memberFlow2: { - close: `Cancel`, - ok: `Confirm`, - text1: `Personal Income`, - text2: `Personal Income`, - text3: `Query`, - text4: `Year`, - text5: `Total Gold`, - text6: `Total Diamond`, - text7: `Gold Coin Agen >>`, - text8: `Date`, - text9: `Broadcast Time`, - text10: `Coins`, - text11: `Diamonds`, - text12: `Gift Senders`, - text13: ``, + text1: `Salaries Statistics`, + text2: `Previous`, + text3: `Next`, + text4: `My Salary`, + text5: `Coin Salary`, + text6: `Commission`, + text7: `Remaining Diamonds`, + text8: `Member Salaries`, + text9: `Month`, + text10: `Member`, + text11: `Valid days`, + text12: `Coins Income`, + text13: `Coin Salary`, + text14: `Remaining Diamonds`, + 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: { text1: `Find`, @@ -122,4 +156,9 @@ langEn = { text7: `Cancel`, text8: 'Submitted', }, + lay: { + ok: 'Confirm', + close: 'Cancel', + departed: 'Departed', + } } diff --git a/view/molistar/modules/guildAr/local/zh.js b/view/molistar/modules/guildAr/local/zh.js index d34e15d5..33c18cd9 100644 --- a/view/molistar/modules/guildAr/local/zh.js +++ b/view/molistar/modules/guildAr/local/zh.js @@ -21,6 +21,11 @@ langZh = { text14: `刪除`, text15: `確定要將此人移除嗎?`, text16: `搜索MoliStarID`, + texts1: `金幣收入統計`, + texts2: `工資收入統計`, + texts3: `公會信息設置`, + texts4: `公會管理員設置`, + texts5: `我的工資`, }, adminSet: { text1: `管理員設置`, @@ -64,6 +69,10 @@ langZh = { text6: `刪除`, text7: `保存`, text8: `加載成功`, + textConte1: `保存`, + textConte2: `修改`, + textConte3: `添加`, + textConte4: `收款賬戶`, }, invitation: { text1: `搜索`, @@ -78,41 +87,66 @@ langZh = { text10: '邀請成功發送', }, memberFlow: { - close: `刪除`, - ok: `確認`, - text1: `成員總收入`, - text2: `成員總收入`, - text3: `查詢`, - text4: `年份`, - text5: `總金幣收入`, - text6: `總鉆石收入`, - text7: `成員信息`, - text8: `直播時間`, - text9: `金幣收入`, - text10: `鉆石收入`, - text11: `贈送禮物人數`, - text12: `無`, - text13: '結束時間不得晚於前一天。', - text14: '結束時間不得晚於前一天。', - text15: `開始時間不能早於結束時間.`, - text16: '持續時間必須在三十天內.', + text1: `金幣收入統計`, + text2: `金額收入總額`, + text3: `成員金幣收入`, + text4: `開始時間不能大於結束時間`, + text5: `所選時間段不能大於90天`, + text6: `金幣收入`, + text7: `直播時長`, + text8: `贈送禮物人數`, + text9: `我`, }, memberFlow2: { - close: `刪除`, - ok: `確認`, - text1: `個人收入`, - text2: `個人收入`, - text3: `查詢`, - text4: `年份`, - text5: `總金幣收入`, - text6: `總鉆石收入`, - text7: `兌換金幣 >>`, - text8: `日期`, - text9: `直播時間`, - text10: `金幣收入`, - text11: `鉆石收入`, - text12: `贈送禮物人數`, - text13: ``, + text1: `工資收入統計`, + text2: `前一個月`, + text3: `後一個月`, + text4: `我的月工資`, + text5: `金幣工資`, + text6: `代理工資`, + text7: `當前鉆石`, + text8: `成員月工資`, + text9: `月`, + text10: `成員信息`, + text11: `有效天數`, + text12: `金幣收入`, + text13: `金幣工資`, + text14: `鉆石余額`, + 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: { text1: `搜索`, @@ -124,4 +158,9 @@ langZh = { text7: `確認`, text8: '請求成功提交', }, + lay: { + ok: '確認', + close: '取消', + departed: '已离开', + }, } \ No newline at end of file diff --git a/view/molistar/modules/guildAr/memberFlow.html b/view/molistar/modules/guildAr/memberFlow.html index 5d687623..d678b3d7 100644 --- a/view/molistar/modules/guildAr/memberFlow.html +++ b/view/molistar/modules/guildAr/memberFlow.html @@ -5,9 +5,10 @@ - + + @@ -15,54 +16,78 @@
    -
    -
    +
    - -
    -
    -
    2024
    -
    00-00
    -
    00-00
    -
    -
    - -

    - 0 + +
    + +
    +
    + +
    +
    +

    +

    + + 0 +

    +
    + +
    +

    +
    + +
    +
    -
    - -

    - 0 + +
    +
    - -
      -
    • - -
      - -
      - -
      - -
      - -
      -
    • -
    • -
      - -

      虚位以待

      - ID:0 -
      -
      0
      -
      0
      -
      0
      -
      0
      -
    • -
    @@ -76,6 +101,7 @@ + diff --git a/view/molistar/modules/guildAr/memberFlow2.html b/view/molistar/modules/guildAr/memberFlow2.html index 08ad2bfe..5813700d 100644 --- a/view/molistar/modules/guildAr/memberFlow2.html +++ b/view/molistar/modules/guildAr/memberFlow2.html @@ -5,9 +5,10 @@ - + + @@ -15,51 +16,125 @@
    -
    -
    +
    - -
    + +
    + +
    + +
    + +
    +

    +

    + + 0 +

    +
    -
    2024
    -
    00-00
    -
    00-00
    -
    -
    - -

    - 0 +
    +
    +
    +
    +

    + + 0 +

    +
    -
    - -

    - 0 +
    +

    + + 0 +

    + +
    +
    +

    + + 0 +

    + +
    +
    +
    + +
    +

    +
    + +
    + +
    + +
    +
    -
    - -
      -
    • - -
      - -
      - -
      - -
      - -
      -
    • -
    • -
      0000/0/0
      -
      0
      -
      0
      -
      0
      -
      0
      -
    • -
    @@ -73,6 +148,7 @@ + diff --git a/view/molistar/modules/guildAr/memberFlow22.html b/view/molistar/modules/guildAr/memberFlow22.html new file mode 100644 index 00000000..57e96cb9 --- /dev/null +++ b/view/molistar/modules/guildAr/memberFlow22.html @@ -0,0 +1,162 @@ + + + + + + + + + + + + + + + + +
    + +
    +
    + +
    + +
    + +
    + +
    +

    +

    + + 0 +

    +
    + +

    + ID:0 +
    +
    +
    +
    +
    +
    +

    + + 0 +

    + +
    +
    +

    + 0 +

    + +
    +
    +

    + + 0 +

    + +
    +
    +
    + +
    +

    +
    + + + +
    + +
    +
    +
    + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/view/molistar/modules/guildAr/memberFlow222.html b/view/molistar/modules/guildAr/memberFlow222.html new file mode 100644 index 00000000..9eb12acf --- /dev/null +++ b/view/molistar/modules/guildAr/memberFlow222.html @@ -0,0 +1,163 @@ + + + + + + + + + + + + + + + + +
    + +
    +
    + +
    + +
    + +
    + +
    +

    +

    + + 0 +

    +
    + +

    + ID:0 +
    +
    +
    +
    +
    +
    +

    + + 0 +

    + +
    +
    +

    + + 0 +

    + +
    +
    +

    + + 0 +

    + +
    +
    +
    + +
    +

    +
    + + + +
    + +
    +
    +
    + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/view/molistar/modules/guildAr/memberFlow3.html b/view/molistar/modules/guildAr/memberFlow3.html new file mode 100644 index 00000000..0c5875aa --- /dev/null +++ b/view/molistar/modules/guildAr/memberFlow3.html @@ -0,0 +1,184 @@ + + + + + + + 工资收入统计 + + + + + + + + + +
    + +
    工资收入统计
    +
    + +
    + +
    + 前一个月 +
    2024-01
    + 后一个月 +
    +

    我的月工资

    +

    + + 0 +

    + +
    +
    +
    +
    +
    +

    + + 0 +

    + 金币收入 +
    +
    +

    + 0 +

    + 有效天数 +
    +
    +

    + + 0 +

    + 当前钻石 +
    +
    +
    + +
    +

    单日明细

    +
    + +
    +
    +
    赠送礼物人数
    +
    + +

    用户昵称

    + ID:0 +
    +
    +
    +
    赠送礼物人数
    +
    + +

    用户昵称

    + ID:0 +
    +
    +
    +
    赠送礼物人数
    +
    + +

    用户昵称

    + ID:0 +
    +
    +
    + +
    +
    +
    +
    直播时长
    +

    54min

    +
    +
    +
    金币收入
    +

    54min

    +
    +
    +
    赠送礼物人数
    +

    54min

    +
    +
    +
    赠送礼物人数
    +

    54min

    +
    +
    +
    赠送礼物人数
    +

    54min

    +
    +
    +
    +
    +
    直播时长
    +

    54min

    +
    +
    +
    金币收入
    +

    54min

    +
    +
    +
    赠送礼物人数
    +

    54min

    +
    +
    +
    赠送礼物人数
    +

    54min

    +
    +
    +
    赠送礼物人数
    +

    54min

    +
    +
    +
    +
    +
    直播时长
    +

    54min

    +
    +
    +
    金币收入
    +

    54min

    +
    +
    +
    赠送礼物人数
    +

    54min

    +
    +
    +
    赠送礼物人数
    +

    54min

    +
    +
    +
    赠送礼物人数
    +

    54min

    +
    +
    +
    +
    +
    + + + + + + + + + + + + + + + + + + \ No newline at end of file