{% if related_modules_records|length > 0 %}
<div class="col s12 m12 mt30">
	<!-- <h5>{{'LBL_RELATED'|trans|raw}}</h5> -->
</div>
<div class="col s12 m12">
	<ul class="collapsible-block popout relatedtab" data-collapsible="expandable">
		{% set default_related_open=module_config["default_relatedblock_opened"] %}
		{% for relatedmodulename,relatedmodule in related_modules_records %}
		{% if app.modules[relatedmodule.route] is defined  or relatedmodule.route=="NO_DETAILS" %}
		<li>
			<div class="collapsible-header {% if default_related_open==1 %}active {{themebasiccolor}} {% endif %}">
				<i class="material-icons left more" {% if default_related_open==1 %}style="display: none"
					{% endif %}>chevron_right</i>
				<i class="material-icons left less" {% if default_related_open!=1 %}style="display: none"
					{% endif %}>expand_more</i>
				<span class="new badge {{themebasiccolor}} lighten-2"
					style="float: none; padding: 3px 10px">{{relatedmodule["records"]|length}}</span>
				<!-- <span>{{"LBL_RELATED_MULTIPLE"|trans|raw}} {{relatedmodule.label|trans|raw}} </span> -->
				<span> {{relatedmodule.label|trans|raw}} </span>
				<div class="myc-divider"></div>
			</div>
			<div class="collapsible-body">
				{% if relatedmodule["records"]|length > 0 %}
				<div class="col s12 m12">
					<div class="card material-table myc-responsive-card">
						<div class="table-header">
							<span class="table-title search-toggle">{{"LBL_SEARCH"|trans|raw}}</span>
							<div class="actions">
								<a href="#" class="btn-floating waves-effect waves-light search-toggle grey"
									style="margin-top: 10px"><i class="material-icons">search</i></a>
							</div>
						</div>
						<br />
						<div class="myc-responsive-container">
							<table class="datatable bordered">
								<thead>
									<tr>
										{% for fieldname in relatedmodule["list_fields"] %}
										<th data-field="{{fieldname}}">{{app.translator.trans(fieldname)}}</th>
										{% endfor %}
										{% if relatedmodule.modulename=="Documents" and app.download_enabled %}
										<th data-field="download_link" class="right-align">Download</th>
										{% endif %}
									</tr>
								</thead>
								<tbody>
									{% for record in relatedmodule["records"] %}
									<tr {% if relatedmodule.modulename!="Documents" and relatedmodule.route !="NO_DETAILS" %}
										onclick="gotoPage('{{app.config.base_url}}/{{relatedmodule.route}}/{{record.id}}/')"
										{% endif %}>
										{% for n,fieldname in relatedmodule["list_fields"] %}
										<td {% if relatedmodule.modulename=="Documents"  and relatedmodule.route !="NO_DETAILS" %}
											onclick="gotoPage('{{app.config.base_url}}/{{relatedmodule.route}}/{{record.id}}/')"
											{% endif %}>
											{% if record[fieldname] is defined %}{{record[fieldname]|trans|raw}}
											{% endif %}
										</td>
										{% endfor %}
										{% if relatedmodule.modulename=="Documents" and app.download_enabled %}
										<td class="right-align">
											<a class="btn-floating btn-small waves-effect waves-light {{themebasiccolor}} tooltipped"
												data-position="left" data-delay="50" data-tooltip="Download"
												onclick="window.location = '{{app.config.base_url}}/attachment/{{record.id}}'; return false;"><i
													class="material-icons">file_download</i></a>
										</td>
										{% endif %}
									</tr>
									{% endfor %}
								</tbody>
							</table>
						</div>
					</div>
					{% else %}
					<div class="col s12">
						<h5><small>{{"LBL_NO_DATA"|trans|raw}} </small></h5>
					</div>
					<div class="clearfix"></div>
					{% endif %}
					</div>
				<div class="clearfix"></div>
		</li>
		{% endif %}
		{% endfor %}
	</ul>
</div>
{% endif %}