doctor-xklr/src/renderer/pages/login/index.vue

<template>
  <div class="pagecontent overflow" v-loading="loading"
    style="background-image: linear-gradient(to bottom right, rgb(240, 248, 253), rgb(225, 241, 252));">
    <div class="content">
      <div class="p-3 text-center ">
        <div class="mt-4">
          <img :src="logo" alt="" width="50" height="50">
        </div>
        <div class="text-center font-bold text-dark mt-4">
          医生登录
        </div>
        <div class="text-center font-bold text-dark mt-3 text-center">
          <el-form size="mini" ref="form" :model="formInline" class="px-3 " :rules="rules">
            <el-form-item prop="username">
              <el-input prefix-icon="el-icon-user" v-model="formInline.username" placeholder="请输入账号" />
            </el-form-item>
            <el-form-item prop="password">
              <el-input type="password" prefix-icon="el-icon-lock" v-model="formInline.password" placeholder="请输入密码" />
            </el-form-item>
            <el-form-item>
              <el-button type="primary" @click="handleLogin" class="text-center mx-auto w-100">登录</el-button>
            </el-form-item>
          </el-form>
        </div>
        <div class="fs-10 text-gry mt-5">
          <Footer />
        </div>
      </div>
    </div>
  </div>
</template>
<script>
import Footer from '../../components/footer/index.vue'
import { isPassword } from '@/utils/validate.js'
import logo from '@/assets/logo.png'
import { mapActions } from 'vuex'
import { ipcRenderer } from 'electron'
export default {
  name: "Login",
  components: {
    Footer
  },
  data() {
    const validateUsername = (rule, value, callback) => {
      if ('' === value) callback(new Error('手机号不能为空'))
      else callback()
    }
    const validatePassword = (rule, value, callback) => {
      if (!isPassword(value)) callback(new Error('密码不能少于6位'))
      else callback()
    }
    let formInline = process.env.NODE_ENV == "development" ? {
      username: '18812312312', password: '123456' //'cxsrmyyyljkjtfhfy@202098'
    } : {
      username: localStorage.getItem('useraccount') || '',
      password: localStorage.getItem('password') || '',
    }
    return {
      formInline,
      logo,
      rules: {
        username: [
          {
            required: true,
            trigger: 'blur',
            validator: validateUsername,
          },
        ],
        password: [
          {
            required: true,
            trigger: 'blur',
            validator: validatePassword,
          },
        ],
      }, loading: false
    }
  },
  computed: {
  },
  created() {
  },
  methods: {
    onSubmit() {
      // this.$router.push('/userlist')
      // this.$api.login()
    },
    ...mapActions({
      logout: 'user/logout',
      login: 'user/login',
      getUserInfo: 'user/getUserInfo',
      getHospitalInfo: 'user/getHospitalInfo',
      findVisitSum: 'patient/findVisitSum'
    }),
    handleRoute() {
      return this.redirect === '/404' || this.redirect === '/403'
        ? '/'
        : '/home' //this.redirect
    },
    handleLogin() {
      let t = this
      t.loading = true
      t.$refs.form.validate(async (valid) => {
        if (valid)
          try {
            await t.login(t.formInline).then(() => {
              localStorage.setItem('username', t.formInline.username)
              localStorage.setItem('password', t.formInline.password)
              localStorage.setItem('useraccount', t.formInline.username)
              // ipcRenderer.send('setTray', { type: 'login' })
              try {
                Promise.all([
                  t.getUserInfo(),
                  t.$api.getHospitalInfo(),
                  t.findVisitSum()
                ]).then((resall) => {
                 let timer = setInterval(() => {
                    t.findVisitSum().then((res)=>{
                      if(res.code==401){
                        clearInterval(timer)
                        t.logout().then(() => {
                          t.$router.push('/home/login')
                          ipcRenderer.send('removeTray')
                        }).catch((e) => {
                          console.log(e)
                        })
                      }
                    })
                  },  process.env.NODE_ENV == "development"?1000 * 10:1000 * 60)
                  t.$router.push('patientlist')
                  ipcRenderer.send('setTray', { type: 'user', data: resall[0] });
                })
              } finally {
                t.loading = false
              }
            }).catch((e) => {
              console.log(127,e)
            })
          } finally {
            this.loading = false
          }
      })
    },
  },
}
</script>
<style lang="less" scoped>
.content {
  margin: 5px;
  height: calc(100vh -8px);
  border-radius: 5px;
}
</style>