ayanova/src/components/work-order-header.vue

@@ -1,6 +1,48 @@
 <template>
   <div>
     <h1>WorkOrder header</h1>
+    <v-row>
+      <v-col cols="12" sm="6" lg="4" xl="3" v-if="value.serial != 0">
+        <template v-if="canEditSerial">
+          <v-text-field
+            v-model="value.serial"
+            :readonly="formState.readOnly"
+            :label="$ay.t('WorkOrderSerialNumber')"
+            ref="serial"
+            data-cy="serial"
+            :rules="[
+              form().integerValid(this, 'serial'),
+              form().required(this, 'serial')
+            ]"
+            :error-messages="form().serverErrors(this, 'serial')"
+            @input="fieldValueChanged('serial')"
+          ></v-text-field>
+        </template>
+        <template v-else>
+          <div>
+            <span class="text-caption">
+              {{ $ay.t("WorkOrderSerialNumber") }}</span
+            >
+          </div>
+          <div>
+            <span class="text-h5">{{ value.serial }}</span>
+          </div>
+        </template>
+      </v-col>
+
+      <v-col v-if="form().showMe(this, 'Notes')" cols="12">
+        <v-textarea
+          v-model="value.notes"
+          :readonly="formState.readOnly"
+          :label="$ay.t('WorkOrderSummary')"
+          :error-messages="form().serverErrors(this, 'notes')"
+          ref="notes"
+          data-cy="notes"
+          @input="fieldValueChanged('notes')"
+          auto-grow
+        ></v-textarea>
+      </v-col>
+    </v-row>
   </div>
 </template>
 <script>
@@ -10,18 +52,19 @@
 
 export default {
   data() {
-    return {};
+    return {
+      canEditSerial: window.$gz.role.hasRole([
+        window.$gz.role.AUTHORIZATION_ROLES.BizAdminFull
+      ])
+    };
   },
 
   props: {
     value: {
-      default: "{}",
-      type: String
+      default: null,
+      type: Object
     },
-    formKey: { type: String, default: "" }, //used to grab template from store
-    readonly: Boolean,
-    disabled: Boolean,
-    parentVM: {
+    pvm: {
       default: null,
       type: Object
     }
@@ -32,14 +75,108 @@ export default {
       return window.$gz.form;
     },
     fieldValueChanged(ref) {
-      if (
-        !this.parentVM.formState.loading &&
-        !this.parentVM.formState.readonly
-      ) {
-        window.$gz.form.fieldValueChanged(this.parentVM, ref);
+      if (!this.formState.loading && !this.formState.readonly) {
+        window.$gz.form.fieldValueChanged(this.pvm, ref);
       }
     }
   },
-  computed: {}
+  computed: {
+    formState: function() {
+      return this.pvm.formState;
+    },
+    formCustomTemplateKey: function() {
+      return this.pvm.formCustomTemplateKey;
+    }
+  }
 };
+/*
+ data: {
+            id: 10,
+            concurrency: 7713074,
+            serial: 10,
+            notes:
+              "Sequi quia est occaecati vel aperiam dicta praesentium velit et.",
+            wiki: null,
+            customFields: null,
+            tags: ["orange", "violet"],
+            customerId: 14,
+            projectId: null,
+            internalReferenceNumber: "irf-4603",
+            customerReferenceNumber: "crf-4720",
+            customerContactName: "contact name here",
+            fromQuoteId: null,
+            fromPMId: null,
+            fromCSRId: null,
+            serviceDate: "2020-09-03T03:06:41.238542Z",
+            completeByDate: "2020-09-08T03:06:41.238542Z",
+            invoiceNumber: null,
+            customerSignature: null,
+            customerSignatureName: null,
+            customerSignatureCaptured: "0001-01-01T00:00:00Z",
+            postAddress: null,
+            postCity: null,
+            postRegion: null,
+            postCountry: null,
+            postCode: null,
+            address: null,
+            city: null,
+            region: null,
+            country: null,
+            latitude: null,
+            longitude: null,
+            items: [
+              {
+                id: 20,
+                concurrency: 7713074,
+                notes: "itemnotes",
+                wiki: null,
+                customFields: null,
+                tags: [],
+                workOrderId: 10,
+                techNotes: "technotes",
+                workorderItemStatusId: null,
+                workorderItemPriorityId: null,
+                requestDate: "2020-09-03T03:06:41.238542Z",
+                warrantyService: false,
+                isDirty: false,
+                expenses: [],
+                labors: [],
+                loans: [],
+                parts: [],
+                partRequests: [],
+                scheduledUsers: [
+                  {
+                    id: 39,
+                    concurrency: 7713074,
+                    userId: 30,
+                    estimatedQuantity: 1,
+                    startDate: null,
+                    stopDate: null,
+                    serviceRateId: null,
+                    isDirty: false,
+                    workOrderItemId: 20
+                  },
+                  {
+                    id: 40,
+                    concurrency: 7713074,
+                    userId: 10,
+                    estimatedQuantity: 2,
+                    startDate: null,
+                    stopDate: null,
+                    serviceRateId: null,
+                    isDirty: false,
+                    workOrderItemId: 20
+                  }
+                ],
+                tasks: [],
+                travels: [],
+                units: [],
+                outsideServices: []
+              }
+            ],
+            states: [],
+            isDirty: false
+          }
+        }
+*/
 </script>

ayanova/src/components/work-order-items.vue

@@ -1,6 +1,14 @@
 <template>
   <div>
     <h2>WorkOrder items here</h2>
+    <template v-if="value.items.count > 1">
+      table of woitems here
+    </template>
+    <template v-if="pvm.selectedItemIndex">
+      woitem is selected
+    </template>
+
+    woitemfields
     <GzWoItemScheduledUsers data-cy="woItemScheduledUsers" />
   </div>
 </template>
@@ -17,16 +25,12 @@ export default {
   data() {
     return {};
   },
-
   props: {
     value: {
-      default: "{}",
-      type: String
+      default: null,
+      type: Object
     },
-    formKey: { type: String, default: "" }, //used to grab template from store
-    readonly: Boolean,
-    disabled: Boolean,
-    parentVM: {
+    pvm: {
       default: null,
       type: Object
     }
@@ -37,14 +41,18 @@ export default {
       return window.$gz.form;
     },
     fieldValueChanged(ref) {
-      if (
-        !this.parentVM.formState.loading &&
-        !this.parentVM.formState.readonly
-      ) {
-        window.$gz.form.fieldValueChanged(this.parentVM, ref);
+      if (!this.formState.loading && !this.formState.readonly) {
+        window.$gz.form.fieldValueChanged(this.pvm, ref);
       }
     }
   },
-  computed: {}
+  computed: {
+    formState: function() {
+      return this.pvm.formState;
+    },
+    formCustomTemplateKey: function() {
+      return this.pvm.formCustomTemplateKey;
+    }
+  }
 };
 </script>