├── .browserslistrc
├── .editorconfig
├── .gitignore
├── LICENSE
├── README.md
├── babel.config.js
├── package-lock.json
├── package.json
├── postcss.config.js
├── public
├── favicon.ico
└── index.html
├── src
├── App.vue
├── assets
│ ├── css
│ │ ├── base.css
│ │ └── normalize.css
│ └── img
│ │ ├── cart
│ │ └── tick.svg
│ │ ├── common
│ │ ├── arrow-left.svg
│ │ ├── back.svg
│ │ ├── collect.svg
│ │ ├── placeholder.png
│ │ └── top.png
│ │ ├── detail
│ │ ├── cart.png
│ │ └── detail_bottom.png
│ │ ├── home
│ │ └── recommend_bg.jpg
│ │ ├── profile
│ │ ├── avatar.svg
│ │ ├── cart.svg
│ │ ├── message.svg
│ │ ├── phone.svg
│ │ ├── pointer.svg
│ │ ├── shopping.svg
│ │ └── vip.svg
│ │ └── tabbar
│ │ ├── category.svg
│ │ ├── category_active.svg
│ │ ├── home.svg
│ │ ├── home_active.svg
│ │ ├── profile.svg
│ │ ├── profile_active.svg
│ │ ├── shopcart.svg
│ │ └── shopcart_active.svg
├── components
│ ├── common
│ │ ├── navbar
│ │ │ └── NavBar.vue
│ │ ├── scroll
│ │ │ └── Scroll.vue
│ │ ├── swiper
│ │ │ ├── Swiper.vue
│ │ │ ├── SwiperItem.vue
│ │ │ └── index.js
│ │ └── tabbar
│ │ │ ├── TabBar.vue
│ │ │ └── TabBarItem.vue
│ └── content
│ │ ├── backTop
│ │ └── BackTop.vue
│ │ ├── goods
│ │ ├── GoodsList.vue
│ │ └── GoodsListItem.vue
│ │ ├── mainTabbar
│ │ └── MainTabBar.vue
│ │ └── tabControl
│ │ └── TabControl.vue
├── main.js
├── network
│ ├── home.js
│ └── request.js
├── router
│ └── index.js
└── views
│ ├── cart
│ └── Cart.vue
│ ├── category
│ └── Category.vue
│ ├── home
│ ├── Home.vue
│ └── childComps
│ │ ├── FeatureView.vue
│ │ ├── HomeSwiper.vue
│ │ └── RecommendView.vue
│ └── profile
│ └── Profile.vue
├── vue.config.js
└── yarn.lock
/.browserslistrc:
--------------------------------------------------------------------------------
1 | > 1%
2 | last 2 versions
3 | not ie <= 8
4 |
--------------------------------------------------------------------------------
/.editorconfig:
--------------------------------------------------------------------------------
1 | root = true
2 |
3 | [*]
4 | charset = utf-8
5 | indent_style = space
6 | indent_size = 2
7 | end_of_line = lf
8 | insert_final_newline = true
9 | trim_trailing_whitespace = true
10 |
--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | .DS_Store
2 | node_modules
3 | /dist
4 |
5 | # local env files
6 | .env.local
7 | .env.*.local
8 |
9 | # Log files
10 | npm-debug.log*
11 | yarn-debug.log*
12 | yarn-error.log*
13 |
14 | # Editor directories and files
15 | .idea
16 | .vscode
17 | *.suo
18 | *.ntvs*
19 | *.njsproj
20 | *.sln
21 | *.sw*
22 |
--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
1 | MIT License
2 |
3 | Copyright (c) 2018 coderwhy
4 |
5 | Permission is hereby granted, free of charge, to any person obtaining a copy
6 | of this software and associated documentation files (the "Software"), to deal
7 | in the Software without restriction, including without limitation the rights
8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 |
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 |
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # supermall
2 |
3 | ## Project setup
4 | ```
5 | npm install
6 | ```
7 |
8 | ### Compiles and hot-reloads for development
9 | ```
10 | npm run serve
11 | ```
12 |
13 | ### Compiles and minifies for production
14 | ```
15 | npm run build
16 | ```
17 |
18 | ### Run your tests
19 | ```
20 | npm run test
21 | ```
22 |
23 | ### Lints and fixes files
24 | ```
25 | npm run lint
26 | ```
27 |
28 | ### Customize configuration
29 | See [Configuration Reference](https://cli.vuejs.org/config/).
30 |
--------------------------------------------------------------------------------
/babel.config.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 | presets: [
3 | '@vue/app'
4 | ]
5 | }
6 |
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "supermall",
3 | "version": "0.1.0",
4 | "private": true,
5 | "scripts": {
6 | "serve": "vue-cli-service serve",
7 | "build": "vue-cli-service build"
8 | },
9 | "dependencies": {
10 | "axios": "^0.18.0",
11 | "better-scroll": "^1.13.2",
12 | "vue": "^2.5.21",
13 | "vue-router": "^3.0.2"
14 | },
15 | "devDependencies": {
16 | "@vue/cli-plugin-babel": "^3.2.0",
17 | "@vue/cli-service": "^3.2.0",
18 | "vue-template-compiler": "^2.5.21"
19 | }
20 | }
21 |
--------------------------------------------------------------------------------
/postcss.config.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 | plugins: {
3 | autoprefixer: {}
4 | }
5 | }
6 |
--------------------------------------------------------------------------------
/public/favicon.ico:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/coderwhy/supermall/29bdd73dbd943a4e0d769d44fb47944bb7fc2bb1/public/favicon.ico
--------------------------------------------------------------------------------
/public/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 | supermall
9 |
10 |
11 |
14 |
15 |
16 |
17 |
18 |
--------------------------------------------------------------------------------
/src/App.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
18 |
19 |
22 |
--------------------------------------------------------------------------------
/src/assets/css/base.css:
--------------------------------------------------------------------------------
1 | @import "./normalize.css";
2 |
3 | /*:root -> 获取根元素html*/
4 | :root {
5 | --color-text: #666;
6 | --color-high-text: #ff5777;
7 | --color-tint: #ff8198;
8 | --color-background: #fff;
9 | --font-size: 14px;
10 | --line-height: 1.5;
11 | }
12 |
13 | *,
14 | *::before,
15 | *::after {
16 | margin: 0;
17 | padding: 0;
18 | box-sizing: border-box;
19 | }
20 |
21 | body {
22 | font-family: "Helvetica Neue",Helvetica,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","微软雅黑",Arial,sans-serif;
23 | user-select: none; /* 禁止用户鼠标在页面上选中文字/图片等 */
24 | -webkit-tap-highlight-color: transparent; /* webkit是苹果浏览器引擎,tap点击,highlight背景高亮,color颜色,颜色用数值调节 */
25 | background: var(--color-background);
26 | color: var(--color-text);
27 | /* rem vw/vh */
28 | width: 100vw;
29 | }
30 |
31 | a {
32 | color: var(--color-text);
33 | text-decoration: none;
34 | }
35 |
36 |
37 | .clear-fix::after {
38 | clear: both;
39 | content: '';
40 | display: block;
41 | width: 0;
42 | height: 0;
43 | visibility: hidden;
44 | }
45 |
46 | .clear-fix {
47 | zoom: 1;
48 | }
49 |
50 | .left {
51 | float: left;
52 | }
53 |
54 | .right {
55 | float: right;
56 | }
57 |
58 |
--------------------------------------------------------------------------------
/src/assets/css/normalize.css:
--------------------------------------------------------------------------------
1 | /*! normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */
2 |
3 | /* Document
4 | ========================================================================== */
5 |
6 | /**
7 | * 1. Correct the line height in all browsers.
8 | * 2. Prevent adjustments of font size after orientation changes in iOS.
9 | */
10 |
11 | html {
12 | line-height: 1.15; /* 1 */
13 | -webkit-text-size-adjust: 100%; /* 2 */
14 | }
15 |
16 | /* Sections
17 | ========================================================================== */
18 |
19 | /**
20 | * Remove the margin in all browsers.
21 | */
22 |
23 | body {
24 | margin: 0;
25 | }
26 |
27 | /**
28 | * Correct the font size and margin on `h1` elements within `section` and
29 | * `article` contexts in Chrome, Firefox, and Safari.
30 | */
31 |
32 | h1 {
33 | font-size: 2em;
34 | margin: 0.67em 0;
35 | }
36 |
37 | /* Grouping content
38 | ========================================================================== */
39 |
40 | /**
41 | * 1. Add the correct box sizing in Firefox.
42 | * 2. Show the overflow in Edge and IE.
43 | */
44 |
45 | hr {
46 | box-sizing: content-box; /* 1 */
47 | height: 0; /* 1 */
48 | overflow: visible; /* 2 */
49 | }
50 |
51 | /**
52 | * 1. Correct the inheritance and scaling of font size in all browsers.
53 | * 2. Correct the odd `em` font sizing in all browsers.
54 | */
55 |
56 | pre {
57 | font-family: monospace, monospace; /* 1 */
58 | font-size: 1em; /* 2 */
59 | }
60 |
61 | /* Text-level semantics
62 | ========================================================================== */
63 |
64 | /**
65 | * Remove the gray background on active links in IE 10.
66 | */
67 |
68 | a {
69 | background-color: transparent;
70 | }
71 |
72 | /**
73 | * 1. Remove the bottom border in Chrome 57-
74 | * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
75 | */
76 |
77 | abbr[title] {
78 | border-bottom: none; /* 1 */
79 | text-decoration: underline; /* 2 */
80 | text-decoration: underline dotted; /* 2 */
81 | }
82 |
83 | /**
84 | * Add the correct font weight in Chrome, Edge, and Safari.
85 | */
86 |
87 | b,
88 | strong {
89 | font-weight: bolder;
90 | }
91 |
92 | /**
93 | * 1. Correct the inheritance and scaling of font size in all browsers.
94 | * 2. Correct the odd `em` font sizing in all browsers.
95 | */
96 |
97 | code,
98 | kbd,
99 | samp {
100 | font-family: monospace, monospace; /* 1 */
101 | font-size: 1em; /* 2 */
102 | }
103 |
104 | /**
105 | * Add the correct font size in all browsers.
106 | */
107 |
108 | small {
109 | font-size: 80%;
110 | }
111 |
112 | /**
113 | * Prevent `sub` and `sup` elements from affecting the line height in
114 | * all browsers.
115 | */
116 |
117 | sub,
118 | sup {
119 | font-size: 75%;
120 | line-height: 0;
121 | position: relative;
122 | vertical-align: baseline;
123 | }
124 |
125 | sub {
126 | bottom: -0.25em;
127 | }
128 |
129 | sup {
130 | top: -0.5em;
131 | }
132 |
133 | /* Embedded content
134 | ========================================================================== */
135 |
136 | /**
137 | * Remove the border on images inside links in IE 10.
138 | */
139 |
140 | img {
141 | border-style: none;
142 | }
143 |
144 | /* Forms
145 | ========================================================================== */
146 |
147 | /**
148 | * 1. Change the font styles in all browsers.
149 | * 2. Remove the margin in Firefox and Safari.
150 | */
151 |
152 | button,
153 | input,
154 | optgroup,
155 | select,
156 | textarea {
157 | font-family: inherit; /* 1 */
158 | font-size: 100%; /* 1 */
159 | line-height: 1.15; /* 1 */
160 | margin: 0; /* 2 */
161 | }
162 |
163 | /**
164 | * Show the overflow in IE.
165 | * 1. Show the overflow in Edge.
166 | */
167 |
168 | button,
169 | input { /* 1 */
170 | overflow: visible;
171 | }
172 |
173 | /**
174 | * Remove the inheritance of text transform in Edge, Firefox, and IE.
175 | * 1. Remove the inheritance of text transform in Firefox.
176 | */
177 |
178 | button,
179 | select { /* 1 */
180 | text-transform: none;
181 | }
182 |
183 | /**
184 | * Correct the inability to style clickable types in iOS and Safari.
185 | */
186 |
187 | button,
188 | [type="button"],
189 | [type="reset"],
190 | [type="submit"] {
191 | -webkit-appearance: button;
192 | }
193 |
194 | /**
195 | * Remove the inner border and padding in Firefox.
196 | */
197 |
198 | button::-moz-focus-inner,
199 | [type="button"]::-moz-focus-inner,
200 | [type="reset"]::-moz-focus-inner,
201 | [type="submit"]::-moz-focus-inner {
202 | border-style: none;
203 | padding: 0;
204 | }
205 |
206 | /**
207 | * Restore the focus styles unset by the previous rule.
208 | */
209 |
210 | button:-moz-focusring,
211 | [type="button"]:-moz-focusring,
212 | [type="reset"]:-moz-focusring,
213 | [type="submit"]:-moz-focusring {
214 | outline: 1px dotted ButtonText;
215 | }
216 |
217 | /**
218 | * Correct the padding in Firefox.
219 | */
220 |
221 | fieldset {
222 | padding: 0.35em 0.75em 0.625em;
223 | }
224 |
225 | /**
226 | * 1. Correct the text wrapping in Edge and IE.
227 | * 2. Correct the color inheritance from `fieldset` elements in IE.
228 | * 3. Remove the padding so developers are not caught out when they zero out
229 | * `fieldset` elements in all browsers.
230 | */
231 |
232 | legend {
233 | box-sizing: border-box; /* 1 */
234 | color: inherit; /* 2 */
235 | display: table; /* 1 */
236 | max-width: 100%; /* 1 */
237 | padding: 0; /* 3 */
238 | white-space: normal; /* 1 */
239 | }
240 |
241 | /**
242 | * Add the correct vertical alignment in Chrome, Firefox, and Opera.
243 | */
244 |
245 | progress {
246 | vertical-align: baseline;
247 | }
248 |
249 | /**
250 | * Remove the default vertical scrollbar in IE 10+.
251 | */
252 |
253 | textarea {
254 | overflow: auto;
255 | }
256 |
257 | /**
258 | * 1. Add the correct box sizing in IE 10.
259 | * 2. Remove the padding in IE 10.
260 | */
261 |
262 | [type="checkbox"],
263 | [type="radio"] {
264 | box-sizing: border-box; /* 1 */
265 | padding: 0; /* 2 */
266 | }
267 |
268 | /**
269 | * Correct the cursor style of increment and decrement buttons in Chrome.
270 | */
271 |
272 | [type="number"]::-webkit-inner-spin-button,
273 | [type="number"]::-webkit-outer-spin-button {
274 | height: auto;
275 | }
276 |
277 | /**
278 | * 1. Correct the odd appearance in Chrome and Safari.
279 | * 2. Correct the outline style in Safari.
280 | */
281 |
282 | [type="search"] {
283 | -webkit-appearance: textfield; /* 1 */
284 | outline-offset: -2px; /* 2 */
285 | }
286 |
287 | /**
288 | * Remove the inner padding in Chrome and Safari on macOS.
289 | */
290 |
291 | [type="search"]::-webkit-search-decoration {
292 | -webkit-appearance: none;
293 | }
294 |
295 | /**
296 | * 1. Correct the inability to style clickable types in iOS and Safari.
297 | * 2. Change font properties to `inherit` in Safari.
298 | */
299 |
300 | ::-webkit-file-upload-button {
301 | -webkit-appearance: button; /* 1 */
302 | font: inherit; /* 2 */
303 | }
304 |
305 | /* Interactive
306 | ========================================================================== */
307 |
308 | /*
309 | * Add the correct display in Edge, IE 10+, and Firefox.
310 | */
311 |
312 | details {
313 | display: block;
314 | }
315 |
316 | /*
317 | * Add the correct display in all browsers.
318 | */
319 |
320 | summary {
321 | display: list-item;
322 | }
323 |
324 | /* Misc
325 | ========================================================================== */
326 |
327 | /**
328 | * Add the correct display in IE 10+.
329 | */
330 |
331 | template {
332 | display: none;
333 | }
334 |
335 | /**
336 | * Add the correct display in IE 10.
337 | */
338 |
339 | [hidden] {
340 | display: none;
341 | }
342 |
--------------------------------------------------------------------------------
/src/assets/img/cart/tick.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/src/assets/img/common/arrow-left.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/src/assets/img/common/back.svg:
--------------------------------------------------------------------------------
1 |
2 |
--------------------------------------------------------------------------------
/src/assets/img/common/collect.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/src/assets/img/common/placeholder.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/coderwhy/supermall/29bdd73dbd943a4e0d769d44fb47944bb7fc2bb1/src/assets/img/common/placeholder.png
--------------------------------------------------------------------------------
/src/assets/img/common/top.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/coderwhy/supermall/29bdd73dbd943a4e0d769d44fb47944bb7fc2bb1/src/assets/img/common/top.png
--------------------------------------------------------------------------------
/src/assets/img/detail/cart.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/coderwhy/supermall/29bdd73dbd943a4e0d769d44fb47944bb7fc2bb1/src/assets/img/detail/cart.png
--------------------------------------------------------------------------------
/src/assets/img/detail/detail_bottom.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/coderwhy/supermall/29bdd73dbd943a4e0d769d44fb47944bb7fc2bb1/src/assets/img/detail/detail_bottom.png
--------------------------------------------------------------------------------
/src/assets/img/home/recommend_bg.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/coderwhy/supermall/29bdd73dbd943a4e0d769d44fb47944bb7fc2bb1/src/assets/img/home/recommend_bg.jpg
--------------------------------------------------------------------------------
/src/assets/img/profile/avatar.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/src/assets/img/profile/cart.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/src/assets/img/profile/message.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/src/assets/img/profile/phone.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/src/assets/img/profile/pointer.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/src/assets/img/profile/shopping.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/src/assets/img/profile/vip.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/src/assets/img/tabbar/category.svg:
--------------------------------------------------------------------------------
1 |
2 |
4 |
22 |
--------------------------------------------------------------------------------
/src/assets/img/tabbar/category_active.svg:
--------------------------------------------------------------------------------
1 |
2 |
4 |
22 |
--------------------------------------------------------------------------------
/src/assets/img/tabbar/home.svg:
--------------------------------------------------------------------------------
1 |
2 |
4 |
20 |
--------------------------------------------------------------------------------
/src/assets/img/tabbar/home_active.svg:
--------------------------------------------------------------------------------
1 |
2 |
4 |
20 |
--------------------------------------------------------------------------------
/src/assets/img/tabbar/profile.svg:
--------------------------------------------------------------------------------
1 |
2 |
4 |
20 |
--------------------------------------------------------------------------------
/src/assets/img/tabbar/profile_active.svg:
--------------------------------------------------------------------------------
1 |
2 |
4 |
20 |
--------------------------------------------------------------------------------
/src/assets/img/tabbar/shopcart.svg:
--------------------------------------------------------------------------------
1 |
2 |
4 |
19 |
--------------------------------------------------------------------------------
/src/assets/img/tabbar/shopcart_active.svg:
--------------------------------------------------------------------------------
1 |
2 |
4 |
19 |
--------------------------------------------------------------------------------
/src/components/common/navbar/NavBar.vue:
--------------------------------------------------------------------------------
1 |
2 |
7 |
8 |
9 |
14 |
15 |
32 |
--------------------------------------------------------------------------------
/src/components/common/scroll/Scroll.vue:
--------------------------------------------------------------------------------
1 |
2 |
7 |
8 |
9 |
59 |
60 |
63 |
--------------------------------------------------------------------------------
/src/components/common/swiper/Swiper.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
13 |
14 |
15 |
16 |
211 |
212 |
246 |
--------------------------------------------------------------------------------
/src/components/common/swiper/SwiperItem.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
12 |
13 |
23 |
--------------------------------------------------------------------------------
/src/components/common/swiper/index.js:
--------------------------------------------------------------------------------
1 | import Swiper from './Swiper'
2 | import SwiperItem from './SwiperItem'
3 |
4 | export {
5 | Swiper, SwiperItem
6 | }
7 |
--------------------------------------------------------------------------------
/src/components/common/tabbar/TabBar.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
12 |
13 |
26 |
--------------------------------------------------------------------------------
/src/components/common/tabbar/TabBarItem.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
8 |
9 |
10 |
44 |
45 |
61 |
--------------------------------------------------------------------------------
/src/components/content/backTop/BackTop.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |

4 |
5 |
6 |
7 |
12 |
13 |
25 |
--------------------------------------------------------------------------------
/src/components/content/goods/GoodsList.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
25 |
26 |
37 |
--------------------------------------------------------------------------------
/src/components/content/goods/GoodsListItem.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
![]()
4 |
5 |
{{goodsItem.title}}
6 |
{{goodsItem.price}}
7 |
{{goodsItem.cfav}}
8 |
9 |
10 |
11 |
12 |
25 |
26 |
75 |
--------------------------------------------------------------------------------
/src/components/content/mainTabbar/MainTabBar.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 | 首页
7 |
8 |
9 |
10 |
11 | 分类
12 |
13 |
14 |
15 |
16 | 购物车
17 |
18 |
19 |
20 |
21 | 我的
22 |
23 |
24 |
25 |
26 |
38 |
39 |
42 |
--------------------------------------------------------------------------------
/src/components/content/tabControl/TabControl.vue:
--------------------------------------------------------------------------------
1 |
2 |
10 |
11 |
12 |
36 |
37 |
63 |
--------------------------------------------------------------------------------
/src/main.js:
--------------------------------------------------------------------------------
1 | import Vue from 'vue'
2 | import App from './App.vue'
3 | import router from './router'
4 |
5 | Vue.config.productionTip = false
6 |
7 | new Vue({
8 | render: h => h(App),
9 | router
10 | }).$mount('#app')
11 |
--------------------------------------------------------------------------------
/src/network/home.js:
--------------------------------------------------------------------------------
1 | import {request} from "./request";
2 |
3 | export function getHomeMultidata() {
4 | return request({
5 | url: '/home/multidata'
6 | })
7 | }
8 |
9 | export function getHomeGoods(type, page) {
10 | return request({
11 | url: '/home/data',
12 | params: {
13 | type,
14 | page
15 | }
16 | })
17 | }
18 |
19 | // 函数调用 -> 压入函数栈(保存函数调用过程中所有变量)
20 | // 函数调用结束 -> 弹出函数栈(释放函数所有的变量)
21 | // function test() {
22 | // const names = ['why', 'aaa']
23 | // }
24 | //
25 | // test()
26 | //
27 | // test()
28 |
29 | let totalNums = []
30 |
31 | const nums1 = [20, 11, 222]
32 | const nums2 = [111, 22, 333]
33 |
34 | // for (let n of nums1) {
35 | // totalNums.push(n)
36 | // }
37 |
38 | totalNums.push(...nums1)
39 |
--------------------------------------------------------------------------------
/src/network/request.js:
--------------------------------------------------------------------------------
1 | import axios from 'axios'
2 |
3 | export function request(config) {
4 | // 1.创建axios的实例
5 | const instance = axios.create({
6 | baseURL: 'http://123.207.32.32:8000',
7 | timeout: 5000
8 | })
9 |
10 | // 2.axios的拦截器
11 | // 2.1.请求拦截的作用
12 | instance.interceptors.request.use(config => {
13 | return config
14 | }, err => {
15 | // console.log(err);
16 | })
17 |
18 | // 2.2.响应拦截
19 | instance.interceptors.response.use(res => {
20 | return res.data
21 | }, err => {
22 | console.log(err);
23 | })
24 |
25 | // 3.发送真正的网络请求
26 | return instance(config)
27 | }
28 |
--------------------------------------------------------------------------------
/src/router/index.js:
--------------------------------------------------------------------------------
1 | import Vue from 'vue'
2 | import VueRouter from 'vue-router'
3 |
4 | const Home = () => import('../views/home/Home')
5 | const Category = () => import('../views/category/Category')
6 | const Cart = () => import('../views/cart/Cart')
7 | const Profile = () => import('../views/profile/Profile')
8 |
9 | // 1.安装插件
10 | Vue.use(VueRouter)
11 |
12 | // 2.创建router
13 | const routes = [
14 | {
15 | path: '',
16 | redirect: '/home'
17 | },
18 | {
19 | path: '/home',
20 | component: Home
21 | },
22 | {
23 | path: '/category',
24 | component: Category
25 | },
26 | {
27 | path: '/cart',
28 | component: Cart
29 | },
30 | {
31 | path: '/profile',
32 | component: Profile
33 | }
34 | ]
35 | const router = new VueRouter({
36 | routes,
37 | mode: 'history'
38 | })
39 |
40 |
41 | export default router
42 |
--------------------------------------------------------------------------------
/src/views/cart/Cart.vue:
--------------------------------------------------------------------------------
1 |
2 | 购物车
3 |
4 |
5 |
10 |
11 |
14 |
--------------------------------------------------------------------------------
/src/views/category/Category.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
呵呵呵呵
9 |
10 |
11 | - 分类列表1
12 | - 分类列表2
13 | - 分类列表3
14 | - 分类列表4
15 | - 分类列表5
16 | - 分类列表6
17 | - 分类列表7
18 | - 分类列表8
19 | - 分类列表9
20 | - 分类列表10
21 | - 分类列表11
22 | - 分类列表12
23 | - 分类列表13
24 | - 分类列表14
25 | - 分类列表15
26 | - 分类列表16
27 | - 分类列表17
28 | - 分类列表18
29 | - 分类列表19
30 | - 分类列表20
31 | - 分类列表21
32 | - 分类列表22
33 | - 分类列表23
34 | - 分类列表24
35 | - 分类列表25
36 | - 分类列表26
37 | - 分类列表27
38 | - 分类列表28
39 | - 分类列表29
40 | - 分类列表30
41 | - 分类列表31
42 | - 分类列表32
43 | - 分类列表33
44 | - 分类列表34
45 | - 分类列表35
46 | - 分类列表36
47 | - 分类列表37
48 | - 分类列表38
49 | - 分类列表39
50 | - 分类列表40
51 | - 分类列表41
52 | - 分类列表42
53 | - 分类列表43
54 | - 分类列表44
55 | - 分类列表45
56 | - 分类列表46
57 | - 分类列表47
58 | - 分类列表48
59 | - 分类列表49
60 | - 分类列表50
61 | - 分类列表51
62 | - 分类列表52
63 | - 分类列表53
64 | - 分类列表54
65 | - 分类列表55
66 | - 分类列表56
67 | - 分类列表57
68 | - 分类列表58
69 | - 分类列表59
70 | - 分类列表60
71 | - 分类列表61
72 | - 分类列表62
73 | - 分类列表63
74 | - 分类列表64
75 | - 分类列表65
76 | - 分类列表66
77 | - 分类列表67
78 | - 分类列表68
79 | - 分类列表69
80 | - 分类列表70
81 | - 分类列表71
82 | - 分类列表72
83 | - 分类列表73
84 | - 分类列表74
85 | - 分类列表75
86 | - 分类列表76
87 | - 分类列表77
88 | - 分类列表78
89 | - 分类列表79
90 | - 分类列表80
91 | - 分类列表81
92 | - 分类列表82
93 | - 分类列表83
94 | - 分类列表84
95 | - 分类列表85
96 | - 分类列表86
97 | - 分类列表87
98 | - 分类列表88
99 | - 分类列表89
100 | - 分类列表90
101 | - 分类列表91
102 | - 分类列表92
103 | - 分类列表93
104 | - 分类列表94
105 | - 分类列表95
106 | - 分类列表96
107 | - 分类列表97
108 | - 分类列表98
109 | - 分类列表99
110 | - 分类列表100
111 |
112 |
113 |
114 |
115 |
116 |
151 |
152 |
161 |
--------------------------------------------------------------------------------
/src/views/home/Home.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
购物街
4 |
10 |
11 |
12 |
13 |
16 |
17 |
18 |
呵呵呵呵
19 |
20 |
21 |
22 |
23 |
123 |
124 |
164 |
--------------------------------------------------------------------------------
/src/views/home/childComps/FeatureView.vue:
--------------------------------------------------------------------------------
1 |
2 |
7 |
8 |
9 |
14 |
15 |
20 |
--------------------------------------------------------------------------------
/src/views/home/childComps/HomeSwiper.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
9 |
10 |
11 |
30 |
31 |
34 |
--------------------------------------------------------------------------------
/src/views/home/childComps/RecommendView.vue:
--------------------------------------------------------------------------------
1 |
2 |
10 |
11 |
12 |
25 |
26 |
47 |
--------------------------------------------------------------------------------
/src/views/profile/Profile.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | - 个人信息1
6 | - 个人信息2
7 | - 个人信息3
8 | - 个人信息4
9 | - 个人信息5
10 | - 个人信息6
11 | - 个人信息7
12 | - 个人信息8
13 | - 个人信息9
14 | - 个人信息10
15 | - 个人信息11
16 | - 个人信息12
17 | - 个人信息13
18 | - 个人信息14
19 | - 个人信息15
20 | - 个人信息16
21 | - 个人信息17
22 | - 个人信息18
23 | - 个人信息19
24 | - 个人信息20
25 | - 个人信息21
26 | - 个人信息22
27 | - 个人信息23
28 | - 个人信息24
29 | - 个人信息25
30 | - 个人信息26
31 | - 个人信息27
32 | - 个人信息28
33 | - 个人信息29
34 | - 个人信息30
35 | - 个人信息31
36 | - 个人信息32
37 | - 个人信息33
38 | - 个人信息34
39 | - 个人信息35
40 | - 个人信息36
41 | - 个人信息37
42 | - 个人信息38
43 | - 个人信息39
44 | - 个人信息40
45 | - 个人信息41
46 | - 个人信息42
47 | - 个人信息43
48 | - 个人信息44
49 | - 个人信息45
50 | - 个人信息46
51 | - 个人信息47
52 | - 个人信息48
53 | - 个人信息49
54 | - 个人信息50
55 | - 个人信息51
56 | - 个人信息52
57 | - 个人信息53
58 | - 个人信息54
59 | - 个人信息55
60 | - 个人信息56
61 | - 个人信息57
62 | - 个人信息58
63 | - 个人信息59
64 | - 个人信息60
65 | - 个人信息61
66 | - 个人信息62
67 | - 个人信息63
68 | - 个人信息64
69 | - 个人信息65
70 | - 个人信息66
71 | - 个人信息67
72 | - 个人信息68
73 | - 个人信息69
74 | - 个人信息70
75 | - 个人信息71
76 | - 个人信息72
77 | - 个人信息73
78 | - 个人信息74
79 | - 个人信息75
80 | - 个人信息76
81 | - 个人信息77
82 | - 个人信息78
83 | - 个人信息79
84 | - 个人信息80
85 | - 个人信息81
86 | - 个人信息82
87 | - 个人信息83
88 | - 个人信息84
89 | - 个人信息85
90 | - 个人信息86
91 | - 个人信息87
92 | - 个人信息88
93 | - 个人信息89
94 | - 个人信息90
95 | - 个人信息91
96 | - 个人信息92
97 | - 个人信息93
98 | - 个人信息94
99 | - 个人信息95
100 | - 个人信息96
101 | - 个人信息97
102 | - 个人信息98
103 | - 个人信息99
104 | - 个人信息100
105 |
106 |
107 |
108 |
109 |
110 |
120 |
121 |
128 |
--------------------------------------------------------------------------------
/vue.config.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 | configureWebpack: {
3 | resolve: {
4 | alias: {
5 | 'assets': '@/assets',
6 | 'common': '@/common',
7 | 'components': '@/components',
8 | 'network': '@/network',
9 | 'views': '@/views',
10 | }
11 | }
12 | }
13 | }
14 |
15 |
--------------------------------------------------------------------------------