[WIP] Исправил стили инпутов

2023-01-19 15:31:23 +03:00
parent e0831f521f
commit 61085dc51a
33 changed files with 140 additions and 281 deletions
--- a/src/pages/calendar/components/CalendarFormAddEvent.vue
+++ b/src/pages/calendar/components/CalendarFormAddEvent.vue
@@ -17,7 +17,8 @@
        v-else,
        disabled,
        v-model="status.label",
-        label="Статус приема"
+        label="Статус приема",
+        outlined
      )
      base-custom-select(
        :items="ownersList",
@@ -35,19 +36,22 @@
      base-input(
        v-model="eventDate",
        label="Дата",
-        type="date"
+        type="date",
+        outlined
      )
      .flex.gap-x-2.items-center.justify-between
        base-input(
          type="time",
          v-model="startTime",
-          label="Начало"
+          label="Начало",
+          outlined
        )
        span.mt-4 —
        base-input(
          type="time",
          v-model="endTime",
-          label="Конец"
+          label="Конец",
+          outlined
        )
    q-btn.create-button(
      v-if="!selectedEventData.id",
--- a/src/pages/clients/components/ClientDetailInfoSection.vue
+++ b/src/pages/clients/components/ClientDetailInfoSection.vue
@@ -113,7 +113,8 @@
            base-input(
              type="date",
              v-else-if="isChange && section !== 'docs' && section !== 'additional'",
-              v-model="sectionInfo.issued_by_date"
+              v-model="sectionInfo.issued_by_date",
+              outlined
            )
              .copy.icon-copy.cursor-pointer(
                v-if="item.copy",
--- a/src/pages/clients/components/ClientDetailInput.vue
+++ b/src/pages/clients/components/ClientDetailInput.vue
@@ -5,7 +5,8 @@
    :placeholder="placeholder",
    :maxLength="maxLength",
    :mask="sharp",
-    :autogrow="choiceGrow"
+    :autogrow="choiceGrow",
+    outlined
  )
    slot
 </template>
--- a/src/pages/clients/components/ClientDetailSectionAddress.vue
+++ b/src/pages/clients/components/ClientDetailSectionAddress.vue
@@ -14,7 +14,8 @@
      labelStyle="text-xxs",
      textStyle="text-sm",
      v-model="dopeAddress.region",
-      label="Область"
+      label="Область",
+      outlined
    )
    base-input(
      disabled,
@@ -22,7 +23,8 @@
      labelStyle="text-xxs",
      textStyle="text-sm",
      v-model="dopeAddress.street",
-      label="Улица"
+      label="Улица",
+      outlined
    )
    .flex.gap-x-4
      base-input(
@@ -40,6 +42,7 @@
        v-model="dopeAddress.flat",
        labelStyle="text-xxs",
        textStyle="text-sm",
+        outlined
      )
    base-input(
      disabled,
@@ -49,6 +52,7 @@
      v-model="dopeAddress.index",
      labelStyle="text-xxs",
      textStyle="text-sm",
+      outlined
    )
 </template>

--- a/src/pages/clients/components/ClientsTableHat.vue
+++ b/src/pages/clients/components/ClientsTableHat.vue
@@ -7,7 +7,8 @@
          icon-position="left",
          v-model="searchClient",
          placeholder="Введите фамилию",
-          @keyup.enter="searchLastName"
+          @keyup.enter="searchLastName",
+          outlined
        )
          .flex.items-center.cursor-pointer
            .icon-search
--- a/src/pages/clients/components/FormCreateAdditional.vue
+++ b/src/pages/clients/components/FormCreateAdditional.vue
@@ -1,68 +0,0 @@
-<template lang="pug">
-  .wrapper-additional.flex.flex-col.gap-y-8.justify-between.text-base
-    .flex.flex-col.gap-y-6.w-full.px-4
-      .flex.flex-col.gap-y-4.w-full(v-for="info in additionalInfo" :key="info.id")
-        .flex.flex-col.gap-y-1
-          base-input(v-model="info.header" placeholder="Заголовок")
-          .flex.px-4.py-3.description
-            textarea.w-full.h-full.outline-0.resize-none(:value="info.description" @input="$emit('update:info.description', $event.target.value)" placeholder="Описание" style="py-10")
-        .upload-wrapper.flex.flex-col.justify-center.items-center
-          .upload-text.text-center.flex.w-fit
-            input.hidden(@change="(e) => saveFile(e)" type="file" :id="info.id")
-            span Загрузите элемент
-              label.label.cursor-pointer(:for="info.id")  с комьютера
-              span  или перетащите их сюда
-      .add-additional.flex.gap-x-3.cursor-pointer(@click="addNewAdditional")
-        .icon-plus
-        span Добавить еще пункт
-    .px-4
-      base-button(@click="saveClient" :size="40")
-        span.font-semibold Создать клиента
-</template>
-
-<script>
-import BaseInput from "@/components/base/BaseInput";
-import BaseButton from "@/components/base/BaseButton";
-export default {
-  name: "FormCreateAdditional",
-  components: { BaseInput, BaseButton },
-  props: {
-    additionalInfo: Object,
-    saveClient: Function,
-    addNewAdditional: Function,
-    saveFile: Function,
-  },
-};
-</script>
-
-<style lang="sass" scoped>
-.wrapper-additional
-  min-height: 443px
-  max-height: 443px
-  overflow-y: auto
-  &::-webkit-scrollbar
-    width: 4px
-  &::-webkit-scrollbar-track
-    background-color: rgba(211, 212, 220, 0.5)
-    border-radius: 8px
-  &::-webkit-scrollbar-thumb
-    border-radius: 8px
-    background-color: var(--btn-blue-color)
-.upload-wrapper
-  min-height: 92px
-  max-height: 92px
-  width: 100%
-  color: var(--font-grey-color)
-  border: 2px dashed var(--font-grey-color)
-  border-radius: 4px
-.upload-text
-  max-width: 278px
-.label
-  color: var(--btn-blue-color)
-.description
-  min-height: 77px
-  border-radius: 4px
-  border: 2px solid var(--border-light-grey-color)
-.add-additional
-  color: var(--btn-blue-color)
-</style>
--- a/src/pages/clients/components/FormCreateAddresses.vue
+++ b/src/pages/clients/components/FormCreateAddresses.vue
@@ -4,7 +4,8 @@
      base-input(
        v-model="addresses.full_address",
        placeholder="Введите адрес целиком",
-        label="Полный адрес"
+        label="Полный адрес",
+        outlined
      )
      .flex.items-center.justify-center.relative
        .line.absolute
@@ -15,35 +16,40 @@
          filled,
          placeholder="Введите город",
          v-model="addresses.city",
-          label="Город"
+          label="Город",
+          outlined
        )
        base-input(
          disabled,
          filled,
          placeholder="Введите область",
          v-model="addresses.region",
-          label="Область"
+          label="Область",
+          outlined
        )
        base-input(
          disabled,
          filled,
          placeholder="Введите улицу",
          v-model="addresses.street",
-          label="Введите улицу"
+          label="Введите улицу",
+          outlined
        )
        base-input(
          disabled,
          filled,
          placeholder="Номер дома",
          v-model="addresses.house_number",
-          label="Дом"
+          label="Дом",
+          outlined
        )
        base-input(
          disabled,
          filled,
          placeholder="Номер квартиры",
          v-model="addresses.apartment_number",
-          label="Квартира"
+          label="Квартира",
+          outlined
        )
        base-input(
          disabled,
@@ -51,7 +57,8 @@
          placeholder="000000",
          mask="######",
          v-model="addresses.zip_code",
-          label="Индекс"
+          label="Индекс",
+          outlined
        )
 </template>

--- a/src/pages/clients/components/FormCreateBasicInfo.vue
+++ b/src/pages/clients/components/FormCreateBasicInfo.vue
@@ -10,18 +10,21 @@
      base-input(
        type="date"
        v-model="basicInfo.birth_date",
-        label="Дата рождения"
+        label="Дата рождения",
+        outlined
      )
      base-input(
        v-model="phone.username",
        placeholder="+7 (915) 644–92–23",
        mask="+7 (###) ###-##-##",
-        label="Номер телефона"
+        label="Номер телефона",
+        outlined
      )
      base-input(
        v-model="email.username",
        placeholder="user@yandex.ru",
-        label="Email"
+        label="Email",
+        outlined
      )
      .flex.flex-col.col-start-1.col-end-3.w-100(class="gap-y-1.5")
        span.text-sm.font-semibold.opacity-40.input-info Ссылки на соцсети
--- a/src/pages/clients/components/FormCreateIdentityDocuments.vue
+++ b/src/pages/clients/components/FormCreateIdentityDocuments.vue
@@ -7,24 +7,28 @@
          mask="#### ######",
          v-model="identityDocument.pass.series_number",
          placeholder="0000 000000",
-          label="Серия и номер"
+          label="Серия и номер",
+          outlined
        )
        base-input(
          v-model="identityDocument.pass.issued_by_org",
          placeholder="Точно как в паспорте",
-          label="Кем выдан"
+          label="Кем выдан",
+          outlined
        )
        base-input(
          mask="###-###",
          v-model="identityDocument.pass.issued_by_org_code",
          placeholder="000–000",
-          label="Код подразделения"
+          label="Код подразделения",
+          outlined
        )
        base-input(
          type="date"
          v-model="identityDocument.pass.issued_by_date",
          placeholder="Дата",
-          label="Дата выдачи"
+          label="Дата выдачи",
+          outlined
        )
    .flex.flex-col.gap-y-6
      span.title-info.text-base.font-bold СНИЛС и ИНН
@@ -35,7 +39,8 @@
          mask="###-###-### ##",
          v-model="identityDocument.snils.number",
          placeholder="000–000–000 00",
-          label="Номер СНИЛС"
+          label="Номер СНИЛС",
+          outlined
        )
        base-input(
          disabled,
@@ -43,7 +48,8 @@
          mask="############",
          v-model="identityDocument.inn.number",
          placeholder="000000000000",
-          label="Номер ИНН"
+          label="Номер ИНН",
+          outlined
        )
 </template>

--- a/src/pages/clients/components/FormsAgreementCreate/AgreementCommon.vue
+++ b/src/pages/clients/components/FormsAgreementCreate/AgreementCommon.vue
@@ -11,17 +11,20 @@
      base-input(
        type="date",
        v-model="signedDate",
-        label="Дата подписания"
+        label="Дата подписания",
+        outlined
      )        
      base-input(
        type="date",
        v-model="startDate",
        label="Начало оказания услуг"
+        outlined
      )        
      base-input(
        type="date",
        v-model="endDate",
        label="Окончание оказания услуг"
+        outlined
      )         
    base-custom-select(
      placeholder="Поручить",
--- a/src/pages/clients/components/FormsAgreementCreate/AgreementPerson.vue
+++ b/src/pages/clients/components/FormsAgreementCreate/AgreementPerson.vue
@@ -5,6 +5,7 @@
      label="ФИО пациента",
      v-model="patientFullName",
      disabled
+      outlined
    )
    //-.flex.justify-between
      base-custom-select.w-80(
--- a/src/pages/clients/components/FormsAgreementCreate/AgreementServices.vue
+++ b/src/pages/clients/components/FormsAgreementCreate/AgreementServices.vue
@@ -12,16 +12,19 @@
        type="date",
        v-model="signedDate",
        label="Дата подписания"
+        outlined
      )
      base-input(
        type="date",
        v-model="startDate",
        label="Начало оказания услуг"
+        outlined
      )
      base-input(
        type="date",
        v-model="endDate",
        label="Окончание оказания услуг"
+        outlined
      )         
    base-custom-select(
      placeholder="Поручить",
--- a/src/pages/clients/components/TableCreateNote.vue
+++ b/src/pages/clients/components/TableCreateNote.vue
@@ -1,7 +1,7 @@
 <template lang="pug">
  .flex.flex-col.gap-y-3
    .flex.flex-col.gap-y-3.relative
-      base-input.text-smm(placeholder="Заголовок", v-model="title", :maxLength="40")
+      base-input.text-smm(placeholder="Заголовок", v-model="title", :maxLength="40", outlined)
      .text.flex.absolute.text-xsx.right-7.top-3 {{`${changeValue}/40`}}
    .input-wrapper.flex.gap-x-2.px-4.box-border.w-max-fit.text-smm(class="py-2.5")
      textarea.place-input.w-full.outline-0.not-italic.resize-none(
--- a/src/pages/clients/components/TableCreatePackageDoc.vue
+++ b/src/pages/clients/components/TableCreatePackageDoc.vue
@@ -17,7 +17,8 @@
          .counter.font-semibold.text-smm ФИО
          base-input(
            v-model="patient",
-            placeholder="Введите название для пакета документов"
+            placeholder="Введите название для пакета документов",
+            outlined
          )
            span.counter 
        .flex.gap-x-4
@@ -27,7 +28,7 @@
          .flex.flex-col(class="gap-y-1.5")
            .counter.font-semibold.text-smm Дата подписания
            .input-date.flex.h-10.justify-center
-              base-input(type="date", :width-input="277")
+              base-input(type="date", :width-input="277", outlined)
      .flex.flex-col.gap-y-6
        span.font-bold Дополнительное
        .flex.flex-col.mb-124px(class="gap-y-1.5")
@@ -44,7 +45,8 @@
              :with-icon="true",
              icon-position="left",
              :width-input="310",
-              placeholder="Поиск"
+              placeholder="Поиск",
+              outlined
            )
              .counter.icon-search
            base-select.h-10(placeholder="Вид услуги")
--- a/src/pages/clients/components/cells/TableCellBodyBirthday.vue
+++ b/src/pages/clients/components/cells/TableCellBodyBirthday.vue
@@ -8,7 +8,8 @@
      type="date",
      v-if="isOpenChange",
      @click.stop,
-      v-model="value.age"
+      v-model="value.age",
+      outlined
    )
 </template>

--- a/src/pages/clients/components/cells/TableCellBodyEmail.vue
+++ b/src/pages/clients/components/cells/TableCellBodyEmail.vue
@@ -12,7 +12,8 @@
        v-if="isOpenChange",
        @click.stop,
        v-model="value.email.username",
-        :placeholder="value.email.username"
+        :placeholder="value.email.username",
+        outlined
      )
 </template>

--- a/src/pages/clients/components/cells/TableCellBodyName.vue
+++ b/src/pages/clients/components/cells/TableCellBodyName.vue
@@ -10,7 +10,8 @@
      base-input(
        @click.stop,
        v-model="value.fullName",
-        placeholder="Фамилия Имя Отчество"
+        placeholder="Фамилия Имя Отчество",
+        outlined
      )
 </template>

--- a/src/pages/clients/components/cells/TableCellBodyPhone.vue
+++ b/src/pages/clients/components/cells/TableCellBodyPhone.vue
@@ -8,7 +8,8 @@
        @click.stop,
        v-model="value.phone.username",
        :placeholder="value.phone.username",
-        mask="+7 (###) ###-##-##"
+        mask="+7 (###) ###-##-##",
+        outlined
      )
 </template>

--- a/src/pages/login/TheLogin.vue
+++ b/src/pages/login/TheLogin.vue
@@ -15,13 +15,15 @@
            v-model="user.username",
            placeholder="Введите ваш логин",
            label="Логин"
+            outlined
          )
          base-input(
            :rule="[wrongData => !!wrongData]",
            v-model="user.password",
            :type="changeType",
            placeholder="Введите ваш пароль",
-            label="Пароль"
+            label="Пароль",
+            outlined
          )
            .flex.items-center.cursor-pointer
              q-icon(
@@ -30,8 +32,8 @@
                @click="changeView"
              )
          span.font-medium(:style="{color: this.redColor}", v-if="wrongData") Неверный логин или пароль
-          .flex.items-center.gap-x-11px
-            input.w-4.h-4.checkbox.cursor-pointer(@click="persist", type="checkbox")
+          .flex.items-center.gap-x-8px
+            q-checkbox(@click="persist", v-model="isView", type="checkbox")
            .flex.non-italic.font-medium.base Запомнить меня
        base-button.font-semibold(:disabled="disabledButton", :size="48", @click="login") Войти в аккаунт
      .absolute.left-12.bottom-12 2022 © Астра
@@ -43,6 +45,7 @@ import { fetchWrapper } from "@/shared/fetchWrapper";
 import BaseInput from "@/components/base/BaseInput";
 import BaseButton from "@/components/base/BaseButton";
 import logoMark from "@/assets/images/logoMark.svg";
+
 export default {
  name: "TheLogin",
  components: { BaseInput, BaseButton },
--- a/src/pages/medicalCard/components/MedicalBaseData.vue
+++ b/src/pages/medicalCard/components/MedicalBaseData.vue
@@ -6,7 +6,8 @@
        base-input.w-full(
          placeholder="ФИО*",
          v-model="clientDetail.fullName",
-          disabled
+          disabled,
+          outlined
        )
        base-radio-buttons-group(
          :items="gendersList",
@@ -20,6 +21,7 @@
              type="date",
              label="Дата рождения",
              v-model="clientDetail.birth_date",
+              outlined
            )
          .input
            base-input(
@@ -27,15 +29,18 @@
              mask="###-###-### ##",
              label="СНИЛС",
              v-model="clientDetail.insurance_number",
+              outlined
            )
        .flex.flex-col.gap-y-6
          base-input(
            label="Адрес регистрации",
-            placeholder="Введите полный адрес"
+            placeholder="Введите полный адрес",
+            outlined
          )
          base-input(
            label="Фактический адрес места жительства",
-            placeholder="Введите полный адрес"
+            placeholder="Введите полный адрес",
+            outlined
          )
        .flex.gap-x-4
          .input
@@ -44,12 +49,14 @@
              placeholder="+7 (915) 644–92–23",
              mask="+7 (###) ###-##-##",
              v-model="clientDetail.phone",
+              outlined
            )
          .input
            base-input(
              label="Email",
              placeholder="user@yandex.ru"
              v-model="clientDetail.email",
+              outlined
            )
 </template>

--- a/src/pages/medicalCard/components/MedicalCardWrapper.vue
+++ b/src/pages/medicalCard/components/MedicalCardWrapper.vue
@@ -86,7 +86,7 @@
          .flex.flex-col.gap-y-2(v-for="(key, index) in Object.keys(dentalIndications)")
            span.font-bold.text-xsx {{`${index+1}. ${configData.dental_indications[key]}`}}
            medical-dental-formula(v-if="key === 'dental_formula'" :formula-data="dentalIndications[key]")
-            base-input(v-model="dentalIndications[key]" v-else)
+            base-input(v-model="dentalIndications[key]", outlined, v-else)
        .flex.justify-center
          base-button.w-fit(:icon-left-size="13", :size="40")
            span.font-semibold Сохранить
--- a/src/pages/medicalCard/components/MedicalIdentityDocuments.vue
+++ b/src/pages/medicalCard/components/MedicalIdentityDocuments.vue
@@ -6,23 +6,27 @@
        base-input(
          label="Серия и номер",
          placeholder="0000 000000",
-          v-model="clientDetail.identity_documents.number"
+          v-model="clientDetail.identity_documents.number",
+          outlined
        )
        base-input(
          label="Кем выдан",
          placeholder="Точно как в паспорте",
-          v-model="clientDetail.identity_documents.issued_by_org"
+          v-model="clientDetail.identity_documents.issued_by_org",
+          outlined
        )
        .flex.gap-x-4
          base-input(
            label="Код подразделения",
            placeholder="000-000",
-            v-model="clientDetail.identity_documents.issued_by_org_code"
+            v-model="clientDetail.identity_documents.issued_by_org_code",
+            outlined
          )
          base-input(
            type="date",
            label="Дата выдачи",
-            v-model="clientDetail.identity_documents.issued_by_date"
+            v-model="clientDetail.identity_documents.issued_by_date",
+            outlined
          )
 </template>

--- a/src/pages/medicalCard/components/MedicalPolicyDocuments.vue
+++ b/src/pages/medicalCard/components/MedicalPolicyDocuments.vue
@@ -14,12 +14,14 @@
          placeholder="000000 0000000000",
          v-model="clientDetail.OMSPolicy.number",
          mask="###### ##########",
-          :disabled="!selectedOMSPolicy"
+          :disabled="!selectedOMSPolicy",
+          outlined
        )
        base-input.input(
          label="Страховая организация полиса ОМС",
          v-model="clientDetail.OMSPolicy.organization",
-          :disabled="!selectedOMSPolicy"
+          :disabled="!selectedOMSPolicy",
+          outlined
        )
      .flex.flex-col.gap-y-4
        base-input.input(
@@ -27,25 +29,30 @@
          placeholder="000000 0000000000",
          v-model="clientDetail.DMSPolicy.number",
          mask="###### ##########",
-          :disabled="selectedOMSPolicy"
+          :disabled="selectedOMSPolicy",
+          outlined
        )
        base-input.input(
          label="Страховая организация полиса ДМС",
          v-model="clientDetail.DMSPolicy.organization",
-          :disabled="selectedOMSPolicy"
+          :disabled="selectedOMSPolicy",
+          outlined
        )
    base-input(
      label="Код категории льготы",
      placeholder="000",
-      v-model="clientDetail.benefit_code",
+      v-model="clientDetail.benefit_code",,
+      outlined
    )
    base-input(
      label="К кому обращаться в случае необходимости",
-      placeholder="ФИО*"
+      placeholder="ФИО*",
+      outlined
    )
    base-input(
      label="Номер телефона",
-      placeholder="+7 (915) 644–92–23"
+      placeholder="+7 (915) 644–92–23",
+      outlined
    )
 </template>

--- a/src/pages/schedule/components/FormChangeShift.vue
+++ b/src/pages/schedule/components/FormChangeShift.vue
@@ -7,13 +7,23 @@
      .flex.pt-2
        .icon-cancel.close-icon.tesxt-xs.cursor-pointer(@click="closeForm")
    .flex.flex-col.gap-y-6
-      base-input(label="Дата", type="date")
+      base-input(label="Дата", type="date", outlined)
      base-custom-select(v-model="currentEmployee", label="Текущий сотрудник")
      base-custom-select(v-model="currentEmployee", label="Замена сотрудника")
      .time-wrapper.flex.justify-center.gap-x-6
-        base-input(type="time", label="Начало", v-model="timesShift.start_time")
+        base-input(
+          type="time",
+          label="Начало",
+          v-model="timesShift.start_time",
+          outlined
+        )
        .flex.items-center.mt-4 —
-        base-input(type="time", label="Конец", v-model="timesShift.end_time")
+        base-input(
+          type="time",
+          label="Конец",
+          v-model="timesShift.end_time",
+          outlined
+        )
      .flex.justify-center
        base-button.font-semibold(:size="40") Сохранить
 </template>
--- a/src/pages/schedule/components/ScheduleBar.vue
+++ b/src/pages/schedule/components/ScheduleBar.vue
@@ -5,13 +5,15 @@
        base-input(
          type="time",
          v-model="times.start_time",
-          label="Начало"
+          label="Начало",
+          outlined
        )
        .flex.items-center.mt-6 —
        base-input(
          type="time",
          v-model="times.end_time",
-          label="Конец"
+          label="Конец",
+          outlined
        )
      .status-wrapper.flex.flex-col.gap-y-3.p-3
        .flex.justify-center.items-center.h-10
@@ -40,7 +42,8 @@
          mask="#/#",
          placeholder="0/0",
          label="Введите график",
-          v-model="template.item.label"
+          v-model="template.item.label",
+          outlined
        )
    .flex.justify-center.gap-x-6.h-10
      q-btn(