提交 7d4aa2d3 authored 作者: 张烨's avatar 张烨

fix:优化小问题

上级 672ee8d7
import request from "@/api/request.js"; import request from "@/api/request.js";
// 最新科技政令 // 最新科技政令
export function getDepartmentList() { export function getDepartmentList(params) {
return request({ return request({
method: 'GET', method: 'GET',
url: `/api/administrativeDict/department`, url: `/api/administrativeDict/department?pageSize`,
}) })
} }
......
...@@ -18,7 +18,7 @@ const decreeRoutes = [ ...@@ -18,7 +18,7 @@ const decreeRoutes = [
name: "Decree", name: "Decree",
component: Decree, component: Decree,
meta: { meta: {
title: "政令概览" title: "科技政令概况"
} }
}, },
{ {
......
...@@ -64,7 +64,7 @@ ...@@ -64,7 +64,7 @@
</div> </div>
</div> --> </div> -->
<div class="home-main-header-item-box"> <div class="home-main-header-item-box">
<div class="item" v-for="(item, index) in govInsList" :key="index" @click="handleToInstitution(item)"> <div class="item" v-for="(item, index) in govInsList.slice(0, 12)" :key="index" @click="handleToInstitution(item)">
<div class="item-left"> <div class="item-left">
<img :src="item.img ? item.img : DefaultIcon2" alt="" /> <img :src="item.img ? item.img : DefaultIcon2" alt="" />
</div> </div>
...@@ -115,15 +115,7 @@ ...@@ -115,15 +115,7 @@
{{ item.name }} {{ item.name }}
</div> </div>
<div class="box1-main-right-info"> <div class="box1-main-right-info">
<!-- <div class="tag" :class="{ <AreaTag v-for="(tag, index) in item.industryList" :key="index" :tagName="tag.industryName" />
tag1: tag.status == 1,
tag2: tag.status == 2,
tag3: tag.status == 3
}" v-for="(tag, index) in item.industryList" :key="index">
{{ tag.industryName }}
</div> -->
<AreaTag v-for="(tag, index) in item.industryList" :key="index" :tagName="tag.industryName">
</AreaTag>
</div> </div>
<div class="box1-main-right-center"> <div class="box1-main-right-center">
{{ item.describe }} {{ item.describe }}
...@@ -243,23 +235,21 @@ ...@@ -243,23 +235,21 @@
<div class="header-title">{{ "关键行政令" }}</div> <div class="header-title">{{ "关键行政令" }}</div>
</div> </div>
<div class="box7-main"> <div class="box7-main">
<div class="box7-item" v-for="(item, index) in keyDecreeList" :key="index" @click="handleKeyDecree(item)"> <div class="box7-list">
<div class="icon"> <div class="box7-item" v-for="(item, index) in keyDecreeList.slice(0, 3)" :key="index" @click="handleKeyDecree(item)">
<img src="./assets/images/warning.png" alt="" /> <div class="icon">
</div> <img src="./assets/images/warning.png" alt="" />
<div class="info"> </div>
<div class="info-header"> <div class="info">
<div class="title">{{ item.title }}</div> <div class="info-header">
<div class="time">{{ item.time }}</div> <div class="title">{{ item.title }}</div>
<div class="time">{{ item.time }}</div>
</div>
<div class="info-content">{{ item.content ? item.content : "暂无数据" }}</div>
</div> </div>
<div class="info-content">{{ item.content ? item.content : "暂无数据" }}</div>
<!-- <el-popover effect="dark" :width="800" :content="item.content" placement="top-start">
<template #reference>
<div class="info-content">{{ item.content ? item.content : "暂无数据" }}</div>
</template>
</el-popover> -->
</div> </div>
</div> </div>
<SimplePagination v-model:current-page="keyDecreeInfo.page" :page-size="3" :total="keyDecreeInfo.total" @page-change="handleGetKeyDecree" />
</div> </div>
</div> </div>
<div class="box8"> <div class="box8">
...@@ -276,7 +266,7 @@ ...@@ -276,7 +266,7 @@
</div> </div>
</div> </div>
<div class="home-main-footer"> <div class="home-main-footer">
<DivideHeader id="position4" class="divide4" :titleText="'资源库'"></DivideHeader> <DivideHeader id="position4" class="divide4" :titleText="'科技政令库'"></DivideHeader>
<div class="home-main-footer-header"> <div class="home-main-footer-header">
<div class="search-box"> <div class="search-box">
<el-select v-model="searchType" :empty-values="[null, undefined]" style="width: 100%"> <el-select v-model="searchType" :empty-values="[null, undefined]" style="width: 100%">
...@@ -308,38 +298,23 @@ ...@@ -308,38 +298,23 @@
</div> </div>
<div class="select-main"> <div class="select-main">
<div class="checkbox-group"> <div class="checkbox-group">
<el-checkbox v-for="type in decreeTypeList" :key="type.id" v-model="checkedDecreeType" <el-checkbox v-for="type in decreeTypeList" :key="type.id" v-model="checkedDecreeType" :label="type.typeId"
:label="type.typeId" style="width: 180px" class="filter-checkbox" style="width: 180px" class="filter-checkbox"
@change="handleChangeCheckedDecreeType"> @change="handleChangeCheckedDecreeType">
{{ type.typeName }} {{ type.typeName }}
</el-checkbox> </el-checkbox>
</div> </div>
</div> </div>
</div> </div>
<!-- <div class="select-box">
<div class="select-box-header">
<div class="icon"></div>
<div class="title">{{ "发布机构" }}</div>
</div>
<div class="select-main">
<div class="checkbox-group">
<el-checkbox v-for="cate in govInsList" :key="cate.id" v-model="checkedGovIns"
:label="cate.id" style="width: 180px" class="filter-checkbox"
@change="handleChangeCheckedGovIns">
{{ cate.name }}
</el-checkbox>
</div>
</div>
</div> -->
<div class="select-box"> <div class="select-box">
<div class="select-box-header"> <div class="select-box-header">
<div class="icon"></div> <div class="icon"></div>
<div class="title">{{ "科技领域" }}</div> <div class="title">{{ "科技领域" }}</div>
</div> </div>
<div class="select-main select-main1"> <div class="select-main">
<div class="checkbox-group"> <div class="checkbox-group">
<el-checkbox v-for="area in areaList" :key="area.id" v-model="activeAreaList" :label="area.id" <el-checkbox v-for="area in areaList" :key="area.id" v-model="activeAreaList" :label="area.id"
style="width: 100px" @change="checked => handleAreaChange(area.id, checked)"> style="width: 100px" class="filter-checkbox" @change="checked => handleAreaChange(area.id, checked)">
{{ area.name }} {{ area.name }}
</el-checkbox> </el-checkbox>
</div> </div>
...@@ -353,28 +328,12 @@ ...@@ -353,28 +328,12 @@
<div class="select-main"> <div class="select-main">
<div class="checkbox-group"> <div class="checkbox-group">
<el-checkbox v-for="time in pubTime" :key="time.id" v-model="activePubTime" :label="time.id" <el-checkbox v-for="time in pubTime" :key="time.id" v-model="activePubTime" :label="time.id"
style="width: 100px" class="filter-checkbox" style="width: 100px" class="filter-checkbox" @change="checked => handlePubTimeChange(time.id, checked)">
@change="checked => handlePubTimeChange(time.id, checked)">
{{ time.name }} {{ time.name }}
</el-checkbox> </el-checkbox>
</div> </div>
</div> </div>
</div> </div>
<!-- <div class="select-box">
<div class="select-box-header">
<div class="icon"></div>
<div class="title">{{ "涉及领域" }}</div>
</div>
<div class="select-main select-main1">
<div class="checkbox-group">
<el-checkbox v-for="area in areaList" :key="area.id" v-model="activeAreaList"
:label="area.id" style="width: 100px"
@change="checked => handleAreaChange(area.id, checked)">
{{ area.name }}
</el-checkbox>
</div>
</div>
</div> -->
</div> </div>
<div class="right"> <div class="right">
<div class="content-header"> <div class="content-header">
...@@ -405,9 +364,7 @@ ...@@ -405,9 +364,7 @@
</div> </div>
<div class="desc">{{ item.desc }}</div> <div class="desc">{{ item.desc }}</div>
<div class="tag-box"> <div class="tag-box">
<div class="tag" v-for="(val, idx) in item.tagList" :key="idx"> <AreaTag v-for="(tag, index) in item.tagList" :key="index" :tagName="tag.industryName" />
{{ val.industryName }}
</div>
</div> </div>
</div> </div>
</div> </div>
...@@ -429,9 +386,10 @@ ...@@ -429,9 +386,10 @@
</template> </template>
<script setup> <script setup>
import { onMounted, ref, watch, nextTick } from "vue"; import { onMounted, ref, watch, nextTick, reactive } from "vue";
import router from "@/router"; import router from "@/router";
import WordCloudChart from "@/components/base/WordCloundChart/index.vue" import WordCloudChart from "@/components/base/WordCloundChart/index.vue"
import SimplePagination from "@/components/SimplePagination.vue";
import { import {
getDepartmentList, getDepartmentList,
getLatestDecree, getLatestDecree,
...@@ -481,20 +439,9 @@ const handleCurrentChange = page => { ...@@ -481,20 +439,9 @@ const handleCurrentChange = page => {
}; };
// 页面 header // 页面 header
const govInsList = ref([ const govInsList = ref([]);
// {
// img: Gov1,
// name: "美国白宫"
// },
// {
// img: Gov2,
// name: "美国财政部"
// },
]);
const checkedGovIns = ref([]); const checkedGovIns = ref([]);
const handleChangeCheckedGovIns = val => { };
const handleGetDepartmentList = async () => { const handleGetDepartmentList = async () => {
try { try {
const res = await getDepartmentList(); const res = await getDepartmentList();
...@@ -915,12 +862,17 @@ const handleBox6YearChange = () => { ...@@ -915,12 +862,17 @@ const handleBox6YearChange = () => {
// 关键行政令 // 关键行政令
const keyDecreeList = ref([]); const keyDecreeList = ref([]);
const keyDecreeInfo = reactive({
total: 0,
page: 1,
})
const handleGetKeyDecree = async () => { const handleGetKeyDecree = async () => {
try { try {
const res = await getKeyDecree(); const res = await getKeyDecree();
console.log("关键行政令", res); console.log("关键行政令", res);
if (res.code === 200 && res.data) { if (res.code === 200 && res.data) {
keyDecreeInfo.total = res.total || 0;
keyDecreeList.value = res.data.map(item => { keyDecreeList.value = res.data.map(item => {
return { return {
title: item.name, title: item.name,
...@@ -975,22 +927,6 @@ const handleToPosi = id => { ...@@ -975,22 +927,6 @@ const handleToPosi = id => {
} }
}; };
// const handleGetAreaList = async () => {
// try {
// const res = await getDecreehylyList();
// console.log("行业领域列表", res);
// if (res.code === 200 && res.data) {
// areaList.value = res.data.map(item => {
// return {
// name: item.name,
// id: item.id
// };
// });
// console.log("areaList", areaList.value);
// }
// } catch (error) { }
// };
// 政令类型 // 政令类型
const decreeTypeList = ref([]); const decreeTypeList = ref([]);
const checkedDecreeType = ref([]); const checkedDecreeType = ref([]);
...@@ -1081,7 +1017,7 @@ const handleGetAreaList = async () => { ...@@ -1081,7 +1017,7 @@ const handleGetAreaList = async () => {
console.log("行业领域列表", res); console.log("行业领域列表", res);
if (res.code === 200 && res.data) { if (res.code === 200 && res.data) {
areaList.value = [ areaList.value = [
{ name: "全", id: "all" }, { name: "全部领域", id: "all" },
...res.data.map(item => { ...res.data.map(item => {
return { return {
name: item.name, name: item.name,
...@@ -1688,15 +1624,10 @@ onMounted(async () => { ...@@ -1688,15 +1624,10 @@ onMounted(async () => {
line-height: 26px; line-height: 26px;
display: -webkit-box; display: -webkit-box;
/* 将元素设置为弹性盒模型 */
-webkit-line-clamp: 2; -webkit-line-clamp: 2;
/* 限制文本显示的行数 */
-webkit-box-orient: vertical; -webkit-box-orient: vertical;
/* 设置弹性盒子的子元素垂直排列 */
overflow: hidden; overflow: hidden;
/* 隐藏溢出的内容 */
text-overflow: ellipsis; text-overflow: ellipsis;
/* 文本溢出时显示省略号 */
} }
.box1-main-right-info { .box1-main-right-info {
...@@ -1704,58 +1635,21 @@ onMounted(async () => { ...@@ -1704,58 +1635,21 @@ onMounted(async () => {
display: flex; display: flex;
height: 24px; height: 24px;
gap: 8px; gap: 8px;
.tag {
height: 24px;
line-height: 24px;
padding: 0 8px;
box-sizing: border-box;
border-radius: 4px;
margin-right: 5px;
border: 1px solid rgba(255, 163, 158, 1);
color: rgba(245, 34, 45, 1);
background: rgba(255, 241, 240, 1);
}
.tag1 {
border: 1px solid rgba(135, 232, 222, 1);
color: rgba(19, 168, 168, 1);
background: rgba(230, 255, 251, 1);
}
.tag2 {
border: 1px solid rgba(186, 224, 255, 1);
background: rgba(230, 244, 255, 1);
color: rgba(22, 119, 255, 1);
}
.tag3 {
border: 1px solid rgba(255, 229, 143, 1);
color: rgba(250, 173, 20, 1);
background: rgba(255, 251, 230, 1);
}
.tag4 {
border: 1px solid rgba(255, 163, 158, 1);
color: rgba(245, 34, 45, 1);
background: rgba(255, 241, 240, 1);
}
} }
.box1-main-right-center { .box1-main-right-center {
margin-top: 10px; margin-top: 10px;
height: 200px; height: 180px;
color: rgba(59, 65, 75, 1); color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei; font-family: Microsoft YaHei;
font-size: 16px; font-size: 16px;
font-weight: 400; font-weight: 400;
line-height: 30px; line-height: 30px;
display: -webkit-box; display: -webkit-box;
/* 将元素设置为弹性盒模型 */ -webkit-line-clamp: 6;
-webkit-box-orient: vertical;
overflow: hidden; overflow: hidden;
/* 隐藏溢出的内容 */
text-overflow: ellipsis; text-overflow: ellipsis;
/* 文本溢出时显示省略号 */
} }
.box1-main-right-footer { .box1-main-right-footer {
...@@ -2710,15 +2604,6 @@ onMounted(async () => { ...@@ -2710,15 +2604,6 @@ onMounted(async () => {
font-weight: 400; font-weight: 400;
} }
} }
.info-content {
margin-top: 3px;
color: rgba(95, 101, 108, 1);
font-family: Microsoft YaHei;
font-size: 16px;
font-weight: 400;
line-height: 30px;
}
} }
} }
} }
...@@ -2892,81 +2777,85 @@ onMounted(async () => { ...@@ -2892,81 +2777,85 @@ onMounted(async () => {
.box7-main { .box7-main {
margin-top: 10px; margin-top: 10px;
height: 380px;
box-sizing: border-box;
overflow-y: auto;
overflow-x: hidden;
.box7-item { .box7-list {
width: 730px; height: 320px;
margin-top: 16px;
margin-left: 25px;
display: flex;
cursor: pointer;
&:hover { .box7-item {
background: var(--color-bg-hover); width: 730px;
} margin-top: 16px;
margin-left: 25px;
.icon { display: flex;
margin-top: 6px; cursor: pointer;
width: 24px;
height: 22px;
img { &:hover {
width: 100%; background: var(--color-bg-hover);
height: 100%;
} }
}
.info { .icon {
margin-left: 13px; margin-top: 6px;
width: 100%; width: 24px;
height: 22px;
.info-header { img {
height: 24px; width: 100%;
display: flex; height: 100%;
margin-top: 4px; }
justify-content: space-between; }
.title { .info {
width: 600px; margin-left: 13px;
width: 100%;
.info-header {
height: 24px; height: 24px;
color: rgba(59, 65, 75, 1); display: flex;
font-family: Microsoft YaHei; margin-top: 4px;
font-size: 18px; justify-content: space-between;
font-weight: 700;
line-height: 24px; .title {
overflow: hidden; width: 600px;
text-overflow: ellipsis; height: 24px;
white-space: nowrap; color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei;
font-size: 18px;
font-weight: 700;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.time {
width: 91px;
height: 24px;
color: rgba(95, 101, 108, 1);
font-family: Microsoft YaHei;
font-size: 16px;
font-weight: 400;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
} }
.time { .info-content {
width: 91px; min-height: 24px;
height: 24px; max-height: 48px;
margin-top: 6px;
color: rgba(95, 101, 108, 1); color: rgba(95, 101, 108, 1);
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: 24px;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap;
} }
} }
.info-content {
min-height: 24px;
max-height: 48px;
margin-top: 6px;
color: rgba(95, 101, 108, 1);
font-family: Microsoft YaHei;
font-size: 16px;
font-weight: 400;
line-height: 24px;
overflow: hidden;
}
} }
} }
} }
...@@ -3027,7 +2916,6 @@ onMounted(async () => { ...@@ -3027,7 +2916,6 @@ onMounted(async () => {
.home-main-footer { .home-main-footer {
margin-top: 34px; margin-top: 34px;
max-height: 1860px;
padding-bottom: 160px; padding-bottom: 160px;
background: rgba(248, 249, 250, 1); background: rgba(248, 249, 250, 1);
overflow: hidden; overflow: hidden;
...@@ -3121,16 +3009,21 @@ onMounted(async () => { ...@@ -3121,16 +3009,21 @@ onMounted(async () => {
.left { .left {
width: 360px; width: 360px;
box-shadow: 0px 0px 15px 0px rgba(60, 87, 126, 0.2); height: 100%;
background: rgba(255, 255, 255, 1); padding-bottom: 24px;
box-sizing: border-box;
border: 1px solid rgba(234, 236, 238, 1);
border-radius: 10px; 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 { .select-box {
margin-top: 16px; margin-top: 16px;
.select-box-header { .select-box-header {
display: flex; display: flex;
gap: 16px; gap: 17px;
.icon { .icon {
margin-top: 4px; margin-top: 4px;
...@@ -3143,7 +3036,7 @@ onMounted(async () => { ...@@ -3143,7 +3036,7 @@ onMounted(async () => {
.title { .title {
height: 24px; height: 24px;
color: var(--color-main-active); color: var(--color-main-active);
font-family: Microsoft YaHei; font-family: "Source Han Sans CN";
font-size: 16px; font-size: 16px;
font-weight: 700; font-weight: 700;
line-height: 24px; line-height: 24px;
...@@ -3153,11 +3046,20 @@ onMounted(async () => { ...@@ -3153,11 +3046,20 @@ onMounted(async () => {
} }
.select-main { .select-main {
margin-left: 25px; margin-left: 24px;
} margin-top: 12px;
.checkbox-group {
display: grid;
grid-template-columns: repeat(2, 160px);
gap: 8px 4px;
.select-main1 { .filter-checkbox {
width: 260px; width: 160px;
height: 24px;
margin-right: 0 !important;
}
}
} }
} }
} }
...@@ -3165,7 +3067,6 @@ onMounted(async () => { ...@@ -3165,7 +3067,6 @@ onMounted(async () => {
.right { .right {
width: 20px; width: 20px;
flex: auto; flex: auto;
max-height: 1489px;
box-shadow: 0px 0px 15px 0px rgba(60, 87, 126, 0.2); box-shadow: 0px 0px 15px 0px rgba(60, 87, 126, 0.2);
background: rgba(255, 255, 255, 1); background: rgba(255, 255, 255, 1);
box-sizing: border-box; box-sizing: border-box;
...@@ -3201,12 +3102,9 @@ onMounted(async () => { ...@@ -3201,12 +3102,9 @@ onMounted(async () => {
} }
.content-box { .content-box {
max-height: 1367px;
border-bottom: 1px solid rgba(234, 236, 238, 1); border-bottom: 1px solid rgba(234, 236, 238, 1);
overflow: hidden; overflow: hidden;
min-height: 790px; min-height: 790px;
overflow: hidden;
overflow-y: auto;
box-sizing: border-box; box-sizing: border-box;
.main-item { .main-item {
...@@ -3337,20 +3235,6 @@ onMounted(async () => { ...@@ -3337,20 +3235,6 @@ onMounted(async () => {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
gap: 8px; gap: 8px;
.tag {
height: 28px;
line-height: 28px;
text-align: center;
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;
letter-spacing: 0px;
}
} }
} }
} }
......
...@@ -8,22 +8,16 @@ ...@@ -8,22 +8,16 @@
<div class="layout-main-header-left-box"> <div class="layout-main-header-left-box">
<div class="left-box-top"> <div class="left-box-top">
<div class="icon"> <div class="icon">
<img <img :src="summaryInfo.imageUrl || USALogo" alt="" />
v-if="summaryInfo.imageUrl"
:src="summaryInfo.imageUrl"
alt=""
style="height: 40px; margin-top: 12px"
/>
<img v-else :src="USALogo" alt="" />
</div> </div>
<div class="info"> <div class="info">
<div class="info-box1">{{ summaryInfo.name }}</div> <div class="info-box1 one-line-ellipsis">{{ summaryInfo.name || "--" }}</div>
<div class="info-box2"> <div class="info-box2">
<div class="info-box2-item item1">{{ summaryInfo.postDate }}</div> <div class="info-box2-item">{{ summaryInfo.postDate || "--" }}</div>
| |
<div class="info-box2-item item2">{{ summaryInfo.orgName }}</div> <div class="info-box2-item">{{ summaryInfo.orgName || "--" }}</div>
| |
<div class="info-box2-item item3">{{ summaryInfo.ename }}</div> <div class="info-box2-item one-line-ellipsis">{{ summaryInfo.ename || "--" }}</div>
</div> </div>
</div> </div>
</div> </div>
...@@ -47,8 +41,8 @@ ...@@ -47,8 +41,8 @@
</div> </div>
<div class="layout-main-header-right-box"> <div class="layout-main-header-right-box">
<div class="right-box-top"> <div class="right-box-top">
<div class="time">{{ summaryInfo.postDate }}</div> <div class="time">{{ summaryInfo.postDate || "--" }}</div>
<div class="name">{{ summaryInfo.orgName }}</div> <div class="name">{{ summaryInfo.orgName || "--" }}</div>
</div> </div>
<div class="right-box-bottom"> <div class="right-box-bottom">
<div class="btn" @click="handleShowReport"> <div class="btn" @click="handleShowReport">
...@@ -377,9 +371,9 @@ onMounted(() => { ...@@ -377,9 +371,9 @@ onMounted(() => {
flex-direction: column; flex-direction: column;
.header-main { .header-main {
width: 100%; width: 100%;
background-color: #fff; border-bottom: 1px solid rgba(234, 236, 238, 1);
box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.05); box-shadow: 0px 0px 20px 0px rgba(25, 69, 130, 0.1);
overflow: hidden; background: rgba(255, 255, 255, 1);
} }
.layout-main-header { .layout-main-header {
width: 1600px; width: 1600px;
...@@ -396,30 +390,32 @@ onMounted(() => { ...@@ -396,30 +390,32 @@ onMounted(() => {
margin: 0 auto; margin: 0 auto;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center;
} }
.layout-main-header-left-box { .layout-main-header-left-box {
width: 1100px; width: 20px;
margin-top: 13px; flex: auto;
margin-top: 12px;
.left-box-top { .left-box-top {
height: 64px; height: 64px;
display: flex; display: flex;
align-items: center; align-items: center;
.icon { .icon {
width: 64px; width: 64px;
height: 64px; height: 40px;
border-radius: 4px;
overflow: hidden; overflow: hidden;
img { img {
width: 100%; width: 100%;
height: 100%; height: 100%;
object-fit: fill;
} }
} }
.info { .info {
width: 700px; margin-left: 10px;
margin-left: 9px; margin-right: 40px;
width: 20px;
flex: auto;
.info-box1 { .info-box1 {
width: 700px; width: 100%;
color: rgba(59, 65, 75, 1); color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei; font-family: Microsoft YaHei;
font-size: 20px; font-size: 20px;
...@@ -428,9 +424,6 @@ onMounted(() => { ...@@ -428,9 +424,6 @@ onMounted(() => {
letter-spacing: 0px; letter-spacing: 0px;
text-align: left; text-align: left;
margin-top: 5px; margin-top: 5px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
} }
.info-box2 { .info-box2 {
margin-top: 5px; margin-top: 5px;
...@@ -444,15 +437,13 @@ onMounted(() => { ...@@ -444,15 +437,13 @@ onMounted(() => {
letter-spacing: 0px; letter-spacing: 0px;
text-align: left; text-align: left;
display: flex; display: flex;
margin-left: -10px;
.info-box2-item { .info-box2-item {
white-space: nowrap;
padding: 0 10px; padding: 0 10px;
} }
.item3 { .info-box2-item:first-child {
max-width: 420px; padding-left: 0px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
} }
} }
} }
...@@ -498,9 +489,9 @@ onMounted(() => { ...@@ -498,9 +489,9 @@ onMounted(() => {
} }
} }
.layout-main-header-right-box { .layout-main-header-right-box {
width: 450px;
margin-top: 19px;
.right-box-top { .right-box-top {
white-space: nowrap;
padding-top: 11px;
.time { .time {
height: 24px; height: 24px;
line-height: 24px; line-height: 24px;
...@@ -710,49 +701,5 @@ onMounted(() => { ...@@ -710,49 +701,5 @@ onMounted(() => {
} }
} }
} }
// .tool-box {
// position: fixed;
// z-index: 10000;
// bottom: 80px;
// left: 0;
// width: 48px;
// height: 144px;
// border-radius: 0px 10px 10px 0px;
// box-shadow: 0px 0px 15px 0px rgba(22, 119, 255, 0.1);
// background: rgba(255, 255, 255, 1);
// .tool1 {
// width: 17px;
// height: 18px;
// margin-top: 17px;
// margin-left: 16px;
// cursor: pointer;
// img {
// width: 100%;
// height: 100%;
// }
// }
// .tool2 {
// width: 22px;
// height: 20px;
// margin-top: 26px;
// margin-left: 14px;
// cursor: pointer;
// img {
// width: 100%;
// height: 100%;
// }
// }
// .tool3 {
// width: 20px;
// height: 20px;
// margin-top: 25px;
// margin-left: 15px;
// cursor: pointer;
// img {
// width: 100%;
// height: 100%;
// }
// }
// }
} }
</style> </style>
\ No newline at end of file
...@@ -112,7 +112,7 @@ ...@@ -112,7 +112,7 @@
<script setup name="ChartChain"> <script setup name="ChartChain">
import { ref, onMounted } from "vue"; import { ref, onMounted } from "vue";
import defaultIcon2 from "@/assets/icons/default-icon2.png"; import defaultIcon2 from "@/assets/icons/default-icon2.png";
import noticeIcon from "./assets/images/notice-icon.png"; import noticeIcon from "../assets/images/notice-icon.png";
import { getDeepMiningSelect, getDeepMiningIndustry, getDeepMiningIndustryFishbone, getDeepMiningIndustryEntity } from "@/api/exportControlV2.0"; import { getDeepMiningSelect, getDeepMiningIndustry, getDeepMiningIndustryFishbone, getDeepMiningIndustryEntity } from "@/api/exportControlV2.0";
// 缩放功能处理 // 缩放功能处理
......
...@@ -37,14 +37,15 @@ ...@@ -37,14 +37,15 @@
<div class="box2-main"> <div class="box2-main">
<div class="custom-collapse"> <div class="custom-collapse">
<el-collapse v-model="dependActive"> <el-collapse v-model="dependActive">
<el-collapse-item v-for="(item, index) in dependList" :key="item.billId" title="Consistency" :name="item.billId"> <el-collapse-item v-for="(item, index) in dependList" :key="item.billId" :name="item.billId">
<template #icon> <template #icon>
<el-icon><ArrowDownBold /></el-icon> <el-icon v-if="dependActive.includes(item.billId)"><ArrowDownBold /></el-icon>
<el-icon v-else><ArrowUpBold /></el-icon>
</template> </template>
<template #title> <template #title>
<div class="custom-collapse-title"> <div class="custom-collapse-title">
<div class="custom-collapse-index">{{ index + 1 }}</div> <div class="custom-collapse-index">{{ index + 1 }}</div>
<div class="custom-collapse-name one-line-ellipsis">{{ item.title }}</div> <div class="custom-collapse-name one-line-ellipsis" @click.stop="handleClickDecree(item)">{{ item.title }}</div>
</div> </div>
</template> </template>
<div class="custom-collapse-content"> <div class="custom-collapse-content">
...@@ -192,6 +193,20 @@ const handleGetLaws = async () => { ...@@ -192,6 +193,20 @@ const handleGetLaws = async () => {
console.error("获取法律依据数据失败", error); console.error("获取法律依据数据失败", error);
} }
}; };
// 跳转科技法案详情页
const handleClickDecree = decree => {
window.sessionStorage.setItem("billId", decree.billId);
window.sessionStorage.setItem("curTabName", decree.title);
const route = router.resolve({
path: "/billLayout",
query: {
billId: decree.billId
}
});
console.log(route);
window.open(route.href, "_blank");
};
onMounted(() => { onMounted(() => {
handleGetBackground(); handleGetBackground();
...@@ -261,29 +276,31 @@ onMounted(() => { ...@@ -261,29 +276,31 @@ onMounted(() => {
background: rgba(255, 255, 255, 1); background: rgba(255, 255, 255, 1);
display: flex; display: flex;
align-items: center; align-items: center;
padding: 12px 0; padding: 18px 0;
.id { .id {
margin-right: 16px;
margin-left: 15px; margin-left: 15px;
width: 24px; width: 24px;
height: 24px; height: 24px;
text-align: center; text-align: center;
line-height: 30px;
border-radius: 12px;
background: #e7f3ff; background: #e7f3ff;
color: #0a57a6; color: #0a57a6;
font-size: 15px;
line-height: 24px;
border-radius: 50%;
} }
.title { .title {
width: 914px; width: 20px;
line-height: 24px; flex: auto;
margin-left: 13px; line-height: 30px;
} }
.open { .open {
width: 16px; width: 16px;
height: 16px; height: 16px;
margin-left: 16px; margin: 0 16px;
img { img {
width: 100%; width: 100%;
...@@ -332,7 +349,8 @@ onMounted(() => { ...@@ -332,7 +349,8 @@ onMounted(() => {
.custom-collapse-title { .custom-collapse-title {
position: relative; position: relative;
.custom-collapse-index { .custom-collapse-index {
font-size: 15px; font-family: Microsoft YaHei;
font-size: var(--font-size-base);
position: absolute; position: absolute;
top: 12px; top: 12px;
left: -32px; left: -32px;
...@@ -345,6 +363,7 @@ onMounted(() => { ...@@ -345,6 +363,7 @@ onMounted(() => {
color: #0a57a6; color: #0a57a6;
} }
.custom-collapse-name { .custom-collapse-name {
cursor: pointer;
font-weight: 600; font-weight: 600;
font-size: 18px; font-size: 18px;
color: var(--el-collapse-header-text-color); color: var(--el-collapse-header-text-color);
......
...@@ -37,9 +37,6 @@ ...@@ -37,9 +37,6 @@
<div class="item"> <div class="item">
<div class="item-left">{{ "相关领域:" }}</div> <div class="item-left">{{ "相关领域:" }}</div>
<div class="item-right tag-box"> <div class="item-right tag-box">
<!-- <div class="tag" v-for="(area, index) in basicInfo.areaList" :key="index">
{{ area.industryName }}
</div> -->
<AreaTag v-for="(area, index) in basicInfo.areaList" :key="index" :tagName="area.industryName"></AreaTag> <AreaTag v-for="(area, index) in basicInfo.areaList" :key="index" :tagName="area.industryName"></AreaTag>
</div> </div>
</div> </div>
...@@ -336,22 +333,20 @@ onMounted(() => { ...@@ -336,22 +333,20 @@ onMounted(() => {
.box1-main { .box1-main {
display: flex; display: flex;
padding: 0 24px;
.box1-main-left { .box1-main-left {
width: 395px; width: 395px;
height: 332px; height: 332px;
margin-left: 24px;
img { img {
width: 100%; width: 100%;
// height: 100%;
} }
} }
.box1-main-left-img-mock { .box1-main-left-img-mock {
width: 240px; width: 240px;
height: 332px; height: 332px;
margin-left: 24px;
background-color: #0b1932; background-color: #0b1932;
display: flex; display: flex;
align-items: center; align-items: center;
...@@ -378,7 +373,8 @@ onMounted(() => { ...@@ -378,7 +373,8 @@ onMounted(() => {
} }
.box1-main-right { .box1-main-right {
width: 590px; width: 20px;
flex: auto;
margin-left: 20px; margin-left: 20px;
color: rgba(59, 65, 75, 1); color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei; font-family: Microsoft YaHei;
...@@ -387,24 +383,22 @@ onMounted(() => { ...@@ -387,24 +383,22 @@ onMounted(() => {
line-height: 24px; line-height: 24px;
.item { .item {
height: 30px;
display: flex; display: flex;
margin-bottom: 17px; margin-bottom: 22px;
.item-left { .item-left {
width: 100px; width: 100px;
} }
.item-right { .item-right {
width: 470px; width: 20px;
overflow: hidden; flex: auto;
text-overflow: ellipsis;
white-space: nowrap;
} }
.tag-box { .tag-box {
display: flex; display: flex;
gap: 8px; gap: 8px;
flex-wrap: wrap;
.tag { .tag {
height: 24px; height: 24px;
...@@ -423,6 +417,9 @@ onMounted(() => { ...@@ -423,6 +417,9 @@ onMounted(() => {
} }
.text { .text {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
font-weight: normal !important; font-weight: normal !important;
} }
} }
......
...@@ -387,7 +387,7 @@ onMounted(() => { ...@@ -387,7 +387,7 @@ onMounted(() => {
.section-title { .section-title {
font-size: 18px; font-size: 18px;
line-height: 30px; line-height: 30px;
font-weight: 600; // font-weight: 600;
letter-spacing: 1px; letter-spacing: 1px;
width: 20px; width: 20px;
flex: auto; flex: auto;
......
...@@ -2,25 +2,25 @@ ...@@ -2,25 +2,25 @@
<div class="layout-container"> <div class="layout-container">
<!-- 导航菜单 --> <!-- 导航菜单 -->
<div class="layout-main"> <div class="layout-main">
<div class="layout-main-box"> <div class="header-main">
<div class="layout-main-header"> <div class="layout-main-header">
<div class="icon"> <div class="icon">
<img :src="summaryInfo.imageUrl" alt="" /> <img :src="summaryInfo.imageUrl" alt="" />
</div> </div>
<div class="info"> <div class="info">
<div class="info-box1 one-line-ellipsis">{{ summaryInfo.name }}</div> <div class="info-box1 one-line-ellipsis">{{ summaryInfo.name || "--" }}</div>
<div class="info-box2"> <div class="info-box2">
<div class="info-box2-item">{{ summaryInfo.postDate }}</div> <div class="info-box2-item">{{ summaryInfo.postDate || "--" }}</div>
| |
<div class="info-box2-item">{{ summaryInfo.orgName }}</div> <div class="info-box2-item">{{ summaryInfo.orgName || "--" }}</div>
| |
<div class="info-box2-item one-line-ellipsis">{{ summaryInfo.ename }}</div> <div class="info-box2-item one-line-ellipsis">{{ summaryInfo.ename || "--" }}</div>
</div> </div>
</div> </div>
<div class="layout-main-header-right-box"> <div class="layout-main-header-right-box">
<div class="right-box-top"> <div class="right-box-top">
<div class="time">{{ summaryInfo.postDate }}</div> <div class="time">{{ summaryInfo.postDate || "--" }}</div>
<div class="name">{{ summaryInfo.orgName }}</div> <div class="name">{{ summaryInfo.orgName || "--" }}</div>
</div> </div>
</div> </div>
</div> </div>
...@@ -28,16 +28,20 @@ ...@@ -28,16 +28,20 @@
<div class="layout-main-center"> <div class="layout-main-center">
<div class="report-header"> <div class="report-header">
<div class="report-title">政令原文</div> <div class="report-title">政令原文</div>
<!-- <el-switch v-model="isHighlight" /> <el-switch v-model="isHighlight" />
<div style="margin-left: 6px; margin-right: 10px;">高亮实体</div> --> <div style="margin-left: 6px; margin-right: 10px;">高亮实体</div>
<el-switch v-model="isTranslate" /> <el-switch v-model="isTranslate" />
<div style="margin-left: 6px;">原文显示</div> <div style="margin-left: 6px;">原文显示</div>
<!-- <div class="btn" @click="handleDownload"> <div class="btn" @click="handleDownload">
<el-icon><Document /></el-icon> <div class="icon" style="margin-right: 4px;">
<img :src="download" alt="">
</div>
<div class="text">下载</div> <div class="text">下载</div>
</div> --> </div>
<div class="btn" @click="handleFindWord('open')"> <div class="btn" @click="handleFindWord('open')">
<el-icon><Search /></el-icon> <div class="icon" style="margin-right: 6px;">
<img :src="search" alt="">
</div>
<div class="text">查找</div> <div class="text">查找</div>
</div> </div>
<div class="find-word-box" v-if="findWordBox"> <div class="find-word-box" v-if="findWordBox">
...@@ -79,6 +83,8 @@ import { ElMessage } from "element-plus"; ...@@ -79,6 +83,8 @@ import { ElMessage } from "element-plus";
import { debounce } from "lodash"; import { debounce } from "lodash";
import { getDecreeSummary } from "@/api/decree/introduction"; import { getDecreeSummary } from "@/api/decree/introduction";
import { getDecreeReport } from "@/api/decree/introduction"; import { getDecreeReport } from "@/api/decree/introduction";
import download from "./assets/icons/download.png";
import search from "./assets/icons/search.png";
const route = useRoute(); const route = useRoute();
...@@ -178,7 +184,10 @@ const handleUpdateWord = debounce(() => { ...@@ -178,7 +184,10 @@ const handleUpdateWord = debounce(() => {
} }
}); });
if (findWordMax.value > 0) { if (findWordMax.value > 0) {
nextTick(() => { handleFindWord('next') }) nextTick(() => {
findWordNum.value = findWordNum.value==findWordMax.value ? 1 : findWordNum.value+1;
handleHighlight()
})
} }
} else { } else {
originData.forEach((item, index) => { originData.forEach((item, index) => {
...@@ -257,11 +266,10 @@ onMounted(() => { ...@@ -257,11 +266,10 @@ onMounted(() => {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
.layout-main-box { .header-main {
padding: 16px 0; padding: 17px 0;
width: 100%; width: 100%;
border-bottom: 1px solid rgba(234, 236, 238, 1); border-bottom: 1px solid rgba(234, 236, 238, 1);
border-top: 1px solid rgba(234, 236, 238, 1);
box-shadow: 0px 0px 20px 0px rgba(25, 69, 130, 0.1); box-shadow: 0px 0px 20px 0px rgba(25, 69, 130, 0.1);
background: rgba(255, 255, 255, 1); background: rgba(255, 255, 255, 1);
} }
...@@ -412,7 +420,6 @@ onMounted(() => { ...@@ -412,7 +420,6 @@ onMounted(() => {
background: rgba(255, 255, 255, 1); background: rgba(255, 255, 255, 1);
display: flex; display: flex;
justify-content: center; justify-content: center;
gap: 8px;
align-items: center; align-items: center;
cursor: pointer; cursor: pointer;
.text { .text {
...@@ -426,6 +433,15 @@ onMounted(() => { ...@@ -426,6 +433,15 @@ onMounted(() => {
letter-spacing: 0px; letter-spacing: 0px;
text-align: left; text-align: left;
} }
.icon {
width: 16px;
height: 16px;
font-size: 0px;
img {
width: 100%;
height: 100%;
}
}
} }
} }
......
...@@ -53,7 +53,7 @@ export default defineConfig({ ...@@ -53,7 +53,7 @@ export default defineConfig({
'/api': { '/api': {
target: 'http://8.140.26.4:9085/', target: 'http://8.140.26.4:9085/',
// target: 'http://192.168.0.5:28080/', // target: 'http://172.20.10.3:28080/',
changeOrigin: true, changeOrigin: true,
rewrite: (path) => path.replace(/^\/api/, '') rewrite: (path) => path.replace(/^\/api/, '')
}, },
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论