SmartCommunity/operationSupport/src/views/payService/depositManagement/stepPage/refund.vue

<template>
    <div class="lookDetail">
        <div class="formContent-item_title">房屋：{{ thisItem.assets }} <br />租户/业主：{{ thisItem.residentName }}</div>
        <el-form ref="form" :model="formData" :rules="formRules" label-width="110px">
            <el-col :span="12">
                <el-form-item label="费用类型：">
                    {{
                        !!thisItem['depositType'] && thisItem['depositType'] == 1
                            ? '装修押金'
                            : thisItem['depositType'] == 2
                            ? '租赁押金'
                            : thisItem['depositType'] == 3
                            ? '出入证押金'
                            : '门禁卡押金'
                    }}</el-form-item
                >
            </el-col>
            <el-col :span="12">
                <el-form-item label="费用金额(元)："> {{ thisItem.amount }}</el-form-item>
            </el-col>
            <el-col :span="12">
                <el-form-item label="退款方式" prop="paymentMode">
                    <el-select v-model="formData.paymentMode" placeholder="请选择退款方式">
                        <el-option label="微信" :value="7"></el-option>
                        <el-option label="支付宝" :value="2"></el-option>
                        <el-option label="现金" :value="3"></el-option>
                        <el-option label="其他" :value="5"></el-option>
                    </el-select>
                </el-form-item>
            </el-col>
            <el-col :span="12">
                <el-form-item label="退款金额(元)" prop="amount"
                    ><el-input oninput="value=value.replace(/[^0-9.]/g,'')" placeholder="请输入金额" v-model="formData.amount"></el-input
                ></el-form-item>
            </el-col>
            <el-form-item label="备注信息" style="clear: both">
                <el-input
                    type="textarea"
                    maxlength="100"
                    v-model="formData.remarks"
                    show-word-limit
                    resize="none"
                    rows="3"
                    placeholder="请输入备注信息"
                ></el-input>
            </el-form-item>
        </el-form>
    </div>
</template>
<script >
export default {
    props: ['params'],
    data() {
        return {
            thisItem: {},
            formData: {
                paymentMode: '',
                amount: '',
                remarks: '',
                id: ''
            },
            formRules: {
                paymentMode: [this.$valid.selectRequired('退款方式')],
                amount: [this.$valid.inputRequired('退款金额')]
            }
        };
    },

    methods: {
        submit() {
            this.$refs.form.validate((valid) => {
                if (valid) {
                    var loading = this.$loading();
                    this.$http
                        .post('/sc-charge/deposit/refund', this.formData)
                        .then(({ status, msg }) => {
                            if (status == 0) {
                                this.$message.success(msg);
                                this.params.callback();
                                this.$emit('close');
                            } else {
                                this.$message.error(msg);
                            }
                            loading.close();
                        })
                        .catch(() => {
                            loading.close();
                        });
                }
            });
        },
        getDatali(id) {
            this.$http
                .post('/sc-charge/deposit/find/' + id)
                .then(({ data, msg, status }) => {
                    if (status == 0) {
                        this.thisItem = data;
                    }
                })
                .catch(() => {});
        }
    },
    created() {
        this.thisItem = this.params.data;
        this.formData.id = this.params.data.id;
    }
};
</script>
<style lang="scss" scoped>
.lookDetail {
    /deep/ .el-form-item__label,
    /deep/.el-form-item__content {
        font-size: 12px;
        white-space: nowrap;
    }
    .formContent-item_title {
        font-weight: 600;
    }
}
</style>