Vue.component('login-panel', {
    template: `
		  <form action="">
            <div class="modal-card" style="width: auto">
                <header class="modal-card-head">
                    <p class="modal-card-title">Login</p>
                </header>
                <section class="modal-card-body">

					<b-field>
        				<b-input
							placeholder="User (Ohmportal)"
							:value="user"
							v-model=user
							required>
						</b-input>
    				</b-field>
					<b-field>
            			<b-input
							type="password"
							placeholder="Password"
							:value="pwd"
							required>
						</b-input>
        			</b-field>
					<b-checkbox>Eingeloggt bleiben</b-checkbox>
                </section>
                <footer class="modal-card-foot">
                    <button class="button" type="button" @click="$parent.close()">Close</button>
                    <button class="button is-primary" on:click="logIn(this.Event)">Login</button>
                </footer>
            </div>
        </form>



		<!--<div class="loginModal modal" tabindex="-1" role="dialog">
			<div class="modal-dialog" role="document">
    			<div class="modal-content">
    				<div class="modal-header">
        				<h5 class="modal-title">Login</h5>
    				</div>
    				<div class="modal-body">
						<b-field>
        					<b-input placeholder="User (Ohmportal)" v-model=user></b-input>
    					</b-field>
						<b-field>
            				<b-input type="password" placeholder="Password"></b-input>
        				</b-field>
					</div>
					<div class="modal-footer">
						<b-button type="button" class="btn btn-primary" data-dismiss="modal" v-on:click="closeLogin(this.Event)">Login</b-button>
						<b-button type="button" class="btn btn-secondary" data-dismiss="modal" v-on:click="closeLogin(this.Event)">Close</b-button>
					</div>
    			</div>
			</div>
		</div>-->`,
    data: function () {
		return {
			user: "name",
			pwd:"password",
		};
    },
    methods: {
		logIn(event){
			this.$emit('clicked', true)
		},

    	closeLogin (event) {
    		this.$emit('clicked', false)
    	}
    },
	mounted: function () {
		//$(".loginModal").modal ('show');
	},
});