<template>
  <view class="flex-col page">
    <u-navbar :border-bottom="false" :background="background"> </u-navbar>
    <view class="flex-col group_3">
      <h3 class="text_3">填写学校信息</h3>
      <view class="flex-col group_4">
        <view class="justify-between list-item group_5">
          <text class="text_8">学历</text>
          <u-input v-model="form.educational" placeholder="请选择学历" type="select"  @click="show = true" />
		  <u-action-sheet  :list="educationalList"  v-model="show"  @click="educationalSelect()" ></u-action-sheet>
        </view>
        <view class="justify-between list-item">
          <text class="text_8">学校</text>
          <u-input v-model="form.shool" placeholder="请选择学校" type="select" @click="show = true" />
        </view>
        <view class="justify-between list-item">
          <text class="text_8">学院</text>
          <u-input v-model="form.college" placeholder="请选择学院" type="select" @click="show = true" />
        </view>
        <view class="justify-between list-item">
          <text class="text_8">专业</text>
          <u-input v-model="form.major"  placeholder="请选择专业"  type="select" @click="show = true" />
          <u-action-sheet  :list="actionSheetList"  v-model="show"  @click="actionSheetCallback()" ></u-action-sheet>
        </view>
        <view class="justify-between list-item">
          <text class="text_8">时间</text>
          <u-input v-model="form.time"  placeholder="请选择时间"  type="select" @click="show = true" />
        </view>
      </view>
      <u-button shape="circle" class="button text-wrapper_1" type="primary"
        >完成</u-button
      >
    </view>
  </view>
</template>

<script>
import uButton from "../../../uview-ui/components/u-button/u-button.vue";
export default {
  components: { uButton },
  data() {
    return {
		form:{
			educational:'',//学历
			shool:'',//学校
			college:'',//学院
			major:'',//专业
			time:'',//时间
		},
      background: {
        backgroundColor: "#fff",
      },
      value: "",
      show: false,
	  educationalList:[//学历选择列表
		  {
				text:'专科',
		  },
		  {
		  		text:'本科',
		  },
		  {
		  		text:'专科',
		  }
	  ],
      actionSheetList: [
        {
          text: "男",
        },
        {
          text: "女",
        },
        {
          text: "保密",
        },
      ],
    };
  },
  onLoad(e) {
    ;
  },
  methods: {
	  educationalSelect(index){
		  this.form.educational = this.actionSheetList[index].text;
	  },
    actionSheetCallback(index) {
		
      this.form.major = this.actionSheetList[index].text;
    },
    save() {
      uni.switchTab({
        url: "/pages/main/index/index",
      });
    },
    skip() {
      uni.switchTab({
        url: "/pages/main/index/index",
      });
    },
  },
};
</script>

<style scoped lang="scss">
.page {
  background: #fff;
  height: 100%;
  .text-wrapper_1 {
    padding: 0.15rem 0 0.14rem;
    background-image: linear-gradient(
      90deg,
      #87e6fe 0%,
      #5bc0fe 52%,
      #2e9bff 100%
    );
    box-shadow: 0px 0.03rem 0.09rem rgba(38, 122, 199, 0.34);
    border-radius: 0.23rem;
  }
  .button {
    margin: 0.6rem 0.15rem 0;
  }
}

.group_3 {
  padding-left: 0.16rem;
  padding-top: 0.3rem;
  .text_3 {
    align-self: center;
    color: rgb(51, 51, 51);
    font-size: 0.18rem;
    font-family: PingFang;
    line-height: 0.17rem;
  }
  .group_4 {
    margin-top: 0.44rem;
    .list-item {
      padding: 0.1rem 0.2rem 0.09rem 0;
      border-bottom: solid 0.005rem rgb(199, 199, 204);
      .text_8 {
        color: #000;
        font-size: 0.18rem;
        font-family: PingFang;
        line-height: 0.38rem;
        margin-right: 0.1rem;
      }
      .text_26 {
        color: #000;
        font-size: 0.17rem;
        font-family: PingFang;
        line-height: 0.16rem;
      }
    }
    .group_5 {
      margin-top: 0;
    }
  }
}
</style>
