[feat] set video and template

src/components/cstb/VideoSetting.tsx

@@ -4,7 +4,7 @@ import { Card, CardBody, CardHeader, CardIcon, CardTool } from "../window/Card"
 import { ToolButton } from "../window/ToolButton"
 import { addToast, NumberInput, Tab, Tabs, Tooltip } from "@heroui/react"
 import { motion } from "framer-motion"
-import { useToolStore } from "@/store/tool"
+import { useToolStore, VideoSetting as VideoConfig, VideoSettingTemplate } from "@/store/tool"
 import { useSteamStore } from "@/store/steam"
 
 const VideoSetting = () => {
@@ -12,150 +12,101 @@ const VideoSetting = () => {
   const [edit, setEdit] = useState(false)
   const tool = useToolStore()
   const steam = useSteamStore()
-  // const [launchOpt, setLaunchOpt] = useState(tool.state.VideoSettings[tool.state.launchIndex] || "")
+  const videoSettings = (video: VideoConfig) => {
+    return [
+      {
+        type: "fullscreen",
+        title: "全屏",
+        value: video.fullscreen === "1" ? "全屏" : "窗口",
+        options: ["窗口", "全屏"],
+      },
+      {
+        type: "mat_vsync",
+        title: "垂直同步",
+        value: video.mat_vsync === "1" ? "开启" : "关闭",
+        options: ["关闭", "开启"],
+      },
+      {
+        type: "r_low_latency",
+        title: "低延迟模式",
+        value: video.r_low_latency === "1" ? "开启" : "关闭",
+        options: ["关闭", "开启"],
+      },
+      {
+        type: "r_csgo_cmaa_enable",
+        title: "增强角色对比度",
+        value: video.r_csgo_cmaa_enable === "1" ? "启用" : "禁用",
+        options: ["禁用", "启用"],
+      },
+      {
+        type: "msaa_samples",
+        title: "多重采样抗锯齿",
+        value:
+          {
+            0: "无",
+            2: "2X MSAA",
+            4: "4X MSAA",
+            8: "8X MSAA",
+          }[parseInt(video.msaa_samples)] || "无",
+        options: ["无", "2X MSAA", "4X MSAA", "8X MSAA"],
+      },
+      {
+        type: "videocfg_shadow_quality",
+        title: "全局阴影效果",
+        value: ["低", "中", "高", "非常高"][parseInt(video.videocfg_shadow_quality)] || "低",
+        options: ["低", "中", "高", "非常高"],
+      },
+      {
+        type: "videocfg_dynamic_shadows",
+        title: "动态阴影",
+        value: ["仅限日光", "全部"][parseInt(video.videocfg_dynamic_shadows)] || "仅限日光",
+        options: ["仅限日光", "全部"],
+      },
+      {
+        type: "videocfg_texture_detail",
+        title: "模型/贴图细节",
+        value: ["低", "中", "高"][parseInt(video.videocfg_texture_detail)] || "低",
+        options: ["低", "中", "高"],
+      },
+      {
+        type: "r_texturefilteringquality",
+        title: "贴图过滤模式",
+        value:
+          ["双线性", "三线性", "异向 2X", "异向 4X", "异向 8X", "异向 16X"][
+            parseInt(video.r_texturefilteringquality)
+          ] || "双线性",
+        options: ["双线性", "三线性", "异向 2X", "异向 4X", "异向 8X", "异向 16X"],
+      },
+      {
+        type: "videocfg_hdr_detail",
+        title: "光影细节",
+        value: ["低", "高"][parseInt(video.shaderquality)] || "低",
+        options: ["低", "高"],
+      },
+      {
+        type: "videocfg_particle_detail",
+        title: "粒子细节",
+        value: ["低", "中", "高", "非常高"][parseInt(video.videocfg_particle_detail)] || "低",
+        options: ["低", "中", "高", "非常高"],
+      },
+      {
+        type: "videocfg_ao_detail",
+        title: "环境光遮蔽",
+        value: ["已禁用", "中", "高"][parseInt(video.videocfg_ao_detail)] || "已禁用",
+        options: ["已禁用", "中", "高"],
+      },
+      {
+        type: "videocfg_fsr_detail",
+        title: "Fidelity FX 超级分辨率",
+        value:
+          ["已禁用", "超高品质", "品质", "均衡", "性能"][parseInt(video.videocfg_fsr_detail)] ||
+          "性能",
+        options: ["性能", "均衡", "品质", "超高品质", "已禁用"],
+      },
+    ]
+  }
 
-  // useEffect(() => {
-  //   setLaunchOpt(tool.state.VideoSettings[tool.state.launchIndex] || "")
-  // }, [tool.state.launchIndex, tool.state.VideoSettings])
-
-  // 设置对应关系
-  // TODO Value通过实际数值映射
-
-  const videoSettings = [
-    {
-      type: "fullscreen",
-      title: "全屏",
-      value: tool.state.videoSetting.fullscreen === "1" ? "全屏" : "窗口",
-      options: ["窗口", "全屏"],
-    },
-    {
-      type: "mat_vsync",
-      title: "垂直同步",
-      value: tool.state.videoSetting.mat_vsync === "1" ? "开启" : "关闭",
-      options: ["关闭", "开启"],
-    },
-    {
-      type: "r_low_latency",
-      title: "低延迟模式",
-      value: tool.state.videoSetting.r_low_latency === "1" ? "开启" : "关闭",
-      options: ["关闭", "开启"],
-    },
-    {
-      type: "r_csgo_cmaa_enable",
-      title: "增强角色对比度",
-      value: tool.state.videoSetting.r_csgo_cmaa_enable === "1" ? "启用" : "禁用",
-      options: ["禁用", "启用"],
-    },
-    {
-      type: "msaa_samples",
-      title: "多重采样抗锯齿",
-      value:
-        {
-          0: "无",
-          2: "2X MSAA",
-          4: "4X MSAA",
-          8: "8X MSAA",
-        }[parseInt(tool.state.videoSetting.msaa_samples)] || "无",
-      options: ["无", "2X MSAA", "4X MSAA", "8X MSAA"],
-    },
-    {
-      type: "videocfg_shadow_quality",
-      title: "全局阴影效果",
-      value:
-        ["低", "中", "高", "非常高"][parseInt(tool.state.videoSetting.videocfg_shadow_quality)] ||
-        "低",
-      options: ["低", "中", "高", "非常高"],
-    },
-    {
-      type: "videocfg_dynamic_shadows",
-      title: "动态阴影",
-      value:
-        ["仅限日光", "全部"][parseInt(tool.state.videoSetting.videocfg_dynamic_shadows)] ||
-        "仅限日光",
-      options: ["仅限日光", "全部"],
-    },
-    {
-      type: "videocfg_texture_detail",
-      title: "模型/贴图细节",
-      value: ["低", "中", "高"][parseInt(tool.state.videoSetting.videocfg_texture_detail)] || "低",
-      options: ["低", "中", "高"],
-    },
-    {
-      type: "r_texturefilteringquality",
-      title: "贴图过滤模式",
-      value:
-        ["双线性", "三线性", "异向 2X", "异向 4X", "异向 8X", "异向 16X"][
-          parseInt(tool.state.videoSetting.r_texturefilteringquality)
-        ] || "双线性",
-      options: ["双线性", "三线性", "异向 2X", "异向 4X", "异向 8X", "异向 16X"],
-    },
-    {
-      type: "videocfg_hdr_detail",
-      title: "光影细节",
-      value: ["低", "高"][parseInt(tool.state.videoSetting.shaderquality)] || "低",
-      options: ["低", "高"],
-    },
-    {
-      type: "videocfg_particle_detail",
-      title: "粒子细节",
-      value:
-        ["低", "中", "高", "非常高"][parseInt(tool.state.videoSetting.videocfg_particle_detail)] ||
-        "低",
-      options: ["低", "中", "高", "非常高"],
-    },
-    {
-      type: "videocfg_ao_detail",
-      title: "环境光遮蔽",
-      value:
-        ["已禁用", "中", "高"][parseInt(tool.state.videoSetting.videocfg_ao_detail)] || "已禁用",
-      options: ["已禁用", "中", "高"],
-    },
-    {
-      type: "videocfg_fsr_detail",
-      title: "Fidelity FX 超级分辨率",
-      value:
-        ["已禁用", "超高品质", "品质", "均衡", "性能"][
-          parseInt(tool.state.videoSetting.videocfg_fsr_detail)
-        ] || "性能",
-      options: ["性能", "均衡", "品质", "超高品质", "已禁用"],
-    },
-  ]
-  // const videoSettings = [
-  //   { type: "", title: "全屏", value: "全屏", options: ["窗口", "全屏"] },
-  //   { type: "", title: "垂直同步", value: "关闭", options: ["关闭", "开启"] },
-  //   { type: "", title: "低延迟模式", value: "关闭", options: ["关闭", "开启"] },
-  //   { type: "", title: "增强角色对比度", value: "禁用", options: ["禁用", "启用"] },
-  //   { type: "", title: "CMAA2抗锯齿", value: "关闭", options: ["关闭", "开启"] },
-  //   {
-  //     type: "",
-  //     title: "多重采样抗锯齿",
-  //     value: "2X MSAA",
-  //     options: ["无", "2X MSAA", "4X MSAA", "8X MSAA"],
-  //   },
-  //   { type: "", title: "全局阴影效果", value: "低", options: ["低", "中", "高", "非常高"] },
-  //   { type: "", title: "动态阴影", value: "全部", options: ["仅限日光", "全部"] },
-  //   { type: "", title: "模型/贴图细节", value: "中", options: ["低", "中", "高"] },
-  //   {
-  //     type: "",
-  //     title: "贴图过滤模式",
-  //     value: "异向 4X",
-  //     options: ["双线性", "三线性", "异向 2X", "异向 4X", "异向 8X", "异向 16X"],
-  //   },
-  //   { type: "", title: "光影细节", value: "低", options: ["低", "高"] },
-  //   { type: "", title: "粒子细节", value: "低", options: ["低", "中", "高", "非常高"] },
-  //   { type: "", title: "环境光遮蔽", value: "已禁用", options: ["已禁用", "中", "高"] },
-  //   { type: "", title: "高动态范围", value: "性能", options: ["性能", "品质"] },
-  //   {
-  //     type: "",
-  //     title: "Fidelity FX 超级分辨率",
-  //     value: "已禁用",
-  //     options: ["性能", "均衡", "品质", "超高品质", "已禁用"],
-  //   },
-  // ]
-
-  // useEffect(() => {
-  //   void tool.getVideoConfig()
-  // })
+  const [vconfig, setVconfig] = useState<VideoConfig>(tool.state.videoSetting)
 
   return (
     <Card>
@@ -171,13 +122,18 @@ const VideoSetting = () => {
           ))} */}
           {edit && (
             <>
-              <ToolButton>低</ToolButton>
-              <ToolButton>中</ToolButton>
-              <ToolButton>高</ToolButton>
-              <ToolButton>非常高</ToolButton>
-              <ToolButton>推荐</ToolButton>
+              <ToolButton onClick={() => setVconfig({ ...vconfig, ...VideoSettingTemplate.low })}>低</ToolButton>
+              <ToolButton onClick={() => setVconfig({ ...vconfig, ...VideoSettingTemplate.middle })}>中</ToolButton>
+              <ToolButton onClick={() => setVconfig({ ...vconfig, ...VideoSettingTemplate.high })}>高</ToolButton>
+              <ToolButton onClick={() => setVconfig({ ...vconfig, ...VideoSettingTemplate.veryhigh })}>非常高</ToolButton>
+              <ToolButton onClick={() => setVconfig({ ...vconfig, ...VideoSettingTemplate.recommend })}>推荐</ToolButton>
               <ToolButton
-                onClick={() => {
+                onClick={async () => {
+                  await tool.setVideoConfig(
+                    steam.state.steamDir,
+                    steam.currentUser()?.steam_id32 || 0,
+                    vconfig
+                  )
                   addToast({ title: "测试中 功能完成后可应用设置到游戏" })
                 }}
               >
@@ -187,7 +143,10 @@ const VideoSetting = () => {
             </>
           )}
           <Tooltip content="功能测试中，尚未实装" showArrow={true} delay={300}>
-            <ToolButton onClick={() => setEdit(!edit)}>
+            <ToolButton onClick={() => {
+              setVconfig(tool.state.videoSetting)
+              setEdit(!edit)
+            }}>
               {edit ? (
                 <>
                   <CloseSmall />
@@ -238,12 +197,20 @@ const VideoSetting = () => {
                 <span className="flex gap-3">
                   <NumberInput
                     aria-label="width"
-                    value={parseInt(tool.state.videoSetting.defaultres, 10)}
+                    value={parseInt(
+                      edit ? vconfig.defaultres : tool.state.videoSetting.defaultres,
+                      10
+                    )}
                     onValueChange={(value) => {
-                      tool.setVideoSetting({
-                        ...tool.state.videoSetting,
-                        defaultres: value.toString(),
-                      })
+                      edit
+                        ? setVconfig({
+                            ...vconfig,
+                            defaultres: value.toString(),
+                          })
+                        : tool.setVideoSetting({
+                            ...tool.state.videoSetting,
+                            defaultres: value.toString(),
+                          })
                     }}
                     radius="full"
                     step={10}
@@ -266,7 +233,7 @@ const VideoSetting = () => {
                   />
                 </span>
               </li>
-              {videoSettings.map((vid, index) => (
+              {videoSettings(edit ? vconfig : tool.state.videoSetting).map((vid, index) => (
                 <li className="flex flex-col gap-1.5" key={index}>
                   <span className="ml-2">{vid.title}</span>
                   <Tabs

src/store/tool.ts

@@ -3,7 +3,7 @@ import { useSnapshot } from "valtio"
 import { DEFAULT_STORE_CONFIG } from "./config"
 import { emit } from "@tauri-apps/api/event"
 import { invoke } from "@tauri-apps/api/core"
-import { steamStore, useSteamStore } from "./steam"
+import VideoSetting from "@/components/cstb/VideoSetting"
 
 interface LaunchOption {
   option: string
@@ -45,6 +45,87 @@ export interface VideoSetting {
   aspectratiomode: string; // 宽高比模式
 }
 
+// 视频设置预设模版
+// TODO: 校准
+export const VideoSettingTemplate = {
+  veryhigh: {
+    cpu_level: "3",
+    gpu_mem_level: "3",
+    gpu_level: "3",
+    shaderquality: "0",
+    r_texturefilteringquality: "3",
+    msaa_samples: "2",
+    r_csgo_cmaa_enable: "0",
+    videocfg_shadow_quality: "0",
+    videocfg_dynamic_shadows: "1",
+    videocfg_texture_detail: "1",
+    videocfg_particle_detail: "0",
+    videocfg_ao_detail: "0",
+    videocfg_hdr_detail: "3",
+  },
+  high: {
+    cpu_level: "3",
+    gpu_mem_level: "3",
+    gpu_level: "3",
+    shaderquality: "0",
+    r_texturefilteringquality: "3",
+    msaa_samples: "2",
+    r_csgo_cmaa_enable: "0",
+    videocfg_shadow_quality: "0",
+    videocfg_dynamic_shadows: "1",
+    videocfg_texture_detail: "1",
+    videocfg_particle_detail: "0",
+    videocfg_ao_detail: "0",
+    videocfg_hdr_detail: "3",
+  },
+  middle: {
+    cpu_level: "3",
+    gpu_mem_level: "3",
+    gpu_level: "3",
+    shaderquality: "0",
+    r_texturefilteringquality: "3",
+    msaa_samples: "2",
+    r_csgo_cmaa_enable: "0",
+    videocfg_shadow_quality: "0",
+    videocfg_dynamic_shadows: "1",
+    videocfg_texture_detail: "1",
+    videocfg_particle_detail: "0",
+    videocfg_ao_detail: "0",
+    videocfg_hdr_detail: "3",
+  },
+  low: {
+    cpu_level: "3",
+    gpu_mem_level: "3",
+    gpu_level: "3",
+    shaderquality: "0",
+    r_texturefilteringquality: "3",
+    msaa_samples: "2",
+    r_csgo_cmaa_enable: "0",
+    videocfg_shadow_quality: "0",
+    videocfg_dynamic_shadows: "1",
+    videocfg_texture_detail: "1",
+    videocfg_particle_detail: "0",
+    videocfg_ao_detail: "0",
+    videocfg_hdr_detail: "3",
+  },
+  recommend: {
+    cpu_level: "3",
+    gpu_mem_level: "3",
+    gpu_level: "3",
+    shaderquality: "0",
+    r_texturefilteringquality: "3",
+    msaa_samples: "2",
+    r_csgo_cmaa_enable: "0",
+    videocfg_shadow_quality: "0",
+    videocfg_dynamic_shadows: "1",
+    videocfg_texture_detail: "1",
+    videocfg_particle_detail: "0",
+    videocfg_ao_detail: "0",
+    videocfg_hdr_detail: "3",
+  },
+}
+
+
 const defaultValue = {
   launchOptions: [
     { option: "-novid -high -freq 144 -fullscreen", name: "" },
@@ -115,6 +196,7 @@ export const useToolStore = () => {
     setPowerPlan,
     setVideoSetting,
     getVideoConfig,
+    setVideoConfig,
     addLaunchOption,
     resetToolStore,
   }
@@ -158,6 +240,11 @@ const getVideoConfig = async (steam_dir: string, steam_id32: number) => {
   setVideoSetting(video)
 }
 
+const setVideoConfig = async (steam_dir: string, steam_id32: number, video_config: VideoSetting) => {
+  await invoke("set_cs2_video_config", { steamDir: steam_dir, steamId32: steam_id32, videoConfig: video_config })
+  // console.log(video)
+}
+
 const addLaunchOption = (option: LaunchOption) => {
   // 限制最高10个
   if (toolStore.state.launchOptions.length >= 10) {