gpc-ui 0.1.12 → 0.1.14

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "gpc-ui",
-  "version": "0.1.12",
+  "version": "0.1.14",
   "description": "二小UI",
   "private": false,
   "main": "lib/gpc-ui.umd.min.js",

package/src/components/gpc-login/index.vue

@@ -1,13 +1,10 @@
 <template>
   <div class="wrap">
-    <div class="wrap-head" style="position: relative; width: 100%; top: 10%; padding-right: 10%;">
-      <slot></slot>
-      <div style="color: #018a46;  font-size: 48px; font-style: oblique; text-align: right;">
-        华西绿舍装配式建筑智造系统
-
+    <div class="wrap-head" style="position: relative; width: 100%; top: 12%; padding-right: 10%;">
+      <div style="color: #018a46;  font-size: 40px; font-style: unset; text-align: right;">
+        {{systemTitle}}
       </div>
-      <div style="color: #018a46;  font-size: 32px; font-style: unset; text-align: right;">● PCMS</div>
-
+      <div style="color: #018a46;  font-size: 32px; font-style: unset; text-align: right;">●{{subtitle}}</div>
     </div>
     <div class="wrap-box">
       <div class="box-content">
@@ -30,13 +27,15 @@
               <div>
                 <div class="input-box">
                   <input type="text" placeholder="用户名/手机号" v-model="accountFrom.username">
-                  <i class="iconfont icon-wo"></i>
                 </div>
                 <div class="input-box">
                   <input type="password" placeholder="密码" v-model="accountFrom.password">
-                  <i class="iconfont icon-mima"></i>
+                  <i class="el-icon-edit"></i>
                 </div>
-
+                <drag-verify ref="dragVerifyLogin" :width="300" :isPassing.sync="isPassingAccount" text="请按住滑块拖动" successText="验证通过" progressBarBg="#11C36A"
+                             handlerIcon="el-icon-d-arrow-right" successIcon="el-icon-circle-check"
+                             @passcallback="passCallAccountBack">
+                </drag-verify>
                 <div class="buttons clearfix">
                   <button type="button" class="btn-login fr button" @click="getAccountLogin">登录</button>
                 </div>
@@ -46,7 +45,6 @@
               <div>
                 <div class="input-box">
                   <input type="text" placeholder="手机号" v-model="verifyFrom.username">
-                  <i class="iconfont icon-wo"></i>
                 </div>
                 <div class="input-box">
                   <drag-verify ref="dragVerifyLogin" :width="300" :isPassing.sync="isPassingLogin" text="请按住滑块拖动" successText="验证通过" progressBarBg="#11C36A"
@@ -72,7 +70,6 @@
             <h3>重置密码</h3>
             <div class="input-box">
               <input type="text" placeholder="手机号" v-model="verifyFrom.username">
-              <i class="iconfont icon-wo"></i>
             </div>
             <div class="input-box">
               <drag-verify ref="dragVerifyRest" :width="320" :isPassing.sync="isPassingRest" text="请按住滑块拖动" successText="验证通过" progressBarBg="#11C36A"
@@ -92,16 +89,16 @@
           </div>
         </div>
       </div>
-      <div style="color: red; font-size: 15px; margin-top: 30px; text-align: right;">*本平台为互联网非涉密平台，严禁处理、传输国家秘密、工作秘密。</div>
+      <div style="color: red; font-size: 15px; margin-top: 30px; text-align: right;">{{promptTitle}}</div>
     </div>
     <div class="wrap-foot">
       <div class="center_con" style="font-size: 12px;">
         <div>
-          <p>主办：四川华西绿舍建筑有限公司 </p>
-          <p>ICP备案/许可证编号：<a href="https://beian.miit.gov.cn/#/Integrated/index" target="_blank">蜀ICP备19027284号-1</a> 网站识别码：5101000033
+          <p>主办：{{orgTitle}}</p>
+          <p>ICP备案/许可证编号：<a href="https://beian.miit.gov.cn/#/Integrated/index" target="_blank">{{icpNo}}</a>
             <a href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=51019002000801" target="_blank">
               <img style="width: 20px;" src="https://beian.mps.gov.cn/img/logo01.dd7ff50e.png">
-              川公网安备 51019002000801号
+              川公网安备 {{waNo}}
             </a>
           </p>
         </div>
@@ -123,7 +120,30 @@ export default {
     dragVerify,
   },
   props: {
-    msg: String
+    systemTitle :  {
+      type: String,
+      default: ''
+    },
+    subtitle :  {
+      type: String,
+      default: ''
+    },
+    promptTitle :  {
+      type: String,
+      default: ''
+    },
+    orgTitle:  {
+      type: String,
+      default: ''
+    },
+    icpNo:  {
+      type: String,
+      default: ''
+    },
+    waNo:  {
+      type: String,
+      default: ''
+    },
   },
   data() {
     return {
@@ -134,8 +154,11 @@ export default {
       // 账号登录
       accountFrom:{
         username: '',
+        authCode: "",
         password: ''
       },
+      // 滑块验证 - 验证码登录
+      isPassingAccount: false,
       // 验证码登录
       verifyFrom:{
         username: "",
@@ -165,9 +188,32 @@ export default {
     }
   },
   methods: {
+    // 获取传入验证码
+    getCodeRequest(type, authCode){
+      if(type === 'account'){
+        this.accountFrom.authCode = authCode
+      } else if(type === 'login'){
+        this.verifyFrom.authCode = authCode
+      } else if(type === 'rest'){
+        this.resetFrom.authCode = authCode
+      }
+    },
     // 账号登录
     getAccountLogin(){
-
+      if(!this.accountFrom.authCode){
+        this.$notify.error({message: '请先验证滑块'});
+      } else if(!this.accountFrom.username){
+        this.$notify.error({message: '请先输入账号或手机号'});
+      } else if(!this.accountFrom.password){
+        this.$notify.error({message: '请先输入密码'});
+      } else {
+        this.$emit('applyAccountLoginRequest', this.accountFrom);
+      }
+    },
+    // 账号登录验证
+    passCallAccountBack(){
+      console.log('passCallAccountBack \'验证通过\'', this.isPassingAccount);
+      this.$emit('getCodeRequest', 'account');
     },
     // 验证码登录
     getVerifyCodeLogin(){
@@ -190,6 +236,7 @@ export default {
     },
     passCallLoginBack() {
       console.log('passCallLoginBack \'验证通过\'');
+      this.$emit('getCodeRequest', 'code');
       // this.isPassingLogin = false
     },
     resetLogin() {
@@ -216,8 +263,9 @@ export default {
       }
     },
     passCallRestBack() {
-      console.log('passcallback \'验证通过\'');
+      console.log('passCallRestBack \'验证通过\'');
       // this.isPassingRest = false
+      this.$emit('getCodeRequest', 'rest');
     },
     resetPw() {
       this.isPassingRest = false;
@@ -569,7 +617,7 @@ a {
 }
 
 .input-box input:focus + i:after {
-  width: 320px;
+  width: 300px;
 }
 
 .manager-box .button {