Merge pull request #150 from dderbentsov/UC-41

[WIP] Добавил popup для документов

src/assets/icons/doc.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M5 20V4C5 3.44772 5.44771 3 6 3H12.7442C13.0143 3 13.2729 3.10926 13.4612 3.30292L18.717 8.70891C18.8985 8.89557 19 9.14565 19 9.40599V20C19 20.5523 18.5523 21 18 21H6C5.44772 21 5 20.5523 5 20Z" stroke="#4772F2" stroke-width="1.5" stroke-linecap="round"/>
+</svg>

src/assets/icons/manyDoc.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M6.40909 4.74437H11.6072C12.0221 4.74437 12.4185 4.91622 12.7021 5.21906L16.913 9.71566C17.1733 9.99361 17.3182 10.3602 17.3182 10.741V19.2086M9.68798 2H13.9407C14.3673 2 14.7738 2.1817 15.0584 2.49963L20.1177 8.15233C20.3639 8.42738 20.5 8.78367 20.5 9.15281C20.5 10.3844 20.5 10.847 20.5 12.3317C20.5 14.0263 20.5 14.3548 20.5 16.0494M10.1597 7.84976L14.1367 12.0682C14.3117 12.2538 14.4091 12.4992 14.4091 12.7542V21C14.4091 21.5523 13.9614 22 13.4091 22H4.5C3.94772 22 3.5 21.5523 3.5 21V8.53574C3.5 7.98346 3.94772 7.53574 4.5 7.53574H9.43206C9.7075 7.53574 9.97074 7.64935 10.1597 7.84976Z" stroke="#4772F2" stroke-width="1.5" stroke-linecap="round"/>
+</svg>

src/pages/clients/components/ClientDetailInfoSection.vue

@@ -28,8 +28,14 @@
             :size="24"
           )
             .icon-plus(class="pt-[2px]")
+          base-popup.right-3.top-5(v-if="section === 'docs' && isOpenAddingWrap", :width="244")
+            table-choice-adding-doc(
+              :add-new-doc="addNewDoc",
+              :save-docs="saveDocs",
+              :new-docs="docData"
+            )  
           table-adding-new-doc(
-            v-if="section === 'docs' && isOpenAddingWrap",
+            v-if="section !== 'docs' && isOpenAddingWrap",
             :add-new-doc="addNewDoc",
             :save-docs="saveDocs",
             :new-docs="docData"
@@ -108,7 +114,9 @@ import BaseButton from "@/components/base/BaseButton";
 import TableAddingNewDoc from "@/pages/clients/components/TableAddingNewDoc";
 import TableAddingNewAdditional from "@/pages/clients/components/TableAddingNewAdditional";
 import ClientDetailSectionAddress from "@/pages/clients/components/ClientDetailSectionAddress";
+import TableChoiceAddingDoc from "@/pages/clients/components/TableChoiceAddingDoc";
 import BaseInput from "@/components/base/BaseInput";
+import BasePopup from "@/components/base/BasePopup";
 import { detail } from "@/pages/clients/utils/tableConfig";
 import pdfIcon from "@/assets/icons/pdf.svg";
 import wordIcon from "@/assets/icons/word.svg";
@@ -119,9 +127,11 @@ export default {
     TableAddingNewAdditional,
     BaseButton,
     BaseInput,
+    BasePopup,
     ClientDetailInput,
     TableAddingNewDoc,
     ClientDetailSectionAddress,
+    TableChoiceAddingDoc,
   },
   props: {
     saveNewDoc: Function,

src/pages/clients/components/TableChoiceAddingDoc.vue

@@ -0,0 +1,33 @@
+<template lang="pug">
+  .flex.flex-col.gap-y-3
+    .button.keep-redaction.flex.items-center.gap-x-2
+      img(:src="docIcon")
+      span.text-smm Создать пакет документов
+    .button.keep-redaction.flex.items-center.gap-x-3
+      img(:src="manyDocIcon")
+      span.text-smm Добавить документы
+</template>
+
+<script>
+import docIcon from "@/assets/icons/doc.svg";
+import manyDocIcon from "@/assets/icons/manyDoc.svg";
+
+export default {
+  name: "TableChoiceAddingDoc",
+  data() {
+    return {
+      docIcon,
+      manyDocIcon,
+    };
+  },
+};
+</script>
+
+<style lang="sass" scoped>
+.keep-redaction
+  color: var(--font-dark-blue-color)
+
+.button
+  &:hover
+    opacity: 0.7
+</style>

tailwind.config.js

@@ -13,6 +13,7 @@ module.exports = {
         xs: ["13px", { lineHeight: "15px" }],
         xss: ["13px", { lineHeight: "19px" }],
         sm: ["14px", { lineHeight: "16px" }],
+        smm: ["14px", { lineHeight: "19px" }],
         base: ["16px", { lineHeight: "19px" }],
         m: ["16px", { lineHeight: "21.6px" }],
         lg: ["18px", { lineHeight: "21px" }],