<template>
|
<div>
|
<div class="wrapper">
|
<div class="box page-part transaction">
|
<div class="box-contain clearfix">
|
<div class="text item"
|
v-if="$store.state.productSetting.indexDisplay || $store.state.userInfo.accountType === 1">
|
<el-tabs v-model="activeName">
|
<el-tab-pane :label="$t('myzlb') + '（' + $store.state.userInfo.enableAmt + '）'" name="first">
|
<div class="auth-box">
|
<!-- <el-alert center :closable="false" style="width:400px;margin:10px auto;"
|
title="当前股票账户可用余额" type="warning">
|
<span>{{ $store.state.userInfo.enableAmt }}</span>
|
</el-alert> -->
|
<el-form label-width="100px" v-model="form" ref="ruleForm" class="demo-form-inline">
|
<el-form-item :label="$t('hj191')" prop="number">
|
<el-input type='number' @change="getIntNumber()" v-model="form.account1"
|
:placeholder="$t('hj192')">
|
<el-button @click="selectAll1" slot="append">{{$t('hj160')}}</el-button>
|
</el-input>
|
</el-form-item>
|
</el-form>
|
<div slot="footer" class="dialog-footer">
|
<el-button type="primary" :loading="isloading" @click="Onsubmit(1)">{{$t('hj193')}}
|
</el-button>
|
</div>
|
</div>
|
</el-tab-pane>
|
<el-tab-pane :label="$t('lbzmy') + '（' + $store.state.userInfo.enableIndexAmt + '）'"
|
name="second">
|
<div class="auth-box">
|
<!-- <el-alert center :closable="false" style="width:400px;margin:10px auto;"
|
title="当前指数账户可用余额" type="warning">
|
<span>{{ $store.state.userInfo.enableIndexAmt }}</span>
|
</el-alert> -->
|
<el-form label-width="100px" v-model="form" ref="ruleForm" class="demo-form-inline">
|
<el-form-item :label="$t('hj191')" prop="number">
|
<el-input type='number' v-model="form.account2" @change="getIntNumber2"
|
:placeholder="$t('hj192')">
|
<el-button @click="selectAll2" slot="append">{{$t('hj160')}}</el-button>
|
</el-input>
|
</el-form-item>
|
</el-form>
|
<div slot="footer" class="dialog-footer">
|
<el-button type="primary" :loading="isloading" @click="Onsubmit(2)">{{$t('gptips')}}
|
</el-button>
|
</div>
|
</div>
|
</el-tab-pane>
|
</el-tabs>
|
</div>
|
</div>
|
</div>
|
</div>
|
</div>
|
</template>
|
<script>
|
import * as api from '../../../axios/api'
|
export default {
|
props: {},
|
data() {
|
return {
|
hasAuth: false,
|
isloading: false,
|
form: {
|
account1: '',
|
account2: '',
|
account3: '',
|
account4: '',
|
password: ''
|
},
|
activeName: 'first',
|
activeName2: 'first'
|
}
|
},
|
watch: {},
|
computed: {},
|
created() {
|
this.getinit()
|
},
|
mounted() {
|
this.$store.state.userMenu = 'change'
|
},
|
methods: {
|
getinit() {
|
this.getUserInfo()
|
},
|
async getUserInfo() {
|
// 获取用户信息
|
let data = await api.getUserInfo()
|
if (data.status === 0) {
|
this.$store.state.userInfo = data.data
|
this.getProductSetting()
|
}
|
},
|
getIntNumber() {
|
if (this.form.account1 >= this.$store.state.userInfo.enableAmt) {
|
this.form.account1 = this.$store.state.userInfo.enableAmt
|
}
|
this.form.account1 = Math.floor(this.form.account1)
|
},
|
getIntNumber2() {
|
if (this.form.account2 >= this.$store.state.userInfo.enableIndexAmt) {
|
this.form.account2 = this.$store.state.userInfo.enableIndexAmt
|
}
|
this.form.account2 = Math.floor(this.form.account2)
|
},
|
selectAll1() {
|
// 选择全部
|
this.form.account1 = Math.floor(this.$store.state.userInfo.enableAmt)
|
},
|
selectAll2() {
|
// 选择全部
|
this.form.account2 = Math.floor(this.$store.state.userInfo.enableIndexAmt)
|
},
|
async getProductSetting() {
|
let data = await api.getProductSetting()
|
if (data.status == 0) {
|
this.$store.state.productSetting = data.data
|
this.$parent.getcloseLoading();
|
}
|
},
|
async Onsubmit(type) {
|
// 股票转指数
|
let opt = {
|
amt: type === 1 ? this.form.account1 : type === 2 ? this.form.account2 : type === 3 ? this.form.account3 : this.form.account4,
|
type: type // 1 股票转指数 2 指数转股票
|
}
|
let data = await api.AmtChange(opt)
|
if (data.status === 0) {
|
this.$message.success(data.msg)
|
this.getUserInfo()
|
} else {
|
this.$message.error(data.msg)
|
}
|
}
|
}
|
}
|
</script>
|
<style lang="less" scoped>
|
/deep/ .el-button--primary {
|
background-color: #409EFF !important;
|
border-color: #409EFF !important;
|
}
|
|
.black-bg .change .el-input-group {
|
height: 41px;
|
}
|
|
.code {
|
font-size: 12px;
|
color: #999;
|
}
|
|
.auth-box {
|
|
.el-row {
|
margin-bottom: 10px;
|
}
|
}
|
|
.authed-box {
|
.el-row {
|
padding-top: 40px;
|
width: 400px;
|
margin: 0 auto;
|
}
|
}
|
|
.wrapper {
|
padding: 20px;
|
padding-top: 0;
|
width: 60%;
|
margin: 0 auto;
|
|
.demo-form-inline {
|
// width: 400px;
|
margin: 20px auto;
|
}
|
|
.auth-box {
|
.dialog-footer {
|
text-align: center;
|
|
.el-button {
|
padding-left: 50px;
|
padding-right: 50px;
|
border-radius: 22px;
|
}
|
}
|
}
|
|
.prompt-box {
|
padding-bottom: 20px;
|
color: #f44336;
|
|
p {
|
line-height: 24px;
|
}
|
}
|
|
.rule-box {
|
margin-top: 30px;
|
line-height: 26px;
|
margin-left: 70px;
|
}
|
}
|
|
|
/deep/ .el-tabs__nav-wrap::after {
|
content: unset !important;
|
}
|
|
/deep/ .el-tabs__item {
|
color: #c9c9c9;
|
}
|
|
/deep/ .el-tabs__item.is-active {
|
color: #409EFF;
|
}
|
|
/deep/ .el-tabs__nav-scroll {
|
display: flex;
|
justify-content: center;
|
}
|
|
/deep/ .el-tabs__header {
|
margin-bottom: 0;
|
margin-top: 15px;
|
}
|
|
/dee/ .el-form-item__label {
|
color: #f0be83 !important;
|
}
|
</style>
|
