刘文博 / gulu-vue

Download as
Browse Code »

Commit 54c9be56423803002f4f0f5cb3c8c947b712b818

Authored by BigBoss
2 parents 607bc3a4d6 f1485452ba
Exists in master

修改冲突

Showing 6 changed files   Show diff stats
src/pages/index/index.vue
Diff comments   View file @54c9be5
1 <template> 1 <template>
2 <view class="content"> 2 <view class="content">
3 <view class="header"> 3 <view class="header">
4 <!-- 搜索--> 4 <!-- 搜索-->
5 <view class="searchBar"> 5 <view class="searchBar">
6 <icon 6 <icon
7 class="searchIcon" 7 class="searchIcon"
8 type="search" 8 type="search"
9 size="14" 9 size="14"
10 ></icon> 10 ></icon>
11 <input 11 <input
12 v-model="searchText" 12 v-model="searchText"
13 class="searchIpt" 13 class="searchIpt"
14 placeholder="老花镜" 14 placeholder="老花镜"
15 confirm-type="search" 15 confirm-type="search"
16 @blur="searchKey" 16 @blur="searchKey"
17 /> 17 />
18 </view> 18 </view>
19 19
20 <!-- 筛选栏--> 20 <!-- 筛选栏-->
21 <!-- <view class="screenBar"> 21 <!-- <view class="screenBar">
22 <view 22 <view
23 v-for="item in screenItems" 23 v-for="item in screenItems"
24 :key="item.current" 24 :key="item.current"
25 @click="onClickItem(item.current)" 25 @click="onClickItem(item.current)"
26 > 26 >
27 <view 27 <view
28 class="screenItem" 28 class="screenItem"
29 v-bind:class="{ active: current === item.current }" 29 v-bind:class="{ active: current === item.current }"
30 v-if="item.current === 2" 30 v-if="item.current === 2"
31 @click="dropDown" 31 @click="dropDown"
32 > 32 >
33 {{ item.text }} 33 {{ item.text }}
34 <icon 34 <icon
35 type="info" 35 type="info"
36 size="14" 36 size="14"
37 ></icon> 37 ></icon>
38 </view> 38 </view>
39 <view 39 <view
40 class="screenItem" 40 class="screenItem"
41 v-bind:class="{ active: current === item.current }" 41 v-bind:class="{ active: current === item.current }"
42 v-if="item.current === 4" 42 v-if="item.current === 4"
43 @click="showDrawer('showRight')" 43 @click="showDrawer('showRight')"
44 > 44 >
45 {{ item.text }} 45 {{ item.text }}
46 <icon 46 <icon
47 type="info" 47 type="info"
48 size="14" 48 size="14"
49 ></icon> 49 ></icon>
50 </view> 50 </view>
51 <view v-if="item.current !== 2&&item.current!==4"> 51 <view v-if="item.current !== 2&&item.current!==4">
52 <view 52 <view
53 class="screenItem" 53 class="screenItem"
54 v-bind:class="{ active: current === item.current }" 54 v-bind:class="{ active: current === item.current }"
55 >{{ item.text }}</view> 55 >{{ item.text }}</view>
56 </view> 56 </view>
57 </view> 57 </view>
58 </view> --> 58 </view> -->
59 </view> 59 </view>
60 <Uni-drawer 60 <Uni-drawer
61 ref="showRight" 61 ref="showRight"
62 mask="true" 62 mask="true"
63 maskClick="true" 63 maskClick="true"
64 mode="right" 64 mode="right"
65 :width="320" 65 :width="320"
66 @change="change($event,'showRight')" 66 @change="change($event,'showRight')"
67 > 67 >
68 <view class="close"> 68 <view class="close">
69 <view @click="closeDrawer('showRight')"> 69 <view @click="closeDrawer('showRight')">
70 <text class="word-btn-white">关闭</text> 70 <text class="word-btn-white">关闭</text>
71 </view> 71 </view>
72 </view> 72 </view>
73 </Uni-drawer> 73 </Uni-drawer>
74 74
75 <!-- 筛选菜单--> 75 <!-- 筛选菜单-->
76 <view class="content-wrap"> 76 <view class="content-wrap">
77 <view> 77 <view>
78 <HMfilterDropdown 78 <HMfilterDropdown
79 :filterData="categoryList" 79 :filterData="categoryList"
80 :defaultSelected="filterDropdownValue" 80 :defaultSelected="filterDropdownValue"
81 :updateMenuName="true" 81 :updateMenuName="true"
82 @search="search" 82 @search="search"
83 @getList="getList" 83 @getList="getList"
84 data-format="Object" 84 data-format="Object"
85 ></HMfilterDropdown> 85 ></HMfilterDropdown>
86 <!-- 商品列表 --> 86 <!-- 商品列表 -->
87 <!-- <scroll-view 87 <!-- <scroll-view
88 enable-flex 88 enable-flex
89 @scrolltolower="handleScrolltolower" 89 @scrolltolower="handleScrolltolower"
90 scroll-y 90 scroll-y
91 style="height: 1000px;margin-bottom: 20px;" 91 style="height: 1000px;margin-bottom: 20px;"
92 > --> 92 > -->
93 <view class="goods-list"> 93 <view class="goods-list">
94 <view class="product-list"> 94 <view class="product-list">
95 <view 95 <view
96 class="product" 96 class="product"
97 v-for="(goods) in goodsList" 97 v-for="(goods) in goodsList"
98 :key="goods.id" 98 :key="goods.id"
99 > 99 >
100 <Card :goods="goods" :scrollTop="scrollTop" :viewHeight="viewHeight"></Card> 100 <Card
101 :goods="goods"
102 :scrollTop="scrollTop"
103 :viewHeight="viewHeight"
104 ></Card>
101 </view> 105 </view>
102 </view> 106 </view>
103 <view class="loading-text">{{loadingText}}</view> 107 <view class="loading-text">
108 <text v-if="isLoading==true">{{loadingText}}</text>
109 <text v-else>{{loadedText}}</text>
110 </view>
104 </view> 111 </view>
105 <!-- </scroll-view> --> 112 <!-- </scroll-view> -->
106 </view> 113 </view>
107 </view> 114 </view>
108 </view> 115 </view>
109 </template> 116 </template>
110 117
111 <script> 118 <script>
112 import UniDrawer from '@/components/UniDrawer/UniDrawer.vue' 119 import UniDrawer from "@/components/UniDrawer/UniDrawer.vue";
113 import Card from '@/components/CommodityCard/CommodityCard.vue' 120 import Card from "@/components/CommodityCard/CommodityCard.vue";
114 import HMfilterDropdown from '@/components/HMFilterDropdown/HMFilterDropdown.vue' 121 import HMfilterDropdown from "@/components/HMFilterDropdown/HMFilterDropdown.vue";
115 import store from '@/store' 122 import store from "@/store";
116 123
117 export default { 124 export default {
118 components: { 125 components: {
119 UniDrawer: UniDrawer, 126 UniDrawer: UniDrawer,
120 HMfilterDropdown: HMfilterDropdown, 127 HMfilterDropdown: HMfilterDropdown,
121 Card: Card, 128 Card: Card
122 }, 129 },
123 data () { 130 data() {
124 return { 131 return {
125 indexArr: '', 132 indexArr: "",
126 valueArr: '', 133 valueArr: "",
127 loadingText: '~~到底了~~', 134 isLoading: true, //初始化加载状态
135 loadingText: "data loading...",
136 loadedText: "~~到底啦~~",
128 filterDropdownValue: [], 137 filterDropdownValue: [],
129 filterData: [], 138 filterData: [],
130 searchText: '', 139 searchText: "",
131 scrollTop: 0, 140 scrollTop: 0,
132 viewHeight: uni.getSystemInfoSync().windowHeight, 141 viewHeight: uni.getSystemInfoSync().windowHeight
133 } 142 };
134 }, 143 },
135 onPageScroll({scrollTop}) { 144 onPageScroll({ scrollTop }) {
136 // 传入scrollTop值并触发所有easy-loadimage组件下的滚动监听事件 145 // 传入scrollTop值并触发所有easy-loadimage组件下的滚动监听事件
137 146 this.scrollTop = scrollTop;
138 this.scrollTop = scrollTop; 147 console.log("pagescroll====>", this.viewHeight);
139 console.log('pagescroll====>',this.viewHeight)
140 }, 148 },
141 computed: { 149 computed: {
142 goodsList () { 150 goodsList() {
143 // 也可以从 getters 获取 151 // 也可以从 getters 获取
144 // console.log('index-list=====>',this.$store.state.index.list) 152 // console.log('index-list=====>',this.$store.state.index.list)
145 return this.$store.state.index.list 153 return this.$store.state.index.list;
146 },
147 categoryList () {
148 return this.$store.state.index.categoryList
149 }, 154 },
155 categoryList() {
156 return this.$store.state.index.categoryList;
157 }
150 }, 158 },
151 filters: { 159 filters: {
152 outData (value) { 160 outData(value) {
153 return JSON.stringify(value) 161 return JSON.stringify(value);
154 }, 162 }
155 }, 163 },
156 onLoad () { 164 onLoad() {
157 store.dispatch('index/category') 165 store.dispatch("index/category");
158 // this.getList(); 166 // this.getList();
159 store.dispatch('index/list') 167 store.dispatch("index/list");
160 }, 168 },
161 methods: { 169 methods: {
162 showDrawer (e) { 170 showDrawer(e) {
163 this.$refs[e].open() 171 this.$refs[e].open();
164 }, 172 },
165 getList () { 173 getList() {
166 store.dispatch('index/list') 174 store.dispatch("index/list");
175 this.isLoading = false; //TODO:::这里不知道怎么改，请同学帮忙写一下。
176 //把data里的isLoading 改为false就可以了
167 }, 177 },
168 // search(params) { 178 // search(params) {
169 // this.$store.index. 179 // this.$store.index.
170 // }, 180 // },
171 closeDrawer (e) { 181 closeDrawer(e) {
172 this.$refs[e].close() 182 this.$refs[e].close();
173 }, 183 },
174 change (e, type) { 184 change(e, type) {
175 this[type] = e 185 this[type] = e;
176 }, 186 },
177 onClickItem (e) { 187 onClickItem(e) {
178 if (this.current !== e) { 188 if (this.current !== e) {
179 this.current = e 189 this.current = e;
180 } 190 }
181 }, 191 },
182 dropDown () { 192 dropDown() {
183 console.log('下拉') 193 console.log("下拉");
184 }, 194 },
185 searchKey (e) { 195 searchKey(e) {
186 const { value: keyword } = e.detail 196 const { value: keyword } = e.detail;
187 this.keyWords = keyword 197 this.keyWords = keyword;
188 store.dispatch('index/search', { 198 store.dispatch("index/search", {
189 params: {}, 199 params: {},
190 keyword, 200 keyword
191 }) 201 });
192 }, 202 },
193 // 接收菜单结果 203 // 接收菜单结果
194 search (e) { 204 search(e) {
195 const { on, value, selectedData } = e 205 const { on, value, selectedData } = e;
196 let params = {} 206 let params = {};
197 const selectedPayload = {} 207 const selectedPayload = {};
198 for (const key in selectedData) { 208 for (const key in selectedData) {
199 if (Object.prototype.hasOwnProperty.call(selectedData, key)) { 209 if (Object.prototype.hasOwnProperty.call(selectedData, key)) {
200 selectedPayload[key] = selectedData[key].toString() 210 selectedPayload[key] = selectedData[key].toString();
201 } 211 }
202 } 212 }
203 if (on[0] === 1) { 213 if (on[0] === 1) {
204 // 若点击全部 214 // 若点击全部
205 this.searchText = '' 215 this.searchText = "";
206 store.dispatch('index/list') 216 store.dispatch("index/list");
207 } else { 217 } else {
208 for (let i = 1; i <= on.length; i++) { // on[0]是全部 218 for (let i = 1; i <= on.length; i++) {
209 if (on[i] === 1) { // 若该选项被选中 219 // on[0]是全部
210 if (this.categoryList[i].value === 'filter') { 220 if (on[i] === 1) {
221 // 若该选项被选中
222 if (this.categoryList[i].value === "filter") {
211 params = { 223 params = {
212 ...selectedPayload, 224 ...selectedPayload,
213 ...params, 225 ...params
214 } 226 };
215 } else { 227 } else {
216 params[`${this.categoryList[i].value}`] = value[i][0] 228 params[`${this.categoryList[i].value}`] = value[i][0];
217 } 229 }
218 } 230 }
219 } 231 }
220 store.dispatch('index/search', { 232 store.dispatch("index/search", {
221 params, 233 params,
222 keyword: this.keyWords, 234 keyword: this.keyWords
223 }) 235 });
224 } 236 }
225 } 237 }
226 } 238 }
227 239 };
228 }
229 </script> 240 </script>
230 241
231 <style lang="scss"> 242 <style lang="scss">
232 .content { 243 .content {
233 display: flex; 244 display: flex;
234 flex-direction: column; 245 flex-direction: column;
235 align-items: center; 246 align-items: center;
236 justify-content: center; 247 justify-content: center;
237 background-color: #f7f6f6; 248 background-color: #f7f6f6;
238 } 249 }
239 .header { 250 .header {
240 display: flex; 251 display: flex;
241 flex-direction: column; 252 flex-direction: column;
242 align-items: center; 253 align-items: center;
243 justify-content: center; 254 justify-content: center;
244 background-color: #f7f6f6; 255 background-color: #f7f6f6;
245 height: 178rpx; 256 height: 178rpx;
246 width: 100%; 257 width: 100%;
247 z-index: 999; 258 z-index: 999;
248 position: fixed; 259 position: fixed;
249 top: 0; 260 top: 0;
250 left: 0; 261 left: 0;
251 } 262 }
252 .searchBar { 263 .searchBar {
253 width: 670rpx; 264 width: 670rpx;
254 display: flex; 265 display: flex;
255 justify-content: center; 266 justify-content: center;
256 align-items: center; 267 align-items: center;
257 box-sizing: border-box; 268 box-sizing: border-box;
258 padding: 0rpx 16rpx; 269 padding: 0rpx 16rpx;
259 border: 1px solid #ff6b4a; 270 border: 1px solid #ff6b4a;
260 border-radius: 8rpx; 271 border-radius: 8rpx;
261 background-color: #ffffff; 272 background-color: #ffffff;
262 } 273 }
263 274
264 .searchIpt { 275 .searchIpt {
265 height: 68rpx; 276 height: 68rpx;
266 width: 670rpx; 277 width: 670rpx;
267 padding: 16rpx; 278 padding: 16rpx;
268 font-size: 28rpx; 279 font-size: 28rpx;
269 box-sizing: border-box; 280 box-sizing: border-box;
270 } 281 }
271 .screenBar { 282 .screenBar {
272 width: 670rpx; 283 width: 670rpx;
273 height: 110rpx; 284 height: 110rpx;
274 display: flex; 285 display: flex;
275 flex-direction: row; 286 flex-direction: row;
276 justify-content: space-between; 287 justify-content: space-between;
277 align-items: center; 288 align-items: center;
278 color: #333333; 289 color: #333333;
279 font-size: 32rpx; 290 font-size: 32rpx;
280 } 291 }
281 .active { 292 .active {
282 color: #ff6b4a; 293 color: #ff6b4a;
283 } 294 }
284 .screenItem { 295 .screenItem {
285 display: flex; 296 display: flex;
286 justify-content: center; 297 justify-content: center;
287 align-items: center; 298 align-items: center;
288 } 299 }
289 .content-wrap { 300 .content-wrap {
290 width: 100%; 301 width: 100%;
291 background-color: #ffffff; 302 background-color: #ffffff;
292 } 303 }
293 304
294 .HMfilterDropdown { 305 .HMfilterDropdown {
295 top: 178rpx !important; 306 top: 178rpx !important;
296 } 307 }
297 308
298 .goods-list { 309 .goods-list {
299 padding-top: 286rpx; 310 padding-top: 286rpx;
300 .loading-text { 311 .loading-text {
301 width: 100%; 312 width: 100%;
302 display: flex; 313 display: flex;
303 justify-content: center; 314 justify-content: center;
304 align-items: center; 315 align-items: center;
305 height: 30px; 316 height: 30px;
306 color: #979797; 317 color: #979797;
307 font-size: 12px; 318 font-size: 12px;
308 } 319 }
309 .product-list { 320 .product-list {
310 width: 92%; 321 width: 92%;
311 padding: 0 4% 3vw 4%; 322 padding: 0 4% 3vw 4%;
312 display: flex; 323 display: flex;
313 justify-content: space-between; 324 justify-content: space-between;
314 flex-wrap: wrap; 325 flex-wrap: wrap;
315 .product { 326 .product {
316 width: 48%; 327 width: 48%;
317 margin: 0 0 20rpx 0; 328 margin: 0 0 20rpx 0;
318 background: #ffffff; 329 background: #ffffff;
319 border: 1px solid #f2f2f2; 330 border: 1px solid #f2f2f2;
src/pages/myOrder/components/OrderCard.vue
Diff comments   View file @54c9be5
1 <template> 1 <template>
2 <view> 2 <view>
3 <view class="card" v-if="current == status" @click="toOrderInfo(status,order.pay_id)"> 3 <view
4 <view class="cardHeader"> 4 class="card"
5 <text class="orderId" v-if="status == '0'||status == '1'">订单号：{{order.mch_id}}</text> 5 v-if="current == status"
6 <text class="orderId" v-if="status == '2'||status == '3'">下单时间：{{order.pay_time}}</text> 6 @click="toOrderInfo(status,order.pay_id)"
7 <text class="orderType" v-if="status=='0'">待付款</text> 7 >
8 <text class="orderType" v-if="status=='1'">待收货</text> 8 <view class="cardHeader">
9 <text class="orderType" v-if="status == '2'||status == '3'">已完成</text> 9 <text
10 <!-- <text class="orderType" v-if="status == '3'">已评价</text> --> 10 class="orderId"
11 </view> 11 v-if="status == '0'||status == '1'"
12 <view class="orderCardInfo" v-for="(orderInfo, index) in orderInfoList.list" :key="index"> 12 >订单号：{{order.pay_id}}</text>
13 <image :src="orderInfo.imgUrl" mode="aspectFill"></image> 13 <text
14 <view class="infoText"> 14 class="orderId"
15 <view class="orderName">{{orderInfo[0].p_name}}</view> 15 v-if="status == '2'||status == '3'"
16 <view class="orderDescrib">{{orderInfo.p_name}}</view> 16 >下单时间：{{order.pay_time}}</text>
17 <view class="infoText-bottom"> 17 <text
18 <view class="markPrice">{{orderInfo.nowPrice}}</view> 18 class="orderType"
19 <view class="buy-num">X {{orderInfo.num}}</view> 19 v-if="status=='0'"
20 </view> 20 >待付款</text>
21 </view> 21 <text
22 </view> 22 class="orderType"
23 <view class="payPrice">实付：<text class="priceNum">{{order.total_fee}}</text> </view> 23 v-if="status=='1'"
24 <!-- 0待付款 1 已付款 待收货 2 已收货待评价 3 已评价 --> 24 >待收货</text>
25 <view class="btns" v-if="status == '0'"> 25 <text
26 <view class="btn-type1" >取消订单</view> 26 class="orderType"
27 <view class="btn-type2">去支付</view> 27 v-if="status == '2'||status == '3'"
28 </view> 28 >已完成</text>
29 <view class="btns" v-if="status == '1'"> 29 <!-- <text class="orderType" v-if="status == '3'">已评价</text> -->
30 <view class="btn-type2">确认收货</view> 30 </view>
31 </view> 31 <view
32 <view class="btns" v-if="status == '2'"> 32 class="orderCardInfo"
33 <view class="btn-type2">再次购买</view> 33 v-for="(orderInfo, index) in order.order_info.list"
34 </view> 34 :key="index"
35 <!-- <view class="btns" v-if="status == '3'"> 35 >
36 <image
37 :src="orderInfo.imgUrl"
38 mode="aspectFill"
39 ></image>
40 <view class="infoText">
41 <view class="orderName">{{orderInfo.p_name}}</view>
42 <view class="orderDescrib">{{orderInfo.p_name}}</view>
43 <view class="infoText-bottom">
44 <view class="markPrice">{{orderInfo.nowPrice}}</view>
45 <view class="buy-num">X {{orderInfo.num}}</view>
46 </view>
47 </view>
48 </view>
49 <view class="payPrice">实付：<text class="priceNum">{{order.total_fee}}</text> </view>
50 <!-- 0待付款 1 已付款 待收货 2 已收货待评价 3 已评价 -->
51 <view
52 class="btns"
53 v-if="status == '0'"
54 >
55 <view class="btn-type1">取消订单</view>
56 <view class="btn-type2">去支付</view>
57 </view>
58 <view
59 class="btns"
60 v-if="status == '1'"
61 >
62 <view class="btn-type2">确认收货</view>
63 </view>
64 <view
65 class="btns"
66 v-if="status == '2'"
67 >
68 <view class="btn-type2">再次购买</view>
69 </view>
70 <!-- <view class="btns" v-if="status == '3'">
36 <view class="btn-type2">再次购买</view> 71 <view class="btn-type2">再次购买</view>
37 </view> --> 72 </view> -->
38 </view> 73 </view>
39 <view class="card" v-if="current == '10'" @click="toOrderInfo(status,order.pay_id)"> 74 <view class="card" v-if="current == '10'" @click="toOrderInfo(status,order.pay_id)">
40 <view class="cardHeader"> 75 <view class="cardHeader">
41 <text class="orderId" v-if="status == '0'||status == '1'">订单号：{{order.mch_id}}</text> 76 <text class="orderId" v-if="status == '0'||status == '1'">订单号：{{order.mch_id}}</text>
42 <text class="orderId" v-if="status == '2'||status == '3'">下单时间：{{order.pay_time}}</text> 77 <text class="orderId" v-if="status == '2'||status == '3'">下单时间：{{order.pay_time}}</text>
43 <text class="orderType" v-if="status=='0'">待付款</text> 78 <text class="orderType" v-if="status=='0'">待付款</text>
44 <text class="orderType" v-if="status=='1'">待收货</text> 79 <text class="orderType" v-if="status=='1'">待收货</text>
45 <text class="orderType" v-if="status == '2'||status == '3'">已完成</text> 80 <text class="orderType" v-if="status == '2'||status == '3'">已完成</text>
46 <!-- <text class="orderType" v-if="status == '3'">已评价</text> --> 81 <!-- <text class="orderType" v-if="status == '3'">已评价</text> -->
47 </view> 82 </view>
48 <view class="orderCardInfo" v-for="(orderInfo) in orderInfoList.list" :key="orderInfo"> 83 <view class="orderCardInfo" v-for="(orderInfo) in orderInfoList.list" :key="orderInfo">
49 <image :src="orderInfo.imgUrl" mode="aspectFill"></image> 84 <image :src="orderInfo.imgUrl" mode="aspectFill"></image>
50 <view class="infoText"> 85 <view class="infoText">
51 <view class="orderName">{{orderInfo.p_name}}</view> 86 <view class="orderName">{{orderInfo.p_name}}</view>
52 <view class="orderDescrib">{{orderInfo.p_name}}</view> 87 <view class="orderDescrib">{{orderInfo.p_name}}</view>
53 <view class="infoText-bottom"> 88 <view class="infoText-bottom">
54 <view class="markPrice">{{orderInfo.nowPrice}}</view> 89 <view class="markPrice">{{orderInfo.nowPrice}}</view>
55 <view class="buy-num">X {{orderInfo.num}}</view> 90 <view class="buy-num">X {{orderInfo.num}}</view>
56 </view> 91 </view>
57 </view> 92 </view>
58 </view> 93 </view>
59 <view class="payPrice">实付：<text class="priceNum">{{order.total_fee}}</text> </view> 94 <view class="payPrice">实付：<text class="priceNum">{{order.total_fee}}</text> </view>
60 <view class="btns" v-if="status == '0'"> 95 <view class="btns" v-if="status == '0'">
61 <view class="btn-type1" >取消订单</view> 96 <view class="btn-type1" >取消订单</view>
62 <view class="btn-type2">去支付</view> 97 <view class="btn-type2">去支付</view>
63 </view> 98 </view>
64 <view class="btns" v-if="status == '1'"> 99 <view class="btns" v-if="status == '1'">
65 <view class="btn-type2">确认收货</view> 100 <view class="btn-type2">确认收货</view>
66 </view> 101 </view>
67 <view class="btns" v-if="status == '2'||status == '3'"> 102 <view class="btns" v-if="status == '2'||status == '3'">
68 <view class="btn-type2">再次购买</view> 103 <view class="btn-type2">再次购买</view>
69 </view> 104 </view>
70 <!-- <view class="btns" v-if="status == '3'"> 105 <!-- <view class="btns" v-if="status == '3'">
106
107 <view class="btn-type2">再次购买</view>
108 </view> -->
109 </view>
110 </view>
111 </template>
112
113 <script>
114 export default {
115 props: {
116 /**
117 * 订单数据
118 */
119 order: {
120 // orderId: Number,
121 // img: String,
122 // name: String,
123 // originCost:String,
124 // price: String,
125 // orderType:Number,
126 // buyNum:Number,
127 finished_time: null,
128 is_refound: String,
129 mch_id: String,
130 money_of_dcw: String,
131 money_of_partner: String,
132 money_of_shop: String,
133 orderJudge: Boolean,
134 order_info: {
135 address:{
136 cityName: String,
137 countyName: String,
138 detailInfo: String,
139 errMsg: String,
140 nationalCode: String,
141 postalCode: String,
71 <view class="btn-type2">再次购买</view> 142 provinceName: String,
72 </view> --> 143 telNumber: String,
73 </view> 144 userName: String,
74 </view> 145 },
75 </template> 146 cartinfo: ["127"],
76 147 keyname: "330_1588911391",
77 <script> 148 lefttime: Number,
78 export default { 149 list:[
79 props: { 150 {
80 /** 151 cart_id: "127",
81 * 订单数据 152 imgUrl: String,
82 */ 153 img_index_url: null,
83 order: { 154 memo: String,
84 // orderId: Number, 155 mp_id: String,
85 // img: String, 156 nowPrice: String,
86 // name: String, 157 num: String,
87 // originCost:String, 158 oldPrice: Number,
88 // price: String, 159 p_discount: String,
89 // orderType:Number, 160 p_name: String,
90 // buyNum:Number, 161 p_root_index: String,
91 finished_time: null, 162 p_sale_price: String,
92 is_refound: String, 163 peopleName: String,
93 mch_id: String, 164 pics: ["79_0_D122D2.jpg","79_1_E0A1ED.jpg","79_2_B00B3D.jpg","79_3_B2CF21.jpg","79_4_33AD1B.jpg"],
94 money_of_dcw: String, 165 pid: String,
95 money_of_partner: String, 166 sk_id: String,
96 money_of_shop: String, 167 }
97 orderJudge: Boolean, 168 ],
98 order_info: { 169 orderDesc: String,
99 address:{ 170 total_fee: Number,
100 cityName: String, 171 },
101 countyName: String, 172 partner_uid: String,
102 detailInfo: String, 173 pay_cate: String,
103 errMsg: String, 174 pay_id: String,
104 nationalCode: String, 175 pay_time: String,
105 postalCode: String, 176 pay_wood_desc: String,
106 provinceName: String, 177 pay_wood_id: String,
107 telNumber: String, 178 prepay_id: String,
108 userName: String, 179 re_check_staus: String,
109 }, 180 shopid: String,
110 cartinfo: ["127"], 181 split_userid: String,
111 keyname: "330_1588911391", 182 status: String,
112 lefttime: Number, 183 // status0待付款 1已付款 待收货 2 已收货待评价 3 已评价
113 list:[ 184 total_fee: String,
114 { 185 uid: String,
115 cart_id: "127", 186 },
116 imgUrl: String, 187 /**
117 img_index_url: null, 188 * 当前选择
118 memo: String, 189 */
119 mp_id: String, 190 current:Number
120 nowPrice: String, 191
121 num: String, 192 },
122 oldPrice: Number, 193 created() {
123 p_discount: String, 194 console.log(this.order);
124 p_name: String, 195 // console.log(this.order.status );
125 p_root_index: String, 196 // console.log(this.current);
126 p_sale_price: String, 197 },
127 peopleName: String, 198 computed:{
128 pics: ["79_0_D122D2.jpg","79_1_E0A1ED.jpg","79_2_B00B3D.jpg","79_3_B2CF21.jpg","79_4_33AD1B.jpg"], 199 status(){
129 pid: String, 200 return this.order.status
130 sk_id: String, 201 },
131 } 202 orderInfoList(){
132 ], 203 console.log('this.order.order_info', this.order)
133 orderDesc: String, 204 return this.order.order_info
134 total_fee: Number, 205 }
135 }, 206 },
136 partner_uid: String, 207 data() {
137 pay_cate: String, 208 return {
138 pay_id: String, 209 };
139 pay_time: String, 210 },
140 pay_wood_desc: String, 211 methods:{
141 pay_wood_id: String, 212 toRefundment(){
142 prepay_id: String, 213 uni.navigateTo({
143 re_check_staus: String, 214 url: '../refundment/refundment',
144 shopid: String, 215 success: res => {},
145 split_userid: String, 216 fail: () => {},
146 status: String, 217 complete: () => {}
147 // status0待付款 1已付款 待收货 2 已收货待评价 3 已评价 218 });
148 total_fee: String, 219 },
149 uid: String, 220 toOrderInfo(status,payId){
150 }, 221 console.log(status,payId)
151 /** 222 switch(status){
152 * 当前选择 223 // 0待付款 1待收货 2已收货 3 已评价
153 */ 224 case '0':
154 current:Number 225 uni.navigateTo({
155 226 url:`../myOrderPaying/myOrderPaying?status=`+status+`&payId=`+payId,
156 }, 227 fail(errMsg) {
157 created() { 228 console.log(errMsg)
158 console.log(this.order); 229 }
159 // console.log(this.order.status ); 230 })
160 // console.log(this.current); 231 break;
161 }, 232 case '1':
162 computed:{ 233 uni.navigateTo({
163 status(){ 234 url:`../myOrderPaying/myOrderPaying?status=`+status+`&payId=`+payId,
164 return this.order.status 235 fail(errMsg) {
165 }, 236 console.log(errMsg)
166 orderInfoList(){ 237 }
167 console.log('this.order.order_info', this.order) 238 })
168 return this.order.order_info 239
169 } 240 break;
170 }, 241 case '2 || 3':
171 data() { 242 uni.navigateTo({
172 return { 243 url:`../myOrderPaying/myOrderPaying?status=`+status+`&payId=`+payId,
173 }; 244 fail(errMsg) {
174 }, 245 console.log(errMsg)
175 methods:{ 246 }
176 toRefundment(){ 247 })
177 uni.navigateTo({ 248 break;
178 url: '../refundment/refundment', 249 default:
179 success: res => {}, 250 break;
180 fail: () => {}, 251
181 complete: () => {} 252 }
182 }); 253 }
183 }, 254 }
184 toOrderInfo(status,payId){ 255 }
185 console.log(status,payId) 256
186 switch(status){ 257 </script>
187 // 0待付款 1待收货 2已收货 3 已评价 258
188 case '0': 259 <style lang="scss">
189 uni.navigateTo({ 260 .card {
190 url:`../myOrderPaying/myOrderPaying?status=`+status+`&payId=`+payId, 261 width: 670rpx;
191 fail(errMsg) { 262 height: 478rpx;
192 console.log(errMsg) 263 background: #ffffff;
193 } 264 box-shadow: 0 0 10px 0 rgba(177, 128, 128, 0.06);
194 }) 265 border-radius: 8px;
195 break; 266 border-radius: 8px;
196 case '1': 267 margin-top: 20rpx;
197 uni.navigateTo({ 268 padding: 40rpx;
198 url:`../myOrderPaying/myOrderPaying?status=`+status+`&payId=`+payId, 269 box-sizing: border-box;
199 fail(errMsg) { 270 .cardHeader {
200 console.log(errMsg) 271 width: 100%;
201 } 272 height: 40rpx;
202 }) 273 display: flex;
203 274 justify-content: space-between;
204 break; 275 align-items: center;
205 case '2 || 3': 276 .orderId {
206 uni.navigateTo({ 277 font-size: 12px;
207 url:`../myOrderPaying/myOrderPaying?status=`+status+`&payId=`+payId, 278 color: #999999;
208 fail(errMsg) { 279 }
209 console.log(errMsg) 280 .orderType {
210 } 281 font-size: 14px;
211 }) 282 color: #ff6b4a;
212 break; 283 }
213 default: 284 }
214 break; 285 .orderCardInfo {
215 286 width: 100%;
216 } 287 height: 188rpx;
217 } 288 display: flex;
218 } 289 flex-direction: row;
219 } 290 justify-content: space-between;
291 align-items: center;
292 margin-top: 40rpx;
293 image {
294 height: 188rpx;
295 width: 188rpx;
296 margin-right: 24rpx;
297 }
298 .infoText {
299 display: flex;
300 flex-direction: column;
301 justify-content: space-between;
302 align-items: flex-start;
303 height: 188rpx;
304 width: 368rpx;
305 }
220 </script> 306 .orderName {
221 307 font-size: 14px;
222 <style lang="scss"> 308 color: #333333;
223 .card{ 309 display: -webkit-box;
224 width: 670rpx; 310 overflow: hidden;
225 height: 478rpx; 311 -webkit-box-orient: vertical;
226 background: #FFFFFF; 312 -webkit-line-clamp: 2;
227 box-shadow: 0 0 10px 0 rgba(177,128,128,0.06); 313 }
228 border-radius: 8px; 314 .orderDescrib {
229 border-radius: 8px; 315 font-size: 12px;
230 margin-top: 20rpx; 316 color: #999999;
231 padding: 40rpx; 317 display: -webkit-box;
232 box-sizing: border-box; 318 overflow: hidden;
233 .cardHeader{ 319 -webkit-box-orient: vertical;
234 width: 100%; 320 -webkit-line-clamp: 2;
235 height: 40rpx; 321 }
236 display: flex; 322 .infoText-bottom {
237 justify-content: space-between; 323 display: flex;
238 align-items: center; 324 flex-direction: row;
239 .orderId{ 325 justify-content: flex-start;
240 font-size: 12px; 326 align-items: center;
241 color: #999999; 327 width: 100%;
242 } 328 .markPrice {
243 .orderType{ 329 font-size: 14px;
244 font-size: 14px; 330 color: #ff6b4a;
245 color: #FF6B4A; 331 margin-right: 20rpx;
246 } 332 }
247 } 333 .buy-num {
248 .orderCardInfo{ 334 font-size: 12px;
249 width: 100%; 335 color: #999999;
250 height: 188rpx; 336 }
251 display: flex; 337 }
252 flex-direction: row; 338 }
253 justify-content: space-between; 339 .payPrice {
254 align-items: center; 340 text-align: right;
255 margin-top: 40rpx; 341 margin: 20rpx 0;
256 image{ 342 font-size: 14px;
257 height: 188rpx; 343 color: #333333;
258 width: 188rpx; 344 .priceNum {
259 margin-right: 24rpx; 345 font-size: 14px;
260 } 346 color: #ff6b4a;
261 .infoText{ 347 }
262 display: flex; 348 }
263 flex-direction: column; 349 .btns {
264 justify-content: space-between; 350 display: flex;
265 align-items: flex-start; 351 justify-content: flex-end;
266 height: 188rpx; 352 align-items: center;
267 width: 368rpx; 353 .btn-type1 {
268 } 354 height: 48rpx;
269 .orderName{ 355 width: 156rpx;
270 font-size: 14px; 356 border: 1px solid #ff6b4a;
271 color: #333333; 357 border-radius: 12px;
272 display: -webkit-box; 358 border-radius: 12px;
273 overflow: hidden; 359 text-align: center;
274 -webkit-box-orient: vertical; 360 line-height: 48rpx;
275 -webkit-line-clamp: 2; 361 font-size: 12px;
276 } 362 color: #ff6b4a;
277 .orderDescrib{ 363 }
278 font-size: 12px; 364 .btn-type2 {
279 color: #999999; 365 height: 48rpx;
280 display: -webkit-box; 366 width: 140rpx;
281 overflow: hidden; 367 background: #ff6b4a;
282 -webkit-box-orient: vertical; 368 border-radius: 12px;
283 -webkit-line-clamp: 2; 369 border-radius: 12px;
284 } 370 text-align: center;
285 .infoText-bottom{ 371 line-height: 48rpx;
286 display: flex; 372 font-size: 12px;
287 flex-direction: row; 373 color: #ffffff;
288 justify-content: flex-start; 374 margin-left: 20rpx;
289 align-items: center; 375 }
290 width: 100%; 376 }
291 .markPrice{ 377 }
292 font-size: 14px; 378 </style>
293 color: #FF6B4A; 379
src/pages/myOrder/myOrder.vue
Diff comments   View file @54c9be5
1 <template> 1 <template>
2 <view class="content"> 2 <view class="content">
3 <view class="header"> 3 <view class="header">
4 <!-- 搜索--> 4 <!-- 搜索-->
5 <!-- <view class="searchBar"> 5 <!-- <view class="searchBar">
6 <icon class="searchIcon" type="search" size="14"></icon> 6 <icon class="searchIcon" type="search" size="14"></icon>
7 <input class="searchIpt" placeholder="搜索订单关键字..." confirm-type="search"/> 7 <input class="searchIpt" placeholder="搜索订单关键字..." confirm-type="search"/>
8 </view> --> 8 </view> -->
9 <view class="screenBar"> 9 <view class="screenBar">
10 <view 10 <view
11 v-for="item in screenItems" 11 v-for="item in screenItems"
12 :key="item.current" 12 :key="item.current"
13 @click="onClickItem(item.current)" 13 @click="onClickItem(item.current)"
14 > 14 >
15 <view 15 <view
16 class="screenItem" 16 class="screenItem"
17 v-bind:class="{ active: current === item.current }" 17 v-bind:class="{ active: current === item.current }"
18 >{{ item.text }}</view> 18 >{{ item.text }}</view>
19 </view> 19 </view>
20 </view> 20 </view>
21 </view> 21 </view>
22 <view class="orderList"> 22 <view class="orderList">
23 <view 23 <view
24 v-for="(order) in orderList" 24 v-for="(order) in orderList"
25 :key="order.orderId" 25 :key="order.pay_id"
26 > 26 >
27 <OrderCard 27 <OrderCard
28 :order="order" 28 :order="order"
29 :current="current" 29 :current="current"
30 ></OrderCard> 30 ></OrderCard>
31 </view> 31 </view>
32 </view> 32 </view>
33 <view class="footer">没有更多订单了，去商城看看吧~</view> 33 <view class="footer">没有更多订单了，去商城看看吧~</view>
34 </view> 34 </view>
35 </template> 35 </template>
36 <script> 36 <script>
37 import OrderCard from './components/OrderCard.vue' 37 import OrderCard from "./components/OrderCard.vue";
38 import store from '@/store' 38 import store from "@/store";
39 39
40 export default { 40 export default {
41 components: { 41 components: {
42 OrderCard: OrderCard, 42 OrderCard: OrderCard
43 }, 43 },
44 data() { 44 data() {
45 return { 45 return {
46 // 顶部筛选项 46 // 顶部筛选项
47 screenItems: [ 47 screenItems: [
48 { current: '10', text: '全部' }, 48 { current: "10", text: "全部" },
49 { current: '0', text: '待付款' }, 49 { current: "0", text: "待付款" },
50 { current: '1', text: '待收货' }, 50 { current: "1", text: "待收货" },
51 { current: '2', text: '已完成' }, 51 { current: "2", text: "待评价" }
52 // {current:"3",text:'已评价'}, 52 // {current:"3",text:'已评价'},
53 // {current:"4",text:'退款'}, 53 // {current:"4",text:'退款'},
54 ], 54 ],
55 // 当前所在item 默认10-->全部 55 // 当前所在item 默认10-->全部
56 current: '10', 56 current: "10"
57 } 57 };
58 }, 58 },
59 59
60 onLoad: function(option) { 60 onLoad: function(option) {
61 // 获取订单列表 61 // 获取订单列表
62 store.dispatch('myOrder/getList', { 62 store.dispatch("myOrder/getList", {
63 way: '', 63 way: ""
64 }) 64 });
65 // 从user过来传的status，给current，以显示对应item 65 // 从user过来传的status，给current，以显示对应item
66 this.current = option.status 66 this.current = option.status;
67 }, 67 },
68 computed: { 68 computed: {
69 orderList() { 69 orderList() {
70 console.log('orderList', this.$store.state.myOrder.orderList); 70 // console.log('orderList', this.$store.state.myOrder.orderList);
71 return this.$store.state.myOrder.orderList 71 return this.$store.state.myOrder.orderList;
72 }, 72 }
73 }, 73 },
74 methods: { 74 methods: {
75 // tab点击事件 75 // tab点击事件
76 onClickItem(e) { 76 onClickItem(e) {
77 console.log("onClickItem", e);
77 if (this.current !== e) { 78 if (this.current !== e) {
78 this.current = e 79 this.current = e;
79 } 80 }
80 }, 81 }
81 82 }
82 }, 83 };
83 }
84 </script> 84 </script>
85 85
86 <style lang="scss"> 86 <style lang="scss">
87 .content { 87 .content {
88 display: flex; 88 display: flex;
89 flex-direction: column; 89 flex-direction: column;
90 align-items: center; 90 align-items: center;
91 background-color: #f7f6f6; 91 background-color: #f7f6f6;
92 min-height: 100vh; 92 min-height: 100vh;
93 .header { 93 .header {
94 background-color: #ffffff; 94 background-color: #ffffff;
95 width: 100%; 95 width: 100%;
96 // height: 232rpx; 96 // height: 232rpx;
97 padding: 20rpx 40rpx 16rpx 40rpx; 97 padding: 20rpx 40rpx 16rpx 40rpx;
98 box-sizing: border-box; 98 box-sizing: border-box;
99 position: fixed; 99 position: fixed;
100 top: 0; 100 top: 0;
101 left: 0; 101 left: 0;
102 // .searchBar { 102 // .searchBar {
103 // width: 670rpx; 103 // width: 670rpx;
104 // display: flex; 104 // display: flex;
105 // justify-content: center; 105 // justify-content: center;
106 // align-items: center; 106 // align-items: center;
107 // box-sizing: border-box; 107 // box-sizing: border-box;
108 // padding: 0rpx 16rpx; 108 // padding: 0rpx 16rpx;
109 // border: 1px solid #ff6b4a; 109 // border: 1px solid #ff6b4a;
110 // border-radius: 8rpx; 110 // border-radius: 8rpx;
111 // background-color: #ffffff; 111 // background-color: #ffffff;
112 // } 112 // }
113 113
114 .screenBar { 114 .screenBar {
115 width: 670rpx; 115 width: 670rpx;
116 // height: 110rpx; 116 // height: 110rpx;
117 height: 70rpx; 117 height: 70rpx;
118 display: flex; 118 display: flex;
119 flex-direction: row; 119 flex-direction: row;
120 justify-content: space-between; 120 justify-content: space-between;
121 align-items: center; 121 align-items: center;
122 color: #333333; 122 color: #333333;
123 font-size: 32rpx; 123 font-size: 32rpx;
124 } 124 }
125 .screenItem { 125 .screenItem {
126 height: 50rpx; 126 height: 50rpx;
127 font-size: 32rpx; 127 font-size: 32rpx;
128 color: #333333; 128 color: #333333;
129 display: flex; 129 display: flex;
130 justify-content: center; 130 justify-content: center;
131 align-items: center; 131 align-items: center;
132 transition: all 0.2s; 132 transition: all 0.2s;
133 } 133 }
134 .active { 134 .active {
135 // font-size: 34rpx; 135 // font-size: 34rpx;
136 color: #ec5d3b; 136 color: #ec5d3b;
137 } 137 }
138 .searchIpt { 138 .searchIpt {
139 height: 68rpx; 139 height: 68rpx;
140 width: 670rpx; 140 width: 670rpx;
141 padding: 16rpx; 141 padding: 16rpx;
142 font-size: 28rpx; 142 font-size: 28rpx;
143 box-sizing: border-box; 143 box-sizing: border-box;
144 } 144 }
145 } 145 }
146 .orderList { 146 .orderList {
147 // margin-top: 232rpx; 147 // margin-top: 232rpx;
148 margin-top: 132rpx; 148 margin-top: 132rpx;
149 } 149 }
150 .footer { 150 .footer {
151 font-size: 14px; 151 font-size: 14px;
152 color: #b8b8b8; 152 color: #b8b8b8;
153 margin: 40rpx 0; 153 margin: 40rpx 0;
154 } 154 }
155 } 155 }
156 </style> 156 </style>
src/pages/myOrderPaying/myOrderPaying.vue
Diff comments   View file @54c9be5
1 <!-- 订单待付款 待收货 --> 1 <!-- 订单待付款 待收货 -->
2 <template> 2 <template>
3 <view class="content"> 3 <view class="content">
4 <!-- 待付款 --> 4 <!-- 待付款 -->
5 <view 5 <view
6 class="order-time" 6 class="order-time"
7 v-if="status == '0'" 7 v-if="status == '0'"
8 > 8 >
9 <text>请在</text> 9 <text>请在</text>
10 <uni-countdown 10 <uni-countdown
11 color="#EC5D3B" 11 color="#EC5D3B"
12 splitor-color="#EC5D3B" 12 splitor-color="#EC5D3B"
13 :show-day="false" 13 :show-day="false"
14 :hour="0" 14 :hour="0"
15 :second="getTime" 15 :second="getTime"
16 @timeup=timeup 16 @timeup=timeup
17 ></uni-countdown> 17 ></uni-countdown>
18 <text>内完成付款</text> 18 <text>内完成付款</text>
19 </view> 19 </view>
20 <!-- 待收货 --> 20 <!-- 待收货 -->
21 <view 21 <view
22 class="headerBanner" 22 class="headerBanner"
23 v-if="status == '1'" 23 v-if="status == '1'"
24 > 24 >
25 <view class="bannerLeft"> 25 <view class="bannerLeft">
26 <view class="T1">卖家已发货</view> 26 <view class="T1">卖家已发货</view>
27 <view class="T2">还剩 确认收货</view> 27 <view class="T2">还剩 确认收货</view>
28 </view> 28 </view>
29 <image 29 <image
30 src="../../static/car.png" 30 src="../../static/car.png"
31 mode="aspectFill" 31 mode="aspectFill"
32 ></image> 32 ></image>
33 </view> 33 </view>
34 <view class="order"> 34 <view class="order">
35 <view class="order-user"> 35 <view class="order-user">
36 <view class="order-user-head"> 36 <view class="order-user-head">
37 <text class="p1">{{orderAddressInfo.userName}}</text> 37 <text class="p1">{{orderAddressInfo.userName}}</text>
38 <text class="p2">{{orderAddressInfo.telNumber}}</text> 38 <text class="p2">{{orderAddressInfo.telNumber}}</text>
39 </view> 39 </view>
40 <view class="order-user-body"> 40 <view class="order-user-body">
41 <image src="../../static/myorder-paying-location.png"></image> 41 <image src="../../static/myorder-paying-location.png"></image>
42 <text class="p3">{{orderAddressInfo.provinceName}} {{orderAddressInfo.cityName}} {{orderAddressInfo.countyName}}\n{{orderAddressInfo.detailInfo}}</text> 42 <text class="p3">{{orderAddressInfo.provinceName}} {{orderAddressInfo.cityName}} {{orderAddressInfo.countyName}}\n{{orderAddressInfo.detailInfo}}</text>
43 </view> 43 </view>
44 </view> 44 </view>
45 <view class="order-info"> 45 <view class="order-info">
46 <view 46 <view
47 class="order-info-head" 47 class="order-info-head"
48 v-for="(orderInfoListItem,index) in orderInfoList" 48 v-for="(orderInfoListItem,index) in orderInfoList"
49 :key="index" 49 :key="index"
50 > 50 >
51 <image 51 <image
52 :src="orderInfoListItem.imgUrl" 52 :src="orderInfoListItem.imgUrl"
53 mode="aspectFill" 53 mode="aspectFill"
54 ></image> 54 ></image>
55 <view class="order-info-head-r"> 55 <view class="order-info-head-r">
56 <text class="p1">{{orderInfoListItem.p_name}}</text> 56 <text class="p1">{{orderInfoListItem.p_name}}</text>
57 <view 57 <view
58 class="p2" 58 class="p2"
59 style="margin: 0;" 59 style="margin: 0;"
60 > 60 >
61 规格：玫瑰金 / 钛合金 / 防日光防紫外线 / 超薄超轻 61 规格：玫瑰金 / 钛合金 / 防日光防紫外线 / 超薄超轻
62 <!-- <view class="arrow"></view> --> 62 <!-- <view class="arrow"></view> -->
63 </view> 63 </view>
64 <view class="infoText-bottom"> 64 <view class="infoText-bottom">
65 <view class="markPrice">{{orderInfoListItem.nowPrice}}</view> 65 <view class="markPrice">{{orderInfoListItem.nowPrice}}</view>
66 <view class="buy-num">X {{orderInfoListItem.num}}</view> 66 <view class="buy-num">X {{orderInfoListItem.num}}</view>
67 </view> 67 </view>
68 </view> 68 </view>
69 </view> 69 </view>
70 <!-- <view class="order-info-goodsnum"> 70 <!-- <view class="order-info-goodsnum">
71 <text>X1</text> 71 <text>X1</text>
72 </view> --> 72 </view> -->
73 <text class="order-info-freight"> 73 <text class="order-info-freight">
74 <text class="p1">运费</text> 74 <text class="p1">运费</text>
75 <text class="p2">免运费</text> 75 <text class="p2">免运费</text>
76 </text> 76 </text>
77 <text class="order-info-discount"> 77 <text class="order-info-discount">
78 <text class="p1">优惠</text> 78 <text class="p1">优惠</text>
79 <text class="p2">-￥{{totalDiscount}}</text> 79 <text class="p2">-￥{{totalDiscount}}</text>
80 </text> 80 </text>
81 <text class="order-info-price"> 81 <text class="order-info-price">
82 <text class="p1">实付</text> 82 <text class="p1">实付</text>
83 <text class="p2">￥{{orderInfo.order_info.total_fee}}</text> 83 <text class="p2">￥{{orderInfo.order_info.total_fee}}</text>
84 </text> 84
85 <text class="order-info-num"> 85 </text>
86 <text>订单号：{{payId}}</text> 86 <text class="order-info-num">
87 </text> 87 <text>订单号：{{payId}}</text>
88 <text class="order-info-time"> 88 </text>
89 <text>下单时间：{{orderInfo.order_info.pay_time | timerChange}}</text> 89 <text class="order-info-time">
90 </text> 90 <text>下单时间：{{orderInfo.order_info.pay_time | timerChange}}</text>
91 <view class="order-info-hr"></view> 91
92 <view class="order-info-contact"> 92 </text>
93 <image src="../../static/myorder-paying-contact.png"></image> 93 <view class="order-info-hr"></view>
94 <text>联系客服</text> 94 <view class="order-info-contact">
95 </view> 95 <image src="../../static/myorder-paying-contact.png"></image>
96 </view> 96 <text>联系客服</text>
97 </view> 97 </view>
98 <view 98 </view>
99 class="order-confim" 99 </view>
100 v-if="status == '0'" 100 <view
101 > 101 class="order-confim"
102 <button 102 v-if="status == '0'"
103 class="b1" 103 >
104 @click="cancleOrder" 104 <button
105 >取消订单</button> 105 class="b1"
106 <button 106 @click="cancleOrder"
107 class="b2" 107 >取消订单</button>
108 @click="paylog" 108 <button
109 >立即支付</button> 109 class="b2"
110 </view> 110 @click="paylog"
111 111 >立即支付</button>
112 <view 112 </view>
113 class="order-confim" 113
114 v-if="status == '1'" 114 <view
115 > 115 class="order-confim"
116 <!-- <button class="b1">取消订单</button> --> 116 v-if="status == '1'"
117 <button 117 >
118 class="b2" 118 <!-- <button class="b1">取消订单</button> -->
119 @click="confirmOrder" 119 <button
120 >确认收货</button> 120 class="b2"
121 </view> 121 @click="confirmOrder"
122 </view> 122 >确认收货</button>
123 </template> 123 </view>
124 124 </view>
125 <script> 125 </template>
126 import store from '@/store' 126
127 import UniCountdown from '../../components/UniCountdown/UniCountdown.vue' 127 <script>
128 export default { 128 import store from "@/store";
129 components: { 129 import UniCountdown from "../../components/UniCountdown/UniCountdown.vue";
130 UniCountdown, 130 export default {
131 }, 131 components: {
132 data () { 132 UniCountdown
133 return { 133 },
134 payId: '', 134 data() {
135 payTime: '', 135 return {
136 status: '', // status 0 待付款 1 已发货 136 payId: "",
137 uid: '', 137 payTime: "",
138 openid: '', 138 status: "", // status 0 待付款 1 已发货
139 lefttime: 0, 139 uid: "",
140 isPay: 0, 140 openid: "",
141 } 141 lefttime: 0,
142 }, 142 isPay: 0
143 onLoad: function ({payId,state,isPay}) { 143 };
144 console.log('++++++++++++++++++',payId,state,isPay) 144 },
145 this.payId = payId 145 onLoad: function ({payId,state,isPay}) {
146 this.status = state 146 console.log('++++++++++++++++++',payId,state,isPay)
147 this.isPay = isPay 147 this.payId = payId
148 const openid = uni.getStorageSync('openid') 148 this.status = state
149 const uid = this.$store.state.user.uid 149 this.isPay = isPay
150 this.uid = uid 150 const openid = uni.getStorageSync('openid')
151 this.openid = openid 151 const uid = this.$store.state.user.uid
152 store.dispatch('orderRead/getOrderInfo', { 152 this.uid = uid
153 pay_id: this.payId, 153 this.openid = openid
154 uid: '1', 154 store.dispatch('orderRead/getOrderInfo', {
155 openid: openid, 155 pay_id: this.payId,
156 }) 156 uid: "1",
157 // this.orderInfo = this.$store.state.orderRead.orderInfo 157 openid: openid
158 }, 158 });
159 // 若从支付页面跳转过来，返回直接返回到首页 159 // this.orderInfo = this.$store.state.orderRead.orderInfo
160 onBackPress(option) { 160 },
161 if (option.from === 'backbutton' && this.isPay) { 161 // 若从支付页面跳转过来，返回直接返回到首页
162 uni.switchTab({ 162 onBackPress(option) {
163 url: '/pages/index/index', 163 if (option.from === "backbutton" && this.isPay) {
164 }) 164 uni.switchTab({
165 return true // 阻止默认返回行为 165 url: "/pages/index/index"
166 } 166 });
167 }, 167 return true; // 阻止默认返回行为
168 computed: { 168 }
169 // 获取订单详细信息 169 },
170 orderInfo () { 170 computed: {
171 console.log('orderInfo', this.$store.state.orderRead.orderInfo) 171 // 获取订单详细信息
172 return this.$store.state.orderRead.orderInfo || {} 172 orderInfo() {
173 }, 173 console.log("orderInfo", this.$store.state.orderRead.orderInfo);
174 orderInfoList () { 174 return this.$store.state.orderRead.orderInfo || {};
175 const orderInfoList = this.$store.state.orderRead.orderInfo.order_info.list 175 },
176 return orderInfoList 176 orderInfoList () {
177 }, 177 const orderInfoList = this.$store.state.orderRead.orderInfo.order_info.list
178 // 获取订单地址信息 178 return orderInfoList
179 orderAddressInfo () { 179 },
180 return this.orderInfo.order_info.address 180 // 获取订单地址信息
181 }, 181 orderAddressInfo () {
182 // 订单付款时间 182 return this.orderInfo.order_info.address
183 getTime () { 183 },
184 return this.orderInfo.order_info.lefttime 184 // 订单付款时间
185 }, 185 getTime () {
186 // 计算总优惠额 186 return this.orderInfo.order_info.lefttime
187 totalDiscount () { 187
188 const discountInfoList = this.orderInfo.discount_info 188 },
189 let totalDiscount = 0 189 // 计算总优惠额
190 if (discountInfoList) { 190 totalDiscount() {
191 discountInfoList.map((discountItem, index) => { 191 const discountInfoList = this.orderInfo.discount_info;
192 totalDiscount += Number(discountItem.value) 192 let totalDiscount = 0;
193 }) 193 if (discountInfoList) {
194 } 194 discountInfoList.map((discountItem, index) => {
195 // console.log(totalDiscount) 195 totalDiscount += Number(discountItem.value);
196 return totalDiscount 196 });
197 }, 197 }
198 }, 198 // console.log(totalDiscount)
199 methods: { 199 return totalDiscount;
200 // 取消订单 200 }
201 timeup () { 201 },
202 this.cancleOrder() 202 methods: {
203 }, 203 // 取消订单
204 cancleOrder () { 204 timeup() {
205 const uid = this.uid 205 this.cancleOrder();
206 const openid = this.openid 206 },
207 uni.showModal({ 207 cancleOrder() {
208 title: '提示', 208 const uid = this.uid;
209 content: '现在取消，订单不可恢复哦，确认取消吗？', 209 const openid = this.openid;
210 success: function (res) { 210 uni.showModal({
211 if (res.confirm) { 211 title: "提示",
212 store.dispatch('cancelOrder/cancel', { 212 content: "现在取消，订单不可恢复哦，确认取消吗？",
213 keyname: '1', 213 success: function(res) {
214 uid: uid, 214 if (res.confirm) {
215 openid: openid, 215 store.dispatch("cancelOrder/cancel", {
216 }) 216 keyname: "1",
217 } else if (res.cancel) { 217 uid: uid,
218 console.log('用户点击取消') 218 openid: openid
219 } 219 });
220 }, 220 } else if (res.cancel) {
221 }) 221 console.log("用户点击取消");
222 },
223 paylog () {
224
225 },
226 confirmOrder () {
227 store.dispatch('statusConfirm/confirm', {
228 uid: this.uid,
229 openid: this.openid,
230 oldway: '1',
231 way: '2',
232 pay_id: this.payId,
233 judgeContent: '',
234 orderInfo: this.orderInfo.order_info,
235 }).then(
236 setTimeout(() => {
237 uni.navigateBack()
238 }, 1500),
239 )
240 }, 222 }
223 }
224 });
225 },
226 paylog() {},
227 confirmOrder() {
228 store
229 .dispatch("statusConfirm/confirm", {
230 uid: this.uid,
231 openid: this.openid,
232 oldway: "1",
233 way: "2",
234 pay_id: this.payId,
235 judgeContent: "",
236 orderInfo: this.orderInfo.order_info
237 })
238 .then(
239 setTimeout(() => {
240 uni.navigateBack();
241 }, 241 }, 1500)
242 filters: { 242 );
243 timerChange: function(value) { 243 }
244 var newDate = new Date() 244 },
245 newDate.setTime(value * 1000) 245 filters: {
246 return newDate.toLocaleString() 246 timerChange: function(value) {
247 }, 247 var newDate = new Date();
248 }, 248 newDate.setTime(value * 1000);
249 } 249 return newDate.toLocaleString();
250 </script> 250 }
251 251 }
252 <style lang="scss" scoped> 252 };
253 .content { 253 </script>
254 min-height: 100vh; 254
255 display: flex; 255 <style lang="scss" scoped>
256 flex-direction: column; 256 .content {
257 justify-content: flex-start; 257 min-height: 100vh;
258 align-items: center; 258 display: flex;
259 background-color: #f2f2f2; 259 flex-direction: column;
260 } 260 justify-content: flex-start;
261 261 align-items: center;
262 .order { 262 background-color: #f2f2f2;
263 margin-bottom: 112rpx; 263 }
264 background: #f2f2f2; 264
265 margin-top: 140rpx; 265 .order {
266 width: 670rpx; 266 margin-bottom: 112rpx;
267 } 267 background: #f2f2f2;
268 268 margin-top: 140rpx;
269 .order-time { 269 width: 670rpx;
270 width: 100%; 270 }
271 height: 140rpx; 271
272 background-color: #fff; 272 .order-time {
273 display: flex; 273 width: 100%;
274 justify-content: center; 274 height: 140rpx;
275 align-items: center; 275 background-color: #fff;
276 position: fixed; 276 display: flex;
277 top: 0; 277 justify-content: center;
278 left: 0; 278 align-items: center;
279 text { 279 position: fixed;
280 // font-family: PingFangSC-Regular; 280 top: 0;
281 // margin-top: 48rpx; 281 left: 0;
282 font-size: 14px; 282 text {
283 color: #333333; 283 // font-family: PingFangSC-Regular;
284 letter-spacing: -0.26px; 284 // margin-top: 48rpx;
285 } 285 font-size: 14px;
286 .p2 { 286 color: #333333;
287 // font-family: DINAlternate-Bold; 287 letter-spacing: -0.26px;
288 margin: 42rpx 20rpx 0 20rpx; 288 }
289 font-size: 18px; 289 .p2 {
290 color: #ec5d3b; 290 // font-family: DINAlternate-Bold;
291 letter-spacing: -0.34px; 291 margin: 42rpx 20rpx 0 20rpx;
292 } 292 font-size: 18px;
293 } 293 color: #ec5d3b;
294 .headerBanner { 294 letter-spacing: -0.34px;
295 width: 100%; 295 }
296 height: 140rpx; 296 }
297 background: #4a90e2; 297 .headerBanner {
298 padding: 26rpx 60rpx 24rpx 60rpx; 298 width: 100%;
299 box-sizing: border-box; 299 height: 140rpx;
300 color: #ffffff; 300 background: #4a90e2;
301 display: flex; 301 padding: 26rpx 60rpx 24rpx 60rpx;
302 justify-content: space-between; 302 box-sizing: border-box;
303 align-items: center; 303 color: #ffffff;
304 position: fixed; 304 display: flex;
305 top: 0; 305 justify-content: space-between;
306 left: 0; 306 align-items: center;
307 .bannerLeft { 307 position: fixed;
308 font-size: 36rpx; 308 top: 0;
309 display: flex; 309 left: 0;
310 flex-direction: column; 310 .bannerLeft {
311 justify-content: center; 311 font-size: 36rpx;
312 align-items: center; 312 display: flex;
313 .T2 { 313 flex-direction: column;
314 font-size: 24rpx; 314 justify-content: center;
315 } 315 align-items: center;
316 } 316 .T2 {
317 image { 317 font-size: 24rpx;
318 height: 56rpx; 318 }
319 width: 72rpx; 319 }
320 } 320 image {
321 } 321 height: 56rpx;
322 322 width: 72rpx;
323 .order-user { 323 }
324 height: 228rpx; 324 }
325 background: #ffffff; 325
326 border-radius: 14rpx; 326 .order-user {
327 margin: 0 auto; 327 height: 228rpx;
328 margin-top: 20rpx; 328 background: #ffffff;
329 margin-bottom: 20rpx; 329 border-radius: 14rpx;
330 .order-user-head { 330 margin: 0 auto;
331 display: flex; 331 margin-top: 20rpx;
332 height: 108rpx; 332 margin-bottom: 20rpx;
333 align-items: center; 333 .order-user-head {
334 margin-left: 126rpx; 334 display: flex;
335 .p1 { 335 height: 108rpx;
336 // font-family: PingFangSC-Regular; 336 align-items: center;
337 font-size: 14px; 337 margin-left: 126rpx;
338 color: #333333; 338 .p1 {
339 letter-spacing: -0.26px; 339 // font-family: PingFangSC-Regular;
340 margin-right: 20rpx; 340 font-size: 14px;
341 } 341 color: #333333;
342 .p2 { 342 letter-spacing: -0.26px;
343 // font-family: PingFangSC-Regular; 343 margin-right: 20rpx;
344 font-size: 14px; 344 }
345 color: #999999; 345 .p2 {
346 letter-spacing: -0.26px; 346 // font-family: PingFangSC-Regular;
347 } 347 font-size: 14px;
348 } 348 color: #999999;
349 .order-user-body { 349 letter-spacing: -0.26px;
350 display: flex; 350 }
351 width: 100%; 351 }
352 image { 352 .order-user-body {
353 width: 24px; 353 display: flex;
354 height: 26px; 354 width: 100%;
355 margin: 12rpx 32rpx 0 40rpx; 355 image {
356 } 356 width: 24px;
357 .p3 { 357 height: 26px;
358 // font-family: PingFangSC-Semibold; 358 margin: 12rpx 32rpx 0 40rpx;
359 font-size: 14px; 359 }
360 color: #333333; 360 .p3 {
361 letter-spacing: -0.26px; 361 // font-family: PingFangSC-Semibold;
362 } 362 font-size: 14px;
363 } 363 color: #333333;
364 } 364 letter-spacing: -0.26px;
365 365 }
366 .order-info { 366 }
367 background-color: #fff; 367 }
368 box-shadow: 0 0 20rpx 0 rgba(177, 128, 128, 0.06); 368
369 border-radius: 16rpx; 369 .order-info {
370 margin: 0 auto; 370 background-color: #fff;
371 view { 371 box-shadow: 0 0 20rpx 0 rgba(177, 128, 128, 0.06);
372 margin-left: 40rpx; 372 border-radius: 16rpx;
373 } 373 margin: 0 auto;
374 text { 374 view {
375 font-size: 14px; 375 margin-left: 40rpx;
376 } 376 }
377 .order-info-head { 377 text {
378 display: flex; 378 font-size: 14px;
379 padding-top: 40rpx; 379 }
380 image { 380 .order-info-head {
381 height: 188rpx; 381 display: flex;
382 width: 188rpx; 382 padding-top: 40rpx;
383 } 383 image {
384 .order-info-head-r { 384 height: 188rpx;
385 margin: 0; 385 width: 188rpx;
386 width: 368rpx; 386 }
387 margin-left: 24rpx; 387 .order-info-head-r {
388 // margin-top: 40rpx; 388 margin: 0;
389 text { 389 width: 368rpx;
390 display: block; 390 margin-left: 24rpx;
391 } 391 // margin-top: 40rpx;
392 // .arrow{ 392 text {
393 // width: 0; 393 display: block;
394 // height: 0; 394 }
395 // border-left: 5px transparent; 395 // .arrow{
396 // border-right: 5px transparent; 396 // width: 0;
397 // border-top: 5px #979797; 397 // height: 0;
398 // border-bottom: 0 transparent; 398 // border-left: 5px transparent;
399 // border-style: solid; 399 // border-right: 5px transparent;
400 // position: relative; 400 // border-top: 5px #979797;
401 // // transform: scaleY(-1); 401 // border-bottom: 0 transparent;
402 // } 402 // border-style: solid;
403 // .arrow::after{ 403 // position: relative;
404 // content: ''; 404 // // transform: scaleY(-1);
405 // position: absolute; 405 // }
406 // top: -6.5px; 406 // .arrow::after{
407 // left: -5px; 407 // content: '';
408 // border-left: 5px transparent; 408 // position: absolute;
409 // border-right: 5px transparent; 409 // top: -6.5px;
410 // border-top: 5px #FFFFFF; 410 // left: -5px;
411 // border-bottom: 0 transparent; 411 // border-left: 5px transparent;
412 // border-style: solid; 412 // border-right: 5px transparent;
413 // } 413 // border-top: 5px #FFFFFF;
414 .p1 { 414 // border-bottom: 0 transparent;
415 min-height: 40px; 415 // border-style: solid;
416 // font-family: PingFangSC-Regular; 416 // }
417 font-size: 14px; 417 .p1 {
418 color: #333333; 418 min-height: 40px;
419 letter-spacing: -0.26px; 419 // font-family: PingFangSC-Regular;
420 line-height: 18px; 420 font-size: 14px;
421 // line-height: 20px; 421 color: #333333;
422 } 422 letter-spacing: -0.26px;
423 .p2 { 423 line-height: 18px;
424 height: 34px; 424 // line-height: 20px;
425 padding: 1px 0 3px 0; 425 }
426 // font-family: PingFangSC-Regular; 426 .p2 {
427 font-size: 12px; 427 height: 34px;
428 color: #999999; 428 padding: 1px 0 3px 0;
429 letter-spacing: -0.23px; 429 // font-family: PingFangSC-Regular;
430 } 430 font-size: 12px;
431 .infoText-bottom { 431 color: #999999;
432 display: flex; 432 letter-spacing: -0.23px;
433 flex-direction: row; 433 }
434 justify-content: flex-start; 434 .infoText-bottom {
435 align-items: center; 435 display: flex;
436 width: 100%; 436 flex-direction: row;
437 margin-left: 0; 437 justify-content: flex-start;
438 .markPrice { 438 align-items: center;
439 font-size: 14px; 439 width: 100%;
440 color: #ff6b4a; 440 margin-left: 0;
441 margin-right: 20rpx; 441 .markPrice {
442 margin-left: 0rpx; 442 font-size: 14px;
443 } 443 color: #ff6b4a;
444 .buy-num { 444 margin-right: 20rpx;
445 font-size: 12px; 445 margin-left: 0rpx;
446 color: #999999; 446 }
447 } 447 .buy-num {
448 } 448 font-size: 12px;
449 } 449 color: #999999;
450 } 450 }
451 // .order-info-goodsnum { 451 }
452 // display: flex; 452 }
453 // align-items: center; 453 }
454 // justify-content: flex-end; 454 // .order-info-goodsnum {
455 // text { 455 // display: flex;
456 // margin-right: 44rpx; 456 // align-items: center;
457 // // ont-family: PingFangSC-Regular; 457 // justify-content: flex-end;
458 // font-size: 12px; 458 // text {
459 // color: #999999; 459 // margin-right: 44rpx;
460 // letter-spacing: -0.23px; 460 // // ont-family: PingFangSC-Regular;
461 // } 461 // font-size: 12px;
462 // } 462 // color: #999999;
463 .order-info-freight { 463 // letter-spacing: -0.23px;
464 display: block; 464 // }
465 margin-left: 40rpx; 465 // }
466 margin-top: 22rpx; 466 .order-info-freight {
467 .p1 { 467 display: block;
468 // font-family: PingFangSC-Regular; 468 margin-left: 40rpx;
469 font-size: 14px; 469 margin-top: 22rpx;
470 color: #333333; 470 .p1 {
471 letter-spacing: -0.26px; 471 // font-family: PingFangSC-Regular;
472 line-height: 18px; 472 font-size: 14px;
473 margin-right: 24px; 473 color: #333333;
474 } 474 letter-spacing: -0.26px;
475 .p2 { 475 line-height: 18px;
476 // font-family: PingFangSC-Regular; 476 margin-right: 24px;
477 font-size: 14px; 477 }
478 color: #ff6b4a; 478 .p2 {
479 letter-spacing: -0.26px; 479 // font-family: PingFangSC-Regular;
480 } 480 font-size: 14px;
481 } 481 color: #ff6b4a;
482 .order-info-discount { 482 letter-spacing: -0.26px;
483 display: block; 483 }
484 margin-left: 40rpx; 484 }
485 margin-top: 24rpx; 485 .order-info-discount {
486 .p1 { 486 display: block;
487 // font-family: PingFangSC-Regular; 487 margin-left: 40rpx;
488 font-size: 14px; 488 margin-top: 24rpx;
489 color: #333333; 489 .p1 {
490 letter-spacing: -0.26px; 490 // font-family: PingFangSC-Regular;
491 line-height: 18px; 491 font-size: 14px;
492 margin-right: 24px; 492 color: #333333;
493 } 493 letter-spacing: -0.26px;
494 .p2 { 494 line-height: 18px;
495 // font-family: PingFangSC-Regular; 495 margin-right: 24px;
496 font-size: 14px; 496 }
497 color: #ff6b4a; 497 .p2 {
498 letter-spacing: -0.26px; 498 // font-family: PingFangSC-Regular;
499 } 499 font-size: 14px;
500 } 500 color: #ff6b4a;
501 .order-info-price { 501 letter-spacing: -0.26px;
502 display: block; 502 }
503 margin-left: 40rpx; 503 }
504 margin-top: 24rpx; 504 .order-info-price {
505 .p1 { 505 display: block;
506 // font-family: PingFangSC-Semibold; 506 margin-left: 40rpx;
507 font-size: 14px; 507 margin-top: 24rpx;
508 color: #333333; 508 .p1 {
509 letter-spacing: -0.26px; 509 // font-family: PingFangSC-Semibold;
510 line-height: 18px; 510 font-size: 14px;
511 margin-right: 24px; 511 color: #333333;
512 } 512 letter-spacing: -0.26px;
513 .p2 { 513 line-height: 18px;
514 // font-family: PingFangSC-Semibold; 514 margin-right: 24px;
515 font-size: 14px; 515 }
516 color: #ff6b4a; 516 .p2 {
517 letter-spacing: -0.26px; 517 // font-family: PingFangSC-Semibold;
518 } 518 font-size: 14px;
519 } 519 color: #ff6b4a;
520 .order-info-num { 520 letter-spacing: -0.26px;
521 display: block; 521 }
522 margin-left: 40rpx; 522 }
523 margin-top: 44rpx; 523 .order-info-num {
524 text { 524 display: block;
525 // font-family: PingFangSC-Regular; 525 margin-left: 40rpx;
526 font-size: 12px; 526 margin-top: 44rpx;
527 color: #999999; 527 text {
528 letter-spacing: -0.23px; 528 // font-family: PingFangSC-Regular;
529 } 529 font-size: 12px;
530 } 530 color: #999999;
531 .order-info-time { 531 letter-spacing: -0.23px;
532 display: block; 532 }
533 margin: 8rpx 0 48rpx 40rpx; 533 }
534 text { 534 .order-info-time {
535 // font-family: PingFangSC-Regular; 535 display: block;
536 font-size: 12px; 536 margin: 8rpx 0 48rpx 40rpx;
537 color: #999999; 537 text {
538 letter-spacing: -0.23px; 538 // font-family: PingFangSC-Regular;
539 } 539 font-size: 12px;
540 } 540 color: #999999;
541 .order-info-hr { 541 letter-spacing: -0.23px;
542 width: 520rpx; 542 }
543 height: 1px; 543 }
544 background-color: #e9e9e9; 544 .order-info-hr {
545 margin-bottom: 20rpx; 545 width: 520rpx;
546 } 546 height: 1px;
547 .order-info-contact { 547 background-color: #e9e9e9;
548 display: flex; 548 margin-bottom: 20rpx;
549 padding-bottom: 28rpx; 549 }
550 image { 550 .order-info-contact {
551 width: 19px; 551 display: flex;
552 height: 16px; 552 padding-bottom: 28rpx;
553 } 553 image {
554 text { 554 width: 19px;
555 // font-family: PingFangSC-Regular; 555 height: 16px;
556 margin-left: 20rpx; 556 }
557 font-size: 14px; 557 text {
558 color: #333333; 558 // font-family: PingFangSC-Regular;
559 letter-spacing: -0.26px; 559 margin-left: 20rpx;
560 line-height: 18px; 560 font-size: 14px;
561 } 561 color: #333333;
562 } 562 letter-spacing: -0.26px;
563 } 563 line-height: 18px;
564 564 }
565 .order-confim { 565 }
566 display: flex; 566 }
567 align-items: center; 567
568 justify-content: flex-end; 568 .order-confim {
569 // z-index: 999; 569 display: flex;
570 width: 100%; 570 align-items: center;
571 height: 112rpx; 571 justify-content: flex-end;
572 position: fixed; 572 // z-index: 999;
573 bottom: 0; 573 width: 100%;
574 background: #ffffff; 574 height: 112rpx;
575 button { 575 position: fixed;
576 width: 204rpx; 576 bottom: 0;
577 height: 80rpx; 577 background: #ffffff;
578 border: 1px solid #ff6b4a; 578 button {
579 border-radius: 40rpx; 579 width: 204rpx;
580 font-size: 32rpx; 580 height: 80rpx;
581 letter-spacing: -0.3px; 581 border: 1px solid #ff6b4a;
582 margin-right: 0; 582 border-radius: 40rpx;
src/store/modules/index.js
Diff comments   View file @54c9be5
1 import urlAlias from '../url'; 1 import urlAlias from '../url';
2 import request from '../request'; 2 import request from '../request';
3 3
4 const { 4 const {
5 category, 5 category,
6 shopList, 6 shopList,
7 search, 7 search,
8 } = urlAlias; 8 } = urlAlias;
9 9
10 const state = { 10 const state = {
11 categoryList: [], 11 categoryList: [],
12 list: [] 12 list: []
13 }; 13 };
14 14
15 const mutations = { 15 const mutations = {
16 LIST: (state, list) => { 16 LIST: (state, list) => {
17 state.list = list; 17 state.list = list;
18 }, 18 },
19 CATEGORY: (state, categoryList) => { 19 CATEGORY: (state, categoryList) => {
20 state.categoryList = categoryList; 20 state.categoryList = categoryList;
21 } 21 }
22 }; 22 };
23 23
24 const actions = { 24 const actions = {
25 category({ commit }, param) { 25 category({
26 request({ 26 commit
27 url: category, 27 }, param) {
28 success: (res) => { 28 request({
29 console.log('category', res); 29 url: category,
30 let data = res.data.data; 30 success: (res) => {
31 for(let i = 0; i<=data.length; i++) { 31 console.log('category', res);
32 if(data[i] && data[i].type !== 'filter'){ 32 let data = res.data.data;
33 data[i].type = 'hierarchy'; 33 for (let i = 0; i <= data.length; i++) {
34 } 34 if (data[i] && data[i].type !== 'filter') {
35 } 35 data[i].type = 'hierarchy';
36 data.unshift({ 36 }
37 type: "hierarchy", 37 }
38 name: "全部", 38 data.unshift({
39 value: "all", 39 type: "hierarchy",
40 isNoPull: true, 40 name: "全部",
41 }); 41 value: "all",
42 commit('CATEGORY', data); 42 isNoPull: true,
43 },
44 fail: (res) => {
45 console.log("fail status === > ", res);
46 },
47 complete: (res) => {
48 console.log("complete status === > ", res);
49 },
50 })
51 },
52 list({ commit }, param) {
53 request({
54 url: shopList,
55 success: (res) => {
56 commit('LIST', res.data.data)
57 },
58 fail: (res) => {
59 console.log("fail status === > ", res);
60 },
61 complete: (res) => {
62 console.log("complete status === > ", res);
63 },
64 })
65 },
66 search({ commit }, { params, keyword }) {
67 const uid = uni.getStorageSync('uid');
68 console.log("params",params, keyword);
69 request({
70 url: search,
71 data: {
72 params: JSON.stringify(params),
73 uid,
74 way: 1,
75 keyword,
76 },
77 success: (res) => {
78 commit('LIST', res.data.data);
79 },
80 fail: (res) => {
81 console.log("fail status === > ", res);
82 },
83 complete: (res) => {
84 console.log("complete status === > ", res);
85 },
86 })
87 },
88 };
89 43
90 export default { 44 });
91 namespaced: true, 45 commit('CATEGORY', data);
92 state, 46 },
93 mutations, 47 fail: (res) => {
94 actions, 48 console.log("fail status === > ", res);
95 }; 49 },
50 complete: (res) => {
51 console.log("complete status === > ", res);
52 },
53 })
54 },
55 list({
56 commit
57 }, param) {
58
59 request({
60 url: shopList,
61 success: (res) => {
src/store/modules/myOrder.js
Diff comments   View file @54c9be5
1 import urlAlias from '../url'; 1 import urlAlias from '../url';
2 import request from '../request'; 2 import request from '../request';
3 3
4 const { 4 const {
5 myOrderList 5 myOrderList
6 } = urlAlias 6 } = urlAlias
7 7
8 // const data = { 8 // const data = {
9 // data: [ 9 // data: [
10 // { 10 // {
11 // finished_time: null, 11 // finished_time: null,
12 // is_refound: "0", 12 // is_refound: "0",
13 // mch_id: "1436019502", 13 // mch_id: "1436019502",
14 // money_of_dcw: "0", 14 // money_of_dcw: "0",
15 // money_of_partner: "0", 15 // money_of_partner: "0",
16 // money_of_shop: "0", 16 // money_of_shop: "0",
17 // orderJudge: false, 17 // orderJudge: false,
18 // order_info: { 18 // order_info: {
19 // address:{ 19 // address:{
20 // cityName: "镇江市", 20 // cityName: "镇江市",
21 // countyName: "丹阳市", 21 // countyName: "丹阳市",
22 // detailInfo: "延陵镇柳茹村卫生室附近秀野堂农业发展有限公司", 22 // detailInfo: "延陵镇柳茹村卫生室附近秀野堂农业发展有限公司",
23 // errMsg: "chooseAddress:ok", 23 // errMsg: "chooseAddress:ok",
24 // nationalCode: "321181", 24 // nationalCode: "321181",
25 // postalCode: "212300", 25 // postalCode: "212300",
26 // provinceName: "江苏省", 26 // provinceName: "江苏省",
27 // telNumber: "15896379277", 27 // telNumber: "15896379277",
28 // userName: "点餐汪客服", 28 // userName: "点餐汪客服",
29 // }, 29 // },
30 // cartinfo:['11', '12'], 30 // cartinfo:['11', '12'],
31 // keyname: "1_1587129366", 31 // keyname: "1_1587129366",
32 // lefttime: 179995, 32 // lefttime: 179995,
33 // list:[ 33 // list:[
34 // { 34 // {
35 // cart_id: "11", 35 // cart_id: "11",
36 // imgUrl: "https://glass.xiuyetang.com//upload_jk/4/4_0_3FDA03.jpg", 36 // imgUrl: "https://glass.xiuyetang.com//upload_jk/4/4_0_3FDA03.jpg",
37 // img_index_url: null, 37 // img_index_url: null,
38 // memo: "志平防蓝光-防辐射电脑网课眼镜，TR90弹性漆，近视镜，青春潮流，01-8701", 38 // memo: "志平防蓝光-防辐射电脑网课眼镜，TR90弹性漆，近视镜，青春潮流，01-8701",
39 // mp_id: "1", 39 // mp_id: "1",
40 // nowPrice: 100, 40 // nowPrice: 100,
41 // num: "2", 41 // num: "2",
42 // oldPrice: "0", 42 // oldPrice: "0",
43 // p_discount: "1", 43 // p_discount: "1",
44 // p_name: "01-8701志平防蓝光-防辐射电脑网课眼镜，TR90弹性漆，近视镜，青春潮流", 44 // p_name: "01-8701志平防蓝光-防辐射电脑网课眼镜，TR90弹性漆，近视镜，青春潮流",
45 // p_root_index: "1", 45 // p_root_index: "1",
46 // p_sale_price: "0", 46 // p_sale_price: "0",
47 // peopleName: "me", 47 // peopleName: "me",
48 // pics: '', 48 // pics: '',
49 // pid: "4", 49 // pid: "4",
50 // sk_id: "38", 50 // sk_id: "38",
51 // }, 51 // },
52 // ], 52 // ],
53 // orderDesc: "总共包括有：01-8701志平防蓝光-防辐射电脑网课眼镜，TR90弹性漆，近视镜，青春潮流在内的1件商品", 53 // orderDesc: "总共包括有：01-8701志平防蓝光-防辐射电脑网课眼镜，TR90弹性漆，近视镜，青春潮流在内的1件商品",
54 // total_fee: 100 54 // total_fee: 100
55 // }, 55 // },
56 // partner_uid: "0", 56 // partner_uid: "0",
57 // pay_cate: "2020", 57 // pay_cate: "2020",
58 // pay_id: "3", 58 // pay_id: "3",
59 // pay_time: "2020-04-17 21:16:12", 59 // pay_time: "2020-04-17 21:16:12",
60 // pay_wood_desc: "在【非常戴镜】的微信付款凭证", 60 // pay_wood_desc: "在【非常戴镜】的微信付款凭证",
61 // pay_wood_id: "fcdj-1-1_1587129366", 61 // pay_wood_id: "fcdj-1-1_1587129366",
62 // prepay_id: "wx172116124528226bf1a8adad1662456500", 62 // prepay_id: "wx172116124528226bf1a8adad1662456500",
63 // re_check_staus: "0", 63 // re_check_staus: "0",
64 // shopid: "0", 64 // shopid: "0",
65 // split_userid: "0", 65 // split_userid: "0",
66 // status: "1", 66 // status: "1",
67 // total_fee: "100", 67 // total_fee: "100",
68 // uid: "1", 68 // uid: "1",
69 // } 69 // }
70 // ], 70 // ],
71 // msg: "订单列表", 71 // msg: "订单列表",
72 // status: 0, 72 // status: 0,
73 // } 73 // }
74 74
75 const state = { 75 const state = {
76 orderList: [], 76 orderList: [],
77 }; 77 };
78 78
79 const mutations = { 79 const mutations = {
80 INIT: (state, data) => { 80 INIT: (state, data) => {
81 state.orderList = data; 81 state.orderList = data;
82 }, 82 },
83 }; 83 };
84 84
85 const actions = { 85 const actions = {
86 getList({ commit }, param) { 86 getList({
87 request({ 87 commit
88 url: myOrderList, 88 }, param) {
89 data: param, 89 request({
90 success: (res) => { 90 url: myOrderList,
91 // console.log(res.data); 91 data: param,
92 commit("INIT", res.data.data); 92 success: (res) => {
93 }, 93 console.log('myOrderList', res.data);
94 commit("INIT", res.data.data);
95 },
94 }) 96 })
95 } 97 }
96 } 98 }
97 99
98 export default { 100 export default {
99 namespaced: true, 101 namespaced: true,
100 state, 102 state,
101 mutations, 103 mutations,
102 actions, 104 actions,
103 } 105 }