Skip to content
GitLab
Projects
Groups
Snippets
/
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Sign in / Register
Toggle navigation
Menu
Open sidebar
水玉婷
ai-wechat
Commits
f3e50e14
Commit
f3e50e14
authored
Jan 22, 2026
by
水玉婷
Browse files
feat:修改表格模版
parent
68fb0503
Changes
3
Hide whitespace changes
Inline
Side-by-side
src/views/components/ChartComponent.vue
View file @
f3e50e14
...
@@ -195,7 +195,11 @@ const availableIndexes = computed(() => {
...
@@ -195,7 +195,11 @@ const availableIndexes = computed(() => {
});
});
const
tableHtml
=
computed
(()
=>
{
const
tableHtml
=
computed
(()
=>
{
return
props
.
chartData
?.
rows
?
generateTableHTML
(
props
.
chartData
.
rows
)
:
''
;
return
props
.
chartData
?
generateTableHTML
({
...
props
.
chartData
,
dimFields
:
props
.
chartData
.
dimFields
||
[],
indexFields
:
props
.
chartData
.
indexFields
||
[]
})
:
''
;
});
});
// 修改chartTypeOptions以包含饼图选项
// 修改chartTypeOptions以包含饼图选项
...
...
src/views/components/utils/contentTemplateService.ts
View file @
f3e50e14
...
@@ -4,8 +4,10 @@ import { markdownTemplate, isLastBlockMarkdown, getLastMarkdownBlockIndex, merge
...
@@ -4,8 +4,10 @@ import { markdownTemplate, isLastBlockMarkdown, getLastMarkdownBlockIndex, merge
// 图表类型常量定义
// 图表类型常量定义
const
CHART_TYPES
=
{
const
CHART_TYPES
=
{
TABLE
:
'
table
'
,
COLUMN
:
'
column
'
,
COLUMN
:
'
column
'
,
LINE
:
'
line
'
LINE
:
'
line
'
,
PIE
:
'
pie
'
,
}
as
const
;
}
as
const
;
// 内容模板类型定义
// 内容模板类型定义
...
@@ -147,6 +149,16 @@ export class ContentTemplateService {
...
@@ -147,6 +149,16 @@ export class ContentTemplateService {
// 表格模板 - 使用独立的表格模板工具
// 表格模板 - 使用独立的表格模板工具
table
:
(
tableData
:
any
)
=>
{
table
:
(
tableData
:
any
)
=>
{
// 如果tableData包含dimFields和indexFields,则传递这些配置
if
(
tableData
&&
tableData
.
dimFields
&&
tableData
.
indexFields
)
{
return
tableTemplate
({
rows
:
tableData
.
rows
||
[],
title
:
tableData
.
title
||
''
,
dimFields
:
tableData
.
dimFields
||
[],
indexFields
:
tableData
.
indexFields
||
[]
});
}
// 否则使用默认调用
return
tableTemplate
(
tableData
);
return
tableTemplate
(
tableData
);
},
},
...
@@ -315,7 +327,7 @@ export class ContentTemplateService {
...
@@ -315,7 +327,7 @@ export class ContentTemplateService {
thinkContent
:
''
,
thinkContent
:
''
,
thinkBoxExpanded
:
false
,
thinkBoxExpanded
:
false
,
chartData
:
messageContent
,
chartData
:
messageContent
,
chartType
:
messageContent
.
chartType
||
CHART_TYPES
.
COLUMN
,
chartType
:
messageContent
.
chartType
||
CHART_TYPES
.
TABLE
,
});
});
break
;
break
;
...
...
src/views/components/utils/tableTemplate.ts
View file @
f3e50e14
...
@@ -11,32 +11,65 @@ export interface TableData {
...
@@ -11,32 +11,65 @@ export interface TableData {
// 表格配置接口
// 表格配置接口
export
interface
TableConfig
{
export
interface
TableConfig
{
showFooter
?:
boolean
;
showFooter
?:
boolean
;
title
?:
string
;
// 表格标题
dimFields
?:
string
[];
// 维度字段列表,与数据结构中的dimFields保持一致
indexFields
?:
string
[];
// 指标字段列表,这些字段需要特殊数字处理
}
}
/**
/**
* 生成表格HTML
* 生成表格HTML
* @param tableData 表格数据数组
* @param tableData 表格数据数组
或完整数据结构
* @param config 表格配置
* @param config 表格配置
* @returns 表格HTML字符串
* @returns 表格HTML字符串
*/
*/
export
const
generateTableHTML
=
(
tableData
:
TableData
[],
config
:
TableConfig
=
{}):
string
=>
{
export
const
generateTableHTML
=
(
tableData
:
TableData
[]
|
any
,
config
:
TableConfig
=
{}):
string
=>
{
const
{
showFooter
=
true
}
=
config
;
// 处理传入完整数据结构的情况
let
rows
:
TableData
[]
=
[];
let
finalConfig
:
TableConfig
=
{
...
config
};
if
(
tableData
&&
typeof
tableData
===
'
object
'
)
{
// 如果传入的是完整数据结构(包含rows、dimFields、indexFields等)
if
(
Array
.
isArray
(
tableData
.
rows
))
{
rows
=
tableData
.
rows
;
// 从数据结构中提取配置
if
(
tableData
.
title
)
{
finalConfig
.
title
=
tableData
.
title
;
}
if
(
tableData
.
dimFields
)
{
finalConfig
.
dimFields
=
tableData
.
dimFields
;
}
if
(
tableData
.
indexFields
)
{
finalConfig
.
indexFields
=
tableData
.
indexFields
;
}
}
else
if
(
Array
.
isArray
(
tableData
))
{
// 如果传入的是纯数组,直接使用
rows
=
tableData
;
}
}
const
{
showFooter
=
true
,
title
=
'
数据表格
'
,
indexFields
=
[],
dimFields
=
[]
}
=
finalConfig
;
// 处理空数据
// 处理空数据
if
(
!
Array
.
isArray
(
tableData
)
||
tableData
.
length
===
0
)
{
if
(
!
Array
.
isArray
(
rows
)
||
rows
.
length
===
0
)
{
return
`
return
`
<div class="message-table">
<div class="message-table">
<div class="table-title">
数据表格
</div>
<div class="table-title">
${
title
}
</div>
<div class="table-empty">暂无数据</div>
<div class="table-empty">暂无数据</div>
</div>`
;
</div>`
;
}
}
// 动态生成表头 - 使用第一条数据的键名
// 动态生成表头 - 使用第一条数据的键名
const
headers
=
Object
.
keys
(
tableData
[
0
]);
const
headers
=
Object
.
keys
(
rows
[
0
]);
// 判断列是否为数字列
// 判断列是否为数字列
const
isNumericColumn
=
(
header
:
string
)
=>
{
const
isNumericColumn
=
(
header
:
string
)
=>
{
return
tableData
.
some
(
row
=>
{
// 如果指定了indexFields,优先使用indexFields判断
if
(
indexFields
.
length
>
0
)
{
return
indexFields
.
includes
(
header
);
}
// 默认逻辑:根据数据内容判断
return
rows
.
some
(
row
=>
{
const
value
=
row
[
header
];
const
value
=
row
[
header
];
return
typeof
value
===
'
number
'
||
(
!
isNaN
(
parseFloat
(
value
))
&&
isFinite
(
value
));
return
typeof
value
===
'
number
'
||
(
!
isNaN
(
parseFloat
(
value
))
&&
isFinite
(
value
));
});
});
...
@@ -102,6 +135,7 @@ export const generateTableHTML = (tableData: TableData[], config: TableConfig =
...
@@ -102,6 +135,7 @@ export const generateTableHTML = (tableData: TableData[], config: TableConfig =
return
`
return
`
<div class="message-table">
<div class="message-table">
<div class="table-title">
${
title
}
</div>
<div class="table-container">
<div class="table-container">
<table class="data-table">
<table class="data-table">
<thead>
<thead>
...
@@ -110,7 +144,7 @@ export const generateTableHTML = (tableData: TableData[], config: TableConfig =
...
@@ -110,7 +144,7 @@ export const generateTableHTML = (tableData: TableData[], config: TableConfig =
</tr>
</tr>
</thead>
</thead>
<tbody>
<tbody>
${
tableData
.
map
(
row
=>
`
${
rows
.
map
(
row
=>
`
<tr>
<tr>
${
headers
.
map
(
header
=>
`
${
headers
.
map
(
header
=>
`
<td class="
${
getCellClass
(
header
)}
">
<td class="
${
getCellClass
(
header
)}
">
...
@@ -122,7 +156,7 @@ export const generateTableHTML = (tableData: TableData[], config: TableConfig =
...
@@ -122,7 +156,7 @@ export const generateTableHTML = (tableData: TableData[], config: TableConfig =
</tbody>
</tbody>
</table>
</table>
</div>
</div>
${
showFooter
?
`<div class="table-footer">共 <span>
${
tableData
.
length
}
</span> 条记录</div>`
:
''
}
${
showFooter
?
`<div class="table-footer">共 <span>
${
rows
.
length
}
</span> 条记录</div>`
:
''
}
</div>
</div>
`
;
`
;
};
};
...
...
Write
Preview
Supports
Markdown
0%
Try again
or
attach a new file
.
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment