<template>
    <div class="voteForm">
        <el-form ref="form" :model="form" label-width="80px" class="">
            <el-form-item label="表决议题">
                <el-input v-model="form.title"></el-input>
            </el-form-item>


            <el-form-item label="表决详情">
                <el-input type="textarea" v-model="form.content"></el-input>
            </el-form-item>

            <el-form-item label="表决选项" v-for="(item,index) in form.options" style="margin-top: 10px;">
                <el-input  v-model="item.value"></el-input>
                <el-button  type="danger" icon="el-icon-delete" plain  @click="delOption(index)"  :disabled="disable">删除</el-button>
            </el-form-item>
            <el-form-item>
                <el-button  type="primary" icon="el-icon-plus" plain  @click="addOption" >新增</el-button>
            </el-form-item>

        </el-form>
    </div>

</template>

<script>
    export default {
        name: "voteForm",
        data(){
            return {
                form:{
                    activityId:"",
                    title:"",content:'',
                    options:[
                        {value:""},
                        {value:""}
                    ]
                },

            }
        },
        computed:{
           disable(){

               return this.form.options.length < 3?true:false;
           }
        },
        methods:{
            addOption(){
                this.form.options.push({
                    value:"",
                })
            },
            delOption(index){
                this.form.options.splice(index,1);
            }
        }
    }
</script>

<style lang="less" scoped>
    .voteForm {
        /deep/ .el-form-item__content{
            display: flex;
        }
    }
</style>
