ソースを参照

extract menu from password generator

pull/342/head
Guillaume Vincent 8年前
コミット
3bb1a2667c
4個のファイルの変更135行の追加126行の削除
  1. +17
    -1
      src/App.vue
  2. +3
    -3
      src/components/Menu.vue
  3. +112
    -119
      src/components/PasswordGenerator.vue
  4. +3
    -3
      src/main.js

+ 17
- 1
src/App.vue ファイルの表示

@@ -89,11 +89,27 @@
.link {
cursor: pointer;
}

.card-block {
position: relative;
}
</style>
<template>
<div id="app">
<div id="lesspass" class="card">
<router-view></router-view>
<lesspass-menu></lesspass-menu>
<div class="card-block">
<router-view></router-view>
</div>
</div>
</div>
</template>
<script type="text/ecmascript-6">
import LesspassMenu from './components/Menu';

export default {
components: {
LesspassMenu
}
}
</script>

+ 3
- 3
src/components/Menu.vue ファイルの表示

@@ -5,16 +5,16 @@
color: #FFF;
}

#title {
#menu-title {
cursor: pointer;
}
</style>
<template>
<div>
<div id="menu">
<div class="card-header" v-show="isAuthenticated">
<div class="row">
<div class="col-xs-6">
<span id="title" v-on:click="go('index')">LessPass</span>
<span id="menu-title" v-on:click="go('index')">LessPass</span>
</div>
<div class="col-xs-6 text-xs-right">
<div class="btn-group">


+ 112
- 119
src/components/PasswordGenerator.vue ファイルの表示

@@ -1,78 +1,75 @@
<template>
<div>
<lesspass-menu></lesspass-menu>
<div class="card-block">
<form>
<div class="form-group row">
<div class="col-xs-12">
<div class="inner-addon left-addon">
<i class="fa fa-globe"></i>
<input id="site"
name="site"
type="text"
class="form-control"
placeholder="Site"
list="savedSites"
autocorrect="off"
autocapitalize="none"
v-model="password.site">
<datalist id="savedSites">
<option v-bind:value="pwd.id" v-for="pwd in passwords">
{{pwd.site}} ({{pwd.login}})
</option>
</datalist>
</div>
</div>
<form>
<div class="form-group row">
<div class="col-xs-12">
<div class="inner-addon left-addon">
<i class="fa fa-globe"></i>
<input id="site"
name="site"
type="text"
class="form-control"
placeholder="Site"
list="savedSites"
autocorrect="off"
autocapitalize="none"
v-model="password.site">
<datalist id="savedSites">
<option v-bind:value="pwd.id" v-for="pwd in passwords">
{{pwd.site}} ({{pwd.login}})
</option>
</datalist>
</div>
<remove-auto-complete></remove-auto-complete>
<div class="form-group row">
<div class="col-xs-12">
<div class="inner-addon left-addon">
<i class="fa fa-user"></i>
<label for="login" class="sr-only">Login</label>
<input id="login"
name="login"
type="text"
class="form-control"
placeholder="Login"
autocomplete="off"
autocorrect="off"
autocapitalize="none"
v-model="password.login">
</div>
</div>
</div>
</div>
<remove-auto-complete></remove-auto-complete>
<div class="form-group row">
<div class="col-xs-12">
<div class="inner-addon left-addon">
<i class="fa fa-user"></i>
<label for="login" class="sr-only">Login</label>
<input id="login"
name="login"
type="text"
class="form-control"
placeholder="Login"
autocomplete="off"
autocorrect="off"
autocapitalize="none"
v-model="password.login">
</div>
<div class="form-group row">
<div class="col-xs-12">
<div class="inner-addon left-addon input-group">
<label for="masterPassword" class="sr-only">Password</label>
<i class="fa fa-lock"></i>
<input id="masterPassword"
name="masterPassword"
ref="masterPassword"
type="password"
class="form-control"
placeholder="Master password"
autocorrect="off"
autocapitalize="none"
v-model="masterPassword">
<fingerprint :fingerprint="masterPassword"
v-on:click.native="showMasterPassword"></fingerprint>
</div>
</div>
</div>
</div>
<div class="form-group row">
<div class="col-xs-12">
<div class="inner-addon left-addon input-group">
<label for="masterPassword" class="sr-only">Password</label>
<i class="fa fa-lock"></i>
<input id="masterPassword"
name="masterPassword"
ref="masterPassword"
type="password"
class="form-control"
placeholder="Master password"
autocorrect="off"
autocapitalize="none"
v-model="masterPassword">
<fingerprint :fingerprint="masterPassword"
v-on:click.native="showMasterPassword"></fingerprint>
</div>
<div class="form-group row">
<div class="col-xs-12">
<div class="input-group">
<label for="generatedPassword" class="sr-only">Password Generated</label>
<input id="generatedPassword"
name="generatedPassword"
type="text"
class="form-control"
tabindex="-1"
readonly
v-model="generatedPassword">
<span class="input-group-btn">
</div>
</div>
<div class="form-group row">
<div class="col-xs-12">
<div class="input-group">
<label for="generatedPassword" class="sr-only">Password Generated</label>
<input id="generatedPassword"
name="generatedPassword"
type="text"
class="form-control"
tabindex="-1"
readonly
v-model="generatedPassword">
<span class="input-group-btn">
<button id="copyPasswordButton" class="btn-copy btn btn-primary"
:disabled="!generatedPassword"
v-on:click="generatePassword()"
@@ -81,60 +78,57 @@
<i class="fa fa-clipboard white"></i> Copy
</button>
</span>
</div>
</div>
</div>
<div class="form-group row">
<div class="col-xs-12">
Password options
<hr style="margin:0;">
</div>
</div>
<div class="form-group row">
<div class="col-xs-12">
<label class="form-check-inline">
<input class="form-check-input" type="checkbox" id="lowercase"
v-model="password.options.lowercase"> abc
</label>
<label class="form-check-inline">
<input class="form-check-input" type="checkbox" id="uppercase"
v-model="password.options.uppercase"> ABC
</label>
<label class="form-check-inline">
<input class="form-check-input" type="checkbox" id="numbers"
v-model="password.options.numbers">
123
</label>
<label class="form-check-inline">
<input class="form-check-input" type="checkbox" id="symbols"
v-model="password.options.symbols">
%!@
</label>
</div>
</div>
<div class="form-group row">
<label for="passwordLength" class="col-xs-3 col-form-label">Length</label>
<div class="col-xs-3 p-l-0">
<input class="form-control" type="number" id="passwordLength" v-model="password.options.length">
</div>
<label for="passwordCounter" class="col-xs-3 col-form-label">Counter</label>
<div class="col-xs-3 p-l-0">
<input class="form-control" type="number" id="passwordCounter"
v-model="password.options.counter">
</div>
</div>
</form>
</div>
</div>
<div class="form-group row">
<div class="col-xs-12">
Password options
<hr style="margin:0;">
</div>
</div>
<div class="form-group row">
<div class="col-xs-12">
<label class="form-check-inline">
<input class="form-check-input" type="checkbox" id="lowercase"
v-model="password.options.lowercase"> abc
</label>
<label class="form-check-inline">
<input class="form-check-input" type="checkbox" id="uppercase"
v-model="password.options.uppercase"> ABC
</label>
<label class="form-check-inline">
<input class="form-check-input" type="checkbox" id="numbers"
v-model="password.options.numbers">
123
</label>
<label class="form-check-inline">
<input class="form-check-input" type="checkbox" id="symbols"
v-model="password.options.symbols">
%!@
</label>
</div>
</div>
<div class="form-group row">
<label for="passwordLength" class="col-xs-3 col-form-label">Length</label>
<div class="col-xs-3 p-l-0">
<input class="form-control" type="number" id="passwordLength" v-model="password.options.length">
</div>
<label for="passwordCounter" class="col-xs-3 col-form-label">Counter</label>
<div class="col-xs-3 p-l-0">
<input class="form-control" type="number" id="passwordCounter"
v-model="password.options.counter">
</div>
</div>
</div>
</form>
</template>

<script type="text/ecmascript-6">
import {mapGetters} from 'vuex'
import RemoveAutoComplete from './RemoveAutoComplete'
import Fingerprint from './Fingerprint'
import {mapGetters} from 'vuex';
import RemoveAutoComplete from './RemoveAutoComplete';
import Fingerprint from './Fingerprint';
import lesspass from 'lesspass';
import Clipboard from 'clipboard';
import LesspassMenu from './Menu';
import debounce from 'lodash.debounce';
import {showTooltip} from '../api/tooltip';

@@ -160,7 +154,6 @@
}
},
components: {
LesspassMenu,
RemoveAutoComplete,
Fingerprint
},


+ 3
- 3
src/main.js ファイルの表示

@@ -1,9 +1,9 @@
import 'babel-polyfill';
import Vue from 'vue'
import Vue from 'vue';
import 'bootstrap/dist/css/bootstrap.css';
import 'font-awesome/css/font-awesome.css';
import 'hint.css/hint.css';
import LessPass from './App.vue'
import App from './App';
import 'bootstrap/dist/js/bootstrap.min';
import Store from './store'
import Storage from './api/storage';
@@ -16,5 +16,5 @@ new Vue({
el: '#app',
store,
router,
render: h => h(LessPass)
render: h => h(App)
});

読み込み中…
キャンセル
保存