费用信息

src/main/vue/src/components/fee/BackBill.vue

@@ -0,0 +1,150 @@
+<template>
+    <el-dialog title="发票回传" :visible.sync="show" center width="600px">
+        <el-form
+            hide-required-asterisk
+            :model="form"
+            :rules="rules"
+            ref="form"
+            label-width="140px"
+            style="padding-right: 130px;"
+            class="fee"
+        >
+            <el-form-item prop="paymentDate" label="支付日期">
+                <el-date-picker
+                    v-model="form.paymentDate"
+                    type="date"
+                    value-format="yyyy-MM-dd"
+                    placeholder="选择日期"
+                    style="width: 100%;"
+                >
+                </el-date-picker>
+                 <el-radio-group v-model="form.reviewRequire">
+                    <el-radio :label="true">
+                        是
+                    </el-radio>
+                    <el-radio :label="false">
+                        否
+                    </el-radio>
+                </el-radio-group>
+            </el-form-item>
+            <el-form-item prop="remark" label="备注">
+                <el-input v-model="form.remark"></el-input>
+            </el-form-item>
+            <el-form-item label="付款图片" prop="payment">
+                <attachment-upload v-model="form.payment"></attachment-upload>
+            </el-form-item>
+
+            <el-form-item>
+                <el-button style="width: 150px;" size="normal" type="primary" @click="onSave">提交</el-button>
+                <el-button style="width: 120px;" size="normal" @click="show = false">取消</el-button>
+            </el-form-item>
+        </el-form>
+    </el-dialog>
+</template>
+<script>
+export default {
+    name: 'FeeEdit',
+    props: {
+        info: {
+            type: Object,
+            default: () => {
+                return {};
+            }
+        }
+    },
+    created() {},
+    data() {
+        return {
+            show: false,
+            saving: false,
+            form: {
+                payment: { fileName: '', url: '', remark: '', size: '' }
+            },
+            rules: {
+                paymentDate: { required: true, message: '请选择支付日期', trigger: 'blur' },
+                remark: { required: true, message: '请输入备注', trigger: 'blur' },
+                payment: {
+                    validator: (rule, value, callback) => {
+                        if (!value.url) {
+                            callback(new Error('请上传付款图片'));
+                        } else {
+                            callback();
+                        }
+                    },
+                    trigger: 'change'
+                }
+            },
+            feeMaintenanceIdOptions: [],
+            statusOptions: [
+                { label: '已支付', value: 'PAID' },
+                { label: '未支付', value: 'UNPAID' }
+            ],
+            patentPartnerIdOptions: [],
+            payPartnerIdOptions: [],
+            currencyMaintenanceIdOptions: []
+        };
+    },
+    computed: {
+        feeList() {
+            if (this.form.feeType) {
+                let feeType = [...this.feeMaintenanceIdOptions].find(item => {
+                    return item.value === this.form.feeType;
+                }) || { children: [] };
+                console.log(feeType);
+                console.log([...this.feeMaintenanceIdOptions]);
+                return feeType.children.map(item => {
+                    return {
+                        label: item.name,
+                        value: item.name
+                    };
+                });
+            } else {
+                return [];
+            }
+        }
+    },
+    methods: {
+        init() {
+            this.$nextTick(() => {
+                this.form = { ...this.info, payment: { fileName: '', url: '', remark: '', size: '' } };
+                this.show = true;
+            });
+        },
+        onSave() {
+            this.$refs.form.validate(valid => {
+                if (valid) {
+                    this.submit();
+                } else {
+                    return false;
+                }
+            });
+        },
+        submit() {
+            let data = { ...this.form };
+            delete data.payment;
+            data.paymentImg = this.form.payment.url;
+            data.paymentRemark = this.form.payment.remark;
+            data.status = 'PAID';
+            this.saving = true;
+            this.$http
+                .post('/fee/save', data, { body: 'json' })
+                .then(res => {
+                    this.saving = false;
+                    this.$message.success('成功');
+                    this.$emit('refreash');
+                    this.show = false;
+                })
+                .catch(e => {
+                    console.log(e);
+                    this.saving = false;
+                    this.$message.error(e.error);
+                });
+        }
+    }
+};
+</script>
+<style lang="less">
+.fee.el-form .el-select {
+    width: 100%;
+}
+</style>