dwi.firman/cobaKeuangan
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

tampilan

Browse Source
This commit is contained in:
Davila Erdianita
2025-06-23 13:51:06 +07:00
parent fd8d4b5c2c
commit fee7f0b76e
3 changed files with 330 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
components/Master/DialogModal.vue
View File

@@ -16,7 +16,7 @@ watch(() => props.stateValue, (newValue) => {
<template>
<div class="pa-4 text-center">
<v-dialog max-width="800" v-model="isActive" persistent>
<v-dialog max-width="800" max-height="600" v-model="isActive" persistent>
<template v-slot:default="{ isActive }">
<v-card>
<template v-slot:title>

277
components/Master/FormAdd.vue Normal file
View File

@@ -0,0 +1,277 @@
<script setup>
import { ref, reactive } from "vue";
const emit = defineEmits(['stateValue']);
const permissionCategories = [
{
value: 0,
label: "General",
},
{
value: "1",
label: "ProductServce",
},
{
value: "2",
label: "Product",
},
];
const dummy = {
tab: null,
typeUser: "coba",
roleMenu: [
{
permission: "0",
menu: [
{
Module: "module1",
create: "true",
update: "false",
delete: "false",
show: "false",
},
{
Module: "module2",
create: "true",
update: "true",
delete: "false",
show: "false",
},
],
},
{
permission: "1",
menu: [
{
Module: "module1",
create: "true",
update: "false",
delete: "true",
show: "false",
},
{
Module: "module2",
create: "true",
update: "true",
delete: "false",
show: "false",
},
],
},
],
};
const form = ref({});
// const form = ref({dummy})
// console.log(form)
const data = ref(null);
const ready = ref(false);
const onSubmit = () => {
console.log(data.value.form$.data);
emit('stateValue', false)
// console.log(form.value);
// console.log("masuk sini",form.value)
};
onBeforeMount(() => {
Object.assign(form.value, dummy);
});
</script>
<template>
<!-- <pre>{{ form }}</pre> -->
<!-- <Vueform v-if="ready" ref="data" v-model="form" validate-on="change|step" method="post" :endpoint="onSubmit"> -->
<Vueform
ref="data"
v-model="form"
validate-on="change|step"
method="post"
:endpoint="onSubmit"
>
<template #empty>
<FormSteps>
<FormStep
name="page0"
label="Type User"
:elements="['typeUser', 'roleType']"
/>
<FormStep
name="page1"
label="Permission Categories"
:elements="['text', 'tab', 'gridTable', 'roleMenu', 'permission']"
/>
</FormSteps>
<FormElements>
<ListElement name="roleMenu" :default="form.roleMenu" class="mx-4" add-text="+ permission">
<template #default="{ index }">
<ObjectElement :name="index" class="px-3 py-3 border border-gray-200 rounded-xl">
<SelectElement
name="permission"
:items="permissionCategories"
:search="true"
:native="false"
label="Permission Category"
input-type="search"
autocomplete="off"
:columns="{
container: 5,
}"
/>
<GridElement
name="gridTable"
class="border"
style="background-color: #06ac8b; color: aliceblue;"
:cols="5"
:rows="1"
:grid="[
[
['Module', 1, 1, null, null],
['Create', 1, 1, null, null],
['Update', 1, 1, null, null],
['Delete', 1, 1, null, null],
['Show', 1, 1, null, null],
],
]"
/>
<ListElement
name="menu"
add-text="+ module"
:sort="true"
wrapper-class="flex flex-col items-center gap-4"
add-class="bg-green-500 text-white w-10 h-10 flex items-center justify-center rounded-full"
>
<template #default="{ index }">
<ObjectElement :name="index">
<GridElement
name="gridTable_1"
class="!mb-0"
:cols="5"
:rows="1"
:grid="[
[
[
{
// default:form.roleMenu[index]?.Module ?? 'asa',
name: 'Module',
type: 'text',
builder: {
type: 'text',
label: 'Text input',
},
},
1,
1,
null,
null,
],
[
{
// default:form.roleMenu[index]?.create ?? false,
name: 'create',
type: 'checkbox',
builder: {
type: 'checkbox',
label: 'Checkbox',
},
text: 'Ya',
trueValue: 'true',
falseValue: 'false',
},
1,
1,
null,
null,
],
[
{
// default:form.roleMenu[index]?.update?? false,
name: 'update',
type: 'checkbox',
builder: {
type: 'checkbox',
label: 'Checkbox',
},
text: 'Ya',
trueValue: 'true',
falseValue: 'false',
},
1,
1,
null,
null,
],
[
{
// default:form.roleMenu[index]?.delete?? false,
name: 'delete',
type: 'checkbox',
builder: {
type: 'checkbox',
label: 'Checkbox',
},
text: 'Ya',
trueValue: 'true',
falseValue: 'false',
},
1,
1,
null,
null,
],
[
{
// default:form.roleMenu[index]?.show?? false,
name: 'show',
type: 'checkbox',
builder: {
type: 'checkbox',
label: 'Checkbox',
},
text: 'Ya',
trueValue: 'true',
falseValue: 'false',
},
1,
1,
null,
null,
],
],
]"
:presets="['grid-table']"
/>
</ObjectElement>
</template>
</ListElement>
</ObjectElement>
</template>
</ListElement>
<TextElement
:default="form.typeUser"
name="typeUser"
label="Role Name"
:columns="{
container: 6,
}"
/>
<TextElement
:default="form.typeUser"
name="roleType"
label="Role Type"
:columns="{
container: 6,
}"
/>
</FormElements>
<FormStepsControls />
</template>
</Vueform>
</template>
<style>
/* .vf-layout-inner-wrapper .vf-rowset .vt-row{
padding: 0 !important;
margin: 0 !important;
} */
</style>

52
pages/Setting/typeUser/ViewRoles.vue Normal file
View File

@@ -0,0 +1,52 @@
<script setup lang="ts">
import { ref } from "vue";
import {useSettingStore} from "@/stores/api/setting/setting"
const {getTypeUser,getRoleMenuById} = useSettingStore()
const {listTypeUser,typeUser} =storeToRefs(useSettingStore())
const state = ref(false)
const type = ref('')
const detailType = async(item:any) => {
//simpan pinia
await getRoleMenuById(item._id)
type.value='detail'
state.value= true
};
onMounted(async() => {
await getTypeUser()
})
</script>
<!-- ini list -->
<template>
<div class="d-flex pt-6 align-center ml-3 mb-6">
<v-btn class="mr-16" color="primary" variant="tonal" @click="state= !state; type='create'"><v-icon>mdi-plus</v-icon> Tipe User</v-btn>
</div>
<v-row no-gutters>
<v-col cols="12" md="4">
<div class="d-flex justify-space-between">
<template v-if="listTypeUser && listTypeUser.length > 0">
<v-col v-for="(item, index) in listTypeUser" :key="index">
<MasterCardList :item="item" @detail="detailType" >
<template v-slot:actions></template>
</MasterCardList>
</v-col>
</template>
<template v-else>
<div class="d-flex justify-content-center align-items-center ml-3">
<p>Tidak ada Pasien</p>
</div>
</template>
</div>
</v-col>
</v-row>
<MasterDialogModal v-if="state" :stateValue="state" @stateValue="val => state = val" >
<template v-slot:text>
<MasterFormTypeUser v-if="type=='create'"/>
<MasterFormAdd v-if="type=='detail'" @stateValue="val => state = val"/>
<!-- <MasterContoh v-if="type=='detail'"/> -->
</template>
</MasterDialogModal>
</template>