提交 4d2068b3 authored 作者: coderBryanFu's avatar coderBryanFu

出口管制样式优化

上级 2afd5596
......@@ -276,7 +276,7 @@
</div>
<div class="box4-main">
<div class="box4-main-item" v-for="(item, index) in messageList" :key="index">
<div class="left">
<div class="left" @click="handleClcikToCharacter(index)">
<img :src="item.img" alt="" />
</div>
<div class="right">
......@@ -379,7 +379,12 @@
</el-select>
</div>
<div class="box8-main">
<div class="box8-main-item" v-for="(item, index) in box8Data" :key="index">
<div
class="box8-main-item"
v-for="(item, index) in box8Data"
:key="index"
@click="handleClcikToCharacter(0)"
>
<div class="box8-main-item-left">
<img :src="item.img" alt="" />
<div class="left-icon1">
......@@ -558,7 +563,36 @@
</div>
</div>
<div class="right-main">
<div class="right-main-box"></div>
<div class="right-main-box" v-for="(item, index) in footerBillList" :key="index">
<div class="header">
<div class="title">{{ item.name }}</div>
<div class="en-title">{{ item.eName }}</div>
</div>
<div class="main">
<div class="item">
<div class="item-left">{{ "提案人:" }}</div>
<div class="item-right">{{ item.tcr }}</div>
</div>
<div class="item">
<div class="item-left">{{ "委员会:" }}</div>
<div class="item-right">{{ item.wyh }}</div>
</div>
<div class="item">
<div class="item-left">{{ "相关领域:" }}</div>
<div class="item-right1">
<div class="tag" v-for="(val, idx) in item.areaList" :key="idx">{{ val }}</div>
</div>
</div>
<div class="item">
<div class="item-left">{{ "最新动议:" }}</div>
<div class="item-right">{{ item.zxdy }}</div>
</div>
<div class="item">
<div class="item-left">{{ "法案进展:" }}</div>
<div class="item-right2"></div>
</div>
</div>
</div>
<div class="right-main-box"></div>
<div class="right-main-box"></div>
<div class="right-main-box"></div>
......@@ -648,9 +682,29 @@ import Cyy from "@/assets/icons/cyy.png";
import Zyy from "@/assets/icons/zyy.png";
import Ghd from "@/assets/icons/ghd.png";
import Mzd from "@/assets/icons/mzd.png";
import { iteratee } from "lodash";
const searchBillText = ref("");
// 跳转人物主页
const handleClcikToCharacter = index => {
let type;
if (index === 0) {
type = 2;
} else if (index === 1) {
type = 1;
} else {
type = 3;
}
const route = router.resolve({
path: "/characterPage",
query: {
type: type
}
});
window.open(route.href, "_blank");
};
// 返回首页
const handleBackHome = () => {
router.push({
......@@ -1455,6 +1509,36 @@ const footerSelectList2 = ref([
]);
const footerSelect2 = ref("全部提出议员");
const footerBillList = ref([
{
name: "H.R.1-大而美法案",
eName: "One Big Beautiful Bill Act",
tcr: "乔迪·阿灵顿等2人",
wyh: "众议院-预算委员会",
areaList: ["集成电路", "人工智能"],
zxdy: "2025.07.04 成为公法 No: 119-21",
progress: []
},
{
name: "H.R.1-大而美法案",
eName: "One Big Beautiful Bill Act",
tcr: "乔迪·阿灵顿等2人",
wyh: "众议院-预算委员会",
areaList: ["集成电路", "人工智能"],
zxdy: "2025.07.04 成为公法 No: 119-21",
progress: []
},
{
name: "H.R.1-大而美法案",
eName: "One Big Beautiful Bill Act",
tcr: "乔迪·阿灵顿等2人",
wyh: "众议院-预算委员会",
areaList: ["集成电路", "人工智能"],
zxdy: "2025.07.04 成为公法 No: 119-21",
progress: []
}
]);
onMounted(async () => {
handleGetHylyList();
......@@ -2406,6 +2490,7 @@ onUnmounted(() => {});
margin-top: 5px;
width: 36px;
height: 36px;
cursor: pointer;
img {
width: 100%;
height: 100%;
......@@ -2733,12 +2818,17 @@ onUnmounted(() => {});
height: 340px;
.box8-main-item {
margin: 0 auto;
width: 458px;
width: 478px;
height: 51px;
margin-bottom: 16px;
display: flex;
align-items: center;
position: relative;
padding: 0 10px;
cursor: pointer;
&:hover {
background: var(--color-bg-hover);
}
.box8-main-item-left {
position: relative;
width: 42px;
......@@ -2801,7 +2891,7 @@ onUnmounted(() => {});
.box8-main-item-right {
position: absolute;
top: 0;
right: 0;
right: 10px;
width: 92px;
height: 51px;
text-align: right;
......@@ -3001,13 +3091,90 @@ onUnmounted(() => {});
}
.right-main {
height: 1264px;
overflow: hidden;
.right-main-box {
width: 1280px;
height: 300px;
border-radius: 10px;
box-shadow: 0px 0px 20px 0px rgba(25, 69, 130, 0.1);
box-shadow: 0px 0px 10px 0px rgba(25, 69, 130, 0.1);
background: rgba(255, 255, 255, 1);
margin-bottom: 16px;
overflow: hidden;
.header {
height: 91px;
width: 1200px;
margin: 0 auto;
border-bottom: 1px solid rgba(234, 236, 238, 1);
.title {
margin-top: 19px;
height: 26px;
color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei;
font-size: 20px;
font-weight: 700;
line-height: 26px;
letter-spacing: 0px;
text-align: left;
}
.en-title {
margin-top: 8px;
height: 24px;
color: rgba(95, 101, 108, 1);
font-family: Microsoft YaHei;
font-size: 16px;
font-weight: 400;
line-height: 24px;
letter-spacing: 0px;
text-align: left;
}
}
.main {
width: 1200px;
margin: 0 auto;
margin-top: 2px;
.item {
margin-top: 12px;
height: 24px;
display: flex;
.item-left {
width: 91px;
height: 24px;
color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei;
font-size: 16px;
font-weight: 700;
line-height: 24px;
letter-spacing: 1px;
text-align: left;
}
.item-right {
margin-left: 10px;
color: rgba(95, 101, 108, 1);
font-family: Microsoft YaHei;
font-size: 16px;
font-weight: 400;
line-height: 24px;
letter-spacing: 0px;
text-align: left;
}
.item-right1 {
margin-left: 10px;
display: flex;
gap: 8px;
.tag {
height: 24px;
line-height: 24px;
padding: 0 8px;
border-radius: 4px;
background: rgba(231, 243, 255, 1);
color: var(--color-main-active);
font-family: Microsoft YaHei;
font-size: 14px;
font-weight: 400;
}
}
}
}
}
}
.right-footer {
......
......@@ -36,7 +36,7 @@
<div class="section-header" style=" margin-top: 24px;">
<div style="display: flex;">
<div class="section-icon"></div>
<h3 class="section-title">年度研发投入对比</h3>
<h3 class="section-title">年度研发投入对比111</h3>
</div>
<div class="action-icons">
<img src="@/assets/icons/download.png" alt="下载" class="action-icon">
......
......@@ -117,8 +117,11 @@ onMounted(async () => {
}
.text {
margin-left: 4px;
height: 35px;
height: 70px;
line-height: 35px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.line {
margin-left: 7px;
......@@ -151,9 +154,13 @@ onMounted(async () => {
background: rgba(174, 208, 255, 1);
}
.text {
width: 100px;
margin-right: 4px;
height: 35px;
line-height: 35px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.icon {
margin-top: 7px;
......@@ -201,9 +208,13 @@ onMounted(async () => {
}
}
.text {
width: 100px;
margin-left: 4px;
height: 35px;
line-height: 35px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.line {
margin-left: 7px;
......@@ -236,9 +247,13 @@ onMounted(async () => {
background: rgba(174, 208, 255, 1);
}
.text {
width: 100px;
margin-right: 4px;
height: 35px;
line-height: 35px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.icon {
margin-top: 7px;
......@@ -286,9 +301,13 @@ onMounted(async () => {
}
}
.text {
width: 100px;
margin-left: 4px;
height: 35px;
line-height: 35px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.line {
margin-left: 7px;
......@@ -321,9 +340,13 @@ onMounted(async () => {
background: rgba(174, 208, 255, 1);
}
.text {
width: 100px;
margin-right: 4px;
height: 35px;
line-height: 35px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.icon {
margin-top: 7px;
......@@ -371,9 +394,13 @@ onMounted(async () => {
}
}
.text {
width: 100px;
margin-left: 4px;
height: 35px;
line-height: 35px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.line {
margin-left: 7px;
......@@ -406,9 +433,13 @@ onMounted(async () => {
background: rgba(174, 208, 255, 1);
}
.text {
width: 100px;
margin-right: 4px;
height: 35px;
line-height: 35px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.icon {
margin-top: 7px;
......@@ -456,9 +487,13 @@ onMounted(async () => {
}
}
.text {
width: 100px;
margin-left: 4px;
height: 35px;
line-height: 35px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.line {
margin-left: 7px;
......@@ -491,9 +526,13 @@ onMounted(async () => {
background: rgba(174, 208, 255, 1);
}
.text {
width: 100px;
margin-right: 4px;
height: 35px;
line-height: 35px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.icon {
margin-top: 7px;
......@@ -541,9 +580,13 @@ onMounted(async () => {
}
}
.text {
width: 100px;
margin-left: 4px;
height: 35px;
line-height: 35px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.line {
margin-left: 7px;
......@@ -576,9 +619,13 @@ onMounted(async () => {
background: rgba(174, 208, 255, 1);
}
.text {
width: 100px;
margin-right: 4px;
height: 35px;
line-height: 35px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.icon {
margin-top: 7px;
......
......@@ -402,6 +402,7 @@ onMounted(() => {
margin-right: 32px;
margin-top: 3px;
height: 35px;
border-bottom: 2px solid transparent;
cursor: pointer;
// &:hover{
// .name {
......@@ -433,7 +434,7 @@ onMounted(() => {
}
}
.leftBoxBottomItemActive {
border-bottom: 3px solid rgba(20, 89, 187, 1);
border-bottom: 2px solid rgba(20, 89, 187, 1);
}
}
}
......
......@@ -91,12 +91,11 @@ function moreClick() {
}
.titleWrap {
margin-left: 16px;
height: 16px;
line-height: 16px;
height: 26px;
line-height: 26px;
color: var(--color-main-active);
font-size: 16px;
font-size: 20px;
font-weight: 600;
line-height: 16px;
}
.rightWrap {
display: flex;
......
......@@ -399,7 +399,7 @@
<el-checkbox v-model="checked" label="50%规则" size="large" />
</template>
<template #default>
<EChart :option="radarOption" autoresize :style="{ height: '450px' }" />
<EChart :option="radarOption" autoresize :style="{ height: '380px' }" />
</template>
</custom-container>
</el-col>
......@@ -474,7 +474,7 @@
</template>
</el-table-column>
<el-table-column prop="domains" label="涉及领域" min-width="180">
<el-table-column prop="domains" label="涉及领域" min-width="150">
<template #default="scope">
<div class="domain-tags">
<el-tag
......@@ -514,12 +514,19 @@
<el-table-column prop="revenue" label="50%规则子企业" width="280" align="right">
<template #default="scope">
<span
:class="['revenue-cell', scope.row.revenue === '无营收数据' ? 'no-revenue' : '']"
<div class="num-item">
<div
class="name-item"
:class="[
'revenue-cell',
scope.row.revenue === '无营收数据' ? 'no-revenue' : ''
]"
>
{{ scope.row.name }}...等
<span style="color: #409eff">{{ scope.row.ruleOrgCount }}家> </span>
</span>
</div>
<div style="width: 50px; color: #409eff">{{ scope.row.ruleOrgCount }}家></div>
</div>
</template>
</el-table-column>
</el-table>
......@@ -841,9 +848,6 @@ const radarOption = ref({
title: {
text: ""
},
// grid: {
// top: 100
// },
legend: {
top: 0,
icon: "circle",
......@@ -2462,6 +2466,17 @@ onMounted(async () => {
text-align: justify;
}
.num-item {
width: 280px;
display: flex;
.name-item{
width: 215px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
}
:deep(.el-input__wrapper) {
box-shadow: none;
border-radius: 10px;
......@@ -2473,4 +2488,23 @@ onMounted(async () => {
:deep(.el-input__wrapper.is-focus) {
box-shadow: none !important;
}
:deep(.el-table thead) {
color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei;
font-size: 16px;
font-weight: 700;
line-height: 22px;
letter-spacing: 0px;
text-align: left;
}
:deep(.el-table tr) {
color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei;
font-size: 16px;
font-weight: 400;
line-height: 24px;
letter-spacing: 0px;
text-align: justify;
}
</style>
......@@ -12,10 +12,10 @@ const getMultiLineChart = (dataX, dataY1, dataY2) => {
}
},
grid: {
top: '8%',
right: '5%',
bottom: '5%',
left: '5%',
top: '5%',
right: '3%',
bottom: '3%',
left: '3%',
containLabel: true
},
legend: {
......
......@@ -1192,7 +1192,7 @@ onMounted(() => {
.btn {
color: rgba(95, 101, 108, 1);
font-family: Microsoft YaHei;
font-size: 16px;
font-size: 18px;
font-weight: 400;
line-height: 42px;
padding: 0 24px;
......@@ -1211,6 +1211,7 @@ onMounted(() => {
border-radius: 21px;
background: rgba(20, 89, 187, 1);
color: #fff;
font-weight: 700;
&:hover {
color: #fff;
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论