sonar优化、bug修复

2024-06-20 09:04:52 +08:00 · 2024-06-20 09:04:52 +08:00 · a12939e9d9
parent bf61dd37e7
commit a12939e9d9
6 changed files with 68 additions and 27 deletions
--- a/src/common/util/ShareUtil.js
+++ b/src/common/util/ShareUtil.js
@ -3,7 +3,7 @@ const host = window.location.protocol + '//' + window.location.host
 const wx = window.wx
 const appId = 'wxf8debe756b4a0309'

-let settings = localStorage.chromesetting&&JSON.parse(localStorage.chromesetting);
+let settings = localStorage.chromesetting && localStorage.chromesetting !== 'undefined' && JSON.parse(localStorage.chromesetting);
 let actionUrl = settings && settings.common.zone +'/api';

 const service = axios.create({
--- a/src/forge/Server/Index.jsx
+++ b/src/forge/Server/Index.jsx
@ -40,9 +40,9 @@ function ServerIndex(props){

  useEffect(()=>{
    // 非项目协作者不可进入服务tab （3397）
-    // if(projectDetail && projectDetail.permission === ""){
-    //   props.history.push(`/${owner}/${projectsId}`);
-    // }
+    if(projectDetail && projectDetail.permission === ""){
+      props.history.push(`/${owner}/${projectsId}`);
+    }
  }, [projectDetail])

  return(
--- a/src/forge/Server/List.jsx
+++ b/src/forge/Server/List.jsx
@ -17,13 +17,13 @@ function Main(props){
    }
  }, [projectDetail])

-  // useEffect(()=>{
-  //   if(current_user && !current_user.login){
-  //     props.history.push(`/login?go_page=/${owner}/${projectsId}/service`);
-  //   }else{
-  //     setHas_trace_user(current_user.has_trace_user);
-  //   }
-  // },[current_user])
+  useEffect(()=>{
+    if(current_user && !current_user.login){
+      props.history.push(`/login?go_page=/${owner}/${projectsId}/service`);
+    }else{
+      setHas_trace_user(current_user.has_trace_user);
+    }
+  },[current_user])

  function onOk(){
    setVisible(false);
@ -66,7 +66,7 @@ function Main(props){
        </li>
        <li>
          <div className="servername" style={{marginBottom: '8px'}}>
-            <img src={require('./img/logo3.png')} alt="" style={{width: '24px'}}/>
+            <img src={require('./img/logo4.png')} alt="" style={{width: '24px'}}/>
            <Link to={`/${owner}/${projectsId}/service/quality`}>代码质量分析工具</Link>
          </div>
          <p className="task-hide-2 serverdesc">提供自动化的静态代码检查能力，能够识别代码中的缺陷、安全漏洞、代码异味，同时产出代码覆盖率和重复度的详细报告</p>
--- a/src/forge/Server/quality/component/ProblemDetail.jsx
+++ b/src/forge/Server/quality/component/ProblemDetail.jsx
@ -30,7 +30,7 @@ function ProblemDetail({visible, issue, issueDetail, onClose}){
          <span>{ issueDetail.type }</span>
          <span>{ issueDetail.severity }</span>
          <span>生效时间 { moment(issue.creationDate).format('YYYY年MM月DD日') }</span>
-          <span>{ issueDetail.lang }</span>
+          <span>{ issueDetail.langName }</span>
        </p>
        <Divider dashed />
        <div className="content-detail" dangerouslySetInnerHTML={{ __html: issueDetail.htmlDesc }}></div>
--- a/src/forge/Server/quality/detail.scss
+++ b/src/forge/Server/quality/detail.scss
@ -245,9 +245,17 @@
  }
  .issue-list {
    display: flex;
+    .show-more-list {
+      max-height: 2300px;
+    }
+    .show-less-list {
+      max-height: 1400px;
+    }
    .left-content {
      width: 218px;
      flex-shrink: 0;
+      transition: max-height 0.4s;
+      overflow: hidden;
      .clear-button {
        margin: 17px 0 0 19px;
        padding: 0 7px;
@ -300,6 +308,13 @@
          width: auto;
          min-width: unset;
        }
+        .show-more {
+          cursor: pointer;
+          font-size: 14px;
+          color: #5D6790;
+          margin-left: 20px;
+          margin-top: 4px;
+        }
      }
    }
    .right-content {
--- a/src/forge/Server/quality/index.jsx
+++ b/src/forge/Server/quality/index.jsx
@ -37,7 +37,9 @@ function IssueList(props) {
  const [pageSize, setPageSize] = useState(10);
  const [loading, setLoading] = useState(false);
  const [pageLoading, setPageLoading] = useState(true);
-  const [analysisStatus, setAnalysisStatus] = useState(status.none);
+  const [analysisStatus, setAnalysisStatus] = useState(null);
+  const [tagShowMore, setTagShowMore] = useState(false);
+  const [tagShowMoreDelay, setTagShowMoreDelay] = useState(false);
  const { projectDetail, history } = props;
  const metricKeys = 'lines,coverage,lines_to_cover,duplicated_lines_density,maintainability_issues,vulnerabilities,bugs,code_smells';
  const facets = 'impactSeverities,tags,types';
@ -130,6 +132,16 @@ function IssueList(props) {
    }
  }, [pageNum, pageSize]);

+  useEffect(() => {
+    if (!tagShowMore) {
+      setTimeout(() => {
+        setTagShowMoreDelay(tagShowMore)
+      }, 450);
+    } else {
+      setTagShowMoreDelay(tagShowMore)
+    }
+  }, [tagShowMore])
+
  const detail = (e) => {
    setSelectedIssue(e);
    getProblemDetail(e.rule, owner, projectsId).then(res => {
@ -139,6 +151,7 @@ function IssueList(props) {
  };

  const toggleSelection = (state, setter, value) => {
+    window.scrollTo(0,0);
    const index = state.indexOf(value);
    if (index > -1) {
      state.splice(index, 1);
@ -148,13 +161,22 @@ function IssueList(props) {
    }
  };

-  const renderFilterItems = (items, state, setter, label) => (
-    <div className="filters">
+  const clearAllSelection = () => {
+    setSelectedType([])
+    setSelectedSeverity([])
+    setSelectedTag([])
+  }
+
+  // 筛选列表
+  const renderFilterItems = (items, state, setter, label, showMoreButton = false) => {
+    const displayedItems = showMoreButton && items && !tagShowMoreDelay ? items.slice(0, 10) : items;
+
+    return (<div className={`filters`}>
      <div className="filter-title">
        <span>{label}</span>
        { state.length > 0 && <button className="clear-button" onClick={() => setter([])}>清空</button> }
      </div>
-      {items && items.map(e => (
+      {displayedItems && displayedItems.map(e => (
        <div
          className={`filter-item${state.includes(e.val) ? ' selected-item' : ''}`}
          key={e.val}
@ -164,10 +186,12 @@ function IssueList(props) {
          <span>{e.count}</span>
        </div>
      ))}
+      { showMoreButton && items.length > 10 && <span className="show-more" onClick={() => { setTagShowMore(!tagShowMore) }}> { tagShowMore ? '收起' : '显示更多'} </span> }
      <Divider dashed />
-    </div>
-  );
+    </div>)
+  };

+  // 总览项
  const renderTotalItem = (label, value, icon) => (
    <div className="total-item">
      <span className="icon-text"> <img src={ icon} alt="" /> {label}</span>
@ -175,6 +199,7 @@ function IssueList(props) {
    </div>
  );

+  // 总览项（带代码行数）
  const renderDetailedItem = (label, value, percent, moreValue, icon) => (
    <div className="total-item">
      <span className="icon-text"> <img src={ icon} alt="" /> {label}</span>
@ -212,6 +237,7 @@ function IssueList(props) {
    })
  }

+  // 开始按钮状态
  const getStatusButton = () => {
    switch (analysisStatus) {
      case actionStatus.none:
@ -221,11 +247,11 @@ function IssueList(props) {
        return <Button type="primary" style={{height: '36px'}} disabled>代码正在分析中，请稍候</Button>
      case actionStatus.failure:
        return <div>
-          <p>代码正在分析中，请重试</p>
+          <p>分析失败，请重试</p>
          <Button type="primary" style={{width: '112px', height: '36px'}} onClick={openAnalysis} loading={loading}>开始分析</Button>
        </div>
      default:
-        return <Button type="primary" style={{width: '112px', height: '36px'}} onClick={openAnalysis} loading={loading}>开始体验</Button>
+        return <></>
    }
  }

@ -260,18 +286,18 @@ function IssueList(props) {
                      {renderTotalItem("Bugs", baseData.bugs, issueTypeIcon.BUG)}
                      {renderTotalItem("漏洞", formatNumber(baseData.vulnerabilities), issueTypeIcon.VULNERABILITY)}
                      {renderTotalItem("异味", formatNumber(baseData.code_smells), issueTypeIcon.CODE_SMELL)}
-                      {renderDetailedItem("重复率", baseData.lines, baseData.duplicated_lines_density, "代码", repeat)}
-                      {renderDetailedItem("覆盖率", baseData.lines_to_cover, baseData.coverage, "代码", cover)}
-                      {renderTotalItem("代码行数", formatNumberWithCommas(baseData.lines), code_lines)}
+                      {renderDetailedItem("重复率", baseData.lines || '-', baseData.duplicated_lines_density || '-', "代码", repeat)}
+                      {renderDetailedItem("覆盖率", baseData.lines_to_cover || '-', baseData.coverage || '-', "代码", cover)}
+                      {renderTotalItem("代码行数", formatNumberWithCommas(baseData.lines || '-'), code_lines)}
                    </div>
                  </div>
                  {issues && <div className="count-title">发现{ baseData.maintainability_issues && JSON.parse(baseData.maintainability_issues).total }个问题</div>}
                  <div className="issue-list">
-                    <div className="container left-content">
-                      { (selectedType.length > 0 || selectedSeverity.length > 0 || selectedTag .length > 0) && <button className="clear-button" onClick={() => setter([])}>清空所有条件</button>}
+                    <div className={`container left-content  ${tagShowMore ? 'show-more-list' : 'show-less-list'}`}>
+                      { (selectedType.length > 0 || selectedSeverity.length > 0 || selectedTag .length > 0) && <button className="clear-button" onClick={clearAllSelection}>清空所有条件</button>}
                      {renderFilterItems(listFilter.types, selectedType, setSelectedType, "问题类型")}
                      {renderFilterItems(listFilter.impactSeverities, selectedSeverity, setSelectedSeverity, "严重程度")}
-                      {renderFilterItems(listFilter.tags, selectedTag, setSelectedTag, "标签")}
+                      {renderFilterItems(listFilter.tags, selectedTag, setSelectedTag, "标签", true)}
                    </div>
                    <div className="container right-content">
                      {issues && baseInfo.total > 0 && Object.entries(issues).map(([key, item]) => (