如何重写starth5app(JsApiHandler4StartApp)这个插件

本文介绍如何在不改动前端代码的情况下,通过修改配置并自定义插件,将JsApiHandler4StartApp替换为JsApiHandleriOSDIYStartApp,以适配DFNavigationController的问题,并展示了参数转换和完整代码示例。

为什么要重写呢?因为使用它打开的页面在DFNavigationController中,会产生一些问题。

1.如何在前端不改任何代码的情况下,直接使starth5app从调用JsApiHandler4StartApp改为调用自己写的插件JsApiHandleriOSDIYStartApp ?

答:在内置插件列表Poseidon-Extra-Config.plist中,由原来的

改为

即可。

2.当然调试的时候可以这样,保险的做法是新写一个插件,前端调用参数不变,客户端来进行参数的处理。

前端传过来的跳转参数是:


- (void)handler:(NSDictionary *)data
        context:(PSDContext *)context
       callback:(PSDJsApiResponseCallbackBlock)callback
{
}


打印data
Printing description of data:
{
    appId = 20120329;
    param =     {
        param =         {
        };
        readTitle = 0;
        url = "/www/home.html";
    };
}

原生的

- (UIViewController *)createH5ViewControllerWithNebulaApp:(NSDictionary *)params;

需要的参数格式为:

@{@"appid":data[@"appId"],
  @"url": data[@"param"][@"url"],
  @"param":param,
 }

因此把前端传过来的参数中的appId直接放到param里面即可。

完整的代码:

//
//  JsApiHandleriOSDIYStartApp.h
//
//
//  Created by YYYFC on 2021/7/8.
//  Copyright © 2021 Alibaba. All rights reserved.
//

#import <NebulaPoseidon/NebulaPoseidon.h>

NS_ASSUME_NONNULL_BEGIN

@interface JsApiHandleriOSDIYStartApp : PSDJsApiHandler

@end

NS_ASSUME_NONNULL_END
//
//  JsApiHandleriOSDIYStartApp.m
//
//
//  Created by YYYFC on 2021/7/8.
//  Copyright © 2021 Alibaba. All rights reserved.
//

#import "JsApiHandleriOSDIYStartApp.h"

@implementation JsApiHandleriOSDIYStartApp
- (void)handler:(NSDictionary *)data
        context:(PSDContext *)context
       callback:(PSDJsApiResponseCallbackBlock)callback
{
    [super handler:data context:context callback:callback];
    
    
    //获取正确层级的导航控制器
    UIWindow * window = [[UIApplication sharedApplication] keyWindow];
  
    DFNavigationController *dfNav = window.rootViewController;
   
    UITabBarController *tabvc = dfNav.viewControllers[0];
    
    UINavigationController *navc = tabvc.viewControllers[tabvc.selectedIndex];
    

    
    
    //组装参数
    NSDictionary *param = data[@"param"][@"param"];
    NSDictionary *cParam = @{@"appId":data[@"appId"],
                             @"url": data[@"param"][@"url"],
                             @"param":param,
                            };
    
    NSMutableDictionary *dict = [[NSMutableDictionary alloc]initWithDictionary:cParam];
    [dict setObject:@NO forKey:@"showOptionMenu"];
    [dict setObject:@NO forKey:@"readTitle"];
    [dict setObject:@YES forKey:@"showProgress"];
    
    //创建h5容器并跳转
    [[MPNebulaAdapterInterface shareInstance]requestNebulaAppsWithParams:@{cParam[@"appId"]:@"0"} finish:^(NSDictionary *data, NSError *error) {
        
            dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(0.01 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
                
                H5WebViewController *webVc = [[MPNebulaAdapterInterface shareInstance] createH5ViewControllerWithNebulaApp:dict];
                
                [navc pushViewController:webVc animated:YES];
                
            });
            

    }];

    callback(@{@"result":@"1"});
}
@end

<think>嗯,用户让我设计一个加班申报的微信小程序,使用微信云开发。首先,我需要明确用户的需求,他们需要一个可以让员工提交加班申请,然后可能还需要审批流程,记录加班时长,可能有统计功能等等。微信云开发的话,应该不需要自己搭建后端,直接用云函数、云数据库和云存储。首先,结构方面,小程序需要几个页面:提交加班申请的页面,申请记录的列表,详情页面,审批页面(如果是管理员的话)。然后数据库设计,需要至少一个集合来存储加班记录,比如字段包括申请人姓名、部门、加班日期、开始时间、结束时间、总时长、事由、状态(待审批、通过、拒绝)、审批人、审批意见等。可能还需要用户信息的集合,或者直接利用微信的用户信息。 然后考虑云函数,比如提交申请的时候,需要往数据库插入记录。审批的时候更新状态。计算加班时长可能需要在提交时自动计算,比如根据开始和结束时间算出总时长,单位可能是小时。权限控制方面,普通员工只能提交和查看自己的记录,管理员可以看到全部或者部门的记录,并能审批。这里可能需要用到用户的openid,以及存储用户的角色(比如在用户集合里标记是否是管理员)。 接下来,前端的页面设计。提交页面需要表单,包括日期选择、时间选择器、输入事由等。列表页面用scroll-view展示所有记录,点击进入详情。审批页面需要有操作按钮,通过或拒绝,可能还需要输入审批意见。 安全性方面,云数据库的权限设置要正确,比如只有创建者可以读写自己的记录,管理员有更高级的权限可能需要通过云函数来实现,避免前端直接操作数据库。云函数里要校验用户的身份和权限。 可能还需要考虑通知功能,比如当申请被审批后,发送模板消息给申请人。微信模板消息需要申请,可能有点麻烦,但云开发应该支持调用相关的接口。 测试的时候需要注意不同角色的用户,模拟员工和管理员的操作。数据校验,比如时间不能早于当前时间,结束时间不能早于开始时间等。代码部分,前端页面用wxml和js,后端用云函数。数据库操作通过小程序端的SDK或者云函数。比如提交申请的云函数会处理数据的写入,并计算时长。审批的云函数会更新状态,并可能触发通知。 可能遇到的问题包括云数据库的查询效率,尤其是当数据量大的时候,可能需要索引。另外,用户权限的管理,如何区分管理员和普通用户,可能需要一个管理员的openid列表存储在数据库中,或者在用户注册时分配角色。 最后,部署和发布小程序需要审核,确保符合微信的规定,比如类目选择正确,不涉及敏感信息等。</think>基于微信云开发的加班申报小程序设计方案: 1. 数据库设计(创建`overtime`集合): ```javascript { "_id": "xxx", // 自动生成 "name": "张三", // 申请人姓名 "department": "技术部", // 部门 "date": "2023-07-20", // 加班日期 "startTime": "18:30", // 开始时间 "endTime": "21:00", // 结束时间 "duration": 2.5, // 自动计算的时长 "reason": "项目上线", // 加班事由 "status": 0, // 0待审批 1通过 2拒绝 "approver": "李四", // 审批人 "comment": "", // 审批意见 "openid": "xxx", // 申请人openid "createTime": "2023-07-20T10:00:00Z" // 创建时间 } ``` 2. 云函数实现(以提交申请为例): ```javascript // cloudfunctions/addOvertime/index.js const cloud = require('wx-server-sdk') cloud.init() exports.main = async (event, context) => { const wxContext = cloud.getWXContext() // 计算时长 const [startH, startM] = event.startTime.split(':') const [endH, endM] = event.endTime.split(':') const duration = (endH - startH) + (endM - startM)/60 return await cloud.database().collection('overtime').add({ data: { ...event, duration: duration.toFixed(1), status: 0, openid: wxContext.OPENID, createTime: db.serverDate() } }) } ``` 3. 小程序端页面示例(提交页面): ```html <!-- pages/apply/apply.wxml --> <view class="container"> <form bindsubmit="submitForm"> <picker name="date" mode="date" value="{{date}}"> <view class="form-item">日期:{{date || '请选择'}}</view> </picker> <picker name="startTime" mode="time" value="{{startTime}}"> <view class="form-item">开始时间:{{startTime || '请选择'}}</view> </picker> <picker name="endTime" mode="time" value="{{endTime}}"> <view class="form-item">结束时间:{{endTime || '请选择'}}</view> </picker> <input name="reason" placeholder="加班事由" /> <button form-type="submit" type="primary">提交申请</button> </form> </view> ``` 4. 实现功能要点: - 使用云开发三大基础能力:数据库、云函数、存储 - 权限控制:通过openid实现数据隔离 - 自动计算加班时长 - 审批流程状态管理 - 使用微信原生组件实现时间选择 - 数据校验(前端+云函数双重校验)
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值