Skip to content

Commit

Permalink
Merge pull request #58 from nickcdon/dev/migrate-202209011655
Browse files Browse the repository at this point in the history 
分支项目列表展示优化
  • Loading branch information
@freyaLo
freyaLo committed Sep 1, 2022
2 parents b97c69b + c7e6aa8 commit 4ed74c8
Show file tree
Hide file tree
Showing 2 changed files with 235 additions and 226 deletions.
281 changes: 151 additions & 130 deletions web/packages/tca-analysis/src/modules/projects/project/project-list.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,20 +6,17 @@

/**
* description 分支项目列表
* author luochunlan@coding.net
* create at 2020-10-23
*/

import React, { useEffect, useState } from 'react';
import { Link, useHistory, useParams } from 'react-router-dom';
import { Table, Tooltip, Button, Input, Menu, Dropdown, message } from 'coding-oa-uikit';
import { Table, Button, Input, message } from 'coding-oa-uikit';
import { pickBy, isNumber, get, toNumber, find } from 'lodash';
import qs from 'qs';
import { useSelector } from 'react-redux';

import SelectDropdown from '../../../components/select-dropdown';
import QuestionCircle from 'coding-oa-uikit/lib/icon/QuestionCircle';

import Tips from '@src/components/tips';
import { useStateStore } from '@src/context/store';
import { DEFAULT_PAGER } from '@src/constant';
import { useQuery } from '@src/utils/hooks';
Expand Down Expand Up @@ -56,14 +53,15 @@ const ProjectList = (props: ProjectListProps) => {
const [createProjectVsb, setCreateProjectVsb] = useState(false);
const [curProjId, setCurProjId] = useState<number>(null);
const [reload, setReload] = useState<boolean>(false);
const [hoverRowId, setHoverRowId] = useState(undefined);

// 判断是否有权限删除分支项目
const APP = useSelector((state: any) => state.APP);
const isSuperuser = get(APP, 'user.is_superuser', false); // 当前用户是否是超级管理员
const userName = get(APP, 'user.username', null);
const [admins, setAdmins] = useState<any>([]);
const isAdmin = !!find(admins, { username: userName }); // 当前用户是否是代码库管理员
const deletable = isAdmin || isSuperuser; // 删除权限
const isAdmin = !!find(admins, { username: userName }); // 当前用户是否是代码库管理员
const deletable = isAdmin || isSuperuser; // 删除权限
const [deleteVisible, setDeleteVisible] = useState<boolean>(false);

const [searchParams, setSearchParams] = useState({
Expand Down Expand Up @@ -93,7 +91,10 @@ const ProjectList = (props: ProjectListProps) => {
}
}, [repoId]);

const getListData = (limit: number = pageSize, offset: number = pageStart) => {
const getListData = (
limit: number = pageSize,
offset: number = pageStart,
) => {
const params = {
limit,
offset,
Expand Down Expand Up @@ -134,10 +135,11 @@ const ProjectList = (props: ProjectListProps) => {
};

const handleDeleteProject = () => {
delProject(orgSid, teamName, repoId, curProjId).then(() => {
message.success('已删除分支项目');
setReload(!reload);
})
delProject(orgSid, teamName, repoId, curProjId)
.then(() => {
message.success('已删除分支项目');
setReload(!reload);
})
.finally(() => {
setDeleteVisible(false);
setCurProjId(null);
Expand All @@ -147,133 +149,152 @@ const ProjectList = (props: ProjectListProps) => {
return (
<div className={style.projectList}>
<div className={style.projectSearch}>
<h3 className={style.title}>
分支项目列表
<Tooltip title="分支项目 = 分支 + 分析方案">
<QuestionCircle className={style.icon} />
</Tooltip>
</h3>
<SelectDropdown
allowClear
label='分析方案'
dropdownStyle={{ marginRight: 10 }}
selectedKeys={searchParams.scan_scheme && searchParams.scan_scheme !== 'all' ? [searchParams.scan_scheme] : []}
onSelect={(e: any) => onChangeSearchParams('scan_scheme', toNumber(e.key))}
data={schemes.map((item: any) => ({ text: item.name, value: item.id }))}
onClear={() => onChangeSearchParams('scan_scheme', 'all')}
/>
<Input.Search
size='middle'
style={{ width: 200 }}
placeholder="分支/分析方案"
value={searchParams.branch_or_scheme}
onChange={(e: any) => {
onChangeSearchParams('branch_or_scheme', e.target.value);
}}
/>
<Button
style={{ float: 'right' }}
type="primary"
onClick={() => setCreateProjectVsb(true)}
>
<div>
<h4 className={style.title}>
分支项目列表
<Tips title="分支项目 = 分支 + 分析方案" />
</h4>
<SelectDropdown
allowClear
label="分析方案"
dropdownStyle={{ marginRight: 10 }}
selectedKeys={
searchParams.scan_scheme && searchParams.scan_scheme !== 'all'
? [searchParams.scan_scheme]
: []
}
onSelect={(e: any) => onChangeSearchParams('scan_scheme', toNumber(e.key))
}
data={schemes.map((item: any) => ({
text: item.name,
value: item.id,
}))}
onClear={() => onChangeSearchParams('scan_scheme', 'all')}
/>
<Input.Search
size="middle"
style={{ width: 200 }}
placeholder="分支/分析方案"
value={searchParams.branch_or_scheme}
onChange={(e: any) => {
onChangeSearchParams('branch_or_scheme', e.target.value);
}}
/>
</div>
<Button type="primary" onClick={() => setCreateProjectVsb(true)}>
添加分支项目
</Button>
</div>
<Table
size="small"
dataSource={list}
rowKey={(item: any) => item.id}
pagination={{
size: 'default',
current: Math.floor(pageStart / pageSize) + 1,
total: count,
pageSize,
showSizeChanger: false,
showTotal: (total, range) => `${range[0]} - ${range[1]} 条数据，共 ${total} 条`,
onChange: onChangePageSize,
}}
>
<Column
title="分支项目 ID"
dataIndex="id"
render={(id: number) => (
<Link
className={style.linkName}
to={`${getProjectRouter(orgSid, teamName, repoId, id)}/overview`}
>
{id}
</Link>
)}
/>
<Column title="分支名称" dataIndex="branch" />
<Column
title="分析方案"
dataIndex={['scan_scheme', 'name']}
render={(name, data: any) => (
<Link
className={style.linkName}
target="_blank"
to={`${getSchemeRouter(orgSid, teamName, repoId, get(data, 'scan_scheme.id'))}`}
>
{name}
</Link>
)}
/>
<div className={style.projectContent}>
<Table
dataSource={list}
rowKey={(item: any) => item.id}
onRow={record => ({
onMouseEnter: () => {
setHoverRowId(record.id);
}, // 鼠标移入行
onMouseLeave: () => {
setHoverRowId(undefined);
}, // 鼠标移出行
})}
pagination={{
size: 'default',
current: Math.floor(pageStart / pageSize) + 1,
total: count,
pageSize,
showSizeChanger: false,
showTotal: (total, range) => `${range[0]} - ${range[1]} 条数据，共 ${total} 条`,
onChange: onChangePageSize,
}}
>
<Column
title="【ID】分支名称"
dataIndex="id"
render={(id: number, data: any) => (
<Link
className={style.linkName}
to={`${getProjectRouter(
orgSid,
teamName,
repoId,
id,
)}/overview`}
>
【{id}】{data?.branch}
</Link>
)}
/>
{/* <Column title="分支名称" dataIndex="branch" /> */}
<Column
title="分析方案"
dataIndex={['scan_scheme', 'name']}
render={(name, data: any) => (
<Link
className={style.linkName}
target="_blank"
to={`${getSchemeRouter(
orgSid,
teamName,
repoId,
get(data, 'scan_scheme.id'),
)}`}
>
{name}
</Link>
)}
/>

<Column
title="操作"
dataIndex="id"
width={240}
render={ (id) => {
const menu = (
<Menu>
<Menu.Item>
<Link
to={`${getProjectRouter(orgSid, teamName, repoId, id)}/overview`}
>
分支概览
</Link>
</Menu.Item>
<Menu.Item>
<Link
to={`${getProjectRouter(orgSid, teamName, repoId, id)}/scan-history`}
>
分析历史
</Link>
</Menu.Item>
{deletable && <Menu.Item>
<Column
title="操作"
dataIndex="id"
width={300}
render={id => (
<>
<a
className={style.link}
style={{ marginRight: 16 }}
onClick={() => {
setProjectId(id);
setVisible(true);
}}
>
启动分析
</a>
<Link
style={{ marginRight: 16 }}
to={`${getProjectRouter(
orgSid,
teamName,
repoId,
id,
)}/overview`}
>
分支概览
</Link>
<Link
style={{ marginRight: 16 }}
to={`${getProjectRouter(
orgSid,
teamName,
repoId,
id,
)}/scan-history`}
>
分析历史
</Link>
{hoverRowId === id && deletable && (
<a
style={{ color: 'red' }}
onClick={() => onDeleteProject(id)}
>
删除项目
</a>
</Menu.Item>}
</Menu>
);
return (
<>
<a
className={style.link}
style={{ marginRight: 20 }}
onClick={() => {
setProjectId(id);
setVisible(true);
}}
>
启动分析
</a>
<Dropdown overlay={menu}>
<span className={style.link}>
更多操作
</span>
</Dropdown>
)}
</>
);
}
}
/>
</Table>
)}
/>
</Table>
</div>
<ScanModal
orgSid={orgSid}
teamName={teamName}
Expand All @@ -296,8 +317,8 @@ const ProjectList = (props: ProjectListProps) => {
}}
/>
<DeleteModal
actionType='删除'
objectType='分支项目'
actionType="删除"
objectType="分支项目"
confirmName={`${curProjId}`}
visible={deleteVisible}
onCancel={() => setDeleteVisible(false)}
Expand Down

0 comments on commit 4ed74c8

Please sign in to comment.