bzkf3
/
tmp-jn


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142
							<!DOCTYPE html>
<html lang="zh-Hans">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>学生报名</title>
  <script src="../config.js"></script>

  <!-- 引入样式文件 -->
  <link rel="stylesheet" href="https://fastly.jsdelivr.net/npm/vant@4/lib/index.css" />

  <!-- 引入 Vue 和 Vant 的 JS 文件 -->
  <script src="https://fastly.jsdelivr.net/npm/vue@3"></script>
  <script src="https://fastly.jsdelivr.net/npm/vant@4/lib/vant.min.js"></script>
  <!-- <script src="https://cdn.tailwindcss.com"></script> -->
  <style>
    body {
      margin: 0;
      padding: 0;
      background: #eff2f5;
    }

    #app {
      width: 100vw;
      height: 100vh;
      padding: 20px 6px;
      box-sizing: border-box;
      /* display: flex;
      justify-content: center;
      align-items: center; */
    }

    .mt-10 {
      margin-top: 10px;
    }

    .mt-20 {
      margin-top: 10px;
    }
  </style>
</head>

<body>
  <div id="app">
    <div v-if="finished" style="display: flex;flex-direction: column;align-items: center;justify-content: center;padding-top: 30px;">
      <van-icon name="checked" color="#0f0" size="96"></van-icon>
      <div style="font-size: 22px;margin-top: 32px;" >已提交报名申请，请等待审核</div>
    </div>
    <van-form v-else @submit="onSubmit">
      <van-cell-group inset>
        <van-field v-model="form.xkx_xjh" name="学籍号" label="学籍号" placeholder="请填写学籍号"
          :rules="[{ required: true, message: '请填写学籍号' }]"></van-field>
        <van-field v-model="form.xkx_xsxm" name="学生姓名" label="学生姓名" placeholder="请填写学生姓名"
          :rules="[{ required: true, message: '请填写学生姓名' }]" class="mt-10"></van-field>
      </van-cell-group>
      <div class="mt-10" style="margin: 16px;">
        <van-button round block type="primary" native-type="submit">
          报名
        </van-button>
      </div>
    </van-form>
  </div>
  <script>

    // get location search object
    function getSearchObj(){
      const search = window.location.search
      const searchObj = {}
      if(search){
        const searchArr = search.slice(1).split('&')
        searchArr.forEach(item => {
          const [key, value] = item.split('=')
          searchObj[key] = value
        })
      }
      return searchObj
    }

    const searchObj = getSearchObj()

    // get time YYYY-MM-DD HH:mm:ss 不足两位补0
    function getTime(time) {
      const year = time.getFullYear()
      const month = time.getMonth() + 1
      const day = time.getDate()
      const hour = time.getHours()
      const minute = time.getMinutes()
      const second = time.getSeconds()
      return `${year}-${month < 10 ? '0' + month : month}-${day < 10 ? '0' + day : day} ${hour < 10 ? '0' + hour : hour}:${minute < 10 ? '0' + minute : minute}:${second < 10 ? '0' + second : second}`
    }
    const App = {
      data() {
        return {
          form: {
            xkx_xjh: '',
            xkx_xsxm: ''
          },
          finished: false,
        };
      },
      methods: {
        onSubmit() {

          fetch(
            window.GLOBAL_CONFIG.api + '/xdjx/khfw_xs/add',
            {
              method: 'POST',
              headers: {
                'Content-Type': 'application/x-www-form-urlencoded'
              },
              body: JSON.stringify({
                api: 'json',
                issubmit: '1',
                nocheck: 1,
                xdjx_khfw_xs: {
                  ...this.form,
                  xkt_datetime: getTime(new Date()),
                  xkk_id: searchObj.xkk_id
                }
              })
            }).then(res => res.json())
            .then(res => {
              if (res.code == '1') {
                // vant.showSuccessToast('报名成功');
                this.finished = true
              } else {
                vant.showFailToast(res.msg);
              }
            }
            )

        },
      },
    };
    const app = Vue.createApp(App);
    app.use(vant);
    app.mount("#app");
  </script>
</body>

</html>