<template>
    <div>
        <h3></h3>
        <dynamic-form ref="taskForm" :formProps="taskForm"   style="width:500px">
            <el-form-item>
                <el-button @click="$router.go(-1)">取消</el-button>
                <el-button @click="completeTask" type="primary" :loading="loading">完成</el-button>
            </el-form-item>
        </dynamic-form>
    </div>
</template>
<script>
import axios from 'axios'
import DynamicForm from '../components/DynamicForm'

export default {

    data() {
        return {
            taskForm: [],
            taskFormData: {},
            loading: false
        }
    },
    created() {
        this.$http.get({
            url: '/rest/form/form-data',
            data: {
                taskId: this.$route.query.id
            }
        }).then(res => {
            this.taskForm = res.formProperties;
            this.taskFormData = {};
        })
    },
    methods: {
        completeTask() {
            this.$refs.taskForm.validate(valid => {
                if (valid) {
                    this.loading = true
                    axios.post('rest/form/form-data', {
                        taskId: this.$route.query.id,
                        properties: this.$refs.taskForm.getData()
                    }).then(res => {
                        this.loading = false;
                        this.$message.success('成功');
                        this.$router.go(-1)
                    }).catch(e => {
                        console.log(e);
                        this.loading = false;
                        this.$message.error('失败');
                    })
                }
            })
        }
    },
    components: {
        DynamicForm
    }
}
</script>
<style lang="less" scoped>
</style>
