shared-ritm 1.2.97 → 1.2.99

package/src/common/app-table/controllers/useColumnSelector.ts

@@ -1,38 +1,38 @@
-import { computed, ref } from 'vue'
-
-export interface ColumnConfig {
-  name: string
-  label: string
-  [key: string]: any
-}
-
-export function useColumnSelector(allColumns: ColumnConfig[], fixedColumnNames: string[] = []) {
-  const selectedColumnNames = ref<string[]>([...new Set([...fixedColumnNames, ...allColumns.map(col => col.name)])])
-
-  const visibleColumns = computed(() => allColumns.filter(col => selectedColumnNames.value.includes(col.name)))
-
-  function openColumnSelectorDialog($q: any) {
-    $q.dialog({
-      title: 'Выберите колонки',
-      options: {
-        type: 'checkbox',
-        model: [...selectedColumnNames.value],
-        items: allColumns.map(col => ({
-          label: col.label,
-          value: col.name,
-          disable: fixedColumnNames.includes(col.name),
-        })),
-      },
-      cancel: true,
-      persistent: true,
-    }).onOk((val: string[]) => {
-      selectedColumnNames.value = Array.from(new Set([...val, ...fixedColumnNames]))
-    })
-  }
-
-  return {
-    selectedColumnNames,
-    visibleColumns,
-    openColumnSelectorDialog,
-  }
-}
+import { computed, ref } from 'vue'
+
+export interface ColumnConfig {
+  name: string
+  label: string
+  [key: string]: any
+}
+
+export function useColumnSelector(allColumns: ColumnConfig[], fixedColumnNames: string[] = []) {
+  const selectedColumnNames = ref<string[]>([...new Set([...fixedColumnNames, ...allColumns.map(col => col.name)])])
+
+  const visibleColumns = computed(() => allColumns.filter(col => selectedColumnNames.value.includes(col.name)))
+
+  function openColumnSelectorDialog($q: any) {
+    $q.dialog({
+      title: 'Выберите колонки',
+      options: {
+        type: 'checkbox',
+        model: [...selectedColumnNames.value],
+        items: allColumns.map(col => ({
+          label: col.label,
+          value: col.name,
+          disable: fixedColumnNames.includes(col.name),
+        })),
+      },
+      cancel: true,
+      persistent: true,
+    }).onOk((val: string[]) => {
+      selectedColumnNames.value = Array.from(new Set([...val, ...fixedColumnNames]))
+    })
+  }
+
+  return {
+    selectedColumnNames,
+    visibleColumns,
+    openColumnSelectorDialog,
+  }
+}

package/src/common/app-table/controllers/useTableModel.ts

@@ -1,93 +1,93 @@
-import { Ref, computed, ref } from 'vue'
-
-export interface TableColumn {
-  name: string
-  label: string
-  style?: string
-  headerStyle?: string
-  field?: string | ((row: any) => any)
-  sortable?: boolean
-  filterType?: 'single' | 'multi' | null
-  align?: 'left' | 'center' | 'right'
-  badge?: {
-    true?: string
-    false?: string
-    colorTrue?: string
-    colorFalse?: string
-  }
-  format?: (val: any) => any
-  html?: boolean
-}
-
-export interface FilterOption {
-  id: string
-  name: string
-}
-
-export interface TableModel<T = any> {
-  columns: TableColumn[]
-  rows: T[] | Ref<T[]>
-  filtersOptions?: Ref<Record<string, FilterOption[]>>
-}
-
-export const useTableModel = <T = any>(model: TableModel<T>) => {
-  const columnFilters = ref<Record<string, string | string[] | undefined>>({})
-  const filterMenus = ref<Record<string, boolean>>({})
-
-  model.columns.forEach(({ name, filterType }) => {
-    if (filterType) {
-      columnFilters.value[name] = filterType === 'multi' ? [] : undefined
-      filterMenus.value[name] = false
-    }
-  })
-
-  const resolvedRows = computed(() => (Array.isArray(model.rows) ? model.rows : model.rows.value))
-
-  const toggleFilterValue = (colName: string, value: string) => {
-    const col = model.columns.find(c => c.name === colName)
-    if (col?.filterType === 'multi') {
-      const current = columnFilters.value[colName] as string[]
-      const index = current.indexOf(value)
-      index > -1 ? current.splice(index, 1) : current.push(value)
-      columnFilters.value[colName] = [...current]
-    } else {
-      columnFilters.value[colName] = value
-      filterMenus.value[colName] = false
-    }
-  }
-
-  const selectedFilters = computed(() => {
-    const result: Record<string, string[]> = {}
-    for (const col of model.columns) {
-      const filter = columnFilters.value[col.name]
-      const options = model.filtersOptions?.value[col.name] || []
-
-      if (filter) {
-        result[col.name] = Array.isArray(filter)
-          ? options.filter(opt => filter.includes(opt.name)).map(opt => opt.id)
-          : options.filter(opt => opt.name === filter).map(opt => opt.id)
-      }
-    }
-    return result
-  })
-
-  const clearFilter = (colName: string) => {
-    const col = model.columns.find(c => c.name === colName)
-    columnFilters.value[colName] = col?.filterType === 'multi' ? [] : undefined
-  }
-
-  const openFilterMenu = (colName: string, isOpen: boolean) => {
-    filterMenus.value[colName] = isOpen
-  }
-
-  return {
-    rows: resolvedRows,
-    columns: computed(() => model.columns),
-    columnFilters,
-    filterMenus,
-    toggleFilterValue,
-    clearFilter,
-    openFilterMenu,
-    selectedFilters,
-  }
-}
+import { Ref, computed, ref } from 'vue'
+
+export interface TableColumn {
+  name: string
+  label: string
+  style?: string
+  headerStyle?: string
+  field?: string | ((row: any) => any)
+  sortable?: boolean
+  filterType?: 'single' | 'multi' | null
+  align?: 'left' | 'center' | 'right'
+  badge?: {
+    true?: string
+    false?: string
+    colorTrue?: string
+    colorFalse?: string
+  }
+  format?: (val: any) => any
+  html?: boolean
+}
+
+export interface FilterOption {
+  id: string
+  name: string
+}
+
+export interface TableModel<T = any> {
+  columns: TableColumn[]
+  rows: T[] | Ref<T[]>
+  filtersOptions?: Ref<Record<string, FilterOption[]>>
+}
+
+export const useTableModel = <T = any>(model: TableModel<T>) => {
+  const columnFilters = ref<Record<string, string | string[] | undefined>>({})
+  const filterMenus = ref<Record<string, boolean>>({})
+
+  model.columns.forEach(({ name, filterType }) => {
+    if (filterType) {
+      columnFilters.value[name] = filterType === 'multi' ? [] : undefined
+      filterMenus.value[name] = false
+    }
+  })
+
+  const resolvedRows = computed(() => (Array.isArray(model.rows) ? model.rows : model.rows.value))
+
+  const toggleFilterValue = (colName: string, value: string) => {
+    const col = model.columns.find(c => c.name === colName)
+    if (col?.filterType === 'multi') {
+      const current = columnFilters.value[colName] as string[]
+      const index = current.indexOf(value)
+      index > -1 ? current.splice(index, 1) : current.push(value)
+      columnFilters.value[colName] = [...current]
+    } else {
+      columnFilters.value[colName] = value
+      filterMenus.value[colName] = false
+    }
+  }
+
+  const selectedFilters = computed(() => {
+    const result: Record<string, string[]> = {}
+    for (const col of model.columns) {
+      const filter = columnFilters.value[col.name]
+      const options = model.filtersOptions?.value[col.name] || []
+
+      if (filter) {
+        result[col.name] = Array.isArray(filter)
+          ? options.filter(opt => filter.includes(opt.name)).map(opt => opt.id)
+          : options.filter(opt => opt.name === filter).map(opt => opt.id)
+      }
+    }
+    return result
+  })
+
+  const clearFilter = (colName: string) => {
+    const col = model.columns.find(c => c.name === colName)
+    columnFilters.value[colName] = col?.filterType === 'multi' ? [] : undefined
+  }
+
+  const openFilterMenu = (colName: string, isOpen: boolean) => {
+    filterMenus.value[colName] = isOpen
+  }
+
+  return {
+    rows: resolvedRows,
+    columns: computed(() => model.columns),
+    columnFilters,
+    filterMenus,
+    toggleFilterValue,
+    clearFilter,
+    openFilterMenu,
+    selectedFilters,
+  }
+}

package/src/common/app-toggle/AppToggle.vue

@@ -1,24 +1,24 @@
-<template>
-  <div>
-    <q-toggle v-model="value" :disable="disable" />
-  </div>
-</template>
-
-<script setup lang="ts">
-import { computed, defineProps, defineEmits } from 'vue'
-
-interface Props {
-  modelValue: any
-  disable?: boolean
-}
-
-const props = defineProps<Props>()
-const emit = defineEmits(['update:modelValue', 'number'])
-
-const value = computed({
-  get: () => props.modelValue,
-  set: (newValue: any) => emit('update:modelValue', newValue),
-})
-</script>
-
-<style module lang="scss"></style>
+<template>
+  <div>
+    <q-toggle v-model="value" :disable="disable" />
+  </div>
+</template>
+
+<script setup lang="ts">
+import { computed, defineProps, defineEmits } from 'vue'
+
+interface Props {
+  modelValue: any
+  disable?: boolean
+}
+
+const props = defineProps<Props>()
+const emit = defineEmits(['update:modelValue', 'number'])
+
+const value = computed({
+  get: () => props.modelValue,
+  set: (newValue: any) => emit('update:modelValue', newValue),
+})
+</script>
+
+<style module lang="scss"></style>

package/src/common/app-wrapper/AppWrapper.vue

@@ -1,28 +1,28 @@
-<template>
-  <div class="app-wrapper">
-    <slot />
-  </div>
-</template>
-<script setup lang="ts"></script>
-<style scoped lang="scss">
-.app-wrapper {
-  width: 100%;
-  height: 100%;
-  margin: 20px 0 12px 0;
-  padding: 30px;
-  border-radius: 8px;
-  background: #fff;
-  outline: 4px solid #598dd5;
-  outline-offset: -3px;
-  box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25), 0px 4px 4px 0px #c4d7f1 inset,
-    0px 0px 6.4px 3px rgba(31, 82, 159, 0.5), 0px 6px 58px 0px rgba(0, 49, 122, 0.1);
-}
-
-@media (max-width: 1440px) {
-  .app-wrapper {
-    margin: 10px 0;
-    padding: 14px;
-    border-radius: 8px;
-  }
-}
-</style>
+<template>
+  <div class="app-wrapper">
+    <slot />
+  </div>
+</template>
+<script setup lang="ts"></script>
+<style scoped lang="scss">
+.app-wrapper {
+  width: 100%;
+  height: 100%;
+  margin: 20px 0 12px 0;
+  padding: 30px;
+  border-radius: 8px;
+  background: #fff;
+  outline: 4px solid #598dd5;
+  outline-offset: -3px;
+  box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25), 0px 4px 4px 0px #c4d7f1 inset,
+    0px 0px 6.4px 3px rgba(31, 82, 159, 0.5), 0px 6px 58px 0px rgba(0, 49, 122, 0.1);
+}
+
+@media (max-width: 1440px) {
+  .app-wrapper {
+    margin: 10px 0;
+    padding: 14px;
+    border-radius: 8px;
+  }
+}
+</style>

package/src/global.d.ts

@@ -1 +1 @@
-declare module 'shared-ritm'
+declare module 'shared-ritm'

package/src/icons/components/arrow-down-icon.vue

@@ -1,25 +1,25 @@
-<script>
-export default {
-  name: 'ArrowDownIcon',
-}
-</script>
-
-<template>
-  <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
-    <path
-      d="M12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2Z"
-      stroke="#3F8CFF"
-      stroke-width="1.5"
-      stroke-miterlimit="10"
-      stroke-linecap="round"
-      stroke-linejoin="round"
-    />
-    <path
-      d="M15.53 10.74L12 14.26L8.47003 10.74"
-      stroke="#3F8CFF"
-      stroke-width="1.5"
-      stroke-linecap="round"
-      stroke-linejoin="round"
-    />
-  </svg>
-</template>
+<script>
+export default {
+  name: 'ArrowDownIcon',
+}
+</script>
+
+<template>
+  <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
+    <path
+      d="M12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2Z"
+      stroke="#3F8CFF"
+      stroke-width="1.5"
+      stroke-miterlimit="10"
+      stroke-linecap="round"
+      stroke-linejoin="round"
+    />
+    <path
+      d="M15.53 10.74L12 14.26L8.47003 10.74"
+      stroke="#3F8CFF"
+      stroke-width="1.5"
+      stroke-linecap="round"
+      stroke-linejoin="round"
+    />
+  </svg>
+</template>

package/src/icons/components/arrow-frame-icon.vue

@@ -1,19 +1,19 @@
-<template>
-  <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
-    <path
-      d="M12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22Z"
-      stroke="currentStroke"
-      stroke-width="1.5"
-      stroke-miterlimit="10"
-      stroke-linecap="round"
-      stroke-linejoin="round"
-    />
-    <path
-      d="M8.46997 13.26L12 9.73999L15.53 13.26"
-      stroke="currentStroke"
-      stroke-width="1.5"
-      stroke-linecap="round"
-      stroke-linejoin="round"
-    />
-  </svg>
-</template>
+<template>
+  <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
+    <path
+      d="M12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22Z"
+      stroke="currentStroke"
+      stroke-width="1.5"
+      stroke-miterlimit="10"
+      stroke-linecap="round"
+      stroke-linejoin="round"
+    />
+    <path
+      d="M8.46997 13.26L12 9.73999L15.53 13.26"
+      stroke="currentStroke"
+      stroke-width="1.5"
+      stroke-linecap="round"
+      stroke-linejoin="round"
+    />
+  </svg>
+</template>

package/src/icons/components/arrow-square.vue

@@ -1,22 +1,22 @@
-<script setup lang="ts"></script>
-
-<template>
-  <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-    <path
-      d="M9 22H15C20 22 22 20 22 15V9C22 4 20 2 15 2H9C4 2 2 4 2 9V15C2 20 4 22 9 22Z"
-      stroke="#3F8CFF"
-      stroke-width="1.5"
-      stroke-linecap="round"
-      stroke-linejoin="round"
-    />
-    <path
-      d="M10.7402 15.53L14.2602 12L10.7402 8.46997"
-      stroke="#3F8CFF"
-      stroke-width="1.5"
-      stroke-linecap="round"
-      stroke-linejoin="round"
-    />
-  </svg>
-</template>
-
-<style scoped lang="scss"></style>
+<script setup lang="ts"></script>
+
+<template>
+  <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path
+      d="M9 22H15C20 22 22 20 22 15V9C22 4 20 2 15 2H9C4 2 2 4 2 9V15C2 20 4 22 9 22Z"
+      stroke="#3F8CFF"
+      stroke-width="1.5"
+      stroke-linecap="round"
+      stroke-linejoin="round"
+    />
+    <path
+      d="M10.7402 15.53L14.2602 12L10.7402 8.46997"
+      stroke="#3F8CFF"
+      stroke-width="1.5"
+      stroke-linecap="round"
+      stroke-linejoin="round"
+    />
+  </svg>
+</template>
+
+<style scoped lang="scss"></style>

package/src/icons/components/table-filter-icon.vue

@@ -1,30 +1,30 @@
-<script setup lang="ts"></script>
-
-<template>
-  <svg xmlns="http://www.w3.org/2000/svg" width="20" height="21" viewBox="0 0 20 21" fill="none">
-    <path
-      d="M11.9328 16.1547C11.9328 16.663 11.5995 17.3297 11.1745 17.588L9.99948 18.3463C8.90781 19.0213 7.39114 18.263 7.39114 16.913V12.4547C7.39114 11.863 7.05781 11.1047 6.71615 10.688L3.51612 7.32131C3.09112 6.89631 2.75781 6.14632 2.75781 5.63799V3.70465C2.75781 2.69632 3.51616 1.93799 4.44116 1.93799H15.5578C16.4828 1.93799 17.2411 2.69631 17.2411 3.62131V5.47131C17.2411 6.14631 16.8161 6.98799 16.3995 7.40465"
-      stroke="#A4B4CF"
-      stroke-width="1.5"
-      stroke-miterlimit="10"
-      stroke-linecap="round"
-      stroke-linejoin="round"
-    />
-    <path
-      d="M13.3923 14.0301C14.865 14.0301 16.0589 12.8362 16.0589 11.3635C16.0589 9.89069 14.865 8.69678 13.3923 8.69678C11.9195 8.69678 10.7256 9.89069 10.7256 11.3635C10.7256 12.8362 11.9195 14.0301 13.3923 14.0301Z"
-      stroke="#A4B4CF"
-      stroke-width="1.5"
-      stroke-linecap="round"
-      stroke-linejoin="round"
-    />
-    <path
-      d="M16.5589 14.5301L15.7256 13.6968"
-      stroke="#A4B4CF"
-      stroke-width="1.5"
-      stroke-linecap="round"
-      stroke-linejoin="round"
-    />
-  </svg>
-</template>
-
-<style scoped lang="scss"></style>
+<script setup lang="ts"></script>
+
+<template>
+  <svg xmlns="http://www.w3.org/2000/svg" width="20" height="21" viewBox="0 0 20 21" fill="none">
+    <path
+      d="M11.9328 16.1547C11.9328 16.663 11.5995 17.3297 11.1745 17.588L9.99948 18.3463C8.90781 19.0213 7.39114 18.263 7.39114 16.913V12.4547C7.39114 11.863 7.05781 11.1047 6.71615 10.688L3.51612 7.32131C3.09112 6.89631 2.75781 6.14632 2.75781 5.63799V3.70465C2.75781 2.69632 3.51616 1.93799 4.44116 1.93799H15.5578C16.4828 1.93799 17.2411 2.69631 17.2411 3.62131V5.47131C17.2411 6.14631 16.8161 6.98799 16.3995 7.40465"
+      stroke="#A4B4CF"
+      stroke-width="1.5"
+      stroke-miterlimit="10"
+      stroke-linecap="round"
+      stroke-linejoin="round"
+    />
+    <path
+      d="M13.3923 14.0301C14.865 14.0301 16.0589 12.8362 16.0589 11.3635C16.0589 9.89069 14.865 8.69678 13.3923 8.69678C11.9195 8.69678 10.7256 9.89069 10.7256 11.3635C10.7256 12.8362 11.9195 14.0301 13.3923 14.0301Z"
+      stroke="#A4B4CF"
+      stroke-width="1.5"
+      stroke-linecap="round"
+      stroke-linejoin="round"
+    />
+    <path
+      d="M16.5589 14.5301L15.7256 13.6968"
+      stroke="#A4B4CF"
+      stroke-width="1.5"
+      stroke-linecap="round"
+      stroke-linejoin="round"
+    />
+  </svg>
+</template>
+
+<style scoped lang="scss"></style>

package/src/icons/dialogs/RemoveIcon.vue

@@ -1,12 +1,12 @@
-<template>
-  <svg xmlns="http://www.w3.org/2000/svg" width="50" height="50" viewBox="0 0 60 60" fill="none">
-    <path
-      fill-rule="evenodd"
-      clip-rule="evenodd"
-      d="M35 2.5C38.9942 2.5 42.2592 5.6223 42.4873 9.55932L42.5 10V12.5H47.5H52.5C53.8807 12.5 55 13.6193 55 15C55 16.2821 54.0349 17.3388 52.7916 17.4832L52.5 17.5H50V50C50 53.9942 46.8777 57.2592 42.9407 57.4873L42.5 57.5H17.5C13.5058 57.5 10.2408 54.3777 10.0127 50.4407L10 50V17.5H7.5C6.11929 17.5 5 16.3807 5 15C5 13.7179 5.9651 12.6612 7.20845 12.5168L7.5 12.5H12.5H17.5V10C17.5 6.0058 20.6223 2.74085 24.5593 2.51273L25 2.5H35ZM15 17.5V50C15 51.2821 15.9651 52.3388 17.2084 52.4832L17.5 52.5H42.5C43.7821 52.5 44.8388 51.5349 44.9832 50.2916L45 50V17.5H40H20H15ZM37.5 12.5H22.5V10L22.5168 9.70845C22.6612 8.4651 23.7179 7.5 25 7.5H35L35.2916 7.51682C36.5349 7.66123 37.5 8.71791 37.5 10V12.5ZM25 25C26.2821 25 27.3388 25.9651 27.4832 27.2084L27.5 27.5V42.5C27.5 43.8807 26.3807 45 25 45C23.7179 45 22.6612 44.0349 22.5168 42.7916L22.5 42.5V27.5C22.5 26.1193 23.6193 25 25 25ZM37.4832 27.2084C37.3388 25.9651 36.2821 25 35 25C33.6193 25 32.5 26.1193 32.5 27.5V42.5L32.5168 42.7916C32.6612 44.0349 33.7179 45 35 45C36.3807 45 37.5 43.8807 37.5 42.5V27.5L37.4832 27.2084Z"
-      fill="#F65160"
-    />
-  </svg>
-</template>
-
-<style scoped lang="scss"></style>
+<template>
+  <svg xmlns="http://www.w3.org/2000/svg" width="50" height="50" viewBox="0 0 60 60" fill="none">
+    <path
+      fill-rule="evenodd"
+      clip-rule="evenodd"
+      d="M35 2.5C38.9942 2.5 42.2592 5.6223 42.4873 9.55932L42.5 10V12.5H47.5H52.5C53.8807 12.5 55 13.6193 55 15C55 16.2821 54.0349 17.3388 52.7916 17.4832L52.5 17.5H50V50C50 53.9942 46.8777 57.2592 42.9407 57.4873L42.5 57.5H17.5C13.5058 57.5 10.2408 54.3777 10.0127 50.4407L10 50V17.5H7.5C6.11929 17.5 5 16.3807 5 15C5 13.7179 5.9651 12.6612 7.20845 12.5168L7.5 12.5H12.5H17.5V10C17.5 6.0058 20.6223 2.74085 24.5593 2.51273L25 2.5H35ZM15 17.5V50C15 51.2821 15.9651 52.3388 17.2084 52.4832L17.5 52.5H42.5C43.7821 52.5 44.8388 51.5349 44.9832 50.2916L45 50V17.5H40H20H15ZM37.5 12.5H22.5V10L22.5168 9.70845C22.6612 8.4651 23.7179 7.5 25 7.5H35L35.2916 7.51682C36.5349 7.66123 37.5 8.71791 37.5 10V12.5ZM25 25C26.2821 25 27.3388 25.9651 27.4832 27.2084L27.5 27.5V42.5C27.5 43.8807 26.3807 45 25 45C23.7179 45 22.6612 44.0349 22.5168 42.7916L22.5 42.5V27.5C22.5 26.1193 23.6193 25 25 25ZM37.4832 27.2084C37.3388 25.9651 36.2821 25 35 25C33.6193 25 32.5 26.1193 32.5 27.5V42.5L32.5168 42.7916C32.6612 44.0349 33.7179 45 35 45C36.3807 45 37.5 43.8807 37.5 42.5V27.5L37.4832 27.2084Z"
+      fill="#F65160"
+    />
+  </svg>
+</template>
+
+<style scoped lang="scss"></style>

package/src/icons/dialogs/SafetyIcon.vue

@@ -1,12 +1,12 @@
-<template>
-  <svg width="60" height="60" viewBox="0 0 50 50" fill="none" xmlns="http://www.w3.org/2000/svg">
-    <path
-      fill-rule="evenodd"
-      clip-rule="evenodd"
-      d="M47.5 2.5H12.5C6.97715 2.5 2.5 6.97715 2.5 12.5V25C2.5 35.9165 9.14893 45.4216 22.0963 53.4484C26.938 56.45 33.062 56.45 37.9037 53.4484L38.8284 52.8657C51.1712 44.9576 57.5 35.6473 57.5 25V12.5C57.5 6.97715 53.0228 2.5 47.5 2.5ZM12.5 7.5H47.5C50.2614 7.5 52.5 9.73858 52.5 12.5V25C52.5 33.7331 47.1592 41.5899 36.1469 48.6456L35.2535 49.2085C32.0413 51.1999 27.9586 51.1999 24.7309 49.1988C13.1268 42.0048 7.5 33.9609 7.5 25V12.5C7.5 9.73858 9.73858 7.5 12.5 7.5ZM44.2833 15.7258C43.3072 14.7492 41.7243 14.7488 40.7477 15.7248L27.5 28.9625L21.7783 23.2302L21.543 23.0221C20.5629 22.2587 19.1448 22.3268 18.2428 23.2273C17.2657 24.2028 17.2643 25.7857 18.2398 26.7628L25.7308 34.2663L25.9662 34.4745C26.9467 35.2382 28.3655 35.1696 29.2673 34.2682L44.2823 19.2613L44.4904 19.0258C45.2532 18.0453 45.1842 16.6272 44.2833 15.7258Z"
-      fill="#00D097"
-    />
-  </svg>
-</template>
-
-<style scoped lang="scss"></style>
+<template>
+  <svg width="60" height="60" viewBox="0 0 50 50" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path
+      fill-rule="evenodd"
+      clip-rule="evenodd"
+      d="M47.5 2.5H12.5C6.97715 2.5 2.5 6.97715 2.5 12.5V25C2.5 35.9165 9.14893 45.4216 22.0963 53.4484C26.938 56.45 33.062 56.45 37.9037 53.4484L38.8284 52.8657C51.1712 44.9576 57.5 35.6473 57.5 25V12.5C57.5 6.97715 53.0228 2.5 47.5 2.5ZM12.5 7.5H47.5C50.2614 7.5 52.5 9.73858 52.5 12.5V25C52.5 33.7331 47.1592 41.5899 36.1469 48.6456L35.2535 49.2085C32.0413 51.1999 27.9586 51.1999 24.7309 49.1988C13.1268 42.0048 7.5 33.9609 7.5 25V12.5C7.5 9.73858 9.73858 7.5 12.5 7.5ZM44.2833 15.7258C43.3072 14.7492 41.7243 14.7488 40.7477 15.7248L27.5 28.9625L21.7783 23.2302L21.543 23.0221C20.5629 22.2587 19.1448 22.3268 18.2428 23.2273C17.2657 24.2028 17.2643 25.7857 18.2398 26.7628L25.7308 34.2663L25.9662 34.4745C26.9467 35.2382 28.3655 35.1696 29.2673 34.2682L44.2823 19.2613L44.4904 19.0258C45.2532 18.0453 45.1842 16.6272 44.2833 15.7258Z"
+      fill="#00D097"
+    />
+  </svg>
+</template>
+
+<style scoped lang="scss"></style>