Browse Source

Merge branch 'master' of http://git.ycjcjy.com/dianyang/colmo-h5

张延森 3 years ago
parent
commit
10aea51c25

+ 11
- 0
src/api/register.js View File

1
+import request  from "../utils/request";
2
+import { baseURL } from "../utils/request";
3
+/**
4
+ * 报名
5
+ * @param {*} person 
6
+ * @returns 
7
+ */
8
+export function register(data) {
9
+  const url = `${baseURL}/register`
10
+  return request(url, { method: 'POST', body: JSON.stringify(data) })
11
+}

+ 0
- 11
src/api/signup.js View File

1
-import request from "../utils/request";
2
-
3
-/**
4
- * 报名
5
- * @param {*} person 
6
- * @returns 
7
- */
8
- export function singup(data) {
9
-  const url = `${baseURL}/singup`
10
-  return request(url, { method: 'POST', body: JSON.stringify(data) })
11
-}

+ 1
- 2
src/main.js View File

11
 import Swiper from './components/Swiper'
11
 import Swiper from './components/Swiper'
12
 import SwiperSlide from './components/SwiperSlide'
12
 import SwiperSlide from './components/SwiperSlide'
13
 
13
 
14
-import { Popup } from 'vant';
15
-import { Area, Picker } from 'vant';
14
+import { Popup, Picker, Area } from 'vant';
16
 Vue.use(Popup);
15
 Vue.use(Popup);
17
 Vue.use(Picker);
16
 Vue.use(Picker);
18
 Vue.use(Area);
17
 Vue.use(Area);

+ 0
- 1
src/pages/AllPages.vue View File

77
 
77
 
78
       switch (e) {
78
       switch (e) {
79
         case 'yushi':
79
         case 'yushi':
80
-          console.log('yushi')
81
           var arr = JSON.stringify(this.typeYushi)
80
           var arr = JSON.stringify(this.typeYushi)
82
           this.$router.push({
81
           this.$router.push({
83
             name: 'Test',
82
             name: 'Test',

+ 6
- 9
src/pages/IndexImage.vue View File

1
 <template>
1
 <template>
2
   <div class="index-image">
2
   <div class="index-image">
3
-    <!-- <img :src="require('@/assets/images/index.png')" class="bg-image" @load="loadBg" /> -->
4
     <div class="index-inner-swiper">
3
     <div class="index-inner-swiper">
5
       <swiper :options="swiperOptions">
4
       <swiper :options="swiperOptions">
6
         <swiper-slide class="index-inner-slide">
5
         <swiper-slide class="index-inner-slide">
27
   name: 'IndexImage',
26
   name: 'IndexImage',
28
   props: {
27
   props: {
29
     typeImage: {
28
     typeImage: {
30
-      type: Object
31
-      // default: () => ({})
29
+      type: Object,
30
+      default: () => ({})
32
     }
31
     }
33
   },
32
   },
34
   data() {
33
   data() {
46
 <style lang="scss" scoped>
45
 <style lang="scss" scoped>
47
 .index-image {
46
 .index-image {
48
   .index-inner-swiper {
47
   .index-inner-swiper {
49
-    width: 100vw;
50
     .index-inner-slide {
48
     .index-inner-slide {
51
       position: relative;
49
       position: relative;
52
-      left: -11vw;
53
-    }
54
 
50
 
55
-    img {
56
-      width: 100%;
57
-      height: 100%;
51
+      & > img {
52
+        width: 100%;
53
+        height: 37vh;
54
+      }
58
     }
55
     }
59
   }
56
   }
60
 }
57
 }

+ 13
- 16
src/pages/Test.vue View File

24
         <img style="width:100%;" src="../assets/buttonImage/1即刻尊享.png" />
24
         <img style="width:100%;" src="../assets/buttonImage/1即刻尊享.png" />
25
       </div>
25
       </div>
26
     </div>
26
     </div>
27
+    
27
   </div>
28
   </div>
28
 </template>
29
 </template>
29
 
30
 
37
   },
38
   },
38
   props: {
39
   props: {
39
     typePages: {
40
     typePages: {
40
-      type: Object
41
-      // default: () => ({})
41
+      type: Object,
42
+      default: () => ({})
42
     }
43
     }
43
   },
44
   },
44
   components: {
45
   components: {
60
   width: 100vw;
61
   width: 100vw;
61
   height: 100vh;
62
   height: 100vh;
62
   display: flex;
63
   display: flex;
63
-  // justify-content: center;
64
   .bg-image {
64
   .bg-image {
65
     width: 100%;
65
     width: 100%;
66
+    height: 100vh;
66
     position: absolute;
67
     position: absolute;
67
   }
68
   }
68
   .body-swiper {
69
   .body-swiper {
69
     position: absolute;
70
     position: absolute;
70
-    width: 100%;
71
-    top: 335px;
72
-    height: 50vh;
71
+    width: 100vw;
72
+    top: 47.5vh;
73
     display: flex;
73
     display: flex;
74
     &-left,
74
     &-left,
75
     &-right {
75
     &-right {
80
       z-index: 2;
80
       z-index: 2;
81
     }
81
     }
82
     &-middle {
82
     &-middle {
83
-      width: 84%;
84
-      overflow: hidden;
85
-      position: relative;
86
-      top: 20px;
87
-    }
88
-    .button-img {
89
-      width: 40%;
90
-      position: absolute;
91
-      bottom: -5vh;
92
-      left: 29vw;
83
+      width: 84vw;
93
     }
84
     }
94
   }
85
   }
86
+  .button-img {
87
+    position: absolute;
88
+    width: 45vw;
89
+    left: 27.5vw;
90
+    top: 37vh;
91
+  }
95
 }
92
 }
96
 </style>
93
 </style>

+ 2
- 3
src/pages/index.vue View File

34
   }
34
   }
35
   .bth-div {
35
   .bth-div {
36
     position: absolute;
36
     position: absolute;
37
-    width: 184px;
38
-    height: 49px;
37
+    width: 45vw;
39
     bottom: 18vh;
38
     bottom: 18vh;
40
     /* margin: 0 auto; */
39
     /* margin: 0 auto; */
41
     /* justify-content: center; */
40
     /* justify-content: center; */
42
     /* margin: 0 auto; */
41
     /* margin: 0 auto; */
43
     display: flex;
42
     display: flex;
44
-    left: 28vw;
43
+    left: 27.5vw;
45
     align-items: center;
44
     align-items: center;
46
     .bth-image {
45
     .bth-image {
47
       width: 100%;
46
       width: 100%;

+ 3
- 2
src/pages/resultPage.vue View File

39
 </script>
39
 </script>
40
 <style scoped>
40
 <style scoped>
41
 .bgi {
41
 .bgi {
42
-  z-index: -1;
42
+  z-index: 1;
43
   position: absolute;
43
   position: absolute;
44
 }
44
 }
45
 .sharebgi {
45
 .sharebgi {
46
-  z-index: 1;
46
+  z-index: 2;
47
   position: absolute;
47
   position: absolute;
48
 }
48
 }
49
 .share {
49
 .share {
50
+  z-index: 3;
50
   position: absolute;
51
   position: absolute;
51
   margin: 78vh 0 0 27.5vw;
52
   margin: 78vh 0 0 27.5vw;
52
 }
53
 }

+ 22
- 18
src/pages/signup.vue View File

25
         <label>手&nbsp;机&nbsp;号</label>
25
         <label>手&nbsp;机&nbsp;号</label>
26
         <input class="phone" type="text" placeholder="请输入手机号" v-model="formData.phone" />
26
         <input class="phone" type="text" placeholder="请输入手机号" v-model="formData.phone" />
27
       </div>
27
       </div>
28
-      <div class="formItem intendedProductdiv">
29
-        <label>意向产品</label>
28
+      <div class="formItem intendedProductdiv" @click="visible = true">
29
+        <label>意向产品</label>        
30
         <input
30
         <input
31
           class="intendedProduct"
31
           class="intendedProduct"
32
           type="text"
32
           type="text"
57
       </div>
57
       </div>
58
       <img @click="sumbit" class="submit" src="../../public/images/signup/submit.png" width="45%" />
58
       <img @click="sumbit" class="submit" src="../../public/images/signup/submit.png" width="45%" />
59
     </div>
59
     </div>
60
-    <area-picker :show.sync="showArea" @change="handleArea" @cancel="showArea=false"></area-picker>
60
+    <van-popup v-model="visible" position="bottom">
61
+      <van-picker
62
+        title="意向产品"
63
+        show-toolbar
64
+        :columns="productList"
65
+        @confirm="onConfirm"
66
+        @cancel="onCancel"
67
+      />
68
+    </van-popup>
69
+    <area-picker :show.sync="showArea" @change="handleArea" @cancel='showArea=false'></area-picker>
61
   </div>
70
   </div>
62
 </template>
71
 </template>
63
 <script>
72
 <script>
64
-import { setRegister, getCity } from '../utils/api'
65
 
73
 
74
+import { register } from '../api/register'
75
+import { setRegister, getCity } from '../utils/api'
66
 export default {
76
 export default {
67
   components: {
77
   components: {
68
     AreaPicker: () => import('@/components/AreaPicker')
78
     AreaPicker: () => import('@/components/AreaPicker')
69
   },
79
   },
70
   data() {
80
   data() {
71
     return {
81
     return {
82
+      visible: false,
72
       showArea: false,
83
       showArea: false,
73
       checked: `./images/signup/checked.png`,
84
       checked: `./images/signup/checked.png`,
74
       Unchecked: `./images/signup/Unchecked.png`,
85
       Unchecked: `./images/signup/Unchecked.png`,
81
         intendedProduct: undefined,
92
         intendedProduct: undefined,
82
         address: undefined
93
         address: undefined
83
       },
94
       },
84
-      columns: ['杭州', '宁波', '温州', '绍兴', '湖州', '嘉兴', '金华', '衢州'],
85
-      productList: [
86
-        'COLMO子母太空舱',
87
-
88
-        'COLMO星图干洗护理套装',
89
-
90
-        'COLMO星辰干洗护理套装',
91
-
92
-        'COLMO星际干洗护理套装',
93
-
94
-        'COLMO TURING套系智慧干洗护理空间站'
95
-      ],
95
+      productList: ['COLMO子母太空舱', 'COLMO星图干洗护理套装', 'COLMO星辰干洗护理套装', 'COLMO星际干洗护理套装', 'COLMO TURING套系智慧干洗护理空间站'],
96
       pickerVisibleProduct: false,
96
       pickerVisibleProduct: false,
97
       address: undefined
97
       address: undefined
98
     }
98
     }
104
   methods: {
104
   methods: {
105
     onConfirm(value, index) {
105
     onConfirm(value, index) {
106
       this.formData.intendedProduct = value
106
       this.formData.intendedProduct = value
107
-      this.showPicker = false
107
+      this.onCancel()
108
     },
108
     },
109
 
109
 
110
     onCancel() {
110
     onCancel() {
151
     },
151
     },
152
     sumbit() {
152
     sumbit() {
153
       if (this.verification()) {
153
       if (this.verification()) {
154
+        // register(this.formData).then(() => {
155
+        //   this.$router.push('/resultPage')
156
+        // })
154
         const { userName, phone, intendedProduct, address, role } =
157
         const { userName, phone, intendedProduct, address, role } =
155
           this.formData
158
           this.formData
156
         let arrNew = address.map((item) => {
159
         let arrNew = address.map((item) => {
186
   padding: 0;
189
   padding: 0;
187
 }
190
 }
188
 .bgi {
191
 .bgi {
189
-  z-index: -1;
192
+  z-index: 1;
190
   position: absolute;
193
   position: absolute;
191
 }
194
 }
192
 .form {
195
 .form {
194
   color: #a6b1ab;
197
   color: #a6b1ab;
195
   position: absolute;
198
   position: absolute;
196
   margin-top: 18%;
199
   margin-top: 18%;
200
+  z-index: 2;
197
 }
201
 }
198
 .formItem {
202
 .formItem {
199
   position: absolute;
203
   position: absolute;

+ 0
- 2
src/utils/request.js View File

55
     })
55
     })
56
   })
56
   })
57
 }
57
 }
58
-
59
-

+ 7
- 5
vue.config.js View File

1
 
1
 
2
 const path = require('path')
2
 const path = require('path')
3
+const resolve = dir => path.join(__dirname, dir)
4
+
3
 
5
 
4
 module.exports = {
6
 module.exports = {
5
 
7
 
18
 
20
 
19
 
21
 
20
   },
22
   },
21
-  publicPath: './',
22
-  chainWebpack (config) {
23
-    config.resolve.alias
24
-      .set('@/components', path.resolve(__dirname, 'src/components/'))
25
-      .set('@/utils', path.resolve(__dirname, 'src/utils/'))
23
+  lintOnSave: false,
24
+  publicPath: "./",//在vue-cli.3.3版本后 baseUrl被废除了,因此这边要写成 publicPath。 https://cli.vuejs.org/zh/config/#vue-config-js
25
+  runtimeCompiler: true,
26
+  chainWebpack: config => {
27
+    config.resolve.alias.set("@", resolve("src"));
26
   }
28
   }
27
 }
29
 }