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

package/build/@office/models/personalia/submission/SubmissionStaff.vue

@@ -0,0 +1,495 @@
+<template>
+  <NeonSingle class="neu-submission-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"
+        >
+          <NeonField v-if="isReady">
+            <template #input>
+              <NeonButton
+                size="md"
+                color="dark"
+                icon-left="arrow-up-from-line"
+                :is-disabled="
+                  isNew ||
+                  isChanged ||
+                  values.status === 'raised' ||
+                  values.status === 'processed' ||
+                  values.status === 'approved' ||
+                  values.status === 'monitored' ||
+                  values.status === 'discontinued' ||
+                  values.status === 'resolved' ||
+                  !values.agreedStaffs ||
+                  !values.branches ||
+                  !values.decideStaffs ||
+                  !values.followUpStaffs ||
+                  !values.raiseStaffs ||
+                  !values.submissionStaffs ||
+                  !values.title ||
+                  !values.type ||
+                  values.hasRaiseStaffIds?.includes(staff?.id || '')
+                    ? true
+                    : false
+                "
+                @click="syncRaise"
+                >Dinaikkan</NeonButton
+              >
+            </template>
+          </NeonField>
+
+          <NeonField
+            v-model="values.title"
+            v-bind="fields.title"
+            :is-disabled="
+              values.status === 'raised' ||
+              values.status === 'processed' ||
+              values.status === 'approved' ||
+              values.status === 'monitored' ||
+              values.status === 'discontinued' ||
+              values.status === 'resolved'
+            "
+          />
+
+          <NeonField
+            v-model="values.nominal"
+            v-bind="fields.nominal"
+            :is-disabled="
+              values.status === 'raised' ||
+              values.status === 'processed' ||
+              values.status === 'approved' ||
+              values.status === 'monitored' ||
+              values.status === 'discontinued' ||
+              values.status === 'resolved'
+            "
+          />
+
+          <NeonFields md="grid-cols-2">
+            <OfficeRelation
+              v-model="values"
+              :field="fields.branches"
+              :query="Query.define(branchOptions)"
+              :is-disabled="
+                values.status === 'raised' ||
+                values.status === 'processed' ||
+                values.status === 'approved' ||
+                values.status === 'monitored' ||
+                values.status === 'discontinued' ||
+                values.status === 'resolved'
+              "
+            />
+            <OfficeRelation
+              v-model="values"
+              :field="fields.type"
+              :query="Query.define(typeOptions)"
+              :is-disabled="
+                values.status === 'raised' ||
+                values.status === 'processed' ||
+                values.status === 'approved' ||
+                values.status === 'monitored' ||
+                values.status === 'discontinued' ||
+                values.status === 'resolved'
+              "
+            />
+          </NeonFields>
+
+          <div class="flex items-right">
+            <div class="flex-grow">
+              <NeonFields class="flex-1">
+                <OfficeRelation
+                  v-model="values"
+                  :field="fields.submissionStaffs"
+                  :query="Query.define(submissionStaffOptions)"
+                  :is-disabled="
+                    values.status === 'raised' ||
+                    values.status === 'processed' ||
+                    values.status === 'approved' ||
+                    values.status === 'monitored' ||
+                    values.status === 'discontinued' ||
+                    values.status === 'resolved' ||
+                    values.hasRaiseStaffIds?.length
+                      ? true
+                      : false
+                  "
+                />
+              </NeonFields>
+            </div>
+            <div class="ml-2 flex items-end pb-1">
+              <NeonCopy :size="'sm'" :value="copyStaff.linkStaff" />
+            </div>
+          </div>
+
+          <div class="flex items-right">
+            <div class="flex-grow">
+              <NeonFields class="flex-1">
+                <OfficeRelation
+                  v-model="values"
+                  :field="fields.raiseStaffs"
+                  :query="Query.define(roleStaffOptions)"
+                  :is-disabled="
+                    values.status === 'raised' ||
+                    values.status === 'processed' ||
+                    values.status === 'approved' ||
+                    values.status === 'monitored' ||
+                    values.status === 'discontinued' ||
+                    values.status === 'resolved'
+                  "
+                />
+              </NeonFields>
+            </div>
+            <div class="ml-2 flex items-end pb-1">
+              <NeonCopy :size="'sm'" :value="copyRaise.linkAudit" />
+            </div>
+          </div>
+
+          <div class="flex items-right">
+            <div class="flex-grow">
+              <NeonFields class="flex-1">
+                <OfficeRelation
+                  v-model="values"
+                  :field="fields.decideStaffs"
+                  :query="Query.define(roleDecideStaffOptions)"
+                  :is-disabled="
+                    values.status === 'raised' ||
+                    values.status === 'processed' ||
+                    values.status === 'approved' ||
+                    values.status === 'monitored' ||
+                    values.status === 'discontinued' ||
+                    values.status === 'resolved'
+                  "
+                />
+              </NeonFields>
+            </div>
+            <div class="ml-2 flex items-end pb-1">
+              <NeonCopy :size="'sm'" :value="copyDecision.linkDecision" />
+            </div>
+          </div>
+
+          <div class="flex items-right">
+            <div class="flex-grow">
+              <NeonFields class="flex-1">
+                <OfficeRelation
+                  v-model="values"
+                  :field="fields.followUpStaffs"
+                />
+              </NeonFields>
+            </div>
+            <div class="ml-2 flex items-end pb-1">
+              <NeonCopy :size="'sm'" :value="copyFollowup.linkFollowup" />
+            </div>
+          </div>
+
+          <!-- <NeonField
+            v-model="values.specifications"
+            v-bind="fields.specifications"
+            :is-disabled="
+              values.status === 'raised' ||
+              values.status === 'processed' ||
+              values.status === 'approved' ||
+              values.status === 'monitored' ||
+              values.status === 'discontinued' ||
+              values.status === 'resolved'
+            "
+          /> -->
+
+          <NeonField
+            v-model="values.preparedAt"
+            v-bind="fields.preparedAt"
+            is-disabled
+          />
+
+          <NeonField
+            v-model="values.raisedAt"
+            v-bind="fields.raisedAt"
+            is-disabled
+          />
+
+          <NeonField
+            v-model="values.processedAt"
+            v-bind="fields.processedAt"
+            is-disabled
+          />
+
+          <!-- <NeonField
+            v-model="values.decidedAt"
+            v-bind="fields.decidedAt"
+            is-disabled
+          />
+
+          <NeonField
+          v-model="values.approvedAt"
+          v-bind="fields.approvedAt"
+          is-disabled
+        />
+
+        <NeonField
+          v-model="values.delayAt"
+          v-bind="fields.delayAt"
+          is-disabled
+        /> -->
+
+          <NeonDivider is-dashed label="Spesifikasi" />
+
+          <NeonField
+            v-model="values.workingHours"
+            v-bind="fields.workingHours"
+            :is-disabled="
+              values.status === 'raised' ||
+              values.status === 'processed' ||
+              values.status === 'approved' ||
+              values.status === 'monitored' ||
+              values.status === 'discontinued' ||
+              values.status === 'resolved'
+            "
+          />
+
+          <NeonDivider is-dashed label="Menaikkan" />
+
+          <NeonFields md="grid-cols-2">
+            <OfficeRelation
+              v-model="values"
+              :field="fields.hasRaiseStaffs"
+              is-disabled
+            />
+            <OfficeRelation
+              v-model="values"
+              :field="fields.yetRaiseStaffs"
+              is-disabled
+            />
+          </NeonFields>
+
+          <NeonDivider is-dashed label="Memproses" />
+
+          <NeonFields md="grid-cols-2">
+            <OfficeRelation
+              v-model="values"
+              :field="fields.hasProcessStaffs"
+              is-disabled
+            />
+            <OfficeRelation
+              v-model="values"
+              :field="fields.yetProcessStaffs"
+              is-disabled
+            />
+          </NeonFields>
+
+          <NeonDivider is-dashed label="Keputusan" />
+
+          <NeonFields md="grid-cols-2">
+            <OfficeRelation
+              v-model="values"
+              :field="fields.delayStaffs"
+              is-disabled
+            />
+            <OfficeRelation
+              v-model="values"
+              :field="fields.agreedStaffs"
+              is-disabled
+            />
+          </NeonFields>
+        </NeonForm>
+      </OfficeTab>
+
+      <!-- DETAIL -->
+      <SubmissionDetailTab />
+
+      <!-- DOKUMEN -->
+      <SubmissionDocumentTab
+        toolbar="side"
+        :is-readonly="
+          values.status === 'raised' ||
+          values.status === 'processed' ||
+          values.status === 'approved' ||
+          values.status === 'monitored' ||
+          values.status === 'discontinued' ||
+          values.status === 'resolved'
+        "
+      />
+    </OfficeTabs>
+  </NeonSingle>
+</template>
+
+<script setup lang="ts">
+import { NeonSingle, useSingle } from '@neon.id/context'
+import { NeonField, NeonFields, NeonForm } from '@neon.id/form'
+import { NeonButton, NeonDivider, NeonCopy } from '@neon.id/interfaces'
+import { OfficeRelation, OfficeTab, OfficeTabs } from '@neon.id/office'
+import { Query } from '@neon.id/query'
+import { useOperasional } from '../../../common/providers/operasional'
+import { computed, watch } from 'vue'
+import { PromiseUtil } from '@neon.id/utils/promise'
+import type {
+  TPersonaliaSubmissionModel,
+  Schema,
+} from '@neutron.co.id/personalia-models'
+import { SubmissionDetailTab, SubmissionDocumentTab } from './sections'
+
+const {
+  fields,
+  id,
+  initialValues,
+  values,
+  isLoading,
+  isChanged,
+  isReady,
+  isMain,
+  isNew,
+  syncOne,
+  saveOne,
+  discardChanges,
+  executeOne,
+} = useSingle<Schema.Submission, TPersonaliaSubmissionModel>()
+
+const { staff } = useOperasional()
+
+const branchOptions = computed(() => {
+  return {
+    filter: [
+      {
+        handle: '_id',
+        operator: 'in',
+        value: staff.value?.branchIds,
+      },
+    ],
+  }
+})
+
+const typeOptions = computed(() => {
+  return {
+    filter: [
+      {
+        handle: 'branchIds',
+        operator: 'in',
+        value: values.value.branchIds,
+      },
+    ],
+  }
+})
+
+const submissionStaffOptions = computed(() => {
+  return {
+    filter: [
+      {
+        handle: 'branchIds',
+        operator: 'in',
+        value: values.value.branchIds,
+      },
+    ],
+  }
+})
+
+const roleStaffOptions = computed(() => {
+  return {
+    filter: [
+      {
+        handle: 'virtualRoleIds',
+        operator: 'eq',
+        value: '646a42976af710fe3618af9a',
+      },
+    ],
+  }
+})
+
+const roleDecideStaffOptions = computed(() => {
+  return {
+    filter: [
+      {
+        handle: 'virtualRoleIds',
+        operator: 'eq',
+        value: '646a43106af710fe3618afca',
+      },
+    ],
+  }
+})
+
+const staffId = staff.value?.id || ''
+const branchIds = staff.value?.branchIds || []
+const branchDisplay = staff.value?.branches || []
+
+watch(isNew, setDefaultValues, { immediate: true })
+
+async function setDefaultValues() {
+  if (!isNew.value) return
+  await PromiseUtil.wait(500)
+
+  const defaultValues = {
+    submissionStaffIds: [staffId],
+    submissionStaffs: [{ id: staffId, flag: staff.value?.flag }],
+    branchIds: [branchIds[0]],
+    branches: [branchDisplay[0]],
+    preparedAt: new Date().toISOString(),
+  } satisfies Schema.Submission
+
+  values.value.preparedAt = defaultValues.preparedAt
+
+  if (staff?.value?.id) {
+    values.value.submissionStaffIds = defaultValues.submissionStaffIds
+    values.value.submissionStaffs = defaultValues.submissionStaffs
+  }
+
+  if (staff?.value?.branchIds) {
+    values.value.branchIds = defaultValues.branchIds
+    values.value.branches = defaultValues.branches
+  }
+}
+
+const syncRaise = async () => {
+  await executeOne('raiseSubmission', {
+    submissionId: id.value,
+    staffId: staff.value?.id,
+  })
+  await syncOne()
+  window.location.href = `/pengajuan/staff-submission/${id.value}`
+
+  // `/pengajuan/staff-submission?peek=neu:personalia:submission:${id.value}:single-staff-view:m`
+}
+
+const copyStaff = computed(() => {
+  executeOne('', { submissionId: id.value })
+  const linkStaff = `${window.location.origin}/pengajuan/staff-submission/${id.value}`
+
+  return {
+    icon: 'brands:link',
+    linkStaff,
+  }
+})
+
+const copyDecision = computed(() => {
+  executeOne('', { submissionId: id.value })
+  const linkDecision = `${window.location.origin}/pengajuan/decision-submission/${id.value}`
+  return {
+    icon: 'brands:link',
+    linkDecision,
+  }
+})
+
+const copyRaise = computed(() => {
+  executeOne('', { submissionId: id.value })
+  const linkAudit = `${window.location.origin}/pengajuan/audit-submission/${id.value}`
+  return {
+    icon: 'brands:link',
+    linkAudit,
+  }
+})
+
+const copyFollowup = computed(() => {
+  executeOne('', { submissionId: id.value })
+  const linkFollowup = `${window.location.origin}/pengajuan/follow-up-submission/${id.value}`
+  return {
+    icon: 'brands:link',
+    linkFollowup,
+  }
+})
+</script>
+
+<style scoped>
+.neu-submission-single {
+  @apply block;
+}
+</style>