Merge remote-tracking branch 'origin/master'

src/assets/css/devui.scss

@@ -289,10 +289,10 @@ button.devui-button--solid--secondary {
   padding: 3px 0;
 }
 .devui-checkbox__label-text {
-  font-size: 16px;
+  font-size: 14px;
 }
 .devui-radio.devui-radio--md span .devui-radio__label {
-  font-size: 16px;
+  font-size: 14px;
 }
 .devui-radio-group div.devui-radio__wrapper {
   height: auto;

src/assets/css/main.scss

@@ -16,13 +16,15 @@ body,
   height: 100%;
   -webkit-font-smoothing: antialiased;
   // scorll 事件失效 overflow-y: overlay
+  // devUI 主题颜色重置
+  --devui-text: rgb(25, 25, 25);
 }
 html {
   overflow-y: scroll; // html本身没有滚动 为了防止自定义滚动条出现时界面抖动，需要预留轨道
 }
 html body {
   //background-color: $devui-global-bg;
-  background-color: #F6F6F8;
+  background-color: #f6f6f8;
 
   font-size: var(--text-sm);
   color: var(--color-font);
@@ -126,15 +128,17 @@ textarea::placeholder {
   }
 }
 /* 滚动条样式自定义 */
-body::-webkit-scrollbar, body>* ::-webkit-scrollbar {
+body::-webkit-scrollbar,
+body > * ::-webkit-scrollbar {
   width: 6px;
   height: 4px;
 }
-body::-webkit-scrollbar-thumb, body>* ::-webkit-scrollbar-thumb {
+body::-webkit-scrollbar-thumb,
+body > * ::-webkit-scrollbar-thumb {
   border-radius: 8px;
   background-color: var(--devui-disabled-text);
-  &:hover{
+  &:hover {
-    background-color: var(--devui-placeholder)
+    background-color: var(--devui-placeholder);
   }
 }
 body::-webkit-scrollbar-track {
@@ -188,12 +192,16 @@ body::-webkit-scrollbar-corner {
 }
 
 /* 自动补全输入框 去掉hover效果*/
-.devui-auto-complete-input__wrapper:not(.devui-auto-complete--disabled):not(.devui-auto-complete-input__wrapper--error):hover {
+.devui-auto-complete-input__wrapper:not(.devui-auto-complete--disabled):not(
+    .devui-auto-complete-input__wrapper--error
+  ):hover {
   border-color: var(--devui-line, #d7d8da);
 }
 
 /* 可输入下拉选择框 去掉hover效果*/
-.devui-editable-select-input__wrapper:not(.devui-editable-select-input__wrapper--disabled):not(.devui-editable-select-input__wrapper--focus):hover {
+.devui-editable-select-input__wrapper:not(.devui-editable-select-input__wrapper--disabled):not(
+    .devui-editable-select-input__wrapper--focus
+  ):hover {
   border-color: var(--devui-line, #d7d8da);
 }
 
@@ -216,7 +224,10 @@ body::-webkit-scrollbar-corner {
 }
 
 /* 时间范围选择 去掉hover效果 */
-.devui-range-date-picker-pro .devui-range-date-picker-pro__range-picker:not(.devui-range-date-picker-pro--error):not(.devui-range-date-picker-pro--disabled):hover {
+.devui-range-date-picker-pro
+  .devui-range-date-picker-pro__range-picker:not(.devui-range-date-picker-pro--error):not(
+    .devui-range-date-picker-pro--disabled
+  ):hover {
   border-color: var(--devui-line, #d7d8da);
 }
 
@@ -356,16 +367,20 @@ body::-webkit-scrollbar-corner {
 }
 
 input {
-  background-color:transparent !important;
+  background-color: transparent !important;
   // appearance: none;
 
-  &:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill {
+  &:-webkit-autofill,
+  textarea:-webkit-autofill,
+  select:-webkit-autofill {
     -webkit-text-fill-color: inherit !important;
     background-color: transparent !important;
     background-image: none;
     transition: background-color 36000s ease-in-out 0s; //背景色透明 生效时长 过渡效果 启用时延迟的时间
   }
-  &:-moz-autofill, textarea:-moz-autofill, select:-moz-autofill {
+  &:-moz-autofill,
+  textarea:-moz-autofill,
+  select:-moz-autofill {
     -webkit-text-fill-color: inherit !important;
     background-color: transparent !important;
     background-image: none;
@@ -385,8 +400,6 @@ input {
   }
 }
 
-
-
 .g-content-card-v2 {
   background-color: $devui-global-bg;
   border-radius: $devui-border-radius-card;
@@ -424,7 +437,7 @@ input {
   height: 1px;
   width: 100%;
   background: var(--devui-dividing-line);
-  margin: 32px 0
+  margin: 32px 0;
 }
 
 .g-tip-text {
@@ -434,7 +447,7 @@ input {
 }
 
 // 新版设计统一设置标题样式 大小颜色行高
-.unify-settingTitle-title{
+.unify-settingTitle-title {
   font-weight: 700;
   line-height: 34px;
   font-size: 24px;
@@ -447,14 +460,16 @@ input {
 }
 
 // 下拉框动效
-.arrow-down{
+.arrow-down {
-  transition: transform var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1));
+  transition: transform var(--devui-animation-duration-slow, 0.3s)
+    var(--devui-animation-ease-in-out-smooth, cubic-bezier(0.645, 0.045, 0.355, 1));
   transform-origin: center;
   transform: rotateZ(0deg) !important;
 }
 
-.arrow-up{
+.arrow-up {
-  transition: transform var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1));
+  transition: transform var(--devui-animation-duration-slow, 0.3s)
+    var(--devui-animation-ease-in-out-smooth, cubic-bezier(0.645, 0.045, 0.355, 1));
   transform-origin: center;
   transform: rotateZ(180deg) !important;
 }

src/components/AdvanceSearch/index.vue

@@ -1,70 +1,109 @@
 <template>
-  <div style="padding: 12PX;">
+  <div>
-    <span class="title">高级筛选</span>
+    <slot name="title"></slot>
-    <d-form style="margin-top: 20px" layout="vertical">
+    <d-form :layout="props.layout" :label-size="'lg'">
       <d-row :gutter="16">
         <d-col :span="8">
           <d-form-item field="license" label="license">
-            <d-input placeholder="请输入license" v-model="formData.license"/>
+            <d-input placeholder="请输入license名称" v-model="formData.licenseName"/>
           </d-form-item>
         </d-col>
         <d-col :span="8">
           <d-form-item field="name" label="软件/组件名称">
-            <d-input placeholder="请输入软件/组件名称" v-model="formData.name"/>
+            <d-input placeholder="请输入软件/组件名称" v-model="formData.searchWord"/>
           </d-form-item>
         </d-col>
         <d-col :span="8">
-          <d-form-item field="licenseStrength" label="license强弱" help-tips="license强弱说明">
+          <d-form-item field="licenseRisk" label="license集成风险" help-tips="license集成风险说明">
-            <d-input v-model="formData.licenseStrength"/>
+            <d-select :options="licenseRiskList" v-model="formData.licenseStrengths"></d-select>
           </d-form-item>
         </d-col>
       </d-row>
       <d-row :gutter="16">
         <d-col :span="8">
           <d-form-item field="version" label="软件版本">
-            <d-input v-model="formData.version"/>
+            <d-input v-model="formData.softwareVersion"/>
           </d-form-item>
         </d-col>
         <d-col :span="8">
           <d-form-item field="dependency" label="依赖软件">
-            <d-input v-model="formData.dependency"/>
+            <d-input v-model="formData.dependentSoftware"/>
           </d-form-item>
         </d-col>
         <d-col :span="8">
           <d-form-item field="language" label="编程语言">
-            <d-input v-model="formData.language"/>
+            <d-select :options="languageList" v-model="formData.programmingLanguage"></d-select>
           </d-form-item>
         </d-col>
       </d-row>
       <d-row :gutter="16">
         <d-col :span="8">
           <d-form-item field="date" label="版本发布日期">
-            <d-input v-model="formData.date"/>
+            <d-range-date-picker-pro v-model="formData.dateRange"  style="width: 100%;"/>
           </d-form-item>
         </d-col>
       </d-row>
-      <gc-form-operation style="display: flex; justify-content: center; gap: 8px;">
+
-        <d-button variant="solid" @click="submitForm">搜索</d-button>
+      <slot name="operation">
-        <d-button @click="cancel">取消</d-button>
+        <gc-form-operation style="display: flex; justify-content: center; gap: 8px;">
-      </gc-form-operation>
+          <d-button variant="solid" @click="submitForm">搜索</d-button>
+          <d-button @click="cancel">取消</d-button>
+        </gc-form-operation>
+      </slot>
     </d-form>
   </div>
 </template>
 
 <script setup lang="ts">
-import { ref, defineEmits } from 'vue';
+import { ref, defineEmits, defineProps, watch } from 'vue';
+const props = defineProps({
+  layout: {
+    type: String,
+    default: 'horizontal'
+  },
+  modelValue: {
+    type: Object,
+    default: () => ({
+      licenseName: '',
+      searchWord: '',
+      licenseStrengths: '',
+      softwareVersion: '',
+      dependentSoftware: '',
+      programmingLanguage: '',
+      dateRange: ['', '']
+    })
+  }
+})
+const emit = defineEmits(['submit', 'cancel', 'update:modelValue']);
+const languageList = ref([]);
+const licenseRiskList = ref([
+  {
+    name: '高',
+    value: 'high'
+  },
+  {
+    name: '中',
+    value: 'medium'
+  },
+  {
+    name: '低',
+    value: 'low'
+  }
+])
 
-const emit = defineEmits(['submit', 'cancel']);
+const formData = ref({...props.modelValue});
 
-const formData = ref({
+watch(() => props.modelValue, (newVal) => {
-  license: '',
+  if (JSON.stringify(newVal) !== JSON.stringify(formData.value)) {
-  name: '',
+    formData.value = {...newVal};
-  licenseStrength: '',
+  }
-  version: '',
+}, { deep: true });
-  dependency: '',
+
-  language: '',
+watch(formData, (newVal) => {
-  date: ''
+  if (JSON.stringify(newVal) !== JSON.stringify(props.modelValue)) {
-});
+    emit('update:modelValue', {...newVal});
+  }
+}, { deep: true });
 
 const submitForm = () => {
   emit('submit', formData.value);
@@ -72,21 +111,48 @@ const submitForm = () => {
 
 const cancel = () => {
   formData.value = {
-    license: '',
+    licenseName: '',
-    name: '',
+    searchWord: '',
-    licenseStrength: '',
+    licenseStrengths: '',
-    version: '',
+    softwareVersion: '',
-    dependency: '',
+    dependentSoftware: '',
-    language: '',
+    programmingLanguage: '',
-    date: ''
+    dateRange: ['', '']
   }
   emit('cancel');
+  emit('update:modelValue', formData.value);
 }
+
+const getLanguageList = () => {
+  const mockData = [
+      {
+          "key": "c++",
+          "name": "C++"
+      },
+      {
+          "key": "C",
+          "name": "C"
+      },
+      {
+          "key": "PYTHON",
+          "name": "PYTHON"
+      },
+      {
+          "key": "JAVA",
+          "name": "JAVA"
+      }
+  ]
+
+  languageList.value = mockData.map(item => {
+    return {
+      name: item.name,
+      value: item.key
+    }
+  })
+}
+getLanguageList();
 </script>
 
 <style scoped lang="scss">
-.title {
+
-  font-size: 16px;
-  font-weight: bold;
-}
 </style>

src/components/ChartLine/index.vue

@@ -0,0 +1,94 @@
+<template>
+  <d-row class="mt-3">
+    <d-col :span="12">
+      <d-chart :option="optionConChart" style="width: 100%; height: 400px"></d-chart>
+      <p class="text-center mt-translate-y">国家/地球分布</p>
+    </d-col>
+    <d-col :span="12">
+      <d-chart :option="optionOrgChart" style="width: 100%; height: 400px"></d-chart>
+      <p class="text-center mt-translate-y">组织/公司分布</p>
+    </d-col>
+  </d-row>
+</template>
+
+<script setup>
+import { ref, reactive } from 'vue';
+import { DChart } from 'vue-devui/echarts';
+const optionConChart = reactive({
+  tooltip: {
+    show: true,
+    trigger: 'item'
+  },
+  xAxis: {
+    type: 'category',
+    data: ['美国', '中国', '德国', '瑞士', '法国', '英国', '印度', '日本', '荷兰', '俄罗斯']
+  },
+  yAxis: {
+    // 给y轴添加单位后缀
+    axisLabel: {
+      formatter: '{value}%'
+    },
+    name: '单位',
+    type: 'value'
+  },
+  series: [
+    {
+      data: [12, 14.8, 23.6, 18.6, 17.3, 13.1, 16, 11.8, 13.9, 16.4],
+      type: 'bar',
+      barWidth: '40%',
+      // 给label添加单位后缀
+      label: {
+        show: true,
+        position: 'top',
+        formatter: '{c}%'
+      },
+      itemStyle: {
+        color: '#2070F3',
+        borderRadius: [5, 5, 0, 0]
+      }
+    }
+  ]
+});
+
+const optionOrgChart = reactive({
+  tooltip: {
+    show: true,
+    trigger: 'item'
+  },
+  xAxis: {
+    type: 'category',
+    data: ['公司1', '公司2', '公司3', '公司4', '公司5', '公司6', '公司7', '公司8', '公司9', '公司10']
+  },
+  yAxis: {
+    // 给y轴添加单位后缀
+    axisLabel: {
+      formatter: '{value}%'
+    },
+    name: '单位',
+    type: 'value'
+  },
+  series: [
+    {
+      data: [12, 14.8, 23.6, 18.6, 17.3, 13.1, 16, 11.8, 13.9, 16.4],
+      type: 'bar',
+      barWidth: '40%',
+      // 给label添加单位后缀
+      label: {
+        show: true,
+        position: 'top',
+        formatter: '{c}%'
+      },
+      itemStyle: {
+        color: '#2CB8C9',
+        borderRadius: [5, 5, 0, 0]
+      }
+    }
+  ]
+});
+</script>
+
+<style scoped lang="scss">
+.mt-translate-y {
+  transform: translateY(-30px);
+}
+</style>

src/components/NoData/NoData.vue

@@ -0,0 +1,32 @@
+<template>
+    <div class="bg-white w-full flex flex-col items-center py-[20px]">
+        <slot name="img">
+            <img
+                v-if="!hideImg"
+                class="block mb-[20px]"
+                width="300"
+                height="240"
+                src="/src/assets/imgs/jyh/nodata.png"
+                alt="NoData"
+            />
+        </slot>
+        <slot>
+            <div>没有查询到数据</div>
+        </slot>
+    </div>
+</template>
+
+<script setup lang="ts">
+
+const props = defineProps({
+    hideImg: {
+        type: Boolean,
+        default: false,
+    },
+});
+</script>
+<style scoped lang="scss">
+.bg-white {
+  background-color: #fff;
+}
+</style>

src/router/interceptor.ts

@@ -41,7 +41,7 @@ const isRepoVisited = (id: string): boolean => {
 // };
 const fromHomeWeb = ['home', 'search', 'gStar', 'gStarApply', 'explore'];
 
-export const injectRouter = router => {
+export const injectRouter = (router) => {
   const account = useAccountStore();
 
   router.beforeEach(async (to, from) => {
@@ -56,7 +56,7 @@ export const injectRouter = router => {
         path_name: Array.isArray(namespace) ? namespace.join('/') : namespace
       };
       let res = await reqCatch(getPathType, params);
-      if (!res.error) {
+      if (!res.error && res.data) {
         res = res?.data?.data;
 
         if (res?.type === null) {
@@ -77,15 +77,18 @@ export const injectRouter = router => {
     const BASE_URL = (import.meta as any).env.VITE_HOST;
     const beforeRef = sessionStorage.getItem('ref');
     const ref = beforeRef || document.referrer || '';
-    if (!fromHomeWeb.includes(to.name)) { // 设置全局ref
+    if (!fromHomeWeb.includes(to.name)) {
+      // 设置全局ref
       window.page_ref = ref;
       sessionStorage.setItem('ref', BASE_URL + to.fullPath);
     }
 
     // 获取组织详情
-    if (to.meta.type === 'org' || globalStore.namespaceType === 1) { // 组织相关页面 || 组织主页
+    if (to.meta.type === 'org' || globalStore.namespaceType === 1) {
+      // 组织相关页面 || 组织主页
       const { orgId } = useOrgId('%2F', to.params.namespace);
-      if (orgId.value !== currentOrgId) { // 第一次进入或切换组织时调用接口
+      if (orgId.value !== currentOrgId) {
+        // 第一次进入或切换组织时调用接口
         const { setOrgInfo, setAccessLevel, setVisibility } = orgInfoStore();
         const res = await reqCatch(getOrg, { orgId: orgId.value, with_full_path: true });
         if (!res.error) {
@@ -94,7 +97,8 @@ export const injectRouter = router => {
         if (res?.error?.error_code === 404) {
           return { name: '404' };
         }
-        if (res?.error?.error_code === 403) { // 403代表无私有组织权限
+        if (res?.error?.error_code === 403) {
+          // 403代表无私有组织权限
           setAccessLevel(0);
           setVisibility('private');
           return { name: '403' };
@@ -137,8 +141,8 @@ export const injectRouter = router => {
             ['DISCUSSION', 'repoDiscussion'],
             ['COMMUNITY', 'reqCommunity']
           ]);
-          modules.forEach(item => {
+          modules.forEach((item) => {
-            if ((to.name === moduleRouteConfig.get(item.key)) && item.value === '0') {
+            if (to.name === moduleRouteConfig.get(item.key) && item.value === '0') {
               globalStore.setIsNotFound(true);
             }
           });
@@ -204,15 +208,18 @@ export const injectRouter = router => {
     }
 
     // 验证登录权限
-    if (to.meta.needLogin) { // 是否需要登录
+    if (to.meta.needLogin) {
-      if (account.isLogin) { // 已登录
+      // 是否需要登录
+      if (account.isLogin) {
+        // 已登录
         return true;
       } else {
         emitEvent('login', { triggerType: to.meta?.loginType, Authorization: Boolean(to?.meta?.Authorization) });
         return false;
       }
     } else {
-      if (account.isLogin && to.meta.loginHidden) { // 已登录，不能访问某些页面，进行跳转处理（如：登录注册）
+      if (account.isLogin && to.meta.loginHidden) {
+        // 已登录，不能访问某些页面，进行跳转处理（如：登录注册）
         const toOauth = to.name === 'oauth' && /(.*)_(.*)/.exec(to.query?.state); // 三方授权不跳转
         const fromAtomGit = to.query.installation_id && /atomgit.com/.test(document.referrer); // 来自AtomGit应用的跳转
         if (toOauth || fromAtomGit) return true;
@@ -223,7 +230,8 @@ export const injectRouter = router => {
   });
   router.afterEach((to, from) => {
     // 上报PV
-    if (to.fullPath === '/' || to.fullPath !== from.fullPath) { // 同地址切换不上报
+    if (to.fullPath === '/' || to.fullPath !== from.fullPath) {
+      // 同地址切换不上报
       if (!(to.name === 'repo' || to.name === 'repoDir') || (from.fullPath === '/' && to.name === 'repoDir')) {
         // 子应用单独处理
         if (fromHomeWeb.includes(to.name)) return;

src/views/Jyh/Home/index.vue

@@ -6,10 +6,33 @@
         <h1>可信开源代码库</h1>
       </div>
       <div class="home-search" ref="homeSearch" :class="{ 'glow-border': inputGlow }">
-        <d-input ref="searchInput" placeholder="请输入搜索关键字" @focus="inputFocus" @blur="inputBlur"
+        <d-input ref="searchInput" placeholder="请输入搜索关键字" @focus="inputFocus" @blur="inputBlur" :autocomplete="'off'"
         v-model="searchStr">
           <template #prepend>
-            <d-select v-model="searchType" :options="searchOptions"></d-select>
+            <d-dropdown @toggle="onCateToggle($event)">
+              <div class="flex items-center gap-1 cursor-pointer">
+                {{ selectedCate }} 
+                <d-icon :rotate="cateRotate" name="icon-chevron-down-2"></d-icon>
+              </div>
+              <template #menu>
+                <ul class="list-menu">
+                  <li class="menu-item" @click="onCategoryChange('组件/软件')">组件/软件</li>
+                  <d-dropdown :position="position" :offset="0">
+                    <li class="menu-item">
+                      行业
+                      <i class="icon icon-chevron-right"></i>
+                    </li>
+                    <template #menu>
+                      <ul class="list-menu">
+                        <li class="menu-item" v-for="option in industryOptions" @click="onCategoryChange(option)">
+                            {{ option }}
+                        </li>
+                      </ul>
+                    </template>
+                  </d-dropdown>
+                </ul>
+              </template>
+            </d-dropdown>
           </template>
           <template #append>
             <div class="advanced-search" @click="openAdvancedSearch">
@@ -20,9 +43,13 @@
           </template>
         </d-input>
         <d-dropdown-menu v-model="isOpen" :origin="searchInput?.$el" close-scope="'blank'"
-        :offset="offset">
+        :offset="offset" :clickOutside="closeOutside">
           <div class="advanced-search-menu" :style="{ width: dropdownWidth + 'px'}">
-            <AdvanceSearch @submit="submit($event)" @cancel="isOpen = false"/>
+            <AdvanceSearch @submit="submit($event)" @cancel="isOpen = false" class="p-20" :layout="'vertical'">
+              <template #title>
+                <span class="title">高级筛选</span>
+              </template>
+            </AdvanceSearch>
           </div>
         </d-dropdown-menu>
         <d-button color="primary" variant="solid" @click="search">搜索</d-button>
@@ -34,15 +61,15 @@
             <img src="@/assets/imgs/home/informIcon@2x.png">
             <span>信息公示</span>
           </div>
-          <a class="devui-link">更多 ></a>
+          <a class="devui-link" @click="checkMore">更多 ></a>
         </div>
         <div class="info-content">
           <d-timeline :direction="'vertical'" :time-position="'right'" :position="'right'">
-            <d-timeline-item style="cursor: pointer;" v-for="(item, index) in infoList" :key="index"
+            <d-timeline-item v-for="(item, index) in infoList" :key="index"
             :dot-color="item.dotColor" :line-color="'var(--devui-form-control-line-hover)'">
               <template #default>
                 <div style="display: flex; justify-content: space-between;">
-                  <div>{{ item.text }}</div>
+                  <div class="cursor-pointer" @click="openWarningDetail(item.text)">{{ item.text }}</div>
                   <div style="display: flex;  align-items: center; gap: 8px;">
                     <d-icon name="icon-time"></d-icon>
                     {{ item.time }}
@@ -69,11 +96,14 @@ const route = useRoute();
 const router = useRouter();
 const inputGlow = ref(false);
 const searchStr = ref('');
+const position = ref(['right-start', 'right-end']);
+const industryOptions = ref(['通信', '军工', '金融', '能源'])
 const searchType = ref('组件/软件');
 const searchOptions = ref(['组件/软件']);
 const offset = ref({ mainAxis: 7 , crossAxis: -10 });
 const isOpen = ref(false);
 const rotate = ref(0);
+const cateRotate = ref(0);
 const infoList = ref([
   {
     text: '公告1',
@@ -97,7 +127,7 @@ const infoList = ref([
 
 const homeSearch = ref(null);
 const dropdownWidth = ref(0);
-
+const selectedCate = ref('组件/软件');
 
 const searchInput = ref(null);
 const openAdvancedSearch = () => {
@@ -106,9 +136,13 @@ const openAdvancedSearch = () => {
   inputGlow.value = isOpen.value;
 };
 
+const closeOutside = () => {
+  return false
+}
+
 const submit = (formData) => {
   isOpen.value = false;
-  router.push({ name: 'Search', query: { ...formData }});
+  router.push({ name: 'Search', query: { ...formData, searchType: selectedCate.value }});
 };
 
 const inputFocus = () => {
@@ -129,6 +163,22 @@ const search = () => {
   router.push({ name: 'Search', query: { val: searchStr.value || '', type: route?.query?.type || 'License' }});
 };
 
+const onCategoryChange = (cate) => {
+  selectedCate.value = cate;
+}
+
+const onCateToggle = (event) => {
+  cateRotate.value = event ? 180 : 0;
+}
+
+const checkMore = () => {
+  router.push({ name: 'PersonalCenter' });
+}
+
+const openWarningDetail = (event) => {
+  console.log(event)
+}
+
 let resizeObserver: ResizeObserver | null = null;
 
 onMounted(() => {
@@ -295,5 +345,27 @@ onBeforeUnmount(() => {
   transition: border-color 0.3s ease, box-shadow 0.3s ease;
 }
 
+.menu-item {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    width: 100%;
+    padding: 4px;
+    cursor: pointer;
+    &:hover {
+      background-color: var(--devui-list-item-hover-bg, #f2f5fc);
+      color: var(--devui-list-item-hover-text, #526ecc);
+    }
+}
 
+.list-menu {
+    padding: 8px;
+    margin: 0;
+    width: 100px;
+}
+
+.title {
+  font-size: 14px;
+  font-weight: 500;
+}
 </style>

src/views/Jyh/PersonalCenter/OrganizationManage/OrganizationManage.vue

@@ -0,0 +1,98 @@
+<template>
+    <div>
+        <div v-if="hasOrganization"></div>
+        <div v-else>
+            <NoData>
+                <div class="font-bold mb-[20px]">很抱歉，当前无任何组织，赶快去</div>
+                <d-button
+                    size="lg"
+                    variant="solid"
+                    @click="createOrganizationBtnClick"
+                >新建组织</d-button>
+            </NoData>
+        </div>
+    </div>
+
+    <d-modal
+        v-model="createOrganizationModalCtrl"
+        title="新建组织"
+        class="w-[600px]"
+    >
+        <d-form
+            ref="createFormRef"
+            layout="vertical"
+            :data="createFormData"
+            message-type="none"
+        >
+            <d-form-item
+                field="organizationName"
+                label="组织名称"
+                required
+            >
+                <d-input v-model="createFormData.organizationName" />
+            </d-form-item>
+            <d-form-item field="organizationProfile" label="组织简介" required>
+                <d-textarea
+                    v-model="createFormData.organizationProfile"
+                    show-count
+                    maxlength="200"
+                />
+            </d-form-item>
+        </d-form>
+
+        <div class="flex justify-center">
+            <d-button
+                variant="solid"
+                class="mr-[8px]"
+                @click="confirmCreateOrganizationBtnClick"
+            >确定</d-button>
+            <d-button @click="createOrganizationModalClose">取消</d-button>
+        </div>
+    </d-modal>
+</template>
+
+<script setup lang="ts">
+import {reactive, ref} from "vue";
+import NoData from "@/components/NoData/NoData.vue";
+
+const hasOrganization = ref(false);
+
+const createOrganizationModalCtrl = ref(false);
+const createFormData = reactive({
+    organizationName: "",
+    organizationProfile: "", // 组织简介
+});
+const createFormRef = ref();
+
+
+function confirmCreateOrganizationBtnClick() {
+    createFormRef.value.validate(isValid => {
+        if (isValid) {
+          createOrganization();
+        }
+    });
+}
+
+async function createOrganization() {
+    const params = {
+        organizationName: createFormData.organizationName,
+        organizationProfile: createFormData.organizationProfile,
+    };
+    try {
+
+    } catch (e) {
+
+    }
+}
+
+function createOrganizationBtnClick(): void {
+    createOrganizationModalCtrl.value = true;
+}
+
+function createOrganizationModalClose(): void {
+    createOrganizationModalCtrl.value = false;
+}
+</script>
+
+<style scoped lang="scss">
+</style>

src/views/Jyh/PersonalCenter/index.vue

@@ -22,12 +22,14 @@
         <d-tabs class="jyh-tabs jyh-tabs-2 jyh-tabs-3" type="wrapped" v-model="selectTab">
           <d-tab id="yjtzlb" title="预警通知列表"></d-tab>
           <d-tab id="dylb" title="订阅列表"></d-tab>
+          <d-tab id="organizationManage" title="组织管理"></d-tab>
         </d-tabs>
       </div>
     </div>
     <div class="version-detail-content">
       <early-warning v-if="selectTab==='yjtzlb'"/>
       <subscribe-list v-if="selectTab==='dylb'"/>
+      <OrganizationManage v-if="selectTab === 'organizationManage'" />
     </div>
   </div>
 </template>
@@ -38,6 +40,8 @@ import { useRouter, useRoute } from 'vue-router';
 import { getOrgInfo } from '@/views/Org/hooks/orgInfo';
 import EarlyWarning from './Detail/EarlyWarning.vue';
 import SubscribeList from './Detail/SubscribeList.vue';
+import OrganizationManage from './OrganizationManage/OrganizationManage.vue';
+
 const { namespace } = getOrgInfo();
 const avatarUrl = '/src/assets/imgs/avatar/male.png';
 

src/views/Jyh/Search/Components/OssQuery.vue

@@ -1,86 +1,15 @@
 <template>
   <div class="secret-container">
     <div class="search-form">
-      <d-form
+      <AdvanceSearch v-model="newFormData" class="px-20">
-        label-size="lg"
+        <template #operation>
-        class="jyh-form"
+          <gc-form-operation class="jyh-form-operation">
-        ref="formRef"
+            <d-button class="mr-2" variant="solid">筛选</d-button>
-        :data="formData"
+            <d-button variant="solid" color="secondary">清空</d-button>
-        :pop-postion="['right']"
+          </gc-form-operation>
-        :rules="formRules"
+          <d-button class="output-btn" icon="icon-share" variant="text">导出</d-button>
-      >
+        </template>
-        <d-row :gutter="25" type="flex" class="docs-devui-row mb-4">
+      </AdvanceSearch>
-          <d-col style="flex: 1">
-            <d-form-item field="title" label="当前页面搜索关键字" :show-feedback="false">
-              <d-input
-                style="width: 100%"
-                v-model="formData.title"
-                placeholder="License编码模糊搜索"
-                maxLength="50"
-                minLength="2"
-              />
-            </d-form-item>
-          </d-col>
-          <d-col style="flex: 1">
-            <d-form-item field="type" label="主/依赖类型" :show-feedback="false">
-              <gc-checkbox-group class="jyh-checkbox-group" v-model="formData.type" :options="typeOptions" direction="row"></gc-checkbox-group>
-            </d-form-item>
-          </d-col>
-          <d-col style="flex: 1">
-            <d-form-item field="version" label="选型版本火车名称" help-tips="选型版本火车名称" :show-feedback="false">
-              <d-select class="jyh-select-multiple" v-model="formData.version" :multiple="true" :options="typeOptions" :allow-clear="true" />
-            </d-form-item>
-          </d-col>
-          <d-col style="flex: 1">
-            <d-form-item field="title" label="软件编码" :show-feedback="false">
-              <d-input
-                style="width: 100%"
-                v-model="formData.code"
-                placeholder="软件编码模糊搜索"
-                maxLength="50"
-                minLength="2"
-              />
-            </d-form-item>
-          </d-col>
-        </d-row>
-        <d-row :gutter="25" type="flex" class="docs-devui-row mb-5">
-          <d-col style="flex: 1">
-            <d-form-item field="name" label="软件名称" :show-feedback="false">
-              <d-input
-                style="width: 100%"
-                v-model="formData.name"
-                placeholder="软件名称模糊搜索"
-                maxLength="50"
-                minLength="2"
-              />
-            </d-form-item>
-          </d-col>
-          <d-col style="flex: 1">
-            <d-form-item field="versionCode" label="版本编码" :show-feedback="false">
-              <d-input
-                style="width: 100%"
-                v-model="formData.versionCode"
-                placeholder="版本编码模糊搜索"
-                maxLength="50"
-                minLength="2"
-              />
-            </d-form-item>
-          </d-col>
-          <d-col style="flex: 1">
-            <d-form-item field="pulishTime" label="发布时间" :show-feedback="false">
-              <d-date-picker-pro v-model="formData.pulishTime" :showTime="true"
-                                 placeholder="请选择日期与时间"
-                                 format="YYYY-MM-DD HH:mm:ss" />
-            </d-form-item>
-          </d-col>
-          <d-col style="flex: 1"></d-col>
-        </d-row>
-        <gc-form-operation class="jyh-form-operation">
-          <d-button class="mr-2" variant="solid">筛选</d-button>
-          <d-button variant="solid" color="secondary">清空</d-button>
-        </gc-form-operation>
-        <d-button class="output-btn" icon="icon-share" variant="text">导出</d-button>
-      </d-form>
     </div>
     <div class="mt-3 px-20">
       <d-table class="jyh-table" v-if="tableData.length" :striped="false" :data="tableData" table-layout="auto">
@@ -173,9 +102,10 @@
 </template>
 
 <script setup lang="ts">
+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 } from 'vue';
+import { ref,reactive, onMounted } from 'vue';
 import { getGroupClaList, setGroupClaStatus, deleteGroupCla } from '@/api/cla';
 import { useRouter, useRoute } from 'vue-router';
 import { GModal } from '@/components/Setting/index';
@@ -202,6 +132,16 @@ const riskOptions = reactive(['低', '中', '高']);
 const useTypeOptions = reactive(['软件', '文档', '文档+软件']);
 const isUseOptions = reactive(['是', '否']);
 
+const newFormData = ref({
+  licenseName: '',
+  searchWord: '',
+  licenseStrengths: '',
+  softwareVersion: '',
+  dependentSoftware: '',
+  programmingLanguage: '',
+  dateRange: ['', '']
+})
+
 const pager = ref({
   total: 10,
   pageIndex: 1,
@@ -219,7 +159,7 @@ const openDelete = (row: any) => {
 };
 
 const router = useRouter();
-
+const route = useRoute();
 // 跳转
 const gotoDetail = (row) => {
   // 后续请换成params，暂时params传参没传过去
@@ -296,6 +236,13 @@ const setClaStatus = async (row: any) => {
 const signCla = (row: any) => {
   router.push('/cla/' + row.object_id);
 };
+
+onMounted(() => {
+  const query: any = route.query;
+  newFormData.value = {
+    ...query
+  };
+});
 </script>
 
 <style scoped lang="scss">
@@ -354,7 +301,6 @@ const signCla = (row: any) => {
 
 .search-form {
   position: relative;
-  padding: 12px 20px 12px 0;
   border-radius: 8px 0px 8px 8px;
   //background: #F2F5FC;
 

src/views/Jyh/Version/Detail/CommunityInfo.vue

@@ -31,95 +31,15 @@
     <Card simple class="jyh-card mb-4">
       <div class="card-title">贡献者分布</div>
       <p class="card-desc">有关Pull Request创建者的公司信息和地区分布(使用公共GitHub信息进行分析)</p>
-      <d-row class="mt-3">
+      <div class="mt-3">
-        <d-col :span="12">
+        <chart-line />
-          <d-chart :option="optionConChart" style="width: 100%; height: 400px"></d-chart>
+      </div>
-          <p class="text-center mb-3">国家/地球分布</p>
-        </d-col>
-        <d-col :span="12">
-          <d-chart :option="optionOrgChart" style="width: 100%; height: 400px"></d-chart>
-          <p class="text-center mb-3">组织/公司分布</p>
-        </d-col>
-      </d-row>
     </Card>
   </div>
 </template>
 
 <script setup>
-import { ref, reactive } from 'vue';
+import ChartLine from '@/components/ChartLine/index.vue';
-import { DChart } from 'vue-devui/echarts';
-
-const optionConChart = reactive({
-  tooltip: {
-    show: true,
-    trigger: 'item'
-  },
-  xAxis: {
-    type: 'category',
-    data: ['美国', '中国', '德国', '瑞士', '法国', '英国', '印度', '日本', '荷兰', '俄罗斯']
-  },
-  yAxis: {
-    // 给y轴添加单位后缀
-    axisLabel: {
-      formatter: '{value}%'
-    },
-    name: '单位',
-    type: 'value'
-  },
-  series: [
-    {
-      data: [12, 14.8, 23.6, 18.6, 17.3, 13.1, 16, 11.8, 13.9, 16.4],
-      type: 'bar',
-      barWidth: '40%',
-      // 给label添加单位后缀
-      label: {
-        show: true,
-        position: 'top',
-        formatter: '{c}%'
-      },
-      itemStyle: {
-        color: '#2070F3',
-        borderRadius: [5, 5, 0, 0]
-      }
-    }
-  ]
-});
-
-const optionOrgChart = reactive({
-  tooltip: {
-    show: true,
-    trigger: 'item'
-  },
-  xAxis: {
-    type: 'category',
-    data: ['公司1', '公司2', '公司3', '公司4', '公司5', '公司6', '公司7', '公司8', '公司9', '公司10']
-  },
-  yAxis: {
-    // 给y轴添加单位后缀
-    axisLabel: {
-      formatter: '{value}%'
-    },
-    name: '单位',
-    type: 'value'
-  },
-  series: [
-    {
-      data: [12, 14.8, 23.6, 18.6, 17.3, 13.1, 16, 11.8, 13.9, 16.4],
-      type: 'bar',
-      barWidth: '40%',
-      // 给label添加单位后缀
-      label: {
-        show: true,
-        position: 'top',
-        formatter: '{c}%'
-      },
-      itemStyle: {
-        color: '#2CB8C9',
-        borderRadius: [5, 5, 0, 0]
-      }
-    }
-  ]
-});
 </script>
 
 <style scoped lang="scss">

src/views/Jyh/Version/Detail/SBOM.vue

@@ -0,0 +1,91 @@
+<template>
+  <div class="flex align-center justify-start">
+    <d-search icon-position="left" style="width: 380px" placeholder="请输入搜索组件名称"></d-search>
+    <d-checkbox class="ml-10" label="只显示有漏洞的组件" :isShowTitle="false" v-model="checked" />
+  </div>
+  <Card simple class="jyh-card mt-3">
+    <div class="clear-padding">
+      <d-table :indent="32" @check-change="treeCheckChange" :data="baseTreeTableData1" row-key="id">
+        <d-column field="firstName" header="组织名称" show-overflow-tooltip> </d-column>
+        <d-column field="lastName" header="版本"></d-column>
+      </d-table>
+    </div>
+  </Card>
+</template>
+<script setup lang="ts">
+import { ref, reactive } from 'vue';
+const checked = ref(false);
+
+const baseTreeTableData1 = ref([
+  {
+    id: '1',
+    firstName: 'openssl',
+    lastName: 'N.A.',
+    children: [
+      {
+        id: '2',
+        firstName: 'ssl',
+        lastName: 'N.A.',
+        children: [
+          {
+            id: '3',
+            firstName: 'ssl',
+            lastName: 'N.A.'
+          },
+          {
+            id: '4',
+            firstName: 'crypto',
+            lastName: 'N.A.'
+          }
+        ]
+      }
+    ]
+  },
+  {
+    id: '5',
+    firstName: 'Text-Template-1.56',
+    lastName: 'N.A.',
+    children: [
+      {
+        id: '6',
+        firstName: 'ssl',
+        lastName: 'N.A.',
+        children: [
+          {
+            id: '7',
+            firstName: 'ssl',
+            lastName: 'N.A.'
+          },
+          {
+            id: '8',
+            firstName: 'crypto',
+            lastName: 'N.A.'
+          }
+        ]
+      }
+    ]
+  },
+  {
+    id: '9',
+    firstName: 'Text-Template-1.56',
+    lastName: 'N.A.'
+  }
+]);
+
+const treeCheckChange = (val, row, selection) => {
+  console.log('treeCheckChange', selection);
+};
+</script>
+
+<style scoped lang="scss">
+.clear-padding {
+  margin: -16px -20px;
+}
+:deep(.devui-table__cell) {
+  display: flex;
+  align-items: center;
+  .devui-table__tree-operate {
+    transform: translateY(-3px);
+  }
+}
+</style>

src/views/Jyh/Version/Detail/index.vue

@@ -27,6 +27,7 @@
         <d-tab id="bbxx" title="版本信息"></d-tab>
         <d-tab id="ylgx" title="依赖关系"></d-tab>
         <d-tab id="ldxx" title="漏洞信息"></d-tab>
+        <d-tab id="SBOM" title="SBOM"></d-tab>
         <d-tab id="communityInfo" title="开发者社区信息"></d-tab>
         <d-tab id="ai" title="AI修复建议"></d-tab>
         <d-tab id="licenseInfo" title="许可证信息"></d-tab>
@@ -36,8 +37,10 @@
       <version-info v-if="selectTab === 'bbxx'" @changeTabs="changeTabs"></version-info>
       <vulnerabilities-list v-else-if="selectTab === 'ldxx'"></vulnerabilities-list>
       <community-info v-else-if="selectTab === 'communityInfo'"></community-info>
+      <SBOM v-else-if="selectTab === 'SBOM'" />
       <AIRepair v-else-if="selectTab === 'ai'"></AIRepair>
-      <LicenseInfo v-else-if="selectTab === 'licenseInfo'"></LicenseInfo>    </div>
+      <LicenseInfo v-else-if="selectTab === 'licenseInfo'"></LicenseInfo>
+    </div>
   </div>
 </template>
 
@@ -48,6 +51,7 @@ import { getOrgInfo } from '@/views/Org/hooks/orgInfo';
 import VulnerabilitiesList from './VulnerabilitiesList.vue';
 import CommunityInfo from './CommunityInfo.vue';
 import VersionInfo from './VersionInfo.vue';
+import SBOM from './SBOM.vue';
 import AIRepair from '../../AIRepair/index.vue';
 import LicenseInfo from '../../LicenseInfo/index.vue';
 const { namespace } = getOrgInfo();