Adding Form front with the new form
continuous-integration/drone/push Build is passing Details

formFront
Dorian HODIN 10 months ago
parent eb5dc52a84
commit 4f6bdfb558

@ -6,9 +6,7 @@
<component name="ChangeListManager"> <component name="ChangeListManager">
<list default="true" id="c5a06892-a370-4c6a-a9cf-5d61f93a285b" name="Changes" comment="Adding Front"> <list default="true" id="c5a06892-a370-4c6a-a9cf-5d61f93a285b" name="Changes" comment="Adding Front">
<change beforePath="$PROJECT_DIR$/.idea/workspace.xml" beforeDir="false" afterPath="$PROJECT_DIR$/.idea/workspace.xml" afterDir="false" /> <change beforePath="$PROJECT_DIR$/.idea/workspace.xml" beforeDir="false" afterPath="$PROJECT_DIR$/.idea/workspace.xml" afterDir="false" />
<change beforePath="$PROJECT_DIR$/daidokoro/src/app/component/recipe-form/recipe-form.component.css" beforeDir="false" />
<change beforePath="$PROJECT_DIR$/daidokoro/src/app/component/recipe-form/recipe-form.component.html" beforeDir="false" afterPath="$PROJECT_DIR$/daidokoro/src/app/component/recipe-form/recipe-form.component.html" afterDir="false" /> <change beforePath="$PROJECT_DIR$/daidokoro/src/app/component/recipe-form/recipe-form.component.html" beforeDir="false" afterPath="$PROJECT_DIR$/daidokoro/src/app/component/recipe-form/recipe-form.component.html" afterDir="false" />
<change beforePath="$PROJECT_DIR$/daidokoro/src/app/component/recipe-form/recipe-form.component.ts" beforeDir="false" afterPath="$PROJECT_DIR$/daidokoro/src/app/component/recipe-form/recipe-form.component.ts" afterDir="false" />
</list> </list>
<option name="SHOW_DIALOG" value="false" /> <option name="SHOW_DIALOG" value="false" />
<option name="HIGHLIGHT_CONFLICTS" value="true" /> <option name="HIGHLIGHT_CONFLICTS" value="true" />
@ -41,22 +39,22 @@
<option name="hideEmptyMiddlePackages" value="true" /> <option name="hideEmptyMiddlePackages" value="true" />
<option name="showLibraryContents" value="true" /> <option name="showLibraryContents" value="true" />
</component> </component>
<component name="PropertiesComponent"><![CDATA[{ <component name="PropertiesComponent">{
"keyToString": { &quot;keyToString&quot;: {
"ASKED_ADD_EXTERNAL_FILES": "true", &quot;ASKED_ADD_EXTERNAL_FILES&quot;: &quot;true&quot;,
"RunOnceActivity.ShowReadmeOnStart": "true", &quot;RunOnceActivity.ShowReadmeOnStart&quot;: &quot;true&quot;,
"git-widget-placeholder": "formFront", &quot;git-widget-placeholder&quot;: &quot;formFront&quot;,
"last_opened_file_path": "/home/dorian/Documents/but3/Angular/Daidokoro", &quot;last_opened_file_path&quot;: &quot;/home/dorian/Documents/but3/Angular/Daidokoro&quot;,
"node.js.detected.package.eslint": "true", &quot;node.js.detected.package.eslint&quot;: &quot;true&quot;,
"node.js.detected.package.tslint": "true", &quot;node.js.detected.package.tslint&quot;: &quot;true&quot;,
"node.js.selected.package.eslint": "(autodetect)", &quot;node.js.selected.package.eslint&quot;: &quot;(autodetect)&quot;,
"node.js.selected.package.tslint": "(autodetect)", &quot;node.js.selected.package.tslint&quot;: &quot;(autodetect)&quot;,
"nodejs_package_manager_path": "npm", &quot;nodejs_package_manager_path&quot;: &quot;npm&quot;,
"settings.editor.selected.configurable": "preferences.lookFeel", &quot;settings.editor.selected.configurable&quot;: &quot;preferences.lookFeel&quot;,
"ts.external.directory.path": "/home/dorian/Documents/but3/Angular/Daidokoro/daidokoro/node_modules/typescript/lib", &quot;ts.external.directory.path&quot;: &quot;/home/dorian/Documents/but3/Angular/Daidokoro/daidokoro/node_modules/typescript/lib&quot;,
"vue.rearranger.settings.migration": "true" &quot;vue.rearranger.settings.migration&quot;: &quot;true&quot;
} }
}]]></component> }</component>
<component name="RecentsManager"> <component name="RecentsManager">
<key name="MoveFile.RECENT_KEYS"> <key name="MoveFile.RECENT_KEYS">
<recent name="$PROJECT_DIR$/daidokoro/public" /> <recent name="$PROJECT_DIR$/daidokoro/public" />

@ -104,12 +104,14 @@
<label for="image">Image: </label> <label for="image">Image: </label>
<input id="image" type="file" (change)="onFileChange($event)"> <input id="image" type="file" (change)="onFileChange($event)">
<br>
<div *ngIf="imageBase64"> <div *ngIf="imageBase64">
<img [src]="imageBase64" alt="Selected Image" style="max-width: 200px; max-height: 200px;"> <img [src]="imageBase64" alt="Selected Image" style="max-width: 200px; max-height: 200px;">
</div> </div>
<br>
<div formArrayName="ingredients"> <div formArrayName="ingredients">
<div *ngFor="let ingredient of ingredients.controls; let i=index" [formGroupName]="i"> <div *ngFor="let ingredient of ingredients.controls; let i=index" [formGroupName]="i" class="form-group">
<label for="ingredient-quantity">Quantity:</label> <label for="ingredient-quantity">Quantity:</label>
<input id="ingredient-quantity" type="number" formControlName="quantity" required> <input id="ingredient-quantity" type="number" formControlName="quantity" required>
@ -123,14 +125,14 @@
<option *ngFor="let ingredient of ingredientsList" [value]="ingredient.$name">{{ ingredient.$name }}</option> <option *ngFor="let ingredient of ingredientsList" [value]="ingredient.$name">{{ ingredient.$name }}</option>
</select> </select>
<button type="button" (click)="removeIngredient(i)">Remove</button> <button type="button" class="remove-button" (click)="removeIngredient(i)">Remove</button>
</div> </div>
</div> </div>
<button type="button" (click)="addIngredient()">Add Ingredient</button> <button type="button" class="add-ingredient-button" (click)="addIngredient()">Add Ingredient</button>
<p>Complete the form to enable the button.</p> <p>Complete the form to enable the button.</p>
<button type="submit" [disabled]="!recipeForm.valid">Submit</button> <button type="submit" class="submit-button" [disabled]="!recipeForm.valid">Submit</button>
</form> </form>
</div> </div>
</body> </body>

Loading…
Cancel
Save