Skip to content

R
risk-monitor
提交 94286d3e authored 作者: 李智林's avatar 李智林
浏览文件
操作

规则限制和科研资助体系页面的更新

上级 f0b6e7f7
全部展开 隐藏空白字符变更
内嵌 并排
正在显示 包含 483 行增加 和 1 行删除
src/router/index.js
浏览文件 @ 94286d3e
...@@ -70,6 +70,11 @@ import Chat from '@/views/comprehensiveSearch/chat/index.vue' ...@@ -70,6 +70,11 @@ import Chat from '@/views/comprehensiveSearch/chat/index.vue'
// 合作限制 // 合作限制
import CooperationRestrictions from "@/views/coopRestriction/index.vue"; import CooperationRestrictions from "@/views/coopRestriction/index.vue";
import CooperationRestrictionsDetail from "@/views/coopRestriction/detail/index.vue"; import CooperationRestrictionsDetail from "@/views/coopRestriction/detail/index.vue";
// 规则限制
import RuleRestriction from "@/views/ruleRestriction/index.vue";
import RuleRestrictionDetail from "@/views/ruleRestriction/detail/index.vue";
// 科研资助体系
import ScientificFunding from "@/views/scientificFunding/index.vue";
...@@ -679,9 +684,37 @@ const routes = [ ...@@ -679,9 +684,37 @@ const routes = [
meta: { meta: {
title: "搜索结果" title: "搜索结果"
} }
} },
// 规则限制
{
path: "/ruleRestriction",
name: "ruleRestriction",
component: RuleRestriction,
meta: {
title: "规则限制"
}
},
// 规则限制详情
{
path: "/ruleRestriction/detail",
name: "ruleRestrictionDetail",
component: RuleRestrictionDetail,
meta: {
title: "规则限制详情"
}
},
// 科研资助体系
{
path: "/scientificFunding",
name: "scientificFunding",
component: ScientificFunding,
meta: {
title: "科研资助体系"
}
},
]; ];
const router = createRouter({ const router = createRouter({
history: createWebHistory(), history: createWebHistory(),
routes routes
......
src/views/ruleRestriction/common/comTitle.vue 0 → 100644
浏览文件 @ 94286d3e
<template>
<div class="com-title">
<div class="cl1"></div>
<div class="cl2"></div>
<div class="title">{{ title }}</div>
<div class="cl3"></div>
</div>
</template>
<script setup>
import { ref } from "vue";
// 传入的title数据
const props = defineProps({
title: {
type: String,
default: ""
}
});
</script>
<style scoped lang="scss">
* {
margin: 0;
padding: 0;
}
.com-title {
width: 1575px;
height: 42px;
display: flex;
align-items: center;
.cl1 {
width: 24px;
height: 30px;
background-color: rgba(174, 214, 255, 1);
margin-right: 8px;
}
.cl2 {
width: 8px;
height: 30px;
background-color: rgba(174, 214, 255, 1);
margin-right: 8px;
}
.title {
width: 152px;
height: 42px;
text-align: center;
font-size: 32px;
font-weight: 700;
font-family: 'Microsoft YaHei';
line-height: 42px;
margin-right: 8px;
}
.cl3 {
width: 1367px;
height: 1px;
background-color: rgba(174, 214, 255, 1);
box-sizing: border-box;
}
}
</style>
src/views/ruleRestriction/detail/index.vue 0 → 100644
浏览文件 @ 94286d3e
差异被折叠。
src/views/ruleRestriction/index.vue 0 → 100644
浏览文件 @ 94286d3e
<template>
<div class="coop-page">
<!-- 面包屑 -->
<div class="breadcrumb">
<div class="breadcrumb-box">
<div class="breadcrumb-item">国家科技安全</div>
<div class="breadcrumb-item">&nbsp;>&nbsp;</div>
<div class="breadcrumb-item back-item" @click="handleBackHome">中美博弈概览</div>
<div class="breadcrumb-item">&nbsp;>&nbsp;</div>
<div class="breadcrumb-item">规则限制</div>
</div>
</div>
<!-- 主页面 -->
<div class="main-content">
<!-- 搜索栏部分 -->
<div class="search">
<div class="search-main">
<input v-model="input" placeholder="搜索规则限制" class="search-input" />
<div class="search-btn">
<img src="./assets/icons/search-icon.png" alt="" />
搜索
</div>
</div>
<div class="search-center">
<div class="search-item">
<div class="search-item-num">190</div>
<div class="search-item-name">规则限制政令</div>
</div>
<div class="search-item">
<div class="search-item-num">125</div>
<div class="search-item-name">规则限制实体</div>
</div>
<div class="search-item">
<div class="search-item-num">18</div>
<div class="search-item-name">排华科技联盟</div>
</div>
<div class="search-item">
<div class="search-item-num">12</div>
<div class="search-item-name">排华国家数量</div>
</div>
</div>
<div class="search-bottom">
<div class="btn">
<div class="btn-text">最新动态</div>
<div class="btn-icon">></div>
</div>
<div class="btn">
<div class="btn-text">咨询要闻</div>
<div class="btn-icon">></div>
</div>
<div class="btn">
<div class="btn-text">数据总览</div>
<div class="btn-icon">></div>
</div>
<div class="btn">
<div class="btn-text">资源库</div>
<div class="btn-icon">></div>
</div>
</div>
</div>
<!-- 最新动态 -->
<div class="newdata">
<com-title title="最新动态" />
<div class="newdata-main">
<newData />
</div>
</div>
<!-- 资讯要问 -->
<div class="ask">
<com-title title="咨询要闻" />
<div class="ask-main">
<askPage />
</div>
</div>
<!-- 数据总览 -->
<div class="datasub">
<com-title title="数据总览" />
<div class="datasub-main">
<dataSub />
</div>
</div>
<!-- 资源库 -->
<div class="reslib">
<com-title title="资源库" />
<div class="reslib-main">
<resLib />
</div>
</div>
</div>
</div>
</template>
<script setup>
import { ref } from "vue";
import { useRouter } from "vue-router";
import comTitle from "./common/comTitle.vue";
import newData from "./components/dataNew/index.vue";
import askPage from "./components/askPage/index.vue";
import dataSub from "./components/dataSub/index.vue";
import resLib from "./components/resLib/index.vue";
import { useContainerScroll } from "@/hooks/useScrollShow";
// 搜索框
const input = ref("");
const router = useRouter();
// 返回首页
const handleBackHome = () => {
router.push({
path: "/overview"
});
};
</script>
<style scoped lang="scss">
* {
margin: 0;
padding: 0;
}
.coop-page {
width: 100%;
height: 100%;
.breadcrumb {
width: 100%;
height: 64px;
background-image: url("./assets/images/bread-bg.png");
background-size: cover;
padding: 17px 0px 21px 0px;
.breadcrumb-box {
margin-left: 160px;
display: flex;
// align-items: center;
.breadcrumb-item {
font-size: 20px;
font-weight: 700;
font-family: "Microsoft YaHei";
line-height: 30px;
color: #fff;
}
.back-item {
cursor: pointer;
&:hover {
color: #999;
}
}
}
}
.main-content {
overflow: auto;
width: 100%;
height: calc(100% - 64px);
background: url("./assets/images/background.png");
background-size: 100% 100%;
padding: 44px 160px 30px 160px;
.search {
width: 960px;
height: 225px;
margin: 0 auto 68px auto;
.search-main {
display: flex;
padding-right: 3px;
align-items: center;
justify-content: space-between;
box-shadow: 0px 0px 20px 0px rgba(25, 69, 130, 0.1);
width: 960px;
height: 48px;
background-color: rgba(255, 255, 255, 0.65);
border-radius: 10px;
border: 1px solid #fff;
.search-input {
border: none;
outline: none;
width: 800px;
height: 48px;
background-color: transparent;
font-size: 16px;
padding: 12px 16px;
font-weight: 400;
font-family: "Microsoft YaHei";
line-height: 24px;
color: rgb(132, 136, 142);
}
.search-btn {
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
width: 120px;
height: 42px;
border-radius: 8px;
background-color: rgb(5, 95, 194);
font-size: 18px;
font-weight: 400;
font-family: "Microsoft YaHei";
line-height: 24px;
color: #fff;
img {
width: 22px;
height: 22px;
margin-right: 8px;
}
}
}
.search-center {
width: 600px;
height: 57px;
margin: 36px auto;
display: flex;
align-items: center;
justify-content: space-between;
.search-item {
box-sizing: border-box;
width: 120px;
height: 57px;
.search-item-num {
width: 120px;
height: 22px;
font-size: 36px;
font-weight: 700;
font-family: "Microsoft YaHei";
line-height: 22px;
color: rgb(5, 95, 194);
text-align: center;
cursor: pointer;
}
.search-item-name {
width: 120px;
height: 24px;
margin-top: 11px;
font-size: 16px;
font-weight: 400;
font-family: "Microsoft YaHei";
line-height: 24px;
color: rgb(95, 101, 108);
text-align: center;
}
}
}
.search-bottom {
width: 688px;
height: 48px;
margin: 0 auto;
display: flex;
justify-content: space-between;
// gap: 16px;
.btn {
display: flex;
width: 160px;
height: 48px;
border: 1px solid rgba(174, 214, 255, 1);
box-sizing: border-box;
border-radius: 32px;
justify-content: center;
align-items: center;
background: rgba(231, 243, 255, 1);
position: relative;
cursor: pointer;
padding: 10px 40px 12px 36px;
box-shadow: 0px 0px 20px 0px rgba(25, 69, 130, 0.1);
&:hover {
background: #cae3fc;
}
.btn-text {
color: rgb(5, 95, 194);
font-family: "Microsoft YaHei";
font-size: 20px;
font-weight: 400;
line-height: 26px;
height: 26px;
}
.btn-icon {
position: absolute;
top: 14px;
right: 19px;
color: rgb(5, 95, 194);
font-size: 20px;
font-weight: 400;
}
}
}
}
.newdata {
width: 1600px;
height: 538px;
margin: 36px auto 64px auto;
.newdata-main {
width: 1600px;
height: 460px;
margin-top: 36px;
}
}
.ask {
width: 1600px;
height: 528px;
margin: 0 auto 64px auto;
.ask-main {
width: 1600px;
height: 450px;
margin-top: 36px;
}
}
.datasub {
width: 1600px;
height: 538px;
margin: 0 auto 88px auto;
.datasub-main {
width: 1600px;
height: 460px;
margin-top: 36px;
}
}
.reslib {
width: 1600px;
height: 1633px;
margin: 0 auto 0px auto;
.reslib-main {
width: 1600px;
height: 1565px;
margin-top: 26px;
}
}
}
}
</style>
src/views/scientificFunding/common/comTitle.vue 0 → 100644
浏览文件 @ 94286d3e
<template>
<div class="com-title">
<div class="cl1"></div>
<div class="cl2"></div>
<div class="title">{{ title }}</div>
<div class="cl3"></div>
</div>
</template>
<script setup>
import { ref } from "vue";
// 传入的title数据
const props = defineProps({
title: {
type: String,
default: ""
}
});
</script>
<style scoped lang="scss">
* {
margin: 0;
padding: 0;
}
.com-title {
width: 1575px;
height: 42px;
display: flex;
align-items: center;
.cl1 {
width: 24px;
height: 30px;
background-color: rgba(174, 214, 255, 1);
margin-right: 8px;
}
.cl2 {
width: 8px;
height: 30px;
background-color: rgba(174, 214, 255, 1);
margin-right: 8px;
}
.title {
width: 152px;
height: 42px;
text-align: center;
font-size: 32px;
font-weight: 700;
font-family: 'Microsoft YaHei';
line-height: 42px;
margin-right: 8px;
}
.cl3 {
width: 1367px;
height: 1px;
background-color: rgba(174, 214, 255, 1);
box-sizing: border-box;
}
}
</style>
src/views/scientificFunding/index.vue 0 → 100644
浏览文件 @ 94286d3e
差异被折叠。
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论