422 lines
12 KiB
Vue
422 lines
12 KiB
Vue
|
<template>
|
||
|
|
<view class="content">
|
||
|
|
<view class="header">
|
||
|
|
<view class="headernei" @click="isTop = true">
|
||
|
|
<img src="@/assets/images/search.png" alt="" />
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="kuang" v-for="(item, index) in tableData" :key="index">
|
||
|
|
<table class="tftable" border="1">
|
||
|
|
<tr>
|
||
|
|
<td align="right">{{ $t("S_C_83") }}</td>
|
||
|
|
<td align="left">
|
||
|
|
<view class="theflex">
|
||
|
|
<view style="margin-right: 8rpx">
|
||
|
|
<img
|
||
|
|
style="width: 46rpx; height: 32rpx"
|
||
|
|
:src="item.pkCountryIcon"
|
||
|
|
alt=""
|
||
|
|
/></view>
|
||
|
|
<view>{{ item.pkCountryName }}</view>
|
||
|
|
</view>
|
||
|
|
</td>
|
||
|
|
</tr>
|
||
|
|
<tr v-if="showData.account1">
|
||
|
|
<td align="right">{{ $t("w_0452") + `(${isLocalSymbol()})` }}</td>
|
||
|
|
<td align="left">{{ item.account1 }}</td>
|
||
|
|
</tr>
|
||
|
|
<tr v-if="showData.account2">
|
||
|
|
<td align="right">{{ $t("w_0448") + `(${isLocalSymbol()})` }}</td>
|
||
|
|
<td align="left">{{ item.account2 }}</td>
|
||
|
|
</tr>
|
||
|
|
<tr v-if="showData.account3">
|
||
|
|
<td align="right">{{ $t("w_0453") + `(${isLocalSymbol()})` }}</td>
|
||
|
|
<td align="left">{{ item.account3 }}</td>
|
||
|
|
</tr>
|
||
|
|
<tr v-if="showData.account4">
|
||
|
|
<td align="right">{{ $t("w_0450") + `(${isLocalSymbol()})` }}</td>
|
||
|
|
<td align="left">
|
||
|
|
{{ item.account4 }}
|
||
|
|
</td>
|
||
|
|
</tr>
|
||
|
|
<tr v-if="showData.account5">
|
||
|
|
<td align="right">{{ $t("w_0454") + `(${isLocalSymbol()})` }}</td>
|
||
|
|
<td align="left">
|
||
|
|
{{ item.account5 }}
|
||
|
|
</td>
|
||
|
|
</tr>
|
||
|
|
<tr v-if="showData.account6">
|
||
|
|
<td align="right">{{ $t("w_0455") + `(${isLocalSymbol()})` }}</td>
|
||
|
|
<td align="left">
|
||
|
|
{{ item.account6 }}
|
||
|
|
</td>
|
||
|
|
</tr>
|
||
|
|
<tr v-if="showData.account7">
|
||
|
|
<td align="right">{{ $t("w_0456") + `(${isLocalSymbol()})` }}</td>
|
||
|
|
<td align="left">
|
||
|
|
{{ item.account7 }}
|
||
|
|
</td>
|
||
|
|
</tr>
|
||
|
|
<tr v-if="showData.account8">
|
||
|
|
<td align="right">
|
||
|
|
{{ $t("MN_F_T_1197") + `(${isLocalSymbol()})` }}
|
||
|
|
</td>
|
||
|
|
<td align="left">
|
||
|
|
{{ item.account8 }}
|
||
|
|
</td>
|
||
|
|
</tr>
|
||
|
|
<tr v-if="showData.account9">
|
||
|
|
<td align="right">{{ $t("w_0477") + `(${isLocalSymbol()})` }}</td>
|
||
|
|
<td align="left">
|
||
|
|
{{ item.account9 }}
|
||
|
|
</td>
|
||
|
|
</tr>
|
||
|
|
<tr v-if="showData.account10">
|
||
|
|
<td align="right">{{ $t("w_0478") + `(${isLocalSymbol()})` }}</td>
|
||
|
|
<td align="left">
|
||
|
|
{{ item.account10 }}
|
||
|
|
</td>
|
||
|
|
</tr>
|
||
|
|
<tr v-if="showData.account11">
|
||
|
|
<td align="right">{{ $t("w_0479") + `(${isLocalSymbol()})` }}</td>
|
||
|
|
<td align="left">
|
||
|
|
{{ item.account11 }}
|
||
|
|
</td>
|
||
|
|
</tr>
|
||
|
|
<tr v-if="showData.account12">
|
||
|
|
<td align="right">{{ $t("w_0480") + `(${isLocalSymbol()})` }}</td>
|
||
|
|
<td align="left">
|
||
|
|
{{ item.account12 }}
|
||
|
|
</td>
|
||
|
|
</tr>
|
||
|
|
<tr v-if="showData.settleAccount1">
|
||
|
|
<td align="right">{{ $t("w_0452") + `(${isLocals()})` }}</td>
|
||
|
|
<td align="left">
|
||
|
|
{{ item.settleAccount1 }}
|
||
|
|
</td>
|
||
|
|
</tr>
|
||
|
|
<tr v-if="showData.settleAccount2">
|
||
|
|
<td align="right">{{ $t("w_0448") + `(${isLocals()})` }}</td>
|
||
|
|
<td align="left">{{ item.settleAccount2 }}</td>
|
||
|
|
</tr>
|
||
|
|
<tr v-if="showData.settleAccount3">
|
||
|
|
<td align="right">{{ $t("w_0453") + `(${isLocals()})` }}</td>
|
||
|
|
<td align="left">{{ item.settleAccount3 }}</td>
|
||
|
|
</tr>
|
||
|
|
<tr v-if="showData.settleAccount4">
|
||
|
|
<td align="right">{{ $t("w_0450") + `(${isLocals()})` }}</td>
|
||
|
|
<td align="left">{{ item.settleAccount4 }}</td>
|
||
|
|
</tr>
|
||
|
|
<tr v-if="showData.settleAccount5">
|
||
|
|
<td align="right">{{ $t("w_0454") + `(${isLocals()})` }}</td>
|
||
|
|
<td align="left">{{ item.settleAccount5 }}</td>
|
||
|
|
</tr>
|
||
|
|
<tr v-if="showData.settleAccount6">
|
||
|
|
<td align="right">{{ $t("w_0455") + `(${isLocals()})` }}</td>
|
||
|
|
<td align="left">{{ item.settleAccount6 }}</td>
|
||
|
|
</tr>
|
||
|
|
<tr v-if="showData.settleAccount7">
|
||
|
|
<td align="right">{{ $t("w_0456") + `(${isLocals()})` }}</td>
|
||
|
|
<td align="left">{{ item.settleAccount7 }}</td>
|
||
|
|
</tr>
|
||
|
|
<tr v-if="showData.settleAccount8">
|
||
|
|
<td align="right">{{ $t("MN_F_T_1197") + `(${isLocals()})` }}</td>
|
||
|
|
<td align="left">{{ item.settleAccount8 }}</td>
|
||
|
|
</tr>
|
||
|
|
<tr v-if="showData.settleAccount9">
|
||
|
|
<td align="right">{{ $t("w_0477") + `(${isLocals()})` }}</td>
|
||
|
|
<td align="left">{{ item.settleAccount9 }}</td>
|
||
|
|
</tr>
|
||
|
|
<tr v-if="showData.settleAccount10">
|
||
|
|
<td align="right">{{ $t("w_0478") + `(${isLocals()})` }}</td>
|
||
|
|
<td align="left">{{ item.settleAccount10 }}</td>
|
||
|
|
</tr>
|
||
|
|
<tr v-if="showData.settleAccount11">
|
||
|
|
<td align="right">{{ $t("w_0479") + `(${isLocals()})` }}</td>
|
||
|
|
<td align="left">{{ item.settleAccount11 }}</td>
|
||
|
|
</tr>
|
||
|
|
<tr v-if="showData.settleAccount12">
|
||
|
|
<td align="right">{{ $t("w_0480") + `(${isLocals()})` }}</td>
|
||
|
|
<td align="left">{{ item.settleAccount12 }}</td>
|
||
|
|
</tr>
|
||
|
|
</table>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
<!-- 顶部搜索 -->
|
||
|
|
<u-popup :show="isTop" mode="top" @close="isTop = false">
|
||
|
|
<view class="tt">
|
||
|
|
<u--form
|
||
|
|
labelPosition="left"
|
||
|
|
labelWidth="auto"
|
||
|
|
:model="select"
|
||
|
|
ref="uForm"
|
||
|
|
>
|
||
|
|
<u-row gutter="10">
|
||
|
|
<u-col span="12">
|
||
|
|
<u-form-item :label="$t('PER_DA_9')" @click="isData = true">
|
||
|
|
<u--input
|
||
|
|
disabled
|
||
|
|
fontSize="12"
|
||
|
|
disabledColor="#ffffff"
|
||
|
|
v-model="select.creationTimeVal"
|
||
|
|
suffixIcon="arrow-down"
|
||
|
|
suffixIconStyle="font-size: 12px;"
|
||
|
|
></u--input>
|
||
|
|
</u-form-item>
|
||
|
|
</u-col>
|
||
|
|
</u-row>
|
||
|
|
</u--form>
|
||
|
|
<view class="footer">
|
||
|
|
<u-button
|
||
|
|
@click="getList1"
|
||
|
|
color="#C8161D"
|
||
|
|
text="搜索"
|
||
|
|
class="btnn"
|
||
|
|
></u-button>
|
||
|
|
<u-button @click="reset" text="重置"></u-button>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</u-popup>
|
||
|
|
<u-calendar
|
||
|
|
@close="isData = false"
|
||
|
|
:closeOnClickOverlay="true"
|
||
|
|
:show="isData"
|
||
|
|
mode="range"
|
||
|
|
@confirm="confirm"
|
||
|
|
:allowSameDay="true"
|
||
|
|
:maxDate="calendar.maxDate"
|
||
|
|
:minDate="calendar.minDate"
|
||
|
|
:monthNum="calendar.monthNum"
|
||
|
|
></u-calendar>
|
||
|
|
<!-- 悬浮球 -->
|
||
|
|
<drag-button />
|
||
|
|
<export-ball v-hasButtons="['BalanceSumExport']" ref="exportBall" @handleExport="handleExport" />
|
||
|
|
</view>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import * as api from "@/api/financial";
|
||
|
|
import { isLocals, isLocalSymbol } from "@/util/numberToCurrency";
|
||
|
|
export default {
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
select: {},
|
||
|
|
isTop: false,
|
||
|
|
isData: false,
|
||
|
|
total: 0,
|
||
|
|
queryParams: {
|
||
|
|
pageNum: 1,
|
||
|
|
pageSize: 20,
|
||
|
|
},
|
||
|
|
tableData: [],
|
||
|
|
userCountry: {},
|
||
|
|
showData: {},
|
||
|
|
calendar: {
|
||
|
|
minDate: "",
|
||
|
|
maxDate: "",
|
||
|
|
monthNum: 25,
|
||
|
|
},
|
||
|
|
};
|
||
|
|
},
|
||
|
|
onLoad(options) {
|
||
|
|
if (uni.getStorageSync("userAll")) {
|
||
|
|
this.userCountry = JSON.parse(uni.getStorageSync("userAll")).country;
|
||
|
|
}
|
||
|
|
|
||
|
|
this.getOthers();
|
||
|
|
//查询会员信息
|
||
|
|
this.getSearch();
|
||
|
|
this.chooseTimed();
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
isLocalSymbol,
|
||
|
|
isLocals,
|
||
|
|
// 设置默认日期，最大值为今天，最小值为去年今天
|
||
|
|
chooseTimed() {
|
||
|
|
let date = new Date();
|
||
|
|
let year = date.getFullYear();
|
||
|
|
let month = date.getMonth() + 1;
|
||
|
|
let day = date.getDate();
|
||
|
|
if (month <= 9) {
|
||
|
|
month = "0" + month;
|
||
|
|
}
|
||
|
|
if (day <= 9) {
|
||
|
|
day = "0" + day;
|
||
|
|
}
|
||
|
|
let minyear = year - 1;
|
||
|
|
let maxyear = year + 1;
|
||
|
|
this.calendar.minDate = minyear + "-" + month + "-" + day;
|
||
|
|
this.calendar.maxDate = maxyear + "-" + month + "-" + day;
|
||
|
|
},
|
||
|
|
getOthers() {
|
||
|
|
api.getBalanceSummaryField().then((res) => {
|
||
|
|
const obj = {};
|
||
|
|
res.data.forEach((ele) => {
|
||
|
|
obj[ele] = true;
|
||
|
|
});
|
||
|
|
this.showData = obj;
|
||
|
|
});
|
||
|
|
},
|
||
|
|
onReachBottom() {
|
||
|
|
this.queryParams.pageNum++;
|
||
|
|
this.getSearch();
|
||
|
|
},
|
||
|
|
getSearch() {
|
||
|
|
api
|
||
|
|
.getBalanceSummaryList(Object.assign({}, this.queryParams, this.select))
|
||
|
|
.then((res) => {
|
||
|
|
this.total = res.total;
|
||
|
|
this.tableData = res.rows;
|
||
|
|
this.tableData.forEach((item) => {
|
||
|
|
item.pkCountryName = this.userCountry.shortName;
|
||
|
|
item.pkCountryIcon = this.userCountry.nationalFlag2;
|
||
|
|
});
|
||
|
|
});
|
||
|
|
},
|
||
|
|
getList1() {
|
||
|
|
this.tableData = [];
|
||
|
|
this.queryParams.pageNum = 1;
|
||
|
|
this.isTop = false;
|
||
|
|
this.getSearch();
|
||
|
|
},
|
||
|
|
reset() {
|
||
|
|
this.select = {};
|
||
|
|
this.getSearch();
|
||
|
|
},
|
||
|
|
handleExport() {
|
||
|
|
let url = "/member/manager/account-detail/export";
|
||
|
|
let obj = Object.assign({}, this.select, this.queryParams);
|
||
|
|
this.$refs.exportBall.handleExport(url, obj, this.$t("w_0483"));
|
||
|
|
},
|
||
|
|
bindPickerChange2(e) {
|
||
|
|
this.$set(
|
||
|
|
this.select,
|
||
|
|
"accountName",
|
||
|
|
this.accountList[e.detail.value].accountName
|
||
|
|
);
|
||
|
|
this.$set(
|
||
|
|
this.select,
|
||
|
|
"pkAccount",
|
||
|
|
this.accountList[e.detail.value].pkId
|
||
|
|
);
|
||
|
|
},
|
||
|
|
bindPickerChange1(e) {
|
||
|
|
this.$set(
|
||
|
|
this.select,
|
||
|
|
"statusVal",
|
||
|
|
this.statusList[e.detail.value].label
|
||
|
|
);
|
||
|
|
this.$set(this.select, "status", this.statusList[e.detail.value].value);
|
||
|
|
},
|
||
|
|
bindPickerChange3(e) {
|
||
|
|
this.$set(
|
||
|
|
this.select,
|
||
|
|
"shStateVal",
|
||
|
|
this.shStateList[e.detail.value].label
|
||
|
|
);
|
||
|
|
this.$set(
|
||
|
|
this.select,
|
||
|
|
"approveState",
|
||
|
|
this.shStateList[e.detail.value].value
|
||
|
|
);
|
||
|
|
},
|
||
|
|
|
||
|
|
confirm(e) {
|
||
|
|
this.$set(this.select, "startDate", e[0]);
|
||
|
|
this.$set(this.select, "endDate", e[e.length - 1]);
|
||
|
|
this.$set(
|
||
|
|
this.select,
|
||
|
|
"creationTimeVal",
|
||
|
|
e[0] + " 至 " + e[e.length - 1]
|
||
|
|
);
|
||
|
|
this.isData = false;
|
||
|
|
},
|
||
|
|
},
|
||
|
|
};
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style lang="scss" scoped>
|
||
|
|
.content {
|
||
|
|
background: #f9f9f9;
|
||
|
|
padding: 20rpx 24rpx;
|
||
|
|
}
|
||
|
|
.header {
|
||
|
|
background: #ffffff;
|
||
|
|
box-shadow: 0px 2px 10px 0px rgba(204, 204, 204, 0.4);
|
||
|
|
border-radius: 20rpx;
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: space-between;
|
||
|
|
padding: 20rpx;
|
||
|
|
.headernei {
|
||
|
|
background: rgba(216, 216, 216, 0);
|
||
|
|
border-radius: 64rpx;
|
||
|
|
opacity: 1;
|
||
|
|
border: 2rpx solid #259dfe;
|
||
|
|
width: 100%;
|
||
|
|
padding: 22rpx 20rpx;
|
||
|
|
img {
|
||
|
|
width: 24rpx;
|
||
|
|
height: 24rpx;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.kuang {
|
||
|
|
background: #ffffff;
|
||
|
|
box-shadow: 0rpx 4rpx 20rpx 0rpx rgba(204, 204, 204, 0.4);
|
||
|
|
border-radius: 20rpx;
|
||
|
|
margin-bottom: 20rpx;
|
||
|
|
}
|
||
|
|
.tftable {
|
||
|
|
border-collapse: collapse;
|
||
|
|
width: 100%;
|
||
|
|
background: #fff;
|
||
|
|
border: 1px solid #f9f9f9;
|
||
|
|
margin-top: 20rpx;
|
||
|
|
td {
|
||
|
|
font-size: 24rpx;
|
||
|
|
font-family: PingFang SC-Medium, PingFang SC;
|
||
|
|
font-weight: 500;
|
||
|
|
color: #999;
|
||
|
|
padding: 20rpx 40rpx;
|
||
|
|
width: 50%;
|
||
|
|
}
|
||
|
|
tr :nth-child(2) {
|
||
|
|
color: #333333;
|
||
|
|
font-size: 26rpx;
|
||
|
|
}
|
||
|
|
.theflex {
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.che {
|
||
|
|
padding: 20rpx 40rpx;
|
||
|
|
}
|
||
|
|
.tt {
|
||
|
|
padding: 20rpx;
|
||
|
|
margin-top: 20px;
|
||
|
|
font-size: 24rpx;
|
||
|
|
}
|
||
|
|
::v-deep .u-transition {
|
||
|
|
z-index: 998 !important;
|
||
|
|
}
|
||
|
|
.footer {
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
padding: 20rpx 60rpx;
|
||
|
|
font-size: 24rpx;
|
||
|
|
.btnn {
|
||
|
|
margin-right: 40rpx;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
::v-deep .u-input {
|
||
|
|
padding: 0 9px !important;
|
||
|
|
}
|
||
|
|
::v-deep .u-form-item__body__left__content__label {
|
||
|
|
font-size: 12px;
|
||
|
|
}
|
||
|
|
::v-deep .u-form-item__body {
|
||
|
|
padding: 5px 0;
|
||
|
|
}
|
||
|
|
</style>
|