Skip to content

R
risk-monitor
提交 90255a86 authored 作者: 付康's avatar 付康
浏览文件
操作

合并分支 'zz-dev' 到 'master'

feat:按照要求完善智库主页智库动态智库报告、国会听证会，部分完善政策追踪，完善开发样式颜色部分 查看合并请求 !130
上级 e3816e87 69298145
全部展开 显示空白字符变更
内嵌 并排
正在显示 包含 159 行增加 和 198 行删除
src/components/base/messageBubble/index.vue
浏览文件 @ 90255a86
......@@ -4,7 +4,9 @@
<div class="header-icon">
<img src="./image1.png" alt="" />
</div>
<div class="header-title">{{ "社交媒体" }}</div>
<div class="header-title">
<slot name='title'>{{ "社交媒体" }}</slot>
</div>
<div class="more" @click="handleToMoreNews">{{ "更多 +" }}</div>
</div>
<div class="box4-main">
......@@ -148,7 +150,7 @@ const handleToMoreNews = (item) => {
}
.header-title {
width: 80px;
width: 100%;
margin-top: 11px;
margin-left: 18px;
height: 26px;
......
src/components/devStyle/components/constStyle.vue
浏览文件 @ 90255a86
......@@ -3,7 +3,9 @@ import { ElSpace, ElButton } from 'element-plus';
import "@/styles/main.css"
import { copyToClipboardThenTip } from '@/utils/systemUtils'
const colors = [
// 黑色到白色主色一行
const rowBlackToWhite = [
{ title: "黑色", name: "--text-primary-color" },
{ title: "黑色90% / 主标题文字颜色", name: "--text-primary-90-color" },
{ title: "黑色80% / 小标题文字颜色", name: "--text-primary-80-color" },
{ title: "黑色65% / 正文颜色", name: "--text-primary-65-color" },
......@@ -12,7 +14,25 @@ const colors = [
{ title: "黑色5% / 分割线颜色", name: "--bg-black-5" },
{ title: "黑色2% / 灰色背景色", name: "--bg-black-2" },
{ title: "白色主色", name: "--bg-white-100" },
]
// 主色到主色高亮背景一行（主色高亮背景为浅色，需黑色文字）
const rowPrimaryToHighlight = [
{ 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) {
const color = `var(${item.name})`
......@@ -23,13 +43,36 @@ function copyColorVar(item) {
<template>
<el-space direction="vertical" alignment="flex-start">
<div class="text-title-2">颜色</div>
<el-space>
<el-button v-for="(item, index) in colors" :key="index" :color="`var(${item.name})`"
v-on:click="copyColorVar(item)">
<el-space direction="vertical" alignment="flex-start">
<el-space wrap>
<el-button v-for="(item, index) in rowBlackToWhite" :key="'bw-' + index" :color="`var(${item.name})`"
@click="copyColorVar(item)">
{{ item.title }}
</el-button>
</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>
</template>
<style scoped></style>
\ No newline at end of file
<style scoped>
/* 浅色背景按钮：文字黑色 */
:deep(.color-btn-text-black) {
color: var(--el-color-black) !important;
}
</style>
\ No newline at end of file
src/styles/main.css
浏览文件 @ 90255a86
......@@ -39,10 +39,22 @@
/* 主色 设计定义*/
--color-primary-100: #055FC2;
--color-primary-50: #82AFE0;
--color-primary-35: #AED6FF;
--color-primary-50: #89C1FF;
--color-primary-35: #B9DCFF;
--color-primary-10: #E7F3FF;
--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 {
......
src/views/ruleRestriction/index2.vue
浏览文件 @ 90255a86
......@@ -29,7 +29,7 @@
<div class="btn-icon">
<img src="@/assets/icons/arrow-right-icon.png" alt />
</div>
</div>
</div>,
<div class="btn" @click="handleToPosi('position4')">
<div class="btn-text">资源库</div>
<div class="btn-icon">
......
src/views/thinkTank/ThinkTankDetail/index.vue
浏览文件 @ 90255a86
......@@ -17,7 +17,12 @@
<AreaTag v-for="(tag, index) in thinkTank.tags" :key="index" :tagName="tag.industryName"></AreaTag>
</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 class="header-footer">
<div class="tab" :class="{ tabActive: tabActiveName === '智库动态' }" @click="switchTab('智库动态')">
......@@ -94,19 +99,22 @@ onMounted(async () => {
height: 100%;
overflow: hidden;
overflow-y: auto;
.header {
width: 100%;
height: 188px;
box-sizing: border-box;
padding: 0 160px;
border-bottom: 1px solid rgba(234, 236, 238, 1);
box-shadow: 0px 0px 20px 0px rgba(25, 69, 130, 0.1);
border-bottom: 1px solid rgb(234, 236, 238);
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);
position: relative;
position: sticky;
top: 0;
z-index: 99999;
overflow: hidden;
overflow: visible;
.header-top {
width: 1600px;
margin: 0 auto;
......@@ -116,6 +124,8 @@ onMounted(async () => {
.header-top-left {
width: 88px;
height: 88px;
img {
width: 100%;
height: 100%;
......@@ -130,8 +140,8 @@ onMounted(async () => {
.name {
height: 26px;
color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei;
color: rgb(59, 65, 75);
font-family: 'Source Han Sans CN';
font-size: 20px;
font-weight: 700;
line-height: 26px;
......@@ -142,11 +152,11 @@ onMounted(async () => {
.e-name {
margin-left: 11px;
height: 26px;
color: rgba(132, 136, 142, 1);
font-family: Microsoft YaHei;
color: rgb(132, 136, 142);
font-family: 'Source Han Sans CN';
font-size: 14px;
font-weight: 400;
line-height: 26px;
line-height: 22px;
letter-spacing: 0px;
text-align: left;
}
......@@ -156,12 +166,13 @@ onMounted(async () => {
margin-top: 4px;
width: 769px;
height: 24px;
color: rgba(132, 136, 142, 1);
font-family: Microsoft YaHei;
color: rgb(132, 136, 142);
font-family: 'Source Han Sans CN';
font-size: 16px;
font-weight: 400;
line-height: 24px;
letter-spacing: 0px;
text-align: justify;
}
.center-footer {
......@@ -171,18 +182,71 @@ onMounted(async () => {
.tag {
height: 26px;
line-height: 26px;
text-align: center;
padding: 0 8px;
padding: 1px 8px 1px 8px;
box-sizing: border-box;
border: 1px solid rgba(231, 243, 255, 1);
border: 1px solid rgb(231, 243, 255);
border-radius: 4px;
background: rgba(246, 250, 255, 1);
color: rgba(5, 95, 194, 1);
background: rgb(246, 250, 255);
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-size: 16px;
font-weight: 400;
line-height: 24px;
line-height: 22px;
}
}
}
......@@ -191,14 +255,14 @@ onMounted(async () => {
.header-footer {
width: 1600px;
margin: 0 auto;
margin-top: 25px;
margin-top: 28px;
height: 48px;
display: flex;
gap: 24px;
.tab {
width: 94px;
height: 48px;
box-sizing: border-box;
display: flex;
align-items: center;
justify-content: center;
......@@ -218,21 +282,21 @@ onMounted(async () => {
.text {
height: 24px;
color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei;
color: rgb(59, 65, 75);
font-family: 'Source Han Sans CN';
font-size: 18px;
font-weight: 400;
line-height: 24px;
}
.textActive {
color: rgba(5, 95, 194, 1);
color: rgb(5, 95, 194);
font-weight: 700;
}
}
.tabActive {
border-bottom: 2px solid rgba(5, 95, 194, 1);
.tab.tabActive {
border-bottom: 2px solid rgb(5, 95, 194);
}
}
}
......@@ -241,167 +305,7 @@ onMounted(async () => {
margin: 0 auto;
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;
}
}
}
}
}
}
......
src/views/thinkTank/index.vue
浏览文件 @ 90255a86
......@@ -13,7 +13,7 @@
</div> -->
<div class="home-main-header-center">
<SearchContainer style="margin-bottom: 0; margin-top: 48px; height: fit-content" v-if="containerRef"
<SearchContainer style="margin-bottom: 0; margin-top: 51px; height: fit-content" v-if="containerRef"
placeholder="搜索智库报告" :containerRef="containerRef" areaName="智库" />
<!-- <el-input v-model="searchThinktankText" @keyup.enter="handleSearch"
style="width: 838px; height: 100%" placeholder="搜索智库报告" />
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论