0
0
Fork 1
Spiegel von https://github.com/paviliondev/discourse-custom-wizard.git synchronisiert 2024-11-09 11:52:54 +01:00

Add text-only field && make more elements optional && style changes

Dieser Commit ist enthalten in:
Angus McLeod 2018-01-30 21:19:32 +08:00
Ursprung bb03477251
Commit c0e0338f5f
6 geänderte Dateien mit 70 neuen und 13 gelöschten Zeilen

Datei anzeigen

@ -9,6 +9,7 @@ export default {
const ajax = requirejs('wizard/lib/ajax').ajax;
const StepModel = requirejs('wizard/models/step').default;
const WizardStep = requirejs('wizard/components/wizard-step').default;
const WizardField = requirejs('wizard/components/wizard-field').default;
const getUrl = requirejs('discourse-common/lib/get-url').default;
const FieldModel = requirejs('wizard/models/wizard-field').default;
const autocomplete = requirejs('discourse/lib/autocomplete').default;
@ -139,6 +140,15 @@ export default {
}
});
WizardField.reopen({
inputComponentName: function() {
const type = this.get('field.type');
const id = this.get('field.id');
if (type === 'text-only') return false;
return (type === 'component') ? Ember.String.dasherize(id) : `wizard-field-${type}`;
}.property('field.type', 'field.id')
});
FieldModel.reopen({
check() {
let valid = this.get('valid');

Datei anzeigen

@ -0,0 +1,19 @@
<label for={{field.id}}>
{{#if field.label}}
<span class='label-value'>{{field.label}}</span>
{{/if}}
{{#if field.description}}
<div class='field-description'>{{{field.description}}}</div>
{{/if}}
</label>
{{#if inputComponentName}}
<div class='input-area'>
{{component inputComponentName field=field step=step fieldClass=fieldClass wizard=wizard}}
</div>
{{/if}}
{{#if field.errorDescription}}
<div class='field-error-description'>{{{field.errorDescription}}}</div>
{{/if}}

Datei anzeigen

@ -3,14 +3,14 @@
<h1 class='wizard-step-title'>{{step.title}}</h1>
{{/if}}
{{#if bannerImage}}
<img src={{bannerImage}} class="wizard-step-banner">
{{/if}}
{{#if step.description}}
<p class='wizard-step-description'>{{{step.description}}}</p>
{{/if}}
{{#if bannerImage}}
<img src={{bannerImage}} class="wizard-step-banner">
{{/if}}
{{#wizard-step-form step=step}}
{{#each step.fields as |field|}}
{{wizard-field field=field step=step wizard=wizard}}

Datei anzeigen

@ -67,6 +67,10 @@
text-align: center;
}
.inline-list > * {
display: inline-block;
}
.tip {
position: absolute;
bottom: 0;
@ -86,6 +90,7 @@
width: initial;
max-width: 660px;
max-height: 300px;
margin-bottom: 0;
}
.control-group {
@ -360,18 +365,16 @@ img.avatar {
}
}
.checkbox-field {
display: inline-block;
width: 100%;
.wizard-column .checkbox-field {
float: left;
&> label {
float: left;
float: right;
}
&> .input-area {
float: right;
margin: 0 20px !important;
padding: 10px 0;
float: left;
margin: 15px 20px !important;
input {
cursor: pointer;
@ -380,6 +383,31 @@ img.avatar {
}
}
.wizard-column .wizard-field {
clear: both;
margin-bottom: 1em;
.field-label {
font-weight: 400;
}
.field-description {
color: #333;
img {
width: 40px;
height: 40px;
vertical-align: middle;
padding-bottom: 5px;
margin-right: 10px;
}
input {
margin: 0 5px;
}
}
}
@keyframes rotate-forever {
0% {
transform: rotate(0deg);

Datei anzeigen

@ -1,6 +1,6 @@
class CustomWizard::Field
def self.types
@types ||= ['text', 'textarea', 'dropdown', 'image', 'checkbox', 'user-selector']
@types ||= ['text', 'textarea', 'dropdown', 'image', 'checkbox', 'user-selector', 'text-only']
end
def self.require_assets

Datei anzeigen

@ -131,7 +131,7 @@ end
def description
return object.description if object.description
I18n.t("#{object.key || i18n_key}.description", default: '')
I18n.t("#{object.key || i18n_key}.description", default: '', base_url: Discourse.base_url)
end
def placeholder