{{ header }}
<section class="container-fluid" id="root">
	{% if content_top %}
		{{ content_top }}
	{% endif %}
	{{breadcrumbs}}
	<div class="row">
		<div class="col-md-4 hidden-md-down">
			{{ account }}
		</div>
		<div class="col-xs no-padding top-margin-medium bottom-margin-large">
			<div class="content-box">
				<form action="{{ action }}" method="post" enctype="multipart/form-data" class="text-left">
					<div class="background-base-content">
						<div class="header-card-back">
							<h2 v-text="heading" class="text-h1-title text-dark"></h2>
						</div>
						<base-content :show-icon="false" :title="heading" :show-title="false">
							<div :key="updateComponent">
								<label :class="'far fa-star content-star text-x-large horizontal-padding-x-small pointer active_star' + rating" @click="handleRating(1)">
									<input class="star-new-rating" type="radio" name="rating" value="1" :checked="rating == 1">
								</label>
								<label :class="'far fa-star content-star text-x-large horizontal-padding-x-small pointer active_star' + rating" @click="handleRating(2)">
									<input class="star-new-rating" type="radio" name="rating" value="2" :checked="rating == 2">
								</label>
								<label :class="'far fa-star content-star text-x-large horizontal-padding-x-small pointer active_star' + rating" @click="handleRating(3)">
									<input class="star-new-rating" type="radio" name="rating" value="3" :checked="rating == 3">
								</label>
								<label :class="'far fa-star content-star text-x-large horizontal-padding-x-small pointer active_star' + rating" @click="handleRating(4)">
									<input class="star-new-rating" type="radio" name="rating" value="4" :checked="rating == 4">
								</label>
								<label :class="'far fa-star content-star text-x-large horizontal-padding-x-small pointer active_star' + rating" @click="handleRating(5)">
									<input class="star-new-rating" type="radio" name="rating" value="5" :checked="rating == 5">
								</label>
							</div>

							<label class="field field-medium top-margin-medium">
								<span class="field-label text-medium" v-text="text_your_experience"></span>
								<textarea style="min-height: 210px; resize: none" name="text" :placeholder="text_what_do_you_think" maxlength="250" :class="error_text ? 'field-entry rounded-small text-medium border-error' : 'field-entry rounded-small text-medium'" rows="6" v-text="text"></textarea>
								<span class="text-error text-small text-left top-margin-x-small visible-block" v-if="error_text" v-text="error_text"></span>	
							</label>
							<label class="radio top-margin-medium">
								<input class="radio-entry" type="radio" name="allow" value="1" :checked="allow == '1'">
								<span class="radio-text text-medium" v-text="text_allow"></span>
							</label>
							<label class="radio top-margin-medium">
								<input class="radio-entry" type="radio" name="allow" value="0" :checked="allow == '0'">
								<span class="radio-text text-medium" v-text="text_deny"></span>
							</label>
							<div class="top-margin-medium">
								<button type="submit" class="btn-default btn-large btn-neutral-black">
									<span v-text="text_send + ' avaliação'"></span>
								</button>
							</div>
						</base-content>
					</div>
				</form>
			</div>
		</div>
		{% if column_right %}
			<div class="col-md-3 hidden-md-down">
				{{ column_right }}
			</div>
		{% endif %}
	</div>
	{% if content_bottom %}
		{{ content_bottom }}
	{% endif %}
</section>
{{ footer }}

<script type="text/javascript">
	const DATA = {{ dataVue|json_encode() }};
</script>
