Skip to content

Commit 48fac5e

Browse files
committed
Finished componenting, fixed settings i18n
1 parent 9c6cae2 commit 48fac5e

File tree

10 files changed

+501
-390
lines changed

10 files changed

+501
-390
lines changed

package.json

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "lazy-admin",
3-
"version": "0.4.6",
3+
"version": "0.4.7",
44
"description": "GUI for PowerShell scripts to simplify day to day IT tasks.",
55
"productName": "Lazy Admin",
66
"cordovaId": "eu.houby-studio.lazy-admin",
@@ -51,4 +51,4 @@
5151
"browserslist": [
5252
"last 1 version, not dead, ie >= 11"
5353
]
54-
}
54+
}

src/assets/.gitkeep

Whitespace-only changes.

src/boot/.gitkeep

Whitespace-only changes.

src/boot/components.js

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,9 @@ import HistoryDrawer from 'components/HistoryDrawer.vue'
66
import HelpDialog from 'components/HelpDialog.vue'
77
import ProgressDialog from 'components/ProgressDialog.vue'
88
import ResultsDialog from 'components/ResultsDialog.vue'
9+
import ExecuteDialog from 'components/ExecuteDialog.vue'
10+
import CommandDialog from 'components/CommandDialog.vue'
11+
import ScriptsTable from 'components/ScriptsTable.vue'
912

1013
// add components to Vue
1114
export default async ({ Vue }) => {
@@ -16,4 +19,7 @@ export default async ({ Vue }) => {
1619
Vue.component('HelpDialog', HelpDialog)
1720
Vue.component('ProgressDialog', ProgressDialog)
1821
Vue.component('ResultsDialog', ResultsDialog)
22+
Vue.component('ExecuteDialog', ExecuteDialog)
23+
Vue.component('CommandDialog', CommandDialog)
24+
Vue.component('ScriptsTable', ScriptsTable)
1925
}

src/components/CommandDialog.vue

Lines changed: 244 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,244 @@
1+
<template>
2+
<q-dialog
3+
v-model="localValue"
4+
:full-width="commandDialogMaximized"
5+
:full-height="commandDialogMaximized"
6+
@hide="$emit('hide')"
7+
transition-show="scale"
8+
transition-hide="scale"
9+
no-backdrop-dismiss
10+
>
11+
<q-card class="full-width">
12+
<q-form
13+
@submit="$emit('submit')"
14+
@reset="resetForm"
15+
autofocus
16+
>
17+
<q-card-section>
18+
<div class="row">
19+
<div class="col">
20+
<div class="text-h6 float-left">
21+
<q-icon :name="currentCommandMaster.icon ? currentCommandMaster.icon : 'mdi-powershell'"></q-icon> {{ currentCommandMaster.commandName }} {{ currentWorkflowIndex +1 }}/{{ currentCommandMaster.workflow ? currentCommandMaster.workflow.length + 1 : 1 }}
22+
</div>
23+
</div>
24+
<div class="col">
25+
<q-card-actions
26+
align="right"
27+
class="text-primary q-pa-none"
28+
>
29+
30+
<q-btn
31+
:ripple="false"
32+
:icon="commandDialogMaximized ? 'fas fa-compress-alt' : 'fas fa-expand-alt'"
33+
@click="commandDialogMaximized = !commandDialogMaximized"
34+
tabindex="-1"
35+
flat
36+
/>
37+
</q-card-actions>
38+
</div>
39+
</div>
40+
41+
</q-card-section>
42+
<q-card-section class="q-pt-none">
43+
<!-- Workflows only - Previous command parameters -->
44+
<q-expansion-item
45+
v-if="currentCommand.passedParameters ? currentCommand.passedParameters.length > 0 : false"
46+
:default-opened="resultsSelected[currentWorkflowIndex].length > 1"
47+
:caption="$t('workflowReadOnly')"
48+
:label="$t('workflowParameters')"
49+
:dense="denseInput"
50+
icon="mdi-cogs"
51+
expand-separator
52+
>
53+
<q-input
54+
v-for="param in currentCommand.passedParameters"
55+
v-model="returnParams[returnParamsPaginate + '__' + param.parameter]"
56+
:label="param.parameter"
57+
:key="param.parameter"
58+
:dense="denseInput"
59+
type="text"
60+
hide-bottom-space
61+
standout
62+
readonly
63+
></q-input>
64+
</q-expansion-item>
65+
<q-separator
66+
v-if="currentCommand.passedParameters ? currentCommand.passedParameters.length > 0 : false"
67+
spaced
68+
></q-separator>
69+
<!-- Command parameters -->
70+
<div
71+
v-for="(param, index) in currentCommand.parameters"
72+
:key="param.parameter"
73+
class="q-mb-sm"
74+
>
75+
<component
76+
v-model="returnParams[returnParamsPaginate + '__' + param.parameter]"
77+
:tabindex="index + 1"
78+
:is="paramType[param.type][0]"
79+
:toggle-indeterminate="paramType[param.type][1]"
80+
:false-value="paramType[param.type][1] ? 'false' : false"
81+
:label="param.parameter"
82+
:label-color="param.required ? 'primary' : ''"
83+
:rules="param.required ? [ val => val && val.length > 0 || $t('requiredField') ] : [] "
84+
:type="paramType[param.type][1]"
85+
:dense="denseInput"
86+
:options="param.options"
87+
:multiple="paramType[param.type][1]"
88+
@keydown.enter.prevent
89+
bottom-slots
90+
filled
91+
clearable
92+
lazy-rules
93+
>
94+
<!-- Template showing parameter informatin button -->
95+
<template v-slot:append>
96+
<q-btn
97+
@click.capture.stop="showParameterHelp(param)"
98+
padding="none"
99+
class="btn-param-info"
100+
icon="info"
101+
dense
102+
round
103+
flat
104+
></q-btn>
105+
</template>
106+
<!-- Template showing parameter information button -->
107+
<template v-slot:counter>
108+
<p>{{ param.required ? $t('requiredParam') : $t('optionalParam') }} | {{ param.type }}</p>
109+
</template>
110+
</component>
111+
<!-- Hint for components which lack native hint slot -->
112+
<span
113+
v-if="param.type === 'Boolean' || param.type === 'Switch'"
114+
class="hint-opacity text-caption float-right"
115+
>
116+
<q-btn
117+
@click="showParameterHelp(param)"
118+
padding="none"
119+
class="btn-param-info"
120+
size="sm"
121+
icon="info"
122+
dense
123+
round
124+
flat
125+
></q-btn>
126+
{{ param.required ? $t('requiredParam') : $t('optionalParam') }} | {{ param.type }}
127+
</span>
128+
</div>
129+
</q-card-section>
130+
<!-- Actions for command dialog -->
131+
<q-card-actions
132+
align="right"
133+
class="text-primary"
134+
>
135+
<!-- Show pagination if there is more than one selected result from previous command -->
136+
<q-pagination
137+
v-if="resultsSelected[currentWorkflowIndex -1 ] ? resultsSelected[currentWorkflowIndex-1].length > 1 : false"
138+
v-model="returnParamsPaginate"
139+
:max="resultsSelected[currentWorkflowIndex-1].length"
140+
:input="true"
141+
>
142+
</q-pagination>
143+
<q-btn
144+
v-close-popup
145+
:label="$t('cancel')"
146+
tabindex="1000"
147+
flat
148+
/>
149+
<q-btn
150+
:label="$t('reset')"
151+
type="reset"
152+
tabindex="999"
153+
flat
154+
/>
155+
<q-btn
156+
:label="$t('launch')"
157+
type="submit"
158+
tabindex="998"
159+
flat
160+
/>
161+
</q-card-actions>
162+
</q-form>
163+
</q-card>
164+
</q-dialog>
165+
</template>
166+
167+
<script>
168+
import { mapGetters } from 'vuex'
169+
export default {
170+
props: {
171+
value: { required: true, type: Boolean },
172+
currentCommand: { required: true, type: Object },
173+
currentCommandMaster: { required: true, type: Object },
174+
currentWorkflowIndex: { required: true, type: Number },
175+
resultsSelected: { required: true, type: Array },
176+
returnParams: { required: true, type: Object }
177+
},
178+
data () {
179+
return {
180+
returnParamsPaginate: 1, // In multiple selection workflows allows parameters for each selection
181+
paramType: { // Table translating PowerShell variable types to Quasar components names and options
182+
'String': ['q-input', 'text'],
183+
'Number': ['q-input', 'number'],
184+
'ScriptBlock': ['q-input', 'textarea'],
185+
'Switch': ['q-toggle', false],
186+
'Boolean': ['q-toggle', true],
187+
'Select': ['q-select', false],
188+
'MultiSelect': ['q-select', true]
189+
}
190+
}
191+
},
192+
computed: {
193+
...mapGetters('lazystore', ['getCommandMaximized', 'getDenseInput']),
194+
commandDialogMaximized: {
195+
get () {
196+
return this.getCommandMaximized
197+
},
198+
set (val) {
199+
this.$store.dispatch('lazystore/setCommandMaximized', val)
200+
}
201+
},
202+
denseInput: function () {
203+
return this.getDenseInput
204+
},
205+
localValue: {
206+
get () {
207+
return this.value
208+
},
209+
set (val) {
210+
this.$emit('input', val)
211+
}
212+
}
213+
},
214+
methods: {
215+
resetForm () {
216+
// Always assume one set of parameters passed, unless there is more than one resultsSelected
217+
let parametersSetsNum = 1
218+
if (this.resultsSelected[this.currentWorkflowIndex].length > 1) {
219+
parametersSetsNum = this.resultsSelected[this.currentWorkflowIndex].length
220+
}
221+
// Loop through parameterSets and get parameters for each one to resultsCommand
222+
for (let paramSetIndex = 1; paramSetIndex <= parametersSetsNum; paramSetIndex++) {
223+
for (let i = 0; i < this.currentCommand.parameters.length; i++) {
224+
this.returnParams[paramSetIndex + '__' + this.currentCommand.parameters[i].parameter] = ''
225+
}
226+
}
227+
},
228+
showParameterHelp (param) {
229+
this.$q.dialog({
230+
title: param.parameter,
231+
message: `
232+
${this.$t('requiredParam')}: ${param.required ? this.$t('yes') : this.$t('no')}<br>
233+
${this.$t('type')}: ${param.type}<br>
234+
${this.$t('help')}: ${param.hint ? param.hint[this.language] || param.hint['default'] : this.$t('none')}<br>
235+
${this.$t('format')}:<br>
236+
<code class="text-no-wrap">${param.format ? param.format : this.$t('none')}</code>
237+
`,
238+
html: true,
239+
color: 'primary'
240+
})
241+
}
242+
}
243+
}
244+
</script>

src/components/ExecuteDialog.vue

Lines changed: 74 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,74 @@
1+
<template>
2+
<q-dialog
3+
v-model="localValue"
4+
transition-show="scale"
5+
transition-hide="scale"
6+
full-width
7+
no-backdrop-dismiss
8+
>
9+
<q-card class="full-width">
10+
<q-form
11+
@submit="$emit('execute-command')"
12+
autofocus
13+
>
14+
<q-card-section>
15+
<div class="text-h6">
16+
<q-icon
17+
name="mdi-help-circle"
18+
size="md"
19+
></q-icon> {{ $t('confirm') }}
20+
</div>
21+
</q-card-section>
22+
<q-card-section> {{ $t('confirmMsg') }} </q-card-section>
23+
<q-card-section>
24+
<div class="text-h6">
25+
{{ $t('commandToBeExecuted') }}
26+
</div>
27+
</q-card-section>
28+
<q-card-section>
29+
<prism
30+
:code="resultCommand"
31+
language="powershell"
32+
></prism>
33+
</q-card-section>
34+
<q-card-actions
35+
align="right"
36+
class="text-primary"
37+
>
38+
<q-btn
39+
v-close-popup
40+
:label="$t('cancel')"
41+
flat
42+
/>
43+
<q-btn
44+
v-close-popup
45+
:label="$t('launch')"
46+
type="submit"
47+
flat
48+
/>
49+
</q-card-actions>
50+
</q-form>
51+
</q-card>
52+
</q-dialog>
53+
</template>
54+
55+
<script>
56+
import Prism from 'vue-prismjs'
57+
export default {
58+
components: { Prism },
59+
props: {
60+
value: { required: true, type: Boolean },
61+
resultCommand: { required: true, type: String }
62+
},
63+
computed: {
64+
localValue: {
65+
get () {
66+
return this.value
67+
},
68+
set (val) {
69+
this.$emit('input', val)
70+
}
71+
}
72+
}
73+
}
74+
</script>

0 commit comments

Comments
 (0)