fix:材料管理页面中点击导入数据按钮,打开一个弹窗,把模板下载和上传按钮放在里面。
This commit is contained in:
parent
c1d18c888c
commit
8e47c0ef8f
|
|
@ -10,20 +10,11 @@
|
|||
<el-option v-for="item in filterSubcategoryOptions" :key="item.value" :label="item.name" :value="item.value" />
|
||||
</el-select>
|
||||
<el-button @click="loadMaterials">查询</el-button>
|
||||
<el-upload
|
||||
v-if="isAdmin"
|
||||
:auto-upload="true"
|
||||
:show-file-list="false"
|
||||
:http-request="handleImportExcel"
|
||||
accept=".xlsx"
|
||||
>
|
||||
<el-button :loading="importing">{{ importing ? '导入中...' : '导入数据' }}</el-button>
|
||||
</el-upload>
|
||||
<el-button v-if="isAdmin" :loading="importing" @click="importDialogVisible = true">
|
||||
{{ importing ? '导入中...' : '导入数据' }}
|
||||
</el-button>
|
||||
<el-button type="primary" @click="openCreate">新增材料</el-button>
|
||||
<div class="toolbar-spacer" />
|
||||
<a href="http://101.42.1.64:2260/media/material_import_template.xlsx" download="材料导入模板.xlsx">
|
||||
<el-button>模板</el-button>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<el-table v-loading="tableLoading" :data="materials" border :max-height="560">
|
||||
|
|
@ -206,6 +197,25 @@
|
|||
<el-button type="primary" @click="onSave">保存</el-button>
|
||||
</template>
|
||||
</el-dialog>
|
||||
|
||||
<el-dialog v-model="importDialogVisible" title="导入材料" width="420px">
|
||||
<div class="import-dialog">
|
||||
<div class="import-dialog__text">请先下载模板,按模板填写后上传 `.xlsx` 文件。</div>
|
||||
<div class="import-dialog__actions">
|
||||
<a :href="templateDownloadUrl" download="材料导入模板.xlsx">
|
||||
<el-button>模板下载</el-button>
|
||||
</a>
|
||||
<el-upload
|
||||
:auto-upload="true"
|
||||
:show-file-list="false"
|
||||
:http-request="handleImportExcel"
|
||||
accept=".xlsx"
|
||||
>
|
||||
<el-button type="primary" :loading="importing">{{ importing ? '导入中...' : '上传文件' }}</el-button>
|
||||
</el-upload>
|
||||
</div>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
|
@ -229,11 +239,14 @@ const pagination = reactive({
|
|||
})
|
||||
const factories = ref([])
|
||||
const dialogVisible = ref(false)
|
||||
const importDialogVisible = ref(false)
|
||||
const dialogTitle = ref('')
|
||||
const isEdit = ref(false)
|
||||
const currentId = ref(null)
|
||||
const uploading = ref(false)
|
||||
const importing = ref(false)
|
||||
const apiBaseUrl = (import.meta.env.VITE_API_BASE_URL || '/api').replace(/\/$/, '')
|
||||
const templateDownloadUrl = `${apiBaseUrl}/material/template/`
|
||||
|
||||
const filters = reactive({
|
||||
name: '',
|
||||
|
|
@ -457,6 +470,7 @@ const handleImportExcel = async (options) => {
|
|||
const result = await importMaterialsExcel(options.file)
|
||||
pagination.page = 1
|
||||
await loadMaterials()
|
||||
importDialogVisible.value = false
|
||||
ElMessage.success(`导入完成:新增 ${result.created} 条,更新 ${result.updated} 条,跳过 ${result.skipped} 条,新建工厂 ${result.created_factory || 0} 条`)
|
||||
} catch (error) {
|
||||
ElMessage.error(error.response?.data?.detail || '导入失败')
|
||||
|
|
@ -527,6 +541,18 @@ onMounted(() => {
|
|||
flex: 1 1 auto;
|
||||
}
|
||||
|
||||
.import-dialog__text {
|
||||
color: #606266;
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
.import-dialog__actions {
|
||||
margin-top: 20px;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
.pagination {
|
||||
margin-top: 16px;
|
||||
display: flex;
|
||||
|
|
|
|||
Loading…
Reference in New Issue