Adam / gulu-vue

Download as
Browse Code »

Commit c00dd2818b67fd17bacde070ccf261287b22684c

Authored by mullins
1 parent e79b721339
Exists in master

细节修改

Showing 11 changed files with 259 additions and 211 deletions   Show diff stats
1 { 1 {
2 "name": "gulu-vue", 2 "name": "gulu-vue",
3 "version": "0.1.0", 3 "version": "0.1.0",
4 "private": true, 4 "private": true,
5 "scripts": { 5 "scripts": {
6 "serve": "npm run dev:h5", 6 "serve": "npm run dev:h5",
7 "build": "npm run build:h5", 7 "build": "npm run build:h5",
8 "build:app-plus": "cross-env NODE_ENV=production UNI_PLATFORM=app-plus vue-cli-service uni-build", 8 "build:app-plus": "cross-env NODE_ENV=production UNI_PLATFORM=app-plus vue-cli-service uni-build",
9 "build:custom": "cross-env NODE_ENV=production uniapp-cli custom", 9 "build:custom": "cross-env NODE_ENV=production uniapp-cli custom",
10 "build:h5": "cross-env NODE_ENV=production UNI_PLATFORM=h5 vue-cli-service uni-build", 10 "build:h5": "cross-env NODE_ENV=production UNI_PLATFORM=h5 vue-cli-service uni-build",
11 "build:mp-alipay": "cross-env NODE_ENV=production UNI_PLATFORM=mp-alipay vue-cli-service uni-build", 11 "build:mp-alipay": "cross-env NODE_ENV=production UNI_PLATFORM=mp-alipay vue-cli-service uni-build",
12 "build:mp-baidu": "cross-env NODE_ENV=production UNI_PLATFORM=mp-baidu vue-cli-service uni-build", 12 "build:mp-baidu": "cross-env NODE_ENV=production UNI_PLATFORM=mp-baidu vue-cli-service uni-build",
13 "build:mp-qq": "cross-env NODE_ENV=production UNI_PLATFORM=mp-qq vue-cli-service uni-build", 13 "build:mp-qq": "cross-env NODE_ENV=production UNI_PLATFORM=mp-qq vue-cli-service uni-build",
14 "build:mp-toutiao": "cross-env NODE_ENV=production UNI_PLATFORM=mp-toutiao vue-cli-service uni-build", 14 "build:mp-toutiao": "cross-env NODE_ENV=production UNI_PLATFORM=mp-toutiao vue-cli-service uni-build",
15 "build:mp-weixin": "cross-env NODE_ENV=production UNI_PLATFORM=mp-weixin vue-cli-service uni-build", 15 "build:mp-weixin": "cross-env NODE_ENV=production UNI_PLATFORM=mp-weixin vue-cli-service uni-build",
16 "build:quickapp-light": "cross-env NODE_ENV=production UNI_PLATFORM=quickapp-light vue-cli-service uni-build", 16 "build:quickapp-light": "cross-env NODE_ENV=production UNI_PLATFORM=quickapp-light vue-cli-service uni-build",
17 "build:quickapp-vue": "cross-env NODE_ENV=production UNI_PLATFORM=quickapp-vue vue-cli-service uni-build", 17 "build:quickapp-vue": "cross-env NODE_ENV=production UNI_PLATFORM=quickapp-vue vue-cli-service uni-build",
18 "dev:app-plus": "cross-env NODE_ENV=development UNI_PLATFORM=app-plus vue-cli-service uni-build --watch", 18 "dev:app-plus": "cross-env NODE_ENV=development UNI_PLATFORM=app-plus vue-cli-service uni-build --watch",
19 "dev:custom": "cross-env NODE_ENV=development uniapp-cli custom", 19 "dev:custom": "cross-env NODE_ENV=development uniapp-cli custom",
20 "dev:h5": "cross-env NODE_ENV=development UNI_PLATFORM=h5 vue-cli-service uni-serve", 20 "dev:h5": "cross-env NODE_ENV=development UNI_PLATFORM=h5 vue-cli-service uni-serve",
21 "dev:mp-alipay": "cross-env NODE_ENV=development UNI_PLATFORM=mp-alipay vue-cli-service uni-build --watch", 21 "dev:mp-alipay": "cross-env NODE_ENV=development UNI_PLATFORM=mp-alipay vue-cli-service uni-build --watch",
22 "dev:mp-baidu": "cross-env NODE_ENV=development UNI_PLATFORM=mp-baidu vue-cli-service uni-build --watch", 22 "dev:mp-baidu": "cross-env NODE_ENV=development UNI_PLATFORM=mp-baidu vue-cli-service uni-build --watch",
23 "dev:mp-qq": "cross-env NODE_ENV=development UNI_PLATFORM=mp-qq vue-cli-service uni-build --watch", 23 "dev:mp-qq": "cross-env NODE_ENV=development UNI_PLATFORM=mp-qq vue-cli-service uni-build --watch",
24 "dev:mp-toutiao": "cross-env NODE_ENV=development UNI_PLATFORM=mp-toutiao vue-cli-service uni-build --watch", 24 "dev:mp-toutiao": "cross-env NODE_ENV=development UNI_PLATFORM=mp-toutiao vue-cli-service uni-build --watch",
25 "dev:mp-weixin": "cross-env NODE_ENV=development UNI_PLATFORM=mp-weixin vue-cli-service uni-build --watch", 25 "dev:mp-weixin": "cross-env NODE_ENV=development UNI_PLATFORM=mp-weixin vue-cli-service uni-build --watch --minimize",
26 "dev:quickapp-light": "cross-env NODE_ENV=development UNI_PLATFORM=quickapp-light vue-cli-service uni-build --watch", 26 "dev:quickapp-light": "cross-env NODE_ENV=development UNI_PLATFORM=quickapp-light vue-cli-service uni-build --watch",
27 "dev:quickapp-vue": "cross-env NODE_ENV=development UNI_PLATFORM=quickapp-vue vue-cli-service uni-build --watch", 27 "dev:quickapp-vue": "cross-env NODE_ENV=development UNI_PLATFORM=quickapp-vue vue-cli-service uni-build --watch",
28 "info": "node node_modules/@dcloudio/vue-cli-plugin-uni/commands/info.js", 28 "info": "node node_modules/@dcloudio/vue-cli-plugin-uni/commands/info.js",
29 "serve:quickapp-vue": "node node_modules/@dcloudio/uni-quickapp-vue/bin/serve.js" 29 "serve:quickapp-vue": "node node_modules/@dcloudio/uni-quickapp-vue/bin/serve.js"
30 }, 30 },
31 "dependencies": { 31 "dependencies": {
32 "@dcloudio/uni-app-plus": "^2.0.0-26920200424005", 32 "@dcloudio/uni-app-plus": "^2.0.0-26920200424005",
33 "@dcloudio/uni-h5": "^2.0.0-26920200424005", 33 "@dcloudio/uni-h5": "^2.0.0-26920200424005",
34 "@dcloudio/uni-helper-json": "*", 34 "@dcloudio/uni-helper-json": "*",
35 "@dcloudio/uni-mp-alipay": "^2.0.0-26920200424005", 35 "@dcloudio/uni-mp-alipay": "^2.0.0-26920200424005",
36 "@dcloudio/uni-mp-baidu": "^2.0.0-26920200424005", 36 "@dcloudio/uni-mp-baidu": "^2.0.0-26920200424005",
37 "@dcloudio/uni-mp-qq": "^2.0.0-26920200424005", 37 "@dcloudio/uni-mp-qq": "^2.0.0-26920200424005",
38 "@dcloudio/uni-mp-toutiao": "^2.0.0-26920200424005", 38 "@dcloudio/uni-mp-toutiao": "^2.0.0-26920200424005",
39 "@dcloudio/uni-mp-weixin": "^2.0.0-26920200424005", 39 "@dcloudio/uni-mp-weixin": "^2.0.0-26920200424005",
40 "@dcloudio/uni-quickapp-light": "^2.0.0-26920200424005", 40 "@dcloudio/uni-quickapp-light": "^2.0.0-26920200424005",
41 "@dcloudio/uni-quickapp-vue": "^2.0.0-26920200424005", 41 "@dcloudio/uni-quickapp-vue": "^2.0.0-26920200424005",
42 "@dcloudio/uni-stat": "^2.0.0-26920200424005", 42 "@dcloudio/uni-stat": "^2.0.0-26920200424005",
43 "core-js": "^3.6.4", 43 "core-js": "^3.6.4",
44 "flyio": "^0.6.2", 44 "flyio": "^0.6.2",
45 "miniprogram-skeleton": "^1.0.3", 45 "miniprogram-skeleton": "^1.0.3",
46 "regenerator-runtime": "^0.12.1", 46 "regenerator-runtime": "^0.12.1",
47 "sass-resources-loader": "^2.0.3", 47 "sass-resources-loader": "^2.0.3",
48 "vue": "^2.6.11", 48 "vue": "^2.6.11",
49 "vue-class-component": "^6.3.2", 49 "vue-class-component": "^6.3.2",
50 "vue-property-decorator": "^8.0.0", 50 "vue-property-decorator": "^8.0.0",
51 "vuex": "^3.0.1" 51 "vuex": "^3.0.1"
52 }, 52 },
53 "devDependencies": { 53 "devDependencies": {
54 "@babel/plugin-syntax-typescript": "^7.2.0", 54 "@babel/plugin-syntax-typescript": "^7.2.0",
55 "@dcloudio/types": "*", 55 "@dcloudio/types": "*",
56 "@dcloudio/uni-cli-shared": "^2.0.0-26920200424005", 56 "@dcloudio/uni-cli-shared": "^2.0.0-26920200424005",
57 "@dcloudio/uni-migration": "^2.0.0-26920200424005", 57 "@dcloudio/uni-migration": "^2.0.0-26920200424005",
58 "@dcloudio/uni-template-compiler": "^2.0.0-26920200424005", 58 "@dcloudio/uni-template-compiler": "^2.0.0-26920200424005",
59 "@dcloudio/vue-cli-plugin-hbuilderx": "^2.0.0-26920200424005", 59 "@dcloudio/vue-cli-plugin-hbuilderx": "^2.0.0-26920200424005",
60 "@dcloudio/vue-cli-plugin-uni": "^2.0.0-26920200424005", 60 "@dcloudio/vue-cli-plugin-uni": "^2.0.0-26920200424005",
61 "@dcloudio/vue-cli-plugin-uni-optimize": "^2.0.0-26920200424005", 61 "@dcloudio/vue-cli-plugin-uni-optimize": "^2.0.0-26920200424005",
62 "@dcloudio/webpack-uni-mp-loader": "^2.0.0-26920200424005", 62 "@dcloudio/webpack-uni-mp-loader": "^2.0.0-26920200424005",
63 "@dcloudio/webpack-uni-pages-loader": "^2.0.0-26920200424005", 63 "@dcloudio/webpack-uni-pages-loader": "^2.0.0-26920200424005",
64 "@typescript-eslint/eslint-plugin": "^3.0.0", 64 "@typescript-eslint/eslint-plugin": "^3.0.0",
65 "@typescript-eslint/parser": "^3.0.0", 65 "@typescript-eslint/parser": "^3.0.0",
66 "@vue/cli-plugin-babel": "~4.3.0", 66 "@vue/cli-plugin-babel": "~4.3.0",
67 "@vue/cli-plugin-typescript": "*", 67 "@vue/cli-plugin-typescript": "*",
68 "@vue/cli-service": "~4.3.0", 68 "@vue/cli-service": "~4.3.0",
69 "babel-plugin-import": "^1.11.0", 69 "babel-plugin-import": "^1.11.0",
70 "cross-env": "^7.0.2", 70 "cross-env": "^7.0.2",
71 "eslint": "^7.0.0", 71 "eslint": "^7.0.0",
72 "eslint-config-prettier": "^6.11.0", 72 "eslint-config-prettier": "^6.11.0",
73 "eslint-config-standard": "^14.1.1", 73 "eslint-config-standard": "^14.1.1",
74 "eslint-plugin-import": "^2.20.2", 74 "eslint-plugin-import": "^2.20.2",
75 "eslint-plugin-node": "^11.1.0", 75 "eslint-plugin-node": "^11.1.0",
76 "eslint-plugin-prettier": "^3.1.3", 76 "eslint-plugin-prettier": "^3.1.3",
77 "eslint-plugin-promise": "^4.2.1", 77 "eslint-plugin-promise": "^4.2.1",
78 "eslint-plugin-standard": "^4.0.1", 78 "eslint-plugin-standard": "^4.0.1",
79 "eslint-plugin-vue": "^6.2.2", 79 "eslint-plugin-vue": "^6.2.2",
80 "node-sass": "^4.14.0", 80 "node-sass": "^4.14.0",
81 "postcss-comment": "^2.0.0", 81 "postcss-comment": "^2.0.0",
82 "prettier": "^2.0.5", 82 "prettier": "^2.0.5",
83 "sass-loader": "^8.0.2", 83 "sass-loader": "^8.0.2",
84 "typescript": "^3.0.0", 84 "typescript": "^3.0.0",
85 "vue-template-compiler": "^2.6.11" 85 "vue-template-compiler": "^2.6.11"
86 }, 86 },
87 "browserslist": [ 87 "browserslist": [
88 "Android >= 4", 88 "Android >= 4",
89 "ios >= 8" 89 "ios >= 8"
90 ], 90 ],
91 "uni-app": { 91 "uni-app": {
92 "scripts": {} 92 "scripts": {}
93 } 93 }
94 } 94 }
95
1 { 1 {
2 "pages": [ 2 "pages": [
3 { 3 {
4 "path": "pages/index/index", 4 "path": "pages/index/index",
5 "style": { 5 "style": {
6 "navigationBarTitleText": "商城一览" 6 "navigationBarTitleText": "商城一览"
7 } 7 }
8 }, 8 },
9 { 9 {
10 "path": "pages/user/user", 10 "path": "pages/user/user",
11 "style": { 11 "style": {
12 "navigationBarTitleText": "我的" 12 "navigationBarTitleText": "我的"
13 } 13 }
14 }, 14 },
15 { 15 {
16 "path": "pages/addOpticsData/addOpticsData", 16 "path": "pages/addOpticsData/addOpticsData",
17 "style": { 17 "style": {
18 "navigationBarTitleText": "验光数据" 18 "navigationBarTitleText": "验光数据"
19 } 19 }
20 }, 20 },
21 { 21 // {
22 "path": "pages/detailsChoiceArgs/detailsChoiceArgs", 22 // "path": "pages/detailsChoiceArgs/detailsChoiceArgs",
23 "style": { 23 // "style": {
24 "navigationBarTitleText": "镜片名称名称" 24 // "navigationBarTitleText": "镜片名称名称"
25 } 25 // }
26 }, 26 // },
27 { 27 // {
28 "path": "pages/purchaseLenses/purchaseLenses", 28 // "path": "pages/purchaseLenses/purchaseLenses",
29 "style": { 29 // "style": {
30 "navigationBarTitleText": "参数选择" 30 // "navigationBarTitleText": "参数选择"
31 } 31 // }
32 }, 32 // },
33 { 33 // {
34 "path": "pages/lensDetails/lensDetails", 34 // "path": "pages/lensDetails/lensDetails",
35 "style": { 35 // "style": {
36 "navigationBarTitleText": "产品详情" 36 // "navigationBarTitleText": "产品详情"
37 } 37 // }
38 }, 38 // },
39 { 39 {
40 "path": "pages/details/details", 40 "path": "pages/details/details",
41 "style": { 41 "style": {
42 "navigationBarTitleText": "产品详情" 42 "navigationBarTitleText": "产品详情"
43 } 43 }
44 }, 44 },
45 { 45 {
46 "path": "pages/myOrderPaying/myOrderPaying", 46 "path": "pages/myOrderPaying/myOrderPaying",
47 "style": { 47 "style": {
48 "navigationBarTitleText": "我的订单" 48 "navigationBarTitleText": "我的订单"
49 } 49 }
50 }, 50 },
51 { 51 {
52 "path": "pages/myOrder/myOrder", 52 "path": "pages/myOrder/myOrder",
53 "style": { 53 "style": {
54 "navigationBarTitleText": "我的订单" 54 "navigationBarTitleText": "我的订单"
55 } 55 }
56 }, 56 },
57 { 57 {
58 "path": "pages/cart/cart", 58 "path": "pages/cart/cart",
59 "style": { 59 "style": {
60 "navigationBarTitleText": "购物车", 60 "navigationBarTitleText": "购物车",
61 // "disableScroll":true, 61 // "disableScroll":true,
62 "app-plus":{ 62 "app-plus": {
63 "bounce":"none" 63 "bounce": "none"
64 } 64 }
65 }
66 },
67 {
68 "path": "pages/frameDetail/frameDetail",
69 "style": {
70 "navigationBarTitleText": "产品详情"
71 } 65 }
72 }, 66 },
73 // { 67 // {
68 // "path": "pages/frameDetail/frameDetail",
69 // "style": {
70 // "navigationBarTitleText": "产品详情"
71 // }
72 // },
73 // {
74 // "path": "pages/refundProgress/refundProgress", 74 // "path": "pages/refundProgress/refundProgress",
75 // "style": { 75 // "style": {
76 // "navigationBarTitleText": "申请退款" 76 // "navigationBarTitleText": "申请退款"
77 // } 77 // }
78 // }, 78 // },
79 { 79 {
80 "path": "pages/address/addAddress", 80 "path": "pages/address/addAddress",
81 "style": { 81 "style": {
82 "navigationBarTitleText": "新增地址" 82 "navigationBarTitleText": "新增地址"
83 } 83 }
84 }, 84 },
85 { 85 {
86 "path": "pages/address/addressList", 86 "path": "pages/address/addressList",
87 "style": { 87 "style": {
88 "navigationBarTitleText": "地址管理" 88 "navigationBarTitleText": "地址管理"
89 } 89 }
90 }, 90 },
91 { 91 {
92 "path": "pages/confirmOrder/confirmOrder", 92 "path": "pages/confirmOrder/confirmOrder",
93 "style": { 93 "style": {
94 "navigationBarTitleText": "确认订单" 94 "navigationBarTitleText": "确认订单"
95 } 95 }
96 }, 96 },
97 // { 97 // {
98 // "path": "pages/refundment/refundWays", 98 // "path": "pages/refundment/refundWays",
99 // "style": { 99 // "style": {
100 // "navigationBarTitleText": "退款方式" 100 // "navigationBarTitleText": "退款方式"
101 // } 101 // }
102 // }, 102 // },
103 // { 103 // {
104 // "path": "pages/refundment/refundment", 104 // "path": "pages/refundment/refundment",
105 // "style": { 105 // "style": {
106 // "navigationBarTitleText": "申请退款" 106 // "navigationBarTitleText": "申请退款"
107 // } 107 // }
108 // }, 108 // },
109 { 109 {
110 "path": "pages/predelivery/predelivery", 110 "path": "pages/predelivery/predelivery",
111 "style": { 111 "style": {
112 "navigationBarTitleText": "待发货" 112 "navigationBarTitleText": "待发货"
113 } 113 }
114 }, 114 },
115 { 115 // {
116 "path": "pages/customerService/customerService", 116 // "path": "pages/customerService/customerService",
117 "style": { 117 // "style": {
118 "navigationBarTitleText": "在线客服" 118 // "navigationBarTitleText": "在线客服"
119 } 119 // }
120 }, 120 // },
121 { 121 // {
122 "path": "pages/detailStandard/detailStandard_sun", 122 // "path": "pages/detailStandard/detailStandard_sun",
123 "style": { 123 // "style": {
124 "navigationBarTitleText": "太阳镜选购页" 124 // "navigationBarTitleText": "太阳镜选购页"
125 } 125 // }
126 }, 126 // },
127 { 127 // {
128 "path": "pages/detailStandard/detailStandard_k", 128 // "path": "pages/detailStandard/detailStandard_k",
129 "style": { 129 // "style": {
130 "navigationBarTitleText": "镜框选购页" 130 // "navigationBarTitleText": "镜框选购页"
131 } 131 // }
132 }, 132 // },
133 { 133 {
134 "path": "pages/newOpticsData/newOpticsData", 134 "path": "pages/newOpticsData/newOpticsData",
135 "style": { 135 "style": {
136 "navigationBarTitleText": "验光数据" 136 "navigationBarTitleText": "验光数据"
137 } 137 }
138 } 138 }
139 ], 139 ],
140 "subpackages": [ 140 "subpackages": [
141 { 141 {
142 "root": "pages/refundment", 142 "root": "refundment",
143 "pages": [ 143 "pages": [
144 "pages/refundment/refundWays", 144 {
145 "pages/refundment/refundment", 145 "path": "refundWays",
146 "pages/refundProgress/refundProgress" 146 "style": {}
147 },
148 {
149 "path": "refundment",
150 "style": {}
151 },
152 {
153 "path": "/pages/refundProgress/refundProgress",
154 "style": {}
155 }
147 ] 156 ]
148 }, 157 },
149 { 158 {
150 "root": "pages/address", 159 "root": "address",
151 "name": "pack2", 160 "name": "pack2",
152 "pages": [ 161 "pages": [
153 "pages/address/addAddress", 162 {
154 "pages/address/addressList" 163 "path": "addAddress",
155 ] 164 "style": {}
156 }, 165 },
157 { 166 {
158 "root": "pages/myOrder", 167 "path": "addressList",
159 "name": "pack3", 168 "style": {}
160 "pages": [ 169 }
161 "pages/myOrder/myOrder",
162 "pages/myOrderPaying/myOrderPaying"
163 ] 170 ]
164 } 171 }
172 // {
173 // "root": "pages/myOrder",
174 // "name": "pack3",
175 // "pages": [
176 // {
177 // "path": "pages/myOrder/myOrder",
178 // "style": {}
179 // },
180 // {
181 // "path": "pages/myOrderPaying/myOrderPaying",
182 // "style": {}
183 // }
184 // ]
185 // }
165 ], 186 ],
166 "globalStyle": { 187 "globalStyle": {
167 "navigationBarTextStyle": "black", 188 "navigationBarTextStyle": "black",
168 "navigationBarTitleText": "uni-app", 189 "navigationBarTitleText": "uni-app",
169 "navigationBarBackgroundColor": "#F8F8F8", 190 "navigationBarBackgroundColor": "#F8F8F8",
170 "backgroundColor": "#F8F8F8" 191 "backgroundColor": "#F8F8F8"
171 }, 192 },
172 "tabBar": { 193 "tabBar": {
173 "color": "#C0C4CC", 194 "color": "#C0C4CC",
174 "selectedColor": "#fa436a", 195 "selectedColor": "#fa436a",
175 "borderStyle": "black", 196 "borderStyle": "black",
176 "backgroundColor": "#ffffff", 197 "backgroundColor": "#ffffff",
177 "list": [ 198 "list": [
178 { 199 {
179 "pagePath": "pages/index/index", 200 "pagePath": "pages/index/index",
180 "iconPath": "static/tab-home.png", 201 "iconPath": "static/tab-home.png",
181 "selectedIconPath": "static/tab-home-current.png", 202 "selectedIconPath": "static/tab-home-current.png",
182 "text": "首页" 203 "text": "首页"
183 }, 204 },
184 { 205 {
185 "pagePath": "pages/cart/cart", 206 "pagePath": "pages/cart/cart",
186 "iconPath": "static/tab-cart.png", 207 "iconPath": "static/tab-cart.png",
187 "selectedIconPath": "static/tab-cart-current.png", 208 "selectedIconPath": "static/tab-cart-current.png",
188 "text": "购物车" 209 "text": "购物车"
189 }, 210 },
190 { 211 {
191 "pagePath": "pages/user/user", 212 "pagePath": "pages/user/user",
192 "iconPath": "static/tab-my.png", 213 "iconPath": "static/tab-my.png",
193 "selectedIconPath": "static/tab-my-current.png", 214 "selectedIconPath": "static/tab-my-current.png",
194 "text": "我的" 215 "text": "我的"
195 } 216 }
196 ] 217 ]
197 }, 218 },
198 "condition": { 219 "condition": {
199 "current": 0, 220 "current": 0,
200 "list": [ 221 "list": [
201 // { 222 // {
202 // "name": "首页", 223 // "name": "首页",
203 // "path": "pages/test/index", 224 // "path": "pages/test/index",
204 // "query": "" 225 // "query": ""
205 // }, 226 // },
206 { 227 {
207 "name": "首页", 228 "name": "首页",
208 "path": "pages/index/index", 229 "path": "pages/index/index",
209 "query": "" 230 "query": ""
210 }, 231 },
211 { 232 {
212 "name": "产品详情", 233 "name": "产品详情",
213 "path": "pages/details/details", 234 "path": "pages/details/details",
214 "query": "" 235 "query": ""
215 }, 236 },
216 { 237 {
217 "name": "旧版产品详情", 238 "name": "旧版产品详情",
218 "path": "pages/frameDetail/frameDetail", 239 "path": "pages/frameDetail/frameDetail",
219 "query": "" 240 "query": ""
220 }, 241 },
221 { 242 {
222 "name": "镜片、美瞳参数选择", 243 "name": "镜片、美瞳参数选择",
223 "path": "pages/purchaseLenses/purchaseLenses", 244 "path": "pages/purchaseLenses/purchaseLenses",
224 "query": "" 245 "query": ""
225 }, 246 },
226 { 247 {
227 "name": "确认订单", 248 "name": "确认订单",
228 "path": "pages/confirmOrder/confirmOrder", 249 "path": "pages/confirmOrder/confirmOrder",
229 "query": "" 250 "query": ""
230 }, 251 },
231 { 252 {
232 "name": "新增地址", 253 "name": "新增地址",
233 "path": "pages/address/addAddress", 254 "path": "pages/address/addAddress",
234 "query": "" 255 "query": ""
235 }, 256 },
236 { 257 {
237 "name": "地址管理", 258 "name": "地址管理",
238 "path": "pages/address/addressList", 259 "path": "pages/address/addressList",
239 "query": "" 260 "query": ""
240 }, 261 },
241 { 262 {
242 "name": "我的订单", 263 "name": "我的订单",
243 "path": "pages/myOrder/myOrder", 264 "path": "pages/myOrder/myOrder",
244 "query": "" 265 "query": ""
245 }, 266 },
246 { 267 {
247 "name": "待付款订单详情", 268 "name": "待付款订单详情",
248 "path": "pages/myOrderPaying/myOrderPaying", 269 "path": "pages/myOrderPaying/myOrderPaying",
249 "query": "" 270 "query": ""
250 }, 271 },
src/pages/details/details.vue
Diff comments   View file @c00dd28
1 <template> 1 <template>
2 <view class="container"> 2 <view class="container">
3 <!-- 基础信息 --> 3 <!-- 基础信息 -->
4 <view class="basic_info"> 4 <view class="basic_info">
5 <!-- 轮播图 --> 5 <!-- 轮播图 -->
6 <swiper 6 <swiper
7 class="swiperImage" 7 class="swiperImage"
8 :indicator-dots="true" 8 :indicator-dots="true"
9 :autoplay="true" 9 :autoplay="true"
10 :interval="4000" 10 :interval="4000"
11 :duration="500" 11 :duration="500"
12 > 12 >
13 <swiper-item 13 <swiper-item
14 v-for="(item, index) in carousel" 14 v-for="(item, index) in carousel"
15 :key="index" 15 :key="index"
16 > 16 >
17 <image 17 <image
18 :src="item" 18 :src="item"
19 mode="scaleToFill" 19 mode="scaleToFill"
20 ></image> 20 ></image>
21 </swiper-item> 21 </swiper-item>
22 </swiper> 22 </swiper>
23 <!-- 产品价格及购买人数 --> 23 <!-- 产品价格及购买人数 -->
24 <view class="info_pay"> 24 <view class="info_pay">
25 <view>￥{{goodsInfo.price || '暂无'}}<span 25 <view>￥{{goodsInfo.price || '暂无'}}<span
26 v-if="goodsInfo.discountPrice" 26 v-if="goodsInfo.discountPrice"
27 class="info_pay_discount" 27 class="info_pay_discount"
28 >¥{{goodsInfo.discountPrice}}</span></view> 28 >¥{{goodsInfo.discountPrice}}</span></view>
29 <span class="info_pay_number">{{goodsInfo.tradeNumber || '暂无'}}人购买过</span> 29 <span class="info_pay_number">{{goodsInfo.tradeNumber || '暂无'}}人购买过</span>
30 </view> 30 </view>
31 <!-- 产品名称 --> 31 <!-- 产品名称 -->
32 <view class="info_name"> 32 <view class="info_name">
33 <text class="info_name_name">{{goodsInfo.name || '暂无'}}</text> 33 <text class="info_name_name">{{goodsInfo.name || '暂无'}}</text>
34 <view 34 <view
35 @tap="confirmShare" 35 @tap="confirmShare"
36 class="info_name_share" 36 class="info_name_share"
37 > 37 >
38 <image src="/static/img/detail/share-icon.png"></image> 38 <image src="/static/img/detail/share-icon.png"></image>
39 <text>分享</text> 39 <text>分享</text>
40 </view> 40 </view>
41 </view> 41 </view>
42 <!-- 产品售后信息 --> 42 <!-- 产品售后信息 -->
43 <view class="info_after"> 43 <view class="info_after">
44 <span>支持7天无理由退货</span> 44 <span>支持7天无理由退货</span>
45 <span>顺丰发货</span> 45 <span>顺丰发货</span>
46 <span>30天质量保证</span> 46 <span>30天质量保证</span>
47 </view> 47 </view>
48 </view> 48 </view>
49 <!-- 详细信息 --> 49 <!-- 详细信息 -->
50 <view class="detail_info"> 50 <view class="detail_info">
51 <!-- 详细信息菜单 --> 51 <!-- 详细信息菜单 -->
52 <view class="screen_bar"> 52 <view class="screen_bar">
53 <view 53 <view
54 v-for="(item, index) in screenItems" 54 v-for="(item, index) in screenItems"
55 :key="index" 55 :key="index"
56 @click="tabChange(index)" 56 @click="tabChange(index)"
57 > 57 >
58 <view 58 <view
59 class="screen_item" 59 class="screen_item"
60 v-bind:class="{ item_active: item_current === index }" 60 v-bind:class="{ item_active: item_current === index }"
61 >{{ screenItems[index] || '暂无' }}</view> 61 >{{ screenItems[index] || '暂无' }}</view>
62 </view> 62 </view>
63 </view> 63 </view>
64 <!-- 商品介绍 --> 64 <!-- 商品介绍 -->
65 <view 65 <view
66 class="screen_item" 66 class="screen_item"
67 v-if="item_current === 0" 67 v-if="item_current === 0"
68 > 68 >
69 <Introduce :tag="tag" /> 69 <Introduce :tag="tag" />
70 </view> 70 </view>
71 <!-- 规格参数 --> 71 <!-- 规格参数 -->
72 <view 72 <view
73 class="screen_item" 73 class="screen_item"
74 v-if="item_current === 1" 74 v-if="item_current === 1"
75 > 75 >
76 <view class="specification"> 76 <view class="specification">
77 <view 77 <view
78 class="spe_item" 78 class="spe_item"
79 v-for="(item, index) in specification" 79 v-for="(item, index) in specification"
80 :key="index" 80 :key="index"
81 > 81 >
82 <image 82 <image
83 class="spe_image" 83 class="spe_image"
84 v-bind:src="item.img" 84 v-bind:src="item.img"
85 ></image> 85 ></image>
86 <span>{{item.standard || '暂无'}}</span> 86 <span>{{item.standard || '暂无'}}</span>
87 <span>{{item.slength || '暂无'}}</span> 87 <span>{{item.slength || '暂无'}}</span>
88 </view> 88 </view>
89 </view> 89 </view>
90 </view> 90 </view>
91 <!-- 售后保障 --> 91 <!-- 售后保障 -->
92 <view 92 <view
93 class="screen_item" 93 class="screen_item"
94 v-if="item_current === 2" 94 v-if="item_current === 2"
95 > 95 >
96 <AfterSails /> 96 <AfterSails />
97 </view> 97 </view>
98 </view> 98 </view>
99 <!-- 评价 --> 99 <!-- 评价 -->
100 <template v-if="item_current !== 2"> 100 <template v-if="item_current !== 2">
101 <view class="evaluate"> 101 <view class="evaluate">
102 <!-- 标题 --> 102 <!-- 标题 -->
103 <view class="evaluate_title"> 103 <view class="evaluate_title">
104 <view><span>宝贝好评率</span><span class="title_rate">{{evaluate.rate}}</span></view> 104 <view><span>宝贝好评率</span><span class="title_rate">{{evaluate.rate}}</span></view>
105 <!-- 星星 --> 105 <!-- 星星 -->
106 <view class="evaluate_star"> 106 <view class="evaluate_star">
107 <view 107 <view
108 class="star" 108 class="star"
109 v-for="(item, index) in evaluate.star" 109 v-for="(item, index) in evaluate.star"
110 :key="index" 110 :key="index"
111 > 111 >
112 <image 112 <image
113 src="../../static/img/detail/d_star.png" 113 src="../../static/img/detail/d_star.png"
114 mode="aspectFill" 114 mode="aspectFill"
115 style="height: 26rpx; width: 28rpx;" 115 style="height: 26rpx; width: 28rpx;"
116 ></image> 116 ></image>
117 </view> 117 </view>
118 </view> 118 </view>
119 </view> 119 </view>
120 <!-- 标签 --> 120 <!-- 标签 -->
121 <view class="evaluate_tag"> 121 <view class="evaluate_tag">
122 <view 122 <view
123 v-for="(item, index) in evaluate.tag" 123 v-for="(item, index) in evaluate.tag"
124 :key="index" 124 :key="index"
125 >{{item.name}}</view> 125 >{{item.name}}</view>
126 </view> 126 </view>
127 </view> 127 </view>
128 </template> 128 </template>
129 <!-- 商品详情页 --> 129 <!-- 商品详情页 -->
130 <template v-if="current !==2"> 130 <template v-if="current !==2">
131 <view class="more_info"> 131 <view class="more_info">
132 <view 132 <view
133 class="more_fixed1" 133 class="more_fixed1"
134 @click="consolg(goodInfo.prodIntro1)" 134 @click="consolg(goodInfo.prodIntro1)"
135 > 135 >
136 <image src="/static/img/detail/hr.png"></image> 136 <image src="/static/img/detail/hr.png"></image>
137 <view>商品详情</view> 137 <view>商品详情</view>
138 <image src="/static/img/detail/hr.png"></image> 138 <image src="/static/img/detail/hr.png"></image>
139 </view> 139 </view>
140 <view 140 <view
141 class="more_all" 141 class="more_all"
142 v-html="more" 142 v-html="more"
143 > 143 >
144 </view> 144 </view>
145 </view> 145 </view>
146 </template> 146 </template>
147 <!-- 底部菜单 --> 147 <!-- 底部菜单 -->
148 <view class="menu"> 148 <view class="menu">
149 <view 149 <view
150 @tap="toCart()" 150 @tap="toCart()"
151 class="menu_1" 151 class="menu_1"
152 > 152 >
153 <view class="cart_icon"> 153 <view class="cart_icon">
154 <image src="/static/tab-cart.png" /> 154 <image src="/static/tab-cart.png" />
155 <text>{{cartNumber}}</text> 155 <text>{{cartNumber}}</text>
156 </view> 156 </view>
157 <view class="menu_image">购物车</view> 157 <view class="menu_image">购物车</view>
158 </view> 158 </view>
159 <view class="menu_2"> 159 <view class="menu_2">
160 <view 160 <view
161 class="menu_input" 161 class="menu_input"
162 @tap="showBottom(1)" 162 @tap="showBottom(1)"
163 >加入购物车</view> 163 >加入购物车</view>
164 <view 164 <view
165 class="menu_now" 165 class="menu_now"
166 @click="showBottom(2)" 166 @click="showBottom(2)"
167 >立即购买</view> 167 >立即购买</view>
168 </view> 168 </view>
169 </view> 169 </view>
170 <!-- 参数选择 --> 170 <!-- 参数选择 -->
171 <template v-if="isShowBottom"> 171 <template v-if="isShowBottom">
172 <BottomSheet 172 <BottomSheet
173 :isCart="isCart" 173 :isCart="isCart"
174 @addCart="addCart" 174 @addCart="addCart"
175 :pid="pid" 175 :pid="pid"
176 :goodInfo="goodInfo" 176 :goodInfo="goodInfo"
177 :isShowBottom="isShowBottom" 177 :isShowBottom="isShowBottom"
178 @closeBottom="closeBottom" 178 @closeBottom="closeBottom"
179 ></BottomSheet> 179 ></BottomSheet>
180 </template> 180 </template>
181 <!-- 分享 --> 181 <!-- 分享 -->
182 <template> 182 <template>
183 <uni-popup 183 <uni-popup
184 ref="popupShare" 184 ref="popupShare"
185 type="share" 185 type="share"
186 > 186 >
187 <uni-popup-share @select="selectShare"></uni-popup-share> 187 <uni-popup-share @select="selectShare"></uni-popup-share>
188 </uni-popup> 188 </uni-popup>
189 </template> 189 </template>
190 <!-- 分享海报 --> 190 <!-- 分享海报 -->
191 <template> 191 <template>
192 <uni-popup 192 <uni-popup
193 ref="uniPopupPost" 193 ref="uniPopupPost"
194 type="center" 194 type="center"
195 > 195 >
196 <uni-popup-post :postUrl="postUrl"></uni-popup-post> 196 <uni-popup-post :postUrl="postUrl"></uni-popup-post>
197 </uni-popup> 197 </uni-popup>
198 </template> 198 </template>
199 </view> 199 </view>
200 </template> 200 </template>
201 201
202 <script> 202 <script>
203 import store from '@/store' 203 import store from '@/store'
204 import Introduce from './components/Introduce' // 商品介绍基本信息组件 204 import Introduce from './components/Introduce' // 商品介绍基本信息组件
205 import AfterSails from './components/AfterSails' // 售后保障组件 205 import AfterSails from './components/AfterSails' // 售后保障组件
206 import uniPopupShare from '@/components/uni-popup/uni-popup-share.vue' // 分享组件 206 import uniPopupShare from '@/components/uni-popup/uni-popup-share.vue' // 分享组件
207 import uniPopupPost from '@/components/uni-popup/uni-popup-post.vue' // 分享组件 207 import uniPopupPost from '@/components/uni-popup/uni-popup-post.vue' // 分享组件
208 import BottomSheet from '@/components/BottomSheet/BottomSheet.vue' // 参数选择组件 208 import BottomSheet from '@/components/BottomSheet/BottomSheet.vue' // 参数选择组件
209 209
210 export default { 210 export default {
211 components: { 211 components: {
212 Introduce, 212 Introduce,
213 AfterSails, 213 AfterSails,
214 BottomSheet, 214 BottomSheet,
215 uniPopupShare, 215 uniPopupShare,
216 uniPopupPost, 216 uniPopupPost,
217 }, 217 },
218 data () { 218 data () {
219 return { 219 return {
220 pid: 7, // 产品ID 220 pid: 7, // 产品ID
221 skId: undefined, // skuId 221 skId: undefined, // skuId
222 // 详细信息菜单 222 // 详细信息菜单
223 item_current: 0, 223 item_current: 0,
224 screenItems: [ 224 screenItems: [
225 '商品介绍', 225 '商品介绍',
226 '规格参数', 226 '规格参数',
227 '售后保障', 227 '售后保障',
228 ], 228 ],
229 showPostImg: false, // 是否展示分享海报 229 showPostImg: false, // 是否展示分享海报
230 isShowBottom: false, // 是否展示参数选择 230 isShowBottom: false, // 是否展示参数选择
231 isCart: 1, // 参数选择 按钮判断 231 isCart: 1, // 参数选择 按钮判断
232 } 232 }
233 }, 233 },
234 onLoad({ pid = this.pid, sk_id: skId }) { 234 onLoad({ pid = this.pid, sk_id: skId }) {
235 // 根据页面传参请求页面数据 235 // 根据页面传参请求页面数据
236 this.pid = pid 236 this.pid = pid
237 this.skId = skId 237 this.skId = skId
238 238
239 // 获取产品详情 239 // 获取产品详情
240 this.getDetails({ pid, skId }) 240 this.getDetails({ pid, skId })
241 // 获取购物车数据 241 // 获取购物车数据
242 this.getCartNum() 242 this.getCartNum()
243 }, 243 },
244 computed: { 244 computed: {
245 // 获取轮播图数据 245 // 获取轮播图数据
246 goodInfo() { 246 goodInfo() {
247 return this.$store.state.details.goodInfo 247 return this.$store.state.details.goodInfo
248 }, 248 },
249 // 获取轮播图数据 249 // 获取轮播图数据
250 carousel() { 250 carousel() {
251 return this.$store.state.details.carousel 251 return this.$store.state.details.carousel
252 }, 252 },
253 // 商品基本信息 253 // 商品基本信息
254 goodsInfo() { 254 goodsInfo() {
255 return this.$store.state.details.goodsInfo 255 return this.$store.state.details.goodsInfo
256 }, 256 },
257 // 商品介绍商品标签 257 // 商品介绍商品标签
258 tag() { 258 tag() {
259 return this.$store.state.details.tag 259 return this.$store.state.details.tag
260 }, 260 },
261 // 规格参数 261 // 规格参数
262 specification() { 262 specification() {
263 return this.$store.state.details.specification 263 return this.$store.state.details.specification
264 }, 264 },
265 // 评价 265 // 评价
266 evaluate() { 266 evaluate() {
267 return this.$store.state.details.evaluate 267 return this.$store.state.details.evaluate
268 }, 268 },
269 // 商品详情 269 // 商品详情
270 more() { 270 more() {
271 return this.$store.state.details.more 271 return this.$store.state.details.more
272 }, 272 },
273 // 购物车数目 273 // 购物车数目
274 cartNumber() { 274 cartNumber() {
275 return this.$store.state.details.cartNumber 275 return this.$store.state.details.cartNumber
276 }, 276 },
277 // 购物车数目 277 // 购物车数目
278 skuList() { 278 skuList() {
279 return this.$store.state.details.skuList 279 return this.$store.state.details.skuList
280 }, 280 },
281 // 分享海报 281 // 分享海报
282 postUrl() { 282 postUrl() {
283 return this.$store.state.details.postUrl 283 return this.$store.state.details.postUrl
284 }, 284 },
285 }, 285 },
286 methods: { 286 methods: {
287 // 获取产品详情 287 // 获取产品详情
288 getDetails({ pid, skId }) { 288 getDetails({ pid, skId }) {
289 store.dispatch('details/details', { 289 store.dispatch('details/details', {
290 pid, 290 pid,
291 sk_id: skId, 291 sk_id: skId,
292 }) 292 })
293 store.dispatch('read/fetch', { 293 store.dispatch('read/fetch', {
294 pid, 294 pid,
295 sk_id: skId, 295 sk_id: skId,
296 }) 296 })
297 }, 297 },
298 // 获取购物车数目 298 // 获取购物车数目
299 getCartNum() { 299 getCartNum() {
300 store.dispatch('details/getCartNumber') 300 store.dispatch('details/getCartNumber')
301 }, 301 },
302 // 切换详细信息菜单 302 // 切换详细信息菜单
303 tabChange (e) { 303 tabChange (e) {
304 if (this.current !== e) { 304 if (this.current !== e) {
305 this.item_current = e 305 this.item_current = e
306 } 306 }
307 }, 307 },
308 // 打开分享界面 308 // 打开分享界面
309 confirmShare() { 309 confirmShare() {
310 this.$refs.popupShare.open() 310 this.$refs.popupShare.open()
311 }, 311 },
312 // 选择分享 312 // 选择分享
313 selectShare(e, done) { 313 selectShare(e, done) {
314 switch (e.item.name) { 314 switch (e.item.name) {
315 // 分享到好物圈 315 // 分享到好物圈
316 case 'recommend': 316 case 'recommend':
317 this.shareRecommend() 317 this.shareRecommend()
318 break 318 break
319 // 分享到朋友圈 319 // 分享到朋友圈
320 case 'friend': 320 case 'friend':
321 break 321 break
322 // 生成海报 322 // 生成海报
323 case 'poster': 323 case 'poster':
324 uni.showLoading({ 324 uni.showLoading({
325 title: '生成图片中', 325 title: '生成图片中',
326 }) 326 })
327 this.sharePost() 327 this.sharePost()
328 break 328 break
329 default: 329 default:
330 break 330 break
331 } 331 }
332 done() 332 done()
333 }, 333 },
334 // 分享到好物圈 334 // 分享到好物圈
335 shareRecommend() { 335 shareRecommend() {
336 if (wx.openBusinessView) { 336 if (wx.openBusinessView) {
337 wx.openBusinessView({ 337 wx.openBusinessView({
338 businessType: 'friendGoodsRecommend', 338 businessType: 'friendGoodsRecommend',
339 extraData: { 339 extraData: {
340 product: { 340 product: {
341 item_code: '58_68', 341 item_code: '58_68',
342 title: this.goodsInfo.name, 342 title: this.goodsInfo.name,
343 image_list: this.carousel, 343 image_list: this.carousel,
344 }, 344 },
345 }, 345 },
346 success: function (res) { 346 success: function (res) {
347 uni.showToast({ 347 uni.showToast({
348 title: '好物圈分享成功！', 348 title: '好物圈分享成功！',
349 icon: 'none', 349 icon: 'none',
350 duration: 2000, 350 duration: 2000,
351 }) 351 })
352 // 向服务器报告这个事情 352 // 向服务器报告这个事情
353 // TODO:::记录这个用户的推广过程。 353 // TODO:::记录这个用户的推广过程。
354 console.log('好物圈分享成功！', res) 354 console.log('好物圈分享成功！', res)
355 }, 355 },
356 fail: function (res) { 356 fail: function (res) {
357 console.log('好物圈分享失败！', res) 357 console.log('好物圈分享失败！', res)
358 }, 358 },
359 }) 359 })
360 } 360 }
361 }, 361 },
362 // 分享到朋友/圈 362 // 分享到朋友/圈
363 shareFriend() { 363 shareFriend() {
364 this.onShareAppMessage() 364 this.onShareAppMessage()
365 }, 365 },
366 // 朋友圈设置页面 366 // 朋友圈设置页面
367 onShareAppMessage() { 367 onShareAppMessage() {
368 let myName = this.$store.state.user.userInfo.nickName 368 let myName = this.$store.state.user.userInfo.nickName
369 if (myName === '' || myName.length < 1 || myName === '匿名用户' || typeof myName === 'undefined') { 369 if (myName === '' || myName.length < 1 || myName === '匿名用户' || typeof myName === 'undefined') {
370 myName = '【神秘人】' 370 myName = '【神秘人】'
371 } else { 371 } else {
372 myName = '【' + myName + '】' 372 myName = '【' + myName + '】'
373 } 373 }
374 const uid = uni.getStorageSync('uid') 374 const uid = uni.getStorageSync('uid')
375 return { 375 return {
376 title: 'Hi，' + myName + '送你300元来试戴最新潮流眼镜！', // 默认是小程序的名称(可以写slogan等) 376 title: 'Hi，' + myName + '送你300元来试戴最新潮流眼镜！', // 默认是小程序的名称(可以写slogan等)
377 path: '/pages/index/detail/index?uid=' + uid + '&sid=0&pid=' + this.pid, 377 path: '/pages/index/detail/index?uid=' + uid + '&sid=0&pid=' + this.pid,
378 imageUrl: this.skuList[0].pic, // 不传入 imageUrl 则使用默认截图。显示图片长宽比是 5:4 378 imageUrl: this.skuList[0].pic, // 不传入 imageUrl 则使用默认截图。显示图片长宽比是 5:4
379 success: function (res) { 379 success: function (res) {
380 if (res.errMsg === 'shareAppMessage:ok') { 380 if (res.errMsg === 'shareAppMessage:ok') {
381 console.log('分享成功！', res) 381 console.log('分享成功！', res)
382 } 382 }
383 }, 383 },
384 fail: function (res) { 384 fail: function (res) {
385 if (res.errMsg === 'shareAppMessage:fail cancel') { 385 if (res.errMsg === 'shareAppMessage:fail cancel') {
386 console.log('fail', '放弃分享') 386 console.log('fail', '放弃分享')
387 } else if (res.errMsg === 'shareAppMessage:fail') { 387 } else if (res.errMsg === 'shareAppMessage:fail') {
388 console.log('fail', '分享失败') 388 console.log('fail', '分享失败')
389 } 389 }
390 }, 390 },
391 } 391 }
392 }, 392 },
393 // 生成海报 393 // 生成海报
394 sharePost() { 394 sharePost() {
395 const fromsid = this.$store.state.user.fromInfo.fromsid || 'undefined' 395 const fromsid = this.$store.state.user.fromInfo.fromsid || 'undefined'
396 396
397 store.dispatch('details/post', { 397 store.dispatch('details/post', {
398 pid: this.pid, 398 pid: this.pid,
399 sid: fromsid === 'undefined' ? 0 : fromsid, 399 sid: fromsid === 'undefined' ? 0 : fromsid,
400 }).then((data) => { 400 }).then((data) => {
401 uni.hideLoading() 401 uni.hideLoading()
402 this.$refs.uniPopupPost.open() 402 this.$refs.uniPopupPost.open()
403 }) 403 })
404 }, 404 },
405 // 参数选择弹窗开关 405 // 参数选择弹窗开关
406 showBottom(isCart) { 406 showBottom(isCart) {
407 this.isCart = isCart 407 this.isCart = isCart
408 this.isShowBottom = true 408 this.isShowBottom = true
409 }, 409 },
410 closeBottom() { 410 closeBottom() {
411 this.isShowBottom = false 411 this.isShowBottom = false
412 }, 412 },
413 // 前往购物车 413 // 前往购物车
414 toCart() { 414 toCart() {
415 uni.switchTab({ 415 uni.switchTab({
416 url: '/pages/cart/cart', 416 url: '/pages/cart/cart',
417 success: res => {}, 417 success: res => {},
418 fail: (error) => { console.log('跳转购物车失败======>', error) }, 418 fail: (error) => { console.log('跳转购物车失败======>', error) },
419 complete: () => { console.log('toCart') }, 419 complete: () => { console.log('toCart') },
420 }) 420 })
421 }, 421 },
422 // 加入购物车 422 // 加入购物车
423 addCart (mpId, num, checkedSKU, skId, price) { 423 addCart (mpId, num, checkedSKU, skId, price) {
424 const addCartList = {} 424 const addCartList = {}
425 addCartList.mp_id = mpId 425 addCartList.mp_id = mpId
426 addCartList.sk_id = skId 426 addCartList.sk_id = skId
427 addCartList.num = num 427 addCartList.num = num
428 addCartList.checkedSKU = checkedSKU 428 addCartList.checkedSKU = checkedSKU
429 addCartList.pid = this.pid 429 addCartList.pid = this.pid
430 addCartList.price = price 430 addCartList.price = price
431 console.log('添加购物车的参数', addCartList) 431 console.log('添加购物车的参数', addCartList)
432 store.dispatch('cart/addCart', addCartList).then((res) => { 432 store.dispatch('cart/addCart', addCartList).then((res) => {
433 if (res.code === 1) { 433 if (res.code === 1) {
434 uni.showToast({ 434 uni.showToast({
435 title: '添加成功~', 435 title: '添加成功~',
436 icon: 'success', 436 icon: 'success',
437 }) 437 })
438 } 438 }
439 // 再次请求购物车接口，实现实时更新 439 // 再次请求购物车接口，实现实时更新
440 store.dispatch('details/getCartNumber') 440 store.dispatch('details/getCartNumber')
441 }) 441 })
442 }, 442 },
443 }, 443 },
444 } 444 }
445 </script> 445 </script>
446 446
447 <style lang="scss"> 447 <style lang="scss">
448 .container { 448 .container {
449 background-color: #f8f8f8; 449 background-color: #f8f8f8;
450 font-family: "PingFangSC-Regular"; 450 font-family: "PingFangSC-Regular";
451 // 板块样式 451 // 板块样式
452 > view { 452 > view {
453 background: #ffffff; 453 background: #ffffff;
454 margin-bottom: 10px; 454 margin-bottom: 10px;
455 padding: 8px 20px 8px 20px; 455 padding: 8px 20px 8px 20px;
456 box-sizing: border-box; 456 box-sizing: border-box;
457 } 457 }
458 // 基础信息板块 458 // 基础信息板块
459 .basic_info { 459 .basic_info {
460 // 轮播图 460 // 轮播图
461 .swiperImage { 461 .swiperImage {
462 width: 684rpx; 462 width: 684rpx;
463 height: 480rpx; 463 height: 480rpx;
464 image { 464 image {
465 max-width: 100%; 465 max-width: 100%;
466 max-height: 100%; 466 max-height: 100%;
467 border-radius: 16rpx; 467 border-radius: 16rpx;
468 } 468 }
469 } 469 }
470 // 产品价格及购买人数 470 // 产品价格及购买人数
471 .info_pay { 471 .info_pay {
472 color: #eb5d3b; 472 color: #eb5d3b;
473 font-size: 18px; 473 font-size: 18px;
474 margin-top: 5px; 474 margin-top: 5px;
475 font-family: "PingFangSC-Semibold"; 475 font-family: "PingFangSC-Semibold";
476 display: flex; 476 display: flex;
477 justify-content: space-between; 477 justify-content: space-between;
478 .info_pay_discount { 478 .info_pay_discount {
479 text-decoration: line-through; 479 text-decoration: line-through;
480 margin-left: 8rpx; 480 margin-left: 8rpx;
481 color: #999; 481 color: #999;
482 font-size: 14px; 482 font-size: 14px;
483 } 483 }
484 .info_pay_number { 484 .info_pay_number {
485 color: #999; 485 color: #999;
486 font-size: 14px; 486 font-size: 14px;
487 font-family: PingFangSC-Regular; 487 font-family: PingFangSC-Regular;
488 } 488 }
489 } 489 }
490 // 产品名称 490 // 产品名称
491 .info_name { 491 .info_name {
492 margin-top: 5px; 492 margin-top: 5px;
493 display: flex; 493 display: flex;
494 justify-content: space-between; 494 justify-content: space-between;
495 .info_name_name { 495 .info_name_name {
496 margin-right: 10px; 496 margin-right: 10px;
497 font-size: 16px; 497 font-size: 16px;
498 font-family: "PingFangSC-Semibold"; 498 font-family: "PingFangSC-Semibold";
499 max-width: 592rpx; 499 max-width: 592rpx;
500 } 500 }
501 .info_name_share { 501 .info_name_share {
502 display: flex; 502 display: flex;
503 flex-direction: column; 503 flex-direction: column;
504 justify-content: space-between; 504 justify-content: space-between;
505 align-items: center; 505 align-items: center;
506 margin-top: 14rpx; 506 margin-top: 14rpx;
507 > image { 507 > image {
508 height: 40rpx; 508 height: 40rpx;
509 width: 40rpx; 509 width: 40rpx;
510 } 510 }
511 > text { 511 > text {
512 font-family: PingFangSC-Regular; 512 font-family: PingFangSC-Regular;
513 font-size: 12px; 513 font-size: 12px;
514 color: #999; 514 color: #999;
515 letter-spacing: -0.23px; 515 letter-spacing: -0.23px;
516 } 516 }
517 } 517 }
518 } 518 }
519 // 售后服务 519 // 售后服务
520 .info_after { 520 .info_after {
521 font-size: 10px; 521 font-size: 10px;
522 color: #999; 522 color: #999;
523 margin-top: 20rpx; 523 margin-top: 20rpx;
524 > span { 524 > span {
525 height: 14px; 525 height: 14px;
526 margin-right: 10px; 526 margin-right: 10px;
527 } 527 }
528 } 528 }
529 } 529 }
530 // 详细信息 530 // 详细信息
531 .detail_info { 531 .detail_info {
532 margin-bottom: 20rpx; 532 margin-bottom: 20rpx;
533 .screen_bar { 533 .screen_bar {
534 width: 670rpx; 534 width: 670rpx;
535 margin-top: 20rpx; 535 margin-top: 20rpx;
536 margin-bottom: 24rpx; 536 margin-bottom: 24rpx;
537 display: flex; 537 display: flex;
538 flex-direction: row; 538 flex-direction: row;
539 justify-content: space-between; 539 justify-content: space-between;
540 align-items: center; 540 align-items: center;
541 font-size: 14px; 541 font-size: 14px;
542 color: #333333; 542 color: #333333;
543 transition: all 0.2s; 543 transition: all 0.2s;
544 } 544 }
545 .item_active { 545 .item_active {
546 border-bottom: 4rpx solid #ff6b4a; 546 border-bottom: 4rpx solid #ff6b4a;
547 } 547 }
548 .screen_item { 548 .screen_item {
549 font-size: 32rpx; 549 font-size: 32rpx;
550 color: #333333; 550 color: #333333;
551 display: flex; 551 display: flex;
552 transition: all 0.2s; 552 transition: all 0.2s;
553 // 规格参数 553 // 规格参数
554 .specification { 554 .specification {
555 margin-bottom: 4px; 555 margin-bottom: 4px;
556 .spe_item { 556 .spe_item {
557 image { 557 image {
558 width: 50px; 558 width: 50px;
559 height: 25px; 559 height: 25px;
560 margin-right: 6px; 560 margin-right: 6px;
561 vertical-align: middle; 561 vertical-align: middle;
562 } 562 }
563 span { 563 span {
564 margin-left: 24rpx; 564 margin-left: 24rpx;
565 } 565 }
566 } 566 }
567 } 567 }
568 } 568 }
569 // 569 //
570 } 570 }
571 // 宝贝好评率 571 // 宝贝好评率
572 .evaluate { 572 .evaluate {
573 .evaluate_title { 573 .evaluate_title {
574 font-size: 14px; 574 font-size: 14px;
575 color: #333333; 575 color: #333333;
576 display: flex; 576 display: flex;
577 justify-content: space-between; 577 justify-content: space-between;
578 .title_rate { 578 .title_rate {
579 margin-left: 10rpx; 579 margin-left: 10rpx;
580 } 580 }
581 .evaluate_star { 581 .evaluate_star {
582 width: 90px; 582 width: 90px;
583 display: flex; 583 display: flex;
584 align-items: center; 584 align-items: center;
585 justify-content: space-between; 585 justify-content: space-between;
586 } 586 }
587 view { 587 view {
588 font-size: 14px; 588 font-size: 14px;
589 color: #333333; 589 color: #333333;
590 font-weight: bold; 590 font-weight: bold;
591 } 591 }
592 } 592 }
593 .evaluate_tag { 593 .evaluate_tag {
594 view { 594 view {
595 display: inline-block; 595 display: inline-block;
596 margin-right: 20rpx; 596 margin-right: 20rpx;
597 min-width: 180rpx; 597 min-width: 180rpx;
598 margin-top: 10px; 598 margin-top: 10px;
599 height: 48rpx; 599 height: 48rpx;
600 background: #f2f2f2; 600 background: #f2f2f2;
601 border-radius: 2px; 601 border-radius: 2px;
602 font-family: PingFangSC-Regular; 602 font-family: PingFangSC-Regular;
603 font-size: 12px; 603 font-size: 12px;
604 color: #666666; 604 color: #666666;
605 letter-spacing: -0.23px; 605 letter-spacing: -0.23px;
606 text-align: center; 606 text-align: center;
607 padding: 0 48rpx; 607 padding: 0 48rpx;
608 line-height: 48rpx; 608 line-height: 48rpx;
609 } 609 }
610 } 610 }
611 } 611 }
612 // 商品详情 612 // 商品详情
613 .more_info { 613 .more_info {
614 .more_fixed1 { 614 .more_fixed1 {
615 display: flex; 615 display: flex;
616 justify-content: space-between; 616 justify-content: space-between;
617 align-content: center; 617 align-content: center;
618 margin-bottom: 12px; 618 margin-bottom: 12px;
619 view { 619 view {
620 font-size: 14px; 620 font-size: 14px;
621 color: #333333; 621 color: #333333;
622 font-weight: bold; 622 font-weight: bold;
623 font-family: "PingFangSC-Medium"; 623 font-family: "PingFangSC-Medium";
624 line-height: 24px; 624 line-height: 24px;
625 } 625 }
626 image { 626 image {
627 width: 240rpx; 627 width: 240rpx;
628 height: 3px; 628 height: 3px;
629 margin-top: 10px; 629 margin-top: 10px;
630 } 630 }
631 } 631 }
632 .more_all { 632 .more_all {
633 width: 100%; 633 width: 100%;
634 margin-top: 30rpx; 634 margin-top: 30rpx;
635 margin-right: 30rpx; 635 margin-right: 30rpx;
636 margin-bottom: 180rpx; 636 margin-bottom: 180rpx;
637 font-family: "PingFangSC-Regular"; 637 font-family: "PingFangSC-Regular";
638 } 638 }
639 } 639 }
640 // 菜单 640 // 菜单
641 .menu { 641 .menu {
642 position: fixed; 642 position: fixed;
643 bottom: 0; 643 bottom: 0;
644 height: 74px; 644 min-height: 74px;
645 width: 100%; 645 width: 100%;
646 background: #ffffff; 646 background: #ffffff;
647 padding: 20px 20px 8px 20px; 647 padding: 20px 20px 8px 20px;
648 font-family: "PingFangSC-Regular"; 648 font-family: "PingFangSC-Regular";
649 box-sizing: border-box; 649 box-sizing: border-box;
650 display: flex; 650 display: flex;
651 justify-content: space-between; 651 justify-content: space-between;
652 align-content: center; 652 align-content: center;
653 margin: 0; 653 margin: 0;
654 /* iphonex 等安全区设置，底部安全区适配 */ 654 /* iphonex 等安全区设置，底部安全区适配 */
655 /* #ifndef APP-NVUE */ 655 /* #ifndef APP-NVUE */
656 padding-bottom: constant(safe-area-inset-bottom); 656 padding-bottom: constant(safe-area-inset-bottom);
657 padding-bottom: env(safe-area-inset-bottom); 657 padding-bottom: env(safe-area-inset-bottom);
658 .menu_1 { 658 .menu_1 {
659 width: 20%; 659 width: 20%;
660 height: 100%; 660 height: 100%;
661 text-align: center; 661 text-align: center;
662 color: #989898; 662 color: #989898;
663 .cart_icon { 663 .cart_icon {
664 position: relative; 664 position: relative;
665 text { 665 text {
666 position: absolute; 666 position: absolute;
667 color: white; 667 color: white;
668 font-size: 17px; 668 font-size: 17px;
669 background-color: red; 669 background-color: red;
670 min-height: 24px; 670 min-height: 24px;
671 min-width: 24px; 671 min-width: 24px;
672 line-height: 24px; 672 line-height: 24px;
673 right: -12%; 673 right: -12%;
674 top: -12px; 674 top: -12px;
675 text-align: center; 675 text-align: center;
676 border-radius: 24px; 676 border-radius: 24px;
677 padding: 2px; 677 padding: 2px;
678 } 678 }
679 } 679 }
680 } 680 }
681 image { 681 image {
682 width: 42%; 682 width: 42%;
683 height: 26px; 683 height: 26px;
684 } 684 }
685 .menu_image { 685 .menu_image {
686 font-size: 12px; 686 font-size: 12px;
687 text-align: center; 687 text-align: center;
688 } 688 }
689 .menu_2 { 689 .menu_2 {
690 width: 74%; 690 width: 74%;
691 height: 86%; 691 height: 80rpx;
692 display: grid; 692 display: grid;
693 grid-template-columns: 50% 50%; 693 grid-template-columns: 50% 50%;
694 } 694 }
695 .menu_input { 695 .menu_input {
696 display: inline-flex; 696 display: inline-flex;
697 align-items: center; 697 align-items: center;
698 justify-content: space-around; 698 justify-content: space-around;
699 background: #fff0ec; 699 background: #fff0ec;
700 font-size: 16px; 700 font-size: 16px;
701 color: #ff6b4a; 701 color: #ff6b4a;
702 border-radius: 20px 0 0 20px; 702 border-radius: 20px 0 0 20px;
703 } 703 }
704 .menu_now { 704 .menu_now {
705 display: inline-flex; 705 display: inline-flex;
706 align-items: center; 706 align-items: center;
707 justify-content: space-around; 707 justify-content: space-around;
708 background: #ff6b4a; 708 background: #ff6b4a;
709 font-size: 16px; 709 font-size: 16px;
710 color: #ffffff; 710 color: #ffffff;
711 border-radius: 0 20px 20px 0; 711 border-radius: 0 20px 20px 0;
712 } 712 }
713 } 713 }
714 } 714 }
715 </style> 715 </style>
716 716
src/pages/index/index.vue
Diff comments   View file @c00dd28
1 <template> 1 <template>
2 <view class="container"> 2 <view class="container">
3 <view class="content skeleton" v-show="showContent"> 3 <view
4 <view class="header"> 4 class="content skeleton"
5 <!-- 搜索--> 5 v-show="showContent"
6 <view class="searchBar skeleton-rect"> 6 >
7 <icon 7 <view class="header">
8 class="searchIcon" 8 <!-- 搜索-->
9 type="search" 9 <view class="searchBar skeleton-rect">
10 size="14" 10 <icon
11 ></icon> 11 class="searchIcon"
12 <input 12 type="search"
13 v-model="searchText" 13 size="14"
14 class="searchIpt" 14 ></icon>
15 placeholder="老花镜" 15 <input
16 confirm-type="search" 16 v-model="searchText"
17 @blur="searchKey" 17 class="searchIpt"
18 /> 18 placeholder="老花镜"
19 </view> 19 confirm-type="search"
20 @blur="searchKey"
21 />
22 </view>
20 23
21 <!-- 筛选栏--> 24 <!-- 筛选栏-->
22 <!-- <view class="screenBar"> 25 <!-- <view class="screenBar">
23 <view 26 <view
24 v-for="item in screenItems" 27 v-for="item in screenItems"
25 :key="item.current" 28 :key="item.current"
26 @click="onClickItem(item.current)" 29 @click="onClickItem(item.current)"
27 > 30 >
28 <view 31 <view
29 class="screenItem" 32 class="screenItem"
30 v-bind:class="{ active: current === item.current }" 33 v-bind:class="{ active: current === item.current }"
31 v-if="item.current === 2" 34 v-if="item.current === 2"
32 @click="dropDown" 35 @click="dropDown"
33 > 36 >
34 {{ item.text }} 37 {{ item.text }}
35 <icon 38 <icon
36 type="info" 39 type="info"
37 size="14" 40 size="14"
38 ></icon> 41 ></icon>
39 </view> 42 </view>
40 <view 43 <view
41 class="screenItem" 44 class="screenItem"
42 v-bind:class="{ active: current === item.current }" 45 v-bind:class="{ active: current === item.current }"
43 v-if="item.current === 4" 46 v-if="item.current === 4"
44 @click="showDrawer('showRight')" 47 @click="showDrawer('showRight')"
45 > 48 >
46 {{ item.text }} 49 {{ item.text }}
47 <icon 50 <icon
48 type="info" 51 type="info"
49 size="14" 52 size="14"
50 ></icon> 53 ></icon>
51 </view> 54 </view>
52 <view v-if="item.current !== 2&&item.current!==4"> 55 <view v-if="item.current !== 2&&item.current!==4">
53 <view 56 <view
54 class="screenItem" 57 class="screenItem"
55 v-bind:class="{ active: current === item.current }" 58 v-bind:class="{ active: current === item.current }"
56 >{{ item.text }}</view> 59 >{{ item.text }}</view>
57 </view> 60 </view>
58 </view> 61 </view>
59 </view> --> 62 </view> -->
60 </view>
61 <Uni-drawer
62 ref="showRight"
63 mask="true"
64 maskClick="true"
65 mode="right"
66 :width="320"
67 @change="change($event,'showRight')"
68 >
69 <view class="close">
70 <view @click="closeDrawer('showRight')">
71 <text class="word-btn-white">关闭</text>
72 </view>
73 </view> 63 </view>
74 </Uni-drawer> 64 <Uni-drawer
65 ref="showRight"
66 mask="true"
67 maskClick="true"
68 mode="right"
69 :width="320"
70 @change="change($event,'showRight')"
71 >
72 <view class="close">
73 <view @click="closeDrawer('showRight')">
74 <text class="word-btn-white">关闭</text>
75 </view>
76 </view>
77 </Uni-drawer>
75 78
76 <!-- 筛选菜单--> 79 <!-- 筛选菜单-->
77 <view class="content-wrap skeleton-rect"> 80 <view class="content-wrap skeleton-rect">
78 <view> 81 <view>
79 <HMfilterDropdown 82 <HMfilterDropdown
80 :filterData="categoryList" 83 :filterData="categoryList"
81 :defaultSelected="filterDropdownValue" 84 :defaultSelected="filterDropdownValue"
82 :updateMenuName="true" 85 :updateMenuName="true"
83 @search="search" 86 @search="search"
84 @getList="getList" 87 @getList="getList"
85 data-format="Object" 88 data-format="Object"
86 ></HMfilterDropdown> 89 ></HMfilterDropdown>
87 <!-- 商品列表 --> 90 <!-- 商品列表 -->
88 <!-- <scroll-view 91 <!-- <scroll-view
89 enable-flex 92 enable-flex
90 @scrolltolower="handleScrolltolower" 93 @scrolltolower="handleScrolltolower"
91 scroll-y 94 scroll-y
92 style="height: 1000px;margin-bottom: 20px;" 95 style="height: 1000px;margin-bottom: 20px;"
93 > --> 96 > -->
94 <view class="goods-list"> 97 <view class="goods-list">
95 <view class="product-list"> 98 <view class="product-list">
96 <view 99 <view
97 class="product skeleton-rect" 100 class="product skeleton-rect"
98 v-for="(goods) in goodsList" 101 v-for="(goods) in goodsList"
99 :key="goods.id" 102 :key="goods.id"
100 > 103 >
101 <Card 104 <Card
102 :goods="goods" 105 :goods="goods"
103 :scrollTop="scrollTop" 106 :scrollTop="scrollTop"
104 :viewHeight="viewHeight" 107 :viewHeight="viewHeight"
105 ></Card> 108 ></Card>
109 </view>
110 </view>
111 <view class="loading-text">
112 <text v-if="isLoading==true">{{loadingText}}</text>
113 <text v-else>{{loadedText}}</text>
106 </view> 114 </view>
107 </view> 115 </view>
108 <view class="loading-text"> 116 <!-- </scroll-view> -->
109 <text v-if="isLoading==true">{{loadingText}}</text>
110 <text v-else>{{loadedText}}</text>
111 </view>
112 </view> 117 </view>
113 <!-- </scroll-view> -->
114 </view> 118 </view>
115 </view> 119 </view>
116 </view> 120 <!--引用组件-->
117 <!--引用组件--> 121 <skeleton
118 <skeleton :show="showSkeleton" ref="skeleton" loading="chiaroscuro" selector="skeleton" bgcolor="#FFF"></skeleton> 122 :show="showSkeleton"
119 </view> 123 ref="skeleton"
124 loading="chiaroscuro"
125 selector="skeleton"
126 bgcolor="#FFF"
127 ></skeleton>
128 </view>
120 </template> 129 </template>
121 130
122 <script> 131 <script>
123 import UniDrawer from "@/components/UniDrawer/UniDrawer.vue"; 132 import UniDrawer from '@/components/UniDrawer/UniDrawer.vue'
124 import Card from "@/components/CommodityCard/CommodityCard.vue"; 133 import Card from '@/components/CommodityCard/CommodityCard.vue'
125 import HMfilterDropdown from "@/components/HMFilterDropdown/HMFilterDropdown.vue"; 134 import HMfilterDropdown from '@/components/HMFilterDropdown/HMFilterDropdown.vue'
126 import skeleton from "@/components/quick-skeleton/quick-skeleton.vue"; 135 import skeleton from '@/components/quick-skeleton/quick-skeleton.vue'
127 import store from "@/store"; 136 import store from '@/store'
128
129 137
130 export default { 138 export default {
131 components: { 139 components: {
132 UniDrawer: UniDrawer, 140 UniDrawer: UniDrawer,
133 HMfilterDropdown: HMfilterDropdown, 141 HMfilterDropdown: HMfilterDropdown,
134 Card: Card, 142 Card: Card,
135 skeleton: skeleton 143 skeleton: skeleton,
136 }, 144 },
137 data() { 145 data() {
138 return { 146 return {
139 indexArr: "", 147 indexArr: '',
140 valueArr: "", 148 valueArr: '',
141 isLoading: true, //初始化加载状态 149 isLoading: true, // 初始化加载状态
142 loadingText: "data loading...", 150 loadingText: 'data loading...',
143 loadedText: "~~暂无更多数据~~", 151 loadedText: '~~暂无更多数据~~',
144 filterDropdownValue: [], 152 filterDropdownValue: [],
145 filterData: [], 153 filterData: [],
146 searchText: "", 154 searchText: '',
147 scrollTop: 0, 155 scrollTop: 0,
148 showContent: true, 156 showContent: true,
149 viewHeight: uni.getSystemInfoSync().windowHeight, 157 viewHeight: uni.getSystemInfoSync().windowHeight,
150 showSkeleton: false //骨架屏显示隐藏 158 showSkeleton: false, // 骨架屏显示隐藏
151 }; 159 }
152 }, 160 },
153 onPageScroll({ scrollTop }) { 161 onPageScroll({ scrollTop }) {
154 // 传入scrollTop值并触发所有easy-loadimage组件下的滚动监听事件 162 // 传入scrollTop值并触发所有easy-loadimage组件下的滚动监听事件
155 this.scrollTop = scrollTop; 163 this.scrollTop = scrollTop
156 }, 164 },
157 computed: { 165 computed: {
158 goodsList() { 166 goodsList() {
159 // 也可以从 getters 获取 167 // 也可以从 getters 获取
160 // console.log('index-list=====>',this.$store.state.index.list) 168 // console.log('index-list=====>',this.$store.state.index.list)
161 let list = this.$store.state.index.list; 169 const list = this.$store.state.index.list
162 if(list.length == 0){ 170 if (list.length == 0) {
163 this.isLoading = false; 171 this.isLoading = false
164 } 172 }
165 this.scrollTop = 0.1; 173 this.scrollTop = 0.1
166 return list 174 return list
167 }, 175 },
168 categoryList() { 176 categoryList() {
169 return this.$store.state.index.categoryList; 177 return this.$store.state.index.categoryList
170 } 178 },
171 }, 179 },
172 filters: { 180 filters: {
173 outData(value) { 181 outData(value) {
174 return JSON.stringify(value); 182 return JSON.stringify(value)
175 } 183 },
176 }, 184 },
177 /** 185 /**
178 * 页面载入完成后调用子组件的方法生成预加载效果 186 * 页面载入完成后调用子组件的方法生成预加载效果
179 */ 187 */
180 onReady:function(){ 188 onReady: function() {
181 this.getInitData() 189 this.getInitData()
182 }, 190 },
183 methods: { 191 methods: {
184 async getInitData (){ 192 async getInitData () {
185 this.showSkeleton = true; 193 this.showSkeleton = true
186 await Promise.all([store.dispatch("index/category"), store.dispatch("index/list")]) 194 await Promise.all([store.dispatch('index/category'), store.dispatch('index/list')])
187 this.showSkeleton = false; 195 this.showSkeleton = false
188 this.showContent = true 196 this.showContent = true
189 }, 197 },
190 showDrawer(e) { 198 showDrawer(e) {
191 this.$refs[e].open(); 199 this.$refs[e].open()
192 }, 200 },
193 getList() { 201 getList() {
194 store.dispatch("index/list"); 202 store.dispatch('index/list')
195 this.isLoading = false; //TODO:::这里不知道怎么改，请同学帮忙写一下。 203 this.isLoading = false // TODO:::这里不知道怎么改，请同学帮忙写一下。
196 //把data里的isLoading 改为false就可以了 204 // 把data里的isLoading 改为false就可以了
197 }, 205 },
198 // search(params) { 206 // search(params) {
199 // this.$store.index. 207 // this.$store.index.
200 // }, 208 // },
201 closeDrawer(e) { 209 closeDrawer(e) {
202 this.$refs[e].close(); 210 this.$refs[e].close()
203 }, 211 },
204 change(e, type) { 212 change(e, type) {
205 this[type] = e; 213 this[type] = e
206 }, 214 },
207 onClickItem(e) { 215 onClickItem(e) {
208 if (this.current !== e) { 216 if (this.current !== e) {
209 this.current = e; 217 this.current = e
210 } 218 }
211 }, 219 },
212 dropDown() { 220 dropDown() {
213 console.log("下拉"); 221 console.log('下拉')
214 }, 222 },
215 searchKey(e) { 223 searchKey(e) {
216 const { value: keyword } = e.detail; 224 const { value: keyword } = e.detail
217 this.keyWords = keyword; 225 this.keyWords = keyword
218 store.dispatch("index/search", { 226 store.dispatch('index/search', {
219 params: {}, 227 params: {},
220 keyword 228 keyword,
221 }); 229 })
222 }, 230 },
223 // 接收菜单结果 231 // 接收菜单结果
224 search(e) { 232 search(e) {
225 const { on, value, selectedData } = e; 233 const { on, value, selectedData } = e
226 let params = {}; 234 let params = {}
227 const selectedPayload = {}; 235 const selectedPayload = {}
228 for (const key in selectedData) { 236 for (const key in selectedData) {
229 if (Object.prototype.hasOwnProperty.call(selectedData, key)) { 237 if (Object.prototype.hasOwnProperty.call(selectedData, key)) {
230 selectedPayload[key] = selectedData[key].toString(); 238 selectedPayload[key] = selectedData[key].toString()
231 } 239 }
232 } 240 }
233 if (on[0] === 1) { 241 if (on[0] === 1) {
234 // 若点击全部 242 // 若点击全部
235 this.searchText = ""; 243 this.searchText = ''
236 store.dispatch("index/list"); 244 store.dispatch('index/list')
237 } else { 245 } else {
238 for (let i = 1; i <= on.length; i++) { 246 for (let i = 1; i <= on.length; i++) {
239 // on[0]是全部 247 // on[0]是全部
240 if (on[i] === 1) { 248 if (on[i] === 1) {
241 // 若该选项被选中 249 // 若该选项被选中
242 if (this.categoryList[i].value === "filter") { 250 if (this.categoryList[i].value === 'filter') {
243 params = { 251 params = {
244 ...selectedPayload, 252 ...selectedPayload,
245 ...params 253 ...params,
246 }; 254 }
255 } else if (this.categoryList[i].value === 'px') {
256 params.orderby = value[i][0]
247 } else { 257 } else {
248 params[`${this.categoryList[i].value}`] = value[i][0]; 258 params[`${this.categoryList[i].value}`] = value[i][0]
249 } 259 }
250 } 260 }
251 } 261 }
252 store.dispatch("index/search", { 262 store.dispatch('index/search', {
253 params, 263 params,
254 keyword: this.keyWords 264 keyword: this.keyWords,
255 }); 265 })
256 } 266 }
257 } 267 },
258 } 268 },
259 }; 269 }
260 </script> 270 </script>
261 271
262 <style lang="scss"> 272 <style lang="scss">
263 .content,.container { 273 .content,
274 .container {
264 display: flex; 275 display: flex;
265 flex-direction: column; 276 flex-direction: column;
266 align-items: center; 277 align-items: center;
267 justify-content: center; 278 justify-content: center;
268 width: 100%; 279 width: 100%;
269 } 280 }
270 .header { 281 .header {
271 display: flex; 282 display: flex;
272 flex-direction: column; 283 flex-direction: column;
273 align-items: center; 284 align-items: center;
274 justify-content: center; 285 justify-content: center;
275 background-color: #f7f6f6; 286 background-color: #f7f6f6;
276 height: 178rpx; 287 height: 178rpx;
277 width: 100%; 288 width: 100%;
278 z-index: 999; 289 z-index: 999;
279 position: fixed; 290 position: fixed;
280 top: 0; 291 top: 0;
281 left: 0; 292 left: 0;
282 } 293 }
283 .searchBar { 294 .searchBar {
284 width: 670rpx; 295 width: 670rpx;
285 display: flex; 296 display: flex;
286 justify-content: center; 297 justify-content: center;
287 align-items: center; 298 align-items: center;
288 box-sizing: border-box; 299 box-sizing: border-box;
289 padding: 0rpx 16rpx; 300 padding: 0rpx 16rpx;
290 border: 1px solid #ff6b4a; 301 border: 1px solid #ff6b4a;
291 border-radius: 8rpx; 302 border-radius: 8rpx;
292 background-color: #ffffff; 303 background-color: #ffffff;
293 } 304 }
294 305
295 .searchIpt { 306 .searchIpt {
296 height: 68rpx; 307 height: 68rpx;
297 width: 670rpx; 308 width: 670rpx;
298 padding: 16rpx; 309 padding: 16rpx;
299 font-size: 28rpx; 310 font-size: 28rpx;
300 box-sizing: border-box; 311 box-sizing: border-box;
301 } 312 }
302 .screenBar { 313 .screenBar {
303 width: 670rpx; 314 width: 670rpx;
304 height: 110rpx; 315 height: 110rpx;
305 display: flex; 316 display: flex;
306 flex-direction: row; 317 flex-direction: row;
307 justify-content: space-between; 318 justify-content: space-between;
308 align-items: center; 319 align-items: center;
309 color: #333333; 320 color: #333333;
310 font-size: 32rpx; 321 font-size: 32rpx;
311 } 322 }
312 .active { 323 .active {
313 color: #ff6b4a; 324 color: #ff6b4a;
314 } 325 }
315 .screenItem { 326 .screenItem {
316 display: flex; 327 display: flex;
317 justify-content: center; 328 justify-content: center;
318 align-items: center; 329 align-items: center;
319 } 330 }
320 .content-wrap { 331 .content-wrap {
321 width: 100%; 332 width: 100%;
322 background-color: #ffffff; 333 background-color: #ffffff;
323 } 334 }
324 335
325 .HMfilterDropdown { 336 .HMfilterDropdown {
326 top: 178rpx !important; 337 top: 178rpx !important;
327 } 338 }
328 339
329 .goods-list { 340 .goods-list {
330 padding-top: 286rpx; 341 padding-top: 286rpx;
331 .loading-text { 342 .loading-text {
332 width: 100%; 343 width: 100%;
333 display: flex; 344 display: flex;
334 justify-content: center; 345 justify-content: center;
335 align-items: center; 346 align-items: center;
336 height: 30px; 347 height: 30px;
337 color: #979797; 348 color: #979797;
338 font-size: 12px; 349 font-size: 12px;
src/static/img/detail/d11.png
View file @e79b721

52.9 KB
src/static/img/detail/d12.png
View file @e79b721

42.1 KB
src/static/img/detail/d13.png
View file @e79b721

46.4 KB
src/static/img/detail/d8.png
View file @e79b721

252 KB
src/static/img/detail/delivery.png
View file @e79b721

55.5 KB
src/static/img/detail/sun_glass.png
View file @e79b721

25.2 KB
src/vue.config.js
Diff comments   View file @c00dd28
1 // const webpackApiMocker = require('mocker-api') 1 // const webpackApiMocker = require('mocker-api')
2 2
3 // module.exports = { 3 // module.exports = {
4 // devServer: { 4 // devServer: {
5 // before(app) { 5 // before(app) {
6 // webpackApiMocker(app, path.resolve('./mock/index.js')) 6 // webpackApiMocker(app, path.resolve('./mock/index.js'))
7 // }, 7 // },
8 // proxy: { 8 // proxy: {
9 // '/app/prod/list': { 9 // '/app/prod/list': {
10 // target: 'https://api.glass.xiuyetang.com/', 10 // target: 'https://api.glass.xiuyetang.com/',
11 // pathRewrite: { 11 // pathRewrite: {
12 // '^/app': '' 12 // '^/app': ''
13 // } 13 // }
14 // } 14 // }
15 // }, 15 // },
16 // } 16 // }
17 // }
17 // }
18
19 module.exports = {
20 chainWebpack: (config) => {
21 // 发行或运行时启用了压缩时会生效
22 config.optimization.minimizer('terser').tap((args) => {
23 const compress = args[0].terserOptions.compress
24 // 非 App 平台移除 console 代码(包含所有 console 方法，如 log,debug,info...)
25 compress.drop_console = true
26 compress.pure_funcs = [
27 '__f__', // App 平台 vue 移除日志代码
28 // 'console.debug' // 可移除指定的 console 方法
29 ]
30 return args
31 })
32 },
33 }