app-lock.vue 4.0 KB
Newer Older
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140
<template>
  <div class="lock-container">
    <div class="lock-form animated bounceInDown">
      <div class="animated">
        <h3 class="title">{{username}}</h3>
        <el-input :placeholder="$t('components.lockscren.placeholder1')"
                  type="password"
                  class="input-with-select animated"
                  v-model="passwd">
          <el-button slot="append"
                     icon="el-icon-unlock"
                     size="25px"
                     @click="handleLogin"></el-button>
          <el-button slot="append"
                     icon="el-icon-switch-button"
                     size="25px"
                     @click="handleLogout"></el-button>
        </el-input>
      </div>
    </div>
  </div>
</template>

<script lang = 'ts'>
import { removeSessionStorage } from 'ibiz-core';
import { clearCookie } from 'qx-util';
import { Vue, Component, Prop, Model, Watch } from 'vue-property-decorator';

@Component({})
export default class AppLockIndex extends Vue{

    /**
     * 输入密码
     */
    public passwd: string = '';

    /**
     * 保存的密码
     */
    public lockpasswd: string = '';

    /**
     * 用户名
     */
    public username: string = '';

    /**
     * 锁屏前的页面路由
     */
    public path: string = '';

    /**
     * 获取锁屏相关信息
     *
     * @memberof AppLockIndex
     */
    public mounted() {
      this.username = (sessionStorage.getItem('userName') as string);
      this.lockpasswd = window.atob(sessionStorage.getItem('lockPassword') as string);
      this.path = window.atob(sessionStorage.getItem('routerPath') as string);
    }

    /**
     * 解除锁屏
     * 
     * @memberof AppLockIndex
     */
    public handleLogin(){
        if(this.lockpasswd != this.passwd){
            this.passwd = '';
            this.$throw((this.$t('components.lockscren.message1') as string),'handleLogin');
            return;
        }
        this.clearSession();
        this.$router.push({ path: this.path});
    }

    /**
     * 登出
     * 
     * @memberof AppLockIndex
     */
    public handleLogout(){
        this.$confirm((this.$t('components.lockscren.promptinformation') as string), (this.$t('components.lockscren.prompt') as string), {
            confirmButtonText: (this.$t('components.lockscren.confirmbuttontext') as string),
            cancelButtonText: (this.$t('components.lockscren.cancelbuttontext') as string),
            type: "warning"
        }).then(() => {
            this.clearSession();
            const get: Promise<any> = this.$http.get('/v7/logout');
            get.then((response:any) =>{
                if (response && response.status === 200) {
                    this.clearAppData();
                    this.$router.push({ name: 'login' });
                }
            }).catch((error: any) =>{
                console.error(error);
            })
        });  
    }

    /**
     * 清除应用数据
     *
     * @private
     * @memberof AppLockIndex
     */
    private clearAppData() {
        // 清除user、token
        let leftTime = new Date();
        leftTime.setTime(leftTime.getSeconds() - 1);
        clearCookie('ibzuaa-token',true);
        clearCookie('ibzuaa-expired',true);
        clearCookie('ibzuaa-user',true);
        // 清除应用级数据
        localStorage.removeItem('localdata')
        this.$store.commit('addAppData', {});
        this.$store.dispatch('authresource/commitAuthData', {});
        // 清除租户相关信息
        removeSessionStorage("activeOrgData");
        removeSessionStorage("srfdynaorgid");
        removeSessionStorage("dcsystem");
        removeSessionStorage("orgsData");
    }
    
    /**
     * 清除锁屏时生成的session
     */
    public clearSession(){
      sessionStorage.removeItem('lockPassword');
      sessionStorage.removeItem('lockState');
      sessionStorage.removeItem('userName');
      sessionStorage.removeItem('routerPath');
    }
}

</script>
<style lang='less'>
@import './app-lock.less';
</style>