https://github.com/happytodev/vuejs-weekpicker

A simple weekpicker component for vuejs
https://github.com/happytodev/vuejs-weekpicker

Last synced: about 2 months ago
JSON representation

A simple weekpicker component for vuejs

• Host: GitHub
• URL: https://github.com/happytodev/vuejs-weekpicker
• Owner: happytodev
• Created: 2019-04-10T13:07:58.000Z (almost 6 years ago)
• Default Branch: master
• Last Pushed: 2019-04-14T20:31:30.000Z (almost 6 years ago)
• Last Synced: 2024-05-01T21:40:49.148Z (9 months ago)
• Language: Vue
• Size: 344 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# vuejs-weekpicker

This is a vue.js weekpicker component. It implements Vuex to share datas with other components or parent app.

Shared datas  are :

- Year

- Week number

- From and to infos corresponding to year and week choosed by user

Here is what this component looks like

![vuejs-weekpicker](https://user-images.githubusercontent.com/425998/56010974-fe95b100-5ce5-11e9-8136-180d7535e352.png)

## How to configure it

In your main file app.js, add these lines :

```

import WeekPicker from 'vuejs-weekpicker'

import store from './store/store'

Vue.use(WeekPicker)

Vue.config.productionTip = false

```

In your new Vue instance, add call to store : 

```

new Vue({

  store,

  render: h => h(App)

}).$mount('#app')

```

In your src folder add a folder named 'store'.

In this folder add a file store.js

In this file, you can copy the code you can found [here](https://github.com/itanea/vuejs-weekpicker/blob/master/src/store/store.js)

## How to use it 

Just call the week-picker tag :

```

```

or like this 

```

```

By default, the locale is english 'en'

You can change the locale with this syntax :

```

```

For now, only english and french are supported.

Nota : param week-picker-locale is not required.

## Roadmap

To do list for this component :

- [X] Add under week selector the from date and to date. Example : for the week 2019/15, the result will be 'From 20190408 To 20190414'

- [ ] Add ability to hide from/to information

- [X] Add VueX implementation to help to communicate with parent and others components

- [ ] Add ability to change component color to match with others components

## Changelog

- 20190414 v0.3.2 Fix #1 From / to does not appears at page loading

- 20190414 v0.3.0 Add Vuex implementation

- 20190412 v0.2.0 Add 'from/to' functionnality

- 20190412 v0.1.8 First functionnal version