src/popup/home/components/menu-creation.vue

   1 <style scoped>
   2 .form {
   3   margin: 50px 0;
   4 }
   5 .form-item .btn {
   6   margin-top: 15px;
   7 }
   8 </style>
   9
  10 <template>
  11     <div class="mc2warp bg-gray">
  12         <section>
  13             <i class="iconfont btn-close" @click="close">&#xe605;</i>
  14             <h3>创建账户</h3>
  15         </section>
  16         <section class="form">
  17           <div class="form-item">
  18             <label class="form-item-label">账户别名</label>
  19             <div class="form-item-content" style="margin-left: 60px;">
  20               <input type="text" v-model="formItem.accAlias">
  21             </div>
  22           </div>
  23           <div class="form-item">
  24             <label class="form-item-label">密钥别名</label>
  25             <div class="form-item-content" style="margin-left: 60px;">
  26               <input type="text" v-model="formItem.keyAlias">
  27             </div>
  28           </div>
  29           <div class="form-item">
  30             <label class="form-item-label">密钥密码</label>
  31             <div class="form-item-content" style="margin-left: 60px;">
  32               <input type="password" v-model="formItem.passwd1">
  33             </div>
  34           </div>
  35           <div class="form-item">
  36             <label class="form-item-label">重复密码</label>
  37             <div class="form-item-content" style="margin-left: 60px;">
  38               <input type="password" v-model="formItem.passwd2">
  39             </div>
  40           </div>
  41           <div class="tips">{{tips}}</div>
  42           <div class="form-item bg-gray">
  43             <div class="btn bg-green" @click="create">创建账户</div>
  44           </div>
  45         </section>
  46     </div>
  47 </template>
  48
  49 <script>
  50 import bytom from "../../script/bytom";
  51 export default {
  52   name: "",
  53   components: {},
  54   data() {
  55     return {
  56       formItem: {
  57         accAlias: "",
  58         keyAlias: "",
  59         passwd1: "",
  60         passwd2: ""
  61       },
  62       tips: ""
  63     };
  64   },
  65   methods: {
  66     close: function() {
  67       this.$emit("closed", "");
  68     },
  69     create: function() {
  70       if (this.formItem.passwd1 != this.formItem.passwd2) {
  71         this.tips = "两次密码不一致，请检查后再试";
  72         return;
  73       }
  74
  75       let loader = this.$loading.show({
  76         // Optional parameters
  77         container: this.fullPage ? null : this.$refs.formContainer,
  78         canCancel: true,
  79         onCancel: this.onCancel
  80       });
  81
  82       bytom.Account.create(
  83         this.formItem.accAlias,
  84         this.formItem.keyAlias,
  85         this.formItem.passwd1
  86       )
  87         .then(res => {
  88           loader.hide();
  89           this.close();
  90           console.log(res);
  91           this.formItem = {};
  92         })
  93         .catch(err => {
  94           loader.hide();
  95           console.log(err);
  96           alert(err);
  97           // this.tips = err.message;
  98         });
  99     }
 100   },
 101   mounted() {}
 102 };
 103 </script>