v-app.setup
    v-content
      v-container
        v-layout
          v-flex(xs12, lg6, offset-lg3)
            v-card.radius-7
              .text-xs-center
                img.setup-logo(src='/svg/logo-wikijs.svg', alt='Wiki.js Logo')
              v-alert(color='indigo lighten-5', icon='open_in_browser', :value='true')
                span.indigo--text You are about to install Wiki.js #[strong {{wikiVersion}}].
              v-card-text
                .body-2.pl-3 Create Administrator Account
                v-container.pa-3(grid-list-xl)
                  v-layout(row, wrap)
                    v-flex(xs12)
                      v-text-field(
                        outline
                        v-model='conf.adminEmail',
                        label='Administrator Email',
                        hint='The email address of the administrator account',
                        persistent-hint
                        v-validate='{ required: true, email: true }',
                        data-vv-name='adminEmail',
                        data-vv-as='Administrator Email',
                        data-vv-scope='admin',
                        :error-messages='errors.collect(`admin.adminEmail`)'
                        ref='adminEmailInput'
                      )
                    v-flex(xs6)
                      v-text-field(
                        outline
                        ref='adminPassword',
                        counter='255'
                        v-model='conf.adminPassword',
                        label='Password',
                        :append-icon="pwdMode ? 'visibility' : 'visibility_off'"
                        @click:append="() => (pwdMode = !pwdMode)"
                        :type="pwdMode ? 'password' : 'text'"
                        hint='At least 8 characters long.',
                        persistent-hint
                        v-validate='{ required: true, min: 8 }',
                        data-vv-name='adminPassword',
                        data-vv-as='Password',
                        data-vv-scope='admin',
                        :error-messages='errors.collect(`admin.adminPassword`)'
                      )
                    v-flex(xs6)
                      v-text-field(
                        outline
                        ref='adminPasswordConfirm',
                        counter='255'
                        v-model='conf.adminPasswordConfirm',
                        label='Confirm Password',
                        :append-icon="pwdConfirmMode ? 'visibility' : 'visibility_off'"
                        @click:append="() => (pwdConfirmMode = !pwdConfirmMode)"
                        :type="pwdConfirmMode ? 'password' : 'text'"
                        hint='Verify your password again.',
                        persistent-hint
                        v-validate='{ required: true, min: 8 }',
                        data-vv-name='adminPasswordConfirm',
                        data-vv-as='Confirm Password',
                        data-vv-scope='admin',
                        :error-messages='errors.collect(`admin.adminPasswordConfirm`)'
                        @keyup.enter='install'
                      )
                v-divider.mb-4
                v-checkbox.ml-3(
                  color='primary',
                  v-model='conf.telemetry',
                  label='Allow Telemetry',
                  persistent-hint,
                  hint='Help Wiki.js developers improve this app with anonymized telemetry.'
                )
              v-alert(:value='error', type='error', icon='warning') {{ errorMessage }}
              v-divider.mt-3(v-if='!error')
              v-card-actions
                v-btn(color='primary', @click='install', :disabled='loading', large, flat, block)
                  span Install
                  v-icon(right) arrow_forward
    v-dialog(v-model='loading', width='450', persistent)
      v-card(color='primary', dark).radius-7
        v-card-text.text-xs-center.py-5
          .py-3(style='width: 64px; display:inline-block;')
            breeding-rhombus-spinner(
              :animation-duration='2000'
              :size='64'
              color='#FFF'
              )
          template(v-if='!success')
            .subheading Finalizing your installation...
            .caption Just a moment
          template(v-else)
            .subheading Installation complete!
            .caption Redirecting...