apps:public:team_entry

no way to compare when less than two revisions

差分

このページの2つのバージョン間の差分を表示します。


次のリビジョン
—apps:public:team_entry [2020/07/01 15:46] – 外部編集 127.0.0.1
行 1: 行 1:
 +<html>
  
 +<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
 +<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.27.0/moment.min.js"></script>
 +<script src="https://kit.fontawesome.com/1bd0cc9316.js" crossorigin="anonymous"></script>
 +<script src="https://unpkg.com/vue@2.6.10/dist/vue.js"></script>
 +<script src="https://unpkg.com/http-vue-loader"></script>
 +<script src="/lib/components/util.js"></script>
 +
 +<script language="javascript" type="text/javascript">
 +  function confirmEntryCode() {
 +    let code = window.prompt("メールで送られた 8 文字のエントリーコードを入力してください. (半角英数文字)");
 +    if (code) {
 +      const page_id = getUrlParams('id');
 +      const event_id = getUrlParams('event_id');
 +      location.href = '/doku.php?id=' + page_id + '&event_id=' +  event_id + '&code=' + code;
 +    } else {
 +      window.alert("キャンセルされました。");
 +    }
 +  }
 +  if (getUrlParams('mod')) {
 +    confirmEntryCode();
 +  }
 +</script>
 +
 +<div id="app">
 +  <div class="editor-header">
 +    <h2 class="page-title">{{ my_event.title }} チーム向け参加登録フォーム</h2>
 +    <div v-if="!is_closed">
 +      <p>大会に参加をご希望のチームの代表者（またはその代理の方）はこちらのフォームから申請をお願い致します。<br/>
 +      なお、大会関係の連絡には入力頂いた代表者のメールアドレスにご連絡致しますので、お間違えの無いようご注意ください。</p>
 +      <h3>参加登録の手順</h3>
 +      <ol>
 +        <li>以下のフォームにご入力いただき、「登録」ボタンを押してください。（この段階ではまだ仮登録です。）</li>
 +        <li>入力した代表者のメールアドレスに確認用のメールが届きます。そのメールに含まれる URL リンクをクリックしてください。</li>
 +        <li>正しいリンクが確認できれば登録が完了します。</li>
 +        <li>登録が完了すると、再び代表者のメールアドレスに内容更新用のエントリーコードが届きますので、大会終了まで保管してください。</li>
 +        <li>参加費が銀行振込の場合は、この後に振り込みをお願い致します。振込先等は要項等をご確認ください。</li>
 +        <li>参加登録状況は<a :href="'/doku.php?id=apps:public:team_entry_list&event_id=' + my_event.id"> こちら </a>からご確認ください。</li>
 +      </ol>
 +      <h3>登録内容の変更</h3>
 +      <p>登録内容を変更される場合は、<a href="javascript:confirmEntryCode();">こちらをクリック</a> してください。
 +      <h3>参加登録フォーム</h3>
 +    </div>
 +  </div>
 +
 +  <div class="editor-body" v-if="!is_closed">
 +    <div class="row bdc-row-no-margin-bottom row-eq-height">
 +      <div class="col-sm-3">
 +        <div class="bdc-form-label bdc-form-label-top" for="team">チーム名 <span class="label label-info">必須</span></div>
 +      </div>
 +      <div class="col-sm-8">
 +        <div class="bdc-form-wrapper bdc-form-wrapper-top" :class="{ 'has-error' : errors.team.length }">
 +          <input type="text" class="form-control" id="team" placeholder="" v-model="item.team">
 +          <div>２０文字以内で入力してください</div>
 +          <div class="text-danger" v-if="errors.team.length"><span v-html="errors.team.join('<br>')"></span></div>
 +        </div>
 +      </div>
 +    </div>
 +
 +    <div class="row bdc-row-no-margin-bottom row-eq-height">
 +      <div class="col-sm-3">
 +        <div class="bdc-form-label" for="team_kana">チーム名（カナ） <span class="label label-info">必須</span></div>
 +      </div>
 +      <div class="col-sm-8">
 +        <div class="bdc-form-wrapper" :class="{ 'has-error' : errors.team_kana.length }">
 +          <input type="text" class="form-control" id="team_kana" placeholder="" v-model="item.team_kana">
 +          <div class="text-danger" v-if="errors.team_kana.length"><span v-html="errors.team_kana.join('<br>')"></span></div>
 +        </div>
 +      </div>
 +    </div>
 +
 +    <div class="row bdc-row-no-margin-bottom row-eq-height">
 +      <div class="col-sm-3">
 +        <div class="bdc-form-label bdc-form-label" for="city">チーム所在地 <span class="label label-info">必須</span></div>
 +      </div>
 +      <div class="col-sm-8">
 +        <div class="bdc-form-wrapper">
 +          <div class="row">
 +            <div class="col-sm-6">
 +              <div class="input-group" :class="{ 'has-error' : errors._city_pref.length }">
 +                <span class="input-group-addon">都道府県</span>
 +                <input type="text" class="form-control" placeholder="都道府県" v-model="item._city_pref">
 +              </div>
 +              <div class="text-danger" v-if="errors._city_pref.length"><span v-html="errors._city_pref.join('<br>')"></span></div>
 +            </div>
 +            <div class="col-sm-6">
 +              <div class="input-group" :class="{ 'has-error' : errors._city_town.length }">
 +                <span class="input-group-addon">市町村区</span>
 +                <input type="text" class="form-control" placeholder="市町村区" v-model="item._city_town">
 +              </div>
 +              <div class="text-danger" v-if="errors._city_town.length"><span v-html="errors._city_town.join('<br>')"></span></div>
 +            </div>
 +          </div>
 +        </div>
 +      </div>
 +    </div>
 +
 +    <div class="row bdc-row-no-margin-bottom row-eq-height">
 +      <div class="col-sm-3">
 +        <div class="bdc-form-label bdc-form-label"     for="league">出場クラス <span class="label label-info">必須</span></div>
 +      </div>
 +      <div class="col-sm-8">
 +        <div class="bdc-form-wrapper" :class="{ 'has-error' : errors.league.length }">
 +          <div v-for="(league, idx) in my_event.config.leagues">
 +            <label class="labelForCheckAndRadio" :for="'league_' + idx">
 +              <input type="radio" v-model="item.league" :id="'league_' + idx" :value="league">　{{ league }}
 +            </label><br>
 +          </div>
 +          <div class="text-danger" v-if="errors.league.length"><span v-html="errors.league.join('<br>')"></span></div>
 +        </div>
 +      </div>
 +    </div>
 +
 +    <div class="row bdc-row-no-margin-bottom row-eq-height">
 +      <div class="col-sm-3">
 +        <div class="bdc-form-label">代表者（氏名） <span class="label label-info">必須</span></div>
 +      </div>
 +      <div class="col-sm-8">
 +        <div class="bdc-form-wrapper">
 +          <div class="row">
 +            <div class="col-sm-6">
 +              <div class="input-group" :class="{ 'has-error' : errors.representative.name.length }">
 +                <span class="input-group-addon">氏名</span>
 +                <input type="text" class="form-control" placeholder="埼玉　避球" v-model="item.representative.name">
 +              </div>
 +              <div class="text-danger" v-if="errors.representative.name.length"><span v-html="errors.representative.name.join('<br>')"></span></div>
 +            </div>
 +            <div class="col-sm-6">
 +              <div class="input-group" :class="{ 'has-error' : errors.representative.kana.length }">
 +                <span class="input-group-addon">カナ</span>
 +                <input type="text" class="form-control" placeholder="サイタマ　ヒキュウ" v-model="item.representative.kana">
 +              </div>
 +              <div class="text-danger" v-if="errors.representative.kana.length"><span v-html="errors.representative.kana.join('<br>')"></span></div>
 +            </div>
 +          </div>
 +        </div>
 +      </div>
 +    </div>
 +
 +    <div class="row bdc-row-no-margin-bottom row-eq-height">
 +      <div class="col-sm-3">
 +        <div class="bdc-form-label">代表者（住所） <span class="label label-info">必須</span></div>
 +      </div>
 +      <div class="col-sm-8">
 +        <div class="bdc-form-wrapper">
 +          <div class="input-group" :class="{ 'has-error' : errors.representative.postal_code.length }">
 +            <span class="input-group-addon">〒</span>
 +            <input type="text" class="form-control" placeholder="ハイフン無し 半角数字7桁 0000000 で入力" v-model="item.representative.postal_code">
 +            <span class="input-group-btn">
 +                  <button class="btn btn-primary" type="button" @click="postalCodeSearchHandler">参照</button>
 +                </span>
 +          </div>
 +          <div class="input-group" :class="{ 'has-error' : errors.representative.address1.length }">
 +            <span class="input-group-addon">都道府県</span>
 +            <input type="text" class="form-control" placeholder="都道府県" v-model="item.representative.address1">
 +          </div>
 +          <div class="input-group" :class="{ 'has-error' : errors.representative.address2.length }">
 +            <span class="input-group-addon">市町村区</span>
 +            <input type="text" class="form-control" id="prefecture" placeholder="市町村区" v-model="item.representative.address2">
 +          </div>
 +          <div class="input-group" :class="{ 'has-error' : errors.representative.address3.length }">
 +            <span class="input-group-addon">番　　地</span>
 +            <input type="text" class="form-control" placeholder="番地" v-model="item.representative.address3">
 +          </div>
 +          <div class="input-group" :class="{ 'has-error' : errors.representative.address4.length }">
 +            <span class="input-group-addon">建物部屋</span>
 +            <input type="text" class="form-control" placeholder="建物・部屋番号" v-model="item.representative.address4">
 +          </div>
 +          <div class="text-danger" v-if="errors.representative.postal_code.length"><span v-html="errors.representative.postal_code.join('<br>')"></span></div>
 +          <div class="text-danger" v-if="errors.representative.address1.length"><span v-html="errors.representative.address1.join('<br>')"></span></div>
 +          <div class="text-danger" v-if="errors.representative.address2.length"><span v-html="errors.representative.address2.join('<br>')"></span></div>
 +          <div class="text-danger" v-if="errors.representative.address3.length"><span v-html="errors.representative.address3.join('<br>')"></span></div>
 +          <div class="text-danger" v-if="errors.representative.address4.length"><span v-html="errors.representative.address4.join('<br>')"></span></div>
 +        </div>
 +      </div>
 +    </div>
 +
 +    <div class="row bdc-row-no-margin-bottom row-eq-height">
 +      <div class="col-sm-3">
 +        <div class="bdc-form-label">代表者（連絡先） <span class="label label-info">必須</span></div>
 +      </div>
 +      <div class="col-sm-8">
 +        <div class="bdc-form-wrapper">
 +          <div class="row">
 +            <div class="col-sm-6">
 +              <div class="input-group" :class="{ 'has-error' : errors.representative.phone.length }">
 +                <span class="input-group-addon">電話番号</span>
 +                <input type="text" class="form-control" placeholder="" v-model="item.representative.phone">
 +              </div>
 +              <div class="text-danger" v-if="errors.representative.phone.length"><span v-html="errors.representative.phone.join('<br>')"></span></div>
 +            </div>
 +            <div class="col-sm-6">
 +              <div class="input-group" :class="{ 'has-error' : errors.representative.email.length }">
 +                <span class="input-group-addon">E-mail</span>
 +                <input type="text" class="form-control" placeholder="" v-model="item.representative.email">
 +              </div>
 +              <div class="text-danger" v-if="errors.representative.email.length"><span v-html="errors.representative.email.join('<br>')"></span></div>
 +            </div>
 +          </div>
 +        </div>
 +      </div>
 +    </div>
 +
 +    <div class="row bdc-row-no-margin-bottom row-eq-height" v-if="my_event.config.team_referee.enabled">
 +      <div class="col-sm-3">
 +        <div class="bdc-form-label">帯同審判協力者</div>
 +      </div>
 +      <div class="col-sm-8">
 +        <div class="bdc-form-wrapper">
 +          <div class="row">
 +            <div class="col-sm-6">
 +              <div class="input-group" :class="{ 'has-error' : errors.team_referee.name.length }">
 +                <span class="input-group-addon">氏名</span>
 +                <input type="text" class="form-control" placeholder="埼玉　避球" v-model="item.team_referee.name">
 +              </div>
 +              <div class="text-danger" v-if="errors.team_referee.name.length"><span v-html="errors.team_referee.name.join('<br>')"></span></div>
 +            </div>
 +            <div class="col-sm-6">
 +              <div class="input-group" :class="{ 'has-error' : errors.team_referee.kana.length }">
 +                <span class="input-group-addon">カナ</span>
 +                <input type="text" class="form-control" placeholder="サイタマ　ヒキュウ" v-model="item.team_referee.kana">
 +              </div>
 +              <div class="text-danger" v-if="errors.team_referee.kana.length"><span v-html="errors.team_referee.kana.join('<br>')"></span></div>
 +            </div>
 +          </div>
 +          <div class="row" style="margin-top: 6px">
 +            <div class="col-sm-4">
 +              <div class="input-group" :class="{ 'has-error' : errors.team_referee.gender.length }">
 +                <span class="input-group-addon">性別</span>
 +                <select class="form-control" v-model="item.team_referee.gender">
 +                  <option>男</option>
 +                  <option>女</option>
 +                </select>
 +              </div>
 +              <div class="text-danger" v-if="errors.team_referee.gender.length"><span v-html="errors.team_referee.gender.join('<br>')"></span></div>
 +            </div>
 +            <div class="col-sm-4">
 +              <div class="input-group" :class="{ 'has-error' : errors.team_referee.grade.length }">
 +                <select class="form-control" v-model="item.team_referee.grade">
 +                  <option>C</option>
 +                  <option>B</option>
 +                  <option>A</option>
 +                </select>
 +                <span class="input-group-addon">級</span>
 +              </div>
 +              <div class="text-danger" v-if="errors.team_referee.grade.length"><span v-html="errors.team_referee.grade.join('<br>')"></span></div>
 +            </div>
 +            <div class="col-sm-6">
 +            </div>
 +          </div>
 +          <div class="row" style="margin-top: 6px; padding-left: 15px; padding-right: 15px;">
 +            <label>チームとの関係:　</label>
 +            <label style="font-weight: normal" for="rel1"><input type="checkbox" v-model="item.team_referee.relationship" id="rel1" value="チーム代表者"> チーム代表者　</label>
 +            <label style="font-weight: normal" for="rel2"><input type="checkbox" v-model="item.team_referee.relationship" id="rel2" value="コーチ"> コーチ　</label>
 +            <label style="font-weight: normal" for="rel3"><input type="checkbox" v-model="item.team_referee.relationship" id="rel3" value="マネージャ"> マネージャ　</label>
 +            <label style="font-weight: normal" for="rel4"><input type="checkbox" v-model="item.team_referee.relationship" id="rel4" value="選手ご家族"> 選手ご家族　</label>
 +            <div class="input-group input-group-sm">
 +              <span class="input-group-addon">その他</span>
 +              <input type="text" class="form-control" v-model="item.team_referee.other">
 +            </div>
 +          </div>
 +        </div>
 +      </div>
 +    </div>
 +  </div>
 +
 +  <div class="row editor-footer" v-if="!is_closed">
 +    <div role="group" class="pull-right" style="margin-top: 20px; padding-right: 15px;">
 +      <button type="button" class="btn btn-primary" @click="showConfirmModalHandler">登録</button>
 +    </div>
 +  </div>
 +
 +  <div v-else>
 +    <div class="alert alert-danger" role="alert">申し込みは締め切りました。</div>
 +  </div>
 +
 +  <confirm-modal ref="confirmModal" @apply-item="applyItemHandler"></confirm-modal>
 +</div>
 +
 +<!-- 入力確認モーダル -->
 +<script type="text/x-template" id="confirm-modal-template">
 +  <modal-base modal-id="confirmModal">
 +    <template v-slot:header>
 +      <h4 class="modal-title">入力内容のご確認</h4>
 +    </template>
 +    <template v-slot:body>
 +      <div class="form-horizontal">
 +        <div class="form-group">
 +          <label class="col-sm-4 control-label">チーム名</label>
 +          <div class="col-sm-6" style="padding-top: 7px;">{{ item.team }}</div>
 +        </div>
 +        <div class="form-group">
 +          <label class="col-sm-4 control-label">チーム名(カナ)</label>
 +          <div class="col-sm-6" style="padding-top: 7px;">{{ item.team_kana }}</div>
 +        </div>
 +        <div class="form-group">
 +          <label class="col-sm-4 control-label">チーム所在地</label>
 +          <div class="col-sm-6" style="padding-top: 7px;">{{ item.city }}</div>
 +        </div>
 +        <div class="form-group">
 +          <label class="col-sm-4 control-label">出場クラス</label>
 +          <div class="col-sm-6" style="padding-top: 7px;">{{ item.league }}</div>
 +        </div>
 +        <div class="form-group">
 +          <label class="col-sm-4 control-label">代表者 氏名</label>
 +          <div class="col-sm-6" style="padding-top: 7px;">{{ item.representative.name }}</div>
 +        </div>
 +        <div class="form-group">
 +          <label class="col-sm-4 control-label">代表者 氏名(カナ)</label>
 +          <div class="col-sm-6" style="padding-top: 7px;">{{ item.representative.kana }}</div>
 +        </div>
 +        <div class="form-group">
 +          <label class="col-sm-4 control-label">代表者 住所</label>
 +          <div class="col-sm-6" style="padding-top: 7px;">
 +            {{ '〒' + item.representative.postal_code + ' ' + item.representative.address1 }}
 +            {{ item.representative.address2 + item.representative.address3 + item.representative.address4 }}
 +          </div>
 +        </div>
 +        <div class="form-group">
 +          <label class="col-sm-4 control-label">代表者 連絡先</label>
 +          <div class="col-sm-6" style="padding-top: 7px;">TEL: {{ item.representative.phone }} Email: {{ item.representative.email }}</div>
 +        </div>
 +        <div class="form-group" v-if="my_event.config.team_referee.enabled">
 +          <label class="col-sm-4 control-label">帯同審判 氏名(性別)</label>
 +          <div class="col-sm-6" style="padding-top: 7px;">{{ item.team_referee.name }} ({{ item.team_referee.gender }})</div>
 +        </div>
 +        <div class="form-group" v-if="my_event.config.team_referee.enabled">
 +          <label class="col-sm-4 control-label">帯同審判 氏名(カナ)</label>
 +          <div class="col-sm-6" style="padding-top: 7px;">{{ item.team_referee.kana }}</div>
 +        </div>
 +        <div class="form-group" v-if="my_event.config.team_referee.enabled">
 +          <label class="col-sm-4 control-label">帯同審判 所持級</label>
 +          <div class="col-sm-6" style="padding-top: 7px;">{{ item.team_referee.grade }} 級</div>
 +        </div>
 +        <div class="form-group" v-if="my_event.config.team_referee.enabled">
 +          <label class="col-sm-4 control-label">帯同審判 チームとの関係</label>
 +          <div class="col-sm-6" style="padding-top: 7px;">{{ item.team_referee.relationship }} {{ item.team_referee.other }}</div>
 +        </div>
 +      </div>
 +      <div class="row">
 +        <div class="col-sm-offset-4 col-sm-8">
 +          <label for="confirm" style="font-weight: normal">
 +            <input type="checkbox" id="confirm" class="form-control" v-model="confirmed"> 大会要項・注意事項に記載の内容に同意し、大会に参加申込み致します。
 +          </label>
 +        </div>
 +      </div>
 +    </template>
 +    <template v-slot:footer>
 +      <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
 +      <button type="button" class="btn btn-primary" @click.prevent.stop="applyButtonClickHandler" :disabled="!confirmed">登録</button>
 +    </template>
 +  </modal-base>
 +</script>
 +
 +<script src="/lib/components/public/team_entry.js"></script>
 +
 +<style type="text/css" media="screen">
 +  [v-cloak] {
 +    display:none;
 +  }
 +
 +  .labelForCheckAndRadio {
 +    font-weight: 400;
 +    padding-top: 6px;
 +    padding-left: 10px;
 +    cursor: pointer;
 +  }
 +
 +  input[type=checkbox], input[type=radio] {
 +    box-shadow: none;
 +    -webkit-box-shadow: none;
 +    width: auto;
 +    margin: 0;
 +    position: relative;
 +    display: inline-block;
 +    vertical-align: middle;
 +    cursor: pointer;
 +  }
 +</style>
 +
 +<style>
 +  /* 幅が 768px 以上の場合に適用するスタイル */
 +  @media (min-width: 768px) {
 +
 +    /* row の中の col の高さを同じにする https://qiita.com/chii/items/8e2d0d04d02f3fecebce */
 +    .row-eq-height {
 +      display: flex;
 +      flex-wrap: wrap;
 +    }
 +
 +    /* ラベルのスタイル 枠線 背景 */
 +    .bdc-form-label {
 +      font-weight: bold;
 +      height: 100%;
 +      margin-right: -15px;
 +      padding: 10px 12px;
 +      background-color: #ececec;
 +      border-left: 1px solid lightgray;
 +      /* border-right: 1px solid lightgray; */
 +      border-bottom: 1px solid lightgray;
 +    }
 +
 +    .bdc-form-label-top {
 +      border-top: 1px solid lightgray;
 +    }
 +
 +    /* input select 等のフォーム部品の丸みを消す(input type="file" の丸みは消せなかった) */
 +    .bdc-form-input {
 +      border: none;
 +      border-radius: 0;
 +    }
 +
 +    /* グリッドをテーブル状に表示する際、row 下部のマージンを消す */
 +    .bdc-row-no-margin-bottom {
 +      margin-bottom: 0px;
 +    }
 +
 +    /* 入力側カラムの padding を消す ボーダー線が重なって太く見えないように */
 +    .bdc-form-wrapper {
 +      padding: 6px 12px;
 +      margin-left: -15px; /* col-xx マージンの打ち消し */
 +      border-left: 1px solid lightgray;
 +      border-right: 1px solid lightgray;
 +      border-bottom: 1px solid lightgray;
 +    }
 +
 +    .bdc-form-wrapper-top {
 +      border-top: 1px solid lightgray;
 +    }
 +
 +    .bdc-form-options label {
 +      font-weight: normal;
 +    }
 +  }
 +
 +  /* 幅が 767px 以下の場合に適用するスタイル */
 +  @media (max-width: 767px) {
 +
 +    /* ラベルのスタイル 枠線 背景 */
 +    .bdc-form-label {
 +      /* margin-top: 6px;  ボーダー線が重なって太く見えないように */
 +      padding-top: 12px;
 +      font-weight: bold;
 +      font-size: 12px;
 +    }
 +
 +    /* input select 等のフォーム部品の丸みを消す(input type="file" の丸みは消せなかった)
 +    .bdc-form-input {
 +      border: 1px solid lightgray;
 +    } */
 +
 +    .bdc-form-options label {
 +      font-weight: normal;
 +    }
 +  }
 +
 +  /* checkbox, radio の表示位置調整 */
 +  input[type=checkbox], input[type=radio] {
 +    margin: 0 0;
 +    line-height: normal;
 +  }
 +
 +  /* エラーメッセージの設定 */
 +  .bdc-feedback {
 +    /* */ display: none;
 +    color: red;
 +    padding: 0.25rem 1rem;
 +  }
 +</style>
 +
 +</html>
  • apps/public/team_entry.txt
  • 最終更新: 2023/02/12 16:54
  • by admin