ThinkChat🤖让你学习和工作更高效,注册即送10W Token,即刻开启你的AI之旅 广告
``` <div ng-init="initCtrl()" ng-controller="RightPannelCtrl"> <!--报表页面设置--> <div class="gx-page-right" pageslide ps-open="false" ps-speed="0.3" ps-size="rightSidePanelWidth()"> <!--字体设置--> <div class="gx-bb-item"> <!-- <h4>基础配置</h4> --> <h4 class="gx-item-title">标题通用设置</h4> <!--字体颜色 colorpicker --> <div class="gx-font-item"> <div class="gx-bt" style="line-height:30px;"> <span>字体颜色</span> </div> <div class="gx-con"> <div> <input minicolors="{control: 'brightness',theme: 'bootstrap',position: 'bottom right'}" id="color-input" class="form-control" type="text" ng-model="defaultColor"> </div> </div> </div> <!--字体颜色 colorpicker --> <div class="gx-font-item"> <div class="gx-bt" style="line-height:30px;"> <span>标题背景</span> </div> <div class="gx-con"> <div> <input minicolors="{control: 'brightness',theme: 'bootstrap',position: 'bottom right'}" id="color-input" class="form-control" type="text" ng-model="defaultBackground"> </div> </div> </div> <!--字体大小 colorpicker--> <div class="gx-font-item"> <div class="gx-bt"> <div class="prop-label-cell">字体大小</div> </div> <div class="gx-bt-slide"> <div slider ng-model="defaultFontSize" start={{0}} end={{100}} step=1 connect='lower'></div> </div> <div class="gx-bt-slide-input ui input"> <input ng-model="defaultFontSize" ng-disabled="element.disabled == null ? false : element.disabled()" type="text"> </div> </div> <!--字体--> <div class="gx-font-item"> <div class="gx-bt"> <div class="prop-label-cell">字体</div> </div> <div class="gx-select" > <ui-select ng-model="defaultFont" theme="selectize" ng-disabled="disabled" ng-change="onSelect(defaultFont)"> <ui-select-match>{{$select.selected.name}}</ui-select-match> <ui-select-choices repeat="item in availableFontFamilies | filter: $select.search"> <span ng-bind-html="item.name | highlight: $select.search"></span> </ui-select-choices> </ui-select> </div> </div> </div> <!--报表背景--> <div class="gx-bb-item"> <h4>报表背景</h4> <!--背景渐变--> <div class="gx-font-item"> <div class="gx-bt"> <span>背景渐变</span> </div> <div class="gx-con" style="height: 26px;" ng-class="{'en-text':vsLang.locale==='en_US'}"> <div class="btn-group"> <toggle-switch ng-model="configingReportPage.config.GradualChange" style="border:1px solid #bbb;" on-label="开启" off-label="关闭"></toggle-switch> </div> </div> </div> <!--背景渐变--> <div class="gx-font-item" ng-show="configingReportPage.config.GradualChange"> <div class="gx-bt" style="line-height:30px;"> <span>色值(1)</span> </div> <div class="gx-con"> <div> <input minicolors="{control: 'brightness',theme: 'bootstrap',position: 'bottom right'}" class="form-control" type="text" ng-model="configingReportPage.config.backgroundOne"> </div> </div> </div> <div class="gx-font-item" ng-show="configingReportPage.config.GradualChange"> <div class="gx-bt" style="line-height:30px;"> <span>色值(2)</span> </div> <div class="gx-con"> <div> <input minicolors="{control: 'brightness',theme: 'bootstrap',position: 'bottom right'}" class="form-control" type="text" ng-model="configingReportPage.config.backgroundTow"> </div> </div> </div> <div class="gx-font-item" ng-show="configingReportPage.config.GradualChange"> <div class="gx-bt"> <div class="prop-label-cell">渐变角度</div> </div> <div class="gx-bt-slide"> <div slider ng-model="configingReportPage.config.backgrouneDeg" start={{0}} end={{360}} step=0 connect='lower'></div> </div> <div class="gx-bt-slide-input ui input"> <input ng-model="configingReportPage.config.backgrouneDeg" ng-disabled="element.disabled == null ? false : element.disabled()" type="text"> </div> </div> <div class="gx-font-item"> <div class="gx-bt" style="line-height:30px;"> <span>背景色</span> </div> <div class="gx-con"> <div> <input minicolors="{control: 'brightness',theme: 'bootstrap',position: 'bottom right'}" class="form-control" type="text" ng-model="configingReportPage.config.backgroundColor"> </div> </div> </div> <!--背景图片--> <div class="gx-font-item"> <div class="gx-bt"> <div class="prop-label-cell">背景图片</div> </div> <div class="gx-con"> <input readonly="readonly" placeholder="{{vsLang.choose_image}}" class="form-control gx-con-ch-img" ng-model="backgroundImg" type="text" ng-click="openAttachmentPickerWindowPage()"> <a ng-show="backgroundImg" href="javascript:void(0);" class="gx-del-bg" ng-click="cleanAttachmentImage()">x</a> </div> </div> <!--图片方向--> <div class="gx-font-item"> <div class="gx-bt"> 图片方向 </div> <div class="gx-con"> <div ng-class="{'btn-group': true, 'en-text':vsLang.locale==='en_US'}"> <label class="gx-con-label" ng-model="bgRepeat" ng-click="changeRepeat('repeat')" ng-class="{'active': bgRepeat === 'repeat_both'}" uib-btn-radio="'repeat'" uib-tooltip="{{vsLang.repeat_both_tip}}" tooltip-placement="top" tooltip-append-to-body="true"> <span>{{vsLang.repeat_both}}</span> </label> <label class="gx-con-label" ng-model="bgRepeat" ng-click="changeRepeat('repeat-x')" ng-class="{'active': bgRepeat === 'repeat_x'}" uib-btn-radio="'repeat-x'" uib-tooltip="{{vsLang.repeat_x_tip}}" tooltip-placement="top" tooltip-append-to-body="true" > <span>{{vsLang.repeat_x}}</span> </label> <label class="gx-con-label" ng-model="bgRepeat" ng-click="changeRepeat('repeat-y')" ng-class="{'active': bgRepeat === 'repeat_y'}" uib-btn-radio="'repeat-y'" uib-tooltip="{{vsLang.repeat_y_tip}}" tooltip-placement="top" tooltip-append-to-body="true" > <span >{{vsLang.repeat_y}}</span> </label> <label class="gx-con-label" ng-model="bgRepeat" ng-click="changeRepeat('no-repeat')" ng-class="{'active': bgRepeat === 'repeat_none'}" uib-btn-radio="'no-repeat'" uib-tooltip="{{vsLang.repeat_none_tip}}" tooltip-placement="top" tooltip-append-to-body="true" > <span>{{vsLang.repeat_none}}</span> </label> </div> </div> </div> <!--位置--> <div class="gx-font-item"> <div class="gx-bt"> 位置 </div> <div class="gx-pos"> <input class="form-control" placeholder="{{vsLang.position_left}}" ng-model="posX" type="text" style="padding:4px 8px;text-align:left;color:#666;font-size:12px;"> </div> <div class="gx-pos"> <input class="form-control" placeholder="{{vsLang.position_top}}" ng-model="posY" type="text" style="padding:4px 8px;text-align:left;color:#666;font-size:12px;"> </div> </div> <!--尺寸--> <div class="gx-font-item"> <div class="gx-bt"> 尺寸 </div> <div class="gx-pos"> <input class="form-control" placeholder="{{vsLang.horizontal}}" ng-model="sizeX" type="text" style="padding:4px 8px;text-align:left;color:#666;font-size:12px;"> </div> <div class="gx-pos"> <input class="form-control" placeholder="{{vsLang.vertical}}" ng-model="sizeY" type="text" style="padding:4px 8px;text-align:left;color:#666;font-size:12px;"> </div> </div> </div> <!--报表页设置--> <div class="gx-bb-item"> <h4>报表页设置</h4> <!--列数--> <div class="gx-font-item"> <div class="gx-bt"> <div class="prop-label-cell">列数</div> </div> <div class="gx-bt-slide"> <div slider ng-model="configingReportPage.config.layoutColumns" start={{1}} end={{12}} step=1 connect='lower'></div> </div> <div class="gx-bt-slide-input ui input"> <input ng-model="configingReportPage.config.layoutColumns" ng-disabled="element.disabled == null ? false : element.disabled()" type="text"> </div> </div> <!--行类型--> <div class="gx-font-item"> <div class="gx-bt"> <span>行类型</span> </div> <div class="gx-bt-slide" style="height: 26px;" ng-class="{'en-text':vsLang.locale==='en_US'}"> <div class="btn-group"> <toggle-switch ng-model="configingReportPage.config.fixLayoutRows" style="border:1px solid #bbb;" on-label="固定" off-label="自动"></toggle-switch> </div> </div> </div> <!--行数--> <div class="gx-font-item" ng-show="configingReportPage.config.fixLayoutRows"> <div class="gx-bt"> <div class="prop-label-cell">行数</div> </div> <div class="gx-bt-slide"> <div slider ng-model="configingReportPage.config.layoutRows" start={{1}} end={{100}} step=1 connect='lower'></div> </div> <div class="gx-bt-slide-input ui input"> <input ng-model="configingReportPage.config.layoutRows" ng-disabled="element.disabled == null ? false : element.disabled()" type="text"> </div> </div> <!--网络行高类型--> <div class="gx-font-item"> <div class="gx-bt"> <span>网络行高类型</span> </div> <div class="gx-bt-slide" style="height: 26px;" ng-class="{'en-text':vsLang.locale==='en_US'}"> <div class="btn-group"> <toggle-switch ng-model="configingReportPage.config.fixLayoutRowHeight" style="border:1px solid #bbb;" on-label="固定" off-label="自动"></toggle-switch> </div> </div> </div> <!--网络行高--> <div class="gx-font-item" ng-show="configingReportPage.config.fixLayoutRowHeight"> <div class="gx-bt"> <div class="prop-label-cell">网络行高</div> </div> <div class="gx-bt-slide"> <div slider ng-model="configingReportPage.config.layoutRowHeight" start={{1}} end={{100}} step=1 connect='lower'></div> </div> <div class="gx-bt-slide-input ui input"> <input ng-model="configingReportPage.config.layoutRowHeight" ng-disabled="element.disabled == null ? false : element.disabled()" type="text"> </div> </div> <!--整屏翻页--> <div class="gx-font-item"> <div class="gx-bt"> <span>整屏翻页</span> </div> <div class="gx-bt-slide" style="height: 26px;" ng-class="{'en-text':vsLang.locale==='en_US'}"> <div class="btn-group"> <toggle-switch ng-model="configingReportPage.config.autoScroll" style="border:1px solid #bbb;" on-label="固定" off-label="自动"></toggle-switch> </div> </div> </div> <!--自动刷新--> <div class="gx-font-item"> <div class="gx-bt"> <span>自动刷新</span> </div> <div class="gx-bt-slide" style="height: 26px;" ng-class="{'en-text':vsLang.locale==='en_US'}"> <div class="btn-group"> <toggle-switch ng-model="configingReportPage.config.autoRefresh" style="border:1px solid #bbb;" on-label="固定" off-label="自动"></toggle-switch> </div> </div> </div> <!--刷新间隔(秒)--> <div class="gx-font-item" ng-show="configingReportPage.config.autoRefresh"> <div class="gx-bt"> <div class="prop-label-cell">刷新间隔(秒)</div> </div> <div class="gx-bt-slide short"> <div slider ng-model="configingReportPage.config.autoRefreshInterval" start={{5}} end={{1200}} step=1 connect='lower'></div> </div> <div class="gx-bt-slide-input ui input short"> <input ng-model="configingReportPage.config.autoRefreshInterval" ng-disabled="element.disabled == null ? false : element.disabled()" type="text"> </div> </div> <!--自动翻页--> <div class="gx-font-item"> <div class="gx-bt"> <span>自动翻页</span> </div> <div class="gx-bt-slide" style="height: 26px;" ng-class="{'en-text':vsLang.locale==='en_US'}"> <div class="btn-group"> <toggle-switch ng-model="configingReportPage.config.autoFlip" style="border:1px solid #bbb;" on-label="固定" off-label="自动"></toggle-switch> </div> </div> </div> <!--翻页间隔(分钟)--> <div class="gx-font-item" ng-show="configingReportPage.config.autoFlip"> <div class="gx-bt"> <div class="prop-label-cell">翻页间隔(分钟)</div> </div> <div class="gx-bt-slide short"> <div slider ng-model="configingReportPage.config.autoFlipInterval" start={{1}} end={{600}} step=1 connect='lower'></div> </div> <div class="gx-bt-slide-input ui input short"> <input ng-model="configingReportPage.config.autoFlipInterval" ng-disabled="element.disabled == null ? false : element.disabled()" type="text"> </div> </div> <!--下一页--> <div class="gx-font-item" ng-show="configingReportPage.config.autoFlip"> <div class="gx-bt"> 下一页 </div> <div class="gx-bt-slide"> <ui-select ng-model="configingReportPage.config.autoFlipNextPage" theme="selectize" ng-disabled="disabled"> <ui-select-match placeholder="选择报表页">{{$select.selected.name}}</ui-select-match> <ui-select-choices repeat="item in $parent.reportPages | filter: $select.search"> <span ng-bind-html="item.name | highlight: $select.search"></span> </ui-select-choices> </ui-select> </div> </div> </div> <!--报表页设置--> <div class="gx-bb-item"> <h4>报表页高级设置</h4> <!--列数--> <div class="gx-font-item"> <div class="gx-bt"> <span>WEB页面导航</span> </div> <div class="gx-bt-slide" style="height: 26px;margin-left:30px;" ng-class="{'en-text':vsLang.locale==='en_US'}"> <div class="btn-group"> <toggle-switch ng-model="$parent.currentReport.enableReportPagesPanel" style="border:1px solid #bbb;" on-label="{{vsLang.on}}" off-label="{{vsLang.off}}"></toggle-switch> </div> </div> </div> <div class="gx-font-item"> <div class="gx-bt"> <span>自动翻页控制器</span> </div> <div class="gx-bt-slide" style="height: 26px;margin-left:30px;" ng-class="{'en-text':vsLang.locale==='en_US'}"> <div class="btn-group"> <toggle-switch ng-model="$parent.currentReport.enableAutoPageControl" style="border:1px solid #bbb;" on-label="{{vsLang.on}}" off-label="{{vsLang.off}}"></toggle-switch> </div> </div> </div> <div class="gx-font-item"> <div class="gx-bt"> <span>自定义页面脚本</span> </div> <div class="gx-bt-slide" style="height: 26px;margin-left:30px;"> <button ng-click="openPageScriptEditorWindow()" class="btn btn-default" style="width:100%;"><span ng-class="{'en-text':vsLang.locale==='en_US'}">{{vsLang.edit_script}}</span></button> </div> </div> <div class="gx-font-item"> <div class="gx-bt"> <span>自定义页面样式</span> </div> <div class="gx-bt-slide" style="height: 26px;margin-left:30px;"> <button ng-click="openPageStyleEditorWindow()" class="btn btn-default" style="width:100%;"><span ng-class="{'en-text':vsLang.locale==='en_US'}">{{vsLang.edit_script}}</span></button> </div> </div> <div class="gx-font-item"> <div class="gx-bt"> <span>自定义页面Header</span> </div> <div class="gx-bt-slide" style="height: 26px;margin-left:30px;"> <button ng-click="openPageHeaderEditorWindow()" class="btn btn-default" style="width:100%;"><span ng-class="{'en-text':vsLang.locale==='en_US'}">{{vsLang.edit_script}}</span></button> </div> </div> </div> </div> </div> ```