[WIP] Настроил поля ввода документов, карточку создания события

2022-11-09 19:31:15 +03:00
parent 7b5129e8d1
commit 098f46e981
6 changed files with 48 additions and 15 deletions
--- a/package.json
+++ b/package.json
@@ -8,9 +8,12 @@
    "lint": "vue-cli-service lint"
  },
  "dependencies": {
+    "@vuelidate/core": "^2.0.0",
+    "@vuelidate/validators": "^2.0.0",
    "moment": "^2.29.4",
    "vue": "^3.2.13",
    "vue-router": "^4.1.5",
+    "vue-the-mask": "^0.11.1",
    "vuex": "^4.0.2"
  },
  "devDependencies": {
--- a/src/pages/calendar/components/CalendarFormAddEvent.vue
+++ b/src/pages/calendar/components/CalendarFormAddEvent.vue
@@ -1,7 +1,7 @@
 <template lang="pug">
  .flex.flex-col.gap-y-6.pt-6.pb-7.px-8.event-form.absolute.right-2.bottom-14
    .flex.justify-between
-      span.title.text-xl.font-bold Назначение события
+      span.title.text-xl.font-bold {{!selectedEventData.id ? "Назначение события" : "Изменение события"}}
      .flex.pt-2
        .icon-cancel.close-icon.tesxt-xs.cursor-pointer(@click="clearForm")
    .flex.flex-col.gap-y-8
@@ -337,7 +337,9 @@ export default {
      };
    },
    postCreateEvent(event) {
-      fetchWrapper.post("registry/event/create/", event);
+      fetchWrapper
+        .post("registry/event/create/", event)
+        .then(this.$emit("update-events"));
    },
    postUpdateEvent(id, event) {
      fetchWrapper
--- a/src/pages/clients/components/ClientDetailInfoSection.vue
+++ b/src/pages/clients/components/ClientDetailInfoSection.vue
@@ -46,6 +46,7 @@ export default {
    sectionInfo: Object,
    section: String,
    deleteDoc: Function,
+    updateDocument: Function,
  },
  data() {
    return {
@@ -75,6 +76,7 @@ export default {
    saveChange() {
      this.isOpenChange = false;
      this.isChange = false;
+      this.updateDocument();
    },
    openAddingWrap() {
      this.isOpenAddingWrap = true;
--- a/src/pages/clients/components/ClientDetailInfoWrapper.vue
+++ b/src/pages/clients/components/ClientDetailInfoWrapper.vue
@@ -1,10 +1,18 @@
 <template lang="pug">
  .w-full.h-fit.pt-4.flex.gap-x-4(class="px-[52px] pb-[30px]")
-    client-detail-info-section(v-model:section-info="dataDocument" section="pass")
+    client-detail-info-section(
+      v-model:section-info="dataDocument"
+      section="pass"
+    )
    .flex.flex-col
      client-detail-info-section(:section-info="dataAddress" section="addresses")
    .flex.flex-col
-      client-detail-info-section(:section-info="dataAttachments" section="docs" :save-new-doc="saveNewDoc" :delete-doc="deleteDoc")
+      client-detail-info-section(
+        :section-info="dataAttachments"
+        section="docs"
+        :save-new-doc="saveNewDoc"
+        :delete-doc="deleteDoc"
+      )
 </template>

 <script>
--- a/src/pages/clients/components/ClientsTableRow.vue
+++ b/src/pages/clients/components/ClientsTableRow.vue
@@ -14,7 +14,15 @@
          .icon-ok.text-xsm(class="pt-[3px]")
        .relative.dots-button.icon-dots.cursor-pointer.leading-6.text-center(v-show="!isOpenChange" :tabindex="1" @click="(e) => openPopup(e)" @blur="handleUnFocusPopup")
          clients-action-popup(v-if="isOpenPopup" :open-change-data="openChangeData")
-    client-detail-info-wrapper(v-if="isOpenDetailInfo" :data-address="dataAddress" :data-detail="dataDetail" :data-attachments="dataAttachments" :data-document="dataIdentityDocument" :save-new-doc="saveNewDoc" :delete-doc="deleteDoc")
+    client-detail-info-wrapper(
+      v-if="isOpenDetailInfo"
+      :data-address="dataAddress"
+      :data-detail="dataDetail"
+      :data-attachments="dataAttachments"
+      :data-document="dataIdentityDocument"
+      :save-new-doc="saveNewDoc"
+      :delete-doc="deleteDoc"
+    )
 </template>

 <script>
@@ -165,6 +173,14 @@ export default {
    postDeleteContact(contact) {
      fetchWrapper.del(`general/contact/${contact.id}/delete/`);
    },
+    postUpdateIdentityDocument() {
+      fetchWrapper.post(
+        `general/identity_document/${this.identity_document}/update/`,
+        {
+          series_number: this.dataIdentityDocument.numba,
+        }
+      );
+    },
    addNetwork(network) {
      this.dataClient.contacts.push(network);
    },
@@ -200,15 +216,15 @@ export default {
    },
    saveIdentityDocument(data) {
      this.dataIdentityDocument = {
-        numba: data?.numba || "-",
-        issued_by_org: data?.issued_by_org || "-",
-        issued_by_org_code: data?.issued_by_org_code || "-",
-        issued_by_date: data?.issued_by_date || "-",
+        numba: data?.numba || "",
+        issued_by_org: data?.issued_by_org || "",
+        issued_by_org_code: data?.issued_by_org_code || "",
+        issued_by_date: data?.issued_by_date || "",
      };
    },
    saveAddress(data) {
      this.dataAddress = {
-        join_adress: data?.join_adress || "-",
+        join_adress: data?.join_adress || "",
      };
    },
    saveAttachments(data) {
--- a/src/pages/clients/components/FormCreateIdentityDocuments.vue
+++ b/src/pages/clients/components/FormCreateIdentityDocuments.vue
@@ -5,25 +5,25 @@
      .grid.grid-cols-2.gap-x-4.gap-y-6
        .flex.flex-col(class="gap-y-1.5")
          span.text-sm Серия и номер
-          base-input.input-info(v-model:value="identityDocument.pass.series_number" placeholder="0000 000000" :width-input="277")
+          base-input.input-info(v-mask="'#### ######'" v-model:value="identityDocument.pass.series_number" placeholder="0000 000000" :width-input="277")
        .flex.flex-col(class="gap-y-1.5")
          span.text-sm Кем и когда выдан
          base-input.input-info(v-model:value="identityDocument.pass.issued_by_org" placeholder="Точно как в паспорте" :width-input="277")
        .flex.flex-col(class="gap-y-1.5")
          span.text-sm Код подразделения
-          base-input.input-info(v-model:value="identityDocument.pass.issued_by_org_code" placeholder="000–000" :width-input="277")
+          base-input.input-info(v-mask="'###-###'" v-model:value="identityDocument.pass.issued_by_org_code" placeholder="000–000" :width-input="277")
        .flex.flex-col(class="gap-y-1.5")
          span.text-sm Дата выдачи
-          base-input.input-info(type="date" v-model:value="identityDocument.pass.issued_by_date" placeholder="Дата" :width-input="277")
+          base-input.input-info( type="date" v-model:value="identityDocument.pass.issued_by_date" placeholder="Дата" :width-input="277")
    .flex.flex-col.gap-y-6.px-4
      span.title-info.text-base.font-bold СНИЛС и ИНН
      .grid.grid-cols-2.gap-x-4.gap-y-6
        .flex.flex-col(class="gap-y-1.5")
          span.text-sm Номер СНИЛС
-          base-input.input-info(v-model:value="identityDocument.snils.numba" placeholder="000–000–000 00" :width-input="277")
+          base-input.input-info(v-mask="'###-###-### ##'" v-model:value="identityDocument.snils.numba" placeholder="000–000–000 00" :width-input="277")
        .flex.flex-col(class="gap-y-1.5")
          span.text-sm Номер ИНН
-          base-input.input-info(v-model:value="identityDocument.inn.numba" placeholder="000000000000" :width-input="277")
+          base-input.input-info(v-mask="'##########'" v-model:value="identityDocument.inn.numba" placeholder="000000000000" :width-input="277")
    .px-4
      base-button(@click="saveClient" :size="40")
        span.font-semibold Создать клиента
@@ -32,6 +32,7 @@
 <script>
 import BaseButton from "@/components/base/BaseButton";
 import BaseInput from "@/components/base/BaseInput";
+import { mask } from "vue-the-mask";
 export default {
  name: "FormCreateIdentityDocuments",
  components: { BaseInput, BaseButton },
@@ -39,6 +40,7 @@ export default {
    identityDocument: Object,
    saveClient: Function,
  },
+  directives: { mask },
 };
 </script>