提交 c6505c5b authored 作者: coderBryanFu's avatar coderBryanFu

update

上级 ce8f4051
......@@ -19,7 +19,7 @@
},
"devDependencies": {
"@vitejs/plugin-vue": "^5.0.0",
"sass": "^1.92.1",
"sass": "^1.93.3",
"unplugin-auto-import": "^0.17.0",
"unplugin-vue-components": "^0.26.0",
"vite": "^5.0.0"
......@@ -2554,9 +2554,9 @@
}
},
"node_modules/sass": {
"version": "1.92.1",
"resolved": "https://registry.npmmirror.com/sass/-/sass-1.92.1.tgz",
"integrity": "sha512-ffmsdbwqb3XeyR8jJR6KelIXARM9bFQe8A6Q3W4Klmwy5Ckd5gz7jgUNHo4UOqutU5Sk1DtKLbpDP0nLCg1xqQ==",
"version": "1.93.3",
"resolved": "https://registry.npmmirror.com/sass/-/sass-1.93.3.tgz",
"integrity": "sha512-elOcIZRTM76dvxNAjqYrucTSI0teAF/L2Lv0s6f6b7FOwcwIuA357bIE871580AjHJuSvLIRUosgV+lIWx6Rgg==",
"dev": true,
"license": "MIT",
"dependencies": {
......
......@@ -28,7 +28,7 @@
},
"devDependencies": {
"@vitejs/plugin-vue": "^5.0.0",
"sass": "^1.92.1",
"sass": "^1.93.3",
"unplugin-auto-import": "^0.17.0",
"unplugin-vue-components": "^0.26.0",
"vite": "^5.0.0"
......
......@@ -16,10 +16,10 @@
</div>
<template #dropdown>
<el-dropdown-menu>
<el-dropdown-item command="/">智库首页</el-dropdown-item>
<el-dropdown-item command="/billHome">法案首页</el-dropdown-item>
<el-dropdown-item command="/decree">政令首页</el-dropdown-item>
<el-dropdown-item command="/thinkTank">智库首页</el-dropdown-item>
<el-dropdown-item command="/exportControl">出口管制</el-dropdown-item>
<el-dropdown-item command="/decree">政令</el-dropdown-item>
<el-dropdown-item command="/marketAccessRestrictions">市场准入限制</el-dropdown-item>
</el-dropdown-menu>
</template>
......@@ -50,7 +50,7 @@
</el-header>
<!-- 面包屑导航 -->
<Breadcrumb />
<!-- <Breadcrumb /> -->
<el-main class="main-container">
<router-view />
......
<template>
<div class="wrapper">
<div class="box1"></div>
<div class="box2"></div>
<div class="title">{{ titleText }}</div>
<div class="box3"></div>
</div>
</template>
<script setup>
import { ref, onMounted } from "vue";
const props = defineProps(["titleText"]);
</script>
<style lang="scss" scoped>
.wrapper {
display: flex;
width: 1600px;
height: 42px;
align-items: center;
.box1 {
width: 24px;
height: 30px;
background: rgba(174, 214, 255, 1);
margin-top: 6px;
}
.box2 {
width: 8px;
height: 30px;
margin-left: 8px;
margin-top: 6px;
background: rgba(174, 214, 255, 1);
}
.title {
margin-left: 20px;
height: 42px;
color: rgba(10, 18, 30, 1);
font-family: Microsoft YaHei;
font-size: 32px;
font-weight: 700;
line-height: 42px;
}
.box3 {
flex: 1;
height: 1px;
margin-left: 20px;
background: rgba(174, 214, 255, 1);
}
}
</style>
\ No newline at end of file
......@@ -34,7 +34,7 @@
</template>
<script setup>
import { ref, defineProps } from 'vue'
import { ref } from 'vue'
import { Link } from '@element-plus/icons-vue'
const props = defineProps({
......
......@@ -75,7 +75,7 @@
</template>
<script setup lang="ts">
import { ref, defineProps, onMounted } from 'vue';
import { ref, onMounted } from 'vue';
import { Search } from '@element-plus/icons-vue';
import PolicyList from './PolicyList.vue';
import CardTitle from './CardTitle.vue';
......
import { createRouter, createWebHistory } from "vue-router";
import Home from "../views/Home.vue";
import About from "../views/About.vue";
import ThinkTankDetail from "@/views/ThinkTankDetail/index.vue";
import ReportDetail from "@/views/ReportDetail/index.vue";
// 法案相关组件
// 智库相关
import thinkTank from "../views/thinkTank/index.vue";
import ThinkTankDetail from "@/views/thinkTank/ThinkTankDetail/index.vue";
import ReportDetail from "@/views/thinkTank/ReportDetail/index.vue";
// 法案相关
import BillHome from '@/views/bill/billHome/index.vue'
import BillLayoutContainer from '@/views/bill/billLayout/index.vue'
import BillLayout from '@/views/bill/index.vue'
......@@ -42,21 +43,19 @@ import MarketSingleCaseOverview from "@/views/marketAccessRestrictions/singleCas
import MarketSingleCaseDeepdig from "@/views/marketAccessRestrictions/singleCaseLayout/deepdig/index.vue";
const routes = [
// 智库系统的主要路由
{
path: "/",
name: "Home",
component: Home,
meta: {
title: "首页"
}
path: '/',
redirect: '/billHome'
},
// 智库系统的主要路由
{
path: "/about",
name: "About",
component: About,
path: "/thinkTank",
name: "thinkTank",
component: thinkTank,
meta: {
title: "关于我们"
title: "首页"
}
},
{
......@@ -329,55 +328,52 @@ const routes = [
]
},
// 转移过来的页面
// 出口管制转移过来的页面
{
path: "/analysis",
path: "/exportControl/analysis",
name: "analysis",
component: () => import("@/views/analysis/index.vue"),
component: () => import("@/views/exportControl/analysis/index.vue"),
meta: {
title: "分析页"
}
},
{
path: "/infoplatform",
path: "/exportControl/infoplatform",
name: "infoplatform",
component: () => import("@/views/infoPlatform/index.vue"),
component: () => import("@/views/exportControl/infoPlatform/index.vue"),
meta: {
title: "信息平台"
}
},
{
path: "/rulelimit",
path: "/exportControl/rulelimit",
name: "rulelimit",
component: () => import("@/views/ruleLimit/index.vue"),
component: () => import("@/views/exportControl/ruleLimit/index.vue"),
meta: {
title: "规则限制"
}
},
{
path: "/ruledetail",
path: "/exportControl/ruledetail",
name: "ruledetail",
component: () => import("@/views/ruleDetail/index.vue"),
component: () => import("@/views/exportControl/ruleDetail/index.vue"),
meta: {
title: "规则详情"
}
},
{
path: "/researchfunding",
path: "/exportControl/researchfunding",
name: "researchfunding",
component: () => import("@/views/researchFunding/index.vue"),
component: () => import("@/views/exportControl/researchFunding/index.vue"),
meta: {
title: "科研资助"
}
},
{
path: "/decree",
name: "decree",
component: () => import("@/views/decree/index.vue"),
meta: {
title: "政令信息"
}
}
// 门户路由放在这块
];
const router = createRouter({
......
<template>
<div class="about">
<el-row :gutter="20">
<el-col :span="24">
<el-card>
<template #header>
<div class="card-header">
<el-icon><InfoFilled /></el-icon>
<span>关于 Think Tank</span>
</div>
</template>
<div class="about-content">
<el-row :gutter="20">
<el-col :span="12">
<h3>项目介绍</h3>
<p>Think Tank 是一个基于 Vue 3 + Element Plus + Vue Router 构建的现代化前端项目模板。</p>
<p>该项目采用了最新的前端技术栈,提供了完整的开发环境配置和项目结构,帮助开发者快速启动新项目。</p>
<h3>技术特性</h3>
<el-timeline>
<el-timeline-item timestamp="Vue 3" placement="top">
<el-card>
<h4>Vue 3 Composition API</h4>
<p>使用最新的 Composition API,提供更好的逻辑复用和类型推导</p>
</el-card>
</el-timeline-item>
<el-timeline-item timestamp="Element Plus" placement="top">
<el-card>
<h4>Element Plus UI 组件库</h4>
<p>基于 Vue 3 的企业级 UI 组件库,提供丰富的组件和主题定制</p>
</el-card>
</el-timeline-item>
<el-timeline-item timestamp="Vue Router" placement="top">
<el-card>
<h4>Vue Router 4</h4>
<p>Vue.js 官方路由管理器,支持动态路由和路由守卫</p>
</el-card>
</el-timeline-item>
<el-timeline-item timestamp="Vite" placement="top">
<el-card>
<h4>Vite 构建工具</h4>
<p>下一代前端构建工具,提供极速的开发体验</p>
</el-card>
</el-timeline-item>
</el-timeline>
</el-col>
<el-col :span="12">
<h3>项目结构</h3>
<el-tree
:data="projectStructure"
:props="treeProps"
default-expand-all
:expand-on-click-node="false"
>
<template #default="{ node, data }">
<span class="tree-node">
<el-icon v-if="data.type === 'folder'"><Folder /></el-icon>
<el-icon v-else><Document /></el-icon>
<span>{{ node.label }}</span>
</span>
</template>
</el-tree>
<h3 style="margin-top: 30px;">开发指南</h3>
<el-steps :active="3" finish-status="success">
<el-step title="安装依赖" description="npm install"></el-step>
<el-step title="启动开发" description="npm run dev"></el-step>
<el-step title="构建项目" description="npm run build"></el-step>
<el-step title="部署上线" description="部署到服务器"></el-step>
</el-steps>
</el-col>
</el-row>
</div>
</el-card>
</el-col>
</el-row>
<el-row :gutter="20" style="margin-top: 20px;">
<el-col :span="8">
<el-card>
<template #header>
<div class="card-header">
<el-icon><Star /></el-icon>
<span>版本信息</span>
</div>
</template>
<el-descriptions :column="1" border>
<el-descriptions-item label="项目版本">1.0.0</el-descriptions-item>
<el-descriptions-item label="Vue">^3.4.0</el-descriptions-item>
<el-descriptions-item label="Element Plus">^2.4.4</el-descriptions-item>
<el-descriptions-item label="Vue Router">^4.2.5</el-descriptions-item>
<el-descriptions-item label="Vite">^5.0.0</el-descriptions-item>
</el-descriptions>
</el-card>
</el-col>
<el-col :span="8">
<el-card>
<template #header>
<div class="card-header">
<el-icon><Link /></el-icon>
<span>相关链接</span>
</div>
</template>
<div class="links">
<el-button type="primary" link @click="openLink('https://vuejs.org/')">
<el-icon><Link /></el-icon>
Vue.js 官网
</el-button>
<el-button type="primary" link @click="openLink('https://element-plus.org/')">
<el-icon><Link /></el-icon>
Element Plus 官网
</el-button>
<el-button type="primary" link @click="openLink('https://router.vuejs.org/')">
<el-icon><Link /></el-icon>
Vue Router 官网
</el-button>
<el-button type="primary" link @click="openLink('https://vitejs.dev/')">
<el-icon><Link /></el-icon>
Vite 官网
</el-button>
</div>
</el-card>
</el-col>
<el-col :span="8">
<el-card>
<template #header>
<div class="card-header">
<el-icon><ChatDotRound /></el-icon>
<span>联系我们</span>
</div>
</template>
<div class="contact">
<p><el-icon><Message /></el-icon> 邮箱:contact@thinktank.com</p>
<p><el-icon><Phone /></el-icon> 电话:+86 123-4567-8900</p>
<p><el-icon><Location /></el-icon> 地址:北京市朝阳区</p>
<el-button type="success" style="width: 100%; margin-top: 10px;">
<el-icon><ChatDotRound /></el-icon>
在线咨询
</el-button>
</div>
</el-card>
</el-col>
</el-row>
</div>
</template>
<script setup>
import { ref } from 'vue'
import { ElMessage } from 'element-plus'
import {
InfoFilled,
Folder,
Document,
Star,
Link,
ChatDotRound,
Message,
Phone,
Location
} from '@element-plus/icons-vue'
// 项目结构数据
const projectStructure = ref([
{
label: 'think-tank',
type: 'folder',
children: [
{
label: 'src',
type: 'folder',
children: [
{ label: 'views', type: 'folder' },
{ label: 'router', type: 'folder' },
{ label: 'components', type: 'folder' },
{ label: 'App.vue', type: 'file' },
{ label: 'main.js', type: 'file' }
]
},
{ label: 'package.json', type: 'file' },
{ label: 'vite.config.js', type: 'file' },
{ label: 'index.html', type: 'file' }
]
}
])
const treeProps = {
children: 'children',
label: 'label'
}
// 打开链接
const openLink = (url) => {
window.open(url, '_blank')
ElMessage.success('正在打开链接...')
}
</script>
<style scoped>
.about {
max-width: 1200px;
margin: 0 auto;
}
.about-content h3 {
color: #409eff;
margin-bottom: 16px;
border-bottom: 2px solid #409eff;
padding-bottom: 8px;
}
.about-content p {
color: #606266;
line-height: 1.6;
margin-bottom: 16px;
}
.card-header {
display: flex;
align-items: center;
gap: 8px;
font-weight: bold;
}
.tree-node {
display: flex;
align-items: center;
gap: 8px;
}
.links {
display: flex;
flex-direction: column;
gap: 12px;
}
.contact p {
display: flex;
align-items: center;
gap: 8px;
margin-bottom: 12px;
}
</style>
\ No newline at end of file
差异被折叠。
const getWordCloudChart = (data) => {
const option = {
grid: {
left: 0,
top: 0,
right: 0,
bottom: 0,
},
series: [
{
type: "wordCloud",
shape: "rect", //
// 其他形状你可以使用形状路径
// 或者自定义路径
// shape: 'circle' // 圆形(默认)
// shape: 'rect' // 矩形
// shape: 'roundRect' // 圆角矩形
// shape: 'triangle' // 三角形
// shape: 'diamond' // 菱形
// shape: 'pentagon' // 五边形
// shape: 'star' // 星形
// shape: 'cardioid' // 心形
gridSize: 5, // 网格大小,影响词间距。
sizeRange: [10, 30], // 定义词云中文字大小的范围
rotationRange: [0, 0],
rotationStep: 10,
drawOutOfBound: false, // 是否超出画布
// 字体
textStyle: {
// normal: {
// color: function () {
// return 'rgb(' + [
// Math.round(Math.random() * 160),
// Math.round(Math.random() * 160),
// Math.round(Math.random() * 160)
// ].join(',') + ')';
// }
// },
color: function () {
let colors = [
"rgba(189, 33, 33, 1)",
"rgba(232, 151, 21, 1)",
"rgba(220, 190, 68, 1)",
"rgba(96, 58, 186, 1)",
"rgba(32, 121, 69, 1)",
"rgba(22, 119, 255, 1)",
];
return colors[parseInt(Math.random() * colors.length)];
},
emphasis: {
shadowBlur: 5,
shadowColor: "#333",
},
},
// 设置词云数据
data: data,
},
],
}
return option
}
export default getWordCloudChart
\ No newline at end of file
......@@ -74,22 +74,36 @@ const setActiveTab = tabName => {
}
.tab-item {
padding: 12px 24px;
font-size: 14px;
width: 120px;
height: 40px;
text-align: center;
line-height: 30px;
// padding: 12px 24px;
font-size: 18px;
color: #606266;
cursor: pointer;
border-bottom: 2px solid transparent;
border-bottom: 3px solid transparent;
transition: all 0.3s;
box-sizing: border-box;
}
// .tab-item.active {
// color: #409eff;
// border-bottom-color: #409eff;
// background-color: rgba(64, 158, 255, 0.1);
// }
.tab-item.active {
color: #409eff;
border-bottom-color: #409eff;
background-color: rgba(64, 158, 255, 0.1);
color: var(--color-main-active);
font-family: Microsoft YaHei;
font-size: 18px;
font-weight: 700;
line-height: 30px;
border-bottom: 3px solid var(--color-main-active);
}
.tab-item:hover {
color: #409eff;
color: var(--color-main-active);
}
.action-buttons {
......@@ -99,8 +113,6 @@ const setActiveTab = tabName => {
.content-section {
padding: 24px;
/* padding-left: 2%;
padding-right: 2%; */
min-height: 400px;
}
......@@ -167,4 +179,5 @@ const setActiveTab = tabName => {
height: 18px;
}
}
</style>
<template>
<div class="home-wrapper">
<div class="home-header">
<span>国家科技安全 </span>> <span>中美博弈概览 </span>>
<span>出口管制 </span>
</div>
<div class="home-main">
<div class="home-main-header">
<!-- <div class="home-main-header-top">
<span>国家科技安全 </span>> <span>中美博弈概览 </span>>
<span style="color: #1459bb; font-weight: bold">出口管制 </span>
</div> -->
<div class="home-main-header-center">
<!-- <el-input v-model="input" style="width: 800px; height: 100%" placeholder="搜索出口管制调查" />
<div class="search">
<div class="search-icon">
<img src="./assets/images/search-icon.png" alt="" />
</div>
<div class="search-text">搜索</div>
</div> -->
<el-input
v-model="searchKey"
style="width: 100%; height: 48px"
......@@ -26,19 +18,15 @@
<div class="home-main-header-footer">
<div class="home-main-header-footer-item">
<div class="item-top">142</div>
<div class="item-footer">总调查案件数</div>
<div class="item-footer">实体清单</div>
</div>
<div class="home-main-header-footer-item">
<div class="item-top">28</div>
<div class="item-footer">调查中案件数</div>
<div class="item-footer">商业管制清单</div>
</div>
<div class="home-main-header-footer-item">
<div class="item-top">326</div>
<div class="item-footer">涉及中企</div>
</div>
<div class="home-main-header-footer-item">
<div class="item-top">38%</div>
<div class="item-footer">胜诉/和解率</div>
<div class="item-footer">关键和新型技术清单</div>
</div>
</div>
</div>
......@@ -46,7 +34,7 @@
<el-col :span="16">
<custom-container titleType="primary" title="最新出口管制政策" :titleIcon="houseIcon" height="450px">
<template #header-right>
<el-button type="primary" link>
<el-button type="primary" @click="handleToDetail" link>
{{ "查看详情 >" }}
</el-button>
</template>
......@@ -567,6 +555,12 @@ import shoushiIcon from "./assets/images/shoushi.png";
import tianyiIcon from "./assets/images/tianyi.png";
import aircasIcon from "./assets/images/aircas.png";
const handleToDetail = () => {
router.push({
path: '/exportControl/analysis'
})
}
const billList = ref([]);
const curBillListIndex = ref(0);
......@@ -1408,6 +1402,19 @@ onMounted(async () => {
box-shadow: none;
}
.home-header {
height: 64px;
color: #fff;
font-family: Microsoft YaHei;
font-size: 20px;
font-weight: 700;
line-height: 26px;
line-height: 64px;
background: url("@/assets/images/nav-bg.png");
box-sizing: border-box;
padding-left: 160px;
}
.box1 {
display: flex;
flex-direction: column;
......@@ -1832,7 +1839,7 @@ onMounted(async () => {
}
.home-main-header-footer {
margin-top: 38px;
width: 960px;
width: 700px;
height: 64px;
box-sizing: border-box;
padding: 0 108px;
......
差异被折叠。
差异被折叠。
差异被折叠。
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论