VIP页面- 复制molistar

view/moliparty/modules/vip_Center/css/index.css

@@ -0,0 +1,461 @@
+html,
+body {
+  width: 100%;
+  background: #150C00;
+}
+
+.back {
+  width: 100%;
+  height: 0.5866666667rem;
+  line-height: 0.5866666667rem;
+  position: fixed;
+  left: 0;
+  top: 0.9333333333rem;
+  text-align: center;
+  color: #FFFFFF;
+  font-size: 0.5066666667rem;
+  font-weight: bold;
+  z-index: 10;
+}
+.back img {
+  width: 0.5866666667rem;
+  height: 0.5866666667rem;
+  position: absolute;
+  left: 0.24rem;
+  top: 0rem;
+}
+
+.header {
+  background: url(../images/bg.png) no-repeat;
+  background-size: cover;
+  width: 100%;
+  height: 8rem;
+  position: fixed;
+  left: 0;
+  top: 0;
+  bottom: 0;
+  right: 0;
+  z-index: 9;
+}
+.header .swiper {
+  padding-top: 2.9333333333rem;
+}
+.header .swiper-slide {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+.header .swiper-slide-next .img_card,
+.header .swiper-slide-prev .img_card {
+  display: flex;
+  align-items: center;
+}
+.header .swiper-slide-next .img_card img,
+.header .swiper-slide-prev .img_card img {
+  height: 3.3066666667rem;
+}
+.header .img_card {
+  width: 8.5333333333rem;
+  height: 3.6266666667rem;
+  position: relative;
+}
+.header .img_card .icon {
+  width: 3.4666666667rem;
+  height: 3.4666666667rem;
+  position: absolute;
+  right: 0.2666666667rem;
+  top: -0.4rem;
+}
+.header .img_card .remainSeconds {
+  position: absolute;
+  bottom: 0.8rem;
+  left: 0.4rem;
+}
+.header .img_card .remainSeconds p {
+  font-family: PingFang SC, PingFang SC;
+  font-weight: 500;
+  font-size: 0.32rem;
+  color: #4D143A;
+  text-align: left;
+  font-style: normal;
+  text-transform: none;
+}
+
+.content {
+  margin-top: 8rem;
+}
+.content .permission .top {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+.content .permission .top img {
+  width: 1.1466666667rem;
+  height: 0.4266666667rem;
+}
+.content .permission .top .title_name {
+  font-family: PingFang SC, PingFang SC;
+  font-weight: 600;
+  font-size: 0.4266666667rem;
+  color: #FFE3AF;
+  line-height: 44px;
+  text-align: center;
+  font-style: normal;
+  text-transform: none;
+  margin: 0 0.32rem;
+}
+.content .permission .box_warp {
+  display: grid;
+  grid-template-columns: repeat(2, 1fr);
+  grid-gap: 0.32rem;
+  grid-template-rows: auto;
+  padding: 0 0.4533333333rem;
+}
+.content .permission .box_warp .content_box {
+  background-image: url("../images/content_bg.png");
+  background-size: 100% 100%;
+}
+.content .permission .box_warp .content_box p {
+  font-family: PingFang SC, PingFang SC;
+  font-weight: 400;
+  font-size: 0.3466666667rem;
+  color: #FFE3AF;
+  text-align: center;
+  font-style: normal;
+  text-transform: none;
+  padding-bottom: 0.3466666667rem;
+}
+.content .exclusive_discounts {
+  margin-top: 0.64rem;
+  padding-bottom: 4rem;
+}
+.content .exclusive_discounts .top {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+.content .exclusive_discounts .top img {
+  width: 1.1466666667rem;
+  height: 0.4266666667rem;
+}
+.content .exclusive_discounts .top .title_name {
+  font-family: PingFang SC, PingFang SC;
+  font-weight: 600;
+  font-size: 0.4266666667rem;
+  color: #FFE3AF;
+  line-height: 44px;
+  text-align: center;
+  font-style: normal;
+  text-transform: none;
+  margin: 0 0.32rem;
+}
+.content .exclusive_discounts .top .title_name .num {
+  font-family: PingFang SC, PingFang SC;
+  font-weight: 500;
+  font-size: 0.3733333333rem;
+  color: #FFE3AF;
+  text-align: center;
+  font-style: normal;
+  text-transform: none;
+  line-height: 0.1333333333rem;
+}
+.content .exclusive_discounts .box_warp {
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+  grid-gap: 0.32rem;
+  grid-template-rows: auto;
+  padding: 0 0.4533333333rem;
+}
+.content .exclusive_discounts .box_warp .content_box {
+  text-align: center;
+  margin-top: 0.6933333333rem;
+}
+.content .exclusive_discounts .box_warp .content_box img {
+  width: 1.12rem;
+  height: 1.12rem;
+}
+.content .exclusive_discounts .box_warp .content_box .name {
+  font-family: PingFang SC, PingFang SC;
+  font-weight: 400;
+  font-size: 0.3466666667rem;
+  color: #FFE3AF;
+  text-align: center;
+  font-style: normal;
+  text-transform: none;
+  margin-top: 0.1066666667rem;
+}
+.content .exclusive_discounts .box_warp .noactive {
+  opacity: 0.5;
+}
+
+.selectAccount {
+  position: fixed;
+  left: 0;
+  top: 0;
+  bottom: 0;
+  right: 0;
+  z-index: 999;
+  background: rgba(0, 0, 0, 0.5);
+  display: none;
+}
+.selectAccount .selectAccount_in {
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  bottom: 0;
+  width: 100%;
+  min-height: 8.6666666667rem;
+  background: #170D00;
+  border-radius: 0.5333333333rem 0.5333333333rem 0px 0px;
+}
+.selectAccount .selectAccount_in .name {
+  font-family: PingFang SC, PingFang SC;
+  font-weight: 600;
+  font-size: 0.4266666667rem;
+  color: #FFE3AF;
+  text-align: center;
+  font-style: normal;
+  text-transform: none;
+  position: relative;
+  padding-top: 0.5333333333rem;
+}
+.selectAccount .selectAccount_in .name img {
+  width: 0.5866666667rem;
+  height: 0.5866666667rem;
+  position: absolute;
+  left: 0.24rem;
+  top: 0.48rem;
+}
+.selectAccount .selectAccount_in .descPic {
+  padding: 0.4266666667rem;
+}
+.selectAccount .selectAccount_in .descPic img {
+  width: 100%;
+  height: 4.1866666667rem;
+}
+.selectAccount .selectAccount_in .authIntro {
+  font-family: PingFang SC, PingFang SC;
+  font-weight: 400;
+  font-size: 0.3733333333rem;
+  color: #FFE3AF;
+  text-align: left;
+  font-style: normal;
+  text-transform: none;
+  padding: 0 0.4266666667rem;
+  opacity: 0.6;
+}
+
+.bottom_renew {
+  position: fixed;
+  left: 0;
+  bottom: 0;
+  right: 0;
+  z-index: 990;
+  padding: 0 0.4266666667rem 0.6933333333rem;
+  background: #150C00;
+}
+.bottom_renew .renew_bg {
+  position: relative;
+}
+.bottom_renew .wrap {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  position: absolute;
+  left: 4%;
+  right: 2%;
+  top: 0.0666666667rem;
+  padding: 0 0.4266666667rem;
+}
+.bottom_renew .wrap .left {
+  display: flex;
+  align-items: center;
+}
+.bottom_renew .wrap .left img {
+  width: 0.5333333333rem;
+  height: 0.5333333333rem;
+}
+.bottom_renew .wrap .left .buyAmount {
+  font-family: PingFang SC, PingFang SC;
+  font-weight: 400;
+  font-size: 0.4rem;
+  color: #FFE3AF;
+  text-align: center;
+  font-style: normal;
+  text-transform: none;
+  margin: 0 0.1066666667rem;
+}
+.bottom_renew .wrap .renew_btn {
+  background: url(../images/renew_btn.png) no-repeat;
+  background-size: 100% 100%;
+  width: 3.8933333333rem;
+  height: 1.2533333333rem;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  border-radius: 0.4266666667rem;
+  font-family: PingFang SC, PingFang SC;
+  font-weight: 600;
+  font-size: 0.4266666667rem;
+  color: #633000;
+  text-align: center;
+  font-style: normal;
+  text-transform: none;
+}
+.bottom_renew .wrap_txt {
+  font-family: PingFang SC, PingFang SC;
+  font-weight: 400;
+  font-size: 0.4rem;
+  color: #FFE3AF;
+  text-align: center;
+  font-style: normal;
+  text-transform: none;
+  position: absolute;
+  left: 4%;
+  right: 2%;
+  top: 50%;
+  bottom: 0;
+  transform: translateY(-50%);
+  display: none;
+}
+
+.payPopup {
+  position: fixed;
+  left: 0;
+  top: 0;
+  bottom: 0;
+  right: 0;
+  z-index: 999;
+  background: rgba(0, 0, 0, 0.5);
+  display: none;
+}
+.payPopup .payPopup_warp {
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  bottom: 0;
+  width: 100%;
+  min-height: 5.8666666667rem;
+  background: #FFFFFF;
+  border-radius: 0.4266666667rem 0.4266666667rem 0px 0px;
+}
+.payPopup .payPopup_warp .title {
+  font-family: PingFang SC, PingFang SC;
+  font-weight: 600;
+  font-size: 0.4266666667rem;
+  color: #313131;
+  text-align: center;
+  font-style: normal;
+  text-transform: none;
+  margin-top: 0.32rem;
+}
+.payPopup .payPopup_warp .buyAmount {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  margin-top: 1.1466666667rem;
+}
+.payPopup .payPopup_warp .buyAmount .num {
+  font-family: PingFang SC, PingFang SC;
+  font-weight: 500;
+  font-size: 0.7466666667rem;
+  color: #313131;
+  text-align: center;
+  font-style: normal;
+  text-transform: none;
+  margin-right: 0.1066666667rem;
+}
+.payPopup .payPopup_warp .buyAmount img {
+  width: 0.8266666667rem;
+  height: 0.8266666667rem;
+}
+.payPopup .payPopup_warp .pay_btn {
+  background: linear-gradient(270deg, #E29030 0%, #FCC074 100%);
+  border-radius: 0.4266666667rem;
+  font-family: PingFang TC, PingFang TC;
+  font-weight: 500;
+  font-size: 0.4266666667rem;
+  color: #FFFFFF;
+  text-align: center;
+  font-style: normal;
+  text-transform: none;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 0.2666666667rem 2.6666666667rem;
+  margin: 1.12rem 0.4rem 0;
+}
+
+.custom-dialog, .shop-dialog {
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background: rgba(0, 0, 0, 0.5);
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  z-index: 1000;
+  visibility: hidden;
+  opacity: 0;
+  transition: opacity 0.3s ease, visibility 0.3s ease;
+}
+.custom-dialog.visible, .shop-dialog.visible {
+  visibility: visible;
+  opacity: 1;
+}
+.custom-dialog .dialog-content, .shop-dialog .dialog-content {
+  background: #FFFFFF;
+  border-radius: 0.2133333333rem;
+  width: 6.5333333333rem;
+  padding: 0.32rem 0.6666666667rem;
+  box-shadow: 0 0.1066666667rem 0.2133333333rem rgba(0, 0, 0, 0.2);
+  display: flex;
+  flex-direction: column;
+}
+.custom-dialog .dialog-header, .shop-dialog .dialog-header {
+  margin-bottom: 0.2133333333rem;
+  text-align: center;
+  margin-top: 0.2666666667rem;
+}
+.custom-dialog .dialog-header .dialog-title, .shop-dialog .dialog-header .dialog-title {
+  font-family: PingFang SC, PingFang SC;
+  font-weight: 400;
+  font-size: 0.3733333333rem;
+  color: #313131;
+  font-style: normal;
+  text-transform: none;
+  line-height: 0.5333333333rem;
+}
+.custom-dialog .dialog-footer, .shop-dialog .dialog-footer {
+  display: flex;
+  justify-content: space-between;
+  margin-top: 0.6666666667rem;
+}
+.custom-dialog .dialog-footer .dialog-btn, .shop-dialog .dialog-footer .dialog-btn {
+  background: linear-gradient(270deg, #E29030 0%, #FCC074 100%);
+  border: none;
+  border-radius: 0.4266666667rem;
+  font-family: PingFang SC, PingFang SC;
+  font-size: 0.4266666667rem;
+  color: #FFFFFF;
+  text-align: center;
+  font-style: normal;
+  text-transform: none;
+  padding: 0.16rem 0.5333333333rem;
+  margin-left: 0.2133333333rem;
+  cursor: pointer;
+  transition: background 0.3s ease;
+  width: 2.9333333333rem;
+}
+.custom-dialog .dialog-footer .dialog-btn:hover, .shop-dialog .dialog-footer .dialog-btn:hover {
+  background: linear-gradient(270deg, #FCC074 0%, #E29030 100%);
+}
+.custom-dialog .dialog-footer .dialog-cancel, .shop-dialog .dialog-footer .dialog-cancel {
+  background: #E0E0E0;
+  color: #333333;
+}
+.custom-dialog .dialog-footer .dialog-cancel:hover, .shop-dialog .dialog-footer .dialog-cancel:hover {
+  background: #BDBDBD;
+}

view/moliparty/modules/vip_Center/css/index.scss

@@ -0,0 +1,540 @@
+@function px2rem($px) {
+  @return $px / 75+rem;
+}
+
+html,
+body {
+  width: 100%;
+  background: #150C00;
+  // padding: px2rem(26);
+}
+
+.back {
+  width: 100%;
+  height: px2rem(44);
+  line-height: px2rem(44);
+  position: fixed;
+  left: 0;
+  top: px2rem(70);
+  text-align: center;
+  color: #FFFFFF;
+  font-size: px2rem(38);
+  font-weight: bold;
+  z-index: 10;
+
+  img {
+    width: px2rem(44);
+    height: px2rem(44);
+    position: absolute;
+    left: px2rem(18);
+    top: px2rem(0);
+  }
+}
+
+.header {
+  background: url(../images/bg.png) no-repeat;
+  // background-size: 100% 100%;
+  background-size: cover;
+  width: 100%;
+  height: px2rem(600);
+  position: fixed;
+  left: 0;
+  top: 0;
+  bottom: 0;
+  right: 0;
+  z-index: 9;
+
+  .swiper {
+    padding-top: px2rem(220);
+  }
+
+  .swiper-slide {
+    // width: 100%;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+  }
+
+  .swiper-slide-active {}
+
+  .swiper-slide-next,
+  .swiper-slide-prev {
+    .img_card {
+      // height: px2rem(248);
+      display: flex;
+      align-items: center;
+
+      img {
+        height: px2rem(248);
+
+      }
+    }
+  }
+
+  .img_card {
+    width: px2rem(640);
+    height: px2rem(272);
+    position: relative;
+
+    .icon {
+      width: px2rem(260);
+      height: px2rem(260);
+      position: absolute;
+      right: px2rem(20);
+      top: px2rem(-30);
+    }
+
+    .remainSeconds {
+      position: absolute;
+      bottom: px2rem(60);
+      left: px2rem(30);
+
+      p {
+        font-family: PingFang SC, PingFang SC;
+        font-weight: 500;
+        font-size: px2rem(24);
+        color: #4D143A;
+        text-align: left;
+        font-style: normal;
+        text-transform: none;
+      }
+    }
+  }
+}
+
+.content {
+  margin-top: px2rem(600);
+
+  .permission {
+    .top {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+
+      img {
+        width: px2rem(86);
+        height: px2rem(32);
+      }
+
+      .title_name {
+        font-family: PingFang SC, PingFang SC;
+        font-weight: 600;
+        font-size: px2rem(32);
+        color: #FFE3AF;
+        line-height: 44px;
+        text-align: center;
+        font-style: normal;
+        text-transform: none;
+        margin: 0 px2rem(24);
+      }
+    }
+
+    .box_warp {
+      display: grid;
+      grid-template-columns: repeat(2, 1fr);
+      grid-gap: px2rem(24);
+      grid-template-rows: auto;
+      padding: 0 px2rem(34);
+
+      .content_box {
+        // background: linear-gradient(180deg, #402600 6%, #060300 96%);
+        // border: 1px solid;
+        // border-image: linear-gradient(136deg, rgba(255, 201.51765704154968, 76.72566533088684, 1), rgba(255, 255, 255, 1), rgba(133.57143580913544, 93.50000962615013, 0, 1)) 1 1;
+        // border-radius: px2rem(32);
+        background-image: url('../images/content_bg.png');
+        background-size: 100% 100%;
+        p {
+          font-family: PingFang SC, PingFang SC;
+          font-weight: 400;
+          font-size: px2rem(26);
+          color: #FFE3AF;
+          // line-height: 36px;
+          text-align: center;
+          font-style: normal;
+          text-transform: none;
+          padding-bottom: px2rem(26);
+        }
+      }
+    }
+  }
+
+  .exclusive_discounts {
+    margin-top: px2rem(48);
+    padding-bottom: px2rem(300);
+
+    .top {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+
+      img {
+        width: px2rem(86);
+        height: px2rem(32);
+      }
+
+      .title_name {
+        font-family: PingFang SC, PingFang SC;
+        font-weight: 600;
+        font-size: px2rem(32);
+        color: #FFE3AF;
+        line-height: 44px;
+        text-align: center;
+        font-style: normal;
+        text-transform: none;
+        margin: 0 px2rem(24);
+
+        .num {
+          font-family: PingFang SC, PingFang SC;
+          font-weight: 500;
+          font-size: px2rem(28);
+          color: #FFE3AF;
+          text-align: center;
+          font-style: normal;
+          text-transform: none;
+          line-height: px2rem(10);
+        }
+
+      }
+    }
+
+    .box_warp {
+      display: grid;
+      grid-template-columns: repeat(3, 1fr);
+      grid-gap: px2rem(24);
+      grid-template-rows: auto;
+      padding: 0 px2rem(34);
+
+      .content_box {
+        text-align: center;
+        margin-top: px2rem(52);
+
+        img {
+          width: px2rem(84);
+          height: px2rem(84);
+        }
+
+        .name {
+          font-family: PingFang SC, PingFang SC;
+          font-weight: 400;
+          font-size: px2rem(26);
+          color: #FFE3AF;
+          text-align: center;
+          font-style: normal;
+          text-transform: none;
+          margin-top: px2rem(8);
+        }
+
+      }
+
+      .noactive {
+        opacity: 0.5;
+      }
+    }
+  }
+}
+
+.selectAccount {
+  position: fixed;
+  left: 0;
+  top: 0;
+  bottom: 0;
+  right: 0;
+  z-index: 999;
+  background: rgba(0, 0, 0, 0.5);
+  display: none;
+
+  .selectAccount_in {
+    position: absolute;
+    left: 50%;
+    transform: translateX(-50%);
+    bottom: 0;
+    width: 100%;
+    min-height: px2rem(650);
+    background: #170D00;
+    border-radius: px2rem(40) px2rem(40) 0px 0px;
+
+    .name {
+      font-family: PingFang SC, PingFang SC;
+      font-weight: 600;
+      font-size: px2rem(32);
+      color: #FFE3AF;
+      text-align: center;
+      font-style: normal;
+      text-transform: none;
+      position: relative;
+      padding-top: px2rem(40);
+
+      img {
+        width: px2rem(44);
+        height: px2rem(44);
+        position: absolute;
+        left: px2rem(18);
+        top: px2rem(36);
+      }
+    }
+
+    .descPic {
+      padding: px2rem(32);
+
+      img {
+        width: 100%;
+        height: px2rem(314);
+      }
+    }
+
+    .authIntro {
+      font-family: PingFang SC, PingFang SC;
+      font-weight: 400;
+      font-size: px2rem(28);
+      color: #FFE3AF;
+      text-align: left;
+      font-style: normal;
+      text-transform: none;
+      padding: 0 px2rem(32);
+      opacity: 0.6;
+    }
+  }
+}
+
+.bottom_renew {
+  position: fixed;
+  left: 0;
+  // top: 0;
+  bottom: 0;
+  right: 0;
+  z-index: 990;
+  padding: 0 px2rem(32) px2rem(52);
+  background: #150C00;
+
+  .renew_bg {
+    position: relative;
+  }
+
+  .wrap {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    position: absolute;
+    left: 4%;
+    right: 2%;
+    top: px2rem(5);
+    padding: 0 px2rem(32);
+
+    .left {
+      display: flex;
+      align-items: center;
+
+      img {
+        width: px2rem(40);
+        height: px2rem(40);
+      }
+
+      .buyAmount {
+        font-family: PingFang SC, PingFang SC;
+        font-weight: 400;
+        font-size: px2rem(30);
+        color: #FFE3AF;
+        text-align: center;
+        font-style: normal;
+        text-transform: none;
+        margin:0 px2rem(8);
+      }
+    }
+
+    .renew_btn {
+      background: url(../images/renew_btn.png) no-repeat;
+      background-size: 100% 100%;
+      width: px2rem(292);
+      height: px2rem(94);
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      border-radius: px2rem(32);
+      font-family: PingFang SC, PingFang SC;
+      font-weight: 600;
+      font-size: px2rem(32);
+      color: #633000;
+      text-align: center;
+      font-style: normal;
+      text-transform: none;
+    }
+  }
+
+  .wrap_txt {
+    font-family: PingFang SC, PingFang SC;
+    font-weight: 400;
+    font-size: px2rem(30);
+    color: #FFE3AF;
+    text-align: center;
+    font-style: normal;
+    text-transform: none;
+    position: absolute;
+    left: 4%;
+    right: 2%;
+    top: 50%;
+    bottom: 0;
+    transform: translateY(-50%);
+    display: none;
+  }
+}
+
+.payPopup {
+  position: fixed;
+  left: 0;
+  top: 0;
+  bottom: 0;
+  right: 0;
+  z-index: 999;
+  background: rgba(0, 0, 0, 0.5);
+  display: none;
+
+  .payPopup_warp {
+    position: absolute;
+    left: 50%;
+    transform: translateX(-50%);
+    bottom: 0;
+    width: 100%;
+    min-height: px2rem(440);
+    background: #FFFFFF;
+    border-radius: px2rem(32) px2rem(32) 0px 0px;
+
+    // padding:0 px2rem(30);
+    .title {
+      font-family: PingFang SC, PingFang SC;
+      font-weight: 600;
+      font-size: px2rem(32);
+      color: #313131;
+      text-align: center;
+      font-style: normal;
+      text-transform: none;
+      margin-top: px2rem(24);
+    }
+
+    .buyAmount {
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      margin-top: px2rem(86);
+
+      .num {
+        font-family: PingFang SC, PingFang SC;
+        font-weight: 500;
+        font-size: px2rem(56);
+        color: #313131;
+        text-align: center;
+        font-style: normal;
+        text-transform: none;
+        margin-right: px2rem(8);
+      }
+
+      img {
+        width: px2rem(62);
+        height: px2rem(62);
+      }
+    }
+
+    .pay_btn {
+      background: linear-gradient(270deg, #E29030 0%, #FCC074 100%);
+      border-radius: px2rem(32);
+      font-family: PingFang TC, PingFang TC;
+      font-weight: 500;
+      font-size: px2rem(32);
+      color: #FFFFFF;
+      text-align: center;
+      font-style: normal;
+      text-transform: none;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      padding: px2rem(20) px2rem(200);
+      margin: px2rem(84) px2rem(30) 0;
+    }
+  }
+}
+
+// 自定义对话框样式
+.custom-dialog,.shop-dialog {
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background: rgba(0, 0, 0, 0.5);
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  z-index: 1000;
+  visibility: hidden;
+  opacity: 0;
+  transition: opacity 0.3s ease, visibility 0.3s ease;
+
+  &.visible {
+    visibility: visible;
+    opacity: 1;
+  }
+
+  .dialog-content {
+    background: #FFFFFF;
+    border-radius: px2rem(16);
+    width: px2rem(490);
+    // max-width: 90%;
+    padding: px2rem(24) px2rem(50);
+    box-shadow: 0 px2rem(8) px2rem(16) rgba(0, 0, 0, 0.2);
+    display: flex;
+    flex-direction: column;
+  }
+
+  .dialog-header {
+    // display: flex;
+    // justify-content: space-between;
+    // align-items: center;
+    margin-bottom: px2rem(16);
+    text-align: center;
+    margin-top: px2rem(20);
+    .dialog-title {
+      font-family: PingFang SC, PingFang SC;
+      font-weight: 400;
+      font-size: px2rem(28);
+      color: #313131;
+      font-style: normal;
+      text-transform: none;
+      line-height: px2rem(40);
+    }
+
+  }
+
+  .dialog-footer {
+    display: flex;
+    justify-content: space-between;
+    margin-top: px2rem(50);
+
+    .dialog-btn {
+      background: linear-gradient(270deg, #E29030 0%, #FCC074 100%);
+      border: none;
+      border-radius: px2rem(32);
+      font-family: PingFang SC, PingFang SC;
+      font-size: px2rem(32);
+      color: #FFFFFF;
+      text-align: center;
+      font-style: normal;
+      text-transform: none;
+      padding: px2rem(12) px2rem(40);
+      margin-left: px2rem(16);
+      cursor: pointer;
+      transition: background 0.3s ease;
+      width: px2rem(220);
+      &:hover {
+        background: linear-gradient(270deg, #FCC074 0%, #E29030 100%);
+      }
+    }
+
+    .dialog-cancel {
+      background: #E0E0E0;
+      color: #333333;
+
+      &:hover {
+        background: #BDBDBD;
+      }
+    }
+  }
+}

view/moliparty/modules/vip_Center/index.html

@@ -0,0 +1,130 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title class="VIP_Center"></title>
+    <link rel="stylesheet" href="../../common/css/reset.css" />
+    <link rel="stylesheet" href="../../common/css/animate.css" />
+    <link rel="stylesheet" href="./css/index.css?v=1.1" />
+    <link rel="stylesheet" href="./css/swiper-bundle.min.css" />
+  </head>
+
+  <body>
+    <!-- 頂部返回 -->
+    <div class="back">
+      <img src="./images/travel/back.png" alt="" />
+      <p class="titles VIP_Center">vip中心</p>
+    </div>
+    <div class="header">
+      <div class="swiper">
+        <div class="swiper-wrapper"></div>
+      </div>
+    </div>
+    <div class="content">
+      <div class="permission">
+        <div class="top">
+          <img src="./images/left.png" alt="" />
+          <p class="title_name Identification">Identification</p>
+          <img src="./images/right.png" alt="" />
+        </div>
+        <div class="box_warp">
+          <!-- <div class="content_box">
+            <img src="./images/vip1_headimg.png.png" alt="">
+            <p>Exclusive headwear</p>
+          </div> -->
+        </div>
+      </div>
+
+      <div class="exclusive_discounts">
+        <div class="top">
+          <img src="./images/left.png" alt="" />
+          <div class="title_name">
+           <span class="Exclusive_Privileges">Exclusive Privileges</span> 
+            <p class="num">19/19</p>
+          </div>
+          <img src="./images/right.png" alt="" />
+        </div>
+        <div class="box_warp"></div>
+      </div>
+    </div>
+
+    <!-- 弹窗 -->
+    <div class="selectAccount">
+      <div class="selectAccount_in">
+        <div class="name">
+         <span>Privileges</span> 
+          <img src="./images/travel/back.png" alt="" />
+        </div>
+        <div class="descPic">
+          <img src="" alt="" />
+        </div>
+        <div class="authIntro"></div>
+      </div>
+    </div>
+    <!-- 续费按钮 -->
+    <div class="bottom_renew">
+      <img src="./images/renew.png" alt="" class="renew_bg" />
+      <div class="wrap">
+        <div class="left">
+          <img src="./images/conis.png" alt="" />
+          <span class="buyAmount">buyAmount</span>
+        </div>
+        <div class="renew_btn Renew">Renew</div>
+      </div>
+      <div class="wrap_txt">VIP7 is only through activity</div>
+    </div>
+    <!-- 购买弹窗 -->
+    <div class="payPopup">
+      <div class="payPopup_warp">
+        <div class="title Pay">pay</div>
+        <div class="buyAmount">
+          <span class="num">35000</span>
+          <img src="./images/conis.png" alt="" />
+        </div>
+        <div class="pay_btn Confirm_Purchase">Confirm payment</div>
+      </div>
+    </div>
+    <!-- 自定义对话框 -->
+  <div class="custom-dialog">
+    <div class="dialog-content">
+      <div class="dialog-header">
+        <span class="dialog-title">Custom Dialog</span>
+      </div>
+      <div class="dialog-footer">
+        <button class="dialog-btn dialog-cancel Cancel">Cancel</button>
+        <button class="dialog-btn dialog-confirm Confirm">Confirm</button>
+      </div>
+    </div>
+  </div>
+
+  <!-- 自定义对话框 -->
+  <div class="shop-dialog">
+    <div class="dialog-content">
+      <div class="dialog-header">
+        <span class="dialog-title">Custom Dialog</span>
+      </div>
+      <div class="dialog-footer">
+        <button class="dialog-btn dialog-cancel Cancel">Cancel</button>
+        <button class="dialog-btn dialog-confirm Confirm">Confirm</button>
+      </div>
+    </div>
+  </div>
+
+  </body>
+</html>
+<script src="../../common/js/flexible.js"></script>
+<script src="../../common/js/jquery-3.2.1.min.js"></script>
+<script src="../../common/js/common2.js"></script>
+<script src="../../common/js/layer.js"></script>
+<script src="../../common/js/vconsole.min.js"></script>
+<script src="../../common/js/route-constant.js"></script>
+<script src="../../common/js/svga.min.js"></script>
+<script src="./local/en.js"></script>
+<script src="./local/zh.js"></script>
+<script src="./local/ar.js"></script>
+<script src="./local/tr.js"></script>
+<script src="../../common/local/langHandler.js"></script>
+<script src="../../common/js/svga.min.js"></script>
+<script src="./js/index.js?v=1.0"></script>
+<script src="./js/swiper-bundle.min.js"></script>

view/moliparty/modules/vip_Center/js/index.js

@@ -0,0 +1,372 @@
+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'
+  })
+}
+// 初始化函數
+$(function () {
+  getInfoFromClient();
+  fuzzyMatchUpdateQueryStringParameterFun(); // 判断语言
+  setTimeout(function () {
+    // 頁面全屏
+    if (browser.app) {
+      if (browser.android) {
+        window.androidJsObj.initShowNav(false)
+      } else {
+        window.webkit.messageHandlers.initShowNav.postMessage(0)
+      }
+    };
+    // 頂部返回事件
+    $('.back').click(() => {
+      if (browser.android) {
+        window.androidJsObj.closeWebView()
+      } else {
+        window.webkit.messageHandlers.closeWebView.postMessage(null)
+      }
+    })
+    fuzzyMatchUpdateQueryStringParameterFun(); // 判断语言
+    langReplace = window.lang.replace;
+    localLang = window.lang;
+    renderImgOption();
+    // swiperFun()
+    translateFun();
+  }, 100)
+
+})
+
+function translateFun() {
+  var langReplace = window.lang.replace;
+  var localLang = window.lang;
+  $('.Renew').html(langReplace(localLang.demoModule.Renew));
+  $('.Pay').html(langReplace(localLang.demoModule.Pay));
+  $('.Cancel').html(langReplace(localLang.demoModule.Cancel));
+  $('.Confirm').html(langReplace(localLang.demoModule.Confirm));
+  $('.Exclusive_Privileges').html(langReplace(localLang.demoModule.Exclusive_Privileges));
+  $('.Identification').html(langReplace(localLang.demoModule.Identification));
+  $('.Confirm_Purchase').html(langReplace(localLang.demoModule.Confirm_Purchase));
+  $('.VIP_Center').html(langReplace(localLang.demoModule.VIP_Center));
+}
+var vipInfos;
+var mySwiper;
+var vipAuthInfos;
+function renderImgOption() {
+  networkRequest({
+    type: 'get',
+    url: urlPrefix + '/vip/v2/getVipPageInfo',
+    success(res) {
+
+      if (res.code == 200) {
+        vipInfos = res.data.vipInfos
+        vipAuthInfos = res.data.vipAuthInfos
+        const swiperWrapper = $('.swiper-wrapper');
+        swiperWrapper.empty()
+
+        vipInfos.forEach((item, index) => {
+          if (item.remainSeconds) {
+            let now = new Date().getTime();
+            let date = new Date(now + item.remainSeconds * 1000); // 时间戳单位是秒，需要乘以1000转换为毫秒
+            dueDate = dateFormat(date, 'yyyy-MM-dd');
+          }
+          const slideHtml = `
+          <div class="swiper-slide">
+            <div class="img_card">
+              <img src="${vipOption[index].img}" alt="">
+              <img src="${item.vipIcon}" alt="" class="icon">
+              <div class="remainSeconds">
+                <p>${item.remainSeconds ? langReplace(localLang.demoModule.Due_on)+':'+ dueDate : langReplace(localLang.demoModule.Not_obtained)}</p>
+              </div>
+            </div>
+          </div>
+        `;
+          swiperWrapper.append(slideHtml);
+        });
+        // 重新初始化 Swiper
+        if (mySwiper) {
+          mySwiper.destroy();
+        }
+        renderPermission(0)
+        swiperFun();
+
+
+      }
+    },
+  })
+}
+// 禮物輪播
+function swiperFun() {
+  mySwiper = new Swiper('.swiper', {
+    slidesPerView: 'auto', // 自动计算每页显示的幻灯片数量
+    spaceBetween: -40, // 幻灯片之间的间距（负值表示重叠）
+    centeredSlides: true, // 中心化幻灯片
+    on: {
+      slideChange: function () {
+        const activeSlide = this.activeIndex;
+        // const activeSlideObj = vipInfos[activeSlide]
+        console.log(activeSlide, '-------')
+        renderPermission(activeSlide)
+      }
+    }
+  })
+  // 跳转最高vip等级
+  const vip = vipInfos.map((item, index) => ({ item, index }))
+    .filter(({ item }) => item.remainSeconds)
+    .map(({ index }) => index);
+  mySwiper.slideTo(vip[vip.length - 1], 1000);
+  $('.renew_btn').attr('vipLevelTop', vip[vip.length - 1] || 0)
+}
+function renderPermission(actIndex) {
+  // 权益渲染
+  $('.permission .box_warp').empty()
+  vipIdentification[actIndex].forEach((item, index) => {
+    var str = `
+    <div class="content_box">
+      <img src="${item.img}" alt="">
+      <p>${langReplace(localLang.demoModule[item.name])}</p>
+    </div>
+    `
+    $('.permission .box_warp').append(str);
+  })
+  // 专有权列表渲染
+  // $('.exclusive_discounts .title_name .num').text(`(${vipInfos[actIndex].ownAuthTypes.length}/${vipAuthInfos.length})`)
+
+  $('.exclusive_discounts .box_warp').empty()
+  let actIndexNum = vipAuthInfos.length
+  vipAuthInfos.forEach((item, index) => {
+    var str = `
+    <div class="content_box" obj='${JSON.stringify(item)}'>
+      <img src="${item.authIcon}" alt="">
+      <p class="name">${item.authName}</p>
+    </div>
+    `
+    var $contentBox = $(str);
+    if (!vipInfos[actIndex].ownAuthTypes.includes(item.authType)) {
+      $contentBox.addClass('noactive')
+      actIndexNum -= 1;
+    }
+  $('.exclusive_discounts .title_name .num').text(`(${actIndexNum}/${vipAuthInfos.length})`)
+
+    $('.exclusive_discounts .box_warp').append($contentBox);
+  })
+  // 购买弹窗
+  if (vipInfos[actIndex].buyAmount != 0) {
+    $('.payPopup .payPopup_warp .buyAmount .num').text(vipInfos[actIndex].buyAmount)
+    $('.bottom_renew .wrap .left .buyAmount').text(`${vipInfos[actIndex].buyAmount} / 30${langReplace(localLang.demoModule.Days)}`)
+    $('.payPopup .payPopup_warp .pay_btn').attr('vipLevel', vipInfos[actIndex].vipLevel)
+    $('.bottom_renew .wrap').show()
+    $('.bottom_renew .wrap_txt').hide()
+  } else {
+    $('.bottom_renew .wrap_txt').text(`${vipInfos[actIndex].vipName} ${langReplace(localLang.demoModule.is_activity)}`)
+    $('.bottom_renew .wrap').hide()
+    $('.bottom_renew .wrap_txt').show()
+  }
+  $('.renew_btn').attr('vipLevel',actIndex)
+}
+// 点击购买
+$('.payPopup .payPopup_warp .pay_btn').click(function () {
+  let vipLevel = $(this).attr('vipLevel')
+  showLoading();
+  networkRequest({
+    type: "post",
+    url: urlPrefix + "/vip/openWithDiamond",
+    data: {
+      roomUid:pubInfo.uid,
+      // roomUid:3203,
+      vipLevel
+    },
+    success: function (res) {
+      $('.payPopup').hide()
+      if (res.code == 200) {
+        renderImgOption()
+      } else {
+        // toastMsg(res.message);
+        $('.custom-dialog .dialog-content .dialog-title').text(res.message)
+        $('.custom-dialog').addClass('visible');
+      }
+      hideLoading(layerIndex);
+    },
+    error: function (res) {
+      hideLoading(layerIndex);
+    },
+  });
+})
+ // 点击对话框外部关闭对话框
+ $('.custom-dialog').on('click', function (event) {
+  if ($(event.target).is('.custom-dialog')) {
+    $('.custom-dialog').removeClass('visible');
+  }
+});
+ // 确认按钮的触发事件
+ $('.custom-dialog .dialog-confirm').on('click', function () {
+  // 执行确认操作
+  $('.custom-dialog').removeClass('visible');
+  if(browser.app){
+    if(browser.android){
+        // window.androidJsObj.openChargePage()
+        tools.nativeUtils.jumpAppointPage('RECHARGE_PAGE')
+    }else if(browser.ios){
+        window.webkit.messageHandlers.openChargePage.postMessage(null)
+    }
+}else{
+    toastMsg('请在app内打开')
+}
+});
+// 取消按钮的触发事件
+$('.custom-dialog .dialog-cancel').on('click', function () {
+  // 执行确认操作
+  $('.custom-dialog').removeClass('visible');
+});
+
+// 点击详情弹窗
+$('.exclusive_discounts .box_warp').on('click', '.content_box', function () {
+  let obj = JSON.parse($(this).attr("obj"))
+  $('.selectAccount .selectAccount_in .descPic img').attr('src', obj.descPic)
+  $('.selectAccount .selectAccount_in .authIntro').text(obj.authIntro)
+  $('.selectAccount .selectAccount_in .name span').text(obj.authName)
+  $('.selectAccount').show()
+})
+// 关闭详情弹窗
+$('.selectAccount').click(function () {
+  $('.selectAccount').hide()
+})
+$('.selectAccount .selectAccount_in .name img').click(function () {
+  $('.selectAccount').hide()
+})
+// 购买弹窗
+$('.bottom_renew .wrap .renew_btn').on('click', function () {
+  let viplevelIndex = $(this).attr('viplevel');
+  let vipleveltopIndex = $(this).attr('vipleveltop');
+  if(vipleveltopIndex == 0){
+    $('.payPopup').show()
+    return
+  }
+  // 购买等级大于自身等级
+  if(vipInfos[viplevelIndex].vipLevel > vipInfos[vipleveltopIndex].vipLevel){
+    $('.shop-dialog .dialog-content .dialog-title').text(`${langReplace(localLang.demoModule.You_currently(vipInfos[vipleveltopIndex].vipName,vipInfos[viplevelIndex].vipName))}`)
+        $('.shop-dialog').addClass('visible');
+  }else{
+  $('.payPopup').show()
+  }
+})
+ // 确认按钮的触发事件
+ $('.shop-dialog .dialog-confirm').on('click', function () {
+  // 执行确认操作
+  $('.shop-dialog').removeClass('visible');
+  $('.payPopup').show()
+});
+// 取消按钮的触发事件
+$('.shop-dialog .dialog-cancel').on('click', function () {
+  // 执行确认操作
+  $('.shop-dialog').removeClass('visible');
+});
+
+$('.payPopup').click(function () {
+  $('.payPopup').hide()
+})
+$('.payPopup .payPopup_warp').on('click', function () {
+  return false;
+})
+// 
+$('.selectAccount .selectAccount_in').on('click', function () {
+  return false;
+})
+var vipOption = [
+  { img: './images/vip1_bg.png' },
+  { img: './images/vip2_bg.png' },
+  { img: './images/vip3_bg.png' },
+  { img: './images/vip4_bg.png' },
+  { img: './images/vip5_bg.png' },
+  { img: './images/vip6_bg.png' },
+  { img: './images/vip7_bg.png' },
+  { img: './images/vip8_bg.png' },
+  { img: './images/vip9_bg.png' },
+]
+
+var vipIdentification = [
+  [
+    { img: './images/vip1_headimg.png', name: 'Only_Headdress' },
+    { img: './images/vip1_identity.png', name: 'Only_Nameplate' },
+  ],
+  [
+    { img: './images/vip2_headimg.png', name: 'Only_Headdress' },
+    { img: './images/vip2_identity.png', name: 'Only_Nameplate' },
+    { img: './images/vip2_card.png', name: 'Room_Card' },
+  ],
+  [
+    { img: './images/vip3_headimg.png', name: 'Only_Headdress' },
+    { img: './images/vip3_identity.png', name: 'Only_Nameplate' },
+    { img: './images/vip3_card.png', name: 'Room_Card' },
+    { img: './images/vip3_txk.png', name: 'Mic_Effect' },
+  ],
+  [
+    { img: './images/vip4_headimg.png', name: 'Only_Headdress' },
+    { img: './images/vip4_identity.png', name: 'Only_Nameplate' },
+    { img: './images/vip4_card.png', name: 'Room_Card' },
+    { img: './images/vip4_txk.png', name: 'Mic_Effect' },
+    { img: './images/vip4_qp.png', name: 'Bubble_Effect' },
+  ],
+  [
+    { img: './images/vip5_headimg.png', name: 'Only_Headdress' },
+    { img: './images/vip5_identity.png', name: 'Only_Nameplate' },
+    { img: './images/vip5_card.png', name: 'Room_Card' },
+    { img: './images/vip5_txk.png', name: 'Mic_Effect' },
+    { img: './images/vip5_qp.png', name: 'Bubble_Effect' },
+    { img: './images/vip5_jctx.png', name: 'Entry_Animation' },
+  ],
+  [
+    { img: './images/vip6_headimg.png', name: 'Only_Headdress' },
+    { img: './images/vip6_identity.png', name: 'Only_Nameplate' },
+    { img: './images/vip6_card.png', name: 'Room_Card' },
+    { img: './images/vip6_txk.png', name: 'Mic_Effect' },
+    { img: './images/vip6_qp.png', name: 'Bubble_Effect' },
+    { img: './images/vip6_jctx.png', name: 'Entry_Animation' },
+  ],
+  [
+    { img: './images/vip7_headimg.png', name: 'Only_Headdress' },
+    { img: './images/vip7_identity.png', name: 'Only_Nameplate' },
+    { img: './images/vip7_card.png', name: 'Room_Card' },
+    { img: './images/vip7_txk.png', name: 'Mic_Effect' },
+    { img: './images/vip7_qp.png', name: 'Bubble_Effect' },
+    { img: './images/vip7_jctx.png', name: 'Entry_Animation' },
+  ],
+  [
+    { img: './images/vip8_headimg.png', name: 'Only_Headdress' },
+    { img: './images/vip8_identity.png', name: 'Only_Nameplate' },
+    { img: './images/vip8_card.png', name: 'Room_Card' },
+    { img: './images/vip8_txk.png', name: 'Mic_Effect' },
+    { img: './images/vip8_qp.png', name: 'Bubble_Effect' },
+    { img: './images/vip8_jctx.png', name: 'Entry_Animation' },
+  ],
+  [
+    { img: './images/vip9_headimg.png', name: 'Only_Headdress' },
+    { img: './images/vip9_identity.png', name: 'Only_Nameplate' },
+    { img: './images/vip9_card.png', name: 'Room_Card' },
+    { img: './images/vip9_txk.png', name: 'Mic_Effect' },
+    { img: './images/vip9_qp.png', name: 'Bubble_Effect' },
+    { img: './images/vip9_jctx.png', name: 'Entry_Animation' },
+  ],
+]

view/moliparty/modules/vip_Center/local/ar.js

@@ -0,0 +1,29 @@
+// 阿拉伯
+langAr = {
+    // 模块
+    demoModule: {
+        Only_Headdress:'اطار',
+        Only_Nameplate:'اشارة',
+        Room_Card:'بطاقة الغرفة',
+        Mic_Effect:'تأثير الميكروفون',
+        Bubble_Effect:'تأثير النفطة',
+        Entry_Animation:'دخولية متحركة ',
+        Renew:'تجديد',
+        Pay:'الدفع',
+        Cancel:'إلغاء',
+        Confirm:'تأكيد',
+        Exclusive_Privileges:'امتيازات حصرية',
+        Identification:'التعريف',
+        Not_obtained:'لم يتم الحصول على VIP',
+        Due_on:'مستحق على',
+        is_activity:'فقط من خلال النشاط',
+        You_currently:function(num1,num2){
+            return `أنت حاليًا عضو ${num1}، هل أنت متأكد من رغبتك في شراء عضوية ${num2} بمستوى أعلى؟`
+        },
+        Confirm_Purchase:'تأكيد الشراء',
+        VIP_Center:'مركز كبار الشخصيات',
+        Days:'أيام',
+
+    }
+
+}

view/moliparty/modules/vip_Center/local/en.js

@@ -0,0 +1,26 @@
+langEn = {
+    demoModule: {
+        Only_Headdress:'Only Headdress',
+        Only_Nameplate:'Only Nameplate',
+        Room_Card:'Room Card',
+        Mic_Effect:'Mic Effect',
+        Bubble_Effect:'Bubble Effect',
+        Entry_Animation:'Entry Animation',
+        Renew:'Renew',
+        Pay:'Pay',
+        Cancel:'Cancel',
+        Confirm:'Confirm',
+        Exclusive_Privileges:' Exclusive Privileges',
+        Identification:'Identification',
+        Not_obtained:'Not obtained VIP',
+        Due_on:'Due on',
+        is_activity:'is only through activity',
+        You_currently:function(num1,num2){
+            return `You are currently ${num1}, are you sure you want to purchase a higher level ${num2}?`
+        },
+        Confirm_Purchase:'Confirm Purchase',
+        VIP_Center:'VIP Center',
+        Days:'Days',
+
+    },
+}

view/moliparty/modules/vip_Center/local/tr.js

@@ -0,0 +1,27 @@
+langTr = {
+    demoModule: { 
+        Only_Headdress:'Yalnızca Başlık',
+        Only_Nameplate:'Yalnızca İsim Plakası',
+        Room_Card:'Oda Kartı',
+        Mic_Effect:'Mikrofon Efekti',
+        Bubble_Effect:'Baloncuk Efekti',
+        Entry_Animation:'Giriş Animasyonu',
+        Renew:'Yenile',
+        Pay:'Öde',
+        Cancel:'İptal',
+        Confirm:'Onayla',
+        Exclusive_Privileges:'Özel Ayrıcalıklar',
+        Identification:'Kimlik',
+        Not_obtained:'alınmadı',
+        Due_on:'Sona Erme Tarihi',
+        is_activity:'yalnızca etkinlik yoluyla',
+        You_currently:function(num1,num2){
+            return `Şu anda ${num1}'siniz, daha yüksek seviyede bir ${num2} satın almak istediğinizden emin misiniz?`
+        },
+        Confirm_Purchase:'Satın Alımı Onayla',
+        VIP_Center:'VIP Merkezi',
+        Days:'Günler',
+
+    }
+
+}

view/moliparty/modules/vip_Center/local/zh.js

@@ -0,0 +1,28 @@
+// 中文
+langZh = {
+    // 模塊
+    demoModule: {
+        Only_Headdress:'頭飾',
+        Only_Nameplate:'銘牌',
+        Room_Card:'資料卡',
+        Mic_Effect:'光圈',
+        Bubble_Effect:'氣泡',
+        Entry_Animation:'進場動效',
+        Renew:'更新',
+        Pay:'支付',
+        Cancel:'取消',
+        Confirm:'確認',
+        Exclusive_Privileges:'專屬優惠',
+        Identification:'權限',
+        Not_obtained:'未取得 VIP',
+        Due_on:'到期日',
+        is_activity:'僅透過活動獲得',
+        You_currently:function(num1,num2){
+            return `您目前是${num1},確定購買更高的等級${num2}嗎？`
+        },
+        Confirm_Purchase:'確認購買',
+        VIP_Center:'VIP中心',
+        Days:'天數',
+    }
+
+}