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

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

@@ -0,0 +1,554 @@
+<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"
+        >
+          <div class="flex flex-wrap">
+            <div class="mt-2">
+              <NeonField v-if="isReady">
+                <template #input>
+                  <NeonButton
+                    size="md"
+                    color="danger"
+                    icon-left="circle-stop"
+                    :is-disabled="
+                      isNew ||
+                      isChanged ||
+                      values.status === 'prepared' ||
+                      values.status === 'raised' ||
+                      values.delayStaffIds?.includes(staff?.id || '')
+                        ? true
+                        : false
+                    "
+                    @click="syncDelay"
+                    >Ditunda</NeonButton
+                  >
+                </template>
+              </NeonField>
+            </div>
+            &nbsp;&nbsp;
+            <div class="mt-2">
+              <NeonField v-if="isReady">
+                <template #input>
+                  <NeonButton
+                    size="md"
+                    color="success"
+                    icon-left="list-check"
+                    :is-disabled="
+                      isNew ||
+                      isChanged ||
+                      values.status === 'prepared' ||
+                      values.status === 'raised' ||
+                      values.agreedStaffIds?.includes(staff?.id || '')
+                        ? true
+                        : false
+                    "
+                    @click="syncApproved"
+                    >Disetujui</NeonButton
+                  >
+                </template>
+              </NeonField>
+            </div>
+          </div>
+
+          <NeonField
+            v-model="values.title"
+            v-bind="fields.title"
+            :is-disabled="
+              values.status === 'raised' ||
+              values.status === 'processed' ||
+              values.status === 'delay' ||
+              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 === 'delay' ||
+              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 === 'delay' ||
+                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 === 'delay' ||
+                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 === 'delay' ||
+                    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="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 === 'delay' ||
+                    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 === 'delay' ||
+                    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 === 'delay' ||
+              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
+          />
+
+          <NeonDivider is-dashed label="Spesifikasi" />
+
+          <NeonField
+            v-model="values.workingHours"
+            v-bind="fields.workingHours"
+            :is-disabled="
+              values.status === 'raised' ||
+              values.status === 'processed' ||
+              values.status === 'delay' ||
+              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 === 'delay' ||
+          values.status === 'approved' ||
+          values.status === 'monitored' ||
+          values.status === 'discontinued' ||
+          values.status === 'resolved'
+        "
+      />
+
+      <!-- PROGRESS -->
+      <OfficeTab
+        v-if="!isNew"
+        handle="progress"
+        icon="info-circle"
+        title="Progress"
+      >
+        <OfficeCollectionRelated
+          definition="neu:personalia:progress"
+          title="Progress"
+          description="Progress dari tindaklanjut."
+          :query="
+            Query.define({
+              filter: [
+                {
+                  submissionIds: id,
+                },
+              ],
+              sort: {
+                handle: 'startedAt',
+                direction: 'ascending',
+              },
+            })
+          "
+          :is-ready="isReady"
+          :columns="[
+            'startedAt',
+            'endedAt',
+            'detail',
+            'staffs',
+            'virtualIsNotes',
+            'accessStaffs',
+          ]"
+          :sorts="['startedAt', 'startedAt', 'createdAt', 'updatedAt']"
+          :filters="['staff']"
+          :initial-values="{
+            submissionIds: id,
+            submissions: values,
+          }"
+          :excludes="['create']"
+        >
+        </OfficeCollectionRelated>
+      </OfficeTab>
+    </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 } from '@neon.id/interfaces'
+import {
+  OfficeCollectionRelated,
+  OfficeRelation,
+  OfficeTab,
+  OfficeTabs,
+} from '@neon.id/office'
+import { Query } from '@neon.id/query'
+import { useOperasional } from '../../../common'
+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 syncDelay = async () => {
+  await executeOne('delaySubmission', {
+    submissionId: id.value,
+    staffId: staff.value?.id,
+  })
+  await syncOne()
+  window.location.href = `/pengajuan/decision-submission/${id.value}`
+  // window.location.href = `/pengajuan/decision-submission?peek=neu:personalia:submission:${id.value}:single-decision-view:m`
+}
+
+const syncApproved = async () => {
+  await executeOne('approvedSubmission', {
+    submissionId: id.value,
+    staffId: staff.value?.id,
+  })
+  await syncOne()
+  window.location.href = `/pengajuan/decision-submission/${id.value}`
+  // window.location.href = `/pengajuan/decision-submission?peek=neu:personalia:submission:${id.value}:single-decision-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>