admin/astra-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'ASTRA-157' into 'master'

Browse Source 
Исправила базовые кнопки

See merge request andrusyakka/urban-couscous!469
This commit is contained in:
Daria Golova
2023-07-12 13:14:37 +00:00
parent 73b40e4b0e 7458a1dd32
commit 861efe63fa
22 changed files with 171 additions and 213 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
src/components/base/BaseButton.vue
View File

@@ -3,7 +3,7 @@
:label="miniSize || round ? '' : label",
no-caps,
:class="btnClass"
:style="{width: miniSize ? '40px' : width, 'min-width': (miniSize || round) && '0px', ...btnStyle}",
:style="{width: miniSize ? '40px' : width, 'min-width': width, ...btnHeight}",
:round="miniSize || round",
:padding="computedPadding",
:disable="disable"
@@ -40,7 +40,7 @@ export default {
[this.type]: true,
};
},
btnStyle() {
btnHeight() {
if (this.size === "L")
return {
height: "48px",
@@ -51,6 +51,13 @@ export default {
"min-height": "40px",
};
},
btnWidth() {
return !this.width === "auto"
? {
"min-width": this.width,
}
: {};
},
miniSize() {
return this.type === "mini";
},

22
src/components/base/BaseCategorySelection.vue
View File

@@ -31,24 +31,16 @@
)
.name.flex.items-center.font-medium.text-xm {{benefit.name}}
.buttons-group.flex.py-4.px-8.justify-center
q-btn(
color="primary",
outline,
size="16px",
no-caps,
label="Отменить",
:style="{width: '126px', height: '40px'}",
padding="0",
base-button(
type="secondary",
label="Сбросить",
width="146px",
@click="closeModalCategories"
)
q-btn(
base-button(
v-if="selected[0]?.id",
color="primary",
size="16px",
no-caps,
label="Сохранить изменения",
:style="{width: '132px', height: '40px'}",
padding="0",
label="Сохранить",
width="146px",
@click="saveCategories(selected[0])"
)
.right-side.flex.px-14.font-bold.relative

21
src/components/base/BaseClientFormCreate.vue
View File

@@ -55,12 +55,14 @@
)
.avatar.flex.absolute.items-center.gap-x-6
img.avatar.object-cover(for="image-upload", :src="image", v-if="image")
q-btn(
round,
color="primary",
base-button(
width="48px",
@click="closeAddImage",
icon="app:icon-ok"
size="L",
round,
padding="2px 0 0 0"
)
q-icon(name="app:ok", size="20px")
base-input.w-full(v-model="infoClient.basic.full_name", placeholder="ФИО*", outlined)
.flex.flex-col.flex-auto.l.gap-y-8
.flex
@@ -83,14 +85,7 @@
:save-file="saveDocFile",
:networks-list="getNetworksList",
)
q-btn(
label="Создать клиента",
color="primary",
style="height: 40px; width: 180px",
no-caps,
padding="8px 24px",
@click="saveClient",
)
base-button(label="Создать клиента", width="180px", @click="saveClient")
</template>
<script>
@@ -107,6 +102,7 @@ import TheNotificationProvider from "@/components/Notifications/TheNotificationP
import { addNotification } from "@/components/Notifications/notificationContext";
import * as moment from "moment";
import { v_model } from "@/shared/mixins/v-model";
import BaseButton from "@/components/base/BaseButton.vue";
export default {
name: "BaseClientFormClient",
@@ -119,6 +115,7 @@ export default {
BaseModal,
addImageIcon,
TheNotificationProvider,
BaseButton,
},
props: {
setUpdatedClients: Function,

12
src/components/base/BaseInputFullName.vue
View File

@@ -33,7 +33,14 @@
)
.avatar.flex.absolute.items-center.gap-x-6
img.avatar.object-cover(for="image-upload", :src="image", v-if="image")
q-btn(round, color="primary", @click="closeAddImage", icon="app:icon-ok")
base-button(
width="48px",
@click="closeAddImage",
size="L",
round,
padding="2px 0 0 0"
)
q-icon(name="app:ok", size="20px")
base-input.w-full(v-model="infoClient.basic.full_name", placeholder="ФИО пациента*", outlined)
</template>
@@ -41,10 +48,11 @@
import BaseModal from "./BaseModal.vue";
import BaseInput from "./BaseInput.vue";
import addImageIcon from "@/assets/icons/photo.svg";
import BaseButton from "@/components/base/BaseButton.vue";
export default {
name: "BaseInputFullName",
components: { BaseModal, BaseInput },
components: { BaseModal, BaseInput, BaseButton },
props: { infoClient: Object },
data() {
return {

24
src/components/base/BaseTimeModal.vue
View File

@@ -10,23 +10,15 @@
img(:src="lockIcon")
.flex.justify-between.items-center
.flex.gap-2
q-btn(
color="primary",
outline,
size="16px",
no-caps,
base-button(
type="secondary",
width="108px",
label="Отмена",
:style="{width: '108px', height: '40px'}",
padding="0",
@click="closeModalTime"
@click="closeModalTime",
)
q-btn(
color="primary",
size="16px",
no-caps,
label="Сохранить"
:style="{width: '132px', height: '40px'}",
padding="0",
base-button(
width="132px",
label="Сохранить",
@click="closeModalTime"
)
.text.font-bold.text-6xl {{`${times.from} - ${times.to}`}}
@@ -34,10 +26,12 @@
<script>
import lockIcon from "@/assets/icons/locked.svg";
import BaseButton from "@/components/base/BaseButton.vue";
export default {
name: "BaseTimeModal",
props: { times: Object, closeModalTime: Function },
components: { BaseButton },
data() {
return { lockIcon, select: false };
},

13
src/components/base/BaseUploadPhoto.vue
View File

@@ -14,22 +14,25 @@
)
.avatar.flex.absolute.items-center.gap-x-6
img.avatar.object-cover(for="image-upload", :src="image" )
q-btn(
round,
color="primary",
base-button(
width="48px",
@click="confirm",
icon="app:icon-ok"
size="L",
round,
padding="2px 0 0 0"
)
q-icon(name="app:ok", size="20px")
</template>
<script>
import BaseInput from "./BaseInput.vue";
import addImageIcon from "@/assets/icons/photo.svg";
import { v_model } from "@/shared/mixins/v-model";
import BaseButton from "@/components/base/BaseButton.vue";
export default {
name: "BaseModalUploadPhoto",
components: { BaseInput, addImageIcon },
components: { BaseInput, addImageIcon, BaseButton },
data() {
return {
image: addImageIcon,

39
src/pages/clients/components/ClientsTableHat.vue
View File

@@ -12,50 +12,45 @@
)
.flex.items-center.cursor-pointer
.icon-search
q-btn(
base-button(
v-if="createdClientName === ''",
@click="searchLastName",
color="primary",
label="Поиск",
padding="8px 24px",
no-caps
width="96px"
)
q-btn(
base-button(
v-if="searchClient.length > 0",
outline,
type="secondary",
@click="resetLastName",
color="primary",
label="Сбросить",
padding="8px 24px",
no-caps
width="124px"
)
//- clients-table-header-actions(v-if="!!isOpenActions", :is-selected-one="isOpenActions===1")
.flex.w-fit.h-10.gap-x-2
q-btn(
outline,
icon="icon-download",
color="primary",
size="12px",
padding="8px 24px",
base-button(
type="secondary",
width="64px"
)
q-btn(
q-icon(name="app:export", size="16px")
base-button(
@click="openForm",
color="primary",
icon="add",
label="Создать",
padding="6px 24px",
no-caps
width="144px"
)
q-icon(name="app:plus", size="12px", left)
span Создать
</template>
<script>
import ClientsTableHeaderActions from "@/pages/clients/components/ClientsTableHeaderActions";
import BaseInput from "@/components/base/BaseInput";
import BaseButton from "@/components/base/BaseButton.vue";
export default {
name: "ClientsTableHat",
components: {
BaseInput,
ClientsTableHeaderActions,
BaseButton,
},
props: {
openForm: Function,
@@ -100,4 +95,6 @@ export default {
<style lang="sass" scoped>
.input
min-width: 280px
.on-left
margin-right: 10px
</style>

2
src/pages/newCalendar/components/CalendarOpenSidebar.vue
View File

@@ -14,7 +14,7 @@
@click="createForm",
)
q-icon(name="app:plus", size="12px", left)
span Создать событие
span Создать запись
.flex.flex-col.gap-y-1
q-expansion-item.expansion.font-bold.text-xm(
v-for="(elem, index) in patientList",

14
src/pages/newCalendar/components/CalendarSidebar.vue
View File

@@ -9,10 +9,10 @@
)
img(:src="arrow")
.button.flex
q-btn(color="primary", dense, padding="14px", @click="createForm")
q-icon(name="app:icon-plus", size="12px")
base-button(width="40px", @click="createForm")
q-icon(name="app:plus", size="12px")
.button.flex.relative.btn-sidebar(v-for="svg in patientData.arrSvg")
q-btn(
q-btn.blue-hover(
v-click-outside="hideActive",
@click="()=>clickButton(svg.name)",
dense,
@@ -269,10 +269,10 @@ export default {
border-radius: 4px
color: var(--default-white)
.q-btn
transition: color 0.3s cubic-bezier(0.25,0.8,0.5,1), background-color 0.3s cubic-bezier(0.25,0.8,0.5,1)
&:hover
background: var(--bg-light-blue-color)
// .q-btn .blue-hover
// transition: color 0.3s cubic-bezier(0.25,0.8,0.5,1), background-color 0.3s cubic-bezier(0.25,0.8,0.5,1)
// &:hover
// background: var(--bg-light-blue-color)
.gradient
width: 232px

23
src/pages/newCalendar/components/RecordCreationForm.vue
View File

@@ -51,25 +51,8 @@
:networks-list="getNetworksList",
)
.footer.flex.gap-2
q-btn(
color="primary",
outline,
size="16px",
no-caps,
label="Отменить"
:style="{width: '126px', height: '40px'}",
padding="0",
@click="closeForm"
)
q-btn(
color="primary",
size="16px",
no-caps,
label="Создать запись"
:style="{width: '174px', height: '40px'}",
padding="0",
@click="closeForm"
)
base-button(type="secondary", label="Отменить", width="126px", @click="closeForm")
base-button(width="168px", label="Создать запись", @click="closeForm")
</template>
<script>
@@ -85,6 +68,7 @@ import BaseInputFullName from "@/components/base/BaseInputFullName.vue";
import { patientData } from "@/pages/newCalendar/utils/calendarConfig.js";
import HeaderRecordForm from "./HeaderRecordForm.vue";
import BaseCalendar from "@/components/base/Calendar/BaseCalendar.vue";
import BaseButton from "@/components/base/BaseButton.vue";
export default {
name: "RecordCreationForm",
@@ -97,6 +81,7 @@ export default {
BaseInputFullName,
BaseCalendar,
HeaderRecordForm,
BaseButton,
},
props: { isShowForm: Boolean, closeForm: Function },
mixins: [v_model],

7
src/pages/newMedicalCard/components/ConfidantForms/ConfidantForm.vue
View File

@@ -44,13 +44,10 @@
:rule-input="ruleInputNetwork"
)
.w-fit
q-btn(
color="primary",
base-button(
label="Добавить",
type="button"
no-caps,
@click="saveNetwork",
padding="8px 24px"
width="126px"
)
.flex.w-full.relative(v-else)
q-menu.h-fit(

25
src/pages/newMedicalCard/components/HealthState/HealthStateCreateModal.vue
View File

@@ -36,22 +36,16 @@
:text-color="!dataEntry.comment ? 'var(--font-grey-color)' : 'var(--font-dark-blue-color)'"
)
.flex.gap-x-2.text-smm
q-btn(
color="primary",
outline,
size="16px",
no-caps,
label="Отменить",
padding="10px 24px 10px 24px",
@click="closeModal"
base-button(
width="126px",
type="secondary",
@click="closeModal",
label="Отменить"
)
q-btn(
color="primary",
size="16px",
no-caps,
base-button(
width="126px",
label="Сохранить",
padding="10px 24px 10px 24px",
@click="createNewEntry"
@click="createNewEntry",
)
</template>
@@ -62,10 +56,11 @@ import BaseDownload from "@/components/base/BaseDownload.vue";
import { mapActions } from "vuex";
import { v_model } from "@/shared/mixins/v-model";
import moment from "moment";
import BaseButton from "@/components/base/BaseButton.vue";
export default {
name: "HealthStateCreateModal",
components: { BaseModal, BaseDownload, BaseInput },
components: { BaseModal, BaseDownload, BaseInput, BaseButton },
mixins: [v_model],
data() {
return {

11
src/pages/newMedicalCard/components/HealthState/HealthStateHeader.vue
View File

@@ -1,11 +1,10 @@
<template lang="pug">
.header.flex.w-full.rounded.justify-between.items-center.py-5.pl-6.pr-5
.span.text-2xl.font-bold Карты здоровья
q-btn(
@click="() => {isOpenModal = true}"
color="primary",
no-caps
)
base-button(
width="206px",
@click="() => {isOpenModal = true}",
)
q-icon.mr-2(size="20px" name="add")
span Добавить запись
health-state-create-modal(v-model="isOpenModal")
@@ -13,11 +12,13 @@
<script>
import HealthStateCreateModal from "@/pages/newMedicalCard/components/HealthState/HealthStateCreateModal.vue";
import BaseButton from "@/components/base/BaseButton.vue";
export default {
name: "HealthStateHeader",
components: {
HealthStateCreateModal,
BaseButton,
},
data() {
return {

8
src/pages/newMedicalCard/components/InitialInspectionProtocol/Forms/DataForm.vue
View File

@@ -5,7 +5,6 @@
:open-edit="openCard",
:cancel="closeCard",
:tag="fillInspection || change",
template
)
.protocol-body.flex.flex-col
.flex.items-center.gap-x-11px(:class="{'open-header': change || fillInspection}")
@@ -61,8 +60,11 @@
)
.name.flex.items-center.font-medium.text-smm {{ name }}
.flex.h-10.w-10.absolute.right-4.bottom-4
q-btn(@click="showModal = true", color="primary", dense, padding="4px 12px")
q-icon(name="app:icon-plus", size="17px")
base-button(
width="40px",
@click="showModal = true",
)
q-icon(name="app:plus", size="16px")
base-modal(v-model="showModal", title="Создание тега", modal-padding)
tag-creation-form(:close-modal="closeModal", :create-tag="createTag")
.flex.gap-x-20.w-full(v-if="change || fillInspection")

20
src/pages/newMedicalCard/components/InitialInspectionProtocol/Forms/MedicalFormTag.vue
View File

@@ -48,14 +48,17 @@
)
.name.flex.items-center.font-medium.text-smm {{ name }}
.flex.h-10.w-10.absolute.right-4.bottom-4
q-btn(@click="showModal = true", color="primary", dense, padding="4px 12px")
q-icon(name="app:icon-plus", size="17px")
base-button(
width="40px",
@click="showModal = true",
)
q-icon(name="app:plus", size="16px")
base-modal(v-model="showModal", title="Создание тега", modal-padding)
tag-creation-form(:close-modal="closeModal", :create-tag="createTag")
.flex(v-if="data.title === 'Осмотр полости рта' && (fillInspection || change)", :style="{color: 'var(--btn-blue-color)'}")
q-btn(no-caps, flat padding="2px 4px")
q-icon(left, name="app:plus", size="11px")
span.text-smm.font-medium Добавить описание зуба
q-btn(no-caps, flat, padding="2px 4px")
q-icon(left, name="app:plus", size="12px")
span.font-medium Добавить описание зуба
</template>
<script>
@@ -203,4 +206,11 @@ export default {
.q-checkbox :deep(.q-checkbox__inner:before)
background: none !important
.q-btn :deep(.q-focus-helper)
display: none
.q-btn :deep(.q-ripple)
display: none
.on-left
margin-right: 8px
</style>

26
src/pages/newMedicalCard/components/InitialInspectionProtocol/Forms/TagCreationForm.vue
View File

@@ -31,34 +31,28 @@
.flex.flex-col(class="gap-x-1.5")
base-input(v-model="model.tag", label="Текст тега", placeholder="Введите тег", outlined)
.buttons-group.flex
q-btn(
@click="closeModal",
color="primary",
outline,
size="16px",
no-caps,
base-button(
type="secondary",
width="146px"
label="Отменить",
:style="{width: '100%', height: '40px'}",
padding="10px 24px"
padding="0",
@click="closeModal"
)
q-btn(
base-button(
width="146px",
label="Создать",
:disable="!(model.category && model.tag)",
@click="createTag(model)",
color="primary",
size="16px",
no-caps,
label="Создать"
:style="{width: '100%', height: '40px'}",
padding="10px 24px"
)
</template>
<script>
import BaseInput from "@/components/base/BaseInput.vue";
import BaseButton from "@/components/base/BaseButton.vue";
export default {
name: "TagCreationForm",
components: { BaseInput },
components: { BaseInput, BaseButton },
props: {
closeModal: Function,
createTag: Function,

24
src/pages/newMedicalCard/components/InitialInspectionProtocol/MedicalProtocolCreateModal.vue
View File

@@ -33,23 +33,15 @@
span.text-sm.color-blue.line-height.mb-2px {{ employeeName }}
span.color-grey.line-height.text-sm {{ userData?.job_title ? userData?.job_title : "Терапевт" }}
.flex.gap-2.mt-8
q-btn(
color="primary",
outline,
size="16px",
no-caps,
label="Отменить"
:style="{width: '126px', height: '40px'}",
padding="0",
base-button(
type="secondary",
label="Отменить",
width="126px",
@click="changeShownCreateModal(false)"
)
q-btn(
color="primary",
size="16px",
no-caps,
label="Создать осмотр"
:style="{width: '174px', height: '40px'}",
padding="0",
base-button(
width="174px",
label="Создать осмотр",
@click="saveProtocol"
)
</template>
@@ -61,6 +53,7 @@ import BaseInputDate from "@/components/base/BaseInputDate.vue";
import BaseInputTime from "@/components/base/BaseInputTime.vue";
import * as moment from "moment/moment";
import { mapGetters, mapActions } from "vuex";
import BaseButton from "@/components/base/BaseButton.vue";
export default {
name: "MedicalProtocolCreateModal",
components: {
@@ -68,6 +61,7 @@ export default {
BaseAvatar,
BaseInputDate,
BaseInputTime,
BaseButton,
},
props: {
changeShownCreateModal: Function,

14
src/pages/newMedicalCard/components/InitialInspectionProtocol/MedicalProtocolsList.vue
View File

@@ -2,16 +2,12 @@
.list-wrapper.h-full.flex.gap-y-1.flex-col
.background.h-72px.flex.w-full.justify-between.items-center.p-4.rounded
span.text-2xl.font-bold Осмотры
q-btn(
base-button(
width="40px",
@click="changeShownCreateModal(true)",
v-if="createInspection"
color="primary",
size="16px",
no-caps,
icon="add",
:style="{width: '40px', height: '40px'}"
padding="0",
@click="changeShownCreateModal(true)"
)
q-icon(name="app:plus", size="18px")
.p-4.rounded.background.list.flex.flex-col.gap-y-6
.flex
base-select(
@@ -50,6 +46,7 @@ import BaseAvatar from "@/components/base/BaseAvatar.vue";
import MedicalProtocolCard from "@/pages/newMedicalCard/components/InitialInspectionProtocol/MedicalProtocolCard.vue";
import BaseModal from "@/components/base/BaseModal.vue";
import MedicalProtocolCreateModal from "@/pages/newMedicalCard/components/InitialInspectionProtocol/MedicalProtocolCreateModal.vue";
import BaseButton from "@/components/base/BaseButton.vue";
import { mapState } from "vuex";
export default {
name: "MedicalProtocolsList",
@@ -59,6 +56,7 @@ export default {
MedicalProtocolCard,
BaseModal,
MedicalProtocolCreateModal,
BaseButton,
},
props: {
openInspection: Function,

26
src/pages/newMedicalCard/components/MedicalFormWrapper.vue
View File

@@ -29,11 +29,7 @@
v-if="!template",
:style="{color: 'var(--btn-blue-color)'}"
)
q-btn(
no-caps,
outline,
padding="10px 24px"
)
base-button(type="secondary", width="142px")
img.mr-2(:src="layers")
span.text-smm.font-medium Шаблоны
.flex.w-fit.gap-10px.items-center.delete-button.cursor-pointer(
@@ -44,25 +40,17 @@
span.text-smm.font-medium {{ titleDelete }}
slot
.flex.h-fit.w-fit.gap-2(v-if="isEdit && buttonsPresence")
q-btn(
color="primary",
outline,
size="16px",
no-caps,
base-button(
type="secondary"
label="Отменить",
:style="{width: '126px', height: '40px'}",
padding="0",
width="126px",
@click="cancel"
)
q-btn(
base-button(
v-if="isCheckChange",
color="primary",
size="16px",
no-caps,
width="222px",
label="Сохранить изменения",
:style="{width: '222px', height: '40px'}",
padding="0",
@click="save"
@click="save",
)
</template>

20
src/pages/newMedicalCard/components/MedicalRemoveModal.vue
View File

@@ -1,31 +1,29 @@
<template lang="pug">
.modal
.text.mt-4.mb-6.text-base Вы действительно хотите удалить медкарту?
.text.mt-4.mb-10.text-base Вы действительно хотите удалить медкарту?
.flex.gap-x-3
q-btn(
base-button(
type="secondary",
label="Отменить",
no-caps,
outline,
color="primary",
padding="10px 24px",
width="126px"
@click="changeShownRemoveModal(false)"
)
q-btn(
base-button(
type="remove",
label="Удалить",
no-caps,
outline,
style="color: var(--border-red-color)",
padding="10px 24px",
width="126px",
@click="removeMedicalCard"
)
</template>
<script>
import BaseButton from "@/components/base/BaseButton.vue";
export default {
name: "MedicalRemoveModal",
props: {
changeShownRemoveModal: Function,
},
components: { BaseButton },
data() {
return {};
},

3
src/pages/schedule/components/ScheduleHeader.vue
View File

@@ -59,10 +59,11 @@
<script>
import * as moment from "moment";
import BaseInput from "@/components/base/BaseInput.vue";
import BaseButton from "@/components/base/BaseButton.vue";
export default {
name: "ScheduleHeader",
components: { BaseInput },
components: { BaseInput, BaseButton },
props: {
showTime: Boolean,
startMonth: Object,

17
src/pages/schedule/components/ScheduleTable.vue
View File

@@ -11,16 +11,8 @@
size="18px",
style="color: var(--font-dark-blue-color)"
)
q-btn(
color="primary",
padding="8px 25px",
no-caps
)
q-icon(
name="app:icon-plus",
size="12px",
style="margin-right: 10px"
)
base-button(width="188px")
q-icon(name="app:plus", size="12px", left)
span Создать смену
schedule-table-header(
:result="result",
@@ -54,6 +46,7 @@ import ScheduleTableSelect from "@/pages/schedule/components/ScheduleTableSelect
import ScheduleBar from "@/pages/schedule/components/ScheduleBar.vue";
import BaseSelect from "@/components/base/BaseSelect.vue";
import BaseInput from "@/components/base/BaseInput.vue";
import BaseButton from "@/components/base/BaseButton.vue";
export default {
name: "ScheduleTable",
@@ -64,6 +57,7 @@ export default {
ScheduleBar,
BaseInput,
BaseSelect,
BaseButton,
},
props: {
scheduleList: Array,
@@ -263,4 +257,7 @@ export default {
border-radius: 4px
width: 400px
height: 500px
.on-left
margin-right: 10px
</style>