Merge pull request #13412 from dataease/pr@dev-v2_st

feat(数据集): 上传excel支持列选择
This commit is contained in:
xuwei-fit2cloud 2024-11-19 15:24:58 +08:00 committed by GitHub
commit ecfd072b73
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 94 additions and 5 deletions

View File

@ -290,9 +290,11 @@ const setOldMapValue = arr => {
const customSort = () => {
if (config.value.sortList?.length && config.value.sort === 'customSort') {
options.value.sort(
(a, b) => config.value.sortList.indexOf(a.value) - config.value.sortList.indexOf(b.value)
)
options.value = [
...options.value.sort(
(a, b) => config.value.sortList.indexOf(a.value) - config.value.sortList.indexOf(b.value)
)
]
}
}

View File

@ -1,5 +1,6 @@
<script lang="tsx" setup>
import icon_upload_outlined from '@/assets/svg/icon_upload_outlined.svg'
import icon_refresh_outlined from '@/assets/svg/icon_refresh_outlined.svg'
import { Icon } from '@/components/icon-custom'
import { ElIcon } from 'element-plus-secondary'
import { useI18n } from '@/hooks/web/useI18n'
@ -404,6 +405,10 @@ const appendReplaceExcel = response => {
}
const status = ref(false)
const currentMode = ref('preview')
const refreshData = () => {
currentMode.value = 'preview'
}
const uploadStatus = val => {
status.value = val
@ -527,8 +532,34 @@ defineExpose({
:tab-list="tabList"
></SheetTabs>
<div class="table-select_mode">
<div class="btn-select">
<el-button
@click="currentMode = 'preview'"
:class="[currentMode === 'preview' && 'is-active']"
text
>
{{ t('chart.data_preview') }}
</el-button>
<el-button
@click="currentMode = 'select'"
:class="[currentMode === 'select' && 'is-active']"
text
>
{{ t('data_set.field_selection') }}
</el-button>
</div>
<el-button @click="refreshData" secondary>
<template #icon>
<el-icon>
<Icon><icon_refresh_outlined class="svg-icon" /></Icon>
</el-icon>
</template>
{{ t('data_set.refresh_data') }}
</el-button>
</div>
<div class="info-table" v-if="isResize">
<el-auto-resizer>
<el-auto-resizer v-if="currentMode === 'preview'">
<template #default="{ height, width }">
<el-table-v2
:columns="columns"
@ -540,6 +571,28 @@ defineExpose({
/>
</template>
</el-auto-resizer>
<el-table header-class="header-cell" v-else :data="columns" style="width: 100%">
<el-table-column type="selection" width="55" />
<el-table-column :label="t('data_set.field_name')">
<template #default="scope">{{ scope.row.title }}</template>
</el-table-column>
<el-table-column :label="t('data_set.field_type')">
<template #default="scope">
<div class="flex-align-center">
<el-icon>
<Icon>
<component
:class="`svg-icon field-icon-${fieldType[scope.row.fieldType]}`"
:is="iconFieldMap[fieldType[scope.row.fieldType]]"
></component>
</Icon>
</el-icon>
{{ t(`dataset.${fieldType[scope.row.fieldType]}`) }}
</div>
</template>
</el-table-column>
</el-table>
</div>
</template>
</div>
@ -556,6 +609,40 @@ defineExpose({
margin-bottom: 16px;
}
.table-select_mode {
display: flex;
align-items: center;
justify-content: space-between;
background: #f5f6f7;
padding: 16px;
.btn-select {
width: 164px;
height: 32px;
display: flex;
align-items: center;
justify-content: center;
background: #ffffff;
border: 1px solid #bbbfc4;
border-radius: 4px;
.is-active {
background: var(--ed-color-primary-1a, rgba(51, 112, 255, 0.1));
}
.ed-button:not(.is-active) {
color: #1f2329;
}
.ed-button.is-text {
height: 24px;
width: 74px;
line-height: 24px;
}
.ed-button + .ed-button {
margin-left: 4px;
}
}
}
.detail-operate {
height: 56px;
padding: 16px 24px;
@ -601,7 +688,7 @@ defineExpose({
.info-table {
width: 100%;
height: calc(100% - 315px);
height: calc(100% - 379px);
}
}
}