CodeWave智能开发平台--03--目标:应用创建--08联系人管理

在这里插入图片描述

摘要

本文是网易数帆CodeWave智能开发平台系列的第11篇,主要介绍了基于CodeWave平台文档的新手入门进行学习,实现一个完整的应用,本文主要完成08联系人管理

CodeWave智能开发平台的11次接触

CodeWave参考资源

网易数帆CodeWave开发者社区课程中心

在这里插入图片描述

网易数帆CodeWave开发者社区文档中心

在这里插入图片描述

网易数帆CodeWave开发者社区考试认证

在这里插入图片描述

应用开发流程

在这里插入图片描述

经过上篇文章的初级入门,对CodeWave低代码平台有了一定的认知,在模板的范围内开发一个特点的程序还是比较容易的,但同时需要说明的是,低代码平台有很多自己的逻辑,如果都学完在操作,实在是需要较长时间,本文结合应用开发流程,进行专题学习,应用创建☀️☀️

应用开发-搭建采购管理系统

视频来源

应用开发流程-08-联系人管理

进入自己的CodeWave智能开发平台
https://itzhang.codewave.163.com/dashboard/product/Home

待实现效果

在这里插入图片描述

快速创建联系人管理表格

联系人表格组需要展示的是所属供应商,联系人姓名,联系人电话,岗位名称,创建时间。
查找的表单报考联系人姓名,所属供应商。

修改实体
在这里插入图片描述

在联系人管理页面拖入一个面板,
给面板里拖入一个contact实体,选择列表全
在这里插入图片描述

在查询表单项中,关联供应商id这里,想展示的是一个供应商的名称,展示的应该是一个下拉选择框,显示所有供应商的信息,但自动生成的是一个数字类型的供应商id信息,报考弹窗中的表达项也是一样的问题。那我们需要将供应商id输入这块改成下拉选择。
第一种方式是把弹窗中的供应商关联id后的输入框删除,把供应商实体拖入对应的位置,往下可以选择选择框样式,再对这个选择框的值进行绑定即可
在这里插入图片描述
第2种方式更为方便,撤回上一部对应的操作(回撤到拖入数据表格之前)
在联系人实体的supplierid属性中有一个关联属性,设置关联属性为supplier供应商实体中的id,同时有关联属性实体记录删除规则(包含不允许删除和允许删除同时且同时删除本实体记录),我们以供应商和联系人关联属性为例,当供应商下有多个关联联系人数据,在联系人实体关联属性删除规则选择不允许删除时,无法删除该供应商数据,需要先把供应商的联系人删除,才能删除该供应商数据。如果选择《允许删除同时且同时删除本实体记录》规则,则删除供应商数据时,相关联的联系人数据也会相应的全部删除。一般我们选择不允许删除。
产品实体中也有供应商id,这两个步骤一样,进行关联,并选择不允许删除
在这里插入图片描述
这时把联系人实体拖入进来,关联供应商id就变成了下拉选择
在这里插入图片描述

发布查看效果
表达筛选项供应商id会选择供应商的名称,创建的弹窗中供应商id也是供应商名称下拉
在这里插入图片描述

回到可视化开发页面,在逻辑中,可以看到后台自动创建了loadContactsListSelect_2Supplier服务端逻辑。点击查看该逻辑。
右键该逻辑,查看此逻辑的引用位置。会看到有两位位置使用了改逻辑。一个是查询表单项中的关联供应商ID选择器,还有一个是弹窗中的供应商选择器。这条逻辑实际上就是用来为选择器中的供应商列表提供数据的。
在这里插入图片描述
点击该数据源的调用逻辑,会发现也是一样先从服务端查询数据,再在前端选择器数据源中进行调用,这样我们就了解了供应商选择器中数据的来源了。
在今后的学习中,同学们也可以通过这种方式快速查找逻辑或变量的引用位置。
在这里插入图片描述

现在选中选择器,在右侧属性中我们还可以来更改展示的供应商内容,选中值代表的就是选中下拉选择框内容后,给到filter变量中存储,文本字段就是展示在下拉选择中的供应商的属性,现在展示的供应商名称supplier.name,也可以选择为地址等级等。值字段则代表选择后存储的值supplier.id,这里存给filter变量的是供应商id.
在这里插入图片描述

下方还可以添加选项辅助文本。也就是在下拉选择框名称下可以有灰色的辅助文本,比如把他打开添加一个供应商地址,也可以给
在这里插入图片描述

,预览查看效果,会发现供应商名称下有一个辅助的供应商地址文本。
在这里插入图片描述
在这里插入图片描述

我们还要对表格做一些简单的调整,将查询表达项标题全部删除,给查询关联供应商id的占位符修改为请选择所属供应商。
在这里插入图片描述

实际效果中没有查询按钮,进行选择后,表单项内容有更改就会直接对数据表格进行筛选刷新,所以我们将查询按钮删除,然后给输入框和选择器单独添加事件逻辑。输入框加上一个 输入时 的逻辑。然后在里面添加刷新表格的操作。
在这里插入图片描述
选择器添加一个选择后的逻辑,也是一样刷新表格。

再来调整一下下方表格列的顺序,关联供应商ID挪到前面,并把关联供应商ID文本改成所属供应商,然后把创建时间挪到操作前面。
在这里插入图片描述

选择预览
可以看到输入时,表格实时改变,但选择框存在问题。
在这里插入图片描述
在这里插入图片描述

我们回答可视化设计器中,把查询的输入框和选择器的位置调整一下,再将表单的布局占位删除,再来选择器,将事件修改一下。改为改变后.
在这里插入图片描述

在这里,联系人的所属供应商ID与供应商实体中的ID是关联在一起的,因此查询供应商ID的时候,实际上进行了多表联查,我们进入到服务端逻辑中来仔细观察一下多表联查的过程。找到用来给联系人表格提供数据源的服务端逻辑,
在这里插入图片描述
接着点击定位该逻辑,
在这里插入图片描述在这里插入图片描述
双击编辑,进入数据查询,我们发现在这里,查询数据源里关联了两个实体数据源,点击左侧,发现里面提供了4种链接类型,内外左外右外链接等,因为我们之前在实体中设置了供应商ID关联,所以这里系统默认将两个关联属性设置为等于,也就是说,在查询过程中,找出两个表格中供应商ID相等的数据,这就是多表联查的逻辑实现。
在这里插入图片描述

为表达项添加验证规则并导出表格数据

现在我们来优化弹窗的效果,创建与修改用的同一个弹窗,平台已经提供了基本的创建或修改功能,现在我们还需要对一些细节做调整,首先给创建按钮调整一下内容新增联系人,在查询加一个图标。
在这里插入图片描述

再编辑一下弹窗,表单项标题宽度都改为小,关联供应商id改为所属供应商。
在这里插入图片描述

在效果中发现,当我们没有联系人和所属供应商时,或电话号码填错时,表单下方会有提示,并且点击立即创建按钮无效。
我们需要把联系人名称和关联供应商设置为必填项,第一种方法是在数据建模的时候,把相关属性勾选为必填选项,这样通过拖拽出来的弹窗里的表达项就默认自带一个必填验证规则。
第二种方式手动添加验证规则,首先给他们添加一个必填标记,接下来需要设置一个必填的验证规则
以第一个联系人姓名为例,同样也是选中表达项,进入到属性中的验证规则表达式,从右侧组件中,找到验证规则组件拖入,平台提供了许多常用的规则,必填可以选择filler和required,这两者的区别就是一个不能为空,一个可以为空,这里选择filled,下方的提示内容默认为表达项不能为空,我们也可以拖入文本来填入(比如联系人姓名不得为空)。
在这里插入图片描述
我们可以复制这验证规则,退出,来到供应商的验证规则下,粘贴拖入,提示内容改为所属供应商不得为空。
在这里插入图片描述
最后还有电话,拖入验证规则,在特定场景判断规则下找到一个mobile,输入合法手机号校验,下方还可填写地区,比如zh-CN代表中国大陆。
在这里插入图片描述
如果想取消验证规则,只需要把表单项的忽略验证即可。

导出数据到本地实现

拖入一个按钮组件,选择次要按钮,修改一下文本内容,添加一个下载图标,添加一个下载图标,添加一个点击事件,添加一个调用逻辑,tableview下有一个exportExcel逻辑,使用这个逻辑,就可以直接导出表格数据了。
在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/608475.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

【VRTK】【Unity】【VR开发】Linear Drives

课程配套学习项目源码资源下载 https://download.csdn.net/download/weixin_41697242/88485426?spm=1001.2014.3001.5503 【概述】 前面一篇讨论了角度运动机制,本篇讨论线性运动机制。和角度运动机制类似,线性运动机制提供了更为仿真的互动机制。也分为基于物理的和不基于…

doris部署

doris-2.0.1.1部署安装 一、下载doris安装包二、解压到/data下,修改名称三、修改fe配置文件四、启动doris-fe五、验证doris-fe六、修改be配置文件七、启动doris-be八、mysql中连接be,在Doris中添加后端节点九、设置密码 一、下载doris安装包 wget https…

ArrayBlockingQueue原理探究

类图结构 同样,为了能从全局一览ArrayBlockingQueue的内部构造,先来看它的类图。 ArrayBlockingQueue的内部有一个数组items,用来存放队列元素,putindex变量表示入队元素下标,takelndex是出队下标,count统计队列元素个…

雅意2.0:打造专为中文优化的300亿参数多语言模型

前言 雅意2.0,作为一款专注于中文语境的开源大型语言模型,其在多语言处理方面的能力尤为突出。该模型不仅具有300亿参数规模的庞大体量,还在多个关键领域取得了显著的技术突破。 Huggingface模型下载:https://huggingface.co/wen…

大前端nestjs入门教程系列(四):如何nestjs整合mysql数据库

经过前面的几篇文章,想必大家已经对nestjs有了基础的了解,那么这篇文章就带大家玩玩数据库,学会了这篇,就离大前端又进了一步 Nest与数据库无关,使你可以轻松地与任何 SQL 或 NoSQL 数据库集成。 根据你的喜好&#xf…

【面试高频算法解析】算法练习3 双指针

前言 本专栏旨在通过分类学习算法,使您能够牢固掌握不同算法的理论要点。通过策略性地练习精选的经典题目,帮助您深度理解每种算法,避免出现刷了很多算法题,还是一知半解的状态 专栏导航 二分查找回溯(Backtracking&…

权威mcc mnc 列表网址

MCC-MNC.net 链接: MCC-MNC.net 这个网站提供的mcc mnc 比下面itu文档中更全。 itu.int 2023年发布的mcc mnc分配信息: 链接: PDF T-SP-E.212B-2023 若想获取最新的可以参考如下截图查询:

LeetCode刷题12:贪心算法解决1402.做菜顺序

一个厨师收集了他 n 道菜的满意程度 satisfaction ,这个厨师做出每道菜的时间都是 1 单位时间。 一道菜的 「 like-time 系数 」定义为烹饪这道菜结束的时间(包含之前每道菜所花费的时间)乘以这道菜的满意程度,也就是 time[i]*sa…

一文6个步骤带你实现接口测试入门

一、接口测试概述 1 什么是接口测试: 接口测试是测试系统组件间交互的一种测试。接口测试主要用于检测外部系统与系统之间,内部各个子系统之间的交互点。测试的重点是要检查数据的交换,传递和控制管理过程,以及系统间的相互逻辑依…

SpringBoot+Prometheus+Grafana搭建应用监控系统

1.应用监控系统介绍 SpringBoot的应用监控方案比较多,SpringBootPrometheusGrafana是比较常用的一种解决方案,主要的监控数据的处理逻辑如下: SpringBoot 的 actuator 提供了应用监控端点,可以对外暴露监控数据信息。Prometheu…

C++深入学习之模板

为什么需要模板 先来看下面一段程序: int add(int x, int y) {return x y; }double add(double x, double y) {return x y; }long add(long x, long y) {return x y; }string add(string x, string y) {return x y; }//T1 T2 T3 T3 add(T1 x, T2 y) {return…

基于OpenCV的图像缩放

基础概念 缩放是将图像的尺寸变小或变大的过程,即减少或增加原图像数据的像素个数,或者说通过增加或删除像素点来改变图像的尺寸; 基本原理:将分辨率(图片尺寸)为(w,h)的图像,缩放后其图像分辨…

jvm虚拟机初识

JVM Java虚拟机就是二进制字节码的运行环境,负责装载字节码到其内部,解释/编译为对应平台上的机器指令执行。每一条Java指令,Java虚拟机规范中都有详细定义,如怎么取操作数,怎么处理操作数,处理结果放在哪…

服务器监控软件夜莺使用(二)

文章目录 一、采集器安装1. Categraf简介2. Categraf部署3. 测试服务器部署4. 系统监控插件5. 显卡监控插件6. 服务监控插件 二、监控仪表盘1. 机器列表2. 系统监控3. 服务监控 三、告警配置1. 邮件通知2. 告警规则3. 告警自愈 一、采集器安装 1. Categraf简介 Categraf 需要…

聚道云软件连接器助力某贸易公司实现付款流程自动化

客户介绍: 某贸易公司是一家集进出口贸易、国内贸易、电子商务等业务于一体的综合性贸易企业。公司业务遍及全球多个国家和地区,拥有庞大的供应商网络和采购需求。 添加图片注释,不超过 140 字(可选) 客户痛点&#…

CAN转RS232学习笔记

2024-1-9 用keil打开工程后,打开main.c文件 报错:error in include chian 网络解决方法: KEIL消除警告:error in include chain(cmsis_armcc.h):expected identifier or ‘(‘-CSDN博客 上文链接包含的链接(套娃&am…

前端JS加密对抗由浅入深-2

前言: 本文主要讲解,针对前端非对称、多段加密数据传输站点,如何进行动态调试,如何进行安全测试。本次讲解不涉及任何漏洞方面,仅为学习探讨,该站点现已经更改加密方式,严禁非法测试&#xff0…

如何使用内网穿透实现iStoreOS软路由公网远程访问局域网电脑桌面

文章目录 简介一、配置远程桌面公网地址二、家中使用永久固定地址 访问公司电脑**具体操作方法是:** 简介 软路由是PC的硬件加上路由系统来实现路由器的功能,也可以说是使用软件达成路由功能的路由器。 使用软路由控制局域网内计算机的好处&#xff1a…

一文弄懂SpringCloud Stream

目录 SpringCloud StreamSpringCloud Stream相关概念SpringCloud Stream使用 SpringCloud Stream Spring Cloud Stream 是一个构建消息驱动微服务的框架,Spring Cloud Stream 提供了一个抽象层,屏蔽了不同消息中间件之间的差异,使得开发人员…

Java学习笔记-day05-响应式编程初探-自定义实现Reactive Streams规范

最近在学响应式编程,这里先记录下,响应式编程的一些基础内容 1.名词解释 Reactive Streams、Reactor、WebFlux以及响应式编程之间存在密切的关系,它们共同构成了在Java生态系统中处理异步和响应式编程的一系列工具和框架。 Reactive Streams…