前端-抽象下载组件、插件查看界面支持插件下载 link #36

project-mirai · Nov 9, 2021 · e1c21d0 · e1c21d0
1 parent b14d271
commit e1c21d0
Show file tree

Hide file tree

Showing 8 changed files with 47 additions and 21 deletions.
diff --git a/frontend/src/components/Plugin/EditForm/PluginVersionControlForm.tsx b/frontend/src/components/Plugin/EditForm/PluginVersionControlForm.tsx
@@ -3,6 +3,7 @@ import React from "react";
 import {PluginInfoFormParams} from "../EditPluginForm";
 import VersionList from "./VersionControl/VersionList";
 import VersionCreate from "./VersionControl/VersionCreate";
+import {isAdminView} from "../../../models/View";
 
 export default function(props:PluginInfoFormParams) {
     const {refresh} = props
@@ -11,6 +12,6 @@ export default function(props:PluginInfoFormParams) {
     }
     return <ProCard style={{ marginTop: 8 }} loading={props.loading}>
         <VersionList refresh={doRefresh} {...props}/>
-        <VersionCreate refresh={doRefresh} {...props}/>
+        {isAdminView(props)&&<VersionCreate refresh={doRefresh} {...props}/>}
     </ProCard>
 }
diff --git a/frontend/src/components/Plugin/EditForm/VersionControl/FileList.tsx b/frontend/src/components/Plugin/EditForm/VersionControl/FileList.tsx
@@ -3,8 +3,9 @@ import axios from "axios";
 import {message, Space, Table} from "antd";
 import {ExclamationCircleOutlined} from "@ant-design/icons";
 import confirm from "antd/lib/modal/confirm";
+import {AdminView, isAdminView} from "../../../../models/View";
 
-export interface VersionFilesProps{
+export interface VersionFilesProps extends AdminView {
     id:string
     version:string
     refresh?:()=>void
@@ -64,8 +65,9 @@ export default function(props:VersionFilesProps){
             key: 'action',
             render: (text:any, record:any) => (
                 <Space size="middle">
-                    <a onClick={()=>downloadFile(record.filename)}>下载 {record.filename}</a>
-                    <a onClick={()=>showDeleteConfirm(record.filename)}>删除</a>
+                    <a onClick={()=>downloadFile(record.filename)}>下载</a>
+                    {props.adminView}
+                    {isAdminView(props)&&<a onClick={()=>showDeleteConfirm(record.filename)}>删除</a>}
                 </Space>
             ),
         },

diff --git a/frontend/src/components/Plugin/EditForm/VersionControl/VersionList.tsx b/frontend/src/components/Plugin/EditForm/VersionControl/VersionList.tsx
@@ -5,6 +5,7 @@ import {Collapse} from "antd";
 import CollapsePanel from "antd/es/collapse/CollapsePanel";
 import FileList from "./FileList";
 import VersionOperation from "./VersionOperation";
+import {isAdminView} from "../../../../models/View";
 
 export default function(props:PluginInfoFormParams){
     const [versionList,setVersionList] = useState(Array<string>())
@@ -17,14 +18,17 @@ export default function(props:PluginInfoFormParams){
     },[])
 
     return(
-        <Collapse defaultActiveKey={[]}>
-            {versionList.map((item,index)=>{
-                //TODO 完成后进行文件列表局部刷新，而不是整体刷新
-                return <CollapsePanel header={item} key={index}>
-                    <FileList refresh={doRefresh} id={props.info.id} version={item}/>
-                    <VersionOperation refresh={doRefresh} id={props.info.id} version={item}/>
-                </CollapsePanel>
-            })}
-        </Collapse>
+        <>
+            <p>共{versionList.length}个版本</p>
+            <Collapse defaultActiveKey={[]}>
+                {versionList.map((item,index)=>{
+                    //TODO 完成后进行文件列表局部刷新，而不是整体刷新
+                    return <CollapsePanel header={item} key={index}>
+                        <FileList refresh={doRefresh} id={props.info.id} version={item} {...props}/>
+                        {isAdminView(props)&&<VersionOperation refresh={doRefresh} id={props.info.id} version={item} {...props}/>}
+                    </CollapsePanel>
+                })}
+            </Collapse>
+        </>
     );
 }
diff --git a/frontend/src/components/Plugin/EditPluginForm.tsx b/frontend/src/components/Plugin/EditPluginForm.tsx
@@ -2,11 +2,12 @@ import React from "react";
 import {PluginInfo} from "../../models/Plugin";
 import EditPluginInfoForm from "./EditForm/EditPluginInfoForm";
 import PluginVersionControlForm from "./EditForm/PluginVersionControlForm";
+import {AdminView} from "../../models/View";
 
-export interface PluginInfoFormParams {
-    loading:boolean
-    info:PluginInfo
-    refresh ?: ()=>void
+export interface PluginInfoFormParams extends AdminView{
+    loading: boolean
+    info: PluginInfo
+    refresh?: ()=>void
 }
 
 export default function(props:PluginInfoFormParams) {

diff --git a/frontend/src/components/PluginList/PluginList.tsx b/frontend/src/components/PluginList/PluginList.tsx
@@ -5,7 +5,7 @@ import {PluginInfo} from "../../models/Plugin";
 import {Pagination, Tag} from "antd";
 import {useHistory} from "react-router";
 import Meta from "antd/es/card/Meta";
-import {DownloadOutlined, InfoOutlined} from "@ant-design/icons";
+import {InfoOutlined} from "@ant-design/icons";
 
 async function getPluginList(api:string,page:number) {
     const res = await axios.get(api,{
@@ -52,8 +52,7 @@ export default (props:PluginListInfo) => {
                 />
             }
             actions={[
-                <InfoOutlined key="info" onClick={()=>history.push('/app/info/'+pluginInfoItem.id)}/>,
-                <DownloadOutlined key="download" onClick={()=>history.push('/app/info/'+pluginInfoItem.id)}/>
+                <InfoOutlined key="info" onClick={()=>history.push('/app/info/'+pluginInfoItem.id)}/>
             ]}
             colSpan={12}
             bordered={true}

diff --git a/frontend/src/models/View.ts b/frontend/src/models/View.ts
@@ -0,0 +1,6 @@
+export interface AdminView{
+    adminView?: boolean
+}
+export function isAdminView(adminView:AdminView):boolean {
+    return (adminView.adminView !== undefined && adminView.adminView)
+}
diff --git a/frontend/src/scenes/app/pages/developer/EditPluginPage.tsx b/frontend/src/scenes/app/pages/developer/EditPluginPage.tsx
@@ -34,7 +34,7 @@ export default (props:any) => {
             waterMarkProps={{
                 content: '',
             }}>
-            {success?<EditPluginForm key={key} refresh={doRefresh} loading={loading} info={data}/>:<PluginNotFound/>}
+            {success?<EditPluginForm key={key} refresh={doRefresh} loading={loading} info={data} adminView={true}/>:<PluginNotFound/>}
         </PageContainer>
     );
 };
diff --git a/frontend/src/scenes/app/pages/developer/PluginInfoPage.tsx b/frontend/src/scenes/app/pages/developer/PluginInfoPage.tsx
@@ -6,6 +6,7 @@ import ProCard from "@ant-design/pro-card";
 import axios from "axios";
 import {useHistory} from "react-router";
 import {PluginInfo} from "../../../../models/Plugin";
+import PluginVersionControlForm from "../../../../components/Plugin/EditForm/PluginVersionControlForm";
 
 export default (props:any) => {
     const id = props.match.params.id
@@ -63,6 +64,18 @@ export default (props:any) => {
                 </Descriptions>
 
             </ProCard>
+
+            <ProCard
+                gutter={8}
+                colSpan={12}
+                style={{ marginTop: 8 }}
+                bordered={true}
+                layout="default"
+                direction="column"
+                title={"插件下载"}
+            >
+                <PluginVersionControlForm loading={loading} info={data}/>
+            </ProCard>
         </>
     );
     const result = (