@nocobase/plugin-data-visualization 0.11.1-alpha.2 → 0.11.1-alpha.4

package/lib/client/block/ChartConfigure.js

@@ -157,23 +157,19 @@ const ChartConfigure = props => {
     setDimensions((0, _lodash().cloneDeep)(currentDimensions));
   };
   const chartType = (0, _renderer.useDefaultChartType)();
-  const form = (0, _react2().useMemo)(() => {
-    return (0, _core().createForm)({
-      values: _objectSpread(_objectSpread({
-        config: {
-          chartType
-        }
-      }, initialValues || (field === null || field === void 0 ? void 0 : field.decoratorProps)), {}, {
-        collection
-      }),
-      effects: form => {
-        (0, _core().onFieldChange)('config.chartType', () => initChart(true));
-        (0, _core().onFormInit)(() => {
-          queryReact(form);
-        });
+  const form = (0, _react2().useMemo)(() => (0, _core().createForm)({
+    values: _objectSpread(_objectSpread({
+      config: {
+        chartType
       }
-    });
-  },
+    }, initialValues || (field === null || field === void 0 ? void 0 : field.decoratorProps)), {}, {
+      collection
+    }),
+    effects: form => {
+      (0, _core().onFieldChange)('config.chartType', () => initChart(true));
+      (0, _core().onFormInit)(() => queryReact(form));
+    }
+  }),
   // visible, collection added here to re-initialize form when visible, collection change
   // eslint-disable-next-line react-hooks/exhaustive-deps
   [field, visible, collection]);
@@ -238,9 +234,8 @@ const ChartConfigure = props => {
         afterSave();
         return;
       }
-      insert((0, _utils.createRendererSchema)(rendererProps), {
-        onSuccess: afterSave,
-        wrap: _client().gridRowColWrap
+      insert((0, _client().gridRowColWrap)((0, _utils.createRendererSchema)(rendererProps)), {
+        onSuccess: afterSave
       });
     },
     onCancel: () => {
@@ -262,9 +257,10 @@ const ChartConfigure = props => {
     bodyStyle: {
       background: 'rgba(128, 128, 128, 0.08)'
     }
-  }, _react2().default.createElement(_antdV().Form, {
-    layout: "vertical",
+  }, _react2().default.createElement(_client().FormProvider, {
     form: form
+  }, _react2().default.createElement(_antdV().FormLayout, {
+    layout: "vertical"
   }, _react2().default.createElement(_antd().Row, {
     gutter: 8
   }, _react2().default.createElement(_antd().Col, {
@@ -312,7 +308,7 @@ const ChartConfigure = props => {
     style: {
       margin: '12px 12px 12px 0'
     }
-  }, _react2().default.createElement(ChartConfigure.Renderer, null))))));
+  }, _react2().default.createElement(ChartConfigure.Renderer, null)))))));
 };
 exports.ChartConfigure = ChartConfigure;
 ChartConfigure.Renderer = function Renderer(props) {
@@ -396,19 +392,10 @@ ChartConfigure.Query = function Query() {
       ArrayItems: _antdV().ArrayItems,
       Editable: _antdV().Editable,
       FormCollapse: _antdV().FormCollapse,
-      Card: _antd().Card,
-      Switch: _antdV().Switch,
-      Select: _client().Select,
-      Input: _client().Input,
-      InputNumber: _client().InputNumber,
       FormItem: _antdV().FormItem,
-      Radio: _client().Radio,
       Space: _antd().Space,
-      Filter: _client().Filter,
-      DatePicker: _client().DatePicker,
-      Text,
-      FromSql,
-      Cascader: _client().Cascader
+      Switch: _antdV().Switch,
+      FromSql
     }
   });
 };
@@ -445,9 +432,6 @@ ChartConfigure.Config = function Config() {
         getReference
       },
       components: {
-        Card: _antd().Card,
-        Select: _client().Select,
-        Input: _client().Input,
         FormItem: _antdV().FormItem,
         ArrayItems: _antdV().ArrayItems,
         Space: _antd().Space,
@@ -465,7 +449,6 @@ ChartConfigure.Transform = function Transform() {
   return _react2().default.createElement(_client().SchemaComponent, {
     schema: _configure.transformSchema,
     components: {
-      Select: _client().Select,
       FormItem: _antdV().FormItem,
       ArrayItems: _antdV().ArrayItems,
       Space: _antd().Space

package/lib/client/block/schemas/configure.js

@@ -240,11 +240,19 @@ const querySchema = {
                         'x-decorator': 'FormItem',
                         'x-component': 'Input',
                         'x-component-props': {
-                          placeholder: '{{t("Alias")}}'
+                          placeholder: '{{t("Alias")}}',
+                          style: {
+                            minWidth: '100px'
+                          }
                         }
                       }
                     }, {
-                      required: true
+                      required: true,
+                      'x-component-props': {
+                        style: {
+                          overflow: 'auto'
+                        }
+                      }
                     })
                   }
                 },
@@ -290,7 +298,16 @@ const querySchema = {
                         'x-decorator': 'FormItem',
                         'x-component': 'Input',
                         'x-component-props': {
-                          placeholder: '{{t("Alias")}}'
+                          placeholder: '{{t("Alias")}}',
+                          style: {
+                            minWidth: '100px'
+                          }
+                        }
+                      }
+                    }, {
+                      'x-component-props': {
+                        style: {
+                          overflow: 'auto'
                         }
                       }
                     })
@@ -346,12 +363,20 @@ const querySchema = {
                         'x-component': 'Radio.Group',
                         'x-component-props': {
                           defaultValue: 'ASC',
-                          optionType: 'button'
+                          optionType: 'button',
+                          style: {
+                            width: '128px'
+                          }
                         },
                         enum: ['ASC', 'DESC']
                       }
                     }, {
-                      'x-reactions': '{{ useOrderReaction }}'
+                      'x-reactions': '{{ useOrderReaction }}',
+                      'x-component-props': {
+                        style: {
+                          overflow: 'auto'
+                        }
+                      }
                     })
                   }
                 }

package/lib/client/renderer/ChartRenderer.js

@@ -146,9 +146,7 @@ ChartRenderer.Designer = function Designer() {
     }
   }, t('Configure')), _react2().default.createElement(_client().SchemaSettings.Item, {
     key: "duplicate",
-    onClick: () => insertAdjacent('afterEnd', (0, _utils.createRendererSchema)(schema === null || schema === void 0 ? void 0 : schema['x-decorator-props']), {
-      wrap: _client().gridRowColWrap
-    })
+    onClick: () => insertAdjacent('afterEnd', (0, _client().gridRowColWrap)((0, _utils.createRendererSchema)(schema === null || schema === void 0 ? void 0 : schema['x-decorator-props'])))
   }, t('Duplicate')), _react2().default.createElement(_client().SchemaSettings.BlockTitleItem, null), _react2().default.createElement(_client().SchemaSettings.Divider, null), _react2().default.createElement(_client().SchemaSettings.Remove
   // removeParentsIfNoChildren
   , {

package/lib/client/renderer/library/G2PlotLibrary.js

@@ -61,7 +61,8 @@ const _useProps = ({
   });
   return _objectSpread(_objectSpread({
     data,
-    meta
+    meta,
+    animation: false
   }, general), advanced);
 };
 const G2PlotLibrary = {
@@ -73,7 +74,7 @@ const G2PlotLibrary = {
     useProps: _useProps,
     reference: {
       title: 'Line Chart',
-      link: 'https://g2plot.antv.antgroup.com/api/plots/bar'
+      link: 'https://g2plot.antv.antgroup.com/api/plots/line'
     }
   },
   area: {

package/lib/locale/tr-TR.d.ts

@@ -0,0 +1,2 @@
+declare const _default: {};
+export default _default;

package/lib/locale/tr-TR.js

@@ -0,0 +1,8 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _default = {};
+exports.default = _default;

package/lib/server/actions/query.js

@@ -49,15 +49,19 @@ const parseFieldAndAssociations = (ctx, params) => {
       name = _selected$field[1];
     }
     let field = underscored ? (0, _database().snakeCase)(name) : name;
-    let type = (_fields$get = fields.get(name)) === null || _fields$get === void 0 ? void 0 : _fields$get.type;
+    let fieldType = (_fields$get = fields.get(name)) === null || _fields$get === void 0 ? void 0 : _fields$get.type;
     if (target) {
-      var _fields$get2;
+      var _targetFields$get, _fields$get2;
+      const targetField = fields.get(target);
+      const targetCollection = ctx.db.getCollection(targetField.target);
+      const targetFields = targetCollection.fields;
+      fieldType = (_targetFields$get = targetFields.get(name)) === null || _targetFields$get === void 0 ? void 0 : _targetFields$get.type;
       field = `${target}.${field}`;
       name = `${target}.${name}`;
-      type = (_fields$get2 = fields.get(target)) === null || _fields$get2 === void 0 ? void 0 : _fields$get2.type;
+      const targetType = (_fields$get2 = fields.get(target)) === null || _fields$get2 === void 0 ? void 0 : _fields$get2.type;
       if (!models[target]) {
         models[target] = {
-          type
+          type: targetType
         };
       }
     } else {
@@ -66,7 +70,7 @@ const parseFieldAndAssociations = (ctx, params) => {
     return _objectSpread(_objectSpread({}, selected), {}, {
       field,
       name,
-      type,
+      type: fieldType,
       alias: selected.alias || name
     });
   };
@@ -161,11 +165,7 @@ const parseBuilder = (ctx, builder) => {
     fieldMap[alias || field] = dimension;
   });
   orders.forEach(item => {
-    const dialect = sequelize.getDialect();
-    let alias = `"${item.alias}"`;
-    if (dialect === 'mysql') {
-      alias = `\`${item.alias}\``;
-    }
+    const alias = sequelize.getQueryInterface().quoteIdentifier(item.alias);
     const name = hasAgg ? sequelize.literal(alias) : sequelize.col(item.field);
     order.push([name, item.order || 'ASC']);
   });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nocobase/plugin-data-visualization",
-  "version": "0.11.1-alpha.2",
+  "version": "0.11.1-alpha.4",
   "displayName": "Data Visualization",
   "displayName.zh-CN": "数据可视化",
   "description": "Provides business intelligence and data visualization features",
@@ -17,19 +17,19 @@
     "@formily/core": "2.2.26",
     "@formily/react": "2.2.26",
     "@formily/shared": "2.2.26",
-    "@nocobase/actions": "0.11.1-alpha.2",
-    "@nocobase/cache": "0.11.1-alpha.2",
-    "@nocobase/client": "0.11.1-alpha.2",
-    "@nocobase/database": "0.11.1-alpha.2",
-    "@nocobase/server": "0.11.1-alpha.2",
-    "@nocobase/test": "0.11.1-alpha.2",
-    "@nocobase/utils": "0.11.1-alpha.2",
-    "@testing-library/react": "^12.1.5",
+    "@nocobase/actions": "0.11.1-alpha.4",
+    "@nocobase/cache": "0.11.1-alpha.4",
+    "@nocobase/client": "0.11.1-alpha.4",
+    "@nocobase/database": "0.11.1-alpha.4",
+    "@nocobase/server": "0.11.1-alpha.4",
+    "@nocobase/test": "0.11.1-alpha.4",
+    "@nocobase/utils": "0.11.1-alpha.4",
+    "@testing-library/react": "^14.0.0",
     "antd": "^5.6.4",
     "lodash": "^4.17.21",
     "react": "^18.2.0",
     "react-i18next": "^11.15.1",
     "vitest": "^0.33.0"
   },
-  "gitHead": "8482aa720ea1c3abbbb9fe1208e73778bd63f1cf"
+  "gitHead": "d9b5bde913013f1057e1aab49587eb0ad3dcb06e"
 }

package/src/client/__tests__/hooks.test.ts

@@ -1,5 +1,5 @@
 import * as client from '@nocobase/client';
-// import { renderHook } from '@testing-library/react';
+import { renderHook } from '@testing-library/react';
 import { vi } from 'vitest';
 import formatters from '../block/formatters';
 import transformers from '../block/transformers';
@@ -13,8 +13,7 @@ import {
   useTransformers,
 } from '../hooks';
 
-// TODO: 为了暂时解决很多 Warning 的问题把 `@testing-library/react` 降级到了 12.x 所以不支持 `renderHook`，等到再次升级到 14.x 时再把 skip 去掉
-describe.skip('hooks', () => {
+describe('hooks', () => {
   beforeEach(() => {
     vi.spyOn(client, 'useCollectionManager').mockReturnValue({
       getCollectionFields: (name: string) =>

package/src/client/block/ChartConfigure.tsx

@@ -1,17 +1,11 @@
 import { RightSquareOutlined } from '@ant-design/icons';
-import { ArrayItems, Editable, Form, FormCollapse, FormItem, Switch } from '@formily/antd-v5';
+import { ArrayItems, Editable, FormCollapse, FormItem, FormLayout, Switch } from '@formily/antd-v5';
 import { Form as FormType, ObjectField, createForm, onFieldChange, onFormInit } from '@formily/core';
 import { FormConsumer, ISchema, Schema } from '@formily/react';
 import {
   AutoComplete,
-  Cascader,
-  DatePicker,
-  Filter,
-  Input,
-  InputNumber,
-  Radio,
+  FormProvider,
   SchemaComponent,
-  Select,
   gridRowColWrap,
   useCollectionFieldsOptions,
   useCollectionFilterOptions,
@@ -126,17 +120,14 @@ export const ChartConfigure: React.FC<{
   };
   const chartType = useDefaultChartType();
   const form = useMemo(
-    () => {
-      return createForm({
+    () =>
+      createForm({
         values: { config: { chartType }, ...(initialValues || field?.decoratorProps), collection },
         effects: (form) => {
           onFieldChange('config.chartType', () => initChart(true));
-          onFormInit(() => {
-            queryReact(form);
-          });
+          onFormInit(() => queryReact(form));
         },
-      });
-    },
+      }),
     // visible, collection added here to re-initialize form when visible, collection change
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [field, visible, collection],
@@ -199,9 +190,8 @@ export const ChartConfigure: React.FC<{
           afterSave();
           return;
         }
-        insert(createRendererSchema(rendererProps), {
+        insert(gridRowColWrap(createRendererSchema(rendererProps)), {
           onSuccess: afterSave,
-          wrap: gridRowColWrap,
         });
       }}
       onCancel={() => {
@@ -224,70 +214,72 @@ export const ChartConfigure: React.FC<{
         background: 'rgba(128, 128, 128, 0.08)',
       }}
     >
-      <Form layout="vertical" form={form}>
-        <Row gutter={8}>
-          <Col span={7}>
-            <Card
-              style={{
-                height: 'calc(100vh - 300px)',
-                overflow: 'auto',
-                margin: '12px 0 12px 12px',
-              }}
-              ref={queryRef}
-            >
-              <Tabs
-                tabBarExtraContent={<RunButton />}
-                items={[
-                  {
-                    label: t('Query'),
-                    key: 'query',
-                    children: <ChartConfigure.Query />,
-                  },
-                  {
-                    label: t('Data'),
-                    key: 'data',
-                    children: <ChartConfigure.Data />,
-                  },
-                ]}
-              />
-            </Card>
-          </Col>
-          <Col span={6}>
-            <Card
-              style={{
-                height: 'calc(100vh - 300px)',
-                overflow: 'auto',
-                margin: '12px 3px 12px 3px',
-              }}
-              ref={configRef}
-            >
-              <Tabs
-                items={[
-                  {
-                    label: t('Chart'),
-                    key: 'chart',
-                    children: <ChartConfigure.Config />,
-                  },
-                  {
-                    label: t('Transform'),
-                    key: 'transform',
-                    children: <ChartConfigure.Transform />,
-                  },
-                ]}
-              />
-            </Card>
-          </Col>
-          <Col span={11}>
-            <Card
-              style={{
-                margin: '12px 12px 12px 0',
-              }}
-            >
-              <ChartConfigure.Renderer />
-            </Card>
-          </Col>
-        </Row>
-      </Form>
+      <FormProvider form={form}>
+        <FormLayout layout="vertical">
+          <Row gutter={8}>
+            <Col span={7}>
+              <Card
+                style={{
+                  height: 'calc(100vh - 300px)',
+                  overflow: 'auto',
+                  margin: '12px 0 12px 12px',
+                }}
+                ref={queryRef}
+              >
+                <Tabs
+                  tabBarExtraContent={<RunButton />}
+                  items={[
+                    {
+                      label: t('Query'),
+                      key: 'query',
+                      children: <ChartConfigure.Query />,
+                    },
+                    {
+                      label: t('Data'),
+                      key: 'data',
+                      children: <ChartConfigure.Data />,
+                    },
+                  ]}
+                />
+              </Card>
+            </Col>
+            <Col span={6}>
+              <Card
+                style={{
+                  height: 'calc(100vh - 300px)',
+                  overflow: 'auto',
+                  margin: '12px 3px 12px 3px',
+                }}
+                ref={configRef}
+              >
+                <Tabs
+                  items={[
+                    {
+                      label: t('Chart'),
+                      key: 'chart',
+                      children: <ChartConfigure.Config />,
+                    },
+                    {
+                      label: t('Transform'),
+                      key: 'transform',
+                      children: <ChartConfigure.Transform />,
+                    },
+                  ]}
+                />
+              </Card>
+            </Col>
+            <Col span={11}>
+              <Card
+                style={{
+                  margin: '12px 12px 12px 0',
+                }}
+              >
+                <ChartConfigure.Renderer />
+              </Card>
+            </Col>
+          </Row>
+        </FormLayout>
+      </FormProvider>
     </Modal>
   );
 };
@@ -359,24 +351,7 @@ ChartConfigure.Query = function Query() {
         collection: current?.collection,
         useOrderReaction: useOrderReaction(compiledFieldOptions, fields),
       }}
-      components={{
-        ArrayItems,
-        Editable,
-        FormCollapse,
-        Card,
-        Switch,
-        Select,
-        Input,
-        InputNumber,
-        FormItem,
-        Radio,
-        Space,
-        Filter,
-        DatePicker,
-        Text,
-        FromSql,
-        Cascader,
-      }}
+      components={{ ArrayItems, Editable, FormCollapse, FormItem, Space, Switch, FromSql }}
     />
   );
 };
@@ -411,7 +386,7 @@ ChartConfigure.Config = function Config() {
           <SchemaComponent
             schema={getConfigSchema(schema)}
             scope={{ t, chartTypes, useChartFields: getChartFields, getReference }}
-            components={{ Card, Select, Input, FormItem, ArrayItems, Space, AutoComplete }}
+            components={{ FormItem, ArrayItems, Space, AutoComplete }}
           />
         );
       }}
@@ -427,7 +402,7 @@ ChartConfigure.Transform = function Transform() {
   return (
     <SchemaComponent
       schema={transformSchema}
-      components={{ Select, FormItem, ArrayItems, Space }}
+      components={{ FormItem, ArrayItems, Space }}
       scope={{ useChartFields: getChartFields, useFieldTypeOptions, useTransformers, t }}
     />
   );

package/src/client/block/schemas/configure.ts

@@ -219,10 +219,20 @@ export const querySchema: ISchema = {
                           'x-component': 'Input',
                           'x-component-props': {
                             placeholder: '{{t("Alias")}}',
+                            style: {
+                              minWidth: '100px',
+                            },
+                          },
+                        },
+                      },
+                      {
+                        required: true,
+                        'x-component-props': {
+                          style: {
+                            overflow: 'auto',
                           },
                         },
                       },
-                      { required: true },
                     ),
                   },
                 },
@@ -234,44 +244,56 @@ export const querySchema: ISchema = {
                     key: 'dimensions',
                   },
                   properties: {
-                    dimensions: getArraySchema({
-                      field: {
-                        type: 'string',
-                        'x-decorator': 'FormItem',
-                        'x-component': 'Cascader',
-                        'x-component-props': {
-                          placeholder: '{{t("Field")}}',
-                          fieldNames: {
-                            label: 'title',
-                            value: 'name',
-                            children: 'children',
+                    dimensions: getArraySchema(
+                      {
+                        field: {
+                          type: 'string',
+                          'x-decorator': 'FormItem',
+                          'x-component': 'Cascader',
+                          'x-component-props': {
+                            placeholder: '{{t("Field")}}',
+                            fieldNames: {
+                              label: 'title',
+                              value: 'name',
+                              children: 'children',
+                            },
                           },
+                          enum: '{{ fieldOptions }}',
+                          required: true,
                         },
-                        enum: '{{ fieldOptions }}',
-                        required: true,
-                      },
-                      format: {
-                        type: 'string',
-                        'x-decorator': 'FormItem',
-                        'x-component': 'Select',
-                        'x-component-props': {
-                          placeholder: '{{t("Format")}}',
-                          style: {
-                            maxWidth: '120px',
+                        format: {
+                          type: 'string',
+                          'x-decorator': 'FormItem',
+                          'x-component': 'Select',
+                          'x-component-props': {
+                            placeholder: '{{t("Format")}}',
+                            style: {
+                              maxWidth: '120px',
+                            },
+                          },
+                          'x-reactions': '{{ useFormatterOptions }}',
+                          'x-visible': '{{ $self.dataSource && $self.dataSource.length }}',
+                        },
+                        alias: {
+                          type: 'string',
+                          'x-decorator': 'FormItem',
+                          'x-component': 'Input',
+                          'x-component-props': {
+                            placeholder: '{{t("Alias")}}',
+                            style: {
+                              minWidth: '100px',
+                            },
                           },
                         },
-                        'x-reactions': '{{ useFormatterOptions }}',
-                        'x-visible': '{{ $self.dataSource && $self.dataSource.length }}',
                       },
-                      alias: {
-                        type: 'string',
-                        'x-decorator': 'FormItem',
-                        'x-component': 'Input',
+                      {
                         'x-component-props': {
-                          placeholder: '{{t("Alias")}}',
+                          style: {
+                            overflow: 'auto',
+                          },
                         },
                       },
-                    }),
+                    ),
                   },
                 },
                 pane3: {
@@ -325,12 +347,20 @@ export const querySchema: ISchema = {
                           'x-component-props': {
                             defaultValue: 'ASC',
                             optionType: 'button',
+                            style: {
+                              width: '128px',
+                            },
                           },
                           enum: ['ASC', 'DESC'],
                         },
                       },
                       {
                         'x-reactions': '{{ useOrderReaction }}',
+                        'x-component-props': {
+                          style: {
+                            overflow: 'auto',
+                          },
+                        },
                       },
                     ),
                   },

package/src/client/renderer/ChartRenderer.tsx

@@ -96,11 +96,7 @@ ChartRenderer.Designer = function Designer() {
       </SchemaSettings.Item>
       <SchemaSettings.Item
         key="duplicate"
-        onClick={() =>
-          insertAdjacent('afterEnd', createRendererSchema(schema?.['x-decorator-props']), {
-            wrap: gridRowColWrap,
-          })
-        }
+        onClick={() => insertAdjacent('afterEnd', gridRowColWrap(createRendererSchema(schema?.['x-decorator-props'])))}
       >
         {t('Duplicate')}
       </SchemaSettings.Item>

package/src/client/renderer/library/G2PlotLibrary.tsx

@@ -42,6 +42,7 @@ const useProps: usePropsFunc = ({ data, fieldProps, general, advanced }) => {
   return {
     data,
     meta,
+    animation: false,
     ...general,
     ...advanced,
   };
@@ -56,7 +57,7 @@ export const G2PlotLibrary: Charts = {
     useProps,
     reference: {
       title: 'Line Chart',
-      link: 'https://g2plot.antv.antgroup.com/api/plots/bar',
+      link: 'https://g2plot.antv.antgroup.com/api/plots/line',
     },
   },
   area: {

package/src/locale/tr-TR.ts

@@ -0,0 +1 @@
+export default {};

package/src/server/actions/query.ts

@@ -1,6 +1,6 @@
 import { Context, Next } from '@nocobase/actions';
 import { Cache } from '@nocobase/cache';
-import { FilterParser, snakeCase } from '@nocobase/database';
+import { Field, FilterParser, snakeCase } from '@nocobase/database';
 import ChartsV2Plugin from '../plugin';
 import { formatter } from './formatter';
 
@@ -65,13 +65,17 @@ export const parseFieldAndAssociations = (ctx: Context, params: QueryParams) =>
       [target, name] = selected.field;
     }
     let field = underscored ? snakeCase(name) : name;
-    let type = fields.get(name)?.type;
+    let fieldType = fields.get(name)?.type;
     if (target) {
+      const targetField = fields.get(target) as Field;
+      const targetCollection = ctx.db.getCollection(targetField.target);
+      const targetFields = targetCollection.fields;
+      fieldType = targetFields.get(name)?.type;
       field = `${target}.${field}`;
       name = `${target}.${name}`;
-      type = fields.get(target)?.type;
+      const targetType = fields.get(target)?.type;
       if (!models[target]) {
-        models[target] = { type };
+        models[target] = { type: targetType };
       }
     } else {
       field = `${collectionName}.${field}`;
@@ -80,7 +84,7 @@ export const parseFieldAndAssociations = (ctx: Context, params: QueryParams) =>
       ...selected,
       field,
       name,
-      type,
+      type: fieldType,
       alias: selected.alias || name,
     };
   };
@@ -161,11 +165,7 @@ export const parseBuilder = (ctx: Context, builder: QueryParams) => {
   });
 
   orders.forEach((item: OrderProps) => {
-    const dialect = sequelize.getDialect();
-    let alias = `"${item.alias}"`;
-    if (dialect === 'mysql') {
-      alias = `\`${item.alias}\``;
-    }
+    const alias = sequelize.getQueryInterface().quoteIdentifier(item.alias);
     const name = hasAgg ? sequelize.literal(alias) : sequelize.col(item.field as string);
     order.push([name, item.order || 'ASC']);
   });
@@ -251,18 +251,8 @@ export const cacheWrap = async (
 };
 
 export const query = async (ctx: Context, next: Next) => {
-  const {
-    uid,
-    collection,
-    measures,
-    dimensions,
-    orders,
-    filter,
-    limit,
-    sql,
-    cache: cacheConfig,
-    refresh,
-  } = ctx.action.params.values as QueryParams;
+  const { uid, collection, measures, dimensions, orders, filter, limit, sql, cache: cacheConfig, refresh } = ctx.action
+    .params.values as QueryParams;
   const roleName = ctx.state.currentRole || 'anonymous';
   const can = ctx.app.acl.can({ role: roleName, resource: collection, action: 'list' });
   if (!can && roleName !== 'root') {