c581f236 by joe

备份

1 parent a5fe4200
...@@ -1942,6 +1942,13 @@ ...@@ -1942,6 +1942,13 @@
1942 "integrity": "sha1-qJS3XUvE9s1nnvMkSp/Y9Gri1Cg=", 1942 "integrity": "sha1-qJS3XUvE9s1nnvMkSp/Y9Gri1Cg=",
1943 "dev": true 1943 "dev": true
1944 }, 1944 },
1945 "asap": {
1946 "version": "2.0.6",
1947 "resolved": "https://registry.npm.taobao.org/asap/download/asap-2.0.6.tgz",
1948 "integrity": "sha1-5QNHYR1+aQlDIIu9r+vLwvuGbUY=",
1949 "dev": true,
1950 "optional": true
1951 },
1945 "asn1": { 1952 "asn1": {
1946 "version": "0.2.4", 1953 "version": "0.2.4",
1947 "resolved": "http://registry.npm.taobao.org/asn1/download/asn1-0.2.4.tgz", 1954 "resolved": "http://registry.npm.taobao.org/asn1/download/asn1-0.2.4.tgz",
...@@ -5412,7 +5419,8 @@ ...@@ -5412,7 +5419,8 @@
5412 "ansi-regex": { 5419 "ansi-regex": {
5413 "version": "2.1.1", 5420 "version": "2.1.1",
5414 "bundled": true, 5421 "bundled": true,
5415 "dev": true 5422 "dev": true,
5423 "optional": true
5416 }, 5424 },
5417 "aproba": { 5425 "aproba": {
5418 "version": "1.2.0", 5426 "version": "1.2.0",
...@@ -5433,12 +5441,14 @@ ...@@ -5433,12 +5441,14 @@
5433 "balanced-match": { 5441 "balanced-match": {
5434 "version": "1.0.0", 5442 "version": "1.0.0",
5435 "bundled": true, 5443 "bundled": true,
5436 "dev": true 5444 "dev": true,
5445 "optional": true
5437 }, 5446 },
5438 "brace-expansion": { 5447 "brace-expansion": {
5439 "version": "1.1.11", 5448 "version": "1.1.11",
5440 "bundled": true, 5449 "bundled": true,
5441 "dev": true, 5450 "dev": true,
5451 "optional": true,
5442 "requires": { 5452 "requires": {
5443 "balanced-match": "^1.0.0", 5453 "balanced-match": "^1.0.0",
5444 "concat-map": "0.0.1" 5454 "concat-map": "0.0.1"
...@@ -5453,17 +5463,20 @@ ...@@ -5453,17 +5463,20 @@
5453 "code-point-at": { 5463 "code-point-at": {
5454 "version": "1.1.0", 5464 "version": "1.1.0",
5455 "bundled": true, 5465 "bundled": true,
5456 "dev": true 5466 "dev": true,
5467 "optional": true
5457 }, 5468 },
5458 "concat-map": { 5469 "concat-map": {
5459 "version": "0.0.1", 5470 "version": "0.0.1",
5460 "bundled": true, 5471 "bundled": true,
5461 "dev": true 5472 "dev": true,
5473 "optional": true
5462 }, 5474 },
5463 "console-control-strings": { 5475 "console-control-strings": {
5464 "version": "1.1.0", 5476 "version": "1.1.0",
5465 "bundled": true, 5477 "bundled": true,
5466 "dev": true 5478 "dev": true,
5479 "optional": true
5467 }, 5480 },
5468 "core-util-is": { 5481 "core-util-is": {
5469 "version": "1.0.2", 5482 "version": "1.0.2",
...@@ -5580,7 +5593,8 @@ ...@@ -5580,7 +5593,8 @@
5580 "inherits": { 5593 "inherits": {
5581 "version": "2.0.3", 5594 "version": "2.0.3",
5582 "bundled": true, 5595 "bundled": true,
5583 "dev": true 5596 "dev": true,
5597 "optional": true
5584 }, 5598 },
5585 "ini": { 5599 "ini": {
5586 "version": "1.3.5", 5600 "version": "1.3.5",
...@@ -5592,6 +5606,7 @@ ...@@ -5592,6 +5606,7 @@
5592 "version": "1.0.0", 5606 "version": "1.0.0",
5593 "bundled": true, 5607 "bundled": true,
5594 "dev": true, 5608 "dev": true,
5609 "optional": true,
5595 "requires": { 5610 "requires": {
5596 "number-is-nan": "^1.0.0" 5611 "number-is-nan": "^1.0.0"
5597 } 5612 }
...@@ -5606,6 +5621,7 @@ ...@@ -5606,6 +5621,7 @@
5606 "version": "3.0.4", 5621 "version": "3.0.4",
5607 "bundled": true, 5622 "bundled": true,
5608 "dev": true, 5623 "dev": true,
5624 "optional": true,
5609 "requires": { 5625 "requires": {
5610 "brace-expansion": "^1.1.7" 5626 "brace-expansion": "^1.1.7"
5611 } 5627 }
...@@ -5613,12 +5629,14 @@ ...@@ -5613,12 +5629,14 @@
5613 "minimist": { 5629 "minimist": {
5614 "version": "0.0.8", 5630 "version": "0.0.8",
5615 "bundled": true, 5631 "bundled": true,
5616 "dev": true 5632 "dev": true,
5633 "optional": true
5617 }, 5634 },
5618 "minipass": { 5635 "minipass": {
5619 "version": "2.3.5", 5636 "version": "2.3.5",
5620 "bundled": true, 5637 "bundled": true,
5621 "dev": true, 5638 "dev": true,
5639 "optional": true,
5622 "requires": { 5640 "requires": {
5623 "safe-buffer": "^5.1.2", 5641 "safe-buffer": "^5.1.2",
5624 "yallist": "^3.0.0" 5642 "yallist": "^3.0.0"
...@@ -5637,6 +5655,7 @@ ...@@ -5637,6 +5655,7 @@
5637 "version": "0.5.1", 5655 "version": "0.5.1",
5638 "bundled": true, 5656 "bundled": true,
5639 "dev": true, 5657 "dev": true,
5658 "optional": true,
5640 "requires": { 5659 "requires": {
5641 "minimist": "0.0.8" 5660 "minimist": "0.0.8"
5642 } 5661 }
...@@ -5717,7 +5736,8 @@ ...@@ -5717,7 +5736,8 @@
5717 "number-is-nan": { 5736 "number-is-nan": {
5718 "version": "1.0.1", 5737 "version": "1.0.1",
5719 "bundled": true, 5738 "bundled": true,
5720 "dev": true 5739 "dev": true,
5740 "optional": true
5721 }, 5741 },
5722 "object-assign": { 5742 "object-assign": {
5723 "version": "4.1.1", 5743 "version": "4.1.1",
...@@ -5729,6 +5749,7 @@ ...@@ -5729,6 +5749,7 @@
5729 "version": "1.4.0", 5749 "version": "1.4.0",
5730 "bundled": true, 5750 "bundled": true,
5731 "dev": true, 5751 "dev": true,
5752 "optional": true,
5732 "requires": { 5753 "requires": {
5733 "wrappy": "1" 5754 "wrappy": "1"
5734 } 5755 }
...@@ -5814,7 +5835,8 @@ ...@@ -5814,7 +5835,8 @@
5814 "safe-buffer": { 5835 "safe-buffer": {
5815 "version": "5.1.2", 5836 "version": "5.1.2",
5816 "bundled": true, 5837 "bundled": true,
5817 "dev": true 5838 "dev": true,
5839 "optional": true
5818 }, 5840 },
5819 "safer-buffer": { 5841 "safer-buffer": {
5820 "version": "2.1.2", 5842 "version": "2.1.2",
...@@ -5850,6 +5872,7 @@ ...@@ -5850,6 +5872,7 @@
5850 "version": "1.0.2", 5872 "version": "1.0.2",
5851 "bundled": true, 5873 "bundled": true,
5852 "dev": true, 5874 "dev": true,
5875 "optional": true,
5853 "requires": { 5876 "requires": {
5854 "code-point-at": "^1.0.0", 5877 "code-point-at": "^1.0.0",
5855 "is-fullwidth-code-point": "^1.0.0", 5878 "is-fullwidth-code-point": "^1.0.0",
...@@ -5869,6 +5892,7 @@ ...@@ -5869,6 +5892,7 @@
5869 "version": "3.0.1", 5892 "version": "3.0.1",
5870 "bundled": true, 5893 "bundled": true,
5871 "dev": true, 5894 "dev": true,
5895 "optional": true,
5872 "requires": { 5896 "requires": {
5873 "ansi-regex": "^2.0.0" 5897 "ansi-regex": "^2.0.0"
5874 } 5898 }
...@@ -5912,12 +5936,14 @@ ...@@ -5912,12 +5936,14 @@
5912 "wrappy": { 5936 "wrappy": {
5913 "version": "1.0.2", 5937 "version": "1.0.2",
5914 "bundled": true, 5938 "bundled": true,
5915 "dev": true 5939 "dev": true,
5940 "optional": true
5916 }, 5941 },
5917 "yallist": { 5942 "yallist": {
5918 "version": "3.0.3", 5943 "version": "3.0.3",
5919 "bundled": true, 5944 "bundled": true,
5920 "dev": true 5945 "dev": true,
5946 "optional": true
5921 } 5947 }
5922 } 5948 }
5923 }, 5949 },
...@@ -6673,6 +6699,13 @@ ...@@ -6673,6 +6699,13 @@
6673 "integrity": "sha1-Cpf7h2mG6AgcYxFg+PnziRV/AEM=", 6699 "integrity": "sha1-Cpf7h2mG6AgcYxFg+PnziRV/AEM=",
6674 "dev": true 6700 "dev": true
6675 }, 6701 },
6702 "image-size": {
6703 "version": "0.5.5",
6704 "resolved": "https://registry.npm.taobao.org/image-size/download/image-size-0.5.5.tgz",
6705 "integrity": "sha1-Cd/Uq50g4p6xw+gLiZA3jfnjy5w=",
6706 "dev": true,
6707 "optional": true
6708 },
6676 "import-cwd": { 6709 "import-cwd": {
6677 "version": "2.1.0", 6710 "version": "2.1.0",
6678 "resolved": "https://registry.npm.taobao.org/import-cwd/download/import-cwd-2.1.0.tgz", 6711 "resolved": "https://registry.npm.taobao.org/import-cwd/download/import-cwd-2.1.0.tgz",
...@@ -7385,6 +7418,64 @@ ...@@ -7385,6 +7418,64 @@
7385 "invert-kv": "^2.0.0" 7418 "invert-kv": "^2.0.0"
7386 } 7419 }
7387 }, 7420 },
7421 "less": {
7422 "version": "3.9.0",
7423 "resolved": "https://registry.npm.taobao.org/less/download/less-3.9.0.tgz?cache=0&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fless%2Fdownload%2Fless-3.9.0.tgz",
7424 "integrity": "sha1-t1EcQ/N89X3Iff/ZiD7BISibFHQ=",
7425 "dev": true,
7426 "requires": {
7427 "clone": "^2.1.2",
7428 "errno": "^0.1.1",
7429 "graceful-fs": "^4.1.2",
7430 "image-size": "~0.5.0",
7431 "mime": "^1.4.1",
7432 "mkdirp": "^0.5.0",
7433 "promise": "^7.1.1",
7434 "request": "^2.83.0",
7435 "source-map": "~0.6.0"
7436 },
7437 "dependencies": {
7438 "clone": {
7439 "version": "2.1.2",
7440 "resolved": "https://registry.npm.taobao.org/clone/download/clone-2.1.2.tgz",
7441 "integrity": "sha1-G39Ln1kfHo+DZwQBYANFoCiHQ18=",
7442 "dev": true
7443 },
7444 "mime": {
7445 "version": "1.6.0",
7446 "resolved": "https://registry.npm.taobao.org/mime/download/mime-1.6.0.tgz?cache=0&sync_timestamp=1560034758817&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fmime%2Fdownload%2Fmime-1.6.0.tgz",
7447 "integrity": "sha1-Ms2eXGRVO9WNGaVor0Uqz/BJgbE=",
7448 "dev": true,
7449 "optional": true
7450 },
7451 "source-map": {
7452 "version": "0.6.1",
7453 "resolved": "https://registry.npm.taobao.org/source-map/download/source-map-0.6.1.tgz",
7454 "integrity": "sha1-dHIq8y6WFOnCh6jQu95IteLxomM=",
7455 "dev": true,
7456 "optional": true
7457 }
7458 }
7459 },
7460 "less-loader": {
7461 "version": "5.0.0",
7462 "resolved": "https://registry.npm.taobao.org/less-loader/download/less-loader-5.0.0.tgz",
7463 "integrity": "sha1-SY3eOmxsT4h0WO6e0/CGoSrRtGY=",
7464 "dev": true,
7465 "requires": {
7466 "clone": "^2.1.1",
7467 "loader-utils": "^1.1.0",
7468 "pify": "^4.0.1"
7469 },
7470 "dependencies": {
7471 "clone": {
7472 "version": "2.1.2",
7473 "resolved": "https://registry.npm.taobao.org/clone/download/clone-2.1.2.tgz",
7474 "integrity": "sha1-G39Ln1kfHo+DZwQBYANFoCiHQ18=",
7475 "dev": true
7476 }
7477 }
7478 },
7388 "levn": { 7479 "levn": {
7389 "version": "0.3.0", 7480 "version": "0.3.0",
7390 "resolved": "https://registry.npm.taobao.org/levn/download/levn-0.3.0.tgz", 7481 "resolved": "https://registry.npm.taobao.org/levn/download/levn-0.3.0.tgz",
...@@ -9733,6 +9824,16 @@ ...@@ -9733,6 +9824,16 @@
9733 "integrity": "sha1-foz42PW48jnBvGi+tOt4Vn1XLvg=", 9824 "integrity": "sha1-foz42PW48jnBvGi+tOt4Vn1XLvg=",
9734 "dev": true 9825 "dev": true
9735 }, 9826 },
9827 "promise": {
9828 "version": "7.3.1",
9829 "resolved": "https://registry.npm.taobao.org/promise/download/promise-7.3.1.tgz",
9830 "integrity": "sha1-BktyYCsY+Q8pGSuLG8QY/9Hr078=",
9831 "dev": true,
9832 "optional": true,
9833 "requires": {
9834 "asap": "~2.0.3"
9835 }
9836 },
9736 "promise-inflight": { 9837 "promise-inflight": {
9737 "version": "1.0.1", 9838 "version": "1.0.1",
9738 "resolved": "https://registry.npm.taobao.org/promise-inflight/download/promise-inflight-1.0.1.tgz", 9839 "resolved": "https://registry.npm.taobao.org/promise-inflight/download/promise-inflight-1.0.1.tgz",
...@@ -10520,7 +10621,8 @@ ...@@ -10520,7 +10621,8 @@
10520 "version": "4.0.8", 10621 "version": "4.0.8",
10521 "resolved": "https://registry.npm.taobao.org/rx-lite/download/rx-lite-4.0.8.tgz", 10622 "resolved": "https://registry.npm.taobao.org/rx-lite/download/rx-lite-4.0.8.tgz",
10522 "integrity": "sha1-Cx4Rr4vESDbwSmQH6S2kJGe3lEQ=", 10623 "integrity": "sha1-Cx4Rr4vESDbwSmQH6S2kJGe3lEQ=",
10523 "dev": true 10624 "dev": true,
10625 "optional": true
10524 }, 10626 },
10525 "rx-lite-aggregates": { 10627 "rx-lite-aggregates": {
10526 "version": "4.0.8", 10628 "version": "4.0.8",
......
...@@ -34,6 +34,8 @@ ...@@ -34,6 +34,8 @@
34 "babel-plugin-import": "^1.12.0", 34 "babel-plugin-import": "^1.12.0",
35 "eslint": "^5.16.0", 35 "eslint": "^5.16.0",
36 "eslint-plugin-vue": "^5.0.0", 36 "eslint-plugin-vue": "^5.0.0",
37 "less": "^3.9.0",
38 "less-loader": "^5.0.0",
37 "node-sass": "^4.12.0", 39 "node-sass": "^4.12.0",
38 "sass-loader": "^7.1.0", 40 "sass-loader": "^7.1.0",
39 "vue-template-compiler": "^2.6.10" 41 "vue-template-compiler": "^2.6.10"
......
...@@ -8,7 +8,7 @@ ...@@ -8,7 +8,7 @@
8 <meta name="viewport" 8 <meta name="viewport"
9 content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no"> 9 content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
10 <link rel="icon" href="<%= BASE_URL %>favicon.ico"> 10 <link rel="icon" href="<%= BASE_URL %>favicon.ico">
11 <title>vue-cli3-framework</title> 11 <title></title>
12 </head> 12 </head>
13 13
14 <body> 14 <body>
......
...@@ -4,12 +4,13 @@ ...@@ -4,12 +4,13 @@
4 <router-link to="/">Home</router-link> | 4 <router-link to="/">Home</router-link> |
5 <router-link to="/about">About</router-link> 5 <router-link to="/about">About</router-link>
6 </div>--> 6 </div>-->
7 <router-view/> 7 <router-view />
8 </div> 8 </div>
9 </template> 9 </template>
10 10
11
11 <style lang="scss"> 12 <style lang="scss">
12 @import './styles/support.scss'; 13 @import "./styles/support.scss";
13 14
14 #app { 15 #app {
15 /* font-family: 'Avenir', Helvetica, Arial, sans-serif; 16 /* font-family: 'Avenir', Helvetica, Arial, sans-serif;
...@@ -30,6 +31,10 @@ div { ...@@ -30,6 +31,10 @@ div {
30 padding: 0; 31 padding: 0;
31 } 32 }
32 33
34 body {
35 background-color: #74cb35;
36 }
37
33 .app__width { 38 .app__width {
34 width: 750px; 39 width: 750px;
35 } 40 }
...@@ -83,5 +88,51 @@ div { ...@@ -83,5 +88,51 @@ div {
83 position: relative; 88 position: relative;
84 } 89 }
85 90
91 .sys-btn {
92 width: 430px;
93 height: 128px;
94 background: url(./assets/imgs/btn.png) no-repeat;
95 background-size: 100%;
96 text-align: center;
97 line-height: 118px;
98 color: #fff;
99 font-size: 50px;
100 font-weight: 600;
101 margin: auto;
102 }
86 103
104 .sys-btn-02 {
105 width: 342px;
106 height: 110px;
107 background: url(./assets/imgs/btn2.png) no-repeat;
108 background-size: 100%;
109 text-align: center;
110 line-height: 100px;
111 color: #fff;
112 font-size: 40px;
113 font-weight: 600;
114 margin: auto;
115 }
116
117 .sys-container-panel {
118 margin: auto;
119 width: 692px;
120 background-color: #fff;
121 border-radius: 50px;
122 box-shadow: 5px 5px 15px #8bc263;
123 position: relative;
124 .container-title {
125 width: 505px;
126 height: 84px;
127 line-height: 104px;
128 background: url(./assets/imgs/title-bg.png) no-repeat;
129 background-size: 100%;
130 position: absolute;
131 left: 93.5px;
132 top: -42px;
133 font-size: 38px;
134 font-weight: 600;
135 color: #e8e8e8;
136 }
137 }
87 </style> 138 </style>
......
1 import axios from 'axios'; 1 import axios from 'axios';
2 import Vue from 'vue';
3 import Router from '../router'
4
2 // import { 5 // import {
3 // Toast 6 // Toast
4 // } from 'vant'; 7 // } from 'vant';
...@@ -12,23 +15,33 @@ function Toast(msg) { ...@@ -12,23 +15,33 @@ function Toast(msg) {
12 15
13 // 服务器地址 16 // 服务器地址
14 let base = "https://ow.go.qudone.com"; 17 let base = "https://ow.go.qudone.com";
18 let baseWxAppid = "wx9fc8816188c0ef2a";
19 let wxOauthUrl = "http://clubwxuat.hm.liby.com.cn/api/getOpenId.htm";
15 if (location.href.indexOf("//k.wxpai.cn") > 0) { 20 if (location.href.indexOf("//k.wxpai.cn") > 0) {
16 base = "https://api.k.wxpai.cn/bizproxy" 21 base = "https://api.k.wxpai.cn/bizproxy"
22 baseWxAppid = "wx9fc8816188c0ef2a";
23 wxOauthUrl = "http://clubwxuat.hm.liby.com.cn/api/getOpenId.htm";
17 } 24 }
25
26 let whileList = [
27 "https://api.k.wxpai.cn/bizproxy/kdapi/file/upload"
28 ]
18 // let base = COM.baseUrl; 29 // let base = COM.baseUrl;
19 30
20 // 请求拦截器 31 // 请求拦截器
21 // axios.interceptors.request.use( 32 axios.interceptors.request.use(
22 // config => { 33 config => {
23 // // 每次发送请求之前判断是否存在token,如果存在,则统一在http请求的header都加上token,不用每次请求都手动添加了 34 // 每次发送请求之前判断是否存在token,如果存在,则统一在http请求的header都加上token,不用每次请求都手动添加了
24 // // 即使本地存在token,也有可能token是过期的,所以在响应拦截器中要对返回状态进行判断 35 // 即使本地存在token,也有可能token是过期的,所以在响应拦截器中要对返回状态进行判断
25 // const token = "token"; //这里写入token 36 const token = store.getSession();
26 // token && (config.headers.Authorization = token); 37 if (token && whileList.indexOf(config.url) < 0) {
27 // return config; 38 config.headers["sessionId"] = token;
28 // }, 39 }
29 // error => { 40 return config;
30 // return Promise.error(error); 41 },
31 // }) 42 error => {
43 return Promise.error(error);
44 })
32 45
33 // 响应拦截器 46 // 响应拦截器
34 axios.interceptors.response.use( 47 axios.interceptors.response.use(
...@@ -37,7 +50,11 @@ axios.interceptors.response.use( ...@@ -37,7 +50,11 @@ axios.interceptors.response.use(
37 if (response.data.code === 200) { 50 if (response.data.code === 200) {
38 return Promise.resolve(response); 51 return Promise.resolve(response);
39 } else { 52 } else {
40 Toast(response.data.bizMsg); 53 if (response.data.code == 404) {
54 store.removeSession();
55 store.saveRedirectUrl();
56 Router.push("/");
57 }
41 return Promise.reject(response); 58 return Promise.reject(response);
42 } 59 }
43 } else { 60 } else {
...@@ -46,43 +63,9 @@ axios.interceptors.response.use( ...@@ -46,43 +63,9 @@ axios.interceptors.response.use(
46 }, 63 },
47 // 服务器状态码不是200的情况 64 // 服务器状态码不是200的情况
48 error => { 65 error => {
66 console.log("Router.path === ", Router.history.current);
49 if (error.response.status) { 67 if (error.response.status) {
50 switch (error.response.status) { 68 switch (error.response.status) {
51 // 401: 未登录
52 // 未登录则跳转登录页面,并携带当前页面的路径
53 // 在登录成功后返回当前页面,这一步需要在登录页操作。
54 case 401:
55 router.replace({
56 path: '/login',
57 query: {
58 redirect: router.currentRoute.fullPath
59 }
60 });
61 break;
62 // 403 token过期
63 // 登录过期对用户进行提示
64 // 清除本地token和清空vuex中token对象
65 // 跳转登录页面
66 case 403:
67 Toast({
68 message: '登录过期,请重新登录',
69 duration: 1000,
70 forbidClick: true
71 });
72 // 清除token
73 localStorage.removeItem('token');
74 store.commit('loginSuccess', null);
75 // 跳转登录页面,并将要浏览的页面fullPath传过去,登录成功后跳转需要访问的页面
76 setTimeout(() => {
77 router.replace({
78 path: '/login',
79 query: {
80 redirect: router.currentRoute.fullPath
81 }
82 });
83 }, 1000);
84 break;
85 // 404请求不存在
86 case 404: 69 case 404:
87 Toast({ 70 Toast({
88 message: '网络请求不存在', 71 message: '网络请求不存在',
...@@ -119,7 +102,9 @@ export const httpGet = params => { ...@@ -119,7 +102,9 @@ export const httpGet = params => {
119 url, 102 url,
120 data 103 data
121 } = params; 104 } = params;
122 return axios.get(`${base}${url}`, { 105 data = !data ? {} : data;
106 let requestUrl = url.indexOf("http:") >= 0 || url.indexOf("https:") >= 0 ? url : `${base}${url}`;
107 return axios.get(requestUrl, {
123 params: data 108 params: data
124 }).then(res => res.data.content); 109 }).then(res => res.data.content);
125 } 110 }
...@@ -133,9 +118,57 @@ export const httpPost = params => { ...@@ -133,9 +118,57 @@ export const httpPost = params => {
133 url, 118 url,
134 data 119 data
135 } = params; 120 } = params;
136 return axios.post(`${base}${url}`, data).then(res => res.data.content); 121 let requestUrl = url.indexOf("http:") >= 0 || url.indexOf("https:") >= 0 ? url : `${base}${url}`;
122 return axios.post(requestUrl, data).then(res => res.data.content);
137 } 123 }
138 124
125 export const store = {
126 putSession: function (sessionId) {
127 localStorage.setItem("_jiajia_childrenhost_sesson", sessionId);
128 },
129 getSession: function () {
130 return localStorage.getItem("_jiajia_childrenhost_sesson");
131 },
132 removeSession: function () {
133 localStorage.removeItem("_jiajia_childrenhost_sesson");
134 },
135 saveRedirectUrl() {
136 let current = Router.history.current || {};
137 let data = {
138 route: current.path,
139 params: current.query
140 }
141 localStorage.setItem("_jiajia_childrenhost_redirect", JSON.stringify(data));
142 },
143 getRedirectUrl() {
144 let dataStr = localStorage.getItem("_jiajia_childrenhost_redirect");
145 if (dataStr) {
146 let data = JSON.parse(dataStr);
147 let path = data.route;
148 let sep = "?";
149 if (data.params) {
150 for (let key in data.params) {
151 path += sep + key + "=" + data.params[key];
152 sep = "&";
153 }
154 }
155 return path;
156 }
157 return null;
158 },
159 delRedirectUrl() {
160 localStorage.removeItem("_jiajia_childrenhost_redirect");
161 },
162 getWxAppId() {
163 return `${baseWxAppid}`;
164 },
165 toWxLogin() {
166 let baseUrl = location.origin + location.pathname;
167 let returnUrl = encodeURIComponent(`${wxOauthUrl}` + "?returnUrl=" + baseUrl + "?openId=OPENID&p=p");
168 let oauthUrl = "https://open.weixin.qq.com/connect/oauth2/authorize?appid=" + `${baseWxAppid}` + "&redirect_uri=" + returnUrl + "&response_type=code&scope=snsapi_userinfo&stats=" + new Date().getTime() + "#wechat_redirect";
169 location.href = oauthUrl;
170 }
171 }
139 172
140 /** 173 /**
141 * 封装post方法 174 * 封装post方法
...@@ -152,5 +185,38 @@ export const formdata = params => { ...@@ -152,5 +185,38 @@ export const formdata = params => {
152 url, 185 url,
153 data 186 data
154 } = params; 187 } = params;
155 return axios.post(`${base}${url}`, data, formDataHeaders).then(res => res.data); 188 let requestUrl = url.indexOf("http:") >= 0 || url.indexOf("https:") >= 0 ? url : `${base}${url}`;
189 return axios.post(requestUrl, data, formDataHeaders).then(res => res.data);
156 } 190 }
191
192
193 export const request = {
194 post(url, data) {
195 return axios.post(`${requestDomain}${url}`, data);
196 },
197 get(url, data) {
198 return axios.get(`${requestDomain}${url}`, { params: data });
199 },
200 form(url, params) {
201 let formData = new FormData(); //使用formData对象
202 for (let key in params) {
203 formData.append(key, params[key]);
204 }
205 let requestUrl = url.indexOf("://") >= 0 ? `${url}` : `${requestDomain}${url}`;
206 return axios.post(requestUrl, formData, formDataHeaders)
207 },
208 build(url, params){
209 let fullUrl = `${requestDomain}${url}`;
210 let split = "";
211 for(let key in params){
212 if(split){
213 split = "&";
214 } else {
215 split = "?"
216 }
217 fullUrl += split + key +"="+params[key];
218 }
219 return fullUrl;
220 },
221 /*test*/
222 };
...\ No newline at end of file ...\ No newline at end of file
......
1 <template>
2 <van-overlay :show="show" >
3
4 </van-overlay>
5 </template>
6
7 <script>
8 import Vue from "vue";
9 import { Overlay } from "vant";
10 Vue.use(Overlay);
11
12 export default {
13 props: ["value"],
14 data() {
15 return {
16 model: this.value,
17 show: false
18 };
19 },
20 methods: {},
21 created() {}
22 };
23 </script>
24
25 <style lang="less" scoped>
26 </style>
1 <template>
2 <div class="bottom-panel">
3 <div class="bottom-tool-container">
4 <div class="item" v-bind:class="{activity : activityIndex == 1}" @click="itemSelect(1)">
5 <div class="white-bg">
6 <div class="icon icon-01"></div>
7 </div>
8 <div class="name">大赛介绍</div>
9 </div>
10 <div class="item" v-bind:class="{activity : activityIndex == 2}" @click="itemSelect(2)">
11 <div class="white-bg">
12 <div class="icon icon-02"></div>
13 </div>
14 <div class="name">我要报名</div>
15 </div>
16 <div class="item" v-bind:class="{activity : activityIndex == 3}" @click="itemSelect(3)">
17 <div class="white-bg">
18 <div class="icon icon-03"></div>
19 </div>
20 <div class="name">人气评选</div>
21 </div>
22 <div class="item" v-bind:class="{activity : activityIndex == 4}" @click="itemSelect(4)">
23 <div class="white-bg">
24 <div class="icon icon-04"></div>
25 </div>
26 <div class="name">更多福利</div>
27 </div>
28 </div>
29 </div>
30 </template>
31
32 <script>
33 export default {
34 props: ["value"],
35 data() {
36 return {
37 activityIndex: this.value
38 };
39 },
40 methods: {
41 itemSelect(index) {
42 if (this.activityIndex == index) {
43 return;
44 }
45 this.activityIndex = index;
46 switch (this.activityIndex) {
47 case 1:
48 this.$router.push("/");
49 break;
50 case 2:
51 this.$router.push("/sign");
52 break;
53 case 3:
54 this.$router.push("/list");
55 break;
56 case 4:
57 this.$router.push("/welfare");
58 break;
59 }
60 this.$emit("selectChange", this.activityIndex);
61 }
62 },
63 created() {
64 if (!this.activityIndex) {
65 this.activityIndex = 1;
66 }
67 }
68 };
69 </script>
70
71 <style lang="less" scoped>
72 .bottom-panel {
73 z-index: 999;
74 position: fixed;
75 bottom: 0;
76 height: 165px;
77 width: 750px;
78 background: url(../../assets/imgs/bottom-grassland.png) no-repeat;
79 background-size: 100% auto;
80 background-position: bottom;
81 }
82 .bottom-tool-container {
83 margin: auto;
84 width: 680px;
85 display: flex;
86 justify-content: space-between;
87 }
88
89 .item {
90 width: 140px;
91 .icon {
92 margin: auto;
93 width: 86px;
94 height: 86px;
95 }
96
97 .icon-01 {
98 background: url(../../assets/imgs/icon-01.png);
99 background-size: 100%;
100 }
101 .icon-02 {
102 background: url(../../assets/imgs/icon-02.png);
103 background-size: 100%;
104 }
105 .icon-03 {
106 background: url(../../assets/imgs/icon-03.png);
107 background-size: 100%;
108 }
109 .icon-04 {
110 background: url(../../assets/imgs/icon-04.png);
111 background-size: 100%;
112 }
113
114 .name {
115 width: 100%;
116 text-align: center;
117 color: #fff;
118 font-size: 24px;
119 }
120 .white-bg {
121 margin: auto;
122 padding-top: 7px;
123 background-color: transparent;
124 width: 110px;
125 height: 103px;
126 border-radius: 55px;
127 }
128 }
129
130 .activity {
131 .white-bg {
132 background-color: #fff !important;
133 }
134 }
135 </style>
1 <template> 1 <template>
2 <div class="home">home</div> 2 <div class="home">
3 <!-- <div class="title"></div>
4 <div class="sys-btn btn-margin">我要报名</div>
5 <div class="rule"></div>
6 <div class="prize"></div>
7 <div class="leap-01"></div>
8 <div class="leap-02"></div>
9 <div class="leap-03"></div>
10 <div class="remain"></div>
11 <bottom-tool v-model="activityIndex"></bottom-tool>-->
12 </div>
3 </template> 13 </template>
4 14
5 <script> 15 <script>
16 let urls = {
17 login: "/jiajiaCHApi/app/login"
18 };
19 import { store, httpPost } from "@/api/fetch-api.js";
20
6 export default { 21 export default {
7 name: 'home' 22 name: "home",
8 } 23 data() {
24 return {
25 activityIndex: 1,
26 loginParam: {
27 openid: "",
28 accessToken: ""
29 }
30 };
31 },
32 methods: {
33 init() {
34 if (store.getSession()) {
35 this.$router.push("/index");
36 } else {
37 let params = this.analysisParams();
38 if (params["openId"]) {
39 this.loginParam.openid = params["openId"];
40 this.loginParam.accessToken = params["access_token"];
41 this.login();
42 } else {
43 store.toWxLogin();
44 }
45 }
46 },
47 analysisParams() {
48 let params = {};
49 var query = window.location.search.substring(1);
50 var vars = query.split("&");
51 for (var i = 0; i < vars.length; i++) {
52 var pair = vars[i].split("=");
53 params[pair[0]] = pair[1];
54 }
55 return params;
56 },
57 login() {
58 httpPost({ url: urls.login, data: this.loginParam }).then(res => {
59 store.putSession(res.sessionId);
60 let path = store.getRedirectUrl();
61 path = !path ? "/index" : path;
62 store.delRedirectUrl();
63 this.$router.push(path);
64 });
65 }
66 },
67 created() {
68 this.init();
69 }
70 };
9 </script> 71 </script>
10 72
11 <style lang="scss" scoped> 73 <style lang="scss" scoped>
12 .home { 74 .home {
75 position: relative;
13 text-align: center; 76 text-align: center;
77 background-color: #74cb35;
14 } 78 }
15 </style> 79 </style>
......
1 import api from '../../api/api'
2 import {
3 httpGet,
4 httpPost
5 } from '../../api/fetch-api.js'
6
7 export default {
8 data() {
9 return {
10 key: 'value'
11 }
12 },
13 components: {},
14 methods: {
15 initData() {}
16 },
17 mounted() {},
18 created() {
19 console.log("demo created");
20 }
21 }
...\ No newline at end of file ...\ No newline at end of file
1 @import './../../styles/support';
1
2 <template>
3 <div class="page">
4 <div class="app__bgc bgc"></div>
5 <div class="app__bg bg"></div>
6 <div class="app__content main">
7 <div class="top-space"></div>
8 <div class="content">
9 <span class="iconfont iconclose">demo</span>
10 </div>
11 </div>
12 </div>
13 </template>
14
15 <script src="./index.js"></script>
16 <style lang="scss" scoped>
17 // @import './index.scss';
18 </style>
...\ No newline at end of file ...\ No newline at end of file
File mode changed
1 <template>
2 <div class="home">
3 <div class="title"></div>
4 <div class="sys-btn btn-margin" @click="toSign">立即报名</div>
5 <div class="rule"></div>
6 <div class="prize"></div>
7 <div class="leap-01"></div>
8 <div class="leap-02"></div>
9 <div class="leap-03"></div>
10 <div class="remain"></div>
11 <bottom-tool v-model="activityIndex"></bottom-tool>
12 </div>
13 </template>
14
15 <script>
16 import BottomTool from "@/components/bottom-tools/bottom-tools";
17
18 export default {
19 name: "home",
20 data() {
21 return {
22 activityIndex: 1
23 };
24 },
25 methods : {
26 toSign(){
27 this.$router.push("/sign")
28 }
29 },
30 components: {
31 BottomTool
32 }
33 };
34 </script>
35
36 <style lang="scss" scoped>
37 .home {
38 position: relative;
39 text-align: center;
40 background-color: #74cb35;
41 }
42 .title {
43 width: 750px;
44 height: 955px;
45 background: url(../../assets/imgs/idx-head.jpg);
46 background-size: 100%;
47 }
48 .rule {
49 width: 689px;
50 height: 672px;
51 background: url(../../assets/imgs/rule.png);
52 background-size: 100%;
53 margin: auto;
54 margin-top: 26px;
55 }
56 .prize {
57 width: 684px;
58 height: 1570px;
59 background: url(../../assets/imgs/prize.png);
60 background-size: 100%;
61 margin: auto;
62 margin-top: 40px;
63 }
64 .btn-margin {
65 margin-top: 10px;
66 }
67 .leap-01 {
68 width: 87px;
69 height: 216px;
70 background: url(../../assets/imgs/leap-01.png);
71 background-size: 100%;
72 position: absolute;
73 right: 0;
74 top: 990px;
75 }
76 .leap-02 {
77 width: 138px;
78 height: 290px;
79 background: url(../../assets/imgs/leap-02.png);
80 background-size: 100%;
81 position: absolute;
82 right: 0;
83 top: 1665px;
84 }
85 .leap-03 {
86 width: 750px;
87 height: 355px;
88 background: url(../../assets/imgs/leap-03.png);
89 background-size: 100%;
90 position: absolute;
91 bottom: 0px;
92 }
93 .remain{
94 height: 0px;
95 }
96 </style>
File mode changed
1 <template>
2 <div class="editClass">
3 <div class="sys-container-panel content">
4 <div class="container-title">我要报名</div>
5 <div class="head-line"></div>
6
7 <div class="text-container space">
8 <div class="label">选手姓名:</div>
9 <div class="form-item">
10 <input v-model="formData.name" placeholder="请填写参赛者姓名" />
11 </div>
12 </div>
13
14 <div class="text-container space">
15 <div class="label">所属地区:</div>
16 <div class="inline-group inline-group-width">
17 <div class="form-item inline-group inline-02" @click="selectCityHandler">
18 <div class="label">{{formData.province ? formData.province : "请选择"}}</div>
19 <div class="icon-draw-down"></div>
20 </div>
21 <div class="form-item inline-group inline-02" @click="selectCityHandler">
22 <div class="label">{{formData.city ? formData.city : "请选择"}}</div>
23 <div class="icon-draw-down"></div>
24 </div>
25 </div>
26 </div>
27
28 <div class="text-container space">
29 <div class="label">个人简介:</div>
30 <div class="form-item">
31 <input v-model="formData.profile" placeholder="可填写参赛者获取过荣誉、特殊才艺技能等" />
32 </div>
33 </div>
34
35 <div class="text-container space">
36 <div class="label">竞赛宣言:</div>
37 <div class="form-item">
38 <input v-model="formData.slogan" placeholder="参赛口号,不超过8个字" />
39 </div>
40 </div>
41 <div class="text-container space">
42 <div class="label">家长姓名:</div>
43 <div class="form-item">
44 <input v-model="formData.parentName" placeholder="请填写父亲/母亲称呼" />
45 </div>
46 </div>
47 <div class="text-container space">
48 <div class="label">联系方式:</div>
49 <div class="form-item">
50 <input v-model="formData.parentMobile" placeholder="请填写正确手机号码" />
51 </div>
52 </div>
53 <div class="text-container space">
54 <div class="label">照片/视频:</div>
55 <div class="item-group top">
56 <div>
57 <upload-item v-model="formData.worksList"></upload-item>
58 </div>
59 <div class="tips">可上传1-3张照片,首张默认为海报图</div>
60 </div>
61 </div>
62 </div>
63 <div class="sys-btn-02" :class="{disabled : !autoRegister}" @click="submitFormHandler">确认提交</div>
64
65 <div class="center base-margin auto-register-tips" @click="acceptRegisterHandler">
66 <div class="icon-register" :class="{activity : autoRegister}"></div>
67 <div class="tips">自动注册为立白集团会员,立享会员权益,详见“更多福利”</div>
68 </div>
69
70 <van-popup position="bottom" :style="{ height: '40%' }" v-model="area.show">
71 <van-area
72 :area-list="areaList"
73 :columns-num="2"
74 title="选择城市"
75 :value="formData.cityCode"
76 @cancel="area.show = false"
77 @confirm="confirmSelectCityHandler"
78 />
79 </van-popup>
80 </div>
81 </template>
82
83 <script>
84 let urls = {
85 area: "https://api.k.wxpai.cn/bizproxy/kdapi/area",
86 submit: "/jiajiaCHApi/app/works/submit"
87 };
88
89 import UploadItem from "./UploadItem";
90 import { httpGet, httpPost } from "@/api/fetch-api";
91 import AreaList from "@/api/area";
92
93 import Vue from "vue";
94 import { Toast } from "vant";
95 import { Area } from "vant";
96 import { Popup } from "vant";
97
98 Vue.use(Popup);
99 Vue.use(Area);
100 Vue.use(Toast);
101
102 export default {
103 props: ["value"],
104 data() {
105 return {
106 autoRegister: true,
107 successModelVisiable: true,
108 area: {
109 show: false
110 },
111 formData: this.value
112 };
113 },
114 methods: {
115 selectCityHandler() {
116 if (!this.formData.cityCode) {
117 this.formData.cityCode = "110100";
118 }
119 this.area.show = true;
120 },
121 confirmSelectCityHandler(res) {
122 let province = res[0];
123 let city = res[1];
124 if (!city) {
125 return;
126 }
127 this.formData.province = province.name;
128 this.formData.provinceCode = province.code;
129 this.formData.city = city.name;
130 this.formData.cityCode = city.code;
131 this.area.show = false;
132 },
133 acceptRegisterHandler() {
134 this.autoRegister = !this.autoRegister;
135 if (!this.autoRegister) {
136 }
137 },
138 submitFormHandler() {
139 if (!this.autoRegister) {
140 return;
141 }
142 if (!this.formData.name) {
143 Toast("请填写“参数者姓名”");
144 return;
145 }
146 if (!this.formData.province) {
147 Toast("请选择“所属地区”");
148 return;
149 }
150 if (!this.formData.profile) {
151 Toast("请填写“个人简介”");
152 return;
153 }
154 if (!this.formData.slogan) {
155 Toast("请填写“竞赛宣言”");
156 return;
157 }
158 if (this.formData.slogan.length > 8) {
159 Toast("“竞赛宣言”不要超过8个字");
160 return;
161 }
162 if (!this.formData.parentName) {
163 Toast("请填写“家长姓名”");
164 return;
165 }
166 if (!this.formData.parentMobile) {
167 Toast("请填写“联系方式”");
168 return;
169 }
170 if (
171 this.formData.parentMobile.indexOf("1") != 0 ||
172 this.formData.parentMobile.length != 11
173 ) {
174 Toast("请填写正确的“联系方式”");
175 return;
176 }
177 if (!this.formData.worksList || this.formData.worksList.length == 0) {
178 Toast("请上传作品");
179 return;
180 }
181
182 Toast.loading({
183 mask: true,
184 message: "数据提交中..."
185 });
186 httpPost({ url: urls.submit, data: this.formData }).then(res => {
187 Toast.clear();
188 this.$emit("submit", res);
189 });
190 }
191 },
192 computed: {
193 areaList() {
194 return AreaList;
195 }
196 },
197 components: {
198 UploadItem
199 },
200 created() {}
201 };
202 </script>
203
204 <style lang="scss" scoped>
205 .content {
206 margin: 85px auto 60px auto;
207 padding-bottom: 60px;
208
209 .head-line {
210 height: 60px;
211 }
212
213 .edit {
214 width: 630px;
215 text-align: right;
216 u {
217 font-size: 24px;
218 color: #5db288;
219 position: relative;
220 z-index: 1000;
221 }
222 }
223
224 .swipe {
225 width: 630px;
226 height: 320px;
227 margin: auto;
228 border: 2px solid #82acae;
229 border-radius: 30px;
230 }
231
232 .space {
233 margin-top: 20px !important;
234 }
235 .top {
236 display: flex;
237 align-items: flex-start !important;
238 }
239
240 .inline-group-width {
241 width: 500px;
242 }
243
244 .inline-group {
245 display: flex;
246 justify-content: space-between;
247 align-items: center;
248 }
249
250 .text-container {
251 display: flex;
252 align-items: center;
253 width: 620px;
254 margin: auto;
255
256 .inline {
257 width: 315px !important;
258 }
259
260 .inline-02 {
261 width: 180px !important;
262 padding: 0 30px;
263 .label {
264 font-size: 20px;
265 }
266 }
267
268 .right {
269 justify-content: flex-end !important;
270 }
271
272 .label {
273 min-width: 128px;
274 font-size: 20px;
275 text-align: left;
276 }
277 .msg {
278 color: #303531;
279 font-size: 24px;
280 text-align: left;
281 }
282 .primay {
283 font-size: 32px !important;
284 font-weight: 600;
285 color: #ff9e30;
286 }
287
288 .form-item {
289 width: 500px;
290 height: 52px;
291 border: 1px solid #82acae;
292 background-color: #addfe1;
293 border-radius: 26px;
294 line-height: 52px;
295 display: flex;
296 align-items: center;
297
298 input {
299 margin-left: 25px;
300 line-height: 52px;
301 height: 52px;
302 border: none;
303 width: 90%;
304 height: 100%;
305 background-color: transparent;
306 position: relative;
307 z-index: 1000;
308 font-size: 22px;
309 }
310 }
311 }
312
313 input::-webkit-input-placeholder {
314 color: #4f9984;
315 font-size: 18px;
316 }
317
318 }
319
320 .view-btn-group {
321 display: flex;
322 width: 730px;
323 margin: auto;
324 justify-content: space-between;
325 margin-bottom: 200px;
326
327 .sys-btn-02 {
328 width: 300px;
329 line-height: 90px;
330 }
331 }
332
333 .auto-register-tips {
334 width: 700px;
335 margin: auto;
336 }
337
338 .icon-draw-down {
339 width: 30px;
340 height: 18px;
341 background: url(../../../assets/imgs/draw-down.png) no-repeat;
342 background-size: 100%;
343 }
344
345 .base-margin {
346 margin-top: 40px;
347 }
348
349 .icon-register {
350 width: 30px;
351 height: 30px;
352 background: url(../../../assets/imgs/checkbox-uncheck.png) no-repeat;
353 background-size: 100%;
354 }
355
356 .icon-register.activity {
357 width: 30px;
358 height: 30px;
359 background: url(../../../assets/imgs/checkbox-checked.png) no-repeat;
360 background-size: 100%;
361 }
362
363 .center {
364 display: flex;
365 justify-content: center;
366 align-items: center;
367 }
368
369 .disabled {
370 filter: grayscale(100%);
371 }
372
373 .tips {
374 font-size: 20px;
375 color: #064e39;
376 padding-left: 10px;
377 text-align: left;
378 }
379 </style>
1 <template>
2 <div>
3 <div class="img-container" v-for="(item,index) in fileList" :key="index">
4 <img :src="item.worksUrl" />
5 <i class="van-icon van-icon-delete" @click="deleteImageHandler(index)"></i>
6 </div>
7 <van-uploader
8 ref="vanUploader"
9 class="uploader"
10 :after-read="uploadSumit"
11 v-if="!fileList || fileList.length < 3"
12 >+</van-uploader>
13 </div>
14 </template>
15
16
17
18 <script>
19 import { request } from "@/api/fetch-api.js";
20
21 import Vue from "vue";
22 import { Uploader } from "vant";
23 Vue.use(Uploader);
24
25 /**
26 * 外层插件可通过监听:v-on:before-upload;v-on:after-upload两个事件监听上传结果
27 * after-upload(success, src)
28 */
29
30 export default {
31 props: ["value"],
32 data() {
33 return {
34 fileList: this.value,
35 uploadUrl: "https://api.k.wxpai.cn/bizproxy/kdapi/file/upload",
36 };
37 },
38 methods: {
39 uploadSumit(params) {
40 console.log(params);
41 let data = {
42 path: "/pro/jiajiaChildrenHost",
43 file: params.file
44 };
45 request
46 .form(this.uploadUrl, data)
47 .then(result => {
48 let uploadResult = {
49 worksUrl: result.data.content,
50 worksType: params.file.type.indexOf("image") >= 0 ? "pic" : "video"
51 };
52 if (!this.fileList) {
53 this.fileList = [];
54 }
55 this.fileList.push(uploadResult);
56 this.$emit("input", this.fileList);
57 })
58 .catch(res => {});
59 },
60 deleteImageHandler(index) {
61 this.fileList.splice(index, 1);
62 }
63 },
64 computed: {
65 currentValue: function() {
66 return this.value;
67 }
68 }
69 };
70 </script>
71
72 <style lang="scss" scoped>
73 .uploader {
74 border: 1px solid #82acae;
75 border-radius: 6px;
76 position: relative;
77 overflow: hidden;
78 padding: 10px;
79 background-color: #addfe1;
80 width: 120px;
81 min-height: 120px;
82 font-size: 40px;
83 line-height: 120px;
84 text-align: center;
85 font-weight: bold;
86 }
87
88 .img-container {
89 border: 1px solid #82acae;
90 border-radius: 6px;
91 position: relative;
92 overflow: hidden;
93 padding: 10px;
94 background-color: #addfe1;
95 width: 120px;
96 text-align: center;
97 font-weight: bold;
98 margin-bottom: 10px;
99 img {
100 width: 100%;
101 }
102
103 .van-icon {
104 background-color: rgba($color: #000000, $alpha: 0.3);
105 position: absolute;
106 right: 10px;
107 bottom: 5px;
108 font-size: 40px;
109 }
110 }
111
112 .avatar {
113 max-width: 120px;
114 max-height: 120px;
115 display: block;
116 }
117 </style>
1 <template>
2 <div class="viewClass">
3 <div class="sys-container-panel content">
4 <div class="container-title">我要报名</div>
5 <div class="head-line"></div>
6 <div class="edit">
7 <u @click="formEditHandler">信息编辑</u>
8 </div>
9 <div class="swipe">
10 <van-swipe :autoplay="5000">
11 <van-swipe-item v-for="(works, index) in formData.worksList" :key="index">
12 <img :src="works.worksUrl" />
13 </van-swipe-item>
14 </van-swipe>
15 </div>
16 <div class="text-container space">
17 <div class="text-container inline">
18 <div class="label">参数编号:</div>
19 <div class="msg">{{formData.worksNo}}</div>
20 </div>
21
22 <div class="text-container inline right">
23 <div class="label">目前人气值:</div>
24 <div class="msg primay">{{formData.praiseNumber}}</div>
25 </div>
26 </div>
27
28 <div class="text-container space">
29 <div class="label">来自城市:</div>
30 <div class="msg">{{formData.province}} {{formData.city}}</div>
31 </div>
32
33 <div class="text-container space top">
34 <div class="label">我的简介:</div>
35 <div class="msg">{{formData.profile}}</div>
36 </div>
37
38 <div class="text-container space top">
39 <div class="label">竞赛宣言:</div>
40 <div class="msg">{{formData.slogan}}</div>
41 </div>
42
43 <div class="privacy">
44 <hr />
45 <div class="text-container space top">
46 <div class="label">家长称呼:</div>
47 <div class="msg">{{formData.parentName}}</div>
48 </div>
49 </div>
50 </div>
51
52 <div class="view-btn-group">
53 <div class="sys-btn-02" @click="selfPraiseHandler">投自己一票</div>
54 <div class="sys-btn-02" @click="showShareHandler">呼叫亲友团</div>
55 </div>
56 </div>
57 </template>
58
59 <script>
60 let urls = {};
61
62 import { httpGet, httpPost } from "@/api/fetch-api";
63
64 import Vue from "vue";
65 import { Toast } from "vant";
66 import { Popup } from "vant";
67
68 Vue.use(Popup);
69 Vue.use(Toast);
70
71 export default {
72 props: ["value"],
73 data() {
74 return {
75 formData: this.value
76 };
77 },
78 methods: {
79 formEditHandler() {
80 this.$emit("edit");
81 },
82 selfPraiseHandler() {
83 // 自己点赞
84 },
85 showShareHandler() {
86 // 出现分享层
87 }
88 },
89 created() {
90 console.log("view model === ", this.formData);
91 }
92 };
93 </script>
94
95 <style lang="scss" scoped>
96 .content {
97 margin: 85px auto 60px auto;
98 padding-bottom: 60px;
99
100 .head-line {
101 height: 60px;
102 }
103
104 .edit {
105 width: 630px;
106 text-align: right;
107 u {
108 font-size: 24px;
109 color: #5db288;
110 position: relative;
111 z-index: 1000;
112 }
113 }
114
115 .swipe {
116 width: 630px;
117 height: 320px;
118 margin: auto;
119 border: 2px solid #82acae;
120 border-radius: 30px;
121
122 img {
123 max-height: 300px;
124 max-width: 600px;
125 }
126 }
127
128 .space {
129 margin-top: 20px !important;
130 }
131 .top {
132 display: flex;
133 align-items: flex-start !important;
134 }
135
136 .inline-group-width {
137 width: 500px;
138 }
139
140 .inline-group {
141 display: flex;
142 justify-content: space-between;
143 align-items: center;
144 }
145
146 .text-container {
147 display: flex;
148 align-items: center;
149 width: 620px;
150 margin: auto;
151
152 .inline {
153 width: 315px !important;
154 }
155
156 .inline-02 {
157 width: 180px !important;
158 padding: 0 30px;
159 .label {
160 font-size: 20px;
161 }
162 }
163
164 .right {
165 justify-content: flex-end !important;
166 }
167
168 .label {
169 min-width: 128px;
170 font-size: 20px;
171 text-align: left;
172 }
173 .msg {
174 color: #303531;
175 font-size: 24px;
176 text-align: left;
177 }
178 .primay {
179 font-size: 32px !important;
180 font-weight: 600;
181 color: #ff9e30;
182 }
183 }
184
185 .privacy {
186 width: 630px;
187 margin: auto;
188 hr {
189 border-top: 3px dashed #d4d1c5;
190 margin: 60px auto;
191 }
192 }
193 }
194
195 .view-btn-group {
196 display: flex;
197 width: 730px;
198 margin: auto;
199 justify-content: space-between;
200 margin-bottom: 200px;
201
202 .sys-btn-02 {
203 width: 300px;
204 line-height: 90px;
205 }
206 }
207
208 .auto-register-tips {
209 width: 700px;
210 margin: auto;
211 }
212
213 .icon-draw-down {
214 width: 30px;
215 height: 18px;
216 background: url(../../../assets/imgs/draw-down.png) no-repeat;
217 background-size: 100%;
218 }
219 </style>
1 <template>
2 <div class="home">
3 <div class="head-leap"></div>
4
5 <ViewModel v-model="formData" v-if="init && !formEdit" v-on:edit="formEdit=true"></ViewModel>
6 <EditModel v-model="formData" v-if="init && formEdit" v-on:submit="initActivity"></EditModel>
7
8 <div class="bottom-line"></div>
9
10 <bottom-tool v-model="activityIndex"></bottom-tool>
11
12 <!-- <van-popup class="messagePopue" v-model="successModelVisiable" :close-on-click-overlay="false">
13 <div></div>
14 </van-popup>-->
15 </div>
16 </template>
17
18 <script>
19 let urls = {
20 myWork: "/jiajiaCHApi/app/works",
21 area: "https://api.k.wxpai.cn/bizproxy/kdapi/area"
22 };
23
24 import BottomTool from "@/components/bottom-tools/bottom-tools";
25 import EditModel from "./components/EditModel";
26 import ViewModel from "./components/ViewModel";
27
28 import { httpGet, httpPost } from "@/api/fetch-api";
29 import AreaList from "@/api/area";
30
31 import Vue from "vue";
32 import { Toast } from "vant";
33 import { Area } from "vant";
34 import { Popup } from "vant";
35 import { Swipe, SwipeItem } from "vant";
36
37 Vue.use(Popup);
38 Vue.use(Area);
39 Vue.use(Toast);
40 Vue.use(Swipe).use(SwipeItem);
41
42 export default {
43 name: "home",
44 data() {
45 return {
46 activityIndex: 2,
47 formEdit: false,
48 init: false,
49 isMy: 1,
50 successModelVisiable: true,
51 formData: {
52 name: "",
53 province: "",
54 provinceCode: "",
55 city: "",
56 cityCode: "",
57 profile: "",
58 slogan: "",
59 parentName: "",
60 parentMobile: "",
61 worksList: []
62 }
63 };
64 },
65 methods: {
66 initActivity() {
67 Toast.loading({
68 mask: true,
69 message: "加载中..."
70 });
71
72 httpGet({ url: urls.myWork }).then(res => {
73 this.init = true;
74 Toast.clear();
75 this.formData = res.data || {};
76 if (!res.data) {
77 this.formEdit = true;
78 } else {
79 this.formEdit = false;
80 }
81 });
82 }
83 },
84 components: {
85 BottomTool,
86 EditModel,
87 ViewModel
88 },
89 created() {
90 this.initActivity();
91 }
92 };
93 </script>
94
95 <style lang="scss" scoped>
96 .home {
97 position: relative;
98 text-align: center;
99 }
100
101 .head-leap {
102 width: 750px;
103 height: 231px;
104 background: url(../../assets/imgs/head-leap.png);
105 background-size: 100%;
106 position: fixed;
107 left: 0;
108 top: 0;
109 z-index: 999;
110 }
111
112 .bottom-line {
113 height: 250px;
114 background-color: transparent;
115 }
116 </style>
1 <template>
2 <div class="home">
3 <div class="header"></div>
4
5 <div class="qy">
6 <div class="qrcode">
7 <img src="../../assets/imgs/walfare-qrcode.png" />
8 </div>
9 </div>
10 <div class="cj">
11 <div class="sys-btn-02 btn-position" @click="toDraw">马上抽奖</div>
12 </div>
13
14 <div class="remain"></div>
15 <bottom-tool v-model="activityIndex"></bottom-tool>
16 </div>
17 </template>
18
19 <script>
20 import BottomTool from "@/components/bottom-tools/bottom-tools";
21
22 export default {
23 name: "home",
24 data() {
25 return {
26 activityIndex: 4
27 };
28 },
29 methods: {
30 toDraw() {
31 this.$router.push("/draw");
32 }
33 },
34 components: {
35 BottomTool
36 }
37 };
38 </script>
39
40 <style lang="scss" scoped>
41 .home {
42 position: relative;
43 text-align: center;
44 background: url(../../assets/imgs/welfare-bg.jpg);
45 background-size: 100% auto;
46 }
47 .header {
48 width: 750px;
49 height: 247px;
50 background: url(../../assets/imgs/welfare-top.jpg);
51 background-size: 100%;
52 }
53
54 .qy {
55 width: 708px;
56 height: 1136px;
57 background: url(../../assets/imgs/welfare-qy.png);
58 background-size: 100%;
59 margin: auto;
60 margin-top: -100px;
61 position: relative;
62
63 .qrcode {
64 position: absolute;
65 width: 171px;
66 height: 171px;
67 left: 270px;
68 bottom: 140px;
69 img {
70 width: 100%;
71 }
72 }
73 }
74
75 .cj {
76 width: 718px;
77 height: 968px;
78 background: url(../../assets/imgs/welfare-cj.png);
79 background-size: 100%;
80 margin: auto;
81 margin-top: 50px;
82 position: relative;
83 }
84
85 .btn-position {
86 position: absolute;
87 bottom: 80px;
88 left: 188px;
89 }
90
91 .remain {
92 height: 150px;
93 }
94 </style>
...@@ -9,25 +9,49 @@ const routes = [{ ...@@ -9,25 +9,49 @@ const routes = [{
9 name: 'home', 9 name: 'home',
10 component: Home, 10 component: Home,
11 meta: { 11 meta: {
12 title: '首页' 12 title: '加载中...'
13 } 13 }
14 }, 14 },
15 { 15 {
16 path: '/demo', 16 path: '/index',
17 name: 'demo', 17 name: 'index',
18 component: () => import('./pages/demo/index.vue'), 18 component: () => import('./pages/index/index.vue'),
19 meta: { 19 meta: {
20 title: '模板' 20 title: '大赛介绍'
21 } 21 }
22 }, 22 },
23 { 23 {
24 path: '/about', 24 path: '/sign',
25 name: 'about', 25 name: 'sign',
26 component: () => import('./pages/About.vue'), 26 component: () => import('./pages/sign/index.vue'),
27 meta: { 27 meta: {
28 title: '关于' 28 title: '我要报名'
29 } 29 }
30 },
31 {
32 path: '/list',
33 name: 'list',
34 component: () => import('./pages/list/index.vue'),
35 meta: {
36 title: '人气评选'
37 }
38 },
39 {
40 path: '/welfare',
41 name: 'welfare',
42 component: () => import('./pages/welfare/index.vue'),
43 meta: {
44 title: '更多福利'
45 }
46 },
47 {
48 path: '/draw',
49 name: 'draw',
50 component: () => import('./pages/draw/index.vue'),
51 meta: {
52 title: '幸运抽奖'
30 } 53 }
54 }
31 ] 55 ]
32 56
33 // add route path 57 // add route path
......
...@@ -202,3 +202,4 @@ ...@@ -202,3 +202,4 @@
202 background-color: $colorBlack; 202 background-color: $colorBlack;
203 } 203 }
204 } 204 }
205
......
...@@ -38,7 +38,7 @@ module.exports = { ...@@ -38,7 +38,7 @@ module.exports = {
38 38
39 // 它支持webPack-dev-server的所有选项 39 // 它支持webPack-dev-server的所有选项
40 devServer: { 40 devServer: {
41 host: "localhost", 41 host: "192.168.0.101",
42 port: 9001, // 端口号 42 port: 9001, // 端口号
43 https: false, // https:{type:Boolean} 43 https: false, // https:{type:Boolean}
44 open: true, //配置自动启动浏览器 44 open: true, //配置自动启动浏览器
......