Flatten nested repos

test/vuex/one-sample-electromedis-v5/api/order_info.js

@@ -0,0 +1,20 @@
+const URL = "/one-api/mockup/samplingelectromedis-v5/";
+
+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/one-sample-electromedis-v5/api/samplecall.js

@@ -0,0 +1,492 @@
+const URL = "/one-api/mockup/samplingelectromedis-v5/";
+
+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 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 doconfirm(prm) {
+  try {
+    var resp = await axios.post(URL + "samplingcall/doconfirm", 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 fillform(prm) {
+  try {
+    var resp = await axios.post(URL + "samplingcall/fillform", 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 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/one-sample-electromedis-v5/components/components/oneSampleCallSODetail.vue

@@ -0,0 +1,717 @@
+<template>
+  <v-layout class="mb-2 mt-2" column>
+    <v-dialog v-model="dialogrequirement" persistent max-width="45%">
+      <v-card class="mb-2">
+        <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" :key="req.id" 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-dialog v-model="dialogform" persistent max-width="25%">
+      <v-card>
+        <v-card-title color="primary" class="headline"
+          >Isi form di bawah ini :</v-card-title
+        >
+        <v-card-text>
+          <v-layout row>
+            <v-flex xs12>
+              <v-text-field
+                label="Voltase (kV)"
+                v-model="formx.form_kv"
+              ></v-text-field>
+            </v-flex>
+          </v-layout>
+          <v-layout row>
+            <v-flex xs12>
+              <v-text-field
+                label="Arus (mA)"
+                v-model="formx.form_ma"
+              ></v-text-field>
+            </v-flex>
+          </v-layout>
+          <v-layout row>
+            <v-flex xs12>
+              <v-text-field
+                label="Second (s)"
+                v-model="formx.form_second"
+              ></v-text-field>
+            </v-flex>
+          </v-layout>
+          <v-layout row>
+            <v-flex xs12>
+              <v-text-field
+                label="Expose"
+                v-model="formx.form_expose"
+              ></v-text-field>
+            </v-flex>
+          </v-layout>
+        </v-card-text>
+        <v-card-actions>
+          <v-spacer></v-spacer>
+          <v-btn color="grey darken-1" flat @click="saveForm()">Tutup</v-btn>
+          <!--<v-btn color="primary" flat @click="saveForm()">Simpan</v-btn>-->
+        </v-card-actions>
+      </v-card>
+    </v-dialog>
+    <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="notes.fo_note !== ''" mb-2 row>
+            <v-flex mb-2 xs3>
+              <span style="color: #0f80db" class="mono name">FO</span>
+            </v-flex>
+            <v-flex xs9>
+              <v-layout row>
+                <v-flex mb-1 xs12>
+                  <code
+                    style="
+                      box-shadow: none !important;
+                      color: #0f80db !important;
+                      background-color: #a8cfee6b !important;
+                    "
+                    >{{ notes.fo_note_user }}</code
+                  >
+                  <div class="v-markdown">
+                    <p style="margin-top: 2px; margin-bottom: 0">
+                      {{ notes.fo_note }}
+                    </p>
+                  </div>
+                </v-flex>
+              </v-layout>
+            </v-flex>
+          </v-layout>
+          <v-layout v-if="notes.fo_ver_note !== ''" mb-2 row>
+            <v-flex mb-2 xs3>
+              <span style="color: #0f80db" class="mono name"
+                >FO Verifikasi</span
+              >
+            </v-flex>
+            <v-flex xs9>
+              <v-layout row>
+                <v-flex mb-1 xs12>
+                  <code
+                    style="
+                      box-shadow: none !important;
+                      color: #0f80db !important;
+                      background-color: #a8cfee6b !important;
+                    "
+                    >{{ notes.fo_ver_note_user }}</code
+                  >
+                  <div class="v-markdown">
+                    <p style="margin-top: 2px; margin-bottom: 0">
+                      {{ notes.fo_ver_note }}
+                    </p>
+                  </div>
+                </v-flex>
+              </v-layout>
+            </v-flex>
+          </v-layout>
+          <v-layout v-if="notes.sampling_note !== ''" mb-2 row>
+            <v-flex mb-2 xs3>
+              <span style="color: #0f80db" class="mono name">Sampling</span>
+            </v-flex>
+            <v-flex xs9>
+              <v-layout row>
+                <v-flex mb-1 xs12>
+                  <code
+                    style="
+                      box-shadow: none !important;
+                      color: #0f80db !important;
+                      background-color: #a8cfee6b !important;
+                    "
+                    >{{ notes.sampling_note_user }}</code
+                  >
+                  <div class="v-markdown">
+                    <p style="margin-top: 2px; margin-bottom: 0">
+                      {{ notes.sampling_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-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-card
+      style="overflow-y: auto; max-height: 450px"
+      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_reg_status_req === 'N' ||
+                  selected_patient.fo_verification_status !== 'X'
+                "
+                @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 class="grey lighten-2" row>
+            <v-flex xs3> PEMERIKSAAN </v-flex>
+            <v-flex xs3> TINDAKAN </v-flex>
+            <v-flex xs3> REQUIREMENT </v-flex>
+            <v-flex class="text-xs-center" xs3> AKSI </v-flex>
+          </v-layout>
+          <v-layout pa-1 row v-for="(sampletype, idx) in xsampletypes">
+            <v-flex xs12>
+              <v-layout align-center pa-2 class="grey lighten-4" row>
+                <v-flex xs3>
+                  {{ sampletype.test_name }}
+                </v-flex>
+                <v-flex xs3>
+                  <p v-if="sampletype.status !== 'X'" class="mb-0">
+                    {{ sampletype.T_SampleTypeName }}
+                  </p>
+                  <p
+                    v-if="sampletype.status === 'X'"
+                    style="text-decoration: line-through"
+                    class="red--text mb-0"
+                  >
+                    {{ sampletype.T_SampleTypeName }}
+                  </p>
+                </v-flex>
+                <v-flex xs3>
+                  <div
+                    v-if="
+                      selected_patient.status === 'Process' ||
+                      selected_patient.status === 'Done'
+                    "
+                  >
+                    <span
+                      v-if="sampletype.type === 'xray'"
+                      @click="fillForm(sampletype, idx)"
+                      v-bind:class="{
+                        white: sampletype.fill_form === 'N',
+                        primary: sampletype.fill_form === 'Y',
+                      }"
+                      class="icon-medium-fill-base-small white"
+                      ><v-icon :dark="sampletype.fill_form === 'Y'"
+                        >edit</v-icon
+                      ></span
+                    >
+                    <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" xs3>
+                  <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' ||
+                        selected_patient.status === 'Done') &&
+                      sampletype.requirement_status !== 'X' &&
+                      sampletype.fill_form === 'Y'
+                    "
+                    @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.requirement_status === 'X' ||
+                        sampletype.fill_form !== 'Y')
+                    "
+                    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, idx) 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>
+    <one-order-info></one-order-info>
+  </v-layout>
+</template>
+
+<style scoped></style>
+
+<script>
+module.exports = {
+  components: {
+    "one-x-check": httpVueLoader("../../common/onexcheck.vue"),
+    "one-order-info": httpVueLoader("./oneSampleOrderInfo.vue"),
+  },
+  data: () => ({
+    checkbox: false,
+    //formx:{}
+  }),
+  computed: {
+    notes() {
+      return this.$store.state.samplecall.notes;
+    },
+    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;
+    },
+    dialognote: {
+      get() {
+        return this.$store.state.samplecall.dialog_note;
+      },
+      set(val) {
+        this.$store.commit("samplecall/update_dialog_note", val);
+      },
+    },
+    dialogform: {
+      get() {
+        return this.$store.state.samplecall.dialog_form;
+      },
+      set(val) {
+        this.$store.commit("samplecall/update_dialog_form", 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);
+      },
+    },
+    dialogrequirement: {
+      get() {
+        return this.$store.state.samplecall.dialog_requirement;
+      },
+      set(val) {
+        this.$store.commit("samplecall/update_dialog_requirement", 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);
+      },
+    },
+    formx: {
+      get() {
+        return this.$store.state.samplecall.selected_sample;
+      },
+      set(val) {
+        this.$store.commit("samplecall/update_selected_sample", 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);
+    },
+    fillForm(sampletype, idx) {
+      //this.formx = sampletype
+      console.log(sampletype);
+      var sampletypes = this.$store.state.samplecall.sampletypes;
+      this.$store.commit("samplecall/update_selected_sample", sampletypes[idx]);
+      this.$store.commit("samplecall/update_dialog_form", true);
+    },
+    saveForm() {
+      var sample = this.$store.state.samplecall.selected_sample;
+      var sampletypes = this.$store.state.samplecall.sampletypes;
+      console.log(sampletypes);
+      var idx = _.findIndex(sampletypes, function (o) {
+        return o.id == sample.id;
+      });
+      console.log(idx);
+
+      sampletypes[idx] = sample;
+      sampletypes[idx].fill_form = "N";
+
+      if (
+        parseFloat(sampletypes[idx].form_expose) > 0 &&
+        parseFloat(sampletypes[idx].form_kv) > 0 &&
+        parseFloat(sampletypes[idx].form_ma) > 0 &&
+        parseFloat(sampletypes[idx].form_second) > 0
+      )
+        sampletypes[idx].fill_form = "Y";
+
+      this.$store.commit("samplecall/update_sampletypes", sampletypes);
+      this.$store.commit("samplecall/update_dialog_form", false);
+    },
+    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);
+    },
+    doConfirm() {
+      var id = this.selected_patient.T_OrderHeaderID;
+      var stationid = this.selected_patient.T_SampleStationID;
+      this.$store.dispatch("samplecall/doConfirm", {
+        id: id,
+        stationid: stationid,
+      });
+    },
+    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);
+      }
+    },
+    openDialogFormNote() {
+      this.dialogformnote = true;
+    },
+    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);
+    },
+    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,
+      });
+    },
+    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_OrderHeaderID == selected_sample.T_OrderHeaderID &&
+          o.T_SampleTypeID == selected_sample.T_SampleTypeID
+        );
+      });
+      if (sampletypes[idx].status === "P") {
+        sampletypes[idx].requirements =
+          this.$store.state.samplecall.requirements;
+      }
+      this.$store.commit("samplecall/update_dialog_requirement", false);
+    },
+    openDialogFoNoteRequirement() {
+      var prm = this.$store.state.samplecall.selected_patient;
+      this.$store.dispatch("samplecall/getdatanoterequirement", prm);
+    },
+    checkReq(val, idx) {
+      var selected_sample = this.$store.state.samplecall.selected_sample;
+      var xrequirements = this.requirements;
+      if (selected_sample.status === "P" && xrequirements[idx].status === "P") {
+        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.status === "P" &&
+        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);
+        }
+      }
+    },
+  },
+};
+</script>

test/vuex/one-sample-electromedis-v5/components/components/oneSampleCallSOFilter.vue

@@ -0,0 +1,478 @@
+<template>
+  <v-layout class="fill-height" column>
+    <v-card class="mb-2 pa-2 searchbox">
+      <v-layout align-center 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 xs2>
+          <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 xs2>
+          <v-autocomplete
+            label="Kel. Pelanggan"
+            v-model="selected_company"
+            class="ma-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 Kel. Pelanggan"
+          >
+            <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 ma-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 ma-1 text-truncate text-no-wrap"
+            :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/getstationstatus", {
+      name: this.name,
+      nolab: this.nolab,
+      stationid: this.xselectedstation.id,
+      statusid: this.xselectedstatus.id,
+      companyid: this.selected_company.id,
+      xdate: this.$store.state.samplecall.start_date,
+      lastid: -1,
+    });
+  },
+  methods: {
+    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.dispatch("samplecall/search", {
+        name: this.name,
+        nolab: this.nolab,
+        stationid: this.xselectedstation.id,
+        statusid: this.xselectedstatus.id,
+        companyid: this.selected_company.id,
+        xdate: this.$store.state.samplecall.start_date,
+        locationid: this.selected_location.locationID,
+        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() {
+      //this.$store.commit("samplecall/update_selected_Patient",{})
+    },
+    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;
+      //  if(idx !== -1)
+      //   xcur_page = this.$store.state.samplecall.current_page
+
+      this.$store.dispatch("samplecall/search", {
+        name: this.name,
+        nolab: this.nolab,
+        stationid: this.xselectedstation.id,
+        statusid: this.xselectedstatus.id,
+        locationid: this.selected_location.locationID,
+        // current_page:xcur_page,
+        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),
+    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")}`;
+    },
+  },
+  computed: {
+    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);
+      },
+    },
+    xdatestart: {
+      get() {
+        return this.$store.state.samplecall.start_date;
+      },
+      set(val) {
+        this.$store.commit("samplecall/update_start_date", val);
+        //this.searchTransaction()
+      },
+    },
+    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,
+          locationid: this.selected_location.locationID,
+          current_page: val,
+          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", val);
+      },
+    },
+    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 !",
+      menufilterdatestart: false,
+      items: [],
+      search_company: "",
+      //isLoading: false,
+      page: 1,
+      headers: [
+        {
+          text: "TGL. TRANSAKSI",
+          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/one-sample-electromedis-v5/components/components/oneSampleCallSOInfo.vue

@@ -0,0 +1,230 @@
+<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 xs7>
+                                                    <v-text-field
+                                                        v-model=" xselected_patient.T_OrderHeaderM_PatientAge"
+                                                        label="Umur"
+                                                        readonly
+                                                        hide-details
+                                                    >
+                                                    </v-text-field>
+                                                </v-flex>
+                                                <v-flex xs5 pl-1>
+                                                    <v-text-field
+                                                        v-model="xselected_patient.dob"
+                                                        label="TANGGAL LAHIR"
+                                                        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 xs6>
+                                            <v-text-field
+                                                v-model=" xselected_patient.patient_fullname"
+                                                label="Nama"
+                                                readonly
+                                                hide-details
+                                            >
+                                            </v-text-field>
+                                        </v-flex>
+                                        <v-flex xs6 pl-1>
+                                            <v-text-field
+                                                v-model="xselected_patient.doctor_sender"
+                                                label="Pengirim"
+                                                readonly
+                                                hide-details
+                                            >
+                                            </v-text-field>
+                                        </v-flex>
+                                    </v-layout>
+                           </v-card>
+                </v-flex>
+            </v-layout>
+            </v-card>
+        </v-flex>
+         
+    </v-layout>
+         
+    </div>
+</template>
+
+<style scoped>
+
+</style>
+
+<script>
+module.exports = {
+    data: () => ({
+          
+    }),
+    computed: {
+        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)
+            }h
+        }
+    },
+    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
+            }
+            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,
+                statusnextid : status,
+                sample:sample,
+                lastid:lastid,
+                companyid: this.$store.state.samplecall.selected_company.id,
+                staff:this.$store.state.samplecall.staff,
+                locationid: this.$store.state.samplecall.selected_location.locationID,
+            })
+            
+        },
+        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 xselected_patient = this.$store.state.samplecall.selected_patient
+                this.$store.commit("samplecall/update_act",'process')
+                this.closeDialogAction()
+            }
+            
+        },
+        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/one-sample-electromedis-v5/components/components/oneSampleCallSOList.vue

@@ -0,0 +1,491 @@
+<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-1 pl-1"
+                v-bind:class="{
+                  'black--text amber lighten-3': isSelected(props.item),
+                  amber: props.item.iscito === 'Y',
+                  'teal white--text': props.item.status_coming === 'Y',
+                }"
+                @click="selectMe(props.item)"
+              >
+                {{ props.item.order_date }}
+              </td>
+              <td
+                style="width: 10%"
+                class="text-xs-center pa-1 pl-1"
+                v-bind:class="{
+                  'black--text amber lighten-3': isSelected(props.item),
+                  amber: props.item.iscito === 'Y',
+                  'teal white--text': props.item.status_coming === 'Y',
+                }"
+                @click="selectMe(props.item)"
+              >
+                <span class="font-weight-black">{{
+                  props.item.T_OrderHeaderLabNumber
+                }}</span>
+                <span style="color: #800000" class="font-weight-bold">{{
+                  props.item.T_OrderHeaderLabNumberExt
+                }}</span>
+              </td>
+              <td
+                style="width: 15%"
+                class="text-xs-center pa-1 pl-1"
+                v-bind:class="{
+                  'black--text amber lighten-3': isSelected(props.item),
+                  amber: props.item.iscito === 'Y',
+                  'teal white--text': props.item.status_coming === 'Y',
+                }"
+                @click="selectMe(props.item)"
+              >
+                {{ props.item.M_CompanyName }}
+              </td>
+              <td
+                style="width: 20%"
+                class="text-xs-center pa-1 pl-1"
+                v-bind:class="{
+                  'black--text amber lighten-3': isSelected(props.item),
+                  amber: props.item.iscito === 'Y',
+                  'teal white--text': props.item.status_coming === 'Y',
+                }"
+                @click="selectMe(props.item)"
+              >
+                <span
+                  v-if="props.item.status_coming === 'Y'"
+                  style="text-decoration: underline"
+                  >{{ props.item.patient_fullname }}</span
+                >
+                <span v-if="props.item.status_coming === 'N'">{{
+                  props.item.patient_fullname
+                }}</span>
+              </td>
+              <td
+                style="width: 10%"
+                class="text-xs-center pa-1 pl-1"
+                v-bind:class="{
+                  'black--text amber lighten-3': isSelected(props.item),
+                  amber: props.item.iscito === 'Y',
+                  'teal white--text': props.item.status_coming === '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/getstationstatus", {
+      name: this.name,
+      nolab: this.nolab,
+      stationid: this.xselectedstation.id,
+      statusid: this.xselectedstatus.id,
+      companyid: this.selected_company.id,
+      xdate: this.$store.state.samplecall.start_date,
+      lastid: -1,
+    });
+  },
+  methods: {
+    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.dispatch("samplecall/search", {
+        name: this.name,
+        nolab: this.nolab,
+        stationid: this.xselectedstation.id,
+        statusid: this.xselectedstatus.id,
+        companyid: this.selected_company.id,
+        xdate: this.$store.state.samplecall.start_date,
+        locationid: this.selected_location.locationID,
+        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() {
+      //this.$store.commit("samplecall/update_selected_Patient",{})
+    },
+    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;
+      //  if(idx !== -1)
+      //   xcur_page = this.$store.state.samplecall.current_page
+
+      this.$store.dispatch("samplecall/search", {
+        name: this.name,
+        nolab: this.nolab,
+        stationid: this.xselectedstation.id,
+        statusid: this.xselectedstatus.id,
+        locationid: this.selected_location.locationID,
+        // current_page:xcur_page,
+        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),
+    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")}`;
+    },
+  },
+  computed: {
+    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);
+      },
+    },
+    xdatestart: {
+      get() {
+        return this.$store.state.samplecall.start_date;
+      },
+      set(val) {
+        this.$store.commit("samplecall/update_start_date", val);
+        //this.searchTransaction()
+      },
+    },
+    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: {
+      get() {
+        return this.$store.state.samplecall.patients;
+      },
+      set(val) {
+        this.$store.commit("samplecall/update_patients", val);
+      },
+    },
+    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,
+          locationid: this.selected_location.locationID,
+          current_page: val,
+          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", val);
+      },
+    },
+    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.patients = [];
+        // 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 !",
+      menufilterdatestart: false,
+      items: [],
+      search_company: "",
+      //isLoading: false,
+      page: 1,
+      headers: [
+        {
+          text: "TGL. TRANSAKSI",
+          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/one-sample-electromedis-v5/components/components/oneSampleOrderInfo.vue

@@ -0,0 +1,72 @@
+<template>
+  <div v-show="show" class="orderbox mono mt-2">
+    <h3 class="subtitle-1 font-weight-black pb-2 pl-1" style="font-size: 18px">
+      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;
+  width: 100%;
+  display: block;
+  max-height: 270px;
+  overflow-y: scroll;
+  border-radius-top: 10px;
+  margin-top: 10px;
+  box-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14),
+    0 1px 5px 0 rgba(0, 0, 0, 0.12);
+}
+.px {
+  padding: 5px;
+  width: 40%;
+  border: 1px solid #004d00;
+  display: inline-block;
+  margin: 0px 2px 0px 2px;
+}
+</style>
+
+<script>
+module.exports = {
+  components: {},
+  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 });
+    },
+  },
+};
+</script>

test/vuex/one-sample-electromedis-v5/components/oneSampleCallSODetail.vue

@@ -0,0 +1,717 @@
+<template>
+  <v-layout class="mb-2 mt-2" column>
+    <v-dialog v-model="dialogrequirement" persistent max-width="45%">
+      <v-card class="mb-2">
+        <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" :key="req.id" 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-dialog v-model="dialogform" persistent max-width="25%">
+      <v-card>
+        <v-card-title color="primary" class="headline"
+          >Isi form di bawah ini :</v-card-title
+        >
+        <v-card-text>
+          <v-layout row>
+            <v-flex xs12>
+              <v-text-field
+                label="Voltase (kV)"
+                v-model="formx.form_kv"
+              ></v-text-field>
+            </v-flex>
+          </v-layout>
+          <v-layout row>
+            <v-flex xs12>
+              <v-text-field
+                label="Arus (mA)"
+                v-model="formx.form_ma"
+              ></v-text-field>
+            </v-flex>
+          </v-layout>
+          <v-layout row>
+            <v-flex xs12>
+              <v-text-field
+                label="Second (s)"
+                v-model="formx.form_second"
+              ></v-text-field>
+            </v-flex>
+          </v-layout>
+          <v-layout row>
+            <v-flex xs12>
+              <v-text-field
+                label="Expose"
+                v-model="formx.form_expose"
+              ></v-text-field>
+            </v-flex>
+          </v-layout>
+        </v-card-text>
+        <v-card-actions>
+          <v-spacer></v-spacer>
+          <v-btn color="grey darken-1" flat @click="saveForm()">Tutup</v-btn>
+          <!--<v-btn color="primary" flat @click="saveForm()">Simpan</v-btn>-->
+        </v-card-actions>
+      </v-card>
+    </v-dialog>
+    <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="notes.fo_note !== ''" mb-2 row>
+            <v-flex mb-2 xs3>
+              <span style="color: #0f80db" class="mono name">FO</span>
+            </v-flex>
+            <v-flex xs9>
+              <v-layout row>
+                <v-flex mb-1 xs12>
+                  <code
+                    style="
+                      box-shadow: none !important;
+                      color: #0f80db !important;
+                      background-color: #a8cfee6b !important;
+                    "
+                    >{{ notes.fo_note_user }}</code
+                  >
+                  <div class="v-markdown">
+                    <p style="margin-top: 2px; margin-bottom: 0">
+                      {{ notes.fo_note }}
+                    </p>
+                  </div>
+                </v-flex>
+              </v-layout>
+            </v-flex>
+          </v-layout>
+          <v-layout v-if="notes.fo_ver_note !== ''" mb-2 row>
+            <v-flex mb-2 xs3>
+              <span style="color: #0f80db" class="mono name"
+                >FO Verifikasi</span
+              >
+            </v-flex>
+            <v-flex xs9>
+              <v-layout row>
+                <v-flex mb-1 xs12>
+                  <code
+                    style="
+                      box-shadow: none !important;
+                      color: #0f80db !important;
+                      background-color: #a8cfee6b !important;
+                    "
+                    >{{ notes.fo_ver_note_user }}</code
+                  >
+                  <div class="v-markdown">
+                    <p style="margin-top: 2px; margin-bottom: 0">
+                      {{ notes.fo_ver_note }}
+                    </p>
+                  </div>
+                </v-flex>
+              </v-layout>
+            </v-flex>
+          </v-layout>
+          <v-layout v-if="notes.sampling_note !== ''" mb-2 row>
+            <v-flex mb-2 xs3>
+              <span style="color: #0f80db" class="mono name">Sampling</span>
+            </v-flex>
+            <v-flex xs9>
+              <v-layout row>
+                <v-flex mb-1 xs12>
+                  <code
+                    style="
+                      box-shadow: none !important;
+                      color: #0f80db !important;
+                      background-color: #a8cfee6b !important;
+                    "
+                    >{{ notes.sampling_note_user }}</code
+                  >
+                  <div class="v-markdown">
+                    <p style="margin-top: 2px; margin-bottom: 0">
+                      {{ notes.sampling_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-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-card
+      style="overflow-y: auto; max-height: 450px"
+      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_reg_status_req === 'N' ||
+                  selected_patient.fo_verification_status !== 'X'
+                "
+                @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 class="grey lighten-2" row>
+            <v-flex xs3> PEMERIKSAAN </v-flex>
+            <v-flex xs3> TINDAKAN </v-flex>
+            <v-flex xs3> REQUIREMENT </v-flex>
+            <v-flex class="text-xs-center" xs3> AKSI </v-flex>
+          </v-layout>
+          <v-layout pa-1 row v-for="(sampletype, idx) in xsampletypes">
+            <v-flex xs12>
+              <v-layout align-center pa-2 class="grey lighten-4" row>
+                <v-flex xs3>
+                  {{ sampletype.test_name }}
+                </v-flex>
+                <v-flex xs3>
+                  <p v-if="sampletype.status !== 'X'" class="mb-0">
+                    {{ sampletype.T_SampleTypeName }}
+                  </p>
+                  <p
+                    v-if="sampletype.status === 'X'"
+                    style="text-decoration: line-through"
+                    class="red--text mb-0"
+                  >
+                    {{ sampletype.T_SampleTypeName }}
+                  </p>
+                </v-flex>
+                <v-flex xs3>
+                  <div
+                    v-if="
+                      selected_patient.status === 'Process' ||
+                      selected_patient.status === 'Done'
+                    "
+                  >
+                    <span
+                      v-if="sampletype.type === 'xray'"
+                      @click="fillForm(sampletype, idx)"
+                      v-bind:class="{
+                        white: sampletype.fill_form === 'N',
+                        primary: sampletype.fill_form === 'Y',
+                      }"
+                      class="icon-medium-fill-base-small white"
+                      ><v-icon :dark="sampletype.fill_form === 'Y'"
+                        >edit</v-icon
+                      ></span
+                    >
+                    <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" xs3>
+                  <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' ||
+                        selected_patient.status === 'Done') &&
+                      sampletype.requirement_status !== 'X' &&
+                      sampletype.fill_form === 'Y'
+                    "
+                    @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.requirement_status === 'X' ||
+                        sampletype.fill_form !== 'Y')
+                    "
+                    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, idx) 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>
+    <one-order-info></one-order-info>
+  </v-layout>
+</template>
+
+<style scoped></style>
+
+<script>
+module.exports = {
+  components: {
+    "one-x-check": httpVueLoader("../../common/onexcheck.vue"),
+    "one-order-info": httpVueLoader("./oneSampleOrderInfo.vue"),
+  },
+  data: () => ({
+    checkbox: false,
+    //formx:{}
+  }),
+  computed: {
+    notes() {
+      return this.$store.state.samplecall.notes;
+    },
+    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;
+    },
+    dialognote: {
+      get() {
+        return this.$store.state.samplecall.dialog_note;
+      },
+      set(val) {
+        this.$store.commit("samplecall/update_dialog_note", val);
+      },
+    },
+    dialogform: {
+      get() {
+        return this.$store.state.samplecall.dialog_form;
+      },
+      set(val) {
+        this.$store.commit("samplecall/update_dialog_form", 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);
+      },
+    },
+    dialogrequirement: {
+      get() {
+        return this.$store.state.samplecall.dialog_requirement;
+      },
+      set(val) {
+        this.$store.commit("samplecall/update_dialog_requirement", 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);
+      },
+    },
+    formx: {
+      get() {
+        return this.$store.state.samplecall.selected_sample;
+      },
+      set(val) {
+        this.$store.commit("samplecall/update_selected_sample", 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);
+    },
+    fillForm(sampletype, idx) {
+      //this.formx = sampletype
+      console.log(sampletype);
+      var sampletypes = this.$store.state.samplecall.sampletypes;
+      this.$store.commit("samplecall/update_selected_sample", sampletypes[idx]);
+      this.$store.commit("samplecall/update_dialog_form", true);
+    },
+    saveForm() {
+      var sample = this.$store.state.samplecall.selected_sample;
+      var sampletypes = this.$store.state.samplecall.sampletypes;
+      console.log(sampletypes);
+      var idx = _.findIndex(sampletypes, function (o) {
+        return o.id == sample.id;
+      });
+      console.log(idx);
+
+      sampletypes[idx] = sample;
+      sampletypes[idx].fill_form = "N";
+
+      if (
+        parseFloat(sampletypes[idx].form_expose) > 0 &&
+        parseFloat(sampletypes[idx].form_kv) > 0 &&
+        parseFloat(sampletypes[idx].form_ma) > 0 &&
+        parseFloat(sampletypes[idx].form_second) > 0
+      )
+        sampletypes[idx].fill_form = "Y";
+
+      this.$store.commit("samplecall/update_sampletypes", sampletypes);
+      this.$store.commit("samplecall/update_dialog_form", false);
+    },
+    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);
+    },
+    doConfirm() {
+      var id = this.selected_patient.T_OrderHeaderID;
+      var stationid = this.selected_patient.T_SampleStationID;
+      this.$store.dispatch("samplecall/doConfirm", {
+        id: id,
+        stationid: stationid,
+      });
+    },
+    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);
+      }
+    },
+    openDialogFormNote() {
+      this.dialogformnote = true;
+    },
+    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);
+    },
+    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,
+      });
+    },
+    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_OrderHeaderID == selected_sample.T_OrderHeaderID &&
+          o.T_SampleTypeID == selected_sample.T_SampleTypeID
+        );
+      });
+      if (sampletypes[idx].status === "P") {
+        sampletypes[idx].requirements =
+          this.$store.state.samplecall.requirements;
+      }
+      this.$store.commit("samplecall/update_dialog_requirement", false);
+    },
+    openDialogFoNoteRequirement() {
+      var prm = this.$store.state.samplecall.selected_patient;
+      this.$store.dispatch("samplecall/getdatanoterequirement", prm);
+    },
+    checkReq(val, idx) {
+      var selected_sample = this.$store.state.samplecall.selected_sample;
+      var xrequirements = this.requirements;
+      if (selected_sample.status === "P" && xrequirements[idx].status === "P") {
+        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.status === "P" &&
+        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);
+        }
+      }
+    },
+  },
+};
+</script>

test/vuex/one-sample-electromedis-v5/components/oneSampleCallSOFilter.vue

@@ -0,0 +1,478 @@
+<template>
+  <v-layout class="fill-height" column>
+    <v-card class="mb-2 pa-2 searchbox">
+      <v-layout align-center 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 xs2>
+          <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 xs2>
+          <v-autocomplete
+            label="Kel. Pelanggan"
+            v-model="selected_company"
+            class="ma-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 Kel. Pelanggan"
+          >
+            <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 ma-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 ma-1 text-truncate text-no-wrap"
+            :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/getstationstatus", {
+      name: this.name,
+      nolab: this.nolab,
+      stationid: this.xselectedstation.id,
+      statusid: this.xselectedstatus.id,
+      companyid: this.selected_company.id,
+      xdate: this.$store.state.samplecall.start_date,
+      lastid: -1,
+    });
+  },
+  methods: {
+    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.dispatch("samplecall/search", {
+        name: this.name,
+        nolab: this.nolab,
+        stationid: this.xselectedstation.id,
+        statusid: this.xselectedstatus.id,
+        companyid: this.selected_company.id,
+        xdate: this.$store.state.samplecall.start_date,
+        locationid: this.selected_location.locationID,
+        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() {
+      //this.$store.commit("samplecall/update_selected_Patient",{})
+    },
+    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;
+      //  if(idx !== -1)
+      //   xcur_page = this.$store.state.samplecall.current_page
+
+      this.$store.dispatch("samplecall/search", {
+        name: this.name,
+        nolab: this.nolab,
+        stationid: this.xselectedstation.id,
+        statusid: this.xselectedstatus.id,
+        locationid: this.selected_location.locationID,
+        // current_page:xcur_page,
+        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),
+    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")}`;
+    },
+  },
+  computed: {
+    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);
+      },
+    },
+    xdatestart: {
+      get() {
+        return this.$store.state.samplecall.start_date;
+      },
+      set(val) {
+        this.$store.commit("samplecall/update_start_date", val);
+        //this.searchTransaction()
+      },
+    },
+    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,
+          locationid: this.selected_location.locationID,
+          current_page: val,
+          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", val);
+      },
+    },
+    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 !",
+      menufilterdatestart: false,
+      items: [],
+      search_company: "",
+      //isLoading: false,
+      page: 1,
+      headers: [
+        {
+          text: "TGL. TRANSAKSI",
+          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/one-sample-electromedis-v5/components/oneSampleCallSOInfo.vue

@@ -0,0 +1,238 @@
+<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 xs7>
+                                                    <v-text-field
+                                                        v-model=" xselected_patient.T_OrderHeaderM_PatientAge"
+                                                        label="Umur"
+                                                        readonly
+                                                        hide-details
+                                                    >
+                                                    </v-text-field>
+                                                </v-flex>
+                                                <v-flex xs5 pl-1>
+                                                    <v-text-field
+                                                        v-model="xselected_patient.dob"
+                                                        label="TANGGAL LAHIR"
+                                                        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 xs6>
+                                            <v-text-field
+                                                v-model=" xselected_patient.patient_fullname"
+                                                label="Nama"
+                                                readonly
+                                                hide-details
+                                            >
+                                            </v-text-field>
+                                        </v-flex>
+                                        <v-flex xs6 pl-1>
+                                            <v-text-field
+                                                v-model="xselected_patient.doctor_sender"
+                                                label="Pengirim"
+                                                readonly
+                                                hide-details
+                                            >
+                                            </v-text-field>
+                                        </v-flex>
+                                    </v-layout>
+                           </v-card>
+                </v-flex>
+            </v-layout>
+            </v-card>
+        </v-flex>
+         
+    </v-layout>
+         
+    </div>
+</template>
+
+<style scoped>
+
+</style>
+
+<script>
+module.exports = {
+    data: () => ({
+          
+    }),
+    computed: {
+        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)
+            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,
+                orderlocationid:patient.order_location_id,
+                antritime:patient.antri_time,
+                skiptime:patient.skip_time,
+                last_skiptime:last_patient.skip_time,
+                statusid:this.$store.state.samplecall.selected_status.id,
+                statusnextid : status,
+                sample:sample,
+                lastid:lastid,
+                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 xselected_patient = this.$store.state.samplecall.selected_patient
+                this.$store.commit("samplecall/update_act",'process')
+                this.closeDialogAction()
+            }
+            
+        },
+        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/one-sample-electromedis-v5/components/oneSampleCallSOList.vue

@@ -0,0 +1,491 @@
+<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-1 pl-1"
+                v-bind:class="{
+                  'black--text amber lighten-3': isSelected(props.item),
+                  amber: props.item.iscito === 'Y',
+                  'teal white--text': props.item.status_coming === 'Y',
+                }"
+                @click="selectMe(props.item)"
+              >
+                {{ props.item.order_date }}
+              </td>
+              <td
+                style="width: 10%"
+                class="text-xs-center pa-1 pl-1"
+                v-bind:class="{
+                  'black--text amber lighten-3': isSelected(props.item),
+                  amber: props.item.iscito === 'Y',
+                  'teal white--text': props.item.status_coming === 'Y',
+                }"
+                @click="selectMe(props.item)"
+              >
+                <span class="font-weight-black">{{
+                  props.item.T_OrderHeaderLabNumber
+                }}</span>
+                <span style="color: #800000" class="font-weight-bold">{{
+                  props.item.T_OrderHeaderLabNumberExt
+                }}</span>
+              </td>
+              <td
+                style="width: 15%"
+                class="text-xs-center pa-1 pl-1"
+                v-bind:class="{
+                  'black--text amber lighten-3': isSelected(props.item),
+                  amber: props.item.iscito === 'Y',
+                  'teal white--text': props.item.status_coming === 'Y',
+                }"
+                @click="selectMe(props.item)"
+              >
+                {{ props.item.M_CompanyName }}
+              </td>
+              <td
+                style="width: 20%"
+                class="text-xs-center pa-1 pl-1"
+                v-bind:class="{
+                  'black--text amber lighten-3': isSelected(props.item),
+                  amber: props.item.iscito === 'Y',
+                  'teal white--text': props.item.status_coming === 'Y',
+                }"
+                @click="selectMe(props.item)"
+              >
+                <span
+                  v-if="props.item.status_coming === 'Y'"
+                  style="text-decoration: underline"
+                  >{{ props.item.patient_fullname }}</span
+                >
+                <span v-if="props.item.status_coming === 'N'">{{
+                  props.item.patient_fullname
+                }}</span>
+              </td>
+              <td
+                style="width: 10%"
+                class="text-xs-center pa-1 pl-1"
+                v-bind:class="{
+                  'black--text amber lighten-3': isSelected(props.item),
+                  amber: props.item.iscito === 'Y',
+                  'teal white--text': props.item.status_coming === '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/getstationstatus", {
+      name: this.name,
+      nolab: this.nolab,
+      stationid: this.xselectedstation.id,
+      statusid: this.xselectedstatus.id,
+      companyid: this.selected_company.id,
+      xdate: this.$store.state.samplecall.start_date,
+      lastid: -1,
+    });
+  },
+  methods: {
+    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.dispatch("samplecall/search", {
+        name: this.name,
+        nolab: this.nolab,
+        stationid: this.xselectedstation.id,
+        statusid: this.xselectedstatus.id,
+        companyid: this.selected_company.id,
+        xdate: this.$store.state.samplecall.start_date,
+        locationid: this.selected_location.locationID,
+        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() {
+      //this.$store.commit("samplecall/update_selected_Patient",{})
+    },
+    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;
+      //  if(idx !== -1)
+      //   xcur_page = this.$store.state.samplecall.current_page
+
+      this.$store.dispatch("samplecall/search", {
+        name: this.name,
+        nolab: this.nolab,
+        stationid: this.xselectedstation.id,
+        statusid: this.xselectedstatus.id,
+        locationid: this.selected_location.locationID,
+        // current_page:xcur_page,
+        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),
+    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")}`;
+    },
+  },
+  computed: {
+    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);
+      },
+    },
+    xdatestart: {
+      get() {
+        return this.$store.state.samplecall.start_date;
+      },
+      set(val) {
+        this.$store.commit("samplecall/update_start_date", val);
+        //this.searchTransaction()
+      },
+    },
+    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: {
+      get() {
+        return this.$store.state.samplecall.patients;
+      },
+      set(val) {
+        this.$store.commit("samplecall/update_patients", val);
+      },
+    },
+    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,
+          locationid: this.selected_location.locationID,
+          current_page: val,
+          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", val);
+      },
+    },
+    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.patients = [];
+        // 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 !",
+      menufilterdatestart: false,
+      items: [],
+      search_company: "",
+      //isLoading: false,
+      page: 1,
+      headers: [
+        {
+          text: "TGL. TRANSAKSI",
+          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/one-sample-electromedis-v5/components/oneSampleOrderInfo.vue

@@ -0,0 +1,72 @@
+<template>
+  <div v-show="show" class="orderbox mono mt-2">
+    <h3 class="subtitle-1 font-weight-black pb-2 pl-1" style="font-size: 18px">
+      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;
+  width: 100%;
+  display: block;
+  max-height: 270px;
+  overflow-y: scroll;
+  border-radius-top: 10px;
+  margin-top: 10px;
+  box-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14),
+    0 1px 5px 0 rgba(0, 0, 0, 0.12);
+}
+.px {
+  padding: 5px;
+  width: 40%;
+  border: 1px solid #004d00;
+  display: inline-block;
+  margin: 0px 2px 0px 2px;
+}
+</style>
+
+<script>
+module.exports = {
+  components: {},
+  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 });
+    },
+  },
+};
+</script>

test/vuex/one-sample-electromedis-v5/index.php

@@ -0,0 +1,152 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+   <meta charset="UTF-8">
+   <meta name="viewport" content="width=device-width, initial-scale=1.0">
+   <meta http-equiv="X-UA-Compatible" content="ie=edge">
+   <title>One</title>
+   <link rel="stylesheet" href="../../../libs/vendor/css/google-fonts.css">
+   <link rel="stylesheet" href="../../../libs/vendor/css/icomoon-fonts.css">
+   <link rel="stylesheet" href="../../../libs/vendor/css/vuetify.min.css">
+</head>
+
+<body 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 pa-1>
+                     <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>
+                  </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;
+      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()
+                     }
+                     window.key_enter = ''
+                     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 "specimen-col-receive":
+                  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'),
+            'one-footer': httpVueLoader('../../../apps/components/oneFooter.vue'),
+            'one-sample-call-so-list': httpVueLoader('./components/oneSampleCallSOList.vue'),
+            'one-sample-call-so-info': httpVueLoader('./components/oneSampleCallSOInfo.vue'),
+            'one-sample-call-so-detail': httpVueLoader('./components/oneSampleCallSODetail.vue'),
+            'one-sample-call-so-filter': httpVueLoader('./components/oneSampleCallSOFilter.vue')
+         }
+      })
+   </script>
+   <style>
+      [v-cloak] {
+         display: none
+      }
+
+      .left {}
+
+      .right {}
+   </style>
+</body>
+
+</html>

test/vuex/one-sample-electromedis-v5/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/one-sample-electromedis-v5/store.js

@@ -0,0 +1,29 @@
+// State
+//  data ...
+// Mutations
+//
+//
+// Actions
+import samplecall from "./modules/samplecall.js";
+import order_info from "./modules/order_info.js";
+import system from "../../../apps/modules/system/system.js";
+export const store = new Vuex.Store({
+    modules: {
+        samplecall: samplecall,
+        order_info:order_info,
+        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)
+        }
+    }
+});