# vue_calendar_select

> select start_date and end_date in datepicker

Latest version **1.1.7** (published 2018-06-26) · MIT license · 0 weekly downloads

## Install

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

## 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.1.7 |
| Published | 2018-06-26 |
| First published | 2017-11-02 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Node | >= 4.0.0 |
| Dependencies | 1 |
| Unpacked size | 44.7 KB |
| Known vulnerabilities | 0 (+1 in 1 direct dependencies) |
| Install scripts | no |
| GitHub stars | 1 |
| Author | Sheng |
| Maintainers | sheng_yu |

## Links

- npm: https://www.npmjs.com/package/vue_calendar_select
- Repository: https://github.com/Shenglian/vue_calendar_select
- Homepage: https://github.com/Shenglian/vue_calendar_select#readme
- Issues: https://github.com/Shenglian/vue_calendar_select/issues
- npm.io page: https://npm.io/package/vue_calendar_select

## Dependencies (1)

- [vue](https://npm.io/package/vue.md) ^2.5.2

## Recent versions

- 1.1.7 (latest) — 2018-06-26
- 1.1.6 — 2017-12-29
- 1.1.5 — 2017-12-21
- 1.1.4 — 2017-12-21
- 1.1.3 — 2017-12-18
- 1.1.2 — 2017-12-18
- 1.1.1 — 2017-12-18
- 1.1.0 — 2017-12-18
- 1.0.9 — 2017-11-03
- 1.0.8 — 2017-11-03
- 1.0.7 — 2017-11-03
- 1.0.6 — 2017-11-02
- 1.0.4 — 2017-11-02
- 1.0.3 — 2017-11-02
- 1.0.2 — 2017-11-02
- … 2 more at https://npm.io/package/vue_calendar_select/versions

## README

# vue_calendar_select

> select start_date and end_date in datepicker

## Install

``` bash
$ npm install vue_calendar_select --save
```
## Usage

*setLimitDays* prop if passed should be a [YYYY/MM/DD, YYYY/MM/DD]
``` html
<script>
  const setLimitDays = ['2017/01/01', '2017/12/31'];
</script>
<CalendarSelect :setLimitDays="setLimitDays"></CalendarSelect>
```

*setCurrentDays* prop if passed should be a [YYYY/MM/DD, YYYY/MM/DD]
``` html
<script>
  const setCurrentDays = ['2017/01/01', '2017/12/31'];
</script>
<CalendarSelect :setCurrentDays="setCurrentDays"></CalendarSelect>
```

*datepickerStatus* prop if pass 'disable', datepicker will disable and get to disable class style
``` html
<script>
  const datepickerStatus = 'disable';
</script>
<CalendarSelect :datepickerStatus="datepickerStatus"></CalendarSelect>
```

Emits events, receive startDate and endDate value from inside
``` html
<CalendarSelect @sendDate="receiveDate"></CalendarSelect>
<script>
  function receiveDate({startDay, endDay} = {}){
    console.log(`startDay: ${startDay}`);
    console.log(`endDay: ${endDay}`);
  }
</script>
```

## Available props

| Prop                    | Type            | Default                   | Description                                        |
|-------------------------|-----------------|---------------------------|----------------------------------------------------|
| setLimitDays            | Array           | '', ''                    | set limit start day and end day                    |
| setCurrentDays          | Array           | '', ''                    | set current start day and end day                  |
| datepickerStatus        | String          | ''                        | set 'disable' prop for disable datepicker          |

## Events

These events are emitted on actions in the datepicker

| Event             | Output            | Description                                  |
|-------------------|-------------------|----------------------------------------------|
| sendDate          | startDay, endDay  | get current startDay and endDay value        |

## Log

#### 2017/12/18
1. remove `placeholderTextStartDay`, `placeholderTextEndDay` props.
2. add `datepickerStatus` prop.
3. It world change datepicker by year on double arrow button.

#### 2017/12/20
1. change prop `setDays` to `setLimitDays`
2. add `setCurrentDays` prop.

#### 2017/12/29
1. remove component default value in setLimitDays and setCurrentDays

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