视图树修改样式,增加图表以下为参考代码

楼主
我是社区第678579位番薯,欢迎点我头像关注我哦~

        $(document).ready(function(){

             //通过each遍历.fr-tree-node-inline span元素下面的文本

            $(".fr-tree-node-inline span").each(function(index, item){

                

                // var arr = $(this).text().trim().split("@");

//将文本通过-截取出来放在arr里面

                var arr = item.innerText.trim().split("@");

                var content = '';

               //取arr数组里面坐标为1的内容放在org_type里面

                var orgType = arr[1];

var arr = item.innerText.trim().split("@");

                var content = '';

//取arr数组里面坐标为1的内容放在state里面

var state = arr[2];

                var orgType = arr[1];

 

                if(orgType === '法人'&& state==='已使用') {

                    item.innerHTML = '<span style="display:inline-block; height:22px; line-height:22px; margin:2px 4px 2px 0; padding: 0 8px; border: 1px solid #e8eaec; border-radius: 3px; background: #39a5f6; font-size: 12px; vertical-align: middle; opacity: 1; overflow: hidden; ">'+orgType+'</span>' + arr[0];

                } else if(orgType === '非法人'&&state==='已使用') {

                    item.innerHTML = '<span style="display:inline-block; height:22px; line-height:22px; margin:2px 4px 2px 0; padding: 0 8px; border: 1px solid #e8eaec; border-radius: 3px; background: #90cdf3; font-size: 12px; vertical-align: middle; opacity: 1; overflow: hidden; ">'+orgType+'</span>' + arr[0];

                } else if(orgType === '部门'&&state==='已使用') {

                    item.innerHTML = '<span style="display:inline-block; height:22px; line-height:22px; margin:2px 4px 2px 0; padding: 0 8px; border: 1px solid #e8eaec; border-radius: 3px; background: #f6d460; font-size: 12px; vertical-align: middle; opacity: 1; overflow: hidden; ">'+orgType+'</span>' + arr[0];

                }else if(orgType === '人资虚拟单位'&&state==='已使用') {

                    item.innerHTML = '<span style="display:inline-block; height:22px; line-height:22px; margin:2px 4px 2px 0; padding: 0 8px; border: 1px solid #e8eaec; border-radius: 3px; background: #f98f8c; font-size: 12px; vertical-align: middle; opacity: 1; overflow: hidden; ">'+orgType+'</span>' + arr[0];

                }else if(orgType === '人资虚拟部门'&&state==='已使用') {

                    item.innerHTML = '<span style="display:inline-block; height:22px; line-height:22px; margin:2px 4px 2px 0; padding: 0 8px; border: 1px solid #e8eaec; border-radius: 3px; background: #7cd6cf; font-size: 12px; vertical-align: middle; opacity: 1; overflow: hidden; ">'+orgType+'</span>' + arr[0];

                }else if(orgType === '财务虚拟单位'&&state==='已使用') {

                    item.innerHTML = '<span style="display:inline-block; height:22px; line-height:22px; margin:2px 4px 2px 0; padding: 0 8px; border: 1px solid #e8eaec; border-radius: 3px; background: #e085ff; font-size: 12px; vertical-align: middle; opacity: 1; overflow: hidden; ">'+orgType+'</span>' + arr[0];

                }else if(orgType === '财务虚拟部门'&&state==='已使用') {

                    item.innerHTML = '<span style="display:inline-block; height:22px; line-height:22px; margin:2px 4px 2px 0; padding: 0 8px; border: 1px solid #e8eaec; border-radius: 3px; background: #f05495; font-size: 12px; vertical-align: middle; opacity: 1; overflow: hidden; ">'+orgType+'</span>' + arr[0];

                }else if(orgType === '部门'&&state==='未使用') {

                    item.innerHTML = '<span style="display:inline-block; height:22px; line-height:22px; margin:2px 4px 2px 0; padding: 0 8px; border: 1px solid #e8eaec; border-radius: 3px; background: #f6d460; font-size: 12px; vertical-align: middle; opacity: 1; overflow: hidden; ">'+orgType+'</span>' + 

                       // '<span style="display:inline-block; height:22px; line-height:22px; margin:2px 4px 2px 0; padding: 0 8px; border: 1px solid #e8eaec; border-radius: 3px; background: #E6F7FF; font-size: 12px; vertical-align: middle; opacity: 1; overflow: hidden; ">未使用</span>' + 

                        '<span style="text-decoration: underline;  ">' + arr[0] + '</span>';

                }else if(orgType === '非法人'&&state==='未使用') {

                    item.innerHTML = '<span style="display:inline-block; height:22px; line-height:22px; margin:2px 4px 2px 0; padding: 0 8px; border: 1px solid #e8eaec; border-radius: 3px; background: #90cdf3; font-size: 12px; vertical-align: middle; opacity: 1; overflow: hidden; ">'+orgType+'</span>' + 

                        //'<span style="display:inline-block; height:22px; line-height:22px; margin:2px 4px 2px 0; padding: 0 8px; border: 1px solid #e8eaec; border-radius: 3px; background: #E6F7FF; font-size: 12px; vertical-align: middle; opacity: 1; overflow: hidden; ">未使用</span>' + 

                        '<span style="text-decoration: underline;  ">' + arr[0] + '</span>';

                }else if(orgType === '人资虚拟单位'&&state==='未使用') {

                    item.innerHTML = '<span style="display:inline-block; height:22px; line-height:22px; margin:2px 4px 2px 0; padding: 0 8px; border: 1px solid #e8eaec; border-radius: 3px; background: #f98f8c; font-size: 12px; vertical-align: middle; opacity: 1; overflow: hidden; ">'+orgType+'</span>' + 

                        //'<span style="display:inline-block; height:22px; line-height:22px; margin:2px 4px 2px 0; padding: 0 8px; border: 1px solid #e8eaec; border-radius: 3px; background: #E6F7FF; font-size: 12px; vertical-align: middle; opacity: 1; overflow: hidden; ">未使用</span>' + 

                        '<span style="text-decoration: underline;  ">' + arr[0] + '</span>';

                }else if(orgType === '法人'&&state==='未使用') {

                    item.innerHTML = '<span style="display:inline-block; height:22px; line-height:22px; margin:2px 4px 2px 0; padding: 0 8px; border: 1px solid #e8eaec; border-radius: 3px; background: #39a5f6; font-size: 12px; vertical-align: middle; opacity: 1; overflow: hidden; ">'+orgType+'</span>' + 

                       // '<span style="display:inline-block; height:22px; line-height:22px; margin:2px 4px 2px 0; padding: 0 8px; border: 1px solid #e8eaec; border-radius: 3px; background: #E6F7FF; font-size: 12px; vertical-align: middle; opacity: 1; overflow: hidden; ">未使用</span>' + 

                        '<span style="text-decoration: underline;  ">' + arr[0] + '</span>';

                }else if(orgType === '人资虚拟部门'&&state==='未使用') {

                    item.innerHTML = '<span style="display:inline-block; height:22px; line-height:22px; margin:2px 4px 2px 0; padding: 0 8px; border: 1px solid #e8eaec; border-radius: 3px; background: #7cd6cf; font-size: 12px; vertical-align: middle; opacity: 1; overflow: hidden; ">'+orgType+'</span>' + 

                        //'<span style="display:inline-block; height:22px; line-height:22px; margin:2px 4px 2px 0; padding: 0 8px; border: 1px solid #e8eaec; border-radius: 3px; background: #E6F7FF; font-size: 12px; vertical-align: middle; opacity: 1; overflow: hidden; ">未使用</span>' + 

                        '<span style="text-decoration: underline;  ">' + arr[0] + '</span>';

                }else if(orgType === '财务虚拟单位'&&state==='未使用') {

                    item.innerHTML = '<span style="display:inline-block; height:22px; line-height:22px; margin:2px 4px 2px 0; padding: 0 8px; border: 1px solid #e8eaec; border-radius: 3px; background: #e085ff; font-size: 12px; vertical-align: middle; opacity: 1; overflow: hidden; ">'+orgType+'</span>' + 

                       // '<span style="display:inline-block; height:22px; line-height:22px; margin:2px 4px 2px 0; padding: 0 8px; border: 1px solid #e8eaec; border-radius: 3px; background: #E6F7FF; font-size: 12px; vertical-align: middle; opacity: 1; overflow: hidden; ">未使用</span>' + 

                        '<span style="text-decoration: underline; ">' + arr[0] + '</span>';

                }else if(orgType === '财务虚拟部门'&&state==='未使用') {

                    item.innerHTML = '<span style="display:inline-block; height:22px; line-height:22px; margin:2px 4px 2px 0; padding: 0 8px; border: 1px solid #e8eaec; border-radius: 3px; background: #f05495; font-size: 12px; vertical-align: middle; opacity: 1; overflow: hidden; ">'+orgType+'</span>' + 

                        //'<span style="display:inline-block; height:22px; line-height:22px; margin:2px 4px 2px 0; padding: 0 8px; border: 1px solid #e8eaec; border-radius: 3px; background: #E6F7FF; font-size: 12px; vertical-align: middle; opacity: 1; overflow: hidden; ">未使用</span>' + 

                        '<span style="text-decoration: underline; ">' + arr[0] + '</span>';

                }else if(orgType === '项目部'&&state==='未使用') {

                    item.innerHTML = '<span style="display:inline-block; height:22px; line-height:22px; margin:2px 4px 2px 0; padding: 0 8px; border: 1px solid #e8eaec; border-radius: 3px; background: #7cd6cf; font-size: 12px; vertical-align: middle; opacity: 1; overflow: hidden; ">'+orgType+'</span>' + 

                        //'<span style="display:inline-block; height:22px; line-height:22px; margin:2px 4px 2px 0; padding: 0 8px; border: 1px solid #e8eaec; border-radius: 3px; background: #E6F7FF; font-size: 12px; vertical-align: middle; opacity: 1; overflow: hidden; ">未使用</span>' + 

                        '<span style="text-decoration: underline; ">' + arr[0] + '</span>';

                }else if(orgType === '项目部'&&state==='已使用') {

                    item.innerHTML = '<span style="display:inline-block; height:22px; line-height:22px; margin:2px 4px 2px 0; padding: 0 8px; border: 1px solid #e8eaec; border-radius: 3px; background: #7cd6cf; font-size: 12px; vertical-align: middle; opacity: 1; overflow: hidden; ">'+orgType+'</span>' + arr[0];

                }else if(orgType === '运维部'&&state==='未使用') {

                    item.innerHTML = '<span style="display:inline-block; height:22px; line-height:22px; margin:2px 4px 2px 0; padding: 0 8px; border: 1px solid #e8eaec; border-radius: 3px; background: #d64040; font-size: 12px; vertical-align: middle; opacity: 1; overflow: hidden; ">'+orgType+'</span>' + 

                        //'<span style="display:inline-block; height:22px; line-height:22px; margin:2px 4px 2px 0; padding: 0 8px; border: 1px solid #e8eaec; border-radius: 3px; background: #E6F7FF; font-size: 12px; vertical-align: middle; opacity: 1; overflow: hidden; ">未使用</span>' + 

                        '<span style="text-decoration: underline; ">' + arr[0] + '</span>';

                }else if(orgType === '运维部'&&state==='已使用') {

                    item.innerHTML = '<span style="display:inline-block; height:22px; line-height:22px; margin:2px 4px 2px 0; padding: 0 8px; border: 1px solid #e8eaec; border-radius: 3px; background: #d64040; font-size: 12px; vertical-align: middle; opacity: 1; overflow: hidden; ">'+orgType+'</span>' + arr[0];

                }

                

 

            });

            

        });

分享扩散:

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

返回顶部 返回列表