sriramphanib
/
WebBuild
Watch 1
Star 0
Fork 0
Code Issues 0 Pull Requests 0 Releases 0 Wiki Activity
Built files from Bizgaze WebServer
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
4 Commits
1 Branch
Tree: 1cf637698e
Branches Tags
${ item.name }
Create branch ${ searchTerm }
from '1cf637698e'
${ noResults }
WebBuild/wwwroot/platform/analytics/components/reportbuilder/reportbuilder.template.js

reportbuilder.template.js 105KB
History Raw

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395 
  1. var Unibase;

  2. (function (Unibase) {

  3.     let Platform;

  4.     (function (Platform) {

  5.         let Analytics;

  6.         (function (Analytics) {

  7.             let Reports;

  8.             (function (Reports) {

  9.                 class ReportBuilder_Template {

  10.                     loadDataListsTemplate() {

  11.                         let html = `<option value="{{Value}}"> {{SelectText}} </option>`;

  12.                         return html;

  13.                     }

  14.                     loadDataListColumnsTemplate() {

  15.                         let html = `<li class="dd-item dd3-item pt-5 pl-10 pr-5 li_{{ColumnId}}" id="li_{{ColumnId}}" style="list-style-type:none"> 

  16.                         <div class=""> <span id="ColDataType" class="hidden"> </span>

  17.                         <div class="dd3-content col-sm-12" id="Column_{{ColumnId}}" draggable="true">

  18.                         <div class="row"> 

  19.                         <small class="col-sm-2 mt-1" id="ColDataType_icon"> </small>

  20.                         <span class="pl-10 ColumnName" title="{{ColumnName}}"> <span> {{TrimmedColumnName}} </span> </span>

  21.                         <input type="text" class="DisplayText col-sm-3 p-0 hidden" onkeyup="ReportBuilder.Instance().tableAliasName({{ColumnId}},'{{ColumnName}}')">

  22.                         <span class="pl-30 col-sm-2 Aggregation hidden"> 

  23.                         <select class="border-light border-3 AggrFunc" id="cmbAggrFuncDraggedList_{{ColumnId}}" onchange="ReportBuilder.Instance().changeAggregation({{ColumnId}},'{{ColumnName}}')" style="width:90px;"></select></span> 

  24.                         <span class="col-sm-1 Options text-right hidden">

  25.                         <a class="pa-0 dropdown-toggle no-caret" data-toggle="dropdown" onclick="">

  26.                         <i class="fa fa-ellipsis-v"></i></a> <div class="dropdown-menu dropdown-menu-right">	

  27.                         <a class="dropdown-item" href="javascript:;" onclick="ReportBuilder.Instance().showOrHideColumnsInTable({{ColumnId}},'{{ColumnName}}')">

  28.                         <i class="dropdown-icon fa fa-eye-slash" id="DropDown_Eye_EyeSlash"></i>

  29.                         <span id="ShowOrHideColumn">Hide Column</span> </a>

  30.                         <a class="dropdown-item " href="javascript:;"><i class="dropdown-icon zmdi zmdi-laptop-mac"></i>

  31.                         <span>Is Filterable</span></a><div class="dropdown-divider"></div>

  32.                         <div class="sub-dropdown-menu show-on-hover"><a href="javascript:;" class="dropdown-toggle dropdown-item no-caret">

  33.                         <i class="zmdi zmdi-swap-vertical"></i>Sort by </a>

  34.                         <div class="dropdown-menu open-left-side">

  35.                         <a class="dropdown-item" onclick="javascript: ReportBuilder.Instance().ascendingOrder({{ColumnId}},'{{ColumnName}}');" href="javascript:;">

  36.                         <i class="dropdown-icon zmdi zmdi-caret-up"></i><span>Ascending</span></a>

  37.                         <a class="dropdown-item" onclick="javascript: ReportBuilder.Instance().descendingOrder({{ColumnId}},'{{ColumnName}}');" href="javascript:;">

  38.                         <i class="dropdown-icon zmdi zmdi-caret-down"></i>	<span>Descending</span>	</a>

  39.                         </div></div></div> </span> 

  40.                         <span class="col-sm-1 text-right hidden" id="DeleteSelectedColumn">

  41.                         <a class="pa-0 dropdown-toggle no-caret" data-toggle="dropdown" onclick="ReportBuilder.Instance().deleteSelectedColumn({{ColumnId}},'{{ColumnName}}')">

  42.                         <i class="fa fa-close"></i></a>  </span>

  43.                         </div> </div> </div>

  44.                         </li>`;

  45.                         return html;

  46.                     }

  47.                     loadToolTipColumn(ColumnId, AliasName, DataType, DisplayText) {

  48.                         let tooltipHtml = `<div class="dsl-block datagroup inline-edit" id="dsl_tool_column_${AliasName}">

  49.                                             <span>

  50. 												<i class="las la-braille dragger hidden"></i>

  51.                                             <div class="dsl-block-name position-relative flex-grow-1 mw-100">

  52.                                             <input type="text" id="txttooltipedit" required="required" value="${DisplayText}" class="edit text-truncate" disabled>

  53.                                             <button type="reset" title="Click me to clear the input field" class="btn btn-icon btn-flush-biz-theme btn-rounded flush-soft-hover d-20 reset-text hidden reset-text hidden" onclick ="Unibase.Platform.Analytics.Charts.ChartBuilder.Instance().toolTipEdit('${AliasName}')"><span class="btn-icon-wrap"><i class="icon dripicons-cross"></i></span></button>

  54.                                             </div>

  55.                                                 </span>

  56.                                                 <span>

  57.                                                 <a class="btn btn-xs btn-icon btn-flush-dark btn-rounded flush-soft-hover inline-edit-btn text-dark" href="javascript:;"><span class="btn-icon-wrap">

  58.                                                     <span class="line-icon">

  59.                                                         <i class="las la-pen font-20"></i>

  60.                                                     </span>

  61.                                                 </span></a>

  62.                                                 <a class="btn btn-xs btn-icon btn-rounded dsl-block-close text-dark" href="javacript:;" onclick="Unibase.Platform.Analytics.Charts.ChartBuilder.Instance().removeSelectedToolTip('${AliasName}')"><span class="line-icon">

  63.                                                         <i class="las la-times font-18 mt-1"></i>

  64.                                                     </span></a></span>

  65.                                             </div></div>`;

  66.                         return tooltipHtml;

  67.                     }

  68.                     loadSelect2Column(ColumnId, ColumnName, DataType) {

  69.                         let Coordinathtml = "";

  70.                         let hiddenClass = '';

  71.                         if (Unibase.Platform.Analytics.Reports.ReportBuilder.Instance().reportType == Unibase.Platform.Analytics.Reports.Enums.ReportType.Chart)

  72.                             hiddenClass = 'd-none';

  73.                         Coordinathtml += `<div class="dsl-block datagroup column_${ColumnName}" id="dsl_column_${ColumnName}"><span><i class="las la-braille dragger"></i><span class="dsl-block-name">${ColumnName}</span></span><span>`;

  74.                         if (DataType == Unibase.Platform.Analytics.Reports.Enums.DataType.dateTime || Unibase.Platform.Analytics.Reports.Enums.DataType.decimal) {

  75.                             Coordinathtml += `<div class="dropdown dsl_column_filters"><span class="dropdown-toggle flush-soft-hover no-caret"  onclick="Unibase.Platform.Analytics.Reports.ReportBuilder.Instance().clickedTableCaret(` + ColumnId + `,'` + ColumnName + `',` + DataType + `)" data-toggle="dropdown" aria-expanded="false"><span class="btn-icon-wrap"><span class="line-icon"><i class="las la-ellipsis-v text-dark font-21"></i></span></span></span><ul class="dropdown-menu dropdown-menu-right dropdown-radio dropdown-menu-` + ColumnId + `"><li><h6 class="dropdown-header" href="javascript:;" >` + ColumnName + `</h6></li><div class="dropdown-divider"></div><li id="dropdown_Aggregation_` + ColumnName.replace(" ", "") + `"><div class="sub-dropdown-menu show-on-hover"><a class="dropdown-item" href="javascript:;" onclick=""><span id="AggregateOperation"> Aggregation </span></a><div class="dropdown-menu dropdown-radio"></div></div></li><li><a class="dropdown-item" href="javascript:;" onclick="Unibase.Platform.Analytics.Reports.ReportBuilder.Instance().IsFilterableColumn_table(` + ColumnId + `,'` + ColumnName + `')"><span id="IsFilterableColumn">IsFilterable<i class="dropdown-icon fa fa-check pull-right hidden text-primary"  id="DropDown_IsFilterable_` + ColumnName.replace(" ", "") + `"></i></span></a></li><li><a class="dropdown-item" href="javascript:;" onclick="Unibase.Platform.Analytics.Reports.ReportBuilder.Instance().IsPrimaryKey(` + ColumnId + `,'` + ColumnName + `')"><span id="IsPrimaryKeyColumn">IsPrimaryKey<i class="dropdown-icon fa fa-check pull-right hidden text-primary"  id="DropDown_IsPrimaryKey_` + ColumnName.replace(" ", "") + `"></i></span> </a></li><li><a class="dropdown-item" href="javascript:;" onclick="Unibase.Platform.Analytics.Reports.ReportBuilder.Instance().IsContactColumn(` + ColumnId + `,'` + ColumnName + `')"><span id="IsContactColumn" class="flex-between-center">IsContactColumn<i class="dropdown-icon fa fa-check pull-right hidden text-primary font-16"  id="DropDown_IsContactColumn_` + ColumnName.replace(" ", "") + `"></i></span></a></li><li id="ColumnFormat_` + ColumnName + `"><div class="sub-dropdown-menu show-on-hover"><a class="dropdown-item d-inline" href="javascript:;" onclick=""><span id="ColumnFormat">Date Format </span></a><div class="dropdown-menu dropdown-radio open-left-side dropdown-menu-scrollbar" style="max-height : 400px; overflow-y : scroll"></div></div></li><div class="dropdown-divider"></div><input type="text" class="form-control" id="displayText_` + ColumnName + `" value=` + ColumnName + ` onkeyup="Unibase.Platform.Analytics.Charts.ChartBuilder.Instance().updateSelect2DisplayText('displayText_` + ColumnName + `','dsl_column_` + ColumnName + `')"><div class="dropdown-divider"></div><li><a class="dropdown-item" href="javascript:;" onclick="Unibase.Platform.Analytics.Reports.ReportBuilder.Instance().showOrHideColumn_table(` + ColumnId + `,'` + ColumnName + `')"><span id="ShowOrHideColumn">Hide Column</span></a></li> <li><a class="dropdown-item link-danger ${hiddenClass}" href="javascript:;" onclick=""><span id="RemoveSelectedColumn" onclick="Unibase.Platform.Analytics.Reports.ReportBuilder.Instance().removeSelectedColumn_table(` + ColumnId + `,'` + ColumnName + `')"> Remove Column </span></a></li></ul></div>`;

  76.                         }

  77.                         else {

  78.                             Coordinathtml += `<div class="dropdown dsl_column_filters"><span class="dropdown-toggle flush-soft-hover no-caret"  onclick="Unibase.Platform.Analytics.Reports.ReportBuilder.Instance().clickedTableCaret(` + ColumnId + `,'` + ColumnName + `',` + DataType + `)" data-toggle="dropdown" aria-expanded="false"><span class="btn-icon-wrap"><span class="line-icon"><i class="las la-ellipsis-v text-dark font-21"></i></span></span></span><ul class="dropdown-menu dropdown-menu-right dropdown-radio dropdown-menu-` + ColumnId + `"><li><h6 class="dropdown-header">` + ColumnName + `</h6></li><div class="dropdown-divider"></div><li id="dropdown_Aggregation_` + ColumnName.replace(" ", "") + `"><div class="sub-dropdown-menu show-on-hover"><a class="dropdown-item" href="javascript:;" onclick=""><span id="AggregateOperation"> Aggregation </span></a><div class="dropdown-menu dropdown-radio"></div></div></li><li><a class="dropdown-item" href="javascript:;" onclick="Unibase.Platform.Analytics.Reports.ReportBuilder.Instance().IsFilterableColumn_table(` + ColumnId + `,'` + ColumnName + `')"><span id="IsFilterableColumn">IsFilterable<i class="dropdown-icon fa fa-check pull-right hidden text-primary"  id="DropDown_IsFilterable_` + ColumnName.replace(" ", "") + `"></i></span> </a></li><li><a class="dropdown-item" href="javascript:;" onclick="Unibase.Platform.Analytics.Reports.ReportBuilder.Instance().IsPrimaryKey(` + ColumnId + `,'` + ColumnName + `')"><span id="IsPrimaryKeyColumn">IsPrimaryKey<i class="dropdown-icon fa fa-check pull-right hidden text-primary"  id="DropDown_IsPrimaryKey_` + ColumnName.replace(" ", "") + `"></i></span> </a></li><li><a class="dropdown-item" href="javascript:;" onclick="Unibase.Platform.Analytics.Reports.ReportBuilder.Instance().IsContactColumn(` + ColumnId + `,'` + ColumnName + `')"><span id="IsContactColumn" class="flex-between-center">IsContactColumn<i class="dropdown-icon fa fa-check pull-right hidden text-primary font-16"  id="DropDown_IsContactColumn_` + ColumnName.replace(" ", "") + `"></i></span> </a></li>

  79.                             <div class="dropdown-divider"></div><input type="text" class="form-control" id="displayText_` + ColumnName + `" value=` + ColumnName + ` onkeyup="Unibase.Platform.Analytics.Charts.ChartBuilder.Instance().updateSelect2DisplayText('displayText_` + ColumnName + `','dsl_column_` + ColumnName + `')"><div class="dropdown-divider"></div></div><li><a class="dropdown-item" href="javascript:;" onclick="Unibase.Platform.Analytics.Reports.ReportBuilder.Instance().showOrHideColumn_table(` + ColumnId + `,'` + ColumnName + `')"><span id="ShowOrHideColumn">Hide Column</span> </a></li> <li><a class="dropdown-item link-danger" href="javascript:;" onclick=""><span id="RemoveSelectedColumn" onclick="Unibase.Platform.Analytics.Reports.ReportBuilder.Instance().removeSelectedColumn_table(` + ColumnId + `,'` + ColumnName + `')"> Remove Column </span></a></li></ul></div>`;

  80.                         }

  81.                         Coordinathtml += `<a class="btn btn-xs btn-icon btn-flush-dark btn-rounded flush-soft-hover dsl-block-close" href="javascript:;" onclick="Unibase.Platform.Analytics.Reports.ReportBuilder.Instance().removeSelectedColumn_table(` + ColumnId + `,'` + ColumnName + `')"><span class="btn-icon-wrap" ><span class="line-icon"><i class="las la-times font-16"></i></span></span></a></span></div>`;

  82.                         return Coordinathtml;

  83.                     }

  84.                     loadPivotForm() {

  85.                         let pivotHtml = `<div id="drawer_push" class="biz-drawer biz-drawer drawer-small drawer-right custom-right-chart-nav">`;

  86.                         pivotHtml += `<ul class="nav nav-light nav-tabs">

  87. 				                            <li class="nav-item">

  88. 					                            <a class="nav-link active" data-toggle="tab" href="#tab_dynamic_pivote">

  89. 						                            <span class="nav-link-text">Dynamic</span>

  90. 					                            </a>

  91. 				                            </li>

  92. 				                            <li class="nav-item">

  93. 					                            <a class="nav-link" data-toggle="tab" href="#tab_normal_pivote">

  94. 						                            <span class="nav-link-text">Normal</span>

  95. 					                            </a>

  96. 				                            </li>

  97. 			                            </ul>`;

  98.                         this.pivotFormHtml = `

  99.                 <div class="tab-content mt-0">

  100. 					<div class="tab-pane fade active show" id="tab_dynamic_pivote">

  101. 						<div data-simplebar class="simple-scroll-bar">

  102. 							<div class="drawer-header">

  103. 								<h6>Dynamic Filter<span class="badge badge-green badge-pill ml-5"></span></h6>

  104. 								<div class="d-flex align-items-center">

  105. 									<button class="btn btn-xs btn-outline-secondary mr-15" onclick="Unibase.Platform.Analytics.Charts.ChartBuilder.Instance().resetSelect2Columns('dynamicFilter_select')">reset</button>

  106. 									<button type="button" class="drawer-close close">

  107. 										<span aria-hidden="true">×</span>

  108. 									</button>

  109. 								</div>

  110. 							</div>

  111. 							<div class="card-body">

  112.                                 <div class="form-group d-flex align-items-center" id="div_pindynamicfiltes">

  113.                                     <input type="checkbox" class="ck_bx_pindynamicfiltes mr-10" id="pindynamicfilters_checkbox"><label for="pindynamicfilters_checkbox" class="mb-0">

  114.                                     Pin Dynamic Filters</label>

  115.                                 </div>

  116.                                 <div class="form-group d-flex align-items-center" id="div_showdatalistcolumns">

  117.                                     <input type="checkbox" class="ck_bx_showdatalistcolumns mr-10" id="showdatalistcolumns_checkbox"><label for="showdatalistcolumns_checkbox" class="mb-0">

  118.                                     Show Datalist Columns</label>

  119.                                 </div>

  120. 								<select class="form-control custom-select" id="dynamicFilter_select">

  121.                                       <option selected>- Select Columns -</option>

  122. 								</select>

  123.                             <div class="dynamic-list-group-wrapper ui-sortable dsl-block-wrap mt-10 p-0" id="dynamic-list-group-wrapper">

  124. 							</div>

  125. 							</div>

  126. 						</div>

  127. 					</div>

  128. 

  129.                         

  130. 					<div class="tab-pane fade p-0" id="tab_normal_pivote">

  131.                             <div class="drawer-header">

  132. 				                <h6>Pivot Filter<span class="badge hidden badge-pink badge-pill ml-5">4</span></h6>

  133. 				                <div class="d-flex align-items-center">

  134. 					                <button class="btn btn-xs btn-outline-secondary mr-15" id="reset_pivot_details">reset</button>

  135. 					                <button type="button" class="drawer-close close" id="pivot-close-btn">

  136. 						                <span aria-hidden="true">&times;</span>

  137. 					                </button>

  138. 				                </div>

  139. 			                </div>

  140. 			                <div class="drawer-body"><div data-simplebar class="simple-scroll-bar">

  141. 					                <div class="drawer-content-wrap">

  142.                                         <form id="" method="post" class="" data-formuniquekey="" data-validate="parsley">

  143.                                         <div id="" class="clear bizgaze_FormErrorMessages"></div>

  144. 

  145.                                     <div class="form-group" id="div_pivotType">

  146.                                     <div class="d-flex align-items-center justify-content-between mb-10">

  147.                                     <select class="form-control custom-select pivotType" id="pivotType_Select2" onchange="Unibase.Platform.Analytics.Reports.Pivot.Instance().selectedpivotType(0)" required>

  148.                                     <option value="0" data-select2-id="16">-Select-</option>

  149.                                     <option value="1" data-select2-id="16">Pivot</option>

  150.                                     <option value="2" data-select2-id="132">Tree View</option>

  151.                                     <option value="3" data-select2-id="133">Pivot TreeView</option>

  152.                                     <option value="4" data-select2-id="133">TimeIntervel</option>

  153.                                     <option value="5" data-select2-id="133">Pivot Table</option>

  154.                                     </select>

  155.                                     </div>

  156.                                     </div>

  157.                                       

  158.                                          <div class="form-group hidden" id="div_PivotTableConfig">

  159.                                                        <label>

  160.                                                             PivotTable Configurations

  161.                                                         </label>

  162.                                                         <div>

  163.                                                             <input type="checkbox" class="chkPivotTableConfig mr-10" onclick="" id="chkPivotTableConfig_checkbox">PivotTable Configurations

  164.                                                         </div>

  165.                                          </div>

  166. 	                                    <div class="form-group hidden" id="div_Intervals">

  167. 							                <label>

  168. 								                Time Intervals

  169.                                             <span class="text-danger hidden"> *</span>

  170. 							                </label>

  171. 							                <input type="text" class="form-control" id="txt_TimeIntervals" placeholder="Time Intervals">

  172. 						                </div>

  173. 						                <div class="form-group hidden" id="div_PivotColumns">

  174. 							                <label>

  175. 								                Pivot Column

  176.                                             <span class="text-danger hidden"> *</span>

  177. 							                </label>

  178. 							                <select class="form-control custom-select PivotColumns_AutoComplete" id="PivotColumns_AutoComplete" onchange="Unibase.Platform.Analytics.Reports.Pivot.Instance().changedPivotColumn()" required>

  179. 								                <option value="0" selected="">- Select Pivot Column -</option>

  180. 							                </select>

  181. 						                </div>

  182.                                         <div class="form-group hidden" id="div_PivotDateType">

  183. 							                <label>

  184. 								                Date Type

  185.                                             <span class="text-danger hidden"> *</span>

  186. 							                </label>

  187. 							                <select class="form-control custom-select PivotDateType" id="PivotDateType" onchange="Unibase.Platform.Analytics.Reports.Pivot.Instance().changedDateType()" required>

  188. 								                <option value="0" selected="">- Select Pivot Date Type -</option>

  189. 							                </select>

  190. 						                </div>	

  191. 						                <div class="form-group hidden" id="div_PivotAggrColumn">

  192. 							                <label>

  193. 								                Pivot Aggregation Column

  194. 							                </label>

  195. 							                <select class="form-control custom-select PivotAggrColumn" id="PivotAggrColumn" onchange="Unibase.Platform.Analytics.Reports.Pivot.Instance().changedPivotAggrColumn()" required>

  196. 								                <option value="0" selected="">- Select Aggregation Column -</option>

  197. 							                </select>

  198. 						                </div>	

  199. 						                <div class="form-group hidden" id="div_PivotAggrType">

  200. 							                <label>

  201. 								                Pivot Aggregation Type

  202.                                             <span class="text-danger hidden"> *</span>

  203. 							                </label>

  204. 							                <select class="form-control custom-select PivotAggrType" id="PivotAggrType" required>

  205. 								                <option value="0" selected="">- Select Aggregation Type -</option>

  206.                                         <option value="1">count</option>

  207.                                         <option value="2">sum</option>

  208.                                         <option value="3">average</option>

  209.                                         <option value="4">max</option>

  210.                                         <option value="5">min</option>

  211.                                         <option value="6">month</option>

  212.                                         <option value="7">year</option>

  213. 							                </select>

  214. 						                </div>

  215.                                             <div class="form-group hidden" id="div_PivotRows">

  216. 							                <label>

  217. 								                Pivot Rows

  218.                                             <span class="text-danger hidden"> *</span>

  219. 							                </label>

  220. 							                <select class="form-control custom-select PivotRows_Select2" id="PivotRows_Select2" multiple="multiple" required>

  221. 								                <option value="0" selected="">- Select Pivot Rows -</option>

  222. 							                </select>

  223. 						                </div>

  224.                                          <div class="form-group hidden" id="div_datatreeexpand">

  225.                                                        <label for="treeexpand_checkbox">

  226.                                                             DataTreeExpand

  227.                                                         </label>

  228.                                                         <div>

  229.                                                             <input type="checkbox" class="chktreeexpand mr-10" onclick="" id="chktreeexpand_checkbox">IsDataTreeExpand

  230.                                                         </div>

  231.                                          </div>

  232. 						                <div class="form-group hidden" id="div_PivotChildColumnName">

  233. 							                <label>

  234. 								                Pivot Child Column

  235.                                             <span class="text-danger hidden"> *</span>

  236. 							                </label>

  237. 							                <select class="form-control custom-select PivotChildColumnName_AutoComplete" id="PivotChildColumnName_AutoComplete" onchange="Unibase.Platform.Analytics.Reports.Pivot.Instance().changedPivotChildColumn()" required>

  238. 								                <option value="0" selected="">- Select Pivot Child Column -</option>

  239. 							                </select>	

  240. 						                </div>	

  241.                                         <div class="form-group hidden" id="div_PivotValue">

  242. 							                <label>

  243. 								                Pivot Value

  244.                                             <span class="text-danger hidden"> *</span>

  245. 							                </label>

  246. 							                <select class="form-control custom-select PivotValue_AutoComplete" id="PivotValue_AutoComplete" required>

  247. 								                <option value="0" selected="">- Select Pivot Value -</option>

  248. 							                </select>

  249. 						                </div>	

  250. 						                <div class="form-group hidden" id="div_PivotParentColumnName">

  251. 							                <label>

  252. 								                Pivote Parent Column

  253.                                             <span class="text-danger hidden"> *</span

  254. 							                </label>

  255. 							                <select class="form-control custom-select PivotParentColumnName_AutoComplete" id="PivotParentColumnName_AutoComplete" required>

  256. 								                <option value="0" selected="">Select Pivot Parent Column</option>

  257. 							                </select>

  258.                                         </form>

  259. 						                </div></div></div></div>

  260.                                         <div class="drawer-footer drawerFooterApplyPivot hidden">

  261.                                             <a href="javascript:;" id="btn_ApplyPivot" class="btn btn-block btn-theme"> Apply </a>

  262. 			                            </div>

  263.                                         </div>

  264.                                         </div>

  265. 				                     	`;

  266.                         pivotHtml += this.pivotFormHtml;

  267.                         pivotHtml += `</div>`;

  268.                         return pivotHtml;

  269.                     }

  270.                     loadSortSelect2Column(ColumnId, ColumnName, DataType) {

  271.                         let sortColumnHtml = "";

  272.                         sortColumnHtml += `<div class="dsl-block datagroup column_${ColumnName}" id="dsl_column_${ColumnName}">

  273. 												<span><i class="las la-braille dragger"></i>

  274. 														<span class="dsl-block-name">${ColumnName}</span>

  275. 												</span><span>`;

  276.                         sortColumnHtml += `	<span><a class="btn btn-xs btn-icon btn-flush-dark btn-rounded dropdown-toggle flush-soft-hover no-caret" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" href="javascript:;" onclick="Unibase.Platform.Analytics.Reports.ReportBuilder.Instance().loadSorting(` + ColumnId + `,'` + ColumnName + `')"><span class="btn-icon-wrap"><span class="line-icon"><i class="las la-sort-down text-dark font-21 sort-icon"></i></span></span></a>

  277.                                 <div class="dropdown-menu dropdown-menu-right dropdown-radio">

  278. 									<a class="dropdown-item SortOrder_` + ColumnId + `" id="SortOrder_` + ColumnId + `_Asc" onclick="javascript: Unibase.Platform.Analytics.Reports.ReportBuilder.Instance().changeSortBy_table(` + ColumnId + `,'` + ColumnName + `','Asc');" href="javascript:;"><i class="ri-checkbox-blank-circle-line dropdown-icon" id="DropDown_IsAsc_` + ColumnName.replace(" ", "") + `"></i><span class="text-uppercase">Asc</span></a>

  279. 									<a class="dropdown-item SortOrder_` + ColumnId + `" id="SortOrder_` + ColumnId + `_Desc" onclick="javascript: Unibase.Platform.Analytics.Reports.ReportBuilder.Instance().changeSortBy_table(` + ColumnId + `,'` + ColumnName + `','Desc');" href="javascript:;"><i class="ri-checkbox-blank-circle-line dropdown-icon" id="DropDown_IsDesc_` + ColumnName.replace(" ", "") + `"></i><span class="text-uppercase">Desc</span></a></div></span>`;

  280.                         sortColumnHtml += `<a class="btn btn-xs btn-icon btn-flush-dark btn-rounded flush-soft-hover dsl-block-close" href="javascript:;" onclick="Unibase.Platform.Analytics.Reports.ReportBuilder.Instance().removeSelectedSortColumn_table(` + ColumnId + `,'` + ColumnName + `')"><span class="btn-icon-wrap"><span class="line-icon"><i class="las la-times font-16"></i></span></span></a></span>

  281. 											</div>`;

  282.                         return sortColumnHtml;

  283.                     }

  284.                     loadDynamicFilterColumn(ColumnId, ColumnName, DataType) {

  285.                         let dynamicColumnHtml = "";

  286.                         dynamicColumnHtml += `<div class="dsl-block c-gap-10 datagroup" data-report-id="${ColumnId}" data-IsFilterableColumn="${ColumnName}">

  287. 								<span class="flex-grow-1"><i class="las la-braille dragger"></i><a class="" onclick="Unibase.Platform.Analytics.Reports.ReportFilter.Instance().dynamicFilterIsDefaultDateColumn('${ColumnName}')" data-toggle="tooltip" data-placement="top" title="" data-original-title="DefaultDate">

  288.                                                   <input type="checkbox" title="IsDefault" name="defaultdate" class="btn btn-xs mr-2 dynamicfilter-defaultdate_${ColumnName} hidden" id="dynamicfilter-defaultdate_${ColumnName}">

  289.                                                 </a><span class="dsl-block-name">${ColumnName}</span></span><span class='flex-shrink-0'><span><a class="btn btn-xs btn-icon btn-flush-dark btn-rounded flush-soft-hover no-caret" href="javascript:;" onclick="Unibase.Platform.Analytics.Reports.ReportBuilder.Instance().IsFilterableColumn_table(${ColumnId},'${ColumnName}',${DataType})"><span class="btn-icon-wrap"><span class="line-icon"><i class="las la-filter text-dark dynamic-filter-icon-${ColumnName} font-21"></i></span></span></a><span class='hidden' data-toggle="tooltip" data-placement="top" title="" data-original-title="Is Partition"> <input type="checkbox" class="chk_ispartition_${ColumnName} hidden" id="chk_ispartition_${ColumnName}" onclick="Unibase.Platform.Analytics.Reports.ReportFilter.Instance().dynamicFilterIsPartition('${ColumnName}')"> </span><a class="btn btn-xs btn-icon btn-flush-dark btn-rounded flush-soft-hover" href="javascript:;" onclick="Unibase.Platform.Analytics.Reports.DynamicFilter.Instance().removeDynamicFilterSelectedColumn_table('${ColumnName}')"><span class="btn-icon-wrap"><span class="line-icon"><i class="las la-times font-16"></i></span></span></a></span></div>`;

  290.                         return dynamicColumnHtml;

  291.                     }

  292.                     loadChartSideBar() {

  293.                         let html = `<div class="bldr-aside-right">

  294.                                       <div id="chart-pivot-container" class="hidden biz-drawer biz-drawer drawer-small drawer-right biz-drawer-toggle">` + this.pivotFormHtml + `</div>

  295.                                       <div id="chart-appearance-container">

  296.                                       <ul class="nav nav-light nav-tabs">

  297.                                         <li class="nav-item">

  298.                                           <a class="nav-link active" data-toggle="tab" href="#tab_apprnc">

  299.                                             <span class="nav-link-text">Appearance</span>

  300.                                           </a>

  301.                                         </li>

  302.                                         <li class="nav-item">

  303.                                           <a class="nav-link" data-toggle="tab" href="#tab_tooltip">

  304.                                             <span class="nav-link-text">Tooltips</span>

  305.                                           </a>

  306.                                         </li>

  307.                                       </ul>

  308.                                       <div data-simplebar class="simple-scroll-bar">

  309.                                         <div class="tab-content">

  310.                                           <div class="tab-pane fade show active" id="tab_apprnc">

  311.                                             <div class="collapse-simple">

  312.                                               <div class="card">

  313.                                                 <div class="card-header">

  314.                                                   <a role="button" data-toggle="collapse" href="#chart_type" aria-expanded="true">Chart Type</a>

  315.                                                 </div>

  316.                                                 <div id="chart_type" class="chart-type-collapse collapse show">

  317.                                                   <div class="card-body">

  318.                                                     <div class="row row-sm btn-group-toggle biz-custom-scrollbar" data-toggle="buttons">

  319.                                                       <div class="col-4 h-70p btn-group mb-20">

  320.                                                         <label class="btn btn-block btn-filter">

  321.                                                           <input type="radio" name="options" id="option1"/><img class="img-fluid pa-10 bar-chart-icon" src="tenants/themes/compact/imgs/charttypes/bar-chart.png" onclick="Unibase.Platform.Analytics.Charts.ChartBuilder.Instance().chartPreview('bar',1)">

  322.                                                         </label>

  323.                                                       </div>

  324.                                                       <div class="col-4 h-70p btn-group mb-20">

  325.                                                         <label class="btn btn-block btn-filter">

  326.                                                           <input type="radio" name="options" id="option2" /><img class="img-fluid t-90d pa-10 horizontalbar-chart-icon" src="tenants/themes/compact/imgs/charttypes/bar-chart.png" onclick="Unibase.Platform.Analytics.Charts.ChartBuilder.Instance().chartPreview('horizontalBar',2)">

  327.                                                         </label>

  328.                                                       </div>

  329.                                                       <div class="col-4 h-70p btn-group mb-20">

  330.                                                         <label class="btn btn-block btn-filter">

  331.                                                           <input type="radio" name="options" id="option3" /><img class="img-fluid pa-10 area-chart-icon" src="tenants/themes/compact/imgs/charttypes/area-chart.png" onclick="Unibase.Platform.Analytics.Charts.ChartBuilder.Instance().chartPreview('area',3)">

  332.                                                         </label>

  333.                                                       </div>

  334.                                                       <div class="col-4 h-70p btn-group mb-20">

  335.                                                         <label class="btn btn-block btn-filter">

  336.                                                           <input type="radio" name="options" id="option4" /><img class="img-fluid pa-10 doughnut-chart-icon" src="tenants/themes/compact/imgs/charttypes/doughnut.png" onclick="Unibase.Platform.Analytics.Charts.ChartBuilder.Instance().chartPreview('doughnut',4)">

  337.                                                         </label>

  338.                                                       </div>

  339.                                                       <div class="col-4 h-70p btn-group mb-20">

  340.                                                         <label class="btn btn-block btn-filter">

  341.                                                           <input type="radio" name="options" id="option5" /><img class="img-fluid pa-10 line-chart-icon" src="tenants/themes/compact/imgs/charttypes/line-graph.png" onclick="Unibase.Platform.Analytics.Charts.ChartBuilder.Instance().chartPreview('line',5)">

  342.                                                         </label>

  343.                                                       </div>

  344.                                                       <div class="col-4 h-70p btn-group mb-20">

  345.                                                         <label class="btn btn-block btn-filter">

  346.                                                           <input type="radio" name="options" id="option6" /> <img class="img-fluid pa-10 pie-chart-icon" src="tenants/themes/compact/imgs/charttypes/pie-chart.png" onclick="Unibase.Platform.Analytics.Charts.ChartBuilder.Instance().chartPreview('pie',6)">

  347.                                                         </label>

  348.                                                       </div>

  349.                                                       <div class="col-4 h-70p btn-group mb-20">

  350.                                                         <label class="btn btn-block btn-filter in-active">

  351.                                                           <input type="radio" name="options" id="option7" />

  352.                                                           <img class="img-fluid pa-10 stackedbar-icon stackedbar-chart-icon t-270d" src="tenants/themes/compact/imgs/charttypes/stacked.png" onclick="Unibase.Platform.Analytics.Charts.ChartBuilder.Instance().chartPreview('stackedBar',7)">

  353.                                                         </label>

  354.                                                       </div>

  355.                                                       <div class="col-4 h-70p btn-group mb-20">

  356.                                                         <label class="btn btn-block btn-filter in-active">

  357.                                                           <input type="radio" name="options" id="option8" /><img class="img-fluid pa-10 stackedbar-icon stackedhorizontalbar-chart-icon" src="tenants/themes/compact/imgs/charttypes/stacked.png" onclick="Unibase.Platform.Analytics.Charts.ChartBuilder.Instance().chartPreview('stackedHorizontalBar',8)">

  358.                                                         </label>

  359.                                                       </div>

  360.                                                       <div class="col-4 h-70p btn-group mb-20">

  361.                                                         <label class="btn btn-block btn-filter">

  362.                                                           <input type="radio" name="options" id="option9" />                                <img class="img-fluid pa-10 bubble-chart-icon" src="tenants/themes/compact/imgs/charttypes/bubble.png" onclick="Unibase.Platform.Analytics.Charts.ChartBuilder.Instance().chartPreview('bubble',9)">

  363.                                                         </label>

  364.                                                       </div>

  365.                                                       <div class="col-4 h-70p btn-group mb-20">

  366.                                                         <label class="btn btn-block btn-filter">

  367.                                                           <input type="radio" name="options" id="option10" /> <img class="img-fluid pa-10 grouped-chart-icon" src="tenants/themes/compact/imgs/charttypes/grouped.png">

  368.                                                         </label>

  369.                                                       </div>

  370.                                                       <div class="col-4 h-70p btn-group mb-20">

  371.                                                         <label class="btn btn-block btn-filter">

  372.                                                           <input type="radio" name="options" id="option11" /><img class="img-fluid pa-10 t-90d horizontalgrouped-chart-icon" src="tenants/themes/compact/imgs/charttypes/grouped.png">

  373.                                                         </label>

  374.                                                       </div>

  375.                                                       <div class="col-4 h-70p btn-group mb-20">

  376.                                                         <label class="btn btn-block btn-filter">

  377.                                                           <input type="radio" name="options" id="option12"/><img class="img-fluid pa-10 bar-line-chart-icon" src="tenants/themes/compact/imgs/charttypes/bar-line-chart.png" onclick="Unibase.Platform.Analytics.Charts.ChartBuilder.Instance().chartPreview('barWithLine',12)">

  378.                                                         </label>

  379.                                                       </div>

  380.                                                     </div>

  381.                                                   </div>

  382.                                                 </div>

  383.                                               </div>

  384.                                               <div class="card">

  385.                                                 <div class="card-header">

  386.                                                   <a role="button" data-toggle="collapse" href="#legend_options" aria-expanded="true">Legend</a>

  387.                                                 </div>

  388.                                                 <div id="legend_options" class="collapse show" style="">

  389.                                                   <div class="card-body">

  390.                                                     <div class="mb-10">

  391.                                                       <div class="biz-mini-adj-drawer-wrap">

  392.                                                         <div class="form-row">

  393.                                                           <div class="col-12">

  394.                                                              <select class="form-control custom-select" id="legend-select" onchange="Unibase.Platform.Analytics.Charts.ChartBuilder.Instance().loadSelectedLegend(0, true)">

  395.                                                                 <option value="0" selected="">None</option>

  396.                                                                 <option value="1"> Top </option>

  397.                                                                 <option value="2"> Right </option>

  398.                                                                 <option value="3"> Bottom </option>

  399.                                                                 <option value="4"> Left </option>

  400.                                                             </select>

  401.                                                           </div>

  402.                                                         </div>

  403.                                                       </div>

  404.                                                     </div>

  405.                                                   </div>

  406.                                                 </div>

  407.                                               </div>

  408.                                             <div class="card">

  409.                                                 <div class="card-header">

  410.                                                   <a role="button" data-toggle="collapse" href="#scales_lables" aria-expanded="true">Scales Lables</a>

  411.                                                 </div>

  412.                                                 <div id="scales_lables" class="collapse show" style="">

  413.                                                   <div class="card-body">

  414.                                                     <div class="mb-10">

  415.                                                       <div class="biz-mini-adj-drawer-wrap">

  416.                                                         <div class="form-row">

  417.                                                             <div class="col-12 mt-2">

  418.                                                                 <label for="label_length"> Labels Length </label>

  419.                                                                 <input type="number" class="form-control" min="0" max="50" id="label_length" name="label_length" value="0">

  420.                                                           </div>

  421.                                                         </div>

  422.                                                       </div>

  423.                                                     </div>

  424.                                                   </div>

  425.                                                 </div>

  426.                                               </div>

  427.                                             <div class="card">

  428.                                                 <div class="card-header">

  429.                                                   <a role="button" data-toggle="collapse" href="#datalabel_div" aria-expanded="true" class="">Data Label</a>

  430.                                                 </div>

  431.                                                 <div id="datalabel_div" class="collapse show" style="">

  432.                                                   <div class="card-body">

  433.                                                     <div class="card border-0 shadow-none">

  434.                                                       <div class="card-body p-2">

  435.                                                         <div class="biz-mini-adj-drawer-wrap">

  436.                                                           <div class="form-row">

  437.                                                             <div class="col">

  438.                                                                 <input type="checkbox" id="isdatalabel" name="isdatalabelcheckbox" class="" checked="false">

  439.                                                                 <label class="" for="isdatalabel">Is Data Label</label>

  440.                                                               </div>

  441.                                                             </div>

  442.                                                           </div>

  443.                                                         </div>

  444.                                                     </div>

  445.                                                 </div>

  446.                                             </div>

  447.                                             </div>

  448.                                               <div class="card">

  449.                                                 <div class="card-header">

  450.                                                   <a role="button" data-toggle="collapse" href="#label_type" aria-expanded="true">Legend Type</a>

  451.                                                 </div>

  452.                                                 <div id="label_type" class="collapse show">

  453.                                                   <div class="card-body">

  454.                                                     <div class="card border-0 shadow-none">

  455.                                                       <div class="card-body p-2">

  456.                                                         <div class="biz-mini-adj-drawer-wrap">

  457.                                                           <div class="form-row">

  458.                                                             <div class="col">

  459.                                                               <div class="custom-control custom-radio adj-drawer-open" data-target="lagendtypedata">

  460.                                                                 <input type="radio" id="lagendtypedata" name="lagendtypedataradio" class="custom-control-input"

  461.                                                                   checked="true">

  462.                                                                 <label class="custom-control-label" for="lagendtypedata">Data</label>

  463.                                                               </div>

  464.                                                             </div>

  465.                                                             <div class="col">

  466.                                                               <div class="custom-control custom-radio adj-drawer-open" data-target="lagendtypecolumn">

  467.                                                                 <input type="radio" id="lagendtypecolumn" name="lagendtypedataradio" class="custom-control-input">

  468.                                                                 <label class="custom-control-label" for="lagendtypecolumn">Column</label>

  469.                                                               </div>

  470.                                                             </div>

  471.                                                           </div>

  472.                                                         </div>

  473.                                                       </div>

  474.                                                     </div>

  475.                                                 </div>

  476.                                             </div>

  477.                                             </div>

  478.                                               <div class="card">

  479.                                                 <div class="card-header">

  480.                                                   <a role="button" data-toggle="collapse" href="#theme_pre" aria-expanded="true">Theme Preset</a>

  481.                                                 </div>

  482.                                                 <div id="theme_pre" class="collapse show">

  483.                                                   <div class="card-body">

  484.                                                     <div class="card border-0 shadow-none">

  485.                                                       <div class="card-body p-2">

  486.                                                         <div class="biz-mini-adj-drawer-wrap">

  487.                                                           <div class="form-row">

  488.                                                             <div class="col">

  489.                                                               <div class="custom-control custom-radio adj-drawer-open" data-target="columnRadio">

  490.                                                                 <input type="radio" id="columnRadio" name="customRadio1" class="custom-control-input"

  491.                                                                   checked="">

  492.                                                                 <label class="custom-control-label" for="columnRadio">Column</label>

  493.                                                               </div>

  494.                                                             </div>

  495.                                                             <div class="col">

  496.                                                               <div class="custom-control custom-radio adj-drawer-open" data-target="rowRadio">

  497.                                                                 <input type="radio" id="rowRadio" name="customRadio1" class="custom-control-input">

  498.                                                                 <label class="custom-control-label" for="rowRadio">Row</label>

  499.                                                               </div>

  500.                                                             </div>

  501.                                                           </div>

  502.                                                         </div>

  503.                                                       </div>

  504.                                                     </div>

  505.                                             <div class="card">

  506.                                                 <div class="card-header">

  507.                                                   <a role="button" data-toggle="collapse" href="#pallettes_options" aria-expanded="true">Pallettes</a>

  508.                                                 </div>

  509.                                                 <div id="legend_options" class="collapse show" style="">

  510.                                                   <div class="card-body">

  511.                                                     <div class="mb-10">

  512.                                                       <div class="biz-mini-adj-drawer-wrap">

  513.                                                         <div class="form-row">

  514.                                                           <div class="col">

  515.                                                              <select class="form-control custom-select" id="pallettes_select">

  516.                                                                 <option value="0" selected="">Select Pallette</option>

  517.                                                             </select>

  518.                                                           </div>

  519.                                                         </div>

  520.                                                       </div>

  521.                                                     </div>

  522.                                                   </div>

  523.                                                 </div>

  524.                                               </div>

  525.                                   <div class="color-board hidden">

  526. 														<div class="mb-10">

  527. 															<div class="color-block">

  528. 																<div class="bg-red-light-3"></div>

  529. 																<div class="bg-pink-light-3"></div>

  530. 																<div class="bg-purple-light-3"></div>

  531. 																<div class="bg-violet-light-3"></div>

  532. 																<div class="bg-smoke-light-3"></div>

  533. 																<div class="bg-blue-light-3 d-none"></div>

  534. 																<div class="bg-violet-light-3 d-none"></div>

  535. 																<div class="bg-indigo-light-3 d-none"></div>

  536. 																<div class="bg-blue-light-3 d-none"></div>

  537. 																<div class="bg-sky-light-3 d-none"></div>

  538. 																<div class="bg-cyan-light-3 d-none"></div>

  539. 																<div class="bg-teal-light-3 d-none"></div>

  540. 																<div class="bg-green-light-3 d-none"></div>

  541. 																<div class="bg-neon-light-3 d-none"></div>

  542. 																<div class="bg-lime-light-3 d-none"></div>

  543. 																<div class="bg-sun-light-3 d-none"></div>

  544. 																<div class="bg-yellow-light-3 d-none"></div>

  545. 																<div class="bg-orange-light-3 d-none"></div>

  546. 																<div class="bg-pumpkin-light-3 d-none"></div>

  547. 																<div class="bg-brown-light-3 d-none"></div>

  548. 															</div>

  549. 															<div class="theme-caption">Color - 1 </div>

  550. 														</div>

  551. 														<div class="mb-10">

  552. 															<div class="color-block">

  553. 																<div class="bg-red-dark-2"></div>

  554. 																<div class="bg-pink-dark-2"></div>

  555. 																<div class="bg-purple-dark-2"></div>

  556. 																<div class="bg-violet-dark-2"></div>

  557. 																<div class="bg-smoke-dark-2"></div>

  558. 																<div class="bg-blue-dark-2 d-none"></div>

  559. 																<div class="bg-violet-dark-2 d-none"></div>

  560. 																<div class="bg-indigo-dark-2 d-none"></div>

  561. 																<div class="bg-blue-dark-2 d-none"></div>

  562. 																<div class="bg-sky-dark-2 d-none"></div>

  563. 																<div class="bg-cyan-dark-2 d-none"></div>

  564. 																<div class="bg-teal-dark-2 d-none"></div>

  565. 																<div class="bg-green-dark-2 d-none"></div>

  566. 																<div class="bg-neon-dark-2 d-none"></div>

  567. 																<div class="bg-lime-dark-2 d-none"></div>

  568. 																<div class="bg-sun-dark-2 d-none"></div>

  569. 																<div class="bg-yellow-dark-2 d-none"></div>

  570. 																<div class="bg-orange-dark-2 d-none"></div>

  571. 																<div class="bg-pumpkin-dark-2 d-none"></div>

  572. 																<div class="bg-brown-dark-2 d-none"></div>

  573. 															</div>

  574. 															<div class="theme-caption">Color - 2 </div>

  575. 														</div>

  576. 														<div class="mb-10">

  577. 															<div class="color-block">

  578. 																<div class="bg-grey-dark-4"></div>

  579. 																<div class="bg-blue-dark-4"></div>

  580. 																<div class="bg-indigo-dark-4"></div>

  581. 																<div class="bg-green-dark-4"></div>

  582. 																<div class="bg-sun-dark-4"></div>

  583. 																<div class="bg-red-dark-4 d-none"></div>

  584. 																<div class="bg-lime-dark-4 d-none"></div>

  585. 																<div class="bg-purple-dark-4 d-none"></div>

  586. 																<div class="bg-violet-dark-4 d-none"></div>

  587. 																<div class="bg-blue-dark-4 d-none"></div>

  588. 																<div class="bg-yellow-dark-4 d-none"></div>

  589. 																<div class="bg-violet-dark-4 d-none"></div>

  590. 																<div class="bg-brown-dark-4 d-none"></div>

  591. 																<div class="bg-cyan-dark-4 d-none"></div>

  592. 																<div class="bg-teal-dark-4 d-none"></div>

  593. 																<div class="bg-pumpkin-dark-4 d-none"></div>

  594. 																<div class="bg-pink-dark-4 d-none"></div>

  595. 																<div class="bg-sky-dark-4 d-none"></div>

  596. 																<div class="bg-orange-dark-4 d-none"></div>

  597. 																<div class="bg-neon-dark-4 d-none d-none"></div>

  598. 															</div>

  599. 															<div class="theme-caption">Color - 3 </div>

  600. 														</div>

  601. 

  602. 														<div class="mb-10">

  603. 															<div class="color-block">

  604. 																<div class="bg-sky-dark-3"></div>

  605. 																<div class="bg-cyan-dark-1"></div>

  606. 																<div class="bg-teal-dark-1"></div>

  607. 																<div class="bg-green-dark-1"></div>

  608. 																<div class="bg-neon-dark-1"></div>

  609. 																<div class="bg-lime-dark-1 d-none"></div>

  610. 																<div class="bg-sun-dark-1 d-none"></div>

  611. 																<div class="bg-yellow-dark-1 d-none"></div>

  612. 																<div class="bg-orange-dark-1 d-none"></div>

  613. 																<div class="bg-pumpkin-dark-1 d-none"></div>

  614. 																<div class="bg-brown-dark-1 d-none"></div>

  615. 																<div class="bg-green-dark-1 d-none"></div>

  616. 																<div class="bg-pink-dark-1 d-none"></div>

  617. 																<div class="bg-purple-dark-1 d-none"></div>

  618. 																<div class="bg-violet-dark-1 d-none"></div>

  619. 																<div class="bg-smoke-dark-1 d-none"></div>

  620. 																<div class="bg-blue-dark-1 d-none"></div>

  621. 																<div class="bg-violet-dark-1 d-none"></div>

  622. 																<div class="bg-indigo-dark-1 d-none"></div>

  623. 																<div class="bg-gold-dark-1 d-none"></div>

  624. 															</div>

  625. 															<div class="theme-caption">Color - 4 </div>

  626. 														</div>

  627. 

  628. 														<div class="mb-10">

  629. 															<div class="color-block">

  630. 																<div class="bg-blue-light-3"></div>

  631. 																<div class="bg-violet-light-3"></div>

  632. 																<div class="bg-green-light-3"></div>

  633. 																<div class="bg-sun-light-3"></div>

  634. 																<div class="bg-purple-light-3"></div>

  635. 																<div class="bg-orange-light-3 d-none"></div>

  636. 																<div class="bg-sky-light-3 d-none"></div>

  637. 																<div class="bg-cyan-light-3 d-none"></div>

  638. 																<div class="bg-brown-light-3 d-none"></div>

  639. 																<div class="bg-lime-light-3 d-none"></div>

  640. 																<div class="bg-pink-light-3 d-none"></div>

  641. 																<div class="bg-neon-light-3 d-none"></div>

  642. 																<div class="bg-indigo-light-3 d-none"></div>

  643. 																<div class="bg-red-light-3 d-none"></div>

  644. 																<div class="bg-smoke-light-3 d-none"></div>

  645. 																<div class="bg-pumpkin-light-3 d-none"></div>

  646. 																<div class="bg-blue-light-3 d-none"></div>

  647. 																<div class="bg-yellow-light-3 d-none"></div>

  648. 																<div class="bg-violet-light-3 d-none"></div>

  649. 																<div class="bg-teal-light-3 d-none"></div>

  650. 															</div>

  651. 															<div class="theme-caption">Color - 5 </div>

  652. 														</div>

  653. 

  654. 														<div class="mb-30">

  655. 															<div class="color-block">

  656. 																<div class="bg-dark-20"></div>

  657. 																<div class="bg-red-light-1"></div>

  658. 																<div class="bg-pink-light-1"></div>

  659. 																<div class="bg-purple-light-1"></div>

  660. 																<div class="bg-violet-light-1"></div>

  661. 																<div class="bg-smoke-light-1 d-none"></div>

  662. 																<div class="bg-blue-light-1 d-none"></div>

  663. 																<div class="bg-violet-light-1 d-none"></div>

  664. 																<div class="bg-indigo-light-1 d-none"></div>

  665. 																<div class="bg-blue-light-1 d-none"></div>

  666. 																<div class="bg-sky-light-1 d-none"></div>

  667. 																<div class="bg-cyan-light-1 d-none"></div>

  668. 																<div class="bg-teal-light-1 d-none"></div>

  669. 																<div class="bg-green-light-1 d-none"></div>

  670. 																<div class="bg-neon-light-1 d-none"></div>

  671. 																<div class="bg-lime-light-1 d-none"></div>

  672. 																<div class="bg-sun-light-1 d-none"></div>

  673. 																<div class="bg-yellow-light-1 d-none"></div>

  674. 																<div class="bg-orange-light-1 d-none"></div>

  675. 																<div class="bg-pumpkin-light-1 d-none"></div>

  676. 																<div class="bg-brown-light-1 d-none"></div>

  677. 															</div>

  678. 															<div class="theme-caption">Color - 6 </div>

  679. 														</div>

  680. 

  681. 														

  682. 													</div>

  683.                                                   </div>

  684.                                                 </div>

  685.                                               </div>

  686.                                             </div>

  687.                                           </div>

  688.                                           <div class="tab-pane fade" id="tab_tooltip">

  689.                                             <div class="form-group d-flex align-items-center" id="div_showtooltipheader">

  690.                                                 <input type="checkbox" class="ck_bx_showtooltipheader mr-10" id="showtooltipheader_checkbox"><label for="showtooltipheader_checkbox" class="mb-0">

  691.                                                 Show Tooltip Header</label>

  692.                                             </div>

  693.                                             <select class="form-control custom-select mb-10" id="tooltip_select">

  694.                                               <option selected="">- Select Columns -</option>

  695.                                             </select>

  696.                                             <div id="tooltip_selected_columns" class="dsl-block-wrap mt-10">

  697.                                           </div>

  698.                                         </div>

  699.                                       </div>

  700.                                       </div>

  701.                                     </div>`;

  702.                         $("#reportBuilderRightNav").html(html);

  703.                     }

  704.                     loadLinkToOtherReportForm() {

  705.                         let html = `<section id="link-report-section" class="modal-content">

  706.     <div class="modal-header pa-10 h-55p" id="linkreport_header">

  707.         <strong class="modal-title biz-highlight-bg-color">Sub report</strong>

  708.         <div class="sub_report_error_message" id="sub_report_error_message"></div>

  709. <button class="btn btn-sm btn-theme btn-wth-icon icon-left" id="subrpt_clear" onclick="Unibase.Platform.Analytics.Reports.SubReport.Instance().removeSubreport()"><span><span class="icon-label"><span class="line-icon hidden"><i class="las la-plus"></i></span></span><span class="btn-text">Clear</span></span></button>

  710.         <button class="btn btn-sm btn-theme btn-wth-icon icon-left hidden" id="subrpt_plus"><span><span

  711.                     class="icon-label"><span class="line-icon"><i class="las la-plus"></i></span></span><span

  712.                     class="btn-text">Add Sub Report</span></span></button>

  713.     </div>

  714.     <div data-simplebar class="simple-scroll-bar modal-body bg-charcoal-light-5">

  715.         <div id="divSubReport_ErrorMessage"></div>

  716.         <div class="subreport-select-card card">

  717.             <div class="row card-body mx-0 px-0 py-10">

  718.                 <div class="col-sm-6">

  719.                     <div class="custom-control custom-radio radio-primary d-flex align-items-center">

  720.                         <input type="radio" id="reportRadioBtn" name="subreportradio"

  721.                             class="custom-control-input subreport-radio-btn" onclick="Unibase.Platform.Analytics.Reports.SubReport.Instance().subReportType_Report()" value="report" checked>

  722.                         <label class="custom-control-label" for="reportRadioBtn">Report</label>

  723.                     </div>

  724.                 </div>

  725.                 <div class="col-sm-6">

  726.                     <div class="custom-control custom-radio radio-primary d-flex align-items-center">

  727.                         <input type="radio" id="detailRadioBtn" name="subreportradio"

  728.                             class="custom-control-input subreport-radio-btn" onclick="Unibase.Platform.Analytics.Reports.SubReport.Instance().subReportType_Deatil()" value="detailscreen">

  729.                         <label class="custom-control-label" for="detailRadioBtn">Detail Screen</label>

  730.                     </div>

  731.                 </div>

  732.             </div>

  733.         </div>

  734.         <div id="linkreport_modal">

  735.             <div class="sub-report-block card" data-select2-id="24" data-subreportid="" data-subreportcolumnid="">

  736.                 <div data-select2-id="23">

  737.                     <header class="sub-report-head pb-0">

  738.                         <h6 class="required">

  739.                             Sub report

  740.                         </h6>

  741.                         <span>

  742.                             <i class="las la-braille dragger"></i>

  743.                         </span>

  744.                         </button>

  745.                     </header>

  746.                     <div id="subrpts_div" data-select2-id="subrpts_div" class="">

  747.                         <div class="report-body">

  748.                             <div class="row mx-0 pb-10">

  749.                                 <div class="col-sm-6 pl-sm-0">

  750.                                     <div class="custom-control custom-radio radio-primary d-flex align-items-center">

  751.                                         <input type="radio" id="inlineRadioBtn" name="reportopentype"

  752.                                             class="custom-control-input opentype-radio-btn" value="inline" checked>

  753.                                         <label class="custom-control-label" for="inlineRadioBtn">Inline</label>

  754.                                     </div>

  755.                                 </div>

  756.                                 <div class="col-sm-6 pr-sm-0">

  757.                                     <div class="custom-control custom-radio radio-primary d-flex align-items-center">

  758.                                         <input type="radio" id="outlineRadioBtn" name="reportopentype"

  759.                                             class="custom-control-input opentype-radio-btn" value="outline">

  760.                                         <label class="custom-control-label" for="outlineRadioBtn">Outline</label>

  761.                                     </div>

  762.                                 </div>

  763.                               <div class="col hidden">

  764.                               <input type="checkbox" class="chkRowClick mr-10" onclick="" id="rowclick_checkbox"><label>RowClick</label>

  765.                               </div>

  766.                             </div>

  767.                             <div class="form-group">

  768.                                 <div id="divsubrpt_0" data-select2-id="divsubrpt_">

  769.                                          

  770.                                     <div id="div_Kanban" class="mb-10">

  771.                                         <select class="select_reports form-control custom-select" id="cmdsub_1">

  772.                                         </select>

  773.                                     </div>

  774.                                     <div class="form-row">

  775.                                         <div class="col-auto mt-2 mr-2">

  776.                                             <input class="" type="checkbox" id="isvalue_radio_0" title="Is value" >

  777.                                         </div>

  778.                                         <div class="col">

  779.                                             <div id="div_mainreportColumn">

  780.                                                 <select id="cmbmainrptCols"

  781.                                                     class="form-control text-control required">

  782.                                                 </select>

  783.                                             </div>

  784.                                         </div>

  785.                                         <div class="col hidden">

  786.                                             <div id="div_mainreportColumn_textbox">

  787.                                                 <input id="cmbmainrptCols_textbox"

  788.                                                     class="form-control text-control required">

  789.                                                 </input>

  790.                                             </div>

  791.                                         </div>

  792.                                         <div class="col-auto">

  793.                                             <select id="slctdoperater" class="form-control custom-select mb-10">

  794.                                                 <option value="0">-Select-</option>

  795.                                                 <option value="1">Equals</option>

  796.                                                 <option value="2">NotEquals</option>

  797.                                                 <option value="3">EqualsColumn</option>

  798.                                                 <option value="4">NotEqualsColumn</option>

  799.                                                 <option value="5">GreaterThan</option>

  800.                                                 <option value="6">GreaterThanOrEquals</option>

  801.                                                 <option value="7">LessThan</option>

  802.                                                 <option value="8">LessThanOrEquals</option>

  803.                                                 <option value="9">GreaterThanColumn</option>

  804.                                                 <option value="10">GreaterThanOrEqualsColumn</option>

  805.                                                 <option value="11">LessThanColumn</option>

  806.                                                 <option value="12">LessThanOrEqualsColumn</option>

  807.                                             </select>

  808.                                         </div>

  809.                                         <div class="col">

  810.                                             <div id="div_subColumn">

  811.                                                 <select id="cmbsbrptCols"

  812.                                                     class="form-control custom-select mb-10 required">

  813.                                                     <option value="0" selected="">Sub report column</option>

  814.                                                 </select>

  815.                                             </div>

  816.                                         </div>

  817.                                         <div class="col-auto">

  818.                                             <a class="btn btn-icon btn-theme" id="btnConfigAddFilter" onclick="" ;="">

  819.                                                 <span class="btn-icon-wrap"><span class="line-icon text-white"><i

  820.                                                             class="las la-plus"></i></span></span>

  821.                                             </a>

  822.                                         </div>

  823.                                     </div>

  824.                                     <div class="m-t-sm">

  825.                                         <ul class="ul2list_0 w-100 mt-10 p-2 pl-10" id = 'subreports-filters-list'>

  826.                                         </ul>

  827.                                     </div>

  828.                                 </div>

  829.                             </div>

  830.                         </div>

  831.                     </div>

  832.                 </div>

  833.             </div>

  834.         </div>

  835.         <div id="detailScreenBody" class="d-none">

  836.             <div class="detail-screen-card card">

  837.                 <div class="card-body">

  838.                     <textarea type="text" class="form-control hidden" id="txt_detailonclick" placeholder="On Click"></textarea>

  839.                     <div class="row mx-0 biz-select2-wrap">

  840.                         <div class="col-sm-6 pl-sm-0">

  841.                             <select id="detailPrimaryKeyColumns"><option value="0">Select Column</option></select>

  842.                         </div>

  843.                         <div class="col-sm-6 pr-sm-0 mb-15 mb-sm-0">

  844.                             <select id="detailInstalledApps" class="form-control"><option value="0">Select App</option></select>

  845.                             <input type="hidden" id="hfDetailInstalledApps" />

  846.                         </div>

  847.                     </div>

  848.                 </div>

  849.             </div>

  850.         </div>

  851.     </div>

  852.     <div class="modal-footer pa-10" id="linkreport_footer">

  853.         <button type="button" class="btn btn-sm btn-light mr-auto" id="btnLinkReportClose">Cancel</button>

  854.         <button type="button" class="btn btn-sm btn-theme" id="btnLinkReportSave">Save</button>

  855.     </div>

  856. </section>`;

  857.                         return html;

  858.                     }

  859.                     del_loadSubReports_Section() {

  860.                         let html = `<div id="divsubrpt" class="sub-report-block card"  data-subreportid="" data-subreportcolumnid ="">

  861.                           <header class="sub-report-head pb-0">

  862.                             <input type="hidden" id="hfsubRpt" value="0">

  863.                             <h6 class="required">

  864.                               Sub report

  865.                             </h6>

  866.                             <span>

  867.                               <i class="las la-braille dragger"></i>

  868.                               <i class="fa fa-times pull-right mb-20 remove_subrpt" id="remove_subrpt" aria-hidden="true"></i>

  869.                             </span>

  870.                           </header>

  871.                           <div class="">

  872.                             <div class="report-body">

  873.                               <div class="form-group">

  874.                                 <div id="divsubrpt_0" data-select2-id="divsubrpt_">

  875.                                   <div id="div_Kanban" class="mb-10">

  876.                                     <select

  877.                                       class="select_reports custom-select select2-hidden-accessible js-example-basic-single js-states form-control"

  878.                                       id="cmdsub"></select>

  879.                                   </div>

  880.                                 </div>

  881.                               <div class="form-row">

  882.                                 <div class="col">

  883.                                   <div id="div_mainreportColumn">

  884.                                     <select id="cmbmainrptCols" class="floating-label-group form-control cmbFiltercols">

  885.                                       <option value="0">Select Column</option>

  886.                                     </select>

  887.                                   </div>

  888.                                 </div>

  889.                                 <div class="col-auto">

  890.                                   <select id="slctdoperater" class="form-control custom-select mb-10">

  891.                                     <option value="eq">=</option>

  892.                                     <option value="neq">!=</option>

  893.                                     <option value="gt">&gt;</option>

  894.                                     <option value="gte">&gt;=</option>

  895.                                     <option value="lt">&lt;</option>

  896.                                     <option value="lte">&lt;=</option>

  897.                                   </select>

  898.                                 </div>

  899.                                 <div class="col">

  900.                                   <div id="div_subColumn">

  901.                                     <select id="cmbsbrptCols" class="form-control custom-select mb-10">

  902.                                     </select>

  903.                                   </div>

  904.                                 </div>

  905.                                 <div class="col-auto">

  906.                                   <a class="btn btn-icon btn-theme btnAdd" id="btnAdd" onclick="" ;="">

  907.                                     <span class="btn-icon-wrap"><span class="line-icon text-white"><i class="las la-plus"></i></span></span>

  908.                                   </a>

  909.                                 </div>

  910.                               </div>

  911.                               <div class="m-t-sm form-group">

  912.                                 <ul class="ul2list w-100 ulFilters" id="ulFilters">

  913.                                 </ul>

  914.                               </div>

  915.                             </div>

  916.                           </div>

  917.                         </div></div>`;

  918.                         return html;

  919.                     }

  920.                     loadSubReports_Section_old() {

  921.                         let html = `<div id="divsubrpt_{{subreport_count}}" class="sub-report-block card"  data-subreportid="" data-subreportcolumnid ="">

  922.                           <header class="sub-report-head pb-0">

  923.                             <input type="hidden" id="hfsubRpt_{{subreport_count}}" value="0">

  924.                             <h6 class="required">

  925.                               Sub report

  926.                             </h6>

  927.                             <span>

  928.                               <i class="las la-braille dragger"></i>

  929.                               <i class="fa fa-times pull-right mb-20 remove_subrpt" id="remove_subrpt_{{subreport_count}}" aria-hidden="true"></i>

  930.                             </span>

  931.                           </header>

  932.                           <div class="">

  933.                             <div class="report-body">

  934.                               <div class="form-group">

  935.                                 <div id="divsubrpt_0" data-select2-id="divsubrpt_">

  936.                                   <div id="div_Kanban" class="mb-10">

  937.                                     <select

  938.                                       class="select_reports custom-select select2-hidden-accessible js-example-basic-single js-states form-control"

  939.                                       id="cmdsub_{{subreport_count}}"></select>

  940.                                   </div>

  941.                                 </div>

  942.                               <div class="form-row">

  943.                                 <div class="col">

  944.                                   <div id="div_mainreportColumn">

  945.                                     <select id="cmbmainrptCols_{{subreport_count}}" class="floating-label-group form-control cmbFiltercols">

  946.                                       <option value="0">Select Column</option>

  947.                                     </select>

  948.                                   </div>

  949.                                 </div>

  950.                                 <div class="col-auto">

  951.                                   <select id="slctdoperater_{{subreport_count}}" class="form-control custom-select mb-10">

  952.                                     <option value="eq">=</option>

  953.                                     <option value="neq">!=</option>

  954.                                     <option value="gt">&gt;</option>

  955.                                     <option value="gte">&gt;=</option>

  956.                                     <option value="lt">&lt;</option>

  957.                                     <option value="lte">&lt;=</option>

  958.                                   </select>

  959.                                 </div>

  960.                                 <div class="col">

  961.                                   <div id="div_subColumn">

  962.                                     <select id="cmbsbrptCols_{{subreport_count}}" class="form-control custom-select mb-10">

  963.                                       <option value="0" selected="">Sub report Column</option>

  964.                                     </select>

  965.                                   </div>

  966.                                 </div>

  967.                                 <div class="col-auto">

  968.                                   <a class="btn btn-icon btn-theme btnAdd" id="btnAdd_{{subreport_count}}" onclick="" ;="">

  969.                                     <span class="btn-icon-wrap"><span class="line-icon text-white"><i class="las la-plus"></i></span></span>

  970.                                   </a>

  971.                                 </div>

  972.                               </div>

  973.                               <div class="m-t-sm form-group">

  974.                                 <ul class="ul2list_{{subreport_count}} w-100 ulFilters" id="ulFilters">

  975.                                 </ul>

  976.                               </div>

  977.                             </div>

  978.                           </div>

  979.                         </div></div>`;

  980.                         return html;

  981.                     }

  982.                     loadToolTipTemplateForm() {

  983.                         let html = `<form id="" method="post" class="" data-formuniquekey="" data-validate="parsley"><header class="b-b bg-white modal-header"><strong class="text-dark Title" id="div_FormName"> Pivot </strong></header><div class="bg-light control-sorting modal-body bg-white" ><div id="" class="clear bizgaze_FormErrorMessages"></div><div class="section_Pivot card">

  984.                         <div class="card-body"><div class="row">

  985.                         <div class="col-sm-6"><div id="divToolTipTemplateColumns" class="floating-label-form-group-with-value"><label for="lbl" id="lbl_ToolTipColumns">ToolTip Column<span class="text-danger hidden"> *</span></label>

  986.                         <select id="ToolTipColumns_AutoComplete" class="form-control text-control required" style="width:100%"><option value="0" selected="">Select ToolTip Column</option></select>

  987.                         </div></div>

  988. 

  989.                         <div class="col-sm-6"><div id="div_AggType" class="floating-label-form-group floating-label-form-group-with-value"><label for="lbl" id="lbl_Values">Aggregation<span class="text-danger hidden"> *</span></label>

  990.                         <select id="PivotDateType" class="form-control text-control PivotDateType required" style="width:100%"><option value="0" selected="">Select Aggregation</option>

  991.                         <option value="1">count</option>

  992.                         <option value="2">sum</option>

  993.                         <option value="3">average</option>

  994.                         <option value="4">max</option>

  995.                         <option value="5">min</option>

  996.                         <option value="6">month</option>

  997.                         <option value="7">year</option>

  998.                         </select>

  999.                         </div></div>

  1000. 

  1001.                         <div class="col-sm-6"><div id="div_backgroundColor" class="floating-label-form-group-with-value"><label for="lbl" id="lbl_backgroundColor">Background Color<span class="text-danger hidden"> *</span></label>

  1002.                         <input type="color" style="width:30px; float:left; height:30px; background:transparent; border-color: transparent;margin-right:10px;color:white;margin-top:-5px" id="backgroundColor">                        

  1003.                         </div></div>

  1004. 

  1005.                         <div class="col-sm-6" id="div_TitleFontColor"><div class="floating-label-form-group-with-value"><label for="lbl" id="lbl_TitleFontColor">Title Font Color<span class="text-danger hidden"> *</span></label>

  1006.                        <input type="color" style="width:30px; float:left; height:30px; background:transparent; border-color: transparent;margin-right:10px;color:white;margin-top:-5px" id="titleFontColor">

  1007.                         </div></div>

  1008. 

  1009.                         <div class="col-sm-6" id="div_TitleFontSize"><div class="floating-label-form-group-with-value"><label for="lbl" id="lbl_titleFontSize">Title Font Size<span class="text-danger hidden"> *</span></label>

  1010.                         <input type="text" class="form-control" id="txt_TitleFontSize" placeholder="Title Font Size">

  1011.                         </div></div>

  1012. 

  1013.                         <div class="col-sm-6" id="div_BodyFontSize"><div class="floating-label-form-group-with-value"><label for="lbl" id="lbl_BodyFontSize">Body Font Size<span class="text-danger hidden"> *</span></label>

  1014.                         <input type="text" class="form-control" id="txt_BodyFontSize" placeholder="Body Font Size">  

  1015.                         </div></div>

  1016. 

  1017.                         <div class="col-sm-6" id="div_bodyColor"><div class="floating-label-form-group-with-value"><label for="lbl" id="lbl_bodyColor">body Font Color<span class="text-danger hidden"> *</span></label>

  1018.                         <input type="color" style="width:30px; float:left; height:30px; background:transparent; border-color: transparent;margin-right:10px;color:white;margin-top:-5px" id="bodyFontColor">

  1019.                         </div></div>

  1020. 

  1021.                         </div></div></div></div><footer class="bg-white modal-footer" id="formFooter"><a href="javascript:;" id="btn_Close" class="btn btn-light btn-sm mr-auto" onclick=""> Close </a><a href="javascript:;" id="btn_ApplyTemplate" class="btn btn-primary btn-sm" > Apply </a></footer></form>`;

  1022.                         return html;

  1023.                     }

  1024.                     loadRoleSettings() {

  1025.                         let html = '<div class="row pull-right FilterSection"><a id="btnFilterPlusClick" onclick ="Unibase.Platform.Analytics.Components.CommonFilter.Instance().loadFilterSection()";><i class="fa fa-plus pull-right" id="FilterPlusClick" aria-hidden="true"></i></a></div>' +

  1026.                             '<div id="FilterSection">' +

  1027.                             '<div class="card">' +

  1028.                             '<div class="card-body">' +

  1029.                             '<a id="RemoveSubFilterSection" onclick ="Unibase.Platform.Analytics.Components.CommonFilter.Instance().RemoveFilterSection()"><i class="fa fa-times pull-right mb-20 hidden" id="RemoveFilter"></i></a>' +

  1030.                             '<input type="hidden" id="hdn_customcontrol" class="value-control" value="Unibase.Platform.Analytics.Components.CommonFilter.Instance().getobj();">' +

  1031.                             '<div class="col-sm-12"><div id="div_Widgets" class="floating-label-form-group-with-value"><label for="lbl" id="lbl_Widgets">Widgets<span class="text-danger hidden"> *</span></label>' +

  1032.                             '<select id="Widget_AutoComplete" class="form-control text-control Widgets_AutoComplete required" onchange ="Unibase.Platform.Analytics.Components.CommonFilter.Instance().loadWidgetColumns()" style="width: 100 % "><option value="0" selected="">Select Widget</option></select><input type="hidden" id="hfAutoComplete_Widget"  class="hfAutoCompleteId_Widget form - control value - control" data-isdynamic="true"/>' +

  1033.                             '</div></div>' +

  1034.                             '<div class="col-sm-12"><div id="div_Datalists" class="floating-label-form-group-with-value"><label for="lbl" id="lbl_Datalists">Datalists<span class="text-danger hidden"> *</span></label>' +

  1035.                             '<select id="Datalists_AutoComplete" onchange="Unibase.Platform.Analytics.Components.CommonFilter.Instance().loadDataLists()" class="form-control text-control Datalists_AutoComplete required" style="width:100%"><option value="0" selected="">Select DataList</option></select><input type="hidden" id="hfAutoComplete_DataList"  class="hfAutoCompleteId_DataList form-control value-control" data-isdynamic="true"/>' +

  1036.                             '</div></div>' +

  1037.                             '<div class="col-sm-12" id="div_ControlType"><div class="floating-label-form-group-with-value"><label for= "lbl" id = "lbl_ControlType" >Control Type<span class="text-danger hidden">*</span></label>' +

  1038.                             '<select id="ControlType" class="form-control text-control ControlType required" style="width:100%"><option value="0" selected="">Select Control Type</option>' +

  1039.                             '<option value="1">Select2</option>' +

  1040.                             '<option value="2">AutoComplete</option>' +

  1041.                             '<option value="3">DropDownList</option>' +

  1042.                             '</select>' +

  1043.                             '</div></div></div>' +

  1044.                             '<div class="row">' +

  1045.                             '<div class="col-sm-4"><div id="div_ValueColumns" class="floating-label-form-group-with-value"><label for="lbl" id="lbl_ValueColumns">Value Column<span class="text-danger hidden"> *</span></label>' +

  1046.                             '<select id = "ValueColumns_Select" class="form-control text-control ValueColumns_Select required" style = "width:100%" > <option value="0" selected = "">Select Value Column</option></select>' +

  1047.                             '</div></div>' +

  1048.                             '<div class="col-sm-4"><div id="div_TextColumns" class="floating-label-form-group-with-value"><label for="lbl" id="lbl_TextColumns">Text Column<span class="text-danger hidden"> *</span></label>' +

  1049.                             '<select id = "TextColumns_Select" class="form-control text-control TextColumns_Select required" style = "width:100%"><option value="0" selected = "">Select Text Column</option></select>' +

  1050.                             '</div></div>' +

  1051.                             '<div class="col-sm-3" id="div_WidgetColumns"><div class="floating-label-form-group-with-value"><label for="lbl" id="lbl_WidgetColumns">Mapped Columns<span class="text-danger hidden"> *</span></label>' +

  1052.                             '<select id = "WidgetColumns_Select" class="form-control text-control WidgetColumns_Select required" style = "width:100%"><option value="0" selected = "">Select Widget Column</option></select>' +

  1053.                             '</div></div>' +

  1054.                             '<div class="col-sm-1 my-auto text-right mt-30"><a class="btn btn-success" id="btnAddFilter" onclick="Unibase.Platform.Analytics.Components.CommonFilter.Instance().AddFilter()";><i class="fa fa-plus text-white"></i></a></div>' +

  1055.                             '<div class="col-sm-12">' +

  1056.                             '<div class="row mt-20 mb-20 ml-0">' +

  1057.                             '<div class="col-sm-3"><strong>DataList Name</strong></div>' +

  1058.                             '<div class="col-sm-2"><strong>Value Column</strong></div>' +

  1059.                             '<div class="col-sm-2"><strong>Text Column</strong></div>' +

  1060.                             '<div class="col-sm-3"><strong>Mapped Column</strong></div>' +

  1061.                             '</div></div></div>' +

  1062.                             '<div id="FilterExp"></div></div>';

  1063.                         '</div></div>';

  1064.                         return html;

  1065.                     }

  1066.                     loadLeftNav() {

  1067.                         let html = `<div class="collapse-simple">

  1068.     <div class="card">

  1069.         <div class="card-header">

  1070.             <a role="button" data-toggle="collapse" href="#re_info" aria-expanded="true">Report Info</a>

  1071.         </div>

  1072.         <div id="re_info" class="collapse show">

  1073.             <div class="card-body">

  1074.                 <input type="hidden" id="txt_reportid" value="0">

  1075.                 <div class="form-group" id="displaynameDiv">

  1076.                     <label> Display Name <span class="text-danger hidden"> *</span> </label>

  1077.                     <input type="text" class="form-control mb-10" id="txt_displayname" placeholder="Display Name"

  1078.                         value="New Report">

  1079.                 </div>

  1080.                 <div class="form-group hidden" id="tableTypeSelectDiv">

  1081.                     <label> Table Type <span class="text-danger hidden"> *</span> </label>

  1082.                     <select class="form-control custom-select " id="tableTypeSelect" required>

  1083.                         <option value="0" selected="">- Select Table Type -</option>

  1084.                         <option value="1">Report</option>

  1085.                         <option value="2">Autocomplete</option>

  1086.                     </select>

  1087.                 </div>

  1088.                 <div class="form-group hidden">

  1089.                     <label for="txt_dynamicparameters">

  1090.                         Dynamic Parameters

  1091.                     </label>

  1092.                     <textarea type="text" class="form-control" id="txt_dynamicparameters"

  1093.                         placeholder="Dynamic Parameters">

  1094.                     </textarea>

  1095.                 </div>

  1096.                 <div class="form-group hidden">

  1097.                     <label for="dependecyapps">

  1098.                         Dependency App

  1099.                     </label>

  1100.                     <select class="js-example-basic-multiple js-states form-control" id="dependecyapps"

  1101.                         multiple="multiple">

  1102.                     </select>

  1103.                     <input type="hidden" id="hfAutoComplete_dependency"

  1104.                         class="hfAutoCompleteId_dependency' form-control value-control" data-isdynamic="true" />

  1105.                 </div>

  1106.                 <div class="form-group">

  1107.                     <label for="InstalledApp_AutoComplete">

  1108.                         Installed App

  1109.                     </label>

  1110.                     <select class="form-control" id="InstalledApp_AutoComplete" placeholder="InstalledApp">

  1111.                     </select>

  1112.                     <input type="hidden" id="hfAutoComplete_InstalledApp"

  1113.                         class="hfAutoCompleteId_InstalledApp' form-control value-control" data-isdynamic="true" />

  1114.                 </div>

  1115.                 <div class="form-group hidden">

  1116.                     <label for="connectedapps">

  1117.                         Connected Apps

  1118.                     </label>

  1119.                     <select class="form-control" id="connectedapps" multiple="multiple">

  1120.                     </select>

  1121.                 </div>

  1122.                 <div class="form-group">

  1123.                     <label for="connectedreports">

  1124.                         Connected Reports

  1125.                     </label>

  1126.                     <select class="form-control" id="connectedreports" multiple="multiple">

  1127.                     </select>

  1128.                 </div>

  1129.                 <div class="form-group">

  1130.                     <label for="searchcolumns">

  1131.                         Search Columns

  1132.                     </label>

  1133.                     <select class="form-control" id="searchcolumns" multiple="multiple">

  1134.                     </select>

  1135.                 </div>

  1136.                 <div class="form-group">

  1137.                     <label for="txt_onclick">

  1138.                         On Click

  1139.                     </label>

  1140.                     <textarea value="" class="form-control" id="txt_onclick" placeholder="On Click"></textarea>

  1141.                 </div>

  1142.                 <div class="form-group">

  1143.                     <label for="txt_js">

  1144.                         Js

  1145.                     </label>

  1146.                     <textarea value="" class="form-control" id="txt_js"

  1147.                         placeholder="Js to execute in table view"></textarea>

  1148.                 </div>

  1149.                 <div class="form-group hidden">

  1150.                     <label for="identitycolumns">

  1151.                         Identity Columns

  1152.                     </label>

  1153.                     <select class="form-control" id="identitycolumns" multiple="multiple">

  1154.                     </select>

  1155.                 </div>

  1156.                 <div class="form-group">

  1157.                     <label for="notification_checkbox">

  1158.                         Notification Report

  1159.                     </label>

  1160.                     <div>

  1161.                         <input type="checkbox" class="chkNotification mr-10" onclick=""

  1162.                             id="notification_checkbox">IsNotificationReport

  1163.                     </div>

  1164.                 </div>

  1165.                 <div class="form-group">

  1166.                     <label for="count_checkbox">

  1167.                         Count

  1168.                     </label>

  1169.                     <div>

  1170.                         <input type="checkbox" class="chkCount mr-10" onclick="" id="count_checkbox"

  1171.                             checked="true">EnableCount

  1172.                     </div>

  1173.                 </div>

  1174.                 <div class="form-group">

  1175.                     <label for="enableglobaldatepicker_checkbox">

  1176.                         Date Picker

  1177.                     </label>

  1178.                     <div>

  1179.                         <input type="checkbox" class="chkCount mr-10" onclick=""

  1180.                             id="enableglobaldatepicker_checkbox">Enable Global DatePicker

  1181.                     </div>

  1182.                 </div>

  1183.                 <div class="form-group mb-0 hidden">

  1184.                     <div class="section-head mt-20 mb-10">Select Parameter

  1185.                         <button class="btn btn-theme btn-xs float-right mr-10" id="grp_reset_btn"

  1186.                             onclick="Unibase.Platform.Analytics.Reports.ReportBuilder.Instance().addParameter()">

  1187.                             <i class="las la-plus"></i> Add</button>

  1188.                     </div>

  1189.                     <div class="biz-mini-adj-drawer-wrap" id="parameter-options">

  1190.                         <div id="parameter-dropdown">

  1191.                         </div>

  1192.                     </div>

  1193.                 </div>

  1194.             </div>

  1195.         </div>

  1196.     </div>

  1197.     <div class="card hidden">

  1198.         <div class="card-header">

  1199.             <a role="button" data-toggle="collapse" href="#no_of_records" aria-expanded="true">Number of Records </a>

  1200.         </div>

  1201.         <div id="no_of_records" class="collapse show">

  1202.             <div class="card-body">

  1203.                 <input type="number" class="form-control mb-10" id="txt_totalrecords" placeholder="Total Records">

  1204.             </div>

  1205.         </div>

  1206.     </div>

  1207.     <div class="card hidden" id="XAxis">

  1208.         <div class="card-header">

  1209.             <a role="button" data-toggle="collapse" class="custom-collapse p-0 flex-between-center c-gap-10"

  1210.                 href="#x_axs" aria-expanded="true">

  1211.                 <span>X-Axis</span>

  1212.                 <span class="d-flex align-items-center c-gap-5 btn-group mr-15">

  1213.                     <div class="dropdown"><button

  1214.                             class="btn btn-icon btn-flush-biz-theme btn-rounded flush-soft-hover d-22"

  1215.                             id="xaxis_setting_btn" data-toggle="dropdown"><span class="btn-icon-wrap">

  1216.                                 <i class="fa fa-cog"></i></span></button>

  1217.                         <div class="dropdown-menu pa-5" onclick="event.stopPropagation();"><span

  1218.                                 class="dropdown-item flex-between-center c-gap-10" href="javascript:;"><label

  1219.                                     for="IsNumberAbbrevation_x" class="mb-0 cursor-pointer">Number

  1220.                                     abbrevation</label><input type="checkbox" id="IsNumberAbbrevation_x"

  1221.                                     onchange="Unibase.Platform.Analytics.Charts.ChartBuilder.Instance().isNumberAbbreviation('x');"></span>

  1222.                         </div>

  1223.                     </div>

  1224.                     <button class="btn btn-icon btn-flush-biz-theme btn-rounded flush-soft-hover d-22 reset-btn"

  1225.                         id="xaxis_reset_btn"

  1226.                         onclick="Unibase.Platform.Analytics.Charts.ChartBuilder.Instance().resetSelect2Columns('xaxis_select')"

  1227.                         data-tooltip="true" title="Reset">

  1228.                         <span class="btn-icon-wrap"><i class="fa fa-repeat"></i></span>

  1229.                     </button>

  1230.                 </span>

  1231.             </a>

  1232.         </div>

  1233.         <div id="x_axs" class="collapse show">

  1234.             <div class="card-body">

  1235.                 <select class="form-control custom-select" id="xaxis_select">

  1236.                     <option selected>- Select Columns -</option>

  1237.                 </select>

  1238.                 <div id="xaxis_selected_columns" class="dsl-block-wrap mt-10">

  1239.                 </div>

  1240.             </div>

  1241.         </div>

  1242.     </div>

  1243.     <div class="card hidden" id="YAxis">

  1244.         <div class="card-header">

  1245.             <a role="button" data-toggle="collapse" class="custom-collapse p-0 flex-between-center c-gap-10"

  1246.                 href="#y_axs" aria-expanded="true">

  1247.                 <span>Y-Axis</span>

  1248.                 <span class="d-flex align-items-center c-gap-5 btn-group mr-15">

  1249.                     <div class="dropdown"><button

  1250.                             class="btn btn-icon btn-flush-biz-theme btn-rounded flush-soft-hover d-22"

  1251.                             id="yaxis_setting_btn" data-toggle="dropdown"><span class="btn-icon-wrap"><i

  1252.                                     class="fa fa-cog"></i></span></button>

  1253.                         <div class="dropdown-menu pa-5" onclick="event.stopPropagation();"><span

  1254.                                 class="dropdown-item flex-between-center c-gap-10" href="javascript:;"><label

  1255.                                     for="IsNumberAbbrevation_y" class="mb-0 cursor-pointer">Number

  1256.                                     abbrevation</label><input type="checkbox" id="IsNumberAbbrevation_y"

  1257.                                     onchange="Unibase.Platform.Analytics.Charts.ChartBuilder.Instance().isNumberAbbreviation('y');"></span>

  1258.                         </div>

  1259.                     </div><button class="btn btn-icon btn-flush-biz-theme btn-rounded flush-soft-hover d-22 reset-btn"

  1260.                         onclick="Unibase.Platform.Analytics.Charts.ChartBuilder.Instance().resetSelect2Columns('yaxis_select')"

  1261.                         data-tooltip="true" title="Reset"><span class="btn-icon-wrap"><i

  1262.                                 class="fa fa-repeat"></i></span></button>

  1263.                 </span></a>

  1264.         </div>

  1265.         <div id="y_axs" class="collapse show">

  1266.             <div class="card-body">

  1267.                 <select class="form-control custom-select" id="yaxis_select">

  1268.                     <option selected>- Select Columns -</option>

  1269.                 </select>

  1270.                 <div id="yaxis_selected_columns" class="dsl-block-wrap mt-10">

  1271.                 </div>

  1272.             </div>

  1273.         </div>

  1274.     </div>

  1275.     <div class="card hidden" id="div_base_column">

  1276.         <div class="card-header">

  1277.             <a role="button" data-toggle="collapse" class="custom-collapse p-0 flex-between-center c-gap-10"

  1278.                 href="#base_column" aria-expanded="true">

  1279.                 <span>Chart Base Column</span>

  1280.                 <button class="btn btn-icon btn-flush-biz-theme btn-rounded flush-soft-hover d-22 reset-btn mr-15"

  1281.                     onclick="Unibase.Platform.Analytics.Charts.ChartBuilder.Instance().resetSelect2Columns('base_column_select')"

  1282.                     data-tooltip="true" title="Reset"><span class="btn-icon-wrap">

  1283.                         <i class="fa fa-repeat"></i></span>

  1284.                 </button>

  1285.             </a>

  1286.         </div>

  1287.         <div id="base_column" class="collapse show">

  1288.             <div class="card-body">

  1289.                 <select class="form-control custom-select" id="base_column_select">

  1290.                     <option selected>- Select Columns -</option>

  1291.                 </select>

  1292.                 <div id="base_column_selected_columns" class="dsl-block-wrap mt-10">

  1293.                 </div>

  1294.             </div>

  1295.         </div>

  1296.     </div>

  1297.     <div class="card table-metrics divselect2_GroupBy hidden" id="GroupBy">

  1298.         <div class="card-header">

  1299.             <a role="button" data-toggle="collapse" class="custom-collapse p-0 flex-between-center c-gap-10"

  1300.                 href="#groupby_grp" aria-expanded="true">

  1301.                 <span>Groups</span>

  1302.                 <button class="btn btn-icon btn-flush-biz-theme btn-rounded flush-soft-hover d-22 reset-btn mr-15"

  1303.                     onclick="Unibase.Platform.Analytics.Charts.ChartBuilder.Instance().resetSelect2Columns('groupby_select')"

  1304.                     data-tooltip="true" title="Reset"><span class="btn-icon-wrap">

  1305.                         <i class="fa fa-repeat"></i></span>

  1306.                 </button>

  1307.             </a>

  1308.         </div>

  1309.         <div id="groupby_grp" class="collapse show">

  1310.             <div class="card-body">

  1311.                 <select class="form-control custom-select" id="groupby_select">

  1312.                     <option selected>- Select Columns -</option>

  1313.                 </select>

  1314.                 <div id="groupby_selected_columns" class="dsl-block-wrap mt-10">

  1315.                 </div>

  1316.             </div>

  1317.         </div>

  1318.     </div>

  1319.     <div class="card table-metrics" id="Categories">

  1320.         <div class="card-header">

  1321.             <a role="button" data-toggle="collapse" class="custom-collapse p-0 flex-between-center c-gap-10"

  1322.                 href="#categories_grp" aria-expanded="true">

  1323.                 <span>Categories</span>

  1324.                 <button class="btn btn-icon btn-flush-biz-theme btn-rounded flush-soft-hover d-22 reset-btn mr-15"

  1325.                     onclick="Unibase.Platform.Analytics.Charts.ChartBuilder.Instance().resetSelect2Columns('categories_select')"

  1326.                     data-tooltip="true" title="Reset">

  1327.                     <span class="btn-icon-wrap">

  1328.                         <i class="fa fa-repeat"></i>

  1329.                     </span>

  1330.                 </button>

  1331.             </a>

  1332.         </div>

  1333.         <div id="categories_grp" class="collapse show">

  1334.             <div class="card-body">

  1335.                 <select class="form-control custom-select" id="categories_select">

  1336.                     <option selected>- Select Columns -</option>

  1337.                 </select>

  1338.                 <div id="categories_selected_columns" class="dsl-block-wrap mt-10">

  1339.                 </div>

  1340.             </div>

  1341.         </div>

  1342.     </div>

  1343.     <div class="card hidden" id="linechart">

  1344.         <div class="card-header">

  1345.             <a role="button" data-toggle="collapse" class="custom-collapse p-0 flex-between-center c-gap-10"

  1346.                 href="#line_chart" aria-expanded="true">

  1347.                 <span>Line Chart</span><button

  1348.                     class="btn btn-icon btn-flush-biz-theme btn-rounded flush-soft-hover d-22 reset-btn mr-15"

  1349.                     onclick="Unibase.Platform.Analytics.Charts.ChartBuilder.Instance().resetSelect2Columns('yaxis_select')"

  1350.                     data-tooltip="true" title="Reset"><span class="btn-icon-wrap">

  1351.                         <i class="fa fa-repeat"></i></span></button>

  1352.             </a>

  1353.         </div>

  1354.         <div id="line_chart" class="collapse show">

  1355.             <div class="card-body">

  1356.                 <select class="form-control custom-select" id="line_chart_select">

  1357.                     <option selected>- Select Columns -</option>

  1358.                 </select>

  1359.                 <div id="line_chart_selected_columns" class="dsl-block-wrap mt-10">

  1360.                 </div>

  1361.             </div>

  1362.         </div>

  1363.     </div>

  1364.     <div class="card table-metrics" id="SortColumns">

  1365.         <div class="card-header">

  1366.             <a role="button" data-toggle="collapse" class="custom-collapse p-0 flex-between-center c-gap-10"

  1367.                 href="#sortColumns" aria-expanded="true">

  1368.                 <span>Sort Columns</span>

  1369.                 <button class="btn btn-icon btn-flush-biz-theme btn-rounded flush-soft-hover d-22 reset-btn mr-15"

  1370.                     onclick="Unibase.Platform.Analytics.Charts.ChartBuilder.Instance().resetSelect2Columns('sortby_select')"

  1371.                     data-tooltip="true" title="Reset"><span class="btn-icon-wrap"><i class="fa fa-repeat"></i></button>

  1372.             </a>

  1373.         </div>

  1374.         <div id="sortColumns" class="collapse show">

  1375.             <div class="card-body">

  1376.                 <select class="form-control custom-select" id="sortColumns_select">

  1377.                     <option selected value="">- Select Columns -</option>

  1378.                 </select>

  1379.                 <div id="sort_selected_columns" class="dsl-block-wrap mt-10">

  1380.                 </div>

  1381.             </div>

  1382.         </div>

  1383.     </div>

  1384. </div>`;

  1385.                         return html;

  1386.                     }

  1387.                     static Instance() {

  1388.                         return new ReportBuilder_Template();

  1389.                     }

  1390.                 }

  1391.                 Reports.ReportBuilder_Template = ReportBuilder_Template;

  1392.             })(Reports = Analytics.Reports || (Analytics.Reports = {}));

  1393.         })(Analytics = Platform.Analytics || (Platform.Analytics = {}));

  1394.     })(Platform = Unibase.Platform || (Unibase.Platform = {}));

  1395. })(Unibase || (Unibase = {}));