shared-ritm 1.1.4 → 1.1.5

package/src/common/app-layout/AppLayout.vue

@@ -1,62 +0,0 @@
-<template>
-  <q-layout :class="$style.layout" view="lHh LpR fFf">
-    <!--    <div v-if="logged" :class="$style['loader-backdrop']">-->
-    <!--      <q-spinner size="md" color="white" :class="$style['loader-spinner']" />-->
-    <!--    </div>-->
-    <app-loader :loading="logged" size="md" :thickness="3" :backdrop="true" />
-    <slot name="drawer"></slot>
-    <slot name="header"></slot>
-    <q-page-container :class="{ container: container }" @wheel="mouseMove">
-      <q-page>
-        <slot></slot>
-
-        <slot name="page-bottom"></slot>
-      </q-page>
-    </q-page-container>
-
-    <slot name="footer"></slot>
-  </q-layout>
-</template>
-
-<script lang="ts" setup>
-import { defineProps } from 'vue'
-import AppLoader from '@/common/app-loader/index.vue'
-interface LayoutProps {
-  logged: boolean
-  console?: boolean
-  container?: boolean
-  padding?: string
-}
-
-const props = defineProps<LayoutProps>()
-
-function mouseMove(e: any) {
-  const content = document.getElementById('content')
-  const scrollable = e.target
-  if (content && !scrollable.closest('#content')) {
-    content.scrollBy({ top: e.deltaY })
-  }
-}
-</script>
-
-<style lang="scss" module>
-.layout {
-  position: relative;
-  background: linear-gradient(235deg, #87caff 9.16%, #5386d3 45.8%, #0b3f8e 92.27%);
-}
-//.loader {
-//  &-backdrop {
-//    width: 100%;
-//    height: 100%;
-//    background-color: rgba(255, 255, 255, 0.45);
-//    position: absolute;
-//    z-index: 9999;
-//  }
-//  &-spinner {
-//    position: absolute;
-//    top: 50%;
-//    left: 50%;
-//    z-index: 2;
-//  }
-//}
-</style>

package/src/common/app-layout/components/AppLayoutHeader.vue

@@ -1,124 +0,0 @@
-<template>
-  <q-header :class="[$style.header, { [$style[`header-full`]]: fullWidth }]">
-    <q-toolbar :class="$style.toolbar">
-      <!--      <app-input-search v-model.trim="text" type="text" label="Поиск по системе" :class="$style['header-search']" />-->
-      <div :class="$style['action-buttons']">
-        <slot name="filters-actions"></slot>
-      </div>
-
-      <div :class="$style['action-buttons']">
-        <slot name="action-buttons"></slot>
-
-        <app-button icon="person" text-color="black" :label="shortName" rounded :class="$style['button-person']" />
-        <!--        <app-button :class="$style.button" rounded>-->
-        <!--          <small-caps-icon />-->
-        <!--        </app-button>-->
-        <!--        <app-button :class="$style.button" rounded>-->
-        <!--          <search-status-icon />-->
-        <!--        </app-button>-->
-        <!--        <app-button @click="counter++" :class="$style.button" rounded :badge="`+${counter}`" badge-color="#3F8CFF">-->
-        <!--          <flash-icon />-->
-        <!--        </app-button>-->
-        <!--        <app-button :class="$style.button" rounded>-->
-        <!--          <notification-icon />-->
-        <!--        </app-button>-->
-      </div>
-    </q-toolbar>
-  </q-header>
-</template>
-
-<script lang="ts" setup>
-import { computed, defineProps } from 'vue'
-//import AppInput from '@/common/app-input-search/AppInputSearch.vue'
-import AppButton from '@/common/app-button/AppButton.vue'
-import { b } from 'vite/dist/node/types.d-aGj9QkWt'
-
-//import SmallCapsIcon from '@/icons/header/smallCapsIcon.vue'
-//import SearchStatusIcon from '@/icons/header/searchStatusIcon.vue'
-//import FlashIcon from '@/icons/header/flashIcon.vue'
-//import NotificationIcon from '@/icons/header/notificationIcon.vue'
-interface Props {
-  userData: any
-  fullWidth?: boolean
-}
-
-const props = defineProps<Props>()
-
-// const counter = ref(1)
-const shortName = computed(
-  () =>
-    `${props.userData?.last_name} ${props.userData?.first_name?.[0]}. ${props.userData?.patronymic?.[0] || ''} ${
-      props.userData?.patronymic?.[0] ? '.' : ''
-    }`,
-)
-</script>
-
-<style lang="scss" module>
-.header {
-  height: 100px;
-  background: transparent;
-  margin: 0 auto;
-  max-width: 1300px;
-}
-.header-full {
-  max-width: 100%;
-  padding: 0 20px;
-}
-.toolbar {
-  padding: 0;
-  min-height: 100%;
-}
-
-.header-search {
-  width: 412px;
-  font-size: 16px;
-}
-
-.action-buttons {
-  flex: 1;
-  position: relative;
-  display: flex;
-  align-items: center;
-  column-gap: 16px;
-  justify-content: end;
-}
-
-.button {
-  padding: 12px;
-  background: white;
-  transition: all 0.3s ease, color 0.3s ease;
-}
-
-.button-person {
-  padding: 10px 14px;
-  background: white;
-}
-
-@media (max-width: 1440px) {
-  .header {
-    height: 100px;
-    background: transparent;
-    margin: 0 auto;
-    max-width: 874px;
-  }
-  .header-search {
-    width: 343px;
-    font-size: 16px;
-  }
-  .action-buttons {
-    position: relative;
-    display: flex;
-    align-items: center;
-    column-gap: 8px;
-  }
-  .button {
-    padding: 10px;
-    background: white;
-    transition: all 0.3s ease, color 0.3s ease;
-  }
-  .button-person {
-    padding: 8px 10px;
-    background: white;
-  }
-}
-</style>

package/src/common/app-loader/index.vue

@@ -1,43 +0,0 @@
-<template>
-  <div :class="{ 'loader-backdrop': backdrop && loading }">
-    <q-spinner v-if="loading" :size="size" class="loader-spinner" :thickness="thickness" />
-  </div>
-</template>
-
-<script setup lang="ts">
-interface Props {
-  backdrop: boolean
-  loading: boolean
-  thickness: number
-  size: string
-}
-const props = withDefaults(defineProps<Props>(), {
-  backdrop: false,
-  loading: false,
-  thickness: 2,
-  size: 'md',
-})
-
-// <app-loader :loading="logged" :backdrop="true" />
-</script>
-
-<style scoped lang="scss">
-.loader {
-  &-backdrop {
-    top: 0;
-    bottom: 0;
-    left: 0;
-    right: 0;
-    background-color: rgba(255, 255, 255, 0.45);
-    position: absolute;
-    z-index: 9999;
-  }
-  &-spinner {
-    position: absolute;
-    color: #3f8cff;
-    top: 44%;
-    left: 48%;
-    z-index: 9999;
-  }
-}
-</style>

package/src/common/app-page-layout/AppPageLayout.vue

@@ -1,122 +0,0 @@
-<template lang="pug">
-q-page#content(:class="$style['page-container']")
-  q-toolbar(:class="$style['toolbar']")
-    q-toolbar-title(:class="$style.title") {{ title }}
-    div(:class="$style['action-buttons']")
-      app-button(
-        rounded
-        :class="$style['button-new']"
-        :label="'Новый ремонт'"
-        @click="emits('create-repair')"
-        color="#fff"
-        icon="add"
-      )
-      app-button(rounded :class="$style['button-video-wall']" @click="emits('routing-to-video-wall')")
-        video-wall-icon
-        span Видеостена
-      app-button(rounded :class="$style.button" @click="openFullScreenWidgets")
-        q-tooltip на весь экран
-        q-icon(name="open_in_full")
-      //app-button(rounded :class="$style.button")
-      //  graph-icon
-      //app-button(rounded :class="$style.button")
-      //  time-line-icon
-  slot
-</template>
-
-<script setup lang="ts">
-import { defineProps, defineEmits, defineAsyncComponent } from 'vue'
-import AppButton from '@/common/app-button/AppButton.vue'
-import { useQuasar } from 'quasar'
-import VideoWallIcon from '@/icons/page-header/videoWallIcon.vue'
-
-const $q = useQuasar()
-
-const FullScreenDialog = defineAsyncComponent(() => import('@/components/dialogs/full-screen-widgets/index.vue'))
-// import GraphIcon from '@/icons/page-header/graphIcon.vue'
-// import TimeLineIcon from '@/icons/page-header/timeLineIcon.vue'
-interface Props {
-  title: string
-}
-const props = defineProps<Props>()
-const emits = defineEmits(['create-repair', ''])
-
-const openFullScreenWidgets = () => {
-  $q.dialog({
-    component: FullScreenDialog,
-  })
-}
-</script>
-<style module lang="scss">
-.toolbar {
-  padding: 0;
-  margin-top: 16px;
-}
-.page-container {
-  padding: 0 4px 0 0;
-  max-width: 1300px;
-  margin: 0 auto;
-  max-height: 600px;
-  overflow: auto;
-  &::-webkit-scrollbar-thumb {
-    height: 88px;
-    background-color: #d3dbeb;
-    border-radius: 6px;
-  }
-}
-.button {
-  padding: 12px;
-  background: white;
-}
-
-.button-new {
-  padding: 12px 18px;
-  background: #3f8cff;
-}
-.button-video-wall {
-  padding: 10px 18px;
-  background: white;
-  span {
-    color: #3f8cff;
-    margin-left: 8px;
-    font-size: 16px;
-    font-weight: 700;
-  }
-}
-.title {
-  color: #fff;
-  font-family: Montserrat, sans-serif;
-  font-size: 32px;
-  font-style: normal;
-  font-weight: 700;
-  line-height: normal;
-}
-
-.action-buttons {
-  position: relative;
-  display: flex;
-  align-items: center;
-  column-gap: 16px;
-}
-
-@media (max-width: 1440px) {
-  .page-container {
-    max-width: 874px;
-  }
-  .action-buttons {
-    column-gap: 8px;
-  }
-  .title {
-    font-size: 24px;
-    line-height: normal;
-  }
-  .button {
-    padding: 10px;
-    background: white;
-  }
-  .button-new {
-    padding: 10px 12px;
-    background: #3f8cff;
-  }
-}
-</style>

package/src/common/app-select/AppSelect.vue

@@ -1,157 +0,0 @@
-<template>
-  <q-select
-    ref="select"
-    v-model="selected"
-    :options="filteredOptions"
-    :option-value="optionValue"
-    :option-label="optionLabel"
-    emit-value
-    map-options
-    :disable="isDisabled"
-    :multiple="multiple"
-    outlined
-    stack-label
-    :use-input="search"
-    :class="[$style.select]"
-    :label="label"
-    input-debounce="100"
-    :popup-content-class="$style['app-select__menu']"
-    :clearable="clearable"
-    rounded
-    autocomplete=""
-    @filter="filterFn"
-  >
-    <template v-if="multiple" #selected-item="scope">
-      <q-chip
-        v-if="scope.opt"
-        removable
-        class="q-ma-none"
-        dense
-        :tabindex="scope.tabindex"
-        color="white"
-        text-color="secondary"
-        @remove="scope.removeAtIndex(scope.index)"
-      >
-        {{ scope.opt[`${optionLabel}`] }}
-      </q-chip>
-    </template>
-    <template #no-option>
-      <q-item>{{ emptyText }}</q-item>
-    </template>
-    <q-item v-if="!lcText && type()">{{ placeholder }}</q-item>
-  </q-select>
-</template>
-<script setup lang="ts">
-import { computed, defineEmits, defineProps, ref, Ref } from 'vue'
-
-import { QSelect } from 'quasar'
-
-type Option = Record<string, any>
-
-interface AppQSelectProps {
-  modelValue: any
-  options: Option[]
-  placeholder: string
-  emptyText: string
-  optionLabel?: string
-  optionValue?: string
-  label?: string
-  multiple?: boolean
-  borderColor: string
-  isDisabled?: boolean
-  clearable?: boolean
-  search?: boolean
-}
-
-const props = defineProps<AppQSelectProps>()
-const select = ref({})
-const emit = defineEmits(['update:modelValue'])
-const selected = computed({
-  get() {
-    return props.modelValue
-  },
-  set(value) {
-    emit('update:modelValue', value)
-  },
-})
-
-const type = () => {
-  if (Array.isArray(selected.value) && !selected.value.length) return true
-  return typeof selected.value === 'string' && !selected.value
-}
-
-const lcText: Ref<string> = ref('')
-const filteredOptions = computed(() => {
-  return props.options.filter(x => x[props?.optionLabel || 'label'].toLowerCase().includes(lcText.value))
-})
-
-function filterFn(val: string, update: (arg0: () => void) => void) {
-  update(() => {
-    lcText.value = val.toLowerCase()
-  })
-}
-</script>
-<style module lang="scss">
-.wrap {
-  position: relative;
-
-  &:global(.--option-tree) {
-    cursor: pointer;
-  }
-}
-
-.select {
-  &:global(.q-field--outlined.q-field--rounded .q-field__control) {
-    border-radius: 14px;
-  }
-  &:global(.q-field--outlined .q-field__control:before) {
-    border-color: v-bind(borderColor);
-  }
-  &:global(.q-select .q-field__input) {
-    padding: 0 6px;
-  }
-  //&:global(.q-field--filled .q-field__control) {
-  //  //color: red;
-  //}
-  //&:global(.q-field--filled.q-field--focused .q-field__control) {
-  //}
-  //&:global(.q-field--filled .q-field__control:after) {
-  //  left: 8px;
-  //  right: 8px;
-  //}
-  &:global(.q-field--outlined .q-item) {
-    color: #1d1d1d;
-    position: absolute;
-    padding: 0 4px;
-    top: 18px;
-    left: 0;
-  }
-}
-
-.append-wrapper {
-  display: flex;
-  align-items: center;
-  column-gap: 4px;
-}
-
-.menu-wrap {
-  padding: 8px;
-}
-
-.search-wrapper {
-  position: sticky;
-  top: 0;
-  padding: 4px;
-  background: var(--main-bg);
-  z-index: 1;
-}
-.app-select__menu {
-  border-radius: 14px;
-  .q-item__label {
-    word-break: break-word;
-  }
-  &:global(.q-menu) {
-    max-height: 200px !important;
-  }
-}
-</style>

package/src/common/app-sheet/AppSheet.vue

@@ -1,114 +0,0 @@
-<template>
-  <q-dialog
-    ref="DialogRef"
-    :model-value="true"
-    :position="'right'"
-    :class="$style['sheet-dialog']"
-    full-height
-    full-width
-  >
-    <template v-if="type === 'details'">
-      <q-card>
-        <div class="wrapper">
-          <div class="sheet-header">
-            <h2>{{ title }}</h2>
-            <div class="close-button">
-              <q-btn v-close-popup dense flat icon="close" />
-            </div>
-          </div>
-          <div v-if="loading" class="loader">
-            <q-spinner-audio v-if="loading" class="loader-spinner" size="md" :thickness="3" color="primary" />
-          </div>
-          <slot v-else />
-        </div>
-      </q-card>
-    </template>
-    <template v-if="type === 'custom'">
-      <div v-if="loading" class="custom-wrapper">
-        <div class="loader">
-          <q-spinner-audio v-if="loading" class="loader-spinner" size="md" :thickness="3" color="primary" />
-        </div>
-      </div>
-      <slot v-else />
-    </template>
-  </q-dialog>
-</template>
-
-<script setup lang="ts">
-import { computed, defineEmits, defineProps, withDefaults } from 'vue'
-
-interface DialogProps {
-  dialogRef: any
-  loading?: boolean
-  title?: string
-  width?: string
-  type?: 'details' | 'custom'
-  tabs?: any[]
-  currentTabName?: string
-}
-
-const props = withDefaults(defineProps<DialogProps>(), {
-  title: '',
-  width: '976px',
-  type: 'details',
-  loading: false,
-  tabs: () => [],
-  currentTabName: '',
-})
-
-const emit = defineEmits(['update:dialogRef', 'update:currentTabName'])
-
-const DialogRef = computed({
-  get() {
-    return props.dialogRef
-  },
-  set(value) {
-    emit('update:dialogRef', value)
-  },
-})
-</script>
-
-<style lang="scss" scoped>
-.custom-wrapper {
-  width: v-bind(width);
-  background-color: white;
-}
-.wrapper {
-  display: flex;
-  flex-direction: column;
-  gap: 1rem;
-  width: v-bind(width);
-  height: 100vh;
-  min-height: 100vh;
-  position: relative;
-  padding: 2rem 2rem 4rem 2rem;
-  background-color: #7991ad32;
-  font-family: 'NunitoSansFont', sans-serif;
-}
-
-.sheet-header {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  h2 {
-    font-size: 36px;
-  }
-}
-.loader {
-  min-width: 976px;
-  &-spinner {
-    position: absolute;
-    top: 50%;
-    left: 50%;
-    z-index: 4;
-  }
-}
-</style>
-
-<style lang="scss" module>
-.sheet-dialog {
-  :global(.q-dialog__inner--minimized) {
-    padding: 0;
-  }
-}
-</style>