yuantianjiao 6 年 前
コミット
959c57ff68

+ 1
- 1
dist/index.html ファイルの表示

@@ -4,4 +4,4 @@
4 4
         overflow-x: hidden;
5 5
         overflow-y: scroll;
6 6
         -webkit-overflow-scrolling: touch;
7
-      }</style><link href=./static/css/app.6007a8f11a7cabe0778472191d8bcfeb.css rel=stylesheet></head><body><div id=app></div><script type=text/javascript src=./static/js/manifest.3ad1d5771e9b13dbdad2.js></script><script type=text/javascript src=./static/js/vendor.2a96777d0d5038fab28c.js></script><script type=text/javascript src=./static/js/app.2c14deca9a16434eb54b.js></script></body></html>
7
+      }</style><link href=./static/css/app.a60b8a0ad8e3a10ee8e2bc3d55dadbe1.css rel=stylesheet></head><body><div id=app></div><script type=text/javascript src=./static/js/manifest.3ad1d5771e9b13dbdad2.js></script><script type=text/javascript src=./static/js/vendor.2a96777d0d5038fab28c.js></script><script type=text/javascript src=./static/js/app.6edd65e851d0deaa174e.js></script></body></html>

+ 0
- 2
dist/static/css/app.6007a8f11a7cabe0778472191d8bcfeb.css
ファイル差分が大きすぎるため省略します
ファイルの表示


+ 0
- 1
dist/static/css/app.6007a8f11a7cabe0778472191d8bcfeb.css.map
ファイル差分が大きすぎるため省略します
ファイルの表示


+ 2
- 0
dist/static/css/app.a60b8a0ad8e3a10ee8e2bc3d55dadbe1.css
ファイル差分が大きすぎるため省略します
ファイルの表示


+ 1
- 0
dist/static/css/app.a60b8a0ad8e3a10ee8e2bc3d55dadbe1.css.map
ファイル差分が大きすぎるため省略します
ファイルの表示


バイナリ
dist/static/img/end.6bf7f9a.png ファイルの表示


バイナリ
dist/static/img/start.cfc7786.png ファイルの表示


+ 0
- 2
dist/static/js/app.2c14deca9a16434eb54b.js
ファイル差分が大きすぎるため省略します
ファイルの表示


+ 0
- 1
dist/static/js/app.2c14deca9a16434eb54b.js.map
ファイル差分が大きすぎるため省略します
ファイルの表示


+ 2
- 0
dist/static/js/app.6edd65e851d0deaa174e.js
ファイル差分が大きすぎるため省略します
ファイルの表示


+ 1
- 0
dist/static/js/app.6edd65e851d0deaa174e.js.map
ファイル差分が大きすぎるため省略します
ファイルの表示


+ 1
- 1
dist/static/js/manifest.3ad1d5771e9b13dbdad2.js.map ファイルの表示

@@ -1 +1 @@
1
-{"version":3,"sources":["webpack:///webpack/bootstrap 8a12b9db6b1eb7477c25"],"names":["parentJsonpFunction","window","chunkIds","moreModules","executeModules","moduleId","chunkId","result","i","resolves","length","installedChunks","push","Object","prototype","hasOwnProperty","call","modules","shift","__webpack_require__","s","installedModules","2","exports","module","l","m","c","d","name","getter","o","defineProperty","configurable","enumerable","get","n","__esModule","object","property","p","oe","err","console","error"],"mappings":"aACA,IAAAA,EAAAC,OAAA,aACAA,OAAA,sBAAAC,EAAAC,EAAAC,GAIA,IADA,IAAAC,EAAAC,EAAAC,EAAAC,EAAA,EAAAC,KACQD,EAAAN,EAAAQ,OAAoBF,IAC5BF,EAAAJ,EAAAM,GACAG,EAAAL,IACAG,EAAAG,KAAAD,EAAAL,GAAA,IAEAK,EAAAL,GAAA,EAEA,IAAAD,KAAAF,EACAU,OAAAC,UAAAC,eAAAC,KAAAb,EAAAE,KACAY,EAAAZ,GAAAF,EAAAE,IAIA,IADAL,KAAAE,EAAAC,EAAAC,GACAK,EAAAC,QACAD,EAAAS,OAAAT,GAEA,GAAAL,EACA,IAAAI,EAAA,EAAYA,EAAAJ,EAAAM,OAA2BF,IACvCD,EAAAY,IAAAC,EAAAhB,EAAAI,IAGA,OAAAD,GAIA,IAAAc,KAGAV,GACAW,EAAA,GAIA,SAAAH,EAAAd,GAGA,GAAAgB,EAAAhB,GACA,OAAAgB,EAAAhB,GAAAkB,QAGA,IAAAC,EAAAH,EAAAhB,IACAG,EAAAH,EACAoB,GAAA,EACAF,YAUA,OANAN,EAAAZ,GAAAW,KAAAQ,EAAAD,QAAAC,IAAAD,QAAAJ,GAGAK,EAAAC,GAAA,EAGAD,EAAAD,QAKAJ,EAAAO,EAAAT,EAGAE,EAAAQ,EAAAN,EAGAF,EAAAS,EAAA,SAAAL,EAAAM,EAAAC,GACAX,EAAAY,EAAAR,EAAAM,IACAhB,OAAAmB,eAAAT,EAAAM,GACAI,cAAA,EACAC,YAAA,EACAC,IAAAL,KAMAX,EAAAiB,EAAA,SAAAZ,GACA,IAAAM,EAAAN,KAAAa,WACA,WAA2B,OAAAb,EAAA,SAC3B,WAAiC,OAAAA,GAEjC,OADAL,EAAAS,EAAAE,EAAA,IAAAA,GACAA,GAIAX,EAAAY,EAAA,SAAAO,EAAAC,GAAsD,OAAA1B,OAAAC,UAAAC,eAAAC,KAAAsB,EAAAC,IAGtDpB,EAAAqB,EAAA,KAGArB,EAAAsB,GAAA,SAAAC,GAA8D,MAApBC,QAAAC,MAAAF,GAAoBA","file":"static/js/manifest.3ad1d5771e9b13dbdad2.js","sourcesContent":[" \t// install a JSONP callback for chunk loading\n \tvar parentJsonpFunction = window[\"webpackJsonp\"];\n \twindow[\"webpackJsonp\"] = function webpackJsonpCallback(chunkIds, moreModules, executeModules) {\n \t\t// add \"moreModules\" to the modules object,\n \t\t// then flag all \"chunkIds\" as loaded and fire callback\n \t\tvar moduleId, chunkId, i = 0, resolves = [], result;\n \t\tfor(;i < chunkIds.length; i++) {\n \t\t\tchunkId = chunkIds[i];\n \t\t\tif(installedChunks[chunkId]) {\n \t\t\t\tresolves.push(installedChunks[chunkId][0]);\n \t\t\t}\n \t\t\tinstalledChunks[chunkId] = 0;\n \t\t}\n \t\tfor(moduleId in moreModules) {\n \t\t\tif(Object.prototype.hasOwnProperty.call(moreModules, moduleId)) {\n \t\t\t\tmodules[moduleId] = moreModules[moduleId];\n \t\t\t}\n \t\t}\n \t\tif(parentJsonpFunction) parentJsonpFunction(chunkIds, moreModules, executeModules);\n \t\twhile(resolves.length) {\n \t\t\tresolves.shift()();\n \t\t}\n \t\tif(executeModules) {\n \t\t\tfor(i=0; i < executeModules.length; i++) {\n \t\t\t\tresult = __webpack_require__(__webpack_require__.s = executeModules[i]);\n \t\t\t}\n \t\t}\n \t\treturn result;\n \t};\n\n \t// The module cache\n \tvar installedModules = {};\n\n \t// objects to store loaded and loading chunks\n \tvar installedChunks = {\n \t\t2: 0\n \t};\n\n \t// The require function\n \tfunction __webpack_require__(moduleId) {\n\n \t\t// Check if module is in cache\n \t\tif(installedModules[moduleId]) {\n \t\t\treturn installedModules[moduleId].exports;\n \t\t}\n \t\t// Create a new module (and put it into the cache)\n \t\tvar module = installedModules[moduleId] = {\n \t\t\ti: moduleId,\n \t\t\tl: false,\n \t\t\texports: {}\n \t\t};\n\n \t\t// Execute the module function\n \t\tmodules[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n\n \t\t// Flag the module as loaded\n \t\tmodule.l = true;\n\n \t\t// Return the exports of the module\n \t\treturn module.exports;\n \t}\n\n\n \t// expose the modules object (__webpack_modules__)\n \t__webpack_require__.m = modules;\n\n \t// expose the module cache\n \t__webpack_require__.c = installedModules;\n\n \t// define getter function for harmony exports\n \t__webpack_require__.d = function(exports, name, getter) {\n \t\tif(!__webpack_require__.o(exports, name)) {\n \t\t\tObject.defineProperty(exports, name, {\n \t\t\t\tconfigurable: false,\n \t\t\t\tenumerable: true,\n \t\t\t\tget: getter\n \t\t\t});\n \t\t}\n \t};\n\n \t// getDefaultExport function for compatibility with non-harmony modules\n \t__webpack_require__.n = function(module) {\n \t\tvar getter = module && module.__esModule ?\n \t\t\tfunction getDefault() { return module['default']; } :\n \t\t\tfunction getModuleExports() { return module; };\n \t\t__webpack_require__.d(getter, 'a', getter);\n \t\treturn getter;\n \t};\n\n \t// Object.prototype.hasOwnProperty.call\n \t__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };\n\n \t// __webpack_public_path__\n \t__webpack_require__.p = \"./\";\n\n \t// on error function for async loading\n \t__webpack_require__.oe = function(err) { console.error(err); throw err; };\n\n\n\n// WEBPACK FOOTER //\n// webpack/bootstrap 8a12b9db6b1eb7477c25"],"sourceRoot":""}
1
+{"version":3,"sources":["webpack:///webpack/bootstrap 37de3ffac77befd53fb6"],"names":["parentJsonpFunction","window","chunkIds","moreModules","executeModules","moduleId","chunkId","result","i","resolves","length","installedChunks","push","Object","prototype","hasOwnProperty","call","modules","shift","__webpack_require__","s","installedModules","2","exports","module","l","m","c","d","name","getter","o","defineProperty","configurable","enumerable","get","n","__esModule","object","property","p","oe","err","console","error"],"mappings":"aACA,IAAAA,EAAAC,OAAA,aACAA,OAAA,sBAAAC,EAAAC,EAAAC,GAIA,IADA,IAAAC,EAAAC,EAAAC,EAAAC,EAAA,EAAAC,KACQD,EAAAN,EAAAQ,OAAoBF,IAC5BF,EAAAJ,EAAAM,GACAG,EAAAL,IACAG,EAAAG,KAAAD,EAAAL,GAAA,IAEAK,EAAAL,GAAA,EAEA,IAAAD,KAAAF,EACAU,OAAAC,UAAAC,eAAAC,KAAAb,EAAAE,KACAY,EAAAZ,GAAAF,EAAAE,IAIA,IADAL,KAAAE,EAAAC,EAAAC,GACAK,EAAAC,QACAD,EAAAS,OAAAT,GAEA,GAAAL,EACA,IAAAI,EAAA,EAAYA,EAAAJ,EAAAM,OAA2BF,IACvCD,EAAAY,IAAAC,EAAAhB,EAAAI,IAGA,OAAAD,GAIA,IAAAc,KAGAV,GACAW,EAAA,GAIA,SAAAH,EAAAd,GAGA,GAAAgB,EAAAhB,GACA,OAAAgB,EAAAhB,GAAAkB,QAGA,IAAAC,EAAAH,EAAAhB,IACAG,EAAAH,EACAoB,GAAA,EACAF,YAUA,OANAN,EAAAZ,GAAAW,KAAAQ,EAAAD,QAAAC,IAAAD,QAAAJ,GAGAK,EAAAC,GAAA,EAGAD,EAAAD,QAKAJ,EAAAO,EAAAT,EAGAE,EAAAQ,EAAAN,EAGAF,EAAAS,EAAA,SAAAL,EAAAM,EAAAC,GACAX,EAAAY,EAAAR,EAAAM,IACAhB,OAAAmB,eAAAT,EAAAM,GACAI,cAAA,EACAC,YAAA,EACAC,IAAAL,KAMAX,EAAAiB,EAAA,SAAAZ,GACA,IAAAM,EAAAN,KAAAa,WACA,WAA2B,OAAAb,EAAA,SAC3B,WAAiC,OAAAA,GAEjC,OADAL,EAAAS,EAAAE,EAAA,IAAAA,GACAA,GAIAX,EAAAY,EAAA,SAAAO,EAAAC,GAAsD,OAAA1B,OAAAC,UAAAC,eAAAC,KAAAsB,EAAAC,IAGtDpB,EAAAqB,EAAA,KAGArB,EAAAsB,GAAA,SAAAC,GAA8D,MAApBC,QAAAC,MAAAF,GAAoBA","file":"static/js/manifest.3ad1d5771e9b13dbdad2.js","sourcesContent":[" \t// install a JSONP callback for chunk loading\n \tvar parentJsonpFunction = window[\"webpackJsonp\"];\n \twindow[\"webpackJsonp\"] = function webpackJsonpCallback(chunkIds, moreModules, executeModules) {\n \t\t// add \"moreModules\" to the modules object,\n \t\t// then flag all \"chunkIds\" as loaded and fire callback\n \t\tvar moduleId, chunkId, i = 0, resolves = [], result;\n \t\tfor(;i < chunkIds.length; i++) {\n \t\t\tchunkId = chunkIds[i];\n \t\t\tif(installedChunks[chunkId]) {\n \t\t\t\tresolves.push(installedChunks[chunkId][0]);\n \t\t\t}\n \t\t\tinstalledChunks[chunkId] = 0;\n \t\t}\n \t\tfor(moduleId in moreModules) {\n \t\t\tif(Object.prototype.hasOwnProperty.call(moreModules, moduleId)) {\n \t\t\t\tmodules[moduleId] = moreModules[moduleId];\n \t\t\t}\n \t\t}\n \t\tif(parentJsonpFunction) parentJsonpFunction(chunkIds, moreModules, executeModules);\n \t\twhile(resolves.length) {\n \t\t\tresolves.shift()();\n \t\t}\n \t\tif(executeModules) {\n \t\t\tfor(i=0; i < executeModules.length; i++) {\n \t\t\t\tresult = __webpack_require__(__webpack_require__.s = executeModules[i]);\n \t\t\t}\n \t\t}\n \t\treturn result;\n \t};\n\n \t// The module cache\n \tvar installedModules = {};\n\n \t// objects to store loaded and loading chunks\n \tvar installedChunks = {\n \t\t2: 0\n \t};\n\n \t// The require function\n \tfunction __webpack_require__(moduleId) {\n\n \t\t// Check if module is in cache\n \t\tif(installedModules[moduleId]) {\n \t\t\treturn installedModules[moduleId].exports;\n \t\t}\n \t\t// Create a new module (and put it into the cache)\n \t\tvar module = installedModules[moduleId] = {\n \t\t\ti: moduleId,\n \t\t\tl: false,\n \t\t\texports: {}\n \t\t};\n\n \t\t// Execute the module function\n \t\tmodules[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n\n \t\t// Flag the module as loaded\n \t\tmodule.l = true;\n\n \t\t// Return the exports of the module\n \t\treturn module.exports;\n \t}\n\n\n \t// expose the modules object (__webpack_modules__)\n \t__webpack_require__.m = modules;\n\n \t// expose the module cache\n \t__webpack_require__.c = installedModules;\n\n \t// define getter function for harmony exports\n \t__webpack_require__.d = function(exports, name, getter) {\n \t\tif(!__webpack_require__.o(exports, name)) {\n \t\t\tObject.defineProperty(exports, name, {\n \t\t\t\tconfigurable: false,\n \t\t\t\tenumerable: true,\n \t\t\t\tget: getter\n \t\t\t});\n \t\t}\n \t};\n\n \t// getDefaultExport function for compatibility with non-harmony modules\n \t__webpack_require__.n = function(module) {\n \t\tvar getter = module && module.__esModule ?\n \t\t\tfunction getDefault() { return module['default']; } :\n \t\t\tfunction getModuleExports() { return module; };\n \t\t__webpack_require__.d(getter, 'a', getter);\n \t\treturn getter;\n \t};\n\n \t// Object.prototype.hasOwnProperty.call\n \t__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };\n\n \t// __webpack_public_path__\n \t__webpack_require__.p = \"./\";\n\n \t// on error function for async loading\n \t__webpack_require__.oe = function(err) { console.error(err); throw err; };\n\n\n\n// WEBPACK FOOTER //\n// webpack/bootstrap 37de3ffac77befd53fb6"],"sourceRoot":""}

バイナリ
src/assets/end.png ファイルの表示


バイナリ
src/assets/listBg.png ファイルの表示


バイナリ
src/assets/ruleBg.png ファイルの表示


バイナリ
src/assets/start.png ファイルの表示


+ 60
- 13
src/components/model3/index.vue ファイルの表示

@@ -20,13 +20,21 @@
20 20
       </div>
21 21
     </transition>
22 22
     <div class="scrape" ref='box'>
23
-      <div>小洋房</div>
24
-      <canvas ref='canvas'></canvas>
23
+      <img :src="end" v-if="status" alt="" class="scrape-img">
24
+      <img :src="start" v-else alt="" class="scrape-img">
25
+      <div v-if="status" class="scrape-prize">{{prizeData.prize.PrizeName}}</div>
26
+      <div v-else class="scrape-prize">悦见山别墅小洋房<span>5</span>折神券</div>
27
+      <canvas ref='canvas' v-if="!status"></canvas>
28
+      <div class="cover" v-if="cover.state" :class="{gray: activityStatus !== 1}">
29
+        <div class="cover-text" v-if="cover.title">{{cover.title}}</div>
30
+        <div class="cover-button" v-if="cover.button" @click="btnClick()">{{cover.button}}</div>
31
+      </div>
25 32
     </div>
26
-    <div class='times'>您当前还剩余<span>4</span>次抽奖机会 <p>再来一次</p></div>
33
+    <div class='times'>您当前还剩余<span>4</span>次抽奖机会 <p v-if="reload" @click="init()">再来一次</p></div>
27 34
     <div class="list-area">
28 35
       <div class="list-top"></div>
29 36
       <div class='winningList'>
37
+        <img :src="listBg" alt="" width='100%'>
30 38
         <div class='title'>
31 39
           <span>中奖名单</span>
32 40
         </div>
@@ -42,8 +50,9 @@
42 50
         </div>
43 51
       </div>
44 52
     </div>
45
-    <div>
53
+    <div class="rule-area">
46 54
       <div class='rule'>
55
+        <img :src="ruleBg" alt="" width='100%'>
47 56
         <div class='title'>
48 57
           <span>活动规则</span>
49 58
         </div>
@@ -60,6 +69,10 @@ import dialog from '@/assets/dialog.png'
60 69
 import lq from '@/assets/lq.png'
61 70
 import qrCode from '@/assets/qrCode.jpg'
62 71
 import icon from '@/assets/icon.png'
72
+import start from '@/assets/start.png'
73
+import end from '@/assets/end.png'
74
+import listBg from '@/assets/listBg.png'
75
+import ruleBg from '@/assets/ruleBg.png'
63 76
 import { createNamespacedHelpers } from 'vuex'
64 77
 const { mapActions: mapAppActions } = createNamespacedHelpers('app')
65 78
 export default {
@@ -69,12 +82,22 @@ export default {
69 82
       qrCode,
70 83
       lq,
71 84
       icon,
85
+      start,
86
+      end,
87
+      listBg,
88
+      ruleBg,
72 89
       showDialog: false,
73 90
       showBtn: false,
74 91
       winning: '',
75 92
       jump: '',
76 93
       canvas: null,
77
-      area: 0
94
+      area: 0,
95
+      status: false,
96
+      cover: {
97
+        text: '',
98
+        button: '',
99
+        state: true
100
+      }
78 101
     }
79 102
   },
80 103
   props: ['prizeData', 'prizeNum', 'data', 'bg', 'activityStatus'],
@@ -84,14 +107,18 @@ export default {
84 107
   methods: {
85 108
     ...mapAppActions(['setRunState']),
86 109
     init () {
110
+      this.cover.state = true
111
+      this.status = false
112
+      this.reload = false
87 113
       this.$nextTick(() => {
88
-        // if (this.activityStatus === 0) {
89
-        //   this.square[4].title = '活动,未开始'
90
-        // } else if (this.activityStatus === 1) {
91
-        //   this.square[4].title = '立即,抽奖'
92
-        // } else if (this.activityStatus === 2) {
93
-        //   this.square[4].title = '活动,已结束'
94
-        // }
114
+        if (this.activityStatus === 0) {
115
+          this.cover.button = '活动未开始'
116
+        } else if (this.activityStatus === 1) {
117
+          this.cover.title = '刮一刮赢别墅五折优惠券'
118
+          this.cover.button = '点我刮奖'
119
+        } else if (this.activityStatus === 2) {
120
+          this.cover.button = '活动已结束'
121
+        }
95 122
         this.context = this.$refs.canvas.getContext('2d')
96 123
         // 画蒙布
97 124
         this.context.beginPath()
@@ -137,14 +164,16 @@ export default {
137 164
         }
138 165
       }
139 166
       if (scrapeNum > this.area * 0.3) {
167
+        this.status = true
140 168
         this.context.clearRect(0, 0, this.$refs.canvas.width, this.$refs.canvas.height)
141 169
         this.$refs.canvas.removeEventListener('touchmove', this.moveFunc, false)
142 170
         this.$refs.canvas.removeEventListener('touchend', this.endFunc, false)
143 171
         setTimeout(() => {
144 172
           this.showDialog = true
173
+          this.reload = true
145 174
         }, 300)
146 175
         this.setRunState(2)
147
-        // that.winning = this.prizeData.prize.PrizeName
176
+        this.winning = this.prizeData.prize.PrizeName
148 177
         // this.showBtn = this.prizeData.detail.Url ? 1 : 0
149 178
         // this.jump = this.prizeData.detail.Url
150 179
       }
@@ -158,6 +187,24 @@ export default {
158 187
     },
159 188
     run () {
160 189
       this.$emit('run')
190
+    },
191
+    btnClick () {
192
+      if (this.activityStatus === 0) {
193
+        this.$toast('活动未开始')
194
+      } else if (this.activityStatus === 1) {
195
+        this.run()
196
+      } else if (this.activityStatus === 2) {
197
+        this.$toast('活动已结束')
198
+      }
199
+    }
200
+  },
201
+  watch: {
202
+    prizeData: {
203
+      handler (cur, old) {
204
+        this.cover.state = false
205
+      },
206
+      immediate: false,
207
+      deep: false
161 208
     }
162 209
   }
163 210
 }

+ 82
- 21
src/components/model3/page.scss ファイルの表示

@@ -57,26 +57,67 @@
57 57
   .scrape{
58 58
     width: 3.35rem;
59 59
     height: 1.35rem;
60
-    background: #cec9c3;
61 60
     position: absolute;
62 61
     top: 1.7rem;
63 62
     left: 50%;
64 63
     transform: translateX(-50%);
65
-    div{
64
+    .scrape-img{
65
+      position: absolute;
66 66
       width: 100%;
67 67
       height: 100%;
68
+      top: 0;
69
+      left: 0;
70
+    }
71
+    .scrape-prize{
72
+      font-size: .16rem;
73
+      color: #fff;
74
+      background: #B4AFA8;
75
+      span{
76
+        font-size: .24rem;
77
+        color: red;
78
+      }
79
+    }
80
+    >div{
81
+      position: absolute;
82
+      width: 100%;
83
+      height: 1.15rem;
68 84
       display: flex;
69 85
       justify-content: center;
70 86
       align-items: center;
87
+      top: .1rem;
88
+      left: 0;
89
+      z-index: 1;
71 90
     }
72 91
     canvas{
73 92
       width: 100%;
74
-      height: 100%;
93
+      height: 1.15rem;
75 94
       position: absolute;
76
-      top: 0;
95
+      top: .1rem;
77 96
       left: 0;
78 97
       z-index: 2;
79 98
     }
99
+    .cover{
100
+      flex-flow: column nowrap;
101
+      z-index: 3;
102
+      background: #9D876D;
103
+      .cover-text{
104
+        font-size: .16rem;
105
+        color: #fff;
106
+        padding-bottom: .1rem;
107
+      }
108
+      .cover-button{
109
+        width: 1.3rem;
110
+        height: .4rem;
111
+        background:rgba(255,255,255,.25);
112
+        border-radius:4px;
113
+        font-size: .16rem;
114
+        color: #fff;
115
+        line-height: .4rem;
116
+      }
117
+    }
118
+    .gray{
119
+      background: #B4AFA8;
120
+    }
80 121
   }
81 122
   .times{
82 123
     position: absolute;
@@ -122,34 +163,37 @@
122 163
       transform: translateX(-50%);
123 164
     }
124 165
     .winningList {
125
-      width: 3.2rem;
126
-      height: 2.4rem;
166
+      width: 3.1rem;
167
+      // height: 2.5rem;
127 168
       position: absolute;
128 169
       top: 0.3rem;
129 170
       left: 50%;
130 171
       transform: translateX(-50%);
131
-      // background: #fff;
132
-      background-image: radial-gradient(15px at 4px 4px, transparent 50px, #fff 50px);
133
-      background-image: radial-gradient(15px at 4px 3.16rem, transparent 50px, #fff 50px);
134
-      background-image: radial-gradient(15px at 4px 4px, transparent 50px, #fff 50px);
135
-      background-image: radial-gradient(15px at 4px 4px, transparent 50px, #fff 50px);
136 172
       .title {
137 173
         display: flex;
138 174
         align-items: center;
139 175
         justify-content: center;
176
+        padding-top: .1rem;
177
+        position: absolute;
178
+        top: 0;
179
+        left: 0;
180
+        width: 100%;
181
+        font-weight: bold;
140 182
         img:nth-of-type(1) {
141 183
           width: 0.18rem;
142 184
         }
143 185
         span {
144 186
           font-size: 0.16rem;
145 187
           padding: 0 0.1rem;
146
-          color: #895B2F;
147 188
         }
148 189
       }
149 190
       .list {
150 191
         overflow-x: hidden;
151 192
         overflow-y: scroll;
152
-        height: 2.6rem;
193
+        height: 1.9rem;
194
+        position: absolute;
195
+        top: .3rem;
196
+        left: .1rem;
153 197
         div {
154 198
           display: flex;
155 199
           align-items: center;
@@ -167,15 +211,14 @@
167 211
             flex-flow: column nowrap;
168 212
             div{
169 213
               text-align: left;
170
-              color: #895B2F;
171 214
             }
172 215
             div:nth-last-of-type(1){
173 216
               font-family: initial;
217
+              color: #AAAAAA;
174 218
             }
175 219
           }
176 220
           span:nth-of-type(2) {
177 221
             text-align: right;
178
-            color: #895B2F;
179 222
           }
180 223
           // span:nth-of-type(1) {
181 224
           //   text-align: left;
@@ -203,33 +246,51 @@
203 246
         }
204 247
       }
205 248
     }
249
+  }
250
+  .rule-area{
251
+    width: 100%;
252
+    height: 3rem;
253
+    position: absolute;
254
+    top: 6.85rem;
255
+    left: 50%;
256
+    transform: translateX(-50%);
257
+    z-index: 2;
206 258
     .rule {
207
-      width: 2.8rem;
208
-      height: 2.4rem;
259
+      width: 3.1rem;
209 260
       position: absolute;
210
-      top: 3.2rem;
261
+      top: .2rem;
211 262
       left: 50%;
212 263
       transform: translateX(-50%);
213 264
       .title {
214 265
         display: flex;
215 266
         align-items: center;
216 267
         justify-content: center;
217
-        margin-bottom: 0.2rem;
268
+        padding-top: .1rem;
269
+        position: absolute;
270
+        top: 0;
271
+        left: 0;
272
+        width: 100%;
273
+        font-weight: bold;
218 274
         img:nth-of-type(1) {
219 275
           width: 0.18rem;
220 276
         }
221 277
         span {
222 278
           font-size: 0.16rem;
223 279
           padding: 0 0.1rem;
224
-          color: #895B2F;
225 280
         }
226 281
       }
227 282
       .content {
283
+        position: absolute;
284
+        top: .5rem;
285
+        left: 0;
286
+        width: 100%;
287
+        box-sizing: border-box;
288
+        padding: 0 .1rem;
228 289
         pre{
229 290
           white-space:pre-line;
230 291
           text-align: left;
231 292
           line-height: .18rem;
232
-          color: #895B2F;
293
+          color: #585858;
233 294
         }
234 295
       }
235 296
     }

+ 20
- 20
src/page/index/index.vue ファイルの表示

@@ -40,7 +40,7 @@ export default {
40 40
       jump: '',
41 41
       model: 0,
42 42
       showPage: false,
43
-      activityStatus: 0
43
+      activityStatus: 1
44 44
     }
45 45
   },
46 46
   components: {
@@ -49,25 +49,25 @@ export default {
49 49
     model3
50 50
   },
51 51
   created () {
52
-    this.showPage = true
53
-    this.model = 3 // 模板
54
-    // if (location.search && this.toolClass.UrlSearch(location.search).code) {
55
-    //   this.code = this.toolClass.UrlSearch(location.search).code
56
-    // } else {
57
-    //   this.code = null
58
-    // }
59
-    // this.getUserInfo({ code: this.code, luckdrawid: this.lotteryId }).then((res) => {
60
-    //   if (typeof (res) === 'object') {
61
-    //     if (res.appid && res.appid !== '') {
62
-    //       this.toolClass.getCode(res.appid)
63
-    //     } else {
64
-    //       this.data.userInfo = this.userInfo
65
-    //       this.getData()
66
-    //     }
67
-    //   }
68
-    // }).catch((err) => {
69
-    //   console.log(err)
70
-    // })
52
+    // this.showPage = true
53
+    // this.model = 3 // 模板
54
+    if (location.search && this.toolClass.UrlSearch(location.search).code) {
55
+      this.code = this.toolClass.UrlSearch(location.search).code
56
+    } else {
57
+      this.code = null
58
+    }
59
+    this.getUserInfo({ code: this.code, luckdrawid: this.lotteryId }).then((res) => {
60
+      if (typeof (res) === 'object') {
61
+        if (res.appid && res.appid !== '') {
62
+          this.toolClass.getCode(res.appid)
63
+        } else {
64
+          this.data.userInfo = this.userInfo
65
+          this.getData()
66
+        }
67
+      }
68
+    }).catch((err) => {
69
+      console.log(err)
70
+    })
71 71
   },
72 72
   computed: {
73 73
     ...mapState({