<template>
<div>
     <div class='selecttype'>
        <span class="texttype">切片</span>
        <el-form-item label="面积_范围" :label-width="formLabelWidth2" >
      <el-input v-model="ruleForm.areaRange"  autocomplete="off"></el-input>
      </el-form-item>
      <div class="disflex lheig34 liitem">
               <div style="display:flex">
                        <el-checkbox
                          label="Solid"
                          v-model="ruleForm.solid_state"
                        ></el-checkbox>
                        <el-checkbox
                          label="Sectional plane"
                           v-model="ruleForm.sectional_plane_state"
                        ></el-checkbox>
               </div>
                    </div>  
          <div class="line">
      <div class="linetext">正常值</div>
    </div> 
     <el-form-item label="X" :label-width="formLabelWidth4" >
      <el-input v-model="ruleForm.normal_x" autocomplete="off"></el-input>
      </el-form-item>
           <el-form-item label="Y" :label-width="formLabelWidth4" >
      <el-input v-model="ruleForm.normal_y" autocomplete="off"></el-input>
      </el-form-item>
           <el-form-item label="Z" :label-width="formLabelWidth4" >
      <el-input v-model="ruleForm.normal_z" autocomplete="off"></el-input>
      </el-form-item>
          <div class="line">
      <div class="linetext">位置</div>
    </div> 
      <div class="yiinpu heigeinput">
    <el-form-item label="X" :label-width="formLabelWidth4">
      <el-input v-model="ruleForm.position_x" autocomplete="off"></el-input>
         <span style="width:120px">Xrange:{{range.xrange}}</span>
    </el-form-item>
 </div>
  <div class="yiinpu heigeinput">
    <el-form-item label="Y" :label-width="formLabelWidth4">
      <el-input v-model="ruleForm.position_y" autocomplete="off"></el-input>
         <span style="width:120px">Yrange:{{range.yrange}}</span>
    </el-form-item>
 </div>
  <div class="yiinpu heigeinput">
    <el-form-item label="Z" :label-width="formLabelWidth4">
      <el-input v-model="ruleForm.position_z" autocomplete="off"></el-input>
         <span style="width:120px">Zrange:{{range.zrange}}</span>
    </el-form-item>
 </div>
      <div class="line">
      <div class="linetext">位置</div>
    </div>
          <el-form-item label="类型" :label-width="formLabelWidth2">
              <el-select  v-model="ruleForm.type"  placeholder="请选择">
          <el-option
            v-for="item in conlist"
            :key="item.value"
            :label="item.name"
            :value="item.value"
            >
          </el-option>
        </el-select>
        </el-form-item>
          <el-form-item label="标量" :label-width="formLabelWidth2">
              <el-select  v-model="ruleForm.variableName"  placeholder="请选择">
          <el-option
            v-for="item in variableNamearr1"
            :key="item"
            :label="item"
            :value="item"
            >
          </el-option>
        </el-select>
        </el-form-item>
           <el-form-item label="Level" :label-width="formLabelWidth2">
          <el-input-number v-model="ruleForm.level" controls-position="right"  :min="1" :max="10"></el-input-number>
               </el-form-item>
               <div class="disflex lheig34 liitem">
                      <div style="display:flex">
                        <el-checkbox
                        v-model="ruleForm.sectional_contour_state"
                          label="sectionalcontour"
                        ></el-checkbox>
                        <el-checkbox
                        v-model="ruleForm.scalar_value_state"
                          label="Scalarvalue"
                        ></el-checkbox>
                      </div>
                    </div> 
  </div>
</div>
</template>

<script>
export default {
  props:{
 ruleForm: {
          type: Object,
          default () {
            return {}
          }
          
        },
        //  variableNamearr1:{
        //   type: String,
        //   default () {
        //     return {}
        //   }
          
        // },
  // variableNamearr1:{
  //         type: Array,
  //         default () {
  //           return {}
  //         }
          
  //       },
  },
        data(){
            return{
              range:{
                xrange:'0.0',
                yrange:'0.0',
                zrange:'0.0',
                },
                // ruleForm:{
                // fw:'1',
                // slicecheck:'Solid',
                // sx:'',
                // sy:'',
                // sx:'',
                // rx:'',
                // yx:'',
                // zx:'',
                // con:'0',
                // colorlevel:'Sectionalplane',
                // secheck:'',
                
                // },
                variableNamearr1:['r','u','ma'],
                  formLabelWidth: '60px',
                    formLabelWidth2:'73px',
                    formLabelWidth4:'37px',
                    formLabelWidth5:'100px',
                    formLabelWidth6:'120px',
                    formLabelWidth7:'170px',
                     conlist:[
            {value:'line', name: "line" },
            {value:'contour', name: "contour"},
          ],
          con:'0',
            }
        },
        created() {
      
         },
        methods:{
      
        
              getarrs(arr){
                  this.variableNamearr1=arr;
          
                
              }
              
        }
       
}
</script>

<style lang="scss">
@import '@/styles/variables.scss';
@import '@/styles/mixin.scss';
.selecttype{
      position: relative;
      margin: 35px 0 20px 0;
      border:1px solid;
      padding:15px;
.divselect{
  display:flex;
  .el-radio{
        height: 23px;
    line-height: 23px;
  }
}

}
.texttype{
  position: absolute;
    display: inline-block;
    top: -13px;
    left: 50%;
    margin: 0 auto;
    margin-left: -27px;
    font-size: 12px;
    background-color: #fff;
    padding: 3px 5px;
}
</style>