aldehyde 0.2.290 → 0.2.292

package/src/aldehyde/lowcode-components/line-chart/index.tsx

@@ -74,7 +74,8 @@ export interface ComponentStyle {
     symbol?: { [key: string]: any };
     step?: boolean; // 是否为阶梯折线图
     isArea?: boolean; // 是否面积图
-    areaStyle?: { opacity: number } // 面积图样式
+    areaStyle?: { opacity: number }; // 面积图样式
+    renderer?: "canvas" | "svg";
 }
 
 export interface ComponentProps {
@@ -92,6 +93,7 @@ export interface ComponentRef {
 const Index = forwardRef((props: ComponentProps, ref: ForwardedRef<ComponentRef>) => {
     const { style, data: propsData, isDesignMode } = props;
     const [config, setConfig] = useState<ComponentStyle>(style || {});
+    const [renderType, setRenderType] = useState<"canvas" | "svg">(style?.renderer || "svg"); // 渲染模式
     const [size, setSize] = useState<{ width: number, height: number }>();
     const [dataConfig, setDataConfig] = useState<DataConfigProps>({ ...propsData }); // 数据源配置
     const [data, setData] = useState<{ name: string, data: any }[]>([]);
@@ -102,7 +104,7 @@ const Index = forwardRef((props: ComponentProps, ref: ForwardedRef<ComponentRef>
     const handleDestroy = () => {
         pollingIntervalRef.current && clearInterval(pollingIntervalRef.current);
         window.removeEventListener('resize', handleResize);
-        chart.current.dispose();
+        chart.current && chart.current.dispose();
     };
 
     useImperativeHandle(ref, () => ({
@@ -111,6 +113,7 @@ const Index = forwardRef((props: ComponentProps, ref: ForwardedRef<ComponentRef>
             setConfig({ ...(newStyle || {}) });
             setSize({ width: base.width, height: base.height });
             setDataConfig(newDataConfig);
+            setRenderType(newStyle?.renderer || "svg");
         },
         destroy: handleDestroy,
     }));
@@ -121,13 +124,17 @@ const Index = forwardRef((props: ComponentProps, ref: ForwardedRef<ComponentRef>
     };
 
     useEffect(() => {
-        chart.current = echarts.init(chartRef.current);
-        window.addEventListener('resize', handleResize);
         return () => {
             handleDestroy();
         }
     }, []);
 
+    useEffect(() => {
+        handleDestroy();
+        chart.current = echarts.init(chartRef.current, null, { renderer: renderType });
+        window.addEventListener('resize', handleResize);
+    }, [renderType]);
+
     // 请求数据
     const getData = async () => {
         const { entities: { config, value } } = await HydrocarbonService.requestMstrucLtmplQueryTop(null, dataConfig?.sourceId, null) || {};

package/src/aldehyde/lowcode-components/liquid-chart/index.tsx

@@ -50,7 +50,8 @@ export interface ComponentStyle {
     dataNum?: number;
     color?: { color1: string, color2: string };
     backgroundStyle?: { color: string, [key: string]: any };
-    label?: { position: { x: number, y: number }, textStyle: { fontSize: number, color: string, }, [key: string]: any }
+    label?: { position: { x: number, y: number }, textStyle: { fontSize: number, color: string, }, [key: string]: any };
+    renderer?: "canvas" | "svg";
 }
 
 export interface ComponentProps {
@@ -68,6 +69,7 @@ export interface ComponentRef {
 const Index = forwardRef((props: ComponentProps, ref: ForwardedRef<ComponentRef>) => {
     const { style, data: propsData, isDesignMode } = props;
     const [config, setConfig] = useState<ComponentStyle>(style || {});
+    const [renderType, setRenderType] = useState<"canvas" | "svg">(style?.renderer || "svg"); // 渲染模式
     const [size, setSize] = useState<{ width: number, height: number }>();
     const [dataConfig, setDataConfig] = useState<DataConfigProps>({ ...propsData }); // 数据源配置
     const [data, setData] = useState<number>(0);
@@ -78,7 +80,7 @@ const Index = forwardRef((props: ComponentProps, ref: ForwardedRef<ComponentRef>
     const handleDestroy = () => {
         pollingIntervalRef.current && clearInterval(pollingIntervalRef.current);
         window.removeEventListener('resize', handleResize);
-        chart.current.dispose();
+        chart.current && chart.current.dispose();
     };
 
     useImperativeHandle(ref, () => ({
@@ -87,6 +89,7 @@ const Index = forwardRef((props: ComponentProps, ref: ForwardedRef<ComponentRef>
             setConfig({ ...(newStyle || {}) });
             setSize({ width: base.width, height: base.height });
             setDataConfig(newDataConfig);
+            setRenderType(newStyle?.renderer || "svg");
         },
         destroy: handleDestroy,
     }));
@@ -97,13 +100,17 @@ const Index = forwardRef((props: ComponentProps, ref: ForwardedRef<ComponentRef>
     };
 
     useEffect(() => {
-        chart.current = echarts.init(chartRef.current);
-        window.addEventListener('resize', handleResize);
         return () => {
             handleDestroy();
         }
     }, []);
 
+    useEffect(() => {
+        handleDestroy();
+        chart.current = echarts.init(chartRef.current, null, { renderer: renderType });
+        window.addEventListener('resize', handleResize);
+    }, [renderType]);
+
     // 请求数据
     const getData = async () => {
         const { entities: { config, value } } = await HydrocarbonService.requestMstrucLtmplQueryTop(null, dataConfig?.sourceId, null) || {};

package/src/aldehyde/lowcode-components/lowcode-view/component/assets.ts

@@ -43,6 +43,7 @@ import TextScroller from "../../text-scroller";
 import CapsuleBarChart from "../../capsule-bar-chart";
 import CircularProgressChart from "../../circular-progress-chart";
 import ActTable from "../../act-table";
+import ProgressChart from "../../progress-chart";
 
 interface ComponentItemConfig {
     baseInfo: BaseInfoType, // 基础信息
@@ -379,5 +380,12 @@ export const compsConfig: { [key: string]: ComponentItemConfig } = {
             compName: "全表格",
             compKey: "ActTable"
         }
+    },
+    ProgressChart: {
+        componentNode: ProgressChart,
+        baseInfo: {
+            compName: "进度条",
+            compKey: "ProgressChart"
+        }
     }
 };

package/src/aldehyde/lowcode-components/pie-chart/index.tsx

@@ -25,6 +25,7 @@ const defOption = {
             name: '数值',
             type: 'pie',
             radius: ["0%", "50%"],
+            center: ['50%', '50%'],
             padAngle: 0,
             label: {},
             labelLine: {},
@@ -79,7 +80,9 @@ export interface ComponentStyle {
     innerRadius?: number;
     label?: { [key: string]: any };
     labelLine?: { [key: string]: any };
+    center?: { x: number, y: number };
     roseType?: string; // 玫瑰图配置
+    renderer?: "canvas" | "svg";
 }
 
 export interface ComponentProps {
@@ -97,6 +100,7 @@ export interface ComponentRef {
 const Index = forwardRef((props: ComponentProps, ref: ForwardedRef<ComponentRef>) => {
     const { style, data: propsData, isDesignMode } = props;
     const [config, setConfig] = useState<ComponentStyle>(style || {});
+    const [renderType, setRenderType] = useState<"canvas" | "svg">(style?.renderer || "svg"); // 渲染模式
     const [size, setSize] = useState<{ width: number, height: number }>();
     const [dataConfig, setDataConfig] = useState<DataConfigProps>({ ...propsData }); // 数据源配置
     const [data, setData] = useState<{ name: string, data: any }[]>([]);
@@ -107,7 +111,7 @@ const Index = forwardRef((props: ComponentProps, ref: ForwardedRef<ComponentRef>
     const handleDestroy = () => {
         pollingIntervalRef.current && clearInterval(pollingIntervalRef.current);
         window.removeEventListener('resize', handleResize);
-        chart.current.dispose();
+        chart.current && chart.current.dispose();
     };
 
     useImperativeHandle(ref, () => ({
@@ -116,6 +120,7 @@ const Index = forwardRef((props: ComponentProps, ref: ForwardedRef<ComponentRef>
             setConfig({ ...(newStyle || {}) });
             setSize({ width: base.width, height: base.height });
             setDataConfig(newDataConfig);
+            setRenderType(newStyle?.renderer || "svg");
         },
         destroy: handleDestroy,
     }));
@@ -126,13 +131,17 @@ const Index = forwardRef((props: ComponentProps, ref: ForwardedRef<ComponentRef>
     };
 
     useEffect(() => {
-        chart.current = echarts.init(chartRef.current);
-        window.addEventListener('resize', handleResize);
         return () => {
             handleDestroy();
         }
     }, []);
 
+    useEffect(() => {
+        handleDestroy();
+        chart.current = echarts.init(chartRef.current, null, { renderer: renderType });
+        window.addEventListener('resize', handleResize);
+    }, [renderType]);
+
     // 请求数据
     const getData = async () => {
         const { entities: { config, value } } = await HydrocarbonService.requestMstrucLtmplQueryTop(null, dataConfig?.sourceId, null) || {};
@@ -170,7 +179,7 @@ const Index = forwardRef((props: ComponentProps, ref: ForwardedRef<ComponentRef>
     }, [dataConfig?.sourceType, dataConfig?.sourceId]);
 
     const renderChart = () => {
-        const { legend, tooltip, radius, innerRadius, color, label, labelLine, padAngle, roseType } = config;
+        const { legend, tooltip, radius, innerRadius, color, label, labelLine, padAngle, roseType, center } = config;
         const option = _.cloneDeep(defOption);
         // 编辑态无数据显示默认数据
         const temData = isDesignMode && !data?.length ? option.series : data;
@@ -181,6 +190,7 @@ const Index = forwardRef((props: ComponentProps, ref: ForwardedRef<ComponentRef>
         option.series = temData.map(r => ({
             type: "pie",
             radius: [`${innerRadius}%`, `${radius}%`],
+            center: [`${center?.x}%`, `${center?.y}%`],
             padAngle,
             label,
             labelLine,

package/src/aldehyde/lowcode-components/progress-chart/index.tsx

@@ -0,0 +1,235 @@
+import * as echarts from 'echarts';
+import React, { useEffect, useRef, useState, ForwardedRef, forwardRef, useImperativeHandle } from 'react';
+import _ from 'lodash';
+import HydrocarbonService from "../../tmpl/hcservice-v3";
+import { DataConfigProps } from "../data";
+
+const itemColor = {
+    type: 'linear',
+    x: 0,
+    y: 0,
+    x2: 1,
+    y2: 1,
+    colorStops: [
+        {
+            offset: 0,
+            color: 'rgba(255,198,26,0.1)'
+        },
+        {
+            offset: 1,
+            color: 'rgba(255,198,26,1)'
+        }
+    ]
+}
+
+const defOption = {
+    grid: {
+        left: 5,
+        top: 5,
+        bottom: 5,
+        right: 5,
+        containLabel: true,
+    },
+    xAxis: {
+        splitLine: { show: false },
+        axisLine: { show: false },
+        axisTick: { show: false },
+        axisLabel: { show: false },
+        max: 100,
+        type: 'value',
+        show: false
+    },
+    yAxis: {
+        type: 'category',
+        inverse: true,
+        splitLine: { show: false },
+        axisLine: { show: false },
+        axisTick: { show: false },
+        axisLabel: { show: true },
+        data: ["数值"]
+    },
+    series: [
+        {
+            name: '',
+            type: 'bar',
+            barWidth: 10, // 柱子宽度
+            showBackground: true,
+            barBorderRadius: 50,
+            backgroundStyle: {
+                color: 'rgba(255,198,26,0.3)',
+                borderColor: 'rgba(255,198,26,1)',
+                borderWidth: 1,
+                borderRadius: 5
+            },
+            label: { show: true, position: 'right', color: '#ffffff', fontSize: 14 },
+            itemStyle: {
+                barBorderRadius: 50,
+                color: itemColor
+            },
+            data: [50]
+        }
+    ]
+};
+
+export interface ComponentStyle {
+    title?: { [key: string]: any };
+    barWidth?: number;
+    max?: number;
+    background?: {
+        color: string,
+        borderColor: string,
+        borderWidth: number,
+    };
+    label?: { [key: string]: any };
+    color?: { [key: string]: any };
+    renderer?: "canvas" | "svg";
+}
+
+export interface ComponentProps {
+    style?: ComponentStyle;
+    base: { width: number, height: number },
+    data?: DataConfigProps;
+    isDesignMode?: boolean; // 是否编辑模式
+}
+
+export interface ComponentRef {
+    updateConfig: (newConfig: ComponentProps) => void;
+    destroy: () => void;
+}
+
+const Index = forwardRef((props: ComponentProps, ref: ForwardedRef<ComponentRef>) => {
+    const { style, data: propsData, isDesignMode } = props;
+    const [config, setConfig] = useState<ComponentStyle>(style || {});
+    const [renderType, setRenderType] = useState<"canvas" | "svg">(style?.renderer || "svg"); // 渲染模式
+    const [size, setSize] = useState<{ width: number, height: number }>();
+    const [dataConfig, setDataConfig] = useState<DataConfigProps>({ ...propsData }); // 数据源配置
+    const [data, setData] = useState<number>(0);
+    const chartRef = useRef<HTMLDivElement>(null);
+    const chart = useRef<any>(null);
+    const pollingIntervalRef = useRef<number | NodeJS.Timeout>(null);
+
+    const handleDestroy = () => {
+        pollingIntervalRef.current && clearInterval(pollingIntervalRef.current);
+        window.removeEventListener('resize', handleResize);
+        chart.current && chart.current.dispose();
+    };
+
+    useImperativeHandle(ref, () => ({
+        updateConfig: (newConfig) => {
+            const { base, style: newStyle, data: newDataConfig } = newConfig;
+            setConfig({ ...(newStyle || {}) });
+            setSize({ width: base.width, height: base.height });
+            setDataConfig(newDataConfig);
+            setRenderType(newStyle?.renderer || "svg");
+        },
+        destroy: handleDestroy,
+    }));
+
+    // 窗口大小变化时重新调整图表大小
+    const handleResize = () => {
+        chart.current.resize({ animation: { duration: 500 } });
+    };
+
+    useEffect(() => {
+        return () => {
+            handleDestroy();
+        }
+    }, []);
+
+    useEffect(() => {
+        handleDestroy();
+        chart.current = echarts.init(chartRef.current, null, { renderer: renderType });
+        window.addEventListener('resize', handleResize);
+    }, [renderType]);
+
+    // 请求数据
+    const getData = async () => {
+        const { entities: { config, value } } = await HydrocarbonService.requestMstrucLtmplQueryTop(null, dataConfig?.sourceId, null) || {};
+        const temData = value?.[0]?.value?.[0]?.v1 || 0;
+        setData(temData);
+        return config;
+    };
+
+    // 初始化请求数据
+    const getInitData = async () => {
+        pollingIntervalRef.current && clearInterval(pollingIntervalRef.current);
+        const config = await getData();
+        if (config?.requestType === "polling") {
+            pollingIntervalRef.current = setInterval(() => { getData() }, config?.pollingInterval || 60000);
+        }
+    };
+
+    // 静态数据处理
+    useEffect(() => {
+        if (dataConfig?.sourceType === 'staticData') {
+            const { value } = dataConfig.staticData || {};
+            setData(value || 0);
+        }
+    }, [dataConfig?.sourceType, dataConfig?.staticData]);
+
+    /**
+     * 数据源数据请求
+     * 1、编辑态不请求数据
+     */
+    useEffect(() => {
+        if (!isDesignMode && dataConfig?.sourceType === 'sourceId' && dataConfig?.sourceId) {
+            getInitData();
+        } else if (dataConfig?.sourceType === 'sourceId') {
+            setData(0);
+        }
+    }, [dataConfig?.sourceType, dataConfig?.sourceId]);
+
+    const renderChart = () => {
+        const { title, max, background, barWidth, label, color } = config;
+        const option = _.cloneDeep(defOption);
+        // 编辑态数据源类型显示默认数据50
+        const temData = isDesignMode && dataConfig?.sourceType === 'sourceId' ? 50 : (data || 0);
+        option.xAxis.max = max || 100;
+        option.yAxis.axisLabel = { show: true, ...title };
+        option.yAxis.data = [title.text || "数值"];
+        option.series = [{
+            ...option.series[0],
+            backgroundStyle: {
+                color: 'rgba(255,198,26,0.3)',
+                borderColor: 'rgba(255,198,26,1)',
+                borderWidth: 1,
+                borderRadius: barWidth / 2,
+                ...background
+            },
+            barWidth,
+            label: { show: true, position: 'right', color: '#ffffff', fontSize: 14, ...label },
+            itemStyle: {
+                barBorderRadius: 50,
+                color: {
+                    ...itemColor, colorStops: [
+                        {
+                            offset: 0,
+                            color: color?.left || "rgba(255,198,26,0.1)"
+                        },
+                        {
+                            offset: 1,
+                            color: color?.right || "rgba(255,198,26,1)"
+                        }
+                    ]
+                }
+            },
+            data: [temData]
+        }];
+        chart.current.setOption(option, true);
+    }
+    useEffect(() => {
+        if (config) {
+            renderChart();
+        }
+    }, [config, data]);
+
+    useEffect(() => {
+        if (size) {
+            handleResize();
+        }
+    }, [size]);
+
+    return <div ref={chartRef} style={{ width: '100%', height: '100%' }} />;
+});
+
+export default Index;

package/src/aldehyde/routable/import-route.tsx

@@ -28,7 +28,7 @@ class ExcelImportRoute extends React.PureComponent<
     const { params, serverKey } = this.props;
     const { sourceId } = params;
     return (
-      <ExcelImport key={sourceId} serverKey={serverKey} sourceId={sourceId}></ExcelImport>
+      <ExcelImport key={"excelimport"+sourceId} serverKey={serverKey} sourceId={sourceId}></ExcelImport>
     );
   }
 }

package/src/aldehyde/routable/ltmpl-route.tsx

@@ -122,7 +122,7 @@ Z
             (location.pathname == preLocation.pathname &&
                 location.search == preLocation.search)
         ) {
-            return;
+            return false;
         }
         await this.loadData();
     }
@@ -363,7 +363,7 @@ Z
         } else {
             return (
                 <>
-                    <ActTable key={sourceId}
+                    <ActTable key={"acttable"+sourceId}
                         tableType={tableType} serverKey={null} pageSize={pageSize} pageNo={pageNo} onChangePage={this.onChangePage}
                         menuId={this.getMenuId()} operatable={rowOperatable}
                         mainCode={mainCode} showView={this.showView} doSearch={this.onChangeSearch} doEdit={this.doEdit}

package/src/aldehyde/table/act-table.tsx

@@ -88,6 +88,7 @@ interface ActTableStat {
   restatParams?: object;
   pageInfo?: object;
   ltreeData?: object;
+  userCriteriaData: object;
 }
 let serial_number = new Date().getTime();
 class ActTable extends React.PureComponent<ActTableProps, ActTableStat> {
@@ -116,6 +117,7 @@ class ActTable extends React.PureComponent<ActTableProps, ActTableStat> {
     restatParams: undefined,
     pageInfo:{pageNo:1,pageSize:10},
     ltreeData:{},
+    userCriteriaData:undefined,
   };
 
   static contextType = LocaleContext;
@@ -153,6 +155,7 @@ class ActTable extends React.PureComponent<ActTableProps, ActTableStat> {
 
     this.setState({
       loading: true,
+      userCriteriaData:criteriaData,
     });
     let disabledColIds: string[] = [];
     let hiddenColIds_ = [...hiddenColIds];
@@ -388,43 +391,43 @@ class ActTable extends React.PureComponent<ActTableProps, ActTableStat> {
     this.loadData(defaultDisabledColIds, [], sortedColConfigs);
   }
 
-  async componentDidUpdate(prevProps) {
+  async componentDidUpdate(prevProps,prevState) {
     const { sourceId, criteriaData, ltmplConfig ,tableType,pageSize,pageNo} = this.props;
+   // const {userCriteriaData:preUserCriteriaData}=prevState;
+    const {userCriteriaData}=this.state;
     const { translate } = this.context;
     let {
       ltmplConfig: preLtmplConfig,
       criteriaData: preCriteriaData,
       sourceId: preSourceId,pageSize: prePageSize,pageNo: prePageNo,
     } = prevProps;
-
-
     if(!this.isSameSourceQuery(sourceId,criteriaData)){
       return false;
     }
+
     if(prePageSize!=pageSize || pageNo!=prePageNo){
       this.setState({
         pageInfo:{pageNo, pageSize},
+        userCriteriaData:criteriaData,
       })
     }
-
     let { hiddenColIds, sortedColConfigs } = this.state;
    let currentQueryParams= ProgramConfig.transQueryParamsToStr(criteriaData, false, [
       "pageSize",
       "pageNo",
     ]);
-   let preCurrentQueryParams=ProgramConfig.transQueryParamsToStr(preCriteriaData, false, [
+   let preCurrentQueryParams=ProgramConfig.transQueryParamsToStr(userCriteriaData, false, [
      "pageSize",
      "pageNo",
    ]);
-    if (
-      (sourceId && preSourceId != sourceId) ||
+    if ((sourceId && preSourceId != sourceId) ||
       (ltmplConfig &&
         (!preLtmplConfig || ltmplConfig.id != preLtmplConfig.id)) ||
-        (currentQueryParams != preCurrentQueryParams &&  (!criteriaData['menuId'] || preCriteriaData.menuId==criteriaData['menuId']))
+        ((currentQueryParams != preCurrentQueryParams ) &&
+            (!criteriaData['menuId'] || preCriteriaData.menuId==criteriaData['menuId']))
     ) {
       //5秒后允许再次请求数据
       //refresh=false;
-
       if (preLtmplConfig && ltmplConfig.id == preLtmplConfig.id) {
         await this.loadData(hiddenColIds, [], sortedColConfigs);
       } else {
@@ -442,9 +445,9 @@ class ActTable extends React.PureComponent<ActTableProps, ActTableStat> {
         });
         await this.loadData(defaultDisabledColIds, [], sColConfigs);
       }
-      // setTimeout( function() {
-      //   refresh=true;
-      // },112000);
+
+    }else{
+      return false;
     }
   }
 
@@ -1066,8 +1069,8 @@ class ActTable extends React.PureComponent<ActTableProps, ActTableStat> {
   }
 
   renderCriteriaForm = () => {
-    let { loading, selectedRows, selectedDatas } = this.state;
-    let { ltmplConfig, criteriaData, serverKey,sourceId } = this.props;
+    let { loading, selectedRows, selectedDatas,userCriteriaData } = this.state;
+    let { ltmplConfig,criteriaData, serverKey,sourceId } = this.props;
     return (
       <CriteriaForm
           key={sourceId}
@@ -1077,7 +1080,7 @@ class ActTable extends React.PureComponent<ActTableProps, ActTableStat> {
         selectedRows={selectedRows}
         doCustomButton={this.doCustomButton}
         ltmplConfig={ltmplConfig}
-        data={criteriaData}
+        data={userCriteriaData}
         doCQuery={this.doSelectedCQuery}
         doAction={this.doSelectedAction}
         doDelete={this.doDelete}
@@ -1171,13 +1174,6 @@ class ActTable extends React.PureComponent<ActTableProps, ActTableStat> {
 
     return (
       <>
-        {/*暂时不支持L2chart 后续用echart*/}
-        {/*{buttons.includes("showChart") && showL2Chart ? <div>*/}
-        {/*    <StatViewL2Chart queryKey={queryKey.key} ltmplConfig={ltmplConfig} hiddenColIds={hiddenColIds}*/}
-        {/*                     hiddenRowCodes={hiddenRowCodes}/>*/}
-        {/*    /!*<Divider dashed style={{borderTopColor: "#40a9ff",}} plain></Divider>*!/*/}
-        {/*</div> : ""*/}
-        {/*}*/}
         {buttons.includes("analysis") && showL2ActTable ? (
           <div>
             <L2ActTable
@@ -1256,7 +1252,7 @@ class ActTable extends React.PureComponent<ActTableProps, ActTableStat> {
                   onChangeRowSelection={this.changeRowSelection}
                   leftFixedCols={ltmplConfig.leftFixedCols}
               />:
-                <QueryTable key={sourceId} sourceId={sourceId}
+                <QueryTable key={"querytable"+sourceId} sourceId={sourceId}
                     // queryTotal={this.queryTotal}
 
                     tableProps={{scrollY:ltmplConfig.scrollY,clickDisplayTotal:!ltmplConfig.directShowTotal}}

package/src/aldehyde/table/select-table.tsx

@@ -256,10 +256,10 @@ class SelectTable extends React.PureComponent<SelectTableProps, SelectTableStat>
             <div className="actTable"
                 // style={{width: 1100,maxWidth: 'calc(100vw - 60px)', maxHeight: 'calc(100vh - 50px)',overflow:'auto'}}
             >
-                <CriteriaForm key={sourceId}  serverKey={serverKey} selectedRows={selectedRows} selectedDatas={selectedDatas} ltmplConfig={selectConfig}
+                <CriteriaForm key={"CriteriaForm"+sourceId}  serverKey={serverKey} selectedRows={selectedRows} selectedDatas={selectedDatas} ltmplConfig={selectConfig}
                               data={criteriaData}
                               doSearch={this.doSearch} loading={loading}/>
-                <QueryTable key={sourceId} serverKey={serverKey} maxSelectedRows={maxSelectedRows?maxSelectedRows:selectConfig.maxSelectedRows}
+                <QueryTable key={"QueryTable"+sourceId} serverKey={serverKey} maxSelectedRows={maxSelectedRows?maxSelectedRows:selectConfig.maxSelectedRows}
                             selectedRows={selectedRows}
                             primaryColumn={selectConfig.primaryColumn}
                             columns={columns}

package/src/aldehyde/tmpl/control-type-supportor.tsx

@@ -116,6 +116,15 @@ ControlTypeSupportor.isUploadControl=function(fieldConfig:FieldBase):boolean{
     }
 };
 
+ControlTypeSupportor.isMultiSelect=function(fieldConfig:FieldBase):boolean{
+    let  type=this.getSupportControlType(fieldConfig);
+    if(type=="multiselect"){
+        return true;
+    }else{
+        return false;
+    }
+};
+
 ControlTypeSupportor.isMultiUploadControl=function(fieldConfig:FieldBase):boolean{
     let  type=this.getSupportControlType(fieldConfig);
     if(type=="relfile"){