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

WIP Перемещен инпут

Browse Source
This commit is contained in:
Daria Golova
2023-07-18 17:39:53 +03:00
parent 1fdc22a1be
commit 51470f0ed3
61 changed files with 670 additions and 585 deletions
Download Patch File Download Diff File Expand all files Collapse all files

229
src/components/BaseInput.vue
View File

@@ -1,229 +0,0 @@
<template lang="pug">
base-input-container.gap-y-2(:important="important", :label="label", :style="{width: width + 'px', ...sizeVariable}")
q-input.input(
v-model="value",
:name="name",
:multiple="multiple",
:class="{'circle': circle, 'font-input': true, 'doc': doc}",
:input-style="{resize: resize}",
:borderless="borderless",
:placeholder="placeholder",
outlined,
:type="type",
:readonly="readonly",
:disable="disabled",
:rules="rule",
:lazy-rules="lazyRule",
:item-aligned="itemAligned",
no-error-icon,
:standout="readonly",
:mask="mask",
:autogrow="autogrow",
:accept="accept",
:debounce="debounce",
:shadow-text="shadowText",
:autofocus="autofocus",
hide-bottom-space
)
template(v-slot:prepend, v-if="iconLeft")
slot(name="iconLeft")
template(v-slot:append, v-if="iconRight")
slot(name="iconRight")
slot(v-if="!iconLeft && !iconRight")
</template>
<script>
import BaseInputContainer from "@/components/base/BaseInputContainer.vue";
export default {
name: "BaseInput",
components: { BaseInputContainer },
props: {
multiple: Boolean,
doc: Boolean,
autofocus: Boolean,
borderless: {
type: Boolean,
default: false,
},
autogrow: {
type: Boolean,
default: false,
},
type: {
default: "text",
},
accept: {
type: String,
default: "",
},
resize: {
type: String,
default: "none",
},
shadowText: String,
mask: String,
debounce: [String, Number],
width: Number,
rule: Array,
lazyRule: [Boolean, String],
itemAligned: Boolean,
modelValue: [String, Date, Number],
placeholder: String,
disabled: Boolean,
label: String,
readonly: Boolean,
iconLeft: Boolean,
iconRight: Boolean,
name: String,
important: Boolean,
size: String,
circle: Boolean,
},
emits: ["update:modelValue"],
computed: {
value: {
get() {
if (this.type === "date") {
return this.modelValue
? this.modelValue?.toISOString().split("T")[0]
: null;
}
return this.modelValue;
},
set(value) {
this.type === "date"
? this.$emit("update:modelValue", value ? new Date(value) : null)
: this.$emit("update:modelValue", value);
},
},
sizeVariable() {
switch (this.size) {
case "XS":
return {
"--input-height": "28px",
"--text-size": "12px",
"--line-height": "135%",
"--px": "0 8px",
"--py": "10px 0",
};
case "S":
return {
"--input-height": "32px",
"--text-size": "12px",
"--line-height": "135%",
"--px": "0 8px",
"--py": "10px 0",
};
case "M":
return {
"--input-height": "40px",
"--text-size": "16px",
"--line-height": "normal",
"--px": "0 16px",
"--py": "8px 0",
};
case "L":
return {
"--input-height": "48px",
"--text-size": "16px",
"--line-height": "normal",
"--px": "0 16px",
"--py": "8px 0",
};
case "auto":
return {
"--input-height": "auto",
"--text-size": "16px",
"--line-height": "normal",
"--px": "0 16px",
"--py": "8px 0",
};
default:
return {
"--input-height": "56px",
"--text-size": "16px",
"--line-height": "normal",
"--px": "0 16px",
"--py": "8px 0",
};
}
},
},
};
</script>
<style lang="sass" scoped>
.font-input
font-feature-settings: 'pnum' on, 'lnum' on
.circle
width: 100%
height: 100%
border-radius: 50%
z-index: 5
opacity: 0
cursor: pointer
.doc
width: 100%
height: 100%
z-index: 5
opacity: 0
cursor: pointer
::file-selector-button
cursor: pointer
.input :deep(.q-field__native)
font-weight: 500
font-size: var(--text-size)
line-height: var(--line-height)
color: var(--font-dark-blue-color)
padding: var(--py)
&::placeholder
color: var(--font-grey-color)
opacity: 1
.input :deep(.q-field__control)
height: var(--input-height) !important
color: var(--font-dark-blue-color)
padding: var(--px)
&:before
border-color: var(--border-light-grey-color) !important
transition: none
&:hover:before
border-color: var(--font-grey-color) !important
&:after
border-width: 1px !important
transition: none
transform: none !important
.q-field--disabled :deep(.q-field__control > div)
opacity: 1 !important
.q-field--outlined.q-field--disabled :deep(.q-field__native)
color: var(--font-grey-color)
.q-field--outlined.q-field--disabled :deep(.q-field__control)
background: var(--bg-light-grey) !important
.q-field--outlined.q-field--readonly :deep(.q-field__control)
background: var(--bg-light-grey) !important
&:before
border-color: var(--bg-light-grey) !important
transition: none
&:hover:before
border-color: var(--bg-light-grey) !important
.q-field--outlined.q-field--readonly :deep(.q-field__native)
cursor: default
.q-field--error :deep(.q-field__bottom)
padding: 4px 0 0 0
font-weight: 500
font-size: 12px
line-height: 135% !important
.input :deep(.q-field__marginal)
height: auto !important
</style>

4
src/components/HeaderInputs.vue
View File

@@ -23,12 +23,8 @@
</template> </template>
<script> <script>
import BaseInput from "@/components/base/BaseInput";
import BaseSelect from "@/components/base/BaseSelect";
export default { export default {
name: "HeaderInputs", name: "HeaderInputs",
components: { BaseInput, BaseSelect },
data() { data() {
return { return {
selectedFilter: "Календарь", selectedFilter: "Календарь",

2
src/components/base/BaseAddingNetwork.vue
View File

@@ -5,7 +5,7 @@
</template> </template>
<script> <script>
import BaseInput from "@/components/BaseInput.vue"; import BaseInput from "@/components/base/BaseInput.vue";
import BaseSelect from "@/components/base/BaseSelect.vue"; import BaseSelect from "@/components/base/BaseSelect.vue";
export default { export default {
name: "TableAddingNetwork", name: "TableAddingNetwork",

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

@@ -64,7 +64,7 @@
<script> <script>
import BaseButton from "@/components/base/BaseButton.vue"; import BaseButton from "@/components/base/BaseButton.vue";
import BaseInput from "@/components/BaseInput.vue"; import BaseInput from "@/components/base/BaseInput.vue";
export default { export default {
name: "BaseCategorySelection", name: "BaseCategorySelection",

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

@@ -106,7 +106,7 @@ import { addNotification } from "@/components/Notifications/notificationContext"
import * as moment from "moment"; import * as moment from "moment";
import { v_model } from "@/shared/mixins/v-model"; import { v_model } from "@/shared/mixins/v-model";
import BaseButton from "@/components/base/BaseButton.vue"; import BaseButton from "@/components/base/BaseButton.vue";
import BaseInput from "@/components/BaseInput.vue"; import BaseInput from "@/components/base/BaseInput.vue";
export default { export default {
name: "BaseClientFormClient", name: "BaseClientFormClient",

28
src/components/base/BaseDownload.vue
View File

@@ -1,22 +1,22 @@
<template lang="pug"> <template lang="pug">
label.download.flex.cursor-pointer.relative.items-center.justify-center.rounded( label.download.flex.relative.items-center.justify-center.rounded(
:style="{height: `${height}px`, width: width ? `${width}px` : '100%'}" :style="{height: `${height}px`, width: width ? `${width}px` : '100%'}"
) )
base-input.w-full.h-full( base-input.w-full(
@change="(e) => addNewFiles(e)", @change="(e) => addNewFiles(e)",
doc, doc,
type="file", type="file",
:accept="getAccept", :accept="getAccept",
id="upload" id="upload"
borderless, :size="`${height}px`"
:multiple="multiple" :height="`${height}px`"
) )
q-icon.absolute( q-icon.absolute(
v-if="withIcon", v-if="withIcon",
name="app:download", name="app:download",
:size="sizeIcon" :size="sizeIcon"
) )
.flex.flex-col.items-center.justify-center.absolute.font-medium.text-smm.w-full( .flex.flex-col.items-center.justify-center.absolute.font-medium.text-base.w-full(
v-else, v-else,
:style="{color: 'var(--font-grey-color)'}" :style="{color: 'var(--font-grey-color)'}"
) )
@@ -42,7 +42,7 @@ export default {
multiple: Boolean, multiple: Boolean,
height: { height: {
type: Number, type: Number,
default: 93, default: 92,
}, },
width: Number, width: Number,
type: { type: {
@@ -91,15 +91,15 @@ export default {
</script> </script>
<style lang="sass" scoped> <style lang="sass" scoped>
#upload :deep(.q-field__native) // #upload :deep(.q-field__native)
cursor: pointer // cursor: pointer
height: 100% // height: 100%
padding: 0 // padding: 0
#upload :deep(.q-field__control) // #upload :deep(.q-field__control)
height: 100% // height: 100%
.download .download
border: 1px dashed var(--font-grey-color) background-color: var(--bg-light-grey)
background-color: var(--default-white) border-radius: 4px
&:hover .q-icon &:hover .q-icon
opacity: 0.6 opacity: 0.6
& .q-icon & .q-icon

227
src/components/base/BaseInput.vue
View File

@@ -1,29 +1,24 @@
<template lang="pug"> <template lang="pug">
base-input-container.gap-y-2(:important="important", :label="label", :style="{width: width + 'px' }") base-input-container.gap-y-2(:important="important", :label="label", :style="{width: width + 'px', ...sizeVariable}")
q-input( q-input.input(
v-model="value", v-model="value",
:name="name", :name="name",
:multiple="multiple", :multiple="multiple",
:class="{'circle': circle, 'font-input': true, 'doc': doc}", :class="{'circle': circle, 'font-input': true, 'doc': doc}",
:input-style="{ color: textColor, borderColor: borderColor, resize: resize, fontSize: fontSize, fontWeight: fontWeight, lineHeight: lineHeight, minHeight: minHeight}", :input-style="{resize: resize, height: height}",
:borderless="borderless", :borderless="borderless",
:placeholder="placeholder", :placeholder="placeholder",
:outlined="outlined", outlined,
:dense="dense",
:type="type", :type="type",
:readonly="readonly", :readonly="readonly",
:disable="disabled", :disable="disabled",
:filled="filled",
:bg-color="filled || standout ? '' : 'white'",
:rules="rule", :rules="rule",
:lazy-rules="lazyRule", :lazy-rules="lazyRule",
:item-aligned="itemAligned", :item-aligned="itemAligned",
:no-error-icon="noErrorIcon", no-error-icon,
:standout="readonly",
:mask="mask", :mask="mask",
:maxlength="maxLength",
:autogrow="autogrow", :autogrow="autogrow",
:square="square",
:standout="standout"
:accept="accept", :accept="accept",
:debounce="debounce", :debounce="debounce",
:shadow-text="shadowText", :shadow-text="shadowText",
@@ -31,10 +26,10 @@
hide-bottom-space hide-bottom-space
) )
template(v-slot:prepend, v-if="iconLeft") template(v-slot:prepend, v-if="iconLeft")
slot slot(name="iconLeft")
template(v-slot:append, v-if="iconRight") template(v-slot:append, v-if="iconRight")
slot slot(name="iconRight")
slot.cursor-pointer(v-if="!iconLeft && !iconRight") slot(v-if="!iconLeft && !iconRight")
</template> </template>
<script> <script>
@@ -45,41 +40,8 @@ export default {
components: { BaseInputContainer }, components: { BaseInputContainer },
props: { props: {
multiple: Boolean, multiple: Boolean,
circle: Boolean,
doc: Boolean, doc: Boolean,
autofocus: Boolean, autofocus: Boolean,
dense: {
type: Boolean,
default: true,
},
fontSize: {
type: String,
default: "14px",
},
fontWeight: {
type: Number,
default: 500,
},
minHeight: {
type: String,
default: "0px",
},
lineHeight: {
type: String,
default: "19px",
},
outlined: {
type: Boolean,
default: false,
},
square: {
type: Boolean,
default: false,
},
filled: {
type: Boolean,
default: false,
},
borderless: { borderless: {
type: Boolean, type: Boolean,
default: false, default: false,
@@ -91,10 +53,6 @@ export default {
type: { type: {
default: "text", default: "text",
}, },
standout: {
type: [Boolean, String],
default: false,
},
accept: { accept: {
type: String, type: String,
default: "", default: "",
@@ -107,12 +65,8 @@ export default {
mask: String, mask: String,
debounce: [String, Number], debounce: [String, Number],
width: Number, width: Number,
maxLength: Number,
textColor: String,
borderColor: String,
rule: Array, rule: Array,
lazyRule: [Boolean, String], lazyRule: [Boolean, String],
noErrorIcon: Boolean,
itemAligned: Boolean, itemAligned: Boolean,
modelValue: [String, Date, Number], modelValue: [String, Date, Number],
placeholder: String, placeholder: String,
@@ -123,6 +77,9 @@ export default {
iconRight: Boolean, iconRight: Boolean,
name: String, name: String,
important: Boolean, important: Boolean,
size: String,
circle: Boolean,
height: String,
}, },
emits: ["update:modelValue"], emits: ["update:modelValue"],
computed: { computed: {
@@ -141,6 +98,104 @@ export default {
: this.$emit("update:modelValue", value); : this.$emit("update:modelValue", value);
}, },
}, },
sizeVariable() {
if (this.size === "XS")
return {
"--input-height": "28px",
"--text-size": "12px",
"--line-height": "135%",
"--px": "0 8px",
"--py": "10px 0",
};
if (this.size === "S")
return {
"--input-height": "32px",
"--text-size": "12px",
"--line-height": "135%",
"--px": "0 8px",
"--py": "10px 0",
};
if (this.size === "M")
return {
"--input-height": "40px",
"--text-size": "16px",
"--line-height": "normal",
"--px": "0 16px",
"--py": "8px 0",
};
if (this.size === "L")
return {
"--input-height": "48px",
"--text-size": "16px",
"--line-height": "normal",
"--px": "0 16px",
"--py": "8px 0",
};
if (this.size)
return {
"--input-height": this.size,
"--text-size": "16px",
"--line-height": "normal",
"--px": "0 16px",
"--py": "8px 0",
};
return {
"--input-height": "56px",
"--text-size": "16px",
"--line-height": "normal",
"--px": "0 16px",
"--py": "8px 0",
};
// switch (this.size) {
// case "XS":
// return {
// "--input-height": "28px",
// "--text-size": "12px",
// "--line-height": "135%",
// "--px": "0 8px",
// "--py": "10px 0",
// };
// case "S":
// return {
// "--input-height": "32px",
// "--text-size": "12px",
// "--line-height": "135%",
// "--px": "0 8px",
// "--py": "10px 0",
// };
// case "M":
// return {
// "--input-height": "40px",
// "--text-size": "16px",
// "--line-height": "normal",
// "--px": "0 16px",
// "--py": "8px 0",
// };
// case "L":
// return {
// "--input-height": "48px",
// "--text-size": "16px",
// "--line-height": "normal",
// "--px": "0 16px",
// "--py": "8px 0",
// };
// case "auto":
// return {
// "--input-height": "auto",
// "--text-size": "16px",
// "--line-height": "normal",
// "--px": "0 16px",
// "--py": "8px 0",
// };
// default:
// return {
// "--input-height": "56px",
// "--text-size": "16px",
// "--line-height": "normal",
// "--px": "0 16px",
// "--py": "8px 0",
// };
},
}, },
}; };
</script> </script>
@@ -162,13 +217,63 @@ export default {
height: 100% height: 100%
z-index: 5 z-index: 5
opacity: 0 opacity: 0
cursor: pointer cursor: pointer !important
::file-selector-button ::file-selector-button
cursor: pointer cursor: pointer
</style>
<style lang="sass"> .input :deep(input[type="file" i])
.q-field--standout.q-field--readonly .q-field__control:before cursor: pointer
border: none !important
.q-field--standout .q-field__control .input :deep(.q-field__native)
font-weight: 500
font-size: var(--text-size)
line-height: var(--line-height)
color: var(--font-dark-blue-color)
padding: var(--py)
&::placeholder
color: var(--font-grey-color)
opacity: 1
.input :deep(.q-field__control)
height: var(--input-height) !important
color: var(--font-dark-blue-color)
padding: var(--px)
&:before
border-color: var(--border-light-grey-color) !important
transition: none
&:hover:before
border-color: var(--font-grey-color) !important
&:after
border-width: 1px !important
transition: none
transform: none !important
.q-field--disabled :deep(.q-field__control > div)
opacity: 1 !important
.q-field--outlined.q-field--disabled :deep(.q-field__native)
color: var(--font-grey-color)
.q-field--outlined.q-field--disabled :deep(.q-field__control)
background: var(--bg-light-grey) !important background: var(--bg-light-grey) !important
.q-field--outlined.q-field--readonly :deep(.q-field__control)
background: var(--bg-light-grey) !important
&:before
border-color: var(--bg-light-grey) !important
transition: none
&:hover:before
border-color: var(--bg-light-grey) !important
.q-field--outlined.q-field--readonly :deep(.q-field__native)
cursor: default
.q-field--error :deep(.q-field__bottom)
padding: 4px 0 0 0
font-weight: 500
font-size: 12px
line-height: 135% !important
.input :deep(.q-field__marginal)
height: auto !important
</style> </style>

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

@@ -48,7 +48,7 @@
import BaseModal from "./BaseModal.vue"; import BaseModal from "./BaseModal.vue";
import addImageIcon from "@/assets/icons/photo.svg"; import addImageIcon from "@/assets/icons/photo.svg";
import BaseButton from "@/components/base/BaseButton.vue"; import BaseButton from "@/components/base/BaseButton.vue";
import BaseInput from "@/components/BaseInput.vue"; import BaseInput from "@/components/base/BaseInput.vue";
export default { export default {
name: "BaseInputFullName", name: "BaseInputFullName",

161
src/components/base/BaseInputNumber.vue
View File

@@ -1,30 +1,23 @@
<template lang="pug"> <template lang="pug">
base-input-container.gap-y-2(:label="label", :style="{width: width + 'px' }") base-input-container.gap-y-2(:label="label", :style="{width: width + 'px', ...sizeVariable }")
q-input( q-input.input(
ref="numberInput" ref="numberInput"
v-model="value", v-model="value",
:name="name", :name="name",
:multiple="multiple", :multiple="multiple",
:class="{'circle': circle, 'font-input': true, 'doc': doc}", :class="{'circle': circle, 'font-input': true}",
:input-style="{ color: textColor, borderColor: borderColor, resize: resize }", :input-style="{ resize: resize }",
:borderless="borderless",
:placeholder="placeholder", :placeholder="placeholder",
:outlined="outlined", outlined,
:dense="dense",
type="number", type="number",
:readonly="readonly", :readonly="readonly",
:disable="disabled", :disable="disabled",
:filled="filled",
:bg-color="filled || standout ? '' : 'white'",
:rules="rule || ruleNumberInput", :rules="rule || ruleNumberInput",
:lazy-rules="lazyRule", :lazy-rules="lazyRule",
:item-aligned="itemAligned", :item-aligned="itemAligned",
:no-error-icon="noErrorIcon", no-error-icon,
:mask="mask", :mask="mask",
:maxlength="maxLength",
:autogrow="autogrow", :autogrow="autogrow",
:square="square",
:standout="standout"
:accept="accept", :accept="accept",
:debounce="null", :debounce="null",
:shadow-text="shadowText" :shadow-text="shadowText"
@@ -48,14 +41,13 @@
</template> </template>
<script> <script>
import BaseInput from "@/components/base/BaseInput";
import BaseInputContainer from "@/components/base/BaseInputContainer.vue"; import BaseInputContainer from "@/components/base/BaseInputContainer.vue";
import { ruleNumberInput } from "@/shared/utils/rulesInputs"; import { ruleNumberInput } from "@/shared/utils/rulesInputs";
import { roundNumber } from "@/shared/utils/methodsObjects"; import { roundNumber } from "@/shared/utils/methodsObjects";
export default { export default {
name: "BaseInputNumber", name: "BaseInputNumber",
components: { BaseInput, BaseInputContainer }, components: { BaseInputContainer },
data() { data() {
return { return {
intervalId: 0, intervalId: 0,
@@ -80,35 +72,10 @@ export default {
reverseValue: Boolean, reverseValue: Boolean,
multiple: Boolean, multiple: Boolean,
circle: Boolean, circle: Boolean,
doc: Boolean,
dense: {
type: Boolean,
default: true,
},
outlined: {
type: Boolean,
default: false,
},
square: {
type: Boolean,
default: false,
},
filled: {
type: Boolean,
default: false,
},
borderless: {
type: Boolean,
default: false,
},
autogrow: { autogrow: {
type: Boolean, type: Boolean,
default: false, default: false,
}, },
standout: {
type: [Boolean, String],
default: false,
},
accept: { accept: {
type: String, type: String,
default: "", default: "",
@@ -121,15 +88,8 @@ export default {
mask: String, mask: String,
debounce: [String, Number], debounce: [String, Number],
width: Number, width: Number,
maxLength: Number,
textColor: String,
borderColor: String,
rule: Array, rule: Array,
lazyRule: String, lazyRule: String,
noErrorIcon: {
type: Boolean,
default: true,
},
itemAligned: Boolean, itemAligned: Boolean,
modelValue: [Number], modelValue: [Number],
placeholder: String, placeholder: String,
@@ -138,6 +98,7 @@ export default {
readonly: Boolean, readonly: Boolean,
iconLeft: Boolean, iconLeft: Boolean,
name: String, name: String,
size: String,
}, },
emits: ["update:modelValue"], emits: ["update:modelValue"],
methods: { methods: {
@@ -197,6 +158,59 @@ export default {
rounding() { rounding() {
return String(this.step).split(".")[1]?.length || 0; return String(this.step).split(".")[1]?.length || 0;
}, },
sizeVariable() {
switch (this.size) {
case "XS":
return {
"--input-height": "28px",
"--text-size": "12px",
"--line-height": "135%",
"--px": "0 8px",
"--py": "10px 0",
};
case "S":
return {
"--input-height": "32px",
"--text-size": "12px",
"--line-height": "135%",
"--px": "0 8px",
"--py": "10px 0",
};
case "M":
return {
"--input-height": "40px",
"--text-size": "16px",
"--line-height": "normal",
"--px": "0 16px",
"--py": "2px 0",
};
case "L":
return {
"--input-height": "48px",
"--text-size": "16px",
"--line-height": "normal",
"--px": "0 16px",
"--py": "8px 0",
};
case "auto":
return {
"--input-height": "auto",
"--text-size": "16px",
"--line-height": "normal",
"--px": "0 16px",
"--py": "8px 0",
};
default:
return {
"--input-height": "56px",
"--text-size": "16px",
"--line-height": "normal",
"--px": "0 16px",
"--py": "8px 0",
};
}
},
}, },
}; };
</script> </script>
@@ -214,4 +228,57 @@ input[type=number]::-webkit-inner-spin-button
color: var(--font-grey-color) color: var(--font-grey-color)
&:hover &:hover
color: var(--font-dark-blue-color) color: var(--font-dark-blue-color)
.input :deep(.q-field__native)
font-weight: 500
font-size: var(--text-size)
line-height: var(--line-height)
color: var(--font-dark-blue-color)
padding: var(--py)
&::placeholder
color: var(--font-grey-color)
opacity: 1
.input :deep(.q-field__control)
height: var(--input-height) !important
color: var(--font-dark-blue-color)
padding: var(--px)
&:before
border-color: var(--border-light-grey-color) !important
transition: none
&:hover:before
border-color: var(--font-grey-color) !important
&:after
border-width: 1px !important
transition: none
transform: none !important
.q-field--disabled :deep(.q-field__control > div)
opacity: 1 !important
.q-field--outlined.q-field--disabled :deep(.q-field__native)
color: var(--font-grey-color)
.q-field--outlined.q-field--disabled :deep(.q-field__control)
background: var(--bg-light-grey) !important
.q-field--outlined.q-field--readonly :deep(.q-field__control)
background: var(--bg-light-grey) !important
&:before
border-color: var(--bg-light-grey) !important
transition: none
&:hover:before
border-color: var(--bg-light-grey) !important
.q-field--outlined.q-field--readonly :deep(.q-field__native)
cursor: default
.q-field--error :deep(.q-field__bottom)
padding: 4px 0 0 0
font-weight: 500
font-size: 12px
line-height: 135% !important
.input :deep(.q-field__marginal)
height: auto !important
</style> </style>

132
src/components/base/BaseTextarea.vue.vue Normal file
View File

@@ -0,0 +1,132 @@
<template lang="pug">
base-input-container.gap-y-2(:label="label", :style="{width: width + 'px'}")
q-input.input(
v-model="value",
:name="name",
:multiple="multiple",
:input-style="{resize: resize, 'font-input': true, height: height}",
:placeholder="placeholder",
outlined,
type="textarea",
:readonly="readonly",
:disable="disabled",
:rules="rule",
:lazy-rules="lazyRule",
:item-aligned="itemAligned",
no-error-icon,
:autogrow="autogrow",
:accept="accept",
:debounce="debounce",
:shadow-text="shadowText",
:autofocus="autofocus",
hide-bottom-space
)
</template>
<script>
import BaseInputContainer from "@/components/base/BaseInputContainer.vue";
export default {
name: "BaseInput",
components: { BaseInputContainer },
props: {
multiple: Boolean,
autofocus: Boolean,
autogrow: {
type: Boolean,
default: false,
},
accept: {
type: String,
default: "",
},
resize: {
type: String,
default: "none",
},
shadowText: String,
mask: String,
debounce: [String, Number],
width: Number,
rule: Array,
lazyRule: [Boolean, String],
itemAligned: Boolean,
modelValue: [String, Date, Number],
placeholder: String,
disabled: Boolean,
label: String,
readonly: Boolean,
name: String,
height: String,
},
emits: ["update:modelValue"],
computed: {
value: {
get() {
return this.modelValue;
},
set(value) {
this.$emit("update:modelValue", value);
},
},
},
};
</script>
<style lang="sass" scoped>
.font-input
font-feature-settings: 'pnum' on, 'lnum' on
.input :deep(.q-field__native)
font-weight: 500
font-size: 16px
line-height: normal
color: var(--font-dark-blue-color)
padding: 12px 16px
&::placeholder
color: var(--font-grey-color)
opacity: 1
.input :deep(.q-field__control)
//height: var(--input-height) !important
color: var(--font-dark-blue-color)
padding: 0 0
&:before
border-color: var(--border-light-grey-color) !important
transition: none
&:hover:before
border-color: var(--font-grey-color) !important
&:after
border-width: 1px !important
transition: none
transform: none !important
.q-field--disabled :deep(.q-field__control > div)
opacity: 1 !important
.q-field--outlined.q-field--disabled :deep(.q-field__native)
color: var(--font-grey-color)
.q-field--outlined.q-field--disabled :deep(.q-field__control)
background: var(--bg-light-grey) !important
.q-field--outlined.q-field--readonly :deep(.q-field__control)
background: var(--bg-light-grey) !important
&:before
border-color: var(--bg-light-grey) !important
transition: none
&:hover:before
border-color: var(--bg-light-grey) !important
.q-field--outlined.q-field--readonly :deep(.q-field__native)
cursor: default
.q-field--error :deep(.q-field__bottom)
padding: 4px 0 0 0
font-weight: 500
font-size: 12px
line-height: 135% !important
//.input :deep(.q-field__marginal)
// height: auto !important
</style>

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

@@ -25,10 +25,10 @@
</template> </template>
<script> <script>
import BaseInput from "./BaseInput.vue";
import addImageIcon from "@/assets/icons/photo.svg"; import addImageIcon from "@/assets/icons/photo.svg";
import { v_model } from "@/shared/mixins/v-model"; import { v_model } from "@/shared/mixins/v-model";
import BaseButton from "@/components/base/BaseButton.vue"; import BaseButton from "@/components/base/BaseButton.vue";
import BaseInput from "@/components/base/BaseInput.vue";
export default { export default {
name: "BaseModalUploadPhoto", name: "BaseModalUploadPhoto",

2
src/components/kit/KitLongList.vue
View File

@@ -1,7 +1,7 @@
<template lang="pug"> <template lang="pug">
base-input-container(:label="label") base-input-container(:label="label")
.relative .relative
base-input(type="text", v-model="value.label", outlined) base-input(type="text", v-model="value.label", size="M")
template(#icon) template(#icon)
.icon(@click="isExpand = !isExpand") .icon(@click="isExpand = !isExpand")
.menu(v-if="isExpand") .menu(v-if="isExpand")

2
src/components/kit/KitShortList.vue
View File

@@ -1,7 +1,7 @@
<template lang="pug"> <template lang="pug">
base-input-container(:label="label") base-input-container(:label="label")
.relative .relative
base-input(type="text", v-model="value.label", outlined) base-input(type="text", v-model="value.label", size="M")
template(#icon) template(#icon)
.icon(@click="isExpand = !isExpand") .icon(@click="isExpand = !isExpand")
.menu(v-if="isExpand") .menu(v-if="isExpand")

20
src/pages/clients/components/ClientDetailInfoSection.vue
View File

@@ -116,16 +116,16 @@
:placeholder="settings[section].placeholder[key] || settings[section].placeholder" :placeholder="settings[section].placeholder[key] || settings[section].placeholder"
:sharp="settings[section].sharps[key] && section === 'pass' ? settings[section].sharps[key] : ''" :sharp="settings[section].sharps[key] && section === 'pass' ? settings[section].sharps[key] : ''"
) )
base-input( .bg-white(v-else-if="isChange && section !== 'docs' && section !== 'additional'",)
type="date", base-input(
v-else-if="isChange && section !== 'docs' && section !== 'additional'", type="date",
v-model="sectionInfo.issued_by_date", v-model="sectionInfo.issued_by_date",
outlined size="S"
)
.copy.icon-copy.cursor-pointer(
v-if="item.copy",
@click="() => copyValue(item)"
) )
.copy.icon-copy.cursor-pointer(
v-if="item.copy",
@click="() => copyValue(item)"
)
.separation.flex.items-center.justify-center.relative.mt-10px.mb( .separation.flex.items-center.justify-center.relative.mt-10px.mb(
v-if="section === 'addresses' && isChange", v-if="section === 'addresses' && isChange",
class="gap-y-1.5" class="gap-y-1.5"
@@ -194,6 +194,7 @@ import exelIcon from "@/assets/icons/exel.svg";
import * as moment from "moment"; import * as moment from "moment";
import BaseLoader from "@/components/Loader/BaseLoader.vue"; import BaseLoader from "@/components/Loader/BaseLoader.vue";
import StepperCreateAgreement from "./StepperCreateAgreement"; import StepperCreateAgreement from "./StepperCreateAgreement";
import BaseInputDate from "@/components/base/BaseInputDate.vue";
export default { export default {
name: "ClientDetailInfoSection", name: "ClientDetailInfoSection",
@@ -209,6 +210,7 @@ export default {
TableChoiceAddingDoc, TableChoiceAddingDoc,
TableCreateNote, TableCreateNote,
StepperCreateAgreement, StepperCreateAgreement,
BaseInputDate,
}, },
props: { props: {
saveNewDoc: Function, saveNewDoc: Function,

19
src/pages/clients/components/ClientDetailInput.vue
View File

@@ -1,13 +1,14 @@
<template lang="pug"> <template lang="pug">
base-input( .bg-white
:type="choiceType" base-input(
v-model="value", :type="choiceType"
:placeholder="placeholder", v-model="value",
:maxLength="maxLength", :placeholder="placeholder",
:mask="sharp", :maxLength="maxLength",
:autogrow="choiceGrow", :mask="sharp",
outlined :autogrow="choiceGrow",
) :size="!choiceGrow ? 'S' : 'auto'"
)
slot slot
</template> </template>

19
src/pages/clients/components/ClientDetailSectionAddress.vue
View File

@@ -11,20 +11,16 @@
base-input( base-input(
disabled, disabled,
placeholder="Введите область", placeholder="Введите область",
labelStyle="text-xxs",
textStyle="text-sm",
v-model="dopeAddress.region", v-model="dopeAddress.region",
label="Область", label="Область",
outlined size="S"
) )
base-input( base-input(
disabled, disabled,
placeholder="Введите улицу", placeholder="Введите улицу",
labelStyle="text-xxs",
textStyle="text-sm",
v-model="dopeAddress.street", v-model="dopeAddress.street",
label="Улица", label="Улица",
outlined size="S"
) )
.flex.gap-x-4 .flex.gap-x-4
base-input( base-input(
@@ -32,17 +28,14 @@
placeholder="Дом", placeholder="Дом",
label="Дом" label="Дом"
v-model="dopeAddress.house", v-model="dopeAddress.house",
labelStyle="text-xxs", size="S"
textStyle="text-sm",
) )
base-input( base-input(
disabled, disabled,
placeholder="Квартира", placeholder="Квартира",
label="Квартира", label="Квартира",
v-model="dopeAddress.flat", v-model="dopeAddress.flat",
labelStyle="text-xxs", size="S"
textStyle="text-sm",
outlined
) )
base-input( base-input(
disabled, disabled,
@@ -50,9 +43,7 @@
placeholder="000000", placeholder="000000",
label="Индекс", label="Индекс",
v-model="dopeAddress.index", v-model="dopeAddress.index",
labelStyle="text-xxs", size="S"
textStyle="text-sm",
outlined
) )
</template> </template>

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

@@ -10,7 +10,8 @@
:width="280", :width="280",
:icon-left="!searchClient" :icon-left="!searchClient"
) )
q-icon(name="app:search", size="18px", v-if="!searchClient") template(v-slot:iconLeft, v-if="!searchClient")
q-icon(name="app:search", size="18px")
base-button( base-button(
v-if="createdClientName === ''", v-if="createdClientName === ''",
@click="searchLastName", @click="searchLastName",
@@ -42,7 +43,7 @@
<script> <script>
import ClientsTableHeaderActions from "@/pages/clients/components/ClientsTableHeaderActions"; import ClientsTableHeaderActions from "@/pages/clients/components/ClientsTableHeaderActions";
import BaseButton from "@/components/base/BaseButton.vue"; import BaseButton from "@/components/base/BaseButton.vue";
import BaseInput from "@/components/BaseInput.vue"; import BaseInput from "@/components/base/BaseInput.vue";
export default { export default {
name: "ClientsTableHat", name: "ClientsTableHat",

2
src/pages/clients/components/FormCreateAddresses.vue
View File

@@ -58,7 +58,7 @@
<script> <script>
import BaseCustomSelect from "@/components/base/BaseCustomSelect"; import BaseCustomSelect from "@/components/base/BaseCustomSelect";
import BaseInput from "@/components/BaseInput.vue"; import BaseInput from "@/components/base/BaseInput.vue";
export default { export default {
name: "FormCreateAddresses", name: "FormCreateAddresses",

2
src/pages/clients/components/FormCreateBasicInfo.vue
View File

@@ -45,7 +45,7 @@
<script> <script>
import BaseAddingNetwork from "@/components/base/BaseAddingNetwork"; import BaseAddingNetwork from "@/components/base/BaseAddingNetwork";
import BaseSelect from "@/components/base/BaseSelect"; import BaseSelect from "@/components/base/BaseSelect";
import BaseInput from "@/components/BaseInput.vue"; import BaseInput from "@/components/base/BaseInput.vue";
import BaseInputDate from "@/components/base/BaseInputDate.vue"; import BaseInputDate from "@/components/base/BaseInputDate.vue";
export default { export default {

2
src/pages/clients/components/FormCreateIdentityDocuments.vue
View File

@@ -51,7 +51,7 @@
</template> </template>
<script> <script>
import BaseInput from "@/components/BaseInput.vue"; import BaseInput from "@/components/base/BaseInput.vue";
import BaseInputDate from "@/components/base/BaseInputDate.vue"; import BaseInputDate from "@/components/base/BaseInputDate.vue";
export default { export default {

4
src/pages/clients/components/FormCreateMedicalCard.vue
View File

@@ -19,8 +19,6 @@
</template> </template>
<script> <script>
import BaseInput from "@/components/base/BaseInput";
import BaseSelect from "@/components/base/BaseSelect";
import MedicalBaseData from "@/pages/oldMedicalCard/components/MedicalBaseData"; import MedicalBaseData from "@/pages/oldMedicalCard/components/MedicalBaseData";
import MedicalIdentityDocuments from "@/pages/oldMedicalCard/components/MedicalIdentityDocuments"; import MedicalIdentityDocuments from "@/pages/oldMedicalCard/components/MedicalIdentityDocuments";
import MedicalPolicyDocuments from "@/pages/oldMedicalCard/components/MedicalPolicyDocuments"; import MedicalPolicyDocuments from "@/pages/oldMedicalCard/components/MedicalPolicyDocuments";
@@ -33,8 +31,6 @@ export default {
name: "FormCreateMedicalCard", name: "FormCreateMedicalCard",
mixins: [v_model], mixins: [v_model],
components: { components: {
BaseInput,
BaseSelect,
MedicalBaseData, MedicalBaseData,
MedicalIdentityDocuments, MedicalIdentityDocuments,
MedicalPolicyDocuments, MedicalPolicyDocuments,

6
src/pages/clients/components/FormsAgreementCreate/AgreementCommon.vue
View File

@@ -12,19 +12,19 @@
type="date", type="date",
v-model="signedDate", v-model="signedDate",
label="Дата подписания", label="Дата подписания",
outlined size="M"
) )
base-input( base-input(
type="date", type="date",
v-model="startDate", v-model="startDate",
label="Начало оказания услуг" label="Начало оказания услуг"
outlined size="M"
) )
base-input( base-input(
type="date", type="date",
v-model="endDate", v-model="endDate",
label="Окончание оказания услуг" label="Окончание оказания услуг"
outlined size="M"
) )
base-select( base-select(
placeholder="Поручить", placeholder="Поручить",

4
src/pages/clients/components/FormsAgreementCreate/AgreementPerson.vue
View File

@@ -4,8 +4,8 @@
base-input( base-input(
label="ФИО пациента", label="ФИО пациента",
v-model="patientFullName", v-model="patientFullName",
disabled disabled,
outlined size="M"
) )
//-.flex.justify-between //-.flex.justify-between
base-select.w-80( base-select.w-80(

12
src/pages/clients/components/FormsAgreementCreate/AgreementServices.vue
View File

@@ -11,20 +11,20 @@
base-input( base-input(
type="date", type="date",
v-model="signedDate", v-model="signedDate",
label="Дата подписания" label="Дата подписания",
outlined size="M"
) )
base-input( base-input(
type="date", type="date",
v-model="startDate", v-model="startDate",
label="Начало оказания услуг" label="Начало оказания услуг",
outlined size="M"
) )
base-input( base-input(
type="date", type="date",
v-model="endDate", v-model="endDate",
label="Окончание оказания услуг" label="Окончание оказания услуг",
outlined size="M"
) )
base-select( base-select(
placeholder="Поручить", placeholder="Поручить",

2
src/pages/clients/components/TableAddingNewAdditional.vue
View File

@@ -3,7 +3,7 @@
.corner .corner
.wrap.flex.flex-col.p-4.gap-y-4 .wrap.flex.flex-col.p-4.gap-y-4
.flex.flex-col.gap-y-1 .flex.flex-col.gap-y-1
base-input(:with-icon="true" v-model="newAdditionalData.header" icon-position="right" :max-length="140" placeholder="Заголовок") base-input(v-model="newAdditionalData.header", placeholder="Заголовок")
span.counter {{`${newAdditionalData.header.length}/140`}} span.counter {{`${newAdditionalData.header.length}/140`}}
.description.flex.px-4.py-3 .description.flex.px-4.py-3
textarea.w-full.h-full.outline-0.resize-none(:value="newAdditionalData.value" @input="$emit('update:newAdditionalData.value', $event.target.value)" placeholder="Описание" style="py-10") textarea.w-full.h-full.outline-0.resize-none(:value="newAdditionalData.value" @input="$emit('update:newAdditionalData.value', $event.target.value)" placeholder="Описание" style="py-10")

2
src/pages/clients/components/TableCreateNote.vue
View File

@@ -1,7 +1,7 @@
<template lang="pug"> <template lang="pug">
.flex.flex-col.gap-y-3.p-4(:style="{'width': '485px'}") .flex.flex-col.gap-y-3.p-4(:style="{'width': '485px'}")
.flex.flex-col.gap-y-3.relative .flex.flex-col.gap-y-3.relative
base-input.text-smm(placeholder="Заголовок", v-model="title", :maxLength="40", outlined) base-input.text-smm(placeholder="Заголовок", v-model="title", :maxLength="40")
.text.flex.absolute.text-xsx.right-7.top-3 {{`${changeValue}/40`}} .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") .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( textarea.place-input.w-full.outline-0.not-italic.resize-none(

4
src/pages/clients/components/TableCreatePackageDoc.vue
View File

@@ -18,7 +18,6 @@
base-input( base-input(
v-model="patient", v-model="patient",
placeholder="Введите название для пакета документов", placeholder="Введите название для пакета документов",
outlined
) )
span.counter span.counter
.flex.gap-x-4 .flex.gap-x-4
@@ -28,7 +27,7 @@
.flex.flex-col(class="gap-y-1.5") .flex.flex-col(class="gap-y-1.5")
.counter.font-semibold.text-smm Дата подписания .counter.font-semibold.text-smm Дата подписания
.input-date.flex.h-10.justify-center .input-date.flex.h-10.justify-center
base-input(type="date", :width-input="277", outlined) base-input(type="date", :width-input="277")
.flex.flex-col.gap-y-6 .flex.flex-col.gap-y-6
span.font-bold Дополнительное span.font-bold Дополнительное
.flex.flex-col.mb-124px(class="gap-y-1.5") .flex.flex-col.mb-124px(class="gap-y-1.5")
@@ -46,7 +45,6 @@
icon-position="left", icon-position="left",
:width-input="310", :width-input="310",
placeholder="Поиск", placeholder="Поиск",
outlined
) )
.counter.icon-search .counter.icon-search
base-select.h-10(placeholder="Вид услуги") base-select.h-10(placeholder="Вид услуги")

4
src/pages/clients/components/cells/TableCellBodyBirthday.vue
View File

@@ -3,13 +3,13 @@
:style="{ width : width + 'px'}" :style="{ width : width + 'px'}"
) )
span(v-if="!isOpenChange") {{ birthday }} span(v-if="!isOpenChange") {{ birthday }}
base-input( base-input.bg-white(
:width="140" :width="140"
type="date", type="date",
v-if="isOpenChange", v-if="isOpenChange",
@click.stop, @click.stop,
v-model="value.age", v-model="value.age",
outlined size="M"
) )
</template> </template>

4
src/pages/clients/components/cells/TableCellBodyEmail.vue
View File

@@ -8,12 +8,12 @@
@mouseleave="changeHover" @mouseleave="changeHover"
) {{maxValue}} ) {{maxValue}}
.email .email
base-input( base-input.bg-white(
v-if="isOpenChange", v-if="isOpenChange",
@click.stop, @click.stop,
v-model="value.email.username", v-model="value.email.username",
:placeholder="value.email.username", :placeholder="value.email.username",
outlined size="M"
) )
</template> </template>

4
src/pages/clients/components/cells/TableCellBodyName.vue
View File

@@ -7,11 +7,11 @@
img.h-full.object-cover(:src="url + photo") img.h-full.object-cover(:src="url + photo")
span.font-semibold(v-if="!isOpenChange") {{value.fullName}} span.font-semibold(v-if="!isOpenChange") {{value.fullName}}
.name(v-if="isOpenChange") .name(v-if="isOpenChange")
base-input( base-input.bg-white(
@click.stop, @click.stop,
v-model="value.fullName", v-model="value.fullName",
placeholder="Фамилия Имя Отчество", placeholder="Фамилия Имя Отчество",
outlined size="M"
) )
</template> </template>

4
src/pages/clients/components/cells/TableCellBodyPhone.vue
View File

@@ -4,12 +4,12 @@
v-if="!isOpenChange" v-if="!isOpenChange"
) {{value.phone.username.replace(/\+7(\d{3})(\d{3})(\d{2})(\d{2})/, '+7 ($1) $2-$3-$4')}} ) {{value.phone.username.replace(/\+7(\d{3})(\d{3})(\d{2})(\d{2})/, '+7 ($1) $2-$3-$4')}}
.phone(v-if="isOpenChange") .phone(v-if="isOpenChange")
base-input( base-input.bg-white(
@click.stop, @click.stop,
v-model="value.phone.username", v-model="value.phone.username",
:placeholder="value.phone.username", :placeholder="value.phone.username",
mask="+7 (###) ###-##-##", mask="+7 (###) ###-##-##",
outlined size="M"
) )
</template> </template>

2
src/pages/login/TheLogin.vue
View File

@@ -48,7 +48,7 @@ import logoMark from "@/assets/images/logoMark.svg";
import BaseButton from "@/components/base/BaseButton.vue"; import BaseButton from "@/components/base/BaseButton.vue";
import eye_open from "@/assets/icons/eye_open.svg"; import eye_open from "@/assets/icons/eye_open.svg";
import eye_close from "@/assets/icons/eye_close.svg"; import eye_close from "@/assets/icons/eye_close.svg";
import BaseInput from "@/components/BaseInput.vue"; import BaseInput from "@/components/base/BaseInput.vue";
export default { export default {
name: "TheLogin", name: "TheLogin",

7
src/pages/newCalendar/components/CalendarHeader.vue
View File

@@ -5,8 +5,10 @@
:width="280", :width="280",
size="M", size="M",
placeholder="Найти ...", placeholder="Найти ...",
icon-left
) )
q-icon(name="app:search", size="20px") template(v-slot:iconLeft)
q-icon(name="app:search", size="20px")
.flex.gap-x-4.items-center.justify-center .flex.gap-x-4.items-center.justify-center
q-btn( q-btn(
color="secondary", color="secondary",
@@ -21,7 +23,6 @@
base-input.search( base-input.search(
size="M" size="M"
:width="300", :width="300",
iconRight,
v-model="currentWeek", v-model="currentWeek",
) )
.h-5.w-5.flex.items-center.justify-center .h-5.w-5.flex.items-center.justify-center
@@ -73,7 +74,7 @@ import BaseCalendar from "@/components/base/Calendar/BaseCalendar.vue";
import { mapState, mapActions } from "vuex"; import { mapState, mapActions } from "vuex";
import { v_model } from "@/shared/mixins/v-model"; import { v_model } from "@/shared/mixins/v-model";
import DateSwitcherSvg from "@/pages/newCalendar/components/CalendarDateSwitcherSvg.vue"; import DateSwitcherSvg from "@/pages/newCalendar/components/CalendarDateSwitcherSvg.vue";
import BaseInput from "@/components/BaseInput.vue"; import BaseInput from "@/components/base/BaseInput.vue";
export default { export default {
name: "CalendarHeader", name: "CalendarHeader",
mixins: [v_model], mixins: [v_model],

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

@@ -83,7 +83,7 @@
import arrow from "@/assets/icons/double_left_arrow.svg"; import arrow from "@/assets/icons/double_left_arrow.svg";
import icon_ok from "@/assets/icons/icon_ok.svg"; import icon_ok from "@/assets/icons/icon_ok.svg";
import sort_word from "@/assets/icons/sort_word.svg"; import sort_word from "@/assets/icons/sort_word.svg";
import BaseInput from "@/components/BaseInput.vue"; import BaseInput from "@/components/base/BaseInput.vue";
import { patientList } from "@/pages/newCalendar/utils/calendarConfig.js"; import { patientList } from "@/pages/newCalendar/utils/calendarConfig.js";
import { trimName } from "@/pages/newCalendar/utils/calendarFunctions.js"; import { trimName } from "@/pages/newCalendar/utils/calendarFunctions.js";
import BaseButton from "@/components/base/BaseButton.vue"; import BaseButton from "@/components/base/BaseButton.vue";

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

@@ -127,7 +127,7 @@ import { patientList } from "@/pages/newCalendar/utils/calendarConfig.js";
import CalendarSidebarSvg from "@/pages/newCalendar/components/CalendarSidebarSvg.vue"; import CalendarSidebarSvg from "@/pages/newCalendar/components/CalendarSidebarSvg.vue";
import { trimName } from "@/pages/newCalendar/utils/calendarFunctions.js"; import { trimName } from "@/pages/newCalendar/utils/calendarFunctions.js";
import BaseButton from "@/components/base/BaseButton.vue"; import BaseButton from "@/components/base/BaseButton.vue";
import BaseInput from "@/components/BaseInput.vue"; import BaseInput from "@/components/base/BaseInput.vue";
export default { export default {
name: "CalendarSidebar", name: "CalendarSidebar",

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

@@ -63,7 +63,6 @@ import FormCreateBasicInfo from "@/pages/clients/components/FormCreateBasicInfo"
import FormCreateIdentityDocuments from "@/pages/clients/components/FormCreateIdentityDocuments"; import FormCreateIdentityDocuments from "@/pages/clients/components/FormCreateIdentityDocuments";
import FormCreateAddresses from "@/pages/clients/components/FormCreateAddresses"; import FormCreateAddresses from "@/pages/clients/components/FormCreateAddresses";
import FormCreateAttachments from "@/pages/clients/components/FormCreateAttachments.vue"; import FormCreateAttachments from "@/pages/clients/components/FormCreateAttachments.vue";
import BaseInput from "@/components/base/BaseInput.vue";
import BaseInputFullName from "@/components/base/BaseInputFullName.vue"; import BaseInputFullName from "@/components/base/BaseInputFullName.vue";
import { patientData } from "@/pages/newCalendar/utils/calendarConfig.js"; import { patientData } from "@/pages/newCalendar/utils/calendarConfig.js";
import HeaderRecordForm from "./HeaderRecordForm.vue"; import HeaderRecordForm from "./HeaderRecordForm.vue";
@@ -77,7 +76,6 @@ export default {
FormCreateIdentityDocuments, FormCreateIdentityDocuments,
FormCreateAddresses, FormCreateAddresses,
FormCreateAttachments, FormCreateAttachments,
BaseInput,
BaseInputFullName, BaseInputFullName,
BaseCalendar, BaseCalendar,
HeaderRecordForm, HeaderRecordForm,

20
src/pages/newMedicalCard/components/AllergiesForms/AllergiesForm.vue
View File

@@ -20,27 +20,19 @@
@update:model-value="checkChangeInput" @update:model-value="checkChangeInput"
name="name" name="name"
:rule="configData.name.rules" :rule="configData.name.rules"
no-error-icon
:width="350" :width="350"
placeholder="Аллерген" placeholder="Аллерген"
type="text" size="M"
:standout="!isEdit" )
:outlined="isEdit"
text-color="black"
)
base-input.w-full( base-input.w-full(
:readonly="!isEdit" :readonly="!isEdit"
v-model="allergy.title" v-model="allergy.title"
@update:model-value="checkChangeInput" @update:model-value="checkChangeInput"
name="title" name="title"
:rule="configData.title.rules" :rule="configData.title.rules"
no-error-icon placeholder="Проявление аллергии",
placeholder="Проявление аллергии" size="M"
type="text" )
:standout="!isEdit"
:outlined="isEdit"
text-color="black"
)
.delete-contact.icon-cancel.text-xxs.cursor-pointer( .delete-contact.icon-cancel.text-xxs.cursor-pointer(
v-if="isEdit" v-if="isEdit"
@click="() => deleteAllergy(index)" @click="() => deleteAllergy(index)"
@@ -60,7 +52,6 @@
<script> <script>
import MedicalFormWrapper from "@/pages/newMedicalCard/components/MedicalFormWrapper.vue"; import MedicalFormWrapper from "@/pages/newMedicalCard/components/MedicalFormWrapper.vue";
import BaseInput from "@/components/base/BaseInput.vue";
import TheNotificationProvider from "@/components/Notifications/TheNotificationProvider.vue"; import TheNotificationProvider from "@/components/Notifications/TheNotificationProvider.vue";
import { getFieldsNameUnvalidated } from "@/shared/utils/changesObjects"; import { getFieldsNameUnvalidated } from "@/shared/utils/changesObjects";
import { addNotification } from "@/components/Notifications/notificationContext"; import { addNotification } from "@/components/Notifications/notificationContext";
@@ -68,6 +59,7 @@ import { checkChangeData } from "@/shared/utils/changesObjects";
import { allergiesConfig } from "@/pages/newMedicalCard/utils/medicalConfig"; import { allergiesConfig } from "@/pages/newMedicalCard/utils/medicalConfig";
import { mapState, mapGetters } from "vuex"; import { mapState, mapGetters } from "vuex";
import { getRequestArrayData } from "@/shared/utils/wrapperRequestChangeData"; import { getRequestArrayData } from "@/shared/utils/wrapperRequestChangeData";
import BaseInput from "@/components/base/BaseInput.vue";
export default { export default {
name: "AllergiesForm", name: "AllergiesForm",

2
src/pages/newMedicalCard/components/BasicDataForms/BasicDataForm.vue
View File

@@ -78,7 +78,7 @@ import {
errorMap, errorMap,
} from "@/pages/newMedicalCard/utils/medicalConfig.js"; } from "@/pages/newMedicalCard/utils/medicalConfig.js";
import { mapGetters, mapState } from "vuex"; import { mapGetters, mapState } from "vuex";
import BaseInput from "@/components/BaseInput.vue"; import BaseInput from "@/components/base/BaseInput.vue";
import BaseInputDate from "@/components/base/BaseInputDate.vue"; import BaseInputDate from "@/components/base/BaseInputDate.vue";
export default { export default {

2
src/pages/newMedicalCard/components/BasicDataForms/ContactsForm.vue
View File

@@ -76,7 +76,7 @@ import {
import { contactsDataForm } from "@/pages/newMedicalCard/utils/medicalConfig"; import { contactsDataForm } from "@/pages/newMedicalCard/utils/medicalConfig";
import { getRequestArrayData } from "@/shared/utils/wrapperRequestChangeData"; import { getRequestArrayData } from "@/shared/utils/wrapperRequestChangeData";
import { mapState, mapGetters } from "vuex"; import { mapState, mapGetters } from "vuex";
import BaseInput from "@/components/BaseInput.vue"; import BaseInput from "@/components/base/BaseInput.vue";
export default { export default {
name: "ContactsForm", name: "ContactsForm",

2
src/pages/newMedicalCard/components/BasicDataForms/DocumentsForm.vue
View File

@@ -85,7 +85,7 @@ import {
import { fetchWrapper } from "@/shared/fetchWrapper.js"; import { fetchWrapper } from "@/shared/fetchWrapper.js";
import TheNotificationProvider from "@/components/Notifications/TheNotificationProvider"; import TheNotificationProvider from "@/components/Notifications/TheNotificationProvider";
import { addNotification } from "@/components/Notifications/notificationContext"; import { addNotification } from "@/components/Notifications/notificationContext";
import BaseInput from "@/components/BaseInput.vue"; import BaseInput from "@/components/base/BaseInput.vue";
import BaseInputDate from "@/components/base/BaseInputDate.vue"; import BaseInputDate from "@/components/base/BaseInputDate.vue";
export default { export default {
name: "DocumentsForm", name: "DocumentsForm",

18
src/pages/newMedicalCard/components/BasicDataForms/InsuranceForm.vue
View File

@@ -50,9 +50,8 @@
) )
q-field.items-center.categories( q-field.items-center.categories(
:style="{cursor: isEdit ? 'pointer' : 'default'}", :style="{cursor: isEdit ? 'pointer' : 'default'}",
standout,
:readonly="!isEdit", :readonly="!isEdit",
:outlined="isEdit", outlined
) {{selectCategory(basic[insurance.insuranceKey][field.key])}} ) {{selectCategory(basic[insurance.insuranceKey][field.key])}}
base-modal( base-modal(
default-padding, default-padding,
@@ -104,7 +103,7 @@ import BaseUploadPhoto from "@/components/base/BaseUploadPhoto.vue";
import BaseCategorySelection from "@/components/base/BaseCategorySelection.vue"; import BaseCategorySelection from "@/components/base/BaseCategorySelection.vue";
import { checkChangeData } from "@/shared/utils/changesObjects"; import { checkChangeData } from "@/shared/utils/changesObjects";
import { addNotification } from "@/components/Notifications/notificationContext"; import { addNotification } from "@/components/Notifications/notificationContext";
import BaseInput from "@/components/BaseInput.vue"; import BaseInput from "@/components/base/BaseInput.vue";
export default { export default {
name: "InsuranceForm", name: "InsuranceForm",
@@ -425,6 +424,7 @@ export default {
height: 40px height: 40px
color: var(--font-dark-blue-color) color: var(--font-dark-blue-color)
padding: 0 16px padding: 0 16px
background: var(--bg-light-grey) !important
&:before &:before
border: none !important border: none !important
transition: none transition: none
@@ -439,4 +439,16 @@ export default {
line-height: normal line-height: normal
color: var(--font-dark-blue-color) color: var(--font-dark-blue-color)
padding: 8px 0 padding: 8px 0
background: var(--bg-light-grey) !important
.q-field--outlined.q-field--readonly :deep(.q-field__control)
background: var(--bg-light-grey) !important
&:before
border-color: var(--bg-light-grey) !important
transition: none
&:hover:before
border-color: var(--bg-light-grey) !important
.q-field--outlined.q-field--readonly :deep(.q-field__native)
cursor: default
</style> </style>

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

@@ -51,39 +51,47 @@
) )
.flex.w-full.relative(v-else) .flex.w-full.relative(v-else)
q-menu.h-fit( q-menu.h-fit(
v-if="field.key === 'last_name'" v-if="field.key === 'last_name'",
fit fit,
v-model="isOpenListConfidant" v-model="isOpenListConfidant",
:style="{'max-height': '160px', 'position': 'fixed !important'}" :style="{'max-height': '160px', 'position': 'fixed !important'}",
no-focus no-focus,
anchor="bottom right" anchor="bottom right",
self="top right" self="top right"
) )
.flex.flex-col.w-full.h-full.overflow-y-auto .flex.flex-col.w-full.h-full.overflow-y-auto
.confidant-item.flex.h-10.items-center.cursor-pointer.text-base.px-2( .confidant-item.flex.h-10.items-center.cursor-pointer.text-base.px-2(
v-for="person in listPersons" v-for="person in listPersons"
:id="person.id" :id="person.id"
@click="(e) => choiceConfidant(e)" @click="(e) => choiceConfidant(e)"
) {{ `${person.last_name || ""} ${person.first_name || ""} ${person.patronymic || ""}` }} ) {{ `${person.last_name || ""} ${person.first_name || ""} ${person.patronymic || ""}` }}
base-textarea.w-full(
v-if="field.type === 'textarea'",
:readonly="!isEdit",
v-model="confidant[field.key].value",
@update:model-value="(val) => checkChangeInput(val, field.key)",
:mask="field.mask",
:type="field.type",
:name="field.key",
:placeholder="field.placeholder",
height="96px"
)
base-input.w-full( base-input.w-full(
:readonly="!isEdit" v-else,
v-model="confidant[field.key].value" :readonly="!isEdit",
@update:model-value="(val) => checkChangeInput(val, field.key)" v-model="confidant[field.key].value",
:mask="field.mask" @update:model-value="(val) => checkChangeInput(val, field.key)",
:type="field.type" :mask="field.mask",
:name="field.key" :type="field.type",
:placeholder="field.placeholder" :name="field.key",
:standout="!isEdit" :placeholder="field.placeholder",
:outlined="isEdit" :rule="field.rules",
no-error-icon size="M"
:rule="field.rules" )
text-color="black"
)
</template> </template>
<script> <script>
import MedicalFormWrapper from "@/pages/newMedicalCard/components/MedicalFormWrapper.vue"; import MedicalFormWrapper from "@/pages/newMedicalCard/components/MedicalFormWrapper.vue";
import BaseInput from "@/components/base/BaseInput.vue";
import BaseSelectNetworks from "@/components/base/BaseSelectNetworks.vue"; import BaseSelectNetworks from "@/components/base/BaseSelectNetworks.vue";
import BaseButton from "@/components/base/BaseButton.vue"; import BaseButton from "@/components/base/BaseButton.vue";
import BasePopup from "@/components/base/BasePopup.vue"; import BasePopup from "@/components/base/BasePopup.vue";
@@ -102,6 +110,8 @@ import {
mapNetworks, mapNetworks,
} from "@/pages/newMedicalCard/utils/medicalConfig"; } from "@/pages/newMedicalCard/utils/medicalConfig";
import { fetchWrapper } from "@/shared/fetchWrapper"; import { fetchWrapper } from "@/shared/fetchWrapper";
import BaseTextarea from "@/components/base/BaseTextarea.vue.vue";
import BaseInput from "@/components/base/BaseInput.vue";
export default { export default {
name: "ConfidantForm", name: "ConfidantForm",
@@ -114,6 +124,7 @@ export default {
BasePopup, BasePopup,
BaseAddingNetwork, BaseAddingNetwork,
TheNotificationProvider, TheNotificationProvider,
BaseTextarea,
}, },
data() { data() {
return { return {

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

@@ -14,7 +14,7 @@
.grey-border.rounded-md.flex.w-full.py-2.pr-4.pl-2.justify-between.items-center(v-for="picture in dataEntry.pictures") .grey-border.rounded-md.flex.w-full.py-2.pr-4.pl-2.justify-between.items-center(v-for="picture in dataEntry.pictures")
.flex.items-center .flex.items-center
img.grey-border.rounded.w-8.h-8.mr-3(:src="picture.photo") img.grey-border.rounded.w-8.h-8.mr-3(:src="picture.photo")
span.name.text-base.font-normal.mr-2.whitespace-pre-wrap {{picture.name}} span.name.text-base.font-normal.mr-2.whitespace-pre-wrap.color-dark {{picture.name}}
span.text-smm.font-normal.whitespace-nowrap(:style="{color: 'var(--font-dark-grey-color)'}") {{`${picture.size} МБ`}} span.text-smm.font-normal.whitespace-nowrap(:style="{color: 'var(--font-dark-grey-color)'}") {{`${picture.size} МБ`}}
q-icon.delete-img.cursor-pointer( q-icon.delete-img.cursor-pointer(
@click="() => deleteImg(picture.id)", @click="() => deleteImg(picture.id)",
@@ -23,18 +23,11 @@
) )
.flex.flex-col.gap-y-6px.justify-start.w-full .flex.flex-col.gap-y-6px.justify-start.w-full
span.text-smm.font-semibold.title-inputs Комментарий врача span.text-smm.font-semibold.title-inputs Комментарий врача
.flex.comments.rounded base-textarea.w-full(
base-input.w-full.min-h-75( v-model="dataEntry.comment",
v-model="dataEntry.comment", placeholder="Введите описание"
type="textarea", height="92px"
borderless, )
dense,
placeholder="Введите описание"
autogrow,
min-height="75px",
font-size="16px",
:text-color="!dataEntry.comment ? 'var(--font-grey-color)' : 'var(--font-dark-blue-color)'"
)
.flex.gap-x-2.text-smm .flex.gap-x-2.text-smm
base-button( base-button(
width="126px", width="126px",
@@ -51,16 +44,21 @@
<script> <script>
import BaseModal from "@/components/base/BaseModal.vue"; import BaseModal from "@/components/base/BaseModal.vue";
import BaseInput from "@/components/base/BaseInput.vue";
import BaseDownload from "@/components/base/BaseDownload.vue"; import BaseDownload from "@/components/base/BaseDownload.vue";
import { mapActions } from "vuex"; import { mapActions } from "vuex";
import { v_model } from "@/shared/mixins/v-model"; import { v_model } from "@/shared/mixins/v-model";
import moment from "moment"; import moment from "moment";
import BaseButton from "@/components/base/BaseButton.vue"; import BaseButton from "@/components/base/BaseButton.vue";
import BaseTextarea from "@/components/base/BaseTextarea.vue.vue";
export default { export default {
name: "HealthStateCreateModal", name: "HealthStateCreateModal",
components: { BaseModal, BaseDownload, BaseInput, BaseButton }, components: {
BaseModal,
BaseDownload,
BaseButton,
BaseTextarea,
},
mixins: [v_model], mixins: [v_model],
data() { data() {
return { return {
@@ -113,15 +111,14 @@ export default {
</script> </script>
<style lang="sass" scoped> <style lang="sass" scoped>
.color-dark
color: var(--font-dark-blue-color)
.name .name
max-width: 270px max-width: 270px
.delete-img .delete-img
color: var(--font-grey-color) color: var(--font-grey-color)
&:hover &:hover
opacity: 0.7 opacity: 0.7
.comments
border: 1px solid var(--border-light-grey-color)
padding: 3px 8px 6px 16px
.title-inputs .title-inputs
color: var(--font-grey-color) color: var(--font-grey-color)
.form-wrapper .form-wrapper

22
src/pages/newMedicalCard/components/HealthState/HealthStateForm.vue
View File

@@ -56,17 +56,17 @@
with-icon, with-icon,
size-icon="18px", size-icon="18px",
:returned-fields="['photo', 'id', 'name', 'size']" :returned-fields="['photo', 'id', 'name', 'size']"
) :width="216"
:height="92"
)
.flex.w-full.flex-col.gap-y-2 .flex.w-full.flex-col.gap-y-2
.flex.font-semibold.text-sm(:style="{color: 'var(--font-grey-color)'}") Комментарий врача .flex.font-semibold.text-sm(:style="{color: 'var(--font-grey-color)'}") Комментарий врача
.flex.comments.rounded(v-if="isEdit") base-textarea.w-full(
q-input.w-full( v-if="isEdit",
v-model="value.comment", v-model="value.comment",
type="textarea", size="126px",
borderless, height="126px"
dense, )
:input-style="{'min-height': '75px', 'font-weight': '500'}"
)
.flex.flex-col.w-full.pl-10px(v-else) .flex.flex-col.w-full.pl-10px(v-else)
.flex(v-for="comment in getListComment") .flex(v-for="comment in getListComment")
.flex.gap-x-10px.w-full(v-if="comment") .flex.gap-x-10px.w-full(v-if="comment")
@@ -77,20 +77,20 @@
<script> <script>
import MedicalFormWrapper from "@/pages/newMedicalCard/components/MedicalFormWrapper.vue"; import MedicalFormWrapper from "@/pages/newMedicalCard/components/MedicalFormWrapper.vue";
import BaseInput from "@/components/base/BaseInput";
import BaseDownload from "@/components/base/BaseDownload.vue"; import BaseDownload from "@/components/base/BaseDownload.vue";
import BaseModalShowingPicture from "@/components/base/BaseModalShowingPicture.vue"; import BaseModalShowingPicture from "@/components/base/BaseModalShowingPicture.vue";
import moment from "moment"; import moment from "moment";
import { mapActions, mapGetters } from "vuex"; import { mapActions, mapGetters } from "vuex";
import { v_model } from "@/shared/mixins/v-model"; import { v_model } from "@/shared/mixins/v-model";
import BaseTextarea from "@/components/base/BaseTextarea.vue.vue";
export default { export default {
name: "HealthStateForm", name: "HealthStateForm",
components: { components: {
MedicalFormWrapper, MedicalFormWrapper,
BaseModalShowingPicture, BaseModalShowingPicture,
BaseInput,
BaseDownload, BaseDownload,
BaseTextarea,
}, },
data() { data() {
return { return {

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

@@ -19,12 +19,15 @@
) {{item.label + " - " + item.value}} ) {{item.label + " - " + item.value}}
.filter.flex.flex-col.gap-y-4.relative(v-if="change || fillInspection") .filter.flex.flex-col.gap-y-4.relative(v-if="change || fillInspection")
.flex.gap-x-2 .flex.gap-x-2
base-input(placeholder="Поиск", outlined, :width="452", iconLeft) base-input.search(
q-icon( placeholder="Поиск",
name="app:icon-search", :width="452",
size="20px", iconLeft,
style="color: var(--font-grey-color)" size="M",
) icon-left
)
template(v-slot:iconLeft)
q-icon(name="app:search", size="20px", style="color: var(--font-grey-color)")
.button .button
q-btn( q-btn(
icon="filter_alt", icon="filter_alt",
@@ -47,9 +50,9 @@
<script> <script>
import BaseButton from "@/components/base/BaseButton.vue"; import BaseButton from "@/components/base/BaseButton.vue";
import BaseInput from "@/components/base/BaseInput.vue";
import MedicalFormWrapper from "@/pages/newMedicalCard/components/MedicalFormWrapper.vue"; import MedicalFormWrapper from "@/pages/newMedicalCard/components/MedicalFormWrapper.vue";
import { mapState } from "vuex"; import { mapState } from "vuex";
import BaseInput from "@/components/base/BaseInput.vue";
export default { export default {
name: "ClinicalForm", name: "ClinicalForm",
@@ -165,4 +168,7 @@ export default {
.q-checkbox :deep(.q-checkbox__inner:before) .q-checkbox :deep(.q-checkbox__inner:before)
background: none !important background: none !important
.search :deep(.q-field__prepend)
padding-right: 6px
</style> </style>

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

@@ -15,7 +15,7 @@
:class="{'pointer': fillInspection || change}" :class="{'pointer': fillInspection || change}"
v-for="tag in protocolData[data.state].complaints", :key="tag.id" v-for="tag in protocolData[data.state].complaints", :key="tag.id"
) {{ tag }} ) {{ tag }}
base-input.px-3(v-if="change || fillInspection", type="textarea", autogrow, borderless, placeholder="Введите данные...") q-input.input.px-3(v-if="change || fillInspection", type="textarea", autogrow, borderless, placeholder="Введите данные...")
template(v-if="!(change || fillInspection)", v-for="file in protocolData[data.state].files") template(v-if="!(change || fillInspection)", v-for="file in protocolData[data.state].files")
.wrap.flex.flex-col.gap-1.gap-y-3(v-if="file?.data?.length") .wrap.flex.flex-col.gap-1.gap-y-3(v-if="file?.data?.length")
.title.font-semibold.text-smm.mb-2 {{file.name}} .title.font-semibold.text-smm.mb-2 {{file.name}}
@@ -34,8 +34,15 @@
.title.font-medium.text-xsx {{item.size + " Мб"}} .title.font-medium.text-xsx {{item.size + " Мб"}}
.filter.flex.flex-col.gap-y-4.relative(v-if="change || fillInspection") .filter.flex.flex-col.gap-y-4.relative(v-if="change || fillInspection")
.flex.gap-x-2 .flex.gap-x-2
base-input(placeholder="Поиск", outlined, :width="232", iconLeft) base-input.search(
q-icon(name="app:icon-search", size="20px", style="color: var(--font-grey-color)") placeholder="Поиск",
:width="232",
iconLeft,
icon-left,
size="M",
)
template(v-slot:iconLeft)
q-icon(name="app:search", size="20px", style="color: var(--font-grey-color)")
.button .button
q-btn( q-btn(
icon="filter_alt", icon="filter_alt",
@@ -77,8 +84,8 @@
type="file", type="file",
id="upload", id="upload",
:accept="checkedName(file.name) ? '.xlsx, .xls, .doc, .docx, .pdf, .odt' : 'image/*'", :accept="checkedName(file.name) ? '.xlsx, .xls, .doc, .docx, .pdf, .odt' : 'image/*'",
borderless,
multiple multiple
size="62px"
) )
.text.flex.flex-col.items-center.justify-center.absolute.font-medium.text-smm.w-full .text.flex.flex-col.items-center.justify-center.absolute.font-medium.text-smm.w-full
span {{checkedName(file.name) ? 'Загрузите документ' : 'Загрузите скан документа'}} span {{checkedName(file.name) ? 'Загрузите документ' : 'Загрузите скан документа'}}
@@ -103,9 +110,9 @@
import MedicalFormWrapper from "@/pages/newMedicalCard/components/MedicalFormWrapper.vue"; import MedicalFormWrapper from "@/pages/newMedicalCard/components/MedicalFormWrapper.vue";
import TagCreationForm from "@/pages/newMedicalCard/components/InitialInspectionProtocol/Forms/TagCreationForm.vue"; import TagCreationForm from "@/pages/newMedicalCard/components/InitialInspectionProtocol/Forms/TagCreationForm.vue";
import BaseButton from "@/components/base/BaseButton.vue"; import BaseButton from "@/components/base/BaseButton.vue";
import BaseInput from "@/components/base/BaseInput.vue";
import BaseModal from "@/components/base/BaseModal.vue"; import BaseModal from "@/components/base/BaseModal.vue";
import { mapState } from "vuex"; import { mapState } from "vuex";
import BaseInput from "@/components/base/BaseInput.vue";
export default { export default {
name: "DataForm", name: "DataForm",
@@ -308,7 +315,7 @@ export default {
.download .download
height: 62px height: 62px
border: 1px dashed var(--border-light-grey-color) background-color: var(--bg-light-grey)
border-radius: 4px border-radius: 4px
cursor: pointer cursor: pointer
@@ -345,4 +352,17 @@ export default {
border-radius: 4px border-radius: 4px
width: fit-content width: fit-content
padding: 8px 16px 8px 8px padding: 8px 16px 8px 8px
.search :deep(.q-field__prepend)
padding-right: 6px
.input :deep(.q-field__native)
font-weight: 500
font-size: 14px
line-height: 135%
color: var(--font-dark-blue-color)
padding: 4px 0
&::placeholder
color: var(--font-grey-color)
opacity: 1
</style> </style>

14
src/pages/newMedicalCard/components/InitialInspectionProtocol/Forms/DiseaseForm.vue
View File

@@ -16,24 +16,24 @@
size="36px" size="36px"
) )
.textarea.flex.w-full .textarea.flex.w-full
base-input.w-full( base-textarea.w-full(
v-model="protocolData[data.state].text", v-model="protocolData[data.state].text",
type="textarea", type="textarea",
outlined,
resize="vertical", resize="vertical",
placeholder="Введите данные..." placeholder="Введите данные...",
height="126px"
) )
.font-medium.text-smm(v-else) {{protocolData[data.state]?.text}} .font-medium.text-smm(v-else) {{protocolData[data.state]?.text}}
</template> </template>
<script> <script>
import MedicalFormWrapper from "@/pages/newMedicalCard/components/MedicalFormWrapper.vue"; import MedicalFormWrapper from "@/pages/newMedicalCard/components/MedicalFormWrapper.vue";
import BaseInput from "@/components/base/BaseInput.vue";
import { mapState } from "vuex"; import { mapState } from "vuex";
import BaseTextarea from "@/components/base/BaseTextarea.vue.vue";
export default { export default {
name: "DiseaseForm", name: "DiseaseForm",
components: { MedicalFormWrapper, BaseInput }, components: { MedicalFormWrapper, BaseTextarea },
props: { props: {
data: Object, data: Object,
fillInspection: Boolean, fillInspection: Boolean,
@@ -77,8 +77,4 @@ export default {
.q-checkbox :deep(.q-checkbox__bg) .q-checkbox :deep(.q-checkbox__bg)
border-radius: 4px border-radius: 4px
border: 1.5px solid var(--font-grey-color) border: 1.5px solid var(--font-grey-color)
.textarea
box-sizing: border-box
min-height: 130px
</style> </style>

2
src/pages/newMedicalCard/components/InitialInspectionProtocol/Forms/IndexForm.vue
View File

@@ -23,10 +23,10 @@
base-input-number( base-input-number(
v-else, v-else,
v-model="modelValue", v-model="modelValue",
outlined,
:step="0.1", :step="0.1",
:max="10", :max="10",
:min="0" :min="0"
size="M"
) )
.rounded.grey-background.py-3.px-4.blue-color .rounded.grey-background.py-3.px-4.blue-color
span.font-bold.text-base.line-height Справка span.font-bold.text-base.line-height Справка

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

@@ -16,10 +16,10 @@
:max="data.config[key].max", :max="data.config[key].max",
reverse-value reverse-value
:label="data.config[key].label", :label="data.config[key].label",
outlined,
:shadow-text="data.config[key].shadowText", :shadow-text="data.config[key].shadowText",
:placeholder="`0${data.config[key].shadowText}`" :placeholder="`0${data.config[key].shadowText}`",
) size="M"
)
.flex.flex-col.gap-y-2.w-full(v-if="data.key === 'thermometry'") .flex.flex-col.gap-y-2.w-full(v-if="data.key === 'thermometry'")
base-input.w-full( base-input.w-full(
v-model="dataValue.result", v-model="dataValue.result",
@@ -69,7 +69,7 @@ import BaseInputNumber from "@/components/base/BaseInputNumber.vue";
import { thermometryResultsMap } from "@/pages/newMedicalCard/utils/medicalConfig"; import { thermometryResultsMap } from "@/pages/newMedicalCard/utils/medicalConfig";
import { mapState } from "vuex"; import { mapState } from "vuex";
import { mapActions } from "vuex"; import { mapActions } from "vuex";
import BaseInput from "@/components/BaseInput.vue"; import BaseInput from "@/components/base/BaseInput.vue";
export default { export default {
name: "ThermometryForm", name: "ThermometryForm",

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

@@ -69,7 +69,7 @@ import MedicalFormWrapper from "@/pages/newMedicalCard/components/MedicalFormWra
import TagCreationForm from "@/pages/newMedicalCard/components/InitialInspectionProtocol/Forms/TagCreationForm.vue"; import TagCreationForm from "@/pages/newMedicalCard/components/InitialInspectionProtocol/Forms/TagCreationForm.vue";
import BaseModal from "@/components/base/BaseModal.vue"; import BaseModal from "@/components/base/BaseModal.vue";
import { mapState } from "vuex"; import { mapState } from "vuex";
import BaseInput from "@/components/BaseInput.vue"; import BaseInput from "@/components/base/BaseInput.vue";
export default { export default {
name: "MedicalFormTag", name: "MedicalFormTag",

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

@@ -29,7 +29,7 @@
q-icon(name="app:icon-plus", size="10px",) q-icon(name="app:icon-plus", size="10px",)
span Добавить категорию span Добавить категорию
.flex.flex-col(class="gap-x-1.5") .flex.flex-col(class="gap-x-1.5")
new-base-input( base-input(
v-model="model.tag", v-model="model.tag",
label="Текст тега", label="Текст тега",
placeholder="Введите тег", placeholder="Введите тег",
@@ -53,7 +53,7 @@
<script> <script>
import BaseButton from "@/components/base/BaseButton.vue"; import BaseButton from "@/components/base/BaseButton.vue";
import BaseInput from "@/components/BaseInput.vue"; import BaseInput from "@/components/base/BaseInput.vue";
export default { export default {
name: "TagCreationForm", name: "TagCreationForm",

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

@@ -43,7 +43,6 @@
</template> </template>
<script> <script>
import BaseInput from "@/components/base/BaseInput.vue";
import BaseAvatar from "@/components/base/BaseAvatar.vue"; import BaseAvatar from "@/components/base/BaseAvatar.vue";
import BaseInputDate from "@/components/base/BaseInputDate.vue"; import BaseInputDate from "@/components/base/BaseInputDate.vue";
import BaseInputTime from "@/components/base/BaseInputTime.vue"; import BaseInputTime from "@/components/base/BaseInputTime.vue";
@@ -53,7 +52,6 @@ import BaseButton from "@/components/base/BaseButton.vue";
export default { export default {
name: "MedicalProtocolCreateModal", name: "MedicalProtocolCreateModal",
components: { components: {
BaseInput,
BaseAvatar, BaseAvatar,
BaseInputDate, BaseInputDate,
BaseInputTime, BaseInputTime,

8
src/pages/oldCalendar/components/CalendarFormAddEvent.vue
View File

@@ -18,7 +18,7 @@
disabled, disabled,
v-model="status.label", v-model="status.label",
label="Статус приема", label="Статус приема",
outlined size="M"
) )
base-select( base-select(
:items="ownersList", :items="ownersList",
@@ -37,21 +37,21 @@
v-model="eventDate", v-model="eventDate",
label="Дата", label="Дата",
type="date", type="date",
outlined size="M"
) )
.flex.gap-x-2.items-center.justify-between .flex.gap-x-2.items-center.justify-between
base-input( base-input(
type="time", type="time",
v-model="startTime", v-model="startTime",
label="Начало", label="Начало",
outlined size="M"
) )
span.mt-4 — span.mt-4 —
base-input( base-input(
type="time", type="time",
v-model="endTime", v-model="endTime",
label="Конец", label="Конец",
outlined size="M"
) )
q-btn.create-button( q-btn.create-button(
v-if="!selectedEventData.id", v-if="!selectedEventData.id",

14
src/pages/oldMedicalCard/components/MedicalBaseData.vue
View File

@@ -7,7 +7,7 @@
placeholder="ФИО*", placeholder="ФИО*",
v-model="clientDetail.fullName", v-model="clientDetail.fullName",
disabled, disabled,
outlined size="M"
) )
base-radio-buttons-group( base-radio-buttons-group(
:items="gendersList", :items="gendersList",
@@ -21,7 +21,7 @@
type="date", type="date",
label="Дата рождения", label="Дата рождения",
v-model="clientDetail.birth_date", v-model="clientDetail.birth_date",
outlined size="M"
) )
.input .input
base-input( base-input(
@@ -29,20 +29,20 @@
mask="###-###-### ##", mask="###-###-### ##",
label="СНИЛС", label="СНИЛС",
v-model="clientDetail.insurance_number", v-model="clientDetail.insurance_number",
outlined size="M"
) )
.flex.flex-col.gap-y-6 .flex.flex-col.gap-y-6
base-input( base-input(
label="Адрес регистрации", label="Адрес регистрации",
placeholder="Введите полный адрес", placeholder="Введите полный адрес",
v-model="clientDetail.registration_address" v-model="clientDetail.registration_address"
outlined size="M"
) )
base-input( base-input(
label="Фактический адрес места жительства", label="Фактический адрес места жительства",
placeholder="Введите полный адрес", placeholder="Введите полный адрес",
v-model="clientDetail.temporary_address" v-model="clientDetail.temporary_address"
outlined size="M"
) )
.flex.gap-x-4 .flex.gap-x-4
.input .input
@@ -51,14 +51,14 @@
placeholder="+7 (915) 644–92–23", placeholder="+7 (915) 644–92–23",
mask="+7 (###) ###-##-##", mask="+7 (###) ###-##-##",
v-model="clientDetail.phone", v-model="clientDetail.phone",
outlined size="M"
) )
.input .input
base-input( base-input(
label="Email", label="Email",
placeholder="user@yandex.ru" placeholder="user@yandex.ru"
v-model="clientDetail.email", v-model="clientDetail.email",
outlined size="M"
) )
</template> </template>

2
src/pages/oldMedicalCard/components/MedicalCardWrapper.vue
View File

@@ -97,7 +97,7 @@
.flex.flex-col.gap-y-2(v-for="(key, index) in Object.keys(dentalIndications)") .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]}`}} span.font-bold.text-xsx {{`${index+1}. ${configData.dental_indications[key]}`}}
medical-dental-formula(v-if="key === 'dental_formula'" :formula-data="dentalIndications[key]") medical-dental-formula(v-if="key === 'dental_formula'" :formula-data="dentalIndications[key]")
base-input(v-model="dentalIndications[key]" outlined v-else) base-input(v-model="dentalIndications[key]", v-else, size="M")
.flex.justify-center .flex.justify-center
q-btn( q-btn(
@click="validateFormCard", @click="validateFormCard",

8
src/pages/oldMedicalCard/components/MedicalIdentityDocuments.vue
View File

@@ -8,13 +8,13 @@
placeholder="0000 000000", placeholder="0000 000000",
mask="#### ######", mask="#### ######",
v-model="clientDetail.identity_documents.series_number", v-model="clientDetail.identity_documents.series_number",
outlined size="M"
) )
base-input( base-input(
label="Кем выдан", label="Кем выдан",
placeholder="Точно как в паспорте", placeholder="Точно как в паспорте",
v-model="clientDetail.identity_documents.issued_by_org", v-model="clientDetail.identity_documents.issued_by_org",
outlined size="M"
) )
.flex.gap-x-4 .flex.gap-x-4
base-input( base-input(
@@ -22,13 +22,13 @@
placeholder="000-000", placeholder="000-000",
mask="###-###", mask="###-###",
v-model="clientDetail.identity_documents.issued_by_org_code", v-model="clientDetail.identity_documents.issued_by_org_code",
outlined size="M"
) )
base-input( base-input(
type="date", type="date",
label="Дата выдачи", label="Дата выдачи",
v-model="clientDetail.identity_documents.issued_by_date", v-model="clientDetail.identity_documents.issued_by_date",
outlined size="M"
) )
</template> </template>

14
src/pages/oldMedicalCard/components/MedicalPolicyDocuments.vue
View File

@@ -15,13 +15,13 @@
v-model="clientDetail.OMSPolicy.number", v-model="clientDetail.OMSPolicy.number",
mask="###### ##########", mask="###### ##########",
:disabled="!selectedOMSPolicy", :disabled="!selectedOMSPolicy",
outlined size="M"
) )
base-input.input( base-input.input(
label="Страховая организация полиса ОМС", label="Страховая организация полиса ОМС",
v-model="clientDetail.OMSPolicy.organization", v-model="clientDetail.OMSPolicy.organization",
:disabled="!selectedOMSPolicy", :disabled="!selectedOMSPolicy",
outlined size="M"
) )
.flex.flex-col.gap-y-4 .flex.flex-col.gap-y-4
base-input.input( base-input.input(
@@ -30,33 +30,33 @@
v-model="clientDetail.DMSPolicy.number", v-model="clientDetail.DMSPolicy.number",
mask="###### ##########", mask="###### ##########",
:disabled="selectedOMSPolicy", :disabled="selectedOMSPolicy",
outlined size="M"
) )
base-input.input( base-input.input(
label="Страховая организация полиса ДМС", label="Страховая организация полиса ДМС",
v-model="clientDetail.DMSPolicy.organization", v-model="clientDetail.DMSPolicy.organization",
:disabled="selectedOMSPolicy", :disabled="selectedOMSPolicy",
outlined size="M"
) )
base-input( base-input(
label="Код категории льготы", label="Код категории льготы",
placeholder="000", placeholder="000",
mask="###" mask="###"
v-model="clientDetail.benefit_code", v-model="clientDetail.benefit_code",
outlined size="M"
) )
base-input( base-input(
label="К кому обращаться в случае необходимости", label="К кому обращаться в случае необходимости",
placeholder="ФИО*", placeholder="ФИО*",
v-model="clientDetail.confidant_name", v-model="clientDetail.confidant_name",
outlined size="M"
) )
base-input( base-input(
label="Номер телефона", label="Номер телефона",
placeholder="+7 (915) 644–92–23", placeholder="+7 (915) 644–92–23",
mask="+7 (###) ###-##-##", mask="+7 (###) ###-##-##",
v-model="clientDetail.confidant_phone", v-model="clientDetail.confidant_phone",
outlined size="M"
) )
</template> </template>

8
src/pages/schedule/components/FormChangeShift.vue
View File

@@ -9,14 +9,14 @@
label="Дата", label="Дата",
type="date", type="date",
v-model="replacementSheet.date", v-model="replacementSheet.date",
outlined size="M"
) )
base-input(, base-input(,
type="text" type="text"
v-model="replacementSheet.currentEmployee", v-model="replacementSheet.currentEmployee",
label="Текущий сотрудник", label="Текущий сотрудник",
outlined, outlined,
disabled size="M"
) )
base-select( base-select(
:items="ownersList", :items="ownersList",
@@ -29,14 +29,14 @@
type="time", type="time",
label="Начало", label="Начало",
v-model="replacementSheet.start_time", v-model="replacementSheet.start_time",
outlined size="M"
) )
.flex.items-center.mt-4 — .flex.items-center.mt-4 —
base-input( base-input(
type="time", type="time",
label="Конец", label="Конец",
v-model="replacementSheet.end_time", v-model="replacementSheet.end_time",
outlined size="M"
) )
.flex.justify-center .flex.justify-center
q-btn( q-btn(

4
src/pages/schedule/components/ScheduleBar.vue
View File

@@ -6,14 +6,14 @@
type="time", type="time",
v-model="times.start_time", v-model="times.start_time",
label="Начало", label="Начало",
outlined size="M"
) )
.flex.items-center.mt-6 — .flex.items-center.mt-6 —
base-input.items-center( base-input.items-center(
type="time", type="time",
v-model="times.end_time", v-model="times.end_time",
label="Конец", label="Конец",
outlined size="M"
) )
.status-wrapper.flex.flex-col.gap-y-3.p-3 .status-wrapper.flex.flex-col.gap-y-3.p-3
.flex.justify-center.items-center.h-10 .flex.justify-center.items-center.h-10

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

@@ -21,22 +21,16 @@
) )
.flex(:style="{width: '180px'}") .flex(:style="{width: '180px'}")
base-input.relative( base-input.relative(
:placeholder="dateString" :placeholder="dateString",
outlined, size="M",
:width="180"
) )
.flex.items-center q-icon(
q-icon( size="20px",
size="20px", name="app:calendar",
name="event", class="cursor-pointer",
class="cursor-pointer", style="color: var(--font-dark-blue-color)"
style="color: var(--font-dark-blue-color)" )
)
q-popup-proxy(
cover,
transition-show="scale",
transition-hide="scale"
)
q-date(v-model="date", minimal, class="font-input")
.toogle.flex .toogle.flex
q-btn( q-btn(
label="Время", label="Время",
@@ -58,8 +52,8 @@
<script> <script>
import * as moment from "moment"; import * as moment from "moment";
import BaseInput from "@/components/base/BaseInput.vue";
import BaseButton from "@/components/base/BaseButton.vue"; import BaseButton from "@/components/base/BaseButton.vue";
import BaseInput from "@/components/base/BaseInput.vue";
export default { export default {
name: "ScheduleHeader", name: "ScheduleHeader",

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

@@ -3,7 +3,7 @@
.schedule-header.flex.justify-between.py-4.px-6 .schedule-header.flex.justify-between.py-4.px-6
base-input( base-input(
placeholder="Поиск", placeholder="Поиск",
outlined size="M"
) )
.flex.items-center.cursor-pointer .flex.items-center.cursor-pointer
q-icon( q-icon(