added logic for get timetogame and object doubledata

luckydiamond/src/pages/games-pages/DoublePage.vue

@@ -6,6 +6,7 @@
     <div class="bg-gradient-left"></div>
     <section class="double">
       <h1>double</h1>
+      <h2 v-if="timeToGame !== null">time to game - {{ timeToGame.toFixed(0) }}</h2>
       <div class="jackpot-game">
         <div class="bootstrap-wrapper">
           <div class="container">
@@ -63,11 +64,15 @@ export default {
   },
   setup() {
     const slides = reactive([])
+    let doubleData = reactive({})
+
     let autoPlay = ref(0)
     let targetColor = ref('')
+    let timeToGame = ref(0)
     let endGame = ref(false)
 
     onMounted(() => {
+      if (slides.length == 0) {
         for (let i = 1; i < 29; i++) {
           if (i === 15) {
             slides.push({
@@ -92,18 +97,22 @@ export default {
             }
           }
         }
+      }
 
       eventBus.on('doubleGame', (dataDouble) => {
         const dataDoubleParse = JSON.parse(dataDouble)
+        doubleData = Object.assign(doubleData, dataDoubleParse)
         console.log(dataDoubleParse)
 
+        timeToGame.value = doubleData.WaitingTime
+
         if (dataDoubleParse.Status === 'InGame') {
           autoPlay.value = 500
           targetColor.value = dataDoubleParse.WInColor
         }
         else if (dataDoubleParse.Status === 'GameEnd') {
           endGame.value = true
-          autoPlay.value = 200
+          autoPlay.value = 350
         }
       })
     })
@@ -126,7 +135,7 @@ export default {
       autoPlay.value = 0;
     }
 
-    return { slides, autoPlay, handleStepCarousel, stopAutoPlay, targetColor };
+    return { slides, autoPlay, doubleData, targetColor, timeToGame, handleStepCarousel, stopAutoPlay };
   },
 }
 </script>