AddCatalogPriceForm: show a currency

[0pdd]

The puzzle 1342-ddac07e5 from #1342 has to be resolved:

mystamps/src/main/frontend/src/components/AddCatalogPriceForm.js

Line 5 in 86959e0

// @todo #1342 AddCatalogPriceForm: show a currency

The puzzle was created by Bakhodyr Kadyrov on 09-May-20.

[php-coder]

We should update markup and show a currency like on a series creation page:

mystamps/src/main/webapp/WEB-INF/views/series/add.html

Lines 378 to 514 in 86959e0

	<div class="form-group form-group-sm js-catalogs-info collapse in" th:classappend="|${michelHasErrors ? 'has-error' : ''} ${showCatalogsInfo ? 'js-has-data' : ''}|">
	<label for="michelNumbers" class="control-label col-sm-3" th:text="#{t_michel}">
	Michel
	</label>
	<div class="col-sm-7">
	<div class="row">
	<div class="col-xs-6">
	<input type="text" id="michelNumbers" class="form-control js-catalog-numbers" th:field="*{michelNumbers}" />
	</div>
	<div class="col-xs-3 no-padding">
	<div class="input-group">
	<span class="input-group-addon">&euro;</span>
	<input type="text" class="form-control js-with-tooltip" size="5" title="EUR" th:field="*{michelPrice}" />
	</div>
	</div>
	</div>
	<!--/*/
	<span id="michelNumbers.errors" class="help-block" th:if="${#fields.hasErrors('michelNumbers')}" th:each="error : ${#fields.errors('michelNumbers')}" th:text="${error}"></span>
	<span id="michelPrice.errors" class="help-block" th:if="${#fields.hasErrors('michelPrice')}" th:each="error : ${#fields.errors('michelPrice')}" th:text="${error}"></span>
	/*/-->
	</div>
	</div>
	<div class="form-group form-group-sm js-catalogs-info collapse in" th:classappend="|${scottHasErrors ? 'has-error' : ''} ${showCatalogsInfo ? 'js-has-data' : ''}|">
	<label for="scottNumbers" class="control-label col-sm-3" th:text="#{t_scott}">
	Scott
	</label>
	<div class="col-sm-7">
	<div class="row">
	<div class="col-xs-6">
	<input type="text" id="scottNumbers" class="form-control js-catalog-numbers" th:field="*{scottNumbers}" />
	</div>
	<div class="col-xs-3 no-padding">
	<div class="input-group">
	<span class="input-group-addon">$</span>
	<input type="text" class="form-control js-with-tooltip" size="5" title="USD" th:field="*{scottPrice}" />
	</div>
	</div>
	</div>
	<!--/*/
	<span id="scottNumbers.errors" class="help-block" th:if="${#fields.hasErrors('scottNumbers')}" th:each="error : ${#fields.errors('scottNumbers')}" th:text="${error}"></span>
	<span id="scottPrice.errors" class="help-block" th:if="${#fields.hasErrors('scottPrice')}" th:each="error : ${#fields.errors('scottPrice')}" th:text="${error}"></span>
	/*/-->
	</div>
	</div>
	<div class="form-group form-group-sm js-catalogs-info collapse in" th:classappend="|${yvertHasErrors ? 'has-error' : ''} ${showCatalogsInfo ? 'js-has-data' : ''}|">
	<label for="yvertNumbers" class="control-label col-sm-3" th:text="#{t_yvert}">
	Yvert et Tellier
	</label>
	<div class="col-sm-7">
	<div class="row">
	<div class="col-xs-6">
	<input type="text" id="yvertNumbers" class="form-control js-catalog-numbers" th:field="*{yvertNumbers}" />
	</div>
	<div class="col-xs-3 no-padding">
	<div class="input-group">
	<span class="input-group-addon">&euro;</span>
	<input type="text" class="form-control js-with-tooltip" size="5" title="EUR" th:field="*{yvertPrice}" />
	</div>
	</div>
	</div>
	<!--/*/
	<span id="yvertNumbers.errors" class="help-block" th:if="${#fields.hasErrors('yvertNumbers')}" th:each="error : ${#fields.errors('yvertNumbers')}" th:text="${error}"></span>
	<span id="yvertPrice.errors" class="help-block" th:if="${#fields.hasErrors('yvertPrice')}" th:each="error : ${#fields.errors('yvertPrice')}" th:text="${error}"></span>
	/*/-->
	</div>
	</div>
	<div class="form-group form-group-sm js-catalogs-info collapse in" th:classappend="|${gibbonsHasErrors ? 'has-error' : ''} ${showCatalogsInfo ? 'js-has-data' : ''}|">
	<label for="gibbonsNumbers" class="control-label col-sm-3" th:text="#{t_sg}">
	Stanley Gibbons
	</label>
	<div class="col-sm-7">
	<div class="row">
	<div class="col-xs-6">
	<input type="text" id="gibbonsNumbers" class="form-control js-catalog-numbers" th:field="*{gibbonsNumbers}" />
	</div>
	<div class="col-xs-3 no-padding">
	<div class="input-group">
	<span class="input-group-addon">&pound;</span>
	<input type="text" class="form-control js-with-tooltip" size="5" title="GBP" th:field="*{gibbonsPrice}" />
	</div>
	</div>
	</div>
	<!--/*/
	<span id="gibbonsNumbers.errors" class="help-block" th:if="${#fields.hasErrors('gibbonsNumbers')}" th:each="error : ${#fields.errors('gibbonsNumbers')}" th:text="${error}"></span>
	<span id="gibbonsPrice.errors" class="help-block" th:if="${#fields.hasErrors('gibbonsPrice')}" th:each="error : ${#fields.errors('gibbonsPrice')}" th:text="${error}"></span>
	/*/-->
	</div>
	</div>
	<div class="form-group form-group-sm js-catalogs-info collapse in" th:classappend="|${solovyovHasErrors ? 'has-error' : ''} ${showCatalogsInfo ? 'js-has-data' : ''}|">
	<label for="solovyovNumbers" class="control-label col-sm-3" th:text="#{t_solovyov}">
	Solovyov
	</label>
	<div class="col-sm-7">
	<div class="row">
	<div class="col-xs-6">
	<input type="text" id="solovyovNumbers" class="form-control js-catalog-numbers" th:field="*{solovyovNumbers}" />
	</div>
	<div class="col-xs-3 no-padding">
	<div class="input-group">
	<span class="input-group-addon">&#x20bd;</span>
	<input type="text" class="form-control js-with-tooltip" size="5" title="RUB" th:field="*{solovyovPrice}" />
	</div>
	</div>
	</div>
	<!--/*/
	<span id="solovyovNumbers.errors" class="help-block" th:if="${#fields.hasErrors('solovyovNumbers')}" th:each="error : ${#fields.errors('solovyovNumbers')}" th:text="${error}"></span>
	<span id="solovyovPrice.errors" class="help-block" th:if="${#fields.hasErrors('solovyovPrice')}" th:each="error : ${#fields.errors('solovyovPrice')}" th:text="${error}"></span>
	/*/-->
	</div>
	</div>
	<div class="form-group form-group-sm js-catalogs-info collapse in" th:classappend="|${zagorskiHasErrors ? 'has-error' : ''} ${showCatalogsInfo ? 'js-has-data' : ''}|">
	<label for="zagorskiNumbers" class="control-label col-sm-3" th:text="#{t_zagorski}">
	Zagorski
	</label>
	<div class="col-sm-7">
	<div class="row">
	<div class="col-xs-6">
	<input type="text" id="zagorskiNumbers" class="form-control js-catalog-numbers" th:field="*{zagorskiNumbers}" />
	</div>
	<div class="col-xs-3 no-padding">
	<div class="input-group">
	<span class="input-group-addon">&#x20bd;</span>
	<input type="text" class="form-control js-with-tooltip" size="5" title="RUB" th:field="*{zagorskiPrice}" />
	</div>
	</div>
	</div>
	<!--/*/
	<span id="zagorskiNumbers.errors" class="help-block" th:if="${#fields.hasErrors('zagorskiNumbers')}" th:each="error : ${#fields.errors('zagorskiNumbers')}" th:text="${error}"></span>
	<span id="zagorskiPrice.errors" class="help-block" th:if="${#fields.hasErrors('zagorskiPrice')}" th:each="error : ${#fields.errors('zagorskiPrice')}" th:text="${error}"></span>
	/*/-->
	</div>
	</div>

In other words, when Michel catalog is chosen, currency should be EUR. For Scott it will be USD and so on.