Merge branch 'master' of https://gitcode.com/hk_openRepo/OpenRepo_Portal into dev-shenjianbin
This commit is contained in:
@@ -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>
|
||||
@@ -1,86 +1,15 @@
|
||||
<template>
|
||||
<div class="secret-container">
|
||||
<div class="search-form">
|
||||
<d-form
|
||||
label-size="lg"
|
||||
class="jyh-form"
|
||||
ref="formRef"
|
||||
:data="formData"
|
||||
:pop-postion="['right']"
|
||||
:rules="formRules"
|
||||
>
|
||||
<d-row :gutter="25" type="flex" class="docs-devui-row mb-4">
|
||||
<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>
|
||||
<AdvanceSearch v-model="newFormData" class="px-20">
|
||||
<template #operation>
|
||||
<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>
|
||||
</template>
|
||||
</AdvanceSearch>
|
||||
</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;
|
||||
|
||||
|
||||
@@ -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">
|
||||
<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>
|
||||
<div class="mt-3">
|
||||
<chart-line />
|
||||
</div>
|
||||
</Card>
|
||||
</div>
|
||||
</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]
|
||||
}
|
||||
}
|
||||
]
|
||||
});
|
||||
import ChartLine from '@/components/ChartLine/index.vue';
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
@@ -127,7 +47,4 @@ const optionOrgChart = reactive({
|
||||
font-size: 12px;
|
||||
color: #808080;
|
||||
}
|
||||
.mt-translate-y {
|
||||
transform: translateY(-30px);
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user