labring · maslow · Jan 9, 2023 · Jan 9, 2023 · Jan 9, 2023
diff --git a/web/src/components/EditableTable/EditableTr/index.tsx b/web/src/components/EditableTable/EditableTr/index.tsx
@@ -7,6 +7,8 @@ import styles from "../index.module.scss";
 
 export type TConfiguration = {
   key: string;
+  tableHeight?: string;
+  hiddenEditButton?: boolean;
   addButtonText?: string;
   editButtonText?: string;
   deleteButtonText?: string;

diff --git a/web/src/components/EditableTable/NormalTr/index.tsx b/web/src/components/EditableTable/NormalTr/index.tsx
@@ -29,11 +29,13 @@ const NormalTr = function (props: {
           {configuration?.operationButtonsRender
             ? configuration.operationButtonsRender(data)
             : null}
-          <TextButton
-            className="ml-4"
-            text={configuration?.editButtonText ? configuration.editButtonText : "编辑"}
-            onClick={() => onEdit(data[configuration.key])}
-          />
+          {!configuration?.hiddenEditButton ? (
+            <TextButton
+              className="mr-4"
+              text={configuration?.editButtonText ? configuration.editButtonText : "编辑"}
+              onClick={() => onEdit(data[configuration.key])}
+            />
+          ) : null}
           <ConfirmButton
             onSuccessAction={() => onDelete(data[configuration.key])}
             headerText={
@@ -42,7 +44,6 @@ const NormalTr = function (props: {
             bodyText={`确定删除该行数据吗?`}
           >
             <TextButton
-              className="ml-4"
               text={
                 configuration?.deleteButtonText
                   ? configuration.deleteButtonText

diff --git a/web/src/components/EditableTable/index.tsx b/web/src/components/EditableTable/index.tsx
@@ -66,7 +66,7 @@ const EditableTable = function (props: {
   return (
     <>
       <div className="px-4 py-1 mb-2 rounded-md relative border">
-        <TableContainer h={"250px"} overflowY="auto" ref={tableRef}>
+        <TableContainer h={configuration?.tableHeight || "250px"} overflowY="auto" ref={tableRef}>
           <Table variant="simple">
             <Thead>
               <Tr>

diff --git a/web/src/layouts/Header/UserSetting/index.tsx b/web/src/layouts/Header/UserSetting/index.tsx
@@ -2,7 +2,6 @@ import { Menu, MenuButton, MenuItem, MenuList } from "@chakra-ui/react";
 
 import SettingModal from "@/pages/app/setting";
 import PATList from "@/pages/app/setting/PATList";
-
 export default function UserSetting(props: { avator: string; width: number }) {
   return (
     <Menu>
@@ -22,7 +21,15 @@ export default function UserSetting(props: { avator: string; width: number }) {
         >
           <MenuItem>用户设置</MenuItem>
         </SettingModal>
-        <MenuItem>Logout</MenuItem>
+        <MenuItem
+          onClick={() => {
+            localStorage.clear();
+            (window as any).location.href = (import.meta.env.VITE_SERVER_URL +
+              "/v1/login") as string;
+          }}
+        >
+          Logout
+        </MenuItem>
       </MenuList>
     </Menu>
   );

diff --git a/web/src/pages/app/setting/AppEnvList/index.tsx b/web/src/pages/app/setting/AppEnvList/index.tsx
@@ -1,3 +1,5 @@
+import { Button } from "@chakra-ui/react";
+
 import EditableTable from "@/components/EditableTable";
 import { isExitInList } from "@/utils/format";
 
@@ -8,7 +10,10 @@ import {
   useEnvironmentQuery,
 } from "./service";
 
-const AppEnvList = () => {
+import useGlobalStore from "@/pages/globalStore";
+
+const AppEnvList = (props: { onClose?: () => {} }) => {
+  const globalStore = useGlobalStore((state) => state);
   const environmentQuery = useEnvironmentQuery();
   const delEnvironmentMutation = useDelEnvironmentMutation();
   const addEnvironmentMutation = useAddEnvironmentMutation();
@@ -22,6 +27,7 @@ const AppEnvList = () => {
               key: "name",
               width: "200px",
               textWidth: "40",
+              editable: false,
               valiate: [
                 (data: any) => {
                   return {
@@ -59,6 +65,7 @@ const AppEnvList = () => {
             },
           ]}
           configuration={{
+            tableHeight: "200px",
             key: "name",
             addButtonText: "新增环境变量",
           }}
@@ -67,6 +74,17 @@ const AppEnvList = () => {
           onDelete={(data) => delEnvironmentMutation.mutateAsync({ name: data })}
           onCreate={(data) => addEnvironmentMutation.mutateAsync(data)}
         />
+        <Button
+          className="w-28 h-8 self-end mt-4"
+          colorScheme="blue"
+          type="submit"
+          onClick={() => {
+            globalStore.restartCurrentApp();
+            props.onClose && props.onClose();
+          }}
+        >
+          应用环境变量
+        </Button>
       </div>
     </>
   );

diff --git a/web/src/pages/app/setting/PATList/index.tsx b/web/src/pages/app/setting/PATList/index.tsx
@@ -10,7 +10,7 @@ import { TPAT, useAddPATMutation, useDelPATMutation, usePATQuery } from "./servi
 
 const PATList = () => {
   const [formatPATList, setFormatPATList] = useState<TPAT[]>();
-
+  const [tokenList, setTokenList] = useState<{ id: string; token: string }[]>([]);
   usePATQuery((data) => {
     const newPATList = (data || []).map((item: any) => {
       return {
@@ -21,8 +21,20 @@ const PATList = () => {
     setFormatPATList(newPATList);
   });
 
-  const delPATMutation = useDelPATMutation();
-  const addPATMutation = useAddPATMutation();
+  const delPATMutation = useDelPATMutation(() => {
+    // const newTokenList = newTokenList.map((token) => {
+    //   return token.id !==
+    // });
+    // setTokenList(newTokenList);
+  });
+  const addPATMutation = useAddPATMutation((data: any) => {
+    const newTokenList = [...tokenList];
+    newTokenList.push({
+      id: data.id,
+      token: data.token,
+    });
+    setTokenList(newTokenList);
+  });
 
   const now = new Date();
   const dateList = formatDateOption();
@@ -64,21 +76,29 @@ const PATList = () => {
           ]}
           configuration={{
             key: "id",
+            hiddenEditButton: true,
             addButtonText: "新增Token",
             saveButtonText: "生成Token",
             operationButtonsRender: (data: any) => {
-              return (
-                <CopyText text={data.name} tip="name复制成功">
+              const tokenItem = tokenList?.filter((item) => item.id === data.id);
+              return tokenItem?.length === 1 ? (
+                <CopyText className="mr-4" text={tokenItem[0].token} tip="token复制成功">
                   <Button variant={"link"} size="xs" colorScheme={"blue"}>
-                    复制name
+                    复制Token
                   </Button>
                 </CopyText>
-              );
+              ) : null;
             },
           }}
           tableData={formatPATList}
-          onEdit={(data) => addPATMutation.mutateAsync(data)}
-          onDelete={(data) => delPATMutation.mutateAsync({ id: data })}
+          onEdit={async () => {}}
+          onDelete={async (data) => {
+            await delPATMutation.mutateAsync({ id: data });
+            const newTokenList = tokenList.filter((token) => {
+              return token.id !== data;
+            });
+            setTokenList(newTokenList);
+          }}
           onCreate={(data) =>
             addPATMutation.mutateAsync({ ...data, expiresIn: Number(data.expiresIn) })
           }

diff --git a/web/src/pages/app/setting/PATList/service.ts b/web/src/pages/app/setting/PATList/service.ts
@@ -31,13 +31,13 @@ export const usePATQuery = (callback?: (data: any) => void) => {
   );
 };
 
-export const useAddPATMutation = (callback?: () => void) => {
+export const useAddPATMutation = (callback?: (data: any) => void) => {
   const queryClient = useQueryClient();
   return useMutation((params: TPAT) => AuthControllerPATsCreate(params), {
-    onSuccess: async () => {
+    onSuccess: async (data) => {
       useGlobalStore.getState().showSuccess("update PAT success");
       await queryClient.invalidateQueries(queryKeys.usePATQuery);
-      callback && callback();
+      callback && callback(data?.data);
     },
   });
 };

diff --git a/web/src/pages/app/setting/index.tsx b/web/src/pages/app/setting/index.tsx
@@ -61,7 +61,9 @@ const SettingModal = (props: {
                 <h3 className="ml-2 pb-2 mb-4 font-bold border-gray-200 border-b border-solid">
                   {item?.name}
                 </h3>
-                {item?.component}
+                {React.cloneElement(item?.component || <></>, {
+                  onClose,
+                })}
               </div>
             </div>
           </ModalBody>

diff --git a/web/src/pages/app/storages/mods/FileList/index.tsx b/web/src/pages/app/storages/mods/FileList/index.tsx
@@ -20,7 +20,7 @@ export default function FileList() {
   const { getList, getFileUrl, deleteFile } = useAwsS3();
   const { currentStorage, prefix, setPrefix } = useStorageStore();
   const bucketName = currentStorage?.metadata.name;
-  // const bucketType = currentStorage?.spec.policy;
+  const bucketType = currentStorage?.spec.policy;
 
   const query = useQuery(
     ["fileList", bucketName, prefix],
@@ -35,8 +35,11 @@ export default function FileList() {
       changeDirectory(file);
       return;
     }
-    // const fileUrl = bucketType === 'private' ? getFileUrl(bucketName!, file.Key) : `http://${bucketName}.oss.dev.laf.run/${file.Key}`;
-    const fileUrl = getFileUrl(bucketName!, file.Key);
+    const fileUrl =
+      bucketType === "private"
+        ? getFileUrl(bucketName!, file.Key)
+        : `http://${bucketName}.${(window as any).location.host.replace("www", "oss")}/${file.Key}`;
+
     window.open(fileUrl, "_blank");
   };
 
@@ -113,8 +116,11 @@ export default function FileList() {
                         <Td isNumeric className="flex justify-end">
                           <IconWrap
                             placement="left"
-                            // tooltip={bucketType === 'private' && file.Key ? '临时链接,有效期15分钟' : undefined}
-                            tooltip="临时链接,有效期15分钟"
+                            tooltip={
+                              bucketType === "private" && file.Key
+                                ? "临时链接,有效期15分钟"
+                                : undefined
+                            }
                             onClick={() => viewAppFile(file)}
                           >
                             <ViewIcon fontSize={12} />

diff --git a/web/src/pages/globalStore.ts b/web/src/pages/globalStore.ts
@@ -24,7 +24,6 @@ type State = {
   currentApp: TApplication | undefined;
   setCurrentApp(app: TApplication): void;
   init(appid?: string): void;
-
   restartCurrentApp(): void;
 
   currentPageId: string | undefined;