b

entry/src/main/config.json

@@ -121,11 +121,25 @@
             "scheduledUpdateTime": "10:30",
             "defaultDimension": "2*2",
             "name": "widget",
-            "description": "爱泊客停车缴费",
+            "description": "爱泊客停车缴费1",
+            "colorMode": "auto",
+            "type": "JS",
+            "supportDimensions": [
+              "2*2"
+            ],
+            "updateEnabled": true,
+            "updateDuration": 1
+          },
+          {
+            "jsComponentName": "widget1",
+            "isDefault": false,
+            "scheduledUpdateTime": "10:30",
+            "defaultDimension": "2*2",
+            "name": "widget1",
+            "description": "爱泊客停车缴费2",
             "colorMode": "auto",
             "type": "JS",
             "supportDimensions": [
-              "2*4",
               "2*2"
             ],
             "updateEnabled": true,

entry/src/main/java/com/fujica/abk/api/auth.java

@@ -28,7 +28,7 @@ import java.util.concurrent.CompletableFuture;
 public class auth {
     // 登录状态标志，防止并发登录
     private static boolean authing = false;
-    
+
     /**
      * 登录
      *
@@ -50,32 +50,37 @@ public class auth {
             future.complete(true);
             return future;
         }
-        
+
         // 设置登录状态
         authing = true;
-        
-        // 登录之前先显示授权确认弹框
-        // 确保在主线程中执行
-        context.getUITaskDispatcher().asyncDispatch(() -> {
-            AuthorizationDialog authDialog = new AuthorizationDialog(context);
-            authDialog.setOnAuthorizationListener(new AuthorizationDialog.OnAuthorizationListener() {
-                @Override
-                public void onAuthorized() {
-                    // 用户确认授权后，继续登录流程
-                    proceedWithLogin(context, future);
-                }
 
-                @Override
-                public void onCancelled() {
-                    // 用户取消授权
-                    Toast.error(context, "已取消授权");
-                    authing = false; // 重置登录状态
-                    future.complete(false);
-                }
+        if (true) {
+            proceedWithLogin(context, future);
+        } else {
+            // 登录之前先显示授权确认弹框
+            // 确保在主线程中执行
+            context.getUITaskDispatcher().asyncDispatch(() -> {
+                AuthorizationDialog authDialog = new AuthorizationDialog(context);
+                authDialog.setOnAuthorizationListener(new AuthorizationDialog.OnAuthorizationListener() {
+                    @Override
+                    public void onAuthorized() {
+                        // 用户确认授权后，继续登录流程
+                        proceedWithLogin(context, future);
+                    }
+
+                    @Override
+                    public void onCancelled() {
+                        // 用户取消授权
+                        Toast.error(context, "已取消授权");
+                        authing = false; // 重置登录状态
+                        future.complete(false);
+                    }
+                });
+                authDialog.show();
             });
-            authDialog.show();
-        });
-        
+        }
+
+
         return future;
     }
 
@@ -113,6 +118,7 @@ public class auth {
             // 先获取华为账号信息
             getHuaWeiAccount(context).thenAccept(hwResult -> {
                 if (!hwResult.isSuccess()) {
+                    authing = false; // 重置登录状态
                     future.complete(false);
                     return;
                 }
@@ -227,6 +233,7 @@ public class auth {
         // });
 
         // 暂时返回false，需要根据实际项目中的PhoneDialog实现进行调整
+        authing = false; // 重置登录状态
         future.complete(false);
     }
 
@@ -261,17 +268,14 @@ public class auth {
 
             // 先尝试静默登录
             Task<AuthAccount> taskSilentSignIn = accountAuthService.silentSignIn();
-            taskSilentSignIn.addOnSuccessListener(new OnSuccessListener<AuthAccount>() {
-                @Override
-                public void onSuccess(AuthAccount authAccount) {
-                    HWResult result = new HWResult(true);
-                    result.setAppId(config.appId);
-                    result.setOpenId(authAccount.getOpenId());
-                    result.setUnionId(authAccount.getUnionId());
-                    // HMS SDK可能不直接提供手机号，需要单独申请权限
-                    result.setPhone("");
-                    future.complete(result);
-                }
+            taskSilentSignIn.addOnSuccessListener(authAccount -> {
+                HWResult result = new HWResult(true);
+                result.setAppId(config.appId);
+                result.setOpenId(authAccount.getOpenId());
+                result.setUnionId(authAccount.getUnionId());
+                // HMS SDK可能不直接提供手机号，需要单独申请权限
+                result.setPhone("");
+                future.complete(result);
             });
 
             taskSilentSignIn.addOnFailureListener(new OnFailureListener() {

entry/src/main/java/com/fujica/abk/api/cache.java

@@ -387,7 +387,7 @@ public class cache {
      * 获取车牌号（兼容旧代码）
      */
     public static String getLicensePlate(Context context) {
-        return "粤B11111";
+        return "";
 //        return getPlateNo(context);
     }
 

entry/src/main/java/com/fujica/abk/api/config.java

@@ -4,7 +4,7 @@ package com.fujica.abk.api;
  * 配置类
  */
 public class config {
-//    public static String appId = "6917567451779658527"; // 需要替换为实际的appId
+//    public static String appId = "6917590990169282724"; // 需要替换为实际的appId
     public static String appId = "wxd3598cc7953b6a59"; // 查询支付记录
 
 

entry/src/main/java/com/fujica/abk/component/ParkDetailComponent.java

@@ -3,7 +3,10 @@ package com.fujica.abk.component;
 import com.fujica.abk.ResourceTable;
 import com.fujica.abk.model.out.ParkNearRes;
 import com.fujica.abk.utils.Log;
+import ohos.agp.colors.RgbColor;
 import ohos.agp.components.*;
+import ohos.agp.components.element.ShapeElement;
+import ohos.agp.utils.Color;
 import ohos.app.Context;
 
 /**
@@ -54,19 +57,19 @@ public class ParkDetailComponent extends DirectionalLayout {
 
         try {
             // 设置停车场名称
-            Text nameText = (Text) rootLayout.findComponentById(ResourceTable.Id_detail_park_name);
+            Text nameText = (Text) rootLayout.findComponentById(ResourceTable.Id_park_name);
             if (nameText != null && parkData.getParkName() != null) {
                 nameText.setText(parkData.getParkName());
             }
 
             // 设置地址
-            Text addressText = (Text) rootLayout.findComponentById(ResourceTable.Id_detail_address);
+            Text addressText = (Text) rootLayout.findComponentById(ResourceTable.Id_parking_address_2);
             if (addressText != null) {
                 addressText.setText(parkData.getAddress() != null ? parkData.getAddress() : "--");
             }
 
             // 设置距离
-            Text distanceText = (Text) rootLayout.findComponentById(ResourceTable.Id_detail_distance);
+            Text distanceText = (Text) rootLayout.findComponentById(ResourceTable.Id_parking_address_1);
             if (distanceText != null) {
                 String distanceStr = parkData.getDistance() != null ?
                         String.format("%.1fkm", parkData.getDistance() / 1000.0) : "0km";
@@ -74,26 +77,121 @@ public class ParkDetailComponent extends DirectionalLayout {
             }
 
             // 设置总车位
-            Text totalPlaceText = (Text) rootLayout.findComponentById(ResourceTable.Id_detail_total_place);
+            Text totalPlaceText = (Text) rootLayout.findComponentById(ResourceTable.Id_text_total_place);
             if (totalPlaceText != null && parkData.getTotalPlace() != null) {
                 totalPlaceText.setText(String.valueOf(parkData.getTotalPlace()));
             }
 
             // 设置剩余车位
-            Text residuePlaceText = (Text) rootLayout.findComponentById(ResourceTable.Id_detail_residue_place);
+            Text residuePlaceText = (Text) rootLayout.findComponentById(ResourceTable.Id_text_residue_place);
             if (residuePlaceText != null && parkData.getResiduePlace() != null) {
                 residuePlaceText.setText(String.valueOf(parkData.getResiduePlace()));
             }
 
             // 设置免费时长
-            Text freeTimeText = (Text) rootLayout.findComponentById(ResourceTable.Id_detail_free_time);
+            Text freeTimeText = (Text) rootLayout.findComponentById(ResourceTable.Id_text_free_duration);
             if (freeTimeText != null) {
                 freeTimeText.setText(parkData.getFreeTime() != null ? parkData.getFreeTime() + "分" : "--");
             }
+
+            // 设置服务标签
+            addServiceTags();
+
+            // 设置收费信息
+            Text chargeInfoText = (Text) rootLayout.findComponentById(ResourceTable.Id_charge_info);
+            if (chargeInfoText != null) {
+                String chargeInfo = parkData.getChargeInfo();
+                chargeInfoText.setText(chargeInfo != null && !chargeInfo.isEmpty() ? chargeInfo : "暂无信息");
+            }
+
+            // 设置导航按钮点击事件
+            Button btnNavigate = (Button) rootLayout.findComponentById(ResourceTable.Id_btn_navigate);
+            if (btnNavigate != null) {
+                btnNavigate.setClickedListener(component -> {
+                    // TODO: 实现导航功能
+                    Log.info("导航到停车场: " + parkData.getParkName());
+                });
+            }
         } catch (Exception e) {
             Log.error("绑定停车场详情数据失败: " + e.getMessage());
             e.printStackTrace();
         }
     }
+
+    /**
+     * 添加服务标签
+     */
+    private void addServiceTags() {
+        DirectionalLayout tagsContainer = (DirectionalLayout) rootLayout.findComponentById(ResourceTable.Id_service_tags_container);
+        if (tagsContainer == null) {
+            return;
+        }
+
+        // 清空容器
+        tagsContainer.removeAllComponents();
+
+        // 在线支付
+        if (parkData.getOnlinePayEnable() != null && parkData.getOnlinePayEnable() == 1) {
+            tagsContainer.addComponent(createTag("在线支付"));
+        }
+
+        // 电子发票
+//        if (parkData.getInvoiceEnable() != null && parkData.getInvoiceEnable() == 1) {
+//            tagsContainer.addComponent(createTag("电子发票"));
+//        }
+
+        // 电子优惠券
+        if (parkData.getReductionEnable() != null && parkData.getReductionEnable() == 1) {
+            tagsContainer.addComponent(createTag("电子优惠券"));
+        }
+
+        // 去找车
+//        if (parkData.getIsfindcar() != null && parkData.getIsfindcar() == 1) {
+//            tagsContainer.addComponent(createTag("去找车"));
+//        }
+
+        // 预约车位
+//        if (parkData.getReservationEnable() != null && parkData.getReservationEnable() == 1) {
+//            tagsContainer.addComponent(createTag("预约车位"));
+//        }
+
+        // 如果没有标签，隐藏容器
+        if (tagsContainer.getChildCount() == 0) {
+            tagsContainer.setVisibility(Component.HIDE);
+        } else {
+            tagsContainer.setVisibility(Component.VISIBLE);
+        }
+    }
+
+    /**
+     * 创建标签组件
+     */
+    private Text createTag(String text) {
+        Text tag = new Text(rootLayout.getContext());
+        tag.setText(text);
+        tag.setTextSize(11, Text.TextSizeType.FP);
+        tag.setTextColor(new Color(0xFFFA6332));
+        
+        // 设置边框和圆角
+        ShapeElement background = new ShapeElement();
+        background.setShape(ShapeElement.RECTANGLE);
+        background.setRgbColor(new RgbColor(255, 255, 255));
+        background.setCornerRadius(3);
+        background.setStroke(1, new RgbColor(250, 99, 50)); // #FA6332
+        tag.setBackground(background);
+        
+        // 设置内边距
+        tag.setPadding(8, 4, 8, 4);
+        
+        // 设置布局参数
+        DirectionalLayout.LayoutConfig layoutConfig = new DirectionalLayout.LayoutConfig(
+                ComponentContainer.LayoutConfig.MATCH_CONTENT,
+                ComponentContainer.LayoutConfig.MATCH_CONTENT
+        );
+        layoutConfig.setMarginRight(8);
+        tag.setLayoutConfig(layoutConfig);
+        
+        return tag;
+    }
 }
 

entry/src/main/java/com/fujica/abk/component/nav/ChargeComponent.java

@@ -5,11 +5,16 @@ import com.fujica.abk.api.cache;
 import com.fujica.abk.api.pay;
 import com.fujica.abk.component.LoadingComponent;
 import com.fujica.abk.model.in.ChargeQuery;
+import com.fujica.abk.model.out.MemberPlateH5Dto;
+import com.fujica.abk.model.out.OrderDetailRes;
 import com.fujica.abk.model.out.ParkingFeeInfo;
 import com.fujica.abk.utils.*;
+import com.google.gson.reflect.TypeToken;
+import ohos.aafwk.ability.DataAbilityHelper;
+import ohos.aafwk.ability.IDataAbilityObserver;
 import ohos.agp.components.*;
 import ohos.app.Context;
-import ohos.eventhandler.EventRunner;
+import ohos.sysappcomponents.settings.SystemSettings;
 
 import java.util.concurrent.CompletableFuture;
 
@@ -203,17 +208,67 @@ public class ChargeComponent extends DirectionalLayout {
         licensePlateInputDialog.show();
     }
 
+    private String plateNo = "";
+
+    DataAbilityHelper dataAbilityHelper;
+    IDataAbilityObserver dataAbilityObserver;
+
+
+//        if (dataAbilityHelper != null) {
+//        dataAbilityHelper.unregisterObserver(SystemSettings.getUri(SystemSettings.Date.TIME_FORMAT), dataAbilityObserver);
+//    }
+
     /**
      * 检查缓存并更新UI
      */
     private void checkCacheAndUpdateUI() {
-        String licensePlate = cache.getLicensePlate(context);
+        if (plateNo == null || plateNo.isEmpty()) {
+            if (dataAbilityHelper == null) {
+                dataAbilityHelper = DataAbilityHelper.creator(getContext());
+            }
+            // 发起异步请求获取默认车牌
+            CompletableFuture<R<MemberPlateH5Dto>> future = api.http(context, new ApiOption("/member/plate/default"), new TypeToken<R<MemberPlateH5Dto>>() {});
+            future.thenAccept(result -> {
+                // 处理响应结果
+                if (result != null && result.isSuccess() && result.getData() != null) {
+                    MemberPlateH5Dto plateData = result.getData();
+                    if (plateData.getPlateNo() != null && !plateData.getPlateNo().isEmpty()) {
+                        plateNo = plateData.getPlateNo();
+                    }
+                }
+                if(plateNo == null || plateNo.isEmpty()){
+                    plateNo = SystemSettings.getValue(dataAbilityHelper, "car_license_plate_number");
+                }
+                // 异步请求完成后，更新UI（确保在主线程执行）
+                DialogUtil.postTask(() -> {
+                    updateUIAfterPlateNoLoaded();
+                });
+            }).exceptionally(throwable -> {
+                // 异常处理：从系统设置中读取备用数据
+                if(plateNo == null || plateNo.isEmpty()){
+                    plateNo = SystemSettings.getValue(dataAbilityHelper, "car_license_plate_number");
+                }
+                // 异常情况下也要更新UI（确保在主线程执行）
+                DialogUtil.postTask(() -> {
+                    updateUIAfterPlateNoLoaded();
+                });
+                return null;
+            });
+        } else {
+            // 已经有plateNo，直接更新UI
+            updateUIAfterPlateNoLoaded();
+        }
+    }
 
-        if (licensePlate != null && !licensePlate.isEmpty()) {
+    /**
+     * 加载plateNo后更新UI
+     */
+    private void updateUIAfterPlateNoLoaded() {
+        if (plateNo != null && !plateNo.isEmpty()) {
             // 有缓存，直接查询计费
-            queryParkingFee(licensePlate);
+            queryParkingFee(plateNo);
             filterPlateNo.setVisibility(VISIBLE);
-            textPlateNo.setText(licensePlate);
+            textPlateNo.setText(plateNo);
         } else {
             // 无缓存，显示添加车辆卡片
             showAddVehicleCard();

entry/src/main/java/com/fujica/abk/model/out/MemberPlateH5Dto.java

@@ -0,0 +1,17 @@
+package com.fujica.abk.model.out;
+
+/**
+ * 绑定车牌
+ */
+public class MemberPlateH5Dto {
+    private String plateNo;
+
+    public String getPlateNo() {
+        return plateNo;
+    }
+
+    public void setPlateNo(String plateNo) {
+        this.plateNo = plateNo;
+    }
+}
+

entry/src/main/java/com/fujica/abk/model/out/OrderDetailRes.java

@@ -0,0 +1,263 @@
+package com.fujica.abk.model.out;
+
+/**
+ * 订单响应数据
+ */
+public class OrderDetailRes {
+    // 基本信息
+    private String orderId;           // 订单ID
+    private String payNo;             // 支付流水号
+    private String goodsName;         // 商品名称
+    private Integer bizType;          // 业务类型 1=临停, 2=月卡
+    private String parkId;            // 车场ID
+    private String parkName;          // 车场名称
+    private String plateNo;           // 车牌号
+    
+    // 金额相关
+    private Double amount;            // 订单金额（元）
+    private Double totalAmount;       // 总金额（分）
+    private Double actualAmount;      // 实付金额（分）
+    private Double discountAmount;    // 优惠金额（分）
+    
+    // 时间相关
+    private String paySuccessTime;    // 支付成功时间
+    private String paySuccessTimeStr; // 支付成功时间字符串
+    private String inTimeStr;         // 入场时间
+    private String stayTime;          // 停车时长
+    
+    // 支付方式
+    private String payWayCode;        // 支付方式名称
+    private String payWayName;        // 支付方式名称
+    private String paymentWayName;    // 支付方式名称（月卡用）
+    
+    // 月卡相关字段
+    private Integer parkingLot;       // 车位数量
+    private String cardTypeName;      // 套餐名称
+    private String cardTypeUnitPrice; // 套餐单价
+    private Integer cardCopies;       // 购买数量
+    private Integer period;           // 周期
+    private String beforeExpireTime;  // 原到期时间
+    private String startTime;         // 开始时间
+    private String endTime;           // 结束时间
+    
+    // 发票相关
+    private Integer invoiceStatus;    // 发票状态 0=未开票, 2=已开票
+
+    // Getters and Setters
+    public String getOrderId() {
+        return orderId;
+    }
+
+    public void setOrderId(String orderId) {
+        this.orderId = orderId;
+    }
+
+    public String getPayNo() {
+        return payNo;
+    }
+
+    public void setPayNo(String payNo) {
+        this.payNo = payNo;
+    }
+
+    public String getGoodsName() {
+        return goodsName;
+    }
+
+    public void setGoodsName(String goodsName) {
+        this.goodsName = goodsName;
+    }
+
+    public Integer getBizType() {
+        return bizType;
+    }
+
+    public void setBizType(Integer bizType) {
+        this.bizType = bizType;
+    }
+
+    public String getParkId() {
+        return parkId;
+    }
+
+    public void setParkId(String parkId) {
+        this.parkId = parkId;
+    }
+
+    public String getParkName() {
+        return parkName;
+    }
+
+    public void setParkName(String parkName) {
+        this.parkName = parkName;
+    }
+
+    public String getPlateNo() {
+        return plateNo;
+    }
+
+    public void setPlateNo(String plateNo) {
+        this.plateNo = plateNo;
+    }
+
+    public Double getAmount() {
+        return amount;
+    }
+
+    public void setAmount(Double amount) {
+        this.amount = amount;
+    }
+
+    public Double getTotalAmount() {
+        return totalAmount;
+    }
+
+    public void setTotalAmount(Double totalAmount) {
+        this.totalAmount = totalAmount;
+    }
+
+    public Double getActualAmount() {
+        return actualAmount;
+    }
+
+    public void setActualAmount(Double actualAmount) {
+        this.actualAmount = actualAmount;
+    }
+
+    public Double getDiscountAmount() {
+        return discountAmount;
+    }
+
+    public void setDiscountAmount(Double discountAmount) {
+        this.discountAmount = discountAmount;
+    }
+
+    public String getPaySuccessTime() {
+        return paySuccessTime;
+    }
+
+    public void setPaySuccessTime(String paySuccessTime) {
+        this.paySuccessTime = paySuccessTime;
+    }
+
+    public String getPaySuccessTimeStr() {
+        return paySuccessTimeStr;
+    }
+
+    public void setPaySuccessTimeStr(String paySuccessTimeStr) {
+        this.paySuccessTimeStr = paySuccessTimeStr;
+    }
+
+    public String getInTimeStr() {
+        return inTimeStr;
+    }
+
+    public void setInTimeStr(String inTimeStr) {
+        this.inTimeStr = inTimeStr;
+    }
+
+    public String getStayTime() {
+        return stayTime;
+    }
+
+    public void setStayTime(String stayTime) {
+        this.stayTime = stayTime;
+    }
+
+    public String getPayWayName() {
+        return payWayName;
+    }
+
+    public void setPayWayName(String payWayName) {
+        this.payWayName = payWayName;
+    }
+
+    public String getPayWayCode() {
+        return payWayCode;
+    }
+
+    public void setPayWayCode(String payWayCode) {
+        this.payWayCode = payWayCode;
+    }
+
+    public String getPaymentWayName() {
+        return paymentWayName;
+    }
+
+    public void setPaymentWayName(String paymentWayName) {
+        this.paymentWayName = paymentWayName;
+    }
+
+    public Integer getParkingLot() {
+        return parkingLot;
+    }
+
+    public void setParkingLot(Integer parkingLot) {
+        this.parkingLot = parkingLot;
+    }
+
+    public String getCardTypeName() {
+        return cardTypeName;
+    }
+
+    public void setCardTypeName(String cardTypeName) {
+        this.cardTypeName = cardTypeName;
+    }
+
+    public String getCardTypeUnitPrice() {
+        return cardTypeUnitPrice;
+    }
+
+    public void setCardTypeUnitPrice(String cardTypeUnitPrice) {
+        this.cardTypeUnitPrice = cardTypeUnitPrice;
+    }
+
+    public Integer getCardCopies() {
+        return cardCopies;
+    }
+
+    public void setCardCopies(Integer cardCopies) {
+        this.cardCopies = cardCopies;
+    }
+
+    public Integer getPeriod() {
+        return period;
+    }
+
+    public void setPeriod(Integer period) {
+        this.period = period;
+    }
+
+    public String getBeforeExpireTime() {
+        return beforeExpireTime;
+    }
+
+    public void setBeforeExpireTime(String beforeExpireTime) {
+        this.beforeExpireTime = beforeExpireTime;
+    }
+
+    public String getStartTime() {
+        return startTime;
+    }
+
+    public void setStartTime(String startTime) {
+        this.startTime = startTime;
+    }
+
+    public String getEndTime() {
+        return endTime;
+    }
+
+    public void setEndTime(String endTime) {
+        this.endTime = endTime;
+    }
+
+    public Integer getInvoiceStatus() {
+        return invoiceStatus;
+    }
+
+    public void setInvoiceStatus(Integer invoiceStatus) {
+        this.invoiceStatus = invoiceStatus;
+    }
+}
+

entry/src/main/java/com/fujica/abk/model/out/OrderRes.java

@@ -4,11 +4,60 @@ package com.fujica.abk.model.out;
  * 订单响应数据
  */
 public class OrderRes {
-    private String goodsName;
-    private Integer bizType; // 1=停车, 2=月卡
-    private String parkName;
-    private String paySuccessTime;
-    private Double actualAmount;
+    // 基本信息
+    private String orderId;           // 订单ID
+    private String payNo;             // 支付流水号
+    private String goodsName;         // 商品名称
+    private Integer bizType;          // 业务类型 1=临停, 2=月卡
+    private String parkId;            // 车场ID
+    private String parkName;          // 车场名称
+    private String plateNo;           // 车牌号
+    
+    // 金额相关
+    private Double amount;            // 订单金额（元）
+    private Double totalAmount;       // 总金额（分）
+    private Double actualAmount;      // 实付金额（分）
+    private Double discountAmount;    // 优惠金额（分）
+    
+    // 时间相关
+    private String paySuccessTime;    // 支付成功时间
+    private String paySuccessTimeStr; // 支付成功时间字符串
+    private String inTimeStr;         // 入场时间
+    private String stayTime;          // 停车时长
+    
+    // 支付方式
+    private String payWayName;        // 支付方式名称
+    private String paymentWayName;    // 支付方式名称（月卡用）
+    
+    // 月卡相关字段
+    private Integer parkingLot;       // 车位数量
+    private String cardTypeName;      // 套餐名称
+    private String cardTypeUnitPrice; // 套餐单价
+    private Integer cardCopies;       // 购买数量
+    private Integer period;           // 周期
+    private String beforeExpireTime;  // 原到期时间
+    private String startTime;         // 开始时间
+    private String endTime;           // 结束时间
+    
+    // 发票相关
+    private Integer invoiceStatus;    // 发票状态 0=未开票, 2=已开票
+
+    // Getters and Setters
+    public String getOrderId() {
+        return orderId;
+    }
+
+    public void setOrderId(String orderId) {
+        this.orderId = orderId;
+    }
+
+    public String getPayNo() {
+        return payNo;
+    }
+
+    public void setPayNo(String payNo) {
+        this.payNo = payNo;
+    }
 
     public String getGoodsName() {
         return goodsName;
@@ -19,14 +68,21 @@ public class OrderRes {
     }
 
     public Integer getBizType() {
-//        return bizType;
-        return  1;
+        return bizType;
     }
 
     public void setBizType(Integer bizType) {
         this.bizType = bizType;
     }
 
+    public String getParkId() {
+        return parkId;
+    }
+
+    public void setParkId(String parkId) {
+        this.parkId = parkId;
+    }
+
     public String getParkName() {
         return parkName;
     }
@@ -35,12 +91,28 @@ public class OrderRes {
         this.parkName = parkName;
     }
 
-    public String getPaySuccessTime() {
-        return paySuccessTime;
+    public String getPlateNo() {
+        return plateNo;
     }
 
-    public void setPaySuccessTime(String paySuccessTime) {
-        this.paySuccessTime = paySuccessTime;
+    public void setPlateNo(String plateNo) {
+        this.plateNo = plateNo;
+    }
+
+    public Double getAmount() {
+        return amount;
+    }
+
+    public void setAmount(Double amount) {
+        this.amount = amount;
+    }
+
+    public Double getTotalAmount() {
+        return totalAmount;
+    }
+
+    public void setTotalAmount(Double totalAmount) {
+        this.totalAmount = totalAmount;
     }
 
     public Double getActualAmount() {
@@ -50,5 +122,133 @@ public class OrderRes {
     public void setActualAmount(Double actualAmount) {
         this.actualAmount = actualAmount;
     }
+
+    public Double getDiscountAmount() {
+        return discountAmount;
+    }
+
+    public void setDiscountAmount(Double discountAmount) {
+        this.discountAmount = discountAmount;
+    }
+
+    public String getPaySuccessTime() {
+        return paySuccessTime;
+    }
+
+    public void setPaySuccessTime(String paySuccessTime) {
+        this.paySuccessTime = paySuccessTime;
+    }
+
+    public String getPaySuccessTimeStr() {
+        return paySuccessTimeStr;
+    }
+
+    public void setPaySuccessTimeStr(String paySuccessTimeStr) {
+        this.paySuccessTimeStr = paySuccessTimeStr;
+    }
+
+    public String getInTimeStr() {
+        return inTimeStr;
+    }
+
+    public void setInTimeStr(String inTimeStr) {
+        this.inTimeStr = inTimeStr;
+    }
+
+    public String getStayTime() {
+        return stayTime;
+    }
+
+    public void setStayTime(String stayTime) {
+        this.stayTime = stayTime;
+    }
+
+    public String getPayWayName() {
+        return payWayName;
+    }
+
+    public void setPayWayName(String payWayName) {
+        this.payWayName = payWayName;
+    }
+
+    public String getPaymentWayName() {
+        return paymentWayName;
+    }
+
+    public void setPaymentWayName(String paymentWayName) {
+        this.paymentWayName = paymentWayName;
+    }
+
+    public Integer getParkingLot() {
+        return parkingLot;
+    }
+
+    public void setParkingLot(Integer parkingLot) {
+        this.parkingLot = parkingLot;
+    }
+
+    public String getCardTypeName() {
+        return cardTypeName;
+    }
+
+    public void setCardTypeName(String cardTypeName) {
+        this.cardTypeName = cardTypeName;
+    }
+
+    public String getCardTypeUnitPrice() {
+        return cardTypeUnitPrice;
+    }
+
+    public void setCardTypeUnitPrice(String cardTypeUnitPrice) {
+        this.cardTypeUnitPrice = cardTypeUnitPrice;
+    }
+
+    public Integer getCardCopies() {
+        return cardCopies;
+    }
+
+    public void setCardCopies(Integer cardCopies) {
+        this.cardCopies = cardCopies;
+    }
+
+    public Integer getPeriod() {
+        return period;
+    }
+
+    public void setPeriod(Integer period) {
+        this.period = period;
+    }
+
+    public String getBeforeExpireTime() {
+        return beforeExpireTime;
+    }
+
+    public void setBeforeExpireTime(String beforeExpireTime) {
+        this.beforeExpireTime = beforeExpireTime;
+    }
+
+    public String getStartTime() {
+        return startTime;
+    }
+
+    public void setStartTime(String startTime) {
+        this.startTime = startTime;
+    }
+
+    public String getEndTime() {
+        return endTime;
+    }
+
+    public void setEndTime(String endTime) {
+        this.endTime = endTime;
+    }
+
+    public Integer getInvoiceStatus() {
+        return invoiceStatus;
+    }
+
+    public void setInvoiceStatus(Integer invoiceStatus) {
+        this.invoiceStatus = invoiceStatus;
+    }
 }
 

entry/src/main/java/com/fujica/abk/slice/MainAbilitySlice.java

@@ -26,8 +26,6 @@ import com.huawei.hms.accountsdk.support.account.tasks.OnFailureListener;
 import com.huawei.hms.accountsdk.support.account.tasks.OnSuccessListener;
 import com.huawei.hms.accountsdk.support.account.tasks.Task;
 import ohos.aafwk.ability.AbilitySlice;
-import ohos.aafwk.ability.DataAbilityHelper;
-import ohos.aafwk.ability.IDataAbilityObserver;
 import ohos.aafwk.content.Intent;
 import ohos.agp.components.*;
 import ohos.agp.utils.Color;
@@ -39,7 +37,6 @@ import ohos.location.Locator;
 import ohos.location.LocatorCallback;
 import ohos.location.RequestParam;
 import ohos.rpc.RemoteException;
-import ohos.sysappcomponents.settings.SystemSettings;
 
 public class MainAbilitySlice extends AbilitySlice {
     // 页面容器
@@ -74,15 +71,17 @@ public class MainAbilitySlice extends AbilitySlice {
     private ChargeComponent chargeComponent;
     private ParkComponent parkComponent; // 找车位页面组件
     private OrderComponent orderComponent; // 缴费记录页面组件
+    
+    // 页面初始化标志
+    private boolean isChargeComponentInitialized = false;
+    private boolean isParkComponentInitialized = false;
+    private boolean isOrderComponentInitialized = false;
 
     // 详情区域
     private DirectionalLayout mainRight; // 右侧详情区域
     private OrderDetailComponent orderDetailComponent; // 订单详情组件
     private ParkDetailComponent parkDetailComponent; // 停车场详情组件
 
-    DataAbilityHelper dataAbilityHelper;
-    IDataAbilityObserver dataAbilityObserver;
-
     // Loading组件
     private LoadingComponent loadingComponent;
 
@@ -144,18 +143,6 @@ public class MainAbilitySlice extends AbilitySlice {
             huaweiIdSignIn();
         });
 
-        final String key = "car_license_plate_number";
-//        final String key = SystemSettings.Date.TIME_FORMAT;
-
-        dataAbilityHelper = DataAbilityHelper.creator(this);
-        dataAbilityObserver = () -> {
-            String timeFormat = SystemSettings.getValue(dataAbilityHelper, key);
-            setTimeFormat(timeFormat);
-        };
-        dataAbilityHelper.registerObserver(SystemSettings.getUri(key), dataAbilityObserver);
-        String timeFormat1 = SystemSettings.getValue(dataAbilityHelper, "car_license_plate_number");
-        String timeFormat = SystemSettings.getValue(dataAbilityHelper, key);
-
         // 订阅登录成功事件
         subscribeLoginSuccessEvent();
         // 订阅认证状态变化事件
@@ -639,11 +626,6 @@ public class MainAbilitySlice extends AbilitySlice {
                 Log.error("停止定位失败: " + e.getMessage());
             }
         }
-
-        if (dataAbilityHelper != null) {
-
-        }
-        dataAbilityHelper.unregisterObserver(SystemSettings.getUri(SystemSettings.Date.TIME_FORMAT), dataAbilityObserver);
     }
 
     /**
@@ -656,7 +638,7 @@ public class MainAbilitySlice extends AbilitySlice {
         // 移除所有子组件
         mainRight.removeAllComponents();
         // 设置订单数据
-        orderDetailComponent.setOrderData(order);
+        orderDetailComponent.setOrderData(order,getContext());
         // 添加详情组件
         mainRight.addComponent(orderDetailComponent);
         // 显示详情区域

entry/src/main/java/com/fujica/abk/utils/api.java

@@ -129,7 +129,6 @@ public class api {
 
         String url = mergeUrl(option.getUrl(), option.getMethod(), option.getData());
         String token = cache.getToken(context);
-        Log.error("token:" + token);
         final String _url = url;
         return CompletableFuture.supplyAsync(() -> {
             HttpURLConnection connection = null;
@@ -188,7 +187,6 @@ public class api {
 
                         String resultStr = response.toString();
                         Log.error("响应：" + resultStr);
-
                         result = gson.fromJson(resultStr, dataClass);
 
                         if (result != null && !result.isSuccess() && option.getToast()) {

entry/src/main/js/widget1/i18n/en-US.json

@@ -0,0 +1,6 @@
+{
+  "strings": {
+    "title": "Today's delicious food",
+    "detail": "A bowl of fragrant fried noodles, back to childhood memories"
+  }
+}

entry/src/main/js/widget1/i18n/zh-CN.json

@@ -0,0 +1,6 @@
+{
+  "strings": {
+    "title": "爱泊客",
+    "detail": "富士只能大厦停车场"
+  }
+}

entry/src/main/js/widget1/pages/index/index.css

@@ -0,0 +1,61 @@
+.container {
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+}
+.bg-img{
+    flex-shrink: 0;
+    height: 100%;
+}
+.container-inner {
+    flex-direction: column;
+    justify-content: flex-end;
+    align-items: flex-start;
+    height: 100%;
+    width: 100%;
+    padding: 12px;
+}
+.title {
+    font-size: 19px;
+    font-weight: bold;
+    color: white;
+    text-overflow: ellipsis;
+    max-lines: 1;
+}
+.detail_text {
+    font-size: 16px;
+    color: white;
+    opacity: 0.66;
+    text-overflow: ellipsis;
+    max-lines: 1;
+    margin-top: 6px;
+}
+@media (device-type: tablet) {
+    .bg-img {
+        object-fit: fill;
+    }
+}
+@media (device-type: wearable) {
+    .container-inner {
+        justify-content: center;
+        align-items: center;
+        margin: 40px 26px;
+        padding: 0;
+    }
+    .title {
+        text-align: center;
+    }
+    .detail_text {
+        max-lines: 2;
+        text-align: center;
+    }
+}
+
+@media (device-type: tv) {
+    .title {
+        font-size: 16px;
+    }
+    .detail_text {
+        font-size: 12px;
+    }
+}

entry/src/main/js/widget1/pages/index/index.hml

@@ -0,0 +1,11 @@
+<div class="container">
+    <stack>
+        <div class="container-img">
+            <image src="/common/ic_default_image@3x.png" class="bg-img" onclick="routerEvent"></image>
+        </div>
+        <div class="container-inner">
+            <text class="title">{{ $t('strings.title') }}</text>
+            <text class="detail_text"> {{ $t('strings.detail') }}</text>
+        </div>
+    </stack>
+</div>

entry/src/main/js/widget1/pages/index/index.json

@@ -0,0 +1,17 @@
+{
+  "data": {
+    "title": "Title",
+    "detail": "Text",
+    "iconTitle": "Picture"
+  },
+  "actions": {
+    "routerEvent": {
+      "action": "router",
+      "bundleName": "com.fujica.abk",
+      "abilityName": "com.fujica.abk.MainAbility",
+      "params": {
+        "message": "add detail"
+      }
+    }
+  }
+}

entry/src/main/js/widget1/pages/index/index1.hml

@@ -0,0 +1,11 @@
+<div class="container">
+    <stack>
+        <div class="container-img">
+            <image src="/common/ic_default_image@3x.png" class="bg-img" onclick="routerEvent"></image>
+        </div>
+        <div class="container-inner">
+            <text class="title">{{ $t('strings.title') }}</text>
+            <text class="detail_text"> {{ $t('strings.detail') }}</text>
+        </div>
+    </stack>
+</div>

entry/src/main/resources/base/graphic/background_circle_border_16.xml

@@ -0,0 +1,14 @@
+<?xml version="1.0" encoding="utf-8"?>
+<shape
+    xmlns:ohos="http://schemas.huawei.com/res/ohos"
+    ohos:shape="rectangle">
+    <corners
+        ohos:radius="16vp"/>
+    <stroke
+        ohos:width="1vp"
+        ohos:color="#FFF5F5F5"/>
+
+    <solid
+        ohos:color="#FFFFFFFF"/>
+</shape>
+

entry/src/main/resources/base/layout/layout_order.xml

@@ -3,8 +3,7 @@
     xmlns:ohos="http://schemas.huawei.com/res/ohos"
     ohos:height="match_parent"
     ohos:width="match_parent"
-    ohos:orientation="vertical"
-    ohos:background_element="#F5F5F5">
+    ohos:orientation="vertical">
 
     <!-- 日期筛选 -->
     <DirectionalLayout
@@ -16,16 +15,16 @@
         ohos:padding="12vp">
 
         <DirectionalLayout
-            ohos:id="$+id:btn_biz_type_filter"
+            ohos:id="$+id:btn_date_filter"
             ohos:height="match_content"
             ohos:width="match_content"
             ohos:orientation="horizontal"
             ohos:alignment="center">
             <Text
-                ohos:id="$+id:text_biz_type"
+                ohos:id="$+id:text_date"
                 ohos:height="match_content"
                 ohos:width="match_content"
-                ohos:text="全部"
+                ohos:text="2024-01"
                 ohos:text_size="16fp"
                 ohos:text_color="#FF000000"/>
             <Text
@@ -36,19 +35,18 @@
                 ohos:text_color="#FF666666"
                 ohos:left_margin="4vp"/>
         </DirectionalLayout>
-
         <DirectionalLayout
-            ohos:id="$+id:btn_date_filter"
+            ohos:id="$+id:btn_biz_type_filter"
             ohos:height="match_content"
             ohos:width="match_content"
             ohos:orientation="horizontal"
             ohos:left_margin="24vp"
             ohos:alignment="center">
             <Text
-                ohos:id="$+id:text_date"
+                ohos:id="$+id:text_biz_type"
                 ohos:height="match_content"
                 ohos:width="match_content"
-                ohos:text="2024-01"
+                ohos:text="全部"
                 ohos:text_size="16fp"
                 ohos:text_color="#FF000000"/>
             <Text
@@ -59,15 +57,16 @@
                 ohos:text_color="#FF666666"
                 ohos:left_margin="4vp"/>
         </DirectionalLayout>
+
     </DirectionalLayout>
 
     <!-- 订单列表 -->
     <ScrollView
+        ohos:background_element="#F5F5F5"
         ohos:id="$+id:order_list_scroll"
         ohos:height="0vp"
         ohos:width="match_parent"
-        ohos:weight="1"
-        ohos:background_element="#F5F5F5">
+        ohos:weight="1">
         <DirectionalLayout
             ohos:id="$+id:order_list_container"
             ohos:height="match_content"

entry/src/main/resources/base/layout/layout_order_detail.xml

@@ -1,133 +1,590 @@
 <?xml version="1.0" encoding="utf-8"?>
-<DirectionalLayout
+<ScrollView
     xmlns:ohos="http://schemas.huawei.com/res/ohos"
     ohos:height="match_parent"
     ohos:width="match_parent"
-    ohos:orientation="vertical"
-    ohos:background_element="#FFFFFFFF"
-    ohos:padding="16vp">
+    ohos:background_element="#FFF5F5F5">
 
-    <!-- 标题 -->
-    <Text
-        ohos:id="$+id:detail_title"
-        ohos:height="match_content"
-        ohos:width="match_parent"
-        ohos:text="订单详情"
-        ohos:text_size="18fp"
-        ohos:text_color="#FF000000"
-        ohos:text_weight="600"
-        ohos:bottom_margin="16vp"/>
-
-    <!-- 商品名称 -->
     <DirectionalLayout
         ohos:height="match_content"
         ohos:width="match_parent"
-        ohos:orientation="horizontal"
-        ohos:bottom_margin="12vp">
-        <Text
-            ohos:height="match_content"
-            ohos:width="80vp"
-            ohos:text="商品名称："
-            ohos:text_size="14fp"
-            ohos:text_color="#FF666666"/>
-        <Text
-            ohos:id="$+id:detail_goods_name"
-            ohos:height="match_content"
-            ohos:width="0vp"
-            ohos:weight="1"
-            ohos:text="--"
-            ohos:text_size="14fp"
-            ohos:text_color="#FF000000"/>
-    </DirectionalLayout>
+        ohos:orientation="vertical"
+        ohos:padding="12vp">
 
-    <!-- 业务类型 -->
-    <DirectionalLayout
-        ohos:height="match_content"
-        ohos:width="match_parent"
-        ohos:orientation="horizontal"
-        ohos:bottom_margin="12vp">
-        <Text
+        <!-- 顶部金额卡片 -->
+        <DirectionalLayout
             ohos:height="match_content"
-            ohos:width="80vp"
-            ohos:text="业务类型："
-            ohos:text_size="14fp"
-            ohos:text_color="#FF666666"/>
-        <Text
-            ohos:id="$+id:detail_biz_type"
-            ohos:height="match_content"
-            ohos:width="0vp"
-            ohos:weight="1"
-            ohos:text="--"
-            ohos:text_size="14fp"
-            ohos:text_color="#FF000000"/>
-    </DirectionalLayout>
+            ohos:width="match_parent"
+            ohos:orientation="vertical"
+            ohos:background_element="$graphic:background_circle_16"
+            ohos:padding="16vp"
+            ohos:alignment="center"
+            ohos:bottom_margin="12vp">
+            <Text
+                ohos:id="$+id:detail_total_amount"
+                ohos:height="match_content"
+                ohos:width="match_content"
+                ohos:text="￥0.00"
+                ohos:text_size="30fp"
+                ohos:text_color="#FF000000"
+                ohos:text_weight="600"/>
+            <Text
+                ohos:height="match_content"
+                ohos:width="match_content"
+                ohos:text="已支付"
+                ohos:text_size="14fp"
+                ohos:text_color="#FF999999"
+                ohos:top_margin="20vp"/>
+        </DirectionalLayout>
 
-    <!-- 车场名称 -->
-    <DirectionalLayout
-        ohos:height="match_content"
-        ohos:width="match_parent"
-        ohos:orientation="horizontal"
-        ohos:bottom_margin="12vp">
-        <Text
-            ohos:height="match_content"
-            ohos:width="80vp"
-            ohos:text="车场名称："
-            ohos:text_size="14fp"
-            ohos:text_color="#FF666666"/>
-        <Text
-            ohos:id="$+id:detail_park_name"
+        <!-- 订单详情卡片 -->
+        <DirectionalLayout
             ohos:height="match_content"
-            ohos:width="0vp"
-            ohos:weight="1"
-            ohos:text="--"
-            ohos:text_size="14fp"
-            ohos:text_color="#FF000000"/>
-    </DirectionalLayout>
+            ohos:width="match_parent"
+            ohos:orientation="vertical"
+            ohos:background_element="$graphic:background_circle_16"
+            ohos:padding="16vp"
+            ohos:bottom_margin="12vp">
 
-    <!-- 支付时间 -->
-    <DirectionalLayout
-        ohos:height="match_content"
-        ohos:width="match_parent"
-        ohos:orientation="horizontal"
-        ohos:bottom_margin="12vp">
-        <Text
-            ohos:height="match_content"
-            ohos:width="80vp"
-            ohos:text="支付时间："
-            ohos:text_size="14fp"
-            ohos:text_color="#FF666666"/>
-        <Text
-            ohos:id="$+id:detail_pay_time"
-            ohos:height="match_content"
-            ohos:width="0vp"
-            ohos:weight="1"
-            ohos:text="--"
-            ohos:text_size="14fp"
-            ohos:text_color="#FF000000"/>
-    </DirectionalLayout>
+            <!-- 车牌号码 -->
+            <DirectionalLayout
+                ohos:id="$+id:layout_plate_no"
+                ohos:height="match_content"
+                ohos:width="match_parent"
+                ohos:orientation="horizontal"
+                ohos:top_margin="20vp">
+                <Text
+                    ohos:height="match_content"
+                    ohos:width="match_content"
+                    ohos:text="车牌号码"
+                    ohos:text_size="14fp"
+                    ohos:text_color="#FF999999"
+                    ohos:right_margin="30vp"/>
+                <Text
+                    ohos:id="$+id:detail_plate_no"
+                    ohos:height="match_content"
+                    ohos:width="0vp"
+                    ohos:weight="1"
+                    ohos:text="--"
+                    ohos:text_size="14fp"
+                    ohos:text_color="#FF333333"
+                    ohos:text_alignment="right"
+                    ohos:max_text_lines="2"
+                    ohos:truncation_mode="ellipsis_at_end"/>
+            </DirectionalLayout>
 
-    <!-- 金额 -->
-    <DirectionalLayout
-        ohos:height="match_content"
-        ohos:width="match_parent"
-        ohos:orientation="horizontal"
-        ohos:bottom_margin="12vp">
-        <Text
-            ohos:height="match_content"
-            ohos:width="80vp"
-            ohos:text="支付金额："
-            ohos:text_size="14fp"
-            ohos:text_color="#FF666666"/>
-        <Text
-            ohos:id="$+id:detail_amount"
+            <!-- 车场名称 -->
+            <DirectionalLayout
+                ohos:id="$+id:layout_park_name"
+                ohos:height="match_content"
+                ohos:width="match_parent"
+                ohos:orientation="horizontal"
+                ohos:top_margin="20vp">
+                <Text
+                    ohos:height="match_content"
+                    ohos:width="match_content"
+                    ohos:text="车场名称"
+                    ohos:text_size="14fp"
+                    ohos:text_color="#FF999999"
+                    ohos:right_margin="30vp"/>
+                <Text
+                    ohos:id="$+id:detail_park_name"
+                    ohos:height="match_content"
+                    ohos:width="0vp"
+                    ohos:weight="1"
+                    ohos:text="--"
+                    ohos:text_size="14fp"
+                    ohos:text_color="#FF333333"
+                    ohos:text_alignment="right"
+                    ohos:max_text_lines="2"
+                    ohos:truncation_mode="ellipsis_at_end"/>
+            </DirectionalLayout>
+
+            <!-- 入场时间（临停） -->
+            <DirectionalLayout
+                ohos:id="$+id:layout_in_time"
+                ohos:height="match_content"
+                ohos:width="match_parent"
+                ohos:orientation="horizontal"
+                ohos:top_margin="20vp"
+                ohos:visibility="hide">
+                <Text
+                    ohos:height="match_content"
+                    ohos:width="match_content"
+                    ohos:text="入场时间"
+                    ohos:text_size="14fp"
+                    ohos:text_color="#FF999999"
+                    ohos:right_margin="30vp"/>
+                <Text
+                    ohos:id="$+id:detail_in_time"
+                    ohos:height="match_content"
+                    ohos:width="0vp"
+                    ohos:weight="1"
+                    ohos:text="--"
+                    ohos:text_size="14fp"
+                    ohos:text_color="#FF333333"
+                    ohos:text_alignment="right"/>
+            </DirectionalLayout>
+
+            <!-- 停车时长（临停） -->
+            <DirectionalLayout
+                ohos:id="$+id:layout_stay_time"
+                ohos:height="match_content"
+                ohos:width="match_parent"
+                ohos:orientation="horizontal"
+                ohos:top_margin="20vp"
+                ohos:visibility="hide">
+                <Text
+                    ohos:height="match_content"
+                    ohos:width="match_content"
+                    ohos:text="停车时长"
+                    ohos:text_size="14fp"
+                    ohos:text_color="#FF999999"
+                    ohos:right_margin="30vp"/>
+                <Text
+                    ohos:id="$+id:detail_stay_time"
+                    ohos:height="match_content"
+                    ohos:width="0vp"
+                    ohos:weight="1"
+                    ohos:text="--"
+                    ohos:text_size="14fp"
+                    ohos:text_color="#FF333333"
+                    ohos:text_alignment="right"/>
+            </DirectionalLayout>
+
+            <!-- 停车费（临停） -->
+            <DirectionalLayout
+                ohos:id="$+id:layout_total_fee"
+                ohos:height="match_content"
+                ohos:width="match_parent"
+                ohos:orientation="horizontal"
+                ohos:top_margin="20vp"
+                ohos:visibility="hide">
+                <Text
+                    ohos:height="match_content"
+                    ohos:width="match_content"
+                    ohos:text="停车费"
+                    ohos:text_size="14fp"
+                    ohos:text_color="#FF999999"
+                    ohos:right_margin="30vp"/>
+                <Text
+                    ohos:id="$+id:detail_total_fee"
+                    ohos:height="match_content"
+                    ohos:width="0vp"
+                    ohos:weight="1"
+                    ohos:text="--"
+                    ohos:text_size="14fp"
+                    ohos:text_color="#FF333333"
+                    ohos:text_alignment="right"/>
+            </DirectionalLayout>
+
+            <!-- 优惠金额（临停） -->
+            <DirectionalLayout
+                ohos:id="$+id:layout_discount"
+                ohos:height="match_content"
+                ohos:width="match_parent"
+                ohos:orientation="horizontal"
+                ohos:top_margin="20vp"
+                ohos:visibility="hide">
+                <Text
+                    ohos:height="match_content"
+                    ohos:width="match_content"
+                    ohos:text="优惠金额"
+                    ohos:text_size="14fp"
+                    ohos:text_color="#FF999999"
+                    ohos:right_margin="30vp"/>
+                <Text
+                    ohos:id="$+id:detail_discount"
+                    ohos:height="match_content"
+                    ohos:width="0vp"
+                    ohos:weight="1"
+                    ohos:text="--"
+                    ohos:text_size="14fp"
+                    ohos:text_color="#FF333333"
+                    ohos:text_alignment="right"/>
+            </DirectionalLayout>
+
+            <!-- 实付金额（临停） -->
+            <DirectionalLayout
+                ohos:id="$+id:layout_actual_amount"
+                ohos:height="match_content"
+                ohos:width="match_parent"
+                ohos:orientation="horizontal"
+                ohos:top_margin="20vp"
+                ohos:visibility="hide">
+                <Text
+                    ohos:height="match_content"
+                    ohos:width="match_content"
+                    ohos:text="实付金额"
+                    ohos:text_size="14fp"
+                    ohos:text_color="#FF999999"
+                    ohos:right_margin="30vp"/>
+                <Text
+                    ohos:id="$+id:detail_actual_amount"
+                    ohos:height="match_content"
+                    ohos:width="0vp"
+                    ohos:weight="1"
+                    ohos:text="--"
+                    ohos:text_size="14fp"
+                    ohos:text_color="#FF333333"
+                    ohos:text_alignment="right"/>
+            </DirectionalLayout>
+
+            <!-- 车位数量（月卡） -->
+            <DirectionalLayout
+                ohos:id="$+id:layout_parking_lot"
+                ohos:height="match_content"
+                ohos:width="match_parent"
+                ohos:orientation="horizontal"
+                ohos:top_margin="20vp"
+                ohos:visibility="hide">
+                <Text
+                    ohos:height="match_content"
+                    ohos:width="match_content"
+                    ohos:text="车位数量"
+                    ohos:text_size="14fp"
+                    ohos:text_color="#FF999999"
+                    ohos:right_margin="30vp"/>
+                <Text
+                    ohos:id="$+id:detail_parking_lot"
+                    ohos:height="match_content"
+                    ohos:width="0vp"
+                    ohos:weight="1"
+                    ohos:text="--"
+                    ohos:text_size="14fp"
+                    ohos:text_color="#FF333333"
+                    ohos:text_alignment="right"/>
+            </DirectionalLayout>
+
+            <!-- 套餐名称（月卡） -->
+            <DirectionalLayout
+                ohos:id="$+id:layout_card_type"
+                ohos:height="match_content"
+                ohos:width="match_parent"
+                ohos:orientation="horizontal"
+                ohos:top_margin="20vp"
+                ohos:visibility="hide">
+                <Text
+                    ohos:height="match_content"
+                    ohos:width="match_content"
+                    ohos:text="套餐名称"
+                    ohos:text_size="14fp"
+                    ohos:text_color="#FF999999"
+                    ohos:right_margin="30vp"/>
+                <Text
+                    ohos:id="$+id:detail_card_type"
+                    ohos:height="match_content"
+                    ohos:width="0vp"
+                    ohos:weight="1"
+                    ohos:text="--"
+                    ohos:text_size="14fp"
+                    ohos:text_color="#FF333333"
+                    ohos:text_alignment="right"/>
+            </DirectionalLayout>
+
+            <!-- 套餐单价（月卡） -->
+            <DirectionalLayout
+                ohos:id="$+id:layout_card_price"
+                ohos:height="match_content"
+                ohos:width="match_parent"
+                ohos:orientation="horizontal"
+                ohos:top_margin="20vp"
+                ohos:visibility="hide">
+                <Text
+                    ohos:height="match_content"
+                    ohos:width="match_content"
+                    ohos:text="套餐单价"
+                    ohos:text_size="14fp"
+                    ohos:text_color="#FF999999"
+                    ohos:right_margin="30vp"/>
+                <Text
+                    ohos:id="$+id:detail_card_price"
+                    ohos:height="match_content"
+                    ohos:width="0vp"
+                    ohos:weight="1"
+                    ohos:text="--"
+                    ohos:text_size="14fp"
+                    ohos:text_color="#FF333333"
+                    ohos:text_alignment="right"/>
+            </DirectionalLayout>
+
+            <!-- 购买数量（月卡） -->
+            <DirectionalLayout
+                ohos:id="$+id:layout_card_copies"
+                ohos:height="match_content"
+                ohos:width="match_parent"
+                ohos:orientation="horizontal"
+                ohos:top_margin="20vp"
+                ohos:visibility="hide">
+                <Text
+                    ohos:height="match_content"
+                    ohos:width="match_content"
+                    ohos:text="购买数量"
+                    ohos:text_size="14fp"
+                    ohos:text_color="#FF999999"
+                    ohos:right_margin="30vp"/>
+                <Text
+                    ohos:id="$+id:detail_card_copies"
+                    ohos:height="match_content"
+                    ohos:width="0vp"
+                    ohos:weight="1"
+                    ohos:text="--"
+                    ohos:text_size="14fp"
+                    ohos:text_color="#FF333333"
+                    ohos:text_alignment="right"/>
+            </DirectionalLayout>
+
+            <!-- 续费时长（月卡） -->
+            <DirectionalLayout
+                ohos:id="$+id:layout_renew_duration"
+                ohos:height="match_content"
+                ohos:width="match_parent"
+                ohos:orientation="horizontal"
+                ohos:top_margin="20vp"
+                ohos:visibility="hide">
+                <Text
+                    ohos:height="match_content"
+                    ohos:width="match_content"
+                    ohos:text="续费时长"
+                    ohos:text_size="14fp"
+                    ohos:text_color="#FF999999"
+                    ohos:right_margin="30vp"/>
+                <Text
+                    ohos:id="$+id:detail_renew_duration"
+                    ohos:height="match_content"
+                    ohos:width="0vp"
+                    ohos:weight="1"
+                    ohos:text="--"
+                    ohos:text_size="14fp"
+                    ohos:text_color="#FF333333"
+                    ohos:text_alignment="right"/>
+            </DirectionalLayout>
+
+            <!-- 原到期时间（月卡） -->
+            <DirectionalLayout
+                ohos:id="$+id:layout_before_expire"
+                ohos:height="match_content"
+                ohos:width="match_parent"
+                ohos:orientation="horizontal"
+                ohos:top_margin="20vp"
+                ohos:visibility="hide">
+                <Text
+                    ohos:height="match_content"
+                    ohos:width="match_content"
+                    ohos:text="原到期时间"
+                    ohos:text_size="14fp"
+                    ohos:text_color="#FF999999"
+                    ohos:right_margin="30vp"/>
+                <Text
+                    ohos:id="$+id:detail_before_expire"
+                    ohos:height="match_content"
+                    ohos:width="0vp"
+                    ohos:weight="1"
+                    ohos:text="--"
+                    ohos:text_size="14fp"
+                    ohos:text_color="#FF333333"
+                    ohos:text_alignment="right"/>
+            </DirectionalLayout>
+
+            <!-- 续费后开始时间（月卡） -->
+            <DirectionalLayout
+                ohos:id="$+id:layout_start_time"
+                ohos:height="match_content"
+                ohos:width="match_parent"
+                ohos:orientation="horizontal"
+                ohos:top_margin="20vp"
+                ohos:visibility="hide">
+                <Text
+                    ohos:height="match_content"
+                    ohos:width="match_content"
+                    ohos:text="续费后开始时间"
+                    ohos:text_size="14fp"
+                    ohos:text_color="#FF999999"
+                    ohos:right_margin="30vp"/>
+                <Text
+                    ohos:id="$+id:detail_start_time"
+                    ohos:height="match_content"
+                    ohos:width="0vp"
+                    ohos:weight="1"
+                    ohos:text="--"
+                    ohos:text_size="14fp"
+                    ohos:text_color="#FF333333"
+                    ohos:text_alignment="right"/>
+            </DirectionalLayout>
+
+            <!-- 续费后到期时间（月卡） -->
+            <DirectionalLayout
+                ohos:id="$+id:layout_end_time"
+                ohos:height="match_content"
+                ohos:width="match_parent"
+                ohos:orientation="horizontal"
+                ohos:top_margin="20vp"
+                ohos:visibility="hide">
+                <Text
+                    ohos:height="match_content"
+                    ohos:width="match_content"
+                    ohos:text="续费后到期时间"
+                    ohos:text_size="14fp"
+                    ohos:text_color="#FF999999"
+                    ohos:right_margin="30vp"/>
+                <Text
+                    ohos:id="$+id:detail_end_time"
+                    ohos:height="match_content"
+                    ohos:width="0vp"
+                    ohos:weight="1"
+                    ohos:text="--"
+                    ohos:text_size="14fp"
+                    ohos:text_color="#FF333333"
+                    ohos:text_alignment="right"/>
+            </DirectionalLayout>
+
+            <!-- 订单类型 -->
+            <DirectionalLayout
+                ohos:id="$+id:layout_order_type"
+                ohos:height="match_content"
+                ohos:width="match_parent"
+                ohos:orientation="horizontal"
+                ohos:top_margin="20vp">
+                <Text
+                    ohos:height="match_content"
+                    ohos:width="match_content"
+                    ohos:text="订单类型"
+                    ohos:text_size="14fp"
+                    ohos:text_color="#FF999999"
+                    ohos:right_margin="30vp"/>
+                <Text
+                    ohos:id="$+id:detail_order_type"
+                    ohos:height="match_content"
+                    ohos:width="0vp"
+                    ohos:weight="1"
+                    ohos:text="--"
+                    ohos:text_size="14fp"
+                    ohos:text_color="#FF333333"
+                    ohos:text_alignment="right"/>
+            </DirectionalLayout>
+
+            <!-- 支付时间 -->
+            <DirectionalLayout
+                ohos:id="$+id:layout_pay_time"
+                ohos:height="match_content"
+                ohos:width="match_parent"
+                ohos:orientation="horizontal"
+                ohos:top_margin="20vp">
+                <Text
+                    ohos:height="match_content"
+                    ohos:width="match_content"
+                    ohos:text="支付时间"
+                    ohos:text_size="14fp"
+                    ohos:text_color="#FF999999"
+                    ohos:right_margin="30vp"/>
+                <Text
+                    ohos:id="$+id:detail_pay_time"
+                    ohos:height="match_content"
+                    ohos:width="0vp"
+                    ohos:weight="1"
+                    ohos:text="--"
+                    ohos:text_size="14fp"
+                    ohos:text_color="#FF333333"
+                    ohos:text_alignment="right"/>
+            </DirectionalLayout>
+
+            <!-- 支付方式 -->
+            <DirectionalLayout
+                ohos:id="$+id:layout_pay_way"
+                ohos:height="match_content"
+                ohos:width="match_parent"
+                ohos:orientation="horizontal"
+                ohos:top_margin="20vp">
+                <Text
+                    ohos:height="match_content"
+                    ohos:width="match_content"
+                    ohos:text="支付方式"
+                    ohos:text_size="14fp"
+                    ohos:text_color="#FF999999"
+                    ohos:right_margin="30vp"/>
+                <Text
+                    ohos:id="$+id:detail_pay_way"
+                    ohos:height="match_content"
+                    ohos:width="0vp"
+                    ohos:weight="1"
+                    ohos:text="--"
+                    ohos:text_size="14fp"
+                    ohos:text_color="#FF333333"
+                    ohos:text_alignment="right"/>
+            </DirectionalLayout>
+
+            <!-- 订单号 -->
+            <DirectionalLayout
+                ohos:id="$+id:layout_order_id"
+                ohos:height="match_content"
+                ohos:width="match_parent"
+                ohos:orientation="horizontal"
+                ohos:top_margin="20vp">
+                <Text
+                    ohos:height="match_content"
+                    ohos:width="match_content"
+                    ohos:text="订单号"
+                    ohos:text_size="14fp"
+                    ohos:text_color="#FF999999"
+                    ohos:right_margin="30vp"/>
+                <Text
+                    ohos:id="$+id:detail_order_id"
+                    ohos:height="match_content"
+                    ohos:width="0vp"
+                    ohos:weight="1"
+                    ohos:text="--"
+                    ohos:text_size="14fp"
+                    ohos:text_color="#FF333333"
+                    ohos:text_alignment="right"
+                    ohos:max_text_lines="2"
+                    ohos:truncation_mode="ellipsis_at_end"/>
+            </DirectionalLayout>
+
+        </DirectionalLayout>
+
+        <!-- 电子发票卡片 -->
+        <DirectionalLayout
+            ohos:visibility="hide"
+            ohos:id="$+id:layout_invoice"
             ohos:height="match_content"
-            ohos:width="0vp"
-            ohos:weight="1"
-            ohos:text="￥0.00"
-            ohos:text_size="16fp"
-            ohos:text_color="#FA6332"
-            ohos:text_weight="600"/>
+            ohos:width="match_parent"
+            ohos:orientation="vertical"
+            ohos:background_element="$graphic:background_circle_16"
+            ohos:padding="16vp">
+
+            <DirectionalLayout
+                ohos:height="match_content"
+                ohos:width="match_parent"
+                ohos:orientation="horizontal"
+                ohos:top_margin="20vp">
+                <Text
+                    ohos:height="match_content"
+                    ohos:width="match_content"
+                    ohos:text="电子发票"
+                    ohos:text_size="14fp"
+                    ohos:text_color="#FF999999"
+                    ohos:right_margin="30vp"/>
+                <Text
+                    ohos:id="$+id:detail_invoice_status"
+                    ohos:height="match_content"
+                    ohos:width="0vp"
+                    ohos:weight="1"
+                    ohos:text="--"
+                    ohos:text_size="14fp"
+                    ohos:text_color="#FFFF6600"
+                    ohos:text_alignment="right"/>
+                <Image
+                    ohos:id="$+id:detail_invoice_arrow"
+                    ohos:height="16vp"
+                    ohos:width="16vp"
+                    ohos:image_src="$media:close"
+                    ohos:scale_mode="zoom_center"
+                    ohos:visibility="hide"/>
+            </DirectionalLayout>
+
+        </DirectionalLayout>
+
     </DirectionalLayout>
 
-</DirectionalLayout>
+</ScrollView>
 

entry/src/main/resources/base/layout/layout_park_detail.xml

@@ -3,152 +3,197 @@
     xmlns:ohos="http://schemas.huawei.com/res/ohos"
     ohos:height="match_parent"
     ohos:width="match_parent"
+    ohos:left_padding="16vp"
     ohos:orientation="vertical"
-    ohos:background_element="#FFFFFFFF"
-    ohos:padding="16vp">
+    ohos:right_padding="16vp"
+    ohos:background_element="$graphic:background_circle_border_16"
+    ohos:top_padding="16vp">
 
-    <!-- 标题 -->
-    <Text
-        ohos:id="$+id:detail_title"
-        ohos:height="match_content"
-        ohos:width="match_parent"
-        ohos:text="停车场详情"
-        ohos:text_size="18fp"
-        ohos:text_color="#FF000000"
-        ohos:text_weight="600"
-        ohos:bottom_margin="16vp"/>
-
-    <!-- 停车场名称 -->
+    <!-- 内容区域 -->
     <DirectionalLayout
         ohos:height="match_content"
         ohos:width="match_parent"
-        ohos:orientation="horizontal"
-        ohos:bottom_margin="12vp">
-        <Text
-            ohos:height="match_content"
-            ohos:width="80vp"
-            ohos:text="停车场："
-            ohos:text_size="14fp"
-            ohos:text_color="#FF666666"/>
-        <Text
-            ohos:id="$+id:detail_park_name"
-            ohos:height="match_content"
-            ohos:width="0vp"
-            ohos:weight="1"
-            ohos:text="--"
-            ohos:text_size="14fp"
-            ohos:text_color="#FF000000"/>
-    </DirectionalLayout>
+        ohos:orientation="vertical">
 
-    <!-- 地址 -->
-    <DirectionalLayout
-        ohos:height="match_content"
-        ohos:width="match_parent"
-        ohos:orientation="horizontal"
-        ohos:bottom_margin="12vp">
+        <!-- 停车场名称 -->
         <Text
+            ohos:id="$+id:park_name"
             ohos:height="match_content"
-            ohos:width="80vp"
-            ohos:text="地址："
-            ohos:text_size="14fp"
-            ohos:text_color="#FF666666"/>
-        <Text
-            ohos:id="$+id:detail_address"
-            ohos:height="match_content"
-            ohos:width="0vp"
-            ohos:weight="1"
-            ohos:text="--"
-            ohos:text_size="14fp"
-            ohos:text_color="#FF000000"/>
-    </DirectionalLayout>
+            ohos:width="match_content"
+            ohos:text="停车场名称"
+            ohos:text_color="#333333"
+            ohos:text_size="16fp"
+            ohos:bottom_margin="8vp"/>
 
-    <!-- 距离 -->
-    <DirectionalLayout
-        ohos:height="match_content"
-        ohos:width="match_parent"
-        ohos:orientation="horizontal"
-        ohos:bottom_margin="12vp">
-        <Text
+        <!-- 距离和地址 -->
+        <DirectionalLayout
             ohos:height="match_content"
-            ohos:width="80vp"
-            ohos:text="距离："
-            ohos:text_size="14fp"
-            ohos:text_color="#FF666666"/>
-        <Text
-            ohos:id="$+id:detail_distance"
-            ohos:height="match_content"
-            ohos:width="0vp"
-            ohos:weight="1"
-            ohos:text="--"
-            ohos:text_size="14fp"
-            ohos:text_color="#FF000000"/>
-    </DirectionalLayout>
+            ohos:width="match_content"
+            ohos:orientation="horizontal"
+            ohos:bottom_margin="12vp">
 
-    <!-- 总车位 -->
-    <DirectionalLayout
-        ohos:height="match_content"
-        ohos:width="match_parent"
-        ohos:orientation="horizontal"
-        ohos:bottom_margin="12vp">
-        <Text
-            ohos:height="match_content"
-            ohos:width="80vp"
-            ohos:text="总车位："
-            ohos:text_size="14fp"
-            ohos:text_color="#FF666666"/>
-        <Text
-            ohos:id="$+id:detail_total_place"
+            <Text
+                ohos:id="$+id:parking_address_1"
+                ohos:height="match_content"
+                ohos:width="match_content"
+                ohos:text="0.8km"
+                ohos:text_color="#FA6332"
+                ohos:text_size="12fp"
+                ohos:right_margin="8vp"/>
+
+            <Text
+                ohos:id="$+id:parking_address_2"
+                ohos:height="match_content"
+                ohos:width="0vp"
+                ohos:weight="1"
+                ohos:text="地址信息"
+                ohos:text_color="#999999"
+                ohos:text_size="12fp"/>
+        </DirectionalLayout>
+
+        <!-- 统计信息：总车位、剩余车位、免费时长 -->
+        <DirectionalLayout
             ohos:height="match_content"
-            ohos:width="0vp"
-            ohos:weight="1"
-            ohos:text="--"
-            ohos:text_size="14fp"
-            ohos:text_color="#FF000000"/>
-    </DirectionalLayout>
+            ohos:width="match_parent"
+            ohos:alignment="left"
+            ohos:orientation="horizontal"
+            ohos:bottom_margin="16vp">
 
-    <!-- 剩余车位 -->
-    <DirectionalLayout
-        ohos:height="match_content"
-        ohos:width="match_parent"
-        ohos:orientation="horizontal"
-        ohos:bottom_margin="12vp">
-        <Text
+            <!-- 总车位 -->
+            <DirectionalLayout
+                ohos:height="match_content"
+                ohos:width="match_content"
+                ohos:alignment="center"
+                ohos:orientation="vertical">
+
+                <Text
+                    ohos:id="$+id:text_total_place"
+                    ohos:height="match_content"
+                    ohos:width="match_content"
+                    ohos:text="2000"
+                    ohos:text_alignment="center"
+                    ohos:text_color="#333333"
+                    ohos:text_size="14fp"/>
+
+                <Text
+                    ohos:height="match_content"
+                    ohos:width="match_content"
+                    ohos:text="总车位"
+                    ohos:text_alignment="center"
+                    ohos:text_color="#999999"
+                    ohos:text_size="12fp"/>
+            </DirectionalLayout>
+
+            <!-- 剩余车位 -->
+            <DirectionalLayout
+                ohos:height="match_content"
+                ohos:width="match_content"
+                ohos:alignment="center"
+                ohos:left_margin="20vp"
+                ohos:orientation="vertical">
+
+                <Text
+                    ohos:id="$+id:text_residue_place"
+                    ohos:height="match_content"
+                    ohos:width="match_content"
+                    ohos:text="50"
+                    ohos:text_alignment="center"
+                    ohos:text_color="#FF7800"
+                    ohos:text_size="14fp"/>
+
+                <Text
+                    ohos:height="match_content"
+                    ohos:width="match_content"
+                    ohos:text="剩余车位"
+                    ohos:text_alignment="center"
+                    ohos:text_color="#999999"
+                    ohos:text_size="12fp"/>
+            </DirectionalLayout>
+
+            <!-- 免费时长 -->
+            <DirectionalLayout
+                ohos:height="match_content"
+                ohos:width="match_content"
+                ohos:alignment="center"
+                ohos:left_margin="20vp"
+                ohos:orientation="vertical">
+
+                <Text
+                    ohos:id="$+id:text_free_duration"
+                    ohos:height="match_content"
+                    ohos:width="match_content"
+                    ohos:text="15分"
+                    ohos:text_alignment="center"
+                    ohos:text_color="#333333"
+                    ohos:text_size="14fp"/>
+
+                <Text
+                    ohos:height="match_content"
+                    ohos:width="match_content"
+                    ohos:text="免费时长"
+                    ohos:text_alignment="center"
+                    ohos:text_color="#999999"
+                    ohos:text_size="12fp"/>
+            </DirectionalLayout>
+        </DirectionalLayout>
+
+        <!-- 服务标签区域 -->
+        <DirectionalLayout
+            ohos:id="$+id:service_tags_container"
             ohos:height="match_content"
-            ohos:width="80vp"
-            ohos:text="剩余车位："
-            ohos:text_size="14fp"
-            ohos:text_color="#FF666666"/>
-        <Text
-            ohos:id="$+id:detail_residue_place"
+            ohos:width="match_parent"
+            ohos:alignment="left"
+            ohos:orientation="horizontal"
+            ohos:bottom_margin="16vp">
+        </DirectionalLayout>
+
+        <!-- 参考收费信息 -->
+        <DirectionalLayout
             ohos:height="match_content"
-            ohos:width="0vp"
-            ohos:weight="1"
-            ohos:text="--"
-            ohos:text_size="14fp"
-            ohos:text_color="#FF000000"/>
+            ohos:width="match_parent"
+            ohos:orientation="vertical"
+            ohos:background_element="#FFF5F5F5"
+            ohos:padding="12vp"
+            ohos:bottom_margin="16vp">
+
+            <Text
+                ohos:height="match_content"
+                ohos:width="match_content"
+                ohos:text="参考收费信息"
+                ohos:text_color="#333333"
+                ohos:text_size="14fp"
+                ohos:text_weight="600"
+                ohos:bottom_margin="8vp"/>
+
+            <Text
+                ohos:id="$+id:charge_info"
+                ohos:height="match_content"
+                ohos:width="match_parent"
+                ohos:text="暂无信息"
+                ohos:text_color="#666666"
+                ohos:text_size="12fp"
+                ohos:multiple_lines="true"/>
+        </DirectionalLayout>
+
     </DirectionalLayout>
 
-    <!-- 免费时长 -->
+    <!-- 底部导航按钮 -->
     <DirectionalLayout
-        ohos:height="match_content"
+        ohos:height="0vp"
         ohos:width="match_parent"
-        ohos:orientation="horizontal"
-        ohos:bottom_margin="12vp">
-        <Text
-            ohos:height="match_content"
-            ohos:width="80vp"
-            ohos:text="免费时长："
-            ohos:text_size="14fp"
-            ohos:text_color="#FF666666"/>
-        <Text
-            ohos:id="$+id:detail_free_time"
-            ohos:height="match_content"
-            ohos:width="0vp"
-            ohos:weight="1"
-            ohos:text="--"
-            ohos:text_size="14fp"
-            ohos:text_color="#FF000000"/>
+        ohos:weight="1"
+        ohos:orientation="vertical"
+        ohos:alignment="bottom">
+
+        <Button
+            ohos:id="$+id:btn_navigate"
+            ohos:height="48vp"
+            ohos:width="match_parent"
+            ohos:text="车场导航"
+            ohos:text_color="#FFFFFFFF"
+            ohos:text_size="16fp"
+            ohos:background_element="$graphic:button"
+            ohos:bottom_margin="16vp"/>
     </DirectionalLayout>
 
 </DirectionalLayout>
-