Add approval and recommendation list DRP
This commit is contained in:
Mulia Nasution
Mulia Nasution
parent
86a1ab76aa
commit
9142dda488
@ -119,6 +119,12 @@ export default [
|
||||
{
|
||||
text: 'Approval DRP',
|
||||
path: '/drp/drp-approval',
|
||||
items: [
|
||||
{
|
||||
text: 'List Rekomendasi',
|
||||
path: '/drp/drp-approval/list-rekomendasi'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
text: 'Revisi DRP',
|
||||
|
||||
@ -27,6 +27,8 @@ import DrpPenyusunan from './views/drp/drp-penyusunan';
|
||||
import DrpPengadaanDokumen from './views/drp/drp-pengadaan-dokumen';
|
||||
import DrpPengadaan from './views/drp/drp-pengadaan';
|
||||
import DrpDokumen from './views/drp/drp-dokumen';
|
||||
import DrpApproval from './views/drp/drp-approval'
|
||||
import RecomendationList from './views/drp/recomendation-list.vue'
|
||||
|
||||
/* General */
|
||||
import auth from "./auth";
|
||||
@ -304,7 +306,7 @@ const router = new createRouter({
|
||||
layout: defaultLayout
|
||||
},
|
||||
component: DrpDokumen
|
||||
},
|
||||
},
|
||||
{
|
||||
path: "/drp/drp-pengadaan",
|
||||
name: "drp-pengadaan",
|
||||
@ -313,7 +315,7 @@ const router = new createRouter({
|
||||
layout: defaultLayout
|
||||
},
|
||||
component: DrpPengadaan
|
||||
},
|
||||
},
|
||||
{
|
||||
path: "/drp/drp-pengadaan-dokumen",
|
||||
name: "drp-pengadaan-dokumen",
|
||||
@ -322,7 +324,25 @@ const router = new createRouter({
|
||||
layout: defaultLayout
|
||||
},
|
||||
component: DrpPengadaanDokumen
|
||||
}
|
||||
},
|
||||
{
|
||||
path: "/drp/drp-approval",
|
||||
name: "drp-approval",
|
||||
meta: {
|
||||
requiresAuth: true,
|
||||
layout: defaultLayout
|
||||
},
|
||||
component: DrpApproval
|
||||
},
|
||||
{
|
||||
path: "/drp/drp-approval/list-rekomendasi",
|
||||
name: "list-rekomendasi",
|
||||
meta: {
|
||||
requiresAuth: true,
|
||||
layout: defaultLayout
|
||||
},
|
||||
component: RecomendationList
|
||||
},
|
||||
],
|
||||
history: createWebHashHistory()
|
||||
});
|
||||
|
||||
195
src/views/drp/drp-approval.vue
Normal file
195
src/views/drp/drp-approval.vue
Normal file
@ -0,0 +1,195 @@
|
||||
<template>
|
||||
<div>
|
||||
<h3 class="content-block main-title">Approval DRP</h3>
|
||||
<p class="content-block">Approval DRP </p>
|
||||
<div class="content-block">
|
||||
<div class="dx-card responsive-paddings">
|
||||
<div id="app-container">
|
||||
<DxDataGrid
|
||||
ref="currDataGrid"
|
||||
:data-source="dataSource"
|
||||
key-expr="id"
|
||||
:allow-column-reordering="true"
|
||||
:column-auto-width="true"
|
||||
>
|
||||
<DxEditing
|
||||
:allow-adding="true"
|
||||
:allow-updating="true"
|
||||
:allow-deleting="true"
|
||||
:use-icons="true"
|
||||
mode="popup"
|
||||
>
|
||||
<DxTexts
|
||||
add-row="Tambah"
|
||||
edit-row="Ubah"
|
||||
delete-row="Hapus"
|
||||
confirm-delete-message="Apakah anda yakin untuk menghapus data ini?"
|
||||
save-row-changes="Simpan"
|
||||
cancel-row-changes="Batal"
|
||||
></DxTexts>
|
||||
<DxForm label-location="top" :col-count="1">
|
||||
<DxItem dataField="tahun">
|
||||
<DxRequiredRule message="Tahun harus diisi" />
|
||||
</DxItem>
|
||||
</DxForm>
|
||||
<DxPopup
|
||||
:hide-on-outside-click="true"
|
||||
:show-title="true"
|
||||
:width="400"
|
||||
:height="400"
|
||||
title="Form Approval DRP "
|
||||
>
|
||||
</DxPopup>
|
||||
</DxEditing>
|
||||
<DxToolbar>
|
||||
<DxItem name="groupPanel" />
|
||||
<DxItem name="searchPanel" location="before" />
|
||||
<DxItem name="exportButton" />
|
||||
<DxItem name="columnChooserButton" />
|
||||
</DxToolbar>
|
||||
<DxPaging :page-size="5" />
|
||||
<DxPager
|
||||
:visible="true"
|
||||
:allowed-page-sizes="[5, 10, 50]"
|
||||
:display-mode="compact"
|
||||
:show-page-size-selector="true"
|
||||
:show-info="true"
|
||||
:show-navigation-buttons="true"
|
||||
info-text="Hal {0} dari {1} ({2} data)"
|
||||
/>
|
||||
<DxFilterRow :visible="false" />
|
||||
<DxColumn
|
||||
cell-template="row-cell-template"
|
||||
caption="No"
|
||||
:width="45"
|
||||
></DxColumn>
|
||||
<DxColumn data-field="tahun" caption="Tahun DRP"></DxColumn>
|
||||
<DxColumn
|
||||
data-field="approveStatus"
|
||||
caption="Status Approve"
|
||||
editor-type="dxCheckBox"
|
||||
></DxColumn>
|
||||
<DxColumn data-field="" caption="VP Pengadaan"></DxColumn>
|
||||
<DxColumn data-field="" caption="Komite Value for Money"></DxColumn>
|
||||
<DxColumn data-field="" caption="Direktur Utama"></DxColumn>
|
||||
<DxColumn type="buttons" caption="Aksi">
|
||||
<DxButton name="edit" />
|
||||
<DxButton
|
||||
text="Detail"
|
||||
icon="file"
|
||||
hint="Detail"
|
||||
:on-click="linkDetail"
|
||||
/>
|
||||
</DxColumn>
|
||||
<DxColumn type="adaptive" :width="50">
|
||||
<DxButton hint="detail" icon="copy" />
|
||||
</DxColumn>
|
||||
<template #row-cell-template="{ data }">
|
||||
<DxText>{{ data.rowIndex + 1 }}</DxText>
|
||||
</template>
|
||||
<DxSearchPanel
|
||||
:visible="true"
|
||||
:highlight-case-sensitive="true"
|
||||
:width="300"
|
||||
placeholder="Cari Approval DRP..."
|
||||
/>
|
||||
</DxDataGrid>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import DxDataGrid, {
|
||||
DxEditing,
|
||||
DxItem,
|
||||
DxForm,
|
||||
DxPopup,
|
||||
DxColumn,
|
||||
DxFilterRow,
|
||||
DxPager,
|
||||
DxPaging,
|
||||
DxSearchPanel,
|
||||
DxToolbar,
|
||||
DxTexts,
|
||||
DxButton,
|
||||
} from "devextreme-vue/data-grid";
|
||||
import CustomStore from "devextreme/data/custom_store";
|
||||
|
||||
const URL = process.env.VUE_APP_ROOT_API + "/drp";
|
||||
|
||||
const dataSource = new CustomStore({
|
||||
key: "id",
|
||||
|
||||
load: () => {
|
||||
return fetch(URL + "?size=100")
|
||||
.then((response) => response.json())
|
||||
.then((response) => {
|
||||
console.log("drp:", response.data);
|
||||
return {
|
||||
data: response.data,
|
||||
totalCount: response.pagination.totalRecords,
|
||||
};
|
||||
})
|
||||
.catch(() => {
|
||||
throw new Error("Terdapat kesalahan memuat data");
|
||||
});
|
||||
},
|
||||
|
||||
insert: (values) => {
|
||||
return fetch(URL, {
|
||||
method: "POST",
|
||||
body: JSON.stringify(values),
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
});
|
||||
},
|
||||
|
||||
update: (key, values) => {
|
||||
return fetch(URL + "/" + encodeURIComponent(key), {
|
||||
method: "PUT",
|
||||
body: JSON.stringify(values),
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
});
|
||||
},
|
||||
|
||||
remove: (key) => {
|
||||
return fetch(URL + "/" + encodeURIComponent(key), {
|
||||
method: "DELETE",
|
||||
});
|
||||
},
|
||||
});
|
||||
|
||||
export default {
|
||||
components: {
|
||||
DxDataGrid,
|
||||
DxEditing,
|
||||
DxItem,
|
||||
DxForm,
|
||||
DxPopup,
|
||||
DxColumn,
|
||||
DxFilterRow,
|
||||
DxPager,
|
||||
DxPaging,
|
||||
DxSearchPanel,
|
||||
DxToolbar,
|
||||
DxTexts,
|
||||
DxButton,
|
||||
},
|
||||
methods: {
|
||||
linkDetail: function () {
|
||||
location.href = "master-data/strategi-pengadaan";
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
//jsonUrl: URL,
|
||||
dataSource,
|
||||
};
|
||||
},
|
||||
};
|
||||
</script>
|
||||
198
src/views/drp/recomendation-list.vue
Normal file
198
src/views/drp/recomendation-list.vue
Normal file
@ -0,0 +1,198 @@
|
||||
<template>
|
||||
<div>
|
||||
<h3 class="content-block main-title">Approval DRP</h3>
|
||||
<p class="content-block">Approval DRP > List Rekomendasi </p>
|
||||
<div class="content-block">
|
||||
<div class="dx-card responsive-paddings">
|
||||
<div id="app-container">
|
||||
<DxDataGrid
|
||||
ref="currDataGrid"
|
||||
:data-source="dataSource"
|
||||
key-expr="id"
|
||||
:allow-column-reordering="true"
|
||||
:column-auto-width="true"
|
||||
>
|
||||
<DxEditing
|
||||
:allow-adding="true"
|
||||
:allow-updating="true"
|
||||
:allow-deleting="true"
|
||||
:use-icons="true"
|
||||
mode="popup"
|
||||
>
|
||||
<DxTexts
|
||||
add-row="Tambah"
|
||||
edit-row="Ubah"
|
||||
delete-row="Hapus"
|
||||
confirm-delete-message="Apakah anda yakin untuk menghapus data ini?"
|
||||
save-row-changes="Simpan"
|
||||
cancel-row-changes="Batal"
|
||||
></DxTexts>
|
||||
<DxForm label-location="top" :col-count="1">
|
||||
<DxItem dataField="tahun">
|
||||
<DxRequiredRule message="Tahun harus diisi" />
|
||||
</DxItem>
|
||||
</DxForm>
|
||||
<DxPopup
|
||||
:hide-on-outside-click="true"
|
||||
:show-title="true"
|
||||
:width="400"
|
||||
:height="400"
|
||||
title="Form Penyusunan DRP"
|
||||
>
|
||||
</DxPopup>
|
||||
</DxEditing>
|
||||
<DxToolbar>
|
||||
<DxItem name="groupPanel" />
|
||||
<DxItem name="searchPanel" location="before" />
|
||||
<DxItem name="exportButton" />
|
||||
<DxItem name="columnChooserButton" />
|
||||
</DxToolbar>
|
||||
<DxPaging :page-size="5" />
|
||||
<DxPager
|
||||
:visible="true"
|
||||
:allowed-page-sizes="[5, 10, 50]"
|
||||
:display-mode="compact"
|
||||
:show-page-size-selector="true"
|
||||
:show-info="true"
|
||||
:show-navigation-buttons="true"
|
||||
info-text="Hal {0} dari {1} ({2} data)"
|
||||
/>
|
||||
<DxFilterRow :visible="false" />
|
||||
<DxColumn
|
||||
cell-template="row-cell-template"
|
||||
caption="No"
|
||||
:width="45"
|
||||
></DxColumn>
|
||||
<DxColumn data-field="" caption="Nama Pengadaan"></DxColumn>
|
||||
<DxColumn
|
||||
data-field=""
|
||||
caption="Approval"
|
||||
editor-type="dxCheckBox"
|
||||
></DxColumn>
|
||||
<DxColumn data-field="" caption="Status"></DxColumn>
|
||||
<DxColumn data-field="" caption="Tanggal Status"></DxColumn>
|
||||
<DxColumn data-field="" caption="Catatan Rekomendasi"></DxColumn>
|
||||
<DxColumn data-field="" caption="Tanggal Rekomendasi"></DxColumn>
|
||||
<DxColumn type="buttons" caption="Aksi">
|
||||
<DxButton name="edit" />
|
||||
<DxButton name="delete" />
|
||||
<DxButton
|
||||
text="Detail"
|
||||
icon="increaseindent"
|
||||
hint="Detail"
|
||||
:on-click="linkDetail"
|
||||
/>
|
||||
</DxColumn>
|
||||
<DxColumn type="adaptive" :width="50">
|
||||
<DxButton hint="detail" icon="copy" />
|
||||
</DxColumn>
|
||||
<template #row-cell-template="{ data }">
|
||||
<DxText>{{ data.rowIndex + 1 }}</DxText>
|
||||
</template>
|
||||
<DxSearchPanel
|
||||
:visible="true"
|
||||
:highlight-case-sensitive="true"
|
||||
:width="300"
|
||||
placeholder="Cari Penyusunan DRP..."
|
||||
/>
|
||||
</DxDataGrid>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import DxDataGrid, {
|
||||
DxEditing,
|
||||
DxItem,
|
||||
DxForm,
|
||||
DxPopup,
|
||||
DxColumn,
|
||||
DxFilterRow,
|
||||
DxPager,
|
||||
DxPaging,
|
||||
DxSearchPanel,
|
||||
DxToolbar,
|
||||
DxTexts,
|
||||
DxButton,
|
||||
} from "devextreme-vue/data-grid";
|
||||
import CustomStore from "devextreme/data/custom_store";
|
||||
|
||||
const URL = process.env.VUE_APP_ROOT_API + "/drp";
|
||||
|
||||
const dataSource = new CustomStore({
|
||||
key: "id",
|
||||
|
||||
load: () => {
|
||||
return fetch(URL + "?size=100")
|
||||
.then((response) => response.json())
|
||||
.then((response) => {
|
||||
return {
|
||||
data: response.data,
|
||||
totalCount: response.pagination.totalRecords,
|
||||
};
|
||||
})
|
||||
.catch(() => {
|
||||
throw new Error("Terdapat kesalahan memuat data");
|
||||
});
|
||||
},
|
||||
|
||||
insert: (values) => {
|
||||
return fetch(URL, {
|
||||
method: "POST",
|
||||
body: JSON.stringify(values),
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
});
|
||||
},
|
||||
|
||||
update: (key, values) => {
|
||||
return fetch(URL + "/" + encodeURIComponent(key), {
|
||||
method: "PUT",
|
||||
body: JSON.stringify(values),
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
});
|
||||
},
|
||||
|
||||
remove: (key) => {
|
||||
return fetch(URL + "/" + encodeURIComponent(key), {
|
||||
method: "DELETE",
|
||||
});
|
||||
},
|
||||
});
|
||||
|
||||
export default {
|
||||
components: {
|
||||
DxDataGrid,
|
||||
DxEditing,
|
||||
DxItem,
|
||||
DxForm,
|
||||
DxPopup,
|
||||
DxColumn,
|
||||
DxFilterRow,
|
||||
DxPager,
|
||||
DxPaging,
|
||||
DxSearchPanel,
|
||||
DxToolbar,
|
||||
DxTexts,
|
||||
DxButton,
|
||||
},
|
||||
methods: {
|
||||
linkDetail: function () {
|
||||
location.href = "master-data/strategi-pengadaan";
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
//jsonUrl: URL,
|
||||
dataSource,
|
||||
};
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss"></style>
|
||||
@ -61,9 +61,9 @@
|
||||
info-text="Hal {0} dari {1} ({2} data)" />
|
||||
<DxFilterRow :visible="false" />
|
||||
<DxColumn data-field="id" caption="No" :width="45"></DxColumn>
|
||||
<DxColumn data-field="role" caption="Role"></DxColumn>
|
||||
<DxColumn data-field="roles" caption="Role"></DxColumn>
|
||||
<DxColumn data-field="keterangan" caption="Keterangan"></DxColumn>
|
||||
<DxColumn data-field="isActive" caption="Status"></DxColumn>
|
||||
<DxColumn data-field="isactive" caption="Status"></DxColumn>
|
||||
<DxColumn type="buttons" caption="Aksi">
|
||||
<DxButton name="edit"/>
|
||||
<DxButton name="delete"/>
|
||||
|
||||
@ -136,7 +136,7 @@ const instansiOptions = new CustomStore({
|
||||
return fetch(URL_instansi+'?size=1000')
|
||||
.then((response) => response.json())
|
||||
.then(response => {
|
||||
console.log(response.data);
|
||||
console.log('instansi:',response.data);
|
||||
return {
|
||||
data: response.data
|
||||
};
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user