Compare commits
2 Commits
57ab939a67
...
9c38b18775
| Author | SHA1 | Date |
|---|---|---|
|
|
9c38b18775 | |
|
|
1a467c30d0 |
|
|
@ -26,6 +26,9 @@ import { useChartDataFetch } from '@/hooks';
|
||||||
import { useChartEditStore } from '@/store/modules/chartEditStore/chartEditStore';
|
import { useChartEditStore } from '@/store/modules/chartEditStore/chartEditStore';
|
||||||
import { EventBus } from '@/utils/eventBus';
|
import { EventBus } from '@/utils/eventBus';
|
||||||
|
|
||||||
|
|
||||||
|
import { replaceSqlParams } from '@/utils/sqlHandler';
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
chartConfig: {
|
chartConfig: {
|
||||||
type: Object as PropType<CreateComponentType>,
|
type: Object as PropType<CreateComponentType>,
|
||||||
|
|
@ -33,6 +36,9 @@ const props = defineProps({
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
const { w, h } = toRefs(props.chartConfig.attr)
|
const { w, h } = toRefs(props.chartConfig.attr)
|
||||||
const {
|
const {
|
||||||
colors,
|
colors,
|
||||||
|
|
@ -45,37 +51,31 @@ const {
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
console.log("props.chartConfig",props.chartConfig.option.showColumns);
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
onMounted(()=>{
|
onMounted(()=>{
|
||||||
const sql = JSON.parse(JSON.stringify(props.chartConfig.request.requestSQLContent)).sql;
|
|
||||||
|
|
||||||
|
const sql = props.chartConfig.request?.requestSQLContent?.sql;
|
||||||
// 组件通信 获取列表中的信息
|
// 组件通信 获取列表中的信息
|
||||||
EventBus.on(props.chartConfig.id+'dataupdate', (data) => {
|
EventBus.on(props.chartConfig.id+'dataupdate', (data) => {
|
||||||
|
props.chartConfig.request.requestSQLContent.sql = replaceSqlParams(sql,{Id:data.id})
|
||||||
|
// 数据callback处理(预览时触发)
|
||||||
|
useChartDataFetch(props.chartConfig, useChartEditStore, (resData: any) => {
|
||||||
|
|
||||||
props.chartConfig.request.requestSQLContent.sql = replaceSqlParams(sql,{Id:data.id})
|
// props.chartConfig.option.dataset = resData;
|
||||||
|
let data = [];
|
||||||
|
|
||||||
// 数据callback处理(预览时触发)
|
props.chartConfig.option.showColumns?.forEach((item,index)=>{
|
||||||
useChartDataFetch(props.chartConfig, useChartEditStore, (resData: any) => {
|
let info = {
|
||||||
// props.chartConfig.option.dataset = resData;
|
title:item.zh_name,
|
||||||
let data = [];
|
desc:resData[0][firstLetterToLowerCase(item.en_name)]
|
||||||
|
}
|
||||||
|
data.push(info);
|
||||||
|
|
||||||
props.chartConfig.option.showColumns?.forEach((item,index)=>{
|
})
|
||||||
let info = {
|
|
||||||
title:item.zh_name,
|
|
||||||
desc:resData[0][firstLetterToLowerCase(item.en_name)]
|
|
||||||
}
|
|
||||||
data.push(info);
|
|
||||||
|
|
||||||
})
|
|
||||||
|
|
||||||
props.chartConfig.option.dataset.data = data;
|
|
||||||
});
|
|
||||||
|
|
||||||
|
props.chartConfig.option.dataset.data = data;
|
||||||
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
})
|
})
|
||||||
|
|
||||||
function firstLetterToLowerCase(str) {
|
function firstLetterToLowerCase(str) {
|
||||||
|
|
@ -87,17 +87,6 @@ const handlerShowColumns = ()=> {
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
function replaceSqlParams(sql, params) {
|
|
||||||
return sql.replace(/#\{([^}]+)\}/g, (match, p1) => {
|
|
||||||
if (params.hasOwnProperty(p1)) {
|
|
||||||
// 根据参数类型决定是否添加引号(简单实现)
|
|
||||||
return typeof params[p1] === 'string' ? `'${params[p1]}'` : params[p1];
|
|
||||||
}
|
|
||||||
throw new Error(`缺少参数: ${p1}`);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,20 @@
|
||||||
|
/**
|
||||||
|
|
||||||
|
示例:
|
||||||
|
|
||||||
|
参数 sql : select * from tableName where 'Id' = #{id} and 'state' = #{state}
|
||||||
|
|
||||||
|
参数 params : {id:12343,state:1}
|
||||||
|
|
||||||
|
返回结果: select * from tableName where 'Id' = 12343 and 'state' = 1
|
||||||
|
|
||||||
|
*/
|
||||||
|
|
||||||
|
export function replaceSqlParams(sql, params) {
|
||||||
|
return sql.replace(/#\{([^}]+)\}/g, (match, p1) => {
|
||||||
|
if (params.hasOwnProperty(p1)) {
|
||||||
|
return typeof params[p1] === 'string' ? `'${params[p1]}'` : params[p1];
|
||||||
|
}
|
||||||
|
throw new Error(`缺少参数: ${p1}`);
|
||||||
|
});
|
||||||
|
}
|
||||||
Loading…
Reference in New Issue