Commit 8efce170 authored by MaxSol1's avatar MaxSol1
Browse files

templates feature enhancement part 1

parent 86ff6963
...@@ -5,6 +5,6 @@ go 1.13 ...@@ -5,6 +5,6 @@ go 1.13
require ( require (
github.com/BurntSushi/toml v0.3.1 github.com/BurntSushi/toml v0.3.1
github.com/go-chi/chi v4.1.1+incompatible github.com/go-chi/chi v4.1.1+incompatible
github.com/mailgun/groupcache/v2 v2.2.1 // indirect github.com/mailgun/groupcache/v2 v2.2.1
golang.org/x/net v0.0.0-20200528225125-3c3fba18258b // indirect golang.org/x/net v0.0.0-20200528225125-3c3fba18258b // indirect
) )
...@@ -48,25 +48,37 @@ func handleCreateTemplate(w http.ResponseWriter, r *http.Request) { ...@@ -48,25 +48,37 @@ func handleCreateTemplate(w http.ResponseWriter, r *http.Request) {
var dashboardX Dashboard var dashboardX Dashboard
json.Unmarshal([]byte(dash), &dashboardX) json.Unmarshal([]byte(dash), &dashboardX)
regID, err := regexp.Compile(`"([^"]*)"`)
if err != nil {
log.Printf("Error compiling regex: %w", err.Error())
}
for i := range dashboardX.Elements { for i := range dashboardX.Elements {
for _, sqs := range qs { for _, sqs := range qs {
if strings.Contains(dashboardX.Elements[i].Options.Filter, fmt.Sprint("~", sqs, "~")) { reg, err := regexp.Compile(fmt.Sprint("~(", sqs, ")~"))
reg, err := regexp.Compile(fmt.Sprint("~(", sqs, ")~"))
if err != nil { if err != nil {
log.Printf("Error compiling regex: %w", err.Error()) log.Printf("Error compiling regex: %w", err.Error())
} }
regID, err := regexp.Compile(`"([^"]*)"`) if strings.Contains(dashboardX.Elements[i].Options.Filter, fmt.Sprint("~", sqs, "~")) {
if r.URL.Query().Get(sqs) != "" {
dashboardX.Elements[i].Options.Filter = reg.ReplaceAllString(dashboardX.Elements[i].Options.Filter, r.URL.Query().Get(sqs))
if err != nil { dashboardX.Elements[i].Options.ID = strings.Trim(regID.FindString(dashboardX.Elements[i].Options.Filter), "\"")
log.Printf("Error compiling regex: %w", err.Error())
} }
}
if strings.Contains(dashboardX.Elements[i].Options.LinkURL, fmt.Sprint("~", sqs, "~")) {
if r.URL.Query().Get(sqs) != "" { if r.URL.Query().Get(sqs) != "" {
dashboardX.Elements[i].Options.Filter = reg.ReplaceAllString(dashboardX.Elements[i].Options.Filter, r.URL.Query().Get(sqs)) dashboardX.Elements[i].Options.LinkURL = reg.ReplaceAllString(dashboardX.Elements[i].Options.LinkURL, r.URL.Query().Get(sqs))
}
}
dashboardX.Elements[i].Options.ID = strings.Trim(regID.FindString(dashboardX.Elements[i].Options.Filter), "\"") if strings.Contains(dashboardX.Elements[i].Options.Text, fmt.Sprint("~", sqs, "~")) {
if r.URL.Query().Get(sqs) != "" {
dashboardX.Elements[i].Options.Text = reg.ReplaceAllString(dashboardX.Elements[i].Options.Text, r.URL.Query().Get(sqs))
} }
} }
} }
......
...@@ -339,7 +339,7 @@ function DashboardElements({dashboardDispatch, selectedElementId, elements, high ...@@ -339,7 +339,7 @@ function DashboardElements({dashboardDispatch, selectedElementId, elements, high
if(element.type === 'check-svg') { ele = <CheckSVG options={element.options} slug={slug} dashboard={dashboard}/> } if(element.type === 'check-svg') { ele = <CheckSVG options={element.options} slug={slug} dashboard={dashboard}/> }
if(element.type === 'check-image') { ele = <CheckImage options={element.options} slug={slug} dashboard={dashboard}/> } if(element.type === 'check-image') { ele = <CheckImage options={element.options} slug={slug} dashboard={dashboard}/> }
if(element.type === 'check-line') { ele = <CheckLine options={element.options} slug={slug} dashboard={dashboard}/> } if(element.type === 'check-line') { ele = <CheckLine options={element.options} slug={slug} dashboard={dashboard}/> }
if(element.type === 'static-text') { ele = <StaticText options={element.options}/> } if(element.type === 'static-text') { ele = <StaticText options={element.options} vars={dashboard.variables}/> }
if(element.type === 'dynamic-text') { ele = <DynamicText options={element.options}/> } if(element.type === 'dynamic-text') { ele = <DynamicText options={element.options}/> }
if(element.type === 'static-ticker') { ele = <StaticTicker options={element.options}/> } if(element.type === 'static-ticker') { ele = <StaticTicker options={element.options}/> }
if(element.type === 'static-svg') { ele = <StaticSVG options={element.options}/> } if(element.type === 'static-svg') { ele = <StaticSVG options={element.options}/> }
...@@ -541,19 +541,30 @@ function VariablesModal({hide, dashboard, slug}) { ...@@ -541,19 +541,30 @@ function VariablesModal({hide, dashboard, slug}) {
let matched = [] let matched = []
inputs.forEach(changed => { inputs.forEach(changed => {
if (changed.key !== changed.ori ) { if (changed.key !== changed.ori) {
matched.push(changed); matched.push(changed);
} }
}); });
dash.elements.forEach(ele => { dash.elements.forEach(ele => {
matched.forEach(key => { matched.forEach(key => {
if (ele.options.filter !== null) { let reg = new RegExp('~(' + key.ori + ')~', 'g');
if (ele.options.hasOwnProperty('filter') && ele.options.filter !== null) {
if (ele.options.filter.includes(`~${key.ori}~`)) { if (ele.options.filter.includes(`~${key.ori}~`)) {
let reg = new RegExp('~(' + key.ori + ')~', 'g');
ele.options.filter = ele.options.filter.replaceAll(reg, `~${key.key}~`); ele.options.filter = ele.options.filter.replaceAll(reg, `~${key.key}~`);
} }
} }
if (ele.options.hasOwnProperty('linkURL') && ele.options.linkURL !== null) {
if (ele.options.linkURL.includes(`~${key.ori}~`)) {
ele.options.linkURL = ele.options.linkURL.replaceAll(reg, `~${key.key}~`);
}
}
if (ele.options.hasOwnProperty('text') && ele.options.text !== null) {
if (ele.options.text.includes(`~${key.ori}~`)) {
ele.options.text = ele.options.text.replaceAll(reg, `~${key.key}~`);
}
}
}) })
}) })
......
...@@ -27,11 +27,11 @@ export async function getIcingaServiceGroups() { ...@@ -27,11 +27,11 @@ export async function getIcingaServiceGroups() {
} }
export async function getIcingaObjectState(objectType, filter, dashboard) { export async function getIcingaObjectState(objectType, filter, dashboard) {
return fetchHandler(`/icinga/check_state?object_type=${encodeURIComponent(objectType)};filter=${encodeURIComponent(filterReplace(filter, dashboard))}`); return fetchHandler(`/icinga/check_state?object_type=${encodeURIComponent(objectType)}&filter=${encodeURIComponent(filterReplace(filter, dashboard))}`);
} }
export async function getCheckResult(objType, object, attrs="last_check_result") { export async function getCheckResult(objType, object, attrs="last_check_result") {
return fetchHandler(`/icinga/check_result?objtype=${objType};object=${encodeURIComponent(object)};attrs=${encodeURIComponent(attrs)}`); return fetchHandler(`/icinga/check_result?objtype=${objType}&object=${encodeURIComponent(object)}&attrs=${encodeURIComponent(attrs)}`);
} }
export async function getDashboard(slug) { export async function getDashboard(slug) {
......
...@@ -65,8 +65,9 @@ export function StaticTextOptions({options, updateOptions}) { ...@@ -65,8 +65,9 @@ export function StaticTextOptions({options, updateOptions}) {
</Fragment> </Fragment>
} }
export function StaticText({options}) { export function StaticText({options, vars}) {
let styles = 'height: 100%; '; let styles = 'height: 100%; ';
let text = options.text;
if(typeof options.fontSize !== 'undefined') { if(typeof options.fontSize !== 'undefined') {
styles += `font-size: ${options.fontSize}px; `; styles += `font-size: ${options.fontSize}px; `;
...@@ -90,7 +91,14 @@ export function StaticText({options}) { ...@@ -90,7 +91,14 @@ export function StaticText({options}) {
styles += `text-align: center; line-height: 470%; `; styles += `text-align: center; line-height: 470%; `;
} }
return <div class="check-content text" style={styles}>{options.text}</div> for (const [key, property] of Object.entries(vars)) {
if (options.text.includes(`~${key}~`)) {
let reg = new RegExp('~(' + key + ')~', 'g');
text = text.replaceAll(reg, property);
}
}
return <div class="check-content text" style={styles}>{text}</div>
} }
export const StaticTextDefaults = { export const StaticTextDefaults = {
......
...@@ -436,23 +436,25 @@ export function linkHelper(element, ele, dashboard){ ...@@ -436,23 +436,25 @@ export function linkHelper(element, ele, dashboard){
target = 'blank'; target = 'blank';
} }
let encoded = encodeURIComponent(element.options.linkURL);
if (element.options.linkURL && element.type === 'static-text') { if (element.options.linkURL && element.type === 'static-text') {
if (element.options.linkURL.includes('http') ) { if (element.options.linkURL.includes('http') ) {
ele = <a id="text-link" href={element.options.linkURL} target={target}>{ele}</a> ele = <a id="text-link" href={encoded} target={target}>{ele}</a>
} else { } else {
ele = <a id="text-link" href={`https://${element.options.linkURL}`} target={target}>{ele}</a> ele = <a id="text-link" href={`https://${encoded}`} target={target}>{ele}</a>
} }
} if (element.options.linkURL && element.type === 'dynamic-text') { } if (element.options.linkURL && element.type === 'dynamic-text') {
if (element.options.linkURL.includes('http') ) { if (element.options.linkURL.includes('http') ) {
ele = <a id="text-link" href={element.options.linkURL} target={target}>{ele}</a> ele = <a id="text-link" href={encoded} target={target}>{ele}</a>
} else { } else {
ele = <a id="text-link" href={`https://${element.options.linkURL}`} target={target}>{ele}</a> ele = <a id="text-link" href={`https://${encoded}`} target={target}>{ele}</a>
} }
} else if (element.options.linkURL) { } else if (element.options.linkURL) {
if (element.options.linkURL.includes('http') ) { if (element.options.linkURL.includes('http') ) {
ele = <a id="a-link" href={element.options.linkURL} target={target}>{ele}</a> ele = <a id="a-link" href={encoded} target={target}>{ele}</a>
} else { } else {
ele = <a id="a-link" href={`https://${element.options.linkURL}`} target={target}>{ele}</a> ele = <a id="a-link" href={`https://${encoded}`} target={target}>{ele}</a>
} }
} }
......
...@@ -56,7 +56,7 @@ export function Viewer({slug, dashboardReducer}) { ...@@ -56,7 +56,7 @@ export function Viewer({slug, dashboardReducer}) {
if(element.type === 'check-svg') { ele = <CheckSVG options={element.options} dashboard={dashboard} slug={slug}/> } if(element.type === 'check-svg') { ele = <CheckSVG options={element.options} dashboard={dashboard} slug={slug}/> }
if(element.type === 'check-image') { ele = <CheckImage options={element.options} dashboard={dashboard} slug={slug}/> } if(element.type === 'check-image') { ele = <CheckImage options={element.options} dashboard={dashboard} slug={slug}/> }
if(element.type === 'check-line') { ele = <CheckLine options={element.options} dashboard={dashboard} slug={slug}/> } if(element.type === 'check-line') { ele = <CheckLine options={element.options} dashboard={dashboard} slug={slug}/> }
if(element.type === 'static-text') { ele = <StaticText options={element.options}/> } if(element.type === 'static-text') { ele = <StaticText options={element.options} vars={dashboard.variables} /> }
if(element.type === 'dynamic-text') { ele = <DynamicText options={element.options}/> } if(element.type === 'dynamic-text') { ele = <DynamicText options={element.options}/> }
if(element.type === 'static-ticker') { ele = <StaticTicker options={element.options}/> } if(element.type === 'static-ticker') { ele = <StaticTicker options={element.options}/> }
if(element.type === 'static-svg') { ele = <StaticSVG options={element.options}/> } if(element.type === 'static-svg') { ele = <StaticSVG options={element.options}/> }
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment