|
@@ -1,142 +0,0 @@
|
|
-<template>
|
|
|
|
- <div style="height:100%" class="register">
|
|
|
|
- <el-container class="all">
|
|
|
|
- <el-header style="z-index:1">
|
|
|
|
- <div class="logo-bar">
|
|
|
|
- <img src="@/assets/logo-3.png" class="logo">
|
|
|
|
- </div>
|
|
|
|
- </el-header>
|
|
|
|
- <el-main class="main">
|
|
|
|
- <div class="content">
|
|
|
|
- <div class="title">用户注册</div>
|
|
|
|
- <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="110px" label-position="left">
|
|
|
|
- <el-form-item label="邀请码">
|
|
|
|
- <el-input v-model="ruleForm.invitation" placeholder="请输入邀请码"></el-input>
|
|
|
|
- </el-form-item>
|
|
|
|
- <el-form-item label="公司名称" prop="name">
|
|
|
|
- <el-input v-model="ruleForm.name" placeholder="请输入公司名称"></el-input>
|
|
|
|
- </el-form-item>
|
|
|
|
- <el-form-item label="联系人" prop="contacts">
|
|
|
|
- <el-input v-model="ruleForm.contacts" placeholder="请输入联系人"></el-input>
|
|
|
|
- </el-form-item>
|
|
|
|
- <el-form-item label="联系人邮箱" prop="email">
|
|
|
|
- <el-input v-model="ruleForm.email" placeholder="请输入联系人邮箱"></el-input>
|
|
|
|
- </el-form-item>
|
|
|
|
- <el-form-item label="联系人地址" prop="address">
|
|
|
|
- <el-input v-model="ruleForm.address" placeholder="请输入联系地址"></el-input>
|
|
|
|
- </el-form-item>
|
|
|
|
- <el-form-item label="管理员账号" prop="username">
|
|
|
|
- <el-input v-model="ruleForm.username" placeholder="请输入管理员账号"></el-input>
|
|
|
|
- </el-form-item>
|
|
|
|
- <el-form-item label="管理员密码" prop="password">
|
|
|
|
- <el-input v-model="ruleForm.password" placeholder="请输入管理员密码"></el-input>
|
|
|
|
- </el-form-item>
|
|
|
|
- <el-form-item >
|
|
|
|
- <!-- <el-button @click="close">取 消</el-button> -->
|
|
|
|
- <el-button type="primary" style="float:right" @click="submit" :loading="btnLoading">注 册</el-button>
|
|
|
|
- </el-form-item>
|
|
|
|
- </el-form>
|
|
|
|
- </div>
|
|
|
|
-
|
|
|
|
- </el-main>
|
|
|
|
- </el-container>
|
|
|
|
- <div class="vue-particles">
|
|
|
|
- <vue-particles color="#dedede" shapeType="star" linesColor="#dedede" hoverMode="grab" clickMode="push" style="height: 100%"></vue-particles>
|
|
|
|
- </div>
|
|
|
|
- </div>
|
|
|
|
-</template>
|
|
|
|
-<script>
|
|
|
|
-export default {
|
|
|
|
- data() {
|
|
|
|
- return {
|
|
|
|
- btnLoading:false,
|
|
|
|
- ruleForm:{},
|
|
|
|
- rules: {
|
|
|
|
- name: [{ required: true, message: '请输入公司名称', trigger: 'blur' },],
|
|
|
|
- contacts:[{ required: true, message: '请输入联系人', trigger: 'blur' },],
|
|
|
|
- address: [{ required: true, message: '请输入联系地址', trigger: 'blur' },],
|
|
|
|
- username:[{ required: true, message: '请输入管理员账号', trigger: 'blur' },],
|
|
|
|
- password:[{ required: true, message: '请输入管理员密码', trigger: 'blur' },],
|
|
|
|
- email:[{required:true,message: "请输入邮箱", trigger: "blur"},
|
|
|
|
- {pattern:/^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9_\.\-])+\.)+([a-zA-Z0-9]{2,4})+$/,
|
|
|
|
- message:'请输入正确的邮箱格式',trigger:'blur'}],
|
|
|
|
- },
|
|
|
|
- }
|
|
|
|
- },
|
|
|
|
- mounted(){
|
|
|
|
-
|
|
|
|
- },
|
|
|
|
- methods:{
|
|
|
|
- submit() {
|
|
|
|
- this.$refs.ruleForm.validate((valid) => {
|
|
|
|
- if (valid) {
|
|
|
|
- this.btnLoading = true
|
|
|
|
- this.$api.addByInvitation(this.ruleForm).then(response => {
|
|
|
|
- this.$message.success('账号添加成功')
|
|
|
|
- this.btnLoading = false
|
|
|
|
- }).catch(error => {
|
|
|
|
- this.btnLoading = false
|
|
|
|
- })
|
|
|
|
- } else {
|
|
|
|
- return false;
|
|
|
|
- }
|
|
|
|
- });
|
|
|
|
- },
|
|
|
|
- }
|
|
|
|
-}
|
|
|
|
-</script>
|
|
|
|
-<style>
|
|
|
|
-.content .el-form-item__label{
|
|
|
|
- color:white
|
|
|
|
-}
|
|
|
|
-</style>
|
|
|
|
-<style lang="scss" scoped>
|
|
|
|
- .logo {
|
|
|
|
- margin-right: 10px;
|
|
|
|
- width: 135px;
|
|
|
|
- height: 35px;
|
|
|
|
- }
|
|
|
|
- .logo-bar{
|
|
|
|
- padding: 20px;
|
|
|
|
- }
|
|
|
|
- .content{
|
|
|
|
- width: 800px;
|
|
|
|
- background: rgb(58, 55, 55);
|
|
|
|
- opacity: 0.8;
|
|
|
|
- padding: 20px;
|
|
|
|
- padding-right:30px;
|
|
|
|
- height: 550px;
|
|
|
|
- border-radius: 5px;
|
|
|
|
- position: absolute;
|
|
|
|
- left: 0;
|
|
|
|
- right: 0;
|
|
|
|
- top: 0;
|
|
|
|
- bottom: 0;
|
|
|
|
- margin: auto;
|
|
|
|
- }
|
|
|
|
- .main{
|
|
|
|
- z-index: 1;
|
|
|
|
- }
|
|
|
|
- .register{
|
|
|
|
- height: 100%;
|
|
|
|
- width: 100%;
|
|
|
|
- overflow: hidden;
|
|
|
|
- position: relative;
|
|
|
|
- }
|
|
|
|
- .vue-particles {
|
|
|
|
- position: absolute;
|
|
|
|
- top: 0;
|
|
|
|
- left: 0;
|
|
|
|
- width: 100%;
|
|
|
|
- height: 100%;
|
|
|
|
- background: radial-gradient(ellipse at top left, rgba(105, 155, 200, 1) 0%, rgba(181, 197, 216, 1) 57%);
|
|
|
|
- }
|
|
|
|
- .title{
|
|
|
|
- color: white;
|
|
|
|
- margin-bottom: 40px;
|
|
|
|
- font-weight: 500;
|
|
|
|
- font-size: 22px;
|
|
|
|
- text-align: center;
|
|
|
|
- letter-spacing: 4px;
|
|
|
|
- }
|
|
|
|
-</style>
|
|
|