From 37c391713fe2fd48a3f34f65f3cadb5734d74b8b Mon Sep 17 00:00:00 2001
From: expdsn <18111002318@163.com>
Date: Mon, 18 Nov 2024 15:15:18 +0800
Subject: [PATCH] fix

---
 src/layout/GlobalMenu.tsx          |  49 ++++++-----
 src/layout/grid/BlockWrapper.tsx   |   2 +-
 src/layout/grid/Feedback.tsx       |  34 ++++++--
 src/layout/grid/useSortable.ts     |   2 +-
 src/layout/header/GlobalTime.tsx   | 130 +++++++++++++++--------------
 src/layout/header/search/index.tsx |   6 +-
 src/layout/sider/index.tsx         |   3 +-
 7 files changed, 129 insertions(+), 97 deletions(-)

diff --git a/src/layout/GlobalMenu.tsx b/src/layout/GlobalMenu.tsx
index 63ad351..9dfa9de 100644
--- a/src/layout/GlobalMenu.tsx
+++ b/src/layout/GlobalMenu.tsx
@@ -75,10 +75,10 @@ const Item = defineComponent({
     return () => (
       <div
         class={clsx(
-          'px-4 py-2 text-sm tracking-widest w-full overflow-hidden text-ellipsis whitespace-nowrap break-all transition-all rounded-lg cursor-pointer mb-2',
+          ' py-1 text-sm tracking-widest w-full overflow-hidden flex justify-center text-ellipsis whitespace-nowrap break-all transition-all rounded cursor-pointer mb-1',
           {
-            'bg-red-500/80 hover:bg-red-500 text-white': props.alert,
-            'bg-white/80 hover:bg-white text-black/80': !props.alert && !props.noStyle,
+            '  hover:bg-black/20 text-black/80': props.alert,
+            ' hover:bg-black/20 text-black/80': !props.alert && !props.noStyle,
             'bg-transparent text-black/60 hover:text-black/80 hover:bg-white/20': props.noStyle
           }
         )}
@@ -114,7 +114,7 @@ export default defineComponent(() => {
         v-outside-click={() => {
           menu.dismiss()
         }}
-        class="fixed px-2 pt-4 pb-2 bg-white/60 backdrop-blur shadow-lg rounded-lg overflow-hidden"
+        class="fixed px-2 pt-2 pb-1 bg-white/60 backdrop-blur shadow-lg rounded-lg overflow-hidden"
         style={{
           zIndex: '999',
           left: menu.display.x + 'px',
@@ -223,26 +223,31 @@ export default defineComponent(() => {
                 >
                   编辑
                 </Item>
-                <Item
-                  alert
-                  onClick={() => {
-                    // 删除链接
-                    console.log(menu.selectPage)
+                {layout.state.content[layout.state.current].pages.length > 1 && (
+                  <Item
+                    alert
+                    onClick={() => {
+                      // 删除链接
 
-                    const idx = layout.state.content[layout.state.current].pages.findIndex(
-                      (el) => el.id === menu.selectPage?.id
-                    )
-                    menu.dismiss()
+                      const idx = layout.state.content[layout.state.current].pages.findIndex(
+                        (el) => el.id === menu.selectPage?.id
+                      )
+                      menu.dismiss()
 
-                    if (idx < 0) return
-                    if (idx === layout.state.currentPage) {
-                      return
-                    }
-                    layout.state.content[layout.state.current].pages.splice(idx, 1)
-                  }}
-                >
-                  删除
-                </Item>
+                      if (idx < 0) return
+                      layout.state.content[layout.state.current].pages.splice(idx, 1)
+                      if (
+                        layout.state.currentPage >=
+                        layout.state.content[layout.state.current].pages.length
+                      ) {
+                        layout.state.currentPage =
+                          layout.state.content[layout.state.current].pages.length - 1
+                      }
+                    }}
+                  >
+                    删除
+                  </Item>
+                )}
               </>
             )
           }
diff --git a/src/layout/grid/BlockWrapper.tsx b/src/layout/grid/BlockWrapper.tsx
index d0b9095..4ff1da3 100644
--- a/src/layout/grid/BlockWrapper.tsx
+++ b/src/layout/grid/BlockWrapper.tsx
@@ -40,7 +40,7 @@ export default defineComponent({
           gridColumn: `span ${props.block.w}`,
           gridRow: `span ${props.block.h}`,
           transition: 'border .3s, transform .2s',
-          border: hover.value ? '2px solid rgba(255,255,255,.5)' : '2px solid rgba(255,255,255,0)'
+          // border: hover.value ? '2px solid rgba(255,255,255,.5)' : '2px solid rgba(255,255,255,0)'
         }}
         data-transportable={props.block.link && !props.block.link.startsWith('id:') ? '1' : ''}
         onDragover={(e) => {
diff --git a/src/layout/grid/Feedback.tsx b/src/layout/grid/Feedback.tsx
index c219b2e..15b561f 100644
--- a/src/layout/grid/Feedback.tsx
+++ b/src/layout/grid/Feedback.tsx
@@ -40,22 +40,24 @@ export default defineComponent(() => {
     get: () => data.images[2],
     set: (val) => (data.images[2] = val)
   })
+  const list = [img1, img2, img3]
   return () => (
     <div class={'p-4 ' + (isGame.value ? 'text-white' : 'text-black/60')}>
       <div class="flex justify-between items-center">
         <div>
-          <span class="text-red-500">*</span>
+          <span class="text-red-500 ">*</span>
           问题描述
         </div>
         <div
-          class="cursor-pointer"
+          class="cursor-pointer text-[14px]"
           onClick={async () => {
             let his = await db.getItem<Feedback[]>('feedbacks')
             if (!his) his = []
-            const ins = Modal.info({
+            const ins = Modal.warn({
               title: '历史反馈',
               width: '1024px',
               maskClosable: true,
+              okText: '关闭',
               content: () => (
                 <Table
                   class="max-h-[50vh] overflow-y-auto"
@@ -111,19 +113,35 @@ export default defineComponent(() => {
           历史反馈
         </div>
       </div>
-      <div class={'mt-2 ' + (isGame.value ? 'bg-white/10 text-white' : 'bg-black/5 text-black/60')}>
+      <div
+        class={
+          'mt-2 relative appearance-none rounded-lg h-[124px] bg-white/10 ' + (isGame.value ? 'bg-white/10 text-white' : 'bg-black/5 text-black/60')
+        }
+      >
         <textarea
+          placeholder='在此输入您的问题，并可以添加图片，方便更清晰的描述问题，我们会尽快帮您解决，感谢您的反馈'
+          maxlength={80}
           v-model={data.description}
-          class="bg-transparent no-textarea w-full p-2"
+          class="bg-transparent no-textarea w-full p-2 appearance-none resize-none placeholder:text-[14px] "
           style={{
             color: isGame.value ? 'white' : 'black'
           }}
         />
         <div class="p-2 flex gap-2">
-          <ImageUploader width={42} v-model:value={img1.value} />
-          <ImageUploader width={42} v-model:value={img2.value} />
-          <ImageUploader width={42} v-model:value={img3.value} />
+          {list
+            .filter(
+              (_, idx) =>
+                idx <=
+                list.reduce((acc, cur) => {
+                  if (cur.value) acc++
+                  return acc
+                }, 0)
+            )
+            .map((item) => (
+              <ImageUploader width={38} v-model:value={item.value} />
+            ))}
         </div>
+        <span class={"absolute right-2 bottom-2"}>{data.description.length}/80</span>
       </div>
       <div class="mt-4">联系方式</div>
       <div class="text-sm">留下您的联系方式，以便必要时我们可以联系到您</div>
diff --git a/src/layout/grid/useSortable.ts b/src/layout/grid/useSortable.ts
index 24fddea..dac5542 100644
--- a/src/layout/grid/useSortable.ts
+++ b/src/layout/grid/useSortable.ts
@@ -32,7 +32,7 @@ export default function useSortable(list: Ref<any[]>, type: Ref<string>) {
               filter: '.operation-button'
             }
           : {}),
-        ghostClass: 'opacity-20',
+        ghostClass: 'opacity-0',
         onStart: (e: any) => {
           dragging.type = type.value
           dragging.id = e.item.id || ''
diff --git a/src/layout/header/GlobalTime.tsx b/src/layout/header/GlobalTime.tsx
index e50dfcd..4d0eb15 100644
--- a/src/layout/header/GlobalTime.tsx
+++ b/src/layout/header/GlobalTime.tsx
@@ -3,6 +3,7 @@ import useTimeStore from '@/utils/useTimeStore'
 import { Lunar } from 'lunar-typescript'
 import { computed, defineComponent, Transition } from 'vue'
 import useLayoutStore from '../useLayoutStore'
+import clsx from 'clsx'
 
 export default defineComponent({
   setup() {
@@ -39,7 +40,10 @@ export default defineComponent({
     const layout = useLayoutStore()
     return () => (
       <div
-        class="absolute z-20 shadow-text tracking-widest  font-normal h-[110px] transition-all "
+        class={clsx(
+          'absolute z-20 shadow-text tracking-widest    font-normal  transition-all ',
+          layout.isCompact ? 'text-[13px] flex  z-20 items-center pointer-events-none gap-x-2' : 'h-[110px]'
+        )}
         style={{
           color: 'white',
           transitionDuration: '.4s',
@@ -49,68 +53,72 @@ export default defineComponent({
         }}
       >
         <Transition>
-
-          {
-            layout.state.simple ?
-              settings.state.simpleModeShowString.includes('showTime') &&
-              <div
-                class={
-                  'transition-all ' +
-                  (layout.isCompact ? 'text-[1.4rem] leading-[1.4rem]' : 'text-[8vh] leading-[4rem]')
-                }
-              >
-                {text.value.timeStr}
-              </div>
-              :
-              settings.state!.showTime &&
-              <div
-                class={
-                  'transition-all ' +
-                  (layout.isCompact ? 'text-[1.4rem] leading-[1.4rem]' : 'text-[8vh] leading-[4rem]')
-                }
-              >
-                {text.value.timeStr}
-              </div>
-          }
+          {layout.state.simple
+            ? settings.state.simpleModeShowString.includes('showTime') && (
+                <div
+                  class={
+                    'transition-all ' +
+                    (layout.isCompact
+                      ? 'text-[1.2rem] leading-[1.4rem]'
+                      : 'text-[8vh] leading-[4rem]')
+                  }
+                >
+                  {text.value.timeStr}
+                </div>
+              )
+            : settings.state!.showTime && (
+                <div
+                  class={
+                    'transition-all ' +
+                    (layout.isCompact
+                      ? 'text-[1.2rem] leading-[1.4rem]'
+                      : 'text-[8vh] leading-[4rem]')
+                  }
+                >
+                  {text.value.timeStr}
+                </div>
+              )}
         </Transition>
         <Transition>
-          {
-            layout.state.simple ?
-              settings.state.simpleModeShowString.includes('showDate') &&
-              <div
-                class={'flex items-center gap-4 mt-4 ' + (layout.isCompact ? '' : 'justify-center')}
-              >
-                {settings.state.timeOptions.includes('date') && <div>{text.value.dateStr}</div>}
-                <Transition>
-                  {!layout.isCompact && settings.state.timeOptions.includes('week') && (
-                    <div>星期{info.value.dayWeek}</div>
-                  )}
-                </Transition>
-                <Transition>
-                  {!layout.isCompact && settings.state.timeOptions.includes('lunal') && (
-                    <div>{info.value.day}</div>
-                  )}
-                </Transition>
-              </div>
-              :
-              settings.state!.showTime &&
-              <div
-                class={'flex items-center gap-4 mt-4 ' + (layout.isCompact ? '' : 'justify-center')}
-              >
-                {settings.state.timeOptions.includes('date') && <div>{text.value.dateStr}</div>}
-                <Transition>
-                  {!layout.isCompact && settings.state.timeOptions.includes('week') && (
-                    <div>星期{info.value.dayWeek}</div>
-                  )}
-                </Transition>
-                <Transition>
-                  {!layout.isCompact && settings.state.timeOptions.includes('lunal') && (
-                    <div>{info.value.day}</div>
-                  )}
-                </Transition>
-              </div>
-          }
-
+          {layout.state.simple
+            ? settings.state.simpleModeShowString.includes('showDate') && (
+                <div
+                  class={
+                    'flex items-center gap-4  ' + (layout.isCompact ? 'text-[1.2rem]' : 'justify-center mt-4')
+                  }
+                >
+                  {settings.state.timeOptions.includes('date') && <div>{text.value.dateStr}</div>}
+                  <Transition>
+                    {!layout.isCompact && settings.state.timeOptions.includes('week') && (
+                      <div>星期{info.value.dayWeek}</div>
+                    )}
+                  </Transition>
+                  <Transition>
+                    {!layout.isCompact && settings.state.timeOptions.includes('lunal') && (
+                      <div>{info.value.day}</div>
+                    )}
+                  </Transition>
+                </div>
+              )
+            : settings.state!.showTime && (
+                <div
+                  class={
+                    'flex items-center gap-4 ' + (layout.isCompact ? ' text-[1.2rem]' : 'mt-4 justify-center')
+                  }
+                >
+                  {settings.state.timeOptions.includes('date') && <div>{text.value.dateStr}</div>}
+                  <Transition>
+                    {!layout.isCompact && settings.state.timeOptions.includes('week') && (
+                      <div>星期{info.value.dayWeek}</div>
+                    )}
+                  </Transition>
+                  <Transition>
+                    {!layout.isCompact && settings.state.timeOptions.includes('lunal') && (
+                      <div>{info.value.day}</div>
+                    )}
+                  </Transition>
+                </div>
+              )}
         </Transition>
       </div>
     )
diff --git a/src/layout/header/search/index.tsx b/src/layout/header/search/index.tsx
index 867c61c..3898100 100644
--- a/src/layout/header/search/index.tsx
+++ b/src/layout/header/search/index.tsx
@@ -17,20 +17,20 @@ export default defineComponent(
     return () => (
       <div
         class={clsx(
-          !props?.isMini ? 'absolute left-1/2 -translate-x-1/2 z-20 transition-all' : 'w-full'
+          !props?.isMini ? 'absolute left-1/2 -translate-x-1/2 z-20  duration-300 transition-all' : 'w-full'
         )}
         style={
           props.isMini
             ? {}
             : {
-              top: layout.isCompact ? '40px' : layout.state.simple ? '230px' : '172px',
+              top: layout.isCompact ? '50px' : layout.state.simple ? '230px' : '172px',
               width: settings.state.searchWidth + 'rem'
             }
         }
       >
         <div
           class={clsx(
-            'w-full h-11 shadow-content overflow-hidden  px-1 transition-all flex justify-between items-center gap-4 ',
+            'w-full h-11 shadow-content overflow-hidden   px-1 transition-all flex justify-between items-center gap-4 ',
             search.focus ? 'bg-white/60' : 'bg-white hover:bg-white',
             props.isMini ? '' : 'max-w-[90vw] w-full'
           )}
diff --git a/src/layout/sider/index.tsx b/src/layout/sider/index.tsx
index 49a2c91..78d6ec9 100644
--- a/src/layout/sider/index.tsx
+++ b/src/layout/sider/index.tsx
@@ -107,7 +107,7 @@ export default defineComponent(() => {
     <Transition>
       {layout.ready && (
         <div
-          onContextmenu={(e)=> {
+          onContextmenu={(e) => {
             e.stopPropagation()
             e.preventDefault()
           }}
@@ -174,6 +174,7 @@ export default defineComponent(() => {
                 label="添加"
                 onClick={() => {
                   menu.showEditPage = true
+                  menu.selectPage = undefined
                 }}
               />
               <Item