# fk-date-picker

> for the fxxking date picker

Latest version **1.0.5** (published 2021-11-19) · ISC license · 0 weekly downloads

## Install

```sh
npm install fk-date-picker
pnpm add fk-date-picker
yarn add fk-date-picker
bun add fk-date-picker
```

## 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.5 |
| Published | 2021-11-19 |
| First published | 2021-09-28 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | none |
| Module format | CommonJS |
| Node | >= 6.0.0 |
| Dependencies | 6 |
| Unpacked size | 136.1 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | laisf |
| Maintainers | unclemeric |
| Keywords | element-ui, date-picker |

## Links

- npm: https://www.npmjs.com/package/fk-date-picker
- npm.io page: https://npm.io/package/fk-date-picker

## Dependencies (6)

- [deepmerge](https://npm.io/package/deepmerge.md) ^1.2.0
- [async-validator](https://npm.io/package/async-validator.md) ~1.8.1
- [normalize-wheel](https://npm.io/package/normalize-wheel.md) ^1.0.1
- [throttle-debounce](https://npm.io/package/throttle-debounce.md) ^1.0.1
- [resize-observer-polyfill](https://npm.io/package/resize-observer-polyfill.md) ^1.5.0
- [babel-helper-vue-jsx-merge-props](https://npm.io/package/babel-helper-vue-jsx-merge-props.md) ^2.0.0

## Recent versions

- 1.0.5 (latest) — 2021-11-19
- 1.0.4 — 2021-11-19
- 1.0.3 — 2021-10-09
- 1.0.2 — 2021-10-09
- 1.0.1 — 2021-09-28
- 1.0.0 — 2021-09-28

## README

# fk-date-picker


<p align="center">
  <a href="https://www.npmjs.org/package/fk-date-picker">
    <img src="https://img.shields.io/npm/v/fk-date-picker.svg">
  </a>
</p>

> 基于element-ui的el-data-picker组件，针对公司选择区间日期习惯，调整操作风格。默认选择日期需要点击确定按钮关闭。

## Install
`npm install fk-data-picker -S`

`yarn add fk-data-picker`

## Quick Start

```js
import Vue from 'vue'
import FkDatePciker from 'fk-data-picker'

Vue.use(FkDatePciker)
```

## Description

原来element-ui表格属性都继承支持，合并表格用到的属性如下

|    参数          | 说明                | 类型          |可选值    | 默认 |
| :------------   | -------------------  | :---:          |:-----:  |:--:|
|`auto-confirm`     | 选择日期后是否自动确认关闭  |  `boolean`     |   |  false  |
|`unlink-panels`     | 原有属性，在范围选择器里取消两个日期面板之间的联动  |`boolean`|   |      |

## Examples

#### 普通分组

> unlink-panels和auto-confirm 属性

![](attachment/date-range.png)
![](attachment/month-range.png)

<details>
  <summary>unlink-panels和auto-confirm使用</summary>

```vue
    <fk-date-picker
      v-model="value1"
      type="daterange"
      range-separator="至"
      :unlink-panels="disabled"
      auto-confirm
      :picker-options="pickerOptions"
      start-placeholder="开始日期"
      end-placeholder="结束日期">
    </fk-date-picker>

  <fk-date-picker
      v-model="value1"
      type="monthrange"
      range-separator="至"
      :unlinkPanels="disabled"
      :picker-options="pickerOptions"
      start-placeholder="开始日期"
      end-placeholder="结束日期">
    </fk-date-picker>



  export default {
    data() {
      const that = this;
      return {
        value1: null,
        disabled: true,
        pickerOptions: {
          onPick({ maxDate, minDate }) {
            that.disabled = !(maxDate && minDate);
          }
        }
      };
    },
  }
```

</details>

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