<template>
	<div>
		<div id="list">
			<table>
				<thead>
					<tr>
						<th>
							{{ messages.get('importexport', 'ie_profile_name') }}
						</th>
						<th>
							{{ messages.get('importexport', 'ie_profile_comment') }}
						</th>
						<th>
							{{ messages.get('importexport', 'ie_actions') }}
						</th>
					</tr>
				</thead>
				<tbody>
					<tr v-for="(profile, index) in list" :key="index">
						<td>{{ profile.profileName }}</td>
						<td>{{ profile.profileComment }}</td>
						<td>
							<button type="button" class="bouton" @click="edit(profile.id)">{{ messages.get('common', 'edit') }}</button>
							<button type="button" class="bouton" @click="duplicate(profile.id)">{{ messages.get('common', 'common_duplicate') }}</button>
							<button type="button" class="bouton" @click="remove(profile.id)">{{ messages.get('common', 'remove') }}</button>
						</td>
					</tr>
				</tbody>
			</table>
		</div>
		<div id="add">
			<button type="button" class="bouton" @click="add()">{{ messages.get('importexport', 'ie_profile_add') }}</button>
		</div>
	</div>
</template>

<script>
	export default {
		props: {
			list : {
				'type' : Array
			},
			type : {
				'type' : String,
				required: true
			}
		},
		computed : {
			categ : function() {
				return "profiles_" + this.type;
			},
			controller : function() {
				return "profiles" + this.type.charAt(0).toUpperCase() + this.type.slice(1);
			}
		},
		methods: {
			add: function () {
		        document.location = './import_export.php?categ=' + this.categ + '&action=edit';
		    },
			edit: function (id) {
		        document.location = './import_export.php?categ=' + this.categ + '&action=edit&id='+id;
		    },
		    remove : async function(id) {
		    	if(confirm(this.messages.get('importexport', 'ie_profile_remove_confirm'))) {
					let response = await this.ws.post(this.controller, 'remove', {id : id });
					if(!response.error) {
						let i = this.list.findIndex(i => i.idProfile == id);
						if(i != -1) {
							this.$delete(this.list, i);
						}
					} else {
						this.notif.error(this.messages.get('common', 'failed_delete'));
					}
				}
			},
			duplicate : async function(id) {
				let duplicate = await this.ws.post(this.controller, 'duplicate', {id : id});
				if(!duplicate.error) {
					this.$set(this.list, this.list.length, duplicate);
				}
			}
		}
	}
</script>