 <template>
  <ai-detail>
    <template slot="title">
      <ai-title title="规则设置" isShowBack isShowBottomBorder @onBackClick="cancel(false)">
      </ai-title>
    </template>
    <template slot="content">
      <ai-card title="规则设置">
        <template #content>
          <el-form ref="form" class="ai-form" :model="form" label-width="110px" label-position="right">
            <el-form-item label="投票设置" style="width: 100%" prop="voteLimitNumber" :rules="[{required: true, message: '请输入投票设置', trigger: 'blur'}]">
              <el-input-number v-model="form.voteLimitNumber" :min="1" size="small" placeholder="请输入投票设置"></el-input-number>
              <span style="margin-left: 10px;">票/人天</span>
            </el-form-item>
            <el-form-item label="前言设置" style="width: 100%" prop="preface" :rules="[{required: true, message: '请输入前言设置', trigger: 'change'}]">
              <ai-editor v-model="form.preface" :instance="instance"/>
            </el-form-item>
            <el-form-item label="结尾设置" style="width: 100%" prop="ending" :rules="[{required: true, message: '请输入结尾设置', trigger: 'change'}]">
              <ai-editor v-model="form.ending" :instance="instance"/>
            </el-form-item>
          </el-form>
        </template>
      </ai-card>
    </template>
    <template slot="footer">
      <el-button @click="cancel" style="width: 100px">取消</el-button>
      <el-button type="primary" @click="onConfirm" style="width: 100px">确认</el-button>
    </template>
  </ai-detail>
</template>

<script>
  export default {
    name: 'Detail',

    props: {
      instance: Function,
      dict: Object,
      params: Object
    },

    data () {
      return {
        form: {
          day: '',
          preface: '',
          ending: '',
          id: ''
        }
      }
    },

    created () {
      this.getInfo()
    },

    methods: {
      getInfo () {
        this.instance.post(`/app/appvideovoteconfig/queryDetailByCorpId`).then(res => {
          if (res.code == 0) {
            if (res.data) {
              this.id = res.data.id
              this.form = {
                ...res.data
              }
            }
          }
        })
      },

      onConfirm () {
        this.$refs.form.validate((valid) => {
          if (valid) {
            if (!this.form.preface) {
              return this.$message.error('请输入前言设置')
            }

            if (!this.form.ending) {
              return this.$message.error('请输入前言设置')
            }

            this.instance.post(`/app/appvideovoteconfig/addOrUpdate`, {
              ...this.form,
              id: this.id || ''
            }).then(res => {
              if (res.code == 0) {
                this.$message.success('提交成功！')
                this.cancel()
              }
            })
          }
        })
      },

      cancel () {
        this.$emit('change', {
          type: 'List',
          isRefresh: true
        })
      }
    }
  }
</script>

<style scoped lang="scss">
</style>
