季度选择器quarter-picker

实现步骤：

1、季度选择器组件

2、引入季度选择器组件

import QuarterPicker from "../../../components/quarter-picker/index";

3、注册季度选择器组件

components: { QuarterPicker },

4、使用季度选择器组件

"季度" align="center" width="150px">
        
      

通过other-data属性将scope.row传递到子组件，通过change-value将saveQuarter方法传递到子组件，然后在子组件中调用saveQuarter方法。

其中saveQuarter方法如下：

saveQuarter(value, row) {
        const data = {
          id: row.id,
          start: value[0], // 季度开始日期
          end: value[1]    // 季度结束日期
        };
        inAPI.saveOrUpdateQuarter(data).then(response => {
          if (response.success) {
            this.$message.success(response.msg);
          }
        });
      },

后台可以使用NVARCHAR2存储季度，长度为6，格式为：年度-季度，如2022-1，2022-2，2022-3，2022-4

将季度开始时间转化为季度的方法：

private String toQuarter(String start) {
        String[] arr = start.split("-");
        String year = arr[0];
        String month = arr[1];
        int q = Integer.parseInt(month) / 3 + 1;
        return year + "-" + q;
    }

将季度转成季度开始日期和季度结束日期的方法：

    private List toRange(String quarter) {
        List result = new ArrayList<>();
        String[] arr = quarter.split("-");
        String year = arr[0];
        String q = arr[1];
        switch (q) {
            case "1":
                result.add(year + "-01-01");
                result.add(year + "-03-31");
                break;
            case "2":
                result.add(year + "-04-01");
                result.add(year + "-06-30");
                break;
            case "3":
                result.add(year + "-07-01");
                result.add(year + "-09-30");
                break;
            case "4":
                result.add(year + "-10-01");
                result.add(year + "-12-31");
                break;
        }
        return result;
    }