Skip to content

R
risk-monitor
提交 a6d0a804 authored 作者: 张烨's avatar 张烨
浏览文件
操作

Merge branch 'master' into zy-dev

上级 1a031e8a 4cd6ce99
全部展开 显示空白字符变更
内嵌 并排
正在显示 包含 780 行增加 和 490 行删除
src/api/companyPages/index.js
浏览文件 @ a6d0a804
...@@ -32,7 +32,13 @@ export function getEnterpriseNewDynamic(params) { ...@@ -32,7 +32,13 @@ export function getEnterpriseNewDynamic(params) {
url: `/api/enterprisePage/newDynamic/${params}`, url: `/api/enterprisePage/newDynamic/${params}`,
}) })
} }
//企业基本信息:最新动态(分页)
export function getEnterpriseNewDynamicPage(params) {
return request({
method: 'GET',
url: `/api/enterprisePage/newDynamicPage/${params}`,
})
}
//企业研发投入:年度研发投入对比 //企业研发投入:年度研发投入对比
export function getEnterpriseStudy(params) { export function getEnterpriseStudy(params) {
......
src/components/base/messageBubble/index.vue
浏览文件 @ a6d0a804
...@@ -4,7 +4,9 @@ ...@@ -4,7 +4,9 @@
<div class="header-icon"> <div class="header-icon">
<img src="./image1.png" alt="" /> <img src="./image1.png" alt="" />
</div> </div>
<div class="header-title">{{ "社交媒体" }}</div> <div class="header-title">
<slot name='title'>{{ "社交媒体" }}</slot>
</div>
<div class="more" @click="handleToMoreNews">{{ "更多 +" }}</div> <div class="more" @click="handleToMoreNews">{{ "更多 +" }}</div>
</div> </div>
<div class="box4-main"> <div class="box4-main">
...@@ -148,7 +150,7 @@ const handleToMoreNews = (item) => { ...@@ -148,7 +150,7 @@ const handleToMoreNews = (item) => {
} }
.header-title { .header-title {
width: 80px; width: 100%;
margin-top: 11px; margin-top: 11px;
margin-left: 18px; margin-left: 18px;
height: 26px; height: 26px;
......
src/components/base/newsList/newsItem.vue → src/components/base/newsList/NewsItem.vue
浏览文件 @ a6d0a804
...@@ -48,6 +48,8 @@ const handleToNewsAnalysis = (item, index) => { ...@@ -48,6 +48,8 @@ const handleToNewsAnalysis = (item, index) => {
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@use '@/styles/common.scss';
.box3-item { .box3-item {
display: flex; display: flex;
align-items: center; align-items: center;
...@@ -90,12 +92,8 @@ const handleToNewsAnalysis = (item, index) => { ...@@ -90,12 +92,8 @@ const handleToNewsAnalysis = (item, index) => {
.title { .title {
// width: 500px; // width: 500px;
height: 24px; @extend .text-title-3-bold;
color: rgba(59, 65, 75, 1); color: var(--text-primary-80-color);
font-family: 'Source Han Sans CN';
font-size: 16px;
font-weight: 700;
line-height: 24px;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
...@@ -108,39 +106,15 @@ const handleToNewsAnalysis = (item, index) => { ...@@ -108,39 +106,15 @@ const handleToNewsAnalysis = (item, index) => {
.time { .time {
text-align: right; text-align: right;
height: 22px; @extend .text-tip-2;
color: rgba(95, 101, 108, 1); color: var(--text-primary-65-color);
font-family: 'Source Han Sans CN';
font-size: 14px;
font-weight: 400;
line-height: 22px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
} }
} }
.right-footer { .right-footer {
height: 48px; @extend .text-compact;
/* 调整为2行的高度：24px × 2 = 48px */ color: var(--text-primary-65-color);
color: rgba(59, 65, 75, 1); @include common.text-ellipsis(2);
font-family: 'Source Han Sans CN';
font-size: 16px;
font-weight: 400;
line-height: 24px;
overflow: hidden;
display: -webkit-box;
/* 关键 */
-webkit-line-clamp: 2;
/* 显示2行 */
-webkit-box-orient: vertical;
/* 垂直方向排列 */
text-overflow: ellipsis;
/* 第二行省略号 */
white-space: normal;
/* 改为 normal */
word-break: break-word;
/* 允许单词换行 */
} }
} }
</style> </style>
\ No newline at end of file
src/components/devStyle/components/constStyle.vue
浏览文件 @ a6d0a804
...@@ -3,7 +3,9 @@ import { ElSpace, ElButton } from 'element-plus'; ...@@ -3,7 +3,9 @@ import { ElSpace, ElButton } from 'element-plus';
import "@/styles/main.css" import "@/styles/main.css"
import { copyToClipboardThenTip } from '@/utils/systemUtils' import { copyToClipboardThenTip } from '@/utils/systemUtils'
const colors = [ // 黑色到白色主色一行
const rowBlackToWhite = [
{ title: "黑色", name: "--text-primary-color" },
{ title: "黑色90% / 主标题文字颜色", name: "--text-primary-90-color" }, { title: "黑色90% / 主标题文字颜色", name: "--text-primary-90-color" },
{ title: "黑色80% / 小标题文字颜色", name: "--text-primary-80-color" }, { title: "黑色80% / 小标题文字颜色", name: "--text-primary-80-color" },
{ title: "黑色65% / 正文颜色", name: "--text-primary-65-color" }, { title: "黑色65% / 正文颜色", name: "--text-primary-65-color" },
...@@ -12,7 +14,25 @@ const colors = [ ...@@ -12,7 +14,25 @@ const colors = [
{ title: "黑色5% / 分割线颜色", name: "--bg-black-5" }, { title: "黑色5% / 分割线颜色", name: "--bg-black-5" },
{ title: "黑色2% / 灰色背景色", name: "--bg-black-2" }, { title: "黑色2% / 灰色背景色", name: "--bg-black-2" },
{ title: "白色主色", name: "--bg-white-100" }, { title: "白色主色", name: "--bg-white-100" },
]
// 主色到主色高亮背景一行（主色高亮背景为浅色，需黑色文字）
const rowPrimaryToHighlight = [
{ title: "主色", name: "--color-primary-100" }, { title: "主色", name: "--color-primary-100" },
{ title: "主色50%", name: "--color-primary-50", light: true },
{ title: "主色35%", name: "--color-primary-35" },
{ title: "主色10%", name: "--color-primary-10", light: true },
{ title: "主色高亮背景", name: "--color-primary-2", light: true },
]
// 红色到绿色10%一行（*10% 为浅色背景，需黑色文字）
const rowRedToGreen10 = [
{ title: "红色", name: "--color-red-100" },
{ title: "红色10%", name: "--color-red-10", light: true },
{ title: "橙色", name: "--color-orange-100" },
{ title: "橙色10%", name: "--color-orange-10", light: true },
{ title: "黄色", name: "--color-yellow-100" },
{ title: "黄色10%", name: "--color-yellow-10", light: true },
{ title: "绿色", name: "--color-green-100" },
{ title: "绿色10%", name: "--color-green-10", light: true },
] ]
function copyColorVar(item) { function copyColorVar(item) {
const color = `var(${item.name})` const color = `var(${item.name})`
...@@ -23,13 +43,36 @@ function copyColorVar(item) { ...@@ -23,13 +43,36 @@ function copyColorVar(item) {
<template> <template>
<el-space direction="vertical" alignment="flex-start"> <el-space direction="vertical" alignment="flex-start">
<div class="text-title-2">颜色</div> <div class="text-title-2">颜色</div>
<el-space> <el-space direction="vertical" alignment="flex-start">
<el-button v-for="(item, index) in colors" :key="index" :color="`var(${item.name})`" <el-space wrap>
v-on:click="copyColorVar(item)"> <el-button v-for="(item, index) in rowBlackToWhite" :key="'bw-' + index" :color="`var(${item.name})`"
@click="copyColorVar(item)">
{{ item.title }} {{ item.title }}
</el-button> </el-button>
</el-space> </el-space>
<el-space wrap>
<el-button v-for="(item, index) in rowPrimaryToHighlight" :key="'ph-' + index"
:class="{ 'color-btn-text-black': item.light }"
:style="item.light ? { '--btn-bg': `var(${item.name})` } : undefined" :color="`var(${item.name})`"
@click="copyColorVar(item)">
{{ item.title }}
</el-button>
</el-space>
<el-space wrap>
<el-button v-for="(item, index) in rowRedToGreen10" :key="'rg-' + index"
:class="{ 'color-btn-text-black': item.light }"
:style="item.light ? { '--btn-bg': `var(${item.name})` } : undefined" :color="`var(${item.name})`"
@click="copyColorVar(item)">
{{ item.title }}
</el-button>
</el-space>
</el-space>
</el-space> </el-space>
</template> </template>
<style scoped></style> <style scoped>
\ No newline at end of file /* 浅色背景按钮：文字黑色 */
:deep(.color-btn-text-black) {
color: var(--el-color-black) !important;
}
</style>
\ No newline at end of file
src/components/devStyle/components/index.vue
浏览文件 @ a6d0a804
...@@ -9,7 +9,7 @@ import { ElScrollbar, ElSpace } from "element-plus"; ...@@ -9,7 +9,7 @@ import { ElScrollbar, ElSpace } from "element-plus";
<template> <template>
<el-scrollbar> <el-scrollbar>
<div class="common-page"> <div class="common-page">
<el-space direction="vertical" alignment="flex-start"> <el-space direction="vertical" :size="20" alignment="flex-start">
<div class="text-title-0-show">开发样式</div> <div class="text-title-0-show">开发样式</div>
<div class="text-title-1-show">样式变量</div> <div class="text-title-1-show">样式变量</div>
<const-style></const-style> <const-style></const-style>
......
src/router/modules/company.js
浏览文件 @ a6d0a804
//企业主页 //企业主页
const companyPages = () => import('@/views/companyPages/index.vue') const companyPages = () => import('@/views/companyPages/index.vue')
const companyPages2 = () => import('@/views/companyPages2/index.vue')
const companyPagesRoutes = [ const companyPagesRoutes = [
...@@ -14,6 +15,16 @@ const companyPagesRoutes = [ ...@@ -14,6 +15,16 @@ const companyPagesRoutes = [
dynamicTitle: true dynamicTitle: true
} }
}, },
// todo: 开发过程测试，开发完成后删除，by hsx ，20260306
{
path: "/companyPages2/:id",
name: "companyPages2",
component: companyPages2,
meta: {
title: "企业主页",
dynamicTitle: true
}
},
] ]
......
src/styles/common.scss
浏览文件 @ a6d0a804
/***背景作为卡片***/ /***背景作为卡片***/
.background-as-card { .background-as-card {
background-color: var(--color-primary-65); background-color: var(--bg-white-80);
border-radius: 10px; border-radius: 10px;
border: 1px solid rgba(234, 236, 238, 1); border: 1px solid var(--bg-white-100);
border-radius: 10px; border-radius: 10px;
box-shadow: 0px 0px 20px 0px rgba(25, 69, 130, 0.1); box-shadow: 0px 0px 20px 0px rgba(25, 69, 130, 0.1);
} }
...@@ -10,10 +10,29 @@ ...@@ -10,10 +10,29 @@
.flex-display{ .flex-display{
display: flex; display: flex;
} }
// 文本超出指定行数省略号显示
@mixin text-ellipsis($line-clamp) {
overflow: hidden;
display: -webkit-box;
/* 关键 */
-webkit-line-clamp: $line-clamp;
/* 显示2行 */
-webkit-box-orient: vertical;
/* 垂直方向排列 */
text-overflow: ellipsis;
/* 第二行省略号 */
white-space: normal;
/* 改为 normal */
word-break: break-word;
/* 允许单词换行 */
}
//禁止换行
.text-nowrap{
white-space: nowrap;
}
/***文本样式***/ /***文本样式***/
.text-base{ .text-base{
color: var(--color-primary-90); color: var(--color-primary-80);
} }
//0级标题 //0级标题
......
src/styles/descriptions.scss
浏览文件 @ a6d0a804
...@@ -3,6 +3,7 @@ ...@@ -3,6 +3,7 @@
/***没有nav下划线***/ /***没有nav下划线***/
.common-descriptions .el-descriptions__label{ .common-descriptions .el-descriptions__label{
@extend .text-tip-1-bold; @extend .text-tip-1-bold;
color: var(--text-primary-80-color);
} }
.common-descriptions .el-descriptions__content{ .common-descriptions .el-descriptions__content{
@extend .text-tip-1; @extend .text-tip-1;
......
src/styles/main.css
浏览文件 @ a6d0a804
...@@ -4,8 +4,6 @@ ...@@ -4,8 +4,6 @@
--font-family-base: "Source Han Sans CN"; --font-family-base: "Source Han Sans CN";
--font-size-base: 16px; --font-size-base: 16px;
--color-bg-hover: #f6faff; --color-bg-hover: #f6faff;
/* 普通按钮颜色 */ /* 普通按钮颜色 */
...@@ -29,6 +27,7 @@ ...@@ -29,6 +27,7 @@
--bg-black-5: #EAECEE; --bg-black-5: #EAECEE;
--bg-black-2: #F7F8F9; --bg-black-2: #F7F8F9;
--bg-white-100: #FFFFFF; --bg-white-100: #FFFFFF;
--bg-white-80: rgba(255, 255, 255, 0.8);
--bg-white-65: rgba(255, 255, 255, 0.65); --bg-white-65: rgba(255, 255, 255, 0.65);
--bg-white-50: rgba(255, 255, 255, 0.5); --bg-white-50: rgba(255, 255, 255, 0.5);
--bg-white-35: rgba(255, 255, 255, 0.35); --bg-white-35: rgba(255, 255, 255, 0.35);
...@@ -39,10 +38,22 @@ ...@@ -39,10 +38,22 @@
/* 主色 设计定义*/ /* 主色 设计定义*/
--color-primary-100: #055FC2; --color-primary-100: #055FC2;
--color-primary-50: #82AFE0; --color-primary-50: #89C1FF;
--color-primary-35: #AED6FF; --color-primary-35: #B9DCFF;
--color-primary-10: #E7F3FF; --color-primary-10: #E7F3FF;
--color-primary-2: #F6FAFF; --color-primary-2: #F6FAFF;
/* 红色 设计定义 */
--color-red-100:#CE4F51;
--color-red-10:rgba(206, 79, 81, 0.1);
/* 橙色 设计定义 */
--color-orange-100:#FF954D;
--color-orange-10:rgba(255, 149, 77, 0.1);
/* 黄色 设计定义 */
--color-yellow-100:#E8BD0B;
--color-yellow-10:rgba(232, 189, 11, 0.1);
/* 绿色 设计定义 */
--color-green-100:#218139;
--color-green-10:rgba(33, 129, 57, 0.1);
} }
.hover-dialog { .hover-dialog {
......
src/views/ZMOverView/components/fourSuppress/components/addDomain/mockdata.json deleted 100644 → 0
浏览文件 @ 1a031e8a
{
"code": 200,
"message": "操作成功",
"success": true,
"data": [
{
"eventType": "行政令",
"eventName": "为了美国和委内瑞拉人民的利益保障委内瑞拉的石油收入",
"eventDesc": null,
"eventId": "248914",
"eventDomainList": [
{
"domainId": "1",
"domainName": "人工智能"
},
{
"domainId": "3",
"domainName": "新一代通信网络"
}
],
"eventOrgName": null,
"eventDate": "2026-01-10"
},
{
"eventType": "行政令",
"eventName": null,
"eventDesc": null,
"eventId": "248863",
"eventDomainList": [
{
"domainId": "8",
"domainName": "先进制造"
},
{
"domainId": "9",
"domainName": "新材料"
}
],
"eventOrgName": null,
"eventDate": "2026-01-09"
},
{
"eventType": "行政令",
"eventName": "使美国退出与美国利益相悖的国际组织、公约、条约",
"eventDesc": null,
"eventId": "249004",
"eventDomainList": [
{
"domainId": "2",
"domainName": "生物科技"
},
{
"domainId": "4",
"domainName": "量子科技"
},
{
"domainId": "5",
"domainName": "新能源"
},
{
"domainId": "3",
"domainName": "新一代通信网络"
}
],
"eventOrgName": null,
"eventDate": "2026-01-08"
},
{
"eventType": "行政令",
"eventName": "在国防合同中优先考虑作战人员",
"eventDesc": null,
"eventId": "248915",
"eventDomainList": [
{
"domainId": "99",
"domainName": "其他"
},
{
"domainId": "8",
"domainName": "先进制造"
},
{
"domainId": "10",
"domainName": "航空航天"
}
],
"eventOrgName": null,
"eventDate": "2026-01-08"
},
{
"eventType": "行政令",
"eventName": "大西洋高度洄游物种；商业性大西洋黑鼻鲨和娱乐性大西洋鲨鱼渔业管理措施的修订",
"eventDesc": "NMFS提议对商业和休闲大西洋鲨鱼渔业进行几项改革。具体来说，NMFS正在考虑取消大西洋地区黑鼻鲨管理边界，修改商业保留限额...",
"eventId": "163447",
"eventDomainList": [
{
"domainId": "14",
"domainName": "核"
},
{
"domainId": "7",
"domainName": "海洋"
}
],
"eventOrgName": null,
"eventDate": "2026-01-05"
},
{
"eventType": "行政令",
"eventName": "关于Hiefo Corporation收购Emcore Corporation部分资产",
"eventDesc": null,
"eventId": "248916",
"eventDomainList": [
{
"domainId": "3",
"domainName": "新一代通信网络"
},
{
"domainId": "8",
"domainName": "先进制造"
},
{
"domainId": "6",
"domainName": "集成电路"
}
],
"eventOrgName": null,
"eventDate": "2026-01-03"
},
{
"eventType": "行政令",
"eventName": "汽车贷款利息扣除",
"eventDesc": "本文件包含关于某些纳税人扣除高达10,000美元的合格乘用车贷款利息的拟议法规。本文件还包含关于新信息报告的拟议法规...",
"eventId": "163443",
"eventDomainList": [
{
"domainId": "13",
"domainName": "太空"
},
{
"domainId": "14",
"domainName": "核"
}
],
"eventOrgName": null,
"eventDate": "2026-01-02"
},
{
"eventType": "行政令",
"eventName": "品牌处方药费用法规的法定更新",
"eventDesc": "本文件建议修订有关对从事制造或进口某些品牌处方药业务的相关实体征收年费的法规。为了应对覆盖缺口折扣的替代...",
"eventId": "163444",
"eventDomainList": [
{
"domainId": "2",
"domainName": "生物科技"
},
{
"domainId": "3",
"domainName": "新一代通信网络"
}
],
"eventOrgName": null,
"eventDate": "2026-01-02"
},
{
"eventType": "337",
"eventName": "外国制造的半导体器件及其下游产品和组件",
"eventDesc": "美国ITC发布对外国制造的半导体器件及其下游产品和组件的337部分终裁",
"eventId": "111",
"eventDomainList": [
{
"domainId": "1",
"domainName": "人工智能"
},
{
"domainId": "5",
"domainName": "新能源"
}
],
"eventOrgName": "美国商务部",
"eventDate": "2026-01-01"
},
{
"eventType": "行政令",
"eventName": "美国东北部的渔业；大西洋冲浪蛤和海洋圆蛤渔业管理计划修正案21",
"eventDesc": "NMFS宣布，中大西洋渔业管理委员会已提交大西洋冲浪蛤和海洋圆蛤渔业管理计划第21号修正案，供商务部长审查和批准。我们正在征求意见...",
"eventId": "163426",
"eventDomainList": [
{
"domainId": "7",
"domainName": "海洋"
},
{
"domainId": "3",
"domainName": "新一代通信网络"
}
],
"eventOrgName": null,
"eventDate": "2025-12-29"
}
]
}
\ No newline at end of file
src/views/ZMOverView/components/fourSuppress/index.vue
浏览文件 @ a6d0a804
...@@ -26,7 +26,7 @@ ...@@ -26,7 +26,7 @@
<script setup> <script setup>
import { onMounted, ref, computed } from "vue"; import { onMounted, ref, computed } from "vue";
import right from "./assets/right.png"; import right from "./assets/right-white.png";
import background from "./assets/background.png"; import background from "./assets/background.png";
// 组件引入 // 组件引入
...@@ -104,12 +104,13 @@ const handleNavClick = name => { ...@@ -104,12 +104,13 @@ const handleNavClick = name => {
} }
&.active { &.active {
background-color: rgba(246, 250, 255, 1); background-color: rgba(5, 95, 194, 1);
border: 1px solid rgba(174, 214, 255, 1); border: 1px solid rgba(174, 214, 255, 1);
border-radius: 10px; border-radius: 10px;
span { span {
color: rgb(5, 95, 194); // color: rgb(5, 95, 194);
color: #fff;
} }
} }
} }
......
src/views/ZMOverView/index.vue
浏览文件 @ a6d0a804
...@@ -21,8 +21,13 @@ ...@@ -21,8 +21,13 @@
<!-- 美对华“四全”打压 --> <!-- 美对华“四全”打压 -->
<div id="us-pressure" class="us-pressure-section"> <div id="us-pressure" class="us-pressure-section">
<div class="data-select"> <div class="data-select">
<div v-for="item in dateList" :key="item.type" class="date-item" :class="{ active: activeDate === item.type }" <div
@click="handleDateClick(item.type)"> v-for="item in dateList"
:key="item.type"
class="date-item"
:class="{ active: activeDate === item.type }"
@click="handleDateClick(item.type)"
>
<!-- <img :src="activeDate === item.type ? item.activeIcon : item.icon" alt="" /> --> <!-- <img :src="activeDate === item.type ? item.activeIcon : item.icon" alt="" /> -->
<span>{{ item.name }}</span> <span>{{ item.name }}</span>
</div> </div>
...@@ -133,8 +138,6 @@ provide("activeDate", activeDate); ...@@ -133,8 +138,6 @@ provide("activeDate", activeDate);
const handleDateClick = type => { const handleDateClick = type => {
activeDate.value = type; activeDate.value = type;
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
...@@ -250,7 +253,8 @@ const handleDateClick = type => { ...@@ -250,7 +253,8 @@ const handleDateClick = type => {
.home-top-bg { .home-top-bg {
background: background:
url("./assets/images/background.png"), linear-gradient(180deg, rgba(229, 241, 254, 1) 0%, rgba(246, 251, 255, 0) 30%); url("./assets/images/background.png"),
linear-gradient(180deg, rgba(229, 241, 254, 1) 0%, rgba(246, 251, 255, 0) 30%);
background-size: 100% 100%; background-size: 100% 100%;
position: absolute; position: absolute;
width: 100%; width: 100%;
...@@ -266,7 +270,7 @@ const handleDateClick = type => { ...@@ -266,7 +270,7 @@ const handleDateClick = type => {
.data-select { .data-select {
width: 108px; width: 108px;
height: 192px; height: 192px;
position: fixed; position: absolute;
top: 149px; top: 149px;
left: 0; left: 0;
background-color: rgba(255, 255, 255, 0.65); background-color: rgba(255, 255, 255, 0.65);
......
src/views/companyPages2/component/capitalScale.vue 0 → 100644
浏览文件 @ a6d0a804
<template>
<!-- 资本规模组件 -->
<el-space :size="24">
<!-- 遍历资本规模数据 -->
<div v-for="(t, i) in scales" :key="i" class="item-box">
<!-- 标题 -->
<div class="item-title">{{ t.title }}</div>
<!-- 数值区域 -->
<el-space :size="6">
<!-- 数值图标 -->
<div class="item-value-img" />
<!-- 数值 -->
<div class="item-value">
{{ t.value }}
</div>
</el-space>
</div>
</el-space>
</template>
<script setup>
// 导入Vue组合式API
import { ref, watch } from 'vue'
// 导入Element Plus组件
import { ElSpace } from 'element-plus'
// 响应式数据
const scales = ref([]) // 资本规模数据列表
// 定义组件属性
const props = defineProps({
enterpriseInfo: {
type: Object,
default: {}
}
});
// 监听企业信息变化，更新资本规模数据
watch(() => props.enterpriseInfo, (newVal, oldVal) => {
// 如果没有年份信息，直接返回
if (!newVal?.year)
return
const scales1 = []
// 添加营业额数据
if (newVal.turnover) {
scales1.push({
title: newVal.year + '年营业额',
// 文字转数字，保留整数，添加单位
value: Number(newVal.turnover).toFixed(0) + '亿'
})
}
// 添加总资产数据
if (newVal.totalAssets) {
scales1.push({
title: newVal.year + '年总资产',
// 文字转数字，保留整数，添加单位
value: Number(newVal.totalAssets).toFixed(0) + '亿'
})
}
// 添加净资产数据
if (newVal.netAssets) {
scales1.push({
title: newVal.year + '年净资产',
// 文字转数字，保留整数，添加单位
value: Number(newVal.netAssets).toFixed(0) + '亿'
})
}
// 更新资本规模数据
scales.value = scales1
}, { immediate: true }) // immediate: true 表示组件挂载时立即执行
</script>
<style lang="scss" scoped>
// 导入通用样式
@use '@/styles/common.scss';
/* 项目盒子样式 */
.item-box {
white-space: nowrap; // 禁止换行
text-align: right; // 右对齐
}
/* 项目标题样式 */
.item-title {
@extend .text-tip-1;
color: var(--text-primary-80-color);
}
/* 项目数值样式 */
.item-value {
@extend .text-title-0-bold;
color: var(--color-primary-100);
}
/* 项目数值图标样式 */
.item-value-img {
width: 8px;
height: 6px;
background-image: url(../images/Regular_polygon_11097_225086.png);
background-size: 100% 100%;
background-repeat: no-repeat;
position: relative;
flex-shrink: 0; // 防止收缩
}
</style>
\ No newline at end of file
src/views/companyPages2/component/detailsPages/baseInfo.vue 0 → 100644
浏览文件 @ a6d0a804
<template>
<!-- 企业基本信息组件 -->
<analysis-box title="基本信息" :showAllBtn="false">
<div class="box-wrap">
<!-- 企业图片 -->
<el-image :src="enterpriseInfo.picture" class="company-picture" />
<!-- 企业基本信息描述 -->
<el-descriptions title='' :column="1" class="common-descriptions">
<el-descriptions-item label="成立时间：">{{ enterpriseInfo.establishmentDate }}</el-descriptions-item>
<el-descriptions-item label="总部地址：">{{ enterpriseInfo.address }}</el-descriptions-item>
<el-descriptions-item label="联系方式：">{{ enterpriseInfo.telephone }}</el-descriptions-item>
<el-descriptions-item label="企业类型：">{{ enterpriseInfo.companyType }}</el-descriptions-item>
<el-descriptions-item label="业务范围：">{{ enterpriseInfo.businessScope }}</el-descriptions-item>
<el-descriptions-item label="分支机构：">
<div style="margin-left: 86px;">
<li v-for="(t, i) in branchs" :key="i">{{ t.orgName }}</li>
</div>
</el-descriptions-item>
</el-descriptions>
<!-- 分隔线 -->
<el-divider></el-divider>
<!-- 关键人物标题 -->
<div class="text-tip-1-bold" style="margin-bottom: 19px;">关键人物：</div>
<!-- 关键人物列表 -->
<el-space wrap>
<person-avatar style="width: 200px;" v-for="(t, i) in persons" :key="i" :person="t"></person-avatar>
</el-space>
</div>
</analysis-box>
</template>
<script setup>
// 导入组件
import AnalysisBox from '@/components/base/boxBackground/analysisBox.vue';
import { ref, watch } from 'vue';
import { getEnterpriseBranch, getEnterpriseKeyPerson } from '@/api/companyPages';
import PersonAvatar from '@/components/base/people/personAvatar.vue';
import { ElDescriptions, ElDescriptionsItem, ElDivider, ElImage, ElSpace } from 'element-plus';
import '@/styles/descriptions.scss'
// 定义组件属性
const props = defineProps({
enterpriseInfo: {
type: Object,
default: {}
}
});
// 响应式数据
const branchs = ref([]) // 分支机构列表
const persons = ref([]) // 关键人物列表
/**
* 获取企业相关数据
* @param {string} id - 企业ID
*/
const featchData = async (id) => {
// 获取分支机构数据
var res = await getEnterpriseBranch(id);
if (res?.code === 200) {
branchs.value = res.data;
}
// 获取关键人物数据
res = await getEnterpriseKeyPerson(id);
if (res?.code === 200) {
persons.value = res.data;
}
}
// 监听企业信息变化，当企业信息更新时重新获取数据
watch(() => props.enterpriseInfo, async (newVal, oldVal) => {
if (newVal) {
await featchData(newVal.id)
}
}, { immediate: true }) // immediate: true 表示组件挂载时立即执行
</script>
<style lang="css" scoped>
/* 容器样式 */
.box-wrap {
margin: 25px;
}
/* 企业图片样式 */
.company-picture {
border-radius: 4px;
margin-bottom: 16px;
}
</style>
\ No newline at end of file
src/views/companyPages2/component/detailsPages/newsPane.vue 0 → 100644
浏览文件 @ a6d0a804
<template>
<!-- 企业最新动态组件 -->
<analysis-box title="最新动态" :showAllBtn="false">
<!-- 顶部分隔线 -->
<el-divider></el-divider>
<!-- 新闻列表 -->
<el-space :size="0" direction="vertical">
<news-item class="list-item" v-for="(t, i) in newsPage.content" :key="i" :news="t"></news-item>
</el-space>
<!-- 底部分隔线 -->
<el-divider></el-divider>
<!-- 分页组件 -->
<el-pagination style="margin: 25px;" background layout="total, ->, prev, pager, next"
:total="newsPage.totalElements" v-on:current-change="onCurrentChange">
</el-pagination>
</analysis-box>
</template>
<script setup>
// 导入API
import { getEnterpriseNewDynamicPage } from '@/api/companyPages';
// 导入组件
import AnalysisBox from '@/components/base/boxBackground/analysisBox.vue';
import NewsItem from '@/components/base/newsList/NewsItem.vue';
import { ElDivider, ElSpace, ElPagination } from 'element-plus';
// 导入Vue组合式API
import { ref, watch } from 'vue';
// 响应式数据
const newsPage = ref({}) // 新闻分页数据
// 定义组件属性
const props = defineProps({
enterpriseInfo: {
type: Object,
default: {}
}
});
/**
* 更新新闻列表
* @param {string} id - 企业ID
* @param {number} page - 页码（从0开始）
*/
const updateNews = async (id, page) => {
// 获取企业最新动态分页数据
const res = await getEnterpriseNewDynamicPage(`${id}?pageNumber=${page}`);
if (res?.code === 200) {
// 处理新闻数据，添加来源信息
res.data?.content?.forEach(t => {
t.from = `${t.time} · ${t.orgName}`
});
// 更新新闻分页数据
newsPage.value = res.data;
}
}
// 监听企业信息变化，当企业信息更新时重新获取新闻
watch(() => props.enterpriseInfo, async (newVal, oldVal) => {
if (newVal) {
await updateNews(newVal.id, 0) // 默认从第0页开始
}
}, { immediate: true }) // immediate: true 表示组件挂载时立即执行
/**
* 分页变化处理函数
* @param {number} e - 当前页码（从1开始）
*/
const onCurrentChange = e => {
console.log(e) // 打印当前页码
updateNews(props.enterpriseInfo.id, e - 1) // 转换为从0开始的页码
}
</script>
<style lang="css" scoped>
/* 新闻列表项样式 */
.list-item {
margin-bottom: 20px;
/* 底部外边距 */
border-bottom: 1px solid rgba(240, 242, 244, 1);
/* 底部边框 */
}
</style>
\ No newline at end of file
src/views/companyPages2/component/operatingPages/index.vue 0 → 100644
浏览文件 @ a6d0a804
<script setup lang="ts">
import '@/styles/tabs.scss'
import { ElTabPane, ElTabs } from 'element-plus';
</script>
<template>
<el-tabs tabPosition="left" class="disinheritance tabs-nav-no-wrap left-float-nav-tabs">
<el-tab-pane label="企业规模"></el-tab-pane>
<el-tab-pane label="市值变化"></el-tab-pane>
<el-tab-pane label="研发投入"></el-tab-pane>
<el-tab-pane label="市场占比"></el-tab-pane>
</el-tabs>
</template>
\ No newline at end of file
src/views/companyPages2/component/titlePane.vue 0 → 100644
浏览文件 @ a6d0a804
<template>
<!-- 企业标题面板组件 -->
<div class="box background-as-card">
<!-- 企业Logo -->
<img v-if="enterpriseInfo.logoUrl" :src="enterpriseInfo.logoUrl" alt="logo" class="company-logo" />
<!-- 企业信息区域 -->
<el-space fill :size="4">
<!-- 企业名称 -->
<div class="company-name">{{ enterpriseInfo.orgName }}</div>
<!-- 企业英文名称 -->
<div class="company-name2">{{ enterpriseInfo.orgNameEn }}</div>
<!-- 企业简介 -->
<div class="company-name2">{{ enterpriseInfo.orgIntroduction }}</div>
<!-- 供应区域标签 -->
<el-space>
<area-tag v-for="(t, i) in areas" :key="i" :tagName="t.name"></area-tag>
</el-space>
</el-space>
<capital-scale :enterpriseInfo="enterpriseInfo"></capital-scale>
</div>
</template>
<script setup>
// 导入组件
import AreaTag from '@/components/base/AreaTag/index.vue';
// 导入API
import { getSupplyAreaList } from '@/api/companyPages';
// 导入Vue组合式API
import { ref, watch } from 'vue';
import { ElSpace } from 'element-plus';
// 导入自定义组件
import CapitalScale from './capitalScale.vue'
// 响应式数据
const areas = ref([]) // 供应区域列表
// 定义组件属性
const props = defineProps({
enterpriseInfo: {
type: Object,
default: {}
}
});
// 监听企业信息变化，当企业信息更新时重新获取供应区域
watch(() => props.enterpriseInfo, async (newVal, oldVal) => {
if (newVal) {
await initAreas(newVal.id)
}
})
/**
* 初始化供应区域列表
* @param {string} id - 企业ID
*/
const initAreas = async (id) => {
// 获取供应区域数据
const res = await getSupplyAreaList(id);
if (res?.code === 200) {
// 更新供应区域列表
areas.value = res.data;
}
}
</script>
<style lang="scss" scoped>
// 导入通用样式
@use '@/styles/common.scss';
/* 容器样式 */
.box {
width: 100%;
height: 160px;
top: 80px;
left: 160px;
padding: 16px 19px;
border-radius: 10px;
display: flex;
align-items: center;
}
/* 企业Logo样式 */
.company-logo {
width: 128px;
height: 128px;
margin-right: 21px;
object-fit: contain;
}
/* 企业名称样式 */
.company-name {
@extend .text-title-1-bold;
color: var(--text-primary-80-color);
}
/* 企业英文名称和简介样式 */
.company-name2 {
@extend .text-tip-1;
color: var(--text-primary-80-color);
@include common.text-ellipsis(2); // 最多显示2行，超出部分省略
}
</style>
\ No newline at end of file
src/views/companyPages2/index.vue 0 → 100644
浏览文件 @ a6d0a804
<template>
<div class="background-container"
:style="{ backgroundImage: `linear-gradient(to bottom, var(--bg-white-80), var(--bg-white-100)), url(${enterpriseInfo.picture})` }">
</div>
<el-scrollbar>
<div class="common-page">
<el-space wrap :size="16">
<title-pane :enterprise-info="enterpriseInfo"></title-pane>
<el-tabs stretch class="tabs-header-as-card tabs-nav-no-wrap tabs-bar-as-btn">
<el-tab-pane label="企业详情">
<div class="flex-display">
<news-pane :enterprise-info="enterpriseInfo" />
<base-info class="base-info" :enterprise-info="enterpriseInfo" />
</div>
</el-tab-pane>
<el-tab-pane lazy label="经营情况">
<operating-pages />
</el-tab-pane>
<el-tab-pane lazy label="供应链 / 股权">
<div class="flex-display">
</div>
</el-tab-pane>
</el-tabs>
</el-space>
</div>
</el-scrollbar>
</template>
<script setup>
import { ref, onMounted } from 'vue';
import { useRoute } from 'vue-router';
import { getEnterprisePageInfo } from '@/api/companyPages';
import TitlePane from './component/titlePane.vue';
import NewsPane from './component/detailsPages/newsPane.vue';
import BaseInfo from './component/detailsPages/baseInfo.vue';
import OperatingPages from './component/operatingPages/index.vue';
import '@/styles/tabs.scss'
import '@/styles/container.scss'
import { ElScrollbar, ElSpace, ElTabs, ElTabPane } from 'element-plus';
const route = useRoute();
const companyId = route.params.id;
const enterpriseInfo = ref({})
console.log(companyId)
onMounted(() => {
init();
});
const init = async () => {
const res = await getEnterprisePageInfo(companyId);
if (res?.code === 200) {
enterpriseInfo.value = res.data
}
}
</script>
<style lang="scss" scoped>
.background-container {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 383px;
background-size: cover;
background-position: center;
background-repeat: no-repeat;
z-index: -1;
}
.base-info {
max-width: 520px;
width: 520px;
margin-left: 16px;
}
</style>
\ No newline at end of file
src/views/overView/js/radarChart3.js
浏览文件 @ a6d0a804
import * as echarts from 'echarts'; import * as echarts from "echarts";
/** /**
* 计算雷达图最外圈半径（px） * 计算雷达图最外圈半径（px）
...@@ -21,35 +21,35 @@ function getOuterRadius(dom, radarRadius = 75) { ...@@ -21,35 +21,35 @@ function getOuterRadius(dom, radarRadius = 75) {
const getBarChart = (nameList, valueList, isPer, dom) => { const getBarChart = (nameList, valueList, isPer, dom) => {
// 1. 基础雷达图配置 // 1. 基础雷达图配置
const option = { const option = {
title: { text: '' }, title: { text: "" },
legend: { legend: {
show: false, show: false,
icon: 'circle', icon: "circle",
orient: 'vertical', orient: "vertical",
right: 0, right: 0,
top: 'center', top: "center",
align: 'left', align: "left",
data: ['法案', '行政令', '科技智库', '出口管制', '投融资限制', '市场准入'] data: ["法案", "行政令", "科技智库", "出口管制", "投融资限制", "市场准入"]
}, },
radar: { radar: {
shape: 'circle', shape: "circle",
radius: '75%', // 雷达图本身占容器 75% radius: "75%", // 雷达图本身占容器 75%
indicator: [ indicator: [
{ name: '研究人员总数', max: 6500 }, { name: "研究人员总数", max: 6500 },
{ name: '每万人研究人员数', max: 16000 }, { name: "每万人研究人员数", max: 16000 },
{ name: '每万研究人员研发经费投入额', max: 30000 }, { name: "每万研究人员研发经费投入额", max: 30000 },
{ name: '每万人研发经费投入额', max: 38000 }, { name: "每万人研发经费投入额", max: 38000 },
{ name: '研发经费占GDP的比重', max: 52000 }, { name: "研发经费占GDP的比重", max: 52000 },
{ name: '研发经费投入总额', max: 25000 } { name: "研发经费投入总额", max: 25000 }
], ],
axisName: { axisName: {
// 1. 富文本颜色 // 1. 富文本颜色
color: '#3B414B', color: "#3B414B",
fontSize: 14, fontSize: 14,
fontWeight: 600, fontWeight: 600,
// 2. 白色矩形背景 // 2. 白色矩形背景
backgroundColor: '#fff', // 背景色 backgroundColor: "#fff", // 背景色
borderRadius: 4, // 圆角 borderRadius: 4, // 圆角
padding: [4, 8], // 上下 4px，左右 8px padding: [4, 8], // 上下 4px，左右 8px
...@@ -58,52 +58,78 @@ const getBarChart = (nameList, valueList, isPer, dom) => { ...@@ -58,52 +58,78 @@ const getBarChart = (nameList, valueList, isPer, dom) => {
const len = txt.length; const len = txt.length;
if (len <= 5) return txt; if (len <= 5) return txt;
const br = Math.ceil(len / 2); const br = Math.ceil(len / 2);
return txt.substring(0, br) + '\n' + txt.substring(br); return txt.substring(0, br) + "\n" + txt.substring(br);
} }
}, },
splitLine: { splitLine: {
lineStyle: { color: 'rgba(200,200,200,.6)' } lineStyle: { color: "rgba(200,200,200,.6)" }
}, },
splitArea: { show: false }, splitArea: { show: false },
axisLine: { show: false } axisLine: { show: false }
}, },
series: [{ series: [
name: 'Budget vs spending', {
type: 'radar', name: "Budget vs spending",
type: "radar",
data: [ data: [
{ value: [4200, 3000, 20000, 35000, 50000, 18000], name: '法案', areaStyle: { color: 'rgba(10, 87, 166, 0.2)' } }, {
{ value: [5000, 14000, 28000, 26000, 42000, 21000], name: '行政令', areaStyle: { color: 'rgba(206, 79, 81, 0.2)' } }, value: [4200, 3000, 20000, 35000, 50000, 18000],
{ value: [4000, 14000, 18000, 21000, 32000, 10000], name: '科技智库', areaStyle: { color: 'rgba(250, 140, 22, 0.2)' } }, name: "法案",
{ value: [4000, 14000, 18000, 21000, 32000, 10000], name: '出口管制', areaStyle: { color: 'rgba(22, 180, 120, 0.2)' } }, areaStyle: { color: "rgba(10, 87, 166, 0.2)" }
{ value: [4000, 14000, 18000, 21000, 32000, 10000], name: '投融资限制', areaStyle: { color: 'rgba(120, 100, 200, 0.2)' } }, },
{ value: [4000, 14000, 18000, 21000, 32000, 10000], name: '市场准入', areaStyle: { color: 'rgba(255, 100, 150, 0.2)' } } {
value: [5000, 14000, 28000, 26000, 42000, 21000],
name: "行政令",
areaStyle: { color: "rgba(206, 79, 81, 0.2)" }
},
{
value: [4000, 14000, 18000, 21000, 32000, 10000],
name: "科技智库",
areaStyle: { color: "rgba(250, 140, 22, 0.2)" }
},
{
value: [4000, 14000, 18000, 21000, 32000, 10000],
name: "出口管制",
areaStyle: { color: "rgba(22, 180, 120, 0.2)" }
},
{
value: [4000, 14000, 18000, 21000, 32000, 10000],
name: "投融资限制",
areaStyle: { color: "rgba(120, 100, 200, 0.2)" }
},
{
value: [4000, 14000, 18000, 21000, 32000, 10000],
name: "市场准入",
areaStyle: { color: "rgba(255, 100, 150, 0.2)" }
}
]
}
] ]
}]
}; };
// 2. 计算文字所在圆半径（单位 px） // 2. 计算文字所在圆半径（单位 px）
const textRadius = getRadarTextRadius(dom, 75) + 30; // 75 与 radar.radius 保持一致 const textRadius = getRadarTextRadius(dom, 75) + 30; // 75 与 radar.radius 保持一致
// 3. 用“单圈描边”实现「粗线 + 文字在线上」 // 3. 用“单圈描边”实现「粗线 + 文字在线上」
option.graphic = [{ option.graphic = [
type: 'circle', {
type: "circle",
shape: { shape: {
cx: dom.offsetWidth / 2, cx: dom.offsetWidth / 2,
cy: dom.offsetHeight / 2, cy: dom.offsetHeight / 2,
r: textRadius r: textRadius
}, },
style: { style: {
stroke: '#EBECEE', // 线的颜色 stroke: "#EBECEE", // 线的颜色
lineWidth: 6, // 线的粗细（想要再粗就继续加大） lineWidth: 6, // 线的粗细（想要再粗就继续加大）
fill: 'transparent' fill: "transparent"
}, }
// z: 1000 // 保证压在最上层 // z: 1000 // 保证压在最上层
}]; }
];
return option; return option;
}; };
// 1. 先准备一个“半径换算”小工具 // 1. 先准备一个“半径换算”小工具
function getRadarTextRadius(dom, radiusPercent = 75) { function getRadarTextRadius(dom, radiusPercent = 75) {
// 雷达图中心永远在容器中心 // 雷达图中心永远在容器中心
......
src/views/ruleRestriction/index2.vue
浏览文件 @ a6d0a804
...@@ -29,7 +29,7 @@ ...@@ -29,7 +29,7 @@
<div class="btn-icon"> <div class="btn-icon">
<img src="@/assets/icons/arrow-right-icon.png" alt /> <img src="@/assets/icons/arrow-right-icon.png" alt />
</div> </div>
</div> </div>,
<div class="btn" @click="handleToPosi('position4')"> <div class="btn" @click="handleToPosi('position4')">
<div class="btn-text">资源库</div> <div class="btn-text">资源库</div>
<div class="btn-icon"> <div class="btn-icon">
......
src/views/thinkTank/ThinkTankDetail/index.vue
浏览文件 @ a6d0a804
...@@ -17,7 +17,12 @@ ...@@ -17,7 +17,12 @@
<AreaTag v-for="(tag, index) in thinkTank.tags" :key="index" :tagName="tag.industryName"></AreaTag> <AreaTag v-for="(tag, index) in thinkTank.tags" :key="index" :tagName="tag.industryName"></AreaTag>
</div> </div>
</div> </div>
<!-- <div class="header-top-right">{{ '查看智库官网' }}</div> --> <div class="header-top-right">
<button class="blue-btn">
<img class="btn-img" src="./images/image1.png" alt="" />
<span class="text">{{ '查看智库官网' }}</span>
</button>
</div>
</div> </div>
<div class="header-footer"> <div class="header-footer">
<div class="tab" :class="{ tabActive: tabActiveName === '智库动态' }" @click="switchTab('智库动态')"> <div class="tab" :class="{ tabActive: tabActiveName === '智库动态' }" @click="switchTab('智库动态')">
...@@ -94,19 +99,22 @@ onMounted(async () => { ...@@ -94,19 +99,22 @@ onMounted(async () => {
height: 100%; height: 100%;
overflow: hidden; overflow: hidden;
overflow-y: auto; overflow-y: auto;
.header { .header {
width: 100%; width: 100%;
height: 188px; height: 188px;
box-sizing: border-box; box-sizing: border-box;
padding: 0 160px;
border-bottom: 1px solid rgba(234, 236, 238, 1); border-bottom: 1px solid rgb(234, 236, 238);
box-shadow: 0px 0px 20px 0px rgba(25, 69, 130, 0.1); border-top: 1px solid rgb(234, 236, 238);
box-shadow: 0 0 20px 0 rgba(25, 69, 130, 0.1);
background: rgba(255, 255, 255, 1); background: rgba(255, 255, 255, 1);
position: relative; position: relative;
position: sticky; position: sticky;
top: 0; top: 0;
z-index: 99999; z-index: 99999;
overflow: hidden; overflow: visible;
.header-top { .header-top {
width: 1600px; width: 1600px;
margin: 0 auto; margin: 0 auto;
...@@ -116,6 +124,8 @@ onMounted(async () => { ...@@ -116,6 +124,8 @@ onMounted(async () => {
.header-top-left { .header-top-left {
width: 88px; width: 88px;
height: 88px; height: 88px;
img { img {
width: 100%; width: 100%;
height: 100%; height: 100%;
...@@ -130,8 +140,8 @@ onMounted(async () => { ...@@ -130,8 +140,8 @@ onMounted(async () => {
.name { .name {
height: 26px; height: 26px;
color: rgba(59, 65, 75, 1); color: rgb(59, 65, 75);
font-family: Microsoft YaHei; font-family: 'Source Han Sans CN';
font-size: 20px; font-size: 20px;
font-weight: 700; font-weight: 700;
line-height: 26px; line-height: 26px;
...@@ -142,11 +152,11 @@ onMounted(async () => { ...@@ -142,11 +152,11 @@ onMounted(async () => {
.e-name { .e-name {
margin-left: 11px; margin-left: 11px;
height: 26px; height: 26px;
color: rgba(132, 136, 142, 1); color: rgb(132, 136, 142);
font-family: Microsoft YaHei; font-family: 'Source Han Sans CN';
font-size: 14px; font-size: 14px;
font-weight: 400; font-weight: 400;
line-height: 26px; line-height: 22px;
letter-spacing: 0px; letter-spacing: 0px;
text-align: left; text-align: left;
} }
...@@ -156,12 +166,13 @@ onMounted(async () => { ...@@ -156,12 +166,13 @@ onMounted(async () => {
margin-top: 4px; margin-top: 4px;
width: 769px; width: 769px;
height: 24px; height: 24px;
color: rgba(132, 136, 142, 1); color: rgb(132, 136, 142);
font-family: Microsoft YaHei; font-family: 'Source Han Sans CN';
font-size: 16px; font-size: 16px;
font-weight: 400; font-weight: 400;
line-height: 24px; line-height: 24px;
letter-spacing: 0px; letter-spacing: 0px;
text-align: justify;
} }
.center-footer { .center-footer {
...@@ -171,18 +182,71 @@ onMounted(async () => { ...@@ -171,18 +182,71 @@ onMounted(async () => {
.tag { .tag {
height: 26px; height: 26px;
line-height: 26px;
text-align: center;
padding: 0 8px; padding: 1px 8px 1px 8px;
box-sizing: border-box; box-sizing: border-box;
border: 1px solid rgba(231, 243, 255, 1); border: 1px solid rgb(231, 243, 255);
border-radius: 4px; border-radius: 4px;
background: rgba(246, 250, 255, 1); background: rgb(246, 250, 255);
color: rgba(5, 95, 194, 1); position: relative;
display: inline-flex;
align-items: center;
.tag-industryName {
color: rgb(5, 95, 194);
font-family: 'Source Han Sans CN';
font-size: 16px;
font-weight: 400;
line-height: 23px;
text-align: left;
letter-spacing: 0px;
}
}
}
}
.header-top-right {
margin-left: auto;
height: 36px;
box-sizing: border-box;
position: relative;
.blue-btn {
height: 100%;
box-sizing: border-box;
border: none;
outline: none;
border-radius: 6px;
background: rgba(5, 95, 194, 1);
padding: 7px 16px;
display: flex;
align-items: center;
&:focus {
outline: none;
}
.btn-img {
width: 16px;
height: 16px;
margin-left: 0px;
margin-top: 3px;
margin-bottom: 3px;
margin-right: 8px;
}
.text {
color: #fff;
font-family: Microsoft YaHei; font-family: Microsoft YaHei;
font-size: 16px; font-size: 16px;
font-weight: 400; font-weight: 400;
line-height: 24px; line-height: 22px;
} }
} }
} }
...@@ -191,14 +255,14 @@ onMounted(async () => { ...@@ -191,14 +255,14 @@ onMounted(async () => {
.header-footer { .header-footer {
width: 1600px; width: 1600px;
margin: 0 auto; margin: 0 auto;
margin-top: 25px; margin-top: 28px;
height: 48px; height: 48px;
display: flex; display: flex;
gap: 24px; gap: 24px;
.tab { .tab {
width: 94px;
height: 48px; height: 48px;
box-sizing: border-box;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
...@@ -218,21 +282,21 @@ onMounted(async () => { ...@@ -218,21 +282,21 @@ onMounted(async () => {
.text { .text {
height: 24px; height: 24px;
color: rgba(59, 65, 75, 1); color: rgb(59, 65, 75);
font-family: Microsoft YaHei; font-family: 'Source Han Sans CN';
font-size: 18px; font-size: 18px;
font-weight: 400; font-weight: 400;
line-height: 24px; line-height: 24px;
} }
.textActive { .textActive {
color: rgba(5, 95, 194, 1); color: rgb(5, 95, 194);
font-weight: 700; font-weight: 700;
} }
} }
.tabActive { .tab.tabActive {
border-bottom: 2px solid rgba(5, 95, 194, 1); border-bottom: 2px solid rgb(5, 95, 194);
} }
} }
} }
...@@ -241,167 +305,7 @@ onMounted(async () => { ...@@ -241,167 +305,7 @@ onMounted(async () => {
margin: 0 auto; margin: 0 auto;
width: 1600px; width: 1600px;
.main-header {
height: 64px;
display: flex;
justify-content: space-between;
.search-box {
margin-top: 16px;
display: flex;
width: 300px;
height: 32px;
box-sizing: border-box;
border: 1px solid rgba(230, 231, 232, 1);
border-radius: 4px;
background: rgba(255, 255, 255, 1);
.icon {
width: 16px;
height: 16px;
margin: 8px 7px;
cursor: pointer;
img {
width: 100%;
height: 100%;
}
}
}
.select-box {
margin-top: 16px;
margin-right: 5px;
}
}
.main-content {
display: flex;
gap: 16px;
.left {
width: 300px;
height: 806px;
box-sizing: border-box;
border: 1px solid rgba(234, 236, 238, 1);
border-radius: 10px;
box-shadow: 0px 0px 20px 0px rgba(94, 95, 95, 0.1);
background: rgba(255, 255, 255, 1);
position: relative;
.select-box {
margin-top: 21px;
.select-box-header {
display: flex;
gap: 17px;
.icon {
margin-top: 4px;
width: 8px;
height: 16px;
background: var(--color-main-active);
border-radius: 0 4px 4px 0;
}
.title {
height: 24px;
color: var(--color-main-active);
font-family: Microsoft YaHei;
font-size: 16px;
font-weight: 700;
line-height: 24px;
letter-spacing: 1px;
text-align: left;
}
}
.select-main {
margin-left: 25px;
}
.select-main1 {
width: 100px;
}
}
}
.right {
width: 1284px;
height: 1377px;
.card-box {
width: 1284px;
height: 1248px;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
.footer-card {
width: 418px;
height: 300px;
border-radius: 10px;
box-shadow: 0px 0px 20px 0px rgba(25, 69, 130, 0.1);
background: rgba(255, 255, 255, 1);
.footer-card-top {
width: 384px;
height: 206px;
margin: 0 auto;
margin-top: 15px;
img {
width: 100%;
height: 100%;
}
}
.footer-card-title {
margin: 0 auto;
margin-top: 13px;
width: 376px;
height: 24px;
color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei;
font-size: 18px;
font-weight: 700;
line-height: 24px;
}
.footer-card-footer {
margin: 0 auto;
margin-top: 5px;
width: 376px;
height: 22px;
display: flex;
justify-content: space-between;
color: rgba(95, 101, 108, 1);
font-family: Microsoft YaHei;
font-size: 14px;
font-weight: 400;
line-height: 22px;
}
}
}
.right-footer {
margin-top: 43px;
display: flex;
justify-content: space-between;
.info {
height: 19px;
color: rgba(132, 136, 142, 1);
font-family: Microsoft YaHei;
font-size: 14px;
font-weight: 400;
line-height: 18px;
letter-spacing: 0px;
text-align: left;
}
}
}
}
} }
} }
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论