fix: fix some bugs

electron/main/services/wallpaper-window.ts

@@ -15,7 +15,7 @@ import { Subject } from 'rxjs';
 import { omit } from 'lodash';
 import { StaticWallpaperEventArg } from '../../../cross/interface';
 
-const DEBUG = !app.isPackaged && false;
+const DEBUG = !app.isPackaged && true;
 
 const windowsMap: Map<number, BrowserWindow> = new Map();
 

electron/main/services/wallpaper.ts

@@ -49,7 +49,16 @@ export async function setWallpaper(
         detachWallpaperWin();
       } else {
         const extList = typeExtMap.get(rule.wallpaperType) as string[];
-        let paths = readRuleFilePaths(rule, extList);
+        let paths: string[] = [];
+        switch (rule.type) {
+          case ChangeType.AutoChange:
+            paths = readRuleFilePaths(rule, extList);
+            break;
+          case ChangeType.Fixed:
+            paths = [filePath];
+            break;
+        }
+
         await setStaticWallpaper(
           {
             path: filePath,

package.json

@@ -1,6 +1,6 @@
 {
   "name": "workpaper",
-  "version": "0.1.0",
+  "version": "0.1.1",
   "description": "A wallpaper schedule",
   "author": {
     "name": "Jarvay",
@@ -36,15 +36,13 @@
     "@types/react-dom": "^18.2.7",
     "@vitejs/plugin-react": "^4.0.4",
     "ahooks": "^3.7.8",
-    "animate.css": "^4.1.1",
     "antd": "^5.10.2",
     "autoprefixer": "^10.4.16",
     "axios": "^1.6.8",
     "dayjs": "^1.11.10",
     "electron": "^30.0.0",
     "electron-builder": "^24.6.3",
     "electron-devtools-installer": "^3.2.0",
-    "i": "^0.3.7",
     "i18next": "^23.6.0",
     "less": "^4.2.0",
     "less-loader": "^11.1.3",
@@ -53,7 +51,6 @@
     "mime": "^4.0.1",
     "mitt": "^3.0.1",
     "node-schedule": "^2.1.1",
-    "npm": "^10.6.0",
     "postcss": "^8.4.31",
     "postcss-import": "^16.1.0",
     "prettier": "^3.0.3",

src/pages/rule/components/WallpaperRuleModal/index.tsx

@@ -31,7 +31,7 @@ import { MinusCircleOutlined, PlusOutlined } from '@ant-design/icons';
 const WallpaperRuleModal: React.FC<
   ModalFormProps<Rule> & { weekdayId?: string | number }
 > = (props) => {
-  const [form] = Form.useForm();
+  const [form] = Form.useForm<Rule & Record<string, any>>();
 
   const { t } = useTranslation();
 
@@ -81,14 +81,10 @@ const WallpaperRuleModal: React.FC<
         });
       }
     }
-  }, [props.open, props.values]);
+  }, [props.open]);
 
-  function renderPathItem(
-    paths: string[],
-    index: number,
-    wallpaperType: WallpaperType,
-  ) {
-    if (!paths?.[index]) return null;
+  function renderPathItem(path: string, wallpaperType: WallpaperType) {
+    if (!path) return null;
     const size = 72;
     let children = null;
     switch (wallpaperType) {
@@ -100,14 +96,14 @@ const WallpaperRuleModal: React.FC<
             }}
             width={size}
             height={size}
-            src={`file://${paths[index]}`}
+            src={`file://${path}`}
           />
         );
         break;
       case WallpaperType.Video:
         children = (
           <video
-            src={`file://${paths[index]}`}
+            src={`file://${path}`}
             style={{
               width: `${size}px`,
               maxHeight: `${size}px`,
@@ -135,9 +131,9 @@ const WallpaperRuleModal: React.FC<
     switch (type) {
       case ChangeType.Fixed:
         return (
-          <Form.Item noStyle dependencies={['paths']}>
-            {({ getFieldsValue }) => {
-              const { paths } = getFieldsValue() as Rule;
+          <Form.Item noStyle dependencies={['paths', 'type']}>
+            {({ getFieldValue }) => {
+              const paths = getFieldValue('paths');
               return (
                 <Form.List
                   name="paths"
@@ -167,7 +163,7 @@ const WallpaperRuleModal: React.FC<
                             noStyle
                           >
                             <Space>
-                              {renderPathItem(paths, index, wallpaperType)}
+                              {renderPathItem(paths?.[index], wallpaperType)}
 
                               <Button
                                 type="primary"
@@ -330,7 +326,7 @@ const WallpaperRuleModal: React.FC<
             onChange={(e) => {
               form.setFieldsValue({
                 path: undefined,
-                paths: [undefined],
+                paths: [''],
               });
             }}
             options={[
@@ -355,7 +351,10 @@ const WallpaperRuleModal: React.FC<
             onChange={(e) => {
               form.setFieldsValue({
                 path: undefined,
-                paths: [undefined],
+                paths: [''],
+                direction: WallpaperDirection.Horizontal,
+                isRandom: false,
+                screenRandom: false,
               });
             }}
             options={[
@@ -432,8 +431,8 @@ const WallpaperRuleModal: React.FC<
                             )}
 
                             <Form.Item noStyle dependencies={['isRandom']}>
-                              {({ getFieldsValue }) => {
-                                const { isRandom } = getFieldsValue() as Rule;
+                              {({ getFieldValue }) => {
+                                const isRandom = getFieldValue('isRandom');
                                 const isVertical =
                                   WallpaperDirection.Vertical === direction;
                                 return (

src/pages/rule/index.tsx

@@ -32,15 +32,18 @@ const RuleIndex: React.FC = () => {
   const [updateModalOpen, setUpdateModalOpen] = useState(false);
   const [currentRow, setCurrentRow] = useState<Rule>();
   const [weekday, setWeekday] = useState<Weekday>();
+  const [loading, setLoading] = useState(false);
 
   const navigate = useNavigate();
   const { id: weekdayId } = useParams();
 
   const { t } = useTranslation();
 
   async function refresh() {
+    setLoading(true);
     const rules = await ruleService.get();
     setDataSource(rules.filter((rule) => rule.weekdayId === weekdayId));
+    setLoading(false);
   }
 
   useMount(async () => {
@@ -172,7 +175,10 @@ const RuleIndex: React.FC = () => {
       dataIndex: 'interval',
       width: 120,
       render: (value, record) => {
-        if (record.wallpaperType === WallpaperType.Video) {
+        const hideInterval =
+          record.wallpaperType === WallpaperType.Video ||
+          record.type === ChangeType.Fixed;
+        if (hideInterval) {
           return '-';
         }
         return value || '-';
@@ -271,6 +277,7 @@ const RuleIndex: React.FC = () => {
           rowKey="id"
           columns={columns}
           dataSource={dataSource}
+          loading={loading}
         />
 
         <WallpaperRule
@@ -280,9 +287,9 @@ const RuleIndex: React.FC = () => {
           }}
           values={currentRow}
           mode={FormMode.Update}
-          onChange={() => {
+          onChange={async () => {
             setUpdateModalOpen(false);
-            refresh();
+            await refresh();
           }}
         />
       </Space>

src/pages/wallpaper/static/ImageCarousel/index.tsx → src/pages/wallpaper/static/components/HorizontalImageCarousel/index.tsx

@@ -1,7 +1,7 @@
 import React, { useRef, useState } from 'react';
 import styles from '@/pages/wallpaper/static/index.module.less';
 import { ipcRenderer } from 'electron';
-import { Events } from '../../../../../cross/enums';
+import { Events } from '../../../../../../cross/enums';
 import { Carousel, CarouselProps } from 'antd';
 import { CarouselRef } from 'antd/es/carousel';
 
@@ -18,7 +18,7 @@ export interface ImageCarouselProps {
 }
 
 const SPEED = 1500;
-const ImageCarousel: React.FC<ImageCarouselProps> = (props) => {
+const HorizontalImageCarousel: React.FC<ImageCarouselProps> = (props) => {
   const { carouselIndex } = props;
 
   const carouselRef = useRef<CarouselRef>();
@@ -59,4 +59,4 @@ const ImageCarousel: React.FC<ImageCarouselProps> = (props) => {
   );
 };
 
-export default ImageCarousel;
+export default HorizontalImageCarousel;

src/pages/wallpaper/static/index.tsx

@@ -9,9 +9,9 @@ import styles from './index.module.less';
 import { Carousel, Col, Row } from 'antd';
 import { cloneDeep, isEqual, omit, range, shuffle } from 'lodash';
 import { CarouselRef } from 'antd/es/carousel';
-import ImageCarousel from '@/pages/wallpaper/static/ImageCarousel';
+import HorizontalImageCarousel from '@/pages/wallpaper/static/components/HorizontalImageCarousel';
 
-const SPEED = 1500;
+const SPEED = 1200;
 
 interface HorizontalIndex {
   current: number;
@@ -48,6 +48,7 @@ const StaticWallpaper: React.FC = () => {
   ) => void = (_, arg: StaticWallpaperEventArg) => {
     const a = cloneDeep(omit(arg, 'path'));
     const b = cloneDeep(omit(staticWallpaperArg, 'path'));
+
     if (!isEqual(a, b)) {
       setStaticWallpaperArg(arg);
     }
@@ -91,7 +92,7 @@ const StaticWallpaper: React.FC = () => {
       setTimeout(() => {
         ipcRenderer.send(Events.StaticWallpaperLoaded, Number(displayId));
         setReadyToShow(true);
-      }, 500);
+      }, 200);
     }
   }, [loadedColumnIndexSet, staticWallpaperArg?.rule.column]);
 
@@ -103,7 +104,7 @@ const StaticWallpaper: React.FC = () => {
   switch (staticWallpaperArg?.rule.direction) {
     case WallpaperDirection.Horizontal:
       children = (
-        <ImageCarousel
+        <HorizontalImageCarousel
           paths={staticWallpaperArg?.paths}
           imgStyle={{
             objectFit: settings?.webScaleMode,
@@ -154,7 +155,7 @@ const StaticWallpaper: React.FC = () => {
                       } catch (e) {
                         console.warn(e);
                       }
-                    }, 100);
+                    }, 150);
                   }}
                 >
                   {shuffledCarouselPaths[index].map((item, i) => {

src/services/base.ts

@@ -16,7 +16,12 @@ export abstract class BaseService<
     return (await this.getRows(this.getKeyInDB())) || [];
   }
 
+  async beforeCreate(item: T): Promise<T> {
+    return item;
+  }
+
   async create(item: T) {
+    item = await this.beforeCreate(item);
     const list = await this.get();
 
     const md5 = new Md5();
@@ -33,7 +38,13 @@ export abstract class BaseService<
     return this.save(list);
   }
 
+  async beforeUpdate(item: T): Promise<T> {
+    return item;
+  }
+
   async update(item: T) {
+    item = await this.beforeUpdate(item);
+
     const list = await this.get();
     list.forEach((i, index) => {
       if (i.id === item.id) {

src/services/rule.ts

@@ -2,7 +2,7 @@ import { timeToSeconds } from '../../cross/date';
 import { Rule } from '../../cross/interface';
 import { BaseService } from '@/services/base';
 import { ipcRenderer } from 'electron';
-import { Events } from '../../cross/enums';
+import { ChangeType, Events, WallpaperDirection } from '../../cross/enums';
 
 export class RuleService extends BaseService<'rules', Rule> {
   getKeyInDB(): 'rules' {
@@ -14,6 +14,25 @@ export class RuleService extends BaseService<'rules', Rule> {
     await ipcRenderer.invoke(Events.ResetSchedule);
   }
 
+  async beforeUpsert(item: Rule): Promise<Rule> {
+    if (item.type === ChangeType.Fixed) {
+      item.direction = WallpaperDirection.Horizontal;
+      item.isRandom = false;
+      item.screenRandom = false;
+      item.path = '';
+    }
+
+    return item;
+  }
+
+  async beforeCreate(item: Rule): Promise<Rule> {
+    return await this.beforeUpsert(item);
+  }
+
+  async beforeUpdate(item: Rule): Promise<Rule> {
+    return await this.beforeUpsert(item);
+  }
+
   async isConflicts(
     start: string,
     end: string,