Skip to content

薪
薪瑞通-前端
Commit 16544f3c authored by 许珑标's avatar 许珑标
Browse files
Options

外部账号充值记录查询

parent 8e908fee
Hide whitespace changes
Inline Side-by-side
Showing with 724 additions and 725 deletions
src/views/business/salaryAccount/index.vue
View file @ 16544f3c
<template> <template>
<div class="app-container"> <div class="app-container">
<!-- 发薪账户管理页面 --> <!-- 发薪账户管理页面 -->
<el-tabs v-model="payType" @tab-click="handleClick" type="card"> <el-tabs v-model="payType" @tab-click="handleClick" type="card">
<el-tab-pane label="自有发薪账号" name="first"> <el-tab-pane label="自有发薪账号" name="first">
<el-form label-width="120px" label-position="left" class="formMain"> <el-form label-width="120px" label-position="left" class="formMain">
<el-row :gutter="30"> <el-row :gutter="30">
<el-col :span="8"> <el-col :span="8">
<el-form-item label="支付宝外卡卡号"> <el-form-item label="支付宝外卡卡号">
<el-input v-model="params.payAccNo" placeholder="请输入支付宝外卡卡号"></el-input> <el-input v-model="params.payAccNo" placeholder="请输入支付宝外卡卡号"></el-input>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="8"> <el-col :span="8">
<el-button type="primary" icon="el-icon-search" @click="getListAllAccInfoFN">查询</el-button> <el-button type="primary" icon="el-icon-search" @click="getListAllAccInfoFN">查询</el-button>
</el-col> </el-col>
<el-col :span="8"> <el-col :span="8">
<div class="buttonOperate"> <div class="buttonOperate">
<el-button type="primary" @click="goRegister">绑定发薪账户</el-button> <el-button type="primary" @click="goRegister">绑定发薪账户</el-button>
</div> </div>
</el-col> </el-col>
</el-row> </el-row>
</el-form> </el-form>
<el-card class="box-card" v-for="ele in ownList" :key="ele.id"> <el-card class="box-card" v-for="ele in ownList" :key="ele.id">
<el-row>
<el-col :span="16">
<div class="companyConterMain">
<div class="enterpriseImageMain">
<img class="enterpriseImage" src="@/assets/images/enterprise.png" alt="">
</div>
<div class="companyConterInformation">
<div style="width:90%;">
<el-row> <el-row>
<el-col :span="16"> <el-col :span="14">
<div class="companyConterMain"> 账户：({{ ele.companyName }})
<div class="enterpriseImageMain"> </el-col>
<img class="enterpriseImage" src="@/assets/images/enterprise.png" alt=""> <el-col :span="8">
</div> <el-button type="info" @click="viewDetail(ele)" plain>账户详情</el-button>
<div class="companyConterInformation"> </el-col>
<div style="width:90%;">
<el-row>
<el-col :span="14">
账户：({{ ele.companyName }})
</el-col>
<el-col :span="8">
<el-button type="info" @click="viewDetail(ele)" plain>账户详情</el-button>
</el-col>
</el-row>
</div>
<el-row>
<el-col :span="16">
卡号：{{ ele.payAccNo }}
</el-col>
</el-row>
<!-- <div style="width:90%;">
<el-row>
<el-col :span="8">
可转帐余额：<span style="color:#4aa3ff;">1111</span>
</el-col>
<el-col :span="8">
可用服务费：<span style="color:#4aa3ff;">1111</span>
</el-col>
<el-col :span="8">
服务费率：<span style="color:#4aa3ff;">11111</span>
</el-col>
</el-row>
</div> -->
</div>
</div>
</el-col>
<el-col :span="6" :offset="2">
<div class="operateConterMain">
<div style="width: 90%;">
<el-row>
<el-col :span="12"><el-button style="width:120px;" type="primary"
@click="ownBalanceRecharge(ele)">余额充值</el-button></el-col>
<el-col :span="12"><el-button style="width:120px;" type="primary"
@click="ownServiceChargeRecharge(ele)">服务费充值</el-button></el-col>
</el-row>
</div>
<div style="width: 90%;">
<el-row>
<el-col :span="12"><el-button style="width:120px;" type="primary" plain
@click="showBill(ele.payAccNo)">充值记录</el-button></el-col>
<el-col :span="12"><el-button style="width:120px;" type="primary" plain
@click="salarySelection(ele.payAccNo)">去发薪</el-button></el-col>
</el-row>
</div>
</div>
</el-col>
</el-row> </el-row>
</el-card> </div>
<el-empty v-if="ownList.length == 0" description="暂无账号"></el-empty> <el-row>
</el-tab-pane> <el-col :span="16">
<el-tab-pane label="第三方发薪账号" name="second"> <el-form label-width="120px" label-position="left" 卡号：{{ ele.payAccNo }}
class="formMain"> </el-col>
<el-row :gutter="30"> </el-row>
<el-col :span="8"> <!-- <div style="width:90%;">
<el-form-item label="支付宝外卡卡号"> <el-row>
<el-input placeholder="请输入支付宝外卡卡号"></el-input> <el-col :span="8">
</el-form-item> 可转帐余额：<span style="color:#4aa3ff;">1111</span>
</el-col> </el-col>
<el-col :span="8"> <el-col :span="8">
<el-button type="primary" icon="el-icon-search">查询</el-button> 可用服务费：<span style="color:#4aa3ff;">1111</span>
</el-col> </el-col>
<el-col :span="8"> <el-col :span="8">
<div class="buttonOperate"> 服务费率：<span style="color:#4aa3ff;">11111</span>
<el-button type="primary" @click="goRegister">绑定发薪账户</el-button> </el-col>
</div> </el-row>
</el-col> </div> -->
</div>
</div>
</el-col>
<el-col :span="6" :offset="2">
<div class="operateConterMain">
<div style="width: 90%;">
<el-row>
<el-col :span="12"><el-button style="width:120px;" type="primary"
@click="ownBalanceRecharge(ele)">余额充值</el-button></el-col>
<el-col :span="12"><el-button style="width:120px;" type="primary"
@click="ownServiceChargeRecharge(ele)">服务费充值</el-button></el-col>
</el-row>
</div>
<div style="width: 90%;">
<el-row>
<el-col :span="12"><el-button style="width:120px;" type="primary" plain
@click="showBill(ele.payAccNo)">充值记录</el-button></el-col>
<el-col :span="12"><el-button style="width:120px;" type="primary" plain
@click="salarySelection(ele.payAccNo)">去发薪</el-button></el-col>
</el-row>
</div>
</div>
</el-col>
</el-row>
</el-card>
<el-empty v-if="ownList.length == 0" description="暂无账号"></el-empty>
</el-tab-pane>
<el-tab-pane label="第三方发薪账号" name="second"> <el-form label-width="120px" label-position="left"
class="formMain">
<el-row :gutter="30">
<el-col :span="8">
<el-form-item label="支付宝外卡卡号">
<el-input placeholder="请输入支付宝外卡卡号"></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-button type="primary" icon="el-icon-search">查询</el-button>
</el-col>
<el-col :span="8">
<div class="buttonOperate">
<el-button type="primary" @click="goRegister">绑定发薪账户</el-button>
</div>
</el-col>
</el-row>
</el-form>
<el-card class="box-card" v-for="ele in thirdParty" :key="ele.id">
<el-row>
<el-col :span="16">
<div class="companyConterMain">
<div class="enterpriseImageMain">
<img class="enterpriseImage" src="@/assets/images/enterprise.png" alt="">
</div>
<div class="companyConterInformation">
<div style="width:90%;">
<el-row>
<el-col :span="14">
账户：{{ ele.companyName }}
</el-col>
<el-col :span="8">
<el-button type="info" @click="viewDetail(ele)" plain>账户详情</el-button>
</el-col>
</el-row> </el-row>
</el-form> </div>
<el-card class="box-card" v-for="ele in thirdParty" :key="ele.id"> <div style="width:90%;">
<el-row> <el-row>
<el-col :span="16"> <el-col :span="16">
<div class="companyConterMain"> 卡号：{{ ele.payAccNo }}
<div class="enterpriseImageMain"> </el-col>
<img class="enterpriseImage" src="@/assets/images/enterprise.png" alt="">
</div>
<div class="companyConterInformation">
<div style="width:90%;">
<el-row>
<el-col :span="14">
账户：{{ ele.companyName }}
</el-col>
<el-col :span="8">
<el-button type="info" @click="viewDetail(ele)" plain>账户详情</el-button>
</el-col>
</el-row>
</div>
<div style="width:90%;">
<el-row>
<el-col :span="16">
卡号：{{ ele.payAccNo }}
</el-col>
</el-row>
</div>
<!-- <div style="width:90%;">
<el-row>
<el-col :span="8">
可转帐余额：<span style="color:#4aa3ff;">222</span>
</el-col>
<el-col :span="8">
可用服务费：<span style="color:#4aa3ff;">2222</span>
</el-col>
<el-col :span="8">
服务费率：<span style="color:#4aa3ff;">2222</span>
</el-col>
</el-row>
</div> -->
</div>
</div>
</el-col>
<el-col :span="6" :offset="2">
<div class="operateConterMain">
<div style="width: 90%;">
<el-row>
<el-col :span="12"><el-button style="width:120px;" type="primary"
@click="balanceRecharge(ele)">余额充值</el-button></el-col>
<el-col :span="12"><el-button style="width:120px;" type="primary"
@click="serviceChargeRecharge(ele)">服务费充值</el-button></el-col>
</el-row>
</div>
<div style="width: 90%;">
<el-row>
<!-- <el-col :span="12"><el-button style="width:120px;" type="primary"
plain>账单查询</el-button></el-col> -->
<el-col :span="12"><el-button @click="salarySelection(ele.payAccNo)"
style="width:120px;" type="primary" plain>去发薪</el-button></el-col>
</el-row>
</div>
</div>
</el-col>
</el-row> </el-row>
</el-card> </div>
<el-empty v-if="thirdParty.length == 0" description="暂无账号"></el-empty> <!-- <div style="width:90%;">
</el-tab-pane> <el-row>
</el-tabs> <el-col :span="8">
<!-- 去发薪对话框 --> 可转帐余额：<span style="color:#4aa3ff;">222</span>
<el-dialog title="发薪选择" :visible.sync="payVisible" width="38%" center> </el-col>
<div class="salarySelectionStyle"> <el-col :span="8">
<div class="salarySelectionMain" @click="toLinkBankCard"> 可用服务费：<span style="color:#4aa3ff;">2222</span>
<div class="salarySelectionImageDiv"> </el-col>
<img class="salarySelectionImage" src="../../../assets/images/yhk.png" alt=""> <el-col :span="8">
</div> 服务费率：<span style="color:#4aa3ff;">2222</span>
<p class="salarySelectionText">批量到银行卡</p> </el-col>
</el-row>
</div> -->
</div> </div>
<div class="salarySelectionMain" @click="toLinkAlipay"> </div>
<div class="salarySelectionImageDiv"> </el-col>
<img class="salarySelectionImage" src="../../../assets/images/zfb.png" alt=""> <el-col :span="6" :offset="2">
</div> <div class="operateConterMain">
<div style="width: 90%;">
<p class="salarySelectionText">批量到支付宝</p> <el-row>
<el-col :span="12"><el-button style="width:120px;" type="primary"
@click="balanceRecharge(ele)">余额充值</el-button></el-col>
<el-col :span="12"><el-button style="width:120px;" type="primary"
@click="serviceChargeRecharge(ele)">服务费充值</el-button></el-col>
</el-row>
</div> </div>
</div> <div style="width: 90%;">
</el-dialog> <el-row>
<!-- 充值弹窗 --> <el-col :span="12"><el-button style="width:120px;" type="primary" plain
<el-dialog title="支付宝充值" :visible.sync="aliQRCodeRechargeOpen" width="500px" style="text-align: center"> @click="showBill(ele.payAccNo)">充值记录</el-button></el-col>
<!-- <h3>转账完成后，工作时间最晚2小时到账，最快1分钟充值到您的支付宝账户</h3>--> <el-col :span="12"><el-button @click="salarySelection(ele.payAccNo)"
<el-form :model="aliQRCodeRechargeForm" ref="signNewForm" size="small" label-width="120px" style="width:120px;" type="primary" plain>去发薪</el-button></el-col>
:rules="aliQRCodeRechargeRules"> </el-row>
<el-form-item label="收款账户" prop="payeeAccNo"> </div>
<el-input v-model="aliQRCodeRechargeForm.payeeAccNo" placeholder="请输入收款账号" disabled /> </div>
</el-form-item> </el-col>
<el-form-item label="付款账户" prop="payerAccNo" </el-row>
v-if="aliQRCodeRechargeForm.bindType && 2 === aliQRCodeRechargeForm.bindType"> </el-card>
<accSelect :bindType="1" v-model="aliQRCodeRechargeForm.payerAccNo"></accSelect> <el-empty v-if="thirdParty.length == 0" description="暂无账号"></el-empty>
</el-form-item> </el-tab-pane>
<el-form-item label="余额/服务费" prop="rechargeType"> </el-tabs>
<template> <!-- 去发薪对话框 -->
<el-select v-model="aliQRCodeRechargeForm.rechargeType" style="width: 100%" disabled> <el-dialog title="发薪选择" :visible.sync="payVisible" width="38%" center>
<el-option label="余额" :value="2">余额</el-option> <div class="salarySelectionStyle">
<el-option label="服务费" :value="1">服务费</el-option> <div class="salarySelectionMain" @click="toLinkBankCard">
</el-select> <div class="salarySelectionImageDiv">
</template> <img class="salarySelectionImage" src="../../../assets/images/yhk.png" alt="">
</el-form-item> </div>
<el-form-item label="充值金额" prop="amount"> <p class="salarySelectionText">批量到银行卡</p>
<el-input-number v-model="aliQRCodeRechargeForm.amount" placeholder="请输入充值金额" :precision="2" </div>
style="width: 100%" /> <div class="salarySelectionMain" @click="toLinkAlipay">
</el-form-item> <div class="salarySelectionImageDiv">
</el-form> <img class="salarySelectionImage" src="../../../assets/images/zfb.png" alt="">
<div slot="footer" class="dialog-footer"> </div>
<el-button type="primary" @click="getAliPayUrl">确认支付</el-button>
<el-button @click="aliQRCodeRechargeOpen = false">取 消</el-button>
</div>
</el-dialog>
<!-- 账户详情弹窗 -->
<el-dialog title="账号信息查询" :visible.sync="accDetail.panel" width="30%" center>
<el-descriptions :title="accDetail.companyName" :column="1" :label-style="accDetail.label_style"
:contentStyle="accDetail.content_style">
<el-descriptions-item label="账号">{{ accDetail.info.cardNo }}</el-descriptions-item>
<el-descriptions-item label="户名">{{ accDetail.info.bankAccName }}</el-descriptions-item>
<el-descriptions-item label="银行">{{ accDetail.info.cardBank }}</el-descriptions-item>
<el-descriptions-item label="支行">{{ accDetail.info.cardBranch }}</el-descriptions-item>
<el-descriptions-item label="开户地">{{ accDetail.info.cardLocation }}</el-descriptions-item>
<el-descriptions-item label="联行号">{{ accDetail.info.cardDeposit }}</el-descriptions-item>
<!-- <el-descriptions-item label="备付金余额">{{ offlineRecharge.availableAmount }}</el-descriptions-item>-->
<el-descriptions-item label="可转账金额">{{ accDetail.info.availableTransferAmount }}</el-descriptions-item>
<el-descriptions-item label="可用服务费">{{ accDetail.info.availableFeeAmount }}</el-descriptions-item>
</el-descriptions>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="accDetail.panel = false">确 定</el-button>
</div>
</el-dialog>
<!-- 自有账户充值 -->
<el-dialog :title="ownRechargeTitle" :visible.sync="ownAliQRCodeRechargeOpen" width="42%" center>
<el-row :gutter="64">
<el-col :span="12">
<p style="text-align: center;">通过与账本同主体的企业支付宝进行充值，可在手机端和电脑端充值</p>
</el-col>
<el-col :span="12">
<p style="text-align: center;">通过银行系统进行打款充值</p>
</el-col>
</el-row> <p class="salarySelectionText">批量到支付宝</p>
<el-row :gutter="64"> </div>
<el-col :span="12"> </div>
<div class="ownRechargeMain"> </el-dialog>
<img class="ownRechargeImage" src="@/assets/images/zfb.png" alt=""> <!-- 充值弹窗 -->
<el-button class="ownRechargeButton" <el-dialog title="支付宝充值" :visible.sync="aliQRCodeRechargeOpen" width="500px" style="text-align: center">
@click="ownAliQRCodeRechargeOpen = false; aliQRCodeRechargeOpen = true">支付宝充值</el-button> <!-- <h3>转账完成后，工作时间最晚2小时到账，最快1分钟充值到您的支付宝账户</h3>-->
</div> <el-form :model="aliQRCodeRechargeForm" ref="signNewForm" size="small" label-width="120px"
</el-col> :rules="aliQRCodeRechargeRules">
<el-col :span="12"> <el-form-item label="收款账户" prop="payeeAccNo">
<div class="ownRechargeMain"> <el-input v-model="aliQRCodeRechargeForm.payeeAccNo" placeholder="请输入收款账号" disabled />
<img class="ownRechargeImage" src="@/assets/images/xianxia.png" alt=""> </el-form-item>
<el-button class="ownRechargeButton" @click="offlineRecharge">线下充值</el-button> <el-form-item label="付款账户" prop="payerAccNo"
</div> v-if="aliQRCodeRechargeForm.bindType && 2 === aliQRCodeRechargeForm.bindType">
</el-col> <accSelect :bindType="1" v-model="aliQRCodeRechargeForm.payerAccNo"></accSelect>
</el-row> </el-form-item>
</el-dialog> <el-form-item label="余额/服务费" prop="rechargeType">
<!-- 线下充值 --> <template>
<el-dialog title="汇款充值" :visible.sync="rechargeCoursePanel" width="50%"> <el-select v-model="aliQRCodeRechargeForm.rechargeType" style="width: 100%" disabled>
<h2 style="font-weight: bold;font-size: 22px;margin-top: -15px;color: #1a1a1a">什么是汇款充值</h2> <el-option label="余额" :value="2">余额</el-option>
<el-row> <el-option label="服务费" :value="1">服务费</el-option>
<el-col :span="24"> </el-select>
商户可通过银行转账方式完成对应支付宝专属收款账户的充值。支付宝会为商户的每个支付宝账户提供独立的"专属收款账户"，商户从任一同名银行账户向其对应的"专属收款账户"转账，即可完成充值。 </template>
</el-col> </el-form-item>
</el-row> <el-form-item label="充值金额" prop="amount">
<el-row style="margin-top: 15px;"> <el-input-number v-model="aliQRCodeRechargeForm.amount" placeholder="请输入充值金额" :precision="2"
<el-col :span="24"> style="width: 100%" />
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="getAliPayUrl">确认支付</el-button>
<el-button @click="aliQRCodeRechargeOpen = false">取 消</el-button>
</div>
</el-dialog>
<!-- 账户详情弹窗 -->
<el-dialog title="账号信息查询" :visible.sync="accDetail.panel" width="30%" center>
<el-descriptions :title="accDetail.companyName" :column="1" :label-style="accDetail.label_style"
:contentStyle="accDetail.content_style">
<el-descriptions-item label="账号">{{ accDetail.info.cardNo }}</el-descriptions-item>
<el-descriptions-item label="户名">{{ accDetail.info.bankAccName }}</el-descriptions-item>
<el-descriptions-item label="银行">{{ accDetail.info.cardBank }}</el-descriptions-item>
<el-descriptions-item label="支行">{{ accDetail.info.cardBranch }}</el-descriptions-item>
<el-descriptions-item label="开户地">{{ accDetail.info.cardLocation }}</el-descriptions-item>
<el-descriptions-item label="联行号">{{ accDetail.info.cardDeposit }}</el-descriptions-item>
<!-- <el-descriptions-item label="备付金余额">{{ offlineRecharge.availableAmount }}</el-descriptions-item>-->
<el-descriptions-item label="可转账金额">{{ accDetail.info.availableTransferAmount }}</el-descriptions-item>
<el-descriptions-item label="可用服务费">{{ accDetail.info.availableFeeAmount }}</el-descriptions-item>
</el-descriptions>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="accDetail.panel = false">确 定</el-button>
</div>
</el-dialog>
<!-- 自有账户充值 -->
<el-dialog :title="ownRechargeTitle" :visible.sync="ownAliQRCodeRechargeOpen" width="42%" center>
<el-row :gutter="64">
<el-col :span="12">
<p style="text-align: center;">通过与账本同主体的企业支付宝进行充值，可在手机端和电脑端充值</p>
</el-col>
<el-col :span="12">
<p style="text-align: center;">通过银行系统进行打款充值</p>
</el-col>
</el-row>
<el-row :gutter="64">
<el-col :span="12">
<div class="ownRechargeMain">
<img class="ownRechargeImage" src="@/assets/images/zfb.png" alt="">
<el-button class="ownRechargeButton"
@click="ownAliQRCodeRechargeOpen = false; aliQRCodeRechargeOpen = true">支付宝充值</el-button>
</div>
</el-col>
<el-col :span="12">
<div class="ownRechargeMain">
<img class="ownRechargeImage" src="@/assets/images/xianxia.png" alt="">
<el-button class="ownRechargeButton" @click="offlineRecharge">线下充值</el-button>
</div>
</el-col>
</el-row>
</el-dialog>
<!-- 线下充值 -->
<el-dialog title="汇款充值" :visible.sync="rechargeCoursePanel" width="50%">
<h2 style="font-weight: bold;font-size: 22px;margin-top: -15px;color: #1a1a1a">什么是汇款充值</h2>
<el-row>
<el-col :span="24">
商户可通过银行转账方式完成对应支付宝专属收款账户的充值。支付宝会为商户的每个支付宝账户提供独立的"专属收款账户"，商户从任一同名银行账户向其对应的"专属收款账户"转账，即可完成充值。
</el-col>
</el-row>
<el-row style="margin-top: 15px;">
<el-col :span="24">
<span style="font-weight: bold;font-size: 22px;color: #1a1a1a"> <span style="font-weight: bold;font-size: 22px;color: #1a1a1a">
三步完成充值 三步完成充值
</span> </span>
<a style="color: #69b1ff" href="https://render.alipay.com/p/yuyan/180020040000423002/de59b" <a style="color: #69b1ff" href="https://render.alipay.com/p/yuyan/180020040000423002/de59b"
target="_blank">（查看教程）</a> target="_blank">（查看教程）</a>
</el-col> </el-col>
</el-row> </el-row>
<el-row style="margin-top: 15px;"> <el-row style="margin-top: 15px;">
<el-col :span="24"> <el-col :span="24">
<el-timeline> <el-timeline>
<el-timeline-item> <el-timeline-item>
<span style="font-weight: bold;font-size: 18px">登录你的网上银行</span> <span style="font-weight: bold;font-size: 18px">登录你的网上银行</span>
<span style="color: gray;font-size: 14px">(支持任意银行)</span> <span style="color: gray;font-size: 14px">(支持任意银行)</span>
<div style="font-size: 14px;margin-top: 5px">必须使用本公司同名的银行账户进行汇款转账，首次使用建议小金额转入测试</div> <div style="font-size: 14px;margin-top: 5px">必须使用本公司同名的银行账户进行汇款转账，首次使用建议小金额转入测试</div>
</el-timeline-item> </el-timeline-item>
<el-timeline-item> <el-timeline-item>
<span style="font-weight: bold;font-size: 18px">转账时填写以下专属账户</span> <span style="font-weight: bold;font-size: 18px">转账时填写以下专属账户</span>
<div style="font-size: 14px;margin-top: 5px">请注意收款账户支行选择： <div style="font-size: 14px;margin-top: 5px">请注意收款账户支行选择：
<span style="color: red">支付宝-备付金账户</span> <span style="color: red">支付宝-备付金账户</span>
<span>、开户地选择：</span> <span>、开户地选择：</span>
<span style="color: red">上海市-上海市</span> <span style="color: red">上海市-上海市</span>
<span>，否则支付宝无法收到资金</span> <span>，否则支付宝无法收到资金</span>
</div> </div>
<el-descriptions title="你的企业备付金余额账户" :column="1" :border="true" style="margin-top: 15px" <el-descriptions title="你的企业备付金余额账户" :column="1" :border="true" style="margin-top: 15px"
:label-style="accDetail.label_style" :contentStyle="accDetail.content_style"> :label-style="accDetail.label_style" :contentStyle="accDetail.content_style">
<el-descriptions-item label="账号">{{ offlineRechargeData.cardNo }}</el-descriptions-item> <el-descriptions-item label="账号">{{ offlineRechargeData.cardNo }}</el-descriptions-item>
<el-descriptions-item label="户名">{{ offlineRechargeData.bankAccName <el-descriptions-item label="户名">{{ offlineRechargeData.bankAccName
}}</el-descriptions-item> }}</el-descriptions-item>
<el-descriptions-item label="银行">{{ offlineRechargeData.cardBank <el-descriptions-item label="银行">{{ offlineRechargeData.cardBank
}}</el-descriptions-item> }}</el-descriptions-item>
<el-descriptions-item label="支行">{{ offlineRechargeData.cardBranch <el-descriptions-item label="支行">{{ offlineRechargeData.cardBranch
}}</el-descriptions-item> }}</el-descriptions-item>
<el-descriptions-item label="开户地">{{ offlineRechargeData.cardLocation <el-descriptions-item label="开户地">{{ offlineRechargeData.cardLocation
}}</el-descriptions-item> }}</el-descriptions-item>
<el-descriptions-item label="联行号">{{ offlineRechargeData.cardDeposit <el-descriptions-item label="联行号">{{ offlineRechargeData.cardDeposit
}}</el-descriptions-item> }}</el-descriptions-item>
</el-descriptions> </el-descriptions>
</el-timeline-item> </el-timeline-item>
<el-timeline-item> <el-timeline-item>
<span style="font-weight: bold;font-size: 18px">转账完成后，工作时间最晚2小时到账，最快1分钟充值到您的支付宝账户</span> <span style="font-weight: bold;font-size: 18px">转账完成后，工作时间最晚2小时到账，最快1分钟充值到您的支付宝账户</span>
<div style="font-size: 14px;margin-top: 5px">非工作时间预计最晚下个工作日到账(具体以银行为准)</div> <div style="font-size: 14px;margin-top: 5px">非工作时间预计最晚下个工作日到账(具体以银行为准)</div>
</el-timeline-item> </el-timeline-item>
</el-timeline> </el-timeline>
<div style="margin-top: 15px;"> <div style="margin-top: 15px;">
<span style="font-weight: bold;font-size: 18px">温馨提示：</span> <span style="font-weight: bold;font-size: 18px">温馨提示：</span>
<span style="color: gray;font-size: 14px">充值金额 <span style="color: gray;font-size: 14px">充值金额
<span style="color: red;"><strong>分数位为1</strong></span>的（如：10.01，119.31，1235.81等）会 <span style="color: red;"><strong>分数位为1</strong></span>的（如：10.01，119.31，1235.81等）会
<span style="color: red;"><strong>充值到服务费</strong></span>；其它金额会充值到余额；</span> <span style="color: red;"><strong>充值到服务费</strong></span>；其它金额会充值到余额；</span>
</div> </div>
</el-col> </el-col>
</el-row> </el-row>
<div slot="footer" class="dialog-footer"> <div slot="footer" class="dialog-footer">
<el-button type="primary" @click="rechargeCoursePanel = false">确 定</el-button> <el-button type="primary" @click="rechargeCoursePanel = false">确 定</el-button>
</div> </div>
</el-dialog> </el-dialog>
<el-dialog title="确认支付" :visible.sync="qrPayPanel.open" width="20%"> <el-dialog title="确认支付" :visible.sync="qrPayPanel.open" width="20%">
<div> <div>
<span style="font-size: 18px;">1、使用手机支付宝扫码支付;</span> <span style="font-size: 18px;">1、使用手机支付宝扫码支付;</span>
<qr-code-component :text="qrPayPanel.payUrl" /> <qr-code-component :text="qrPayPanel.payUrl" />
</div> </div>
<div style="margin-top: 12px;"> <div style="margin-top: 12px;">
<span style="font-size: 18px;">2、通过支付宝官网支付，<a :href="qrPayPanel.payUrl" target="_blank" <span style="font-size: 18px;">2、通过支付宝官网支付，<a :href="qrPayPanel.payUrl" target="_blank"
style="font-size: 20px;color: #409EFF;"><strong>去支付</strong></a>;</span> style="font-size: 20px;color: #409EFF;"><strong>去支付</strong></a>;</span>
</div> </div>
<div slot="footer" class="dialog-footer"> <div slot="footer" class="dialog-footer">
<el-button @click="qrPayPanel.open = false">取 消</el-button> <el-button @click="qrPayPanel.open = false">取 消</el-button>
</div> </div>
</el-dialog> </el-dialog>
<el-dialog title="充值记录" :visible.sync="billPanel" width="80%"> <el-dialog title="充值记录" :visible.sync="billPanel" width="80%">
<el-form :model="billQuery" size="small" :inline="true" label-width="100px"> <el-form :model="billQuery" size="small" :inline="true" label-width="100px">
<el-form-item label="账单类型" prop="tranType"> <el-form-item label="账单类型" prop="tranType">
<el-select v-model="billQuery.capitalPurpose" clearable placeholder="请选择"> <el-select v-model="billQuery.capitalPurpose" clearable placeholder="请选择">
<el-option label="全部" :value="''" /> <el-option label="全部" :value="''" />
<el-option label="服务费" :value="1" /> <el-option label="服务费" :value="1" />
<el-option label="余额" :value="2" /> <el-option label="余额" :value="2" />
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="时间"> <el-form-item label="时间">
<el-date-picker v-model="dateRange" style="width: 240px" value-format="yyyy-MM-dd HH:mm:ss" <el-date-picker v-model="dateRange" style="width: 240px" value-format="yyyy-MM-dd HH:mm:ss"
type="daterange" start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker> type="daterange" start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="getBillList">搜索</el-button> <el-button type="primary" icon="el-icon-search" size="mini" @click="getBillList">搜索</el-button>
</el-form-item> </el-form-item>
</el-form> </el-form>
<el-tabs value="first" @tab-click="billTypeTabClick"> <el-tabs value="first" @tab-click="billTypeTabClick">
<el-tab-pane label="账单列表" name="first"></el-tab-pane> <el-tab-pane label="账单列表" name="first"></el-tab-pane>
</el-tabs> </el-tabs>
<el-table v-loading="loading" :data="billDataList"> <el-table v-loading="loading" :data="billDataList">
<el-table-column type="selection" width="55" align="center" /> <el-table-column type="selection" width="55" align="center" />
<el-table-column label="账单类型" align="center" prop="capitalPurpose"> <el-table-column label="账单类型" align="center" prop="capitalPurpose">
<template slot-scope="scope"> <template slot-scope="scope">
<span v-if="scope.row.capitalPurpose == 1">服务费</span> <span v-if="scope.row.capitalPurpose == 1">服务费</span>
<span v-if="scope.row.capitalPurpose == 2">余额</span> <span v-if="scope.row.capitalPurpose == 2">余额</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="收支类型" align="center" prop="tranType"> <el-table-column label="收支类型" align="center" prop="tranType">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button type="success" size="mini" v-if="scope.row.tranType == 2">收入</el-button> <el-button type="success" size="mini">收入</el-button>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="金额" align="center" prop="tranAmount"> <el-table-column label="金额" align="center" prop="tranAmount">
<template slot-scope="scope"> <template slot-scope="scope">
<span v-if="scope.row.tranType == 2" style="color: rgb(255, 208, 75)"> <span style="color: rgb(255, 208, 75)">
+ {{ scope.row.tranAmount }} + {{ scope.row.tranAmount }}
</span> </span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="时间" align="center" prop="createTime" width="180" /> <el-table-column label="时间" align="center" prop="createTime" width="180" />
</el-table> </el-table>
<el-pagination small layout="prev, pager, next" :total="billTotal" :page.sync="billQuery.pageNum" <el-pagination small layout="prev, pager, next" :total="billTotal" :page.sync="billQuery.pageNum"
@size-change="handleSizeChange" @current-change="handleCurrentChange" :limit.sync="billQuery.pageSize" @size-change="handleSizeChange" @current-change="handleCurrentChange" :limit.sync="billQuery.pageSize"
@pagination="getBillList()"> @pagination="getBillList()">
</el-pagination> </el-pagination>
<div slot="footer" class="dialog-footer"> <div slot="footer" class="dialog-footer">
<el-button @click="billPanel = false">关 闭</el-button> <el-button @click="billPanel = false">关 闭</el-button>
</div> </div>
</el-dialog> </el-dialog>
</div> </div>
</template> </template>
<script> <script>
...@@ -399,389 +399,388 @@ import { addDateRange } from '@/utils/ruoyi' ...@@ -399,389 +399,388 @@ import { addDateRange } from '@/utils/ruoyi'
import { formatDate } from '@/utils' import { formatDate } from '@/utils'
import QrCodeComponent from '@/components/QrCode.vue' import QrCodeComponent from '@/components/QrCode.vue'
export default { export default {
name: 'SalaryAccount', name: 'SalaryAccount',
components: { QrCodeComponent, AccSelect }, components: { QrCodeComponent, AccSelect },
data() { data() {
return { return {
billPanel: false, billPanel: false,
qrPayPanel: { qrPayPanel: {
open: false, open: false,
payUrl: '' payUrl: ''
}, },
// 账户详情 // 账户详情
accDetail: { accDetail: {
content_style: { content_style: {
'font-size': '16px', 'font-size': '16px',
}, },
label_style: { label_style: {
'font-size': '16px', 'font-size': '16px',
}, },
panel: false, panel: false,
info: {} info: {}
}, },
// tab选择参数 // tab选择参数
payType: 'first', payType: 'first',
// 发薪选择对话框参数 // 发薪选择对话框参数
payVisible: false, payVisible: false,
params: { params: {
bindType: 1, bindType: 1,
payAccNo: null, payAccNo: null,
}, },
// 自有发薪数据 // 自有发薪数据
ownList: [], ownList: [],
// 第三方发薪数据 // 第三方发薪数据
thirdParty: [], thirdParty: [],
// 去发薪-当前选中的卡号 // 去发薪-当前选中的卡号
cardNo: null, cardNo: null,
// 充值参数-第三方 // 充值参数-第三方
aliQRCodeRechargeOpen: false, aliQRCodeRechargeOpen: false,
aliQRCodeRechargeForm: { aliQRCodeRechargeForm: {
payeeAccNo: '', payeeAccNo: '',
rechargeType: 1, rechargeType: 1,
amount: '', amount: '',
payerAccNo: '' payerAccNo: ''
}, },
aliQRCodeRechargeRules: { aliQRCodeRechargeRules: {
payerAccNo: [ payerAccNo: [
{ required: true, message: '请选择付款账号', trigger: 'change' } { required: true, message: '请选择付款账号', trigger: 'change' }
], ],
amount: [ amount: [
{ {
validator: (rule, value, callback) => { validator: (rule, value, callback) => {
if (value <= 0) { if (value <= 0) {
callback(new Error('充值金额必须大于零')); callback(new Error('充值金额必须大于零'));
} else { } else {
callback() callback()
} }
},
trigger: 'blur'
}
]
},
// 充值参数-自有
ownAliQRCodeRechargeOpen: false,
ownRechargeTitle: null,
ownAliQRCodeRechargeForm: {
},
// 线下充值
rechargeCoursePanel: false,
offlineRechargeData: {},
// 充值记录相关参数
billQuery: {
pageNum: 1,
pageSize: 10,
capitalPurpose: 1, //账单类型:1-服务费;2-余额
tranType: '', //收支类型:1-收入;2-支出
startTime: '',
endTime: '',
}, },
dateRange: [formatDate(new Date()), formatDate(new Date())], trigger: 'blur'
billDataList: [], }
billTotal: 0, ]
userInfoName: null, },
accountCollection: [], // 充值参数-自有
loading: false ownAliQRCodeRechargeOpen: false,
ownRechargeTitle: null,
ownAliQRCodeRechargeForm: {},
// 线下充值
rechargeCoursePanel: false,
offlineRechargeData: {},
// 充值记录相关参数
billQuery: {
pageNum: 1,
pageSize: 10,
capitalPurpose: 1, //账单类型:1-服务费;2-余额
tranType: '', //收支类型:1-收入;2-支出
startTime: '',
endTime: '',
},
dateRange: [formatDate(new Date()), formatDate(new Date())],
billDataList: [],
billTotal: 0,
userInfoName: null,
accountCollection: [],
loading: false
}
},
created() {
},
mounted() {
if (this.payType == 'first') {
this.params.bindType = 1
this.getListAllAccInfoFN()
} else if (this.payType == 'second') {
this.params.bindType = 2
this.getListAllAccInfoFN()
}
},
methods: {
billTypeTabClick(tab) {
// this.billQuery.capitalPurpose = tab.name === "second" ? 2 : 1 //1：服务费 2：余额
// this.getBillList();
},
showBill(cardNo) {
this.billQuery.cardNo = cardNo;
this.billPanel = true;
this.getBillList();
},
handleSizeChange(val) {
this.billQuery.pageSize = Number(val)
this.getBillList()
},
handleCurrentChange(val) {
this.billQuery.pageNum = Number(val)
this.getBillList()
},
getBillList() {
if (this.dateRange && this.dateRange.length > 0) {
let searchVal = addDateRange(this.billQuery, this.dateRange)
this.billQuery.startTime = searchVal.params.beginTime.split(" ")[0] + " 00:00:00"
this.billQuery.endTime = searchVal.params.endTime.split(" ")[0] + " 23:59:59"
} else {
this.billQuery.startTime = ''
this.billQuery.endTime = ''
}
this.loading = true
listBill(this.billQuery).then(res => {
if (res.code == 200) {
this.billDataList = res.rows
this.billTotal = res.total
} }
}).finally(() => {
this.loading = false
})
}, },
created() { }, // 选择线下充值方法
mounted() { offlineRecharge() {
if (this.payType == 'first') { this.ownAliQRCodeRechargeOpen = false
this.params.bindType = 1 this.$modal.loading('...加载中')
this.getListAllAccInfoFN() getAccAliInfo(this.aliQRCodeRechargeForm.payeeAccNo).then(resp => {
} else if (this.payType == 'second') { if (200 === resp.code) {
this.params.bindType = 2 this.offlineRechargeData = resp.data
this.getListAllAccInfoFN() this.rechargeCoursePanel = true
// this.accDetail.companyName = card.companyName
// this.accDetail.info = resp.data
// this.accDetail.panel = true
} }
}).finally(() => {
this.$modal.closeLoading()
})
}, },
methods: { // 点击服务分充值方法-自有
billTypeTabClick(tab) { ownServiceChargeRecharge(val) {
// this.billQuery.capitalPurpose = tab.name === "second" ? 2 : 1 //1：服务费 2：余额 this.aliQRCodeRechargeForm.rechargeType = 1
// this.getBillList(); this.aliQRCodeRechargeForm.payeeAccNo = val.payAccNo
}, this.aliQRCodeRechargeForm.bindType = val.bindType
showBill(cardNo) { this.ownRechargeTitle = '自有服务费充值'
this.billQuery.cardNo = cardNo; this.ownAliQRCodeRechargeOpen = true
this.billPanel = true; },
this.getBillList(); // 点击余额充值方法-自有
}, ownBalanceRecharge(val) {
handleSizeChange(val) { this.aliQRCodeRechargeForm.rechargeType = 2
this.billQuery.pageSize = Number(val) this.aliQRCodeRechargeForm.payeeAccNo = val.payAccNo
this.getBillList() this.aliQRCodeRechargeForm.bindType = val.bindType
}, this.ownRechargeTitle = '自有余额充值'
handleCurrentChange(val) { this.ownAliQRCodeRechargeOpen = true
this.billQuery.pageNum = Number(val) },
this.getBillList() // 点击余额充值方法-第三方
}, balanceRecharge(val) {
getBillList() { this.aliQRCodeRechargeForm.rechargeType = 2
if (this.dateRange && this.dateRange.length > 0) { this.aliQRCodeRechargeForm.payeeAccNo = val.payAccNo
let searchVal = addDateRange(this.billQuery, this.dateRange) this.aliQRCodeRechargeForm.bindType = val.bindType
this.billQuery.startTime = searchVal.params.beginTime.split(" ")[0] + " 00:00:00" this.aliQRCodeRechargeOpen = true
this.billQuery.endTime = searchVal.params.endTime.split(" ")[0] + " 23:59:59" },
} else { // 点击服务费充值方法-第三方
this.billQuery.startTime = '' serviceChargeRecharge(val) {
this.billQuery.endTime = '' this.aliQRCodeRechargeForm.rechargeType = 1
} this.aliQRCodeRechargeForm.payeeAccNo = val.payAccNo
this.loading = true this.aliQRCodeRechargeForm.bindType = val.bindType
listBill(this.billQuery).then(res => { this.aliQRCodeRechargeOpen = true
if (res.code == 200) { },
this.billDataList = res.rows // 确认支付按钮
this.billTotal = res.total getAliPayUrl() {
} this.$refs.signNewForm.validate((valid) => {
}).finally(() => { if (valid) {
this.loading = false this.$modal.loading('充值中....')
}) addAccRecharge(this.aliQRCodeRechargeForm).then(res => {
}, this.aliQRCodeRechargeOpen = false
// 选择线下充值方法 if (200 === res.code) {
offlineRecharge() { if (1 === this.aliQRCodeRechargeForm.bindType) {
this.ownAliQRCodeRechargeOpen = false this.qrPayPanel.payUrl = res.data.msg
this.$modal.loading('...加载中') this.qrPayPanel.open = true
getAccAliInfo(this.aliQRCodeRechargeForm.payeeAccNo).then(resp => { this.$forceUpdate()
if (200 === resp.code) { } else {
this.offlineRechargeData = resp.data this.$modal.msgSuccess("充值成功！");
this.rechargeCoursePanel = true }
// this.accDetail.companyName = card.companyName
// this.accDetail.info = resp.data
// this.accDetail.panel = true
}
}).finally(() => {
this.$modal.closeLoading()
})
},
// 点击服务分充值方法-自有
ownServiceChargeRecharge(val) {
this.aliQRCodeRechargeForm.rechargeType = 1
this.aliQRCodeRechargeForm.payeeAccNo = val.payAccNo
this.aliQRCodeRechargeForm.bindType = val.bindType
this.ownRechargeTitle = '自有服务费充值'
this.ownAliQRCodeRechargeOpen = true
},
// 点击余额充值方法-自有
ownBalanceRecharge(val) {
this.aliQRCodeRechargeForm.rechargeType = 2
this.aliQRCodeRechargeForm.payeeAccNo = val.payAccNo
this.aliQRCodeRechargeForm.bindType = val.bindType
this.ownRechargeTitle = '自有余额充值'
this.ownAliQRCodeRechargeOpen = true
},
// 点击余额充值方法-第三方
balanceRecharge(val) {
this.aliQRCodeRechargeForm.rechargeType = 2
this.aliQRCodeRechargeForm.payeeAccNo = val.payAccNo
this.aliQRCodeRechargeForm.bindType = val.bindType
this.aliQRCodeRechargeOpen = true
},
// 点击服务费充值方法-第三方
serviceChargeRecharge(val) {
this.aliQRCodeRechargeForm.rechargeType = 1
this.aliQRCodeRechargeForm.payeeAccNo = val.payAccNo
this.aliQRCodeRechargeForm.bindType = val.bindType
this.aliQRCodeRechargeOpen = true
},
// 确认支付按钮
getAliPayUrl() {
this.$refs.signNewForm.validate((valid) => {
if (valid) {
this.$modal.loading('充值中....')
addAccRecharge(this.aliQRCodeRechargeForm).then(res => {
this.aliQRCodeRechargeOpen = false
if (200 === res.code) {
if (1 === this.aliQRCodeRechargeForm.bindType) {
this.qrPayPanel.payUrl = res.data.msg
this.qrPayPanel.open = true
this.$forceUpdate()
} else {
this.$modal.msgSuccess("充值成功！");
}
}
}).finally(() => {
this.$modal.closeLoading()
})
}
})
},
// 跳转到批量到支付宝
toLinkAlipay() {
this.$router.push({ path: "/transfer/batchToAli", query: { number: this.cardNo } });
this.payVisible = false
},
// 跳转到批量到银行卡
toLinkBankCard() {
this.$router.push({ path: "/transfer/batchToBank", query: { number: this.cardNo } });
this.payVisible = false
},
// 获取公司列表方法
getListAllAccInfoFN() {
listAllAccInfo(this.params).then(res => {
if (res.code == 200) {
if (this.params.bindType == 1) {
this.ownList = res.data
} else if (this.params.bindType == 2) {
this.thirdParty = res.data
}
}
})
},
// 点击去发薪按钮执行
salarySelection(number) {
this.cardNo = number
this.payVisible = true
},
// tab发生变化时执行
handleClick(tab, event) {
if (this.payType == 'first') {
this.params.bindType = 1
this.getListAllAccInfoFN()
} else if (this.payType == 'second') {
this.params.bindType = 2
this.getListAllAccInfoFN()
} }
// console.log(tab, event); }).finally(() => {
// console.log('payType', this.payType); this.$modal.closeLoading()
}, })
viewDetail(card) { }
this.$modal.loading("...") })
getAccAliInfo(card.payAccNo).then(resp => { },
if (200 === resp.code) { // 跳转到批量到支付宝
this.accDetail.companyName = card.companyName toLinkAlipay() {
this.accDetail.info = resp.data this.$router.push({ path: "/transfer/batchToAli", query: { number: this.cardNo } });
this.accDetail.panel = true this.payVisible = false
} },
}).finally(() => { // 跳转到批量到银行卡
this.$modal.closeLoading() toLinkBankCard() {
}) this.$router.push({ path: "/transfer/batchToBank", query: { number: this.cardNo } });
}, this.payVisible = false
goRegister() { },
window.open('https://admins.openbanks.cn/#/register?parameters=MPf%2Flhts8VrGmGDCjFNey4AqyYOJk1pQAc0KS6cZqp2QcvSNrm9LqLlqELVUfoVT', '_blank') // 获取公司列表方法
}, getListAllAccInfoFN() {
} listAllAccInfo(this.params).then(res => {
if (res.code == 200) {
if (this.params.bindType == 1) {
this.ownList = res.data
} else if (this.params.bindType == 2) {
this.thirdParty = res.data
}
}
})
},
// 点击去发薪按钮执行
salarySelection(number) {
this.cardNo = number
this.payVisible = true
},
// tab发生变化时执行
handleClick(tab, event) {
if (this.payType == 'first') {
this.params.bindType = 1
this.getListAllAccInfoFN()
} else if (this.payType == 'second') {
this.params.bindType = 2
this.getListAllAccInfoFN()
}
// console.log(tab, event);
// console.log('payType', this.payType);
},
viewDetail(card) {
this.$modal.loading("...")
getAccAliInfo(card.payAccNo).then(resp => {
if (200 === resp.code) {
this.accDetail.companyName = card.companyName
this.accDetail.info = resp.data
this.accDetail.panel = true
}
}).finally(() => {
this.$modal.closeLoading()
})
},
goRegister() {
window.open('https://admins.openbanks.cn/#/register?parameters=MPf%2Flhts8VrGmGDCjFNey4AqyYOJk1pQAc0KS6cZqp2QcvSNrm9LqLlqELVUfoVT', '_blank')
},
}
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.app-container ::v-deep { .app-container ::v-deep {
// 表单部分样式 // 表单部分样式
.formMain { .formMain {
padding-left: 12px; padding-left: 12px;
// 操作按钮样式 // 操作按钮样式
.buttonOperate { .buttonOperate {
text-align: right; text-align: right;
padding-right: 20px; padding-right: 20px;
}
} }
}
// 卡片样式 // 卡片样式
.box-card { .box-card {
margin-top: 12px; margin-top: 12px;
// 公司信息部分样式
.companyConterMain {
width: 100%;
height: 140px;
display: flex;
align-items: center;
justify-content: space-between;
// 公司图标样式
.enterpriseImageMain {
width: 200px;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
.enterpriseImage { // 公司信息部分样式
width: 120px; .companyConterMain {
height: 68px; width: 100%;
} height: 140px;
display: flex;
align-items: center;
justify-content: space-between;
} // 公司图标样式
.enterpriseImageMain {
width: 200px;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
// 公司信息内容部分样式 .enterpriseImage {
.companyConterInformation { width: 120px;
width: calc(100% - 180px); height: 68px;
height: 90%;
display: flex;
flex-direction: column;
flex-wrap: wrap;
align-content: center;
justify-content: space-evenly;
}
} }
// 操作按钮部分样式 }
.operateConterMain {
width: 90%;
height: 120px;
display: flex;
flex-direction: column;
flex-wrap: wrap;
align-content: center;
justify-content: space-evenly;
}
}
// 去发薪-发薪选择对话框样式 // 公司信息内容部分样式
.salarySelectionStyle { .companyConterInformation {
width: 90%; width: calc(100% - 180px);
margin: 0 auto; height: 90%;
height: 200px;
display: flex; display: flex;
flex-direction: column;
flex-wrap: wrap;
align-content: center;
justify-content: space-evenly; justify-content: space-evenly;
align-items: center; }
}
.salarySelectionMain { // 操作按钮部分样式
width: 40%; .operateConterMain {
height: 90%; width: 90%;
display: flex; height: 120px;
flex-wrap: wrap; display: flex;
justify-content: center; flex-direction: column;
align-items: center; flex-wrap: wrap;
background-color: rgba(117, 190, 245, .1); align-content: center;
border-radius: 12px; justify-content: space-evenly;
padding: 12px; }
}
.salarySelectionImageDiv { // 去发薪-发薪选择对话框样式
width: 100%; .salarySelectionStyle {
display: flex; width: 90%;
align-items: center; margin: 0 auto;
justify-content: center; height: 200px;
display: flex;
justify-content: space-evenly;
align-items: center;
.salarySelectionImage { .salarySelectionMain {
width: 120px; width: 40%;
height: 120px; height: 90%;
z-index: 9999; display: flex;
} flex-wrap: wrap;
} justify-content: center;
align-items: center;
background-color: rgba(117, 190, 245, .1);
border-radius: 12px;
padding: 12px;
.salarySelectionText { .salarySelectionImageDiv {
text-align: center; width: 100%;
width: 100%; display: flex;
font-size: 18px; align-items: center;
font-weight: bold; justify-content: center;
}
.salarySelectionImage {
width: 120px;
height: 120px;
z-index: 9999;
} }
}
.salarySelectionText {
text-align: center;
width: 100%;
font-size: 18px;
font-weight: bold;
}
} }
}
// 自有充值选中对话框样式-选择充值方式 // 自有充值选中对话框样式-选择充值方式
.ownRechargeMain { .ownRechargeMain {
height: 160px; height: 160px;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
flex-wrap: wrap; flex-wrap: wrap;
justify-content: space-around; justify-content: space-around;
align-content: center; align-content: center;
.ownRechargeImage { .ownRechargeImage {
width: 100px; width: 100px;
height: 100px; height: 100px;
} }
.ownRechargeButton { .ownRechargeButton {
width: 32%; width: 32%;
border-radius: 16px; border-radius: 16px;
}
} }
}
} }
</style> </style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment