wow

src/App.vue

@@ -50,6 +50,7 @@ import Sidebar from "./components/Sidebar.vue";
   border-bottom: 1px white !important;
   background-color: #F7F7F7 !important;
   vertical-align: middle !important;
+  text-align: left !important;
 }
 .handsontable tr {
   border-radius: 10px !important;

src/components/CharacterInventory.vue

@@ -16,7 +16,11 @@ const updateTable = ():TableRecipe | undefined => {
   if (invs.value.has(activeTable.value)) {
     const chardat = invs.value.get(activeTable.value)
     if (chardat) {
-      const it = new InventoryTable(chardat, { columns: columns.value, tags: tags.value })
+      const it = new InventoryTable(chardat, {
+        columns: columns.value,
+        tags: tags.value,
+        accounts: Array.from(invs.value.keys()),
+      } as InventoryTableOptions)
       const hot = (hotTableComponent.value.hotInstance as Handsontable)
       const build = it.BuildTable()
       hot.updateSettings(build.settings)
@@ -41,7 +45,7 @@ log.debug(`${dirty.value} rendering inventory`, activeTable.value)
 <script lang="ts">
 import { defineComponent, computed, PropType, defineProps, defineEmits, watch} from 'vue';
 import { registerAllModules } from 'handsontable/registry';
-import { DefaultSettings, InventoryTable, TableRecipe } from '../lib/table';
+import { DefaultSettings, InventoryTable, InventoryTableOptions, TableRecipe } from '../lib/table';
 import { Columns, ColumnByNames, ColumnInfo } from '../lib/columns';
 import { TricksterItem, SampleData } from '../lib/trickster';
 import Handsontable from 'handsontable';

src/components/ColumnCheckbox.vue

@@ -8,7 +8,6 @@ const props = defineProps(["colname","label"])
 const {columns} = useStoreRef()
 const checked = ref(columns.value.has(props.colname))
 watch(columns.value.dirty,()=>{
-  console.log("changed")
   if(columns.value.has(props.colname)) {
     checked.value = true
   }else{

src/components/ColumnCheckboxGroup.vue

@@ -11,7 +11,6 @@
   </label>
   <label :for="'checkbox-'+props.header">{{props.header}}</label>
   <input type="checkbox" :id="'checkbox-'+props.header" v-model="checked" />
-
   <br>
   <div
     class="checkbox_parent"
@@ -41,7 +40,6 @@ const checked = ref(props.default)
 const show = ref(true)
 watch(show,()=>{
 })
-
 watch(checked,()=>{
   if(checked.value === true) {
     props.columns.forEach(x=>columns.value.add(x))

src/components/Sidebar.vue

@@ -3,8 +3,6 @@
   <br>
   <FilterCheckboxGroup :header="'tags:'" :columns="TagColumns" />
   <br>
-  <br>
-
   Columns:
   <br>
   <ColumnCheckboxGroup :header="'action:'" :columns="MoveColumns" :default="true" />

src/lib/columns.ts

@@ -67,7 +67,7 @@ export interface ColumnInfo  {
   name: ColumnName
   displayName:string
 
-  options?:(item:TricksterItem, r:RefStore)=>string[]
+  options?:(s:string[])=>string[]
   renderer?:any
   filtering?:boolean
   writable?:boolean
@@ -140,13 +140,13 @@ class Move implements ColumnInfo {
   writable = true
   options = getMoveTargets
   getter(item:TricksterItem):(string|number){
-    return "-"
+    return "---------------------------------------------"
   }
 }
 
-const getMoveTargets = (item:TricksterItem, r:RefStore):string[] => {
+const getMoveTargets = (invs: string[]):string[] => {
   let out:string[] = [];
-  for(const k of r.invs.value.keys()) {
+  for(const k of invs){
     out.push(k)
   }
   out.push("")

src/lib/table.ts

@@ -10,6 +10,8 @@ import { ref } from "vue"
 export interface InventoryTableOptions {
   columns: ColumnSet
   tags: ColumnSet
+
+  accounts: string[]
 }
 
 export interface Mappable<T> {
@@ -95,12 +97,19 @@ export class InventoryTable {
     return this.o.columns.map(x=>x.displayName)
   }
   getTableColumnSettings(): ColumnSettings[] {
-    return this.o.columns.map(x=>({
+    return this.o.columns.map(x=>{
+      let out:any = {
         renderer: x.renderer ? x.renderer : "text",
         dropdownMenu: x.filtering ? DefaultDropdownItems() : false,
         readOnly: x.writable ? false : true,
-      selectionMode: x.writable ? "multiple" : "single"
+        selectionMode: (x.writable ? "multiple" : 'single') as any,
-    }))
+      }
+      if(x.options) {
+        out.type = 'dropdown'
+        out.source = Array.from(this.o.accounts.values())
+      }
+      return out
+    })
   }
   getTableRows():any[][] {
     return Object.values(this.inv.items)