wui-components-v2 1.1.69 → 1.1.71

package/components/wui-menus1/components/navbar.vue

@@ -1,43 +1,43 @@
-<script lang="ts" setup>
-import { defineOptions, defineProps } from 'vue'
-import { useManualTheme } from '../../../composables/useManualTheme'
-import { desaturateColor, getFirstChar } from '../../../utils'
-
-import { useUser } from '../../../composables/useUser'
-import { useMenus } from '../../../composables/useMenus'
-import { useSectionMenus } from '../../../composables/useSectionMenus'
-
-defineOptions({
-  name: 'Navbar',
-})
-defineProps<{
-  navTitle: string
-}>()
-const { currentThemeColor } = useManualTheme()
-const { messageBar } = useSectionMenus(true)
-const { gotoPage } = useMenus()
-const { nickName } = useUser()
-
-function messageAction() {
-  if (messageBar.value) {
-    gotoPage(messageBar.value)
-  }
-}
-</script>
-
-<template>
-  <view class="bg-white pa-3 backdrop-filter dark:bg-black">
-    <view class="mx-auto max-w-7xl p-x-1">
-      <view class="flex items-center justify-center">
-        <view
-          class="bg-clip-text font-size-5 text-transparent font-600 font-sans"
-          :style="{ color: currentThemeColor.primary }"
-        >
-          {{ navTitle }}
-        </view>
-      </view>
-    </view>
-  </view>
-</template>
-
-<style scoped></style>
+<script lang="ts" setup>
+import { defineOptions, defineProps } from 'vue'
+import { useManualTheme } from '../../../composables/useManualTheme'
+import { desaturateColor, getFirstChar } from '../../../utils'
+
+import { useUser } from '../../../composables/useUser'
+import { useMenus } from '../../../composables/useMenus'
+import { useSectionMenus } from '../../../composables/useSectionMenus'
+
+defineOptions({
+  name: 'Navbar',
+})
+defineProps<{
+  navTitle: string
+}>()
+const { currentThemeColor } = useManualTheme()
+const { messageBar } = useSectionMenus(true)
+const { gotoPage } = useMenus()
+const { nickName } = useUser()
+
+function messageAction() {
+  if (messageBar.value) {
+    gotoPage(messageBar.value)
+  }
+}
+</script>
+
+<template>
+  <view class="bg-white pa-3 backdrop-filter dark:bg-black">
+    <view class="mx-auto max-w-7xl p-x-1">
+      <view class="flex items-center justify-center">
+        <view
+          class="bg-clip-text font-size-5 text-transparent font-600 font-sans"
+          :style="{ color: currentThemeColor.primary }"
+        >
+          {{ navTitle }}
+        </view>
+      </view>
+    </view>
+  </view>
+</template>
+
+<style scoped></style>

package/components/wui-menus1/components/quick-panel.vue

@@ -1,55 +1,55 @@
-<script lang="ts" setup>
-import { computed, defineOptions } from 'vue'
-import { RainbowColorGenerator } from '../../../utils'
-import { useSectionMenus } from '../../../composables/useSectionMenus'
-import { useLanguageStore } from '../../../store/language'
-
-defineOptions({
-  name: 'QuickPanel',
-})
-const { quickPanel } = useSectionMenus(true)
-const languageStore = useLanguageStore()
-const colorGenerator = new RainbowColorGenerator()
-const cstatistics = computed(() => {
-  return quickPanel.value.map((item) => {
-    const color = colorGenerator.getNextColor()
-    return {
-      ...item,
-      color,
-    }
-  })
-})
-</script>
-
-<template>
-  <view v-if="cstatistics.length > 0" class="pb-2">
-    <view>
-      <view class="mb-2 flex items-center gap-2 font-semibold dark:text-white text-gray-800">
-        {{ languageStore.t('数据统计') }}
-      </view>
-      <view class="grid grid-cols-2 gap-3">
-        <view v-for="(item) in cstatistics" :key="item.id" :style="{ '--wbg-color': item.color }" class="relative relative overflow-hidden rounded-2xl bg-white p-5 shadow-[0_4px_16px_rgba(99,102,241,0.1)] transition-250 before:absolute before:right-0 before:top-0 before:h-20 before:w-20 before:translate-x-30% before:rounded-full before:bg-[var(--wbg-color)] dark:bg-black before:opacity-10 before:content-[''] before:-translate-y-30%">
-          <view class="mb-3 flex items-center justify-between">
-            <view class="h-8 w-8 flex items-center justify-center rounded-2" :style="{ background: item.color }">
-              <svg class="h-4 w-4 text-white dark:text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 7h8m0 0v8m0-8l-8 8-4-4-6 6" />
-              </svg>
-            </view>
-          </view>
-          <view class="flex flex-col items-center justify-center">
-            <view class="text-size-2xl fw-800 dark:text-white text-gray-900">
-              {{ item.count }}
-            </view>
-            <view class="text-size-3 color-gray">
-              {{ languageStore.t(item.title) }}
-            </view>
-          </view>
-        </view>
-      </view>
-    </view>
-  </view>
-</template>
-
-<style scoped>
-
-</style>
+<script lang="ts" setup>
+import { computed, defineOptions } from 'vue'
+import { RainbowColorGenerator } from '../../../utils'
+import { useSectionMenus } from '../../../composables/useSectionMenus'
+import { useLanguageStore } from '../../../store/language'
+
+defineOptions({
+  name: 'QuickPanel',
+})
+const { quickPanel } = useSectionMenus(true)
+const languageStore = useLanguageStore()
+const colorGenerator = new RainbowColorGenerator()
+const cstatistics = computed(() => {
+  return quickPanel.value.map((item) => {
+    const color = colorGenerator.getNextColor()
+    return {
+      ...item,
+      color,
+    }
+  })
+})
+</script>
+
+<template>
+  <view v-if="cstatistics.length > 0" class="pb-2">
+    <view>
+      <view class="mb-2 flex items-center gap-2 font-semibold dark:text-white text-gray-800">
+        {{ languageStore.t('数据统计') }}
+      </view>
+      <view class="grid grid-cols-2 gap-3">
+        <view v-for="(item) in cstatistics" :key="item.id" :style="{ '--wbg-color': item.color }" class="relative relative overflow-hidden rounded-2xl bg-white p-5 shadow-[0_4px_16px_rgba(99,102,241,0.1)] transition-250 before:absolute before:right-0 before:top-0 before:h-20 before:w-20 before:translate-x-30% before:rounded-full before:bg-[var(--wbg-color)] dark:bg-black before:opacity-10 before:content-[''] before:-translate-y-30%">
+          <view class="mb-3 flex items-center justify-between">
+            <view class="h-8 w-8 flex items-center justify-center rounded-2" :style="{ background: item.color }">
+              <svg class="h-4 w-4 text-white dark:text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 7h8m0 0v8m0-8l-8 8-4-4-6 6" />
+              </svg>
+            </view>
+          </view>
+          <view class="flex flex-col items-center justify-center">
+            <view class="text-size-2xl fw-800 dark:text-white text-gray-900">
+              {{ item.count }}
+            </view>
+            <view class="text-size-3 color-gray">
+              {{ languageStore.t(item.title) }}
+            </view>
+          </view>
+        </view>
+      </view>
+    </view>
+  </view>
+</template>
+
+<style scoped>
+
+</style>

package/components/wui-menus1/components/search-bar.vue

@@ -1,49 +1,49 @@
-<script setup lang="ts">
-import { ref } from 'vue'
-import { useRouter } from 'uni-mini-router'
-
-const router = useRouter()
-const searchQuery = ref('')
-const isFocused = ref(false)
-
-function handleFocus() {
-  isFocused.value = true
-}
-
-function handleBlur() {
-  isFocused.value = false
-}
-
-// const handleSearch = () => {
-//   if (searchQuery.value.trim()) {
-//     console.log('Searching:', searchQuery.value)
-//   }
-// }
-
-function goToSearch() {
-  router.push('/pages/search-tabbar/index')
-}
-</script>
-
-<template>
-  <div
-    class="relative mt-4"
-  >
-    <div
-      class="h-12 flex items-center rounded-xl bg-white px-4 transition-all duration-200"
-      :class="isFocused ? 'ring-2 ring-indigo-500 shadow-lg' : 'shadow-md'"
-    >
-      <wd-icon name="search" class="h-5 w-5 flex-shrink-0 text-slate-400" size="22px" />
-      <input
-        v-model="searchQuery"
-        type="text"
-        placeholder="搜索菜单、功能..."
-        class="ml-3 flex-1 cursor-pointer bg-transparent text-base text-slate-800 outline-none placeholder:text-slate-400"
-        readonly
-        @click="goToSearch"
-        @focus="handleFocus"
-        @blur="handleBlur"
-      >
-    </div>
-  </div>
-</template>
+<script setup lang="ts">
+import { ref } from 'vue'
+import { useRouter } from 'uni-mini-router'
+
+const router = useRouter()
+const searchQuery = ref('')
+const isFocused = ref(false)
+
+function handleFocus() {
+  isFocused.value = true
+}
+
+function handleBlur() {
+  isFocused.value = false
+}
+
+// const handleSearch = () => {
+//   if (searchQuery.value.trim()) {
+//     console.log('Searching:', searchQuery.value)
+//   }
+// }
+
+function goToSearch() {
+  router.push('/pages/search-tabbar/index')
+}
+</script>
+
+<template>
+  <div
+    class="relative mt-4"
+  >
+    <div
+      class="h-12 flex items-center rounded-xl bg-white px-4 transition-all duration-200"
+      :class="isFocused ? 'ring-2 ring-indigo-500 shadow-lg' : 'shadow-md'"
+    >
+      <wd-icon name="search" class="h-5 w-5 flex-shrink-0 text-slate-400" size="22px" />
+      <input
+        v-model="searchQuery"
+        type="text"
+        placeholder="搜索菜单、功能..."
+        class="ml-3 flex-1 cursor-pointer bg-transparent text-base text-slate-800 outline-none placeholder:text-slate-400"
+        readonly
+        @click="goToSearch"
+        @focus="handleFocus"
+        @blur="handleBlur"
+      >
+    </div>
+  </div>
+</template>