ayanova/src/components/alert-control.vue

@@ -1,14 +1,29 @@
 <template>
   <v-col v-if="alertMessage" cols="12" mt-1 mb-2>
-    <v-alert
-      ref="alertBox"
-      data-cy="alertbox"
-      v-show="alertMessage"
-      color="primary"
-      icon="$ayiInfoCircle"
-      class="multi-line"
-      outlined
-      >{{ alertMessage }}</v-alert
+    <template v-if="redAlert">
+      <v-alert
+        ref="alertBox"
+        data-cy="alertbox"
+        v-show="alertMessage"
+        color="error"
+        type="error"
+        icon="$ayiExclamationTriangle"
+        class="multi-line"
+        outlined
+        >{{ alertMessage }}</v-alert
+      ></template
+    >
+    <template v-else>
+      <v-alert
+        ref="alertBox"
+        data-cy="alertbox"
+        v-show="alertMessage"
+        color="primary"
+        icon="$ayiInfoCircle"
+        class="multi-line"
+        outlined
+        >{{ alertMessage }}</v-alert
+      ></template
     >
   </v-col>
 </template>
@@ -16,7 +31,8 @@
 export default {
   data: () => ({}),
   props: {
-    alertMessage: { type: String, default: null }
+    alertMessage: { type: String, default: null },
+    redAlert: { type: Boolean, default: false }
   }
 };
 </script>

ayanova/src/views/svc-workorder.vue

@@ -3,7 +3,8 @@
     <gz-report-selector ref="reportSelector"></gz-report-selector>
     <div v-if="formState.ready">
       <gz-error :error-box-message="formState.errorBoxMessage"></gz-error>
-      <gz-alert :alert-message="obj.alertViz"></gz-alert>
+      <gz-alert :alert-message="obj.alertViz" red-alert></gz-alert>
+      <gz-alert :alert-message="obj.customerTechNotesViz"></gz-alert>
       <!-- SERVERERROR:{{ formState.serverError }} -->
       <v-form ref="form">
         <GzWoHeader