Browse Source

Merge branch 'master' of http://svn.ouj.com:3000/kangheitan/migrate-webgame-vue

wukunlin 5 years ago
parent
commit
cab63140b2
31 changed files with 81 additions and 26 deletions
  1. 0 0
      app/src/components/boutiqueGame/img/type_bg.png
  2. 1 1
      app/src/components/boutiqueGame/style.scss
  3. BIN
      app/src/components/boutiqueGameSwiper/img/swiper_next_active.png
  4. BIN
      app/src/components/boutiqueGameSwiper/img/swiper_prev_active.png
  5. 6 0
      app/src/components/boutiqueGameSwiper/index.vue
  6. 9 1
      app/src/components/boutiqueGameSwiper/item.vue
  7. 0 0
      app/src/components/gameListPop/img/icon_serve.png
  8. 1 1
      app/src/components/gameListPop/style.scss
  9. BIN
      app/src/components/hotGameToday/img/choice_server_active.png
  10. 22 5
      app/src/components/hotGameToday/item.vue
  11. 0 0
      app/src/components/networkMonitoring/img/icon_nail.png
  12. 1 1
      app/src/components/networkMonitoring/style.scss
  13. 3 0
      app/src/page/popup/hallNews.vue
  14. BIN
      app/src/page/popup/img/icon_pagination_first_active.png
  15. BIN
      app/src/page/popup/img/icon_pagination_last_active.png
  16. BIN
      app/src/page/popup/img/icon_pagination_next_active.png
  17. BIN
      app/src/page/popup/img/icon_pagination_prev_active.png
  18. 22 7
      app/src/page/popup/pay.vue
  19. 0 0
      app/src/page/self/img/icon_activity.png
  20. 0 0
      app/src/page/self/img/icon_add.png
  21. 0 0
      app/src/page/self/img/icon_cancel_top.png
  22. 0 0
      app/src/page/self/img/icon_close.png
  23. 0 0
      app/src/page/self/img/icon_edit.png
  24. 0 0
      app/src/page/self/img/icon_edit_b.png
  25. 0 0
      app/src/page/self/img/icon_game.png
  26. 0 0
      app/src/page/self/img/icon_notice.png
  27. 0 0
      app/src/page/self/img/icon_serve.png
  28. 0 0
      app/src/page/self/img/icon_top.png
  29. 0 0
      app/src/page/self/img/my_game_type.png
  30. 10 10
      app/src/page/self/style.scss
  31. 6 0
      app/src/style/module/_popup.scss

+ 0 - 0
app/src/components/boutiqueGame/img/type-bg.png → app/src/components/boutiqueGame/img/type_bg.png


+ 1 - 1
app/src/components/boutiqueGame/style.scss

@@ -61,7 +61,7 @@
         height: 30px;
         line-height: 30px;
         text-align: center;
-        background: url(./img/type-bg.png) no-repeat center 0/100%;
+        background: url(./img/type_bg.png) no-repeat center 0/100%;
         font-size: 14px;
         color: $note-text-color;
         margin-right: 14px;

BIN
app/src/components/boutiqueGameSwiper/img/swiper_next_active.png


BIN
app/src/components/boutiqueGameSwiper/img/swiper_prev_active.png


+ 6 - 0
app/src/components/boutiqueGameSwiper/index.vue

@@ -89,10 +89,16 @@ export default {
   .el-carousel__arrow--left {
     border-radius: 0;
     background: url(./img/swiper_prev.png) no-repeat;
+    &:hover,&:active{
+      background-image: url(./img/swiper_prev_active.png);
+    }
   }
   .el-carousel__arrow--right {
     border-radius: 0;
     background: url(./img/swiper_next.png) no-repeat;
+    &:hover,&:active{
+      background-image: url(./img/swiper_next_active.png);
+    }
   }
 
   .num {

+ 9 - 1
app/src/components/boutiqueGameSwiper/item.vue

@@ -35,7 +35,7 @@ export default {
   width: 300px;
   height: 300px;
   border-radius: 5px;
-  box-shadow: 11px 11px 18px rgba(0, 0, 0, .34);
+  box-shadow: 11px 11px 18px rgba(0, 0, 0, 0.34);
 }
 .cover {
   display: block;
@@ -75,6 +75,10 @@ export default {
   text-align: center;
   color: #fff;
   cursor: pointer;
+  &:hover,
+  &:active {
+    background-color: #c33333;
+  }
 }
 .choice-server {
   display: inline-block;
@@ -83,5 +87,9 @@ export default {
   border-left: 1px solid #f18282;
   background: url(./img/choice_server.png) no-repeat center;
   cursor: pointer;
+  &:hover,
+  &:active {
+    background-color: #c33333;
+  }
 }
 </style>

+ 0 - 0
app/src/components/gameListPop/img/icon-serve.png → app/src/components/gameListPop/img/icon_serve.png


+ 1 - 1
app/src/components/gameListPop/style.scss

@@ -96,7 +96,7 @@
                         display: inline-block;
                         width: 13px;
                         height: 13px;
-                        background: url(./img/icon-serve.png) no-repeat
+                        background: url(./img/icon_serve.png) no-repeat
                             center/100%;
                     }
                     &:hover {

BIN
app/src/components/hotGameToday/img/choice_server_active.png


+ 22 - 5
app/src/components/hotGameToday/item.vue

@@ -77,30 +77,47 @@ export default {
   }
 }
 .ft {
-  height: 32px;
+  height: 34px;
   margin-top: 14px;
-  border: 1px solid $border-color;
-  border-radius: 5px;
   overflow: hidden;
 }
 .enter {
   display: inline-block;
   width: 178px;
-  height: 100%;
+  height: 32px;
   vertical-align: top;
   font-size: 14px;
   line-height: 32px;
   text-align: center;
   color: $main-active-color;
+  border: 1px solid $border-color;
+  border-top-left-radius: 5px;
+  border-bottom-left-radius: 5px;
   cursor: pointer;
+  &:hover,
+  &:active {
+    border-color: $main-active-color;
+    background-color: $main-active-color;
+    color: #fff;
+  }
 }
 .choice-server {
   display: inline-block;
   width: 34px;
-  height: 100%;
+  height: 32px;
   border-left: 1px solid $border-color;
   background: url(./img/choice_server.png) no-repeat center;
+  border: 1px solid $border-color;
+  border-left: none;
+  border-top-right-radius: 5px;
+  border-bottom-right-radius: 5px;
   cursor: pointer;
+  &:hover,
+  &:active {
+    border-color: $main-active-color;
+    background-color: $main-active-color;
+    background-image: url(./img/choice_server_active.png);
+  }
 }
 </style>
 

+ 0 - 0
app/src/components/networkMonitoring/img/icon-nail.png → app/src/components/networkMonitoring/img/icon_nail.png


+ 1 - 1
app/src/components/networkMonitoring/style.scss

@@ -5,7 +5,7 @@
         position: absolute;
         right: -168px;
         top: 15px;
-        background: url(./img/icon-nail.png);
+        background: url(./img/icon_nail.png);
         .title {
             text-align: center;
             font-size: 14px;

+ 3 - 0
app/src/page/popup/hallNews.vue

@@ -318,6 +318,9 @@ export default {
       vertical-align: middle;
       margin-top: -0.22em;
       cursor: pointer;
+      &:hover,&:active{
+        background-image: url(./img/icon_pagination_#{$icon}_active.png);
+      }
     }
   }
 

BIN
app/src/page/popup/img/icon_pagination_first_active.png


BIN
app/src/page/popup/img/icon_pagination_last_active.png


BIN
app/src/page/popup/img/icon_pagination_next_active.png


BIN
app/src/page/popup/img/icon_pagination_prev_active.png


+ 22 - 7
app/src/page/popup/pay.vue

@@ -158,13 +158,8 @@
       <div class="f-row">
         <label>充值金额:</label>
         <div class="f-radio-wrap">
-          <button class="f-radio checked">50元</button>
-          <button class="f-radio">100元</button>
-          <button class="f-radio">300元</button>
-          <button class="f-radio">500元</button>
-          <button class="f-radio">1000元</button>
-          <button class="f-radio">5000元</button>
-          <p><input type="text" placeholder="其它金额"> 元 <span>(10-200000之间整数)</span></p>
+          <button :class="['f-radio',{'checked':amountsIndex==index}]" v-for="(item,index) in amounts" :key="index" @click="chooseAmount(index)">{{item}}元</button>
+          <p><input type="text" placeholder="其它金额" v-model="amountInput" @input="inputAmount"> 元 <span>(10-200000之间整数)</span></p>
         </div>
       </div>
       <div class="f-row ext-text">
@@ -212,15 +207,35 @@ export default {
   name: "pay",
   data(){
     return {
+      amounts: [50,100,300,500,1000,5000],//充值金额
+      amountsIndex: 0,//当前选中金额
+      amountInput:'',//填写金额
       gameSelect:[false,false,false] //游戏/区服/角色下拉框
     }
   },
   methods:{
+    //select切换
     toggleSelect(index){
       for(let i=0;i<3;i++){
         if(i==index) this.$set(this.gameSelect,i,!this.gameSelect[i])
         else this.$set(this.gameSelect,i,false)
       }
+      this.calculateMoney()
+    },
+    //选择金额
+    chooseAmount(index){
+      this.amountsIndex = index
+      this.amountInput = ''
+      this.calculateMoney()
+    },
+    //填入金额
+    inputAmount(){
+      this.amountsIndex = this.amountInput=='' ? 0 : 999
+
+      this.calculateMoney()
+    },
+    calculateMoney(){
+
     }
   },
   mounted(){

+ 0 - 0
app/src/page/self/img/icon-activity.png → app/src/page/self/img/icon_activity.png


+ 0 - 0
app/src/page/self/img/icon-add.png → app/src/page/self/img/icon_add.png


+ 0 - 0
app/src/page/self/img/icon-cancel-top.png → app/src/page/self/img/icon_cancel_top.png


+ 0 - 0
app/src/page/self/img/icon-close.png → app/src/page/self/img/icon_close.png


+ 0 - 0
app/src/page/self/img/icon-edit.png → app/src/page/self/img/icon_edit.png


+ 0 - 0
app/src/page/self/img/icon-edit_b.png → app/src/page/self/img/icon_edit_b.png


+ 0 - 0
app/src/page/self/img/icon-game.png → app/src/page/self/img/icon_game.png


+ 0 - 0
app/src/page/self/img/icon-notice.png → app/src/page/self/img/icon_notice.png


+ 0 - 0
app/src/page/self/img/icon-serve.png → app/src/page/self/img/icon_serve.png


+ 0 - 0
app/src/page/self/img/icon-top.png → app/src/page/self/img/icon_top.png


+ 0 - 0
app/src/page/self/img/my-game-type.png → app/src/page/self/img/my_game_type.png


+ 10 - 10
app/src/page/self/style.scss

@@ -29,12 +29,12 @@
             display: inline-block;
             width: 14px;
             height: 13px;
-            background: url('./img/icon-edit.png') no-repeat center/ 100%;
+            background: url('./img/icon_edit.png') no-repeat center/ 100%;
         }
         .editing {
             color: $main-active-color;
             .icon {
-                background: url('./img/icon-edit_b.png') no-repeat center/ 100%;
+                background: url('./img/icon_edit_b.png') no-repeat center/ 100%;
             }
         }
     }
@@ -66,7 +66,7 @@
                 top: 0;
                 bottom: 0;
                 margin: auto auto;
-                background: url('./img/icon-add.png') no-repeat center/100%;
+                background: url('./img/icon_add.png') no-repeat center/100%;
             }
         }
         div {
@@ -83,7 +83,7 @@
     .delete-game {
         width: 15px;
         height: 15px;
-        background: url('./img/icon-close.png') no-repeat center/ 100%;
+        background: url('./img/icon_close.png') no-repeat center/ 100%;
         position: absolute;
         right: -6px;
         top: -5px;
@@ -122,7 +122,7 @@
             width: 28px;
             height: 20px;
             line-height: 15px;
-            background: url('./img/my-game-type.png') no-repeat center/100%;
+            background: url('./img/my_game_type.png') no-repeat center/100%;
             position: absolute;
             right: -5px;
             top: 0;
@@ -131,7 +131,7 @@
         .to-top {
             width: 19px;
             height: 19px;
-            background: url(./img/icon-top.png) no-repeat center/100%;
+            background: url(./img/icon_top.png) no-repeat center/100%;
             position: absolute;
             left: 3px;
             bottom: 2px;
@@ -160,7 +160,7 @@
         display: inline-block;
         width: 11px;
         height: 8px;
-        background: url('./img/icon-serve.png') no-repeat center / 100%;
+        background: url('./img/icon_serve.png') no-repeat center / 100%;
     }
     .may-like {
         margin-top: 28px;
@@ -193,7 +193,7 @@
             display: inline-block;
             width: 13px;
             height: 12px;
-            background: url('./img/icon-activity.png') no-repeat center/100%;
+            background: url('./img/icon_activity.png') no-repeat center/100%;
         }
     }
     .content {
@@ -206,7 +206,7 @@
             background: #a4c8ff;
             i {
                 width: 15px;
-                background: url('./img/icon-game.png') no-repeat center/100%;
+                background: url('./img/icon_game.png') no-repeat center/100%;
             }
         }
         .content {
@@ -249,7 +249,7 @@
             i {
                 width: 14px;
                 height: 14px;
-                background: url('./img/icon-notice.png') no-repeat center/100%;
+                background: url('./img/icon_notice.png') no-repeat center/100%;
             }
         }
         .content {

+ 6 - 0
app/src/style/module/_popup.scss

@@ -10,6 +10,12 @@
     line-height: 26px;
     text-align: center;
     overflow: hidden;
+
+    &:active,
+    &:hover {
+        background-color: $main-active-color;
+        color: $main-active-color;
+    }
 }
 
 .pay-confirm-btn {