add modules folder based on s_menu

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

View File

@@ -0,0 +1,154 @@
<template>
<div>
<v-toolbar color="white">
<v-toolbar-title class="black--text">DETAIL RUANGAN</v-toolbar-title>
<v-spacer></v-spacer>
<h3>STATUS: {{ form_status }}</h3>
</v-toolbar>
<v-card class="pa-2">
<v-layout row wrap>
<v-flex xs6 pr-1>
<v-autocomplete :items="form_listreg" hide-details outline label="Regional"
item-text="S_RegionalName" item-value="S_RegionalID" @change="onChangeReg"
v-model="form_detail.regional"></v-autocomplete>
</v-flex>
<v-flex xs6 pl-1>
<v-autocomplete :items="form_listcab" label="Cabang" hide-details outline item-text="M_BranchName"
item-value="M_BranchID" :readonly="user.loginLevel == 'branch'"
v-model="form_detail.cabang"></v-autocomplete>
</v-flex>
<v-flex xs6 class="pr-1 mt-2">
<v-text-field hide-details label="Nama Ruangan" outline v-model="form_detail.nama"></v-text-field>
</v-flex>
<v-flex xs6 class="pl-1 mt-2">
<v-text-field hide-details label="Kode Ruangan" outline v-model="form_detail.kode"></v-text-field>
</v-flex>
</v-layout>
<v-layout row wrap class="mt-2">
<v-flex grow></v-flex>
<v-flex shrink pa-1>
<v-btn @click="hapusDetail()" outline color="error" :disabled="form_status == 'BARU'">HAPUS</v-btn>
</v-flex>
<v-flex shrink pa-1>
<v-btn @click="saveDetail()" block color="primary">SIMPAN</v-btn>
</v-flex>
</v-layout>
</v-card>
<v-dialog v-model="dialog_confirm" persistent width="40vw">
<v-card>
<v-card-title class="headline grey lighten-2">KONFIRMASI {{ form_status }}</v-card-title>
<v-card-text>
{{
form_status == 'BARU'
? 'Apakah anda yakin akan membuat data detail ruangan baru?'
: form_status == 'EDIT'
? 'Apakah anda yakin akan menyimpan perubahan data detail ruangan?'
: form_status == 'HAPUS'
? 'Apakah anda yakin akan menghapus data detail ruangan?'
: ''
}}
</v-card-text>
<v-card-actions>
<v-spacer></v-spacer>
<v-btn @click="dialog_confirm = false" color="error" class="white--text">Batal</v-btn>
<v-btn @click="konfirmasi()" color="primary" class="white--text">Ya</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
</div>
</template>
<script>
module.exports = {
data() {
return {
dialog_confirm: false
};
},
computed: {
user() {
return this.$store.state.ruangan.user;
},
form_listreg() {
return this.$store.state.ruangan.form_listreg;
},
form_listcab() {
return this.$store.state.ruangan.form_listcab;
},
form_status: {
get() {
return this.$store.state.ruangan.form_status;
},
set(val) {
this.$store.commit("ruangan/update_form_status", val);
}
},
form_detail: {
get() {
return this.$store.state.ruangan.form_detail;
},
set(val) {
this.$store.commit("ruangan/update_form_detail", val);
}
},
snackbar: {
get() {
return this.$store.state.ruangan.snackbar;
},
set(val) {
this.$store.commit("ruangan/update_snackbar", val);
}
}
},
methods: {
onChangeReg(value) {
this.form_detail.regional = value;
this.$store.dispatch('ruangan/listingCabang', 'right', value);
},
saveDetail() {
const detail = this.form_detail;
const isFilled = ["nama", "kode", "cabang", "regional"].every(field => {
return String(detail[field]).trim() !== "";
});
if (!isFilled) {
const snac = { color: 'error', msg: "form belum lengkap", state: true };
this.snackbar = snac;
} else {
this.dialog_confirm = true
}
},
hapusDetail() {
const detail = this.form_detail;
if (detail.id != 0) {
this.form_status = 'HAPUS';
this.dialog_confirm = true;
} else {
const snac = { color: 'error', msg: "unknown id detail", state: true };
this.snackbar = snac;
}
},
konfirmasi() {
let status = this.form_status
let form = this.form_detail
if (status == "BARU") {
this.$store.dispatch("ruangan/insertRuangan");
}
if (status == "EDIT" && form.id != 0) {
this.$store.dispatch("ruangan/updateRuangan", form.id);
}
if (status == "HAPUS" && form.id != 0) {
this.$store.dispatch("ruangan/deleteRuangan", form.id);
}
}
}
}
</script>

View File

@@ -0,0 +1,190 @@
<template>
<div>
<v-toolbar color="primary" dark>
<v-toolbar-title class="white--text">MASTER DATA RUANGAN</v-toolbar-title>
<v-spacer></v-spacer>
<v-tooltip bottom>
<template v-slot:activator="{ on }">
<v-btn v-on="on" icon @click="insertNewRuangan()">
<v-icon large>add_box</v-icon>
</v-btn>
</template>
<span>TAMBAH RUANGAN BARU</span>
</v-tooltip>
</v-toolbar>
<v-card class="pa-2">
<v-layout row align-center>
<v-flex xs4 pr-1>
<v-autocomplete :items="list_regional" label="Regional" hide-details outline
:readonly="user.loginLevel != 'pusat'" item-text="S_RegionalName" item-value="S_RegionalID"
v-model="filter_listing.regional" @change="onChangeReg"></v-autocomplete>
</v-flex>
<v-flex xs4 px-1>
<v-autocomplete :items="list_cabang" label="Cabang" item-text="M_BranchName" item-value="M_BranchID"
v-model="filter_listing.cabang" :readonly="user.loginLevel == 'branch'" hide-details
outline></v-autocomplete>
</v-flex>
<v-flex grow px-1>
<v-text-field v-model="filter_listing.keyword" label="Cari nama, kode" outline
hide-details></v-text-field>
</v-flex>
<v-flex shrink pl-1>
<v-btn color="primary" @click="search()">
<v-icon>search</v-icon>
</v-btn>
</v-flex>
</v-layout>
</v-card>
<v-card class="pa-2 mt-2">
<v-data-table :headers="headers" :items="list_ruangan.records" item-key="id" class="elevation-1"
hide-actions>
<template v-slot:items="props">
<tr @click="openDetailRuangan(props.item)" :class="{ 'yellow lighten-4': isSelected(props.item) }">
<td class="text-xs-center pa-1">
{{ props.index + 1 }}
</td>
<td class="text-xs-center pa-1">
{{ props.item.name }}
</td>
<td class="text-xs-center pa-1">
{{ props.item.code }}
</td>
<td class="text-xs-left pa-1">
<p class="mb-0">{{ props.item.branch_name }}</p>
<p class="mb-0">{{ props.item.regional_name }}</p>
</td>
</tr>
</template>
</v-data-table>
<v-divider class="my-1"></v-divider>
<div class="pa-2 mt-1 text-xs-center">
<v-pagination v-model="list_pagination" :length="len_page" :total-visible="10"></v-pagination>
</div>
</v-card>
<v-snackbar v-model="snackbar.state" multi-line top :timeout="3000" :color="snackbar.color">
{{ snackbar.msg }}
<v-btn class="ml-2" round flat @click="snackbar.state = false">Tutup</v-btn>
</v-snackbar>
</div>
</template>
<script>
module.exports = {
async mounted() {
await this.$store.dispatch('ruangan/listingRegional', 'left');
await this.$store.dispatch('ruangan/listingCabang', 'left');
await this.$store.dispatch('ruangan/searchRuangan');
await this.$store.dispatch('ruangan/listingRegional', 'right');
},
data() {
return {
headers: [
{
text: "NO", align: "center", sortable: false, value: "no",
width: "10%", class: "pa-1 blue lighten-3 white--text",
},
{
text: "NAMA", align: "center", sortable: false, value: "name",
width: "35%", class: "pa-1 blue lighten-3 white--text",
},
{
text: "KODE", align: "center", sortable: false, value: "code",
width: "25%", class: "pa-1 blue lighten-3 white--text",
},
{
text: "LOKASI", align: "center", sortable: false, value: "loc",
width: "30%", class: "pa-1 blue lighten-3 white--text",
}
]
};
},
computed: {
user() {
return this.$store.state.ruangan.user;
},
list_regional() {
return this.$store.state.ruangan.filter_listreg;
},
list_cabang() {
return this.$store.state.ruangan.filter_listcab;
},
list_ruangan() {
return this.$store.state.ruangan.list_ruangan;
},
len_page() {
const total = this.list_ruangan.total;
if (total == undefined || total < 1) return 1;
return Math.ceil(total / 10);
},
list_pagination: {
get() {
return this.$store.state.ruangan.list_pagination;
},
set(val) {
this.$store.commit("ruangan/update_list_pagination", val);
this.$store.dispatch('ruangan/searchRuangan');
}
},
filter_listing: {
get() {
return this.$store.state.ruangan.filter_listing;
},
set(val) {
this.$store.commit("ruangan/update_filter_listing", val);
}
},
snackbar: {
get() {
return this.$store.state.ruangan.snackbar;
},
set(val) {
this.$store.commit("ruangan/update_snackbar", val);
}
}
},
methods: {
onChangeReg(value) {
this.filter_listing.regional = value;
this.$store.dispatch('ruangan/listingCabang', 'left');
},
search() {
this.$store.dispatch('ruangan/searchRuangan');
},
insertNewRuangan() {
let detail = {
id: 0,
kode: "",
nama: "",
cabang: "",
regional: ""
};
this.$store.commit("ruangan/update_form_status", 'BARU');
this.$store.commit("ruangan/update_form_detail", detail);
},
async openDetailRuangan(item) {
let detail = {
id: item.id,
kode: item.code,
nama: item.name,
cabang: item.branch_id,
regional: item.regional_id
};
let cabs = this.list_cabang.filter((cab) => cab.M_BranchID != 0);
this.$store.commit("ruangan/update_form_listcab", cabs);
this.$store.commit("ruangan/update_form_status", 'EDIT');
this.$store.commit("ruangan/update_form_detail", detail);
},
isSelected(item) {
let form = this.$store.state.ruangan.form_detail;
return item.id === form.id
}
}
}
</script>