Indexの列表示を修正 (#59)

* Fixed "index" to "number" column. Added real "index" column. * Added "GetOverlayNumberByKey" function and colmn.
FlowingSPDG · Aug 14, 2020 · 93789b5 · 93789b5
1 parent 2b9cb8d
commit 93789b5
Show file tree

Hide file tree

Showing 2 changed files with 24 additions and 9 deletions.
diff --git a/web/src/App.vue b/web/src/App.vue
@@ -3,8 +3,8 @@
     <div id="nav">
       <el-button round icon="el-icon-s-home" @click="JumpTo('/')">Home</el-button>
       <el-button round icon="el-icon-s-operation" @click="JumpTo('/tree')">Input Menu</el-button>
-      <el-button round icon="el-icon-user-solid" @click="JumpTo('/developer')">Developer Info</el-button>
-      <el-button round icon="el-icon-link" @click="moveLink('https://www.vmix.com/help23/index.htm?ShortcutFunctionReference.html')">vMix Shortcut Function Reference</el-button>
+      <el-button round icon="el-icon-user-solid" @click="JumpTo('/developer')">Developer</el-button>
+      <el-button round icon="el-icon-link" @click="moveLink('https://www.vmix.com/help23/index.htm?ShortcutFunctionReference.html')">vMix Reference</el-button>
     </div>
     <router-view/>
   </div>

diff --git a/web/src/views/Tree.vue b/web/src/views/Tree.vue
@@ -4,18 +4,19 @@
     <el-button round icon="el-icon-refresh-right" @click="Refresh">Refresh inputs</el-button>
     <el-table ref="singleTable" :default-sort = "{prop: 'Number', order: 'ascending'}" :data="inputs" style="width:85%;margin:auto;">
       <el-table-column label="" type="expand">
-        <template slot-scope="scope">
+        <template slot-scope="InputScope">
             <h1>Multi View</h1>
-            <el-table ref="singleTable" :default-sort = "{prop: 'Number', order: 'ascending'}" :data="scope.row.Overlay" style="width:85%;margin:auto;">
+            <el-table ref="singleTable" :default-sort = "{prop: 'Number', order: 'ascending'}" :data="InputScope.row.Overlay" style="width:85%;margin:auto;">
                 <el-table-column label="Index" prop="Index"></el-table-column>
-                <el-table-column label="Name"><template slot-scope="scope"> {{SolveInputNameByKey(scope.row.Key)}}</template></el-table-column>
+                <el-table-column label="Name"><template slot-scope="NameScope"> {{SolveInputNameByKey(NameScope.row.Key)}}</template></el-table-column>
                 <el-table-column label="Key" prop="Key"></el-table-column>
             </el-table>
 
             <h1>Used By...</h1>
-            <el-table ref="singleTable" :default-sort = "{prop: 'Number', order: 'ascending'}" :data="GetActiveUsedInputByKey(scope.row.Key)" style="width:85%;margin:auto;">
-                <el-table-column label="Index" prop="Index"><template slot-scope="scope"> {{SolveInputNumberByKey(scope.row.Key)}}</template></el-table-column>
-                <el-table-column label="Name"><template slot-scope="scope"> {{SolveInputNameByKey(scope.row.Key)}}</template></el-table-column>
+            <el-table ref="singleTable" :default-sort = "{prop: 'Number', order: 'ascending'}" :data="GetActiveUsedInputByKey(InputScope.row.Key)" style="width:85%;margin:auto;">
+                <el-table-column label="Number"><template slot-scope="numScope"> {{SolveInputNumberByKey(numScope.row.Key)}}</template></el-table-column>
+                <el-table-column label="Index"><template slot-scope="IndexScope">{{GetOverlayNumberByKey(IndexScope.row.Key,InputScope.row.Key)}}</template></el-table-column>
+                <el-table-column label="Name"><template slot-scope="NameScope"> {{SolveInputNameByKey(NameScope.row.Key)}}</template></el-table-column>
                 <el-table-column label="Key" prop="Key"></el-table-column>
             </el-table>
         </template>
@@ -88,7 +89,7 @@ export default {
                     if (this.inputs[i].Overlay[o].Key == key) {
                         UsingInputs.push(this.inputs[i])
                     }
-              }
+                }
               }
           }
           return UsingInputs
@@ -107,6 +108,20 @@ export default {
                 message: err
         });
       }
+    },
+    GetOverlayNumberByKey:function(InputKey,OverlayKey) {
+        if (!Array.isArray(this.inputs)) {
+            return
+        }
+        for (let i=0;i<this.inputs.length;i++) {
+            if (this.inputs[i].Key == InputKey && Array.isArray(this.inputs[i].Overlay)) {
+                for (let o=0;o<this.inputs[i].Overlay.length;o++) {
+                    if (this.inputs[i].Overlay[o].Key == OverlayKey) {
+                        return this.inputs[i].Overlay[o].Index
+                    }
+                }
+              }
+          }
     }
   },
   watch:{