Adam / gulu-vue

Download as
Browse Code »

Commit c00dd2818b67fd17bacde070ccf261287b22684c

Authored by 范牧
1 parent e79b721339
Exists in master

细节修改

Showing 11 changed files with 259 additions and 211 deletions   Show diff stats
... ... @@ -22,7 +22,7 @@
22 22 "dev:mp-baidu": "cross-env NODE_ENV=development UNI_PLATFORM=mp-baidu vue-cli-service uni-build --watch",
23 23 "dev:mp-qq": "cross-env NODE_ENV=development UNI_PLATFORM=mp-qq vue-cli-service uni-build --watch",
24 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 26 "dev:quickapp-light": "cross-env NODE_ENV=development UNI_PLATFORM=quickapp-light vue-cli-service uni-build --watch",
27 27 "dev:quickapp-vue": "cross-env NODE_ENV=development UNI_PLATFORM=quickapp-vue vue-cli-service uni-build --watch",
28 28 "info": "node node_modules/@dcloudio/vue-cli-plugin-uni/commands/info.js",
... ... @@ -91,4 +91,4 @@
91 91 "uni-app": {
92 92 "scripts": {}
93 93 }
94 94 -}
  95 +}
95 96 \ No newline at end of file
... ...
... ... @@ -18,24 +18,24 @@
18 18 "navigationBarTitleText": "验光数据"
19 19 }
20 20 },
21   - {
22   - "path": "pages/detailsChoiceArgs/detailsChoiceArgs",
23   - "style": {
24   - "navigationBarTitleText": "镜片名称名称"
25   - }
26   - },
27   - {
28   - "path": "pages/purchaseLenses/purchaseLenses",
29   - "style": {
30   - "navigationBarTitleText": "参数选择"
31   - }
32   - },
33   - {
34   - "path": "pages/lensDetails/lensDetails",
35   - "style": {
36   - "navigationBarTitleText": "产品详情"
37   - }
38   - },
  21 + // {
  22 + // "path": "pages/detailsChoiceArgs/detailsChoiceArgs",
  23 + // "style": {
  24 + // "navigationBarTitleText": "镜片名称名称"
  25 + // }
  26 + // },
  27 + // {
  28 + // "path": "pages/purchaseLenses/purchaseLenses",
  29 + // "style": {
  30 + // "navigationBarTitleText": "参数选择"
  31 + // }
  32 + // },
  33 + // {
  34 + // "path": "pages/lensDetails/lensDetails",
  35 + // "style": {
  36 + // "navigationBarTitleText": "产品详情"
  37 + // }
  38 + // },
39 39 {
40 40 "path": "pages/details/details",
41 41 "style": {
... ... @@ -57,20 +57,20 @@
57 57 {
58 58 "path": "pages/cart/cart",
59 59 "style": {
60   - "navigationBarTitleText": "购物车",
61   - // "disableScroll":true,
62   - "app-plus":{
63   - "bounce":"none"
64   - }
65   - }
66   - },
67   - {
68   - "path": "pages/frameDetail/frameDetail",
69   - "style": {
70   - "navigationBarTitleText": "产品详情"
  60 + "navigationBarTitleText": "购物车",
  61 + // "disableScroll":true,
  62 + "app-plus": {
  63 + "bounce": "none"
  64 + }
71 65 }
72 66 },
73 67 // {
  68 + // "path": "pages/frameDetail/frameDetail",
  69 + // "style": {
  70 + // "navigationBarTitleText": "产品详情"
  71 + // }
  72 + // },
  73 + // {
74 74 // "path": "pages/refundProgress/refundProgress",
75 75 // "style": {
76 76 // "navigationBarTitleText": "申请退款"
... ... @@ -112,24 +112,24 @@
112 112 "navigationBarTitleText": "待发货"
113 113 }
114 114 },
115   - {
116   - "path": "pages/customerService/customerService",
117   - "style": {
118   - "navigationBarTitleText": "在线客服"
119   - }
120   - },
121   - {
122   - "path": "pages/detailStandard/detailStandard_sun",
123   - "style": {
124   - "navigationBarTitleText": "太阳镜选购页"
125   - }
126   - },
127   - {
128   - "path": "pages/detailStandard/detailStandard_k",
129   - "style": {
130   - "navigationBarTitleText": "镜框选购页"
131   - }
132   - },
  115 + // {
  116 + // "path": "pages/customerService/customerService",
  117 + // "style": {
  118 + // "navigationBarTitleText": "在线客服"
  119 + // }
  120 + // },
  121 + // {
  122 + // "path": "pages/detailStandard/detailStandard_sun",
  123 + // "style": {
  124 + // "navigationBarTitleText": "太阳镜选购页"
  125 + // }
  126 + // },
  127 + // {
  128 + // "path": "pages/detailStandard/detailStandard_k",
  129 + // "style": {
  130 + // "navigationBarTitleText": "镜框选购页"
  131 + // }
  132 + // },
133 133 {
134 134 "path": "pages/newOpticsData/newOpticsData",
135 135 "style": {
... ... @@ -139,29 +139,50 @@
139 139 ],
140 140 "subpackages": [
141 141 {
142   - "root": "pages/refundment",
  142 + "root": "refundment",
143 143 "pages": [
144   - "pages/refundment/refundWays",
145   - "pages/refundment/refundment",
146   - "pages/refundProgress/refundProgress"
  144 + {
  145 + "path": "refundWays",
  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 160 "name": "pack2",
152 161 "pages": [
153   - "pages/address/addAddress",
154   - "pages/address/addressList"
155   - ]
156   - },
157   - {
158   - "root": "pages/myOrder",
159   - "name": "pack3",
160   - "pages": [
161   - "pages/myOrder/myOrder",
162   - "pages/myOrderPaying/myOrderPaying"
  162 + {
  163 + "path": "addAddress",
  164 + "style": {}
  165 + },
  166 + {
  167 + "path": "addressList",
  168 + "style": {}
  169 + }
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 187 "globalStyle": {
167 188 "navigationBarTextStyle": "black",
... ...
src/pages/details/details.vue
Diff comments   View file @c00dd28
... ... @@ -421,7 +421,7 @@ export default {
421 421 },
422 422 // 加入购物车
423 423 addCart (mpId, num, checkedSKU, skId, price) {
424   - const addCartList = {}
  424 + const addCartList = {}
425 425 addCartList.mp_id = mpId
426 426 addCartList.sk_id = skId
427 427 addCartList.num = num
... ... @@ -641,7 +641,7 @@ export default {
641 641 .menu {
642 642 position: fixed;
643 643 bottom: 0;
644   - height: 74px;
  644 + min-height: 74px;
645 645 width: 100%;
646 646 background: #ffffff;
647 647 padding: 20px 20px 8px 20px;
... ... @@ -688,7 +688,7 @@ export default {
688 688 }
689 689 .menu_2 {
690 690 width: 74%;
691   - height: 86%;
  691 + height: 80rpx;
692 692 display: grid;
693 693 grid-template-columns: 50% 50%;
694 694 }
... ...
src/pages/index/index.vue
Diff comments   View file @c00dd28
1   -<template>
2   - <view class="container">
3   - <view class="content skeleton" v-show="showContent">
4   - <view class="header">
5   - <!-- 搜索-->
6   - <view class="searchBar skeleton-rect">
7   - <icon
8   - class="searchIcon"
9   - type="search"
10   - size="14"
11   - ></icon>
12   - <input
13   - v-model="searchText"
14   - class="searchIpt"
15   - placeholder="老花镜"
16   - confirm-type="search"
17   - @blur="searchKey"
18   - />
19   - </view>
  1 +<template>
  2 + <view class="container">
  3 + <view
  4 + class="content skeleton"
  5 + v-show="showContent"
  6 + >
  7 + <view class="header">
  8 + <!-- 搜索-->
  9 + <view class="searchBar skeleton-rect">
  10 + <icon
  11 + class="searchIcon"
  12 + type="search"
  13 + size="14"
  14 + ></icon>
  15 + <input
  16 + v-model="searchText"
  17 + class="searchIpt"
  18 + placeholder="老花镜"
  19 + confirm-type="search"
  20 + @blur="searchKey"
  21 + />
  22 + </view>
20 23  
21   - <!-- 筛选栏-->
22   - <!-- <view class="screenBar">
  24 + <!-- 筛选栏-->
  25 + <!-- <view class="screenBar">
23 26 <view
24 27 v-for="item in screenItems"
25 28 :key="item.current"
... ... @@ -57,210 +60,218 @@
57 60 </view>
58 61 </view>
59 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 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   - <!-- 筛选菜单-->
77   - <view class="content-wrap skeleton-rect">
78   - <view>
79   - <HMfilterDropdown
80   - :filterData="categoryList"
81   - :defaultSelected="filterDropdownValue"
82   - :updateMenuName="true"
83   - @search="search"
84   - @getList="getList"
85   - data-format="Object"
86   - ></HMfilterDropdown>
87   - <!-- 商品列表 -->
88   - <!-- <scroll-view
  79 + <!-- 筛选菜单-->
  80 + <view class="content-wrap skeleton-rect">
  81 + <view>
  82 + <HMfilterDropdown
  83 + :filterData="categoryList"
  84 + :defaultSelected="filterDropdownValue"
  85 + :updateMenuName="true"
  86 + @search="search"
  87 + @getList="getList"
  88 + data-format="Object"
  89 + ></HMfilterDropdown>
  90 + <!-- 商品列表 -->
  91 + <!-- <scroll-view
89 92 enable-flex
90 93 @scrolltolower="handleScrolltolower"
91 94 scroll-y
92 95 style="height: 1000px;margin-bottom: 20px;"
93 96 > -->
94   - <view class="goods-list">
95   - <view class="product-list">
96   - <view
97   - class="product skeleton-rect"
98   - v-for="(goods) in goodsList"
99   - :key="goods.id"
100   - >
101   - <Card
102   - :goods="goods"
103   - :scrollTop="scrollTop"
104   - :viewHeight="viewHeight"
105   - ></Card>
  97 + <view class="goods-list">
  98 + <view class="product-list">
  99 + <view
  100 + class="product skeleton-rect"
  101 + v-for="(goods) in goodsList"
  102 + :key="goods.id"
  103 + >
  104 + <Card
  105 + :goods="goods"
  106 + :scrollTop="scrollTop"
  107 + :viewHeight="viewHeight"
  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 114 </view>
107 115 </view>
108   - <view class="loading-text">
109   - <text v-if="isLoading==true">{{loadingText}}</text>
110   - <text v-else>{{loadedText}}</text>
111   - </view>
  116 + <!-- </scroll-view> -->
112 117 </view>
113   - <!-- </scroll-view> -->
114 118 </view>
115   - </view>
116   - </view>
117   - <!--引用组件-->
118   - <skeleton :show="showSkeleton" ref="skeleton" loading="chiaroscuro" selector="skeleton" bgcolor="#FFF"></skeleton>
119   - </view>
  119 + </view>
  120 + <!--引用组件-->
  121 + <skeleton
  122 + :show="showSkeleton"
  123 + ref="skeleton"
  124 + loading="chiaroscuro"
  125 + selector="skeleton"
  126 + bgcolor="#FFF"
  127 + ></skeleton>
  128 + </view>
120 129 </template>
121 130  
122 131 <script>
123   -import UniDrawer from "@/components/UniDrawer/UniDrawer.vue";
124   -import Card from "@/components/CommodityCard/CommodityCard.vue";
125   -import HMfilterDropdown from "@/components/HMFilterDropdown/HMFilterDropdown.vue";
126   -import skeleton from "@/components/quick-skeleton/quick-skeleton.vue";
127   -import store from "@/store";
128   -
  132 +import UniDrawer from '@/components/UniDrawer/UniDrawer.vue'
  133 +import Card from '@/components/CommodityCard/CommodityCard.vue'
  134 +import HMfilterDropdown from '@/components/HMFilterDropdown/HMFilterDropdown.vue'
  135 +import skeleton from '@/components/quick-skeleton/quick-skeleton.vue'
  136 +import store from '@/store'
129 137  
130 138 export default {
131 139 components: {
132 140 UniDrawer: UniDrawer,
133 141 HMfilterDropdown: HMfilterDropdown,
134   - Card: Card,
135   - skeleton: skeleton
  142 + Card: Card,
  143 + skeleton: skeleton,
136 144 },
137 145 data() {
138 146 return {
139   - indexArr: "",
140   - valueArr: "",
141   - isLoading: true, //初始化加载状态
142   - loadingText: "data loading...",
143   - loadedText: "~~暂无更多数据~~",
  147 + indexArr: '',
  148 + valueArr: '',
  149 + isLoading: true, // 初始化加载状态
  150 + loadingText: 'data loading...',
  151 + loadedText: '~~暂无更多数据~~',
144 152 filterDropdownValue: [],
145 153 filterData: [],
146   - searchText: "",
147   - scrollTop: 0,
  154 + searchText: '',
  155 + scrollTop: 0,
148 156 showContent: true,
149   - viewHeight: uni.getSystemInfoSync().windowHeight,
150   - showSkeleton: false //骨架屏显示隐藏
151   - };
  157 + viewHeight: uni.getSystemInfoSync().windowHeight,
  158 + showSkeleton: false, // 骨架屏显示隐藏
  159 + }
152 160 },
153 161 onPageScroll({ scrollTop }) {
154 162 // 传入scrollTop值并触发所有easy-loadimage组件下的滚动监听事件
155   - this.scrollTop = scrollTop;
  163 + this.scrollTop = scrollTop
156 164 },
157 165 computed: {
158 166 goodsList() {
159 167 // 也可以从 getters 获取
160 168 // console.log('index-list=====>',this.$store.state.index.list)
161   - let list = this.$store.state.index.list;
162   - if(list.length == 0){
163   - this.isLoading = false;
164   - }
165   - this.scrollTop = 0.1;
  169 + const list = this.$store.state.index.list
  170 + if (list.length == 0) {
  171 + this.isLoading = false
  172 + }
  173 + this.scrollTop = 0.1
166 174 return list
167 175 },
168 176 categoryList() {
169   - return this.$store.state.index.categoryList;
170   - }
  177 + return this.$store.state.index.categoryList
  178 + },
171 179 },
172 180 filters: {
173 181 outData(value) {
174   - return JSON.stringify(value);
175   - }
176   - },
177   - /**
178   - * 页面载入完成后调用子组件的方法生成预加载效果
179   - */
180   - onReady:function(){
181   - this.getInitData()
  182 + return JSON.stringify(value)
  183 + },
  184 + },
  185 + /**
  186 + * 页面载入完成后调用子组件的方法生成预加载效果
  187 + */
  188 + onReady: function() {
  189 + this.getInitData()
182 190 },
183   - methods: {
184   - async getInitData (){
185   - this.showSkeleton = true;
186   - await Promise.all([store.dispatch("index/category"), store.dispatch("index/list")])
187   - this.showSkeleton = false;
188   - this.showContent = true
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 198 showDrawer(e) {
191   - this.$refs[e].open();
  199 + this.$refs[e].open()
192 200 },
193 201 getList() {
194   - store.dispatch("index/list");
195   - this.isLoading = false; //TODO:::这里不知道怎么改，请同学帮忙写一下。
196   - //把data里的isLoading 改为false就可以了
  202 + store.dispatch('index/list')
  203 + this.isLoading = false // TODO:::这里不知道怎么改，请同学帮忙写一下。
  204 + // 把data里的isLoading 改为false就可以了
197 205 },
198 206 // search(params) {
199 207 // this.$store.index.
200 208 // },
201 209 closeDrawer(e) {
202   - this.$refs[e].close();
  210 + this.$refs[e].close()
203 211 },
204 212 change(e, type) {
205   - this[type] = e;
  213 + this[type] = e
206 214 },
207 215 onClickItem(e) {
208 216 if (this.current !== e) {
209   - this.current = e;
  217 + this.current = e
210 218 }
211 219 },
212 220 dropDown() {
213   - console.log("下拉");
  221 + console.log('下拉')
214 222 },
215 223 searchKey(e) {
216   - const { value: keyword } = e.detail;
217   - this.keyWords = keyword;
218   - store.dispatch("index/search", {
  224 + const { value: keyword } = e.detail
  225 + this.keyWords = keyword
  226 + store.dispatch('index/search', {
219 227 params: {},
220   - keyword
221   - });
  228 + keyword,
  229 + })
222 230 },
223 231 // 接收菜单结果
224 232 search(e) {
225   - const { on, value, selectedData } = e;
226   - let params = {};
227   - const selectedPayload = {};
  233 + const { on, value, selectedData } = e
  234 + let params = {}
  235 + const selectedPayload = {}
228 236 for (const key in selectedData) {
229 237 if (Object.prototype.hasOwnProperty.call(selectedData, key)) {
230   - selectedPayload[key] = selectedData[key].toString();
  238 + selectedPayload[key] = selectedData[key].toString()
231 239 }
232 240 }
233 241 if (on[0] === 1) {
234 242 // 若点击全部
235   - this.searchText = "";
236   - store.dispatch("index/list");
  243 + this.searchText = ''
  244 + store.dispatch('index/list')
237 245 } else {
238 246 for (let i = 1; i <= on.length; i++) {
239 247 // on[0]是全部
240 248 if (on[i] === 1) {
241 249 // 若该选项被选中
242   - if (this.categoryList[i].value === "filter") {
  250 + if (this.categoryList[i].value === 'filter') {
243 251 params = {
244 252 ...selectedPayload,
245   - ...params
246   - };
  253 + ...params,
  254 + }
  255 + } else if (this.categoryList[i].value === 'px') {
  256 + params.orderby = value[i][0]
247 257 } else {
248   - params[`${this.categoryList[i].value}`] = value[i][0];
  258 + params[`${this.categoryList[i].value}`] = value[i][0]
249 259 }
250 260 }
251 261 }
252   - store.dispatch("index/search", {
  262 + store.dispatch('index/search', {
253 263 params,
254   - keyword: this.keyWords
255   - });
  264 + keyword: this.keyWords,
  265 + })
256 266 }
257   - }
258   - }
259   -};
  267 + },
  268 + },
  269 +}
260 270 </script>
261 271  
262 272 <style lang="scss">
263   -.content,.container {
  273 +.content,
  274 +.container {
264 275 display: flex;
265 276 flex-direction: column;
266 277 align-items: center;
... ... @@ -344,8 +355,8 @@ export default {
344 355 justify-content: space-between;
345 356 flex-wrap: wrap;
346 357 .product {
347   - width: 48%;
348   - min-height: 120rpx;
  358 + width: 48%;
  359 + min-height: 120rpx;
349 360 margin: 0 0 20rpx 0;
350 361 background: #ffffff;
351 362 border: 1px solid #f2f2f2;
... ...
src/static/img/detail/d11.png
View file @e79b721

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

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

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

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

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

25.2 KB
src/vue.config.js
Diff comments   View file @c00dd28
... ... @@ -14,4 +14,20 @@
14 14 // }
15 15 // },
16 16 // }
17   -// }
18 17 \ No newline at end of file
  18 +// }
  19 +
  20 +module.exports = {
  21 + chainWebpack: (config) => {
  22 + // 发行或运行时启用了压缩时会生效
  23 + config.optimization.minimizer('terser').tap((args) => {
  24 + const compress = args[0].terserOptions.compress
  25 + // 非 App 平台移除 console 代码(包含所有 console 方法，如 log,debug,info...)
  26 + compress.drop_console = true
  27 + compress.pure_funcs = [
  28 + '__f__', // App 平台 vue 移除日志代码
  29 + // 'console.debug' // 可移除指定的 console 方法
  30 + ]
  31 + return args
  32 + })
  33 + },
  34 +}
... ...