@cloudbase/weda-ui 2.0.27 → 2.0.28

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cloudbase/weda-ui",
-  "version": "2.0.27",
+  "version": "2.0.28",
   "main": "./src/index.js",
   "module": "./src/index",
   "miniprogram": "mpdist",

package/src/mp/components/form/select/index.js

@@ -426,7 +426,7 @@ Component({
         return { value: item.Value, code: item.Code };
       }); //保存省级名称
       this.setData({
-        multiArray: JSON.parse(JSON.stringify(provinceArr)),
+        multiArray: [destr(JSON.stringify(provinceArr))],
         provinceList, //保存省级原始数据
         provinceArr, //省级所有的名称
       });
@@ -460,7 +460,7 @@ Component({
       if (regionType == 'levelTwo') {
         const cityData = [this.data.provinceArr, cityArr];
         this.setData({
-          multiArray: JSON.parse(JSON.stringify(cityData)),
+          multiArray: destr(JSON.stringify(cityData)),
         });
       }
       var defaultCode = cityList[0]?.Code;
@@ -493,7 +493,7 @@ Component({
       });
       const threeRegion = [this.data.provinceArr, this.data.cityArr, regionArr];
       this.setData({
-        multiArray: JSON.parse(JSON.stringify(threeRegion)),
+        multiArray: destr(JSON.stringify(threeRegion)),
         regionList,
         regionArr,
       });
@@ -507,8 +507,8 @@ Component({
       const { regionType } = this.properties;
       var column = e.detail.column; // 当前改变的列
       var data = {
-        multiIndex: JSON.parse(JSON.stringify(this.data.multiIndex)),
-        multiArray: JSON.parse(JSON.stringify(this.data.multiArray)),
+        multiIndex: destr(JSON.stringify(this.data.multiIndex)),
+        multiArray: destr(JSON.stringify(this.data.multiArray)),
       };
       data.multiIndex[column] = e.detail.value; // 第几列改变了就是对应multiIndex的第几个，更新它
       switch (

package/src/mp/components/navLayout/index.wxss

@@ -1152,7 +1152,7 @@
   .weda-grid-navigation__col--small
   .weda-grid-navigation__icon
   .weda-icon {
-  font-size: 3.428571em;
+  font-size: 2.2857em;
 }
 .weda-grid-navigation
   .weda-grid-navigation__col--big

package/src/mp/components/navigationBar/index.js

@@ -1,6 +1,6 @@
 import destr from '../../utils/destr';
 import { isUrl } from '../../utils/platform';
-import { getAppCustomNav } from '../../utils/tcb';
+import { getAppCustomNav, resolveStaticResourceUrl } from '../../utils/tcb';
 
 Component({
   properties: {
@@ -31,6 +31,7 @@ Component({
       showTitle: true,
       title: '标题',
       showLogo: true,
+      logoPath: '',
       logoUrl:
         'https://imgcache.qq.com/qcloud/tcloud_dtc/static/static_source_business/43d3b2b7-445c-4858-8eb0-50ac5d5cc08e.svg  ',
       titleFontSize: '18',
@@ -59,6 +60,12 @@ Component({
             } = navigationData;
             let menus = isMultiTerminal ? mobileMenuData : menuData;
             let selectedKey = this.defaultSelectedMenu(menus);
+            // 从cdn中读取图片
+            const logoUrl =
+              resolveStaticResourceUrl(navigationStyle.logoPath) ||
+              navigationStyle.logoUrl;
+            navigationStyle.logoUrl = logoUrl;
+
             this.setData({
               menuData: this.generateMenuData(
                 menus,
@@ -89,16 +96,20 @@ Component({
     generateMenuData(menuData, menuItem, init = false) {
       let menus = JSON.parse(JSON.stringify(menuData));
       return menus?.map((i) => {
-        let { iconUrl = 'td:view-module', children } = i;
+        let { iconUrl = 'td:view-module', children, iconPath } = i;
         let iconType = 'image';
         let ticon = '';
-        if (!isUrl(iconUrl)) {
+        if (isUrl(iconUrl)) {
+          // 从cdn中读取图片
+          iconUrl = resolveStaticResourceUrl(iconPath) || iconUrl;
+        } else {
           iconType = 'icon';
           if (iconUrl.includes('td:')) {
             iconType = 't-icon';
             ticon = iconUrl?.replace('td:', '');
           }
         }
+
         if (init) {
           i.expand = this.hasSelectedMenu(i, menuItem.key);
         } else if (i.key === menuItem.key) {
@@ -118,7 +129,7 @@ Component({
     },
     menuClick(itemInfo) {
       const menu = itemInfo?.currentTarget?.dataset?.menu;
-      const { path, type, key, children, expand } = menu;
+      const { path, type, children, expand } = menu;
       if (children.length) {
         this.setData({
           menuData: this.generateMenuData(this.data.menuData, {

package/src/mp/utils/tcb.js

@@ -74,3 +74,17 @@ export async function callDataSourceApi(param) {
     return {};
   }
 }
+
+/**
+ * 返回静态托管cdn域名
+ */
+export const resolveStaticResourceUrl = (path) => {
+  try {
+    // eslint-disable-next-line no-unsafe-optional-chaining
+    const resourceUrl =
+      getApp()?.app?.__internal__?.resolveStaticResourceUrl(path);
+    return resourceUrl;
+  } catch (error) {
+    return '';
+  }
+};

package/src/web/components/form/uploader/uploader.pc.tsx

@@ -78,7 +78,7 @@ export function UploaderPCInner(props) {
   const [progress, setProgress] = React.useState(0);
   // 文件列表
   const [fileIDList, setfileIDList] = React.useState([]);
-  const fileRef = React.useRef(['']);
+  const fileRef = React.useRef<string[] | string>([]);
   React.useEffect(() => {
     let initialValue = []
       .concat(defaultValue)

package/src/web/components/navigationBar/common.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
-import { IMenuItem, INavigationStyle } from './type';
-import { isUrl } from '../../utils/platform';
+import type { IMenuItem, INavigationStyle } from './type';
+import { isUrl, resolveStaticResourceUrl } from '../../utils/platform';
 import { IconFont } from 'tdesign-icons-react';
 const CLASS_PREFIX = 'weda-menu';
 
@@ -30,7 +30,7 @@ export const renderMenuTitle = (
   hasIcon: boolean
 ) => {
   const { menuColor, menuFontSize, showMenuIcon } = navigationStyle;
-  const { title, level, iconUrl } = item;
+  const { title, level, iconUrl, iconPath } = item;
   return (
     <span
       className="menu-text"
@@ -43,7 +43,7 @@ export const renderMenuTitle = (
       {showMenuIcon &&
         level === 0 &&
         hasIcon &&
-        renderMenuIcon(iconUrl, navigationStyle)}
+        renderMenuIcon(iconUrl, iconPath, navigationStyle)}
       {title}
     </span>
   );
@@ -57,14 +57,16 @@ export const renderLogo = (
   navigationStyle: INavigationStyle,
   className: string
 ) => {
-  const { showLogo, logoHeight, logoWidth, logoUrl } = navigationStyle;
+  const { showLogo, logoHeight, logoWidth, logoUrl, logoPath } =
+    navigationStyle;
+  const src = resolveStaticResourceUrl(logoPath) || logoUrl;
   return (
     showLogo && (
       <img
         data-testid="navigationBar-logo"
         className={className}
         style={{ width: `${logoWidth}px`, height: `${logoHeight}px` }}
-        src={logoUrl || defaultLogoUrl}
+        src={src || defaultLogoUrl}
         alt="logo"
       />
     )
@@ -93,11 +95,14 @@ export const IconShow = ({ onIcon, menuColor, menuFontSize }) => {
 // 菜单图标
 export const renderMenuIcon = (
   iconUrl: string,
+  iconPath: string,
   navigationStyle: INavigationStyle
 ) => {
   const { menuColor, menuFontSize } = navigationStyle;
   let icon = iconUrl || 'td:view-module';
+
   if (iconUrl && isUrl(iconUrl)) {
+    icon = resolveStaticResourceUrl(iconPath) || iconUrl;
     return (
       <img
         className={`${CLASS_PREFIX}__item-icon`}

package/src/web/components/navigationBar/h5Menu.tsx

@@ -1,7 +1,7 @@
 /* eslint-disable react/jsx-key */
 import React, { useState } from 'react';
 import { Menu, Drawer } from 'tea-component';
-import { IMenuItem, INavigationStyle } from './type';
+import type { IMenuItem, INavigationStyle } from './type';
 import classNames from '../../utils/classnames';
 import {
   renderMenuTitle,

package/src/web/components/navigationBar/horizontalMenu.tsx

@@ -1,7 +1,7 @@
 /* eslint-disable react/jsx-key */
 import React, { useState, useRef, useEffect, useCallback } from 'react';
 import { NavMenu, List, Dropdown } from 'tea-component';
-import { IMenuItem, INavigationStyle } from './type';
+import type { IMenuItem, INavigationStyle } from './type';
 import { usePlatform } from '../../utils/platform';
 import classNames from '../../utils/classnames';
 import {
@@ -157,7 +157,8 @@ const HorizontalMenu: React.FC<{
                     }
                   }}
                 >
-                  {showMenuIcon && renderMenuIcon(i?.iconUrl, navigationStyle)}
+                  {showMenuIcon &&
+                    renderMenuIcon(i?.iconUrl, i?.iconPath, navigationStyle)}
                   {i?.children?.length ? (
                     <Dropdown
                       trigger={'hover'}

package/src/web/components/navigationBar/index.tsx

@@ -32,6 +32,7 @@ const defaultNavigationBar: {
     showTitle: true,
     title: '菜单标题',
     showLogo: true,
+    logoPath: '',
     logoUrl:
       'https://imgcache.qq.com/qcloud/tcloud_dtc/static/static_source_business/43d3b2b7-445c-4858-8eb0-50ac5d5cc08e.svg',
     titleFontSize: 18,

package/src/web/components/navigationBar/type.d.ts

@@ -34,7 +34,10 @@ export interface IMenuItem {
    * 图标链接
    */
   iconUrl?: string;
-
+  /**
+   * 图标path
+   */
+  iconPath?: string;
   /**
    * 子菜单
    */
@@ -92,6 +95,10 @@ export interface INavigationStyle {
    * 图标地址
    */
   logoUrl: string;
+  /**
+   * 图标path
+   */
+  logoPath: string;
   /**
    * 标题字号
    */

package/src/web/components/navigationBar/verticalMenu.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import { Menu } from 'tea-component';
-import { IMenuItem, INavigationStyle } from './type';
+import type { IMenuItem, INavigationStyle } from './type';
 import {
   renderMenuTitle,
   renderLogo,

package/src/web/utils/platform.js

@@ -122,6 +122,20 @@ export const cutFileTitle = (str = '', count = 10) => {
  */
 export const isInIde = () => !!window?.app?.cloud?.IS_WEDA_IDE;
 
+/**
+ * 解析素材资源
+ */
+export const resolveStaticResourceUrl = (path) => {
+  try {
+    // eslint-disable-next-line no-unsafe-optional-chaining
+    const resourceUrl =
+      window?.app?.__internal__?.resolveStaticResourceUrl(path);
+    return resourceUrl;
+  } catch (error) {
+    return '';
+  }
+};
+
 /**
  * cloudid和文件名转换
  */