| | |
| | | <!-- filepath: /d:/work/drone-web-manage/src/views/license/upload.vue --> |
| | | <template> |
| | | <basic-container> |
| | | <!-- <basic-container> |
| | | <el-upload |
| | | class="upload-demo" |
| | | drag |
| | |
| | | <div class="el-upload__text">将文件拖到此处,或<em>点击上传</em></div> |
| | | <div class="el-upload__tip">仅支持扩展名:lic</div> |
| | | </el-upload> |
| | | </basic-container> |
| | | </basic-container> --> |
| | | <!-- 密钥上传 --> |
| | | <div class="upload-file"> |
| | | <img v-if="isSuccess === 'success'" :src="uploadSuccess" alt="" /> |
| | | <div v-if="isSuccess === 'success'">上传成功</div> |
| | | <img v-if="isSuccess === 'error'" :src="uploadError" alt="" /> |
| | | <div v-if="isSuccess === 'error'">上传失败</div> |
| | | <el-upload |
| | | action="/upload" |
| | | accept=".lic" |
| | | :show-file-list="false" |
| | | :before-upload="handleUpload" |
| | | > |
| | | <div class="upload-btn">密钥上传</div> |
| | | </el-upload> |
| | | <div class="password-time">密钥有效期:{{ passwordTime || '永久有效' }}</div> |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | import { uploadLicense } from '@/api/license/uploadLicense'; |
| | | import { findLicenseDate } from '@/api/system/dict'; |
| | | import uploadSuccess from '@/assets/images/uoload-success.png'; |
| | | import uploadError from '@/assets/images/upload-error.png'; |
| | | |
| | | export default { |
| | | data() { |
| | | return { |
| | | isSuccess: '', // 上传状态 |
| | | passwordTime: '', // 密钥有效期 |
| | | uploadSuccess, // 上传成功图片 |
| | | uploadError, // 上传失败图片 |
| | | }; |
| | | }, |
| | | mounted() { |
| | | this.getFindLicenseDate(); |
| | | }, |
| | | methods: { |
| | | async customUpload({ file }) { |
| | | try { |
| | | const response = await uploadLicense(file); |
| | | if (response.data.success) { |
| | | this.$message.success('文件上传成功'); |
| | | } else { |
| | | this.$message.error(response.data.message || '文件上传失败'); |
| | | } |
| | | } catch (error) { |
| | | console.error('上传失败:', error); |
| | | this.$message.error('文件上传失败'); |
| | | } |
| | | handleUpload(file) { |
| | | uploadLicense(file) |
| | | .then(res => { |
| | | console.log(res.data.code,'444') |
| | | if (res.data.code !== 200) return this.$message.error('上传失败'); |
| | | this.$message.success('上传成功'); |
| | | this.isSuccess = 'success'; |
| | | this.getFindLicenseDate(); |
| | | }) |
| | | .catch(err => { |
| | | this.isSuccess = 'error'; |
| | | this.$message.error('上传失败'); |
| | | }); |
| | | }, |
| | | getFindLicenseDate() { |
| | | findLicenseDate() |
| | | .then(res => { |
| | | if (res.data.code !== 0) return this.$message.error('上传失败'); |
| | | this.passwordTime = res.data.data; |
| | | }) |
| | | .catch(err => { |
| | | this.$message.error('获取失败失败'); |
| | | }); |
| | | }, |
| | | }, |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped> |
| | | .upload-demo { |
| | | width: 100%; |
| | | border: 2px dashed #d9d9d9; |
| | | border-radius: 6px; |
| | | background-color: #fafafa; |
| | | <style scoped lang="scss"> |
| | | .upload-file { |
| | | text-align: center; |
| | | margin-top: 60px; |
| | | .upload-btn { |
| | | width: 93px; |
| | | height: 38px; |
| | | background: #DDEBFF; |
| | | border-radius: 8px 8px 8px 8px; |
| | | border: 1px solid #409EFF; |
| | | text-align: center; |
| | | padding: 40px 20px; |
| | | } |
| | | .el-upload__text { |
| | | font-size: 16px; |
| | | color: #606266; |
| | | } |
| | | .el-upload__tip { |
| | | font-size: 12px; |
| | | color: #909399; |
| | | font-family: Source Han Sans CN, Source Han Sans CN; |
| | | font-weight: bold; |
| | | font-size: 14px; |
| | | color: #228CFA; |
| | | line-height: 38px; |
| | | text-align: center; |
| | | margin-top: 10px; |
| | | } |
| | | .password-time { |
| | | margin-top: 50px; |
| | | width: 100%; |
| | | height: 16px; |
| | | font-family: Source Han Sans CN, Source Han Sans CN; |
| | | font-weight: 400; |
| | | font-size: 14px; |
| | | color: #2d9dff; |
| | | line-height: 16px; |
| | | // text-align: left; |
| | | } |
| | | } |
| | | </style> |