@sigmaott/base-next 1.4.0 → 1.4.2

package/src/components/MainDefaultLayout/index.vue

@@ -1,120 +1,120 @@
-<script lang="ts" setup>
-import '../../assets/global.css'
-import type { RouteRecordRaw } from 'vue-router'
-import viVN from 'element-plus/es/locale/lang/vi'
-import enEN from 'element-plus/es/locale/lang/en'
-// import { bus } from 'wujie'
-import GlobalASide from '../DefaultLayout/GlobalASide.vue'
-import GlobalHeader from '../DefaultLayout/GlobalHeader.vue'
-
-const props = withDefaults(defineProps<{
-  namespace?: string
-  asideWidth?: number
-  name?: string
-  routes: RouteRecordRaw[]
-  logoSrc?: string
-  padding?: number
-  layoutMode?: 'vertical' | 'horizontal' | string
-  version: string
-  zIndex?: number
-}>(), { padding: 12 })
-
-const { locale } = useI18n({
-  useScope: 'global',
-})
-
-const viVNCustom = { ...viVN }
-viVNCustom.el.datepicker.year = ''
-
-const localeConfig = computed(() => locale.value === 'vi' ? viVN : enEN)
-const layoutMode = useVModel(props, 'layoutMode', undefined, { defaultValue: 'vertical', passive: true })
-
-const wujieProps = window.$wujie?.props
-
-const showAside = computed(() => layoutMode?.value === 'vertical')
-
-useProvideLayoutStore({
-  ...toRefs(props),
-  layoutMode,
-})
-
-watch(layoutMode, (newValue, oldValue) => {
-  // bus.$emit('__SET_STATE__', {
-  //   meta: {
-  //     layoutMode: newValue === 'horizontal' ? 'vertical' : 'horizontal',
-  //   },
-  // })
-})
-
-// Chunk error
-
-useNuxtApp().hook('app:chunkError', () => {
-  window.location.reload()
-})
-</script>
-
-<template>
-  <el-config-provider :locale="localeConfig" :z-index="zIndex">
-    <el-container class="h-full w-full">
-      <GlobalASide v-if="showAside">
-        <template #header>
-          <slot name="aside-header" />
-        </template>
-        <template #content>
-          <slot name="aside-content" />
-        </template>
-        <template #extra>
-          <slot name="extra" />
-        </template>
-        <template #footer>
-          <slot name="aside-footer" />
-        </template>
-      </GlobalASide>
-      <el-container>
-        <el-header v-if="!showAside && wujieProps?.header !== false" :style="`--${ns}-header-padding: 0px;`">
-          <GlobalHeader>
-            <template #logo>
-              <slot name="logo" />
-            </template>
-          </GlobalHeader>
-        </el-header>
-        <el-main
-          id="main-container"
-          class="relative bg-fill"
-          :style="{
-            [`--el-main-padding`]: `${padding}px`,
-          }"
-        >
-          <slot />
-        </el-main>
-      </el-container>
-    </el-container>
-  </el-config-provider>
-</template>
-
-<style>
-.el-notification__content {
-  text-align: left !important;
-}
-
-.el-table .cell {
-  word-break: break-word !important;
-}
-</style>
-
-<i18n lang="yaml" global>
-en:
-  global:
-    loading: Loading...
-    went_wrong: Something went wrong, please try again later
-    error: Error
-  '403':
-    messsage_mutation: Your account is currently view-only and does not have editing permissions
-vi:
-  global:
-    loading: Đang tải...
-    went_wrong: Có lỗi xảy ra, vui lòng thử lại sau
-    error: Lỗi
-  '403':
-    messsage_mutation: Tài khoản của bạn hiện ở chế độ chỉ xem và không có quyền chỉnh sửa
-</i18n>
+<script lang="ts" setup>
+import '../../assets/global.css'
+import type { RouteRecordRaw } from 'vue-router'
+import viVN from 'element-plus/es/locale/lang/vi'
+import enEN from 'element-plus/es/locale/lang/en'
+// import { bus } from 'wujie'
+import GlobalASide from '../DefaultLayout/GlobalASide.vue'
+import GlobalHeader from '../DefaultLayout/GlobalHeader.vue'
+
+const props = withDefaults(defineProps<{
+  namespace?: string
+  asideWidth?: number
+  name?: string
+  routes: RouteRecordRaw[]
+  logoSrc?: string
+  padding?: number
+  layoutMode?: 'vertical' | 'horizontal' | string
+  version: string
+  zIndex?: number
+}>(), { padding: 12 })
+
+const { locale } = useI18n({
+  useScope: 'global',
+})
+
+const viVNCustom = { ...viVN }
+viVNCustom.el.datepicker.year = ''
+
+const localeConfig = computed(() => locale.value === 'vi' ? viVN : enEN)
+const layoutMode = useVModel(props, 'layoutMode', undefined, { defaultValue: 'vertical', passive: true })
+
+const wujieProps = window.$wujie?.props
+
+const showAside = computed(() => layoutMode?.value === 'vertical')
+
+useProvideLayoutStore({
+  ...toRefs(props),
+  layoutMode,
+})
+
+watch(layoutMode, (newValue, oldValue) => {
+  // bus.$emit('__SET_STATE__', {
+  //   meta: {
+  //     layoutMode: newValue === 'horizontal' ? 'vertical' : 'horizontal',
+  //   },
+  // })
+})
+
+// Chunk error
+
+useNuxtApp().hook('app:chunkError', () => {
+  window.location.reload()
+})
+</script>
+
+<template>
+  <el-config-provider :locale="localeConfig" :z-index="zIndex">
+    <el-container class="h-full w-full">
+      <GlobalASide v-if="showAside">
+        <template #header>
+          <slot name="aside-header" />
+        </template>
+        <template #content>
+          <slot name="aside-content" />
+        </template>
+        <template #extra>
+          <slot name="extra" />
+        </template>
+        <template #footer>
+          <slot name="aside-footer" />
+        </template>
+      </GlobalASide>
+      <el-container>
+        <el-header v-if="!showAside && wujieProps?.header !== false" :style="`--${ns}-header-padding: 0px;`">
+          <GlobalHeader>
+            <template #logo>
+              <slot name="logo" />
+            </template>
+          </GlobalHeader>
+        </el-header>
+        <el-main
+          id="main-container"
+          class="relative bg-fill"
+          :style="{
+            [`--el-main-padding`]: `${padding}px`,
+          }"
+        >
+          <slot />
+        </el-main>
+      </el-container>
+    </el-container>
+  </el-config-provider>
+</template>
+
+<style>
+.el-notification__content {
+  text-align: left !important;
+}
+
+.el-table .cell {
+  word-break: break-word !important;
+}
+</style>
+
+<i18n lang="yaml" global>
+en:
+  global:
+    loading: Loading...
+    went_wrong: Something went wrong, please try again later
+    error: Error
+  '403':
+    messsage_mutation: Your account is currently view-only and does not have editing permissions
+vi:
+  global:
+    loading: Đang tải...
+    went_wrong: Có lỗi xảy ra, vui lòng thử lại sau
+    error: Lỗi
+  '403':
+    messsage_mutation: Tài khoản của bạn hiện ở chế độ chỉ xem và không có quyền chỉnh sửa
+</i18n>

package/src/components/NoticeAddLicense.vue

@@ -1,20 +1,20 @@
-<script setup lang="ts">
-const emit = defineEmits(['add-license'])
-</script>
-
-<template>
-  <el-card class="[&_.el-card\_\_body]:!p-6px">
-    <div class="flex items-center justify-between text-sm">
-      <slot />
-      <el-button type="primary" @click="emit('add-license')">
-        {{ $t('addLicense') }}
-      </el-button>
-    </div>
-  </el-card>
-</template>
-
-<style scoped>
-:deep(.el-card__body) {
-  padding: 6px;
-}
-</style>
+<script setup lang="ts">
+const emit = defineEmits(['add-license'])
+</script>
+
+<template>
+  <el-card class="[&_.el-card\_\_body]:!p-6px">
+    <div class="flex items-center justify-between text-sm">
+      <slot />
+      <el-button type="primary" @click="emit('add-license')">
+        {{ $t('addLicense') }}
+      </el-button>
+    </div>
+  </el-card>
+</template>
+
+<style scoped>
+:deep(.el-card__body) {
+  padding: 6px;
+}
+</style>

package/src/components/NoticeRunningOutResources.vue

@@ -1,20 +1,20 @@
-<script setup lang="ts">
-const emit = defineEmits(['upgrade-now'])
-</script>
-
-<template>
-  <el-card class="[&_.el-card\_\_body]:!p-6px">
-    <div class="flex items-center justify-between text-sm">
-      <slot />
-      <el-button type="primary" @click="emit('upgrade-now')">
-        {{ $t('seeMoreOptions') }}
-      </el-button>
-    </div>
-  </el-card>
-</template>
-
-<style scoped>
-:deep(.el-card__body){
-  padding: 6px;
-}
-</style>
+<script setup lang="ts">
+const emit = defineEmits(['upgrade-now'])
+</script>
+
+<template>
+  <el-card class="[&_.el-card\_\_body]:!p-6px">
+    <div class="flex items-center justify-between text-sm">
+      <slot />
+      <el-button type="primary" @click="emit('upgrade-now')">
+        {{ $t('seeMoreOptions') }}
+      </el-button>
+    </div>
+  </el-card>
+</template>
+
+<style scoped>
+:deep(.el-card__body){
+  padding: 6px;
+}
+</style>

package/src/components/Pagination.vue

@@ -1,61 +1,61 @@
-<script lang="ts" setup>
-const props = withDefaults(
-  defineProps<{
-    total: number
-    layout?: string
-  }>(),
-  { layout: 'total, sizes, prev, pager, next, jumper' },
-)
-
-const emit = defineEmits<{
-  refresh: []
-  currentChange: [page: number]
-  sizeChange: [size: number]
-}>()
-
-const { params } = defineModels<{
-  params: {
-    page: number
-    perPage: number
-  }
-  total: number
-}>()
-
-const { total, layout } = toRefs(props)
-
-function handleSizeChange(value: number) {
-  params.value.perPage = value
-  params.value.page = 1
-  emit('sizeChange', value)
-}
-
-const refreshForm = reactive({
-  enabled: true,
-  duration: 10,
-})
-</script>
-
-<template>
-  <div class="mt-16px flex items-center justify-between">
-    <div class="flex items-center gap-2">
-      <slot name="total" />
-      <el-pagination
-        :key="`${params.perPage}`"
-        v-model:current-page="params.page"
-        class="bottom-2"
-        background
-        :page-sizes="[10, 15, 20, 50, 100]"
-        :page-size="params.perPage"
-        :layout
-        :total="total"
-        @size-change="handleSizeChange"
-        @current-change="(page : number) => (emit('currentChange', page))"
-      />
-    </div>
-    <div class="flex-shrink-0">
-      <slot>
-        <SSAutoRefreshOld :duration="refreshForm.duration" :enabled="refreshForm.enabled" @on-refresh="emit('refresh')" />
-      </slot>
-    </div>
-  </div>
-</template>
+<script lang="ts" setup>
+const props = withDefaults(
+  defineProps<{
+    total: number
+    layout?: string
+  }>(),
+  { layout: 'total, sizes, prev, pager, next, jumper' },
+)
+
+const emit = defineEmits<{
+  refresh: []
+  currentChange: [page: number]
+  sizeChange: [size: number]
+}>()
+
+const { params } = defineModels<{
+  params: {
+    page: number
+    perPage: number
+  }
+  total: number
+}>()
+
+const { total, layout } = toRefs(props)
+
+function handleSizeChange(value: number) {
+  params.value.perPage = value
+  params.value.page = 1
+  emit('sizeChange', value)
+}
+
+const refreshForm = reactive({
+  enabled: true,
+  duration: 10,
+})
+</script>
+
+<template>
+  <div class="mt-16px flex items-center justify-between">
+    <div class="flex items-center gap-2">
+      <slot name="total" />
+      <el-pagination
+        :key="`${params.perPage}`"
+        v-model:current-page="params.page"
+        class="bottom-2"
+        background
+        :page-sizes="[10, 15, 20, 50, 100]"
+        :page-size="params.perPage"
+        :layout
+        :total="total"
+        @size-change="handleSizeChange"
+        @current-change="(page : number) => (emit('currentChange', page))"
+      />
+    </div>
+    <div class="flex-shrink-0">
+      <slot>
+        <SSAutoRefreshOld :duration="refreshForm.duration" :enabled="refreshForm.enabled" @on-refresh="emit('refresh')" />
+      </slot>
+    </div>
+  </div>
+</template>

package/src/components/QueryBuilder/components/inputs/DateInputField.vue

@@ -1,105 +1,105 @@
-<script lang="ts" setup>
-import type { Config, JsonRule } from '../../types'
-
-const props = defineProps<{
-  config: Config
-  value: JsonRule
-  inputLength: number
-}>()
-
-const rule = useVModel(props, 'value')
-const { t } = useI18n()
-const _rule = {
-  trigger: ['blur', 'input'],
-  validator: () => {
-    if (!rule.value.value![0])
-      return new Error(t('required'))
-  },
-}
-
-const dateTypePicker = computed(() => {
-  if (props.inputLength === 2)
-    return props.value.input === 'date' ? 'daterange' : 'datetimerange'
-  else return props.value.input
-})
-const timezone = computed(() => APP_DETAIL_STORAGE.value?.[1]?.user?.timezone)
-const timezoneOffset = computed(() => dayjs().tz(dayjs.tz.guess()).utcOffset() - dayjs().tz(timezone.value).utcOffset())
-
-const proxyValue = computed({
-  get() {
-    if (rule.value.value[0])
-      return dayjs(rule.value.value[0]).subtract(timezoneOffset.value, 'minute').toISOString()
-    return undefined
-  },
-  set(value) {
-    rule.value.value[0] = dayjs(value).add(timezoneOffset.value, 'minute').toISOString()
-  },
-})
-</script>
-
-<template>
-  <div>
-    <el-form-item class="!mb-0" :rules="_rule">
-      <el-date-picker
-        v-if="inputLength === 1"
-        v-model="proxyValue"
-        :type="dateTypePicker"
-        class="!w-240px"
-        :placeholder="t('placeholder')"
-        popper-class="custom-date-popper"
-        :popper-options="{
-          placement: 'bottom-end',
-          modifiers: [
-            { name: 'flip', enabled: false },
-          ],
-        }"
-      />
-    </el-form-item>
-
-    <el-form-item class="!mb-0" :rules="_rule">
-      <el-date-picker
-        v-if="inputLength === 2"
-        v-model="rule.value[0]"
-        :type="dateTypePicker"
-        class="!w-380px"
-        :placeholder="t('placeholder')"
-        popper-class="custom-date-popper"
-        :popper-options="{
-          placement: 'bottom-end',
-          modifiers: [
-            { name: 'flip', enabled: false },
-          ],
-        }"
-      />
-    </el-form-item>
-  </div>
-</template>
-
-<i18n lang="yaml">
-en:
-  required: Please enter value
-  placeholder: Enter value
-vi:
-  required: Vui lòng nhập giá trị
-  placeholder: Nhập giá trị
-</i18n>
-
-<style lang="scss">
-.custom-date-popper {
-  background: red;
-  transform: translateY(-50%);
-  transition-duration: 0s !important;
-
-  .el-date-table th {
-    padding: 0;
-  }
-
-  .el-popper__arrow {
-    display: none;
-  }
-
-  .el-date-table td {
-    padding: 0;
-  }
-}
-</style>
+<script lang="ts" setup>
+import type { Config, JsonRule } from '../../types'
+
+const props = defineProps<{
+  config: Config
+  value: JsonRule
+  inputLength: number
+}>()
+
+const rule = useVModel(props, 'value')
+const { t } = useI18n()
+const _rule = {
+  trigger: ['blur', 'input'],
+  validator: () => {
+    if (!rule.value.value![0])
+      return new Error(t('required'))
+  },
+}
+
+const dateTypePicker = computed(() => {
+  if (props.inputLength === 2)
+    return props.value.input === 'date' ? 'daterange' : 'datetimerange'
+  else return props.value.input
+})
+const timezone = computed(() => APP_DETAIL_STORAGE.value?.[1]?.user?.timezone)
+const timezoneOffset = computed(() => dayjs().tz(dayjs.tz.guess()).utcOffset() - dayjs().tz(timezone.value).utcOffset())
+
+const proxyValue = computed({
+  get() {
+    if (rule.value.value[0])
+      return dayjs(rule.value.value[0]).subtract(timezoneOffset.value, 'minute').toISOString()
+    return undefined
+  },
+  set(value) {
+    rule.value.value[0] = dayjs(value).add(timezoneOffset.value, 'minute').toISOString()
+  },
+})
+</script>
+
+<template>
+  <div>
+    <el-form-item class="!mb-0" :rules="_rule">
+      <el-date-picker
+        v-if="inputLength === 1"
+        v-model="proxyValue"
+        :type="dateTypePicker"
+        class="!w-240px"
+        :placeholder="t('placeholder')"
+        popper-class="custom-date-popper"
+        :popper-options="{
+          placement: 'bottom-end',
+          modifiers: [
+            { name: 'flip', enabled: false },
+          ],
+        }"
+      />
+    </el-form-item>
+
+    <el-form-item class="!mb-0" :rules="_rule">
+      <el-date-picker
+        v-if="inputLength === 2"
+        v-model="rule.value[0]"
+        :type="dateTypePicker"
+        class="!w-380px"
+        :placeholder="t('placeholder')"
+        popper-class="custom-date-popper"
+        :popper-options="{
+          placement: 'bottom-end',
+          modifiers: [
+            { name: 'flip', enabled: false },
+          ],
+        }"
+      />
+    </el-form-item>
+  </div>
+</template>
+
+<i18n lang="yaml">
+en:
+  required: Please enter value
+  placeholder: Enter value
+vi:
+  required: Vui lòng nhập giá trị
+  placeholder: Nhập giá trị
+</i18n>
+
+<style lang="scss">
+.custom-date-popper {
+  background: red;
+  transform: translateY(-50%);
+  transition-duration: 0s !important;
+
+  .el-date-table th {
+    padding: 0;
+  }
+
+  .el-popper__arrow {
+    display: none;
+  }
+
+  .el-date-table td {
+    padding: 0;
+  }
+}
+</style>