Browse Source

Merge branch 'master' of http://git.ycjcjy.com/support-game/wechat

zjxpcyc 6 years ago
parent
commit
40eddb2dc7
8 changed files with 339 additions and 456 deletions
  1. 4
    5
      src/App.vue
  2. 43
    58
      src/components/music.vue
  3. 2
    1
      src/store/vote.js
  4. 1
    1
      src/util/ajax.js
  5. 157
    170
      src/views/vote/detail.vue
  6. 8
    16
      src/views/vote/list.vue
  7. 122
    203
      src/views/vote/signup.vue
  8. 2
    2
      vue.config.js

+ 4
- 5
src/App.vue View File

@@ -1,7 +1,7 @@
1 1
 <template>
2 2
   <div id="app" v-if="showPage">
3 3
     <router-view/>
4
-    <music :url="activity.Music" :theme="theme"></music>
4
+    <music :url="activity.Music"></music>
5 5
   </div>
6 6
 </template>
7 7
 
@@ -23,8 +23,7 @@ export default {
23 23
   },
24 24
   computed: {
25 25
     ...mapactivityState({
26
-      activity: s => s.activity || {},
27
-      theme: s => `${s.theme}`,
26
+      activity: s => s.activity || {}
28 27
     })
29 28
   },
30 29
   created() {
@@ -36,7 +35,7 @@ export default {
36 35
     //     this.toolClass.getCode('wx32e2e8c81f66070e')
37 36
     //   } else {
38 37
     //     localStorage.setItem('code', this.code)
39
-    //     this.customer(this.code).then(() => {
38
+    //     this.getUser({code: this.code}).then(() => {
40 39
     //       this.showPage = true
41 40
     //     })
42 41
     //   }
@@ -45,7 +44,7 @@ export default {
45 44
     // }
46 45
   },
47 46
   methods: {
48
-    ...mapIndexActions(["user"])
47
+    ...mapIndexActions(["getUser"])
49 48
   }
50 49
 };
51 50
 </script>

+ 43
- 58
src/components/music.vue View File

@@ -1,55 +1,42 @@
1 1
 <template>
2
-    <div class="musicbox" @click="troggle">
3
-      <img :class="playing" :src="icons[theme][playing]" alt="">
4
-      <audio ref="player" :src="url" preload loop="loop"></audio>
2
+    <div class="musicbox">
3
+      <!-- 播放 -->
4
+      <div class="play" v-if="audioPlayShow" @click="audioState">
5
+        <img  src="https://spaceofcheng.oss-cn-beijing.aliyuncs.com/voting/yttj_icon_music_open.png">
6
+      </div>
7
+      <!-- 暂停-->
8
+      <div class="play" v-else @click="audioState">
9
+         <img  src="https://spaceofcheng.oss-cn-beijing.aliyuncs.com/voting/yttj_icon_music_close.png" >
10
+      </div>
11
+      <audio ref="player" :src="url" autoplay preload loop="loop"></audio>
5 12
     </div>
6 13
 </template>
7 14
 <script>
15
+// import { createNamespacedHelpers } from 'vuex'
16
+// const {
17
+//   mapState: mapactivityState,
18
+// } = createNamespacedHelpers("vote");
8 19
 export default {
9 20
   name:'music',
10
-  props: {
11
-    url: String,
12
-    theme: String
13
-  },
21
+  props:['url'],
14 22
   data() {
15 23
     return {
16
-      playing: 'off',
17
-
18
-      icons: {
19
-        '1': {
20
-          'on': 'https://spaceofcheng.oss-cn-beijing.aliyuncs.com/voting/yttj_icon_music_open.png',
21
-          'off': 'https://spaceofcheng.oss-cn-beijing.aliyuncs.com/voting/yttj_icon_music_close.png',
22
-        },
23
-        '2': {
24
-          'on': 'https://spaceofcheng.oss-cn-beijing.aliyuncs.com/voting/yinyueon.png',
25
-          'off': 'https://spaceofcheng.oss-cn-beijing.aliyuncs.com/voting/yinyueoff.png',
26
-        },
27
-      }
24
+      yttjmusicopen:'https://spaceofcheng.oss-cn-beijing.aliyuncs.com/voting/yttj_icon_music_open.png',
25
+      yjsmusicopen:'https://spaceofcheng.oss-cn-beijing.aliyuncs.com/voting/yinyueon.png',
26
+      yttjmusicoff:'https://spaceofcheng.oss-cn-beijing.aliyuncs.com/voting/yttj_icon_music_close.png',
27
+      yjsmusicoff:'https://spaceofcheng.oss-cn-beijing.aliyuncs.com/voting/yinyueoff.png',
28
+      audioPlayShow: true,
28 29
     };
29 30
   },
30
-  watch: {
31
-    url: function(n) {
32
-      if (this.playing === 'off' && n) {
33
-        window.setTimeout(this.play, 1000)
34
-      }
35
-    }
36
-  },
37 31
   methods: {
38
-    play() {
39
-      if (this.url) {
40
-        this.$refs.player.play()
41
-        this.playing = 'on'
42
-      }
43
-    },
44
-    stop() {
45
-      this.$refs.player.pause()
46
-      this.playing = 'off'
47
-    },
48
-    troggle() {
49
-      if (this.playing === 'on') {
50
-        this.stop()
32
+    // 点击播放暂停按钮时间
33
+    audioState() {
34
+      this.audioPlayShow = !this.audioPlayShow; // 更改播放暂停按钮状态
35
+      const music = this.$refs.player; // 音频所在对象
36
+      if (this.audioPlayShow) {
37
+        music.play(); // 播放音乐
51 38
       } else {
52
-        this.play()
39
+        music.pause(); // 暂停音乐
53 40
       }
54 41
     }
55 42
   }
@@ -57,35 +44,33 @@ export default {
57 44
 </script>
58 45
 
59 46
 <style lang="scss" scoped>
60
-  @keyframes rotate{
61
-    0%{
62
-      transform: rotate(0deg);
63
-    }
64
-    100%{
65
-      transform: rotate(360deg);
66
-    }
67
-  }
68
-
47
+// @keyframes changDeg{
48
+// 			0%{
49
+// 				transform: rotate(0deg);
50
+// 			}
51
+// 			100%{
52
+// 				transform: rotate(360deg);
53
+// 			}
54
+// 		}
69 55
   .musicbox {
70 56
     position: fixed;
71 57
     top: 0.09rem;
72 58
     right: 0.09rem;
73
-    width: 0.35rem;
74
-    height: 0.35rem;
59
+    width: 0.5rem;
60
+    height: 0.5rem;
75 61
     border-radius: 50%;
76 62
     z-index: 130;
77 63
 
78
-    .on {
79
-      animation: rotate 3s linear infinite;
80
-    }
81
-
82
-    img {
64
+    .play {
83 65
       width: 100%;
84 66
       height: 100%;
67
+
68
+      img {
69
+        width: 100%;
70
+        height: 100%;
71
+      }
85 72
     }
86 73
   }
87
-
88
-
89 74
 </style>
90 75
 
91 76
 

+ 2
- 1
src/store/vote.js View File

@@ -18,7 +18,8 @@ export default {
18 18
       state.theme = data.ActivityId || 1
19 19
     },
20 20
     updateUser(state, data) {
21
-      state.user = data
21
+      state.user = data.openid
22
+      state.myprofile = data.member
22 23
     },
23 24
     updateDetail(state, data) {
24 25
       state.detail = data || {}

+ 1
- 1
src/util/ajax.js View File

@@ -78,7 +78,7 @@ const ajax = (...args) => {
78 78
       } else if (code === 401) {
79 79
         // console.log(result)
80 80
         // reject(code)
81
-        toolClass.getCode(result.appid)
81
+        // toolClass.getCode(result.appid)
82 82
       } else if (code === 406) {
83 83
         // console.log(router.history.current.name)
84 84
         if (router.history.current.name !== 'bindMobile') {

+ 157
- 170
src/views/vote/detail.vue View File

@@ -1,27 +1,27 @@
1 1
 <template>
2
-  <div class="context" :style="{backgroundImage: 'url(' + (coverImgUrl ?BgImage:BgImg) + ')'}">
2
+  <div :class="'context theme'+theme">
3 3
     <div class="ContextbBox">
4
-      <span :class="desc?personnumber1:personnumber2">NO.{{detail.MemberId}}</span>
4
+      <span class="personnumber">NO.{{detail.MemberId}}</span>
5 5
       <span class="votelist" @click="tolist">投票列表</span>
6 6
       <img :src="detail.Photo">
7 7
       <div class="detailinformation">
8 8
         <div class="nameinformation">
9
-          <span :class="desc?information1:information2">{{detail.Name}}</span>
10
-          <span :class="desc?information1:information2">姓名</span>
9
+          <span class="information">{{detail.Name}}</span>
10
+          <span class="information">姓名</span>
11 11
         </div>
12
-        <span :class="desc?line1:line2"></span>
12
+        <span class="line"></span>
13 13
         <div class="nameinformation">
14
-          <span :class="desc?informationnum1:informationnum2">{{detail.Vote}}</span>
15
-          <span :class="desc?information1:information2">当前票数</span>
14
+          <span class="informationnum">{{detail.Vote}}</span>
15
+          <span class="information">当前票数</span>
16 16
         </div>
17
-        <span :class="desc?line1:line2"></span>
17
+        <span class="line"></span>
18 18
         <div class="nameinformation">
19
-          <span :class="desc?information1:information2">{{detail.Rank}}名</span>
20
-          <span :class="desc?information1:information2">排名</span>
19
+          <span class="information">{{detail.Rank}}名</span>
20
+          <span class="information">排名</span>
21 21
         </div>
22 22
       </div>
23 23
     </div>
24
-    <button :class="desc?votebtn1:votebtn2" @click="Vote">投TA一票</button>
24
+    <button class="votebtn" @click="Vote">投TA一票</button>
25 25
     <div class="showorhide" v-if="detail.Message != ''">
26 26
       <span class="dashedline"></span>
27 27
       <span class="writeword">寄语:{{detail.Message}}</span>
@@ -44,20 +44,6 @@ export default {
44 44
       actid: '',
45 45
       memberid: '',
46 46
       show: false,
47
-      coverImgUrl:true,
48
-      BgImg,
49
-      BgImage,
50
-      desc:true,
51
-      personnumber1:'personnumber1',
52
-      personnumber2:'personnumber2',
53
-      information1:'information1',
54
-      information2:'information2',
55
-      informationnum1:'informationnum1',
56
-      informationnum2:"informationnum2",
57
-      line1:'line1',
58
-      line2:'line2',
59
-      votebtn1:'votebtn1',
60
-      votebtn2:'votebtn2',
61 47
     };
62 48
   },
63 49
   components: {
@@ -65,13 +51,6 @@ export default {
65 51
   },
66 52
   mounted() {
67 53
     this.actid = this.$route.params.actid;
68
-    if(this.actid==1){
69
-      this.coverImgUrl = true;
70
-      this.desc = true;
71
-    }else if(this.actid==2){
72
-      this.coverImgUrl = false;
73
-      this.desc = false;
74
-    }
75 54
     this.memberid = this.$route.params.memberid;
76 55
     this.getActivity({
77 56
       actid: this.actid,
@@ -97,6 +76,7 @@ export default {
97 76
       info: x => x.activity,
98 77
       detail: x => x.detail,
99 78
       user: x => x.user,
79
+      theme: x => x.theme,
100 80
     })
101 81
   },
102 82
   methods: {
@@ -133,127 +113,96 @@ export default {
133 113
 };
134 114
 </script>
135 115
 <style lang="scss" scoped>
136
-.context {
137
-  width: 100%;
138
-  height: 100%;
139
-  // background-color: rgba(220,229,236,1);;
116
+
117
+.ContextbBox {
118
+  width: 93.6%;
119
+  height: 4.05rem;
120
+  background-color: rgba(255, 255, 255, 1);
121
+  border-radius: 0.02rem;
122
+  margin-top: 0.7rem;
140 123
   display: flex;
141 124
   flex-direction: column;
142 125
   align-items: center;
126
+  position: relative;
127
+}
143 128
 
144
-  .ContextbBox {
145
-    width: 93.6%;
146
-    height: 4.05rem;
147
-    background-color: rgba(255, 255, 255, 1);
148
-    border-radius: 0.02rem;
149
-    margin-top: 0.7rem;
150
-    display: flex;
151
-    flex-direction: column;
152
-    align-items: center;
153
-    position: relative;
154
-
155
-    .personnumber1 {
156
-      position: absolute;
157
-      top: 0;
158
-      background-color:rgba(255,255,255,1);
159
-      border-radius: 0 0 0.12rem 0.12rem;
160
-      padding: 0.01rem 0.25rem;
161
-      font-size: 0.18rem;
162
-      font-family: PingFangSC-Medium;
163
-      font-weight: bolder;
164
-      color:rgba(70,86,101,1);
165
-      line-height: 0.25rem;
166
-    }
167
-    .personnumber2 {
168
-      position: absolute;
169
-      top: 0;
170
-      background-color:rgba(255,255,255,1);
171
-      border-radius: 0 0 0.12rem 0.12rem;
172
-      padding: 0.01rem 0.25rem;
173
-      font-size: 0.18rem;
174
-      font-family: PingFangSC-Medium;
175
-      font-weight: bolder;
176
-      color:rgba(112,84,75,1);
177
-      line-height: 0.25rem;
178
-    }
129
+.votelist {
130
+  position: absolute;
131
+  top: 0.43rem;
132
+  right: 0;
133
+  background-color: rgba(84, 84, 84, 0.8);
134
+  border-radius: 0.23rem 0 0 0.23rem;
135
+  padding: 0.05rem 0.05rem 0.05rem 0.16rem;
136
+  font-size: 0.18rem;
137
+  font-family: PingFangSC-Medium;
138
+  font-weight: bolder;
139
+  color: rgba(255, 255, 255, 1);
140
+  line-height: 0.25rem;
141
+}
179 142
 
180
-    .votelist {
181
-      position: absolute;
182
-      top: 0.43rem;
183
-      right: 0;
184
-      background-color: rgba(84, 84, 84, 0.8);
185
-      border-radius: 0.23rem 0 0 0.23rem;
186
-      padding: 0.05rem 0.05rem 0.05rem 0.16rem;
187
-      font-size: 0.18rem;
188
-      font-family: PingFangSC-Medium;
189
-      font-weight: bolder;
190
-      color: rgba(255, 255, 255, 1);
191
-      line-height: 0.25rem;
192
-    }
143
+img {
144
+  width: 93%;
145
+  height: 3.16rem;
146
+  margin: 0.1rem 0;
147
+}
148
+.detailinformation {
149
+  width: 82%;
150
+  display: flex;
151
+  flex-direction: row;
152
+  justify-content: space-between;
153
+}
193 154
 
194
-    img {
195
-      width: 93%;
196
-      height: 3.16rem;
197
-      margin: 0.1rem 0;
198
-    }
199
-    .detailinformation {
200
-      width: 82%;
201
-      display: flex;
202
-      flex-direction: row;
203
-      justify-content: space-between;
155
+.nameinformation {
156
+  display: flex;
157
+  flex-direction: column;
158
+  align-items: center;
159
+}
204 160
 
205
-      .line1 {
206
-        // width: 0.01rem;
207
-        border: 0.01rem solid rgba(166,184,201,1);
208
-        background-color: rgba(166,184,201,1);
209
-      }
210
-      .line2 {
211
-        // width: 0.01rem;
212
-        border: 0.01rem solid rgba(166,184,201,1);
213
-        background-color: rgba(166,184,201,1);
214
-      }
215
-      .nameinformation {
216
-        display: flex;
217
-        flex-direction: column;
218
-        align-items: center;
161
+.context {
162
+  width: 100%;
163
+  height: 100%;
164
+  // background-color: rgba(220,229,236,1);;
165
+  display: flex;
166
+  flex-direction: column;
167
+  align-items: center;
168
+}
219 169
 
220
-        .information1 {
221
-          font-size: 0.16rem;
222
-          font-family: JQLaoSongJT;
223
-          color:rgba(112,125,138,1);
224
-          line-height: 0.28rem;
225
-          font-weight: bold;
226
-          height: 0.28rem;
227
-        }
228
-        .information2 {
229
-          font-size: 0.16rem;
230
-          font-family: JQLaoSongJT;
231
-          color:rgba(112,84,75,1);
232
-          line-height: 0.28rem;
233
-          font-weight: bold;
234
-           height: 0.28rem;
235
-        }
236
-        .informationnum1 {
237
-          font-size: 0.24rem;
238
-          font-family: JQLaoSongJT;
239
-          color:rgba(112,125,138,1);
240
-          font-weight: bolder;
241
-          line-height: 0.28rem;
242
-           height: 0.28rem;
243
-        }
244
-          .informationnum2 {
245
-          font-size: 0.24rem;
246
-          font-family: JQLaoSongJT;
247
-          color:rgba(112,84,75,1);
248
-          font-weight: bolder;
249
-          line-height: 0.28rem;
250
-           height: 0.28rem;
251
-        }
252
-      }
253
-    }
170
+.theme1 {  
171
+  background-image: url('../../assets/yttjbg.png');
172
+  .personnumber {
173
+    position: absolute;
174
+    top: 0;
175
+    background-color:rgba(255,255,255,1);
176
+    border-radius: 0 0 0.12rem 0.12rem;
177
+    padding: 0.01rem 0.25rem;
178
+    font-size: 0.18rem;
179
+    font-family: PingFangSC-Medium;
180
+    font-weight: bolder;
181
+    color:rgba(70,86,101,1);
182
+    line-height: 0.25rem;
254 183
   }
255
-
256
-  .votebtn1 {
184
+  .line {
185
+    // width: 0.01rem;
186
+    border: 0.01rem solid rgba(166,184,201,1);
187
+    background-color: rgba(166,184,201,1);
188
+  }
189
+  .information {
190
+    font-size: 0.16rem;
191
+    font-family: JQLaoSongJT;
192
+    color:rgba(112,125,138,1);
193
+    line-height: 0.28rem;
194
+    font-weight: bold;
195
+    height: 0.28rem;
196
+  }
197
+  .informationnum {
198
+    font-size: 0.24rem;
199
+    font-family: JQLaoSongJT;
200
+    color:rgba(112,125,138,1);
201
+    font-weight: bolder;
202
+    line-height: 0.28rem;
203
+      height: 0.28rem;
204
+  }
205
+  .votebtn {
257 206
     width: 59%;
258 207
     height: 0.42rem;
259 208
     background: rgba(166,184,201,1);
@@ -266,7 +215,70 @@ export default {
266 215
     border: none;
267 216
     margin-top: 0.18rem;
268 217
   }
269
-  .votebtn2{
218
+}
219
+ 
220
+.showorhide {
221
+  width: 100%;
222
+  display: flex;
223
+  flex-direction: column;
224
+  justify-content: center;
225
+  align-items: center;
226
+  margin-top: 0.18rem;
227
+
228
+  .dashedline {
229
+    width: 100%;
230
+    border-bottom: 1px dashed rgba(166,184,201,1);
231
+    text-decoration: none;
232
+  }
233
+  .writeword {
234
+    width: 90%;
235
+    padding-top: 0.18rem;
236
+    word-wrap: break-word;
237
+    word-break: normal;
238
+    font-size: 0.14rem;
239
+    font-family: PingFangSC-Regular;
240
+    font-weight: bold;
241
+    color: rgba(77,87,97,1);
242
+    line-height: 0.2rem;
243
+  }
244
+}
245
+
246
+.theme2 {
247
+  background-image: url('../../assets/bgimg.jpg');
248
+  .personnumber {
249
+    position: absolute;
250
+    top: 0;
251
+    background-color:rgba(255,255,255,1);
252
+    border-radius: 0 0 0.12rem 0.12rem;
253
+    padding: 0.01rem 0.25rem;
254
+    font-size: 0.18rem;
255
+    font-family: PingFangSC-Medium;
256
+    font-weight: bolder;
257
+    color:rgba(112,84,75,1);
258
+    line-height: 0.25rem;
259
+  }
260
+  .line {
261
+    // width: 0.01rem;
262
+    border: 0.01rem solid rgba(166,184,201,1);
263
+    background-color: rgba(166,184,201,1);
264
+  }
265
+  .information {
266
+    font-size: 0.16rem;
267
+    font-family: JQLaoSongJT;
268
+    color:rgba(112,84,75,1);
269
+    line-height: 0.28rem;
270
+    font-weight: bold;
271
+    height: 0.28rem;
272
+  }
273
+  .informationnum {
274
+    font-size: 0.24rem;
275
+    font-family: JQLaoSongJT;
276
+    color:rgba(112,84,75,1);
277
+    font-weight: bolder;
278
+    line-height: 0.28rem;
279
+      height: 0.28rem;
280
+  }
281
+  .votebtn{
270 282
     width: 59%;
271 283
     height: 0.42rem;
272 284
     background: rgba(173,145,129,1);
@@ -279,31 +291,6 @@ export default {
279 291
     border: none;
280 292
     margin-top: 0.18rem;
281 293
   }
282
-  .showorhide {
283
-    width: 100%;
284
-    display: flex;
285
-    flex-direction: column;
286
-    justify-content: center;
287
-    align-items: center;
288
-    margin-top: 0.18rem;
289
-
290
-    .dashedline {
291
-      width: 100%;
292
-      border-bottom: 1px dashed rgba(166,184,201,1);
293
-      text-decoration: none;
294
-    }
295
-    .writeword {
296
-      width: 90%;
297
-      padding-top: 0.18rem;
298
-      word-wrap: break-word;
299
-      word-break: normal;
300
-      font-size: 0.14rem;
301
-      font-family: PingFangSC-Regular;
302
-      font-weight: bold;
303
-      color: rgba(77,87,97,1);
304
-      line-height: 0.2rem;
305
-    }
306
-  }
307 294
 }
308 295
 </style>
309 296
 

+ 8
- 16
src/views/vote/list.vue View File

@@ -55,7 +55,7 @@
55 55
         </van-tab>
56 56
       </van-tabs>
57 57
     </div>
58
-    <button :class="signupBtn?'signupBtnOne':'signupBtnTwo'" @click="signup">{{ myprofile && myprofile.MemberId ? '我的上传' : '投TA一票' }}</button>
58
+    <button :class="signupBtn?'signupBtnOne':'signupBtnTwo'" @click="signup">我要报名</button>
59 59
     <toast v-if="show" :url="activity.AfterVote" @close="close" @confirmbtn="tolink"></toast>
60 60
   </div>
61 61
 </template>
@@ -123,9 +123,8 @@ export default {
123 123
       newList: x => x.list,
124 124
       topList: x => x.toplist,
125 125
       user: x => x.user,
126
-      theme: x => x.theme,
127
-      myprofile: x => x.myprofile,
128
-    }),
126
+      theme: x => x.theme
127
+    })
129 128
   },
130 129
   created() {
131 130
     this.pageSize = this.$store.state.pageSize;
@@ -159,9 +158,8 @@ export default {
159 158
       );
160 159
     });
161 160
     this.getMine({
162
-      actid: this.actid,
163
-      openid: this.user.openid,
164
-    })
161
+      actid: this.actid
162
+    });
165 163
 
166 164
     this.newlist().then((res) => {
167 165
       if ((res || []).length === this.pageSize) {
@@ -269,15 +267,9 @@ export default {
269 267
       });
270 268
     },
271 269
     signup() {
272
-      if (this.myprofile && this.myprofile.MemberId) {
273
-        this.$router.push({
274
-          path: `/detail/${this.actid}/${this.myprofile.MemberId}`
275
-        });
276
-      } else {
277
-        this.$router.push({
278
-          path: `/vote/signup/${this.actid}`
279
-        });
280
-      }
270
+      this.$router.push({
271
+        path: `/vote/signup/${this.actid}`
272
+      });
281 273
     },
282 274
     gotovotingdetails(memberid) {
283 275
       this.$router.push({

+ 122
- 203
src/views/vote/signup.vue View File

@@ -1,19 +1,18 @@
1 1
 <template>
2
-  <div class="context" :style="{backgroundImage: 'url(' + (coverImgUrl ?BgImage:BgImg) + ')'}">
2
+  <div :class="'context theme'+theme">
3 3
     <div class="ContextBox">
4 4
       <div class="uploadimg">
5
-        <img :src="img?yttjlove:yjslove">
6
-        <span :class="desc?desc1:desc2">上传您认为最美的全家福照片</span>
5
+        <img :src="theme===1?yttjlove:yjslove">
6
+        <span class="desc">上传您认为最美的全家福照片</span>
7 7
       </div>
8 8
       <van-uploader :after-read="onRead">
9
-        <img v-if="postData.photo" class="uploadimgbox" :src="postData.photo" alt="">
10
-        <img v-else class="uploadimgbox" :src="theme == 1? uploadimg1 : uploadimg2">
9
+        <img class="uploadimgbox" :src="uploadimg">
11 10
       </van-uploader>
12
-      <div class="WriteWord" v-if="writeword">
13
-        <img :src="img?yttjpen:yjspen">
14
-        <span :class="desc?desc1:desc2">寄语</span>
11
+      <div class="WriteWord" v-if="theme===1">
12
+        <img :src="theme===1?yttjpen:yjspen">
13
+        <span class="desc">寄语</span>
15 14
       </div>
16
-      <div class="input_content" v-if="writeword">
15
+      <div class="input_content" v-if="theme===1">
17 16
         <textarea
18 17
           id="textArea"
19 18
           @input="messageWrite"
@@ -27,21 +26,21 @@
27 26
         </span>
28 27
       </div>
29 28
       <div class="ContactInformation">
30
-        <img :src="img?yttjphone:yjsphone">
31
-        <span :class="desc?desc1:desc2">联系方式</span>
29
+        <img :src="theme===1?yttjphone:yjsphone">
30
+        <span class="desc">联系方式</span>
32 31
       </div>
33
-      <div :class="desc?inputbox1:inputbox2">
32
+      <div class="inputbox cinput">
34 33
         <input placeholder="输入手机号" v-model="postData.phone">
35 34
       </div>
36 35
 
37
-      <div :class="desc?inputbox1:inputbox2">
36
+      <div class="inputbox cinput">
38 37
         <input placeholder="输入姓名" v-model="postData.name">
39 38
       </div>
40
-      <div :class="desc?textareabox1:textareabox2" v-if="address">
39
+      <div class="textareabox cinput" v-if="theme===2">
41 40
         <textarea class="addressarea" placeholder="所在社区"></textarea>
42 41
       </div>
43 42
       <div class="btn">
44
-        <button :class="desc?SubmitBtn1:SubmitBtn2" @click="SubmitBtn">提交</button>
43
+        <button class="SubmitBtn cbtn" @click="SubmitBtn">提交</button>
45 44
       </div>
46 45
     </div>
47 46
   </div>
@@ -49,8 +48,6 @@
49 48
 
50 49
 <script>
51 50
 import { createNamespacedHelpers } from "vuex";
52
-import BgImg from "../../assets/bgimg.jpg";
53
-import BgImage from "../../assets/yttjbg.png";
54 51
 const {
55 52
   mapState: mapVoteState,
56 53
   mapActions: mapVoteActions
@@ -58,27 +55,17 @@ const {
58 55
 export default {
59 56
   name: "signup",
60 57
   data() {
61
-    return {
62
-      writeword: false,
63
-      address: false,
64
-      desc: true,
65
-      desc1: "desc1",
66
-      desc2: "desc2",
67
-      inputbox1: "inputbox1",
68
-      inputbox2: "inputbox2",
69
-      textareabox1: "textareabox1",
70
-      textareabox2: "textareabox2",
71
-      SubmitBtn1: "SubmitBtn1",
72
-      SubmitBtn2: "SubmitBtn2",
73
-      coverImgUrl: true,
74
-      BgImg,
75
-      BgImage,
76
-      img: true,
77
-      isLoading: false,
78
-      uploadimg1:
79
-        "https://spaceofcheng.oss-cn-beijing.aliyuncs.com/voting/uploadimg.png",
80
-      uploadimg2:
81
-        "https://spaceofcheng.oss-cn-beijing.aliyuncs.com/voting/yjsuploadimg.png",
58
+    return{
59
+      messagenum: 0,
60
+      postData: {
61
+        photo: "",
62
+        phone: "",
63
+        name: "",
64
+        addr: "",
65
+        message: ""
66
+      },
67
+      uploadimg: '',
68
+      actid: "",
82 69
       yttjlove:
83 70
         "https://spaceofcheng.oss-cn-beijing.aliyuncs.com/voting/yttj_icon_love.png",
84 71
       yttjpen:
@@ -91,15 +78,6 @@ export default {
91 78
         "https://spaceofcheng.oss-cn-beijing.aliyuncs.com/voting/xiegenjin.png",
92 79
       yjsphone:
93 80
         "https://spaceofcheng.oss-cn-beijing.aliyuncs.com/voting/dianhua.png",
94
-      messagenum: 0,
95
-      postData: {
96
-        photo: "",
97
-        phone: "",
98
-        name: "",
99
-        addr: "",
100
-        message: ""
101
-      },
102
-      actid: ""
103 81
     };
104 82
   },
105 83
   computed: {
@@ -110,42 +88,45 @@ export default {
110 88
   },
111 89
   created() {
112 90
     this.actid = this.$route.params.actid;
113
-     this.getActivity({
114
-      actid: this.actid,
115
-    })
116
-    if (this.actid == 1) {
117
-      this.coverImgUrl = true;
118
-      this.img = true;
119
-      this.address = false;
120
-      this.writeword = true;
121
-      this.desc = true;
122
-    } else if (this.actid == 2) {
123
-      this.coverImgUrl = false;
124
-      this.img = false;
125
-      this.address = true;
126
-      this.writeword = false;
127
-      this.desc = false;
128
-    }
129 91
     if (this.$route.params.actid != "") {
130 92
       this.actid = this.$route.params.actid;
93
+      this.getActivity({
94
+        actid: this.actid,
95
+      }).then(() => {
96
+        if (this.theme === 1){
97
+          this.uploadimg = 'https://spaceofcheng.oss-cn-beijing.aliyuncs.com/voting/uploadimg.png'
98
+        } else {
99
+          this.uploadimg = 'https://spaceofcheng.oss-cn-beijing.aliyuncs.com/voting/yjsuploadimg.png'
100
+        }
101
+      })
131 102
     } else {
132 103
       alert("不存在对应的活动信息!");
133 104
     }
134 105
   },
135 106
   methods: {
136
-    ...mapVoteActions(["voteMember", "getActivity"]),
107
+    ...mapVoteActions(["voteMember","getActivity"]),
137 108
     onRead(file) {
138 109
       let that = this;
139 110
       this.isLoading = true;
140
-      that.toolClass
141
-        .upload(file)
142
-        .then(res => {
143
-          that.uploadimg = res.result.url;
144
-          that.postData.photo = res.result.url;
145
-        })
146
-        .catch(() => {
147
-          that.isLoading = false;
148
-        });
111
+      let reader = new FileReader();
112
+      reader.readAsDataURL(file.file);
113
+      reader.onload = function(e) {
114
+        let data = e.target.result;
115
+        //加载图片获取图片真实宽度和高度
116
+        let image = new Image();
117
+        image.src = data;
118
+        image.onload = function() {
119
+          that.toolClass
120
+            .upload(file)
121
+            .then(res => {
122
+              that.uploadimg = res.result.url;
123
+              that.postData.photo = res.result.url;
124
+            })
125
+            .catch(() => {
126
+              that.isLoading = false;
127
+            });
128
+        };
129
+      };
149 130
     },
150 131
     messageWrite() {
151 132
       this.messagenum = this.postData.message.length;
@@ -168,10 +149,7 @@ export default {
168 149
 <style lang='scss' scoped>
169 150
 .context {
170 151
   width: 100%;
171
-  // height: 100%;
172
-  // background-color: rgba(209, 220, 228, 1);
173
-  // background:no-repeat center;
174
-  // background-size:100% 100%;
152
+  height: 100%;
175 153
   display: flex;
176 154
   justify-content: center;
177 155
 
@@ -193,21 +171,6 @@ export default {
193 171
         width: 0.22rem;
194 172
         height: 0.2rem;
195 173
       }
196
-
197
-      .desc1 {
198
-        font-size: 0.16rem;
199
-        font-weight: bolder;
200
-        color: rgba(112, 125, 138, 1);
201
-        line-height: 0.22rem;
202
-        padding-left: 0.03rem;
203
-      }
204
-      .desc2 {
205
-        font-size: 0.16rem;
206
-        font-weight: bolder;
207
-        color: rgba(112, 84, 75, 1);
208
-        line-height: 0.22rem;
209
-        padding-left: 0.03rem;
210
-      }
211 174
     }
212 175
 
213 176
     .uploadimgbox {
@@ -225,20 +188,6 @@ export default {
225 188
         width: 0.22rem;
226 189
         height: 0.2rem;
227 190
       }
228
-      .desc1 {
229
-        font-size: 0.16rem;
230
-        font-weight: bolder;
231
-        color: rgba(112, 125, 138, 1);
232
-        line-height: 0.22rem;
233
-        padding-left: 0.03rem;
234
-      }
235
-      .desc2 {
236
-        font-size: 0.16rem;
237
-        font-weight: bolder;
238
-        color: rgba(112, 84, 75, 1);
239
-        line-height: 0.22rem;
240
-        padding-left: 0.03rem;
241
-      }
242 191
     }
243 192
 
244 193
     .input_content {
@@ -292,51 +241,12 @@ export default {
292 241
         width: 0.22rem;
293 242
         height: 0.2rem;
294 243
       }
295
-      .desc1 {
296
-        font-size: 0.16rem;
297
-        font-family: PingFangSC-Medium;
298
-        font-weight: bolder;
299
-        color: rgba(112, 125, 138, 1);
300
-        line-height: 0.22rem;
301
-        padding-left: 0.03rem;
302
-      }
303
-      .desc2 {
304
-        font-size: 0.16rem;
305
-        font-family: PingFangSC-Medium;
306
-        font-weight: bolder;
307
-        color: rgba(112, 84, 75, 1);
308
-        line-height: 0.22rem;
309
-        padding-left: 0.03rem;
310
-      }
311 244
     }
312 245
 
313
-    .inputbox1 {
246
+    .inputbox {
314 247
       width: 92%;
315 248
       height: 0.4rem;
316
-      background-color: rgba(220, 229, 236, 0.63);
317
-      margin-left: calc(4%);
318
-      margin-bottom: 0.08rem;
319
-      border-radius: 0.06rem;
320
-      input {
321
-        width: 100%;
322
-        height: 100%;
323
-        background-color: rgba(255, 255, 255, 0);
324
-        text-indent: 0.12rem;
325
-      }
326 249
 
327
-      input::-webkit-input-placeholder {
328
-        font-size: 0.16rem;
329
-        font-family: PingFangSC-Medium;
330
-        font-weight: bolder;
331
-        color: rgba(117, 132, 146, 0.4);
332
-        line-height: 0.22rem;
333
-      }
334
-    }
335
-
336
-    .inputbox2 {
337
-      width: 92%;
338
-      height: 0.4rem;
339
-      background-color: rgba(232, 224, 220, 1);
340 250
       margin-left: calc(4%);
341 251
       margin-bottom: 0.08rem;
342 252
       border-radius: 0.06rem;
@@ -346,19 +256,10 @@ export default {
346 256
         background-color: rgba(255, 255, 255, 0);
347 257
         text-indent: 0.12rem;
348 258
       }
349
-
350
-      input::-webkit-input-placeholder {
351
-        font-size: 0.16rem;
352
-        font-family: PingFangSC-Medium;
353
-        font-weight: bolder;
354
-        color: rgba(139, 116, 102, 0.4);
355
-        line-height: 0.22rem;
356
-      }
357 259
     }
358
-    .textareabox1 {
260
+    .textareabox {
359 261
       width: 92%;
360 262
       height: 0.8rem;
361
-      background-color: rgba(220, 229, 236, 0.63);
362 263
       border-radius: 0.06rem;
363 264
       margin-left: calc(4%);
364 265
       .addressarea {
@@ -368,37 +269,7 @@ export default {
368 269
         background-color: rgba(255, 255, 255, 0);
369 270
         margin-left: 0.12rem;
370 271
       }
371
-      textarea::-webkit-input-placeholder {
372
-        font-size: 0.16rem;
373
-        font-family: PingFangSC-Medium;
374
-        font-weight: bolder;
375
-        color: rgba(112, 125, 138, 0.4);
376
-        line-height: 0.22rem;
377
-      }
378 272
     }
379
-
380
-    .textareabox2 {
381
-      width: 92%;
382
-      height: 0.8rem;
383
-      background-color: rgba(232, 224, 220, 1);
384
-      border-radius: 0.06rem;
385
-      margin-left: calc(4%);
386
-      .addressarea {
387
-        width: 100%;
388
-        height: 100%;
389
-        margin-top: 0.08rem;
390
-        background-color: rgba(255, 255, 255, 0);
391
-        margin-left: 0.12rem;
392
-      }
393
-      textarea::-webkit-input-placeholder {
394
-        font-size: 0.16rem;
395
-        font-family: PingFangSC-Medium;
396
-        font-weight: bolder;
397
-        color: rgba(139, 116, 102, 0.4);
398
-        line-height: 0.22rem;
399
-      }
400
-    }
401
-
402 273
     .btn {
403 274
       width: 100%;
404 275
       display: flex;
@@ -410,12 +281,10 @@ export default {
410 281
       // left: 0;
411 282
       // bottom: 0.32rem;
412 283
 
413
-      .SubmitBtn1 {
284
+      .SubmitBtn {
414 285
         width: 44%;
415 286
         height: 0.5rem;
416 287
         border-radius: 0.23rem;
417
-        background: rgba(166, 184, 201, 1);
418
-        box-shadow: 0px 2px 10px 0px rgba(207, 217, 227, 1);
419 288
         border: none;
420 289
         font-size: 0.2rem;
421 290
         font-family: PingFangSC-Medium;
@@ -424,23 +293,73 @@ export default {
424 293
         line-height: 0.28rem;
425 294
         // padding-top: 0.32rem;
426 295
       }
427
-      .SubmitBtn2 {
428
-        width: 44%;
429
-        height: 0.5rem;
430
-        border-radius: 0.23rem;
431
-        background: rgba(173, 145, 129, 1);
432
-        box-shadow: 0px 2px 10px 0px rgba(120, 108, 101, 0.46);
433
-        border: none;
434
-        font-size: 0.2rem;
435
-        font-family: PingFangSC-Medium;
436
-        font-weight: bolder;
437
-        color: rgba(255, 255, 255, 1);
438
-        line-height: 0.28rem;
439
-        margin-top: 1rem;
440
-      }
441 296
     }
442 297
   }
443 298
 }
299
+
300
+.theme1{
301
+  background-image: url("../../assets/yttjbg.png");
302
+  .desc{
303
+    font-size: 0.16rem;
304
+    font-weight: bolder;
305
+    color: rgba(112, 125, 138, 1);
306
+    line-height: 0.22rem;
307
+    padding-left: 0.03rem;
308
+  }
309
+  .cinput{
310
+    background-color: rgba(220, 229, 236, 0.63);
311
+  }
312
+  .cbtn{
313
+    background: rgba(166, 184, 201, 1);
314
+    box-shadow: 0px 2px 10px 0px rgba(207, 217, 227, 1);
315
+  }
316
+  input::-webkit-input-placeholder {
317
+    font-size: 0.16rem;
318
+    font-family: PingFangSC-Medium;
319
+    font-weight: bolder;
320
+    color: rgba(117, 132, 146, 0.4);
321
+    line-height: 0.22rem;
322
+  }
323
+  textarea::-webkit-input-placeholder {
324
+    font-size: 0.16rem;
325
+    font-family: PingFangSC-Medium;
326
+    font-weight: bolder;
327
+    color: rgba(112, 125, 138, 0.4);
328
+    line-height: 0.22rem;
329
+  }
330
+}
331
+
332
+.theme2{
333
+  background-image: url("../../assets/bgimg.jpg");
334
+  .desc{
335
+    font-size: 0.16rem;
336
+    font-weight: bolder;
337
+    color: rgba(112, 84, 75, 1);
338
+    line-height: 0.22rem;
339
+    padding-left: 0.03rem;
340
+  }
341
+  .cinput{
342
+    background-color: rgba(232, 224, 220, 1);
343
+  }
344
+  .cbtn{
345
+    background: rgba(173, 145, 129, 1);
346
+    box-shadow: 0px 2px 10px 0px rgba(120, 108, 101, 0.46);
347
+  }
348
+  input::-webkit-input-placeholder {
349
+    font-size: 0.16rem;
350
+    font-family: PingFangSC-Medium;
351
+    font-weight: bolder;
352
+    color: rgba(139, 116, 102, 0.4);
353
+    line-height: 0.22rem;
354
+  }
355
+  textarea::-webkit-input-placeholder {
356
+    font-size: 0.16rem;
357
+    font-family: PingFangSC-Medium;
358
+    font-weight: bolder;
359
+    color: rgba(139, 116, 102, 0.4);
360
+    line-height: 0.22rem;
361
+  }
362
+}
444 363
 </style>
445 364
 
446 365
 

+ 2
- 2
vue.config.js View File

@@ -7,9 +7,9 @@ module.exports = {
7 7
     proxy: {
8 8
       '/api': {
9 9
         // target: 'http://wechatconfigdev.ycjcjy.com',
10
-        // target: 'http://192.168.0.62:8080', // wf
10
+        target: 'http://localhost:8080', // wf
11 11
         // target: 'http://192.168.0.102:8080', // hyq
12
-        target: 'http://192.168.0.11:8080', // zys
12
+        // target: 'http://192.168.0.11:8080', // zys
13 13
         // target: 'http://dev.ycjcjy.com', // frp
14 14
         changeOrigin: true, // 如果接口跨域,需要进行这个参数配置
15 15
         // pathRewrite: {