apps:public:inquiry

差分

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

この比較画面へのリンク

両方とも前のリビジョン 前のリビジョン
次のリビジョン		 前のリビジョン
apps:public:inquiry [2020/03/18 17:21] – adminapps:public:inquiry [2022/02/22 22:22] (現在) – admin
行 1: 行 1:
-<WRAP page-title> 
 ====== お問い合わせ ====== ====== お問い合わせ ======
-<php> 
-echo '<div class="small text-right">'; 
-$pinfo = $GLOBALS['TEMPLATE']->getPageInfo(); 
-echo '</div>'; 
-</php> 
-</WRAP> 
  
 <html> <html>
行 14: 行 7:
 <script src="https://unpkg.com/http-vue-loader"></script> <script src="https://unpkg.com/http-vue-loader"></script>
 <script src="https://unpkg.com/vuejs-paginate@latest"></script> <script src="https://unpkg.com/vuejs-paginate@latest"></script>
-<script src="https://unpkg.com/vue-recaptcha@latest/dist/vue-recaptcha.js"></script>+<script src="https://unpkg.com/vue-recaptcha@1.3.0/dist/vue-recaptcha.js"></script>
 <script src="https://www.google.com/recaptcha/api.js?onload=vueRecaptchaApiLoaded&render=explicit" async defer></script> <script src="https://www.google.com/recaptcha/api.js?onload=vueRecaptchaApiLoaded&render=explicit" async defer></script>
  
行 65: 行 58:
       </div>       </div>
     </div>     </div>
-    <div class="form-group">+    <div class="form-group" v-bind:class="{ 'has-error': errors.recaptcha }">
       <label class="col-sm-4 control-label"></label>       <label class="col-sm-4 control-label"></label>
       <div class="col-sm-6">       <div class="col-sm-6">
         <vue-recaptcha sitekey="6LfmGOAUAAAAAGgzcpNWN-A--6ggRfnYAE94IOR3" ref="invisibleRecaptcha"></vue-recaptcha>         <vue-recaptcha sitekey="6LfmGOAUAAAAAGgzcpNWN-A--6ggRfnYAE94IOR3" ref="invisibleRecaptcha"></vue-recaptcha>
 +        <span class="text-danger" v-show="errors.recaptcha">{{ errors.recaptcha }}</span>
       </div>       </div>
     </div>     </div>
行 118: 行 112:
 </script> </script>
  
-<script> +<script src="/lib/components/public/inquiry.js"></script>
-const VueRecaptcha = window.VueRecaptcha; +
- +
-Vue.component('confirm-modal', { +
-  template: '#confirm-modal-template', +
-  components: { +
-    'modal-base': httpVueLoader('/lib/components/ModalBase.vue') +
-  }, +
-  data: function() { +
-    return { +
-      message: { +
-        type: '', +
-        title: '', +
-        content: '', +
-        name: '', +
-        email: '' +
-      } +
-    } +
-  }, +
-  methods: { +
-    show(message) { +
-      this.message = message; +
-      jQuery('#confirmModal').modal('show'); +
-    }, +
-    hide() { +
-      jQuery('#confirmModal').modal('hide'); +
-    }, +
-    sendButtonClickHandler() { +
-      this.$emit('send-message'); +
-      this.hide(); +
-    }, +
-    cancelButtonClickHandler() { +
-      this.hide(); +
-    } +
-  } +
-}); +
- +
-var app = new Vue({ +
-  el: '#app', +
-  components: {  +
-    'vue-recaptcha': VueRecaptcha +
-  }, +
-  data: { +
-    message: { +
-      type: '', +
-      title: '', +
-      content: '', +
-      name: '', +
-      email: '' +
-    }, +
-    errors: { +
-      type: '', +
-      title: '', +
-      content: '', +
-      name: '', +
-      email: '' +
-    } +
-  }, +
-  methods: { +
-    clearMessage() { +
-      this.message.type = ''; +
-      this.message.title = ''; +
-      this.message.content = ''; +
-      this.message.name = ''; +
-      this.message.email = ''; +
-    }, +
-    clearErrors() { +
-      this.errors.type = ''; +
-      this.errors.title = ''; +
-      this.errors.content = ''; +
-      this.errors.name = ''; +
-      this.errors.email = ''; +
-    }, +
-    validate() { +
-      let isValid = true; +
-      this.clearErrors(); +
-      this.message.recaptcha = document.getElementById('g-recaptcha-response').value; +
-      if (!this.message.recaptcha ) { +
-        this.errors.type = 'チェックしてください.'; +
-        isValid = false; +
-      }       +
-      if (!this.message.type) { +
-        this.errors.type = 'お問い合わせの種類を選択してください.'; +
-        isValid = false; +
-      } +
-      if (!this.message.name) { +
-        this.errors.name = 'お名前を入力してください.'; +
-        isValid = false; +
-      } +
-      if (!this.message.email) { +
-        this.errors.email = '正しい email アドレスを入力してください.'; +
-        isValid = false; +
-      } +
-      if (this.message.type == '大会要項の送付依頼' && !this.message.content) { +
-        this.errors.content = '大会要項の送付依頼の場合は、通信欄に送付先住所を記入してください.'; +
-        isValid = false; +
-      } +
-      return isValid; +
-    }, +
-    showConfirmModalHandler() { +
-      if (this.validate()) { +
-        this.$refs.confirmModal.show(this.message); +
-      } +
-    }, +
-    sendMessageHandler() { +
-      this.loading = true; +
-      const url = '/lib/exe/api.php'; +
-      const api = axios.create({withCredentials: true}); +
-      api.post(url, { +
-        resource: 'apps:inquiry', +
-        action: 'sendInquiry', +
-        params: this.message +
-      }) +
-      .then((res) => { +
-        alert('送信しました.'); +
-      }) +
-      .catch((res) => { +
-        alert('送信に失敗しました. 内容を確認し、再送信してください.'); +
-        this.loading = false; +
-      }); +
-    },    +
-    clearMessageHandler() { +
-      this.clearErrors(); +
-      this.clearMessage(); +
-    } +
-  } +
-}) +
-</script>+
  
 </html> </html>
  • apps/public/inquiry.1584519668.txt.gz
  • 最終更新: 2020/03/18 17:21
  • by admin