<template>
    <el-alert title="lic已失效，请通过mac地址，重新导入lic文件" type="warning" :closable='false' center />
    <div class='app-container'>
        mac地址：{{ macAddress }}
        <el-button type="primary" style="width: 100px; margin-top: 20px;" @click="handleSelected">导入lic文件</el-button>
        <input ref="uploadInput" type="file" style="display: none;" accept=".tmp" @change="submitUpload" />
    </div>
</template>

<script setup lang='ts'>
import { ref } from 'vue'
import { getMacAddress, importFile } from '@/services/api/login/login'
import { ElMessage } from 'element-plus'

const macAddress = ref()
const uploadInput = ref()

const handleSelected = () => uploadInput.value.click()

// //选好文件之后点击打开按钮
const submitUpload = (e: any) => {
    const files = e.target.files
    const rawFile = files[0]
    console.log(rawFile);
    if (!rawFile) return
    upload(rawFile)
}

//上传
const upload = (rawFile: any) => {
    uploadInput.value = null
    uploadSectionFile(rawFile)
}

const uploadSectionFile = (file: any, params?: any) => {
    // let data = params
    let fromData = new FormData()// FormData 对象
    let fileObj = file// 相当于input里取得的files
    fromData.append('file', fileObj)// 文件对象

    importFile(fromData).then((res: any) => {
        //调用上传接口
        if (res.code === 200) {
            sessionStorage.clear()
            ElMessage({ type: 'success', message: '导入成功！' })
        }
    })
}

getMacAddress().then((res: any) => {
    if (res.code === 200) {
        macAddress.value = res.data.macAddress
    }
})

</script>
 
<style lang = "scss" scoped>
.app-container {
    display: flex;
    flex-direction: column;
    margin: 10% auto;
    justify-content: center;
    align-items: center;
}
</style>