hl-core 0.0.7-beta.9 → 0.0.8

package/components/Pages/Documents.vue

@@ -0,0 +1,108 @@
+<template>
+  <section class="w-full px-[10px] pt-[14px] flex flex-col gap-2" :class="[$libStyles.scrollPage]" v-if="formStore.signedDocumentList && formStore.signedDocumentList.length">
+    <base-content-block v-for="document of formStore.signedDocumentList as DocumentItem[]" :key="document.id" :class="[$libStyles.textSimple]">
+      <h5 class="text-center font-medium mb-4">
+        {{ document.fileTypeName }}
+      </h5>
+      <div :class="[$libStyles.whiteBg, $libStyles.rounded]" class="p-2 h-12 flex items-center relative">
+        <span class="ml-2">{{ document.fileName }}</span>
+        <i
+          class="transition-all cursor-pointer mdi mdi-dots-vertical pl-2 mr-3 border-l-[1px] text-xl absolute right-0"
+          :class="[$libStyles.greenTextHover]"
+          @click="openPanel(document)"
+        ></i>
+      </div>
+    </base-content-block>
+  </section>
+  <base-list-empty v-else></base-list-empty>
+  <Teleport v-if="$dataStore.panelAction === null" to="#panel-actions">
+    <base-fade-transition>
+      <div :class="[$libStyles.flexColNav]">
+        <base-btn :disabled="documentLoading" :loading="documentLoading" text="Открыть" @click="getFile('view')"></base-btn>
+        <base-btn :disabled="documentLoading" :loading="documentLoading" text="Скачать" @click="getFile('download')"></base-btn>
+      </div>
+    </base-fade-transition>
+  </Teleport>
+</template>
+
+<script lang="ts">
+import { DocumentItem } from '@/composables/classes';
+
+export default defineComponent({
+  setup() {
+    const dataStore = useDataStore();
+    const formStore = useFormStore();
+    const currentDocument = ref<DocumentItem>(new DocumentItem());
+    const documentLoading = ref<boolean>(false);
+
+    const currentState = reactive<{ action: string; text: string }>({
+      action: '',
+      text: '',
+    });
+    const object_list = computed(() => Object.values(formStore.signedDocumentList));
+    const unSignedList = computed(() => document_list.value.filter(doc => doc.signed === false || doc.signed === null));
+    const document_list = computed(() =>
+      object_list.value.filter(obj => {
+        if (obj.fileTypeCode === '19' || obj.fileTypeCode === '5') {
+          return obj;
+        }
+      }),
+    );
+
+    const openPanel = async (document: DocumentItem) => {
+      dataStore.panelAction = null;
+      dataStore.panel.title = document.fileTypeName!;
+      currentDocument.value = document;
+      dataStore.panel.open = true;
+    };
+
+    watch(
+      () => document_list.value,
+      () => {
+        if (document_list.value.length > 1 && unSignedList.value.length) {
+          currentState.action = 'submit';
+          currentState.text = 'Все документы подписаны';
+        } else {
+          currentState.action = 'upload';
+          currentState.text = 'Сохранить';
+        }
+      },
+      {
+        immediate: true,
+      },
+    );
+
+    const getFile = async (type: FileActions) => {
+      if (currentDocument.value) {
+        documentLoading.value = true;
+        const fileExtension = currentDocument.value.fileName!.match(/\.([0-9a-z]+)(?:[\?#]|$)/i)![1];
+        await dataStore.getFile(currentDocument.value, type, fileExtension);
+        documentLoading.value = false;
+      }
+    };
+
+    const onInit = async () => {
+      await dataStore.getDicFileTypeList();
+      await dataStore.getSignedDocList(formStore.applicationData.processInstanceId);
+    };
+
+    onInit();
+
+    onUnmounted(() => {
+      dataStore.panel.open = false;
+      dataStore.panelAction = null;
+    });
+
+    return {
+      // State
+      formStore,
+      documentLoading,
+      DocumentItem,
+
+      // Functions
+      openPanel,
+      getFile,
+    };
+  },
+});
+</script>