Skip to content

Instantly share code, notes, and snippets.

@danechitoaie
Last active October 21, 2016 08:17
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save danechitoaie/5dcbf7c6d3fd0fc19d3d5000aaa1b80b to your computer and use it in GitHub Desktop.
Save danechitoaie/5dcbf7c6d3fd0fc19d3d5000aaa1b80b to your computer and use it in GitHub Desktop.
<!-- main.js -->
import Vue from "vue";
import VueRouter from "vue-router";
import App from "./App";
Vue.use(VueRouter);
new Vue({
el : "#app",
template : "<App/>",
components: { App }
});
<!-- Login.vue -->
<template>
<div class="ui middle aligned center aligned grid">
<div class="column">
<h2 class="ui teal header">
Login
</h2>
<form class="ui large form login" v-on:submit.prevent="onSubmit">
<div class="ui stacked segment">
<div class="field">
<div class="ui left icon input">
<i class="cloud icon"></i>
<input type="text" name="hostname" placeholder="Hostname" value="">
</div>
</div>
<div class="field">
<div class="ui left icon input">
<i class="user icon"></i>
<input type="text" name="username" placeholder="Username" value="">
</div>
</div>
<div class="field">
<div class="ui left icon input">
<i class="lock icon"></i>
<input type="password" name="password" placeholder="Password" value="">
</div>
</div>
<div class="ui fluid large teal submit button">Login</div>
</div>
</form>
</div>
</div>
</template>
<script>
export default {
name: "login",
mounted: function() {
this.$nextTick(function() {
jQuery(this.$el).find("form").form({
fields: {
hostname: {
identifier: "hostname",
rules : [{
type : "empty",
prompt: "Please enter the instance hostname"
}]
},
username: {
identifier: "username",
rules : [{
type : "empty",
prompt: "Please enter your username"
}]
},
password: {
identifier: "password",
rules : [{
type : "empty",
prompt: "Please enter your password"
}]
}
}
});
});
},
methods: {
onSubmit: function(e) {
alert("ok");
}
}
};
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment