静态页面

config/index.js

     assetsPublicPath: '/',
     proxyTable: {
       '/api': {
-        target: 'http://127.0.0.1:8080',
+        target: 'http://123.57.65.31:9004',
         changeOrigin: true, // 如果接口跨域，需要进行这个参数配置
         pathRewrite: { '^/api': '/api' }
       }

src/components/index/LanQiuDanGuanDaXiaoFen/index.vue

           <span>{{item.leagueName}}<em>{{item.matchTime}}(截)</em></span>
         </div>
         <div class="Detail">
-          <LqgghhtzDaXiaoFenItem :Id="item.matchId" :HomeTeamName="item.homeTeamName" :AwayTeamName="item.awayTeamName" :HomeTeamId="item.homeTeamId" :AwayTeamId="item.awayTeamId" :Index="index" :ScoreData="item.playOdds['bst-score']" @SelectItem="SelectItem"></LqgghhtzDaXiaoFenItem>
+          <LqgghhtzDaXiaoFenItem :Id="item.matchId" :ListId="item.matchWeek" :HomeTeamName="item.homeTeamName" :AwayTeamName="item.awayTeamName" :HomeTeamId="item.homeTeamId" :AwayTeamId="item.awayTeamId" :Index="index" :ScoreData="item.playOdds['bst-score']" @SelectItem="SelectItem"></LqgghhtzDaXiaoFenItem>
         </div>
       </li>
     </ul>

src/components/index/LanQiuDanGuanRangFenShengFu/index.vue

           <span>{{item.leagueName}}<em>{{item.matchTime}}(截)</em></span>
         </div>
         <div class="Detail">
-          <LqgghhtzRangFenShengFu :Id="item.matchId" :HomeTeamName="item.homeTeamName" :AwayTeamName="item.awayTeamName" :HomeTeamId="item.homeTeamId" :AwayTeamId="item.awayTeamId" :Index="index" :WlsData="item.playOdds['bst-wls']" @SelectItem="SelectItem"></LqgghhtzRangFenShengFu>
+          <LqgghhtzRangFenShengFu :Id="item.matchId" :ListId="item.matchWeek" :HomeTeamName="item.homeTeamName" :AwayTeamName="item.awayTeamName" :HomeTeamId="item.homeTeamId" :AwayTeamId="item.awayTeamId" :Index="index" :WlsData="item.playOdds['bst-wls']" @SelectItem="SelectItem"></LqgghhtzRangFenShengFu>
         </div>
       </li>
     </ul>

src/components/index/LanQiuDanGuanShengFu/index.vue

           <span>{{item.leagueName}}<em>{{item.matchTime}}(截)</em></span>
         </div>
         <div class="Detail">
-          <LqgghhtzShengFuItem :Id="item.matchId" :HomeTeamName="item.homeTeamName" :AwayTeamName="item.awayTeamName" :HomeTeamId="item.homeTeamId" :AwayTeamId="item.awayTeamId" :Index="index" :WlData="item.playOdds['bst-wl']" @SelectItem="SelectItem"></LqgghhtzShengFuItem>
+          <LqgghhtzShengFuItem :Id="item.matchId" :ListId="item.matchWeek" :HomeTeamName="item.homeTeamName" :AwayTeamName="item.awayTeamName" :HomeTeamId="item.homeTeamId" :AwayTeamId="item.awayTeamId" :Index="index" :WlData="item.playOdds['bst-wl']" @SelectItem="SelectItem"></LqgghhtzShengFuItem>
         </div>
       </li>
     </ul>

src/components/index/LanQiuGuoGuanDaXiaoFen/index.vue

           <span>{{item.leagueName}}<em>{{item.matchTime}}(截)</em></span>
         </div>
         <div class="Detail">
-          <LqgghhtzDaXiaoFenItem :Id="item.matchId" :HomeTeamName="item.homeTeamName" :AwayTeamName="item.awayTeamName" :HomeTeamId="item.homeTeamId" :AwayTeamId="item.awayTeamId" :Index="index" :ScoreData="item.playOdds['bst-score']" @SelectItem="SelectItem"></LqgghhtzDaXiaoFenItem>
+          <LqgghhtzDaXiaoFenItem :Id="item.matchId" :ListId="item.matchWeek" :HomeTeamName="item.homeTeamName" :AwayTeamName="item.awayTeamName" :HomeTeamId="item.homeTeamId" :AwayTeamId="item.awayTeamId" :Index="index" :ScoreData="item.playOdds['bst-score']" @SelectItem="SelectItem"></LqgghhtzDaXiaoFenItem>
         </div>
       </li>
     </ul>

src/components/index/LanQiuGuoGuanHunHeTouZhu/index.vue

           <span>{{item.leagueName}}<em>{{item.matchTime}}(截)</em></span>
         </div>
         <div class="Detail">
-          <LqgghhtzShengFu :MoreSelect="item.MoreSelect" :Id="item.matchId" :HomeTeamName="item.homeTeamName" :AwayTeamName="item.awayTeamName" :HomeTeamId="item.homeTeamId" :AwayTeamId="item.awayTeamId" :Index="index" :WlData="item.playOdds['bst-wl']" :WlsData="item.playOdds['bst-wls']" @SelectItem="SelectItem" @ShowMore="ToShowMore"></LqgghhtzShengFu>
+          <LqgghhtzShengFu :MoreSelect="item.MoreSelect" :Id="item.matchId" :ListId="item.matchWeek" :HomeTeamName="item.homeTeamName" :AwayTeamName="item.awayTeamName" :HomeTeamId="item.homeTeamId" :AwayTeamId="item.awayTeamId" :Index="index" :WlData="item.playOdds['bst-wl']" :WlsData="item.playOdds['bst-wls']" @SelectItem="SelectItem" @ShowMore="ToShowMore"></LqgghhtzShengFu>
         </div>
       </li>
     </ul>

src/components/index/LanQiuGuoGuanRangFenShengFu/index.vue

           <span>{{item.leagueName}}<em>{{item.matchTime}}(截)</em></span>
         </div>
         <div class="Detail">
-          <LqgghhtzRangFenShengFu :Id="item.matchId" :HomeTeamName="item.homeTeamName" :AwayTeamName="item.awayTeamName" :HomeTeamId="item.homeTeamId" :AwayTeamId="item.awayTeamId" :Index="index" :WlsData="item.playOdds['bst-wls']" @SelectItem="SelectItem"></LqgghhtzRangFenShengFu>
+          <LqgghhtzRangFenShengFu :Id="item.matchId" :ListId="item.matchWeek" :HomeTeamName="item.homeTeamName" :AwayTeamName="item.awayTeamName" :HomeTeamId="item.homeTeamId" :AwayTeamId="item.awayTeamId" :Index="index" :WlsData="item.playOdds['bst-wls']" @SelectItem="SelectItem"></LqgghhtzRangFenShengFu>
         </div>
       </li>
     </ul>

src/components/index/LanQiuGuoGuanShengFu/index.vue

           <span>{{item.leagueName}}<em>{{item.matchTime}}(截)</em></span>
         </div>
         <div class="Detail">
-          <LqgghhtzShengFuItem :Id="item.matchId" :HomeTeamName="item.homeTeamName" :AwayTeamName="item.awayTeamName" :HomeTeamId="item.homeTeamId" :AwayTeamId="item.awayTeamId" :Index="index" :WlData="item.playOdds['bst-wl']" @SelectItem="SelectItem"></LqgghhtzShengFuItem>
+          <LqgghhtzShengFuItem :Id="item.matchId" :ListId="item.matchWeek" :HomeTeamName="item.homeTeamName" :AwayTeamName="item.awayTeamName" :HomeTeamId="item.homeTeamId" :AwayTeamId="item.awayTeamId" :Index="index" :WlData="item.playOdds['bst-wl']" @SelectItem="SelectItem"></LqgghhtzShengFuItem>
         </div>
       </li>
     </ul>

src/components/index/LqgghhtzDaXiaoFen/index.vue

     PresetPoints: {
       default: 0
     },
+    ListId: {
+      default: null
+    },
     Id: {
       default: null
     },
     SelectItem (item, index, key) { // 选择投注
       if (item.Active !== null) {
         item.Active = !item.Active
-        this.$emit('SelectItem', { pIndex: this.Index, value: item.Active, key, cIndex: index, id: this.Id, target: item, homeTeamName: this.HomeTeamName, awayTeamName: this.AwayTeamName, homeTeamId: this.HomeTeamId, awayTeamId: this.AwayTeamId })
+        this.$emit('SelectItem', { pIndex: this.Index, value: item.Active, key, cIndex: index === 2 ? 1 : index, id: this.Id, target: item, homeTeamName: this.HomeTeamName, awayTeamName: this.AwayTeamName, homeTeamId: this.HomeTeamId, awayTeamId: this.AwayTeamId })
       }
     }
   }

src/components/index/LqgghhtzDaXiaoFenItem/index.vue

 <template>
   <div class="components LqgghhtzDaXiaoFenItem flex-h">
-    <span>{{Id}}</span>
+    <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')">
     PresetPoints: {
       default: 0
     },
+    ListId: {
+      default: null
+    },
     Id: {
       default: null
     },
     SelectItem (item, index, key) { // 选择投注
       if (item.Active !== null) {
         item.Active = !item.Active
-        this.$emit('SelectItem', { pIndex: this.Index, value: item.Active, key, cIndex: index, id: this.Id, target: item, homeTeamName: this.HomeTeamName, awayTeamName: this.AwayTeamName, homeTeamId: this.HomeTeamId, awayTeamId: this.AwayTeamId })
+        this.$emit('SelectItem', { pIndex: this.Index, value: item.Active, key, cIndex: index === 2 ? 1 : index, id: this.Id, target: item, homeTeamName: this.HomeTeamName, awayTeamName: this.AwayTeamName, homeTeamId: this.HomeTeamId, awayTeamId: this.AwayTeamId })
       }
     }
   }

src/components/index/LqgghhtzRangFenShengFu/index.vue

 <template>
   <div class="components LqgghhtzRangFenShengFu flex-h">
-    <span>{{Id}}</span>
+    <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')">
 export default {
   name: 'LqgghhtzRangFenShengFu',
   props: {
+    ListId: {
+      default: null
+    },
     Id: {
       default: null
     },

src/components/index/LqgghhtzShengFenCha/index.vue

 export default {
   name: 'LqgghhtzShengFenCha',
   props: {
+    ListId: {
+      default: null
+    },
     Id: {
       default: null
     },

src/components/index/LqgghhtzShengFu/index.vue

 <template>
   <div class="components LqgghhtzShengFu flex-h">
-    <span>{{Id}}</span>
+    <span>{{ListId}}</span>
     <div class="flex-item flex-h">
       <div class="flex-item">
         <div class="flex-h">
     MoreSelect: {
       default: false
     },
+    ListId: {
+      default: null
+    },
     Id: {
       default: null
     },

src/components/index/LqgghhtzShengFuItem/index.vue

 <template>
   <div class="components LqgghhtzShengFuItem flex-h">
-    <span>{{Id}}</span>
+    <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')">
 export default {
   name: 'LqgghhtzShengFuItem',
   props: {
+    ListId: {
+      default: null
+    },
     Id: {
       default: null
     },

src/components/index/ZqdghhtzShengPingFu/index.vue

 <template>
   <div class="components ZqdghhtzShengPingFu flex-h">
-    <span>{{Id}}</span>
+    <span>{{ListId}}</span>
     <div class="flex-item flex-h">
       <div class="flex-item">
         <div class="flex-h">
     SpreadPoints: {
       default: null
     },
+    ListId: {
+      default: null
+    },
     Id: {
       default: null
     },

src/components/index/ZqgghhtzBanQuanChang/index.vue

 export default {
   name: 'ZqgghhtzBanQuanChang',
   props: {
+    ListId: {
+      default: null
+    },
     Id: {
       default: null
     },

src/components/index/ZqgghhtzBanQuanChangItem/index.vue

 <template>
   <div class="components ZqgghhtzBanQuanChangItem flex-h">
-    <span>{{Id}}</span>
+    <span>{{ListId}}</span>
     <div class="flex-item flex-h">
       <div class="flex-item">
         <div class="flex-h">
 export default {
   name: 'ZqgghhtzBanQuanChangItem',
   props: {
+    ListId: {
+      default: null
+    },
     Id: {
       default: null
     },

src/components/index/ZqgghhtzBiFen/index.vue

 export default {
   name: 'ZqgghhtzBiFen',
   props: {
+    ListId: {
+      default: null
+    },
     Id: {
       default: null
     },

src/components/index/ZqgghhtzJinQiuShu/index.vue

 export default {
   name: 'ZqgghhtzJinQiuShu',
   props: {
+    ListId: {
+      default: null
+    },
     Id: {
       default: null
     },

src/components/index/ZqgghhtzJinQiuShuItem/index.vue

 <template>
   <div class="components ZqgghhtzJinQiuShuItem flex-h">
-    <span>{{Id}}</span>
+    <span>{{ListId}}</span>
     <div class="flex-item flex-h">
       <div class="flex-item">
         <div class="flex-h">
 export default {
   name: 'ZqgghhtzJinQiuShuItem',
   props: {
+    ListId: {
+      default: null
+    },
     Id: {
       default: null
     },

src/components/index/ZqgghhtzShengPingFu/index.vue

 <template>
   <div class="components ZqgghhtzShengPingFu flex-h">
-    <span>{{Id}}</span>
+    <span>{{ListId}}</span>
     <div class="flex-item flex-h">
       <div class="flex-item">
         <div class="flex-h">
     SpreadPoints: {
       default: null
     },
+    ListId: {
+      default: null
+    },
     Id: {
       default: null
     },

src/components/index/ZqgghhtzShengPingFuItem/index.vue

 <template>
   <div class="components ZqgghhtzShengPingFuItem flex-h">
-    <span>{{Id}}</span>
+    <span>{{ListId}}</span>
     <div class="flex-item flex-h">
       <div class="flex-item">
         <div class="flex-h">
 export default {
   name: 'ZqgghhtzShengPingFuItem',
   props: {
+    ListId: {
+      default: null
+    },
     Id: {
       default: null
     },

src/components/index/ZuQiuDanGuanBanQuanChang/index.vue

           <span>{{item.leagueName}}<em>{{item.matchTime}}(截)</em></span>
         </div>
         <div class="Detail">
-          <ZqgghhtzBanQuanChangItem :Id="item.matchId" :HomeTeamName="item.homeTeamName" :AwayTeamName="item.awayTeamName" :HomeTeamId="item.homeTeamId" :AwayTeamId="item.awayTeamId" :Index="index" :DoubleData="item.playOdds['ft-double']" @SelectItem="SelectItem"></ZqgghhtzBanQuanChangItem>
+          <ZqgghhtzBanQuanChangItem :Id="item.matchId" :ListId="item.matchWeek" :HomeTeamName="item.homeTeamName" :AwayTeamName="item.awayTeamName" :HomeTeamId="item.homeTeamId" :AwayTeamId="item.awayTeamId" :Index="index" :DoubleData="item.playOdds['ft-double']" @SelectItem="SelectItem"></ZqgghhtzBanQuanChangItem>
         </div>
       </li>
     </ul>

src/components/index/ZuQiuDanGuanJinQiuShu/index.vue

           <span>{{item.leagueName}}<em>{{item.matchTime}}(截)</em></span>
         </div>
         <div class="Detail">
-          <ZqgghhtzJinQiuShuItem :Id="item.matchId" :HomeTeamName="item.homeTeamName" :AwayTeamName="item.awayTeamName" :HomeTeamId="item.homeTeamId" :AwayTeamId="item.awayTeamId" :Index="index" :PointsData="item.playOdds['ft-points']" @SelectItem="SelectItem"></ZqgghhtzJinQiuShuItem>
+          <ZqgghhtzJinQiuShuItem :Id="item.matchId" :ListId="item.matchWeek" :HomeTeamName="item.homeTeamName" :AwayTeamName="item.awayTeamName" :HomeTeamId="item.homeTeamId" :AwayTeamId="item.awayTeamId" :Index="index" :PointsData="item.playOdds['ft-points']" @SelectItem="SelectItem"></ZqgghhtzJinQiuShuItem>
         </div>
       </li>
     </ul>

src/components/index/ZuQiuDanGuanShengPingFu/index.vue

           <span>{{item.leagueName}}<em>{{item.matchTime}}(截)</em></span>
         </div>
         <div class="Detail">
-          <ZqdghhtzShengPingFu :Id="item.matchId" :HomeTeamName="item.homeTeamName" :AwayTeamName="item.awayTeamName" :HomeTeamId="item.homeTeamId" :AwayTeamId="item.awayTeamId" :Index="index" :WdlData="item.playOdds['ft-wdl']" @SelectItem="SelectItem"></ZqdghhtzShengPingFu>
+          <ZqdghhtzShengPingFu :Id="item.matchId" :ListId="item.matchWeek" :HomeTeamName="item.homeTeamName" :AwayTeamName="item.awayTeamName" :HomeTeamId="item.homeTeamId" :AwayTeamId="item.awayTeamId" :Index="index" :WdlData="item.playOdds['ft-wdl']" @SelectItem="SelectItem"></ZqdghhtzShengPingFu>
         </div>
       </li>
     </ul>

src/components/index/ZuQiuGuoGuanBanQuanChang/index.vue

           <span>{{item.leagueName}}<em>{{item.matchTime}}(截)</em></span>
         </div>
         <div class="Detail">
-          <ZqgghhtzBanQuanChangItem :Id="item.matchId" :HomeTeamName="item.homeTeamName" :AwayTeamName="item.awayTeamName" :HomeTeamId="item.homeTeamId" :AwayTeamId="item.awayTeamId" :Index="index" :DoubleData="item.playOdds['ft-double']" @SelectItem="SelectItem"></ZqgghhtzBanQuanChangItem>
+          <ZqgghhtzBanQuanChangItem :Id="item.matchId" :ListId="item.matchWeek" :HomeTeamName="item.homeTeamName" :AwayTeamName="item.awayTeamName" :HomeTeamId="item.homeTeamId" :AwayTeamId="item.awayTeamId" :Index="index" :DoubleData="item.playOdds['ft-double']" @SelectItem="SelectItem"></ZqgghhtzBanQuanChangItem>
         </div>
       </li>
     </ul>

src/components/index/ZuQiuGuoGuanHunHeTouZhu/index.vue

           <span>{{item.leagueName}}<em>{{item.matchTime}}(截)</em></span>
         </div>
         <div class="Detail">
-          <ZqgghhtzShengPingFu :MoreSelect="item.MoreSelect" :Id="item.matchId" :HomeTeamName="item.homeTeamName" :AwayTeamName="item.awayTeamName" :HomeTeamId="item.homeTeamId" :AwayTeamId="item.awayTeamId" :Index="index" :SpreadPoints="item.spreadPoints" :WdlData="item.playOdds['ft-wdl']" :WdlsData="item.playOdds['ft-wdls']" @SelectItem="SelectItem" @ShowMore="ToShowMore"></ZqgghhtzShengPingFu>
+          <ZqgghhtzShengPingFu :MoreSelect="item.MoreSelect" :Id="item.matchId" :ListId="item.matchWeek" :HomeTeamName="item.homeTeamName" :AwayTeamName="item.awayTeamName" :HomeTeamId="item.homeTeamId" :AwayTeamId="item.awayTeamId" :Index="index" :SpreadPoints="item.spreadPoints" :WdlData="item.playOdds['ft-wdl']" :WdlsData="item.playOdds['ft-wdls']" @SelectItem="SelectItem" @ShowMore="ToShowMore"></ZqgghhtzShengPingFu>
         </div>
       </li>
     </ul>

src/components/index/ZuQiuGuoGuanJinQiuShu/index.vue

           <span>{{item.leagueName}}<em>{{item.matchTime}}(截)</em></span>
         </div>
         <div class="Detail">
-          <ZqgghhtzJinQiuShuItem :Id="item.matchId" :HomeTeamName="item.homeTeamName" :AwayTeamName="item.awayTeamName" :HomeTeamId="item.homeTeamId" :AwayTeamId="item.awayTeamId" :Index="index" :PointsData="item.playOdds['ft-points']" @SelectItem="SelectItem"></ZqgghhtzJinQiuShuItem>
+          <ZqgghhtzJinQiuShuItem :Id="item.matchId" :ListId="item.matchWeek" :HomeTeamName="item.homeTeamName" :AwayTeamName="item.awayTeamName" :HomeTeamId="item.homeTeamId" :AwayTeamId="item.awayTeamId" :Index="index" :PointsData="item.playOdds['ft-points']" @SelectItem="SelectItem"></ZqgghhtzJinQiuShuItem>
         </div>
       </li>
     </ul>

src/components/index/ZuQiuGuoGuanShengPingFu/index.vue

           <span>{{item.leagueName}}<em>{{item.matchTime}}(截)</em></span>
         </div>
         <div class="Detail">
-          <ZqgghhtzShengPingFuItem :Id="item.matchId" :HomeTeamName="item.homeTeamName" :AwayTeamName="item.awayTeamName" :HomeTeamId="item.homeTeamId" :AwayTeamId="item.awayTeamId" :Index="index" :WdlData="item.playOdds['ft-wdl']" :WdlsData="item.playOdds['ft-wdls']" @SelectItem="SelectItem"></ZqgghhtzShengPingFuItem>
+          <ZqgghhtzShengPingFuItem :Id="item.matchId" :ListId="item.matchWeek" :HomeTeamName="item.homeTeamName" :AwayTeamName="item.awayTeamName" :HomeTeamId="item.homeTeamId" :AwayTeamId="item.awayTeamId" :Index="index" :WdlData="item.playOdds['ft-wdl']" :WdlsData="item.playOdds['ft-wdls']" @SelectItem="SelectItem"></ZqgghhtzShengPingFuItem>
         </div>
       </li>
     </ul>

src/pages/KaiJiangZhanShi/DaLeTouXiangQing/index.vue

 <template>
   <div class="Page">
     <!-- 开奖信息 -->
-    <div class="PrizeInfo">
+    <div class="PrizeInfo" v-if="PageData !== null">
       <div class="flex-h">
         <div class="Icon">
           <img src="../../../assets/img/icon4.png" class="centerLabel cover" alt="">
         <span>大乐透</span>
         <div class="flex-item">
           <div class="Time">
-            <span>开奖日期：2020-08-14</span>
-            <span>第202076期</span>
+            <span>开奖日期：{{PageData.openingDate}}</span>
+            <span>第{{PageData.issueNo}}期</span>
           </div>
           <ul class="Num">
-            <li>02</li>
-            <li>04</li>
-            <li>52</li>
-            <li>44</li>
-            <li>57</li>
-            <li class="active">54</li>
-            <li class="active">12</li>
+            <li v-for="(item, index) in PageData.firstResult.split(',')" :key="`First-${index}`">{{item}}</li>
+            <li v-for="(item, index) in PageData.secondResult.split(',')" :key="`Second-${index}`" class="active">{{item}}</li>
           </ul>
         </div>
       </div>
         </li>
       </ul>
       <div class="Btn">
-        <a>大乐透投注</a>
+        <router-link :to="{ name: 'DaLeTou' }">大乐透投注</router-link>
       </div>
     </div>
   </div>
 </template>
 
 <script>
-import { mapMutations } from 'vuex'
+import { mapMutations, createNamespacedHelpers } from 'vuex'
+const { mapState: mapIndexState } = createNamespacedHelpers('index')
 export default {
   name: '',
   data () {
     return {
+      PageData: null
     }
   },
   computed: {
+    ...mapIndexState({
+      LotteryRes: x => x.LotteryRes // 数字彩开奖结果列表
+    })
   },
   components: {
   },
       { name: 'MainHeaderTitle', value: '开奖历史' },
       { name: 'ShowMainHeaderBack', value: true }
     ])
+    this.Init()
   },
   mounted () {
     this.$nextTick(() => {
   methods: {
     ...mapMutations([
       'EditMainData' // 配置页面框架数据
-    ])
+    ]),
+    Init () { // 初始化
+      let SerialNo = this.$route.query.serialNo
+      let IssueNo = this.$route.query.issueNo
+      this.LotteryRes.map((item) => {
+        if (item.serialNo === SerialNo && item.issueNo === IssueNo) {
+          this.PageData = { ...item }
+        }
+      })
+    }
   }
 }
 </script>

src/pages/KaiJiangZhanShi/ShuangSeQiu/index.vue

       <div slot="SwiperItem-1" class="Item">
 
         <!-- 开奖信息 -->
-        <div class="PrizeInfo">
+        <div class="PrizeInfo" v-if="LotteryRes.length">
           <div class="flex-h">
             <div class="Icon">
               <img src="../../../assets/img/icon5.png" class="centerLabel cover" alt="">
             <span>双色球</span>
             <div class="flex-item">
               <div class="Time">
-                <span>开奖日期：2020-08-14</span>
-                <span>第202076期</span>
+                <span>开奖日期：{{LotteryRes[0].openingDate}}</span>
+                <span>第{{LotteryRes[0].issueNo}}期</span>
               </div>
               <ul class="Num">
-                <li>02</li>
-                <li>04</li>
-                <li>52</li>
-                <li>44</li>
-                <li>57</li>
-                <li class="active">54</li>
+                <li v-for="(item, index) in LotteryRes[0].firstResult.split(',')" :key="`First-${index}`">{{item}}</li>
+                <li v-for="(item, index) in LotteryRes[0].secondResult.split(',')" :key="`Second-${index}`" class="active">{{item}}</li>
               </ul>
             </div>
           </div>
             </li>
           </ul>
           <div class="Btn">
-            <a>双色球投注</a>
+            <router-link :to="{ name: 'ShuangSeQiu' }">双色球投注</router-link>
           </div>
         </div>
 
       <!-- 开奖历史 -->
       <div slot="SwiperItem-3" class="Item">
         <ul class="HistoryList">
-          <router-link tag="li" v-for="(item, index) in 10" :key="index" :to="{ name: 'ShuangSeQiuXiangQing' }" class="flex-h">
+          <router-link tag="li" v-for="(item, index) in LotteryRes" :key="index" :to="{ name: 'ShuangSeQiuXiangQing', query: { serialNo: item.serialNo, lotteryId: 'lottery', issueNo: item.issueNo } }" class="flex-h">
             <div class="Icon">
               <img src="../../../assets/img/icon5.png" class="centerLabel cover" alt="">
             </div>
             <span>双色球</span>
             <div class="flex-item">
               <div class="Time">
-                <span>开奖日期：2020-08-14</span>
-                <span>第202076期</span>
+                <span>开奖日期：{{item.openingDate}}</span>
+                <span>第{{item.issueNo}}期</span>
               </div>
               <ul class="Num">
-                <li>02</li>
-                <li>04</li>
-                <li>52</li>
-                <li>44</li>
-                <li>57</li>
-                <li class="active">54</li>
+                <li v-for="(subItem, subIndex) in item.firstResult.split(',')" :key="`First-${subIndex}`">{{subItem}}</li>
+                <li v-for="(subItem, subIndex) in item.secondResult.split(',')" :key="`Second-${subIndex}`" class="active">{{subItem}}</li>
               </ul>
             </div>
           </router-link>
 </template>
 
 <script>
-import { mapMutations } from 'vuex'
+import { mapMutations, createNamespacedHelpers } from 'vuex'
 import TabSwiper from '../../../components/common/TabSwiper'
+const { mapState: mapIndexState, mapActions: mapIndexActions, mapMutations: mapIndexMutations } = createNamespacedHelpers('index')
 export default {
   name: '',
   data () {
       NavActiveId: 1, // 选中nav id
       NavList: [ // nav数据
         { name: '最新开奖', id: 1 },
-        { name: '走势图', id: 2 },
+        // { name: '走势图', id: 2 },
         { name: '开奖历史', id: 3 }
-      ]
+      ],
+      PageData: {
+        pageNum: 1,
+        pageSize: 100
+      },
+      Total: 1,
+      DataLock: false
     }
   },
   computed: {
+    ...mapIndexState({
+      LotteryRes: x => x.LotteryRes // 数字彩开奖结果列表
+    })
   },
   components: {
     TabSwiper
       { name: 'MainHeaderTitle', value: '双色球开奖' },
       { name: 'ShowMainHeaderBack', value: true }
     ])
+    this.Init()
   },
   mounted () {
     this.$nextTick(() => {
     ...mapMutations([
       'EditMainData' // 配置页面框架数据
     ]),
+    ...mapIndexActions([
+      'GetLotteryRes'
+    ]),
+    ...mapIndexMutations([
+      'EmptyLotteryRes'
+    ]),
+    Init () {
+      this.EmptyLotteryRes()
+      this.ToGetLotteryRes()
+    },
     TabChange (e) { // nav切换
 
+    },
+    ToGetLotteryRes (done = () => { }) { // 获取开奖列表
+      if (this.DataLock || this.LotteryRes.length >= this.Total) {
+        done()
+      } else {
+        this.DataLock = true
+        this.GetLotteryRes({ queryData: { ...this.PageData, lotteryId: 'double-color' } }).then((res) => {
+          this.Total = res.data.data.total > 1 ? res.data.data.total : this.LotteryRes.length
+          this.DataLock = false
+          done()
+        }).catch((res) => {
+          this.Toast(res.data.message)
+          this.DataLock = false
+          done()
+        })
+      }
     },
     Refresh (e) { // 页面下拉刷新
-      window.setTimeout(() => {
-        e.done()
-      }, 1000)
+      this.ToGetLotteryRes(e.done())
     }
   }
 }

src/pages/KaiJiangZhanShi/ShuangSeQiuXiangQing/index.vue

 <template>
   <div class="Page">
     <!-- 开奖信息 -->
-    <div class="PrizeInfo">
+    <div class="PrizeInfo" v-if="PageData !== null">
       <div class="flex-h">
         <div class="Icon">
           <img src="../../../assets/img/icon5.png" class="centerLabel cover" alt="">
         <span>双色球</span>
         <div class="flex-item">
           <div class="Time">
-            <span>开奖日期：2020-08-14</span>
-            <span>第202076期</span>
+            <span>开奖日期：{{PageData.openingDate}}</span>
+            <span>第{{PageData.issueNo}}期</span>
           </div>
           <ul class="Num">
-            <li>02</li>
-            <li>04</li>
-            <li>52</li>
-            <li>44</li>
-            <li>57</li>
-            <li class="active">54</li>
+            <li v-for="(item, index) in PageData.firstResult.split(',')" :key="`First-${index}`">{{item}}</li>
+            <li v-for="(item, index) in PageData.secondResult.split(',')" :key="`Second-${index}`" class="active">{{item}}</li>
           </ul>
         </div>
       </div>
         </li>
       </ul>
       <div class="Btn">
-        <a>大乐透投注</a>
+        <router-link :to="{ name: 'ShuangSeQiu' }">双色球投注</router-link>
       </div>
     </div>
   </div>
 </template>
 
 <script>
-import { mapMutations } from 'vuex'
+import { mapMutations, createNamespacedHelpers } from 'vuex'
+const { mapState: mapIndexState } = createNamespacedHelpers('index')
 export default {
   name: '',
   data () {
     return {
+      PageData: null
     }
   },
   computed: {
+    ...mapIndexState({
+      LotteryRes: x => x.LotteryRes // 数字彩开奖结果列表
+    })
   },
   components: {
   },
       { name: 'MainHeaderTitle', value: '开奖历史' },
       { name: 'ShowMainHeaderBack', value: true }
     ])
+    this.Init()
   },
   mounted () {
     this.$nextTick(() => {
   methods: {
     ...mapMutations([
       'EditMainData' // 配置页面框架数据
-    ])
+    ]),
+    Init () { // 初始化
+      let SerialNo = this.$route.query.serialNo
+      let IssueNo = this.$route.query.issueNo
+      this.LotteryRes.map((item) => {
+        if (item.serialNo === SerialNo && item.issueNo === IssueNo) {
+          this.PageData = { ...item }
+        }
+      })
+    }
   }
 }
 </script>

src/pages/index/LanQiuDingDan/index.vue

             <div class="flex-h">
               <span class="flex-item">加倍</span>
               <span>
-                <a class="iconfont iconjianhao" @click="Multiple = Multiple > 1 ? Multiple - 1 : 1"></a>
+                <a class="iconfont iconjianhao" @click="Multiple = Multiple > 1 ? Multiple - 1 : 1; TotalPrice = TotalCount * 2 * Multiple"></a>
                 <input type="number" disabled="disabled" v-model="Multiple">
                 <span>倍</span>
-                <a class="iconfont iconjiahao" @click="Multiple += 1"></a>
+                <a class="iconfont iconjiahao" @click="Multiple += 1; TotalPrice = TotalCount * 2 * Multiple"></a>
               </span>
             </div>
           </div>
         <span>
           <em>{{TotalCount}}</em>注
         </span>
-        <span>金额：<em>{{TotalPrize * Multiple}}</em>元</span>
-        <span>预计奖金：<em>0 ~ 0</em>元</span>
+        <span>金额：<em>{{TotalPrice}}</em>元</span>
+        <span>预计奖金：<em>{{(PriceArr[0] * Multiple).toFixed(2)}} ~ {{(PriceArr[1] * Multiple).toFixed(2)}}</em>元</span>
       </div>
-      <a :class="{'active': CurrentStoreId !== null && LanQiuCart.length}">立即购买</a>
+      <a :class="{'active': CurrentStoreId !== null && LanQiuCart.length}" @click="ToPostBetting">立即购买</a>
     </div>
 
     <div class="Layer" v-if="ShowPassWay">
           <a v-for="(item, index) in FootballKeys.passes" :key="index" v-if="item.unitNum <= PageList.length && item.unitNum > 2 && item.amount !== 1" :class="{'active': item.passCode === CurrentPassCode}" @click="CutPassCode(item)">{{item.name}}</a>
         </nav>
         <div class="Bottom flex-h">
-          <a class="flex-item" @click="CurrentPassCode = null; ShowPassWay = false">取消</a>
-          <a class="flex-item active" @click="ToGetAllParts(); ShowPassWay = false">确定</a>
+          <a class="flex-item" @click="ShowPassWay = false">取消</a>
+          <a class="flex-item active" @click="ShowPassWay = false">确定</a>
         </div>
       </div>
     </div>
   name: '',
   data () {
     return {
+      PriceArr: [0, 0], // 奖金区间
       AllParts: [], // 投注生成结果
       CurrentPassUnitNum: 0,
       CurrentPassAmount: 0,
       Multiple: 1, // 倍数
       ShowStore: false, // 是否显示店铺选择弹窗
       TotalCount: 0, // 总注数
-      TotalPrize: 0, // 总金额
+      TotalPrice: 0, // 总金额
       PageList: [],
       DataLock: false
     }
       FootballKeys: x => x.FootballKeys // 竞彩字典
     }),
     ...mapUserState({
+      UserInfo: x => x.UserInfo, // 用户信息
       LanQiuCart: x => x.LanQiuCart // 篮球购物车
     })
   },
         this.ToGetAllParts() // 枚举投注
       }
     },
+    ToPostBetting () { // 去下注
+      if (this.DataLock || !this.LanQiuCart.length || this.CurrentStoreId === null || this.CurrentPassCode === null) return
+      this.DataLock = true
+      let Data = null
+      let ListData = []
+      this.LanQiuCart.map((item) => {
+        ListData.push({
+          matchId: item.id,
+          awayTeamId: item.awayTeamId, // 客队id
+          awayTeamName: item.awayTeamName, // 客队名称
+          homeTeamId: item.homeTeamId, // 主队id
+          homeTeamName: item.homeTeamName, // 主队名称
+          detailList: this.ReturnDeatilList(item.list, item.id)
+        })
+      })
+      Data = {
+        expectedEarning: `${this.PriceArr[0].toFixed(2)}~${this.PriceArr[1].toFixed(2)}元`, // 预期奖金
+        customerId: this.UserInfo.customerId, // 用户id
+        isDigit: false, // 是否数字彩
+        isSport: true, // 是否体彩
+        itemList: [...ListData], // 购彩方案
+        lotteryId: 'basketball', // 彩种ID
+        notesNum: this.TotalCount, // 总注数
+        passCode: this.CurrentPassCode, // 过关方式
+        shopId: this.CurrentStoreId, // 店铺ID
+        times: this.Multiple, // 倍数
+        totalPrice: this.TotalPrice * 100 // 总金额
+      }
+      this.PostBetting({
+        urlData: { id: 'basketball' },
+        data: { ...Data }
+      }).then((res) => {
+        this.Toast('投注成功！')
+        this.EmptyLanQiuCart()
+        this.PageList = []
+        this.PriceArr = [0, 0]
+        this.TotalCount = 0
+        this.TotalPrice = 0
+        this.Multiple = 1
+        this.DataLock = false
+      }).catch((res) => {
+        this.Toast(res.data.message)
+        this.DataLock = false
+      })
+    },
     ToGetStoreList () { // 获取店铺列表
       this.GetStoreList({
         queryData: {
       })
       this.AllParts = GetAllParts([...ListData], PassTarget).allParts
       this.TotalCount = GetAllParts([...ListData], PassTarget).sum
-      console.log(GetPrice(this.AllParts))
+      this.TotalPrice = this.TotalCount * 2 * this.Multiple
+      this.PriceArr = GetPrice(this.AllParts)
+      console.log(JSON.stringify(this.AllParts))
     },
     ReturnDeatilList (list, pid) {
       let Arr = []
       return Arr || []
     },
     CutPassCode (item) { // 切换串法
+      if (this.DataLock) return
+      this.DataLock = true
       if (this.CurrentPassCode === item.passCode) {
         this.CurrentPassCode = null
         this.CurrentPassName = null
         this.CurrentPassUnitNum = 0
         this.CurrentPassAmount = 0
+        this.TotalCount = 0
+        this.TotalPrice = 0
+        this.PriceArr = [0, 0]
       } else {
         this.CurrentPassCode = item.passCode
         this.CurrentPassName = item.name
         this.CurrentPassUnitNum = item.unitNum
         this.CurrentPassAmount = item.amount
+        this.ToGetAllParts()
       }
+      this.DataLock = false
     },
     SelectStore (item) { // 选择店铺
       if (this.DataLock) return
       this.DataLock = false
     },
     DeleteItem (index) { // 删除投注
+      if (this.DataLock) return
+      this.DataLock = true
       this.DeleteLanQiuCart(index)
       this.PageList = [...this.LanQiuCart]
-      this.ToGetAllParts()
+      if (this.$route.query.type === 'mix') {
+        this.CurrentPassCode = null
+      }
+      this.TotalPrice = 0
+      this.TotalCount = 0
+      this.PriceArr = [0, 0]
+      this.DataLock = false
     },
     MultipleLess (item) { // 减少倍数
       if (item.Multiple > 1 && !this.DataLock) {
         this.DataLock = true
         item.Multiple -= 1
+        this.TotalPrice = this.TotalCount * 2 * this.Multiple
         this.DataLock = false
       }
     },
       if (!this.DataLock) {
         this.DataLock = true
         item.Multiple += 1
+        this.TotalPrice = this.TotalCount * 2 * this.Multiple
         this.DataLock = false
       }
     }

src/pages/index/ZuQiu/index.vue

 import ZuQiuDanGuanBiFen from '../../../components/index/ZuQiuDanGuanBiFen'
 import ZuQiuDanGuanJinQiuShu from '../../../components/index/ZuQiuDanGuanJinQiuShu'
 import { mapMutations, createNamespacedHelpers } from 'vuex'
-const { mapState: mapUserState, mapActions: mapUserActions } = createNamespacedHelpers('user')
+const { mapState: mapUserState, mapActions: mapUserActions, mapMutations: mapUserMutations } = createNamespacedHelpers('user')
 export default {
   name: '',
   data () {
     ...mapUserActions([
       'GetMixData'
     ]),
+    ...mapUserMutations([
+      'AddZuQiuCart',
+      'EmptyZuQiuCart'
+    ]),
     Init () { // 初始化
       this.GetMixData({ queryData: { lottery: 'football' } }).then((res) => {
         this.MixData = res.data.data || []
       })
     },
+    ToBetting () { // 去投注
+      if (this.SelectType > 5) {
+        if (this.ResList.length) {
+          this.EmptyZuQiuCart()
+          this.ResList.map((item) => {
+            this.AddZuQiuCart(item)
+          })
+          this.$router.push({ name: 'ZuQiuDingDan', query: { type: 'single' } })
+        }
+      } else {
+        if (this.ResList.length > 1) {
+          this.EmptyZuQiuCart()
+          this.ResList.map((item) => {
+            this.AddZuQiuCart(item)
+          })
+          this.$router.push({ name: 'ZuQiuDingDan', query: { type: 'mix' } })
+        }
+      }
+    },
     ResChange (e) { // 投注结果更新
       this.ResList = e
     },

src/pages/index/LanQiuDingDan/index copy.vue → src/pages/index/ZuQiuDingDan/index.vue

             <div class="flex-h">
               <span class="flex-item">加倍</span>
               <span>
-                <a class="iconfont iconjianhao" @click="Multiple = Multiple > 1 ? Multiple - 1 : 1"></a>
+                <a class="iconfont iconjianhao" @click="Multiple = Multiple > 1 ? Multiple - 1 : 1; TotalPrice = TotalCount * 2 * Multiple"></a>
                 <input type="number" disabled="disabled" v-model="Multiple">
                 <span>倍</span>
-                <a class="iconfont iconjiahao" @click="Multiple += 1"></a>
+                <a class="iconfont iconjiahao" @click="Multiple += 1; TotalPrice = TotalCount * 2 * Multiple"></a>
               </span>
             </div>
           </div>
       </div>
       <div class="Count">
         <span>
-          <em>{{AllPartsCounts}}</em>注
+          <em>{{TotalCount}}</em>注
         </span>
-        <span>金额：<em>{{TotalPrize * Multiple}}</em>元</span>
-        <span>预计奖金：<em>0 ~ 0</em>元</span>
+        <span>金额：<em>{{TotalPrice}}</em>元</span>
+        <span>预计奖金：<em>{{(PriceArr[0] * Multiple).toFixed(2)}} ~ {{(PriceArr[1] * Multiple).toFixed(2)}}</em>元</span>
       </div>
-      <a @click="ToPostBetting" :class="{'active': CurrentStoreId !== null && LanQiuCart.length}">立即购买</a>
+      <a :class="{'active': CurrentStoreId !== null && LanQiuCart.length}" @click="ToPostBetting">立即购买</a>
     </div>
 
     <div class="Layer" v-if="ShowPassWay">
           <a v-for="(item, index) in FootballKeys.passes" :key="index" v-if="item.unitNum <= PageList.length && item.unitNum > 2 && item.amount !== 1" :class="{'active': item.passCode === CurrentPassCode}" @click="CutPassCode(item)">{{item.name}}</a>
         </nav>
         <div class="Bottom flex-h">
-          <a class="flex-item" @click="CurrentPassCode = null; ShowPassWay = false">取消</a>
+          <a class="flex-item" @click="ShowPassWay = false">取消</a>
           <a class="flex-item active" @click="ShowPassWay = false">确定</a>
         </div>
       </div>
 <script>
 import { Switch } from 'vant'
 import GetAllParts from '../../../util/Sports'
+import GetPrice from '../../../util/Basketball'
 import { mapState, mapMutations, createNamespacedHelpers } from 'vuex'
 const { mapState: mapUserState, mapActions: mapUserActions, mapMutations: mapUserMutations } = createNamespacedHelpers('user')
 export default {
   name: '',
   data () {
     return {
-      AllPartsCounts: 0,
+      PriceArr: [0, 0], // 奖金区间
       AllParts: [], // 投注生成结果
       CurrentPassUnitNum: 0,
       CurrentPassAmount: 0,
       Multiple: 1, // 倍数
       ShowStore: false, // 是否显示店铺选择弹窗
       TotalCount: 0, // 总注数
-      TotalPrize: 0, // 总金额
+      TotalPrice: 0, // 总金额
       PageList: [],
       DataLock: false
     }
       FootballKeys: x => x.FootballKeys // 竞彩字典
     }),
     ...mapUserState({
+      UserInfo: x => x.UserInfo, // 用户信息
       LanQiuCart: x => x.LanQiuCart // 篮球购物车
     })
   },
   created () {
     this.EditMainData([ // 配置页面框架数据
       { name: 'ShowMainHeader', value: true },
-      { name: 'MainHeaderTitle', value: '篮球' },
+      { name: 'MainHeaderTitle', value: '足球' },
       { name: 'ShowMainHeaderBack', value: true }
     ])
-    this.PageList = [...this.LanQiuCart]
-    console.log(this.PageList)
-    if (this.$route.query.type === 'single') {
-      this.CurrentPassCode = '1＊1'
-    }
-    this.CheckOrderCount() // 计算订单倍数、金额
-    this.GetStoreList({
-      queryData: {
-        location: '114.16936109999999,22.3193039',
-        lotteryId: 'lottery'
-      }
-    }).then((res) => {
-      let StoreList = res.data.data.nearest || []
-      let RecommendStoreList = res.data.data.recommend || []
-      StoreList.map((item) => {
-        if (item.status - 0 === 1) {
-          this.StoreList.push(item)
-        }
-      })
-      RecommendStoreList.map((item) => {
-        if (item.status - 0 === 1) {
-          this.RecommendStoreList.push(item)
-        }
-      })
-    })
+    this.Init()
   },
   mounted () {
     this.$nextTick(() => {
       'PostBetting',
       'GetStoreList'
     ]),
-    ToGetAllParts () { // 获取投注数 & 金额
+    Init () { // 初始化
+      this.PageList = [...this.LanQiuCart] // 赋值页面数据
+      console.log(this.PageList)
+      this.ToGetStoreList() // 获取店铺列表
+      if (this.$route.query.type === 'single') { // 单关
+        this.CurrentPassCode = '1＊1'
+        this.ToGetAllParts() // 枚举投注
+      }
+    },
+    ToPostBetting () { // 去下注
+      if (this.DataLock || !this.LanQiuCart.length || this.CurrentStoreId === null || this.CurrentPassCode === null) return
+      this.DataLock = true
+      let Data = null
+      let ListData = []
+      this.LanQiuCart.map((item) => {
+        ListData.push({
+          matchId: item.id,
+          awayTeamId: item.awayTeamId, // 客队id
+          awayTeamName: item.awayTeamName, // 客队名称
+          homeTeamId: item.homeTeamId, // 主队id
+          homeTeamName: item.homeTeamName, // 主队名称
+          detailList: this.ReturnDeatilList(item.list, item.id)
+        })
+      })
+      Data = {
+        expectedEarning: `${this.PriceArr[0].toFixed(2)}~${this.PriceArr[1].toFixed(2)}元`, // 预期奖金
+        customerId: this.UserInfo.customerId, // 用户id
+        isDigit: false, // 是否数字彩
+        isSport: true, // 是否体彩
+        itemList: [...ListData], // 购彩方案
+        lotteryId: 'football', // 彩种ID
+        notesNum: this.TotalCount, // 总注数
+        passCode: this.CurrentPassCode, // 过关方式
+        shopId: this.CurrentStoreId, // 店铺ID
+        times: this.Multiple, // 倍数
+        totalPrice: this.TotalPrice * 100 // 总金额
+      }
+      this.PostBetting({
+        urlData: { id: 'football' },
+        data: { ...Data }
+      }).then((res) => {
+        this.Toast('投注成功！')
+        this.EmptyLanQiuCart()
+        this.PageList = []
+        this.PriceArr = [0, 0]
+        this.TotalCount = 0
+        this.TotalPrice = 0
+        this.Multiple = 1
+        this.DataLock = false
+      }).catch((res) => {
+        this.Toast(res.data.message)
+        this.DataLock = false
+      })
+    },
+    ToGetStoreList () { // 获取店铺列表
+      this.GetStoreList({
+        queryData: {
+          location: '114.16936109999999,22.3193039',
+          lotteryId: 'lottery'
+        }
+      }).then((res) => {
+        let StoreList = res.data.data.nearest || []
+        let RecommendStoreList = res.data.data.recommend || []
+        StoreList.map((item) => {
+          if (item.status - 0 === 1) {
+            this.StoreList.push(item)
+          }
+        })
+        RecommendStoreList.map((item) => {
+          if (item.status - 0 === 1) {
+            this.RecommendStoreList.push(item)
+          }
+        })
+      })
+    },
+    ToGetAllParts () { // 枚举投注
       let ListData = []
       this.LanQiuCart.map((item) => {
         ListData.push({
           matchId: item.id,
+          spreadPoints: item.rq,
+          presetPoints: item.ys,
           awayTeamId: item.awayTeamId, // 客队id
           awayTeamName: item.awayTeamName, // 客队名称
           homeTeamId: item.homeTeamId, // 主队id
         }
       })
       this.AllParts = GetAllParts([...ListData], PassTarget).allParts
-      console.log(this.AllParts)
-      this.AllPartsCounts = GetAllParts([...ListData], PassTarget).sum
+      this.TotalCount = GetAllParts([...ListData], PassTarget).sum
+      this.TotalPrice = this.TotalCount * 2 * this.Multiple
+      this.PriceArr = GetPrice(this.AllParts)
+      console.log(JSON.stringify(this.AllParts))
     },
-    CalcRes () { // 计算投注数、金额
-      if (this.CurrentPassCode === null) {
-        this.TotalCount = 0
-        this.TotalPrize = 0
-      } else {
-        if (this.CurrentPassAmount === 1) { // 自由过关
-
-        } else { // 多串过关
-
-        }
-      }
+    ReturnDeatilList (list, pid) {
+      let Arr = []
+      list.map((item) => {
+        Arr.push({
+          matchId: pid,
+          odds: item.odds,
+          ruleCode: item.ruleCode,
+          wayCode: item.wayCode
+        })
+      })
+      return Arr || []
     },
     CutPassCode (item) { // 切换串法
+      if (this.DataLock) return
+      this.DataLock = true
       if (this.CurrentPassCode === item.passCode) {
         this.CurrentPassCode = null
         this.CurrentPassName = null
         this.CurrentPassUnitNum = 0
         this.CurrentPassAmount = 0
+        this.TotalCount = 0
+        this.TotalPrice = 0
+        this.PriceArr = [0, 0]
       } else {
         this.CurrentPassCode = item.passCode
         this.CurrentPassName = item.name
         this.CurrentPassUnitNum = item.unitNum
         this.CurrentPassAmount = item.amount
+        this.ToGetAllParts()
       }
-      this.CalcRes()
-      this.ToGetAllParts()
-    },
-    CalcTotalCount () {
-      let Count = 0
-      this.LanQiuCart.map((item) => {
-        item.list.map(() => {
-          Count += 1
-        })
-      })
-      return Count || 0
+      this.DataLock = false
     },
     SelectStore (item) { // 选择店铺
       if (this.DataLock) return
       this.CurrentStoreId = item.shopId === this.CurrentStoreId ? null : item.shopId
       this.DataLock = false
     },
-    ReturnDeatilList (list, pid) {
-      let Arr = []
-      list.map((item) => {
-        Arr.push({
-          matchId: pid,
-          odds: item.odds,
-          ruleCode: item.ruleCode,
-          wayCode: item.wayCode
-        })
-      })
-      return Arr || []
-    },
-    ToPostBetting () { // 去下注
-      if (this.DataLock || !this.LanQiuCart.length || this.CurrentStoreId === null || this.CurrentPassCode !== null) return
-      this.DataLock = true
-      let ListData = []
-      let Data = null
-      if (this.$route.type === 'single') {
-        this.LanQiuCart.map((item) => {
-          ListData.push({
-            matchId: item.id,
-            awayTeamId: item.awayTeamId, // 客队id
-            awayTeamName: item.awayTeamName, // 客队名称
-            homeTeamId: item.homeTeamId, // 主队id
-            homeTeamName: item.homeTeamName, // 主队名称
-            amount: this.Multiple * item.list.length, // 购买注数
-            charges: this.Multiple * 2 * 100, // 价格
-            detailList: this.ReturnDeatilList(item.list, item.id)
-          })
-        })
-      } else {
-        ListData = [...this.AllParts]
-      }
-      Data = {
-        itemList: [...ListData], // 这个是详细购买方案的列表
-        lotteryId: 'basketball', // 彩种ID
-        notesNum: this.AllPartsCounts, // 总注数
-        shopId: this.CurrentStoreId, // 店铺ID
-        times: this.Multiple, // 倍数
-        passCode: this.CurrentPassCode, // 过关方式
-        // totalPrice: this.TotalPrize * this.Multiple * 100 // 总金额
-        totalPrice: this.CalcTotalCount() * this.Multiple * 2 * 100 // 总金额
-      }
-      this.PostBetting({
-        urlData: { id: 'basketball' },
-        data: { ...Data }
-      }).then((res) => {
-        this.Toast('投注成功！')
-        this.EmptyLanQiuCart()
-        this.PageList = []
-        this.TotalCount = 0
-        this.TotalPrize = 0
-        this.Multiple = 1
-        this.DataLock = false
-      }).catch((res) => {
-        this.Toast(res.data.message)
-        this.DataLock = false
-      })
-    },
-    SwitchChange () { // 追加状态改变
-      this.CheckOrderCount()
-    },
     DeleteItem (index) { // 删除投注
+      if (this.DataLock) return
+      this.DataLock = true
       this.DeleteLanQiuCart(index)
       this.PageList = [...this.LanQiuCart]
-      this.CheckOrderCount()
-    },
-    ReturnType (item) {
-      if (item.FirstRes.Dan.length || item.LastRes.Dan.length) {
-        return '拖胆'
-      } else if (item.Count > 1) {
-        return '复式'
-      } else {
-        return '单式'
+      if (this.$route.query.type === 'mix') {
+        this.CurrentPassCode = null
       }
+      this.TotalPrice = 0
+      this.TotalCount = 0
+      this.PriceArr = [0, 0]
+      this.DataLock = false
     },
     MultipleLess (item) { // 减少倍数
       if (item.Multiple > 1 && !this.DataLock) {
         this.DataLock = true
         item.Multiple -= 1
-        this.CheckOrderCount() // 计算订单倍数、金额
+        this.TotalPrice = this.TotalCount * 2 * this.Multiple
         this.DataLock = false
       }
     },
       if (!this.DataLock) {
         this.DataLock = true
         item.Multiple += 1
-        this.CheckOrderCount() // 计算订单倍数、金额
+        this.TotalPrice = this.TotalCount * 2 * this.Multiple
         this.DataLock = false
       }
-    },
-    CheckOrderCount () { // 计算订单倍数、金额
-      // let Count = 0 // 注数
-      // let Money = 0 // 金额
-      // let ItemPrize = this.IsAdd ? 3 : 2
-      // this.PageList.map((item) => {
-      //   Count += item.Count
-      //   Money += item.Count * ItemPrize
-      // })
-      // this.TotalCount = Count
-      // this.TotalPrize = Money
     }
   }
 }

src/pages/index/ZuQiuDingDan/page.scss

+.Page {
+  background: #f8f8f8;
+  position: relative;
+  overflow: hidden;
+  > div {
+    &.flex-item {
+      position: relative;
+      overflow: hidden;
+      z-index: 1;
+      > div {
+        width: 100%;
+        position: absolute;
+        left: 0;
+        top: 0;
+        bottom: 0;
+        overflow-y: scroll;
+        -webkit-overflow-scrolling: touch;
+        > ul {
+          padding: 0.15rem;
+          position: relative;
+          > li {
+            background: #fff;
+            position: relative;
+            overflow: visible;
+            padding: 0.15rem;
+            box-shadow: 0 0 0.02rem 0.02rem rgba(0, 0, 0, 0.05);
+            margin-top: 0.15rem;
+            border-radius: 0.06rem;
+            &:first-child {
+              margin-top: 0;
+            }
+            > .Close {
+              display: inline-block;
+              position: absolute;
+              right: 0;
+              top: 0;
+              font-size: 0.2rem;
+              color: #999;
+            }
+            > .Title {
+              align-items: center;
+              > span {
+                font-size: 0.12rem;
+                color: #999;
+                line-height: 0.2rem;
+              }
+              > div {
+                position: relative;
+                margin-left: 0.15rem;
+                > div {
+                  width: 100%;
+                  position: relative;
+                  overflow: hidden;
+                  > span {
+                    display: block;
+                    white-space: nowrap;
+                    font-size: 0.12rem;
+                    line-height: 0.2rem;
+                    overflow: hidden;
+                    text-overflow: ellipsis;
+                  }
+                }
+              }
+            }
+            > .List {
+              font-size: 0;
+              > span {
+                display: inline-block;
+                vertical-align: middle;
+                font-size: 0.12rem;
+                line-height: 0.2rem;
+                margin-top: 0.05rem;
+                margin-right: 0.05rem;
+                color: #fff;
+                background: #ff5200;
+                padding: 0 0.1rem;
+              }
+            }
+          }
+        }
+        > .OtherTab {
+          padding: 0 0.15rem;
+          position: relative;
+          margin-bottom: 0.15rem;
+          > div {
+            background: #fff;
+            border-radius: 0.06rem;
+            box-shadow: 0 0 0.02rem 0.02rem rgba(0, 0, 0, 0.05);
+            > div {
+              padding: 0.15rem;
+              border-top: 0.01rem solid #f7f7f7;
+              align-items: center;
+              &:first-child {
+                border-top: none;
+              }
+              > span {
+                &:nth-child(1) {
+                  font-size: 0.15rem;
+                  color: #666;
+                  line-height: 0.2rem;
+                }
+                &:nth-child(2) {
+                  display: inline-block;
+                  margin-left: 0.1rem;
+                  position: relative;
+                  overflow: hidden;
+                  border: 0.01rem solid #f7f7f7;
+                  border-radius: 0.03rem;
+                  font-size: 0;
+                  white-space: nowrap;
+                  > * {
+                    display: inline-block;
+                    vertical-align: middle;
+                    font-size: 0.14rem;
+                    color: #999;
+                    line-height: 0.2rem;
+                    border-left: 0.01rem solid #f7f7f7;
+                    &:first-child {
+                      border: none;
+                      border-right: 0.01rem solid #f7f7f7;
+                    }
+                  }
+                  > a {
+                    width: 0.2rem;
+                    text-align: center;
+                  }
+                  > input {
+                    border: none;
+                    width: 0.35rem;
+                    text-align: center;
+                    color: #333;
+                    &:disabled {
+                      color: #333;
+                    }
+                  }
+                  > span {
+                    border: none;
+                    margin-right: 0.03rem;
+                  }
+                }
+              }
+            }
+          }
+        }
+      }
+    }
+    &.Bottom {
+      background: #fff;
+      position: relative;
+      overflow: hidden;
+      box-shadow: 0 0 0.02rem 0.02rem rgba(0, 0, 0, 0.05);
+      z-index: 2;
+      padding: 0.15rem;
+      padding-bottom: 0.2rem;
+      > .Store {
+        font-size: 0;
+        text-align: center;
+        > a {
+          display: inline-block;
+          font-size: 0.14rem;
+          color: #333;
+          line-height: 0.2rem;
+          max-width: 100%;
+          overflow: hidden;
+          white-space: nowrap;
+          text-overflow: ellipsis;
+        }
+      }
+      > .Chuan {
+        margin: 0.1rem 0;
+        > span {
+          font-size: 0.14rem;
+          line-height: 0.2rem;
+          display: block;
+          white-space: nowrap;
+          overflow: hidden;
+          text-align: center;
+          text-overflow: ellipsis;
+        }
+      }
+      > .Count {
+        font-size: 0;
+        text-align: center;
+        white-space: nowrap;
+        margin-top: 0.05rem;
+        > span {
+          display: inline-block;
+          vertical-align: middle;
+          font-size: 0.12rem;
+          color: #333;
+          line-height: 0.2rem;
+          margin-left: 0.1rem;
+          &:first-child {
+            margin-left: 0;
+          }
+          > em {
+            color: #d91d36;
+            font-size: 0.12rem;
+            line-height: 0.2rem;
+            font-weight: bold;
+          }
+        }
+      }
+      > a {
+        display: block;
+        text-align: center;
+        font-size: 0.16rem;
+        line-height: 0.42rem;
+        background: #ccc;
+        border-radius: 0.06rem;
+        color: #fff;
+        margin-top: 0.1rem;
+        &.active {
+          background: #ff5200;
+        }
+      }
+    }
+    &.Layer {
+      width: 100%;
+      position: absolute;
+      left: 0;
+      top: 0;
+      bottom: 0;
+      z-index: 10;
+      background: rgba(0, 0, 0, 0.7);
+      > div {
+        width: 80%;
+        background: #fff;
+        border-radius: 0.06rem;
+        position: relative;
+        overflow: hidden;
+        padding-top: 0.15rem;
+        > span {
+          font-size: 0.14rem;
+          font-weight: bold;
+          color: #000;
+          line-height: 0.3rem;
+          display: block;
+          text-indent: 0.15rem;
+        }
+        > nav {
+          font-size: 0;
+          padding: 0 0.15rem;
+          > a {
+            display: inline-block;
+            font-size: 0.12rem;
+            color: #666;
+            border: 0.01rem solid #666;
+            border-radius: 0.03rem;
+            line-height: 0.2rem;
+            padding: 0 0.15rem;
+            margin-bottom: 0.1rem;
+            margin-right: 0.1rem;
+            &.active {
+              color: #fff;
+              background: #ff5200;
+              border-color: #ff5200;
+            }
+          }
+        }
+        > ul {
+          padding: 0 0.15rem;
+          position: relative;
+          overflow: hidden;
+          &.ScrollList {
+            max-height: 2.5rem;
+            overflow-y: scroll;
+            -webkit-overflow-scrolling: touch;
+          }
+          > li {
+            align-items: center;
+            border-top: 0.01rem solid #f7f7f7;
+            &:first-child {
+              border: none;
+            }
+            > div {
+              position: relative;
+              > div {
+                width: 100%;
+                position: relative;
+                > span {
+                  display: block;
+                  white-space: nowrap;
+                  overflow: hidden;
+                  text-overflow: ellipsis;
+                  font-size: 0.14rem;
+                  color: #333;
+                  line-height: 0.42rem;
+                }
+              }
+            }
+            > span {
+              font-size: 0.14rem;
+              color: #999;
+              margin-right: 0.1rem;
+            }
+            > i {
+              font-size: 0.2rem;
+              color: #999;
+              &.active {
+                color: #ff5200;
+              }
+            }
+          }
+        }
+        > .Bottom {
+          border-top: 0.01rem solid #f7f7f7;
+          > a {
+            font-size: 0.16rem;
+            line-height: 0.42rem;
+            text-align: center;
+            border-left: 0.01rem solid #f7f7f7;
+            &.active {
+              color: #ff5200;
+            }
+            &:first-child {
+              border: none;
+            }
+          }
+        }
+      }
+    }
+  }
+}

src/router/index.js

             path: '/index/ZuQiu', // 足球
             name: 'ZuQiu',
             component: resolve => (require(['@/pages/index/ZuQiu'], resolve))
+          }, {
+            path: '/index/ZuQiuDingDan', // 足球订单
+            name: 'ZuQiuDingDan',
+            component: resolve => (require(['@/pages/index/ZuQiuDingDan'], resolve))
           }, {
             path: '/index/LanQiu', // 篮球
             name: 'LanQiu',

src/util/Basketball.js

   let minPrice
   let maxPrice
 
-  debugger
-
   // 遍历模拟比赛的各种可能
   matches.forEach(match => {
     const [min, max] = GetMinAndMax(allParts, match)