diff --git a/ayanova/devdocs/todo.txt b/ayanova/devdocs/todo.txt
index 3fff0614..da574fa3 100644
--- a/ayanova/devdocs/todo.txt
+++ b/ayanova/devdocs/todo.txt
@@ -214,7 +214,8 @@ todo: many biz objects are not using new PUT methodology
 
 CURRENTLY DOING: workorder front POC
 	- make minimal front end enough for POC wokorder->
-												woitem->woitemscheduleduser collection
+												woitem ->
+													woitemscheduleduser collection
 												wostate
 		- test out, confirm can CRUD as planned independantly and all at once
 		- will need some dirty fields and viz fields likely added to models so go minimal route as possible to POC it
@@ -229,7 +230,8 @@ CURRENTLY DOING: workorder front POC
 		https://www.voorhoede.nl/en/blog/why-skip-links-are-important-for-accessibility/
 
 
-
+todo: clean up translation text, many things are badly worded for wo like all *List could just use plural form and be shorter
+	as coding it look for areas to be cleaned up
 
 todo: how far to extend down tags, custom fields , wiki
 	because technically could do that easily, each child/grandchild will have own popup edit form to place those controls
diff --git a/ayanova/src/components/work-order-items.vue b/ayanova/src/components/work-order-items.vue
index fe5b4bc9..16e50a53 100644
--- a/ayanova/src/components/work-order-items.vue
+++ b/ayanova/src/components/work-order-items.vue
@@ -27,7 +27,30 @@
       >[selected index: {{ pvm.selectedItemIndex }}]</span
     >
     <template v-if="pvm.woItemCount > 1">
-      <!-- Workorder item table here -->
+      <!-- Workorder item table here, with a click it triggers selected item at parent which triggers form to open for edit below grid -->
+      <!-- ################################ WORK ORDER ITEMS LIST ############################### -->
+      <v-col cols="12">
+        <v-data-table
+          :headers="headerList"
+          :items="itemList"
+          class="elevation-1"
+          disable-pagination
+          disable-filtering
+          disable-sort
+          hide-default-footer
+          data-cy="itemsTable"
+          dense
+          :item-class="itemRowClasses"
+        >
+          <template v-slot:[`item.actions`]="{ item }">
+            <v-btn icon @click="selectItem(item)">
+              <v-icon :class="itemRowClasses(item)">
+                $ayiEdit
+              </v-icon>
+            </v-btn>
+          </template>
+        </v-data-table>
+      </v-col>
     </template>
     <template v-if="pvm.hasSelectedWoItem">
       <v-col v-if="form().showMe(this, 'TechNotes')" cols="12">
@@ -86,6 +109,9 @@ export default {
     newItem() {
       console.log("STUB: NEW ITEM");
     },
+    selectItem: function(item) {
+      this.pvm.selectedItemIndex = item.index;
+    },
     form() {
       return window.$gz.form;
     },
@@ -93,9 +119,116 @@ export default {
       if (!this.formState.loading && !this.formState.readonly) {
         window.$gz.form.fieldValueChanged(this.pvm, ref);
       }
+    },
+    itemRowClasses: function(item) {
+      if (this.form().childRowHasError(this, "Items", item.index)) {
+        return "font-weight-black font-italic error--text";
+      }
     }
   },
   computed: {
+    headerList: function() {
+      /*
+         public uint Concurrency { get; set; }
+        public string Notes { get; set; }//Was Summary
+        public string Wiki { get; set; }
+        public string CustomFields { get; set; }
+        public List<string> Tags { get; set; } = new List<string>();
+
+        [Required]
+        public long WorkOrderId { get; set; }
+        public string TechNotes { get; set; }
+        public long? WorkorderItemStatusId { get; set; }
+        public long? WorkorderItemPriorityId { get; set; }
+        public DateTime RequestDate { get; set; }
+        public bool WarrantyService { get; set; } = false;
+
+
+IN ORDER: notes, status, date, priority, warranty, tags
+
+except they will not prefill at server but will be set here since the wo differs from the po in that there is no instant update with new viz fields to populate from server
+and it's probably not a big list to fill anyway
+
+
+  If the column is a text, left-align it
+  If the column is a number or number + unit, (or date) right-align it (like excel)
+  */
+      let headers = [];
+      let vm = this;
+      headers.push({
+        text: vm.$ay.t("WorkOrderItemSummary"), //mandatory not hidden
+        align: "left",
+        value: "notes"
+      });
+
+      if (vm.form().showMe(vm, "Items.WorkOrderItemWorkOrderStatusID")) {
+        headers.push({
+          text: vm.$ay.t("WorkOrderItemWorkOrderStatusID"),
+          align: "left",
+          value: "status"
+        });
+      }
+
+      if (vm.form().showMe(vm, "Items.RequestDate")) {
+        headers.push({
+          text: vm.$ay.t("WorkOrderItemRequestDate"),
+          align: "right",
+          value: "requestDate"
+        });
+      }
+
+      if (vm.form().showMe(vm, "Items.WorkOrderItemPriorityID")) {
+        headers.push({
+          text: vm.$ay.t("WorkOrderItemPriorityID"),
+          align: "left",
+          value: "priority"
+        });
+      }
+
+      if (vm.form().showMe(vm, "Items.WorkOrderItemWarrantyService")) {
+        headers.push({
+          text: vm.$ay.t("WorkOrderItemWarrantyService"),
+          align: "center",
+          value: "warranty"
+        });
+      }
+
+      if (vm.form().showMe(vm, "Items.Tags")) {
+        headers.push({
+          text: vm.$ay.t("Tags"),
+          align: "left",
+          value: "tags"
+        });
+      }
+
+      headers.push({ text: "", value: "actions" });
+
+      return headers;
+    },
+    itemList: function() {
+      let vm = this;
+      return vm.value.items.map((x, i) => {
+        return {
+          index: i,
+          id: x.id,
+          notes: x.notes,
+          quantityReceived: window.$gz.locale.decimalLocalized(
+            x.quantityReceived,
+            vm.languageName
+          ),
+          status: x.workorderItemStatusId, //todo: get real status name etc here
+          requestDate: window.$gz.locale.utcDateToShortDateAndTimeLocalized(
+            x.requestDate,
+            vm.timeZoneName,
+            vm.languageName,
+            vm.hour12
+          ),
+          priority: x.workorderItemPriorityId, //todo: get actual priority, color etc here
+          warranty: x.warrantyService,
+          tags: x.tags
+        };
+      });
+    },
     formState: function() {
       return this.pvm.formState;
     },
diff --git a/ayanova/src/views/svc-workorder.vue b/ayanova/src/views/svc-workorder.vue
index e3bdd36a..c40f7c1f 100644
--- a/ayanova/src/views/svc-workorder.vue
+++ b/ayanova/src/views/svc-workorder.vue
@@ -88,10 +88,12 @@ export default {
         valid: true
       });
 
-      //todo: TEMPORARY FOR TESTING??
-      //IDEALLY IT WOULD BE CLEANER IF NOTHING SELECTED ON OPEN, BUT IF ONLY ONE THEN IT SHOULD SELECT??
+      //If there is a single woitem then select it otherwise keep it clean and empty by not selecting thus not showing 
+      //edit form as per design
       if (vm.obj.items.length > 0) {
-        vm.selectedItemIndex = 0;
+        if (vm.obj.items.length == 1) {
+          vm.selectedItemIndex = 0;
+        }
       } else {
         vm.selectedItemIndex = null;
       }
@@ -836,7 +838,12 @@ async function fetchTranslatedText(vm) {
     "WorkOrderCustom16",
     "WorkOrderItemList",
     "WorkOrderItemTechNotes",
-    "WorkOrderItemScheduledUserList"
+    "WorkOrderItemScheduledUserList",
+    "WorkOrderItemSummary",
+    "WorkOrderItemWorkOrderStatusID",
+    "WorkOrderItemRequestDate",
+    "WorkOrderItemPriorityID",
+    "WorkOrderItemWarrantyService"
   ]);
 }