【修改】excel页面

This commit is contained in:
huababa1
2025-08-13 20:38:21 +08:00
parent 7067b68429
commit 1b5738ca9f

View File

@@ -331,6 +331,41 @@
show-checkbox
@check-change="handleCheckChange"
/>
<!-- 当是单元格类型时显示可添加/删除的输入框列表 -->
<!-- 单元格类型才显示 -->
<div v-if="isCellType" style="margin-bottom: 12px">
<!-- 上方输入框和添加按钮 -->
<div style="display: flex; gap: 8px; margin-bottom: 8px">
<el-input
v-model="cellInputValue"
:placeholder="getPlaceholder(selectedType)"
style="flex: 1"
/>
<el-button type="primary" @click="addCellValue">确定</el-button>
</div>
<!-- 下方列表多选可删除 -->
<el-table
:data="cellValues"
border
size="small"
style="width: 100%; margin-bottom: 8px"
@selection-change="handleSelectionChanges"
>
<el-table-column type="selection" width="50" />
<el-table-column prop="value" label="单元格值" />
</el-table>
<el-button
type="danger"
:disabled="!selectedRows.length"
@click="deleteSelected"
>
删除选中
</el-button>
</div>
<template #footer>
<el-button type="primary" @click="submitXlsxPoints"> </el-button>
<el-button @click="dialogFormVisibleXlsxInfos = false"> </el-button>
@@ -351,6 +386,44 @@ defineOptions({ name: 'WpsXlsxFrom' })
const xlsxPointsList = ref<Tree[]>([]) // 树形结构
const xlsxPointsInfoList = ref<Tree[]>([]) // 树形结构
const isCellType = ref(false) // 是否单元格
const cellInputValue = ref('') // 上方输入框值
const cellValues = ref<{ value: string }[]>([]) // 存储所有添加的数据
const selectedRows = ref<{ value: string }[]>([]) // 多选的行
// 添加到列表(带重复判断)
const addCellValue = () => {
const value = cellInputValue.value.trim()
if (!value) return
// 判断是否重复
const exists = cellValues.value.some(item => item.value === value)
if (exists) {
ElMessage.warning('请勿重复添加')
return
}
cellValues.value.push({ value })
}
// 表格多选事件
const handleSelectionChanges = (rows: any[]) => {
selectedRows.value = rows
}
// 删除选中项
const deleteSelected = () => {
cellValues.value = cellValues.value.filter(
item => !selectedRows.value.includes(item)
)
selectedRows.value = []
}
const list = ref([]) // 列表的数
const { t } = useI18n() // 国际化
const message = useMessage() // 消息弹窗
@@ -440,7 +513,7 @@ const titles = ref('')
const filePath = ref('')
const handleCheckChange = (data: Tree, checked: boolean, indeterminate: boolean) => {
console.log(data)
console.log(data+"handleCheckChange")
const xlsxPoints = {
firstName: '',
index: '',
@@ -467,7 +540,7 @@ const getXlsxDataInfo = async () => {
const res = await XlsxApi.getXlsxDataInfo({ file: file.value })
xlsxPointsList.value = []
xlsxPointsList.value.push(...handleTree(res.data))
}
}
}
// 打开考点窗口
@@ -476,17 +549,48 @@ const addXlsxForm = async () => {
}
const chineseName = ref('')
const textIndex = ref()
const selectedType = ref('cell') // 初始值随便设
// 打开
const handleNodelClick = async (row: any) => {
// 获取名称
chineseName.value = '【' + row.name + '】'
// 判断是否是单元格
isCellType.value = row.type === 'cell'||row.type === 'range'||row.type === 'row'||row.type === 'col'
if (isCellType.value) {
selectedType.value = row.type // 点击节点时更新
cellInputValue.value ="";
cellValues.value = [] // 新的 cell 节点清空数据
}
console.log(row.index+"row.indexrow.index")
textIndex.value = row.index
const res = await XlsxApi.getXlsxByNameList(row.type)
const res = await XlsxApi.getSlideByNameList(row.type)
xlsxPointsInfoList.value = []
xlsxPointsInfoList.value.push(...handleTree(res))
dialogFormVisibleXlsxInfos.value = true
}
const getPlaceholder = (type) => {
console.log(type+"typetypetype")
switch (type) {
case 'cell':
return '请输入单元格(如 A1';
case 'range':
return '请输入范围(如 A1:B5';
case 'row':
return '请输入行号(如 3';
case 'col':
return '请输入列号(如 B';
default:
return '请输入值';
}
}
const handleDelete = (row) => {
console.log(row)
for (let i = 0; i < list.value.length; i++) {
@@ -497,10 +601,12 @@ const handleDelete = (row) => {
}
const submitXlsxPoints = async () => {
console.log('单元格输入内容:', cellValues.value)
console.log(xlsxPointsInfosList)
const res = await XlsxApi.getXlsxMaster({
data: JSON.stringify(xlsxPointsInfosList),
file: file.value
file: file.value,
cell: cellValues.value.map(item => item.value) // 提取值数组
})
xlsxPointsInfosList = []
console.log(res)