123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268 |
- <template>
- <mescroll-uni ref="mescrollRef" top="80rpx" @init="mescrollInit" @down="downCallback" @up="upCallback"
- :down="downOption" :up="upOption">
- <view class="order-list">
- <view v-for="(item, index) in orderList" :key="index" class="order-item bg-white m-t-20">
- <router-link
- :to="{path: '/bundle/pages/exchange_order_details/exchange_order_details', query: {id: item.id}}">
- <view class="order-header flex row-between">
- <view class="flex">
- <view class="m-r-10">
- {{ item.create_time }}
- </view>
- </view>
- <view class="primary">
- {{ item.order_status }}
- </view>
- </view>
- <view class="order-con">
- <view class="order-goods flex">
- <u-image :src="item.goods.image" border-radius="10" width="160" height="160"></u-image>
- <view class="goods-info flex-1 m-l-20">
- <view class="goods-name line-2">{{ item.goods.name }}</view>
- <view class="flex row-between">
- <view class="goods-price primary m-t-10">
- <price-format :show-subscript="false" :first-size="36" :second-size="24"
- :price="item.goods.need_integral" />
- <text class="xs">券</text>
- <block v-if="item.goods.exchange_way === 2">
- <text>+</text>
- <price-format :show-subscript="false" :first-size="36" :second-size="24"
- :price="item.goods.need_money" />
- <text class="xs">元</text>
- </block>
- </view>
- <view class="lighter">×{{item.total_num}}</view>
- </view>
- </view>
- </view>
- <view class="all-price flex row-right">
- <text class="muted xs">共{{item.total_num}}件商品,实付款:</text>
- <view class="">
- <price-format :show-subscript="false" :first-size="36" :second-size="24"
- :price="item.order_integral" :weight="500" />
- <text class="xs">券</text>
- <block v-if="item.order_amount > 0">
- <text>+</text>
- <price-format :show-subscript="false" :first-size="36" :second-size="24"
- :price="item.order_amount" :weight="500" />
- <text class="xs">元</text>
- </block>
- </view>
- </view>
- </view>
- <view class="order-footer flex row-right"
- v-if="item.btns.cancel_btn || item.btns.delivery_btn || item.btns.confirm_btn || item.btns.del_btn || item.btns.pay_btn">
- <view v-if="item.btns.cancel_btn">
- <button size="sm" class="plain br60 lighter" hover-class="none"
- @tap.stop="handleOrder(item.id, 0)">
- 取消订单
- </button>
- </view>
- <view v-if="item.btns.delivery_btn" @tap.stop="">
- <router-link
- :to="{path: '/bundle/pages/goods_logistics/goods_logistics', query: {id: item.id, type: 'integral'}}">
- <button size="sm" class="btn plain br60 lighter" hover-class="none">查看物流</button>
- </router-link>
- </view>
- <view v-if="item.btns.del_btn">
- <button size="sm" class="btn plain br60 lighter" hover-class="none"
- @tap.stop="handleOrder(item.id, 1)">删除订单</button>
- </view>
- <view v-if="item.btns.pay_btn" class="m-l-20">
- <router-link
- :to="{path: '/pages/payment/payment', query: {from: 'integral', order_id: item.id}}">
- <button size="sm" class="btn bg-primary br60 white">
- 立即付款
- </button>
- </router-link>
- </view>
- <view v-if="item.btns.confirm_btn" class="m-l-20">
- <button size="sm" class="btn plain br60 primary red" hover-class="none"
- @tap.stop="handleOrder(item.id, 2)">确认收货</button>
- </view>
- </view>
- </router-link>
- </view>
- </view>
- <order-dialog ref="orderDialog" :order-id="orderId" :type="type" @confirm="confirmDialog"></order-dialog>
- </mescroll-uni>
- </template>
- <script>
- import MescrollMixin from "@/components/mescroll-uni/mescroll-mixins";
- import MescrollMoreItemMixin from "@/components/mescroll-uni/mixins/mescroll-more-item";
- import {
- getIntegralOrder,
- cancelIntegralOrder,
- delIntegralOrder,
- confirmIntegralOrder
- } from '@/api/activity';
- export default {
- mixins: [MescrollMixin, MescrollMoreItemMixin],
- data() {
- return {
- orderList: [],
- downOption: {
- auto: false
- },
- upOption: {
- auto: false,
- noMoreSize: 4,
- empty: {
- icon: '/static/images/order_null.png',
- tip: '暂无订单~',
- fixed: true
- }
- },
- showCancel: false,
- type: 0,
- orderId: "",
- showLoading: false
- };
- },
- props: {
- orderType: {
- type: [Number, String]
- }
- },
- created() {
- uni.$on("refreshorder", () => {
- this.refresh()
- })
- uni.$on('payment', params => {
- setTimeout(() => {
- console.log(params)
- if (params.result) {
- this.$toast({
- title: "支付成功"
- })
- this.refresh()
- } else {
- this.$toast({
- title: "支付失败"
- })
- }
- }, 500)
- })
- },
- destroyed() {
- uni.$off("payment")
- uni.$off("refreshorder")
- },
- methods: {
- async confirmDialog() {
- const {
- type,
- orderId
- } = this
- let res = null
- switch (type) {
- case 0:
- res = await cancelIntegralOrder(orderId);
- break;
- case 1:
- res = await delIntegralOrder(orderId);
- break;
- case 2:
- res = await confirmIntegralOrder(orderId);
- break;
- }
- if (res.code == 1) {
- this.refresh()
- this.$toast({
- title: res.msg
- });
- }
- },
- dialogOpen() {
- this.$refs.orderDialog.open()
- },
- refresh() {
- this.mescroll.resetUpScroll()
- },
- handleOrder(id, type) {
- this.orderId = id
- this.type = type
- this.$nextTick(() => {
- this.dialogOpen();
- });
- },
- upCallback(page) {
- let pageNum = page.num;
- let pageSize = page.size;
- let {
- orderType,
- } = this;
- getIntegralOrder({
- page_size: pageSize,
- page_no: pageNum,
- type: orderType
- }).then(({
- data
- }) => {
- let curPageData = data.list;
- let curPageLen = curPageData.length;
- let hasNext = !!data.more;
- if (page.num == 1) this.orderList = [];
- this.orderList = this.orderList.concat(curPageData);
- this.mescroll.endSuccess(curPageLen, hasNext);
- })
- },
- },
- computed: {
- }
- };
- </script>
- <style lang="scss">
- .order-list {
- padding: 0 20rpx;
- overflow: hidden;
- .order-item {
- border-radius: 10rpx;
- .order-header {
- height: 80rpx;
- padding: 0 24rpx;
- border-bottom: 1px dotted #E5E5E5;
- }
- .order-goods {
- padding: 30rpx 24rpx;
- .goods-name {
- line-height: 40rpx;
- height: 80rpx;
- }
- }
- .all-price {
- text-align: right;
- padding: 0 24rpx 20rpx;
- }
- .order-footer {
- height: 100rpx;
- border-top: $-solid-border;
- padding: 0 24rpx;
- .plain {
- border: 1px solid #BBBBBB;
- &.red {
- border-color: $-color-primary;
- }
- }
- }
- }
- }
- </style>
|