admingit/MicroCommunityWeb
1
0
Fork 0
mirror of https://gitee.com/java110/MicroCommunityWeb.git synced 2026-06-12 10:00:56 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

优化支付问题

Browse Source
This commit is contained in:
wuxw 2025-08-19 17:51:35 +08:00
parent b842309791
commit d65dee5efb
1 changed files with 122 additions and 77 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

59
src/components/fee/payFeeOrderConfirm.vue
View File

@ -2,7 +2,7 @@
<div> <div>
<el-dialog :title="$t('payFeeOrderConfirm.title')" :visible.sync="dialogVisible" width="40%" @close="handleClose" <el-dialog :title="$t('payFeeOrderConfirm.title')" :visible.sync="dialogVisible" width="40%" @close="handleClose"
:close-on-click-modal="false"> :close-on-click-modal="false">
<el-form label-width="120px" class="text-left"> <el-form label-width="120px" class="text-left" @submit.prevent>
<el-form-item :label="$t('payFeeOrderConfirm.payerObj')"> <el-form-item :label="$t('payFeeOrderConfirm.payerObj')">
<span>{{ formData.payerObjName }}</span> <span>{{ formData.payerObjName }}</span>
</el-form-item> </el-form-item>
@ -71,8 +71,12 @@
</el-form-item> </el-form-item>
<el-form-item v-if="formData.payType == 'qrCode'" :label="$t('payFeeOrderConfirm.authCode')"> <el-form-item v-if="formData.payType == 'qrCode'" :label="$t('payFeeOrderConfirm.authCode')">
<el-input v-model="formData.authCode" :placeholder="$t('payFeeOrderConfirm.authCodePlaceholder')" <input
@keyup.enter.native="qrCodePayFee"></el-input> v-model="formData.authCode"
:placeholder="$t('payFeeOrderConfirm.authCodePlaceholder')"
@keydown.enter.prevent="qrCodePayFee"
class="custom-input"
type="text">
</el-form-item> </el-form-item>
</el-form> </el-form>
@ -85,11 +89,11 @@
</el-dialog> </el-dialog>
<pay-fee-order-result ref="payFeeOrderResult"></pay-fee-order-result> <pay-fee-order-result ref="payFeeOrderResult"></pay-fee-order-result>
</div> </div>
</template> </template>
<script> <script>
import { qrCodePayment, checkPayFinish ,payFee} from '@/api/fee/payFeeOrderApi' import { qrCodePayment, checkPayFinish, payFee } from '@/api/fee/payFeeOrderApi'
import { dateFormat } from '@/utils/dateUtil' import { dateFormat } from '@/utils/dateUtil'
import PayFeeOrderResult from '@/components/fee/payFeeOrderResult' import PayFeeOrderResult from '@/components/fee/payFeeOrderResult'
export default { export default {
@ -218,7 +222,48 @@ export default {
</script> </script>
<style scoped> <style scoped>
.dialog-footer { .custom-input {
text-align: right; width: 100%;
height: 40px;
line-height: 40px;
padding: 0 15px;
border: 1px solid #dcdfe6;
border-radius: 4px;
font-size: 14px;
color: #606266;
background-color: #fff;
transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
box-sizing: border-box;
}
.custom-input:focus {
outline: none;
border-color: #409eff;
box-shadow: 0 0 0 2px rgba(64, 158, 255, 0.2);
}
.custom-input:hover {
border-color: #c0c4cc;
}
.custom-input::placeholder {
color: #c0c4cc;
}
/* 禁用状态 */
.custom-input:disabled {
background-color: #f5f7fa;
border-color: #e4e7ed;
color: #c0c4cc;
cursor: not-allowed;
}
/* 错误状态 */
.custom-input.error {
border-color: #f56c6c;
}
.custom-input.error:focus {
box-shadow: 0 0 0 2px rgba(245, 108, 108, 0.2);
} }
</style> </style>