dvcp_v2_wxcp_app/src/pages/login.vue

<template>
  <section class="login">
    <div v-if="appPath" class="gotoApp">
      <b v-text="appPath"/>
      <div>正在登录...</div>
    </div>
    <u-form :model="form" ref="loginForm" label-width="140" :rules="rules">
      <u-form-item label="账号" prop="username">
        <input v-model="form.username" placeholder="请输入手机号"/>
      </u-form-item>
      <u-form-item label="密码" prop="password">
        <input type="password" v-model="form.password" placeholder="请输入密码" @confirm="handleLogin"/>
      </u-form-item>
    </u-form>
    <div class="btn" @tap="handleLogin">登录</div>
  </section>
</template>

<script>
import {mapActions, mapMutations, mapState} from "vuex";

export default {
  name: "login",
  computed: {
    ...mapState(['apps']),
    rules() {
      return {
        username: [{required: true, message: "请输入 手机号"}],
        password: [{required: true, message: "请输入 密码"}],
      }
    },
    target() {
      return decodeURIComponent(this.$route.query.back) || ""
    },
    currentApp() {
      let path = this.target.replace(/(.+)[\\\/][^\\\/]+\??.*/, '$1')
      return this.apps.find(e => e.libPath.indexOf(path) > -1) || {}
    },
    appPath() {
      return this.currentApp?.label || ""
    }
  },
  data() {
    return {
      form: {}
    }
  },
  methods: {
    ...mapActions(['getToken']),
    ...mapMutations(['login']),
    handleLogin() {
      this.$refs.loginForm.validate(v => {
        if (v) {
          let {name: module, libPath} = this.currentApp,
              corpId = 'ww596787bb70f08288'
          if (/\/project\/police\//.test(libPath)) {
            module = 'hnjc'
          } else if (/\/project\/beta\//.test(libPath)) {
            corpId = 'ww2a667717a70164f1'
            module = 'wangge'
          }
          this.getToken({...this.form, module, corpId}).then(() => {
            this.target ? uni.reLaunch({url: this.target}) : uni.navigateBack({})
          }).catch(() => 0)
        }
      })
    },
  },
  mounted() {
    this.$refs.loginForm.setRules(this.rules)
  }
}
</script>

<style lang="scss" scoped>
.login {
  border-top: 1px solid #D4D4D4;
  padding: 0 0 208px;
  background: #F5F5F5;
  box-sizing: border-box;
  height: 100%;

  .btn {
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100vw;
    background: $uni-color-primary;
    color: #fff;
    text-align: center;
    line-height: 96px;
    font-size: 32px;
  }

  .gotoApp {
    background: #fff;
    text-align: center;
    padding: 32px;

    b {
      display: block;
      font-size: 40px;
      margin-bottom: 8px;
    }
  }

}
</style>