# zsm

> zsm

Latest version **1.0.21** (published 2019-07-22) · ISC license · 0 weekly downloads

## Install

```sh
npm install zsm
pnpm add zsm
yarn add zsm
bun add zsm
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.21 |
| Published | 2019-07-22 |
| First published | 2019-07-20 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 2 |
| Unpacked size | 20.7 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Maintainers | whyzsm |

## Links

- npm: https://www.npmjs.com/package/zsm
- npm.io page: https://npm.io/package/zsm

## Dependencies (2)

- [antd](https://npm.io/package/antd.md) ^3.16.1
- [tsc-init](https://npm.io/package/tsc-init.md) ^2.1.0

## Recent versions

- 1.0.21 (latest) — 2019-07-22
- 1.0.20 — 2019-07-22
- 1.0.19 — 2019-07-22
- 1.0.18 — 2019-07-22
- 1.0.17 — 2019-07-21
- 1.0.16 — 2019-07-21
- 1.0.15 — 2019-07-21
- 1.0.14 — 2019-07-21
- 1.0.13 — 2019-07-20
- 1.0.12 — 2019-07-20
- 1.0.11 — 2019-07-20
- 1.0.10 — 2019-07-20
- 1.0.9 — 2019-07-20
- 1.0.8 — 2019-07-20
- 1.0.6 — 2019-07-20
- … 6 more at https://npm.io/package/zsm/versions

## README

<p align="center">
  <a href="http://ant.design">
    <img width="200" src="https://gw.alipayobjects.com/zos/rmsportal/KDpgvguMpGfqaHPjicRK.svg">
  </a>
</p>

<h1 align="center">基于Ant Design 业务组件</h1>

<div align="center">

QueryBar是一个工具条，满足常规条件查询，input/select/DatePicker/DatePickerTime。

</div>



## 📦 安装

```bash
npm install zsm --save
```

```bash
yarn add zsm
```

## 🔨 示例

```jsx
import {QueryBar} from 'zsm';

ReactDOM.render(QueryBar dataSource={this.queryBarData} handleSearch={this.handleSearch} />, mountNode);
```

引入数据：

```jsx
queryBarData = [
    {
      "field": "name",
      "text": '"名称",
      "type": "input",
    },{
      "field": "condition",
      "text": '"状态",
      "type": "select",
      "options": ["关闭", "运行中"]
    },{
      "field": "creatData",
      "text": "创建日期",
      "type": "DatePicker",
    },{
      "field": "creatData",
      "text": "订单时间",
      "type": "DatePickerTime",
    }
    //可多条数据
  ];
```
##  效果

![image](https://i.loli.net/2019/07/22/5d3512c6c20c176485.jpg)

![image](https://i.loli.net/2019/07/22/5d35129d2841959467.jpg)

---
_Source: https://npm.io/package/zsm · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._