刘文博 / gulu-vue

Download as
Browse Code »

Commit c4494f932d6cd5a7e5ef737696b305053751d43a

Authored by BigBoss
2 parents fed83ad116 d6200736ba
Exists in master

修改冲突

Showing 13 changed files   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 },
251 { 272 {
252 "name": "我的", 273 "name": "我的",
253 "path": "pages/user/user", 274 "path": "pages/user/user",
254 "query": "" 275 "query": ""
255 }, 276 },
256 277
257 { 278 {
258 "name": "验光数据", 279 "name": "验光数据",
259 "path": "pages/addOpticsData/addOpticsData", 280 "path": "pages/addOpticsData/addOpticsData",
260 "query": "" 281 "query": ""
261 }, 282 },
262 283
src/pages/cart/cart.vue
Diff comments   View file @c4494f9
1 <template> 1 <template>
2 <view class="content"> 2 <view class="content">
3 <block v-if="cartList.length==0"> 3 <block v-if="cartList.length==0">
4 4
5 </block> 5 </block>
6 <block v-else> 6 <block v-else>
7 <view class="card"> 7 <view class="card">
8 <view class="cardHeader"> 8 <view class="cardHeader">
9 <view 9 <view
10 v-bind:class="pIsoPen? 'partentChecked' : 'partentCheck'" 10 v-bind:class="pIsoPen? 'partentChecked' : 'partentCheck'"
11 @click="pClick" 11 @click="pClick"
12 > 12 >
13 <span class="correct"></span> 13 <span class="correct"></span>
14 </view> 14 </view>
15 <image 15 <image
16 src="../../static/store.png" 16 src="../../static/store.png"
17 mode="aspectFill" 17 mode="aspectFill"
18 ></image> 18 ></image>
19 <text>非常戴镜</text> 19 <text>非常戴镜</text>
20 </view> 20 </view>
21 <view 21 <view
22 class="cardBody" 22 class="cardBody"
23 v-for="(item,index) in cartList" 23 v-for="(item,index) in cartList"
24 :key="index" 24 :key="index"
25 @longpress="delCart(item.cart_id,index)" 25 @longpress="delCart(item.cart_id,index)"
26 > 26 >
27 <view 27 <view
28 v-bind:class="cartList[index].isChecked? 'partentChecked':'partentCheck'" 28 v-bind:class="cartList[index].isChecked? 'partentChecked':'partentCheck'"
29 @click="childClick(cartList[index],index)" 29 @click="childClick(cartList[index],index)"
30 > 30 >
31 <span class="correct"></span> 31 <span class="correct"></span>
32 </view> 32 </view>
33 <view class="imageWrap"> 33 <view class="imageWrap">
34 <image 34 <image
35 :src="item.img_index_url" 35 :src="item.img_index_url"
36 mode="aspectFit" 36 mode="aspectFit"
37 style="width: 188rpx;height: 168rpx;" 37 style="width: 188rpx;height: 168rpx;"
38 ></image> 38 ></image>
39 </view> 39 </view>
40 <view class="goodInfo"> 40 <view class="goodInfo">
41 <!-- <view class="imageWrap"> 41 <!-- <view class="imageWrap">
42 <image :src="item.img_index_url" mode="aspectFit" style="width: 188rpx;height: 168rpx;"></image> 42 <image :src="item.img_index_url" mode="aspectFit" style="width: 188rpx;height: 168rpx;"></image>
43 </view> --> 43 </view> -->
44 <view class="infoRight"> 44 <view class="infoRight">
45 <view 45 <view
46 class="goodName" 46 class="goodName"
47 @tap="toGoods(item.pid,item.sk_id)" 47 @tap="toGoods(item.pid,item.sk_id)"
48 >{{item.p_name}}</view> 48 >{{item.p_name}}</view>
49 <view class="describ" @click="showBottom(3,item.pid,item.sk_id,item.mp_id,item.cart_id,index)"> 49 <view
50 <view class="desL"> 50 class="describ"
51 <view class="people"> 51 @click="showBottom(3,item.pid,item.sk_id,item.mp_id,item.cart_id,index)"
52 使用人：{{item.peopleName}} 52 >
53 </view> 53 <view class="desL">
54 <view class="skuInfo"> 54 <view class="people">
55 {{item.sku_name}} 55 使用人：{{item.peopleName}}
56 </view> 56 </view>
57 </view> 57 <view class="skuInfo">
58 <view class="desR"> 58 {{item.sku_name}}
59 <image src="../../static/right.png" mode="aspectFit" style="width: 18rpx;height: 18rpx;"></image> 59 </view>
60 </view> 60 </view>
61 <view class="desR">
62 <image
63 src="../../static/right.png"
64 mode="aspectFit"
65 style="width: 18rpx;height: 18rpx;"
66 ></image>
67 </view>
61 </view> 68 </view>
62 <view class="priceBox"> 69 <view class="priceBox">
63 <view class="price">￥{{item.nowPrice*item.num}}</view> 70 <view class="price">￥{{item.nowPrice*item.num}}</view>
64 <text class="maxCount">(限购{{maxCount}}副)</text> 71 <text class="maxCount">(限购{{maxCount}}副)</text>
65 <view class="counter"> 72 <view class="counter">
66 <view 73 <view
67 class="btn" 74 class="btn"
68 disabled="this.addDisabled" 75 disabled="this.addDisabled"
69 type="default" 76 type="default"
70 @tap="counter(index,false,item)" 77 @tap="counter(index,false,item)"
71 >-</view> 78 >-</view>
72 <text>{{item.num}}</text> 79 <text>{{item.num}}</text>
73 <view 80 <view
74 class="btn" 81 class="btn"
75 disabled="this.desDisabled" 82 disabled="this.desDisabled"
76 type="default" 83 type="default"
77 @tap="counter(index,true,item)" 84 @tap="counter(index,true,item)"
78 >+</view> 85 >+</view>
79 </view> 86 </view>
80 </view> 87 </view>
81 </view> 88 </view>
82 </view> 89 </view>
83 </view> 90 </view>
84 </view> 91 </view>
85 </block> 92 </block>
86 <view class="footer"> 93 <view class="footer">
87 <view class="footerLeft">实付金额:<text>￥{{totalPrice}}</text></view> 94 <view class="footerLeft">实付金额:<text>￥{{totalPrice}}</text></view>
88 <view class="footerRight"> 95 <view class="footerRight">
89 <view class="paybtn" @click="toComfirmOrder">立即结算</view> 96 <view
97 class="paybtn"
98 @click="toComfirmOrder"
99 >立即结算</view>
90 </view> 100 </view>
91 </view> 101 </view>
92 <BottomSheet v-if="isShowBottom" :isCart="isCart" @addCart="addCart" :sk_id="sk_id" :propMpId="mp_id" @chooseCartModi="chooseCartModi" :cart_id="cart_id" 102 <BottomSheet
93 :index="cartIndex" 103 v-if="isShowBottom"
94 :pid="pid" :goodInfo="goodInfo" :isShowBottom="isShowBottom" @closeBottom="closeBottom"></BottomSheet> 104 :isCart="isCart"
105 @addCart="addCart"
106 :sk_id="sk_id"
107 :propMpId="mp_id"
108 @chooseCartModi="chooseCartModi"
109 :cart_id="cart_id"
110 :index="cartIndex"
111 :pid="pid"
112 :goodInfo="goodInfo"
113 :isShowBottom="isShowBottom"
114 @closeBottom="closeBottom"
115 ></BottomSheet>
95 </view> 116 </view>
96 </template> 117 </template>
97 118
98 <script> 119 <script>
99 120
100 import store from '@/store' 121 import store from '@/store'
101 import BottomSheet from '../../components/BottomSheet/BottomSheet.vue'; 122 import BottomSheet from '../../components/BottomSheet/BottomSheet.vue'
102 export default { 123 export default {
103 components:{ 124 components: {
104 BottomSheet, 125 BottomSheet,
105 }, 126 },
106 data() { 127 data() {
107 return { 128 return {
108 pid:Number, 129 pid: Number,
109 isCart:Number, 130 isCart: Number,
110 sk_id:String, 131 sk_id: String,
111 mp_id:String, 132 mp_id: String,
112 isShowBottom : false, //底部弹窗开关 133 isShowBottom: false, // 底部弹窗开关
113 cart_id:Number, 134 cart_id: Number,
114 maxCount: 20, 135 maxCount: 20,
115 cartIndex:Number, 136 cartIndex: Number,
116 cartList:[] 137 cartList: [],
117 } 138 }
118 }, 139 },
119 computed: { 140 computed: {
120 pIsoPen (){ 141 pIsoPen () {
121 if (this.cartList.length > 0){ 142 if (this.cartList.length > 0) {
122 return this.cartList.find(item => !item.isChecked) ? false : true; 143 return !this.cartList.find(item => !item.isChecked)
123 } 144 }
124 return false 145 return false
125 }, 146 },
126 goodInfo () { 147 goodInfo () {
127 return this.$store.state.read.goodInfo 148 return this.$store.state.read.goodInfo
128 }, 149 },
129 totalPrice() { 150 totalPrice() {
130 let totalPrice = 0 151 let totalPrice = 0
131 this.cartList.forEach((item)=>{ 152 this.cartList.forEach((item) => {
132 if(item.isChecked){ 153 if (item.isChecked) {
133 totalPrice += item.nowPrice * item.num; 154 totalPrice += item.nowPrice * item.num
134 } 155 }
135 }) 156 })
136 return totalPrice 157 return totalPrice
137 } 158 },
138 }, 159 },
139 onShow() { 160 onShow() {
140 this.cartList = this.$store.state.cart.cartList; 161 this.cartList = this.$store.state.cart.cartList
141 }, 162 },
142 onLoad: async function() { 163 onLoad: async function() {
143 await this.$store.dispatch('cart/getCartList', { 164 await this.$store.dispatch('cart/getCartList', {
144 uid: this.$store.state.user.userInfo.uid, // 用户id 165 uid: this.$store.state.user.userInfo.uid, // 用户id
145 }) 166 })
146 167
147 this.cartList = this.$store.state.cart.cartList; 168 this.cartList = this.$store.state.cart.cartList
148 this.cartList.forEach((item)=>{ 169 this.cartList.forEach((item) => {
149 item.isChecked = false 170 item.isChecked = false
150 }) 171 })
151 }, 172 },
152 methods: { 173 methods: {
153 //全选按钮 174 // 全选按钮
154 pClick(){ 175 pClick() {
155 let pStatus = this.cartList.find(item => !item.isChecked) ? false : true 176 const pStatus = !this.cartList.find(item => !item.isChecked)
156 let oldList = this.cartList; 177 const oldList = this.cartList
157 oldList.forEach((item, index)=>{ 178 oldList.forEach((item, index) => {
158 item.isChecked = !pStatus 179 item.isChecked = !pStatus
159 this.cartList.splice(index,1, item) 180 this.cartList.splice(index, 1, item)
160 }) 181 })
161 }, 182 },
162 //单选按钮 183 // 单选按钮
163 childClick(type,index){ 184 childClick(type, index) {
164 this.cartList[index].isChecked = !this.cartList[index].isChecked 185 this.cartList[index].isChecked = !this.cartList[index].isChecked
165 //vue没有办法监听数组内部值的变化，所以需要通过这个方法去触发 186 // vue没有办法监听数组内部值的变化，所以需要通过这个方法去触发
166 this.cartList.splice(index,1, this.cartList[index]) 187 this.cartList.splice(index, 1, this.cartList[index])
167 }, 188 },
168 //修改购物车 189 // 修改购物车
169 chooseCartModi(mp_id,sk_id,price,pid,num,cart_id,index){ 190 chooseCartModi(mp_id, sk_id, price, pid, num, cart_id, index) {
170 // console.log('modi',mp_id,sk_id,price,pid,num,cart_id) 191 // console.log('modi',mp_id,sk_id,price,pid,num,cart_id)
171 store.dispatch('cart/modiCart', { 192 store.dispatch('cart/modiCart', {
172 uid: this.$store.state.user.userInfo.uid, 193 uid: this.$store.state.user.userInfo.uid,
173 openid: this.$store.state.user.userInfo.openid, 194 openid: this.$store.state.user.userInfo.openid,
174 mp_id: mp_id, 195 mp_id: mp_id,
175 sk_id: sk_id, 196 sk_id: sk_id,
176 price: price, 197 price: price,
177 pid: pid, 198 pid: pid,
178 num: num, 199 num: num,
179 cart_id: cart_id, 200 cart_id: cart_id,
180 args: { 201 args: {
181 index: index, 202 index: index,
182 }, 203 },
183 }) 204 })
184 this.$nextTick(function(){ 205 this.$nextTick(function() {
185 store.dispatch('cart/getCartList', { 206 store.dispatch('cart/getCartList', {
186 uid: this.$store.state.user.userInfo.uid, // 用户id 207 uid: this.$store.state.user.userInfo.uid, // 用户id
187 }).then(()=>{ 208 }).then(() => {
188 this.cartList = this.$store.state.cart.cartList; 209 this.cartList = this.$store.state.cart.cartList
189 }) 210 })
190 }) 211 })
191 }, 212 },
192 //底部弹窗开关 213 // 底部弹窗开关
193 showBottom(isCart,pid,skId,mp_id,cart_id,index){ 214 showBottom(isCart, pid, skId, mp_id, cart_id, index) {
194 store.dispatch('read/fetch', { 215 store.dispatch('read/fetch', {
195 pid, 216 pid,
196 sk_id: skId, 217 sk_id: skId,
197 }).then(()=>{ 218 }).then(() => {
198 this.cartIndex = index 219 this.cartIndex = index
199 this.sk_id = skId; 220 this.sk_id = skId
200 this.pid = pid; 221 this.pid = pid
201 this.mp_id = mp_id; 222 this.mp_id = mp_id
202 this.isCart = isCart; 223 this.isCart = isCart
203 this.cart_id = cart_id; 224 this.cart_id = cart_id
204 this.isShowBottom = true; 225 this.isShowBottom = true
205 }) 226 })
206 }, 227 },
207 closeBottom(){ 228 closeBottom() {
208 this.isShowBottom = false; 229 this.isShowBottom = false
209 }, 230 },
210 toGoods(id, sk_id) { 231 toGoods(id, skId) {
211 uni.navigateTo({ 232 uni.navigateTo({
212 url: '../frameDetail/frameDetail?pid=' + id + '&sk_id=' + sk_id, 233 url: '../details/details?pid=' + id + '&sk_id=' + skId,
213 success: res => {}, 234 success: res => {},
214 fail: () => {}, 235 fail: () => {},
215 complete: () => {}, 236 complete: () => {},
216 }) 237 })
217 }, 238 },
218 toComfirmOrder(){ 239
219 this.$store.state.cart.checkedCartLst = this.cartList.filter(item => item.isChecked) 240 toComfirmOrder() {
220 if(this.$store.state.cart.checkedCartLst.length>0){ 241 this.$store.state.cart.checkedCartLst = this.cartList.filter(item => item.isChecked)
221 // this.delCart() 242 if (this.$store.state.cart.checkedCartLst.length > 0) {
222 uni.navigateTo({ 243 uni.navigateTo({
223 url:`../confirmOrder/confirmOrder?isCart=true`, 244 url: '../confirmOrder/confirmOrder?isCart=true',
224 }) 245 })
225 }else{ 246 } else {
226 uni.showToast({ 247 uni.showToast({
227 title:'您还没有选择宝贝哦~', 248 title: '您还没有选择宝贝哦~',
228 icon:'none' 249 icon: 'none',
229 }) 250 })
230 } 251 }
231 }, 252 },
232 counter(index, isadd, item) { 253 counter(index, isadd, item) {
233 // console.log('item=====>', item) 254 // console.log('item=====>', item)
234 // console.log('num=====>', item.num) 255 // console.log('num=====>', item.num)
235 const nums = parseInt(item.num) 256 const nums = parseInt(item.num)
236 if (isadd) { 257 if (isadd) {
237 if (nums >= this.maxCount) { 258 if (nums >= this.maxCount) {
238 this.addDisabled = true 259 this.addDisabled = true
239 } else { 260 } else {
240 this.addDisabled = true 261 this.addDisabled = true
241 store.dispatch('cart/modiCart', { 262 store.dispatch('cart/modiCart', {
242 uid: this.$store.state.user.userInfo.uid, 263 uid: this.$store.state.user.userInfo.uid,
243 openid: this.$store.state.user.userInfo.openid, 264 openid: this.$store.state.user.userInfo.openid,
244 mp_id: item.mp_id, 265 mp_id: item.mp_id,
245 sk_id: item.sk_id, 266 sk_id: item.sk_id,
246 price: item.nowPrice, 267 price: item.nowPrice,
247 pid: item.pid, 268 pid: item.pid,
248 num: nums + 1, 269 num: nums + 1,
249 cart_id: item.cart_id, 270 cart_id: item.cart_id,
250 args: { 271 args: {
251 index: index, 272 index: index,
252 isadd: isadd, 273 isadd: isadd,
253 }, 274 },
254 }) 275 })
255 this.addDisabled = false 276 this.addDisabled = false
256 } 277 }
257 } else { 278 } else {
258 if (nums <= 1) { 279 if (nums <= 1) {
259 this.desDisabled = true 280 this.desDisabled = true
260 } else { 281 } else {
261 this.desDisabled = false 282 this.desDisabled = false
262 283
263 store.dispatch('cart/modiCart', { 284 store.dispatch('cart/modiCart', {
264 uid: this.$store.state.user.userInfo.uid, 285 uid: this.$store.state.user.userInfo.uid,
265 openid: this.$store.state.user.userInfo.openid, 286 openid: this.$store.state.user.userInfo.openid,
266 mp_id: item.mp_id, 287 mp_id: item.mp_id,
267 sk_id: item.sk_id, 288 sk_id: item.sk_id,
268 price: item.nowPrice, 289 price: item.nowPrice,
269 pid: item.pid, 290 pid: item.pid,
270 num: nums - 1, 291 num: nums - 1,
271 cart_id: item.cart_id, 292 cart_id: item.cart_id,
272 args: { 293 args: {
273 index: index, 294 index: index,
274 isadd: isadd, 295 isadd: isadd,
275 }, 296 },
276 }) 297 })
277 this.desDisabled = true 298 this.desDisabled = true
278 } 299 }
279 }
280 300 }
281 }, 301 },
282 delCart(cart_id, index) { 302 delCart(cart_id, index) {
283 cart_id = parseInt(cart_id) 303 cart_id = parseInt(cart_id)
284 uni.showModal({ 304 uni.showModal({
285 title: '是否删除该商品', 305 title: '是否删除该商品',
286 success: function (res) { 306 success: function (res) {
287 if (res.confirm) { 307 if (res.confirm) {
288 store.dispatch('cart/delCart', { 308 store.dispatch('cart/delCart', {
289 uid: this.$store.state.user.userInfo.uid, 309 uid: this.$store.state.user.userInfo.uid,
290 openid: this.$store.state.user.userInfo.openid, 310 openid: this.$store.state.user.userInfo.openid,
291 cart_id: cart_id, // 要修改的购物车id 311 cart_id: cart_id, // 要修改的购物车id
292 arg: index, // 由于action 传参是能接收两参数，因此将index放入对象 312 arg: index, // 由于action 传参是能接收两参数，因此将index放入对象
293 }) 313 })
294 } 314 }
295 }.bind(this), 315 }.bind(this),
296 }) 316 })
297 // this.cartList.splice(index,1) 317 // this.cartList.splice(index,1)
298 }, 318 },
299 }, 319 },
300 } 320 }
301 </script> 321 </script>
302 322
303 <style lang="scss"> 323 <style lang="scss">
304 .content { 324 .content {
305 min-height: 100vh; 325 min-height: 100vh;
306 background-color: #f2f2f2; 326 background-color: #f2f2f2;
307 display: flex; 327 display: flex;
308 flex-direction: column; 328 flex-direction: column;
309 align-items: center; 329 align-items: center;
310 justify-content: space-between; 330 justify-content: space-between;
311 padding: 20rpx 40rpx; 331 padding: 20rpx 40rpx;
312 box-sizing: border-box; 332 box-sizing: border-box;
313 333
314 .partentCheck { 334 .partentCheck {
315 width: 16px; 335 width: 16px;
316 height: 16px; 336 height: 16px;
317 border-radius: 22px; 337 border-radius: 22px;
318 border: 1px solid #cfcfcf; 338 border: 1px solid #cfcfcf;
319 background-color: #ffffff; 339 background-color: #ffffff;
320 margin: 24rpx 12rpx 24rpx 24rpx; 340 margin: 24rpx 12rpx 24rpx 24rpx;
321 } 341 }
322 .partentChecked { 342 .partentChecked {
323 width: 18px; 343 width: 18px;
324 height: 18px; 344 height: 18px;
325 border-radius: 22px; 345 border-radius: 22px;
326 background-color: #ff6b4a; 346 background-color: #ff6b4a;
327 margin: 24rpx 12rpx 24rpx 24rpx; 347 margin: 24rpx 12rpx 24rpx 24rpx;
328 .correct { 348 .correct {
329 display: inline-block; 349 display: inline-block;
330 position: relative; 350 position: relative;
331 width: 10rpx; 351 width: 10rpx;
332 height: 2rpx; 352 height: 2rpx;
333 background: #ffffff; 353 background: #ffffff;
334 line-height: 0; 354 line-height: 0;
335 font-size: 0; 355 font-size: 0;
336 position: relative; 356 position: relative;
337 top: -7px; 357 top: -7px;
338 left: 4px; 358 left: 4px;
339 -webkit-transform: rotate(45deg); 359 -webkit-transform: rotate(45deg);
340 } 360 }
341 .correct:after { 361 .correct:after {
342 content: "/"; 362 content: "/";
343 display: block; 363 display: block;
344 width: 16rpx; 364 width: 16rpx;
345 height: 2rpx; 365 height: 2rpx;
346 background: #ffffff; 366 background: #ffffff;
347 -webkit-transform: rotate(-90deg) translateY(50%) translateX(50%); 367 -webkit-transform: rotate(-90deg) translateY(50%) translateX(50%);
348 } 368 }
349 } 369 }
350 370
351 .card { 371 .card {
352 background-color: #ffffff; 372 background-color: #ffffff;
353 border-radius: 16rpx; 373 border-radius: 16rpx;
354 box-sizing: border-box; 374 box-sizing: border-box;
355 padding: 36rpx 36rpx 36rpx 18rpx; 375 padding: 36rpx 36rpx 36rpx 18rpx;
356 display: flex; 376 display: flex;
357 flex-direction: column; 377 flex-direction: column;
358 align-items: center; 378 align-items: center;
359 justify-content: space-between; 379 justify-content: space-between;
360 margin-bottom: 180rpx; 380 margin-bottom: 180rpx;
361 .cardHeader { 381 .cardHeader {
362 width: 100%; 382 width: 100%;
363 height: 36rpx; 383 height: 36rpx;
364 display: flex; 384 display: flex;
365 align-items: center; 385 align-items: center;
366 justify-content: flex-start; 386 justify-content: flex-start;
367 margin-bottom: 20rpx; 387 margin-bottom: 20rpx;
368 image { 388 image {
369 height: 32rpx; 389 height: 32rpx;
370 width: 32rpx; 390 width: 32rpx;
371 padding-left: 6px; 391 padding-left: 6px;
372 padding-right: 10px; 392 padding-right: 10px;
373 } 393 }
374 text { 394 text {
375 // font-family: PingFangSC-Regular; 395 // font-family: PingFangSC-Regular;
376 font-size: 14px; 396 font-size: 14px;
377 color: #333333; 397 color: #333333;
378 letter-spacing: -0.26px; 398 letter-spacing: -0.26px;
379 } 399 }
380 } 400 }
381 .cardBody { 401 .cardBody {
382 width: 100%; 402 width: 100%;
383 min-height: 300rpx; 403 min-height: 300rpx;
384 display: flex; 404 display: flex;
385 align-items: center; 405 align-items: center;
386 justify-content: space-between; 406 justify-content: space-between;
387 .goodInfo { 407 .goodInfo {
388 width: 390rpx; 408 width: 390rpx;
389 display: flex; 409 display: flex;
390 flex-direction: row; 410 flex-direction: row;
391 justify-content: flex-start; 411 justify-content: flex-start;
392 padding-left: 6px; 412 padding-left: 6px;
393 413
394 .imageWrap { 414 .imageWrap {
395 height: 188rpx; 415 height: 188rpx;
396 width: 188rpx; 416 width: 188rpx;
397 margin-right: 28rpx; 417 margin-right: 28rpx;
398 418
399 image { 419 image {
400 border-radius: 4px; 420 border-radius: 4px;
401 height: 188rpx; 421 height: 188rpx;
402 width: 188rpx; 422 width: 188rpx;
403 } 423 }
404 } 424 }
405 .infoRight { 425 .infoRight {
406 display: flex; 426 display: flex;
407 flex-direction: column; 427 flex-direction: column;
408 align-items: flex-start; 428 align-items: flex-start;
409 justify-content: space-between; 429 justify-content: space-between;
410 min-height: 240rpx; 430 min-height: 240rpx;
411 width: 100%; 431 width: 100%;
412 .goodName { 432 .goodName {
413 display: -webkit-box; 433 display: -webkit-box;
414 -webkit-box-orient: vertical; 434 -webkit-box-orient: vertical;
415 -webkit-line-clamp: 2; 435 -webkit-line-clamp: 2;
416 text-align: justify; 436 text-align: justify;
417 overflow: hidden; 437 overflow: hidden;
418 font-size: 28rpx; 438 font-size: 28rpx;
419 color: #333333; 439 color: #333333;
420 } 440 }
421 .describ { 441 .describ {
422 width: 100%; 442 width: 100%;
423 min-height: 80rpx; 443 min-height: 80rpx;
424 background: #F9F9F9; 444 background: #f9f9f9;
425 border-radius: 2px; 445 border-radius: 2px;
426 box-sizing: border-box; 446 box-sizing: border-box;
427 padding: 10rpx; 447 padding: 10rpx;
428 font-size: 20rpx; 448 font-size: 20rpx;
429 letter-spacing: -0.23px; 449 letter-spacing: -0.23px;
430 color: #999999; 450 color: #999999;
431 display: flex; 451 display: flex;
432 justify-content: space-between; 452 justify-content: space-between;
433 align-items: center; 453 align-items: center;
434 .desL{ 454 .desL {
435 455 view {
436 view{ 456 margin: 10rpx 0 10rpx 0;
437 margin: 10rpx 0 10rpx 0 ; 457 }
438 }
439 }
440 458 }
441 } 459 }
442 .priceBox { 460 .priceBox {
443 display: flex; 461 display: flex;
444 justify-content: space-between; 462 justify-content: space-between;
445 align-items: center; 463 align-items: center;
446 // margin-top: 26px; 464 // margin-top: 26px;
447 width: 100%; 465 width: 100%;
448 font-size: 14px; 466 font-size: 14px;
449 color: #999999; 467 color: #999999;
450 .maxCount { 468 .maxCount {
451 color: #999999; 469 color: #999999;
452 font-size: 20rpx; 470 font-size: 20rpx;
453 } 471 }
454 .price { 472 .price {
455 color: #ff6b4a; 473 color: #ff6b4a;
456 font-size: 28rpx; 474 font-size: 28rpx;
457 } 475 }
458 .counter { 476 .counter {
459 display: flex; 477 display: flex;
460 flex-direction: row; 478 flex-direction: row;
461 justify-content: space-between; 479 justify-content: space-between;
462 align-items: center; 480 align-items: center;
463 font-size: 28rpx; 481 font-size: 28rpx;
464 color: #333333; 482 color: #333333;
465 width: 122rpx; 483 width: 122rpx;
466 .btn { 484 .btn {
467 display: flex; 485 display: flex;
468 justify-content: center; 486 justify-content: center;
469 line-height: 32rpx; 487 line-height: 32rpx;
470 height: 32rpx; 488 height: 32rpx;
471 width: 32rpx; 489 width: 32rpx;
472 background-color: #f2f2f2; 490 background-color: #f2f2f2;
473 color: #cfcfcf; 491 color: #cfcfcf;
474 } 492 }
475 } 493 }
476 } 494 }
477 } 495 }
478 } 496 }
479 } 497 }
480 } 498 }
481 .footer { 499 .footer {
482 position: fixed; 500 position: fixed;
483 left: 0; 501 left: 0;
484 bottom: 0px; 502 bottom: 0px;
485 height: 112rpx; 503 height: 112rpx;
486 width: 100%; 504 width: 100%;
487 background-color: #ffffff; 505 background-color: #ffffff;
488 font-size: 16px; 506 font-size: 16px;
489 display: flex; 507 display: flex;
490 justify-content: space-between; 508 justify-content: space-between;
491 align-items: center; 509 align-items: center;
492 .footerLeft { 510 .footerLeft {
493 display: flex; 511 display: flex;
494 justify-content: center; 512 justify-content: center;
495 align-items: center; 513 align-items: center;
496 width: 50%; 514 width: 50%;
497 color: #333333; 515 color: #333333;
498 text { 516 text {
499 color: #ff6b4a; 517 color: #ff6b4a;
500 } 518 }
501 } 519 }
502 .footerRight { 520 .footerRight {
503 display: flex; 521 display: flex;
504 justify-content: flex-end; 522 justify-content: flex-end;
505 align-items: center; 523 align-items: center;
506 width: 50%; 524 width: 50%;
507 margin-right: 26rpx; 525 margin-right: 26rpx;
508 .paybtn { 526 .paybtn {
509 display: flex; 527 display: flex;
510 justify-content: center; 528 justify-content: center;
511 align-items: center; 529 align-items: center;
512 background: #ff6b4a; 530 background: #ff6b4a;
513 border-radius: 20px; 531 border-radius: 20px;
514 border-radius: 20px; 532 border-radius: 20px;
515 color: #ffffff; 533 color: #ffffff;
516 width: 204rpx; 534 width: 204rpx;
517 height: 80rpx; 535 height: 80rpx;
518 } 536 }
519 } 537 }
520 } 538 }
521 } 539 }
522 /* 隐藏滚动条 */
523 ::-webkit-scrollbar {
524 width: 0;
525 height: 0;
526 color: transparent;
src/pages/details/details.vue
Diff comments   View file @c4494f9
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')
375 return { 374 return {
376 title: 'Hi，' + myName + '送你300元来试戴最新潮流眼镜！', // 默认是小程序的名称(可以写slogan等) 375 title: 'Hi，' + myName + '送你300元来试戴最新潮流眼镜！', // 默认是小程序的名称(可以写slogan等)
377 path: '/pages/index/detail/index?uid=' + uid + '&sid=0&pid=' + this.pid, 376 path: '/pages/details/details?sid=0&pid=' + this.pid,
378 imageUrl: this.skuList[0].pic, // 不传入 imageUrl 则使用默认截图。显示图片长宽比是 5:4 377 imageUrl: this.skuList[0].pic, // 不传入 imageUrl 则使用默认截图。显示图片长宽比是 5:4
379 success: function (res) { 378 success: function (res) {
380 if (res.errMsg === 'shareAppMessage:ok') { 379 if (res.errMsg === 'shareAppMessage:ok') {
381 console.log('分享成功！', res) 380 console.log('分享成功！', res)
382 } 381 }
383 }, 382 },
384 fail: function (res) { 383 fail: function (res) {
385 if (res.errMsg === 'shareAppMessage:fail cancel') { 384 if (res.errMsg === 'shareAppMessage:fail cancel') {
386 console.log('fail', '放弃分享') 385 console.log('fail', '放弃分享')
387 } else if (res.errMsg === 'shareAppMessage:fail') { 386 } else if (res.errMsg === 'shareAppMessage:fail') {
388 console.log('fail', '分享失败') 387 console.log('fail', '分享失败')
389 } 388 }
390 }, 389 },
391 } 390 }
392 }, 391 },
393 // 生成海报 392 // 生成海报
394 sharePost() { 393 sharePost() {
395 const fromsid = this.$store.state.user.fromInfo.fromsid || 'undefined' 394 const fromsid = this.$store.state.user.fromInfo.fromsid || 'undefined'
396 395
397 store.dispatch('details/post', { 396 store.dispatch('details/post', {
398 pid: this.pid, 397 pid: this.pid,
399 sid: fromsid === 'undefined' ? 0 : fromsid, 398 sid: fromsid === 'undefined' ? 0 : fromsid,
400 }).then((data) => { 399 }).then((data) => {
401 uni.hideLoading() 400 uni.hideLoading()
402 this.$refs.uniPopupPost.open() 401 this.$refs.uniPopupPost.open()
403 }) 402 })
404 }, 403 },
405 // 参数选择弹窗开关 404 // 参数选择弹窗开关
406 showBottom(isCart) { 405 showBottom(isCart) {
407 this.isCart = isCart 406 this.isCart = isCart
408 this.isShowBottom = true 407 this.isShowBottom = true
409 }, 408 },
410 closeBottom() { 409 closeBottom() {
411 this.isShowBottom = false 410 this.isShowBottom = false
412 }, 411 },
413 // 前往购物车 412 // 前往购物车
414 toCart() { 413 toCart() {
415 uni.switchTab({ 414 uni.switchTab({
416 url: '/pages/cart/cart', 415 url: '/pages/cart/cart',
417 success: res => {}, 416 success: res => {},
418 fail: (error) => { console.log('跳转购物车失败======>', error) }, 417 fail: (error) => { console.log('跳转购物车失败======>', error) },
419 complete: () => { console.log('toCart') }, 418 complete: () => { console.log('toCart') },
420 }) 419 })
421 }, 420 },
422 // 加入购物车 421 // 加入购物车
423 addCart (mpId, num, checkedSKU, skId, price) { 422 addCart (mpId, num, checkedSKU, skId, price) {
424 const addCartList = {} 423 const addCartList = {}
425 addCartList.mp_id = mpId 424 addCartList.mp_id = mpId
426 addCartList.sk_id = skId 425 addCartList.sk_id = skId
427 addCartList.num = num 426 addCartList.num = num
428 addCartList.checkedSKU = checkedSKU 427 addCartList.checkedSKU = checkedSKU
429 addCartList.pid = this.pid 428 addCartList.pid = this.pid
430 addCartList.price = price 429 addCartList.price = price
431 console.log('添加购物车的参数', addCartList) 430 console.log('添加购物车的参数', addCartList)
432 store.dispatch('cart/addCart', addCartList).then((res) => { 431 store.dispatch('cart/addCart', addCartList).then((res) => {
433 if (res.code === 1) { 432 if (res.code === 1) {
434 uni.showToast({ 433 uni.showToast({
435 title: '添加成功~', 434 title: '添加成功~',
436 icon: 'success', 435 icon: 'success',
437 }) 436 })
438 } 437 }
439 // 再次请求购物车接口，实现实时更新 438 // 再次请求购物车接口，实现实时更新
440 store.dispatch('details/getCartNumber') 439 store.dispatch('details/getCartNumber')
441 }) 440 })
442 }, 441 },
443 }, 442 },
444 } 443 }
445 </script> 444 </script>
446 445
447 <style lang="scss"> 446 <style lang="scss">
448 .container { 447 .container {
449 background-color: #f8f8f8; 448 background-color: #f8f8f8;
450 font-family: "PingFangSC-Regular"; 449 font-family: "PingFangSC-Regular";
451 // 板块样式 450 // 板块样式
452 > view { 451 > view {
453 background: #ffffff; 452 background: #ffffff;
454 margin-bottom: 10px; 453 margin-bottom: 10px;
455 padding: 8px 20px 8px 20px; 454 padding: 8px 20px 8px 20px;
456 box-sizing: border-box; 455 box-sizing: border-box;
457 } 456 }
458 // 基础信息板块 457 // 基础信息板块
459 .basic_info { 458 .basic_info {
460 // 轮播图 459 // 轮播图
461 .swiperImage { 460 .swiperImage {
462 width: 684rpx; 461 width: 684rpx;
463 height: 480rpx; 462 height: 480rpx;
463 text-align: center;
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>
src/pages/index/index.vue
Diff comments   View file @c4494f9
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 },
177 /**
178 * 页面载入完成后调用子组件的方法生成预加载效果
179 */
180 onReady:function(){
181 this.getInitData()
182 }, 184 },
183 methods: { 185 /**
184 async getInitData (){ 186 * 页面载入完成后调用子组件的方法生成预加载效果
185 this.showSkeleton = true; 187 */
186 await Promise.all([store.dispatch("index/category"), store.dispatch("index/list")]) 188 onReady: function() {
187 this.showSkeleton = false; 189 this.getInitData()
188 this.showContent = true 190 },
189 }, 191 methods: {
192 async getInitData () {
193 this.showSkeleton = true
194 await Promise.all([store.dispatch('index/category'), store.dispatch('index/list')])
195 this.showSkeleton = false
196 this.showContent = true
197 },
190 showDrawer(e) { 198 showDrawer(e) {
191 this.$refs[e].open(); 199 this.$refs[e].open()
200 },
201 // 朋友圈设置页面
202 onShareAppMessage() {
203 let myName = this.$store.state.user.userInfo.nickName
204 if (myName === '' || myName.length < 1 || myName === '匿名用户' || typeof myName === 'undefined') {
205 myName = '【神秘人】'
206 } else {
207 myName = '【' + myName + '】'
208 }
209 return {
210 title: 'Hi，' + myName + '送你300元来试戴最新潮流眼镜！', // 默认是小程序的名称(可以写slogan等)
211 path: '/pages/index/index',
212 // imageUrl: '/static/img/details/d1.png', // 不传入 imageUrl 则使用默认截图。显示图片长宽比是 5:4
213 success: function (res) {
214 if (res.errMsg === 'shareAppMessage:ok') {
215 console.log('分享成功！', res)
216 }
217 },
218 fail: function (res) {
219 if (res.errMsg === 'shareAppMessage:fail cancel') {
220 console.log('fail', '放弃分享')
221 } else if (res.errMsg === 'shareAppMessage:fail') {
222 console.log('fail', '分享失败')
223 }
224 },
225 }
192 }, 226 },
193 getList() { 227 getList() {
194 store.dispatch("index/list"); 228 store.dispatch('index/list')
195 this.isLoading = false; //TODO:::这里不知道怎么改，请同学帮忙写一下。 229 this.isLoading = false // TODO:::这里不知道怎么改，请同学帮忙写一下。
196 //把data里的isLoading 改为false就可以了 230 // 把data里的isLoading 改为false就可以了
197 }, 231 },
198 // search(params) { 232 // search(params) {
199 // this.$store.index. 233 // this.$store.index.
200 // }, 234 // },
201 closeDrawer(e) { 235 closeDrawer(e) {
202 this.$refs[e].close(); 236 this.$refs[e].close()
203 }, 237 },
204 change(e, type) { 238 change(e, type) {
205 this[type] = e; 239 this[type] = e
206 }, 240 },
207 onClickItem(e) { 241 onClickItem(e) {
208 if (this.current !== e) { 242 if (this.current !== e) {
209 this.current = e; 243 this.current = e
210 } 244 }
211 }, 245 },
212 dropDown() { 246 dropDown() {
213 console.log("下拉"); 247 console.log('下拉')
214 }, 248 },
215 searchKey(e) { 249 searchKey(e) {
216 const { value: keyword } = e.detail; 250 const { value: keyword } = e.detail
217 this.keyWords = keyword; 251 this.keyWords = keyword
218 store.dispatch("index/search", { 252 store.dispatch('index/search', {
219 params: {}, 253 params: {},
220 keyword 254 keyword,
221 }); 255 })
222 }, 256 },
223 // 接收菜单结果 257 // 接收菜单结果
224 search(e) { 258 search(e) {
225 const { on, value, selectedData } = e; 259 const { on, value, selectedData } = e
226 let params = {}; 260 let params = {}
227 const selectedPayload = {}; 261 const selectedPayload = {}
228 for (const key in selectedData) { 262 for (const key in selectedData) {
229 if (Object.prototype.hasOwnProperty.call(selectedData, key)) { 263 if (Object.prototype.hasOwnProperty.call(selectedData, key)) {
230 selectedPayload[key] = selectedData[key].toString(); 264 selectedPayload[key] = selectedData[key].toString()
231 } 265 }
232 } 266 }
233 if (on[0] === 1) { 267 if (on[0] === 1) {
234 // 若点击全部 268 // 若点击全部
235 this.searchText = ""; 269 this.searchText = ''
236 store.dispatch("index/list"); 270 store.dispatch('index/list')
237 } else { 271 } else {
238 for (let i = 1; i <= on.length; i++) { 272 for (let i = 1; i <= on.length; i++) {
239 // on[0]是全部 273 // on[0]是全部
240 if (on[i] === 1) { 274 if (on[i] === 1) {
241 // 若该选项被选中 275 // 若该选项被选中
242 if (this.categoryList[i].value === "filter") { 276 if (this.categoryList[i].value === 'filter') {
243 params = { 277 params = {
244 ...selectedPayload, 278 ...selectedPayload,
245 ...params 279 ...params,
246 }; 280 }
281 } else if (this.categoryList[i].value === 'px') {
282 params.orderby = value[i][0]
247 } else { 283 } else {
248 params[`${this.categoryList[i].value}`] = value[i][0]; 284 params[`${this.categoryList[i].value}`] = value[i][0]
249 } 285 }
250 } 286 }
251 } 287 }
252 store.dispatch("index/search", { 288 store.dispatch('index/search', {
253 params, 289 params,
254 keyword: this.keyWords 290 keyword: this.keyWords,
255 }); 291 })
256 } 292 }
257 } 293 },
258 } 294 },
259 }; 295 }
260 </script> 296 </script>
261 297
262 <style lang="scss"> 298 <style lang="scss">
263 .content,.container { 299 .content,
300 .container {
264 display: flex; 301 display: flex;
265 flex-direction: column; 302 flex-direction: column;
266 align-items: center; 303 align-items: center;
267 justify-content: center; 304 justify-content: center;
268 width: 100%; 305 width: 100%;
269 } 306 }
270 .header { 307 .header {
271 display: flex; 308 display: flex;
272 flex-direction: column; 309 flex-direction: column;
273 align-items: center; 310 align-items: center;
274 justify-content: center; 311 justify-content: center;
275 background-color: #f7f6f6; 312 background-color: #f7f6f6;
276 height: 178rpx; 313 height: 178rpx;
277 width: 100%; 314 width: 100%;
278 z-index: 999; 315 z-index: 999;
279 position: fixed; 316 position: fixed;
280 top: 0; 317 top: 0;
281 left: 0; 318 left: 0;
282 } 319 }
283 .searchBar { 320 .searchBar {
284 width: 670rpx; 321 width: 670rpx;
285 display: flex; 322 display: flex;
286 justify-content: center; 323 justify-content: center;
287 align-items: center; 324 align-items: center;
288 box-sizing: border-box; 325 box-sizing: border-box;
289 padding: 0rpx 16rpx; 326 padding: 0rpx 16rpx;
290 border: 1px solid #ff6b4a; 327 border: 1px solid #ff6b4a;
291 border-radius: 8rpx; 328 border-radius: 8rpx;
292 background-color: #ffffff; 329 background-color: #ffffff;
293 } 330 }
294 331
295 .searchIpt { 332 .searchIpt {
296 height: 68rpx; 333 height: 68rpx;
297 width: 670rpx; 334 width: 670rpx;
298 padding: 16rpx; 335 padding: 16rpx;
299 font-size: 28rpx; 336 font-size: 28rpx;
300 box-sizing: border-box; 337 box-sizing: border-box;
301 } 338 }
302 .screenBar { 339 .screenBar {
303 width: 670rpx; 340 width: 670rpx;
304 height: 110rpx; 341 height: 110rpx;
305 display: flex; 342 display: flex;
306 flex-direction: row; 343 flex-direction: row;
307 justify-content: space-between; 344 justify-content: space-between;
308 align-items: center; 345 align-items: center;
309 color: #333333; 346 color: #333333;
310 font-size: 32rpx; 347 font-size: 32rpx;
311 } 348 }
312 .active { 349 .active {
313 color: #ff6b4a; 350 color: #ff6b4a;
314 } 351 }
315 .screenItem { 352 .screenItem {
316 display: flex; 353 display: flex;
317 justify-content: center; 354 justify-content: center;
318 align-items: center; 355 align-items: center;
319 } 356 }
320 .content-wrap { 357 .content-wrap {
321 width: 100%; 358 width: 100%;
322 background-color: #ffffff; 359 background-color: #ffffff;
323 } 360 }
324 361
325 .HMfilterDropdown { 362 .HMfilterDropdown {
326 top: 178rpx !important; 363 top: 178rpx !important;
327 } 364 }
328 365
329 .goods-list { 366 .goods-list {
330 padding-top: 286rpx; 367 padding-top: 286rpx;
331 .loading-text { 368 .loading-text {
332 width: 100%; 369 width: 100%;
src/pages/user/user.vue
Diff comments   View file @c4494f9
1 <template> 1 <template>
2 <view class="wrap"> 2 <view class="wrap">
3 <!-- 弹窗 --> 3 <!-- 弹窗 -->
4 <uni-popup 4 <uni-popup
5 ref="popup" 5 ref="popup"
6 type="center" 6 type="center"
7 > 7 >
8 <!-- 给一个左边弹窗的样式 --> 8 <!-- 给一个左边弹窗的样式 -->
9 <!-- 关闭弹窗按钮 --> 9 <!-- 关闭弹窗按钮 -->
10 <view 10 <view
11 class="closeBtn" 11 class="closeBtn"
12 @tap="this.$refs.popup.close()" 12 @tap="this.$refs.popup.close()"
13 >x</view> 13 >x</view>
14 <view 14 <view
15 class="popUpWrap" 15 class="popUpWrap"
16 v-if="whichTap==0" 16 v-if="whichTap==0"
17 > 17 >
18 <text>这是一款眼镜及周边产品的销售平台，我们将帮您进行建立全球销售网络，欢迎入驻。</text> 18 <text>这是一款眼镜及周边产品的销售平台，我们将帮您进行建立全球销售网络，欢迎入驻。</text>
19 19
20 <!-- 左 --> 20 <!-- 左 -->
21 <!-- <image class="glassInfo" src="../../static/img/myOpticsData/glassInfo.png" v-if="whichTap == 0" mode="aspectFit"></image> --> 21 <!-- <image class="glassInfo" src="../../static/img/myOpticsData/glassInfo.png" v-if="whichTap == 0" mode="aspectFit"></image> -->
22 <!-- 右 --> 22 <!-- 右 -->
23 <!-- <image class="dataInfo" src="../../static/img/myOpticsData/dataInfo.png" v-else mode="aspectFit"></image> --> 23 <!-- <image class="dataInfo" src="../../static/img/myOpticsData/dataInfo.png" v-else mode="aspectFit"></image> -->
24 </view> 24 </view>
25 <view 25 <view
26 class="popUpWrap" 26 class="popUpWrap"
27 v-if="whichTap==1" 27 v-if="whichTap==1"
28 > 28 >
29 <text>本平台欢迎全国各地的眼镜工厂、品牌、眼镜店加入。请联系我们申请注册账号。</text> 29 <text>本平台欢迎全国各地的眼镜工厂、品牌、眼镜店加入。请联系我们申请注册账号。</text>
30 </view> 30 </view>
31 <view 31 <view
32 class="popUpWrap" 32 class="popUpWrap"
33 v-if="whichTap==2" 33 v-if="whichTap==2"
34 > 34 >
35 <button @tap="chatOur(1)">客服1</button> 35 <button @tap="chatOur(1)">客服1</button>
36 <button @tap="chatOur(2)">客服2</button> 36 <button @tap="chatOur(2)">客服2</button>
37 </view> 37 </view>
38 </uni-popup> 38 </uni-popup>
39 <!-- <scroll-view 39 <!-- <scroll-view
40 enable-flex 40 enable-flex
41 @scrolltolower="handleScrolltolower" 41 @scrolltolower="handleScrolltolower"
42 scroll-y 42 scroll-y
43 style="height: 1000px;" 43 style="height: 1000px;"
44 > --> 44 > -->
45 <view 45 <view
46 v-if="isAuth" 46 v-if="isAuth"
47 class="content" 47 class="content"
48 > 48 >
49 <view class="userInfo"> 49 <view class="userInfo">
50 <view class="info"> 50 <view class="info">
51 <image 51 <image
52 :src="headerphoto" 52 :src="headerphoto"
53 mode="aspectFill" 53 mode="aspectFill"
54 ></image> 54 ></image>
55 <view class="infoText"> 55 <view class="infoText">
56 <text class="userName">{{nickName}}</text> 56 <text class="userName">{{nickName}}</text>
57 </view> 57 </view>
58 </view> 58 </view>
59 <!-- <view class="service"> 59 <!-- <view class="service">
60 <image src="../../static/serviceLogo.png" mode="aspectFill"></image> 60 <image src="../../static/serviceLogo.png" mode="aspectFill"></image>
61 </view> --> 61 </view> -->
62 </view> 62 </view>
63 <view 63 <view
64 class="myOpticsData" 64 class="myOpticsData"
65 @tap="toOpticsData" 65 @tap="toOpticsData"
66 > 66 >
67 <view class="left"> 67 <view class="left">
68 <image 68 <image
69 src="../../static/img/user/dataWrite.png" 69 src="../../static/img/user/dataWrite.png"
70 mode="aspectFit" 70 mode="aspectFit"
71 ></image> 71 ></image>
72 <text>验光数据</text> 72 <text>验光数据</text>
73 </view> 73 </view>
74 <image 74 <image
75 src="../../static/right.png" 75 src="../../static/right.png"
76 mode="aspectFit" 76 mode="aspectFit"
77 ></image> 77 ></image>
78 </view> 78 </view>
79 <view class="myOrder"> 79 <view class="myOrder">
80 <view class="orderHeader"> 80 <view class="orderHeader">
81 <text>我的订单</text> 81 <text>我的订单</text>
82 <view 82 <view
83 class="btn" 83 class="btn"
84 @click="toMyOrder('10')" 84 @click="toMyOrder('10')"
85 > 85 >
86 全部 86 全部
87 <image 87 <image
88 src="../../static/right.png" 88 src="../../static/right.png"
89 mode="aspectFit" 89 mode="aspectFit"
90 ></image> 90 ></image>
91 </view> 91 </view>
92 </view> 92 </view>
93 <view class="orderBody"> 93 <view class="orderBody">
94 <view 94 <view
95 class="item waitPay" 95 class="item waitPay"
96 @click="toMyOrder('0')" 96 @click="toMyOrder('0')"
97 > 97 >
98 <image 98 <image
99 src="../../static/img/user/waitDeliver.png" 99 src="../../static/img/user/waitDeliver.png"
100 mode="aspectFit" 100 mode="aspectFit"
101 ></image> 101 ></image>
102 <text>待付款</text> 102 <text>待付款</text>
103 </view> 103 </view>
104 <view 104 <view
105 class="item waitDeliver" 105 class="item waitDeliver"
106 @click="toMyOrder('1')" 106 @click="toMyOrder('1')"
107 > 107 >
108 <image 108 <image
109 src="../../static/img/user/waitPay.png" 109 src="../../static/img/user/waitPay.png"
110 mode="aspectFit" 110 mode="aspectFit"
111 ></image> 111 ></image>
112 <text>待收货</text> 112 <text>待收货</text>
113 </view> 113 </view>
114 <view 114 <view
115 class="item waitReceive" 115 class="item waitReceive"
116 @click="toMyOrder('2')" 116 @click="toMyOrder('2')"
117 > 117 >
118 <image 118 <image
119 src="../../static/img/user/waitReceive.png" 119 src="../../static/img/user/waitReceive.png"
120 mode="aspectFit" 120 mode="aspectFit"
121 ></image> 121 ></image>
122 <text>已完成</text> 122 <text>已完成</text>
123 </view> 123 </view>
124 <!-- <view class="item service" @click="toMyOrder('3')"> 124 <!-- <view class="item service" @click="toMyOrder('3')">
125 <image src="../../static/img/user/refound.png" mode="aspectFit"></image> 125 <image src="../../static/img/user/refound.png" mode="aspectFit"></image>
126 <text>已评价</text> 126 <text>已评价</text>
127 </view> --> 127 </view> -->
128 </view> 128 </view>
129 </view> 129 </view>
130 <view class="someItem"> 130 <view class="someItem">
131 <!-- <view class="item"> 131 <!-- <view class="item">
132 <view class="left"> 132 <view class="left">
133 <image src="../../static/img/user/shouyi.png" mode="aspectFit"></image> 133 <image src="../../static/img/user/shouyi.png" mode="aspectFit"></image>
134 <text>推广记录与收益</text> 134 <text>推广记录与收益</text>
135 </view> 135 </view>
136 <image src="../../static/right.png" mode="aspectFit"></image> 136 <image src="../../static/right.png" mode="aspectFit"></image>
137 </view> --> 137 </view> -->
138 <view class="item"> 138 <view
139 @tap="toAddress"
140 class="item"
141 >
139 <image 142 <image
140 src="../../static/address-icon.png" 143 src="../../static/address-icon.png"
141 mode="aspectFit" 144 mode="aspectFit"
142 ></image> 145 ></image>
143 <view class="left"> 146 <view class="left">
144 <text @tap="toAddress">地址管理</text> 147 <text>地址管理</text>
145 <image 148 <image
146 class="image2" 149 class="image2"
147 src="../../static/right.png" 150 src="../../static/right.png"
148 mode="aspectFit" 151 mode="aspectFit"
149 ></image> 152 ></image>
150 </view> 153 </view>
151 154
152 </view> 155 </view>
153 <view class="item"> 156 <view
157 @tap="introduce"
158 class="item"
159 >
154 <image 160 <image
155 src="../../static/img/user/introduce.png" 161 src="../../static/img/user/introduce.png"
156 mode="aspectFit" 162 mode="aspectFit"
157 ></image> 163 ></image>
158 <view class="left"> 164 <view class="left">
159 <text @tap="introduce">系统介绍</text> 165 <text>系统介绍</text>
160 <image 166 <image
161 src="../../static/right.png" 167 src="../../static/right.png"
162 mode="aspectFit" 168 mode="aspectFit"
163 ></image> 169 ></image>
164 </view> 170 </view>
165 </view> 171 </view>
166 <view class="item"> 172 <view
173 @tap="joinUs"
174 class="item"
175 >
167 <image 176 <image
168 src="../../static/img/user/joinUs.png" 177 src="../../static/img/user/joinUs.png"
169 mode="aspectFit" 178 mode="aspectFit"
170 ></image> 179 ></image>
171 <view class="left"> 180 <view class="left">
172 <text @tap="joinUs">加入我们</text> 181 <text>加入我们</text>
173 <image 182 <image
174 src="../../static/right.png" 183 src="../../static/right.png"
175 mode="aspectFit" 184 mode="aspectFit"
176 ></image> 185 ></image>
177 </view> 186 </view>
178 </view> 187 </view>
179 <view class="item"> 188 <view class="item">
180 <image 189 <image
181 src="../../static/img/user/service.png" 190 src="../../static/img/user/service.png"
182 mode="aspectFit" 191 mode="aspectFit"
183 ></image> 192 ></image>
184 <view class="left lastLeft"> 193 <view class="left lastLeft">
185 <text>联系客服</text> 194 <text>联系客服</text>
186 <image 195 <image
187 src="../../static/right.png" 196 src="../../static/right.png"
188 mode="aspectFit" 197 mode="aspectFit"
189 ></image> 198 ></image>
190 </view> 199 </view>
191 </view> 200 </view>
192 </view> 201 </view>
193 <view class="recommend"> 202 <view class="recommend">
194 <view class="title"> 203 <view class="title">
195 <view class="line"></view> 204 <view class="line"></view>
196 <view class="text">精选推荐</view> 205 <view class="text">精选推荐</view>
197 <view class="line"></view> 206 <view class="line"></view>
198 </view> 207 </view>
199 <!-- 商品列表 --> 208 <!-- 商品列表 -->
200 <view class="goods-list"> 209 <view class="goods-list">
201 <!-- <scroll-view 210 <!-- <scroll-view
202 enable-flex 211 enable-flex
203 @scrolltolower="handleScrolltolower" 212 @scrolltolower="handleScrolltolower"
204 scroll-y 213 scroll-y
205 class="product-list" 214 class="product-list"
206 > --> 215 > -->
207 <view class="product-list"> 216 <view class="product-list">
208 <view 217 <view
209 class="product" 218 class="product"
210 v-for="(item, index) in userRecommandList" 219 v-for="(item, index) in userRecommandList"
211 :key="index" 220 :key="index"
212 > 221 >
213 <Card :goods="item" :scrollTop="scrollTop" :viewHeight="viewHeight"></Card> 222 <Card
223 :goods="item"
224 :scrollTop="scrollTop"
225 :viewHeight="viewHeight"
226 ></Card>
214 </view> 227 </view>
215 </view> 228 </view>
216 <!-- </scroll-view> --> 229 <!-- </scroll-view> -->
217 <view class="loading-text">{{loadingText}}</view> 230 <view class="loading-text">{{loadingText}}</view>
218 </view> 231 </view>
219 </view> 232 </view>
220 </view> 233 </view>
221 <view 234 <view
222 v-else 235 v-else
223 class="auth" 236 class="auth"
224 > 237 >
225 <view class="icon"></view> 238 <view class="icon"></view>
226 <view class="divider"></view> 239 <view class="divider"></view>
227 <view class="title">申请获取以下权限</view> 240 <view class="title">申请获取以下权限</view>
228 <view class="text">获得您的公开信息(昵称、头像等)</view> 241 <view class="text">获得您的公开信息(昵称、头像等)</view>
229 <button 242 <button
230 type="primary" 243 type="primary"
231 open-type="getUserInfo" 244 open-type="getUserInfo"
232 @getuserinfo="onGotUserInfo" 245 @getuserinfo="onGotUserInfo"
233 >授权登陆</button> 246 >授权登陆</button>
234 </view> 247 </view>
235 <!-- </scroll-view> --> 248 <!-- </scroll-view> -->
236 </view> 249 </view>
237 </template> 250 </template>
238 251
239 <script> 252 <script>
240 import Card from '@/components/CommodityCard/CommodityCard.vue' 253 import Card from '@/components/CommodityCard/CommodityCard.vue'
241 import store from '@/store' 254 import store from '@/store'
242 import UniPopup from '@/components/UniPopup/uni-popup.vue' 255 import UniPopup from '@/components/UniPopup/uni-popup.vue'
243 256
244 export default { 257 export default {
245 components: { 258 components: {
246 Card, 259 Card,
247 UniPopup 260 UniPopup,
248 }, 261 },
249 data() { 262 data() {
250 return { 263 return {
251 isAuth: true, // 是否显示授权页面, 264 isAuth: true, // 是否显示授权页面,
252 pagesnum: 1, // 分页请求初始值 265 pagesnum: 1, // 分页请求初始值
253 whichTap: 0 ,// 弹窗渲染选择条件 266 whichTap: 0, // 弹窗渲染选择条件
254 loadingText: '到底了', 267 loadingText: '到底了',
255 scrollTop: 0, 268 scrollTop: 0,
256 viewHeight: uni.getSystemInfoSync().windowHeight, 269 viewHeight: uni.getSystemInfoSync().windowHeight,
257 } 270 }
258 }, 271 },
259 onPageScroll({scrollTop}) { 272 onPageScroll({ scrollTop }) {
260 // 传入scrollTop值并触发所有easy-loadimage组件下的滚动监听事件 273 // 传入scrollTop值并触发所有easy-loadimage组件下的滚动监听事件
261 this.scrollTop = scrollTop; 274 this.scrollTop = scrollTop
262 }, 275 },
263 onLoad() { 276 onLoad() {
277 const that = this
264 // 判断是否授权 278 // 判断是否授权
265 uni.getSetting({ 279 uni.getSetting({
266 success(res) { 280 success(res) {
267 console.log('authSetting', res.authSetting) 281 console.log('authSetting', res.authSetting)
268 if (res.authSetting['scope.userInfo'] === true) { 282 if (res.authSetting['scope.userInfo'] === true) {
269 this.isAuth = true 283 that.isAuth = true
270 } else { 284 } else {
271 this.isAuth = false 285 that.isAuth = false
272 } 286 }
273 } 287 },
274 }) 288 })
275 store.dispatch('userRecommand/getRecommandList', { 289 store.dispatch('userRecommand/getRecommandList', {
276 uid: this.$store.state.user.userInfo.uid, 290 uid: that.$store.state.user.userInfo.uid,
277 openid: this.$store.state.user.userInfo.openid, 291 openid: that.$store.state.user.userInfo.openid,
278 page: this.pagesnum 292 page: that.pagesnum,
279 }) 293 })
280 }, 294 },
281 onReachBottom() { 295 onReachBottom() {
282 // console.log('usr-my',this.$store.state.user.userInfo) 296 // console.log('usr-my',this.$store.state.user.userInfo)
283 this.pagesnum++ 297 this.pagesnum++
284 store.dispatch('userRecommand/getRecommandList', { 298 store.dispatch('userRecommand/getRecommandList', {
285 uid: this.$store.state.user.userInfo.uid, 299 uid: this.$store.state.user.userInfo.uid,
286 openid: this.$store.state.user.userInfo.openid, 300 openid: this.$store.state.user.userInfo.openid,
287 page: this.pagesnum 301 page: this.pagesnum,
288 }) 302 })
289 }, 303 },
290 computed: { 304 computed: {
291 nickName() { 305 nickName() {
292 return this.$store.state.user.userInfo.nickName 306 return this.$store.state.user.userInfo.nickName
293 }, 307 },
294 headerphoto() { 308 headerphoto() {
295 return this.$store.state.user.userInfo.headerphoto 309 return this.$store.state.user.userInfo.headerphoto
296 }, 310 },
297 userRecommandList() { 311 userRecommandList() {
298 console.log('userRecommandList=====>',this.$store.state.userRecommand.recommandList) 312 console.log('userRecommandList=====>', this.$store.state.userRecommand.recommandList)
299 return this.$store.state.userRecommand.recommandList 313 return this.$store.state.userRecommand.recommandList
300 } 314 },
301 }, 315 },
302 methods: { 316 methods: {
303 // 弹窗 317 // 弹窗
304 changeTap(item) { 318 changeTap(item) {
305 this.whichTap = item 319 this.whichTap = item
306 this.$refs.popup.open() 320 this.$refs.popup.open()
307 }, 321 },
308 chatOur(item) { 322 chatOur(item) {
309 if (item === 1) { 323 if (item === 1) {
310 uni.makePhoneCall({ 324 uni.makePhoneCall({
311 phoneNumber: 13376189297 // 客服1 电话 325 phoneNumber: 13376189297, // 客服1 电话
312 }) 326 })
313 } else { 327 } else {
314 uni.makePhoneCall({ 328 uni.makePhoneCall({
315 phoneNumber: 18014995101 // 客服2 电话 329 phoneNumber: 18014995101, // 客服2 电话
316 }) 330 })
317 } 331 }
318 }, 332 },
319 // 授权 333 // 授权
320 onGotUserInfo(e) { 334 onGotUserInfo(e) {
321 if (e.detail.errMsg === 'getUserInfo:ok') { 335 if (e.detail.errMsg === 'getUserInfo:ok') {
322 const { fromInfo } = this.$store.state.user 336 const { fromInfo } = this.$store.state.user
323 // 用户授权成功 337 // 用户授权成功
324 store.dispatch('user/getUserInfo', fromInfo) 338 store.dispatch('user/getUserInfo', fromInfo)
325 this.isAuth = true 339 this.isAuth = true
326 } 340 }
327 }, 341 },
328 toAddress() { 342 toAddress() {
329 uni.navigateTo({ 343 uni.navigateTo({
330 url: '../address/addressList', 344 url: '../address/addressList',
331 success: res => {}, 345 success: res => {},
332 fail: () => {}, 346 fail: () => {},
333 complete: () => {} 347 complete: () => {},
334 }) 348 })
335 }, 349 },
336 introduce() { 350 introduce() {
337 uni.showModal({ 351 uni.showModal({
338 content: '这是一款眼镜及周边产品的销售平台，我们将帮您进行建立全球销售网络，欢迎入住。', 352 content: '这是一款眼镜及周边产品的销售平台，我们将帮您进行建立全球销售网络，欢迎入住。',
339 showCancel: false 353 showCancel: false,
340 }) 354 })
341 }, 355 },
342 joinUs() { 356 joinUs() {
343 uni.showModal({ 357 uni.showModal({
344 content: '本平台欢迎全国各地的眼镜工厂、品牌、眼镜店加入。请联系我们申请注册账号', 358 content: '本平台欢迎全国各地的眼镜工厂、品牌、眼镜店加入。请联系我们申请注册账号',
345 showCancel: false 359 showCancel: false,
346 }) 360 })
347 }, 361 },
348 toMyOrder(status) { 362 toMyOrder(status) {
349 uni.navigateTo({ 363 uni.navigateTo({
350 url: `../myOrder/myOrder?status=${status}`, 364 url: `../myOrder/myOrder?status=${status}`,
351 success: res => {}, 365 success: res => {},
352 fail: () => {}, 366 fail: () => {},
353 complete: () => {} 367 complete: () => {},
354 }) 368 })
355 }, 369 },
356 toOpticsData() { 370 toOpticsData() {
357 uni.navigateTo({ 371 uni.navigateTo({
358 url: '../addOpticsData/addOpticsData' 372 url: '../addOpticsData/addOpticsData',
359 }) 373 })
360 } 374 },
361 } 375 },
362 } 376 }
363 </script> 377 </script>
364 378
365 <style lang="scss"> 379 <style lang="scss">
366 .warp { 380 .warp {
367 font-size: 24rpx; 381 font-size: 24rpx;
368 background-color: #f2f2f2; 382 background-color: #f2f2f2;
369 height: 100vh; 383 height: 100vh;
370 } 384 }
371 .content { 385 .content {
372 display: flex; 386 display: flex;
373 flex-direction: column; 387 flex-direction: column;
374 align-items: center; 388 align-items: center;
375 justify-content: center; 389 justify-content: center;
376 background-color: #f2f2f2; 390 background-color: #f2f2f2;
377 } 391 }
378 .userInfo { 392 .userInfo {
379 background-image: linear-gradient(270deg, #f79067 0%, #FF5F3B 66%); 393 background-image: linear-gradient(270deg, #f79067 0%, #ff5f3b 66%);
380 width: 100%; 394 width: 100%;
381 height: 240rpx; 395 height: 240rpx;
382 color: #ffffff; 396 color: #ffffff;
383 padding: 60rpx 82rpx 80rpx 44rpx; 397 padding: 60rpx 82rpx 80rpx 44rpx;
384 box-sizing: border-box; 398 box-sizing: border-box;
385 display: flex; 399 display: flex;
386 flex-direction: row; 400 flex-direction: row;
387 justify-content: space-between; 401 justify-content: space-between;
388 align-items: flex-start; 402 align-items: flex-start;
389 .info { 403 .info {
390 display: flex; 404 display: flex;
391 flex-direction: row; 405 flex-direction: row;
392 justify-content: space-between; 406 justify-content: space-between;
393 align-items: center; 407 align-items: center;
394 image { 408 image {
395 border-radius: 50rpx; 409 border-radius: 50rpx;
396 height: 100rpx; 410 height: 100rpx;
397 width: 100rpx; 411 width: 100rpx;
398 margin-right: 40rpx; 412 margin-right: 40rpx;
399 } 413 }
400 .infoText { 414 .infoText {
401 display: flex; 415 display: flex;
402 flex-direction: column; 416 flex-direction: column;
403 justify-content: space-between; 417 justify-content: space-between;
404 align-items: flex-scetart; 418 align-items: flex-scetart;
405 .userName { 419 .userName {
406 font-size: 18px; 420 font-size: 18px;
407 color: #ffffff; 421 color: #ffffff;
408 margin-bottom: 8rpx; 422 margin-bottom: 8rpx;
409 } 423 }
410 .nickName { 424 .nickName {
411 font-size: 12px; 425 font-size: 12px;
412 color: #ffffff; 426 color: #ffffff;
413 } 427 }
414 } 428 }
415 } 429 }
416 // .service { 430 // .service {
417 // margin-top: 20rpx; 431 // margin-top: 20rpx;
418 // image { 432 // image {
419 // height: 36rpx; 433 // height: 36rpx;
420 // width: 36rpx; 434 // width: 36rpx;
421 // } 435 // }
422 // } 436 // }
423 } 437 }
424 .myOpticsData { 438 .myOpticsData {
425 width: 670rpx; 439 width: 670rpx;
426 height: 120rpx; 440 height: 120rpx;
427 background-color: #ffffff; 441 background-color: #ffffff;
428 border-radius: 6px; 442 border-radius: 6px;
429 box-shadow: 1px 1px 7px 0 rgba(133, 107, 107, 0.1); 443 box-shadow: 1px 1px 7px 0 rgba(133, 107, 107, 0.1);
430 position: relative; 444 position: relative;
431 bottom: 44rpx; 445 bottom: 44rpx;
432 padding: 40rpx; 446 padding: 40rpx;
433 box-sizing: border-box; 447 box-sizing: border-box;
434 display: flex; 448 display: flex;
435 justify-content: space-between; 449 justify-content: space-between;
436 align-items: center; 450 align-items: center;
437 .left { 451 .left {
438 font-size: 14px; 452 font-size: 14px;
439 color: #333333; 453 color: #333333;
440 display: flex; 454 display: flex;
441 align-items: center; 455 align-items: center;
442 image { 456 image {
443 margin-right: 32rpx; 457 margin-right: 32rpx;
444 width: 40rpx; 458 width: 40rpx;
445 height: 44rpx; 459 height: 44rpx;
446 } 460 }
447 } 461 }
448 image { 462 image {
449 height: 16px; 463 height: 16px;
450 width: 8px; 464 width: 8px;
451 } 465 }
452 } 466 }
453 .myOrder { 467 .myOrder {
454 width: 100%; 468 width: 100%;
455 height: 296rpx; 469 height: 296rpx;
456 // margin-top: 116rpx; 470 // margin-top: 116rpx;
457 margin-bottom: 20rpx; 471 margin-bottom: 20rpx;
458 padding: 0 40rpx; 472 padding: 0 40rpx;
459 box-sizing: border-box; 473 box-sizing: border-box;
460 background: #ffffff; 474 background: #ffffff;
461 box-shadow: 0 0 4px 0 rgba(133, 107, 107, 0.1); 475 box-shadow: 0 0 4px 0 rgba(133, 107, 107, 0.1);
462 border-radius: 6px; 476 border-radius: 6px;
463 border-radius: 6px; 477 border-radius: 6px;
464 display: flex; 478 display: flex;
465 flex-direction: column; 479 flex-direction: column;
466 justify-content: space-around; 480 justify-content: space-around;
467 align-items: center; 481 align-items: center;
468 .orderHeader { 482 .orderHeader {
469 width: 100%; 483 width: 100%;
470 height: 100rpx; 484 height: 100rpx;
471 display: flex; 485 display: flex;
472 flex-direction: row; 486 flex-direction: row;
473 justify-content: space-between; 487 justify-content: space-between;
474 align-items: center; 488 align-items: center;
475 border-bottom: 1px solid #F5F5F5; 489 border-bottom: 1px solid #f5f5f5;
476 font-weight: bold; 490 font-weight: bold;
477 font-size: 18px; 491 font-size: 18px;
478 color: #333333; 492 color: #333333;
479 .btn { 493 .btn {
480 font-size: 12px; 494 font-size: 12px;
481 color: #999999; 495 color: #999999;
482 display: flex; 496 display: flex;
483 align-items: center; 497 align-items: center;
484 image { 498 image {
485 margin-left: 20rpx; 499 margin-left: 20rpx;
486 height: 32rpx; 500 height: 32rpx;
487 width: 16rpx; 501 width: 16rpx;
488 } 502 }
489 } 503 }
490 } 504 }
491 .orderBody { 505 .orderBody {
492 width: 100%; 506 width: 100%;
493 display: flex; 507 display: flex;
494 flex-direction: row; 508 flex-direction: row;
495 justify-content: space-around; 509 justify-content: space-around;
496 align-items: center; 510 align-items: center;
497 .item { 511 .item {
498 display: flex; 512 display: flex;
499 flex-direction: column; 513 flex-direction: column;
500 align-items: center; 514 align-items: center;
501 image { 515 image {
502 width: 62rpx; 516 width: 62rpx;
503 height: 46rpx; 517 height: 46rpx;
504 } 518 }
505 text { 519 text {
506 margin-top: 24rpx; 520 margin-top: 24rpx;
507 font-size: 12px; 521 font-size: 12px;
508 color: #333333; 522 color: #333333;
509 } 523 }
510 } 524 }
511 } 525 }
512 } 526 }
513 .someItem { 527 .someItem {
514 width: 100%; 528 width: 100%;
515 height: 336rpx; 529 height: 336rpx;
516 background: #ffffff; 530 background: #ffffff;
517 box-shadow: 0 0 4px 0 rgba(133, 107, 107, 0.1); 531 box-shadow: 0 0 4px 0 rgba(133, 107, 107, 0.1);
518 border-radius: 6px; 532 border-radius: 6px;
519 border-radius: 6px; 533 border-radius: 6px;
520 margin-bottom: 18rpx; 534 margin-bottom: 18rpx;
521 box-sizing: border-box; 535 box-sizing: border-box;
522 padding: 21rpx 48rpx 21rpx 42rpx; 536 padding: 21rpx 48rpx 21rpx 42rpx;
523 box-sizing: border-box; 537 box-sizing: border-box;
524 display: flex; 538 display: flex;
525 flex-direction: column; 539 flex-direction: column;
526 justify-content: space-between; 540 justify-content: space-between;
527 align-items: center; 541 align-items: center;
528 .item { 542 .item {
529 display: grid; 543 display: grid;
530 grid-template-columns: 10% 90%; 544 grid-template-columns: 10% 90%;
531 align-items: center; 545 align-items: center;
532 height: 72rpx; 546 height: 72rpx;
533 width: 100%; 547 width: 100%;
534 .left { 548 .left {
535 font-size: 14px; 549 font-size: 14px;
536 color: #333333; 550 color: #333333;
537 display: flex; 551 display: flex;
538 align-items: center; 552 align-items: center;
539 justify-content: space-between; 553 justify-content: space-between;
540 height: 72rpx; 554 height: 72rpx;
541 border-bottom: 1px solid #F2F2F2; 555 border-bottom: 1px solid #f2f2f2;
542 image { 556 image {
543 margin-right: 0; 557 margin-right: 0;
544 height: 16px; 558 height: 16px;
545 width: 8px; 559 width: 8px;
546 } 560 }
547 } 561 }
548 image { 562 image {
549 margin-right: 32rpx; 563 margin-right: 32rpx;
550 width: 40rpx; 564 width: 40rpx;
551 height: 44rpx; 565 height: 44rpx;
552 } 566 }
553 .lastLeft{ 567 .lastLeft {
554 border-bottom: none; 568 border-bottom: none;
555 } 569 }
556 } 570 }
557 } 571 }
558 .recommend { 572 .recommend {
559 background: #ffffff; 573 background: #ffffff;
560 box-shadow: 0 0 4px 0 rgba(133, 107, 107, 0.1); 574 box-shadow: 0 0 4px 0 rgba(133, 107, 107, 0.1);
561 border-radius: 6px; 575 border-radius: 6px;
562 border-radius: 6px; 576 border-radius: 6px;
563 width: 100%; 577 width: 100%;
564 .title { 578 .title {
565 display: flex; 579 display: flex;
566 flex-direction: row; 580 flex-direction: row;
567 align-items: center; 581 align-items: center;
568 justify-content: space-between; 582 justify-content: space-between;
569 padding: 20rpx 40rpx; 583 padding: 20rpx 40rpx;
570 .line { 584 .line {
571 width: 264rpx; 585 width: 264rpx;
572 height: 1rpx; 586 height: 1rpx;
573 border-bottom: 1px solid #eaeaea; 587 border-bottom: 1px solid #eaeaea;
574 } 588 }
575 .text { 589 .text {
576 font-family: PingFangSC-Medium; 590 font-family: PingFangSC-Medium;
577 font-size: 14px; 591 font-size: 14px;
578 color: #333333; 592 color: #333333;
579 letter-spacing: -0.26px; 593 letter-spacing: -0.26px;
580 text-align: justify; 594 text-align: justify;
581 line-height: 24px; 595 line-height: 24px;
582 } 596 }
583 } 597 }
584 .goods-list { 598 .goods-list {
585 .loading-text { 599 .loading-text {
586 width: 100%; 600 width: 100%;
587 display: flex; 601 display: flex;
588 justify-content: center; 602 justify-content: center;
589 align-items: center; 603 align-items: center;
590 height: 30px; 604 height: 30px;
591 color: #979797; 605 color: #979797;
592 font-size: 12px; 606 font-size: 12px;
593 } 607 }
594 .product-list { 608 .product-list {
595 width: 92%; 609 width: 92%;
596 padding: 0 4% 3vw 4%; 610 padding: 0 4% 3vw 4%;
597 display: flex; 611 display: flex;
598 justify-content: space-between; 612 justify-content: space-between;
599 flex-wrap: wrap; 613 flex-wrap: wrap;
600 .product { 614 .product {
601 width: 48%; 615 width: 48%;
602 margin: 0 0 20rpx 0; 616 margin: 0 0 20rpx 0;
603 background: #ffffff; 617 background: #ffffff;
604 border: 1px solid #f2f2f2; 618 border: 1px solid #f2f2f2;
605 } 619 }
606 } 620 }
607 } 621 }
608 } 622 }
609 .auth { 623 .auth {
610 height: 100vh; 624 height: 100vh;
611 display: flex; 625 display: flex;
612 flex-direction: column; 626 flex-direction: column;
613 align-items: center; 627 align-items: center;
614 .icon { 628 .icon {
615 width: 140rpx; 629 width: 140rpx;
616 height: 140rpx; 630 height: 140rpx;
617 border-radius: 50%; 631 border-radius: 50%;
618 margin-top: 100rpx; 632 margin-top: 100rpx;
619 background-color: grey; 633 background-color: grey;
620 } 634 }
621 .divider { 635 .divider {
622 height: 1rpx; 636 height: 1rpx;
623 width: 600rpx; 637 width: 600rpx;
624 margin-top: 80rpx; 638 margin-top: 80rpx;
625 background-color: #e6e3e3; 639 background-color: #e6e3e3;
626 } 640 }
627 .title { 641 .title {
628 width: 600rpx; 642 width: 600rpx;
629 margin-top: 50rpx; 643 margin-top: 50rpx;
630 text-align: left; 644 text-align: left;
631 } 645 }
632 .text { 646 .text {
633 width: 600rpx; 647 width: 600rpx;
634 margin-top: 30rpx; 648 margin-top: 30rpx;
635 text-align: left; 649 text-align: left;
636 color: #e6e3e3; 650 color: #e6e3e3;
637 } 651 }
638 button { 652 button {
639 width: 450rpx; 653 width: 450rpx;
640 height: 80rpx; 654 height: 80rpx;
641 line-height: 80rpx; 655 line-height: 80rpx;
642 margin-top: 80rpx; 656 margin-top: 80rpx;
643 border-radius: 30rpx; 657 border-radius: 30rpx;
644 } 658 }
645 } 659 }
646 .closeBtn { 660 .closeBtn {
647 height: 28rpx; 661 height: 28rpx;
648 width: 28rpx; 662 width: 28rpx;
649 // border: 1px solid red; 663 // border: 1px solid red;
650 position: absolute; 664 position: absolute;
651 top: 20rpx; 665 top: 20rpx;
652 right: 10rpx; 666 right: 10rpx;
653 } 667 }
654 </style> 668 </style>
655 669
src/static/img/detail/d11.png
View file @fed83ad

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

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

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

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

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

25.2 KB
src/vue.config.js
Diff comments   View file @c4494f9
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 }