|
|
@@ -0,0 +1,417 @@
|
|
|
+<template>
|
|
|
+ <div>
|
|
|
+ <div class="defbb p-spac">
|
|
|
+ 平台账户授权 [
|
|
|
+ <span class="gray-color" :class="{ 'green-color': true }">{{
|
|
|
+ stateText
|
|
|
+ }}</span>
|
|
|
+ ]<span class="ml-spac p-wcolor" v-if="waring"> [ 提醒:请先绑定“授权手机号”!]</span>
|
|
|
+ </div>
|
|
|
+ <div class="items p-spacd2">
|
|
|
+ <div class="center justify-between p-spacd2 defbb">
|
|
|
+ <div>授权手机号</div>
|
|
|
+ <div>
|
|
|
+ <span class="mr-spac">{{ bindPhone }}</span>
|
|
|
+ <el-button type="text" @click="saveTel()">{{
|
|
|
+ bindPhoneText
|
|
|
+ }}</el-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="center justify-between p-spacd2 defbb">
|
|
|
+ <div>转账授权</div>
|
|
|
+ <div
|
|
|
+ class="pointer p-color"
|
|
|
+ :class="{ 'gray-color': !isBindPhone}"
|
|
|
+ @click="authEvent(0)"
|
|
|
+ >
|
|
|
+ 去授权
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="center justify-between p-spacd2 defbb">
|
|
|
+ <div>提现授权</div>
|
|
|
+ <div
|
|
|
+ class="pointer p-color"
|
|
|
+ :class="{ 'gray-color': !isBindPhone }"
|
|
|
+ @click="authEvent(1)"
|
|
|
+ >
|
|
|
+ 去授权
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <el-dialog
|
|
|
+ :append-to-body="true"
|
|
|
+ title="修改手机号"
|
|
|
+ :visible.sync="telDialogVisible"
|
|
|
+ @close="closeEditTelDialog"
|
|
|
+ >
|
|
|
+ <el-steps :active="stepActive" align-center>
|
|
|
+ <el-step title="解绑原手机号"></el-step>
|
|
|
+ <el-step title="绑定新手机号"></el-step>
|
|
|
+ </el-steps>
|
|
|
+ <el-form
|
|
|
+ :model="formStepOne"
|
|
|
+ v-if="stepActive === 1"
|
|
|
+ ref="formStepOne"
|
|
|
+ :rules="formStepOneRules"
|
|
|
+ >
|
|
|
+ <el-form-item label="原手机号" prop="newTel">
|
|
|
+ <el-input v-model="formStepOne.tel" disabled></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="验证码" prop="code">
|
|
|
+ <el-input v-model="formStepOne.code" clearable>
|
|
|
+ <template slot="append"
|
|
|
+ ><div class="getcode-btn" @click="getCodeEvent('formStepOne')">
|
|
|
+ {{ codeBtn.text }}
|
|
|
+ </div></template
|
|
|
+ >
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <el-form
|
|
|
+ :model="formStepTwo"
|
|
|
+ v-else-if="stepActive === 2"
|
|
|
+ ref="formStepTwo"
|
|
|
+ :rules="formStepTwoRules"
|
|
|
+ >
|
|
|
+ <el-form-item label="新手机号" prop="newTel">
|
|
|
+ <el-input v-model="formStepTwo.newTel"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="验证码" prop="code">
|
|
|
+ <el-input v-model="formStepTwo.code" clearable>
|
|
|
+ <template slot="append"
|
|
|
+ ><div class="getcode-btn" @click="getCodeEvent('formStepTwo')">
|
|
|
+ {{ codeBtn.text }}
|
|
|
+ </div></template
|
|
|
+ >
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <div slot="footer">
|
|
|
+ <el-button type="primary" @click="footerBtnEvent">{{
|
|
|
+ footerBtnText
|
|
|
+ }}</el-button>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+ <el-dialog
|
|
|
+ :append-to-body="true"
|
|
|
+ title="绑定手机号"
|
|
|
+ :visible.sync="bindTelDialogVisible"
|
|
|
+ @close="closeBindTelDialog"
|
|
|
+ >
|
|
|
+ <el-form
|
|
|
+ :model="formBindTel"
|
|
|
+ ref="formBindTel"
|
|
|
+ v-if="bindTelDialogVisible"
|
|
|
+ :rules="formBindTelRules"
|
|
|
+ >
|
|
|
+ <el-form-item label="手机号" prop="tel">
|
|
|
+ <el-input v-model="formBindTel.tel"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="验证码" prop="code" clearable>
|
|
|
+ <el-input v-model="formBindTel.code">
|
|
|
+ <template slot="append"
|
|
|
+ ><div class="getcode-btn" @click="getCodeEvent('formBindTel')">
|
|
|
+ {{ codeBtn.text }}
|
|
|
+ </div></template
|
|
|
+ >
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <div slot="footer">
|
|
|
+ <el-button type="primary" @click="bindTelEvent">确认绑定</el-button>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+import { $sendVerificationCode, $unbindPhone, $bindPhone, $signContract, $signContractQuery, $signBalanceProtocol } from '@/service/pay'
|
|
|
+export default {
|
|
|
+ name: 'authorize',
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ authClicked: false,
|
|
|
+ bindPhone: '66',
|
|
|
+ formStepOne: {
|
|
|
+ tel: '',
|
|
|
+ code: ''
|
|
|
+ },
|
|
|
+ formStepOneRules: {
|
|
|
+ code: [{ required: true, message: '此选项不能为空', trigger: 'blur' }]
|
|
|
+ },
|
|
|
+ formStepTwo: {
|
|
|
+ newTel: '',
|
|
|
+ code: ''
|
|
|
+ },
|
|
|
+ formStepTwoRules: {
|
|
|
+ newTel: [
|
|
|
+ { required: true, message: '此选项不能为空', trigger: 'blur' }
|
|
|
+ ],
|
|
|
+ code: [{ required: true, message: '此选项不能为空', trigger: 'blur' }]
|
|
|
+ },
|
|
|
+ telDialogVisible: false,
|
|
|
+ bindTelDialogVisible: false,
|
|
|
+ stepActive: 1,
|
|
|
+ codeBtn: {
|
|
|
+ text: '获取验证码',
|
|
|
+ disabled: false
|
|
|
+ },
|
|
|
+ formBindTel: {
|
|
|
+ tel: '',
|
|
|
+ code: ''
|
|
|
+ },
|
|
|
+ formBindTelRules: {
|
|
|
+ tel: [{ required: true, message: '此选项不能为空', trigger: 'blur' }],
|
|
|
+ code: [{ required: true, message: '此选项不能为空', trigger: 'blur' }]
|
|
|
+ },
|
|
|
+ footerBtnText: '下一步'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ props: {
|
|
|
+ orgInfo: {
|
|
|
+ type: Object,
|
|
|
+ default: function() {
|
|
|
+ return {}
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ stateText() {
|
|
|
+ return '未完成'
|
|
|
+ },
|
|
|
+ isBindPhone() {
|
|
|
+ return !!this.bindPhone
|
|
|
+ },
|
|
|
+ bindPhoneText() {
|
|
|
+ return this.isBindPhone ? '修改' : '绑定'
|
|
|
+ },
|
|
|
+ waring() {
|
|
|
+ return !this.isBindPhone && this.authClicked
|
|
|
+ }
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ this.formStepOne.tel = this.bindPhone
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ authEvent(type) {
|
|
|
+ this.authClicked = true
|
|
|
+ if (type === 0) {
|
|
|
+ if (this.orgInfo.contractNo) {
|
|
|
+ const params = {
|
|
|
+ bizUserId: this.orgInfo.bizUserId,
|
|
|
+ jumpUrl: window.location.href,
|
|
|
+ source: 2
|
|
|
+ }
|
|
|
+ $signContractQuery(params).then(res => {
|
|
|
+ if (res.code === 0) {
|
|
|
+ window.location.href = res.data
|
|
|
+ }
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ const params = {
|
|
|
+ bizUserId: this.orgInfo.bizUserId,
|
|
|
+ orgId: this.orgInfo.orgId,
|
|
|
+ source: 2,
|
|
|
+ backUrl: window.location.href,
|
|
|
+ jumpUrl: location.href
|
|
|
+ // jumpUrl: location.href.split('/#')[0] + '/#/signSuccess'
|
|
|
+ }
|
|
|
+ $signContract(params).then(res => {
|
|
|
+ if (res.code === 0) {
|
|
|
+ window.open(res.data.data)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if (type === 1) {
|
|
|
+ if (this.orgInfo.protocolNo) {
|
|
|
+ this.$router.push('accountSetting/balanceProtocol')
|
|
|
+ } else {
|
|
|
+ const params = {
|
|
|
+ bizUserId: this.orgInfo.bizUserId,
|
|
|
+ orgId: this.orgInfo.orgId,
|
|
|
+ source: 2,
|
|
|
+ backUrl: window.location.href,
|
|
|
+ jumpUrl: location.href
|
|
|
+ // jumpUrl: location.href.split('/#')[0] + '/#/signSuccess'
|
|
|
+ }
|
|
|
+ $signBalanceProtocol(params).then(res => {
|
|
|
+ if (res.code === 0) {
|
|
|
+ window.open(res.data)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ bindTelEvent() {
|
|
|
+ this.$refs.formBindTel.validate((valid) => {
|
|
|
+ if (valid) {
|
|
|
+ const params = {
|
|
|
+ bizUserId: this.bizUserId,
|
|
|
+ verificationCode: this.formBindTel.code,
|
|
|
+ phone: this.formBindTel.tel
|
|
|
+ }
|
|
|
+ $bindPhone(params).then((res) => {
|
|
|
+ this.$message.success(res.message)
|
|
|
+ this.bindPhone = this.formBindTel.tel
|
|
|
+ this.formStepOne.tel = this.formBindTel.tel
|
|
|
+ this.bindTelDialogVisible = false
|
|
|
+ })
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ saveTel() {
|
|
|
+ if (this.isBindPhone) {
|
|
|
+ this.telDialogVisible = true
|
|
|
+ if (this.timer) {
|
|
|
+ clearInterval(this.timer)
|
|
|
+ this.codeBtn.text = '获取验证码'
|
|
|
+ this.codeBtn.disabled = false
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ this.bindTelDialogVisible = true
|
|
|
+ }
|
|
|
+ },
|
|
|
+ getCodeEvent(param) {
|
|
|
+ // let step = this.stepActive
|
|
|
+ if (this.codeBtn.disabled) {
|
|
|
+ return
|
|
|
+ }
|
|
|
+ if (param === 'formStepOne') {
|
|
|
+ this.codeEvent(this.formStepOne.tel, param)
|
|
|
+ } else if (param === 'formStepTwo') {
|
|
|
+ this.$refs[param].validateField('newTel', (valid) => {
|
|
|
+ if (!valid) {
|
|
|
+ this.codeEvent(this.formStepTwo.newTel, param)
|
|
|
+ } else {
|
|
|
+ return null
|
|
|
+ }
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ this.$refs[param].validateField('tel', (valid) => {
|
|
|
+ if (!valid) {
|
|
|
+ this.codeEvent(this.formBindTel.tel, param)
|
|
|
+ } else {
|
|
|
+ return null
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ codeEvent(tel, param) {
|
|
|
+ let verificationCodeType = 0
|
|
|
+ if (param === 'formStepTwo' || param === 'formBindTel') {
|
|
|
+ verificationCodeType = 9
|
|
|
+ } else {
|
|
|
+ verificationCodeType = 6
|
|
|
+ }
|
|
|
+ const params = {
|
|
|
+ phone: tel,
|
|
|
+ bizUserId: this.bizUserId,
|
|
|
+ verificationCodeType
|
|
|
+ }
|
|
|
+ $sendVerificationCode(params)
|
|
|
+ .then((res) => {
|
|
|
+ this.$message.success(res.message)
|
|
|
+ })
|
|
|
+ .catch((msg) => {
|
|
|
+ clearInterval(this.timer)
|
|
|
+ this.codeBtn.text = '获取验证码'
|
|
|
+ this.codeBtn.disabled = false
|
|
|
+ })
|
|
|
+ let time = 60
|
|
|
+ this.codeBtn.text = time + 's'
|
|
|
+ this.timer = setInterval(() => {
|
|
|
+ time--
|
|
|
+ this.codeBtn.text = time + 's'
|
|
|
+ this.codeBtn.disabled = true
|
|
|
+ if (time < 0) {
|
|
|
+ clearInterval(this.timer)
|
|
|
+ this.codeBtn.text = '获取验证码'
|
|
|
+ this.codeBtn.disabled = false
|
|
|
+ }
|
|
|
+ }, 1000)
|
|
|
+ },
|
|
|
+ footerBtnEvent() {
|
|
|
+ if (this.stepActive === 1) {
|
|
|
+ this.$refs.formStepOne.validateField('code', (valid) => {
|
|
|
+ if (!valid) {
|
|
|
+ const code = this.formStepOne.code
|
|
|
+ const params = {
|
|
|
+ phone: this.formStepOne.tel,
|
|
|
+ bizUserId: this.bizUserId,
|
|
|
+ verificationCode: code
|
|
|
+ }
|
|
|
+ $unbindPhone(params).then((res) => {
|
|
|
+ if (res.code === 0) {
|
|
|
+ this.stepActive = 2
|
|
|
+ this.footerBtnText = '确认修改'
|
|
|
+ this.$message.success(res.message)
|
|
|
+ this.bindPhone = ''
|
|
|
+ if (this.timer) {
|
|
|
+ clearInterval(this.timer)
|
|
|
+ this.codeBtn.text = '获取验证码'
|
|
|
+ this.codeBtn.disabled = false
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ this.$message.error(res.message)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ return null
|
|
|
+ }
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ this.$refs.formStepTwo.validate((valid) => {
|
|
|
+ if (valid) {
|
|
|
+ const params = {
|
|
|
+ phone: this.formStepTwo.newTel,
|
|
|
+ bizUserId: this.bizUserId,
|
|
|
+ verificationCode: this.formStepTwo.code
|
|
|
+ }
|
|
|
+ $bindPhone(params).then((res) => {
|
|
|
+ if (res.code === 0) {
|
|
|
+ this.stepActive = 1
|
|
|
+ this.formStepOne.code = ''
|
|
|
+ this.formStepTwo.tel = ''
|
|
|
+ this.formStepTwo.code = ''
|
|
|
+ this.$message.success(res.message)
|
|
|
+ this.bindPhone = this.formStepTwo.newTel
|
|
|
+ this.telDialogVisible = false
|
|
|
+ } else {
|
|
|
+ this.$message.error(res.message)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ closeBindTelDialog() {
|
|
|
+ this.formBindTel.tel = ''
|
|
|
+ this.formBindTel.code = ''
|
|
|
+ },
|
|
|
+ closeEditTelDialog() {
|
|
|
+ this.formStepOne.code = ''
|
|
|
+ this.formStepTwo.newTel = ''
|
|
|
+ this.formStepTwo.code = ''
|
|
|
+ this.stepActive = 1
|
|
|
+ if (this.$refs.formStepOne) {
|
|
|
+ this.$refs.formStepOne.clearValidate()
|
|
|
+ }
|
|
|
+ if (this.$refs.formStepTwo) {
|
|
|
+ this.$refs.formStepTwo.clearValidate()
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+<style lang="scss" scoped>
|
|
|
+@import "submodule/utils/style/variables.scss";
|
|
|
+.items {
|
|
|
+ width: 400px;
|
|
|
+}
|
|
|
+.getcode-btn {
|
|
|
+ width: 70px;
|
|
|
+ text-align: center;
|
|
|
+ cursor: pointer;
|
|
|
+ color: $p-color;
|
|
|
+}
|
|
|
+</style>
|