找回密码
 立即注册

QQ登录

只需一步,快速开始

lovert

银牌会员

44

主题

502

帖子

2588

积分

银牌会员

积分
2588
lovert
银牌会员   /  发表于:2021-7-2 16:14  /   查看:6895  /  回复:16
本帖最后由 lovert 于 2021-9-6 12:16 编辑

image.png307954711.png
记得给单元格添加一个强制滚动样式,不然页面就是变化的
  1. .h{
  2.     overflow:scroll !important;
  3. }
复制代码
image.png193238219.png
image.png613855285.png



在页面加载命令里添加以下JS
  1. /*接口Forguncy.getTableDataByOData(参数1,参数2,参数3),参数1是OData公式获得的数据库数据,是已数组的方式存,参数2是数据获取成功后要执行的函数,这里在function(data){函数内容根据需要写,我这里是写的是加载LAYUI组件的代码},参数3是获取数据库失败的函数,这里我没做改变使用系统的*/
  2. Forguncy.getTableDataByOData("设备?$select=放置地点,设备名称及编号&$orderby=放置地点 asc",
  3. //获取成功的情况
  4. function(data){//开始
  5. var layuidata=new Array();        
  6. outerloop: for(i=0;i<data.length;i++)
  7. {
  8.         
  9. var fangzhi=data[i]["放置地点"];
  10. var data2=new Array();
  11.         innerloop:
  12.         for(i=i;i<data.length;i++){
  13.         if(data[i]["放置地点"]==fangzhi){
  14.         a='{"title":"erji","id":"erji"}';
  15.         a=a.replaceAll("erji",data[i]["设备名称及编号"]);
  16.         data2.push(a);
  17.         }
  18.         else{i=i-1;break innerloop;}
  19.         }
  20. var b='{"title": "yiji","children":[erji],"id":"yiji"}';
  21. b=b.replaceAll("yiji",fangzhi);
  22. b=b.replaceAll("erji",data2);
  23. layuidata.push(JSON.parse(b));

  24. }
  25. layui.use('tree', function(){
  26.     var tree = layui.tree;
  27.    var xuanzhong=new Array();
  28.     //渲染
  29.     var inst1 = tree.render({
  30.       elem: $('[fgcname="shuxing"]')[0]  //绑定元素
  31. ,showCheckbox:true
  32.       ,data:layuidata
  33. ,id: 'demoId'
  34. ,oncheck: function(obj){
  35. var checkedData = tree.getChecked('demoId'); //获取选中节点的数据
  36.     datak=new Array();

  37.              for(i=0;i<checkedData.length;i++){
  38. for(k=0;k<checkedData[i].children.length;k++)
  39. {
  40. datak.push(checkedData[i].children[k].title);
  41. }
  42. console.log(datak.toString());
  43. Forguncy.Page.getCell("zhi").setValue(datak.toString());
  44. }
  45. }
  46.     });
  47. });



  48. },// 结束,获取失败的情况
  49. function(errorMessage){
  50. alert(errorMessage);
  51. }
  52. );
复制代码


树形组件.fgcc

625.45 KB, 下载次数: 599

评分

参与人数 3金币 +999 满意度 +10 收起 理由
Chelsey.Wang + 999 赞一个!
随风 + 5
amtath + 5

查看全部评分

16 个回复

倒序浏览
lovert
银牌会员   /  发表于:2021-7-12 20:12:46
来自 9#
回复 使用道具 举报
aatest
高级会员   /  发表于:2021-7-2 19:45:36
沙发
感觉有点难···
回复 使用道具 举报
lovert
银牌会员   /  发表于:2021-7-2 20:55:52
板凳
aatest 发表于 2021-7-2 19:45
感觉有点难···

是有点难度,我也是不断调试的,结合官方的帮助文档
回复 使用道具 举报
lovert
银牌会员   /  发表于:2021-7-2 22:11:16
地板
大家在var checkedData = tree.getChecked('demoId');后再加上下面的语句,当没有选择的时候,清空zhi
if(checkedData.length==0){
Forguncy.Page.getCell("zhi").setValue("");}
回复 使用道具 举报
储钱罐儿
初级会员   /  发表于:2021-7-2 23:15:46
5#
相当厉害啊,这一串串代码
回复 使用道具 举报
孤狼悬赏达人认证 活字格认证
高级会员   /  发表于:2021-7-4 19:22:35
6#
好厉害!
回复 使用道具 举报
jony_zhou
注册会员   /  发表于:2021-7-9 14:50:49
7#
能否用layUI实现多列的树型表格?
回复 使用道具 举报
lovert
银牌会员   /  发表于:2021-7-9 15:07:38
8#
jony_zhou 发表于 2021-7-9 14:50
能否用layUI实现多列的树型表格?

给个图,我给你找找,或者你在https://www.layui.com/demo找找对应的
回复 使用道具 举报
hcy984
中级会员   /  发表于:2021-7-15 15:26:51
10#
多级的BOM做个DEMO啊
回复 使用道具 举报
12下一页
您需要登录后才可以回帖 登录 | 立即注册
返回顶部