bosun.org@v0.0.0-20210513094433-e25bc3e69a1f/cmd/bosun/web/static/partials/expr.html (about)

     1  <style type="text/css">
     2  	.ace_editor {
     3  		width: 100%;
     4  		height: 100%;
     5  	}
     6  	.resize {
     7  		margin-bottom: 15px;
     8  		border: 1px solid lightgrey;
     9  		height: 150px;
    10  		width: 100%
    11  	}
    12  	.chart {
    13  		margin: 50px;
    14  	}
    15  	.chart .rgraph {
    16  		height: 500px;
    17  		margin-bottom: 24px;
    18  	}
    19  	.chart .bar {
    20  		fill: #428bca;
    21  	}
    22  	.chart .x_tick .title {
    23  		bottom: -24px;
    24  	}
    25  	.rgraph {
    26  		position: relative;
    27  		left: 50px;
    28  	}
    29  	.y_axis {
    30  		position: absolute;
    31  		top: 0;
    32  		bottom: 0;
    33  		width: 50px;
    34  	}
    35  	.rswatch {
    36  		display: inline-block;
    37  		width: 10px;
    38  		height: 10px;
    39  		margin: 0 8px 0 0;
    40  	}
    41  	.rlabel {
    42  		display: inline-block;
    43  	}
    44  	.rline {
    45  		display: inline-block;
    46  		color: black;
    47  		margin: 0 0 0 30px;
    48  	}
    49  	.nav-tabs {
    50  		margin-bottom: 15px;
    51  		margin-top: 15px;
    52  	}
    53  </style>
    54  <div class="row">
    55  	<div class="col-sm-12">
    56  		<form>
    57  			<div class="form-group">
    58  				<div tsresizable on-resize="editor.resize()" class='resize'>
    59  					<div ui-ace="{ onLoad : aceLoaded, mode: aceMode, theme: aceTheme, advanced: { fontSize: '14px', fontFamily: 'Menlo, Monaco, Consolas, monospace' }}"
    60  					ng-model="expr" ng-keydown="keydown($event)"></div>
    61  				</div>
    62  			</div>
    63  		</form>
    64  		<form class="form-inline">
    65  			<div class="form-group">
    66  				<label class="control-label">Date</label>
    67  				<input type="text" class="form-control" ng-model="date" placeholder="yyyy-mm-dd" bs-datepicker data-date-format="yyyy-MM-dd" data-date-type="string">
    68  			</div>
    69  			<div class="form-group">
    70  				<label class="control-label">Time</label>
    71  				<input type="text" class="form-control" ng-model="time" placeholder="HH:MM:SS">
    72  			</div>
    73  			<div class="form-group">
    74  				<button class="btn btn-primary" ng-click="set()">Test</button>
    75  			</div>
    76  			<div class="pull-right">
    77  				<a class="btn btn-default" ng-href="/config?expr={{btoa(expr)}}" ng-disabled="result_type != 'scalar' && result_type != 'number'" target="_blank">Rule</a>
    78  				<a class="btn btn-default" ng-href="{{svg_url}}" ng-disabled="!svg_url" target="_blank">Image</a>
    79  			</div>
    80  		</form>
    81  	</div>
    82  </div>
    83  <ul class="nav nav-tabs">
    84  	<li ng-class="{active: tab == 'results'}"><a href ng-click="tab = 'results'">Results</a></li>
    85  	<li ng-show="graph" ng-class="{active: tab == 'graph'}"><a href ng-click="tab = 'graph'">Graph</a></li>
    86  	<li ng-show="bar" ng-class="{active: tab == 'bar'}"><a href ng-click="tab = 'bar'">Bar Chart</a></li>
    87  </ul>
    88  <div class="tab-content">
    89  	<div class="tab-pane" ng-class="{active: tab == 'results'}" ts-results></div>
    90  	<div class="tab-pane chart active" ng-if="tab == 'graph'" ts-graph data="graph" height="600"></div>
    91  	<div class="tab-pane chart active" ng-if="tab == 'bar'" ts-bar data="bar" height="600"></div>
    92  </div>