add modules folder based on s_menu

This commit is contained in:
2026-06-30 10:16:11 +07:00
parent 315b657ee3
commit a1aab09ac9
625 changed files with 192283 additions and 794 deletions

View File

@@ -0,0 +1,136 @@
const URL = "/one-api/mockup/purchase/manager/";
export async function search(payload) {
try {
var response = await axios.post(URL + "purchaseRequest/search", payload);
if (response.status !== 200) {
return {
status: "ERR",
message: response.statusText,
};
}
let data = response.data;
return data;
} catch (e) {
return {
status: "ERR",
message: e.message,
};
}
}
export async function searchDetail(payload) {
try {
var response = await axios.post(
URL + "purchaseRequest/searchDetail",
payload
);
if (response.status !== 200) {
return {
status: "ERR",
message: response.statusText,
};
}
let data = response.data;
return data;
} catch (e) {
return {
status: "ERR",
message: e.message,
};
}
}
export async function deleteDetail(payload) {
try {
var response = await axios.post(
URL + "purchaseRequest/deleteDetail",
payload
);
if (response.status !== 200) {
return {
status: "ERR",
message: response.statusText,
};
}
let data = response.data;
return data;
} catch (e) {
return {
status: "ERR",
message: e.message,
};
}
}
export async function approveRequest(payload) {
try {
var response = await axios.post(
URL + "purchaseRequest/approveRequest",
payload
);
if (response.status !== 200) {
return {
status: "ERR",
message: response.statusText,
};
}
let data = response.data;
return data;
} catch (e) {
return {
status: "ERR",
message: e.message,
};
}
}
export async function rejectRequest(payload) {
try {
var response = await axios.post(
URL + "purchaseRequest/rejectRequest",
payload
);
if (response.status !== 200) {
return {
status: "ERR",
message: response.statusText,
};
}
let data = response.data;
return data;
} catch (e) {
return {
status: "ERR",
message: e.message,
};
}
}
export async function updateDetail(payload) {
try {
var response = await axios.post(
URL + "purchaseRequest/updateDetail",
payload
);
if (response.status !== 200) {
return {
status: "ERR",
message: response.statusText,
};
}
let data = response.data;
return data;
} catch (e) {
return {
status: "ERR",
message: e.message,
};
}
}

View File

@@ -0,0 +1,98 @@
const URL = "/one-api/mockup/purchaserequestkacab/purchaserequestkacab/";
// https://accone.aplikasi.web.id/one-api/mockup/purchaserequestkacab/purchaserequestkacab/search
export async function search(payload) {
try {
var response = await axios.post(URL + "search", payload);
if (response.status !== 200) {
return {
status: "ERR",
message: response.statusText,
};
}
let data = response.data;
return data;
} catch (e) {
return {
status: "ERR",
message: e.message,
};
}
}
export async function getDetail(payload) {
try {
var response = await axios.post(URL + "getDetail", payload);
if (response.status !== 200) {
return {
status: "ERR",
message: response.statusText,
};
}
let data = response.data;
return data;
} catch (e) {
return {
status: "ERR",
message: e.message,
};
}
}
export async function approve(payload) {
try {
var response = await axios.post(URL + "approve", payload);
if (response.status !== 200) {
return {
status: "ERR",
message: response.statusText,
};
}
let data = response.data;
return data;
} catch (e) {
return {
status: "ERR",
message: e.message,
};
}
}
export async function updateqty(payload) {
try {
var response = await axios.post(URL + "updateqty", payload);
if (response.status !== 200) {
return {
status: "ERR",
message: response.statusText,
};
}
let data = response.data;
return data;
} catch (e) {
return {
status: "ERR",
message: e.message,
};
}
}
export async function approvelevel(params) {
try {
var response = await axios.post(URL + 'getUserApproveLevel', params);
if (response.status !== 200) {
return {
status: "ERR",
message: response.statusText
};
}
let data = response.data
return data
} catch (error) {
return {
status: "ERR",
message: error.message
};
}
}

View File

@@ -0,0 +1,898 @@
<template>
<div>
<v-snackbar
v-model="snackbar.state"
:color="snackbar.type"
:timeout="3000"
top
>
{{ snackbar.message }}
<v-btn flat @click="snackbar.state = false">
Close
</v-btn>
</v-snackbar>
<!-- dialog approve -->
<v-dialog v-model="dialogApprove" persistent width="70vw">
<v-card>
<v-card-title class="headline grey lighten-2" primary-title>
STOCK REQUEST PERSEDIAAN<v-spacer></v-spacer>
<v-btn flat icon color="error" @click="closeDialogApprove()">
<v-icon>close</v-icon>
</v-btn>
</v-card-title>
<v-card-text>
<v-layout row wrap>
<v-flex xs3 class="mb-2 subheading">No. PR </v-flex>
<v-flex xs9 class="mb-2 subheading"
>: {{ selectedPr.prNumber ?? "" }}
</v-flex>
<v-flex xs3 class="mb-2 subheading">Tanggal </v-flex>
<v-flex xs9 class="mb-2 subheading"
>: {{ selectedPr.prDate ?? "" }}
</v-flex>
<v-flex xs3 class="mb-2 subheading">Type </v-flex>
<v-flex xs9 class="mb-2 subheading"
>: {{ selectedPr.prItemTypeName ?? "" }}
</v-flex>
<v-flex xs3 class="mb-2 subheading">Catatan </v-flex>
<v-flex xs9 class="mb-2 subheading"
>: {{ selectedPr.prNote ?? "" }}
</v-flex>
<v-flex
xs3
class="mb-2 subheading"
v-if="selectedPr.prStatus !== 'Draft' && selectedPr.prStatus !== 'Rejected' && selectedPr.prStatus !== 'Pending'"
>Approved By
</v-flex>
<v-flex
xs3
class="mb-2 subheading"
v-if="selectedPr.prStatus !== 'Draft' && selectedPr.prStatus === 'Rejected' && selectedPr.prStatus !== 'Pending'"
>Rejected By
</v-flex>
<v-flex
xs9
class="mb-2 subheading"
v-if="selectedPr.prStatus !== 'Draft' && selectedPr.prStatus !== 'Pending'"
>: {{ selectedPr.prApprovedBy ?? "" }}
</v-flex>
<v-flex
xs3
class="mb-2 subheading"
v-if="selectedPr.prStatus !== 'Draft' && selectedPr.prStatus !== 'Rejected' && selectedPr.prStatus !== 'Pending'"
>Approved Date
</v-flex>
<v-flex
xs3
class="mb-2 subheading"
v-if="selectedPr.prStatus !== 'Draft' && selectedPr.prStatus === 'Rejected' && selectedPr.prStatus !== 'Pending'"
>Rejected Date
</v-flex>
<v-flex
xs9
class="mb-2 subheading"
v-if="selectedPr.prStatus !== 'Draft' && selectedPr.prStatus !== 'Pending'"
>: {{ selectedPr.prApprovedDate ?? "" }}
</v-flex>
<v-flex xs12 class="mt-2">
<v-data-table
:headers="detailHeaders"
:items="detailData"
:loading="loadingDetail || loading"
hide-actions
class="elevation-1"
>
<template v-slot:items="props">
<td class="">{{ props.item.prDetailItemCode }}</td>
<td class="">{{ props.item.prDetailItemName }}</td>
<td class="py-2">
{{ props.item.CurrentStockQty }} {{ props.item.prDetailItemUnitName }}
</td>
<td class="py-2">
{{ props.item.prDetailItemQty }} {{ props.item.prDetailItemUnitName }}
</td>
<td class="py-2">
Rp {{ convertMoney(props.item.prDetailItemPrice) }}
</td>
</template>
</v-data-table>
</v-flex>
</v-layout>
</v-card-text>
<v-divider></v-divider>
<v-card-actions>
<v-spacer></v-spacer>
<v-btn
color="error"
v-if="selectedPr.prStatus === 'Approved' && act_dialog == 'unapprove'"
flat
:disabled="loading || loadingDetail"
@click="approvePr('U')"
>
Unapprove
</v-btn>
<v-btn
color="error"
v-if="selectedPr.prStatus === 'Pending'"
flat
:disabled="loading || loadingDetail"
@click="approvePr('R')"
>
Reject
</v-btn>
<v-btn
color="success"
v-if="(selectedPr.prStatus === 'Pending' && act_dialog == 'approve') || (selectedPr.prStatus === 'Pending' && act_dialog == 'verif')"
flat
:disabled="loading || loadingDetail"
@click="approvePr('A')"
>
{{ user_approvelevel == '1'? 'Verify': 'Approve'}}
</v-btn>
<v-btn
color="primary"
v-if="selectedPr.prStatus !== 'Pending'"
@click="closeDialogApprove()"
:disabled="loading"
flat
>
Tutup
</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
<v-dialog v-model="dialogQty" persistent width="70vw">
<v-card>
<v-card-title class="headline grey lighten-2" primary-title>
FORM EDIT QTY<v-spacer></v-spacer>
<v-btn flat icon color="error" @click="closeDialogQty()">
<v-icon>close</v-icon>
</v-btn>
</v-card-title>
<v-card-text>
<v-layout row wrap>
<v-flex xs3 class="mb-2 subheading">No. PR </v-flex>
<v-flex xs9 class="mb-2 subheading"
>: {{ selectedPr.prNumber ?? "" }}
</v-flex>
<v-flex xs3 class="mb-2 subheading">Tanggal </v-flex>
<v-flex xs9 class="mb-2 subheading"
>: {{ selectedPr.prDate ?? "" }}
</v-flex>
<v-flex xs3 class="mb-2 subheading">Type </v-flex>
<v-flex xs9 class="mb-2 subheading"
>: {{ selectedPr.prItemTypeName ?? "" }}
</v-flex>
<v-flex xs3 class="mb-2 subheading">Catatan </v-flex>
<v-flex xs9 class="mb-2 subheading"
>: {{ selectedPr.prNote ?? "" }}
</v-flex>
<v-flex xs12 class="mt-2">
<v-data-table
:headers="qtyHeaders"
:items="detailData"
:loading="loadingDetail || loading"
hide-actions
class="elevation-1"
>
<template v-slot:items="props">
<td class="">{{ props.item.prDetailItemCode }}</td>
<td class="">{{ props.item.prDetailItemName }}</td>
<td class="">{{ props.item.CurrentStockQty }} {{ props.item.prDetailItemUnitName }}</td>
<td class="">
<v-text-field v-model="props.item.prDetailItemQty"
type="number" min=0 step=1
@keypress="blockDecimalInput($event)" @change="updateQuantity(props.item)">
</v-text-field>
</td>
</template>
</v-data-table>
</v-flex>
</v-layout>
</v-card-text>
<v-divider></v-divider>
<v-card-actions>
<v-spacer></v-spacer>
<v-btn
color="error"
@click="closeDialogQty()"
flat
>
Tutup
</v-btn>
<v-btn
color="primary"
@click="doUpdateQty()"
>
Simpan Perubahan
</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
<!-- main layout -->
<v-toolbar color="primary" dark>
<v-toolbar-title class="white--text"
>STOCK REQUEST APPROVE</v-toolbar-title
>
<v-spacer></v-spacer>
<v-btn v-if="flag == 'G'" @click="goBack()" color="orange darken-2" title="Kembali ke listing pending approval" dark>
<v-icon dark left>arrow_back</v-icon>Back
</v-btn>
</v-toolbar>
<v-card class="pa-2">
<v-layout row wrap>
<v-flex xs3>
<v-menu
v-model="menuSelectedDate"
:close-on-content-click="false"
transition="scale-transition"
:nudge-right="40"
lazy
offset-y
max-width="290px"
min-width="290px"
>
<template v-slot:activator="{ on }">
<v-text-field
:value="selectedDateFormatted"
label="Tanggal Awal"
readonly
hide-details
class="mr-2"
outline
v-on="on"
></v-text-field>
</template>
<v-date-picker
no-title
v-model="selectedDate"
@input="menuSelectedDate = false"
></v-date-picker>
</v-menu>
</v-flex>
<v-flex xs3>
<v-menu
v-model="menuSelectedEndDate"
:close-on-content-click="false"
transition="scale-transition"
:nudge-right="40"
lazy
offset-y
max-width="290px"
min-width="290px"
>
<template v-slot:activator="{ on }">
<v-text-field
:value="selectedEndDateFormatted"
label="Tanggal Akhir"
readonly
hide-details
class="mr-2"
outline
v-on="on"
></v-text-field>
</template>
<v-date-picker
no-title
v-model="selectedEndDate"
@input="menuSelectedEndDate = false"
></v-date-picker>
</v-menu>
</v-flex>
<v-flex xs3>
<v-autocomplete
v-model="selectedStatus"
menu-icon="mdi-chevron-down"
:items="statusOptions"
item-text="title"
item-value="value"
class="mr-2"
label="Status"
return-object
outline
hide-details
></v-autocomplete
></v-flex>
<v-flex xs3>
<v-text-field
v-model="search"
label="Cari..."
placeholder="NO. PR"
class="mr-2"
outline
hide-details
>
</v-text-field>
</v-flex>
</v-layout>
</v-card>
<v-card class="pa-2 mt-2">
<div>
<v-data-table
:headers="headers"
:items="prList"
:loading="loading"
hide-actions
class="elevation-1"
>
<template v-slot:items="props">
<td class="">{{ props.item.prBranchName }}</td>
<td class="">{{ props.item.prNumber }}</td>
<td class="text-xs-center">{{ props.item.prItemTypeName }}</td>
<td class="">{{ props.item.prDate }}</td>
<td class="">{{ props.item.prNote }}</td>
<td class="">{{ props.item.prRequestedBy }}</td>
<td class="text-xs-center">
<v-layout column align-center justify-center>
<v-chip
color="blue"
v-if="props.item.prStatus === 'Draft'"
text-color="white"
>{{ props.item.prStatus }}
</v-chip>
<v-chip
color="warning"
v-if="props.item.prStatus === 'Pending'"
text-color="white"
>{{ props.item.prStatus }}
</v-chip>
<v-chip
color="red"
v-if="props.item.prStatus === 'Rejected'"
text-color="white"
>{{ props.item.prStatus }}
</v-chip>
<v-chip
color="green"
v-if="props.item.prStatus !== 'Draft' && props.item.prStatus !== 'Rejected'&& props.item.prStatus !== 'Pending'"
text-color="white"
>{{ props.item.prStatus }}
</v-chip>
<p
v-if="props.item.prStatus !== 'Draft' && props.item.prStatus !== 'Pending'"
class="mb-1"
>
<kbd>{{ props.item.prApprovedBy }}</kbd>
</p>
<p
v-if="props.item.prStatus !== 'Draft' && props.item.prStatus !== 'Pending'"
class="mb-1"
>
<kbd>{{ props.item.prApprovedDate }}</kbd>
</p>
</v-layout>
</td>
<td class="text-xs-center">
<v-layout column align-center justify-center>
<v-icon
color="blue"
:disabled="loading"
v-if="props.item.prStatus !== 'Pending'"
@click="openDialogApprove('preview', props.item)"
>
visibility
</v-icon>
<v-btn
color="orange" class="white--text" small round
:disabled="loading || user_approvelevel != '2' || user.M_BranchID != props.item.prRequestedByFromBranch"
:outline="props.item.prStatus == 'Approved'"
v-if="props.item.prStatus === 'Approved'"
@click="openDialogApprove('unapprove', props.item)"
>
Unapprove
<v-icon small right dark>done_outline</v-icon>
</v-btn>
<v-btn
color="primary" class="white--text" small round
:disabled="loading || user_approvelevel != '1' || user.M_BranchID != props.item.prRequestedByFromBranch"
:outline="props.item.prStatus != 'Approved' && props.item.PurchaseRequestVerifiedBy == '0'"
v-if="props.item.prStatus === 'Pending'"
@click="openDialogApprove('verif', props.item)"
>
{{ props.item.PurchaseRequestVerifiedBy != '0' ? 'Verified' : 'Verifikasi'}}
<v-icon small right dark>check_circle</v-icon>
</v-btn>
<v-btn
color="purple" class="white--text" small round
:disabled="loading || user.M_BranchID != props.item.prRequestedByFromBranch"
outline
v-if="props.item.prStatus === 'Pending' && props.item.PurchaseRequestVerifiedBy != '0' && user_approvelevel != '1'"
@click="openDialogQty(props.item)"
>
Edit qty
<v-icon small right dark>edit</v-icon>
</v-btn>
<v-btn
color="primary" class="white--text"
:disabled="loading || user_approvelevel != '2' || user.M_BranchID != props.item.prRequestedByFromBranch"
small round :outline="props.item.prStatus != 'Approved'"
v-if="props.item.prStatus === 'Pending'"
@click="openDialogApprove('approve', props.item)"
>
Approve
<v-icon small right dark>done_all</v-icon>
</v-btn>
<!-- <v-icon
color="green"
:disabled="loading"
v-if="props.item.prStatus === 'Pending'"
@click="openDialogApprove(props.item)"
>check_circle</v-icon> -->
</v-layout>
</td>
</template>
</v-data-table>
</div>
</v-card>
<v-card class="text-xs-left pa-2">
<v-pagination v-model="selectedPage" :length="totalPage"></v-pagination>
</v-card>
</div>
</template>
<style scoped>
.date-type-table {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.flex-items-center {
display: flex;
align-items: center;
gap: 0.25rem;
}
.table.v-table tbody td,
.table.v-table tbody tr {
height: 40px;
}
.table.v-table thead tr {
height: 40px;
}
</style>
<script>
module.exports = {
components: {},
data() {
return {
menuSelectedDate: false,
menuSelectedEndDate: false,
msgAlertDeleteOrReject: "",
dialogAlertRejectRequest: false,
dialogAlertDeleteDetail: false,
amountRules: [(v) => v >= 0 || "Jumlah harus diisi"],
validationDetail: false,
headers: [
{
text: "CABANG",
align: "center",
sortable: false,
value: "no",
width: "10%",
class: "blue lighten-3 white--text",
},
{
text: "NO. PR",
align: "center",
sortable: false,
value: "no",
width: "10%",
class: "blue lighten-3 white--text",
},
{
text: "TIPE",
align: "center",
sortable: false,
value: "no",
width: "10%",
class: "blue lighten-3 white--text",
},
{
text: "TANGGAL",
align: "center",
sortable: false,
value: "date",
width: "10%",
class: "blue lighten-3 white--text",
},
{
text: "KETERANGAN",
align: "center",
sortable: false,
value: "description",
width: "30%",
class: "blue lighten-3 white--text",
},
{
text: "REQUESTER",
align: "center",
sortable: false,
value: "status",
width: "10%",
class: "blue lighten-3 white--text",
},
{
text: "STATUS",
align: "center",
sortable: false,
value: "status",
width: "10%",
class: "blue lighten-3 white--text",
},
{
text: "AKSI",
align: "center",
sortable: false,
value: "action",
width: "10%",
class: "blue lighten-3 white--text",
},
],
detailHeaders: [
{
text: "KODE ITEM",
align: "center",
sortable: false,
value: "no",
width: "15%",
class: "blue lighten-3 white--text",
},
{
text: "NAMA ITEM",
align: "left",
sortable: false,
value: "requestDate",
width: "35%",
class: "blue lighten-3 white--text",
},
{
text: "STOCK GUDANG",
align: "left",
sortable: false,
value: "requestDate",
width: "15%",
class: "blue lighten-3 white--text",
},
{
text: "QTY",
align: "left",
sortable: false,
value: "requestDate",
width: "15%",
class: "blue lighten-3 white--text",
},
{
text: "HARGA",
align: "left",
sortable: false,
value: "requestDate",
width: "20%",
class: "blue lighten-3 white--text",
},
],
qtyHeaders: [
{
text: "KODE ITEM",
align: "center",
sortable: false,
value: "no",
width: "15%",
class: "blue lighten-3 white--text",
},
{
text: "NAMA ITEM",
align: "left",
sortable: false,
value: "requestDate",
width: "45%",
class: "blue lighten-3 white--text",
},
{
text: "STOCK GUDANG",
align: "left",
sortable: false,
value: "requestDate",
width: "25%",
class: "blue lighten-3 white--text",
},
{
text: "QTY",
align: "left",
sortable: false,
value: "requestDate",
width: "15%",
class: "blue lighten-3 white--text",
}
],
};
},
mounted() {
this.$store.dispatch("prkacab/search");
this.$store.dispatch("prkacab/getapprovelevel");
},
computed: {
flag() {
return this.$store.state.prkacab.flag;
},
status() {
return this.$store.state.prkacab.status;
},
xstartdate() {
return this.$store.state.prkacab.xstartdate;
},
statusOptions() {
return this.$store.state.prkacab.statusOptions;
},
prList() {
return this.$store.state.prkacab.prList;
},
loadingDetail: {
get() {
return this.$store.state.prkacab.loadingDetail;
},
set(val) {
this.$store.commit("prkacab/update_loadingDetail", val);
},
},
snackbar: {
get() {
return this.$store.state.prkacab.snackbar;
},
set(val) {
this.$store.commit("prkacab/update_snackbar", val);
},
},
loading: {
get() {
return this.$store.state.prkacab.loading;
},
set(val) {
this.$store.commit("prkacab/update_loading", val);
},
},
dialogApprove: {
get() {
return this.$store.state.prkacab.dialogApprove;
},
set(val) {
this.$store.commit("prkacab/update_dialogApprove", val);
},
},
detailData: {
get() {
return this.$store.state.prkacab.detailData;
},
set(val) {
this.$store.commit("prkacab/update_detailData", val);
},
},
selectedPage: {
get() {
return this.$store.state.prkacab.selectedPage;
},
set(val) {
this.$store.commit("prkacab/update_selectedPage", val);
this.$store.dispatch("prkacab/search");
},
},
totalPage: {
get() {
return this.$store.state.prkacab.totalPage;
},
set(val) {
this.$store.commit("prkacab/update_totalPage", val);
},
},
selectedPr: {
get() {
return this.$store.state.prkacab.selectedPr;
},
set(val) {
this.$store.commit("prkacab/update_selectedPr", val);
},
},
selectedStatus: {
get() {
return this.$store.state.prkacab.selectedStatus;
},
set(val) {
this.$store.commit("prkacab/update_selectedStatus", val);
this.$store.dispatch("prkacab/search");
},
},
search: {
get() {
return this.$store.state.prkacab.search;
},
set(val) {
this.$store.commit("prkacab/update_search", val);
this.$store.dispatch("prkacab/search");
},
},
selectedDate: {
get() {
return this.$store.state.prkacab.selectedDate;
},
set(val) {
this.$store.commit("prkacab/update_selectedDate", val);
this.$store.dispatch("prkacab/search");
},
},
selectedEndDate: {
get() {
return this.$store.state.prkacab.selectedEndDate;
},
set(val) {
this.$store.commit("prkacab/update_selectedEndDate", val);
this.$store.dispatch("prkacab/search");
},
},
act_dialog: {
get() {
return this.$store.state.prkacab.act_dialog;
},
set(val) {
this.$store.commit("prkacab/update_act_dialog", val);
},
},
dialogQty: {
get() {
return this.$store.state.prkacab.dialogQty;
},
set(val) {
this.$store.commit("prkacab/update_dialogQty", val);
},
},
selectedItems: {
get() {
return this.$store.state.prkacab.selectedItems;
},
set(val) {
this.$store.commit("prkacab/update_selectedItems", val);
}
},
selectedDateFormatted() {
return this.formatDate(this.selectedDate);
},
selectedEndDateFormatted() {
return this.formatDate(this.selectedEndDate);
},
endDateFormatted() {
return this.formatDate(this.fEndDate);
},
user() {
return this.$store.state.prkacab.user;
},
user_approvelevel() {
return this.$store.state.prkacab.user_approvelevel;
}
},
methods: {
blockDecimalInput(e) {
const invalidChars = ['.', ',', '-', 'e'];
if (invalidChars.includes(e.key)) {
e.preventDefault();
}
},
goBack() {
window.history.back();
// location.href = "/one-ui/test/vuex/one-accone-approve-all/"
},
convertMoney(money){
return one_money(money)
},
closeDialogApprove() {
this.dialogApprove = false;
this.detailData = [];
},
closeDialogQty() {
this.dialogQty = false;
this.detailData = [];
},
approvePr(type) {
if (this.user_approvelevel == '1' && this.selectedPr.PurchaseRequestVerifiedBy != '0') {
let snackbar = {
state: true,
type: "warning",
message: "Request sudah diverifikasi",
};
this.snackbar = snackbar;
return;
}
if (this.detailData.length === 0) {
let snackbar = {
state: true,
type: "warning",
message: "Detail masih kosong",
};
this.snackbar = snackbar;
return
}
let cek = this.detailData;
let newTotal = 0;
cek.forEach((element) => {
newTotal =
newTotal + element.prDetailItemQty * element.prDetailItemPrice;
});
let prm = {
type: type,
pr: this.selectedPr,
total: newTotal,
detail: cek,
};
console.log(prm);
console.log("approve");
this.$store.dispatch("prkacab/approve", prm);
},
openDialogApprove(prm, data) {
this.act_dialog = prm
this.selectedPr = data;
this.dialogApprove = true;
this.$store.dispatch("prkacab/getDetail");
},
openDialogQty(data) {
this.selectedPr = data;
this.dialogQty = true;
this.$store.dispatch("prkacab/getDetail");
},
isSelected(p) {
return (
p.PurchaseRequestDirectNumber ==
this.$store.state.prkacab.selectedMainTable
.PurchaseRequestDirectNumber
);
},
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")}`;
},
updateQuantity(item) {
let items = this.detailData;
let index = items.findIndex(itemloop => itemloop.prDetailItemID == item.prDetailItemID);
items[index].prDetailItemQty = item.prDetailItemQty;
this.$store.commit("prkacab/update_selectedItems", items);
},
doUpdateQty() {
let prm = {
arrItems: this.selectedItems
}
this.$store.dispatch("prkacab/updateqty", prm);
}
},
watch: {
dialogApprove(val, old) {},
},
};
</script>

View File

@@ -0,0 +1,905 @@
<template>
<div style="width: 100%;">
<v-layout row wrap>
<v-flex xs6 class="left" fill-height pa-1>
<v-toolbar color="primary" dark>
<v-toolbar-title class="white--text"
>STOCK REQUEST KACAB</v-toolbar-title
>
<v-spacer></v-spacer>
</v-toolbar>
<v-card class="pa-2">
<div class="d-flex justify-start align-center" style="gap: 1rem;">
<v-menu
v-model="menuStartDate"
:close-on-content-click="false"
transition="scale-transition"
:nudge-right="40"
lazy
offset-y
max-width="290px"
min-width="290px"
>
<template v-slot:activator="{ on }">
<v-text-field
:value="startDateFormatted"
label="Tanggal Awal"
readonly
style="max-width: 250px;"
outline
hide-details
v-on="on"
@blur="dStartDate = deFormatedDate(startDateFormatted)"
></v-text-field>
</template>
<v-date-picker
no-title
v-model="fStartDate"
@input="menuStartDate = false"
></v-date-picker>
</v-menu>
<v-menu
v-model="menuEndDate"
:close-on-content-click="false"
transition="scale-transition"
:nudge-right="40"
lazy
offset-y
max-width="290px"
min-width="290px"
>
<template v-slot:activator="{ on }">
<v-text-field
:value="endDateFormatted"
label="Tanggal Akhir"
readonly
style="max-width: 250px;"
outline
hide-details
v-on="on"
@blur="dEndDate = deFormatedDate(endDateFormatted)"
></v-text-field>
</template>
<v-date-picker
no-title
v-model="fEndDate"
@input="menuEndDate = false"
></v-date-picker>
</v-menu>
<v-autocomplete
v-model="fStatus"
menu-icon="mdi-chevron-down"
:items="statusOptions"
item-text="title"
item-value="value"
label="Status"
style="max-width: 250px;"
outline
hide-details
></v-autocomplete>
<v-text-field
v-model="fSearch"
label="Cari..."
placeholder="NO. PR"
style="max-width: 250px;"
outline
hide-details
></v-text-field>
<v-btn
dark
color="primary"
style="min-width: 50px; height: 50px; margin: 0;"
@click="mainTableSearch()"
>
<v-icon>search</v-icon>
</v-btn>
</div>
</v-card>
<v-card class="pa-2 mt-2">
<v-layout row style="max-height: 600px; overflow: auto;">
<v-flex xs12 pl-2 pr-2 pt-2 pb-2>
<v-data-table
:headers="headers"
:items="mainTable"
:loading="mainTableLoading"
hide-actions
class="elevation-1"
>
<template slot="items" slot-scope="props">
<td
class="text-xs-center pa-2"
v-bind:class="{ 'amber lighten-4': isSelected(props.item) }"
>
<div
style="
display: flex;
flex-direction: column;
align-items: center;
"
>
{{ props.item.PurchaseRequestDirectNumber }}
<v-chip small style="border-radius: 5px; flex-grow: 0;">
{{ props.item.M_RequesterFullName }}
</v-chip>
</div>
</td>
<td
class="text-xs-left pa-2"
v-bind:class="{ 'amber lighten-4': isSelected(props.item) }"
>
<div class="date-type-table">
<span>
<span class="font-weight-medium"> Permintaan: </span>
{{
deFormatedDate(props.item.PurchaseRequestDirectDate)
}}
</span>
<span class="text-error">
<span class="font-weight-medium"> Pelaksanaan: </span>
{{
deFormatedDate(
props.item.PurchaseRequestDirectDateUse
)
}}
</span>
</div>
</td>
<td
class="text-xs-left pa-2"
v-bind:class="{ 'amber lighten-4': isSelected(props.item) }"
>
{{ props.item.PurchaseRequestDirectDescription }}
</td>
<td
class="text-xs-left pa-2"
v-bind:class="{ 'amber lighten-4': isSelected(props.item) }"
>
<v-chip
small
:text-color="
props.item.PurchaseRequestDirectStatus === 'Draft'
? 'black'
: 'white'
"
:color="
getChipStatusColor(
props.item.PurchaseRequestDirectStatus
)
"
>
{{ props.item.PurchaseRequestDirectStatus }}
</v-chip>
</td>
<template
v-if="props.item.PurchaseRequestDirectStatus != 'Draft'"
>
<td
class="text-xs-center pa-2"
v-bind:class="{
'amber lighten-4': isSelected(props.item),
}"
>
<v-icon
v-if="
props.item.PurchaseRequestDirectStatus == 'Pending'
"
small
@click="approveOrViewRequest(props.item)"
>edit</v-icon
>
<v-icon
v-if="
['Approved', 'Paid', 'Completed'].includes(
props.item.PurchaseRequestDirectStatus
)
"
small
@click="approveOrViewRequest(props.item)"
>visibility</v-icon
>
</td>
</template>
<template v-else>
<td
class="text-xs-center pa-2"
v-bind:class="{
'amber lighten-4': isSelected(props.item),
}"
></td>
</template>
</template>
</v-data-table>
</v-flex>
</v-layout>
<v-divider></v-divider>
<v-pagination
style="margin-top: 10px; margin-bottom: 10px;"
v-model="mainTableCurrentPage"
:length="mainTableTotalPage"
></v-pagination>
</v-card>
</v-flex>
<v-flex xs6 class="right" fill-height pa-1>
<v-card>
<v-card-text>
<v-layout row wrap>
<v-flex xs12>
<v-layout row wrap>
<v-flex xs12>
<div>
<span>Nama Pengambil: </span>
<span>{{ selectedMainTable.M_RequesterFullName }}</span>
</div>
</v-flex>
</v-layout>
</v-flex>
<v-flex xs12 pt-2 pb-2>
<v-layout row wrap>
<v-flex xs12>
<v-data-table
:headers="detailHeaders"
:items="detailTable"
:loading="detailTableLoading"
hide-actions
class="elevation-1"
>
<template slot="items" slot-scope="props">
<td class="text-xs-center pa-2">
{{ props.item.RowNumber }}
</td>
<td class="text-xs-left pa-2">
{{ props.item.PurchaseRequestDirectDescription }}
</td>
<td class="text-xs-left pa-2">
{{
props.item.PurchaseRequestDirectDetailAmountRequest
}}
</td>
<td class="text-xs-left pa-2">
{{
props.item.PurchaseRequestDirectDetailAmount ??
props.item.PurchaseRequestDirectDetailAmountRequest
}}
</td>
<td class="text-xs-left pa-2">
<div class="date-type-table">
<span>
Satuan : Rp
{{
props.item.PurchaseRequestDirectDetailEstimationPrice.toString().replace(
/\B(?=(\d{3})+(?!\d))/g,
"."
)
}}
</span>
<span>
Total : Rp
{{
(
props.item
.PurchaseRequestDirectDetailAmountRequest *
props.item
.PurchaseRequestDirectDetailEstimationPrice
)
.toString()
.replace(/\B(?=(\d{3})+(?!\d))/g, ".")
}}
</span>
</div>
</td>
<template
v-if="
!(
selectedMainTable.PurchaseRequestDirectStatus !=
'Pending'
)
"
>
<td class="text-xs-center pa-2">
<v-icon small @click="updateDetail(props.item)"
>edit</v-icon
>
<v-icon small @click="deleteDetail(props.item)"
>delete</v-icon
>
</td>
</template>
<template v-else>
<td class="text-xs-center pa-2"></td>
</template> </template
></v-data-table>
</v-flex>
</v-layout>
</v-flex>
<div style="width: 100%;" class="d-flex justify-space-between">
<div class="flex-items-center justify-start">
<v-text-field
v-if="
selectedMainTable.PurchaseRequestDirectStatus == 'Pending'
"
v-model="xNote"
label="Catatan"
style="max-width: 300px;"
hide-details
outline
:disabled="!(Object.keys(selectedMainTable).length > 0)"
></v-text-field>
<div
v-else-if="
selectedMainTable.PurchaseRequestDirectStatus ==
'Approved'
"
class="flex-items-center justify-start"
>
<span>Catatan :</span>
<span>{{
selectedMainTable.PurchaseRequestDirectNote == ""
? "-"
: selectedMainTable.PurchaseRequestDirectNote
}}</span>
</div>
</div>
<div class="d-flex justify-end" style="gap: 0.5rem;">
<v-btn
color="error"
flat
dark
style="max-width: 100px;"
:disabled="
!(Object.keys(selectedMainTable).length > 0) ||
selectedMainTable.PurchaseRequestDirectStatus != 'Pending'
"
@click="
rejectRequest(
selectedMainTable.PurchaseRequestDirectID,
selectedMainTable.PurchaseRequestDirectStatus
)
"
>
Reject
</v-btn>
<v-btn
color="primary"
dark
style="max-width: 100px;"
:disabled="
!(Object.keys(selectedMainTable).length > 0) ||
selectedMainTable.PurchaseRequestDirectStatus != 'Pending'
"
@click="
approveRequest(
selectedMainTable.PurchaseRequestDirectID,
selectedMainTable.PurchaseRequestDirectStatus
)
"
>
Approve
</v-btn>
</div>
</div>
</v-layout>
</v-card-text>
</v-card>
</v-flex>
</v-layout>
<one-dialog-alert
:status="dialogAlertRejectRequest"
:msg="msgAlertDeleteOrReject"
@forget-dialog-alert="dialogAlertRejectRequest = false"
@close-dialog-alert="closeAndRejectRequest()"
></one-dialog-alert>
<one-dialog-alert
:status="dialogAlertDeleteDetail"
:msg="msgAlertDeleteOrReject"
@forget-dialog-alert="dialogAlertDeleteDetail = false"
@close-dialog-alert="closeAndDeleteDetail()"
></one-dialog-alert>
<v-layout row justify-center>
<v-dialog v-model="dialogDetail" persistent max-width="500px">
<v-card>
<v-card-title class="headline grey lighten-2" primary-title>
FORM EDIT REQUEST DETAIL
</v-card-title>
<v-card-text class="pt-0 pb-0">
<v-form ref="formDetail" v-model="validationDetail" lazy-validation>
<v-layout wrap>
<v-flex xs12>
<v-text-field
v-model="xAmount"
type="number"
label="Jumlah"
:min="0"
:max="
selectedDetailTable.PurchaseRequestDirectDetailAmountRequest
"
:rules="amountRules"
required
></v-text-field>
</v-flex>
</v-layout>
</v-form>
</v-card-text>
<v-card-actions>
<v-spacer></v-spacer>
<v-btn color="error" flat @click="closeDialogDetail()">
Tutup
</v-btn>
<v-btn color="primary" dark @click="updateFormDetail()">
Simpan Perubahan
</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
</v-layout>
</div>
</template>
<style scoped>
.date-type-table {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.flex-items-center {
display: flex;
align-items: center;
gap: 0.25rem;
}
.table.v-table tbody td,
.table.v-table tbody tr {
height: 40px;
}
.table.v-table thead tr {
height: 40px;
}
</style>
<script>
module.exports = {
components: {
"one-dialog-alert": httpVueLoader("../../common/oneDialogAlert.vue"),
"one-dialog-error": httpVueLoader("../../common/oneDialogError.vue"),
},
data() {
return {
msgAlertDeleteOrReject: "",
dialogAlertRejectRequest: false,
dialogAlertDeleteDetail: false,
amountRules: [(v) => v >= 0 || "Jumlah harus diisi"],
validationDetail: false,
headers: [
{
text: "NO. PD",
align: "center",
sortable: false,
value: "no",
width: "15%",
class: "blue lighten-3 white--text",
},
{
text: "TANGGAL",
align: "left",
sortable: false,
value: "date",
width: "30%",
class: "blue lighten-3 white--text",
},
{
text: "KETERANGAN",
align: "left",
sortable: false,
value: "description",
width: "35%",
class: "blue lighten-3 white--text",
},
{
text: "STATUS",
align: "left",
sortable: false,
value: "status",
width: "15%",
class: "blue lighten-3 white--text",
},
{
text: "AKSI",
align: "left",
sortable: false,
value: "action",
width: "5%",
class: "blue lighten-3 white--text",
},
],
detailHeaders: [
{
text: "NO",
align: "center",
sortable: false,
value: "no",
width: "5%",
class: "blue lighten-3 white--text",
},
{
text: "KETERANGAN",
align: "left",
sortable: false,
value: "requestDate",
width: "35%",
class: "blue lighten-3 white--text",
},
{
text: "JMLH REQUEST",
align: "left",
sortable: false,
value: "requestDate",
width: "15%",
class: "blue lighten-3 white--text",
},
{
text: "JUMLAH",
align: "left",
sortable: false,
value: "requestDate",
width: "15%",
class: "blue lighten-3 white--text",
},
{
text: "HARGA",
align: "left",
sortable: false,
value: "requestDate",
width: "25%",
class: "blue lighten-3 white--text",
},
{
text: "AKSI",
align: "left",
sortable: false,
value: "action",
width: "5%",
class: "blue lighten-3 white--text",
},
],
};
},
mounted() {
this.$store.dispatch("manager/search");
},
computed: {
mainTable() {
return this.$store.state.manager.mainTable;
},
detailTable() {
return this.$store.state.manager.detailTable;
},
mainTableLoading() {
return this.$store.state.manager.mainTableLoadingStatus === 1;
},
detailTableLoading() {
return this.$store.state.manager.detailTableLoadingStatus === 1;
},
mainTableTotalPage: {
get() {
return this.$store.state.manager.countMainTable;
},
set(val) {
this.$store.commit("manager/updateCountMainTable", val);
},
},
mainTableCurrentPage: {
get() {
return this.$store.state.manager.mainTableCurrentPage;
},
set(val) {
this.$store.commit("manager/updateMainTableCurrentPage", val);
this.$store.commit("manager/updateMainTableLastId", -1);
this.$store.dispatch("manager/search");
},
},
selectedMainTable: {
get() {
return this.$store.state.manager.selectedMainTable;
},
set(val) {
this.$store.commit("updateSelectedMainTable", val);
},
},
selectedDetailTable: {
get() {
return this.$store.state.manager.selectedDetailTable;
},
set(val) {
this.$store.commit("updateSelectedDetailTable", val);
},
},
menuStartDate: {
get() {
return this.$store.state.manager.menuStartDate;
},
set(val) {
this.$store.commit("manager/updateMenuStartDate", val);
},
},
menuEndDate: {
get() {
return this.$store.state.manager.menuEndDate;
},
set(val) {
this.$store.commit("manager/updateMenuEndDate", val);
},
},
startDateFormatted() {
return this.formatDate(this.fStartDate);
},
endDateFormatted() {
return this.formatDate(this.fEndDate);
},
dStartDate: {
get() {
return this.$store.state.manager.dStartDate;
},
set(val) {
this.$store.commit("manager/updateDStartDate", val);
},
},
dEndDate: {
get() {
return this.$store.state.manager.dEndDate;
},
set(val) {
this.$store.commit("manager/updateDEndDate", val);
},
},
fStartDate: {
get() {
return this.$store.state.manager.fStartDate;
},
set(val) {
this.$store.commit("manager/updateFStartDate", val);
},
},
fEndDate: {
get() {
return this.$store.state.manager.fEndDate;
},
set(val) {
this.$store.commit("manager/updateFEndDate", val);
},
},
fStatus: {
get() {
return this.$store.state.manager.fStatus;
},
set(val) {
this.$store.commit("manager/updateFStatus", val);
},
},
statusOptions() {
return this.$store.state.manager.statusOptions;
},
fSearch: {
get() {
return this.$store.state.manager.fSearch;
},
set(val) {
this.$store.commit("manager/updateFSearch", val);
},
},
xNote: {
get() {
return this.$store.state.manager.xNote;
},
set(val) {
this.$store.commit("manager/updateXNote", val);
},
},
xAmount: {
get() {
return this.$store.state.manager.xAmount;
},
set(val) {
this.$store.commit("manager/updateXAmount", val);
},
},
xPRID: {
get() {
return this.$store.state.manager.xPRID;
},
set(val) {
this.$store.commit("manager/updateXPRID", val);
},
},
xPRDID: {
get() {
return this.$store.state.manager.xPRDID;
},
set(val) {
this.$store.commit("manager/updateXPRDID", val);
},
},
xStatus: {
get() {
return this.$store.state.manager.xStatus;
},
set(val) {
this.$store.commit("manager/updateXStatus", val);
},
},
xDescriptionDetail: {
get() {
return this.$store.state.manager.xDescriptionDetail;
},
set(val) {
this.$store.commit("manager/updateXDescriptionDetail", val);
},
},
dialogDetail: {
get() {
return this.$store.state.manager.dialogDetail;
},
set(val) {
this.$store.commit("manager/updateDialogDetail", val);
},
},
},
methods: {
convertMoney(money){
return one_money(money)
},
isSelected(p) {
return (
p.PurchaseRequestDirectNumber ==
this.$store.state.manager.selectedMainTable
.PurchaseRequestDirectNumber
);
},
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")}`;
},
getChipStatusColor(status) {
switch (status) {
case "Pending":
return "warning";
case "Approved":
return "success";
case "Rejected":
return "error";
case "Completed":
return "info";
case "Paid":
return "success";
default:
return "";
}
},
getChipStatusDetailColor(status) {
switch (status) {
case "Pending":
return "warning";
case "Ordered":
return "success";
case "Received":
return "info";
case "Cancelled":
return "error";
default:
return "warning";
}
},
mainTableSearch() {
this.$store.dispatch("manager/search");
this.$store.commit("manager/updateSelectedMainTable", {});
this.$store.commit("manager/updateDetailTable", []);
},
approveOrViewRequest(val) {
this.$store.commit("manager/updateSelectedMainTable", val);
this.$store.dispatch("manager/searchDetail");
this.xNote = val.PurchaseRequestDirectNote;
},
updateDetail(val) {
this.$store.commit(
"manager/updateXAmount",
val.PurchaseRequestDirectDetailAmount ??
val.PurchaseRequestDirectDetailAmountRequest
);
this.$store.commit("manager/updateSelectedDetailTable", val);
this.$store.commit("manager/updateDialogDetail", true);
},
closeDialogDetail() {
this.$store.commit("manager/updateXAmount", 0);
this.$refs.formDetail.resetValidation();
this.$store.commit("manager/updateDialogDetail", false);
},
updateFormDetail() {
if (this.$refs.formDetail.validate()) {
this.$store.dispatch("manager/updateDetail", {
PRID: this.selectedMainTable.PurchaseRequestDirectID,
PRDID: this.selectedDetailTable.PurchaseRequestDirectDetailID,
PRDDescription: this.selectedDetailTable
.PurchaseRequestDirectDescription,
PRDAmount: parseInt(this.xAmount),
});
}
},
rejectRequest(id, status) {
this.xPRID = id;
this.xStatus = status;
this.msgAlertDeleteOrReject = `Yakin, mau Reject Purchase Request [${this.selectedMainTable.PurchaseRequestDirectNumber}] ?`;
this.dialogAlertRejectRequest = true;
},
closeAndRejectRequest() {
if (this.xStatus === "Pending") {
this.$store.dispatch("manager/rejectRequest", {
PRNumber: this.selectedMainTable.PurchaseRequestDirectNumber,
PRID: this.xPRID,
});
}
this.dialogAlertRejectRequest = false;
},
deleteDetail(data) {
this.xPRID = data.PurchaseRequestDirectDetailPurchaseRequestDirectID;
this.xPRDID = data.PurchaseRequestDirectDetailID;
this.xDescriptionDetail = data.PurchaseRequestDirectDescription;
this.msgAlertDeleteOrReject = `Yakin, mau hapus Request [${data.PurchaseRequestDirectDescription}] ?`;
this.dialogAlertDeleteDetail = true;
},
closeAndDeleteDetail() {
this.$store.dispatch("manager/deleteDetail", {
PRID: this.xPRID,
PRDDescription: this.xDescriptionDetail,
PRDID: this.xPRDID,
});
this.dialogAlertDeleteDetail = false;
},
approveRequest(id, status) {
this.xPRID = id;
this.xStatus = status;
this.detailTable.forEach((detail) => {
if (!detail.PurchaseRequestDirectDetailAmount) {
this.$store.dispatch("manager/updateDetail", {
PRID: this.selectedMainTable.PurchaseRequestDirectID,
PRDID: detail.PurchaseRequestDirectDetailID,
PRDDescription: detail.PurchaseRequestDirectDescription,
PRDAmount: parseInt(
detail.PurchaseRequestDirectDetailAmountRequest
),
});
}
});
if (this.xStatus === "Pending") {
this.$store.dispatch("manager/approveRequest", {
PRID: this.xPRID,
PRNumber: this.selectedMainTable.PurchaseRequestDirectNumber,
PRNote: this.xNote,
});
}
},
},
watch: {
xAmount(val, old) {
if (val <= 0) {
this.$store.commit("manager/updateXAmount", 0);
}
},
},
};
</script>

View File

@@ -0,0 +1,68 @@
<!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">
<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">
<title>One</title>
</head>
<body>
<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 class="left" fill-height pa-1>
<request-kacab></request-kacab>
</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>
<!-- App Script -->
<script type="module">
import {
store
} from './store.js';
window.store = store;
new Vue({
store,
el: "#app",
methods: {},
components: {
'one-navbar': httpVueLoader('../../../apps/components/oneNavbarComponent.vue'),
'one-footer': httpVueLoader('../../../apps/components/oneFooter.vue'),
'request-listing': httpVueLoader('./components/requestListing.vue'),
'request-kacab': httpVueLoader('./components/acconeprkacab.vue')
}
})
</script>
<style>
[v-cloak] {
display: none
}
</style>
</body>
</html>

View File

@@ -0,0 +1,353 @@
// 1 => LOADING
// 2 => DONE
// 3 => ERROR
import * as api from "../api/api-manager.js";
export default {
namespaced: true,
state: {
mainTable: [],
detailTable: [],
countMainTable: 0,
countDetailTable: 0,
mainTableLoadingStatus: 0,
detailTableLoadingStatus: 0,
mainTableErrorMessage: "",
detailTableErrorMessage: "",
mainTableCurrentPage: 1,
mainTableLastId: -1,
selectedMainTable: {},
selectedDetailTable: {},
statusOptions: [
{ value: 0, title: "All" },
{ value: 2, title: "Pending" },
{ value: 3, title: "Approved" },
{ value: 4, title: "Rejected" },
{ value: 5, title: "Paid" },
{ value: 6, title: "Completed" },
],
menuStartDate: false,
menuEndDate: false,
dStartDate: new Date().toISOString().substring(0, 10),
dEndDate: new Date().toISOString().substring(0, 10),
fStartDate: moment(new Date()).format("YYYY-MM-DD"),
fEndDate: moment(new Date()).format("YYYY-MM-DD"),
fStatus: 0,
fSearch: "",
xNote: "",
xAmount: 0,
xPRID: 0,
xPRDID: 0,
xStatus: "",
xDescriptionDetail: "",
dialogDetail: false,
errMessage: "",
succesMessage: "",
alertError: false,
alertSuccess: false,
errors: [],
},
mutations: {
updateMainTable(state, val) {
state.mainTable = val;
},
updateDetailTable(state, val) {
state.detailTable = val;
},
updateCountMainTable(state, val) {
state.countMainTable = val;
},
updateCountDetailTable(state, val) {
state.countDetailTable = val;
},
updateMainTableLoadingStatus(state, val) {
state.mainTableLoadingStatus = val;
},
updateDetailTableLoadingStatus(state, val) {
state.detailTableLoadingStatus = val;
},
updateMainTableErrorMessage(state, val) {
state.mainTableErrorMessage = val;
},
updateDetailTableErrorMessage(state, val) {
state.detailTableErrorMessage = val;
},
updateMainTableCurrentPage(state, val) {
state.mainTableCurrentPage = val;
},
updateMainTableLastId(state, val) {
state.mainTableLastId = val;
},
updateSelectedMainTable(state, val) {
state.selectedMainTable = val;
},
updateSelectedDetailTable(state, val) {
state.selectedDetailTable = val;
},
updateMenuStartDate(state, val) {
state.menuStartDate = val;
},
updateMenuEndDate(state, val) {
state.menuEndDate = val;
},
updateDStartDate(state, val) {
state.dStartDate = val;
},
updateDEndDate(state, val) {
state.dEndDate = val;
},
updateFStartDate(state, val) {
state.fStartDate = val;
},
updateFEndDate(state, val) {
state.fEndDate = val;
},
updateFStatus(state, val) {
state.fStatus = val;
},
updateFSearch(state, val) {
state.fSearch = val;
},
updateXNote(state, val) {
state.xNote = val;
},
updateXAmount(state, val) {
state.xAmount = val;
},
updateXPRID(state, val) {
state.xPRID = val;
},
updateXPRDID(state, val) {
state.xPRDID = val;
},
updateXStatus(state, val) {
state.xStatus = val;
},
updateXDescriptionDetail(state, val) {
state.xDescriptionDetail = val;
},
updateDialogDetail(state, val) {
state.dialogDetail = val;
},
updateErrMessage(state, val) {
state.errMessage = val;
},
updateSuccessMessage(state, val) {
state.successMessage = val;
},
updateAlertError(state, val) {
state.alertError = val;
},
updateAlertSuccess(state, val) {
state.alertSuccess = val;
},
updateErrors(state, val) {
state.errors = val;
},
},
actions: {
async search(context) {
context.commit("updateMainTableLoadingStatus", 1);
try {
var payload = {
token: one_token(),
currentPage: context.state.mainTableCurrentPage,
startDate: context.state.fStartDate,
endDate: context.state.fEndDate,
status: context.state.fStatus,
search: context.state.fSearch,
lastId: -1,
};
let response = await api.search(payload);
if (response.status != "OK") {
context.commit("updateMainTableLoadingStatus", 3);
context.commit("updateMainTableErrorMessage", response.message);
} else {
context.commit("updateMainTableLoadingStatus", 2);
context.commit("updateMainTableErrorMessage", "");
let data = {
records: response.data.records,
total: response.data.total,
};
context.commit("updateMainTable", data.records);
context.commit("updateCountMainTable", data.total);
}
} catch (e) {
context.commit("updateMainTableLoadingStatus", 3);
context.commit("updateMainTableErrorMessage", e.message);
}
},
async searchDetail(context) {
context.commit("updateDetailTableLoadingStatus", 1);
try {
var payload = {
token: one_token(),
PRID: context.state.selectedMainTable.PurchaseRequestDirectID,
};
let response = await api.searchDetail(payload);
if (response.status != "OK") {
context.commit("updateDetailTableLoadingStatus", 3);
context.commit("updateDetailTableErrorMessage", response.message);
} else {
context.commit("updateDetailTableLoadingStatus", 2);
context.commit("updateDetailTableErrorMessage", "");
let data = {
records: response.data.records,
total: response.data.total,
};
context.commit("updateDetailTable", data.records);
context.commit("updateCountDetailTable", data.total);
}
} catch (e) {
context.commit("updateDetailTableLoadingStatus", 3);
context.commit("updateDetailTableErrorMessage", e.message);
}
},
async updateDetail(context, payload) {
try {
payload.token = one_token();
let response = await api.updateDetail(payload);
if (response.status != "OK") {
context.commit("updateErrMessage", response.message);
context.commit("updateAlertError", true);
} else {
context.commit("updateErrMessage", "");
let data = {
records: response.data.records,
total: response.data.total,
};
if (data.total !== -1) {
context.commit("updateErrors", []);
context.commit("updateAlertSuccess", true);
context.commit("updateDialogDetail", false);
var msg = `Request [${payload.PRDDescription}] telah diperbarui`;
context.commit("updateSuccessMessage", msg);
context.dispatch("search");
context.dispatch("searchDetail");
} else {
context.commit("updateErrors", response.data.errors);
}
}
} catch (e) {
context.commit("updateErrMessage", e.message);
context.commit("updateAlertError", true);
}
},
async rejectRequest(context, payload) {
try {
payload.token = one_token();
let response = await api.rejectRequest(payload);
if (response.status != "OK") {
context.commit("updateErrMessage", response.message);
context.commit("updateAlertError", true);
} else {
context.commit("updateErrMessage", "");
let data = {
records: response.data.records,
total: response.data.total,
};
if (data.total !== -1) {
context.commit("updateErrors", []);
context.commit("updateAlertSuccess", true);
var msg = `Purchase Request [${payload.PRNumber}] sudah ditolak`;
context.commit("updateSuccessMessage", msg);
context.commit("updateSelectedMainTable", {});
context.commit("updateDetailTable", []);
context.commit("updateSelectedDetailTable", {});
context.dispatch("search");
} else {
context.commit("updateErrors", response.data.errors);
}
}
} catch (e) {
context.commit("updateErrMessage", e.message);
context.commit("updateAlertError", true);
}
},
async deleteDetail(context, payload) {
try {
payload.token = one_token();
let response = await api.deleteDetail(payload);
if (response.status !== "OK") {
context.commit("updateErrMessage", response.message);
context.commit("updateAlertError", true);
} else {
context.commit("updateErrMessage", "");
let data = {
records: response.data.records,
total: response.data.total,
};
if (data.total !== -1) {
context.commit("updateErrors", []);
context.commit("updateAlertSuccess", true);
var msg = `Request [${payload.PRDDescription}] sudah dihapus`;
context.commit("updateSuccessMessage", msg);
context.dispatch("search");
context.dispatch("searchDetail");
} else {
context.commit("updateErrors", response.data.errors);
}
}
} catch (e) {
context.commit("updateErrMessage", e.message);
context.commit("updateAlertError", true);
}
},
async approveRequest(context, payload) {
try {
payload.token = one_token();
let response = await api.approveRequest(payload);
if (response.status != "OK") {
context.commit("updateErrMessage", response.message);
context.commit("updateAlertError", true);
} else {
context.commit("updateErrMessage", "");
let data = {
records: response.data.records,
total: response.data.total,
};
if (data.total !== -1) {
context.commit("updateErrors", []);
context.commit("updateAlertSuccess", true);
var msg = `Purchase Request [${payload.PRNumber}] telah diapprove`;
context.commit("updateSuccessMessage", msg);
context.dispatch("search");
context.commit("updateSelectedMainTable", data.records[0]);
context.dispatch("searchDetail");
} else {
context.commit("updateErrors", response.data.errors);
}
}
} catch (e) {
context.commit("updateErrMessage", e.message);
context.commit("updateAlertError", true);
}
},
},
};

View File

@@ -0,0 +1,358 @@
// 1 => LOADING
// 2 => DONE
// 3 => ERROR
import * as api from "../api/prkcab.js";
export default {
namespaced: true,
state: {
user: one_user(),
statusOptions: [
{ value: 'All', title: "All" },
{ value: 'Draft', title: "Draft" },
{ value: 'Pending', title: "Pending" },
{ value: 'Approved', title: "Approved" },
{ value: 'Rejected', title: "Rejected" },
{ value: 'Terkirim', title: "Terkirim" },
{ value: 'Partial', title: "Partial" },
{ value: 'Selesai', title: "Selesai" },
],
selectedStatus: { value: 'All', title: "All" },
selectedDate: moment(new Date()).format('YYYY-MM-DD'),
selectedEndDate: moment(new Date()).format('YYYY-MM-DD'),
search: '',
totalPage: 0,
selectedPage: 1,
loading: false,
prList: [],
dialogApprove: false,
detailData: [],
selectedPr: {},
loadingDetail: false,
snackbar: {
state: false,
type: 'success',
message: '',
},
user_approvelevel: 'x',
status: '',
xstartdate: '',
act_dialog: '',
dialogQty: false,
selectedItems: [],
flag: '',
},
mutations: {
update_snackbar(state, val) {
state.snackbar = val;
},
update_loadingDetail(state, val) {
state.loadingDetail = val;
},
update_selectedPr(state, val) {
state.selectedPr = val;
},
update_detailData(state, val) {
state.detailData = val;
},
update_dialogApprove(state, val) {
state.dialogApprove = val;
},
update_selectedStatus(state, val) {
state.selectedStatus = val;
},
update_selectedDate(state, val) {
state.selectedDate = val;
},
update_selectedEndDate(state, val) {
state.selectedEndDate = val;
},
update_search(state, val) {
state.search = val;
},
update_loading(state, val) {
state.loading = val;
},
update_totalPage(state, val) {
state.totalPage = val;
},
update_selectedPage(state, val) {
state.selectedPage = val;
},
update_prList(state, val) {
state.prList = val;
},
update_user_approvelevel(state, val) {
state.user_approvelevel = val
},
update_status(state, val) {
state.status = val
},
update_xstartdate(state, val) {
state.xstartdate = val
},
update_act_dialog(state, val) {
state.act_dialog = val
},
update_dialogQty(state, val) {
state.dialogQty = val
},
update_selectedItems(state, val) {
state.selectedItems = val;
},
update_flag(state, val) {
state.flag = val
},
},
actions: {
async search(context) {
context.commit("update_loading", true);
try {
var url_string = window.location.href
var url = new URL(url_string);
var status = url.searchParams.get("status");
var xstartdate = url.searchParams.get("startdate");
var xsearch = url.searchParams.get("search");
var xflag = url.searchParams.get("flag");
// untuk notifikasi
if (xflag == 'N') {
if (xsearch != null && xsearch != '') {
context.commit("update_search", xsearch);
}
if (status != null && status != '') {
context.commit("update_selectedStatus", { value: status, title: status });
}
if (xstartdate != null && xstartdate != '') {
context.commit("update_selectedDate", xstartdate);
context.commit("update_selectedEndDate", xstartdate);
}
} else if (xflag == 'G') {
// untuk get data param approve all
if (status != null && status != '') {
context.commit("update_selectedStatus", { value: status, title: status });
}
if (xstartdate != null && xstartdate != '') {
context.commit("update_selectedDate", xstartdate);
context.commit("update_selectedEndDate", moment(new Date()).format('YYYY-MM-DD'));
}
context.commit("update_flag", xflag);
}
var payload = {
token: one_token(),
search: context.state.search,
startDate : context.state.selectedDate,
endDate : context.state.selectedEndDate,
status: context.state.selectedStatus.value,
page: context.state.selectedPage,
flag: context.state.flag,
};
let response = await api.search(payload);
if (response.status != "OK") {
let snackbar = {
state: true,
type: "error",
message: response.message,
}
context.commit("update_snackbar", snackbar);
context.commit("update_loading", false);
} else {
let data = {
records: response.data.records,
total: response.data.total,
};
context.commit("update_totalPage", data.total);
context.commit("update_prList", data.records);
context.commit("update_loading", false);
}
} catch (e) {
let snackbar = {
state: true,
type: "error",
message: e.message,
}
context.commit("update_snackbar", snackbar);
context.commit("update_loading", false);
// context.commit("updateMainTableLoadingStatus", 3);
// context.commit("updateMainTableErrorMessage", e.message);
}
},
async approve(context, prm) {
context.commit("update_loading", true);
try {
prm.token = one_token()
let response = await api.approve(prm);
if (response.status != "OK") {
let snackbar = {
state: true,
type: "error",
message: response.message,
}
context.commit("update_snackbar", snackbar);
context.commit("update_loading", false);
} else {
let data = {
records: response.data.records,
total: response.data.total,
};
// context.commit("update_totalPage", data.total);
// context.commit("update_prList", data.records);
await context.dispatch("search");
context.commit("update_dialogApprove", false);
let msg = '';
if (prm.type === 'A') {
msg = 'Berhasil approve purchase request ' + prm.pr.prNumber
} else if (prm.type === 'R') {
msg = 'Berhasil reject purchase request ' + prm.pr.prNumber
} else if (prm.type === 'U') {
msg = 'Berhasil unapprove purchase request ' + prm.pr.prNumber
}
let snackbar = {
state: true,
type: "success",
message: msg,
}
context.commit("update_snackbar", snackbar);
context.commit("update_loading", false);
}
} catch (e) {
let snackbar = {
state: true,
type: "error",
message: e.message,
}
context.commit("update_snackbar", snackbar);
context.commit("update_loading", false);
// context.commit("updateMainTableLoadingStatus", 3);
// context.commit("updateMainTableErrorMessage", e.message);
}
},
async getDetail(context) {
context.commit("update_loadingDetail", true);
try {
var payload = {
token: one_token(),
id: context.state.selectedPr.prID,
};
let response = await api.getDetail(payload);
if (response.status != "OK") {
let snackbar = {
state: true,
type: "error",
message: response.message,
}
context.commit("update_snackbar", snackbar);
context.commit("update_loadingDetail", false);
} else {
let data = {
records: response.data.records,
total: response.data.total,
};
context.commit("update_detailData", response.data);
context.commit("update_loadingDetail", false);
}
} catch (e) {
let snackbar = {
state: true,
type: "error",
message: e.message,
}
context.commit("update_snackbar", snackbar);
context.commit("update_loadingDetail", false);
// context.commit("updateMainTableLoadingStatus", 3);
// context.commit("updateMainTableErrorMessage", e.message);
}
},
async getapprovelevel(context) {
context.commit("update_loadingDetail", true);
try {
let payload = {
token: one_token()
}
let resp = await api.approvelevel(payload)
if (resp.status != 'OK') {
let snackbar = {
state: true,
type: "error",
message: resp.message,
}
context.commit("update_snackbar", snackbar);
context.commit("update_loadingDetail", false);
} else {
context.commit("update_user_approvelevel", resp.data.M_UserM_ApproveLevelID)
}
} catch (error) {
let snackbar = {
state: true,
type: "error",
message: error.message,
}
context.commit("update_snackbar", snackbar);
context.commit("update_loadingDetail", false);
}
},
async updateqty(context, prm) {
context.commit("update_loading", true);
try {
prm.token = one_token()
let response = await api.updateqty(prm);
if (response.status != "OK") {
let snackbar = {
state: true,
type: "error",
message: response.message,
}
context.commit("update_snackbar", snackbar);
context.commit("update_loading", false);
} else {
let data = {
records: response.data.records,
total: response.data.total,
};
// context.commit("update_totalPage", data.total);
// context.commit("update_prList", data.records);
await context.dispatch("search");
context.commit("update_dialogQty", false);
context.commit("update_detailData", []);
let msg = 'Berhasil edit qty';
let snackbar = {
state: true,
type: "success",
message: msg,
}
context.commit("update_snackbar", snackbar);
context.commit("update_loading", false);
}
} catch (e) {
let snackbar = {
state: true,
type: "error",
message: e.message,
}
context.commit("update_snackbar", snackbar);
context.commit("update_loading", false);
// context.commit("updateMainTableLoadingStatus", 3);
// context.commit("updateMainTableErrorMessage", e.message);
}
},
},
};

View File

@@ -0,0 +1,14 @@
import manager from "./modules/manager.js";
import system from "../../../apps/modules/system/system.js";
import prkacab from "./modules/prkacab.js"
export const store = new Vuex.Store({
modules: {
manager: manager,
system: system,
prkacab: prkacab
},
state: {},
mutations: {},
actions: {},
});