From d5842dafbf7046803ccde8062c5c364d00867b11 Mon Sep 17 00:00:00 2001 From: luosongbai <15272473386@163.com> Date: Thu, 21 Oct 2021 18:51:52 +0800 Subject: [PATCH] 1 --- web/pages/3rmodel.html | 449 +++++++ web/pages/analysis.html | 10 +- web/pages/dashboard.html | 3 +- web/pages/event.html | 4 +- web/pages/globalfilter.html | 4 +- web/pages/modeltable.html | 12 +- web/pages/returnvisitevent.html | 2 + web/pages/userlabel.html | 97 ++ web/pages/userlabel_dy.html | 221 ++++ web/pages/userpar.html | 2 +- web/src/mmGrid.js | 1373 ++++++++++++++++++++ web/src/mmPaginator.js | 231 ++++ web/src/x.min.js | 1549 ++++++++++++++++++++++- web/srczip/common.js | 20 +- web/srczip/logic/3rmodel.js | 1153 +++++++++++++++++ web/srczip/logic/analysis.js | 20 +- web/srczip/logic/dashboard.js | 2 + web/srczip/logic/distribution.js | 4 + web/srczip/logic/ltvmodel.js | 4 + web/srczip/logic/modeltable.js | 17 +- web/srczip/logic/retained.js | 16 +- web/srczip/logic/userlabel.js | 68 + web/srczip/logic/userlabel_dy.js | 240 ++++ web/static/css/analysis.css | 3 + web/static/css/mmGrid.css | 353 ++++++ web/static/css/style.css | 101 ++ web/static/img/iconfont/demo_index.html | 167 ++- web/static/img/iconfont/iconfont.css | 34 +- web/static/img/iconfont/iconfont.js | 2 +- web/static/img/iconfont/iconfont.json | 49 + web/static/img/iconfont/iconfont.ttf | Bin 3156 -> 4704 bytes web/static/img/iconfont/iconfont.woff | Bin 2156 -> 3136 bytes web/static/img/iconfont/iconfont.woff2 | Bin 1640 -> 2544 bytes 33 files changed, 6158 insertions(+), 52 deletions(-) create mode 100644 web/pages/3rmodel.html create mode 100644 web/pages/userlabel.html create mode 100644 web/pages/userlabel_dy.html create mode 100644 web/src/mmGrid.js create mode 100644 web/src/mmPaginator.js create mode 100644 web/srczip/logic/3rmodel.js create mode 100644 web/srczip/logic/userlabel.js create mode 100644 web/srczip/logic/userlabel_dy.js create mode 100644 web/static/css/mmGrid.css diff --git a/web/pages/3rmodel.html b/web/pages/3rmodel.html new file mode 100644 index 0000000..6cce211 --- /dev/null +++ b/web/pages/3rmodel.html @@ -0,0 +1,449 @@ + +
+ +
+ +
+
+
+ 3R模型 +
当前时区
+
+
+
+ 近似计算 +
+
+ +
+
+
+
+ +
+
+ +
+
+ +
+
+ +
+ +
+ + 返回 +
+ +
+
+ +
+ +
+ +
+ +
+ +
+
3R
+
+
+
小r小于
+
+ +
+
+ +
+
中r小于
+
+ +
+
+ +
+
+ + +
+
分析指标
+
+
+ +
+ + +
+
+ + 添加指标 +
+ +
+
+
+ +
+
全局筛选
+ +
+ +
+ +
+
+
且
+
+ +
+ + + + + + +
+ +
+ +
+ + + 添加条件 + +
+
+ +
+ +
+
+
分组项
+ +
+ +
+ +
+ + + +
+ +
+ + + 添加分组项 + +
+
+
+ +
+ +
+
保存报表
+
计 算
+
+ + +
+ +
+
+
+
+ +
+
+
+
+
按天
+
+ +
+
指标
+
分组
+
+
+
+ +
+ +
+
+ +
+ +
+ +
+ + + + + + + + + +
+
+
+ + + +
+
+
+ +
+ + + + + + + + + + + + + + diff --git a/web/pages/analysis.html b/web/pages/analysis.html index 0128aae..c8d2589 100644 --- a/web/pages/analysis.html +++ b/web/pages/analysis.html @@ -277,7 +277,11 @@
{{items.columnDesc}}
{{items.comparator_name}}
-
+ {{# if(items.tableType != "user_label"){ }} +
+ +
+ {{# } }}
@@ -404,10 +408,12 @@
{{item.comparator_name}}
{{# if(item.comparator_id != "is null" && item.comparator_id != "is not null" && item.comparator_id !="not null" && item.comparator_id != "range"){ }} - {{# if(item.data_type != "datetime"){ }} + {{# if(item.data_type != "datetime" && item.data_type != "user_label"){ }}
+ {{# } else if(item.data_type == "user_label"){ }} + {{# } else { }}
{{item.ftv}} diff --git a/web/pages/dashboard.html b/web/pages/dashboard.html index aa26bb5..7cc3843 100644 --- a/web/pages/dashboard.html +++ b/web/pages/dashboard.html @@ -30,6 +30,7 @@
事件分析
留存分析
LTV模型
+
漏斗分析
分布分析
路径分析
@@ -41,7 +42,7 @@
属性分析
用户分群
-
用户标签
+
用户标签
  • diff --git a/web/pages/event.html b/web/pages/event.html index e808f0a..1a5c60e 100644 --- a/web/pages/event.html +++ b/web/pages/event.html @@ -32,8 +32,8 @@
    {{items.columnDesc}}
    {{items.comparatorName}}
    - {{# if(items.comparator != "is null" && items.comparator != "is not null" && items.comparator !="not null" && items.comparator != "range"){ }} -
    + {{# if(items.comparator != "is null" && items.comparator != "is not null" && items.comparator !="not null" && items.comparator != "range" && items.data_type != "user_label"){ }} +
    {{# } }} diff --git a/web/pages/globalfilter.html b/web/pages/globalfilter.html index b4ce2c6..191cdae 100644 --- a/web/pages/globalfilter.html +++ b/web/pages/globalfilter.html @@ -5,10 +5,12 @@
    {{item.columnDesc}}
    {{item.comparator_name}}
    {{# if(item.comparator != "is null" && item.comparator != "is not null" && item.comparator !="not null" && item.comparator != "range"){ }} - {{# if(item.data_type != "datetime"){ }} + {{# if(item.data_type != "datetime" && item.data_type != "user_label"){ }}
    + {{# } else if(item.data_type == "user_label"){ }} + {{# } else { }}
    {{item.ftv}} diff --git a/web/pages/modeltable.html b/web/pages/modeltable.html index e5eab0c..3887c23 100644 --- a/web/pages/modeltable.html +++ b/web/pages/modeltable.html @@ -13,17 +13,17 @@
    {{# if(d.wowtype != ''){ }} - {{# if(d.wowtype == '-'){ }} -
    较环比
    {{d.wow}}%
    + {{# if(d.wowtype == '+'){ }} +
    较环比
    {{d.wow}}%
    {{# } else { }} -
    较环比
    {{d.wow}}%
    +
    较环比
    {{d.wow}}%
    {{# } }} {{# } }} {{# if(d.chain_ratiotype != ''){ }} {{# if(d.chain_ratiotype == "+"){ }} -
    较同比
    {{d.chain_ratio}}%
    +
    较同比
    {{d.chain_ratio}}%
    {{# } else { }} -
    较同比
    {{d.chain_ratio}}%
    +
    较同比
    {{d.chain_ratio}}%
    {{# } }} {{# } }}
    @@ -107,7 +107,7 @@ {{# } }}
    {{# if(d.wowtype != ''){ }} - {{# if(d.wowtype == '-'){ }} + {{# if(d.wowtype == '+'){ }}
    较环比
    {{d.wow}}%
    {{# } else { }}
    较环比
    {{d.wow}}%
    diff --git a/web/pages/returnvisitevent.html b/web/pages/returnvisitevent.html index 546298e..20f3e35 100644 --- a/web/pages/returnvisitevent.html +++ b/web/pages/returnvisitevent.html @@ -30,7 +30,9 @@
    {{items.columnDesc}}
    {{items.comparatorName}}
    + {{# if(items.comparator != "is null" && items.comparator != "is not null" && items.comparator !="not null" && items.comparator != "range" && items.data_type != "user_label"){ }}
    + {{# } }}
    {{# }); }} diff --git a/web/pages/userlabel.html b/web/pages/userlabel.html new file mode 100644 index 0000000..4fa97b8 --- /dev/null +++ b/web/pages/userlabel.html @@ -0,0 +1,97 @@ +
    +
    +
    +
    用户标签
    + +
    +
    + + + +
    + +
    + + 新建标签 +
    + +
    + +
    + +
    +
    +
    + +
    + +
    + +
    +
    + \ No newline at end of file diff --git a/web/pages/userlabel_dy.html b/web/pages/userlabel_dy.html new file mode 100644 index 0000000..641e753 --- /dev/null +++ b/web/pages/userlabel_dy.html @@ -0,0 +1,221 @@ +
    +
    +

    用户标签 / 编辑用户标签

    +
    + +
    +
    +
    +
    + 标签信息 +
    +
    +

    标签名

    + +
    +
    +

    显示名

    + +
    +
    +

    备注（选填）

    + +
    +
    +
    +
    +
    +
    自定义条件配置
    +

    筛选特定行为条件或用户属性的用户，并赋予标签值；用户优先匹配至满足条件且顺序靠前的标签值中

    +
    + + + + +
    +
    标签值定义 添加标签值条件
    +
    + +
    + + + +
    +
    +
    +
    保存
    +
    + +
    + +
    + +
    + +
    + + + diff --git a/web/pages/userpar.html b/web/pages/userpar.html index 71b729c..90bcfc8 100644 --- a/web/pages/userpar.html +++ b/web/pages/userpar.html @@ -35,7 +35,7 @@
    {{items.columnDesc}}
    {{items.comparator_name}}
    - {{# if(items.comparator != "is null" && items.comparator != "is not null" && items.comparator !="not null" && items.comparator != "range"){ }} + {{# if(items.comparator != "is null" && items.comparator != "is not null" && items.comparator !="not null" && items.comparator != "range" && items.data_type != "user_label"){ }}
    {{# } }}
    diff --git a/web/src/mmGrid.js b/web/src/mmGrid.js new file mode 100644 index 0000000..a7432db --- /dev/null +++ b/web/src/mmGrid.js @@ -0,0 +1,1373 @@ +/** + * Author: meimeidev + */ + +!function($){ + var MMGrid = function (element, options) { + this._id = (((1 + Math.random()) * 0x10000) | 0).toString(16); + this._loadCount = 0; + this.opts = options; + this._initLayout($(element)); + this._initHead(); + this._initOptions(); + this._initEvents(); + this._setColsWidth(); + if(this.opts.fullWidthRows){ + this._fullWidthRows(); + } + + //初始化插件 + for(var i=0; i< this.opts.plugins.length; i++){ + var plugin = this.opts.plugins[i]; + plugin.init($.extend(element, this)); + } + + if(options.autoLoad){ + var that = this; + this.opts = options; + setTimeout(function(){ + + if(options.url){ + that.load(); + }else{ + that.load(options.items); + } + },0); //chrome style problem + } + + }; + + //see: http://tanalin.com/en/articles/ie-version-js/ + var browser = function(){ + var isIE=!!window.ActiveXObject; + var isIE10 = isIE && !!window.atob; + var isIE9 = isIE && document.addEventListener && !window.atob; + var isIE8 = isIE && document.querySelector && !document.addEventListener; + var isIE7 = isIE && window.XMLHttpRequest && !document.querySelector; + var isIE6 = isIE && !window.XMLHttpRequest; + + return { + isIE: isIE + , isIE6: isIE6 + , isIE7: isIE7 + , isIE8: isIE8 + , isIE9: isIE9 + , isIE10: isIE10 + }; + }(); + + MMGrid.prototype = { + + _initLayout: function($el){ + var opts = this.opts; + var $elParent = $el.parent(); + var elIndex = $el.index(); + + var mmGrid = [ + '
    ', + '', + '
    ', + '
    ', + '
    ', + '
    ', + '
    ', + '
    ', + '', + '
    ', + '
    ', + '', + '
    '+ this.opts.noDataText +'
    ', + '
    ', + '
    ', + '
    ', + '
    '+ this.opts.loadingText +'
    ', + '
    ', + + '
    ' + ]; + //fix in IE7,IE6 + if(browser.isIE7 || browser.isIE6){ + $el.prop('cellspacing',0); + } + + + //cached object + var $mmGrid = $(mmGrid.join('')); + this.$mmGrid = $mmGrid; + this.$style = $mmGrid.find('style'); + this.$headWrapper = $mmGrid.find('.mmg-headWrapper'); + this.$head = $mmGrid.find('.mmg-head'); + this.$backboard = $mmGrid.find('.mmg-backboard'); + this.$bodyWrapper = $mmGrid.find('.mmg-bodyWrapper'); + this.$body = $el.removeAttr("style").addClass('mmg-body'); + this._insertEmptyRow(); + this.$body.appendTo(this.$bodyWrapper); + + + + //放回原位置 + if(elIndex === 0 || $elParent.children().length == 0){ + $elParent.prepend(this.$mmGrid); + }else{ + $elParent.children().eq(elIndex-1).after(this.$mmGrid); + } + + + // fix in ie6 + if(browser.isIE6 && (!opts.width || opts.width === 'auto')){ + $mmGrid.width('100%'); + $mmGrid.width($mmGrid.width() - ($mmGrid.outerWidth(true) - $mmGrid.width())); + }else{ + $mmGrid.width(opts.width); + } + + if(browser.isIE6 && (!opts.height || opts.height === 'auto')){ + $mmGrid.height('100%'); + $mmGrid.height($mmGrid.height() - ($mmGrid.outerHeight(true) - $mmGrid.height())); + }else{ + $mmGrid.height(opts.height); + } + + if(opts.checkCol){ + var chkHtml = opts.multiSelect ? '' + : ''; + opts.cols.unshift({title:chkHtml,width: 20, align: 'center' ,lockWidth: true, checkCol: true, renderer:function(){ + return ''; + }}); + } + + if(opts.indexCol){ + opts.cols.unshift({title:'#',width: opts.indexColWidth, align: 'center' ,lockWidth: true, indexCol:true, renderer:function(val,item,rowIndex){ + return ''; + }}); + } + + } + + ,_expandCols: function(cols){ + var newCols = []; + if(!cols){ + return newCols; + } + for(var colIndex=0; colIndex'); + titleHtml.push('
    '); + titleHtml.push(''); + if(col.titleHtml){ + titleHtml.push(col.titleHtml); + }else{ + titleHtml.push(col.title); + } + titleHtml.push('
    '); + if(!col.lockWidth) titleHtml.push('
    '); + titleHtml.push('
    '); + }else{ + var displayColsLength = col.cols.length; + $.each(col.cols, function(index, item){ + if(item.hidden){ + displayColsLength--; + } + }); + if(displayColsLength === 0){ + col.hidden = true; + } + titleHtml.push(''); + titleHtml.push('
    '); + titleHtml.push(''); + if(col.titleHtml){ + titleHtml.push(col.titleHtml); + }else{ + titleHtml.push(col.title); + } + titleHtml.push('
    '); + titleHtml.push('
    '); + } + + return titleHtml.join(""); + } + + , _initHead: function(){ + var that = this; + var opts = this.opts; + var $head = this.$head; + + if(opts.cols){ + var theadHtmls = ['']; + + //获取标题深度 + var titleDeep = that._titleDeep(opts.cols); + for(var deep=1; deep<= titleDeep; deep++){ + var cols = that._colsWithTitleDeep(opts.cols, deep); + theadHtmls.push(''); + for(var colIndex=0; colIndex< cols.length; colIndex++){ + var col = cols[colIndex]; + theadHtmls.push(this._titleHtml(col, titleDeep-deep+1)); + } + theadHtmls.push(''); + } + theadHtmls.push(''); + $head.html(theadHtmls.join('')); + } + + var $ths = this._expandThs(); + var expandCols = this._expandCols(opts.cols); + $.each($ths,function(index){ + if(!expandCols[index].width){ + expandCols[index].width = 100; + } + $.data(this,'col-width',expandCols[index].width); + $.data(this,'col',expandCols[index]); + }); + + var $mmGrid = this.$mmGrid; + var $headWrapper = this.$headWrapper; + var $bodyWrapper = this.$bodyWrapper; + if(opts.height !== 'auto'){ + $bodyWrapper.height($mmGrid.height() - $headWrapper.outerHeight(true)); + } + + + + //初始化排序状态 + if(opts.sortName){ + for(var colIndex=0; colIndex< expandCols.length; colIndex++){ + var col = expandCols[colIndex]; + if(col.sortName === opts.sortName || col.name === opts.sortName){ + var $th= $ths.eq(colIndex); + $.data($th.find('.mmg-title')[0],'sortStatus',opts.sortStatus); + $th.find('.mmg-sort').addClass('mmg-'+opts.sortStatus); + } + } + } + } + + , _initOptions: function(){ + var opts = this.opts; + var $mmGrid = this.$mmGrid; + var $headWrapper = this.$headWrapper; + var $backboard = this.$backboard; + $mmGrid.find('a.mmg-btnBackboardDn').css({ + 'top': $headWrapper.outerHeight(true) + }).slideUp('fast'); + + var cols = this._leafCols(); + if(cols){ + var bbHtml = ['

    显示列

    ']; + for(var colIndex=0; colIndex'); + if(col.title){ + bbHtml.push(col.title); + }else{ + bbHtml.push('未命名'); + } + + bbHtml.push(''); + } + $backboard.append($(bbHtml.join(''))); + } + } + + , _initEvents: function(){ + var that = this; + var opts = this.opts; + var $mmGrid = this.$mmGrid; + var $headWrapper = this.$headWrapper; + var $head = this.$head; + var $bodyWrapper = this.$bodyWrapper; + var $body = this.$body; + var $backboard = this.$backboard; + var $ths = this._expandThs(); + var expandCols = this._expandCols(opts.cols); + var leafCols = this._leafCols(); + + //调整浏览器 + if(opts.width === 'auto' || opts.height === 'auto' || (typeof opts.width === 'string' && opts.width.indexOf('%') === opts.width.length-1) || + typeof opts.height === 'string' && opts.height.indexOf('%') === opts.height.length-1){ + $(window).on('resize', function(){ + that.resize(); + }); + } + + //滚动条事件 + $bodyWrapper.on('scroll', function(){ + $head.css('left',- $(this).scrollLeft()); + }); + + //向下按钮 + var $btnBackboardDn = $mmGrid.find('a.mmg-btnBackboardDn').on('click', function(){ + var backboardHeight = $mmGrid.height() - $headWrapper.outerHeight(true); + if(opts.height === 'auto'&& opts.backboardMinHeight !== 'auto' && backboardHeight < opts.backboardMinHeight){ + backboardHeight = opts.backboardMinHeight; + } + $backboard.height(backboardHeight); + if(opts.height === 'auto'){ + $mmGrid.height($headWrapper.outerHeight(true) + $backboard.outerHeight(true)); + } + $backboard.slideDown(); + $btnBackboardDn.slideUp('fast'); + + that._hideMessage(); + }); + $body.on('mouseenter', function(){ + $btnBackboardDn.slideUp('fast'); + }); + $mmGrid.on('mouseleave', function(){ + $btnBackboardDn.slideUp('fast'); + }); + $headWrapper.on('mouseenter',function(){ + if($backboard.is(':hidden') && opts.showBackboard){ + $btnBackboardDn.slideDown('fast'); + } + }); + //向上按钮 + $mmGrid.find('a.mmg-btnBackboardUp').on('click', function(){ + $backboard.slideUp().queue(function(next){ + if(!that.rowsLength() || (that.rowsLength() === 1 && $body.find('tr.emptyRow').length === 1)){ + that._showNoData(); + } + if(opts.height === 'auto'){ + $mmGrid.height('auto'); + } + next(); + }); + }); + + //隐藏列 + $backboard.on('click', ':checkbox', function(){ + var index = $backboard.find('label').index($(this).parent()); + //最后一个不隐藏 + var last = 1; + if(opts.checkCol){ + last = last + 1; + } + if(opts.indexCol){ + last = last + 1; + } + if($backboard.find('label :checked').length < last){ + this.checked = true; + return; + } + + var col = leafCols[index]; + if(this.checked){ + col.hidden = false; + + }else{ + col.hidden = true; + } + + var $ths = $head.find('th'); + for(var colIndex=$ths.length-1; colIndex>=0; colIndex--){ + var $th = $ths.eq(colIndex); + var iCol = $th.data('col'); + if(iCol.cols){ + var hidden = true; + var colspan = 0; + $.each(iCol.cols,function(index,item){ + if(!item.hidden){ + hidden = false; + colspan++; + } + }); + //IE bug + if(colspan !== 0){ + $th.prop('colspan',colspan); + } + iCol.hidden = hidden; + } + } + + that._setColsWidth(); + $backboard.height($mmGrid.height() - $headWrapper.outerHeight(true)); + if(opts.height !== 'auto'){ + $bodyWrapper.height($mmGrid.height() - $headWrapper.outerHeight(true)); + } + $mmGrid.find('a.mmg-btnBackboardDn').css({ + 'top': $headWrapper.outerHeight(true) + }) + }); + + + + //排序事件 + $head.on('click', '.mmg-title', function(){ + var $this = $(this); + var $titles = $ths.find('.mmg-title'); + + //当前列不允许排序 + var col =$this.parent().parent().data('col'); + if(!col.sortable){ + return; + } + //取得当前列下一个排序状态 + var sortStatus = $.data(this, 'sortStatus') === 'asc' ? 'desc' : 'asc'; + //清除排序状态 + $.each($titles, function(){ + $.removeData(this,'sortStatus'); + }); + $ths.find('.mmg-sort').removeClass('mmg-asc').removeClass('mmg-desc'); + //设置当前列排序状态 + $.data(this, 'sortStatus', sortStatus); + $this.siblings('.mmg-sort').addClass('mmg-'+sortStatus); + + if(opts.url && opts.remoteSort){ + that.load() + }else{ + that._nativeSorter($.inArray(col, leafCols), sortStatus); + that._setStyle(); + } + }).on('mousedown', '.mmg-colResize', function(e){ + //调整列宽 + var $resize = $(this); + var start = e.pageX; + var $colResizePointer = $mmGrid.find('.mmg-colResizePointer') + .css('left', e.pageX - $headWrapper.offset().left).show(); + + var scrollLeft = $head.position().left; + var $colResizePointerBefore = $mmGrid.find('.mmg-colResizePointer-before') + .css('left', $resize.parent().parent().position().left + scrollLeft).show(); + //取消文字选择 + document.selection && document.selection.empty && ( document.selection.empty(), 1) + || window.getSelection && window.getSelection().removeAllRanges(); + document.body.onselectstart = function () { + return false; + }; + $headWrapper.css('-moz-user-select','none'); + + $mmGrid.on('mousemove', function(e){ + $colResizePointer.css('left', e.pageX - $headWrapper.offset().left); + }).on('mouseup', function(e){ + //改变宽度 + var $th = $resize.parent().parent(); + var width = $th.width() + e.pageX - start; + $.data($th[0], 'col-width', width); + that._setColsWidth(); + $headWrapper.mouseleave(); + }).on('mouseleave',function(){ + $mmGrid.off('mouseup').off('mouseleave').off('mousemove'); + $colResizePointer.hide(); + $colResizePointerBefore.hide(); + document.body.onselectstart = function(){ + return true;//开启文字选择 + }; + $headWrapper.css('-moz-user-select','text'); + }); + }); + + //选中事件 + var $body = this.$body; + $body.on('click','td',function(e){ + var $this = $(this); + var event = jQuery.Event("cellSelected"); + event.target = e.target; + that.$body.triggerHandler(event, [$.data($this.parent()[0], 'item'), $this.parent().index(), $this.index()]); + + if(event.isPropagationStopped()){ + return; + } + if(!$this.parent().hasClass('selected')){ + that.select($this.parent().index()); + }else{ + that.deselect($this.parent().index()); + } + }); + + $body.on('click','tr > td .mmg-check',function(e){ + e.stopPropagation(); + var $this = $(this); + if(this.checked){ + that.select($($this.parents('tr')[0]).index()); + }else{ + that.deselect($($this.parents('tr')[0]).index()); + } + }); + + //checkbox列 + if(opts.checkCol){ + $head.find('th .checkAll').on('click', function(){ + if(this.checked){ + that.select('all'); + }else{ + that.deselect('all'); + } + }); + } + + //IE6不支持hover + if (browser.isIE6){ + $body.on('mouseenter','tr', function () { + $(this).toggleClass('hover'); + }).on('mouseleave','tr', function () { + $(this).toggleClass('hover'); + }); + }; + + + } + + , _rowHtml: function(item, rowIndex){ + var opts = this.opts; + var expandCols = this._expandCols(opts.cols); + var leafCols = this._leafCols(); + + + if($.isPlainObject(item)){ + var trHtml = []; + trHtml.push(''); + for(var colIndex=0; colIndex < leafCols.length; colIndex++){ + var col = leafCols[colIndex]; + trHtml.push(''); + if(col.renderer){ + trHtml.push(col.renderer(item[col.name],item,rowIndex)); + }else{ + trHtml.push(item[col.name]); + } + + trHtml.push(''); + }; + trHtml.push(''); + return trHtml.join(''); + } + } + + , _populate: function(items){ + var opts = this.opts; + var $body = this.$body; + + this._hideMessage(); + if(items && items.length !== 0 && opts.cols){ + + var tbodyHtmls = []; + tbodyHtmls.push(''); + for(var rowIndex=0; rowIndex < items.length; rowIndex++){ + var item = items[rowIndex]; + tbodyHtmls.push(this._rowHtml(item, rowIndex)); + } + tbodyHtmls.push(''); + $body.empty().html(tbodyHtmls.join('')); + var $trs = $body.find('tr'); + for(var rowIndex=0; rowIndex < items.length; rowIndex++){ + $.data($trs.eq(rowIndex)[0],'item',items[rowIndex]); + } + }else{ + this._insertEmptyRow(); + this._showNoData(); + } + this._setStyle(); + + if(opts.fullWidthRows && this._loadCount <= 1){ + this._fullWidthRows(); + } + } + + , _insertEmptyRow: function(){ + var $body = this.$body; + $body.empty().html(' '); + } + , _removeEmptyRow: function(){ + var $body = this.$body; + $body.find('tr.emptyRow').remove(); + } + + /* 生成列类 */ + , _genColClass: function(colIndex){ + return 'mmg'+ this._id +'-col'+colIndex; + } + + , _setStyle: function(){ + var $head = this.$head; + var $ths = this._expandThs(); + var $body = this.$body; + var leafCol = this._leafCols(); + + //head + $ths.eq(0).addClass('first'); + $ths.eq(-1).addClass('last'); + //body + $body.find('tr,td').removeClass('even') + .removeClass('colSelected').removeClass('colSelectedEven'); + + $body.find('tr:odd').addClass('even'); + + + + var sortIndex = $.inArray($head.find('.mmg-title').filter(function(){ + return $.data(this,'sortStatus') === 'asc' || $(this).data('sortStatus') === 'desc'; + }).parent().parent().data('col'), leafCol); + + $body.find('tr > td:nth-child('+(sortIndex+1)+')').addClass('colSelected') + .filter(':odd').addClass('colSelectedEven'); + + this._resizeHeight(); + + } + , _setColsWidth: function(){ + var opts = this.opts; + var $style = this.$style; + var $head = this.$head; + + var $bodyWrapper = this.$bodyWrapper; + var $body = this.$body; + var $ths = this._expandThs(); + var expandCols = this._expandCols(opts.cols); + + var scrollTop = $bodyWrapper.scrollTop(); + var scrollLeft = $head.position().left; + + $bodyWrapper.width(9999); + $body.width('auto'); + var styleText = []; + for(var colIndex=0; colIndex<$ths.length; colIndex++){ + var $th = $ths.eq(colIndex); + styleText.push('.mmGrid .'+this._genColClass(colIndex) + ' {'); + var width = $.data($th[0],'col-width'); + styleText.push('width: '+ width +'px;'); + styleText.push('max-width: '+ width +'px;'); + + var col = expandCols[colIndex]; + if(col.align){ + styleText.push('text-align: '+col.align+';'); + } + if(col.hidden){ + styleText.push('display: none; '); + } + styleText.push(' }'); + } + + $body.detach(); + try{ + $style.text(styleText.join('')); + }catch(error){ + $style[0].styleSheet.cssText = styleText.join('');//IE fix + } + $body.width($head.width()); + $bodyWrapper.width('100%'); + $bodyWrapper.append($body); + + //调整滚动条 + + $bodyWrapper.scrollLeft(-scrollLeft); + if($bodyWrapper.scrollLeft() === 0){ + $head.css('left', 0); + } + + $bodyWrapper.scrollTop(scrollTop); + } + , _fullWidthRows: function(){ + var opts = this.opts; + var $bodyWrapper = this.$bodyWrapper; + var $mmGrid = this.$mmGrid; + var $head = this.$head; + var scrollWidth = $bodyWrapper.width() - $bodyWrapper[0].clientWidth; + + if(scrollWidth && browser.isIE){ + scrollWidth = scrollWidth + 1; + } + + var fitWidth = $mmGrid.width() - $head.width() - scrollWidth; + if(fitWidth < -20){ + return; + } + + var thsArr = []; + var $ths = this._leafThs(); + var leafCol = this._leafCols(); + for(var i=0; i< leafCol.length; i++){ + var col = leafCol[i]; + var $th = $ths.eq(i); + if(!col.lockWidth && $th.is(':visible')){ + thsArr.push($th); + } + } + + var increaseWidth = Math.floor(fitWidth / thsArr.length); + var maxColWidthIndex = 0; + for(var i=0; i< thsArr.length; i++){ + var $th = thsArr[i]; + var colWidth = $.data($th[0], 'col-width') + increaseWidth; + $.data($th[0], 'col-width', colWidth); + + var maxColWidth = $.data(thsArr[maxColWidthIndex][0], 'col-width'); + if(maxColWidth < colWidth){ + maxColWidthIndex = i; + } + } + + var remainWidth = fitWidth - increaseWidth * thsArr.length; + var maxColWidth = $.data(thsArr[maxColWidthIndex][0], 'col-width'); + $.data(thsArr[maxColWidthIndex][0], 'col-width', maxColWidth + remainWidth); + this._setColsWidth(); + } + + + , _showLoading: function(){ + var $mmGrid = this.$mmGrid; + $mmGrid.find('.mmg-mask').show(); + + var $loading = $mmGrid.find('.mmg-loading'); + $loading.css({ + 'left': ($mmGrid.width() - $loading.width()) / 2, + 'top': ($mmGrid.height() - $loading.height()) / 2 + }).show(); + } + , _hideLoading: function(){ + var $mmGrid = this.$mmGrid; + $mmGrid.find('.mmg-mask').hide(); + $mmGrid.find('.mmg-loading').hide(); + } + , _showNoData: function(){ + this._showMessage(this.opts.noDataText); + } + + , _showLoadError: function(){ + this._showMessage(this.opts.loadErrorText); + } + + , _showMessage: function(msg){ + var $mmGrid = this.$mmGrid; + var $headWrapper = this.$headWrapper; + var $message = $mmGrid.find('.mmg-message'); + $message.css({ + 'left': ($mmGrid.width() - $message.width()) / 2, + 'top': ($mmGrid.height() + $headWrapper.height() - $message.height()) / 2 + }).text(msg).show(); + } + , _hideMessage: function(){ + var $mmGrid = this.$mmGrid; + $mmGrid.find('.mmg-message').hide(); + } + + , _nativeSorter: function(colIndex, sortStatus){ + var leafCols = this._leafCols(); + var col = leafCols[colIndex]; + + this.$body.find('tr > td:nth-child('+(colIndex+1)+')') + .sortElements(function(a, b){ + var av = $.text($(a)); + var bv = $.text($(b)); + //排序前转换 + if(col.type === 'number'){ + av = parseFloat(av); + bv = parseFloat(bv); + }else{ + //各个浏览器localeCompare的结果不一致 + return sortStatus === 'desc' ? -av.localeCompare(bv) : av.localeCompare(bv); + } + return av > bv ? (sortStatus === 'desc' ? -1 : 1) : (sortStatus === 'desc' ? 1 : -1); + }, function(){ + return this.parentNode; + }); + } + + , _refreshSortStatus: function(){ + var $ths = this.$head.find('th'); + var sortColIndex = -1; + var sortStatus = ''; + $ths.find('.mmg-title').each(function(index, item){ + var status = $.data(item, 'sortStatus'); + if(status){ + sortColIndex = index; + sortStatus = status; + } + }); + var sortStatus = sortStatus === 'desc' ? 'asc' : 'desc'; + if(sortColIndex >=0){ + $ths.eq(sortColIndex).find('.mmg-title').data('sortStatus',sortStatus).click(); + } + } + + , _loadAjax: function(args){ + var that = this; + var opts = this.opts; + var params = {}; + //opt的params可以使函数，例如收集过滤的参数 + if($.isFunction(opts.params)){ + var p = opts.params(); + if(!p){ + return; + } + params = $.extend(params, p); + }else if($.isPlainObject(opts.params)){ + params = $.extend(params, opts.params); + } + + if(opts.remoteSort){ + var sortName = ''; + var sortStatus = ''; + var $titles = this.$head.find('.mmg-title'); + for(var colIndex=0; colIndex<$titles.length; colIndex++){ + var status = $.data($titles[colIndex], 'sortStatus'); + if(status){ + var col = $titles.eq(colIndex).parent().parent().data('col'); + sortName = col.sortName ? + col.sortName : col.name; + sortStatus = status; + } + } + if(sortName){ + params.sort = sortName+'.'+sortStatus; + } + } + + + //插件参数合并 + var pluginParams = {}; + for(var i=0; i< this.opts.plugins.length; i++){ + var plugin = this.opts.plugins[i]; + $.extend(pluginParams, plugin.params()); + } + params = $.extend(params, pluginParams); + + //合并load的参数 + params = $.extend(params, args); + + that._showLoading(); + $.ajax({ + type: opts.method, + url: opts.url, + data: params, + dataType: 'json', + cache: opts.cache + }).done(function(data){ + try{ + //获得root对象 + var items = data; + if($.isArray(data[opts.root])){ + items = data[opts.root]; + } + that._populate(items); + that._hideLoading(); + if(!opts.remoteSort){ + that._refreshSortStatus(); + } + + if(data && $.isArray(data[opts.root])){ + data = $.extend(args, data); + } + that.$body.triggerHandler('loadSuccess', data); + + + }catch(e){ + that._hideLoading(); + that._showLoadError(); + throw e; + } + + }).fail(function(data){ + that._hideLoading(); + that._showLoadError(); + that.$body.triggerHandler('loadError', data); + }); + + } + + , _loadNative: function(args){ + this._populate(args); + this._refreshSortStatus(); + this.$body.triggerHandler('loadSuccess', args); + } + , load: function(args){ + try{ + var opts = this.opts; + this._hideMessage(); + this._loadCount = this._loadCount + 1 ; + + if($.isArray(args)){ + //加载本地数据 + this._loadNative(args); + }else if(opts.url){ + this._loadAjax(args); + }else if(opts.items){ + this._loadNative(opts.items); + }else{ + this._loadNative([]); + } + }catch(e){ + this._showLoadError(); + throw e; + } + } + + //重设尺寸 + , resize: function(){ + var opts = this.opts; + var $mmGrid = this.$mmGrid; + var $headWrapper = this.$headWrapper; + var $bodyWrapper = this.$bodyWrapper; + + // fix in ie6 + if(browser.isIE6 && (!opts.width || opts.width === 'auto')){ + $mmGrid.width('100%'); + $mmGrid.width($mmGrid.width() - ($mmGrid.outerWidth(true) - $mmGrid.width())); + }else{ + $mmGrid.width(opts.width); + } + + if(opts.height !== 'auto'){ + if(browser.isIE6 && (!opts.height || opts.height === 'auto')){ + $mmGrid.height('100%'); + $mmGrid.height($mmGrid.height() - ($mmGrid.outerHeight(true) - $mmGrid.height())); + }else{ + $mmGrid.height(opts.height); + } + + $bodyWrapper.height($mmGrid.height() - $headWrapper.outerHeight(true)); + } + + //调整message + var $message = $mmGrid.find('.mmg-message'); + if($message.is(':visible')){ + $message.css({ + 'left': ($mmGrid.width() - $message.width()) / 2, + 'top': ($mmGrid.height() + $headWrapper.height() - $message.height()) / 2 + }); + } + //调整loading + var $mask = $mmGrid.find('.mmg-mask'); + if($mask.is(':visible')){ + $mask.width($mmGrid.width()).height($mmGrid.height()); + var $loadingWrapper = $mmGrid.find('.mmg-loading'); + $loadingWrapper.css({ + 'left': ($mmGrid.width() - $loadingWrapper.width()) / 2, + 'top': ($mmGrid.height() - $loadingWrapper.height()) / 2 + }) + } + + $bodyWrapper.trigger('scroll'); + + this._resizeHeight(); + } + + , _resizeHeight: function(){ + var opts = this.opts; + var $bodyWrapper = this.$bodyWrapper; + var $body= this.$body; + if(opts.height === 'auto' && browser.isIE7){ + $bodyWrapper.height('auto'); + if($bodyWrapper.width() < $body.width()){ + $bodyWrapper.height($bodyWrapper.height() + $bodyWrapper.height() - $bodyWrapper[0].clientHeight + 1); + } + } + } + + //选中 + , select: function(args){ + var opts = this.opts; + var $body = this.$body; + var $head = this.$head; + + if(typeof args === 'number'){ + var $tr = $body.find('tr').eq(args); + if(!opts.multiSelect){ + $body.find('tr.selected').removeClass('selected'); + if(opts.checkCol){ + $body.find('tr > td').find('.mmg-check').prop('checked',''); + } + } + if(!$tr.hasClass('selected')){ + $tr.addClass('selected'); + if(opts.checkCol){ + $tr.find('td .mmg-check').prop('checked','checked'); + } + } + }else if(typeof args === 'function'){ + $.each($body.find('tr'), function(index){ + if(args($.data(this, 'item'), index)){ + var $this = $(this); + if(!$this.hasClass('selected')){ + $this.addClass('selected'); + if(opts.checkCol){ + $this.find('td .mmg-check').prop('checked','checked'); + } + } + } + }); + }else if(args === undefined || (typeof args === 'string' && args === 'all')){ + $body.find('tr.selected').removeClass('selected'); + $body.find('tr').addClass('selected'); + $body.find('tr > td').find('.mmg-check').prop('checked','checked'); + }else{ + return; + } + + if(opts.checkCol){ + var $checks = $body.find('tr > td').find('.mmg-check'); + if($checks.length === $checks.filter(':checked').length){ + $head.find('th .checkAll').prop('checked','checked'); + } + } + + + } + //取消选中 + , deselect: function(args){ + var opts = this.opts; + var $body = this.$body; + var $head = this.$head; + if(typeof args === 'number'){ + $body.find('tr').eq(args).removeClass('selected'); + if(opts.checkCol){ + $body.find('tr').eq(args).find('td .mmg-check').prop('checked',''); + } + }else if(typeof args === 'function'){ + $.each($body.find('tr'), function(index){ + if(args($.data(this, 'item'), index)){ + $(this).removeClass('selected'); + if(opts.checkCol){ + $(this).find('td .mmg-check').prop('checked',''); + } + } + }); + }else if(args === undefined || (typeof args === 'string' && args === 'all')){ + $body.find('tr.selected').removeClass('selected'); + if(opts.checkCol){ + $body.find('tr > td').find('.mmg-check').prop('checked',''); + } + }else{ + return; + } + + $head.find('th .checkAll').prop('checked',''); + + } + , selectedRows: function(){ + var $body = this.$body; + var selected = []; + $.each($body.find('tr.selected'), function(index ,item){ + selected.push($.data(this,'item')); + }); + return selected; + } + + , selectedRowsIndex: function(){ + var $body = this.$body; + var $trs = this.$body.find('tr') + var selected = []; + $.each($body.find('tr.selected'), function(index){ + selected.push($trs.index(this)); + }); + return selected; + } + + , rows: function(){ + var $body = this.$body; + var items = []; + $.each($body.find('tr'), function(){ + items.push($.data(this,'item')); + }); + return items; + } + + , row: function(index){ + var $body = this.$body; + if(index !== undefined && index >= 0){ + var $tr = $body.find('tr').eq(index); + if($tr.length !== 0){ + return $.data($tr[0],'item'); + } + } + } + + , rowsLength: function(){ + var $body = this.$body; + var length = $body.find('tr').length; + if(length === 1 && $body.find('tr.emptyRow').length === 1){ + return 0; + } + return length; + } + + //添加数据，第一个参数可以为数组 + , addRow: function(item, index){ + var $tbody = this.$body.find('tbody'); + + if($.isArray(item)){ + for(var i=item.length-1; i >= 0; i--){ + this.addRow(item[i], index); + } + return ; + } + + if(!$.isPlainObject(item)){ + return ; + } + + this._hideMessage(); + this._removeEmptyRow(); + + var $tr; + + if(index === undefined || index < 0){ + $tr = $(this._rowHtml(item, this.rowsLength())); + $tbody.append($tr); + }else{ + $tr = $(this._rowHtml(item, index)); + if(index === 0){ + $tbody.prepend($tr); + }else{ + var $before = $tbody.find('tr').eq(index-1); + //找不到就插到最后 + if($before.length === 0){ + $tbody.append($tr); + }else{ + $before.after($($tr)); + } + } + } + $tr.data('item', item); + this._setStyle(); + + + this.$body.triggerHandler('rowInserted', [item, index]); + } + //更新行内容，两个参数都必填 + , updateRow: function(item, index){ + var opts = this.opts; + var $tbody = this.$body.find('tbody'); + if(!$.isPlainObject(item)){ + return ; + } + var oldItem = this.row(index); + + var $tr = $tbody.find('tr').eq(index); + var checked = $tr.find('td:first :checkbox').is(':checked'); + $tr.html(this._rowHtml(item, index).slice(4,-5)); + if(opts.checkCol){ + $tr.find('td:first :checkbox').prop('checked',checked); + } + + $tr.data('item', item); + this._setStyle(); + + this.$body.triggerHandler('rowUpdated', [oldItem, item, index]); + } + + //删除行，参数可以为索引数组 + , removeRow: function(index){ + var that = this; + var $tbody = that.$body.find('tbody'); + + if($.isArray(index)){ + for(var i=index.length-1; i >= 0; i--){ + that.removeRow(index[i]); + } + return ; + } + + if(index === undefined){ + var $trs = $tbody.find('tr'); + for(var i=$trs.length-1; i >= 0; i--){ + that.removeRow(i); + } + }else{ + var item = that.row(index); + $tbody.find('tr').eq(index).remove(); + this.$body.triggerHandler('rowRemoved', [item, index]); + } + this._setStyle(); + if(this.rowsLength() === 0){ + this._showNoData(); + this._insertEmptyRow(); + } + } + }; + + $.fn.mmGrid = function(){ + if(arguments.length === 0 || typeof arguments[0] === 'object'){ + var option = arguments[0] + , data = this.data('mmGrid') + , options = $.extend(true, {}, $.fn.mmGrid.defaults, option); + if (!data) { + data = new MMGrid(this, options); + this.data('mmGrid', data); + } + return $.extend(true, this, data); + } + if(typeof arguments[0] === 'string'){ + var data = this.data('mmGrid'); + var fn = data[arguments[0]]; + if(fn){ + var args = Array.prototype.slice.call(arguments); + return fn.apply(data,args.slice(1)); + } + } + }; + + $.fn.mmGrid.defaults = { + width: 'auto' + , height: '280px' + , cols: [] + , url: false + , params: {} + , method: 'POST' + , cache: false + , root: 'items' + , items: [] + , autoLoad: true + , remoteSort: false + , sortName: '' + , sortStatus: 'asc' + , loadingText: '正在载入...' + , noDataText: '没有数据' + , loadErrorText: '数据加载出现异常' + , multiSelect: false + , checkCol: false + , indexCol: false + , indexColWidth: 30 + , fullWidthRows: false + , nowrap: false + , showBackboard: true + , backboardMinHeight: 125 + , plugins: [] //插件 插件必须实现 init($mmGrid)和params()方法，参考mmPaginator + }; +// event : loadSuccess(e,data), loadError(e, data), cellSelected(e, item, rowIndex, colIndex) +// rowInserted(e,item, rowIndex), rowUpdated(e, oldItem, newItem, rowIndex), rowRemoved(e,item, rowIndex) +// + + + $.fn.mmGrid.Constructor = MMGrid; + + + // see: http://james.padolsey.com/javascript/sorting-elements-with-jquery/ + $.fn.sortElements = (function(){ + var sort = [].sort; + return function(comparator, getSortable) { + getSortable = getSortable || function(){return this;}; + var placements = this.map(function(){ + var sortElement = getSortable.call(this), + parentNode = sortElement.parentNode, + nextSibling = parentNode.insertBefore( + document.createTextNode(''), + sortElement.nextSibling + ); + return function() { + if (parentNode === this) { + throw new Error( + "You can't sort elements if any one is a descendant of another." + ); + } + parentNode.insertBefore(this, nextSibling); + parentNode.removeChild(nextSibling); + }; + }); + return sort.call(this, comparator).each(function(i){ + placements[i].call(getSortable.call(this)); + }); + }; + })(); +}(window.jQuery); diff --git a/web/src/mmPaginator.js b/web/src/mmPaginator.js new file mode 100644 index 0000000..7760579 --- /dev/null +++ b/web/src/mmPaginator.js @@ -0,0 +1,231 @@ +!function($){ + var MMPaginator = function(element, options){ + this.$el = $(element); + this.opts = options; + }; + + MMPaginator.prototype = { + _initLayout: function(){ + var that = this; + var $el = this.$el; + var opts = this.opts; + + $el.addClass("mmPaginator"); + var pgHtmls = [ + '
    ', + '
      ', + '
      ' + ]; + $el.append($(pgHtmls.join(''))); + + this.$totalCountLabel = $el.find('.totalCountLabel'); + this.$pageList = $el.find('.pageList'); + this.$limitList = $el.find('.limit select'); + + var $limitList = this.$limitList + $.each(opts.limitList, function(){ + var $option = $('') + .prop('value',this) + .text(that.formatString(opts.limitLabel,[this])); + $limitList.append($option); + }); + + $limitList.on('change', function(){ + $el.data('page', 1); + that.$mmGrid.load(); + }); + + } + + , _plain: function(page, totalCount, limit){ + var that = this; + var $el = this.$el; + var $pageList = this.$pageList; + + var totalPage = totalCount % limit === 0 ? parseInt(totalCount/limit) : parseInt(totalCount/limit) + 1; + totalPage = totalPage ? totalPage : 0; + if(totalPage === 0){ + page = 1; + }else if(page > totalPage){ + page = totalPage; + }else if(page < 1 && totalPage != 0){ + page = 1; + } + // + var $prev = $('
      • '); + if(page<=1){ + $prev.addClass('disable'); + }else{ + $prev.find('a').on('click', function(){ + $el.data('page', page-1); + that.$mmGrid.load(); + }); + } + $pageList.append($prev); + ///// + var list = [1]; + if(page > 4 ){ + list.push('...'); + } + for(var i= 0; i < 5; i++){ + var no = page - 2 + i; + if(no > 1 && no <= totalPage-1){ + list.push(no); + } + } + if(page+1 < totalPage-1){ + list.push('...'); + } + if(totalPage>1){ + list.push(totalPage); + } + $.each(list, function(index, item){ + var $li = $('
      • '); + if(item === '...'){ + $li.addClass('').html('...'); + }else if(item === page){ + $li.addClass('active').find('a').text(item); + }else{ + $li.find('a').text(item).prop('title','第'+item+'页').on('click', function(e){ + $el.data('page', item); + that.$mmGrid.load(); + }); + } + $pageList.append($li); + }); + // + var $next = $(''); + if(page>=totalPage){ + $next.addClass('disable'); + }else{ + $next.find('a').on('click', function(){ + $el.data('page', page+1); + that.$mmGrid.load(); + }); + } + $pageList.append($next); + } + + , _search: function(page, totalCount, limit){ + + } + + , load: function(params){ + var $el = this.$el; + var $limitList = this.$limitList; + var opts = this.opts; + + if(!params){ + params = {}; + } + + var page = params[opts.pageParamName]; + if(page === undefined || page === null){ + page = $el.data('page'); + } + $el.data('page', page); + + var totalCount = params[opts.totalCountName]; + if(totalCount === undefined){ + totalCount = 0; + } + $el.data('totalCount', totalCount); + + var limit = params[opts.limitParamName]; + if(!limit){ + limit = $limitList.val(); + } + this.$limitList.val(limit); + + this.$totalCountLabel.html(this.formatString(opts.totalCountLabel,[totalCount])); + this.$pageList.empty(); + + this._plain(page, totalCount, this.$limitList.val()); + } + + , formatString: function(text, args){ + return text.replace(/{(\d+)}/g, function(match, number) { + return typeof args[number] != 'undefined' + ? args[number] + : match + ; + }); + } + + , params: function(){ + var opts = this.opts; + var $el = this.$el; + var $limitList = this.$limitList; + + var params = {}; + params[opts.pageParamName] = $el.data('page'); + params[opts.limitParamName] = $limitList.val(); + return params; + } + + , init: function($grid){ + var that = this; + var opts = that.opts; + this.$mmGrid = $grid; + this._initLayout(); + this.$mmGrid.on('loadSuccess', function(e, data){ + that.load(data); + }); + + var params = {}; + params[opts.totalCountName] = 0; + params[opts.pageParamName] = opts.page; + params[opts.limitParamName] = opts.limit; + this.load(params); + + if($grid.opts.indexCol){ + var indexCol = $grid.opts.cols[0]; + indexCol.renderer = function(val,item,rowIndex){ + var params = that.params(); + return ''; + }; + } + + } + + }; + + $.fn.mmPaginator = function(){ + + if(arguments.length === 0 || typeof arguments[0] === 'object'){ + var option = arguments[0] + , data = this.data('mmPaginator') + , options = $.extend(true, {}, $.fn.mmPaginator.defaults, option); + if (!data) { + data = new MMPaginator(this[0], options); + this.data('mmPaginator', data); + } + return $.extend(true, this, data); + } + if(typeof arguments[0] === 'string'){ + var data = this.data('mmPaginator'); + var fn = data[arguments[0]]; + if(fn){ + var args = Array.prototype.slice.call(arguments); + return fn.apply(data,args.slice(1)); + } + } + }; + + $.fn.mmPaginator.defaults = { + style: 'plain' + , totalCountName: 'totalCount' + , page: 1 + , pageParamName: 'page' + , limitParamName: 'limit' + , limitLabel: '每页{0}条' + , totalCountLabel: '共{0}条记录' + , limit: undefined + , limitList: [20, 30, 40, 50] + }; + + $.fn.mmPaginator.Constructor = MMPaginator; + +}(window.jQuery); \ No newline at end of file diff --git a/web/src/x.min.js b/web/src/x.min.js index bb7df42..baefa27 100644 --- a/web/src/x.min.js +++ b/web/src/x.min.js @@ -57,7 +57,14 @@ var X = window.X || { {'title':'有值','id':'4','default':false}, {'title':'无值','id':'5','default':false}, {'title':'区间','id':'6','default':false} - ] + ], + condition2:[ + {'title':'等于','id':'==','default':false}, + {'title':'不等于','id':'!=','default':false}, + {'title':'小于','id':'<','default':true}, + {'title':'大于','id':'>','default':false}, + {'title':'区间','id':'range','default':false} + ], }, //日期控件参数 'locale': { @@ -339,7 +346,7 @@ var X = window.X || { }; //渲染表格有分页有操作 - X.laytabledata = function(id,url,data,arr,height){ + X.laytabledata = function(id,url,data,arr,height,callback){ var loginCache = X.loginCache(); var token = (loginCache? loginCache.token:""); token = "Bearer "+token; @@ -361,6 +368,9 @@ var X = window.X || { ,cellMinWidth: 80 //全局定义常规单元格的最小宽度，layui 2.2.1 新增 ,cols: data ,height: height + ,done: function (res, curr, count) { + callback && callback(res, curr, count); + } }); }; @@ -559,14 +569,14 @@ var X = window.X || { 'locale': X.DATA.locale, ranges: { '今日': [moment(), moment()], - '昨日': [moment().subtract(1, 'days'), moment().subtract(1, 'days')], + '昨日': [moment, moment().subtract(1, 'days')], '最近7日': [moment().subtract(7, 'days'), moment().subtract(0, 'days')], '最近30日': [moment().subtract(30, 'days'), moment().subtract(0, 'days')], '上周': [moment().subtract(1, 'week').startOf('week')+86400000, moment().subtract(1, 'week').endOf('week')+86400000], '本周': [moment().startOf('week')+86400000, moment()+86400000], '本月': [moment().startOf('month'), moment()], - '上月': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month') - ] + '上月': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month')], + '全部时间': [moment().subtract( parseInt((new Date).getTime()/86400000) , 'days'), moment()] }, "alwaysShowCalendars": true, "startDate": moment().subtract(7, 'days'), @@ -1435,6 +1445,1161 @@ var X = window.X || { } }; })(); +// srczip/logic/3rmodel.js +(function(){ + X.pageLogic['3rmodel'] = { + init : function(){ + var me = this; + // 渲染form样式 + layui.form.render(); + + var dataArr; //分析指标 + var groupeddata;//分组项 + var type2data; + //var filtersymbols=[];//筛选符号 + // filtersymbols.push(drr); + var defaultgroupdata; //默认添加分组项里的事件 + var filter_map,quotas_map; + var data = { + "events":[], + "eventView":{ + "cksql":"event", + "startTime":"", + "timeParticleSize":"P1D", + "endTime":"", + "graphShape":"L0", + "e_days":0, + "s_days":7, + "groupBy":[], + "uiCommonConfig":{ + "tableSorts":[], + "chartSort":"num-desc" + }, + "filts":[],//全局筛选 + "relation":'and', + "zone_time":'8',//时区 + 'min_r': 1, + 'middle_r':1 + } + } + + var retdata,props; + + // 日期渲染 + X.daterender("#analtsis-condition-date",function(start, end, label){ + var startTime = start.format('YYYY-MM-DD')+ " "+ "00:00:00"; + var endTime = end.format('YYYY-MM-DD')+ " "+ "23:59:59"; + data['eventView']['startTime'] = startTime; + data['eventView']['endTime'] = endTime; + var sameday = Date.parse(new Date()) / 1000; //当天时间戳 + + var enddate = new Date(end.format('YYYY-MM-DD')); + var endmonth = Date.parse(enddate)/1000; + + var startdate = new Date(start.format('YYYY-MM-DD')); + var startmonth = Date.parse(startdate)/1000; + data['eventView']['e_days'] = parseInt((sameday - endmonth)/86400); + data['eventView']['s_days'] = parseInt((sameday - startmonth)/86400); + console.log(parseInt((sameday - endmonth)/86400)); + console.log(parseInt((sameday - startmonth)/86400)); + // calculationdata(); + }) + + var time = $("#analtsis-condition-date").val(); + var timearr = time.split(" "); + data['eventView']['startTime'] = timearr[0] + " "+"00:00:00"; + data['eventView']['endTime'] = timearr[2]+" "+"23:59:59"; + + // X.template("toptab","analysis-zhanwei",X.DATA['projectarr'],function(){ + X.api("data_auth/my_event","get",{},function(d){ + + dataArr = d; + X.api("data_auth/load_prop_quotas","post",{event_name:dataArr[0]['category'][0]['event_name']},function(d){ + retdata = d.staid_quots.concat(d.props); + props = d.props; + var defaultindicator = { + "event_desc":dataArr[0]['category'][0]['event_desc'], + "event_name":dataArr[0]['category'][0]['event_name'], + "event_attr":"总次数", + "event_attr_id":"*", + "event_attr_type":"", + "analysisname":'', + "analysis":'total_count', + "filts":[],//过滤项 + "relation":'and', + "customEvent":'', + "eventNameDisplay":'',//重命名指标 + "format":'float', + "formatname":'两位小数' + } + data.events.push(defaultindicator); + X.laytpldata("#analysis-con-left-screen-list-dot",data.events,".analysis-con-left-screen-list-box"); + type2data= retdata + X.api("data_auth/load_filter_props","post",{event_name:dataArr[0]['category'][0]['event_name']},function(val){ + defaultgroupdata = val; + + X.api("data_auth/filter_map","get",{},function(d){ + filter_map = d; + + X.api('data_auth/quotas_map',"get",{},function(d){ + quotas_map = d; + //从数据看板点击进来触发事件 + if(X.DATA.eventid && X.DATA.eventid != ''){ + var report_idarr = []; + report_idarr.push(X.DATA.eventid); + X.api('report/read_report','post',{project_id:X.DATA.projectid,report_id:report_idarr},function(d){ + backfilldata(d[0]); + }) + } + }) + + }) + + }) + }) + // groupeddata = d.group_by; + }) + // }); + + + // 渲染选择时间下拉框 + layui.dropdown.render({ + elem: ".analysis-navigation-bar-datetime" + ,data: X.DATA.timezone + ,click: function(obj){ + $(".analysis-navigation-bar-datetime").html(obj.title); + data['eventView']['zone_time'] = obj.id; + } + }); + + // 伸缩左侧选项 + $(".analysis-con-left-shrink").click(function(){ + if($(".analysis-con-left").css('left') == "auto" || $(".analysis-con-left").css('left') == "0px"){ + $(".analysis-con-left").css("position","absolute"); + $(".analysis-con-left").css("left","-535px"); + $(".analysis-con-left-shrink").css("transform","rotate(180deg)"); + $(".analysis-con-right").css("width","calc(100% - 15px)"); + $(".analysis-con-right").css("margin-left","16px"); + }else { + $(".analysis-con-left").css("position","relative"); + $(".analysis-con-left").css("left","auto"); + $(".analysis-con-left-shrink").css("transform","rotate(3600deg)"); + $(".analysis-con-right").css("width","calc(100% - 550px)"); + $(".analysis-con-right").css("margin-left","0px"); + } + }); + + //已存报表 + var baobiaodata; + $(document).off('click','.analysis-navigation-bar-right-img-baobiao').on('click','.analysis-navigation-bar-right-img-baobiao',function(){ + X.parametersopen(data['eventView']['cksql'],'savedbaobiao','rt',function(d){ + if(d){ + backfilldata(d) + } + }) + }); + + // 反向填充数据 + function backfilldata(d){ + + data = d.query; + // filtersymbols = data.cachedata.filtersymbols; + var time = $("#analtsis-condition-date").val(); + var timearr = time.split(" "); + data['eventView']['startTime'] = timearr[0] + " "+"00:00:00"; + data['eventView']['endTime'] = timearr[2]+" "+"23:59:59"; + baobiaodata = d; + + if(d.query.eventView.filts.length > 0){ + $(".analysis-overall").show(); + }else { + $(".analysis-overall").hide(); + } + + X.laytpldata("#analysis-con-left-screen-list-dot",d.query.events,".analysis-con-left-screen-list-box"); + X.laytpldata("#analysis-gpmain___3YGfw-dot",d.query.eventView.groupBy,".analysis-gpmain___3YGfw"); + X.laytpldata("#analysis-overall-situation-list-box-dot",d.query['eventView']['filts'],".analysis-overall-situation-list-box",function(){ + renderdate(); + }); + // analysisdown(); + calculationdata(); + } + + // sql语句显示 + $(document).off('click','.sqlquery').on('click','.sqlquery',function(){ + var obj = $(this); + var offset = obj.offset(); + X.querycriteriapop(data,'conditionquery',offset.left - 410,offset.top+obj.height(),function(){ + + }) + }); + + // 切换为指标公式或组合 + $(document).off('click','.analysis-gongshi').on('click','.analysis-gongshi',function(){ + var index = $(this).attr("data-index"); + var type = $(this).attr("data-type"); + data['events'][index]['customType'] = type; + $("#analysis-con-left-screen-list-left-box-"+index).hide(); + $("#analysis-custom-box-"+index).show(); + $(this).hide(); + $("#analysis-con-left-screen-list-right-"+index+" "+".analysis-zhibiao").show(); + }); + + // 切换为指标选择 + $(document).off('click','.analysis-zhibiao').on('click','.analysis-zhibiao',function(){ + var index = $(this).attr("data-index"); + $("#analysis-con-left-screen-list-left-box-"+index).show(); + $("#analysis-custom-box-"+index).hide(); + $(this).hide(); + $("#analysis-con-left-screen-list-right-"+index+" "+".analysis-gongshi").show(); + }); + + //复制指标 + $(document).off('click','.analysis-fuzhi').on('click','.analysis-fuzhi',function(){ + var index = $(this).attr("data-index"); + var arr = data.events[index]; + data.events.push(arr); + X.laytpldata("#analysis-con-left-screen-list-dot",data.events,".analysis-con-left-screen-list-box"); + var num = data.events.length; + + // filtersymbols[num] = filtersymbols[index]; + }); + + //重命名指标 + $(document).off('click','.analysis-chongmingming').on('click','.analysis-chongmingming',function() { + var index = $(this).attr('data-index'); + $("#analysis-con-left-screen-list-left-zhibiaoname-"+index).show(); + $(this).hide(); + $("#analysis-con-left-screen-list-right-"+index+" "+".analysis-chongmingming-del").show(); + }); + + //删除重命名 + $(document).off('click','.analysis-chongmingming-del').on('click','.analysis-chongmingming-del',function() { + var index = $(this).attr("data-index"); + $("#analysis-con-left-screen-list-left-zhibiaoname-"+index).hide(); + $("#analysis-con-left-screen-list-left-zhibiaoname-"+index+" "+"input").val(''); + $(this).hide(); + $("#analysis-con-left-screen-list-right-"+index+" "+".analysis-chongmingming").show(); + }); + + // 设置一级事件 + $(document).off('click','.ant-dropdown-trigger').on('click','.ant-dropdown-trigger',function() { + var obj = $(this); + var offset = obj.offset(); + var index = obj.attr('data-index') + X.querycriteriapop(dataArr,'setgrouping',offset.left,offset.top+obj.height(),function(val){ + var htmlstring = val.id; + obj.html(htmlstring); + data['events'][index]['event_desc'] = val.id; + data['events'][index]['event_name'] = val.name; + + + + }) + }); + //设置一级事件中第二个参数 + $(document).off('click','.analysis-zhibiao-list-type2').on('click','.analysis-zhibiao-list-type2',function(){ + var obj = $(this); + var offset = obj.offset(); + var index = obj.attr("data-index"); + if(type2data.length >0){ + X.parametersopen(type2data,'dropdownlist',[offset.top+obj.height(),offset.left],function(val){ + if(val != undefined){ + $("#analysis-zhibiao-list-type2-"+index).html(val.title); + + data['events'][index]['event_attr'] = val.title; + data['events'][index]['event_attr_id'] = val.id; + data['events'][index]['event_attr_type'] = val.data_type; + + if(val.data_type && val.data_type != null){ + $("#analysis-zhibiao-list-type3-"+index).show(); + $("#analysis-zhibiao-list-type3-"+index).html(quotas_map[val.data_type][0]['title']); + data['events'][index]['analysisname'] = quotas_map[val.data_type][0]['title']; + data['events'][index]['analysis'] = quotas_map[val.data_type][0]['id']; + }else { + $("#analysis-zhibiao-list-type3-"+index).hide(); + data['events'][index]['analysis'] = val.analysis; + } + X.laytpldata("#analysis-con-left-screen-list-dot",data.events,".analysis-con-left-screen-list-box"); + } + }) + } + }); + //设置一级事件中第三个参数 + $(document).off('click','.analysis-zhibiao-condition').on('click','.analysis-zhibiao-condition',function(){ + var obj = $(this); + var offset = obj.offset(); + var index = obj.attr("data-index"); + var type = data['events'][index]['event_attr_type']; + + X.parametersopen(quotas_map[type],'dropdownlist',[offset.top+obj.height(),offset.left],function(val){ + $("#analysis-zhibiao-list-type3-"+index).html(val.title); + data['events'][index]['analysisname'] = val.title; + data['events'][index]['analysis'] = val.id; + }) + }); + + $(document).off('click','.ta-property-select').on('click','.ta-property-select',function(){ + var obj = $(this); + var offset = obj.offset(); + var index = obj.attr("data-index"); + var indexs = obj.attr("data-indexs"); + X.querycriteriapop(defaultgroupdata,'category',offset.left,offset.top+obj.height(),function(val){ + var htmlstring = val.title; + obj.html(htmlstring); + // filtersymbols[index][indexs] = val.category; + data['events'][index]['filts'][indexs]['columnDesc'] = htmlstring; + data['events'][index]['filts'][indexs]['columnName'] = val.id; + data['events'][index]['filts'][indexs]['data_type'] = val.type; + data['events'][index]['filts'][indexs]['tableType'] = val.table_type; + }) + + }); + + $(document).off('click','.analysis-choicetypename').on('click','.analysis-choicetypename',function(){ + var obj = $(this); + var offset = obj.offset(); + var index = $(this).attr("data-index"); + var indexs = $(this).attr("data-indexs"); + var type = data['events'][index]['filts'][indexs]['data_type']; + X.parametersopen(filter_map[type],'dropdownlist',[offset.top+obj.height(),offset.left],function(val){ + if(val != undefined){ + obj.html(val.title); + data['events'][index]['filts'][indexs]['comparator_name'] = val.title; + data['events'][index]['filts'][indexs]['comparator'] = val.id; + } + }) + }); + + // 添加筛选项 + $(document).off('click','.analysis-shaix-jinting').on('click','.analysis-shaix-jinting',function(){ + var obj = $(this); + var index = obj.attr("data-index"); + addscreen(index); + }); + + // 添加筛选项 + function addscreen(index){ + X.api('data_auth/load_filter_props',"post",{event_name:data['events'][index]["event_name"]},function(d){ + + var arr = { + "columnDesc":d[0]['category'][0]['title'],//事件中文显示 + "columnName":d[0]['category'][0]['id'],//事件id + "comparator_name":filter_map[d[0]['category'][0]['data_type']][0]['title'],//选择符号中文显示 + "comparator":filter_map[d[0]['category'][0]['data_type']][0]['id'],//符号id + "data_type":d[0]['category'][0]['data_type'], + "ftv":[],//条件 + "strftv":'',//字符串显示条件 + "tableType": d[0]['id'] + } //筛选数据 + data['events'][index]['filts'].push(arr); + X.laytpldata("#analysis-con-left-screen-list-dot",data.events,".analysis-con-left-screen-list-box"); + }) + }; + + //监听重命名指标 + $(document).off('change','.analysis-con-left-screen-list-left-zhibiaoname input').on('change','.analysis-con-left-screen-list-left-zhibiaoname input',function(){ + var index = $(this).attr("data-index"); + var txt = $(this).val(); + + data['events'][index]['eventNameDisplay'] = txt; + }); + + // 监听文本框 + $(document).off('change','.analysis-zhibiao-list-type4 input').on('change','.analysis-zhibiao-list-type4 input',function(){ + var index = $(this).attr("data-index"); + var indexs = $(this).attr("data-indexs"); + var val = $(this).val(); + var valarr = val.split(","); + console.log(data['events'][index]); + if(data['events'][index]['filts'][indexs]){ + data['events'][index]['filts'][indexs]['ftv']=valarr; + data['events'][index]['filts'][indexs]['strftv']=val; + }else { + + } + + }); + + // 且和或切换 + $(document).off('click','.analysis-con-left-screen-list-right-screen-qh-tit').on("click",".analysis-con-left-screen-list-right-screen-qh-tit",function(){ + var html = $(this).html(); //relation筛选条件的关系 + var index = $(this).attr("data-index"); + if(html == "且"){ + $(this).html('或'); + data['events'][index]['relation'] = 'or' + }else { + $(this).html('且'); + data['events'][index]['relation'] = 'and' + } + }); + + // 添加条件按钮 + $(document).off('click','.analysis-zhibiao-updata').on('click',".analysis-zhibiao-updata",function(){ + // addindex(); + var obj = $(this); + var index = obj.attr("data-index"); + addscreen(index); + }); + + // 删除二级筛选项 + $(document).off('click','.analysis-zhibiao-list-del').on('click','.analysis-zhibiao-list-del',function(){ + // var id = "analysis-zhibiao-list-mar-"+$(this).attr("data-twonum"); + // $("#"+id).remove(); + var index = $(this).attr("data-index"); + var indexs = $(this).attr("data-indexs"); + // filtersymbols[index].splice(indexs,1); + data.events[index]['filts'].splice(indexs,1); + X.laytpldata("#analysis-con-left-screen-list-dot",data.events,".analysis-con-left-screen-list-box"); + }); + + // 添加指标 + function addindex(){ + var defaultindicator = { + "event_desc":dataArr[0]['category'][0]['event_desc'], + "event_name":dataArr[0]['category'][0]['event_name'], + "event_attr":"总次数", + "event_attr_id":"*", + "event_attr_type":"", + "analysisname":'', + "analysis":'total_count', + "filts":[],//过滤项 + "relation":'and', + "customEvent":'', + "eventNameDisplay":'',//重命名指标 + "format":'float', + "formatname":'两位小数' + } + data['events'].push(defaultindicator); + + X.laytpldata("#analysis-con-left-screen-list-dot",data.events,".analysis-con-left-screen-list-box"); + var index = data.events.length - 1; + + $(".analysis-del").show() //显示删除按钮 + var drr = []; + if(data.events.length > 1){ + $(".analysis-overall").show(); + }else { + $(".analysis-overall").hide(); + } + }; + + //添加按钮 + $(document).on('click','.analysis-jia1',function(){ + + addindex(); + + }); + //添加指标按钮 + $(document).on('click','.analysis-bottom-jia1',function(){ + + addindex(); + + }); + + //删除指标 + $(document).off('click','.analysis-del').on('click',".analysis-del",function(){ + if(data['events'].length != 1){ + var index = $(this).attr("data-index"); + data['events'].splice(index,1); + if(data['events'].length == 1){ + $(".analysis-del").hide(); //隐藏删除按钮 + $(".analysis-overall").hide(); + } + X.laytpldata("#analysis-con-left-screen-list-dot",data.events,".analysis-con-left-screen-list-box"); + } + }); + + + $(".analysis-custom-event-box .analysis-custom-event-txt").blur(function(){ + $(this).css("border-bottom","0px"); + }); + + $(document).off('click','.analysis-custom-event-box .analysis-custom-event-txt').on('blur','.analysis-custom-event-box .analysis-custom-event-txt',function(){ + // $(this).css("border-bottom","1px solid #3d90ff"); + var obj = $(this); + var offset = obj.offset(); + var index = obj.attr("data-index"); + console.log(data['events']); + data['events'][index]['customEvent'] = $(this).val(); + }); + + $(document).off('click','.analysis-con-left-screen-list-left-zhibiaoname2 input').on('blur','.analysis-con-left-screen-list-left-zhibiaoname2 input',function(){ + var index = $(this).attr('data-index'); + data['events'][index]['eventNameDisplay'] = $(this).val(); + }); + + $(document).off('click','.ant-select-selector').on('click','.ant-select-selector',function(){ + var obj = $(this); + var offset = obj.offset(); + var index = $(this).attr("data-index"); + var downlist = [ + {title:'两位小数',id:'float'}, + {title:'百分比',id:'percent'}, + {title:'取整',id:'integer'}, + ]; + X.parametersopen(downlist,'dropdownlist',[offset.top+obj.height(),offset.left],function(val){ + if(val != undefined){ + obj.html(val.title); + data['events'][index]['format'] = val.id; + data['events'][index]['formatname'] = val.title; + } + }) + + }); + + //分组项 + var cat = "event"; + $(document).off('click','.analysis-footadd___2D4YB').on('click','.analysis-footadd___2D4YB',function(){ + var index = data['eventView']['groupBy'].length; + for(let i in defaultgroupdata){ + if(defaultgroupdata[i]['category'].length > 0){ + var drr = { + "columnDesc":defaultgroupdata[i]['category'][index]['title'],//事件中文显示 + "columnName":defaultgroupdata[i]['category'][index]['id'],//事件id + 'data_type':defaultgroupdata[i]['category'][index]['data_type'],//类型 + 'tableType': defaultgroupdata[i]['id'], + "ftv":[],//条件 + "section":''//区间 + } + break; + } + } + + data.eventView.groupBy.push(drr); + X.laytpldata("#analysis-gpmain___3YGfw-dot",data.eventView.groupBy,".analysis-gpmain___3YGfw"); + + }); + + $(document).off('click','.analysis-ant-dropdown-trigger').on('click','.analysis-ant-dropdown-trigger',function(){ + var obj = $(this); + var offset = obj.offset(); + var index = obj.attr("data-index"); + X.querycriteriapop(defaultgroupdata,'category',offset.left,offset.top+obj.height(),function(val){ + var htmlstring = val.title; + obj.html(htmlstring); + data.eventView.groupBy[index]['columnDesc'] = val.title; + data.eventView.groupBy[index]['columnName'] = val.id; + data.eventView.groupBy[index]['data_type'] = val.type; + data.eventView.groupBy[index]['tableType'] = val.table_type; + X.laytpldata("#analysis-gpmain___3YGfw-dot",data.eventView.groupBy,".analysis-gpmain___3YGfw"); + }) + }); + + $(document).off('click','.analysis-granularity').on("click",".analysis-granularity",function(){ + var obj = $(this); + var offset = obj.offset(); + var type = obj.attr("data_type"); + var index = obj.attr("data-index"); + var arr; + if(type == 'date'){ + arr = { + data:[ + {'name':"按天",'id':'day','checked':true}, + {'name':"按分钟",'id':'min','checked':false}, + {'name':"按小时",'id':'hour','checked':false}, + {'name':"按周",'id':'week','checked':false}, + {'name':"按月",'id':'month','checked':false} + ], + default: data.eventView.groupBy[index]['ftv'] + + } + }else { + arr ={ + data:[ + {'name':"按元素",'id':'0','checked':true}, + {'name':"按列表整体",'id':'1','checked':false}, + {'name':"按元素集合",'id':'2','checked':false} + ], + default: data.eventView.groupBy[index]['ftv'] + } + } + + X.querycriteriapop(arr,'groupitem',offset.left,offset.top+obj.height(),function(val){ + data.eventView.groupBy[index]['ftv'] = val.id; + }) + }); + + $(document).on("click",".analysis-section",function(){ + var obj = $(this); + var offset = obj.offset(); + var sectionid = obj.attr("data-sectionid"); + + X.open({ + type: 1, + title: false, + closeBtn: 0, + shadeClose: true, + skin: 'yourclass', + url: 'groupeditemspop', + extData : sectionid, + callback : function(val){ + + } + }) + + }); + + $(document).on('click','.analysis-action-right',function(){ + var index = $(this).attr('data-index'); + data.eventView.groupBy.splice(index,1); + X.laytpldata("#analysis-gpmain___3YGfw-dot",data.eventView.groupBy,".analysis-gpmain___3YGfw"); + }); + + $(document).on('click','.analysis-event-splitting',function(){ + + }); + + // 全局筛选 + var filtsftvdata=[]; + $(document).off('click','.analysis-overall-situation-add').on('click','.analysis-overall-situation-add',function(){ + console.log(defaultgroupdata); + var drr={ + "columnDesc":defaultgroupdata[0]['category'][0]['title'],//事件中文显示 columnDesc + "columnName":defaultgroupdata[0]['category'][0]['id'],//事件id + 'data_type':defaultgroupdata[0]['category'][0]['data_type'],//类型 + 'comparator_name':'等于',//默认等于 + "comparator":'==',//符号id + "ftv":[],//条件 + "strftv":'',//显示条件 + "section":[-1,1],//区间 + "tableType":defaultgroupdata[0]['id'] + }; + data['eventView']['filts'].push(drr);//上传全局数据 + filtsftvdata.push(defaultgroupdata[0]['category'][0]['category']) + + $(".analysis-overall-situation-left-box").show(); + + if(data['eventView']['filts'].length > 1){ + $(".analysis-overall-situation-left-guanxi").show(); + }else{ + $(".analysis-overall-situation-left-guanxi").hide(); + } + X.laytpldata("#analysis-overall-situation-list-box-dot",data['eventView']['filts'],".analysis-overall-situation-list-box",function(){ + renderdate(); + }); + // analysisdown(); + }); + + $(document).off('click','.analysis-overall-situation-fuhao').on('click','.analysis-overall-situation-fuhao',function(){ + var obj = $(this); + var offset = obj.offset(); + var index = obj.attr("data-index"); + var type = data['eventView']['filts'][index]['data_type']; + X.parametersopen(filter_map[type],'dropdownlist',[offset.top+obj.height(),offset.left],function(val){ + $(this).html(val.title); + data['eventView']['filts'][index]['comparator_name'] = val.title; + data['eventView']['filts'][index]['comparator'] = val.id; + if(val.id == "range"){ + data['eventView']['filts'][index]['ftv'] = [-1,1]; + } + X.laytpldata("#analysis-overall-situation-list-box-dot",data['eventView']['filts'],".analysis-overall-situation-list-box",function(){ + renderdate(); + }); + }) + }); + + $(document).off('click','.analysis-overall-situation-del').on('click',".analysis-overall-situation-del",function(){ + var index = $(this).attr("data-index"); + data['eventView']['filts'].splice(index,1); + filtsftvdata.splice(index,1); + if(data['eventView']['filts'].length > 1){ + $(".analysis-overall-situation-left-guanxi").show(); + }else{ + $(".analysis-overall-situation-left-guanxi").hide(); + // $(".analysis-overall-situation-left-box").hide(); + } + X.laytpldata("#analysis-overall-situation-list-box-dot",data['eventView']['filts'],".analysis-overall-situation-list-box",function(){ + renderdate(); + }); + // analysisdown(); + }); + + var render_date_index;//且用户符合时间选择框的index + $(document).off('click','.analysis-overall-situation-date').on('click','.analysis-overall-situation-date',function(){ + var index = $(this).attr('data-index'); + render_date_index = index; + // console.log(index); + }); + + // 渲染过滤项时间框 + function renderdate(){ + lay('.analysis-overall-situation-date').each(function(){ + layui.laydate.render({ + elem: this + ,type:"datetime" + ,trigger: 'click' + ,done: function(value, date, endDate){ + data['eventView']['filts'][render_date_index]['strftv'] = value; + var datearr = []; + datearr.push(value) + data['eventView']['filts'][render_date_index]['ftv'] = datearr; + } + }); + }); + }; + + + $(document).off('click','.analysis-overall-situation-left-guanxi').on('click','.analysis-overall-situation-left-guanxi',function(){ + var html = $(this).html(); //relation筛选条件的关系 + if(html == "且"){ + $(this).html('或'); + data['eventView']['relation'] = 'or' + }else { + $(this).html('且'); + data['eventView']['relation'] = 'and' + } + }); + + // 全局属性选择 + $(document).off('click','.analysis-overall-situation-attr').on('click',".analysis-overall-situation-attr",function(){ + var obj = $(this); + var offset = obj.offset(); + var index = obj.attr("data-index"); + X.querycriteriapop(defaultgroupdata,'category',offset.left,offset.top+obj.height(),function(val){ + obj.html(val.title); + data['eventView']['filts'][index]['columnDesc'] = val.title; + data['eventView']['filts'][index]['columnName'] = val.id; + data['eventView']['filts'][index]['data_type'] = val.type; + data['eventView']['filts'][index]['comparator_name'] = '等于'; + data['eventView']['filts'][index]['comparator'] = '=='; + data['eventView']['filts'][index]['tableType'] = val.table_type; + filtsftvdata[index]=val.category; + X.laytpldata("#analysis-overall-situation-list-box-dot",data['eventView']['filts'],".analysis-overall-situation-list-box",function(){ + renderdate(); + }); + // analysisdown(); + }) + }); + + $(document).off('blur','.analysis-overall-situation-input3 input').on('blur','.analysis-overall-situation-input3 input',function(){ + var index = $(this).attr("data-index"); + var text = $(this).val(); + if(index == 0){ + data['eventView']['min_r'] = text; + }else{ + data['eventView']['middle_r'] = text; + } + }); + + $(document).off('blur','.analysis-overall-situation-input input').on('blur','.analysis-overall-situation-input input',function(){ + var index = $(this).attr("data-index"); + var val = $(this).val(); + var valarr = val.split(","); + data['eventView']['filts'][index]['ftv']=valarr; + data['eventView']['filts'][index]['strftv']=val; + }); + + $(document).off('blur','.analysis-overall-situation-input2 input').on('blur','.analysis-overall-situation-input2 input',function(){ + var name = $(this).attr('name'); + var val = $(this).val(); + var index = $(this).attr("data-index"); + + if(name == 'start'){ + data['eventView']['filts'][index]['ftv'][0] = val; + data['eventView']['filts'][index]['section'][0] = val; + }else { + data['eventView']['filts'][index]['ftv'][1] = val; + data['eventView']['filts'][index]['section'][1] = val; + } + }); + + // 时间粒度 + X.laydropdown('.analtsis-timeParticleSize',X['DATA']['screenlist']['event'],function(d){ + $(".analtsis-timeParticleSize").html(d.title); + data['eventView']['timeParticleSize'] = d.id; + calculationdata(); + }); + + X.layuidate('#analysis-overall-situation-time1'); + + // 计算 + $(document).off('click','.analysis-calculation').on('click','.analysis-calculation',function(){ + calculationdata(); + + }); + + var querydata;//查询数据 + $(document).on('click','.analtsis-chart-switch-box .analtsis-chart-switch',function(){ + console.log(querydata); + if(querydata){ + $('.analtsis-chart-switch-box .analtsis-chart-switch').removeClass('select-chart'); + $(this).addClass('select-chart'); + if($(this).attr('title') == '趋势图'){trendchart(querydata)} + else if($(this).attr('title') == '堆积图'){stackingdiagram(querydata);} + else if($(this).attr('title') == '累计图'){} + else if($(this).attr('title') == '分布图'){distributionmap(querydata)} + else if($(this).attr('title') == '饼状分布'){} + }else{ + // layer.msg('请先计算数据,在切换图表'); + } + + }); + + //堆积图 + function stackingdiagram(d){ + var xAxisData=[]; + for(let i in d){ + for(let z in d[i]['groups']){ + var pj = d[i]['event_name']+d[i]['groups'][z]; + xAxisData.push(pj); + } + } + var seriesData=[]; + for(let i in d){ + for(let z in d[i]['values']){ + var arr = { + name: '', + type: 'line', + stack: '总量', + areaStyle: {}, + emphasis: { + focus: 'series' + }, + data: d[i]['values'][z] + } + seriesData.push(arr); + } + } + if(xAxisData.length > 0){ + for(let i in seriesData){ + seriesData[i]['name'] = xAxisData[i]; + } + } + + var myChart = echarts.init(document.getElementById('analysis-echarts')); + var option = { + title: { + text: '' + }, + color: X.DATA.echartscolor, + tooltip: { + trigger: 'axis', + axisPointer: { + type: 'cross', + label: { + backgroundColor: '#6a7985' + } + } + }, + legend: { + type:'scroll', + data: xAxisData + }, + grid: { + left: '2%', + right: '2%', + bottom: '2%', + top: '10%', + containLabel: true + }, + xAxis: [ + { + type: 'category', + boundaryGap: false, + data: d[0]['date_range'] + } + ], + yAxis: [ + { + type: 'value' + } + ], + series: seriesData + }; + myChart.setOption(option,true); + }; + + //趋势图 + function trendchart(d){ + var xAxisData=[]; + for(let i in d){ + for(let z in d[i]['groups']){ + var pj = d[i]['event_name']+d[i]['groups'][z]; + xAxisData.push(pj); + } + } + var seriesData=[]; + for(let i in d){ + for(let z in d[i]['values']){ + var arr = { + name: '', + type: 'line', + data: d[i]['values'][z] + } + seriesData.push(arr); + } + } + if(xAxisData.length > 0){ + for(let i in seriesData){ + seriesData[i]['name'] = xAxisData[i]; + } + } + console.log(xAxisData) + console.log(seriesData) + console.log(d[0]['date_range']); + var myChart = echarts.init(document.getElementById('analysis-echarts')); + var option = { + title: { + text: '' + }, + color: X.DATA.echartscolor, + tooltip: { + trigger: 'axis', + axisPointer: { + type: 'cross', + label: { + backgroundColor: '#6a7985' + } + } + }, + legend: { + type:'scroll', + data: xAxisData + }, + // toolbox: { + // feature: { + // saveAsImage: {} + // } + // }, + grid: { + left: '2%', + right: '2%', + bottom: '2%', + top: '10%', + containLabel: true + }, + xAxis: [ + { + type: 'category', + boundaryGap: false, + data: d[0]['date_range'] + } + ], + yAxis: [ + { + type: 'value' + } + ], + series: seriesData + }; + myChart.setOption(option,true); + }; + + //分布图 + function distributionmap(d){ + var legendData =[]; + var xAxisData=[]; + var seriesData=[]; + if(jQuery.isEmptyObject(d[0]["groups"])){ + for(let i in d){ + xAxisData.push(d[i]['event_name']); + legendData.push(d[i]['event_name']); + var num =0; + for(let j in d[i]['values'][i]){ + num = num + d[i]['values'][i][j] + } + var arr = { + name: d[i]['event_name'], + type: 'bar', + barWidth : 30, + data: [], + } + arr['data'].push(num); + seriesData.push(arr); + } + + }else { + for(let i in d){ + xAxisData.push(d[i]['event_name']); + for(let j in d[i]['groups']){ + var num =0; + for(let z in d[i]['values'][j]){ + num = parseFloat(num) + parseFloat(d[i]['values'][j][z]) + } + if(i > 0){ + for(let q in seriesData){ + if(d[i]['groups'][j] == seriesData[q]['name']){ + seriesData[q]['data'].push(num); + }else { + var arr = { + name: d[i]['groups'][j], + type: 'bar', + barWidth : 30, + data: [], + } + arr['data'].push(num); + seriesData.push(arr); + } + } + }else { + var arr = { + name: d[i]['groups'][j], + type: 'bar', + barWidth : 30, + data: [], + } + arr['data'].push(num); + seriesData.push(arr); + } + + + } + } + } + // for(let i in d){ + // for(let z in d[i]['groups']){ + // var pj = d[i]['event_name']+d[i]['groups'][z]; + // xAxisData.push(pj); + // } + // } + // var seriesData=[]; + // for(let i in d){ + // for(let z in d[i]['values']){ + // var arr = { + // name: '', + // type: 'bar', + // data: d[i]['values'][z] + // } + // seriesData.push(arr); + // } + // } + // if(xAxisData.length > 0){ + // for(let i in seriesData){ + // seriesData[i]['name'] = xAxisData[i]; + // } + // } + // return; + var myChart = echarts.init(document.getElementById('analysis-echarts')); + var option = { + tooltip: { + trigger: 'axis', + axisPointer: { + type: 'shadow' + } + }, + color: X.DATA.echartscolor, + legend: { + data: legendData + }, + grid: { + left: '2%', + right: '2%', + bottom: '2%', + top: '10%', + containLabel: true + }, + xAxis: [ + { + type: 'category', + axisTick: {show: false}, + data: xAxisData + } + ], + yAxis: [ + { + type: 'value' + } + ], + series: seriesData + }; + myChart.setOption(option,true); + }; + + //表格 + function tabledata(d){ + var titledata,condata=[]; + for(let i in d){ + titledata= $.extend(true,[],d[0]['date_range']) ; + if(d[i]['groups']['length'] != 0){ + titledata.unshift('指标','分组','阶段总和'); + for(let j in d[i]['values']){ + var arr; + arr = $.extend(true,[],d[i].values[j]); + arr.unshift(d[i]['event_name'],d[i]['sum'][j]); + condata.push(arr); + } + for(let j in condata){ + condata[j].splice(1,0,d[i]['groups'][j]); + } + + }else { + titledata.unshift('指标','阶段总和'); + var arr; + arr = $.extend(true,[],d[i].values[0]) + arr.unshift(d[i]['event_name'],d[i]['sum'][0]); + condata.push(arr); + } + } + X.laytpldata("#table-fenxi-th-dot",titledata,".table-fenxi-th"); + X.laytpldata("#table-fenxi-td-dot",condata ,".table-fenxi-td"); + }; + + function calculationdata(){ + var dataArr = { + eventView: data.eventView, + events: data.events + } + X.api("ck/event_model","post",dataArr,function(d){ + querydata = d; + if(d.length > 0){ + if(d[0].values.length > 0 ){ + updata(); + tabledata(d); + }else { + $("#analysis-echarts").empty(); + layer.msg("无数据"); + } + }else { + $("#analysis-echarts").empty(); + layer.msg("无数据"); + } + + }) + }; + + function updata(){ + var tit = $(".select-chart").attr("title"); + if(tit == '趋势图'){trendchart(querydata)} + else if(tit == '堆积图'){stackingdiagram(querydata);} + else if(tit == '累计图'){} + else if(tit == '分布图'){distributionmap(querydata)} + else if(tit == '饼状分布'){} + }; + + // 保存报表 + $(document).off('click','.analysis-savereport').on('click','.analysis-savereport',function(){ + if(baobiaodata != '' && baobiaodata != undefined && baobiaodata != null){ + X.parametersopen(baobiaodata,'savereport','auto'); + }else{ + X.parametersopen(data,'savereport','auto'); + } + }); + + // 下载 + $(document).off('click','.download-table').on('click','.download-table',function(){ + // console.log(11111); + X.download('ck/event_model_export',data,'事件分析'); + }); + + // 返回 + $(document).off('click','.analysis-fanhui').on('click','.analysis-fanhui',function(){ + X.gourl("dashboard"); + // return; + }); + + }, + + // 保存报表 + // savereport:function(d){ + + // } + + }; +})(); + + + // srczip/logic/addexistuser.js (function(){ X.pageLogic['addexistuser'] = { @@ -2465,6 +3630,7 @@ var X = window.X || { var index = obj.attr("data-index"); var indexs = obj.attr("data-indexs"); X.querycriteriapop(defaultgroupdata,'category',offset.left,offset.top+obj.height(),function(val){ + console.log(val); var htmlstring = val.title; obj.html(htmlstring); // filtersymbols[index][indexs] = val.category; @@ -2472,6 +3638,11 @@ var X = window.X || { data['events'][index]['filts'][indexs]['columnName'] = val.id; data['events'][index]['filts'][indexs]['data_type'] = val.type; data['events'][index]['filts'][indexs]['tableType'] = val.table_type; + if(val.type == 'user_label'){ + data['events'][index]['filts'][indexs]['comparator_name'] = "是"; + data['events'][index]['filts'][indexs]['comparator'] = 'in'; + } + X.laytpldata("#analysis-con-left-screen-list-dot",data.events,".analysis-con-left-screen-list-box"); }) }); @@ -2885,6 +4056,12 @@ var X = window.X || { data['eventView']['filts'][index]['comparator'] = '=='; data['eventView']['filts'][index]['tableType'] = val.table_type; filtsftvdata[index]=val.category; + + if(val.type == 'user_label'){ + data['eventView']['filts'][index]['comparator_name'] = "是"; + data['eventView']['filts'][index]['comparator'] = 'in'; + } + X.laytpldata("#analysis-overall-situation-list-box-dot",data['eventView']['filts'],".analysis-overall-situation-list-box",function(){ renderdate(); }); @@ -3226,12 +4403,12 @@ var X = window.X || { for(let j in d[i]['values']){ var arr; arr = $.extend(true,[],d[i].values[j]); - arr.unshift(d[i]['event_name'],d[i]['sum'][j]); + arr.unshift(d[i]['event_name'],d[i]['groups'][j],d[i]['sum'][j]); condata.push(arr); } - for(let j in condata){ - condata[j].splice(1,0,d[i]['groups'][j]); - } + // for(let j in condata){ + // condata[j].splice(1,0,d[i]['groups'][j]); + // } }else { titledata.unshift('指标','阶段总和'); @@ -4994,6 +6171,8 @@ var X = window.X || { } //数据根据时间降序排列 if(d['ascending']){ + // console.log() + console.log(eventdata); var condatalength = eventdata[0]['condata'].length; var condataascend=[]; for(var i = condatalength - 1; i >= 0; i--){ @@ -6309,6 +7488,10 @@ var X = window.X || { data['events'][index]['filts'][indexs]['columnName'] = val.id; data['events'][index]['filts'][indexs]['data_type'] = val.type; data['events'][index]['filts'][indexs]['tableType'] = val.table_type; + if(val.type == 'user_label'){ + data['events'][index]['filts'][indexs]['comparator_name'] = "是"; + data['events'][index]['filts'][indexs]['comparator'] = 'in'; + } X.template("userpar","userpar-event",data['events']); }) }); @@ -8635,6 +9818,10 @@ var X = window.X || { data['eventView']['filts'][index]['comparator_name'] = '等于'; data['eventView']['filts'][index]['comparator'] = '=='; data['eventView']['filts'][index]['table_type'] = val.table_type; + if(val.type == 'user_label'){ + data['eventView']['filts'][index]['comparator_name'] = "是"; + data['eventView']['filts'][index]['comparator'] = 'in'; + } X.template("globalfilter","xinwei-whole",data['eventView']['filts'],function(){ renderdate(); }); @@ -8821,14 +10008,19 @@ var X = window.X || { // var oldcondata = data.condata; // var newcondata = []; - // for(let i in oldcondata){ - // var condataArr = {}; - // for(let j in oldcondata[i]){ - // condataArr['name'+j] = oldcondata[i][j]; + // if(data.cat == 'event' || data.cat == "ltv"){ + // for(let i in oldcondata){ + // var condataArr = {}; + // for(let j in oldcondata[i]){ + // condataArr['name'+j] = oldcondata[i][j]; + // } + // newcondata.push(condataArr); // } - // newcondata.push(condataArr); - // } + // }else if(data.cat == "retention" || data.cat == "scatter"){ + // console.log(oldcondata); + // }else if(data.cat == "user_property"){ + // } // var headdata = []; // for(let i in data.titledata){ // var arr = { @@ -9834,7 +11026,15 @@ var X = window.X || { data['events'][index]['filts'][indexs]['columnName'] = val.id; data['events'][index]['filts'][indexs]['data_type'] = val.type; data['events'][index]['filts'][indexs]['tableType'] = val.table_type; - + if(val.type == 'user_label'){ + data['events'][index]['filts'][indexs]['comparatorName'] = "是"; + data['events'][index]['filts'][indexs]['comparator'] = 'in'; + } + if(index == 0){ + X.template("event","initial-event",data['events'][0]); + }else { + X.template("returnvisitevent","returnvisit-event",data['events'][1]); + } }) }); @@ -9921,6 +11121,12 @@ var X = window.X || { data['eventView']['filts'][index]['comparator'] = '=='; data['eventView']['filts'][index]['tableType'] = val.table_type; filtsftvdata[index]=val.category; + + if(val.type == 'user_label'){ + data['eventView']['filts'][index]['comparator_name'] = "是"; + data['eventView']['filts'][index]['comparator'] = 'in'; + } + X.template("globalfilter","xinwei-whole",data['eventView']['filts'],function(){ renderdate(); }); @@ -12265,6 +13471,317 @@ var X = window.X || { } }; })(); +// srczip/logic/userlabel.js +(function(){ + X.pageLogic['userlabel'] = { + init : function(parms){ + var me = this; + me.userlabellist(); + $(document).off('click','.lable-dingyi').on('click','.lable-dingyi',function(){ + X.gourl('userlabel_dy','conetnt'); + }); + + $(document).off('click','.addlabeldata').on('click','.addlabeldata',function(){ + X.DATA.userlabelid = ""; + X.gourl('userlabel_dy','conetnt'); + }); + + $(document).off('click','.lable-del').on('click','.lable-del',function(){ + var _id = X.DATA.userlabelid; + layer.confirm('确认删除选中的标签吗？该操作不可恢复', { + btn: ['取消','删除 '] //按钮 + }, function(){ + //取消 + layer.close(layer.index); + }, function(){ + //删除 + X.api("user_label/del",'post',{label_id: _id},function(d){ + layer.msg('删除成功'); + layer.close(layer.index); + me.userlabellist(); + }) + }); + }); + + // X.api('user_label/read','post',{project_id: X.DATA.projectid},function(d){ + // console.log(d); + // }) + + // 监听单行事件 + layui.table.on('row(userlabeltest)',function(obj){ + var data = obj.data + console.log(data); + X.DATA.userlabelid = data._id; + X.laytpldata('#userlabel-right-box-dot',data,'.userlabel-right-box'); + }); + + + }, + userlabellist : function(){ + X.laytabledata("#userlabel-table","user_label/list",[[ + {field:'cluster_name', title: '标签名', sort: true} + ,{field:'display_name', title: '显示名'} + ,{field:'act_name', title: '最后操作人'} + ,{field:'cluster_type', title: '创建方式',templet:function(d){ + if(d.cluster_type == "user_custom"){ + return '自定义条件' + }else{ + return '其他条件' + } + }} + // ,{fixed: 'right', title:'操作', toolbar: '#eventattradminbarDemo', width:80} + ]],"&project_id="+X.DATA.projectid,'auto',function(res, curr, count){ + // console.log(res); + if(res.data.length > 0){ + X.DATA.userlabelid = res.data[0]._id; + X.laytpldata('#userlabel-right-box-dot',res.data[0],'.userlabel-right-box'); + } + }); + } + }; +})(); + +// srczip/logic/userlabel_dy.js +(function(){ + X.pageLogic['userlabel_dy'] = { + init : function(parms){ + var me = this; + var _id = X.DATA.userlabelid; + + var data; + if(_id && _id != ""){ + X.api("user_label/detail","post",{label_id: _id},function(d){ + data = d; + $(".lablename").val(d.cluster_name); + $(".labledesc").val(d.display_name); + $(".labeldes").val(d.remarks); + updatalable(); + }) + }else { + data = { + "project_id": X.DATA.projectid, + "cluster_name": "", + "display_name": "", + "cluster_type":'user_custom', + "qp": { + "tagRemark": "", + "tagValue": "", + "user_cluster_def": { + 'event_relation':'and', + "event_user_relation":"and", + "events": [ + + ], + "filts": [], + "relation": "and" + }, + }, + "remarks": "" + }; + } + + + // 标签值定义 + var choicelabellist=[ + {'title':'做过（没做过事件）',id:'0'}, + {'title':'用户属性满足',id:'1'} + ]; + X.laydropdown('.choicelabel',choicelabellist,function(e){ + console.log(e); + var arr = {}; + if(e.id == 0){ + arr= { + endTime: "", + eventDesc: dataArr[0]['category'][0].event_desc, + event_name: dataArr[0]['category'][0].event_name, + eventType: "event", + filts: [], + num: "", + e_days:0, + s_days:7, + relation: "and", + startTime: "", + uce_calcu_symbol: "==", + uce_calcu_symbolDesc: "等于", + prop_quota: {analysis: '', analysisDesc: '', quota: retdata[0]['id'], quotaDesc: retdata[0]["title"],quota_type: null}, + is_touch: true, + } + data['qp']['user_cluster_def']['events'].push(arr); + }else { + arr = { + calcuSymbol: "C01", + columnDesc: "", + columnName: "lv", + columnType: "double", + filterType: "SIMPLE", + ftv: ["10"], + selectType: "number", + tableType: "1", + timeRelative: "", + timeUnit: "" + } + data['qp']['user_cluster_def']['filts'].push(arr); + } + + updatalable(); + }); + + $(document).off('click','.userlabel-dy-head-userlabel').on('click','.userlabel-dy-head-userlabel',function(){ + X.gourl('userlabel','conetnt'); + }); + + $(document).off("click",'.ta-isDone').on("click",'.ta-isDone',function(){ + var index = $(this).attr("data-index"); + data['qp']['user_cluster_def']['events'][index]['is_touch'] = !data['qp']['user_cluster_def']['events'][index]['is_touch']; + updatalable(); + }); + + var dataArr = [],retdata = [],props=[],defaultgroupdata=[],filter_map=[],quotas_map=[]; + + X.api("data_auth/my_event","get",{},function(d){ + + dataArr = d; + X.api("data_auth/load_prop_quotas","post",{event_name:dataArr[0]['category'][0]['event_name']},function(d){ + retdata = d.staid_quots.concat(d.props); + props = d.props; + + X.api("data_auth/load_filter_props","post",{event_name:dataArr[0]['category'][0]['event_name']},function(val){ + defaultgroupdata = val; + + X.api("data_auth/filter_map","get",{},function(d){ + filter_map = d; + + X.api('data_auth/quotas_map',"get",{},function(d){ + quotas_map = d; + + }) + + }) + + }) + }) + }); + + $(document).off("click",'.my-event-data').on('click','.my-event-data',function(){ + var obj = $(this); + var offset = obj.offset(); + var index = obj.attr('data-index'); + X.querycriteriapop(dataArr,'setgrouping',offset.left,offset.top+obj.height(),function(val){ + console.log(val); + data['qp']['user_cluster_def']['events'][index]['eventDesc'] = val.id; + data['qp']['user_cluster_def']['events'][index]['event_name'] = val.name; + updatalable(); + }) + }); + + var label_time_index; //点击修改日期的index; + $(document).off('click','.time-days-box').on("click",'.time-days-box',function(){ + var index = $(this).attr("data-index"); + label_time_index = index; + }); + + function updatalable(){ + X.laytpldata('#userlabel-json-box-dot',data['qp']['user_cluster_def'],'.userlabel-json-box'); + + X.daterender(".time-days-box",function(start, end, label){ + var startTime = start.format('YYYY-MM-DD')+ " "+ "00:00:00"; + var endTime = end.format('YYYY-MM-DD')+ " "+ "23:59:59"; + data['qp']['user_cluster_def']['events'][label_time_index]['startTime'] = startTime; + data['qp']['user_cluster_def']['events'][label_time_index]['endTime'] = endTime; + var sameday = Date.parse(new Date()) / 1000; //当天时间戳 + + var enddate = new Date(end.format('YYYY-MM-DD')); + var endmonth = Date.parse(enddate)/1000; + + var startdate = new Date(start.format('YYYY-MM-DD')); + var startmonth = Date.parse(startdate)/1000; + data['qp']['user_cluster_def']['events'][label_time_index]['e_days'] = parseInt((sameday - endmonth)/86400); + data['qp']['user_cluster_def']['events'][label_time_index]['s_days'] = parseInt((sameday - startmonth)/86400); + updatalable(); + }) + }; + + $(document).off("click",'.load_prop_quotas_data').on('click','.load_prop_quotas_data',function(){ + var obj = $(this); + var offset = obj.offset(); + var index = obj.attr('data-index') + X.parametersopen(retdata,'dropdownlist',[offset.top+obj.height(),offset.left],function(val){ + console.log(val); + data['qp']['user_cluster_def']['events'][index]['prop_quota']['quotaDesc'] = val.title; + data['qp']['user_cluster_def']['events'][index]['prop_quota']['quota_type'] = val.data_type; + if(val.data_type == null){ + data['qp']['user_cluster_def']['events'][index]['prop_quota']['quota'] = val.analysis; + }else { + data['qp']['user_cluster_def']['events'][index]['prop_quota']['quota'] = val.id; + } + updatalable(); + }); + }); + + $(document).off("click",'.analysis-data-box').on('click','.analysis-data-box',function(){ + var obj = $(this); + var offset = obj.offset(); + var index = obj.attr('data-index'); + var type = obj.attr('data-type'); + X.parametersopen(quotas_map[type],'dropdownlist',[offset.top+obj.height(),offset.left],function(val){ + console.log(val); + data['qp']['user_cluster_def']['events'][index]['prop_quota']['analysisDesc'] = val.title; + data['qp']['user_cluster_def']['events'][index]['prop_quota']['analysis'] = val.id; + updatalable(); + }) + }); + + $(document).off('click','.uce_calcu_symbol_box').on('click','.uce_calcu_symbol_box',function(){ + var obj = $(this); + var index = obj.attr("data-index"); + var offset = obj.offset(); + X.parametersopen(X['DATA']['search']['condition2'],'dropdownlist',[offset.top+obj.height(),offset.left],function(val){ + console.log(val); + data['qp']['user_cluster_def']['events'][index]['uce_calcu_symbolDesc'] = val.title; + data['qp']['user_cluster_def']['events'][index]['uce_calcu_symbol'] = val.id; + updatalable(); + }) + }); + + $(document).off("change",'.lable-input-box input').on('change','.lable-input-box input',function(){ + var obj = $(this); + var index = obj.attr("data-index"); + console.log(index); + var text = obj.val(); + data['qp']['user_cluster_def']['events'][index]['num'] = text; + }); + + $(document).off('click','.action-icon-events-del').on('click','.action-icon-events-del',function(){ + var obj = $(this); + var index = obj.attr("data-index"); + data['qp']['user_cluster_def']['events'].splice(index,1); + updatalable(); + }); + + $(document).off("click",'.userlabel-dy-baocun').on("click",".userlabel-dy-baocun",function(){ + var lablename = $(".lablename").val(); + var labledesc = $(".labledesc").val(); + var labeldes = $(".labeldes").val(); + if(lablename == ""){ + layer.msg("请填写标签名"); + return; + } + if(labledesc == ""){ + layer.msg("请填写显示名"); + return; + } + data['cluster_name'] = lablename; + data['display_name'] = labledesc; + data['remarks'] = labeldes; + X.api('user_label/save','post',data,function(d){ + console.log(d); + layer.msg("添加成功"); + }) + }); + + } + }; +})(); // srczip/logic/userpar.js (function(){ X.pageLogic['userpar'] = { diff --git a/web/srczip/common.js b/web/srczip/common.js index 4c0008a..c08dff5 100644 --- a/web/srczip/common.js +++ b/web/srczip/common.js @@ -56,7 +56,14 @@ var X = window.X || { {'title':'有值','id':'4','default':false}, {'title':'无值','id':'5','default':false}, {'title':'区间','id':'6','default':false} - ] + ], + condition2:[ + {'title':'等于','id':'==','default':false}, + {'title':'不等于','id':'!=','default':false}, + {'title':'小于','id':'<','default':true}, + {'title':'大于','id':'>','default':false}, + {'title':'区间','id':'range','default':false} + ], }, //日期控件参数 'locale': { @@ -338,7 +345,7 @@ var X = window.X || { }; //渲染表格有分页有操作 - X.laytabledata = function(id,url,data,arr,height){ + X.laytabledata = function(id,url,data,arr,height,callback){ var loginCache = X.loginCache(); var token = (loginCache? loginCache.token:""); token = "Bearer "+token; @@ -360,6 +367,9 @@ var X = window.X || { ,cellMinWidth: 80 //全局定义常规单元格的最小宽度，layui 2.2.1 新增 ,cols: data ,height: height + ,done: function (res, curr, count) { + callback && callback(res, curr, count); + } }); }; @@ -558,14 +568,14 @@ var X = window.X || { 'locale': X.DATA.locale, ranges: { '今日': [moment(), moment()], - '昨日': [moment().subtract(1, 'days'), moment().subtract(1, 'days')], + '昨日': [moment, moment().subtract(1, 'days')], '最近7日': [moment().subtract(7, 'days'), moment().subtract(0, 'days')], '最近30日': [moment().subtract(30, 'days'), moment().subtract(0, 'days')], '上周': [moment().subtract(1, 'week').startOf('week')+86400000, moment().subtract(1, 'week').endOf('week')+86400000], '本周': [moment().startOf('week')+86400000, moment()+86400000], '本月': [moment().startOf('month'), moment()], - '上月': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month') - ] + '上月': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month')], + '全部时间': [moment().subtract( parseInt((new Date).getTime()/86400000) , 'days'), moment()] }, "alwaysShowCalendars": true, "startDate": moment().subtract(7, 'days'), diff --git a/web/srczip/logic/3rmodel.js b/web/srczip/logic/3rmodel.js new file mode 100644 index 0000000..bef04ae --- /dev/null +++ b/web/srczip/logic/3rmodel.js @@ -0,0 +1,1153 @@ +(function(){ + X.pageLogic['3rmodel'] = { + init : function(){ + var me = this; + // 渲染form样式 + layui.form.render(); + + var dataArr; //分析指标 + var groupeddata;//分组项 + var type2data; + //var filtersymbols=[];//筛选符号 + // filtersymbols.push(drr); + var defaultgroupdata; //默认添加分组项里的事件 + var filter_map,quotas_map; + var data = { + "events":[], + "eventView":{ + "cksql":"event", + "startTime":"", + "timeParticleSize":"P1D", + "endTime":"", + "graphShape":"L0", + "e_days":0, + "s_days":7, + "groupBy":[], + "uiCommonConfig":{ + "tableSorts":[], + "chartSort":"num-desc" + }, + "filts":[],//全局筛选 + "relation":'and', + "zone_time":'8',//时区 + 'min_r': 1, + 'middle_r':1 + } + } + + var retdata,props; + + // 日期渲染 + X.daterender("#analtsis-condition-date",function(start, end, label){ + var startTime = start.format('YYYY-MM-DD')+ " "+ "00:00:00"; + var endTime = end.format('YYYY-MM-DD')+ " "+ "23:59:59"; + data['eventView']['startTime'] = startTime; + data['eventView']['endTime'] = endTime; + var sameday = Date.parse(new Date()) / 1000; //当天时间戳 + + var enddate = new Date(end.format('YYYY-MM-DD')); + var endmonth = Date.parse(enddate)/1000; + + var startdate = new Date(start.format('YYYY-MM-DD')); + var startmonth = Date.parse(startdate)/1000; + data['eventView']['e_days'] = parseInt((sameday - endmonth)/86400); + data['eventView']['s_days'] = parseInt((sameday - startmonth)/86400); + console.log(parseInt((sameday - endmonth)/86400)); + console.log(parseInt((sameday - startmonth)/86400)); + // calculationdata(); + }) + + var time = $("#analtsis-condition-date").val(); + var timearr = time.split(" "); + data['eventView']['startTime'] = timearr[0] + " "+"00:00:00"; + data['eventView']['endTime'] = timearr[2]+" "+"23:59:59"; + + // X.template("toptab","analysis-zhanwei",X.DATA['projectarr'],function(){ + X.api("data_auth/my_event","get",{},function(d){ + + dataArr = d; + X.api("data_auth/load_prop_quotas","post",{event_name:dataArr[0]['category'][0]['event_name']},function(d){ + retdata = d.staid_quots.concat(d.props); + props = d.props; + var defaultindicator = { + "event_desc":dataArr[0]['category'][0]['event_desc'], + "event_name":dataArr[0]['category'][0]['event_name'], + "event_attr":"总次数", + "event_attr_id":"*", + "event_attr_type":"", + "analysisname":'', + "analysis":'total_count', + "filts":[],//过滤项 + "relation":'and', + "customEvent":'', + "eventNameDisplay":'',//重命名指标 + "format":'float', + "formatname":'两位小数' + } + data.events.push(defaultindicator); + X.laytpldata("#analysis-con-left-screen-list-dot",data.events,".analysis-con-left-screen-list-box"); + type2data= retdata + X.api("data_auth/load_filter_props","post",{event_name:dataArr[0]['category'][0]['event_name']},function(val){ + defaultgroupdata = val; + + X.api("data_auth/filter_map","get",{},function(d){ + filter_map = d; + + X.api('data_auth/quotas_map',"get",{},function(d){ + quotas_map = d; + //从数据看板点击进来触发事件 + if(X.DATA.eventid && X.DATA.eventid != ''){ + var report_idarr = []; + report_idarr.push(X.DATA.eventid); + X.api('report/read_report','post',{project_id:X.DATA.projectid,report_id:report_idarr},function(d){ + backfilldata(d[0]); + }) + } + }) + + }) + + }) + }) + // groupeddata = d.group_by; + }) + // }); + + + // 渲染选择时间下拉框 + layui.dropdown.render({ + elem: ".analysis-navigation-bar-datetime" + ,data: X.DATA.timezone + ,click: function(obj){ + $(".analysis-navigation-bar-datetime").html(obj.title); + data['eventView']['zone_time'] = obj.id; + } + }); + + // 伸缩左侧选项 + $(".analysis-con-left-shrink").click(function(){ + if($(".analysis-con-left").css('left') == "auto" || $(".analysis-con-left").css('left') == "0px"){ + $(".analysis-con-left").css("position","absolute"); + $(".analysis-con-left").css("left","-535px"); + $(".analysis-con-left-shrink").css("transform","rotate(180deg)"); + $(".analysis-con-right").css("width","calc(100% - 15px)"); + $(".analysis-con-right").css("margin-left","16px"); + }else { + $(".analysis-con-left").css("position","relative"); + $(".analysis-con-left").css("left","auto"); + $(".analysis-con-left-shrink").css("transform","rotate(3600deg)"); + $(".analysis-con-right").css("width","calc(100% - 550px)"); + $(".analysis-con-right").css("margin-left","0px"); + } + }); + + //已存报表 + var baobiaodata; + $(document).off('click','.analysis-navigation-bar-right-img-baobiao').on('click','.analysis-navigation-bar-right-img-baobiao',function(){ + X.parametersopen(data['eventView']['cksql'],'savedbaobiao','rt',function(d){ + if(d){ + backfilldata(d) + } + }) + }); + + // 反向填充数据 + function backfilldata(d){ + + data = d.query; + // filtersymbols = data.cachedata.filtersymbols; + var time = $("#analtsis-condition-date").val(); + var timearr = time.split(" "); + data['eventView']['startTime'] = timearr[0] + " "+"00:00:00"; + data['eventView']['endTime'] = timearr[2]+" "+"23:59:59"; + baobiaodata = d; + + if(d.query.eventView.filts.length > 0){ + $(".analysis-overall").show(); + }else { + $(".analysis-overall").hide(); + } + + X.laytpldata("#analysis-con-left-screen-list-dot",d.query.events,".analysis-con-left-screen-list-box"); + X.laytpldata("#analysis-gpmain___3YGfw-dot",d.query.eventView.groupBy,".analysis-gpmain___3YGfw"); + X.laytpldata("#analysis-overall-situation-list-box-dot",d.query['eventView']['filts'],".analysis-overall-situation-list-box",function(){ + renderdate(); + }); + // analysisdown(); + calculationdata(); + } + + // sql语句显示 + $(document).off('click','.sqlquery').on('click','.sqlquery',function(){ + var obj = $(this); + var offset = obj.offset(); + X.querycriteriapop(data,'conditionquery',offset.left - 410,offset.top+obj.height(),function(){ + + }) + }); + + // 切换为指标公式或组合 + $(document).off('click','.analysis-gongshi').on('click','.analysis-gongshi',function(){ + var index = $(this).attr("data-index"); + var type = $(this).attr("data-type"); + data['events'][index]['customType'] = type; + $("#analysis-con-left-screen-list-left-box-"+index).hide(); + $("#analysis-custom-box-"+index).show(); + $(this).hide(); + $("#analysis-con-left-screen-list-right-"+index+" "+".analysis-zhibiao").show(); + }); + + // 切换为指标选择 + $(document).off('click','.analysis-zhibiao').on('click','.analysis-zhibiao',function(){ + var index = $(this).attr("data-index"); + $("#analysis-con-left-screen-list-left-box-"+index).show(); + $("#analysis-custom-box-"+index).hide(); + $(this).hide(); + $("#analysis-con-left-screen-list-right-"+index+" "+".analysis-gongshi").show(); + }); + + //复制指标 + $(document).off('click','.analysis-fuzhi').on('click','.analysis-fuzhi',function(){ + var index = $(this).attr("data-index"); + var arr = data.events[index]; + data.events.push(arr); + X.laytpldata("#analysis-con-left-screen-list-dot",data.events,".analysis-con-left-screen-list-box"); + var num = data.events.length; + + // filtersymbols[num] = filtersymbols[index]; + }); + + //重命名指标 + $(document).off('click','.analysis-chongmingming').on('click','.analysis-chongmingming',function() { + var index = $(this).attr('data-index'); + $("#analysis-con-left-screen-list-left-zhibiaoname-"+index).show(); + $(this).hide(); + $("#analysis-con-left-screen-list-right-"+index+" "+".analysis-chongmingming-del").show(); + }); + + //删除重命名 + $(document).off('click','.analysis-chongmingming-del').on('click','.analysis-chongmingming-del',function() { + var index = $(this).attr("data-index"); + $("#analysis-con-left-screen-list-left-zhibiaoname-"+index).hide(); + $("#analysis-con-left-screen-list-left-zhibiaoname-"+index+" "+"input").val(''); + $(this).hide(); + $("#analysis-con-left-screen-list-right-"+index+" "+".analysis-chongmingming").show(); + }); + + // 设置一级事件 + $(document).off('click','.ant-dropdown-trigger').on('click','.ant-dropdown-trigger',function() { + var obj = $(this); + var offset = obj.offset(); + var index = obj.attr('data-index') + X.querycriteriapop(dataArr,'setgrouping',offset.left,offset.top+obj.height(),function(val){ + var htmlstring = val.id; + obj.html(htmlstring); + data['events'][index]['event_desc'] = val.id; + data['events'][index]['event_name'] = val.name; + + + + }) + }); + //设置一级事件中第二个参数 + $(document).off('click','.analysis-zhibiao-list-type2').on('click','.analysis-zhibiao-list-type2',function(){ + var obj = $(this); + var offset = obj.offset(); + var index = obj.attr("data-index"); + if(type2data.length >0){ + X.parametersopen(type2data,'dropdownlist',[offset.top+obj.height(),offset.left],function(val){ + if(val != undefined){ + $("#analysis-zhibiao-list-type2-"+index).html(val.title); + + data['events'][index]['event_attr'] = val.title; + data['events'][index]['event_attr_id'] = val.id; + data['events'][index]['event_attr_type'] = val.data_type; + + if(val.data_type && val.data_type != null){ + $("#analysis-zhibiao-list-type3-"+index).show(); + $("#analysis-zhibiao-list-type3-"+index).html(quotas_map[val.data_type][0]['title']); + data['events'][index]['analysisname'] = quotas_map[val.data_type][0]['title']; + data['events'][index]['analysis'] = quotas_map[val.data_type][0]['id']; + }else { + $("#analysis-zhibiao-list-type3-"+index).hide(); + data['events'][index]['analysis'] = val.analysis; + } + X.laytpldata("#analysis-con-left-screen-list-dot",data.events,".analysis-con-left-screen-list-box"); + } + }) + } + }); + //设置一级事件中第三个参数 + $(document).off('click','.analysis-zhibiao-condition').on('click','.analysis-zhibiao-condition',function(){ + var obj = $(this); + var offset = obj.offset(); + var index = obj.attr("data-index"); + var type = data['events'][index]['event_attr_type']; + + X.parametersopen(quotas_map[type],'dropdownlist',[offset.top+obj.height(),offset.left],function(val){ + $("#analysis-zhibiao-list-type3-"+index).html(val.title); + data['events'][index]['analysisname'] = val.title; + data['events'][index]['analysis'] = val.id; + }) + }); + + $(document).off('click','.ta-property-select').on('click','.ta-property-select',function(){ + var obj = $(this); + var offset = obj.offset(); + var index = obj.attr("data-index"); + var indexs = obj.attr("data-indexs"); + X.querycriteriapop(defaultgroupdata,'category',offset.left,offset.top+obj.height(),function(val){ + var htmlstring = val.title; + obj.html(htmlstring); + // filtersymbols[index][indexs] = val.category; + data['events'][index]['filts'][indexs]['columnDesc'] = htmlstring; + data['events'][index]['filts'][indexs]['columnName'] = val.id; + data['events'][index]['filts'][indexs]['data_type'] = val.type; + data['events'][index]['filts'][indexs]['tableType'] = val.table_type; + }) + + }); + + $(document).off('click','.analysis-choicetypename').on('click','.analysis-choicetypename',function(){ + var obj = $(this); + var offset = obj.offset(); + var index = $(this).attr("data-index"); + var indexs = $(this).attr("data-indexs"); + var type = data['events'][index]['filts'][indexs]['data_type']; + X.parametersopen(filter_map[type],'dropdownlist',[offset.top+obj.height(),offset.left],function(val){ + if(val != undefined){ + obj.html(val.title); + data['events'][index]['filts'][indexs]['comparator_name'] = val.title; + data['events'][index]['filts'][indexs]['comparator'] = val.id; + } + }) + }); + + // 添加筛选项 + $(document).off('click','.analysis-shaix-jinting').on('click','.analysis-shaix-jinting',function(){ + var obj = $(this); + var index = obj.attr("data-index"); + addscreen(index); + }); + + // 添加筛选项 + function addscreen(index){ + X.api('data_auth/load_filter_props',"post",{event_name:data['events'][index]["event_name"]},function(d){ + + var arr = { + "columnDesc":d[0]['category'][0]['title'],//事件中文显示 + "columnName":d[0]['category'][0]['id'],//事件id + "comparator_name":filter_map[d[0]['category'][0]['data_type']][0]['title'],//选择符号中文显示 + "comparator":filter_map[d[0]['category'][0]['data_type']][0]['id'],//符号id + "data_type":d[0]['category'][0]['data_type'], + "ftv":[],//条件 + "strftv":'',//字符串显示条件 + "tableType": d[0]['id'] + } //筛选数据 + data['events'][index]['filts'].push(arr); + X.laytpldata("#analysis-con-left-screen-list-dot",data.events,".analysis-con-left-screen-list-box"); + }) + }; + + //监听重命名指标 + $(document).off('change','.analysis-con-left-screen-list-left-zhibiaoname input').on('change','.analysis-con-left-screen-list-left-zhibiaoname input',function(){ + var index = $(this).attr("data-index"); + var txt = $(this).val(); + + data['events'][index]['eventNameDisplay'] = txt; + }); + + // 监听文本框 + $(document).off('change','.analysis-zhibiao-list-type4 input').on('change','.analysis-zhibiao-list-type4 input',function(){ + var index = $(this).attr("data-index"); + var indexs = $(this).attr("data-indexs"); + var val = $(this).val(); + var valarr = val.split(","); + console.log(data['events'][index]); + if(data['events'][index]['filts'][indexs]){ + data['events'][index]['filts'][indexs]['ftv']=valarr; + data['events'][index]['filts'][indexs]['strftv']=val; + }else { + + } + + }); + + // 且和或切换 + $(document).off('click','.analysis-con-left-screen-list-right-screen-qh-tit').on("click",".analysis-con-left-screen-list-right-screen-qh-tit",function(){ + var html = $(this).html(); //relation筛选条件的关系 + var index = $(this).attr("data-index"); + if(html == "且"){ + $(this).html('或'); + data['events'][index]['relation'] = 'or' + }else { + $(this).html('且'); + data['events'][index]['relation'] = 'and' + } + }); + + // 添加条件按钮 + $(document).off('click','.analysis-zhibiao-updata').on('click',".analysis-zhibiao-updata",function(){ + // addindex(); + var obj = $(this); + var index = obj.attr("data-index"); + addscreen(index); + }); + + // 删除二级筛选项 + $(document).off('click','.analysis-zhibiao-list-del').on('click','.analysis-zhibiao-list-del',function(){ + // var id = "analysis-zhibiao-list-mar-"+$(this).attr("data-twonum"); + // $("#"+id).remove(); + var index = $(this).attr("data-index"); + var indexs = $(this).attr("data-indexs"); + // filtersymbols[index].splice(indexs,1); + data.events[index]['filts'].splice(indexs,1); + X.laytpldata("#analysis-con-left-screen-list-dot",data.events,".analysis-con-left-screen-list-box"); + }); + + // 添加指标 + function addindex(){ + var defaultindicator = { + "event_desc":dataArr[0]['category'][0]['event_desc'], + "event_name":dataArr[0]['category'][0]['event_name'], + "event_attr":"总次数", + "event_attr_id":"*", + "event_attr_type":"", + "analysisname":'', + "analysis":'total_count', + "filts":[],//过滤项 + "relation":'and', + "customEvent":'', + "eventNameDisplay":'',//重命名指标 + "format":'float', + "formatname":'两位小数' + } + data['events'].push(defaultindicator); + + X.laytpldata("#analysis-con-left-screen-list-dot",data.events,".analysis-con-left-screen-list-box"); + var index = data.events.length - 1; + + $(".analysis-del").show() //显示删除按钮 + var drr = []; + if(data.events.length > 1){ + $(".analysis-overall").show(); + }else { + $(".analysis-overall").hide(); + } + }; + + //添加按钮 + $(document).on('click','.analysis-jia1',function(){ + + addindex(); + + }); + //添加指标按钮 + $(document).on('click','.analysis-bottom-jia1',function(){ + + addindex(); + + }); + + //删除指标 + $(document).off('click','.analysis-del').on('click',".analysis-del",function(){ + if(data['events'].length != 1){ + var index = $(this).attr("data-index"); + data['events'].splice(index,1); + if(data['events'].length == 1){ + $(".analysis-del").hide(); //隐藏删除按钮 + $(".analysis-overall").hide(); + } + X.laytpldata("#analysis-con-left-screen-list-dot",data.events,".analysis-con-left-screen-list-box"); + } + }); + + + $(".analysis-custom-event-box .analysis-custom-event-txt").blur(function(){ + $(this).css("border-bottom","0px"); + }); + + $(document).off('click','.analysis-custom-event-box .analysis-custom-event-txt').on('blur','.analysis-custom-event-box .analysis-custom-event-txt',function(){ + // $(this).css("border-bottom","1px solid #3d90ff"); + var obj = $(this); + var offset = obj.offset(); + var index = obj.attr("data-index"); + console.log(data['events']); + data['events'][index]['customEvent'] = $(this).val(); + }); + + $(document).off('click','.analysis-con-left-screen-list-left-zhibiaoname2 input').on('blur','.analysis-con-left-screen-list-left-zhibiaoname2 input',function(){ + var index = $(this).attr('data-index'); + data['events'][index]['eventNameDisplay'] = $(this).val(); + }); + + $(document).off('click','.ant-select-selector').on('click','.ant-select-selector',function(){ + var obj = $(this); + var offset = obj.offset(); + var index = $(this).attr("data-index"); + var downlist = [ + {title:'两位小数',id:'float'}, + {title:'百分比',id:'percent'}, + {title:'取整',id:'integer'}, + ]; + X.parametersopen(downlist,'dropdownlist',[offset.top+obj.height(),offset.left],function(val){ + if(val != undefined){ + obj.html(val.title); + data['events'][index]['format'] = val.id; + data['events'][index]['formatname'] = val.title; + } + }) + + }); + + //分组项 + var cat = "event"; + $(document).off('click','.analysis-footadd___2D4YB').on('click','.analysis-footadd___2D4YB',function(){ + var index = data['eventView']['groupBy'].length; + for(let i in defaultgroupdata){ + if(defaultgroupdata[i]['category'].length > 0){ + var drr = { + "columnDesc":defaultgroupdata[i]['category'][index]['title'],//事件中文显示 + "columnName":defaultgroupdata[i]['category'][index]['id'],//事件id + 'data_type':defaultgroupdata[i]['category'][index]['data_type'],//类型 + 'tableType': defaultgroupdata[i]['id'], + "ftv":[],//条件 + "section":''//区间 + } + break; + } + } + + data.eventView.groupBy.push(drr); + X.laytpldata("#analysis-gpmain___3YGfw-dot",data.eventView.groupBy,".analysis-gpmain___3YGfw"); + + }); + + $(document).off('click','.analysis-ant-dropdown-trigger').on('click','.analysis-ant-dropdown-trigger',function(){ + var obj = $(this); + var offset = obj.offset(); + var index = obj.attr("data-index"); + X.querycriteriapop(defaultgroupdata,'category',offset.left,offset.top+obj.height(),function(val){ + var htmlstring = val.title; + obj.html(htmlstring); + data.eventView.groupBy[index]['columnDesc'] = val.title; + data.eventView.groupBy[index]['columnName'] = val.id; + data.eventView.groupBy[index]['data_type'] = val.type; + data.eventView.groupBy[index]['tableType'] = val.table_type; + X.laytpldata("#analysis-gpmain___3YGfw-dot",data.eventView.groupBy,".analysis-gpmain___3YGfw"); + }) + }); + + $(document).off('click','.analysis-granularity').on("click",".analysis-granularity",function(){ + var obj = $(this); + var offset = obj.offset(); + var type = obj.attr("data_type"); + var index = obj.attr("data-index"); + var arr; + if(type == 'date'){ + arr = { + data:[ + {'name':"按天",'id':'day','checked':true}, + {'name':"按分钟",'id':'min','checked':false}, + {'name':"按小时",'id':'hour','checked':false}, + {'name':"按周",'id':'week','checked':false}, + {'name':"按月",'id':'month','checked':false} + ], + default: data.eventView.groupBy[index]['ftv'] + + } + }else { + arr ={ + data:[ + {'name':"按元素",'id':'0','checked':true}, + {'name':"按列表整体",'id':'1','checked':false}, + {'name':"按元素集合",'id':'2','checked':false} + ], + default: data.eventView.groupBy[index]['ftv'] + } + } + + X.querycriteriapop(arr,'groupitem',offset.left,offset.top+obj.height(),function(val){ + data.eventView.groupBy[index]['ftv'] = val.id; + }) + }); + + $(document).on("click",".analysis-section",function(){ + var obj = $(this); + var offset = obj.offset(); + var sectionid = obj.attr("data-sectionid"); + + X.open({ + type: 1, + title: false, + closeBtn: 0, + shadeClose: true, + skin: 'yourclass', + url: 'groupeditemspop', + extData : sectionid, + callback : function(val){ + + } + }) + + }); + + $(document).on('click','.analysis-action-right',function(){ + var index = $(this).attr('data-index'); + data.eventView.groupBy.splice(index,1); + X.laytpldata("#analysis-gpmain___3YGfw-dot",data.eventView.groupBy,".analysis-gpmain___3YGfw"); + }); + + $(document).on('click','.analysis-event-splitting',function(){ + + }); + + // 全局筛选 + var filtsftvdata=[]; + $(document).off('click','.analysis-overall-situation-add').on('click','.analysis-overall-situation-add',function(){ + console.log(defaultgroupdata); + var drr={ + "columnDesc":defaultgroupdata[0]['category'][0]['title'],//事件中文显示 columnDesc + "columnName":defaultgroupdata[0]['category'][0]['id'],//事件id + 'data_type':defaultgroupdata[0]['category'][0]['data_type'],//类型 + 'comparator_name':'等于',//默认等于 + "comparator":'==',//符号id + "ftv":[],//条件 + "strftv":'',//显示条件 + "section":[-1,1],//区间 + "tableType":defaultgroupdata[0]['id'] + }; + data['eventView']['filts'].push(drr);//上传全局数据 + filtsftvdata.push(defaultgroupdata[0]['category'][0]['category']) + + $(".analysis-overall-situation-left-box").show(); + + if(data['eventView']['filts'].length > 1){ + $(".analysis-overall-situation-left-guanxi").show(); + }else{ + $(".analysis-overall-situation-left-guanxi").hide(); + } + X.laytpldata("#analysis-overall-situation-list-box-dot",data['eventView']['filts'],".analysis-overall-situation-list-box",function(){ + renderdate(); + }); + // analysisdown(); + }); + + $(document).off('click','.analysis-overall-situation-fuhao').on('click','.analysis-overall-situation-fuhao',function(){ + var obj = $(this); + var offset = obj.offset(); + var index = obj.attr("data-index"); + var type = data['eventView']['filts'][index]['data_type']; + X.parametersopen(filter_map[type],'dropdownlist',[offset.top+obj.height(),offset.left],function(val){ + $(this).html(val.title); + data['eventView']['filts'][index]['comparator_name'] = val.title; + data['eventView']['filts'][index]['comparator'] = val.id; + if(val.id == "range"){ + data['eventView']['filts'][index]['ftv'] = [-1,1]; + } + X.laytpldata("#analysis-overall-situation-list-box-dot",data['eventView']['filts'],".analysis-overall-situation-list-box",function(){ + renderdate(); + }); + }) + }); + + $(document).off('click','.analysis-overall-situation-del').on('click',".analysis-overall-situation-del",function(){ + var index = $(this).attr("data-index"); + data['eventView']['filts'].splice(index,1); + filtsftvdata.splice(index,1); + if(data['eventView']['filts'].length > 1){ + $(".analysis-overall-situation-left-guanxi").show(); + }else{ + $(".analysis-overall-situation-left-guanxi").hide(); + // $(".analysis-overall-situation-left-box").hide(); + } + X.laytpldata("#analysis-overall-situation-list-box-dot",data['eventView']['filts'],".analysis-overall-situation-list-box",function(){ + renderdate(); + }); + // analysisdown(); + }); + + var render_date_index;//且用户符合时间选择框的index + $(document).off('click','.analysis-overall-situation-date').on('click','.analysis-overall-situation-date',function(){ + var index = $(this).attr('data-index'); + render_date_index = index; + // console.log(index); + }); + + // 渲染过滤项时间框 + function renderdate(){ + lay('.analysis-overall-situation-date').each(function(){ + layui.laydate.render({ + elem: this + ,type:"datetime" + ,trigger: 'click' + ,done: function(value, date, endDate){ + data['eventView']['filts'][render_date_index]['strftv'] = value; + var datearr = []; + datearr.push(value) + data['eventView']['filts'][render_date_index]['ftv'] = datearr; + } + }); + }); + }; + + + $(document).off('click','.analysis-overall-situation-left-guanxi').on('click','.analysis-overall-situation-left-guanxi',function(){ + var html = $(this).html(); //relation筛选条件的关系 + if(html == "且"){ + $(this).html('或'); + data['eventView']['relation'] = 'or' + }else { + $(this).html('且'); + data['eventView']['relation'] = 'and' + } + }); + + // 全局属性选择 + $(document).off('click','.analysis-overall-situation-attr').on('click',".analysis-overall-situation-attr",function(){ + var obj = $(this); + var offset = obj.offset(); + var index = obj.attr("data-index"); + X.querycriteriapop(defaultgroupdata,'category',offset.left,offset.top+obj.height(),function(val){ + obj.html(val.title); + data['eventView']['filts'][index]['columnDesc'] = val.title; + data['eventView']['filts'][index]['columnName'] = val.id; + data['eventView']['filts'][index]['data_type'] = val.type; + data['eventView']['filts'][index]['comparator_name'] = '等于'; + data['eventView']['filts'][index]['comparator'] = '=='; + data['eventView']['filts'][index]['tableType'] = val.table_type; + filtsftvdata[index]=val.category; + X.laytpldata("#analysis-overall-situation-list-box-dot",data['eventView']['filts'],".analysis-overall-situation-list-box",function(){ + renderdate(); + }); + // analysisdown(); + }) + }); + + $(document).off('blur','.analysis-overall-situation-input3 input').on('blur','.analysis-overall-situation-input3 input',function(){ + var index = $(this).attr("data-index"); + var text = $(this).val(); + if(index == 0){ + data['eventView']['min_r'] = text; + }else{ + data['eventView']['middle_r'] = text; + } + }); + + $(document).off('blur','.analysis-overall-situation-input input').on('blur','.analysis-overall-situation-input input',function(){ + var index = $(this).attr("data-index"); + var val = $(this).val(); + var valarr = val.split(","); + data['eventView']['filts'][index]['ftv']=valarr; + data['eventView']['filts'][index]['strftv']=val; + }); + + $(document).off('blur','.analysis-overall-situation-input2 input').on('blur','.analysis-overall-situation-input2 input',function(){ + var name = $(this).attr('name'); + var val = $(this).val(); + var index = $(this).attr("data-index"); + + if(name == 'start'){ + data['eventView']['filts'][index]['ftv'][0] = val; + data['eventView']['filts'][index]['section'][0] = val; + }else { + data['eventView']['filts'][index]['ftv'][1] = val; + data['eventView']['filts'][index]['section'][1] = val; + } + }); + + // 时间粒度 + X.laydropdown('.analtsis-timeParticleSize',X['DATA']['screenlist']['event'],function(d){ + $(".analtsis-timeParticleSize").html(d.title); + data['eventView']['timeParticleSize'] = d.id; + calculationdata(); + }); + + X.layuidate('#analysis-overall-situation-time1'); + + // 计算 + $(document).off('click','.analysis-calculation').on('click','.analysis-calculation',function(){ + calculationdata(); + + }); + + var querydata;//查询数据 + $(document).on('click','.analtsis-chart-switch-box .analtsis-chart-switch',function(){ + console.log(querydata); + if(querydata){ + $('.analtsis-chart-switch-box .analtsis-chart-switch').removeClass('select-chart'); + $(this).addClass('select-chart'); + if($(this).attr('title') == '趋势图'){trendchart(querydata)} + else if($(this).attr('title') == '堆积图'){stackingdiagram(querydata);} + else if($(this).attr('title') == '累计图'){} + else if($(this).attr('title') == '分布图'){distributionmap(querydata)} + else if($(this).attr('title') == '饼状分布'){} + }else{ + // layer.msg('请先计算数据,在切换图表'); + } + + }); + + //堆积图 + function stackingdiagram(d){ + var xAxisData=[]; + for(let i in d){ + for(let z in d[i]['groups']){ + var pj = d[i]['event_name']+d[i]['groups'][z]; + xAxisData.push(pj); + } + } + var seriesData=[]; + for(let i in d){ + for(let z in d[i]['values']){ + var arr = { + name: '', + type: 'line', + stack: '总量', + areaStyle: {}, + emphasis: { + focus: 'series' + }, + data: d[i]['values'][z] + } + seriesData.push(arr); + } + } + if(xAxisData.length > 0){ + for(let i in seriesData){ + seriesData[i]['name'] = xAxisData[i]; + } + } + + var myChart = echarts.init(document.getElementById('analysis-echarts')); + var option = { + title: { + text: '' + }, + color: X.DATA.echartscolor, + tooltip: { + trigger: 'axis', + axisPointer: { + type: 'cross', + label: { + backgroundColor: '#6a7985' + } + } + }, + legend: { + type:'scroll', + data: xAxisData + }, + grid: { + left: '2%', + right: '2%', + bottom: '2%', + top: '10%', + containLabel: true + }, + xAxis: [ + { + type: 'category', + boundaryGap: false, + data: d[0]['date_range'] + } + ], + yAxis: [ + { + type: 'value' + } + ], + series: seriesData + }; + myChart.setOption(option,true); + }; + + //趋势图 + function trendchart(d){ + var xAxisData=[]; + for(let i in d){ + for(let z in d[i]['groups']){ + var pj = d[i]['event_name']+d[i]['groups'][z]; + xAxisData.push(pj); + } + } + var seriesData=[]; + for(let i in d){ + for(let z in d[i]['values']){ + var arr = { + name: '', + type: 'line', + data: d[i]['values'][z] + } + seriesData.push(arr); + } + } + if(xAxisData.length > 0){ + for(let i in seriesData){ + seriesData[i]['name'] = xAxisData[i]; + } + } + console.log(xAxisData) + console.log(seriesData) + console.log(d[0]['date_range']); + var myChart = echarts.init(document.getElementById('analysis-echarts')); + var option = { + title: { + text: '' + }, + color: X.DATA.echartscolor, + tooltip: { + trigger: 'axis', + axisPointer: { + type: 'cross', + label: { + backgroundColor: '#6a7985' + } + } + }, + legend: { + type:'scroll', + data: xAxisData + }, + // toolbox: { + // feature: { + // saveAsImage: {} + // } + // }, + grid: { + left: '2%', + right: '2%', + bottom: '2%', + top: '10%', + containLabel: true + }, + xAxis: [ + { + type: 'category', + boundaryGap: false, + data: d[0]['date_range'] + } + ], + yAxis: [ + { + type: 'value' + } + ], + series: seriesData + }; + myChart.setOption(option,true); + }; + + //分布图 + function distributionmap(d){ + var legendData =[]; + var xAxisData=[]; + var seriesData=[]; + if(jQuery.isEmptyObject(d[0]["groups"])){ + for(let i in d){ + xAxisData.push(d[i]['event_name']); + legendData.push(d[i]['event_name']); + var num =0; + for(let j in d[i]['values'][i]){ + num = num + d[i]['values'][i][j] + } + var arr = { + name: d[i]['event_name'], + type: 'bar', + barWidth : 30, + data: [], + } + arr['data'].push(num); + seriesData.push(arr); + } + + }else { + for(let i in d){ + xAxisData.push(d[i]['event_name']); + for(let j in d[i]['groups']){ + var num =0; + for(let z in d[i]['values'][j]){ + num = parseFloat(num) + parseFloat(d[i]['values'][j][z]) + } + if(i > 0){ + for(let q in seriesData){ + if(d[i]['groups'][j] == seriesData[q]['name']){ + seriesData[q]['data'].push(num); + }else { + var arr = { + name: d[i]['groups'][j], + type: 'bar', + barWidth : 30, + data: [], + } + arr['data'].push(num); + seriesData.push(arr); + } + } + }else { + var arr = { + name: d[i]['groups'][j], + type: 'bar', + barWidth : 30, + data: [], + } + arr['data'].push(num); + seriesData.push(arr); + } + + + } + } + } + // for(let i in d){ + // for(let z in d[i]['groups']){ + // var pj = d[i]['event_name']+d[i]['groups'][z]; + // xAxisData.push(pj); + // } + // } + // var seriesData=[]; + // for(let i in d){ + // for(let z in d[i]['values']){ + // var arr = { + // name: '', + // type: 'bar', + // data: d[i]['values'][z] + // } + // seriesData.push(arr); + // } + // } + // if(xAxisData.length > 0){ + // for(let i in seriesData){ + // seriesData[i]['name'] = xAxisData[i]; + // } + // } + // return; + var myChart = echarts.init(document.getElementById('analysis-echarts')); + var option = { + tooltip: { + trigger: 'axis', + axisPointer: { + type: 'shadow' + } + }, + color: X.DATA.echartscolor, + legend: { + data: legendData + }, + grid: { + left: '2%', + right: '2%', + bottom: '2%', + top: '10%', + containLabel: true + }, + xAxis: [ + { + type: 'category', + axisTick: {show: false}, + data: xAxisData + } + ], + yAxis: [ + { + type: 'value' + } + ], + series: seriesData + }; + myChart.setOption(option,true); + }; + + //表格 + function tabledata(d){ + var titledata,condata=[]; + for(let i in d){ + titledata= $.extend(true,[],d[0]['date_range']) ; + if(d[i]['groups']['length'] != 0){ + titledata.unshift('指标','分组','阶段总和'); + for(let j in d[i]['values']){ + var arr; + arr = $.extend(true,[],d[i].values[j]); + arr.unshift(d[i]['event_name'],d[i]['sum'][j]); + condata.push(arr); + } + for(let j in condata){ + condata[j].splice(1,0,d[i]['groups'][j]); + } + + }else { + titledata.unshift('指标','阶段总和'); + var arr; + arr = $.extend(true,[],d[i].values[0]) + arr.unshift(d[i]['event_name'],d[i]['sum'][0]); + condata.push(arr); + } + } + X.laytpldata("#table-fenxi-th-dot",titledata,".table-fenxi-th"); + X.laytpldata("#table-fenxi-td-dot",condata ,".table-fenxi-td"); + }; + + function calculationdata(){ + var dataArr = { + eventView: data.eventView, + events: data.events + } + X.api("ck/event_model","post",dataArr,function(d){ + querydata = d; + if(d.length > 0){ + if(d[0].values.length > 0 ){ + updata(); + tabledata(d); + }else { + $("#analysis-echarts").empty(); + layer.msg("无数据"); + } + }else { + $("#analysis-echarts").empty(); + layer.msg("无数据"); + } + + }) + }; + + function updata(){ + var tit = $(".select-chart").attr("title"); + if(tit == '趋势图'){trendchart(querydata)} + else if(tit == '堆积图'){stackingdiagram(querydata);} + else if(tit == '累计图'){} + else if(tit == '分布图'){distributionmap(querydata)} + else if(tit == '饼状分布'){} + }; + + // 保存报表 + $(document).off('click','.analysis-savereport').on('click','.analysis-savereport',function(){ + if(baobiaodata != '' && baobiaodata != undefined && baobiaodata != null){ + X.parametersopen(baobiaodata,'savereport','auto'); + }else{ + X.parametersopen(data,'savereport','auto'); + } + }); + + // 下载 + $(document).off('click','.download-table').on('click','.download-table',function(){ + // console.log(11111); + X.download('ck/event_model_export',data,'事件分析'); + }); + + // 返回 + $(document).off('click','.analysis-fanhui').on('click','.analysis-fanhui',function(){ + X.gourl("dashboard"); + // return; + }); + + }, + + // 保存报表 + // savereport:function(d){ + + // } + + }; +})(); + + diff --git a/web/srczip/logic/analysis.js b/web/srczip/logic/analysis.js index a5322c7..6900faf 100644 --- a/web/srczip/logic/analysis.js +++ b/web/srczip/logic/analysis.js @@ -295,6 +295,7 @@ var index = obj.attr("data-index"); var indexs = obj.attr("data-indexs"); X.querycriteriapop(defaultgroupdata,'category',offset.left,offset.top+obj.height(),function(val){ + console.log(val); var htmlstring = val.title; obj.html(htmlstring); // filtersymbols[index][indexs] = val.category; @@ -302,6 +303,11 @@ data['events'][index]['filts'][indexs]['columnName'] = val.id; data['events'][index]['filts'][indexs]['data_type'] = val.type; data['events'][index]['filts'][indexs]['tableType'] = val.table_type; + if(val.type == 'user_label'){ + data['events'][index]['filts'][indexs]['comparator_name'] = "是"; + data['events'][index]['filts'][indexs]['comparator'] = 'in'; + } + X.laytpldata("#analysis-con-left-screen-list-dot",data.events,".analysis-con-left-screen-list-box"); }) }); @@ -715,6 +721,12 @@ data['eventView']['filts'][index]['comparator'] = '=='; data['eventView']['filts'][index]['tableType'] = val.table_type; filtsftvdata[index]=val.category; + + if(val.type == 'user_label'){ + data['eventView']['filts'][index]['comparator_name'] = "是"; + data['eventView']['filts'][index]['comparator'] = 'in'; + } + X.laytpldata("#analysis-overall-situation-list-box-dot",data['eventView']['filts'],".analysis-overall-situation-list-box",function(){ renderdate(); }); @@ -1056,12 +1068,12 @@ for(let j in d[i]['values']){ var arr; arr = $.extend(true,[],d[i].values[j]); - arr.unshift(d[i]['event_name'],d[i]['sum'][j]); + arr.unshift(d[i]['event_name'],d[i]['groups'][j],d[i]['sum'][j]); condata.push(arr); } - for(let j in condata){ - condata[j].splice(1,0,d[i]['groups'][j]); - } + // for(let j in condata){ + // condata[j].splice(1,0,d[i]['groups'][j]); + // } }else { titledata.unshift('指标','阶段总和'); diff --git a/web/srczip/logic/dashboard.js b/web/srczip/logic/dashboard.js index 174f4f2..e20c379 100644 --- a/web/srczip/logic/dashboard.js +++ b/web/srczip/logic/dashboard.js @@ -833,6 +833,8 @@ } //数据根据时间降序排列 if(d['ascending']){ + // console.log() + console.log(eventdata); var condatalength = eventdata[0]['condata'].length; var condataascend=[]; for(var i = condatalength - 1; i >= 0; i--){ diff --git a/web/srczip/logic/distribution.js b/web/srczip/logic/distribution.js index cd5b493..d061c06 100644 --- a/web/srczip/logic/distribution.js +++ b/web/srczip/logic/distribution.js @@ -258,6 +258,10 @@ data['events'][index]['filts'][indexs]['columnName'] = val.id; data['events'][index]['filts'][indexs]['data_type'] = val.type; data['events'][index]['filts'][indexs]['tableType'] = val.table_type; + if(val.type == 'user_label'){ + data['events'][index]['filts'][indexs]['comparator_name'] = "是"; + data['events'][index]['filts'][indexs]['comparator'] = 'in'; + } X.template("userpar","userpar-event",data['events']); }) }); diff --git a/web/srczip/logic/ltvmodel.js b/web/srczip/logic/ltvmodel.js index 0255b58..c8ae9c4 100644 --- a/web/srczip/logic/ltvmodel.js +++ b/web/srczip/logic/ltvmodel.js @@ -135,6 +135,10 @@ data['eventView']['filts'][index]['comparator_name'] = '等于'; data['eventView']['filts'][index]['comparator'] = '=='; data['eventView']['filts'][index]['table_type'] = val.table_type; + if(val.type == 'user_label'){ + data['eventView']['filts'][index]['comparator_name'] = "是"; + data['eventView']['filts'][index]['comparator'] = 'in'; + } X.template("globalfilter","xinwei-whole",data['eventView']['filts'],function(){ renderdate(); }); diff --git a/web/srczip/logic/modeltable.js b/web/srczip/logic/modeltable.js index a46ddaa..20fe71e 100644 --- a/web/srczip/logic/modeltable.js +++ b/web/srczip/logic/modeltable.js @@ -12,14 +12,19 @@ // var oldcondata = data.condata; // var newcondata = []; - // for(let i in oldcondata){ - // var condataArr = {}; - // for(let j in oldcondata[i]){ - // condataArr['name'+j] = oldcondata[i][j]; + // if(data.cat == 'event' || data.cat == "ltv"){ + // for(let i in oldcondata){ + // var condataArr = {}; + // for(let j in oldcondata[i]){ + // condataArr['name'+j] = oldcondata[i][j]; + // } + // newcondata.push(condataArr); // } - // newcondata.push(condataArr); - // } + // }else if(data.cat == "retention" || data.cat == "scatter"){ + // console.log(oldcondata); + // }else if(data.cat == "user_property"){ + // } // var headdata = []; // for(let i in data.titledata){ // var arr = { diff --git a/web/srczip/logic/retained.js b/web/srczip/logic/retained.js index 295db86..3abdd3e 100644 --- a/web/srczip/logic/retained.js +++ b/web/srczip/logic/retained.js @@ -244,7 +244,15 @@ data['events'][index]['filts'][indexs]['columnName'] = val.id; data['events'][index]['filts'][indexs]['data_type'] = val.type; data['events'][index]['filts'][indexs]['tableType'] = val.table_type; - + if(val.type == 'user_label'){ + data['events'][index]['filts'][indexs]['comparatorName'] = "是"; + data['events'][index]['filts'][indexs]['comparator'] = 'in'; + } + if(index == 0){ + X.template("event","initial-event",data['events'][0]); + }else { + X.template("returnvisitevent","returnvisit-event",data['events'][1]); + } }) }); @@ -331,6 +339,12 @@ data['eventView']['filts'][index]['comparator'] = '=='; data['eventView']['filts'][index]['tableType'] = val.table_type; filtsftvdata[index]=val.category; + + if(val.type == 'user_label'){ + data['eventView']['filts'][index]['comparator_name'] = "是"; + data['eventView']['filts'][index]['comparator'] = 'in'; + } + X.template("globalfilter","xinwei-whole",data['eventView']['filts'],function(){ renderdate(); }); diff --git a/web/srczip/logic/userlabel.js b/web/srczip/logic/userlabel.js new file mode 100644 index 0000000..fc78777 --- /dev/null +++ b/web/srczip/logic/userlabel.js @@ -0,0 +1,68 @@ +(function(){ + X.pageLogic['userlabel'] = { + init : function(parms){ + var me = this; + me.userlabellist(); + $(document).off('click','.lable-dingyi').on('click','.lable-dingyi',function(){ + X.gourl('userlabel_dy','conetnt'); + }); + + $(document).off('click','.addlabeldata').on('click','.addlabeldata',function(){ + X.DATA.userlabelid = ""; + X.gourl('userlabel_dy','conetnt'); + }); + + $(document).off('click','.lable-del').on('click','.lable-del',function(){ + var _id = X.DATA.userlabelid; + layer.confirm('确认删除选中的标签吗？该操作不可恢复', { + btn: ['取消','删除 '] //按钮 + }, function(){ + //取消 + layer.close(layer.index); + }, function(){ + //删除 + X.api("user_label/del",'post',{label_id: _id},function(d){ + layer.msg('删除成功'); + layer.close(layer.index); + me.userlabellist(); + }) + }); + }); + + // X.api('user_label/read','post',{project_id: X.DATA.projectid},function(d){ + // console.log(d); + // }) + + // 监听单行事件 + layui.table.on('row(userlabeltest)',function(obj){ + var data = obj.data + console.log(data); + X.DATA.userlabelid = data._id; + X.laytpldata('#userlabel-right-box-dot',data,'.userlabel-right-box'); + }); + + + }, + userlabellist : function(){ + X.laytabledata("#userlabel-table","user_label/list",[[ + {field:'cluster_name', title: '标签名', sort: true} + ,{field:'display_name', title: '显示名'} + ,{field:'act_name', title: '最后操作人'} + ,{field:'cluster_type', title: '创建方式',templet:function(d){ + if(d.cluster_type == "user_custom"){ + return '自定义条件' + }else{ + return '其他条件' + } + }} + // ,{fixed: 'right', title:'操作', toolbar: '#eventattradminbarDemo', width:80} + ]],"&project_id="+X.DATA.projectid,'auto',function(res, curr, count){ + // console.log(res); + if(res.data.length > 0){ + X.DATA.userlabelid = res.data[0]._id; + X.laytpldata('#userlabel-right-box-dot',res.data[0],'.userlabel-right-box'); + } + }); + } + }; +})(); diff --git a/web/srczip/logic/userlabel_dy.js b/web/srczip/logic/userlabel_dy.js new file mode 100644 index 0000000..d8b056d --- /dev/null +++ b/web/srczip/logic/userlabel_dy.js @@ -0,0 +1,240 @@ +(function(){ + X.pageLogic['userlabel_dy'] = { + init : function(parms){ + var me = this; + var _id = X.DATA.userlabelid; + + var data; + if(_id && _id != ""){ + X.api("user_label/detail","post",{label_id: _id},function(d){ + data = d; + $(".lablename").val(d.cluster_name); + $(".labledesc").val(d.display_name); + $(".labeldes").val(d.remarks); + updatalable(); + }) + }else { + data = { + "project_id": X.DATA.projectid, + "cluster_name": "", + "display_name": "", + "cluster_type":'user_custom', + "qp": { + "tagRemark": "", + "tagValue": "", + "user_cluster_def": { + 'event_relation':'and', + "event_user_relation":"and", + "events": [ + + ], + "filts": [], + "relation": "and" + }, + }, + "remarks": "" + }; + } + + + // 标签值定义 + var choicelabellist=[ + {'title':'做过（没做过事件）',id:'0'}, + {'title':'用户属性满足',id:'1'} + ]; + X.laydropdown('.choicelabel',choicelabellist,function(e){ + console.log(e); + var arr = {}; + if(e.id == 0){ + arr= { + endTime: "", + eventDesc: dataArr[0]['category'][0].event_desc, + event_name: dataArr[0]['category'][0].event_name, + eventType: "event", + filts: [], + num: "", + e_days:0, + s_days:7, + relation: "and", + startTime: "", + uce_calcu_symbol: "==", + uce_calcu_symbolDesc: "等于", + prop_quota: {analysis: '', analysisDesc: '', quota: retdata[0]['id'], quotaDesc: retdata[0]["title"],quota_type: null}, + is_touch: true, + } + data['qp']['user_cluster_def']['events'].push(arr); + }else { + arr = { + calcuSymbol: "C01", + columnDesc: "", + columnName: "lv", + columnType: "double", + filterType: "SIMPLE", + ftv: ["10"], + selectType: "number", + tableType: "1", + timeRelative: "", + timeUnit: "" + } + data['qp']['user_cluster_def']['filts'].push(arr); + } + + updatalable(); + }); + + $(document).off('click','.userlabel-dy-head-userlabel').on('click','.userlabel-dy-head-userlabel',function(){ + X.gourl('userlabel','conetnt'); + }); + + $(document).off("click",'.ta-isDone').on("click",'.ta-isDone',function(){ + var index = $(this).attr("data-index"); + data['qp']['user_cluster_def']['events'][index]['is_touch'] = !data['qp']['user_cluster_def']['events'][index]['is_touch']; + updatalable(); + }); + + var dataArr = [],retdata = [],props=[],defaultgroupdata=[],filter_map=[],quotas_map=[]; + + X.api("data_auth/my_event","get",{},function(d){ + + dataArr = d; + X.api("data_auth/load_prop_quotas","post",{event_name:dataArr[0]['category'][0]['event_name']},function(d){ + retdata = d.staid_quots.concat(d.props); + props = d.props; + + X.api("data_auth/load_filter_props","post",{event_name:dataArr[0]['category'][0]['event_name']},function(val){ + defaultgroupdata = val; + + X.api("data_auth/filter_map","get",{},function(d){ + filter_map = d; + + X.api('data_auth/quotas_map',"get",{},function(d){ + quotas_map = d; + + }) + + }) + + }) + }) + }); + + $(document).off("click",'.my-event-data').on('click','.my-event-data',function(){ + var obj = $(this); + var offset = obj.offset(); + var index = obj.attr('data-index'); + X.querycriteriapop(dataArr,'setgrouping',offset.left,offset.top+obj.height(),function(val){ + console.log(val); + data['qp']['user_cluster_def']['events'][index]['eventDesc'] = val.id; + data['qp']['user_cluster_def']['events'][index]['event_name'] = val.name; + updatalable(); + }) + }); + + var label_time_index; //点击修改日期的index; + $(document).off('click','.time-days-box').on("click",'.time-days-box',function(){ + var index = $(this).attr("data-index"); + label_time_index = index; + }); + + function updatalable(){ + X.laytpldata('#userlabel-json-box-dot',data['qp']['user_cluster_def'],'.userlabel-json-box'); + + X.daterender(".time-days-box",function(start, end, label){ + var startTime = start.format('YYYY-MM-DD')+ " "+ "00:00:00"; + var endTime = end.format('YYYY-MM-DD')+ " "+ "23:59:59"; + data['qp']['user_cluster_def']['events'][label_time_index]['startTime'] = startTime; + data['qp']['user_cluster_def']['events'][label_time_index]['endTime'] = endTime; + var sameday = Date.parse(new Date()) / 1000; //当天时间戳 + + var enddate = new Date(end.format('YYYY-MM-DD')); + var endmonth = Date.parse(enddate)/1000; + + var startdate = new Date(start.format('YYYY-MM-DD')); + var startmonth = Date.parse(startdate)/1000; + data['qp']['user_cluster_def']['events'][label_time_index]['e_days'] = parseInt((sameday - endmonth)/86400); + data['qp']['user_cluster_def']['events'][label_time_index]['s_days'] = parseInt((sameday - startmonth)/86400); + updatalable(); + }) + }; + + $(document).off("click",'.load_prop_quotas_data').on('click','.load_prop_quotas_data',function(){ + var obj = $(this); + var offset = obj.offset(); + var index = obj.attr('data-index') + X.parametersopen(retdata,'dropdownlist',[offset.top+obj.height(),offset.left],function(val){ + console.log(val); + data['qp']['user_cluster_def']['events'][index]['prop_quota']['quotaDesc'] = val.title; + data['qp']['user_cluster_def']['events'][index]['prop_quota']['quota_type'] = val.data_type; + if(val.data_type == null){ + data['qp']['user_cluster_def']['events'][index]['prop_quota']['quota'] = val.analysis; + }else { + data['qp']['user_cluster_def']['events'][index]['prop_quota']['quota'] = val.id; + } + updatalable(); + }); + }); + + $(document).off("click",'.analysis-data-box').on('click','.analysis-data-box',function(){ + var obj = $(this); + var offset = obj.offset(); + var index = obj.attr('data-index'); + var type = obj.attr('data-type'); + X.parametersopen(quotas_map[type],'dropdownlist',[offset.top+obj.height(),offset.left],function(val){ + console.log(val); + data['qp']['user_cluster_def']['events'][index]['prop_quota']['analysisDesc'] = val.title; + data['qp']['user_cluster_def']['events'][index]['prop_quota']['analysis'] = val.id; + updatalable(); + }) + }); + + $(document).off('click','.uce_calcu_symbol_box').on('click','.uce_calcu_symbol_box',function(){ + var obj = $(this); + var index = obj.attr("data-index"); + var offset = obj.offset(); + X.parametersopen(X['DATA']['search']['condition2'],'dropdownlist',[offset.top+obj.height(),offset.left],function(val){ + console.log(val); + data['qp']['user_cluster_def']['events'][index]['uce_calcu_symbolDesc'] = val.title; + data['qp']['user_cluster_def']['events'][index]['uce_calcu_symbol'] = val.id; + updatalable(); + }) + }); + + $(document).off("change",'.lable-input-box input').on('change','.lable-input-box input',function(){ + var obj = $(this); + var index = obj.attr("data-index"); + console.log(index); + var text = obj.val(); + data['qp']['user_cluster_def']['events'][index]['num'] = text; + }); + + $(document).off('click','.action-icon-events-del').on('click','.action-icon-events-del',function(){ + var obj = $(this); + var index = obj.attr("data-index"); + data['qp']['user_cluster_def']['events'].splice(index,1); + updatalable(); + }); + + $(document).off("click",'.userlabel-dy-baocun').on("click",".userlabel-dy-baocun",function(){ + var lablename = $(".lablename").val(); + var labledesc = $(".labledesc").val(); + var labeldes = $(".labeldes").val(); + if(lablename == ""){ + layer.msg("请填写标签名"); + return; + } + if(labledesc == ""){ + layer.msg("请填写显示名"); + return; + } + data['cluster_name'] = lablename; + data['display_name'] = labledesc; + data['remarks'] = labeldes; + X.api('user_label/save','post',data,function(d){ + console.log(d); + layer.msg("添加成功"); + }) + }); + + } + }; +})(); \ No newline at end of file diff --git a/web/static/css/analysis.css b/web/static/css/analysis.css index 2565c98..4a3b1af 100644 --- a/web/static/css/analysis.css +++ b/web/static/css/analysis.css @@ -236,6 +236,9 @@ .analysis-overall-situation-box { display: flex; } .analysis-overall-situation-list { padding: 8px 0; display: flex; align-items: center; margin-top: 8px; flex-wrap: wrap; } .analysis-overall-situation-list div { text-align: center; margin-left: 8px; border:1px solid #f0f2f5; background-color: #fff; color: #67729d; padding: 0 6px; display: inline-block; min-width: 40px; height: 28px; font-size: 13px; line-height: 29px; border-radius: 2; cursor: pointer; } +.analysis-overall-situation-input { text-align: center; margin-left: 8px; border:1px solid #f0f2f5; background-color: #fff; color: #67729d; padding: 0 6px; display: inline-block; min-width: 40px; height: 28px; font-size: 13px; line-height: 29px; border-radius: 2; cursor: pointer; } +.analysis-overall-situation-input3 { text-align: center; margin-left: 8px; border:1px solid #f0f2f5; background-color: #fff; color: #67729d; padding: 0 6px; display: inline-block; min-width: 40px; height: 28px; font-size: 13px; line-height: 29px; border-radius: 2; cursor: pointer; } +.analysis-overall-situation-input3 input { border: 0px; height: 27px; } .analysis-overall-situation-input input { border: 0px; height: 27px; } .analysis-overall-situation-input2 input{ border: 0px; height: 27px; width: 50px; padding: 0 6px; color: #67729d; } .analysis-overall-situation-left-box { width: 24px; position: relative; margin-left: 4px;} diff --git a/web/static/css/mmGrid.css b/web/static/css/mmGrid.css new file mode 100644 index 0000000..089a18f --- /dev/null +++ b/web/static/css/mmGrid.css @@ -0,0 +1,353 @@ + +.mmGrid{ + position: relative; + overflow: hidden; + background: #fff; + border: 1px solid #ccc; + text-align: left; +} + +.mmGrid table{ + border-collapse: separate; + border-spacing: 0; + text-align: left; + +} + +.mmGrid input[type="radio"], +.mmGrid input[type="checkbox"]{ + margin: 0; +} + +/* 遮罩 */ +.mmGrid .mmg-mask{ + position: absolute; + left: 0; + top: 0; + display: none; + width: 100%; + height: 100%; + background: #ddd; + + +} + +/* 半透明 */ +.mmGrid .mmg-transparent{ + /* IE 8 */ + -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; + /* IE 5-7 */ + filter: alpha(opacity=50); + /* Netscape */ + -moz-opacity: 0.5; + /* Safari 1.x */ + -khtml-opacity: 0.5; + /* Good browsers */ + opacity: 0.5; +} + +/* loading */ +.mmGrid .mmg-loading{ + position: absolute; + display: none; + text-align: center; + +} + +.mmGrid .mmg-loading .mmg-loadingImg{ + margin: 5px auto; + width: 32px; + height: 32px; + background: url(img/loading.gif) no-repeat center center; +} + +.mmGrid .mmg-loading .mmg-loadingText{ + +} + +/* 标题包装 */ +.mmGrid .mmg-headWrapper{ + position: relative; + overflow: hidden; + width: 9999px; + + background: #eee; /* Old browsers */ + background: -moz-linear-gradient(top, #f9f9f9 0%, #eaeaea 100%); /* FF3.6+ */ + background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f9f9f9), color-stop(100%,#eaeaea)); /* Chrome,Safari4+ */ + background: -webkit-linear-gradient(top, #f9f9f9 0%,#eaeaea 100%); /* Chrome10+,Safari5.1+ */ + background: -o-linear-gradient(top, #f9f9f9 0%,#eaeaea 100%); /* Opera 11.10+ */ + background: -ms-linear-gradient(top, #f9f9f9 0%,#eaeaea 100%); /* IE10+ */ + background: linear-gradient(to bottom, #f9f9f9 0%,#eaeaea 100%); /* W3C */ + filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f9f9f9', endColorstr='#eaeaea',GradientType=0 ); /* IE6-8 */ + + -moz-box-shadow: 0 0px 2px #bbb; + -webkit-box-shadow: 0 0px 2px #bbb; + box-shadow: 0 0px 2px #bbb; + /* border-top: 2px solid #b00; */ + z-index: 1; + +} + +/* 标题 */ +.mmGrid .mmg-headWrapper .mmg-head{ + position: relative; +} + +.mmGrid .mmg-headWrapper .mmg-head th{ + position: relative; + padding: 0 5px; + border-right: 1px solid #ddd; + /* border-bottom: 1px solid #d2d2d2; */ + overflow: hidden; + background-color: #f0f2f5; +} + +.mmGrid .mmg-headWrapper .mmg-head th.mmg-groupCol{ + /* 分组列 */ +} + +.mmGrid .mmg-headWrapper .mmg-head th input{ + height: 2em; +} + +.mmGrid .mmg-headWrapper .mmg-head th .mmg-titleWrapper{ + position: relative; + height: 2em; +} + +.mmGrid .mmg-headWrapper .mmg-head th .mmg-titleWrapper .mmg-colResize{ + position: absolute; + top: 0; + right: -6px; + _right: -4px; + width: 4px; + height: 100%; + cursor: col-resize; +} + +.mmGrid .mmg-headWrapper .mmg-head th .mmg-titleWrapper .mmg-title{ + display: inline-block; + *display: inline; + *zoom: 1; + height: 2em; + font-weight: initial; + line-height: 2; + vertical-align: top; + color: #202d3f !important; +} + +.mmGrid .mmg-headWrapper .mmg-head th .mmg-titleWrapper .mmg-canSort{ + cursor: pointer; + text-decoration: underline; +} + +.mmGrid .mmg-headWrapper .mmg-head th .mmg-titleWrapper .mmg-sort{ + overflow: hidden; + display: none; + width: 7px; + height: 2em; + margin-left: 2px; + vertical-align: top; +} + +.mmGrid .mmg-headWrapper .mmg-head th .mmg-titleWrapper .mmg-asc{ + display: inline-block; + *display: inline; + *zoom: 1; + background: url(img/sort-asc.png) no-repeat center center; +} + +.mmGrid .mmg-headWrapper .mmg-head th .mmg-titleWrapper .mmg-desc{ + display: inline-block; + *display: inline; + *zoom: 1; + background: url(img/sort-desc.png) no-repeat center center; +} + +.mmGrid .mmg-colResizePointer{ + position: absolute; + top: 0; + left: 0; + display: none; + width: 1px; + height: 100%; + background: #999; + cursor: col-resize; + z-index: 1; +} + +.mmGrid .mmg-colResizePointer-before{ + position: absolute; + top: 0; + left: 0; + display: none; + width: 1px; + height: 100%; + background: #999; + cursor: col-resize; + z-index: 1; +} + +/* 背板 */ +.mmGrid .mmg-backboard{ + position: relative; + display: none; + background-image: url(img/furley_bg.png); + background-image: -webkit-image-set( + url(img/furley_bg.png) 1x, + url(img/furley_bg_@2X.png) 2x + ); + -webkit-box-shadow: inset 0 0 2px 1px #d9d9d9; + -moz-box-shadow: inset 0 0 2px 1px #d9d9d9; + -o-box-shadow: inset 0 0 2px 1px #d9d9d9; + -ms-box-shadow: inset 0 0 2px 1px #d9d9d9; + box-shadow: inset 0 0 2px 1px #d9d9d9; + text-align: left; +} +.mmGrid .mmg-backboard h1{ + margin: 0 10px 5px 10px; + padding: 10px 0 5px 0; + font-size: 1em; + font-weight: bold; + line-height: 1.8; + border-bottom: 1px solid #ccc; +} + +.mmGrid .mmg-backboard label{ + display: inline-block; + *display: inline; + *zoom: 1; + width: 95px; + font-size: 1em; + line-height: 2.2; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; +} + +.mmGrid .mmg-backboard label input{ + margin: 0 5px 0 10px; + padding: 0px; + border: 0px; +} + +/* 内容包装器 */ +.mmGrid .mmg-bodyWrapper{ + position: relative; + overflow: auto; + width: 9999px; + min-height: 0%; /* fix IE9 hover bug see: http://jsfiddle.net/pjkix/86Lfv/ */ +} + +/* 内容 */ +.mmGrid .mmg-bodyWrapper .mmg-body{ + table-layout: fixed; +} + +.mmGrid .mmg-bodyWrapper .mmg-body tr{ + +} + +.mmGrid .mmg-bodyWrapper .mmg-body tr.even{ + background: #f9f9f9; +} + +.mmGrid .mmg-bodyWrapper .mmg-body td{ + padding: 0 5px; + border-right: 1px solid #e4e4e4; + border-bottom: 1px solid #e4e4e4; + line-height: 2; +} + +.mmGrid .mmg-bodyWrapper .mmg-body td.colSelected{ + background: #f7f7f7; +} + +.mmGrid .mmg-bodyWrapper .mmg-body td.colSelectedEven{ + background: #f5f5f5; +} + +.mmGrid .mmg-bodyWrapper .mmg-body tr.hover td{ + background: #e1eff8; +} + +.mmGrid .mmg-bodyWrapper .mmg-body tr:hover td{ + background: #e1eff8; +} + +.mmGrid .mmg-bodyWrapper .mmg-body tr.selected td{ + background: #fff5cc; +} + +.mmGrid .mmg-bodyWrapper .mmg-body td .mmg-index{ + color: #555; +} + +.mmGrid .nowrap{ + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + -o-text-overflow: ellipsis; + -ms-text-overflow: ellipsis; +} + +/* 消息 */ +.mmGrid .mmg-message{ + position: absolute; + display: none; + text-align: center; +} + +.mmGrid .mmg-btnBackboardDn{ + position: absolute; + top: 0; + right: 20px; + display: block; + width: 50px; + height: 20px; + background: #fff url(img/arrow_down.png) no-repeat center center; + border: 1px solid #ccc; + border-top: 0; + -webkit-border-radius: 2px; + -moz-border-radius: 2px; + border-radius: 2px; + -webkit-box-shadow: 1px 1px 3px #ccc; + -moz-box-shadow: 1px 1px 3px #ccc; + -o-box-shadow: 1px 1px 3px #ccc; + -ms-box-shadow: 1px 1px 3px #ccc; + box-shadow:1px 1px 3px #ccc; + cursor: pointer; +} + +.mmGrid .mmg-backboard .mmg-btnBackboardUp{ + position: absolute; + right: 20px; + bottom: 0; + display: block; + width: 50px; + height: 20px; + background: #fff url(img/arrow_up.png) no-repeat center center; + border: 1px solid #ccc; + border-bottom: 0; + -webkit-border-radius: 2px; + -moz-border-radius: 2px; + border-radius: 2px; + -webkit-box-shadow: 1px 1px 3px #ccc; + -moz-box-shadow: 1px 1px 3px #ccc; + -o-box-shadow: 1px 1px 3px #ccc; + -ms-box-shadow: 1px 1px 3px #ccc; + box-shadow:1px 1px 3px #ccc; + cursor: pointer; +} + + + + + + + + + + + + diff --git a/web/static/css/style.css b/web/static/css/style.css index 188f80f..0c60d33 100644 --- a/web/static/css/style.css +++ b/web/static/css/style.css @@ -686,5 +686,106 @@ label:not(.form-check-label):not(.custom-file-label) { font-weight: 400; } .save-list-but-box div{ cursor: pointer; background-color: #FF5722; color: #fff;width: 100%;height: 45px;line-height: 45px;text-align: center;margin: 0 8px;padding: 0 16px;font-weight: 400;font-size: 14px;text-shadow: none;border-radius: 2px; } .datacheck-table-box { margin: 40px 60px 40px 106px; overflow-x:auto; } +/* 用户标签 */ +.userlabel-box { width: 100%; background-color: #f0f2f5; height: calc(100% - 60px); position: fixed; top: 60px; left: 0; display: flex; } +.userlabel-left-box { margin: 24px; width: calc(100% - 312px - 48px); height: calc(100% - 48px); background-color: #fff; border-radius: 2px; } +.userlabel-right-box { width: 312px; background-color: #fff; height: calc(100% - 48px); margin-top: 24px; margin-right: 24px; border-radius: 2px; } +.userlabel-right { margin-top: 20px; height: calc(100% - 20px); overflow: hidden; } +.label-title-box { padding: 0 24px 24px 24px; border-bottom: 1px solid #e6e6e6; } +.label-box-title {font-size: 14px; color: #607595; font-weight: 500; } +.lable-title-name { font-size: 16px; color: #202d3f; font-weight: 500; margin-top: 4px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis } +.label-info-box { padding: 0px 24px; height: 56px; line-height: 56px; font-size: 14px; color: #42546d; font-weight: 500; cursor: pointer; display: flex; align-items: center; justify-content: space-between; } +.label-info-box:hover { color: #4fa1ff; } +.label-info-box-ov { width: 100%; overflow-y: auto; height:633px; background-color: #fff; } +.label-but-box { height: 48px; display: flex; justify-content: center; align-items: center; border-top: 1px solid #e6e6e6; color: #607595; } +.label-but-box div { display: flex;align-items: center;justify-content: center;width: 86px;height: 32px;cursor: pointer; } +.lable-dingyi:hover { color: #4fa1ff; } +.lable-gengxin:hover { color: #4fa1ff; } +.lable-del:hover { color: #ff5d5d; } +.label-info-box-ov-title { margin-top: 20px; padding: 0 24px; color: #42546d; font-weight: 500; font-size: 14px; } +.label-info-box-ov-del { display: -webkit-box;height: 65px;margin: 16px 24px 8px 24px;padding: 8px;overflow: hidden;color: #67729d;font-size: 12px;word-break: break-all;background-color: #fbfbfb;border-radius: 2px;-webkit-box-orient: vertical;-webkit-line-clamp: 2; } +.label-info-box-con { margin: 0 24px; display: flex; justify-content: space-between; align-items: center; height: 36px; color: #607595; } +.label-info-box-con-right { color: #42546d; font-size: 14px; text-align: right; } +.labelval-box { margin-top: 24px; padding: 0 24px 24px 24px; } +.labelval-title-box { color: var(--text-color); font-weight: 500; font-size: 16px; } +.labelval-list-box { } +.labelval-list-top { display: flex; align-items: center; justify-content: space-between; height: 20px; font-size: 12px; margin-top: 18px; color: #42546d;} +.labelval-list-slide-box { width: 100%; height: 4px; border-radius: 4px; background-color: #f6f7f9; margin-top: 10px;} +.labelval-list-slide { width: 80%; height: 4px; border-radius: 4px; background-color: #219af2; } + + +/* 用户标签定义 */ +.userlabel-dy-box { width: 100%; height: 100%; background-color: #f0f2f5; position: fixed; } +.userlabel-dy-head-box { height: 50px; padding: 0 36px; line-height: 50px; background-color: #fff; margin-top: 60px; font-size: 16px; font-weight: 500; color: #42546d;} +.userlabel-dy-head-box span{ color: #888; } +.userlabel-dy-content-box { max-width: 1650px; margin: 0 auto; padding: 25px 23px 50px;} +.userlabel-dy-content-box2 { display: flex; justify-content: center; align-items: flex-start; font-size: 14px; } +.userlabel-dy-left-box { width: 321px; background-color: #fff; height: 346px; padding: 20px 0; margin-right: 24px;} +.userlabel-dy-left-title { padding: 0 24px 17px 24px; color: #202d3f; font-weight: 500; font-size: 14px; border-bottom: 1px solid #f0f2f5; } +.userlabel-dy-left-item { margin-top: 32px; padding: 0 24px; } +.userlabel-dy-left-item p { font-weight: 400; font-size: 14px; color: #607595; } +.userlabel-dy-left-item input { color: rgba(0, 0, 0, 0.25); background-color: #f5f5f5; width: 258px; padding: 0 8px; margin-top: 10px; font-size: 14px; height: 32px; line-height: 30px; border: 1px solid var(--light-split-color); border-radius: 2px; transition: all 0.3s;} +.userlabel-dy-left-item textarea{ width: 258px; margin-top: 10px; font-size: 14px; background-color: #fff; line-height: 24px; min-height: 32px; padding: 0 8px; border: 1px solid #f0f0f0; border-radius: 2px; resize: none; } +.userlabel-dy-right-box { width: 1268px; padding-bottom: 20px;} +.userlabel-dy-right-head-box div{ padding: 20px 24px 0 24px; color: #202d3f; font-weight: 500; font-size: 14px; } +.userlabel-dy-right-head-box p{ margin-top: 8px; padding: 0 24px 17px 24px; color: #67729d; font-size: 12px; border-bottom: 1px solid #f0f2f5; } +.userlabel-dy-right-title-box { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-start; padding: 0 24px; } +.userlabel-dy-right-title-box2 { display: flex; flex-wrap: wrap; width: 100%; margin-top: 24px; } +.userlabel-dy-right-title { width: 24%; height: 40px; line-height: 40px; text-indent: 14px; cursor: pointer; font-size: 14px; color: #67729d; margin-top: 8px; margin-right: 8px; color: #67729d; font-size: 14px; background-color: #fff; border: 1px solid #f0f0f0; border-radius: 2px; } +.userlabel-dy-right-title:hover { border: 1px solid #3d90ff; color: #3d90ff; } +.userlabel-dy-right-labelname-box { padding: 0 24px; } +.userlabel-dy-right-labelname-root { width: 100%; margin-top: 16px; padding: 8px 0; background-color: #fff; border-radius: 2px; } +.userlabel-dy-right-labelname-root-item { display: flex; align-items: flex-start; justify-content: flex-start; padding: 16px 0; } +.userlabel-dy-right-labelname-root-item-input { width: 100%; font-weight: 400; font-size: 14px; background-color: #fff; padding: 0 8px; color: #42546d; line-height: 30px; border-radius: 2px; } +.userlabel-dy-right-labelname-root-item-input input { width: 100%; height: 32px; border: 1px solid #f0f0f0; padding: 8px; } +.userlabel-dy-right-labelname-root-item-input textarea { width: 100%; height: 64px; border: 1px solid #f0f0f0; resize: none; padding: 8px;} + +.userlabel-dy-right-labelname-root-item-title { display: inline-block; margin-top: 5px; white-space:nowrap; padding-right: 24px; color: #42546d; font-weight: 500; font-size: 14px; } +.choicelabel { margin-left: 24px; color: #42546d; font-size: 14px; cursor: pointer;} +.userlabel-json-box { padding: 0 0 0 80px; margin-top: 22px; } +.userlabel-json-relation-editor { position: relative; display: flex; width: 100%; } +.userlabel-json-relation-relation { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: flex-start; width: 24px; margin-right: 4px; } +.userlabel-json-relation-relation-line { position: absolute; top: 0; left: 12px; height: 100%; width: 1px; background-color: #d9dfe6; } +.userlabel-json-relation-relation-value { position: absolute;top: 50%;left: 0;width: 24px;height: 24px;margin-top: -12px;color: #3d90ff;font-size: 12px;line-height: 22px;text-align: center;background-color: #fff;border: 1px solid #d9dfe6;border-radius: 2px;cursor: pointer; } +.serlabel-json-relation-row { margin-bottom: 12px; } +.userlabel-json-eventRow { min-height: 40px; padding: 0 4px 0 8px; } +.userlabel-json-action-row { position: relative;display: flex;align-items: center;justify-content: space-between;width: 100%;min-height: 24px;line-height: 24px; align-items: center; justify-content: flex-start; min-height: 40px;} +.ta-editor-done-condition { display: flex; align-items: center; font-size: 14px; white-space: nowrap; color: #67729d;} +.ta-isDone { margin-right: 6px; font-weight: 500; text-decoration: underline; cursor: pointer; color: #42546d; } +.ta-editor-done-condition .ta-event-select { margin-left: 4px; } +.ta-event-select { display: inline-block;min-width: 40px;height: 28px;padding: 0 6px;font-size: 14px;line-height: 26px;white-space: nowrap;vertical-align: top;background-color: #fff;border: 1px solid #f0f2f5;border-radius: 2px;cursor: pointer; } +.ta-event-select-label { display: inline-block;max-width: 300px;overflow: hidden;color: #67729d;white-space: nowrap;text-overflow: ellipsis;vertical-align: top; } +.ta-bold { margin-left: 4px; font-weight: 500; } +.ta-editor-done-condition .ta-range-picker-label { margin-left: 4px; background-color: #fff; border-color: #f0f2f5; border: 1px solid #f0f2f5; } +.ta-range-picker-label { display: inline-block;min-width: 80px;height: 28px;padding: 0 8px;color: var(--widget-color);font-size: 14px;line-height: 26px;white-space: nowrap;background-color: #fff;border: 1px solid var(--light-split-color);border-radius: 2px;cursor: pointer; } +.ta-range-picker-span{ display: inline-block; } +.userlabel-json-action-right { margin-left: 16px; display: flex; align-items: center; opacity: 0; color: #67729d; } +.action-row .action-right .action-action { margin-left: 4px; } +.action-icon { display: inline-block;min-width: 24px;height: 24px;padding: 0 4px;line-height: 22px;text-align: center;background-color: transparent;border-radius: 2px;cursor: pointer; } +.userlabel-json-eventRow:hover { background-color: #f6f8fa; } +.userlabel-json-action-row:hover > .userlabel-json-action-right{opacity: 1;} +.userlabel-json-action-row:hover{ background-color: #f6f8fa; } +.action-icon-shax:hover { color: #3d90ff; background-color: #f0f2f5; } +.action-icon-del:hover { color: #ff5d5d; background-color: #f0f2f5; } +.ta-editor-done-condition .ta-analysis-select { margin-left: 4px; } +.ta-analysis-select { display: inline-block; height: 28px; vertical-align: top;} +.ta-editor-done-condition .done-condition-select { margin-left: 4px; color: var(--widget-color); font-size: 14px;} +.ant-select {box-sizing: border-box;margin: 0;padding: 0;color: rgba(0, 0, 0, 0.85);font-size: 14px;font-variant: tabular-nums;line-height: 1.5715;list-style: none;font-feature-settings: 'tnum', "tnum";position: relative;display: inline-block;cursor: pointer;} +.userlabel-json-but-box { display: flex; justify-content: flex-end; margin-top: 20px;} +.userlabel-json-but-box div { cursor: pointer; color: #fff; background-color: #3d90ff; border-color: #3d90ff; height: 20px; padding: 6px 12px; font-weight: 400; font-size: 14px; line-height: 20px; text-shadow: none; border-radius: 2px; box-shadow: none; } +.userlabel-dy-right-box-top { background-color: #fff; padding-bottom: 20px; } +.ta-multa-filter-condition { padding: 4px 0 0; } +.ta-property { margin-right: 6px; font: 14px; padding-top: 5px; } +.ta-property-select { margin: 2px 4px 0 0; min-width: 40px; height: 28px; padding: 0 6px; font-size: 14px; line-height: 26px; white-space: nowrap; vertical-align: top; border: 1px solid #f0f2f5; border-radius: 2px; cursor: pointer; } +.ta-property-select-label { display: inline-block;max-width: 180px;overflow: hidden;color: #67729d;white-space: nowrap;text-overflow: ellipsis;vertical-align: top; } +.ta-operator-select { margin: 2px 4px 0 0 ; vertical-align: top; } +.ta-operator-select .tant-select .ant-select-selector { height: 28px; padding: 0 6px; color: #67729d; border: 1px solid #f0f2f5;} +.ta-filter-condition .ta-equal-search { margin: 2px 0 0 0; vertical-align: top; } +.ta-filter-condition { display: flex; min-height: 32px; padding-bottom: 2px; white-space: normal; } +.userlabel-json-action-left { margin-left:8px; } +.ta-equal-search input{ width: 100px; padding: 0 10px; height: 28px; line-height: 28px; border: 1px solid #f0f2f5; } +.userlabel-json-relation-row { padding: 0 4px 0 8px; } +.ant-input-number input{ height: 28px; margin-left: 4px; padding: 0 8px; border: 1px solid #f0f2f5; width: 44px; color: #42546d; border-radius: 2px; } +.userlabel-dy-head-userlabel { color: #42546d !important; cursor: pointer; } diff --git a/web/static/img/iconfont/demo_index.html b/web/static/img/iconfont/demo_index.html index 2f05aff..a8e08dc 100644 --- a/web/static/img/iconfont/demo_index.html +++ b/web/static/img/iconfont/demo_index.html @@ -54,6 +54,48 @@