implement AD code manager (working)

diff --git a/src/newslash_web/public/js/ad-codes-editor.js b/src/newslash_web/public/js/ad-codes-editor.js
index 8f6c559..58040a6 100644 (file)
--- a/src/newslash_web/public/js/ad-codes-editor.js
+++ b/src/newslash_web/public/js/ad-codes-editor.js
@@ -5,7 +5,8 @@ var vm;
 editor.run = function run (params) {
   const data = {
     message: '',
-    boxItems: [],
+    adCodes: [],
+    selected: {},
   };
   const computed = {};
   const methods = {
@@ -44,28 +45,22 @@ editor.run = function run (params) {
         });
       }
     },
-    newItem: function newItem() {
+    addItem: function addItem() {
       const item = {
-        id: 0,
+        ad_id: 0,
         name: 'new item',
-        comment: '',
-        model: '',
-        query_params: '',
-        limit: '',
-        template: '',
-        selected: false,
-        editing: true,
-        edited: true,
+        description: '',
+        enabled: true,
+        status: 'enabled',
+        content: '',
       };
-      const it = this.boxItems.push(item);
+      const it = this.adCodes.push(item);
     },
   };
 
   function initItems (items) {
     items.forEach(item => {
-      Vue.set(item, 'selected', false);
-      Vue.set(item, 'editing', false);
-      Vue.set(item, 'edited', false);
+      Vue.set(item, 'enabled', item.status == "enabled");
     });
   };
 
@@ -73,18 +68,20 @@ editor.run = function run (params) {
                 data: data,
                 computed: computed,
                 methods: methods,
-                created: function () {
-                  newslash.admin.getBoxes().then(
+
+                created: function onCreate() {
+                  newslash.admin.getADCodes().then(
                     (resp) => { // success
-                      this.boxItems = resp.items || [];
+                      this.adCodes = resp.items || [];
                       this.message = resp.message || '';
-                      initItems(this.boxItems);
+                      initItems(this.adCodes);
                     },
                     (resp) => { // fail
-                      this.boxItems = [];
-                      this.message = resp.message || "failed to get items";
+                      this.adCodes = [];
+                      this.message = resp.message || "failed to get AD codes";
                     }
                   );
+
                 },
                });
 };

diff --git a/src/newslash_web/templates/admin/ads/index.html.tt2 b/src/newslash_web/templates/admin/ads/index.html.tt2
index dd0ef15..1e6c374 100644 (file)
--- a/src/newslash_web/templates/admin/ads/index.html.tt2
+++ b/src/newslash_web/templates/admin/ads/index.html.tt2
@@ -7,15 +7,24 @@
   <form>
     <div id="forms-wrapper">
       <div id="ad-codes-selector">
-        <select size="30"></select>
+        <select size="30" v-for="code in adCodes" v-model="selected">
+          <option :value="code" v-text="code.name"></option>
+        </select>
+        <button class="btn btn-default" type="button" v-on:click="addItem">新規作成</button>
       </div>
       
       <div id="ad-codes-editor">
         <div>
-          <label>AD_CODE_ID<input /></label>
+          <label>AD_CODE_ID<input v-model="selected.ad_id" /></label>
         </div>
         <div>
-          <label>説明<input /></label>
+          <label>名称<input v-model="selected.name" /></label>
+        </div>
+        <div>
+          <label>説明<input v-model="selected.description"/></label>
+        </div>
+        <div>
+          <label>有効<input type="checkbox" v-model="selected.enabled"/></label>
         </div>
         <div>
           <label>広告コード：
@@ -32,7 +41,7 @@
 
 <script src="/js/ad-codes-editor.js" ></script>
 <script>
-  /* editor.run({ el: '#ad-code-manager' }); */
+  editor.run({ el: '#ad-code-manager' });
 </script>
 
 [% END %]