ygxbnet
080d62621e
部署开发环境 / deploy-dev (push) Successful in 1m54s
- 将 AddDataDialog 组件的布局改为 flex 布局并移除自定义 CSS 类 - 更新 TokenDetailView 的整体布局结构，使用 Tailwind CSS 类替换原生样式 - 优化 TokenManageView 的表单和表格界面，调整响应式设计 - 移除 Element Plus ElContainer 组件的引用 - 合并多个编辑对话框为统一的数据编辑对话框 - 优化进度条和标签的显示样式 - 调整按钮和表单项的间距和对齐方式
115 lines
2.8 KiB
Vue
115 lines
2.8 KiB
Vue
<script setup lang="ts">
|
|
import api from "@/api"
|
|
import {Upload} from '@element-plus/icons-vue'
|
|
|
|
const props = defineProps<{
|
|
modelValue: boolean
|
|
token?: string
|
|
}>()
|
|
|
|
const emit = defineEmits<{
|
|
(e: 'update:modelValue', value: boolean): void
|
|
}>()
|
|
|
|
const inputData = ref('')
|
|
const uploading = ref(false)
|
|
const uploadedCount = ref(0)
|
|
const totalCount = computed(() => {
|
|
const lines = inputData.value.split('\n').filter(line => line.trim())
|
|
return lines.length
|
|
})
|
|
|
|
const close = () => {
|
|
emit('update:modelValue', false)
|
|
inputData.value = ''
|
|
uploadedCount.value = 0
|
|
}
|
|
|
|
const handleUpload = async () => {
|
|
if (!inputData.value.trim()) {
|
|
ElMessage.warning('请输入数据')
|
|
return
|
|
}
|
|
|
|
uploading.value = true
|
|
uploadedCount.value = 0
|
|
|
|
const lines = inputData.value.split('\n').filter(line => line.trim())
|
|
const total = lines.length
|
|
uploadedCount.value = 0
|
|
|
|
for (const line of lines) {
|
|
try {
|
|
await api.uploadData({data: line, token: props.token || ''})
|
|
uploadedCount.value++
|
|
} catch (error: any) {
|
|
ElMessage.error(error.response?.data?.error || '上传失败')
|
|
uploading.value = false
|
|
return
|
|
}
|
|
}
|
|
|
|
uploading.value = false
|
|
ElMessage({message: '已上传成功 ' + uploadedCount.value + ' 条数据', type: 'success'})
|
|
setTimeout(() => {
|
|
close()
|
|
}, 2000)
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<el-dialog
|
|
:model-value="modelValue"
|
|
@update:model-value="emit('update:modelValue', $event)"
|
|
width="700px"
|
|
:close-on-click-modal="false"
|
|
@close="close"
|
|
>
|
|
<template #header>
|
|
添加数据
|
|
<el-tag type="primary" effect="plain">{{ props.token }}</el-tag>
|
|
</template>
|
|
|
|
<div class="flex flex-col gap-4">
|
|
<el-input
|
|
v-model="inputData"
|
|
type="textarea"
|
|
:rows="18"
|
|
placeholder="请输入数据，每行一条"
|
|
:disabled="uploading"
|
|
class="textarea-input"
|
|
/>
|
|
|
|
<div class="flex justify-between items-center gap-4">
|
|
<div class="flex-1 flex items-center gap-3">
|
|
<el-progress
|
|
:percentage="totalCount > 0 ? Math.round((uploadedCount / totalCount) * 100) : 0"
|
|
:show-text="false"
|
|
class="flex-1"
|
|
/>
|
|
<span class="text-sm text-[var(--el-text-color-secondary)] whitespace-nowrap">已上传 {{ uploadedCount }}/{{ totalCount }} 行</span>
|
|
</div>
|
|
|
|
<el-button
|
|
type="primary"
|
|
:loading="uploading"
|
|
@click="handleUpload"
|
|
>
|
|
<el-icon v-if="!uploading">
|
|
<Upload/>
|
|
</el-icon>
|
|
上传
|
|
</el-button>
|
|
</div>
|
|
</div>
|
|
</el-dialog>
|
|
</template>
|
|
|
|
<style scoped>
|
|
.textarea-input :deep(.el-textarea__inner) {
|
|
overflow-x: auto;
|
|
white-space: pre;
|
|
word-break: keep-all;
|
|
}
|
|
</style>
|