Vue.component('login-panel', {
    template: `
		<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">
						<form>
							User (Ohmportal):<br>
							<input type=text length=20 ref=userField v-model=user><br>
							Password:<br>
							<input type=password length=20 v-model=pwd><br>
						</form>
					</div>
					<div class="modal-footer">
						<button type="button" class="btn btn-primary">Login</button>
						<button type="button" class="btn btn-secondary" data-dismiss="modal" v-on:click="closeLogin(this.Event)">Close</button>
					</div>
    			</div>
			</div>
		</div>`,
    data: function () {
		return {
			user: "",
			pwd:"",
		};
    },
    methods: {
    	closeLogin (event) {
    		this.$emit('clicked', false)
    	}
    },
	mounted: function () {
		$(".loginModal").modal ('show');
	},
});