浏览代码

feat:
1. 完成个人中心页面相关UI和交互
2. 新增修改密码页面
3. 新增了《记录》、《日记》View 下的未登录横幅的展开。
4. 新增了 《日记》view 下点击日历跳转到对应的记录
5. 修复了部分显示BUG

YuJing 2 月之前
父节点
当前提交
02c16d0e2c

+ 2 - 1
commons/basic/src/main/ets/components/generalComp/YTHeader.ets

@@ -10,6 +10,7 @@ export struct YTHeader {
   backArrow: boolean = true
   title: string = ''
   bgc: ResourceColor = Color.White
+  fontc: ResourceColor = Color.Black
   click = () => {
     yTRouter.routerBack()
   }
@@ -43,7 +44,7 @@ export struct YTHeader {
           Text(this.title)
             .fontSize(18)
             .fontWeight(700)
-            .fontColor(Color.Black)
+            .fontColor(this.fontc)
         }
       }
       .width('100%')

+ 6 - 3
features/feature/src/main/ets/components/DiaryTimePicker.ets

@@ -56,11 +56,14 @@ export struct DiaryTimePicker {
             .width(24)
             .aspectRatio(1)
         }
-        .alignItems(VerticalAlign.Center)
-        .justifyContent(FlexAlign.Center)
-        .padding({left: 10, right:10})
         .borderRadius(36)
         .backgroundColor('#F5F5F7')
+        .padding({left: 10, right:10})
+        .alignItems(VerticalAlign.Center)
+        .justifyContent(FlexAlign.Center)
+        .onClick(() => {
+          this.onCancel?.()
+        })
 
         Row(){
           Image($r('app.media.Diary_Entry'))

+ 48 - 0
features/feature/src/main/ets/components/LoginComponent.ets

@@ -0,0 +1,48 @@
+import { yTRouter } from "basic"
+
+@Component
+export struct LoginComponent {
+  private linearInfo: LinearGradientOptions = {
+    colors: [ ['#B9FD2A', 0.01], ['#F5FD6D', 1] ],
+    angle: 110
+  }
+
+  build() {
+    Column(){
+      Row(){
+        Row(){
+          Text("登录使用全部功能")
+            .fontSize(16)
+            .fontColor('#FFFFFF')
+
+          Row(){
+            Text("马上登录")
+              .fontSize(12)
+              .fontColor('#212245')
+              .onClick(() => {
+                yTRouter.router2LoginPage()
+              })
+          }
+          .borderRadius(24)
+          .linearGradient(this.linearInfo)
+          .padding({
+            top: 10, left: 15, bottom: 10, right: 15
+          })
+        }
+        .width("100%")
+        .borderRadius(16)
+        .backgroundColor('#000000')
+        .alignItems(VerticalAlign.Center)
+        .justifyContent(FlexAlign.SpaceBetween)
+        .padding({ left: 17, right: 11, top: 12, bottom: 12 })
+      }
+      .width("100%")
+      .padding({left: 18, right: 18, bottom: 20 })
+    }
+    .width("100%")
+    .height("100%")
+    .backgroundColor('rgba(255, 255, 255, 0.5)')
+    .justifyContent(FlexAlign.End)
+    .alignItems(HorizontalAlign.Center)
+  }
+}

+ 39 - 50
features/feature/src/main/ets/pages/DiarySearchPage.ets

@@ -82,7 +82,7 @@ struct DiarySearchPage{
 
           TextInput({ placeholder: "输入物品名称", text: $$this.keyWord })
             .padding(0)
-            .fontSize(12)
+            .fontSize(16)
             .layoutWeight(1)
             .borderRadius(0)
             .placeholderColor('#ff777272')
@@ -93,11 +93,12 @@ struct DiarySearchPage{
 
 
           if(this.keyWord.length > 0) {
-            Image($r('app.media.close'))
-              .width(12)
-              .aspectRatio(1)
+            Image($r('app.media.Diary_close'))
+              .width(25)
               .padding(5)
-              .backgroundColor('#EBEBEB')
+              .aspectRatio(1)
+              .borderRadius(15)
+              // .backgroundColor('#EBEBEB')
               .onClick(() => {
                 this.keyWord = ''
                 this.searchList = []
@@ -141,29 +142,7 @@ struct DiarySearchPage{
             .padding({bottom: 20})
 
           } else if(this.historicalSearchRecords.length > 0){
-            // 搜索历史
-            Row(){
-              Text("搜索历史")
-                .fontSize(16)
-                .fontColor(Color.Black)
-
-              Row(){
-                if(this.delModel) {
-                  Text("取消")
-                    .fontSize(14)
-                    .fontColor('#ff625a5a')
-                } else {
-                  Image($r('app.media.del'))
-                    .width(12)
-                    .aspectRatio(1)
-                }
-              }
-              .onClick(() => {
-                this.delModel = !this.delModel
-              })
-            }
-            .width("100%")
-            .justifyContent(FlexAlign.SpaceBetween)
+            this.searchTitleBar()
 
             Flex({wrap: FlexWrap.Wrap, space: { main: new LengthMetrics(8), cross: new LengthMetrics(8)}}){
               ForEach(this.historicalSearchRecords, (item: string, index: number) => {
@@ -172,28 +151,7 @@ struct DiarySearchPage{
             }
           } else {
             // 搜索历史
-            Row(){
-              Text("搜索历史")
-                .fontSize(16)
-                .fontColor(Color.Black)
-
-              Row(){
-                if(this.delModel) {
-                  Text("取消")
-                    .fontSize(14)
-                    .fontColor('#ff625a5a')
-                } else {
-                  Image($r('app.media.del'))
-                    .width(12)
-                    .aspectRatio(1)
-                }
-              }
-              .onClick(() => {
-                this.delModel = !this.delModel
-              })
-            }
-            .width("100%")
-            .justifyContent(FlexAlign.SpaceBetween)
+            this.searchTitleBar()
 
             Column({ space: 5 }){
               Image($r('app.media.Search'))
@@ -215,6 +173,7 @@ struct DiarySearchPage{
     }
   }
 
+  // 搜索记录关键字
   @Builder
   keyWordItem(keyWord: string, index: number){
     Row({space: 8}){
@@ -240,6 +199,36 @@ struct DiarySearchPage{
       this.onSearch()
     })
   }
+
+  // 搜索记录标题栏
+  @Builder
+  searchTitleBar(){
+    // 搜索历史
+    Row(){
+      Text("搜索历史")
+        .fontSize(16)
+        .fontColor(Color.Black)
+
+      Row(){
+        if(this.delModel) {
+          Text("取消")
+            .fontSize(14)
+            .fontColor('#ff625a5a')
+        } else {
+          Image($r('app.media.del'))
+            .width(20)
+            .height(30)
+        }
+      }
+      .onClick(() => {
+        this.delModel = !this.delModel
+      })
+    }
+    .height(30)
+    .width("100%")
+    .justifyContent(FlexAlign.SpaceBetween)
+
+  }
 }
 
 @Builder

+ 8 - 4
features/feature/src/main/ets/pages/IncreaseDiaryPage.ets

@@ -62,11 +62,15 @@ struct IncreaseDiaryPage {
       return;
     }
 
+    if(!this.diaryData.title || !this.diaryData.content) {
+      IBestToast.show({ message: '请填写标题和内容' })
+      return;
+    }
+
     // 浅拷贝
     let diaryData = JSON.parse(JSON.stringify(this.diaryData)) as DiaryData
     // 统一时间格式
 
-
     // 图片上传逻辑
     if (diaryData.imageUrls && diaryData.imageUrls.length != 0) {
       console.log("图片上传中" + JSON.stringify(diaryData.imageUrls))
@@ -211,7 +215,7 @@ struct IncreaseDiaryPage {
   }
 
   async aboutToAppear(): Promise<void> {
-    this.diaryData.diaryDate = DateUtils.formatDateToCustomString(new Date())
+    this.diaryData.diaryDate = DateUtils.formatDateToCustomString(new Date(), true, false)
     this.getRouterParams()
 
     // TODO 在没有数据的时候 时间选择器的回显为 undefined
@@ -253,7 +257,7 @@ struct IncreaseDiaryPage {
           Stack({alignContent: Alignment.Bottom}){
             // 主要内容
             Column(){
-              // 时间选择
+              // 日期选择
               Row(){
                 Row({space: 8}){
                   Text(this.diaryData.diaryDate?.split(' ')[0])
@@ -268,7 +272,7 @@ struct IncreaseDiaryPage {
                   this.showDatePicker = true
                 })
 
-
+                // 时间选择
                 Row({space: 8}){
                   if(this.pageStatus == PageStatus.RECODE) {
                     Text(this.diaryData.diaryDate?.split(' ')[1])

+ 2 - 2
features/feature/src/main/ets/utils/DateUtils.ets

@@ -25,7 +25,7 @@ function createDateInfo(date: Date): DateInfo {
 
 
 export class DateUtils {
-  static formatDateToCustomString(date: Date, needTime: boolean = true): string {
+  static formatDateToCustomString(date: Date, needTime: boolean = true, needSecond: boolean = true): string {
     // 转换为 YY-MM-DD HH:mm:ss 格式
     const year = date.getFullYear().toString();
     const month = (date.getMonth() + 1).toString().padStart(2, '0');
@@ -34,7 +34,7 @@ export class DateUtils {
     const minutes = date.getMinutes().toString().padStart(2, '0');
     const seconds = date.getSeconds().toString().padStart(2, '0');
 
-    const result = `${year}-${month}-${day}` + (needTime ? ` ${hours}:${minutes}:${seconds}` : '');
+    const result = `${year}-${month}-${day}` + (needTime ? ` ${hours}:${minutes}` + (needSecond ? `:${seconds}` : '') : '');
     return result;
   }
 

+ 142 - 114
features/feature/src/main/ets/view/DiaryView.ets

@@ -1,6 +1,7 @@
 import { IBestToast, userInfo, UserInfo, YTAvoid, yTRouter, yTToast } from "basic"
 import { DiaryTitleItem } from "../components/DiaryTitleItem"
 import { DoubleConfirm } from "../components/DoubleConfirm"
+import { LoginComponent } from "../components/LoginComponent"
 import { DiaryData, PageStatus } from "../models"
 import { DateUtils } from "../utils/DateUtils"
 import { DiaryViewModel } from "../viewModels/DiaryViewModel"
@@ -12,6 +13,7 @@ import { DiaryViewModel } from "../viewModels/DiaryViewModel"
 export struct DiaryView {
   @StorageProp(YTAvoid.SAFE_TOP_KEY) safeTop: number = 0
   @State Vm: DiaryViewModel = new DiaryViewModel()
+  @State ShowLoginDialog: boolean = false
   @StorageProp(UserInfo.KEY) @Watch('loginStateChanged')  userInfo: UserInfo = userInfo
 
   private linearInfo: LinearGradientOptions = {
@@ -26,6 +28,7 @@ export struct DiaryView {
     console.log('登录状态发生变化 登录状态为 ' + this.userInfo.checkLogin())
     const loginState = this.userInfo.checkLogin()
     if(loginState){
+      this.ShowLoginDialog = false
       this.reloadDiaryData()
     } else {
       this.Vm.diaryDataList = []
@@ -75,39 +78,21 @@ export struct DiaryView {
   openDatePicker(){
     CalendarPickerDialog.show({
       selected: new Date(),
-      // backgroundColor: Color.Gray,
-      // backgroundBlurStyle: BlurStyle.NONE,
-      // shadow: ShadowStyle.OUTER_FLOATING_SM,
       onAccept: (value) => {
         // this.selectedDate = value;
         console.info("calendar onAccept:" + JSON.stringify(value));
-      },
-      onCancel: () => {
-        console.info("calendar onCancel");
-      },
-      onChange: (value) => {
-        console.info("calendar onChange:" + JSON.stringify(value));
-      },
-      onDidAppear: () => {
-        console.info("calendar onDidAppear");
-      },
-      onDidDisappear: () => {
-        console.info("calendar onDidDisappear");
-      },
-      onWillAppear: () => {
-        console.info("calendar onWillAppear");
-      },
-      onWillDisappear: () => {
-        console.info("calendar onWillDisappear");
-      },
-      acceptButtonStyle: {
-        // backgroundColor: this.linearInfo
-        fontColor: Color.Black
-      },
-      cancelButtonStyle:{
-        fontColor: Color.Black
-      }
+        let ans = DateUtils.formatDateToCustomString(value, false);
+        let target = 0;
+        for (let i = 0; i < this.Vm.dateList.length; i++) {
+          let current = this.Vm.dateList[i]
+          if(current > ans) {
+            target = i;
+          }
+        }
+        console.log("target " + target)
+        this.Vm.scroller.scrollToIndex(target, true,  ScrollAlign.START)
 
+      }
     })
   }
 
@@ -115,7 +100,11 @@ export struct DiaryView {
    * 重新加载日记数据
    */
   reloadDiaryData() {
-    this.Vm.queryDiaryLogList(DateUtils.formatDateToCustomString(new Date(), false))
+    if(this.userInfo.checkLogin()){
+      this.Vm.queryDiaryLogList(DateUtils.formatDateToCustomString(new Date(), false))
+    } else {
+      this.ShowLoginDialog = true
+    }
   }
 
   aboutToAppear(): void {
@@ -123,109 +112,148 @@ export struct DiaryView {
   }
 
   build() {
-    /**
-     * 1. 令日期作为 listGroup 可以方便进行跳转
-     * 2. 内部存在多个 listItem 时添加粘性标题
-     * 3. 通过日历选择器进行跳转时, 如果当天没有日记, 则向上寻找,还行向下
-     * 4.
-     */
-    Column() {
-      // title
-      Row() {
-        Image($r("app.media.calendar"))
-          .width(30)
-          .aspectRatio(1)
-          .onClick(() => {
-            this.openDatePicker()
-          })
+    Stack(){
+      Column() {
+        // title
+        Row() {
+          Image($r("app.media.calendar"))
+            .width(30)
+            .aspectRatio(1)
+            .onClick(() => {
+              this.openDatePicker()
+            })
 
-        Text("日记本")
-          .fontSize(20)
+          Text("日记本")
+            .fontSize(20)
 
-        Image($r("app.media.Search"))
-          .width(30)
-          .aspectRatio(1)
-          .onClick(this.routerSearchPage)
-      }
-      .width("100%")
-      .justifyContent(FlexAlign.SpaceBetween)
-      .padding({ top: this.safeTop + 22, left: 16, right: 16, bottom: 33 })
-
-      // swiper
-      Stack({ alignContent: Alignment.BottomEnd }) {
-        // 日记列表
-        List({ space: 16 }) {
-          ForEach(this.Vm.dateList, (groupTitle: string, index: number) => {
-            ListItemGroup({
-              header: this.DiaryHead(groupTitle),
-            }) {
-              ForEach(this.Vm.diaryDataList.filter((item) => item.diaryDate == groupTitle), (item: DiaryData, i: number) => {
-                ListItem() {
-                  DiaryTitleItem({
-                    title: item.title,
-                    onClickBack: () => {
-                      this.routerDiaryPage(item.id)
-                    },
-                    onActionBack: (event: GestureEvent) => {
-                      console.log("触发删除")
-                      this.decreaseDiary(item.id ?? -1)
-                    }
+          Image($r("app.media.Search"))
+            .width(30)
+            .aspectRatio(1)
+            .onClick(this.routerSearchPage)
+        }
+        .width("100%")
+        .justifyContent(FlexAlign.SpaceBetween)
+        .padding({ top: this.safeTop + 22, left: 16, right: 16, bottom: 33 })
+
+        // swiper
+        Stack({ alignContent: Alignment.BottomEnd }) {
+          // 日记列表
+          List({ space: 16, scroller: this.Vm.scroller }) {
+            // 空数据页面
+            if(this.Vm.diaryDataList.length === 0) {
+              ListItem(){
+                Column({space: 12}){
+                  Row({space: 8}){
+                    Text("+")
+                    Text("去添加")
+                  }
+                  .borderRadius(8)
+                  .linearGradient(this.linearInfo)
+                  .alignItems(VerticalAlign.Center)
+                  .justifyContent(FlexAlign.Center)
+                  .border({width: 1, color: Color.Black})
+                  .padding({ left: 16, top: 12, right: 16, bottom: 12})
+                  .onClick(() => {
+                    this.routerDiaryPage()
                   })
+
+                  Text("暂无记录~")
+                    .fontSize(14)
+                    .fontWeight(400)
                 }
-                .swipeAction({
-                  end: this.DiaryDel(item.id),
-                  edgeEffect: SwipeEdgeEffect.None
-                })
-              }, (item: DiaryData) => item.id?.toString())
+                .width("100%")
+                .height("100%")
+                .alignItems(HorizontalAlign.Center)
+                .padding({ top: '40%'})
+                // .justifyContent(FlexAlign.Center)
+              }
+              .layoutWeight(1)
+              .width("100%")
             }
-          }, (item: DiaryData) => item.diaryDate)
-        }
-        .width("100%")
-        .height("100%")
-        .scrollBar(BarState.Off)
 
-        // 增加日记按钮
-        Row() {
-          Image($r("app.media.add_Img"))
-            .width(40)
-            .aspectRatio(1)
+            ForEach(this.Vm.dateList, (groupTitle: string, index: number) => {
+              ListItemGroup({
+                header: this.DiaryHead(groupTitle),
+              }) {
+                ForEach(this.Vm.diaryDataList.filter((item) => item.diaryDate == groupTitle), (item: DiaryData, i: number) => {
+                  ListItem() {
+                    DiaryTitleItem({
+                      title: item.title,
+                      onClickBack: () => {
+                        this.routerDiaryPage(item.id)
+                      },
+                      onActionBack: (event: GestureEvent) => {
+                        console.log("触发删除")
+                        this.decreaseDiary(item.id ?? -1)
+                      }
+                    })
+                  }
+                  .swipeAction({
+                    end: this.DiaryDel(item.id),
+                    edgeEffect: SwipeEdgeEffect.None
+                  })
+                }, (item: DiaryData) => item.id?.toString())
+              }
+            }, (item: DiaryData) => item.diaryDate)
+          }
+          .width("100%")
+          .height("100%")
+          .scrollBar(BarState.Off)
+          .sticky(StickyStyle.Header)
+
+          // 增加日记按钮
+          Row() {
+            Image($r("app.media.add_Img"))
+              .width(40)
+              .aspectRatio(1)
+          }
+          .onClick(() => {
+            this.routerDiaryPage()
+          })
+          .width(40)
+          .aspectRatio(1)
+          .borderRadius(20)
+          .margin({ bottom: 16 })
+          .alignItems(VerticalAlign.Center)
+          .justifyContent(FlexAlign.Center)
+          .linearGradient(this.linearInfo)
         }
-        .onClick(() => {
-          this.routerDiaryPage()
+        .width("100%")
+        .layoutWeight(1)
+        .backgroundColor(Color.White)
+        .padding({ left: 16, right: 16, top: 13 })
+        .borderRadius({
+          topLeft: 28, topRight: 28
         })
-        .width(40)
-        .aspectRatio(1)
-        .borderRadius(20)
-        .margin({ bottom: 16 })
-        .alignItems(VerticalAlign.Center)
-        .justifyContent(FlexAlign.Center)
-        .linearGradient(this.linearInfo)
       }
       .width("100%")
-      .layoutWeight(1)
-      .backgroundColor(Color.White)
-      .padding({ left: 16, right: 16, top: 13 })
-      .borderRadius({
-        topLeft: 28, topRight: 28
+      .height("100%")
+      .linearGradient(this.linearInfo)
+      .onVisibleAreaChange([0, 1], (isExpanding: boolean, currentRatio: number) => {
+        if(isExpanding) {
+          console.log("组件出来了")
+          this.reloadDiaryData()
+        } else {
+          console.log("组件退了")
+        }
       })
+
+      if(this.ShowLoginDialog){
+        LoginComponent()
+      }
     }
     .width("100%")
     .height("100%")
-    .linearGradient(this.linearInfo)
-    .onVisibleAreaChange([0, 1], (isExpanding: boolean, currentRatio: number) => {
-      if(isExpanding) {
-        console.log("组件出来了")
-        this.reloadDiaryData()
-      } else {
-        console.log("组件退了")
-      }
-    })
   }
 
   // 日记时间组 - 头部组件
   @Builder
   DiaryHead(time: string) {
-    Text(time)
+    Row(){
+      Text(time)
+    }
+    .width("100%")
+    .backgroundColor(Color.White)
   }
 
   // 日记条目删除组件

+ 257 - 212
features/feature/src/main/ets/view/RecodView.ets

@@ -1,10 +1,12 @@
-import { AppStorageKeyCollect, IBestToast, YTAvoid, yTRouter } from 'basic'
+import { AppStorageKeyCollect, IBestToast, userInfo, UserInfo, YTAvoid, yTRouter } from 'basic'
 import { DateInfo } from '../models/DateInfo'
 import { RecodeViewModel } from '../viewModels/RecodeViewModel'
 import { DiaryDatePicker } from '../components/DiaryDatePicker'
 import { DiaryTimePicker } from '../components/DiaryTimePicker'
 import { DateUtils } from '../utils/DateUtils'
 import { DiaryData, PageStatus } from '../models'
+import { CollaborationCameraStateDialog } from '@hms.collaboration.camera'
+import { LoginComponent } from '../components/LoginComponent'
 
 /**
  * 记录页面
@@ -15,6 +17,9 @@ export struct RecodView {
   @StorageProp(YTAvoid.SAFE_TOP_KEY) safeTop: number = 0
   @State Vm: RecodeViewModel = new RecodeViewModel()
   @State heightList: number[] = []
+  // 去登录界面
+  @State ShowLoginDialog: boolean = false
+  @StorageProp(UserInfo.KEY) @Watch('loginStateChanged')  userInfo: UserInfo = userInfo
 
   private linearInfo: LinearGradientOptions = {
     colors: [ ['#B9FD2A', 0.01], ['#F5FD6D', 1] ],
@@ -27,11 +32,35 @@ export struct RecodView {
     console.log('改变了选择的日期')
   }
 
+
+  /**
+   * 登录状态发生变化
+   */
+  loginStateChanged(){
+    console.log('登录状态发生变化 登录状态为 ' + this.userInfo.checkLogin())
+    const loginState = this.userInfo.checkLogin()
+    if(loginState){
+      this.ShowLoginDialog = false
+      this.loadDataList(DateUtils.formatDateToCustomString(new Date(), false))
+    } else {
+      this.Vm.recodeList = []
+    }
+  }
+
   // 加载小记录数据列表
   async loadDataList(targetDate: string) {
-    this.Vm.queryNoteList(targetDate)
+    if(this.userInfo.checkLogin()) {
+      this.Vm.queryNoteList(targetDate)
+    } else {
+      this.ShowLoginDialog = true
+    }
   }
 
+  /**
+   * 更新小记录时间
+   * @param index
+   * @param time
+   */
   async updateNoteTime(index: number, time: string) {
     let currentNote: DiaryData = this.Vm.recodeList[index]
     currentNote.noteTime = currentNote.noteTime?.split(' ')[0] + ' ' + time + ':00'
@@ -44,7 +73,10 @@ export struct RecodView {
     }
   }
 
-  // 跳转至添加小记录页面
+  /**
+   * 跳转至添加小记录页面
+   * @param id
+   */
   routerAddNote(id?: number) {
     yTRouter.pushPathByName("IncreaseDiaryPage", {
       'id': id,
@@ -58,116 +90,118 @@ export struct RecodView {
   }
 
   build() {
-    Column(){
-      Row(){
-        Text("你的生活小计")
-          .fontSize(20)
-
-        Image($r("app.media.calendar"))
-          .width(30)
-          .aspectRatio(1)
-          .onClick(() => {
-            animateToImmediately({
-              duration: 200
-            }, () => {
-              if(this.Vm.showDatePicker) {
-                this.Vm.showDatePicker = false
-              } else {
-                this.Vm.showDatePicker = true
-                this.Vm.showTimePicker = -1
-              }
-            })
-          })
-      }
-      .width("100%")
-      .height(76)
-      .justifyContent(FlexAlign.SpaceBetween)
-      .alignItems(VerticalAlign.Center)
-      .padding({ left: 17, right: 17, bottom: 17, top: 17})
-      .onClick(() => {
-        this.Vm.showTimePicker = -1
-        this.Vm.showDatePicker = false
-      })
+    Stack(){
+      Column(){
+        Row(){
+          Image($r("app.media.RecodeTitle"))
+            .width(140)
+            .height(44)
 
-      // 时间选择器 - 使用区域变换实现
-      if(this.Vm.showTimePicker != -1) {
-        DiaryTimePicker({
-          timeStr: this.Vm.getTime(this.Vm.showTimePicker),
-          onConfirm: (time: string) => {
-            this.updateNoteTime(this.Vm.showTimePicker, time)
-            this.Vm.showTimePicker = -1
-          },
-          onCancel: () => {
-            this.Vm.showTimePicker = -1
-          }
-        })
-          .position({
-            // x: 5,
-            // y: 35
-            x: this.Vm.getPostion('x'),
-            y: this.Vm.getPostion('y')
-          })
-          .zIndex(100)
-      }
-
-      // 主体内容
-      Stack({alignContent: Alignment.TopEnd}){
-        Column(){
-          // 日期选择
-          Swiper(this.Vm.swiperController){
-            LazyForEach(this.Vm.weekLoop, (item: DateInfo, index: number) => {
-              Column({space: 2}) {
-                Column({space: 15}){
-                  Text(item.week)
-                  // ${item.month}-
-                  Text(`${item.day}`)
-                }
-                .width("100%")
-                .padding({ top: 5, bottom: 5 })
-                .borderRadius(10)
-                .linearGradient(this.Vm.selectedDate === index ? this.linearInfo : null)
-
-                // TODO 表示某天有数据 - 暂无接口,待定
-                if(false) {
-                  Row()
-                    .width(6)
-                    .height(6)
-                    .borderRadius(3)
-                    .backgroundColor('#BAFE2B')
+          Image($r("app.media.calendar"))
+            .width(30)
+            .aspectRatio(1)
+            .onClick(() => {
+              animateToImmediately({
+                duration: 200
+              }, () => {
+                if(this.Vm.showDatePicker) {
+                  this.Vm.showDatePicker = false
+                } else {
+                  this.Vm.showDatePicker = true
+                  this.Vm.showTimePicker = -1
                 }
-              }
-              .width(50)
-              .height(80)
-              .padding({
-                left: 7,
-                right: 7,
-                top: 9,
-              })
-              .onClick(() => {
-                this.selectDateChange(index)
               })
-            }, (item: DateInfo, index: number) => { return item.id.toString() })
-          }
-          .loop(false)
-          .displayCount(7)
-          .indicator(false)
-          .direction(Direction.Rtl)
-          .onChange((index: number) => {
-            this.Vm.swiperOnChange(index)
+            })
+        }
+        .width("100%")
+        .height(76)
+        .justifyContent(FlexAlign.SpaceBetween)
+        .alignItems(VerticalAlign.Center)
+        .padding({ left: 17, right: 17, bottom: 17, top: 17})
+        .onClick(() => {
+          this.Vm.showTimePicker = -1
+          this.Vm.showDatePicker = false
+        })
+
+        // 时间选择器 - 使用区域变换实现
+        if(this.Vm.showTimePicker != -1) {
+          DiaryTimePicker({
+            timeStr: this.Vm.getTime(this.Vm.showTimePicker),
+            onConfirm: (time: string) => {
+              this.updateNoteTime(this.Vm.showTimePicker, time)
+              this.Vm.showTimePicker = -1
+            },
+            onCancel: () => {
+              this.Vm.showTimePicker = -1
+            }
           })
+            .position({
+              // x: 5,
+              // y: 35
+              x: this.Vm.getPostion('x'),
+              y: this.Vm.getPostion('y')
+            })
+            .zIndex(100)
+        }
 
-          // 记录内容主体
-          Stack({alignContent: Alignment.BottomEnd}){
-            List({space: 10}) {
-              ListItem()
-                .height(20)
+        // 主体内容
+        Stack({alignContent: Alignment.TopEnd}){
+          Column(){
+            // 日期选择
+            Swiper(this.Vm.swiperController){
+              LazyForEach(this.Vm.weekLoop, (item: DateInfo, index: number) => {
+                Column({space: 2}) {
+                  Column({space: 15}){
+                    Text(item.week)
+                    // ${item.month}-
+                    Text(`${item.day}`)
+                  }
+                  .width("100%")
+                  .padding({ top: 5, bottom: 5 })
+                  .borderRadius(10)
+                  .linearGradient(this.Vm.selectedDate === index ? this.linearInfo : null)
+
+                  // TODO 表示某天有数据 - 暂无接口,待定
+                  if(false) {
+                    Row()
+                      .width(6)
+                      .height(6)
+                      .borderRadius(3)
+                      .backgroundColor('#BAFE2B')
+                  }
+                }
+                .width(50)
+                .height(80)
+                .padding({
+                  left: 7,
+                  right: 7,
+                  top: 9,
+                })
                 .onClick(() => {
-                  this.Vm.showTimePicker = -1
-                  this.Vm.showDatePicker = false
+                  this.selectDateChange(index)
                 })
+              }, (item: DateInfo, index: number) => { return item.id.toString() })
+            }
+            .loop(false)
+            .displayCount(7)
+            .indicator(false)
+            .direction(Direction.Rtl)
+            .onChange((index: number) => {
+              this.Vm.swiperOnChange(index)
+            })
+
+            // 记录内容主体
+            Stack({alignContent: Alignment.BottomEnd}){
+              List({space: 10}) {
+                ListItem()
+                  .height(20)
+                  .onClick(() => {
+                    this.Vm.showTimePicker = -1
+                    this.Vm.showDatePicker = false
+                  })
 
-              ForEach(this.Vm.recodeList, (item: DiaryData, index: number) => {
-                ListItem(){
+                ForEach(this.Vm.recodeList, (item: DiaryData, index: number) => {
+                  ListItem(){
                     Row({space: 20}){
                       // 时间 和 分隔线
                       Column({space: 5}){
@@ -311,133 +345,144 @@ export struct RecodView {
                       postion[index] = _n.globalPosition
                       this.Vm.postionList = postion
                     })
-                }
-              })
+                  }
+                })
+
+                // 空数据页面
+                if(this.Vm.recodeList.length === 0) {
+                  ListItem(){
+                    Column({space: 12}){
+                      Row({space: 8}){
+                        Text("+")
+                        Text("去添加")
+                      }
+                      .borderRadius(8)
+                      .linearGradient(this.linearInfo)
+                      .alignItems(VerticalAlign.Center)
+                      .justifyContent(FlexAlign.Center)
+                      .border({width: 1, color: Color.Black})
+                      .padding({ left: 16, top: 12, right: 16, bottom: 12})
+                      .onClick(() => {
+                        this.routerAddNote()
+                      })
 
-              // 空数据页面
-              if(this.Vm.recodeList.length === 0) {
-                ListItem(){
-                  Column({space: 12}){
-                    Row({space: 8}){
-                      Text("+")
-                      Text("去添加")
+                      Text("暂无记录~")
+                        .fontSize(14)
+                        .fontWeight(400)
                     }
-                    .borderRadius(8)
-                    .linearGradient(this.linearInfo)
-                    .alignItems(VerticalAlign.Center)
-                    .justifyContent(FlexAlign.Center)
-                    .border({width: 1, color: Color.Black})
-                    .padding({ left: 16, top: 12, right: 16, bottom: 12})
-
-                    Text("暂无记录~")
-                      .fontSize(14)
-                      .fontWeight(400)
+                    .width("100%")
+                    .height("100%")
+                    .alignItems(HorizontalAlign.Center)
+                    .padding({ top: '30%'})
+                    // .justifyContent(FlexAlign.Center)
                   }
+                  .layoutWeight(1)
                   .width("100%")
-                  .height("100%")
-                  .alignItems(HorizontalAlign.Center)
-                  .padding({ top: '30%'})
-                  // .justifyContent(FlexAlign.Center)
                 }
-                .layoutWeight(1)
-                .width("100%")
               }
-            }
-            .width("100%")
-            .height("100%")
-            .scrollBar(BarState.Off)
-            .padding({top: 10})
-            .onScrollIndex(() => {
-              this.Vm.showTimePicker = -1
-            })
+              .width("100%")
+              .height("100%")
+              .scrollBar(BarState.Off)
+              .padding({top: 10})
+              .onScrollIndex(() => {
+                this.Vm.showTimePicker = -1
+              })
 
-            // 增加日记按钮
-            Row() {
-              Image($r("app.media.add_Img"))
-                .width("100%")
-                .aspectRatio(1)
+              // 增加日记按钮
+              Row() {
+                Image($r("app.media.add_Img"))
+                  .width("100%")
+                  .aspectRatio(1)
+              }
+              .onClick(() => {
+                this.routerAddNote()
+              })
+              .width(40)
+              .aspectRatio(1)
+              .borderRadius(20)
+              .margin({ bottom: 16 })
+              .alignItems(VerticalAlign.Center)
+              .justifyContent(FlexAlign.Center)
+              .linearGradient(this.linearInfo)
             }
-            .onClick(() => {
-              this.routerAddNote()
+            .width("100%")
+            .layoutWeight(1)
+            .padding({
+              bottom: 20, left: 24, right: 24
             })
-            .width(40)
-            .aspectRatio(1)
-            .borderRadius(20)
-            .margin({ bottom: 16 })
-            .alignItems(VerticalAlign.Center)
-            .justifyContent(FlexAlign.Center)
-            .linearGradient(this.linearInfo)
-          }
-          .width("100%")
-          .layoutWeight(1)
-          .padding({
-            bottom: 20, left: 24, right: 24
-          })
 
-          // 记录内容主体
-          // Stack({ alignContent: Alignment.BottomEnd }){
-          //
-          //   // 增加日记按钮
-          //   Row() {
-          //     Image($r("app.media.add"))
-          //       .width(20)
-          //       .aspectRatio(1)
-          //   }
-          //   .onClick(() => {
-          //     this.routerAddNote()
-          //   })
-          //   .width(40)
-          //   .aspectRatio(1)
-          //   .borderRadius(20)
-          //   .padding(8)
-          //   // .border({ width: 1 })
-          //   .margin({ bottom: 16 })
-          //   // .backgroundColor(Color.White)
-          //   .alignItems(VerticalAlign.Center)
-          //   .justifyContent(FlexAlign.Center)
-          //   .linearGradient(this.linearInfo)
-          // }
-          // .width("100%")
-          // .layoutWeight(1)
+            // 记录内容主体
+            // Stack({ alignContent: Alignment.BottomEnd }){
+            //
+            //   // 增加日记按钮
+            //   Row() {
+            //     Image($r("app.media.add"))
+            //       .width(20)
+            //       .aspectRatio(1)
+            //   }
+            //   .onClick(() => {
+            //     this.routerAddNote()
+            //   })
+            //   .width(40)
+            //   .aspectRatio(1)
+            //   .borderRadius(20)
+            //   .padding(8)
+            //   // .border({ width: 1 })
+            //   .margin({ bottom: 16 })
+            //   // .backgroundColor(Color.White)
+            //   .alignItems(VerticalAlign.Center)
+            //   .justifyContent(FlexAlign.Center)
+            //   .linearGradient(this.linearInfo)
+            // }
+            // .width("100%")
+            // .layoutWeight(1)
 
 
-        }
+          }
 
-        // 日期选择器
-        if(this.Vm.showDatePicker) {
-          DiaryDatePicker({
-            selectedDate: this.Vm.weekLoop.getData(this.Vm.swiperCurrentIndex).id,
-            selectDateBack: (date: Date) => {
-              this.Vm.showDatePicker = false
-              this.Vm.jumpToDate(date)
-            }
-          })
-            .width(267)
+          // 日期选择器
+          if(this.Vm.showDatePicker) {
+            DiaryDatePicker({
+              selectedDate: this.Vm.weekLoop.getData(this.Vm.swiperCurrentIndex).id,
+              selectDateBack: (date: Date) => {
+                this.Vm.showDatePicker = false
+                this.Vm.jumpToDate(date)
+              }
+            })
+              .width(267)
+          }
         }
+        .width("100%")
+        .layoutWeight(1)
+        .backgroundColor(Color.White)
+        .borderRadius({
+          topLeft: 20,
+          topRight: 20
+        })
       }
       .width("100%")
-      .layoutWeight(1)
-      .backgroundColor(Color.White)
-      .borderRadius({
-        topLeft: 20,
-        topRight: 20
+      .height("100%")
+      .padding({ top: this.safeTop})
+      .linearGradient({
+        colors: [ ['#B9FD2A', 0.01], ['#F5FD6D', 1] ],
+        angle: 150
+      })
+      .onVisibleAreaChange([0, 1], (isExpanding: boolean, currentRatio: number) => {
+        if(isExpanding) {
+          console.log("组件出来了")
+          this.loadDataList(DateUtils.formatDateToCustomString(new Date(), false))
+        } else {
+          console.log("组件退了")
+        }
       })
+
+      if(this.ShowLoginDialog){
+        LoginComponent()
+      }
     }
     .width("100%")
     .height("100%")
-    .padding({ top: this.safeTop + 22})
-    .linearGradient({
-      colors: [ ['#B9FD2A', 0.01], ['#F5FD6D', 1] ],
-      angle: 150
-    })
-    .onVisibleAreaChange([0, 1], (isExpanding: boolean, currentRatio: number) => {
-      if(isExpanding) {
-        console.log("组件出来了")
-        this.Vm.changeDataByIndex()
-      } else {
-        console.log("组件退了")
-      }
-    })
+
 
   }
 }

+ 13 - 12
features/feature/src/main/ets/viewModels/DiaryViewModel.ets

@@ -4,6 +4,7 @@ import { DiaryData } from "../models"
 import { util } from "@kit.ArkTS"
 import { fileIo as fs } from "@kit.CoreFileKit"
 import { image } from "@kit.ImageKit"
+import { faceDetector } from "@kit.CoreVisionKit"
 
 
 export class DiaryViewModel{
@@ -11,6 +12,8 @@ export class DiaryViewModel{
   diaryDataList: DiaryData[] = []
   // 时间列表
   dateList: string[] = []
+  // 列表控制器
+  scroller: ListScroller = new ListScroller()
 
   /**
    * 删除日记
@@ -19,13 +22,6 @@ export class DiaryViewModel{
   async deleteDiaryLog(id: number) {
     const result = await DiaryApi.deleteDiaryLog(id)
     YTLog.info(`删除日记结果 ${result}`)
-    // if(result) {
-    //   IBestToast.show("删除成功")
-    //   yTToast.hide()
-    // } else {
-    //   IBestToast.show("删除失败")
-    //   yTToast.hide()
-    // }
     return result
   }
 
@@ -41,12 +37,17 @@ export class DiaryViewModel{
 
     let i = 0;
     this.dateList[0] = result[0].diaryDate!
-    for (let index = 0; index < result.length; index++) {
-      if(result[index].diaryDate != this.dateList[i]){
-        this.dateList.push(result[index].diaryDate!)
-        i++;
+    // for (let index = 0; index < result.length; index++) {
+    //   if(result[index].diaryDate != this.dateList[i]){
+    //     this.dateList.push(result[index].diaryDate!)
+    //     i++;
+    //   }
+    // }
+    result.forEach(item => {
+      if(this.dateList.indexOf(item.diaryDate!) === -1){
+        this.dateList.push(item.diaryDate!)
       }
-    }
+    })
 
     console.log('title_List ' + JSON.stringify(this.dateList))
   }

+ 2 - 2
features/feature/src/main/ets/viewModels/RecodeViewModel.ets

@@ -145,9 +145,9 @@ export class RecodeViewModel{
       const y = this.postionList[this.showTimePicker].y! as number
       // 屏幕剩余高度过小
       if(screenHeight && y > screenHeight - 300) {
-        return y - 260
+        return y - 240
       }
-      return y - 20
+      return y
     }
   }
 

二进制
features/feature/src/main/resources/base/media/RecodeTitle.png


+ 159 - 0
features/user/src/main/ets/pages/ChangePassword.ets

@@ -0,0 +1,159 @@
+import { YTAvoid, YTButton, YTHeader, yTRouter } from 'basic'
+import { LoginCollect } from 'basic/src/main/ets/models/LoginCollect'
+import { LoginInput } from '../components/LoginInput'
+import { CodeInputType } from '../models'
+
+
+@Component
+struct ChangePassWord{
+  @State private loginCollect: LoginCollect = new LoginCollect('reset')
+  @StorageProp(YTAvoid.SAFE_TOP_KEY) safeTop: number = 0
+
+  private inputPhoneNumberType: CodeInputType = {
+    txt: '+86',
+    placeHolder: '手机号'
+  }
+  private inputCaptchaType: CodeInputType = {
+  txt: '验证码',
+  placeHolder: '验证码'
+}
+  private inputPasswordType: CodeInputType = {
+    txt: '密码',
+    placeHolder: '设置密码'
+  }
+  private inputConfirmPasswordType: CodeInputType = {
+    txt: '密码',
+    placeHolder: '确认密码'
+  }
+  private linearInfo: LinearGradientOptions = {
+    colors: [ ['#B9FD2A', 0.01], ['#F5FD6D', 1] ],
+    angle: 110
+  }
+  build() {
+    NavDestination(){
+      Column(){
+        YTHeader({ title: '用户设置', bgc: 'rgba(0, 0, 0, 0)', leftComp: this.backIcon})
+
+        Column(){
+          // 手机号
+          LoginInput({
+            item: this.inputPhoneNumberType,
+            inputData: this.loginCollect.phonenumber,
+            isPassword: false,
+            needCode: false,
+            // changeStyle: true,
+            // fontSize: 16,
+            // fontColor: Color.White,
+            inputChange: (value: string) => {
+              this.loginCollect.phonenumber = value
+            }
+          })
+
+          // 验证码
+          LoginInput({
+            item: this.inputCaptchaType,
+            inputData: this.loginCollect.smsCode,
+            needCode: true,
+            loginCollect: this.loginCollect,
+            // changeStyle: true,
+            // fontSize: 16,
+            // fontColor: Color.White,
+            // codeSize: 12,
+            inputChange: (value) => {
+              this.loginCollect.smsCode = value
+            }
+          })
+
+          // 设置密码
+          LoginInput({
+            item: this.inputPasswordType,
+            inputData: this.loginCollect.password,
+            needCode: false,
+            isPassword: true,
+            marginBottom: 0,
+            // changeStyle: true,
+            // fontColor: Color.White,
+            // fontSize: 16,
+            inputChange: (value) => {
+              this.loginCollect.password = value
+            }
+          })
+
+          // 确认密码
+          LoginInput({
+            item: this.inputConfirmPasswordType,
+            inputData: this.loginCollect.confirmPassword,
+            isPassword: true,
+            needCode: false,
+            // fontColor: Color.White,
+            // changeStyle: true,
+            // fontSize: 16,
+            inputChange: (value) => {
+              this.loginCollect.confirmPassword = value
+            }
+          })
+
+          // 空白占位
+          Blank()
+            .layoutWeight(1)
+
+          YTButton({
+            btContent: '完成',
+            btFontColor: Color.Black,
+            btFontSize: 20,
+            btlinear: this.linearInfo,
+            btBorder: {width: 0},
+            btPadding: {
+              left: 26,
+              right: 26,
+              top: 9,
+              bottom: 9
+            },
+            click: () => {
+              this.loginCollect.executeLogin("common")
+              // if (!this.value) {
+              //   IBestToast.show({
+              //     type: "warning",
+              //     message: "昵称不能为空"
+              //   })
+              //   return
+              // }
+              // YTUserRequest.changeNickname(this.value, () => {
+              //   IBestToast.show({ message: '名称修改成功' })
+              //   this.showReviseName = false
+              // })
+            }
+
+          }).margin({ bottom: 142 })
+        }
+        .padding({ left: 14, right: 14})
+        .width("100%")
+        .layoutWeight(1)
+      }
+      // .padding({ top: this.safeTop })
+    }
+
+  }
+
+  @Builder
+  backIcon(){
+    Image($r('app.media.diary_back'))
+      .width(12)
+      .height(20)
+      .margin({ left: 16 })
+      // .fillColor('#FFECD5AF')
+      .onClick(() => {
+        yTRouter.pop()
+      })
+
+  }
+}
+
+
+@Builder
+function ChangePassWordBuilder() {
+  NavDestination() {
+    ChangePassWord()
+  }
+  .hideTitleBar(true)
+}

+ 11 - 4
features/user/src/main/ets/pages/LoginPage.ets

@@ -17,6 +17,10 @@ struct LoginPage {
   @StorageProp(YTAvoid.SAFE_BOTTOM_KEY) private safeBottom: number = 0
   @State private tabBarIndex: number = 0
   private tabController: TabsController = new TabsController()
+  private linearInfo1: LinearGradientOptions = {
+    colors: [ ['#F7FCF3', 0.1], ['#DEFE9E', 1] ],
+    angle: 90
+  }
 
   aboutToAppear(): void {
 
@@ -62,7 +66,8 @@ struct LoginPage {
             .fontWeight(600)
             .layoutWeight(1)
             .fontColor(this.tabBarIndex == 0 ? '#FF141111' : '#80141111')
-            // .backgroundColor(this.tabBarIndex == 0 || this.tabBarIndex == 2 ? 'rgba(255,255,255,0.5)' : Color.Transparent)
+            .backgroundColor(this.tabBarIndex == 0 || this.tabBarIndex == 2 ? 'rgba(255,255,255,0.5)' : Color.Transparent)
+            // .linearGradient(this.tabBarIndex == 0 ? this.linearInfo1 : this.linearInfo2)
             .textAlign(TextAlign.Center)
             .height(48)
             .borderRadius({ topLeft: 12, topRight: 12, bottomRight: this.tabBarIndex == 1 ? 12 : 0 })
@@ -79,11 +84,12 @@ struct LoginPage {
               topRight: 12,
               bottomLeft: this.tabBarIndex == 0 ? 12 : 0
             })
-            // .backgroundColor(this.tabBarIndex == 1 ? 'rgba(255,255,255,0.5)' : Color.Transparent)
+            .backgroundColor(this.tabBarIndex == 1 ? 'rgba(255,255,255,0.5)' : Color.Transparent)
             .layoutWeight(1)
             .height(48)
             .textAlign(TextAlign.Center)
             .fontColor(this.tabBarIndex == 1 || this.tabBarIndex == 2 ? '#FF141111' : '#80141111')
+            // .linearGradient(this.tabBarIndex == 1 || this.tabBarIndex == 2 ? this.linearInfo1 : this.linearInfo2)
             .onClick(() => {
               this.tabBarIndex = 1
               this.tabController.changeIndex(1)
@@ -93,6 +99,7 @@ struct LoginPage {
         .alignItems(VerticalAlign.Center)
         .justifyContent(FlexAlign.SpaceBetween)
         .width('100%')
+        .linearGradient(this.linearInfo1)
 
         Tabs({ controller: this.tabController }) {
           TabContent() {
@@ -121,8 +128,8 @@ struct LoginPage {
         .barHeight(0)
         .padding({top: 20})
       }
-      .backgroundImage(this.tabBarIndex == 0 ? $r('app.media.loginPage_Bg_left') : $r('app.media.loginPage_Bg_right'))
-      .backgroundImageSize(ImageSize.Contain)
+      // .backgroundImage(this.tabBarIndex == 0 ? $r('app.media.loginPage_Bg_left') : $r('app.media.loginPage_Bg_right'))
+      // .backgroundImageSize(ImageSize.Contain)
     }
 
     .padding({

+ 53 - 36
features/user/src/main/ets/pages/SettingPage.ets

@@ -33,16 +33,24 @@ struct SettingPage {
   reviseBuilderArr: Array<BasicType<undefined>> = [
     {
       text: '头像修改',
-      src: '',
+      src: 'head',
       click: () => {
         this.showHeaderImgRevise = true
       }
     },
     {
       text: '昵称修改',
+      src: 'name',
       click: () => {
         this.showReviseName = true
       }
+    },
+    {
+      text: '密码设置',
+      click: () => {
+        yTRouter.pushPathByName("ChangePassWord", null)
+
+      }
     }
   ]
   options: BasicType<undefined>[] = [
@@ -74,7 +82,10 @@ struct SettingPage {
       }
     },
   ]
-
+  private linearInfo: LinearGradientOptions = {
+    colors: [ ['#B9FD2A', 0.01], ['#F5FD6D', 1] ],
+    angle: 110
+  }
   build() {
     Column() {
       YTHeader({ title: '用户设置' })
@@ -89,24 +100,11 @@ struct SettingPage {
                 .backgroundColor('#0A000000')
             }
             .padding({ left: 12, right: 8 })
-            .bindSheet($$this.showHeaderImgRevise, this.changeBuilder, {
-              height: 204,
-              backgroundColor: Color.White,
-              showClose: false
-            })
           }
         })
-        YTButton({
-          btContent: '退出登录', click: () => {
-            this.userInfo.logout()
-            yTRouter.routerBack()
-            IBestToast.show({ message: '退出登录成功' })
-          }
-        })
-          .margin({ top: 426, bottom: 12 })
         YTButton({
           btContent: '注销用户',
-          btFontColor: Color.Red,
+          btFontColor: '#ff989494',
           bgc: Color.White,
           click: () => {
             yTToast.doubleConfirm({
@@ -118,6 +116,18 @@ struct SettingPage {
             })
           }
         })
+          .margin({ top: 426, bottom: 12 })
+        YTButton({
+          btContent: '退出登录', click: () => {
+            this.userInfo.logout()
+            yTRouter.routerBack()
+            IBestToast.show({ message: '退出登录成功' })
+          },
+          btlinear: this.linearInfo,
+          btFontColor: Color.Black,
+          btFontSize: 16
+        })
+
       }
       .bindSheet($$this.showReviseName, this.reviseNameBuilder, {
         height: 275,
@@ -130,7 +140,11 @@ struct SettingPage {
       })
     }
     .padding({ bottom: this.safeBottom })
-
+    .bindSheet($$this.showHeaderImgRevise, this.changeBuilder, {
+      height: 204,
+      backgroundColor: Color.White,
+      showClose: false
+    })
   }
 
   @Builder
@@ -140,12 +154,12 @@ struct SettingPage {
         .fontSize($r('[basic].float.page_text_font_size_12'))
         .fontColor('#80000000')
       Row() {
-        if (typeof item.src == 'string') {
+        if (item.src === 'head') {
           Image(this.userInfo.getHeadImg() ? this.userInfo.getHeadImg() : $r('app.media.default_img'))
             .height(24)
             .width(24)
             .borderRadius(12)
-        } else {
+        } else if (item.src === 'name') {
           Text(this.userInfo.getName() ?? this.userInfo.getPhoneNumber() ?? this.userInfo.getId()?.toString())
             .fontSize($r('[basic].float.page_text_font_size_12'))
             .fontColor('#CC000000')
@@ -167,21 +181,22 @@ struct SettingPage {
     Column() {
 
       Text('昵称')
-        .width('100%')
         .height(36)
+        .width('100%')
+        .fontSize(16)
+        .fontColor('#ff989494')
         .textAlign(TextAlign.Start)
-        .fontSize(12)
 
       TextInput({ text: $$this.value, placeholder: '请输入昵称' })
-        .borderRadius(4)
-        .fontSize(12)
-        .placeholderFont({ size: 12 })
-        .placeholderColor('#14000000')
         .height(36)
+        .fontSize(12)
         .width('100%')
-        .backgroundColor(Color.White)
-        .border({ width: 1, color: '#14000000' })
-        .margin({ bottom: 25 })
+        .border({ width: { bottom: 1 } })
+        .borderRadius(0)
+        .placeholderColor('#1C1C1C')
+        .placeholderFont({ size: 12 })
+        .backgroundColor(Color.Transparent)
+        .margin({ bottom: 44 })
         .onChange((value) => {
           if (value.length > 7) {
             this.value = value.slice(0, 7)
@@ -189,20 +204,20 @@ struct SettingPage {
           }
         })
 
-      Row({ space: 32 }) {
+      Row({ space: 48 }) {
         YTButton({
           btContent: '取消',
-          btHeight: 25,
-          btWidth: 78,
+          btHeight: 42,
+          btWidth: 104,
           btBorder: { width: 1, color: '#1A000000' },
+          btFontColor: '#353C46',
           btPadding: {
             left: 26,
             right: 26,
             top: 4,
             bottom: 4
           },
-          bgc: Color.White,
-          btFontColor: $r('sys.color.mask_secondary'),
+          bgc: '#F5F5F7',
           click: () => {
             this.showReviseName = false
             this.value = ''
@@ -211,8 +226,10 @@ struct SettingPage {
         })
         YTButton({
           btContent: '完成',
-          btHeight: 25,
-          btWidth: 78,
+          btHeight: 42,
+          btWidth: 104,
+          btlinear: this.linearInfo,
+          btFontColor: '#353C46',
           btPadding: {
             left: 26,
             right: 26,
@@ -239,7 +256,7 @@ struct SettingPage {
       .width('100%')
 
     }
-    .padding({ left: 22, right: 22, top: 8 })
+    .padding({ left: 22, right: 22, top: 24 })
   }
 
   @Builder

+ 112 - 68
features/user/src/main/ets/views/Mine.ets

@@ -17,6 +17,14 @@ export struct Mine {
   @StorageProp(YTAvoid.SAFE_TOP_KEY) safeTop: number = 0
   @StorageProp(UserInfo.KEY) userInfo: UserInfo = userInfo
   setArr: Array<BasicType<undefined>> = [
+    {
+      text: '分享给好友',
+      message: '去分享',
+      click: () => {
+
+      },
+      src: $r('app.media.right_arrow')
+    },
     {
       text: '意见反馈',
       click: () => {
@@ -55,97 +63,133 @@ export struct Mine {
     }
   ]
 
+  private linearInfo: LinearGradientOptions = {
+    colors: [ ['#B9FD2A', 0.01], ['#F5FD6D', 1] ],
+    angle: 110
+  }
   aboutToAppear(): void {
 
   }
 
   build() {
     Column() {
-      Row() {
-        Row() {
-          Image(this.userInfo.getHeadImg() ?? $r('app.media.app_icon'))
-            .aspectRatio(1)
-            .height(40)
-            .borderRadius(20)
-            .margin({ right: 9 })
+      // 空白占位
+      Row()
+      .height(212)
+
+      // 主体
+      Column(){
+        // 头像 + 编辑按钮
+        Column(){
+          // 头像
+          Row(){
+            Image(this.userInfo.getHeadImg() ?? $r('app.media.app_icon'))
+              .aspectRatio(1)
+              .height(80)
+              .borderRadius(40)
+          }
+          .border({
+            width: 5,
+            color: Color.White
+          })
+          .borderRadius(40)
+          .position({ y: -40 })
+          .onClick(() => {
+            if (this.userInfo.checkLogin()) {
+              yTRouter.router2SettingPage()
+              return
+            }
+            yTRouter.router2LoginPage()
+          })
+
+          // 编辑按钮
+          Row(){
+            Text(this.userInfo.checkLogin() ? "编辑" : "去登录")
+              .fontSize(14)
+              .borderRadius(20)
+              .fontWeight(400)
+              .fontColor(Color.Black)
+              .linearGradient(this.linearInfo)
+              .padding({ left: 14, top: 5, right: 14, bottom: 5 })
+              .onClick(() => {
+                if (this.userInfo.checkLogin()) {
+                  yTRouter.router2SettingPage()
+                  return
+                }
+                yTRouter.router2LoginPage()
+              })
+          }
+          .width("100%")
+          .alignItems(VerticalAlign.Center)
+          .justifyContent(FlexAlign.End)
+          .padding({top: 32})
 
-          Column({ space: 7 }) {
+          // 昵称 + 编辑按钮
+          Row(){
             Text(this.userInfo.getName() ?? this.userInfo.getPhoneNumber() ?? this.userInfo.getId()?.toString() ??
               '未登录')
-              .fontSize($r('[basic].float.page_text_font_size_16'))
+              .fontSize(18)
               .fontColor('Color.Black')
-            Text() {
-              Span('ID:' + (this.userInfo.getId()?.toString().padStart(8, '0') ?? '00000000'))
-              ImageSpan($r('app.media.copy'))
-                .width(7)
-                .height(8)
-                .margin({ left: 4 })
-                .onClick(() => {
-                  copyText((this.userInfo.getId()?.toString().padStart(8, '0') ?? '00000000'))
-                })
-                .offset({ bottom: 4 })
-            }
-            .fontColor('#80000000')
-            .fontSize($r('[basic].float.page_text_font_size_10'))
           }
-          .alignItems(HorizontalAlign.Start)
+          .width("100%")
+          .alignItems(VerticalAlign.Center)
+          .justifyContent(FlexAlign.Start)
         }
-        .onClick(() => {
-
-          if (this.userInfo.checkLogin()) {
-            yTRouter.router2SettingPage()
-            return
-          }
-          yTRouter.router2LoginPage()
-        })
-      }
-      .width('100%')
-      .margin({ bottom: 30 })
 
-      // ShowBannerAd()
-      Column() {
-        List() {
-          ForEach(this.setArr, (item: BasicType<undefined>, index) => {
-            ListItem() {
-              Row() {
-                Text(item.text)
-                  .fontColor('#80000000')
-                  .fontSize(12)
-                if (!index) {
-                  Row() {
-                    Text(this.userInfo.getAiNum()?.toString() ?? '')
-                      .fontWeight(600)
-                      .fontSize($r('[basic].float.page_text_font_size_14'))
+        // 设置项
+        Column() {
+          List({space: 20}) {
+            ForEach(this.setArr, (item: BasicType<undefined>, index) => {
+              ListItem() {
+                Row() {
+                  Text(item.text)
+                    .fontColor('#1C1C1C')
+                    .fontSize(16)
+                  if (item.message) {
+                    Row() {
+                      Text(item.message ?? '')
+                        .fontWeight(400)
+                        .fontColor('#ff989494')
+                        .fontSize($r('[basic].float.page_text_font_size_14'))
+                      Image($r('app.media.right_arrow'))
+                        .width(24)
+                        .aspectRatio(1)
+                        .opacity(0.7)
+                    }
+                  } else {
                     Image($r('app.media.right_arrow'))
                       .width(24)
                       .aspectRatio(1)
+                      .opacity(0.7)
                   }
-                } else {
-                  Image($r('app.media.right_arrow'))
-                    .width(24)
-                    .aspectRatio(1)
                 }
+                .width('100%')
+                .height(36)
+                .justifyContent(FlexAlign.SpaceBetween)
+                // .padding({ top: 10, bottom: 10 })
+                .onClick(() => {
+                  item.click?.()
+                })
               }
-              .width('100%')
-              .height(36)
-              .justifyContent(FlexAlign.SpaceBetween)
-              .onClick(() => {
-                item.click?.()
-              })
-            }
-          })
+            })
+          }
+          .divider({ strokeWidth: 1, color: '#0A000000', endMargin: 10 })
+          .margin({ top: 30 })
+          .width('100%')
+          .height('100%')
         }
-        .padding({ left: 12, right: 4 })
-        .divider({ strokeWidth: 1, color: '#0A000000', endMargin: 8 })
-        .margin({ top: 30 })
+        .layoutWeight(1)
         .width('100%')
-        .height('100%')
       }
-      .layoutWeight(1)
-      .width('100%')
-
+      .width("100%")
+      .backgroundColor(Color.White)
+      .justifyContent(FlexAlign.Start)
+      .alignItems(HorizontalAlign.Start)
+      .padding({ left: 24, right: 24 })
     }
-    .padding({ top: this.safeTop + 22, left: 16, right: 16 })
     .height('100%')
+    .backgroundImage($r('app.media.Mine_Bg'))
+    .backgroundImageSize(ImageSize.Contain)
+
   }
 }

二进制
features/user/src/main/resources/base/media/Mine_Bg.png


+ 1 - 0
features/user/src/main/resources/base/media/diary_back.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1755071625373" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6319" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M395.21518 513.604544l323.135538-312.373427c19.052938-18.416442 19.052938-48.273447 0-66.660212-19.053961-18.416442-49.910737-18.416442-68.964698 0L291.75176 480.290811c-19.052938 18.416442-19.052938 48.273447 0 66.660212l357.633237 345.688183c9.525957 9.207709 22.01234 13.796214 34.497699 13.796214 12.485359 0 24.971741-4.588505 34.466999-13.82896 19.052938-18.416442 19.052938-48.242747 0-66.660212L395.21518 513.604544z" fill="#272636" p-id="6320"></path></svg>

+ 7 - 0
features/user/src/main/resources/base/profile/router_map.json

@@ -49,6 +49,13 @@
       "data": {
         "description": "this is DelPhotoPage"
       }
+    },{
+      "name": "ChangePassWord",
+      "pageSourceFile": "src/main/ets/pages/ChangePassword.ets",
+      "buildFunction": "ChangePassWordBuilder",
+      "data": {
+        "description": "this is DelPhotoPage"
+      }
     }
   ]
 }

+ 1 - 1
products/entry/src/main/ets/pages/Index.ets

@@ -37,7 +37,7 @@ struct Index {
   build() {
     Navigation(yTRouter) {
       Column() {
-        Tabs({ controller: this.tabsController, index: 0 }) {
+        Tabs({ controller: this.tabsController, index: 1 }) {
           ForEach(this.contentList, (_: BasicType<undefined>, index) => {
             TabContent() {
               if (index == 0) {

+ 1 - 1
products/entry/src/main/resources/base/element/string.json

@@ -10,7 +10,7 @@
     },
     {
       "name": "EntryAbility_label",
-      "value": "label"
+      "value": "朝暮日记"
     },
     {
       "name": "reason",