|
|
@@ -0,0 +1,208 @@
|
|
|
+<template>
|
|
|
+ <div class="app-container" v-loading="loading">
|
|
|
+ <el-form ref="form" :model="form" label-position="right" label-width="130px">
|
|
|
+ <el-row :gutter="10">
|
|
|
+ <el-col :xs="24" :sm="24" :lg="6">
|
|
|
+ <el-form-item :label="$t('finance.transferType')" prop="type" :placeholder="$t('finance.selectTransferType')" required>
|
|
|
+ <el-select v-model="form.type" class="filter-item">
|
|
|
+ <el-option v-for="(item,key) in transferConfig" :key="key" :label="item.outName + ' To ' + item.inName" :value="item.typeId" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('finance.currentAvailableBonus')">
|
|
|
+ <el-tag type="success">{{ balance }} {{ $t('currency.naira') }}</el-tag>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('finance.currentAvailableEcoin')">
|
|
|
+ <el-tag type="success">{{ cash }} {{ $t('currency.naira') }}</el-tag>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('finance.currentTransferRatio')" v-if="false">
|
|
|
+ <el-tag type="info">{{ transferProp }}%</el-tag>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('finance.maximumTransferAmount')" v-if="false">
|
|
|
+ <el-tag type="info">{{ maxAmount }} {{ $t('currency.naira') }}</el-tag>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('finance.memberCode')" prop="toUserName" required>
|
|
|
+ <el-input size="small" v-model.trim="form.toUserName" type="text" @change="fetchMember"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('finance.memberName')" prop="toRealName" v-show="form.toRealName !== null">
|
|
|
+ <el-input size="small" v-model.trim="form.toRealName" type="text" disabled></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('finance.transferAmount')" prop="amount" required>
|
|
|
+ <el-input v-model.number="form.amount" type="number" :min="minAmount" :max="maxAmount" @change="chkReal"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('finance.transferAmount')" v-show="fee > 0">
|
|
|
+ <el-tag type="info">{{ fee }}%</el-tag>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('finance.actualAmountTransferredInto')" v-show="fee > 0">
|
|
|
+ <el-tag type="warning">{{ realAmount }} {{ $t('currency.naira') }}</el-tag>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('finance.remark')" prop="remark">
|
|
|
+ <el-input size="small" v-model.trim="form.remark" type="text"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item>
|
|
|
+ <el-button type="warning" size="small" @click="transferList">{{ $t('table.cancel') }}</el-button>
|
|
|
+ <el-button type="primary" size="small" @click="submit('form')">{{ $t('table.confirm') }}</el-button>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import {fetchApplyTransfer, fetchBalance, fetchChkTransferUser, fetchFullInfo, fetchTransferCode} from '@/api/finance'
|
|
|
+import waves from '@/directive/waves'
|
|
|
+import Pagination from '@/components/Pagination'
|
|
|
+import tool from "@/utils/tool"
|
|
|
+import usersInfo from "@/utils/usersInfo";
|
|
|
+
|
|
|
+export default {
|
|
|
+ name: 'transferApply',
|
|
|
+ components: { Pagination },
|
|
|
+ directives: { waves },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ tool: tool,
|
|
|
+ loading: false,
|
|
|
+ form: {
|
|
|
+ type: 1,
|
|
|
+ toUserName: '',
|
|
|
+ toRealName: null,
|
|
|
+ amount: 0,
|
|
|
+ payPassword: '',
|
|
|
+ remark: '',
|
|
|
+ transferCode: '',
|
|
|
+ },
|
|
|
+ userInfo: {
|
|
|
+ TRANSFER_PROP: 100
|
|
|
+ },
|
|
|
+ transferConfig: [],
|
|
|
+ minAmount: 0,
|
|
|
+ maxAmount: 0,
|
|
|
+ transferProp: 0,
|
|
|
+ fee: 0,
|
|
|
+ cash: 0,
|
|
|
+ balance: 0,
|
|
|
+ realAmount: 0,
|
|
|
+ minAmountAllow: 5000,
|
|
|
+
|
|
|
+ submitButtonStat: false,
|
|
|
+ }
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ this.applyTransfer()
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ this.fetchBalance()
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ applyTransfer() {
|
|
|
+ this.loading = true
|
|
|
+ fetchChkTransferUser().then(response => {
|
|
|
+ this.userInfo = response.data.userInfo
|
|
|
+ this.transferConfig = response.data.transferConfig
|
|
|
+ this.minAmount = response.data.minAmount
|
|
|
+ // 奖金转现金
|
|
|
+ this.fee = this.transferConfig[this.form.type - 1].fee
|
|
|
+
|
|
|
+ setTimeout(() => {
|
|
|
+ this.loading = false
|
|
|
+ }, 0.5 * 1000)
|
|
|
+ })
|
|
|
+ },
|
|
|
+ fetchBalance() {
|
|
|
+ fetchBalance().then(response => {
|
|
|
+ this.balance = response.data.bonus
|
|
|
+ this.cash = response.data.cash
|
|
|
+ this.maxAmount = parseFloat(tool.formatPrice(this.balance * this.userInfo.TRANSFER_PROP * 0.01))
|
|
|
+ this.transferProp = this.userInfo.TRANSFER_PROP
|
|
|
+ })
|
|
|
+ },
|
|
|
+ fetchMember () {
|
|
|
+ let toUserName = this.form.toUserName.trim()
|
|
|
+ // 不允许向自己转账
|
|
|
+ if (usersInfo.userName() === toUserName) {
|
|
|
+ this.form.toUserName = ''
|
|
|
+ this.$message({
|
|
|
+ message: this.$t('finance.transferNotAllow'),
|
|
|
+ type: 'error'
|
|
|
+ })
|
|
|
+ return false
|
|
|
+ }
|
|
|
+
|
|
|
+ this.listLoading = true
|
|
|
+ fetchFullInfo({ userName: toUserName }).then(response => {
|
|
|
+ this.form.toRealName = response.data.REAL_NAME
|
|
|
+ this.listLoading = false
|
|
|
+ })
|
|
|
+ },
|
|
|
+ chkReal () {
|
|
|
+ this.realAmount = tool.formatPrice(this.form.amount * (100 - this.fee) * 0.01)
|
|
|
+ if (this.realAmount < this.minAmountAllow) {
|
|
|
+ this.$message({
|
|
|
+ message: this.$t('finance.lessTransferHint').replace('%s', this.minAmountAllow + ' NGN'),
|
|
|
+ type: 'error',
|
|
|
+ duration: 3 * 1000
|
|
|
+ })
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ return true
|
|
|
+ },
|
|
|
+ submit() {
|
|
|
+ if (this.chkReal() === false) {
|
|
|
+ return false
|
|
|
+ }
|
|
|
+
|
|
|
+ // 获取转账码
|
|
|
+ fetchTransferCode().then(response => {
|
|
|
+ this.form.transferCode = response.data.transferCode
|
|
|
+ }).catch((err) => {
|
|
|
+ this.$message({
|
|
|
+ message: err,
|
|
|
+ type: 'error',
|
|
|
+ duration: 3 * 1000
|
|
|
+ })
|
|
|
+ return false
|
|
|
+ })
|
|
|
+
|
|
|
+ this.$prompt(this.$t('finance.enterPasswordTips'), this.$t('common.hint'), {
|
|
|
+ confirmButtonText: this.$t('common.confirm'),
|
|
|
+ cancelButtonText: this.$t('common.cancel'),
|
|
|
+ inputType: 'password',
|
|
|
+ inputPattern: /\S+/,
|
|
|
+ inputErrorMessage: this.$t('finance.enterPasswordTips'),
|
|
|
+ beforeClose: async (action, instance, done) => {
|
|
|
+ if (action === 'confirm') {
|
|
|
+ instance.confirmButtonLoading = true
|
|
|
+ instance.confirmButtonText = 'executing..'// this.$t('finance.executing')
|
|
|
+ this.form.payPassword = instance.inputValue
|
|
|
+ this.submitButtonStat = true
|
|
|
+ fetchApplyTransfer(this.form).then(() => {
|
|
|
+ this.$refs['form'].resetFields()
|
|
|
+ this.$message({
|
|
|
+ message: this.$t('finance.messageApplyTransfer'),
|
|
|
+ type: 'success',
|
|
|
+ duration: 3 * 1000
|
|
|
+ })
|
|
|
+ this.submitButtonStat = false
|
|
|
+ }).catch((err) => {
|
|
|
+ this.$message({
|
|
|
+ message: err,
|
|
|
+ type: 'error',
|
|
|
+ duration: 3 * 1000
|
|
|
+ })
|
|
|
+ this.submitButtonStat = false
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ this.submitButtonStat = false
|
|
|
+ done()
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ transferList() {
|
|
|
+ this.$refs['form'].resetFields()
|
|
|
+ this.$router.push({path: `/finance/transfer-list`})
|
|
|
+ },
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
kevin_zhangl