major UI modification

This commit is contained in:
les
2020-07-28 12:24:39 +02:00
parent 2758541df0
commit 411560c218
27 changed files with 770 additions and 572 deletions

View File

@@ -8,28 +8,35 @@
v-card-text
p(v-html="$t('register.description')")
v-text-field(ref='email' v-model='user.email' type='email' required
:placeholder='$t("common.email")' autocomplete='email'
prefix-icon='el-icon-message')
v-form(ref='form')
v-text-field(ref='email'
v-model='user.email' type='email'
:rules="validators.email"
:label='$t("common.email")' autocomplete='email')
v-text-field(v-model='user.password' type="password"
placeholder="Password")
v-text-field(v-model='user.password' type="password"
:rules="validators.password"
:label="$t('common.password')")
v-text-field(v-model='user.description' textarea rows='3' :placeholder="$t('common.description')")
v-textarea(v-model='user.description'
:rules="[validators.required('description')]"
:label="$t('common.description')")
v-card-actions
v-btn(plain type="success" :disabled='disabled' @click='register') {{$t('common.send')}} <v-icon name='chevron-right'/>
v-btn(@click='register' color='primary') {{$t('common.send')}}
v-icon mdi-chevron-right
</template>
<script>
import { mapState } from 'vuex'
import { Message } from 'element-ui'
import get from 'lodash/get'
import { validators } from '../plugins/helpers'
export default {
name: 'Register',
data () {
return {
validators,
loading: false,
user: {}
}
@@ -41,34 +48,30 @@ export default {
},
computed: {
...mapState(['settings']),
disabled () {
if (process.server) { return false }
return !this.user.password || !this.user.email || !this.user.description
}
// disabled () {
// if (process.server) { return false }
// return !this.user.password || !this.user.email || !this.user.description
// }
},
mounted () {
this.$refs.email.focus()
},
methods: {
async register () {
const valid = this.$refs.form.validate()
if (!valid) { return }
try {
this.loading = true
const user = await this.$axios.$post('/user/register', this.user)
// this is the first user registered
const first_user = user && user.is_admin && user.is_active
Message({
showClose: true,
message: first_user ? this.$t('register.first_user') : this.$t('register.complete'),
type: 'success'
this.$root.$message({
message: first_user ? this.$t('register.first_user') : this.$t('register.complete')
})
this.$router.replace('/')
} catch (e) {
const error = get(e, 'response.data.errors[0].message', String(e))
Message({
showClose: true,
message: this.$t(error),
type: 'error'
})
this.$root.$message({ message: this.$t(error), color: 'error' })
}
this.loading = false
}