Flatten nested repos

test/vuex/cpone-sample-lab/api/comment.js

@@ -0,0 +1,37 @@
+const URL = "/one-api/mockup/samplinglab-v15/";
+export async function save(prm) {
+  try {
+    var resp = await axios.post(URL + "comment/save", 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(prm) {
+  try {
+    var resp = await axios.post(URL + "comment/load", 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,
+    };
+  }
+}

test/vuex/cpone-sample-lab/api/order_info.js

@@ -0,0 +1,20 @@
+const URL = "/one-api/mockup/samplinglab-cpone/";
+
+export async function search(prm) {
+  try {
+    var resp = await axios.post(URL + "order/info", 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,
+    };
+  }
+}

test/vuex/cpone-sample-lab/api/req.js

@@ -0,0 +1,19 @@
+const URL = "/one-api/mockup/samplinglab-cpone/";
+export async function req(prm) {
+  try {
+    var resp = await axios.post(URL + "req/info", 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,
+    };
+  }
+}

test/vuex/cpone-sample-lab/api/samplecall.js

@@ -0,0 +1,474 @@
+const URL = "/one-api/mockup/samplinglab-cpone/";
+
+export async function search(prm) {
+  try {
+    var resp = await axios.post(URL + "samplingcall/search", 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 saverequirement(prm) {
+  try {
+    var resp = await axios.post(URL + "samplingcall/saverequirement", 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 receivesample(prm) {
+  try {
+    var resp = await axios.post(URL + "samplingcall/receivesample", 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_staff(prm) {
+  try {
+    var resp = await axios.post(URL + "samplingcall/search_staff", 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 searchcompany(token, prm) {
+  try {
+    var resp = await axios.post(URL + "samplingcall/searchcompany", {
+      token: token,
+      search: 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_patient(prm) {
+  try {
+    var resp = await axios.post(URL + "samplingcall/search_patient", 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 getrequirements(prm) {
+  try {
+    var resp = await axios.post(URL + "samplingcall/getrequirements", 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 getstationstatus(token) {
+  try {
+    var resp = await axios.post(URL + "samplingcall/getstationstatus", {
+      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 save(prm) {
+  try {
+    var resp = await axios.post(URL + "samplingcall/save", 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 newsamplingcall(prm) {
+  try {
+    var resp = await axios.post(URL + "samplingcall/newsamplingcall", 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 xdelete(prm) {
+  try {
+    var resp = await axios.post(URL + "samplingcall/deletesamplingcall", 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 getaddress(prm) {
+  try {
+    var resp = await axios.post(URL + "samplingcall/getaddress", 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 searchcity(token, prm) {
+  try {
+    var resp = await axios.post(URL + "samplingcall/searchcity", {
+      token: token,
+      search: 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 getdistrict(token, prm) {
+  try {
+    var resp = await axios.post(URL + "samplingcall/getdistrict", {
+      id: prm.M_CityID,
+      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 getkelurahan(token, prm) {
+  try {
+    var resp = await axios.post(URL + "samplingcall/getkelurahan", {
+      token: token,
+      id: prm.M_DistrictID,
+    });
+    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 savenewaddress(prm) {
+  try {
+    var resp = await axios.post(URL + "samplingcall/savenewaddress", 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 saveeditaddress(prm) {
+  try {
+    var resp = await axios.post(URL + "samplingcall/saveeditaddress", 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 deleteaddress(prm) {
+  try {
+    var resp = await axios.post(URL + "samplingcall/deleteaddress", 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 getsampletypes(prm) {
+  try {
+    var resp = await axios.post(URL + "samplingcall/getsampletypes", 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 doaction(prm) {
+  try {
+    var resp = await axios.post(URL + "samplingcall/doaction", 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 addnewlabel(prm) {
+  try {
+    var resp = await axios.post(URL + "samplingcall/addnewlabel", 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 getdatanoterequirement(prm) {
+  try {
+    var resp = await axios.post(
+      URL + "samplingcall/getdatanoterequirement",
+      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 savenotesampling(prm) {
+  try {
+    var resp = await axios.post(URL + "samplingcall/savenotesampling", 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 getLocation(prm) {
+  try {
+    var resp = await axios.post(URL + "samplingcall/getlocation", 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,
+    };
+  }
+}

test/vuex/cpone-sample-lab/components/oneComment.vue

@@ -0,0 +1,138 @@
+<template>
+<v-dialog
+   v-model="show"
+   width="40%"
+   >
+   <v-card>
+       <v-card-title
+           class="headline white--text primary"
+           primary-title
+           v-html="patient_info"
+       >
+       </v-card-title>
+
+       <v-card-text>
+               <ul class="mb-2"> 
+                  <li>
+                  Order {{order_tgl}} by {{order_user}}
+                  <div v-if="fo_note != ''" class="mb-2 pa-2 " style="background:rgba(230, 255, 255)" > 
+                     {{fo_note}}
+                  </div>
+                  </li>
+                  <li>
+                  Screening {{ver_tgl}} by {{ver_user}}
+                  <div v-if="ver_note != ''" class="mb-2 pa-2 " style="background:rgba(230, 255, 255)" > 
+                     {{ver_note}}
+                  </div>
+                  </li>
+               </ul>
+               <v-layout row>
+                   <v-flex xs12>
+                       <v-textarea
+                           outline
+                           label="Catatan"
+                           v-model="comment"
+                       ></v-textarea>
+                   </v-flex>
+               </v-layout>
+               <v-layout mb-2 row>
+                   <v-flex xs12>
+		     <v-progress-linear :active="loading" :indeterminate="true">
+      		     </v-progress-linear>
+                  </v-flex>
+               </v-layout>
+       </v-card-text>
+
+       <v-divider></v-divider>
+
+       <v-card-actions>
+       <v-spacer></v-spacer>
+       <v-btn
+           color="grey"
+           dark
+           flat
+           text
+           @click="close_dialog"
+       >
+           Tutup
+       </v-btn>
+       <v-btn
+           color="primary"
+           dark
+           flat
+           text
+           @click="saveComment()"
+       >
+           Simpan
+       </v-btn>
+       </v-card-actions>
+   </v-card>
+</v-dialog>
+</template>
+
+<script>
+module.exports = {
+   methods: {
+      async saveComment() {
+         await this.$store.dispatch("comment/save")
+         this.$store.commit("comment/update_show",false)
+      },
+      close_dialog() {
+         this.$store.commit("comment/update_show",false)
+      }
+   },
+   computed: {
+      ver_user() {
+         let p = this.$store.state.comment.history
+         return  p.verStaffName
+      },
+      ver_tgl() {
+         let p = this.$store.state.comment.history
+         return  moment(p.verDate).format('DD.MM.YYYY HH:mm')
+      },
+      ver_note() {
+         let p = this.$store.state.comment.history
+         if ( p.verNote == null ) return ''
+         return  p.verNote
+      },
+      fo_note() {
+         let p = this.$store.state.comment.history
+         return  p.T_OrderHeaderFoNote
+      },
+      order_tgl() {
+         let p = this.$store.state.comment.history
+         return moment(p.T_OrderHeaderDate).format('DD.MM.YYYY HH:mm')
+      },
+      order_user() {
+         let p = this.$store.state.comment.history 
+         return p.foStaffName
+      },
+      patient_info() {
+         let patient = this.$store.state.comment.patient 
+         return patient.T_OrderHeaderLabNumber +
+            "<span style='color:yellow;margin-left:5px;margin-right:5px;padding:2px;'>[" + patient.T_OrderHeaderLabNumberExt + "]</span>" +
+            "&nbsp;&nbsp;&nbsp;" + patient.M_PatientName 
+      },
+      loading() {
+         return this.$store.state.comment.loading
+      },
+      show: {
+         get() { return this.$store.state.comment.show },
+         set(v) { this.$store.state.commit("comment/update_show",v)}
+      },
+      comment: {
+         get() { 
+            let note = this.$store.state.comment.patient.T_OrderHeaderSamplingNote 
+            if ( note == null ) return ''
+            return note
+            },
+         set(v) { 
+            let patient = this.$store.state.comment.patient 
+            patient.T_OrderHeaderSamplingNote = v 
+            this.$store.commit("comment/update_patient",patient)
+         }
+      }
+   },
+   
+}
+</script>

test/vuex/cpone-sample-lab/components/oneOrderInfo.vue

@@ -0,0 +1,76 @@
+<template>
+  <div v-show="show" class="orderbox">
+    <h3>
+      Daftar Pemeriksaan
+      <v-progress-circular
+        style="height: 20px"
+        v-show="loading"
+        :indeterminate="true"
+      >
+      </v-progress-circular>
+    </h3>
+
+    <div class="px" v-for="order in orders">
+      {{ order.name }}
+    </div>
+  </div>
+</template>
+
+<style scoped>
+.orderbox {
+  z-index: 0;
+  background-color: rgba(230, 255, 230, 0.9);
+  color: #004d00;
+  padding: 20px;
+  border-radius-top: 10px;
+  overflow-y: scroll;
+  overflow-x: hidden;
+}
+.px {
+  padding: 5px;
+  width: 280px;
+  border: 1px solid #004d00;
+  display: inline-block;
+  margin: 0px 2px 0px 2px;
+}
+</style>
+
+<script>
+let ts = "?ts=" + moment().format("YYYYMMDDHHmmss");
+module.exports = {
+  data() {
+    return {
+      orderHeaderID: 0,
+    };
+  },
+  components: {
+    //'one-fpp':httpVueLoader('../../../../apps/components/oneFpp.vue' + ts),
+  },
+  computed: {
+    orders() {
+      return this.$store.state.order_info.orders;
+    },
+    loading() {
+      return this.$store.state.order_info.loading;
+    },
+    show: {
+      get() {
+        return this.$store.state.order_info.show;
+      },
+      set(v) {
+        return this.$store.commit("order_info/update_show", v);
+      },
+    },
+    sel_patient() {
+      return this.$store.state.samplecall.selected_patient;
+    },
+  },
+  methods: {},
+  watch: {
+    async sel_patient(n, o) {
+      this.$store.dispatch("order_info/search", { id: n.T_OrderHeaderID });
+      this.orderHeaderID = n.T_OrderHeaderID;
+    },
+  },
+};
+</script>

test/vuex/cpone-sample-lab/components/oneRequirement.vue

@@ -0,0 +1,116 @@
+<template>
+<v-dialog
+   v-model="show"
+   width="40%"
+   >
+   <v-card>
+       <v-card-title
+           class="headline white--text primary"
+           primary-title
+           v-html="patient_info"
+       >
+       </v-card-title>
+
+       <v-card-text style="font-size:16px;">
+               
+               <ul  >
+                   <li v-if="have_note">
+                   Catatan FO <span style="color:brown;padding:2px">[{{user}}]</span>
+                     <div>
+                        {{fo_note()}}
+                     </div>
+                   </li>
+                   <li v-if="have_ver_note">
+                   Catatan FO Verifikasi<span style="color:brown;padding:2px">[{{ver_user}}]</span>
+                     <div>
+                        {{ver_note()}}
+                     </div>
+                   </li>
+                   <li v-for="req in requirements" >
+                     {{get_position(req)}}
+                      <div >
+                         {{get_detail(req)}}
+                     </div>
+                   </li>
+               </ul>
+       </v-card-text>
+
+      <v-progress-linear :active="loading" :indeterminate="true">
+      </v-progress-linear>
+       <v-divider></v-divider>
+
+       <v-card-actions>
+       <v-spacer></v-spacer>
+       <v-btn
+           color="grey"
+           dark
+           flat
+           text
+           @click="close_dialog"
+       >
+           Tutup
+       </v-btn>
+       </v-card-actions>
+   </v-card>
+</v-dialog>
+</template>
+
+<script>
+module.exports = {
+   methods: {
+      get_position(req) {
+         if( req.Nat_PositionName == null ) return ''
+         return req.Nat_PositionName.toUpperCase()
+      },
+      get_detail(req) {
+         return req.Requirement
+      },
+      close_dialog() {
+         this.$store.commit("req/update_show",false)
+      },
+      fo_note() {
+         return this.$store.state.req.note.T_OrderHeaderFoNote
+      },
+      ver_note() {
+         return this.$store.state.req.note.T_OrderHeaderVerificationNote
+      },
+   },
+   computed: {
+      user() {
+         return this.$store.state.req.note.Fo_User
+      },
+      have_note() {
+         let note = this.$store.state.req.note.T_OrderHeaderFoNote 
+         if (note == null ) return false 
+         return note != ''
+      },
+      have_ver_note() {
+         let note = this.$store.state.req.note
+         if ( note.T_OrderHeaderVerificationNote == null ) return false 
+         return note.T_OrderHeaderVerificationNote != '' 
+      },
+      ver_user() {
+         return this.$store.state.req.note.Ver_User
+      },
+      requirements() {
+         return this.$store.state.req.requirements 
+      },
+      patient_info() {
+         let patient = this.$store.state.req.patient 
+         return patient.T_OrderHeaderLabNumber +
+            "&nbsp;&nbsp;&nbsp;" + patient.M_PatientName 
+      },
+      loading() {
+         return this.$store.state.req.loading
+      },
+      show: {
+         get() { return this.$store.state.req.show},
+         set(v) { this.$store.commit("req/update_show",v)}
+      },
+      reqs() {
+         return this.$store.state.req.requirements
+      }
+   },
+   
+}
+</script>

test/vuex/cpone-sample-lab/components/oneSampleCallSODetail.vue

@@ -0,0 +1,616 @@
+<template>
+  <v-layout class="mb-2 mt-2" column>
+    <one-req></one-req>
+    <one-comment></one-comment>
+    <v-dialog v-model="dialognote" width="40%">
+      <v-card>
+        <v-card-title class="headline white--text error" primary-title>
+        </v-card-title>
+
+        <v-card-text>
+          <v-layout v-if="selected_patient.fo_note != ''" mb-2 row>
+            <v-flex mb-2 xs3>
+              <span style="color: #0e6fbc" class="mono name">Catatan </span>
+            </v-flex>
+            <v-flex xs9>
+              <v-layout row>
+                <v-flex mb-1 xs12>
+                  <code
+                    style="
+                      box-shadow: none !important;
+                      color: #0e6fbc !important;
+                      background-color: #2196f34d !important;
+                    "
+                    >front office</code
+                  >
+                  <div class="v-markdown">
+                    <p style="margin-top: 2px; margin-bottom: 0">
+                      {{ selected_patient.fo_note }}
+                    </p>
+                  </div>
+                </v-flex>
+              </v-layout>
+            </v-flex>
+          </v-layout>
+          <v-layout v-if="xnoterequirement.length > 0" mb-2 row>
+            <v-flex mb-2 xs3>
+              <span style="color: #c0341d" class="mono name">Requirement </span>
+            </v-flex>
+            <v-flex xs9>
+              <v-layout v-for="notereq in xnoterequirement" row>
+                <v-flex mb-1 xs12>
+                  <code
+                    style="
+                      box-shadow: none !important;
+                      color: #c0341d !important;
+                      background-color: #fbe5e1 !important;
+                    "
+                    >{{ notereq.position }}</code
+                  >
+                  <div class="v-markdown">
+                    <p style="margin-top: 2px; margin-bottom: 0">
+                      {{ notereq.requirements }}
+                    </p>
+                  </div>
+                </v-flex>
+              </v-layout>
+              <!--<v-layout row>
+                                    <v-flex mb-1 xs12>
+                                        <code style="box-shadow: none !important;color: #c0341d !important;background-color: #fbe5e1 !important;">Specimen</code>
+                                        <div class="v-markdown">
+                                            <p style="margin-bottom:0">Tidak Puasa, Puasa Lebih, Obat Diuretik dan Cafein</p>
+                                        </div>
+                                    </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" dark flat text @click="dialognote = false">
+            Tutup
+          </v-btn>
+        </v-card-actions>
+      </v-card>
+    </v-dialog>
+    <v-dialog v-model="dialogformnote" width="40%">
+      <v-card>
+        <v-card-title class="headline white--text primary" primary-title>
+        </v-card-title>
+
+        <v-card-text>
+          <v-layout mb-2 row>
+            <v-flex xs12>
+              <v-textarea
+                outline
+                label="Catatan"
+                v-model="selected_patient.sampling_note"
+              ></v-textarea>
+            </v-flex>
+          </v-layout>
+        </v-card-text>
+
+        <v-divider></v-divider>
+
+        <v-card-actions>
+          <v-spacer></v-spacer>
+          <v-btn color="grey" dark flat text @click="searchPatientLastSelect">
+            Tutup
+          </v-btn>
+          <v-btn color="primary" dark flat text @click="saveNoteSampling()">
+            Simpan
+          </v-btn>
+        </v-card-actions>
+      </v-card>
+    </v-dialog>
+    <v-dialog v-model="dialogrequirement" persistent max-width="45%">
+      <v-card>
+        <v-card-title color="success" class="headline"
+          >Pilih yang tidak terpenuhi</v-card-title
+        >
+        <v-card-text>
+          <v-layout wrap>
+            <v-flex v-for="(req, idx) in requirements" xs6>
+              <one-x-check
+                :xdatalabel="req.name"
+                :xdatacbx="req.chex"
+                @update-data-cbx="(val) => checkReq(val, idx)"
+              ></one-x-check>
+            </v-flex>
+          </v-layout>
+        </v-card-text>
+        <v-card-actions>
+          <v-spacer></v-spacer>
+          <v-btn color="green darken-1" flat @click="saveRequirement"
+            >Tutup</v-btn
+          >
+          <!--<v-btn color="green darken-1" flat @click="saveRequirement()">Simpan</v-btn>-->
+        </v-card-actions>
+      </v-card>
+    </v-dialog>
+    <v-card
+      style="overflow-y: auto; max-height: 550px"
+      v-if="xsampletypes.length > 0"
+    >
+      <v-layout row>
+        <v-flex xs12>
+          <v-subheader style="background: #03a9f4; padding: 5px">
+            <v-icon dark large left>assignment_ind</v-icon>
+            <h3
+              style="font-size: x-large"
+              dark
+              class="font-weight-bold white--text"
+            >
+              {{ staff.name.toUpperCase() }}
+            </h3>
+            <v-flex text-md-right>
+              <v-btn
+                v-if="
+                  selected_patient.fo_note !== '' ||
+                  selected_patient.fo_ver_note !== '' ||
+                  selected_patient.fo_requirements_status !== 'Y' 
+                "
+                @click="openDialogFoNoteRequirement()"
+                style="min-width: 20px; margin-left: 1px; margin-right: 1px"
+                deppressed
+                small
+                color="error"
+                ><v-icon small>info</v-icon></v-btn
+              >
+              <!--<v-btn
+                @click="openDialogFormNote()"
+                style="min-width: 20px; margin-left: 1px; margin-right: 1px"
+                deppressed
+                small
+                color="warning"
+                ><v-icon small>speaker_notes</v-icon></v-btn
+              >-->
+            </v-flex>
+          </v-subheader>
+          <v-divider></v-divider>
+          <v-layout align-center pa-2 mb-1 class="grey lighten-2" row>
+            <v-flex xs4> SPECIMEN </v-flex>
+            <v-flex xs4> BARCODE </v-flex>
+            <!--<v-flex xs2> REQUIREMENT </v-flex>-->
+            <v-flex class="text-xs-center" xs4> AKSI </v-flex>
+          </v-layout>
+          <v-layout
+            pb-1
+            row
+            v-for="(sampletype, idx) in xsampletypes"
+            :key="sampletype.T_BarcodeLabBarcode"
+          >
+            <v-flex xs12>
+              <v-layout align-center class="pa-2 grey lighten-4" row>
+                <!--<v-flex class="text-xs-center" xs1>
+                                <v-btn v-if="selected_patient.status !== 'Process'" depressed small style="min-width:30px" class="white--text" color="grey"><v-icon>block</v-icon></v-btn>
+                                <v-btn @click="addNewLabel(sampletype)" v-if="selected_patient.status === 'Process'" small style="min-width:30px" class="white--text" color="#00bcd4"><v-icon>add</v-icon></v-btn>
+                            </v-flex>-->
+                <v-flex pl-2 xs4>
+                  {{ sampletype.T_SampleTypeName }}
+                </v-flex>
+                <v-flex xs4>
+                  <span
+                    v-if="sampletype.T_OrderSampleSampling === 'X'"
+                    style="text-decoration: line-through"
+                    class="red--text"
+                    >{{ sampletype.T_BarcodeLabBarcode }}</span
+                  >
+                  <span v-if="sampletype.T_OrderSampleSampling !== 'X'">{{
+                    sampletype.T_BarcodeLabBarcode
+                  }}</span>
+                </v-flex>
+                 <!-- <v-flex xs2>
+                <div
+                    v-if="
+                      selected_patient.status === 'Process' ||
+                      selected_patient.status === 'Done'
+                    "
+                  >
+                    <span
+                      @click="openDialogRequirement(sampletype, idx)"
+                      v-bind:class="{
+                        white: sampletype.requirement_status === 'X',
+                        error: sampletype.requirement_status === 'N',
+                      }"
+                      class="icon-medium-fill-base-small white"
+                      ><v-icon :dark="sampletype.requirement_status === 'N'"
+                        >close</v-icon
+                      ></span
+                    >
+                    <span
+                      @click="confirmRequirement(sampletype, idx)"
+                      v-bind:class="{
+                        white: sampletype.requirement_status === 'X',
+                        success: sampletype.requirement_status === 'Y',
+                      }"
+                      class="icon-medium-fill-base-small white"
+                      ><v-icon :dark="sampletype.requirement_status === 'Y'"
+                        >check</v-icon
+                      ></span
+                    >
+                  </div>
+                  <div
+                    v-if="
+                      selected_patient.status === 'New' ||
+                      selected_patient.status === 'Call' ||
+                      selected_patient.status === 'Skip'
+                    "
+                  >
+                    -
+                  </div>
+                </v-flex>-->
+                <v-flex class="text-xs-center" xs4>
+                  <v-btn
+                    v-if="
+                      selected_patient.status === 'Process' ||
+                      selected_patient.status === 'Done'
+                    "
+                    style="margin: 3px 2px"
+                    small
+                    color="warning"
+                    >{{ sampletype.process_date }}
+                    {{ sampletype.process_time }}</v-btn
+                  >
+                  <v-btn
+                    v-if="
+                      selected_patient.status === 'Process' &&
+                      sampletype.T_OrderSampleSampling === 'Y' &&
+                      sampletype.requirement_status !== 'X'
+                    "
+                    @click="receiveSample(sampletype)"
+                    style="margin: 3px 2px"
+                    small
+                    color="success"
+                    >{{ sampletype.done_date }}
+                    {{ sampletype.done_time }}</v-btn
+                  >
+                  <v-btn
+                    depressed
+                    dark
+                    v-if="
+                      selected_patient.status === 'Process' &&
+                      sampletype.T_OrderSampleReceive === 'N' &&
+                      sampletype.requirement_status === 'X'
+                    "
+                    style="margin: 3px 2px"
+                    small
+                    color="grey"
+                    >00-00-0000 00:00</v-btn
+                  >
+                  <div
+                    v-if="
+                      selected_patient.status === 'New' ||
+                      selected_patient.status === 'Call' ||
+                      selected_patient.status === 'Skip'
+                    "
+                  >
+                    -
+                  </div>
+                </v-flex>
+              </v-layout>
+            </v-flex>
+          </v-layout>
+        </v-flex>
+      </v-layout>
+      <v-divider></v-divider>
+      <v-layout row>
+        <v-flex xs12>
+          <v-layout wrap>
+            <v-flex v-for="inf in info" :key="inf.id" pb-1 pl-1 pr-1 xs3>
+              <v-btn
+                block
+                small
+                color="primary"
+                v-bind:class="{
+                  success: inf.status_bahan === 'R',
+                  warning: inf.status_bahan === 'P',
+                }"
+                dark
+                >{{ inf.T_BahanName }}</v-btn
+              >
+            </v-flex>
+          </v-layout>
+        </v-flex>
+      </v-layout>
+    </v-card>
+  </v-layout>
+</template>
+
+<style scoped>
+.overline {
+  font-size: 0.625rem !important;
+  font-weight: 400;
+  letter-spacing: 0.1666666667em !important;
+  line-height: 1rem;
+  text-transform: uppercase;
+}
+.redcode {
+  box-shadow: none !important;
+  color: #c0341d !important;
+  background-color: #fbe5e1 !important;
+}
+</style>
+
+<script>
+let ts = "?ts=" + moment().format("YYYYMMDDHHmmss");
+module.exports = {
+  components: {
+    "one-x-check": httpVueLoader("../../common/onexcheck.vue"),
+    "one-req": httpVueLoader("./oneRequirement.vue" + ts),
+    "one-comment": httpVueLoader("./oneComment.vue" + ts),
+  },
+  data: () => ({
+    checkbox: false,
+    //dialognote:false,
+    dialognotecolor: "warning",
+    // msgnote:''
+  }),
+  computed: {
+    xnoterequirement() {
+      return this.$store.state.samplecall.note_requirement;
+    },
+    xsampletypes() {
+      return this.$store.state.samplecall.sampletypes;
+    },
+    xstatus() {
+      return this.$store.state.samplecall.selected_status;
+    },
+    selected_patient() {
+      return this.$store.state.samplecall.selected_patient;
+    },
+    dialogrequirement: {
+      get() {
+        return this.$store.state.samplecall.dialog_requirement;
+      },
+      set(val) {
+        this.$store.commit("samplecall/update_dialog_requirement", val);
+      },
+    },
+    dialognote: {
+      get() {
+        return this.$store.state.samplecall.dialog_note;
+      },
+      set(val) {
+        this.$store.commit("samplecall/update_dialog_note", val);
+      },
+    },
+    dialogformnote: {
+      get() {
+        return this.$store.state.samplecall.dialog_form_note;
+      },
+      set(val) {
+        this.$store.commit("samplecall/update_dialog_form_note", val);
+      },
+    },
+    msgnote: {
+      get() {
+        return this.$store.state.samplecall.msg_note;
+      },
+      set(val) {
+        this.$store.commit("samplecall/update_msg_note", val);
+      },
+    },
+    requirements: {
+      get() {
+        return this.$store.state.samplecall.requirements;
+      },
+      set(val) {
+        this.$store.commit("samplecall/update_requirements", val);
+      },
+    },
+    info: {
+      get() {
+        return this.$store.state.samplecall.information_bahan;
+      },
+      set(val) {
+        this.$store.commit("samplecall/update_information_bahan", val);
+      },
+    },
+    staff: {
+      get() {
+        return this.$store.state.samplecall.staff;
+      },
+      set(val) {
+        this.$store.commit("samplecall/update_staff", val);
+      },
+    },
+  },
+  methods: {
+    processSample(sampletype) {
+      var patient = this.$store.state.samplecall.selected_patient;
+      var msg =
+        "Anda yakin akan melakukan proses untuk " +
+        sampletype.T_SampleTypeName +
+        " dari " +
+        patient.patient_fullname +
+        " ? ";
+      this.$store.commit("samplecall/update_msg_action", msg);
+      this.$store.commit("samplecall/update_act", "samplingprocess");
+      this.$store.commit("samplecall/update_selected_sampletype", sampletype);
+      this.$store.commit("samplecall/update_dialog_action", true);
+    },
+    doneSample(sampletype) {
+      var patient = this.$store.state.samplecall.selected_patient;
+      var msg =
+        "Anda yakin proses untuk " +
+        sampletype.T_SampleTypeName +
+        " dari " +
+        patient.patient_fullname +
+        " telah selesai ? ";
+      this.$store.commit("samplecall/update_msg_action", msg);
+      this.$store.commit("samplecall/update_act", "samplingdone");
+      this.$store.commit("samplecall/update_selected_sampletype", sampletype);
+      this.$store.commit("samplecall/update_dialog_action", true);
+    },
+    printBarcodeGroup() {
+      var id = this.selected_patient.T_OrderHeaderID;
+      one_print_barcode_so_group(id);
+    },
+    printBarcode(sampletype) {
+      var id = sampletype.T_OrderDetailID;
+      one_print_barcode_so(id);
+    },
+    openDialogRequirement(value, idx) {
+      if (value.status === "D" && value.requirement_status === "Y") {
+      } else {
+        this.$store.commit("samplecall/update_selected_sample", value);
+        var sampletypes = this.$store.state.samplecall.sampletypes;
+        sampletypes[idx].requirement_status = "N";
+        this.$store.commit(
+          "samplecall/update_requirements",
+          sampletypes[idx].requirements
+        );
+        this.$store.commit("samplecall/update_dialog_requirement", true);
+      }
+    },
+    confirmRequirement(value, idx) {
+      if (value.status === "P") {
+        var sampletypes = this.$store.state.samplecall.sampletypes;
+        sampletypes[idx].requirement_status = "Y";
+        this.$store.commit("samplecall/update_sampletypes", sampletypes);
+
+        sampletypes[idx].requirements.forEach((el) => {
+          el.chex = "N";
+        });
+      }
+    },
+    saveRequirement() {
+      //console.log(this.$store.state.samplecall.selected_sample)
+
+      var sampletypes = this.$store.state.samplecall.sampletypes;
+      var selected_sample = this.$store.state.samplecall.selected_sample;
+      var idx = _.findIndex(sampletypes, function (o) {
+        return o.T_BarcodeLabBarcode == selected_sample.T_BarcodeLabBarcode;
+      });
+      if (sampletypes[idx].status === "P") {
+        sampletypes[idx].requirements =
+          this.$store.state.samplecall.requirements;
+      }
+      this.$store.commit("samplecall/update_dialog_requirement", false);
+    },
+    checkReq(val, idx) {
+      var xrequirements = this.requirements;
+      console.log(xrequirements[idx]);
+      if (xrequirements[idx].T_OrderSampleReceive === "N") {
+        xrequirements[idx].chex = val;
+        this.$store.commit("samplecall/update_requirements", xrequirements);
+      }
+    },
+    receiveSample(value) {
+      var goaction = true;
+      if (value.requirement_status === "N") {
+        var req_check = _.filter(value.requirements, function (o) {
+          return o.chex === "Y";
+        });
+        if (req_check.length === 0) {
+          goaction = false;
+        }
+      }
+      if (
+        value.T_OrderSampleReceive === "N" &&
+        value.requirement_status !== "X" &&
+        goaction
+      ) {
+        this.$store.commit("samplecall/update_act", "samplingdone");
+        var prm = this.selected_patient;
+        prm.id = this.selected_patient.T_OrderHeaderID;
+        prm.act = "samplingdone";
+        prm.sample = value;
+        prm.staff = this.$store.state.samplecall.staff;
+        prm.search = {
+          xdate: this.$store.state.samplecall.start_date,
+          name: this.$store.state.samplecall.name,
+          nolab: this.$store.state.samplecall.nolab,
+          stationid: this.$store.state.samplecall.selected_station.id,
+          statusid: this.$store.state.samplecall.selected_status.id,
+          companyid: this.$store.state.samplecall.selected_company.id,
+          lastid: this.$store.state.samplecall.last_id,
+          locationid: this.$store.state.samplecall.selected_location.locationID,
+        };
+        this.$store.dispatch("samplecall/receivesample", prm);
+      } else {
+        //console.log('oeey')
+        if (value.status === "P") {
+          this.$store.commit(
+            "samplecall/update_msg_info",
+            "Jalan - jalan ke gunung merapi, Requirement-nya tolong dilengkapi"
+          );
+          this.$store.commit("samplecall/update_open_dialog_info", true);
+        }
+      }
+    },
+    addNewLabel(sampletype) {
+      this.$store.commit("samplecall/update_selected_sampletype", sampletype);
+      var sample = sampletype.T_SampleTypeName;
+      var patient = this.$store.state.samplecall.selected_patient;
+      var msg =
+        "Anda yakin akan melakukan penambahan label spesimen " +
+        sample +
+        " untuk pasien " +
+        patient.patient_fullname +
+        " ? ";
+      this.$store.commit("samplecall/update_msg_action", msg);
+      this.$store.commit("samplecall/update_act", "addnewlabel");
+      //this.closeDialogAction()
+      this.$store.commit("samplecall/update_dialog_action", true);
+    },
+    openDialogNote() {
+      this.msgnote = '<p><code color="red">catatan dari fo : </code></p>';
+      this.msgnote +=
+        "<p>" +
+        this.$store.state.samplecall.selected_patient.T_OrderHeaderFoNote +
+        "</p>";
+      this.dialognotecolor = "warning";
+      this.dialognote = true;
+    },
+    openDialogFormNote() {
+      //this.dialogformnote = true
+      //WIP
+      this.$store.commit("comment/update_show", true);
+      this.$store.commit(
+        "comment/update_patient",
+        this.$store.state.samplecall.selected_patient
+      );
+      this.$store.dispatch("comment/load");
+    },
+    openDialogFoNoteRequirement() {
+      var prm = this.$store.state.samplecall.selected_patient;
+      this.$store.commit("req/update_patient", prm);
+      this.$store.dispatch("req/load");
+      this.$store.commit("req/update_show", true);
+      // this.$store.dispatch("samplecall/getdatanoterequirement",prm)
+    },
+    searchPatientLastSelect() {
+      this.dialogformnote = false;
+      this.$store.dispatch("samplecall/search", {
+        xdate: this.$store.state.samplecall.start_date,
+        name: this.$store.state.samplecall.name,
+        nolab: this.$store.state.samplecall.nolab,
+        stationid: this.$store.state.samplecall.selected_station.id,
+        statusid: this.$store.state.samplecall.selected_status.id,
+        companyid: this.$store.state.samplecall.selected_company.id,
+        lastid: this.$store.state.samplecall.last_id,
+        locationid: this.$store.state.samplecall.selected_location.locationID,
+      });
+    },
+    saveNoteSampling() {
+      var prm = this.$store.state.samplecall.selected_patient;
+      prm.search = {
+        xdate: this.$store.state.samplecall.start_date,
+        name: this.$store.state.samplecall.name,
+        nolab: this.$store.state.samplecall.nolab,
+        stationid: this.$store.state.samplecall.selected_station.id,
+        statusid: this.$store.state.samplecall.selected_status.id,
+        companyid: this.$store.state.samplecall.selected_company.id,
+        lastid: this.$store.state.samplecall.last_id,
+        locationid: this.$store.state.samplecall.selected_location.locationID,
+      };
+      this.$store.dispatch("samplecall/savenotesampling", prm);
+    },
+  },
+};
+</script>

test/vuex/cpone-sample-lab/components/oneSampleCallSOFilter.vue

@@ -0,0 +1,480 @@
+<template>
+  <v-layout class="fill-height" column>
+    <v-card class="mb-2 pa-2 searchbox">
+      <v-layout row>
+        <v-flex class="xs2 pr-2">
+          <v-menu
+            v-model="menufilterdatestart"
+            :close-on-content-click="false"
+            :nudge-right="40"
+            lazy
+            transition="scale-transition"
+            offset-y
+            full-width
+            max-width="290px"
+            min-width="290px"
+          >
+            <template v-slot:activator="{ on }">
+              <v-text-field
+                v-model="filterComputedDateFormattedStart"
+                label="Tanggal"
+                style="font-size: 14px"
+                outline
+                hide-details
+                readonly
+                v-on="on"
+                @blur="date = deFormatedDate(filterComputedDateFormattedStart)"
+              ></v-text-field>
+            </template>
+            <v-date-picker
+              v-model="xdatestart"
+              no-title
+              @input="menufilterdatestart = false"
+            ></v-date-picker>
+          </v-menu>
+        </v-flex>
+        <v-flex xs3>
+          <v-text-field
+            style="font-size: 14px"
+            label="Cari..."
+            placeholder="No Reg / Nama"
+            class="mr-1"
+            outline
+            v-model="nolab"
+            hide-details
+          ></v-text-field>
+        </v-flex>
+        <v-flex xs3>
+          <v-autocomplete
+            label="Corporate"
+            v-model="selected_company"
+            class="ml-1"
+            :items="xcompanies"
+            :search-input.sync="search_company"
+            auto-select-first
+            hide-details
+            style="font-size: 14px"
+            outline
+            no-filter
+            item-text="name"
+            return-object
+            :loading="isLoading"
+            no-data-text="Semua Corporate"
+          >
+            <template slot="item" slot-scope="{ item }">
+              <v-list-tile-content>
+                <v-list-tile-title v-text="item.name"></v-list-tile-title>
+              </v-list-tile-content>
+            </template>
+          </v-autocomplete>
+        </v-flex>
+        <v-flex xs3>
+          <v-select
+            class="mini-select ml-1"
+            :items="xstations"
+            item-text="name"
+            return-object
+            style="font-size: 14px"
+            v-model="xselectedstation"
+            label="Station"
+            outline
+            hide-details
+          ></v-select>
+        </v-flex>
+        <v-flex xs2>
+          <v-select
+            class="mini-select ml-1"
+            :items="locations"
+            item-text="locationName"
+            return-object
+            style="font-size: 14px"
+            v-model="selected_location"
+            label="Lokasi"
+            outline
+            hide-details
+          ></v-select>
+        </v-flex>
+        <v-flex xs1>
+          <span
+            @click="searchPatient"
+            class="icon-medium-fill-base white--text success iconsearch-search"
+          ></span>
+        </v-flex>
+      </v-layout>
+    </v-card>
+  </v-layout>
+</template>
+
+<style scoped>
+.searchbox .v-input.v-text-field .v-input__slot {
+  min-height: 60px;
+}
+.searchbox .v-btn {
+  min-height: 60px;
+}
+table,
+td,
+th {
+  border: 0.5px solid rgba(0, 0, 0, 0.12);
+  text-align: left;
+}
+
+table {
+  border-collapse: collapse;
+  width: 100%;
+}
+table.v-table tbody td,
+table.v-table tbody th {
+  height: 40px;
+}
+
+table.v-table thead tr {
+  height: 40px;
+}
+
+.fixed_header tbody {
+  display: block;
+  max-height: 630px;
+  overflow-y: scroll;
+}
+
+.fixed_header thead,
+tbody tr {
+  display: table;
+  width: 100%;
+  table-layout: fixed;
+}
+</style>
+
+<script>
+module.exports = {
+  components: {
+    "one-dialog-info": httpVueLoader("../../common/oneDialogInfo.vue"),
+    "one-dialog-alert": httpVueLoader("../../common/oneDialogAlert.vue"),
+  },
+  mounted() {
+    //this.$store.dispatch("samplecall/getinitdata")
+    this.$store.dispatch("samplecall/getstationstatus", {
+      xdate: this.$store.state.samplecall.start_date,
+      name: this.name,
+      nolab: this.nolab,
+      stationid: this.xselectedstation.id,
+      statusid: this.xselectedstatus.id,
+      companyid: this.selected_company.id,
+      // current_page:1,
+      lastid: -1,
+    });
+  },
+  methods: {
+    formatDate(date) {
+      if (!date) return null;
+
+      const [year, month, day] = date.split("-");
+      return `${day}-${month}-${year}`;
+    },
+    deFormatedDate(date) {
+      if (!date) return null;
+
+      const [day, month, year] = date.split("-");
+      return `${year}-${month.padStart(2, "0")}-${day.padStart(2, "0")}`;
+    },
+    format_date(d) {
+      return moment(d).format("DD.MM.YYYY");
+    },
+    isSelected(p) {
+      if (p.coming === "Y" || p.iscito === "Y") return false;
+      else
+        return (
+          p.T_OrderHeaderID ==
+          this.$store.state.samplecall.selected_patient.T_OrderHeaderID
+        );
+    },
+    searchPatient() {
+      this.$store.commit("samplecall/update_last_id", -1);
+      this.$store.dispatch("samplecall/search", {
+        xdate: this.$store.state.samplecall.start_date,
+        name: this.name,
+        nolab: this.nolab,
+        stationid: this.xselectedstation.id,
+        statusid: this.xselectedstatus.id,
+        companyid: this.selected_company.id,
+        locationid: this.selected_location.locationID,
+        //current_page:1,
+        lastid: -1,
+      });
+    },
+    selectMe(pat) {
+      if (this.$store.state.samplecall.no_save == 0) {
+        var patients = this.$store.state.samplecall.patients;
+        this.$store.commit("samplecall/update_selected_patient", pat);
+        var idx = _.findIndex(patients, function (o) {
+          return o.T_OrderHeaderID == pat.T_OrderHeaderID;
+        });
+        this.$store.commit("samplecall/update_last_id", idx);
+        this.$store.dispatch("samplecall/getsampletypes", {
+          orderid: pat.T_OrderHeaderID,
+          stationid: pat.T_SampleStationID,
+          statusid: pat.statusid,
+        });
+      } else {
+        this.$store.commit("samplecall/update_open_alert_confirmation", true);
+      }
+    },
+    closeAlertConfirmation() {
+      this.$store.commit("samplecall/update_open_alert_confirmation", false);
+    },
+    forgetAlertConfirmation() {
+      this.$store.commit("samplecall/update_no_save", 0);
+      this.$store.commit("samplecall/update_open_alert_confirmation", false);
+    },
+    updateAlert_success(val) {
+      this.$store.commit("samplecall/update_alert_success", val);
+    },
+    setNewPatient() {},
+    closeDialogSuccess() {
+      let arrPatient = this.$store.state.samplecall.patients;
+      var idx = _.findIndex(
+        arrPatient,
+        (item) => item.M_PatientID === this.$store.state.samplecall.last_id
+      );
+      console.log(idx);
+      var xcur_page = 1;
+
+      this.$store.dispatch("samplecall/search", {
+        name: this.name,
+        nolab: this.nolab,
+        stationid: this.xselectedstation.id,
+        statusid: this.xselectedstatus.id,
+        locationid: this.selected_location.locationID,
+        lastid: idx,
+      });
+
+      this.$store.commit("samplecall/update_dialog_success", false);
+    },
+    closeDialogInfo() {
+      this.$store.commit("samplecall/update_open_dialog_info", false);
+    },
+    thr_search_company: _.debounce(function () {
+      this.$store.dispatch("samplecall/searchcompany", this.search_company);
+    }, 2000),
+  },
+  computed: {
+    xdatestart: {
+      get() {
+        return this.$store.state.samplecall.start_date;
+      },
+      set(val) {
+        this.$store.commit("samplecall/update_start_date", val);
+        //this.searchTransaction()
+      },
+    },
+    filterComputedDateFormattedStart() {
+      return this.formatDate(this.xdatestart);
+    },
+    dialogsuccess: {
+      get() {
+        return this.$store.state.samplecall.dialog_success;
+      },
+      set(val) {
+        this.$store.commit("samplecall/update_dialog_success", val);
+      },
+    },
+    msgsuccess() {
+      return this.$store.state.samplecall.msg_success;
+    },
+    snackbar: {
+      get() {
+        return this.$store.state.samplecall.alert_success;
+      },
+      set(val) {
+        this.$store.commit("samplecall/update_alert_success", val);
+      },
+    },
+    isLoading() {
+      return this.$store.state.samplecall.search_status == 1;
+    },
+    xstations() {
+      return this.$store.state.samplecall.stations;
+    },
+    xselectedstation: {
+      get() {
+        return this.$store.state.samplecall.selected_station;
+      },
+      set(val) {
+        this.$store.commit("samplecall/update_selected_station", val);
+        this.$store.dispatch("samplecall/getLocation", val.id);
+        this.$store.commit("samplecall/update_patients", []);
+        this.$store.commit("samplecall/update_selected_patient", {});
+        this.$store.commit("samplecall/update_sampletypes", []);
+        // this.searchPatient()
+      },
+    },
+    xstatuses() {
+      return this.$store.state.samplecall.statuses;
+    },
+    xselectedstatus: {
+      get() {
+        return this.$store.state.samplecall.selected_status;
+      },
+      set(val) {
+        this.$store.commit("samplecall/update_selected_status", val);
+        // this.searchPatient()
+      },
+    },
+    patients() {
+      return this.$store.state.samplecall.patients;
+    },
+    openalertconfirmation: {
+      get() {
+        return this.$store.state.samplecall.open_alert_confirmation;
+      },
+      set(val) {
+        this.$store.commit("samplecall/update_open_alert_confirmation", val);
+      },
+    },
+    curr_page: {
+      get() {
+        return this.$store.state.samplecall.current_page;
+      },
+      set(val) {
+        this.$store.commit("samplecall/update_current_page", val);
+        this.$store.dispatch("samplecall/search", {
+          name: this.name,
+          nolab: this.nolab,
+          stationid: this.xselectedstation.id,
+          statusid: this.xselectedstatus.id,
+          current_page: val,
+          locationid: this.selected_location.locationID,
+          lastid: idx,
+        });
+      },
+    },
+    xtotal_page: {
+      get() {
+        return this.$store.state.samplecall.total_page;
+      },
+      set(val) {
+        this.$store.commit("samplecall/update_total_page", val);
+      },
+    },
+    opendialoginfo: {
+      get() {
+        return this.$store.state.samplecall.open_dialog_info;
+      },
+      set(val) {
+        this.$store.commit("samplecall/update_open_dialog_info", false);
+      },
+    },
+    msginfo() {
+      return this.$store.state.samplecall.msg_info;
+    },
+    name: {
+      get() {
+        return this.$store.state.samplecall.name;
+      },
+      set(val) {
+        this.$store.commit("samplecall/update_name", val);
+      },
+    },
+    nolab: {
+      get() {
+        return this.$store.state.samplecall.nolab;
+      },
+      set(val) {
+        this.$store.commit("samplecall/update_nolab", val);
+        //this.searchPatient()
+      },
+    },
+    xcompanies() {
+      return this.$store.state.samplecall.companies;
+    },
+    selected_company: {
+      get() {
+        return this.$store.state.samplecall.selected_company;
+      },
+      set(val) {
+        this.$store.commit("samplecall/update_selected_company", val);
+        // this.searchPatient()
+      },
+    },
+    selected_location: {
+      get() {
+        return this.$store.state.samplecall.selected_location;
+      },
+      set(val) {
+        this.$store.commit("samplecall/update_selected_location", val);
+        this.$store.commit("samplecall/update_patients", []);
+        this.$store.commit("samplecall/update_selected_patient", {});
+        this.$store.commit("samplecall/update_sampletypes", []);
+        // this.searchPatient()
+      },
+    },
+    locations() {
+      return this.$store.state.samplecall.locations;
+    },
+  },
+  watch: {
+    search_company(val, old) {
+      if (val == old) return;
+      if (!val) return;
+      if (val.length < 1) return;
+      if (this.$store.state.samplecall.update_autocomplete_status == 1) return;
+      this.thr_search_company();
+    },
+  },
+  data() {
+    return {
+      msgalertconfirmation:
+        "Perubahan yang telah dilakukan belum disimpan dong !",
+      items: [],
+      search_company: "",
+      menufilterdatestart: false,
+      //isLoading: false,
+      page: 1,
+      headers: [
+        {
+          text: "TANGGAL",
+          align: "center",
+          sortable: false,
+          value: "mr",
+          width: "10%",
+          class: "pa-2 blue lighten-3 white--text",
+        },
+        {
+          text: "NO REG",
+          align: "center",
+          sortable: false,
+          value: "mr",
+          width: "10%",
+          class: "pa-2 blue lighten-3 white--text",
+        },
+        {
+          text: "KEL. PELANGGAN",
+          align: "center",
+          sortable: false,
+          value: "lab",
+          width: "15%",
+          class: "pa-2 blue lighten-3 white--text",
+        },
+        {
+          text: "NAMA",
+          align: "center",
+          sortable: false,
+          value: "name",
+          width: "20%",
+          class: "pa-2 blue lighten-3 white--text",
+        },
+
+        {
+          text: "STATUS",
+          align: "center",
+          sortable: false,
+          value: "status",
+          width: "10%",
+          class: "pa-2 blue lighten-3 white--text",
+        },
+      ],
+    };
+  },
+};
+</script>

test/vuex/cpone-sample-lab/components/oneSampleCallSOInfo.vue

@@ -0,0 +1,379 @@
+<template>
+<div>
+        <v-dialog v-model="xdialogaction" persistent  max-width="350">
+            <v-card>
+                <v-card-title color="warning"  class="headline">Konfirmasi</v-card-title>
+                <v-card-text v-html="xmsgaction">
+                    
+                </v-card-text>
+                <v-card-actions>
+                <v-spacer></v-spacer>
+                    <v-btn color="primary darken-1" flat @click="closeDialogAction()">OK</v-btn>
+                    <v-btn color="error darken-1" flat @click="xdialogaction = false">Tutup</v-btn>
+                </v-card-actions>
+            </v-card>
+        </v-dialog>
+
+    <v-layout  wrap>
+        
+        <v-flex xs12>
+            <v-card class="pt-1 pb-1 pr-1" elevation="3" color="light-blue">
+            <v-layout align-center justify-center row shrink fill-height>
+                <v-flex  xs2>
+                    <v-card flat>
+                        <v-img
+                  :src="xselected_patient.M_PatientPhotoThumb"
+                  :lazy-src="xselected_patient.M_PatientPhotoThumb"
+                  aspect-ratio="1"
+                  width="100%"
+                  class="light-blue"
+                  contain
+                >
+                </v-card>
+                  
+                </v-flex>
+                <v-flex xs10>
+                        <v-card flat>
+                            <v-layout pt-1 pl-2 pb-1 pr-2  row>
+                                <v-flex>
+                                    <v-subheader style="color:black;height:auto;padding:0px"> 
+                                        <h3 style="font-size:x-large" class="font-weight-bold">{{ xselected_patient.T_OrderHeaderLabNumber }}</h3>
+                                        
+                                        <v-flex text-md-right>
+                                            <span @click="callPatient()" v-if="xselected_patient.statusid === '0' || xselected_patient.statusid === '2'" style="font-size:24px;" class="icon-medium-fill-base-small xs1 white--text info"><v-icon dark>volume_up</v-icon></span>
+                                            <span @click="skip()" v-if="xselected_patient.statusid === '1' || xselected_patient.statusid === '3'" style="font-size:24px;" class="icon-medium-fill-base-small xs1 white--text black"><v-icon dark>fast_rewind</v-icon></span>
+                                            <span @click="processNow(xselected_patient.statusid)" v-if="xselected_patient.statusid === '1'" v-bind:class="{ 'warning':xselected_patient.statusid === '1','grey':xselected_patient.statusid !== '1' }" style="font-size:24px;" class="icon-medium-fill-base-small xs1 white--text"><v-icon dark>loop</v-icon></span>
+                                            
+                                        </v-flex>
+                                    </v-subheader>
+                                    
+                                </v-flex>
+                            </v-layout>
+                            <v-layout pl-2 pr-2 row>
+                                <v-flex xs4>
+                                    <v-layout column>
+                                        <v-flex pt-1>
+                                            <v-text-field
+                                                v-model=" xselected_patient.M_PatientNoReg"
+                                                label="PID"
+                                                readonly
+                                                hide-details
+                                            >
+                                            </v-text-field>
+                                        </v-flex>
+                                    </v-layout>
+                                </v-flex>
+                                <v-flex xs8 pl-2>
+                                    <v-layout column>
+                                        <v-flex pt-1 >
+                                            <v-layout row>
+                                                <v-flex xs4>
+                                                    <v-text-field
+                                                        v-model="xselected_patient.patient_dob"
+                                                        label="Tanggal lahir"
+                                                        readonly
+                                                        hide-details
+                                                    >
+                                                    </v-text-field>
+                                                </v-flex>
+                                                <v-flex xs8 pl-1>
+                                                    <v-text-field
+                                                        v-model=" xselected_patient.T_OrderHeaderM_PatientAge"
+                                                        label="Umur"
+                                                        readonly
+                                                        hide-details
+                                                    >
+                                                    </v-text-field>
+                                                </v-flex>
+                                            </v-layout>
+                                            
+                                        </v-flex>
+                                    </v-layout>
+                                </v-flex>
+                            </v-layout>
+                            <v-layout pb-2 pt-1 pl-2 pr-2  row>
+                                        <v-flex xs8>
+                                            <v-text-field
+                                                v-model=" xselected_patient.patient_fullname"
+                                                label="Nama"
+                                                readonly
+                                                hide-details
+                                            >
+                                            </v-text-field>
+                                        </v-flex>
+                                        <v-flex xs4 pl-1>
+                                            <v-text-field
+                                                v-model="xselected_patient.M_PatientDivisi"
+                                                label="Divisi"
+                                                readonly
+                                                hide-details
+                                            >
+                                            </v-text-field>
+                                        </v-flex>
+                                    </v-layout>
+                           </v-card>
+                </v-flex>
+            </v-layout>
+            </v-card>
+        </v-flex>
+         
+    </v-layout>
+        
+
+    <!--<v-card v-if="xselected_patient">
+            <v-layout  row>
+                <v-flex xs12 pa-2>
+                    <v-layout align-center row>
+                        <v-flex xs2>
+                            <v-card>
+                            <v-img
+                                :src="xselected_patient.M_PatientPhotoThumb"
+                                aspect-ratio="1"
+                                class="grey lighten-2 elevation-2"
+                            >
+                            
+                            </v-img>
+                            </v-card>           
+                        </v-flex>
+                        <v-flex xs10 pl-2 pt-1>
+                            <v-card>
+                            <v-layout pa-2 row>
+                                <v-flex>
+                                    <v-subheader style="color:black;height:auto;padding:0px"> 
+                                        <h3 style="font-size:x-large" class="font-weight-bold">{{ xselected_patient.T_OrderHeaderLabNumber }}</h3>
+                                        
+                                        <v-flex text-md-right>
+                                            <span @click="callPatient()" v-if="xselected_patient.statusid === '0' || xselected_patient.statusid === '2'" style="font-size:24px;" class="icon-medium-fill-base-small xs1 white--text info"><v-icon dark>volume_up</v-icon></span>
+                                            <span @click="skip()" v-if="xselected_patient.statusid === '1' || xselected_patient.statusid === '3'" style="font-size:24px;" class="icon-medium-fill-base-small xs1 white--text black"><v-icon dark>fast_rewind</v-icon></span>
+                                            <span @click="processNow(xselected_patient.statusid)" v-if="xselected_patient.statusid === '1'" v-bind:class="{ 'warning':xselected_patient.statusid === '1','grey':xselected_patient.statusid !== '1' }" style="font-size:24px;" class="icon-medium-fill-base-small xs1 white--text"><v-icon dark>loop</v-icon></span>
+                                            
+                                        </v-flex>
+                                    </v-subheader>
+                                    
+                                </v-flex>
+                            </v-layout>
+                            <v-layout pa-2 row wrap>
+                                <v-flex xs4>
+                                    <v-layout column>
+                                        <v-flex pt-1>
+                                            <v-text-field
+                                                v-model=" xselected_patient.M_PatientNoReg"
+                                                label="PID"
+                                                readonly
+                                                hide-details
+                                            >
+                                            </v-text-field>
+                                        </v-flex>
+                                        <v-flex pt-1 >
+                                            <v-text-field
+                                                v-model=" xselected_patient.patient_fullname"
+                                                label="Nama"
+                                                readonly
+                                                hide-details
+                                            >
+                                            </v-text-field>
+                                        </v-flex>
+                                    </v-layout>
+                                </v-flex>
+
+                                <v-flex xs8 pl-2>
+                                    <v-layout column>
+                                        <v-flex pt-1 >
+                                            <v-layout row>
+                                                <v-flex xs4>
+                                                    <v-text-field
+                                                        v-model="xselected_patient.patient_dob"
+                                                        label="Tanggal lahir"
+                                                        readonly
+                                                        hide-details
+                                                    >
+                                                    </v-text-field>
+                                                </v-flex>
+                                                <v-flex xs8 pl-1>
+                                                    <v-text-field
+                                                        v-model=" xselected_patient.T_OrderHeaderM_PatientAge"
+                                                        label="Umur"
+                                                        readonly
+                                                        hide-details
+                                                    >
+                                                    </v-text-field>
+                                                </v-flex>
+                                            </v-layout>
+                                            
+                                        </v-flex>
+
+                                        <v-flex pt-1>
+                                            <v-text-field
+                                                v-model="xselected_patient.M_PatientHP"
+                                                label="HP"
+                                                readonly
+                                                hide-details
+                                            >
+                                            </v-text-field>
+                                        </v-flex>
+                                    </v-layout>
+                                </v-flex>
+                            </v-layout>
+                            <v-card>
+                        </v-flex>
+                    </v-layout>
+                </v-flex>
+            </v-layout>  -->      
+    </div>
+</template>
+
+<style scoped>
+
+</style>
+
+<script>
+module.exports = {
+    data: () => ({
+          
+    }),
+    computed: {
+        selected_location: {
+      get() {
+        return this.$store.state.samplecall.selected_location;
+      },
+      set(val) {
+        this.$store.commit("samplecall/update_selected_location", val);
+        // this.searchPatient()
+      },
+    },
+        xselected_patient:{
+            get() {
+                return this.$store.state.samplecall.selected_patient
+            },
+            set(val) {
+                this.$store.commit("samplecall/update_selected_patient",val)
+            }
+        },
+        xdialogaction:{
+            get() {
+                return this.$store.state.samplecall.dialog_action
+            },
+            set(val) {
+                this.$store.commit("samplecall/update_dialog_action",val)
+            }
+        },
+        xmsgaction:{
+            get() {
+                return this.$store.state.samplecall.msg_action
+            },
+            set(val) {
+                this.$store.commit("samplecall/update_msg_action",val)
+            }
+        }
+    },
+    methods : {
+        closeDialogAction(){
+            var act = this.$store.state.samplecall.act
+            var sample  = this.$store.state.samplecall.selected_sampletype
+            var status = 1
+            if(act === 'process'){
+                status = 3
+            }
+            if(act === 'skip'){
+                status = 2
+            }
+            if(act === 'samplingprocess'){
+                status = 3
+            }
+            if(act === 'samplingdone'){
+                status = 4
+            }
+
+            let patients = this.$store.state.samplecall.patients
+            let last_idx = patients.length-1
+            //console.log(last_idx)
+            let last_patient = patients[last_idx]
+            //console.log(last_patient)
+           
+            if(act != 'addnewlabel'){
+                var patient = this.$store.state.samplecall.selected_patient
+                var lastid = this.$store.state.samplecall.last_id
+                this.$store.dispatch("samplecall/doaction",{
+                    act:act,
+                    id:patient.T_OrderHeaderID,
+                    xdate:this.$store.state.samplecall.start_date,
+                    name:this.$store.state.samplecall.name,
+                    nolab:this.$store.state.samplecall.nolab,
+                    stationid: patient.T_SampleStationID,
+                    statusid:this.$store.state.samplecall.selected_status.id,
+                    orderlocationid:patient.order_location_id,
+                    antritime:patient.antri_time,
+                    skiptime:patient.skip_time,
+                    last_skiptime:last_patient.skip_time,
+                    statusnextid : status,
+                    sample:sample,
+                    lastid:lastid,
+                    locationid: this.selected_location.locationID,
+                    companyid: this.$store.state.samplecall.selected_company.id,
+                    staff:this.$store.state.samplecall.staff
+                })
+            }
+            else{
+                var patient = this.$store.state.samplecall.selected_patient
+                var lastid = this.$store.state.samplecall.last_id
+                this.$store.dispatch("samplecall/addnewlabel",{
+                    act:act,
+                    id:patient.T_OrderHeaderID,
+                    xdate:this.$store.state.samplecall.start_date,
+                    name:this.$store.state.samplecall.name,
+                    nolab:this.$store.state.samplecall.nolab,
+                    stationid: patient.T_SampleStationID,
+                    statusid:this.$store.state.samplecall.selected_status.id,
+                    orderlocationid:patient.order_location_id,
+                    antritime:patient.antri_time,
+                    skiptime:patient.skip_time,
+                    last_skiptime:last_patient.skip_time,
+                    statusnextid : status,
+                    sample:this.$store.state.samplecall.selected_sampletype,
+                    lastid:lastid,
+                    locationid: this.selected_location.locationID,
+                    companyid: this.$store.state.samplecall.selected_company.id,
+                    staff:this.$store.state.samplecall.staff
+                })
+            }
+            
+            
+        },
+        callPatient(){
+            //var patient = this.$store.state.samplecall.selected_patient
+            //var msg = "Anda yakin akan melakukan panggilan kepada pasien "+patient.patient_fullname+" ? "
+            //this.$store.commit("samplecall/update_msg_action",msg)
+            this.$store.commit("samplecall/update_act",'call')
+            this.closeDialogAction()
+            //this.$store.commit("samplecall/update_dialog_action",true)
+        },
+        processNow(value){
+            if(value === '1'){
+                //var patient = this.$store.state.samplecall.selected_patient
+                //var msg = "Anda yakin akan merubah status <span style='color:ff5252;font-weight:bold'>PROCESS</span> untuk pasien "+patient.patient_fullname+" ? "
+                //this.$store.commit("samplecall/update_msg_action",msg)
+                this.$store.commit("samplecall/update_act",'process')
+                this.closeDialogAction()
+                //this.$store.commit("samplecall/update_dialog_action",true)
+            }
+            
+        },
+        skip(){
+            //var patient = this.$store.state.samplecall.selected_patient
+            //var msg = "Anda yakin akan merubah status <span style='color:ff5252;font-weight:bold'>SKIP</span> untuk pasien "+patient.patient_fullname+" ? "
+            //this.$store.commit("samplecall/update_msg_action",msg)
+            this.$store.commit("samplecall/update_act",'skip')
+            this.closeDialogAction()
+            //this.$store.commit("samplecall/update_dialog_action",true)
+        },
+        patient_photo(){
+            var photo = "https://www.sgm-inc.com/wp-content/uploads/2014/06/no-profile-male-img.gif"
+            if(this.xselected_patient.M_PatientPhoto){
+                photo  = this.xselected_patient.M_PatientPhoto
+            }
+            console.log(photo)
+            return photo
+        }
+    }
+}
+</script>

test/vuex/cpone-sample-lab/components/oneSampleCallSOList.vue

@@ -0,0 +1,477 @@
+<template>
+  <v-layout class="fill-height" column>
+    <v-dialog v-model="dialogsuccess" persistent max-width="290">
+      <v-card>
+        <v-card-title color="success" class="headline">Berhasil !</v-card-title>
+        <v-card-text>
+          {{ msgsuccess }}
+        </v-card-text>
+        <v-card-actions>
+          <v-spacer></v-spacer>
+          <v-btn color="green darken-1" flat @click="closeDialogSuccess"
+            >OK</v-btn
+          >
+        </v-card-actions>
+      </v-card>
+    </v-dialog>
+
+    <v-card>
+      <v-layout row>
+        <v-flex xs12 pl-2 pr-2 pt-2 pb-2>
+          <v-data-table
+            :headers="headers"
+            :items="patients"
+            :loading="isLoading"
+            hide-actions
+            class="elevation-1 fixed_header"
+          >
+            <template slot="items" slot-scope="props">
+              <td
+                style="width: 10%"
+                class="text-xs-center pa-2"
+                v-bind:class="{
+                  'amber lighten-4': isSelected(props.item),
+                  'teal white--text': props.item.coming === 'Y',
+                  amber: props.item.iscito === 'Y',
+                }"
+                @click="selectMe(props.item)"
+              >
+                {{ format_date(props.item.T_OrderHeaderDate) }}
+              </td>
+              <td
+                style="width: 10%"
+                class="text-xs-center pa-2"
+                v-bind:class="{
+                  'amber lighten-4': isSelected(props.item),
+                  'teal white--text': props.item.coming === 'Y',
+                  amber: props.item.iscito === 'Y',
+                }"
+                @click="selectMe(props.item)"
+              >
+                <p class="mb-0 font-weight-black caption">
+                  {{ props.item.T_OrderHeaderLabNumber }}
+                </p>
+                
+              </td>
+              <td
+                style="width: 15%"
+                class="text-xs-center pa-2"
+                v-bind:class="{
+                  'amber lighten-4': isSelected(props.item),
+                  'teal white--text': props.item.coming === 'Y',
+                  amber: props.item.iscito === 'Y',
+                }"
+                @click="selectMe(props.item)"
+              >
+                {{ props.item.M_CompanyName }}
+              </td>
+              <td
+                style="width: 20%"
+                class="text-xs-center pa-2"
+                v-bind:class="{
+                  'amber lighten-4': isSelected(props.item),
+                  'teal white--text': props.item.coming === 'Y',
+                  amber: props.item.iscito === 'Y',
+                }"
+                @click="selectMe(props.item)"
+              >
+                {{ props.item.patient_fullname }}
+              </td>
+              <td
+                style="width: 10%"
+                class="text-xs-center pa-2"
+                v-bind:class="{
+                  'amber lighten-4': isSelected(props.item),
+                  'teal white--text': props.item.coming === 'Y',
+                  amber: props.item.iscito === 'Y',
+                }"
+                @click="selectMe(props.item)"
+              >
+                {{ props.item.status }}
+              </td>
+            </template>
+          </v-data-table>
+        </v-flex>
+      </v-layout>
+    </v-card>
+    <one-dialog-info
+      :status="opendialoginfo"
+      :msg="msginfo"
+      @close-dialog-info="closeDialogInfo()"
+    ></one-dialog-info>
+    <one-dialog-alert
+      :status="openalertconfirmation"
+      :msg="msgalertconfirmation"
+      @forget-dialog-alert="forgetAlertConfirmation()"
+      @close-dialog-alert="closeAlertConfirmation()"
+    ></one-dialog-alert>
+  </v-layout>
+</template>
+
+<style scoped>
+.searchbox .v-input.v-text-field .v-input__slot {
+  min-height: 60px;
+}
+.searchbox .v-btn {
+  min-height: 60px;
+}
+table,
+td,
+th {
+  border: 0.5px solid rgba(0, 0, 0, 0.12);
+  text-align: left;
+}
+
+table {
+  border-collapse: collapse;
+  width: 100%;
+}
+table.v-table tbody td,
+table.v-table tbody th {
+  height: 40px;
+}
+
+table.v-table thead tr {
+  height: 40px;
+}
+
+.fixed_header tbody {
+  display: block;
+  max-height: 630px;
+  overflow-y: scroll;
+}
+
+.fixed_header thead,
+tbody tr {
+  display: table;
+  width: 100%;
+  table-layout: fixed;
+}
+</style>
+
+<script>
+module.exports = {
+  components: {
+    "one-dialog-info": httpVueLoader("../../common/oneDialogInfo.vue"),
+    "one-dialog-alert": httpVueLoader("../../common/oneDialogAlert.vue"),
+  },
+  mounted() {
+    //this.$store.dispatch("samplecall/getinitdata")
+    this.$store.dispatch("samplecall/getstationstatus", {
+      xdate: this.$store.state.samplecall.start_date,
+      name: this.name,
+      nolab: this.nolab,
+      stationid: this.xselectedstation.id,
+      statusid: this.xselectedstatus.id,
+      companyid: this.selected_company.id,
+      // current_page:1,
+      lastid: -1,
+    });
+  },
+  methods: {
+    formatDate(date) {
+      if (!date) return null;
+
+      const [year, month, day] = date.split("-");
+      return `${day}-${month}-${year}`;
+    },
+    deFormatedDate(date) {
+      if (!date) return null;
+
+      const [day, month, year] = date.split("-");
+      return `${year}-${month.padStart(2, "0")}-${day.padStart(2, "0")}`;
+    },
+    format_date(d) {
+      return moment(d).format("DD.MM.YYYY");
+    },
+    isSelected(p) {
+      if (p.coming === "Y" || p.iscito === "Y") return false;
+      else
+        return (
+          p.T_OrderHeaderID ==
+          this.$store.state.samplecall.selected_patient.T_OrderHeaderID
+        );
+    },
+    searchPatient() {
+      this.$store.commit("samplecall/update_last_id", -1);
+      this.$store.dispatch("samplecall/search", {
+        xdate: this.$store.state.samplecall.start_date,
+        name: this.name,
+        nolab: this.nolab,
+        stationid: this.xselectedstation.id,
+        statusid: this.xselectedstatus.id,
+        companyid: this.selected_company.id,
+        locationid: this.selected_location.locationID,
+        //current_page:1,
+        lastid: -1,
+      });
+    },
+    selectMe(pat) {
+      if (this.$store.state.samplecall.no_save == 0) {
+        var patients = this.$store.state.samplecall.patients;
+        this.$store.commit("samplecall/update_selected_patient", pat);
+        var idx = _.findIndex(patients, function (o) {
+          return o.T_OrderHeaderID == pat.T_OrderHeaderID;
+        });
+        this.$store.commit("samplecall/update_last_id", idx);
+        this.$store.dispatch("samplecall/getsampletypes", {
+          orderid: pat.T_OrderHeaderID,
+          stationid: pat.T_SampleStationID,
+          statusid: pat.statusid,
+        });
+      } else {
+        this.$store.commit("samplecall/update_open_alert_confirmation", true);
+      }
+    },
+    closeAlertConfirmation() {
+      this.$store.commit("samplecall/update_open_alert_confirmation", false);
+    },
+    forgetAlertConfirmation() {
+      this.$store.commit("samplecall/update_no_save", 0);
+      this.$store.commit("samplecall/update_open_alert_confirmation", false);
+    },
+    updateAlert_success(val) {
+      this.$store.commit("samplecall/update_alert_success", val);
+    },
+    setNewPatient() {},
+    closeDialogSuccess() {
+      let arrPatient = this.$store.state.samplecall.patients;
+      var idx = _.findIndex(
+        arrPatient,
+        (item) => item.M_PatientID === this.$store.state.samplecall.last_id
+      );
+      console.log(idx);
+      var xcur_page = 1;
+
+      this.$store.dispatch("samplecall/search", {
+        name: this.name,
+        nolab: this.nolab,
+        stationid: this.xselectedstation.id,
+        statusid: this.xselectedstatus.id,
+        locationid: this.selected_location.locationID,
+        lastid: idx,
+      });
+
+      this.$store.commit("samplecall/update_dialog_success", false);
+    },
+    closeDialogInfo() {
+      this.$store.commit("samplecall/update_open_dialog_info", false);
+    },
+    thr_search_company: _.debounce(function () {
+      this.$store.dispatch("samplecall/searchcompany", this.search_company);
+    }, 2000),
+  },
+  computed: {
+    xdatestart: {
+      get() {
+        return this.$store.state.samplecall.start_date;
+      },
+      set(val) {
+        this.$store.commit("samplecall/update_start_date", val);
+        //this.searchTransaction()
+      },
+    },
+    filterComputedDateFormattedStart() {
+      return this.formatDate(this.xdatestart);
+    },
+    dialogsuccess: {
+      get() {
+        return this.$store.state.samplecall.dialog_success;
+      },
+      set(val) {
+        this.$store.commit("samplecall/update_dialog_success", val);
+      },
+    },
+    msgsuccess() {
+      return this.$store.state.samplecall.msg_success;
+    },
+    snackbar: {
+      get() {
+        return this.$store.state.samplecall.alert_success;
+      },
+      set(val) {
+        this.$store.commit("samplecall/update_alert_success", val);
+      },
+    },
+    isLoading() {
+      return this.$store.state.samplecall.search_status == 1;
+    },
+    xstations() {
+      return this.$store.state.samplecall.stations;
+    },
+    xselectedstation: {
+      get() {
+        return this.$store.state.samplecall.selected_station;
+      },
+      set(val) {
+        this.$store.commit("samplecall/update_selected_station", val);
+        this.$store.dispatch("samplecall/getLocation", val.id);
+        // this.searchPatient()
+      },
+    },
+    xstatuses() {
+      return this.$store.state.samplecall.statuses;
+    },
+    xselectedstatus: {
+      get() {
+        return this.$store.state.samplecall.selected_status;
+      },
+      set(val) {
+        this.$store.commit("samplecall/update_selected_status", val);
+        // this.searchPatient()
+      },
+    },
+    patients() {
+      return this.$store.state.samplecall.patients;
+    },
+    openalertconfirmation: {
+      get() {
+        return this.$store.state.samplecall.open_alert_confirmation;
+      },
+      set(val) {
+        this.$store.commit("samplecall/update_open_alert_confirmation", val);
+      },
+    },
+    curr_page: {
+      get() {
+        return this.$store.state.samplecall.current_page;
+      },
+      set(val) {
+        this.$store.commit("samplecall/update_current_page", val);
+        this.$store.dispatch("samplecall/search", {
+          name: this.name,
+          nolab: this.nolab,
+          stationid: this.xselectedstation.id,
+          statusid: this.xselectedstatus.id,
+          current_page: val,
+          locationid: this.selected_location.locationID,
+          lastid: idx,
+        });
+      },
+    },
+    xtotal_page: {
+      get() {
+        return this.$store.state.samplecall.total_page;
+      },
+      set(val) {
+        this.$store.commit("samplecall/update_total_page", val);
+      },
+    },
+    opendialoginfo: {
+      get() {
+        return this.$store.state.samplecall.open_dialog_info;
+      },
+      set(val) {
+        this.$store.commit("samplecall/update_open_dialog_info", false);
+      },
+    },
+    msginfo() {
+      return this.$store.state.samplecall.msg_info;
+    },
+    name: {
+      get() {
+        return this.$store.state.samplecall.name;
+      },
+      set(val) {
+        this.$store.commit("samplecall/update_name", val);
+      },
+    },
+    nolab: {
+      get() {
+        return this.$store.state.samplecall.nolab;
+      },
+      set(val) {
+        this.$store.commit("samplecall/update_nolab", val);
+        //this.searchPatient()
+      },
+    },
+    xcompanies() {
+      return this.$store.state.samplecall.companies;
+    },
+    selected_company: {
+      get() {
+        return this.$store.state.samplecall.selected_company;
+      },
+      set(val) {
+        this.$store.commit("samplecall/update_selected_company", val);
+        // this.searchPatient()
+      },
+    },
+    selected_location: {
+      get() {
+        return this.$store.state.samplecall.selected_location;
+      },
+      set(val) {
+        this.$store.commit("samplecall/update_selected_location", val);
+        // this.searchPatient()
+      },
+    },
+    locations() {
+      return this.$store.state.samplecall.locations;
+    },
+  },
+  watch: {
+    search_company(val, old) {
+      if (val == old) return;
+      if (!val) return;
+      if (val.length < 1) return;
+      if (this.$store.state.samplecall.update_autocomplete_status == 1) return;
+      this.thr_search_company();
+    },
+  },
+  data() {
+    return {
+      msgalertconfirmation:
+        "Perubahan yang telah dilakukan belum disimpan dong !",
+      items: [],
+      search_company: "",
+      menufilterdatestart: false,
+      //isLoading: false,
+      page: 1,
+      headers: [
+        {
+          text: "TANGGAL",
+          align: "center",
+          sortable: false,
+          value: "mr",
+          width: "10%",
+          class: "pa-2 blue lighten-3 white--text",
+        },
+        {
+          text: "NO REG",
+          align: "center",
+          sortable: false,
+          value: "mr",
+          width: "10%",
+          class: "pa-2 blue lighten-3 white--text",
+        },
+        {
+          text: "KEL. PELANGGAN",
+          align: "center",
+          sortable: false,
+          value: "lab",
+          width: "15%",
+          class: "pa-2 blue lighten-3 white--text",
+        },
+        {
+          text: "NAMA",
+          align: "center",
+          sortable: false,
+          value: "name",
+          width: "20%",
+          class: "pa-2 blue lighten-3 white--text",
+        },
+
+        {
+          text: "STATUS",
+          align: "center",
+          sortable: false,
+          value: "status",
+          width: "10%",
+          class: "pa-2 blue lighten-3 white--text",
+        },
+      ],
+    };
+  },
+};
+</script>

test/vuex/cpone-sample-lab/cpone-resultentry-so-others/api/email.js

@@ -0,0 +1,22 @@
+const URL = "/one-api/mockup/resultentrysoothers-v16/";
+
+
+export async function save(prm) {
+    try {
+        var resp = await axios.post(URL + 'email/save', 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
+        };
+    }
+}
+

test/vuex/cpone-sample-lab/cpone-resultentry-so-others/api/sample.js

@@ -0,0 +1,433 @@
+const URL = "/one-api/mockup/resultentrysoothers-cpone/";
+
+
+export async function save_signature(prm) {
+    try {
+        var resp = await axios.post(URL + 'resultentry/save_signature', 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 get6mwt(prm) {
+    try {
+        var resp = await axios.post(URL + 'resultentry/get6mwt', 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(prm) {
+    try {
+        var resp = await axios.post(URL + 'resultentry/search', 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_bynolab(prm) {
+    try {
+        var resp = await axios.post(URL + 'resultentry/search_bynolab', 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 getdoctorcouriers(prm) {
+    try {
+        var resp = await axios.post(URL + 'resultentry/getdoctorcouriers', 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 savedoctor(prm) {
+    try {
+        var resp = await axios.post(URL + 'resultentry/savedoctor', 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 doaction(prm) {
+    try {
+        var resp = await axios.post(URL + 'resultentry/doaction', 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 getdoctoraddress(prm) {
+    try {
+        var resp = await axios.post(URL + 'resultentry/getdoctoraddress', 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 getordersamples(prm) {
+    try {
+        var resp = await axios.post(URL + 'resultentry/getordersamples', 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 printcount(prm) {
+    try {
+        var resp = await axios.post(URL + 'resultentry/printcount', 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 getrstbylang(prm) {
+    try {
+        var resp = await axios.post(URL + 'resultentry/getrstbylang', 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 save(prm) {
+    try {
+        var resp = await axios.post(URL + 'resultentry/save', 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 deletetrx(prm) {
+    try {
+        var resp = await axios.post(URL + 'resultentry/deletetrx', 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 getgroups(prm) {
+    try {
+        var resp = await axios.post(URL + 'resultentry/getgroups', 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 saveresult(prm) {
+    try {
+        var resp = await axios.post(URL + 'resultentry/saveresult', 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 savefisik(prm) {
+    try {
+        var resp = await axios.post(URL + 'resultentry/savefisik', 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 save6mwt(prm) {
+    try {
+        var resp = await axios.post(URL + 'resultentry/save6mwt', 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 gettemplate(prm) {
+    try {
+        var resp = await axios.post(URL + 'resultentry/gettemplate', 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 save_flagprint(prm) {
+    try {
+        var resp = await axios.post(URL + 'resultentry/save_flagprint', 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 getumum(prm) {
+    try {
+        var resp = await axios.post(URL + 'resultentry/getumum', 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 searchcompany(token,prm) {
+    try {
+        var resp = await axios.post(URL + 'resultentry/searchcompany',{token:token,search: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 searchdoctor(prm) {
+    try {
+        var resp = await axios.post(URL + 'resultentry/searchdoctor', 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
+        };
+    }
+}

test/vuex/cpone-sample-lab/cpone-resultentry-so-others/components/oneResultEntrySoList.vue

@@ -0,0 +1,612 @@
+<template>
+   <v-layout  class="fill-height" column>
+      <v-dialog v-model="dialogsuccess" persistent  max-width="350">
+        <v-card>
+            <v-card-title color="success"  class="headline">Berhasil !</v-card-title>
+            <v-card-text v-html="msgsuccess">
+            </v-card-text>
+            <v-card-actions>
+            <v-spacer></v-spacer>
+            <v-btn color="green darken-1" flat @click="closeDialogSuccess">OK</v-btn>
+            </v-card-actions>
+        </v-card>
+      </v-dialog>
+      <v-card   class="mb-1 pa-2 searchbox">
+         <v-layout row >
+            <v-flex xs2>
+               <v-menu class="pr-2"
+                  v-model="menufilterdatestart"
+                  :close-on-content-click="false"
+                  :nudge-right="40"
+                  lazy
+                  transition="scale-transition"
+                  offset-y
+                  full-width
+                  max-width="290px"
+                  min-width="290px"
+                  >
+                  <template v-slot:activator="{ on }">
+                     <v-text-field
+                        class="ma-1"
+                     v-model="filterComputedDateFormattedStart"
+                     label="Tgl. Awal"
+                     outline
+                     hide-details
+                     style="font-size:11px"
+                     readonly
+                     v-on="on"
+                     @blur="date = deFormatedDate(filterComputedDateFormattedStart)"
+                     ></v-text-field>
+                  </template>
+                  <v-date-picker v-model="xdatestart" no-title @input="menufilterdatestart = false"></v-date-picker>
+               </v-menu>
+            </v-flex>
+            <v-flex xs2>
+               <v-menu class="pl-2"
+                  v-model="menufilterdateend"
+                  :close-on-content-click="false"
+                  :nudge-right="40"
+                  lazy
+                  transition="scale-transition"
+                  offset-y
+                  full-width
+                  max-width="290px"
+                  min-width="290px"
+                  >
+                  <template v-slot:activator="{ on }">
+                     <v-text-field
+                     class="ma-1"
+                     v-model="filterComputedDateFormattedEnd"
+                     label="Tgl. Akhir"
+                     outline
+                     readonly
+                     style="font-size:11px"
+                     hide-details
+                     v-on="on"
+                     @blur="date = deFormatedDate(filterComputedDateFormattedEnd)"
+                     ></v-text-field>
+                  </template>
+                  <v-date-picker v-model="xdateend" no-title @input="menufilterdateend = false"></v-date-picker>
+               </v-menu>
+            </v-flex>
+            <v-flex xs3>
+               <v-text-field class="ma-1"
+                  label="Cari..."
+                  placeholder="Nama / No Reg"
+                  outline
+                  style="font-size:11px"
+                  v-model="xnamelab"
+                  v-on:keyup.enter="searchTransaction"
+                  hide-details
+               ></v-text-field>
+            </v-flex>
+            <v-flex xs5>
+               <v-layout align-center row>
+                  <v-flex class="text-xs-center" xs3>
+                     <span  title="tidak termasuk" v-if="switch_exclude" @click="switch_exclude = !switch_exclude"  class="icon-medium-fill-base-small xs1 white--text red"><v-icon dark>assignment_late</v-icon></span>
+                     <span  title="termasuk" v-if="!switch_exclude" @click="switch_exclude = !switch_exclude"  class="icon-medium-fill-base-small xs1 white--text blue"><v-icon dark>assignment_turned_in</v-icon></span>
+                  </v-flex>
+                  <v-flex xs9>
+                     <v-select
+                            :search-input.sync="search_company"
+                            autocomplete
+                            v-model="selected_company"
+                            :items="xcompanies"
+                             outline="outline"
+                            style="font-size:12px;"
+                            auto-select-first
+                            item-text = "name"
+                            return-object
+                            style="font-size:11px"
+                            label="Corporate"
+                            hide-details
+                            class="ma-1"
+                            >
+                            <template
+                                slot="item"
+                                slot-scope="{ item }"
+                                >
+                                <v-list-tile-content>
+                                    <v-list-tile-title v-text="item.name"></v-list-tile-title>
+                                </v-list-tile-content>
+                            </template>
+                        </v-select>
+                    
+                  </v-flex>
+               </v-layout>
+            </v-flex>
+               <!--<v-select class="xs3 mini-select ma-1" :items="xstations" 
+                  item-text="name"
+                  return-object
+                  v-model="xselectedstation"
+                  label="Status" outline   hide-details></v-select>-->
+            <!--<v-btn class="xs3 ma-1" color="success"  @click="searchTransaction" >Cari</v-btn>-->
+           <!-- <span @click="searchTransaction"  class="icon-medium-fill-base xs1 white--text success iconsearch-search"></span>-->
+         </v-layout>
+      </v-card>
+      <v-card >
+         <v-layout align-center row>
+            <v-flex xs12 pl-2 pr-2 pt-2 pb-2>
+               <v-data-table 
+                  :headers="headers" 
+                  :items="xtransactions"
+                  :loading="isLoading"
+                  hide-actions
+                   class="elevation-1">
+                  <template slot="items" slot-scope="props">
+                     <td class="text-xs-left pa-2" v-bind:class="{'amber lighten-4':isSelected(props.item),'amber':props.item.iscito === 'Y'}" @click="selectMe(props.item)">
+                        <p class="font-weight-black mb-0">{{ props.item.ordernumber }}</p>
+                        <p style="color:#800000" class="caption mb-1 font-weight-bold">{{props.item.test_name}}</p>
+                     </td>
+                     <td class="text-xs-left pa-2" v-bind:class="{'amber lighten-4':isSelected(props.item),'amber':props.item.iscito === 'Y'}" @click="selectMe(props.item)">{{ props.item.orderdate}}</td>
+                     <td class="text-xs-left pa-2" v-bind:class="{'amber lighten-4':isSelected(props.item),'amber':props.item.iscito === 'Y'}" @click="selectMe(props.item)">
+                        <p class="mb-0">{{ props.item.patient_fullname}}</p>
+                        <p style="font-size:10px!important;font-weight:bold" class="blue--text caption">{{ props.item.company_name}}</p>
+                     </td>
+                     <td class="text-xs-center pa-2" v-bind:class="{'amber lighten-4':isSelected(props.item),'amber':props.item.iscito === 'Y'}" @click="selectMe(props.item)">{{ props.item.status_name}}</td>
+                  </template>
+               </v-data-table>
+               <v-divider></v-divider>
+               <v-pagination
+                  style="margin-top:10px;margin-bottom:5px"
+                  v-model="curr_page"
+                  :length="xtotal_page"
+               
+               
+               ></v-pagination>
+            </v-flex>
+         </v-layout>
+      </v-card>
+       <one-dialog-alert :status="openalertconfirmation" :msg="msgalertconfirmation" @forget-dialog-alert="forgetAlertConfirmation()" @close-dialog-alert="closeAlertConfirmation()"></one-dialog-alert>
+       <one-dialog-info :status="opendialoginfo" :msg="msginfo" @close-dialog-info="closeDialogInfo()"></one-dialog-info>
+   </v-layout>
+</template>
+
+<style scoped>
+.searchbox .v-input.v-text-field .v-input__slot{
+   min-height:60px;
+}
+.searchbox .v-btn {
+   min-height:60px;
+}
+table.v-table tbody td,table.v-table tbody th {
+   height: 40px;
+}
+
+table.v-table thead tr {
+   height: 40px;
+}
+
+</style>
+
+<script>
+module.exports = {
+components : {
+      'one-dialog-info':httpVueLoader('../../common/oneDialogInfo.vue'),
+      'one-dialog-alert':httpVueLoader('../../common/oneDialogAlert.vue')
+   },
+   mounted() {
+
+      var prm = {
+         startdate:this.xdatestart,
+         enddate: this.xdateend,
+         search:this.xnamelab,
+         stationid:this.xselectedstation.id,
+         companyid:this.selected_company.id,
+         switch_exclude:this.switch_exclude,
+         groupid:this.$store.state.sample.select_item_group.id,
+         subgroupid:this.$store.state.sample.select_item_subgroup.id,
+         current_page:1,
+         lastid:-1
+      }
+
+      var url_string = window.location.href
+      var url = new URL(url_string);
+      var id = url.searchParams.get("id")
+      var stat_id = url.searchParams.get("stat")
+      var loc_id = url.searchParams.get("loc")
+      var type = url.searchParams.get("type")
+      if (id) {
+         this.$store.commit("sample/update_search_lab_no",id)
+         this.$store.commit("sample/update_search_type",type)  
+         this.$store.commit("sample/update_station_id",stat_id) 
+         this.$store.commit("sample/update_location_id",loc_id) 
+         this.$store.dispatch("sample/search_bynolab")
+      }else{
+         this.$store.dispatch("sample/search",prm)
+      }
+      
+      
+   },
+   methods : {
+      formatDate (date) {
+         if (!date) return null
+
+         const [year, month, day] = date.split('-')
+         return `${day}-${month}-${year}`
+      },
+      deFormatedDate (date) {
+          if (!date) return null
+
+         const [ day,month, year] = date.split('-')
+         return `${year}-${month.padStart(2, '0')}-${day.padStart(2, '0')}`
+      },
+      isSelected(p) {
+         return p.re_id == this.$store.state.sample.selected_transaction.re_id
+         console.log(p.re_id)
+      },
+      searchTransaction() {
+         this.$store.commit("sample/update_last_id",-1)
+         this.$store.commit("sample/update_current_page",1)
+         this.$store.dispatch("sample/search",{
+            startdate:this.xdatestart,
+            enddate: this.xdateend,
+            search:this.xnamelab,
+            companyid:this.selected_company.id,
+            switch_exclude:this.switch_exclude,
+            stationid:this.xselectedstation.id,
+            groupid:this.$store.state.sample.select_item_group.id,
+            subgroupid:this.$store.state.sample.select_item_subgroup.id,
+            current_page:1,
+            lastid:-1
+         })
+      },
+      selectMe(trx) {
+         if(this.$store.state.sample.no_save == 0 ){
+            var trxs = this.xtransactions
+            var idx = _.findIndex(trxs, function(o) { return o.re_id === trx.re_id })
+            this.$store.commit("sample/update_last_id",trx.re_id)
+            this.$store.commit("sample/update_selected_transaction",trx)
+             this.$store.commit("sample/update_sellang",{id:'1',name:'Bahasa Indonesia',code:'INA'})
+            if(trx.status_name !== 'BARU' || trx.status !== 'NEW')
+               this.$store.commit("sample/update_cantedit",true)
+            else
+               this.$store.commit("sample/update_cantedit",false)
+               
+            this.$store.commit("sample/update_act",'edit')
+            if(trx.details.length > 0 ){
+                  this.$store.commit("sample/update_details", trx.details)
+                  console.log("before")
+                  console.log(trx.details[0].template_name)
+                  if(trx.details[0].template_name === 'Fisik Umum' || trx.details[0].template_name === 'Fisik Umum K3' || trx.details[0].template_name === 'Fisik Umum Konsul'){
+                     console.log(trx.details[0].template_name)
+                     if(trx.details[0].template_name === 'Fisik Umum')
+                        this.$store.commit("sample/update_tabs_fisik",[{id:1,name:'RIWAYAT'},{id:2,name:'FISIK'}])
+                     if(trx.details[0].template_name === 'Fisik Umum K3')
+                        this.$store.commit("sample/update_tabs_fisik",[{id:1,name:'RIWAYAT'},{id:2,name:'FISIK'},{id:3,name:'PAJANAN'}])
+                     if(trx.details[0].template_name === 'Fisik Umum Konsul')
+                        this.$store.commit("sample/update_tabs_fisik",[{id:1,name:'RIWAYAT'},{id:2,name:'FISIK'},{id:3,name:'KONSULTASI'}])
+                     var prm = trx.details[0]
+                     prm.act = trx.details[0].template_name
+                     prm.language_id = this.$store.state.sample.sellang.id
+                     prm.language_name = this.$store.state.sample.sellang.name
+                     this.$store.dispatch("sample/getumum",prm)
+                    // this.generateRiwayatRow()
+                  }
+                  else if(trx.details[0].template_name === '6MWT' ){
+                     console.log(trx.details[0].template_name)
+                     var prm = trx.details[0]
+                     prm.language_id = this.$store.state.sample.sellang.id
+                     prm.language_name = this.$store.state.sample.sellang.name
+                     this.$store.dispatch("sample/get6mwt",prm)
+                    // this.generateRiwayatRow()
+                  }
+                  else{
+                     var prm = {
+                                 selected_trx:trx,
+                                 trx:trx.details[0],
+                                 lang:this.$store.state.sample.sellang,
+                                 idx:0,
+                                 detail:trx.details[0]
+                           }
+                     this.$store.dispatch("sample/getrstbylang",prm)
+                  }
+            }
+            else{
+                this.$store.commit("sample/update_details", [])
+               this.$store.commit("sample/update_data_6mwt", [])
+            }
+         }else{
+            this.$store.commit("sample/update_open_alert_confirmation",true)
+         }
+      },
+      closeAlertConfirmation(){
+          this.$store.commit("sample/update_open_alert_confirmation",false)
+      },
+      forgetAlertConfirmation(){
+          this.$store.commit("sample/update_no_save",0)
+          this.$store.commit("sample/update_open_alert_confirmation",false)
+      },
+      updateAlert_success(val){
+         this.$store.commit("sample/update_alert_success",val)
+      },
+      setNewTransaction(){
+         this.$store.commit("sample/update_selected_transaction",{})
+         this.$store.commit("sample/update_details",[])
+         this.$store.commit("sample/update_selected_detail",{})
+         this.$store.commit("sample/update_selected_doctor",{})
+         this.$store.commit("sample/update_selected_doctor_address",{})
+         this.$store.commit("sample/update_selected_courier",{})
+         this.$store.commit("sample/update_trx_date",moment(new Date()).format('YYYY-MM-DD'))
+         this.$store.commit("sample/update_trx_note",'')
+         this.$store.commit("sample/update_act",'new')
+      },
+      closeDialogSuccess(){
+         let arrtrx = this.$store.state.sample.transactions
+         //var idx = _.findIndex(arrtrx, item => item.re_id === this.$store.state.sample.last_id)
+        // console.log(idx)
+         this.$store.dispatch("sample/search",{
+            startdate:this.xdatestart,
+            enddate: this.xdateend,
+            search:this.xnamelab,
+            companyid:this.selected_company.id,
+            switch_exclude:this.switch_exclude,
+            stationid:this.xselectedstation.id,
+            groupid:this.$store.state.sample.select_item_group.id,
+            subgroupid:this.$store.state.sample.select_item_subgroup.id,
+            lastid:this.$store.state.sample.last_id
+         })
+         this.$store.commit("sample/update_dialog_success",false)
+      },
+      closeDialogInfo(){
+            this.$store.commit("sample/update_open_dialog_info",false)
+      },
+      selectgroup(value){
+         this.selected_itemgroup = value
+      },
+      selectsubgroup(value){
+         this.selected_itemsubgroup = value
+      },
+      generateRiwayatRow(){
+         var riwayats = this.$store.state.sample.riwayats.details
+         var row_riwayats = []
+         var rows = []
+         riwayats.forEach(function(item,index){
+            rows.push(item)
+            if(index%2 === 0)
+               row_riwayats.push(rows)
+         })
+         this.$store.commit("sample/update_riwayats_row",row_riwayats)
+      },
+      thr_search_company: _.debounce(function() {
+         this.$store.dispatch("sample/searchcompany", this.search_company)
+      }, 2000)
+   },
+   computed: {
+      search_lab_no(){
+         return this.$store.state.sample.search_lab_no
+      },
+      selected_company: {
+         get() {
+            return this.$store.state.sample.selected_company
+         },
+         set(val) {
+            this.$store.commit("sample/update_selected_company",val)
+            this.searchTransaction()
+         }
+      },
+      switch_exclude: {
+         get() {
+            return this.$store.state.sample.switch_exclude
+         },
+         set(val) {
+            this.$store.commit("sample/update_switch_exclude",val)
+            this.searchTransaction()
+         }
+      },
+      dialogsuccess: {
+         get() {
+            return this.$store.state.sample.dialog_success
+         },
+         set(val) {
+            this.$store.commit("sample/update_dialog_success",val)
+         }
+      },
+      msgsuccess(){
+         return this.$store.state.sample.msg_success
+      },
+      snackbar: {
+         get() {
+            return this.$store.state.sample.alert_success
+         },
+         set(val) {
+            this.$store.commit("sample/update_alert_success",val)
+         }
+      },
+      isLoading() {
+         return this.$store.state.sample.search_status == 1
+      },
+      itemgroups() {
+         return this.$store.state.sample.item_groups
+      },
+      selected_itemgroupname() {
+         return this.$store.state.sample.selected_itemgroupname
+      },
+      selected_itemgroup: {
+         get() {
+            //console.log(this.$store.state.sample.select_item_group)
+            return this.$store.state.sample.select_item_group
+         },
+         set(val) {
+            this.$store.commit("sample/update_select_item_group",val)
+            this.$store.commit("sample/update_selected_itemgroupname",val.fulltitle)
+            this.$store.commit("sample/update_item_subgroups",val.childrens)
+            this.$store.commit("sample/update_select_item_subgroup",val.childrens[0])
+            this.$store.commit("sample/update_selected_itemsubgroupname",val.childrens[0].fulltitle)
+         }
+      },
+      itemsubgroups() {
+         return this.$store.state.sample.item_subgroups
+      },
+      selected_itemsubgroupname() {
+         return this.$store.state.sample.selected_itemsubgroupname
+      },
+      selected_itemsubgroup: {
+         get() {
+            return this.$store.state.sample.select_item_subgroup
+         },
+         set(val) {
+            this.$store.commit("sample/update_select_item_subgroup",val)
+             this.$store.commit("sample/update_selected_itemsubgroupname",val.fulltitle)
+         }
+      },
+      xdatestart : {
+         get() {
+            return this.$store.state.sample.start_date
+         },
+         set(val) {
+            this.$store.commit("sample/update_start_date",val)
+            this.searchTransaction()
+         }
+      },
+      xdateend : {
+         get() {
+            return this.$store.state.sample.end_date
+         },
+         set(val) {
+            this.$store.commit("sample/update_end_date",val)
+            this.searchTransaction()
+         }
+      },
+      xnamelab : {
+         get() {
+            return this.$store.state.sample.name_lab
+         },
+         set(val) {
+            this.$store.commit("sample/update_name_lab",val)
+         }
+      },
+      filterComputedDateFormattedStart () {
+         return this.formatDate(this.xdatestart)
+      },
+      filterComputedDateFormattedEnd () {
+         return this.formatDate(this.xdateend)
+      },
+      xstations() {
+         return this.$store.state.sample.stations
+      },
+      xselectedstation: {
+         get() {
+            return this.$store.state.sample.selected_station
+         },
+         set(val) {
+            this.$store.commit("sample/update_selected_station",val)
+         }
+      },
+      xtransactions() {
+         //console.log(this.$store.state.sample.transactions)
+         return this.$store.state.sample.transactions
+      },
+      openalertconfirmation: {
+         get() {
+            return this.$store.state.sample.open_alert_confirmation
+         },
+         set(val) {
+            this.$store.commit("sample/update_open_alert_confirmation",val)
+         }
+      },
+      opendialoginfo: {
+            get() {
+                  return this.$store.state.sample.open_dialog_info
+            },
+            set(val) {
+                  this.$store.commit("sample/update_open_dialog_info",false)
+            }
+      },
+      msginfo(){
+            return this.$store.state.sample.msg_info
+      },
+      curr_page: {
+         get() {
+            return this.$store.state.sample.current_page
+         },
+         set(val) { 
+            this.$store.commit("sample/update_current_page",val)
+            this.$store.commit("sample/update_last_id",-1)
+            this.$store.dispatch("sample/search",{
+               startdate:this.xdatestart,
+               enddate: this.xdateend,
+               search:this.xnamelab,
+               companyid:this.selected_company.id,
+               switch_exclude:this.switch_exclude,
+               stationid:this.xselectedstation.id,
+               groupid:this.$store.state.sample.select_item_group.id,
+               subgroupid:this.$store.state.sample.select_item_subgroup.id,
+               current_page:val,
+               lastid:-1
+            })
+         }
+      },
+      xtotal_page: {
+         get() {
+            return this.$store.state.sample.total_page
+         },
+         set(val) {
+            this.$store.commit("sample/update_total_page",val)
+         }
+      },
+      xcompanies() {
+         return this.$store.state.sample.companies
+      },
+      selected_company: {
+         get() {
+            return this.$store.state.sample.selected_company
+         },
+         set(val) {
+            this.$store.commit("sample/update_selected_company", val)
+            this.searchTransaction()
+         }
+      }
+   },
+   data() {
+      return {
+         search_company:'',
+         msgalertconfirmation:"Perubahan yang telah dilakukan belum disimpan dong !",
+         menufilterdatestart:false,
+         menufilterdateend:false,
+         date: new Date().toISOString().substr(0, 10),
+         items: [],
+         name: '',
+         page:1,
+         headers: [
+            {
+               text: "NO REG",
+               align: "left",
+               sortable: false,
+               width: "8%",
+               class: "pa-2 blue  white--text"
+            },
+            {
+               text: "TANGGAL",
+               align: "left",
+               sortable: false,
+               width: "8%",
+               class: "pa-2 blue  white--text"
+            },
+            {
+               text: "PASIEN",
+               align: "left",
+               sortable: false,
+               width: "18%",
+               class: "pa-2 blue  white--text"
+            },
+            {
+               text: "STATUS",
+               align: "center",
+               sortable: false,
+               width: "10%",
+               class: "pa-2 blue white--text"
+            }
+         ],
+         pagination:{
+            descending: false,
+            page: 1,
+            rowsPerPage: 5,
+            sortBy: 'trx_id ASC',
+            totalItems: this.$store.state.sample.total_transactions
+         }
+      };
+   },
+   
+}
+</script>

test/vuex/cpone-sample-lab/cpone-resultentry-so-others/components/oneSampleVerifySoDetail.vue

@@ -0,0 +1,481 @@
+<template>
+    <v-layout  v-if="sampletype" class="mb-2 mt-2" column >
+         <v-dialog v-model="xdialogdelete" persistent  max-width="290">
+            <v-card>
+                <v-card-title
+                    dark
+                    class="headline error pt-2 pb-2"
+                    primary-title
+                    style="color:white"
+                >
+                    <h4 dark>Peringatan !</h4>
+                </v-card-title>
+                <v-card-text v-html="xmsgdelete">
+                    
+                </v-card-text>
+                <v-card-actions>
+                <v-spacer></v-spacer>
+                    <v-btn small color="error darken-1 text-sm-left" flat @click="doDeletePhoto()">Hapus</v-btn>
+                    <v-btn small color="primary darken-1 text-sm-right" flat @click="xdialogdelete = false">Batal</v-btn>
+                </v-card-actions>
+            </v-card>
+        </v-dialog>
+        <v-dialog v-model="xdialogaction" persistent  max-width="350">
+            <v-card>
+                <v-card-title color="warning"  class="headline">Konfirmasi</v-card-title>
+                <v-card-text v-html="xmsgaction">
+                    
+                </v-card-text>
+                <v-card-actions>
+                <v-spacer></v-spacer>
+                    <v-btn color="primary darken-1" flat @click="closeDialogAction()">OK</v-btn>
+                    <v-btn color="error darken-1" flat @click="xdialogaction = false">Tutup</v-btn>
+                </v-card-actions>
+            </v-card>
+        </v-dialog>
+        <v-dialog v-model="xdialogimage" persistent  max-width="650" max-height="500">
+            <v-card color="amber lighten-5">
+                <v-container grid-list-sm fluid>
+                    <v-layout row wrap>
+                        <v-flex>
+                            <v-card flat tile class="d-flex">
+                                <v-img
+                                :src="ximage"
+                                aspect-ratio="1"
+                                class="grey lighten-2"
+                                >
+                                <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-layout>
+                </v-container>
+                <v-card-actions>
+                    <v-btn color="error darken-1" v-if="sampletype.status !== 'V'" @click="deleteImage()">Hapus</v-btn>
+                    <v-spacer></v-spacer>
+                    <v-btn color="black" dark @click="xdialogimage = false">Tutup</v-btn>
+                </v-card-actions>
+            <v-card>
+        </v-dialog>
+        <v-card v-if="sampletype">
+            <v-layout row>
+                <v-flex  xs12>
+                    <!--<v-subheader red--text text--lighten-1> LIST SAMPLE
+                    </v-subheader>
+                    <v-divider></v-divider>-->
+                    <v-layout pa-2 row wrap>
+                        <v-flex xs5 mb-2 mr-3>
+                            <v-layout>
+                                <v-flex xs12>
+                                    <v-card style="border:1px solid black" flat class="text">
+                                        <v-layout pa-1>
+                                            <v-flex xs5>
+                                            <v-img
+                                                src="https://anggrek.aplikasi.web.id/one-ui/libs/image/body.jpg"
+                                                height="125px"
+                                                contain
+                                            ></v-img>
+                                            </v-flex>
+                                            <v-flex xs7>
+                                                <v-card-title style="padding-top:0">
+                                                    <div>
+                                                        <div style="font-size:x-large" class="font-weight-light font-condensed pl-2">{{sampletype.T_SampleTypeName}}</div>
+                                                        <div>
+                                                            <v-btn depressed color="warning"><v-icon left>alarm</v-icon>{{sampletype.process_date}} {{sampletype.process_time}}</v-btn>
+                                                            <v-btn depressed color="success"><v-icon left>alarm</v-icon>{{sampletype.done_date}} {{sampletype.done_time}}</v-btn>
+                                                        </div>
+                                                    </div>
+                                                </v-card-title>
+                                            </v-flex>
+                                        </v-layout>
+                                        <v-divider></v-divider>
+                                        <v-card-actions class="pt-2 pb-2">
+                                            <v-layout v-if="sampletype.status !== 'V'" row>
+                                                <v-flex pa-1 pl-3 xs6>
+                                                    <v-btn block @click="reject(sampletype)" color="error">TOLAK</v-btn>
+                                                </v-flex>
+                                                <v-flex pa-1 pr-3 xs6>
+                                                    <v-btn block @click="verify(sampletype)" color="primary">VERIFIKASI</v-btn>
+                                                </v-flex>
+                                            </v-layout>
+                                            <v-layout v-if="sampletype.status === 'V'" align-center row>
+                                                <v-flex xs7>
+                                                    <!--<v-chip label color="primary" text-color="white">
+                                                        <v-icon left>alarm_on</v-icon>{{sampletype.verify_date}} {{sampletype.verify_time}}
+                                                    </v-chip>-->
+                                                    <v-btn block depressed color="primary"><v-icon left>alarm_on</v-icon>{{sampletype.verify_date}} {{sampletype.verify_time}}</v-btn>
+                                                </v-flex>
+                                                <v-flex xs5>
+                                                    <v-chip close label @click="unverify(sampletype)" color="red" text-color="white">
+                                                        Batal Verifikasi
+                                                    </v-chip>
+                                                    <!--<v-btn block v-if="sampletype.status === 'V'" @click="unverify(sampletype)" color="error"><v-icon>lock_open</v-icon></v-btn>-->
+                                                </v-flex>
+                                            </v-layout>
+                                        </v-card-actions>
+                                    </v-card>
+                                </v-flex>
+                            </v-layout>
+                        </v-flex>
+                        <v-flex v-if="sampletype.status !== 'V'" xs-7>
+                            <form enctype="multipart/form-data" novalidate v-if="isInitial || isSaving">
+                                
+                                <div class="dropbox">
+                                <input type="file" multiple :name="uploadFieldName" :disabled="isSaving" @change="filesChange($event.target.name, $event.target.files); fileCount = $event.target.files.length"
+                                    accept="image/*" class="input-file">
+                                    <p v-if="isInitial">
+                                    Geret photo ke sini untuk memulai upload<br> atau klik untuk mencari
+                                    </p>
+                                    <p v-if="isSaving">
+                                    Sedang meng-upload {{ fileCount }} photo...
+                                    </p>
+                                </div>
+                            </form>
+                            <div class="dropbox text-xs-center" v-if="isFailed">
+                                <h2 style="color:#f44336">Photo gagal diupload !</h2>
+                                <p>
+                                <a href="javascript:void(0)" @click="reset()">Klik untuk upload lagi</a>
+                                </p>
+                            </div>
+                            <div class="dropbox text-xs-center" v-if="isSuccess">
+                                <h2>Photo berhasil diupload.</h2>
+                                <p>
+                                <a href="javascript:void(0)" @click="reset()">Klik untuk upload lagi</a>
+                                </p>
+                            </div>
+                        </v-flex>
+                        <v-flex v-if="sampletype.status === 'V'" xs-7>
+                            <div class="dropbox_verify">
+                                <p>
+                                fitur upload photo sudah tidak tersedia
+                                </p>
+                                <p><v-icon x-medium color="#fff">not_interested</v-icon></p>
+                            </div>
+                        </v-flex>
+                    </v-layout>
+                </v-flex>
+            </v-layout>     
+            <v-divider></v-divider>
+            <v-layout align-center justify-center row fill-height>
+                <v-flex xs12 pt-3 pb-3 sm8>
+                <v-card color="amber lighten-5">
+                    <v-container grid-list-sm fluid>
+                    <v-layout justify-center row v-if="xphotos.length === 0">
+                            <h5>Belum ada photo yang diupload</h5>
+                    </v-layout>
+                    <v-layout row v-if="xphotos.length > 0" wrap>
+                        <v-flex
+                        v-for="photo in xphotos"
+                        :key="photo.id"
+                        pa-1
+                        >
+                        <v-card flat tile class="d-flex">
+                            <v-img
+                            :src="photo.newname"
+                            aspect-ratio="1"
+                            class="grey lighten-2"
+                            @click="openImage(photo)"
+                            >
+                            <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-layout>
+                    </v-container>
+                </v-card>
+                </v-flex>
+            </v-layout>     
+        </v-card>
+    </v-layout>
+</template>
+
+<style scoped>
+    .dropbox {
+    outline: 2px dashed grey; /* the dash box */
+    outline-offset: -10px;
+    background: lightcyan;
+    color: dimgray;
+    padding: 10px 10px;
+    min-height: 218px; /* minimum height */
+    position: relative;
+    cursor: pointer;
+  }
+
+  .dropbox_verify {
+    outline: 2px dashed #fff; /* the dash box */
+    outline-offset: -10px;
+    background: #382f2f;
+    color: #fff;
+    padding-top:45px;
+    min-height: 214px; /* minimum height */
+    max-height: 214px;
+    position: relative;
+    cursor: pointer;
+    text-align:center;
+    vertical-align:middle;
+  }
+  
+  .input-file {
+    opacity: 0; /* invisible but it's there! */
+    width: 100%;
+    height: 200px;
+    position: absolute;
+    cursor: pointer;
+  }
+  
+  .dropbox:hover {
+    background: lightblue; /* when mouse over to the drop zone, change color */
+  }
+  
+  .dropbox p {
+    font-size: 1.2em;
+    text-align: center;
+    padding: 50px 0;
+  }
+</style>
+
+<script>
+module.exports = {
+    mounted() {
+      this.reset()
+    },
+    data: () => ({
+        uploadFieldName: 'photos[]',
+        fileCount:0,
+        weigthdiv:4,
+        chip2:true
+    }),
+    computed: {
+       sampletype(){
+            return this.$store.state.sample.selected_transaction
+        },
+        currentStatus:{
+            get() {
+                return this.$store.state.sample.current_status
+            },
+            set(val) {
+                this.$store.commit("sample/update_current_status",val)
+            }
+        },
+        uploadedFiles:{
+            get() {
+                return this.$store.state.sample.uploaded_files
+            },
+            set(val) {
+                this.$store.commit("sample/update_uploaded_files",val)
+            }
+        },
+        uploadError:{
+            get() {
+                return this.$store.state.sample.uploaded_error
+            },
+            set(val) {
+                this.$store.commit("sample/update_uploaded_error",val)
+            }
+        },
+        isInitial() {
+            return this.currentStatus === 'STATUS_INITIAL';
+        },
+        isSaving() {
+            return this.currentStatus === 'STATUS_SAVING';
+        },
+        isSuccess() {
+            return this.currentStatus === 'STATUS_SUCCESS';
+        },
+        isFailed() {
+            return this.currentStatus === 'STATUS_FAILED';
+        },
+        xdialogaction:{
+            get() {
+                return this.$store.state.sample.dialog_action
+            },
+            set(val) {
+                this.$store.commit("sample/update_dialog_action",val)
+            }
+        },
+        xmsgaction:{
+            get() {
+                return this.$store.state.sample.msg_action
+            },
+            set(val) {
+                this.$store.commit("sample/update_msg_action",val)
+            }
+        },
+        xphotos() {
+            return this.$store.state.sample.photos
+        },
+        xdialogimage:{
+            get() {
+                return this.$store.state.sample.dialog_image
+            },
+            set(val) {
+                this.$store.commit("sample/update_dialog_image",val)
+            }
+        },
+        ximage() {
+            return this.$store.state.sample.image
+        },
+        xdialogdelete:{
+            get() {
+                return this.$store.state.sample.dialog_confirmation_delete
+            },
+            set(val) {
+                this.$store.commit("sample/update_dialog_confirmation_delete",val)
+            }
+        },
+        xmsgdelete:{
+            get() {
+                return this.$store.state.sample.msg_confirmation_delete
+            },
+            set(val) {
+                this.$store.commit("sample/update_msg_confirmation_delete",val)
+            }
+        },
+        xdialoginfo:{
+            get() {
+                return this.$store.state.sample.open_dialog_info
+            },
+            set(val) {
+                this.$store.commit("sample/update_open_dialog_info",val)
+            }
+        },
+        xmsginfo:{
+            get() {
+                return this.$store.state.sample.msg_info
+            },
+            set(val) {
+                this.$store.commit("sample/update_msg_info",val)
+            }
+        },
+        showtooltip(){
+            if(this.$store.state.sample.selected_transaction.status === 'V'){
+                return true
+            }
+            else{
+                return false
+            }
+        }
+    },
+    methods : {
+        reset() {
+            console.log('reset')
+            this.currentStatus = 'STATUS_INITIAL';
+            this.uploadedFiles = [];
+            this.uploadError = null;
+        },
+        save(formData) {
+            this.currentStatus = 'STATUS_SAVING'
+            this.$store.dispatch("sample/upload",formData)
+        },
+        filesChange(fieldName, fileList) {
+            const formData = new FormData()
+            if (!fileList.length) return
+            Array
+            .from(Array(fileList.length).keys())
+            .map(x => {
+                formData.append(fieldName, fileList[x], fileList[x].name)
+            })
+            formData.append ('ordernumber', this.sampletype.T_OrderHeaderLabNumber)
+            formData.append ('orderid', this.sampletype.T_OrderHeaderID)
+            formData.append ('sampletype', this.sampletype.T_SampleTypeID)
+            formData.append ('token', one_token())
+            this.save(formData);
+        },
+        closeDialogAction(){
+            var act = this.$store.state.sample.act
+            var statusnextid = 4
+            var trxs  = this.$store.state.sample.transactions
+            var trx  = this.$store.state.sample.selected_transaction
+            var idx = _.findIndex(trxs, item => item.T_OrderHeaderID === trx.T_OrderHeaderID &&  item.T_SampleTypeID === trx.T_SampleTypeID)
+            this.$store.dispatch("sample/doaction",{
+                act:act,
+                orderid:trx.T_OrderHeaderID,
+                sampleid:trx.T_SampleTypeID,
+                namelab:this.$store.state.sample.name_lab,
+                startdate:this.$store.state.sample.start_date,
+                enddate: this.$store.state.sample.end_date,
+                stationid:this.$store.state.sample.selected_station.id,
+                statusnextid : statusnextid,
+                doctor:this.$store.state.sample.selected_doctor,
+                doctoraddress:this.$store.state.sample.selected_doctor_address,
+                lastid:idx
+            })
+            
+        },
+        reject(value){
+            var msg = "Anda yakin akan menolak sample "+value.T_SampleTypeName+" dari pasien "+value.patient_fullname+" ? "
+            this.$store.commit("sample/update_msg_action",msg)
+            this.$store.commit("sample/update_act",'reject')
+            this.$store.commit("sample/update_dialog_action",true)
+        },
+        verify(value){
+            this.$store.commit("sample/update_errors",[])
+            var errors = this.$store.state.sample.errors
+            if(_.isEmpty(this.$store.state.sample.selected_doctor)){
+                errors.push("requiredoctor")
+            }
+            if(_.isEmpty(this.$store.state.sample.selected_doctor_address)){
+                errors.push("requiredoctoraddress")
+            }
+            if(errors.length === 0){
+                var msg = "Anda yakin akan me-verifikasi sample "+value.T_SampleTypeName+" dari pasien "+value.patient_fullname+" ? "
+                this.$store.commit("sample/update_msg_action",msg)
+                this.$store.commit("sample/update_act",'verify')
+                this.$store.commit("sample/update_dialog_action",true)
+            }
+        },
+        unverify(value){
+            var msg = "Anda yakin akan membatalkan verifikasi "+value.T_SampleTypeName+" dari pasien "+value.patient_fullname+" ? "
+            this.$store.commit("sample/update_msg_action",msg)
+            this.$store.commit("sample/update_act",'unverify')
+            this.currentStatus === 'STATUS_INITIAL'
+            this.$store.commit("sample/update_dialog_action",true)
+        },
+        openImage(value){
+            this.$store.commit("sample/update_selected_photo",value)
+            this.$store.commit("sample/update_image",value.newname)
+            this.$store.commit("sample/update_dialog_image",true)
+        },
+        deleteImage(){
+            this.$store.commit("sample/update_dialog_image",false)
+            var msg = "<p>Yakin akan menghapus photo ?</p>"
+            this.$store.commit("sample/update_msg_confirmation_delete",msg)
+            this.$store.commit("sample/update_dialog_confirmation_delete",true)
+        },
+        doDeletePhoto(){
+            var id = this.$store.state.sample.selected_photo.id
+            var trxs  = this.$store.state.sample.transactions
+            var trx  = this.$store.state.sample.selected_transaction
+            var idx = _.findIndex(trxs, item => item.T_OrderHeaderID === trx.T_OrderHeaderID &&  item.T_SampleTypeID === trx.T_SampleTypeID)
+            this.$store.dispatch("sample/deletephoto",{
+                id:id,
+                orderid:trx.T_OrderHeaderID,
+                sampleid:trx.T_SampleTypeID,
+                namelab:this.$store.state.sample.name_lab,
+                startdate:this.$store.state.sample.start_date,
+                enddate: this.$store.state.sample.end_date,
+                stationid:this.$store.state.sample.selected_station.id,
+                lastid:idx
+            })
+        }
+    }
+}
+</script>

test/vuex/cpone-sample-lab/cpone-resultentry-so-others/components/oneSampleVerifySoDoctor.vue

@@ -0,0 +1,112 @@
+<template>
+    <div>
+        <v-layout  v-if="xselected_patient" mt-2 row>
+            <v-flex xs12>
+                <v-card>
+                    <v-card-text style="padding-top:2px">
+                        <v-subheader v-if="xselected_patient.status === 'V'" red--text text--lighten-1> 
+                            <v-flex text-md-right>
+                                <v-btn  @click="updateDoctor()" small color="info">Update</v-btn>
+                            </v-flex>
+                        </v-subheader>
+                        <v-divider></v-divider>
+                        <v-layout row>
+                            <v-flex pa-2 xs6>
+                                <v-select
+                                    item-text="name"
+                                    return-object
+                                    :items="xdoctors" 
+                                    v-model="xselecteddoctor"
+                                    label="Dokter*"
+                                ></v-select>
+                                <p  v-if="checkError('requiredoctor')" class="error pl-2 pr-2" style="color:#fff">Dokter dipilih dulu dong</p>
+                            </v-flex>
+                            <v-flex pa-2 xs6>
+                                <v-select
+                                    item-text="name"
+                                    return-object
+                                    :items="xdoctoraddress" 
+                                    v-model="xselecteddoctoraddress"
+                                    label="Alamat Dokter*"
+                                ></v-select>
+                                <p  v-if="checkError('requiredoctoraddress')" class="error pl-2 pr-2" style="color:#fff">Alamatnya juga dong dipilih</p>
+                            </v-flex>
+                        </v-layout> 
+                    </v-card-text>         
+                </v-card>
+            </v-flex>
+        </v-layout>
+    </div>
+</template>
+
+<style scoped>
+
+</style>
+
+<script>
+module.exports = {
+    data: () => ({
+          
+    }),
+    computed: {
+        xselected_patient(){
+            //console.log(this.$store.state.sample.selected_transaction)
+            return this.$store.state.sample.selected_transaction
+        },
+        xselecteddoctor: {
+            get() {
+                return this.$store.state.sample.selected_doctor
+            },
+            set(val) {
+                this.$store.commit("sample/update_selected_doctor",val)
+                this.$store.dispatch("sample/getdoctoraddress",{
+                    id:val.id
+                })
+            }
+        },
+        xdoctors(){
+            return this.$store.state.sample.doctors
+        },
+        xselecteddoctoraddress: {
+            get() {
+                return this.$store.state.sample.selected_doctor_address
+            },
+            set(val) {
+                this.$store.commit("sample/update_selected_doctor_address",val)
+                
+            }
+        },
+        xdoctoraddress(){
+            return this.$store.state.sample.doctor_address
+        }
+    },
+    methods : {
+        checkError(value){
+            var errors = this.$store.state.sample.errors
+            if(errors.includes(value)){
+                return true
+            }
+            else{
+                return false
+            }
+        },
+        updateDoctor(){
+            this.$store.commit("sample/update_errors",[])
+            var errors = this.$store.state.sample.errors
+            var value = this.$store.state.sample.selected_transaction
+            if(_.isEmpty(this.$store.state.sample.selected_doctor)){
+                errors.push("requiredoctor")
+            }
+            if(_.isEmpty(this.$store.state.sample.selected_doctor_address)){
+                errors.push("requiredoctoraddress")
+            }
+            if(errors.length === 0){
+                var msg = "Anda yakin akan merubah data dokter atau alamat dokter "+value.T_SampleTypeName+" dari pasien "+value.patient_fullname+" ? "
+                this.$store.commit("sample/update_msg_action",msg)
+                this.$store.commit("sample/update_act",'updatedoctor')
+                this.$store.commit("sample/update_dialog_action",true)
+            }
+        }
+    }
+}
+</script>

test/vuex/cpone-sample-lab/cpone-resultentry-so-others/components/oneWalkLetterSoForm.vue

@@ -0,0 +1,615 @@
+<template>
+    <v-layout class="mb-2" column >
+        <v-dialog v-model="dialogconfirmationdelete" persistent  max-width="290">
+            <v-card>
+                <v-card-title
+                    dark
+                    class="headline error pt-2 pb-2"
+                    primary-title
+                    style="color:white"
+                >
+                    <h4 dark>Konfirmasi</h4>
+                </v-card-title>
+                <v-card-text>
+                    {{msgconfirmationdelete}}
+                </v-card-text>
+                <v-card-actions>
+                <v-spacer></v-spacer>
+                    <v-btn small color="error darken-1 text-sm-left" flat @click="doDeleteTrx()">Hapus</v-btn>
+                    <v-btn small color="primary darken-1 text-sm-right" flat @click="dialogconfirmationdelete = false">Batal</v-btn>
+                </v-card-actions>
+            </v-card>
+        </v-dialog>
+        <v-dialog v-model="xdialogaction" persistent  max-width="350">
+            <v-card>
+                <v-card-title color="warning"  class="headline">Konfirmasi</v-card-title>
+                <v-card-text v-html="xmsgaction">
+                    
+                </v-card-text>
+                <v-card-actions>
+                <v-spacer></v-spacer>
+                    <v-btn color="primary darken-1" flat @click="closeDialogAction()">Ya</v-btn>
+                    <v-btn color="error darken-1" flat @click="xdialogaction = false">Tutup</v-btn>
+                </v-card-actions>
+            </v-card>
+        </v-dialog>
+            <v-layout  row>
+                
+                <v-flex  xs12>
+                    <v-card>
+                    <v-subheader red--text text--lighten-1> FORM SURAT JALAN
+                    <span v-if="xact !== 'new'"> &nbsp;[ <span style="color:#2196F3;font-weight: 900;">{{xnumbering}}</span> ]</span>
+                    <span v-if="xact !== 'new' && currStatus === 'CREATED'">
+                        <v-btn small @click="releaseToCourier()" color="warning">SERAHKAN KE KURIR</v-btn>
+                    </span>
+                    <span v-if="xact !== 'new' && currStatus === 'RELEASEC'">
+                        <v-btn small @click="receiveDoctor()" color="info">DITERIMA DOKTER</v-btn>
+                    </span>
+                     <span v-if="xact !== 'new' && currStatus === 'RCVDOC'">
+                        <v-btn small @click="receiveFromCourier()" color="primary">TERIMA DARI KURIR</v-btn>
+                    </span>
+                    <span v-if="xact !== 'new' && currStatus === 'PARTDONE'">
+                        <v-btn small @click="forceClose()" color="success">TUTUP TRANSAKSI MANUAL</v-btn>
+                    </span>
+                    <v-flex text-md-right>
+                        <v-btn  v-if="xact !== 'new' && currStatus === 'CREATED'" @click="deleteTrx()" small color="error">Hapus</v-btn>
+                        <v-btn  v-if="( xact !== 'new' && currStatus === 'CREATED') || xact === 'new'" @click="saveTrx()" small color="primary">Simpan</v-btn>
+                    </v-flex>
+                    </v-subheader>
+                    <v-divider></v-divider>
+                    <v-layout class="pb-2" row wrap>
+                        <v-flex xs12 pa-2>
+                            <v-layout row>
+                                <v-flex xs2 pa-1>
+                                    <v-menu class="pr-2"
+                                        v-model="menutrxdate"
+                                        :close-on-content-click="false"
+                                        :nudge-right="40"
+                                        lazy
+                                        transition="scale-transition"
+                                        offset-y
+                                        full-width
+                                        max-width="290px"
+                                        min-width="290px"
+                                        >
+                                        <template v-slot:activator="{ on }">
+                                            <v-text-field
+                                            class="mt-1"
+                                            v-model="filterComputedDateFormattedTrx"
+                                            label="Tanggal Transaksi*"
+                                            :disabled="xact === 'edit'"
+                                            readonly
+                                            v-on="on"
+                                            @blur="date = deFormatedDate(filterComputedDateFormattedTrx)"
+                                            ></v-text-field>
+                                        </template>
+                                        <v-date-picker v-model="xtrxdate" no-title @input="menutrxdate = false"></v-date-picker>
+                                    </v-menu>
+                                </v-flex>
+                                <v-flex pa-1 xs3>
+                                    <v-select
+                                        item-text="name"
+                                        return-object
+                                        :items="xdoctors" 
+                                        v-model="xselecteddoctor"
+                                        :disabled="xact === 'edit'"
+                                        label="Dokter*"
+                                    ></v-select>
+                                    <p  v-if="checkError('requiredoctor')" class="error pl-2 pr-2" style="color:#fff">Dokter dipilih dulu dong</p>
+                                </v-flex>
+                                <v-flex pa-1 xs4>
+                                    <v-select
+                                        item-text="name"
+                                        return-object
+                                        :disabled="xact === 'edit'"
+                                        :items="xdoctoraddress" 
+                                        v-model="xselecteddoctoraddress"
+                                        label="Alamat Dokter*"
+                                    ></v-select>
+                                    <p  v-if="checkError('requiredoctoraddress')" class="error pl-2 pr-2" style="color:#fff">Alamatnya juga dong dipilih</p>
+                                </v-flex>
+                                <v-flex pa-1 xs3>
+                                    <v-select
+                                        item-text="name"
+                                        return-object
+                                        :disabled="xact === 'edit' && currStatus !== 'CREATED'"
+                                        :items="xcouriers" 
+                                        v-model="xselectedcourier"
+                                        label="Kurir"
+                                    ></v-select>
+                                    <p  v-if="checkError('requirecourier')" class="error pl-2 pr-2" style="color:#fff">Yang ngirim siapa dong ?</p>
+                                </v-flex>
+                            </v-layout>
+                            <v-layout row>
+                                <v-flex xs12 pa-1>
+                                    <v-textarea
+                                        filled
+                                        outline
+                                        :disabled="xact === 'edit' && currStatus === 'DONE'"
+                                        label="Catatan"
+                                        v-model="xnote"
+                                        rows="3"
+                                    ></v-textarea>
+                                </v-flex>
+                            </v-layout>
+                        </v-flex>
+                    </v-layout>
+                    </v-card>
+                    <v-layout class="pt-2 mb-2" column >
+                        <v-card>
+                            <v-layout  row>
+                                <v-flex  xs12>
+                                    <v-subheader red--text text--lighten-1> DETAIL TRANSAKSI</v-subheader>
+                                    <v-divider></v-divider>
+                                    <v-layout row wrap>
+                                        <v-flex xs12 pa-2>
+                                            <v-layout v-if="xact === 'new' || (xact !== 'new' && ( currStatus === 'CREATED' || currStatus === 'RELEASEC'))" row>
+                                                <v-flex xs12 pa-1>
+                                                    <v-data-table 
+                                                        :headers="headers" 
+                                                        :items="details"
+                                                        :loading="isLoading"
+                                                        hide-actions class="elevation-1">
+                                                        <template slot="items" slot-scope="props">
+                                                            <td class="text-xs-left pa-2">{{ props.item.labnumber }}</td>
+                                                            <td class="text-xs-left pa-2">{{ props.item.patient_fullname }}</td>
+                                                            <td class="text-xs-center pa-2" >{{ props.item.samplename }}</td>
+                                                            <td class="text-xs-center pa-2">
+                                                                <div>
+                                                                    <v-btn @click="changeFlagImage(props.item)" v-if="props.item.flag_image === 'N'" small color="error"><v-icon left>close</v-icon>  Tidak</v-btn>
+                                                                    <v-btn @click="changeFlagImage(props.item)" v-if="props.item.flag_image === 'Y'" flat small color="success"><v-icon left>check</v-icon> Ada</v-btn>
+                                                                </div>
+                                                            </td>
+                                                            <td class="text-xs-center pa-2">
+                                                                <div>
+                                                                    <v-btn @click="changeActive(props.item)" v-if="props.item.active === 'N'" small color="error"><v-icon left>close</v-icon>  Belum dipilih</v-btn>
+                                                                    <v-btn @click="changeActive(props.item)" v-if="props.item.active === 'Y'" flat small color="success"><v-icon left>check</v-icon> Sudah terpilih</v-btn>
+                                                                </div>
+                                                        </template>
+                                                    </v-data-table>
+                                                </v-flex>
+                                            </v-layout>
+                                            <v-layout v-if="xact !== 'new' && ( currStatus !== 'CREATED' && currStatus !== 'RELEASEC')" row>
+                                                <v-flex xs12 pa-1>
+                                                    <v-data-table 
+                                                        :headers="headerreceive" 
+                                                        :items="details"
+                                                        :loading="isLoading"
+                                                        hide-actions class="elevation-1">
+                                                        <template slot="items" slot-scope="props">
+                                                            <td class="text-xs-left pa-2">{{ props.item.labnumber }}</td>
+                                                            <td class="text-xs-left pa-2">{{ props.item.patient_fullname }}</td>
+                                                            <td class="text-xs-center pa-2" >{{ props.item.samplename }}</td>
+                                                            <td class="text-xs-center pa-2">
+                                                                <div>
+                                                                    <v-btn @click="changeFlagImageReceive(props.item)" v-if="props.item.flag_image_receive === 'N'" small color="error"><v-icon left>close</v-icon>  Tidak</v-btn>
+                                                                    <v-btn @click="changeFlagImageReceive(props.item)" v-if="props.item.flag_image_receive === 'Y'" flat small color="success"><v-icon left>check</v-icon> Ada</v-btn>
+                                                                </div>
+                                                            </td>
+                                                            <td class="text-xs-center pa-2">
+                                                                <div>
+                                                                    <v-btn @click="changeFlagResultReceive(props.item)" v-if="props.item.flag_result_receive === 'N'" small color="error"><v-icon left>close</v-icon>  Tidak</v-btn>
+                                                                    <v-btn @click="changeFlagResultReceive(props.item)" v-if="props.item.flag_result_receive === 'Y'" flat small color="success"><v-icon left>check</v-icon> Ada</v-btn>
+                                                                </div>
+                                                        </template>
+                                                    </v-data-table>
+                                                </v-flex>
+                                            </v-layout>
+                                        </v-flex>
+                                    </v-layout>
+                                </v-flex>
+                            </v-flex>          
+                        </v-card>
+                        
+                    </v-layout>
+                </v-flex>
+            </v-flex>          
+    </v-layout>
+</template>
+
+<style scoped>
+    table, td, th {  
+    border: 1px solid #ddd;
+    text-align: left;
+    }
+
+    table {
+    border-collapse: collapse;
+    width: 100%;
+    }
+
+    th, td {
+    padding-top: 5px;
+    padding-bottom: 5px;
+    padding-left: 8px;
+    padding-right: 5px;
+    }
+
+    .mini-input .v-input{
+        margin-top: 0px; 
+    }
+
+    .mini-input .v-input, .mini-input .v-input--selection-controls,.mini-input .v-input__slot{
+        margin-top: 0px; 
+        margin-bottom:0px;
+        margin-left:3px;
+    }
+    .mini-input .v-messages{
+        min-height:0px;
+    }
+    input.fhm-input{
+        border: 1px solid black; 
+        border-radius: 2px;
+        -webkit-box-shadow: 
+        inset 0 0 2px  rgba(0,0,0,0.1),
+                0 0 4px rgba(0,0,0,0.1); 
+        -moz-box-shadow: 
+        inset 0 0 2px  rgba(0,0,0,0.1),
+                0 0 4px rgba(0,0,0,0.1); 
+        box-shadow: 
+        inset 0 0 2px  rgba(0,0,0,0.1),
+                0 0 4px rgba(0,0,0,0.1); 
+        padding: 2px 4px;
+        background: rgba(255,255,255,0.5);
+        margin: 0 0 1px 0;
+        width:30px;
+        text-align:center;
+    }
+</style>
+
+<script>
+module.exports = {
+    data: () => ({
+        menutrxdate:false,
+        date: new Date().toISOString().substr(0, 10),
+        isLoading:false,
+        headers: [
+            {
+               text: "NOLAB",
+               align: "left",
+               sortable: false,
+               width: "15%",
+               class: "pa-2 blue lighten-3 white--text"
+            },
+            {
+               text: "PASIEN",
+               align: "left",
+               sortable: false,
+               width: "20%",
+               class: "pa-2 blue lighten-3 white--text"
+            },
+            {
+               text: "SAMPLE",
+               align: "center",
+               sortable: false,
+               width: "10%",
+               class: "pa-2 blue lighten-3 white--text"
+            },
+            {
+               text: "LAMPIRAN IMAGE",
+               align: "center",
+               sortable: false,
+               width: "20%",
+               class: "pa-2 blue lighten-3 white--text"
+            },
+
+            {
+               text: "AKSI",
+               align: "center",
+               sortable: false,
+               width: "20%",
+               class: "pa-2 blue lighten-3 white--text"
+            }
+         ],
+         headerreceive: [
+            {
+               text: "NOLAB",
+               align: "left",
+               sortable: false,
+               width: "15%",
+               class: "pa-2 blue lighten-3 white--text"
+            },
+            {
+               text: "PASIEN",
+               align: "left",
+               sortable: false,
+               width: "20%",
+               class: "pa-2 blue lighten-3 white--text"
+            },
+            {
+               text: "SAMPLE",
+               align: "center",
+               sortable: false,
+               width: "10%",
+               class: "pa-2 blue lighten-3 white--text"
+            },
+            {
+               text: "LAMPIRAN IMAGE",
+               align: "center",
+               sortable: false,
+               width: "20%",
+               class: "pa-2 blue lighten-3 white--text"
+            },
+
+            {
+               text: "LAMPIRAN HASIL",
+               align: "center",
+               sortable: false,
+               width: "20%",
+               class: "pa-2 blue lighten-3 white--text"
+            }
+         ],
+    }),
+    computed: {
+        xact: {
+            get() {
+                return this.$store.state.sample.act
+            },
+            set(val) {
+                this.$store.commit("sample/update_act",val)
+            }
+        },
+        xnumbering(){
+            if(this.$store.state.sample.selected_transaction)
+                return this.$store.state.sample.selected_transaction.trx_numbering
+            else
+                return '-' 
+        },
+        currStatus(){
+            if(this.$store.state.sample.selected_transaction)
+                return this.$store.state.sample.selected_transaction.status
+            else
+                return 'NONE' 
+        },
+        xselectedtransaction(){
+             return this.$store.state.sample.selected_transaction
+        },
+        xtrxdate : {
+            get() {
+                return this.$store.state.sample.trx_date
+            },
+            set(val) {
+                this.$store.commit("sample/update_trx_date",val)
+            }
+        },
+        dialogconfirmationdelete:{
+            get() {
+                return this.$store.state.sample.dialog_confirmation_delete
+            },
+            set(val) {
+                this.$store.commit("sample/update_dialog_confirmation_delete",val)
+            }
+        },
+        msgconfirmationdelete(){
+            return  this.$store.state.sample.msg_confirmation_delete
+        },
+        filterComputedDateFormattedTrx () {
+            return this.formatDate(this.xtrxdate)
+        },
+        xselecteddoctor: {
+            get() {
+                return this.$store.state.sample.selected_doctor
+            },
+            set(val) {
+                this.$store.commit("sample/update_selected_doctor",val)
+                this.$store.dispatch("sample/getdoctoraddress",{
+                    id:val.id
+                })
+               
+            }
+        },
+        xdoctors(){
+            return this.$store.state.sample.doctors
+        },
+        xselecteddoctoraddress: {
+            get() {
+                return this.$store.state.sample.selected_doctor_address
+            },
+            set(val) {
+                this.$store.commit("sample/update_selected_doctor_address",val)
+                this.$store.dispatch("sample/getordersamples",{
+                    doctorid:this.$store.state.sample.selected_doctor.id,
+                    doctoraddressid:val.id
+                })
+            }
+        },
+        xdoctoraddress(){
+            return this.$store.state.sample.doctor_address
+        },
+        xselectedcourier: {
+            get() {
+                return this.$store.state.sample.selected_courier
+            },
+            set(val) {
+                this.$store.commit("sample/update_selected_courier",val)
+                
+            }
+        },
+        xcouriers(){
+            return this.$store.state.sample.couriers
+        },
+        xnote: {
+            get() {
+                return this.$store.state.sample.trx_note
+            },
+            set(val) {
+                this.$store.commit("sample/update_trx_note",val)
+            }
+        },
+        details(){
+            return this.$store.state.sample.details
+        },
+        xdialogaction:{
+            get() {
+                return this.$store.state.sample.dialog_action
+            },
+            set(val) {
+                this.$store.commit("sample/update_dialog_action",val)
+            }
+        },
+        xmsgaction:{
+            get() {
+                return this.$store.state.sample.msg_action
+            },
+            set(val) {
+                this.$store.commit("sample/update_msg_action",val)
+            }
+        }
+    },
+    methods : {
+        checkError(value){
+            var errors = this.$store.state.sample.errors
+            if(errors.includes(value)){
+                return true
+            }
+            else{
+                return false
+            }
+        },
+        formatDate (date) {
+            if (!date) return null
+
+            const [year, month, day] = date.split('-')
+            return `${day}-${month}-${year}`
+        },
+        deFormatedDate (date) {
+            if (!date) return null
+
+            const [ day,month, year] = date.split('-')
+            return `${year}-${month.padStart(2, '0')}-${day.padStart(2, '0')}`
+        },
+        saveTrx(){
+            this.$store.commit("sample/update_errors",[])
+            var errors = this.$store.state.sample.errors
+            if(_.isEmpty(this.xselecteddoctor)){
+                errors.push("requiredoctor")
+            }
+            if(_.isEmpty(this.xselecteddoctoraddress)){
+                errors.push("requiredoctoraddress")
+            }
+            if(errors.length === 0){
+                if(this.$store.state.sample.details.length > 0){
+                    var details = this.$store.state.sample.details
+                    var prm = {}
+                    console.log(this.xact)
+                    if(this.xact === 'new')
+                        prm.trx_id = 0
+                    else
+                        prm.trx_id = this.$store.state.sample.selected_transaction.trx_id
+
+                    console.log(prm.trx_id)
+                    prm.details = details
+                    prm.trx_date = this.xtrxdate
+                    prm.trx_note = this.xnote
+                    prm.doctor = this.xselecteddoctor
+                    prm.doctoraddress = this.xselecteddoctoraddress
+                    prm.courier = this.xselectedcourier
+                    prm.startdate = this.$store.state.sample.start_date
+                    prm.enddate = this.$store.state.sample.end_date
+                    prm.search  = this.$store.state.sample.name_lab
+                    prm.stationid = this.$store.state.sample.selected_station.id
+                    prm.lastid = -1
+                    this.$store.dispatch("sample/save",prm)
+                }
+                else{
+                    var msg = "Belum ada sample yang dipilih dong "
+                    this.$store.commit("sample/update_msg_info",msg)
+                    this.$store.commit("sample/update_open_dialog_info",true)
+                }
+            }
+        },
+        changeFlagImage(value){
+            console.log('changeFlagImage')
+            if(this.xact === 'new' || (this.xact !== 'new' && this.currStatus === 'CREATED')){
+                let arr = this.$store.state.sample.details
+                var idx = _.findIndex(arr, item => item.orderid === value.orderid && item.sampleid === value.sampleid)
+                arr[idx].flag_image = value.flag_image === 'N' ? 'Y':'N'
+                this.$store.commit("sample/update_details",arr)
+            }
+        },
+        changeActive(value){
+            console.log('changeActive')
+            if(this.xact === 'new' || (this.xact !== 'new' && this.currStatus === 'CREATED')){
+                let arr = this.$store.state.sample.details
+                var idx = _.findIndex(arr, item => item.orderid === value.orderid && item.sampleid === value.sampleid)
+                arr[idx].active = value.active === 'N' ? 'Y':'N'
+                this.$store.commit("sample/update_details",arr)
+            }
+        },
+        changeFlagImageReceive(value){
+            console.log('changeFlagImageReceive')
+            if(this.xact !== 'new' && this.currStatus !== 'DONE'){
+                let arr = this.$store.state.sample.details
+                var idx = _.findIndex(arr, item => item.orderid === value.orderid && item.sampleid === value.sampleid)
+                arr[idx].flag_image_receive = value.flag_image_receive === 'N' ? 'Y':'N'
+                this.$store.commit("sample/update_details",arr)
+            }
+        },
+        changeFlagResultReceive(value){
+            console.log('changeFlagResultReceive')
+            if(this.xact !== 'new' && this.currStatus !== 'DONE'){
+                let arr = this.$store.state.sample.details
+                var idx = _.findIndex(arr, item => item.orderid === value.orderid && item.sampleid === value.sampleid)
+                arr[idx].flag_result_receive = value.flag_result_receive === 'N' ? 'Y':'N'
+                this.$store.commit("sample/update_details",arr)
+            }
+        },
+        deleteTrx(){
+            var trx = this.$store.state.sample.selected_transaction
+            console.log(trx)
+            let msg = "Yakin, akan menghapus data transaksi "+trx.trx_numbering+" ?"
+            this.$store.commit("sample/update_msg_confirmation_delete",msg)
+            this.$store.commit("sample/update_dialog_confirmation_delete",true)
+        },
+        doDeleteTrx(){
+            var trx = this.$store.state.sample.selected_transaction
+            this.$store.dispatch("sample/deletetrx",trx)
+        },
+        releaseToCourier(){
+            var trx = this.$store.state.sample.selected_transaction
+            var msg = "Anda yakin akan menyerahkan dokumen transaksi "+trx.trx_numbering+" ke kurir ? "
+            this.$store.commit("sample/update_msg_action",msg)
+            this.$store.commit("sample/update_act",'RELEASEC')
+            this.$store.commit("sample/update_dialog_action",true)
+        },
+        receiveDoctor(){
+            var trx = this.$store.state.sample.selected_transaction
+            var msg = "Dokumen transaksi "+trx.trx_numbering+" telah diterima dokter ? "
+            this.$store.commit("sample/update_msg_action",msg)
+            this.$store.commit("sample/update_act",'RCVDOC')
+            this.$store.commit("sample/update_dialog_action",true)
+        },
+        receiveFromCourier(){
+            var trx = this.$store.state.sample.selected_transaction
+            var msg = "Dokumen transaksi "+trx.trx_numbering+" diterima dari kurir ? "
+            this.$store.commit("sample/update_msg_action",msg)
+            this.$store.commit("sample/update_act",'DONE')
+            this.$store.commit("sample/update_dialog_action",true)
+        },
+        forceClose(){
+            var trx = this.$store.state.sample.selected_transaction
+            var msg = "Dokumen transaksi "+trx.trx_numbering+" ditutup ? "
+            this.$store.commit("sample/update_msg_action",msg)
+            this.$store.commit("sample/update_act",'FORCEDONE')
+            this.$store.commit("sample/update_dialog_action",true)
+        },
+        closeDialogAction(){
+            var act = this.$store.state.sample.act
+            var trx = this.$store.state.sample.selected_transaction
+            let arrtrx = this.$store.state.sample.transactions
+            var idx = _.findIndex(arrtrx, item => item.trx_id === trx.trx_id)
+            var prm = {}
+            prm.act = act
+            prm.trx = trx
+            prm.startdate = this.$store.state.sample.start_date
+            prm.enddate = this.$store.state.sample.end_date
+            prm.search  = this.$store.state.sample.name_lab
+            prm.stationid = this.$store.state.sample.selected_station.id
+            prm.lastid = idx
+            prm.details = this.$store.state.sample.details
+            prm.trx_note = this.xnote
+            this.$store.dispatch("sample/doaction",prm)
+        },
+    }
+}
+</script>

test/vuex/cpone-sample-lab/cpone-resultentry-so-others/components/oneWalkLetterSoList.vue

@@ -0,0 +1,493 @@
+<template>
+   <v-layout class="fill-height" column>
+      <v-dialog v-model="dialogsuccess" persistent  max-width="290">
+        <v-card>
+            <v-card-title color="success"  class="headline">Berhasil !</v-card-title>
+            <v-card-text>
+                {{msgsuccess}}
+            </v-card-text>
+            <v-card-actions>
+            <v-spacer></v-spacer>
+            <v-btn color="green darken-1" flat @click="closeDialogSuccess">OK</v-btn>
+            </v-card-actions>
+        </v-card>
+      </v-dialog>
+      <v-card   class="mb-2 pa-2">
+         <v-layout row>
+            <v-flex xs12 >
+               <v-layout align-center justify-space-around row fill-height>
+                  <v-flex  style="align-items: center;" text-xs-left xs12>
+                     <v-menu
+                        bottom
+                        origin="center center"
+                        transition="scale-transition"
+                     >
+                        <template v-slot:activator="{ on }">
+                        <v-btn
+                           color="primary"
+                           dark
+                           small
+                           v-on="on"
+                        >
+                           {{selected_itemgroupname}}
+                        </v-btn>
+                        </template>
+
+                        <v-list>
+                        <v-list-tile
+                           v-for="(itemgroup, i) in itemgroups"
+                           :key="i"
+                           @click="selectgroup(itemgroup)"
+                        >
+                           <v-list-tile-title>{{ itemgroup.title }}</v-list-tile-title>
+                        </v-list-tile>
+                        </v-list>
+                     </v-menu>
+        
+                    
+                
+                     <v-menu
+                        bottom
+                        origin="center center"
+                        transition="scale-transition"
+                     >
+                        <template v-slot:activator="{ on }">
+                        <v-btn
+                           color="info"
+                           dark
+                           small
+                           v-on="on"
+                        >
+                           {{selected_itemsubgroupname}}
+                        </v-btn>
+                        </template>
+
+                        <v-list>
+                        <v-list-tile
+                           v-for="(itemsubgroup, i) in itemsubgroups"
+                           :key="i"
+                           @click="selectsubgroup(itemsubgroup)"
+                        >
+                           <v-list-tile-title>{{ itemsubgroup.title }}</v-list-tile-title>
+                        </v-list-tile>
+                        </v-list>
+                     </v-menu>
+                  </v-flex>
+               </v-layout>
+            </v-flex>
+         </v-layout>
+      </v-card>
+      <v-card   class="mb-2 pa-2 searchbox">
+         <v-layout row >
+               <v-menu class="xs3 pr-2"
+                          v-model="menufilterdatestart"
+                          :close-on-content-click="false"
+                          :nudge-right="40"
+                          lazy
+                          transition="scale-transition"
+                          offset-y
+                          full-width
+                          max-width="290px"
+                          min-width="290px"
+                          >
+                          <template v-slot:activator="{ on }">
+                              <v-text-field
+                               class="mt-1"
+                              v-model="filterComputedDateFormattedStart"
+                              label="Filter Tanggal Awal"
+                              outline
+                              readonly
+                              v-on="on"
+                              @blur="date = deFormatedDate(filterComputedDateFormattedStart)"
+                              ></v-text-field>
+                          </template>
+                          <v-date-picker v-model="xdatestart" no-title @input="menufilterdatestart = false"></v-date-picker>
+                      </v-menu>
+
+               <v-menu class="xs3 pl-2"
+                          v-model="menufilterdateend"
+                          :close-on-content-click="false"
+                          :nudge-right="40"
+                          lazy
+                          transition="scale-transition"
+                          offset-y
+                          full-width
+                          max-width="290px"
+                          min-width="290px"
+                          >
+                          <template v-slot:activator="{ on }">
+                              <v-text-field
+                              class="mt-1"
+                              v-model="filterComputedDateFormattedEnd"
+                              label="Filter Tanggal Akhir"
+                              outline
+                              readonly
+                              v-on="on"
+                              @blur="date = deFormatedDate(filterComputedDateFormattedEnd)"
+                              ></v-text-field>
+                          </template>
+                          <v-date-picker v-model="xdateend" no-title @input="menufilterdateend = false"></v-date-picker>
+                      </v-menu>
+               <v-text-field class="xs4 ma-1"
+                             label="Nomor Transaksi"
+                             placeholder="Cari ..."
+                             outline
+                             v-model="xnamelab"
+                             hide-details
+                             ></v-text-field>
+               <v-select class="xs3 ma-1" :items="xstations" 
+                  item-text="name"
+                  return-object
+                  v-model="xselectedstation"
+                  label="Status" outline   hide-details></v-select>
+            <v-btn class="xs3 ma-1" color="success"  @click="searchTransaction" >Cari</v-btn>
+            <v-btn class="xs3 ma-1" color="info"  @click="setNewTransaction" >Baru</v-btn>
+         </v-layout>
+      </v-card>
+      <v-card >
+         <v-layout row>
+            <v-flex xs12 pl-2 pr-2 pt-2 pb-2>
+               <v-data-table 
+                  :headers="headers" 
+                  :items="xtransactions"
+                  :loading="isLoading"
+                  :pagination.sync="pagination"
+                   class="elevation-1">
+                  <template slot="items" slot-scope="props">
+                     <td class="text-xs-left pa-2" v-bind:class="{'amber lighten-4':isSelected(props.item)}" @click="selectMe(props.item)">{{ props.item.ordernumber }}</td>
+                     <td class="text-xs-left pa-2" v-bind:class="{'amber lighten-4':isSelected(props.item)}" @click="selectMe(props.item)">{{ props.item.orderdate}}</td>
+                     <td class="text-xs-left pa-2" v-bind:class="{'amber lighten-4':isSelected(props.item)}" @click="selectMe(props.item)">{{ props.item.patient_fullname}}</td>
+                     <td class="text-xs-center pa-2" v-bind:class="{'amber lighten-4':isSelected(props.item)}" @click="selectMe(props.item)">{{ props.item.status_name}}</td>
+                  </template>
+                  <template>
+                     <div class="text-xs-center">
+                        <v-pagination
+                           v-model="page"
+                           :length="15"
+                           :total-visible="7"
+                        ></v-pagination>
+                     </div>
+                  </template>
+               </v-data-table>
+            </v-flex>
+         </v-layout>
+      </v-card>
+       <one-dialog-alert :status="openalertconfirmation" :msg="msgalertconfirmation" @forget-dialog-alert="forgetAlertConfirmation()" @close-dialog-alert="closeAlertConfirmation()"></one-dialog-alert>
+       <one-dialog-info :status="opendialoginfo" :msg="msginfo" @close-dialog-info="closeDialogInfo()"></one-dialog-info>
+   </v-layout>
+</template>
+
+<style scoped>
+.searchbox .v-input.v-text-field .v-input__slot{
+   min-height:60px;
+}
+.searchbox .v-btn {
+   min-height:60px;
+}
+table.v-table tbody td,table.v-table tbody th {
+   height: 40px;
+}
+
+table.v-table thead tr {
+   height: 40px;
+}
+
+</style>
+
+<script>
+module.exports = {
+components : {
+      'one-dialog-info':httpVueLoader('../../common/oneDialogInfo.vue'),
+      'one-dialog-alert':httpVueLoader('../../common/oneDialogAlert.vue')
+   },
+   mounted() {
+      this.$store.dispatch("sample/getgroups",{
+         startdate:this.xdatestart,
+         enddate: this.xdateend,
+         search:this.xnamelab,
+         stationid:this.xselectedstation.id,
+         lastid:-1
+      })
+   },
+   methods : {
+      formatDate (date) {
+         if (!date) return null
+
+         const [year, month, day] = date.split('-')
+         return `${day}-${month}-${year}`
+      },
+      deFormatedDate (date) {
+          if (!date) return null
+
+         const [ day,month, year] = date.split('-')
+         return `${year}-${month.padStart(2, '0')}-${day.padStart(2, '0')}`
+      },
+      isSelected(p) {
+         return p.trx_id == this.$store.state.sample.selected_transaction.trx_id
+      },
+      searchTransaction() {
+         this.$store.dispatch("sample/search",{
+            startdate:this.xdatestart,
+            enddate: this.xdateend,
+            search:this.xnamelab,
+            stationid:this.xselectedstation.id,
+            groupid:this.$store.state.sample.select_item_group.id,
+            subgroupid:this.$store.state.sample.select_item_subgroup.id,
+            lastid:-1
+         })
+      },
+      selectMe(trx) {
+         if(this.$store.state.sample.no_save == 0 ){
+            //console.log(trx)
+            this.$store.commit("sample/update_selected_transaction",trx)
+            this.$store.commit("sample/update_act",'edit')
+            this.$store.commit("sample/update_trx_note",trx.trx_note)
+            this.$store.commit("sample/update_trx_date",trx.trx_date)
+            if(trx.doctor_fulname !== null){
+               this.$store.commit("sample/update_selected_doctor",{id:trx.So_WalkLetterCourierM_DoctorID,name:trx.doctor_fullname})
+               this.$store.commit("sample/update_doctor_address",trx.doctoraddress)
+               this.$store.commit("sample/update_selected_doctor_address",{id:trx.So_WalkLetterCourierM_DoctorAddressID,name:trx.doctor_address})
+               this.$store.commit("sample/update_selected_courier",{id:trx.So_WalkLetterCourierM_StaffID,name:trx.courier_name})
+            }
+            else{
+               this.$store.commit("sample/update_selected_doctor",{})
+            }
+
+             
+            if(trx.details.length > 0 ){
+                  this.$store.commit("sample/update_details", trx.details)
+            }
+            else{
+               this.$store.commit("sample/update_details", [])
+            }
+           
+         }else{
+            this.$store.commit("sample/update_open_alert_confirmation",true)
+         }
+      },
+      closeAlertConfirmation(){
+          this.$store.commit("sample/update_open_alert_confirmation",false)
+      },
+      forgetAlertConfirmation(){
+          this.$store.commit("sample/update_no_save",0)
+          this.$store.commit("sample/update_open_alert_confirmation",false)
+      },
+      updateAlert_success(val){
+         this.$store.commit("sample/update_alert_success",val)
+      },
+      setNewTransaction(){
+         this.$store.commit("sample/update_selected_transaction",{})
+         this.$store.commit("sample/update_details",[])
+         this.$store.commit("sample/update_selected_detail",{})
+         this.$store.commit("sample/update_selected_doctor",{})
+         this.$store.commit("sample/update_selected_doctor_address",{})
+         this.$store.commit("sample/update_selected_courier",{})
+         this.$store.commit("sample/update_trx_date",moment(new Date()).format('YYYY-MM-DD'))
+         this.$store.commit("sample/update_trx_note",'')
+         this.$store.commit("sample/update_act",'new')
+      },
+      closeDialogSuccess(){
+         let arrtrx = this.$store.state.sample.transactions
+         var idx = _.findIndex(arrtrx, item => item.So_WalkLetterCourierID === this.$store.state.sample.last_id)
+         //console.log(idx)
+         this.$store.dispatch("sample/search",{
+            startdate:this.xdatestart,
+            enddate: this.xdateend,
+            search:this.xnamelab,
+            stationid:this.xselectedstation.id,
+            lastid:idx
+         })
+         this.$store.commit("sample/update_dialog_success",false)
+      },
+      closeDialogInfo(){
+            this.$store.commit("sample/update_open_dialog_info",false)
+            var trxs  = this.$store.state.sample.transactions
+            var trx  = this.$store.state.sample.selected_transaction
+            var idx = _.findIndex(trxs, item => item.T_OrderHeaderID === trx.T_OrderHeaderID &&  item.T_SampleTypeID === trx.T_SampleTypeID)
+            this.$store.dispatch("sample/search",{
+                startdate:this.xdatestart,
+                enddate: this.xdateend,
+                stationid:this.xselectedstation.id,
+                lastid:idx
+            })
+          
+      },
+      selectgroup(value){
+         this.selected_itemgroup = value
+      },
+      selectsubgroup(value){
+         this.selected_itemsubgroup = value
+      }
+   },
+   computed: {
+      dialogsuccess: {
+         get() {
+            return this.$store.state.sample.dialog_success
+         },
+         set(val) {
+            this.$store.commit("sample/update_dialog_success",val)
+         }
+      },
+      msgsuccess(){
+         return this.$store.state.sample.msg_success
+      },
+      snackbar: {
+         get() {
+            return this.$store.state.sample.alert_success
+         },
+         set(val) {
+            this.$store.commit("sample/update_alert_success",val)
+         }
+      },
+      isLoading() {
+         return this.$store.state.sample.search_status == 1
+      },
+      itemgroups() {
+         return this.$store.state.sample.item_groups
+      },
+      selected_itemgroupname() {
+         return this.$store.state.sample.selected_itemgroupname
+      },
+      selected_itemgroup: {
+         get() {
+            //console.log(this.$store.state.sample.select_item_group)
+            return this.$store.state.sample.select_item_group
+         },
+         set(val) {
+            this.$store.commit("sample/update_select_item_group",val)
+            this.$store.commit("sample/update_selected_itemgroupname",val.fulltitle)
+            this.$store.commit("sample/update_item_subgroups",val.childrens)
+            this.$store.commit("sample/update_select_item_subgroup",val.childrens[0])
+            this.$store.commit("sample/update_selected_itemsubgroupname",val.childrens[0].fulltitle)
+         }
+      },
+      itemsubgroups() {
+         return this.$store.state.sample.item_subgroups
+      },
+      selected_itemsubgroupname() {
+         return this.$store.state.sample.selected_itemsubgroupname
+      },
+      selected_itemsubgroup: {
+         get() {
+            return this.$store.state.sample.select_item_subgroup
+         },
+         set(val) {
+            this.$store.commit("sample/update_select_item_subgroup",val)
+             this.$store.commit("sample/update_selected_itemsubgroupname",val.fulltitle)
+         }
+      },
+      xdatestart : {
+         get() {
+            return this.$store.state.sample.start_date
+         },
+         set(val) {
+            this.$store.commit("sample/update_start_date",val)
+         }
+      },
+      xdateend : {
+         get() {
+            return this.$store.state.sample.end_date
+         },
+         set(val) {
+            this.$store.commit("sample/update_end_date",val)
+         }
+      },
+      xnamelab : {
+         get() {
+            return this.$store.state.sample.name_lab
+         },
+         set(val) {
+            this.$store.commit("sample/update_name_lab",val)
+         }
+      },
+      filterComputedDateFormattedStart () {
+         return this.formatDate(this.xdatestart)
+      },
+      filterComputedDateFormattedEnd () {
+         return this.formatDate(this.xdateend)
+      },
+      xstations() {
+         return this.$store.state.sample.stations
+      },
+      xselectedstation: {
+         get() {
+            return this.$store.state.sample.selected_station
+         },
+         set(val) {
+            this.$store.commit("sample/update_selected_station",val)
+         }
+      },
+      xtransactions() {
+         //console.log(this.$store.state.sample.transactions)
+         return this.$store.state.sample.transactions
+      },
+      openalertconfirmation: {
+         get() {
+            return this.$store.state.sample.open_alert_confirmation
+         },
+         set(val) {
+            this.$store.commit("sample/update_open_alert_confirmation",val)
+         }
+      },
+      opendialoginfo: {
+            get() {
+                  return this.$store.state.sample.open_dialog_info
+            },
+            set(val) {
+                  this.$store.commit("sample/update_open_dialog_info",false)
+            }
+      },
+      msginfo(){
+            return this.$store.state.sample.msg_info
+      },
+   },
+   data() {
+      return {
+         msgalertconfirmation:"Perubahan yang telah dilakukan belum disimpan dong !",
+         menufilterdatestart:false,
+         menufilterdateend:false,
+         date: new Date().toISOString().substr(0, 10),
+         items: [],
+         name: '',
+         page:1,
+         headers: [
+            {
+               text: "NOMOR LAB",
+               align: "left",
+               sortable: false,
+               width: "10%",
+               class: "pa-2 blue lighten-3 white--text"
+            },
+            {
+               text: "TANGGAL",
+               align: "left",
+               sortable: false,
+               width: "10%",
+               class: "pa-2 blue lighten-3 white--text"
+            },
+            {
+               text: "PASIEN",
+               align: "left",
+               sortable: false,
+               width: "15%",
+               class: "pa-2 blue lighten-3 white--text"
+            },
+            {
+               text: "STATUS",
+               align: "center",
+               sortable: false,
+               width: "10%",
+               class: "pa-2 blue lighten-3 white--text"
+            }
+         ],
+         pagination:{
+            descending: false,
+            page: 1,
+            rowsPerPage: 5,
+            sortBy: 'trx_id ASC',
+            totalItems: this.$store.state.sample.total_transactions
+         }
+      };
+   }
+}
+</script>

test/vuex/cpone-sample-lab/cpone-resultentry-so-others/components/vue-signature.vue

@@ -0,0 +1,145 @@
+<template id="vue-signature" :style="{width:w,height:h}">
+    <canvas style="border:1px solid #000000;" :id="uid" class="canvas" :data-uid="uid"></canvas>
+</template>
+
+
+
+<script>
+
+module.exports = {
+    mounted(){
+        var _this = this;
+        this.$nextTick(() => {
+        _this.draw()
+        });
+    },
+    props:{
+    sigOption: {
+      type:Object,
+      default:()=>{
+        return {
+          backgroundColor:'rgb(255,255,255)',
+          penColor : 'rgb(0, 0, 0)'
+        }
+      },
+    },
+    w:{
+      type:String,
+      default:"100%"
+    },
+    h:{
+      type:String,
+      default:"100%"
+    },
+    clearOnResize:{
+      type:Boolean,
+      default:false
+    }
+  },
+  data(){
+    return {
+      sig:()=>{},
+      option:{
+        backgroundColor:'rgb(255,255,255)',
+        penColor : 'rgb(0, 0, 0)'
+      },
+      uid:""
+    }
+  },
+  created(){
+    var _this = this;
+    this.uid = "canvas" + _this._uid
+    var sigOptions = Object.keys(_this.sigOption);
+    for(var item of sigOptions){
+      _this.option[item] = _this.sigOption[item]
+    }
+  },
+  methods:{
+    draw(){
+      var _this = this;
+      var canvas = document.getElementById(_this.uid)
+      _this.sig = new SignaturePad(canvas,_this.option);
+      function resizeCanvas() {
+        var url;
+        if(!_this.isEmpty()){
+          url = _this.save();
+        }
+        var ratio =  Math.max(window.devicePixelRatio || 1, 1);
+        canvas.width = canvas.offsetWidth * ratio;
+        canvas.height = canvas.offsetHeight * ratio;
+        canvas.getContext("2d").scale(ratio, ratio);
+        _this.clear();
+        !_this.clearOnResize && url !== undefined && _this.fromDataURL(url)
+      }
+      window.addEventListener("resize", resizeCanvas);
+      resizeCanvas();
+    },
+    clear(){
+      var _this = this;
+      _this.sig.clear();
+    },
+    save(format){
+      var _this = this;
+      return format ? _this.sig.toDataURL(format) :  _this.sig.toDataURL()
+      // signaturePad.toDataURL(); // save image as PNG
+      // signaturePad.toDataURL("image/jpeg"); // save image as JPEG
+      // signaturePad.toDataURL("image/svg+xml"); // save image as SVG
+    },
+    fromDataURL(url){
+      var _this = this;
+      _this.sig.fromDataURL(url)
+    },
+    isEmpty(){
+      var _this = this;
+      return _this.sig.isEmpty();
+    },
+    undo(){
+      var _this = this;
+      var data = _this.sig.toData();
+      if(data){
+        data.pop()
+        _this.sig.fromData(data);
+      }
+    },
+    addWaterMark(data){
+      var _this = this;
+      if(!(Object.prototype.toString.call(data) == '[object Object]')){
+        throw new Error("Expected Object, got "+typeof data+".")
+      }else{
+        var vCanvas = document.getElementById(_this.uid);
+        var textData = {
+          text:data.text || '',
+          x:data.x || 20,
+          y:data.y || 20,
+          sx:data.sx || 40,
+          sy:data.sy || 40
+        }
+        
+        var ctx = vCanvas.getContext('2d');
+        ctx.font = data.font || '20px sans-serif';
+        ctx.fillStyle = data.fillStyle || "#333";
+        ctx.strokeStyle = data.strokeStyle || "#333";    
+        if(data.style == 'all'){
+          ctx.fillText(textData.text,textData.x,textData.y);
+          ctx.strokeText(textData.text,textData.sx,textData.sx);
+        }else if(data.style == 'stroke'){
+          ctx.strokeText(textData.text,textData.sx,textData.sx);
+        }else{
+          ctx.fillText(textData.text,textData.x,textData.y);
+        }
+        _this.sig._isEmpty = false
+      }
+    }
+  },
+  computed: {
+        dialog_xsignature: {
+            get() {
+                return this.$store.state.sample.dialog_xsignature
+            },
+            set(val) {
+                this.$store.commit("sample/update_dialog_xsignature",val)
+            }
+        },
+  }
+}
+</script>

test/vuex/cpone-sample-lab/cpone-resultentry-so-others/index.php

@@ -0,0 +1,225 @@
+<!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>CPONE</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">
+         <v-app id="smartApp" >
+         <v-snackbar
+            v-model="snackbar.value"
+            :color="snackbar.color"
+            :multi-line="snackbar.mode === 'multi-line'"
+            :timeout="snackbar.timeout"
+         >
+            {{ snackbar.text }}
+            <v-btn
+            dark
+            flat
+            @click="snackbar.value = false"
+            >
+            Tutup
+            </v-btn>
+         </v-snackbar>
+            <one-navbar v-if="search_lab_no === '' || !search_lab_no"></one-navbar>
+            <v-content style="background:#F5E8DF!important" >
+               <v-container fluid fill-height class="pl-1 pr-1 pt-2 pb-2">
+                  <v-layout row wrap >
+                     <v-flex xs5 v-if="search_lab_no === '' || !search_lab_no" class="left fill-height pa-1">
+                     <!--<v-btn
+            color="primary"
+            flat
+            @click="openDialog()"
+          >
+            buka
+          </v-btn>-->
+                        <one-resultentry-so-list></one-resultentry-so-list>
+                     </v-flex>
+                     <v-flex v-bind:class="{'xs12': search_lab_no !== '', 'xs7': search_lab_no === ''  || !search_lab_no}" class="right fill-height pa-1" >
+                        <one-resultentry-so-form></one-resultentry-so-form>
+                     </v-flex>
+                  </v-layout>
+                  
+               </v-container>
+               
+               
+            </v-content>
+            <one-footer v-if="search_lab_no === ''"> </one-footer>
+         </v-app>
+      </div>
+<style>
+
+canvas {
+    width: 100%;
+    height: 100%;
+    
+    border: 1px #5fca83 dashed;
+    border-radius: 7px;
+}
+
+.signature-pad-container {
+    width: 50vw;
+    height: 35vh;
+    max-height: 30em;
+    min-width: 40em;
+    min-height: 25em;
+    padding: 2em;
+    
+    position: relative;
+    
+    background-color: white;
+    box-shadow: 0 0 20px 1px #ddd;
+    
+    text-align: right;
+}
+#clear_button {
+    z-index: 10;
+    position: absolute;
+    right: 2em;
+    padding: 1.5em 2em;
+    
+    color: #21cfa6;
+    font-weight: 600;
+    font-size: 14pt;
+    cursor: pointer;
+}
+
+</style>
+      <!-- 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/signature_pad.min.js"></script>
+      <script src="../../../libs/vendor/merge-images.js"></script>
+
+      <script src="../../../libs/one_global.js"></script>
+      <!-- App Script -->
+<?php
+$ts = "?ts=" . Date("ymdhis");
+?>
+
+<script type="module">
+
+
+window.calculate_age = function (inp_dob) {
+   var now = moment(new Date())
+   var dob = moment(new Date(inp_dob))
+   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)) return ''
+   return `${year} tahun ${month} bulan ${day} hari`
+}
+
+
+import { store } from './store.js<?php echo $ts ?>';
+
+
+//for testing
+window.store = store;
+
+
+
+new Vue({
+store,
+   el: '#app',
+   mounted() {
+      //this.draw()
+     
+   },
+   data: () => ({
+         dialog:false
+    }),
+   computed: {
+      search_lab_no(){
+         return this.$store.state.sample.search_lab_no
+      },
+      snackbar:{
+         get() {
+               return this.$store.state.sample.snackbar
+         },
+         set(val) {
+               this.$store.commit("sample/update_snackbar",val)
+         }
+      },
+   },
+   methods: {
+   /*clear(){
+      var _this = this;
+      _this.sig.clear();
+   },
+   save(format){
+      var _this = this;
+      //return format ? _this.sig.toDataURL(format) :  _this.sig.toDataURL()
+      console.log(_this.sig.toDataURL()) // save image as PNG
+      // signaturePad.toDataURL("image/jpeg"); // save image as JPEG
+      // signaturePad.toDataURL("image/svg+xml"); // save image as SVG
+   },
+   openDialog(){
+         this.dialog_xsignature=true
+         this.$nextTick(() => {
+            this.draw()
+         });
+   },
+   draw(){
+      var _this = this;
+      var canvas = document.getElementById("signature_pad")
+      //var canvas = document.querySelector("#signature_pad");
+      _this.sig = new SignaturePad(canvas, {
+         minWidth: 2,
+         maxWidth: 4,
+      });
+
+      function resizeCanvas() {
+         var ratio =  Math.max(window.devicePixelRatio || 1, 1);
+         canvas.width = canvas.offsetWidth * ratio;
+         canvas.height = canvas.offsetHeight * ratio;
+         canvas.getContext("2d").scale(ratio, ratio);
+         let storedData = _this.sig.toData();
+         _this.sig.clear(); // otherwise isEmpty() might return incorrect value
+         _this.sig.fromData(storedData);
+      }
+
+      window.addEventListener("resize", resizeCanvas);
+      resizeCanvas();
+   },*/
+   tab_selected : function(tab) {
+      return this.$store.state.tab_selected == tab
+      }
+   },
+   components: {
+         'one-navbar': httpVueLoader('../../../apps/components/oneNavbarComponent.vue'),
+         'one-footer': httpVueLoader('../../../apps/components/oneFooter.vue'),
+         'one-resultentry-so-list': httpVueLoader('./components/oneResultEntrySoList.vue'),
+         'one-resultentry-so-form': httpVueLoader('./components/oneResultEntrySoForm.vue')
+      }
+    })
+    </script>
+    <style>
+[v-cloak] {
+   display: none
+}
+   .left {
+   }
+   .right {
+   }
+    </style>
+   </body>
+
+</html>

test/vuex/cpone-sample-lab/cpone-resultentry-so-others/modules/Uploaddata.php

@@ -0,0 +1,704 @@
+<?php
+class Preregister extends MY_Controller
+{
+   var $db_onedev;
+   public function index()
+   {
+      echo "Patient API";
+   }
+
+   public function __construct()
+   {
+      parent::__construct();
+      $this->db_onedev = $this->load->database("onedev", true);
+   }
+
+   public function search()
+   {
+      $prm = $this->sys_input;
+		if (! $this->isLogin) {
+			$this->sys_error("Invalid Token");
+			exit;
+		}
+		$norm = $prm["snorm"];
+		$nama = $prm["name"];
+
+	   // echo $norm;
+
+		$sql_where = "WHERE Mcu_PreregisterDetailsIsActive = 'Y' ";
+		$sql_param = array();
+		if ($nama != "") {
+		   if ($sql_where != "") {
+			  $sql_where .=" and ";
+		   }
+		   $sql_where .= " Mcu_PreregisterDetailsPatientName like ? ";
+		   $sql_param[] = "%$nama%";
+		}
+		if ($norm != "") {
+		   if ($sql_where != "") {
+			  $sql_where .=" and ";
+		   }
+		   $sql_where .= " M_PatientNoReg like ? ";
+		   $sql_param[] = "%$norm%";
+		}
+
+		$limit = '';
+		if($all == 'N'){
+			$limit = ' LIMIT 10';
+		}
+		$number_limit = 10;
+		$number_offset = ($prm['current_page'] - 1) * $number_limit ;
+		$sql = "  SELECT count(*) as total
+				  FROM mcu_preregister_patients
+				  $sql_where
+				  ";
+		//echo $sql;
+		  $query = $this->db_onedev->query($sql, $sql_param);
+          //echo $this->db_onedev->last_query();
+          $tot_count = 0;
+          $tot_page = 0;
+          if ($query) {
+             $tot_count = $query->result_array()[0]["total"];
+             $tot_page = ceil($tot_count/$number_limit);
+          } else {
+             $this->sys_error_db("m_patient count", $this->db_onedev);
+             exit;
+          }
+
+		  $sql = 	"SELECT mcu_preregister_patients.*,
+				DATE_FORMAT(Mcu_PreregisterDetailsDOB, '%d-%m-%Y') as dob
+				  FROM mcu_preregister_patients
+				  $sql_where
+				  ORDER BY Mcu_PreregisterDetailsPatientName ASC
+				  limit $number_limit offset $number_offset
+				  ";
+		  //echo $sql;
+		  $query = $this->db_onedev->query($sql, $sql_param);
+		  $rows = $query->result_array();
+		  if($rows){
+			foreach($rows as $k => $v){
+				//$rows[$k]['verification_px'] = $this->add_verification_test($v['M_PatientID']);
+
+			}
+		}
+
+		$sql = "SELECT mcu_offline_prepare.*,M_CompanyName,
+				DATE_FORMAT(McuOfflinePrepareStartDate, '%d.%m.%Y') as start_date,
+				DATE_FORMAT(McuOfflinePrepareStartDate, '%d.%m.%Y') as end_date
+				FROM mcu_offline_prepare
+				JOIN m_company ON McuOfflinePrepareM_CompanyID = M_CompanyID
+				WHERE
+					McuOfflinePrepareIsDownloaded = 'Y' AND 
+					McuOfflinePrepareIsActive = 'Y'";
+		$xrow = $this->db_onedev->query($sql)->row_array();
+
+		//$this->_add_address($rows);
+		$result = array("total" => $tot_page, "records" => $rows, "setup"=> $xrow);
+		$this->sys_ok($result);
+		exit;
+   }
+
+	function getsexreg(){
+		if (! $this->isLogin) {
+			$this->sys_error("Invalid Token");
+			exit;
+		}
+		$rows = [];
+		$query ="	SELECT *
+					FROM m_title
+					WHERE
+					M_TitleIsActive = 'Y'
+		";
+	//echo $query;
+		$rows['titles'] = $this->db_onedev->query($query)->result_array();
+
+		$query ="	SELECT *
+					FROM m_sex
+					WHERE
+						M_SexIsActive = 'Y'
+				";
+				//echo $query;
+		$rows['sexes'] = $this->db_onedev->query($query)->result_array();
+		$query ="	SELECT *
+					FROM m_religion
+					WHERE
+						M_ReligionIsActive = 'Y'
+				";
+				//echo $query;
+		$rows['religions'] = $this->db_onedev->query($query)->result_array();
+
+		$query ="	SELECT *
+		FROM m_idtype
+		WHERE
+		M_IdTypeIsActive = 'Y'
+	";
+	//echo $query;
+	$rows['kartuidentitass'] = $this->db_onedev->query($query)->result_array();
+
+
+		$result = array(
+			"total" => count($rows) ,
+			"records" => $rows,
+		);
+		$this->sys_ok($result);
+		exit;
+	}
+	
+	function gotoreg(){
+		if (! $this->isLogin) {
+			$this->sys_error("Invalid Token");
+			exit;
+		}
+		
+		$userid = $this->sys_user["M_UserID"];
+		$prm = $this->sys_input;
+		
+		$new_status = "Y";
+		$patient_id = 0;
+		if(!$prm["Mcu_PreregisterDetailsNIK"] && $prm["Mcu_PreregisterDetailsNIK"] != ''){
+			$sql = "SELECT * 
+					FROM m_patient
+					WHERE
+						M_PatientNIK = '{$prm["Mcu_PreregisterDetailsNIK"]}' AND M_PatientIsActive = 'Y'";
+			$exist_r = $this->db_onedev->query($sql)->row_array();
+			if($exist_r){
+				$patient_id  = $exist_r["M_PatientID"];
+			}
+		}
+		
+		if(!$prm["Mcu_PreregisterDetailsPID"] && $prm["Mcu_PreregisterDetailsPID"] != ''){
+			$sql = "SELECT * 
+					FROM m_patient
+					WHERE
+						M_PatientNIK = '{$prm["M_PatientNoReg"]}' AND M_PatientIsActive = 'Y' LIMIT 1";
+			$exist_r = $this->db_onedev->query($sql)->row_array();
+			if($exist_r){
+				$patient_id  = $exist_r["M_PatientID"];
+			}
+		}
+		
+		if($patient_id == 0){
+			$pdob = date('Y-m-d',strtotime($prm['Mcu_PreregisterDetailsDOB']));
+			$sql = "SELECT * 
+					FROM m_patient
+					WHERE
+						M_PatientName = '{$prm["Mcu_PreregisterDetailsPatientName"]}' AND 
+						M_PatientDOB = '{$pdob}' AND 
+						M_PatientIsActive = 'Y' LIMIT 1";
+			$exist_r = $this->db_onedev->query($sql)->row_array();
+			if($exist_r){
+				$patient_id  = $exist_r["M_PatientID"];
+			}
+		}
+		
+		if($patient_id == 0){
+			$sex_id = 0;
+			$sql = "SELECT * FROM m_sex WHERE M_SexCode = '{$prm["Mcu_PreregisterDetailsM_SexCode"]}' AND M_SexIsActive = 'Y' LIMIT 1";
+			$sex_id = $this->db_onedev->query($sql)->row()->M_SexID;
+			
+			$title_id = 0;
+			$sql = "SELECT * FROM m_title WHERE M_TitleM_SexID = '{$sex_id}' AND M_TitleIsActive = 'Y' ORDER BY M_TitleID ASC LIMIT 1";
+			$title_id = $this->db_onedev->query($sql)->row()->M_TitleID;
+			
+			$religion_id = 0;
+			$sql = "SELECT * FROM m_religion WHERE M_ReligionName = 'OTHERS' AND M_ReligionIsActive = 'Y' LIMIT 1";
+			$religion_id = $this->db_onedev->query($sql)->row()->M_ReligionID;
+			
+			$pdob = date('Y-m-d',strtotime($prm['Mcu_PreregisterDetailsDOB']));
+			$sql = "INSERT INTO m_patient (
+						M_PatientName,
+						M_PatientM_TitleID,
+						M_PatientM_SexID,
+						M_PatientM_ReligionID,
+						M_PatientPOB,
+						M_PatientDOB,
+						M_PatientNIK,
+						M_PatientJabatan,
+						M_PatientLocation,
+						M_PatientKedudukan,
+						M_PatientJob,
+						M_PatientEmail,
+						M_PatientHP,
+						M_PatientUserID
+					)
+					VALUES(
+						'{$prm["Mcu_PreregisterDetailsPatientName"]}',
+						{$title_id},
+						{$sex_id},
+						{$religion_id},
+						'-',
+						'{$pdob}',
+						'{$prm["Mcu_PreregisterDetailsNIK"]}',
+						'{$prm['Mcu_PreregisterDetailsJabatan']}',
+						'{$prm['Mcu_PreregisterDetailsLocation']}',
+						'{$prm['Mcu_PreregisterDetailsKedudukan']}',
+						'{$prm['Mcu_PreregisterDetailsJob']}',
+						'{$prm['Mcu_PreregisterDetailsEmail']}',
+						'{$prm['Mcu_PreregisterDetailsHp']}',
+						'{$userid}'
+					)";
+			//echo $sql;
+			$this->db_onedev->query($sql);
+			$patient_id = $this->db_onedev->insert_id();
+			$sql = "SELECT * FROM m_patient WHERE M_PatientID = {$patient_id}";
+			$ptn = $this->db_onedev->query($sql)->row_array();
+			$ptn = json_encode($ptn);
+            $this->db_onedev->query("CALL one_log.log_me('PATIENT', 'PATIENT.ADD', '{$ptn}', $userid)");
+			
+			$sql = "SELECT * 
+					FROM mcu_preregister_patients 
+					JOIN mcu_offline_prepare ON McuOfflinePrepareID	= Mcu_PreregisterDetailsMcuOfflinePrepareID
+					WHERE 
+						Mcu_PreregisterDetailsID = {$prm['Mcu_PreregisterDetailsID']}";
+			$data_xall = $this->db_onedev->query($sql)->row();
+			
+			$sql = "INSERT INTO m_patientaddress (
+						M_PatientAddressM_PatientID,
+						M_PatientAddressDescription,
+						M_PatientAddressM_KelurahanID,
+						M_PatientAddressCreated
+					)
+					VALUES(
+						{$patient_id},
+						'{$data_xall->M_CompanyAddress}',
+						'{$data_xall->M_CompanyM_KelurahanID}',
+						NOW()
+					)";
+			$this->db_onedev->query($sql);
+			$patient_addr_id = $this->db_onedev->insert_id();
+			$sql = "SELECT * FROM m_patientaddress WHERE M_PatientAddressID = {$patient_addr_id}";
+			$ptn_addr = $this->db_onedev->query($sql)->row_array();
+			$ptn_addr = json_encode($ptn_addr);
+			$this->db_onedev->query("CALL one_log.log_me('PATIENT', 'PATIENT.ADDR_ADD', '{$ptn_addr}', $userid)");
+			
+			
+		}
+		else{
+			$pdob = date('Y-m-d',strtotime($prm['Mcu_PreregisterDetailsDOB']));
+			$sql ="UPDATE m_patient SET
+					M_PatientEmail = '{$prm['Mcu_PreregisterDetailsEmail']}',
+					M_PatientHP = '{$prm['Mcu_PreregisterDetailsHp']}',
+					M_PatientNIK = '{$prm['Mcu_PreregisterDetailsNIK']}',
+					M_PatientJabatan = '{$prm['Mcu_PreregisterDetailsJabatan']}',
+					M_PatientKedudukan = '{$prm['Mcu_PreregisterDetailsKedudukan']}',
+					M_PatientLocation = '{$prm['Mcu_PreregisterDetailsLocation']}',
+					M_PatientJob = '{$prm['Mcu_PreregisterDetailsJob']}'
+				WHERE
+					M_PatientID = '{$patient_id}'
+				";
+				//echo $query;
+			$this->db_onedev->query($sql);
+			
+			$sql = "SELECT * FROM m_patient WHERE M_PatientID = {$patient_id}";
+			$ptn = $this->db_onedev->query($sql)->row_array();
+			$ptn = json_encode($ptn);
+            $this->db_onedev->query("CALL one_log.log_me('PATIENT', 'PATIENT.EDIT', '{$ptn}', $userid)");
+		}
+		
+		$sql = "UPDATE mcu_preregister_patients SET Mcu_PreregisterDetailsM_PatientID = {$patient_id} WHERE Mcu_PreregisterDetailsID = {$prm['Mcu_PreregisterDetailsID']}";
+		$this->db_onedev->query($sql);
+		$result = array(
+			"total" => 1 ,
+			"records" => $ptn,
+		);
+		$this->sys_ok($result);
+		exit;
+	}
+	
+	function searchcity(){
+		if (! $this->isLogin) {
+        $this->sys_error("Invalid Token");
+        exit;
+        }
+		$prm = $this->sys_input;
+
+		$max_rst = 12;
+		$tot_count =0;
+
+		$q = [
+			'search'     => '%'
+		];
+
+		if ($prm['search'] != '')
+		{
+			$q['search'] = "%{$prm['search']}%";
+		}
+
+		  // QUERY TOTAL
+		$sql = "SELECT count(*) as total
+				FROM m_city
+				WHERE
+				M_CityName like ?
+				AND M_CityIsActive = 'Y'";
+		$query = $this->db_onedev->query($sql,$q['search']);
+		//echo $query;
+		if ($query) {
+			$tot_count = $query->result_array()[0]["total"];
+		}
+		else {
+			$this->sys_error_db("m_city count",$this->db_onedev);
+			exit;
+		}
+
+		$sql = "
+			SELECT *
+			FROM m_city
+			WHERE
+			M_CityName like ?
+			AND M_CityIsActive = 'Y'
+			ORDER BY M_CityName DESC
+		  ";
+		  $query = $this->db_onedev->query($sql, array($q['search']));
+
+		  if ($query) {
+			 $rows = $query->result_array();
+			 //echo $this->db_onedev->last_query();
+			 $result = array("total" => $tot_count, "records" => $rows, "total_display" => sizeof($rows));
+			 $this->sys_ok($result);
+		  }
+		  else {
+			 $this->sys_error_db("m_city rows",$this->db_onedev);
+			 exit;
+		  }
+	}
+	function getdistrict(){
+		$prm = $this->sys_input;
+		$query ="	SELECT *
+					FROM m_district
+					WHERE
+						M_DistrictIsActive = 'Y' AND M_DistrictM_CityID = ?
+				";
+				//echo $query;
+		$rows = $this->db_onedev->query($query,array($prm['id']))->result_array();
+
+		$result = array(
+			"total" => count($rows) ,
+			"records" => $rows,
+		);
+		$this->sys_ok($result);
+		exit;
+	}
+
+	function getkelurahan(){
+		$prm = $this->sys_input;
+		$query ="	SELECT *
+					FROM m_kelurahan
+					WHERE
+						M_KelurahanIsActive = 'Y' AND M_KelurahanM_DistrictID = ?
+				";
+				//echo $query;
+		$rows = $this->db_onedev->query($query,array($prm['id']))->result_array();
+
+		$result = array(
+			"total" => count($rows) ,
+			"records" => $rows,
+		);
+		$this->sys_ok($result);
+		exit;
+	}
+
+	function save(){
+		if (! $this->isLogin) {
+			$this->sys_error("Invalid Token");
+			exit;
+		}
+		$userid = $this->sys_user["M_UserID"];
+		$prm = $this->sys_input;
+		$datas = $prm['data'];
+		//print_r($prm);
+		$sql = "truncate mcu_preregister_patients";
+		$this->db_onedev->query($sql);
+		foreach($datas as $k => $v){
+			$pdob = date('Y-m-d',strtotime($v['TANGGAL_LAHIR']));
+			$query = "	INSERT INTO mcu_preregister_patients (
+							Mcu_PreregisterDetailsMcuOfflinePrepareID,
+							Mcu_PreregisterDetailsPID,
+							Mcu_PreregisterDetailsNIK,
+							Mcu_PreregisterDetailsPatientName,
+							Mcu_PreregisterDetailsEmail,
+							Mcu_PreregisterDetailsHp,
+							Mcu_PreregisterDetailsDOB,
+							Mcu_PreregisterDetailsKedudukan,
+							Mcu_PreregisterDetailsJabatan,
+							Mcu_PreregisterDetailsJob,
+							Mcu_PreregisterDetailsLocation,
+							Mcu_PreregisterDetailsM_SexCode,
+							Mcu_PreregisterDetailsCreated,
+							Mcu_PreregisterDetailsUserID
+						)
+						VALUES(
+							'{$prm['xid']}',
+							'{$v['PID']}',
+							'{$v['NIK']}',
+							'{$v['NAMA']}',
+							'{$v['EMAIL']}',
+							'{$v['HP']}',
+							'{$pdob}',
+							'{$v['KEDUDUKAN']}',
+							'{$v['JABATAN']}',
+							'{$v['JOB']}',
+							'{$v['LOKASI']}',
+							'{$v['JENIS_KELAMIN']}',
+							NOW(),
+							{$userid}
+						)";
+			//echo $query;
+			$rows = $this->db_onedev->query($query);
+		}
+
+		$result = array(
+			"total" => 1 ,
+			"records" => array('status'=>'OK')
+		);
+    
+		$this->sys_ok($result);
+		exit;
+	}
+
+	function newpatient(){
+		if (! $this->isLogin) {
+			$this->sys_error("Invalid Token");
+			exit;
+		}
+                $prm = $this->sys_input;
+                $userid = $this->sys_user["M_UserID"];
+
+		$pdob = date('Y-m-d',strtotime($prm['M_PatientDOB']));
+		$query ="INSERT INTO m_patient (
+						M_PatientM_TitleID,
+						M_PatientPrefix,
+						M_PatientName,
+						M_PatientSuffix,
+						M_PatientDOB,
+						M_PatientM_SexID,
+						M_PatientM_ReligionID,
+						M_PatientEmail,
+						M_PatientPOB,
+						M_PatientHP,
+						M_PatientPhone,
+						M_PatientM_IdTypeID,
+						M_PatientIDNumber,
+						M_PatientNote,
+						M_PatientNIK,
+						M_PatientJabatan,
+						M_PatientKedudukan,
+						M_PatientPJ,
+						M_PatientLocation,
+						M_PatientJob,
+						M_PatientUserID
+					)
+					VALUES(
+						'{$prm['M_PatientM_TitleID']}',
+						'{$prm['M_PatientPrefix']}',
+						'{$prm['M_PatientName']}',
+						'{$prm['M_PatientSuffix']}',
+						'{$pdob}',
+						'{$prm['M_PatientM_SexID']}',
+						'{$prm['M_PatientM_ReligionID']}',
+						'{$prm['M_PatientEmail']}',
+						'{$prm['M_PatientPOB']}',
+						'{$prm['M_PatientHP']}',
+						'{$prm['M_PatientPhone']}',
+						'{$prm['M_PatientM_IdTypeID']}',
+						'{$prm['M_PatientIDNumber']}',
+						'{$prm['M_PatientNote']}',
+						'{$prm['M_PatientNIK']}',
+						'{$prm['M_PatientJabatan']}',
+						'{$prm['M_PatientKedudukan']}',
+						'{$prm['M_PatientPJ']}',
+						'{$prm['M_PatientLocation']}',
+						'{$prm['M_PatientJob']}',
+						$userid
+					)
+				";
+				//echo $query;
+		$rows = $this->db_onedev->query($query);
+		$last_id = $this->db_onedev->insert_id();
+		$result = array(
+			"total" => 1 ,
+			"records" => array('status'=>'OK'),
+			"id" => $last_id
+                     );
+               $ptn = $prm;
+               $ptn["M_PatientID"] = $last_id;
+               $ptn["M_PatientDOB"] = $pdob;
+               $ptn = json_encode($ptn);
+               $this->db_onedev->query("CALL one_log.log_me('PATIENT', 'PATIENT.ADD', '{$ptn}', $userid)");
+	       $this->sys_ok($result);
+	       exit;
+	}
+
+	function deletepatient(){
+		if (! $this->isLogin) {
+			$this->sys_error("Invalid Token");
+			exit;
+		}
+    $userid = $this->sys_user["M_UserID"];
+		$prm = $this->sys_input;
+		$query ="UPDATE m_patient SET
+					M_PatientIsActive = 'N'
+				WHERE
+					M_PatientID = '{$prm['M_PatientID']}'
+				";
+				//echo $query;
+		$rows = $this->db_onedev->query($query);
+
+		$result = array(
+			"total" => 1 ,
+			"records" => array('status'=>'OK')
+		);
+    $ptn = $prm;
+    $ptn["M_PatientDOB"] = $pdob;
+    $ptn = json_encode($ptn);
+    $this->db_onedev->query("CALL one_log.log_me('PATIENT', 'PATIENT.DELETE', '{$ptn}', $userid)");
+		$this->sys_ok($result);
+		exit;
+	}
+
+	function getaddress(){
+		if (! $this->isLogin) {
+			$this->sys_error("Invalid Token");
+			exit;
+		}
+		$prm = $this->sys_input;
+		$query ="	SELECT m_patientaddress.*,
+					M_KelurahanName,
+					M_DistrictID,
+					M_DistrictName,
+					M_CityID,
+					M_CityName,
+					'' as action
+					FROM m_patientaddress
+					JOIN m_kelurahan ON M_PatientAddressM_KelurahanID = M_KelurahanID
+					JOIN m_district ON M_KelurahanM_DistrictID = M_DistrictID
+					JOIN m_city ON M_DistrictM_CityID = M_CityID
+					WHERE
+						M_PatientAddressIsActive = 'Y' AND M_PatientAddressM_PatientID = ?
+				";
+				//echo $query;
+		$rows = $this->db_onedev->query($query,array($prm['id']))->result_array();
+		if($rows){
+			foreach($rows as $k => $v){
+				$rows[$k]['action'] = '<v-icon color="error" @click="deleteAddress(props.item)">delete</v-icon>';
+				$rows[$k]['action'] .= '<v-icon color="primary" @click="deleteAddress(props.item)">edit</v-icon>';
+
+			}
+		}
+		$result = array(
+			"total" => count($rows) ,
+			"records" => $rows,
+		);
+		$this->sys_ok($result);
+		exit;
+	}
+	function savenewaddress(){
+		if (! $this->isLogin) {
+			$this->sys_error("Invalid Token");
+			exit;
+		}
+    $userid = $this->sys_user["M_UserID"];
+		$prm = $this->sys_input;
+		$count_addrs = $this->db_onedev->query("SELECT COUNT(*) as countx FROM m_patientaddress WHERE M_PatientAddressM_PatientID = '{$prm['M_PatientAddressM_PatientID']}' AND M_PatientAddressIsActive = 'Y'")->row()->countx;
+
+		//echo $this->db_onedev->last_query();
+		if($count_addrs == 0){
+			$prm['M_PatientAddressNote'] = 'Utama';
+		}
+		else{
+			$count_addrs_utama = $this->db_onedev->query("SELECT COUNT(*) as countx FROM m_patientaddress WHERE M_PatientAddressM_PatientID = '{$prm['M_PatientAddressM_PatientID']}' AND M_PatientAddressNote = 'Utama' AND M_PatientAddressIsActive = 'Y'")->row()->countx;
+			if($count_addrs_utama > 0 && strtolower($prm['M_PatientAddressNote']) == 'utama'){
+				$rx = date('YmdHis');
+				$prm['M_PatientAddressNote'] = 'Utama_'.$rx;
+			}
+		}
+		$query ="INSERT INTO m_patientaddress (
+						M_PatientAddressM_PatientID,
+						M_PatientAddressNote,
+						M_PatientAddressDescription,
+						M_PatientAddressM_KelurahanID,
+						M_PatientAddressCreated
+					)
+					VALUES(
+						'{$prm['M_PatientAddressM_PatientID']}',
+						'{$prm['M_PatientAddressNote']}',
+						'{$prm['M_PatientAddressDescription']}',
+						'{$prm['M_PatientAddressM_KelurahanID']}',
+						NOW()
+					)
+				";
+				//echo $query;
+		$rows = $this->db_onedev->query($query);
+
+		$result = array(
+			"total" => 1 ,
+			"records" => array('status'=>'OK')
+		);
+    $ptn = $prm;
+    $ptn["M_UserID"] = $pdob;
+    $ptn = json_encode($ptn);
+    $this->db_onedev->query("CALL one_log.log_me('PATIENT', 'PATIENT.ADDR_ADD', '{$ptn}', $userid)");
+		$this->sys_ok($result);
+		exit;
+	}
+
+	function saveeditaddress(){
+		if (! $this->isLogin) {
+			$this->sys_error("Invalid Token");
+			exit;
+		}
+    $userid = $this->sys_user["M_UserID"];
+		$prm = $this->sys_input;
+
+		$query ="UPDATE m_patientaddress SET
+						M_PatientAddressM_PatientID = '{$prm['M_PatientAddressM_PatientID']}',
+						M_PatientAddressNote = '{$prm['M_PatientAddressNote']}',
+						M_PatientAddressDescription = '{$prm['M_PatientAddressDescription']}',
+						M_PatientAddressM_KelurahanID = '{$prm['M_PatientAddressM_KelurahanID']}'
+					WHERE
+						M_PatientAddressID = '{$prm['M_PatientAddressID']}'
+				";
+				//echo $query;
+		$rows = $this->db_onedev->query($query);
+
+		$result = array(
+			"total" => 1 ,
+			"records" => array('status'=>'OK')
+		);
+    $ptn = $prm;
+    $ptn["M_UserID"] = $pdob;
+    $ptn = json_encode($ptn);
+    $this->db_onedev->query("CALL one_log.log_me('PATIENT', 'PATIENT.ADDR_EDIT', '{$ptn}', $userid)");
+		$this->sys_ok($result);
+		exit;
+	}
+
+	function deleteaddress(){
+		if (! $this->isLogin) {
+			$this->sys_error("Invalid Token");
+			exit;
+		}
+    $userid = $this->sys_user["M_UserID"];
+		$prm = $this->sys_input;
+
+		$query ="UPDATE m_patientaddress SET
+						M_PatientAddressIsActive = 'N'
+					WHERE
+						M_PatientAddressID = '{$prm['M_PatientAddressID']}'
+				";
+				//echo $query;
+		$rows = $this->db_onedev->query($query);
+
+		$result = array(
+			"total" => 1 ,
+			"records" => array('status'=>'OK')
+		);
+    $ptn = $prm;
+    $ptn["M_UserID"] = $pdob;
+    $ptn = json_encode($ptn);
+    $this->db_onedev->query("CALL one_log.log_me('PATIENT', 'PATIENT.ADDR_DELETE', '{$ptn}', $userid)");
+		$this->sys_ok($result);
+		exit;
+	}
+
+
+}

test/vuex/cpone-sample-lab/cpone-resultentry-so-others/modules/email.js

@@ -0,0 +1,46 @@
+// 1 => LOADING
+// 2 => DONE
+// 3 => ERROR
+import * as api from "../api/email.js"
+
+export default {
+    namespaced: true,
+    state: {
+        loading: false,
+        error: '',
+        format:'',
+    },
+    mutations: {
+        update_loading(state, val) {
+            state.loading= val
+        },
+        update_error(state, val) {
+            state.error= val
+        },
+        update_format(state, val) {
+            state.format = val
+        },
+    },
+    actions: {
+        async save(context, prm) {
+            context.commit("update_loading", true)
+            try {
+                prm.token = one_token()
+                context.commit("update_format", '')
+                let resp = await api.save(prm)
+                context.commit("update_loading", false)
+                if (resp.status != "OK") {
+                    context.commit("update_error", resp.message)
+                } else {
+                    context.commit("update_error", "")
+                    let format = prm.format
+                    context.commit("update_format", format)
+                    var seltrx =  context.rootState.sample.selected_transaction
+                    seltrx.deliveries = resp.data
+                }
+            } catch (e) {
+                context.commit("update_error", e.message)
+            }
+        },
+    }
+}

test/vuex/cpone-sample-lab/cpone-resultentry-so-others/store.js

@@ -0,0 +1,29 @@
+// State
+//  data ...
+// Mutations
+//
+//
+// Actions
+import sample from "./modules/sample.js";
+import email from "./modules/email.js";
+import system from "../../../apps/modules/system/system.js";
+export const store = new Vuex.Store({
+    modules: {
+        email,
+        sample: sample,
+        system: system
+    },
+    state: {
+        tab_selected: 'pasien-dokter'
+    },
+    mutations: {
+        change_tab(state, ntab) {
+            state.tab_selected = ntab
+        }
+    },
+    actions: {
+        change_tab(context, ntab) {
+            context.commit('change_tab', ntab)
+        }
+    }
+});

test/vuex/cpone-sample-lab/index.php

@@ -0,0 +1,155 @@
+<!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>CPONE</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 v-on:key="doSomething">
+   <div v-cloak id="app">
+      <v-app id="smartApp">
+         <one-navbar></one-navbar>
+         <v-content style="background:#F5E8DF!important">
+            <v-container fluid fill-height class="pl-1 pr-1 pt-2 pb-2">
+               <v-layout row wrap>
+                  <v-flex xs12>
+                     <one-sample-call-so-filter></one-sample-call-so-filter>
+                  </v-flex>
+                  <v-flex xs6 class="left" fill-height pa-1>
+                     <one-sample-call-so-list></one-sample-call-so-list>
+                  </v-flex>
+                  <v-flex xs6 class="right" fill-height pa-1>
+                     <one-sample-call-so-info></one-sample-call-so-info>
+                     <one-sample-call-so-detail></one-sample-call-so-detail>
+                     <one-order-info></one-order-info>
+                  </v-flex>
+               </v-layout>
+            </v-container>
+         </v-content>
+         <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/one_global.js"></script>
+   <script src="../../../libs/one_print_barcode.js"></script>
+   <script src="../../../libs/vendor/socket.io.js"></script>
+   <!-- App Script -->
+   <?php
+   $ts = "?ts=" . Date("ymdhis");
+   ?>
+   <script type="module">
+      window.calculate_age = function(inp_dob) {
+         var now = moment(new Date())
+         var dob = moment(new Date(inp_dob))
+         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)) return ''
+         return `${year} tahun ${month} bulan ${day} hari`
+      }
+
+      var socketIoUrl = "http://" + window.location.host + ":9099/";
+      // var socketIoUrl = "http://" + window.location.host + ":9090/";
+
+      import {
+         store
+      } from './store.js<?php echo $ts ?>';
+
+      //for testing
+      window.store = store;
+      let ts = "?ts=" + moment().format("YYYYMMDDHHmmss");
+      new Vue({
+         data: {
+            socket: io.connect(socketIoUrl, {
+               forceNew: false
+            })
+         },
+         store,
+         el: '#app',
+         mounted() {
+            document.addEventListener('keypress', logKeyboard)
+            window.key_enter = ''
+            async function logKeyboard(e) {
+
+               window.key_enter = (window.key_enter + e.key).toUpperCase()
+               if (e.key == 'Enter') {
+                  if (window.key_enter.includes('STF')) {
+                     var prm = {
+                        search: window.key_enter.replace('ENTER', '').trim()
+                     }
+                     await store.dispatch("samplecall/search_staff", prm)
+                  } else {
+                     var prm = {
+                        search: window.key_enter.replace('ENTER', '').trim()
+                     }
+                     store.dispatch("samplecall/search_patient_enter", prm)
+                  }
+                  window.key_enter = ''
+               }
+
+            }
+            let self = this;
+            this.socket.on("notification", function(msg) {
+               switch (msg.type) {
+                  case "specimen-col-process":
+                  case "fo-verification-y":
+                     self.$store.dispatch("samplecall/search", {
+                        xdate: self.$store.state.samplecall.start_date,
+                        name: self.$store.state.samplecall.name,
+                        nolab: self.$store.state.samplecall.nolab,
+                        stationid: self.$store.state.samplecall.selected_station.id,
+                        statusid: self.$store.state.samplecall.selected_status.id,
+                        companyid: self.$store.state.samplecall.selected_company.id,
+                        lastid: self.$store.state.samplecall.last_id
+                     });
+                     break;
+               }
+            });
+
+         },
+         methods: {
+            tab_selected: function(tab) {
+               return this.$store.state.tab_selected == tab
+            }
+         },
+         components: {
+            'one-navbar': httpVueLoader('../../../apps/components/oneNavbarComponent.vue' + ts),
+            'one-footer': httpVueLoader('../../../apps/components/oneFooter.vue' + ts),
+            'one-sample-call-so-list': httpVueLoader('./components/oneSampleCallSOList.vue' + ts),
+            'one-sample-call-so-filter': httpVueLoader('./components/oneSampleCallSOFilter.vue' + ts),
+            'one-sample-call-so-info': httpVueLoader('./components/oneSampleCallSOInfo.vue' + ts),
+            'one-sample-call-so-detail': httpVueLoader('./components/oneSampleCallSODetail.vue' + ts),
+            'one-order-info': httpVueLoader('./components/oneOrderInfo.vue' + ts)
+         }
+      })
+   </script>
+   <style>
+      [v-cloak] {
+         display: none
+      }
+
+      .left {}
+
+      .right {}
+   </style>
+</body>
+
+</html>

test/vuex/cpone-sample-lab/modules/comment.js

@@ -0,0 +1,77 @@
+import * as api from "../api/comment.js"
+
+export default {
+   namespaced: true,
+   state: {
+      show: false,
+      loading: false,
+      patient: {},
+      history: [],
+      comment: '',
+      error: ''
+   },
+   mutations: {
+      update_show(state, val) {
+         state.show= val     
+      },
+      update_loading(state, val) {
+         state.loading= val
+      },
+      update_patient(state, val) {
+         state.patient= val
+      },
+      update_comment(state, val) {
+         state.comment= val
+      },
+      update_history(state, val) {
+         state.history= val
+      },
+      update_error(state, val) {
+         state.error= val
+      },
+   },
+   actions: {
+      async load(context) {
+         context.commit("update_loading", true)
+         try {
+            let prm = {
+               T_OrderHeaderID: context.state.patient.T_OrderHeaderID,
+               token: one_token()
+            }
+            let resp = await api.load(prm)
+            if (resp.status != "OK") {
+               context.commit("update_loading", false)
+               context.commit("update_error", resp.message)
+            } else {
+               context.commit("update_loading", false)
+               context.commit("update_error", "")
+               context.commit("update_history", resp.data.data)
+            }
+         } catch (e) {
+            context.commit("update_loading", false)
+            context.commit("update_error", e.message)
+         }
+      },
+      async save(context) {
+         context.commit("update_loading", true)
+         try {
+            let prm = {
+               T_OrderHeaderID: context.state.patient.T_OrderHeaderID,
+               T_OrderHeaderSamplingNote : context.state.patient.T_OrderHeaderSamplingNote,
+               token: one_token()
+            }
+            let resp = await api.save(prm)
+            if (resp.status != "OK") {
+               context.commit("update_loading", false)
+               context.commit("update_error", resp.message)
+            } else {
+               context.commit("update_loading", false)
+               context.commit("update_error", "")
+            }
+         } catch (e) {
+            context.commit("update_loading", false)
+            context.commit("update_error", e.message)
+         }
+      }
+   }
+}

test/vuex/cpone-sample-lab/modules/order_info.js

@@ -0,0 +1,45 @@
+import * as api from "../api/order_info.js"
+
+export default {
+    namespaced: true,
+    state: {
+        show:false,
+        loading: false,
+        error_message: '',
+	orders: []
+    },
+    mutations: {
+        update_loading(state, val) {
+            state.loading = val
+        },
+        update_show(state, val) {
+            state.show= val
+        },
+        update_error_message(state, val) {
+            state.error_message= val
+        },
+	update_orders(state,val) {
+            state.orders = val
+	}
+    },
+    actions: {
+        async search(context, prm) {
+            context.commit("update_loading", true)
+            try {
+                prm.token = one_token()
+                context.commit("update_loading",true)
+                context.commit("update_show",true)
+                let resp = await api.search(prm)
+                if (resp.status != "OK") {
+                    context.commit("update_error_message", resp.message)
+                } else {
+                    context.commit("update_error_message", "")
+                    context.commit("update_orders", resp.data)
+                    context.commit("update_loading",false)
+                }
+            } catch (e) {
+                context.commit("update_error_message", e.message)
+            }
+        },
+    }
+}

test/vuex/cpone-sample-lab/modules/req.js

@@ -0,0 +1,58 @@
+import * as api from "../api/req.js"
+
+export default {
+   namespaced: true,
+   state: {
+      show: false,
+      loading: false,
+      patient: {},
+      requirements: '',
+      note: {},
+      error: ''
+   },
+   mutations: {
+      update_show(state, val) {
+         state.show= val     
+      },
+      update_note(state, val) {
+         state.note= val     
+      },
+      update_loading(state, val) {
+         state.loading= val
+      },
+      update_patient(state, val) {
+         state.patient= val
+      },
+      update_requirements(state, val) {
+         state.requirements= val
+      },
+      update_error(state, val) {
+         state.error= val
+      },
+   },
+   actions: {
+      async load(context) {
+         context.commit("update_loading", true)
+         context.commit("update_note", {})
+         try {
+            let prm = {
+               T_OrderHeaderID: context.state.patient.T_OrderHeaderID,
+               token: one_token()
+            }
+            let resp = await api.req(prm)
+            if (resp.data.status != "OK") {
+               context.commit("update_loading", false)
+               context.commit("update_error", resp.message)
+            } else {
+               context.commit("update_loading", false)
+               context.commit("update_error", "")
+               context.commit("update_requirements", resp.data.data)
+               context.commit("update_note", resp.data.note)
+            }
+         } catch (e) {
+            context.commit("update_loading", false)
+            context.commit("update_error", e.message)
+         }
+      }
+   }
+}

test/vuex/cpone-sample-lab/store.js

@@ -0,0 +1,33 @@
+// State
+//  data ...
+// Mutations
+//
+//
+// Actions
+import samplecall from "./modules/samplecall.js";
+import order_info from "./modules/order_info.js";
+import req from "./modules/req.js";
+import comment from "./modules/comment.js";
+import system from "../../../apps/modules/system/system.js";
+export const store = new Vuex.Store({
+    modules: {
+        samplecall: samplecall,
+        system: system,
+        order_info: order_info,
+        req,
+        comment
+    },
+    state: {
+        tab_selected: 'pasien-dokter'
+    },
+    mutations: {
+        change_tab(state, ntab) {
+            state.tab_selected = ntab
+        }
+    },
+    actions: {
+        change_tab(context, ntab) {
+            context.commit('change_tab', ntab)
+        }
+    }
+});