@neutron.co.id/operasional-interfaces 1.14.0 → 1.14.2

package/build/@office/models/personalia/staff/StaffOperasional.vue

@@ -0,0 +1,187 @@
+<script setup lang="ts">
+import { NeonSingle, usePermit, useSingle } from '@neon.id/context'
+import { NeonField, NeonForm } from '@neon.id/form'
+import {
+  OfficeCollectionRelated,
+  OfficeRelation,
+  OfficeTab,
+  OfficeTabs,
+} from '@neon.id/office'
+import { Query } from '@neon.id/query'
+import { watch, computed } from 'vue'
+import { PromiseUtil } from '@neon.id/utils/promise'
+import type {
+  TPersonaliaStaffModel,
+  Schema,
+} from '@neutron.co.id/personalia-models'
+import StaffIdentity from './StaffIdentity.vue'
+
+const {
+  fields,
+  id,
+  initialValues,
+  values,
+  isLoading,
+  isChanged,
+  isReady,
+  isMain,
+  isNew,
+  saveOne,
+  discardChanges,
+} = useSingle<Schema.Staff, TPersonaliaStaffModel>()
+
+const permit = usePermit()
+
+watch(isNew, setDefaultValues, { immediate: true })
+
+async function setDefaultValues() {
+  if (!isNew.value) return
+  await PromiseUtil.wait(500)
+
+  const defaultValues = {
+    status: 'notActive',
+  } satisfies Schema.Staff
+
+  values.value.status = defaultValues.status
+}
+
+const queryBelajar = computed(() => {
+  let filter
+
+  if (!values.value.userId) {
+    filter = Query.define({
+      filter: {
+        handle: 'xxx',
+        operator: 'eq',
+        value: 'yyy',
+      },
+    })
+  } else {
+    filter = Query.define({
+      filter: {
+        handle: 'userId',
+        operator: 'eq',
+        value: values.value.userId,
+      },
+    })
+  }
+  return filter
+})
+</script>
+
+<template>
+  <NeonSingle class="neu-staff-single">
+    <OfficeTabs :use-url="isMain">
+      <OfficeTab handle="info" icon="circle-info" title="Info">
+        <NeonForm
+          handle="info"
+          :initial-values="initialValues"
+          :is-loading="isLoading"
+          :is-changed="isChanged"
+          use-unsaved
+          @cancel="discardChanges"
+          @submit="saveOne"
+        >
+          <div class="grid gap-4 sm:grid-cols-[3fr_1fr]">
+            <NeonField v-model="values.name" v-bind="fields.name" />
+            <NeonField v-model="values.nik" v-bind="fields.nik" />
+          </div>
+
+          <div class="grid gap-4 sm:grid-cols-2">
+            <NeonField v-model="values.birthPlace" v-bind="fields.birthPlace" />
+            <NeonField v-model="values.birthDate" v-bind="fields.birthDate" />
+          </div>
+
+          <NeonField v-model="values.status" v-bind="fields.status" />
+
+          <NeonField v-model="values.image" v-bind="fields.image" />
+
+          <NeonField v-model="values.note" v-bind="fields.note" />
+        </NeonForm>
+      </OfficeTab>
+
+      <!-- IDENTITAS -->
+      <OfficeTab handle="identity" icon="key" title="Identitas">
+        <StaffIdentity />
+      </OfficeTab>
+
+      <!-- CABANG -->
+      <OfficeTab handle="branch" icon="circle-info" title="Cabang">
+        <NeonForm
+          handle="branch"
+          :initial-values="initialValues"
+          :is-loading="isLoading"
+          :is-changed="isChanged"
+          use-unsaved
+          @cancel="discardChanges"
+          @submit="saveOne"
+        >
+          <OfficeRelation v-model="values" :field="fields.branch" />
+
+          <OfficeRelation v-model="values" :field="fields.branches" />
+        </NeonForm>
+      </OfficeTab>
+
+      <!-- KELUAR MASUK -->
+      <OfficeTab handle="checkIn" icon="fingerprint" title="Presensi">
+        <OfficeCollectionRelated
+          definition="neu:tempat:checkIn"
+          title="Presensi"
+          description="Presensi."
+          :excludes="['create', 'delete', 'destroy', 'duplicate']"
+          :query="
+            Query.define({
+              filter: {
+                handle: 'staffId',
+                operator: 'eq',
+                value: id,
+              },
+            })
+          "
+        />
+      </OfficeTab>
+
+      <OfficeTab
+        v-slot="{ isTouched }"
+        handle="learning"
+        icon="bolt"
+        title="Belajar"
+        :is-hidden="!values.userId || isNew"
+      >
+        <OfficeCollectionRelated
+          definition="neo:belajar:learning"
+          title="Belajar"
+          description="Progres Belajar."
+          :query="queryBelajar"
+          :peeks="['modal']"
+          :is-ready="isReady && isTouched"
+          :excludes="['duplicate', 'create', 'delete', 'destroy', 'click']"
+        />
+      </OfficeTab>
+
+      <OfficeTab
+        v-slot="{ isTouched }"
+        handle="quiz"
+        icon="bolt"
+        title="Quiz"
+        :is-hidden="!values.userId || isNew"
+      >
+        <OfficeCollectionRelated
+          definition="neo:uji:quizContext"
+          title="Quiz"
+          description="Quiz."
+          :query="queryBelajar"
+          :peeks="['modal']"
+          :is-ready="isReady && isTouched"
+          :excludes="['duplicate', 'create', 'delete', 'destroy', 'click']"
+        />
+      </OfficeTab>
+    </OfficeTabs>
+  </NeonSingle>
+</template>
+
+<style scoped>
+.neu-staff-single {
+  @apply block;
+}
+</style>

package/build/@office/models/personalia/staff/StaffSingle/StaffSingle.stories.d.ts

@@ -0,0 +1,8 @@
+import type { Meta } from '@storybook/vue3';
+import StaffSingle from './StaffSingle.vue';
+declare const _default: Meta<typeof StaffSingle>;
+export default _default;
+export declare const New: import("@storybook/csf").StoryAnnotations<import("@storybook/vue3").VueRenderer, {}, {}>;
+export declare const Existing: import("@storybook/csf").StoryAnnotations<import("@storybook/vue3").VueRenderer, {}, {}>;
+export declare const Content: import("@storybook/csf").StoryAnnotations<import("@storybook/vue3").VueRenderer, {}, {}>;
+export declare const $DefaultView: any;

package/build/@office/models/personalia/staff/StaffSingle/StaffSingle.stories.mjs

@@ -0,0 +1,47 @@
+import { StoryUtil } from "@neon.id/story/helpers";
+import { StaffModel } from "@neutron.co.id/personalia-models";
+import { StaffSingleView } from "@neutron.co.id/operasional-modules";
+import { decorateSingle, viewSingle, wrapSingle } from "@mock";
+import StaffSingle from "./StaffSingle.vue";
+export default {
+  title: "Office/Staff/Single",
+  tags: [],
+  component: StaffSingle,
+  parameters: StoryUtil.parameters({
+    description: "`StaffSingle`",
+    layout: "fullscreen",
+    controls: { exclude: ["colors"] },
+    backgrounds: { default: "light" }
+  })
+};
+export const New = StoryUtil.story({
+  description: "New.",
+  decorators: decorateSingle({
+    model: StaffModel
+  })
+});
+export const Existing = StoryUtil.story({
+  description: "Existing.",
+  args: { id: "" },
+  decorators: decorateSingle({
+    model: StaffModel
+    // id: '___',
+  })
+});
+export const Content = StoryUtil.story({
+  description: "Inside content.",
+  render: wrapSingle(StaffSingle),
+  args: { id: "" },
+  decorators: decorateSingle({
+    model: StaffModel
+    // id: '___',
+  })
+});
+export const $DefaultView = viewSingle({
+  description: "Default view.",
+  component: StaffSingleView,
+  props: {
+    // id: '___',
+    overrides: {}
+  }
+});

package/build/@office/models/personalia/staff/StaffSingle/StaffSingle.vue

@@ -0,0 +1,188 @@
+<script setup lang="ts">
+import { NeonSingle, useSingle } from '@neon.id/context'
+import { NeonField, NeonForm } from '@neon.id/form'
+import {
+  OfficeCollectionRelated,
+  OfficeRelation,
+  OfficeTab,
+  OfficeTabs,
+} from '@neon.id/office'
+import { Query } from '@neon.id/query'
+import { computed } from 'vue'
+import type {
+  TPersonaliaStaffModel,
+  Schema,
+} from '@neutron.co.id/personalia-models'
+import StaffIdentity from '../StaffIdentity.vue'
+const {
+  fields,
+  id,
+  initialValues,
+  values,
+  isLoading,
+  isChanged,
+  isReady,
+  isMain,
+  isNew,
+  saveOne,
+  discardChanges,
+} = useSingle<Schema.Staff, TPersonaliaStaffModel>()
+
+const queryBelajar = computed(() => {
+  let filter
+
+  if (!values.value.userId) {
+    filter = Query.define({
+      filter: {
+        handle: 'xxx',
+        operator: 'eq',
+        value: 'yyy',
+      },
+    })
+  } else {
+    filter = Query.define({
+      filter: {
+        handle: 'userId',
+        operator: 'eq',
+        value: values.value.userId,
+      },
+    })
+  }
+  return filter
+})
+</script>
+
+<template>
+  <NeonSingle class="neu-staff-single">
+    <OfficeTabs :use-url="isMain">
+      <OfficeTab handle="info" icon="circle-info" title="Info">
+        <NeonForm
+          handle="info"
+          :initial-values="initialValues"
+          :is-loading="isLoading"
+          :is-changed="isChanged"
+          use-unsaved
+          @cancel="discardChanges"
+          @submit="saveOne"
+        >
+          <div class="grid gap-4 sm:grid-cols-[3fr_1fr]">
+            <NeonField v-model="values.name" v-bind="fields.name" />
+            <NeonField v-model="values.nik" v-bind="fields.nik" />
+          </div>
+
+          <div class="grid gap-4 sm:grid-cols-2">
+            <NeonField v-model="values.birthPlace" v-bind="fields.birthPlace" />
+            <NeonField v-model="values.birthDate" v-bind="fields.birthDate" />
+          </div>
+
+          <NeonField v-model="values.status" v-bind="fields.status" />
+
+          <NeonField v-model="values.image" v-bind="fields.image" />
+
+          <NeonField v-model="values.note" v-bind="fields.note" />
+        </NeonForm>
+      </OfficeTab>
+
+      <!-- IDENTITAS -->
+      <OfficeTab handle="identity" icon="key" title="Identitas">
+        <StaffIdentity />
+      </OfficeTab>
+
+      <!-- CABANG -->
+      <OfficeTab handle="branch" icon="circle-info" title="Cabang">
+        <NeonForm
+          handle="branch"
+          :initial-values="initialValues"
+          :is-loading="isLoading"
+          :is-changed="isChanged"
+          use-unsaved
+          @cancel="discardChanges"
+          @submit="saveOne"
+        >
+          <OfficeRelation v-model="values" :field="fields.branch" />
+
+          <OfficeRelation v-model="values" :field="fields.branches" />
+        </NeonForm>
+      </OfficeTab>
+
+      <!-- KELUAR MASUK -->
+      <OfficeTab handle="checkIn" icon="fingerprint" title="Presensi">
+        <OfficeCollectionRelated
+          definition="neu:tempat:checkIn"
+          title="Presensi"
+          description="Presensi."
+          :excludes="['create', 'delete', 'destroy', 'duplicate']"
+          :query="
+            Query.define({
+              filter: {
+                handle: 'staffId',
+                operator: 'eq',
+                value: id,
+              },
+            })
+          "
+        />
+      </OfficeTab>
+
+      <OfficeTab
+        v-slot="{ isTouched }"
+        handle="learning"
+        icon="bolt"
+        title="Belajar"
+        :is-hidden="!values.userId || isNew"
+      >
+        <OfficeCollectionRelated
+          definition="neo:belajar:learning"
+          title="Belajar"
+          description="Progres Belajar."
+          :query="queryBelajar"
+          :peeks="['modal']"
+          :is-ready="isReady && isTouched"
+          :excludes="['duplicate', 'create', 'delete', 'destroy', 'click']"
+        />
+      </OfficeTab>
+
+      <OfficeTab
+        v-slot="{ isTouched }"
+        handle="quiz"
+        icon="bolt"
+        title="Quiz"
+        :is-hidden="!values.userId || isNew"
+      >
+        <OfficeCollectionRelated
+          definition="neo:uji:quizContext"
+          title="Quiz"
+          description="Quiz."
+          :query="queryBelajar"
+          :peeks="['modal']"
+          :is-ready="isReady && isTouched"
+          :excludes="['duplicate', 'create', 'delete', 'destroy', 'click']"
+        />
+      </OfficeTab>
+
+      <!-- KELUAR MASUK -->
+      <!-- <OfficeTab handle="checkIn" icon="person-to-door" title="Keluar Masuk">
+        <OfficeCollectionRelated
+          definition="neu:tempat:checkIn"
+          title="Keluar Masuk"
+          description="Keluar masuk."
+          :query="
+            Query.define({
+              filter: {
+                handle: 'staffId',
+                operator: 'eq',
+                value: id,
+              },
+            })
+          "
+        />
+      </OfficeTab> -->
+    </OfficeTabs>
+  </NeonSingle>
+</template>
+
+<style scoped>
+.neu-staff-single {
+  @apply block;
+}
+</style>

package/build/@office/models/personalia/staff/StaffSingle/index.d.ts

@@ -0,0 +1 @@
+export { default as StaffSingle } from './StaffSingle.vue';

package/build/@office/models/personalia/staff/StaffSingle/index.mjs

@@ -0,0 +1 @@
+export { default as StaffSingle } from "./StaffSingle.vue";

package/build/@office/models/personalia/staff/index.d.ts

@@ -0,0 +1,5 @@
+export { default as StaffOperasional } from './StaffOperasional.vue';
+export { default as StaffIdentity } from './StaffIdentity.vue';
+export { default as StaffAccess } from './StaffAccess.vue';
+export * from './StaffCollection';
+export * from './StaffSingle';

package/build/@office/models/personalia/staff/index.mjs

@@ -0,0 +1,5 @@
+export { default as StaffOperasional } from "./StaffOperasional.vue";
+export { default as StaffIdentity } from "./StaffIdentity.vue";
+export { default as StaffAccess } from "./StaffAccess.vue";
+export * from "./StaffCollection/index.mjs";
+export * from "./StaffSingle/index.mjs";