<template>
  <el-dialog title="磁盘配置" :visible.sync="dialog.visible" width="600px" append-to-body>
    <basic-form :model="configs" label-suffix="：" label-width="140px">
      <basic-form-item label="系统盘（GB）"> <el-input-number v-model="configs.sysDisk.disk" :min="configs.templateDisk" :max="1024"> </el-input-number> </basic-form-item>
      <basic-form-item label="数据盘（GB）">
        <div v-for="(item, index) in configs.addDiskList" :key="index" class="m-b">
          <el-input-number v-model="item.disk" :min="item.templateDisk || 10" :max="65536" class="m-r"> </el-input-number>
          <span class="tip" v-if="!!item.templateDisk">浪潮云模板磁盘，最小{{ item.templateDisk }}GB，不可删除</span>
          <el-button v-else type="text" @click="handleSub(index)">删除</el-button>
        </div>
        <el-button type="text" @click="handleAdd">增加</el-button>
      </basic-form-item>
    </basic-form>
    <div slot="footer" class="dialog-footer">
      <el-button @click.native="dialog.visible = false">取消</el-button>
      <el-button type="primary" @click.native="handleSubmit">确定</el-button>
    </div>
  </el-dialog>
</template>

<script>
export default {
  name: 'EFCDataDisk',
  props: {
    dialog: {
      type: Object,
      default: () => ({
        visible: false,
        index: '',
        row: {}
      })
    }
  },
  computed: {
    configs() {
      return this.dialog.row.configs
    }
  },
  data() {
    return {}
  },
  methods: {
    handleAdd() {
      this.configs.addDiskList.push({ disk: 50 })
    },
    handleSub(index) {
      this.configs.addDiskList.splice(index, 1)
    },
    handleSubmit() {
      this.$emit('success', this.dialog.index)
      this.dialog.visible = false
    }
  }
}
</script>
