<template>
  <v-layout row justify-center>
    <v-dialog v-model="dialogdata.showeditdialog" persistent max-width="600px">
      <!-- <v-btn slot="activator" color="primary" dark>Open Dialog</v-btn> -->
      <v-card>
        <v-card-title>
          <span class="headline">User Profile ID: {{dialogdata.recordId}}</span>
        </v-card-title>
        <v-card-text>
          <v-container grid-list-md>
            <v-layout wrap>
              <v-flex xs12 sm6 md4>
                <v-text-field label="ZZZZZLegal first name*" required></v-text-field>
              </v-flex>
              <v-flex xs12 sm6 md4>
                <v-text-field label="Legal middle name" hint="example of helper text only on focus"></v-text-field>
              </v-flex>
              <v-flex xs12 sm6 md4>
                <v-text-field
                  label="Legal last name*"
                  hint="example of persistent helper text"
                  persistent-hint
                  required
                ></v-text-field>
              </v-flex>
              <v-flex xs12>
                <v-text-field label="Email*" required></v-text-field>
              </v-flex>
              <v-flex xs12>
                <v-text-field label="Password*" type="password" required></v-text-field>
              </v-flex>
              <v-flex xs12 sm6>
                <v-select :items="['0-17', '18-29', '30-54', '54+']" label="Age*" required></v-select>
              </v-flex>
              <v-flex xs12 sm6>
                <v-autocomplete
                  :items="['Skiing', 'Ice hockey', 'Soccer', 'Basketball', 'Hockey', 'Reading', 'Writing', 'Coding', 'Basejump']"
                  label="Interests"
                  multiple
                ></v-autocomplete>
              </v-flex>
            </v-layout>
          </v-container>
          <small>*indicates required field</small>
        </v-card-text>
        <v-card-actions>
          <v-spacer></v-spacer>
          <v-btn color="blue darken-1" flat @click="$emit('dialogclose')">Close</v-btn>
          <v-btn color="blue darken-1" flat @click="$emit('dialogclose')">Save</v-btn>
        </v-card-actions>
      </v-card>
    </v-dialog>
  </v-layout>
</template>

<script>
/*  eslint-disable */
export default {
  /* Check rights to edit or view here?
    e.g.
    if (
          roles.hasRole(roles.AuthorizationRoles.OpsAdminFull) ||
          roles.hasRole(roles.AuthorizationRoles.OpsAdminLimited)
        ) {
          addNavItem(lt.get("Operations"), "cogs", "ops");
        } */
  props: {
    dialogdata: {
      showeditdialog: false,
      recordId: 0
    }
  }, mounted() {
    /* Check rights here?  
    e.g.
    if (
          roles.hasRole(roles.AuthorizationRoles.OpsAdminFull) ||
          roles.hasRole(roles.AuthorizationRoles.OpsAdminLimited)
        ) {
          addNavItem(lt.get("Operations"), "cogs", "ops");
        } 
    */
    //console.log("MOUNTED");
  },
  data: () => ({}),
  beforeRouteEnter(to, from, next) {
    //console.log("BEFOREROUTENTER");
    debugger;
    if (
      false
      // roles.hasRole(roles.AuthorizationRoles.OpsAdminFull) ||
      // roles.hasRole(roles.AuthorizationRoles.OpsAdminLimited)
    ) {
       debugger;
      next();
    } else {
       debugger;
      next(false);
    }
  }
};
</script>

<style>
</style>
