sprof 0.1.0 → 0.1.2

package/src/components/RightTabsContainer.vue

@@ -1,210 +0,0 @@
-<template>
-  <div class="mainblock">
-    <div
-      class="slider-block"
-      :style="{
-        marginRight: mobileWindow
-          ? isToggle
-            ? '49px'
-            : `calc(49px - ${sliderOnWidth})`
-          : isToggle
-            ? sliderOffWidth
-            : `calc(${sliderOffWidth} - ${sliderOnWidth})`,
-        width: sliderOnWidth,
-        minHeight: sliderOffWidth,
-        height: isToggle ? 'auto' : '100px',
-      }"
-    >
-      <div
-        class="slider-icon"
-        :style="{
-          border: isToggle ? '1px solid #379FFF' : '1px solid #00B5A4',
-          background: isToggle ? '#ffffff' : '#C7ECEA',
-        }"
-        @click="toggleSlider(!isToggle)"
-        @mouseenter="hovering = true"
-        @mouseleave="hovering = false"
-      >
-        <div
-          class="icon-block"
-          :style="{
-            transform: hovering
-              ? isToggle
-                ? 'rotate(-225deg) scale(1.2, 1.2)'
-                : 'rotate(0deg) scale(1.2, 1.2)'
-              : isToggle
-                ? 'rotate(-225deg)'
-                : 'rotate(0deg)',
-            fill: isToggle ? '#379FFF' : '#00B5A4',
-          }"
-        >
-          <slot name="icon" />
-        </div>
-      </div>
-
-      <div
-        class="slider-info"
-        :style="{
-          width: `calc(${sliderOnWidth} - ${sliderOffWidth})`,
-        }"
-      >
-        <slot name="slider-body" />
-      </div>
-    </div>
-
-    <div class="body-block">
-      <slot name="body" />
-    </div>
-
-    <div class="tab-block">
-      <slot name="tabs" />
-    </div>
-  </div>
-</template>
-
-<script lang="ts" setup>
-const props = defineProps({
-  sliderOffWidth: {
-    type: String as PropType<string>,
-    required: false,
-    default: '101px',
-  },
-  sliderOnWidth: {
-    type: String as PropType<string>,
-    required: false,
-    default: '332px',
-  },
-  background: {
-    type: String as PropType<string>,
-    required: false,
-    default: 'inherit',
-  },
-  isToggle: {
-    type: Boolean as PropType<boolean>,
-    required: false,
-    default: false,
-  },
-  mobileWidth: {
-    type: String as PropType<string>,
-    required: false,
-    default: '768px',
-  },
-});
-const emit = defineEmits(['toggle']);
-const mounted = ref(false);
-const mobileWindow = ref(window.matchMedia('(max-width: 768px)').matches);
-const toggleSlider = (toggle: boolean) => {
-  emit('toggle', toggle);
-};
-const hovering = ref(false);
-
-onBeforeMount(async () => {
-  window.addEventListener('resize', () => {
-    switch (props.mobileWidth) {
-      case '1330px':
-        return (mobileWindow.value = window.matchMedia('(max-width: 1330px)').matches);
-      case '1215px':
-        return (mobileWindow.value = window.matchMedia('(max-width: 1215px)').matches);
-      case '1024px':
-        return (mobileWindow.value = window.matchMedia('(max-width: 1024px)').matches);
-      case '768px':
-        return (mobileWindow.value = window.matchMedia('(max-width: 768px)').matches);
-    }
-    return (mobileWindow.value = window.matchMedia('(max-width: 1330px)').matches);
-  });
-  mounted.value = true;
-});
-</script>
-
-<style lang="scss" scoped>
-@import '@/services/assets/styles/index.scss';
-
-.mainblock {
-  position: relative;
-  display: flex;
-  justify-content: left;
-  width: auto;
-  height: 100%;
-  padding: 0;
-  background: $secondary-background;
-  overflow: hidden;
-}
-
-.slider-block {
-  position: absolute;
-  top: 8px;
-  right: 0;
-  display: flex;
-  justify-content: left;
-  cursor: pointer;
-  transition: 0.3s;
-  z-index: 10;
-}
-
-.slider-icon {
-  min-width: 91px;
-  height: 91px;
-  margin-right: 10px;
-  border-radius: $border-radius;
-  box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 5px;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-
-.icon-block {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  transition: 0.3s;
-}
-
-.tab-block {
-  width: 110px;
-  background: $secondary-background;
-  display: flex;
-  flex-direction: column;
-  overflow: hidden;
-  margin-top: 109px;
-}
-
-.body-block {
-  position: relative;
-  width: calc(100% - 110px);
-  height: calc(100% - 10px);
-  background: $secondary-background;
-  overflow: hidden;
-  overflow-y: auto;
-  // padding-right: 3px;
-}
-
-@media screen and (max-width: 768px) {
-  .slider-icon {
-    min-width: 42px;
-    height: 42px;
-    margin-right: 8px;
-    border-radius: $border-radius;
-    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 5px;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-  }
-
-  .tab-block {
-    width: 50px;
-    background: $secondary-background;
-    display: flex;
-    flex-direction: column;
-    overflow: hidden;
-    margin-top: 55px;
-    cursor: pointer;
-  }
-
-  .body-block {
-    position: relative;
-    width: calc(100% - 55px);
-    height: 100%;
-    background: $secondary-background;
-  }
-}
-</style>

package/src/components/SelectValueType.vue

@@ -1,39 +0,0 @@
-<template>
-  <PString string="Выберите вид ответа:" font-size="14px" padding="0" justify-content="left" margin="10px 0" />
-  <PSelect :model-value="selectedType" placeholder="Вид ответа" @change="select">
-    <option v-for="(value, type) in types" :key="value" :label="value" :value="type" />
-  </PSelect>
-</template>
-
-<script setup lang="ts">
-import ValueTypes from '@/services/types/ValueTypes';
-
-defineProps({
-  selectedType: {
-    type: String as PropType<ValueTypes>,
-    required: true,
-  },
-});
-const types = {
-  [ValueTypes.String]: 'Текстовый ответ',
-  [ValueTypes.Text]: 'Развёрнутый текстовый ответ',
-  [ValueTypes.Number]: 'Числовой ответ',
-  [ValueTypes.Date]: 'Ответ в виде даты',
-  [ValueTypes.Radio]: 'Выбор одного из вариантов',
-  [ValueTypes.Set]: 'Выбор нескольких вариантов',
-  [ValueTypes.File]: 'Ответ в виде файла',
-  [ValueTypes.MatrixRadio]: 'Матрица с одним выбором',
-  [ValueTypes.MatrixSet]: 'Матрица с несколькими выборами',
-};
-const emits = defineEmits(['select']);
-
-const select = (t: ValueTypes) => {
-  emits('select', t);
-};
-</script>
-
-<style lang="scss" scoped>
-.red {
-  background: red;
-}
-</style>

package/src/components/SingleNameToggleForm.vue

@@ -1,399 +0,0 @@
-<template>
-  <el-form ref="form" style="width: 100%">
-    <InfoItem
-      title="Название"
-      :show-save-dialog="showSaveDialog"
-      icon="edit-title"
-      :with-hover="true"
-      :close="closeToggle"
-      width="100%"
-      @keyup-enter="submit"
-      @after-close="resetCopy"
-    >
-      <PString v-if="name.length" :string="name.length > 60 ? name.slice(0, 60) + '...' : name" />
-      <PString v-else string="Введите данные" color="#B0A4C0" />
-      <template #open-inside-content>
-        <InfoItem
-          title=""
-          icon="edit-title"
-          :with-open-window="false"
-          :with-hover="false"
-          border-color="#ffffff"
-          base-box-margin="0 0 15px 0"
-          padding="0"
-          width="100%"
-          custom-class="test"
-          open-width="100%"
-        >
-          <div class="field">
-            <el-form>
-              <el-form-item style="width: 100%" prop="surname">
-                <el-input v-model="name" style="width: 100%" :autosize="true" type="textarea" />
-              </el-form-item>
-            </el-form>
-          </div>
-        </InfoItem>
-        <PButton type="admin" color="blue" text="Сохранить" @click="submit" />
-      </template>
-    </InfoItem>
-  </el-form>
-</template>
-
-<script setup lang="ts">
-import { PropType, Ref, ref } from 'vue';
-
-import InfoItem from '@/services/components/InfoItem.vue';
-import IWithName from '@/services/interfaces/IWithName';
-
-const props = defineProps({
-  withName: {
-    type: Object as PropType<IWithName>,
-    required: true,
-  },
-});
-const emit = defineEmits(['submit']);
-
-const closeToggle: Ref<boolean> = ref(false);
-const form = ref();
-const name: Ref<string> = ref(props.withName.name);
-const showSaveDialog: Ref<boolean> = ref(false);
-
-const resetCopy = () => {
-  showSaveDialog.value = false;
-};
-
-const submit = async (): Promise<void> => {
-  name.value.trim();
-  props.withName.setName(name.value);
-  closeToggle.value = !closeToggle.value;
-  emit('submit');
-};
-</script>
-
-<style lang="scss" scoped>
-@import '@/services/assets/styles/index.scss';
-
-.field {
-  width: 100%;
-}
-
-.button {
-  width: auto;
-  height: 34px;
-  border-radius: 5px;
-  color: #006bb4;
-  font-size: 12px;
-
-  &-filter {
-    background: #ffffff;
-  }
-
-  &-download {
-    background: #dff2f8;
-  }
-}
-
-:deep(.button-register) {
-  width: auto;
-  height: 34px;
-  border-radius: 5px;
-  color: #006bb4;
-  background: #ffffff;
-  font-size: 12px;
-}
-
-:deep(.name-item) {
-  margin: 0;
-  width: auto;
-  border-color: #ffffff;
-  padding: 0;
-}
-
-.grid {
-  max-width: auto;
-  grid-gap: 10px;
-  margin: 0;
-  grid-template-columns: repeat(auto-fit, minmax(100%, 1fr));
-}
-
-.plus-button {
-  width: 100%;
-  height: 34px;
-  border-radius: 5px;
-  color: #00bea5;
-  background: #c1efeb;
-}
-
-.save-picker-button {
-  width: 100%;
-  height: 34px;
-  border-radius: 5px;
-  color: #006bb4;
-  background: #dff2f8;
-}
-
-.gender-button {
-  width: 42px;
-  border-radius: 5px;
-  height: 42px;
-  color: #006bb4;
-  background: #dff2f8;
-  margin: 2px 10px 0 0;
-  font-size: 18px;
-}
-
-.save-button {
-  width: 100%;
-  border-radius: 5px;
-  height: 42px;
-  color: #006bb4;
-  background: #dff2f8;
-  margin: 2px 10px 0 0;
-  font-size: 14px;
-}
-
-:deep(.edit-button) {
-  min-width: 40px;
-  max-width: 40px;
-  height: 40px;
-  border-radius: 5px;
-  color: #006bb4;
-  background: #dff2f8;
-}
-
-:deep(.files-buttons) {
-  width: auto;
-  height: 34px;
-  border-radius: 5px;
-  color: #006bb4;
-  background: #dff2f8;
-  font-size: 12px;
-
-  &:hover {
-    background: #dff2f8;
-  }
-}
-
-.edv {
-  font-size: 14px;
-  padding: 0;
-  margin: 0 5px 0 0;
-
-  &-active {
-    color: #b0a4c0;
-  }
-}
-
-.patient-name {
-  color: #006bb4;
-  font-size: 17px;
-  min-width: 150px;
-  width: 100%;
-  padding: 0;
-}
-
-.hidden {
-  display: none;
-}
-
-.scroll-block {
-  height: 75vh;
-  overflow: hidden;
-  overflow-y: scroll;
-  margin-left: 8px;
-}
-
-.registers-tooltip {
-  &:hover {
-    cursor: pointer;
-  }
-}
-
-.patient-link {
-  &:hover {
-    cursor: pointer;
-    text-decoration: underline;
-  }
-}
-
-.tag-link:hover {
-  background-color: darken(white, 10%);
-  cursor: pointer;
-}
-
-.flex-block {
-  width: 100%;
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-}
-
-:deep(.edit-icon) {
-  width: 28px;
-  height: 28px;
-  color: #006bb4;
-}
-
-.item-flex {
-  display: flex;
-  width: 100%;
-  justify-content: space-between;
-  align-items: center;
-  margin: 0 10px 0 0;
-}
-
-.item-flex:last-child {
-  margin: 10px 0;
-}
-
-.line-item-left {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  width: auto;
-  padding: 0;
-}
-
-.line-item-right {
-  display: flex;
-  justify-content: right;
-  align-items: center;
-  width: auto;
-  padding: 0;
-}
-
-:deep(.icon-plus) {
-  fill: #00b5a4;
-  width: 24px;
-  height: 24px;
-  cursor: pointer;
-}
-
-.icon-filter {
-  width: 24px;
-  height: 24px;
-  cursor: pointer;
-  stroke: #006bb4;
-  fill: none;
-}
-
-.icon-del {
-  width: 10px;
-  height: 10px;
-  cursor: pointer;
-}
-
-.patient-count {
-  margin-top: 10px;
-  color: $site_light_pink;
-  font-size: 14px;
-}
-
-:deep(.el-form-item) {
-  margin: 8px 0 0 0;
-}
-
-@media (max-width: 1915px) {
-  .flex-block {
-    width: 100%;
-    display: block;
-    justify-content: space-between;
-    align-items: center;
-  }
-  .line-item {
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    width: 100%;
-    padding: 0;
-  }
-  .item-flex {
-    display: flex;
-    width: 100%;
-    justify-content: space-between;
-    align-items: center;
-    margin-top: 10px;
-  }
-
-  .item-flex:last-child {
-    margin-top: 10px;
-    margin-bottom: 10px;
-  }
-}
-
-@media (max-width: 560px) {
-  .line-item-left {
-    margin: 10px 0;
-  }
-
-  .line-item-right {
-    margin: 10px 0;
-    justify-content: space-between;
-  }
-
-  .item-flex:first-child {
-    display: block;
-    width: 100%;
-    margin: 0 0px 10px 0;
-  }
-}
-
-.save-button {
-  width: 100%;
-  border-radius: 5px;
-  height: 42px;
-  color: #006bb4;
-  background: #dff2f8;
-  margin: 10px 0 0 0;
-  font-size: 14px;
-}
-
-:deep(.el-date-editor.el-input, .el-date-editor.el-input__inner) {
-  width: 100%;
-}
-
-:deep(.el-form-item) {
-  display: block;
-  margin-bottom: 16px;
-}
-
-:deep(.el-input__inner) {
-  height: 40px;
-  width: 100%;
-  display: flex;
-  font-family: Comfortaa, Arial, Helvetica, sans-serif;
-  font-size: 15px;
-  color: $site_dark_gray;
-}
-
-:deep(.el-input__inner::placeholder) {
-  color: $site_light_pink;
-}
-
-:deep(.el-input__icon) {
-  color: $site_dark_gray;
-}
-
-:deep(.el-form-item__label) {
-  color: $site_light_pink;
-  padding: 0 !important;
-  text-transform: uppercase;
-  margin-left: 5px;
-  font-size: 14px;
-  margin-bottom: 6px;
-}
-
-:deep(.el-input-number__increase) {
-  border-radius: 0;
-}
-
-:deep(.el-input-number__decrease) {
-  border-radius: 0;
-}
-
-:deep(.el-textarea__inner) {
-  font-family: Comfortaa, Arial, Helvetica, sans-serif;
-  font-size: 15px;
-  color: $site_dark_gray;
-}
-</style>