Compare View

switch
from
...
to
 
Commits (2)
src/pages/index/index.vue
... ... @@ -84,7 +84,7 @@
84 84 data-format="Object"
85 85 ></HMfilterDropdown>
86 86 <!-- 商品列表 -->
87   -<!-- <scroll-view
  87 + <!-- <scroll-view
88 88 enable-flex
89 89 @scrolltolower="handleScrolltolower"
90 90 scroll-y
... ... @@ -97,135 +97,141 @@
97 97 v-for="(goods) in goodsList"
98 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 105 </view>
102 106 </view>
103 107 <view class="loading-text">{{loadingText}}</view>
104 108 </view>
105   - <!-- </scroll-view> -->
  109 + <!-- </scroll-view> -->
106 110 </view>
107 111 </view>
108 112 </view>
109 113 </template>
110 114  
111 115 <script>
112   -import UniDrawer from '@/components/UniDrawer/UniDrawer.vue'
113   -import Card from '@/components/CommodityCard/CommodityCard.vue'
114   -import HMfilterDropdown from '@/components/HMFilterDropdown/HMFilterDropdown.vue'
115   -import store from '@/store'
  116 +import UniDrawer from "@/components/UniDrawer/UniDrawer.vue";
  117 +import Card from "@/components/CommodityCard/CommodityCard.vue";
  118 +import HMfilterDropdown from "@/components/HMFilterDropdown/HMFilterDropdown.vue";
  119 +import store from "@/store";
116 120  
117 121 export default {
118 122 components: {
119 123 UniDrawer: UniDrawer,
120 124 HMfilterDropdown: HMfilterDropdown,
121   - Card: Card,
  125 + Card: Card
122 126 },
123   - data () {
  127 + data() {
124 128 return {
125   - indexArr: '',
126   - valueArr: '',
127   - loadingText: '~~到底了~~',
  129 + indexArr: "",
  130 + valueArr: "",
  131 + isLoading: true, //初始化加载状态
  132 + loadingText: "~~一开始应该是加载中。。。。等数据传完后,更新为到底了~~",
128 133 filterDropdownValue: [],
129 134 filterData: [],
130   - searchText: '',
131   - scrollTop: 0,
132   - viewHeight: uni.getSystemInfoSync().windowHeight,
133   - }
  135 + searchText: "",
  136 + scrollTop: 0,
  137 + viewHeight: uni.getSystemInfoSync().windowHeight
  138 + };
134 139 },
135   - onPageScroll({scrollTop}) {
136   - // 传入scrollTop值并触发所有easy-loadimage组件下的滚动监听事件
137   -
138   - this.scrollTop = scrollTop;
139   - console.log('pagescroll====>',this.viewHeight)
  140 + onPageScroll({ scrollTop }) {
  141 + // 传入scrollTop值并触发所有easy-loadimage组件下的滚动监听事件
  142 +
  143 + this.scrollTop = scrollTop;
  144 + console.log("pagescroll====>", this.viewHeight);
140 145 },
141 146 computed: {
142   - goodsList () {
  147 + goodsList() {
143 148 // 也可以从 getters 获取
144 149 // console.log('index-list=====>',this.$store.state.index.list)
145   - return this.$store.state.index.list
146   - },
147   - categoryList () {
148   - return this.$store.state.index.categoryList
  150 + return this.$store.state.index.list;
149 151 },
  152 + categoryList() {
  153 + return this.$store.state.index.categoryList;
  154 + }
150 155 },
151 156 filters: {
152   - outData (value) {
153   - return JSON.stringify(value)
154   - },
  157 + outData(value) {
  158 + return JSON.stringify(value);
  159 + }
155 160 },
156   - onLoad () {
157   - store.dispatch('index/category')
  161 + onLoad() {
  162 + store.dispatch("index/category");
158 163 // this.getList();
159   - store.dispatch('index/list')
  164 + store.dispatch("index/list");
160 165 },
161 166 methods: {
162   - showDrawer (e) {
163   - this.$refs[e].open()
  167 + showDrawer(e) {
  168 + this.$refs[e].open();
164 169 },
165   - getList () {
166   - store.dispatch('index/list')
  170 + getList() {
  171 + store.dispatch("index/list");
167 172 },
168 173 // search(params) {
169 174 // this.$store.index.
170 175 // },
171   - closeDrawer (e) {
172   - this.$refs[e].close()
  176 + closeDrawer(e) {
  177 + this.$refs[e].close();
173 178 },
174   - change (e, type) {
175   - this[type] = e
  179 + change(e, type) {
  180 + this[type] = e;
176 181 },
177   - onClickItem (e) {
  182 + onClickItem(e) {
178 183 if (this.current !== e) {
179   - this.current = e
  184 + this.current = e;
180 185 }
181 186 },
182   - dropDown () {
183   - console.log('下拉')
  187 + dropDown() {
  188 + console.log("下拉");
184 189 },
185   - searchKey (e) {
186   - const { value: keyword } = e.detail
187   - this.keyWords = keyword
188   - store.dispatch('index/search', {
  190 + searchKey(e) {
  191 + const { value: keyword } = e.detail;
  192 + this.keyWords = keyword;
  193 + store.dispatch("index/search", {
189 194 params: {},
190   - keyword,
191   - })
  195 + keyword
  196 + });
192 197 },
193 198 // 接收菜单结果
194   - search (e) {
195   - const { on, value, selectedData } = e
196   - let params = {}
197   - const selectedPayload = {}
  199 + search(e) {
  200 + const { on, value, selectedData } = e;
  201 + let params = {};
  202 + const selectedPayload = {};
198 203 for (const key in selectedData) {
199 204 if (Object.prototype.hasOwnProperty.call(selectedData, key)) {
200   - selectedPayload[key] = selectedData[key].toString()
  205 + selectedPayload[key] = selectedData[key].toString();
201 206 }
202 207 }
203 208 if (on[0] === 1) {
204 209 // 若点击全部
205   - this.searchText = ''
206   - store.dispatch('index/list')
  210 + this.searchText = "";
  211 + store.dispatch("index/list");
207 212 } else {
208   - for (let i = 1; i <= on.length; i++) { // on[0]是全部
209   - if (on[i] === 1) { // 若该选项被选中
210   - if (this.categoryList[i].value === 'filter') {
  213 + for (let i = 1; i <= on.length; i++) {
  214 + // on[0]是全部
  215 + if (on[i] === 1) {
  216 + // 若该选项被选中
  217 + if (this.categoryList[i].value === "filter") {
211 218 params = {
212 219 ...selectedPayload,
213   - ...params,
214   - }
  220 + ...params
  221 + };
215 222 } else {
216   - params[`${this.categoryList[i].value}`] = value[i][0]
  223 + params[`${this.categoryList[i].value}`] = value[i][0];
217 224 }
218 225 }
219 226 }
220   - store.dispatch('index/search', {
  227 + store.dispatch("index/search", {
221 228 params,
222   - keyword: this.keyWords,
223   - })
  229 + keyword: this.keyWords
  230 + });
224 231 }
225 232 }
226 233 }
227   -
228   -}
  234 +};
229 235 </script>
230 236  
231 237 <style lang="scss">
... ...
src/pages/myOrder/components/OrderCard.vue
1 1 <template>
2   - <view>
3   - <view class="card" v-if="current == status" @click="toOrderInfo(status,order.pay_id)">
4   - <view class="cardHeader">
5   - <text class="orderId" v-if="status == '0'||status == '1'">订单号:{{order.mch_id}}</text>
6   - <text class="orderId" v-if="status == '2'||status == '3'">下单时间:{{order.pay_time}}</text>
7   - <text class="orderType" v-if="status=='0'">待付款</text>
8   - <text class="orderType" v-if="status=='1'">待收货</text>
9   - <text class="orderType" v-if="status == '2'||status == '3'">已完成</text>
10   - <!-- <text class="orderType" v-if="status == '3'">已评价</text> -->
11   - </view>
12   - <view class="orderCardInfo" v-for="(orderInfo, index) in orderInfoList.list" :key="index">
13   - <image :src="orderInfo.imgUrl" mode="aspectFill"></image>
14   - <view class="infoText">
15   - <view class="orderName">{{orderInfo[0].p_name}}</view>
16   - <view class="orderDescrib">{{orderInfo.p_name}}</view>
17   - <view class="infoText-bottom">
18   - <view class="markPrice">{{orderInfo.nowPrice}}</view>
19   - <view class="buy-num">X {{orderInfo.num}}</view>
20   - </view>
21   - </view>
22   - </view>
23   - <view class="payPrice">实付:<text class="priceNum">{{order.total_fee}}</text> </view>
24   - <!-- 0待付款 1 已付款 待收货 2 已收货待评价 3 已评价 -->
25   - <view class="btns" v-if="status == '0'">
26   - <view class="btn-type1" >取消订单</view>
27   - <view class="btn-type2">去支付</view>
28   - </view>
29   - <view class="btns" v-if="status == '1'">
30   - <view class="btn-type2">确认收货</view>
31   - </view>
32   - <view class="btns" v-if="status == '2'">
33   - <view class="btn-type2">再次购买</view>
34   - </view>
35   - <!-- <view class="btns" v-if="status == '3'">
  2 + <view>
  3 + <view
  4 + class="card"
  5 + v-if="current == status"
  6 + @click="toOrderInfo(status,order.pay_id)"
  7 + >
  8 + <view class="cardHeader">
  9 + <text
  10 + class="orderId"
  11 + v-if="status == '0'||status == '1'"
  12 + >订单号:{{order.pay_id}}</text>
  13 + <text
  14 + class="orderId"
  15 + v-if="status == '2'||status == '3'"
  16 + >下单时间:{{order.pay_time}}</text>
  17 + <text
  18 + class="orderType"
  19 + v-if="status=='0'"
  20 + >待付款</text>
  21 + <text
  22 + class="orderType"
  23 + v-if="status=='1'"
  24 + >待收货</text>
  25 + <text
  26 + class="orderType"
  27 + v-if="status == '2'||status == '3'"
  28 + >已完成</text>
  29 + <!-- <text class="orderType" v-if="status == '3'">已评价</text> -->
  30 + </view>
  31 + <view
  32 + class="orderCardInfo"
  33 + v-for="(orderInfo, index) in order.order_info.list"
  34 + :key="index"
  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 71 <view class="btn-type2">再次购买</view>
37 72 </view> -->
38   - </view>
39   - <view class="card" v-if="current == '10'" @click="toOrderInfo(status,order.pay_id)">
40   - <view class="cardHeader">
41   - <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>
43   - <text class="orderType" v-if="status=='0'">待付款</text>
44   - <text class="orderType" v-if="status=='1'">待收货</text>
45   - <text class="orderType" v-if="status == '2'||status == '3'">已完成</text>
46   - <!-- <text class="orderType" v-if="status == '3'">已评价</text> -->
47   - </view>
48   - <view class="orderCardInfo" v-if v-for="(orderInfo) in orderInfoList.list" :key="orderInfo">
49   - <image :src="orderInfo.imgUrl" mode="aspectFill"></image>
50   - <view class="infoText">
51   - <view class="orderName">{{orderInfo.p_name}}</view>
52   - <view class="orderDescrib">{{orderInfo.p_name}}</view>
53   - <view class="infoText-bottom">
54   - <view class="markPrice">{{orderInfo.nowPrice}}</view>
55   - <view class="buy-num">X {{orderInfo.num}}</view>
56   - </view>
57   - </view>
58   - </view>
59   - <view class="payPrice">实付:<text class="priceNum">{{order.total_fee}}</text> </view>
60   - <view class="btns" v-if="status == '0'">
61   - <view class="btn-type1" >取消订单</view>
62   - <view class="btn-type2">去支付</view>
63   - </view>
64   - <view class="btns" v-if="status == '1'">
65   - <view class="btn-type2">确认收货</view>
66   - </view>
67   - <view class="btns" v-if="status == '2'">
68   - <view class="btn-type2">再次购买</view>
69   - </view>
70   - <!-- <view class="btns" v-if="status == '3'">
  73 + </view>
  74 + <view
  75 + class="card"
  76 + v-if="current == '10'"
  77 + @click="toOrderInfo(status,order.pay_id)"
  78 + >
  79 + <view class="cardHeader">
  80 + <text
  81 + class="orderId"
  82 + v-if="status == '0'||status == '1'"
  83 + >订单号:{{order.pay_id}}</text>
  84 + <text
  85 + class="orderId"
  86 + v-if="status == '2'||status == '3'"
  87 + >下单时间:{{order.pay_time}}</text>
  88 + <text
  89 + class="orderType"
  90 + v-if="status=='0'"
  91 + >待付款</text>
  92 + <text
  93 + class="orderType"
  94 + v-if="status=='1'"
  95 + >待收货</text>
  96 + <text
  97 + class="orderType"
  98 + v-if="status == '2'||status == '3'"
  99 + >已完成</text>
  100 + <!-- <text class="orderType" v-if="status == '3'">已评价</text> -->
  101 + </view>
  102 + <view
  103 + class="orderCardInfo"
  104 + v-if
  105 + v-for="(orderInfo) in order.order_info.list"
  106 + :key="orderInfo"
  107 + >
  108 + <image
  109 + :src="orderInfo.imgUrl"
  110 + mode="aspectFit"
  111 + ></image>
  112 + <view class="infoText">
  113 + <view class="orderName">{{orderInfo.p_name}}</view>
  114 + <view class="orderDescrib">{{orderInfo.p_name}}</view>
  115 + <view class="infoText-bottom">
  116 + <view class="markPrice">{{orderInfo.nowPrice}}</view>
  117 + <view class="buy-num">X {{orderInfo.num}}</view>
  118 + </view>
  119 + </view>
  120 + </view>
  121 + <view class="payPrice">实付:<text class="priceNum">{{order.total_fee}}</text> </view>
  122 + <view
  123 + class="btns"
  124 + v-if="status == '0'"
  125 + >
  126 + <view class="btn-type1">取消订单</view>
  127 + <view class="btn-type2">去支付</view>
  128 + </view>
  129 + <view
  130 + class="btns"
  131 + v-if="status == '1'"
  132 + >
  133 + <view class="btn-type2">确认收货</view>
  134 + </view>
  135 + <view
  136 + class="btns"
  137 + v-if="status == '2'"
  138 + >
  139 + <view class="btn-type2">再次购买</view>
  140 + </view>
  141 + <!-- <view class="btns" v-if="status == '3'">
71 142 <view class="btn-type2">再次购买</view>
72 143 </view> -->
73   - </view>
74   - </view>
  144 + </view>
  145 + </view>
75 146 </template>
76 147  
77 148 <script>
78   - export default {
79   - props: {
80   - /**
81   - * 订单数据
82   - */
83   - order: {
84   - // orderId: Number,
85   - // img: String,
86   - // name: String,
87   - // originCost:String,
88   - // price: String,
89   - // orderType:Number,
90   - // buyNum:Number,
91   - finished_time: null,
92   - is_refound: String,
93   - mch_id: String,
94   - money_of_dcw: String,
95   - money_of_partner: String,
96   - money_of_shop: String,
97   - orderJudge: Boolean,
98   - order_info: {
99   - address:{
100   - cityName: String,
101   - countyName: String,
102   - detailInfo: String,
103   - errMsg: String,
104   - nationalCode: String,
105   - postalCode: String,
106   - provinceName: String,
107   - telNumber: String,
108   - userName: String,
109   - },
110   - cartinfo: ["127"],
111   - keyname: "330_1588911391",
112   - lefttime: Number,
113   - list:[
114   - {
115   - cart_id: "127",
116   - imgUrl: String,
117   - img_index_url: null,
118   - memo: String,
119   - mp_id: String,
120   - nowPrice: String,
121   - num: String,
122   - oldPrice: Number,
123   - p_discount: String,
124   - p_name: String,
125   - p_root_index: String,
126   - p_sale_price: String,
127   - peopleName: String,
128   - pics: ["79_0_D122D2.jpg","79_1_E0A1ED.jpg","79_2_B00B3D.jpg","79_3_B2CF21.jpg","79_4_33AD1B.jpg"],
129   - pid: String,
130   - sk_id: String,
131   - }
132   - ],
133   - orderDesc: String,
134   - total_fee: Number,
135   - },
136   - partner_uid: String,
137   - pay_cate: String,
138   - pay_id: String,
139   - pay_time: String,
140   - pay_wood_desc: String,
141   - pay_wood_id: String,
142   - prepay_id: String,
143   - re_check_staus: String,
144   - shopid: String,
145   - split_userid: String,
146   - status: String,
147   - // status0待付款 1已付款 待收货 2 已收货待评价 3 已评价
148   - total_fee: String,
149   - uid: String,
150   - },
151   - /**
152   - * 当前选择
153   - */
154   - current:Number
155   -
156   - },
157   - created() {
158   - console.log(this.order);
159   - // console.log(this.order.status );
160   - // console.log(this.current);
161   - },
162   - computed:{
163   - status(){
164   - return this.order.status
165   - },
166   - orderInfoList(){
167   - console.log('this.order.order_info[0]', this.order)
168   - return this.order.order_info[0]
169   - }
170   - },
171   - data() {
172   - return {
173   - };
174   - },
175   - methods:{
176   - toRefundment(){
177   - uni.navigateTo({
178   - url: '../refundment/refundment',
179   - success: res => {},
180   - fail: () => {},
181   - complete: () => {}
182   - });
183   - },
184   - toOrderInfo(status,payId){
185   - console.log(status,payId)
186   - switch(status){
187   - // 0待付款 1待收货 2已收货 3 已评价
188   - case '0':
189   - uni.navigateTo({
190   - url:`../myOrderPaying/myOrderPaying?status=`+status+`&payId=`+payId,
191   - fail(errMsg) {
192   - console.log(errMsg)
193   - }
194   - })
195   - break;
196   - case '1':
197   - uni.navigateTo({
198   - url:`../myOrderPaying/myOrderPaying?status=`+status+`&payId=`+payId,
199   - fail(errMsg) {
200   - console.log(errMsg)
201   - }
202   - })
203   -
204   - break;
205   - case '2 || 3':
206   - uni.navigateTo({
207   - url:`../myOrderPaying/myOrderPaying?status=`+status+`&payId=`+payId,
208   - fail(errMsg) {
209   - console.log(errMsg)
210   - }
211   - })
212   - break;
213   - default:
214   - break;
215   -
216   - }
217   - }
218   - }
219   - }
  149 +export default {
  150 + props: {
  151 + /**
  152 + * 订单数据
  153 + */
  154 + order: {
  155 + // orderId: Number,
  156 + // img: String,
  157 + // name: String,
  158 + // originCost:String,
  159 + // price: String,
  160 + // orderType:Number,
  161 + // buyNum:Number,
  162 + finished_time: null,
  163 + is_refound: String,
  164 + mch_id: String,
  165 + money_of_dcw: String,
  166 + money_of_partner: String,
  167 + money_of_shop: String,
  168 + orderJudge: Boolean,
  169 + order_info: {
  170 + address: {
  171 + cityName: String,
  172 + countyName: String,
  173 + detailInfo: String,
  174 + errMsg: String,
  175 + nationalCode: String,
  176 + postalCode: String,
  177 + provinceName: String,
  178 + telNumber: String,
  179 + userName: String
  180 + },
  181 + cartinfo: ["127"],
  182 + keyname: "330_1588911391",
  183 + lefttime: Number,
  184 + list: [
  185 + {
  186 + cart_id: "127",
  187 + imgUrl: String,
  188 + img_index_url: null,
  189 + memo: String,
  190 + mp_id: String,
  191 + nowPrice: String,
  192 + num: String,
  193 + oldPrice: Number,
  194 + p_discount: String,
  195 + p_name: String,
  196 + p_root_index: String,
  197 + p_sale_price: String,
  198 + peopleName: String,
  199 + pics: [
  200 + "79_0_D122D2.jpg",
  201 + "79_1_E0A1ED.jpg",
  202 + "79_2_B00B3D.jpg",
  203 + "79_3_B2CF21.jpg",
  204 + "79_4_33AD1B.jpg"
  205 + ],
  206 + pid: String,
  207 + sk_id: String
  208 + }
  209 + ],
  210 + orderDesc: String,
  211 + total_fee: Number
  212 + },
  213 + partner_uid: String,
  214 + pay_cate: String,
  215 + pay_id: String,
  216 + pay_time: String,
  217 + pay_wood_desc: String,
  218 + pay_wood_id: String,
  219 + prepay_id: String,
  220 + re_check_staus: String,
  221 + shopid: String,
  222 + split_userid: String,
  223 + status: String,
  224 + // status0待付款 1已付款 待收货 2 已收货待评价 3 已评价
  225 + total_fee: String,
  226 + uid: String
  227 + },
  228 + /**
  229 + * 当前选择
  230 + */
  231 + current: Number
  232 + },
  233 + created() {
  234 + console.log("this.order", this.order);
  235 + // console.log(this.order.status );
  236 + // console.log(this.current);
  237 + },
  238 + computed: {
  239 + status() {
  240 + return this.order.status;
  241 + },
  242 + orderInfoList() {
  243 + console.log("this.order.order_info[0]", this.order);
  244 + return this.order.order_info;
  245 + }
  246 + },
  247 + data() {
  248 + return {};
  249 + },
  250 + methods: {
  251 + toRefundment() {
  252 + uni.navigateTo({
  253 + url: "../refundment/refundment",
  254 + success: res => {},
  255 + fail: () => {},
  256 + complete: () => {}
  257 + });
  258 + },
  259 + toOrderInfo(status, payId) {
  260 + console.log(status, payId);
  261 + switch (status) {
  262 + // 0待付款 1待收货 2已收货 3 已评价
  263 + case "0":
  264 + uni.navigateTo({
  265 + url:
  266 + `../myOrderPaying/myOrderPaying?status=` +
  267 + status +
  268 + `&payId=` +
  269 + payId,
  270 + fail(errMsg) {
  271 + console.log(errMsg);
  272 + }
  273 + });
  274 + break;
  275 + case "1":
  276 + uni.navigateTo({
  277 + url:
  278 + `../myOrderPaying/myOrderPaying?status=` +
  279 + status +
  280 + `&payId=` +
  281 + payId,
  282 + fail(errMsg) {
  283 + console.log(errMsg);
  284 + }
  285 + });
  286 +
  287 + break;
  288 + case "2 || 3":
  289 + uni.navigateTo({
  290 + url:
  291 + `../myOrderPaying/myOrderPaying?status=` +
  292 + status +
  293 + `&payId=` +
  294 + payId,
  295 + fail(errMsg) {
  296 + console.log(errMsg);
  297 + }
  298 + });
  299 + break;
  300 + default:
  301 + break;
  302 + }
  303 + }
  304 + }
  305 +};
220 306 </script>
221 307  
222 308 <style lang="scss">
223   - .card{
224   - width: 670rpx;
225   - height: 478rpx;
226   - background: #FFFFFF;
227   - box-shadow: 0 0 10px 0 rgba(177,128,128,0.06);
228   - border-radius: 8px;
229   - border-radius: 8px;
230   - margin-top: 20rpx;
231   - padding: 40rpx;
232   - box-sizing: border-box;
233   - .cardHeader{
234   - width: 100%;
235   - height: 40rpx;
236   - display: flex;
237   - justify-content: space-between;
238   - align-items: center;
239   - .orderId{
240   - font-size: 12px;
241   - color: #999999;
242   - }
243   - .orderType{
244   - font-size: 14px;
245   - color: #FF6B4A;
246   - }
247   - }
248   - .orderCardInfo{
249   - width: 100%;
250   - height: 188rpx;
251   - display: flex;
252   - flex-direction: row;
253   - justify-content: space-between;
254   - align-items: center;
255   - margin-top: 40rpx;
256   - image{
257   - height: 188rpx;
258   - width: 188rpx;
259   - margin-right: 24rpx;
260   - }
261   - .infoText{
262   - display: flex;
263   - flex-direction: column;
264   - justify-content: space-between;
265   - align-items: flex-start;
266   - height: 188rpx;
267   - width: 368rpx;
268   - }
269   - .orderName{
270   - font-size: 14px;
271   - color: #333333;
272   - display: -webkit-box;
273   - overflow: hidden;
274   - -webkit-box-orient: vertical;
275   - -webkit-line-clamp: 2;
276   - }
277   - .orderDescrib{
278   - font-size: 12px;
279   - color: #999999;
280   - display: -webkit-box;
281   - overflow: hidden;
282   - -webkit-box-orient: vertical;
283   - -webkit-line-clamp: 2;
284   - }
285   - .infoText-bottom{
286   - display: flex;
287   - flex-direction: row;
288   - justify-content: flex-start;
289   - align-items: center;
290   - width: 100%;
291   - .markPrice{
292   - font-size: 14px;
293   - color: #FF6B4A;
294   - margin-right: 20rpx;
295   - }
296   - .buy-num{
297   - font-size: 12px;
298   - color: #999999;
299   - }
300   - }
301   - }
302   - .payPrice{
303   - text-align: right;
304   - margin: 20rpx 0;
305   - font-size: 14px;
306   - color: #333333;
307   - .priceNum{
308   - font-size: 14px;
309   - color: #FF6B4A;
310   - }
311   - }
312   - .btns{
313   - display: flex;
314   - justify-content: flex-end;
315   - align-items: center;
316   - .btn-type1{
317   - height: 48rpx;
318   - width: 156rpx;
319   - border: 1px solid #FF6B4A;
320   - border-radius: 12px;
321   - border-radius: 12px;
322   - text-align: center;
323   - line-height: 48rpx;
324   - font-size: 12px;
325   - color: #FF6B4A;
326   - }
327   - .btn-type2{
328   - height: 48rpx;
329   - width: 140rpx;
330   - background: #FF6B4A;
331   - border-radius: 12px;
332   - border-radius: 12px;
333   - text-align: center;
334   - line-height: 48rpx;
335   - font-size: 12px;
336   - color: #FFFFFF;
337   - margin-left: 20rpx;
338   - }
339   - }
340   - }
  309 +.card {
  310 + width: 670rpx;
  311 + height: 478rpx;
  312 + background: #ffffff;
  313 + box-shadow: 0 0 10px 0 rgba(177, 128, 128, 0.06);
  314 + border-radius: 8px;
  315 + border-radius: 8px;
  316 + margin-top: 20rpx;
  317 + padding: 40rpx;
  318 + box-sizing: border-box;
  319 + .cardHeader {
  320 + width: 100%;
  321 + height: 40rpx;
  322 + display: flex;
  323 + justify-content: space-between;
  324 + align-items: center;
  325 + .orderId {
  326 + font-size: 12px;
  327 + color: #999999;
  328 + }
  329 + .orderType {
  330 + font-size: 14px;
  331 + color: #ff6b4a;
  332 + }
  333 + }
  334 + .orderCardInfo {
  335 + width: 100%;
  336 + height: 188rpx;
  337 + display: flex;
  338 + flex-direction: row;
  339 + justify-content: space-between;
  340 + align-items: center;
  341 + margin-top: 40rpx;
  342 + image {
  343 + height: 188rpx;
  344 + width: 188rpx;
  345 + margin-right: 24rpx;
  346 + }
  347 + .infoText {
  348 + display: flex;
  349 + flex-direction: column;
  350 + justify-content: space-between;
  351 + align-items: flex-start;
  352 + height: 188rpx;
  353 + width: 368rpx;
  354 + }
  355 + .orderName {
  356 + font-size: 14px;
  357 + color: #333333;
  358 + display: -webkit-box;
  359 + overflow: hidden;
  360 + -webkit-box-orient: vertical;
  361 + -webkit-line-clamp: 2;
  362 + }
  363 + .orderDescrib {
  364 + font-size: 12px;
  365 + color: #999999;
  366 + display: -webkit-box;
  367 + overflow: hidden;
  368 + -webkit-box-orient: vertical;
  369 + -webkit-line-clamp: 2;
  370 + }
  371 + .infoText-bottom {
  372 + display: flex;
  373 + flex-direction: row;
  374 + justify-content: flex-start;
  375 + align-items: center;
  376 + width: 100%;
  377 + .markPrice {
  378 + font-size: 14px;
  379 + color: #ff6b4a;
  380 + margin-right: 20rpx;
  381 + }
  382 + .buy-num {
  383 + font-size: 12px;
  384 + color: #999999;
  385 + }
  386 + }
  387 + }
  388 + .payPrice {
  389 + text-align: right;
  390 + margin: 20rpx 0;
  391 + font-size: 14px;
  392 + color: #333333;
  393 + .priceNum {
  394 + font-size: 14px;
  395 + color: #ff6b4a;
  396 + }
  397 + }
  398 + .btns {
  399 + display: flex;
  400 + justify-content: flex-end;
  401 + align-items: center;
  402 + .btn-type1 {
  403 + height: 48rpx;
  404 + width: 156rpx;
  405 + border: 1px solid #ff6b4a;
  406 + border-radius: 12px;
  407 + border-radius: 12px;
  408 + text-align: center;
  409 + line-height: 48rpx;
  410 + font-size: 12px;
  411 + color: #ff6b4a;
  412 + }
  413 + .btn-type2 {
  414 + height: 48rpx;
  415 + width: 140rpx;
  416 + background: #ff6b4a;
  417 + border-radius: 12px;
  418 + border-radius: 12px;
  419 + text-align: center;
  420 + line-height: 48rpx;
  421 + font-size: 12px;
  422 + color: #ffffff;
  423 + margin-left: 20rpx;
  424 + }
  425 + }
  426 +}
341 427 </style>
... ...
src/pages/myOrder/myOrder.vue
... ... @@ -22,7 +22,7 @@
22 22 <view class="orderList">
23 23 <view
24 24 v-for="(order) in orderList"
25   - :key="order.orderId"
  25 + :key="order.pay_id"
26 26 >
27 27 <OrderCard
28 28 :order="order"
... ... @@ -34,53 +34,53 @@
34 34 </view>
35 35 </template>
36 36 <script>
37   -import OrderCard from './components/OrderCard.vue'
38   -import store from '@/store'
  37 +import OrderCard from "./components/OrderCard.vue";
  38 +import store from "@/store";
39 39  
40 40 export default {
41 41 components: {
42   - OrderCard: OrderCard,
  42 + OrderCard: OrderCard
43 43 },
44 44 data() {
45 45 return {
46 46 // 顶部筛选项
47 47 screenItems: [
48   - { current: '10', text: '全部' },
49   - { current: '0', text: '待付款' },
50   - { current: '1', text: '待收货' },
51   - { current: '2', text: '已完成' },
  48 + { current: "10", text: "全部" },
  49 + { current: "0", text: "待付款" },
  50 + { current: "1", text: "待收货" },
  51 + { current: "2", text: "待评价" }
52 52 // {current:"3",text:'已评价'},
53 53 // {current:"4",text:'退款'},
54 54 ],
55 55 // 当前所在item 默认10-->全部
56   - current: '10',
57   - }
  56 + current: "10"
  57 + };
58 58 },
59 59  
60 60 onLoad: function(option) {
61 61 // 获取订单列表
62   - store.dispatch('myOrder/getList', {
63   - way: '',
64   - })
  62 + store.dispatch("myOrder/getList", {
  63 + way: ""
  64 + });
65 65 // 从user过来传的status,给current,以显示对应item
66   - this.current = option.status
  66 + this.current = option.status;
67 67 },
68 68 computed: {
69 69 orderList() {
70 70 // console.log('orderList', this.$store.state.myOrder.orderList);
71   - return this.$store.state.myOrder.orderList
72   - },
  71 + return this.$store.state.myOrder.orderList;
  72 + }
73 73 },
74 74 methods: {
75 75 // tab点击事件
76 76 onClickItem(e) {
  77 + console.log("onClickItem", e);
77 78 if (this.current !== e) {
78   - this.current = e
  79 + this.current = e;
79 80 }
80   - },
81   -
82   - },
83   -}
  81 + }
  82 + }
  83 +};
84 84 </script>
85 85  
86 86 <style lang="scss">
... ...
src/pages/myOrderPaying/myOrderPaying.vue
... ... @@ -80,13 +80,13 @@
80 80 </text>
81 81 <text class="order-info-price">
82 82 <text class="p1">实付</text>
83   - <text class="p2">¥{{orderInfo.order_info[0].total_fee}}</text>
  83 + <text class="p2">¥{{orderInfo.total_fee}}</text>
84 84 </text>
85 85 <text class="order-info-num">
86 86 <text>订单号:{{payId}}</text>
87 87 </text>
88 88 <text class="order-info-time">
89   - <text>下单时间:{{orderInfo.order_info[0].pay_time | timerChange}}</text>
  89 + <text>下单时间:{{orderInfo.pay_time | timerChange}}</text>
90 90 </text>
91 91 <view class="order-info-hr"></view>
92 92 <view class="order-info-contact">
... ... @@ -123,130 +123,130 @@
123 123 </template>
124 124  
125 125 <script>
126   -import store from '@/store'
127   -import UniCountdown from '../../components/UniCountdown/UniCountdown.vue'
  126 +import store from "@/store";
  127 +import UniCountdown from "../../components/UniCountdown/UniCountdown.vue";
128 128 export default {
129 129 components: {
130   - UniCountdown,
  130 + UniCountdown
131 131 },
132   - data () {
  132 + data() {
133 133 return {
134   - payId: '',
135   - payTime: '',
136   - status: '', // status 0 待付款 1 已发货
137   - uid: '',
138   - openid: '',
  134 + payId: "",
  135 + payTime: "",
  136 + status: "", // status 0 待付款 1 已发货
  137 + uid: "",
  138 + openid: "",
139 139 lefttime: 0,
140   - isPay: 0,
141   - }
  140 + isPay: 0
  141 + };
142 142 },
143   - onLoad: function (option) {
144   - console.log(option)
145   - this.payId = option.payId
146   - this.status = option.status
147   - this.isPay = option.isPay
148   - const openid = uni.getStorageSync('openid')
149   - const uid = this.$store.state.user.uid
150   - this.uid = uid
151   - this.openid = openid
152   - store.dispatch('orderRead/getOrderInfo', {
  143 + onLoad: function(option) {
  144 + console.log(option);
  145 + this.payId = option.payId;
  146 + this.status = option.status;
  147 + this.isPay = option.isPay;
  148 + const openid = uni.getStorageSync("openid");
  149 + const uid = this.$store.state.user.uid;
  150 + this.uid = uid;
  151 + this.openid = openid;
  152 + store.dispatch("orderRead/getOrderInfo", {
153 153 pay_id: this.payId,
154   - uid: '1',
155   - openid: openid,
156   - })
  154 + uid: "1",
  155 + openid: openid
  156 + });
157 157 // this.orderInfo = this.$store.state.orderRead.orderInfo
158 158 },
159 159 // 若从支付页面跳转过来,返回直接返回到首页
160 160 onBackPress(option) {
161   - if (option.from === 'backbutton' && this.isPay) {
  161 + if (option.from === "backbutton" && this.isPay) {
162 162 uni.switchTab({
163   - url: '/pages/index/index',
164   - })
165   - return true // 阻止默认返回行为
  163 + url: "/pages/index/index"
  164 + });
  165 + return true; // 阻止默认返回行为
166 166 }
167 167 },
168 168 computed: {
169 169 // 获取订单详细信息
170   - orderInfo () {
171   - console.log('orderInfo', this.$store.state.orderRead.orderInfo)
172   - return this.$store.state.orderRead.orderInfo || {}
  170 + orderInfo() {
  171 + console.log("orderInfo", this.$store.state.orderRead.orderInfo);
  172 + return this.$store.state.orderRead.orderInfo || {};
173 173 },
174   - orderInfoList () {
175   - const orderInfoList = this.orderInfo.order_info[0].list
176   - return orderInfoList
  174 + orderInfoList() {
  175 + const orderInfoList = this.orderInfo.order_info.list;
  176 + return orderInfoList;
177 177 },
178 178 // 获取订单地址信息
179   - orderAddressInfo () {
180   - return this.orderInfo.order_info[0].address
  179 + orderAddressInfo() {
  180 + return this.orderInfo.order_info.address;
181 181 },
182 182 // 订单付款时间
183   - getTime () {
184   - return this.orderInfo.order_info[0].lefttime
  183 + getTime() {
  184 + return this.orderInfo.order_info.lefttime;
185 185 },
186 186 // 计算总优惠额
187   - totalDiscount () {
188   - const discountInfoList = this.orderInfo.discount_info
189   - let totalDiscount = 0
  187 + totalDiscount() {
  188 + const discountInfoList = this.orderInfo.discount_info;
  189 + let totalDiscount = 0;
190 190 if (discountInfoList) {
191 191 discountInfoList.map((discountItem, index) => {
192   - totalDiscount += Number(discountItem.value)
193   - })
  192 + totalDiscount += Number(discountItem.value);
  193 + });
194 194 }
195 195 // console.log(totalDiscount)
196   - return totalDiscount
197   - },
  196 + return totalDiscount;
  197 + }
198 198 },
199 199 methods: {
200 200 // 取消订单
201   - timeup () {
202   - this.cancleOrder()
  201 + timeup() {
  202 + this.cancleOrder();
203 203 },
204   - cancleOrder () {
205   - const uid = this.uid
206   - const openid = this.openid
  204 + cancleOrder() {
  205 + const uid = this.uid;
  206 + const openid = this.openid;
207 207 uni.showModal({
208   - title: '提示',
209   - content: '现在取消,订单不可恢复哦,确认取消吗?',
210   - success: function (res) {
  208 + title: "提示",
  209 + content: "现在取消,订单不可恢复哦,确认取消吗?",
  210 + success: function(res) {
211 211 if (res.confirm) {
212   - store.dispatch('cancelOrder/cancel', {
213   - keyname: '1',
  212 + store.dispatch("cancelOrder/cancel", {
  213 + keyname: "1",
214 214 uid: uid,
215   - openid: openid,
216   - })
  215 + openid: openid
  216 + });
217 217 } else if (res.cancel) {
218   - console.log('用户点击取消')
  218 + console.log("用户点击取消");
219 219 }
220   - },
221   - })
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   - )
  220 + }
  221 + });
240 222 },
  223 + paylog() {},
  224 + confirmOrder() {
  225 + store
  226 + .dispatch("statusConfirm/confirm", {
  227 + uid: this.uid,
  228 + openid: this.openid,
  229 + oldway: "1",
  230 + way: "2",
  231 + pay_id: this.payId,
  232 + judgeContent: "",
  233 + orderInfo: this.orderInfo.order_info
  234 + })
  235 + .then(
  236 + setTimeout(() => {
  237 + uni.navigateBack();
  238 + }, 1500)
  239 + );
  240 + }
241 241 },
242 242 filters: {
243 243 timerChange: function(value) {
244   - var newDate = new Date()
245   - newDate.setTime(value * 1000)
246   - return newDate.toLocaleString()
247   - },
248   - },
249   -}
  244 + var newDate = new Date();
  245 + newDate.setTime(value * 1000);
  246 + return newDate.toLocaleString();
  247 + }
  248 + }
  249 +};
250 250 </script>
251 251  
252 252 <style lang="scss" scoped>
... ...
src/store/modules/myOrder.js
... ... @@ -83,14 +83,16 @@ const mutations = {
83 83 };
84 84  
85 85 const actions = {
86   - getList({ commit }, param) {
87   - request({
88   - url: myOrderList,
89   - data: param,
90   - success: (res) => {
91   - // console.log(res.data);
92   - commit("INIT", res.data.data);
93   - },
  86 + getList({
  87 + commit
  88 + }, param) {
  89 + request({
  90 + url: myOrderList,
  91 + data: param,
  92 + success: (res) => {
  93 + console.log('myOrderList', res.data);
  94 + commit("INIT", res.data.data);
  95 + },
94 96 })
95 97 }
96 98 }
... ...