|
@@ -0,0 +1,69 @@
|
|
|
|
|
+import { DiaLogSheetControl, YTAvoid } from "basic"
|
|
|
|
|
+import { CustomTextStyle } from "../style/CustomTextStyle"
|
|
|
|
|
+
|
|
|
|
|
+@ComponentV2
|
|
|
|
|
+export struct AppointmentTimeComp {
|
|
|
|
|
+ @Param @Require control: DiaLogSheetControl
|
|
|
|
|
+
|
|
|
|
|
+
|
|
|
|
|
+ @Local selectDay: number = 0
|
|
|
|
|
+ @Local selectTime: number = 0
|
|
|
|
|
+ safeBottom: number = AppStorage.get(YTAvoid.SAFE_BOTTOM_KEY) as number
|
|
|
|
|
+
|
|
|
|
|
+ // 选择时间
|
|
|
|
|
+ onselectTime(index: number){
|
|
|
|
|
+ this.selectTime = index
|
|
|
|
|
+ this.control._onBackPress()
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ build() {
|
|
|
|
|
+ Column(){
|
|
|
|
|
+ Row(){
|
|
|
|
|
+ Text('期望上门时间')
|
|
|
|
|
+ .attributeModifier(new CustomTextStyle({size: 16, weight: 500, color: '#FF333333'}))
|
|
|
|
|
+
|
|
|
|
|
+ Image($r('[basic].media.icon_close'))
|
|
|
|
|
+ .width(22)
|
|
|
|
|
+ .aspectRatio(1)
|
|
|
|
|
+ }.width('100%')
|
|
|
|
|
+ .padding(15)
|
|
|
|
|
+ .justifyContent(FlexAlign.SpaceBetween)
|
|
|
|
|
+ .border({ width: { bottom: 1 }, color: '#F7F9FA' })
|
|
|
|
|
+
|
|
|
|
|
+ Row(){
|
|
|
|
|
+ // 今天 or 明天
|
|
|
|
|
+ Column(){
|
|
|
|
|
+ ForEach(['今天', '明天'], (item: string, index) => {
|
|
|
|
|
+ Text(item)
|
|
|
|
|
+ .padding({left: 27, top: 14, right: 27, bottom: 14})
|
|
|
|
|
+ .backgroundColor(this.selectDay == index ? Color.White : Color.Transparent)
|
|
|
|
|
+ .attributeModifier(new CustomTextStyle({size: 18, weight: 500, color: '#FF333333'}))
|
|
|
|
|
+ .onClick(() => { this.selectDay = index })
|
|
|
|
|
+ })
|
|
|
|
|
+ }.height('100%')
|
|
|
|
|
+ .backgroundColor('#F7F9FA')
|
|
|
|
|
+ .justifyContent(FlexAlign.Start)
|
|
|
|
|
+
|
|
|
|
|
+ //
|
|
|
|
|
+ List(){
|
|
|
|
|
+ ForEach(['8:00-9:00', '9:00-10:00', '10:00-11:00', '11:00-12:00', '13:00-16:00', '16:00-18:00'], (item: string, index) => {
|
|
|
|
|
+ ListItem(){
|
|
|
|
|
+ Row(){
|
|
|
|
|
+ Text(item)
|
|
|
|
|
+ .attributeModifier(new CustomTextStyle({ size: 15, weight: 400, color: this.selectTime == index ? '#FFFDB818' : '#FF333333' }))
|
|
|
|
|
+ }.justifyContent(FlexAlign.Start)
|
|
|
|
|
+ .padding({left: 20, top: 14, right: 20, bottom: 14})
|
|
|
|
|
+ .onClick(() => { this.selectTime = index })
|
|
|
|
|
+ }
|
|
|
|
|
+ })
|
|
|
|
|
+ }.height('100%')
|
|
|
|
|
+ .width('100%')
|
|
|
|
|
+ .divider({ strokeWidth: 1, color: '#F7F9FA', startMargin: 20, endMargin: 20 })
|
|
|
|
|
+ }.width('100%')
|
|
|
|
|
+ .layoutWeight(1)
|
|
|
|
|
+ }.width('100%').height(300)
|
|
|
|
|
+ .backgroundColor(Color.White)
|
|
|
|
|
+ .padding({bottom: this.safeBottom})
|
|
|
|
|
+ .borderRadius({topLeft: 8, topRight: 8})
|
|
|
|
|
+ }
|
|
|
|
|
+}
|