<template>
  <v-card class="d-flex mx-auto" height="100%">
    <v-card class="mx-auto flex-grow-1 elevation-0">
      <v-card-text>
        <div>当前版本</div>
        <p class="text-h5 text--primary">
          {{ info.versionNo || '-' }}
        </p>
        <p>更新包上传</p>
        <div>
          <form-list class="mt-5" ref="form" :items="formItems"></form-list>
        </div>
      </v-card-text>
      <v-card-actions class="justify-center">
        <v-btn
          color="primary"
          class="elevation-5 buttons"
          rounded
          :loading="loading"
          @click="handleUpload"
        >
          <v-icon left>mdi-cloud-upload</v-icon>{{ $t('upload.uploadAndRun') }}
        </v-btn>
      </v-card-actions>
    </v-card>
    <div class="pa-3">
      <v-card
        class="mx-auto"
        width="700"
        height="100%"
        style="overflow: hidden;"
      >
        <div class="d-flex flex-column package">
          <log-details title="执行日志" :code="info.versionNo" :is-update="true"></log-details>
        </div>
      </v-card>
    </div>
  </v-card>
</template>

<script>
import FormList from '@/components/Form/list'
import LogDetails from './dynamic/logDetails'
import {
  uploadVersionPackage,
  versionLogHistory
} from '@/api/system'
export default {
  name: 'system-update-upload',
  components: { FormList, LogDetails },
  data () {
    return {
      loading: false,
      items: [],
      info: {},
      formItems: {
        options: [
          {
            type: 'upload',
            accept: '.zip, .7z, .bin',
            dense: true,
            error: false,
            label: '请上传.zip、.7z、.bin等文件格式的更新包',
            loading: false,
            outlined: true,
            multiple: false,
            placeholder: '点击上传更新包',
            rules: [v => v !== null || '请上传.zip、.7z、.bin等文件格式的更新包'],
            showSize: true,
            value: null
          }
        ]
      }
    }
  },
  created () {
    this.getNowVersion()
  },
  methods: {
    // 最新版本
    async getNowVersion (i) {
      try {
        const { data } = await versionLogHistory({ size: 1, current: 1 })
        if (!data.records.length) return
        this.info = data.records[0]
      } catch (error) {
        this.$snackbar.error(error)
      }
    },
    handleUpload () {
      if (!this.$refs.form.validate()) return
      this.$confirm('系统提示', '是否确定执行该更新包？').then(async () => {
        const file = this.formItems.options.find(e => e.type === 'upload').value
        const formData = new FormData()
        formData.append('package', file)
        formData.append('run', true)
        this.loading = true
        try {
          this.info.versionNo = ''
          const { data } = await uploadVersionPackage(formData)
          this.$snackbar.success('上传成功！')
          this.info = data
        } catch (error) {
          this.$snackbar.error(error)
        } finally {
          this.loading = false
        }
      })
    }
  }
}
</script>

<style lang="scss" scoped>
.package {
  height: 100%;
  overflow: hidden;
  &-content {
    overflow: auto;
  }
}
.box {
  height: 0;
  flex: 1;
  overflow: auto;
}
</style>
