OSDN Git Service

fix /my/settgins to work
authorhylom <hylom@users.sourceforge.jp>
Wed, 14 Nov 2018 12:47:39 +0000 (21:47 +0900)
committerhylom <hylom@users.sourceforge.jp>
Wed, 14 Nov 2018 12:47:39 +0000 (21:47 +0900)
src/newslash_web/public/js/user-settings.js
src/newslash_web/templates/my/settings.html.tt2

index 671dd76..2bd3cf9 100644 (file)
@@ -18,8 +18,8 @@ userSettings.run = function run (params) {
     infoSettingsMessage: "",
 
     emailSettings: { email: params.email,
-                     newemail: "" },
-    emailSettingsMessage: "",
+                     newEmail: "" },
+    emailSettingsMessage: "BLANK_EMAIL",
     
     commentSettings: userConfig.comment || {},
     commentSettingsMessage: "",
@@ -30,11 +30,30 @@ userSettings.run = function run (params) {
     passwordSettings: { current: "",
                         new1: "",
                         new2: "" },
-    passwordSettingsMessage: "",
+    passwordSettingsMessage: "BLANK_PASSWORD",
     state: "",
   };
 
-  var computed = {};
+  function watchEmail(val, oldVal) {
+    if (val.newEmail.length == 0) {
+      this.emailSettingsMessage = "BLANK_EMAIL";
+    } else {
+      this.emailSettingsMessage = "";
+    }
+  }
+
+  function watchPasswords(val, oldVal) {
+    if (val.current.length == 0 || val.new1.length == 0) {
+      this.passwordSettingsMessage = "BLANK_PASSWORD";
+    } else {
+      this.passwordSettingsMessage = "";
+    }
+
+    if (val.new1 != val.new2) {
+      this.passwordSettingsMessage = "PASSWORD_NOT_MATCH";
+    }
+  }
+
   var methods = {
     saveInfoSettings: function saveInfoSettings() {
       var data = { info: this.infoSettings };
@@ -51,7 +70,19 @@ userSettings.run = function run (params) {
           this.state = "";
         });
     },
-    saveEmailSettings: function saveEmailSettings() {
+    requestEmailChange: function requestEmailChange() {
+      this.state = "posting";
+      newslash.requestEmailChange(this.emailSettings.newEmail).then(
+        (resp) => {
+          this.emailSettingsMessage = "REQUEST_OK";
+          this.state = "";
+          // succeed
+        },
+        (resp) => {
+          // failed
+          this.emailSettingsMessage = resp.message;
+          this.state = "";
+        });
     },
     saveCommentSettings: function saveCommentSettings() {
       var data = { comment: this.commentSettings };
@@ -83,6 +114,18 @@ userSettings.run = function run (params) {
         });
     },
     savePasswordSettings: function savePasswordSettings() {
+      this.state = "posting";
+      newslash.updatePassword(this.passwordSettings.current, this.passwordSettings.new1).then(
+        (resp) => {
+          this.passwordSettingsMessage = "SAVED";
+          this.state = "";
+          // succeed
+        },
+        (resp) => {
+          // failed
+          this.passwordSettingsMessage = rep.message;
+          this.state = "";
+        });
     },
     setMessageMode: function setMessageMode(code, mode) {
       vm.messageSettings.forEach(conf => {
@@ -96,7 +139,6 @@ userSettings.run = function run (params) {
 
   vm = new Vue({el: params.el,
                 data: data,
-                computed: computed,
                 methods: methods,
                 created: function () {
                   newslash.getMessageSettings().then(
@@ -110,4 +152,6 @@ userSettings.run = function run (params) {
                   );
                 },
                });
+  vm.$watch('passwordSettings', watchPasswords, { deep: true });
+  vm.$watch('emailSettings', watchEmail, { deep: true });
 };
index f9cbb5f..deb2eba 100644 (file)
@@ -2,6 +2,11 @@
 
 <script type="text/x-template" id="settings-message">
   <div class="alert-info"      v-if="target == 'SAVED'">保存しました。</div>
+  <div class="alert-error" v-else-if="target == 'REQUEST_OK'">指定したアドレスに確認メールを送信しました。</div>
+  <div class="alert-error" v-else-if="target == 'INVALID_ADDRESS'">不正なメールアドレスです。</div>
+  <div class="alert-error" v-else-if="target == 'BLANK_EMAIL'">登録するメールアドレスを入力してください。</div>
+  <div class="alert-error" v-else-if="target == 'BLANK_PASSWORD'">現在のパスワードと設定するパスワードを入力してください。</div>
+  <div class="alert-error" v-else-if="target == 'PASSWORD_NOT_MATCH'">新しいパスワードが一致しません。</div>
   <div class="alert-error" v-else-if="target == 'SERVER_ERROR'">サーバーエラーが発生しました。</div>
 </script>
 
       </label>
 
       <label>変更後のメールアドレス:
-        <input id="newemail" type="text" name="newemail" v-model="emailSettings.newemail" placeholder="メールアドレスを入力" />
+        <input id="newemail" type="text" name="newemail" v-model="emailSettings.newEmail" placeholder="メールアドレスを入力" />
       </label>
 
-      <button type="button" :disabled="state != ''" @click="saveEmailSettings()">確認メールを送信</button>
+      <button type="button" :disabled="state != '' || emailSettingsMessage != ''" @click="requestEmailChange()">確認メールを送信</button>
       <message :target="emailSettingsMessage"></message>
     </form>
   </div><!-- .panel -->
     <form id="password">
 
       <label>現在のパスワード:
-        <input id="currentpw" type="text" name="currentpw" v-model="passwordSettings.current" placeholder="現在のパスワードを入力" />
+        <input id="currentpw" type="password" name="currentpw" v-model="passwordSettings.current" placeholder="現在のパスワードを入力" />
       </label>
 
       <label>新しいパスワード:
-        <input id="newpw1" type="text" name="newpw1" v-model="passwordSettings.new1" placeholder="新しいパスワードを入力" />
+        <input id="newpw1" type="password" name="newpw1" v-model="passwordSettings.new1" placeholder="新しいパスワードを入力" />
       </label>
 
       <label>新しいパスワード(再入力):
-        <input id="newpw2" type="text" name="newpw2" v-model="passwordSettings.new2" placeholder="新しいパスワードを入力" />
+        <input id="newpw2" type="password" name="newpw2" v-model="passwordSettings.new2" placeholder="新しいパスワードを入力" />
       </label>
 
-      <button type="button" :disabled="state != ''" @click="savePasswordSettings()">変更</button>
+      <button type="button" :disabled="state != '' || passwordSettingsMessage != ''" @click="savePasswordSettings()">変更</button>
       <message :target="passwordSettingsMessage"></message>
     </form>
   </div><!-- .panel -->