<template>
  <div>
    <el-button type="text" @click="modify(scope)"><i class="el-icon-edit"></i> 编辑</el-button>
    <div class="action-divider"></div>
    <el-button type="text" :disabled="scope.disDel || scope.allDisabled" @click="dropdownClick({ index: 2, row: scope })"><i class="el-icon-delete"></i> 删除 </el-button>
    <div class="action-divider"></div>
    <el-dropdown @command="dropdownClick">
      <span class="el-dropdown-link"> 更多<i class="el-icon-arrow-down el-icon--right"></i> </span>
      <el-dropdown-menu slot="dropdown">
        <el-dropdown-item :command="{ row: scope, index: 4 }" :disabled="scope.disStart || scope.isExpired || scope.allDisabled || (scope.vendorType == 'OPENSTACK' && scope.status == 'SUSPENDED')"> 开机 </el-dropdown-item>
        <el-dropdown-item :command="{ row: scope, index: 5 }" :disabled="scope.disStop || scope.isExpired || scope.allDisabled || (scope.vendorType == 'OPENSTACK' && scope.status == 'SUSPENDED')"> 关机 </el-dropdown-item>
        <el-dropdown-item :command="{ row: scope, index: 6 }" :disabled="scope.disRestart || scope.isExpired || scope.allDisabled"> 重启 </el-dropdown-item>
        <el-dropdown-item :disabled="scope.status == 'EXCEPTION'" :command="{ row: scope, index: 7 }"> 加入安全组 </el-dropdown-item>
        <el-dropdown-item :disabled="scope.status == 'EXCEPTION'" :command="{ row: scope, index: 8 }"> 移除安全组 </el-dropdown-item>
        <el-dropdown-item :command="{ index: 11, data: scope }"> 重置主机系统 </el-dropdown-item>
        <el-dropdown-item :command="{ index: 13, data: scope }" :disabled="scope.status != 'STOPPED' && scope.status != 'RUNNING'"> 绑定密钥 </el-dropdown-item>
        <el-dropdown-item :command="{ index: 14, data: scope }" :disabled="scope.status != 'STOPPED' && scope.status != 'RUNNING'"> 解绑密钥 </el-dropdown-item>
        <el-dropdown-item :command="{ row: scope, index: 15 }" :disabled="scope.disPostpone"> 延期 </el-dropdown-item>
      </el-dropdown-menu>
    </el-dropdown>
    <modify-pas :add-data="modifyPasswordData" v-if="modifyPasswordData.dialog"></modify-pas>
    <bind-ip :add-data="ipData" v-if="ipData.dialog"></bind-ip>
    <add-group :add-data="addGroupData" v-if="addGroupData.dialog"></add-group>
    <remove-group :add-data="removeGroupData" v-if="removeGroupData.dialog"></remove-group>
    <reset-os :add-data="restSystemData" v-if="restSystemData.dialog"></reset-os>
    <key :add-data="keyData" v-if="keyData.dialog"></key>
  </div>
</template>

<script>
import modifyPas from './dialog/txModifyPas.vue'
import bindIp from './dialog/bindIp.vue'
import addGroup from './dialog/txAddGroup.vue'
import removeGroup from './dialog/removeGroup.vue'
import resetOs from './dialog/resetQcloudOs.vue'
import key from './dialog/qcloudKey.vue'
import { patchVmId } from 'services/platform/index'
export default {
  props: {
    scope: {
      type: Object
    }
  },
  components: {
    modifyPas,
    bindIp,
    addGroup,
    removeGroup,
    resetOs,
    key
  },
  data() {
    return {
      modifyPasswordData: {
        dialog: false,
        data: {}
      },
      ipData: {
        dialog: false,
        data: {}
      },
      addGroupData: {
        dialog: false,
        data: {}
      },
      removeGroupData: {
        dialog: false,
        data: {}
      },
      restSystemData: {
        dialog: false,
        data: {}
      },
      keyData: {
        dialog: false,
        data: {}
      }
    }
  },
  methods: {
    dropdownClick(command) {
      const row = command.row
      const flag = command.index
      this.rowData = row
      let action = ''
      let tip = ''
      switch (flag / 1) {
        case 2: // 删除
          tip = '您确定要删除该主机？'
          action = 'recycle'
          this.message(tip, action, row.id)
          break
        case 4: // 开机
          tip = '您确定要启动该主机？'
          action = 'start'
          this.message(tip, action, row.id)
          break
        case 5: // 关机
          tip = '您确定要关闭该主机？'
          action = 'stop'
          this.message(tip, action, row.id)
          break
        case 6: // 重启
          tip = '您确定要重启该主机？'
          action = 'restart'
          this.message(tip, action, row.id)
          break
        case 7: // 加入安全组
          this.addGroupData = {
            dialog: true,
            data: {
              id: row.id,
              vendorId: row.vendorId,
              regionId: row.regionId
            }
          }
          break
        case 8: // 移除安全组
          this.removeGroupData = {
            dialog: true,
            data: {
              id: row.id,
              groups: []
            }
          }
          break
        case 11:
          // 重装操作系统
          this.$confirm('重置主机系统会将你的操作系统盘重置为初始状态（注意：不是重置密码），确定执行此操作嘛', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning'
          }).then(() => {
            this.restSystemData = {
              dialog: true,
              data: {
                id: command.data.id,
                instanceId: command.data.instanceId,
                regionId: command.data.regionId,
                vendorId: command.data.vendorId
              }
            }
          })
          break
        case 13:
          this.keyData = {
            dialog: true,
            flag: true,
            data: {
              id: command.data.id,
              vendorId: command.data.vendorId
            }
          }
          break
        case 14:
          this.keyData = {
            dialog: true,
            flag: false,
            data: {
              id: command.data.id,
              vendorId: command.data.vendorId
            }
          }
          break
        case 15: // 延期
          this.$emit('time', row)
          break
        default:
      }
    },
    emit() {
      this.$emit('getList')
    },
    modify(data) {
      this.$emit('modify', data)
    },
    message(tip, action, id) {
      this.$confirm(tip, '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        patchVmId(action, { id: id }).then(data => {
          if (data.success) {
            this.$message({
              type: 'success',
              message: data.message
            })
            this.emit()
          }
        })
      })
    }
  },
  created() {}
}
</script>

<style scoped></style>
