头部搜索对接开源软件列表

2025-03-20 20:51:16 +08:00
parent 2e46635146
commit 61b7acc34c
6 changed files with 188 additions and 51 deletions
--- a/src/views/Jyh/Search/Components/BatchVerify.vue
+++ b/src/views/Jyh/Search/Components/BatchVerify.vue
@@ -302,12 +302,12 @@ const gotoDetail = (row) => {
 };
 // 分页
 const changeIndex = () => {
-  getReleaseList();
+  // getReleaseList();
 };

 const changeSize = () => {
  pager.value.pageIndex = 1;
-  getReleaseList();
+  // getReleaseList();
 };

 const repoFun = (arr: any) => {
--- a/src/views/Jyh/Search/Components/OssQuery.vue
+++ b/src/views/Jyh/Search/Components/OssQuery.vue
@@ -1,9 +1,69 @@
 <template>
  <div class="secret-container">
    <div class="search-form">
-      <AdvanceSearch v-model="newFormData" class="px-20">
-        <template #operation><div></div></template>
-      </AdvanceSearch>
+      <d-form layout='horizontal' :label-align="'end'">
+        <d-row :gutter="16">
+          <d-col :span="8">
+            <d-form-item field="name" label="软件名称">
+              <d-input placeholder="请输入软件名称" v-model="newFormData.softwareName" />
+            </d-form-item>
+          </d-col>
+          <d-col :span="8">
+            <d-form-item field="version" label="软件版本">
+              <d-input placeholder="请输入软件版本" v-model="newFormData.softwareVersion" />
+            </d-form-item>
+          </d-col>
+          <d-col :span="8">
+            <d-form-item field="license" label="license">
+              <d-input placeholder="请输入license名称" v-model="newFormData.licenseName" />
+            </d-form-item>
+          </d-col>
+        </d-row>
+        <d-row :gutter="16">
+          <d-col :span="8">
+            <d-form-item field="dependency" label="依赖软件名称">
+              <d-input placeholder="请输入依赖软件名称" v-model="newFormData.dependentSoftware" />
+            </d-form-item>
+          </d-col>
+          <d-col :span="8">
+            <d-form-item field="language" label="编程语言">
+              <d-select
+                :options="languageList"
+                :allow-clear="true"
+                v-model="newFormData.programmingLanguage"
+                placeholder="请选择编程语言"
+              ></d-select>
+            </d-form-item>
+          </d-col>
+          <d-col :span="8">
+            <d-form-item field="date" label="版本发布日期">
+              <d-range-date-picker-pro
+                v-model="newFormData.dateRange"
+                style="width: 100%"
+                :placeholder="['开始日期', '结束日期']"
+              />
+            </d-form-item>
+          </d-col>
+        </d-row>
+        <d-row :gutter="16">
+          <d-col :span="8">
+            <d-form-item field="interestTag" label="兴趣标签">
+              <d-input placeholder="请输入兴趣标签" v-model="newFormData.interestTag" />
+            </d-form-item>
+          </d-col>
+          <d-col :span="8">
+            <d-form-item field="industry" label="行业">
+              <d-select
+                :key="newFormData.industry"
+                :options="industryList"
+                :allow-clear="true"
+                v-model="newFormData.industry"
+                placeholder="请选择行业"
+              ></d-select>
+            </d-form-item>
+          </d-col>
+        </d-row>
+      </d-form>
      <div class="jyh-form-operation">
        <d-button @click="getReleaseList" class="mr-2" variant="solid">搜索</d-button>
        <d-button variant="solid" color="secondary" @click="clear">清空</d-button>
@@ -11,7 +71,7 @@
      <div class="left-btn">
        <d-button v-if="isLogin" class="output-btn" icon="icon-share" variant="text">导出</d-button>
        <span v-if="isLogin" style="height: 14px" class="split"></span>
-        <TableSetting :columns="columns" :show-column-list="showColumnList" @update:show-column-list="updateShowColumnList"/>
+        <TableSetting :columns="columns" @setDefult="setDefult" :show-column-list="showColumnList" @update:show-column-list="updateShowColumnList"/>
      </div>
    </div>
    <div class="mt-3 px-20">
@@ -48,7 +108,7 @@
                <a>{{ scope.row.smStatus }}</a>
              </template>
              <template v-else-if="column.key === 'industryCategory'">
-                <d-tag type="success">{{ scope.row.industryCategory }}</d-tag>
+                <d-tag type="success">{{ getIndustryName(scope.row.industryCategory) }}</d-tag>
              </template>
              <template v-else-if="column.key === 'programmingLanguage'">
                <d-tag type="success">{{ scope.row.programmingLanguage }}</d-tag>
@@ -108,7 +168,7 @@
 import AdvanceSearch from '@/components/AdvanceSearch/index.vue'
 import SettingTitle from '@/components/Setting/SettingTitle/index.vue';
 import SettingText from '@/components/Setting/SettingText/index.vue';
-import { ref,reactive, onMounted,watch } from 'vue';
+import { ref, reactive, onMounted, watch, nextTick } from 'vue';
 import { getGroupClaList, setGroupClaStatus, deleteGroupCla } from '@/api/cla';
 import { useRouter, useRoute } from 'vue-router';
 import { GModal } from '@/components/Setting/index';
@@ -122,28 +182,29 @@ import OrgModal from './OrgModal.vue'
 import NoData from '@/components/NoData/NoData.vue';
 import { useAccountStore } from '@/stores/user';
 const { formatTime } = useTimeFormat();
-import { releasePage } from '@/api/jyh';
+import { releasePage, searchLanguageList } from '@/api/jyh';
 import { useTimeFormat } from '@/utils/hooks/useTimeFormat';
 import { useGlobalInfoStore } from '@/stores/Global';
+
+
+const router = useRouter();
+const route = useRoute();
+
 const { namespace } = getOrgInfo();
 const userInfo = useAccountStore();
 const { isLogin } = storeToRefs(userInfo);
-
 // 定义 tableKey，用于强制刷新表格
 const tableKey = ref(0);
 const countryVisible = ref(false);
 const orgVisible = ref(false);
 const tableData = ref([]);
-const formData = ref({ title: '',type: '', useType: '',formData:'',select: '',time1:null,name:'',versionCode:'',pulishTime:'' });
-const typeOptions = reactive(['主软件', '依赖软件']);
-const riskOptions = reactive(['低', '中', '高']);
-const useTypeOptions = reactive(['软件', '文档', '文档+软件']);
-const isUseOptions = reactive(['是', '否']);
+const languageList = ref([]);
 const globalInfo = useGlobalInfoStore();
 const headerSearch = ref(globalInfo.headerSearch)
+const industryList = ref(globalInfo.industryList);
 const newFormData = ref({
  licenseName: '',
-  searchType: headerSearch.value.searchType ? headerSearch.value.searchType : 'software',
+  searchType: 'software',
  softwareName: '',
  softwareVersion: '',
  dependentSoftware: '',
@@ -153,13 +214,13 @@ const newFormData = ref({
  dateRange: ['', '']
 })

-watch(() => globalInfo.headerSearch, (newVal: any) => {
-  headerSearch.value = newVal;
-  console.log(newVal)
-  newFormData.value.searchType = newVal.searchType;
-  newFormData.value.softwareName = newVal.softwareName;
-  getReleaseList();
-}, { deep: true })
+// watch(() => globalInfo.headerSearch, (newVal: any) => {
+//   headerSearch.value = newVal;
+//   console.log(newVal)
+//   newFormData.value.searchType = newVal.searchType;
+//   newFormData.value.softwareName = newVal.softwareName;
+//   getReleaseList();
+// }, { deep: true })

 const pager = ref({
  total: 10,
@@ -177,6 +238,29 @@ const openDelete = (row: any) => {
  deletevModels.value = true;
 };

+const defultColumns = ref([
+  { key: 'softwareName', label: '软件名称', visible: true, filterable: true, sortable: false },
+  { key: 'softwareVersion', label: '软件版本', visible: true, filterable: true, sortable: false },
+  { key: 'securityScore', label: '软件评分', visible: true, filterable: false, sortable: true },
+  { key: 'licenseCount', label: 'License数量', visible: true, filterable: false, sortable: false },
+  { key: 'industryCategory', label: '行业类型', visible: true, filterable: true, sortable: false },
+  { key: 'primaryLanguage', label: '编程语言', visible: true, filterable: true, sortable: false },
+  { key: 'codeLines', label: '代码量', visible: true, filterable: false, sortable: false },
+  { key: 'sourceDownloadUrl', label: '源码包下载地址', visible: true, filterable: false, sortable: false },
+  { key: 'releaseDate', label: '版本发布时间', visible: false, filterable: true, sortable: true },
+  { key: 'dependencyCount', label: '依赖软件数', visible: false, filterable: false, sortable: false },
+  { key: 'productComponentUsage', label: '产品成分使用量', visible: false, filterable: false, sortable: false },
+  { key: 'vulnerabilityCount', label: '漏洞数量', visible: false, filterable: false, sortable: false },
+  { key: 'communityName', label: '开发商', visible: false, filterable: true, sortable: false },
+  { key: 'contributorCountries', label: '贡献者国家/地区分布', visible: false, filterable: false, sortable: false },
+  { key: 'contributorOrganizations', label: '贡献者组织/公司分布', visible: false, filterable: false, sortable: false },
+  { key: 'communityHash', label: '社区hash值', visible: false, filterable: false, sortable: false },
+  { key: 'copyright', label: 'Copyright', visible: false, filterable: false, sortable: false },
+  { key: 'externalVulnerabilitySource', label: '外部漏洞源的软件名称', visible: false, filterable: true, sortable: false },
+  { key: 'versionDescription', label: '版本描述', visible: false, filterable: false, sortable: false },
+  { key: 'compatibilityRisk', label: '兼容性风险描述', visible: false, filterable: false, sortable: false },
+  { key: 'eolDate', label: '社区EOL时间', visible: false, filterable: true, sortable: true },
+]);
 // 定义 columns 数据
 const columns = ref([
  { key: 'softwareName', label: '软件名称', visible: true, filterable: true, sortable: false },
@@ -208,11 +292,16 @@ const showColumnList = ref(false);
 const countryModalRef = ref(null);
 const orgModalRef = ref(null);

+const getIndustryName = (value) => {
+  const industry = industryList.value.find(item => item.value === value);
+  return industry ? industry.name : '未知行业'; // 如果找不到，返回默认值
+};
+
 // 清空高级搜索
 const clear = () => {
  newFormData.value = {
    licenseName: '',
-    searchType: headerSearch.value.searchType ? headerSearch.value.searchType : 'software',
+    searchType: 'software',
    softwareName: '',
    softwareVersion: '',
    dependentSoftware: '',
@@ -224,6 +313,10 @@ const clear = () => {
  getReleaseList();
 }

+// 打开模态框的方法
+const setDefult = () => {
+  columns.value = defultColumns.value
+};
 // 打开模态框的方法
 const openCountryModal = () => {
  if (countryModalRef.value) {
@@ -252,8 +345,6 @@ const openOrgChart = (row) => {
  orgVisible.value = true;
 };

-const router = useRouter();
-const route = useRoute();
 // 跳转
 const gotoDetail = (row) => {
  // 后续请换成params，暂时params传参没传过去
@@ -324,7 +415,14 @@ const signCla = (row: any) => {

 const getReleaseList = async() => {
  const { data, error } = await releasePage({
-    ...newFormData.value,
+    softwareName: newFormData.value.softwareName || '',
+    searchType: newFormData.value.searchType || '',
+    softwareVersion: newFormData.value.softwareVersion || '',
+    programmingLanguage: newFormData.value.programmingLanguage || '',
+    interestTag: newFormData.value.interestTag || '',
+    industry: newFormData.value.industry || '',
+    licenseName: newFormData.value.licenseName || '',
+    dependentSoftware: newFormData.value.dependentSoftware || '',
    releaseDateStart: newFormData.value.dateRange&&newFormData.value.dateRange.length>0?newFormData.value.dateRange[0]:'',
    releaseDateEnd: newFormData.value.dateRange&&newFormData.value.dateRange.length>0?newFormData.value.dateRange[1]:'',
    current: pager.value.pageIndex,
@@ -338,16 +436,30 @@ const getReleaseList = async() => {
  }
 };

+
+const getLanguageList = async () => {
+  const res: any = await searchLanguageList();
+  if (!res.error) {
+    languageList.value = res.data.data;
+  }
+};
+
 onMounted(async() => {
+  newFormData.value.industry = route.query.searchType || '';
+  newFormData.value.softwareName = route.query.softwareName || '';
+  nextTick(() => {
+    getReleaseList();
+  })
  // getReleaseList();
+  getLanguageList();
 });

-onMounted(() => {
-  const query: any = route.query;
-  newFormData.value = {
-    ...query
-  };
-});
+// onMounted(() => {
+//   const query: any = route.query;
+//   newFormData.value = {
+//     ...query
+//   };
+// });
 </script>

 <style scoped lang="scss">