OpenSlides/openslides/topics/static/templates/topics/topic-import.html
2016-12-09 15:02:32 +01:00

148 lines
5.6 KiB
HTML

<div class="header">
<div class="title">
<div class="submenu">
<a ui-sref="agenda.item.list" class="btn btn-sm btn-default">
<i class="fa fa-angle-double-left fa-lg"></i>
<translate>Back to overview</translate>
</a>
</div>
<h1 translate>Import topics</h1>
</div>
</div>
<div class="details">
<h2 translate>Import by copy/paste</h2>
<p translate>Copy and paste your topic titles in this textbox. Keep each item in a single line.</p>
<div class="row">
<div class="form-group col-sm-6">
<textarea ng-model="itemlist" rows="5" class="form-control" ng-list="/\n/"></textarea>
</div>
</div>
<div class="clearfix">
<button ng-click="importByLine()" class="btn btn-primary pull-left" translate>Import</button>
<div class="col-xs-5" ng-if="titleItems">
<progressbar animate="false" type="success" max="titleItems.length" value="importcounter">
<i>{{ importcounter }} / {{ titleItems.length }} {{ "imported" | translate }}</i>
</progressbar>
</div>
</div>
<div class="spacer">
<a ng-if="importcounter > 0 && importcounter == titleItems.length" ui-sref="agenda.item.list"
class="btn btn-default">
<i class="fa fa-angle-double-left fa-lg"></i>
<translate>Back to agenda</translate>
</a>
</div>
<hr>
<h2 translate>Import by CSV file</h2>
<div class="block row">
<div class="title">
<h3 translate>Select a CSV file
</div>
<div class="block right import">
<label class="label" for="inputSeparator" translate>Separator</label>
<input type="text" ng-model="separator" ng-change="setSeparator()" ng-init="separator=separator" id="inputSeparator">
<br>
<label class="label" for="selectEncoding" translate>Encoding</label>
<select ng-model="encoding" ng-options="enc as enc for enc in encodingOptions"
ng-selected="setEncoding()" ng-init="encoding=encoding" id="selectEncoding"></select>
<ng-csv-import
content="csv.content"
header="csv.header"
header-visible="csv.headerVisible"
separator="csv.separator"
separator-visible="csv.separatorVisible"
result="csv.result"
encoding="csv.encoding"
accept="csv.accept"
encoding-visible="csv.encodingVisible"></ng-csv-import>
</div>
</div>
<h4 translate>Please note:</h4>
<ul class="indentation">
<li><translate>Required comma or semicolon separated values with these column header names in the first row</translate>:<br>
<code>title, text, duration, comment, is_hidden</code>
<li translate>Title is required. All other fields are optional and may be empty.
<li translate>Only double quotes are accepted as text delimiter (no single quotes).
<li><a id="downloadLink" href="" ng-click="downloadCSVExample()" translate>Download CSV example file</a>
</ul>
<div ng-if="csv.result">
<h3 translate>Preview</h3>
<table ng-if="!csvImporting" class="table table-striped table-bordered table-condensed">
<thead>
<tr>
<th>
<th>#
<th translate>Title
<th translate>Text
<th translate>Duration
<th translate>Comment
<th translate>Is hidden</th>
<tbody ng-repeat="item in items">
<tr>
<td class="minimum"
ng-class="{ 'text-danger': item.importerror, 'text-success': item.imported }">
<span ng-if="item.importerror">
<i class="fa fa-exclamation-triangle fa-lg"></i>
</span>
<span ng-if="!item.importerror && !item.imported">
<i class="fa fa-check-circle-o fa-lg"></i>
</span>
<span ng-if="item.imported">
<i class="fa fa-check-circle fa-lg"></i>
</span>
<td class="minimum">{{ $index + 1 }}
<td ng-class="{ 'text-danger': item.title_error }">
<span ng-if="item.title_error" title="{{ item.title_error | translate }}">
<i class="fa fa-exclamation-triangle"></i>
</span>
{{ item.title }}
<td>{{ item.text | limitTo:80 }}{{ item.text.length > 80 ? '...' : '' }}
<td>{{ item.duration | osMinutesToTime }}
<td>{{ item.comment }}
<td>{{ item.is_hidden }}
</table>
<div class="text-danger">
<div ng-repeat="item in itemsFailed = (items | filter:{importerror:true})"></div>
<i class="fa fa-exclamation-triangle"></i>
{{ itemsFailed.length }}
<translate>topics will be not imported.</translate>
</div>
<div>
<div ng-repeat="item in itemsPassed = (items | filter:{importerror:false})"></div>
<i class="fa fa-check-circle-o fa-lg"></i>
{{ items.length - itemsFailed.length }}
<translate>topics will be imported.</translate>
</div>
<div ng-repeat="item in itemsImported = (items | filter:{imported:true})"></div>
<div ng-if="itemsImported.length > 0" class="text-success">
<hr class="smallhr">
<i class="fa fa-check-circle fa-lg"></i>
{{ itemsImported.length }}
<translate>topics were successfully imported.</translate>
</div>
<div class="spacer">
<button ng-click="clear()" class="btn btn-default" translate>
Clear preview
</button>
<button ng-if="!csvImporting && (items.length - itemdFailed.length) > 0" ng-click="import()" class="btn btn-primary" translate>
Import {{ items.length - itemsFailed.length }} topics
</button>
</div>
<div class="spacer">
<a ng-if="csvimported" ui-sref="agenda.item.list" class="btn btn-default">
<i class="fa fa-angle-double-left fa-lg"></i>
<translate>Back to agenda</translate>
</a>
</div>
</div>
</div>