{$layout}
{$template "../settings_menu"}
{$template "/left_menu_with_menu"}

<div class="right-box with-menu">
	<ul class="upload-error" v-if="uploadError"> 
		<li v-for="err in uploadError.split(';')">{{ err }}</li>
		<a class="upload-error-close" href="" title="关闭"><i class="ui icon remove small"></i></a>
		</ul>
		<nav aria-label="breadcrumb">
			<ol class="breadcrumb">
				<li class="breadcrumb-item"><a :href="'./page?serverId=' + serverId">Home</a></li>
				<li class="breadcrumb-item" v-for="prefix in prefixcs"><a :href="'./page?serverId=' + serverId + '&prefix='+prefix.prefix">{{prefix.name}}</a></li>
					
				
			</ol>
		</nav>
		<form method="post" class="ui form" data-tea-action="$"  data-tea-success="success" id="upload-form">
			<input type="hidden" name="serverId" :value="serverId"/>
			<input type="hidden" name="webId" :value="webId"/>
			<input type="hidden" name="bucketName" :value="bucketName" />
			<input type="hidden" name="bucketPrefix" :value="bucketPrefix" />
			<input type="hidden" name="storageId" :value="storageId" />
			
			<div id="upload-area" class="upload-container">
				<div class="upload-icon">&#9729;</div>
				<p class="upload-text">拖动文件到这里</p>
				<p class="comment" id="upload-notice"></p>
				<input id="upload_files" type="file" webkitdirectory directory multiple="multiple" hidden>
			</div>
		</form>
		<table class="ui table selectable celled" >
			<thead>
				<tr>
					<th>文件名</th>
					<th>时间</th>
					<th>大小</th>
					<th>操作</th>
				</tr>
			</thead>
			<tbody>
				<tr v-for="file in files">
					<td>
						<a v-if="file.isDir" :href="'./page?serverId=' + serverId + '&prefix='+bucketPrefix+file.name+'/'">{{ file.name }}</a>
						<span v-else>{{ file.name }}</span>
					  </td>
					<td>{{file.createdAt}}</td>
					<td>{{file.size}}</td>
					<td>
						<a href="" @click.prevent="deleteFile(file.name)" class="ui button tiny">删除</a>
					</td>
				</tr>
		</table>

</div>