<template>
  <div class="inline-16">
    <el-button size="small" type="text" @click="show">编 辑</el-button>
    <el-dialog  :visible.sync="drawer" width="500px" >
      <div slot="title" style="font-size: 15px">
        自定义分类/
        <el-tag size="mini" >{{classname}}</el-tag>
      </div>
      <div>
        <el-row :gutter="20">
          <el-form :model="form"   ref="form"  size="mini" label-position="right" label-width="90px">
            <el-col :span="20">
              <el-form-item  label="值:">
                <el-input type="textarea" autosize v-model="form.value" placeholder="输入值"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="20">
              <el-form-item  label="描述:">
                <el-input type="text" autosize v-model="form.remarks" placeholder="输入描述"></el-input>
              </el-form-item>
            </el-col>
          </el-form>
        </el-row>
      </div>
      <div class="dialog-footer">
        <el-button size="small" @click="close" class="normal-btn-width">取 消</el-button>
        <el-button size="small" type="primary" @click="onSubmit"   class="normal-btn-width btn-primary">确 定</el-button>
      </div>
    </el-dialog>
  </div>

</template>

<script>
export default {
  name: "edit",
  props:["data","classname"],
  data(){
    return {
      drawer:false,
      form:{
        optiontypeid: '',
        optiontypemxid:'',
        isused: "1",
        value:'',
        remarks:'',
        sequence:2
      }
    }
  },
  methods:{
    show(){
      this.drawer = true
      this.form.optiontypemxid = this.data.optiontypemxid
      this.form.optiontypeid = this.data.optiontypeid
      this.form.value = this.data.value
      this.form.remarks = this.data.remarks

    },
    onSubmit(){
      this.$refs['form'].validate(async (valid) => {
        if (!valid) return false
        const res = this.$api.requested({ "id": 20220901092601,content:this.form})
        this.tool.showMessage(res,()=>{
          this.drawer = false
          this.$emit('updateSuccess')
        })
      });
    },
    close(){
      this.drawer = false
    }
  }
}
</script>

<style scoped>

</style>