diff --git a/.gitignore b/.gitignore
new file mode 100644
index 0000000..4c5f206
--- /dev/null
+++ b/.gitignore
@@ -0,0 +1 @@
+.claude/
diff --git a/AGENTS.md b/AGENTS.md
index d34c45c..5069ec2 100644
--- a/AGENTS.md
+++ b/AGENTS.md
@@ -21,6 +21,9 @@
   - Contoh: `6D9QD6 - buat api baru`
 - Jangan buat commit tanpa kode task dari user.
 - Kode task digunakan untuk sinkronisasi timesheet Odoo.
+- Sebelum push atau menyiapkan merge branch kerja, selalu cek base branch remote yang benar terlebih dahulu, lalu jalankan `git fetch origin` dan `git rebase` ke base remote tersebut agar conflict muncul lebih awal dan proses merge lebih minim error.
+- Push branch kerja ke remote lalu buat merge request ke `main`; proses merge ikuti permission dan alur review repo, jangan direct push ke `main` kecuali diminta eksplisit.
+- Jangan pernah melakukan `git push --force` atau varian force-push lain.
 - Lalu `git push` tanpa kerja tambahan yang tidak diperlukan.
 
 ## Auto Sync ke Devcpone
diff --git a/CLAUDE.md b/CLAUDE.md
index a45abe8..2db704f 100644
--- a/CLAUDE.md
+++ b/CLAUDE.md
@@ -4,6 +4,9 @@
   - Contoh: `6D9QD6 - buat api baru`
 - Jangan buat commit tanpa kode task dari user.
 - Kode task digunakan untuk sinkronisasi timesheet Odoo.
+- Sebelum push atau menyiapkan merge branch kerja, selalu cek base branch remote yang benar terlebih dahulu, lalu jalankan `git fetch origin` dan `git rebase` ke base remote tersebut agar conflict muncul lebih awal dan proses merge lebih minim error.
+- Push branch kerja ke remote lalu buat merge request ke `main`; proses merge ikuti permission dan alur review repo, jangan direct push ke `main` kecuali diminta eksplisit.
+- Jangan pernah melakukan `git push --force` atau varian force-push lain.
 
 # Auto Sync ke Devcpone
 - Repo ini punya **post-commit hook** di `.githooks/post-commit` yang otomatis menjalankan `scripts/devcpone_sync.sh`.
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/action.js b/test/vuex/one-fo-registration-walk-in-stemcell/action.js
new file mode 100644
index 0000000..e69de29
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/api/area.js b/test/vuex/one-fo-registration-walk-in-stemcell/api/area.js
new file mode 100644
index 0000000..8ca45f2
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/api/area.js
@@ -0,0 +1,92 @@
+// API :
+// search bank
+// paramater : query , page , rowPerPage
+const URL =
+   "/one-api/mockup/clinic/fo/";
+
+export async function search_province(search) {
+   try {
+      var resp = await axios.post(URL + 'area/search_province', {
+         search: search
+      });
+      if (resp.status != 200) {
+         return {
+            status: "ERR",
+            message: resp.statusText
+         };
+      }
+      let data = resp.data;
+      return data;
+   } catch(e) {
+      return {
+         status: "ERR",
+         message: e.message
+      };
+   }
+}
+
+export async function search_city(province_id, search) {
+   try {
+      var resp = await axios.post(URL + 'area/search_city', {
+         search: search,
+         province_id: province_id
+      });
+      if (resp.status != 200) {
+         return {
+            status: "ERR",
+            message: resp.statusText
+         };
+      }
+      let data = resp.data;
+      return data;
+   } catch(e) {
+      return {
+         status: "ERR",
+         message: e.message
+      };
+   }
+}
+
+export async function search_district(city_id, search) {
+   try {
+      var resp = await axios.post(URL + 'area/search_district', {
+         search: search,
+         city_id: city_id
+      });
+      if (resp.status != 200) {
+         return {
+            status: "ERR",
+            message: resp.statusText
+         };
+      }
+      let data = resp.data;
+      return data;
+   } catch(e) {
+      return {
+         status: "ERR",
+         message: e.message
+      };
+   }
+}
+
+export async function search_kelurahan(district_id, search) {
+   try {
+      var resp = await axios.post(URL + 'area/search_kelurahan', {
+         search: search,
+         district_id: district_id
+      });
+      if (resp.status != 200) {
+         return {
+            status: "ERR",
+            message: resp.statusText
+         };
+      }
+      let data = resp.data;
+      return data;
+   } catch(e) {
+      return {
+         status: "ERR",
+         message: e.message
+      };
+   }
+}
\ No newline at end of file
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/api/company.js b/test/vuex/one-fo-registration-walk-in-stemcell/api/company.js
new file mode 100644
index 0000000..878b4d0
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/api/company.js
@@ -0,0 +1,78 @@
+const URL = "/one-api/mockup/fo/walk_in_registration_stemcell/";
+
+export async function search(search) {
+   try {
+      var resp = await axios.post(URL + 'company/search',{search:search,token:window.one_token()});
+      if (resp.status != 200) {
+         return {
+            status: "ERR",
+            message: resp.statusText
+         };
+      }
+      let data = resp.data;
+      return data;
+   } catch(e) {
+      return {
+         status: "ERR",
+         message: e.message
+      };
+   }
+}
+
+export async function search_default() {
+   try {
+      var resp = await axios.post(URL + 'company/search_default');
+      if (resp.status != 200) {
+         return {
+            status: "ERR",
+            message: resp.statusText
+         };
+      }
+      let data = resp.data;
+      return data;
+   } catch(e) {
+      return {
+         status: "ERR",
+         message: e.message
+      };
+   }
+}
+
+export async function search_project(prm) {
+   try {
+      var resp = await axios.post(URL + 'company/search_project',prm);
+      if (resp.status != 200) {
+         return {
+            status: "ERR",
+            message: resp.statusText
+         };
+      }
+      let data = resp.data;
+      return data;
+   } catch(e) {
+      return {
+         status: "ERR",
+         message: e.message
+      };
+   }
+}
+
+
+export async function search_fisik_template(prm) {
+   try {
+      var resp = await axios.post(URL + 'company/search_fisik_template',prm);
+      if (resp.status != 200) {
+         return {
+            status: "ERR",
+            message: resp.statusText
+         };
+      }
+      let data = resp.data;
+      return data;
+   } catch(e) {
+      return {
+         status: "ERR",
+         message: e.message
+      };
+   }
+}
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/api/delivery.js b/test/vuex/one-fo-registration-walk-in-stemcell/api/delivery.js
new file mode 100644
index 0000000..fb2011d
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/api/delivery.js
@@ -0,0 +1,43 @@
+// API :
+// search bank
+// paramater : query , page , rowPerPage
+const URL =
+   "/one-api/mockup/fo/walk_in_registration_stemcell/";
+
+export async function search(o_id, p_id, d_id, m_id,c_id) {
+   try {
+      var resp = await axios.post(URL + 'delivery/search', { order_id: o_id, patient_id: p_id, doctor_id: d_id, mou_id: m_id,c_id:c_id });
+      if (resp.status != 200) {
+         return {
+            status: "ERR",
+            message: resp.statusText
+         };
+      }
+      let data = resp.data;
+      return data;
+   } catch(e) {
+      return {
+         status: "ERR",
+         message: e.message
+      };
+   }
+}
+
+export async function search_deliveries(prm) {
+   try {
+      var resp = await axios.post(URL + 'delivery/search_deliveries', prm);
+      if (resp.status != 200) {
+         return {
+            status: "ERR",
+            message: resp.statusText
+         };
+      }
+      let data = resp.data;
+      return data;
+   } catch(e) {
+      return {
+         status: "ERR",
+         message: e.message
+      };
+   }
+}
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/api/doctor.js b/test/vuex/one-fo-registration-walk-in-stemcell/api/doctor.js
new file mode 100644
index 0000000..6fbea85
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/api/doctor.js
@@ -0,0 +1,119 @@
+// API :
+// search bank
+// paramater : query , page , rowPerPage
+const URL =
+   "/one-api/mockup/fo/walk_in_registration_stemcell/";
+let doctor_search_token ={};
+
+
+export async function search(search) {
+   try {
+      var resp = await axios.post(URL + 'doctor/search', { search: search, token: window.one_token() });
+      if (resp.status != 200) {
+         return {
+            status: "ERR",
+            message: resp.statusText
+         };
+      }
+      let data = resp.data;
+      return data;
+   } catch(e) {
+      return {
+         status: "ERR",
+         message: e.message
+      };
+   }
+}
+
+export async function searchPj() {
+   try {
+      var resp = await axios.post(URL + 'doctor/search_pj', { token: window.one_token() });
+      if (resp.status != 200) {
+         return {
+            status: "ERR",
+            message: resp.statusText
+         };
+      }
+      let data = resp.data;
+      return data;
+   } catch(e) {
+      return {
+         status: "ERR",
+         message: e.message
+      };
+   }
+}
+/*
+export async function search_fpptype(search) {
+   try {
+      console.log("search indx fpp type")
+      //console.log("cdssdv ", fpptype_search_token.hasOwnProperty("token")?'ada':'tidak ada')
+       // Jika ada request sebelumnya, batalkan
+
+      console.log("search now fpp type")
+      // Buat token baru untuk request ini
+      //fpptype_search_token = axios.CancelToken.source();
+      var resp = await axios.post(URL + 'doctor/search_fpptype', {
+         search: search,
+         token: window.one_token()
+      });
+      
+      if (resp.status != 200) {
+         return {
+            status: "ERR",
+            message: resp.statusText
+         };
+      }
+      let data = resp.data;
+      return data;
+   } catch (e) {
+      return {
+         status: "ERR",
+         message: e.message
+      };
+   }
+}*/
+
+export async function search_fpptype(search) {
+   try {
+      var resp = await axios.post(URL + 'doctor/search_fpptype', {
+         search: search,
+         token: window.one_token()
+      });
+      if (resp.status != 200) {
+         return {
+            status: "ERR",
+            message: resp.statusText
+         };
+      }
+      let data = resp.data;
+      return data;
+   } catch(e) {
+      return {
+         status: "ERR",
+         message: e.message
+      };
+   }
+}
+
+export async function save(token, d) {
+    try {
+       var resp = await axios.post(URL + 'doctor/save', {
+          token: token,
+          data: d
+       });
+       if (resp.status != 200) {
+          return {
+             status: "ERR",
+             message: resp.statusText
+          };
+       }
+       let data = resp.data;
+       return data;
+    } catch(e) {
+       return {
+          status: "ERR",
+          message: e.message
+       };
+    }
+ }
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/api/doctor_new.js b/test/vuex/one-fo-registration-walk-in-stemcell/api/doctor_new.js
new file mode 100644
index 0000000..e69de29
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/api/history.js b/test/vuex/one-fo-registration-walk-in-stemcell/api/history.js
new file mode 100644
index 0000000..cd02991
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/api/history.js
@@ -0,0 +1,47 @@
+// API :
+// search bank
+// paramater : query , page , rowPerPage
+const URL =
+   "/one-api/mockup/fo/walk_in_registration_stemcell/";
+
+export async function search(patient_id) {
+   try {
+      var resp = await axios.post(URL + 'history/search', {
+         patient_id: patient_id
+      });
+      if (resp.status != 200) {
+         return {
+            status: "ERR",
+            message: resp.statusText
+         };
+      }
+      let data = resp.data;
+      return data;
+   } catch(e) {
+      return {
+         status: "ERR",
+         message: e.message
+      };
+   }
+}
+
+export async function get_databyorder_id(prm) {
+   try {
+      var resp = await axios.post(URL + 'history/get_databyorder_id', prm);
+      if (resp.status != 200) {
+         return {
+            status: "ERR",
+            message: resp.statusText
+         };
+      }
+      let data = resp.data;
+      return data;
+   } catch(e) {
+      return {
+         status: "ERR",
+         message: e.message
+      };
+   }
+}
+
+
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/api/language.js b/test/vuex/one-fo-registration-walk-in-stemcell/api/language.js
new file mode 100644
index 0000000..d2c36b4
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/api/language.js
@@ -0,0 +1,24 @@
+// API :
+// search bank
+// paramater : query , page , rowPerPage
+const URL =
+   "/one-api/mockup/fo/walk_in_registration_stemcell/";
+
+export async function search() {
+   try {
+      var resp = await axios.post(URL + 'language/search', { });
+      if (resp.status != 200) {
+         return {
+            status: "ERR",
+            message: resp.statusText
+         };
+      }
+      let data = resp.data;
+      return data;
+   } catch(e) {
+      return {
+         status: "ERR",
+         message: e.message
+      };
+   }
+}
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/api/order.js b/test/vuex/one-fo-registration-walk-in-stemcell/api/order.js
new file mode 100644
index 0000000..b5b4c6e
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/api/order.js
@@ -0,0 +1,205 @@
+// API :
+// search bank
+// paramater : query , page , rowPerPage
+const URL =
+   "/one-api/mockup/fo/walk_in_registration_stemcell/";
+
+let isSaving = false;
+
+export async function save(prm) {
+   if (isSaving) {
+      return {
+         status: "ERR",
+         message: "Save operation is already in progress"
+      }
+   }
+
+   isSaving = true;
+   try {
+      var resp = await axios.post(URL + 'order/save', prm);
+      isSaving = false;
+      return resp
+   } catch (e) {
+      isSaving = false;
+      return {
+         status: "ERR",
+         message: e.message
+      }
+   }
+}
+
+
+export async function lookupbarcodes(prm) {
+   try {
+       var resp = await axios.post(URL + 'order/lookup_barcodes', prm);
+       if (resp.status != 200) {
+           return {
+               status: "ERR",
+               message: resp.statusText
+           };
+       }
+       let data = resp.data;
+       return data;
+   } catch (e) {
+       return {
+           status: "ERR",
+           message: e.message
+       };
+   }
+}
+export async function load_from_clinic(queue) {
+   try {
+      var resp = await axios.post(URL + 'order/load_from_clinic', {
+         queue: queue
+      });
+
+      return resp
+   } catch (e) {
+      return {
+         status: "ERR",
+         message: e.message
+      }
+   }
+}
+
+
+export async function load_preregister(prm) {
+   try {
+      var resp = await axios.post(URL + 'order/load_preregister',prm);
+
+      return resp
+   } catch (e) {
+      return {
+         status: "ERR",
+         message: e.message
+      }
+   }
+}
+
+export async function load(id) {
+   try {
+      var resp = await axios.post(URL + 'order/load', {
+         id: id
+      });
+
+      return resp
+   } catch (e) {
+      return {
+         status: "ERR",
+         message: e.message
+      }
+   }
+}
+
+export async function patientSearch(noreg, search) {
+   try {
+      var resp = await axios.post(URL + 'patient/search', {
+         search: search,
+         noreg: noreg
+      });
+      if (resp.status != 200) {
+         return {
+            status: "ERR",
+            message: resp.statusText
+         };
+      }
+      let data = resp.data;
+      return data;
+   } catch(e) {
+      return {
+         status: "ERR",
+         message: e.message
+      };
+   }
+}
+export async function doctorSearch(search) {
+   try {
+      var resp = await axios.post(URL + 'doctor/search', {
+         search: search
+      });
+      if (resp.status != 200) {
+         return {
+            status: "ERR",
+            message: resp.statusText
+         };
+      }
+      let data = resp.data;
+      return data;
+   } catch(e) {
+      return {
+         status: "ERR",
+         message: e.message
+      };
+   }
+}
+export async function doctorSearchPj() {
+   try {
+      var resp = await axios.post(URL + 'doctor/search_pj', { });
+      if (resp.status != 200) {
+         return {
+            status: "ERR",
+            message: resp.statusText
+         };
+      }
+      let data = resp.data;
+      return data;
+   } catch(e) {
+      return {
+         status: "ERR",
+         message: e.message
+      };
+   }
+}
+
+export async function languageSearch() {
+   try {
+      var resp = await axios.post(URL + 'language/search', { });
+      if (resp.status != 200) {
+         return {
+            status: "ERR",
+            message: resp.statusText
+         };
+      }
+      let data = resp.data;
+      return data;
+   } catch(e) {
+      return {
+         status: "ERR",
+         message: e.message
+      };
+   }
+}
+
+export async function deliverySearch() {
+   try {
+      var resp = await axios.post(URL + 'delivery/search', { });
+      if (resp.status != 200) {
+         return {
+            status: "ERR",
+            message: resp.statusText
+         };
+      }
+      let data = resp.data;
+      return data;
+   } catch(e) {
+      return {
+         status: "ERR",
+         message: e.message
+      };
+   }
+}
+
+export async function get_time_start(prm) {
+   try {
+      var resp = await axios.post(URL + 'order/get_time_start', prm);
+
+      return resp
+   } catch (e) {
+      return {
+         status: "ERR",
+         message: e.message
+      }
+   }
+}
+
+
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/api/other.js b/test/vuex/one-fo-registration-walk-in-stemcell/api/other.js
new file mode 100644
index 0000000..e3b6e95
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/api/other.js
@@ -0,0 +1,133 @@
+// API :
+// search bank
+// paramater : query , page , rowPerPage
+const URL =
+   "/one-api/mockup/clinic/fo/";
+
+export async function search_sex(search) {
+   try {
+      var resp = await axios.post(URL + 'sex/search', {
+         search: search
+      });
+      if (resp.status != 200) {
+         return {
+            status: "ERR",
+            message: resp.statusText
+         };
+      }
+      let data = resp.data;
+      return data;
+   } catch(e) {
+      return {
+         status: "ERR",
+         message: e.message
+      };
+   }
+}
+
+export async function search_title(search, sex) {
+    try {
+       var resp = await axios.post('/one-api/mockup/fo/walk_in_registration/' + 'patient/get_titles', {
+          search: search,
+          sex_id: sex
+       });
+       if (resp.status != 200) {
+          return {
+             status: "ERR",
+             message: resp.statusText
+          };
+       }
+       let data = resp.data;
+       return data;
+    } catch(e) {
+       return {
+          status: "ERR",
+          message: e.message
+       };
+    }
+ }
+
+ export async function search_bank(search, card, edc) {
+    try {
+        if (card == null)
+            card = undefined
+       var resp = await axios.post("/one-api/mockup/fo/registration/" + 'bank/search', {
+          search: search,
+          card: card,
+          edc: edc
+       });
+       if (resp.status != 200) {
+          return {
+             status: "ERR",
+             message: resp.statusText
+          };
+       }
+       let data = resp.data;
+       return data;
+    } catch(e) {
+       return {
+          status: "ERR",
+          message: e.message
+       };
+    }
+ }
+
+ export async function search_accounts(search) {
+    try {
+       var resp = await axios.post("/one-api/mockup/fo/registration/" + 'bank/search_account', {
+          search: search
+       });
+       if (resp.status != 200) {
+          return {
+             status: "ERR",
+             message: resp.statusText
+          };
+       }
+       let data = resp.data;
+       return data;
+    } catch(e) {
+       return {
+          status: "ERR",
+          message: e.message
+       };
+    }
+ }
+
+ export async function search_religion(prm) {
+    try {
+       var resp = await axios.post("/one-api/mockup/fo/walk_in_registration/" + 'patient/get_religions', prm);
+       if (resp.status != 200) {
+          return {
+             status: "ERR",
+             message: resp.statusText
+          };
+       }
+       let data = resp.data;
+       return data;
+    } catch(e) {
+       return {
+          status: "ERR",
+          message: e.message
+       };
+    }
+ }
+
+
+ export async function get_titles(prm) {
+   try {
+      var resp = await axios.post("/one-api/mockup/fo/walk_in_registration/" + 'patient/get_titles', prm);
+      if (resp.status != 200) {
+         return {
+            status: "ERR",
+            message: resp.statusText
+         };
+      }
+      let data = resp.data;
+      return data;
+   } catch(e) {
+      return {
+         status: "ERR",
+         message: e.message
+      };
+   }
+}
\ No newline at end of file
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/api/patient.js b/test/vuex/one-fo-registration-walk-in-stemcell/api/patient.js
new file mode 100644
index 0000000..98f127b
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/api/patient.js
@@ -0,0 +1,263 @@
+// API :
+// search bank
+// paramater : query , page , rowPerPage
+const URL =
+   "/one-api/mockup/fo/walk_in_registration_stemcell/";
+
+export async function search(noreg, search, current_page) {
+   try {
+      var resp = await axios.post(URL + 'patient/search', {
+         search: search,
+         noreg: noreg,
+         current_page:current_page
+      });
+      if (resp.status != 200) {
+         return {
+            status: "ERR",
+            message: resp.statusText
+         };
+      }
+      let data = resp.data;
+      return data;
+   } catch(e) {
+      return {
+         status: "ERR",
+         message: e.message
+      };
+   }
+}
+
+export async function add_new(datas) {
+   try {
+      //sipe add token
+      datas["token"] = window.one_token();
+      var resp = await axios.post(URL + 'patient/add_new', datas);
+      if (resp.status != 200) {
+         return {
+            status: "ERR",
+            message: resp.statusText
+         };
+      }
+      let data = resp.data;
+      return data;
+   } catch(e) {
+      return {
+         status: "ERR",
+         message: e.message
+      };
+   }
+}
+
+export async function edit(datas, id) {
+    try {
+       //sipe add token
+       datas["token"] = window.one_token();
+       datas["id"] = id
+       var resp = await axios.post(URL + 'patient/edit', datas);
+       if (resp.status != 200) {
+          return {
+             status: "ERR",
+             message: resp.statusText
+          };
+       }
+       let data = resp.data;
+       return data;
+    } catch(e) {
+       return {
+          status: "ERR",
+          message: e.message
+       };
+    }
+ }
+
+   export async function search_idtype() {
+   try {
+      var resp = await axios.post(URL + 'patient/search_idtype', {token:window.one_token()});
+      if (resp.status != 200) {
+         return {
+            status: "ERR",
+            message: resp.statusText
+         };
+      }
+      let data = resp.data;
+      return data;
+   } catch(e) {
+      return {
+         status: "ERR",
+         message: e.message
+      };
+   }
+}
+
+   export async function searchregion(prm) {
+      try {
+         var resp = await axios.post(URL + 'patient/searchregion', {
+            search: prm,
+            token: window.one_token()
+         });
+         if (resp.status != 200) {
+            return {
+               status: "ERR",
+               message: resp.statusText
+            };
+         }
+         let data = resp.data;
+         return data;
+      } catch(e) {
+         return {
+            status: "ERR",
+            message: e.message
+         };
+      }
+   }
+
+   export async function search_countries(prm) {
+      try {
+         var resp = await axios.post(URL + 'patient/search_countries', {
+            search: prm,
+            token: window.one_token()
+         });
+         if (resp.status != 200) {
+            return {
+               status: "ERR",
+               message: resp.statusText
+            };
+         }
+         let data = resp.data;
+         return data;
+      } catch(e) {
+         return {
+            status: "ERR",
+            message: e.message
+         };
+      }
+   }
+
+   export async function search_corporate(prm) {
+      try {
+         var resp = await axios.post(URL + 'patient/search_corporate', {
+            search: prm,
+            token: window.one_token()
+         });
+         if (resp.status != 200) {
+            return {
+               status: "ERR",
+               message: resp.statusText
+            };
+         }
+         let data = resp.data;
+         return data;
+      } catch(e) {
+         return {
+            status: "ERR",
+            message: e.message
+         };
+      }
+   }
+
+   export async function search_blood_type(prm) {
+      try {
+         var resp = await axios.post(URL + 'patient/search_blood_type', {
+            search: prm,
+            token: window.one_token()
+         });
+         if (resp.status != 200) {
+            return {
+               status: "ERR",
+               message: resp.statusText
+            };
+         }
+         let data = resp.data;
+         return data;
+      } catch(e) {
+         return {
+            status: "ERR",
+            message: e.message
+         };
+      }
+   }
+
+   export async function search_blood_rh_type(prm) {
+      try {
+         var resp = await axios.post(URL + 'patient/search_blood_rh_type', {
+            search: prm,
+            token: window.one_token()
+         });
+         if (resp.status != 200) {
+            return {
+               status: "ERR",
+               message: resp.statusText
+            };
+         }
+         let data = resp.data;
+         return data;
+      } catch(e) {
+         return {
+            status: "ERR",
+            message: e.message
+         };
+      }
+   }
+
+   export async function search_education_type(prm) {
+      try {
+         var resp = await axios.post(URL + 'patient/search_education_type', {
+            search: prm,
+            token: window.one_token()
+         });
+         if (resp.status != 200) {
+            return {
+               status: "ERR",
+               message: resp.statusText
+            };
+         }
+         let data = resp.data;
+         return data;
+      } catch(e) {
+         return {
+            status: "ERR",
+            message: e.message
+         };
+      }
+   }
+
+   export async function search_etnic_type(prm) {
+      try {
+         var resp = await axios.post(URL + 'patient/search_etnic_type', {
+            search: prm,
+            token: window.one_token()
+         });
+         if (resp.status != 200) {
+            return {
+               status: "ERR",
+               message: resp.statusText
+            };
+         }
+         let data = resp.data;
+         return data;
+      } catch(e) {
+         return {
+            status: "ERR",
+            message: e.message
+         };
+      }
+   }
+
+   export async function search_icd10(prm) {
+      try {
+         var resp = await axios.post(URL + 'patient/search_icd10', prm);
+         if (resp.status != 200) {
+            return {
+               status: "ERR",
+               message: resp.statusText
+            };
+         }
+         let data = resp.data;
+         return data;
+      } catch(e) {
+         return {
+            status: "ERR",
+            message: e.message
+         };
+      }
+   }
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/api/patientaddress.js b/test/vuex/one-fo-registration-walk-in-stemcell/api/patientaddress.js
new file mode 100644
index 0000000..32edb0d
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/api/patientaddress.js
@@ -0,0 +1,26 @@
+// API :
+// search bank
+// paramater : query , page , rowPerPage
+const URL =
+   "/one-api/mockup/fo/walk_in_registration_stemcell/";
+
+export async function getAll(id) {
+   try {
+      var resp = await axios.post(URL + 'patientaddress/get_all', {
+         patient_id: id
+      });
+      if (resp.status != 200) {
+         return {
+            status: "ERR",
+            message: resp.statusText
+         };
+      }
+      let data = resp.data;
+      return data;
+   } catch(e) {
+      return {
+         status: "ERR",
+         message: e.message
+      };
+   }
+}
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/api/payment.js b/test/vuex/one-fo-registration-walk-in-stemcell/api/payment.js
new file mode 100644
index 0000000..30232c8
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/api/payment.js
@@ -0,0 +1,89 @@
+const URL = "/one-api/mockup/fo/walk_in_registration_stemcell/";
+
+export async function get_order(id) {
+   try {
+      var resp = await axios.post(URL + 'payment/get_order',{id:id});
+      if (resp.status != 200) {
+         return {
+            status: "ERR",
+            message: resp.statusText
+         };
+      }
+      let data = resp.data;
+      return data;
+   } catch(e) {
+      return {
+         status: "ERR",
+         message: e.message
+      };
+   }
+}
+
+export async function search(search) {
+   try {
+      var resp = await axios.post(URL + 'payment/search', {search:search});
+      if (resp.status != 200) {
+         return {
+            status: "ERR",
+            message: resp.statusText
+         };
+      }
+      let data = resp.data;
+      return data;
+   } catch(e) {
+      return {
+         status: "ERR",
+         message: e.message
+      };
+   }
+}
+
+export async function save(token, order_id, payments) {
+   try {
+      var resp = await axios.post(URL + 'payment/save', {
+         token: token,
+         order_id: order_id,
+         payments: payments
+      });
+
+      return resp
+   } catch (e) {
+      return {
+         status: "ERR",
+         message: e.message
+      }
+   }
+}
+
+
+export async function endshowtime(prm) {
+   try {
+      var resp = await axios.post(URL + 'order/endshowtime',prm);
+
+      return resp
+   } catch (e) {
+      return {
+         status: "ERR",
+         message: e.message
+      }
+   }
+}
+
+export async function get_details_order(prm) {
+   try {
+      var resp = await axios.post(URL + 'order/get_details_order', prm);
+      if (resp.status != 200) {
+         return {
+            status: "ERR",
+            message: resp.statusText
+         };
+      }
+      let data = resp.data;
+      return data;
+   } catch (e) {
+      return {
+         status: "ERR",
+         message: e.message
+      }
+   }
+}
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/api/photo.js b/test/vuex/one-fo-registration-walk-in-stemcell/api/photo.js
new file mode 100644
index 0000000..4a8a2bc
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/api/photo.js
@@ -0,0 +1,28 @@
+// API :
+// search bank
+// paramater : query , page , rowPerPage
+const URL =
+   "/one-api/mockup/fo/walk_in_registration_stemcell/";
+
+export async function upload(token, id, datas) {
+   try {
+      var resp = await axios.post(URL + 'photo/upload', {
+         token: token,
+         id: id,
+         data: datas
+      });
+      if (resp.status != 200) {
+         return {
+            status: "ERR",
+            message: resp.statusText
+         };
+      }
+      let data = resp.data;
+      return data;
+   } catch(e) {
+      return {
+         status: "ERR",
+         message: e.message
+      };
+   }
+}
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/api/px.js b/test/vuex/one-fo-registration-walk-in-stemcell/api/px.js
new file mode 100644
index 0000000..cfbd27f
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/api/px.js
@@ -0,0 +1,254 @@
+// API :
+// search bank
+// paramater : query , page , rowPerPage
+const URL =
+   "/one-api/mockup/fo/walk_in_registration_stemcell/";
+
+
+export async function search(mouCompanyID, search, token, project_id = 0) {
+   try {
+      var resp = await axios.post(URL + 'px/search_v2', {
+         search: search,
+         mouCompanyID: mouCompanyID,
+         project_id: project_id,
+         token: one_token()
+      },{
+         cancelToken: token
+      });
+
+      if (resp.status != 200) {
+         return {
+            status: "ERR",
+            message: resp.statusText
+         };
+      }
+
+      let data = resp.data;
+      return data;
+   } catch(e) {
+      return {
+         status: "ERR",
+         message: e.message
+      };
+   }
+}
+
+export async function panel(mouCompanyID,search) {
+   try {
+      var resp = await axios.post(URL + 'px/panel', {
+         search:search,
+         mouCompanyID:mouCompanyID
+      });
+      if (resp.status != 200) {
+         return {
+            status: "ERR",
+            message: resp.statusText
+         };
+      }
+      let data = resp.data;
+      return data;
+   } catch(e) {
+      return {
+         status: "ERR",
+         message: e.message
+      };
+   }
+}
+
+export async function packet_reqs(prm) {
+   try {
+      var resp = await axios.post(URL + 'px/packet_reqs',prm);
+      if (resp.status != 200) {
+         return {
+            status: "ERR",
+            message: resp.statusText
+         };
+      }
+      let data = resp.data;
+      return data;
+   } catch(e) {
+      return {
+         status: "ERR",
+         message: e.message
+      };
+   }
+}
+
+export async function profile(mou_id, search) {
+   try {
+      var resp = await axios.post(URL + 'px/profile', {
+         search: search,
+         mou_id: mou_id
+      });
+      if (resp.status != 200) {
+         return {
+            status: "ERR",
+            message: resp.statusText
+         };
+      }
+      let data = resp.data;
+      return data;
+   } catch(e) {
+      return {
+         status: "ERR",
+         message: e.message
+      };
+   }
+}
+
+export async function get_price(test_id, mou_id, cito) {
+   try {
+      var resp = await axios.post(URL + 'px/get_price', {
+         test_id:test_id,
+         mou_id:mou_id,
+         cito:cito
+      });
+
+      if (resp.status != 200) {
+         return {
+            status: "ERR",
+            message: resp.statusText
+         };
+      }
+
+      let data = resp.data;
+      return data;
+   } catch(e) {
+      return {
+         status: "ERR",
+         message: e.message
+      };
+   }
+}
+
+export async function appx_schedule(test_ids, panel_ids) {
+   try {
+      var resp = await axios.post(URL + 'px/get_appx_schedule', {
+         test_ids:test_ids,
+         panel_ids:panel_ids,
+         token:one_token()
+      });
+
+      if (resp.status != 200) {
+         return {
+            status: "ERR",
+            message: resp.statusText
+         };
+      }
+
+      let data = resp.data;
+      return data;
+   } catch(e) {
+      return {
+         status: "ERR",
+         message: e.message
+      };
+   }
+}
+
+export async function search_cito(token) {
+    try {
+       var resp = await axios.post(URL + 'px/search_cito', {
+          token:token
+       });
+       if (resp.status != 200) {
+          return {
+             status: "ERR",
+             message: resp.statusText
+          };
+       }
+       let data = resp.data;
+       return data;
+    } catch(e) {
+       return {
+          status: "ERR",
+          message: e.message
+       };
+    }
+ }
+
+ export async function search_pxs(mouCompanyID, id) {
+    try {
+       var resp = await axios.post(URL + 'px/search_v2', {
+          order_id:id,
+          mouCompanyID:mouCompanyID,
+          token: one_token()
+       });
+       if (resp.status != 200) {
+          return {
+             status: "ERR",
+             message: resp.statusText
+          };
+       }
+       let data = resp.data;
+       return data;
+    } catch(e) {
+       return {
+          status: "ERR",
+          message: e.message
+       };
+    }
+ }
+
+ export async function search_pxs_clinic(mouCompanyID, id) {
+    try {
+       var resp = await axios.post(URL + 'px/search', {
+          clinic_id:id,
+          mouCompanyID:mouCompanyID
+       });
+       if (resp.status != 200) {
+          return {
+             status: "ERR",
+             message: resp.statusText
+          };
+       }
+       let data = resp.data;
+       return data;
+    } catch(e) {
+       return {
+          status: "ERR",
+          message: e.message
+       };
+    }
+ }
+
+
+ export async function get_promise_by_pxs(prm) {
+   try {
+      var resp = await axios.post(URL + 'px/get_promise_by_pxs', prm);
+      if (resp.status != 200) {
+         return {
+            status: "ERR",
+            message: resp.statusText
+         };
+      }
+      let data = resp.data;
+      return data;
+   } catch(e) {
+      return {
+         status: "ERR",
+         message: e.message
+      };
+   }
+}
+
+export async function get_requirement(test_id) {
+   try {
+      var resp = await axios.post(URL + 'px/get_requirement', {
+         test_id: test_id
+      });
+      if (resp.status != 200) {
+         return {
+            status: "ERR",
+            message: resp.statusText
+         };
+      }
+      let data = resp.data;
+      return data;
+   } catch(e) {
+      return {
+         status: "ERR",
+         message: e.message
+      };
+   }
+}
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/api/reference.js b/test/vuex/one-fo-registration-walk-in-stemcell/api/reference.js
new file mode 100644
index 0000000..8175294
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/api/reference.js
@@ -0,0 +1,35 @@
+const URL = "/one-api/mockup/fo/walk_in_registration_stemcell/";
+
+export async function searchreference(search = "") {
+  try {
+    const resp = await axios.post(URL + "reference/searchreference", {
+      token: window.one_token(),
+      search: search || ""
+    });
+
+    if (resp.status !== 200) {
+      return { status: "ERR", message: resp.statusText };
+    }
+
+    return resp.data;
+  } catch (e) {
+    return { status: "ERR", message: e.message };
+  }
+}
+
+export async function searchordertype(search = "") {
+  try {
+    const resp = await axios.post(URL + "reference/searchordertype", {
+      token: window.one_token(),
+      search: search || ""
+    });
+
+    if (resp.status !== 200) {
+      return { status: "ERR", message: resp.statusText };
+    }
+
+    return resp.data;
+  } catch (e) {
+    return { status: "ERR", message: e.message };
+  }
+}
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/components/foRegisterFinishDialog.vue b/test/vuex/one-fo-registration-walk-in-stemcell/components/foRegisterFinishDialog.vue
new file mode 100644
index 0000000..cb79dbd
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/components/foRegisterFinishDialog.vue
@@ -0,0 +1,68 @@
+<template>
+  
+    <v-dialog
+      v-model="dialog"
+      full-width
+    >
+      <v-btn
+        color="blue"
+        slot="activator"
+        dark
+        block
+        @click="search"
+      >
+        Cari
+      </v-btn>
+
+      <v-card>
+        <v-card-title
+          class="headline grey lighten-2 pt-2 pb-2"
+          primary-title
+        >
+          Data Pasien
+        </v-card-title>
+        <v-card-text class="pt-2 pb-2">
+          <patient-search-result></patient-search-result>
+        </v-card-text>
+        <v-divider></v-divider>
+
+        <v-card-actions>
+          <v-spacer></v-spacer>
+          <v-btn
+            color="primary"
+            flat
+            @click="dialog = false"
+          >
+            Tutup
+          </v-btn>
+        </v-card-actions>
+      </v-card>
+    </v-dialog>
+  
+</template>
+
+<style scoped>
+</style>
+
+<script>
+module.exports = {
+    components : {
+        'patient-search-result': httpVueLoader('./patientSearchResult.vue')
+    },
+    methods : {
+       search: function() {
+          this.$store.dispatch('patient/search')
+       }
+    },
+    computed : {
+       dialog: {
+          get() {
+             return this.$store.state.patient.search_dialog_is_active;
+          },
+          set(val) {
+             this.$store.commit('patient/update_search_dialog_is_active',val);
+          }
+       }
+    }
+}
+</script>
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/components/oneDialogPhoto.vue b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneDialogPhoto.vue
new file mode 100644
index 0000000..721ea20
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneDialogPhoto.vue
@@ -0,0 +1,211 @@
+<template>
+    <v-dialog
+        v-model="dialog" 
+        :overlay="true"
+        
+        max-width="300px"
+        
+    >
+        <v-card>
+            <v-card-title primary-title class="headline grey lighten-2">
+                Ambil / Upload Foto
+            </v-card-title>
+
+            <v-card-text>
+                <v-layout row wrap>
+                    <v-flex xs12>
+                        <v-card fill-height flat>
+            
+                            <v-card-text class="pb-0">
+                                <v-card
+                                    class="photo_box"
+                                    id="photo_box"
+                                    elevation="24"
+                                >
+                                    <div class="photo_inside" id="photo_inside" v-show="camera">
+                                        asasdasd ads asd ad ad as da sd a das d sa das d ad as d as dsa ds ad asd sa das d asd as da sd sad as das das d asd sa das d sad as da sd
+                                    </div>
+
+                                    <div class="photo_inside" id="photo_inside_2" v-show="!camera">
+                                        <v-img
+                                        :src="imageUrl"
+                                        aspect-ratio="1.34"
+                                        class="grey lighten-2 elevation-2"
+                                        contain
+                                        >
+                                        <!-- <img :src="imageUrl" height="150" v-if="imageUrl"/> -->
+                                    </div>
+                                </v-card>
+                                <v-btn color="success" block @click="snap_photo" v-show="camera">Ambil Foto</v-btn>
+                                <v-btn color="orange" dark block @click="camera = true" v-show="!camera">Gunakan Kamera</v-btn>
+
+                                <v-divider>xxxx</v-divider>
+
+                                <v-flex xs12 class="text-xs-center">
+                                    atau
+                                </v-flex>
+                                <v-flex xs12 class="text-xs-center text-sm-center text-md-center text-lg-center">
+                                    
+                                    <v-text-field label="Pilih Gambar" hide-details @click='pickFile' v-model='imageName' prepend-icon='attach_file' class="mt-2"></v-text-field>
+                                    <input
+                                        type="file"
+                                        style="display: none"
+                                        ref="image"
+                                        accept="image/*"
+                                        @change="onFilePicked"
+                                    >
+                                </v-flex>
+
+                                <v-flex xs12>
+                                    <v-btn color="success" block @click="upload" :disabled="camera" :dark="!camera">Simpan</v-btn>
+                                </v-flex>
+                            </v-card-text>
+
+                        </v-card>
+                    </v-flex>
+                    
+                </v-layout>
+            </v-card-text>
+
+            <v-divider></v-divider>
+            <v-card-actions>
+                <v-spacer></v-spacer>
+                <v-btn
+                    color="primary"
+                    flat
+                    @click="dialog = false"
+                >
+                    Tutup
+                </v-btn>
+            </v-card-actions>
+
+        </v-card>
+        
+        
+    </v-dialog>
+</template>
+
+<style>
+.photo_box {
+    overflow-x: hidden;
+}
+
+.photo_inside {
+    /* position: absolute;
+    top: 0;
+    left: 0; */
+    width: 100%;
+    height: 100%;
+    overflow: hidden;
+}
+
+#photo_inside_2 {
+    min-height: 201px;
+}
+</style>
+
+<script>
+module.exports = {
+    data () {
+        return {
+            title: "Image Upload",
+            imageName: '',
+            imageUrl: '',
+            imageFile: '',
+            camera: true
+        }
+    },
+
+    computed : {
+        dialog : {
+            get () { return this.$store.state.photo.dialog_photo },
+            set (v) { this.$store.commit('photo/update_dialog_photo', v) }
+        }
+    },
+
+    methods : {
+        snap_photo() {
+            var str = this.$store
+            Webcam.snap(function(data_uri) {
+                // document.getElementById('photo_result').innerHTML = '<img src="'+data_uri+'"/>';
+                // console.log(data_uri)
+                str.commit('photo/update_photo_64', data_uri)
+                str.dispatch('photo/upload')
+            })
+            delete str
+        },
+
+        pickFile () {
+            this.$refs.image.click ()
+        },
+		
+		onFilePicked (e) {
+            this.camera = false
+            console.log(this.camera)
+			const files = e.target.files
+			if(files[0] !== undefined) {
+				this.imageName = files[0].name
+				if(this.imageName.lastIndexOf('.') <= 0) {
+					return
+				}
+				const fr = new FileReader ()
+				fr.readAsDataURL(files[0])
+				fr.addEventListener('load', () => {
+					this.imageUrl = fr.result
+					this.imageFile = files[0] // this is an image file that can be sent to server...
+                })
+                
+                
+			} else {
+				this.imageName = ''
+				this.imageFile = ''
+				this.imageUrl = ''
+			}
+        },
+        
+        upload () {
+            this.$store.commit('photo/update_photo_64', this.imageUrl)
+            this.$store.dispatch('photo/upload')
+        }
+    },
+
+    watch : {
+        dialog (n, o) {
+            if (n == true) {
+                this.camera = true
+                Webcam.set({
+                    width: 268,
+                    height: 201,
+                    image_format: 'jpeg',
+                    jpeg_quality: 90,
+                    dest_width: 640,
+                    dest_height: 480
+                });
+                Webcam.attach( '#photo_inside' );
+            } else {
+                Webcam.reset()
+            }
+        },
+
+        camera (n, o) {
+            if (n == true) {
+                this.imageName = ''
+				this.imageFile = ''
+                this.imageUrl = ''
+                
+                Webcam.set({
+                    width: 268,
+                    height: 201,
+                    image_format: 'jpeg',
+                    jpeg_quality: 90,
+                    dest_width: 640,
+                    dest_height: 480
+                });
+                Webcam.attach( '#photo_inside' );
+            } else {
+                Webcam.reset()
+            }
+        }
+    }
+}
+</script>
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/components/oneDialogPrint.vue b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneDialogPrint.vue
new file mode 100644
index 0000000..eb9371a
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneDialogPrint.vue
@@ -0,0 +1,69 @@
+<template>
+  
+    <v-dialog
+      v-model="dialog"
+      width="1000px"
+    >
+      
+
+      <v-card>
+        <v-card-title
+          class="headline grey lighten-2 pt-2 pb-2"
+          primary-title
+        >
+          Laporan
+        </v-card-title>
+        <v-card-text class="pt-2 pb-2">
+
+          <v-layout>
+              <v-flex xs12>
+                  <object :data="rpt_url"
+                    width="100%" height="512px"></object>
+              </v-flex>
+          </v-layout>
+          
+        </v-card-text>
+        <v-divider></v-divider>
+
+        <v-card-actions>
+          <v-spacer></v-spacer>
+
+          <v-btn
+            color="primary"
+            @click="dialog = false"
+            flat
+          >
+            Tutup
+          </v-btn>
+
+        </v-card-actions>
+      </v-card>
+    </v-dialog>
+  
+</template>
+
+<style scoped>
+</style>
+
+<script>
+module.exports = {
+    components : {
+    },
+    methods : {
+    },
+    computed : {
+       dialog: {
+          get() {
+             return this.$store.state.order.print_dialog_is_active;
+          },
+          set(val) {
+             this.$store.commit('order/update_print_dialog_is_active', val);
+          }
+       },
+
+       rpt_url () {
+         return this.$store.state.order.rpt_url
+       }
+    }
+}
+</script>
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFieldVerification.vue b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFieldVerification.vue
new file mode 100644
index 0000000..de36cd3
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFieldVerification.vue
@@ -0,0 +1,49 @@
+<template>
+   <v-flex class="pl-2">
+      <v-layout row>
+      <v-checkbox @change="checkedChange()"
+         :color="value.checked ? 'success' : 'warning' "
+         v-model="value.checked" hide-details class="shrink">
+      </v-checkbox>
+      <v-text-field
+         class="grow"
+         :label="value.label"
+         :placeholder="value.placeholder"
+         :background-color="value.checked ? 'success' : value.note == '' ? 'error' : 'warning' "
+         outline
+         :error-messages="value.is_error? value.error_message : ''"
+         :error="value.is_error"
+         v-model="value.note"
+         @input="noteChange()"
+         ></v-text-field>
+      </v-layout>
+   </v-flex>
+</template>
+
+<script>
+module.exports = {
+   props : ['value'],
+   methods : {
+      noteChange(note) {
+         if (! this.value.checked ) {
+            this.value.is_error = this.value.note.trim() == "" 
+         } else {
+            this.value.is_error = false
+            this.value.note = ""
+         }
+         this.$emit("input", this.value )
+      },
+      checkedChange() {
+         if (this.value.checked)  {
+            this.value.note = "";
+            this.value.is_error = false;
+         } else { 
+            this.value.is_error = (this.value.note.trim() == "" )
+         }
+         this.$emit("input", this.value)
+      }
+   },
+   computed : {
+   }
+}
+</script>
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegisterFinishDialog.vue b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegisterFinishDialog.vue
new file mode 100644
index 0000000..efb3040
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegisterFinishDialog.vue
@@ -0,0 +1,113 @@
+<template>
+  <v-dialog v-model="dialog" width="600" persistent>
+    <v-card>
+      <v-card-title class="headline grey lighten-2 pt-2 pb-2" primary-title>
+        Pendaftaran Berhasil
+      </v-card-title>
+      <v-card-text class="pt-2 pb-2">
+        <h6 class="display-1 text-center">
+          No Reg <span class="blue--text">{{ text_labno }}</span>
+        </h6>
+      </v-card-text>
+      <v-divider></v-divider>
+
+      <v-card-actions>
+        <v-spacer></v-spacer>
+        <v-btn color="info" flat @click="printQrcode"> Print Qrcode </v-btn>
+        <v-btn color="success" flat @click="printBarcode">
+          Print Barcode
+        </v-btn>
+        <v-btn color="warning"  @click="goToCashier"> Bayar </v-btn>
+        <v-btn color="primary" flat @click="finish"> Tutup </v-btn>
+      </v-card-actions>
+    </v-card>
+  </v-dialog>
+</template>
+
+<style scoped></style>
+
+<script>
+module.exports = {
+  components: {},
+  methods: {
+    finish: function () {
+      this.dialog = false;
+      this.$store.commit("order/update_tab_enable", [0, false]);
+      this.$store.commit("order/update_tab_enable", [1, false]);
+      let url_string = window.location.href
+      let url = new URL(url_string);
+      let pre_id = url.searchParams.get("pre_id")
+        this.$store.dispatch("payment/reset", {
+          order_id: this.$store.state.order.current_order.order_id,
+          time_start: this.$store.state.order.show_time,
+          type: 'walk_in',
+          url: this.xurl
+        });
+    },
+    goToCashier() {
+      this.$store.dispatch("payment/reset", {
+        order_id: this.$store.state.order.current_order.order_id,
+        time_start: this.$store.state.order.show_time,
+        type: 'pay',
+        url: this.xurl
+      });
+    },
+    printBarcode() {
+      one_print_barcode_formulir(this.text_labid);
+      this.$store.dispatch("order/getbarcode", {
+        id: this.text_labid,
+        no_lab: this.text_labno,
+        name: this.text_labname,
+        register_date: this.text_labdate,
+      });
+    },
+    printQrcode() {
+      let inp = {};
+      inp.id = this.text_labid;
+      inp.no_lab = this.text_labno;
+      inp.name = this.text_labname;
+      inp.register_date = this.text_labdate;
+      inp.uuid = this.uuid;
+      inp.form_code = this.$store.state.order.form_code;
+      inp.url_qrform = this.$store.state.order.url_qrform;
+      one_print_qrcode_form(inp);
+      one_print_qrcode(inp);
+      one_print_qrcode_patient(inp);
+    },
+  },
+  computed: {
+    dialog: {
+      get() {
+        return this.$store.state.order.finish_dialog_is_active;
+      },
+      set(val) {
+        this.$store.commit("order/update_finish_dialog_is_active", val);
+      },
+    },
+    text_labno() {
+      return this.$store.state.order.current_order.noreg;
+    },
+    text_labid() {
+      return this.$store.state.order.current_order.order_id;
+    },
+    text_labname() {
+      return this.$store.state.order.current_order.order_header.patient_name;
+    },
+    text_labdate() {
+      return this.$store.state.order.current_order.order_header.order_date;
+    },
+    xurl() {
+      return this.$store.state.order.current_order.url;
+    },
+    uuid() {
+      return this.$store.state.order.uuid;
+    },
+    form_code() {
+      return this.$store.state.order.form_code;
+    },
+    url_qrform() {
+      return this.$store.state.order.url_qrform;
+    },
+  },
+};
+</script>
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegistrationCompany.vue b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegistrationCompany.vue
new file mode 100644
index 0000000..b0cd7d3
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegistrationCompany.vue
@@ -0,0 +1,347 @@
+<template>
+   <div>
+      <v-layout column pb-2>
+         <v-card class="pa-1 mb-2" height="100%">
+            <v-layout align-center row>
+               <v-flex xs12>
+                  <v-card tile class="pa-2" flat color="#64b2cd">
+                     <h5 style="color:#fff" class="subtitle-1 font-weight-bold">PROYEK DAN FISIK TEMPLATE DAN AGREEMENT</h5>
+                  </v-card>
+               </v-flex>
+            </v-layout>
+            <v-layout row>
+               <v-flex  xs6 class="pa-2">
+                     <v-autocomplete
+                        label="Proyek"
+                        v-model="selected_project"
+                        :items="projects"
+                        :search-input.sync="search_project"
+                        auto-select-first
+                        style="font-size:12px;padding:4px 0"
+                        no-filter
+                        :readonly="isHavingTest"
+                        return-object
+                        clearable
+                        :item-text="item => item.code + ' - ' + item.label"
+                        :loading="is_loading_project"
+                        color="primary"
+                        no-data-text="Pilih Proyek"
+                        hide-details
+                        >
+                     </v-autocomplete>
+               </v-flex>
+               <v-flex  xs6 class="pa-2">
+                  <v-autocomplete
+                     label="Fisik Template"
+                     v-model="selected_fisik_template"
+                     :items="fisik_templates"
+                     :search-input.sync="search_fisik_template"
+                     auto-select-first
+                     style="font-size:12px;padding:4px 0"
+                     :readonly="!_.isEmpty(selected_project) || isHavingTest"
+                     no-filter
+                     return-object
+                     :clearable="_.isEmpty(selected_project)"
+                     :item-text="item => item.fisik_template_label"
+                     :loading="is_loading_fisik_template"
+                     color="primary"
+                     no-data-text="Pilih Fisik Template"
+                     hide-details
+                     >
+                  </v-autocomplete>
+               </v-flex>
+            </v-layout>
+         </v-card>
+         <v-card class="pa-1 mb-0" >
+            <v-layout align-center row>
+               <v-flex xs12>
+                  <v-card tile class="pa-2" flat color="#64b2cd">
+                     <h5 style="color:#fff" class="subtitle-1 font-weight-bold">KEL. PELANGGAN DAN AGREEMENT</h5>
+                  </v-card>
+               </v-flex>
+            </v-layout>
+            <v-layout v-if="!_.isEmpty(selected_project)" class="pb-2" row>
+               <v-flex pt-1 pl-2 pr-1 xs6>
+                  <v-text-field
+                     label="Kel. Pelanggan"
+                     :value="selected_company.CorporateName"
+                     readonly
+                     hide-details
+                     style="font-size:12px;"
+                  ></v-text-field>
+               </v-flex>
+               <v-flex pt-1 pl-2 pr-1 xs6>
+                  <v-text-field
+                     label="Agreement"
+                     :value="selected_mou.price_header_name"
+                     readonly
+                     hide-details
+                     style="font-size:12px;"
+                  ></v-text-field>
+               </v-flex>
+            </v-layout>
+            <v-layout v-if="_.isEmpty(selected_project)" row>
+               <v-flex  pt-1 pl-2 pr-1 xs6>
+                  <v-autocomplete
+                     label="Kel. Pelanggan"
+                     v-model="selected_company"
+                     :items="companies"
+                     style="font-size:12px;"
+                     :search-input.sync="search"
+                     :readonly="isHavingTest"
+                     auto-select-first
+                     no-filter
+                     hide-details
+                     return-object
+               
+                     item-text="CorporateName"
+                     :loading="is_loading"
+                     color="primary"
+                     no-data-text="Pilih Kel. Pelanggan"
+                     >
+                     <template
+                        slot="item"
+                        slot-scope="{ item }"
+                        >
+                        <v-list-tile-content>
+                           <v-list-tile-title v-text="item.CorporateName"></v-list-tile-title>
+                        <v-list-tile-sub-title v-text="getMou(item)"></v-list-tile-sub-title>
+                        </v-list-tile-content>
+                     </template>
+
+                  </v-autocomplete>
+               </v-flex>
+               <v-flex  pt-1 pl-1 pr-2 xs6>
+                  <v-select
+                     v-model="selected_mou"
+                     :items="company_mou"
+                     :readonly="isHavingTest"
+                     style="font-size:12px;"
+                     auto-select-first
+                     item-text = "price_header_name"
+                     return-object
+                     label="Agreement"
+                     hide-details
+                     class="mb-1"
+                     >
+                     <template
+                        slot="item"
+                        slot-scope="{ item }"
+                        >
+                        <v-list-tile-content>
+                           <v-list-tile-title v-text="item.price_header_name"></v-list-tile-title>
+                        <v-list-tile-sub-title v-text="getMouDate(item)"></v-list-tile-sub-title>
+                        </v-list-tile-content>
+                     </template>
+                  </v-select>
+               
+               </v-flex>
+            </v-layout>
+            <v-layout v-if="selected_mou_note.length > 0" mt-1 pt-1 pl-2 pr-2 style="border:1px dashed #64b2cd" row>
+               <v-flex xs12>
+                  <p class="mb-1"><kbd style="background:#ec4d4d">Catatan :</kbd></p>
+                  <p v-for="(note, n) in selected_mou_note" v-bind:key="n" class="mb-1 caption">{{ note }}</p>
+               </v-flex>
+            </v-layout>
+            
+         </v-card>
+      </v-layout>
+   </div>
+</template>
+
+<style scoped>
+</style>
+<script>
+module.exports = {
+   computed: {
+      is_loading_fisik_template(){
+         return this.$store.state.company.is_loading_fisik_template === true || this.$store.state.company.is_loading_fisik_template === 1
+      },
+      fisik_templates: {
+         get(){
+            return this.$store.state.company.fisik_templates
+         },
+         set(val){
+            this.$store.commit('company/update_fisik_templates',val)
+         }
+      },
+      selected_fisik_template:{
+         get(){
+            return this.$store.state.company.selected_fisik_template
+         },
+         set(val){
+            this.$store.commit('company/update_selected_fisik_template',val)
+         }
+      },
+      is_loading_project(){
+         return this.$store.state.company.is_loading_project === true || this.$store.state.company.is_loading_project === 1
+      },
+      projects(){
+         return this.$store.state.company.projects
+      },
+      selected_project:{
+         get(){
+            return this.$store.state.company.selected_project
+         },
+         set(val){
+            this.$store.commit('company/update_selected_project',val)
+            if(val && !_.isEmpty(val)){
+               this.search_fisik_template = val.fisik_mapping_label;
+               this.selected_fisik_template = {fisik_template_label:val.fisik_mapping_label,fisik_template_id:val.fisik_mapping_id}
+               this.selected_company = {CorporateName:val.CorporateName,CorporateID:val.CorporateID,corporate_prices:val.corporate_prices}
+               this.companies = [this.selected_company]
+            }else{
+               this.search_fisik_template = ''
+               this.selected_fisik_template = {}
+               this.selected_company = {}
+               this.companies = []
+            }
+         }
+      },
+      order_companies(){
+         return this.$store.state.company.order_companies
+      },
+      show_doctor_alert(){
+         return  this.$store.state.doctor.show_doctor_alert
+      },
+      search:{
+         get(){
+            return this.$store.state.company.search
+         },
+         set(val)  {
+            if (val == null) return
+            this.$store.commit('company/update_search',val)
+         }
+      },
+      isHavingTest() {
+         return this.$store.state.px.selected_test.length > 0 ||
+            this.$store.state.px.selected_panel.length > 0
+      },
+      selected_mou: {
+         get() {
+            return this.$store.state.company.selected_mou
+         },
+         set(val) {
+            this.$store.commit("px/update_tests",{records:[],total:0})
+            this.$store.commit("company/update_selected_mou", val)  
+            if(val && !_.isEmpty(val)){
+               console.log('in not empty');
+               console.log('mulai cari px dari mou');
+               this.$store.dispatch('px/search');
+            }else{
+               console.log('in empty');
+               this.$store.commit("px/update_tests",{records:[],total:0})
+            }
+         }
+      },
+      selected_company: {
+         get() {
+            return this.$store.state.company.selected_company
+         },
+         set(val) {
+            this.$store.commit("company/update_selected_company", val)
+            this.$store.dispatch('delivery/search_deliveries',{type:'company',id:val.CorporateID})
+            console.log(val);
+            if(val && !_.isEmpty(val)){
+               this.$store.commit("px/update_tests",{records:[],total:0})
+               if(val.corporate_prices.length > 0){
+                  let prices = val.corporate_prices;
+                  let _this = this;
+                  prices.forEach(function(price){
+                     if(price.is_default == 'Y'){
+                        _this.selected_mou = price;
+                        console.log('selected_mou_default', _this.selected_mou);
+                     
+                        
+                     }
+                  });
+               }else{
+                  this.$store.commit("px/update_tests",{records:[],total:0})
+               }
+            }else{
+               this.$store.commit("px/update_tests",{records:[],total:0})
+            }
+            
+            
+         }
+      },
+      company_mou() {
+         if (! this.$store.state.company.selected_company) return []
+         if (! this.$store.state.company.selected_company.corporate_prices) return []
+         return this.$store.state.company.selected_company.corporate_prices
+      },
+
+      companies() {
+         return this.$store.state.company.companies
+      },
+      is_loading() {
+         return this.$store.state.company.search_status == 1
+      },
+
+        selected_mou_note() {
+            let x = this.selected_mou
+            if (!x)
+                return []
+            if (!x.note)
+                return []
+
+            return x.note.split(/\n/)
+        }
+   },
+   methods: {
+      getMouDate(item) {
+         return item.corporate_price_start_date + ' s/d ' + item.corporate_price_end_date
+      },
+      getMou(item) {
+         if (!item) return ''
+         if (!item.corporate_prices) return ''
+         let s_mou = ''
+         item.corporate_prices.forEach( function(price,idx) {
+            if (s_mou!='') s_mou += ', '
+            s_mou += price.price_header_name
+         });
+         return s_mou
+      },
+      thr_search: _.debounce( function () {
+         this.$store.dispatch("company/search")
+      }, 200),
+      thr_search_project: _.debounce( function () {
+         this.$store.dispatch("company/search_project",{search:this.search_project})
+      }, 200),
+      thr_search_fisik_template: _.debounce( function () {
+         this.$store.dispatch("company/search_fisik_template",{search:this.search_fisik_template})
+      }, 200)
+   },
+   watch: {
+      search(val,old) {
+         if (this.$store.state.order.is_from_clinic)
+            return
+         if (val == null || typeof val == 'undefined') val = ""
+         if (val == old ) return
+         if (this.$store.state.company.search_status == 1 ) return  
+         this.$store.commit("company/update_search",val)
+         this.thr_search()
+      },
+      search_project(val,old) {
+         if (this.$store.state.order.is_from_clinic)
+            return
+         if (val == null || typeof val == 'undefined') val = ""
+         if (val == old ) return
+         if (this.$store.state.company.is_loading_project == true ) return  
+         this.thr_search_project()
+      }
+   },
+   data: function() {
+      return {
+         search_project: '',
+         search_fisik_template: ''
+         // search : ''
+      }
+   },
+
+   mounted () {
+      this.$store.dispatch('company/search_fisik_template',{search:''})
+     // this.$store.dispatch('company/search_default')
+   }
+}
+</script>
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegistrationCompany.vue-- b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegistrationCompany.vue--
new file mode 100644
index 0000000..b007690
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegistrationCompany.vue--
@@ -0,0 +1,224 @@
+<template>
+   <v-layout column pb-2>
+      <v-card class="pa-1 mb-0" >
+         <v-layout align-center row>
+            <v-flex xs12>
+               <v-card tile class="pa-2" flat color="#64b2cd">
+                  <h5 style="color:#fff" class="subtitle-1 font-weight-bold">KEL. PELANGGAN DAN AGREEMENT</h5>
+               </v-card>
+            </v-flex>
+         </v-layout>
+         <v-layout row>
+            <v-flex  pt-1 pl-2 pr-1 xs6>
+               <v-autocomplete
+                  label="Kel. Pelanggan"
+                  v-model="selected_company"
+                  :items="companies"
+                  style="font-size:12px;"
+                  :search-input.sync="search"
+                  :readonly="isHavingTest"
+                  auto-select-first
+                  no-filter
+                  hide-details
+                  return-object
+                  :clearable="! isHavingTest"
+                  item-text="M_CompanyName"
+                  :loading="is_loading"
+                  no-data-text="Pilih Company"
+                  >
+                  <template
+                     slot="item"
+                     slot-scope="{ item }"
+                     >
+                     <v-list-tile-content>
+                        <v-list-tile-title v-text="item.M_CompanyName"></v-list-tile-title>
+                     <v-list-tile-sub-title v-text="getMou(item)"></v-list-tile-sub-title>
+                     </v-list-tile-content>
+                  </template>
+
+               </v-autocomplete>
+            </v-flex>
+            <v-flex  pt-1 pl-1 pr-2 xs6>
+               <v-select
+                  v-model="selected_mou"
+                  :items="company_mou"
+                  :readonly="isHavingTest"
+                  style="font-size:12px;"
+                  auto-select-first
+                  item-text = "M_MouName"
+                  return-object
+                  label="Agreement"
+                  hide-details
+                  class="mb-1"
+                  >
+                  <template
+                     slot="item"
+                     slot-scope="{ item }"
+                     >
+                     <v-list-tile-content>
+                        <v-list-tile-title v-text="item.M_MouName"></v-list-tile-title>
+                     <v-list-tile-sub-title v-text="getMouDate(item)"></v-list-tile-sub-title>
+                     </v-list-tile-content>
+                  </template>
+               </v-select>
+              
+            </v-flex>
+         </v-layout>
+         <v-layout v-if="selected_mou_note.length > 0" mt-1 pt-1 pl-2 pr-2 style="border:1px dashed #64b2cd" row>
+            <v-flex xs12>
+               <p class="mb-1"><kbd style="background:#ec4d4d">Catatan :</kbd></p>
+               <p v-for="(note, n) in selected_mou_note" v-bind:key="n" class="mb-1 caption">{{ note }}</p>
+            </v-flex>
+         </v-layout>
+         <v-layout v-if="show_doctor_alert" mt-1 pt-1 pl-2 pr-2 row>
+            <v-flex xs12>
+               <p style="background:#ee7777;color:#fff" class="caption pl-2 pr-2 pt-1 pb-1 mb-1">Dokter belum dipilih, jangan lupa ya</p>
+            </v-flex>
+         </v-layout>
+      </v-card>
+   </v-layout>
+</template>
+
+<style scoped>
+</style>
+<script>
+module.exports = {
+   computed: {
+      show_doctor_alert(){
+         return  this.$store.state.doctor.show_doctor_alert
+      },
+      search:{
+         get(){
+            return this.$store.state.company.search
+         },
+         set(val)  {
+            if (val == null) return
+            this.$store.commit('company/update_search',val)
+         }
+      },
+      isHavingTest() {
+         return this.$store.state.px.selected_test.length > 0 ||
+            this.$store.state.px.selected_panel.length > 0
+      },
+      selected_mou: {
+            get() {
+                return this.$store.state.company.selected_mou
+            },
+
+            set(val) {
+                this.$store.commit("company/update_selected_mou", val)
+               var doctor = this.$store.state.doctor.selected_doctor
+                var company = this.$store.state.company.selected_company
+            var alias_doctor = this.$store.state.doctor.doctor_alias
+            if(doctor){
+               if(doctor.M_DoctorName.trim() === '-' && alias_doctor === '' && company.M_CompanyName !== 'PASIEN MANDIRI'){
+                  this.$store.commit('doctor/update_show_doctor_alert', true)
+               }
+               else{
+                this.$store.commit('doctor/update_show_doctor_alert', false)
+               }
+            }
+            else{
+                this.$store.commit('doctor/update_show_doctor_alert', true)
+            }
+                // Auto CHECKED
+                let dlv = this.$store.state.delivery.checked_id
+                let cmou = val
+                
+               this.$store.dispatch('delivery/search_deliveries',{type:'mou',id:val.M_MouID})
+
+                // Search Test
+                this.$store.dispatch('px/search')
+            }
+      },
+      selected_company: {
+         get() {
+            return this.$store.state.company.selected_company
+         },
+         set(val) {
+            this.$store.commit("company/update_selected_company", val)
+            for (let i in val.mou)
+                if (val.mou[i].M_MouIsDefault == 'Y'){
+                   this.$store.commit('company/update_selected_mou', val.mou[i])
+                   this.$store.dispatch('delivery/search_deliveries',{type:'mou',id:val.mou[i].M_MouID})
+                   console.log("mulai cari px")
+                   this.$store.dispatch('px/search')
+                }
+            var doctor = this.$store.state.doctor.selected_doctor
+            var alias_doctor = this.$store.state.doctor.doctor_alias
+            if(doctor){
+               if(doctor.M_DoctorName.trim() === '-' && alias_doctor === '' && val.M_CompanyName !== 'PASIEN MANDIRI'){
+                  this.$store.commit('doctor/update_show_doctor_alert', true)
+               }
+               else{
+                this.$store.commit('doctor/update_show_doctor_alert', false)
+               }
+            }
+            else{
+                this.$store.commit('doctor/update_show_doctor_alert', true)
+            }
+         }
+      },
+      company_mou() {
+         if (! this.$store.state.company.selected_company) return []
+         if (! this.$store.state.company.selected_company.mou) return []
+         return this.$store.state.company.selected_company.mou
+      },
+
+      companies() {
+         return this.$store.state.company.companies
+      },
+      is_loading() {
+         return this.$store.state.company.search_status == 1
+      },
+
+        selected_mou_note() {
+            let x = this.selected_mou
+            if (!x)
+                return []
+            if (!x.M_MouNote)
+                return []
+
+            return x.M_MouNote.split(/\n/)
+        }
+   },
+   methods: {
+      getMouDate(item) {
+         return item.M_MouStartDate + ' s/d ' + item.M_MouEndDate
+      },
+      getMou(item) {
+         if (!item) return ''
+         if (!item.mou) return ''
+         let s_mou = ''
+         item.mou.forEach( function(mou,idx) {
+            if (s_mou!='') s_mou += ', '
+            s_mou += mou.M_MouName
+         });
+         return s_mou
+      },
+      thr_search: _.debounce( function () {
+         this.$store.dispatch("company/search")
+      }, 700)
+   },
+   watch: {
+      search(val,old) {
+         if (this.$store.state.order.is_from_clinic)
+            return
+         if (val == null || typeof val == 'undefined') val = ""
+         if (val == old ) return
+         if (this.$store.state.company.search_status == 1 ) return  
+         this.$store.commit("company/update_search",val)
+         this.thr_search()
+      }
+   },
+   data: function() {
+      return {
+         // search : ''
+      }
+   },
+
+   mounted () {
+      this.$store.dispatch('company/search_default')
+   }
+}
+</script>
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegistrationDetailOrder.vue b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegistrationDetailOrder.vue
new file mode 100644
index 0000000..8227e83
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegistrationDetailOrder.vue
@@ -0,0 +1,341 @@
+<template>
+   <v-layout column pb-2>
+      <!--<one-fo-registration-patient-order></one-fo-registration-patient-order>-->
+     <v-flex xs12>
+      <v-card>
+         <v-layout row>
+            <v-flex md6>
+               <v-layout row pl-2>
+                     <v-flex md5>
+                        <div class="font-weight-bold text-fajrihm">No Reg</div>
+                     </v-flex>
+                     <v-flex md7>
+                        <div class="font-weight-regular text-fajrihm text-md-right">{{ selected_order.order_no }}</div>
+                     </v-flex>
+               </v-layout>
+               <v-layout row pl-2>
+                     <v-flex md5>
+                        <div class="font-weight-bold text-fajrihm">Tangal Periksa</div>
+                     </v-flex>
+                     <v-flex md7>
+                        <div class="font-weight-regular text-fajrihm text-md-right">{{ selected_order.order_date }}</div>
+                     </v-flex>
+               </v-layout>
+            </v-flex>
+            <v-flex md6>
+               <v-layout row pl-2>
+                     <v-flex md5>
+                        <div class="font-weight-bold text-fajrihm">PID</div>
+                     </v-flex>
+                     <v-flex md7>
+                        <div class="font-weight-regular text-fajrihm text-md-right">{{ selected_order.patient_mr }}</div>
+                     </v-flex>
+               </v-layout>
+               <v-layout row pl-2>
+                     <v-flex md5>
+                        <div class="font-weight-bold text-fajrihm">Nama Pasien</div>
+                     </v-flex>
+                     <v-flex md7>
+                        <div class="font-weight-regular text-fajrihm text-md-right">{{ selected_order.patient_name }}</div>
+                     </v-flex>
+               </v-layout>
+            </v-flex>
+         </v-layout>
+         <v-layout row>
+            <v-flex md6>
+               <v-layout row pl-2>
+                     <v-flex md5>
+                        <div class="font-weight-bold text-fajrihm">Kel. Pelanggan</div>
+                     </v-flex>
+                     <v-flex md7>
+                        <div class="font-weight-regular text-fajrihm text-md-right">{{ selected_order.order_company }}</div>
+                     </v-flex>
+               </v-layout>
+            </v-flex>
+            <v-flex md6>
+               <v-layout row pl-2>
+                     <v-flex md5>
+                        <div class="font-weight-bold text-fajrihm">Agreement</div>
+                     </v-flex>
+                     <v-flex md7>
+                        <div class="font-weight-regular text-fajrihm text-md-right">{{ selected_order.order_mou }}</div>
+                     </v-flex>
+               </v-layout>
+            </v-flex>
+         </v-layout>
+         <v-layout row mb-2>
+            <v-flex md6>
+               <v-layout row pl-2>
+                     <v-flex md5>
+                        <div class="font-weight-bold text-fajrihm">Pengirim</div>
+                     </v-flex>
+                     <v-flex md7>
+                        <div class="font-weight-regular text-fajrihm text-md-right">{{ selected_order.doctor_sender }}</div>
+                     </v-flex>
+               </v-layout>
+            </v-flex>
+            <v-flex md6>
+               <v-layout row pl-2>
+                     <v-flex md5>
+                        <div class="font-weight-bold text-fajrihm">Alamat Pengirim</div>
+                     </v-flex>
+                     <v-flex md7>
+                        <div class="font-weight-regular text-fajrihm text-md-right">{{ selected_order.doctor_sender_address }}</div>
+                     </v-flex>
+               </v-layout>
+            </v-flex>
+         </v-layout>
+         <v-layout style="border-top:1px dashed rgb(221,221,221)" row mt-1 mb-1></v-layout>
+         <v-layout row mb-2 wrap>
+            <v-flex v-for="(dlv, n) in order_delivery" xs6 v-bind:key="n">
+               <v-layout row wrap pl-2>
+                     <v-flex xs12 class="text-delivery text-xs-right">
+                        <p class="mb-1">{{ dlv.label }} : {{ dlv.description }}</p>
+                        <p class="mb-1 mono red--text caption">catatan : <span v-if="dlv.note === ''">-</span> <span v-if="dlv.note !== ''">{{ dlv.note }}</span></p>
+                     </v-flex>
+               </v-layout>
+            </v-flex>
+         </v-layout>
+         <v-layout row mb-2 wrap>
+            <v-flex xs12>
+               <v-layout row wrap pl-2>
+                  <v-flex xs12>
+                     <div class="font-weight-bold text-fajrihm">Janji Hasil</div>
+                  </v-flex>
+               </v-layout>
+               <v-layout row wrap pl-2>
+                  <v-flex xs12 v-for="p in promises" >
+                     <div class="font-weight-bold text-fajrihm">{{ p.T_OrderPromiseDateTime_ina }}</div>
+                  </v-flex>
+               </v-layout>
+            </v-flex>
+         </v-layout>
+         <v-layout style="border-top:1px dashed rgb(221,221,221)" row mt-1 mb-1></v-layout>
+         <v-layout row pa-2>
+            <v-flex xs12>
+
+               <table>
+                     <tr style="background:#ffeaa5">
+                     
+                     <th style="width:42%;font-weight:bold;font-size:12px;" class="text-md-center pt-2 pb-2">PEMERIKSAAN</th>
+                     <th style="width:12%;font-weight:bold;font-size:12px;" class="text-md-center pt-2 pb-2">BRUTO</th>
+                     <th style="width:12%;font-weight:bold;font-size:12px;" class="text-md-center pt-2 pb-2">DISKON</th>
+                     <th style="width:12%;font-weight:bold;font-size:12px;" class="text-md-center pt-2 pb-2">TOTAL</th>
+                     </tr>
+                  
+                     <tr style="font-size:12px" v-for="t in selected_test" v-bind:key="t.T_OrderDetailID">
+      
+                     <td class="text-md-left pl-3">
+                        <p class="mb-1">{{ t.T_OrderDetailT_TestName}}</p>
+                        <!----<p class="mb-0 caption" v-show="child_test_show(t)">{{child_test(t.child_test)}}</p>-->
+                     </td>
+                     <td class="text-md-right mono pr-2">{{ one_money(t.T_OrderDetailPrice) }}</td>
+                     <td class="text-md-right mono pr-2">{{ one_money(t.T_OrderDetailDiscTotal)  }}</td>
+                     <td class="text-md-right mono font-weight-black pr-2">{{ one_money(t.T_OrderDetailTotal) }}</td>
+                     </tr>
+
+                     
+               
+                     <!--/ TEST PANEL -->
+
+                     <tfoot>
+                     <tr>
+                        <th style="background:#e16262;color:#fff"  class="text-md-left pl-3 pt-2 pb-2">TOTAL</th>
+                        <th style="background:#e16262;color:#fff" class="text-md-right pr-2 pt-2 pb-2">{{ one_money(bruto_total)  }}</th>
+                        <th style="background:#e16262;color:#fff" class="text-md-right pr-2 pt-2 pb-2">{{ one_money(diskon_total)  }}</th>
+                        <th style="background:#e16262;color:#fff" class="text-md-right pr-2 pt-2 pb-2" >{{ one_money(sub_total)  }}</th>
+                     </tr>
+                     
+                     </tfoot>
+               </table>
+            </v-flex>
+         </v-layout>
+         <v-layout style="border-top:1px dashed rgb(221,221,221)" row mt-2 mb-2></v-layout>
+      </v-card>
+     </v-flex>
+     
+   </v-layout>
+</template>
+
+<style scoped>
+
+.v-input--selection-controls {
+    margin-top: 0px;
+    padding-top: 0px;
+}
+.text-fajrihm{
+    padding: 3px 20px 3px 0;
+    text-align:left;
+    font-size: 13px;
+    font-family: open sans, tahoma, sans-serif;
+}
+
+.label-delivery{
+     font-size: 11px;
+     padding: 3px 20px 3px 0;
+     font-family: open sans, tahoma, sans-serif;
+}
+.text-delivery{
+     font-size: 12px;
+     padding: 3px 20px 3px 0;
+     font-family: open sans, tahoma, sans-serif;
+}
+
+.nota {
+   font-size: 2em;
+   font-weight: bold;
+   text-align: left;
+}
+.total {
+   min-height:76px;
+}
+table {
+   font-family: arial, sans-serif;
+   border-collapse: collapse;
+   width: 100%;
+   background:white;
+   border: 0px;
+}
+
+th, td {
+   border: 1px solid black;
+   border-collapse: collapse;
+   padding-top: 2px;
+   padding-bottom: 2px;
+}
+table>tr>td {
+   padding: 8px;
+}
+table>tr>td:first {
+   padding-left:15px!important;
+}
+.nota {
+   font-size: 2em;
+   font-weight: bold;
+   text-align: left;
+}
+.total {
+   min-height:76px;
+}
+table {
+   font-family: arial, sans-serif;
+   border-collapse: collapse;
+   width: 100%;
+   background:white;
+   border: 0px;
+}
+
+th, td {
+   border: 1px solid black;
+   border-collapse: collapse;
+   padding-top: 2px;
+   padding-bottom: 2px;
+}
+table>tr>td {
+   padding: 8px;
+}
+table>tr>td:first {
+   padding-left:15px!important;
+}
+
+.vintage-text{
+   text-shadow: 0px -2px 0px #fff, 0px 2px 3px #fff;
+}
+
+</style>
+<script>
+module.exports = {
+   computed: {
+
+      promises() {
+         return this.$store.state.payment.promises
+      },
+      selected_order() {
+         return this.$store.state.patient.selected_patient
+      },
+      order_delivery() {
+         var dlvr = this.$store.state.payment.order_delivery
+         
+         return dlvr
+      },
+      selected_test() {
+         return this.$store.state.payment.order_detail
+      },
+      selected_panel() {
+         return this.$store.state.px.selected_panel
+      },
+      discount_pembulatan() {
+         //sipe : set to 0
+         return 0
+      },
+      grand_total() {
+    
+         return this.sub_total
+      },
+      sub_total() {
+         let tests = this.selected_test
+         sub_total = 0
+         tests.forEach(function(t,idx) {
+            let price = parseInt(t.T_OrderDetailTotal)
+            sub_total +=  price
+         })
+     
+         return sub_total
+      },
+      bruto_total() {
+         let tests = this.selected_test
+         bruto_total = 0
+         tests.forEach(function(t,idx) {
+            //console.log(t.T_PriceAmount)
+            bruto_total +=  parseInt(t.T_OrderDetailPrice)
+            //console.log(bruto_total)
+         })
+         
+         return bruto_total
+      },
+      diskon_total() {
+         let tests = this.selected_test
+         diskon_total = 0
+         tests.forEach(function(t,idx) {
+            let price = parseInt(t.T_OrderDetailDiscTotal)
+            diskon_total +=  price
+         })
+         
+         return diskon_total
+      },
+      
+   },
+   methods : {
+      one_money(p) {
+         return window.one_money(p)
+      },
+      child_test(x) {
+         let y = []
+         for (let i in x)
+               y.push(x[i].T_TestName)
+         return y.join(', ')
+      },
+      child_test_show(t) {
+         if (!t.child_test)
+               return false
+
+         if (t.child_test.length < 1)
+               return false
+
+         if (t.px_type != 'PN')
+               return false
+
+         return true
+      },
+      calc_netto(t) {
+            return one_float(t.T_PriceAmount) - one_float(t.T_PriceDisc) / 100 * one_float(t.T_PriceAmount)
+            - one_float(t.T_PriceDiscRp)
+      },
+
+      calc_discount(t) {
+      return ( one_float(t.T_PriceDisc) / 100 * one_float(t.T_PriceAmount) )
+         + one_float(t.T_PriceDiscRp)
+      },
+   }
+}
+</script>
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegistrationDoctorNewDialog.vue b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegistrationDoctorNewDialog.vue
new file mode 100644
index 0000000..aa86b58
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegistrationDoctorNewDialog.vue
@@ -0,0 +1,361 @@
+<template>
+    <v-dialog
+        v-model="dialog" 
+        persistent
+        width="800px"
+    >
+        <v-card>
+            <v-card-text>
+                <v-layout row wrap>
+                    <v-flex xs6 pr-2>
+                        <v-layout row wrap>
+                            <v-flex xs12 pl-1 pr-1>
+                                <v-text-field
+                                    label="NAMA LENGKAP"
+                                    v-model="name"
+                                    :error="!rules.required"
+                                    :rules="[rules.required]"
+                                    @update:error="error_trigger('name', $event)"
+                                ></v-text-field>
+                            </v-flex>
+
+                            <v-flex xs6 pl-1 pr-1>
+                                <v-text-field
+                                    label="Prefix 1"
+                                    v-model="prefix1"
+                                ></v-text-field>
+                            </v-flex>
+
+                            <v-flex xs6 pl-1 pr-1>
+                                <v-text-field
+                                    label="Prefix 2"
+                                    v-model="prefix2"
+                                ></v-text-field>
+                            </v-flex>
+                        </v-layout>
+
+                        <v-layout row wrap>
+                            <v-flex xs4 pl-1 pr-1>
+                                <v-text-field
+                                    label="Sufix 1"
+                                    v-model="sufix1"
+                                ></v-text-field>
+                            </v-flex>
+
+                            <v-flex xs4 pl-1 pr-1>
+                                <v-text-field
+                                    label="Sufix 2"
+                                    v-model="sufix2"
+                                ></v-text-field>
+                            </v-flex>
+
+                            <v-flex xs4 pl-1 pr-1>
+                                <v-text-field
+                                    label="Sufix 3"
+                                    v-model="sufix3"
+                                ></v-text-field>
+                            </v-flex>
+                        </v-layout>
+
+                        <v-layout row wrap>
+                            <v-flex xs6 pl-1 pr-1>
+                                <v-select
+                                    :items="sexs"
+                                    item-text="M_SexName"
+                                    item-value="M_SexID"
+                                    return-object
+                                    v-model="selected_sex"
+                                    label="Jenis Kelamin"
+                                    :error="!rules.required"
+                                    :rules="[rules.required]"
+                                    @update:error="error_trigger('selected_sex', $event)"
+                                ></v-select>
+                            </v-flex>
+                            <v-flex xs6>
+                                &nbsp;
+                            </v-flex>
+
+                            <v-flex xs12 pl-1 pr-1>
+                                <v-text-field
+                                    label="No HP"
+                                    v-model="hp"
+                                    :error="!rules.required"
+                                    :rules="[rules.required]"
+                                    @update:error="error_trigger('hp', $event)"
+                                ></v-text-field>
+                            </v-flex>
+
+                            <v-flex xs12 pl-1 pr-1>
+                                <v-text-field
+                                    label="Catatan"
+                                    v-model="note"
+                                ></v-text-field>
+                            </v-flex>
+                        </v-layout>
+                    </v-flex>
+
+                    <v-flex xs6 pl-2>
+                        <v-layout row wrap>
+                            <v-flex xs12>
+                                <v-textarea label="Alamat lengkap" v-model="address"
+                                    :error="!rules.required"
+                                    :rules="[rules.required]"
+                                    @update:error="error_trigger('address', $event)"></v-textarea>
+                            </v-flex>
+
+                            <v-flex xs12>
+                                
+                                <v-autocomplete
+                                    :items="provinces"
+                                    item-text="M_ProvinceName"
+                                    item-value="M_ProvinceID"
+                                    return-object
+                                    v-model="selected_province"
+                                    label="Propinsi"
+                                    autocomplete
+                                ></v-autocomplete>
+                            </v-flex>
+
+                            <v-flex xs12>
+                                <v-autocomplete
+                                    :items="cities"
+                                    item-text="M_CityName"
+                                    item-value="M_CityID"
+                                    return-object
+                                    v-model="selected_city"
+                                    label="Kota"
+                                    autocomplete
+                                ></v-autocomplete>
+                            </v-flex>
+
+                            <v-flex xs12>
+                                <v-autocomplete
+                                    :items="districts"
+                                    item-text="M_DistrictName"
+                                    item-value="M_DictrictID"
+                                    return-object
+                                    v-model="selected_district"
+                                    label="Kecamatan"
+                                    autocomplete
+                                ></v-autocomplete>
+                            </v-flex>
+
+                            <v-flex xs12>
+                                <v-autocomplete
+                                    :items="villages"
+                                    item-text="M_KelurahanName"
+                                    item-value="M_KelurahanID"
+                                    return-object
+                                    v-model="selected_village"
+                                    label="Kelurahan"
+                                    autocomplete
+                                    :error="!rules.required"
+                                    :rules="[rules.required]"
+                                    @update:error="error_trigger('selected_village', $event)"
+                                ></v-autocomplete>
+                            </v-flex>
+                        </v-layout>
+                    </v-flex>
+                </v-layout>
+            </v-card-text>
+
+            <v-card-actions>
+                <v-btn color="primary" flat @click="dialog=!dialog">Tutup</v-btn>
+                <v-spacer></v-spacer>
+                <v-btn color="primary" @click="save" :disabled="!btn_save_enabled" >Simpan</v-btn>
+            </v-card-actions>
+        </v-card>
+        
+    </v-dialog>
+</template>
+
+<script>
+module.exports = {
+    data () {
+        return {
+            errors : {
+                name : true,
+                hp : true,
+                sufix1 : false,
+                sufix2 : false,
+                sufix3 : false,
+                prefix1 : false,
+                prefix2 : false,
+                selected_sex : true,
+                address : false,
+                selected_village : false
+            },
+            rules : {
+                required : value => { return !!value || "Harus diisi !" },
+                // hp : value => { this.errors.name = !value; return !!value || "Harus diisi !" },
+                // selected_sex : value => { this.errors.name = !value; return !!value || "Harus diisi !" },
+                // address : value => { this.errors.name = !value; return !!value || "Harus diisi !" },
+                // selected_village : value => { this.errors.name = !value; return !!value || "Harus diisi !" }
+            }
+        }
+    },
+
+    computed : {
+        dialog : {
+            get () { return this.$store.state.doctor_new.dialog_new },
+            set (v) { this.$store.commit('doctor_new/update_dialog_new') }
+        },
+
+        sexs () {
+            return this.$store.state.doctor_new.sexs
+        },
+
+        selected_sex : {
+            get () { return this.$store.state.doctor_new.selected_sex },
+            set (v) { this.$store.commit('doctor_new/update_selected_sex', v) }
+        },
+
+        provinces () {
+            return this.$store.state.doctor_new.provinces
+        },
+
+        selected_province : {
+            get () { return this.$store.state.doctor_new.selected_province },
+            set (v) { 
+                this.$store.commit('doctor_new/update_selected_province', v)
+                // this.$store.dispatch('doctor_new/search_city')
+            }
+        },
+
+        cities () {
+            return this.$store.state.doctor_new.cities
+        },
+
+        selected_city : {
+            get () { return this.$store.state.doctor_new.selected_city },
+            set (v) { 
+                this.$store.commit('doctor_new/update_selected_city', v) 
+                // this.$store.dispatch('doctor_new/search_district')
+            }
+        },
+
+        districts () {
+            return this.$store.state.doctor_new.districts
+        },
+
+        selected_district : {
+            get () { return this.$store.state.doctor_new.selected_district },
+            set (v) { 
+                this.$store.commit('doctor_new/update_selected_district', v) 
+                // this.$store.dispatch('doctor_new/search_village')
+            }
+        },
+
+        villages () {
+            return this.$store.state.doctor_new.villages
+        },
+
+        selected_village : {
+            get () { return this.$store.state.doctor_new.selected_village },
+            set (v) { this.$store.commit('doctor_new/update_selected_village', v) }
+        },
+
+        name : {
+            get () { return this.$store.state.doctor_new.param_name },
+            set (v) { this.$store.commit('doctor_new/update_param', {param:'name',val:v}) }
+        },
+
+        prefix1 : {
+            get () { return this.$store.state.doctor_new.param_prefix1 },
+            set (v) { this.$store.commit('doctor_new/update_param', {param:'prefix1',val:v}) }
+        },
+
+        prefix2 : {
+            get () { return this.$store.state.doctor_new.param_prefix2 },
+            set (v) { this.$store.commit('doctor_new/update_param', {param:'prefix2',val:v}) }
+        },
+
+        sufix1 : {
+            get () { return this.$store.state.doctor_new.param_sufix1 },
+            set (v) { this.$store.commit('doctor_new/update_param', {param:'sufix1',val:v}) }
+        },
+
+        sufix2 : {
+            get () { return this.$store.state.doctor_new.param_sufix2 },
+            set (v) { this.$store.commit('doctor_new/update_param', {param:'sufix2',val:v}) }
+        },
+
+        sufix3 : {
+            get () { return this.$store.state.doctor_new.param_sufix3 },
+            set (v) { this.$store.commit('doctor_new/update_param', {param:'sufix3',val:v}) }
+        },
+
+        hp : {
+            get () { return this.$store.state.doctor_new.param_hp },
+            set (v) { this.$store.commit('doctor_new/update_param', {param:'hp',val:v}) }
+        },
+
+        note : {
+            get () { return this.$store.state.doctor_new.param_note },
+            set (v) { this.$store.commit('doctor_new/update_param', {param:'note',val:v}) }
+        },
+
+        address : {
+            get () { return this.$store.state.doctor_new.param_address },
+            set (v) { this.$store.commit('doctor_new/update_param', {param:'address',val:v}) }
+        },
+
+        btn_save_enabled () {
+            if (this.errors.name || this.errors.hp || this.errors.selected_sex || this.errors.address ||
+                this.errors.selected_village)
+                return false
+
+            return true
+        }
+    },
+
+    methods : {
+        save () {
+            this.$store.commit('update_dialog_loading', true)
+            this.$store.dispatch('doctor_new/save')
+        },
+
+        error_trigger(x, e) {
+            this.errors[x] = e
+        }
+    },
+
+    mounted () {
+        this.$store.dispatch('doctor_new/search_sex')
+    },
+
+    watch : {
+        dialog(val, old) {
+            if (val && !old) {
+                this.$store.dispatch('doctor_new/search_province')
+
+                this.name = ""
+                this.hp = ""
+                this.sufix1 = ""
+                this.sufix2 = ""
+                this.sufix3 = ""
+                this.prefix1 = ""
+                this.prefix2 = ""
+                this.selected_sex = null
+                this.address = ""
+            }
+                
+        },
+
+        selected_province(val, old) {
+            if (val != old)
+                this.$store.dispatch('doctor_new/search_city')
+        },
+
+        selected_city(val, old) {
+            if (val != old)
+                this.$store.dispatch('doctor_new/search_district')
+        },
+
+        selected_district(val, old) {
+            if (val != old)
+                this.$store.dispatch('doctor_new/search_village')
+        }
+    }
+}
+</script>
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegistrationErrorToken.vue b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegistrationErrorToken.vue
new file mode 100644
index 0000000..63dc131
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegistrationErrorToken.vue
@@ -0,0 +1,25 @@
+<template>
+  <div class="text-center ma-2">
+    <v-snackbar
+      v-model="snackbar"
+    >
+      {{ text }}
+      <v-btn
+        color="red"
+        text
+        @click="snackbar = false"
+      >
+        Tutup
+      </v-btn>
+    </v-snackbar>
+  </div>
+</template>
+
+<script>
+module.exports = {
+    data: () => ({
+      snackbar: false,
+      text: 'Ups ! Nampaknya anda harus login kembali',
+    }),
+}
+</script>
\ No newline at end of file
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegistrationHistory.vue b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegistrationHistory.vue
new file mode 100644
index 0000000..aa41c76
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegistrationHistory.vue
@@ -0,0 +1,17 @@
+<template>
+    <v-dialog
+        v-model="dialog"
+        max-width="500px"
+        transition="dialog-transition"
+        
+    >
+        <v-card>
+            <v-card-text>
+                
+            </v-card-text>
+            <v-card-actions>
+                
+            </v-card-actions>
+        </v-card>
+    </v-dialog>
+</template>
\ No newline at end of file
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegistrationPatientOrder.vue b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegistrationPatientOrder.vue
new file mode 100644
index 0000000..5e0157f
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegistrationPatientOrder.vue
@@ -0,0 +1,443 @@
+<template>
+        <v-layout column pb-2>
+            <v-card >
+                <v-layout row>
+                    <v-flex md6>
+                        <v-layout row pl-2>
+                            <v-flex md5>
+                                <div class="font-weight-bold text-fajrihm">No Reg</div>
+                            </v-flex>
+                            <v-flex md7>
+                                <div class="font-weight-regular text-fajrihm text-md-right">{{ order_no }}</div>
+                            </v-flex>
+                        </v-layout>
+                        <v-layout row pl-2>
+                            <v-flex md5>
+                                <div class="font-weight-bold text-fajrihm">Tangal Periksa</div>
+                            </v-flex>
+                            <v-flex md7>
+                                <div class="font-weight-regular text-fajrihm text-md-right">{{ order_date }}</div>
+                            </v-flex>
+                        </v-layout>
+                    </v-flex>
+                    <v-flex md6>
+                        <v-layout row pl-2>
+                            <v-flex md5>
+                                <div class="font-weight-bold text-fajrihm">PID</div>
+                            </v-flex>
+                            <v-flex md7>
+                                <div class="font-weight-regular text-fajrihm text-md-right">{{ patient_mr }}</div>
+                            </v-flex>
+                        </v-layout>
+                        <v-layout row pl-2>
+                            <v-flex md5>
+                                <div class="font-weight-bold text-fajrihm">Nama Pasien</div>
+                            </v-flex>
+                            <v-flex md7>
+                                <div class="font-weight-regular text-fajrihm text-md-right">{{ patient_name }}</div>
+                            </v-flex>
+                        </v-layout>
+                    </v-flex>
+                </v-layout>
+                <v-layout row>
+                    <v-flex md6>
+                        <v-layout row pl-2>
+                            <v-flex md5>
+                                <div class="font-weight-bold text-fajrihm">Kel. Pelanggan</div>
+                            </v-flex>
+                            <v-flex md7>
+                                <div class="font-weight-regular text-fajrihm text-md-right">{{ order_company }}</div>
+                            </v-flex>
+                        </v-layout>
+                    </v-flex>
+                    <v-flex md6>
+                        <v-layout row pl-2>
+                            <v-flex md5>
+                                <div class="font-weight-bold text-fajrihm">Agreement</div>
+                            </v-flex>
+                            <v-flex md7>
+                                <div class="font-weight-regular text-fajrihm text-md-right">{{ order_mou }}</div>
+                            </v-flex>
+                        </v-layout>
+                    </v-flex>
+                </v-layout>
+                <v-layout row mb-2>
+                    <v-flex md6>
+                        <v-layout row pl-2>
+                            <v-flex md5>
+                                <div class="font-weight-bold text-fajrihm">Pengirim</div>
+                            </v-flex>
+                            <v-flex md7>
+                                <div class="font-weight-regular text-fajrihm text-md-right">{{ doctor_sender }}</div>
+                            </v-flex>
+                        </v-layout>
+                    </v-flex>
+                    <v-flex md6>
+                        <v-layout row pl-2>
+                            <v-flex md5>
+                                <div class="font-weight-bold text-fajrihm">Alamat Pengirim</div>
+                            </v-flex>
+                            <v-flex md7>
+                                <div class="font-weight-regular text-fajrihm text-md-right">{{ doctor_sender_address }}</div>
+                            </v-flex>
+                        </v-layout>
+                    </v-flex>
+                </v-layout>
+                <v-layout style="border-top:1px dashed rgb(221,221,221)" row mt-1 mb-1></v-layout>
+                <v-layout row mb-2 wrap>
+                    <v-flex v-for="(dlv, n) in order_delivery" xs6 v-bind:key="n">
+                        <v-layout row wrap pl-2>
+                            <v-flex xs4 class="label-delivery font-weight-bold">
+                                {{ dlv.delivery_name }}
+                            </v-flex>
+                            <v-flex xs8 class="text-delivery text-xs-right">
+                                <p class="mb-1">{{ dlv.description }}</p>
+                                <p class="mb-1 mono red--text caption">catatan : <span v-if="dlv.note === ''">-</span> <span v-if="dlv.note !== ''">{{ dlv.note }}</span></p>
+                            </v-flex>
+                        </v-layout>
+                    </v-flex>
+                </v-layout>
+                <v-layout style="border-top:1px dashed rgb(221,221,221)" row mt-1 mb-1></v-layout>
+                <v-layout row pa-2>
+                    <v-flex xs12>
+
+                        <table>
+                            <tr style="background:#ffeaa5">
+                            
+                            <th style="width:42%;font-weight:bold;font-size:12px;" class="text-md-center pt-2 pb-2">PEMERIKSAAN</th>
+                            <th style="width:12%;font-weight:bold;font-size:12px;" class="text-md-center pt-2 pb-2">BRUTO</th>
+                            <th style="width:12%;font-weight:bold;font-size:12px;" class="text-md-center pt-2 pb-2">DISKON</th>
+                            <th style="width:12%;font-weight:bold;font-size:12px;" class="text-md-center pt-2 pb-2">TOTAL</th>
+                            </tr>
+                           
+                            <tr style="font-size:12px" v-for="t in selected_test" v-bind:key="t.T_TestID">
+               
+                            <td class="text-md-left pl-3">
+                                <p class="mb-1">{{ t.T_TestName}}</p>
+                                <p class="mb-0 caption" v-show="child_test_show(t)">{{child_test(t.child_test)}}</p>
+                            </td>
+                            <td class="text-md-right mono pr-2">{{ one_money(t.T_PriceAmount) }}</td>
+                            <td class="text-md-right mono pr-2">{{ one_money(calc_discount(t))  }}</td>
+                            <td class="text-md-right mono font-weight-black pr-2">{{ one_money(calc_netto(t)) }}</td>
+                            </tr>
+
+                            
+                            <!-- TEST PANEL -->
+                            <template v-for="p in selected_panel">
+                            <tr class="tr-panel">
+                                <td class="text-md-center">
+                                    <v-icon color="red" @click="deletePanel(p)">delete</v-icon>
+                                </td>
+                                <td class="text-md-left pl-3 pr-2" colspan="4">{{ p.T_TestPanelName}}</td>
+                            </tr>
+                            <tr v-for="t in p.test" v-bind:key="t.T_TestID">
+                                <td class="text-md-center">
+                                    &nbsp;
+                                </td>
+                                <td class="text-md-left pl-3">{{ t.T_TestName}}</td>
+                                <td class="text-md-right pr-2">{{ one_money(t.T_PriceAmount) }}</td>
+                                <td class="text-md-right pr-2">{{ one_money(calc_discount(t))  }}</td>
+                                <td class="text-md-right pr-2">{{ one_money(calc_netto(t)) }}</td>
+                            </tr>
+                            </template>
+                            <!--/ TEST PANEL -->
+
+                            <tfoot>
+                            <tr>
+                                <th style="background:#e16262;color:#fff"  class="text-md-left pl-3 pt-2 pb-2">TOTAL</th>
+                                <th style="background:#e16262;color:#fff" class="text-md-right pr-2 pt-2 pb-2">{{ one_money(bruto_total)  }}</th>
+                                <th style="background:#e16262;color:#fff" class="text-md-right pr-2 pt-2 pb-2">{{ one_money(diskon_total)  }}</th>
+                                <th style="background:#e16262;color:#fff" class="text-md-right pr-2 pt-2 pb-2" >{{ one_money(sub_total)  }}</th>
+                            </tr>
+                            
+                            </tfoot>
+                        </table>
+                    </v-flex>
+                </v-layout>
+                <v-layout style="border-top:1px dashed rgb(221,221,221)" row mt-2 mb-2></v-layout>
+                
+
+               
+</template>
+
+<style scoped>
+
+.v-input--selection-controls {
+    margin-top: 0px;
+    padding-top: 0px;
+}
+.text-fajrihm{
+    padding: 3px 20px 3px 0;
+    text-align:left;
+    font-size: 13px;
+    font-family: open sans, tahoma, sans-serif;
+}
+
+.label-delivery{
+     font-size: 11px;
+     padding: 3px 20px 3px 0;
+     font-family: open sans, tahoma, sans-serif;
+}
+.text-delivery{
+     font-size: 12px;
+     padding: 3px 20px 3px 0;
+     font-family: open sans, tahoma, sans-serif;
+}
+
+.nota {
+   font-size: 2em;
+   font-weight: bold;
+   text-align: left;
+}
+.total {
+   min-height:76px;
+}
+table {
+   font-family: arial, sans-serif;
+   border-collapse: collapse;
+   width: 100%;
+   background:white;
+   border: 0px;
+}
+
+th, td {
+   border: 1px solid black;
+   border-collapse: collapse;
+   padding-top: 2px;
+   padding-bottom: 2px;
+}
+table>tr>td {
+   padding: 8px;
+}
+table>tr>td:first {
+   padding-left:15px!important;
+}
+.nota {
+   font-size: 2em;
+   font-weight: bold;
+   text-align: left;
+}
+.total {
+   min-height:76px;
+}
+table {
+   font-family: arial, sans-serif;
+   border-collapse: collapse;
+   width: 100%;
+   background:white;
+   border: 0px;
+}
+
+th, td {
+   border: 1px solid black;
+   border-collapse: collapse;
+   padding-top: 2px;
+   padding-bottom: 2px;
+}
+table>tr>td {
+   padding: 8px;
+}
+table>tr>td:first {
+   padding-left:15px!important;
+}
+
+.vintage-text{
+   text-shadow: 0px -2px 0px #fff, 0px 2px 3px #fff;
+}
+
+</style>
+<script>
+module.exports = {
+    methods : {
+        one_money(p) {
+            return window.one_money(p)
+        },
+        child_test(x) {
+            let y = []
+            for (let i in x)
+                y.push(x[i].T_TestName)
+            return y.join(', ')
+        },
+
+        child_test_show(t) {
+            if (!t.child_test)
+                return false
+
+            if (t.child_test.length < 1)
+                return false
+
+            if (t.px_type != 'PN')
+                return false
+
+            return true
+        },
+         calc_netto(t) {
+         return one_float(t.T_PriceAmount) - one_float(t.T_PriceDisc) / 100 * one_float(t.T_PriceAmount)
+            - one_float(t.T_PriceDiscRp)
+      },
+
+      calc_discount(t) {
+         return ( one_float(t.T_PriceDisc) / 100 * one_float(t.T_PriceAmount) )
+            + one_float(t.T_PriceDiscRp)
+      },
+    },
+
+    data() {
+        return {
+
+        }
+    },
+
+    computed : {
+        selected_patient() {
+            return this.$store.state.patient.selected_patient
+        },
+         selected_panel() {
+         return this.$store.state.px.selected_panel
+      },
+      selected_test() {
+         return this.$store.state.px.selected_test
+      },
+      discount_pembulatan() {
+         //sipe : set to 0
+         return 0
+         let st = this.sub_total
+         let part = st%1000
+         if (part > 500) return part - 500
+         if (part < 500 && part > 0 ) return part
+         return 0
+      },
+      grand_total() {
+         let gt = this.sub_total - this.discount_pembulatan
+         return gt
+      },
+      sub_total() {
+         let tests = this.selected_test
+         sub_total = 0
+         tests.forEach(function(t,idx) {
+            let price = t.T_PriceAmount - t.T_PriceDisc / 100 * t.T_PriceAmount 
+               - t.T_PriceDiscRp
+            sub_total +=  price
+         })
+         let panels = this.selected_panel
+         panels.forEach(function(p) {
+            let tests = p.test
+            tests.forEach(function(t,idx) {
+               let price = t.T_PriceAmount - t.T_PriceDisc / 100 * t.T_PriceAmount 
+                  - t.T_PriceDiscRp
+               sub_total +=  price
+            })
+
+         })
+         return sub_total
+      },
+      bruto_total() {
+         let tests = this.selected_test
+         bruto_total = 0
+         tests.forEach(function(t,idx) {
+            //console.log(t.T_PriceAmount)
+            bruto_total +=  parseInt(t.T_PriceAmount)
+            //console.log(bruto_total)
+         })
+         let panels = this.selected_panel
+         panels.forEach(function(p) {
+            let tests = p.test
+            tests.forEach(function(t,idx) {
+               bruto_total +=  parseInt(t.T_PriceAmount)
+            })
+
+         })
+         return bruto_total
+      },
+      diskon_total() {
+         let tests = this.selected_test
+         diskon_total = 0
+         tests.forEach(function(t,idx) {
+            let price = parseInt(t.T_PriceDisc) / 100 * parseInt(t.T_PriceAmount) + parseInt(t.T_PriceDiscRp)
+            diskon_total +=  price
+         })
+         let panels = this.selected_panel
+         panels.forEach(function(p) {
+            let tests = p.test
+            tests.forEach(function(t,idx) {
+               let price = parseInt(t.T_PriceDisc) / 100 * parseInt(t.T_PriceAmount) + parseInt(t.T_PriceDiscRp)
+               diskon_total +=  price
+            })
+
+         })
+         return diskon_total
+      },
+        order_no() {
+            return this.$store.state.payment.selected_patient.order_no
+        },
+        
+        order_date() {
+            let x
+            try {
+                let z = this.$store.state.payment.selected_patient.order_date
+                let y = z.split(' ')
+                x = y[0].split('-').reverse().join('-') + ' ' + (y[1] ? y[1] : '')
+            } catch (e) { x = '-' }
+            
+            return x
+        },
+
+        order_mou() {
+            return this.$store.state.payment.selected_patient.order_mou
+        },
+
+        order_company() {
+            return this.$store.state.payment.selected_patient.order_company
+        },
+
+        patient_name() {
+            return this.$store.state.payment.selected_patient.patient_name
+        },
+
+        patient_mr() {
+            return this.$store.state.payment.selected_patient.patient_mr
+        },
+
+        doctor_sender() {
+            var xdoctor = this.$store.state.payment.selected_patient.doctor_sender
+            if(this.$store.state.doctor.doctor_alias != '')
+                xdoctor = this.$store.state.doctor.doctor_alias
+
+            return xdoctor
+        },
+
+        doctor_sender_address() {
+            var xaddress = this.$store.state.payment.selected_patient.doctor_sender_address
+            if(this.$store.state.doctor.doctor_alias_address != '')
+                xaddress = this.$store.state.doctor.doctor_alias_address
+            return xaddress
+        },
+
+        doctor_pj() {
+            return this.$store.state.payment.selected_patient.doctor_pj
+        },
+
+        order_detail() {
+            return this.$store.state.payment.order_detail
+        },
+
+        order_subtotal() {
+            return this.$store.state.payment.order_subtotal
+        },
+
+        order_rounding() {
+            return this.$store.state.payment.order_rounding
+        },
+
+        order_total() {
+            return this.$store.state.payment.order_total
+        },
+
+        order_delivery() {
+            var dlvr = this.$store.state.delivery.data_deliveries
+            
+            return  _.filter(dlvr, function(o) { return o.chex === 'Y' })
+        }
+    }
+}
+</script>
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegistrationPayment.vue b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegistrationPayment.vue
new file mode 100644
index 0000000..18629c2
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegistrationPayment.vue
@@ -0,0 +1,442 @@
+<template>
+        <v-layout column pb-2>
+            <v-card >
+                <v-layout row pa-2 align-center wrap >
+                    <v-flex xs6>
+                        <div class="label-tagihan text-xs-left">Total Tagihan 001</div>
+                        <v-layout style="border-top:1px dashed rgb(221,221,221)" row mt-1 mb-1 class="mt-3"></v-layout>
+                        
+                        <v-layout row wrap v-show="order_company.is_bill == 'N'">
+                            <v-flex xs6>
+                                <h3 class="subheading orange--text">Minimum DP ({{ order_company.min_dp }}%)</h3>
+                            </v-flex>
+                            <v-flex xs6>
+                                <h3 class="subheading text-xs-right orange--text">{{ one_money(order_company.min_dp_rp) }}</h3>
+                            </v-flex>
+                        </v-layout>
+
+                        <v-layout row wrap v-show="order_company.is_bill == 'Y' && order_company.on_hold == 'Y'">
+                            <v-flex xs12>
+                                <h3 class="subheading red--text">{{ order_company.on_hold_text }}</h3>
+                            </v-flex>
+                        </v-layout>
+                        
+                    </v-flex>
+                    <v-flex xs6>
+                       <div class="text-tagihan text-xs-right"><kbd>{{ one_money(bill_total) }}</kbd></div>
+                    </v-flex>
+                </v-layout>
+                <v-layout style="border-top:1px dashed rgb(221,221,221)" row mt-1 mb-1></v-layout>
+                
+                <v-layout column>
+                    <v-flex xs12 v-for="(p, pi) in payments" v-bind:key="p.payment_type_id">
+
+                        <v-layout row pt-2 pb-1 pl-2 align-center wrap class="border-top-dashed">
+                            <v-flex xs12>
+                                <v-switch
+                                    true-value="Y"
+                                    false-value="N"
+                                    v-model="payments[pi].payment_enable"
+                                    :label="p.payment_type_name"
+                                    @change="(v) => payment_enable(pi, v)"
+                                    :disabled="paid"
+                                ></v-switch>
+                            </v-flex>
+                        </v-layout>
+                        <v-layout row pa-2 align-center wrap >
+                            <v-flex xs2>
+                                <div class="sub-title pl-2">Jumlah</div>
+                            </v-flex>
+                            <v-flex xs4>
+                                <div  class="pa-2">
+                                    <v-text-field
+                                        v-bind:class="[p.payment_type_code == 'CASH' ? 'input-cash' : 'input-plain', 'text-xs-right font-weight-bold']"
+                                        v-model="payments[pi].payment_actual"
+                                        :disabled="paid || (payments[pi].payment_enable == 'Y' ? false : true)"
+                                        @input="(v) => update_payments(pi, 'payment_actual', v)"
+                                        reverse
+                                        
+                                    >
+                                    </v-text-field>
+                                    
+                                </div>
+                            </v-flex>
+                            <v-flex xs2>
+                                <div class="sub-title pl-2">{{ p.payment_note_label }}</div>
+                            </v-flex>
+                            <v-flex xs4>
+                                <div class="pa-2">
+                                    <v-text-field
+                                        v-show="p.payment_type_code != 'CASH'"
+                                        class="input-plain"
+                                        v-model="payments[pi].payment_note"
+                                        :disabled="paid || (payments[pi].payment_enable == 'Y' ? false : true)"
+                                        @input="(v) => update_payments(pi, 'payment_amount', v)"
+                                        reverse
+                                        
+                                    >
+                                    </v-text-field>
+
+                                    <v-text-field
+                                        v-show="p.payment_type_code == 'CASH'"
+                                        class="input-cash"
+                                        v-model="payments[pi].payment_change_mask"
+                                        disabled
+                                        reverse
+                                        
+                                    >
+                                    </v-text-field>
+                                </div>
+                            </v-flex>
+
+                            <v-flex xs12 v-if="['CREDIT', 'DEBIT'].indexOf(p.payment_type_code) > -1">
+                                <v-layout row wrap>
+                                    <v-flex xs2>
+                                        <div class="sub-title pl-2">Kartu</div>
+                                    </v-flex>
+                                    <v-flex xs4>
+                                        <v-autocomplete
+                                            :items="banks"
+                                            item-text="Nat_BankName"
+                                            item-value="Nat_BankID"
+                                            outline
+                                            hide-details
+                                            height="30"
+                                        ></v-autocomplete>
+                                    </v-flex>
+
+                                    <v-flex xs2>
+                                        <div class="sub-title pl-2">EDC</div>
+                                    </v-flex>
+                                    <v-flex xs4>
+                                        <v-autocomplete
+                                            :items="banks"
+                                            item-text="Nat_BankName"
+                                            item-value="Nat_BankID"
+                                            outline
+                                            hide-details
+                                        ></v-autocomplete>
+                                    </v-flex>
+                                </v-layout>
+                            </v-flex>
+                            
+                        </v-layout>
+                    </v-flex>
+                </v-layout>
+
+                <v-layout style="border-top:1px dashed rgb(221,221,221)" row mt-1 mb-1></v-layout>
+                <!-- <v-layout row pa-2 align-center wrap >
+                   <div>
+                        <v-btn color="error" dark large @click="save" :disabled="!btn_save_enable">BAYAR</v-btn>
+                    </div>
+                </v-layout> -->
+                <v-layout row pa-2 wrap >
+                    
+                    <v-flex xs9>
+                        <div>
+                            <v-btn color="error" :dark="btn_save_enable && !paid" @click="save" :disabled="!btn_save_enable || paid || savepayment" class="mr-0">SIMPAN & BAYAR</v-btn>
+                            
+                            <!-- <v-btn color="primary" large @click="print_invoice" class="ml-0 mr-0">C INVOICE</v-btn>
+                            <v-btn color="primary" large @click="print_control" class="ml-0">C KARTU KONTROL</v-btn> -->
+                            <template>
+                                
+                                <v-menu offset-y top>
+                                    <template v-slot:activator="{ on }">
+                                        <v-btn
+                                        color="orange"
+                                        dark
+                                        v-on="on"
+                                        >
+                                        <v-icon class="mr-1">print</v-icon>
+                                        Cetak
+                                        </v-btn>
+                                    </template>
+                                    <v-list>
+                                        <v-list-tile
+                                        v-for="(item, index) in menu_print"
+                                        :key="index"
+                                        @click="print_me(item.code)"
+                                        >
+                                        <v-list-tile-title>{{ item.title }}</v-list-tile-title>
+                                        </v-list-tile>
+                                    </v-list>
+                                </v-menu>
+                                
+                            </template>
+
+                            <v-btn color="primary" @click="reset" class="ml-0 mr-0">
+                                <v-icon class="mr-1">description</v-icon> BARU</v-btn>
+                        </div>
+                    </v-flex>
+                    <v-flex xs3>
+                        <div class="text-tagihan text-xs-right"><kbd>{{ one_money(payment_total) }}</kbd></div>
+                    </v-flex>
+                   
+                </v-layout>
+            </v-card>
+            <one-fo-registration-payment-finish></one-fo-registration-payment-finish>
+            <one-dialog-print></one-dialog-print>
+        </v-layout>
+        
+</template>
+
+<style scoped>
+.label-tagihan{
+    text-align:left;
+    font-size: 25px;
+    font-family: open sans, tahoma, sans-serif;
+    font-weight:700;
+}
+
+.sub-header{
+    text-align:left;
+    font-size: 18px;
+    font-family: open sans, tahoma, sans-serif;
+    font-weight:700;
+}
+
+.sub-title{
+    text-align:left;
+    font-size: 14px;
+    font-family: open sans, tahoma, sans-serif;
+    font-weight:700;
+}
+
+.text-tagihan{
+    text-align:left;
+    font-size: 42px;
+    font-family: open sans, tahoma, sans-serif;
+}
+
+.input-cash{
+    width: 100%;
+    padding: 8px 14px;
+    box-sizing: border-box;
+    border: 2px solid grey;
+    border-radius: 4px;
+    font-size: 22px;
+    font-weight:700;
+    text-align:right;
+}
+.input-plain{
+    width: 100%;
+    padding: 4px 8px;
+    box-sizing: border-box;
+    border: 2px solid grey;
+    border-radius: 4px;
+    font-size: 14px;
+}
+.v-input, .v-input__slot, .v-messages{
+    margin:0px;
+    padding:0px;
+    min-height: 0px; 
+}
+.v-input--selection-controls:not(.v-input--hide-details) .v-input__slot {
+    margin-bottom: 0px;
+}
+
+.border-top-dashed {
+    border-top: 1px dashed rgb(221,221,221)
+}
+</style>
+<script>
+module.exports = {
+    components : {
+        'one-field-verification' : httpVueLoader('../../common/oneFieldVerificationSupply.vue'),
+        'one-fo-registration-payment-finish' : httpVueLoader('./oneFoRegistrationPaymentFinish.vue'),
+        'one-dialog-print' : httpVueLoader('./oneDialogPrint.vue')
+    },
+
+     data () {
+      return {
+        checkbox: true,
+        radioGroup: 1,
+        switchCash: true,
+        switchDebit: false,
+        switchKredit: false,
+
+        switch_payment_enable: [],
+
+        payment_amount: [],
+        menu_print: [
+            { title:"Cetak Invoice", code:"P.INV" },
+            { title:"Cetak Kartu Kontrol", code:"P.CC" }
+        ]
+      }
+    },
+
+    methods : {
+        one_money(p) {
+            return window.one_money(p)
+        },
+
+        payment_enable (idx, v) {
+            let payments = this.payments
+            payments[idx]['payment_enable'] = v
+
+            this.$store.commit('payment/update_payments', payments)
+        },
+
+        save() {
+            this.$store.dispatch("payment/save");
+            return
+        },
+
+        update_payments (idx, type, v) {
+            let payments = this.payments
+            payments[idx][type] = v
+            this.$store.commit('payment/update_payments', payments)
+        },
+
+        reset () {
+            location.reload()
+        },
+
+        print_invoice () {
+            this.$store.dispatch('payment/print_invoice', this.$store.state.payment.order_id)
+            return
+        },
+
+        print_control () {
+            this.$store.dispatch('payment/print_control', this.$store.state.payment.order_id)
+            return
+        },
+
+        print_me (c) {
+            if (c == "P.INV")
+                return this.print_invoice()
+            else if (c == "P.CC")
+                return this.print_control()
+        }
+    },
+
+    computed : {
+        bill_total() {
+            return this.$store.state.payment.order_total
+        },
+
+        payment_total () {
+            return this.$store.state.payment.payment_total
+        },
+
+        savepayment () {
+            return this.$store.state.payment.savepayment
+        },
+
+        payment_cash_amount : {
+            get () {
+                return this.$store.state.payment.order_total
+            },
+            set (v) {
+                // this.$store.commit('payment/update_payment', {type:'cash',amount:v})
+                return
+            }
+        },
+
+        payment_debit_amount : {
+            get () {
+                return 0
+            },
+            set (v) {
+                return
+            }
+        },
+
+        payment_credit_amount : {
+            get () {
+                return 0
+            },
+            set (v) {
+                return
+            }
+        },
+
+        payments : {
+            get () {
+                let p = this.$store.state.payment.payments
+                for (let i in p)
+                    p[i].payment_change_mask = window.one_money(p[i].payment_change)
+
+                return p
+                // [{"payment_type_id":"1","payment_type_name":"Cash","payment_type_code":"CASH","payment_amount":"0","payment_note":"","payment_note_label":"Kembali","payment_enable":"N"},{"payment_type_id":"2","payment_type_name":"Debit","payment_type_code":"DEBIT","payment_amount":"0","payment_note":"","payment_note_label":"Nomor Kartu","payment_enable":"N"},{"payment_type_id":"3","payment_type_name":"Credit","payment_type_code":"CREDIT","payment_amount":"0","payment_note":"","payment_note_label":"Nomor Kartu","payment_enable":"N"},{"payment_type_id":"4","payment_type_name":"Voucher","payment_type_code":"VOUCHER","payment_amount":"0","payment_note":"","payment_note_label":"Nomor Voucher","payment_enable":"N"}]
+            },
+            set (v) {
+                this.$store.commit('payment/update_payments', v)
+                return
+            }
+        },
+
+        order_id : {
+            get () {
+                return this.$store.state.payment.order_id
+            },
+
+            set (v) {
+                return
+            }
+        },
+
+        btn_save_enable () {
+            if (this.payments.length < 1)
+                return false
+
+            let en = false
+            let sm = 0
+            for (let i in this.payments) {
+                if (this.payments[i].payment_enable == "Y") {
+                    en = true
+                    sm = sm + Math.round(this.payments[i].payment_amount)
+                }
+            }
+
+            if (!en) return false
+
+            if (this.$store.state.payment.order_id == 0 ||
+                this.$store.state.payment.order_id == "0")
+                return false;
+
+            if (sm == 0)
+                return false
+
+            return true
+        },
+
+        paid : {
+            get () { return this.$store.state.payment.paid },
+            set (v) { this.$store.commit('payment/update_paid', v) }
+        },
+
+        order_company () {
+            return this.$store.state.payment.order_company
+        },
+        
+        banks () {
+            return this.$store.state.other.banks
+        }
+    },
+
+    mounted () {
+        this.$store.dispatch('payment/search')
+        this.$store.dispatch('other/search_bank')
+    },
+
+    watch : {
+        switch_payment_enable (n, o) {
+            if (n != o) {
+                if (n.length < o.length) {
+                    for (let i in o)
+                        if (n.indexOf(o[i]) < 0)
+                            return
+                }
+            }
+        },
+
+        order_id (n, o) {
+            if (n == 0 || n == "0")
+                this.$store.commit("order/update_tab_enable", [2, false])
+            else
+                this.$store.commit("order/update_tab_enable", [2, true])
+        }
+    }
+}
+</script>
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegistrationPayment2.vue b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegistrationPayment2.vue
new file mode 100644
index 0000000..e4fdc8a
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegistrationPayment2.vue
@@ -0,0 +1,525 @@
+<template>
+        <v-layout column pb-2>
+            <v-card >
+                <v-layout row pa-2 align-center wrap >
+                    <v-flex xs6>
+                        <div class="label-tagihan text-xs-left">Total Tagihan</div>
+
+                        <v-layout row wrap v-show="selected_order.M_CompanyIsBill == 'N'">
+                            <v-flex xs6>
+                                <h3 class="subheading orange--text">Minimum DP ({{ selected_order.M_CompanyMinDP }}%)</h3>
+                            </v-flex>
+                        </v-layout>
+
+                        <v-layout row wrap v-show="selected_order.M_CompanyIsBill == 'Y' && selected_order.M_CompanyIsAgingOnHold == 'Y'">
+                            <v-flex xs12>
+                                <h3 class="subheading red--text">Sedang on Hold</h3>
+                            </v-flex>
+                        </v-layout>
+
+                    </v-flex>
+                    <v-flex xs6>
+                       <div class="text-tagihan text-xs-right"><kbd>{{ one_money(bill_total) }}</kbd></div>
+                    </v-flex>
+                </v-layout>
+                <v-layout style="border-top:1px dashed rgb(221,221,221)" row mt-1 mb-1></v-layout>
+
+                <v-layout column>
+                    <v-flex xs12 v-for="(p, pi) in payments" v-bind:key="p.payment_type_id">
+
+                        <v-layout row pt-2 pb-1 pl-2 align-center wrap class="border-top-dashed">
+                            <v-flex xs12>
+                                <v-switch
+                                    true-value="Y"
+                                    false-value="N"
+                                    v-model="payments[pi].payment_enable"
+                                    :label="p.payment_type_name"
+                                    @change="(v) => payment_enable(pi, v)"
+                                    :disabled="paid"
+                                ></v-switch>
+                            </v-flex>
+                        </v-layout>
+                        <v-layout row pa-2 wrap >
+
+                            <v-flex xs4 pr-2>
+                                <!-- <div  class="pa-2"> -->
+                                    <v-text-field
+                                        v-bind:class="[p.payment_type_code == 'CASH' ? 'input-cash' : 'input-plain', 'text-xs-right font-weight-bold']"
+                                        v-model="payments[pi].payment_actual"
+                                        :disabled="paid || (payments[pi].payment_enable == 'Y' ? false : true)"
+                                        @input="(v) => update_payments(pi, 'payment_actual', v)"
+                                        reverse
+                                        label="Jumlah"
+                                        outline
+                                    >
+                                    </v-text-field>
+
+                                <!-- </div> -->
+                            </v-flex>
+                            <v-flex xs4 v-if="['CASH', 'VOUCHER'].indexOf(p.payment_type_code) > -1">
+                                <!-- <div class="pa-2"> -->
+                                    <v-text-field
+                                        v-show="p.payment_type_code == 'VOUCHER'"
+                                        class="input-plain"
+                                        v-model="payments[pi].payment_note"
+                                        :disabled="paid || (payments[pi].payment_enable == 'Y' ? false : true)"
+                                        @input="(v) => update_payments(pi, 'payment_amount', v)"
+                                        reverse
+                                        :label="p.payment_note_label"
+                                        outline
+                                    >
+                                    </v-text-field>
+
+                                    <v-text-field
+                                        v-show="p.payment_type_code == 'CASH'"
+                                        class="input-cash"
+                                        v-model="payments[pi].payment_change_mask"
+                                        disabled
+                                        reverse
+                                        :label="p.payment_note_label"
+                                        outline
+                                    >
+                                    </v-text-field>
+                                <!-- </div> -->
+                            </v-flex>
+
+                            <v-flex xs4 v-if="['CREDIT', 'DEBIT'].indexOf(p.payment_type_code) > -1" pr-2>
+                                <v-autocomplete
+                                    :items="cards"
+                                    item-text="Nat_BankName"
+                                    item-value="Nat_BankID"
+                                    outline
+                                    hide-details
+                                    height="30"
+                                    label="Kartu"
+                                    @change="(v) => update_payments(pi, 'payment_card_id', v)"
+                                    v-model="init_val_card[p.payment_type_code]"
+                                ></v-autocomplete>
+                            </v-flex>
+
+                            <v-flex xs4 v-if="['CREDIT', 'DEBIT'].indexOf(p.payment_type_code) > -1">
+                                <!-- <v-autocomplete
+                                    :items="banks"
+                                    item-text="Nat_BankName"
+                                    item-value="Nat_BankID"
+                                    outline
+                                    hide-details
+                                    height="30"
+                                    label="EDC"
+                                    @change="(v) => update_payments(pi, 'payment_edc_id', v)"
+                                    v-model="init_val_edc[p.payment_type_code]"
+                                ></v-autocomplete> X -->
+
+                                <v-autocomplete
+                                    :items="accounts"
+                                    item-text="M_BankAccountNo"
+                                    item-value="M_BankAccountID"
+                                    outline
+                                    hide-details
+                                    height="30"
+                                    label="EDC"
+                                    @change="(v) => update_payments(pi, 'payment_account_id', v)"
+                                    v-model="init_val_account[p.payment_type_code]"
+                                ></v-autocomplete>
+
+                            </v-flex>
+
+                            <v-flex xs4 v-if="['TRANSFER'].indexOf(p.payment_type_code) > -1" pr-2>
+                                <v-autocomplete
+                                    :items="accounts"
+                                    item-text="M_BankAccountNo"
+                                    item-value="M_BankAccountID"
+                                    outline
+                                    hide-details
+                                    height="30"
+                                    label="No Rekening"
+                                    @change="(v) => update_payments(pi, 'payment_account_id', v)"
+                                    v-model="init_val_account[p.payment_type_code]"
+                                ></v-autocomplete>
+                            </v-flex>
+                        </v-layout>
+                    </v-flex>
+                </v-layout>
+
+                <v-layout style="border-top:1px dashed rgb(221,221,221)" row mt-1 mb-1></v-layout>
+                <!-- <v-layout row pa-2 align-center wrap >
+                   <div>
+                        <v-btn color="error" dark large @click="save" :disabled="!btn_save_enable">BAYAR</v-btn>
+                    </div>
+                </v-layout> -->
+                <v-layout row pa-2 wrap >
+
+                    <v-flex xs9>
+                        <div>
+                            <v-btn v-show="!is_bill" color="error" :dark="btn_save_enable && !paid" @click="save" :disabled="!btn_save_enable || paid || savepayment" class="mr-0">SIMPAN & BAYAR</v-btn>
+                            <v-btn v-show="is_bill" color="error" dark @click="print_bukti" class="mr-0">BUKTI PEMERIKSAAN</v-btn>
+
+                            <!-- <v-btn color="primary" large @click="print_invoice" class="ml-0 mr-0">C INVOICE</v-btn>
+                            <v-btn color="primary" large @click="print_control" class="ml-0">C KARTU KONTROL</v-btn> -->
+                            <template>
+
+                                <v-menu offset-y top>
+                                    <template v-slot:activator="{ on }">
+                                        <v-btn
+                                        color="orange"
+                                        dark
+                                        v-on="on"
+                                        >
+                                        <v-icon class="mr-1">print</v-icon>
+                                        Cetak
+                                        </v-btn>
+                                    </template>
+                                    <v-list>
+                                        <v-list-tile
+                                        v-for="(item, index) in menu_print"
+                                        :key="index"
+                                        @click="print_me(item.code)"
+                                        >
+                                        <v-list-tile-title>{{ item.title }}</v-list-tile-title>
+                                        </v-list-tile>
+                                    </v-list>
+                                </v-menu>
+
+                            </template>
+
+                            <v-btn color="primary" @click="reset" class="ml-0 mr-0">
+                                <v-icon class="mr-1">description</v-icon> BARU</v-btn>
+                        </div>
+                    </v-flex>
+                    <v-flex xs3>
+                        <div class="text-tagihan text-xs-right"><kbd>{{ one_money(payment_total) }}</kbd></div>
+                    </v-flex>
+
+                </v-layout>
+            </v-card>
+            <one-fo-registration-payment-finish></one-fo-registration-payment-finish>
+            <one-dialog-print></one-dialog-print>
+        </v-layout>
+
+</template>
+
+<style scoped>
+.label-tagihan{
+    text-align:left;
+    font-size: 25px;
+    font-family: open sans, tahoma, sans-serif;
+    font-weight:700;
+}
+
+.sub-header{
+    text-align:left;
+    font-size: 18px;
+    font-family: open sans, tahoma, sans-serif;
+    font-weight:700;
+}
+
+.sub-title{
+    text-align:left;
+    font-size: 14px;
+    font-family: open sans, tahoma, sans-serif;
+    font-weight:700;
+}
+
+.text-tagihan{
+    text-align:left;
+    font-size: 42px;
+    font-family: open sans, tahoma, sans-serif;
+}
+
+.input-cash{
+    width: 100%;
+    /* padding: 8px 14px; */
+    /* box-sizing: border-box; */
+    /* border: 2px solid grey;
+    border-radius: 4px; */
+    font-size: 22px;
+    font-weight:700;
+    text-align:right;
+}
+.input-plain{
+    width: 100%;
+    /* padding: 4px 8px; */
+    /* box-sizing: border-box; */
+    /* border: 2px solid grey;
+    border-radius: 4px; */
+    font-size: 14px;
+}
+.v-input, .v-input__slot, .v-messages{
+    margin:0px;
+    padding:0px;
+    min-height: 0px;
+}
+.v-input--selection-controls:not(.v-input--hide-details) .v-input__slot {
+    margin-bottom: 0px;
+}
+
+.border-top-dashed {
+    border-top: 1px dashed rgb(221,221,221)
+}
+</style>
+<script>
+module.exports = {
+    components : {
+        'one-field-verification' : httpVueLoader('../../common/oneFieldVerificationSupply.vue'),
+        'one-fo-registration-payment-finish' : httpVueLoader('./oneFoRegistrationPaymentFinish.vue'),
+        'one-dialog-print' : httpVueLoader('./oneDialogPrint.vue')
+    },
+
+     data () {
+      return {
+        checkbox: true,
+        radioGroup: 1,
+        switchCash: true,
+        switchDebit: false,
+        switchKredit: false,
+
+        switch_payment_enable: [],
+
+        payment_amount: [],
+        menu_print: [
+            { title:"Cetak Invoice", code:"P.INV" },
+            { title:"Cetak Kartu Kontrol", code:"P.CC" }
+        ],
+        init_val_edc:{"CREDIT":0,"DEBIT":0},
+        init_val_card:{"CREDIT":0,"DEBIT":0},
+        init_val_account:{"CREDIT":0,"DEBIT":0,"TRANSFER":0}
+      }
+    },
+
+    methods : {
+        one_money(p) {
+            return window.one_money(p)
+        },
+
+        payment_enable (idx, v) {
+            let payments = this.payments
+            payments[idx]['payment_enable'] = v
+            if (v == "N") {
+                payments[idx]['payment_actual'] = 0
+                payments[idx]['payment_amount'] = 0
+                payments[idx]['payment_card_id'] = 0
+                payments[idx]['payment_edc_id'] = 0
+                payments[idx]['payment_change'] = 0
+                payments[idx]['payment_change_mask'] = 0
+                this.init_val_edc[payments[idx]['payment_type_code']] = 0
+                this.init_val_card[payments[idx]['payment_type_code']] = 0
+            } else {
+                payments[idx]['payment_amount'] = this.bill_rest
+                payments[idx]['payment_actual'] = this.bill_rest
+            }
+
+            this.$store.commit('payment/update_payments', payments)
+        },
+
+        save() {
+            this.$store.dispatch("payment/save");
+            return
+        },
+
+        update_payments (idx, type, v) {
+            let payments = this.payments
+            payments[idx][type] = v
+            this.$store.commit('payment/update_payments', payments)
+        },
+
+        reset () {
+            //location.reload()
+          //  alert('dasdasdasd')
+            this.$store.dispatch('payment/reset', {order_id:this.$store.state.payment.order_id,time_start:this.$store.state.order.show_time})
+        },
+
+        print_invoice () {
+            this.$store.dispatch('payment/print_invoice', this.$store.state.payment.order_id)
+            return
+        },
+
+        print_control_xx () {
+            this.$store.dispatch('payment/print_control', this.$store.state.payment.order_id)
+            return
+        },
+        print_control () {
+            this.$store.dispatch('payment/print_control', {order_id:this.$store.state.payment.order_id,time_start:this.$store.state.order.show_time})
+            return
+        },
+
+        print_me (c) {
+            if (c == "P.INV")
+                return this.print_invoice()
+            else if (c == "P.CC")
+                return this.print_control()
+        },
+
+        xxx(v) {
+            alert(v)
+        },
+
+        print_bukti() {
+            this.$store.dispatch('payment/print_nota', this.order_id)
+        }
+    },
+
+    computed : {
+        bill_total() {
+            return this.selected_order.order_total
+        },
+
+        payment_total () {
+            return this.$store.state.payment.payment_total
+        },
+
+        bill_rest () {
+            return this.bill_total - this.payment_total
+        },
+
+        savepayment () {
+            return this.$store.state.payment.savepayment
+        },
+
+        payment_cash_amount : {
+            get () {
+                return this.$store.state.payment.order_total
+            },
+            set (v) {
+                // this.$store.commit('payment/update_payment', {type:'cash',amount:v})
+                return
+            }
+        },
+
+        payment_debit_amount : {
+            get () {
+                return 0
+            },
+            set (v) {
+                return
+            }
+        },
+
+        payment_credit_amount : {
+            get () {
+                return 0
+            },
+            set (v) {
+                return
+            }
+        },
+
+        payments : {
+            get () {
+                let p = this.$store.state.payment.payments
+                for (let i in p)
+                    p[i].payment_change_mask = window.one_money(p[i].payment_change)
+
+                return p
+                // [{"payment_type_id":"1","payment_type_name":"Cash","payment_type_code":"CASH","payment_amount":"0","payment_note":"","payment_note_label":"Kembali","payment_enable":"N"},{"payment_type_id":"2","payment_type_name":"Debit","payment_type_code":"DEBIT","payment_amount":"0","payment_note":"","payment_note_label":"Nomor Kartu","payment_enable":"N"},{"payment_type_id":"3","payment_type_name":"Credit","payment_type_code":"CREDIT","payment_amount":"0","payment_note":"","payment_note_label":"Nomor Kartu","payment_enable":"N"},{"payment_type_id":"4","payment_type_name":"Voucher","payment_type_code":"VOUCHER","payment_amount":"0","payment_note":"","payment_note_label":"Nomor Voucher","payment_enable":"N"}]
+            },
+            set (v) {
+                this.$store.commit('payment/update_payments', v)
+                return
+            }
+        },
+
+        order_id : {
+            get () {
+                return this.$store.state.payment.order_id
+            },
+
+            set (v) {
+                return
+            }
+        },
+
+        btn_save_enable () {
+            if (this.payments.length < 1)
+                return false
+
+            let en = false
+            let sm = 0
+            for (let i in this.payments) {
+                let p = this.payments[i]
+                if (p.payment_enable == "Y") {
+                    en = true
+                    sm = sm + Math.round(p.payment_amount)
+
+                    // IF DEBIT OR CREDIT
+                    if (['DEBIT', 'CREDIT'].indexOf(p.payment_type_code) > -1) {
+                        if (p.payment_card_id == 0 || p.payment_account_id == 0)
+                            en = false
+                    }
+
+                    if (['TRANSFER'].indexOf(p.payment_type_code) > -1) {
+                        if (p.payment_account_id == 0)
+                            en = false
+                    }
+
+                    console.log(p.payment_type_code + '-' + en)
+                }
+            }
+
+            if (!en) return false
+
+            if (this.$store.state.payment.order_id == 0 ||
+                this.$store.state.payment.order_id == "0")
+                return false;
+
+            if (sm == 0)
+                return false
+
+            return true
+        },
+
+        paid : {
+            get () { return this.$store.state.payment.paid },
+            set (v) { this.$store.commit('payment/update_paid', v) }
+        },
+        selected_order() {
+            return this.$store.state.patient.selected_patient
+        },
+
+        order_company () {
+            return this.$store.state.payment.order_company
+        },
+
+        banks () {
+            return this.$store.state.other.banks
+        },
+
+        cards () {
+            return this.$store.state.other.cards
+        },
+
+        accounts () {
+            return this.$store.state.other.accounts
+        },
+
+        is_bill () {
+            return this.$store.state.company.selected_mou.M_MouIsBill == "Y"
+        }
+    },
+
+    mounted () {
+        this.$store.dispatch('payment/search')
+        this.$store.dispatch('other/search_bank')
+        this.$store.dispatch('other/search_card')
+        this.$store.dispatch('other/search_accounts')
+    },
+
+    watch : {
+        switch_payment_enable (n, o) {
+            if (n != o) {
+                if (n.length < o.length) {
+                    for (let i in o)
+                        if (n.indexOf(o[i]) < 0)
+                            return
+                }
+            }
+        },
+
+        order_id (n, o) {
+            if (n == 0 || n == "0")
+                this.$store.commit("order/update_tab_enable", [2, false])
+            else
+                this.$store.commit("order/update_tab_enable", [2, true])
+        }
+    }
+}
+</script>
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegistrationPayment2.vue-- b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegistrationPayment2.vue--
new file mode 100644
index 0000000..a8270d9
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegistrationPayment2.vue--
@@ -0,0 +1,525 @@
+<template>
+        <v-layout column pb-2>
+            <v-card >
+                <v-layout row pa-2 align-center wrap >
+                    <v-flex xs6>
+                        <div class="label-tagihan text-xs-left">Total Tagihan</div>
+                        <v-layout style="border-top:1px dashed rgb(221,221,221)" row mt-1 mb-1 class="mt-3"></v-layout>
+
+                        <v-layout row wrap v-show="order_company.is_bill == 'N'">
+                            <v-flex xs6>
+                                <h3 class="subheading orange--text">Minimum DP ({{ order_company.min_dp }}%)</h3>
+                            </v-flex>
+                            <v-flex xs6>
+                                <h3 class="subheading text-xs-right orange--text">{{ one_money(order_company.min_dp_rp) }}</h3>
+                            </v-flex>
+                        </v-layout>
+
+                        <v-layout row wrap v-show="order_company.is_bill == 'Y' && order_company.on_hold == 'Y'">
+                            <v-flex xs12>
+                                <h3 class="subheading red--text">{{ order_company.on_hold_text }}</h3>
+                            </v-flex>
+                        </v-layout>
+
+                    </v-flex>
+                    <v-flex xs6>
+                       <div class="text-tagihan text-xs-right"><kbd>{{ one_money(bill_total) }}</kbd></div>
+                    </v-flex>
+                </v-layout>
+                <v-layout style="border-top:1px dashed rgb(221,221,221)" row mt-1 mb-1></v-layout>
+
+                <v-layout column>
+                    <v-flex xs12 v-for="(p, pi) in payments" v-bind:key="p.payment_type_id">
+
+                        <v-layout row pt-2 pb-1 pl-2 align-center wrap class="border-top-dashed">
+                            <v-flex xs12>
+                                <v-switch
+                                    true-value="Y"
+                                    false-value="N"
+                                    v-model="payments[pi].payment_enable"
+                                    :label="p.payment_type_name"
+                                    @change="(v) => payment_enable(pi, v)"
+                                    :disabled="paid"
+                                ></v-switch>
+                            </v-flex>
+                        </v-layout>
+                        <v-layout row pa-2 wrap >
+
+                            <v-flex xs4 pr-2>
+                                <!-- <div  class="pa-2"> -->
+                                    <v-text-field
+                                        v-bind:class="[p.payment_type_code == 'CASH' ? 'input-cash' : 'input-plain', 'text-xs-right font-weight-bold']"
+                                        v-model="payments[pi].payment_actual"
+                                        :disabled="paid || (payments[pi].payment_enable == 'Y' ? false : true)"
+                                        @input="(v) => update_payments(pi, 'payment_actual', v)"
+                                        reverse
+                                        label="Jumlah"
+                                        outline
+                                    >
+                                    </v-text-field>
+
+                                <!-- </div> -->
+                            </v-flex>
+                            <v-flex xs4 v-if="['CASH', 'VOUCHER'].indexOf(p.payment_type_code) > -1">
+                                <!-- <div class="pa-2"> -->
+                                    <v-text-field
+                                        v-show="p.payment_type_code == 'VOUCHER'"
+                                        class="input-plain"
+                                        v-model="payments[pi].payment_note"
+                                        :disabled="paid || (payments[pi].payment_enable == 'Y' ? false : true)"
+                                        @input="(v) => update_payments(pi, 'payment_amount', v)"
+                                        reverse
+                                        :label="p.payment_note_label"
+                                        outline
+                                    >
+                                    </v-text-field>
+
+                                    <v-text-field
+                                        v-show="p.payment_type_code == 'CASH'"
+                                        class="input-cash"
+                                        v-model="payments[pi].payment_change_mask"
+                                        disabled
+                                        reverse
+                                        :label="p.payment_note_label"
+                                        outline
+                                    >
+                                    </v-text-field>
+                                <!-- </div> -->
+                            </v-flex>
+
+                            <v-flex xs4 v-if="['CREDIT', 'DEBIT'].indexOf(p.payment_type_code) > -1" pr-2>
+                                <v-autocomplete
+                                    :items="cards"
+                                    item-text="Nat_BankName"
+                                    item-value="Nat_BankID"
+                                    outline
+                                    hide-details
+                                    height="30"
+                                    label="Kartu"
+                                    @change="(v) => update_payments(pi, 'payment_card_id', v)"
+                                    v-model="init_val_card[p.payment_type_code]"
+                                ></v-autocomplete>
+                            </v-flex>
+
+                            <v-flex xs4 v-if="['CREDIT', 'DEBIT'].indexOf(p.payment_type_code) > -1">
+                                <!-- <v-autocomplete
+                                    :items="banks"
+                                    item-text="Nat_BankName"
+                                    item-value="Nat_BankID"
+                                    outline
+                                    hide-details
+                                    height="30"
+                                    label="EDC"
+                                    @change="(v) => update_payments(pi, 'payment_edc_id', v)"
+                                    v-model="init_val_edc[p.payment_type_code]"
+                                ></v-autocomplete> X -->
+
+                                <v-autocomplete
+                                    :items="accounts"
+                                    item-text="M_BankAccountNo"
+                                    item-value="M_BankAccountID"
+                                    outline
+                                    hide-details
+                                    height="30"
+                                    label="EDC"
+                                    @change="(v) => update_payments(pi, 'payment_account_id', v)"
+                                    v-model="init_val_account[p.payment_type_code]"
+                                ></v-autocomplete>
+
+                            </v-flex>
+
+                            <v-flex xs4 v-if="['TRANSFER'].indexOf(p.payment_type_code) > -1" pr-2>
+                                <v-autocomplete
+                                    :items="accounts"
+                                    item-text="M_BankAccountNo"
+                                    item-value="M_BankAccountID"
+                                    outline
+                                    hide-details
+                                    height="30"
+                                    label="No Rekening"
+                                    @change="(v) => update_payments(pi, 'payment_account_id', v)"
+                                    v-model="init_val_account[p.payment_type_code]"
+                                ></v-autocomplete>
+                            </v-flex>
+                        </v-layout>
+                    </v-flex>
+                </v-layout>
+
+                <v-layout style="border-top:1px dashed rgb(221,221,221)" row mt-1 mb-1></v-layout>
+                <!-- <v-layout row pa-2 align-center wrap >
+                   <div>
+                        <v-btn color="error" dark large @click="save" :disabled="!btn_save_enable">BAYAR</v-btn>
+                    </div>
+                </v-layout> -->
+                <v-layout row pa-2 wrap >
+
+                    <v-flex xs9>
+                        <div>
+                            <v-btn v-show="!is_bill" color="error" :dark="btn_save_enable && !paid" @click="save" :disabled="!btn_save_enable || paid || savepayment" class="mr-0">SIMPAN & BAYAR</v-btn>
+                            <v-btn v-show="is_bill" color="error" dark @click="print_bukti" class="mr-0">BUKTI PEMERIKSAAN</v-btn>
+
+                            <!-- <v-btn color="primary" large @click="print_invoice" class="ml-0 mr-0">C INVOICE</v-btn>
+                            <v-btn color="primary" large @click="print_control" class="ml-0">C KARTU KONTROL</v-btn> -->
+                            <template>
+
+                                <v-menu offset-y top>
+                                    <template v-slot:activator="{ on }">
+                                        <v-btn
+                                        color="orange"
+                                        dark
+                                        v-on="on"
+                                        >
+                                        <v-icon class="mr-1">print</v-icon>
+                                        Cetak
+                                        </v-btn>
+                                    </template>
+                                    <v-list>
+                                        <v-list-tile
+                                        v-for="(item, index) in menu_print"
+                                        :key="index"
+                                        @click="print_me(item.code)"
+                                        >
+                                        <v-list-tile-title>{{ item.title }}</v-list-tile-title>
+                                        </v-list-tile>
+                                    </v-list>
+                                </v-menu>
+
+                            </template>
+
+                            <v-btn color="primary" @click="reset" class="ml-0 mr-0">
+                                <v-icon class="mr-1">description</v-icon> BARU</v-btn>
+                        </div>
+                    </v-flex>
+                    <v-flex xs3>
+                        <div class="text-tagihan text-xs-right"><kbd>{{ one_money(payment_total) }}</kbd></div>
+                    </v-flex>
+
+                </v-layout>
+            </v-card>
+            <one-fo-registration-payment-finish></one-fo-registration-payment-finish>
+            <one-dialog-print></one-dialog-print>
+        </v-layout>
+
+</template>
+
+<style scoped>
+.label-tagihan{
+    text-align:left;
+    font-size: 25px;
+    font-family: open sans, tahoma, sans-serif;
+    font-weight:700;
+}
+
+.sub-header{
+    text-align:left;
+    font-size: 18px;
+    font-family: open sans, tahoma, sans-serif;
+    font-weight:700;
+}
+
+.sub-title{
+    text-align:left;
+    font-size: 14px;
+    font-family: open sans, tahoma, sans-serif;
+    font-weight:700;
+}
+
+.text-tagihan{
+    text-align:left;
+    font-size: 42px;
+    font-family: open sans, tahoma, sans-serif;
+}
+
+.input-cash{
+    width: 100%;
+    /* padding: 8px 14px; */
+    /* box-sizing: border-box; */
+    /* border: 2px solid grey;
+    border-radius: 4px; */
+    font-size: 22px;
+    font-weight:700;
+    text-align:right;
+}
+.input-plain{
+    width: 100%;
+    /* padding: 4px 8px; */
+    /* box-sizing: border-box; */
+    /* border: 2px solid grey;
+    border-radius: 4px; */
+    font-size: 14px;
+}
+.v-input, .v-input__slot, .v-messages{
+    margin:0px;
+    padding:0px;
+    min-height: 0px;
+}
+.v-input--selection-controls:not(.v-input--hide-details) .v-input__slot {
+    margin-bottom: 0px;
+}
+
+.border-top-dashed {
+    border-top: 1px dashed rgb(221,221,221)
+}
+</style>
+<script>
+module.exports = {
+    components : {
+        'one-field-verification' : httpVueLoader('../../common/oneFieldVerificationSupply.vue'),
+        'one-fo-registration-payment-finish' : httpVueLoader('./oneFoRegistrationPaymentFinish.vue'),
+        'one-dialog-print' : httpVueLoader('./oneDialogPrint.vue')
+    },
+
+     data () {
+      return {
+        checkbox: true,
+        radioGroup: 1,
+        switchCash: true,
+        switchDebit: false,
+        switchKredit: false,
+
+        switch_payment_enable: [],
+
+        payment_amount: [],
+        menu_print: [
+            { title:"Cetak Invoice", code:"P.INV" },
+            { title:"Cetak Kartu Kontrol", code:"P.CC" }
+        ],
+        init_val_edc:{"CREDIT":0,"DEBIT":0},
+        init_val_card:{"CREDIT":0,"DEBIT":0},
+        init_val_account:{"CREDIT":0,"DEBIT":0,"TRANSFER":0}
+      }
+    },
+
+    methods : {
+        one_money(p) {
+            return window.one_money(p)
+        },
+
+        payment_enable (idx, v) {
+            let payments = this.payments
+            payments[idx]['payment_enable'] = v
+            if (v == "N") {
+                payments[idx]['payment_actual'] = 0
+                payments[idx]['payment_amount'] = 0
+                payments[idx]['payment_card_id'] = 0
+                payments[idx]['payment_edc_id'] = 0
+                payments[idx]['payment_change'] = 0
+                payments[idx]['payment_change_mask'] = 0
+                this.init_val_edc[payments[idx]['payment_type_code']] = 0
+                this.init_val_card[payments[idx]['payment_type_code']] = 0
+            } else {
+                payments[idx]['payment_amount'] = this.bill_rest
+                payments[idx]['payment_actual'] = this.bill_rest
+            }
+
+            this.$store.commit('payment/update_payments', payments)
+        },
+
+        save() {
+            this.$store.dispatch("payment/save");
+            return
+        },
+
+        update_payments (idx, type, v) {
+            let payments = this.payments
+            payments[idx][type] = v
+            this.$store.commit('payment/update_payments', payments)
+        },
+
+        reset () {
+            //location.reload()
+            this.$store.dispatch('payment/reset', {order_id:this.$store.state.payment.order_id,time_start:this.$store.state.order.show_time})
+        },
+
+        print_invoice () {
+            this.$store.dispatch('payment/print_invoice', this.$store.state.payment.order_id)
+            return
+        },
+
+        print_control_xx () {
+            this.$store.dispatch('payment/print_control', this.$store.state.payment.order_id)
+            return
+        },
+        print_control () {
+            this.$store.dispatch('payment/print_control', {order_id:this.$store.state.payment.order_id,time_start:this.$store.state.order.show_time})
+            return
+        },
+
+        print_me (c) {
+            if (c == "P.INV")
+                return this.print_invoice()
+            else if (c == "P.CC")
+                return this.print_control()
+        },
+
+        xxx(v) {
+            alert(v)
+        },
+
+        print_bukti() {
+            this.$store.dispatch('payment/print_nota', this.order_id)
+        }
+    },
+
+    computed : {
+        bill_total() {
+            return this.$store.state.payment.order_total
+        },
+
+        payment_total () {
+            return this.$store.state.payment.payment_total
+        },
+
+        bill_rest () {
+            return this.bill_total - this.payment_total
+        },
+
+        savepayment () {
+            return this.$store.state.payment.savepayment
+        },
+
+        payment_cash_amount : {
+            get () {
+                return this.$store.state.payment.order_total
+            },
+            set (v) {
+                // this.$store.commit('payment/update_payment', {type:'cash',amount:v})
+                return
+            }
+        },
+
+        payment_debit_amount : {
+            get () {
+                return 0
+            },
+            set (v) {
+                return
+            }
+        },
+
+        payment_credit_amount : {
+            get () {
+                return 0
+            },
+            set (v) {
+                return
+            }
+        },
+
+        payments : {
+            get () {
+                let p = this.$store.state.payment.payments
+                for (let i in p)
+                    p[i].payment_change_mask = window.one_money(p[i].payment_change)
+
+                return p
+                // [{"payment_type_id":"1","payment_type_name":"Cash","payment_type_code":"CASH","payment_amount":"0","payment_note":"","payment_note_label":"Kembali","payment_enable":"N"},{"payment_type_id":"2","payment_type_name":"Debit","payment_type_code":"DEBIT","payment_amount":"0","payment_note":"","payment_note_label":"Nomor Kartu","payment_enable":"N"},{"payment_type_id":"3","payment_type_name":"Credit","payment_type_code":"CREDIT","payment_amount":"0","payment_note":"","payment_note_label":"Nomor Kartu","payment_enable":"N"},{"payment_type_id":"4","payment_type_name":"Voucher","payment_type_code":"VOUCHER","payment_amount":"0","payment_note":"","payment_note_label":"Nomor Voucher","payment_enable":"N"}]
+            },
+            set (v) {
+                this.$store.commit('payment/update_payments', v)
+                return
+            }
+        },
+
+        order_id : {
+            get () {
+                return this.$store.state.payment.order_id
+            },
+
+            set (v) {
+                return
+            }
+        },
+
+        btn_save_enable () {
+            if (this.payments.length < 1)
+                return false
+
+            let en = false
+            let sm = 0
+            for (let i in this.payments) {
+                let p = this.payments[i]
+                if (p.payment_enable == "Y") {
+                    en = true
+                    sm = sm + Math.round(p.payment_amount)
+
+                    // IF DEBIT OR CREDIT
+                    if (['DEBIT', 'CREDIT'].indexOf(p.payment_type_code) > -1) {
+                        if (p.payment_card_id == 0 || p.payment_account_id == 0)
+                            en = false
+                    }
+
+                    if (['TRANSFER'].indexOf(p.payment_type_code) > -1) {
+                        if (p.payment_account_id == 0)
+                            en = false
+                    }
+
+                    console.log(p.payment_type_code + '-' + en)
+                }
+            }
+
+            if (!en) return false
+
+            if (this.$store.state.payment.order_id == 0 ||
+                this.$store.state.payment.order_id == "0")
+                return false;
+
+            if (sm == 0)
+                return false
+
+            return true
+        },
+
+        paid : {
+            get () { return this.$store.state.payment.paid },
+            set (v) { this.$store.commit('payment/update_paid', v) }
+        },
+
+        order_company () {
+            return this.$store.state.payment.order_company
+        },
+
+        banks () {
+            return this.$store.state.other.banks
+        },
+
+        cards () {
+            return this.$store.state.other.cards
+        },
+
+        accounts () {
+            return this.$store.state.other.accounts
+        },
+
+        is_bill () {
+            return this.$store.state.company.selected_mou.M_MouIsBill == "Y"
+        }
+    },
+
+    mounted () {
+        this.$store.dispatch('payment/search')
+        this.$store.dispatch('other/search_bank')
+        this.$store.dispatch('other/search_card')
+        this.$store.dispatch('other/search_accounts')
+    },
+
+    watch : {
+        switch_payment_enable (n, o) {
+            if (n != o) {
+                if (n.length < o.length) {
+                    for (let i in o)
+                        if (n.indexOf(o[i]) < 0)
+                            return
+                }
+            }
+        },
+
+        order_id (n, o) {
+            if (n == 0 || n == "0")
+                this.$store.commit("order/update_tab_enable", [2, false])
+            else
+                this.$store.commit("order/update_tab_enable", [2, true])
+        }
+    }
+}
+</script>
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegistrationPaymentFinish.vue b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegistrationPaymentFinish.vue
new file mode 100644
index 0000000..20132ef
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegistrationPaymentFinish.vue
@@ -0,0 +1,95 @@
+<template>
+
+    <v-dialog
+      v-model="dialog"
+      width="500"
+    >
+
+
+      <v-card>
+        <v-card-title
+          class="headline grey lighten-2 pt-2 pb-2"
+          primary-title
+        >
+          Pembayaran Berhasil
+        </v-card-title>
+        <v-card-text class="pt-2 pb-2">
+          <h6 class="display-1 text-center">No Pembayaran <span class="blue--text">{{ text_payno }}</span></h6>
+        </v-card-text>
+        <v-divider></v-divider>
+
+        <v-card-actions>
+          <v-btn
+            color="warning"
+            @click="print_nota"
+            class="ml-2"
+          >
+            CETAK NOTA
+          </v-btn>
+
+          <v-btn
+            color="success"
+            @click="print_notain"
+            class="ml-2"
+          >
+            CETAK NOTA IN
+          </v-btn>
+
+          <v-spacer></v-spacer>
+          <v-btn
+            color="primary"
+            flat
+            @click="finish"
+          >
+            Tutup
+          </v-btn>
+        </v-card-actions>
+      </v-card>
+    </v-dialog>
+
+</template>
+
+<style scoped>
+</style>
+
+<script>
+module.exports = {
+    components : {
+
+    },
+    methods : {
+       tuing: function() {
+          alert('x')
+       },
+
+       finish: function() {
+         this.dialog = false
+        //  location.reload()
+       },
+
+       print_nota () {
+         this.$store.dispatch('payment/print_nota', this.$store.state.payment.payment_id)
+         return
+       },
+
+       print_notain () {
+         this.$store.dispatch('payment/print_notain', this.$store.state.payment.payment_id)
+         return
+       }
+    },
+    computed : {
+       dialog: {
+          get() {
+             return this.$store.state.payment.finish_dialog_is_active;
+          },
+          set(val) {
+             this.$store.commit('payment/update_finish_dialog_is_active', val);
+          }
+       },
+
+       text_payno () {
+         return this.$store.state.payment.payment_number
+       }
+    }
+}
+</script>
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegistrationPriceList.vue b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegistrationPriceList.vue
new file mode 100644
index 0000000..c5bdc02
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegistrationPriceList.vue
@@ -0,0 +1,599 @@
+<template>
+   <v-layout column pb-0>
+      <v-dialog
+      v-model="dialog_alert_msg"
+      width="60%"
+    >
+      
+
+      <v-card >
+        <v-card-title
+          class="subtitle-1 white--text"
+          style="background:#ee7777"
+         
+        >
+          PEMBERITAHUAN !
+        </v-card-title>
+
+        <v-card-text v-html="alert_msg">
+          
+        </v-card-text>
+
+        <v-divider></v-divider>
+
+        <v-card-actions>
+          <v-spacer></v-spacer>
+          <v-btn
+            color="grey"
+            flat
+            @click="dialog_alert_msg = false"
+          >
+            OK ... saya mengerti
+          </v-btn>
+        </v-card-actions>
+      </v-card>
+    </v-dialog>
+      <!--#95eaf3-->
+      <v-card flat>
+         <table>
+            <tr style="background:#64b2cd">
+               <th style="width:7%;font-weight:bold;font-size:12px;color:#fff" class="text-md-center pt-2 pb-2">  </th>
+              <!---- <th style="width:7%;font-weight:bold;font-size:12px;color:#fff" class="text-md-center pt-2 pb-2">CITO</th> --->
+               <th style="width:45%;font-weight:bold;font-size:12px;color:#fff" class="text-md-center pt-2 pb-2">PEMERIKSAAN</th>
+               <th style="width:12%;font-weight:bold;font-size:12px;color:#fff" class="text-md-center pt-2 pb-2">BRUTO</th>
+               <th style="width:12%;font-weight:bold;font-size:12px;color:#fff" class="text-md-center pt-2 pb-2">DISKON</th>
+               <th style="width:14%;font-weight:bold;font-size:12px;color:#fff" class="text-md-center pt-2 pb-2">TOTAL</th>
+            </tr>
+            <tr  v-if="selected_test.length === 0" >
+               <td class="pa-2 text-xs-center caption" colspan="6">Belum ada order pemeriksaan</td>
+            </tr>
+            <tr v-if="selected_test.length > 0" style="font-size:12px" v-for="t in selected_test" v-bind:key="t.T_TestID">
+               <td class="text-md-center">
+                  <v-icon color="#ee7777" @click="deletePx(t)">delete</v-icon>
+               </td>
+               <!----<td class="text-md-left pl-3">
+                     <v-checkbox hide-details class="smr-1" 
+                        :value="t.T_TestID"
+                        v-model="cito_test"
+                     ></v-checkbox>
+               </td>-->
+            
+               <td class="text-md-left pl-3">
+                  <p class="mb-0 mono caption font-weight-bold" style="color:#3c70a4;font-size:10px!important">{{getTimeX(t.promise)}}</p> 
+                  <p class="mb-1">{{ t.T_TestName}}</p>
+                  <p class="mb-0 caption" v-show="child_test_show(t)">{{child_test(t.child_test)}}</p>
+               </td>
+               <td class="text-md-right mono pr-2">{{ one_money(t.T_PriceAmount) }}</td>
+               <td class="text-md-right mono pr-2">{{ one_money(calc_discount(t))  }}</td>
+               <td class="text-md-right mono font-weight-black pr-2">{{ one_money(calc_netto(t)) }}</td>
+            </tr>
+
+            
+            <!-- TEST PANEL -->
+            <template v-for="p in selected_panel">
+               <tr class="tr-panel">
+                <!--  <td class="text-md-center">
+                     <v-icon color="red" @click="deletePanel(p)">delete</v-icon>
+                  </td> -->
+                  <td class="text-md-left pl-3 pr-2" colspan="4">{{ p.T_TestPanelName}}</td>
+               </tr>
+               <tr v-for="t in p.test" v-bind:key="t.T_TestID">
+                  <td class="text-md-center">
+                     &nbsp;
+                  </td>
+                  <td class="text-md-left pl-3">{{ t.T_TestName}}</td>
+                  <td class="text-md-right pr-2">{{ one_money(t.T_PriceAmount) }}</td>
+                  <td class="text-md-right pr-2">{{ one_money(calc_discount(t))  }}</td>
+                  <td class="text-md-right pr-2">{{ one_money(calc_netto(t)) }}</td>
+               </tr>
+            </template>
+            <!--/ TEST PANEL -->
+
+            <tfoot>
+               <tr>
+                  <th style="background:#3c70a4;color:#fff"  class="text-md-right pr-5 pt-2 pb-2"></th> 
+                  <th style="background:#3c70a4;color:#fff"  class="text-md-left pl-3 pt-2 pb-2">TOTAL</th>
+                  <th style="background:#3c70a4;color:#fff" class="text-md-right pr-2 pt-2 pb-2">{{ one_money(bruto_total)  }}</th>
+                  <th style="background:#3c70a4;color:#fff" class="text-md-right pr-2 pt-2 pb-2">{{ one_money(diskon_total)  }}</th>
+                  <th style="background:#3c70a4;color:#fff" class="text-md-right pr-2 pt-2 pb-2" >{{ one_money(sub_total)  }}</th>
+               </tr>
+               <tr style="display:none">
+                  <th colspan="2"  class="text-md-right pr-2 pt-1 pb-1">DISKON PEMBULATAN</th>
+                  <th class="text-md-right pr-2 pt-1 pb-1"  colspan="2">{{ one_money(discount_pembulatan) }}</th>
+               </tr>
+            </tfoot>
+         </table>
+      </v-card>
+      <v-card   flat>
+         <v-layout row>
+            <v-flex  xs4>
+               <v-btn block :disabled="in_saving"  v-if="btn_save_enabled && !loading_process" title="simpan order"  @click="save_order()" class="mb-1 mt-2 ml-0 mr-0" dark color="#3c70a4">
+                  simpan 
+               </v-btn>
+               
+               <v-btn block  v-if="!btn_save_enabled" title="simpan order"  @click="check_msg_alert()" class="mb-1 mt-2 ml-0 mr-0 grey darken-1"  dark>
+                  simpan 
+               </v-btn>
+            </v-flex>
+         </v-layout>
+      </v-card>
+      <one-dialog-loading></one-dialog-loading>
+   </v-layout>
+</template>
+
+<style scoped>
+.nota {
+   font-size: 2em;
+   font-weight: bold;
+   text-align: left;
+}
+.total {
+   min-height:76px;
+}
+table {
+   font-family: arial, sans-serif;
+   border-collapse: collapse;
+   width: 100%;
+   background:white;
+   border: 0px;
+}
+
+th, td {
+   border: 1px solid black;
+   border-collapse: collapse;
+   padding-top: 2px;
+   padding-bottom: 2px;
+}
+table>tr>td {
+   padding: 8px;
+}
+table>tr>td:first {
+   padding-left:15px!important;
+}
+
+.vintage-text{
+   text-shadow: 0px -2px 0px #fff, 0px 2px 3px #fff;
+}
+
+.v-input--selection-controls {
+    margin-top: 0px;
+    padding-top: 0px;
+}
+
+</style>
+<script>
+module.exports = {
+    components : {
+        'one-dialog-loading': httpVueLoader('../../../../common/oneDialogLoading.vue')
+    },
+   data () {
+      return {
+         current_cito_change : [],
+         dialog_alert_msg:false,
+         alert_msg:''
+
+      }
+   }, 
+   watch : {
+      cito_test (n, o) {
+         if (n != o) {
+            if (n.length == 0)
+               this.current_cito_change = [o[0], "N"]
+            else if (o.length == 0)
+               this.current_cito_change = [n[0], "Y"]
+            else if (o.length > n.length) {
+               for (let i in o) 
+                  if (n.indexOf(o[i]) < 0) this.current_cito_change = [o[i], "N"]
+            }
+            else {
+               for (let i in n) 
+                  if (o.indexOf(n[i]) < 0) this.current_cito_change = [n[i], "Y"]
+            }
+         }     
+         
+            let is_cito = "N";
+            if (n.length > 0)
+                is_cito = "Y";
+            this.$store.commit('px/update_is_cito', is_cito);
+
+         console.log(this.$store.state.company.selected_mou)
+         let selected_mou = this.$store.state.company.selected_mou
+         let mou_id = selected_mou.price_header_id
+         console.log('mou_id',mou_id)
+         this.$store.dispatch('px/get_price', {
+               test_id:this.current_cito_change[0], 
+               mou_id:mou_id,
+               cito:this.current_cito_change[1]})
+      }
+   },
+
+   methods: {
+       getTimeX(xtime) {
+            var xvar = xtime
+            if(xvar)
+                xvar = xvar.split(",")
+            else 
+                xvar = []
+            
+            var new_time = []
+            if(xvar.length > 0){
+               xvar.forEach(function(xxtime) {
+                  //console.log(xxtime)
+                  let xxxtime = moment(xxtime).format('DD-MM-YYYY HH:mm')
+                  //console.log(xxxtime)
+                  new_time.push(xxxtime)
+               })
+            }
+            console.log(new_time)
+            if(new_time.length > 0)
+                return new_time.join(', ')
+            else
+                return ''
+        },
+      one_money(p) {
+         return window.one_money(p)
+      },
+
+      update_req(px) {
+         this.$store.dispatch("px/update_req", px)
+      },
+
+      deletePanel(panel) {
+         let sel = this.selected_panel
+
+         sel.forEach(function(p,idx) {
+            if(p.T_TestPanelID == panel.T_TestPanelID) {
+               sel.splice(idx,1)
+            }
+         });
+
+         this.$store.commit("px/update_selected_panel",sel)
+         let panels = this.$store.state.px.panels
+         if ( panels == undefined ) panels = [] 
+         panels.push(panel)
+         let dt = {
+            records : panels,
+            total: panels.length
+         }
+         this.$store.commit("px/update_panels",dt)
+         this.update_req()
+      },
+
+      deletePx(test) {
+         this.$store.dispatch("px/delete_px", test)
+      },
+
+      calc_netto(t) {
+         return one_float(t.T_PriceAmount) - one_float(t.T_PriceDisc) / 100 * one_float(t.T_PriceAmount)
+            - one_float(t.T_PriceDiscRp)
+      },
+
+      calc_discount(t) {
+         return ( one_float(t.T_PriceDisc) / 100 * one_float(t.T_PriceAmount) )
+            + one_float(t.T_PriceDiscRp)
+      },
+
+      save_order() {
+         if (this.in_saving) return;
+         this.in_saving = true;
+            if (!window.one_token()) {
+                this.$store.commit('update_message_error', 'Maaf, koneksi Anda sempat terputus silahkan Log Out dan Login kembali')
+                this.$store.commit('update_dialog_error', true)
+                return
+            }
+          // Loading
+          this.$store.commit('order/update_loading_process', true)
+          this.$store.commit('update_dialog_loading', true)
+         this.$store.dispatch("order/save")
+         return
+      },
+
+        child_test(x) {
+            let y = []
+            for (let i in x)
+                y.push(x[i].T_TestName)
+            return y.join(', ')
+        },
+
+        child_test_show(t) {
+            if (!t.child_test)
+                return false
+
+            if (t.child_test.length < 1)
+                return false
+
+            if (t.px_type != 'PN')
+                return false
+
+            return true
+        },
+        check_msg_alert () {
+         // console.log(this.$store.state.patient.selected_patient.M_PatientID)
+         var msg = ""
+         var validRSample = true
+         var msg_validRSample = ''
+         if(this.$store.state.order.received_sample.flag === 'Y'){
+            var xDate = moment(this.$store.state.order.received_sample.time, 'DDMMYYYYHHmm', true)
+            var validDate = xDate.isValid()
+            if(!validDate){
+               validRSample = validDate
+               msg_validRSample = "<p class='caption mono mb-1'>- Waktu penerimaan sample harus diisi dengan format DD-MM-YYYY HH:MM, contoh : 05-06-2020 11:35 </p>"
+            }
+            else{
+               var xnow = moment(new Date(), 'DDMMYYYYHHmm')
+               validRSample = moment(this.$store.state.order.received_sample.time, 'DDMMYYYYHHmm').isSameOrBefore(xnow)
+               //console.log(validRSample)
+               msg_validRSample = "<p class='caption mono mb-1'>- Apa sample diambil dari masa depan ? </p>"
+            }
+         }
+         
+         
+         if (!this.$store.state.patient.selected_patient.M_PatientID)
+            msg = msg +"<p class='caption mono mb-1'>- Ibarat ibu-ibu kalo belok tanpa lampu sein, bingung dong kalo belum dipilih pasien</p>"
+
+         if(this.$store.state.patient.selected_patient.M_PatientDOB){
+            var xDate = moment(this.$store.state.patient.selected_patient.M_PatientDOB, 'YYYY-MM-DD', true)
+            var xDatenow = moment(new Date(), 'YYYY-MM-DD')
+            var validDOB = xDate.isSameOrBefore(xDatenow)
+            if(!validDOB)
+               msg = msg +"<p class='caption mono mb-1'>- Apa pasien datang dari masa depan ? coba dicek tanggal lahirnya </p>"
+         }
+         
+          
+          
+          if (
+            !this.$store.state.doctor.selected_doctor.M_DoctorID)
+         msg = msg +"<p class='caption mono mb-1'>- Naik kereta beli es krim, mana belum ada dokte pengirim ?</p>"
+
+
+         if (this.$store.state.px.req_status == 'X')
+            msg = msg +"<p class='caption mono mb-1'>- Kalo mau periksa harus ditanya dulu apakah persyaratan sudah memenuhi ?</p>"
+
+         if (this.$store.state.px.req_status == 'N' && this.$store.state.px.reqs.length < 1)
+           msg = msg +"<p class='caption mono mb-1'>- Yang tidak memenuhi persyaratannya apa ya ?</p>"
+
+         var deliveries = this.$store.state.delivery.data_deliveries
+         var checked_deliveries = _.filter(deliveries, function(o) { return o.chex === 'Y' })
+
+         if (checked_deliveries.length === 0)
+             msg = msg +"<p class='caption mono mb-1'>- Pergi wisata ke Purwakarta, hasilnya dikasih ke siapa ?</p>"
+
+         if (this.$store.state.px.selected_test.length < 1)
+             msg = msg +"<p class='caption mono mb-1'>- Jadi total semua nya 0 rupi...eh, ini kok belum ada pemeriksaan ? </p>"
+
+         if (!validRSample)
+             msg = msg +msg_validRSample
+
+         var refs = this.$store.state.reference.selected_reference
+         if (!refs || refs.length === 0) {
+             msg = msg + "<p class='caption mono mb-1'>- Dapat info dari mana nih? Pilih dulu Reference nya</p>"
+         }
+
+         var ordertype = this.$store.state.reference.selected_ordertype
+         if (!ordertype || !ordertype.M_OrderTypeID) {
+            msg = msg + "<p class='caption mono mb-1'>- Jenis ordernya belum dipilih, tentukan dulu Order Type nya</p>"
+         }
+         
+         this.alert_msg = msg
+         this.dialog_alert_msg = true
+      }
+   },
+   computed: {
+      appx_schedule_computed() {
+         return this.$store.state.px.appx_schedule
+      },
+      promise_by_pxs() {
+         return this.$store.state.px.promise_by_pxs
+      },
+      preregister_promise() {
+         return this.$store.state.order.preregister_promise
+      },
+      loading_process() {
+         return this.$store.state.order.loading_process
+      },
+      loading_data_patient: {
+         get() {
+            return this.$store.state.order.loading_data_patient
+         },
+         set(val) {
+            this.$store.commit('order/update_loading_data_patient', val)
+         }
+      },
+      selected_panel() {
+         return this.$store.state.px.selected_panel
+      },
+      selected_test() {
+         return this.$store.state.px.selected_test
+      },
+      in_saving: {
+                get() {
+                    return this.$store.state.order.in_saving
+                },
+                set(val) {
+                    this.$store.commit("order/update_in_saving", val)
+                }
+            },
+      discount_pembulatan() {
+         //sipe : set to 0
+         return 0
+         let st = this.sub_total
+         let part = st%1000
+         if (part > 500) return part - 500
+         if (part < 500 && part > 0 ) return part
+         return 0
+      },
+      grand_total() {
+         let gt = this.sub_total - this.discount_pembulatan
+         return gt
+      },
+      sub_total() {
+         let tests = this.selected_test
+         sub_total = 0
+         tests.forEach(function(t,idx) {
+            let price = t.T_PriceAmount - t.T_PriceDisc / 100 * t.T_PriceAmount 
+               - t.T_PriceDiscRp
+            sub_total +=  price
+         })
+         let panels = this.selected_panel
+         panels.forEach(function(p) {
+            let tests = p.test
+            tests.forEach(function(t,idx) {
+               let price = t.T_PriceAmount - t.T_PriceDisc / 100 * t.T_PriceAmount 
+                  - t.T_PriceDiscRp
+               sub_total +=  price
+            })
+
+         })
+         return sub_total
+      },
+      bruto_total() {
+         let tests = this.selected_test
+         bruto_total = 0
+         tests.forEach(function(t,idx) {
+            //console.log(t.T_PriceAmount)
+            bruto_total +=  parseInt(t.T_PriceAmount)
+            //console.log(bruto_total)
+         })
+         let panels = this.selected_panel
+         panels.forEach(function(p) {
+            let tests = p.test
+            tests.forEach(function(t,idx) {
+               bruto_total +=  parseInt(t.T_PriceAmount)
+            })
+
+         })
+         return bruto_total
+      },
+      diskon_total() {
+         let tests = this.selected_test
+         diskon_total = 0
+         tests.forEach(function(t,idx) {
+            let price = parseInt(t.T_PriceDisc) / 100 * parseInt(t.T_PriceAmount) + parseInt(t.T_PriceDiscRp)
+            diskon_total +=  price
+         })
+         let panels = this.selected_panel
+         panels.forEach(function(p) {
+            let tests = p.test
+            tests.forEach(function(t,idx) {
+               let price = parseInt(t.T_PriceDisc) / 100 * parseInt(t.T_PriceAmount) + parseInt(t.T_PriceDiscRp)
+               diskon_total +=  price
+            })
+
+         })
+         return diskon_total
+      },
+      
+      xxxbtn_save_enabled () {
+         // console.log(this.$store.state.patient.selected_patient.M_PatientID)
+         if (!this.$store.state.patient.selected_patient.M_PatientID ||
+            !this.$store.state.patient.selected_patient.M_PatientName ||
+            !this.$store.state.patient.selected_patient.M_PatientNoReg ||
+            !this.$store.state.patient.selected_patient.M_PatientDOB ||
+            !this.$store.state.patient.selected_patient.patient_age ||
+            this.$store.state.px.selected_test.length < 1)
+         return false;
+
+         if (this.$store.state.px.req_status == 'X')
+         return false
+
+         //alert(this.$store.state.px.req_status)
+         if (this.$store.state.px.req_status == 'N' && this.$store.state.px.reqs.length < 1)
+            return false
+
+         if(this.loading_data_patient == false)
+         return false
+
+       /* 
+
+         
+
+         var deliveries = this.$store.state.delivery.data_deliveries
+         var checked_deliveries = _.filter(deliveries, function(o) { return o.chex === 'Y' })
+
+         if (checked_deliveries.length === 0)
+            return false
+      */
+
+       
+       
+         return true;
+      },
+      btn_save_enabled () {
+         // console.log(this.$store.state.patient.selected_patient.M_PatientID)
+         var validRSample = true
+         if(this.$store.state.order.received_sample.flag === 'Y'){
+            var xDate = moment(this.$store.state.order.received_sample.time, 'DDMMYYYYHHmm', true)
+            validDate = xDate.isValid()
+            if(!validDate){
+               validRSample = validDate
+              
+            }
+            else{
+               var xnow = moment(new Date(), 'DDMMYYYYHHmm')
+               validRSample = moment(this.$store.state.order.received_sample.time, 'DDMMYYYYHHmm').isSameOrBefore(xnow)
+               
+            }
+         }
+         else{
+           this.$store.commit("order/update_received_sample", {flag:"N",time:""})
+         }
+
+         
+
+         //console.log(validRSample)
+         var xDate = moment(this.$store.state.patient.selected_patient.M_PatientDOB, 'YYYY-MM-DD', true)
+         //console.log(this.$store.state.patient.selected_patient.M_PatientDOB)
+         //console.log(xDate)
+         var xDatenow = moment(new Date(), 'YYYY-MM-DD')
+         //console.log(xDatenow)
+         var validDOB = xDate.isSameOrBefore(xDatenow)
+         //console.log(validDOB)
+         //console.log('dob here btn')
+         var refs = this.$store.state.reference.selected_reference
+         var ordertype = this.$store.state.reference.selected_ordertype
+         if (!this.$store.state.patient.selected_patient.M_PatientID ||
+            !this.$store.state.patient.selected_patient.M_PatientName ||
+            !this.$store.state.patient.selected_patient.M_PatientNoReg ||
+            !this.$store.state.patient.selected_patient.M_PatientDOB ||
+            !this.$store.state.patient.selected_patient.patient_age ||
+            !this.$store.state.doctor.selected_doctor.M_DoctorID ||
+            !this.$store.state.doctor.selected_doctor.M_DoctorName ||
+            this.$store.state.px.selected_test.length < 1 ||
+            !validRSample || !validDOB ||
+            !refs || refs.length === 0 ||
+            !ordertype || !ordertype.M_OrderTypeID)
+         return false;
+
+
+         if (this.$store.state.px.req_status == 'X')
+         return false
+
+         if (this.$store.state.px.req_status == 'N' && this.$store.state.px.reqs.length < 1)
+         return false
+
+         var deliveries = this.$store.state.delivery.data_deliveries
+         var checked_deliveries = _.filter(deliveries, function(o) { return o.chex === 'Y' })
+
+         if (checked_deliveries.length === 0)
+         return false
+
+       
+        
+         return true;
+      },
+
+
+      cito_test : {
+         get () {
+            return this.$store.state.px.cito.test
+         },
+         set (v) {
+            this.$store.commit('px/update_cito', {t:'test', v:v})
+               
+            return
+         }
+      }
+   }
+
+}
+</script>
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegistrationRequirement.vue b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegistrationRequirement.vue
new file mode 100644
index 0000000..0be6ee5
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegistrationRequirement.vue
@@ -0,0 +1,305 @@
+<template>
+   <div>
+
+      <v-layout column pb-2>
+         <v-card mb-2 class="one-fo-requirement">
+            <!--<v-subheader red--text text--lighten-1>
+                <v-layout row wrap>
+                    <v-flex xs3>
+                        <span>JANJI HASIL :</span>
+                    </v-flex>
+                    <v-flex xs3>
+                        <span v-show="!cito_show && is_cito == 'Y'" class="mr-4 blue--text"><a href="javascript:;" class=" blue--text" @click="cito_show=!cito_show"><v-icon small>priority_high</v-icon> {{ selected_cito ? selected_cito.Nat_CitoName : '' }}</a></span>
+                        <v-select
+                            :items="citos"
+                            item-text="Nat_CitoName"
+                            item-value="Nat_CitoID"
+                            return-object
+                            
+                            hide-details
+                            dense
+                            v-model="selected_cito"
+                            height="30"
+                            v-show="cito_show && is_cito == 'Y'"
+                            class="mt-0 pt-0"
+                            append-icon="clear"
+                            @click:append="selected_cito = null"
+                        ></v-select>
+                    </v-flex>
+                    <v-flex xs6 class="text-xs-right">
+                        <span class="red--text">Perkiraan Janji Hasil : {{ appx_schedule }}</span>
+                    </v-flex>
+                </v-layout>
+            </v-subheader>
+
+            <v-divider></v-divider>-->
+
+            <v-layout row wrap>
+                     <v-flex xs12 pt-2>
+                        <v-card color="#f3e595"  outlined flat >
+                            <v-card-text class="pt-2 pb-2">
+                                <v-layout align-center row wrap>
+                                    <v-flex xs6>
+                                        <p v-if="req_status == 'X'" class="mb-0 subtitle-1 font-weight-black">Apakah persyaratan terpenuhi ?</p>
+                                        <p v-if="req_status == 'N'" class="mb-0 subtitle-1 font-weight-black">Pilih salah satu yang belum terpenuhi</p>
+                                        <p v-if="req_status == 'Y'" class="mb-0 subtitle-1 font-weight-black">Mantap ! sudah terpenuhi semua</p>
+                                    </v-flex>
+                                    <v-flex xs6 class="text-xs-right">
+                                       <v-btn small
+                                             :color="req_status == 'N' ? '#ee7777' : 'white'" 
+                                             class="one-btn-icon mr-1 ma-0" 
+                                             :depressed="req_status == 'N' ? true : false"
+                                             :dark="req_status == 'N'"
+                                            @click="reqMeNot">
+                                            <v-icon small>clear</v-icon>
+                                        </v-btn>
+
+                                        <v-btn small
+                                             :color="req_status == 'Y' ? '#40a798' : 'white'" 
+                                             class="one-btn-icon mr-1 ma-0" 
+                                             :dark="req_status == 'Y'"
+                                              :depressed="req_status == 'Y' ? true : false"
+                                            @click="reqMe">
+                                            <v-icon small>done</v-icon>
+                                        </v-btn>
+                                        <!-- <v-btn color="red" class="one-btn-icon mr-1 ma-0" @click="sampleReq" 
+                                            v-show="req_status == 'X' || req_status == 'N'"
+                                            :disabled="req_status != 'X'"
+                                            :dark="req_status == 'X'">
+                                            <v-icon>clear</v-icon>
+                                        </v-btn>
+
+                                        <v-btn color="green" class="one-btn-icon ma-0" @click="sampleReqOK" 
+                                            v-show="req_status == 'X' || req_status == 'Y'"
+                                            :disabled="req_status != 'X'"
+                                            :dark="req_status == 'X'">
+                                            <v-icon>done</v-icon>
+                                        </v-btn> -->
+                                    </v-flex>
+                                </v-layout>
+                            </v-card-text>
+                        </v-card>
+                     </v-flex>
+                    
+                    
+                 </v-layout>
+                 
+                 <v-layout row wrap v-if="req_status != 'N'" class="pl-3 pr-3 pa-2">
+                     <v-flex xs6 v-for="(req, i) in requirements" v-bind:key="i" class="pt-0 pb-1 pr-1 pl-1">
+                                    <v-btn color="black" block small outline class="ma-0 btn-req">{{req.label}}</v-btn>         
+                                </v-flex>
+                    <!-- <v-card flat>
+                       <v-card-text class="pl-3 pr-3 pt-2 pb-2">
+                           <v-layout row wrap>
+                                
+                           </v-layout>
+                          
+                       </v-card-text>
+                    </v-card> -->
+                 </v-layout>
+
+            <v-container fluid v-if="req_status == 'N'" class="pl-2 pr-2 pt-2 pb-2">
+               <v-layout row wrap>
+                  <!-- <one-field-verification v-for="req in requirements" :key="req.idx"
+                                          @input="update_req"
+                                          :value="req" class="xs12 sm10" >
+                  </one-field-verification> -->
+                  <v-flex xs12
+                     v-for="(req, i) in requirements"
+                     v-bind:key="i">
+
+                     <v-checkbox
+                        color="#40a798"
+                        :value="req.req_id"
+                        :label="req.label"
+                        v-model="reqs"
+                        hide-details
+                        class="mt-0"
+                     ></v-checkbox>
+                  </v-flex>
+                  
+               </v-layout>
+            </v-container>
+            <v-divider></v-divider>
+            <v-layout mb-2 row align-center>
+               <v-flex xs6 pl-4  pt-2>
+                 <!-- <v-checkbox
+                     class="mt-0"
+                     color="#40a798"
+                     v-model="received_sample"
+                     style="font-size:12px"
+                     value="Y"
+                     hide-details
+                  ></v-checkbox> -->
+                  <v-switch   class="mt-0" color="#64b2cd" @change="received_sample.time === ''" hide-details v-model="received_sample.flag" value="Y" >
+                      <template v-slot:label>
+                            <span v-if="received_sample.flag === 'Y'" class="font-weight-black" style="color:#64b2cd;font-size:12px;">Hanya terima sample</span>
+                            <span v-if="received_sample.flag !== 'Y'" class="font-weight-black" style="font-size:12px;">Hanya terima sample</span>
+                    </template>
+                  </v-switch>
+               </v-flex>
+               <v-flex  pr-2 pt-2 xs6>
+                   <v-text-field
+                        class="mt-2"
+                        v-model="received_sample.time"
+                        :label="`${label}`"
+                        mask="##-##-#### ##:##"
+                        @blur="checkFormatTime()"
+                        hide-details
+                        placeholder="dd-mm-yyyy hh:mm"
+                        v-if="received_sample.flag === 'Y'"
+                        outline
+                    >
+                    </v-text-field>
+               </v-flex>
+               
+            </v-layout>
+           
+         </v-card>
+      </v-layout>
+   </div>
+</template>
+
+<style scoped>
+div.persyaratan input[type=text]::-webkit-input-placeholder {
+   font-size: 1em;
+}
+div.persyaratan input[type=text] {
+   font-size: .7em;
+}
+div.persyaratan label {
+   color: #f44336!important;
+   font-size: 1.1em;
+   font-weight:400;
+}
+
+.btn-req > .v-btn__content {
+    justify-content: left !important
+}
+</style>
+<script>
+module.exports = {
+    components: {
+        "one-field-verification" : httpVueLoader("./oneFieldVerification.vue")
+    },
+
+    data () {
+        return {
+            cito_show : true,
+            label:'Waktu Pengambilan Sample'
+        }
+    },
+
+    computed: {
+        requirements(){
+            return this.$store.state.px.requirement
+        },
+
+        received_sample : {
+            get () {
+                return this.$store.state.order.received_sample
+            },
+
+            set (v) {
+                if (v == null){
+                    var vx = {}
+                    vx.flag = "N";
+                    vx.time = ''
+                    v = vx
+                    console.log(v)
+                }
+                
+                
+                this.$store.commit("order/update_received_sample", v)
+                return
+            }
+        },
+
+        appx_schedule() {
+            return this.$store.state.px.appx_schedule
+        },
+
+        req_status() {
+            return this.$store.state.px.req_status
+        },
+
+        req_text() {
+            let x = []
+            for (let i in this.requirements)
+                x.push(this.requirements[i].label);
+
+            return x.join(', ')
+        },
+
+        reqs : {
+            get () { return this.$store.state.px.reqs },
+            set (v) { this.$store.commit('px/update_reqs', v) }
+        },
+
+        citos () {
+            return this.$store.state.px.citos
+        },
+
+        selected_cito : {
+            get () { return this.$store.state.px.selected_cito },
+            set (v) { this.$store.commit('px/update_selected_cito', v) }
+        },
+
+        is_cito () {
+            return this.$store.state.px.is_cito
+        }
+    },
+
+    methods: {
+        update_req(val) {
+            
+            let reqs = this.$store.state.px.requirement
+            reqs.forEach(function(r,idx) {
+                if ( val.idx = r.idx ) {
+                reqs[idx] = val 
+                }
+            })
+            this.$store.commit("px/update_requirement", reqs)
+        },
+
+        reqMe() {
+            this.$store.commit('px/update_req_status', 'Y')
+        },
+
+        reqMeNot() {
+            this.$store.commit('px/update_req_status', 'N')
+        },
+
+        checkFormatTime() {
+            // Validasi format waktu (dd-mm-yyyy hh:mm)
+            let timeValue = this.received_sample.time
+            if (timeValue && timeValue.length === 16) {
+                // Format: dd-mm-yyyy hh:mm
+                let parts = timeValue.split(' ')
+                if (parts.length === 2) {
+                    let datePart = parts[0] // dd-mm-yyyy
+                    let timePart = parts[1] // hh:mm
+                    
+                    let dateParts = datePart.split('-')
+                    if (dateParts.length === 3) {
+                        // Validasi format sudah benar, tidak perlu mengubah karena konversi akan dilakukan di order.js
+                        return true
+                    }
+                }
+            }
+            return false
+        }
+    },
+
+    mounted () {
+        this.$store.dispatch('px/search_cito')
+    },
+
+    watch : {
+        is_cito(val, old) {
+            // if (val == "Y" && old == "N")
+            //     this.cito_show = false
+        }
+    }
+}
+</script>
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegistrationTab01.vue b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegistrationTab01.vue
new file mode 100644
index 0000000..201a20c
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegistrationTab01.vue
@@ -0,0 +1,118 @@
+<template>
+    <v-layout row wrap >
+        <v-flex xs12 sm6 class="left" fill-height pa-1>
+            <!-- komponen kiri -->	
+        <patient-left-side></patient-left-side> 
+        <!-- <one-fo-registration-requirement></one-fo-registration-requirement> -->
+        </v-flex>
+
+        <v-flex xs12 sm6  class="right" fill-height pa-1>
+            <!-- komponen kanan -->	
+            <patient-right-side></patient-right-side> 
+        </v-flex>
+        <!-- <v-flex xs12 sm6  class="right" fill-height pa-1>
+            komponen kanan	
+            <v-card class="pa-1">
+            <v-layout column>
+                <v-layout align-center row>
+                    <v-flex xs12>
+                    <v-card tile class="pa-2" flat color="#64b2cd">
+                        <h5 class="subtitle-1 font-weight-bold" style="color:#fff">DETAIL ORDER</h5>
+                    </v-card>
+                    </v-flex>
+                </v-layout>
+            <v-layout column>
+             
+                    <v-layout style="background:#89CFF0" mb-0 mt-1 align-center row>
+                            <v-flex v-if="!cito_show || is_cito !== 'Y'"  xs2>
+        
+                                    <h5 class="mono subtitle-1 pl-2 font-weight-bold">
+                                        
+                                    </h5>
+                                   
+
+                            </v-flex>
+                            <v-flex v-if="!cito_show || is_cito !== 'Y'"  xs10 class="text-xs-right">
+                                <p class="mb-0 pb-1 pt-1 pr-1">
+                                    <kbd class="mr-1" v-for="schedule in schedules">{{getTimeX(schedule)}}</kbd>
+                                </p>
+                            </v-flex>
+                             <v-flex v-if="cito_show && is_cito == 'Y'" xs2>
+                                    <v-btn  dark @click="dialog_cito = true" small color="#ee7777">{{selected_cito.Nat_CitoName}}</v-btn>
+                                    <span class="font-weight-black caption" style="color:#6a6a6a">JANJI HASIL</span>
+
+                            </v-flex>
+                            <v-flex v-if="cito_show && is_cito == 'Y'" xs10 class="text-xs-right">
+                                <p class="mb-0 pb-1 pt-1 pr-1">
+                                    <kbd class="mr-1" v-for="schedule in schedules">{{getTimeX(schedule)}}</kbd>
+                                </p>
+                            </v-flex>
+      
+                    </v-layout>
+      
+            </v-layout>
+            <one-fo-registration-price-list></one-fo-registration-price-list>
+            </v-layout>
+            </v-card>
+        </v-flex> -->
+    </v-layout>
+</template>
+
+<script>
+module.exports = {
+    components : {
+        'patient-left-side' : httpVueLoader('./patientLeftSide.vue'),
+        'patient-right-side' : httpVueLoader('./patientRightSide.vue'),
+        'one-fo-registration-price-list' : httpVueLoader('./oneFoRegistrationPriceList.vue?ts=' 
+            + new Date().toISOString()),
+            'one-fo-registration-requirement' : httpVueLoader('./oneFoRegistrationRequirement.vue')
+    },
+    computed: {
+        schedules() {
+            var xvar = this.$store.state.px.appx_schedule
+            if(xvar)
+                xvar = xvar.split(",")
+            else 
+                xvar = []
+            return xvar
+        },
+        citos () {
+            return this.$store.state.px.citos
+        },
+
+        selected_cito : {
+            get () { return this.$store.state.px.selected_cito },
+            set (v) { this.$store.commit('px/update_selected_cito', v) }
+        },
+
+        is_cito () {
+            return this.$store.state.px.is_cito
+        }
+    },
+    methods: {
+        getTimeX(xtime) {
+            if(xtime)
+                return moment(xtime).format('DD-MM-YYYY HH:mm')
+            else
+                return
+        }
+    },
+    data () {
+        return {
+            cito_show : true,
+            dialog_cito:false
+        }
+    },
+    mounted () {
+        this.$store.dispatch('px/search_cito')
+    },
+
+    watch : {
+        is_cito(val, old) {
+            // if (val == "Y" && old == "N")
+            //     this.cito_show = false
+        }
+    }
+}
+</script>
+
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegistrationTab02.vue b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegistrationTab02.vue
new file mode 100644
index 0000000..782d44f
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegistrationTab02.vue
@@ -0,0 +1,221 @@
+<template>
+    <v-layout row wrap>
+        <v-dialog
+            v-model="dialog_pop_up_error"
+            width="500"
+            >
+
+            <v-card>
+                <v-card-title
+                class="headline grey lighten-2"
+                primary-title
+                >
+                Pesan Error
+                </v-card-title>
+
+                <v-card-text>
+                    {{message_error}}
+                </v-card-text>
+
+                <v-divider></v-divider>
+
+                <v-card-actions>
+                <v-spacer></v-spacer>
+                <v-btn
+                    color="primary"
+                    flat
+                    @click="dialog_pop_up_error = false"
+                >
+                    Saya mengerti
+                </v-btn>
+                </v-card-actions>
+            </v-card>
+            </v-dialog>
+         <v-dialog
+            v-model="dialog_cito"
+            width="500"
+            >
+
+            <v-card >
+                <v-card-title
+                    class="subtitle-1"
+                    color="#64b2cd"
+                >
+                PILIH CITO
+                </v-card-title>
+
+                <v-card-text>
+                    <v-select
+                            :items="citos"
+                            item-text="Nat_CitoName"
+                            item-value="Nat_CitoID"
+                            return-object
+                            
+                            hide-details
+                            dense
+                            v-model="selected_cito"
+                            height="30"
+                            v-show="cito_show && is_cito == 'Y'"
+                            class="mt-0 pt-0"
+                            append-icon="clear"
+                            @click:append="selected_cito = null"
+                        ></v-select>
+                </v-card-text>
+
+                <v-divider></v-divider>
+
+                <v-card-actions>
+                <v-spacer></v-spacer>
+                <v-btn
+                    color="black"
+                    flat
+                    @click="dialog_cito = false"
+                >
+                    Tutup
+                </v-btn>
+                </v-card-actions>
+            </v-card>
+            </v-dialog>
+        <v-flex xs12 sm6 class="left" fill-height pa-1>
+            <!-- komponen kiri -->	
+            <one-mou-px-left></one-mou-px-left> 
+        </v-flex>
+
+        <v-flex xs12 sm6  class="right" fill-height pa-1>
+            <!-- komponen kanan -->	
+            <v-card class="pa-1">
+            <v-layout column>
+                <v-layout align-center row>
+                    <v-flex xs12>
+                    <v-card tile class="pa-2" flat color="#64b2cd">
+                        <h5 class="subtitle-1 font-weight-bold" style="color:#fff">DETAIL ORDER</h5>
+                    </v-card>
+                    </v-flex>
+                </v-layout>
+            <v-layout column>
+             
+                    <v-layout style="background:#89CFF0" mb-0 mt-1 align-center row>
+                            <v-flex v-if="!cito_show || is_cito !== 'Y'"  xs2>
+        
+                                    <h5 class="mono subtitle-1 pl-2 font-weight-bold">
+                                        JANJI HASIL
+                                    </h5>
+                                   
+
+                            </v-flex>
+                            <v-flex v-if="!cito_show || is_cito !== 'Y'"  xs10 class="text-xs-right">
+                                <p v-if="preregister_promise == ''" class="mb-0 pb-1 pt-1 pr-1">
+                                    <span class="mr-1" v-for="schedule in appx_schedule_computed">
+                                        <kbd v-if="schedule.ScheduleID">{{schedule.JanjiHasil}}</kbd>
+                                        <code v-else>{{schedule.JanjiHasil}}</code>
+                                    </span>
+                                </p>
+                                <p v-else class="mb-0 pb-1 pt-1 pr-1">
+                                    <kbd class="mr-1">{{preregister_promise}}</kbd>
+                                </p>
+                            </v-flex>
+                             <v-flex v-if="cito_show && is_cito == 'Y'" xs2>
+                                    <v-btn  dark @click="dialog_cito = true" small color="#ee7777">{{selected_cito.Nat_CitoName}}</v-btn>
+                                    <!--<span class="font-weight-black caption" style="color:#6a6a6a">JANJI HASIL</span>-->
+
+                            </v-flex>
+                            <v-flex v-if="cito_show && is_cito == 'Y'" xs10 class="text-xs-right">
+                                <p class="mb-0 pb-1 pt-1 pr-1">
+                                    <kbd class="mr-1" v-for="schedule in schedules">{{getTimeX(schedule)}}</kbd>
+                                </p>
+                            </v-flex>
+      
+                    </v-layout>
+      
+            </v-layout>
+            <one-fo-registration-price-list></one-fo-registration-price-list>
+            </v-layout>
+            </v-card>
+        </v-flex>
+    </v-layout>
+</template>
+<style scoped>
+.mini-select .v-select__selections {
+    align-items: center;
+    display: flex;
+    flex: 1 1 auto;
+    flex-wrap: wrap;
+    line-height: 10px;
+}
+</style>
+
+<script>
+
+module.exports = {
+    components : {
+        'one-mou-px-left' : httpVueLoader('./oneMouPxLeft.vue'),
+        'one-fo-registration-price-list' : httpVueLoader('./oneFoRegistrationPriceList.vue?ts=' 
+            + new Date().toISOString())
+    },
+    computed: {
+        message_error() {
+            return this.$store.state.order.message_error
+        },
+        dialog_pop_up_error : {
+            get() {
+                return this.$store.state.order.dialog_pop_up_error
+            },
+            set(val) {
+                this.$store.commit('order/update_dialog_pop_up_error', val)
+            }
+        },
+        appx_schedule_computed() {
+            return this.$store.state.px.appx_schedule
+        },
+        preregister_promise() {
+            return this.$store.state.order.preregister_promise
+        },
+        schedules() {
+            var xvar = this.$store.state.px.appx_schedule
+            if(xvar)
+                xvar = xvar.split(",")
+            else 
+                xvar = []
+            return xvar
+        },
+        citos () {
+            return this.$store.state.px.citos
+        },
+
+        selected_cito : {
+            get () { return this.$store.state.px.selected_cito },
+            set (v) { this.$store.commit('px/update_selected_cito', v) }
+        },
+
+        is_cito () {
+            return this.$store.state.px.is_cito
+        }
+    },
+    methods: {
+        getTimeX(xtime) {
+            if(xtime)
+                return moment(xtime).format('DD-MM-YYYY HH:mm')
+            else
+                return
+        }
+    },
+    data () {
+        return {
+            cito_show : true,
+            dialog_cito:false
+        }
+    },
+    mounted () {
+        this.$store.dispatch('px/search_cito')
+    },
+
+    watch : {
+        is_cito(val, old) {
+            // if (val == "Y" && old == "N")
+            //     this.cito_show = false
+        }
+    }
+
+}
+</script>
+
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegistrationTab03.vue b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegistrationTab03.vue
new file mode 100644
index 0000000..6267251
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegistrationTab03.vue
@@ -0,0 +1,25 @@
+<template>
+    <v-layout row wrap>
+        <v-flex xs12 sm6 class="left" fill-height pa-1>
+            <!-- komponen kiri -->	
+            <one-fo-registration-detail-order></one-fo-registration-detail-order> 
+        </v-flex>
+
+        <v-flex xs12 sm6  class="right" fill-height pa-1>
+            <!-- komponen kanan -->	
+            <one-fo-registration-payment></one-fo-registration-payment>
+        </v-flex>
+    </v-layout>
+</template>
+
+<script>
+
+
+module.exports = {
+    components : {
+        'one-fo-registration-detail-order' : httpVueLoader('./oneFoRegistrationDetailOrder.vue'),
+        'one-fo-registration-payment' : httpVueLoader('./oneFoRegistrationPayment2.vue?ts='+Date.now())
+    }
+}
+</script>
+
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegistrationTest.vue b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegistrationTest.vue
new file mode 100644
index 0000000..6ef357f
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoRegistrationTest.vue
@@ -0,0 +1,53 @@
+<template>
+    <v-layout column pb-2>
+        <v-card class="search-test pa-1 mb-0">
+            <!-- <v-card-actions>
+               <v-btn flat :outline="isTab('px')" color="orange" @click="selectTab('px')" >Pemeriksaan</v-btn>
+                <v-btn flat :outline="isTab('panel')" color="orange" @click="selectTab('panel')" >Panel</v-btn>
+                <v-btn flat :outline="isTab('profile')" color="orange" @click="selectTab('profile')" >Profile</v-btn>
+                <v-btn flat :outline="isTab('mou')" color="orange" text-color="red" @click="selectTab('mou')" >MOU *</v-btn>
+            </v-card-actions> -->
+            <v-divider></v-divider>
+            <one-mou-px-mou-info v-if="isTab('mou')">
+            </one-mou-px-mou-info>
+            <one-mou-px-px v-if="isTab('px')">
+            </one-mou-px-px>
+            <one-mou-px-panel v-if="isTab('panel')">
+            </one-mou-px-panel>
+            <one-mou-px-profile v-if="isTab('profile')">
+            </one-mou-px-profile >
+        </v-card>
+   </v-layout>
+</template>
+
+<style scoped>
+</style>
+<script>
+module.exports = {
+   components: {
+      'one-mou-px-mou-info' : httpVueLoader('./oneMouPxMouInfo.vue'),
+       'one-mou-px-px' : httpVueLoader('./oneMouPxPx.vue?ts' + new Date().toISOString() ),
+      'one-mou-px-panel' : httpVueLoader('./oneMouPxPanel.vue'),
+      'one-mou-px-profile' : httpVueLoader('./oneMouPxProfile.vue'),
+   },
+   methods: {
+      isTab(tab) {
+         return this.$store.state.company.selected_px_tab == tab
+      },
+      selectTab(tab) {
+         let prev_tab = this.$store.state.company.selected_px_tab
+         if (tab != this.$store.state.company.selected_px_tab ) {
+            //reset panels tests profiles
+            this.$store.commit('px/update_tests',[])
+            this.$store.commit('px/update_panels',[])
+         }
+         this.$store.commit('company/update_selected_px_tab',tab)
+      }
+   },
+   computed : {
+      selected_px_tab() {
+        return this.$store.state.company.selected_px_tab
+      }
+   }
+}
+</script>
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoStart.vue b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoStart.vue
new file mode 100644
index 0000000..1ee997a
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneFoStart.vue
@@ -0,0 +1,117 @@
+<template>
+  <v-layout row justify-center>
+    <v-dialog v-model="dialog_start" fullscreen persistense hide-overlay transition="dialog-bottom-transition">
+      <v-card>
+        <v-toolbar dark color="primary">
+          <v-btn icon dark @click="dialog = false">
+            <v-icon>close</v-icon>
+          </v-btn>
+          <v-toolbar-title>Settings</v-toolbar-title>
+          <v-spacer></v-spacer>
+          <v-toolbar-items>
+            <v-btn dark flat @click="dialog = false">Save</v-btn>
+          </v-toolbar-items>
+        </v-toolbar>
+        <v-list three-line subheader>
+          <v-subheader>User Controls</v-subheader>
+          <v-list-tile avatar>
+            <v-list-tile-content>
+              <v-list-tile-title>Content filtering</v-list-tile-title>
+              <v-list-tile-sub-title>Set the content filtering level to restrict apps that can be downloaded</v-list-tile-sub-title>
+            </v-list-tile-content>
+          </v-list-tile>
+          <v-list-tile avatar>
+            <v-list-tile-content>
+              <v-list-tile-title>Password</v-list-tile-title>
+              <v-list-tile-sub-title>Require password for purchase or use password to restrict purchase</v-list-tile-sub-title>
+            </v-list-tile-content>
+          </v-list-tile>
+        </v-list>
+        <v-divider></v-divider>
+        <v-list three-line subheader>
+          <v-subheader>General</v-subheader>
+          <v-list-tile avatar>
+            <v-list-tile-action>
+              <v-checkbox v-model="notifications"></v-checkbox>
+            </v-list-tile-action>
+            <v-list-tile-content>
+              <v-list-tile-title>Notifications</v-list-tile-title>
+              <v-list-tile-sub-title>Notify me about updates to apps or games that I downloaded</v-list-tile-sub-title>
+            </v-list-tile-content>
+          </v-list-tile>
+          <v-list-tile avatar>
+            <v-list-tile-action>
+              <v-checkbox v-model="sound"></v-checkbox>
+            </v-list-tile-action>
+            <v-list-tile-content>
+              <v-list-tile-title>Sound</v-list-tile-title>
+              <v-list-tile-sub-title>Auto-update apps at any time. Data charges may apply</v-list-tile-sub-title>
+            </v-list-tile-content>
+          </v-list-tile>
+          <v-list-tile avatar>
+            <v-list-tile-action>
+              <v-checkbox v-model="widgets"></v-checkbox>
+            </v-list-tile-action>
+            <v-list-tile-content>
+              <v-list-tile-title>Auto-add widgets</v-list-tile-title>
+              <v-list-tile-sub-title>Automatically add home screen widgets</v-list-tile-sub-title>
+            </v-list-tile-content>
+          </v-list-tile>
+        </v-list>
+      </v-card>
+    </v-dialog>
+  </v-layout>
+</template>
+
+<style scoped>
+    table.v-table tbody td,table.v-table tbody th {
+        height: 40px;
+    }
+
+    table.v-table thead tr {
+        height: 40px;
+    }
+
+    .one-btn-icon { font-size: 1.5em; float: right }
+</style>
+
+<script>
+module.exports = {
+    computed : {
+        dialog_start: {
+            get() {
+                return this.$store.state.order.dialog_start
+            },
+            set(val) {
+                this.$store.commit('order/update_dialog_start',val)
+            }
+        },
+        status_start: {
+            get() {
+                return this.$store.state.order.status_start
+            },
+            set(val) {
+                this.$store.commit('order/update_status_start',val)
+            }
+        },
+        time_start: {
+            get() {
+                return this.$store.state.order.time_start
+            },
+            set(val) {
+                this.$store.commit('order/update_time_start',val)
+            }
+        }
+    },
+
+    data() {
+        return {
+            
+        };
+    },
+
+    methods : {
+        
+    }
+}
+</script>
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/components/oneMouPxLeft.vue b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneMouPxLeft.vue
new file mode 100644
index 0000000..46e3785
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneMouPxLeft.vue
@@ -0,0 +1,19 @@
+<template>
+   <v-layout column>
+      <one-fo-registration-company></one-fo-registration-company>
+      <one-fo-registration-test></one-fo-registration-test> 
+      <one-fo-registration-requirement></one-fo-registration-requirement>
+   </v-layout>
+</template>
+
+<style scoped>
+</style>
+<script>
+module.exports = {
+   components : {
+       'one-fo-registration-company' : httpVueLoader('./oneFoRegistrationCompany.vue?ts=' + new Date().toISOString() ),
+       'one-fo-registration-test' : httpVueLoader('./oneFoRegistrationTest.vue?ts=' + new Date().toISOString() ),
+      'one-fo-registration-requirement' : httpVueLoader('./oneFoRegistrationRequirement.vue?ts=' + new Date().toISOString() )
+   }
+}
+</script>
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/components/oneMouPxMouInfo.vue b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneMouPxMouInfo.vue
new file mode 100644
index 0000000..a6ece32
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneMouPxMouInfo.vue
@@ -0,0 +1,29 @@
+<template>
+   <v-card-text class="pa-0">
+      <v-layout align-center row>
+         <v-flex xs12>
+            <v-card tile class="pa-2" flat color="#64b2cd">
+               <h5 class="subtitle-1 font-weight-bold">KEL. PELANGGAN DAN AGREEMENT</h5>
+            </v-card>
+         </v-flex>
+      </v-layout>
+      <div v-if="!mou.M_MouCompanyName">
+         Belum ada agreement yang di pilih
+      </div>
+      <div v-if="mou.M_MouCompanyName">
+         Agreement   : {{mou.M_MouCompanyName}} <br/>
+         Start : {{mou.M_MouCompanyStartDate}} <br/>
+         End   : {{mou.M_MouCompanyEndDate}} <br/>
+         Note  : {{mou.M_MouCompanyNote}} <br/>
+      </div>
+   </v-card-text>
+</template>
+<script>
+module.exports = {
+   computed : {
+      mou() {
+         return this.$store.state.company.selected_mou
+      }
+   }
+}
+</script>
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/components/oneMouPxPanel.vue b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneMouPxPanel.vue
new file mode 100644
index 0000000..44d337a
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneMouPxPanel.vue
@@ -0,0 +1,109 @@
+<template>
+   <v-card-text>
+      <v-layout row >
+         <v-flex xs6 class="pa-0 ma-0" >
+            <v-text-field
+               label="Panel"
+               placeholder="Cari Panel"
+               @change="search"
+               class="ma-0"
+               outline
+               >
+            </v-text-field>
+         </v-flex>
+            <v-flex xs6 class="pa-3">
+               <v-label >
+                  Panel found {{panel_count}}, display {{ panel_count < 20 ? panel_count : 20  }}
+               </v-label>
+            </v-flex>
+      </v-layout>
+      <v-container grid-list-xs text-xs-center pa-0>
+         <v-layout row wrap>
+            <v-btn xs3 v-for="p in panels" :key="p.T_TestPanelID" 
+                       @click="selectPanel(p)"
+                       depressed small color="error">
+               {{p.T_TestPanelName}}
+            </v-btn>
+         </v-layout>
+      </v-container>
+   </v-card-text>
+</template>
+<script>
+module.exports = {
+   methods: {
+      search(val) {
+         if (this.prev_val == val ) return
+         this.prev_val = val
+         this.$store.commit("px/update_search_panel",val)  
+         this.$store.dispatch("px/panel")  
+      },
+      update_req(px) {
+         if (px.T_TestRequirement != '' ) {
+            let reqs = this.$store.state.px.requirement
+            if (! _.find(reqs, function(r) { return r.label == px.T_TestRequirement; }) ) {
+               reqs.push({
+                  label: px.T_TestRequirement,
+                  is_error: true,
+                  checked : false,
+                  error_message: 'Hasil harus di isi',
+                  note: ''
+               })
+            }
+            this.$store.commit('px/update_requirement',reqs)
+         }
+      },
+      selectPanel(panel) {
+         try {
+            let selected_panel = this.$store.state.px.selected_panel
+            let flag_found = false
+            selected_panel.forEach( function(p,idx) {
+               if (panel.T_TestPanelID == p.T_TestPanelID) {
+                  selected_panel[idx] = panel
+                  flag_found = true
+               }
+            })
+            if (!flag_found) {
+               let f_update_req = this.update_req
+               selected_panel.push(panel)
+               panel.test.forEach(function(px){
+                  f_update_req(px)
+               })
+            }
+            this.$store.commit('px/update_selected_panel',selected_panel)
+            let panels = this.$store.state.px.panels
+            let p_idx= -1
+            panels.forEach( function(p,idx) {
+               if (p.T_TestPanelID == panel.T_TestPanelID) p_idx = idx
+            })
+            if (p_idx >= 0 ) {
+               _.pullAt(panels,[p_idx]) 
+               let dt = {
+                  records: panels,
+                  total : panels.length
+               }
+               this.$store.commit('px/update_panels',dt)
+            }
+         } catch(e) {
+            console.log(e)
+         }
+      }
+   },
+   computed: {
+      panel_count() {
+         return this.$store.state.px.total_panel
+      },
+      panels() {
+         console.log('get panels')
+         return this.$store.state.px.panels
+      },
+      is_loading() {
+         return this.$store.state.px.search_panel_status == 1
+      }
+   },
+   data: function(){
+      return {
+         prev_val: ''
+      }
+   }
+}
+</script>
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/components/oneMouPxProfile.vue b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneMouPxProfile.vue
new file mode 100644
index 0000000..d9496d2
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneMouPxProfile.vue
@@ -0,0 +1,220 @@
+
+<template>
+   <v-card-text>
+      <v-layout row >
+         <v-text-field
+            placeholder="ketikkan profile..."
+            class="pt-0"
+            v-model="search"
+            @keyup.enter="do_search"
+            >
+         </v-text-field>
+      </v-layout>
+         <v-layout row wrap>
+            
+            <v-flex xs3 v-for="(profile, idx) in profiles" v-bind:key="idx">
+               <v-layout row>
+                  <v-flex>
+                     <v-btn depressed small color="error" class="mr-0 btn-profile" :disabled="profile.err > 0" :dark="profile.err < 1" block @click="selectPx(profile.detail)">{{ profile.T_ProfileName }}</v-btn>
+                  </v-flex>
+                  <v-flex>
+                     <v-btn depressed small icon color="red lighten-2" dark class="ml-0" @click="profile_detail(profile)"><v-icon>search</v-icon></v-btn>
+                  </v-flex>
+               </v-layout>
+               
+               
+            </v-flex>
+
+            <v-snackbar
+               v-model="snackbar"
+               top
+            >
+               {{ err_text }}
+               <v-btn color="red" flat @click="snackbar = false" >
+                  Close
+               </v-btn>
+            </v-snackbar>
+
+            <v-dialog
+               v-model="profile_detail_dialog"
+               width="500"
+            >
+               <v-card>
+                  <v-card-title
+                     class="headline grey lighten-2"
+                     primary-title
+                  >
+                     {{ profile_detail_title }}
+                  </v-card-title>
+
+                  <v-card-text>
+                     <v-layout row wrap>
+                        <v-flex xs6 v-for="(px, i) in profile_detail_px" v-bind:key="i" pa-1>
+                           <v-btn color="orange" block dark>{{ px.T_TestName }}</v-btn>
+                        </v-flex>
+                     </v-layout>
+                     
+                  </v-card-text>
+                  <v-divider></v-divider>
+                  <v-card-actions>
+                     
+                     <v-btn
+                        color="primary"
+                        flat
+                        @click="profile_detail_dialog = false"
+                     >
+                        Tutup
+                     </v-btn>
+                     <v-spacer></v-spacer>
+                     <v-btn color="red" dark>Tambahkan ke Order</v-btn>
+                  </v-card-actions>
+               </v-card>
+            </v-dialog>
+
+         </v-layout>
+   </v-card-text>
+</template>
+<style scoped>
+.v-btn--icon {
+   border-radius: 0px
+}
+
+.btn-profile {
+   border-top-right-radius: 0%;
+   border-bottom-right-radius: 0%;
+}
+</style>
+
+<script>
+module.exports = {
+   data () {
+      return {
+         snackbar: false,
+         err_text: "",
+
+         profile_detail_dialog: false,
+         profile_detail_text: '',
+         profile_detail_title: 'SGPT',
+
+         profile_detail_px: []
+      }
+   },
+
+   computed : {
+      profiles () {
+         return this.$store.state.px.profiles
+      },
+
+      search : {
+         get () {
+            return this.$store.state.px.search_profile
+         },
+         set (v) {
+            this.$store.commit('px/update_search_profile', v)
+         }
+      }
+   },
+
+   methods : {
+      do_search() {
+         this.$store.dispatch('px/profile')
+      },
+
+      selectPx(pxs) {
+         let flag_found = false
+         let flag_name = ""
+         let selected_test = this.$store.state.px.selected_test
+
+         for (let i in pxs) {
+            var px = pxs[i]            
+            selected_test.forEach( function(t, idx) {
+               if (t.T_TestID == px.T_TestID) {
+                  flag_found = true
+                  flag_name = t.T_TestName
+               }
+            })
+         }
+
+         if (flag_found) {
+            this.err_text = "Tidak bisa menambahkan Profile. Pemeriksaan " + flag_name + " sudah ada !"
+            this.snackbar = true
+            return
+         }
+
+         for (let i in pxs) {
+            var px = pxs[i]
+
+            try {
+               // if (in_selectPx) return
+               // in_selectPx = true
+
+               // let selected_test = this.$store.state.px.selected_test
+               flag_found = false
+               // let flag_found = false
+               // selected_test.forEach( function(t, idx) {
+               //    if (t.T_TestID == px.T_TestID) {
+               //       selected_test[idx] = px 
+               //       flag_found = true
+               //    }
+               // })
+
+               if (!flag_found) {
+                  selected_test.push(px)
+
+                  // let tests = this.$store.state.px.tests
+                  // let p_idx = -1
+                  // tests.forEach(function(t,idx) {
+                  //    if (t.T_TestID == px.T_TestID) {
+                  //       p_idx = idx
+                  //    }
+                  // })
+                  // if (p_idx >= 0 ) {
+                  //    _.pullAt(tests,[p_idx]) 
+                  //    let dt = {
+                  //       records: tests,
+                  //       total: tests.length
+                  //    }
+                  //    this.$store.commit('px/update_tests',dt)
+                  // }
+               }
+
+               this.$store.commit('px/update_selected_test', selected_test)
+               if (px.T_TestRequirement != '' ) {
+                  let reqs = this.$store.state.px.requirement
+                  let rst =  _.find(reqs, function(r) { return r.label == px.T_TestRequirement; }) 
+                  if ( rst == undefined ) {
+                     reqs.push({
+                        px_id: px.T_TestID,
+                        label: px.T_TestRequirement,
+                        error_message: 'Hasil harus di isi',
+                        is_error: true,
+                        checked : false,
+                        note: ''
+                     })
+                  }
+
+                  this.$store.commit('px/update_requirement', reqs)
+
+                  // Update Janji Hasil
+                  this.$store.dispatch('px/appx_schedule')
+               }
+
+               // in_selectPx = false
+            } catch(e) {
+               console.log(e)
+               // in_selectPx = false
+            }
+
+         }
+         
+      },
+
+      profile_detail (profile) {
+         this.profile_detail_title = profile.T_ProfileName
+         this.profile_detail_text = JSON.stringify(profile.detail)
+         this.profile_detail_px = profile.detail
+         this.profile_detail_dialog = true
+      }
+   }
+}
+</script>
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/components/oneMouPxPx.vue b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneMouPxPx.vue
new file mode 100644
index 0000000..8cc6c75
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneMouPxPx.vue
@@ -0,0 +1,342 @@
+<template>
+   <v-card-text class="pa-0">
+      <v-layout column>
+         <v-layout align-center row>
+            <v-flex xs12>
+               <v-card tile class="pa-2" flat color="#64b2cd">
+                  <h5 style="color:#fff" class="subtitle-1 font-weight-bold">PEMERIKSAAN</h5>
+               </v-card>
+            </v-flex>
+         </v-layout>
+         <v-layout mt-1 align-row row>
+            <v-flex xs12 class="pl-1 pt-1 pr-1 ma-0" >
+               <v-text-field
+                  placeholder="Ketikkan pemeriksaan ..."
+                  @change="search"
+                  class="ma-0"
+                  single-line
+                  clearable
+                  outline
+                  hide-details
+                  
+                  >
+               </v-text-field>
+            </v-flex>
+            
+         </v-layout>
+         <v-layout row >
+            <v-flex xs6 pl-1  pr-1>
+               <p  class="mb-0 mt-2 mono caption">Tekan <kbd>enter</kbd> untuk memulai pencarian</p>
+            </v-flex>
+            <v-flex xs6 pl-1  pr-1 >
+               <!--<p class="mb-0 pa-1 text-xs-right caption">
+                     <v-icon small>search</v-icon> Ditemukan data sebanyak <kbd style="background:#64b2cd">{{test_count}}</kbd> pemeriksaan
+               </p>-->
+            </v-flex>
+         </v-layout>
+         <v-divider class="mt-2 mb-2"></v-divider>
+         <v-progress-linear class="ma-0 pa-0" indeterminate :active="is_loading" color="primary" />
+      </v-layout>
+         <v-layout pl-1 pr-1 row wrap>
+             <v-flex xs6 v-for="test in tests"  v-if="!selected_test(test)" :key="test.T_TestPriceID">
+                <!--<v-btn block
+          
+                       @click="selectPx(test)"
+                       depressed small :color="px_color(test.px_type)" dark
+                       outline
+                       class="ma-0 btn-px"
+                      
+                       >
+                {{test.T_TestName}}
+                </v-btn>     -->
+                <v-layout style="cursor:pointer" align-center @click="selectPx(test)" row>
+                   <v-flex xs12>
+                     <v-card  v-if="test.px_type !== 'PN' && test.px_type !== 'PR'" color="#ee7777" dark class="pa-2 ma-1"  >
+                        <p class="mb-0 caption">{{test.code}} | {{test.T_TestName}}</p>
+                     </v-card>
+                     <v-card  v-if="test.px_type === 'PN'" color="#40a798" dark class="pa-2 ma-1"  >
+                        <p class="mb-0 caption">{{test.code}} | {{test.T_TestName}}</p>
+                     </v-card>
+                      <v-card  v-if="test.px_type === 'PR'" color="#7c73e6" dark class="pa-2 ma-1"  >
+                        <p class="mb-0 caption">{{test.code}} | {{test.T_TestName}}</p>
+                     </v-card>
+                   </v-flex>
+                </v-layout>
+             </v-flex>
+            
+         </v-layout>
+         <v-divider class="mt-4 mb-2"></v-divider>
+   </v-card-text>
+</template>
+<style scoped>
+.btn-px > .v-btn__content {
+    justify-content: left !important
+}
+</style>
+
+<script>
+let in_selectPx = false
+module.exports = {
+   methods: {
+      selected_test(x_px){
+         var nat_tests = this.$store.state.px.nat_test
+         var found_nt = false
+         x_px.nat_test.forEach(function(entry) {
+            if (nat_tests.indexOf(entry) !== -1)
+                  found_nt = true
+         })
+         return found_nt
+      },
+      search(val) {
+         if ( val == this.prev_search ) return
+         console.log('Searching',val)
+         this.prev_search = val
+         this.$store.commit("px/update_search",val)  
+         this.$store.dispatch("px/search") 
+      },
+      keyup(e) {
+           //this.showhint = true
+            if (e.which==13) {
+                if (!window.one_token()) {
+                    this.$store.commit('update_message_error', 'Maaf, koneksi Anda sempat terputus silahkan Log Out dan Login kembali')
+                    this.$store.commit('update_dialog_error', true)
+                    return
+                }
+                
+                //this.$store.commit('patient/update_current_page',1)
+               if ( this.search == this.prev_search ) return
+               console.log('Searching',this.search)
+               this.prev_search = this.search
+               in_selectPx = false
+               console.log(in_selectPx)
+               //this.$store.commit("px/update_search",val)  
+               this.$store.dispatch("px/search") 
+            }
+        },
+      
+      async selectPx(px) {
+         console.log(px)
+         //debugger
+         console.log("start select px")
+            if (!window.one_token()) {
+                this.$store.commit('update_message_error', 'Maaf, koneksi Anda sempat terputus silahkan Log Out dan Login kembali')
+                this.$store.commit('update_dialog_error', true)
+                return
+            }
+                
+
+         try {
+            console.log(in_selectPx)
+            // START LOADING
+            this.$store.commit('update_dialog_loading', true)
+
+            // IF PROFILE
+            if (px.px_type == "PR" || px.px_type == "PXR" || px.px_type == "PN")
+               return await this.selectProfile(px)
+
+            // SEARCH NAT TEST
+            let nt = this.$store.state.px.nat_test
+            let found_nt = false
+            for (let i in px.nat_test) {
+               if (nt.indexOf(px.nat_test[i]) > -1)
+                  found_nt = true
+            }
+
+            if (found_nt) {
+                alert('Pemeriksaan tersebut sudah ada !')
+                // END LOADING
+                this.$store.commit('update_dialog_loading', false)
+                return
+            }
+
+            //if (in_selectPx) return
+            in_selectPx = true
+            let selected_test = this.selected_test_computed
+            let flag_found = false
+            selected_test.forEach( function(t,idx) {
+               if (t.T_TestID == px.T_TestID) {
+                  selected_test[idx] = px 
+                  flag_found = true
+               }
+            })
+            if (!flag_found) {
+               selected_test.push(px)
+               let tests = this.$store.state.px.tests
+               let p_idx = -1
+               tests.forEach(function(t,idx) {
+                  if (t.T_TestID == px.T_TestID) {
+                     p_idx = idx
+                  }
+               })
+               if (p_idx >= 0 ) {
+                  _.pullAt(tests,[p_idx]) 
+                  let dt = {
+                     records: tests,
+                     total: tests.length
+                  }
+                  this.$store.commit('px/update_tests',dt)
+               }
+            }
+            this.selected_test_computed = selected_test
+         
+            await this.processPxRequirements(px)
+            
+            
+
+            this.$store.dispatch('px/appx_schedule')
+
+            in_selectPx = false
+            this.$store.commit('px/update_nat_test')
+
+            // END LOADING
+            if (px.px_type == "PN")
+               this.$store.dispatch('px/packet_reqs',{pxs:px.child_test})
+            this.$store.commit('update_dialog_loading', false)
+         } catch(e) {
+            console.log(e)
+            in_selectPx = false
+         }
+      },
+
+      async selectProfile(px) {
+         try {
+             
+            // SEARCH NAT TEST
+            let nt = this.$store.state.px.nat_test
+            let found_nt = false
+            for (let i in px.nat_test) {
+               if (nt.indexOf(px.nat_test[i]) > -1)
+                  found_nt = true
+            }
+
+            if (found_nt) {
+               alert('Pemeriksaan tersebut sudah ada !')
+                // END LOADING
+                this.$store.commit('update_dialog_loading', false)
+               return
+            }
+
+            let pxs = px.child_test
+            
+            for (let i in pxs) {
+               px = pxs[i]
+               
+               let selected_test = this.selected_test_computed
+               let flag_found = false
+
+               selected_test.push(px)
+               let tests = this.$store.state.px.tests
+               let p_idx = -1
+               tests.forEach(function(t,idx) {
+                  if (t.T_TestID == px.T_TestID) {
+                     p_idx = idx
+                  }
+               })
+               
+               if (p_idx >= 0 ) {
+                  _.pullAt(tests,[p_idx]) 
+                  let dt = {
+                     records: tests,
+                     total: tests.length
+                  }
+                  this.$store.commit('px/update_tests',dt)
+               }
+               
+               this.selected_test_computed = selected_test
+
+               await this.processPxRequirements(px)
+            }
+            
+            this.$store.dispatch('px/appx_schedule')
+            in_selectPx = false
+            this.$store.commit('px/update_nat_test')
+
+            // END LOADING
+            this.$store.commit('update_dialog_loading', false)
+
+         } catch(e) {
+            console.log(e)
+            // END LOADING
+            this.$store.commit('update_dialog_loading', false)
+            in_selectPx = false
+         }
+      },
+
+      async processPxRequirements(px) {
+         // Ambil requirement dari BE jika belum ada atau kosong
+         let req = px.requirement
+         if (!req || req.length === 0) {
+            req = await this.$store.dispatch('px/get_requirement', px.T_TestID)
+         }
+         
+         let reqs = this.$store.state.px.requirement
+         if (req && req.length > 0) {
+            for(let i in req) {
+               let found = false
+               for(let j in reqs) {
+                  if (reqs[j]['req_id'] == req[i]['req_id'])
+                     found = j
+               }
+
+               if (!found)
+                  reqs.push({
+                     px_id: [px.T_TestID],
+                     label: req[i]['req_name'],
+                     error_message: 'Hasil harus di isi',
+                     is_error: true,
+                     checked : false,
+                     note: '',
+                     req_id: req[i]['req_id']
+                  })
+               else
+                  reqs[found].px_id.push(px.T_TestID)
+            }
+
+            this.$store.commit('px/update_requirement', reqs)
+         }
+      },
+
+      px_color (x) {
+         if (x == "PR")
+            return "green"
+         else if (x == "PN")
+            return "orange"
+         else
+            return "error"
+      }
+   },
+   computed: {
+      selected_test_computed : {
+         get() {
+            return this.$store.state.px.selected_test
+         },
+         set(val) {
+            this.$store.commit('px/update_selected_test', val)
+            //this.$store.dispatch('px/get_promise_by_pxs', val)
+         }
+      },
+      test_count() {
+         return this.$store.state.px.total_test
+      },
+      display_count() {
+         return this.tests.length
+      },
+      tests() {
+         return this.$store.state.px.tests
+      },
+      is_selectPx() {
+         return in_selectPx
+      },
+      is_loading() {
+         return this.$store.state.px.search_status == 1
+      }
+   },
+   data: function(){
+      return {
+         search_val:false,
+         search_flag:false,
+         prev_search : ''
+      }
+   }
+}
+</script>
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/components/oneRegistrationTab.vue b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneRegistrationTab.vue
new file mode 100644
index 0000000..214c59f
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/components/oneRegistrationTab.vue
@@ -0,0 +1,185 @@
+<template>
+<div>
+    <!--<v-layout>
+        <v-flex xs12 text-xs-center mb-2>
+            <v-card color="blue lighten-4">
+                <v-card-text class="pb-0 pt-1">
+                    <v-btn
+                        v-for="tab in tabs"
+                        :color="tab.code == active ? 'black' : 'grey lighten-5'"
+                        class="black--text ma-0 tab-btn"
+                        :class="[tab.code == active ? 'active' : '']"
+                        @click="changeTab(tab.code)"
+                        flat
+                        :key="tab.code"
+                        :data="tab"
+                        :disabled="!tab.enabled"
+                        >
+                        <h6 class="title">{{ tab.label }}</h6>
+                    </v-btn>
+                </v-card-text>    
+            </v-card>
+        </v-flex>
+    </v-layout>-->
+    <v-layout mt-0 v-if="active == '01'" row>
+        <v-flex ml-1 mr-1 mb-1 xs12>
+            <v-card color="teal lighten-3">
+                <v-layout row>
+                    <v-flex ml-2 mt-1 mr-1 mb-1 xs6>
+                        <v-btn block  
+                            depressed
+                            @click="changeTab('01')"
+                            class="font-weight-black text-mono"
+                            style="color:#fff!important"
+                            color="teal lighten-2">
+                            DEMOGRAFI
+                        </v-btn>
+                    </v-flex>
+                    <v-flex ml-1 mt-1 mr-1 mb-1 xs6>
+                        <v-btn block 
+                            flat
+                            @click="changeTab('02')"
+                            class="font-weight-black text-mono"
+                            style="background:#fff!important"
+                            color="#3c70a4">
+                            PEMERIKSAAN
+                        </v-btn>
+                    </v-flex>
+                    <!-- <v-flex ml-1 mt-1 mr-2 mb-1 xs4>
+                        <v-btn block 
+                            flat
+                            style="background:#fff!important"
+                           
+                            class="font-weight-black text-mono"
+                            color="#9e9e9e">
+                            PEMBAYARAN
+                        </v-btn>
+                    </v-flex> -->
+                </v-layout>
+            </v-card>
+        </v-flex>
+    </v-layout>
+    <v-layout mt-0 v-if="active == '02'" row>
+        <v-flex ml-1 mr-1 mb-1 xs12>
+            <v-card color="#64b2cd">
+                <v-layout row>
+                    <v-flex ml-2 mt-1 mr-1 mb-1 xs6>
+                        <v-btn block  
+                            depressed
+                            flat
+                            @click="changeTab('01')"
+                            style="background:#fff!important"
+                            class="font-weight-black text-mono"
+                            color="teal">
+                            DEMOGRAFI
+                        </v-btn>
+                    </v-flex>
+                    <v-flex ml-1 mt-1 mr-1 mb-1 xs6>
+                        <v-btn block 
+                            depressed
+                            @click="changeTab('02')"
+                            class="font-weight-black text-mono"
+                            style="color:#fff!important"
+                            color="#3c70a4">
+                            PEMERIKSAAN
+                        </v-btn>
+                    </v-flex>
+                    <!-- <v-flex ml-1 mt-1 mr-2 mb-1 xs4>
+                        <v-btn block 
+                            depressed
+                            flat
+                            
+                            style="background:#fff!important"
+                            class="font-weight-black text-mono"
+                            color="#9e9e9e">
+                            PEMBAYARAN
+                        </v-btn>
+                    </v-flex> -->
+                </v-layout>
+            </v-card>
+        </v-flex>
+    </v-layout>
+    <v-layout mt-0 v-if="active == '03'" row>
+        <v-flex ml-1 mr-1 mb-1 xs12>
+            <v-card color="#ffeaa5">
+                <v-layout row>
+                    <v-flex ml-2 mt-1 mr-1 mb-1 xs6>
+                        <v-btn block  
+                            depressed
+                            flat
+                            style="background:#fff!important"
+                           
+                            class="font-weight-black text-mono"
+                            color="#9e9e9e">
+                            DEMOGRAFI
+                        </v-btn>
+                    </v-flex>
+                    <v-flex ml-1 mt-1 mr-1 mb-1 xs6>
+                        <v-btn block 
+                            depressed
+                            flat
+                            style="background:#fff!important"
+                           
+                            class="font-weight-black text-mono"
+                            color="#9e9e9e">
+                            PEMERIKSAAN
+                        </v-btn>
+                    </v-flex>
+                    <!-- <v-flex ml-1 mt-1 mr-2 mb-1 xs4>
+                        <v-btn block 
+                            depressed
+                            @click="changeTab('03')"
+                            style="color:#fff!important"
+                            class="font-weight-black text-mono"
+                            color="#e16262">
+                            PEMBAYARAN
+                        </v-btn>
+                    </v-flex> -->
+                </v-layout>
+            </v-card>
+        </v-flex>
+    </v-layout>
+    </div>
+</template>
+
+<style scoped>
+.active {
+    border-bottom: solid 7px #000066!important;
+}
+
+.tab-btn {
+    min-width: 400px;
+}
+</style>
+
+<script>
+module.exports = {
+    data () {
+        return {
+            
+        }
+    },
+
+    methods : {
+        changeTab (x) {
+            // this.active = x;
+            this.$store.commit('change_tab', x);
+        }
+    },
+
+    computed : {
+        tabs : {
+            get () {
+                return this.$store.state.order.tabs
+            },
+            set (v) {
+                return
+            }
+        },
+
+        active () {
+            return this.$store.state.tab_active
+        }
+    }
+}
+</script>
\ No newline at end of file
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/components/patientDataNasional.vue b/test/vuex/one-fo-registration-walk-in-stemcell/components/patientDataNasional.vue
new file mode 100644
index 0000000..030a10c
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/components/patientDataNasional.vue
@@ -0,0 +1,257 @@
+<template>
+    <v-layout row justify-center>
+      <v-dialog v-model="dialog_national" persistent :width="width_screen" hide-overlay transition="dialog-bottom-transition">
+
+
+            <div class="view" :style="{'min-height':height_screen}">
+                <div class="wrapper">
+                    <table  :style="{'height':height_screen}" style="background:white" class="table">
+                    <thead>
+                        <tr>
+                            <th class="sticky-col first-col">Nama</th>
+                            <th width="150px">No. Identitas</th>
+                            <th width="100px">Jenis kelamin</th>
+                            <th width="180px">Tempat Lahir</th>
+                            <th width="150px">Tanggal Lahir</th>
+                            <th width="100px">Agama</th>
+                            <th width="150px">No. HP</th>
+                            <th width="150px">Email</th>
+                            <th width="150px">Pekerjaan</th>
+                            <th width="150px">No Induk Pegawai</th>
+                            <th width="150px">Jabatan</th>
+                            <th width="150px">Kedudukan</th>
+                            <th width="150px">Penanggung Jawab</th>
+                            <th width="150px">Lokasi</th>
+                            <th width="200px">Catatan</th>
+                            <th width="350px">Alamat</th>
+                        </tr>
+                    </thead>
+                    <tbody>
+                        <tr v-for="patient in patients">
+                            <td class="sticky-col first-col">
+                                <p><span v-if="patient.M_PatientPrefix">{{patient.M_PatientPrefix}}</span> <span v-if="patient.M_PatientName">{{patient.M_PatientName}}</span> <span v-if="patient.M_PatientSuffix">{{patient.M_PatientSuffix}}</span></p>
+                            </td>
+                            <td>
+                                <p><span v-if="patient.M_IdTypeName">{{patient.M_IdTypeName}}</span> <span v-if="patient.M_PatientIDNumber">{{patient.M_PatientIDNumber}}</span></p>
+                            </td>
+                            <td>
+                                <p><span v-if="patient.M_SexName">{{patient.M_SexName}}</span></p>
+                            </td>
+                            <td>
+                                <p><span v-if="patient.M_PatientPOB">{{patient.M_PatientPOB}}</span></p>
+                            </td>
+                            <td>
+                                <p><span v-if="patient.M_PatientDOB">{{patient.M_PatientDOB}}</span></p>
+                            </td>
+                            <td>
+                                <p><span v-if="patient.M_ReligionName">{{patient.M_ReligionName}}</span></p>
+                            </td>
+                            <td>
+                                <p><span v-if="patient.M_PatientHP">{{patient.M_PatientHP}}</span></p>
+                            </td>
+                            <td>
+                                <p><span v-if="patient.M_PatientEmail">{{patient.M_PatientEmail}}</span></p>
+                            </td>
+                            <td>
+                                <p><span v-if="patient.M_PatientJob">{{patient.M_PatientJob}}</span></p>
+                            </td>
+                            <td>
+                                <p><span v-if="patient.M_PatientNIK">{{patient.M_PatientNIK}}</span></p>
+                            </td>
+                            <td>
+                                <p><span v-if="patient.M_PatientJabatan">{{patient.M_PatientJabatan}}</span></p>
+                            </td>
+                            <td>
+                                <p><span v-if="patient.M_PatientKedudukan">{{patient.M_PatientKedudukan}}</span></p>
+                            </td>
+                            <td>
+                                <p><span v-if="patient.M_PatientPJ">{{patient.M_PatientPJ}}</span></p>
+                            </td>
+                            <td>
+                                <p><span v-if="patient.M_PatientLocation">{{patient.M_PatientLocation}}</span></p>
+                            </td>
+                            <td>
+                                <p><span v-if="patient.M_PatientNote">{{patient.M_PatientNote}}</span></p>
+                            </td>
+                            <td>
+                                
+                            </td>
+                        </tr>
+                        
+                     
+                    </tbody>
+                    </table>
+                </div>
+            </div>
+       
+      </v-dialog>
+    </v-layout>
+</template>
+<style scoped>
+table {
+  border-collapse: collapse;
+  border-spacing: 0;
+  border: 1px solid #ddd;
+}
+
+th, td {
+  text-align: left;
+  padding: 16px;
+}
+
+tr:nth-child(even) {
+  background-color: #f2f2f2;
+}
+.view {
+  margin: auto;
+  width: 300px;
+}
+
+.wrapper {
+  position: relative;
+  overflow: auto;
+  border: 1px solid black;
+  white-space: nowrap;
+  background: white;
+}
+
+.sticky-col {
+  position: -webkit-sticky;
+  position: sticky;
+  background-color: grey !important;
+  color:white;
+}
+
+.first-col {
+  width: 100px;
+  min-width: 100px;
+  max-width: 100px;
+  left: 0px;
+}
+
+.second-col {
+  width: 150px;
+  min-width: 150px;
+  max-width: 150px;
+  left: 100px;
+}
+</style>
+
+<script>
+module.exports = {
+	components : {
+        //'patient-search-box' : httpVueLoader('./patientSearchBox.vue'),
+       // 'patient-detail': httpVueLoader('./patientDetail.vue'),
+       // 'patient-notes' : httpVueLoader('./patientNotes.vue'),
+        
+    },
+    data() {
+        return {
+            width_screen : screen.width+' px',
+            height_screen : screen.height+' px',
+            patients:[
+                        {
+                            "M_PatientID": "874247",
+                            "M_PatientNoReg": "LAB0069899",
+                            "M_PatientPrefix": null,
+                            "M_PatientName": "DENNY HANDOYO",
+                            "M_PatientSuffix": null,
+                            "M_PatientHP": "082333349448",
+                            "M_PatientEmail": "",
+                            "M_PatientPOB": "SURABAYA",
+                            "M_PatientPhone": "",
+                            "M_PatientIDNumber": "3578170804790005",
+                            "M_PatientDOB": "08-04-1979",
+                            "M_PatientNote": "",
+                            "M_PatientNIK": null,
+                            "M_PatientJabatan": null,
+                            "M_PatientKedudukan": null,
+                            "M_PatientPJ": null,
+                            "M_PatientLocation": null,
+                            "M_PatientJob": null,
+                            "M_PatientM_SexID": "1",
+                            "M_SexName": "Laki - Laki ",
+                            "M_PatientM_TitleID": "2",
+                            "M_TitleName": "Tn",
+                            "M_PatientM_ReligionID": "0",
+                            "M_ReligionName": null,
+                            "M_PatientM_IdTypeID": "1",
+                            "M_IdTypeName": "KTP",
+                            "status": "active"
+                        },
+                        {
+                            "M_PatientID": "879989",
+                            "M_PatientNoReg": "LAB0075641",
+                            "M_PatientPrefix": null,
+                            "M_PatientName": "DENNY HANDOYO",
+                            "M_PatientSuffix": null,
+                            "M_PatientHP": "082333349448",
+                            "M_PatientEmail": "",
+                            "M_PatientPOB": "SURABAYA",
+                            "M_PatientPhone": "",
+                            "M_PatientIDNumber": "3578170804790005",
+                            "M_PatientDOB": "08-04-1979",
+                            "M_PatientNote": "",
+                            "M_PatientNIK": null,
+                            "M_PatientJabatan": null,
+                            "M_PatientKedudukan": null,
+                            "M_PatientPJ": null,
+                            "M_PatientLocation": null,
+                            "M_PatientJob": null,
+                            "M_PatientM_SexID": "1",
+                            "M_SexName": "Laki - Laki ",
+                            "M_PatientM_TitleID": "2",
+                            "M_TitleName": "Tn",
+                            "M_PatientM_ReligionID": "0",
+                            "M_ReligionName": null,
+                            "M_PatientM_IdTypeID": "1",
+                            "M_IdTypeName": "KTP",
+                            "status": "active"
+                        },
+                        {
+                            "M_PatientID": "886903",
+                            "M_PatientNoReg": "LAB0082553",
+                            "M_PatientPrefix": null,
+                            "M_PatientName": "DENNY HANDOYO",
+                            "M_PatientSuffix": null,
+                            "M_PatientHP": "082333349448",
+                            "M_PatientEmail": "",
+                            "M_PatientPOB": "SURABAYA",
+                            "M_PatientPhone": "",
+                            "M_PatientIDNumber": "3578170804790005",
+                            "M_PatientDOB": "08-04-1979",
+                            "M_PatientNote": "",
+                            "M_PatientNIK": null,
+                            "M_PatientJabatan": null,
+                            "M_PatientKedudukan": null,
+                            "M_PatientPJ": null,
+                            "M_PatientLocation": null,
+                            "M_PatientJob": null,
+                            "M_PatientM_SexID": "1",
+                            "M_SexName": "Laki - Laki ",
+                            "M_PatientM_TitleID": "2",
+                            "M_TitleName": "Tn",
+                            "M_PatientM_ReligionID": "0",
+                            "M_ReligionName": null,
+                            "M_PatientM_IdTypeID": "1",
+                            "M_IdTypeName": "KTP",
+                            "status": "active"
+                        }
+                ]
+        };
+    },
+    computed : {
+        dialog_national: {
+            get() {
+                return this.$store.state.patient.dialog_national
+            },
+            set(val) {
+                this.$store.commit('patient/update_dialog_national',val)
+            }
+        }
+    },
+    methods: {
+        
+    }
+}
+</script>
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/components/patientDelivery copy.vue b/test/vuex/one-fo-registration-walk-in-stemcell/components/patientDelivery copy.vue
new file mode 100644
index 0000000..066b439
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/components/patientDelivery copy.vue	
@@ -0,0 +1,193 @@
+<template>
+   <v-layout column>
+      <v-dialog
+         v-model="dialog_delivery_note"
+         width="500"
+      >
+
+         <v-card>
+            <v-card-title
+               class="headline blue lighten-2 white--text"
+            >
+               Catatan Pengiriman
+            </v-card-title>
+
+         <v-card-text>
+            <v-layout row>
+            <v-flex d-flex>
+               <v-textarea
+                  outline
+                  label="Isikan Catatan"
+                  v-model="selected_delivery_for_note.note"
+               ></v-textarea>
+            </v-flex>
+            </v-layout>
+            <v-layout row>
+               <v-flex d-flex>
+                  <p class="red--text font-weight-bold caption">
+                     Untuk pengiriman email, penambahan catatan digunakan sebagai pengganti alamat email terpilih, 
+                     jika lebih dari satu, 
+                     tulis alamat email dengan separator koma
+                     contoh : aku@gmail.com, kamu@gmail.com, dia@gmail.com
+                  </p>
+               </v-flex>
+            </v-layout>
+            <v-layout row>
+               <v-flex d-flex>
+                  <p class="red--text font-weight-bold caption">
+                     Untuk pengiriman kurir, penambahan catatan digunakan sebagai keterangan
+                     dan tidak merubah kecamatan kelurahan,
+                     ketika proses spk kurir
+                  </p>
+               </v-flex>
+            </v-layout>
+            
+        </v-card-text>
+
+         <v-divider></v-divider>
+
+         <v-card-actions>
+            <v-spacer></v-spacer>
+            <v-btn
+               color="primary"
+               flat
+               @click="addDeliveryNote()"
+            >
+               Tambahkan
+            </v-btn>
+         </v-card-actions>
+         </v-card>
+      </v-dialog>
+      <h5 class="headline ml-2 mb-1">Pengiriman Hasil</h5>
+      <v-container grid-list-md>
+         <v-layout row wrap >
+            <v-flex class="row" xs6 v-for="(delivery,idx) in deliveries" 
+                                    mt-2>
+               <v-layout row wrap :class="{'ml-4':(idx%2)==1}" >
+                  <v-checkbox  
+                     hide-details class="shrink mr-1" 
+                                  :value="delivery.idx"
+                                  :disabled="delivery.typeform === 'note'"
+                                  v-model="checked_id"
+                                  ></v-checkbox>
+
+                     <v-text-field
+                        class="grow"
+                        :append-icon="delivery.typeform === 'md' ? 'add' : 'delete'"
+                        outline
+                        :value="delivery.note"
+                        :label="delivery.name"
+                        @input="(val) => updateDelivery(idx,val)"
+                        @click:append="doAction(idx,delivery)"
+                        hide-details
+                        readonly
+                        ></v-text-field>                
+               </v-layout>
+            </v-flex >
+            
+            <!-- <v-flex class="row" xs6 v-for="(delivery,idx) in deliveries" 
+                                    :key="delivery.id" mt-2>
+               <v-layout row wrap :class="{'ml-4':(idx%2)==1}" >
+                  <v-checkbox  
+                     hide-details class="shrink mr-1" 
+                                  :value="delivery.selected"
+                                  @change="(val) => updateSelected(idx,val)"
+                                  ></v-checkbox>
+
+                     <v-text-field
+                        class="grow"
+                        outline
+                        :value="delivery.note"
+                        :label="delivery.name"
+                        @input="(val) => updateDelivery(idx,val)"
+                        hide-details
+                        ></v-text-field>                
+               </v-layout>
+            </v-flex > -->
+            
+         </v-layout>
+      </v-container>
+   </v-layout>
+
+</template>
+
+<script>
+module.exports = {
+   data () {
+      return {
+          dialog_delivery_note:false,
+          selected_delivery_for_note:{}
+       }
+    },
+
+   methods: {
+      updateSelected(idx,val) {
+         console.log('idx:'+idx)
+         console.log('val:'+val)
+         var deliveries = this.$store.state.delivery.deliveries
+         deliveries[idx].selected = val
+         this.$store.commit("delivery/update_deliveries",deliveries)
+      },
+      updateDelivery(idx,val) {
+         var deliveries = this.$store.state.delivery.deliveries
+         deliveries[idx].note = val
+         this.$store.commit("delivery/update_deliveries",deliveries)
+      },
+      doAction(idx,val){
+         if(val.typeform === 'md'){
+            let dlv = this.$store.state.delivery.checked_id
+            dlv.push(val.idx)
+            this.$store.commit("delivery/update_checked_id",dlv)
+            this.selected_delivery_for_note = _.clone(val, true)
+            
+            if(val.code == 'EMAIL')
+               this.selected_delivery_for_note.note = val.note
+            else
+               this.selected_delivery_for_note.note = ""
+
+            this.dialog_delivery_note = true
+         }
+         else{
+            var deliveries = this.$store.state.delivery.deliveries
+            deliveries.splice(idx, 1)
+            this.$store.commit("delivery/update_deliveries",deliveries)
+         }
+         
+      },
+      addDeliveryNote(){
+         var xdt = this.selected_delivery_for_note
+         let dlv = this.$store.state.delivery.checked_id
+         
+         dlv.push(xdt.idx)
+         this.$store.commit("delivery/update_checked_id",dlv)
+         
+         xdt.typeform = 'note'
+         xdt.id = Date.now()
+         xdt.selected = xdt.idx
+         var deliveries = this.$store.state.delivery.deliveries
+         deliveries.push(xdt)
+         this.$store.commit("delivery/update_deliveries",deliveries)
+         this.dialog_delivery_note = false
+      }
+   },
+   computed: {
+      deliveries() {
+         return this.$store.state.delivery.deliveries
+      },
+
+      checked_id : {
+         get() {
+            return this.$store.state.delivery.checked_id
+         },
+         set(val) {
+            console.log(val)
+            this.$store.commit("delivery/update_checked_id", val)
+            this.$store.commit("delivery/update_deliveries_2")
+         }
+      }
+   },
+   mounted: function() {
+      this.$store.dispatch('delivery/search')
+   }
+}
+</script>
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/components/patientDelivery.vue b/test/vuex/one-fo-registration-walk-in-stemcell/components/patientDelivery.vue
new file mode 100644
index 0000000..670e905
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/components/patientDelivery.vue
@@ -0,0 +1,250 @@
+<template>
+   <v-layout column>
+      <v-dialog
+         v-model="dialog_delivery_note"
+         width="500"
+      >
+
+         <v-card>
+            <v-card-title
+               class="headline blue lighten-2 white--text"
+            >
+               Catatan Pengiriman
+            </v-card-title>
+
+         <v-card-text>
+            <v-layout row>
+            <v-flex d-flex>
+               <v-textarea
+                  outline
+                  label="Isikan Catatan"
+                  v-model="selected_delivery_for_note.description"
+               ></v-textarea>
+            </v-flex>
+            </v-layout>
+            <v-layout row>
+               <v-flex d-flex>
+                  <p class="red--text font-weight-bold caption">
+                     Untuk pengiriman email, penambahan catatan digunakan sebagai pengganti alamat email terpilih, 
+                     jika lebih dari satu, 
+                     tulis alamat email dengan separator koma
+                     contoh : aku@gmail.com, kamu@gmail.com, dia@gmail.com
+                  </p>
+               </v-flex>
+            </v-layout>
+            <v-layout row>
+               <v-flex d-flex>
+                  <p class="red--text font-weight-bold caption">
+                     Untuk pengiriman kurir, penambahan catatan digunakan sebagai keterangan
+                     dan tidak merubah kecamatan kelurahan,
+                     ketika proses spk kurir
+                  </p>
+               </v-flex>
+            </v-layout>
+            
+        </v-card-text>
+
+         <v-divider></v-divider>
+
+         <v-card-actions>
+            <v-spacer></v-spacer>
+            <v-btn
+               color="primary"
+               flat
+               @click="addDeliveryNoteNew()"
+            >
+               Tambahkan
+            </v-btn>
+         </v-card-actions>
+         </v-card>
+      </v-dialog>
+      <v-layout align-center row>
+         <v-flex xs12>
+            <v-card tile flat color="teal lighten-4" class="pa-2">
+               <h5 class=" subtitle-1 font-weight-bold">PENGIRIMAN HASIL</h5>
+            </v-card>
+         </v-flex>
+      </v-layout>
+      
+         <v-layout mt-1 row wrap >
+            <v-flex class="row" ma-1 xs11 v-for="(delivery,idx) in deliveries">
+                  <v-layout  align-center row>
+                     <v-flex  xs1>
+                        <v-btn v-if="delivery.chex  === 'N'" @click="changeBoxRight(delivery,idx)" dark style="min-width:20px" small color="grey darken-1"><v-icon small>close</v-icon></v-btn>
+                        <v-btn v-if="delivery.chex  === 'Y'" @click="changeBoxRight(delivery,idx)" depressed style="min-width:20px" small color="teal lighten-4"><v-icon color="teal" small>check</v-icon></v-btn>
+                     </v-flex>
+                     <v-flex mb-1 pl-2 xs11>
+                        <p :class="getColorFont(delivery)" 
+                           class="mb-0 font-weight-black"
+                           style="font-size:11px">
+                           {{delivery.delivery_name.toUpperCase()}}
+                        </p>
+                        <div  v-if="delivery.description !== ''" 
+                           class="body-2 mb-1 mono caption" 
+                           v-html="reHTMLAddress(delivery.description)">
+                        </div>
+                        <v-textarea
+                           v-if="delivery.chex === 'Y'"
+                           v-model="delivery.note"
+                           rows="1"
+                           auto-grow
+                           single-line
+                           style="color:#800000;font-weight:500"
+                           placeholder="Catatan"
+                           hide-details
+                           class="body-2 mb-1 mt-0 pt-0"
+                        ></v-textarea>
+                     </v-flex>
+                  </v-layout>
+            </v-flex >
+         </v-layout>
+
+         <v-flex xs12>
+            <patient-reference></patient-reference>
+         </v-flex>
+         
+   </v-layout>
+
+</template>
+
+<script>
+module.exports = {
+   components: {
+      'patient-reference': httpVueLoader('./patientReference.vue')
+   },
+   data () {
+      return {
+          dialog_delivery_note:false,
+          selected_delivery_for_note:{}
+       }
+    },
+
+   methods: {
+      reHTMLAddress(entry){
+         var rtn = ''
+         if(entry){
+            var perpart = entry.split("^")
+         rtn += "<p class='mb-0' style='font-size:12px'>"+perpart[0]+"</p>"
+         if(perpart[1])
+            rtn += "<p class='mb-0' style='font-size:12px'>"+perpart[1]+"</p>"
+         }
+         
+
+         
+         return rtn
+      },
+      changeBoxRight(value,idx){
+            var deliveries = this.$store.state.delivery.data_deliveries
+            console.log(deliveries)
+            deliveries[idx].chex = value.chex === 'N'?'Y':'N'
+            console.log(deliveries[idx].chex)
+            this.$store.commit("delivery/update_data_deliveries",deliveries)
+        },
+        getColorFont(value,type){
+            
+            
+            var xcolor = 'black--text'
+            if(value.chex === 'Y'){
+               xcolor = 'teal--text'
+            }
+            
+            
+            return xcolor
+        },
+      updateSelected(idx,val) {
+         console.log('idx:'+idx)
+         console.log('val:'+val)
+         var deliveries = this.$store.state.delivery.deliveries
+         deliveries[idx].selected = val
+         this.$store.commit("delivery/update_deliveries",deliveries)
+      },
+      updateDelivery(idx,val) {
+         var deliveries = this.$store.state.delivery.deliveries
+         deliveries[idx].note = val
+         this.$store.commit("delivery/update_deliveries",deliveries)
+      },
+      doAction(idx,val){
+         if(val.typeform === 'md'){
+            let dlv = this.$store.state.delivery.checked_id
+            dlv.push(val.idx)
+            this.$store.commit("delivery/update_checked_id",dlv)
+            this.selected_delivery_for_note = _.clone(val, true)
+            
+            if(val.code == 'EMAIL')
+               this.selected_delivery_for_note.note = val.note
+            else
+               this.selected_delivery_for_note.note = ""
+
+            this.dialog_delivery_note = true
+         }
+         else{
+            var deliveries = this.$store.state.delivery.deliveries
+            deliveries.splice(idx, 1)
+            this.$store.commit("delivery/update_deliveries",deliveries)
+         }
+         
+      },
+      doActionNew(idx,val){
+         if(val.typeform === 'origin'){
+            this.selected_delivery_for_note = _.clone(val, true)
+            var deliveries = this.$store.state.delivery.data_deliveries
+            deliveries[idx].chex = true
+            this.$store.commit("delivery/update_data_deliveries",deliveries)
+            if(val.delivery_code !== 'EMAIL')
+               this.selected_delivery_for_note.description = ""
+
+            this.dialog_delivery_note = true
+         }
+         else{
+            var deliveries = this.$store.state.delivery.data_deliveries
+            deliveries.splice(idx, 1)
+            this.$store.commit("delivery/update_data_deliveries",deliveries)
+         }
+         
+      },
+      addDeliveryNote(){
+         var xdt = this.selected_delivery_for_note
+         let dlv = this.$store.state.delivery.checked_id
+         
+         dlv.push(xdt.idx)
+         this.$store.commit("delivery/update_checked_id",dlv)
+         
+         xdt.typeform = 'note'
+         xdt.id = Date.now()
+         xdt.selected = xdt.idx
+         var deliveries = this.$store.state.delivery.deliveries
+         deliveries.push(xdt)
+         this.$store.commit("delivery/update_deliveries",deliveries)
+         this.dialog_delivery_note = false
+      },
+      addDeliveryNoteNew(){
+         var xdt = this.selected_delivery_for_note
+         xdt.typeform = 'additional'
+         xdt.chex = true
+         var deliveries = this.$store.state.delivery.data_deliveries
+         deliveries.push(xdt)
+         this.$store.commit("delivery/update_data_deliveries",deliveries)
+         this.dialog_delivery_note = false
+      }
+   },
+   computed: {
+      deliveries() {
+         return this.$store.state.delivery.data_deliveries
+      },
+
+      checked_id : {
+         get() {
+            return this.$store.state.delivery.checked_id
+         },
+         set(val) {
+            console.log(val)
+            this.$store.commit("delivery/update_checked_id", val)
+            this.$store.commit("delivery/update_deliveries_2")
+         }
+      }
+   },
+   mounted: function() {
+      this.$store.dispatch('delivery/search')
+   }
+}
+</script>
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/components/patientDelivery.vue-- b/test/vuex/one-fo-registration-walk-in-stemcell/components/patientDelivery.vue--
new file mode 100644
index 0000000..78077b8
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/components/patientDelivery.vue--
@@ -0,0 +1,240 @@
+<template>
+   <v-layout column>
+      <v-dialog
+         v-model="dialog_delivery_note"
+         width="500"
+      >
+
+         <v-card>
+            <v-card-title
+               class="headline blue lighten-2 white--text"
+            >
+               Catatan Pengiriman
+            </v-card-title>
+
+         <v-card-text>
+            <v-layout row>
+            <v-flex d-flex>
+               <v-textarea
+                  outline
+                  label="Isikan Catatan"
+                  v-model="selected_delivery_for_note.description"
+               ></v-textarea>
+            </v-flex>
+            </v-layout>
+            <v-layout row>
+               <v-flex d-flex>
+                  <p class="red--text font-weight-bold caption">
+                     Untuk pengiriman email, penambahan catatan digunakan sebagai pengganti alamat email terpilih, 
+                     jika lebih dari satu, 
+                     tulis alamat email dengan separator koma
+                     contoh : aku@gmail.com, kamu@gmail.com, dia@gmail.com
+                  </p>
+               </v-flex>
+            </v-layout>
+            <v-layout row>
+               <v-flex d-flex>
+                  <p class="red--text font-weight-bold caption">
+                     Untuk pengiriman kurir, penambahan catatan digunakan sebagai keterangan
+                     dan tidak merubah kecamatan kelurahan,
+                     ketika proses spk kurir
+                  </p>
+               </v-flex>
+            </v-layout>
+            
+        </v-card-text>
+
+         <v-divider></v-divider>
+
+         <v-card-actions>
+            <v-spacer></v-spacer>
+            <v-btn
+               color="primary"
+               flat
+               @click="addDeliveryNoteNew()"
+            >
+               Tambahkan
+            </v-btn>
+         </v-card-actions>
+         </v-card>
+      </v-dialog>
+      <v-layout align-center row>
+         <v-flex xs12>
+            <v-card tile flat color=" pa-2 teal lighten-4">
+               <h5 class=" subtitle-1 font-weight-bold">PENGIRIMAN HASIL</h5>
+            </v-card>
+         </v-flex>
+      </v-layout>
+      
+         <v-layout mt-1 row wrap >
+            <v-flex class="row" ma-1 xs11 v-for="(delivery,idx) in deliveries">
+                  <v-layout  align-center row>
+                     <v-flex  xs1>
+                        <v-btn v-if="delivery.chex  === 'N'" @click="changeBoxRight(delivery,idx)" dark style="min-width:20px" small color="grey darken-1"><v-icon small>close</v-icon></v-btn>
+                        <v-btn v-if="delivery.chex  === 'Y'" @click="changeBoxRight(delivery,idx)" depressed style="min-width:20px" small color="teal lighten-4"><v-icon color="teal" small>check</v-icon></v-btn>
+                     </v-flex>
+                     <v-flex mb-1 pl-2 xs11>
+                        <p :class="getColorFont(delivery)" 
+                           class="mb-0 font-weight-black"
+                           style="font-size:11px">
+                           {{delivery.delivery_name.toUpperCase()}}
+                        </p>
+                        <div  v-if="delivery.description !== ''" 
+                           class="body-2 mb-1 mono caption" 
+                           v-html="reHTMLAddress(delivery.description)">
+                        </div>
+                        <v-textarea
+                           v-if="delivery.chex === 'Y'"
+                           v-model="delivery.note"
+                           rows="1"
+                           auto-grow
+                           single-line
+                           style="color:#800000;font-weight:500"
+                           placeholder="Catatan"
+                           hide-details
+                           class="body-2 mb-1 mt-0 pt-0"
+                        ></v-textarea>
+                     </v-flex>
+                  </v-layout>
+            </v-flex >
+         </v-layout>
+
+   </v-layout>
+
+</template>
+
+<script>
+module.exports = {
+   data () {
+      return {
+          dialog_delivery_note:false,
+          selected_delivery_for_note:{}
+       }
+    },
+
+   methods: {
+      reHTMLAddress(entry){
+         var rtn = ''
+         var perpart = entry.split("^")
+         rtn += "<p class='mb-0' style='font-size:12px'>"+perpart[0]+"</p>"
+         if(perpart[1])
+            rtn += "<p class='mb-0' style='font-size:12px'>"+perpart[1]+"</p>"
+
+         
+         return rtn
+      },
+      changeBoxRight(value,idx){
+            var deliveries = this.$store.state.delivery.data_deliveries
+            console.log(deliveries)
+            deliveries[idx].chex = value.chex === 'N'?'Y':'N'
+            console.log(deliveries[idx].chex)
+            this.$store.commit("delivery/update_data_deliveries",deliveries)
+        },
+        getColorFont(value,type){
+            
+            
+            var xcolor = 'black--text'
+            if(value.chex === 'Y'){
+               xcolor = 'teal--text'
+            }
+            
+            
+            return xcolor
+        },
+      updateSelected(idx,val) {
+         console.log('idx:'+idx)
+         console.log('val:'+val)
+         var deliveries = this.$store.state.delivery.deliveries
+         deliveries[idx].selected = val
+         this.$store.commit("delivery/update_deliveries",deliveries)
+      },
+      updateDelivery(idx,val) {
+         var deliveries = this.$store.state.delivery.deliveries
+         deliveries[idx].note = val
+         this.$store.commit("delivery/update_deliveries",deliveries)
+      },
+      doAction(idx,val){
+         if(val.typeform === 'md'){
+            let dlv = this.$store.state.delivery.checked_id
+            dlv.push(val.idx)
+            this.$store.commit("delivery/update_checked_id",dlv)
+            this.selected_delivery_for_note = _.clone(val, true)
+            
+            if(val.code == 'EMAIL')
+               this.selected_delivery_for_note.note = val.note
+            else
+               this.selected_delivery_for_note.note = ""
+
+            this.dialog_delivery_note = true
+         }
+         else{
+            var deliveries = this.$store.state.delivery.deliveries
+            deliveries.splice(idx, 1)
+            this.$store.commit("delivery/update_deliveries",deliveries)
+         }
+         
+      },
+      doActionNew(idx,val){
+         if(val.typeform === 'origin'){
+            this.selected_delivery_for_note = _.clone(val, true)
+            var deliveries = this.$store.state.delivery.data_deliveries
+            deliveries[idx].chex = true
+            this.$store.commit("delivery/update_data_deliveries",deliveries)
+            if(val.delivery_code !== 'EMAIL')
+               this.selected_delivery_for_note.description = ""
+
+            this.dialog_delivery_note = true
+         }
+         else{
+            var deliveries = this.$store.state.delivery.data_deliveries
+            deliveries.splice(idx, 1)
+            this.$store.commit("delivery/update_data_deliveries",deliveries)
+         }
+         
+      },
+      addDeliveryNote(){
+         var xdt = this.selected_delivery_for_note
+         let dlv = this.$store.state.delivery.checked_id
+         
+         dlv.push(xdt.idx)
+         this.$store.commit("delivery/update_checked_id",dlv)
+         
+         xdt.typeform = 'note'
+         xdt.id = Date.now()
+         xdt.selected = xdt.idx
+         var deliveries = this.$store.state.delivery.deliveries
+         deliveries.push(xdt)
+         this.$store.commit("delivery/update_deliveries",deliveries)
+         this.dialog_delivery_note = false
+      },
+      addDeliveryNoteNew(){
+         var xdt = this.selected_delivery_for_note
+         xdt.typeform = 'additional'
+         xdt.chex = true
+         var deliveries = this.$store.state.delivery.data_deliveries
+         deliveries.push(xdt)
+         this.$store.commit("delivery/update_data_deliveries",deliveries)
+         this.dialog_delivery_note = false
+      }
+   },
+   computed: {
+      deliveries() {
+         return this.$store.state.delivery.data_deliveries
+      },
+
+      checked_id : {
+         get() {
+            return this.$store.state.delivery.checked_id
+         },
+         set(val) {
+            console.log(val)
+            this.$store.commit("delivery/update_checked_id", val)
+            this.$store.commit("delivery/update_deliveries_2")
+         }
+      }
+   },
+   mounted: function() {
+      this.$store.dispatch('delivery/search')
+   }
+}
+</script>
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/components/patientDetail.vue b/test/vuex/one-fo-registration-walk-in-stemcell/components/patientDetail.vue
new file mode 100644
index 0000000..270cea4
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/components/patientDetail.vue
@@ -0,0 +1,428 @@
+<template>
+   <div>
+      <v-dialog
+         v-model="dialog_check_connection"
+         hide-overlay
+         persistent
+         width="300"
+       >
+         <v-card
+           color="primary"
+           dark
+         >
+           <v-card-text>
+             Cek koneksi data nasional
+             <v-progress-linear
+               indeterminate
+               color="white"
+               class="mb-0"
+             ></v-progress-linear>
+           </v-card-text>
+         </v-card>
+       </v-dialog>
+      <v-dialog
+         v-model="dialog_card"
+         width="65%"
+         >
+         <v-card>
+            <v-card-title
+               class="teal subheading  white--text pt-2 pb-2"
+               primary-title
+               align-center
+               >
+               <span class="font-weight-thin">KARTU ANGGOTA</span>
+            </v-card-title>
+            <v-card-text class="pt-2 pb-1">
+               <v-layout>
+                 <v-flex xs12>
+                     <object :data="rpt_card"
+                       width="100%" height="512px"></object>
+                 </v-flex>
+             </v-layout>
+            </v-card-text>
+         </v-card>
+      </v-dialog>
+      <v-card tile flat color="teal lighten-4" class="pa-2">
+      <v-layout align-center row>
+            <v-flex xs6>
+               
+                  <h5 class=" subtitle-1 font-weight-bold"><span v-if="!queue">DATA PASIEN</span><v-btn v-if="queue" depressed small>PASIEN ANTRIAN : {{queue}}</v-btn></h5>
+              
+            </v-flex>
+            <v-flex class="text-xs-right" xs6>
+   
+                  <!----<v-btn
+                     class="text-xs-right ma-0"
+                     :disabled="_.isEmpty(patient)"
+                     deppressed
+                     small
+                     @click="openTabDataNasional()"
+                     color="red lighten-2 white--text"
+                     
+                     >
+                     DATA NASIONAL
+                  </v-btn>-->
+          
+            </v-flex>
+         </v-layout>
+         </v-card>
+      <v-layout row wrap>
+         
+         <v-flex xs12>
+            
+            <v-layout>
+               <v-flex xs3 pa-2>
+                  <v-layout row wrap>
+                     <v-flex  v-if="patient.info" xs12>
+                           <v-btn
+                              class="mt-0 mb-0"
+                              deppressed
+                              small
+                              @click="getHistories(patient.info.visit)"
+                              color="teal lighten-3 white--text"
+                              block
+                              >
+                              kunjungan ke {{ patient.info.visit }}
+                           </v-btn>
+                     </v-flex>
+                     <v-flex xs12>
+                         <v-card tile >
+                           <v-img
+                              :src="patient_photo"
+                              aspect-ratio="1"
+                              class="teal lighten-2 pt-2"
+                              contain
+                           >
+                              <template v-slot:placeholder>
+                              <v-layout
+                                 fill-height
+                                 align-center
+                                 justify-center
+                                 ma-0
+                              >
+                                 <v-progress-circular indeterminate color="grey lighten-5"></v-progress-circular>
+                              </v-layout>
+                              </template>
+                           </v-img>
+                         </v-card>
+                     </v-flex>
+                        <v-flex xs12>
+                           <v-btn
+                              class="mt-0 mb-0"
+                              deppressed
+                              small
+                              color="teal lighten-3 white--text"
+                              :dark="patient.M_PatientID ? true : false"
+                              block
+                              @click="update_photo"
+                              :disabled="!patient.M_PatientID"
+                              >
+                              Update Foto
+                           </v-btn>
+                     </v-flex>
+                           <v-flex xs12>
+                              <v-btn
+                                 small
+                                 color="teal lighten-3 white--text"
+                                 :dark="patient.M_PatientID ? true : false"
+                                 block
+                                 @click="edit_patient"
+                                 :disabled="!patient.M_PatientID"
+                                 class="mt-1"
+                                 >
+                                 Ubah Data
+                              </v-btn>
+                           </v-flex>
+                           <v-flex xs12>
+                              <v-btn
+                                 small
+                                 color="teal lighten-3 white--text"
+                                 :dark="patient.M_PatientID ? true : false"
+                                 block
+                                 @click="generate_card"
+                                 :disabled="!patient.M_PatientID"
+                                 class="mt-1"
+                                 >
+                                 Cetak Kartu
+                              </v-btn>
+                           </v-flex>
+                           <v-divider></v-divider>
+                           <v-flex mt-0 xs12>
+                        <patient-history-dialog> </patient-history-dialog>
+                     </v-flex>
+   
+                     <!--<v-flex xs12 v-if="patient.info">
+                           <div v-show="patient.info.birthday == 'Y'">Happy Birthday !</div>
+                     </v-flex>-->
+                  </v-layout>
+   
+   
+   
+               </v-flex>
+   
+               <v-flex xs9>
+                  <v-flex xs12>
+                     <v-layout class="text-truncate" pt-2>
+                        <v-flex xs5 pa-1>
+                           <v-text-field
+                              label="Nama"
+                              placeholder=""
+                              style="font-size:12px;padding:4px 0"
+                              :value="patient.M_PatientName"
+                              :title="patient.M_PatientName"
+                              readonly
+                              ></v-text-field>
+                        </v-flex>
+                        <v-flex xs2 pa-1>
+                           <v-text-field
+                              label="PID"
+                              style="font-size:12px;padding:4px 0"
+                              placeholder=""
+                              :value="patient.M_PatientNoReg"
+                              readonly
+                              ></v-text-field>
+                        </v-flex>
+                        <v-flex xs2 pa-1>
+                           <v-text-field
+                              style="font-size:12px;padding:4px 0"
+                              label="Tanggal Lahir"
+                              placeholder=""
+                              :value="patient_dob"
+                              readonly
+                              ></v-text-field>
+                        </v-flex>
+                        <v-flex xs3 pa-1>
+                           <v-text-field
+                              style="font-size:12px;padding:4px 0"
+                              label="Umur"
+                              placeholder=""
+                              v-model="patient_age"
+                              readonly
+                              ></v-text-field>
+                        </v-flex>
+                     </v-layout>
+   
+                  </v-flex>
+   
+                   <v-flex xs12 pa-1>
+   
+                     <v-text-field
+                              style="font-size:12px;padding:4px 0"
+                              label="Nomor ID"
+                              placeholder=""
+                              v-model="patient.M_PatientIDNumber"
+                              readonly
+                              :suffix="patient.idtype_name"
+                              ></v-text-field>
+                  </v-flex>
+                  <v-flex xs12 pa-1>
+                     <v-textarea
+                        style="font-size:12px;padding:4px 0"
+                        auto-grow
+                        rows="3"
+                        label="Alamat"
+                        :value="patient.M_PatientAddress"
+                        readonly
+                        ></v-textarea>
+   
+                  </v-flex>
+   
+                  <!----<v-flex xs12 pa-1>
+                     <v-textarea
+                        auto-grow
+                        placeholder=""
+                        label="Catatan Pasien"
+                        rows="1"
+                        style="font-size:12px;padding:4px 0"
+                        v-model="patient_note"
+                     ></v-textarea>
+                  </v-flex>-->
+   
+                  <v-flex xs12 pa-1>
+                     <v-textarea
+                        auto-grow
+                        label="Diagnosa"
+                        rows="1"
+                        style="font-size:12px;padding:4px 0"
+                        v-model="diagnosa"
+                        ></v-textarea>
+                  </v-flex>
+   
+                  <!----<v-flex xs12 pa-1>
+                     <v-autocomplete
+                        label="ICD-10"
+                        v-model="selected_icd10"
+                        :items="icd10"
+                        :search-input.sync="search_icd10"
+                        class="pb-2"
+                        no-filter
+                        :item-text="item => item.code + ' - ' + item.display"
+                        item-value="code"
+                        return-object
+                        :loading="loading_icd10"
+                        no-data-text="Ketikkan pencarian ICD-10"
+                        clearable
+                        >
+                 
+                     </v-autocomplete>
+                  </v-flex>-->
+                 
+               </v-flex>
+            </v-layout>
+            
+         </v-flex>
+         
+   
+         <patient-dialog-national></patient-dialog-national>
+         <patient-photo-dialog></patient-photo-dialog>
+      </v-layout>
+   
+   </div>
+   </template>
+   
+   <style scoped>
+   .v-messages { display:none; }
+   .v-input__slot {
+      margin-bottom: 0px;
+   }
+   </style>
+   
+   <script>
+   module.exports = {
+      components : {
+         'patient-search-dialog': httpVueLoader('./patientSearchDialog.vue'),
+         'patient-history-dialog': httpVueLoader('./patientHistoryDialog.vue'),
+         'patient-photo-dialog': httpVueLoader('./oneDialogPhoto.vue'),
+         'patient-dialog-national': httpVueLoader('./patientDataNasional.vue')
+      },
+      data() {
+         return {
+               showinfo:false,
+               dialog_card:false,
+               rpt_card:'',
+               search_icd10:''
+         };
+      },
+      computed : {
+         loading_icd10(){
+            return this.$store.state.patient.loading_icd10
+         },
+         icd10(){
+            return this.$store.state.patient.icd10
+         },
+         selected_icd10 : {
+            get() {
+               return this.$store.state.patient.selected_icd10
+            },
+            set(val) {
+               this.$store.commit('patient/update_selected_icd10',val)
+            }
+         },
+         queue() {
+            return this.$store.state.order.queue
+         },
+         dialog_check_connection: {
+            get() {
+               return this.$store.state.patient.dialog_check_connection
+            },
+            set(val) {
+               this.$store.commit('patient/update_dialog_check_connection',val)
+            }
+         },
+         act: {
+            get() {
+               return this.$store.state.patient.act
+            },
+            set(val) {
+               this.$store.commit('patient/update_act',val)
+            }
+         },
+         diagnosa: {
+            get() {
+               return this.$store.state.order.diagnosa
+            },
+            set(val) {
+               this.$store.commit('order/update_diagnosa',val)
+            }
+         },
+         patient() {
+            return this.$store.state.patient.selected_patient
+         },
+   
+         patient_note: {
+            get() {
+               return this.$store.state.order.patient_note
+            },
+            set(val) {
+               this.$store.commit('order/update_patient_note',val)
+            }
+         },
+   
+         patient_age: {
+            get () {
+               return this.$store.state.patient.selected_patient.patient_age            
+            },
+   
+            set (v) {
+               return
+            }
+         },
+   
+         patient_dob () {
+            try {
+               return this.$store.state.patient.selected_patient.M_PatientDOB.split('-').reverse().join('-')
+            } catch (e) {
+            }
+            
+         },
+         patient_photo () {
+            return this.$store.state.photo.photo_url
+         },
+         isLoading(){
+            return this.$store.state.patient.update_autocomplete_status
+         }
+         
+      },
+      methods : {
+         openTabDataNasional(){
+            var selpatient = this.$store.state.patient.selected_patient
+   
+            this.dialog_check_connection = true
+            this.$store.dispatch('patient/check_connection_national',selpatient)
+            //this.$store.commit('patient/update_dialog_national', true)
+         },
+         update_photo () {
+            this.$store.commit('photo/update_dialog_photo', true)
+         },
+         edit_patient () {
+            this.$store.commit('patient/update_act', 'edit')
+            this.$store.commit('patient/update_edit', true)
+            this.$store.commit('patient/update_patient_new_dialog_is_active', true)
+         },
+         getHistories(visit){
+            console.log(visit)
+            if(parseInt(visit) > 1){
+               this.$store.dispatch('history/search')
+            }
+         },
+         generate_card(){
+            var xid = this.$store.state.patient.selected_patient.M_PatientID
+            this.rpt_card = "/birt/run?__report=report/onelab/fo/rpt_card.rptdesign&__format=pdf&username=admin%20&PID="+xid
+            this.dialog_card = true
+         },
+         thr_searchicd10: _.debounce( function () {
+               this.$store.dispatch("patient/search_icd10",{search:this.search_icd10})
+            },2000),
+         },
+      watch: {
+         search_icd10(val,old) {
+           if (val == old ) return
+           if (! val) return
+           if (val.length < 1 ) return
+           if (this.$store.state.patient.update_autocomplete_status == 1 ) return  
+           this.thr_searchicd10()
+         },
+      }
+   }
+   </script>
+   
\ No newline at end of file
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/components/patientHistory.vue b/test/vuex/one-fo-registration-walk-in-stemcell/components/patientHistory.vue
new file mode 100644
index 0000000..5cb7cb8
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/components/patientHistory.vue
@@ -0,0 +1,96 @@
+<template>
+    <v-card class="xs12 md12 mt-2" flat>
+        <!-- <v-card-title primary-title class="pt-1 pb-1 pl-2 pr-2">
+          <div>
+            <h3 class="headline mb-0">Histori Pasien</h3>
+          </div>
+        </v-card-title> -->
+
+        <v-card-text class="pt-1 pb-1 pl-2 pr-2">
+            <v-data-table :headers="headers" :items="histories" 
+                hide-actions class="elevation-1">
+                <template slot="items" slot-scope="props">
+                    <td class="text-xs-left pa-2" >{{ format_date(props.item.T_OrderHeaderDate) }}</td>
+                    <td class="text-xs-left pa-2" >{{ props.item.T_OrderHeaderLabNumber}}</td>
+                    <td class="pa-2" >{{ props.item.T_TestName }}</td>
+                    <td class="text-xs-right pa-1">
+                        <v-btn color="primary" dark small class="one-btn-icon ma-0" 
+                        @click="getMe(props.item.T_OrderHeaderID)">
+                            <v-icon small>save_alt</v-icon>
+                        </v-btn>
+                    </td>
+                </template>
+            
+            </v-data-table>
+        </v-card-text>
+
+        
+    </v-card>
+</template>
+
+<style scoped>
+    table.v-table tbody td,table.v-table tbody th {
+        height: 40px;
+    }
+
+    table.v-table thead tr {
+        height: 40px;
+    }
+
+    .one-btn-icon { font-size: 1.5em; float: right }
+</style>
+
+<script>
+module.exports = {
+    computed : {
+       histories(){
+          return this.$store.state.history.histories
+       }
+    },
+
+    data() {
+        return {
+            headers: [
+                {
+                    text: "TANGGAL",
+                    align: "left",
+                    sortable: false,
+                    width: "20%",
+                    class: "pa-2 blue lighten-3 white--text"
+                },
+                {
+                    text: "NO. LAB",
+                    align: "left",
+                    sortable: false,
+                    width: "20%",
+                    class: "pa-2 blue lighten-3 white--text"
+                },
+                {
+                    text: "PEMERIKSAAN",
+                    align: "left",
+                    sortable: false,
+                    width: "50%",
+                    class: "pa-2 blue lighten-3 white--text"
+                },
+                {
+                    text: "USE",
+                    align: "right",
+                    sortable: false,
+                    width: "10%",
+                    class: "pa-2 blue lighten-3 white--text"
+                }
+            ]
+        };
+    },
+
+    methods : {
+        format_date(d) {
+            return d.substr(0, 10).split('-').reverse().join('-')
+        },
+
+        getMe(id) {
+            this.$store.dispatch('px/search_pxs', id)
+        }
+    }
+}
+</script>
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/components/patientHistoryDialog.vue b/test/vuex/one-fo-registration-walk-in-stemcell/components/patientHistoryDialog.vue
new file mode 100644
index 0000000..3469fcd
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/components/patientHistoryDialog.vue
@@ -0,0 +1,211 @@
+<template>
+
+   <v-dialog
+      v-model="dialog"
+      width="65%"
+      >
+      <v-card>
+         <v-card-title
+            class="teal subheading  white--text pt-2 pb-2"
+            primary-title
+            align-center
+            >
+            <span class="font-weight-thin">RIWAYAT PASIEN</span>
+         </v-card-title>
+            <v-card-text class="pt-2 pb-1">
+               <v-layout v-for="(history,index) in histories" @click="opendetail(history,index)" row>
+                  <v-flex xs12>
+                     <v-layout  align-center mb-1 row>
+                        <v-flex xs12>
+                           <v-card flat :color="getcolorlist(history.xshow)" class="white--text pt-1 pb-1 pl-2 pr-2">
+                              <v-layout row>
+                                 <v-flex  xs10>
+                                    <h3 class="subheading">
+                                       <kbd class="mono">{{history.labnumber_ext}} | {{history.xdate}} | {{history.M_MouName}} | <span :title="history.realdoctor">{{history.M_DoctorName}}</span></kbd>
+                                    </h3>
+                                 </v-flex>
+                                 <v-flex class="text-xs-right" xs2>
+                                    <!--<v-icon v-if="history.xshow === 'N'" style="cursor:pointer"  @click="opendetail(history,index)" dark>more_horiz</v-icon>
+                                    <v-icon v-if="history.xshow === 'Y'" style="cursor:pointer"  @click="opendetail(history,index)" dark>minimize</v-icon>-->
+                                 </v-flex>
+                              </v-layout>
+                           </v-card>
+                        </v-flex>
+                     </v-layout>
+                     <v-layout v-if="history.xshow === 'Y'" mb-2 row>
+                        <v-flex xs12>
+                           <v-card flat color="#fcac8c" class="pt-2 pb-0 pl-2 pr-2">
+                              <v-layout row>
+                                 <v-flex class="text-xs-left" xs12>
+                                    <v-btn @click="setToOrder(history.T_OrderHeaderID)" class="mb-0 mt-0 ml-0" dark color="#3c70a4">
+                                       jadikan order
+                                    </v-btn>
+                                 </v-flex>
+                              </v-layout>
+                              <v-divider dark class="mt-1 mb-1"></v-divider>
+                              <v-card>
+                              <v-layout pl-3 pt-2 pb-2 pr-3 row>
+                                 
+                                 <v-flex  xs2>
+                                    <h5 class="subtitle-2">NO REG</h5>
+                                    <p class="body-1 mb-0">{{history.labnumber_ext}}</p>
+                                 </v-flex>
+                                 <v-flex  xs2>
+                                    <h5 class="subtitle-2 ma-0 pa-0">TANGGAL</h5>
+                                    <p class="body-1 mb-0">{{history.xdate}}</p>
+                                 </v-flex>
+                                 <v-flex  xs4>
+                                    <h5 class="subtitle-2 ma-0 pa-0">DOKTER</h5>
+                                    <p class="body-1 mb-0">{{history.M_DoctorName}}</p>
+                                 </v-flex>
+                                 <v-flex  xs4>
+                                    <h5 class="subtitle-2 ma-0 pa-0">AGREEMENT</h5>
+                                    <p class="body-1 mb-0">{{history.M_MouName}}</p>
+                                 </v-flex>
+                                 
+                              </v-layout>
+                              </v-card>
+                              <v-divider dark class="mt-1 mb-1"></v-divider>
+                              <v-card>
+                              <v-layout pl-3 pt-2 pb-2 pr-3 row>
+                                 
+                                    <v-flex  xs6>
+                                       <h5 class="subtitle-2 ma-0 pa-0">CATATAN PASIEN</h5>
+                                       <p class="body-1 mb-0">{{history.M_PatientNote}}</p>
+                                    </v-flex>
+                                    <v-flex  xs6>
+                                       <h5 class="subtitle-2 ma-0 pa-0">CATATAN FO</h5>
+                                       <p class="body-1 mb-0">{{history.T_OrderHeaderFoNote}}</p>
+                                    </v-flex>
+                                 
+                              </v-layout>
+                              </v-card>
+                              <v-divider dark class="mt-1 mb-1"></v-divider>
+                              <v-layout row>
+                                 <v-flex xs12>
+                                    <v-data-table
+                                       :headers="headers"
+                                       :items="history.details"
+                                       class="elevation-1"
+                                       hide-actions
+                                    >
+                                       <template v-slot:items="props">
+                                          <td>{{ props.item.test_name }}</td>
+                                          <td class="text-xs-right">{{ props.item.str_price }}</td>
+                                          <td class="text-xs-right">{{ props.item.str_disc }}</td>
+                                          <td class="text-xs-right">{{ props.item.str_total }}</td>
+                                       </template>
+                                       <template v-slot:footer>
+                                          <td><strong>TOTAL</strong></td>
+                                          <td class="text-xs-right"><strong>{{ history.T_OrderHeaderSubTotal }}</strong></td>
+                                          <td class="text-xs-right"><strong>{{ history.total_disc }}</strong></td>
+                                          <td class="text-xs-right"><strong>{{ history.T_OrderHeaderTotal }}</strong></td>
+                                       </template>
+                                    </v-data-table>
+                                 </v-flex>
+                              </v-layout>
+                              <v-divider dark class="mt-1 mb-1"></v-divider>
+                              <v-layout mb-2 pb-2 row>
+                                 <v-flex  xs12>
+                                    <v-card>
+                                       <v-layout v-for="delivery in history.deliveries" pl-3 pt-2 pb-2 pr-3 row>
+                                             <v-flex  xs12>
+                                                <h5 class="subtitle-2 ma-0 pa-0">{{delivery.M_DeliveryName.toUpperCase() }}</h5>
+                                                <p class="body-1 mb-0">{{delivery.T_OrderDeliveryDestination}}</p>
+                                                <p class="mb-0"><kbd>catatan : {{ delivery.xnote }}</kbd></p>
+                                             </v-flex>
+                                       </v-layout>
+                                    </v-card>
+                                 </v-flex>
+                              </v-layout>
+                           </v-card>
+                        </v-flex>
+                     </v-layout>
+                  </v-flex>
+               </v-layout>
+            </v-card-text>
+            <v-divider></v-divider>
+            <v-card-actions>
+               <v-spacer></v-spacer>
+               <v-btn
+                  color="grey"
+                  flat
+                  @click="dialog = false"
+                  >
+                  Tutup
+               </v-btn>
+            </v-card-actions>
+      </v-card>
+   </v-dialog>
+</template>
+<style scoped>
+.v-list--two-line .v-list__tile {
+    height: 55px!important;
+}
+.v-dialog__container {
+   display: block !important;
+}
+</style>
+<script>
+module.exports = {
+   components : {
+      'patient-history': httpVueLoader('./patientHistory.vue')
+   },
+   methods : {
+      setToOrder(id){
+          this.$store.dispatch('history/get_databyorder_id', {'order_id':id})
+      },
+      getcolorlist(value){
+         var rtn = "teal lighten-2"
+         if(value === 'Y')
+            rtn = "#ff8a5c"
+
+         return rtn
+      },
+      opendetail(value,idx){
+         console.log(value.xshow)
+         console.log(idx)
+         var all = this.$store.state.history.histories
+         all[idx].xshow = value.xshow == 'N'?'Y':'N'
+         console.log(all[idx].xshow)
+         console.log(all)
+         this.$store.commit('history/update_histories',all)
+      }
+   },
+   computed: {
+      no_history() {
+         if (! this.$store.state.patient.selected_patient.M_PatientID) return true
+         return this.$store.state.history.histories.length == 0
+      },
+      dialog: {
+         get() {
+            return this.$store.state.history.history_dialog
+         },
+         set(val) {
+            this.$store.commit('history/update_history_dialog',val)
+         }
+      },
+      histories(){
+         return this.$store.state.history.histories
+      }
+   },
+   data () {
+      return {
+         headers: [
+            {
+               text: 'PEMERIKSAAN',
+               align: 'left',
+               sortable: false,
+               
+            },
+            { text: 'BRUTO',align: 'right',sortable: false},
+            { text: 'DISKON',align: 'right',sortable: false },
+            { text: 'HARGA',align: 'right',sortable: false}
+         ]
+      }
+   },
+   watch : {
+        
+   }
+}
+</script>
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/components/patientLeftSide.vue b/test/vuex/one-fo-registration-walk-in-stemcell/components/patientLeftSide.vue
new file mode 100644
index 0000000..1ae934f
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/components/patientLeftSide.vue
@@ -0,0 +1,118 @@
+<template>
+    <v-layout column fill-height>
+        <v-flex v-if="preid == 0 || preid == null || preid == -1" xs12>
+          <v-card class="pa-1 mb-2">
+                <v-card-text class="pa-0">
+                    <v-layout row wrap>
+                        <v-flex xs12>
+                            <patient-search-box></patient-search-box>
+                        </v-flex>
+                    </v-layout>
+                </v-card-text>
+                
+            </v-card>
+      </v-flex> 
+    
+
+        <!-- <v-flex xs12 grow> -->
+            <v-card class="pa-1 p-left-side grow" grow>
+                <v-card-text class="pa-0">
+                    <v-layout row wrap>
+
+                        <v-flex xs12>
+                           <patient-detail></patient-detail>
+                        </v-flex>
+                        <v-divider></v-divider>
+                        <v-flex xs12>
+                           <patient-notes></patient-notes> 
+                        </v-flex>
+                    </v-layout>
+                </v-card-text>
+
+                
+            </v-card>
+          
+    </v-layout>
+    
+</template>
+
+<style scoped>
+/* .p-left-side {
+    min-height: 500px;
+} */
+</style>
+
+<script>
+module.exports = {
+	components : {
+        'patient-search-box' : httpVueLoader('./patientSearchBox.vue'),
+        'patient-detail': httpVueLoader('./patientDetail.vue'),
+        'patient-notes' : httpVueLoader('./patientNotes.vue'),
+        
+    },
+    data() {
+        return {
+
+        };
+    },
+    computed : {
+        preid: {
+            get() {
+                return this.$store.state.order.preid
+            },
+            set(val) {
+                this.$store.commit('order/update_preid',val)
+            }
+        },
+        dialog_start: {
+            get() {
+                return this.$store.state.order.dialog_start
+            },
+            set(val) {
+                this.$store.commit('order/update_dialog_start',val)
+            }
+        },
+        status_start: {
+            get() {
+                return this.$store.state.order.status_start
+            },
+            set(val) {
+                this.$store.commit('order/update_status_start',val)
+            }
+        },
+        time_start: {
+            get() {
+                return this.$store.state.order.time_start
+            },
+            set(val) {
+                this.$store.commit('order/update_time_start',val)
+            }
+        },
+        elapsedTime: {
+            get() {
+                return this.$store.state.order.elapsedTime
+            },
+            set(val) {
+                this.$store.commit('order/update_elapsedTime',val)
+            }
+        }
+    },
+    methods: {
+        start() {
+            this.time_start = setInterval(() => {
+                this.elapsedTime += 1000;
+            }, 1000);
+            this.status_start = 'Y'
+           // this.show_time = moment(new Date()).format('YYYY-MM-DD HH:mm:ss')
+            //this.dialog_start = false
+            this.$store.dispatch('order/get_time_start',{'id':0})
+        },
+        stop() {
+            clearInterval(this.time_start);
+        },
+        reset() {
+            this.elapsedTime = 0;
+        }
+    }
+}
+</script>
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/components/patientNewDialog.vue b/test/vuex/one-fo-registration-walk-in-stemcell/components/patientNewDialog.vue
new file mode 100644
index 0000000..3760063
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/components/patientNewDialog.vue
@@ -0,0 +1,1121 @@
+<template>
+
+   <v-dialog
+        persistent
+        v-model="dialog"
+        width="1000"
+      >
+        <v-btn 
+            class="mt-1" 
+            fab 
+            small  
+            slot="activator" 
+            title="tambahkan pasien baru"  
+            @click="new_patient"  
+            dark 
+            color="teal lighten-2">
+        <v-icon dark>add</v-icon>
+      </v-btn>
+         <v-card>
+            <v-card-title
+               class="teal lighten-2 white--text pt-2 pb-2"
+               primary-title
+               >
+               {{ dialog_title }}            
+               </v-card-title>
+               <v-card-text class="pt-2 pb-2">
+                  
+                   <v-layout pt-2 row>
+                       <v-flex xs6 pr-3>
+                           <v-layout row wrap>
+                                <v-flex xs3 pr-1>
+                                   <v-text-field
+                                        style="font-size:12px;padding:4px 0"
+                                        v-model="patient_new.M_PatientPrefix"
+                                        label="Awalan"
+                                    ></v-text-field>
+                                </v-flex>
+                                <v-flex xs6>
+                                   <v-text-field
+                                        style="font-size:12px;padding:4px 0"
+                                        v-model="patient_new.M_PatientName"
+                                        label="Nama Pasien"
+                                        :error="errors.name"
+                                        :rules="[rules.name]"
+                                        :disabled="edit"
+                                    ></v-text-field>
+                                </v-flex>
+                                <v-flex xs3 pl-1>
+                                   <v-text-field
+                                        style="font-size:12px;padding:4px 0"
+                                        v-model="patient_new.M_PatientSuffix"
+                                        label="Akhiran"
+                                     
+                                    ></v-text-field>
+                                </v-flex>
+                                <v-flex xs6 pr-2>
+                                    <v-select
+                                        style="font-size:12px;padding:4px 0"
+                                        v-model="selected_gender"
+                                        :items="genders"
+                                        item-value="id"
+                                        item-text="name"
+                                        label="Jenis Kelamin"
+                                        return-object
+                                        :error="errors.gender"
+                                        :rules="[rules.gender]"
+                                        :disabled="edit"
+                                    >
+                                    </v-select>
+                                </v-flex>
+                                <v-flex xs6 pl-2>
+                                    <v-select
+                                        style="font-size:12px;padding:4px 0"
+                                        item-text="M_TitleName"
+                                        return-object
+                                        :items="title"
+                                        v-model="selected_title"
+                                        hide-details
+                                        label="Title"
+                                        :error="errors.title"
+                                        :rules="[rules.title]"
+                                    ></v-select>
+                                </v-flex>
+                                <v-flex xs4 pr-3>
+                                    <v-text-field
+                                        style="font-size:12px;padding:4px 0"
+                                        v-model="patient_new.M_PatientPOB"
+                                        label="Tempat Lahir"
+                                        :error="errors.pob"
+                                        :rules="[rules.pob]"
+                                    ></v-text-field>
+                                </v-flex>
+                                <v-flex xs4 pr-3>
+                                    <v-text-field
+                                        style="font-size:12px;padding:4px 0"
+                                        v-model="age_years"
+                                        label="Umur (tahun)"
+                                        return-masked-value
+                                    ></v-text-field>
+                                </v-flex>
+                                <v-flex xs4>
+                                    <v-text-field
+                                        style="font-size:12px;padding:4px 0"
+                                        v-model="patient_new.M_PatientDOB"
+                                        label="Tanggal Lahir"
+                                        return-masked-value
+                                        mask="##-##-####"
+                                        :rules="[rules.dob]"
+                                        :error="errors.dob"
+                                        v-if="dialog"
+                                        :disabled="edit"
+                                    ></v-text-field>
+                                </v-flex>
+                                <v-flex xs6 pr-3>
+                                    <v-select
+                                        style="font-size:12px;padding:4px 0"
+                                        item-text="display"
+                                        item-value="code"
+                                        return-object
+                                        :items="religions"
+                                        v-model="selected_religion"
+                                        hide-details
+                                        label="Agama"
+                                    ></v-select>
+                                </v-flex>
+                                <v-flex xs6>
+                                   <v-text-field
+                                        style="font-size:12px;padding:4px 0"
+                                        v-model="patient_new.M_PatientHP"
+                                        label="No HP"
+                                        :error="errors.hp"
+                                        :rules="[rules.hp]"
+                                    ></v-text-field>
+                                </v-flex>
+                                <v-flex xs12>
+                                   <v-text-field
+                                        style="font-size:12px;padding:4px 0"
+                                        v-model="my_email"
+                                        label="Email"
+                                        hint="Pisahkan dengan (koma) jika email lebih dari satu"
+                                    ></v-text-field>
+                                </v-flex>
+                                <v-flex xs8 pr-2>
+                                    <v-select
+                                        style="font-size:12px;padding:4px 0"
+                                        v-model="selected_idtype"
+                                        :items="idtypes"
+                                        item-value="id"
+                                        item-text="display"
+                                        label="Tipe ID"
+                                        return-object
+                                        clearable
+                                    >
+                                    </v-select>
+                                </v-flex>
+                                <v-flex xs4>
+                                    <v-text-field
+                                        style="font-size:12px;padding:4px 0"
+                                        v-model="patient_new.M_PatientIDNumber"
+                                        label="Nomor ID"
+                                    ></v-text-field>
+                                </v-flex>   
+                                <v-flex xs12>
+                                    <v-textarea
+                                        style="font-size:12px;padding:4px 0"
+                                        v-model="patient_new.M_PatientNote"
+                                        label="Catatan Pasien"
+                                        auto-grow
+                                        rows="1">
+                                    </v-textarea>
+                                </v-flex>
+                                <v-flex xs12>
+                                    <v-select
+                                        label="Golongan Darah"
+                                        v-model="selected_blood_type"
+                                        :items="blood_types"
+                                        item-text="display"
+                                        item-value="id"
+                                        return-object
+                                    ></v-select>
+                                </v-flex>
+                                <v-flex xs12>
+                                    <v-select
+                                        label="Rhesus Darah"
+                                        v-model="selected_blood_rh_type"
+                                        :items="blood_rh_types"
+                                        item-text="display"
+                                        item-value="id"
+                                        return-object
+                                    ></v-select>
+                                </v-flex>
+                                <v-flex xs12>
+                                    <v-autocomplete
+                                        label="Pendidikan"
+                                        v-model="selected_education_type"
+                                        :items="education_types"
+                                        item-text="display"
+                                        item-value="id"
+                                        :search-input.sync="search_education_type"
+                                        clearable
+                                        return-object
+                                    ></v-autocomplete>
+                                </v-flex>
+                                <v-flex xs12>
+                                    <v-autocomplete
+                                        label="Etnis"
+                                        v-model="selected_etnic_type"
+                                        :items="etnic_types"
+                                        item-text="display"
+                                        item-value="id"
+                                        :search-input.sync="search_etnic_type"
+                                        clearable
+                                        return-object
+                                    ></v-autocomplete>
+                                </v-flex>
+                           </v-layout>
+                            
+                        </v-flex>
+                        
+                        <v-flex xs6 pl-3>
+                            <v-layout row wrap>
+                      
+                                <v-flex xs12 pr-3>
+                                    <v-autocomplete
+                                        label="Cari Negara"
+                                        v-model="selected_country"
+                                        :items="countries"
+                                        :search-input.sync="search_country"
+                                        auto-select-first
+                                        no-filter
+                                        outline
+                                        item-text="display"
+                                        style="font-size:12px;padding:4px 0"
+                                        return-object
+                                        :loading="isLoading"
+                                        no-data-text="Ketikkan Negara"
+                                        :error="errors.country"
+                                        :rules="[rules.country]"
+                                        clearable
+                                        >
+                                        <template
+                                            slot="item"
+                                            slot-scope="{ item }"
+                                            >
+                                            <v-list-tile-content>
+                                                <v-list-tile-title v-text="item.display"></v-list-tile-title>
+                                            </v-list-tile-content>
+                                        </template>
+                                    </v-autocomplete>
+                                </v-flex>
+                                <v-flex xs12 pr-3>
+                                    <v-autocomplete
+                                        label="Cari Wilayah"
+                                        v-model="selected_region"
+                                        style="font-size:12px;padding:4px 0"
+                                        :items="regions"
+                                        outline
+                                        :search-input.sync="search_region"
+                                        auto-select-first
+                                        no-filter
+                                        item-text="text_nm"
+                                        return-object
+                                        class="mb-1"
+                                        hide-details
+                                        :loading="isLoading"
+                                        no-data-text="Ketikkan Wilayah Anda"
+                                        clearable
+                                        >
+                                    </v-autocomplete>
+                                </v-flex>
+                       
+                                <v-flex xs12>
+                                    <v-text-field
+                                        label="Provinsi"
+                                        v-model="patient_new.M_PatientAddressState"
+                                        style="font-size:12px;padding:4px 0"
+                                        readonly
+                                        :error="errors.province"
+                                        :rules="[rules.province]"
+                                    ></v-text-field>
+                                </v-flex>
+                                <v-flex xs12>
+                                    <v-text-field
+                                    label="Kota / Kabupaten"
+                                    style="font-size:12px;padding:4px 0"
+                                    v-model="patient_new.M_PatientAddressCity"
+                                    :error="errors.city"
+                                    :rules="[rules.city]"
+                                    readonly
+                                ></v-text-field>
+                                </v-flex>
+                                <v-flex xs12>
+                                    <v-text-field
+                                    label="Kecamatan"
+                                    style="font-size:12px;padding:4px 0"
+                                    v-model="patient_new.M_PatientAddressDistrict"
+                                    :error="errors.district"
+                                    :rules="[rules.district]"
+                                    readonly
+                                ></v-text-field>
+                                </v-flex>
+                                <v-flex xs12>
+                                    <v-text-field
+                                        label="Kelurahan / Desa"
+                                        style="font-size:12px;padding:4px 0"
+                                        v-model="patient_new.M_PatientAddressVillage"
+                                        :error="errors.village"
+                                        :rules="[rules.village]"
+                                        readonly
+                                    ></v-text-field>
+                                </v-flex>
+                                <v-flex xs12>
+                                    <v-textarea
+                                        style="font-size:12px;padding:4px 0"
+                                        auto-grow
+                                        rows="1"
+                                        v-model="patient_new.M_PatientAddressDescription"
+                                        label="Alamat"
+                                        :error="errors.address"
+                                        :rules="[rules.address]">
+                                    </v-textarea>
+                                   
+                                </v-flex>
+                                
+                            </v-layout>
+
+                            <v-layout class="mt-3" row>
+                                <v-flex xs12>
+                                <v-card>
+                                <v-card-title>Pasien Corporate</v-card-title>
+                                <v-card-text>
+                                    <v-layout row>
+                                        <v-flex pa-2 xs12>
+                                            <v-autocomplete
+                                                label="Corporate"
+                                                v-model="selected_corporate"
+                                                :items="corporates"
+                                                :search-input.sync="search_corporate"
+                                                item-text="CorporateName"
+                                                item-value="CorporateID"
+                                                outline
+                                                clearable
+                                                return-object
+                                                no-filter
+                                                auto-select-first
+                                                :loading="loading_corporate"
+                                                no-data-text="Ketikkan Corporate"
+                                            ></v-autocomplete>
+                                        </v-flex>
+                                    </v-layout>
+                                    <v-layout row>
+                                        <v-flex pa-2 xs6>
+                                            <v-text-field
+                                                label="NIP"
+                                                :disabled="selected_corporate.CorporateID == 0"
+                                                v-model="patient_new.M_PatientNIP"
+                                            ></v-text-field>
+                                        </v-flex>
+                                        <v-flex pa-2 xs6>
+                                            <v-text-field
+                                                label="Jabatan"
+                                                :disabled="selected_corporate.CorporateID == 0"
+                                                v-model="patient_new.M_PatientJob"
+                                            ></v-text-field>
+                                        </v-flex>
+                                    </v-layout>
+                                    <v-layout row>
+                                        <v-flex pa-2 xs6>
+                                            <v-text-field
+                                                label="Posisi"
+                                                :disabled="selected_corporate.CorporateID == 0"
+                                                v-model="patient_new.M_PatientPosisi"
+                                            ></v-text-field>
+                                        </v-flex>
+                                        <v-flex pa-2 xs6>
+                                            <v-text-field
+                                                label="Divisi"
+                                                :disabled="selected_corporate.CorporateID == 0"
+                                                v-model="patient_new.M_PatientDivisi"
+                                            ></v-text-field>
+                                        </v-flex>
+                                    </v-layout>
+                                    <v-layout row>
+                                        <v-flex pa-2 xs6>
+                                            <v-text-field
+                                                label="Lokasi"
+                                                :disabled="selected_corporate.CorporateID == 0"
+                                                v-model="patient_new.M_PatientLocation"
+                                            ></v-text-field>
+                                        </v-flex>
+                                        <v-flex pa-2 xs6>
+                                            <v-text-field
+                                                label="Departemen"
+                                                :disabled="selected_corporate.CorporateID == 0"
+                                                v-model="patient_new.M_PatientDepartement"
+                                            ></v-text-field>
+                                        </v-flex>
+                                    </v-layout>
+                                </v-card-text>
+                                </v-card>
+                                </v-flex>
+                            
+                            </v-layout>
+                        </v-flex>
+                    </v-layout>
+                </v-card-text>
+                <v-card-actions>
+                    <v-spacer></v-spacer>
+                    <v-btn
+                        color="teal"
+                        dark
+                        @click="add_use()"
+                        :disabled="!btn_save_enabled"
+                        v-show="!edit"
+                    >
+                    Simpan dan Gunakan
+                    </v-btn>
+                    <v-btn
+                        dark
+                        color="teal"
+                        @click="add_new()"
+                        v-show="edit"
+                        :disabled="!btn_save_enabled"
+                        >
+                        Simpan
+                    </v-btn>
+                    <v-btn
+                        color="grey"
+                        flat
+                        @click="dialog = false"
+                    >
+                    Tutup
+                    </v-btn>
+                </v-card-actions>
+         </v-card>
+   </v-dialog>
+</template>
+<style scoped>
+
+</style>
+<script>
+module.exports = {
+    components : {
+        'one-date-picker' : httpVueLoader('../../common/oneDatePicker.vue')
+    },
+    data() {
+        return {
+            search_education_type: '',
+            search_etnic_type: '',
+            search_corporate: '',
+            age_years: '',
+            search_region: '',
+            dialog_title: 'Data Pasien Baru',
+            emailRules:[],
+            email: value => {
+                const pattern = /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/
+                return pattern.test(value) || 'Invalid e-mail.'
+            },
+            id_number: '',
+            my_email: '',
+            rules: {
+                dob: value => {
+                    const pattern = /^(((0[1-9]|[12]\d|3[01])-(0[13578]|1[02])-((19|[2-9]\d)\d{2}))|((0[1-9]|[12]\d|30)-(0[13456789]|1[012])-((19|[2-9]\d)\d{2}))|((0[1-9]|1\d|2[0-8])-02-((19|[2-9]\d)\d{2}))|(29-02-((1[6-9]|[2-9]\d)(0[48]|[2468][048]|[13579][26])|((16|[2468][048]|[3579][26])00))))$/
+                    let x = pattern.test(value)
+                    this.errors.dob = !x
+                    return pattern.test(value) || 'Format : dd-mm-yyyy !'
+                },
+                name: value => { this.errors.name = !value; return !!value || "Harus diisi !" },
+                sex: value => { this.errors.sex = !value.M_SexID; return !!value.M_SexID || "Harus diisi !" },
+                gender: value => { this.errors.gender = !value.id; return !!value.id || "Harus diisi !" },
+                title: value => { this.errors.title = !value.M_TitleID; return !!value.M_TitleID || "Harus diisi !" },
+                pob: value => { this.errors.pob = !value; return !!value || "Harus diisi !" },
+                hp: value => { this.errors.hp = !value; return !!value || "Harus diisi !" },
+                address: value => { this.errors.address = !value; return !!value || "Harus diisi !" },
+                province: value => { this.errors.province = !value; return !!value || "Harus diisi !" },
+                city: value => { this.errors.city = !value; return !!value || "Harus diisi !" },
+                district: value => { this.errors.district = !value; return !!value || "Harus diisi !" },
+                village: value => { this.errors.village = !value; return !!value || "Harus diisi !" },
+                NIK:value => {
+                    if(this.selected_idtype.code == 'NNIDN'){
+                        if(value.length < 16){
+                            this.errors.NIK = true
+                            return "Harus 16 digit !"
+                        }
+                        else{
+                            this.errors.NIK = false
+                            return true
+                        }
+                    }
+                    else{
+                        return true
+                    }
+                },
+                country: value => { this.errors.country = _.isEmpty(value); return !_.isEmpty(value) || "Harus dipilih !" },
+
+            },
+            errors: { dob: false, name: false, sex: false, title: false, hp: false,
+                      address: false, province: false, city: false, district: false, village: false,
+                      NIK: false, country: false
+            }
+        }
+    },
+   computed: {
+        search_country : {
+            get () {
+                return this.$store.state.patient.search_country
+            },
+            set (val) {
+                this.$store.commit('patient/update_search_country', val)
+            }
+        },
+        countries : {
+            get () {
+                return this.$store.state.patient.countries
+            },
+            set (val) {
+                this.$store.commit('patient/update_countries', val)
+            }
+        },
+        selected_country : {
+            get () {
+                return this.$store.state.patient.selected_country
+            },
+            set (val) {
+                this.$store.commit('patient/update_selected_country', val)
+            }
+        },
+        isLoading : {
+            get () {
+                return this.$store.state.patient.loading
+            },
+            set (val) {
+                this.$store.commit('patient/update_loading', val)
+            }
+        },
+        regions : {
+            get () {
+                return this.$store.state.patient.regions
+            },
+            set (val) {
+                this.$store.commit('patient/update_regions', val)
+            }
+        },
+        selected_region : {
+            get () {
+                return this.$store.state.patient.selected_region
+            },
+            set (val) {
+                this.$store.commit('patient/update_selected_region', val)
+                if(val.pro_nm) this.patient_new.M_PatientAddressState = val.pro_nm
+                if(val.kab_nm) this.patient_new.M_PatientAddressCity = val.kab_nm
+                if(val.kec_nm) this.patient_new.M_PatientAddressDistrict = val.kec_nm
+                if(val.kel_nm) this.patient_new.M_PatientAddressVillage = val.kel_nm
+                if(val.regional_cd) this.patient_new.M_PatientAddressRegionalCd = val.regional_cd
+            }
+        },
+        patient_new : {
+            get () {
+               return this.$store.state.patient.patient_new
+            },
+            set (v) {
+               this.$store.commit('patient/update_patient_new', v)
+            }
+        }, 
+        dialog: {
+            get() {
+                return this.$store.state.patient.patient_new_dialog_is_active
+            },
+            set(val) {
+                this.$store.commit('patient/update_patient_new_dialog_is_active', val)
+            }
+        },
+        genders : {
+            get () {
+                return this.$store.state.patient.genders
+            },
+            set (val) {
+                this.$store.commit('patient/update_genders', val)
+            }
+        },
+        selected_gender : {
+            get () {
+                return this.$store.state.patient.selected_gender
+            },
+            set (val) {
+                this.$store.commit('patient/update_selected_gender', val)
+                console.log('selected_gender')
+                console.log(val)
+                if(val){
+                    this.$store.dispatch('other/get_titles',{
+                        gender_id: val.id
+                    })
+                    this.selected_title = {}
+                }
+            }
+        },
+        sex () {
+            return this.$store.state.other.sex
+        },
+        selected_sex : {
+            get () {
+                return this.$store.state.other.selected_sex
+            },
+            set (val) {
+                this.$store.commit('other/update_selected_sex', val)
+                
+            }
+        },
+        title () {
+            return this.$store.state.other.title
+        },
+        selected_title : {
+            get () {
+                return this.$store.state.other.selected_title
+            },
+            set (val) {
+                this.$store.commit('other/update_selected_title', val)
+            }
+        },
+        provinces () { return this.$store.state.area.provinces },
+        selected_province : { 
+            get () { return this.$store.state.area.selected_province },
+            set (v) { 
+                this.$store.commit('area/update_selected_area', {type:'province',val:v})
+                this.$store.dispatch('area/search_city') 
+            }          
+        },
+
+        cities () { return this.$store.state.area.cities },
+        selected_city : { 
+            get () { return this.$store.state.area.selected_city },
+            set (v){ 
+                        this.$store.commit('area/update_selected_area', {type:'city',val:v})
+                        this.$store.dispatch('area/search_district') 
+            }
+        },
+        districts () { return this.$store.state.area.districts },
+        selected_district : { 
+            get () { return this.$store.state.area.selected_district },
+            set (v) { this.$store.commit('area/update_selected_area', {type:'district',val:v})
+                    this.$store.dispatch('area/search_kelurahan') }
+        },
+        villages () { return this.$store.state.area.villages },
+        selected_village : { 
+            get () {
+                let x = this.$store.state.area.selected_village
+                if (x) if(x.M_KelurahanID) this.errors.kelurahan = false
+                return x 
+            },
+            set (v) { 
+              this.$store.commit('area/update_selected_area', {type:'village',val:v}) 
+              let x = this.$store.state.area.selected_village
+              if (x) if(x.M_KelurahanID) this.errors.kelurahan = false
+            }
+        },
+        idtypes () {
+            return this.$store.state.patient.idtypes
+        },
+        selected_idtype : {
+            get () { return this.$store.state.patient.selected_idtype },
+            set (v) { this.$store.commit('patient/update_selected_idtype', v) }
+        },
+        btn_save_enabled () {
+            let xxx = true
+            if (this.errors.name || this.errors.sex || this.errors.dob ||
+                this.errors.title || this.errors.pob || this.errors.hp ||
+                this.errors.address || this.errors.kelurahan || this.errors.country || this.errors.NIK || 
+                this.errors.province || this.errors.city || this.errors.district || this.errors.village) xxx = false
+
+            return xxx
+        },
+
+        edit() {
+            return this.$store.state.patient.edit
+        },
+
+        selected_patient() {
+            return this.$store.state.patient.selected_patient
+        },
+
+        religions () {
+            return this.$store.state.other.religions
+        },
+
+        selected_religion : {
+            get () {
+                return this.$store.state.other.selected_religion
+            },
+            set (val) {
+                this.$store.commit('other/update_selected_religion', val)
+            }
+        },
+        corporates : {
+            get () {
+                return this.$store.state.patient.corporates
+            },
+            set (val) {
+                this.$store.commit('patient/update_corporates', val)
+            }
+        },
+        selected_corporate : {
+            get () {
+                return this.$store.state.patient.selected_corporate
+            },
+            set (val) {
+                this.$store.commit('patient/update_selected_corporate', val)
+            }
+        },
+        loading_corporate : {
+            get () {
+                return this.$store.state.patient.loading_corporate
+            },
+            set (val) {
+                this.$store.commit('patient/update_loading_corporate', val)
+            }
+        },
+        blood_types : {
+            get () {
+                return this.$store.state.patient.blood_types
+            },
+            set (val) {
+                this.$store.commit('patient/update_blood_types', val)
+            }
+        },
+        selected_blood_type : {
+            get () {
+                return this.$store.state.patient.selected_blood_type
+            },
+            set (val) {
+                this.$store.commit('patient/update_selected_blood_type', val)
+            }
+        },
+        loading_blood_type : {
+            get () {
+                return this.$store.state.patient.loading_blood_type
+            },
+            set (val) {
+                this.$store.commit('patient/update_loading_blood_type', val)
+            }
+        },
+        blood_rh_types : {
+            get () {
+                return this.$store.state.patient.blood_rh_types
+            },
+            set (val) {
+                this.$store.commit('patient/update_blood_rh_types', val)
+            }
+        },
+        selected_blood_rh_type : {
+            get () {
+                return this.$store.state.patient.selected_blood_rh_type
+            },
+            set (val) {
+                this.$store.commit('patient/update_selected_blood_rh_type', val)
+            }
+        },
+        loading_blood_rh_type : {
+            get () {
+                return this.$store.state.patient.loading_blood_rh_type
+            },
+            set (val) {
+                this.$store.commit('patient/update_loading_blood_rh_type', val)
+            }
+        },
+        education_types : {
+            get () {
+                return this.$store.state.patient.education_types
+            },
+            set (val) {
+                this.$store.commit('patient/update_education_types', val)
+            }
+        },
+        selected_education_type : { 
+            get () {
+                return this.$store.state.patient.selected_education_type
+            },
+            set (val) {
+                this.$store.commit('patient/update_selected_education_type', val)
+            }
+        },
+        loading_education_type : {
+            get () {
+                return this.$store.state.patient.loading_education_type
+            },
+            set (val) {
+                this.$store.commit('patient/update_loading_education_type', val)
+            }
+        },
+        etnic_types : {
+            get () {
+                return this.$store.state.patient.etnic_types
+            },
+            set (val) {
+                this.$store.commit('patient/update_etnic_types', val)
+            }
+        },
+        selected_etnic_type : {
+            get () {
+                return this.$store.state.patient.selected_etnic_type
+            },
+            set (val) {
+                this.$store.commit('patient/update_selected_etnic_type', val)
+            }
+        },
+        loading_etnic_type : {
+            get () {
+                return this.$store.state.patient.loading_etnic_type
+            },
+            set (val) {
+                this.$store.commit('patient/update_loading_etnic_type', val)
+            }
+        }
+   },
+
+   methods : {
+        thr_search_corporate: _.debounce( function () {
+            this.$store.dispatch("patient/search_corporate",this.search_corporate)
+        },2000),
+        thr_search_countries: _.debounce( function () {
+            this.$store.dispatch("patient/search_countries",this.search_country)
+        },2000),
+        thr_search_region: _.debounce( function () {
+            this.$store.dispatch("patient/searchregion",this.search_region)
+        },2000),
+       get_city() {
+           return
+       },
+       add_new (use) {
+           religion = 0
+           if(this.selected_religion)
+            religion = this.selected_religion.M_ReligionID
+           let prm = {
+                M_PatientName : this.patient_new.M_PatientName,
+                M_PatientM_TitleID : this.selected_title.M_TitleID,
+                M_PatientPrefix : this.patient_new.M_PatientPrefix,
+                M_PatientSuffix : this.patient_new.M_PatientSuffix,
+                M_PatientGender : this.selected_gender,
+                M_PatientReligionCode : this.selected_religion.code,
+                M_PatientReligionDisplay : this.selected_religion.display,
+                M_PatientPOB : this.patient_new.M_PatientPOB,
+                M_PatientDOB : this.patient_new.M_PatientDOB,
+                M_PatientHP : this.patient_new.M_PatientHP,
+                M_PatientPhone : this.patient_new.M_PatientPhone,
+                M_PatientEmail : this.my_email,
+                M_PatientIdentifierCode : (this.selected_idtype ? this.selected_idtype.id : ''),
+                M_PatientIdentifierDisplay : (this.selected_idtype ? this.selected_idtype.display : ''),
+                M_PatientIDNumber : this.patient_new.M_PatientIDNumber,
+                M_PatientNote : this.patient_new.M_PatientNote,
+                M_PatientAddressDescription : this.patient_new.M_PatientAddressDescription,
+                M_PatientAddressCountryCode : this.selected_country.code,
+                M_PatientAddressCountry : this.selected_country.display,
+                M_PatientAddressRegionalCd : this.selected_region.regional_cd,
+                M_PatientAddressLocation : this.selected_region.regional_cd,
+                M_PatientAddressCity : this.patient_new.M_PatientAddressCity,
+                M_PatientAddressVillage : this.patient_new.M_PatientAddressVillage,
+                M_PatientAddressDistrict : this.patient_new.M_PatientAddressDistrict,
+                M_PatientAddressState : this.patient_new.M_PatientAddressState,
+                M_PatientAddressID : this.patient_new.M_PatientAddressID && this.patient_new.M_PatientAddressID > 0 ? this.patient_new.M_PatientAddressID : 0,
+                M_PatientRegisteredByCorporateID : this.selected_corporate.CorporateID ? this.selected_corporate.CorporateID : 0,
+                M_PatientNIP : this.selected_corporate.CorporateID > 0 ? this.patient_new.M_PatientNIP : '',
+                M_PatientJob : this.selected_corporate.CorporateID > 0 ? this.patient_new.M_PatientJob : '',
+                M_PatientPosisi : this.selected_corporate.CorporateID > 0 ? this.patient_new.M_PatientPosisi : '',
+                M_PatientDivisi : this.selected_corporate.CorporateID > 0 ? this.patient_new.M_PatientDivisi : '',
+                M_PatientLocation : this.selected_corporate.CorporateID > 0 ? this.patient_new.M_PatientLocation : '',
+                M_PatientDepartement : this.selected_corporate.CorporateID > 0 ? this.patient_new.M_PatientDepartement : '',
+                M_PatientBloodTypeCode:this.selected_blood_type.code,
+                M_PatientBloodTypeSystem:this.selected_blood_type.code_system,
+                M_PatientBloodRhCode:this.selected_blood_rh_type.code,
+                M_PatientBloodRhSystem:this.selected_blood_rh_type.code_system,
+                M_PatientEducationCode:this.selected_education_type.code,
+                M_PatientEducationSystem:this.selected_education_type.code_system,
+                M_PatientEtnicCode:this.selected_etnic_type.code,
+                M_PatientEtnicSystem:this.selected_etnic_type.code_system
+           }
+           if (use || this.edit) { prm.use = true }
+
+           this.$store.dispatch('patient/add_new', prm)
+           this.dialog = false
+       },
+
+       add_use () {
+           this.add_new(true)
+       },
+
+       set_date (x) {
+           this.patient_new.M_PatientDOB = x.new_date
+       },
+
+        new_patient() {
+            this.$store.commit('patient/update_edit', false)
+        }
+   },
+
+   watch : {
+        search_corporate(val,old) {
+            if (val == old ) return
+            if (! val) return
+            if (val.length < 1 ) return
+            if (this.$store.state.patient.loading_corporate == 1 ) return  
+            this.thr_search_corporate()
+        },
+        age_years(val,old) {
+            if (val == old ) return
+            if (! val) return
+            let age = parseInt(val)
+            let now = new Date()
+            let dob = new Date(now.getFullYear() - age, now.getMonth(), now.getDate())
+            this.patient_new.M_PatientDOB = moment(dob).format('DD-MM-YYYY')
+        },
+        search_region(val,old) {
+            if (val == old ) return
+            if (! val) return
+            if (val.length < 1 ) return
+            if (this.$store.state.patient.loading == 1 ) return  
+            this.thr_search_region()
+        },
+        search_country(val,old) {
+            if (this.$store.state.patient.loading == 1 ) return  
+            this.thr_search_countries()
+        },
+       my_email (v, o) {
+           if (v == "") {
+               this.email = value => {
+                   return /\s/ || 'Hahaha'
+               }
+           } else {
+               this.email = value => {
+                    const pattern = /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/
+                    return pattern.test(value) || 'Invalid e-mail.'
+                }
+           }
+       },
+       
+       async dialog (val, old) {
+            if (val && !old) {
+
+                if (this.edit) {
+                    this.dialog_title = 'PERUBAHAN DATA PASIEN'
+                    let x = this.patient_new
+                    let y = this.selected_patient
+                    x.M_PatientPrefix = y.M_PatientPrefix
+                    x.M_PatientName = y.M_PatientRealName
+                    x.M_PatientSuffix = y.M_PatientSuffix
+                    x.M_PatientDOB = y.M_PatientDOB.split('-').reverse().join('-')
+                    x.M_PatientPOB = y.M_PatientPOB
+                    x.M_PatientHP = y.M_PatientHP
+                    x.M_PatientEmail = y.M_PatientEmail
+                    x.M_PatientIDNumber = y.M_PatientIDNumber
+                    
+                    this.my_email = y.M_PatientEmail
+                    this.patient_new = x
+                    console.log(this.selected_patient)
+                    
+                    //gender
+                    let genders = this.$store.state.patient.genders
+                    let x_genderid = this.selected_patient.M_PatientGender
+                    let idx_gender = _.findIndex(genders, function(o) { return parseInt(o.id) === parseInt(x_genderid) })
+                    this.selected_gender = genders[idx_gender]
+                    
+                    //title
+                    await this.$store.dispatch('other/get_titles',{
+                        gender_id: this.selected_gender.id
+                    })
+                    let titles = this.$store.state.other.title
+                    let x_titleid = this.selected_patient.M_PatientM_TitleID
+                    let idx_title = _.findIndex(titles, function(o) { return parseInt(o.M_TitleID) === parseInt(x_titleid) })
+                    this.selected_title = titles[idx_title]
+                    
+                    // ID TYPE
+                    this.selected_idtype = {id:this.selected_patient.M_PatientIdentifierCode,name:this.selected_patient.M_PatientIdentifierDisplay}
+
+                    // ID NUMBER
+                    x.M_PatientIDNumber = this.selected_patient.M_PatientIDNumber
+
+                    // RELIgION
+                    this.selected_religion = {code:this.selected_patient.M_PatientReligionCode,display:this.selected_patient.M_PatientReligionDisplay}
+
+                    //ADDRESS
+                    if(this.selected_patient.M_PatientAddressCountry){
+                    this.selected_country = {code:this.selected_patient.M_PatientAddressCountry,display:this.selected_patient.M_PatientAddressCountryName}
+                    this.$store.dispatch('patient/countries',[this.selected_country])
+                    this.search_country = this.selected_country.display
+                    this.countries = [this.selected_country]
+                    }
+                    else{
+                        this.search_country = ''
+                    }
+                    x.M_PatientAddressCountryCode = this.selected_country.code?this.selected_country.code:'ID'
+                    x.M_PatientAddressCountry = this.selected_country.display?this.selected_country.display:'Indonesia'
+                    x.M_PatientAddressRegionalCd = this.selected_patient.M_PatientAddressRegionalCd
+                    x.M_PatientAddressLocation = this.selected_patient.M_PatientAddressLocation
+                    x.M_PatientAddressCity = this.selected_patient.M_PatientAddressCity
+                    x.M_PatientAddressVillage = this.selected_patient.M_PatientAddressVillage
+                    x.M_PatientAddressDistrict = this.selected_patient.M_PatientAddressDistrict
+                    x.M_PatientAddressState = this.selected_patient.M_PatientAddressState
+                    x.M_PatientAddressNote = this.selected_patient.M_PatientAddressNote
+                    x.M_PatientAddressDescription = this.selected_patient.M_PatientAddressDescription
+
+                    x.M_PatientRegisteredByCorporateID = this.selected_patient.corporate_id ? this.selected_patient.corporate_id : 0;
+                    if(this.selected_patient.corporate_id > 0){
+                        this.selected_corporate = {id:this.selected_patient.corporate_id,name:this.selected_patient.corporate_name}
+                        this.corporates = [{id:this.selected_patient.corporate_id,name:this.selected_patient.corporate_name}]
+                    }
+                    else{
+                        this.selected_corporate = {}
+                        this.search_corporate = ''
+                        this.corporates = []
+                    }
+                    x.M_PatientNIP = this.selected_patient.M_PatientNIP
+                    x.M_PatientJob = this.selected_patient.M_PatientJob
+                    x.M_PatientPosisi = this.selected_patient.M_PatientPosisi
+                    x.M_PatientDivisi = this.selected_patient.M_PatientDivisi
+                    x.M_PatientLocation = this.selected_patient.M_PatientLocation
+                    x.M_PatientDepartement = this.selected_patient.M_PatientDepartement
+
+                    this.selected_country = {code:this.selected_patient.M_PatientAddressCountryCode,display:this.selected_patient.M_PatientAddressCountry}
+                    this.countries = [this.selected_country]
+
+                    // BLOOD TYPE
+                    this.selected_blood_type = {
+                        code:this.selected_patient.M_PatientBloodTypeCode,
+                        display:this.selected_patient.M_PatientBloodTypeDisplay, 
+                        code_system:this.selected_patient.M_PatientBloodTypeSystem
+                    }
+                    // BLOOD RH TYPE
+                    this.selected_blood_rh_type = {
+                        code:this.selected_patient.M_PatientBloodRhCode,
+                        display:this.selected_patient.M_PatientBloodRhDisplay,
+                        code_system:this.selected_patient.M_PatientBloodRhSystem
+                    }
+                    // EDUCATION TYPE
+                    this.selected_education_type = {
+                        code:this.selected_patient.M_PatientEducationCode,
+                        display:this.selected_patient.M_PatientEducationDisplay,
+                        code_system:this.selected_patient.M_PatientEducationSystem
+                    }
+                    // ETNIC TYPE
+                    this.selected_etnic_type = {
+                        code:this.selected_patient.M_PatientEtnicCode,
+                        display:this.selected_patient.M_PatientEtnicDisplay,
+                        code_system:this.selected_patient.M_PatientEtnicSystem
+                    }
+          
+
+                    // ERRORS
+                    let err = { dob: false, name: false, sex: false, title: false, hp: false,
+                      address: false, province: false, city: false, district: false, kelurahan: false}
+                    this.errors = err
+                    
+                } else {
+                    this.dialog_title = 'DATA PASIEN BARU'
+                    let x = this.patient_new
+                    this.my_email = ""
+                    x.M_PatientAddressNote = "Utama"
+                    x.M_PatienNote = ''
+                    x.M_PatientPrefix = ""
+                    x.M_PatientName = ""
+                    x.M_PatientSuffix = ""
+                    x.M_PatientDOB = ""
+                    x.M_PatientPOB = ""
+                    x.M_PatientHP = ""
+                    x.M_PatientEmail = ""
+                    x.M_PatientAddressDescription = ""
+                    x.M_PatientAddressCountry = ""
+                    x.M_PatientAddressCountryCode = ""
+                    x.M_PatientAddressRegionalCd = ""
+                    x.M_PatientAddressLocation = ""
+                    x.M_PatientAddressCity = ""
+                    x.M_PatientAddressVillage = ""
+                    x.M_PatientAddressDistrict = ""
+                    x.M_PatientAddressState = ""
+                    x.M_PatientAddressID = 0
+                    x.M_PatientIDNumber = ""
+                    x.M_PatientNIP = ""
+                    x.M_PatientJob = ""
+                    x.M_PatientPosisi = ""
+                    x.M_PatientDivisi = ""
+                    x.M_PatientLocation = ""
+                    x.M_PatientDepartement = ""
+                    x.M_PatientRegisteredByCorporateID = 0
+                    this.selected_corporate = {}
+                    this.corporates = []
+                    this.search_corporate = ''
+                    this.corporates = []
+                    this.patient_new = x
+                    this.selected_gender = {}
+                    this.selected_title = {}
+                    this.selected_idtype = {id:'NNIDN',name:'KTP'}
+                    this.selected_religion = {}
+                    this.countries = [{code:'ID',display:'Indonesia'}]
+                    this.selected_country = {code:'ID',display:'Indonesia'}
+                    this.search_country = ''
+                    this.selected_region = {}
+                    this.search_region = ''
+                    this.regions = []
+                    this.selected_blood_type = {}
+                    this.selected_blood_rh_type = {}
+                    this.selected_education_type = {}
+                    this.selected_etnic_type = {}
+                    this.search_education_type = ''
+                    this.search_etnic_type = ''
+                }
+
+                this.$store.dispatch('area/search_province')
+           }
+       }
+   },
+
+   mounted () {
+    //    this.$store.dispatch('area/search_province')
+       this.$store.dispatch('other/search_sex')
+        this.$store.dispatch('other/search_religion')
+       this.$store.dispatch('patient/search_idtype')
+       this.$store.dispatch('patient/search_blood_type')
+       this.$store.dispatch('patient/search_blood_rh_type')
+       this.$store.dispatch('patient/search_education_type')
+       this.$store.dispatch('patient/search_etnic_type')
+    //    this.$store.dispatch('area/search_city')
+   }
+}
+</script>
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/components/patientNotes.vue b/test/vuex/one-fo-registration-walk-in-stemcell/components/patientNotes.vue
new file mode 100644
index 0000000..f7de215
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/components/patientNotes.vue
@@ -0,0 +1,42 @@
+<template>
+    <v-card flat>
+        <v-divider></v-divider>
+        <v-card-text class="pt-1 pb-1 pl-1 pr-0">
+            <v-layout>
+         
+                <v-flex xs12 pa-1>
+                    <v-textarea
+                        hide-details
+                        outline
+                        placeholder=""
+                        auto-grow
+                        label="Catatan FO"
+                        rows="1"
+                        v-model="catatan_fo"
+                    ></v-textarea>
+                    
+                </v-flex>
+
+            </v-layout>
+        </v-card-text>
+        
+    </v-card>
+
+</template>
+<script>
+module.exports = {
+    components : {
+        
+    },
+    computed : {
+       catatan_fo: {
+          get() {
+             return this.$store.state.order.catatan_fo
+          },
+          set(val) {
+             this.$store.commit('order/update_catatan_fo', val)
+          }
+       }
+    },
+}
+</script>
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/components/patientReference.vue b/test/vuex/one-fo-registration-walk-in-stemcell/components/patientReference.vue
new file mode 100644
index 0000000..c5d831f
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/components/patientReference.vue
@@ -0,0 +1,170 @@
+<template>
+  <v-layout column>
+    <v-layout align-center row>
+      <v-flex xs12>
+        <v-card tile flat color="teal lighten-4" class="pa-2">
+          <h5 class="subtitle-1 font-weight-bold">REFERENCE & TIPE</h5>
+        </v-card>
+      </v-flex>
+    </v-layout>
+
+    <v-layout row wrap class="pa-2">
+      <v-flex xs12 sm8 class="pr-2">
+        <v-autocomplete
+          multiple
+          chips
+          deletable-chips
+          clearable
+          return-object
+          :items="xreference"
+          v-model="selected_reference"
+          :search-input.sync="search_item_reference"
+          item-text="M_ReferenceName"
+          item-value="M_ReferenceID"
+          no-filter
+          label="Reference"
+          no-data-text="Pilih Reference"
+        >
+          <template #item="{ item }">
+            <v-list-tile-content>
+              <v-list-tile-title>{{ item.M_ReferenceName }}</v-list-tile-title>
+            </v-list-tile-content>
+          </template>
+        </v-autocomplete>
+      </v-flex>
+
+      <v-flex xs12 sm4>
+        <v-autocomplete
+          multiple
+          chips
+          deletable-chips
+          clearable
+          return-object
+          :items="xordertype"
+          v-model="selected_ordertype_multi"
+          :search-input.sync="search_item_ordertype"
+          item-text="M_OrderTypeName"
+          item-value="M_OrderTypeID"
+          no-filter
+          label="Order Type"
+          no-data-text="Pilih Order Type"
+          @click:clear="clearOrderType"
+          @focus="loadAllOrderType"
+          @change="limitOrderType"
+        >
+          <template #item="{ item }">
+            <v-list-tile-content>
+              <v-list-tile-title>{{ item.M_OrderTypeName }}</v-list-tile-title>
+            </v-list-tile-content>
+          </template>
+        </v-autocomplete>
+      </v-flex>
+    </v-layout>
+  </v-layout>
+</template>
+
+<script>
+module.exports = {
+  data() {
+    return {
+      search_item_reference: "",
+      search_item_ordertype: "",
+      isClearingOrderType: false
+    }
+  },
+
+  computed: {
+    xreference() {
+      return this.$store.state.reference.references || []
+    },
+
+    xordertype() {
+      return this.$store.state.reference.ordertypes || []
+    },
+
+    selected_reference: {
+      get() {
+        const v = this.$store.state.reference.selected_reference
+        return Array.isArray(v) ? v : []
+      },
+      set(val) {
+        this.$store.commit(
+          "reference/update_selected_reference",
+          Array.isArray(val) ? val : []
+        )
+      }
+    },
+
+    selected_ordertype_multi: {
+      get() {
+        const v = this.$store.state.reference.selected_ordertype
+        return v ? [v] : []
+      },
+      set(val) {
+        if (Array.isArray(val) && val.length > 0) {
+          this.$store.commit(
+            "reference/update_selected_ordertype",
+            val[val.length - 1]
+          )
+        } else {
+          this.$store.commit("reference/update_selected_ordertype", null)
+        }
+      }
+    }
+  },
+
+  methods: {
+    thr_search_reference: _.debounce(function () {
+      this.$store.dispatch("reference/searchreference", this.search_item_reference)
+    }, 500),
+
+    thr_search_ordertype: _.debounce(function () {
+      this.$store.dispatch("reference/searchordertype", this.search_item_ordertype)
+    }, 500),
+
+    clearOrderType() {
+      this.isClearingOrderType = true
+      this.$store.commit("reference/update_selected_ordertype", null)
+      this.search_item_ordertype = ""
+
+      this.$nextTick(() => {
+        this.isClearingOrderType = false
+      })
+    },
+
+    loadAllOrderType() {
+      if (!this.search_item_ordertype) {
+        this.$store.dispatch("reference/searchordertype", "")
+      }
+    },
+
+    limitOrderType(val) {
+      if (Array.isArray(val) && val.length > 1) {
+        this.$store.commit(
+          "reference/update_selected_ordertype",
+          val[val.length - 1]
+        )
+      }
+    }
+  },
+
+  watch: {
+    search_item_reference(val) {
+      if (val === null || val === undefined) return
+      this.thr_search_reference()
+    },
+
+    search_item_ordertype(val) {
+      if (this.isClearingOrderType) return
+      if (val === null || val === undefined) return
+      if (typeof val !== "string") return
+      this.thr_search_ordertype()
+    }
+  },
+
+  mounted() {
+    this.$store.dispatch("reference/searchreference", "")
+    this.$store.dispatch("reference/searchordertype", "")
+  }
+}
+</script>
\ No newline at end of file
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/components/patientRightSide.vue b/test/vuex/one-fo-registration-walk-in-stemcell/components/patientRightSide.vue
new file mode 100644
index 0000000..043bd0b
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/components/patientRightSide.vue
@@ -0,0 +1,407 @@
+<template>
+   <v-card class="pa-1" height="100%">
+       <v-layout align-center row>
+         <v-flex xs12>
+            <v-card tile flat color="teal lighten-4" class="pa-2">
+               <h5 class=" subtitle-1 font-weight-bold">PENGIRIM DAN BAHASA</h5>
+            </v-card>
+         </v-flex>
+      </v-layout>
+      <v-layout column>
+         <v-flex xs12 class="pa-2">
+            <v-layout>
+               <v-flex xs6 mr-1>
+                    <v-autocomplete
+                        label="Pengirim"
+                        v-model="selected_doctor"
+                        :items="doctors"
+                        :search-input.sync="search_doctor"
+                        auto-select-first
+                        style="font-size:12px;padding:4px 0"
+                        no-filter
+                        return-object
+                        clearable
+                        :item-text="item => item.M_DoctorCode + ' - ' + item.M_DoctorName"
+                        :loading="is_loading_doctor"
+                        no-data-text="Pilih Pengirim"
+                        persistent-hint
+                        :hint="!selected_doctor || !selected_doctor.M_DoctorName ? 'ketikkan nama dokter' : `${selected_doctor.M_DoctorPrefix || ''} ${selected_doctor.M_DoctorPrefix2 || ''} ${selected_doctor.M_DoctorName || ''} ${selected_doctor.M_DoctorSuffix || ''} ${selected_doctor.M_DoctorSuffix2 || ''}`.trim()"
+                        >
+         
+                        <template v-slot:item="{ item }">
+                            <v-list-tile-content>
+                                <v-list-tile-title>{{ item.M_DoctorCode + ' - ' + item.M_DoctorPrefix + ' ' + item.M_DoctorPrefix2 + ' ' + item.M_DoctorName + ' ' + item.M_DoctorSuffix + ' ' + item.M_DoctorSuffix2 }}</v-list-tile-title>
+                                <v-list-tile-sub-title v-if="item.address" class="caption">{{ item.address }}</v-list-tile-sub-title>
+                            </v-list-tile-content>
+                        </template>
+                    </v-autocomplete>
+                    <span v-if="selected_doctor.M_DoctorNote" class="caption">{{selected_doctor.M_DoctorNote}}</span>
+                    <span v-if="selected_doctor && selected_doctor.address" class="caption grey--text">{{ selected_doctor.address }}</span>
+               </v-flex>
+               <v-flex xs3 mr-1>
+                    <v-select
+                        readonly
+                        v-model="selected_language"
+                        :items="languages"
+                        item-text="name"
+                        item-value="key"
+                        style="font-size:12px;padding:4px 0"
+                        label="Bahasa"
+                        return-object
+                        ></v-select>
+
+                </v-flex>
+
+                <v-flex xs3>
+                    <v-select
+                        v-model="selected_language_2"
+                        :items="languages_2"
+                        item-text="name"
+                        item-value="key"
+                        style="font-size:12px;padding:4px 0"
+                        label="Bahasa 2"
+                        return-object
+                        clearable
+                        ></v-select>
+
+                </v-flex>
+
+            </v-layout>
+            
+         </v-flex>
+
+         <v-flex xs12>
+            <patient-delivery></patient-delivery>
+         </v-flex>
+      </v-layout>
+   </v-card>
+</template>
+<script>
+module.exports = {
+    components: {
+        'patient-delivery' : httpVueLoader('./patientDelivery.vue')
+    },
+
+    data() {
+        return {
+            n_mounted : 1,
+            search_doctor: ''
+        }
+    },
+   computed: {
+        is_loading_doctor: {
+            get() {
+                return this.$store.state.doctor.is_loading_doctor
+            },
+            set(val) {
+                this.$store.commit("doctor/update_is_loading_doctor",val)
+            }
+        },
+        searchfpp: {
+            get() {
+                return this.$store.state.doctor.searchfpp;
+            },
+            set(val) {
+                this.$store.commit("doctor/update_searchfpp", val);
+            },
+        },
+        fpptypes() {
+            return this.$store.state.doctor.fpptypes;
+        },
+
+        selected_fpptype: {
+            get() {
+                return this.$store.state.doctor.selected_fpptype;
+            },
+            set(val) {
+                this.$store.commit("doctor/update_selected_fpptype", val);
+            },
+        },
+       doctor_alias_address:{
+         get(){
+            return this.$store.state.doctor.doctor_alias_address
+         },
+         set(val)  {
+            this.$store.commit('doctor/update_doctor_alias_address',val)
+         }
+      },
+       doctor_alias:{
+         get(){
+            return this.$store.state.doctor.doctor_alias
+         },
+         set(val)  {
+            //alert(val.M_DoctorName)
+            this.$store.commit('doctor/update_doctor_alias',val)
+            var xdoc = this.$store.state.doctor.selected_doctor
+            var company = this.$store.state.company.selected_company
+        
+
+            var doctorname = xdoc.M_DoctorName.split(']')
+            //alert(xdoc.M_DoctorName.split(']'))
+            console.log(doctorname)
+            if(doctorname[1].trim() === '-' && company.M_CompanyName !== 'PASIEN MANDIRI'){
+                this.$store.commit("company/update_show_alias_doctor",true)
+            }
+            else{
+                this.$store.commit("company/update_show_alias_doctor",false)
+                 this.$store.commit('doctor/update_doctor_alias','')
+                 this.$store.commit('doctor/update_doctor_alias_address','')
+            }
+
+            if(company){
+                if(val === '' && doctorname[1].trim() === '-' && company.M_CompanyName !== 'PASIEN MANDIRI'){
+                    this.$store.commit('doctor/update_show_doctor_alert',true)
+                }
+                else{
+                    this.$store.commit('doctor/update_show_doctor_alert',false)
+                }
+            }
+            else{
+                this.$store.commit('doctor/update_show_doctor_alert',false)
+            }
+            
+         }
+      },
+      search:{
+         get(){
+            return this.$store.state.doctor.search
+         },
+         set(val)  {
+            this.$store.commit('doctor/update_search',val)
+         }
+      },
+      
+      languages() {
+         return this.$store.state.language.languages
+      },
+
+        languages_2 () {
+            return this.$store.state.language.languages_2
+        },
+
+        selected_language: {
+            get() {
+                return this.$store.state.language.selected_language
+            },
+            set(val) {
+                this.$store.commit('language/update_selected_language', val)
+                // this.$store.commit('language/update_selected_language_2', null)
+
+                
+            }
+        },
+
+        selected_language_2: {
+            get() {
+                return this.$store.state.language.selected_language_2
+            },
+            set(val) {
+                this.$store.commit('language/update_selected_language_2', val)
+            }
+        },
+
+      selected_doctor_pj: {
+         get() {
+            return this.$store.state.doctor.selected_doctor_pj
+         },
+         set(val) {
+            this.$store.commit('doctor/update_selected_doctor_pj',val)
+         }
+      },
+      doctors_pj() {
+         return this.$store.state.doctor.doctors_pj
+      },
+
+        selected_address: {
+            get() {
+                return this.$store.state.doctor.selected_address
+            },
+            set(val) {
+                this.$store.commit('doctor/update_selected_address', val)
+            }
+        },
+
+      doctor_address() {
+         if (! this.$store.state.doctor.selected_doctor ) return []
+         if (! this.$store.state.doctor.selected_doctor.address) return []
+         return this.$store.state.doctor.selected_doctor.address
+      },
+      doctors() {
+         return this.$store.state.doctor.doctors
+      },
+      selected_doctor: {
+         get() {
+            return this.$store.state.doctor.selected_doctor
+         },
+         set(val) {
+            this.$store.commit("doctor/update_selected_doctor", val)
+            this.$store.dispatch('delivery/search_deliveries',{type:'doctor',id:val.M_DoctorID ? val.M_DoctorID : 0});
+         }
+      },
+      selected_doctor_x() {
+            return this.$store.state.doctor.selected_doctor
+      },
+      is_loading: {
+         get() {
+            return this.$store.state.doctor.search_status == 1
+         },
+         set(val) {
+            this.$store.commit("doctoc/update_search_status",val ? 1 : 2)
+         }
+      },
+      showalias: {
+         get() {
+            return this.$store.state.company.show_alias_doctor
+         },
+         set(val) {
+            this.$store.commit("company/update_show_alias_doctor",val)
+         }
+      }
+   },
+   methods: {
+       xxxshowalias(){
+           var value = this.$store.state.doctor.selected_doctor
+           var doctorname = doctor.M_DoctorName.split(']')
+           var company = this.$store.state.company.selected_company
+           console.log(value)
+           if(!_.isEmpty(value)){
+              if(this.doctor_alias === '' && doctorname[1].trim() === '-' && company.M_CompanyName !== 'PASIEN MANDIRI')
+               return true
+               else{
+                   this.doctor_alias = ''
+                   this.doctor_alias_address = ''
+                   return false
+               }
+           }
+           else{
+                this.doctor_alias = ''
+                this.doctor_alias_address = ''
+                return false
+            }
+           
+       },
+      getAddress(doc) {
+         
+         var s_addr = ''
+         if (! doc.address ) return ''
+         doc.address.forEach(function(addr){
+            if (s_addr != '') s_addr += ', '
+            s_addr += addr.M_DoctorAddressDescription
+         });
+         return s_addr
+      },
+        thr_search: _.debounce( function () {
+            console.log("search in doctor")
+            if (!window.one_token()) {
+                this.$store.commit('update_message_error', 'Maaf, koneksi Anda sempat terputus silahkan Log Out dan Login kembali')
+                this.$store.commit('update_dialog_error', true)
+                return
+            }
+            
+           // this.$store.commit("doctor/update_search_status", 1) // LOADING
+            this.$store.dispatch("doctor/search")
+        }, 1000),
+
+      doctorAdd() {
+          this.$store.commit('doctor_new/update_dialog_new', true)
+      },
+
+        thr_searchfpp: _.debounce(function () {
+            if (!window.one_token()) {
+                this.$store.commit(
+                "update_message_error",
+                "Maaf, koneksi Anda sempat terputus silahkan Log Out dan Login kembali"
+                );
+                this.$store.commit("update_dialog_error", true);
+                return;
+            }
+            console.log("fpp is loading")
+            // this.$store.commit("doctor/update_search_status", 1) // LOADING
+            this.$store.dispatch("doctor/search_fpptype");
+        }, 1000),
+   },
+   watch : {
+        search_doctor(val, old) {
+            this.$store.commit("doctor/update_search", val)
+           
+            if (val == "" ) return
+            if (val == old ) return
+            if (! val) return
+            if (val.length < 2 ) return
+            if (this.$store.state.doctor.is_loading_doctor == true ) return
+            this.thr_search()
+        },
+        searchfpp(val, old) {
+            console.log("search fpp", val)
+            this.$store.commit("doctor/update_searchfpp", val);
+            console.log("search fpp status ", this.$store.state.doctor.search_fpp_status)
+
+            if (val == "") return;
+            if (val == old) return;
+            if (!val) return;
+            if (val.length < 2) return;
+            if (this.$store.state.doctor.search_fpp_status == 1) return;
+            this.thr_searchfpp();
+        },
+
+        selected_address(val, o) {
+            let dlv = this.$store.state.delivery.checked_id
+
+            if (!val) {
+                // REMOVE FROM DELIVERY
+                let idx = dlv.indexOf(o.delivery_code)
+                if ( idx > -1) {
+                    dlv.splice(idx, 1)
+                    this.$store.commit('delivery/update_checked_id', dlv)
+                }
+            }
+
+            if (val) {
+                // Auto CHECKED
+                let cadd = val
+                if (cadd.delivery_default == "Y") {
+                    if (dlv.indexOf(cadd.delivery_code) < 0) {
+                        dlv.push(cadd.delivery_code)
+                        this.$store.commit('delivery/update_checked_id', dlv)
+                    }
+                }
+                
+            }
+        },
+
+        selected_doctor(val, o) {
+            let dlv = this.$store.state.delivery.checked_id
+
+            // REMOVE FROM DELIVERY
+            if (!val.email_default) {
+                
+                let idx = dlv.indexOf(o.delivery_code)
+                if ( idx > -1) {
+                    dlv.splice(idx, 1)
+                    this.$store.commit('delivery/update_checked_id', dlv)
+                }
+            } else if (val.email_default != "Y") {
+                let idx = dlv.indexOf(o.delivery_code)
+                if ( idx > -1) {
+                    dlv.splice(idx, 1)
+                    this.$store.commit('delivery/update_checked_id', dlv)
+                }
+            }
+        }
+   },
+   mounted: function() {
+      this.$store.dispatch("language/search")
+      this.$store.dispatch("doctor/search_fpptype")
+      /*
+      if ( this.$store.state.doctor.mounted < 1 ) {
+         this.$store.dispatch("doctor/search")
+         this.$store.dispatch("doctor/search_pj")
+         this.$store.dispatch("language/search")
+      }
+      
+      this.$store.commit("doctor/increment_mounted", 1);
+      console.log("doctor mounted : ", this.$store.state.doctor.mounted)
+      */
+   }
+}
+</script>
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/components/patientSearchBox-org.vue b/test/vuex/one-fo-registration-walk-in-stemcell/components/patientSearchBox-org.vue
new file mode 100644
index 0000000..5924bcb
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/components/patientSearchBox-org.vue
@@ -0,0 +1,125 @@
+<template>
+   <v-card class="pa-2" flat>
+      <v-layout>
+         <v-flex xs2 pa-1>
+            <v-text-field
+               label="No Antrian"
+               placeholder="No Antrian"
+               single-line
+               outline
+               v-model="queue"
+               hide-details
+               @keyup.enter.native="queue_check"
+               ></v-text-field>
+         </v-flex>
+         <v-flex xs2 pa-1>
+            <v-text-field
+               label="Search"
+               placeholder="PID"
+               single-line
+               outline
+               v-model="noreg"
+               @keyup.native="keyup"
+               hide-details
+               ></v-text-field>
+         </v-flex>
+         <v-flex xs5 pa-1>
+            <v-text-field
+               label=""
+               placeholder="Nama + HP + DOB + Alamat"
+               v-model="search"
+               single-line
+               outline
+               hide-details
+               @keyup.native="keyup"
+               ></v-text-field>
+            
+         </v-flex>
+
+         <v-flex xs3>
+            <v-layout row wrap>
+               <v-flex xs6>
+                  <patient-search-dialog></patient-search-dialog>
+               </v-flex>
+
+               <v-flex xs6>
+                  <!-- <v-btn color="primary" class="mr-1 ml-1" block>BARU</v-btn> -->
+                  <patient-new-dialog></patient-new-dialog>
+               </v-flex>
+            </v-layout>
+
+
+         </v-flex>
+      </v-layout>
+
+   </v-card>
+</template>
+<style scoped>
+.v-btn {
+   min-width: auto;
+}
+
+.v-input__slot {
+   margin-bottom: 0px !important;
+}
+
+.v-messages {
+   display: none;
+}
+
+.v-text-field--box>.v-input__control>.v-input__slot,.v-text-field--full-width>.v-input__control>.v-input__slot,.v-text-field--outline>.v-input__control>.v-input__slot {
+   min-height: 44px;
+}
+
+.v-text-field--box.v-text-field--single-line input,.v-text-field--full-width.v-text-field--single-line input,.v-text-field--outline.v-text-field--single-line input {
+   margin-top: 6px;
+}
+</style>
+<script>
+module.exports = {
+   
+   methods: {
+      keyup(e) {
+         if (e.which==13) {
+            this.$store.commit('patient/update_search_dialog_is_active',true)
+            this.$store.dispatch('patient/search')
+         }
+      },
+
+      queue_check(e) {
+         this.$store.dispatch('order/load_from_clinic')
+      }
+   },
+   computed: {
+      noreg: {
+         get() {
+            return this.$store.state.patient.noreg
+         },
+         set(val) {
+            this.$store.commit('patient/update_noreg',val)
+         }
+      },
+      search: {
+         get() {
+            return this.$store.state.patient.search
+         },
+         set(val) {
+            this.$store.commit('patient/update_search',val)
+         }
+      },
+      queue: {
+         get() {
+            return this.$store.state.order.queue
+         },
+         set(v) {
+            this.$store.commit('order/update_queue', v)
+            return
+         }
+      }
+   },
+   components : {
+      'patient-search-dialog': httpVueLoader('./patientSearchDialog.vue'),
+      'patient-new-dialog' : httpVueLoader('./patientNewDialog.vue')
+   }
+}
+</script>
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/components/patientSearchBox.vue b/test/vuex/one-fo-registration-walk-in-stemcell/components/patientSearchBox.vue
new file mode 100644
index 0000000..2c1050b
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/components/patientSearchBox.vue
@@ -0,0 +1,185 @@
+<template>
+   <v-card flat>
+      <v-layout row align-center >
+         <v-flex xs1 pa-1>
+            <patient-new-dialog></patient-new-dialog>
+            <!--<v-text-field
+               label="No Antrian"
+               placeholder="No Antrian"
+               single-line
+               outline
+               v-model="queue"
+               hide-details
+               @keyup.enter.native="queue_check"
+               ></v-text-field>-->
+         </v-flex>
+         <v-flex xs2 pa-1>
+            <v-text-field
+               label="PID"
+               placeholder="PID"
+               single-line
+               class="ma-0"
+               outline
+               hide-details
+               v-model="noreg"
+               @keyup.native="keyup"
+               clearable
+               ></v-text-field>
+         </v-flex>
+         <v-flex xs5 pa-1>
+            <v-text-field
+               label="Nama + HP + DOB + Alamat"
+               placeholder="Nama + HP + DOB + Alamat"
+               v-model="search"
+               class="ma-0"
+               single-line
+               hide-details
+               outline
+               clearable
+               @keyup.native="keyup"
+               ></v-text-field>
+            
+         </v-flex>
+
+         <!--<v-flex xs3>
+            <v-layout row wrap>
+               <v-flex xs6>
+                    <v-btn
+                        color="blue"
+                        dark
+                        class="one-btn-icon ma-1"
+                        @click="search_patient"
+                    >
+                        <span class="icon-search"></span>
+                    </v-btn>
+                  
+               </v-flex>
+
+               <v-flex xs6>
+ 
+                  
+               </v-flex>
+            </v-layout>
+
+
+         </v-flex>-->
+         <patient-search-dialog></patient-search-dialog>
+      </v-layout>
+      <v-divider v-if="showhint"></v-divider>
+      <v-layout row >
+         <v-flex xs1 pl-1  pr-1></v-flex>
+         <v-flex xs11 pl-1  pr-1>
+            <p v-if="showhint" class="mb-0 mt-1 mono caption">Tekan <kbd>enter</kbd> untuk memulai pencarian [<span class="font-weight-bold">Nama</span> + <span class="font-weight-bold">HP</span>  + <span class="font-weight-bold">DOB</span>  + <span class="font-weight-bold">Alamat</span>]</p>
+         </v-flex>
+      </v-layout>
+   </v-card>
+</template>
+<style scoped>
+.v-btn {
+   min-width: auto;
+}
+
+.v-input__slot {
+   margin-bottom: 0px !important;
+}
+
+.v-messages {
+   display: none;
+}
+
+.v-text-field--box>.v-input__control>.v-input__slot,.v-text-field--full-width>.v-input__control>.v-input__slot,.v-text-field--outline>.v-input__control>.v-input__slot {
+   min-height: 25px!important;
+   padding-bottom:5px;
+}
+
+.v-text-field--box.v-text-field--single-line input,.v-text-field--full-width.v-text-field--single-line input,.v-text-field--outline.v-text-field--single-line input {
+   margin-top: 0px;
+}
+
+.one-btn-icon { font-size: 1.5em; height: 42px; }
+</style>
+<script>
+module.exports = {
+    components : {
+        'patient-search-dialog': httpVueLoader('./patientSearchDialog.vue'),
+        'patient-new-dialog' : httpVueLoader('./patientNewDialog.vue')
+    },
+
+   computed: {
+      noreg: {
+         get() {
+            return this.$store.state.patient.noreg
+         },
+         set(val) {
+            this.$store.commit('patient/update_noreg',val)
+         }
+      },
+      search: {
+         get() {
+            return this.$store.state.patient.search
+         },
+         set(val) {
+            this.$store.commit('patient/update_search',val)
+         }
+      },
+      queue: {
+         get() {
+            return this.$store.state.order.queue
+         },
+         set(v) {
+            this.$store.commit('order/update_queue', v)
+            return
+         }
+      }
+   },
+
+    methods: {
+        keyup(e) {
+           this.showhint = true
+            if (e.which==13) {
+               if (!window.one_token()) {
+                    this.$store.commit('update_message_error', 'Maaf, koneksi Anda sempat terputus silahkan Log Out dan Login kembali')
+                    this.$store.commit('update_dialog_error', true)
+                    return
+                }
+                var xsearch = this.$store.state.patient.search
+                var xnoreg = this.$store.state.patient.noreg
+                if (xsearch.length === 0 && xnoreg.length === 0) {
+                    this.$store.commit('update_message_error', 'Ketika hanya kehampaan, ku tak sanggup mencari ... terlalu berat, cari tau apa yang ingin kau cari')
+                    this.$store.commit('update_dialog_error', true)
+                    return
+                }
+                this.showhint = false
+                this.$store.commit('patient/update_search_dialog_is_active',true)
+                var xxdata = {records:[],total:0}
+                this.$store.commit('patient/update_patients',xxdata)
+                this.$store.commit('patient/update_current_page',1)
+                this.$store.dispatch('patient/search')
+            }
+        },
+
+        queue_check(e) {
+            this.$store.dispatch('order/load_from_clinic')
+        },
+
+        search_patient() {
+            if (!window.one_token()) {
+                this.$store.commit('update_message_error', 'Maaf, koneksi Anda sempat terputus silahkan Log Out dan Login kembali')
+                this.$store.commit('update_dialog_error', true)
+                return
+            }
+            this.$store.commit('patient/update_current_page',1)
+            this.$store.commit('patient/update_search_dialog_is_active',true)
+            var xxdata = {records:[],total:0}
+            this.$store.commit('patient/update_patients',xxdata)
+            this.$store.dispatch('patient/search')
+        }
+    },
+    data() {
+      return {
+            showhint:false
+      };
+   },
+   
+}
+</script>
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/components/patientSearchDialog.vue b/test/vuex/one-fo-registration-walk-in-stemcell/components/patientSearchDialog.vue
new file mode 100644
index 0000000..69ec140
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/components/patientSearchDialog.vue
@@ -0,0 +1,74 @@
+<template>
+  
+    <v-dialog
+      v-model="dialog"
+      width="75%"
+      persistent
+    >
+      <!-- <v-btn
+        color="blue"
+        slot="activator"
+        dark
+        @click="search"
+        class="one-btn-icon ma-1"
+      >
+        <span class="icon-search"></span>
+      </v-btn> -->
+
+      <v-card>
+        <v-card-title
+            class="teal subheading  white--text pt-2 pb-2"
+            primary-title
+            align-center
+            >
+            <span class="font-weight-thin">LISTING PASIEN</span>
+         </v-card-title>
+        <v-card-text class="pt-2 pb-2">
+          <patient-search-result></patient-search-result>
+        </v-card-text>
+        <v-divider></v-divider>
+
+        <v-card-actions>
+          <v-spacer></v-spacer>
+          <v-btn
+            color="grey"
+            flat
+            @click="dialog = false"
+          >
+            Tutup
+          </v-btn>
+        </v-card-actions>
+      </v-card>
+    </v-dialog>
+  
+</template>
+
+<style scoped>
+.one-btn-icon { font-size: 1.5em; height: 42px; }
+</style>
+
+<script>
+module.exports = {
+    components : {
+        'patient-search-result': httpVueLoader('./patientSearchResult.vue')
+    },
+    methods : {
+       search: function() {
+          this.$store.dispatch('patient/search')
+       }
+    },
+    computed : {
+       dialog: {
+          get() {
+             return this.$store.state.patient.search_dialog_is_active;
+          },
+          set(val) {                
+             this.$store.commit('patient/update_search_dialog_is_active',val);
+          }
+       }
+    },
+
+    watch : {
+    }
+}
+</script>
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/components/patientSearchResult.vue b/test/vuex/one-fo-registration-walk-in-stemcell/components/patientSearchResult.vue
new file mode 100644
index 0000000..4acd610
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/components/patientSearchResult.vue
@@ -0,0 +1,295 @@
+<template>
+   <div>
+     <v-layout wrap>
+            <v-flex xs12 pl-0 pr-0 pt-2 pb-2>
+               <v-data-table 
+                  :headers="headers" 
+                  :items="patients" 
+                  :loading="isLoading"
+                  hide-actions class="elevation-1">
+
+         
+                  <template slot="no-data">
+                     <v-alert :value="isError" color="error" icon="warning">
+                        Data Pasien tidak di temukan
+                        {{errorMessage}}
+                     </v-alert>
+                  </template>
+
+
+                  <template slot="items" slot-scope="props">
+                     <td class="text-xs-left caption mono pt-1 pb-1 pl-2 " v-bind:class="{'teal lighten-4':props.item.divider === 'Y','amber lighten-4':props.item.selected}" @click="selectMe(props.item)">{{ props.item.M_PatientNoReg }}</td>
+                     <td class="text-xs-left caption mono  pa-1" v-bind:class="{'teal lighten-4':props.item.divider === 'Y','amber lighten-4':props.item.selected}" @click="selectMe(props.item)">{{ props.item.M_PatientName }}</td>
+                     <td class="pa-1 caption mono " v-bind:class="{'teal lighten-4':props.item.divider === 'Y','amber lighten-4':props.item.selected}" @click="selectMe(props.item)">{{ props.item.hp }}</td>
+                     <td class="text-xs-left caption mono  pa-1" v-bind:class="{'teal lighten-4':props.item.divider === 'Y','amber lighten-4':props.item.selected}" @click="selectMe(props.item)">{{ props.item.dob_ina}}</td>
+                     <td class="pa-1 caption mono " v-bind:class="{'teal lighten-4':props.item.divider === 'Y','amber lighten-4':props.item.selected}" @click="selectMe(props.item)">{{ props.item.M_PatientAddress}}</td>
+                  </template>
+
+               </v-data-table>
+               <div class="text-xs-center pt-2">
+                  <v-btn  :loading="loading" dark v-if="show_more" @click="showMore()" small color="teal lighten-3">
+                     Tampilkan lebih banyak
+                    <template v-slot:loader>
+                       sedang memuat ...
+                     </template>
+                  </v-btn>
+                  <v-btn depressed v-if="!show_more" small color="grey lighten-2">Tidak ada lagi data</v-btn>
+               </div>
+         </v-flex>
+         </v-layout>
+ 
+         <v-dialog
+               persistent
+               v-model="dialog_birthday"
+               width="70%"
+            >
+
+               <v-card>
+        <v-card-title
+          class="headline teal white--text"
+          primary-title
+        >
+         HAPPY BIRTHDAY : UCAPKAN SELAMAT ULANG TAHUN KEPADA PASIEN
+        </v-card-title>
+        <v-card-text>
+            <v-layout row>
+               <v-flex xs12>
+                  <v-img
+                     
+                     src="../../../libs/image/hb.png"
+                     contain
+                  >
+                     <v-layout
+                        align-center
+                        column
+                        justify-center
+                     >
+                        
+                     </v-layout>
+                  </v-img>
+               </v-flex>
+            </v-layout>
+        </v-card-text>
+        <v-divider></v-divider>
+        <v-card-actions>
+          <v-spacer></v-spacer>
+          <v-btn
+            color="primary"
+            flat
+            @click="dialog_birthday = false"
+          >
+            Tutup
+          </v-btn>
+        </v-card-actions>
+      </v-card>
+    </v-dialog> 
+   </div>
+</template>
+
+<style scoped>
+.custom-loader {
+    animation: loader 1s infinite;
+    display: flex;
+  }
+  @-moz-keyframes loader {
+    from {
+      transform: rotate(0);
+    }
+    to {
+      transform: rotate(360deg);
+    }
+  }
+  @-webkit-keyframes loader {
+    from {
+      transform: rotate(0);
+    }
+    to {
+      transform: rotate(360deg);
+    }
+  }
+  @-o-keyframes loader {
+    from {
+      transform: rotate(0);
+    }
+    to {
+      transform: rotate(360deg);
+    }
+  }
+  @keyframes loader {
+    from {
+      transform: rotate(0);
+    }
+    to {
+      transform: rotate(360deg);
+    }
+  }
+table.v-table tbody td,table.v-table tbody th {
+   height: 40px;
+}
+
+table.v-table thead tr {
+   height: 40px;
+}
+</style>
+
+<script>
+module.exports = {
+   methods: {
+      showMore(){
+         if(!this.loading){
+            this.$store.commit('patient/update_loading', true)
+            var xnow = this.curr_page
+            this.curr_page = xnow + 1
+         }
+         
+      },
+      selectMe(pat) {
+         this.$store.commit('patient/update_selected_patient', pat)
+         console.log(pat.info.birthday)
+         if(pat.info.birthday === 'Y')
+            this.dialog_birthday = true
+
+         this.$store.commit('patient/update_search_dialog_is_active',false)
+
+         this.$store.commit('order/update_patient_note', "")
+         if (pat && pat.M_PatientNote )
+            this.$store.commit('order/update_patient_note', pat.M_PatientNote)
+         this.$store.commit('order/update_catatan_fo', "")
+
+         this.$store.commit('patientaddress/testx', pat.M_PatientID);
+         //this.$store.dispatch('patientaddress/search')
+
+         this.$store.commit('delivery/update_params', {p_id:pat.M_PatientID})
+         this.$store.dispatch('delivery/search_deliveries',{type:'patient',id:pat.M_PatientID})
+
+         // clear search
+         this.$store.commit('patient/update_search', '')
+
+         // Clear delivery
+         this.$store.commit('delivery/update_checked_id', [])
+
+         if(!pat.M_PatientAddressCountry){
+            this.$store.commit('patient/update_search_country', '')
+         }else{
+            let sel_country = {code:pat.M_PatientAddressCountryCode,display:pat.M_PatientAddressCountry}
+            this.$store.commit('patient/update_selected_country', sel_country)
+            this.$store.commit('patient/update_countries',[sel_country])
+            
+         }
+
+         // Photo module
+         this.$store.commit('photo/update_patient_id', pat.M_PatientID)
+         if (pat.M_PatientPhoto == null || pat.M_PatientPhoto == "")
+            this.$store.commit('photo/update_photo_url', this.$store.state.photo.default_photo_url)
+         else
+            this.$store.commit('photo/update_photo_url', pat.M_PatientPhoto + "?r=" + Math.round(Math.random() * 1000000000))
+
+        // HISTORIES
+        //this.$store.dispatch('history/search')
+      }
+   },
+   computed : {
+      loading() {
+         return this.$store.state.patient.loading
+      },
+      show_more() {
+         return this.$store.state.patient.show_more
+      },
+      curr_page: {
+         get() {
+            return this.$store.state.patient.current_page
+         },
+         set(val) { 
+            this.$store.commit("patient/update_current_page",val)
+            this.$store.dispatch('patient/search')
+         }
+      },
+      xtotal_page: {
+         get() {
+            return this.$store.state.patient.total_patient
+         },
+         set(val) {
+            this.$store.commit("patient/update_total_patient",val)
+         }
+      },
+      isError() {
+         return this.$store.state.patient.search_status == 3
+      },
+      errorMessage() {
+         return this.$store.state.patient.search_error_message 
+      },
+      isLoading() {
+         return this.$store.state.patient.search_status == 1
+      },
+      patients() {
+         return this.$store.state.patient.patients
+      },
+      total() {
+         return this.$store.state.patient.total_patient
+      },
+      total_display() {
+         return this.$store.state.patient.total_display
+      },
+      dialog_birthday() {
+         return this.$store.state.patient.dialog_birthday
+      },
+      dialog_birthday: {
+            get() {
+                return this.$store.state.patient.dialog_birthday
+            },
+            set(val) {
+                this.$store.commit('patient/update_dialog_birthday', val)
+                // this.$store.commit('language/update_selected_language_2', null)
+
+                
+            }
+        },
+
+   },
+   data() {
+      return {
+         headers: [
+            {
+               text: "NO RM",
+               align: "left",
+               sortable: false,
+               value: "mr",
+               width: "15%",
+               class: "pa-2 teal lighten-3 white--text"
+            },
+            {
+               text: "NAMA",
+               align: "left",
+               sortable: false,
+               value: "name",
+               width: "25%",
+               class: "pa-2 teal lighten-3 white--text"
+            },
+            {
+               text: "HP",
+               align: "left",
+               sortable: false,
+               value: "hp",
+               width: "15%",
+               class: "pa-2 teal lighten-3 white--text"
+            },
+            {
+               text: "DOB",
+               align: "left",
+               sortable: false,
+               value: "dob",
+               width: "15%",
+               class: "pa-2 teal lighten-3 white--text"
+            },
+            {
+               text: "ALAMAT",
+               align: "left",
+               sortable: false,
+               value: "address",
+               class: "pa-2 teal lighten-3 white--text"
+            }
+         ],
+      };
+   }
+}
+</script>
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/index.php b/test/vuex/one-fo-registration-walk-in-stemcell/index.php
new file mode 100644
index 0000000..56c9a33
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/index.php
@@ -0,0 +1,387 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta http-equiv="X-UA-Compatible" content="ie=edge">
+    <title>One</title>
+    <link rel="stylesheet" href="../../../libs/vendor/css/google-fonts.css">
+    <link rel="stylesheet" href="../../../libs/vendor/css/icomoon-fonts.css">
+    <link rel="stylesheet" href="../../../libs/vendor/css/vuetify.min.css">
+</head>
+
+<body>
+    <div v-cloak id="app" style="margin-bottom:35px;">
+        <v-app id="smartApp">
+
+            <one-navbar></one-navbar>
+            <v-content v-if="!dialog_start" class="one" v-bind:class="{ 'teal lighten-5': tab_active == '01','#d9eeec': tab_active == '02','orange lighten-5': tab_active == '03' }">
+                <v-container fluid pt-2 pb-2 pl-1 pr-1>
+                    <v-layout column>
+                        <v-flex xs12 shrink>
+                            <finish-dialog></finish-dialog>
+                            <one-registration-tab></one-registration-tab>
+                        </v-flex>
+
+                        <v-flex xs12>
+                            <!-- <v-layout> -->
+                            <tab-01 v-show="tab_active == '01'"></tab-01>
+                            <tab-02 v-show="tab_active == '02'"></tab-02>
+                            <tab-03 v-if="pre_idx == 0 || pre_idx == null || pre_idx == -1" v-show="tab_active == '03'"></tab-03> 
+                    </v-layout>
+                    </v-flex>
+                    <!-- <v-flex xs12 shrink>
+                        <finish-dialog></finish-dialog>
+                        <one-registration-tab></one-registration-tab>
+                     </v-flex> -->
+                    <!-- <v-layout>
+                        <one-registration-tab></one-registration-tab>
+                     </v-layout> -->
+
+
+                    </v-layout>
+
+                    <v-dialog
+                        v-model="dialog_restart"
+                        max-width="290">
+                        <v-card>
+                            <v-card-title class="headline">Konfirmasi</v-card-title>
+
+                            <v-card-text>
+                                Yakin akan restart ?
+                            </v-card-text>
+
+                            <v-card-actions>
+                                <v-spacer></v-spacer>
+
+                                <v-btn
+                                    color="green darken-1"
+                                    flat="flat"
+                                    @click="dialog_restart = false">
+                                    Batal
+                                </v-btn>
+
+                                <v-btn
+                                    color="green darken-1"
+                                    flat="flat"
+                                    @click="restart_now()">
+                                    Yakin
+                                </v-btn>
+                            </v-card-actions>
+                        </v-card>
+                    </v-dialog>
+
+
+                </v-container>
+                <one-fo-registration-doctor-new></one-fo-registration-doctor-new>
+                <one-dialog-error v-if="dialog_error" :msg="message_error"></one-dialog-error>
+            </v-content>
+            <v-content>
+                <v-card
+                    class="mx-auto pt-5"
+                    color="red"
+                    dark
+                    height="100%"
+                    v-if="dialog_start">
+
+                    <v-card-text style="background:#fff">
+                        <v-container fluid grid-list-md>
+
+                            <v-layout class="pt-5 pb-3 mb-3" align-center justify-center column fill-height>
+                                <v-btn @click="start()" round dark large color="cyan">
+                                    mulai sekarang
+                                </v-btn>
+                            </v-layout>
+
+
+
+                            <v-layout d-flex align-center justify-center row>
+
+                                <v-layout row>
+                                    <v-flex xs3></v-flex>
+                                    <v-flex xs6>
+                                        <v-card tile class="pa-2">
+                                            <v-layout mt-1 mb-0 row>
+                                                <v-flex class="pl-3" xs12>
+                                                    <p class="mb-1 font-weight-black mono">INFO PENTING :</p>
+                                                </v-flex>
+                                            </v-layout>
+                                            <v-layout mt-2 mb-0 row>
+                                                <v-flex class="text-xs-center" xs1>
+                                                    <v-icon>label_important</v-icon>
+                                                </v-flex>
+                                                <v-flex xs11>
+                                                    <p class="mb-1 mono caption">Penghitungan waktu pelayanan pelanggan dimulai dari klik tombol di atas, sampai petugas melakukan klik tombol restart atau tombol baru pada tab ketiga setelah melakukan simpan order</p>
+                                                </v-flex>
+                                            </v-layout>
+                                            <v-layout mb-0 row>
+                                                <v-flex class="text-xs-center" xs1>
+                                                    <v-icon>label_important</v-icon>
+                                                </v-flex>
+                                                <v-flex xs11>
+                                                    <p class="mb-1 mono caption">Jika pelanggan tidak jadi melakukan order atau hanya sekedar bertanya, jangan lupa untuk klik tombol restart</p>
+                                                </v-flex>
+                                            </v-layout>
+                                            <v-layout mb-0 row>
+                                                <v-flex class="text-xs-center" xs1>
+                                                    <v-icon>label_important</v-icon>
+                                                </v-flex>
+                                                <v-flex xs11>
+                                                    <p class="mb-1 mono caption">Tombol restart berguna untuk mengulang perhitungan waktu pelayanan pelanggan dari awal</p>
+                                                </v-flex>
+                                            </v-layout>
+                                            <v-layout mb-0 row>
+                                                <v-flex class="text-xs-center" xs1>
+                                                    <v-icon>label_important</v-icon>
+                                                </v-flex>
+                                                <v-flex xs11>
+                                                    <p class="mb-1 mono caption">Waktu pelayanan pelanggan digunankan untuk penilaian performa petugas Front Office</p>
+                                                </v-flex>
+                                            </v-layout>
+                                        </v-card>
+                                    </v-flex>
+                                    <v-flex xs3></v-flex>
+                                </v-layout>
+                            </v-layout>
+                        </v-container>
+                    </v-card-text>
+                </v-card>
+            </v-content>
+            <v-footer v-if="!dialog_start" class="mb-5 footer" app color="#f5f5f500">
+                <v-spacer></v-spacer>
+                <v-btn @click="restart()" style="font-size:12px" color="orange" dark>
+                    <v-icon class="mr-1" small>access_time</v-icon> {{formattedElapsedTime}} &nbsp;| restart</v-btn>
+            </v-footer>
+            <one-footer> </one-footer>
+        </v-app>
+    </div>
+
+    <!-- Vendor -->
+    <script src="../../../libs/vendor/moment.min.js"></script>
+    <script src="../../../libs/vendor/numeral.min.js"></script>
+    <script src="../../../libs/vendor/moment-locale-id.js"></script>
+    <script src="../../../libs/vendor/lodash.js"></script>
+    <script src="../../../libs/vendor/axios.min.js"></script>
+    <script src="../../../libs/vendor/vue.js"></script>
+    <script src="../../../libs/vendor/vuex.js"></script>
+    <script src="../../../libs/vendor/vuetify.js"></script>
+    <script src="../../../libs/vendor/httpVueLoader.js"></script>
+    <script src="../../../libs/vendor/webcam.min.js"></script>
+    <script src="../../../libs/one_print_barcode.js"></script>
+
+    <script src="../../../libs/one_global.js"></script>
+    <!-- App Script -->
+    <?php
+    $ts = "?ts=" . Date("ymdhis");
+    ?>
+
+    <style scoped>
+        .footer {
+
+            right: -15px;
+            left: auto;
+        }
+    </style>
+
+    <script type="module">
+        /*
+function one_money(inp) {
+   return numeral(inp).format('0,000.00')
+}
+window.one_money = one_money
+
+
+function one_float(inp) {
+   try {
+      let val = parseFloat(inp)
+      if (isNaN(val)) return 0.0
+      return val
+   } catch(e) {
+      return 0.0
+   }
+}
+window.one_float = one_float
+*/
+
+        import {
+            store
+        } from './store.js<?php echo $ts ?>';
+        //for testing
+        window.store = store;
+        new Vue({
+            store,
+            data: {
+                dialog_restart: false
+            },
+            mounted: function() {
+                this.$store.dispatch("doctor/search_pj")
+                this.$store.dispatch("language/search")
+
+                var url_string = window.location.href
+                var url = new URL(url_string);
+                var c = url.searchParams.get("id");
+                var pre_id = url.searchParams.get("pre_id");
+                var mcuid = url.searchParams.get("mcuid");
+
+                this.$store.commit('order/update_mcuid', mcuid)
+                this.$store.commit('order/update_preid', pre_id)
+
+                if (c != null) {
+                    this.$store.commit('order/update_order_id', c)
+                    this.$store.dispatch('order/load')
+                } else {
+                    this.$store.commit('order/update_order_id', -1)
+                    this.$store.dispatch('order/load')
+                }
+
+                if (pre_id != null) {
+                    this.$store.commit('order/update_order_id', pre_id)
+
+                }
+
+                if (!one_token())
+                    location.replace('/one-ui/test/vuex/one-login')
+            },
+            computed: {
+                pre_idx() {
+                    return this.$store.state.order.preid
+                },
+                formattedElapsedTime() {
+                    const date = new Date(null);
+                    date.setSeconds(this.$store.state.order.elapsedTime / 1000);
+                    const utc = date.toUTCString();
+                    return utc.substr(utc.indexOf(":") - 2, 8)
+                    this.$store.commit('order/update_show_time', showtime)
+                },
+                tab_active() {
+                    return store.state.tab_active
+                },
+
+                message_error() {
+                    return this.$store.state.message_error
+                },
+
+                dialog_error() {
+                    return this.$store.state.dialog_error
+                },
+                dialog_start: {
+                    get() {
+                        return this.$store.state.order.dialog_start
+                    },
+                    set(val) {
+                        this.$store.commit('order/update_dialog_start', val)
+                    }
+                },
+                status_start: {
+                    get() {
+                        return this.$store.state.order.status_start
+                    },
+                    set(val) {
+                        this.$store.commit('order/update_status_start', val)
+                    }
+                },
+                time_start: {
+                    get() {
+                        return this.$store.state.order.time_start
+                    },
+                    set(val) {
+                        this.$store.commit('order/update_time_start', val)
+                    }
+                },
+                elapsedTime: {
+                    get() {
+                        return this.$store.state.order.elapsedTime
+                    },
+                    set(val) {
+                        this.$store.commit('order/update_elapsedTime', val)
+                    }
+                }
+            },
+
+            methods: {
+                start() {
+                    /*this.time_start = setInterval(() => {
+                        this.elapsedTime += 1000;
+                    }, 1000);*/
+                    this.status_start = 'Y'
+                    this.show_time = moment(new Date()).format('YYYY-MM-DD HH:mm:ss')
+                    this.dialog_start = false
+                    var url_string = window.location.href
+                    var url = new URL(url_string);
+                    var pre_id = url.searchParams.get("pre_id")
+                    this.$store.dispatch('order/get_time_start', {
+                        'id': 0,
+                        pre_id: pre_id
+                    })
+                },
+                stop() {
+                    clearInterval(this.time_start);
+                },
+                reset() {
+                    this.elapsedTime = 0;
+                },
+                restart() {
+                    this.dialog_restart = true
+                },
+                restart_now() {
+                    //location.reload()
+                    if (this.$store.state.payment.order_id && this.$store.state.payment.order_id !== 0)
+                        this.$store.dispatch('payment/reset', {
+                            order_id: this.$store.state.payment.order_id,
+                            time_start: this.$store.state.order.show_time
+                        })
+                    else {
+                        var url_string = window.location.href
+                        var url = new URL(url_string);
+                        var pre_id = url.searchParams.get("pre_id")
+                        var mcuid = url.searchParams.get("mcuid")
+                        var url_preregister = this.$store.state.order.url_preregister
+                        var url_register = this.$store.state.order.url_register
+                        if (pre_id != null) {
+                            location.replace("/one-ui/" + url_preregister + "?mcuid=" + mcuid)
+                        } else {
+                            location.reload("one-ui/" + url_register)
+                        }
+                    }
+                },
+                goToClinic() {
+                    let x = this.$store.state.patient.selected_patient
+                    if (x)
+                        if (x.M_PatientNoReg) {
+                            location.replace("/one-ui/test/vuex/one-fo-clinic-registration/?noreg=" + x.M_PatientNoReg)
+                            return
+                        }
+
+
+                    location.replace("/one-ui/test/vuex/one-fo-clinic-registration/")
+                }
+            },
+            el: '#app',
+            components: {
+                'one-navbar': httpVueLoader('../../../apps/components/oneNavbarComponent.vue'),
+                'one-footer': httpVueLoader('../../../apps/components/oneFooter.vue'),
+                //   'patient-left-side' : httpVueLoader('./components/patientLeftSide.vue'),
+                //   'patient-right-side' : httpVueLoader('./components/patientRightSide.vue'),
+                'one-registration-tab': httpVueLoader('./components/oneRegistrationTab.vue'),
+                'tab-01': httpVueLoader('./components/oneFoRegistrationTab01.vue'),
+                'tab-02': httpVueLoader('./components/oneFoRegistrationTab02.vue'),
+                'tab-03': httpVueLoader('./components/oneFoRegistrationTab03.vue'),
+                'finish-dialog': httpVueLoader('./components/oneFoRegisterFinishDialog.vue'),
+                'one-fo-registration-doctor-new': httpVueLoader('./components/oneFoRegistrationDoctorNewDialog.vue'),
+                'one-dialog-error': httpVueLoader('../common/oneDialogError.vue')
+            }
+        })
+    </script>
+    <style>
+        [v-cloak] {
+            display: none
+        }
+
+        .v-content.one {
+            //padding:64px 0px 0px !important;
+        }
+    </style>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/modules/area.js b/test/vuex/one-fo-registration-walk-in-stemcell/modules/area.js
new file mode 100644
index 0000000..4222511
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/modules/area.js
@@ -0,0 +1,229 @@
+// 1 => LOADING
+// 2 => DONE
+// 3 => ERROR
+import * as api from "../api/area.js"
+window.api = api
+
+export default  {
+   namespaced: true,
+   state: {
+      search: '',
+      search_status:0,
+      search_error_message:'',
+      search_dialog_is_active: false,
+      
+      provinces: [],
+      cities: [],
+      districts: [],
+      villages: [],
+
+      total_provinces: 0,
+      total_cities: 0,
+      total_districts: 0,
+      total_villages: 0,
+
+      total_display: 0,
+
+      selected_province: {},
+      selected_city: {},
+      selected_district: {},
+      selected_village: {}
+   },
+   mutations: {
+      update_search_dialog_is_active(state,status) {
+         state.search_dialog_is_active = status
+      },
+      update_search_error_message(state,status) {
+         state.search_error_message = status
+      },
+    
+      update_search(state,val) {
+         state.search=val 
+      },
+
+      update_search_status(state,status) {
+         state.search_status = status
+      },
+
+      update_area(state, data) {
+        state[data.type] = data.records
+        state['total_'+data.type] = data.total
+        state.total_display = data.total_display            
+
+        if (["provinces", "districts", "villages"].indexOf(data.type) > -1)
+            state['selected_'+ data.type.substring(0, data.type.length-1) ] = null
+        else if (data.type == "cities")
+            state['selected_city'] = null
+
+        for (let i in data.records) {
+            if (data.records[i].is_default == "Y") {
+               
+               if (["provinces", "districts", "villages"].indexOf(data.type) > -1)
+                  state['selected_'+ data.type.substring(0, data.type.length-1) ] = data.records[i]
+               
+               else if (data.type == "cities")
+                  state['selected_city'] = data.records[i]
+            }
+                
+        }
+      },      
+
+      update_selected_area(state, val) {
+        state['selected_'+val.type] = val.val
+      }
+   },
+   actions: {
+      async search_province(context) {
+         context.commit("update_search_status", 1)
+         context.commit("update_area", {records:[], total:0, total_display:0, type:'city'})
+         context.commit("update_area", {records:[], total:0, total_display:0, type:'district'})
+         context.commit("update_area", {records:[], total:0, total_display:0, type:'village'})
+         context.commit("update_selected_area", {type:'city',val:null})
+         context.commit("update_selected_area", {type:'district',val:null})
+         context.commit("update_selected_area", {type:'village',val:null})
+         try {
+            let resp = await api.search_province(context.state.search)
+            if (resp.status != "OK") {
+               context.commit("update_search_status",3)
+               context.commit("update_search_error_message",resp.message)
+            } else {
+               context.commit("update_search_status",2)
+               context.commit("update_search_error_message","")
+                let data = {
+                    records : resp.data.records,
+                    total: resp.data.total,
+                    total_display: resp.data.total_display,
+                    type: 'provinces'
+                }
+
+                // EDIT DATA
+                if (context.rootState.patient.edit) {
+                    let pid = context.rootState.patient.selected_patient.M_ProvinceID
+                    for (let i in data.records)
+                        if (data.records[i].M_ProvinceID == pid) data.records[i].is_default = "Y"
+                        else data.records[i].is_default = "N"
+                }
+
+                context.commit("update_area", data)
+                context.dispatch("search_city")
+            }
+         } catch(e) {
+            context.commit("update_search_status",3)
+            context.commit("update_search_error_message",e.message )
+         }
+      },
+
+      async search_city(context) {
+         // City
+         context.commit("update_search_status", 1)
+         context.commit("update_area", {records:[], total:0, total_display:0, type:'district'})
+         context.commit("update_area", {records:[], total:0, total_display:0, type:'village'})
+         context.commit("update_selected_area", {type:'district',val:null})
+         context.commit("update_selected_area", {type:'village',val:null})
+         try {
+            let resp = await api.search_city(context.state.selected_province.M_ProvinceID, context.state.search)
+            if (resp.status != "OK") {
+               context.commit("update_search_status",3)
+               context.commit("update_search_error_message",resp.message)
+            } else {
+                context.commit("update_search_status",2)
+                context.commit("update_search_error_message","")
+                let data = {
+                    records : resp.data.records,
+                    total: resp.data.total,
+                    total_display: resp.data.total_display,
+                    type: 'cities'
+                }
+
+                // EDIT DATA
+                if (context.rootState.patient.edit) {
+                    let pid = context.rootState.patient.selected_patient.M_CityID
+                    for (let i in data.records)
+                        if (data.records[i].M_CityID == pid) data.records[i].is_default = "Y"
+                        else data.records[i].is_default = "N"
+                }
+
+                context.commit("update_area", data)
+                context.commit("update_search_status", 1)
+                context.dispatch("search_district")
+            }
+         } catch(e) {
+            context.commit("update_search_status",3)
+            context.commit("update_search_error_message", e.message )
+         }
+      },
+
+      async search_district(context) {
+         // City
+         context.commit("update_search_status", 1)
+         context.commit("update_area", {records:[], total:0, total_display:0, type:'village'})
+         context.commit("update_selected_area", {type:'village',val:null})
+         try {
+            let resp = await api.search_district(context.state.selected_city.M_CityID, context.state.search)
+            if (resp.status != "OK") {
+               context.commit("update_search_status",3)
+               context.commit("update_search_error_message",resp.message)
+            } else {
+                context.commit("update_search_status",2)
+                context.commit("update_search_error_message","")
+                let data = {
+                    records : resp.data.records,
+                    total: resp.data.total,
+                    total_display: resp.data.total_display,
+                    type: 'districts'
+                }
+
+                // EDIT DATA
+                if (context.rootState.patient.edit) {
+                    let pid = context.rootState.patient.selected_patient.M_DistrictID
+                    for (let i in data.records)
+                        if (data.records[i].M_DistrictID == pid) data.records[i].is_default = "Y"
+                        else data.records[i].is_default = "N"
+                }
+
+                context.commit("update_area", data)
+                context.commit("update_search_status", 1)
+                context.dispatch("search_kelurahan")
+            }
+         } catch(e) {
+            context.commit("update_search_status",3)
+            context.commit("update_search_error_message", e.message )
+         }
+      },
+
+      async search_kelurahan(context) {
+         // City
+         context.commit("update_search_status", 1)
+         try {
+            let resp = await api.search_kelurahan(context.state.selected_district.M_DistrictID, context.state.search)
+            if (resp.status != "OK") {
+               context.commit("update_search_status",3)
+               context.commit("update_search_error_message",resp.message)
+            } else {
+                context.commit("update_search_status",2)
+                context.commit("update_search_error_message","")
+                let data = {
+                    records : resp.data.records,
+                    total: resp.data.total,
+                    total_display: resp.data.total_display,
+                    type: 'villages'
+                }
+
+                // EDIT DATA
+                if (context.rootState.patient.edit) {
+                    let pid = context.rootState.patient.selected_patient.M_KelurahanID
+                    for (let i in data.records)
+                        if (data.records[i].M_KelurahanID == pid) data.records[i].is_default = "Y"
+                        else data.records[i].is_default = "N"
+                }
+
+                context.commit("update_area", data)
+                context.commit("update_search_status", 1)
+            }
+         } catch(e) {
+            context.commit("update_search_status",3)
+            context.commit("update_search_error_message", e.message )
+         }
+      }
+   }
+}
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/modules/company.js b/test/vuex/one-fo-registration-walk-in-stemcell/modules/company.js
new file mode 100644
index 0000000..bf41fc7
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/modules/company.js
@@ -0,0 +1,194 @@
+// 1 => LOADING
+// 2 => DONE
+// 3 => ERROR
+import * as api from "../api/company.js"
+
+export default  {
+   namespaced: true,
+   state: {
+      search: '',
+      search_status:0,
+      search_error_message:'',
+      companies: [],
+      total_company: 0,
+      selected_company: {},
+      selected_mou: {},
+      selected_px_tab: 'px',
+      show_alias_doctor:false,
+      order_companies:[],
+      projects:[],
+      selected_project:{},
+      is_loading_project:false,
+      fisik_templates:[],
+      selected_fisik_template:{},
+      is_loading_fisik_template:false
+   },
+   mutations: {
+      update_is_loading_fisik_template(state,val) {
+         state.is_loading_fisik_template = val
+      },
+      update_fisik_templates(state,val) {
+         state.fisik_templates = val
+      },
+      update_selected_fisik_template(state,val) {
+         if(val === null || val === undefined || (typeof val === 'object' && Object.keys(val).length === 0 && val.constructor === Object)) {
+            state.selected_fisik_template = {}
+         } else {
+            state.selected_fisik_template = val
+         }
+      },
+      update_is_loading_project(state,val) {
+         state.is_loading_project = val
+      },
+      update_selected_project(state,val) {
+         state.selected_project = val
+      },
+      update_projects(state,val) {
+         state.projects = val
+      },
+      update_order_companies(state,val) {
+         state.order_companies = val
+      },
+      update_show_alias_doctor(state,tab) {
+         state.show_alias_doctor = tab
+      },
+      update_selected_px_tab(state,tab) {
+         state.selected_px_tab = tab
+      },
+      update_search_error_message(state,status) {
+         state.search_error_message = status
+      },
+      update_selected_mou(state,val) {
+         state.selected_mou = val
+      },
+      update_search(state,val) {
+         state.search=val 
+      },
+      update_search_status(state,status) {
+         state.search_status = status
+      },
+      update_companies(state,data) {
+         state.companies= data.records
+         state.total_company= data.total
+      },
+      update_selected_company(state,val) {
+         state.selected_company=val
+      },
+
+      reset_company(state) {
+         state.companies = []
+         state.total_company = 0
+         state.search = ""
+         state.selected_company = {}
+         state.selected_mou = {}
+      }
+   },
+   actions: {
+      async search(context, prm) {
+         context.commit("update_search_status",1)
+         try {
+            let resp= await api.search(context.state.search)
+            if (resp.status != "OK") {
+               context.commit("update_search_status",3)
+               context.commit("update_search_error_message",resp.message)
+            } else {
+               context.commit("update_search_status",2)
+               context.commit("update_search_error_message","")
+               let data = {
+                  records : resp.data.records,
+                  total: resp.data.total
+               }
+               context.commit("update_companies",data)
+               
+            }
+         } catch(e) {
+            context.commit("update_search_status",3)
+            context.commit("update_search_error_message",e.message )
+         }
+      },
+      async search_project(context, prm) {
+         context.commit("update_is_loading_project",true)
+         try {
+            prm.token = window.one_token()
+            let resp= await api.search_project(prm)
+            if (resp.status != "OK") {
+               context.commit("update_is_loading_project",false)
+               context.commit("update_search_error_message",resp.message)
+            } else {
+               context.commit("update_is_loading_project",false)
+               context.commit("update_search_error_message","")
+               let data = {
+                  records : resp.data.records,
+                  total: resp.data.total
+               }
+               context.commit("update_projects",data.records)
+               
+            }
+         } catch(e) {
+            context.commit("update_is_loading_project",false)
+            context.commit("update_search_error_message",e.message )
+         }
+      },
+
+      async search_fisik_template(context, prm) {
+         context.commit("update_is_loading_fisik_template",true)
+         try {
+            prm.token = window.one_token()
+            let resp= await api.search_fisik_template(prm)
+            if (resp.status != "OK") {
+               context.commit("update_is_loading_fisik_template",false)
+               context.commit("update_search_error_message",resp.message)
+            } else {
+               context.commit("update_is_loading_fisik_template",false)
+               context.commit("update_search_error_message","")
+               let data = {
+                  records : resp.data.records,
+                  total: resp.data.total
+               }
+               context.commit("update_fisik_templates",data.records)
+               
+            }
+         } catch(e) {
+            context.commit("update_is_loading_fisik_template",false)
+            context.commit("update_search_error_message",e.message )
+         }
+      },
+
+      async search_default(context) {
+         context.commit("update_search_status",1)
+         try {
+            let resp= await api.search_default()
+            if (resp.status != "OK") {
+               context.commit("update_search_status",3)
+               context.commit("update_search_error_message", resp.message)
+            } else {
+               context.commit("update_search_status",2)
+               context.commit("update_search_error_message","")
+               let data = {
+                  records : resp.data.records,
+                  total: resp.data.total
+               }
+               context.commit("update_companies", data)
+               context.commit("update_selected_company", data.records[0])
+
+               for(let i in data.records[0].mou) {
+                    let cmou = data.records[0].mou[i]
+                  if (cmou.M_MouIsDefault == "Y") {
+                    context.commit("update_selected_mou", cmou)
+                    context.dispatch("delivery/search_deliveries", {type:'mou',id:cmou.M_MouID}, {root:true})
+                  }
+                     
+               }
+
+               // search px
+               console.log("mulai search")
+               context.dispatch('px/search', null, {root:true})
+               
+            }
+         } catch(e) {
+            context.commit("update_search_status",3)
+            context.commit("update_search_error_message",e.message )
+         }
+      }
+   }
+}
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/modules/delivery.js b/test/vuex/one-fo-registration-walk-in-stemcell/modules/delivery.js
new file mode 100644
index 0000000..4cf6234
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/modules/delivery.js
@@ -0,0 +1,134 @@
+// 1 => LOADING
+// 2 => DONE
+// 3 => ERROR
+import * as api from "../api/delivery.js"
+
+export default  {
+   namespaced: true,
+   state: {
+      search_status:0,
+      search_error_message:'',
+      deliveries: [],
+      patient_id: 0,
+      doctor_id: 0,
+      order_id: 0,
+      mou_id: 0,
+      data_deliveries:[],
+      selected_data_delivery:[],
+      checked_id: []
+   },
+   mutations: {
+      update_data_deliveries(state,value){
+         state.data_deliveries = value
+      },
+      update_selected_data_delivery(state,value){
+         state.selected_data_delivery = value
+      },
+      update_search_error_message(state,status) {
+         state.search_error_message = status
+      },
+      update_search_status(state,status) {
+         state.search_status = status
+      },
+      update_deliveries(state,data) {
+
+         for (var i in data) {
+            if (state.checked_id.indexOf(data[i].idx) > -1)
+               data[i].selected = true
+            else
+               data[i].selected = false
+         }
+
+         state.deliveries = data
+      },
+      update_deliveries_2(state) {
+         for (var i in state.deliveries) {
+            if (state.checked_id.indexOf(state.deliveries[i].idx) > -1)
+               state.deliveries[i].selected = true
+            else
+               state.deliveries[i].selected = false
+         }
+         // state.deliveries= data
+      },
+      update_selected_delivery(state,val) {
+         state.selected_delivery=val 
+      },
+      update_params(state, val) {
+         if (typeof val.p_id !== 'undefined')
+            state.patient_id = val.p_id;
+         if (typeof val.o_id !== 'undefined')
+            state.order_id = val.o_id;
+         if (typeof val.d_id !== 'undefined')
+            state.doctor_id = val.d_id;
+        if (typeof val.m_id !== 'undefined')
+            state.mou_id = val.m_id;
+         
+         
+      },
+      update_checked_id(state, val) {
+         state.checked_id = val
+      }
+   },
+   actions: {
+      async search(context) {
+         console.log(context.rootState.company.selected_company)
+         context.commit("update_search_status",1)
+         try {
+            let resp= await api.search(context.state.order_id, 
+                                        context.state.patient_id,
+                                        context.state.doctor_id,
+                                        context.state.mou_id,
+                                        context.rootState.company.selected_company.M_CompanyID)
+            if (resp.status != "OK") {
+               context.commit("update_search_status",3)
+               context.commit("update_search_error_message",resp.message)
+            } else {
+               context.commit("update_search_status",2)
+               context.commit("update_search_error_message","")
+               let data = {
+                  records : resp.data.records
+               }
+               let deliveries = resp.data.records
+               if(deliveries.length > 0)
+                  context.commit("update_deliveries",deliveries)
+            }
+         } catch(e) {
+            context.commit("update_search_status",3)
+            context.commit("update_search_error_message",e.message )
+         }
+      },
+      async search_deliveries(context,prm) {
+         console.log(context.rootState.company.selected_company)
+         context.commit("update_search_status",1)
+         try {
+            prm.token = one_token()
+            let resp= await api.search_deliveries(prm)
+            if (resp.status != "OK") {
+               context.commit("update_search_status",3)
+               context.commit("update_search_error_message",resp.message)
+            } else {
+               context.commit("update_search_status",2)
+               context.commit("update_search_error_message","")
+               let data = {
+                  records : resp.data.records
+               }
+               let deliveries = resp.data.records
+               
+               var existing_deliveries = context.state.data_deliveries
+               var exclude_type = _.filter(existing_deliveries, function(o) { return o.type !== prm.type })
+               if(deliveries.length > 0){
+                  deliveries.forEach(function(delivery) {
+                     exclude_type.push(delivery)
+                  })
+               }
+               context.commit("update_data_deliveries",exclude_type)
+               
+                  
+            }
+         } catch(e) {
+            context.commit("update_search_status",3)
+            context.commit("update_search_error_message",e.message )
+         }
+      }
+   }
+}
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/modules/doctor.js b/test/vuex/one-fo-registration-walk-in-stemcell/modules/doctor.js
new file mode 100644
index 0000000..6c95657
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/modules/doctor.js
@@ -0,0 +1,181 @@
+// 1 => LOADING
+// 2 => DONE
+// 3 => ERROR
+import * as api from "../api/doctor.js"
+
+export default  {
+   namespaced: true,
+   state: {
+      search : '',
+      search_status: 0,
+      search_error_message: "",
+      doctors: [],
+      total_doctor: 0,
+      selected_doctor: {},
+      selected_address: {},
+      doctor_alias:'',
+      doctor_alias_address:'',
+      doctors_pj: [],
+      selected_doctor_pj : {},
+      search_pj_status: 0,
+      search_pj_error_message: "",
+      show_doctor_alert:true,
+      mounted: 0,
+      searchfpp : '',
+      search_fpp_status: 0,
+      search_fpp_error_message: "",
+      fpptypes: [],
+      selected_fpptype: {},
+      is_loading_doctor: false
+   },
+   mutations: {
+      update_is_loading_doctor(state,val) {
+         state.is_loading_doctor = val
+      },
+      update_searchfpp(state,val) {
+         state.searchfpp=val 
+      },
+      update_search_fpp_error_message(state,status) {
+         state.search_fpp_error_message = status
+      },
+      update_search_fpp_status(state,status) {
+         state.search_fpp_status = status
+      },
+      update_fpptypes(state,val) {
+         state.fpptypes=val.records 
+      },
+      update_selected_fpptype(state,val) {
+         state.selected_fpptype=val 
+      },
+      update_doctor_alias(state,val) {
+         state.doctor_alias=val 
+      },
+      update_doctor_alias_address(state,val) {
+         state.doctor_alias_address=val 
+      },
+      update_show_doctor_alert(state,val) {
+         state.show_doctor_alert=val 
+      },
+      update_search(state,val) {
+         state.search=val 
+      },
+      update_search_error_message(state,status) {
+         state.search_error_message = status
+      },
+      update_search_status(state,status) {
+         state.search_status = status
+      },
+      update_doctors(state,data) {
+         state.doctors = data.records
+         state.total_doctor= data.total
+      },
+      update_selected_doctor(state, doc) {
+         console.log("BRI1")
+         console.log(doc)
+         state.selected_doctor= doc
+         
+         if (!doc) return
+         state.selected_address = null
+
+         if (doc.address)
+            if (doc.address.length> 0) {
+               state.selected_address = doc.address[0]
+            }
+      },
+      update_selected_address(state,addr) {
+         state.selected_address = addr
+      },
+      update_search_pj_error_message(state,status) {
+         state.search_pj_error_message = status
+      },
+      update_search_pj_status(state,status) {
+         state.search_pj_status = status
+      },
+      update_doctors_pj(state,data) {
+         state.doctors_pj = data.records
+         let flag_found = false
+         data.records.forEach(function(d) {
+            if (d.M_DoctorIsDefaultPJ == 'Y' ) {
+               state.selected_doctor_pj = d
+               flag_found = true
+            }
+         })
+         if (! flag_found & data.records.length > 0 ) state.selected_doctor_pj = data.records[0]
+      },
+      update_selected_doctor_pj(state,doc) {
+         state.selected_doctor_pj = doc
+      },
+
+      increment_mounted(state, n) {
+         state.mounted = state.mounted + n;
+      }
+   },
+   actions: {
+      async search_pj(context) {
+         context.commit("update_search_pj_status",1)
+         try {
+            let resp= await api.searchPj()
+            if (resp.status != "OK") {
+               context.commit("update_search_pj_status",3)
+               context.commit("update_search_pj_error_message",resp.message)
+            } else {
+               context.commit("update_search_pj_status",2)
+               context.commit("update_search_pj_error_message","")
+               let data = {
+                  total : resp.data.total,
+                  records : resp.data.records
+               }
+               context.commit("update_doctors_pj",data)
+            }
+         } catch(e) {
+            context.commit("update_search_pj_status",3)
+            context.commit("update_search_pj_error_message",e.message )
+         }
+      },
+      async search_fpptype(context) {
+         context.commit("update_search_status",1)
+         try {
+            console.log("in "+context.state.searchfpp)
+            let resp= await api.search_fpptype(context.state.searchfpp)
+            if (resp.status != "OK") {
+               context.commit("update_search_status",3)
+               context.commit("update_search_error_message",resp.message)
+            } else {
+               context.commit("update_search_status",2)
+               context.commit("update_search_error_message","")
+               let data = {
+                  records : resp.data.records,
+                  selected: resp.data.selected
+               }
+               context.commit("update_fpptypes",data)
+               context.commit("update_selected_fpptype",data.selected)
+            }
+         } catch(e) {
+            context.commit("update_search_status",3)
+            context.commit("update_search_error_message",e.message )
+         }
+      },
+      async search(context) {
+         context.commit("update_is_loading_doctor",true)
+         try {
+            console.log("in search doctor module")
+            let resp= await api.search(context.state.search)
+            if (resp.status != "OK") {
+               context.commit("update_is_loading_doctor",false)
+               context.commit("update_search_error_message",resp.message)
+            } else {
+               context.commit("update_is_loading_doctor",false)
+               context.commit("update_search_error_message","")
+               let data = {
+                  total : resp.data.total,
+                  records : resp.data.records
+               }
+               context.commit("update_doctors", data)
+            }
+         } catch(e) {
+            context.commit("update_is_loading_doctor",false)
+            context.commit("update_search_error_message",e.message )
+         }
+      }
+   }
+}
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/modules/doctor_new.js b/test/vuex/one-fo-registration-walk-in-stemcell/modules/doctor_new.js
new file mode 100644
index 0000000..057ddc4
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/modules/doctor_new.js
@@ -0,0 +1,285 @@
+// 1 => LOADING
+// 2 => DONE
+// 3 => ERROR
+import * as api from "../api/doctor.js"
+import * as area from "../api/area.js"
+import * as other from "../api/other.js"
+
+export default  {
+    namespaced: true,
+    state: {
+        search : '',
+        search_status: 0,
+        search_error_message: "",
+
+        sexs: [],
+        selected_sex: null,
+        param_name: '',
+        param_prefix1: '',
+        param_prefix2: '',
+        param_sufix1: '',
+        param_sufix2: '',
+        param_sufix3: '',
+        param_hp: '',
+        param_note: '',
+        param_address: '',
+
+        provinces: [],
+        selected_province: null,
+        cities: [],
+        selected_city: null,
+        districts: [],
+        selected_district: null,
+        villages: [],
+        selected_village: null,
+        dialog_new: false,
+
+        adhoc: false
+    },
+
+    mutations: {
+        update_search(state,val) {
+            state.search=val 
+        },
+
+        update_search_error_message(state,status) {
+            state.search_error_message = status
+        },
+
+        update_search_status(state,status) {
+            state.search_status = status
+        },
+
+        update_dialog_new(state, d) {
+            state.dialog_new = d
+        },
+
+        update_sexs(state, d) {
+            state.sexs = d.records
+        },
+
+        update_selected_sex(state, d) {
+            state.selected_sex = d
+        },
+
+        update_provinces(state, d) {
+            state.provinces = d.records
+            state.cities = []
+            state.districts = []
+            state.villages = []
+            state.selected_city = null
+            state.selected_district = null
+            state.selected_village = null
+
+            for (let i in d.records)
+                if (d.records[i].is_default == "Y")
+                    state.selected_province = d.records[i]
+        },
+
+        update_selected_province(state, d) {
+            state.selected_province = d
+        },
+
+        update_districts(state, d) {
+            state.districts = d.records
+            state.villages = []
+            state.selected_village = null
+
+            for (let i in d.records)
+                if (d.records[i].is_default == "Y")
+                    state.selected_district = d.records[i]
+        },
+
+        update_selected_district(state, d) {
+            state.selected_district = d
+        },
+
+        update_cities(state, d) {
+            state.cities = d.records
+            state.districts = []
+            state.villages = []
+            state.selected_district = null
+            state.selected_village = null
+
+            for (let i in d.records)
+                if (d.records[i].is_default == "Y")
+                    state.selected_city = d.records[i]
+        },
+
+        update_selected_city(state, d) {
+            state.selected_city = d
+        },
+
+        update_villages(state, d) {
+            state.villages = d.records
+
+            for (let i in d.records)
+                if (d.records[i].is_default == "Y")
+                    state.selected_village = d.records[i]
+        },
+
+        update_selected_village(state, d) {
+            state.selected_village = d
+        },
+
+        update_param(state, d) {
+            state['param_'+d.param] = d.val
+        },
+
+        update_adhoc(state, d) {
+            state.adhoc = d
+        }
+    },
+    actions: {
+        async save(context) {
+            context.commit('update_search_status', 1)
+            try {
+                let d = {
+                    name: context.state.param_name,
+                    prefix1: context.state.param_prefix1,
+                    prefix2: context.state.param_prefix2,
+                    sufix1: context.state.param_sufix1,
+                    sufix2: context.state.param_sufix2,
+                    sufix3: context.state.param_sufix3,
+                    sex: context.state.selected_sex.M_SexID,
+                    hp: context.state.param_hp,
+                    note: context.state.param_note,
+                    address: context.state.param_address,
+                    village: context.state.selected_village.M_KelurahanID
+                }
+                
+                let resp = await api.save(one_token(), d)
+                if (resp.status != 'OK') {
+                    context.commit('update_search_status', 3)
+                    context.commit('update_search_error_message', resp.message)
+                } else {
+                    context.commit('update_search_status', 2)
+                    context.commit('update_search_error_message', '')
+                    let data = {
+                        records: resp.data.records,
+                        total: resp.data.total
+                    }
+
+                    context.commit('update_adhoc', true)
+                    context.commit('doctor/update_doctors', data, {root:true})
+                    context.commit('doctor/update_search', data.records[0].M_DoctorRealName, {root:true})
+                    context.commit('doctor/update_selected_doctor', data.records[0], {root:true})
+                    context.commit('delivery/update_params', {d_id:data.records[0].M_DoctorID}, {root:true})
+                    context.dispatch('delivery/search', null, {root:true})
+
+                    context.commit('update_dialog_new', false)
+                    context.commit('update_dialog_loading', false, {root:true})
+
+                    
+                }
+            } catch(e) {
+                console.log(e)
+            }
+        },
+
+        async search_sex(context) {
+            context.commit('update_search_status', 1)
+            try {
+                let resp = await other.search_sex()
+                if (resp.status != 'OK') {
+                    context.commit('update_search_status', 3)
+                    context.commit('update_search_error_message', resp.message)
+                } else {
+                    context.commit('update_search_status', 2)
+                    context.commit('update_search_error_message', '')
+                    let data = {
+                        records: resp.data.records
+                    }
+
+                    context.commit('update_sexs', data)
+                }
+            } catch(e) {
+
+            }
+        },
+
+        async search_province(context) {
+            context.commit('update_search_status', 1)
+            try {
+                let resp = await area.search_province()
+                if (resp.status != 'OK') {
+                    context.commit('update_search_status', 3)
+                    context.commit('update_search_error_message', resp.message)
+                } else {
+                    context.commit('update_search_status', 2)
+                    context.commit('update_search_error_message', '')
+                    let data = {
+                        records: resp.data.records
+                    }
+
+                    context.commit('update_provinces', data)
+                }
+            } catch(e) {
+
+            }
+        },
+
+        async search_city(context) {
+            context.commit('update_search_status', 1)
+            try {
+                let resp = await area.search_city(context.state.selected_province.M_ProvinceID)
+                if (resp.status != 'OK') {
+                    context.commit('update_search_status', 3)
+                    context.commit('update_search_error_message', resp.message)
+                } else {
+                    context.commit('update_search_status', 2)
+                    context.commit('update_search_error_message', '')
+                    let data = {
+                        records: resp.data.records
+                    }
+
+                    context.commit('update_cities', data)
+                }
+            } catch(e) {
+
+            }
+        },
+
+        async search_district(context) {
+            context.commit('update_search_status', 1)
+            try {
+                let resp = await area.search_district(context.state.selected_city.M_CityID)
+                if (resp.status != 'OK') {
+                    context.commit('update_search_status', 3)
+                    context.commit('update_search_error_message', resp.message)
+                } else {
+                    context.commit('update_search_status', 2)
+                    context.commit('update_search_error_message', '')
+                    let data = {
+                        records: resp.data.records
+                    }
+
+                    context.commit('update_districts', data)
+                }
+            } catch(e) {
+
+            }
+        },
+
+        async search_village(context) {
+            context.commit('update_search_status', 1)
+            try {
+                let resp = await area.search_kelurahan(context.state.selected_district.M_DistrictID)
+                if (resp.status != 'OK') {
+                    context.commit('update_search_status', 3)
+                    context.commit('update_search_error_message', resp.message)
+                } else {
+                    context.commit('update_search_status', 2)
+                    context.commit('update_search_error_message', '')
+                    let data = {
+                        records: resp.data.records
+                    }
+
+                    context.commit('update_villages', data)
+                }
+            } catch(e) {
+
+            }
+        }
+    }
+}
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/modules/history.js b/test/vuex/one-fo-registration-walk-in-stemcell/modules/history.js
new file mode 100644
index 0000000..1f780a5
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/modules/history.js
@@ -0,0 +1,112 @@
+// 1 => LOADING
+// 2 => DONE
+// 3 => ERROR
+import * as api from "../api/history.js"
+import doctor from "./doctor.js"
+window.api = api
+
+export default  {
+   namespaced: true,
+   state: {
+      noreg:'',
+      search: '',
+      search_status:0,
+      search_error_message:'',
+      search_dialog_is_active: false,
+      histories: [],
+
+      history_dialog: false
+   },
+   mutations: {
+        update_search_dialog_is_active(state,status) {
+            state.search_dialog_is_active = status
+        },
+
+        update_search_error_message(state,status) {
+            state.search_error_message = status
+        },
+        
+        update_search(state,val) {
+            state.search=val 
+        },
+
+        update_search_status(state,status) {
+            state.search_status = status
+        },
+
+        update_histories(state, data) {
+            state.histories = data
+        },
+
+        update_history_dialog(state, v) {
+            state.history_dialog = v
+        }
+   },
+   actions: {
+      async search(context) {
+         context.commit("update_search_status",1)
+         try {
+            let resp = await api.search(context.rootState.patient.selected_patient.M_PatientID)
+            if (resp.status != "OK") {
+               context.commit("update_search_status",3)
+               context.commit("update_search_error_message", resp.message)
+            } else {
+               context.commit("update_search_status",2)
+               context.commit("update_search_error_message","")
+
+               let data = {
+                  records : resp.data.records
+               }
+               context.commit("update_histories", resp.data.records)
+               context.commit('update_history_dialog',true)
+            }
+         } catch(e) {
+            context.commit("update_search_status",3)
+            context.commit("update_search_error_message",e.message )
+         }
+      },
+      async get_databyorder_id(context,prm) {
+         context.commit("update_search_status",1)
+         try {
+            prm.token = one_token()
+            let resp = await api.get_databyorder_id(prm)
+            if (resp.status != "OK") {
+               context.commit("update_search_status",3)
+               context.commit("update_search_error_message", resp.message)
+            } else {
+               context.commit("update_search_status",2)
+               context.commit("update_search_error_message","")
+
+               let data = {
+                  records : resp.data.records
+               }
+               console.log(data.records.status)
+               if(data.records.status === 'N'){
+                  context.commit('update_message_error', 'satu...dua...tiga permen manis rasanya, coba cek agreement sepertinya sudah kadaluarsa', {root:true})
+                  context.commit('update_dialog_error', true,  {root:true})
+               }
+               else{
+                  var rst = data.records.data
+                  //console.log(rst)
+                  let doctors = []
+                  doctors.push(rst['selected_doctor'])
+                  //console.log(doctors)
+                  context.commit('doctor/update_doctors', {records:doctors,total:doctors.length},  {root:true})
+                  context.commit('doctor/update_selected_doctor', doctors[0],  {root:true})
+                  context.commit('doctor/update_selected_address', rst['selected_address'],  {root:true})
+                  context.commit('company/update_companies', {records:rst['companies'],total:rst['companies'].length},  {root:true})
+                  context.commit('company/update_selected_company', rst['selected_company'],  {root:true})
+                  context.commit('company/update_selected_mou', rst['selected_mou'],  {root:true})
+                  context.commit('delivery/update_data_deliveries', rst['data_deliveries'],  {root:true})
+                  context.commit('history/update_history_dialog',false,{root:true})
+                  context.dispatch('px/search_pxs', prm.order_id,  {root:true})
+               }
+               
+            }
+         } catch(e) {
+            context.commit("update_search_status",3)
+            context.commit("update_search_error_message",e.message )
+         }
+      }
+   }
+}
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/modules/language.js b/test/vuex/one-fo-registration-walk-in-stemcell/modules/language.js
new file mode 100644
index 0000000..3f61ff3
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/modules/language.js
@@ -0,0 +1,78 @@
+// 1 => LOADING
+// 2 => DONE
+// 3 => ERROR
+import * as api from "../api/language.js"
+
+export default  {
+   namespaced: true,
+   state: {
+        search_status:0,
+        search_error_message:'',
+        languages: [],
+        languages_2: [],
+        selected_language: {},
+        selected_language_2: null
+   },
+   mutations: {
+        update_search_error_message(state,status) {
+            state.search_error_message = status
+        },
+        
+        update_search_status(state,status) {
+            state.search_status = status
+        },
+
+        update_languages(state, data) {
+            state.languages= data.records
+            let x = Object.assign([], state.languages)
+            if (data.records.length > 0) {
+                state.selected_language = data.records[0]
+                x.splice(0, 1)
+            }
+
+            state.languages_2 = x
+        },
+
+        update_selected_language(state, val) {
+            state.selected_language = val
+
+            let x = Object.assign([], state.languages)
+            let idx = 999
+            if (val)
+                if (val.id)
+                    for (let i in x)
+                        if (x[i].id == val.id && x[i].is_si == val.is_si)
+                            idx = i
+            
+            x.splice(idx, 1)
+            state.languages_2 = x
+            state.selected_language_2 = null
+        },
+
+        update_selected_language_2(state, val) {
+            state.selected_language_2 = val 
+        }
+   },
+   actions: {
+      async search(context) {
+         context.commit("update_search_status",1)
+         try {
+            let resp= await api.search()
+            if (resp.status != "OK") {
+               context.commit("update_search_status",3)
+               context.commit("update_search_error_message",resp.message)
+            } else {
+               context.commit("update_search_status",2)
+               context.commit("update_search_error_message","")
+               let data = {
+                  records : resp.data.records
+               }
+               context.commit("update_languages", data)
+            }
+         } catch(e) {
+            context.commit("update_search_status",3)
+            context.commit("update_search_error_message",e.message )
+         }
+      }
+   }
+}
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/modules/order.js b/test/vuex/one-fo-registration-walk-in-stemcell/modules/order.js
new file mode 100644
index 0000000..654cdc3
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/modules/order.js
@@ -0,0 +1,842 @@
+// 1 => LOADING
+// 2 => DONE
+// 3 => ERROR
+import * as api from "../api/order.js"
+
+export default {
+   namespaced: true,
+   state: {
+      order_id: 0,
+      queue: "",
+      is_from_clinic: false,
+
+      catatan_fo: '',
+      diagnosa: '',
+      patient_note: '',
+
+      finish_dialog_is_active: false,
+      current_order: {},
+
+      received_sample: {
+         flag: 'N',
+         time: ''
+      },
+
+      tabs: [
+         { "label": "DEMOGRAFI", "icon": "opacity", "code": "01", "enabled": true },
+         { "label": "PEMERIKSAAN", "icon": "verified_user", "code": "02", "enabled": true },
+         { "label": "PEMBAYARAN", "icon": "motorcycle", "code": "03", "enabled": false }
+      ],
+
+      print_dialog_is_active: false,
+      rpt_url: window.BASE_URL + '/one-ui/test/vuex/common/under-cons.pdf',
+      dialog_start: true,
+      status_start: 'Y',
+      time_start: undefined,
+      elapsedTime: 0,
+      show_time: null,
+      loading_process: false,
+      stest: [],
+      mcuid: 0,
+      preid: 0,
+      patientBarcode: [],
+      url_preregister : '',
+      url_register: '',
+      in_saving: false,
+      loading_data_patient: false,
+      uuid: '',
+      form_code: '',
+      url_qrform: '',
+      preregister_promise:'',
+      message_error:'',
+      dialog_pop_up_error: false,
+      loading_save: false,
+      url_menu_cashier: ''
+   },
+   mutations: {
+      update_url_menu_cashier(state, val) {
+         state.url_menu_cashier = val
+      },
+      update_loading_save(state, val) {
+         state.loading_save = val
+      },
+      update_message_error(state, val) {
+         state.message_error = val
+      },
+      update_dialog_pop_up_error(state, val) {
+         state.dialog_pop_up_error = val
+      },
+      update_preregister_promise(state, val) {
+         state.preregister_promise = val
+      },
+      update_url_qrform(state, val) {
+         state.url_qrform = val
+      },
+      update_uuid(state, val) {
+         state.uuid = val
+      },
+      update_form_code(state, val) {
+         state.form_code = val
+      },
+      update_loading_data_patient(state, val) {
+         state.loading_data_patient = val
+     },
+      update_in_saving(state, val) {
+         state.in_saving = val
+     },
+      update_url_preregister(state, val) {
+         state.url_preregister = val
+      },
+      update_url_register(state, val) {
+         state.url_register = val
+      },
+      update_patientBarcode(state, val) {
+         state.patientBarcode = val
+      },
+      update_preid(state, val) {
+         state.preid = val
+      },
+      update_mcuid(state, val) {
+         state.mcuid = val
+      },
+      update_stest(state, val) {
+         state.stest = val
+      },
+      update_loading_process(state, val) {
+         state.loading_process = val
+      },
+      update_show_time(state, val) {
+         state.show_time = val
+      },
+      update_elapsedTime(state, val) {
+         state.elapsedTime = val
+      },
+      update_dialog_start(state, val) {
+         state.dialog_start = val
+      },
+      update_status_start(state, val) {
+         state.status_start = val
+      },
+      update_time_start(state, val) {
+         state.time_start = val
+      },
+      update_patient_note(state, val) {
+         state.patient_note = val
+      },
+      update_catatan_fo(state, val) {
+         state.catatan_fo = val
+      },
+      update_diagnosa(state, val) {
+         state.diagnosa = val
+      },
+      update_finish_dialog_is_active(state, val) {
+         state.finish_dialog_is_active = val
+      },
+      update_current_order(state, val) {
+         state.current_order = val
+      },
+
+      update_received_sample(state, val) {
+         state.received_sample = val
+      },
+
+      update_tab_enable(state, v) {
+         state.tabs[v[0]].enabled = v[1]
+      },
+
+      update_from_clinic(state, v) {
+         state.is_from_clinic = v
+      },
+
+      update_queue(state, v) {
+         state.queue = v
+      },
+
+      update_order_id(state, v) {
+         state.order_id = v
+      },
+
+      reset_form(state) {
+         state.order_id = 0
+         state.queue = ""
+         state.is_from_clinic = false
+         state.catatan_fo = ""
+         state.diagnosa = ""
+         state.patient_note = ""
+      },
+
+      update_print_dialog_is_active(state, val) {
+         state.print_dialog_is_active = val
+      },
+
+      update_rpt_url(state, v) {
+         state.rpt_url = v
+      }
+   },
+   actions: {
+      async save(context) {
+
+         var req = [];
+         var detail = [];
+         var px_tmp = [];
+         var st = context.rootState.px.selected_test;
+         for (let i in st) {
+            let x = {
+               t_id: st[i]['T_TestID'],
+               t_name: st[i]['T_TestName'],
+               t_amount: st[i]['T_PriceAmount'],
+               t_discount: st[i]['T_PriceDisc'],
+               t_discount_rp: st[i]['T_PriceDiscRp'],
+               t_subtotal: st[i]['T_PriceSubTotal'],
+               t_total: st[i]['T_PriceTotal'],
+               t_cito: st[i]['T_TestIsCito']?st[i]['T_TestIsCito']:'N',
+               nat_test: st[i]['nat_test']?st[i]['nat_test']:null,
+               t_req: 'N',
+               t_reqnote: '',
+               t_ispacket: st[i]['is_packet']?st[i]['is_packet']:'N',
+               t_packetid: st[i]['packet_id']?st[i]['packet_id']:0,
+               packet_type: st[i]['packet_type']?st[i]['packet_type']:'',
+               packet_name: st[i]['packet_name']?st[i]['packet_name']:'',
+               t_px_type: st[i]['px_type']?st[i]['px_type']:'PX'
+            }
+            
+            let rq = context.rootState.px.requirement
+            for (let j in rq) {
+               if (rq[j].label == st[i].T_TestRequirement) {
+                  x.t_req = (rq[j].checked ? 'Y' : 'N')
+                  x.t_reqnote = rq[j].note
+               }
+            }
+
+            px_tmp.push(x)
+         }
+
+         let req_status = context.rootState.px.req_status
+         req = {
+            status : req_status, 
+            reqs : req_status == 'Y' ? [] : context.rootState.px.reqs
+         }
+
+         detail = px_tmp;
+
+         let prm = {}
+         prm.token = one_token()
+         prm.selected_patient = context.rootState.patient.selected_patient
+         prm.patient_age = context.rootState.patient.selected_patient.patient_age
+         prm.patient_note = context.state.patient_note
+         prm.diagnosa = context.state.diagnosa
+         prm.catatan_fo = context.state.catatan_fo
+         prm.selected_icd10 = context.rootState.patient.selected_icd10
+         prm.selected_doctor = context.rootState.doctor.selected_doctor
+         prm.selected_language = context.rootState.language.selected_language ? context.rootState.language.selected_language.id : 1
+         prm.selected_language_2 = context.rootState.language.selected_language_2 ? context.rootState.language.selected_language_2.id : 0
+         prm.selected_project = context.rootState.company.selected_project 
+         prm.selected_fisik_template = context.rootState.company.selected_fisik_template 
+         prm.selected_company = context.rootState.company.selected_company
+         prm.selected_mou = context.rootState.company.selected_mou
+         prm.detail = px_tmp
+         prm.received_sample = context.rootState.order.received_sample.flag ?context.rootState.order.received_sample.flag:"N"
+         
+         // Konversi format waktu ke MySQL format (YYYY-MM-DD H:i:s)
+         // Format input: "301220250900" (ddmmyyyyhhmm) -> Output: "2025-12-30 09:00:00"
+         let receivedTime = context.rootState.order.received_sample.time
+         if (receivedTime) {
+            // Parse format ddmmyyyyhhmm (12 digit tanpa separator)
+            // Contoh: "301220250900" -> "30-12-2025 09:00"
+            if (receivedTime.match(/^\d{12}$/)) {
+               let day = receivedTime.substring(0, 2)      // 30
+               let month = receivedTime.substring(2, 4)     // 12
+               let year = receivedTime.substring(4, 8)      // 2025
+               let hour = receivedTime.substring(8, 10)     // 09
+               let minute = receivedTime.substring(10, 12)   // 00
+               
+               // Format MySQL: YYYY-MM-DD H:i:s
+               receivedTime = `${year}-${month}-${day} ${hour}:${minute}:00`
+            }
+         }
+         prm.received_sample_time = receivedTime
+         prm.queue = context.state.queue
+         prm.queue_id = context.state.queue_id
+         prm.deliveries = context.rootState.delivery.data_deliveries
+         prm.cito_id = context.rootState.px.selected_cito ? context.rootState.px.selected_cito.Nat_CitoID : 0
+         prm.schedule = context.rootState.px.appx_schedule
+         prm.req = req
+
+
+         try {
+            let refs = context.rootState.reference.selected_reference || [];
+            if (!Array.isArray(refs)) refs = [refs];
+            refs = refs.filter(r => r && r.M_ReferenceID);
+
+            prm.reference = refs;
+
+            let ordertype = context.rootState.reference.selected_ordertype || null;
+            prm.ordertype = ordertype;
+
+            let resp = await api.save(prm);
+            
+            console.log('save respon' , resp.data)
+            if (resp.status != "200") {
+               context.commit('update_in_saving', false)
+               context.commit('update_loading_process', false)
+               context.commit('update_dialog_loading', false, { root: true })
+               context.commit('update_message_error', resp.data.message)
+               context.commit('update_dialog_pop_up_error', true)
+            } else {
+               // Dialog loading
+
+               if(resp.data.status != 'OK'){
+                  context.commit('update_in_saving', false)
+                  context.commit('update_loading_process', false)
+                  context.commit('update_dialog_loading', false, { root: true })
+                  context.commit('update_message_error', resp.data.message)
+                  context.commit('update_dialog_pop_up_error', true)
+                  return;
+               }
+
+               context.commit('update_loading_process', false)
+               context.commit('update_dialog_loading', false, { root: true })
+               context.commit('update_in_saving', false)
+
+               if(resp.data.data.tipe == 'new'){
+                  context.commit('patient/update_selected_patient', resp.data.data.order_header, { root: true })
+                  context.commit('payment/update_selected_patient', resp.data.data.order_header, { root: true })
+                  context.commit("update_current_order", resp.data.data)
+                  context.commit('update_uuid', resp.data.data.uuid)
+                  context.commit('update_form_code', resp.data.data.form_code)
+                  context.commit('update_url_qrform', resp.data.data.url_qrform)
+                  context.commit('update_finish_dialog_is_active', true)
+
+                  context.commit('payment/update_order_id', resp.data.data.order_id, { root: true })
+                  context.commit("payment/update_order", resp.data.data, { root: true })
+                  context.commit('update_url_menu_cashier', resp.data.data.url_menu_cashier)
+               }
+            }
+         } catch (e) {
+            context.commit('update_loading_process', false)
+            context.commit('update_dialog_loading', false, { root: true })
+            context.commit('update_in_saving', false)
+         }
+      },
+
+      async load_from_clinic(context) {
+         let queue = context.state.queue;
+
+         try {
+            let resp = await api.load_from_clinic(queue)
+
+            if (resp.status != "200") {
+               // context.commit("update_search_status",3)
+               // context.commit("update_search_error_message",resp.message)
+               alert('error')
+            } else {
+
+               if (resp.data.status != "OK") {
+
+                  return;
+               }
+
+               let data = resp.data.data
+               context.commit('update_from_clinic', true)
+
+               context.commit('patient/update_selected_patient', data.patient, { root: true })
+               context.commit('doctor/update_doctors', { records: [data.doctor], total: 1 }, { root: true })
+               context.commit('doctor/update_selected_doctor', data.doctor, { root: true })
+               context.commit('doctor/update_search', data.doctor.search, { root: true })
+
+               // Delivery
+               context.commit('delivery/update_params', { p_id: data.patient.M_PatientID }, { root: true })
+               context.commit('delivery/update_params', { d_id: data.doctor.M_DoctorID }, { root: true })
+
+
+               // Company
+               let search = data.company.search
+               delete (data.company.search)
+
+               setTimeout(function () { context.commit('company/update_companies', { records: [data.company], total: 1 }, { root: true }) }, 0)
+               setTimeout(function () { context.commit('company/update_search', search, { root: true }) }, 0)
+               setTimeout(function () { context.commit('company/update_selected_company', data.company, { root: true }) }, 0)
+
+               setTimeout(function () { context.commit('company/update_selected_mou', data.company.mou[0], { root: true }) }, 0)
+               // setTimeout(function() { context.commit('company/selected_xx', data.company.mou[0], {root:true}) }, 0)
+
+               // PX
+               //    context.commit("px/update_selected_test", data.test, {root:true})
+               //    context.commit("px/update_requirement", data.req, {root:true})
+
+               // Delivery
+               context.dispatch('delivery/search', null, { root: true })
+
+               // PX
+               context.dispatch('px/search_pxs_clinic', data.order_id, { root: true })
+            }
+         } catch (e) {
+            // context.commit("update_search_status",3)
+            // context.commit("update_search_error_message",e.message )
+         }
+      },
+      async load(context) {
+         let id = context.state.order_id;
+
+         try {
+            let resp = await api.load(id)
+
+            if (resp.status != "200") {
+               // context.commit("update_search_status",3)
+               // context.commit("update_search_error_message",resp.message)
+               alert('error')
+            } else {
+
+               if (resp.data.status != "OK") {
+                  return;
+               }
+
+               let data = resp.data.data
+
+
+               if (id !== -1)
+                  context.commit('patient/update_selected_patient', data.patient, { root: true })
+
+               //context.commit('doctor/update_doctors', { records: [data.doctor], total: 1 }, { root: true })
+              // context.commit('doctor/update_selected_doctor', data.doctor, { root: true })
+               context.commit('doctor/update_search', data.doctor.search, { root: true })
+
+               // Delivery
+               context.commit('delivery/update_params', { p_id: data.patient.M_PatientID }, { root: true })
+               context.commit('delivery/update_params', { d_id: data.doctor.M_DoctorID }, { root: true })
+
+
+               // Company
+               let search = data.company.search
+               delete (data.company.search)
+
+               setTimeout(function () { context.commit('company/update_companies', { records: [data.company], total: 1 }, { root: true }) }, 0)
+               setTimeout(function () { context.commit('company/update_search', search, { root: true }) }, 0)
+               setTimeout(function () { context.commit('company/update_selected_company', data.company, { root: true }) }, 0)
+
+               setTimeout(function () { context.commit('company/update_selected_mou', data.company.mou[0], { root: true }) }, 0)
+               // setTimeout(function() { context.commit('company/selected_xx', data.company.mou[0], {root:true}) }, 0)
+
+               context.commit('update_received_sample', data.order.rec_sample);
+
+               // PX
+               context.commit("px/update_selected_test", data.test, { root: true })
+               context.commit("px/update_requirement", data.req, { root: true })
+
+               // Delivery
+               context.dispatch('delivery/search', null, { root: true })
+
+               // Enable tab
+               context.commit('update_tab_enable', [2, true])
+
+               setTimeout(function () {
+                  context.commit('update_from_clinic', false)
+               }, 15000)
+
+            }
+         } catch (e) {
+            // context.commit("update_search_status",3)
+            // context.commit("update_search_error_message",e.message )
+         }
+      },
+
+      async reset_form(context) {
+         context.commit("reset_form")
+         context.commit("patient/update_selected_patient", {}, { root: true })
+         context.commit("doctor/update_doctors", { records: [], total: 0 }, { root: true })
+         context.commit("doctor/update_selected_doctor", {}, { root: true })
+         context.commit("doctor/update_selected_doctor_pj", {}, { root: true })
+
+         // context.commit("delivery/update_deliveries", [], {root:true})
+         // context.commit("delivery/update_selected_delivery", {}, {root:true})
+         context.commit("delivery/update_params", { p_id: 0, d_id: 0, o_id: 0 }, { root: true })
+         context.dispatch("delivery/search", null, { root: true })
+
+         context.commit("px/update_selected_test", [], { root: true })
+         context.commit("px/update_requirement", [], { root: true })
+
+         // Company
+         context.commit("company/reset_company")
+      },
+      async load_preregister(context, prm) {
+         //context.commit("update_search_status",1)
+         try {
+            prm.token = one_token()
+            let resp = await api.load_preregister(prm)
+            //alert("dasdasd")
+            // console.log(resp)
+
+            // context.commit("update_search_status",2)
+            // context.commit("update_search_error_message","")
+            // alert("aaaaaaaaaaaaaa")
+            //console.log("dasdasdasd")
+            let data = {
+               records: resp.data.records
+            }
+            console.log(resp)
+            var rst = resp.data.data.records
+            
+               console.log(rst)
+            context.commit('patient/update_selected_patient', rst['patient'], { root: true })
+            if (rst['patient']['M_PatientPhoto']) {
+               context.commit('photo/update_photo_url', rst['patient']['M_PatientPhoto'], { root: true })
+            }
+
+            let refs = rst['selected_reference'] || [];
+            if (!Array.isArray(refs)) refs = [refs];
+
+            let doctors = []
+            doctors.push(rst['selected_doctor'])
+            console.log(doctors)
+            
+            context.commit('doctor/update_doctors', { records: doctors, total: doctors.length }, { root: true })
+            context.commit('doctor/update_selected_doctor', doctors[0], { root: true })
+            context.commit('doctor/update_selected_address', rst['selected_address'], { root: true })
+            context.commit('reference/update_references', refs, { root: true })
+            context.commit('reference/update_selected_reference', refs, { root: true })
+            console.log('selesai doctor')
+            console.log(rst['companies'])
+            context.commit('company/update_companies', { records: rst['companies'], total: 1 }, { root: true })
+            console.log(context.rootState.company.companies)
+            context.commit('company/update_order_companies', rst['companies'], { root: true })
+            //console.log(context.rootState.company.companies)
+            context.commit('company/update_selected_company', rst['selected_company'], { root: true })
+            context.commit('company/update_selected_mou', rst['selected_mou'], { root: true })
+            console.log('selesai company')
+            context.commit('delivery/update_data_deliveries', rst['data_deliveries'], { root: true })
+            console.log('selesai delivery')
+            context.commit('update_stest', rst['tests'])   
+            console.log('selesai test 1')
+            //context.commit('history/update_history_dialog',false,{root:true})
+           //context.dispatch('px/search', {}, { root: true })
+            if (rst['tests']) {
+               rst['tests'].forEach(function (test) {
+                  context.dispatch('selectPx', test)
+               });
+
+            }
+            context.commit('update_preregister_promise', rst['result_promise'])
+              console.log('selesai load')
+
+
+            
+            
+
+
+         } catch (e) {
+            // context.commit("update_search_status",3)
+            // context.commit("update_search_error_message",e.message )
+         }
+      },
+      async selectPx(context, px) {
+         // console.log(context)
+         var in_selectPx = false
+         console.log(px)
+         //debugger
+         console.log("start select px")
+         if (!window.one_token()) {
+            //context.commit('update_message_error', 'Maaf, koneksi Anda sempat terputus silahkan Log Out dan Login kembali',{root:true})
+            //context.commit('update_dialog_error', true,{root:true})
+            return
+         }
+
+
+         try {
+            console.log(in_selectPx)
+            // START LOADING
+            //context.commit('update_dialog_loading', true)
+            console.log('px type ' + px.px_type)
+
+            // IF PROFILE
+            if (px.px_type == "PR" || px.px_type == "PXR")
+               return context.dispatch('selectProfile', px)
+
+
+            // SEARCH NAT TEST
+            let nt = context.rootState.px.nat_test
+            let found_nt = false
+            for (let i in px.nat_test) {
+               if (nt.indexOf(px.nat_test[i]) > -1)
+                  found_nt = true
+            }
+
+            if (found_nt) {
+               alert('Pemeriksaan tersebut sudah ada !')
+               // END LOADING
+               //context.commit('update_dialog_loading', false,{root:true})
+               return
+            }
+
+            //if (in_selectPx) return
+            in_selectPx = true
+            let selected_test = context.rootState.px.selected_test
+            let flag_found = false
+            selected_test.forEach(function (t, idx) {
+               if (t.T_TestID == px.T_TestID) {
+                  selected_test[idx] = px
+                  flag_found = true
+               }
+            })
+            if (!flag_found) {
+               selected_test.push(px)
+               let tests = context.rootState.px.tests
+               let p_idx = -1
+               tests.forEach(function (t, idx) {
+                  if (t.T_TestID == px.T_TestID) {
+                     p_idx = idx
+                  }
+               })
+               if (p_idx >= 0) {
+                  _.pullAt(tests, [p_idx])
+                  let dt = {
+                     records: tests,
+                     total: tests.length
+                  }
+                  context.commit('px/update_tests', dt, { root: true })
+               }
+            }
+            context.commit('px/update_selected_test', selected_test, { root: true })
+            console.log('load data patient px')
+            context.commit('update_loading_data_patient', true)
+            if (px.px_type !== "PN") {
+               let req = px.requirement
+               let reqs = context.rootState.px.requirement
+               if (req.length > 0) {
+                  for (let i in req) {
+                     let found = false
+                     for (let j in reqs) {
+                        if (reqs[j]['req_id'] == req[i]['req_id'])
+                           found = j
+                     }
+
+                     if (!found)
+                        reqs.push({
+                           px_id: [px.T_TestID],
+                           label: req[i]['req_name'],
+                           error_message: 'Hasil harus di isi',
+                           is_error: true,
+                           checked: false,
+                           note: '',
+                           req_id: req[i]['req_id']
+                        })
+                     else
+                        reqs[found].px_id.push(px.T_TestID)
+                  }
+
+                  context.commit('px/update_requirement', reqs, { root: true })
+               }
+            }
+
+
+            context.dispatch('px/appx_schedule', {}, { root: true })
+
+            in_selectPx = false
+            context.commit('px/update_nat_test', {}, { root: true })
+            context.commit('update_loading_data_patient', true)
+            console.log('load data patient px')
+
+            // END LOADING
+            if (px.px_type == "PN")
+               //context.commit('update_loading_data_patient', false)
+               context.dispatch('px/packet_reqs', { pxs: px.child_test }, { root: true })
+            //context.commit('update_dialog_loading', false,{root:true})
+         } catch (e) {
+            console.log(e)
+            in_selectPx = false
+         }
+      },
+
+      async selectProfile(context, px) {
+
+         try {
+            var in_selectPx = false
+            // SEARCH NAT TEST
+            let nt = context.rootState.px.nat_test
+            let found_nt = false
+            for (let i in px.nat_test) {
+               if (nt.indexOf(px.nat_test[i]) > -1)
+                  found_nt = true
+            }
+
+            if (found_nt) {
+               alert('Pemeriksaan tersebut sudah ada !')
+               // END LOADING
+               // context.commit('update_dialog_loading', false,{root:true})
+               return
+            }
+
+            let pxs = px.child_test
+
+            for (let i in pxs) {
+               px = pxs[i]
+
+               let selected_test = context.rootState.px.selected_test
+               let flag_found = false
+
+               selected_test.push(px)
+               let tests = context.rootState.px.tests
+               let p_idx = -1
+               tests.forEach(function (t, idx) {
+                  if (t.T_TestID == px.T_TestID) {
+                     p_idx = idx
+                  }
+               })
+
+               if (p_idx >= 0) {
+                  _.pullAt(tests, [p_idx])
+                  let dt = {
+                     records: tests,
+                     total: tests.length
+                  }
+                  context.commit('px/update_tests', dt, { root: true })
+               }
+
+               context.commit('px/update_selected_test', selected_test, { root: true })
+
+               let req = px.requirement
+
+               let reqs = context.rootState.px.requirement
+               if (req.length > 0) {
+                  for (let i in req) {
+                     let found = false
+                     for (let j in reqs) {
+                        if (reqs[j]['req_id'] == req[i]['req_id'])
+                           found = j
+                     }
+
+                     if (!found)
+                        reqs.push({
+                           px_id: [px.T_TestID],
+                           label: req[i]['req_name'],
+                           error_message: 'Hasil harus di isi',
+                           is_error: true,
+                           checked: false,
+                           note: '',
+                           req_id: req[i]['req_id']
+                        })
+                     else
+                        reqs[found].px_id.push(px.T_TestID)
+                  }
+
+                  context.commit('px/update_requirement', reqs, { root: true })
+               }
+            }
+
+            context.dispatch('px/appx_schedule', {}, { root: true })
+            //in_selectPx = false
+            context.commit('px/update_nat_test', {}, { root: true })
+            console.log('load data patient profile')
+            context.commit('update_loading_data_patient', true)
+
+            // END LOADING
+            //context.commit('update_dialog_loading', false,{root:true})
+
+         } catch (e) {
+            console.log(e)
+            // END LOADING
+            //context.commit('update_dialog_loading', false,{root:true})
+            // in_selectPx = false
+         }
+      },
+      async get_time_start(context, prm) {
+         try {
+            prm.token = one_token()
+            let resp = await api.get_time_start(prm)
+            if (resp.data.status != "OK") {
+
+            } else {
+               var t_orderid = resp.data.data.orderid
+               var url_preregister = resp.data.data.url_preregister
+               var url_register = resp.data.data.url_register
+               console.log(t_orderid)
+               console.log(url_preregister)
+               console.log(url_register)
+
+               context.commit('update_url_preregister', url_preregister)
+               context.commit('update_url_register', url_register)
+               if(t_orderid > 0){
+                  alert('Data telah terdaftar !!!')
+                  var url_string = window.location.href
+                  var url = new URL(url_string);
+                  var mcuid = url.searchParams.get("mcuid")
+                  location.replace("/one-ui/" +url_preregister +"?mcuid="+mcuid)
+
+               }else{
+                  context.commit('update_dialog_start', false)
+                  context.commit('update_show_time', resp.data.data.records)
+                  context.commit('update_status_start', 'Y')
+                  if (prm.pre_id) {
+                     context.dispatch("load_preregister", { id: context.state.order_id })
+                  }
+               }
+               
+            }
+         } catch (e) {
+
+         }
+
+      },
+      async getbarcode(context, prm) {
+         context.commit("update_get_data_status", 1)
+         try {
+            prm.token = one_token();
+            console.log(prm);
+            let resp = await api.lookupbarcodes(prm)
+            if (resp.status != "OK") {
+               //   context.commit("update_get_data_status", 3)
+               var snackbar = context.state.snackbar
+               snackbar.color = 'red'
+               snackbar.value = true
+               snackbar.multi_line = 'single-line'
+               snackbar.text = 'Gagal get barcode'
+               context.commit("update_snackbar", snackbar)
+            } else {
+               context.commit("update_get_data_status", 2)
+               let data = {
+                  records: resp.data.records,
+                  total: resp.data.total
+               }
+               let barcodes = resp.data.records
+               context.commit("update_patientBarcode", data.records)
+               let arrprm = [];
+               let arrprmst = [];
+               for (let index = 0; index < barcodes.length; index++) {
+                  const e = barcodes[index];
+                  arrprm.push(e.T_BarcodeLabBarcode)
+                  if (e.type === 'nonlab') {
+                     arrprmst.push(e.T_SampleTypeID)
+                     console.log('print so')
+                     console.log("nolab so ganti group")
+                     console.log("param ganti")
+                     console.log("balik lagi")
+                     // one_print_barcode_so(e.T_SampleTypeID)
+                  }
+               }
+                 if (arrprm.length > 0) {
+                     //one_print_barcode_pk(arrprm.join(","));
+                     }
+                     
+               if (arrprmst.length > 0) {
+                  one_print_barcode_sov1(arrprmst.join(","));
+               }
+               // let inp = {};
+               // inp.id = prm.id;
+               // inp.no_lab = prm.no_lab;
+               // inp.name = prm.name;
+               // inp.register_date = prm.register_date;
+               // one_print_qrcode(inp);
+               // // console.log("Input prm")
+               // // console.log(inp)
+               // console.log("print barcode new")
+               // console.log(inp)
+               // one_print_qrcode_patient(inp);
+
+            }
+         } catch (e) {
+            console.log(e)
+            //  context.commit("update_get_data_status", 3)
+         }
+      }
+      
+   }
+}
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/modules/other.js b/test/vuex/one-fo-registration-walk-in-stemcell/modules/other.js
new file mode 100644
index 0000000..59b9407
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/modules/other.js
@@ -0,0 +1,209 @@
+// 1 => LOADING
+// 2 => DONE
+// 3 => ERROR
+import * as api from "../api/other.js"
+
+export default  {
+   namespaced: true,
+   state: {
+      search : '',
+      search_status: 0,
+      search_error_message: "",
+
+      sex: [],
+      total_sex: 0,
+      selected_sex: {},
+
+      title: [],
+      total_title: 0,
+      selected_title: {},
+
+      banks: [],
+      accounts: [],
+      cards: [],
+
+      religions: [],
+      total_religion: 0,
+      selected_religion: {},
+
+      mounted: 0
+   },
+   mutations: {
+      update_title(state, val) {
+         state.title=val 
+      },
+      update_search(state, val) {
+         state.search=val 
+      },
+      update_search_error_message(state,status) {
+         state.search_error_message = status
+      },
+      update_search_status(state,status) {
+         state.search_status = status
+      },
+      update_sex(state, data) {
+         state.sex = data.records
+         state.total_sex = data.total
+      },
+      update_selected_sex(state, doc) {
+         state.selected_sex = doc
+         if (doc.title) {
+            state.title = doc.title
+         } else {
+            state.title = []
+         }
+      },
+      update_selected_title(state, doc) {
+         state.selected_title = doc
+      },
+
+        update_banks(state, d) {
+            state.banks = d.records
+        },
+
+        update_cards(state, d) {
+            state.cards = d.records
+        },
+
+        update_accounts(state, d) {
+            state.accounts = d.records
+        },
+
+        update_religion(state, data) {
+           state.religions = data.records
+           state.total_religion = data.total
+        },
+
+        update_selected_religion(state, doc) {
+           state.selected_religion = doc
+        }
+   },
+   actions: {
+      
+        async search_sex(context) {
+            context.commit("update_search_status", 1)
+            try {
+                let resp= await api.search_sex(context.state.search)
+                if (resp.status != "OK") {
+                context.commit("update_search_status", 3)
+                context.commit("update_search_error_message",resp.message)
+                } else {
+                context.commit("update_search_status",2)
+                context.commit("update_search_error_message","")
+                let data = {
+                    total : resp.data.total,
+                    records : resp.data.records
+                }
+                context.commit("update_sex", data)
+                }
+            } catch(e) {
+                context.commit("update_search_status",3)
+                context.commit("update_search_error_message",e.message )
+            }
+        },
+
+        async search_religion(context) {
+            console.log('search_religion')
+            context.commit("update_search_status", 1)
+            try {
+                let resp= await api.search_religion({token:window.one_token()})
+                if (resp.status != "OK") {
+                context.commit("update_search_status", 3)
+                context.commit("update_search_error_message", resp.message)
+                } else {
+                context.commit("update_search_status",2)
+                context.commit("update_search_error_message","")
+                let data = {
+                    total : resp.data.total,
+                    records : resp.data.records
+                }
+                context.commit("update_religion", data)
+                }
+            } catch(e) {
+                context.commit("update_search_status",3)
+                context.commit("update_search_error_message",e.message )
+            }
+        },
+
+        async search_bank(context) {
+            context.commit("update_search_status", 1)
+            try {
+            let resp= await api.search_bank(context.state.search, null, "Y")
+            if (resp.status != "OK") {
+                context.commit("update_search_status", 3)
+                context.commit("update_search_error_message",resp.message)
+            } else {
+                context.commit("update_search_status",2)
+                context.commit("update_search_error_message","")
+                let data = {
+                    records : resp.data.records
+                }
+                context.commit("update_banks", data)
+            }
+            } catch(e) {
+            context.commit("update_search_status",3)
+            context.commit("update_search_error_message",e.message )
+            }
+        },
+
+        async search_card(context) {
+            context.commit("update_search_status", 1)
+            try {
+            let resp= await api.search_bank(context.state.search, "Y")
+            if (resp.status != "OK") {
+                context.commit("update_search_status", 3)
+                context.commit("update_search_error_message",resp.message)
+            } else {
+                context.commit("update_search_status",2)
+                context.commit("update_search_error_message","")
+                let data = {
+                    records : resp.data.records
+                }
+                context.commit("update_cards", data)
+            }
+            } catch(e) {
+            context.commit("update_search_status",3)
+            context.commit("update_search_error_message",e.message )
+            }
+        },
+
+        async search_accounts(context) {
+            context.commit("update_search_status", 1)
+            try {
+            let resp= await api.search_accounts(context.state.search)
+            if (resp.status != "OK") {
+                context.commit("update_search_status", 3)
+                context.commit("update_search_error_message",resp.message)
+            } else {
+                context.commit("update_search_status",2)
+                context.commit("update_search_error_message","")
+                let data = {
+                    records : resp.data.records
+                }
+                context.commit("update_accounts", data)
+            }
+            } catch(e) {
+            context.commit("update_search_status",3)
+            context.commit("update_search_error_message",e.message )
+            }
+        },
+        async get_titles(context, prm) {
+            context.commit("update_search_status", 1)
+            try {
+                prm.token = window.one_token()
+            let resp= await api.get_titles(prm)
+            if (resp.status != "OK") {
+                context.commit("update_search_status", 3)
+                context.commit("update_search_error_message",resp.message)
+            } else {
+                context.commit("update_search_status",2)
+                context.commit("update_search_error_message","")
+                context.commit("update_title", resp.data.records)
+            }
+            } catch(e) {
+            context.commit("update_search_status",3)
+            context.commit("update_search_error_message",e.message )
+            }
+        }
+   }
+}
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/modules/patient.js b/test/vuex/one-fo-registration-walk-in-stemcell/modules/patient.js
new file mode 100644
index 0000000..5c065c6
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/modules/patient.js
@@ -0,0 +1,485 @@
+// 1 => LOADING
+// 2 => DONE
+// 3 => ERROR
+import * as api from "../api/patient.js"
+window.api = api
+
+export default  {
+   namespaced: true,
+   state: {
+      noreg:'',
+      search: '',
+      search_status:0,
+      search_error_message:'',
+      search_dialog_is_active: false,
+      patients: [],
+      total_patient: 0,
+      total_display: 0,
+      selected_patient: {},
+
+      patient_new: {},
+      patient_new_dialog_is_active: false,
+
+      idtypes: [{id:'NNIDN',name:'KTP'},{id:'PPN',name:'Passport'}],
+      selected_idtype: {id:'NNIDN',name:'KTP'},
+      current_page:1,
+      edit: false,
+      dialog_birthday:false,
+      show_more:true,
+      loading:false,
+      update_autocomplete_status:false,
+      regions:[],
+      selected_region:{},
+      countries:[],
+      selected_country:{},
+      search_country:'',
+      act:'',
+      selected_gender:{},
+      genders:[{id:'male',name:'Laki-laki'},{id:'female',name:'Perempuan'},{id:'other',name:'Lainnya'}],
+      corporates:[],
+      selected_corporate:{},
+      loading_corporate:false,
+      blood_types:[],
+      selected_blood_type:{},
+      loading_blood_type:false,
+      blood_rh_types:[],
+      selected_blood_rh_type:{},
+      loading_blood_rh_type:false,
+      education_types:[],
+      selected_education_type:{},
+      loading_education_type:false,
+      etnic_types:[],
+      selected_etnic_type:{},
+      loading_etnic_type:false,
+      icd10:[],
+      selected_icd10:{},
+      loading_icd10:false
+   },
+   mutations: {
+      update_loading_icd10(state,val) {
+         state.loading_icd10 = val
+      },
+      update_blood_types(state,val) {
+         state.blood_types = val
+      },
+      update_selected_blood_type(state,val) {
+         state.selected_blood_type = val
+      },
+      update_loading_blood_type(state,val) {
+         state.loading_blood_type = val
+      },
+      update_blood_rh_types(state,val) {
+         state.blood_rh_types = val
+      },
+      update_selected_blood_rh_type(state,val) {
+         state.selected_blood_rh_type = val
+      },
+      update_loading_blood_rh_type(state,val) {
+         state.loading_blood_rh_type = val
+      },
+      update_education_types(state,val) {
+         state.education_types = val
+      },
+      update_selected_education_type(state,val) {
+         state.selected_education_type = val
+      },
+      update_loading_education_type(state,val) {
+         state.loading_education_type = val
+      },
+      update_etnic_types(state,val) {
+         state.etnic_types = val
+      },
+      update_selected_etnic_type(state,val) {
+         state.selected_etnic_type = val
+      },
+      update_loading_etnic_type(state,val) {
+         state.loading_etnic_type = val
+      },
+      update_loading_corporate(state,val) {
+         state.loading_corporate = val
+      },
+      update_corporates(state,val) {
+         state.corporates = val
+      },
+      update_selected_corporate(state,val) {
+         state.selected_corporate = val
+      },
+      update_genders(state,val) {
+         state.genders = val
+      },
+      update_selected_gender(state,val) {
+         state.selected_gender = val
+      },
+      update_act(state,val) { 
+         state.act = val
+      },
+      update_search_country(state,val) {
+         state.search_country = val
+      },
+      update_countries(state,val) {
+         state.countries = val
+      },
+      update_selected_country(state,val) {
+         state.selected_country = val
+      },
+      update_regions(state,val) {
+         state.regions = val
+      },
+      update_selected_region(state,val) {
+         state.selected_region = val
+      },
+      update_autocomplete_status(state,val) {
+         state.update_autocomplete_status = val
+      },
+      update_icd10(state,val) {
+         state.icd10 = val
+      },
+      update_selected_icd10(state,val) {
+         state.selected_icd10 = val
+      },
+      update_loading(state,status) {
+         state.loading = status
+      },
+      update_show_more(state,status) {
+         state.show_more = status
+      },
+      update_current_page(state,status) {
+         state.current_page = status
+      },
+      update_dialog_birthday(state,status) {
+         state.dialog_birthday = status
+      },
+      update_search_dialog_is_active(state,status) {
+         state.search_dialog_is_active = status
+      },
+      update_search_error_message(state,status) {
+         state.search_error_message = status
+      },
+      update_noreg(state,val) {
+         state.noreg=val 
+      },
+      update_search(state,val) {
+         state.search=val 
+      },
+      update_search_status(state,status) {
+         state.search_status = status
+      },
+      update_patients(state,data) {
+         state.patients= data.records
+         state.total_patient = data.total
+         //state.total_display = data.total_display
+      },
+      update_selected_patient(state,val) {
+         var now = moment(new Date())
+         var dob = moment(new Date(val.M_PatientDOB))
+         var year = now.diff(dob,'years')
+         dob.add(year,'years')
+         var month = now.diff(dob,'months')
+         dob.add(month,'months')
+         var day = now.diff(dob,'days')
+         if (isNaN(year)) val.patient_age = ''
+         else val.patient_age = `${year} tahun ${month} bulan ${day} hari`
+
+         state.selected_patient=val 
+         // store.state.patientaddress.patient_id = val.M_PatientID
+
+         // photo
+         
+      },
+
+      update_patient_new(state, v) {
+         state.patient_new = v
+      },
+
+      update_patient_new_dialog_is_active(state, v) {
+         state.patient_new_dialog_is_active = v
+      },
+
+      update_idtypes(state, v) {
+         state.idtypes = v.records
+      },
+
+      update_selected_idtype(state, v) {
+         state.selected_idtype = v
+      },
+
+        update_edit(state, v) {
+            state.edit = v
+        }
+   },
+   actions: {
+      async search(context, prm) {
+         context.commit("update_search_status",1)
+         try {
+            //context.commit("update_loading",true)
+            let resp= await api.search(context.state.noreg,context.state.search,context.state.current_page)
+            if (resp.status != "OK") {
+               context.commit("update_search_status",3)
+               context.commit("update_search_error_message",resp.message)
+            } else {
+               context.commit("update_search_status",2)
+               context.commit("update_search_error_message","")
+               let data = {
+                  records : resp.data.records,
+                  total: resp.data.total
+               }
+               context.commit("update_loading",false)
+               if (prm && prm.use)
+                  context.commit("update_patients",{records : [],total:0})
+               
+               if(data.records.length > 0){
+                  if(context.state.patients.length > 0){
+                     var data_before  = context.state.patients
+                     var idx_last = data_before.length - 1
+                     data_before[idx_last].divider = 'Y'
+                     data.records.forEach(function(entry) {
+                        data_before.push(entry)
+                     })
+                     context.commit("update_patients",{records : data_before,total:data_before.length})
+                  }
+                  else{
+                     context.commit("update_patients",data)
+                  }
+                  
+                  context.commit("update_show_more",true)
+               }
+               else{
+                  context.commit("update_show_more",false)
+                  context.commit("update_current_page",1)
+               }
+               
+               if (prm)
+                  if (prm.use) {
+                     let pat = context.state.patients[prm.use_idx]
+                     console.log(pat)
+                     context.commit('update_selected_patient', pat)
+                     if(pat.info.birthday == 'Y')
+                        context.commit('update_dialog_birthday', true)
+
+                     context.commit('order/update_patient_note', pat.M_PatientNote, {root:true})
+                     context.dispatch('delivery/search_deliveries',{type:'patient',id:pat.M_PatientID},{root:true})
+
+                     context.commit('photo/update_patient_id', pat.M_PatientID, {root: true})
+                  }
+            }
+         } catch(e) {
+            context.commit("update_loading",false)
+            context.commit("update_search_status",3)
+            context.commit("update_search_error_message",e.message )
+         }
+      },
+
+      async add_new(context, prm) {
+         context.commit("update_search_status",1)
+         try {
+
+            let resp
+            if (context.state.edit){
+               resp = await api.edit(prm, context.state.selected_patient.M_PatientID)
+               
+            }
+            else
+                resp = await api.add_new(prm)
+                
+            if (resp.status != "OK") {
+               context.commit("update_search_status",3)
+               context.commit("update_search_error_message", resp.message)
+            } else {
+               context.commit("update_search_status",2)
+               context.commit("update_search_error_message","")
+               
+               if (prm.use) {
+                  context.commit('update_noreg', resp.data.noreg)
+                  context.commit('update_search', '')
+
+                  context.dispatch('search', {use:true, use_idx:0})
+                  context.dispatch('delivery/search_deliveries',{type:'patient',id:resp.data.id},{root:true})
+
+               }
+               
+               // commit("patientaddress/test", "X", { root: true })
+            }
+         } catch(e) {
+            context.commit("update_search_status",3)
+            context.commit("update_search_error_message",e.message )
+         }
+      },
+
+      async search_idtype(context) {
+         context.commit("update_search_status",1)
+         try {
+            let resp= await api.search_idtype()
+            if (resp.status != "OK") {
+               context.commit("update_search_status",3)
+               context.commit("update_search_error_message",resp.message)
+            } else {
+               context.commit("update_search_status",2)
+               context.commit("update_search_error_message","")
+               
+               let data = {
+                  records : resp.data.records
+               }
+               
+               context.commit("update_idtypes", data)
+            }
+         } catch(e) {
+            context.commit("update_search_status",3)
+            context.commit("update_search_error_message",e.message )
+         }
+      },
+      async searchregion(context, prm) {
+         context.commit("update_loading",true)
+         try {
+            let resp= await api.searchregion(prm)
+            if (resp.status != "OK") {
+               context.commit("update_loading",false)
+               context.commit("update_search_error_message",resp.message)
+            } else {
+               context.commit("update_loading",false)
+               context.commit("update_search_error_message","")
+               context.commit("update_regions", resp.data.records)
+            }
+         } catch(e) {
+            context.commit("update_loading",false)
+            context.commit("update_search_error_message",e.message )
+         }
+      },
+      async search_countries(context, prm) {
+         context.commit("update_loading",true)
+         try {
+            let resp= await api.search_countries(prm)
+            if (resp.status != "OK") {
+               context.commit("update_loading",false)
+               context.commit("update_search_error_message",resp.message)
+            } else {
+               context.commit("update_loading",false)
+               context.commit("update_search_error_message","")
+               context.commit("update_countries", resp.data.records)
+            }
+         } catch(e) {
+            context.commit("update_loading",false)
+            context.commit("update_search_error_message",e.message )
+         }
+      },
+      async search_corporate(context, prm) {
+         context.commit("update_loading_corporate",true)
+         try {
+            let resp= await api.search_corporate(prm)
+            if (resp.status != "OK") {
+               context.commit("update_loading_corporate",false)
+               context.commit("update_search_error_message",resp.message)
+            } else {
+               context.commit("update_loading_corporate",false)
+               context.commit("update_search_error_message","")
+               context.commit("update_corporates", resp.data.records)
+            }
+         } catch(e) {
+            context.commit("update_loading_corporate",false)
+            context.commit("update_search_error_message",e.message )
+         }
+      },
+      async search_blood_type(context, prm) {
+         context.commit("update_loading_blood_type",true)
+         try {
+            let resp= await api.search_blood_type(prm)
+            if (resp.status != "OK") {
+               context.commit("update_loading_blood_type",false)
+               context.commit("update_search_error_message",resp.message)
+            } else {
+               context.commit("update_loading_blood_type",false)
+               context.commit("update_search_error_message","")
+               context.commit("update_blood_types", resp.data.records)
+            }
+         } catch(e) {
+            context.commit("update_loading_blood_type",false)
+            context.commit("update_search_error_message",e.message )
+         }
+      },
+      async search_education_type(context, prm) {
+         context.commit("update_loading_education_type",true)
+         try {
+            let resp= await api.search_education_type(prm)
+            if (resp.status != "OK") {
+               context.commit("update_loading_education_type",false)
+               context.commit("update_search_error_message",resp.message)
+            } else {
+               context.commit("update_loading_education_type",false)
+               context.commit("update_search_error_message","")
+               context.commit("update_education_types", resp.data.records)
+            }
+         } catch(e) {
+            context.commit("update_loading_education_type",false)
+            context.commit("update_search_error_message",e.message )
+         }
+      },
+      async search_blood_rh_type(context, prm) {
+         context.commit("update_loading_blood_type",true)
+         try {
+            let resp= await api.search_blood_rh_type(prm)
+            if (resp.status != "OK") {
+               context.commit("update_loading_blood_rh_type",false)
+               context.commit("update_search_error_message",resp.message)
+            } else {
+               context.commit("update_loading_blood_rh_type",false)
+               context.commit("update_search_error_message","")
+               context.commit("update_blood_rh_types", resp.data.records)
+            }
+         } catch(e) {
+            context.commit("update_loading_blood_rh_type",false)
+            context.commit("update_search_error_message",e.message )
+         }
+      },
+      async search_etnic_type(context, prm) {
+         context.commit("update_loading_etnic_type",true)
+         try {
+            let resp= await api.search_etnic_type(prm)
+            if (resp.status != "OK") {
+               context.commit("update_loading_etnic_type",false)
+               context.commit("update_search_error_message",resp.message)
+            } else {
+               context.commit("update_loading_etnic_type",false)
+               context.commit("update_search_error_message","")
+               context.commit("update_etnic_types", resp.data.records)
+            }
+         } catch(e) {
+            context.commit("update_loading_etnic_type",false)
+            context.commit("update_search_error_message",e.message )
+         }
+      },
+      async search_etnic_type(context, prm) {
+         context.commit("update_loading_etnic_type",true)
+         try {
+            let resp= await api.search_etnic_type(prm)
+            if (resp.status != "OK") {
+               context.commit("update_loading_etnic_type",false)
+               context.commit("update_search_error_message",resp.message)
+            } else {
+               context.commit("update_loading_etnic_type",false)
+               context.commit("update_search_error_message","")
+               context.commit("update_etnic_types", resp.data.records)
+            }
+         } catch(e) {
+            context.commit("update_loading_etnic_type",false)
+            context.commit("update_search_error_message",e.message )
+         }
+      },
+      async search_icd10(context, prm) {
+         context.commit("update_loading_icd10",true)
+         try {
+            prm.token = window.one_token()
+            let resp= await api.search_icd10(prm)
+            if (resp.status != "OK") {
+               context.commit("update_loading_icd10",false)
+               context.commit("update_search_error_message",resp.message)
+            } else {
+               context.commit("update_loading_icd10",false)
+               context.commit("update_search_error_message","")
+               context.commit("update_icd10", resp.data.records)
+            }
+         } catch(e) {
+            context.commit("update_loading_icd10",false)
+            context.commit("update_search_error_message",e.message )
+         }
+      },
+   }
+}
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/modules/patientaddress.js b/test/vuex/one-fo-registration-walk-in-stemcell/modules/patientaddress.js
new file mode 100644
index 0000000..c068e43
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/modules/patientaddress.js
@@ -0,0 +1,86 @@
+// 1 => LOADING
+// 2 => DONE
+// 3 => ERROR
+import * as api from "../api/patientaddress.js"
+window.api = api
+
+export default  {
+   namespaced: true,
+   state: {
+      noreg:'',
+      search: '',
+      search_status:0,
+      search_error_message:'',
+      search_dialog_is_active: false,
+      patients: [],
+      total_patient: 0,
+      total_display: 0,
+      selected_patient: {},
+
+      address: [],
+      patient_id: 0
+   },
+   mutations: {
+      update_search_dialog_is_active(state,status) {
+         state.search_dialog_is_active = status
+      },
+      update_search_error_message(state,status) {
+         state.search_error_message = status
+      },
+      update_noreg(state,val) {
+         state.noreg=val 
+      },
+      update_search(state,val) {
+         state.search=val 
+      },
+      update_search_status(state,status) {
+         state.search_status = status
+      },
+      update_patients(state,data) {
+         state.patients= data.records
+         state.total_patient = data.total
+         state.total_display = data.total_display
+      },
+      update_selected_patient(state,val) {
+         state.selected_patient=val 
+      },
+
+      update_address(state, val) {
+          state.address = val;
+      },
+
+      testx(state, val) {
+         state.patient_id = val
+      }
+   },
+   actions: {
+      async search(context,prm) {
+         context.commit("update_search_status",1)
+         try {
+            let resp= await api.getAll(context.state.patient_id)
+            if (resp.status != "OK") {
+               context.commit("update_search_status",3)
+               context.commit("update_search_error_message",resp.message)
+            } else {
+               context.commit("update_search_status",2)
+               context.commit("update_search_error_message","")
+               let data = resp.data;
+               context.commit("update_address",data)
+            }
+         } catch(e) {
+            context.commit("update_search_status",3)
+            context.commit("update_search_error_message",e.message )
+         }
+      },
+
+      async loadAddress(context, prm) {
+
+      }
+   },
+
+   methods: {
+      tests (a) {
+         alert(a)
+      }
+   }
+}
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/modules/payment.js b/test/vuex/one-fo-registration-walk-in-stemcell/modules/payment.js
new file mode 100644
index 0000000..077336c
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/modules/payment.js
@@ -0,0 +1,339 @@
+// 1 => LOADING
+// 2 => DONE
+// 3 => ERROR
+import * as api from "../api/payment.js"
+
+export default  {
+   namespaced: true,
+   state: {
+       order_id: 0,
+
+       selected_patient: {
+           order_no: '-',
+           order_date: '-',
+           order_mou: '-',
+           order_company: '-',
+           patient_name: '-',
+           patient_mr: '-',
+           doctor_sender: '-',
+           doctor_sender_address: '-',
+           doctor_pj: '-'
+       },
+
+       order_detail: [
+      //   { n:1, d_id:1, t_id:1, t_name:'SGOT', t_price:80000, t_disctotal:7000, t_total:73000 },
+      //   { n:2, d_id:2, t_id:2, t_name:'SGPT', t_price:75000, t_disctotal:8000, t_total:67000 }
+        ],
+        order_delivery: [],
+
+        order_subtotal: 0,
+        order_rounding: 0,
+        order_total: 0,
+        order_company: {
+         is_bill: "N",
+         min_dp: 0,
+         min_dp_rp: 0,
+         on_hold: "N",
+         on_hold_text: ""
+        },
+
+        payment_cash_amount: 0,
+        payment_debit_amount: 0,
+        payment_credit_amount: 0,
+
+        payments: [],
+        payment_total: 0,
+
+        payment_id: 0,
+        payment_number: '',
+        finish_dialog_is_active: false,
+
+        paid: false,
+        savepayment:false,
+        promises:[]
+   },
+   mutations: {
+      update_promises(state, data) {
+        state.promises = data
+      },
+      update_order (state, data) {
+        state.selected_patient = data.order_header
+        context.state.order_subtotal = resp.data.order_header.order_subtotal;
+        context.state.order_rounding = resp.data.order_header.order_rounding;
+        context.state.order_total = resp.data.order_header.order_total;
+        context.state.order_company = {
+         is_bill: resp.data.order_header.M_CompanyIsBill,
+         min_dp: resp.data.order_header.M_CompanyMinDP,
+         min_dp_rp: Math.round(resp.data.order_header.M_CompanyMinDP * resp.data.order_header.order_total / 100),
+         on_hold: resp.data.order_header.M_CompanyIsAgingOnHold,
+         on_hold_text: resp.data.order_header.M_CompanyIsAgingOnHoldNote
+        }
+        
+      },
+
+      update_order_id (state, id) {
+          state.order_id = id
+      },
+      update_savepayment (state, id) {
+         state.savepayment = id
+     },
+
+      update_payment(state, o) {
+         if (o.type == 'cash')
+            state.payment_cash_amount = o.amount
+         if (o.type == 'debit')
+            state.payment_debit_amount = o.amount
+         if (o.type == 'credit')
+            state.payment_credit_amount = o.amount
+      },
+
+      update_payments(state, o) {
+         state.payments = o
+
+         // Total payments
+         let total = 0
+         for (let i in o) {
+            o[i].payment_actual = Math.round(o[i].payment_actual)
+            total += o[i].payment_actual
+         }
+
+         state.payment_total = total
+
+         // Calculate change
+         for (let i in o) {
+            o[i].payment_amount = o[i].payment_actual
+
+            if (o[i].payment_type_code == 'CASH') {
+               o[i].payment_change = 0
+               let chg = total - state.order_total;
+               
+               if (chg > o[i].payment_actual)
+                  chg = o[i].payment_actual
+               if (chg < 0)
+                  chg = 0
+               
+               o[i].payment_change = chg
+
+               // re-calculate payment amount
+               o[i].payment_amount = o[i].payment_actual - o[i].payment_change
+               state.payment_total -= chg
+            }
+         }
+
+         state.payments = o
+      },
+
+      reset_payment(state) {
+         state.payment_total = 0
+      },
+      
+      update_finish_dialog_is_active(state, val) {
+         state.finish_dialog_is_active = val
+      },
+
+      update_payment_number(state, val) {
+         state.payment_number = val
+      },
+
+      update_payment_id(state, val) {
+         state.payment_id = val
+      },
+
+      update_paid(state, val) {
+         state.paid = val
+      },
+
+      update_order_company(state, val) {
+         state.order_company = val
+      }
+   },
+   actions: {
+    async get_order(context, prm) {
+        // context.commit("update_search_status",1)
+        try {
+           let resp= await api.get_order(prm)
+           if (resp.status != "OK") {
+            //   context.commit("update_search_status",3)
+            //   context.commit("update_search_error_message",resp.message)
+           } else {
+            //   context.commit("update_search_status",2)
+            //   context.commit("update_search_error_message","")
+              let data = resp.data.data
+              context.commit("update_order", data)
+              
+              // commit("patientaddress/test", "X", { root: true })
+           }
+        } catch(e) {
+        //    context.commit("update_search_status",3)
+        //    context.commit("update_search_error_message",e.message )
+        }
+     },
+
+     async search(context, prm) {
+         // context.commit("update_search_status",1)
+         try {
+            let resp= await api.search(prm)
+            if (resp.status != "OK") {
+            //   context.commit("update_search_status",3)
+            //   context.commit("update_search_error_message",resp.message)
+            } else {
+            //   context.commit("update_search_status",2)
+            //   context.commit("update_search_error_message","")
+               let data = resp.data
+               context.commit("update_payments", data)
+               
+               // commit("patientaddress/test", "X", { root: true })
+            }
+         } catch(e) {
+         //    context.commit("update_search_status",3)
+         //    context.commit("update_search_error_message",e.message )
+         }
+      },
+
+      async save(context) {
+         context.state.savepayment = true
+         console.log('disabled payment')
+         console.log(context.state.savepayment)
+         var order_id = context.state.order_id;
+         let payments = []
+         let p = context.state.payments
+         for (let i in context.state.payments) {
+            if (Math.round(p[i].payment_amount) == 0)
+               continue;
+
+            payments.push({
+               type: p[i].payment_type_id,
+               amount: p[i].payment_amount,
+               actual: p[i].payment_actual,
+               changes: p[i].payment_change,
+               note: p[i].payment_note,
+               card: p[i].payment_card_id,
+               edc: p[i].payment_edc_id,
+               account: p[i].payment_account_id
+            })
+         }
+
+         // context.commit("update_search_status",1)
+         try {
+            let resp= await api.save(one_token(), order_id, payments)
+
+            if (resp.status != "200") {
+               // context.commit("update_search_status",3)
+               // context.commit("update_search_error_message",resp.message)
+               alert('error')
+               context.state.savepayment = false
+            } else {
+               context.state.savepayment = false
+               context.commit('update_payment_number', resp.data.data.payment_number)
+               context.commit('update_payment_id', resp.data.data.payment_id)
+               context.commit('update_finish_dialog_is_active', true)
+               context.commit('update_paid', true)
+            }
+         } catch(e) {
+            // context.commit("update_search_status",3)
+            // context.commit("update_search_error_message",e.message )
+         }
+      },
+
+        async print_nota (context, a) {
+            let usr = one_user()
+            console.log("yesy nota")
+         console.log(usr)
+            let ts = Date.now() / 1000 | 0
+            let x = context.rootState.company.selected_mou
+            let rpt_url = '/birt/run?__report=report/onelab/fo/rpt_t_003.rptdesign&PID='+a+'&username='+usr.M_StaffName+'&__format=pdf&ts='+ts
+            if (x.M_MouIsBill == 'Y')
+                rpt_url = '/birt/run?__report=report/onelab/fo/rpt_t_006.rptdesign&__format=pdf&username='+usr.M_StaffName+'&PID='+a+'&ts='+ts
+
+            context.commit('order/update_rpt_url', window.BASE_URL + rpt_url, {root:true})
+            context.commit('order/update_print_dialog_is_active', true, {root:true})
+        },
+
+        async print_notain (context, a) {
+         let usr = one_user()
+         console.log("yesy nota")
+      console.log(usr)
+         let ts = Date.now() / 1000 | 0
+         let x = context.rootState.company.selected_mou
+         let rpt_url = '/birt/run?__report=report/onelab/fo/rpt_t_003i.rptdesign&PID='+a+'&username='+usr.M_StaffName+'&__format=pdf&ts='+ts
+         if (x.M_MouIsBill == 'Y')
+             rpt_url = '/birt/run?__report=report/onelab/fo/rpt_t_006.rptdesign&__format=pdf&username='+usr.M_StaffName+'&PID='+a+'&ts='+ts
+
+         context.commit('order/update_rpt_url', window.BASE_URL + rpt_url, {root:true})
+         context.commit('order/update_print_dialog_is_active', true, {root:true})
+     },
+
+      async print_invoice (context, a) {
+         let usr = one_user()
+         console.log("yesy invoice")
+         console.log(usr)
+         context.commit('order/update_rpt_url', window.BASE_URL + '/birt/run?__report=report/onelab/fo/rpt_t_001.rptdesign&PID='+a+'&username='+usr.M_StaffName+'&__format=pdf', {root:true})
+         context.commit('order/update_print_dialog_is_active', true, {root:true})
+      },
+
+      async print_control_xx (context, a) {
+         let usr = one_user()
+         console.log("yesy control")
+         console.log(usr)
+         context.commit('order/update_rpt_url', window.BASE_URL + '/birt/run?__report=report/onelab/lab/rpt_fo_001.rptdesign&PID='+a+'&username='+usr.M_StaffName+'&__format=pdf', {root:true})
+         context.commit('order/update_print_dialog_is_active', true, {root:true})
+      },
+      async reset (context, prm) {
+         try {
+            //alert("acacadvadv")
+            prm.token = one_token()
+            let resp= await api.endshowtime(prm)
+            if (resp.data.status != "OK") {
+              console.log(resp.data.message)
+              //alert('stop')
+            } else {
+               var url_string = window.location.href
+               var url = new URL(url_string);
+               var pre_id = url.searchParams.get("pre_id")
+               var mcuid = url.searchParams.get("mcuid")
+               console.log(pre_id)
+               //alert('cdcadscsdvds')
+               let x_url = url
+               x_url.searchParams.delete("pre_id")
+               x_url.searchParams.delete("mcuid")
+               x_url.searchParams.delete("type")
+               if(prm.type == 'pay'){
+                  let url_cashier = context.rootState.order.current_order.url_menu_cashier+'?nolab='+context.rootState.order.current_order.noreg;
+                  location.replace('/one-ui/'+url_cashier)
+               }else{
+                location.reload()
+               }
+            }
+         } catch(e) {
+         
+         }
+         
+      },
+      async print_control (context, prm) {
+         let usr = one_user()
+         console.log("yesy control")
+         console.log(usr)
+         context.commit('order/update_rpt_url', window.BASE_URL + '/birt/run?__report=report/onelab/lab/rpt_fo_001.rptdesign&PID='+prm.order_id+'&username='+usr.M_StaffName+'&__format=pdf', {root:true})
+         context.commit('order/update_print_dialog_is_active', true, {root:true})
+         
+      },
+      async get_details_order(context, prm) {
+         try {
+            prm.token = one_token();
+            let resp = await api.get_details_order(prm);
+            if(resp.status == 'OK'){
+               context.state.order_detail = resp.data.order_detail;
+               context.state.order_delivery = resp.data.order_delivery;
+               context.state.promises = resp.data.order_promise;
+            }
+            else{
+               context.commit("update_message_error", resp.message);
+               context.commit("update_dialog_pop_up_error", true);
+            }
+         } catch (e) {
+            console.log(e)
+         }
+      }
+
+   }
+}
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/modules/payment.js-- b/test/vuex/one-fo-registration-walk-in-stemcell/modules/payment.js--
new file mode 100644
index 0000000..e89ba14
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/modules/payment.js--
@@ -0,0 +1,304 @@
+// 1 => LOADING
+// 2 => DONE
+// 3 => ERROR
+import * as api from "../api/payment.js"
+
+export default  {
+   namespaced: true,
+   state: {
+       order_id: 0,
+
+       selected_patient: {
+           order_no: '-',
+           order_date: '-',
+           order_mou: '-',
+           order_company: '-',
+           patient_name: '-',
+           patient_mr: '-',
+           doctor_sender: '-',
+           doctor_sender_address: '-',
+           doctor_pj: '-'
+       },
+
+       order_detail: [
+      //   { n:1, d_id:1, t_id:1, t_name:'SGOT', t_price:80000, t_disctotal:7000, t_total:73000 },
+      //   { n:2, d_id:2, t_id:2, t_name:'SGPT', t_price:75000, t_disctotal:8000, t_total:67000 }
+        ],
+        order_delivery: [],
+
+        order_subtotal: 0,
+        order_rounding: 0,
+        order_total: 0,
+        order_company: {
+         is_bill: "N",
+         min_dp: 0,
+         min_dp_rp: 0,
+         on_hold: "N",
+         on_hold_text: ""
+        },
+
+        payment_cash_amount: 0,
+        payment_debit_amount: 0,
+        payment_credit_amount: 0,
+
+        payments: [],
+        payment_total: 0,
+
+        payment_id: 0,
+        payment_number: '',
+        finish_dialog_is_active: false,
+
+        paid: false,
+        savepayment:false
+   },
+   mutations: {
+      update_order (state, data) {
+        state.selected_patient = data.order_header
+        state.order_detail = data.order_detail
+        state.order_delivery = data.order_delivery
+
+        state.order_subtotal = data.order_header.order_subtotal
+        state.order_rounding = data.order_header.order_rounding
+        state.order_total = data.order_header.order_total
+
+        state.order_company = {
+         is_bill: data.order_header.M_CompanyIsBill,
+         min_dp: data.order_header.M_CompanyMinDP,
+         min_dp_rp: Math.round(data.order_header.M_CompanyMinDP * data.order_header.order_total / 100),
+         on_hold: data.order_header.M_CompanyIsAgingOnHold,
+         on_hold_text: data.order_header.M_CompanyIsAgingOnHoldNote
+        }
+      },
+
+      update_order_id (state, id) {
+          state.order_id = id
+      },
+      update_savepayment (state, id) {
+         state.savepayment = id
+     },
+
+      update_payment(state, o) {
+         if (o.type == 'cash')
+            state.payment_cash_amount = o.amount
+         if (o.type == 'debit')
+            state.payment_debit_amount = o.amount
+         if (o.type == 'credit')
+            state.payment_credit_amount = o.amount
+      },
+
+      update_payments(state, o) {
+         state.payments = o
+
+         // Total payments
+         let total = 0
+         for (let i in o) {
+            o[i].payment_actual = Math.round(o[i].payment_actual)
+            total += o[i].payment_actual
+         }
+
+         state.payment_total = total
+
+         // Calculate change
+         for (let i in o) {
+            o[i].payment_amount = o[i].payment_actual
+
+            if (o[i].payment_type_code == 'CASH') {
+               o[i].payment_change = 0
+               let chg = total - state.order_total;
+               
+               if (chg > o[i].payment_actual)
+                  chg = o[i].payment_actual
+               if (chg < 0)
+                  chg = 0
+               
+               o[i].payment_change = chg
+
+               // re-calculate payment amount
+               o[i].payment_amount = o[i].payment_actual - o[i].payment_change
+               state.payment_total -= chg
+            }
+         }
+
+         state.payments = o
+      },
+
+      reset_payment(state) {
+         state.payment_total = 0
+      },
+      
+      update_finish_dialog_is_active(state, val) {
+         state.finish_dialog_is_active = val
+      },
+
+      update_payment_number(state, val) {
+         state.payment_number = val
+      },
+
+      update_payment_id(state, val) {
+         state.payment_id = val
+      },
+
+      update_paid(state, val) {
+         state.paid = val
+      },
+
+      update_order_company(state, val) {
+         state.order_company = val
+      }
+   },
+   actions: {
+    async get_order(context, prm) {
+        // context.commit("update_search_status",1)
+        try {
+           let resp= await api.get_order(prm)
+           if (resp.status != "OK") {
+            //   context.commit("update_search_status",3)
+            //   context.commit("update_search_error_message",resp.message)
+           } else {
+            //   context.commit("update_search_status",2)
+            //   context.commit("update_search_error_message","")
+              let data = resp.data.data
+              context.commit("update_order", data)
+              
+              // commit("patientaddress/test", "X", { root: true })
+           }
+        } catch(e) {
+        //    context.commit("update_search_status",3)
+        //    context.commit("update_search_error_message",e.message )
+        }
+     },
+
+     async search(context, prm) {
+         // context.commit("update_search_status",1)
+         try {
+            let resp= await api.search(prm)
+            if (resp.status != "OK") {
+            //   context.commit("update_search_status",3)
+            //   context.commit("update_search_error_message",resp.message)
+            } else {
+            //   context.commit("update_search_status",2)
+            //   context.commit("update_search_error_message","")
+               let data = resp.data
+               context.commit("update_payments", data)
+               
+               // commit("patientaddress/test", "X", { root: true })
+            }
+         } catch(e) {
+         //    context.commit("update_search_status",3)
+         //    context.commit("update_search_error_message",e.message )
+         }
+      },
+
+      async save(context) {
+         context.state.savepayment = true
+         console.log('disabled payment')
+         console.log(context.state.savepayment)
+         var order_id = context.state.order_id;
+         let payments = []
+         let p = context.state.payments
+         for (let i in context.state.payments) {
+            if (Math.round(p[i].payment_amount) == 0)
+               continue;
+
+            payments.push({
+               type: p[i].payment_type_id,
+               amount: p[i].payment_amount,
+               actual: p[i].payment_actual,
+               changes: p[i].payment_change,
+               note: p[i].payment_note,
+               card: p[i].payment_card_id,
+               edc: p[i].payment_edc_id,
+               account: p[i].payment_account_id
+            })
+         }
+
+         // context.commit("update_search_status",1)
+         try {
+            let resp= await api.save(one_token(), order_id, payments)
+
+            if (resp.status != "200") {
+               // context.commit("update_search_status",3)
+               // context.commit("update_search_error_message",resp.message)
+               alert('error')
+               context.state.savepayment = false
+            } else {
+               context.state.savepayment = false
+               context.commit('update_payment_number', resp.data.data.payment_number)
+               context.commit('update_payment_id', resp.data.data.payment_id)
+               context.commit('update_finish_dialog_is_active', true)
+               context.commit('update_paid', true)
+            }
+         } catch(e) {
+            // context.commit("update_search_status",3)
+            // context.commit("update_search_error_message",e.message )
+         }
+      },
+
+        async print_nota (context, a) {
+            let usr = one_user()
+            console.log("yesy nota")
+         console.log(usr)
+            let ts = Date.now() / 1000 | 0
+            let x = context.rootState.company.selected_mou
+            let rpt_url = '/birt/run?__report=report/onelab/fo/rpt_t_003.rptdesign&PID='+a+'&username='+usr.M_UserUsername+'&__format=pdf&ts='+ts
+            if (x.M_MouIsBill == 'Y')
+                rpt_url = '/birt/run?__report=report/onelab/fo/rpt_t_006.rptdesign&__format=pdf&username='+usr.M_UserUsername+'&PID='+a+'&ts='+ts
+
+            context.commit('order/update_rpt_url', window.BASE_URL + rpt_url, {root:true})
+            context.commit('order/update_print_dialog_is_active', true, {root:true})
+        },
+
+        async print_notain (context, a) {
+         let usr = one_user()
+         console.log("yesy nota")
+      console.log(usr)
+         let ts = Date.now() / 1000 | 0
+         let x = context.rootState.company.selected_mou
+         let rpt_url = '/birt/run?__report=report/onelab/fo/rpt_t_003i.rptdesign&PID='+a+'&username='+usr.M_UserUsername+'&__format=pdf&ts='+ts
+         if (x.M_MouIsBill == 'Y')
+             rpt_url = '/birt/run?__report=report/onelab/fo/rpt_t_006.rptdesign&__format=pdf&username='+usr.M_UserUsername+'&PID='+a+'&ts='+ts
+
+         context.commit('order/update_rpt_url', window.BASE_URL + rpt_url, {root:true})
+         context.commit('order/update_print_dialog_is_active', true, {root:true})
+     },
+
+      async print_invoice (context, a) {
+         let usr = one_user()
+         console.log("yesy invoice")
+         console.log(usr)
+         context.commit('order/update_rpt_url', window.BASE_URL + '/birt/run?__report=report/onelab/fo/rpt_t_001.rptdesign&PID='+a+'&username='+usr.M_UserUsername+'&__format=pdf', {root:true})
+         context.commit('order/update_print_dialog_is_active', true, {root:true})
+      },
+
+      async print_control_xx (context, a) {
+         let usr = one_user()
+         console.log("yesy control")
+         console.log(usr)
+         context.commit('order/update_rpt_url', window.BASE_URL + '/birt/run?__report=report/onelab/lab/rpt_fo_001.rptdesign&PID='+a+'&username='+usr.M_UserUsername+'&__format=pdf', {root:true})
+         context.commit('order/update_print_dialog_is_active', true, {root:true})
+      },
+      async reset (context, prm) {
+         try {
+            prm.token = one_token()
+            let resp= await api.endshowtime(prm)
+            if (resp.data.status != "OK") {
+              
+            } else {
+               location.reload()
+            }
+         } catch(e) {
+         
+         }
+         
+      },
+      async print_control (context, prm) {
+         let usr = one_user()
+         console.log("yesy control")
+         console.log(usr)
+         context.commit('order/update_rpt_url', window.BASE_URL + '/birt/run?__report=report/onelab/lab/rpt_fo_001.rptdesign&PID='+prm.order_id+'&username='+usr.M_UserUsername+'&__format=pdf', {root:true})
+         context.commit('order/update_print_dialog_is_active', true, {root:true})
+         
+      }
+
+   }
+}
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/modules/photo.js b/test/vuex/one-fo-registration-walk-in-stemcell/modules/photo.js
new file mode 100644
index 0000000..32212b2
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/modules/photo.js
@@ -0,0 +1,51 @@
+// 1 => LOADING
+// 2 => DONE
+// 3 => ERROR
+import * as api from "../api/photo.js"
+window.api = api
+
+export default  {
+   namespaced: true,
+   state: {
+      dialog_photo: false,
+      photo_64: '',
+      photo_url: '/one-ui/no-profile-male-img.gif',
+      default_photo_url: '/one-ui/no-profile-male-img.gif',
+      patient_id: 0
+   },
+   mutations: {
+      update_dialog_photo (state, v) {
+          state.dialog_photo = v
+      },
+
+      update_photo_64 (state, data) {
+          state.photo_64 = data
+      },
+
+      update_photo_url (state, data) {
+          state.photo_url = data
+      },
+
+      update_patient_id (state, id) {
+          state.patient_id = id
+      }
+   },
+   actions: {
+        async upload(context) {
+            
+            try {
+                console.log(context.rootState.patient.selected_patient)
+            let resp = await api.upload(one_token(), context.rootState.patient.selected_patient.M_PatientID, context.state.photo_64)
+            
+            if (resp.status != "OK") {
+                              
+            } else {
+                context.commit('update_photo_url', resp.data.photo_url);
+                context.commit('update_dialog_photo', false)
+            }
+            } catch(e) {
+                console.log(e)
+            }
+        }
+   }
+}
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/modules/px.js b/test/vuex/one-fo-registration-walk-in-stemcell/modules/px.js
new file mode 100644
index 0000000..2916802
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/modules/px.js
@@ -0,0 +1,794 @@
+// 1 => LOADING
+// 2 => DONE
+// 3 => ERROR
+import * as api from "../api/px.js"
+
+export default  {
+   namespaced: true,
+   state: {
+      search: '',
+      search_token: {},
+      search_status:0,
+      search_error_message:'',
+      tests: [],
+      total_test: 0,
+      selected_test: [],
+
+      search_panel: '',
+      search_panel_status:0,
+      panels: [],
+      total_panel: 0,
+      selected_panel: [],
+      requirement: [],
+      appx_schedule: '',
+
+      search_profile: '',
+      profiles: [],
+      total_profile: 0,
+
+      cito: {test:[], panel:[]},
+      nat_test: [],
+
+      req_status: "X",
+      reqs: [],
+
+      citos: [],
+      selected_cito: null,
+      is_cito: "N",
+      loading_promise: false,
+      promise_by_pxs: []
+   },
+   mutations: {
+      update_promise_by_pxs(state, val) {
+         state.promise_by_pxs = val
+      },
+      update_loading_promise(state, val) {
+         state.loading_promise = val
+      },
+      update_search_token(state, val) {
+         state.search_token = val
+      },
+      update_requirement(state,val) {
+         state.requirement = val
+      },
+      update_search_error_message(state,status) {
+         state.search_error_message = status
+      },
+      update_selected_test(state,val) {
+         // if (state.cito.length > 0) {
+            for (var i in val) {
+               val[i]['T_TestIsCito'] = 'N'
+               if (state.cito.test.indexOf(val[i]['T_TestID']) > -1)
+                  val[i]['T_TestIsCito'] = 'Y'
+            }
+         // }
+
+         state.selected_test = val
+      },
+      update_mouCompanyID(state,val) {
+         state.mouCompanyID=val 
+      },
+      update_search(state,val) {
+         state.search=val 
+      },
+      update_search_status(state,status) {
+         state.search_status = status
+      },
+      update_tests(state,data) {
+         state.tests= data.records
+         state.total_test= data.total
+      },
+      update_search_panel(state,val) {
+         state.search_panel=val 
+      },
+      update_search_panel_status(state,status) {
+         state.search_panel_status = status
+      },
+      update_panels(state,data) {
+         state.panels = data.records
+         state.total_panel = data.total
+      },
+      update_selected_panel(state,val) {
+         state.selected_panel= val
+      },
+
+      update_cito(state, val) {
+         let test = state.selected_test
+         let cito = state.cito
+         // if (val.length > 0) {
+            
+            for (var i in test) {
+               test[i]['T_TestIsCito'] = 'N'
+               if (val.v.indexOf(test[i]['T_TestID']) > -1)
+                  test[i]['T_TestIsCito'] = 'Y'
+            }
+            
+         // }
+
+         cito[val.t] = val.v
+         console.log(cito)
+         state.cito = cito
+         state.selected_test = test         
+      },
+
+      update_appx_schedule(state, v) {
+         state.appx_schedule = v
+      },
+
+      update_search_profile(state, v) {
+         state.search_profile = v
+      },
+
+      update_profiles(state, data) {
+         state.profiles = data.records
+         state.total_profile = data.total
+      },
+
+      update_nat_test(state) {
+         let px = state.selected_test
+         let nt = []
+         for (let i in px) {
+            for (let j in px[i].nat_test) {
+               nt.push(px[i].nat_test[j])
+            }
+         }
+
+         state.nat_test = nt
+      },
+
+      update_req_status(state, val) {
+         state.req_status = val
+      },
+
+      update_reqs(state, val) {
+         state.reqs = val
+      },
+
+        update_citos(state, val) {
+            state.citos = val.records
+        },
+
+        update_selected_cito(state, val) {
+            state.selected_cito = val
+        },
+
+        update_is_cito(state, val) {
+            state.is_cito = val
+        }
+   },
+   actions: {
+      async packet_reqs(context,prm) {
+         console.log(prm)
+         context.commit("update_search_panel_status",1)
+         try {
+            prm.token = one_token()
+            let resp= await api.packet_reqs(prm)
+            if (resp.status != "OK") {
+               context.commit("update_search_panel_status",3)
+               context.commit("update_search_error_message",resp.message)
+            } else {
+               context.commit("update_search_panel_status",2)
+               context.commit("update_search_error_message","")
+              
+               let req = resp.data
+               console.log(req)
+               let reqs = context.state.requirement
+               if (req.length > 0) {
+                  for(let i in req) {
+                     let found = false
+                     for(let j in reqs) {
+                        if (reqs[j]['req_id'] == req[i]['req_id'])
+                           found = j
+                     }
+
+                     if (!found){
+                        reqs.push({
+                           px_id: req[i]['tests'],
+                           label: req[i]['req_name'],
+                           error_message: 'Hasil harus di isi',
+                           is_error: true,
+                           checked : false,
+                           note: '',
+                           req_id: req[i]['req_id']
+                        })
+                     }
+                     else{
+                        if(req[i]['tests'].length > 0){
+                           req[i]['tests'].forEach(function(xtestid) {
+                              if(reqs[found].px_id.indexOf(xtestid) == -1)
+                                 reqs[found].px_id.push(xtestid)
+                           })
+                        }
+                     }
+                        
+                  }
+
+                  context.commit('update_requirement', reqs)
+                  console.log('selesai paket req')
+                  context.commit('order/update_loading_data_patient', true, { root: true })
+               }
+            }
+         } catch(e) {
+            context.commit("update_search_panel_status",3)
+            context.commit("update_search_error_message",e.message )
+         }
+      },
+      async get_requirement(context, test_id) {
+         try {
+            let resp = await api.get_requirement(test_id)
+            if (resp.status != "OK") {
+               return []
+            } else {
+               return resp.data || []
+            }
+         } catch(e) {
+            console.error('Error getting requirement:', e)
+            return []
+         }
+      },
+      delete_px (context, test) {
+         let sel = context.state.selected_test
+         sel.forEach(function(t, idx) {
+            if(t.T_TestID == test.T_TestID && t.px_type == test.px_type) {
+               sel.splice(idx,1)
+            }
+         })
+         context.commit("update_selected_test", sel)
+
+         let cito = context.state.cito.test
+         if(cito.length > 0){
+            let cito_idx = cito.indexOf(test.T_TestID)
+            if (cito_idx > -1)
+               cito.splice(cito_idx, 1)
+         }
+         
+         let tests = context.state.tests
+         if (tests == undefined ) tests = []
+         let idx_exist_test = _.findIndex(tests, function(o) { return o.T_TestID == test.T_TestID })
+         if(idx_exist_test > -1){
+            tests.splice(idx_exist_test, 1)
+         }
+         tests.push(test)
+         
+
+         //context.dispatch("search") 
+         let dt = {
+            records : tests,
+            total: tests.length
+         }
+
+         context.commit("update_tests", dt)
+         context.dispatch("delete_req", test)
+         // context.dispatch("update_req", null)
+         context.dispatch("appx_schedule")
+         context.commit('update_nat_test')
+      },
+
+      delete_req(context, px) {
+         let reqs = context.state.requirement
+         let selectedTests = context.state.selected_test
+         let testIdsToRemove = new Set() // Gunakan Set untuk lookup O(1)
+         
+         // Kumpulkan semua test ID yang perlu dihapus
+         if(px.px_type === 'PN' && px.child_test) {
+            // Untuk packet, hapus semua child test IDs
+            px.child_test.forEach(entry => testIdsToRemove.add(entry.T_TestID))
+         } else {
+            // Untuk test biasa, hapus test ID tersebut
+            testIdsToRemove.add(px.T_TestID)
+         }
+         
+         // Buat Set dari semua test IDs yang masih ada di selected_test (setelah dihapus)
+         let remainingTestIds = new Set()
+         selectedTests.forEach(test => {
+            if(!testIdsToRemove.has(test.T_TestID)) {
+               remainingTestIds.add(test.T_TestID)
+            }
+         })
+         
+         // Update requirement: hapus test IDs dari px_id array
+         let updatedReqs = reqs.map(req => {
+            // Hapus test IDs yang ada di testIdsToRemove dari array px_id
+            req.px_id = req.px_id.filter(testId => !testIdsToRemove.has(testId))
+            return req
+         }).filter(reqItem => {
+            // Hapus requirement hanya jika px_id array sudah kosong
+            // Tapi pastikan tidak ada test lain di selected_test yang masih menggunakan requirement dengan req_id yang sama
+            if(reqItem.px_id.length === 0) {
+               // Cek apakah masih ada test lain di selected_test yang memiliki requirement dengan req_id yang sama
+               // Kita perlu cek requirement dari setiap test yang masih ada
+               let stillInUse = false
+               for(let test of selectedTests) {
+                  if(!testIdsToRemove.has(test.T_TestID) && test.requirement) {
+                     // Cek apakah test ini memiliki requirement dengan req_id yang sama
+                     let hasSameReq = test.requirement.some(testReq => testReq.req_id == reqItem.req_id)
+                     if(hasSameReq) {
+                        stillInUse = true
+                        break
+                     }
+                  }
+               }
+               // Hapus requirement jika tidak ada lagi test yang menggunakannya
+               return stillInUse
+            }
+            return true // Keep requirement jika px_id masih ada
+         })
+         
+         context.commit('update_requirement', updatedReqs)
+      },
+
+      async search(context) {
+            if (!one_token()) {
+                context.commit("update_search_status", 3)
+                context.commit("update_search_error_message", 'No TOKEN Found')
+
+                context.commit('update_message_error', 'Maaf, koneksi Anda sempat terputus silahkan Log Out dan Login kembali', {root:true})
+                context.commit('update_dialog_error', true,  {root:true})
+                return
+            }
+
+         context.commit("update_search_status",1)
+         try {
+            let mouCompanyID = 0
+            console.log('context.rootState.company.selected_mou', context.rootState.company.selected_mou)
+            if (context.rootState.company.selected_mou.price_header_id) {
+               mouCompanyID = context.rootState.company.selected_mou.price_header_id
+            }
+            let search_token = context.state.search_token
+            if (search_token.hasOwnProperty("token")) {
+               console.log('CancelToken', search_token.token)
+               search_token.cancel()
+            }
+            search_token = axios.CancelToken.source()
+            context.commit("update_search_token",search_token)
+            console.log('CancelToken Start',search_token.token)
+
+            //clear the result 1st
+            let data = {
+               records : [],
+               total: 0
+            }
+            context.commit("update_tests",data)
+            console.log('selesai dari px.js')
+            let project_id = 0
+            if (
+               context.rootState.company.selected_project &&
+               context.rootState.company.selected_project.id
+            ) {
+               project_id = context.rootState.company.selected_project.id
+            }
+
+            let resp = await api.search(
+               mouCompanyID,
+               context.state.search,
+               search_token.token,
+               project_id
+            )
+            if (resp.status != "OK") {
+               context.commit("update_search_status",3)
+               context.commit("update_search_error_message",resp.message)
+            } else {
+               context.commit("update_search_status",2)
+               context.commit("update_search_error_message","")
+               let data = {
+                  records : resp.data.records,
+                  total: resp.data.total
+               } 
+               /////////////////////////////
+               var dadata = []
+               var xdata = resp.data.records
+               let selected_test = context.state.selected_test
+               xdata.forEach( function(t,idx) {
+                  if (t.px_type == "PR" ){
+                     var xchk = true
+                     t.child_test.forEach( function(natx){
+                        var idxx =_.findIndex(selected_test, function(o) { return o.T_TestID == natx.T_TestID })
+                        if(idxx !== -1){
+                           xchk = false
+                        }
+                     })
+                     if(xchk){
+                        dadata.push(t)
+                     }
+                  }
+                  else{
+                     var idxx =_.findIndex(selected_test, function(o) { return o.T_TestID == t.T_TestID })
+                     if(idxx === -1){
+                        dadata.push(t)
+                     }
+                  }
+                  
+               })
+               var newdata = {
+                  records : dadata,
+                  total: dadata.length
+               }
+               context.commit("update_tests",newdata)
+               
+               //////////////////////////////////////////////
+            }
+            
+         } catch(e) {
+            context.commit("update_search_status",3)
+            context.commit("update_search_error_message",e.message )
+            console.log(e)
+         }
+      },
+
+      async panel(context,prm) {
+         context.commit("update_search_panel_status",1)
+         try {
+            let mouCompanyID = 0
+            if (context.rootState.company.selected_mou.M_MouCompanyID) {
+               mouCompanyID = context.rootState.company.selected_mou.M_MouCompanyID
+            }
+            let resp= await api.panel(mouCompanyID,context.state.search)
+            if (resp.status != "OK") {
+               context.commit("update_search_panel_status",3)
+               context.commit("update_search_error_message",resp.message)
+            } else {
+               context.commit("update_search_panel_status",2)
+               context.commit("update_search_error_message","")
+               let data = {
+                  records : resp.data.records,
+                  total: resp.data.total
+               }
+               context.commit("update_panels",data)
+            }
+         } catch(e) {
+            context.commit("update_search_panel_status",3)
+            context.commit("update_search_error_message",e.message )
+         }
+      },
+      async get_promise_by_pxs(context, pxs) {
+         context.commit("update_loading_promise", true)
+         try {
+            let prm = {
+               pxs: pxs,
+               token: one_token()
+            }
+            let resp= await api.get_promise_by_pxs(prm)
+            if (resp.status != "OK") {
+               context.commit("update_loading_promise", false)
+               context.commit("update_search_error_message",resp.message)
+            } else {
+               context.commit("update_loading_promise", false)
+               context.commit("update_search_error_message","")
+               let data = {
+                  records : resp.data.records,
+                  total: resp.data.total
+               }
+               context.commit("update_promise_by_pxs",data)
+            }
+         } catch(e) {
+            context.commit("update_loading_promise", false)
+            context.commit("update_search_error_message",e.message )
+         }
+      },
+
+      async profile(context) {
+         context.commit("update_search_panel_status", 1)
+         try {
+            let mou_id = 0
+            if (context.rootState.company.selected_mou.M_MouID) {
+               mou_id = context.rootState.company.selected_mou.M_MouID
+            }
+
+            let resp = await api.profile(mou_id, context.state.search_profile)
+            if (resp.status != "OK") {
+               context.commit("update_search_panel_status",3)
+               context.commit("update_search_error_message",resp.message)
+            } else {
+               context.commit("update_search_panel_status",2)
+               context.commit("update_search_error_message","")
+               let data = {
+                  records : resp.data.records,
+                  total: resp.data.total
+               }
+               context.commit("update_profiles", data)
+            }
+         } catch(e) {
+            context.commit("update_search_panel_status",3)
+            context.commit("update_search_error_message",e.message )
+         }
+      },
+
+      async get_price(context, prm) {
+         context.commit("update_search_status",1)
+         try {
+            
+            //let mou_id = context.rootState.company.selected_mou.M_MouID
+            let resp = await api.get_price(prm.test_id, prm.mou_id, prm.cito)
+
+            if (resp.status != "OK") {
+               context.commit("update_search_status",3)
+               context.commit("update_search_error_message",resp.message)
+            } else {
+               context.commit("update_search_status",2)
+               context.commit("update_search_error_message","")
+               
+               let x = context.state.selected_test
+               console.log("kentut berot")
+               console.log(prm.cito)
+               for (let i in x) {
+                  if (x[i].T_TestID == prm.test_id) {
+                     if ((Math.round(resp.data.test_price) == 0 && x[i].T_TestForceSell != "Y") || 
+                        Math.round(resp.data.test_price) < 0 ) {
+                        alert('Pemeriksaan ini belum ada harga CITO-nya !')
+                        console.log(x[i].T_TestName)
+                        x[i].T_TestIsCito = "N"
+                        let n = context.state.cito.test.indexOf(x[i].T_TestID)
+                        if (n > -1)
+                           context.state.cito.test.splice(n, 1)
+                     }
+                     else {
+                        x[i].T_PriceAmount = resp.data.test_price
+                        x[i].T_PriceDisc = resp.data.test_disc
+                        x[i].T_PriceDiscRp = resp.data.test_discrp
+                     }
+                  }
+               }
+              // context.commit('update_message_error', 'satu...dua...tiga permen manis rasanya, coba cek agreement sepertinya sudah kadaluarsa', {root:true})
+                  //context.commit('update_dialog_error', true,  {root:true})
+
+               context.commit("update_selected_test", x)
+               context.commit("update_nat_test")
+            }
+         } catch(e) {
+            context.commit("update_search_status",3)
+            context.commit("update_search_error_message",e.message )
+            
+         }
+      },
+
+      async appx_schedule(context) {
+         context.commit("update_search_status",1)
+         try {
+            
+            let ids = []
+            let pn_ids = []
+            context.commit("update_appx_schedule", '-')
+
+            let pxs = context.state.selected_test
+            for (let i in pxs) {
+                if (pxs[i].px_type == 'PN')
+                    pn_ids.push(pxs[i].T_TestID)
+                else
+                    ids.push(pxs[i].T_TestID)
+            }
+               
+            let resp = await api.appx_schedule(ids.join(','), pn_ids.join(','))
+
+            if (resp.status != "OK") {
+               context.commit("update_search_status", 3)
+               context.commit("update_search_error_message",resp.message)
+            } else {
+               context.commit("update_search_status", 2)
+               context.commit("update_search_error_message","")
+               console.log('appx_schedule data response')
+               console.log(resp.data.records)
+               context.commit("update_appx_schedule", resp.data.records)
+            }
+         } catch(e) {
+            context.commit("update_search_status",3)
+            context.commit("update_search_error_message", e.message )
+            
+         }
+      },
+
+        async search_cito(context) {
+            context.commit("update_search_status",1)
+            try {
+                let resp= await api.search_cito(one_token())
+                if (resp.status != "OK") {
+                    context.commit("update_search_status",3)
+                    context.commit("update_search_error_message", resp.message)
+                } else {
+                    context.commit("update_search_status",2)
+                    context.commit("update_search_error_message","")
+                    let data = {
+                        records : resp.data.records
+                    }
+                    context.commit("update_citos", data)
+
+                    for (let i in data.records)
+                        if (data.records[i].Nat_CitoIsDefault == "Y")
+                            context.commit('update_selected_cito', data.records[i])
+                }
+            } catch(e) {
+                context.commit("update_search_status",3)
+                context.commit("update_search_error_message", e.message )
+            }
+        },
+
+        async search_pxs(context, id) {
+            context.commit("update_search_status",1)
+            // LOADING
+            context.commit('update_dialog_loading', true, {root:true})
+
+            try {
+               let mouCompanyID = 0
+               if (context.rootState.company.selected_mou.M_MouID) {
+                  mouCompanyID = context.rootState.company.selected_mou.M_MouID
+               }
+               let resp= await api.search_pxs(mouCompanyID, id)
+               if (resp.status != "OK") {
+                  context.commit("update_search_status",3)
+                  context.commit("update_search_error_message",resp.message)
+
+                  // LOADING
+                  context.commit('update_dialog_loading', false, {root:true})
+               } else {
+                  context.commit("update_search_status",2)
+                  context.commit("update_search_error_message","")
+                  
+                    let x = resp.data.records
+                    
+                    for (let k in x) {
+                        // SEARCH NAT TEST
+                        let px = x[k]
+                        let nt = context.state.nat_test
+                        let found_nt = false
+                        for (let i in px.nat_test) {
+                            if (nt.indexOf(px.nat_test[i]) > -1)
+                                found_nt = true
+                        }
+
+                        if (found_nt)
+                            continue
+
+                        let selected_test = context.state.selected_test
+                        let flag_found = false
+                        selected_test.forEach( function(t, idx) {
+                            if (t.T_TestID == px.T_TestID) {
+                                selected_test[idx] = px 
+                                flag_found = true
+                            }
+                        })
+
+                        if (!flag_found) {
+                            selected_test.push(px)
+                        }
+                        context.commit('update_selected_test', selected_test)
+
+                        let req = px.requirement
+                        let reqs = context.state.requirement
+                        if (req.length > 0) {
+                            for(let i in req) {
+                                let found = false
+                                for(let j in reqs) {
+                                    if (reqs[j]['req_id'] == req[i]['req_id'])
+                                        found = j
+                                }
+
+                                if (!found)
+                                    reqs.push({
+                                        px_id: [px.T_TestID],
+                                        label: req[i]['req_name'],
+                                        error_message: 'Hasil harus di isi',
+                                        is_error: true,
+                                        checked : false,
+                                        note: '',
+                                        req_id: req[i]['req_id']
+                                    })
+                                else
+                                    reqs[found].px_id.push(px.T_TestID)
+                            }
+
+                            context.commit('update_requirement', reqs)
+                        }
+
+                        
+                        context.commit('update_nat_test')
+                        // END LOADING
+                        
+                    }
+
+                    context.dispatch('appx_schedule')
+                    context.commit('update_dialog_loading', false, {root:true})
+                    context.commit('history/update_history_dialog', false, {root:true})
+                    context.commit('change_tab', '02', {root:true})
+               }
+            } catch(e) {
+               context.commit("update_search_status",3)
+               context.commit("update_search_error_message",e.message )
+               console.log(e)
+            }
+         },
+
+         async search_pxs_clinic(context, id) {
+             context.commit("update_search_status",1)
+             // LOADING
+             context.commit('update_dialog_loading', true, {root:true})
+ 
+             try {
+                let mouCompanyID = 0
+                if (context.rootState.company.selected_mou.M_MouID) {
+                   mouCompanyID = context.rootState.company.selected_mou.M_MouID
+                }
+                let resp= await api.search_pxs_clinic(mouCompanyID, id)
+                if (resp.status != "OK") {
+                   context.commit("update_search_status",3)
+                   context.commit("update_search_error_message",resp.message)
+ 
+                   // LOADING
+                   context.commit('update_dialog_loading', false, {root:true})
+                } else {
+                   context.commit("update_search_status",2)
+                   context.commit("update_search_error_message","")
+                   
+                     let x = resp.data.records
+                     
+                     for (let k in x) {
+                         // SEARCH NAT TEST
+                         let px = x[k]
+                         let nt = context.state.nat_test
+                         let found_nt = false
+                         for (let i in px.nat_test) {
+                             if (nt.indexOf(px.nat_test[i]) > -1)
+                                 found_nt = true
+                         }
+ 
+                         if (found_nt)
+                             continue
+ 
+                         let selected_test = context.state.selected_test
+                         let flag_found = false
+                         selected_test.forEach( function(t, idx) {
+                             if (t.T_TestID == px.T_TestID) {
+                                 selected_test[idx] = px 
+                                 flag_found = true
+                             }
+                         })
+ 
+                         if (!flag_found) {
+                             selected_test.push(px)
+                         }
+                         context.commit('update_selected_test', selected_test)
+ 
+                         let req = px.requirement
+                         let reqs = context.state.requirement
+                         if (req.length > 0) {
+                             for(let i in req) {
+                                 let found = false
+                                 for(let j in reqs) {
+                                     if (reqs[j]['req_id'] == req[i]['req_id'])
+                                         found = j
+                                 }
+ 
+                                 if (!found)
+                                     reqs.push({
+                                         px_id: [px.T_TestID],
+                                         label: req[i]['req_name'],
+                                         error_message: 'Hasil harus di isi',
+                                         is_error: true,
+                                         checked : false,
+                                         note: '',
+                                         req_id: req[i]['req_id']
+                                     })
+                                 else
+                                     reqs[found].px_id.push(px.T_TestID)
+                             }
+ 
+                             context.commit('update_requirement', reqs)
+                         }
+ 
+                         
+                         context.commit('update_nat_test')
+                         // END LOADING
+                         
+                     }
+ 
+                     context.dispatch('appx_schedule')
+                     context.commit('update_dialog_loading', false, {root:true})
+                     context.commit('history/update_history_dialog', false, {root:true})
+                     context.commit('change_tab', '02', {root:true})
+                }
+             } catch(e) {
+                context.commit("update_search_status",3)
+                context.commit("update_search_error_message",e.message )
+                console.log(e)
+             }
+          }
+   }
+}
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/modules/reference.js b/test/vuex/one-fo-registration-walk-in-stemcell/modules/reference.js
new file mode 100644
index 0000000..f719c12
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/modules/reference.js
@@ -0,0 +1,101 @@
+// 1 => LOADING
+// 2 => DONE
+// 3 => ERROR
+import * as api from "../api/reference.js";
+
+export default {
+  namespaced: true,
+  state: {
+    search_status: 0,
+    search_error_message: "",
+    references: [],
+    selected_reference: [],
+    ordertypes: [],
+    selected_ordertype: null
+  },
+
+  mutations: {
+    update_references(state, value) {
+      state.references = Array.isArray(value) ? value : [];
+    },
+
+    update_selected_reference(state, value) {
+      if (Array.isArray(value)) state.selected_reference = value;
+      else if (value && typeof value === "object") state.selected_reference = [value];
+      else state.selected_reference = [];
+    },
+
+    update_ordertypes(state, value) {
+      state.ordertypes = Array.isArray(value) ? value : [];
+    },
+
+    update_selected_ordertype(state, value) {
+      if (value && typeof value === "object") state.selected_ordertype = value;
+      else state.selected_ordertype = null;
+    },
+
+    update_search_error_message(state, msg) {
+      state.search_error_message = msg || "";
+    },
+
+    update_search_status(state, status) {
+      state.search_status = status;
+    }
+  },
+
+  actions: {
+    async searchreference({ commit }, search = "") {
+      commit("update_search_status", 1);
+      try {
+        const resp = await api.searchreference(search);
+
+        if (!resp || resp.status !== "OK") {
+          commit("update_search_status", 3);
+          commit("update_search_error_message", resp ? resp.message : "Unknown error");
+          commit("update_references", []);
+          return;
+        }
+
+        const records =
+          (resp.data && Array.isArray(resp.data.records) && resp.data.records) ||
+          (Array.isArray(resp.records) && resp.records) ||
+          [];
+
+        commit("update_references", records);
+        commit("update_search_status", 2);
+        commit("update_search_error_message", "");
+      } catch (e) {
+        commit("update_search_status", 3);
+        commit("update_search_error_message", e.message);
+        commit("update_references", []);
+      }
+    },
+
+    async searchordertype({ commit }, search = "") {
+      commit("update_search_status", 1);
+      try {
+        const resp = await api.searchordertype(search);
+
+        if (!resp || resp.status !== "OK") {
+          commit("update_search_status", 3);
+          commit("update_search_error_message", resp ? resp.message : "Unknown error");
+          commit("update_ordertypes", []);
+          return;
+        }
+
+        const records =
+          (resp.data && Array.isArray(resp.data.records) && resp.data.records) ||
+          (Array.isArray(resp.records) && resp.records) ||
+          [];
+
+        commit("update_ordertypes", records);
+        commit("update_search_status", 2);
+        commit("update_search_error_message", "");
+      } catch (e) {
+        commit("update_search_status", 3);
+        commit("update_search_error_message", e.message);
+        commit("update_ordertypes", []);
+      }
+    }
+  }
+};
\ No newline at end of file
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/mutation.js b/test/vuex/one-fo-registration-walk-in-stemcell/mutation.js
new file mode 100644
index 0000000..e69de29
diff --git a/test/vuex/one-fo-registration-walk-in-stemcell/store.js b/test/vuex/one-fo-registration-walk-in-stemcell/store.js
new file mode 100644
index 0000000..86a3710
--- /dev/null
+++ b/test/vuex/one-fo-registration-walk-in-stemcell/store.js
@@ -0,0 +1,68 @@
+// State
+//  data ...
+// Mutations
+//
+//
+// Actions
+import patient from "./modules/patient.js";
+import history from "./modules/history.js";
+import patientaddress from "./modules/patientaddress.js";
+import doctor from "./modules/doctor.js";
+import doctor_new from "./modules/doctor_new.js";
+import language from "./modules/language.js";
+import order from "./modules/order.js";
+import delivery from "./modules/delivery.js";
+import company from "./modules/company.js";
+import px from "./modules/px.js";
+import payment from "./modules/payment.js";
+import other from "./modules/other.js";
+import area from "./modules/area.js";
+import photo from "./modules/photo.js";
+import reference from "./modules/reference.js";
+import system from "../../../apps/modules/system/system.js";
+
+export const store = new Vuex.Store({
+  state : {
+    tab_active : '01',
+    dialog_loading : false,
+    dialog_error : false,
+    message_error: '-'
+  },
+
+  mutations : {
+    change_tab(state, tab) {
+      state.tab_active = tab;
+    },
+
+    update_dialog_loading(state, v) {
+        state.dialog_loading = v
+    },
+
+    update_dialog_error(state, v) {
+        state.dialog_error = v
+    },
+
+    update_message_error(state, v) {
+        state.message_error = v
+    }
+  },
+
+  modules : {
+     patient: patient,
+     history: history,
+     patientaddress: patientaddress,
+     doctor: doctor,
+     doctor_new: doctor_new,
+     language: language,
+     order: order,
+     delivery: delivery,
+     company: company,
+     px:px,
+     payment:payment,
+     other:other,
+     area:area,
+     photo:photo,
+     reference:reference,
+     system: system
+  }
+});