宜搭低代码高级认证实操题1 todolist

进行中待办

已完成待办

待办事项

待办事项远程api和变量配置

回调函数

function didFetch(content) {
  //console.log(content.data);
  // content.b = 1; 修改返回数据结构中的 b 字段为1

  let res = content.data;
  let todoList = [];
  for(let i in res){
    todoList.push(res[i]);
  }
  console.log("todolist",todoList);

  let result = {
    "data": todoList,
    "CurrentPage": content.CurrentPage,
    "totalCount": content.totalCount
  }
  return result; // 重要,需返回 content
}

回调函数

function didFetch(content) {
  // content.b = 1; 修改返回数据结构中的 b 字段为1
  let res = content.data;
  let doneList = [];
  for(let i in res){
    doneList.push(res[i]);
  }
  console.log(doneList);
  let result = {
    "data": doneList,
    "CurrentPage": content.CurrentPage,
    "totalCount": content.totalCount
  }
  return result;  // 重要,需返回 content
}

页面js

/**
* 尊敬的用户,你好:页面 JS 面板是高阶用法,一般不建议普通用户使用,如需使用,请确定你具备研发背景,能够自我排查问题。当然,你也可以咨询身边的技术顾问或者联系宜搭平台的技术支持获得服务(可能收费)。
* 我们可以用 JS 面板来开发一些定制度高功能,比如:调用阿里云接口用来做图像识别、上报用户使用数据(如加载完成打点)等等。
* 你可以点击面板上方的 「使用帮助」了解。
*/

// 当页面渲染完毕后马上调用下面的函数,这个函数是在当前页面 - 设置 - 生命周期 - 页面加载完成时中被关联的。
export function didMount() {
  console.log(`「页面 JS」:当前页面地址 ${location.href}`);
  // console.log(`「页面 JS」:当前页面 id 参数为 ${this.state.urlParams.id}`);
  // 更多 this 相关 API 请参考:https://aliwork.com/developer/API
  // document.title = window.loginUser.userName + ' | 宜搭';
  this.$('dialog_lty04ne9').hide();
  this.$('dialog_ltzi2k7t').hide();
}

let isUpdate = false;
let updateformInstId = '';
let deleteformInstId = '';
/**
* dialog onCancel
*/
export function onCancel() {
  console.log('onCancel');
  this.$('dialog_lty04ne9').hide();
}

/**
* dialog onClose
*/
export function onClose() {
  console.log('onClose');
  this.$('dialog_lty04ne9').hide();
}




export function onActionBarItemClick() { 
  this.$('textField_lty04nea').set('value', '');
  this.$('radioField_lty04neb').set('value', '');
  this.$('rateField_lty04nec').set('value', '');
  this.$('dateField_lty04nee').set('value', '');
  this.$('textareaField_lty04ned').set('value', '');
  this.$('dialog_lty04ne9').show();
  }

/**
* dialog onOk
*/
export function onOk() {
  console.log('onOk');
  let todo = this.$('textField_lty04nea').getValue();
  let asort = this.$('radioField_lty04neb').getValue();
  let importance = this.$('rateField_lty04nec').getValue();
  let remindtime = this.$('dateField_lty04nee').getValue();
  let detail = this.$('textareaField_lty04ned').getValue();

  let formData = {
    "textField_ltxp13oi":todo,
    "radioField_ltxp13oj": asort,
    "rateField_ltxp13ok": importance,
    "dateField_ltxp13ol": remindtime,
    "textareaField_ltxp13om": detail,
  };

console.log(formData);

  let formDataJson = [];


  if(isUpdate){
    //更新数据
    let params2 = {
      formInstId: this.updateformInstId,
      updateFormDataJson: JSON.stringify(formData)
    };

    this.dataSourceMap.updateData.load(params2).then(res => {
      this.$('dialog_lty04ne9').hide();
      this.utils.toast("更新成功");
      this.getTodoList();
    });
  }else{
  //保存数据
  let params1 = {
    formUuid: "FORM-7A3395D5626C45FBA6BF08B40555B86266PI",
    appType: "APP_M3YO82RIZE2UJV4R87TW",
    formDataJson: JSON.stringify(formData)
  };

  this.dataSourceMap.saveData.load(params1).then(res =>{
   
    this.$('dialog_lty04ne9').hide();
    this.utils.toast("保存成功");
    this.getTodoList();
  })

  }
}

//点击todolist的删除
export function onActionClick(rowData) {
  this.deleteformInstId = rowData.formInstId;
  this.$('dialog_ltzi2k7t').show();
  
  }


export function getTodoList(){
  this.dataSourceMap.getTodoList.load().then(res =>{
    //console.log("todo",res.data);
  });
 
}


export function getDoneList() {
  this.dataSourceMap.getDoneList.load().then(res => {
    //console.log("done", res.data);
   });

}



//删除done
export function onDeleteDoneActionClick(rowData) {
    console.log(rowData);
  let params2 = {
    formInstId: rowData.formInstId
  }
  this.dataSourceMap.deleteData.load(params2).then(res => {
    this.utils.toast("删除成功");
    this.getDoneList();
  })
  }


//数据填充到对话框
export function onEditTodoActionClick(rowData) {

 
    isUpdate = true;
  this.$('dialog_lty04ne9').set('title','更新待办');
    let formData = rowData.formData;
    let arr = [];
    for (let i in formData) {
      arr.push(formData[i]);
    }
    console.log(arr);
  let todo = arr[0];
  let asort = arr[2];
  let importance = arr[4];
  let remindtime = arr[1];
  let detail = arr[6];
  

  this.$('textField_lty04nea').set('value',todo);
  this.$('radioField_lty04neb').set('value', asort);
  this.$('rateField_lty04nec').set('value',importance);
  this.$('dateField_lty04nee').set('value',remindtime);
  this.$('textareaField_lty04ned').set('value', detail);

  this.$('dialog_lty04ne9').show();

  this.updateformInstId = rowData.formInstId;
  }




/**
      * 选择(或取消选择)数据之后的回调
      * @param selected Boolean 是否选中
      * @param rowData Object 当前操作行
      * @param selectedRows Array 选中的行数据
      */
      export function onSelect(selected, rowData, selectedRows) {
        console.log('selectedRows',selectedRows);
   
       //删除todolist里这条数据
        let params2 = {
          formInstId: rowData.formInstId
        }
        this.dataSourceMap.deleteData.load(params2).then(res => {
          console.log('删除成功');
        })


       //保存上面删除的数据到donelist
        let formData = rowData.formData;
        let arr = [];
        for (let i in formData) {
          arr.push(formData[i]);
        }
        console.log('arr',arr);
        let todo = arr[0];
        let asort = arr[2];
        let importance = arr[4];
        let remindtime = arr[1];
        let detail = arr[6];

        let formData1 = {
          "textField_ltxpa412": todo,
          "radioField_ltxpa413": asort,
          "rateField_ltxpa414": importance,
          "dateField_ltxpa415": remindtime,
          "textareaField_ltxpa416": detail
        };

        let params1 = {
          formUuid: "FORM-BC3BEDD73A9046B79868D53414D1D89CZXG7",
          appType: "APP_M3YO82RIZE2UJV4R87TW",
          formDataJson: JSON.stringify(formData1)
        };

        this.dataSourceMap.saveData.load(params1).then(res => {
          console.log('保存成功');
        })
        this.getDoneList();
        this.getTodoList();

      }

/**
* dialog onCancel
*/
export function onCancelDelete() {
  console.log('onCancel');
  this.$('dialog_ltzi2k7t').hide();
}

/**
* dialog onClose
*/
export function onCloseDelete() {
  console.log('onClose');
  this.$('dialog_ltzi2k7t').hide();
}

/**
* dialog onOk
*/
export function onOkDelete() {

  let params2 = {
    formInstId: this.deleteformInstId
  }
  this.dataSourceMap.deleteData.load(params2).then(res => {
    this.$('dialog_ltzi2k7t').hide();
    this.utils.toast("删除成功");
    this.getTodoList();
  })
}

/**
* tablePc onFetchData
* @param params.currentPage 当前页码
* @param params.pageSize 每页显示条数
* @param params.searchKey 搜索关键字
* @param params.orderColumn 排序列
* @param params.orderType 排序方式(desc,asc)
* @param params.from 触发来源(order,search,pagination)
*/
export function onFetchData(params) {
  // 如果是搜索的话翻页重置到 1
  if (params.from  === 'search') {
    params.currentPage = 1;
  }
  this.dataSourceMap['getTodoList'].load(params);

  // 如果你需要把表格查询条件保存起来,可以取消下一行注释,并添加一个 params 的变量类型数据源
  // this.setState({ tableParams: params });

  // 如果使用远程接口作为表格数据源,理论上你只需要将下方的“dataSourceName”改为实际的数据源名称即可
 // this.dataSourceMap['dataSourceName'].load(params);
  
}

/**
* tablePc onFetchData
* @param params.currentPage 当前页码
* @param params.pageSize 每页显示条数
* @param params.searchKey 搜索关键字
* @param params.orderColumn 排序列
* @param params.orderType 排序方式(desc,asc)
* @param params.from 触发来源(order,search,pagination)
*/
export function onFetchData2(params) {
  // 如果是搜索的话翻页重置到 1
  if (params.from  === 'search') {
    params.currentPage = 1;
  }

  // 如果你需要把表格查询条件保存起来,可以取消下一行注释,并添加一个 params 的变量类型数据源
  // this.setState({ tableParams: params });

  // 如果使用远程接口作为表格数据源,理论上你只需要将下方的“dataSourceName”改为实际的数据源名称即可
  this.dataSourceMap['getDoneList'].load(params);
 
}

/**
* tablePc onFetchData
* @param params.currentPage 当前页码
* @param params.pageSize 每页显示条数
* @param params.searchKey 搜索关键字
* @param params.orderColumn 排序列
* @param params.orderType 排序方式(desc,asc)
* @param params.from 触发来源(order,search,pagination)
*/
export function onFetchData3(params) {
  // 如果是搜索的话翻页重置到 1
  if (params.from  === 'search') {
    params.currentPage = 1;
  }

  // 如果你需要把表格查询条件保存起来,可以取消下一行注释,并添加一个 params 的变量类型数据源
  // this.setState({ tableParams: params });

  // 如果使用远程接口作为表格数据源,理论上你只需要将下方的“dataSourceName”改为实际的数据源名称即可
  this.setState({
    searchKey: params.searchKey,
    page: params.currentPage
  });
}

数据绑定表

todoList

doneList

动作设置

操作列

顶部操作:新增待办

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

基于Springboot Vue医院管理系统+数据库脚本+文档(万字)

项目效果视频: 基于Springboot Vue医院管理系统 一、 项目介绍 角色:管理员、患者、医生 基于springboot vue实现的医院管理系统,有管理员、医生和患者三种角色。系统拥有丰富的功能,能够满足各类用户的需求,系统提供了登录和注册…

Reactor设计模式和Reactor模型

Reactor设计模式 翻译过来就是反应堆,所以Reactor设计模式本质是基于事件驱动。 角色 Handle(事件)EventHandler(事件处理器)ConcreteEventHandler(具体事件处理器)Synchronous Event Demult…

day07-缓存商品、购物车

1. 缓存菜品 1.1 问题说明 用户端小程序展示的菜品数据都是通过查询数据库获得,如果用户端访问量比较大,数据库访问压力随之增大。 结果: 系统响应慢、用户体验差 1.2 实现思路 通过Redis来缓存菜品数据,减少数据库查询操作。 缓…

分享全栈开发医疗小程序 -带源码课件(课件无解压密码),自行速度保存

课程介绍 分享全栈开发医疗小程序 -带源码课件(课件无解压密码),自行速度保存!看到好多坛友都在求SpringBoot2.X Vue UniAPP,全栈开发医疗小程序 - 带源码课件,我看了一下,要么链接过期&…

Docker 容器编排利器 Docker Compose

文章目录 一、Docker Compose 简介二、Docker Compose 安装2.1 Mac、Windows 平台默认支持2.2 Linux 安装(通过包管理)2.2.1 安装2.2.2 测试2.2.3 卸载 2.3 使用PIP 安装与卸载2.3.1 PIP安装2.3.2 PIP 卸载 三、基本使用3.1 术语3.2 部署Flask 应用 四、Compose 常用命令4.1 命…

【Java程序设计】【C00351】基于Springboot的疫情居家办公系统(有论文)

基于Springboot的疫情居家办公系统(有论文) 项目简介项目获取开发环境项目技术运行截图 项目简介 项目获取 🍅文末点击卡片获取源码🍅 开发环境 运行环境:推荐jdk1.8; 开发工具:eclipse以及i…

windows环境安装,GOPATH设置,编写Go代码:

目录 windows环境安装 GOPATH设置: 开始编写Go代码: Go Hello World 实例 执行 Go 程序 注意 使用编译器:Sublime Text - 先进的代码编辑器 windows环境安装 windows环境下,go安装包安装成功后,会自动将go添加到…

cad不用插件怎么批量打印?分享2种轻松的方法!

在工程设计、建筑制图等领域,CAD软件是不可或缺的工具。然而,对于很多用户来说,批量打印CAD文件却是一个让人头疼的问题。难道每次都需要安装繁琐的插件才能实现吗?其实不然,今天我们就来介绍几种无需插件,…

Python爬虫学习完整版

一、什么是爬虫 网络爬虫,是一种按照一定规则,自动抓取互联网信息的程序或者脚本。由于互联网数据的多样性和资源的有限性,根据用户需求定向抓取相关网页并分析也成为如今主流的爬取策略。 1 爬虫可以做什么 你可以爬取网络上的的图片&#…

WPF —— Expander折叠栏 、菜单标签 menu

Expander 1 :Expander折叠栏 简介 Expander控件有一个箭头按钮。单击箭头时,Expander中的子元素将显示或隐藏。箭头“展开”控件,使其子控件可见。 2 :Expander常用的属性 IsEnabled 默认是打开或者折叠起来,true就…

记录‘No module named ‘notebook.notebookapp‘’导致jupyter打不开的解决方法

最初是因为无法重命名文件的问题&#xff0c;更新了notebook&#xff0c;但是更新之后打不开了 在终端输入 jupyter notebook 报错 File "/Users/maclin/Library/Python/3.8/bin/jupyter-notebook", line 5, in <module> from notebook.notebookapp import ma…

Python学习笔记(二)

一&#xff1a;异常&#xff1a; 1.1&#xff1a;异常处理&#xff1a; 1.2&#xff1a;异常捕获&#xff1a; 1.3&#xff1a;异常传递&#xff1a; 二&#xff1a;模块&#xff1a; 2.1&#xff1a;模块的定义&#xff1a; 2.2&#xff1a;模块的导入&#xff1a; 2.3&…

网络原理(7)——以太网数据帧和DNS协议(数据链路层和应用层)

目录 一、以太网数据帧&#xff08;数据链路层&#xff09; 二、DNS协议(域名解析系统&#xff0c;应用层协议) 一、以太网数据帧&#xff08;数据链路层&#xff09; 以太网横跨了数据链路层和物理层&#xff0c;这里只做简单介绍&#xff0c;因为普通程序员用不到这一块&am…

canvas画带透明度的直线和涂鸦

提示&#xff1a;canvas画线 文章目录 前言一、带透明度的直线和涂鸦总结 前言 一、带透明度的直线和涂鸦 test.html <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><meta name"viewport" content…

#GIT|Git Flow#Gitflow工作流程

Gitflow是一种使用功能分支和多个主分支的Git分支模型&#xff0c;它适用于有预定发布周期的项目&#xff0c;也适用于DevOps最佳实践中的持续交付。这个工作流程不会添加任何新的概念或命令&#xff0c;而是为不同的分支分配了非常具体的角色&#xff0c;并定义了它们应该如何…

利用Python和IP技术实现智能旅游情报系统

文章目录 引言一、系统架构设计1. 数据采集模块2. 数据处理模块3. 用户界面模块 二、数据获取技术应用三、系统功能展示四、亮数据采集工具介绍五、总结六、号外 引言 随着旅游行业的不断发展&#xff0c;人们对旅游信息的需求也越来越大。为了帮助旅行者更好地规划行程&#…

PTA-练习8

目录 实验5-3 使用函数求Fibonacci数 实验5-4 输出每个月的天数 实验5-9 使用函数求余弦函数的近似值 实验5-11 空心的数字金字塔 实验6-6 使用函数验证哥德巴赫猜想 实验6-7 使用函数输出一个整数的逆序数 实验6-8 使用函数输出指定范围内的完数 实验8-1-7 数组循环右…

javascript三要素核验身份证号、姓名和人像是否匹配的身份证实名认证接口

在开发的过程中&#xff0c;总会用到各种各样的API接口来实现各种各样的功能。互联网信息时代&#xff0c;为确保注册用户身份信息的正确性&#xff0c;无论是手机端还是电脑端应用都需要进行实名认证来防止虚假身份的使用&#xff0c;维护公共利益和个人权益的安全&#xff0c…

云原生安全

云安全 https://wiki.teamssix.com 云服务安全 云服务&#xff0c;顾名思义就是云上的服务&#xff0c;简单的来说就是在云厂商&#xff08;例如 AWS、阿里云&#xff09;那里买的服务 云服务 S3 对象存储Simple Storage Service&#xff0c;简单的说就是一个类似网盘的东…

消息预知在线客服系统php网站源码

安装教程 服务器环境&#xff1a; 宝塔面板 &#xff0c;Nginx1.16-1.18&#xff0c;7.2.23<php<7.3&#xff08;因为升级了客服系统&#xff09;&#xff0c;Mysql5.6- Mysql5.7 网站运行目录为./public/ 访问网址http://你的域名/install.php进入安装程序即可 源码免…