<template>
    <div class="bill">
      <div class="title">单据信息</div>
        <div>
          <div style="display:flex;justify-content: center;margin-top: 70px">
            <div style="display:flex">
              <div style="width:56px; line-height: 36px; margin-right:20px">单据ID</div>
              <el-input v-model="input" style="width:300px" placeholder="请输入内容"></el-input>
            </div>
            <div style="display:flex;margin-left:70px">
              <div style="line-height: 36px; margin-right:20px">控制器名</div>
              <el-input v-model="input" style="width:300px" placeholder="请输入内容"></el-input>
            </div>
          </div>
          <div style="display:flex;justify-content: center;margin: 55px 0">
            <div style="display:flex">
                <div style="width:56px; line-height: 36px; margin-right:20px">上级菜单</div>
                <el-select v-model="value" placeholder="请选择" style="width:300px">
                  <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
                </el-option>
              </el-select>
              <div style="display:flex;margin-left:70px">
                <div style="line-height: 36px; margin-right:20px">控制器名</div>
                <el-input v-model="input" style="width:300px" placeholder="请输入内容"></el-input>
              </div>
            </div>
          </div>
          <div style="display:flex;justify-content: center">
            <div style="display:flex">
              <div style="line-height: 36px; margin-right:20px">功能描述</div>
              <el-input v-model="input"  type="textarea" style="width:300px" placeholder="请输入内容"></el-input>
            </div>
            <div style="margin:20px 0 0 70px;width: 376px">
              <el-radio v-model="radio" label="1">备选项</el-radio>
              <el-radio v-model="radio" label="2">备选项</el-radio>
              <el-radio v-model="radio" label="2">备选项</el-radio>
            </div>
          </div>
        </div>
    </div>
</template>

<script>
export default {
  data () {
    return {
      input:'',
      radio:'',
      options: [{
          value: '选项1',
          label: '黄金糕'
        }, {
          value: '选项2',
          label: '双皮奶'
        }, {
          value: '选项3',
          label: '蚵仔煎'
        }, {
          value: '选项4',
          label: '龙须面'
        }, {
          value: '选项5',
          label: '北京烤鸭'
        }],
    }
  },

  components: {},

  computed: {},

  mounted(){},

  methods: {}
}

</script>
<style  scoped lang='scss'>
.bill {
  width: 1200px;
  height: 500px;
  background: #fff;
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -250px;
  margin-left: -600px;
  .title {
    color: #000;
    font-size: 28px;
    text-align: center;
    padding: 20px 0;
    margin: 0 30px;
    border-bottom: 1px solid #ccc;
  }
}
</style>