1
+ <style >
2
+ </style >
3
+
4
+ <template >
5
+ <div class =" ui main text container" style =" margin-top : 80px ;" >
6
+ <div class =" ui container center aligned" >
7
+ <div class =" ui basic segment huge" >
8
+ <h1 class =" ui header" >
9
+ <i class =" circular icon user" ></i >
10
+ Message Vault Login
11
+ </h1 >
12
+ </div >
13
+ <div class =" ui centered grid" >
14
+ <div class =" ui nine wide column basic segment left aligned t0 b1" >
15
+ <form class =" ui huge form enter-tag" :class =" {loading: loading}" >
16
+ <div class =" field" >
17
+ <label >Authorized User</label >
18
+ <div class =" ui left icon input" >
19
+ <input v-focus.lazy =" true" type =" text" v-model =' tag' name =" tag" placeholder =" user:org" autocomplete =" off" >
20
+ <i class =" at icon" ></i >
21
+ </div >
22
+ </div >
23
+ <button class =" ui large primary submit button" type =" submit" >Submit</button >
24
+ <div class =" ui mini error message" />
25
+ </form >
26
+ </div >
27
+ </div >
28
+ <div class =" ui basic segment" >
29
+ <p >Please enter your Forsta address so this site can send you a login code.</p >
30
+ </div >
31
+ </div >
32
+ </div >
33
+ </template >
34
+
35
+ <script >
36
+ util = require (' ../util' );
37
+ focus = require (' vue-focus' );
38
+ shared = require (' ../globalState' );
39
+ jwtDecode = require (' jwt-decode' );
40
+
41
+ function setup () {
42
+ const apiToken = this .global .apiToken ;
43
+ const forwardTo = this .$route .query .forwardTo ;
44
+ if (apiToken && forwardTo) {
45
+ const decoded = jwtDecode (apiToken);
46
+ const expires = new Date (decoded .exp * 1000 );
47
+ const now = new Date ();
48
+
49
+ if (now < expires) {
50
+ this .$router .replace (forwardTo);
51
+ return ;
52
+ }
53
+ }
54
+
55
+ util .fetch .call (this , ' /api/onboard/status/v1' )
56
+ .then (result => {
57
+ this .global .onboardStatus = result .theJson .status ;
58
+ if (this .global .onboardStatus !== ' complete' ) {
59
+ this .$router .push ({ name: ' welcome' });
60
+ }
61
+ });
62
+
63
+ this .tag = this .global .loginTag ;
64
+
65
+ $ (' form.ui.form.enter-tag' ).form ({
66
+ fields: {
67
+ tag: {
68
+ identifier: ' tag' ,
69
+ rules: [{
70
+ type: ' regExp' ,
71
+ value: / ^ ([\d a-z _] ([. ][\d a-z _] | [\d a-z _] )* )(:([\d a-z _] ([. ] + [\d a-z _] | [\d a-z _] )* ))? $ / ,
72
+ prompt: ' please enter full @your.name:your.org'
73
+ }]
74
+ }
75
+ },
76
+ onSuccess : (event ) => {
77
+ event .preventDefault ();
78
+ requestAuth .call (this )
79
+ }
80
+ });
81
+ }
82
+
83
+ function requestAuth () {
84
+ var tag = this .tag ;
85
+ this .loading = true ;
86
+ util .fetch .call (this , ' /api/auth/login/v1/' + tag)
87
+ .then (result => {
88
+ this .loading = false ;
89
+ if (result .ok ) {
90
+ const { id } = result .theJson ;
91
+ this .global .userId = id;
92
+ this .global .loginTag = tag;
93
+ this .$router .push ({ name: ' loginCode' , query: this .$route .query });
94
+ return false ;
95
+ } else {
96
+ util .addFormErrors (' enter-tag' , { tag: util .mergeErrors (result .theJson ) });
97
+ return false ;
98
+ }
99
+ })
100
+ .catch (err => {
101
+ console .log (' got an err in requestAuth' , err);
102
+ this .loading = false ;
103
+ });
104
+ return false ;
105
+ }
106
+
107
+ module .exports = {
108
+ data : () => ({
109
+ global: shared .state ,
110
+ tag: ' ' ,
111
+ loading: false
112
+ }),
113
+ computed: {
114
+ },
115
+ mounted : function () {
116
+ setup .call (this )
117
+ },
118
+ methods: {
119
+ },
120
+ directives: {
121
+ focus: focus .focus
122
+ }
123
+ }
124
+ </script >
0 commit comments