return {
data: function() {
return {
formValidator: null,
isPasswordVisible: false
}
},
methods: {
showHidePassword: function(event) {
var self = this;
var input = self.$('input[data-toggle=show-hide-password]');
if (input.attr('type') == 'password') {
input.attr('type', 'text');
self.$setState({
isPasswordVisible: true
});
}
else {
input.attr('type', 'password');
self.$setState({
isPasswordVisible: false
});
}
},
initializeFormValidator: function() {
var self = this;
self.formValidator = jQuery('form[name=login]').validate({
rules: {
email: {
required: true,
email:true
},
password: {
required: true
}
},
messages: {
email: {
required: 'Please enter email address.',
email: 'Please enter a valid email address.'
},
password: {
required: 'Please enter password.'
}
},
submitHandler: function(form) {
self.submitForm(form);
}
});
},
submitForm: function(form) {
var self = this;
app.request({
url: window.config.api.baseUrl + 'index.php',
method: 'POST',
data: new FormData(form),
success: function(data) {
var result = JSON.parse(data);
console.log(result);
if (result.status === 'false') {
app.toast.show({
text: 'Invalid Credentials',
position: 'bottom',
cssClass: 'toast-round bg-color-red'
});
}
else {
localStorage.setItem('user', data);
app.toast.show({
text: 'Welcome',
position: 'bottom',
cssClass: 'toast-round bg-color-green'
});
app.views.current.router.navigate('/screens/dashboard');
}
}
})
}
},
on: {
pageInit: function() {
var self = this;
self.initializeFormValidator();
}
}
}
and mydashboard code is below
return {
methods: {
animateGreetIcon: function() {
var self = this;
var animation = anime({
targets: ['.greet-icon img'],
duration: 10000,
easing: 'linear',
loop: true,
rotate: 360
});
},
renderChart: function() {
var self = this;
var config = {
type: 'horizontalBar',
data: {
labels: ['January', 'February', 'March', 'April', 'May', 'June'],
datasets: [
{
label: 'Dataset',
backgroundColor: window.config.colors.oc.green4,
borderColor: window.config.colors.oc.green6,
borderWidth: 1,
data: [80, -5, 25, 50, -15, 75]
}
]
},
options: {
responsive: false
}
};
var chart = new Chart(document.getElementById('chart').getContext('2d'), config);
},
getUserData: function() {
var self = this;
var user = JSON.parse(localStorage.getItem('user'));
self.$('.greet-username').text(user.username);
self.$('.greet-role').text(user.role);
self.$('.greet-designation').text(user.designation);
self.$('.greet-status').text(user.status);
}
},
on: {
pageInit: function() {
var self = this;
self.animateGreetIcon();
self.renderChart();
self.getUserData();
}
}
}Create a minimal sample code in jsfiddle
How to call another api using username in this code please help me