<template>
  <el-card class="wrapper-container">
    <div v-show="!detaildialogVisible">
      <div class="search-content m-b">
        <el-input class="search-item" placeholder="主机名称" v-model="listQuery.name"> </el-input>
        <el-button class="m-l-md" style="margin-left: 15px" type="ghost" icon="el-icon-search" @click="handleSearch">搜索</el-button>
        <!-- <el-button class="m-l-md" type="ghost" icon="el-icon-delete" @click="deleteRecycle">清空回收站</el-button> -->
      </div>
      <basic-table :data="list" :params="params" :get-list="getList" :total="total">
        <el-table-column label="名称" show-overflow-tooltip prop="name"> </el-table-column>
        <el-table-column label="IP" prop="address" show-overflow-tooltip>
          <template slot-scope="scope">
            <div v-if="scope.row.vendorType == 'OPENSTACK' || scope.row.vendorType == 'EASYSTACK' || scope.row.vendorType == 'MANAGEONE' || scope.row.vendorType == 'FUSIONCLOUD'">
              <span v-for="item in scope.row.privateIpsList" :key="item.networkId">
                <div v-for="(items1, index) in item.addresses" :key="index">(内网){{ items1.address + (!item.networkName ? '' : '(' + item.networkName + ')') }}</div>
              </span>
            </div>
            <div v-else-if="scope.row.vendorType == 'SMARTX' || scope.row.vendorType == 'ARCHEROS' || scope.row.vendorType == 'CLOUDTOWER'">
              <div>{{ scope.row.managerIp ? '(内网)' + scope.row.managerIp : '--' }}</div>
            </div>
            <div v-else-if="scope.row.vendorType == 'VMWARE' || scope.row.vendorType == 'INSPURRAIL' || scope.row.vendorType == 'POWERVC'">
              <div v-for="(item, index) in scope.row.privateIpsList" :key="index">(内网){{ !item.address ? '' : item.address + (!item.networkName ? '' : '(' + item.networkName + ')') }}</div>
            </div>
            <div v-else-if="scope.row.vendorType == 'HUAWEI'">
              <div v-for="(item, index) in scope.row.privateIpsList" :key="index">{{ item.type == 'floating' ? '(公网)' : '(内网)' }}{{ !item.address ? '' : item.address + (!item.networkName ? '' : '(' + item.networkName + ')') }}</div>
            </div>
            <div v-else-if="scope.row.vendorType == 'QCLOUD'">
              <div v-for="(item, index) in scope.row.privateIpsList" :key="index">(内网){{ item.address }}</div>
            </div>
            <div v-else-if="scope.row.vendorType == 'AZURE' || scope.row.vendorType == 'AWS'">
              <div v-for="item in scope.row.privateIpsList" :key="item">(内网){{ item }}</div>
            </div>
            <div v-else-if="scope.row.vendorType == 'JDCLOUD'">
              <div v-for="(item, index) in scope.row.privateIpsList" :key="index">(内网){{ item }}</div>
            </div>
            <div v-else-if="scope.row.vendorType == 'SANGFOR'">
              <div>{{ scope.row.privateIps }}</div>
            </div>
            <div v-else>
              <div v-for="item in scope.row.privateIpsList" :key="item">(内网){{ item }}</div>
            </div>
            <div v-if="scope.row.floatingIp">(公网){{ scope.row.floatingIp }}</div>
            <div v-if="scope.row.vendorType == 'TENCENT' || scope.row.vendorType == 'ALIYUN' || scope.row.vendorType == 'AZURE' || scope.row.vendorType == 'AWS' || scope.row.vendorType == 'QCLOUD'">
              <div v-for="(item, index) in scope.row.publicIpsList" :key="index">(公网){{ item }}</div>
            </div>
            <div v-if="scope.row.accessIp">
              {{ scope.row.accessIp }}
            </div>
          </template>
        </el-table-column>
        <el-table-column label="UUID" show-overflow-tooltip prop="sn"> </el-table-column>
        <el-table-column label="配置" show-overflow-tooltip prop="spec"> </el-table-column>
        <el-table-column label="订购产品" prop="type" show-overflow-tooltip> </el-table-column>
        <el-table-column label="移入时间" prop="gmtCreate" show-overflow-tooltip> </el-table-column>
        <el-table-column label="操作" width="220px">
          <template slot-scope="scope">
            <el-button type="text" :disabled="scope.row.isExpired" @click="handleOperate(scope.row)"> 还原 </el-button>
            <div class="action-divider"></div>
            <el-button :disabled="scope.row.isDelete" type="text" @click="remove(scope.row)"> 删除 </el-button>
          </template>
        </el-table-column>
      </basic-table>
    </div>
  </el-card>
</template>

<script>
import webSocket from '@/common/mixins/getGlobalSocket'
import { detailVm, getSnapshot, getRes } from 'services/platform/index'
import { getRecycle, deleteRecycle, patchRecycle, checkUnderway } from 'services/system/recycle'
import { unsubscribeService, unsubscribeServiceEFC } from 'services/services/product'

export default {
  mixins: [webSocket],
  data() {
    return {
      list: null,
      total: null,
      listQuery: {
        name: ''
      },
      params: {
        page: 1,
        rows: 10,
        params: JSON.stringify([{ param: { isRecycle: 1 }, sign: 'EQ' }])
      },
      vmDetail: null,
      detaildialogVisible: false,
      snapParam: {
        page: 1,
        rows: 10
      },
      snapList: null,
      snapTotal: null,
      operateParam: {
        page: 1,
        rows: 10
      },
      operateList: null,
      operateTotal: null
    }
  },
  created() {
    this.handleSearch()
  },
  updated() {},
  methods: {
    onmessage(data) {
      this.handleSearch()
    },
    goBack() {
      this.detaildialogVisible = false
    },
    getList() {
      getRecycle(this.params).then(data => {
        if (data.success) {
          this.list = data.data.rows
          this.total = data.data.total
          const nowTime = new Date()
          this.list.forEach(item => {
            if (item.privateIps) item.privateIpsList = JSON.parse(item.privateIps)
            if (item.publicIps) item.publicIpsList = JSON.parse(item.publicIps)
            this.judgeOperate(item)
            this.$set(item, 'isDelete', false)
            item.isExpired = false
            const expiredTimeDate = new Date(item.expiredTime).getTime()
            if (expiredTimeDate < nowTime.getTime()) {
              item.isExpired = true
            }
            item.privateIpsList = item.privateIps ? JSON.parse(item.privateIps) : ''
            if (item.vendorType === 'SANGFOR' && item.privateIps) {
              item.privateIps = Object.values(JSON.parse(item.privateIps))
                .map(item => Object.keys(item)[0])
                .toString()
            }
          })
        }
      })
    },
    // 组合云主机配置
    judgeOperate(data) {
      data.hostConfig = data.cpu + 'C/' + data.memory + 'GB/' + data.disk + 'GB'
    },
    handleSearch() {
      this.params.page = 1
      this.params.params = this.$tools.handleSearchParam({
        'name:LK': this.listQuery.name
      })
      this.getList()
    },
    getIps(record) {
      const { vendorType, privateIps, managerIp } = record
      if (!privateIps) return []
      switch (vendorType) {
        case 'VMWARE':
        case 'INSPURRAIL':
          return JSON.parse(privateIps).map(item => item.address)
        case 'OPENSTACK':
        case 'EASYSTACK':
          const ary = []
          JSON.parse(privateIps).map(item => {
            item.addresses.map(item1 => {
              ary.push(item1.address)
            })
          })
          return ary
        case 'HUAWEI':
          return JSON.parse(privateIps).map(item => item.address)
        case 'SANGFOR':
          return privateIps.split(',')
        case 'ARCHEROS':
        case 'CLOUDTOWER':
          return [managerIp] // 后续要改
        default:
          return JSON.parse(privateIps).map(item => item)
      }
    },
    formatClearData(record) {
      const { name, spec, accessIp, sn: instance } = record
      if (accessIp) {
        return {
          instance,
          instanceName: name,
          preview: [
            { label: '名称', value: name },
            { label: '规格', value: spec },
            { label: 'IP地址', value: accessIp }
          ]
        }
      }
      const ips = this.getIps(record)
      return {
        instance,
        instanceName: name,
        preview: [
          { label: '云主机名称', value: name },
          { label: '云主机规格', value: spec },
          { label: 'IP地址', value: ips }
        ]
      }
    },
    remove(data) {
      this.$set(data, 'isDelete', true)
      this.$confirm('您确定要删除该数据？', '提示', {
        confirmButtonClass: 'el-button--danger',
        type: 'warning'
      }).then(async () => {
        const isVm = data.type.includes('Computer')
        const http = isVm ? unsubscribeServiceEFC : unsubscribeService
        http(this.formatClearData(data)).then(data => {
          if (data.success) {
            this.$message.success({
              message: data.message,
              type: 'success'
            })
            this.$emit('getList')
          }
        })
      })
    },
    deleteRecycle(data) {
      this.$confirm('您确定要清空回收站吗？', '提示', {
        confirmButtonClass: 'el-button--danger',
        type: 'warning'
      }).then(async () => {
        const res = await getRecycle({ page: 1, rows: 9999 })
        if (res.success) {
          const params = res.data.rows.map(item => this.formatClearData(item))
          const result = await deleteRecycle(params)
          if (result.success) {
            this.$message.success(result.message)
            this.handleSearch()
          }
        }
      })
    },
    handleOperate(data) {
      this.$confirm('您确定要恢复该数据吗？', '提示', {
        confirmButtonClass: 'el-button--danger',
        type: 'warning'
      }).then(async () => {
        const { success } = await checkUnderway({ sn: data.sn })
        if (success) {
          patchRecycle({ id: data.id, type: data.type, resourceId: data.resourceId }).then(data => {
            if (data.success) {
              this.$notify({
                message: data.message,
                type: 'success'
              })
              this.handleSearch()
            }
          })
        }
      })
    },
    getSnapshots() {
      this.snapParam.params = JSON.stringify([{ param: { vmId: this.vmDetail.id }, sign: 'EQ' }])
      getSnapshot(this.snapParam).then(data => {
        if (data.success) {
          this.snapList = data.data.rows
          this.snapTotal = data.data.total
        }
      })
    },
    getOperate() {
      this.operateParam.params = JSON.stringify([
        {
          param: {
            resourceId: this.vmDetail.id,
            vendorId: this.vmDetail.vendorId,
            object: 'VM'
          },
          sign: 'EQ'
        }
      ])
      getRes(this.operateParam).then(data => {
        if (data.success) {
          this.operateList = data.data.rows
          this.operateTotal = data.data.total
        }
      })
    }
  }
}
</script>
