两篇秘籍即可搞定宜搭开发-进阶功

终于又有时间写文章了,呜呜呜~~

1 页面如何实现定制化需求:

1.1 数据管理页面自定义按钮

对于自定义按钮在宜搭的数据管理页面实现是简单的:

  • 打开表格设置

在这里插入图片描述

  • 选择自定义按钮

    在这里插入图片描述

1.2 数据管理页面自定义弹窗

this.utils.dialog({
	method: 'confirm',
	title: '提示',
	content: '决算金额和采购金额不一致',
	footerActions: ['cancel', 'ok'],
	onOk: () => {
		console.log("onOk")
	},
	onCancel: () => {
		console.log("onCancel")
	},
	onClose: () => {
		console.log("onClose")
	}
})

关于这些 API 我们都可以在宜搭的官方文档进行查阅,但是这里我还是希望列出几个比较常用的 API 的。

1.3 数据管理页面的权限控制

首先我们要阐述清楚数据管理页面里面的权限有哪些?

  • 选择到数据管理页面 => 进入到页面设置

在这里插入图片描述

  • 选择权限设置:

    发现数据管理页面的操作权限有:查看,新增,删除,批量导入,批量导出,批量下载文件,批量打印,批量下载二维码,批量修改,批量删除

在这里插入图片描述

这里我们控制的权限是宜搭的数据管理页面的权限

这里的设置成员的内容,我就跟表单的权限设置到时候一起说了,是相同的内容

2 表单如何实现定制化需求:

2.1 表单实现根据不同条件控制展示状态以及必填状态

// 设置组件的展示状态
// 状态我们可以填写的:NORMAL 正常,即输入态 READONLY 只读 DISABLED 禁用 HIDDEN 隐藏
this.$('textField_setbehavior').setBehavior('DISABLED')
// 设置验证规则
// 这里的验证规则有很多种;官方提供了:
/** 支持校验的规则:属性
	必填:{"type": "required"}
	最小长度:{"type": "minLength", "param": "23" }
	最大长度:{"type": "maxLength", "param": "23" }
	邮箱:{"type": "email"}
	手机:{"type": "mobile"}
	网址:{"type": "url"}
	最小值:{"type": "minValue", "param": "3"}
	最大值:{"type": "maxValue", "param": "3"}
	自定义函数:{"type": "customValidate", "param": (value, rule) => { return ture; }}
**/
this.$(fieldId).setValidation([{
      type: 'required'
    }])
// 关闭验证规则
this.$('employeeField_m5udaztr').disableValid([{
      type: 'required'
    }])

2.2 通过 js 代码实现不同表单的数据交互

首先我想分享一下官方文档提供的表单相关的API:

跨应用数据源API | 钉钉宜搭·帮助中心

我们使用最多的应该是表单相关 API 和流程相关 API

在这里插入图片描述

现在我开始做一个调用的 demo 流程:

  • 首先进入我们的数据源里面新建远程 API

在这里插入图片描述

关于请求地址我们可以通过

官方文档提供的进行填写:

在这里插入图片描述

注意点:

  • 如果要用 searchFieldJson 的时候我们需要将它通过 JSON.stringify 进行转换

在这里插入图片描述

  • 这里我们如果不传 pageSizecurrentPage 它默认会传10,1

    这样有可能会导致一种情况就是可能我们有一种场景是获取一个表单的所有数据,但是就是展示不全。之所以展示不全的原因就是因为我们没有去控制这两个参数的传参。

  • 关于 searchFieldJson 这里我还有一点想要补充的就是我们的组件传参是有规范的,请参考官方文档:

    在这里插入图片描述

    成员组件和部门组件是有点特殊的这里我专门列举一下:

    部门选择 字符串数组 ["1123456"] ["xxx"] 里面是部门 id
    成员组件 字符串数组 ["1123456"] ["xxx"] 里面是成员 id
    

相信通过这样一个流程,你应该是把调用宜搭的 API 掌握好了,其实其它的都是举一反三。

关于不同应用的不同表单的数据交互,其实本质都是一样的,都是通过调用宜搭的 API 去实现。

2.3 设置组件 Value

既然数据我们拿过来了,那么我们肯定是要到我们这个表单或者页面做什么事情的,这个时候就需要用到 this.$('textField_set').setValue('hello') this.$(fieldId).set(key, data)

关于不同组件的设置这里我想要举几个特殊的例子:

// 设置下拉框组件
// tempList是一个数组
this.$("selectField_xxxxxxxx").set("dataSource", tempList);

// 设置子表单
// demoList是一个对象数组,这个对象包含的是你子表单中的 组件唯一标识码 + 对应的value值
// 比如说:
/** 
	demoList.push({
              "selectField_xxxxxxxx": "" + item.formData.textField_xxxxxxxx,
              "numberField_xxxxxxxx": "" + item.formData.numberField_xxxxxxxx
            })
**/
 this.$('tableField_m21gjnkt').setValue(demoList);

2.4 通过 js 代码实现调用后端代码

  1. 首先通过连接器工厂创建 HTTP 连接器

    在这里插入图片描述

  2. 关于 HTTP 连接器里面的配置,填写域名,根据不同的请求协议进行选择,配置好接口请求即可
  3. 数据源中创建连接器

    在这里插入图片描述

  4. 后面的操作就是跟前面的表单的数据交互是一样的调用方法
    注意的地方
    • 当我们要去调用后端的代码的时候,我们一般是要带 token 的,所以你需要先去获取 token

    • 在调用的时候我们可能配置需要配置很多内容,比如说:Headersbodyquery

       inputs: JSON.stringify(
            {
              "Headers": {
                "content-type": "application/json",
                "Authorization": "Bearer " + tokens
              },
              "body": {
                "fields": 'xxxx',
              }
            }
          )
      

相信通过上面的讲解流程,你已经可以实现对于所有数据不同方式交互的需求了。

2.5 表单提交前的校验

对于表单提交前的校验,我们可以发现很多时候是去做唯一性校验的,比如说我现在有一个学生的学号,已经创建过了,所以我们在新增一条新的数据之前就应该去做校验:

  • 选择表单设置,选择表单校验,添加公式校验(基本上都使用 EXIST() 函数)

    在这里插入图片描述

  • 当然我们这里也可以去使用 js 代码,然后在表单提交前去做一些校验,这里我们还可以在表单提交后去做一些处理,都是可以的

2.6 表单的权限配置

关于表单的权限配置这里面的内容也算比较重要的,也是我们宜搭实现需求中重要的一环。

首先我们要阐述清楚表单里面的权限有哪些?

  • 编辑表单-页面设置-权限设置

    在这里插入图片描述

  • 注意点:

    • 我们通常去修改新增表单的权限设置的查看状态的权限
  • 你可能会问我们数据管理页面和表单的权限有什么区别?

    数据管理页面的权限代表的是用户对这个数据管理页面即列表页的操作权限

    而表单的权限代表的是对表单即单条数据的操作权限

  • 这里我想要提一个需求也是我们常用的一个需求就是我希望管理员看到所有的数据,对于个人来说只能看到自己的数据,这个需要如何实现呢?

    对于管理员来说(权限成员选择自定义):

    • 宜搭提供了两种方式:1. 选择钉钉的角色 2. 选择宜搭自建角色在这里插入图片描述

      宜搭自建角色操作流程

      在这里插入图片描述

      在这里插入图片描述

      创建成功即可在权限组进行选择。

    所以基本对于管理员来说就这样设置权限即可满足需求

    对于个人来说只能看到自己的数据这个需求:

    • 直接在权限中设置条件,自定义过滤条件即可。

在这里插入图片描述

在这里插入图片描述

以上就是我对整个数据管理页面和表单的定制化需求场景的一些实现,我希望你能掌握,掌握了之后,90% 的业务你都是可以实现的。

3 集成自动化如何实现定制化需求

关于集成自动化的定制化需求呢,倒是内容也不多。

我简单的提几点吧:

  • 集成自动化作用:

    其实集成自动化的作用就是做数据交互的,通过不同的筛选条件,去获取数据,处理数据。

  • 集成自动化合理运用公式:

    关于集成自动化的公式的运用的话,参考:逻辑函数 | 钉钉宜搭·帮助中心

4 报表页的定制化需求

对于报表页面来说,其实也是我们开发中重要的一个场景。

这里有几个注意点:

  • 报表的数据是来自于表单的,报表的权限继承于表单的权限,所以这里你可能需要考虑报表和表单的权限问题。
  • 其实报表无非就是统计以及各种表格的体现,报表页的需求也是比较单一的,你可以去玩一下就知道了。
  • 报表其实这里也需要你合理的运用公式的。比如说 COUNT(),SUM().... 等等函数。

总结

上面这里我介绍了宜搭的多种业务场景需求的案例以及对应的实现方法,当然这里也是不全面的,但是学习完上面这些,应该也能满足你 80% 的开发业务了。接着这里其实还有很多内容还没介绍的,比如说自定义页等等,这个你可以自己去尝试做一下。

因为我遇到了一个需求是希望能够批量一键审核通过,这个你通过审批表单或者普通表单生成的数据管理页面也是很难满足这个需求的。确实这里可以通过自定义页面来实现。
但是我还想要说一下开发这么久的低代码平台来说,可能你会发现有些需求其实通过低代码实现还是有局限性的,但是确实也有解决方案,就是说可能需要我们通过多几步操作来实现。对于这个批量一键审核通过,我最后是通过导入导出+集成自动化交付给业主的,后期我再用自定义页面优化迭代上去的。

所以这就是我关于宜搭的第二篇秘籍了,希望你配合第一篇秘籍看,希望对你有所帮助!有问题欢迎交流!

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值