add modules folder based on s_menu
This commit is contained in:
559
test/vuex/acc-one-item-out-v3/api/api-requester.js
Normal file
559
test/vuex/acc-one-item-out-v3/api/api-requester.js
Normal file
@@ -0,0 +1,559 @@
|
||||
const URL = "/one-api/mockup/itemout/";
|
||||
|
||||
export async function search(prm) {
|
||||
try {
|
||||
var response = await axios.post(URL + "itemoutv3/search", prm);
|
||||
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(prm) {
|
||||
try {
|
||||
var response = await axios.post(
|
||||
URL + "itemoutv3/searchDetail",
|
||||
prm
|
||||
);
|
||||
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 saveRequest(prm) {
|
||||
try {
|
||||
var response = await axios.post(
|
||||
URL + "itemoutv3/saveRequest",
|
||||
prm
|
||||
);
|
||||
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 updateRequest(prm) {
|
||||
try {
|
||||
var response = await axios.post(
|
||||
URL + "itemoutv3/updateRequest",
|
||||
prm
|
||||
);
|
||||
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 deleteRequest(prm) {
|
||||
try {
|
||||
var response = await axios.post(
|
||||
URL + "itemoutv3/deleteRequest",
|
||||
prm
|
||||
);
|
||||
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 saveDetail(prm) {
|
||||
try {
|
||||
var response = await axios.post(
|
||||
URL + "itemoutv3/saveDetail",
|
||||
prm
|
||||
);
|
||||
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(prm) {
|
||||
try {
|
||||
var response = await axios.post(
|
||||
URL + "itemoutv3/updateDetail",
|
||||
prm
|
||||
);
|
||||
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(prm) {
|
||||
try {
|
||||
var response = await axios.post(
|
||||
URL + "itemoutv3/deleteDetail",
|
||||
prm
|
||||
);
|
||||
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 getWarehouse(prm) {
|
||||
try {
|
||||
var response = await axios.post(
|
||||
URL + "itemoutv3/getWarehouse",
|
||||
prm
|
||||
);
|
||||
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 getDepartment(prm) {
|
||||
try {
|
||||
var response = await axios.post(
|
||||
URL + "itemoutv3/getDepartment",
|
||||
prm
|
||||
);
|
||||
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 searchItem(prm) {
|
||||
try {
|
||||
var resp = await axios.post(URL + 'itemoutv3/searchItem', 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 getUnit(prm) {
|
||||
try {
|
||||
var resp = await axios.post(URL + 'itemoutv3/getUnit', 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 orderConfirm(prm) {
|
||||
try {
|
||||
var response = await axios.post(
|
||||
URL + "itemoutv3/orderConfirm",
|
||||
prm
|
||||
);
|
||||
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 listrequestitem(prm) {
|
||||
try {
|
||||
var response = await axios.post(URL + "itemoutv3/listrequest", prm);
|
||||
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 getDivisionUser(payload) {
|
||||
try {
|
||||
var response = await axios.post(URL + "RequestItemOut/getDivisionUser", 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(prm) {
|
||||
try {
|
||||
var response = await axios.post(URL + "itemoutv3/approveRequest", prm);
|
||||
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 rejectedRequest(prm) {
|
||||
try {
|
||||
var response = await axios.post(URL + "itemoutv3/rejectedRequest", prm);
|
||||
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 getDivisionByUser(prm) {
|
||||
try {
|
||||
var resp = await axios.post(URL + 'itemoutv3/getDivisionByUser', 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 getItemRequest(prm) {
|
||||
try {
|
||||
var resp = await axios.post(URL + 'itemoutv3/getItemRequest', 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 getDetailItemOut(prm) {
|
||||
try {
|
||||
var resp = await axios.post(URL + 'itemoutv3/getDetailItemOut', 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 getItemOuts(prm) {
|
||||
try {
|
||||
var resp = await axios.post(URL + 'itemoutv3/getItemOuts', 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 confirmIO(prm) {
|
||||
try {
|
||||
var resp = await axios.post(URL + 'itemoutv3/confirmIO', 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 approveIO(prm) {
|
||||
try {
|
||||
var resp = await axios.post(URL + 'itemoutv3/approveIO', 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 processIO(prm) {
|
||||
try {
|
||||
var resp = await axios.post(URL + 'itemoutv3/processIO', 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 rejectRequest(prm) {
|
||||
try {
|
||||
var resp = await axios.post(URL + 'itemoutv3/rejectRequest', 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 getItemBatchListing(params) {
|
||||
try {
|
||||
var resp = await axios.post(URL + "itemoutv3/getItemBatchListing", params);
|
||||
if (resp.status !== 200) {
|
||||
return {
|
||||
status: "ERR",
|
||||
message: resp.message
|
||||
}
|
||||
}
|
||||
|
||||
let data = resp.data
|
||||
return data
|
||||
} catch (error) {
|
||||
return {
|
||||
status: "ERR",
|
||||
message: error.message
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export async function getlevel(prm) {
|
||||
try {
|
||||
var resp = await axios.post(URL + "itemoutv3/getlevel", 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,
|
||||
};
|
||||
}
|
||||
}
|
||||
324
test/vuex/acc-one-item-out-v3/components/addItemDetailDialog.vue
Normal file
324
test/vuex/acc-one-item-out-v3/components/addItemDetailDialog.vue
Normal file
@@ -0,0 +1,324 @@
|
||||
<template>
|
||||
<v-layout row justify-center>
|
||||
<v-dialog v-model="dialogDetail" persistent max-width="50vw">
|
||||
<v-card>
|
||||
<v-card-title class="headline grey lighten-2" primary-title>
|
||||
FORM DETAIL
|
||||
</v-card-title>
|
||||
<v-card-text class="pt-0 pb-0">
|
||||
|
||||
<v-layout wrap>
|
||||
<v-flex xs12>
|
||||
<code
|
||||
class="mb-2 mt-2"
|
||||
style="font-size: 14px"
|
||||
>Gudang : {{ this.selectedMainTable.WarehouseName }}</code
|
||||
>
|
||||
</v-flex>
|
||||
<v-flex xs12>
|
||||
<v-autocomplete label="Item" :items="itemList" v-model="selectedItem"
|
||||
:search-input.sync="search_item"
|
||||
auto-select-first no-filter item-text="M_ItemDesc" return-object
|
||||
no-data-text="Pilih Item" required>
|
||||
<template slot="item" slot-scope="{ item }">
|
||||
<v-list-tile-content>
|
||||
<v-list-tile-title v-text="item.M_ItemDesc"></v-list-tile-title>
|
||||
<v-list-tile-sub-title
|
||||
v-text="item.ItemCode"
|
||||
></v-list-tile-sub-title>
|
||||
</v-list-tile-content>
|
||||
</template>
|
||||
</v-autocomplete>
|
||||
<p v-if="checkErrorForm('requireItem')" class="error pl-2 pr-2" style="color:#fff">Item harus diisi</p>
|
||||
</v-flex>
|
||||
<v-flex xs12>
|
||||
<v-text-field
|
||||
label="Stock Qty"
|
||||
:value="selectedItem.StockQty"
|
||||
readonly>
|
||||
</v-text-field>
|
||||
</v-flex>
|
||||
<v-flex xs12>
|
||||
<v-text-field
|
||||
v-model="xQty"
|
||||
type="number"
|
||||
label="Qty"
|
||||
required
|
||||
></v-text-field>
|
||||
<p v-if="checkErrorForm('requireQty')" class="error pl-2 pr-2" style="color:#fff">Qty harus diisi</p>
|
||||
</v-flex>
|
||||
<v-flex xs12>
|
||||
<v-autocomplete label="Item Unit" v-model="selected_item_unit"
|
||||
:items="item_units" :search-input.sync="search_item_unit"
|
||||
auto-select-first no-filter item-text="ItemUnitName"
|
||||
return-object
|
||||
no-data-text="Pilih Item Unit"
|
||||
required>
|
||||
<template slot="item" slot-scope="{ item }">
|
||||
<v-list-tile-content>
|
||||
<v-list-tile-title v-text="item.ItemUnitName"></v-list-tile-title>
|
||||
</v-list-tile-content>
|
||||
</template>
|
||||
</v-autocomplete>
|
||||
<p v-if="checkErrorForm('requireItemUnit')" class="error pl-2 pr-2" style="color:#fff">Item Unit harus diisi</p>
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
</v-card-text>
|
||||
<v-card-actions>
|
||||
<v-spacer></v-spacer>
|
||||
<v-btn color="error" flat @click="closeDialogDetail()"> Tutup </v-btn>
|
||||
<v-btn v-if="act === 'new'" color="primary" dark @click="saveDetail()"
|
||||
>Simpan</v-btn
|
||||
>
|
||||
<v-btn
|
||||
v-if="act === 'edit'"
|
||||
color="primary"
|
||||
dark
|
||||
@click="updateDetail()"
|
||||
>Simpan Perubahan</v-btn
|
||||
>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
</v-layout>
|
||||
</template>
|
||||
|
||||
<style>
|
||||
.red-hint .v-messages__message {
|
||||
color: red !important;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
module.exports = {
|
||||
name: "AddRequestDetailDialog",
|
||||
data() {
|
||||
return {
|
||||
itemRules: [(v) => !!v || "Item harus diisi"],
|
||||
itemUnitRules: [(v) => !!v || "Item Unit harus diisi"],
|
||||
descriptionRules: [(v) => !!v || "Deskripsi harus diisi"],
|
||||
amountRules: [(v) => (!!v && v > 0) || "Jumlah harus diisi"],
|
||||
priceRules: [(v) => (!!v && v > 0) || "Harga harus diisi"],
|
||||
validationDetail: false,
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
|
||||
},
|
||||
computed: {
|
||||
selectedMainTable() {
|
||||
return this.$store.state.requester.selectedMainTable;
|
||||
},
|
||||
selectedDetailTable() {
|
||||
return this.$store.state.requester.selectedDetailTable;
|
||||
},
|
||||
xDescriptionDetail: {
|
||||
get() {
|
||||
return this.$store.state.requester.xDescriptionDetail;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateXDescriptionDetail", val);
|
||||
},
|
||||
},
|
||||
xQty: {
|
||||
get() {
|
||||
return this.$store.state.requester.xQty;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateXQty", val);
|
||||
},
|
||||
},
|
||||
xPrice: {
|
||||
get() {
|
||||
return this.$store.state.requester.xPrice;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateXPrice", val);
|
||||
},
|
||||
},
|
||||
xIsCito: {
|
||||
get() {
|
||||
return this.$store.state.requester.xIsCito;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateXIsCito", val);
|
||||
},
|
||||
},
|
||||
dialogDetail: {
|
||||
get() {
|
||||
return this.$store.state.requester.dialogDetail;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateDialogDetail", val);
|
||||
},
|
||||
},
|
||||
act() {
|
||||
return this.$store.state.requester.act;
|
||||
},
|
||||
itemList() {
|
||||
return this.$store.state.requester.itemList;
|
||||
},
|
||||
selectedItem: {
|
||||
get() {
|
||||
return this.$store.state.requester.selectedItem;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateSelectedItem", val);
|
||||
this.$store.commit("requester/updateXPrice", '');
|
||||
this.$store.dispatch("requester/getUnit", {search: "", itemID: this.selectedItem.M_ItemID})
|
||||
this.$store.commit("requester/updateSelectedItemUnit", {});
|
||||
// if (this.$store.state.requester.item_units.length != 0) {
|
||||
// } else {
|
||||
// this.$store.dispatch("requester/getUnit", {search: this.search_item_unit, itemID: this.selectedItem.M_ItemID})
|
||||
// }
|
||||
},
|
||||
},
|
||||
search_item: {
|
||||
get() {
|
||||
return this.$store.state.requester.search_item;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/update_search_item", val);
|
||||
},
|
||||
},
|
||||
item_units() {
|
||||
return this.$store.state.requester.item_units;
|
||||
},
|
||||
selected_item_unit: {
|
||||
get() {
|
||||
return this.$store.state.requester.selected_item_unit;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateSelectedItemUnit", val);
|
||||
},
|
||||
},
|
||||
search_item_unit: {
|
||||
get() {
|
||||
return this.$store.state.requester.search_item_unit;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateSearchItemUnit", val);
|
||||
},
|
||||
},
|
||||
total_price() {
|
||||
return this.$store.state.requester.total_price;
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
// check error form
|
||||
checkErrorForm(value) {
|
||||
var errors = this.$store.state.requester.errorsform
|
||||
if (errors.includes(value)) {
|
||||
return true
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
},
|
||||
closeDialogDetail() {
|
||||
this.$store.commit("requester/updateSelectedItem", {});
|
||||
this.$store.commit("requester/updateXQty", "");
|
||||
this.$store.commit("requester/updateXPrice", "");
|
||||
this.$store.commit("requester/updateXIsCito", false);
|
||||
this.$store.commit("requester/updateDialogDetail", false);
|
||||
},
|
||||
saveDetail() {
|
||||
this.$store.commit("requester/updateErrorsform", [])
|
||||
var errors = this.$store.state.requester.errorsform
|
||||
|
||||
if(_.isEmpty(this.selectedItem)){
|
||||
errors.push("requireItem")
|
||||
}
|
||||
if(_.isEmpty(this.xQty)){
|
||||
errors.push("requireQty")
|
||||
}
|
||||
if(_.isEmpty(this.selected_item_unit)){
|
||||
errors.push("requireItemUnit")
|
||||
}
|
||||
if (errors.length === 0) {
|
||||
this.$store.commit("requester/updateErrorsform", [])
|
||||
this.$store.dispatch("requester/saveDetail", {
|
||||
IOID: this.selectedMainTable.T_ItemOutID,
|
||||
itemID: this.selectedItem.M_ItemID,
|
||||
itemDescription: this.selectedItem.M_ItemDesc,
|
||||
qty: this.xQty,
|
||||
itemUnitID: this.selected_item_unit.ItemUnitID
|
||||
});
|
||||
}
|
||||
},
|
||||
updateDetail() {
|
||||
this.$store.commit("requester/updateErrorsform", [])
|
||||
var errors = this.$store.state.requester.errorsform
|
||||
|
||||
if(_.isEmpty(this.selectedItem)){
|
||||
errors.push("requireItem")
|
||||
}
|
||||
if(_.isEmpty(this.xQty)){
|
||||
errors.push("requireQty")
|
||||
}
|
||||
if(_.isEmpty(this.selected_item_unit)){
|
||||
errors.push("requireItemUnit")
|
||||
}
|
||||
|
||||
if (errors.length === 0) {
|
||||
this.$store.commit("requester/updateErrorsform", [])
|
||||
this.$store.dispatch("requester/updateDetail", {
|
||||
IOID: this.selectedMainTable.T_ItemOutID,
|
||||
IODID: this.selectedDetailTable.T_ItemOutDetailID,
|
||||
itemID: this.selectedItem.M_ItemID,
|
||||
itemDescription: this.selectedItem.M_ItemDesc,
|
||||
qty: this.xQty,
|
||||
itemUnitID: this.selected_item_unit.ItemUnitID
|
||||
});
|
||||
}
|
||||
},
|
||||
thr_search_item: _.debounce(function () {
|
||||
this.$store.dispatch("requester/searchItem", {search: this.search_item, warehouseID: this.selectedMainTable.WarehouseID})
|
||||
}, 1000),
|
||||
thr_search_item_unit: _.debounce(function () {
|
||||
this.$store.dispatch("requester/getUnit", {search: this.search_item_unit, itemID: this.selectedItem.M_ItemID})
|
||||
}, 1000),
|
||||
},
|
||||
watch: {
|
||||
// dialogDetail(val, old) {
|
||||
// if (val) {
|
||||
// this.$refs.formDetail.reset();
|
||||
// this.$refs.formDetail.resetValidation();
|
||||
// }
|
||||
// },
|
||||
xQty(val, old) {
|
||||
if (val <= 0) {
|
||||
this.$store.commit("requester/updateXQty", 0);
|
||||
}
|
||||
},
|
||||
xPrice(val, old) {
|
||||
if (val <= 0) {
|
||||
this.$store.commit("requester/updateXPrice", 0);
|
||||
}
|
||||
},
|
||||
xAmountRequest(val, old) {
|
||||
if (val <= 0) {
|
||||
this.$store.commit("requester/updateXAmountRequest", 0);
|
||||
}
|
||||
},
|
||||
xEstimationPrice(val, old) {
|
||||
if (val < 0) {
|
||||
this.$store.commit("requester/updateXEstimationPrice", 0);
|
||||
}
|
||||
},
|
||||
search_item(val, old) {
|
||||
if (val == old) return;
|
||||
if (!val) return;
|
||||
if (val.length < 1) return;
|
||||
if (this.$store.state.requester.loadingAutocomplete == 1) return;
|
||||
this.thr_search_item();
|
||||
},
|
||||
search_item_unit(val, old) {
|
||||
if (val == old) return;
|
||||
if (!val) return;
|
||||
if (val.length < 1) return;
|
||||
if (this.$store.state.requester.loadingAutocomplete == 1) return;
|
||||
this.thr_search_item_unit();
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
917
test/vuex/acc-one-item-out-v3/components/addItemOutDialog.vue
Normal file
917
test/vuex/acc-one-item-out-v3/components/addItemOutDialog.vue
Normal file
@@ -0,0 +1,917 @@
|
||||
<template>
|
||||
<div>
|
||||
<v-layout row justify-center>
|
||||
<v-dialog v-model="dialogRequest" persistent max-width="75%">
|
||||
<v-card>
|
||||
<v-card-title class="headline grey lighten-2" primary-title>
|
||||
FORM PENGELUARAN BARANG
|
||||
</v-card-title>
|
||||
<v-card-text class="pt-2 pb-0">
|
||||
<v-form ref="formRequest" v-model="validationForm" lazy-validtion>
|
||||
<v-layout row>
|
||||
<v-flex xs6 pa-2>
|
||||
<v-menu
|
||||
v-model="menuDateUse"
|
||||
:close-on-content-click="false"
|
||||
transition="scale-transition"
|
||||
:nudge-right="40"
|
||||
lazy
|
||||
offset-y
|
||||
full-width
|
||||
max-width="290px"
|
||||
min-width="290px"
|
||||
>
|
||||
<template v-slot:activator="{ on }">
|
||||
<v-text-field
|
||||
v-model="dateUseFormatted"
|
||||
label="Tanggal Transaksi"
|
||||
readonly
|
||||
v-on="on"
|
||||
@blur="dDateUse = deFormatedDate(dateUseFormatted)"
|
||||
></v-text-field>
|
||||
</template>
|
||||
<v-date-picker
|
||||
no-title
|
||||
v-model="xDateUse"
|
||||
@input="menuDateUse = false"
|
||||
></v-date-picker>
|
||||
</v-menu>
|
||||
</v-flex>
|
||||
<v-flex xs6 pa-2>
|
||||
<v-autocomplete
|
||||
v-model="xWarehouse"
|
||||
label="Gudang"
|
||||
menu-icon="mdi-chevron-down"
|
||||
:items="warehouseOptions"
|
||||
item-text="WarehouseName"
|
||||
item-value="WarehouseID"
|
||||
:rules="warehouseRules"
|
||||
required
|
||||
></v-autocomplete>
|
||||
</v-flex>
|
||||
<v-flex xs6 pa-2>
|
||||
<v-autocomplete
|
||||
v-model="selectedDivision"
|
||||
label="Divisi"
|
||||
menu-icon="mdi-chevron-down"
|
||||
:items="divisionOptions"
|
||||
item-text="DivisionName"
|
||||
item-value="DivisionID"
|
||||
:rules="divisionRules"
|
||||
required
|
||||
></v-autocomplete>
|
||||
</v-flex>
|
||||
<v-flex pa-2 xs6>
|
||||
<v-text-field
|
||||
v-model="xNote"
|
||||
label="Catatan"
|
||||
></v-text-field>
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
</v-form>
|
||||
|
||||
<v-layout row>
|
||||
<v-flex pa-2 pl-0 xs12>
|
||||
<v-btn v-if="dialogItem == false" color="primary" @click="dialogItem = true">Pilih Item</v-btn>
|
||||
<v-btn v-if="dialogItem == true" color="primary" @click="dialogItem = false">Tutup Pilih Item</v-btn>
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
|
||||
<div v-if="dialogItem == true">
|
||||
<v-card class="mt-2">
|
||||
<v-layout row>
|
||||
<v-flex class="mt-2" pa-2 pb-0 xs3>
|
||||
<v-text-field
|
||||
v-model="searchItem"
|
||||
label="Cari..."
|
||||
placeholder="Ketikkan item"
|
||||
style="max-width: 250px"
|
||||
hide-details
|
||||
></v-text-field>
|
||||
</v-flex>
|
||||
<v-flex class="mt-2" pa-2 pb-0 xs2>
|
||||
<v-btn
|
||||
dark
|
||||
color="success"
|
||||
style="min-width: 40px; height: 40px; margin: 0"
|
||||
@click="itemSearch()"
|
||||
>
|
||||
<v-icon>search</v-icon>
|
||||
</v-btn>
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
<v-layout row >
|
||||
<v-flex xs12 pl-2 pr-2 pt-2 pb-2>
|
||||
<v-data-table
|
||||
:headers="headers"
|
||||
:items="items"
|
||||
:loading="loadingItem"
|
||||
hide-actions
|
||||
class="elevation-1"
|
||||
>
|
||||
<template slot="items" slot-scope="props">
|
||||
<td
|
||||
class="text-xs-left pa-2"
|
||||
v-bind:class="{ 'amber lighten-4': isSelected(props.item) }"
|
||||
@click="selectMe(props.item)"
|
||||
>
|
||||
<div
|
||||
style="
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
"
|
||||
>
|
||||
{{ props.item.rioNumber }}
|
||||
</div>
|
||||
</td>
|
||||
<td
|
||||
class="text-xs-left pa-2"
|
||||
v-bind:class="{ 'amber lighten-4': isSelected(props.item) }"
|
||||
@click="selectMe(props.item)"
|
||||
>
|
||||
<div
|
||||
style="
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
"
|
||||
>
|
||||
{{ props.item.itemCode }}
|
||||
<v-chip small style="border-radius: 5px; flex-grow: 0">
|
||||
{{ props.item.itemDesc }}
|
||||
</v-chip>
|
||||
</div>
|
||||
</td>
|
||||
<td
|
||||
class="text-xs-center pa-2"
|
||||
v-bind:class="{ 'amber lighten-4': isSelected(props.item) }"
|
||||
@click="selectMe(props.item)"
|
||||
>
|
||||
{{ props.item.unitName }}
|
||||
</td>
|
||||
<td
|
||||
class="text-xs-center pa-2"
|
||||
v-bind:class="{ 'amber lighten-4': isSelected(props.item) }"
|
||||
@click="selectMe(props.item)"
|
||||
>
|
||||
{{ props.item.StockQty }}
|
||||
</td>
|
||||
<td
|
||||
class="text-xs-center pa-2"
|
||||
v-bind:class="{ 'amber lighten-4': isSelected(props.item) }"
|
||||
@click="selectMe(props.item)"
|
||||
>
|
||||
{{ props.item.rioDQty }}
|
||||
</td>
|
||||
<td
|
||||
class="text-xs-center pa-2"
|
||||
v-bind:class="{ 'amber lighten-4': isSelected(props.item) }"
|
||||
@click="selectMe(props.item)"
|
||||
>
|
||||
<v-btn v-if="checkSelected(props.item) == false"style="min-width: 35px; height: 35px; margin: 0" small color="success" @click="addItem(props.item)"><v-icon small>check</v-icon></v-btn>
|
||||
</td>
|
||||
</template>
|
||||
</v-data-table>
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
<v-divider></v-divider>
|
||||
<v-layout row>
|
||||
<v-flex xs6>
|
||||
<v-pagination
|
||||
style="margin-top: 10px; margin-bottom: 10px"
|
||||
v-model="itemCurrentPage"
|
||||
:length="itemTotalPage"
|
||||
:total-visible="7"
|
||||
></v-pagination>
|
||||
</v-flex>
|
||||
<v-flex class="pt-2 text-xs-right" xs6>
|
||||
<v-btn color="primary" @click="dialogItem = false">Tutup Pilih Item</v-btn>
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
|
||||
</v-card>
|
||||
</div>
|
||||
<v-divider></v-divider>
|
||||
|
||||
<v-card elevation="0" flat class=" 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="headersItems"
|
||||
:items="selectedItems"
|
||||
hide-actions
|
||||
class="elevation-1"
|
||||
>
|
||||
<template slot="items" slot-scope="props">
|
||||
<td
|
||||
class="text-xs-left pa-2"
|
||||
v-bind:class="{ 'amber lighten-4': isSelected(props.item) }"
|
||||
@click="selectMe(props.item)"
|
||||
>
|
||||
<div
|
||||
style="
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
"
|
||||
>
|
||||
{{ props.item.rioNumber }}
|
||||
<!-- <span v-if="props.item.ioDetailConfirm == 'Y'">
|
||||
<v-tooltip bottom>
|
||||
<template v-slot:activator="{ on, attrs }">
|
||||
<v-icon v-bind="attrs" v-on="on" class="ml-1" color="blue" small>check_circle</v-icon>
|
||||
</template>
|
||||
<span>Sudah di konfirmasi</span>
|
||||
</v-tooltip>
|
||||
</span> -->
|
||||
</div>
|
||||
</td>
|
||||
<td
|
||||
class="text-xs-left pa-2"
|
||||
v-bind:class="{ 'amber lighten-4': isSelected(props.item) }"
|
||||
@click="selectMe(props.item)"
|
||||
>
|
||||
<div
|
||||
style="
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
"
|
||||
>
|
||||
{{ props.item.itemCode }}
|
||||
<v-chip small style="border-radius: 5px; flex-grow: 0">
|
||||
{{ props.item.itemDesc }}
|
||||
</v-chip>
|
||||
</div>
|
||||
</td>
|
||||
<td
|
||||
class="text-xs-center pa-2"
|
||||
v-bind:class="{ 'amber lighten-4': isSelected(props.item) }"
|
||||
@click="selectMe(props.item)"
|
||||
>
|
||||
<p v-for="obj in props.item.ItemRequest" class="body-1 mb-0">
|
||||
Batch: {{ obj.StockBatchNo }}, Jumlah: {{ obj.QtyReq }}, {{ obj.WarehouseName }}
|
||||
</p>
|
||||
</td>
|
||||
<td
|
||||
class="text-xs-center pa-2"
|
||||
v-bind:class="{ 'amber lighten-4': isSelected(props.item) }"
|
||||
@click="selectMe(props.item)"
|
||||
>
|
||||
{{ props.item.StockQty }}
|
||||
</td>
|
||||
<td
|
||||
class="text-xs-center pa-2"
|
||||
v-bind:class="{ 'amber lighten-4': isSelected(props.item) }"
|
||||
@click="selectMe(props.item)"
|
||||
>
|
||||
{{ props.item.rioDQty }}
|
||||
</td>
|
||||
<td
|
||||
class="text-xs-center pa-2"
|
||||
v-bind:class="{ 'amber lighten-4': isSelected(props.item) }"
|
||||
@click="selectMe(props.item)"
|
||||
@blur="validateReceiveQty(props.item)"
|
||||
>
|
||||
{{ getRemaining(props.item) }} / {{ props.item.rioDReceiveQty }} {{ props.item.unitName }}
|
||||
<p v-show="emptycheck.includes(props.item.rioDID)" style="color: red;" class="ma-0 pa-0">Jumlah melebihi request qty</p>
|
||||
<p v-show="emptycheckvalue.includes(props.item.rioDID)" style="color: red;" class="ma-0 pa-0">Jumlah item harus diisi</p>
|
||||
</td>
|
||||
<!-- <td
|
||||
class="text-xs-center pa-2"
|
||||
v-bind:class="{ 'amber lighten-4': isSelected(props.item) }"
|
||||
@click="selectMe(props.item)"
|
||||
>
|
||||
<v-text-field
|
||||
v-model=""
|
||||
type="number"
|
||||
@input="validateReceiveQty(props.item)"
|
||||
></v-text-field>
|
||||
<p v-show="emptycheck.includes(props.item.rioDID)" style="color: red;" class="ma-0 pa-0">Jumlah melebihi request qty</p>
|
||||
<p v-show="emptycheckvalue.includes(props.item.rioDID)" style="color: red;" class="ma-0 pa-0">Jumlah harus diisi</p>
|
||||
</td> -->
|
||||
<td
|
||||
class="text-xs-center pa-2"
|
||||
v-bind:class="{ 'amber lighten-4': isSelected(props.item) }"
|
||||
@click="selectMe(props.item)"
|
||||
>
|
||||
<v-btn
|
||||
style="min-width: 35px; height: 35px; margin: 0;"
|
||||
small
|
||||
color="orange" title="Pilih Batch Item"
|
||||
@click="updateBatchNo(props.item)"
|
||||
>
|
||||
<v-icon small color="white">edit</v-icon>
|
||||
</v-btn>
|
||||
<v-btn style="min-width: 35px; height: 35px; margin: 0" small color="error" dark @click="deleteItem(props.item)"><v-icon small>close</v-icon></v-btn>
|
||||
|
||||
</td>
|
||||
</template>
|
||||
</v-data-table>
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
</v-card>
|
||||
|
||||
</v-card-text>
|
||||
<v-card-actions>
|
||||
<v-btn
|
||||
v-if="act === 'edit'"
|
||||
color="blue"
|
||||
:disabled="loadingSave"
|
||||
dark
|
||||
@click="saveConfirm()"
|
||||
>Konfirmasi</v-btn
|
||||
>
|
||||
<v-spacer></v-spacer>
|
||||
<v-btn color="error" flat @click="closeDialogRequest()">
|
||||
Tutup
|
||||
</v-btn>
|
||||
<v-btn
|
||||
v-if="act === 'new'"
|
||||
color="primary"
|
||||
:disabled="loadingSave"
|
||||
dark
|
||||
@click="saveRequest()"
|
||||
>Simpan</v-btn
|
||||
>
|
||||
<v-btn
|
||||
v-if="act === 'edit'"
|
||||
color="primary"
|
||||
:disabled="loadingSave"
|
||||
dark
|
||||
@click="updateRequest()"
|
||||
>Simpan Perubahan</v-btn
|
||||
>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
</v-layout>
|
||||
<one-dialog-batch></one-dialog-batch>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
module.exports = {
|
||||
name: "AddPurchaseRequestDialog",
|
||||
components: {
|
||||
"one-dialog-batch": httpVueLoader("./dialogBatch.vue")
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
warehouseRules: [(v) => !!v || "Gudang harus diisi"],
|
||||
divisionRules: [(v) => !!v || "Division harus diisi"],
|
||||
validationForm: false,
|
||||
headers: [
|
||||
{
|
||||
text: "NO. RIO",
|
||||
align: "center",
|
||||
sortable: false,
|
||||
value: "itemName",
|
||||
width: "20%",
|
||||
class: "success lighten-3 white--text",
|
||||
},
|
||||
{
|
||||
text: "ITEM",
|
||||
align: "center",
|
||||
sortable: false,
|
||||
value: "itemName",
|
||||
width: "35%",
|
||||
class: "success lighten-3 white--text",
|
||||
},
|
||||
{
|
||||
text: "SATUAN",
|
||||
align: "center",
|
||||
sortable: false,
|
||||
value: "unitName",
|
||||
width: "20%",
|
||||
class: "success lighten-3 white--text",
|
||||
},
|
||||
{
|
||||
text: "STOCK",
|
||||
align: "center",
|
||||
sortable: false,
|
||||
value: "itemName",
|
||||
width: "10%",
|
||||
class: "success lighten-3 white--text",
|
||||
},
|
||||
{
|
||||
text: "REQUEST QTY",
|
||||
align: "center",
|
||||
sortable: false,
|
||||
value: "itemName",
|
||||
width: "15%",
|
||||
class: "success lighten-3 white--text",
|
||||
},
|
||||
{
|
||||
text: "AKSI",
|
||||
align: "center",
|
||||
sortable: false,
|
||||
value: "action",
|
||||
width: "10%",
|
||||
class: "success lighten-3 white--text",
|
||||
},
|
||||
],
|
||||
headersItems: [
|
||||
{
|
||||
text: "NO. RIO",
|
||||
align: "center",
|
||||
sortable: false,
|
||||
value: "action",
|
||||
width: "10%",
|
||||
class: "pa-2 pl-2 blue lighten-3 white--text",
|
||||
},
|
||||
{
|
||||
text: "ITEM",
|
||||
align: "center",
|
||||
sortable: false,
|
||||
value: "action",
|
||||
width: "20%",
|
||||
class: "pa-2 pl-2 blue lighten-3 white--text",
|
||||
},
|
||||
{
|
||||
text: "ITEM GUDANG",
|
||||
align: "center",
|
||||
sortable: false,
|
||||
value: "action",
|
||||
width: "20%",
|
||||
class: "pa-2 pl-2 blue lighten-3 white--text",
|
||||
},
|
||||
{
|
||||
text: "STOCK",
|
||||
align: "center",
|
||||
sortable: false,
|
||||
value: "action",
|
||||
width: "10%",
|
||||
class: "pa-2 pl-2 blue lighten-3 white--text",
|
||||
},
|
||||
{
|
||||
text: "REQ QTY",
|
||||
align: "center",
|
||||
sortable: false,
|
||||
value: "action",
|
||||
width: "10%",
|
||||
class: "pa-2 pl-2 blue lighten-3 white--text",
|
||||
},
|
||||
{
|
||||
text: "JUMLAH (SISA REQUEST/ITEM OUT)",
|
||||
align: "center",
|
||||
sortable: false,
|
||||
value: "action",
|
||||
width: "20%",
|
||||
class: "pa-2 pl-2 blue lighten-3 white--text",
|
||||
},
|
||||
{
|
||||
text: "AKSI",
|
||||
align: "center",
|
||||
sortable: false,
|
||||
value: "action",
|
||||
width: "10%",
|
||||
class: "pa-2 pl-2 blue lighten-3 white--text",
|
||||
}
|
||||
]
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
|
||||
},
|
||||
computed: {
|
||||
user() {
|
||||
return this.$store.state.requester.user;
|
||||
},
|
||||
dialogRequest: {
|
||||
get() {
|
||||
return this.$store.state.requester.dialogRequest;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateDialogRequest", val);
|
||||
},
|
||||
},
|
||||
menuDateUse: {
|
||||
get() {
|
||||
return this.$store.state.requester.menuDateUse;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateMenuDateUse", val);
|
||||
},
|
||||
},
|
||||
dateUseFormatted() {
|
||||
return this.formatDate(this.xDateUse);
|
||||
},
|
||||
dDateUse: {
|
||||
get() {
|
||||
return this.$store.state.requester.dDateUse;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateDDateUse", val);
|
||||
},
|
||||
},
|
||||
xDateUse: {
|
||||
get() {
|
||||
return this.$store.state.requester.xDateUse;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateXDateUse", val);
|
||||
},
|
||||
},
|
||||
xNote: {
|
||||
get() {
|
||||
return this.$store.state.requester.xNote;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateXNote", val);
|
||||
},
|
||||
},
|
||||
xWarehouse: {
|
||||
get() {
|
||||
return this.$store.state.requester.xWarehouse;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateXWarehouse", val);
|
||||
this.$store.dispatch("requester/getItemRequest", {
|
||||
search: this.searchItem,
|
||||
warehouseID: this.xWarehouse.WarehouseID ? this.xWarehouse.WarehouseID : this.xWarehouse,
|
||||
divisionID: this.selectedDivision.DivisionID ? this.selectedDivision.DivisionID : this.selectedDivision
|
||||
});
|
||||
},
|
||||
},
|
||||
xDepartment: {
|
||||
get() {
|
||||
return this.$store.state.requester.xDepartment;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateXDepartment", val);
|
||||
},
|
||||
},
|
||||
warehouseOptions() {
|
||||
return this.$store.state.requester.warehouseOptions;
|
||||
},
|
||||
departmentOptions() {
|
||||
return this.$store.state.requester.departmentOptions;
|
||||
},
|
||||
regionalOptions() {
|
||||
return this.$store.state.requester.regionalOptions;
|
||||
},
|
||||
branchOptions() {
|
||||
return this.$store.state.requester.branchOptions;
|
||||
},
|
||||
xTotalPrice: {
|
||||
get() {
|
||||
return this.$store.state.requester.xTotalPrice;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateXTotalPrice", val);
|
||||
},
|
||||
},
|
||||
xIOID() {
|
||||
return this.$store.state.requester.xIOID;
|
||||
},
|
||||
act() {
|
||||
return this.$store.state.requester.act;
|
||||
},
|
||||
divisionOptions() {
|
||||
return this.$store.state.requester.divisionOptions;
|
||||
},
|
||||
selectedDivision: {
|
||||
get() {
|
||||
return this.$store.state.requester.selectedDivision;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateSelectedDivision", val);
|
||||
this.$store.dispatch("requester/getItemRequest", {
|
||||
search: this.searchItem,
|
||||
warehouseID: this.xWarehouse.WarehouseID ? this.xWarehouse.WarehouseID : this.xWarehouse,
|
||||
divisionID: this.selectedDivision.DivisionID ? this.selectedDivision.DivisionID : this.selectedDivision
|
||||
});
|
||||
},
|
||||
},
|
||||
dialogItem: {
|
||||
get() {
|
||||
return this.$store.state.requester.dialogItem;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateDialogItem", val);
|
||||
},
|
||||
},
|
||||
searchItem: {
|
||||
get() {
|
||||
return this.$store.state.requester.searchItem;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateSearchItem", val);
|
||||
},
|
||||
},
|
||||
loadingItem: {
|
||||
get() {
|
||||
return this.$store.state.requester.loadingItem;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateLoadingItem", val);
|
||||
},
|
||||
},
|
||||
items() {
|
||||
return this.$store.state.requester.items
|
||||
},
|
||||
itemTotalPage: {
|
||||
get() {
|
||||
return this.$store.state.requester.itemTotalPage;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateItemTotalPage", val);
|
||||
},
|
||||
},
|
||||
itemCurrentPage: {
|
||||
get() {
|
||||
return this.$store.state.requester.itemCurrentPage;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateItemCurrentPage", val);
|
||||
this.$store.dispatch("requester/getItemRequest", {
|
||||
search: this.searchItem,
|
||||
warehouseID: this.xWarehouse.WarehouseID ? this.xWarehouse.WarehouseID : "",
|
||||
divisionID: this.selectedDivision.DivisionID ? this.selectedDivision.DivisionID : ""
|
||||
});
|
||||
},
|
||||
},
|
||||
selectedItems: {
|
||||
get() {
|
||||
return this.$store.state.requester.selectedItems;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateSelectedItems", val);
|
||||
}
|
||||
},
|
||||
loadingSave: {
|
||||
get() {
|
||||
return this.$store.state.requester.loadingSave;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateLoadingSave", val);
|
||||
}
|
||||
},
|
||||
emptycheck: {
|
||||
get() {
|
||||
return this.$store.state.requester.emptycheck;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateEmptycheck", val);
|
||||
}
|
||||
},
|
||||
emptycheckvalue: {
|
||||
get() {
|
||||
return this.$store.state.requester.emptycheckvalue;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateEmptycheckvalue", val);
|
||||
}
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
isSelected(p) {
|
||||
return (
|
||||
p.rioDID ==
|
||||
this.$store.state.requester.selectedItem
|
||||
.rioDID
|
||||
);
|
||||
},
|
||||
selectMe(sc) {
|
||||
this.$store.commit("requester/updateSelectedItem", sc);
|
||||
},
|
||||
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")}`;
|
||||
},
|
||||
closeDialogRequest() {
|
||||
this.$store.commit("requester/updateEmptycheck", []);
|
||||
this.$store.commit("requester/updateEmptycheckvalue", []);
|
||||
this.$store.commit(
|
||||
"requester/updateXDateUse",
|
||||
moment(new Date()).format("YYYY-MM-DD")
|
||||
);
|
||||
this.$store.commit("requester/updateXWarehouse", "");
|
||||
this.$store.commit("requester/updateXDepartment", "");
|
||||
this.$refs.formRequest.resetValidation();
|
||||
this.$store.commit("requester/updateDialogRequest", false);
|
||||
this.$store.commit("requester/updateTempBatchNumber", {
|
||||
records: [],
|
||||
total: 0
|
||||
});
|
||||
},
|
||||
saveRequest() {
|
||||
let empty = [];
|
||||
let emptycheckvalue = [];
|
||||
let tempSelectedItems = this.selectedItems;
|
||||
|
||||
if (tempSelectedItems.length == 0) {
|
||||
this.$store.commit("requester/updateErrMessage", `[Error] data item belum dipilih`);
|
||||
this.$store.commit("requester/updateAlertError", true);
|
||||
return;
|
||||
}
|
||||
|
||||
tempSelectedItems.forEach(e => {
|
||||
let totalRequestQty = parseInt(e.rioDQty) || 0;
|
||||
// let alreadyReceivedQty = parseInt(e.rioDReceiveQtyBeforeEdit) || 0;
|
||||
let currentInputQty = parseInt(e.rioDReceiveQty) || 0;
|
||||
|
||||
// let remainingQty = totalRequestQty - alreadyReceivedQty; // sisa yg boleh diinput
|
||||
|
||||
// Kalau input user lebih besar dari sisa yang seharusnya
|
||||
if (currentInputQty > totalRequestQty) {
|
||||
empty.push(e.rioDID);
|
||||
return;
|
||||
}
|
||||
|
||||
// Kalau input user kosong atau 0
|
||||
if (currentInputQty <= 0) {
|
||||
emptycheckvalue.push(e.rioDID);
|
||||
return;
|
||||
}
|
||||
});
|
||||
|
||||
if (empty.length === 0 && emptycheckvalue.length === 0) {
|
||||
this.emptycheck = empty;
|
||||
this.emptycheckvalue = emptycheckvalue;
|
||||
this.$store.commit("requester/updateLoadingSave", true);
|
||||
|
||||
let prm = {
|
||||
date: this.xDateUse,
|
||||
note: this.xNote,
|
||||
warehouseID: this.xWarehouse.WarehouseID ? this.xWarehouse.WarehouseID : this.xWarehouse,
|
||||
divisionID: this.selectedDivision.DivisionID ? this.selectedDivision.DivisionID : this.selectedDivision,
|
||||
items: this.selectedItems
|
||||
};
|
||||
|
||||
// console.log('prm', prm)
|
||||
this.$store.dispatch("requester/saveRequest", prm);
|
||||
} else {
|
||||
this.emptycheck = empty;
|
||||
this.emptycheckvalue = emptycheckvalue;
|
||||
}
|
||||
},
|
||||
updateRequest() {
|
||||
let empty = [];
|
||||
let emptycheckvalue = [];
|
||||
let tempSelectedItems = this.selectedItems;
|
||||
|
||||
if (tempSelectedItems.length == 0) {
|
||||
this.$store.commit("requester/updateErrMessage", `[Error] data item belum dipilih`);
|
||||
this.$store.commit("requester/updateAlertError", true);
|
||||
return;
|
||||
}
|
||||
|
||||
// Mengecek jika jumlah yang diterima tidak melebihi jumlah yang diminta dan jika jumlah yang diterima adalah 0
|
||||
tempSelectedItems.forEach(e => {
|
||||
let qty = parseInt(e.rioDQty); // Jumlah yang diminta
|
||||
let qtyReceive = parseInt(e.rioDReceiveQty); // Jumlah yang diterima
|
||||
|
||||
if (qtyReceive > qty) {
|
||||
empty.push(e.rioDID); // Menandai item jika qtyReceive melebihi qty yang diminta
|
||||
return;
|
||||
}
|
||||
if (qtyReceive === 0) {
|
||||
emptycheckvalue.push(e.rioDID); // Menandai item jika qtyReceive adalah 0
|
||||
return;
|
||||
}
|
||||
});
|
||||
|
||||
// Jika tidak ada item yang memiliki masalah pada qtyReceive
|
||||
if (empty.length === 0 && emptycheckvalue.length === 0) {
|
||||
this.emptycheck = empty; // Menyimpan item yang qtyReceive-nya melebihi qty
|
||||
this.emptycheckvalue = emptycheckvalue; // Menyimpan item yang qtyReceive-nya 0
|
||||
|
||||
this.$store.commit("requester/updateLoadingSave", true);
|
||||
let prm = {
|
||||
date: this.xDateUse,
|
||||
note: this.xNote,
|
||||
warehouseID: this.xWarehouse.WarehouseID ? this.xWarehouse.WarehouseID : this.xWarehouse,
|
||||
divisionID: this.selectedDivision.DivisionID ? this.selectedDivision.DivisionID : this.selectedDivision,
|
||||
IOID: this.xIOID,
|
||||
items: this.selectedItems
|
||||
};
|
||||
|
||||
// console.log(prm);
|
||||
this.$store.dispatch("requester/updateRequest", prm);
|
||||
} else {
|
||||
this.emptycheck = empty;
|
||||
this.emptycheckvalue = emptycheckvalue;
|
||||
}
|
||||
},
|
||||
saveConfirm() {
|
||||
this.$store.commit("requester/updateLoadingSave", true);
|
||||
let prm = {
|
||||
ioID: this.xIOID,
|
||||
}
|
||||
this.$store.dispatch("requester/confirmIO", prm);
|
||||
},
|
||||
itemSearch() {
|
||||
this.$store.dispatch("requester/getItemRequest", {
|
||||
search: this.searchItem,
|
||||
warehouseID: this.xWarehouse.WarehouseID ? this.xWarehouse.WarehouseID : "",
|
||||
divisionID: this.selectedDivision
|
||||
});
|
||||
},
|
||||
checkSelected(item) {
|
||||
let selectedItems = this.selectedItems;
|
||||
let rtn = false
|
||||
if(selectedItems.length == 0) {
|
||||
// console.log(item.rioDID,"selectedItems.length == 0");
|
||||
rtn = false;
|
||||
}
|
||||
selectedItems.forEach(itemloop => {
|
||||
if(itemloop.rioDID == item.rioDID) {
|
||||
// console.log(item.rioDID,"itemloop.rioDID == item.rioDID");
|
||||
rtn = true;
|
||||
}
|
||||
});
|
||||
// console.log(item.rioDID,"return false");
|
||||
return rtn;
|
||||
},
|
||||
addItem(item) {
|
||||
let selectedItems = this.selectedItems;
|
||||
let index = selectedItems.findIndex(itemloop => itemloop.rioDID == item.rioDID);
|
||||
if(index == -1) {
|
||||
item.rioDReceiveQtyBeforeEdit = parseInt(item.rioDReceiveQty) || 0;
|
||||
selectedItems.push(item);
|
||||
}
|
||||
|
||||
this.$store.commit("requester/updateSelectedItems", selectedItems);
|
||||
},
|
||||
deleteItem(item) {
|
||||
let selectedItems = this.selectedItems;
|
||||
let index = selectedItems.findIndex(itemloop => itemloop.rioDID == item.rioDID);
|
||||
if (index != -1) {
|
||||
selectedItems.splice(index, 1);
|
||||
}
|
||||
|
||||
// Reset receiveQty ke nilai awal sebelum edit
|
||||
// item.rioDReceiveQty = item.rioDReceiveQtyBeforeEdit || 0;
|
||||
|
||||
// Bersihkan warning
|
||||
this.emptycheck = this.emptycheck.filter(id => id !== item.rioDID);
|
||||
this.emptycheckvalue = this.emptycheckvalue.filter(id => id !== item.rioDID);
|
||||
|
||||
// Commit perubahan
|
||||
this.$store.commit("requester/updateSelectedItems", selectedItems);
|
||||
},
|
||||
validateReceiveQtyolds(item) {
|
||||
let totalRequestQty = parseInt(item.rioDQty) || 0;
|
||||
let alreadyReceivedQty = parseInt(item.rioDReceiveQtyBeforeEdit) || 0;
|
||||
let inputReceiveQty = parseInt(item.rioDReceiveQty) || 0;
|
||||
|
||||
// Hitung jumlah kumulatif
|
||||
// let cumulativeReceiveQty = alreadyReceivedQty + inputReceiveQty;
|
||||
|
||||
if (inputReceiveQty > totalRequestQty) {
|
||||
// let allowedQty = totalRequestQty - alreadyReceivedQty; // Sisa yang boleh diterima
|
||||
// item.rioDReceiveQty = allowedQty; // Set input sesuai maksimal sisa
|
||||
if (!this.emptycheck.includes(item.rioDID)) {
|
||||
this.emptycheck.push(item.rioDID);
|
||||
}
|
||||
} else {
|
||||
this.emptycheck = this.emptycheck.filter(id => id !== item.rioDID);
|
||||
}
|
||||
|
||||
// Kalau kosong atau 0, kasih warning juga
|
||||
if (inputReceiveQty <= 0) {
|
||||
if (!this.emptycheckvalue.includes(item.rioDID)) {
|
||||
this.emptycheckvalue.push(item.rioDID);
|
||||
}
|
||||
} else {
|
||||
this.emptycheckvalue = this.emptycheckvalue.filter(id => id !== item.rioDID);
|
||||
}
|
||||
},
|
||||
getRemaining(item) {
|
||||
const totalRequestQty = parseInt(item.rioDQty) || 0;
|
||||
const alreadyReceivedQty = parseInt(item.rioDReceiveQtyBeforeEdit) || 0;
|
||||
const currentInputQty = parseInt(item.rioDReceiveQty) || 0;
|
||||
|
||||
return totalRequestQty - currentInputQty;
|
||||
},
|
||||
updateBatchNo(val) {
|
||||
let params = {
|
||||
itemid: val.rioDItemID,
|
||||
unitid: val.rioDItemUnitID,
|
||||
batchno: ""
|
||||
}
|
||||
this.$store.commit("requester/update_dialog_batchitem", true);
|
||||
this.$store.commit("requester/update_buffer_detailitem", val);
|
||||
this.$store.dispatch("requester/getBatchItemDetail", params);
|
||||
|
||||
if (val.ItemRequest.length > 0) {
|
||||
this.$store.commit("requester/update_form_batchitem", val.ItemRequest)
|
||||
}
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
|
||||
}
|
||||
};
|
||||
</script>
|
||||
307
test/vuex/acc-one-item-out-v3/components/dialogBatch.vue
Normal file
307
test/vuex/acc-one-item-out-v3/components/dialogBatch.vue
Normal file
@@ -0,0 +1,307 @@
|
||||
<template>
|
||||
<div>
|
||||
<v-dialog v-model="dialog_batchitem" persistent width="30vw">
|
||||
<v-card>
|
||||
<v-card-title class="headline grey lighten-2" primary-title>
|
||||
Pengeluaran Item
|
||||
</v-card-title>
|
||||
|
||||
<v-card-text>
|
||||
<v-layout row wrap>
|
||||
<v-flex xs12 class="mb-2">
|
||||
<v-autocomplete
|
||||
v-model="form_batchitem" multiple label="Pilih Batch Item" item-text="StockBatchNo"
|
||||
chips outline return-object :items="list_batchitemform.records" hide-details
|
||||
>
|
||||
<template v-slot:selection="data">
|
||||
<v-chip
|
||||
:selected="data.selected"
|
||||
close class="chip--select-multi"
|
||||
@input="removeChips(data.item)"
|
||||
>
|
||||
{{ data.item.StockBatchNo }}
|
||||
</v-chip>
|
||||
</template>
|
||||
<template v-slot:item="data">
|
||||
<v-list-tile-content>
|
||||
<v-list-tile-title>
|
||||
Batch {{ data.item.StockBatchNo }}
|
||||
</v-list-tile-title>
|
||||
<v-list-tile-sub-title>
|
||||
Expired: {{ data.item.StockED }}
|
||||
</v-list-tile-sub-title>
|
||||
</v-list-tile-content>
|
||||
</template>
|
||||
</v-autocomplete>
|
||||
</v-flex>
|
||||
<v-flex xs12 v-for="(item, index) in form_batchitem" :key="item.StockStockNumber" class="mt-2">
|
||||
<v-layout row wrap>
|
||||
<v-flex xs6 class="pr-2">
|
||||
<p class="body-2 mb-0">Nomor batch: {{ item.StockBatchNo }}</p>
|
||||
<p class="body-2 mb-0">Expired: {{ item.StockED }}</p>
|
||||
<p class="body-2 mb-0">{{ item.WarehouseName }}</p>
|
||||
</v-flex>
|
||||
<v-flex xs3 class="pr-1">
|
||||
<p class="body-2 mb-0">Stock:</p>
|
||||
<p class="body-2 mb-0">{{ item.StockQty }} {{ item.ItemUnitName }}</p>
|
||||
</v-flex>
|
||||
<v-flex xs3 class="pl-1">
|
||||
<p class="text-xs-center">Isi Qty: </p>
|
||||
<v-text-field
|
||||
single-line
|
||||
type="number" min="0" step="1"
|
||||
label="Jumlah" v-model="item.QtyReq"
|
||||
outline hide-details
|
||||
></v-text-field>
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
<v-divider v-if="index + 1 < form_batchitem.length" :key="`divider-${index}`" class="mt-2"></v-divider>
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
</v-card-text>
|
||||
|
||||
<v-card-actions>
|
||||
<v-spacer></v-spacer>
|
||||
<v-btn color="error" @click="batalItem()">BATAL</v-btn>
|
||||
<v-btn color="primary" @click="simpanItem()">SIMPAN</v-btn>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
module.exports = {
|
||||
components: {},
|
||||
mounted() {},
|
||||
data() {
|
||||
return {
|
||||
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
dialog_batchitem: {
|
||||
get() {
|
||||
return this.$store.state.requester.dialog_batchitem
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/update_dialog_batchitem", val)
|
||||
}
|
||||
},
|
||||
buffer_detailitem: {
|
||||
get() {
|
||||
return this.$store.state.requester.buffer_detailitem
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/update_buffer_detailitem", val)
|
||||
}
|
||||
},
|
||||
list_batchitemform: {
|
||||
get() {
|
||||
return this.$store.state.requester.list_batchitemform
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/update_list_batchitemform", val)
|
||||
}
|
||||
},
|
||||
form_batchitem: {
|
||||
get() {
|
||||
return this.$store.state.requester.form_batchitem
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/update_form_batchitem", val)
|
||||
}
|
||||
},
|
||||
selectedItems: {
|
||||
get() {
|
||||
return this.$store.state.requester.selectedItems;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateSelectedItems", val);
|
||||
}
|
||||
},
|
||||
emptycheck: {
|
||||
get() {
|
||||
return this.$store.state.requester.emptycheck;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateEmptycheck", val);
|
||||
}
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
batalItem() {
|
||||
this.buffer_detailitem = {}
|
||||
this.list_batchitemform = {}
|
||||
this.form_batchitem = []
|
||||
this.dialog_batchitem = false
|
||||
},
|
||||
simpanItem_old() {
|
||||
let current_detail = this.selectedItems
|
||||
let current_item = this.buffer_detailitem
|
||||
let new_batchitem = this.form_batchitem
|
||||
|
||||
let qty = 0
|
||||
let isError = false
|
||||
new_batchitem.forEach(element => {
|
||||
let req = Number(element.QtyReq)
|
||||
let stock = Number(element.StockQty)
|
||||
if (!req || req <= 0 || req > stock) {
|
||||
isError = true
|
||||
this.$store.commit("requester/updateErrMessage", `[Error] jumlah tidak boleh <0 atau melebihi stock (${stock})`);
|
||||
this.$store.commit("requester/updateAlertError", true);
|
||||
return
|
||||
}
|
||||
|
||||
qty = qty + req
|
||||
});
|
||||
if (isError) {
|
||||
return
|
||||
}
|
||||
|
||||
current_detail.forEach(element => {
|
||||
if (element.rioDID == current_item.rioDID) {
|
||||
element.ItemRequest = new_batchitem
|
||||
element.QtyFilled = qty
|
||||
element.rioDReceiveQty = qty
|
||||
}
|
||||
});
|
||||
|
||||
this.selectedItems = current_detail
|
||||
this.form_batchitem = []
|
||||
this.list_batchitemform = {}
|
||||
this.buffer_detailitem = {}
|
||||
this.dialog_batchitem = false
|
||||
|
||||
// validasi qty receive jika melebihi qty request
|
||||
this.validateReceiveQty(current_item)
|
||||
},
|
||||
simpanItem(){
|
||||
let current_detail = this.selectedItems
|
||||
let current_item = this.buffer_detailitem
|
||||
let new_batchitem = this.form_batchitem
|
||||
|
||||
// console.log('before current_detail', current_detail)
|
||||
// console.log('current_item', current_item)
|
||||
// console.log('new_batchitem', new_batchitem)
|
||||
|
||||
let qty = 0
|
||||
let isError = false
|
||||
|
||||
// Validasi terlebih dahulu
|
||||
new_batchitem.forEach(element => {
|
||||
let req = Number(element.QtyReq)
|
||||
let stock = Number(element.StockQty)
|
||||
if (!req || req <= 0 || req > stock) {
|
||||
isError = true
|
||||
this.$store.commit("requester/updateErrMessage", `[Error] jumlah tidak boleh <0 atau melebihi stock (${stock})`);
|
||||
this.$store.commit("requester/updateAlertError", true);
|
||||
return
|
||||
}
|
||||
qty = qty + req
|
||||
});
|
||||
|
||||
if (isError) {
|
||||
return
|
||||
}
|
||||
|
||||
// Update StockQty di list_batchitemform berdasarkan BatchNo
|
||||
if (this.list_batchitemform && this.list_batchitemform.records) {
|
||||
|
||||
let updatedBatchRecords = [...this.list_batchitemform.records];
|
||||
|
||||
new_batchitem.forEach(batchItem => {
|
||||
// Cari record yang sesuai berdasarkan StockID atau BatchNo
|
||||
let recordIndex = updatedBatchRecords.findIndex(record =>
|
||||
record.StockBatchNo === batchItem.StockBatchNo &&
|
||||
record.StockItemID === batchItem.StockItemID &&
|
||||
record.StockItemUnitID === batchItem.StockItemUnitID
|
||||
);
|
||||
|
||||
if (recordIndex !== -1) {
|
||||
// Kurangi StockQty dengan QtyReq
|
||||
let currentStock = Number(updatedBatchRecords[recordIndex].StockQty);
|
||||
let qtyReq = Number(batchItem.QtyReq);
|
||||
let newStock = currentStock - qtyReq;
|
||||
|
||||
// Update StockQty
|
||||
updatedBatchRecords[recordIndex].StockQty = String(newStock);
|
||||
|
||||
// Atau hapus record jika StockQty menjadi 0
|
||||
// if (newStock <= 0) {
|
||||
// updatedBatchRecords.splice(recordIndex, 1);
|
||||
// updatedBatchRecords.total = updatedBatchRecords.length;
|
||||
// }
|
||||
}
|
||||
});
|
||||
|
||||
let tempBatch = {
|
||||
records: updatedBatchRecords,
|
||||
total: updatedBatchRecords.length
|
||||
};
|
||||
|
||||
this.$store.commit("requester/updateTempBatchNumber", tempBatch)
|
||||
}
|
||||
|
||||
|
||||
// Update current_detail dengan ItemRequest baru
|
||||
current_detail.forEach(element => {
|
||||
if (element.rioDID == current_item.rioDID) {
|
||||
// Jika sudah ada ItemRequest sebelumnya, gabungkan dengan yang baru
|
||||
if (element.ItemRequest && element.ItemRequest.length > 0) {
|
||||
// Merge atau update ItemRequest yang sudah ada
|
||||
new_batchitem.forEach(newItem => {
|
||||
let existingIndex = element.ItemRequest.findIndex(existing =>
|
||||
existing.StockBatchNo === newItem.StockBatchNo
|
||||
);
|
||||
|
||||
if (existingIndex !== -1) {
|
||||
// Update QtyReq jika batch yang sama sudah ada
|
||||
let existingQty = Number(element.ItemRequest[existingIndex].QtyReq);
|
||||
let newQty = Number(newItem.QtyReq);
|
||||
element.ItemRequest[existingIndex].QtyReq = String(existingQty + newQty);
|
||||
} else {
|
||||
// Tambahkan batch baru
|
||||
element.ItemRequest.push(newItem);
|
||||
}
|
||||
});
|
||||
} else {
|
||||
// Jika belum ada ItemRequest, set yang baru
|
||||
element.ItemRequest = new_batchitem;
|
||||
}
|
||||
|
||||
element.QtyFilled = qty;
|
||||
element.rioDReceiveQty = qty;
|
||||
}
|
||||
});
|
||||
|
||||
this.selectedItems = current_detail
|
||||
this.form_batchitem = []
|
||||
// this.list_batchitemform = {}
|
||||
this.buffer_detailitem = {}
|
||||
this.dialog_batchitem = false
|
||||
|
||||
// console.log('after current_detail', current_detail)
|
||||
|
||||
// validasi qty receive jika melebihi qty request
|
||||
this.validateReceiveQty(current_item)
|
||||
},
|
||||
removeChips(data) {
|
||||
let tempo = this.form_batchitem.filter(item => item.StockBatchNo !== data.StockBatchNo)
|
||||
this.form_batchitem = tempo
|
||||
},
|
||||
validateReceiveQty(item) {
|
||||
let totalRequestQty = parseInt(item.rioDQty) || 0;
|
||||
let inputReceiveQty = parseInt(item.rioDReceiveQty) || 0;
|
||||
|
||||
if (inputReceiveQty > totalRequestQty) {
|
||||
if (!this.emptycheck.includes(item.rioDID)) {
|
||||
this.emptycheck.push(item.rioDID);
|
||||
}
|
||||
} else {
|
||||
this.emptycheck = this.emptycheck.filter(id => id !== item.rioDID);
|
||||
}
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
288
test/vuex/acc-one-item-out-v3/components/dialogItemApprove.vue
Normal file
288
test/vuex/acc-one-item-out-v3/components/dialogItemApprove.vue
Normal file
@@ -0,0 +1,288 @@
|
||||
<template>
|
||||
<v-layout row justify-center>
|
||||
<v-dialog v-model="dialogApprove" persistent max-width="75%">
|
||||
<v-card>
|
||||
<v-card-title class="headline grey lighten-2" primary-title>
|
||||
APPROVE
|
||||
</v-card-title>
|
||||
<v-card-text class="pt-2 pb-0">
|
||||
|
||||
<v-layout row wrap>
|
||||
<v-flex xs2>
|
||||
Nomor
|
||||
</v-flex>
|
||||
<v-flex xs10>
|
||||
: {{ selectedMainTable.T_ItemOutNumber }}
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
|
||||
<v-layout row wrap>
|
||||
<v-flex xs2>
|
||||
Tanggal Transaksi
|
||||
</v-flex>
|
||||
<v-flex xs10>
|
||||
: {{ deFormatedDate(selectedMainTable.T_ItemOutDate) }}
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
|
||||
<v-layout row wrap>
|
||||
<v-flex xs2>
|
||||
Gudang
|
||||
</v-flex>
|
||||
<v-flex xs10>
|
||||
: {{ selectedMainTable.WarehouseName }}
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
|
||||
<v-layout row wrap>
|
||||
<v-flex xs2>
|
||||
Divisi
|
||||
</v-flex>
|
||||
<v-flex xs10>
|
||||
: {{ selectedMainTable.DivisionName }}
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
|
||||
<v-layout row wrap>
|
||||
<v-flex xs2>
|
||||
Status
|
||||
</v-flex>
|
||||
<v-flex xs10>
|
||||
: {{ selectedMainTable.T_ItemOutStatus }}
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
|
||||
<v-layout row wrap>
|
||||
<v-flex xs2>
|
||||
Catatan
|
||||
</v-flex>
|
||||
<v-flex xs10>
|
||||
: {{ selectedMainTable.T_ItemOutNote }}
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
|
||||
<v-card flat class=" 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="headersItems"
|
||||
:items="detailItemouts"
|
||||
hide-actions
|
||||
class="elevation-1"
|
||||
>
|
||||
<template slot="items" slot-scope="props">
|
||||
<td
|
||||
class="text-xs-left pa-2"
|
||||
>
|
||||
<div
|
||||
style="
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
"
|
||||
>
|
||||
{{ props.item.T_ItemOutNumber }}
|
||||
</div>
|
||||
</td>
|
||||
<td
|
||||
class="text-xs-left pa-2"
|
||||
>
|
||||
<div
|
||||
style="
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
"
|
||||
>
|
||||
<v-chip small style="border-radius: 5px; flex-grow: 0">
|
||||
{{ props.item.M_ItemDesc }}
|
||||
</v-chip>
|
||||
</div>
|
||||
</td>
|
||||
<td
|
||||
class="text-xs-center pa-2"
|
||||
>
|
||||
{{ props.item.ItemUnitName }}
|
||||
</td>
|
||||
<td
|
||||
class="text-xs-center pa-2"
|
||||
>
|
||||
{{ props.item.StockQty }}
|
||||
</td>
|
||||
<td
|
||||
class="text-xs-center pa-2"
|
||||
>
|
||||
{{ props.item.RequestItemOutDetailQty }}
|
||||
</td>
|
||||
<td
|
||||
class="text-xs-center pa-2"
|
||||
>
|
||||
{{ props.item.remainingRequestQty }}
|
||||
</td>
|
||||
<td
|
||||
class="text-xs-center pa-2"
|
||||
>
|
||||
{{ props.item.T_ItemOutDetailQty }}
|
||||
</td>
|
||||
</template>
|
||||
</v-data-table>
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
</v-card>
|
||||
|
||||
</v-card-text>
|
||||
<v-card-actions>
|
||||
<!-- <v-btn
|
||||
color="red"
|
||||
:disabled="loadingSave"
|
||||
dark
|
||||
@click="saveReject()"
|
||||
>Reject</v-btn
|
||||
> -->
|
||||
<v-spacer></v-spacer>
|
||||
<v-btn color="error" flat @click="closeDialogApprove()">
|
||||
Tutup
|
||||
</v-btn>
|
||||
<v-btn
|
||||
color="green"
|
||||
:disabled="loadingSave"
|
||||
dark
|
||||
@click="saveApprove()"
|
||||
>Approve</v-btn
|
||||
>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
</v-layout>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
module.exports = {
|
||||
name: "AddPurchaseRequestDialog",
|
||||
data() {
|
||||
return {
|
||||
headersItems: [
|
||||
{
|
||||
text: "NO",
|
||||
align: "center",
|
||||
sortable: false,
|
||||
value: "action",
|
||||
width: "15%",
|
||||
class: "pa-2 pl-2 blue lighten-3 white--text",
|
||||
},
|
||||
{
|
||||
text: "ITEM",
|
||||
align: "center",
|
||||
sortable: false,
|
||||
value: "action",
|
||||
width: "25%",
|
||||
class: "pa-2 pl-2 blue lighten-3 white--text",
|
||||
},
|
||||
{
|
||||
text: "SATUAN",
|
||||
align: "center",
|
||||
sortable: false,
|
||||
value: "action",
|
||||
width: "20%",
|
||||
class: "pa-2 pl-2 blue lighten-3 white--text",
|
||||
},
|
||||
{
|
||||
text: "STOCK",
|
||||
align: "center",
|
||||
sortable: false,
|
||||
value: "action",
|
||||
width: "10%",
|
||||
class: "pa-2 pl-2 blue lighten-3 white--text",
|
||||
},
|
||||
{
|
||||
text: "REQUEST QTY",
|
||||
align: "center",
|
||||
sortable: false,
|
||||
value: "action",
|
||||
width: "10%",
|
||||
class: "pa-2 pl-2 blue lighten-3 white--text",
|
||||
},
|
||||
{
|
||||
text: "SISA REQUEST",
|
||||
align: "center",
|
||||
sortable: false,
|
||||
value: "action",
|
||||
width: "10%",
|
||||
class: "pa-2 pl-2 blue lighten-3 white--text",
|
||||
},
|
||||
{
|
||||
text: "ITEM OUT",
|
||||
align: "center",
|
||||
sortable: false,
|
||||
value: "action",
|
||||
width: "10%",
|
||||
class: "pa-2 pl-2 blue lighten-3 white--text",
|
||||
}
|
||||
]
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
|
||||
},
|
||||
computed: {
|
||||
dialogApprove: {
|
||||
get() {
|
||||
return this.$store.state.requester.dialogApprove;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateDialogApprove", val);
|
||||
},
|
||||
},
|
||||
selectedMainTable: {
|
||||
get() {
|
||||
return this.$store.state.requester.selectedMainTable;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateSelectedMainTable", val);
|
||||
},
|
||||
},
|
||||
loadingSave: {
|
||||
get() {
|
||||
return this.$store.state.requester.loadingSave;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateLoadingSave", val);
|
||||
},
|
||||
},
|
||||
detailItemouts() {
|
||||
return this.$store.state.requester.detailItemouts;
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
deFormatedDate(date) {
|
||||
if (!date) return null;
|
||||
|
||||
const [day, month, year] = date.split("-");
|
||||
return `${year}-${month.padStart(2, "0")}-${day.padStart(2, "0")}`;
|
||||
},
|
||||
closeDialogApprove() {
|
||||
this.$store.commit("requester/updateDialogApprove", false);
|
||||
},
|
||||
saveApprove() {
|
||||
this.$store.commit("requester/updateLoadingSave", true);
|
||||
let prm = {
|
||||
ioID: this.$store.state.requester.xIOID
|
||||
}
|
||||
// console.log(prm)
|
||||
this.$store.dispatch("requester/approveIO", prm);
|
||||
},
|
||||
saveReject() {
|
||||
this.$store.commit("requester/updateLoadingSave", true);
|
||||
let prm = {
|
||||
IOID: this.$store.state.requester.xIOID,
|
||||
}
|
||||
// console.log(prm)
|
||||
this.$store.dispatch("requester/rejectRequest", prm);
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
272
test/vuex/acc-one-item-out-v3/components/dialogItemConfirm.vue
Normal file
272
test/vuex/acc-one-item-out-v3/components/dialogItemConfirm.vue
Normal file
@@ -0,0 +1,272 @@
|
||||
<template>
|
||||
<v-layout row justify-center>
|
||||
<v-dialog v-model="dialogConfirm" persistent max-width="75%">
|
||||
<v-card>
|
||||
<v-card-title class="headline grey lighten-2" primary-title>
|
||||
KONFIRMASI
|
||||
</v-card-title>
|
||||
<v-card-text class="pt-2 pb-0">
|
||||
|
||||
<v-layout row wrap>
|
||||
<v-flex xs2>
|
||||
Nomor
|
||||
</v-flex>
|
||||
<v-flex xs10>
|
||||
: {{ selectedMainTable.T_ItemOutNumber }}
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
|
||||
<v-layout row wrap>
|
||||
<v-flex xs2>
|
||||
Tanggal Transaksi
|
||||
</v-flex>
|
||||
<v-flex xs10>
|
||||
: {{ deFormatedDate(selectedMainTable.T_ItemOutDate) }}
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
|
||||
<v-layout row wrap>
|
||||
<v-flex xs2>
|
||||
Gudang
|
||||
</v-flex>
|
||||
<v-flex xs10>
|
||||
: {{ selectedMainTable.WarehouseName }}
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
|
||||
<v-layout row wrap>
|
||||
<v-flex xs2>
|
||||
Divisi
|
||||
</v-flex>
|
||||
<v-flex xs10>
|
||||
: {{ selectedMainTable.DivisionName }}
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
|
||||
<v-layout row wrap>
|
||||
<v-flex xs2>
|
||||
Status
|
||||
</v-flex>
|
||||
<v-flex xs10>
|
||||
: {{ selectedMainTable.T_ItemOutStatus }}
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
|
||||
<v-layout row wrap>
|
||||
<v-flex xs2>
|
||||
Catatan
|
||||
</v-flex>
|
||||
<v-flex xs10>
|
||||
: {{ selectedMainTable.T_ItemOutNote }}
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
|
||||
<v-card flat class=" 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="headersItems"
|
||||
:items="detailItemouts"
|
||||
hide-actions
|
||||
class="elevation-1"
|
||||
>
|
||||
<template slot="items" slot-scope="props">
|
||||
<td
|
||||
class="text-xs-left pa-2"
|
||||
>
|
||||
<div
|
||||
style="
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
"
|
||||
>
|
||||
{{ props.item.T_ItemOutNumber }}
|
||||
</div>
|
||||
</td>
|
||||
<td
|
||||
class="text-xs-left pa-2"
|
||||
>
|
||||
<div
|
||||
style="
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
"
|
||||
>
|
||||
<v-chip small style="border-radius: 5px; flex-grow: 0">
|
||||
{{ props.item.M_ItemDesc }}
|
||||
</v-chip>
|
||||
</div>
|
||||
</td>
|
||||
<td
|
||||
class="text-xs-center pa-2"
|
||||
>
|
||||
{{ props.item.ItemUnitName }}
|
||||
</td>
|
||||
<td
|
||||
class="text-xs-center pa-2"
|
||||
>
|
||||
{{ props.item.StockQty }}
|
||||
</td>
|
||||
<td
|
||||
class="text-xs-center pa-2"
|
||||
>
|
||||
{{ props.item.RequestItemOutDetailQty }}
|
||||
</td>
|
||||
<td
|
||||
class="text-xs-center pa-2"
|
||||
>
|
||||
{{ props.item.remainingRequestQty }}
|
||||
</td>
|
||||
<td
|
||||
class="text-xs-center pa-2"
|
||||
>
|
||||
{{ props.item.T_ItemOutDetailQty }}
|
||||
</td>
|
||||
</template>
|
||||
</v-data-table>
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
</v-card>
|
||||
|
||||
</v-card-text>
|
||||
<v-card-actions>
|
||||
<v-spacer></v-spacer>
|
||||
<v-btn color="error" flat @click="closeDialogConfirm()">
|
||||
Tutup
|
||||
</v-btn>
|
||||
<v-btn
|
||||
color="blue"
|
||||
:disabled="loadingSave"
|
||||
dark
|
||||
@click="saveConfirm()"
|
||||
>Konfirmasi</v-btn
|
||||
>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
</v-layout>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
module.exports = {
|
||||
name: "AddPurchaseRequestDialog",
|
||||
data() {
|
||||
return {
|
||||
headersItems: [
|
||||
{
|
||||
text: "NO",
|
||||
align: "center",
|
||||
sortable: false,
|
||||
value: "action",
|
||||
width: "15%",
|
||||
class: "pa-2 pl-2 blue lighten-3 white--text",
|
||||
},
|
||||
{
|
||||
text: "ITEM",
|
||||
align: "center",
|
||||
sortable: false,
|
||||
value: "action",
|
||||
width: "25%",
|
||||
class: "pa-2 pl-2 blue lighten-3 white--text",
|
||||
},
|
||||
{
|
||||
text: "SATUAN",
|
||||
align: "center",
|
||||
sortable: false,
|
||||
value: "action",
|
||||
width: "20%",
|
||||
class: "pa-2 pl-2 blue lighten-3 white--text",
|
||||
},
|
||||
{
|
||||
text: "STOCK",
|
||||
align: "center",
|
||||
sortable: false,
|
||||
value: "action",
|
||||
width: "10%",
|
||||
class: "pa-2 pl-2 blue lighten-3 white--text",
|
||||
},
|
||||
{
|
||||
text: "REQUEST QTY",
|
||||
align: "center",
|
||||
sortable: false,
|
||||
value: "action",
|
||||
width: "10%",
|
||||
class: "pa-2 pl-2 blue lighten-3 white--text",
|
||||
},
|
||||
{
|
||||
text: "SISA REQUEST",
|
||||
align: "center",
|
||||
sortable: false,
|
||||
value: "action",
|
||||
width: "10%",
|
||||
class: "pa-2 pl-2 blue lighten-3 white--text",
|
||||
},
|
||||
{
|
||||
text: "ITEM OUT",
|
||||
align: "center",
|
||||
sortable: false,
|
||||
value: "action",
|
||||
width: "10%",
|
||||
class: "pa-2 pl-2 blue lighten-3 white--text",
|
||||
}
|
||||
]
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
|
||||
},
|
||||
computed: {
|
||||
dialogConfirm: {
|
||||
get() {
|
||||
return this.$store.state.requester.dialogConfirm;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateDialogConfirm", val);
|
||||
},
|
||||
},
|
||||
selectedMainTable: {
|
||||
get() {
|
||||
return this.$store.state.requester.selectedMainTable;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateSelectedMainTable", val);
|
||||
},
|
||||
},
|
||||
loadingSave: {
|
||||
get() {
|
||||
return this.$store.state.requester.loadingSave;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateLoadingSave", val);
|
||||
},
|
||||
},
|
||||
detailItemouts() {
|
||||
return this.$store.state.requester.detailItemouts;
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
deFormatedDate(date) {
|
||||
if (!date) return null;
|
||||
|
||||
const [day, month, year] = date.split("-");
|
||||
return `${year}-${month.padStart(2, "0")}-${day.padStart(2, "0")}`;
|
||||
},
|
||||
closeDialogConfirm() {
|
||||
this.$store.commit("requester/updateDialogConfirm", false);
|
||||
},
|
||||
saveConfirm() {
|
||||
this.$store.commit("requester/updateLoadingSave", true);
|
||||
let prm = {
|
||||
ioID: this.$store.state.requester.xIOID,
|
||||
}
|
||||
this.$store.dispatch("requester/confirmIO", prm);
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
237
test/vuex/acc-one-item-out-v3/components/dialogItemPreview.vue
Normal file
237
test/vuex/acc-one-item-out-v3/components/dialogItemPreview.vue
Normal file
@@ -0,0 +1,237 @@
|
||||
<template>
|
||||
<v-layout row justify-center>
|
||||
<v-dialog v-model="dialogPreview" persistent max-width="75%">
|
||||
<v-card>
|
||||
<v-card-title class="headline grey lighten-2" primary-title>
|
||||
PREVIEW
|
||||
</v-card-title>
|
||||
<v-card-text class="pt-2 pb-0">
|
||||
|
||||
<v-layout row wrap>
|
||||
<v-flex xs2>
|
||||
Nomor
|
||||
</v-flex>
|
||||
<v-flex xs10>
|
||||
: {{ selectedMainTable.T_ItemOutNumber }}
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
|
||||
<v-layout row wrap>
|
||||
<v-flex xs2>
|
||||
Tanggal Transaksi
|
||||
</v-flex>
|
||||
<v-flex xs10>
|
||||
: {{ deFormatedDate(selectedMainTable.T_ItemOutDate) }}
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
|
||||
<v-layout row wrap>
|
||||
<v-flex xs2>
|
||||
Gudang
|
||||
</v-flex>
|
||||
<v-flex xs10>
|
||||
: {{ selectedMainTable.WarehouseName }}
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
|
||||
<v-layout row wrap>
|
||||
<v-flex xs2>
|
||||
Divisi
|
||||
</v-flex>
|
||||
<v-flex xs10>
|
||||
: {{ selectedMainTable.DivisionName }}
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
|
||||
<v-layout row wrap>
|
||||
<v-flex xs2>
|
||||
Status
|
||||
</v-flex>
|
||||
<v-flex xs10>
|
||||
: {{ selectedMainTable.T_ItemOutStatus }}
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
|
||||
<v-layout row wrap>
|
||||
<v-flex xs2>
|
||||
Catatan
|
||||
</v-flex>
|
||||
<v-flex xs10>
|
||||
: {{ selectedMainTable.T_ItemOutNote }}
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
|
||||
<v-card flat class=" 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="headersItems"
|
||||
:items="detailItemouts"
|
||||
hide-actions
|
||||
class="elevation-1"
|
||||
>
|
||||
<template slot="items" slot-scope="props">
|
||||
<td
|
||||
class="text-xs-left pa-2"
|
||||
>
|
||||
<div
|
||||
style="
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
"
|
||||
>
|
||||
{{ props.item.T_ItemOutNumber }}
|
||||
</div>
|
||||
</td>
|
||||
<td
|
||||
class="text-xs-left pa-2"
|
||||
>
|
||||
<div
|
||||
style="
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
"
|
||||
>
|
||||
<v-chip small style="border-radius: 5px; flex-grow: 0">
|
||||
{{ props.item.M_ItemDesc }}
|
||||
</v-chip>
|
||||
</div>
|
||||
</td>
|
||||
<td
|
||||
class="text-xs-center pa-2"
|
||||
>
|
||||
{{ props.item.ItemUnitName }}
|
||||
</td>
|
||||
<td
|
||||
class="text-xs-center pa-2"
|
||||
>
|
||||
{{ props.item.StockQty }}
|
||||
</td>
|
||||
<td
|
||||
class="text-xs-center pa-2"
|
||||
>
|
||||
{{ props.item.RequestItemOutDetailQty }}
|
||||
</td>
|
||||
<td
|
||||
class="text-xs-center pa-2"
|
||||
>
|
||||
{{ props.item.T_ItemOutDetailQty }}
|
||||
</td>
|
||||
</template>
|
||||
</v-data-table>
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
</v-card>
|
||||
|
||||
</v-card-text>
|
||||
<v-card-actions>
|
||||
<v-spacer></v-spacer>
|
||||
<v-btn color="error" flat @click="closeDialogPreview()">
|
||||
Tutup
|
||||
</v-btn>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
</v-layout>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
module.exports = {
|
||||
name: "AddPurchaseRequestDialog",
|
||||
data() {
|
||||
return {
|
||||
headersItems: [
|
||||
{
|
||||
text: "NO",
|
||||
align: "center",
|
||||
sortable: false,
|
||||
value: "action",
|
||||
width: "15%",
|
||||
class: "pa-2 pl-2 blue lighten-3 white--text",
|
||||
},
|
||||
{
|
||||
text: "ITEM",
|
||||
align: "center",
|
||||
sortable: false,
|
||||
value: "action",
|
||||
width: "30%",
|
||||
class: "pa-2 pl-2 blue lighten-3 white--text",
|
||||
},
|
||||
{
|
||||
text: "SATUAN",
|
||||
align: "center",
|
||||
sortable: false,
|
||||
value: "action",
|
||||
width: "25%",
|
||||
class: "pa-2 pl-2 blue lighten-3 white--text",
|
||||
},
|
||||
{
|
||||
text: "STOCK",
|
||||
align: "center",
|
||||
sortable: false,
|
||||
value: "action",
|
||||
width: "10%",
|
||||
class: "pa-2 pl-2 blue lighten-3 white--text",
|
||||
},
|
||||
{
|
||||
text: "REQUEST QTY",
|
||||
align: "center",
|
||||
sortable: false,
|
||||
value: "action",
|
||||
width: "10%",
|
||||
class: "pa-2 pl-2 blue lighten-3 white--text",
|
||||
},
|
||||
{
|
||||
text: "ITEM OUT",
|
||||
align: "center",
|
||||
sortable: false,
|
||||
value: "action",
|
||||
width: "10%",
|
||||
class: "pa-2 pl-2 blue lighten-3 white--text",
|
||||
}
|
||||
]
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
|
||||
},
|
||||
computed: {
|
||||
dialogPreview: {
|
||||
get() {
|
||||
return this.$store.state.requester.dialogPreview;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateDialogPreview", val);
|
||||
},
|
||||
},
|
||||
selectedMainTable: {
|
||||
get() {
|
||||
return this.$store.state.requester.selectedMainTable;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateSelectedMainTable", val);
|
||||
},
|
||||
},
|
||||
detailItemouts() {
|
||||
return this.$store.state.requester.detailItemouts;
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
deFormatedDate(date) {
|
||||
if (!date) return null;
|
||||
|
||||
const [day, month, year] = date.split("-");
|
||||
return `${year}-${month.padStart(2, "0")}-${day.padStart(2, "0")}`;
|
||||
},
|
||||
closeDialogPreview() {
|
||||
this.$store.commit("requester/updateDialogPreview", false);
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
274
test/vuex/acc-one-item-out-v3/components/dialogItemProcess.vue
Normal file
274
test/vuex/acc-one-item-out-v3/components/dialogItemProcess.vue
Normal file
@@ -0,0 +1,274 @@
|
||||
<template>
|
||||
<v-layout row justify-center>
|
||||
<v-dialog v-model="dialogProcess" persistent max-width="75%">
|
||||
<v-card>
|
||||
<v-card-title class="headline grey lighten-2" primary-title>
|
||||
PROSES TRANSAKSI
|
||||
</v-card-title>
|
||||
<v-card-text class="pt-2 pb-0">
|
||||
|
||||
<v-layout row wrap>
|
||||
<v-flex xs2>
|
||||
Nomor
|
||||
</v-flex>
|
||||
<v-flex xs10>
|
||||
: {{ selectedMainTable.T_ItemOutNumber }}
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
|
||||
<v-layout row wrap>
|
||||
<v-flex xs2>
|
||||
Tanggal Transaksi
|
||||
</v-flex>
|
||||
<v-flex xs10>
|
||||
: {{ deFormatedDate(selectedMainTable.T_ItemOutDate) }}
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
|
||||
<v-layout row wrap>
|
||||
<v-flex xs2>
|
||||
Gudang
|
||||
</v-flex>
|
||||
<v-flex xs10>
|
||||
: {{ selectedMainTable.WarehouseName }}
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
|
||||
<v-layout row wrap>
|
||||
<v-flex xs2>
|
||||
Divisi
|
||||
</v-flex>
|
||||
<v-flex xs10>
|
||||
: {{ selectedMainTable.DivisionName }}
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
|
||||
<v-layout row wrap>
|
||||
<v-flex xs2>
|
||||
Status
|
||||
</v-flex>
|
||||
<v-flex xs10>
|
||||
: {{ selectedMainTable.T_ItemOutStatus }}
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
|
||||
<v-layout row wrap>
|
||||
<v-flex xs2>
|
||||
Catatan
|
||||
</v-flex>
|
||||
<v-flex xs10>
|
||||
: {{ selectedMainTable.T_ItemOutNote }}
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
|
||||
<v-card flat class=" 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="headersItems"
|
||||
:items="detailItemouts"
|
||||
hide-actions
|
||||
class="elevation-1"
|
||||
>
|
||||
<template slot="items" slot-scope="props">
|
||||
<td
|
||||
class="text-xs-left pa-2"
|
||||
>
|
||||
<div
|
||||
style="
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
"
|
||||
>
|
||||
{{ props.item.T_ItemOutNumber }}
|
||||
</div>
|
||||
</td>
|
||||
<td
|
||||
class="text-xs-left pa-2"
|
||||
>
|
||||
<div
|
||||
style="
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
"
|
||||
>
|
||||
<v-chip small style="border-radius: 5px; flex-grow: 0">
|
||||
{{ props.item.M_ItemDesc }}
|
||||
</v-chip>
|
||||
</div>
|
||||
</td>
|
||||
<td
|
||||
class="text-xs-center pa-2"
|
||||
>
|
||||
{{ props.item.ItemUnitName }}
|
||||
</td>
|
||||
<td
|
||||
class="text-xs-center pa-2"
|
||||
>
|
||||
{{ props.item.StockQty }}
|
||||
</td>
|
||||
<td
|
||||
class="text-xs-center pa-2"
|
||||
>
|
||||
{{ props.item.RequestItemOutDetailQty }}
|
||||
</td>
|
||||
<td
|
||||
class="text-xs-center pa-2"
|
||||
>
|
||||
{{ props.item.remainingRequestQty }}
|
||||
</td>
|
||||
<td
|
||||
class="text-xs-center pa-2"
|
||||
>
|
||||
{{ props.item.T_ItemOutDetailQty }}
|
||||
</td>
|
||||
</template>
|
||||
</v-data-table>
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
</v-card>
|
||||
|
||||
</v-card-text>
|
||||
<v-card-actions>
|
||||
<v-spacer></v-spacer>
|
||||
<v-btn color="error" flat @click="closeDialogProcess()">
|
||||
Tutup
|
||||
</v-btn>
|
||||
<v-btn
|
||||
color="green"
|
||||
:disabled="loadingSave"
|
||||
dark
|
||||
@click="saveProcess()"
|
||||
>Process</v-btn
|
||||
>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
</v-layout>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
module.exports = {
|
||||
name: "AddPurchaseRequestDialog",
|
||||
data() {
|
||||
return {
|
||||
headersItems: [
|
||||
{
|
||||
text: "NO",
|
||||
align: "center",
|
||||
sortable: false,
|
||||
value: "action",
|
||||
width: "15%",
|
||||
class: "pa-2 pl-2 blue lighten-3 white--text",
|
||||
},
|
||||
{
|
||||
text: "ITEM",
|
||||
align: "center",
|
||||
sortable: false,
|
||||
value: "action",
|
||||
width: "25%",
|
||||
class: "pa-2 pl-2 blue lighten-3 white--text",
|
||||
},
|
||||
{
|
||||
text: "SATUAN",
|
||||
align: "center",
|
||||
sortable: false,
|
||||
value: "action",
|
||||
width: "20%",
|
||||
class: "pa-2 pl-2 blue lighten-3 white--text",
|
||||
},
|
||||
{
|
||||
text: "STOCK",
|
||||
align: "center",
|
||||
sortable: false,
|
||||
value: "action",
|
||||
width: "10%",
|
||||
class: "pa-2 pl-2 blue lighten-3 white--text",
|
||||
},
|
||||
{
|
||||
text: "REQUEST QTY",
|
||||
align: "center",
|
||||
sortable: false,
|
||||
value: "action",
|
||||
width: "10%",
|
||||
class: "pa-2 pl-2 blue lighten-3 white--text",
|
||||
},
|
||||
{
|
||||
text: "SISA REQUEST",
|
||||
align: "center",
|
||||
sortable: false,
|
||||
value: "action",
|
||||
width: "10%",
|
||||
class: "pa-2 pl-2 blue lighten-3 white--text",
|
||||
},
|
||||
{
|
||||
text: "ITEM OUT",
|
||||
align: "center",
|
||||
sortable: false,
|
||||
value: "action",
|
||||
width: "10%",
|
||||
class: "pa-2 pl-2 blue lighten-3 white--text",
|
||||
}
|
||||
]
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
|
||||
},
|
||||
computed: {
|
||||
dialogProcess: {
|
||||
get() {
|
||||
return this.$store.state.requester.dialogProcess;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateDialogProcess", val);
|
||||
},
|
||||
},
|
||||
selectedMainTable: {
|
||||
get() {
|
||||
return this.$store.state.requester.selectedMainTable;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateSelectedMainTable", val);
|
||||
},
|
||||
},
|
||||
loadingSave: {
|
||||
get() {
|
||||
return this.$store.state.requester.loadingSave;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateLoadingSave", val);
|
||||
},
|
||||
},
|
||||
detailItemouts() {
|
||||
return this.$store.state.requester.detailItemouts;
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
deFormatedDate(date) {
|
||||
if (!date) return null;
|
||||
|
||||
const [day, month, year] = date.split("-");
|
||||
return `${year}-${month.padStart(2, "0")}-${day.padStart(2, "0")}`;
|
||||
},
|
||||
closeDialogProcess() {
|
||||
this.$store.commit("requester/updateDialogProcess", false);
|
||||
},
|
||||
saveProcess() {
|
||||
this.$store.commit("requester/updateLoadingSave", true);
|
||||
let prm = {
|
||||
ioID: this.$store.state.requester.xIOID,
|
||||
items: this.$store.state.requester.detailItemouts
|
||||
}
|
||||
// console.log(prm)
|
||||
this.$store.dispatch("requester/processIO", prm);
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
888
test/vuex/acc-one-item-out-v3/components/requestItemOut.vue
Normal file
888
test/vuex/acc-one-item-out-v3/components/requestItemOut.vue
Normal file
@@ -0,0 +1,888 @@
|
||||
<template>
|
||||
<div style="width: 100%">
|
||||
<v-snackbar
|
||||
v-model="snackbar.state"
|
||||
:color="snackbar.type"
|
||||
:timeout="3000"
|
||||
multi-line
|
||||
top
|
||||
>
|
||||
{{ snackbar.message }}
|
||||
<v-btn flat @click="snackbar.state = false">
|
||||
Close
|
||||
</v-btn>
|
||||
</v-snackbar>
|
||||
|
||||
<template>
|
||||
<v-dialog v-model="dialogapprove" max-width="30%">
|
||||
<v-card>
|
||||
<v-card-title class="headline grey lighten-2 pt-2 pb-2" primary-title>
|
||||
Peringatan !
|
||||
</v-card-title>
|
||||
<v-card-text class="pt-2 pb-2">
|
||||
<v-layout row>
|
||||
<v-flex xs12 d-flex>
|
||||
<v-layout row>
|
||||
<v-flex pb-1 xs12>
|
||||
<v-layout row>
|
||||
<v-flex pt-2 pr-2 xs12>
|
||||
{{ msgapprove }}
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
</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="error" flat @click="dialogapprove = false">
|
||||
Tutup
|
||||
</v-btn>
|
||||
<v-btn
|
||||
color="primary"
|
||||
@click="orderApprove()"
|
||||
>
|
||||
Ya
|
||||
</v-btn>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
</template>
|
||||
|
||||
<template>
|
||||
<v-dialog v-model="dialogreject" max-width="30%">
|
||||
<v-card>
|
||||
<v-card-title class="headline grey lighten-2 pt-2 pb-2" primary-title>
|
||||
Peringatan !
|
||||
</v-card-title>
|
||||
<v-card-text class="pt-2 pb-2">
|
||||
<v-layout row>
|
||||
<v-flex xs12 d-flex>
|
||||
<v-layout row>
|
||||
<v-flex pb-1 xs12>
|
||||
<v-layout row>
|
||||
<v-flex pt-2 pr-2 xs12>
|
||||
{{ msgreject }}
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
</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="error" flat @click="dialogreject = false">
|
||||
Tutup
|
||||
</v-btn>
|
||||
<v-btn
|
||||
color="primary"
|
||||
@click="orderRejected()"
|
||||
>
|
||||
Ya
|
||||
</v-btn>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
</template>
|
||||
|
||||
<!-- ERROR DIALOG -->
|
||||
<!-- <v-dialog v-model="dialog_error" max-width="500px">
|
||||
<v-card>
|
||||
<v-card-title>
|
||||
<span>ERROR !</span>
|
||||
<v-spacer></v-spacer>
|
||||
</v-card-title>
|
||||
<v-divider></v-divider>
|
||||
<div class="ma-3 red--text">{{ msgError }}</div>
|
||||
<v-divider></v-divider>
|
||||
<v-card-actions>
|
||||
<v-spacer></v-spacer>
|
||||
<v-btn color="primary" flat @click="dialog_error = false"
|
||||
>Tutup</v-btn
|
||||
>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-dialog> -->
|
||||
<!-- END ERROR DIALOG -->
|
||||
|
||||
<v-toolbar color="primary" dark>
|
||||
<v-toolbar-title class="white--text"
|
||||
>LISTING REQUEST PENGELUARAN BARANG</v-toolbar-title
|
||||
>
|
||||
</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
|
||||
v-model="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
|
||||
v-model="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"
|
||||
return-object
|
||||
label="Status"
|
||||
style="max-width: 250px"
|
||||
outline
|
||||
hide-details
|
||||
></v-autocomplete>
|
||||
<v-text-field
|
||||
v-model="fSearch"
|
||||
label="Cari..."
|
||||
placeholder="NO. RIO"
|
||||
style="max-width: 250px"
|
||||
outline
|
||||
hide-details
|
||||
></v-text-field>
|
||||
<v-btn
|
||||
dark
|
||||
color="primary"
|
||||
style="min-width: 50px; height: 50px; margin: 0"
|
||||
@click="listSearch()"
|
||||
>
|
||||
<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="listRequest"
|
||||
:loading="loadingStatus"
|
||||
hide-actions
|
||||
class="elevation-1"
|
||||
>
|
||||
<template v-slot:headers="props">
|
||||
<tr>
|
||||
<th
|
||||
v-for="header in props.headers" :class="header.class"
|
||||
:key="header.text" :width="header.width">
|
||||
{{ header.text }}
|
||||
</th>
|
||||
<th width="5%" class="blue lighten-3 white--text">
|
||||
<v-checkbox
|
||||
:loading="loadingStatus"
|
||||
:input-value="headerCheckboxValueAll()"
|
||||
primary hide-details
|
||||
:indeterminate="headerCheckboxValuePartial()"
|
||||
@click.stop="checkItemAll"
|
||||
></v-checkbox>
|
||||
</th>
|
||||
</tr>
|
||||
</template>
|
||||
<template v-slot:items="props">
|
||||
<td
|
||||
class="text-xs-center pa-2"
|
||||
>
|
||||
<div
|
||||
style="
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
"
|
||||
>
|
||||
<p class="mb-0 font-weight-bold" style="color:#000000">{{ props.item.rioNumber }}</p>
|
||||
{{ deFormatedDate(props.item.rioDate) }}
|
||||
</div>
|
||||
</td>
|
||||
<td
|
||||
class="text-xs-left pa-2"
|
||||
>
|
||||
{{ props.item.M_ItemDesc }}
|
||||
</td>
|
||||
<td
|
||||
class="text-xs-left pa-2"
|
||||
>
|
||||
{{ props.item.StockQty }}
|
||||
</td>
|
||||
<td
|
||||
class="text-xs-left pa-2"
|
||||
>
|
||||
{{ props.item.rioDQty }}
|
||||
</td>
|
||||
<td
|
||||
class="text-xs-left pa-2"
|
||||
>
|
||||
<v-chip
|
||||
small
|
||||
:text-color="
|
||||
props.item.rioDStatus === 'Draft'
|
||||
? 'black'
|
||||
: 'white'
|
||||
"
|
||||
:color="
|
||||
getChipStatusColor(
|
||||
props.item.rioDStatus
|
||||
)
|
||||
"
|
||||
>
|
||||
{{ props.item.rioDStatus }}
|
||||
</v-chip>
|
||||
</td>
|
||||
<td>
|
||||
<span v-if="props.item.rioStatus === 'Send Request'">
|
||||
<v-checkbox
|
||||
:input-value="checkBoxValue(props.item)"
|
||||
primary hide-details
|
||||
@change="changeCheckBox(props.item)"
|
||||
></v-checkbox>
|
||||
</span>
|
||||
</td>
|
||||
|
||||
|
||||
<!-- <template
|
||||
v-if="props.item.rioDStatus == 'Send Request'"
|
||||
>
|
||||
<td
|
||||
class="text-xs-center pa-2"
|
||||
v-bind:class="{ 'amber lighten-4': isSelected(props.item) }"
|
||||
@click="selectMe(props.item)"
|
||||
>
|
||||
<v-btn
|
||||
dark
|
||||
v-if="requestExist(props.item)"
|
||||
@click="addRequest(props.item)"
|
||||
style="min-width: 25px; height: 30px"
|
||||
small
|
||||
color="success"
|
||||
>
|
||||
<v-icon small>check</v-icon>
|
||||
</v-btn>
|
||||
<v-btn
|
||||
dark
|
||||
v-if="!requestExist(props.item)"
|
||||
@click="removeRequest(props.item)"
|
||||
style="min-width: 25px; height: 30px"
|
||||
small
|
||||
color="red"
|
||||
>
|
||||
<v-icon small>close</v-icon>
|
||||
</v-btn>
|
||||
</td>
|
||||
</template>
|
||||
<template v-else>
|
||||
<td
|
||||
class="text-xs-center pa-2"
|
||||
v-bind:class="{ 'amber lighten-4': isSelected(props.item) }"
|
||||
@click="selectMe(props.item)">
|
||||
</td>
|
||||
</template> -->
|
||||
</template>
|
||||
</v-data-table>
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
<div style="width: 100%" class="d-flex justify-end">
|
||||
<template
|
||||
v-if="selectedItems.length > 0 &&
|
||||
selectedItems.every(item => item.rioStatus === 'Send Request')"
|
||||
>
|
||||
<v-btn
|
||||
color="red"
|
||||
outline
|
||||
dark
|
||||
style="max-width: 200px"
|
||||
class="ml-5"
|
||||
:disabled="!listRequest.length"
|
||||
@click="openRejected(selectedItems)
|
||||
"
|
||||
>
|
||||
Reject
|
||||
</v-btn>
|
||||
</template>
|
||||
<template
|
||||
v-if="selectedItems.length == 0 ? false : true"
|
||||
>
|
||||
<v-btn
|
||||
color="primary"
|
||||
dark
|
||||
style="max-width: 200px"
|
||||
class="ml-2"
|
||||
:disabled="!listRequest.length"
|
||||
@click="openApprove(selectedItems)
|
||||
"
|
||||
>
|
||||
Approve
|
||||
</v-btn>
|
||||
</template>
|
||||
</div>
|
||||
<v-divider></v-divider>
|
||||
<v-pagination
|
||||
style="margin-top: 10px; margin-bottom: 10px"
|
||||
v-model="currentPage"
|
||||
:length="totalPage"
|
||||
></v-pagination>
|
||||
</v-card>
|
||||
|
||||
<template>
|
||||
<one-dialog-info :status="opendialoginfo" :msg="msginfo"
|
||||
@close-dialog-info="opendialoginfo = false"></one-dialog-info>
|
||||
</template>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.date-type-table {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.5rem;
|
||||
}
|
||||
|
||||
.table.v-table tbody td,
|
||||
table.v-table tbody th {
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
.table.v-table thead tr {
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
.scroll-container {
|
||||
scroll-padding: 50px 0 0 50px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
module.exports = {
|
||||
components: {
|
||||
"add-item-out-dialog": httpVueLoader(
|
||||
"./addItemOutDialog.vue"
|
||||
),
|
||||
"add-item-detail-dialog": httpVueLoader("./addItemDetailDialog.vue"),
|
||||
"one-dialog-alert": httpVueLoader("../../common/oneDialogAlert.vue"),
|
||||
"one-dialog-error": httpVueLoader("../../common/oneDialogError.vue"),
|
||||
"one-dialog-info": httpVueLoader("../../common/oneDialogInfo.vue"),
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
msgAlertDeleteRequest: "",
|
||||
dialogAlertDeleteRequest: false,
|
||||
dialogAlertDeleteDetail: false,
|
||||
xDescription: "",
|
||||
headers: [
|
||||
{
|
||||
text: "NO RIO",
|
||||
align: "center",
|
||||
sortable: false,
|
||||
value: "no",
|
||||
width: "15%",
|
||||
class: "blue lighten-3 white--text",
|
||||
},
|
||||
{
|
||||
text: "ITEM",
|
||||
align: "left",
|
||||
sortable: false,
|
||||
value: "date",
|
||||
width: "35%",
|
||||
class: "blue lighten-3 white--text",
|
||||
},
|
||||
{
|
||||
text: "STOCK",
|
||||
align: "left",
|
||||
sortable: false,
|
||||
value: "warehouse",
|
||||
width: "10%",
|
||||
class: "blue lighten-3 white--text",
|
||||
},
|
||||
{
|
||||
text: "REQUEST QTY",
|
||||
align: "left",
|
||||
sortable: false,
|
||||
value: "departement",
|
||||
width: "10%",
|
||||
class: "blue lighten-3 white--text",
|
||||
},
|
||||
{
|
||||
text: "STATUS",
|
||||
align: "left",
|
||||
sortable: false,
|
||||
value: "status",
|
||||
width: "15%",
|
||||
class: "blue lighten-3 white--text",
|
||||
},
|
||||
]
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
this.$store.dispatch("listrequest/listrequestitem");
|
||||
this.$store.dispatch("listrequest/getDivisionUser");
|
||||
},
|
||||
computed: {
|
||||
listRequest() {
|
||||
return this.$store.state.listrequest.request;
|
||||
},
|
||||
loadingStatus() {
|
||||
return this.$store.state.listrequest.loadingStatus === 1;
|
||||
},
|
||||
totalPage: {
|
||||
get() {
|
||||
return this.$store.state.listrequest.totalPage;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("listrequest/update_totalPage", val);
|
||||
},
|
||||
},
|
||||
currentPage: {
|
||||
get() {
|
||||
return this.$store.state.listrequest.currentPage;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("listrequest/update_currentPage", val);
|
||||
this.$store.commit("listrequest/update_lastId", -1);
|
||||
this.$store.dispatch("listrequest/listrequestitem");
|
||||
},
|
||||
},
|
||||
menuStartDate: {
|
||||
get() {
|
||||
return this.$store.state.listrequest.menuStartDate;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("listrequest/update_menuStartDate", val);
|
||||
},
|
||||
},
|
||||
menuEndDate: {
|
||||
get() {
|
||||
return this.$store.state.listrequest.menuEndDate;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("listrequest/update_menuEndDate", val);
|
||||
},
|
||||
},
|
||||
startDateFormatted() {
|
||||
return this.formatDate(this.fStartDate);
|
||||
},
|
||||
endDateFormatted() {
|
||||
return this.formatDate(this.fEndDate);
|
||||
},
|
||||
dStartDate: {
|
||||
get() {
|
||||
return this.$store.state.listrequest.dStartDate;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("listrequest/update_dStartDate", val);
|
||||
},
|
||||
},
|
||||
dEndDate: {
|
||||
get() {
|
||||
return this.$store.state.listrequest.dEndDate;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("listrequest/update_dEndDate", val);
|
||||
},
|
||||
},
|
||||
fStartDate: {
|
||||
get() {
|
||||
return this.$store.state.listrequest.fStartDate;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("listrequest/update_fStartDate", val);
|
||||
},
|
||||
},
|
||||
fEndDate: {
|
||||
get() {
|
||||
return this.$store.state.listrequest.fEndDate;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("listrequest/update_fEndDate", val);
|
||||
},
|
||||
},
|
||||
fStatus: {
|
||||
get() {
|
||||
return this.$store.state.listrequest.fStatus;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("listrequest/update_fStatus", val);
|
||||
},
|
||||
},
|
||||
statusOptions() {
|
||||
return this.$store.state.listrequest.statusOptions;
|
||||
},
|
||||
fSearch: {
|
||||
get() {
|
||||
return this.$store.state.listrequest.fSearch;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("listrequest/update_fSearch", val);
|
||||
},
|
||||
},
|
||||
selectedRequest: {
|
||||
get() {
|
||||
return this.$store.state.listrequest.selectedRequest;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("listrequest/update_selectedRequest", val);
|
||||
},
|
||||
},
|
||||
selectedItems: {
|
||||
get() {
|
||||
return this.$store.state.listrequest.selectedItems;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("listrequest/update_selectedItems", val);
|
||||
},
|
||||
},
|
||||
opendialoginfo: {
|
||||
get() {
|
||||
return this.$store.state.listrequest.opendialoginfo;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("listrequest/update_opendialoginfo", val);
|
||||
},
|
||||
},
|
||||
msginfo: {
|
||||
get() {
|
||||
return this.$store.state.listrequest.msginfo;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("listrequest/update_msginfo", val);
|
||||
},
|
||||
},
|
||||
snackbar: {
|
||||
get() {
|
||||
return this.$store.state.listrequest.snackbar;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("listrequest/update_snackbar", val);
|
||||
},
|
||||
},
|
||||
dialogapprove: {
|
||||
get() {
|
||||
return this.$store.state.listrequest.dialogapprove;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("listrequest/update_dialogapprove", val);
|
||||
},
|
||||
},
|
||||
msgapprove: {
|
||||
get() {
|
||||
return this.$store.state.listrequest.msgapprove;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("listrequest/update_msgapprove", val);
|
||||
},
|
||||
},
|
||||
dialogreject: {
|
||||
get() {
|
||||
return this.$store.state.listrequest.dialogreject;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("listrequest/update_dialogreject", val);
|
||||
},
|
||||
},
|
||||
msgreject: {
|
||||
get() {
|
||||
return this.$store.state.listrequest.msgreject;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("listrequest/update_msgreject", val);
|
||||
},
|
||||
},
|
||||
approveDivisionUserID: {
|
||||
get() {
|
||||
return this.$store.state.listrequest.approveDivisionUserID;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("listrequest/updateApproveDivisionUserID", val);
|
||||
},
|
||||
},
|
||||
approveDivision: {
|
||||
get() {
|
||||
return this.$store.state.listrequest.approveDivision;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("listrequest/updateApproveDivision", val);
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
isSelected(p) {
|
||||
return (
|
||||
p.rioDID ==
|
||||
this.$store.state.listrequest.selectedRequest
|
||||
.rioDID
|
||||
);
|
||||
},
|
||||
selectMe(spr) {
|
||||
this.$store.commit("listrequest/update_selectedRequest", spr);
|
||||
},
|
||||
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 "Send Request":
|
||||
return "warning";
|
||||
case "Process":
|
||||
return "success";
|
||||
case "Rejected":
|
||||
return "error";
|
||||
case "Completed":
|
||||
return "info";
|
||||
default:
|
||||
return "";
|
||||
}
|
||||
},
|
||||
listSearch() {
|
||||
this.$store.dispatch("listrequest/listrequestitem");
|
||||
this.$store.commit("listrequest/update_selectedRequest", {});
|
||||
},
|
||||
requestExist(request) {
|
||||
var selectedItems = this.selectedItems;
|
||||
var idx = _.findIndex(selectedItems, function (o) {
|
||||
return parseInt(o.rioDID) === parseInt(request.rioDID);
|
||||
});
|
||||
if (idx === -1) {
|
||||
return true;
|
||||
} else {
|
||||
return false;
|
||||
}
|
||||
},
|
||||
checkItemAll() {
|
||||
// Salin selectedItems ke dalam array baru
|
||||
let raw = JSON.stringify(this.selectedItems);
|
||||
let arr = [...JSON.parse(raw)];
|
||||
|
||||
// Cek apakah checkbox utama (select all) sedang dicentang
|
||||
let ckAll = this.headerCheckboxValueAll();
|
||||
|
||||
// Iterasi semua item yang tersedia
|
||||
for (let i = 0; i < this.listRequest.length; i++) {
|
||||
const element = this.listRequest[i];
|
||||
|
||||
// Hanya proses item dengan status 'Send Request'
|
||||
if (element.rioStatus !== 'Send Request') continue;
|
||||
|
||||
let foundItem = arr.find((e) => e.rioDID === element.rioDID);
|
||||
const index = arr.findIndex((e) => e.rioDID === element.rioDID);
|
||||
|
||||
if (ckAll) {
|
||||
// Hapus item dari selected jika sesuai kondisi
|
||||
arr.splice(index, 1);
|
||||
} else {
|
||||
// Tambahkan item ke selected jika sesuai kondisi dan belum ada
|
||||
if (!foundItem) {
|
||||
arr.push(element);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Update pilihan
|
||||
this.selectedItems = arr;
|
||||
console.log('arr', arr)
|
||||
},
|
||||
headerCheckboxValueAll() {
|
||||
// debugger;
|
||||
let total = 0;
|
||||
let selected = 0;
|
||||
for (let i = 0; i < this.listRequest.length; i++) {
|
||||
const element = this.listRequest[i];
|
||||
|
||||
if (element.rioStatus !== 'Send Request') continue;
|
||||
|
||||
total++;
|
||||
let foundItem = this.selectedItems.find(
|
||||
(e) => e.rioDID === element.rioDID
|
||||
);
|
||||
if (foundItem) {
|
||||
selected++;
|
||||
}
|
||||
}
|
||||
return total > 0 && selected === total;
|
||||
},
|
||||
headerCheckboxValuePartial() {
|
||||
let total = 0;
|
||||
let selected = 0;
|
||||
for (let i = 0; i < this.listRequest.length; i++) {
|
||||
const element = this.listRequest[i];
|
||||
|
||||
if (element.rioStatus !== 'Send Request') continue;
|
||||
|
||||
total++;
|
||||
let foundItem = this.selectedItems.find(
|
||||
(e) => e.rioDID === element.rioDID
|
||||
);
|
||||
if (foundItem) {
|
||||
selected++;
|
||||
}
|
||||
}
|
||||
return selected > 0 && selected < total;
|
||||
},
|
||||
changeCheckBox(val) {
|
||||
// debugger;
|
||||
let raw = JSON.stringify(this.selectedItems);
|
||||
|
||||
let arr = [...JSON.parse(raw)];
|
||||
if (arr.length == 0) {
|
||||
arr.push(val);
|
||||
} else {
|
||||
let foundItem = arr.find((e) => e.rioDID === val.rioDID);
|
||||
const index = arr.findIndex((e) => e.rioDID === val.rioDID);
|
||||
if (foundItem) {
|
||||
arr.splice(index, 1);
|
||||
} else {
|
||||
arr.push(val);
|
||||
}
|
||||
}
|
||||
this.selectedItems = arr;
|
||||
},
|
||||
checkBoxValue(val) {
|
||||
let foundItem = this.selectedItems.find((e) => e.rioDID === val.rioDID);
|
||||
if (foundItem) {
|
||||
return true;
|
||||
} else {
|
||||
return false;
|
||||
}
|
||||
},
|
||||
addRequest(request) {
|
||||
if (!request.StockID) {
|
||||
let msge = "Item belum ada di stock";
|
||||
this.msginfo = msge;
|
||||
this.opendialoginfo = true;
|
||||
return;
|
||||
}
|
||||
|
||||
if (!request.StockQty || request.StockQty === 0 || request.StockQty == "0") {
|
||||
let msgg = "Item tidak bisa dikeluarkan karena stock kosong";
|
||||
this.msginfo = msgg;
|
||||
this.opendialoginfo = true;
|
||||
return;
|
||||
}
|
||||
|
||||
const exists = this.selectedItems.some(item => item.rioDID === request.rioDID);
|
||||
console.log('exists', exists)
|
||||
if (!exists) {
|
||||
this.selectedItems.push(request);
|
||||
// console.log("add request", this.selectedItems);
|
||||
}
|
||||
},
|
||||
removeRequest(request) {
|
||||
let selectedItems = this.selectedItems;
|
||||
let idx = _.findIndex(selectedItems, function (o) {
|
||||
return parseInt(o.rioDID) === parseInt(request.rioDID);
|
||||
});
|
||||
selectedItems.splice(idx, 1);
|
||||
console.log("hapus request", this.selectedItems)
|
||||
},
|
||||
openApprove(request) {
|
||||
if (request.some(item => item.rioDivisionID !== this.approveDivisionUserID)) {
|
||||
this.msginfo = "Tidak bisa approve, Anda login manager tapi tidak sesuai divisi";
|
||||
this.opendialoginfo = true;
|
||||
return;
|
||||
}
|
||||
|
||||
|
||||
// Cek jika ada item yang belum punya StockID
|
||||
const noStockID = request.find(item => !item.StockID);
|
||||
// gabung number
|
||||
const allRioNumbers = request.map(item => item.rioNumber).join(', ');
|
||||
if (noStockID) {
|
||||
this.msginfo = "Item belum ada di stock " + "(" + allRioNumbers + ")";
|
||||
this.opendialoginfo = true;
|
||||
return;
|
||||
}
|
||||
|
||||
// Cek jika ada item dengan stock kosong atau 0
|
||||
const stockKosong = request.find(item => !item.StockQty || item.StockQty === 0 || item.StockQty === "0");
|
||||
if (stockKosong) {
|
||||
this.msginfo = "Item tidak bisa dikeluarkan karena stock kosong " + "(" + allRioNumbers + ")";
|
||||
this.opendialoginfo = true;
|
||||
return;
|
||||
}
|
||||
|
||||
let msg = "Yakin, mau approve ?";
|
||||
this.msgapprove = msg;
|
||||
this.dialogapprove = true;
|
||||
|
||||
},
|
||||
orderApprove() {
|
||||
let prm = {
|
||||
arrRequest: this.selectedItems
|
||||
}
|
||||
this.$store.dispatch("listrequest/approveRequest", prm);
|
||||
},
|
||||
openRejected(request) {
|
||||
let msg = "Yakin, mau reject ?";
|
||||
this.msgreject = msg;
|
||||
this.dialogreject = true;
|
||||
},
|
||||
orderRejected() {
|
||||
let prm = {
|
||||
arrRequest: this.selectedItems
|
||||
}
|
||||
this.$store.dispatch("listrequest/rejectedRequest", prm);
|
||||
}
|
||||
},
|
||||
|
||||
watch: {
|
||||
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
956
test/vuex/acc-one-item-out-v3/components/requestListing.vue
Normal file
956
test/vuex/acc-one-item-out-v3/components/requestListing.vue
Normal file
@@ -0,0 +1,956 @@
|
||||
<template>
|
||||
<div style="width: 100%">
|
||||
<!-- SNACKBAR -->
|
||||
<v-snackbar
|
||||
v-model="snackbar"
|
||||
:timeout="5000"
|
||||
:multi-line="false"
|
||||
:vertical="false"
|
||||
:top="true"
|
||||
>
|
||||
{{ msgSnackbar }}
|
||||
<v-btn flat @click="updateAlertSuccess(false)"> Tutup </v-btn>
|
||||
</v-snackbar>
|
||||
|
||||
<!-- ERROR DIALOG -->
|
||||
<v-dialog v-model="dialog_error" max-width="500px">
|
||||
<v-card>
|
||||
<v-card-title>
|
||||
<span>ERROR !</span>
|
||||
<v-spacer></v-spacer>
|
||||
</v-card-title>
|
||||
<v-divider></v-divider>
|
||||
<div class="ma-3 red--text">{{ msgError }}</div>
|
||||
<v-divider></v-divider>
|
||||
<v-card-actions>
|
||||
<v-spacer></v-spacer>
|
||||
<v-btn color="primary" flat @click="dialog_error = false"
|
||||
>Tutup</v-btn
|
||||
>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
<!-- END ERROR DIALOG -->
|
||||
|
||||
<!-- ERROR DIALOG -->
|
||||
<v-dialog v-model="dialogerrordata" max-width="500px">
|
||||
<v-card>
|
||||
<v-card-title>
|
||||
<span>ERROR !</span>
|
||||
<v-spacer></v-spacer>
|
||||
</v-card-title>
|
||||
<v-divider></v-divider>
|
||||
<div class="ma-3 red--text">{{ msgErrors }}</div>
|
||||
<v-divider></v-divider>
|
||||
<v-card-actions>
|
||||
<v-spacer></v-spacer>
|
||||
<v-btn color="primary" flat @click="dialogerrordata = false"
|
||||
>Tutup</v-btn
|
||||
>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
<!-- END ERROR DIALOG -->
|
||||
|
||||
|
||||
|
||||
<v-toolbar color="primary" dark>
|
||||
<v-toolbar-title class="white--text"
|
||||
>TRANSAKSI PENGELUARAN BARANG</v-toolbar-title
|
||||
>
|
||||
<v-spacer></v-spacer>
|
||||
<v-btn icon @click="openDialogRequest()">
|
||||
<v-icon>add_box</v-icon>
|
||||
</v-btn>
|
||||
</v-toolbar>
|
||||
<v-card class="pa-2">
|
||||
<v-layout row wrap class="px-2 py-2">
|
||||
<v-flex xs3>
|
||||
<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
|
||||
v-model="startDateFormatted"
|
||||
label="Tanggal Awal"
|
||||
class="mr-2"
|
||||
readonly
|
||||
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-flex>
|
||||
<v-flex xs3>
|
||||
<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
|
||||
v-model="endDateFormatted"
|
||||
label="Tanggal Akhir"
|
||||
class="mr-2"
|
||||
readonly
|
||||
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-flex>
|
||||
<v-flex xs2>
|
||||
<v-autocomplete
|
||||
v-model="fStatus"
|
||||
menu-icon="mdi-chevron-down"
|
||||
:items="statusOptions"
|
||||
item-text="title"
|
||||
return-object
|
||||
label="Status"
|
||||
class="mr-2"
|
||||
outline
|
||||
hide-details
|
||||
></v-autocomplete>
|
||||
</v-flex>
|
||||
<v-flex xs2>
|
||||
<v-text-field
|
||||
v-model="fSearch"
|
||||
label="Cari..."
|
||||
placeholder="NO."
|
||||
class="mr-2"
|
||||
outline
|
||||
hide-details
|
||||
></v-text-field>
|
||||
</v-flex>
|
||||
<v-btn
|
||||
dark
|
||||
color="primary"
|
||||
style="min-width: 50px; height: 50px; margin: 0"
|
||||
@click="mainTableSearch()"
|
||||
>
|
||||
<v-icon>search</v-icon>
|
||||
</v-btn>
|
||||
</v-layout>
|
||||
</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) }"
|
||||
@click="selectMe(props.item)"
|
||||
>
|
||||
<div
|
||||
style="
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
"
|
||||
>
|
||||
<p class="mb-0 font-weight-bold" style="color:#000000">{{ props.item.T_ItemOutNumber }}</p>
|
||||
</div>
|
||||
</td>
|
||||
<td
|
||||
class="text-xs-left pa-2"
|
||||
v-bind:class="{ 'amber lighten-4': isSelected(props.item) }"
|
||||
@click="selectMe(props.item)"
|
||||
>
|
||||
{{ deFormatedDate(props.item.T_ItemOutDate) }}
|
||||
</td>
|
||||
<td
|
||||
class="text-xs-left pa-2"
|
||||
v-bind:class="{ 'amber lighten-4': isSelected(props.item) }"
|
||||
@click="selectMe(props.item)"
|
||||
>
|
||||
{{ props.item.T_ItemOutNote }}
|
||||
</td>
|
||||
<td
|
||||
class="text-xs-left pa-2"
|
||||
v-bind:class="{ 'amber lighten-4': isSelected(props.item) }"
|
||||
@click="selectMe(props.item)"
|
||||
>
|
||||
{{ props.item.DivisionName }}
|
||||
</td>
|
||||
<td
|
||||
class="text-xs-left pa-2"
|
||||
v-bind:class="{ 'amber lighten-4': isSelected(props.item) }"
|
||||
@click="selectMe(props.item)"
|
||||
>
|
||||
<v-chip
|
||||
small
|
||||
:text-color="
|
||||
props.item.T_ItemOutStatus === 'Draft'
|
||||
? 'black'
|
||||
: 'white'
|
||||
"
|
||||
:color="
|
||||
getChipStatusColor(
|
||||
props.item.T_ItemOutStatus
|
||||
)
|
||||
"
|
||||
>
|
||||
{{ props.item.T_ItemOutStatus }}
|
||||
</v-chip>
|
||||
</td>
|
||||
<td
|
||||
class="text-xs-center pa-2"
|
||||
v-bind:class="{
|
||||
'amber lighten-4': isSelected(props.item),
|
||||
}"
|
||||
@click="selectMe(props.item)"
|
||||
>
|
||||
<span v-if="props.item.T_ItemOutStatus == 'Draft'">
|
||||
|
||||
<v-btn
|
||||
:disabled="mainTableLoading || approveLevelID == '2' || props.item.T_ItemOutApproveID != null"
|
||||
v-if="props.item.T_ItemOutIsConfirm == 'Y'"
|
||||
round depressed color="primary" small :outline="props.item.T_ItemOutApproveID == null"
|
||||
@click="openApprove(props.item, )"
|
||||
>
|
||||
Approve (Manager)
|
||||
</v-btn>
|
||||
|
||||
<v-btn
|
||||
style="min-width: 25px; height: 25px; margin: 0;"
|
||||
v-if="props.item.T_ItemOutApproveID != null && approveLevelID == '2'"
|
||||
small
|
||||
color="blue" title="Proses transaksi"
|
||||
@click="openProcess(props.item)"
|
||||
>
|
||||
<v-icon small color="white">check_circle</v-icon>
|
||||
</v-btn>
|
||||
|
||||
<v-btn
|
||||
v-if="props.item.T_ItemOutIsConfirm == 'N' && approveLevelID == '2' && props.item.T_ItemOutApproveID == null"
|
||||
style="min-width: 25px; height: 25px; margin: 0;"
|
||||
small
|
||||
color="primary" title="Konfirmasi"
|
||||
@click="openConfirm(props.item)"
|
||||
>
|
||||
<v-icon small color="white">check_circle_outline</v-icon>
|
||||
</v-btn>
|
||||
<!-- <v-btn
|
||||
v-if="props.item.T_ItemOutIsConfirm == 'N' && approveLevelID == '2' && props.item.T_ItemOutApproveID == null"
|
||||
style="min-width: 25px; height: 25px; margin: 0;"
|
||||
small
|
||||
color="black" title="Edit"
|
||||
@click="updateRequest(props.item)"
|
||||
>
|
||||
<v-icon small color="white">edit</v-icon>
|
||||
</v-btn>
|
||||
<v-btn
|
||||
v-if="props.item.T_ItemOutIsConfirm == 'N' && approveLevelID == '2' && props.item.T_ItemOutApproveID == null"
|
||||
style="min-width: 25px; height: 25px; margin: 0;"
|
||||
small
|
||||
color="red" title="Hapus"
|
||||
@click="deleteRequest(props.item)"
|
||||
>
|
||||
<v-icon small color="white">delete</v-icon>
|
||||
</v-btn> -->
|
||||
</span>
|
||||
<span v-if="props.item.T_ItemOutStatus == 'Process' || props.item.T_ItemOutStatus == 'Rejected'">
|
||||
<v-btn
|
||||
style="min-width: 25px; height: 25px; margin: 0;"
|
||||
small
|
||||
color="green" title="Preview"
|
||||
@click="openPreview(props.item)"
|
||||
>
|
||||
<v-icon small color="white">receipt</v-icon>
|
||||
</v-btn>
|
||||
</span>
|
||||
</td>
|
||||
</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-dialog v-model="dialogAlertDeleteRequest" max-width="30%">
|
||||
<v-card>
|
||||
<v-card-title class="headline grey lighten-2 pt-2 pb-2" primary-title>
|
||||
Peringatan !
|
||||
</v-card-title>
|
||||
<v-card-text class="pt-2 pb-2">
|
||||
<v-layout row>
|
||||
<v-flex xs12 d-flex>
|
||||
<v-layout row>
|
||||
<v-flex pb-1 xs12>
|
||||
<v-layout row>
|
||||
<v-flex pt-2 pr-2 xs12>
|
||||
{{ msgAlertDeleteRequest }}
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
</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="primary" flat @click="dialogAlertDeleteRequest = false">
|
||||
Tutup
|
||||
</v-btn>
|
||||
<v-btn color="primary" flat @click="closeAndDeleteRequest()">
|
||||
Yakin lah
|
||||
</v-btn>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
|
||||
<v-dialog v-model="dialogAlertDeleteDetail" max-width="30%">
|
||||
<v-card>
|
||||
<v-card-title class="headline grey lighten-2 pt-2 pb-2" primary-title>
|
||||
Peringatan !
|
||||
</v-card-title>
|
||||
<v-card-text class="pt-2 pb-2">
|
||||
<v-layout row>
|
||||
<v-flex xs12 d-flex>
|
||||
<v-layout row>
|
||||
<v-flex pb-1 xs12>
|
||||
<v-layout row>
|
||||
<v-flex pt-2 pr-2 xs12>
|
||||
{{ msgAlertDeleteRequest }}
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
</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="primary" flat @click="dialogAlertDeleteDetail = false">
|
||||
Tutup
|
||||
</v-btn>
|
||||
<v-btn color="primary" flat @click="closeAndDeleteDetail()">
|
||||
Yakin lah
|
||||
</v-btn>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
|
||||
<add-item-out-dialog></add-item-out-dialog>
|
||||
<add-item-detail-dialog></add-item-detail-dialog>
|
||||
<dialog-item-approve></dialog-item-approve>
|
||||
<dialog-item-process></dialog-item-process>
|
||||
<dialog-item-preview></dialog-item-preview>
|
||||
<dialog-item-confirm></dialog-item-confirm>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.date-type-table {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.5rem;
|
||||
}
|
||||
|
||||
.table.v-table tbody td,
|
||||
table.v-table tbody th {
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
.table.v-table thead tr {
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
.scroll-container {
|
||||
scroll-padding: 50px 0 0 50px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
module.exports = {
|
||||
components: {
|
||||
"add-item-out-dialog": httpVueLoader(
|
||||
"./addItemOutDialog.vue"
|
||||
),
|
||||
"add-item-detail-dialog": httpVueLoader("./addItemDetailDialog.vue"),
|
||||
"dialog-item-approve": httpVueLoader("./dialogItemApprove.vue"),
|
||||
"dialog-item-process": httpVueLoader("./dialogItemProcess.vue"),
|
||||
"dialog-item-preview": httpVueLoader("./dialogItemPreview.vue"),
|
||||
"dialog-item-confirm": httpVueLoader("./dialogItemConfirm.vue"),
|
||||
"one-dialog-alert": httpVueLoader("../../common/oneDialogAlert.vue"),
|
||||
"one-dialog-error": httpVueLoader("../../common/oneDialogError.vue"),
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
msgAlertDeleteRequest: "",
|
||||
dialogAlertDeleteRequest: false,
|
||||
dialogAlertDeleteDetail: false,
|
||||
xDescription: "",
|
||||
xRIOID: 0,
|
||||
xRIODID: 0,
|
||||
headers: [
|
||||
{
|
||||
text: "NO",
|
||||
align: "center",
|
||||
sortable: false,
|
||||
value: "no",
|
||||
width: "15%",
|
||||
class: "blue lighten-3 white--text",
|
||||
},
|
||||
{
|
||||
text: "TANGGAL",
|
||||
align: "left",
|
||||
sortable: false,
|
||||
value: "date",
|
||||
width: "15%",
|
||||
class: "blue lighten-3 white--text",
|
||||
},
|
||||
{
|
||||
text: "CATATAN",
|
||||
align: "left",
|
||||
sortable: false,
|
||||
value: "warehouse",
|
||||
width: "25%",
|
||||
class: "blue lighten-3 white--text",
|
||||
},
|
||||
{
|
||||
text: "DIVISI",
|
||||
align: "left",
|
||||
sortable: false,
|
||||
value: "warehouse",
|
||||
width: "15%",
|
||||
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: "center",
|
||||
sortable: false,
|
||||
value: "action",
|
||||
width: "15%",
|
||||
class: "blue lighten-3 white--text",
|
||||
},
|
||||
],
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
this.$store.dispatch("requester/getlevel");
|
||||
this.$store.dispatch("requester/search");
|
||||
},
|
||||
computed: {
|
||||
msgSnackbar() {
|
||||
return this.$store.state.requester.successMessage;
|
||||
},
|
||||
snackbar: {
|
||||
get() {
|
||||
return this.$store.state.requester.alertSuccess;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateAlertSuccess", val);
|
||||
},
|
||||
},
|
||||
dialog_error: {
|
||||
get() {
|
||||
return this.$store.state.requester.alertError;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateAlertError", val);
|
||||
},
|
||||
},
|
||||
dialogerrordata: {
|
||||
get() {
|
||||
return this.$store.state.requester.dialogErrors;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateDialogErrors", val);
|
||||
},
|
||||
},
|
||||
msgError() {
|
||||
return this.$store.state.requester.errMessage;
|
||||
},
|
||||
msgErrors() {
|
||||
return this.$store.state.requester.errors;
|
||||
},
|
||||
mainTable() {
|
||||
return this.$store.state.requester.mainTable;
|
||||
},
|
||||
detailTable() {
|
||||
return this.$store.state.requester.detailTable;
|
||||
},
|
||||
mainTableLoading() {
|
||||
return this.$store.state.requester.mainTableLoadingStatus === 1;
|
||||
},
|
||||
detailTableLoading() {
|
||||
return this.$store.state.requester.detailTableLoadingStatus === 1;
|
||||
},
|
||||
mainTableTotalPage: {
|
||||
get() {
|
||||
return this.$store.state.requester.countMainTable;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateCountMainTable", val);
|
||||
},
|
||||
},
|
||||
mainTableCurrentPage: {
|
||||
get() {
|
||||
return this.$store.state.requester.mainTableCurrentPage;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateMainTableCurrentPage", val);
|
||||
this.$store.commit("requester/updateMainTableLastId", -1);
|
||||
this.$store.dispatch("requester/search");
|
||||
},
|
||||
},
|
||||
selectedMainTable: {
|
||||
get() {
|
||||
return this.$store.state.requester.selectedMainTable;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("updateSelectedMainTable", val);
|
||||
},
|
||||
},
|
||||
menuStartDate: {
|
||||
get() {
|
||||
return this.$store.state.requester.menuStartDate;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateMenuStartDate", val);
|
||||
},
|
||||
},
|
||||
menuEndDate: {
|
||||
get() {
|
||||
return this.$store.state.requester.menuEndDate;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateMenuEndDate", val);
|
||||
},
|
||||
},
|
||||
startDateFormatted() {
|
||||
return this.formatDate(this.fStartDate);
|
||||
},
|
||||
endDateFormatted() {
|
||||
return this.formatDate(this.fEndDate);
|
||||
},
|
||||
dStartDate: {
|
||||
get() {
|
||||
return this.$store.state.requester.dStartDate;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateDStartDate", val);
|
||||
},
|
||||
},
|
||||
dEndDate: {
|
||||
get() {
|
||||
return this.$store.state.requester.dEndDate;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateDEndDate", val);
|
||||
},
|
||||
},
|
||||
fStartDate: {
|
||||
get() {
|
||||
return this.$store.state.requester.fStartDate;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateFStartDate", val);
|
||||
},
|
||||
},
|
||||
fEndDate: {
|
||||
get() {
|
||||
return this.$store.state.requester.fEndDate;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateFEndDate", val);
|
||||
},
|
||||
},
|
||||
fStatus: {
|
||||
get() {
|
||||
return this.$store.state.requester.fStatus;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateFStatus", val);
|
||||
},
|
||||
},
|
||||
statusOptions() {
|
||||
return this.$store.state.requester.statusOptions;
|
||||
},
|
||||
fSearch: {
|
||||
get() {
|
||||
return this.$store.state.requester.fSearch;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateFSearch", val);
|
||||
},
|
||||
},
|
||||
xNumber: {
|
||||
get() {
|
||||
return this.$store.state.requester.xNumber;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateXNumber", val);
|
||||
},
|
||||
},
|
||||
xIOID: {
|
||||
get() {
|
||||
return this.$store.state.requester.xIOID;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateXIOID", val);
|
||||
},
|
||||
},
|
||||
xIODID: {
|
||||
get() {
|
||||
return this.$store.state.requester.xIODID;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateXIODID", val);
|
||||
},
|
||||
},
|
||||
xDescriptionDetail() {
|
||||
return this.$store.state.requester.xDescriptionDetail;
|
||||
},
|
||||
selectedItems: {
|
||||
get() {
|
||||
return this.$store.state.requester.selectedItems;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateSelectedItems", val);
|
||||
}
|
||||
},
|
||||
approveLevelID: {
|
||||
get() {
|
||||
return this.$store.state.requester.approveLevelID;
|
||||
},
|
||||
set(val) {
|
||||
this.$store.commit("requester/updateApproveLevelID", val);
|
||||
},
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
convertMoney(money){
|
||||
return one_money(money)
|
||||
},
|
||||
isSelected(p) {
|
||||
return (
|
||||
p.T_ItemOutID ==
|
||||
this.$store.state.requester.selectedMainTable.T_ItemOutID
|
||||
);
|
||||
},
|
||||
selectMe(spr) {
|
||||
this.$store.commit("requester/updateSelectedMainTable", spr);
|
||||
},
|
||||
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 "Process":
|
||||
return "success";
|
||||
case "Rejected":
|
||||
return "error";
|
||||
default:
|
||||
return "";
|
||||
}
|
||||
},
|
||||
getChipStatusDetailColor(status) {
|
||||
switch (status) {
|
||||
case "Pending":
|
||||
return "warning";
|
||||
case "Process":
|
||||
return "success";
|
||||
case "Read":
|
||||
return "info";
|
||||
case "Process":
|
||||
return "warning";
|
||||
default:
|
||||
return "";
|
||||
}
|
||||
},
|
||||
mainTableSearch() {
|
||||
this.$store.dispatch("requester/search");
|
||||
this.$store.commit("requester/updateSelectedMainTable", {});
|
||||
this.$store.commit("requester/updateDetailTable", []);
|
||||
},
|
||||
resetItemTable() {
|
||||
this.$store.commit("requester/updateSelectedItems", []);
|
||||
this.$store.commit("requester/updateItems", []);
|
||||
this.$store.commit("requester/updateSearchItem", "");
|
||||
this.$store.commit("requester/updateXWarehouse", "");
|
||||
this.$store.commit("requester/updateLoadingItem", false);
|
||||
},
|
||||
openDialogRequest() {
|
||||
this.resetItemTable()
|
||||
this.$store.dispatch("requester/getWarehouse").then(() => {
|
||||
const warehouseId = this.$store.state.requester.xWarehouse.WarehouseID;
|
||||
const divisonId = this.$store.state.requester.selectedDivision.DivisionID;
|
||||
this.$store.dispatch("requester/getItemRequest", {
|
||||
search: "",
|
||||
warehouseID: warehouseId,
|
||||
divisionID: divisonId
|
||||
});
|
||||
})
|
||||
this.$store.dispatch("requester/getDivisionByUser",{
|
||||
act: 'new',
|
||||
DivisionID: ''
|
||||
}).then(() => {
|
||||
const warehouseId = this.$store.state.requester.xWarehouse.WarehouseID;
|
||||
const divisonId = this.$store.state.requester.selectedDivision.DivisionID;
|
||||
this.$store.dispatch("requester/getItemRequest", {
|
||||
search: "",
|
||||
warehouseID: warehouseId,
|
||||
divisionID: divisonId
|
||||
});
|
||||
})
|
||||
this.$store.commit(
|
||||
"requester/updateXDateUse",
|
||||
moment(new Date()).format("YYYY-MM-DD")
|
||||
);
|
||||
this.$store.commit("requester/updateXNote", "");
|
||||
this.$store.commit("requester/updateAct", "new");
|
||||
this.$store.commit("requester/updateMainTableLastId", -1);
|
||||
this.$store.commit("requester/updateDialogRequest", true);
|
||||
},
|
||||
isbranch() {
|
||||
if (this.$store.state.requester.user.M_BranchID != 0) {
|
||||
return this.$store.state.requester.user.M_BranchCode
|
||||
} else {
|
||||
return ''
|
||||
}
|
||||
},
|
||||
updateRequest(val) {
|
||||
this.$store.dispatch("requester/getWarehouse").then(() => {
|
||||
const warehouseId = this.$store.state.requester.xWarehouse.WarehouseID;
|
||||
const divisonId = this.$store.state.requester.selectedDivision.DivisionID;
|
||||
this.$store.dispatch("requester/getItemRequest", {
|
||||
search: "",
|
||||
warehouseID: warehouseId,
|
||||
divisionID: divisonId
|
||||
});
|
||||
})
|
||||
this.$store.dispatch("requester/getDivisionByUser", {
|
||||
act: 'edit',
|
||||
DivisionID: val.DivisionID
|
||||
}).then(() => {
|
||||
const warehouseId = this.$store.state.requester.xWarehouse.WarehouseID;
|
||||
const divisonId = this.$store.state.requester.selectedDivision.DivisionID;
|
||||
this.$store.dispatch("requester/getItemRequest", {
|
||||
search: "",
|
||||
warehouseID: warehouseId,
|
||||
divisionID: divisonId
|
||||
});
|
||||
})
|
||||
this.$store.commit(
|
||||
"requester/updateXDateUse",
|
||||
val.T_ItemOutDate
|
||||
);
|
||||
this.$store.commit(
|
||||
"requester/updateXNote",
|
||||
val.T_ItemOutNote
|
||||
);
|
||||
this.$store.commit(
|
||||
"requester/updateXWarehouse",
|
||||
val.WarehouseID
|
||||
);
|
||||
this.$store.dispatch("requester/getDetailItemOut",{
|
||||
itemoutID: val.T_ItemOutID
|
||||
});
|
||||
|
||||
this.$store.commit("requester/updateXIOID", val.T_ItemOutID);
|
||||
this.$store.commit("requester/updateAct", "edit");
|
||||
this.$store.commit("requester/updateDialogRequest", true);
|
||||
},
|
||||
deleteRequest(data) {
|
||||
console.log(data);
|
||||
this.xIOID = data.T_ItemOutID;
|
||||
this.xNumber = data.T_ItemOutNumber;
|
||||
this.xRIOID = data.T_ItemOutDetailRequestItemOutID,
|
||||
this.xRIODID = data.T_ItemOutDetailRequestItemOutDetailID,
|
||||
|
||||
this.$store.dispatch("requester/getDetailItemOut",{
|
||||
itemoutID: data.T_ItemOutID
|
||||
});
|
||||
|
||||
this.msgAlertDeleteRequest = `Yakin, mau hapus pengeluaran barang dengan nomor [${data.T_ItemOutNumber}] ?`;
|
||||
this.dialogAlertDeleteRequest = true;
|
||||
},
|
||||
closeAndDeleteRequest() {
|
||||
this.$store.dispatch("requester/deleteRequest", {
|
||||
IOID: this.xIOID,
|
||||
Number: this.xNumber,
|
||||
RIOID: this.xRIOID,
|
||||
RIODID: this.xRIODID
|
||||
// items: this.selectedItems
|
||||
});
|
||||
this.dialogAlertDeleteRequest = false;
|
||||
},
|
||||
openDialogDetail() {
|
||||
this.$store.commit("requester/updateSelectedItem", {});
|
||||
this.$store.commit("requester/updateSelectedItemUnit", {});
|
||||
this.$store.commit("requester/updateItemUnits", [])
|
||||
this.$store.commit("requester/updateXQty", "");
|
||||
this.$store.commit("requester/updateXPrice", "");
|
||||
this.$store.commit("requester/updateXIsCito", false);
|
||||
this.$store.commit("requester/updateAct", "new");
|
||||
this.$store.commit("requester/updateDialogDetail", true);
|
||||
this.$store.commit("requester/updateErrorsform", [])
|
||||
this.$store.commit("requester/updateTempBatchNumber", {
|
||||
records: [],
|
||||
total: 0
|
||||
});
|
||||
},
|
||||
updateDetail(val) {
|
||||
this.$store.commit("requester/updateErrorsform", [])
|
||||
this.$store.commit(
|
||||
"requester/updateItemList", [{
|
||||
M_ItemID: val.M_ItemID,
|
||||
M_ItemDesc: val.M_ItemDesc
|
||||
}]);
|
||||
this.$store.commit(
|
||||
"requester/updateSelectedItem", {
|
||||
M_ItemID: val.M_ItemID,
|
||||
M_ItemDesc: val.M_ItemDesc
|
||||
});
|
||||
this.$store.commit(
|
||||
"requester/updateXQty",
|
||||
val.T_ItemOutDetailQty
|
||||
);
|
||||
this.$store.commit(
|
||||
"requester/updateItemUnits", [{
|
||||
ItemUnitID: val.ItemUnitID,
|
||||
ItemUnitName: val.ItemUnitName
|
||||
}]
|
||||
);
|
||||
this.$store.commit(
|
||||
"requester/updateSelectedItemUnit", {
|
||||
ItemUnitID: val.ItemUnitID,
|
||||
ItemUnitName: val.ItemUnitName
|
||||
}
|
||||
);
|
||||
this.$store.commit("requester/updateSelectedDetailTable", val);
|
||||
this.$store.commit("requester/updateAct", "edit");
|
||||
this.$store.commit("requester/updateDialogDetail", true);
|
||||
},
|
||||
deleteDetail(data) {
|
||||
this.xIODID = data.T_ItemOutDetailID;
|
||||
this.xDescription = data.M_ItemDesc;
|
||||
this.msgAlertDeleteRequest = `Yakin, mau hapus Request [${data.M_ItemDesc}] ?`;
|
||||
this.dialogAlertDeleteDetail = true;
|
||||
},
|
||||
closeAndDeleteDetail() {
|
||||
this.$store.dispatch("requester/deleteDetail", {
|
||||
IODID: this.xIODID,
|
||||
itemDescription: this.xDescription
|
||||
});
|
||||
this.dialogAlertDeleteDetail = false;
|
||||
},
|
||||
orderConfirm(id, status) {
|
||||
if (status === "Draft") {
|
||||
this.$store.dispatch("requester/orderConfirm", {
|
||||
itemoutID: id,
|
||||
});
|
||||
}
|
||||
},
|
||||
thrSearchDate: _.debounce(function () {
|
||||
this.$store.dispatch("requester/search")
|
||||
}, 1000),
|
||||
thrSearch: _.debounce(function () {
|
||||
this.$store.dispatch("requester/search")
|
||||
}, 1000),
|
||||
openConfirm(val) {
|
||||
this.$store.commit("requester/updateDialogConfirm", true);
|
||||
this.xIOID = val.T_ItemOutID;
|
||||
this.$store.dispatch("requester/getItemOuts", {
|
||||
ioID: val.T_ItemOutID
|
||||
});
|
||||
},
|
||||
openApprove(val) {
|
||||
this.$store.commit("requester/updateDialogApprove", true);
|
||||
this.xIOID = val.T_ItemOutID;
|
||||
this.$store.dispatch("requester/getItemOuts", {
|
||||
ioID: val.T_ItemOutID
|
||||
});
|
||||
},
|
||||
openProcess(val) {
|
||||
this.$store.commit("requester/updateDialogProcess", true);
|
||||
this.xIOID = val.T_ItemOutID;
|
||||
this.$store.dispatch("requester/getItemOuts", {
|
||||
ioID: val.T_ItemOutID
|
||||
});
|
||||
},
|
||||
openPreview(val) {
|
||||
this.$store.commit("requester/updateDialogPreview", true);
|
||||
this.xIOID = val.T_ItemOutID;
|
||||
this.$store.dispatch("requester/getItemOuts", {
|
||||
ioID: val.T_ItemOutID
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
watch: {
|
||||
// fStartDate(val, old) {
|
||||
// this.fStartDate = val
|
||||
// this.thrSearchDate()
|
||||
// },
|
||||
// fEndDate(val, old) {
|
||||
// this.fEndDate = val
|
||||
// this.thrSearchDate()
|
||||
// },
|
||||
// fSearch(val, old) {
|
||||
// this.fSearch = val
|
||||
// this.thrSearch()
|
||||
// }
|
||||
}
|
||||
};
|
||||
</script>
|
||||
71
test/vuex/acc-one-item-out-v3/index.php
Normal file
71
test/vuex/acc-one-item-out-v3/index.php
Normal file
@@ -0,0 +1,71 @@
|
||||
<!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 xs6 class="left" fill-height pa-1>
|
||||
<request-item-out-list></request-item-out-list>
|
||||
</v-flex> -->
|
||||
<v-flex xs12 class="center" fill-height pa-1>
|
||||
<request-listing></request-listing>
|
||||
</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-item-out-list': httpVueLoader('./components/requestItemOut.vue'),
|
||||
}
|
||||
})
|
||||
</script>
|
||||
<style>
|
||||
[v-cloak] {
|
||||
display: none
|
||||
}
|
||||
</style>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
266
test/vuex/acc-one-item-out-v3/modules/listrequest.js
Normal file
266
test/vuex/acc-one-item-out-v3/modules/listrequest.js
Normal file
@@ -0,0 +1,266 @@
|
||||
// 1 => LOADING
|
||||
// 2 => DONE
|
||||
// 3 => ERROR
|
||||
|
||||
import * as api from "../api/api-requester.js";
|
||||
|
||||
export default {
|
||||
namespaced: true,
|
||||
state: {
|
||||
request: [],
|
||||
selectedRequest: [],
|
||||
totalPage: 0,
|
||||
currentPage: 1,
|
||||
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"),
|
||||
menuStartDate: false,
|
||||
menuEndDate: false,
|
||||
|
||||
statusOptions: [
|
||||
{ value: '', title: "All" },
|
||||
{ value: 'Draft', title: "Draft" },
|
||||
{ value: 'Send Request', title: "Send Request" },
|
||||
{ value: 'Process', title: "Process" },
|
||||
{ value: 'Rejected', title: "Rejected" },
|
||||
{ value: 'Partial', title: "Partial" },
|
||||
{ value: 'Completed', title: "Completed" },
|
||||
],
|
||||
fStatus: {value: "", title: "All"},
|
||||
fSearch: "",
|
||||
lastId: -1,
|
||||
loadingStatus: 0,
|
||||
errorMessage: "",
|
||||
selectedItems: [],
|
||||
selectedItem: {},
|
||||
opendialoginfo: false,
|
||||
msginfo: "",
|
||||
loadingSave: false,
|
||||
errMessage: "",
|
||||
alertError: false,
|
||||
snackbar: {
|
||||
state: false,
|
||||
type: 'success',
|
||||
message: '',
|
||||
},
|
||||
dialogapprove: false,
|
||||
msgapprove: '',
|
||||
dialogreject: false,
|
||||
msgreject: '',
|
||||
approveDivisionUserID: 0,
|
||||
approveDivision: '',
|
||||
},
|
||||
mutations: {
|
||||
update_request(state, val) {
|
||||
state.request = val
|
||||
},
|
||||
update_selectedRequest(state, val) {
|
||||
state.selectedRequest = val
|
||||
},
|
||||
update_totalPage(state, val) {
|
||||
state.totalPage = val
|
||||
},
|
||||
update_currentPage(state, val) {
|
||||
state.currentPage = val
|
||||
},
|
||||
update_dStartDate(state, val) {
|
||||
state.dStartDate = val
|
||||
},
|
||||
update_dEndDate(state, val) {
|
||||
state.dEndDate = val
|
||||
},
|
||||
update_fStartDate(state, val) {
|
||||
state.fStartDate = val
|
||||
},
|
||||
update_fEndDate(state, val) {
|
||||
state.fEndDate = val
|
||||
},
|
||||
update_menuStartDate(state, val) {
|
||||
state.menuStartDate = val
|
||||
},
|
||||
update_menuEndDate(state, val) {
|
||||
state.menuEndDate = val
|
||||
},
|
||||
update_statusOptions(state, val) {
|
||||
state.statusOptions = val
|
||||
},
|
||||
update_fStatus(state, val) {
|
||||
state.fStatus = val
|
||||
},
|
||||
update_fSearch(state, val) {
|
||||
state.fSearch = val
|
||||
},
|
||||
update_lastId(state, val) {
|
||||
state.lastId = val
|
||||
},
|
||||
update_loadingStatus(state, val) {
|
||||
state.loadingStatus = val
|
||||
},
|
||||
update_errorMessage(state, val) {
|
||||
state.errorMessage = val
|
||||
},
|
||||
update_selectedItems(state, val) {
|
||||
state.selectedItems = val
|
||||
},
|
||||
update_selectedItem(state, val) {
|
||||
state.selectedItem = val
|
||||
},
|
||||
update_opendialoginfo(state, val) {
|
||||
state.opendialoginfo = val
|
||||
},
|
||||
update_msginfo(state, val) {
|
||||
state.msginfo = val
|
||||
},
|
||||
update_loadingSave(state, val) {
|
||||
state.loadingSave = val
|
||||
},
|
||||
update_errMessage(state, val) {
|
||||
state.errMessage = val
|
||||
},
|
||||
update_alertError(state, val) {
|
||||
state.alertError = val
|
||||
},
|
||||
update_snackbar(state, val) {
|
||||
state.snackbar = val
|
||||
},
|
||||
update_dialogapprove(state, val) {
|
||||
state.dialogapprove = val
|
||||
},
|
||||
update_msgapprove(state, val) {
|
||||
state.msgapprove = val
|
||||
},
|
||||
update_dialogreject(state, val) {
|
||||
state.dialogreject = val
|
||||
},
|
||||
update_msgreject(state, val) {
|
||||
state.msgreject = val
|
||||
},
|
||||
updateApproveDivisionUserID(state, val) {
|
||||
state.approveDivisionUserID = val;
|
||||
},
|
||||
updateApproveDivision(state, val) {
|
||||
state.approveDivision = val;
|
||||
}
|
||||
},
|
||||
actions: {
|
||||
async listrequestitem(context) {
|
||||
context.commit("update_loadingStatus", 1);
|
||||
|
||||
try {
|
||||
var prm = {
|
||||
token: one_token(),
|
||||
current_page: context.state.currentPage,
|
||||
startDate: context.state.fStartDate,
|
||||
endDate: context.state.fEndDate,
|
||||
status: context.state.fStatus.value,
|
||||
search: context.state.fSearch
|
||||
};
|
||||
|
||||
let response = await api.listrequestitem(prm);
|
||||
if (response.status != "OK") {
|
||||
context.commit("update_loadingStatus", 3);
|
||||
context.commit("update_errorMessage", response.message);
|
||||
} else {
|
||||
context.commit("update_loadingStatus", 2);
|
||||
context.commit("update_errorMessage", "");
|
||||
let data = {
|
||||
records: response.data.records,
|
||||
total: response.data.totalPage,
|
||||
};
|
||||
|
||||
context.commit("update_request", data.records);
|
||||
context.commit("update_totalPage", data.total);
|
||||
|
||||
}
|
||||
} catch (e) {
|
||||
context.commit("update_loadingStatus", 3);
|
||||
context.commit("update_errorMessage", e.message);
|
||||
}
|
||||
},
|
||||
async getDivisionUser(context) {
|
||||
|
||||
try {
|
||||
var payload = {
|
||||
token: one_token()
|
||||
};
|
||||
|
||||
let response = await api.getDivisionUser(payload);
|
||||
if (response.status != "OK") {
|
||||
context.commit("update_errorMessage", response.message);
|
||||
} else {
|
||||
context.commit("update_errorMessage", "");
|
||||
let data = {
|
||||
records: response.data.records,
|
||||
};
|
||||
|
||||
context.commit("updateApproveDivision", data.records[0].DivisionName);
|
||||
context.commit("updateApproveDivisionUserID", data.records[0].M_UserDivisionDivisionID);
|
||||
}
|
||||
} catch (e) {
|
||||
context.commit("update_errorMessage", e.message);
|
||||
}
|
||||
},
|
||||
async approveRequest(context, prm) {
|
||||
context.commit("update_loadingSave", true);
|
||||
try {
|
||||
prm.token = one_token();
|
||||
let response = await api.approveRequest(prm);
|
||||
if (response.status != "OK") {
|
||||
context.commit("update_loadingSave", false);
|
||||
context.commit("update_errMessage", response.message);
|
||||
context.commit("update_alertError", true);
|
||||
} else {
|
||||
context.commit("update_loadingSave", false);
|
||||
|
||||
context.commit("update_snackbar", {
|
||||
state: true,
|
||||
type: 'success',
|
||||
message: 'Request berhasil diapprove',
|
||||
})
|
||||
|
||||
context.commit("update_dialogapprove", false);
|
||||
context.commit("update_selectedItems", []);
|
||||
context.commit("update_selectedItem", {});
|
||||
context.dispatch("listrequestitem");
|
||||
}
|
||||
|
||||
} catch (e) {
|
||||
context.commit("update_loadingSave", false);
|
||||
context.commit("update_errMessage", e.message);
|
||||
context.commit("update_alertError", true);
|
||||
}
|
||||
},
|
||||
async rejectedRequest(context, prm) {
|
||||
context.commit("update_loadingSave", true);
|
||||
try {
|
||||
prm.token = one_token();
|
||||
let response = await api.rejectedRequest(prm);
|
||||
if (response.status != "OK") {
|
||||
context.commit("update_loadingSave", false);
|
||||
context.commit("update_errMessage", response.message);
|
||||
context.commit("update_alertError", true);
|
||||
} else {
|
||||
context.commit("update_loadingSave", false);
|
||||
|
||||
context.commit("update_snackbar", {
|
||||
state: true,
|
||||
type: 'success',
|
||||
message: 'Request berhasil ditolak',
|
||||
})
|
||||
|
||||
context.commit("update_dialogreject", false);
|
||||
context.commit("update_selectedItems", []);
|
||||
context.commit("update_selectedItem", {});
|
||||
context.dispatch("listrequestitem");
|
||||
}
|
||||
|
||||
} catch (e) {
|
||||
context.commit("update_loadingSave", false);
|
||||
context.commit("update_errMessage", e.message);
|
||||
context.commit("update_alertError", true);
|
||||
}
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
1106
test/vuex/acc-one-item-out-v3/modules/requester.js
Normal file
1106
test/vuex/acc-one-item-out-v3/modules/requester.js
Normal file
File diff suppressed because it is too large
Load Diff
13
test/vuex/acc-one-item-out-v3/store.js
Normal file
13
test/vuex/acc-one-item-out-v3/store.js
Normal file
@@ -0,0 +1,13 @@
|
||||
import listrequest from "./modules/listrequest.js";
|
||||
import requester from "./modules/requester.js";
|
||||
import system from "../../../apps/modules/system/system.js";
|
||||
export const store = new Vuex.Store({
|
||||
modules: {
|
||||
listrequest: listrequest,
|
||||
requester: requester,
|
||||
system: system,
|
||||
},
|
||||
state: {},
|
||||
mutations: {},
|
||||
actions: {},
|
||||
});
|
||||
Reference in New Issue
Block a user