提供一个vue前端页面示例，样式使用elementui美化，包括登录和注册的切换，注册信息保存到仓库，登录信息通过仓库验证，记住密码调用仓库数据，登录成功后跳转页面返回用户信息

以下是一个示例：

<template>
  <div class="login-container">
    <el-card class="login-card">
      <h2 class="login-title">{{ isLogin ? '登录' : '注册' }}</h2>
      <el-form :model="form" ref="form" :rules="rules" label-width="80px" class="login-form">
        <el-form-item label="用户名" prop="username">
          <el-input v-model="form.username" placeholder="请输入用户名"></el-input>
        </el-form-item>
        <el-form-item label="密码" prop="password">
          <el-input v-model="form.password" type="password" placeholder="请输入密码"></el-input>
        </el-form-item>
        <el-form-item v-if="!isLogin" label="确认密码" prop="confirmPassword">
          <el-input v-model="form.confirmPassword" type="password" placeholder="请再次输入密码"></el-input>
        </el-form-item>
        <el-form-item v-if="!isLogin" label="邮箱" prop="email">
          <el-input v-model="form.email" placeholder="请输入邮箱"></el-input>
        </el-form-item>
        <el-form-item>
          <el-checkbox v-model="rememberPwd">记住密码</el-checkbox>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="submitForm">{{ isLogin ? '登录' : '注册' }}</el-button>
        </el-form-item>
        <el-form-item>
          <el-link @click="toggleLogin">{{ isLogin ? '没有账号？去注册' : '已有账号？去登录' }}</el-link>
        </el-form-item>
      </el-form>
    </el-card>
  </div>
</template>

<script>
export default {
  data() {
    return {
      isLogin: true,
      rememberPwd: false,
      form: {
        username: '',
        password: '',
        confirmPassword: '',
        email: ''
      },
      rules: {
        username: [{ required: true, message: '请输入用户名', trigger: 'blur' }],
        password: [{ required: true, message: '请输入密码', trigger: 'blur' }],
        confirmPassword: [{ required: true, message: '请再次输入密码', trigger: 'blur' }],
        email: [{ required: true, message: '请输入邮箱', trigger: 'blur' }]
      }
    };
  },
  methods: {
    submitForm() {
      this.$refs.form.validate(valid => {
        if (valid) {
          if (this.isLogin) {
            // 登录逻辑
            // 验证用户信息是否正确
            // 如果正确，将用户信息保存到 Vuex 中，然后跳转页面
          } else {
            // 注册逻辑
            // 验证用户信息是否正确
            // 如果正确，将用户信息保存到 Vuex 中，然后跳转页面
          }
        } else {
          return false;
        }
      });
    },
    toggleLogin() {
      this.isLogin = !this.isLogin;
    }
  }
};
</script>

<style scoped>
.login-container {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
}
.login-card {
  width: 400px;
}
.login-title {
  text-align: center;
  margin-bottom: 20px;
}
.login-form {
  margin-top: 30px;
}
</style>

在上面的示例中，我们使用了 ElementUI 组件库来美化页面，使用了 Vue 的表单验证功能来验证用户输入的信息。当用户点击登录或注册按钮时，会调用 `submitForm` 方法来提交表单，并且根据当前是否是登录状态来执行不同的逻辑。如果用户信息验证成功，就会将用户信息保存到 Vuex 仓库中，然后跳转到目标页面，并且在跳转时将用户信息一并传递过去。如果用户勾选了“记住密码”，则在下次打开页面时会自动填充用户名和密码。