|
|
@@ -1,5 +1,5 @@
|
|
|
<template>
|
|
|
- <div class="mobile-pay-center vendor-pay mobile-fix-content mobile-centerfix-content" :class="{'vendor-pay-record': switchType === 'record' && recordList.length}" id="mobileFixContent" @click="setShowSelect('all', false)">
|
|
|
+ <div class="mobile-pay-center vendor-pay mobile-fix-content mobile-centerfix-content" :class="{'vendor-pay-record': switchType === 'record' && recordList.length}" id="mobileFixContent">
|
|
|
<div class="mp-head">
|
|
|
<span class="inline-block" :class="{'active': switchType === 'record'}" @click="setSwitchType('record')">交易记录</span>
|
|
|
<span class="inline-block" :class="{'active': switchType === 'account'}" @click="setSwitchType('account')">收款账户</span>
|
|
|
@@ -50,61 +50,36 @@
|
|
|
<span @click="filterRecord"><i class="iconfont icon-sousuo"></i></span>
|
|
|
</div>
|
|
|
<div class="filters-wrap">
|
|
|
- <div class="date-wrap">
|
|
|
- <label>
|
|
|
- <i class="iconfont icon-ico-date"></i>
|
|
|
- <input type="date" v-model="dateObj.fromDate" @change="setDate('fromDate')">
|
|
|
- <p v-if="filterParams.fromDate">{{filterParams.fromDate | date}}</p>
|
|
|
- </label>
|
|
|
- <span>—</span>
|
|
|
- <label>
|
|
|
- <i class="iconfont icon-ico-date"></i>
|
|
|
- <input type="date" v-model="dateObj.toDate" @change="setDate('toDate')">
|
|
|
- <p v-if="filterParams.toDate">{{filterParams.toDate | date}}</p>
|
|
|
- </label>
|
|
|
- </div>
|
|
|
- <ul class="select-wrap clearfix">
|
|
|
- <li class="inline-block fl">
|
|
|
- <div @click.stop="setShowSelect('method', !showSelectMethod)">{{filterParams.method ? filterParams.method == 1103 ? '线下支付' : '线上支付' : '交易方式'}}</div>
|
|
|
- <ul class="select-list" v-show="showSelectMethod">
|
|
|
- <li @click.stop="setSelect('method', null)">交易方式</li>
|
|
|
- <li @click.stop="setSelect('method', 1103)">线下支付</li>
|
|
|
- </ul>
|
|
|
- </li>
|
|
|
- <li class="inline-block fr">
|
|
|
- <div @click.stop="setShowSelect('status', !showSelectStatus)">{{filterParams.status || '状态'}}</div>
|
|
|
- <ul class="select-list" v-show="showSelectStatus">
|
|
|
- <li @click.stop="setSelect('status', null)">状态</li>
|
|
|
- <li @click.stop="setSelect('status', '收款成功')">收款成功</li>
|
|
|
- </ul>
|
|
|
- </li>
|
|
|
- </ul>
|
|
|
+ <base-filter
|
|
|
+ v-for="filterOption in filterOptions"
|
|
|
+ :key="filterOption.selectOption"
|
|
|
+ :selectItems="filterOption.selectItems"
|
|
|
+ :defaultVal="filterOption.defaultVal"
|
|
|
+ :selectOption="filterOption.selectOption"
|
|
|
+ @selectAction="onSelectAction"
|
|
|
+ :title="filterOption.title"></base-filter>
|
|
|
</div>
|
|
|
<ul class="mp-list record-list" v-if="recordList.length">
|
|
|
<li v-for="record in recordList">
|
|
|
- <div class="content-line">
|
|
|
- <span class="inline-block title">时间:</span>
|
|
|
- <span class="inline-block content text-ellipse">{{record.transferTime | time}}</span>
|
|
|
- </div>
|
|
|
<div class="content-line">
|
|
|
<span class="inline-block title">订单号:</span>
|
|
|
- <span class="inline-block content text-ellipse">{{record.orderid}}</span>
|
|
|
+ <nuxt-link :to="`/mobile/order/details?uuid=${baseUtils.enidfilter(record.puid)}&type=saler`" class="inline-block content text-ellipse link">{{record.orderid}}</nuxt-link>
|
|
|
</div>
|
|
|
<div class="content-line">
|
|
|
- <span class="inline-block title">买家名称:</span>
|
|
|
- <span class="inline-block content text-ellipse">{{record.buyerentername || record.buyername}}</span>
|
|
|
+ <span class="inline-block title">金额:</span>
|
|
|
+ <span class="inline-block content text-ellipse">{{record.currencyName | currencyFilter}}{{record.total}}</span>
|
|
|
</div>
|
|
|
<div class="content-line">
|
|
|
- <span class="inline-block title">币种:</span>
|
|
|
- <span class="inline-block content text-ellipse">{{record.currencyName}}</span>
|
|
|
+ <span class="inline-block title">买家:</span>
|
|
|
+ <span class="inline-block content text-ellipse">{{record.buyerentername || record.buyername}}</span>
|
|
|
</div>
|
|
|
<div class="content-line">
|
|
|
- <span class="inline-block title">金额:</span>
|
|
|
- <span class="inline-block content text-ellipse"><i class="fa fa-plus" style="color: #f51c24;"></i>{{record.total}}</span>
|
|
|
+ <span class="inline-block title">付款方式:</span>
|
|
|
+ <span class="inline-block content text-ellipse">{{record.operateType === 1063 ? '买家付款' : '平台代收'}}</span>
|
|
|
</div>
|
|
|
<div class="content-line">
|
|
|
- <span class="inline-block title">交易方式:</span>
|
|
|
- <span class="inline-block content text-ellipse">线下付款</span>
|
|
|
+ <span class="inline-block title">时间:</span>
|
|
|
+ <span class="inline-block content text-ellipse">{{record.transferTime | time}}</span>
|
|
|
</div>
|
|
|
<div class="content-line">
|
|
|
<span class="inline-block title">状态:</span>
|
|
|
@@ -116,9 +91,9 @@
|
|
|
</div>
|
|
|
<!-- 交易记录end -->
|
|
|
<div class="fix-count-wrap" v-if="recordList.length">
|
|
|
- <span class="content">收入总计:<span>{{currencySymbol | currencyFilter}} {{totalRecordPrice}}</span></span>
|
|
|
- <span class="content">支出总计:<span>{{currencySymbol | currencyFilter}} 0</span></span>
|
|
|
- <p>结余:{{currencySymbol | currencyFilter}} {{totalRecordPrice}} (共计{{recordList.length || 0}}笔交易)</p>
|
|
|
+ <span class="content">已收总计:<span>{{currencySymbol | currencyFilter}} {{totalRecordPrice}}</span></span>
|
|
|
+ <!--<span class="content">支出总计:<span>{{currencySymbol | currencyFilter}} 0</span></span>
|
|
|
+ <p>结余:{{currencySymbol | currencyFilter}} {{totalRecordPrice}} (共计{{recordList.length || 0}}笔交易)</p>-->
|
|
|
</div>
|
|
|
<!-- 新增账户弹框start -->
|
|
|
<modal-wrapper :noHeader="true" :showModal="showModal" @closeAction="showModal = false">
|
|
|
@@ -196,7 +171,7 @@
|
|
|
</template>
|
|
|
<script>
|
|
|
import { RemindBox, PullUp, EmptyStatus } from '~components/mobile/common'
|
|
|
- import { ModalWrapper } from '~components/mobile/base'
|
|
|
+ import { ModalWrapper, BaseFilter } from '~components/mobile/base'
|
|
|
export default {
|
|
|
layout: 'mobile',
|
|
|
middleware: 'authenticated',
|
|
|
@@ -233,8 +208,6 @@
|
|
|
method: '',
|
|
|
status: ''
|
|
|
},
|
|
|
- showSelectMethod: false,
|
|
|
- showSelectStatus: false,
|
|
|
currentId: '',
|
|
|
showReuseModal: false,
|
|
|
totalRecordPrice: 0,
|
|
|
@@ -242,14 +215,65 @@
|
|
|
dateObj: {
|
|
|
fromDate: '',
|
|
|
toDate: ''
|
|
|
- }
|
|
|
+ },
|
|
|
+ filterOptions: [
|
|
|
+ {
|
|
|
+ title: '交易方式',
|
|
|
+ selectOption: 'method',
|
|
|
+ selectItems: [{key: '全部',
|
|
|
+ val: 0
|
|
|
+ }, {
|
|
|
+ key: '买家付款',
|
|
|
+ val: 1
|
|
|
+ }, {
|
|
|
+ key: '平台代收',
|
|
|
+ val: 2
|
|
|
+ }],
|
|
|
+ defaultVal: 0
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '交易状态',
|
|
|
+ selectOption: 'status',
|
|
|
+ selectItems: [{key: '全部',
|
|
|
+ val: 0
|
|
|
+ }, {
|
|
|
+ key: '已收款',
|
|
|
+ val: 1
|
|
|
+ }, {
|
|
|
+ key: '待收款',
|
|
|
+ val: 2
|
|
|
+ }],
|
|
|
+ defaultVal: 0
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '交易时间',
|
|
|
+ selectOption: 'date',
|
|
|
+ selectItems: [{key: '全部',
|
|
|
+ val: 0
|
|
|
+ }, {
|
|
|
+ key: '一个月',
|
|
|
+ val: 1
|
|
|
+ }, {
|
|
|
+ key: '三个月',
|
|
|
+ val: 2
|
|
|
+ }, {
|
|
|
+ key: '六个月',
|
|
|
+ val: 3
|
|
|
+ }, {
|
|
|
+ key: '自定义',
|
|
|
+ val: 4
|
|
|
+ }],
|
|
|
+ defaultVal: 0
|
|
|
+ }
|
|
|
+ ]
|
|
|
}
|
|
|
},
|
|
|
components: {
|
|
|
RemindBox,
|
|
|
PullUp,
|
|
|
ModalWrapper,
|
|
|
- EmptyStatus
|
|
|
+ EmptyStatus,
|
|
|
+ BaseFilter
|
|
|
},
|
|
|
fetch ({store}) {
|
|
|
return Promise.all([
|
|
|
@@ -386,25 +410,20 @@
|
|
|
this.isChange = true
|
|
|
this.reloadList()
|
|
|
},
|
|
|
- setShowSelect (type, flag) {
|
|
|
- if (type === 'all') {
|
|
|
- this.showSelectMethod = flag
|
|
|
- this.showSelectStatus = flag
|
|
|
- } else if (type === 'method') {
|
|
|
- this.showSelectMethod = flag
|
|
|
- this.showSelectStatus = false
|
|
|
- } else if (type === 'status') {
|
|
|
- this.showSelectStatus = flag
|
|
|
- this.showSelectMethod = false
|
|
|
- }
|
|
|
+ onSelectAction (selectObj) {
|
|
|
+ this.setSelect(selectObj.key, selectObj.value)
|
|
|
},
|
|
|
setSelect (type, val) {
|
|
|
- if (type === 'method') {
|
|
|
- this.filterParams.method = val
|
|
|
- this.setShowSelect('method', false)
|
|
|
- } else if (type === 'status') {
|
|
|
- this.filterParams.status = val
|
|
|
- this.setShowSelect('status', false)
|
|
|
+ if (type === 'date') {
|
|
|
+ if (val) {
|
|
|
+ this.filterParams.fromDate = val.fromDate
|
|
|
+ this.filterParams.toDate = val.toDate
|
|
|
+ } else {
|
|
|
+ this.filterParams.fromDate = null
|
|
|
+ this.filterParams.toDate = null
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ this.filterParams[type] = val
|
|
|
}
|
|
|
this.filterRecord()
|
|
|
},
|
|
|
@@ -685,7 +704,7 @@
|
|
|
background: #fff;
|
|
|
border-radius: .02rem;
|
|
|
border-top: 1px solid #bfbfbf;
|
|
|
- line-height: .63rem;
|
|
|
+ line-height: 1.25rem;
|
|
|
font-size: .28rem;
|
|
|
width: 100%;
|
|
|
padding-right: .3rem;
|