wx calendar

WX캘린더

위챗 미니 프로그램 캘린더

 · 年月周日程视图
· 支持skyline和webview渲染
· 支持插件扩展

설계

사용

미니 프로그램 기본 라이브러리 SDKVersion >= 3.0.0

1. 설치

npm i @lspriv/wx-calendar -S

2.빌드

WeChat 애플릿 개발 도구 메뉴 표시줄:工具--> npm 공식 문서构建npm

3. 구성 소개

페이지 또는 전역 구성 파일에서 구성

{
    "usingComponents" : {
        "calendar" : " @lspriv/wx-calendar "
    }
}

4. 페이지 사용량

페이지 wxml 파일에 사용됨

 < calendar id =" calendar " bindload =" handleLoad " /> 

 const { WxCalendar } = require ( '@lspriv/wx-calendar/lib' ) ;
const { LunarPlugin } = require ( '@lspriv/wc-plugin-lunar' ) ;
// 使用农历插件
WxCalendar . use ( LunarPlugin ) ;

Page ( {
  handleLoad ( detail ) {
    conosle . log ( 'calendar load' , detail ) ;
  }
} ) 

중요한

바인드로드 이벤트 이후에 selectComponent('#calendar') 작업을 수행해 주세요.

2차 개발

alpha 브랜치는 제가 작업 중인 브랜치이며 가장 최근에 진행된 브랜치입니다. issue/* 브랜치는 이슈에서 언급된 문제를 해결하기 위한 것입니다. 개발 브랜치는 태그를 지정하기 위해 PR을 마스터에 보내는 것과 같습니다. 당기다.

시작하다

npm install
# 启动，默认skyline配置
npm run dev
# 设置webview
# npm run dev @webview 或者 npm run dev @W 

팩

npm run build

패키지 보내기(미리보기 패키지)

npm run package

메모

이 패키지 전송 명령은 포장, 보내기, 창고로 보내기의 세 부분을 수행하므로 포장 명령을 반복적으로 실행할 필요가 없습니다.

시험

아직 시험이 작성되지 않았는데, 시간이 나면 작성해 주실 수 있나요?

다중 단말기 지원

도넛

개발 도구의 오른쪽 상단 -> 세부 정보 -> 로컬 설정에서 다음 옵션을 활성화해야 합니다.

• SWC를 사용하여 스크립트 파일 컴파일
• worklet 코드 컴파일
• project.miniapp.json에서 활성화된 Android XWeb SDK

유니앱

1. 프로젝트 루트 디렉터리에 wxcomComponents 폴더를 생성하고 dist에 패키지된 파일을 복사한 후 wxcomComponents/wx-calendar/**와 같은 별도의 폴더에 넣습니다.
2. pages.json 의 globalStyle 에서 usingComponents 구성

   {
      "globalStyle" : {
        "wx-calendar" : " /components/wx-calendar "
      } 
   }

주의가 필요한 사항은 UniApp 애플릿 사용자 정의 컴포넌트 지원을 참조하세요.

타로

Taro 使用原生模块를 참조하세요.

메모

Taro 프로젝트가 미니 프로그램의 기본 구성 요소를 참조하는 경우 프로젝트는 더 이상 여러 터미널을 변환할 수 없습니다.

유형 설명

다음 유형 정의가 나타납니다.

 type CalendarDay = {
  year : number ; // 年
  month : number ; // 月
  day : number ; // 日
} ;

소품 속성

다음 속성은 모두 선택사항입니다.

재산	유형	설명하다	기본값
보다	끈	보다	월 [주|일정]
점수	정렬	의제, 배지 및 휴일 마커	[]
떨리다	불리언	날짜 진동 여부를 클릭하세요.	진실
다크모드	불리언	다크 모드(시스템 따르기)	진실
날짜	문자열|숫자	선택한 날짜	xxxx-xx-xx|타임스탬프
주말의 시작	숫자	주의 첫날, 0|1|2|3|4|5|6	0
스타일	끈	테마 스타일 변수 설정	''
세례반	끈	글꼴 설정	''
지역	정렬	사용자 정의 레이아웃 영역	['헤더', '제목', '하위 정보', '오늘', '뷰바', '드래그바']
보기제스처	불리언	슬라이딩 동작으로 뷰를 제어할지 여부	진실
같은체크됨	불리언	선택한 날짜 스타일을 일관되게 유지	거짓
사용자 정의NavBar	불리언	구성 요소가 있는 페이지에 사용자 정의된 탐색 모음이 있는지 여부	진실
정렬 날짜	끈	날짜 정렬(중앙 | 기준선 정렬)	중심 [중심|기준선]
쇼레스트	불리언	이번 달 이외의 날짜 표시 여부	진실

팁

버전 1.7.0+에서는 고정 보기 속성을 제거하고 제스처 제어 속성 viewGesture 추가했습니다. 고정 보기는 더 높은 자유도로 구현됩니다.

뷰를 고정하는 새로운 방법

 <!-- 固定为周视图 -->
<!-- view 默认初始视图 -->
<!-- view-gesture 取消手势控制 -->
<!-- areas 只保留四个区域，将viewbar和dragbar移除 -->
< calendar 
  view =" week "
  view-gesture =" {{ false }} "
  areas =" {{ ['header', 'title', 'subinfo', 'today'] }} "
/> 

팁

속성 marks 정보

 // 标记里的日期，要么输入年月日year｜month｜day，要么输入日期 date
type Mark = {
  year ?: number ; // 年
  month ?: number ; // 月 
  day ?: number ; // 日
  date ?: string | number | Date ; // 日期 yyyy-mm-dd | timestamp | Date
  type : 'schedule' | 'corner' | 'festival' | 'solar' ; // 日程｜角标｜节假日 | 日期文字
  text : string ; // 内容
  style ?: string | Record < string , string | number > ; // 标记样式
}
// 样式标记
type StyleMark = {
  year ?: number ; // 年
  month ?: number ; // 月 
  day ?: number ; // 日
  date ?: string | number | Date ; // 日期 yyyy-mm-dd | timestamp | 
  style : string | Record < string , string | number > ;
}

자막 내용은 한 글자 이내여야 합니다. 한 글자의 위치만 수정되었습니다. 추가로 나오는 글자가 있으면 위치를 직접 조정해 주세요.

중요한

구성 요소가 있는 페이지에 사용자 정의 탐색 모음이 활성화되어 있지 않은 경우 customNavBar 속성을 false

이벤트

bindload 캘린더 로딩 완료

 type LoadEventDetail = {
    checked : CalenderDay ; // 当前选择日期
    view : 'week' | 'month' | 'schedule' ; // 当前视图
    range : [ start : CalenderDay , end : CalenderDay ] ; // 当前渲染的月份范围
}

구성요소 인스턴스 가져오기

 < calendar id =" calendar " bindload =" handleLoad " /> 

 import { CalendarExport } from '@lspriv/wx-calendar/lib' ;

Page ( {
  handleLoad ( ) {
    const calendar = this . selectComponent ( '#calendar' ) as CalendarExport ; 
    // 如果你使用了其他插件，比如 WxCalendar.use(AnyPlugin)，则可以
    // const calendar = ... as CalendarExport<[typeof AnyPlugin]>;
  }
} ) ;

bindclick 날짜 클릭

 type LoadEventDetail = {
    checked : CalenderDay ; // 当前点击日期
    view : 'week' | 'month' | 'schedule' ; // 当前视图
} 

메모

날짜 클릭 이벤트가 필요한 경우 직접 처리해주세요.

bindchange 선택한 날짜 변경

 type ChangeEventDetail = {
    checked : CalenderDay ; // 当前选择日期
    view : 'week' | 'month' | 'schedule' ; // 当前视图
    range : [ start : CalenderDay , end : CalenderDay ] ; // 当前渲染的月份范围
}

bindviewchange 패널 보기 변경

 type ViewChangeEventDetail = {
    checked : CalenderDay ; // 当前选择日期
    view : 'week' | 'month' | 'schedule' ; // 当前视图
}

bindschedule 클릭 일정 트리거

 type ScheduleEventDetail = {
    schedules ?: Array < ScheduleEventDetail > ; // 所有日程
    schedule ?: ScheduleEventDetail ; // 当前点击日程
    all : boolean ; // 是否所有日程
}

행동 양식

checked 날짜

 {
  /**
   * @param date 选中日期
   * yyyy-mm-dd | timestamp | Date | CalendarDay
   */
  ( date : string | number | Date | CalendarDay ) : Promise < void > ;
}

toggleView 스위치 보기

 {
  /**
   * @param [view] 要切换的视图
   * 当view未指定时，会在周月视图之间切换
   */
  ( view ?: 'month' | 'week' | 'schedule' ) : void ;
}

openAnuual 연간 패널을 엽니다

 {
  ( ) : Promise < void > ;
}

getMarks 완전한 날짜 표시를 얻습니다.

 {
  /**
   * @param date 获取日期
   */
  ( date : CalendarDay ) : PluginEntireMarks ;
}

getPlugin 플러그인 인스턴스를 가져옵니다.

 {
  /**
   * @param key 插件的KEY
   */
  ( key : string ) : InstanceType < PluginConstructor > ;
}

updateDates 날짜 데이터를 업데이트합니다.

 {
  /**
   * 若不指定哪些日期更新，默认刷新全部
   */
  ( dates ?: Array < CalendarDay > ) : Promise < void > ;
}

스타일

구성 요소에 스타일 격리가 켜져 있습니다. 글꼴 크기와 색상 번호만 조정할 수 있습니다. 스타일 속성을 전달하여 테마를 조정할 수 있습니다.

. wcc {
    /* 浅色主题 */
    --wc-bg-light : # FFF ; /* 主背景色 */
    --wc-title-color-light : # 333 ; /* 左上角日期标题 */
    --wc-title-sub-color-light : # 7A7A7A ; /* 左上角日期标题的右侧描述 */
    --wc-opt-bg-light : # D9ECFF ; /* 视图控制背景色 */
    --wc-opt-checked-bg-light : # 409EFF ; /* 视图控制按钮背景色 */
    --wc-opt-color-light : # 409EFF ; /* 视图控制字体 */
    --wc-opt-checked-color-light : # FFF ; /* 视图控制选中字体 */
    --wc-week-color-light : # ABABAB ; /* 星期 */
    --wc-date-color-light : # 333 ; /* 日期 */
    --wc-mark-color-light : # ABABAB ; /* 日期下方信息 */
    --wc-dot-color-light : # ABABAB ; /* 日期上方‘･’ */
    --wc-schedule-color-light : # 409EFF ; /* 日程默认 */
    --wc-schedule-bg-light : # EAEEF2 ; /* 日程默认背景 */
    --wc-today-color-light : # 409EFF ; /* 日期（今日） */
    --wc-solar-color-light : # 409EFF ; /* 日期下方信息默认（节气，节假日） */
    --wc-checked-color-light : # 333 ; /* 被选日期 */
    --wc-checked-mark-color-light : # ABABAB ; /* 被选日期下方信息 */
    --wc-checked-dot-color-light : # ABABAB ; /* 被选日期上方‘･’ */
    --wc-checked-today-color-light : # FFF ; /* 被选日期（今日） */
    --wc-checked-bg-light : # F5F5F5 ; /* 被选日期背景圆圈 */
    --wc-checked-today-bg-light : # 409EFF ; /* 被选日期背景圆圈（今日） */
    --wc-control-bg-light : # DFDFDF ; /* 底部控制条背景 */
    --wc-annual-bg-light : # FFF ; /* 年面板背景 */
    --wc-annual-title-color-light : # 333 ; /* 年面板左上角标题 */
    --wc-annual-title-sub-color-light : # 7A7A7A ; /* 年面板左上角标题右侧信息 */

    /* 深色主题，以下和浅色主题一一对应 */
    --wc-bg-dark : # 000 ;
    --wc-title-color-dark : # E5E5E5 ;
    --wc-title-sub-color-dark : # 7A7A7A ;
    --wc-opt-bg-dark : # 332D2D80 ;
    --wc-opt-checked-bg-dark : # 409EFF ;
    --wc-opt-color-dark : # 409EFF ;
    --wc-opt-checked-color-dark : # FFF ;
    --wc-week-color-dark : # ABABAB ;
    --wc-date-color-dark : # E5E5E5 ;
    --wc-mark-color-dark : # 5F5F5F ;
    --wc-dot-color-dark : # ABABAB ;
    --wc-schedule-color-dark : # 66B1FF ;
    --wc-schedule-bg-dark : # 332D2D80 ;
    --wc-today-color-dark : # 409EFF ;
    --wc-solar-color-dark : # 409EFF ;
    --wc-checked-color-dark : # E5E5E5 ;
    --wc-checked-mark-color-dark : # 5F5F5F ;
    --wc-checked-dot-color-dark : # ABABAB ;
    --wc-checked-today-color-dark : # E5E5E5 ;
    --wc-checked-bg-dark : # 262626 ;
    --wc-checked-today-bg-dark : # 409EFF ;
    --wc-control-bg-dark : # 262626 ;
    --wc-annual-bg-dark : # 000 ;
    --wc-annual-title-color-dark : # E5E5E5 ;
    --wc-annual-title-sub-color-dark : # 3F3F3F ;

    /** 字号 */
    --wc-title-size : 46 rpx ; /** 左上角日期标题字号 */ 
    --wc-title-sub-size : 20 rpx ; /** 左上角日期标题右侧描述信息字号 */ 
    --wc-operator-size : 22 rpx ; /** 视图控制按钮字号 */ 
    --wc-week-size : 20 rpx ; /** 星期字号 */ 
    --wc-date-size : 36 rpx ; /** 日期字体字号 */ 
    --wc-mark-size : 20 rpx ; /** 日期下方信息字体字号 */ 
    --wc-corner-size : 16 rpx ; /** 日期角标字体字号 */ 
    --wc-schedule-size : 16 rpx ; /** 日程字体字号 */ 
    --wc-annual-title-size : 50 rpx ; /** 年面板左上角年份标题字体字号 */ 
    --wc-annual-title-sub-size : 18 rpx ; /** 年面板左上角年份标题右侧信息字体字号 */ 
}

스타일 수정

 < calendar style =" --wc-bg-light: #000; " />

유형 검사

미니 프로그램의 npm 구성의 특수성으로 인해 이 구성 요소는 순수한 js 라이브러리가 아닙니다. 올바른 유형 프롬프트를 얻으려면 루트 디렉터리에 있는 jsconfig.json 또는 tsconfig.json 파일에 경로를 지정해야 합니다. 미니 프로그램.

{
  "compilerOptions" : {
    "paths" : {
      "@lspriv/wx-calendar/*" : [
          " ./node_modules/@lspriv/wx-calendar/dist/* "
        ]
    }
  }
}

플러그인

플러그인 사용법

 const { WxCalendar } = require ( '@lspriv/wx-calendar/lib' ) ;
const { YourPlugin } = require ( 'anywhere' ) ;

// WxCalendar.clearPlugin(); 清理预设插件

WxCalendar . use ( YourPlugin , options ) ; // options 插件选项

Component ( {
    ...
} ) 

플러그인 개발

기본 부분

 import { Plugin } from '@lspriv/wx-calendar/lib' ;

class MyPlugin implements Plugin {
  /**
   * 插件的 KEY 是必须的，没有此插件会被过滤掉
   */
  static KEY = 'my-plugin' as const ;

  /**
   * 构造函数，参数为用户传入的插件选项。
   * 此构造器可选择实现，如果没有提供选项配置或是其他初始化过程的话。
   */
  constructor ( options ?: Record < string , any > ) {
    // options 引入时的插件选项
  }
} 

수명주기

attached detacched 로 created 달력 구성 요소의 세 가지 수명 주기 후크를 등록합니다.

 import { Plugin , PluginService , CalendarData } from '@lspriv/wx-calendar/lib' ;

class MyPlugin implements Plugin {

  /**
   * 插件初始化，可选择实现该方法
   * 在日历组件 created 阶段最后，在插件实例化后
   * @param service PliginService实例
   */
  PLUGIN_INITIALIZE ( service : PluginService ) : void {
    // 获取日历组件实例
    const component = service . component ;
  }

  /**
   * 组件挂载，可选择实现该方法
   * 在日历组件 attached 阶段中，此时组件的所有工具类已完成实例化，视图数据即将更新。
   * 你可以在此方法里修改视图更新数据 sets，还可以调整一些工具实例的初始值。
   * @param service PliginService实例
   * @param sets 视图数据
   */
  PLUGIN_ON_ATTACH ( service : PluginService , sets : Partial < CalendarData > ) : void {

  }

  /**
   * 组件销毁，可选择实现该方法
   * 在日历组件 detacched 阶段中
   * @param service PliginService实例
   */
  PLUGIN_ON_DETACHED ( service : PluginService ) : void {

  }
} 

데이터 마크업

수정 및 삭제 날짜 스탬프를 추가하고 보충 일정 데이터를 완성합니다.

 import { 
  Plugin , 
  WcYear , 
  CalendarDay , 
  TrackDateResult , 
  TrackYearResult , 
  WcScheduleInfo ,
  getMarkKey , 
  getAnnualMarkKey 
} from '@lspriv/wx-calendar/lib' ;

class MyPlugin implements Plugin {
  /**
   * 捕获日期，可选择实现该方法
   * 在此添加修改和删除【周/月/日程视图面板】的日期标记
   * @param date 日期
   */
  PLUGIN_TRACK_DATE ( date : CalendarDay ) : TrackDateResult | null {
    // do something...
    return {
      schedule : [ { text : '' , color : '' , bgColor : '' , key : getMarkKey ( 'id' , MyPlugin . KEY ) } ] , // 设置日程数组，可选
      corner : { text : '' , color : '' } , // 设置角标，可选
      festival : { text : '' , color : '' } , // 设置节假日，可选
      style : { backgroundColor : '' , color : '' } // 设置日期样式，也可传字符串形式（如 'background-color: #409EFF;color: #fff;'），可选
    } ;
  } ;

  /**
   * 捕获年份，可选择实现该方法
   * 在此添加修改和删除【年面板】的日期标记
   * @param year 年
   */
  PLUGIN_TRACK_YEAR ( year : WcYear ) : TrackYearResult | null {
    // do something...

    return {
      subinfo : [
        { text : '乙巳蛇年' , color : '#F56C6C' } ,
        { text : '农历初一' , color : '#409EFF' }
      ] , 
      marks : new Map ( [
        [ getAnnualMarkKey ( { month : 10 , day : 6 } ) , { rwtype : 'rest' } ] , // 休息日，置灰
        [ getAnnualMarkKey ( { month : 10 , day : 7 } ) , { rwtype : 'work' } ] , // 工作日，正常
        [ getAnnualMarkKey ( { month : 10 , day : 12 } ) , { sub : '#F56C6C' } ] // 自定义颜色下标
        [ getAnnualMarkKey ( { month : 10 , day : 20 } ) , { 
          style : {
            color : { light : '#fff' , dark : '#000' } , // 日期字体颜色, light浅色模式下，dark深色模式下
            bgColor : { light : '#409EFF' , dark : '#409EFF' } , // 日期背景颜色
            opacity : { light : 1 , dark : 1 } , // 不支持 0
            bgTLRadius : { light : 50 , dark : 50 } , // 日期背景左上圆角半径
            bgTRRadius : { light : 0 , dark : 0 } , // 日期背景右上圆角半径
            bgBLRadius : { light : 0 , dark : 0 } , // 日期背景左下圆角半径
            bgBRRadius : { light : 50 , dark : 50 } , // 日期背景右下圆角半径
            bgWidth : { light : 'dateCol' , dark : 'dateCol' } // 日期背景宽度，deteCol为列宽
          } 
        } ]
      ] )
    }
  } ;

  /**
   * 捕获日程信息（点击日程时执行），可选择实现该方法
   * @param date 日期
   * @param id 插件内标记, 由 getMarkKey 生成 key 时传入的 id，详见 PLUGIN_TRACK_DATE
   */
  PLUGIN_TRACK_SCHEDULE ( date : CalendarDay , id :? string ) : WcScheduleInfo {

  }
} 

모션 캡처

작업이 완료되었지만 캘린더 구성 요소의 기본 동작 이전에 사용자의 동작 동작을 캡처합니다.

 import { Plugin , PluginService , EventIntercept } from '@lspriv/wx-calendar/lib' ;

class MyPlugin implements Plugin {

  /**
   * 拦截日期点击动作，可选择实现该方法
   * @param service PliginService实例
   * @param event 事件参数
   * @param intercept 拦截器
   */
  PLUGIN_CATCH_TAP ( service : PluginService , event : TouchEvent , intercept : EventIntercept ) : void {
     // 获取日历组件实例
    const component = service . component ;
    // 若不想事件继续传播
    if ( ... ) intercept ( ) ;
    // intercept(0) 直接退出 
    // intercept(1) 继续向其他插件传播，但不会执行日历组件默认行为
  }

  /**
   * 拦截日期跳转动作（如跳转到今日或者调用toDate方法），可选择实现该方法
   * @param service PliginService实例
   * @param date 要跳转的日期
   * @param intercept 拦截器
   */
  PLUGIN_CATCH_MANUAL ( service : PluginService , date : CalendarDay , intercept : EventIntercept ) : void { }
} 

메모

이 달력 통계에는 7가지 주요 작업이 있습니다. 현재 날짜 클릭 작업과 날짜 이동 작업만 캡처됩니다.

• 날짜 클릭
• 날짜 점프(오늘 버튼을 클릭하여 오늘로 점프하거나 toDate 메소드 호출)
• 헤더 제목을 클릭하세요(연도 패널 열기).
• 보기 버튼 클릭(버튼으로 보기 전환)
• 수직 제스처 슬라이딩(제스처 전환 보기)
• 수평 제스처 스와이프(스와이프 슬라이딩 슬라이더)
• 연도 패널에서 월을 클릭합니다(메인 패널이 특정 달로 이동합니다).

사고 대응

캘린더 구성요소 이벤트 load 에 응답하여 viewChange change click .

 import { Plugin , PluginService , CalendarEventDetail , OnceEmiter } from '@lspriv/wx-calendar/lib' ;

class MyPlugin implements Plugin {

  /**
   * 日历加载完成，可选择实现该方法
   * @param service PliginService实例
   * @param detail 响应数据
   * @param emiter 事件触发器
   */
  PLUGIN_ON_LOAD ( service : PluginService , detail : CalendarEventDetail , emiter : OnceEmiter ) : void {
    // 获取日历组件实例
    const component = service . component ;

    emiter . cancel ( ) ; // 取消日历组件触发 bindload 事件。
    // emiter.emit(detail); 劫持触发 bindload 事件，和 emiter.cancel 只能二选一。
  }

   /**
   * 日期点击事件，可选择实现该方法
   * @param service PliginService实例
   * @param detail 响应数据
   * @param emiter 事件触发器
   */
  PLUGIN_ON_CLICK ( service : PluginService , detail : CalendarEventDetail , emiter : OnceEmiter ) : void {
    
  }

   /**
   * 日期选中变化，可选择实现该方法
   * @param service PliginService实例
   * @param detail 响应数据
   * @param emiter 事件触发器
   */
  PLUGIN_ON_CHANGE ( service : PluginService , detail : CalendarEventDetail , emiter : OnceEmiter ) : void {
    
  }

  /**
   * 视图变化，可选择实现该方法
   * @param service PliginService实例
   * @param detail 响应数据
   * @param emiter 事件触发器
   */
  PLUGIN_ON_VIEWCHANGE ( service : PluginService , detail : CalendarEventDetail , emiter : OnceEmiter ) : void {

  }
} 

다른

 import { Plugin , CalendarDay , PluginService , DateRange } from '@lspriv/wx-calendar/lib' ;

class MyPlugin implements Plugin {
  /**
   * 日期过滤器（提供给其他组件调用的），可选择实现该方法
   * @param service PliginService实例
   * @param dates 待过滤的日期数组
   */
  PLUGIN_DATES_FILTER ( service : PluginService , dates : Array < CalendarDay | DateRange > ) : Array < Calendar | DateRange > {
     // 获取日历组件实例
    const component = service . component ;

    return [
      [ { year : 2024 , month : 6 , day : 1 } , { year : 2024 , month : 6 , day : 28 } ] , // 日期范围
      { year : 2024 , month : 7 , day : 1 } // 单点日期
    ]
  }
} 

플러그인 설명

• 数据标记후 도입된 플러그인 데이터는 먼저 도입된 플러그인 데이터를 덮어씁니다.
• 动作捕捉이후 처음 도입된 실행
• 플러그인이 소개된 순서대로 이벤트响应事件. 먼저 소개된 플러그인이 먼저 응답합니다.

완성된 플러그인

• @lspriv/wc-plugin-lunar 음력 달력 플러그인
• @lspriv/wc-plugin-disabled 캘린더 비활성화 플러그인
• @lspriv/wc-plugin-다중 달력 다중 선택 플러그인
• @lspriv/wc-plugin-ics ICS 캘린더 구독 플러그인
• 로캘 현지화 플러그인

~에 대한

有任何问题或是需求请到 `Issues` 面板提交
忙的时候还请见谅
有兴趣开发维护的道友加微信