vue 账期 - 季度或者半年类型的时间（区间）选择组件

引言

需求如文章标题，查阅资料发现 element-ui 并没有做支持这样类型的时间选择器的打算，所以只能手动造轮子。

组件经过一次改版，之前无法进行默认值的设置，后来改造之后，采用双向数据绑定驱动 组件 => 页面；页面 => 组件 的方式。

具备功能：默认时间、时间类型（可选）、是否区间（可选）。

正文

1. 演示效果

账期 - 季度或者半年类型的时间选择组件 - 区间.gif

账期 - 季度或者半年类型的时间选择组件 - 非区间.gif

2. 源码

• 组件 QuarterOrHalfyear.vue

上面代码引用的外部依赖有：lodash-es moment

因为我们的业务需求，需要拼接数据格式为 2021Q1 2021H1，所以 时间类型字典 typeDictionary 是源码中这样定义的，这个可以根据业务需求自行更改。