Skip to content

R
risk-monitor
提交 2dc2aedd authored 作者: coderBryanFu's avatar coderBryanFu
浏览文件
操作

feat:更新数据资源库

上级 6d19a446
显示空白字符变更
内嵌 并排
正在显示 包含 2865 行增加 和 355 行删除
src/views/ZMOverView/components/fourSuppress/components/addDomain/multiLineChart.js
浏览文件 @ 2dc2aedd
......@@ -31,7 +31,7 @@ const getMultiLineChart = (data) => {
return {
color: series.map(item => item.color),
tooltip: {
trigger: 'axis',
trigger: 'item',
backgroundColor: 'rgba(255, 255, 255, 0.9)',
textStyle: {
color: '#666'
......
src/views/bill/billHome/ResourceLibrarySection.vue
浏览文件 @ 2dc2aedd
......@@ -873,7 +873,7 @@ const handleCooperationToDataLibrary = (item) => {
let param
if (areaList.length > 2) {
if (areaList.length > 1) {
param = {
selectedOrg: postOrgStr,
selectedmember: JSON.stringify(memberList),
......@@ -887,15 +887,11 @@ const handleCooperationToDataLibrary = (item) => {
}
}
const route = router.resolve({
path: "/dataLibrary/countryBill",
query: param
});
window.open(route.href, "_blank");
}
// 委员会跳转至数据资源库
......@@ -910,10 +906,17 @@ const handleToDataLibrary = (item) => {
congressStr = '众议院'
}
}
const param = {
let param
if (congressStr === '全部议院') {
param = {
selectedOrg: item.name,
}
} else {
param = {
selectedOrg: item.name,
selectedCongress: congressStr
}
}
const route = router.resolve({
path: "/dataLibrary/countryBill",
......
src/views/bill/billHome/index.vue
浏览文件 @ 2dc2aedd
......@@ -9,22 +9,11 @@
:containerRef="containerRef" areaName="法案" :enableBillTypeSwitch="true" defaultBillSearchType="federal" />
</div>
<SummaryCardsPanel
descriptionText="近期美国国会各委员会涉华提案数量汇总"
:cards="committeeCards"
:totalCount="committeeTotalCount"
:tipIcon="box7HeaderIcon"
:defaultAvatar="iconCommit"
:loading="committeeLoading"
activeTime="近一年"
emptyText="暂无数据"
moreText="查看全部委员会"
:moreCardMinCount="7"
@time-click="handleCommitteeTimeClick"
@name-click="handleToInstitution"
@count-click="handleToDataLibrary"
@more-click="handleToCommitteeMore"
/>
<SummaryCardsPanel descriptionText="近期美国国会各委员会涉华提案数量汇总" :cards="committeeCards"
:totalCount="committeeTotalCount" :tipIcon="box7HeaderIcon" :defaultAvatar="iconCommit"
:loading="committeeLoading" activeTime="近一年" emptyText="暂无数据" moreText="查看全部委员会" :moreCardMinCount="7"
@time-click="handleCommitteeTimeClick" @name-click="handleToInstitution" @count-click="handleToDataLibrary"
@more-click="handleToCommitteeMore" />
<DivideHeader id="position1" class="divide1" :titleText="'最新动态'"></DivideHeader>
<div class="home-content-center">
......@@ -106,8 +95,9 @@
</el-carousel>
</div>
</OverviewMainBox>
<RiskSignal :list="warningList" @more-click="handleToMoreRiskSignal" @item-click="handleRiskSignalItemToManage"
riskLevel="signalLevel" postDate="signalTime" name="signalTitle" />
<RiskSignal :list="warningList" @more-click="handleToMoreRiskSignal"
@item-click="handleRiskSignalItemToManage" riskLevel="signalLevel" postDate="signalTime"
name="signalTitle" />
</div>
<DivideHeader id="position2" class="divide2" :titleText="'资讯要闻'"></DivideHeader>
......@@ -1435,19 +1425,17 @@ const handleToInstitution = item => {
// 下钻至资源库
const handleToDataLibrary = (item) => {
// window.sessionStorage.setItem("curTabName", item.id);
// const curRoute = router.resolve({
// path: "/institution",
// query: {
// id: item.id
// }
// });
// window.open(curRoute.href, "_blank");
// console.log('item', item);
const selectParam = {
let selectParam
if (item.subText === '众议院' || item.subText === '参议院') {
selectParam = {
selectedOrg: item.name,
selectedCongress: item.chamber
selectedCongress: item.subText
}
} else {
selectParam = {
selectedOrg: item.name
}
}
const route = router.resolve({
path: "/dataLibrary/countryBill",
......@@ -1870,7 +1858,8 @@ onUnmounted(() => {
background: var(--bg-white-100);
box-sizing: border-box;
cursor: pointer;
&:hover{
&:hover {
background: var(--color-primary-2);
}
......
src/views/dataLibrary/bill/countryBill/index.vue
浏览文件 @ 2dc2aedd
......@@ -12,7 +12,7 @@
<SelectBox v-if="isFolderAll" :placeholder-name="congressPlaceHolder" select-title="提出议院"
:select-list="congressList" :select-name="selectedCongress" @update:select-text="handleSelectCongress" />
<SelectBox v-if="isFolderAll" :placeholder-name="orgPlaceHolder" select-title="委员会" :select-list="orgList"
:select-name="selectedOrg" @update:select-text="handleSelectOrg" />
:select-name="selectedOrg" @update:select-text="handleSelectOrg" :is-multiple="true" />
<SelectBox v-if="isFolderAll" :placeholder-name="memberPlaceHolder" select-title="提案议员"
:select-list="memberList" :select-name="selectedPostMan" @update:select-text="handleSelectPostMan" />
<SelectBox v-if="isFolderAll" :placeholder-name="memberPlaceHolder" select-title="提出议员"
......@@ -372,11 +372,11 @@ const activeTagList = computed(() => {
}
)
}
if (selectedOrg.value && selectedOrg.value !== '全部委员会') {
if (selectedOrg.value && selectedOrg.value[0] !== '全部委员会') {
arr.push(
{
tag: '委员会',
name: selectedOrg.value
name: selectedOrg.value.join('、')
}
)
}
......@@ -426,7 +426,7 @@ const handleCloseCurTag = (tag, index) => {
selectedCongress.value = '全部议院'
break
case '委员会':
selectedOrg.value = '全部委员会'
selectedOrg.value = ['全部委员会']
break
case '提出议员':
selectedmember.value = ['全部议员']
......@@ -582,8 +582,11 @@ const areaList = ref([
},
])
const handleSelectArea = (value) => {
// selectedArea.value = value
selectedArea.value = value.length > 1 && value.includes('全部领域') ? value.filter(item => item !== '全部议员') : value;
if (value[value.length - 1] === '全部领域') {
selectedArea.value = ['全部领域']
return
}
selectedArea.value = value.length > 1 && value.includes('全部领域') ? value.filter(item => item !== '全部领域') : value;
}
// 提案时间
......@@ -673,15 +676,21 @@ const handleSelectCongress = value => {
// 委员会
const orgList = ref([])
const selectedOrg = ref('全部委员会')
const selectedOrg = ref(['全部委员会'])
const orgPlaceHolder = ref('请选择委员会')
const handleSelectOrg = value => {
selectedOrg.value = value
// selectedOrg.value = value
if (value[value.length - 1] === '全部委员会') {
selectedOrg.value = ['全部委员会']
return
}
selectedOrg.value = value.length > 1 && value.includes('全部委员会') ? value.filter(item => item !== '全部委员会') : value;
}
// 获取委员会
const handleGetOrgList = async () => {
loading.value = true
try {
const res = await getPostOrgList()
console.log('委员会列表', res);
......@@ -698,6 +707,8 @@ const handleGetOrgList = async () => {
} catch (error) {
console.error('获取委员会列表报错:', error);
} finally {
loading.value = false
}
}
......@@ -712,11 +723,16 @@ const memberList = ref([])
const selectedmember = ref(['全部议员'])
const memberPlaceHolder = ref('请选择议员')
const handleSelectMember = value => {
if (value[value.length - 1] === '全部议员') {
selectedmember.value = ['全部议员']
return
}
selectedmember.value = value.length > 1 && value.includes('全部议员') ? value.filter(item => item !== '全部议员') : value;
}
// 获取议员
const handleGetMemberList = async () => {
loading.value = true
try {
const res = await getPostMemberList()
console.log('议员列表', res);
......@@ -734,6 +750,8 @@ const handleGetMemberList = async () => {
} catch (error) {
console.error('获取议员列表报错:', error);
} finally {
loading.value = false
}
}
......@@ -766,6 +784,7 @@ const statusList = ref([
])
const handleGetStatusList = async () => {
loading.value = true
try {
const res = await getStatusList()
console.log('获取立法阶段列表', res);
......@@ -787,6 +806,8 @@ const handleGetStatusList = async () => {
} catch (error) {
} finally {
loading.value = false
}
}
......@@ -807,7 +828,7 @@ const handleClear = () => {
selectedDate.value = ''
selectedParty.value = '全部党派'
selectedCongress.value = '全部议院'
selectedOrg.value = '全部委员会'
selectedOrg.value = ['全部委员会']
selectedmember.value = ['全部议员']
selectedStatus.value = '全部阶段'
isInvolveCn.value = false
......@@ -877,11 +898,11 @@ const fetchTableData = async () => {
proposedDateEnd: customTime.value[1],
affiliation: selectedParty.value === '全部党派' ? null : selectedParty.value,
originChamber: selectedCongress.value === '全部议院' ? null : selectedCongress.value,
originDepart: selectedOrg.value === '全部委员会' ? null : selectedOrg.value,
proposer: handleSelectPostMan.value === '全部议员' ? null :selectedPostMan.value,
originDepart: selectedOrg.value[0] === '全部委员会' ? null : selectedOrg.value,
proposer: selectedPostMan.value === '全部议员' ? null : selectedPostMan.value,
sponsorPersonName: selectedmember.value[0] === '全部议员' ? null : selectedmember.value,
status: selectedStatus.value === '全部阶段' ? null : selectedStatus.value,
isInvolveCn: isInvolveCn.value ? 'Y' : 'N',
isInvolveCn: isInvolveCn.value ? 'Y' : null,
sort: isSort.value ? 0 : 1 // 0 先按分数降序 后按时间降序 1 先按分数降序，再按时间升序
}
try {
......@@ -977,11 +998,11 @@ const fetchAllData = async () => {
proposedDateEnd: customTime.value[1],
affiliation: selectedParty.value === '全部党派' ? null : selectedParty.value,
originChamber: selectedCongress.value === '全部议院' ? null : selectedCongress.value,
originDepart: selectedOrg.value === '全部委员会' ? null : selectedOrg.value,
proposer: handleSelectPostMan.value === '全部议员' ? null :selectedPostMan.value,
originDepart: selectedOrg.value[0] === '全部委员会' ? null : selectedOrg.value,
proposer: selectedPostMan.value === '全部议员' ? null : selectedPostMan.value,
sponsorPersonName: selectedmember.value[0] === '全部议员' ? null : selectedmember.value,
status: selectedStatus.value === '全部阶段' ? null : selectedStatus.value,
isInvolveCn: isInvolveCn.value ? 'Y' : 'N',
isInvolveCn: isInvolveCn.value ? 'Y' : null,
sort: isSort.value ? 0 : 1 // 0 先按分数降序 后按时间降序 1 先按分数降序，再按时间升序
}
try {
......@@ -1153,15 +1174,15 @@ const initParam = () => {
}
selectedCongress.value = route.query.selectedCongress ? route.query.selectedCongress : '全部议院'
selectedOrg.value = route.query.selectedOrg ? route.query.selectedOrg : '全部委员会'
selectedOrg.value = route.query.selectedOrg ? [route.query.selectedOrg] : ['全部委员会']
selectedmember.value = route.query.selectedmember ? JSON.parse(route.query.selectedmember) : ['全部议员']
const query = route.query;
if (Object.keys(query).length > 0) {
sessionStorage.setItem('countryRouteQuery', JSON.stringify(query));
sessionStorage.setItem('countryBillRouteQuery', JSON.stringify(query));
}
} else {
const savedQuery = JSON.parse(sessionStorage.getItem('countryRouteQuery') || '{}');
const savedQuery = JSON.parse(sessionStorage.getItem('countryBillRouteQuery') || '{}');
if (savedQuery.selectedAreaList) {
selectedArea.value = JSON.parse(savedQuery.selectedAreaList)
......@@ -1180,7 +1201,7 @@ const initParam = () => {
}
selectedCongress.value = savedQuery.selectedCongress ? savedQuery.selectedCongress : '全部议院'
selectedOrg.value = savedQuery.selectedOrg ? savedQuery.selectedOrg : '全部委员会'
selectedOrg.value = savedQuery.selectedOrg ? [savedQuery.selectedOrg] : ['全部委员会']
selectedmember.value = savedQuery.selectedmember ? savedQuery.selectedmember : ['全部议员']
}
......@@ -1236,10 +1257,9 @@ const handleExport = () => {
};
onMounted(async () => {
handleGetOrgList()
handleGetMemberList()
await handleGetOrgList()
await handleGetMemberList()
await handleGetStatusList()
// 初始化
initParam()
fetchTableData()
......
src/views/dataLibrary/company/index.vue
浏览文件 @ 2dc2aedd
......@@ -614,6 +614,7 @@ const handleSelectCountry = value => {
}
const handleGetCountryList = async () => {
loading.value = true
try {
const res = await getCountryList();
......@@ -629,6 +630,8 @@ const handleGetCountryList = async () => {
}
} catch (error) {
} finally {
loading.value = false
}
}
......@@ -648,6 +651,7 @@ const handleSelectCompanyType = value => {
}
// 获取企业类型
const handleGetCompanyType = async () => {
loading.value = true
try {
const res = await getBusinessType()
console.log('企业类型', res);
......@@ -664,6 +668,8 @@ const handleGetCompanyType = async () => {
} catch (error) {
console.error('获取企业类型error', error);
} finally {
loading.value = false
}
}
......@@ -1017,10 +1023,10 @@ const initParam = () => {
const query = route.query;
if (Object.keys(query).length > 0) {
sessionStorage.setItem('decreeRouteQuery', JSON.stringify(query));
sessionStorage.setItem('dataCompanyRouteQuery', JSON.stringify(query));
}
} else {
const savedQuery = JSON.parse(sessionStorage.getItem('decreeRouteQuery') || '{}');
const savedQuery = JSON.parse(sessionStorage.getItem('dataCompanyRouteQuery') || '{}');
selectedArea.value = savedQuery.domains ? savedQuery.domains : '全部领域'
if (savedQuery.selectedDate && Array.isArray(JSON.parse(savedQuery.selectedDate)) && JSON.parse(savedQuery.selectedDate).length) {
selectedDate.value = '自定义'
......
src/views/dataLibrary/decree/index.vue
浏览文件 @ 2dc2aedd
......@@ -614,6 +614,7 @@ const handleSelectIns = value => {
}
const handleGetDeparmentList = async () => {
loading.value = true
try {
// let { keyWord, pageNum, pageSize, day } = organizationInfo
const params = {
......@@ -633,6 +634,8 @@ const handleGetDeparmentList = async () => {
}
} catch (error) {
} finally {
loading.value = false
}
}
......@@ -1055,7 +1058,7 @@ const handleExport = () => {
};
onMounted(async () => {
handleGetDeparmentList()
await handleGetDeparmentList()
initParam()
// 初始化
......
src/views/dataLibrary/exportControl/commerceControlList/index.vue
浏览文件 @ 2dc2aedd
......@@ -521,6 +521,7 @@ const handleSelectType = value => {
}
// 获取国家地区列表
const handleGetMaterialCategory = async () => {
loading.value = true
try {
const res = await getMaterialCategory()
console.log('获取物项类别', res);
......@@ -534,6 +535,8 @@ const handleGetMaterialCategory = async () => {
}
} catch (error) {
} finally {
loading.value = false
}
}
......@@ -552,6 +555,7 @@ const handleSelectControlReason = value => {
}
// 获取管控原因列表
const handleGetControlReason = async () => {
loading.value = true
try {
const res = await getControlReason()
console.log('获取管控原因', res);
......@@ -565,6 +569,8 @@ const handleGetControlReason = async () => {
}
} catch (error) {
} finally {
loading.value = false
}
}
......@@ -636,7 +642,7 @@ const fetchTableData = async () => {
const params = {
page: currentPage.value,
size: pageSize.value,
type: 13, // 商业管制清单
type: 11, // 商业管制清单
domains: selectedArea.value === '全部领域' ? null : [selectedArea.value], // 科技领域
proposedDateStart: customTime.value[0] ? customTime.value[0] : null,
proposedDateEnd: customTime.value[1] ? customTime.value[1] : null,
......@@ -718,7 +724,7 @@ const fetchAllData = async () => {
const params = {
page: 1,
size: 9999,
type: 13, // 商业管制清单
type: 11, // 商业管制清单
domains: selectedArea.value === '全部领域' ? null : [selectedArea.value], // 科技领域
proposedDateStart: customTime.value[0] ? customTime.value[0] : null,
proposedDateEnd: customTime.value[1] ? customTime.value[1] : null,
......@@ -904,17 +910,7 @@ const initParam = () => {
// 跳转政令详情
const handleClickToDetail = (curDecree) => {
console.log('curDecree', curDecree);
window.sessionStorage.setItem("decreeId", curDecree.id);
window.sessionStorage.setItem("curTabName", curDecree.title);
const route = router.resolve({
path: "/decreeLayout",
query: {
id: curDecree.id
}
});
window.open(route.href, "_blank");
};
// 跳转机构详情
......@@ -953,8 +949,8 @@ const handleExport = () => {
onMounted(async () => {
handleGetMaterialCategory() // 获取物项类别列表
handleGetControlReason() // 获取管控原因
await handleGetMaterialCategory() // 获取物项类别列表
await handleGetControlReason() // 获取管控原因
initParam()
// 初始化
await fetchTableData()
......
src/views/dataLibrary/exportControl/commerceControlListEvent/index.vue
浏览文件 @ 2dc2aedd
......@@ -832,17 +832,7 @@ const initParam = () => {
// 跳转政令详情
const handleClickToDetail = (curDecree) => {
console.log('curDecree', curDecree);
window.sessionStorage.setItem("decreeId", curDecree.id);
window.sessionStorage.setItem("curTabName", curDecree.title);
const route = router.resolve({
path: "/decreeLayout",
query: {
id: curDecree.id
}
});
window.open(route.href, "_blank");
};
// 跳转机构详情
......
src/views/dataLibrary/exportControl/entityList/index.vue
浏览文件 @ 2dc2aedd
......@@ -654,6 +654,7 @@ const handleSelectCountry = value => {
}
// 获取国家地区列表
const handleGetCountryList = async () => {
loading.value = true
try {
const res = await getCountryList()
console.log('获取国家列表', res);
......@@ -667,6 +668,8 @@ const handleGetCountryList = async () => {
}
} catch (error) {
} finally {
loading.value = false
}
}
......@@ -685,6 +688,7 @@ const handleSelectProvince = value => {
}
// 获取全部省份列表
const handleGetProvinceList = async () => {
loading.value = true
try {
const res = await getProvinceList()
console.log('获取省份列表', res);
......@@ -701,7 +705,7 @@ const handleGetProvinceList = async () => {
console.error(error);
} finally {
loading.value = false
}
}
......@@ -719,6 +723,7 @@ const handleSelectEntityType = value => {
}
// 获取实体类型列表
const handleGetEntityTypes = async () => {
loading.value = true
try {
const res = await getEntityTypes()
console.log('获取实体类型列表', res);
......@@ -733,6 +738,8 @@ const handleGetEntityTypes = async () => {
} catch (error) {
} finally {
loading.value = false
}
}
......@@ -1121,7 +1128,7 @@ const handleClickToDetail = (curEntity) => {
const route = router.resolve({
name: "companyPages",
params: {
id: curEntity.id
id: curEntity.organizationId
}
});
window.open(route.href, "_blank");
......@@ -1162,8 +1169,9 @@ const handleExport = () => {
};
onMounted(async () => {
await handleGetProvinceList() // 获取省份列表
await handleGetCountryList() // 获取国家列表
await handleGetProvinceList() // 获取省份列表
await handleGetEntityTypes() // 获取实体类型列表
initParam()
// 初始化
......
src/views/dataLibrary/exportControl/entityListEvent/index.vue
浏览文件 @ 2dc2aedd
......@@ -832,34 +832,19 @@ const initParam = () => {
}
// 跳转单次清单事件详情
const handleClickToDetail = (curEntityEvent) => {
console.log('curEntityEvent', curEntityEvent);
// window.sessionStorage.setItem("decreeId", curEntityEvent.id);
// window.sessionStorage.setItem("curTabName", curEntityEvent.title);
// let id = item?.id;
// let sanTypeId = item?.sanTypeId || 1;
// if (!id) {
// const currentItem = entitiesDataInfoList.value[currentCarouselIndex.value];
// id = currentItem?.id;
// sanTypeId = currentItem?.sanTypeId || 1;
// }
// window.sessionStorage.setItem(
// "curTabName",
// entitiesDataInfoList.value[currentCarouselIndex.value].postDate + " 《实体清单新增条目》"
// );
// let date = entitiesDataInfoList.value[currentCarouselIndex.value].postDate
// const routeData = router.resolve({
// path: "/exportControl/singleSanction",
// query: {
// id,
// sanTypeId,
// date
// }
// });
// // 打开一个新页面
// window.open(routeData.href, "_blank");
const handleClickToDetail = (item) => {
console.log('curEntityEvent', item);
window.sessionStorage.setItem("curTabName", `${item.date}《${item.originalTitle}》`);
const route = router.resolve({
path: "/exportControl/singleSanction",
query: {
id: item.id,
sanTypeId: 1,
date: item.date
}
});
window.open(route.href, "_blank");
};
// 跳转机构详情
......
src/views/dataLibrary/financeControl/mREList/index.vue
浏览文件 @ 2dc2aedd
......@@ -521,6 +521,7 @@ const handleSelectType = value => {
}
// 获取国家地区列表
const handleGetMaterialCategory = async () => {
loading.value = true
try {
const res = await getMaterialCategory()
console.log('获取物项类别', res);
......@@ -534,6 +535,8 @@ const handleGetMaterialCategory = async () => {
}
} catch (error) {
} finally {
loading.value = false
}
}
......@@ -552,6 +555,7 @@ const handleSelectControlReason = value => {
}
// 获取管控原因列表
const handleGetControlReason = async () => {
loading.value = true
try {
const res = await getControlReason()
console.log('获取管控原因', res);
......@@ -565,6 +569,8 @@ const handleGetControlReason = async () => {
}
} catch (error) {
} finally {
loading.value = false
}
}
......@@ -636,7 +642,7 @@ const fetchTableData = async () => {
const params = {
page: currentPage.value,
size: pageSize.value,
type: 13, // 商业管制清单
type: 15, // 涉军企业清单
domains: selectedArea.value === '全部领域' ? null : [selectedArea.value], // 科技领域
proposedDateStart: customTime.value[0] ? customTime.value[0] : null,
proposedDateEnd: customTime.value[1] ? customTime.value[1] : null,
......@@ -718,7 +724,7 @@ const fetchAllData = async () => {
const params = {
page: 1,
size: 9999,
type: 13, // 商业管制清单
type: 15, // 涉军企业清单
domains: selectedArea.value === '全部领域' ? null : [selectedArea.value], // 科技领域
proposedDateStart: customTime.value[0] ? customTime.value[0] : null,
proposedDateEnd: customTime.value[1] ? customTime.value[1] : null,
......@@ -887,10 +893,10 @@ const initParam = () => {
const query = route.query;
if (Object.keys(query).length > 0) {
sessionStorage.setItem('commerceRouteQuery', JSON.stringify(query));
sessionStorage.setItem('mRListRouteQuery', JSON.stringify(query));
}
} else {
const savedQuery = JSON.parse(sessionStorage.getItem('commerceRouteQuery') || '{}');
const savedQuery = JSON.parse(sessionStorage.getItem('mRListRouteQuery') || '{}');
selectedArea.value = savedQuery.domains ? savedQuery.domains : '全部领域'
if (savedQuery.selectedDate && Array.isArray(JSON.parse(savedQuery.selectedDate)) && JSON.parse(savedQuery.selectedDate).length) {
selectedDate.value = '自定义'
......@@ -903,15 +909,12 @@ const initParam = () => {
}
// 跳转政令详情
const handleClickToDetail = (curDecree) => {
console.log('curDecree', curDecree);
window.sessionStorage.setItem("decreeId", curDecree.id);
window.sessionStorage.setItem("curTabName", curDecree.title);
const handleClickToDetail = (curEntity) => {
window.sessionStorage.setItem("curTabName", curEntity.title);
const route = router.resolve({
path: "/decreeLayout",
query: {
id: curDecree.id
name: "companyPages",
params: {
id: curEntity.id
}
});
window.open(route.href, "_blank");
......@@ -953,8 +956,8 @@ const handleExport = () => {
onMounted(async () => {
handleGetMaterialCategory() // 获取物项类别列表
handleGetControlReason() // 获取管控原因
await handleGetMaterialCategory() // 获取物项类别列表
await handleGetControlReason() // 获取管控原因
initParam()
// 初始化
await fetchTableData()
......
src/views/dataLibrary/financeControl/mREListEvent/index.vue
浏览文件 @ 2dc2aedd
<template>
<div class="countrybill-wrapper">
<div class="header-box">我是涉军企业清单事件</div>
<div class="main-box">
<div class="header-box">
<div class="header-top">
<SelectBox :placeholder-name="areaPlaceHolder" select-title="科技领域" :select-list="areaList"
:select-name="selectedArea" @update:select-text="handleSelectArea" />
<SelectBox :placeholder-name="DatePlaceHolder" select-title="制裁时间" :select-list="dateList"
:select-name="selectedDate" :custom-time="customTime" @update:select-text="handleSelectDate"
@update:custom-time="handleCustomDate" />
<div class="check-box">
<div class="check-box-left text-tip-1">
{{ '是否涉华：' }}
</div>
<div class="check-box-right">
<el-checkbox v-model="isInvolveCnOnly" class="involve-checkbox">
{{ '只看涉华' }}
</el-checkbox>
</div>
</div>
</div>
<div class="header-footer">
<div class="header-footer-left">
<ActiveTag v-for="tag, index in activeTagList" :key="index" :tagName="tag.name"
@close="handleCloseCurTag(tag, index)" />
</div>
<div class="header-footer-right">
<HeaderBtnBox :isShowAll="isFolderAll" :isShowAllBtn="false" @show-all="handleSwitchFolderAll"
@clear="handleClear" @confirm="handleConfirm" />
</div>
</div>
</div>
<div class="chart-main-box" v-if="isShowChart">
<div class="info-box">
<div class="switch-box" @click="handleSwitchChartData">
<img v-if="!isShowChart" src="@/views/dataLibrary/assets/icons/chart-active.svg" alt="">
<img v-else src="@/views/dataLibrary/assets/icons/data-active.svg" alt="">
<DataChartSwitchBox :is-show-data="!isShowChart" />
</div>
<div class="num-box text-title-3-bold">
{{ `共 ${totalNum} 条数据` }}
</div>
</div>
<div class="content-box">
<div class="content-header">
<ChartHeader :list="staticsDemensionList" @clickItem="handleClickDemensionItem">
<template #chart-header-right>
<el-select v-model="selectedTime" placeholder="选择时间" style="width: 150px" v-show="curDemension === '制裁时间'"
@change="handleChangeTime">
<el-option v-for="item in timeList" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
</template>
</ChartHeader>
</div>
<div class="content-main">
<ChartContainer :chartTitle="curChartTitle" :chartTypeList="curChartTypeList"
@clickChartItem="handleSwitchActiveChart" @download="handleDownloadCurChartData">
<template #chart-box>
<LineChart v-if="activeChart === '折线图'" :lineChartData="curChartData" />
<BarChart v-if="activeChart === '柱状图'" :barChartData="curChartData" />
<PieChart v-if="activeChart === '饼状图'" :pieChartData="curChartData" />
<RaderChart v-if="activeChart === '雷达图'" :radarChartData="curChartData" />
</template>
</ChartContainer>
</div>
</div>
</div>
<div class="data-main-box" v-else>
<div class="data-main-box-header">
<div class="switch-box" @click="handleSwitchChartData">
<DataChartSwitchBox :is-show-data="!isShowChart" />
</div>
<div class="num-box text-title-3-bold">
{{ `共 ${totalNum} 条数据` }}
</div>
</div>
<div class="content-box"></div>
<div class="data-main-box-main">
<div class="data-main-box-main-header">
<div class="header-left">
<div class="header-left-item1">
<el-checkbox v-model="isSelectedAll" label="全选" @change="handleSelectAllChange" size="large" />
</div>
<div class="header-left-item2 text-tip-1">{{ `已选择${selectedCount}项` }}</div>
<div class="header-left-item2 text-tip-1 cancel" @click="handleClearAll" v-show="selectedCount">{{ '取消' }}
<div class="header-left-item3 text-tip-1" v-if="isShowAllDataMaxLengthTip">{{ `(当前最大选择不能超过1万条！)` }}</div>
</div>
</div>
<div class="header-right">
<div class="header-right-item item1" @click="handleExport">
<div class="icon">
<img src="../../assets/icons/download.svg" alt="">
</div>
<div class="text text-tip-1">{{ '导出' }}</div>
</div>
<div class="header-right-item2 item2">
<el-select v-model="curOperation" placeholder="批量操作" style="width: 120px">
<el-option v-for="item in operationList" :key="item.id" :label="item.name" :value="item.id" />
</el-select>
</div>
<div class="header-right-item3 item3">
<el-select v-model="isSort" placeholder="制裁时间" style="width: 166px" @change="handlePxChange">
<template #prefix>
<div style="display: flex; align-items: center; height: 100%">
<img src="../../assets/icons/desc-icon.svg" style="width: 14px; height: 14px" />
</div>
</template>
<el-option v-for="item in releaseTimeList" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
</div>
</div>
</div>
<div class="data-main-box-main-content" v-loading="loading" element-loading-text="数据加载中，请稍候...">
<el-table ref="tableRef" :data="tableData" row-key="id" @selection-change="handleSelectionChange"
@select="handleSelect" @select-all="handleSelectAll" style="width: 100%" :row-style="{ height: '52px' }">
<el-table-column type="selection" width="40" />
<el-table-column label="事件名称">
<template #default="scope">
<span class="title-item text-compact-bold" @click="handleClickToDetail(scope.row)">{{
scope.row.originalTitle
}}</span>
</template>
</el-table-column>
<el-table-column label="制裁时间" width="240" class-name="date-column">
<template #default="scope">{{ scope.row.date }}</template>
</el-table-column>
</el-table>
</div>
</div>
<div class="data-main-box-footer">
<el-pagination background layout="prev, pager, next" :total="totalNum" v-model:current-page="currentPage"
:page-size="pageSize" @current-change="handleCurrentChange" />
</div>
</div>
</div>
</template>
<script setup>
import { ref } from 'vue'
import { ref, computed, watch, onMounted, nextTick } from 'vue'
import ChartContainer from '../../components/ChartContainer/index.vue'
import ChartHeader from '../../components/ChartHeader/index.vue'
import ActiveTag from '../../components/ActiveTag/index.vue'
import HeaderBtnBox from '../../components/HeaderBtnBox/index.vue'
import LineChart from '../../components/LineChart/index.vue'
import PieChart from '../../components/PieChart/index.vue'
import BarChart from '../../components/BarChart/index.vue'
import RaderChart from '../../components/RadarChart/idnex.vue'
import SelectBox from '../../components/SelectBox/index.vue'
import DataChartSwitchBox from '../../components/dataChartSwitchBox/index.vue'
import { useRoute } from "vue-router";
import router from '@/router'
// 图表/数据
const isShowChart = ref(true)
import { search } from '@/api/comprehensiveSearch'
import { ElMessage } from 'element-plus'
import getDateRange from '@/utils/getDateRange'
const route = useRoute();
// 图表/数据
const isShowChart = ref(false)
// 点击切换数据/图表
const handleSwitchChartData = () => {
isShowChart.value = !isShowChart.value
if (isShowChart.value) {
const curDemensionItem = staticsDemensionList.value.filter(item => {
return item.name === curDemension.value
})[0]
// setTimeout(() => {
activeChart.value = curDemensionItem.chartTypeList[0]
if (curDemension.value === '制裁时间') {
if (selectedTime.value === '按月度统计') {
curChartData.value = curDemensionItem.data
} else if (selectedTime.value === '按季度统计') {
curChartData.value = curDemensionItem.quatarData
} else {
curChartData.value = curDemensionItem.yearData
}
} else {
curChartData.value = curDemensionItem.data
}
// })
}
}
// 总计数据
const totalNum = ref(12)
const totalNum = ref(0)
// 统计维度列表
const staticsDemensionList = ref([
{
name: '制裁时间',
active: true,
chartTypeList: ['折线图', '柱状图'],
chartTitle: '实体清单制裁时间变化趋势',
data: {
dataX: [],
dataY: []
},
quatarData: {
dataX: [],
dataY: []
},
yearData: {
dataX: [],
dataY: []
}
}
])
// 当前维度下的图表列表
const curChartTypeList = computed(() => {
let arr = staticsDemensionList.value.filter(item => item.active)
return arr[0].chartTypeList
})
// 当前图表标题
const curChartTitle = computed(() => {
let arr = staticsDemensionList.value.filter(item => item.active)
return arr[0].chartTitle
})
// 当前维度
const curDemension = ref('制裁时间')
// 点击维度item
const handleClickDemensionItem = (val) => {
activeChart.value = ''
staticsDemensionList.value.forEach(item => {
item.active = false
})
val.active = true
curDemension.value = val.name
setTimeout(() => {
activeChart.value = val.chartTypeList[0]
if (curDemension.value === '制裁时间' && selectedTime.value === '按年度统计') {
curChartData.value = val.yearData
} else if (curDemension.value === '制裁时间' && selectedTime.value === '按季度统计') {
curChartData.value = val.quatarData
} else {
curChartData.value = val.data
}
})
}
// 时间图表 当前选择时间
const selectedTime = ref('按年度统计')
// 时间图表-时间列表
const timeList = ref([
{
label: '按年度统计',
value: '按年度统计'
},
{
label: '按季度统计',
value: '按季度统计'
},
{
label: '按月度统计',
value: '按月度统计'
},
])
const handleChangeTime = value => {
let curChart = activeChart.value
activeChart.value = ''
if (value === '按月度统计') {
setTimeout(() => {
activeChart.value = curChart
curChartData.value = staticsDemensionList.value[0].data
})
} else if (value === '按季度统计') {
setTimeout(() => {
activeChart.value = curChart
curChartData.value = staticsDemensionList.value[0].quatarData
})
} else {
setTimeout(() => {
activeChart.value = curChart
curChartData.value = staticsDemensionList.value[0].yearData
})
}
}
// 激活的标签列表
const activeTagList = computed(() => {
const arr = []
if (selectedArea.value && selectedArea.value !== '全部领域') {
arr.push(
{
tag: '科技领域',
name: selectedArea.value
}
)
}
if (selectedDate.value === '自定义') {
arr.push(
{
tag: '制裁时间',
name: customTime.value.join('至')
}
)
}
if (isInvolveCnOnly.value) {
const involveStr = '涉华'
arr.push(
{
tag: '涉华',
name: involveStr
}
)
}
return arr
})
// 关闭当前标签
const handleCloseCurTag = (tag, index) => {
switch (tag.tag) {
case '科技领域':
selectedArea.value = '全部领域'
break
case '制裁时间':
selectedDate.value = ''
customTime.value = []
break
case '涉华':
isInvolveCnOnly.value = false
break
}
}
const activeChart = ref('') // 当前激活的图表
// 切换当前图表
const handleSwitchActiveChart = val => {
activeChart.value = val.name
}
// 雷达图数据
const radarChartData = ref({
title: [
{
name: '航空航天',
max: 10
},
{
name: '先进制造',
max: 10
},
{
name: '量子科技',
max: 10
},
{
name: '人工智能',
max: 10
},
{
name: '新材料',
max: 10
},
{
name: '集成电路',
max: 10
},
],
data: [
{
name: "337调查",
value: [10, 5, 2, 8, 5, 7
]
},
{
name: "232调查",
value: [2, 5, 3, 8, 10, 2]
},
{
name: "301调查",
value: [5, 8, 2, 9, 1, 5]
}
]
}
)
// 数据- 是否全选
const isSelectedAll = ref(false)
// 批量操作-当前操作
const curOperation = ref('')
const operationList = ref([
{
name: 'aaa',
id: 'aaa'
},
{
name: 'bbb',
id: 'bbb'
},
{
name: 'ccc',
id: 'ccc'
},
])
// 科技领域
const areaPlaceHolder = ref('请选择领域')
const selectedArea = ref('全部领域')
const areaList = ref([
{
name: '全部领域',
id: '全部领域'
},
{
name: '人工智能',
id: '人工智能'
},
{
name: '生物科技',
id: '生物科技'
},
{
name: '新一代通信网络',
id: '新一代通信网络'
},
{
name: '量子科技',
id: '量子科技'
},
{
name: '新能源',
id: '新能源'
},
{
name: '集成电路',
id: '集成电路'
},
{
name: '海洋',
id: '海洋'
},
{
name: '先进制造',
id: '先进制造'
},
{
name: '新材料',
id: '新材料'
},
{
name: '航空航天',
id: '航空航天'
},
{
name: '太空',
id: '太空'
},
{
name: '深海',
id: '深海'
},
{
name: '极地',
id: '极地'
},
{
name: '核',
id: '核'
},
{
name: '其他',
id: '其他'
},
])
const handleSelectArea = (value) => {
selectedArea.value = value
}
// 制裁时间
const DatePlaceHolder = ref('请选择时间')
const selectedDate = ref('')
const dateList = ref([
{
name: '自定义',
id: '自定义'
},
{
name: '近一年',
id: '近一年'
},
{
name: '近半年',
id: '近半年'
},
{
name: '近三月',
id: '近三月'
},
{
name: '近一月',
id: '近一月'
}
])
const customTime = ref([]) // 自定义时间
const handleCustomDate = value => {
customTime.value = value
}
const handleSelectDate = (value) => {
selectedDate.value = value
if (selectedDate.value !== '自定义') {
customTime.value = getDateRange(selectedDate.value)
}
}
// 是否只看涉华
const isInvolveCnOnly = ref(false)
// 清空条件
const handleClear = () => {
selectedArea.value = '全部领域'
selectedDate.value = ''
customTime.value = []
isInvolveCnOnly.value = false
ElMessage.success('已清空条件！')
}
// 确定
const handleConfirm = () => {
currentPage.value = 1
fetchTableData()
}
// 展开全部 / 收起
const isFolderAll = ref(false)
const handleSwitchFolderAll = () => {
isFolderAll.value = !isFolderAll.value
}
const tableRef = ref(null)
// 表格数据
const tableData = ref([
])
const releaseTimeList = ref([
{
label: "按发布时间倒序",
value: true
},
{
label: "按发布时间升序",
value: false
}
]);
const isSort = ref(true); // true 倒序 false 升序
const handlePxChange = val => {
fetchTableData()
};
const currentPage = ref(1);
const pageSize = ref(10)
// 存储选中的数据（跨页）[citation:3][citation:8]
const selectedMap = ref(new Map()) // 使用 Map 存储，key 为唯一 id
// 计算已选中的条数
const selectedCount = computed(() => selectedMap.value.size)
// 获取当前页表格数据（示例）
const fetchTableData = async () => {
// isSelectedAll.value = false
// selectedMap.value.clear()
loading.value = true
// 调用接口获取数据...
const params = {
page: currentPage.value,
size: pageSize.value,
// keyword: '',
type: 17, // 涉军企业清单事件
domains: selectedArea.value === '全部领域' ? null : [selectedArea.value], // 科技领域
proposedDateStart: customTime.value[0] ? customTime.value[0] : null,
proposedDateEnd: customTime.value[1] ? customTime.value[1] : null,
isInvolveCn: isInvolveCnOnly.value ? 'Y' : null, // 是否只看中国实体
sort: isSort.value ? 0 : 1 // 0 先按分数降序 后按时间降序 1 先按分数降序，再按时间升序
}
try {
const res = await search(params)
console.log('搜索结果', res);
if (res.code === 200 && res.data) {
tableData.value = res.data.records
totalNum.value = res.data.total
staticsDemensionList.value[0].data = {
dataX: Object.keys(res.data.aggregationsDate),
dataY: Object.values(res.data.aggregationsDate).map(value => Number(value))
}
staticsDemensionList.value[0].quatarData = {
dataX: Object.keys(res.data.aggregationsQuarter),
dataY: Object.values(res.data.aggregationsQuarter).map(value => Number(value))
}
staticsDemensionList.value[0].yearData = {
dataX: Object.keys(res.data.aggregationsYear),
dataY: Object.values(res.data.aggregationsYear).map(value => Number(value))
}
}
const curDemensionItem = staticsDemensionList.value.filter(item => {
return item.name === curDemension.value
})[0]
activeChart.value = ''
setTimeout(() => {
activeChart.value = curDemensionItem.chartTypeList[0]
if (curDemension.value === '制裁时间') {
if (selectedTime.value === '按月度统计') {
curChartData.value = curDemensionItem.data
} else if (selectedTime.value === '按季度统计') {
curChartData.value = curDemensionItem.quatarData
} else {
curChartData.value = curDemensionItem.yearData
}
} else {
curChartData.value = curDemensionItem.data
}
})
loading.value = false
} catch (error) {
loading.value = false
}
// tableData.value = res.data
// total.value = res.total
// 数据加载后，回显已选中的行
nextTick(() => {
tableData.value.forEach(row => {
if (selectedMap.value.has(row.id)) {
tableRef.value?.toggleRowSelection(row, true)
}
})
})
}
const allData = ref([])
// 获取筛选条件下全部表格数据
const fetchAllData = async () => {
const params = {
page: 1,
size: 9999,
type: 17, // 涉军企业清单事件
domains: selectedArea.value === '全部领域' ? null : [selectedArea.value], // 科技领域
proposedDateStart: customTime.value[0] ? customTime.value[0] : null,
proposedDateEnd: customTime.value[1] ? customTime.value[1] : null,
isInvolveCn: isInvolveCnOnly.value ? 'Y' : null, // 是否只看中国实体
sort: isSort.value ? 0 : 1 // 0 先按分数降序 后按时间降序 1 先按分数降序，再按时间升序
}
try {
const res = await search(params)
console.log('搜索结果', res);
if (res.code === 200 && res.data) {
allData.value = res.data.records
}
} catch (error) {
ElMessage.error('加载全部数据出错！')
}
}
// 单选事件
const handleSelect = (selection, row) => {
if (selection.some(item => item.id === row.id)) {
// 选中：添加到 Map
selectedMap.value.set(row.id, row)
} else {
// 取消选中：从 Map 移除
selectedMap.value.delete(row.id)
}
}
// 表格自带 当前页 全选/全不选事件
const handleSelectAll = (selection) => {
if (selection.length > 0) {
// 全选：将当前页所有数据添加到 Map
tableData.value.forEach(row => {
if (!selectedMap.value.has(row.id)) {
selectedMap.value.set(row.id, row)
}
})
} else {
// 全不选：从 Map 中移除当前页的所有数据
tableData.value.forEach(row => {
selectedMap.value.delete(row.id)
})
}
}
// 处理选择变化（用于统计）
const handleSelectionChange = (val) => {
// 这里可以做一些额外的处理，但主要统计使用 selectedMap
console.log('当前页选中数量:', val.length)
}
// 全选当前页按钮
const handleSelectAllPage = () => {
if (tableData.value.length === 0) return
// 检查当前页是否已全选
const currentPageSelected = tableData.value.every(row =>
selectedMap.value.has(row.id)
)
if (currentPageSelected) {
// 已全选，则不动当前页的全选
tableData.value.forEach(row => {
tableRef.value.toggleRowSelection(row, false)
// selectedMap.value.delete(row.id)
})
} else {
// 未全选，则全选当前页
tableData.value.forEach(row => {
tableRef.value.toggleRowSelection(row, true)
if (!selectedMap.value.has(row.id)) {
selectedMap.value.set(row.id, row)
}
})
}
}
// 全选最大1万条提示
const isShowAllDataMaxLengthTip = ref(false)
const loading = ref(false) // 加载数据loading
// 处理 全选(全部数据)
const handleSelectAllChange = async () => {
if (isSelectedAll.value) {
if (totalNum.value > 10000) {
isShowAllDataMaxLengthTip.value = true
}
loading.value = true
await fetchAllData()
handleSelectAllPage()
allData.value.forEach(row => {
if (!selectedMap.value.has(row.id)) {
selectedMap.value.set(row.id, row)
}
})
loading.value = false
} else {
handleClearAll()
}
}
// 清空所有选择
const handleClearAll = () => {
isSelectedAll.value = false
selectedMap.value.clear()
tableRef.value?.clearSelection()
}
// 翻页
const handleCurrentChange = async (val) => {
currentPage.value = val
await fetchTableData()
if (isSelectedAll.value) {
handleSelectAllPage()
}
}
// 监听数据变化，回显选中状态 [citation:4][citation:8]
watch(tableData, () => {
nextTick(() => {
tableData.value.forEach(row => {
if (selectedMap.value.has(row.id)) {
tableRef.value?.toggleRowSelection(row, true)
}
})
})
})
// 当前图表数据
const curChartData = ref(null)
// 下载当前图表数据
const handleDownloadCurChartData = () => {
const jsonStr = JSON.stringify(curChartData.value, null, 2);
const blob = new Blob([jsonStr], { type: 'application/json' });
const url = URL.createObjectURL(blob);
const link = document.createElement('a');
link.href = url;
link.download = 'chartData.json';
link.click();
URL.revokeObjectURL(url);
}
// 跳转到当前页 初始化筛选条件
const initParam = () => {
const hasQuery = Object.keys(route.query).length > 0;
if (hasQuery) {
selectedArea.value = route.query.domains ? route.query.domains : '全部领域'
if (route.query.selectedDate && Array.isArray(JSON.parse(route.query.selectedDate)) && JSON.parse(route.query.selectedDate).length) {
selectedDate.value = '自定义'
customTime.value = JSON.parse(route.query.selectedDate)
}
isInvolveCnOnly.value = route.query.isInvolveCnOnly ? true : false
const query = route.query;
if (Object.keys(query).length > 0) {
sessionStorage.setItem('mRListEventRouteQuery', JSON.stringify(query));
}
} else {
const savedQuery = JSON.parse(sessionStorage.getItem('mRListEventRouteQuery') || '{}');
selectedArea.value = savedQuery.domains ? savedQuery.domains : '全部领域'
if (savedQuery.selectedDate && Array.isArray(JSON.parse(savedQuery.selectedDate)) && JSON.parse(savedQuery.selectedDate).length) {
selectedDate.value = '自定义'
customTime.value = JSON.parse(savedQuery.selectedDate)
}
isInvolveCnOnly.value = savedQuery.isInvolveCnOnly ? true : false
}
}
// 跳转政令详情
const handleClickToDetail = (curDecree) => {
console.log('curDecree', curDecree);
window.sessionStorage.setItem("decreeId", curDecree.id);
window.sessionStorage.setItem("curTabName", curDecree.title);
const route = router.resolve({
path: "/decreeLayout",
query: {
id: curDecree.id
}
});
window.open(route.href, "_blank");
};
// 跳转机构详情
const handleOrgClick = item => {
console.log('item', item);
window.sessionStorage.setItem("curTabName", item.organizationName);
const route = router.resolve({
path: "/institution",
query: {
id: item.organizationId
}
});
window.open(route.href, "_blank");
};
// 导出
const handleExport = () => {
if (!selectedCount.value) {
ElMessage.warning('请选择至少一项数据！')
return
}
console.log(selectedMap.value);
const arr = Array.from(selectedMap.value);
const jsonStr = JSON.stringify(arr, null, 2);
const blob = new Blob([jsonStr], { type: 'application/json' });
const url = URL.createObjectURL(blob);
const link = document.createElement('a');
link.href = url;
link.download = 'export.json';
link.click();
URL.revokeObjectURL(url);
};
onMounted(async () => {
initParam()
// 初始化
await fetchTableData()
})
</script>
......@@ -35,6 +893,8 @@ const totalNum = ref(12)
.countrybill-wrapper {
width: 1600px;
height: 968px;
overflow: hidden;
overflow-y: auto;
.headere-box {
width: 1568px;
......@@ -44,31 +904,72 @@ const totalNum = ref(12)
border: 1px solid var(--bg-black-5);
margin: 16px auto;
}
.header-box {
width: 1568px;
height: 112px;
min-height: 112px;
border-radius: 10px;
background: rgb(255, 255, 255);
border: 1px solid var(--bg-black-5);
margin: 16px auto;
box-sizing: border-box;
padding: 16px 24px;
.header-top {
min-height: 28px;
display: flex;
flex-wrap: wrap;
gap: 12px 42px;
// transition: all ease 1s;
.check-box {
display: flex;
width: 348px;
height: 28px;
align-items: center;
gap: 8px;
.check-box-left {
width: 100px;
color: var(--text-primary-65-color);
}
}
}
.main-box {
.header-footer {
margin-top: 16px;
display: flex;
justify-content: space-between;
.header-footer-left {
display: flex;
justify-content: space-between;
gap: 8px;
}
}
}
.chart-main-box {
width: 1568px;
height: 809px;
margin: 0 auto;
background: rgba(255, 255, 255);
border: 1px solid var(--bg-black-5);
border-radius: 10px;
.info-box {
margin: 0 auto;
width: 1568px;
margin-top: 16px;
width: 1520px;
height: 30px;
display: flex;
justify-content: space-between;
.switch-box {
width: 160px;
border-radius: 20px;
border: 1px solid var(--color-primary-100);
height: 30px;
height: 28px;
border: none;
cursor: pointer;
img {
......@@ -85,12 +986,202 @@ const totalNum = ref(12)
.content-box {
margin: 0 auto;
margin-top: 16px;
width: 1520px;
height: 726px;
border: none;
.content-header {
margin: 16px 0;
width: 1520px;
height: 28px;
}
.content-main {
width: 1520px;
margin: 0 auto;
}
}
}
.data-main-box {
width: 1568px;
height: 766px;
min-height: 810px;
border-radius: 10px;
background: var(--bg-white-100);
margin: 0 auto;
margin-bottom: 20px;
overflow: hidden;
.data-main-box-header {
margin: 16px auto;
width: 1520px;
height: 30px;
display: flex;
justify-content: space-between;
.switch-box {
width: 160px;
height: 28px;
border: none;
cursor: pointer;
img {
width: 100%;
height: 100%;
}
}
.num-box {
box-sizing: border-box;
padding: 2px 0;
color: var(--color-red-100);
}
}
.data-main-box-main {
width: 1520px;
// height: 633px;
min-height: 680px;
border-radius: 10px;
background: rgba(255, 255, 255);
border: 1px solid var(--bg-black-5);
margin: 0 auto;
.data-main-box-main-header {
height: 48px;
background: var(--bg-black-2);
display: flex;
justify-content: space-between;
.header-left {
margin-left: 16px;
height: 48px;
display: flex;
gap: 16px;
align-items: center;
.header-left-item2 {
color: var(--color-primary-100);
display: flex;
gap: 8px;
}
.header-left-item3 {
color: var(--color-orange-100);
}
.cancel {
cursor: pointer;
}
}
.header-right {
margin-right: 16px;
display: flex;
gap: 8px;
align-items: center;
.header-right-item {
height: 30px;
padding: 5px 16px;
border: 1px solid var(--bg-black-10);
border-radius: 4px;
background: var(--bg-white-100);
cursor: pointer;
}
.item1 {
display: flex;
gap: 2px;
justify-content: center;
align-items: center;
&:hover {
background: var(--color-primary-2);
}
.icon {
width: 16px;
height: 16px;
img {
width: 100%;
height: 100%;
}
}
.text {
color: var(--text-primary-65-color);
}
}
.item2 {}
.item3 {}
}
}
.data-main-box-main-content {}
}
.data-main-box-footer {
margin: 16px auto 0;
height: 40px;
width: 1520px;
display: flex;
align-items: center;
justify-content: flex-end;
}
}
}
.date-column {
background-color: #ecf5ff;
.tag-box {
display: flex;
flex-wrap: wrap;
gap: 8px;
width: 490px;
}
}
.date-column .cell {
color: #409eff !important;
font-weight: 500;
}
.title-item {
color: var(--text-primary-80-color);
cursor: pointer;
&:hover {
color: var(--color-primary-100);
text-decoration: underline;
}
}
.person-item {
color: var(--color-primary-100);
cursor: pointer;
&:hover {
font-weight: bold;
text-decoration: underline;
}
}
:deep(.el-table__header-wrapper) {
// background-color: #f5f7fa;
height: 48px;
}
:deep(.el-table__header th) {
// background-color: #f5f7fa;
color: var(--text-primary-50-color);
font-weight: bold;
}
</style>
\ No newline at end of file
src/views/dataLibrary/financeControl/sDNList/index.vue
浏览文件 @ 2dc2aedd
......@@ -142,7 +142,7 @@
</el-table-column>
<el-table-column label="上市地点">
<template #default="scope">
<span class="person-item text-compact" @click="handleOrgClick(scope.row)">{{ scope.row.organizationName
<span class="person-item text-compact" >{{ scope.row.organizationName
}}</span>
</template>
</el-table-column>
......@@ -654,6 +654,7 @@ const handleSelectCountry = value => {
}
// 获取国家地区列表
const handleGetCountryList = async () => {
loading.value = true
try {
const res = await getCountryList()
console.log('获取国家列表', res);
......@@ -667,6 +668,8 @@ const handleGetCountryList = async () => {
}
} catch (error) {
} finally {
loading.value = false
}
}
......@@ -685,6 +688,7 @@ const handleSelectProvince = value => {
}
// 获取全部省份列表
const handleGetProvinceList = async () => {
loading.value = true
try {
const res = await getProvinceList()
console.log('获取省份列表', res);
......@@ -701,7 +705,7 @@ const handleGetProvinceList = async () => {
console.error(error);
} finally {
loading.value = false
}
}
......@@ -719,20 +723,23 @@ const handleSelectEntityType = value => {
}
// 获取实体类型列表
const handleGetEntityTypes = async () => {
loading.value = true
try {
const res = await getEntityTypes()
console.log('获取实体类型列表');
console.log('获取实体类型列表', res);
if (res.code === 200 && res.data) {
entityTypeList.value = res.data.map(item => {
return {
name: item.name,
id: item.code
id: item.id
}
})
}
} catch (error) {
} finally {
loading.value = false
}
}
......@@ -806,7 +813,7 @@ const fetchTableData = async () => {
page: currentPage.value,
size: pageSize.value,
// keyword: '',
type: 10, // 实体清单
type: 14, // SDN清单
domains: selectedArea.value === '全部领域' ? null : [selectedArea.value], // 科技领域
proposedDateStart: customTime.value[0] ? customTime.value[0] : null,
proposedDateEnd: customTime.value[1] ? customTime.value[1] : null,
......@@ -814,7 +821,6 @@ const fetchTableData = async () => {
provinceName: selectedProvince.value === '全部省份' ? null : selectedProvince.value, // 实体省份
entityTypeCode: selectedEntityType.value === '全部实体类型' ? null : selectedEntityType.value, // 实体类别
ratio: isHalfRule.value ? 'Y' : null, // 50%规则
// isInvolveCn: isCnEntityOnly.value ? 'Y' : null, // 是否只看中国实体
sort: isSort.value ? 0 : 1 // 0 先按分数降序 后按时间降序 1 先按分数降序，再按时间升序
}
try {
......@@ -897,7 +903,7 @@ const fetchAllData = async () => {
const params = {
page: 1,
size: 9999,
type: 10, // 实体清单
type: 14, // SDN清单
domains: selectedArea.value === '全部领域' ? null : [selectedArea.value], // 科技领域
proposedDateStart: customTime.value[0] ? customTime.value[0] : null,
proposedDateEnd: customTime.value[1] ? customTime.value[1] : null,
......@@ -905,7 +911,6 @@ const fetchAllData = async () => {
provinceName: selectedProvince.value === '全部省份' ? null : selectedProvince.value, // 实体省份
entityTypeCode: selectedEntityType.value === '全部实体类型' ? null : selectedEntityType.value, // 实体类别
ratio: isHalfRule.value ? 'Y' : null, // 50%规则
// isInvolveCn: isCnEntityOnly.value ? 'Y' : null, // 是否只看中国实体
sort: isSort.value ? 0 : 1 // 0 先按分数降序 后按时间降序 1 先按分数降序，再按时间升序
}
try {
......@@ -1079,10 +1084,10 @@ const initParam = () => {
const query = route.query;
if (Object.keys(query).length > 0) {
sessionStorage.setItem('entityRouteQuery', JSON.stringify(query));
sessionStorage.setItem('sDNListRouteQuery', JSON.stringify(query));
}
} else {
const savedQuery = JSON.parse(sessionStorage.getItem('entityRouteQuery') || '{}');
const savedQuery = JSON.parse(sessionStorage.getItem('sDNListRouteQuery') || '{}');
selectedArea.value = savedQuery.domains ? savedQuery.domains : '全部领域'
if (savedQuery.selectedDate && Array.isArray(JSON.parse(savedQuery.selectedDate)) && JSON.parse(savedQuery.selectedDate).length) {
selectedDate.value = '自定义'
......@@ -1116,32 +1121,30 @@ watch(
// 跳转机构详情
const handleClickToDetail = (curEntity) => {
console.log('curEntity', curEntity);
window.sessionStorage.setItem("decreeId", curEntity.id);
// console.log('curEntity', curEntity);
window.sessionStorage.setItem("curTabName", curEntity.title);
const route = router.resolve({
name: "companyPages",
params: {
id: curEntity.id
id: curEntity.organizationId
}
});
window.open(route.href, "_blank");
};
// 跳转机构详情
const handleOrgClick = item => {
console.log('item', item);
window.sessionStorage.setItem("curTabName", item.organizationName);
const route = router.resolve({
path: "/institution",
query: {
id: item.organizationId
}
});
window.open(route.href, "_blank");
};
// // 跳转机构详情
// const handleOrgClick = item => {
// console.log('item', item);
// window.sessionStorage.setItem("curTabName", item.organizationName);
// const route = router.resolve({
// path: "/institution",
// query: {
// id: item.organizationId
// }
// });
// window.open(route.href, "_blank");
// };
// 导出
const handleExport = () => {
......
src/views/dataLibrary/financeControl/sDNListEvent/index.vue
浏览文件 @ 2dc2aedd
<template>
<div class="countrybill-wrapper">
<div class="header-box">我是SDN清单事件</div>
<div class="main-box">
<div class="header-box">
<div class="header-top">
<SelectBox :placeholder-name="areaPlaceHolder" select-title="科技领域" :select-list="areaList"
:select-name="selectedArea" @update:select-text="handleSelectArea" />
<SelectBox :placeholder-name="DatePlaceHolder" select-title="制裁时间" :select-list="dateList"
:select-name="selectedDate" :custom-time="customTime" @update:select-text="handleSelectDate"
@update:custom-time="handleCustomDate" />
<div class="check-box">
<div class="check-box-left text-tip-1">
{{ '是否涉华：' }}
</div>
<div class="check-box-right">
<el-checkbox v-model="isInvolveCnOnly" class="involve-checkbox">
{{ '只看涉华' }}
</el-checkbox>
</div>
</div>
</div>
<div class="header-footer">
<div class="header-footer-left">
<ActiveTag v-for="tag, index in activeTagList" :key="index" :tagName="tag.name"
@close="handleCloseCurTag(tag, index)" />
</div>
<div class="header-footer-right">
<HeaderBtnBox :isShowAll="isFolderAll" :isShowAllBtn="false" @show-all="handleSwitchFolderAll"
@clear="handleClear" @confirm="handleConfirm" />
</div>
</div>
</div>
<div class="chart-main-box" v-if="isShowChart">
<div class="info-box">
<div class="switch-box" @click="handleSwitchChartData">
<img v-if="!isShowChart" src="@/views/dataLibrary/assets/icons/chart-active.svg" alt="">
<img v-else src="@/views/dataLibrary/assets/icons/data-active.svg" alt="">
<DataChartSwitchBox :is-show-data="!isShowChart" />
</div>
<div class="num-box text-title-3-bold">
{{ `共 ${totalNum} 条数据` }}
</div>
</div>
<div class="content-box">
<div class="content-header">
<ChartHeader :list="staticsDemensionList" @clickItem="handleClickDemensionItem">
<template #chart-header-right>
<el-select v-model="selectedTime" placeholder="选择时间" style="width: 150px" v-show="curDemension === '制裁时间'"
@change="handleChangeTime">
<el-option v-for="item in timeList" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
</template>
</ChartHeader>
</div>
<div class="content-main">
<ChartContainer :chartTitle="curChartTitle" :chartTypeList="curChartTypeList"
@clickChartItem="handleSwitchActiveChart" @download="handleDownloadCurChartData">
<template #chart-box>
<LineChart v-if="activeChart === '折线图'" :lineChartData="curChartData" />
<BarChart v-if="activeChart === '柱状图'" :barChartData="curChartData" />
<PieChart v-if="activeChart === '饼状图'" :pieChartData="curChartData" />
<RaderChart v-if="activeChart === '雷达图'" :radarChartData="curChartData" />
</template>
</ChartContainer>
</div>
</div>
</div>
<div class="data-main-box" v-else>
<div class="data-main-box-header">
<div class="switch-box" @click="handleSwitchChartData">
<DataChartSwitchBox :is-show-data="!isShowChart" />
</div>
<div class="num-box text-title-3-bold">
{{ `共 ${totalNum} 条数据` }}
</div>
</div>
<div class="content-box"></div>
<div class="data-main-box-main">
<div class="data-main-box-main-header">
<div class="header-left">
<div class="header-left-item1">
<el-checkbox v-model="isSelectedAll" label="全选" @change="handleSelectAllChange" size="large" />
</div>
<div class="header-left-item2 text-tip-1">{{ `已选择${selectedCount}项` }}</div>
<div class="header-left-item2 text-tip-1 cancel" @click="handleClearAll" v-show="selectedCount">{{ '取消' }}
<div class="header-left-item3 text-tip-1" v-if="isShowAllDataMaxLengthTip">{{ `(当前最大选择不能超过1万条！)` }}</div>
</div>
</div>
<div class="header-right">
<div class="header-right-item item1" @click="handleExport">
<div class="icon">
<img src="../../assets/icons/download.svg" alt="">
</div>
<div class="text text-tip-1">{{ '导出' }}</div>
</div>
<div class="header-right-item2 item2">
<el-select v-model="curOperation" placeholder="批量操作" style="width: 120px">
<el-option v-for="item in operationList" :key="item.id" :label="item.name" :value="item.id" />
</el-select>
</div>
<div class="header-right-item3 item3">
<el-select v-model="isSort" placeholder="制裁时间" style="width: 166px" @change="handlePxChange">
<template #prefix>
<div style="display: flex; align-items: center; height: 100%">
<img src="../../assets/icons/desc-icon.svg" style="width: 14px; height: 14px" />
</div>
</template>
<el-option v-for="item in releaseTimeList" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
</div>
</div>
</div>
<div class="data-main-box-main-content" v-loading="loading" element-loading-text="数据加载中，请稍候...">
<el-table ref="tableRef" :data="tableData" row-key="id" @selection-change="handleSelectionChange"
@select="handleSelect" @select-all="handleSelectAll" style="width: 100%" :row-style="{ height: '52px' }">
<el-table-column type="selection" width="40" />
<el-table-column label="事件名称">
<template #default="scope">
<span class="title-item text-compact-bold" @click="handleClickToDetail(scope.row)">{{
scope.row.originalTitle
}}</span>
</template>
</el-table-column>
<el-table-column label="制裁时间" width="240" class-name="date-column">
<template #default="scope">{{ scope.row.date }}</template>
</el-table-column>
</el-table>
</div>
</div>
<div class="data-main-box-footer">
<el-pagination background layout="prev, pager, next" :total="totalNum" v-model:current-page="currentPage"
:page-size="pageSize" @current-change="handleCurrentChange" />
</div>
</div>
</div>
</template>
<script setup>
import { ref } from 'vue'
import { ref, computed, watch, onMounted, nextTick } from 'vue'
import ChartContainer from '../../components/ChartContainer/index.vue'
import ChartHeader from '../../components/ChartHeader/index.vue'
import ActiveTag from '../../components/ActiveTag/index.vue'
import HeaderBtnBox from '../../components/HeaderBtnBox/index.vue'
import LineChart from '../../components/LineChart/index.vue'
import PieChart from '../../components/PieChart/index.vue'
import BarChart from '../../components/BarChart/index.vue'
import RaderChart from '../../components/RadarChart/idnex.vue'
import SelectBox from '../../components/SelectBox/index.vue'
import DataChartSwitchBox from '../../components/dataChartSwitchBox/index.vue'
// 图表/数据
const isShowChart = ref(true)
import { useRoute } from "vue-router";
import router from '@/router'
import { search } from '@/api/comprehensiveSearch'
import { ElMessage } from 'element-plus'
import getDateRange from '@/utils/getDateRange'
const route = useRoute();
// 图表/数据
const isShowChart = ref(false)
// 点击切换数据/图表
const handleSwitchChartData = () => {
isShowChart.value = !isShowChart.value
if (isShowChart.value) {
const curDemensionItem = staticsDemensionList.value.filter(item => {
return item.name === curDemension.value
})[0]
// setTimeout(() => {
activeChart.value = curDemensionItem.chartTypeList[0]
if (curDemension.value === '制裁时间') {
if (selectedTime.value === '按月度统计') {
curChartData.value = curDemensionItem.data
} else if (selectedTime.value === '按季度统计') {
curChartData.value = curDemensionItem.quatarData
} else {
curChartData.value = curDemensionItem.yearData
}
} else {
curChartData.value = curDemensionItem.data
}
// })
}
}
// 总计数据
const totalNum = ref(12)
const totalNum = ref(0)
// 统计维度列表
const staticsDemensionList = ref([
{
name: '制裁时间',
active: true,
chartTypeList: ['折线图', '柱状图'],
chartTitle: '实体清单制裁时间变化趋势',
data: {
dataX: [],
dataY: []
},
quatarData: {
dataX: [],
dataY: []
},
yearData: {
dataX: [],
dataY: []
}
}
])
// 当前维度下的图表列表
const curChartTypeList = computed(() => {
let arr = staticsDemensionList.value.filter(item => item.active)
return arr[0].chartTypeList
})
// 当前图表标题
const curChartTitle = computed(() => {
let arr = staticsDemensionList.value.filter(item => item.active)
return arr[0].chartTitle
})
// 当前维度
const curDemension = ref('制裁时间')
// 点击维度item
const handleClickDemensionItem = (val) => {
activeChart.value = ''
staticsDemensionList.value.forEach(item => {
item.active = false
})
val.active = true
curDemension.value = val.name
setTimeout(() => {
activeChart.value = val.chartTypeList[0]
if (curDemension.value === '制裁时间' && selectedTime.value === '按年度统计') {
curChartData.value = val.yearData
} else if (curDemension.value === '制裁时间' && selectedTime.value === '按季度统计') {
curChartData.value = val.quatarData
} else {
curChartData.value = val.data
}
})
}
// 时间图表 当前选择时间
const selectedTime = ref('按年度统计')
// 时间图表-时间列表
const timeList = ref([
{
label: '按年度统计',
value: '按年度统计'
},
{
label: '按季度统计',
value: '按季度统计'
},
{
label: '按月度统计',
value: '按月度统计'
},
])
const handleChangeTime = value => {
let curChart = activeChart.value
activeChart.value = ''
if (value === '按月度统计') {
setTimeout(() => {
activeChart.value = curChart
curChartData.value = staticsDemensionList.value[0].data
})
} else if (value === '按季度统计') {
setTimeout(() => {
activeChart.value = curChart
curChartData.value = staticsDemensionList.value[0].quatarData
})
} else {
setTimeout(() => {
activeChart.value = curChart
curChartData.value = staticsDemensionList.value[0].yearData
})
}
}
// 激活的标签列表
const activeTagList = computed(() => {
const arr = []
if (selectedArea.value && selectedArea.value !== '全部领域') {
arr.push(
{
tag: '科技领域',
name: selectedArea.value
}
)
}
if (selectedDate.value === '自定义') {
arr.push(
{
tag: '制裁时间',
name: customTime.value.join('至')
}
)
}
if (isInvolveCnOnly.value) {
const involveStr = '涉华'
arr.push(
{
tag: '涉华',
name: involveStr
}
)
}
return arr
})
// 关闭当前标签
const handleCloseCurTag = (tag, index) => {
switch (tag.tag) {
case '科技领域':
selectedArea.value = '全部领域'
break
case '制裁时间':
selectedDate.value = ''
customTime.value = []
break
case '涉华':
isInvolveCnOnly.value = false
break
}
}
const activeChart = ref('') // 当前激活的图表
// 切换当前图表
const handleSwitchActiveChart = val => {
activeChart.value = val.name
}
// 雷达图数据
const radarChartData = ref({
title: [
{
name: '航空航天',
max: 10
},
{
name: '先进制造',
max: 10
},
{
name: '量子科技',
max: 10
},
{
name: '人工智能',
max: 10
},
{
name: '新材料',
max: 10
},
{
name: '集成电路',
max: 10
},
],
data: [
{
name: "337调查",
value: [10, 5, 2, 8, 5, 7
]
},
{
name: "232调查",
value: [2, 5, 3, 8, 10, 2]
},
{
name: "301调查",
value: [5, 8, 2, 9, 1, 5]
}
]
}
)
// 数据- 是否全选
const isSelectedAll = ref(false)
// 批量操作-当前操作
const curOperation = ref('')
const operationList = ref([
{
name: 'aaa',
id: 'aaa'
},
{
name: 'bbb',
id: 'bbb'
},
{
name: 'ccc',
id: 'ccc'
},
])
// 科技领域
const areaPlaceHolder = ref('请选择领域')
const selectedArea = ref('全部领域')
const areaList = ref([
{
name: '全部领域',
id: '全部领域'
},
{
name: '人工智能',
id: '人工智能'
},
{
name: '生物科技',
id: '生物科技'
},
{
name: '新一代通信网络',
id: '新一代通信网络'
},
{
name: '量子科技',
id: '量子科技'
},
{
name: '新能源',
id: '新能源'
},
{
name: '集成电路',
id: '集成电路'
},
{
name: '海洋',
id: '海洋'
},
{
name: '先进制造',
id: '先进制造'
},
{
name: '新材料',
id: '新材料'
},
{
name: '航空航天',
id: '航空航天'
},
{
name: '太空',
id: '太空'
},
{
name: '深海',
id: '深海'
},
{
name: '极地',
id: '极地'
},
{
name: '核',
id: '核'
},
{
name: '其他',
id: '其他'
},
])
const handleSelectArea = (value) => {
selectedArea.value = value
}
// 制裁时间
const DatePlaceHolder = ref('请选择时间')
const selectedDate = ref('')
const dateList = ref([
{
name: '自定义',
id: '自定义'
},
{
name: '近一年',
id: '近一年'
},
{
name: '近半年',
id: '近半年'
},
{
name: '近三月',
id: '近三月'
},
{
name: '近一月',
id: '近一月'
}
])
const customTime = ref([]) // 自定义时间
const handleCustomDate = value => {
customTime.value = value
}
const handleSelectDate = (value) => {
selectedDate.value = value
if (selectedDate.value !== '自定义') {
customTime.value = getDateRange(selectedDate.value)
}
}
// 是否只看涉华
const isInvolveCnOnly = ref(false)
// 清空条件
const handleClear = () => {
selectedArea.value = '全部领域'
selectedDate.value = ''
customTime.value = []
isInvolveCnOnly.value = false
ElMessage.success('已清空条件！')
}
// 确定
const handleConfirm = () => {
currentPage.value = 1
fetchTableData()
}
// 展开全部 / 收起
const isFolderAll = ref(false)
const handleSwitchFolderAll = () => {
isFolderAll.value = !isFolderAll.value
}
const tableRef = ref(null)
// 表格数据
const tableData = ref([
])
const releaseTimeList = ref([
{
label: "按发布时间倒序",
value: true
},
{
label: "按发布时间升序",
value: false
}
]);
const isSort = ref(true); // true 倒序 false 升序
const handlePxChange = val => {
fetchTableData()
};
const currentPage = ref(1);
const pageSize = ref(10)
// 存储选中的数据（跨页）[citation:3][citation:8]
const selectedMap = ref(new Map()) // 使用 Map 存储，key 为唯一 id
// 计算已选中的条数
const selectedCount = computed(() => selectedMap.value.size)
// 获取当前页表格数据（示例）
const fetchTableData = async () => {
// isSelectedAll.value = false
// selectedMap.value.clear()
loading.value = true
// 调用接口获取数据...
const params = {
page: currentPage.value,
size: pageSize.value,
// keyword: '',
type: 16, // SDN清单事件
domains: selectedArea.value === '全部领域' ? null : [selectedArea.value], // 科技领域
proposedDateStart: customTime.value[0] ? customTime.value[0] : null,
proposedDateEnd: customTime.value[1] ? customTime.value[1] : null,
isInvolveCn: isInvolveCnOnly.value ? 'Y' : null, // 是否只看中国实体
sort: isSort.value ? 0 : 1 // 0 先按分数降序 后按时间降序 1 先按分数降序，再按时间升序
}
try {
const res = await search(params)
console.log('搜索结果', res);
if (res.code === 200 && res.data) {
tableData.value = res.data.records
totalNum.value = res.data.total
staticsDemensionList.value[0].data = {
dataX: Object.keys(res.data.aggregationsDate),
dataY: Object.values(res.data.aggregationsDate).map(value => Number(value))
}
staticsDemensionList.value[0].quatarData = {
dataX: Object.keys(res.data.aggregationsQuarter),
dataY: Object.values(res.data.aggregationsQuarter).map(value => Number(value))
}
staticsDemensionList.value[0].yearData = {
dataX: Object.keys(res.data.aggregationsYear),
dataY: Object.values(res.data.aggregationsYear).map(value => Number(value))
}
}
const curDemensionItem = staticsDemensionList.value.filter(item => {
return item.name === curDemension.value
})[0]
activeChart.value = ''
setTimeout(() => {
activeChart.value = curDemensionItem.chartTypeList[0]
if (curDemension.value === '制裁时间') {
if (selectedTime.value === '按月度统计') {
curChartData.value = curDemensionItem.data
} else if (selectedTime.value === '按季度统计') {
curChartData.value = curDemensionItem.quatarData
} else {
curChartData.value = curDemensionItem.yearData
}
} else {
curChartData.value = curDemensionItem.data
}
})
loading.value = false
} catch (error) {
loading.value = false
}
// tableData.value = res.data
// total.value = res.total
// 数据加载后，回显已选中的行
nextTick(() => {
tableData.value.forEach(row => {
if (selectedMap.value.has(row.id)) {
tableRef.value?.toggleRowSelection(row, true)
}
})
})
}
const allData = ref([])
// 获取筛选条件下全部表格数据
const fetchAllData = async () => {
const params = {
page: 1,
size: 9999,
type: 12, // 实体清单事件
domains: selectedArea.value === '全部领域' ? null : [selectedArea.value], // 科技领域
proposedDateStart: customTime.value[0] ? customTime.value[0] : null,
proposedDateEnd: customTime.value[1] ? customTime.value[1] : null,
isInvolveCn: isInvolveCnOnly.value ? 'Y' : null, // 是否只看中国实体
sort: isSort.value ? 0 : 1 // 0 先按分数降序 后按时间降序 1 先按分数降序，再按时间升序
}
try {
const res = await search(params)
console.log('搜索结果', res);
if (res.code === 200 && res.data) {
allData.value = res.data.records
}
} catch (error) {
ElMessage.error('加载全部数据出错！')
}
}
// 单选事件
const handleSelect = (selection, row) => {
if (selection.some(item => item.id === row.id)) {
// 选中：添加到 Map
selectedMap.value.set(row.id, row)
} else {
// 取消选中：从 Map 移除
selectedMap.value.delete(row.id)
}
}
// 表格自带 当前页 全选/全不选事件
const handleSelectAll = (selection) => {
if (selection.length > 0) {
// 全选：将当前页所有数据添加到 Map
tableData.value.forEach(row => {
if (!selectedMap.value.has(row.id)) {
selectedMap.value.set(row.id, row)
}
})
} else {
// 全不选：从 Map 中移除当前页的所有数据
tableData.value.forEach(row => {
selectedMap.value.delete(row.id)
})
}
}
// 处理选择变化（用于统计）
const handleSelectionChange = (val) => {
// 这里可以做一些额外的处理，但主要统计使用 selectedMap
console.log('当前页选中数量:', val.length)
}
// 全选当前页按钮
const handleSelectAllPage = () => {
if (tableData.value.length === 0) return
// 检查当前页是否已全选
const currentPageSelected = tableData.value.every(row =>
selectedMap.value.has(row.id)
)
if (currentPageSelected) {
// 已全选，则不动当前页的全选
tableData.value.forEach(row => {
tableRef.value.toggleRowSelection(row, false)
// selectedMap.value.delete(row.id)
})
} else {
// 未全选，则全选当前页
tableData.value.forEach(row => {
tableRef.value.toggleRowSelection(row, true)
if (!selectedMap.value.has(row.id)) {
selectedMap.value.set(row.id, row)
}
})
}
}
// 全选最大1万条提示
const isShowAllDataMaxLengthTip = ref(false)
const loading = ref(false) // 加载数据loading
// 处理 全选(全部数据)
const handleSelectAllChange = async () => {
if (isSelectedAll.value) {
if (totalNum.value > 10000) {
isShowAllDataMaxLengthTip.value = true
}
loading.value = true
await fetchAllData()
handleSelectAllPage()
allData.value.forEach(row => {
if (!selectedMap.value.has(row.id)) {
selectedMap.value.set(row.id, row)
}
})
loading.value = false
} else {
handleClearAll()
}
}
// 清空所有选择
const handleClearAll = () => {
isSelectedAll.value = false
selectedMap.value.clear()
tableRef.value?.clearSelection()
}
// 翻页
const handleCurrentChange = async (val) => {
currentPage.value = val
await fetchTableData()
if (isSelectedAll.value) {
handleSelectAllPage()
}
}
// 监听数据变化，回显选中状态 [citation:4][citation:8]
watch(tableData, () => {
nextTick(() => {
tableData.value.forEach(row => {
if (selectedMap.value.has(row.id)) {
tableRef.value?.toggleRowSelection(row, true)
}
})
})
})
// 当前图表数据
const curChartData = ref(null)
// 下载当前图表数据
const handleDownloadCurChartData = () => {
const jsonStr = JSON.stringify(curChartData.value, null, 2);
const blob = new Blob([jsonStr], { type: 'application/json' });
const url = URL.createObjectURL(blob);
const link = document.createElement('a');
link.href = url;
link.download = 'chartData.json';
link.click();
URL.revokeObjectURL(url);
}
// 跳转到当前页 初始化筛选条件
const initParam = () => {
const hasQuery = Object.keys(route.query).length > 0;
if (hasQuery) {
selectedArea.value = route.query.domains ? route.query.domains : '全部领域'
if (route.query.selectedDate && Array.isArray(JSON.parse(route.query.selectedDate)) && JSON.parse(route.query.selectedDate).length) {
selectedDate.value = '自定义'
customTime.value = JSON.parse(route.query.selectedDate)
}
isInvolveCnOnly.value = route.query.isInvolveCnOnly ? true : false
const query = route.query;
if (Object.keys(query).length > 0) {
sessionStorage.setItem('sDNListEventRouteQuery', JSON.stringify(query));
}
} else {
const savedQuery = JSON.parse(sessionStorage.getItem('sDNListEventRouteQuery') || '{}');
selectedArea.value = savedQuery.domains ? savedQuery.domains : '全部领域'
if (savedQuery.selectedDate && Array.isArray(JSON.parse(savedQuery.selectedDate)) && JSON.parse(savedQuery.selectedDate).length) {
selectedDate.value = '自定义'
customTime.value = JSON.parse(savedQuery.selectedDate)
}
isInvolveCnOnly.value = savedQuery.isInvolveCnOnly ? true : false
}
}
// 跳转单次清单事件详情
const handleClickToDetail = (curEntityEvent) => {
console.log('curEntityEvent', curEntityEvent);
// window.sessionStorage.setItem("decreeId", curEntityEvent.id);
// window.sessionStorage.setItem("curTabName", curEntityEvent.title);
// let id = item?.id;
// let sanTypeId = item?.sanTypeId || 1;
// if (!id) {
// const currentItem = entitiesDataInfoList.value[currentCarouselIndex.value];
// id = currentItem?.id;
// sanTypeId = currentItem?.sanTypeId || 1;
// }
// window.sessionStorage.setItem(
// "curTabName",
// entitiesDataInfoList.value[currentCarouselIndex.value].postDate + " 《实体清单新增条目》"
// );
// let date = entitiesDataInfoList.value[currentCarouselIndex.value].postDate
// const routeData = router.resolve({
// path: "/exportControl/singleSanction",
// query: {
// id,
// sanTypeId,
// date
// }
// });
// // 打开一个新页面
// window.open(routeData.href, "_blank");
};
// 跳转机构详情
const handleOrgClick = item => {
console.log('item', item);
window.sessionStorage.setItem("curTabName", item.organizationName);
const route = router.resolve({
path: "/institution",
query: {
id: item.organizationId
}
});
window.open(route.href, "_blank");
};
// 导出
const handleExport = () => {
if (!selectedCount.value) {
ElMessage.warning('请选择至少一项数据！')
return
}
console.log(selectedMap.value);
const arr = Array.from(selectedMap.value);
const jsonStr = JSON.stringify(arr, null, 2);
const blob = new Blob([jsonStr], { type: 'application/json' });
const url = URL.createObjectURL(blob);
const link = document.createElement('a');
link.href = url;
link.download = 'export.json';
link.click();
URL.revokeObjectURL(url);
};
onMounted(async () => {
initParam()
// 初始化
await fetchTableData()
})
</script>
......@@ -35,6 +910,8 @@ const totalNum = ref(12)
.countrybill-wrapper {
width: 1600px;
height: 968px;
overflow: hidden;
overflow-y: auto;
.headere-box {
width: 1568px;
......@@ -44,31 +921,72 @@ const totalNum = ref(12)
border: 1px solid var(--bg-black-5);
margin: 16px auto;
}
.header-box {
width: 1568px;
height: 112px;
min-height: 112px;
border-radius: 10px;
background: rgb(255, 255, 255);
border: 1px solid var(--bg-black-5);
margin: 16px auto;
box-sizing: border-box;
padding: 16px 24px;
.header-top {
min-height: 28px;
display: flex;
flex-wrap: wrap;
gap: 12px 42px;
// transition: all ease 1s;
.check-box {
display: flex;
width: 348px;
height: 28px;
align-items: center;
gap: 8px;
.check-box-left {
width: 100px;
color: var(--text-primary-65-color);
}
}
}
.main-box {
.header-footer {
margin-top: 16px;
display: flex;
justify-content: space-between;
.header-footer-left {
display: flex;
justify-content: space-between;
gap: 8px;
}
}
}
.chart-main-box {
width: 1568px;
height: 809px;
margin: 0 auto;
background: rgba(255, 255, 255);
border: 1px solid var(--bg-black-5);
border-radius: 10px;
.info-box {
margin: 0 auto;
width: 1568px;
margin-top: 16px;
width: 1520px;
height: 30px;
display: flex;
justify-content: space-between;
.switch-box {
width: 160px;
border-radius: 20px;
border: 1px solid var(--color-primary-100);
height: 30px;
height: 28px;
border: none;
cursor: pointer;
img {
......@@ -85,12 +1003,202 @@ const totalNum = ref(12)
.content-box {
margin: 0 auto;
margin-top: 16px;
width: 1520px;
height: 726px;
border: none;
.content-header {
margin: 16px 0;
width: 1520px;
height: 28px;
}
.content-main {
width: 1520px;
margin: 0 auto;
}
}
}
.data-main-box {
width: 1568px;
height: 766px;
min-height: 810px;
border-radius: 10px;
background: var(--bg-white-100);
margin: 0 auto;
margin-bottom: 20px;
overflow: hidden;
.data-main-box-header {
margin: 16px auto;
width: 1520px;
height: 30px;
display: flex;
justify-content: space-between;
.switch-box {
width: 160px;
height: 28px;
border: none;
cursor: pointer;
img {
width: 100%;
height: 100%;
}
}
.num-box {
box-sizing: border-box;
padding: 2px 0;
color: var(--color-red-100);
}
}
.data-main-box-main {
width: 1520px;
// height: 633px;
min-height: 680px;
border-radius: 10px;
background: rgba(255, 255, 255);
border: 1px solid var(--bg-black-5);
margin: 0 auto;
.data-main-box-main-header {
height: 48px;
background: var(--bg-black-2);
display: flex;
justify-content: space-between;
.header-left {
margin-left: 16px;
height: 48px;
display: flex;
gap: 16px;
align-items: center;
.header-left-item2 {
color: var(--color-primary-100);
display: flex;
gap: 8px;
}
.header-left-item3 {
color: var(--color-orange-100);
}
.cancel {
cursor: pointer;
}
}
.header-right {
margin-right: 16px;
display: flex;
gap: 8px;
align-items: center;
.header-right-item {
height: 30px;
padding: 5px 16px;
border: 1px solid var(--bg-black-10);
border-radius: 4px;
background: var(--bg-white-100);
cursor: pointer;
}
.item1 {
display: flex;
gap: 2px;
justify-content: center;
align-items: center;
&:hover {
background: var(--color-primary-2);
}
.icon {
width: 16px;
height: 16px;
img {
width: 100%;
height: 100%;
}
}
.text {
color: var(--text-primary-65-color);
}
}
.item2 {}
.item3 {}
}
}
.data-main-box-main-content {}
}
.data-main-box-footer {
margin: 16px auto 0;
height: 40px;
width: 1520px;
display: flex;
align-items: center;
justify-content: flex-end;
}
}
}
.date-column {
background-color: #ecf5ff;
.tag-box {
display: flex;
flex-wrap: wrap;
gap: 8px;
width: 490px;
}
}
.date-column .cell {
color: #409eff !important;
font-weight: 500;
}
.title-item {
color: var(--text-primary-80-color);
cursor: pointer;
&:hover {
color: var(--color-primary-100);
text-decoration: underline;
}
}
.person-item {
color: var(--color-primary-100);
cursor: pointer;
&:hover {
font-weight: bold;
text-decoration: underline;
}
}
:deep(.el-table__header-wrapper) {
// background-color: #f5f7fa;
height: 48px;
}
:deep(.el-table__header th) {
// background-color: #f5f7fa;
color: var(--text-primary-50-color);
font-weight: bold;
}
</style>
\ No newline at end of file
src/views/dataLibrary/institution/index.vue
浏览文件 @ 2dc2aedd
......@@ -111,13 +111,13 @@
</template>
</el-table-column>
<el-table-column label="所属国家地区" width="240">
<template #default="scope">{{ scope.row.date }}</template>
<template #default="scope">{{ scope.row.countryName }}</template>
</el-table-column>
<el-table-column label="主官名称" width="180">
<template #default="scope">{{ scope.row.date }}</template>
<template #default="scope">{{ scope.row.sponsorPersonName }}</template>
</el-table-column>
<el-table-column label="最新动态">
<template #default="scope">{{ scope.row.typeStr }}</template>
<template #default="scope">{{ scope.row.dynamics }}</template>
</el-table-column>
</el-table>
</div>
......@@ -441,6 +441,7 @@ const handleSelectCountry = value => {
}
// 获取国家地区列表
const handleGetCountryList = async () => {
loading.value = true
try {
const res = await getCountryList()
console.log('获取国家列表', res);
......@@ -454,6 +455,8 @@ const handleGetCountryList = async () => {
}
} catch (error) {
} finally {
loading.value = false
}
}
......@@ -772,10 +775,10 @@ const initParam = () => {
const query = route.query;
if (Object.keys(query).length > 0) {
sessionStorage.setItem('entityRouteQuery', JSON.stringify(query));
sessionStorage.setItem('dataInstitutionRouteQuery', JSON.stringify(query));
}
} else {
const savedQuery = JSON.parse(sessionStorage.getItem('entityRouteQuery') || '{}');
const savedQuery = JSON.parse(sessionStorage.getItem('dataInstitutionRouteQuery') || '{}');
if (savedQuery.selectedDate && Array.isArray(JSON.parse(savedQuery.selectedDate)) && JSON.parse(savedQuery.selectedDate).length) {
selectedDate.value = '自定义'
customTime.value = JSON.parse(savedQuery.selectedDate)
......
src/views/dataLibrary/news/index.vue
浏览文件 @ 2dc2aedd
......@@ -115,7 +115,7 @@
<el-table-column label="发布时间" width="100" class-name="date-column">
<template #default="scope">{{ scope.row.date }}</template>
</el-table-column>
<el-table-column label="发布时间" class-name="date-column">
<el-table-column label="简介" class-name="date-column">
<template #default="scope">{{ scope.row.originalDescription }}</template>
</el-table-column>
<el-table-column label="来源媒体" width="90">
......@@ -789,10 +789,10 @@ const initParam = () => {
const query = route.query;
if (Object.keys(query).length > 0) {
sessionStorage.setItem('decreeRouteQuery', JSON.stringify(query));
sessionStorage.setItem('dataNewsRouteQuery', JSON.stringify(query));
}
} else {
const savedQuery = JSON.parse(sessionStorage.getItem('decreeRouteQuery') || '{}');
const savedQuery = JSON.parse(sessionStorage.getItem('dataNewsRouteQuery') || '{}');
selectedArea.value = savedQuery.domains ? savedQuery.domains : '全部领域'
if (savedQuery.selectedDate && Array.isArray(JSON.parse(savedQuery.selectedDate)) && JSON.parse(savedQuery.selectedDate).length) {
selectedDate.value = '自定义'
......
src/views/dataLibrary/technologyFigures/index.vue
浏览文件 @ 2dc2aedd
......@@ -410,6 +410,7 @@ const handlePersonType = (value) => {
}
// 获取人物类别
const handleGetPersonType = async () => {
loading.value = true
try {
const res = await getPersonType()
console.log('人物类别', res);
......@@ -432,6 +433,8 @@ const handleGetPersonType = async () => {
} catch (error) {
console.error(error);
} finally {
loading.value = false
}
}
......@@ -451,6 +454,7 @@ const handleSelectNationality = (value) => {
}
// 获取国籍列表
const handleGetCountryList = async () => {
loading.value = true
try {
const res = await getCountryList()
console.log('国籍列表', res);
......@@ -474,6 +478,8 @@ const handleGetCountryList = async () => {
} catch (error) {
console.error(error);
} finally {
loading.value = false
}
}
......@@ -492,6 +498,7 @@ const handleSelectIns = value => {
}
// 获取所属机构列表
const handleGetInsList = async () => {
loading.value = true
const params = {
type: 6
}
......@@ -518,6 +525,8 @@ const handleGetInsList = async () => {
} catch (error) {
console.error(error);
} finally {
loading.value = false
}
}
......@@ -849,10 +858,10 @@ const initParam = () => {
const query = route.query;
if (Object.keys(query).length > 0) {
sessionStorage.setItem('decreeRouteQuery', JSON.stringify(query));
sessionStorage.setItem('technologyFiguresRouteQuery', JSON.stringify(query));
}
} else {
const savedQuery = JSON.parse(sessionStorage.getItem('decreeRouteQuery') || '{}');
const savedQuery = JSON.parse(sessionStorage.getItem('technologyFiguresRouteQuery') || '{}');
selectedPersonType.value = savedQuery.domains ? savedQuery.domains : '全部人物类别'
......
src/views/dataLibrary/thinkTank/index.vue
浏览文件 @ 2dc2aedd
......@@ -571,6 +571,7 @@ const handleSelectThinkTank = value => {
};
const handleGetThinkTankList = async () => {
loading.value = true
const params = {
type: 4
}
......@@ -584,7 +585,11 @@ const handleGetThinkTankList = async () => {
};
});
thinkTankList.value = [...thinkTankList.value, ...arr];
} catch (error) { }
} catch (error) {
} finally {
loading.value = false
}
};
// 作者
......
src/views/decree/decreeHome/index.vue
浏览文件 @ 2dc2aedd
......@@ -1137,7 +1137,6 @@ const keyOrganizationCards = computed(() => {
const handleToDataLibrary = (item) => {
const selectParam = {
orgnizationName: item.orgName,
isInvolveCn: true
}
const route = router.resolve({
path: "/dataLibrary/dataDecree",
......
src/views/exportControl/utils/charts.js
浏览文件 @ 2dc2aedd
......@@ -547,7 +547,7 @@ export const getLineChart = (object, isPercent) => {
text: ""
},
tooltip: {
trigger: "axis",
trigger: "item",
formatter: function (params) {
let result = params[0].name + "<br/>";
params.forEach(function (item, index) {
......@@ -827,7 +827,7 @@ export const getMultipleLineChart = obj => {
text: ""
},
tooltip: {
trigger: "axis",
trigger: "item",
formatter: function (params) {
let result = params[0].name + "<br/>";
params.forEach(function (item, index) {
......
src/views/exportControl/v2.0EntityList/components/dataStatistics/index.vue
浏览文件 @ 2dc2aedd
......@@ -109,7 +109,7 @@
:option="sanctionCountChartOption"
autoresize
:style="{ height: '300px', padding: '0 20px' }"
@chart-click="handleBarChartClick"
@chart-click="handleToDataLibrary4"
/>
<!-- <div class="bottom">
<div class="ai">
......@@ -148,7 +148,7 @@
class="rank-item"
v-for="(item, index) in rankData"
:key="index"
@click="handleClickRankChart(item)"
@click="handleToDataLibrary5(item)"
>
<div class="rank-index" :class="'rank-' + (index + 1)">{{ index + 1 }}</div>
<div class="rank-name">{{ item.name }}</div>
......@@ -200,7 +200,7 @@
:option="domainChartOption"
autoresize
:style="{ height: '300px', padding: '0 20px' }"
@chart-click="handlePieChartClick"
@chart-click="handleToDataLibrary6"
/>
<!-- <div class="bottom">
<div class="ai">
......@@ -237,7 +237,7 @@
:option="typeChartOption"
autoresize
:style="{ height: '300px', padding: '0 20px' }"
@chart-click="handlePieChartClick1"
@chart-click="handleToDataLibrary7"
/>
<!-- <div class="bottom">
<div class="ai">
......@@ -1138,7 +1138,7 @@ const initTypeChart = () => {
const sanTypeId = ref("");
// 点击制裁实体数量变化情况
const handleBarChartClick = val => {
const handleToDataLibrary4 = val => {
console.log("value", val);
const params = {
selectedDate:
......@@ -1154,7 +1154,7 @@ const handleBarChartClick = val => {
};
// 制裁实体各省分布情况
const handleClickRankChart = item => {
const handleToDataLibrary5 = item => {
// console.log('item', item);
const params = {
selectedProvince: item.name,
......@@ -1169,7 +1169,7 @@ const handleClickRankChart = item => {
};
// 制裁实体领域分布情况
const handlePieChartClick = val => {
const handleToDataLibrary6 = val => {
console.log("val", val);
const params = {
domains: val.name,
......@@ -1184,7 +1184,7 @@ const handlePieChartClick = val => {
};
// 制裁实体类型分布情况
const handlePieChartClick1 = val => {
const handleToDataLibrary7 = val => {
console.log("val", val);
const params = {
selectedEntityType: val.name,
......
src/views/exportControl/v2.0EntityList/components/sanctionsOverview/components/introductionPage/index.vue
浏览文件 @ 2dc2aedd
......@@ -99,7 +99,7 @@
<div v-for="tag in item.techDomainList" :key="tag" class="tag-item">{{ tag }}</div>
</div>
<div :class="{ 'count-tag': item.cnEntityCount }" @click="handleToDataLibrary">
<div :class="{ 'count-tag': item.cnEntityCount }" @click="handleToDataLibrary(item)">
{{ item.cnEntityCount ? `${item.cnEntityCount}家中国实体` : "" }}
</div>
</div>
......@@ -401,18 +401,22 @@ const getEntityInfoFn = async id => {
const sanTypeId = ref("");
// 跳转到数据资源库
const handleToDataLibrary = () => {
const handleToDataLibrary = (item) => {
console.log('item', item);
let domainStr = domainOptions.filter(item => item.value === selectedDomain.value)[0].label
let params
if (domainStr === '全部领域') {
params = {
isCnEntityOnly: true,
selectedDate: JSON.stringify([item.postDate, item.postDate])
}
} else {
params = {
isCnEntityOnly: true,
domains: domainStr
domains: domainStr,
selectedDate: JSON.stringify([item.postDate, item.postDate])
};
}
const route = router.resolve({
......@@ -611,6 +615,10 @@ onMounted(() => {
color: rgb(206, 79, 81);
border-radius: 20px;
background-color: rgba(206, 79, 81, 0.1);
cursor: pointer;
&:hover{
text-decoration: underline;
}
}
}
}
......
src/views/exportControl/v2.0SingleSanction/components/dataStatistics/index.vue
浏览文件 @ 2dc2aedd
......@@ -55,7 +55,7 @@
</div>
</div> -->
<EChart :option="domainChartOption" autoresize :style="{ height: '300px', padding: '0 20px' }"
@chart-click="handlePieChartClick" />
@chart-click="handleToDataLibrary3" />
<div class="data-origin-box">
<div class="data-origin-icon">
<img :src="tipsIcon" alt="" />
......@@ -106,7 +106,7 @@
</div>
</div> -->
<EChart :option="typeChartOption" autoresize :style="{ height: '300px', padding: '0 20px' }"
@chart-click="handlePieChartClick1" />
@chart-click="handleToDataLibrary4" />
<div class="data-origin-box">
<div class="data-origin-icon">
<img :src="tipsIcon" alt="" />
......@@ -123,7 +123,7 @@
<AnalysisBox title="制裁实体国家地区分布情况">
<div class="country-list">
<div class="list-item" v-for="(item, index) in countryDistribution" :key="index"
@click="handleClickRankChart(item)">
@click="handleToDataLibrary5(item)">
<img :src="flag" alt="" class="flag" />
<div class="country-name">{{ item.name }}</div>
<div class="progress-bar-container">
......@@ -164,7 +164,7 @@
<div class="map-chart" ref="mapChartRef"></div>
<div class="rank-list">
<div class="rank-item" v-for="(item, index) in regionDistribution" :key="index"
@click="handleRankChartClick(item)">
@click="handleToDataLibrary6(item)">
<div class="rank-index" :class="'rank-' + (index + 1)">{{ index + 1 }}</div>
<div class="rank-name">{{ item.name }}</div>
<div class="rank-bar-bg">
......@@ -855,10 +855,11 @@ const initTypeChart = () => {
const sanTypeId = ref("");
// 制裁实体领域分布情况
const handlePieChartClick = (val) => {
const handleToDataLibrary3 = (val) => {
// console.log('val', val);
const params = {
domains: val.name,
isCnEntityOnly: true,
selectedDate: JSON.stringify([route.query.date, route.query.date])
}
const curRoute = router.resolve({
......@@ -869,10 +870,11 @@ const handlePieChartClick = (val) => {
}
// 制裁实体类型分布情况
const handlePieChartClick1 = (val) => {
const handleToDataLibrary4 = (val) => {
// console.log('val', val);
const params = {
selectedEntityType: val.name,
isCnEntityOnly: true,
selectedDate: JSON.stringify([route.query.date, route.query.date])
}
const curRoute = router.resolve({
......@@ -883,9 +885,10 @@ const handlePieChartClick1 = (val) => {
}
// 制裁实体国家地区分布情况
const handleClickRankChart = (item) => {
const handleToDataLibrary5 = (item) => {
const params = {
selectedCountryId: item.id,
isCnEntityOnly: true,
selectedDate: JSON.stringify([route.query.date, route.query.date])
}
const curRoute = router.resolve({
......@@ -896,10 +899,11 @@ const handleClickRankChart = (item) => {
}
// 制裁实体各省分布情况
const handleRankChartClick = (item) => {
const handleToDataLibrary6 = (item) => {
console.log('item', item);
const params = {
selectedProvince: item.name,
isCnEntityOnly: true,
selectedDate: JSON.stringify([route.query.date, route.query.date])
}
const curRoute = router.resolve({
......@@ -940,6 +944,7 @@ const handleToDataLibrary2 = () => {
const curRoute = router.resolve({
path: "/dataLibrary/dataEntityList",
query: {
isCnEntityOnly: true,
selectedDate: JSON.stringify([dateStr, dateStr])
}
});
......
src/views/finance/entityList/components/dataStatistics/index.vue
浏览文件 @ 2dc2aedd
<template>
<div class="data-statistics">
<div class="nav">
<div class="nav-item">
<div class="nav-item" @click="handleToDataLibrary">
<div class="item-position"></div>
<div class="content">
<div class="info">
......@@ -13,7 +13,7 @@
</div>
</div>
</div>
<div class="nav-item">
<div class="nav-item" @click="handleToDataLibrary1">
<div class="item-position"></div>
<div class="content">
<div class="info">
......@@ -26,7 +26,7 @@
</div>
</div>
</div>
<div class="nav-item">
<div class="nav-item" @click="handleToDataLibrary2">
<div class="item-position"></div>
<div class="content">
<div class="info">
......@@ -38,7 +38,7 @@
</div>
</div>
</div>
<div class="nav-item">
<div class="nav-item" @click="handleToDataLibrary3(totalCount.latestTime)">
<div class="item-position"></div>
<div class="content">
<div class="info">
......@@ -104,7 +104,7 @@
</div>
</div>
</template>
<EChart :option="sanctionCountChartOption" autoresize :style="{ height: '300px', padding: '0 20px' }" />
<EChart :option="sanctionCountChartOption" autoresize :style="{ height: '300px', padding: '0 20px' }" @chart-click="handleToDataLibrary4" />
<div class="data-origin-box">
<div class="data-origin-icon">
......@@ -165,7 +165,7 @@
<el-option v-for="item in timeOptions" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
</template>
<EChart :option="domainChartOption" autoresize :style="{ height: '300px', padding: '0 20px' }" />
<EChart :option="domainChartOption" autoresize :style="{ height: '300px', padding: '0 20px' }" @chart-click="handleToDataLibrary6" />
<div class="data-origin-box">
<div class="data-origin-icon">
......@@ -190,23 +190,16 @@
</template> -->
<template #header-btn>
<div class="toggle-btns">
<div
class="t-btn"
:class="{ active: activeDomainTab === 'year' }"
@click="handleDomainTabChange('year')"
>
<div class="t-btn" :class="{ active: activeDomainTab === 'year' }" @click="handleDomainTabChange('year')">
按年度
</div>
<div
class="t-btn"
:class="{ active: activeDomainTab === 'sanction' }"
@click="handleDomainTabChange('sanction')"
>
<div class="t-btn" :class="{ active: activeDomainTab === 'sanction' }"
@click="handleDomainTabChange('sanction')">
按制裁
</div>
</div>
</template>
<EChart :option="domainNumChartOption" autoresize :style="{ height: '300px', padding: '0 20px' }" />
<EChart :option="domainNumChartOption" autoresize :style="{ height: '300px', padding: '0 20px' }" @chart-click="handleToDataLibrary5" />
<div class="data-origin-box">
<div class="data-origin-icon">
......@@ -230,7 +223,7 @@
</el-select>
</template>
<!-- <div class="echarts" ref="typeChartRef"></div> -->
<EChart :option="typeChartOption" autoresize :style="{ height: '300px', padding: '0 20px' }" />
<EChart :option="typeChartOption" autoresize :style="{ height: '300px', padding: '0 20px' }" @chart-click="handleToDataLibrary7" />
<!-- <div class="bottom">
<div class="ai">
<div class="left">
......@@ -277,6 +270,7 @@ import { getDomainNum } from "@/api/finance";
import getMultiLineChart from "@/views/ZMOverView/components/fourSuppress/components/addDomain/multiLineChart";
import EChart from "@/components/Chart/index.vue";
import { useRoute } from "vue-router";
import { useRouter } from "vue-router";
import tipsIcon from "../../../assets/icons/info-icon.png";
import AiButton from "@/components/base/Ai/AiButton/index.vue";
import AiPane from "@/components/base/Ai/AiPane/index.vue";
......@@ -287,6 +281,7 @@ const domainNumChart = useChartInterpretation();
const typeChart = useChartInterpretation();
const rankChart = useChartInterpretation();
const router = useRouter()
const route = useRoute();
// 实体清单-数据统计-制裁实体类型分布情况
const typeData = ref([]);
......@@ -387,7 +382,8 @@ const getRegionCountData = async () => {
const domainNumChartOption = ref({
color: [],
tooltip: {
trigger: "axis",
show: true,
trigger: "item",
backgroundColor: "rgba(255, 255, 255, 0.9)",
textStyle: {
color: "#666"
......@@ -1269,6 +1265,115 @@ const initTypeChart = () => {
};
const sanTypeId = ref("");
// 跳转到数据资源库
const handleToDataLibrary = () => {
const route = router.resolve({
path: "/dataLibrary/sDNList",
query: {
isCnEntityOnly: true
}
});
window.open(route.href, "_blank");
}
const handleToDataLibrary1 = () => {
const route = router.resolve({
path: "/dataLibrary/sDNList",
query: {
isCnEntityOnly: true,
isHalfRule: true
}
});
window.open(route.href, "_blank");
}
const handleToDataLibrary2 = () => {
const route = router.resolve({
path: "/dataLibrary/sDNList",
query: {
selectedDate: JSON.stringify([currentYear + '01-01', currentYear + '12-31'])
}
});
window.open(route.href, "_blank");
}
const handleToDataLibrary3 = (time) => {
const route = router.resolve({
path: "/dataLibrary/sDNList",
query: {
selectedDate: JSON.stringify([time, time])
}
});
window.open(route.href, "_blank");
}
// 点击制裁实体数量变化情况
const handleToDataLibrary4 = val => {
console.log("value", val);
const params = {
isCnEntityOnly: true,
selectedDate:
activeTab.value === "year"
? JSON.stringify([val.name + "-01-01", val.name + "-12-31"])
: JSON.stringify([val.name, val.name])
};
const route = router.resolve({
path: "/dataLibrary/sDNList",
query: params,
});
window.open(route.href, "_blank");
};
// 制裁实体各省分布情况
const handleToDataLibrary5 = item => {
console.log('item', item);
const params = {
domains: item.seriesName,
isCnEntityOnly: true,
selectedDate:
JSON.stringify([item.name + "-01-01", item.name + "-12-31"])
};
const route = router.resolve({
path: "/dataLibrary/sDNList",
query: params
});
window.open(route.href, "_blank");
};
// 制裁实体领域分布情况
const handleToDataLibrary6 = val => {
console.log("val", val);
const params = {
domains: val.name,
isCnEntityOnly: true,
selectedDate:
domainTime.value === "all" ? null : JSON.stringify([domainTime.value + "-01-01", domainTime.value + "-12-31"])
};
const route = router.resolve({
path: "/dataLibrary/dataEntityList",
query: params
});
window.open(route.href, "_blank");
};
// 制裁实体类型分布情况
const handleToDataLibrary7 = val => {
console.log("val", val);
const params = {
isCnEntityOnly: true,
selectedEntityType: val.name,
selectedDate: typeTime.value === "all" ? null : JSON.stringify([typeTime.value + "-01-01", typeTime.value + "-12-31"])
};
const route = router.resolve({
path: "/dataLibrary/dataEntityList",
query: params
});
window.open(route.href, "_blank");
}
onMounted(() => {
sanTypeId.value = route.query.sanTypeId || "";
console.log("数据统计页面接收到的 sanTypeId:", sanTypeId.value);
......@@ -1311,6 +1416,11 @@ onMounted(() => {
background-color: #fff;
box-shadow: 0px 0px 20px 0px rgba(25, 69, 130, 0.1);
position: relative;
cursor: pointer;
&:hover {
background: var(--color-primary-2);
}
.item-position {
position: absolute;
......@@ -1702,16 +1812,19 @@ onMounted(() => {
align-items: center;
justify-content: flex-start;
padding: 22px;
.data-origin-icon {
width: 16px;
height: 16px;
font-size: 0px;
margin-right: 8px;
img {
width: 100%;
height: 100%;
}
}
.data-origin-text {
font-family: Source Han Sans CN;
font-size: 14px;
......@@ -1724,18 +1837,23 @@ onMounted(() => {
right: 0px;
bottom: 15px;
z-index: 2;
:deep(.ai-pane-wrapper) {
display: none;
}
:deep(.ai-button-wrapper) {
display: flex;
}
&:hover {
width: 100%;
bottom: 0px;
:deep(.ai-pane-wrapper) {
display: block;
}
:deep(.ai-button-wrapper) {
display: none;
}
......
src/views/finance/entityList/components/deepMining/components/constrainedAssociation.vue
浏览文件 @ 2dc2aedd
......@@ -706,7 +706,8 @@ const handleClickSan = item => {
path: "/finance/singleSanction",
query: {
id: item.id,
sanTypeId: item.sanTypeId
sanTypeId: item.sanTypeId,
date: item.postDate
}
});
window.open(route.href, "_blank");
......
src/views/finance/entityList/components/sanctionsOverview/components/introductionPage/index.vue
浏览文件 @ 2dc2aedd
......@@ -75,17 +75,9 @@
<AnalysisBox title="实体清单更新历史" :showAllBtn="false">
<template #header-btn>
<div class="filters">
<el-select
v-model="selectedDomain"
placeholder="Select"
style="width: 150px; height: 32px; margin-right: 16px"
>
<el-option
v-for="item in domainOptions"
:key="item.value"
:label="item.label"
:value="item.value"
/>
<el-select v-model="selectedDomain" placeholder="Select"
style="width: 150px; height: 32px; margin-right: 16px">
<el-option v-for="item in domainOptions" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
<el-checkbox v-model="onlyChina">只看涉华动态</el-checkbox>
</div>
......@@ -99,20 +91,15 @@
<img :src="item.icon || title" alt="" />
<div class="main">
<div class="main-title" @click="handleClick(item)">{{ item.name }}</div>
<el-tooltip
effect="dark"
:content="item.summary"
popper-class="common-prompt-popper"
placement="top"
:show-after="500"
>
<el-tooltip effect="dark" :content="item.summary" popper-class="common-prompt-popper" placement="top"
:show-after="500">
<div class="main-desc">{{ item.summary }}</div>
</el-tooltip>
<div class="tag-box">
<div v-for="tag in item.techDomainList" :key="tag" class="tag-item">{{ tag }}</div>
</div>
<div :class="{ 'count-tag': item.cnEntityCount }">
<div :class="{ 'count-tag': item.cnEntityCount }" @click="handleToDataLibrary(item)">
{{ item.cnEntityCount ? `${item.cnEntityCount}家中国实体` : "" }}
</div>
</div>
......@@ -120,14 +107,8 @@
</div>
<div class="left-footer">
<div class="total-count">共 {{ totalAll }} 项</div>
<el-pagination
v-model:current-page="currentPageAll"
:page-size="pageSizeAll"
:total="totalAll"
layout="prev, pager, next"
background
@current-change="handlePageChangeAll"
/>
<el-pagination v-model:current-page="currentPageAll" :page-size="pageSizeAll" :total="totalAll"
layout="prev, pager, next" background @current-change="handlePageChangeAll" />
</div>
</AnalysisBox>
</div>
......@@ -149,12 +130,8 @@
<span>关键人物</span>
</div>
<div class="key-person-list">
<div
class="person-item"
v-for="(item, index) in publishInfo.personList"
:key="index"
@click="handlePerClick(item)"
>
<div class="person-item" v-for="(item, index) in publishInfo.personList" :key="index"
@click="handlePerClick(item)">
<img :src="item.imageUrl" alt="" />
<div class="person-info">
<CommonPrompt :content="item.name">
......@@ -242,7 +219,8 @@ const handleClick = item => {
path: "/finance/singleSanction",
query: {
id: item.id,
sanTypeId: item.sanTypeId || 1
sanTypeId: item.sanTypeId || 1,
date: `${item.year}-${item.date}`
}
});
window.open(route.href, "_blank");
......@@ -421,6 +399,34 @@ const getEntityInfoFn = async id => {
};
const sanTypeId = ref("");
// 跳转到数据资源库
const handleToDataLibrary = (item) => {
// console.log('item', item);
let domainStr = domainOptions.filter(item => item.value === selectedDomain.value)[0].label
let params
if (domainStr === '全部领域') {
params = {
isCnEntityOnly: true,
selectedDate: JSON.stringify([item.postDate, item.postDate])
}
} else {
params = {
isCnEntityOnly: true,
domains: domainStr,
selectedDate: JSON.stringify([item.postDate, item.postDate])
};
}
const route = router.resolve({
path: "/dataLibrary/sDNList",
query: params
});
window.open(route.href, "_blank");
}
onMounted(() => {
sanTypeId.value = route.query.sanTypeId;
// 获取实体清单基本信息
......@@ -609,6 +615,11 @@ onMounted(() => {
color: rgb(206, 79, 81);
border-radius: 20px;
background-color: rgba(206, 79, 81, 0.1);
cursor: pointer;
&:hover {
text-decoration: underline;
}
}
}
}
......
src/views/finance/entityList/components/sanctionsOverview/components/listPage/index.vue
浏览文件 @ 2dc2aedd
......@@ -131,10 +131,10 @@
<div class="stats">
<div class="dot"></div>
<div class="count-text">
共 <span class="highlight">{{ ruleCount.totalCount }}</span> 家
共 <span class="highlight" @click="handlToDataLibrary">{{ ruleCount.totalCount }}</span> 家
</div>
<div class="rule-text">
(50%规则涉及<span class="highlight">{{ ruleCount.ruleCount }}</span
(50%规则涉及<span class="highlight" @click="handlToDataLibrary1">{{ ruleCount.ruleCount }}</span
>家)
</div>
</div>
......@@ -526,6 +526,30 @@ watch(customDateRange, () => {
getExportControlListApi();
}
});
// 跳转到数据资源库
const handlToDataLibrary = () => {
const params = {
isCnEntityOnly: true,
};
const route = router.resolve({
path: "/dataLibrary/sDNList",
query: params
});
window.open(route.href, "_blank");
}
const handlToDataLibrary1 = () => {
const params = {
isCnEntityOnly: true,
isHalfRule: true,
};
const route = router.resolve({
path: "/dataLibrary/sDNList",
query: params
});
window.open(route.href, "_blank");
}
</script>
<style scoped lang="scss">
......@@ -996,6 +1020,11 @@ watch(customDateRange, () => {
.highlight {
color: #cd4246;
margin: 0 4px;
cursor: pointer;
&:hover {
text-decoration: underline;
}
}
}
......@@ -1006,6 +1035,11 @@ watch(customDateRange, () => {
.highlight {
color: #cd4246;
cursor: pointer;
&:hover {
text-decoration: underline;
}
}
}
}
......
src/views/finance/index.vue
浏览文件 @ 2dc2aedd
......@@ -744,7 +744,8 @@ const handleTitleClick = item => {
path: "/finance/singleSanction",
query: {
id: item.id,
sanTypeId: item.sanTypeId
sanTypeId: item.sanTypeId,
date: `${item.year}-${item.dateStr}`
}
});
window.open(route.href, "_blank");
......@@ -934,6 +935,7 @@ const handleToEntityList = item => {
console.log("这是什么数据1 =>", item);
let id = item?.id;
let sanTypeId = item?.sanTypeId || 1;
let date = entitiesDataInfoList.value[currentCarouselIndex.value].postDate
if (!id) {
const currentItem = entitiesDataInfoList.value[currentCarouselIndex.value];
id = currentItem?.id;
......@@ -947,7 +949,8 @@ const handleToEntityList = item => {
path: "/finance/singleSanction",
query: {
id,
sanTypeId
sanTypeId,
date
}
});
// 打开一个新页面
......@@ -1541,7 +1544,8 @@ const handleSanc = item => {
path: "/finance/singleSanction",
query: {
id: item.id,
sanTypeId: activeResourceTabItem.value.id.join(",")
sanTypeId: activeResourceTabItem.value.id.join(","),
date: item.postDate
}
});
window.open(route.href, "_blank");
......@@ -1865,6 +1869,7 @@ const handleMediaClick = item => {
padding-right: 50px;
box-sizing: border-box;
background: linear-gradient(to right, rgba(206, 79, 81, 0), rgba(206, 79, 81, 0.3));
cursor: pointer;
&-des {
display: flex;
......
src/views/finance/singleSanction/components/dataStatistics/index.vue
浏览文件 @ 2dc2aedd
<template>
<div class="data-statistics">
<div class="nav">
<div class="nav-item">
<div class="nav-item" @click="handleToDataLibrary">
<div class="item-position"></div>
<div class="content">
<div class="info">
......@@ -13,7 +13,7 @@
</div>
</div>
</div>
<div class="nav-item">
<div class="nav-item" @click="handleToDataLibrary1">
<div class="item-position"></div>
<div class="content">
<div class="info">
......@@ -26,7 +26,7 @@
</div>
</div>
</div>
<div class="nav-item">
<div class="nav-item" @click="handleToDataLibrary2">
<div class="item-position"></div>
<div class="content">
<div class="info">
......@@ -54,7 +54,7 @@
</div>
</div>
</div> -->
<EChart :option="domainChartOption" autoresize :style="{ height: '300px', padding: '0 20px' }" />
<EChart :option="domainChartOption" autoresize :style="{ height: '300px', padding: '0 20px' }" @chart-click="handleToDataLibrary3" />
<div class="data-origin-box">
<div class="data-origin-icon">
<img :src="tipsIcon" alt="" />
......@@ -106,7 +106,7 @@
</div>
</div>
</div> -->
<EChart :option="typeChartOption" autoresize :style="{ height: '300px', padding: '0 20px' }" />
<EChart :option="typeChartOption" autoresize :style="{ height: '300px', padding: '0 20px' }" @chart-click="handleToDataLibrary4" />
<div class="data-origin-box">
<div class="data-origin-icon">
<img :src="tipsIcon" alt="" />
......@@ -124,17 +124,14 @@
<div class="main-item">
<AnalysisBox title="制裁实体国家地区分布情况">
<div class="country-list">
<div class="list-item" v-for="(item, index) in countryDistribution" :key="index">
<div class="list-item" v-for="(item, index) in countryDistribution" :key="index" @click="handleToDataLibrary5(item)">
<img :src="flag" alt="" class="flag" />
<div class="country-name">{{ item.name }}</div>
<div class="progress-bar-container">
<div
class="progress-bar"
:style="{
<div class="progress-bar" :style="{
width: item.width,
background: item.gradient
}"
></div>
}"></div>
</div>
<div class="count" :class="{ highlight: index === 0 }">{{ item.count }}家</div>
</div>
......@@ -169,17 +166,14 @@
<div class="map-wrapper">
<div class="map-chart" ref="mapChartRef"></div>
<div class="rank-list">
<div class="rank-item" v-for="(item, index) in regionDistribution" :key="index">
<div class="rank-item" v-for="(item, index) in regionDistribution" :key="index" @click="handleToDataLibrary6(item)">
<div class="rank-index" :class="'rank-' + (index + 1)">{{ index + 1 }}</div>
<div class="rank-name">{{ item.name }}</div>
<div class="rank-bar-bg">
<div
class="rank-bar-fill"
:style="{
<div class="rank-bar-fill" :style="{
width: (maxRegionCount > 0 ? (item.count / maxRegionCount) * 100 : 0) + '%',
background: getBarColor(index)
}"
></div>
}"></div>
</div>
<div class="rank-value">{{ item.count }}家</div>
</div>
......@@ -829,6 +823,104 @@ const initTypeChart = () => {
// });
};
const sanTypeId = ref("");
// 跳转到数据资源库
const handleToDataLibrary = () => {
const dateStr = route.query.date ? route.query.date : ''
const curRoute = router.resolve({
path: "/dataLibrary/sDNList",
query: {
isCnEntityOnly: true,
selectedDate: JSON.stringify([dateStr, dateStr])
}
});
window.open(curRoute.href, "_blank");
}
const handleToDataLibrary1 = () => {
const dateStr = route.query.date ? route.query.date : ''
const curRoute = router.resolve({
path: "/dataLibrary/sDNList",
query: {
isCnEntityOnly: true,
isHalfRule: true,
selectedDate: JSON.stringify([dateStr, dateStr])
}
});
window.open(curRoute.href, "_blank");
}
const handleToDataLibrary2 = () => {
const dateStr = route.query.date ? route.query.date : ''
const curRoute = router.resolve({
path: "/dataLibrary/sDNList",
query: {
selectedDate: JSON.stringify([dateStr, dateStr]),
isCnEntityOnly: true,
}
});
window.open(curRoute.href, "_blank");
}
// 制裁实体领域分布情况
const handleToDataLibrary3 = (val) => {
// console.log('val', val);
const params = {
domains: val.name,
isCnEntityOnly: true,
selectedDate: JSON.stringify([route.query.date, route.query.date])
}
const curRoute = router.resolve({
path: '/dataLibrary/sDNList',
query: params
});
window.open(curRoute.href, "_blank");
}
// 制裁实体类型分布情况
const handleToDataLibrary4 = (val) => {
// console.log('val', val);
const params = {
selectedEntityType: val.name,
isCnEntityOnly: true,
selectedDate: JSON.stringify([route.query.date, route.query.date])
}
const curRoute = router.resolve({
path: '/dataLibrary/sDNList',
query: params
});
window.open(curRoute.href, "_blank");
}
// 制裁实体国家地区分布情况
const handleToDataLibrary5 = (item) => {
const params = {
selectedCountryId: item.id,
isCnEntityOnly: true,
selectedDate: JSON.stringify([route.query.date, route.query.date])
}
const curRoute = router.resolve({
path: '/dataLibrary/sDNList',
query: params
});
window.open(curRoute.href, "_blank");
}
// 制裁实体各省分布情况
const handleToDataLibrary6 = (item) => {
console.log('item', item);
const params = {
selectedProvince: item.name,
isCnEntityOnly: true,
selectedDate: JSON.stringify([route.query.date, route.query.date])
}
const curRoute = router.resolve({
path: '/dataLibrary/sDNList',
query: params
});
window.open(curRoute.href, "_blank");
}
onMounted(() => {
// 获取路由参数id
sanTypeId.value = route.query.sanTypeId;
......@@ -872,6 +964,11 @@ onMounted(() => {
background-color: #fff;
box-shadow: 0px 0px 20px 0px rgba(25, 69, 130, 0.1);
position: relative;
cursor: pointer;
&:hover {
background: var(--color-primary-2);
}
.item-position {
position: absolute;
......@@ -1267,22 +1364,26 @@ onMounted(() => {
}
}
}
.data-origin-box {
width: 100%;
display: flex;
align-items: center;
justify-content: flex-start;
padding: 22px;
.data-origin-icon {
width: 16px;
height: 16px;
font-size: 0px;
margin-right: 8px;
img {
width: 100%;
height: 100%;
}
}
.data-origin-text {
font-family: Source Han Sans CN;
font-size: 14px;
......@@ -1295,18 +1396,23 @@ onMounted(() => {
right: 0px;
bottom: 15px;
z-index: 2;
:deep(.ai-pane-wrapper) {
display: none;
}
:deep(.ai-button-wrapper) {
display: flex;
}
&:hover {
width: 100%;
bottom: 0px;
:deep(.ai-pane-wrapper) {
display: block;
}
:deep(.ai-button-wrapper) {
display: none;
}
......
src/views/finance/singleSanction/components/sanctionsOverview/index.vue
浏览文件 @ 2dc2aedd
......@@ -46,17 +46,15 @@
<div class="left-top-content">
<div class="content-title">制裁实体分布：</div>
<div class="distribution-list">
<div class="list-item" v-for="(item, index) in entityDistribution" :key="index">
<div class="list-item" v-for="(item, index) in entityDistribution" :key="index"
@click="handleToDataLibrary(item)">
<img :src="item.imageUrl || flag" alt="" class="flag" />
<div class="country-name">{{ item.name }}</div>
<div class="progress-bar-container">
<div
class="progress-bar"
:style="{
<div class="progress-bar" :style="{
width: item.width,
background: item.gradient
}"
></div>
}"></div>
</div>
<div class="count" :class="{ highlight: index === 0 }">{{ item.count }}家</div>
</div>
......@@ -99,25 +97,13 @@
</div>
<div class="filter-right">
<el-checkbox v-model="onlyChina" label="只看中国实体" />
<el-select
v-model="filterField"
placeholder="全部领域"
style="width: 150px; margin: 0 12px 0 16px"
>
<el-select v-model="filterField" placeholder="全部领域" style="width: 150px; margin: 0 12px 0 16px">
<el-option label="全部领域" value="" />
<el-option
v-for="item in domainOptions"
:key="item.value"
:label="item.label"
:value="item.value"
/>
<el-option v-for="item in domainOptions" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
<el-input
v-model="searchKeyword"
placeholder="搜索实体"
<el-input v-model="searchKeyword" placeholder="搜索实体"
style="width: 150px; border: 1px solid rgba(170, 173, 177, 0.4); border-radius: 5px"
:suffix-icon="Search"
/>
:suffix-icon="Search" />
</div>
</div>
<div class="stats-row">
......@@ -132,21 +118,14 @@
<div class="stats-info">
<div class="stat-item">
<span class="dot red"></span>
<span class="text"
>新增 <span class="num red">{{ addCount }}</span> 家 (50%规则涉及<span class="num red">{{
<span class="text">新增 <span class="num red">{{ addCount }}</span> 家 (50%规则涉及<span class="num red">{{
addRuleCount
}}</span
>家)</span
>
}}</span>家)</span>
</div>
<div class="stat-item">
<span class="dot green"></span>
<span class="text"
>移除 <span class="num green">{{ removeCount }}</span> 家 (50%规则涉及<span
class="num green"
>{{ removeRuleCount }}</span
>家)</span
>
<span class="text">移除 <span class="num green">{{ removeCount }}</span> 家 (50%规则涉及<span
class="num green">{{ removeRuleCount }}</span>家)</span>
</div>
</div>
</div>
......@@ -178,11 +157,7 @@
>{{ item }}</span
> -->
<div class="domain-box">
<AreaTag
v-for="(domain, index) in scope.row.fields"
:key="index"
:tagName="domain"
/>
<AreaTag v-for="(domain, index) in scope.row.fields" :key="index" :tagName="domain" />
</div>
</template>
</el-table-column>
......@@ -191,26 +166,20 @@
<el-table-column prop="entityTypeId" label="类型" width="120" align="center">
<template #default="scope">
<div style="display: flex; gap: 4px; justify-content: center">
<AreaTag
:tagName="
scope.row.entityType === 1
<AreaTag :tagName="scope.row.entityType === 1
? '个人'
: scope.row.entityType === 2
? '实体'
: '公司'
"
/>
" />
</div>
</template>
</el-table-column>
<!-- <el-table-column prop="revenue" label="营收(亿元)" width="110" align="center" /> -->
<el-table-column label="50%规则子企业" width="180" align="center">
<template #default="scope">
<span
v-if="scope.row.subsidiaryCount"
class="subsidiary-link"
@click="handleSubsidiaryClick(scope.row)"
>
<span v-if="scope.row.subsidiaryCount" class="subsidiary-link"
@click="handleSubsidiaryClick(scope.row)">
{{ scope.row.subsidiaryText }}
<span class="blue-text">{{ scope.row.subsidiaryCount }}家 ></span>
</span>
......@@ -254,12 +223,8 @@
</div>
</div>
<!-- 50%规则子企业弹框 -->
<RuleSubsidiaryDialog
v-model="subsidiaryDialogVisible"
:company-name="currentSubsidiaryCompanyName"
:total-count="currentSubsidiaryCount"
:data-list="currentSubsidiaryList"
/>
<RuleSubsidiaryDialog v-model="subsidiaryDialogVisible" :company-name="currentSubsidiaryCompanyName"
:total-count="currentSubsidiaryCount" :data-list="currentSubsidiaryList" />
</div>
</template>
......@@ -623,6 +588,24 @@ const getReasonHistoryList = async () => {
};
const sanTypeId = ref("");
// 跳转到数据资源库
const handleToDataLibrary = (item) => {
console.log('item', item);
const dateStr = formattedData.value.postDate.replace(/(\d{4})年(\d{1,2})月(\d{1,2})日/, (_, y, m, d) =>
`${y}-${m.padStart(2, '0')}-${d.padStart(2, '0')}`
);
const route = router.resolve({
path: "/dataLibrary/sDNList",
query: {
selectedDate: JSON.stringify([dateStr, dateStr]),
selectedCountryId: item.id
}
});
window.open(route.href, "_blank");
}
onMounted(() => {
// 获取路由参数中的sanTypeId
console.log("route.query.sanTypeId --:", route.query.sanTypeId);
......@@ -768,6 +751,11 @@ onMounted(() => {
display: flex;
align-items: center;
height: 24px;
cursor: pointer;
&:hover {
background: var(--color-primary-2);
}
.flag {
width: 24px;
......@@ -831,6 +819,7 @@ onMounted(() => {
font-size: 14px;
height: 36px;
cursor: pointer;
.item-title {
font-size: 14px;
font-weight: 400;
......@@ -842,6 +831,7 @@ onMounted(() => {
text-overflow: ellipsis;
max-width: 90%;
}
.flag {
width: 16px;
height: 16px;
......@@ -1222,6 +1212,7 @@ onMounted(() => {
min-height: 500px;
max-height: 1000px;
margin-bottom: 15px;
.reason-history-item {
.item-header {
border-top: 1px solid #ddd;
......@@ -1230,10 +1221,12 @@ onMounted(() => {
display: flex;
justify-content: space-between;
align-items: center;
.item-header-title {
display: flex;
align-items: center;
width: 85%;
.item-header-title-idx {
width: 24px;
height: 24px;
......@@ -1243,6 +1236,7 @@ onMounted(() => {
line-height: 24px;
text-align: center;
}
.item-header-title-text {
margin-left: 13px;
font-size: 16px;
......@@ -1255,10 +1249,12 @@ onMounted(() => {
text-overflow: ellipsis;
}
}
.item-header-domain {
// min-width: 100px;
}
}
.item-content {
padding: 10px 20px;
border-radius: 4px;
......@@ -1270,6 +1266,7 @@ onMounted(() => {
background-color: rgb(247, 248, 249);
padding: 10px 0;
border-radius: 4px;
&::before {
content: "";
position: absolute;
......@@ -1279,6 +1276,7 @@ onMounted(() => {
width: 4px;
background-color: rgb(5, 95, 194);
}
.item-content-record-header {
padding: 0px 15px;
font-size: 16px;
......@@ -1291,6 +1289,7 @@ onMounted(() => {
overflow: hidden;
text-overflow: ellipsis;
}
.item-content-record-content {
padding: 5px 15px;
font-size: 16px;
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论