diff --git a/ayanova/src/router.js b/ayanova/src/router.js
index 4a70af92..d7532de5 100644
--- a/ayanova/src/router.js
+++ b/ayanova/src/router.js
@@ -34,8 +34,10 @@ const scrollBehavior = function(to, from, savedPosition) {
       return false;
     }
 
+    // eslint-disable-next-line
     return new Promise((resolve) => {
       // check if any matched route config has meta that requires scrolling to top
+      // eslint-disable-next-line
       if (to.matched.some((m) => m.meta.scrollToTop)) {
         // coords will be used if no selector is provided,
         // or if the selector didn't match any element.
diff --git a/ayanova/src/views/ops-server-state.vue b/ayanova/src/views/ops-server-state.vue
index a98a93c9..8efa7d03 100644
--- a/ayanova/src/views/ops-server-state.vue
+++ b/ayanova/src/views/ops-server-state.vue
@@ -1,31 +1,289 @@
 <template>
-  <UnderConstruction />
+  <v-container>
+    <v-row v-if="formState.ready">
+      <v-col>
+        <v-form ref="form">
+          <v-row>
+            <gz-error :errorBoxMessage="formState.errorBoxMessage"></gz-error>
+            <v-col cols="12" sm="6" lg="4" xl="3">
+              <v-radio-group v-model="obj.serverState" :mandatory="true">
+                <v-radio
+                  :label="$ay.t('ServerStateOpen')"
+                  value="Open"
+                ></v-radio>
+                <v-radio
+                  :label="$ay.t('ServerStateOps')"
+                  value="OpsOnly"
+                ></v-radio>
+              </v-radio-group>
+            </v-col>
+          </v-row>
+        </v-form>
+      </v-col>
+    </v-row>
+  </v-container>
 </template>
 
 <script>
-import UnderConstruction from "../components/underconstruction.vue";
-/**
- * 
- * 
- *   <div>
-      MRU + depending on role: new workorder, new client, personal workorder
-      list if scheduleable, or if ops then whatever ops needs or admin whatever
-      they need etc
-    </div>
- * 
- * 
- */
+/////////////////////////////////////////////////////////////////////////////////////////////////////////////
+/*  Xeslint-disable    */
+////////////////////////////////////////////////////////////////////////////////////////////////////////////
+
+const FORM_KEY = "ops-server-state";
+const API_BASE_URL = "ServerState/";
+const FORM_CUSTOM_TEMPLATE_KEY = "ops-server-state";
+
 export default {
-  components: {
-    UnderConstruction
+  created() {
+    let vm = this;
+    initForm(vm)
+      .then(() => {
+        vm.rights = window.$gz.role.getRights(window.$gz.type.ServerState);
+        vm.formState.ready = true;
+        window.$gz.eventBus.$on("menu-click", clickHandler);
+        vm.getDataFromApi();
+      })
+      .catch(err => {
+        vm.formState.ready = true;
+        window.$gz.errorHandler.handleFormError(err, vm);
+      });
   },
-  beforeCreate() {
-    window.$gz.eventBus.$emit("menu-change", {
-      isMain: true,
-      icon: "fa-door-open",
-      title: this.$ay.t("ServerState"),
-      helpUrl: "form-ops-server-state"
-    });
+  // beforeRouteLeave(to, from, next) {
+  //   if (this.formState.dirty) {
+  //     window.$gz.dialog.confirmLeaveUnsaved().then(dialogResult => {
+  //       if (dialogResult == true) {
+  //         next();
+  //       } else {
+  //         next(false);
+  //       }
+  //     });
+  //   } else {
+  //     next();
+  //   }
+  // },
+  beforeDestroy() {
+    window.$gz.eventBus.$off("menu-click", clickHandler);
+  },
+  components: {},
+  data() {
+    return {
+      formCustomTemplateKey: FORM_CUSTOM_TEMPLATE_KEY,
+      obj: {
+        serverState: "",
+        reason: ""
+      },
+      formState: {
+        ready: false,
+        dirty: false,
+        valid: true,
+        readOnly: false,
+        loading: true,
+        errorBoxMessage: null,
+        appError: null,
+        serverError: {}
+      },
+      rights: window.$gz.role.defaultRightsObject()
+    };
+  },
+  //WATCHERS
+  watch: {
+    formState: {
+      handler: function(val) {
+        //,oldval is available here too if necessary
+        if (this.formState.loading) {
+          return;
+        }
+
+        //enable / disable save button
+        let canSave = val.dirty && val.valid && !val.readOnly;
+        if (canSave) {
+          window.$gz.eventBus.$emit("menu-enable-item", FORM_KEY + ":save");
+        } else {
+          window.$gz.eventBus.$emit("menu-disable-item", FORM_KEY + ":save");
+        }
+      },
+      deep: true
+    }
+  },
+  computed: {
+    canSave: function() {
+      return this.formState.valid && this.formState.dirty;
+    }
+  },
+  methods: {
+    form() {
+      return window.$gz.form;
+    },
+    fieldValueChanged(ref) {
+      if (!this.formState.loading && !this.formState.readOnly) {
+        window.$gz.form.fieldValueChanged(this, ref);
+      }
+    },
+    getDataFromApi() {
+      let vm = this;
+      vm.formState.loading = true;
+      let url = API_BASE_URL;
+      window.$gz.form.deleteAllErrorBoxErrors(vm);
+      window.$gz.api
+        .get(url)
+        .then(res => {
+          if (res.error != undefined) {
+            vm.formState.serverError = res.error;
+            window.$gz.form.setErrorBoxErrors(vm);
+          } else {
+            vm.obj = res.data;
+
+            //Update the form status
+            window.$gz.form.setFormState({
+              vm: vm,
+              dirty: false,
+              valid: true,
+              loading: false,
+              readOnly: res.readOnly ? true : false
+            });
+            //modify the menu as necessary
+            generateMenu(vm);
+          }
+        })
+        .catch(function handleGetDataFromAPIError(error) {
+          //Update the form status
+          window.$gz.form.setFormState({
+            vm: vm,
+            loading: false
+          });
+          window.$gz.errorHandler.handleFormError(error, vm);
+        });
+    },
+    submit() {
+      let vm = this;
+      if (vm.canSave) {
+        vm.formState.loading = true;
+
+        //always submit from this form for the current logged in user id
+        let url = API_BASE_URL + vm.$store.state.userId;
+
+        //clear any errors vm might be around from previous submit
+        window.$gz.form.deleteAllErrorBoxErrors(vm);
+        window.$gz.api
+          .upsert(url, vm.obj)
+          .then(res => {
+            vm.formState.loading = false;
+            if (res.error != undefined) {
+              vm.formState.serverError = res.error;
+              window.$gz.form.setErrorBoxErrors(vm);
+            } else {
+              //UserOptions is never a POST as it always exists and can't be deleted so always a PUT
+
+              //Handle "put" of an existing record (UPDATE)
+              vm.obj.concurrencyToken = res.data.concurrencyToken;
+              window.$gz.form.setFormState({
+                vm: vm,
+                dirty: false
+              });
+
+              //Set values in store so they are updated immediately for user
+              let l = vm.$store.state.locale;
+
+              if (vm.obj.languageOverride) {
+                l.languageOverride = vm.obj.languageOverride;
+              }
+
+              if (vm.obj.timeZoneOverride) {
+                l.timeZoneOverride = vm.obj.timeZoneOverride;
+              }
+
+              if (vm.obj.currencyName) {
+                l.currencyName = vm.obj.currencyName;
+              }
+
+              if (vm.obj.hour12) {
+                l.hour12 = vm.obj.hour12;
+              }
+
+              window.$gz.store.commit("setLocale", l);
+            }
+          })
+          .catch(function handleSubmitError(error) {
+            vm.formState.loading = false;
+            window.$gz.errorHandler.handleFormError(error, vm);
+          });
+      }
+    }
   }
 };
+
+/////////////////////////////
+//
+//
+function clickHandler(menuItem) {
+  if (!menuItem) {
+    return;
+  }
+  let m = window.$gz.menu.parseMenuItem(menuItem);
+  if (m.owner == FORM_KEY && !m.disabled) {
+    switch (m.key) {
+      case "save":
+        m.vm.submit();
+        break;
+
+      default:
+        window.$gz.eventBus.$emit(
+          "notify-warning",
+          FORM_KEY + "::context click: [" + m.key + "]"
+        );
+    }
+  }
+}
+
+//////////////////////
+//
+//
+function generateMenu(vm) {
+  let menuOptions = {
+    isMain: true,
+    icon: "fa-door-open",
+    title: vm.$ay.t("ServerState"),
+    helpUrl: "form-ops-server-state",
+    formData: {
+      ayaType: window.$gz.type.UserOptions
+    },
+    menuItems: []
+  };
+
+  if (vm.rights.change) {
+    menuOptions.menuItems.push({
+      title: vm.$ay.t("Save"),
+      icon: "fa-save",
+      surface: true,
+      key: FORM_KEY + ":save",
+      vm: vm
+    });
+  }
+
+  window.$gz.eventBus.$emit("menu-change", menuOptions);
+}
+
+/////////////////////////////////
+//
+//
+function initForm(vm) {
+  return new Promise(function(resolve, reject) {
+    (async function() {
+      try {
+        await fetchTranslatedText(vm);
+      } catch (err) {
+        reject(err);
+      }
+      resolve();
+    })();
+  });
+}
+
+//////////////////////////////////////////////////////////
+//
+// Ensures UI translated text is available
+//
+function fetchTranslatedText(vm) {
+  return window.$gz.translation.fetch(["ServerStateOpen", "ServerStateOps"]);
+}
 </script>