add SearchButton ToStudio

dashboard/src/pages/library/article/show.tsx

@@ -46,6 +46,8 @@ import {
 import { openPanel } from "../../../reducers/right-panel";
 import { TResType } from "../../../components/discussion/DiscussionListCard";
 import { modeChange } from "../../../reducers/article-mode";
+import SearchButton from "../../../components/general/SearchButton";
+import ToStudio from "../../../components/auth/ToStudio";
 
 /**
  * type:
@@ -135,95 +137,99 @@ const Widget = () => {
   };
   return (
     <div id="article-root">
-      <Affix offsetTop={0}>
-        <Header
-          style={{
-            height: 44,
-            lineHeight: 44,
-            display: "flex",
-            justifyContent: "space-between",
-            padding: "5px",
-          }}
-        >
-          <div style={{ display: "flex" }}>
-            <MainMenu />
-            <NetStatus style={{ color: "white" }} />
-          </div>
-          <div></div>
-          <div style={{ display: "flex" }} key="right">
-            {type === "article" && loadedArticleData ? (
-              <Button
-                ghost
-                onClick={(event) => {
-                  const url = `/studio/${loadedArticleData.studio?.realName}/article/${loadedArticleData.uid}/edit`;
-                  if (event.ctrlKey || event.metaKey) {
-                    window.open(fullUrl(url), "_blank");
-                  } else {
-                    navigate(url);
-                  }
-                }}
-              >
-                Edit
-              </Button>
-            ) : undefined}
-            <Avatar placement="bottom" />
-            <ThemeSelect />
-            <Divider type="vertical" />
-            <ModeSwitch
-              channel={searchParams.get("channel")}
-              currMode={currMode}
-              onModeChange={(e: ArticleMode) => {
-                let output: any = { mode: e };
-                searchParams.forEach((value, key) => {
-                  console.log(value, key);
-                  if (key !== "mode") {
-                    output[key] = value;
-                  }
-                });
-                setSearchParams(output);
+      <Header
+        style={{
+          height: 44,
+          lineHeight: 44,
+          display: "flex",
+          justifyContent: "space-between",
+          padding: "5px",
+        }}
+      >
+        <div style={{ display: "flex" }} key="left">
+          <MainMenu />
+          <NetStatus style={{ color: "white" }} />
+        </div>
+        <div style={{ display: "flex" }} key="middle"></div>
+        <div style={{ display: "flex" }} key="right">
+          {type === "article" && loadedArticleData ? (
+            <Button
+              ghost
+              onClick={(event) => {
+                const url = `/studio/${loadedArticleData.studio?.realName}/article/${loadedArticleData.uid}/edit`;
+                if (event.ctrlKey || event.metaKey) {
+                  window.open(fullUrl(url), "_blank");
+                } else {
+                  navigate(url);
+                }
               }}
-              onChannelChange={(channels: IChannel[], mode: ArticleMode) => {
-                let output: any = {
-                  mode: mode,
-                  channel: channels.map((item) => item.id).join("_"),
-                };
-                searchParams.forEach((value, key) => {
-                  console.log(value, key);
-                  if (key !== "mode" && key !== "channel") {
-                    output[key] = value;
+            >
+              Edit
+            </Button>
+          ) : undefined}
+          <SearchButton />
+          <Divider type="vertical" />
+          <ToStudio />
+          <Divider type="vertical" />
+          <Avatar placement="bottom" />
+          <Divider type="vertical" />
+          <ThemeSelect />
+          <Divider type="vertical" />
+          <ModeSwitch
+            channel={searchParams.get("channel")}
+            currMode={currMode}
+            onModeChange={(e: ArticleMode) => {
+              let output: any = { mode: e };
+              searchParams.forEach((value, key) => {
+                console.log(value, key);
+                if (key !== "mode") {
+                  output[key] = value;
+                }
+              });
+              setSearchParams(output);
+            }}
+            onChannelChange={(channels: IChannel[], mode: ArticleMode) => {
+              let output: any = {
+                mode: mode,
+                channel: channels.map((item) => item.id).join("_"),
+              };
+              searchParams.forEach((value, key) => {
+                console.log(value, key);
+                if (key !== "mode" && key !== "channel") {
+                  output[key] = value;
+                }
+              });
+              setSearchParams(output);
+            }}
+          />
+          <Tooltip title="文章目录" placement="bottomLeft">
+            <Button
+              style={{ display: "block", color: "white" }}
+              icon={<UnorderedListOutlined />}
+              type="text"
+              onClick={() => setAnchorNavOpen((value) => !value)}
+            />
+          </Tooltip>
+          <Tooltip title="侧边栏" placement="bottomLeft">
+            <Button
+              style={{ display: "block", color: "white" }}
+              icon={<ColumnOutlinedIcon />}
+              type="text"
+              onClick={() =>
+                setRightPanel((value) => {
+                  if (value === "close") {
+                    setAnchorNavShow(false);
+                  } else {
+                    setAnchorNavShow(true);
                   }
-                });
-                setSearchParams(output);
-              }}
+                  return value === "close" ? "open" : "close";
+                })
+              }
             />
-            <Tooltip title="文章目录" placement="bottomLeft">
-              <Button
-                style={{ display: "block", color: "white" }}
-                icon={<UnorderedListOutlined />}
-                type="text"
-                onClick={() => setAnchorNavOpen((value) => !value)}
-              />
-            </Tooltip>
-            <Tooltip title="侧边栏" placement="bottomLeft">
-              <Button
-                style={{ display: "block", color: "white" }}
-                icon={<ColumnOutlinedIcon />}
-                type="text"
-                onClick={() =>
-                  setRightPanel((value) => {
-                    if (value === "close") {
-                      setAnchorNavShow(false);
-                    } else {
-                      setAnchorNavShow(true);
-                    }
-                    return value === "close" ? "open" : "close";
-                  })
-                }
-              />
-            </Tooltip>
-          </div>
-        </Header>
-      </Affix>
+          </Tooltip>
+        </div>
+      </Header>
+
       <div style={{ width: "100%", display: "flex" }}>
         <Affix offsetTop={44}>
           <div