页面优化
This commit is contained in:
parent
50ad914807
commit
6eae897e39
@ -175,8 +175,8 @@ import { ref, onMounted, reactive, nextTick } from 'vue';
|
|||||||
import { message } from 'ant-design-vue'
|
import { message } from 'ant-design-vue'
|
||||||
import { callUser } from '@/apis/call.js'
|
import { callUser } from '@/apis/call.js'
|
||||||
import config from '@/utils/config.js'
|
import config from '@/utils/config.js'
|
||||||
import RefundOrderRevie from '@/views/form/refundorderrevie/RefundOrderRevie.vue';
|
import RefundOrderRevie from '@/views/form/cyclingorderrefund/refundorderrevie/RefundOrderRevie.vue';
|
||||||
import ConfirmRefund from '@/views/form/confirmrefund/ConfirmRefund.vue';
|
import ConfirmRefund from '@/views/form/cyclingorderrefund/confirmrefund/ConfirmRefund.vue';
|
||||||
|
|
||||||
const activeKey = ref('1')
|
const activeKey = ref('1')
|
||||||
const openRevie = ref(false);
|
const openRevie = ref(false);
|
||||||
|
|||||||
@ -340,42 +340,6 @@
|
|||||||
</a-form-item>
|
</a-form-item>
|
||||||
</a-col>
|
</a-col>
|
||||||
</a-row>
|
</a-row>
|
||||||
<a-row :gutter="8">
|
|
||||||
<a-col :xs="12">
|
|
||||||
<a-form-item
|
|
||||||
label="短租预付款"
|
|
||||||
required
|
|
||||||
name="shortRentAdvance"
|
|
||||||
:rules="[{ required: true, message: '请选择短租预付款' }]"
|
|
||||||
>
|
|
||||||
<a-radio-group
|
|
||||||
v-model:value="form.shortRentAdvance"
|
|
||||||
name="radioGroup"
|
|
||||||
>
|
|
||||||
<a-radio value="1">是</a-radio>
|
|
||||||
<a-radio value="2">否</a-radio>
|
|
||||||
</a-radio-group>
|
|
||||||
</a-form-item>
|
|
||||||
</a-col>
|
|
||||||
</a-row>
|
|
||||||
<a-row :gutter="8">
|
|
||||||
<a-col :xs="12">
|
|
||||||
<a-form-item
|
|
||||||
label="是否开启长租"
|
|
||||||
required
|
|
||||||
name="whetherOpenLongRent"
|
|
||||||
:rules="[{ required: true, message: '请选择计费方式' }]"
|
|
||||||
>
|
|
||||||
<a-radio-group
|
|
||||||
v-model:value="form.whetherOpenLongRent"
|
|
||||||
name="radioGroup"
|
|
||||||
>
|
|
||||||
<a-radio value="1">是</a-radio>
|
|
||||||
<a-radio value="2">否</a-radio>
|
|
||||||
</a-radio-group>
|
|
||||||
</a-form-item>
|
|
||||||
</a-col>
|
|
||||||
</a-row>
|
|
||||||
</a-form>
|
</a-form>
|
||||||
</a-spin>
|
</a-spin>
|
||||||
</template>
|
</template>
|
||||||
@ -425,8 +389,6 @@ const formData = () => ({
|
|||||||
parkingAreaOutDispatchFee: "",
|
parkingAreaOutDispatchFee: "",
|
||||||
helmetManagementFee: "",
|
helmetManagementFee: "",
|
||||||
cappedAmount: "",
|
cappedAmount: "",
|
||||||
shortRentAdvance: "",
|
|
||||||
whetherOpenLongRent: ""
|
|
||||||
});
|
});
|
||||||
|
|
||||||
const form = ref(formData());
|
const form = ref(formData());
|
||||||
|
|||||||
@ -1,243 +0,0 @@
|
|||||||
<template>
|
|
||||||
<a-divider></a-divider>
|
|
||||||
<a-form
|
|
||||||
label-align="left"
|
|
||||||
:label-col="{ span: 6 }"
|
|
||||||
:wrapper-col="{ span: 18 }"
|
|
||||||
>
|
|
||||||
<a-row>
|
|
||||||
<a-col :span="24">
|
|
||||||
<a-form-item
|
|
||||||
label="订单金额"
|
|
||||||
:label-col="{ span: 3 }"
|
|
||||||
:wrapper-col="{ span: 21 }"
|
|
||||||
>
|
|
||||||
<span>{{costInfo.totalAmount}} 元
|
|
||||||
<span class="spanCss">
|
|
||||||
= 起步费用:{{costInfo.startupCost}} 元 + 时长费用:{{costInfo.durationCost}} 元
|
|
||||||
+ 调度费:{{costInfo.dispatchFee}} 元
|
|
||||||
</span>
|
|
||||||
</span>
|
|
||||||
</a-form-item>
|
|
||||||
</a-col>
|
|
||||||
</a-row>
|
|
||||||
<a-row>
|
|
||||||
<a-col :span="24">
|
|
||||||
<a-form-item
|
|
||||||
label="调度费用"
|
|
||||||
:label-col="{ span: 3 }"
|
|
||||||
:wrapper-col="{ span: 21 }"
|
|
||||||
>
|
|
||||||
<span>{{costInfo.dispatchFee}} 元
|
|
||||||
<span class="spanCss">
|
|
||||||
= 运营区外调度费用:{{costInfo.dispatchFeeOutOperateArea}} 元 + 禁停区调度费:{{costInfo.dispatchFeeBanArea}} 元
|
|
||||||
+ 停车区外调度费:{{costInfo.parkingAreaOutDispatchFee}} 元 + 头盔管理费:{{costInfo.helmetManagementFee}} 元
|
|
||||||
+ 不规范停车费:{{costInfo.improperParkFee}} 元
|
|
||||||
</span>
|
|
||||||
</span>
|
|
||||||
</a-form-item>
|
|
||||||
</a-col>
|
|
||||||
</a-row>
|
|
||||||
<a-row>
|
|
||||||
<a-col :span="24">
|
|
||||||
<a-form-item
|
|
||||||
label="实付金额"
|
|
||||||
:label-col="{ span: 3 }"
|
|
||||||
:wrapper-col="{ span: 21 }"
|
|
||||||
>
|
|
||||||
<span>{{costInfo.actualAmount}} 元
|
|
||||||
<span class="spanCss">
|
|
||||||
= 订单金额:{{costInfo.totalAmount}} 元 - 优惠金额:{{costInfo.discountAmount}} 元
|
|
||||||
- 优惠券抵扣金额:{{costInfo.couponAmount}} 元 - 骑行卡抵扣金额:{{costInfo.cyclingCardAmount}} 元
|
|
||||||
</span>
|
|
||||||
</span>
|
|
||||||
</a-form-item>
|
|
||||||
</a-col>
|
|
||||||
</a-row>
|
|
||||||
<a-row>
|
|
||||||
<a-col :span="12">
|
|
||||||
<a-form-item
|
|
||||||
label="支付方式"
|
|
||||||
:label-col="{ span: 6 }"
|
|
||||||
:wrapper-col="{ span: 21 }"
|
|
||||||
>
|
|
||||||
<span>{{costInfo.payMethod}}</span>
|
|
||||||
</a-form-item>
|
|
||||||
</a-col>
|
|
||||||
<a-col :span="12">
|
|
||||||
<a-form-item
|
|
||||||
label="用户"
|
|
||||||
:label-col="{ span: 6 }"
|
|
||||||
:wrapper-col="{ span: 21 }"
|
|
||||||
>
|
|
||||||
<span>{{costInfo.phoneAndUser}}</span>
|
|
||||||
</a-form-item>
|
|
||||||
</a-col>
|
|
||||||
</a-row>
|
|
||||||
<a-row>
|
|
||||||
<a-col :span="24">
|
|
||||||
<a-form-item
|
|
||||||
label="申请退款原因"
|
|
||||||
:label-col="{ span: 3 }"
|
|
||||||
:wrapper-col="{ span: 21 }"
|
|
||||||
>
|
|
||||||
<span>{{costInfo.applyReason}}</span>
|
|
||||||
</a-form-item>
|
|
||||||
</a-col>
|
|
||||||
</a-row>
|
|
||||||
</a-form>
|
|
||||||
<a-divider></a-divider>
|
|
||||||
<a-form
|
|
||||||
:model="form"
|
|
||||||
ref="formRef"
|
|
||||||
label-align="left"
|
|
||||||
:label-col="{ span: 6 }"
|
|
||||||
:wrapper-col="{ span: 18 }"
|
|
||||||
>
|
|
||||||
<a-row>
|
|
||||||
<a-col :span="24">
|
|
||||||
<a-form-item
|
|
||||||
label="本次申请退款"
|
|
||||||
:label-col="{ span: 3 }"
|
|
||||||
:wrapper-col="{ span: 21 }"
|
|
||||||
>
|
|
||||||
<span>{{costInfo.applyRefundAmount}} 元 </span>
|
|
||||||
</a-form-item>
|
|
||||||
</a-col>
|
|
||||||
</a-row>
|
|
||||||
<a-row>
|
|
||||||
<a-col :span="24">
|
|
||||||
<a-form-item
|
|
||||||
label="操作"
|
|
||||||
:label-col="{ span: 3 }"
|
|
||||||
:wrapper-col="{ span: 21 }"
|
|
||||||
name="processState"
|
|
||||||
required
|
|
||||||
:rules="[{ required: true, message: '请选择审核结果' }]"
|
|
||||||
>
|
|
||||||
<a-radio-group
|
|
||||||
v-model:value="form.processState"
|
|
||||||
name="radioGroup"
|
|
||||||
@change="changeProcessState"
|
|
||||||
>
|
|
||||||
<a-radio value="3">驳回</a-radio>
|
|
||||||
<a-radio value="1">通过审核</a-radio>
|
|
||||||
</a-radio-group>
|
|
||||||
</a-form-item>
|
|
||||||
</a-col>
|
|
||||||
</a-row>
|
|
||||||
<a-row v-if="form.processState == '3'">
|
|
||||||
<a-col :span="24">
|
|
||||||
<a-form-item
|
|
||||||
label="驳回原因"
|
|
||||||
:label-col="{ span: 3 }"
|
|
||||||
:wrapper-col="{ span: 12 }"
|
|
||||||
name="processResult"
|
|
||||||
>
|
|
||||||
<a-input
|
|
||||||
v-model:value="form.processResult"
|
|
||||||
placeholder="请输入驳回原因"
|
|
||||||
/>
|
|
||||||
</a-form-item>
|
|
||||||
</a-col>
|
|
||||||
</a-row>
|
|
||||||
<a-row v-if="form.processState == '1'">
|
|
||||||
<a-col :xs="24">
|
|
||||||
<a-form-item
|
|
||||||
label="退款方式"
|
|
||||||
:label-col="{ span: 3 }"
|
|
||||||
:wrapper-col="{ span: 12 }"
|
|
||||||
name="parentId"
|
|
||||||
>
|
|
||||||
<a-select
|
|
||||||
v-model:value="form.refundMethod"
|
|
||||||
placeholder="请选择退款方式"
|
|
||||||
>
|
|
||||||
<a-select-option value="0">原路返回</a-select-option>
|
|
||||||
<a-select-option value="1">余额</a-select-option>
|
|
||||||
<a-select-option value="2">线下退款</a-select-option>
|
|
||||||
</a-select>
|
|
||||||
</a-form-item>
|
|
||||||
</a-col>
|
|
||||||
</a-row>
|
|
||||||
</a-form>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import { ref } from 'vue'
|
|
||||||
import { callPayment } from '@/apis/call.js'
|
|
||||||
import { message } from 'ant-design-vue'
|
|
||||||
import _ from 'lodash'
|
|
||||||
|
|
||||||
const formRef = ref();
|
|
||||||
const formData = () => ({
|
|
||||||
refundId: "",
|
|
||||||
processState: "3",
|
|
||||||
processResult: "",
|
|
||||||
refundMethod: ""
|
|
||||||
});
|
|
||||||
const costInfo = ref({
|
|
||||||
totalAmount: 0,
|
|
||||||
startupCost: 0,
|
|
||||||
durationCost: 0,
|
|
||||||
dispatchFee: 0,
|
|
||||||
dispatchFeeOutOperateArea: 0,
|
|
||||||
dispatchFeeBanArea: 0,
|
|
||||||
dispatchFeeOutOperateArea: 0,
|
|
||||||
parkingAreaOutDispatchFee: 0,
|
|
||||||
helmetManagementFee: 0,
|
|
||||||
improperParkFee: 0,
|
|
||||||
actualAmount: 0,
|
|
||||||
discountAmount: 0,
|
|
||||||
couponAmount: 0,
|
|
||||||
cyclingCardAmount: 0,
|
|
||||||
payMethod: "",
|
|
||||||
applyReason: "",
|
|
||||||
applyRefundAmount: 0,
|
|
||||||
phoneAndUser: ""
|
|
||||||
})
|
|
||||||
const form = ref(formData());
|
|
||||||
|
|
||||||
const openForm = (params = {}) => {
|
|
||||||
if (params['refundId']) {
|
|
||||||
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
const changeProcessState = (e) => {
|
|
||||||
const value = e.target.value;
|
|
||||||
if (value == '3') {
|
|
||||||
form.value.refundMethod = ""
|
|
||||||
} else if (value == '1') {
|
|
||||||
form.value.processResult = ""
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const formSave = (callBack) => {
|
|
||||||
formRef.value.validate().then((res) => {
|
|
||||||
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
const resetAll = (callBack) => {
|
|
||||||
Object.assign(form.value, formData());
|
|
||||||
formRef.value.resetFields();
|
|
||||||
if (callBack) {
|
|
||||||
callBack(true, form.value);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
defineExpose({ openForm, formSave, resetAll });
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
.spanCss {
|
|
||||||
height: 32px;
|
|
||||||
margin-left: 8px;
|
|
||||||
padding: 0 4px;
|
|
||||||
font-size: 12px;
|
|
||||||
line-height: 32px;
|
|
||||||
background: #f2f6fc;
|
|
||||||
border-radius: 4px;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
Loading…
x
Reference in New Issue
Block a user