Update Ui Signin

This commit is contained in:
ThienPhamVan
2026-03-20 11:00:25 +07:00
parent c9f20ed9fe
commit 4157344454
6 changed files with 123 additions and 57 deletions

View File

@@ -1,56 +1,78 @@
<template>
<div>
<Nuxt class="has-background-light" style="min-height: 100vh;" v-if="ready" />
<Modal @close="showmodal=undefined" v-bind="showmodal" v-if="showmodal"></Modal>
<SnackBar @close="snackbar=undefined" v-bind="snackbar" v-if="snackbar" />
<Nuxt class="has-background-light" style="min-height: 100vh" v-if="ready" />
<Modal @close="showmodal = undefined" v-bind="showmodal" v-if="showmodal"></Modal>
<SnackBar @close="snackbar = undefined" v-bind="snackbar" v-if="snackbar" />
</div>
</template>
<script>
import { COMPANY } from '../constants/company';
export default {
data() {
return {
ready: false
}
ready: false,
company: COMPANY,
};
},
head() {
return {title: 'Login'}
return { title: `${this.company.name}` };
},
async created() {
let connlist = this.$readyapi(['registermethod', 'authmethod', 'usertype', 'authstatus', 'common'])
let filter = connlist.filter(v=>!v.ready)
let result = filter.length>0? await this.$getapi(filter) : undefined
if(result==='error') {
this.$dialog({width: '500px', icon: 'mdi mdi-alert-circle',
content: 'An error occurred while connecting to the data. Please try again in a few minutes.', type: 'is-danger', progress:true, duration: 6})
let connlist = this.$readyapi(['registermethod', 'authmethod', 'usertype', 'authstatus', 'common']);
let filter = connlist.filter((v) => !v.ready);
let result = filter.length > 0 ? await this.$getapi(filter) : undefined;
if (result === 'error') {
this.$dialog({
width: '500px',
icon: 'mdi mdi-alert-circle',
content: 'An error occurred while connecting to the data. Please try again in a few minutes.',
type: 'is-danger',
progress: true,
duration: 6,
});
} else {
this.ready = true
this.ready = true;
}
},
mounted() {
var width = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth
if(this.$empty(this.viewport)) {
if(width<=768) this.viewport = 1 //'mobile'
else if(width>=769 && width<=1023) this.viewport = 2 //'tablet'
else if(width>=1024 && width<=1215) this.viewport = 3 //'desktop'
else if(width>=1216 && width<=1407) this.viewport = 4 //'widescreen'
else if(width>=1408) this.viewport = 5 //'fullhd'
var width = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
if (this.$empty(this.viewport)) {
if (width <= 768) this.viewport = 1; //'mobile'
else if (width >= 769 && width <= 1023) this.viewport = 2; //'tablet'
else if (width >= 1024 && width <= 1215) this.viewport = 3; //'desktop'
else if (width >= 1216 && width <= 1407) this.viewport = 4; //'widescreen'
else if (width >= 1408) this.viewport = 5; //'fullhd'
}
if(this.$route.query.link) this.$store.commit("updateLink", {link: this.$route.query.link})
if(this.$route.query.module) this.$store.commit('updateStore', {name: 'module', data: this.$route.query.module})
if (this.$route.query.link) this.$store.commit('updateLink', { link: this.$route.query.link });
if (this.$route.query.module) this.$store.commit('updateStore', { name: 'module', data: this.$route.query.module });
},
computed: {
showmodal: {
get: function() {return this.$store.state['showmodal']},
set: function(val) {this.$store.commit('updateStore', {name: 'showmodal', data: val})}
get: function () {
return this.$store.state['showmodal'];
},
set: function (val) {
this.$store.commit('updateStore', { name: 'showmodal', data: val });
},
},
snackbar: {
get: function() {return this.$store.state['snackbar']},
set: function(val) {this.$store.commit('updateStore', {name: 'snackbar', data: val})}
get: function () {
return this.$store.state['snackbar'];
},
set: function (val) {
this.$store.commit('updateStore', { name: 'snackbar', data: val });
},
},
viewport: {
get: function() {return this.$store.state.viewport},
set: function(val) {this.$store.commit("updateViewPort", {viewport: val})}
}
}
}
</script>
get: function () {
return this.$store.state.viewport;
},
set: function (val) {
this.$store.commit('updateViewPort', { viewport: val });
},
},
},
};
</script>