@cloudbase/weda-ui 3.4.13 → 3.4.14

package/dist/configs/components/dataView.js

@@ -155,6 +155,9 @@ ${rawTemplate}
 {{/with}}
 {{/with}}
 
+
+[attributes]
+':queryCondition'='[{"$and":[{"$and":[{"type":{"$eq":0}}]}]}]'
 [attributes.datasource]
 type='datamodal'
 name='sys_user'

package/dist/configs/components/echart.js

@@ -0,0 +1,505 @@
+import { defineConfig, Type, Tuple } from '../type-utils';
+const containerBodyTemplate = `
+{{#with $self as |$self|}}
+
+{{#if (helper_utils '===' $self.attributes.template 'line')}}
+[attributes]
+':option'="{
+  // X 轴数据
+  xAxis: {
+    data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日']
+  },
+  // Y轴 系列数据
+  series: [
+    {
+      data: [150, 230, 224, 218, 135, 147, 260],
+      type: 'line', // 图表类型: 折线图line
+      name: '分数',  // 图例名称
+      label: { // 图形标签
+        show: true,
+         formatter: '{c}' // 标签值，通常无需关注。https://echarts.apache.org/zh/option.html#tooltip.formatter
+      },
+      // 线条颜色样式
+      lineStyle: {
+        color: '#2A70E2' // 折线颜色
+      },
+      // 折线拐点标志样式
+      itemStyle:{
+        color: 'auto' // 拐点颜色，默认
+      }
+    }
+  ],
+  yAxis: {
+    type: 'value'  // Y 轴格式，通常无需修改
+  },
+  // 标题展示
+  title: {
+    show: true,
+    text: '折线图标题',
+    x: 'center', //水平居中
+  },
+  // 图例展示
+  legend: {
+    show: true,
+    bottom: 0
+  },
+}"
+
+{{else if (helper_utils '===' $self.attributes.template 'empty')}}
+[attributes]
+':option'="{
+}"
+
+{{else if (helper_utils '===' $self.attributes.template 'square')}}
+[attributes]
+':option'="{
+  // X 轴数据
+  xAxis: {
+    data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日']
+  },
+  // Y轴 系列数据
+  series: [
+    {
+      data: [150, 230, 224, 218, 135, 147, 260],
+      type: 'line', // 图表类型: 折线图line
+      name: '分数',  // 图例名称
+      label: { // 图形标签
+        show: true,
+         formatter: '{c}' // 标签值，通常无需关注。https://echarts.apache.org/zh/option.html#tooltip.formatter
+      },
+      // 线条颜色样式
+      lineStyle: {
+        color: '#2A70E2' // 折线颜色
+      },
+      // 面积颜色样式
+      areaStyle: {
+        opacity: 0.7, // 透明度，值为0-1
+        color: '#2A70E2' // 面积颜色
+      },
+      // 折线拐点标志样式
+      itemStyle:{
+        color: 'auto' // 拐点颜色，默认
+      }
+    }
+  ],
+  yAxis: {
+    type: 'value'  // Y 轴格式，通常无需修改
+  },
+  // 标题展示
+  title: {
+    show: true,
+    text: '折线图标题',
+    x: 'center', //水平居中
+  },
+  // 图例展示
+  legend: {
+    show: true,
+    bottom: 0
+  },
+}"
+
+{{else if (helper_utils '===' $self.attributes.template 'bar')}}
+[attributes]
+':option'="{
+  // X 轴数据
+  xAxis: {
+    data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日']
+  },
+  // Y轴 系列数据
+  series: [
+    {
+      data: [150, 230, 224, 218, 135, 147, 260],
+      type: 'bar', // 图表类型：柱状图bar
+      name: '分数',  // 图例名称
+      label: { // 图形标签
+        show: true,
+         formatter: '{c}' // 标签值，通常无需关注。https://echarts.apache.org/zh/option.html#tooltip.formatter
+      },
+      // 线条颜色样式
+      lineStyle: {
+        color: '#2A70E2' // 折线颜色
+      },
+      // 折线拐点标志样式
+      itemStyle:{
+        color: 'auto' // 拐点颜色，默认
+      }
+    }
+  ],
+  yAxis: {
+    type: 'value'  // Y 轴格式，通常无需修改
+  },
+  // 标题展示
+  title: {
+    show: true,
+    text: '柱状图标题',
+    x: 'center', //水平居中
+  },
+  // 图例展示
+  legend: {
+    show: true,
+    bottom: 0
+  },
+}"
+
+{{else if (helper_utils '===' $self.attributes.template 'pie')}}
+[attributes]
+':option'="{
+  // 饼图数据
+  series: [
+    {
+      type: 'pie', //图表类型：饼状图
+      data: [
+        {
+            value: 1080,
+            name: '一月份',
+            itemStyle: {
+              color: '#587' //饼图颜色
+            }
+        },
+        { value: 735, name: '二月份' },
+        { value: 580, name: '三月份' },
+        { value: 484, name: '四月份' },
+        { value: 300, name: '五月份' }
+      ],
+      // 图形上的文本标签
+      label: {
+        show:true,
+        position: 'outside' // outside|inside|inner|center
+       } ,
+      radius: '50%', //半径
+    }
+  ],
+  title: {
+    text: '饼状图标题',
+    x: 'center'
+  },
+  tooltip: {
+    trigger: 'item'
+  },
+  legend: {
+    show: true,
+    bottom: 0
+  },
+}"
+
+{{else if (helper_utils '===' $self.attributes.template 'scatter')}}
+[attributes]
+':option'="{
+  // 图表数据
+  series: [
+    {
+      type: 'scatter', //图表类型：散点（气泡）图
+      data: [
+        [0, 2], // 横纵坐标的值 [x,y]
+        [10.0, 8.04],
+        [8.07, 6.95],
+        [13.0, 7.58],
+        [9.05, 8.81],
+        [11.0, 8.33],
+        [14.0, 7.66],
+        [13.4, 6.81],
+        [10.0, 6.33],
+        [14.0, 8.96],
+        [12.5, 6.82],
+        [9.15, 7.2],
+        [11.5, 7.2],
+        [3.03, 4.23],
+        [12.2, 7.83],
+        [2.02, 4.47],
+        [1.05, 3.33],
+        [4.05, 4.96],
+        [6.03, 7.24],
+        [12.0, 6.26],
+        [12.0, 8.84],
+        [7.08, 5.82],
+        [5.02, 5.68]
+      ],
+      name: '系列1',
+      color: '#2A70E2', //标记颜色
+      symbolSize: 20 // 标记大小
+    }
+  ],
+  xAxis: {},
+  yAxis: {},
+  title: {
+    text: '散点图标题',
+    x: 'center'
+  },
+  legend: {
+    show: true,
+    bottom: 0
+  }
+}"
+
+{{else if (helper_utils '===' $self.attributes.template 'gauge')}}
+[attributes]
+':option'="{
+  // 仪表盘数据
+  series: [
+    {
+      // 数据
+      data: [
+        {
+          value: 50,
+          name: '得分'
+        }
+      ],
+      detail: {
+        formatter: '{value}'
+      },
+      name: '比赛结果',//图表名称，在图表提示中获取
+      type: 'gauge',// 图表类型：仪表盘gauge
+    }
+  ],
+  // 图表提示
+   tooltip: {
+    formatter: '{a}{b} : {c}'
+  },
+}"
+
+{{/if}}
+{{/with}}
+`;
+const data = Type.Object({
+    template: Type.String({
+        'x-index': 10,
+        title: '模板',
+        default: 'square',
+        description: '预设模板',
+        enum: Tuple([
+            {
+                label: '仪表盘',
+                value: 'gauge',
+                tooltip: '仪表盘',
+                src: 'https://cloudcache.tencent-cloud.com/qcloud/ui/static/static_source_business/d7d2fabe-57c8-46e7-8e07-1af6c32d171b.png',
+            },
+            {
+                label: '面积图',
+                value: 'square',
+                tooltip: '面积图',
+                src: 'https://cloudcache.tencent-cloud.com/qcloud/ui/static/static_source_business/18eb13e5-d60c-4b01-9044-5f14c3923445.png',
+            },
+            {
+                label: '散点图',
+                value: 'scatter',
+                tooltip: '散点图',
+                src: 'https://cloudcache.tencent-cloud.com/qcloud/ui/static/static_source_business/f14b0a64-6aaf-4d66-8245-9a1cb4f23a44.png',
+            },
+            {
+                label: '折线图',
+                value: 'line',
+                tooltip: '折线图',
+                src: 'https://cloudcache.tencent-cloud.com/qcloud/ui/static/static_source_business/55bf0f3d-fd6f-402f-8660-890225631bfa.png',
+            },
+            {
+                label: '柱状图',
+                value: 'bar',
+                tooltip: '柱状图',
+                src: 'https://cloudcache.tencent-cloud.com/qcloud/ui/static/static_source_business/9e39a145-af61-41ff-bf80-dd15c5d1adf9.png',
+            },
+            {
+                label: '饼图',
+                value: 'pie',
+                tooltip: '饼图',
+                src: 'https://cloudcache.tencent-cloud.com/qcloud/ui/static/static_source_business/d4586440-ab84-4c4e-bf06-2621523d2a3f.png',
+            },
+            {
+                label: '不使用模板',
+                value: 'empty',
+                tooltip: '不使用模板',
+                src: 'https://cloudcache.tencent-cloud.com/qcloud/ui/static/static_source_business/924e8472-9c52-46bc-bae7-e1ec30b92974.svg',
+            },
+        ]),
+        'x-component': 'data-sources-template-selector',
+        'x-props': {
+            'data-hidebind': true,
+        },
+        'x-category': '基础',
+    }),
+    option: Type.Unknown({
+        type: 'object',
+        title: '图表配置项（option）',
+        description: '',
+        'x-helper-text': '通用图表可配置多种Echarts的图表，Option的type属性指定图表类型。您可以直接查看[Echarts官方图表示例](https://echarts.apache.org/examples/zh/index.html#chart-type-line)，快速配置不同类型的图表。详见[通用图表使用文档](https://docs.cloudbase.net/lowcode/components/wedaUI/src/docs/compsdocs/chart/Chart#属性说明)',
+        'x-index': 20,
+        'x-component': 'jsontext',
+        'x-component-props': {
+            autoSize: { minRows: 2, maxRows: 10 },
+        },
+        'x-category': '基础',
+        default: {},
+    }),
+    dark: Type.Boolean({
+        default: false,
+        title: '深色模式',
+        'x-index': 30,
+        'x-category': '基础',
+    }),
+    opts: Type.Object({}, {
+        title: 'chart初始化参数',
+        'x-index': 40,
+        'x-category': '高级属性',
+        'x-component': 'jsontext',
+        'x-component-props': {
+            autoSize: { minRows: 2, maxRows: 10 },
+        },
+        'x-helper-text': '可配置render渲染模式等，对应[图表初始化init方法的opts配置项](https://echarts.apache.org/zh/api.html#echarts.init)',
+        default: {},
+    }),
+});
+const properties = Type.Object({
+    echartsInstance: Type.Unknown({
+        type: 'object',
+        title: '图表实例',
+    }),
+});
+// export default
+const config = defineConfig({
+    $schema: 'https://comp-public-1303824488.cos.ap-shanghai.myqcloud.com/schema/lcds_component.json',
+    // 属性定义
+    data,
+    // 只读属性定义
+    properties,
+    // 样式API
+    classes: [
+        {
+            name: '根元素',
+            selector: '.wd-chart',
+            description: '树组件根元素',
+        },
+        {
+            name: 'PC 端按钮根元素',
+            selector: '.wd-pc-chart',
+            description: '可以为 PC 端的编写样式',
+        },
+        {
+            name: 'H5 端按钮根元素',
+            selector: '.wd-h5-chart',
+            description: '可以为 H5 端的编写样式',
+        },
+    ],
+    // 组件方法
+    methods: [
+        {
+            name: 'setOption',
+            label: '设置图表配置',
+            'x-platforms': ['MOBILEWEB', 'PCWEB'],
+            description: '设置图表实例的配置项以及数据，万能接口，所有参数和数据的修改都可以通过 setOption 完成',
+            params: Type.Object({
+                option: Type.Unknown({
+                    type: 'object',
+                    title: '图表配置',
+                }),
+                opts: Type.Optional(Type.Object({
+                    notMerge: Type.Optional(Type.Boolean()),
+                    replaceMerge: Type.Optional(Type.Union([Type.String(), Type.Array(Type.String())])),
+                    lazyUpdate: Type.Optional(Type.Boolean()),
+                })),
+            }),
+        },
+        {
+            name: 'setTheme',
+            label: '设置主题',
+            'x-platforms': ['MOBILEWEB', 'PCWEB'],
+            description: '设置图表实例的主题',
+            params: Type.Object({
+                theme: Type.String(),
+            }),
+        },
+    ],
+    // 组件对外暴露事件
+    events: [
+        {
+            title: '单击',
+            name: 'click',
+            description: '',
+            'x-platforms': ['MOBILEWEB', 'PCWEB'],
+            detail: Type.Unknown(),
+        },
+        {
+            title: '双击',
+            name: 'dblclick',
+            description: '',
+            'x-platforms': ['MOBILEWEB', 'PCWEB'],
+            detail: Type.Unknown(),
+        },
+    ],
+    isContainer: true,
+    // 组件元信息
+    meta: {
+        name: 'Chart',
+        // 组件别名，用于生成组件 id，例如 Icon1
+        componentName: 'Chart',
+        title: '通用图表',
+        description: '通用图表是一个万能图表，可配置出多种图表如折线图、饼状图、面积图、地图、漏斗图、仪表盘等。',
+        icon: '../../icons/Chart.svg',
+        category: '图表',
+        categoryOrder: 600,
+        componentOrder: 570,
+        platform: ['MOBILEWEB', 'PCWEB'],
+        visible: ['APP'],
+        docsUrl: 'https://docs.cloudbase.net/lowcode/components/wedaUI/src/docs/compsdocs/chart/Chart',
+        // 快捷编辑时展示在编辑区的属性
+        // shortcut: {
+        //   props: ['line', 'checkable'],
+        // },
+        group: {
+            ['基础']: {
+                'x-index': 1,
+                expand: true,
+            },
+            ['高级属性']: {
+                'x-index': 2,
+                expand: true,
+            },
+        },
+        templates: [
+            {
+                when: '$attached',
+                to: '$children',
+                body: containerBodyTemplate,
+            },
+            {
+                when: 'template',
+                to: '$children',
+                body: containerBodyTemplate,
+            },
+        ],
+        inlineStyleForm: {
+            fontSize: {
+                visible: false,
+            },
+            color: {
+                visible: false,
+            },
+            fontWeight: {
+                visible: false,
+            },
+            lineHeight: {
+                visible: false,
+            },
+            justifyContent: {
+                visible: false,
+            },
+            flexDirection: {
+                visible: false,
+            },
+            border: {
+                visible: false,
+            },
+            background: {
+                visible: false,
+            },
+            boxShadow: {
+                visible: false,
+            },
+            opacity: {
+                visible: false,
+            },
+            alignItems: {
+                visible: false,
+            },
+        },
+    },
+});
+export default config;

package/dist/configs/components/listView.js

@@ -396,6 +396,7 @@ ${rawTemplate}
 
 [attributes]
 isSetStatus=true
+':queryCondition'='[{"$and":[{"$and":[{"type":{"$eq":0}}]}]}]'
 [attributes.datasource]
 type='datamodal'
 name='sys_user'

package/dist/configs/components/wd-official-account.js

@@ -53,6 +53,7 @@ export default defineConfig({
     ],
     meta: {
         name: 'WdOfficialAccount',
+        componentName: 'OfficialAccount',
         title: '公众号关注组件',
         description: '可在小程序内展示公众号关注入口，方便用户快捷关注或访问公众号。',
         category: '小程序',

package/dist/configs/index.js

@@ -109,7 +109,9 @@ import WdFormDetail from './components/wd-form-detail';
 import CustomerService from './components/customer-service';
 import WdTree from './components/wd-tree';
 import WdOfficialAccount from './components/wd-official-account';
+import Chart from './components/echart';
 export const components = {
+    Chart,
     WdOfficialAccount,
     WdTree,
     WdFormDetail,

package/dist/web/actions/showMessage/index.js

@@ -1,6 +1,6 @@
 import { isH5Platform } from '../../utils/platform';
 import { message, setConfig } from 'tea-component';
-import './index.css';
+import './style';
 const iconType = {
     success: 'success',
     error: 'error',

package/dist/web/actions/showMessage/style.js

@@ -0,0 +1,2 @@
+import './index.css';
+import '../../components/style';

package/dist/web/actions/showModal/index.js

@@ -4,7 +4,7 @@ import * as React from 'react';
 import { forwardRef, useState, useEffect, useImperativeHandle } from 'react';
 import { Modal, Button, Text, ConfigProvider } from 'tea-component';
 import { noop } from '../../utils/constant';
-import './index.css';
+import './style';
 const ModalShow = forwardRef(function ModalShow(props, ref) {
     const [visible, setVisible] = useState(false);
     // 渲染之后，马上显示

package/dist/web/actions/showModal/style.js

@@ -0,0 +1,2 @@
+import './index.css';
+import '../../components/style';

package/dist/web/components/button/index.js

@@ -4,7 +4,7 @@ import { Button as TeaButton, ConfigProvider, } from 'tea-component';
 import classNames from '../../utils/classnames';
 import { usePlatform, textToString } from '../../utils/platform';
 import { emptyObject } from '../../utils/constant';
-import './index.css';
+import './style';
 // 不用 react-weui 而直接用底层实现的原因是 react-weui 不能支持表单类型
 const Button = ({ text, size, type, contentSlot, formType, loading, disabled, events = emptyObject, className, style, id, ...props }) => {
     const platform = usePlatform();

package/dist/web/components/button/style.js

@@ -0,0 +1,2 @@
+import './index.css';
+import '../style';

package/dist/web/components/calendar/index.js

@@ -6,8 +6,8 @@ import * as PropTypes from 'prop-types';
 import classNames from '../../utils/classnames';
 import dayjs from 'dayjs';
 import { createDateList } from './util';
-import './index.css';
 import { emptyArray } from '../../utils/constant';
+import './style';
 // 抽取配置常量
 const blockName = 'weda-calendar'; // 类名前缀
 const minYear = 1970; // 最早选择年份

package/dist/web/components/calendar/style.js

@@ -0,0 +1,2 @@
+import './index.css';
+import '../style';

package/dist/web/components/carousel/index.js

@@ -3,9 +3,9 @@ import { useState, useEffect, useRef } from 'react';
 import classNames from '../../utils/classnames';
 import Swipe from 'react-easy-swipe';
 import { useDebouncedCallback, useEventListener, useResizeObserver, } from '@react-hookz/web';
-import './index.css';
 import Image from '../image';
 import { emptyObject } from '../../utils/constant';
+import './style';
 export default function Carousel({ className, style, autoplay, circular, vertical, indicatorDots, indicatorColor, indicatorActiveColor, duration, interval, current, events = emptyObject, id, images: defalutImages, }) {
     const isCorrectDatas = Array.isArray(defalutImages);
     const images = isCorrectDatas ? defalutImages : [];

package/dist/web/components/carousel/style.js

@@ -0,0 +1,2 @@
+import './index.css';
+import '../style';

package/dist/web/components/chart/common/echarts.js

@@ -1,3 +1,4 @@
+/* eslint-disable tree-shaking/no-side-effects-in-initialization */
 // 引入 echarts 核心模块，核心模块提供了 echarts 使用必须要的接口。
 import * as echarts from 'echarts/core';
 // 引入图表，图表后缀都为 Chart

package/dist/web/components/chart/statisticsCard/index.js

@@ -1,12 +1,12 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState, useRef } from 'react';
-import './index.css';
 import classNames from '../../../utils/classnames';
 import { ConfigProvider } from 'tea-component';
 import { usePlatform } from '../../../utils/platform';
 import { useDeepCompareEffect, useIsMounted } from '@react-hookz/web';
 import { callDataSource, callWedaApi } from '../../../utils/tcb';
 import { getUuid } from '../../../utils/tool';
+import './style';
 const CLASS_PREFIX = 'weda-statistics-card';
 // 默认显示值
 const defaultVal = 1000;

package/dist/web/components/chart/statisticsCard/style.js

@@ -0,0 +1,2 @@
+import './index.css';
+import '../../style';

package/dist/web/components/customer-service/customer-service.js

@@ -5,6 +5,7 @@ import { emptyObject } from '../../utils/constant';
 // @ts-ignore忽略ts交验
 // eslint-disable-next-line rulesdir/no-phantom-deps,import/no-unresolved
 import { autorun } from 'mobx';
+import '../style';
 export const CustomerService = forwardRef(function CustomerService(props, ref) {
     var _a, _b;
     const { id, className, style, events = emptyObject, } = props;