add account in login

package.json

@@ -24,11 +24,12 @@
     "clone": "^2.1.2",
     "element-ui": "^2.12.0",
     "extensionizer": "^1.0.1",
-    "js-for-qos-httprpc": "https://github.com/QOSGroup/js-for-qos-httprpc.git",
+    "qosWeb": "https://github.com/QOSGroup/js-for-qos-httprpc.git",
     "qosKeys": "https://github.com/QOSGroup/js-keys",
     "vue": "^2.6.10",
     "vue-router": "^3.0.1",
     "vuex": "^3.0.1",
+    "vee-validate": "^2.1.7",
     "webextension-polyfill": "^0.3.1"
   },
   "devDependencies": {

src/background.js

@@ -39,6 +39,14 @@ window.getBgState = function () {
   return Object.assign({}, store.state)
 }
 
+window.getAccountList = async function () {
+  return store.getters.accountList
+}
+
+window.getCurrentAccount = async function () {
+  return store.getters.currentAccount
+}
+
 window.getFirstMsg = async function () {
   return store.getters.firstMsg
 }

src/business/auth.js

@@ -2,6 +2,7 @@ import db from '../utils/db'
 
 const TOKEN_KEY = 'qos-web-wallet-token'
 const ACCOUNTLIST = 'qos-account-list'
+const CURRENTACCOUNT = 'qos-current-account'
 
 export function setToken (token) {
   return db.set(TOKEN_KEY, token)
@@ -11,20 +12,50 @@ export function getToken () {
   return db.get(TOKEN_KEY)
 }
 
-/** 设置账户 */
-export function setAccount (account) {
-  const list = getAccountList()
-  if (list && Array.isArray(list)) {
-    let acc = list.find(x => x.address === account.address)
-    if (acc) {
-      acc = account
-      return
-    }
-    list.push(account)
-  }
-}
-
 /** 获取账户列表 */
 export function getAccountList () {
   return db.get(ACCOUNTLIST)
 }
+export function setAccountList (list) {
+  return db.set(ACCOUNTLIST, list)
+}
+
+// /** 设置账户 */
+// export function setAccount (account) {
+//   const list = getAccountList()
+//   if (list && Array.isArray(list)) {
+//     let acc = list.find(x => x.address === account.address)
+//     if (acc) {
+//       acc = account
+//       return
+//     }
+//     list.push(account)
+//   }
+// }
+
+// export function getAccountByName(accountName){
+//     const list = getAccountList()
+//     if (list && Array.isArray(list)) {
+//       let acc = list.find(x => x.name === accountName)
+//       if (acc) {
+//         return acc
+//       }
+//     }
+//     return null
+// }
+
+// export function setCurrentAccount(accountName){
+//   const acc = getAccountByName(accountName)
+//   if (acc) {
+//       return db.set(CURRENTACCOUNT, acc)
+//   }
+//   return null
+// }
+
+export function setCurrentAccount(account) {
+  return db.set(CURRENTACCOUNT, account)
+}
+
+export function getCurrentAcount() {
+  return db.get(CURRENTACCOUNT)
+}

src/business/types.js

@@ -1,6 +1,47 @@
+// import {IKeyPair} from './qosWeb/core/types'
+// import Account from './qosWeb/core'
+
 export class ToPage {
   constructor (params) {
     this.pageName = params.pageName
     this.params = params.params
   }
 }
+
+export class Asset {
+  constructor (name, amount) {
+    this.name = name
+    this.amount = amount
+  }
+}
+
+export class encrypedKeyPair {
+  constructor(pub, priv, bech32pub) {
+    this.publicKey = pub
+    this.encrypedPrivateKey = priv
+    this.bech32pub = bech32pub
+  }
+}
+
+export class Account {
+  constructor (name, address, encrypedKeyPair) {
+    this.name = name
+    this.adress = address
+    this.encrypedKeyPair = encrypedKeyPair
+    this.qos = new Asset('QOS', 0)
+    this.qscs = {}
+  }
+
+  getQOS () {
+    return this.qos.amount
+  }
+
+  getAsset (name) {
+    if (name === 'QOS') {
+      return this.qos.amount
+    } else if (this.qscs.hasOwnProperty(name)) {
+      return this.qscs[name].amount
+    }
+    return null
+  }
+}

src/content-src.js

@@ -29,7 +29,8 @@ window.addEventListener('message', function (event) {
       // new InputParams('qosToPage', event.data.params, event.data.callbackIndex),
       event.data,
       function (response) {
-        console.log('response', response)
+        console.log('callback in contents', response)
+        return response
         // window.postMessage({
         //   type: 'qosProcessCallback',
         //   callbackIndex: response.callbackIndex,

src/popup/router/hook.js

@@ -20,7 +20,7 @@ const bg = extension.extension.getBackgroundPage()
 const bgState = bg.getBgState()
 store.commit(types.SET_MSG_QUEQUE, clone(bgState.msgQueue))
 // store.commit(types.INPUT_TOPAGE_PARAMS, new ToPage(bgState.toPage))
-console.log('bgState.msgQueue', bgState.msgQueue)
+console.log('bgState.msgQueue in popup hook', bgState.msgQueue)
 
 export async function beforeEach (to, from, next) {
   // const first = await bg.getFirstMsg()

src/popup/router/pages/CreateAccount.vue

@@ -0,0 +1,67 @@
+<template>
+  <div class="register-wrap">
+    <img class="logo" src="/icons/qos.png" alt="qos logo" />
+    <div>111{{testName}}</div>
+
+    <el-form :model="ruleForm" :rules="rules" ref="ruleForm" class="demo-ruleForm">
+      <!-- <el-form-item label prop="name">
+        <el-input v-model="ruleForm.pwd" placeholder="请输入登录密码"></el-input>
+      </el-form-item>-->
+      <el-form-item>
+        <el-button class="btn btn-register" type="primary" @click="submitRegister('ruleForm')">立即创建</el-button>
+      </el-form-item>
+      <el-form-item>
+        <el-button class="btn btn-import" type="primary" @click="submitImport('ruleForm')">立即导入</el-button>
+      </el-form-item>
+    </el-form>
+  </div>
+</template>
+
+<script>
+
+export default {
+  data () {
+    return {
+      ruleForm: {
+        pwd: ''
+      },
+      rules: {
+        name: [
+          { required: true, message: '请输入登录密码', trigger: 'blur' },
+          { min: 6, max: 30, message: '长度在 6 到 30 个字符', trigger: 'blur' }
+        ]
+      }
+    }
+  },
+  computed: {
+    testName () {
+      return this.$store.state.toPage.pageName
+    }
+  },
+  mounted () {
+    console.log(this.$store.state.toPage.pageName)
+  },
+  submitRegister () {
+    console.log('register', this.data())
+  },
+  submitImport () {
+    console.log('import', this.data())
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+@import "~style/common.scss";
+.register-wrap {
+  @include common-container;
+  .logo {
+    width: 20%;
+    display: block;
+    margin: 0 auto;
+    margin-bottom: 50px;
+  }
+  .btn-register {
+    width: 100%;
+  }
+}
+</style>

src/popup/router/pages/Login.vue

@@ -6,7 +6,7 @@
         <el-input v-model="ruleForm.pwd" placeholder="请输入登录密码"></el-input>
       </el-form-item>
       <el-form-item>
-        <el-button class="btn btn-login" type="primary" @click="submitForm('ruleForm')">进入我的钱包</el-button>
+        <el-button class="btn btn-login" type="primary" @click="submitLogin('ruleForm')">进入我的钱包</el-button>
       </el-form-item>
     </el-form>
     <div style="text-align:left;height:30px;">
@@ -19,11 +19,16 @@
 </template>
 
 <script>
+
+import {getCurrentAcount} from '../../../business/auth';
+import Account from 'qosWeb/build/main/core/Account';
+
 export default {
   data() {
     return {
       ruleForm: {
-        pwd: ""
+        pwd: '',
+        defaultAccount:  {}
       },
       rules: {
         pwd: [
@@ -40,8 +45,28 @@ export default {
     noWallet() {
       this.$router.push("/newwallet");
     }
+  },
+  submitLogin () {
+    if (!isNotEmpty(this.data.pwd)) {
+        console.log('pwd is empty');
+        return
+      }
+    var password = this.data.pwd;
+      const currentAccount = getCurrentAcount();
+      console.log(currentAccount);
+      if (currentAccount)  { 
+        accountList.forEach(acc => {
+          if (Account(acc).name ===accountName){
+            console.log('dup account name');
+            return 
+          }
+          console.log(acc)
+        }); 
+
+    console.log('login')
   }
-};
+}
+}
 </script>
 
 <style lang="scss" scoped>

src/popup/router/pages/NewAccount.vue

@@ -7,14 +7,38 @@
     </div>
     <div>
       <el-input type="input" v-model="form.name" clearable style="width:80%;"></el-input>
+      <el-input
+            type="text"
+            name="accountName"
+            v-model="accountName"
+            placeholder="Name for new Account"
+            v-validate="isValidateAccountName"
+            ref="accountName"
+            @blur="onBlur"
+          >
     </div>
     <div>
-      <el-button type="primary" plain @click="createAccount">新建</el-button>
+      <el-button type="primary" plain @click="onCreateAccount">新建</el-button>
     </div>
   </div>
 </template>
 
 <script>
+import {getAccountList} from '../../../business/auth';
+import Account from 'qosWeb/build/main/core/Account';
+import { isNotEmpty } from 'qosWeb/build/main/core/utils';
+import { Validator } from 'vee-validate';
+const isValidateAccountName = (value) => {
+  if (!value || value === '') {
+    return false;
+  }
+};
+
+Validator.extend('isValidateAccountName', {
+  getMessage: (field) => `请输入新建账户名称`,
+  validate: (value) => isValidateAccountName(value)
+});
+
 export default {
   data() {
     return {
@@ -31,7 +55,22 @@ export default {
         ? this.$router.go(-1)
         : this.$router.push("/homepage");
     },
-    createAccount() {
+    onCreateAccount() {
+      if (!isNotEmpty(accountName)) {
+        console.log('account name empty');
+        return
+      }
+      const accountList = getAccountList();
+      console.log(accountList);
+      if (accountList && len(accountList) > 0) { 
+        accountList.forEach(acc => {
+          if (Account(acc).name ===accountName){
+            console.log('dup account name');
+            return 
+          }
+          console.log(acc)
+        }); 
+      }
       console.log("新建账户...");
     }
   }