npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

@quec/panel-component-customer-attrs

v1.0.7

Published

自定义物模型组件库

Downloads

1

Readme

版本记录

| 版本号 | 功能 | 时间 | 作者 | 备注 | | ------ | ----------------------- | ---------- | ------- | ---- | | 1.0.0 | 首次创建 | 2022-09-05 | ives.li | 无 | | 1.0.4 | 样式修改 | 2022-10-17 | ives.li | | | 1.0.6 | 支持自定义itemview | 2024-01-05 | ives.li | | | 1.0.7 | 去除quec-app-basic-ui库 | 2024-01-12 | ives.li | |

组件列表

CustomerAttrsView

物模型列表展示

| 属性 | 释义 | 类型 | 默认值 | 备注 | | ---------------------- | -------------------------------------------------- | -------------------------------------------------------------- | ------ | ------------------------------------------------------------------------------ | | attrList | 物模型列表 | any[] | | | | onBoolAttrChange | bool型值变化回调 | Function | | | | onEnumAttrChange | enum型点击回调 | Function | | | | onNumberAttrChange | number型点击回调 | Function | | | | onTextAttrChange | text型点击回调 | Function | | | | onStructAttrClick | struct型点击回调 | Function | | | | onArrayAttrClick | array型点击回调 | Function | | | | containerStyle | 自定义界面物模型容器样式,如不设置,则采用默认样式 | ViewStyle | | | | itemTitleStyle | item标题样式,如不设置,则采用默认样式 | ViewStyle | | | | itemValueStyle | item value样式,如不设置,则采用默认样式 | ViewStyle | | | | itemMoreImg | item右侧按钮图片,如不设置,则采用默认样式 | any | | | | itemMoreImgStyle | item 右侧更多图标样式,如不设置,则采用默认样式 | ViewStyle | | | | enableDivider | 是否需要显示分割线 | boolean | true | | | dividerStyle | item分割线样式 | ViewStyle | | | | renderCustomerItemView | 自定义item样式 | (attr: any, showDivider: boolean) => React.ReactElement| null | | 自定义attr对应的item界面,如果返回null或者不定义该参数,则会按默认的界面渲染; |

BaseReadStructAttrPage

只读结构体物模型界面

| 参数 | 释义 | 类型 | | ---- | -------------------- | ------ | | attr | 对应结构体物模型数据 | Object |

| 方法 | 返回值 | 释义 | | --------------------- | ---------------------- | ----------------------------------- | | getContainerStyle | ViewStyle or undefined | 整个物模型的容器 | | getItemContainerStyle | ViewStyle or undefined | 结构体物模型单一item容器样式 | | getItemTitleStyle | ViewStyle or undefined | 结构体物模型单独一个item的标题样式 | | getItemValueStyle | ViewStyle or undefined | 结构体物模型单独一个item的value样式 | | enableDivider | boolean | 是否显示分割线 | | getDividerStyle | ViewStyle or undefined | 分割线样式 |

BaseEditStructAttrPage

读写结构体物模型界面

| 参数 | 释义 | 类型 | | ---- | -------------------- | ------ | | attr | 对应结构体物模型数据 | Object |

| 方法 | 返回值 | 释义 | | ------------------------------------ | ----------------------- | ------------------------------------------- | | getContainerStyle | ViewStyle or undefined | 整个物模型的容器 | | getItemGroupStyle | ViewStyle or undefined | 单个item组样式 | | getItemGroupIconStyle | ImageStyle or undefined | 单个item组里图片样式 | | getItemContainerStyle | ViewStyle or undefined | 结构体物模型单一item容器样式 | | getItemTitleStyle | ViewStyle or undefined | 结构体物模型单独一个item的标题样式 | | getItemValueStyle | ViewStyle or undefined | 结构体物模型单独一个item的value样式 | | getItemMoreImg | any | 结构体物模型单独一个item的更多图片 | | getItemMoreImgStyle | ImageStyle or undefined | 结构体物模型单独一个item的更多图片样式 | | enableDivider | boolean | 是否显示分割线 | | getDividerStyle | ViewStyle or undefined | 分割线样式 | | sendCMD(attr: any, sendSpecs: any[]) | | 指令下发实现方法,sendSpecs选中下发的物模型 |

BaseReadArrayAttrPage

只读数组物模型界面

| 参数 | 释义 | 类型 | | ---- | ------------------ | ------ | | attr | 对应数组物模型数据 | Object |

| 方法 | 返回值 | 释义 | | --------------------- | ---------------------- | ----------------------------------- | | getContainerStyle | ViewStyle or undefined | 整个物模型的容器 | | getItemContainerStyle | ViewStyle or undefined | 结构体物模型单一item容器样式 | | getItemTitleStyle | ViewStyle or undefined | 结构体物模型单独一个item的标题样式 | | getItemValueStyle | ViewStyle or undefined | 结构体物模型单独一个item的value样式 | | enableDivider | boolean | 是否显示分割线 | | getDividerStyle | ViewStyle or undefined | 分割线样式 |

BaseEditArrayAttrPage

只读数组物模型界面

| 参数 | 释义 | 类型 | | ---- | ------------------ | ------ | | attr | 对应数组物模型数据 | Object |

| 方法 | 返回值 | 释义 | | -------------------------------- | ----------------------- | ------------------------------------------- | | getContainerStyle | ViewStyle or undefined | 整个物模型的容器 | | getItemGroupStyle | ViewStyle or undefined | 单个item组样式 | | getItemGroupIconStyle | ImageStyle or undefined | 单个item组里图片样式 | | getItemContainerStyle | ViewStyle or undefined | 结构体物模型单一item容器样式 | | getItemTitleStyle | ViewStyle or undefined | 结构体物模型单独一个item的标题样式 | | getItemValueStyle | ViewStyle or undefined | 结构体物模型单独一个item的value样式 | | getItemMoreImg | any | 结构体物模型单独一个item的更多图片 | | getItemMoreImgStyle | ImageStyle or undefined | 结构体物模型单独一个item的更多图片样式 | | enableDivider | boolean | 是否显示分割线 | | getDividerStyle | ViewStyle or undefined | 分割线样式 | | getStructItemGroupContainerStyle | ViewStyle or undefined | 单个struct item里 容器样式 | | getStructItemContainerStyle | ViewStyle or undefined | 单个struct item里 struct单个属性容器样式 | | getStructItemDividerStyle | ViewStyle or undefined | 单个struct item里 struct单个分割线样式 | | sendCMD(attr: any, data: any[]) | | 指令下发实现方法,sendSpecs选中下发的物模型 |

全局定义

全局定义文件

ColorConfig

全局颜色定义

| 方法 | 释义 | 备注 | | ------------------------------------ | -------------------- | ----------------------------- | | getInstance() | 获取全局颜色配置对象 | 设置和获取全局颜色配置对象 | | setColor(key: string, value: string) | 设置全局颜色 | key的标识 参照ImageConfigData | | setColors(obj: ImageConfigData) | 设置全局颜色 | 参照ImageConfigData | | getColors() | 获取默认颜色 | |

ImageConfigData

| 参数 | 类型 | 默认值 | 释义 | | ----------------- | ------ | --------- | -------------------------------------------------------------- | | basePageBgColor | string | '#f5f5f5' | 默认的结构体、数组类型界面(例如BaseEditStructAttrPage)背景色 | | wrapperColor | string | '#ffffff' | 页面块题色 | | primaryColor | string | '#3965FF' | 主题色 | | btnFontColor | string | '#FFFFFF' | 主题色对应的按钮字体颜色 | | dgBackground | string | '#FFFFFF' | 弹窗背景色 | | dgInputBackground | string | '#EFF4F8' | 弹窗输入框背景色 | | dgInputHintColor | string | '#A7B2BB' | 弹窗输入框提示颜色 | | textColor | string | '#333333' | 文字颜色 | | subTextColor | string | '#666666' | 次级文字颜色 | | hintTextColor | string | '#999999' | 提示文本颜色 | | dividerColor | string | '#f5f5f5' | 分割线颜色 | | errorColor | string | '#FF4242' | 错误提示颜色 |

LanguageConfig

全局语言定义

| 方法 | 释义 | 备注 | | ---------------------------------------- | -------------------- | -------------------------------- | | getInstance() | 获取全局语言配置对象 | 设置和获取全局语言配置对象 | | setLanguage(key: string, value: string) | 设置全局语言 | key的标识 参照LanguageConfigData | | setLanguages(object:LanguageConfigData ) | 设置全局语言 | 参照LanguageConfigData | | getLanguage() | 获取默认语言 | |

LanguageConfigData

| 参数 | 类型 | 默认值 | 释义 | | --------------------------------- | ------ | -------------------------------- | ------------------------------------------ | | cancel | string | '取消' | | | confirm | string | '确定' | | | plsEnterNumberGreaterThanMinValue | string | '请输入大于或等于%{min}的参数值' | 数值弹窗校验:输入大于等于最小值 | | plsEnterNumberLessThanMaxValue | string | '请输入小于或等于%{max}的参数值' | 数值弹窗校验:输入小于等于最大值 | | plsEnterParamInfo | string | '请输入参数信息' | text弹窗:请输入参数信息 | | allSelect | string | '全选' | 读写结构体界面全选按钮 | | cancelAllSelect | string | '取消全选' | 读写结构体界面取消全选按钮 | | sendCommand | string | '指令下发' | 读写结构体界面、读写物模型界面指令下发按钮 | | selectDateYear | string | '年' | 时间选择器单位 年 | | selectDateMonth | string | '月' | 时间选择器单位 月 | | selectDateDay | string | '日' | 时间选择器单位 日 | | selectDateHour | string | '时' | 时间选择器单位 时 | | selectDateMinute | string | '分' | 时间选择器单位 分 | | noDataPlsAdd | string | '暂无数据,快去添加吧~' | 数组结构体 空界面提示 | | plsToAdd | string | '去添加' | 数组结构体 添加数组 | | canNotMoreThanIt | string | '不能超过数量限制' | 数组结构体,添加数量不能超出错误提示 |

ImageConfigData

全局图片定义

| 方法 | 释义 | 备注 | | ------------------------------------ | -------------------- | ----------------------------- | | getInstance() | 获取全局图片配置对象 | 设置和获取全局图片配置对象 | | setImage(key: string, value: string) | 设置全局图片 | key的标识 参照ImageConfigData | | setImages(object: ImageConfigData) | 设置全局图片 | 参照ImageConfigData | | getImages() | 获取默认图片 | |

ImageConfigData

| 参数 | 类型 | 默认值 | 释义 | | ---------------- | ---- | ------ | -------------------------- | | enumItemNormal | any | | 枚举弹窗未选中item对应图标 | | enumItemSelected | any | | 枚举弹窗选中item对应图标 | | itemNormal | any | | 结构体数组item选项 | | itemSelected | any | | 结构体数组选中选项 | | moreImg | any | | 可点击物模型item 右箭头 | | emptyIcon | any | | 数组物模型界面空图片 | | deleteImg | any | | 数组物模型 删除图片 | | addImg | any | | 数组物模型 添加图片 |

组件依赖

"dependencies": {
    "moment": "^2.29.4",
    "react-native-localize": "^2.2.2",
    "react-fast-compare": "^3.2.0",
    "react-native-permissions": "^3.6.1",
    "react-native-elements": "^3.4.3",
    "@quec/panel-base-ui": "^2.0.9",
    "lodash": "^4.17.21",
    "react-native-localize": "^2.2.3",
  }