<template>
    <el-dialog title="是否决定签约" center :visible.sync="show" width="600px">
        <el-form :model="form" ref="form" :rules="rules" label-width="110px" :inline="false" size="normal">
            <el-form-item label="是否签约">
                <el-radio-group v-model="form.check">
                    <el-radio :label="true">
                        是
                    </el-radio>
                    <el-radio :label="false">
                        否
                    </el-radio>
                </el-radio-group>
            </el-form-item>
            <el-form-item label="江苏省商标委托代理合同(双方盖章)">
                <attachment-upload v-model="form.attachment1" :fileSize.sync="form.attachment1.size">
                </attachment-upload>
            </el-form-item>
            <el-form-item label="收款回执">
                <attachment-upload v-model="form.attachment2" :fileSize.sync="form.attachment2.size">
                </attachment-upload>
            </el-form-item>
            <el-form-item prop="payRatio" label="支付比例">
                <el-select v-model="form.payRatio" clearable filterable placeholder="请选择">
                    <el-option
                        v-for="item in payRatioOptions"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value"
                    >
                    </el-option>
                </el-select>
            </el-form-item>
            <el-form-item>
                <el-button @click="onSave" type="primary">提交</el-button>
                <el-button @click="cancel">返回</el-button>
            </el-form-item>
        </el-form>
    </el-dialog>
</template>

<script>
import logoPatent from '@/mixins/logoPatent';
export default {
    name: 'Signed',
    mixins: [logoPatent],
    props: {
        info: {}
    },
    data() {
        return {
            show: false,
            form: {
                check: true,
                attachment1: {
                    attachmentName: '江苏省商标委托代理合同',
                    fileName: '',
                    url: '',
                    remark: '',
                    size: '',
                    version: '1'
                },
                attachment2: {
                    attachmentName: '收款回执',
                    fileName: '',
                    url: '',
                    remark: '',
                    size: '',
                    version: '1'
                },
                payRatio: ''
            },
            payRatioOptions: [
                { label: '全款', value: 'FULL_AMOUNT' },
                { label: '首付80%', value: 'DOWN_PAYMENT_80' },
                { label: '首付50%', value: 'DOWN_PAYMENT_50' }
            ],
            rules: {
                payRatio: { required: true, message: '请选择支付比例', trigger: 'change' }
            }
        };
    },
    methods: {
        onSave() {
            this.$refs.form.validate(valid => {
                if (valid) {
                    let info = { ...this.info };

                    info.check = this.form.check;
                    info.payRatio = this.form.payRatio;
                    if (!info.attachment) {
                        info.attachment = [];
                    }

                    this.$emit('uploadAttement', this.form.attachment1);
                    this.$emit('uploadAttement', this.form.attachment2);

                    let index = [...this.logoWorkflowOptions].findIndex(item => {
                        return item.value === info.logoWorkflow;
                    });

                    info.logoWorkflow = [...this.logoWorkflowOptions][index + 1].value;

                    this.$emit('submit', info);
                } else {
                    return false;
                }
            });
        },
        cancel() {
            this.$emit('cancel');
        }
    }
};
</script>

<style></style>
