Kaynağa Gözat

feat: 完成 《采购清单》 详情页 UI 和 交互

YuJing 1 ay önce
ebeveyn
işleme
75e0a5a0fc

+ 2 - 0
features/feature/src/main/ets/components/_YtHeader.ets

@@ -1,3 +1,5 @@
+import { YTAvoid } from "basic"
+
 @ComponentV2
 export struct _YtHeader {
   @Param isShowBackComp: boolean = true

+ 12 - 0
features/feature/src/main/ets/model/Index.ets

@@ -69,6 +69,18 @@ export class BabyInfo {
       name: info.name,
     } as BabyInfo
   }
+
+  // 覆盖赋值
+  static override(info: BabyInfo ,newInfo: BabyInfo){
+    info.avatarUrl = newInfo.avatarUrl;
+    info.backgroundUrl = newInfo.backgroundUrl;
+    info.birthday = newInfo.birthday;
+    info.gender = newInfo.gender;
+    info.id = newInfo.id;
+    info.name = newInfo.name;
+    info.days = newInfo.days;
+    info.userId = newInfo.userId;
+  }
 }
 
 // 本周食谱

+ 101 - 0
features/feature/src/main/ets/pages/PurchasingPage.ets

@@ -0,0 +1,101 @@
+import { YTAvoid, yTRouter } from 'basic'
+import { _YtHeader } from '../components/_YtHeader'
+import { AppStorageV2 } from '@kit.ArkUI'
+import { BabyInfo, PurchaseList } from '../model/Index'
+import { BabyFoodApi } from '../Apis/BabyFoodApi'
+
+// 采购清单页面
+@ComponentV2
+struct PurchasingPage {
+  @Local safeTop: number = 0
+  @Local babyInfo: BabyInfo = AppStorageV2.connect<BabyInfo>(BabyInfo, () => new BabyInfo())!
+  // 本周的采购清单
+  @Local purchaseList?: PurchaseList[]
+
+
+  _onBackPress(){
+    yTRouter.pop('')
+    return true
+  }
+
+  // 获取本周所有采购清单
+  async getWeeklyPurchaseList(): Promise<void>{
+    this.purchaseList = await BabyFoodApi.getWeeklyPurchaseList(this.babyInfo.id!)
+  }
+
+  // 修改购买状态 - 清单 id
+  async updateBuyStatus(Id: number, index: number){
+    try {
+      let ans = await BabyFoodApi.updatePurchaseStatus(Id)
+      let l = this.purchaseList![index]
+      l.purchased = l.purchased == '1' ? '0' : '1'
+      this.purchaseList?.splice(index, 1, l)
+    } catch (e) {
+      console.log(`e = ${JSON.stringify(e)}`)
+    }
+  }
+
+  aboutToAppear(): void {
+    this.safeTop = AppStorage.get(YTAvoid.SAFE_TOP_KEY) as number
+
+    this.getWeeklyPurchaseList()
+  }
+
+  build() {
+    NavDestination() {
+      Column() {
+        _YtHeader({
+          title: '采购清单',
+          _onBackPress: () => { this._onBackPress() },
+        })
+
+        Column(){
+          List({space: 12}){
+            ForEach(this.purchaseList, (item: number, index: number) =>{
+              ListItem(){
+                Row(){
+                  Text(){
+                    Span(this.purchaseList?.[index].ingredientName ?? '南瓜')
+                    Span('-')
+                    Span((this.purchaseList?.[index].amount ?? 1) + '')
+                    Span(this.purchaseList?.[index].unit ?? 'g')
+                  }
+                  .fontSize(14)
+                  .fontColor('#4F4F4F')
+
+                  // 是否购买按钮
+                  Image(this.purchaseList?.[index].purchased == '1' ?
+                  $r('app.media.icon_select') : $r('app.media.icon_unSelect'))
+                    .width(20)
+                    .aspectRatio(1)
+                    .onClick(() => { this.updateBuyStatus(this.purchaseList?.[index].id ?? 0, index) })
+                }
+                .width("100%")
+                .borderRadius(10)
+                .backgroundColor(Color.White)
+                .justifyContent(FlexAlign.SpaceBetween)
+                .padding({ left: 16, right: 16, top: 15, bottom: 10 })
+              }
+            })
+          }
+          .width('100%')
+          .height('100%')
+          .scrollBar(BarState.Off)
+        }
+        .width('100%')
+        .layoutWeight(1)
+        .alignItems(HorizontalAlign.Center)
+        .justifyContent(FlexAlign.Center)
+      }
+    }
+    .hideTitleBar(true)
+    .backgroundColor('#F7F9FA')
+    .onBackPressed(() => { return this._onBackPress() })
+    .padding({ top: this.safeTop, left: 25, right: 25, bottom: 30 })
+  }
+}
+
+@Builder
+function PurchasingBuilder() {
+  PurchasingPage()
+}

+ 4 - 0
features/feature/src/main/ets/utils/RouterUtils.ets

@@ -4,6 +4,10 @@ class RouterUtils{
   router2IncreaseBabyInfo(back?: Callback<PopInfo>){
     yTRouter.pushPathByName('IncreaseBabyInfo', null, back, true)
   }
+
+  router2PurchasingPage(back?: Callback<PopInfo>){
+    yTRouter.pushPathByName('PurchasingPage', null, back, true)
+  }
 }
 
 export const routerUtils = new RouterUtils()

+ 5 - 3
features/feature/src/main/ets/viewModel/MainViewModel.ets

@@ -11,7 +11,7 @@ export class MainViewModel{
   // 当前选择的宝宝信息
   @Trace selectedBabyIndex: number = 0
   // 当前的宝宝信息
-  @Trace babyInfo: BabyInfo = new BabyInfo()
+  @Trace babyInfo: BabyInfo = AppStorageV2.connect<BabyInfo>(BabyInfo, () => new BabyInfo())!
   // 用户信息
   @Trace userInfo: UserInfo = AppStorageV2.connect<UserInfo>(UserInfo, 'UserInfo', () => userInfo)!
   // 菜品下拉菜单
@@ -65,7 +65,7 @@ export class MainViewModel{
 
   // 修改选中的宝宝信息
   updateBabyInfo(index: number) {
-    this.babyInfo = this.babyList[index]
+    BabyInfo.override(this.babyInfo, this.babyList[index])
     this.selectedBabyIndex = index
   }
 
@@ -143,7 +143,9 @@ export class MainViewModel{
 
   // 跳转至采购详情页
   goToPurchaseDetail() {
-
+    routerUtils.router2PurchasingPage((res) => {
+      this.getWeeklyPurchaseList()
+    })
   }
 
   /**

+ 4 - 0
features/feature/src/main/resources/base/profile/router_map.json

@@ -8,6 +8,10 @@
       "name": "IncreaseBabyInfo",
       "pageSourceFile": "src/main/ets/pages/IncreaseBabyInfo.ets",
       "buildFunction": "IncreaseBabyInfoBuilder"
+    }, {
+      "name": "PurchasingPage",
+      "pageSourceFile": "src/main/ets/pages/PurchasingPage.ets",
+      "buildFunction": "PurchasingBuilder"
     }
   ]
 }