静态页面

src/components/index/LanQiuDanGuanDaXiaoFen/page.scss

         > div {
           position: relative;
           overflow: hidden;
-          margin-left: 0.2rem;
+          // margin-left: 0.2rem;
           > div {
             width: 100%;
             position: relative;

src/components/index/LanQiuDanGuanRangFenShengFu/page.scss

         > div {
           position: relative;
           overflow: hidden;
-          margin-left: 0.2rem;
+          // margin-left: 0.2rem;
           > div {
             width: 100%;
             position: relative;

src/components/index/LanQiuDanGuanShengFenCha/index.vue

           <span>{{item.leagueName}}<em>{{item.matchTime}}(截)</em></span>
         </div>
         <div class="Detail flex-h">
-          <span>{{item.awayTeamId}}</span>
+          <!-- <span>{{item.awayTeamId}}</span> -->
           <div class="flex-item flex-h">
             <div class="flex-item">
               <div @click="SelectPoints(item, index)">

src/components/index/LanQiuDanGuanShengFenCha/page.scss

         > div {
           position: relative;
           overflow: hidden;
-          margin-left: 0.2rem;
+          // margin-left: 0.2rem;
           > div {
             width: 100%;
             position: relative;
             > div {
               font-size: 0;
               text-align: center;
+              background: #f2f2f2;
+              border-radius: 0.06rem;
               > * {
                 display: inline-block;
                 vertical-align: middle;
                 }
               }
               > a {
-                font-size: 0.12rem;
-                line-height: 0.2rem;
-                padding: 0 0.1rem;
-                border: 0.01rem solid #ccc;
+                font-size: 0.16rem;
+                line-height: 0.42rem;
+                display: block;
+                color: #FF5200;
               }
               > span {
                 font-size: 0.12rem;

src/components/index/LanQiuGuoGuanDaXiaoFen/page.scss

         > div {
           position: relative;
           overflow: hidden;
-          margin-left: 0.2rem;
+          // margin-left: 0.2rem;
           > div {
             width: 100%;
             position: relative;

src/components/index/LanQiuGuoGuanRangFenShengFu/page.scss

         > div {
           position: relative;
           overflow: hidden;
-          margin-left: 0.2rem;
+          // margin-left: 0.2rem;
           > div {
             width: 100%;
             position: relative;

src/components/index/LanQiuGuoGuanShengFenCha/page.scss

             > div {
               font-size: 0;
               text-align: center;
+              background: #f2f2f2;
+              border-radius: 0.06rem;
               > * {
                 display: inline-block;
                 vertical-align: middle;
                 }
               }
               > a {
-                font-size: 0.12rem;
-                line-height: 0.2rem;
-                padding: 0 0.1rem;
-                border: 0.01rem solid #ccc;
+                font-size: 0.16rem;
+                line-height: 0.42rem;
+                display: block;
+                color: #FF5200;
               }
               > span {
                 font-size: 0.12rem;

src/components/index/LqgghhtzDaXiaoFenItem/index.vue

     <span>{{ListId}}</span>
     <div class="flex-item flex-h">
       <div class="flex-item flex-h">
-        <a class="flex-item" v-for="(item, index) in PageScoreData" :key="index" :class="{'active': item.Active}" @click="SelectItem(item, index, 'bst-score')">
-          <span>{{item.name}}</span>
-          <span>{{item.odds}}</span>
-        </a>
+        <a class="flex-item" v-for="(item, index) in PageScoreData" :key="index" :class="{'active': item.Active}" @click="SelectItem(item, index, 'bst-score')">{{item.name}} {{item.odds}}</a>
       </div>
     </div>
   </div>

src/components/index/LqgghhtzDaXiaoFenItem/page.scss

   > span {
     font-size: 0.1rem;
     color: #999;
-    margin-right: 0.4rem;
+    margin-right: 0.2rem;
   }
   > div.flex-item {
     align-items: center;
         border: 0.01rem solid #999;
         box-sizing: border-box;
         margin-right: 0.05rem;
-        > span {
-          display: block;
-          font-size: 0.13rem;
-          line-height: 0.22rem;
-          text-align: center;
-        }
+        font-size: 0.13rem;
+        line-height: 0.22rem;
+        text-align: center;
         &.active {
+          color: #fff;
           background: #ff5100;
           border-color: #ff5100;
-          > span {
-            color: #fff;
-          }
         }
       }
     }

src/components/index/LqgghhtzRangFenShengFu/index.vue

     <span>{{ListId}}</span>
     <div class="flex-item flex-h">
       <div class="flex-item flex-h">
-        <a class="flex-item" v-for="(item, index) in PageWlsData" :key="index" :class="{'active': item.Active}" @click="SelectItem(item, index, 'bst-wls')">
-          <span>{{item.name}}</span>
-          <span>{{item.odds}}</span>
-        </a>
+        <a class="flex-item" v-for="(item, index) in PageWlsData" :key="index" :class="{'active': item.Active}" @click="SelectItem(item, index, 'bst-wls')">{{item.name}} {{item.odds}}</a>
       </div>
     </div>
   </div>

src/components/index/LqgghhtzRangFenShengFu/page.scss

   > span {
     font-size: 0.1rem;
     color: #999;
-    margin-right: 0.4rem;
+    margin-right: 0.2rem;
   }
   > div.flex-item {
     align-items: center;
         border: 0.01rem solid #999;
         box-sizing: border-box;
         margin-right: 0.05rem;
-        > span {
-          display: block;
-          font-size: 0.13rem;
-          line-height: 0.22rem;
-          text-align: center;
-        }
+        font-size: 0.13rem;
+        line-height: 0.22rem;
+        text-align: center;
         &.active {
+          color: #fff;
           background: #ff5100;
           border-color: #ff5100;
-          > span {
-            color: #fff;
-          }
         }
       }
     }

src/components/index/LqgghhtzShengFuItem/index.vue

     <span>{{ListId}}</span>
     <div class="flex-item flex-h">
       <div class="flex-item flex-h">
-        <a class="flex-item" v-for="(item, index) in PageWlData" :key="index" :class="{'active': item.Active}" @click="SelectItem(item, index, 'bst-wl')">
-          <span>{{item.name}}</span>
-          <span>{{item.odds}}</span>
-        </a>
+        <a class="flex-item" v-for="(item, index) in PageWlData" :key="index" :class="{'active': item.Active}" @click="SelectItem(item, index, 'bst-wl')">{{item.name}} {{item.odds}}</a>
       </div>
     </div>
   </div>

src/components/index/LqgghhtzShengFuItem/page.scss

   > span {
     font-size: 0.1rem;
     color: #999;
-    margin-right: 0.4rem;
+    margin-right: 0.2rem;
   }
   > div.flex-item {
     align-items: center;
         border: 0.01rem solid #999;
         box-sizing: border-box;
         margin-right: 0.05rem;
-        > span {
-          display: block;
-          font-size: 0.13rem;
-          line-height: 0.22rem;
-          text-align: center;
-        }
+        font-size: 0.13rem;
+        line-height: 0.22rem;
+        text-align: center;
         &.active {
+          color: #fff;
           background: #ff5100;
           border-color: #ff5100;
-          > span {
-            color: #fff;
-          }
         }
       }
     }

src/components/index/ZqdghhtzShengPingFu/index.vue

 <template>
   <div class="components ZqdghhtzShengPingFu flex-h">
-    <span>{{ListId}}</span>
+    <!-- <span>{{ListId}}</span> -->
     <div class="flex-item flex-h">
       <div class="flex-item">
         <div class="flex-h">
           <a class="flex-item" v-for="(item, index) in PageWdlData" :key="index" :class="{'active': item.Active}" @click="SelectItem(item, index, 'ft-wdl')">{{`${item.name} ${item.odds}`}}</a>
         </div>
+        <span>未开售</span>
       </div>
     </div>
   </div>

src/components/index/ZqdghhtzShengPingFu/page.scss

 .components.ZqdghhtzShengPingFu {
   align-items: center;
   margin-top: 0.05rem;
-  > span {
-    font-size: 0.1rem;
-    color: #999;
-    margin-right: 0.4rem;
-  }
   > div.flex-item {
     > div.flex-item {
       position: relative;
           margin-left: 0.05rem;
           font-size: 0.13rem;
           line-height: 0.22rem;
+          &:first-child {
+            margin-left: 0;
+          }
           &.active {
             color: #fff;
             background: #ff5100;
           }
         }
       }
+      > span {
+        display: block;
+        font-size: 0.12rem;
+        color: #333;
+        background: #f2f2f2;
+        line-height: 0.3rem;
+        text-align: center;
+        margin-top: 0.05rem;
+      }
     }
     > a {
       font-size: 0.1rem;

src/components/index/ZqgghhtzBanQuanChangItem/index.vue

     <div class="flex-item flex-h">
       <div class="flex-item">
         <div class="flex-h">
-          <a class="flex-item" v-for="(item, index) in PageDoubleData" v-if="index < 3" :key="index" :class="{'active': item.Active}" @click="SelectItem(item, index, 'ft-double')">
-            <span>{{item.name}}</span>
-            <span>{{item.odds}}</span>
-          </a>
+          <a class="flex-item" v-for="(item, index) in PageDoubleData" v-if="index < 3" :key="index" :class="{'active': item.Active}" @click="SelectItem(item, index, 'ft-double')"><em>{{item.name}}</em> {{item.odds}}</a>
         </div>
         <div class="flex-h">
-          <a class="flex-item" v-for="(item, index) in PageDoubleData" v-if="index >= 3 && index < 6" :key="index" :class="{'active': item.Active}" @click="SelectItem(item, index, 'ft-double')">
-            <span>{{item.name}}</span>
-            <span>{{item.odds}}</span>
-          </a>
+          <a class="flex-item" v-for="(item, index) in PageDoubleData" v-if="index >= 3 && index < 6" :key="index" :class="{'active': item.Active}" @click="SelectItem(item, index, 'ft-double')"><em>{{item.name}}</em> {{item.odds}}</a>
         </div>
         <div class="flex-h">
-          <a class="flex-item" v-for="(item, index) in PageDoubleData" v-if="index >= 6" :key="index" :class="{'active': item.Active}" @click="SelectItem(item, index, 'ft-double')">
-            <span>{{item.name}}</span>
-            <span>{{item.odds}}</span>
-          </a>
+          <a class="flex-item" v-for="(item, index) in PageDoubleData" v-if="index >= 6" :key="index" :class="{'active': item.Active}" @click="SelectItem(item, index, 'ft-double')"><em>{{item.name}}</em> {{item.odds}}</a>
         </div>
       </div>
     </div>

src/components/index/ZqgghhtzBanQuanChangItem/page.scss

   > span {
     font-size: 0.1rem;
     color: #999;
-    margin-right: 0.4rem;
+    margin-right: 0.2rem;
   }
   > div.flex-item {
     > div.flex-item {
           text-align: center;
           border: 0.01rem solid #999;
           margin-left: 0.05rem;
+          font-size: 0.13rem;
+          line-height: 0.22rem;
+          text-align: center;
+          > em {
+            font-size: 0.13rem;
+            line-height: 0.22rem;
+            color: #ff5100;
+          }
           &.active {
             color: #fff;
             background: #ff5100;
             border-color: #ff5100;
-            > span {
+            > em {
               color: #fff;
             }
           }
-          > span {
-            display: block;
-            font-size: 0.1rem;
-            line-height: 0.16rem;
-            text-align: center;
-          }
         }
       }
     }

src/components/index/ZqgghhtzJinQiuShuItem/index.vue

     <div class="flex-item flex-h">
       <div class="flex-item">
         <div class="flex-h">
-          <a class="flex-item" v-for="(item, index) in PagePointsData" v-if="index < 4" :key="index" :class="{'active': item.Active}" @click="SelectItem(item, index, 'ft-points')">
-            <span>{{item.name}}</span>
-            <span>{{item.odds}}</span>
-          </a>
+          <a class="flex-item" v-for="(item, index) in PagePointsData" v-if="index < 4" :key="index" :class="{'active': item.Active}" @click="SelectItem(item, index, 'ft-points')"><em>{{item.name}}</em> {{item.odds}}</a>
         </div>
         <div class="flex-h">
-          <a class="flex-item" v-for="(item, index) in PagePointsData" v-if="index >= 4" :key="index" :class="{'active': item.Active}" @click="SelectItem(item, index, 'ft-points')">
-            <span>{{item.name}}</span>
-            <span>{{item.odds}}</span>
-          </a>
+          <a class="flex-item" v-for="(item, index) in PagePointsData" v-if="index >= 4" :key="index" :class="{'active': item.Active}" @click="SelectItem(item, index, 'ft-points')"><em>{{item.name}}</em> {{item.odds}}</a>
         </div>
       </div>
     </div>

src/components/index/ZqgghhtzJinQiuShuItem/page.scss

   > span {
     font-size: 0.1rem;
     color: #999;
-    margin-right: 0.4rem;
+    margin-right: 0.05rem;
   }
   > div.flex-item {
     > div.flex-item {
           text-align: center;
           border: 0.01rem solid #999;
           margin-left: 0.05rem;
+          font-size: 0.1rem;
+          line-height: 0.22rem;
+          white-space: nowrap;
+          color: #3f63e5;
           &.active {
             color: #fff;
             background: #ff5100;
             border-color: #ff5100;
-            > span {
+            > em {
               color: #fff;
             }
           }
-          > span {
-            display: block;
-            font-size: 0.1rem;
-            line-height: 0.16rem;
-            text-align: center;
+          > em {
+            color: #ff5200;
           }
         }
       }

src/components/index/ZqgghhtzShengPingFu/index.vue

           <a class="flex-item" v-for="(item, index) in PageWdlsData" :key="index" :class="{'active': item.Active}" @click="SelectItem(item, index, 'ft-wdls')">{{`${item.name} ${item.odds}`}}</a>
         </div>
       </div>
-      <a @click="$emit('ShowMore', Index)" :class="{'active': MoreSelect}">更多<br />选项</a>
+      <a @click="$emit('ShowMore', Index)" :class="{'active': MoreSelect}">
+        <div class="centerLabel">
+          <span>更多</span>
+          <span>选项</span>
+        </div>
+      </a>
     </div>
   </div>
 </template>

src/components/index/ZqgghhtzShengPingFu/page.scss

   > span {
     font-size: 0.1rem;
     color: #999;
-    margin-right: 0.4rem;
+    margin-right: 0.2rem;
   }
   > div.flex-item {
     > div.flex-item {
           }
         }
         > a {
-          text-align: center;
           border: 0.01rem solid #999;
           margin-left: 0.05rem;
-          font-size: 0.13rem;
-          line-height: 0.22rem;
+          padding: 0.02rem 0;
+          font-size: 0.1rem;
+          line-height: 0.16rem;
+          text-align: center;
+          white-space: nowrap;
           &.active {
             color: #fff;
             background: #ff5100;
     }
     > a {
       font-size: 0.1rem;
-      color: #ff5100;
       line-height: 0.2rem;
       border: 0.01rem solid #999;
       margin-left: 0.05rem;
       padding: 0 0.02rem;
       padding-top: 0.04rem;
       margin-right: 0.2rem;
+      width: 0.26rem;
       &.active {
         background: #ff5100;
         border-color: #ff5100;
         color: #fff;
+        > div {
+          > span {
+            color: #fff;
+          }
+        }
+      }
+      > div {
+        > span {
+          display: block;
+          font-size: 0.1rem;
+          text-align: center;
+          white-space: nowrap;
+          color: #ff5100;
+        }
       }
     }
   }

src/components/index/ZqgghhtzShengPingFuItem/index.vue

 <template>
   <div class="components ZqgghhtzShengPingFuItem flex-h">
-    <span>{{ListId}}</span>
+    <!-- <span>{{ListId}}</span> -->
     <div class="flex-item flex-h">
       <div class="flex-item">
         <div class="flex-h">

src/components/index/ZuQiuDanGuanBiFen/index.vue

           <span>{{item.leagueName}}<em>{{item.matchTime}}(截)</em></span>
         </div>
         <div class="Detail flex-h">
-          <span>{{item.awayTeamId}}</span>
+          <!-- <span>{{item.awayTeamId}}</span> -->
           <div class="flex-item flex-h">
             <div class="flex-item">
               <div @click="SelectPoints(item, index)">

src/components/index/ZuQiuDanGuanBiFen/page.scss

         > div {
           position: relative;
           overflow: hidden;
-          margin-left: 0.2rem;
+          // margin-left: 0.2rem;
           > div {
             width: 100%;
             position: relative;
             > div {
               font-size: 0;
               text-align: center;
+              background: #f2f2f2;
+              border-radius: 0.06rem;
               > * {
                 display: inline-block;
                 vertical-align: middle;
                 }
               }
               > a {
-                font-size: 0.12rem;
-                line-height: 0.2rem;
-                padding: 0 0.1rem;
-                border: 0.01rem solid #ccc;
+                font-size: 0.16rem;
+                line-height: 0.42rem;
+                display: block;
+                color: #FF5200;
               }
               > span {
                 font-size: 0.12rem;

src/components/index/ZuQiuDanGuanJinQiuShu/page.scss

         > div {
           position: relative;
           overflow: hidden;
-          margin-left: 0.2rem;
+          // margin-left: 0.2rem;
           > div {
             width: 100%;
             position: relative;

src/components/index/ZuQiuDanGuanShengPingFu/page.scss

         > div {
           position: relative;
           overflow: hidden;
-          margin-left: 0.2rem;
+          // margin-left: 0.2rem;
           > div {
             width: 100%;
             position: relative;

src/components/index/ZuQiuGuoGuanBanQuanChang/page.scss

         > div {
           position: relative;
           overflow: hidden;
-          margin-left: 0.2rem;
+          // margin-left: 0.2rem;
           > div {
             width: 100%;
             position: relative;

src/components/index/ZuQiuGuoGuanBiFen/index.vue

           <span>{{item.leagueName}}<em>{{item.matchTime}}(截)</em></span>
         </div>
         <div class="Detail flex-h">
-          <span>{{item.awayTeamId}}</span>
+          <!-- <span>{{item.awayTeamId}}</span> -->
           <div class="flex-item flex-h">
             <div class="flex-item">
               <div @click="SelectPoints(item, index)">

src/components/index/ZuQiuGuoGuanBiFen/page.scss

         > div {
           position: relative;
           overflow: hidden;
-          margin-left: 0.2rem;
+          // margin-left: 0.2rem;
           > div {
             width: 100%;
             position: relative;
             > div {
               font-size: 0;
               text-align: center;
+              background: #f2f2f2;
+              border-radius: 0.06rem;
               > * {
                 display: inline-block;
                 vertical-align: middle;
                 }
               }
               > a {
-                font-size: 0.12rem;
-                line-height: 0.2rem;
-                padding: 0 0.1rem;
-                border: 0.01rem solid #ccc;
+                font-size: 0.16rem;
+                line-height: 0.42rem;
+                display: block;
+                color: #FF5200;
               }
               > span {
                 font-size: 0.12rem;

src/components/index/ZuQiuGuoGuanJinQiuShu/page.scss

         > div {
           position: relative;
           overflow: hidden;
-          margin-left: 0.2rem;
+          // margin-left: 0.2rem;
           > div {
             width: 100%;
             position: relative;

src/components/index/ZuQiuGuoGuanShengPingFu/page.scss

         > div {
           position: relative;
           overflow: hidden;
-          margin-left: 0.2rem;
+          // margin-left: 0.2rem;
           > div {
             width: 100%;
             position: relative;
         }
       }
       > .Detail {
+        padding: 0 0.1rem;
         // align-items: center;
         // margin-top: 0.05rem;
         // > span {

src/pages/index/LanQiu/index.vue

       { name: 'MainTitleClick', value: this.MainTitleClick },
       { name: 'ShowMainHeader', value: true },
       { name: 'ShowMainTitleIcon', value: true },
-      { name: 'MainHeaderTitle', value: '混合投注' },
+      { name: 'MainHeaderTitle', value: '混合投注（过关）' },
       { name: 'ShowMainHeaderBack', value: true }
     ])
     this.Init()
     },
     CutSelectType (item) { // 切换选法
       this.SelectType = item.Id
-      this.EditMainItemData({ name: 'MainHeaderTitle', value: item.Name })
+      this.EditMainItemData({ name: 'MainHeaderTitle', value: `${item.Name}（${this.SelectType > 5 ? '单关' : '过关'}）` })
       this.EmptyAllData() // 清除数据
       this.ShowSelectTypeNav = false
     },

src/pages/index/ZuQiu/index.vue

     <div class="Bottom flex-h">
       <a class="iconfont iconjian" @click="EmptyAllData"></a>
       <div class="flex-item"></div>
-      <span>{{ResList.length ? `已选择${ResList.length}场比赛` : '非单关至少选两场比赛'}}</span>
+      <span>{{ResList.length ? `已选择${ResList.length}场比赛` : this.SelectType > 5 ? '单关至少选一场比赛' : '非单关至少选两场比赛'}}</span>
       <a class="Btn" @click="ToBetting">投注</a>
     </div>
 
       { name: 'MainTitleClick', value: this.MainTitleClick },
       { name: 'ShowMainHeader', value: true },
       { name: 'ShowMainTitleIcon', value: true },
-      { name: 'MainHeaderTitle', value: '混合投注' },
+      { name: 'MainHeaderTitle', value: '混合投注（过关）' },
       { name: 'ShowMainHeaderBack', value: true }
     ])
     this.Init()
     },
     CutSelectType (item) { // 切换选法
       this.SelectType = item.Id
-      this.EditMainItemData({ name: 'MainHeaderTitle', value: item.Name })
+      this.EditMainItemData({ name: 'MainHeaderTitle', value: `${item.Name}（${this.SelectType > 5 ? '单关' : '过关'}）` })
       this.EmptyAllData() // 清除数据
       this.ShowSelectTypeNav = false
     },