|
@@ -0,0 +1,152 @@
|
|
|
+import { DateDialogOptions } from '../PickerDateTimeHelper'
|
|
|
+import { ToolsHelper } from '../ToolsHelper'
|
|
|
+
|
|
|
+
|
|
|
+@Component
|
|
|
+export struct DatePickerView {
|
|
|
+ @Prop option: DateDialogOptions | undefined = undefined
|
|
|
+ @Prop dialogTag: string | undefined = undefined
|
|
|
+ //年份相关
|
|
|
+ @State startYear: number = 1970
|
|
|
+ @State endYear: number = 1970
|
|
|
+ @State currentYear: number = 0
|
|
|
+ @State years: string[] = []
|
|
|
+ // 月份相关
|
|
|
+ @State startMonth: number = 1
|
|
|
+ @State endMonth: number = 12
|
|
|
+ @State currentMonth: number = 0
|
|
|
+ @State months: string[] = []
|
|
|
+ // day相关
|
|
|
+ @State startDay: number = 1
|
|
|
+ @State endDay: number = 30
|
|
|
+ @State currentDay: number = -1
|
|
|
+ @State days: string[] = []
|
|
|
+
|
|
|
+ aboutToAppear(): void {
|
|
|
+ if (!this.option?.type) {
|
|
|
+ this.option!.type = 'YYYY-MM-DD'
|
|
|
+ }
|
|
|
+ if (this.option!.type.indexOf('YYYY') > -1) {
|
|
|
+ if (this.option?.startDate) {
|
|
|
+ this.startYear = Number.parseInt(this.option.startDate?.split('-')[0])
|
|
|
+ }
|
|
|
+ if (this.option?.endDate) {
|
|
|
+ this.endYear = Number.parseInt(this.option.endDate?.split('-')[0])
|
|
|
+ } else {
|
|
|
+ this.endYear = new Date().getFullYear() + 10
|
|
|
+ }
|
|
|
+ this.years = []
|
|
|
+ for (let index = this.startYear; index <= this.endYear; index++) {
|
|
|
+ this.years.push(index.toString())
|
|
|
+ }
|
|
|
+ if (this.option?.currentDate) {
|
|
|
+ const cy = this.option.currentDate?.split('-')[0]
|
|
|
+ this.currentYear = this.years.indexOf(cy)
|
|
|
+ } else {
|
|
|
+ this.currentYear = this.years.indexOf(new Date().getFullYear().toString())
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.checkMonth()
|
|
|
+ this.checkDays()
|
|
|
+ }
|
|
|
+
|
|
|
+ checkMonth() {
|
|
|
+ if (this.option!.type!.indexOf('MM') > -1) {
|
|
|
+ if (this.option?.startDate) {
|
|
|
+ this.startMonth = Number.parseInt(this.option.startDate?.split('-')[1])
|
|
|
+ }
|
|
|
+ if (this.option?.endDate) {
|
|
|
+ this.endMonth = Number.parseInt(this.option.endDate?.split('-')[1])
|
|
|
+ } else {
|
|
|
+ this.endMonth = 12
|
|
|
+ }
|
|
|
+ if (this.endMonth > 12) {
|
|
|
+ this.endMonth = 12
|
|
|
+ }
|
|
|
+ if (this.endMonth < 1) {
|
|
|
+ this.endMonth = 1
|
|
|
+ }
|
|
|
+ this.months = []
|
|
|
+ for (let index = this.startMonth; index <= this.endMonth; index++) {
|
|
|
+ this.months.push(index.toString())
|
|
|
+ }
|
|
|
+ if (this.option?.currentDate) {
|
|
|
+ const cy = this.option.currentDate?.split('-')[1]
|
|
|
+ this.currentMonth = this.months.indexOf(cy)
|
|
|
+ } else {
|
|
|
+ this.currentMonth = this.months.indexOf((new Date().getMonth() + 1).toString())
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ checkDays() {
|
|
|
+ if (this.option!.type!.indexOf('DD') > -1) {
|
|
|
+ if (this.option?.startDate) {
|
|
|
+ this.startDay = Number.parseInt(this.option.startDate?.split('-')[2])
|
|
|
+ }
|
|
|
+ const d = new Date(this.currentYear, this.currentMonth + 1, 0).getDate()
|
|
|
+ if (this.option?.endDate) {
|
|
|
+ this.endDay = Number.parseInt(this.option.endDate?.split('-')[2])
|
|
|
+ } else {
|
|
|
+ this.endDay = d
|
|
|
+ }
|
|
|
+ if (this.endDay > d) {
|
|
|
+ this.endDay = d
|
|
|
+ }
|
|
|
+ if (this.endDay < 1) {
|
|
|
+ this.endDay = 1
|
|
|
+ }
|
|
|
+ this.days = []
|
|
|
+ for (let index = this.startDay; index <= this.endDay; index++) {
|
|
|
+ this.days.push(index.toString())
|
|
|
+ }
|
|
|
+ if (this.currentDay === -1) {
|
|
|
+ if (this.option?.currentDate) {
|
|
|
+ const cy = this.option.currentDate?.split('-')[2]
|
|
|
+ this.currentDay = this.days.indexOf(cy)
|
|
|
+ } else {
|
|
|
+ this.currentDay = this.days.indexOf((new Date().getDate()).toString())
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ if (this.currentDay > this.days.length - 1) {
|
|
|
+ this.currentDay = this.days.length - 1
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ build() {
|
|
|
+ Column() {
|
|
|
+ Row() {
|
|
|
+ Text('取消').fontSize(17).fontColor('#333333').onClick(() => {
|
|
|
+ this.option?.onCancel?.()
|
|
|
+ ToolsHelper.closeCustomDialog(this.dialogTag!)
|
|
|
+ })
|
|
|
+ Text('确定').fontSize(17).fontColor('#18ABFB').onClick(() => {
|
|
|
+ this.option?.onConfirm?.(this.option!.type!.replace('YYYY', this.years[this.currentYear])
|
|
|
+ .replace('MM', this.months[this.currentMonth])
|
|
|
+ .replace('DD', this.days[this.currentDay])
|
|
|
+ )
|
|
|
+ ToolsHelper.closeCustomDialog(this.dialogTag!)
|
|
|
+ })
|
|
|
+ }.alignItems(VerticalAlign.Center)
|
|
|
+ .justifyContent(FlexAlign.SpaceBetween)
|
|
|
+ .width('100%')
|
|
|
+ .padding(15)
|
|
|
+
|
|
|
+ Row() {
|
|
|
+ TextPicker({ range: this.years, selected: $$this.currentYear })
|
|
|
+ .onChange((value: string | string[], index: number | number[]) => {
|
|
|
+ this.checkDays()
|
|
|
+ }).canLoop(false)
|
|
|
+ TextPicker({ range: this.months, selected: $$this.currentMonth })
|
|
|
+ .onChange((value: string | string[], index: number | number[]) => {
|
|
|
+ this.checkDays()
|
|
|
+ }).canLoop(false)
|
|
|
+ TextPicker({ range: this.days, selected: $$this.currentDay })
|
|
|
+
|
|
|
+ }.width('100%').justifyContent(FlexAlign.Center).alignItems(VerticalAlign.Center)
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+}
|