<template>
  <div class="container">
    <div class="title">INPUT INVITATIONN CODE</div>

    <div class="invitation-code">
      <span class="lable">Invitation Code:</span>
      <el-input class="input-code" type="text" placeholder="" />
      <span class="optional">Optional</span>
    </div>

    <div class="submit-btn" @click="navigator">submit</div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      data: [],
    };
  },
  methods: {
    navigator() {
      let userinfo = window.localStorage.getItem("userinfo");
      //JSON.parse(userinfo).account
      this.$axios
        .post("http://192.168.100.83:3000/aa1/join", {
          account: '0xCC8EFe15ca9f000786D73D993e85A9eFc3ac9419' ,
        })
        .then((res) => {
          console.log("成功", res.data);
          this.feedList = res.data.data;
          this.pagnation = res.data.pagnation;
          //this.$router.push("success");
          this.$router.push({name:'Success',params:res.data });
        })
        .catch((err) => {
          console.error(err);
          alert(err.response.data.msg);
        });
    },
  },
};
</script>

<style lang="less" scoped>
.container {
  position: relative;
  width: 100vw;
  height: 100vh;
  background: url(../../assets/mobile/bg-content.png);
  background-size: 100% 100%;
  padding-top: 10vh;
}
.title {
  text-align: center;
  font-size: 1.6125rem;
  font-family: BigJohn;
  font-weight: 400;
  color: #000000;
  padding-bottom: 12vh;
  //   margin-top: 10vh;
  line-height: 72px;
  text-shadow: 5px 4px 9px rgba(0, 0, 0, 0.35);
  background: linear-gradient(171deg, #775437 0.1220703125%, #f2c082 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.invitation-code {
  width: 70%;
  padding-left: 1.6vw;
  margin: 0 auto;
  border: 2px solid #e4e4e4;
  border-radius: 14px;
  margin-bottom: 11vh;
  position: relative;
}
/deep/ .el-input__inner {
  background-color: transparent !important;
  border-color: transparent;
}
.address {
  font-size: 0.2rem;
  text-align: center;
  font-family: OPPOSans;
  font-weight: normal;
  color: #edbc80;
  line-height: 34px;
}
.input-code {
  width: 65%;
}
.lable {
  font-size: 0.68rem;
  font-family: OPPOSans;
  font-weight: normal;
  color: #ffffff;
  //   line-height: 42px;
}
.submit-btn {
  width: 100%;
  height: 4.5vh;
  margin: 0 auto;
  text-align: center;
  width: 47.2vw;
  font-weight: 400;
  line-height: 4.5vh;
  font-size: 1.6rem;
  color: #fffefe;
  background: linear-gradient(165deg, #775437, #f2c082);
  border-radius: 40px;
}
/deep/.el-button {
  border-color: transparent;
  border-radius: 40px;
}
.connect-btn {
  width: 50%;
  text-align: center;
  line-height: 4vh;
  height: 4vh;
  margin: 0 auto;
  margin-bottom: 4vh;
  font-size: 1.4rem;
  background: linear-gradient(165deg, #775437, #f2c082);
  border-radius: 40px;
}
.optional {
  position: absolute;
  right: 0;
  font-size: 0.7rem;
  font-family: OPPOSans;
  font-weight: normal;
  color: #adadad;
  bottom: -3vh;
}
</style>