mirror of
https://github.com/Azure/cosmos-explorer.git
synced 2025-01-23 17:30:23 +00:00
90 lines
3.3 KiB
HTML
90 lines
3.3 KiB
HTML
<div class="tab-pane flexContainer" data-bind="attr:{ id: tabId }" role="tabpanel">
|
|
<!-- Stored Procedure Tab Form - Start -->
|
|
<div class="storedTabForm flexContainer">
|
|
<div class="formTitleFirst">Stored Procedure Id</div>
|
|
<span class="formTitleTextbox">
|
|
<input
|
|
class="formTree"
|
|
type="text"
|
|
required
|
|
pattern="[^/?#\\]*[^/?# \\]"
|
|
title="May not end with space nor contain characters '\' '/' '#' '?'"
|
|
aria-label="Stored procedure id"
|
|
placeholder="Enter the new stored procedure id"
|
|
size="40"
|
|
data-bind="
|
|
textInput: id"
|
|
/>
|
|
</span>
|
|
<div class="spUdfTriggerHeader">Stored Procedure Body</div>
|
|
<editor
|
|
params="{
|
|
content: originalSprocBody,
|
|
contentType: 'javascript',
|
|
isReadOnly: false,
|
|
ariaLabel: 'Stored procedure body',
|
|
lineNumbers: 'on',
|
|
updatedContent: editorContent,
|
|
theme: _theme
|
|
}"
|
|
data-bind="attr: { id: editorId }"
|
|
></editor>
|
|
<!-- Results & Errors Content - Start-->
|
|
<div class="results-container" data-bind="visible: hasResults">
|
|
<div
|
|
class="toggles"
|
|
id="execute-storedproc-toggles"
|
|
aria-label="Successful execution of stored procedure"
|
|
data-bind="event: { keydown: onToggleKeyDown }"
|
|
tabindex="0"
|
|
>
|
|
<div class="tab">
|
|
<input type="radio" class="radio" value="result" />
|
|
<span
|
|
class="toggleSwitch"
|
|
role="button"
|
|
tabindex="0"
|
|
data-bind="click: toggleResult, css:{ selectedToggle: isResultToggled(), unselectedToggle: !isResultToggled() }"
|
|
aria-label="Result"
|
|
>Result</span
|
|
>
|
|
</div>
|
|
<div class="tab">
|
|
<input type="radio" class="radio" value="logs" />
|
|
<span
|
|
class="toggleSwitch"
|
|
role="button"
|
|
tabindex="0"
|
|
data-bind="click: toggleLogs, css:{ selectedToggle: isLogsToggled(), unselectedToggle: !isLogsToggled() }"
|
|
aria-label="console.log"
|
|
>console.log</span
|
|
>
|
|
</div>
|
|
</div>
|
|
<json-editor
|
|
params="{ content: resultsData, isReadOnly: true, ariaLabel: 'Execute stored procedure result' }"
|
|
data-bind="attr: { id: executeResultsEditorId }, visible: hasResults() && isResultToggled()"
|
|
>
|
|
</json-editor>
|
|
<json-editor
|
|
params="{ content: logsData, isReadOnly: true, ariaLabel: 'Execute stored procedure logs' }"
|
|
data-bind="attr: { id: executeLogsEditorId }, visible: hasResults() && isLogsToggled()"
|
|
></json-editor>
|
|
</div>
|
|
<div class="errors-container" data-bind="visible: hasErrors">
|
|
<div class="errors-header">Errors:</div>
|
|
<div class="errorContent">
|
|
<span class="errorMessage" data-bind="text: error"></span>
|
|
<span class="errorDetailsLink">
|
|
<a
|
|
data-bind="click: $data.onErrorDetailsClick, event: { keypress: $data.onErrorDetailsKeyPress }"
|
|
aria-label="Error details link"
|
|
>More details</a
|
|
>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
<!-- Results & Errors Content - End-->
|
|
</div>
|
|
</div>
|