xiaojincai
/
zkyuan


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161
							<!DOCTYPE html>
<html>

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=no,
    width=device-width,initial-scale=1.0">
  <title>调查</title>
  <!-- import CSS -->
  <link rel="stylesheet" href="static/index.css">
</head>
<style>
  body {
    margin: 0;
    padding: 40px 0 0;
    height: calc(100vh - 40px);
    background: linear-gradient(0deg, #CEF0FF, #FFFFFF);
  }

  #app {
    display: none;
  }

  .logo-img {
    width: 150px;
    margin: 0 auto;
  }

  .el-form {
    padding: 35px;
  }

  .el-input__inner {
    height: 48px;
    padding-left: 42px;
    border: 1px solid #EFF0F2;
    border-radius: 5px;
  }

  .el-form-item img {
    position: absolute;
    top: 8px;
    left: 6px;
  }

  .el-button--primary {
    margin-top: 29px;
    height: 48px;
    font-size: 18px;
    width: 100%;
    background-color: #3780CD;
  }

  .tpl_title {
    font-size: 18px;
    margin-bottom: 20px;
  }

  .el-form-item__label {
    float: none;
  }
  .imgcode .el-input{
    width: 62%;
    /* background: #b4bccc; */
  }
  .imgcode .el-input__inner{
    padding-left: 6px!important;
  }
  .imgcode img{
    position: absolute;
    right: 10px!important;
    left: auto;
  }
</style>

<body>
  <div id="app">
    <div class='logo-img'><img src="static/logo.png" alt=""></div>
    <el-form>
      <el-form-item>
        <el-input v-model='form.username' clearable placeholder="请输入账号"></el-input>
        <img src="static/username.png" alt="">
      </el-form-item>
      <el-form-item>
        <el-input v-model='form.password' type='password' clearable placeholder="请输入密码"></el-input>
        <img src="static/pwd.png" alt="">
      </el-form-item>
      <el-form-item class="imgcode">
        <img @click="getCode" :src="code" alt="">
        <el-input type="text" v-model="form.imgcode" placeholder="请输入验证码"></el-input>
      </el-form-item>
      <el-form-item>
        <el-button type='primary' @click='login'>登录</el-button>
      </el-form-item>
    </el-form>
  </div>
</body>
<!-- import Vue before Element -->
<script src="static/jquery.min.js"></script>
<script src="static/vue.js"></script>
<!-- import JavaScript -->
<script src="static/index.js"></script>
<script>
  new Vue({
    el: '#app',
    data: function () {
      return {
        form: {

        },
        code: ""

      }
    },
    methods: {
      login() {
        $.ajax({
          url: '/api/account/login',
          method: 'post',
          data: this.form,
          success: res => {
            if (res.code == '1000') {
              this.$message.error(res.message);
            } else {
              var search = window.location.search.split('?')[1].split('&');
              let id = search[0].split('=')[1]
              if (window.location.search.split('?')[1].indexOf("type") != -1) {
                let type = search[1].split('=')[1]
                // 跳转到问卷页面
                window.location.href = "/survey/answer.html?id=" + id + "&type=" + type
              } else {
                window.location.href = "/survey/message.html?id=" + id
              }

            }
          }
        })
      },
      getCode() {
        $.ajax({
          url: "/api/account/imgcode",
          method: "get",
          data: {},
          success: res => {
            this.code = res.data.imgcode
            this.form.imgcode_id = res.data.imgcode_id
          }
        })
      },
    },

    created() {
      this.getCode()
    },
    mounted() {
      document.getElementById('app').style.display = 'block'
    }
  })
</script>

</html>