Compare commits
2 Commits
cbc2571057
...
4d4deaffd7
| Author | SHA1 | Date |
|---|---|---|
fuxiaochun
|
4d4deaffd7 | |
|
fuxiaochun
|
bcfeca7136 |
|
|
@ -39,6 +39,10 @@ body {
|
|||
background-color: #b6b7b9;
|
||||
}
|
||||
|
||||
.httpLoading{
|
||||
font-size: 22px;
|
||||
}
|
||||
|
||||
/* #app {
|
||||
max-width: 1280px;
|
||||
margin: 0 auto;
|
||||
|
|
|
|||
|
|
@ -23,12 +23,14 @@
|
|||
<div class="blockTitle">推荐文章</div>
|
||||
<ul>
|
||||
<li :key="item.id" v-for="item in recommend" @click="goDetail(item.id)">
|
||||
<div class="img"><img :src="item.cover" :alt="item.title"></div>
|
||||
<div class="info">
|
||||
<h3>{{ item.title }}</h3>
|
||||
<p>{{ item.description }}1</p>
|
||||
<div class="img">
|
||||
<img :src="item.cover" :alt="item.title">
|
||||
</div>
|
||||
<div class="rTitle">
|
||||
<h2>{{ item.title }}</h2>
|
||||
<span>{{ DateFormat(new Date(item.published_at * 1000), 'yyyy.MM.dd') }}</span>
|
||||
</div>
|
||||
<div class="desc">{{ item.description }}</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
|
@ -217,52 +219,63 @@ const goDetail = (id) => {
|
|||
}
|
||||
|
||||
ul {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
padding-top: 30px;
|
||||
|
||||
li{
|
||||
width: 100%;
|
||||
padding-right: 30px;
|
||||
display: flex;
|
||||
margin-top: 30px;
|
||||
|
||||
height: 408px;
|
||||
background: #D6D6DD;
|
||||
border-radius: 3px;
|
||||
border: 5px solid #D6D6DD;
|
||||
margin-bottom: 20px;
|
||||
color: #333;
|
||||
cursor: pointer;
|
||||
.img{
|
||||
width: 260px;
|
||||
height: 360px;
|
||||
width: 100%;
|
||||
height: 264px;
|
||||
background-color: #666;
|
||||
overflow: hidden;
|
||||
|
||||
img{
|
||||
width: 260px;
|
||||
height: 360px;
|
||||
object-fit: cover;
|
||||
display: block;
|
||||
background-color: #666;
|
||||
&[src='']{
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.info {
|
||||
flex: 1;
|
||||
margin-left: 15px;
|
||||
height: 360px;
|
||||
}
|
||||
.rTitle{
|
||||
height: 80px;
|
||||
width: 100%;
|
||||
padding: 20px 10px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
|
||||
h3 {
|
||||
font-size: 32px;
|
||||
align-items: center;
|
||||
h2{
|
||||
height: 40px;
|
||||
font-weight: bold;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
|
||||
p {
|
||||
padding: 10px 0;
|
||||
font-size: 26px;
|
||||
line-height: 30px;
|
||||
font-size: 28px;
|
||||
line-height: 40px;
|
||||
margin-right: 10px;
|
||||
flex: 1;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
span{
|
||||
color: #999;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
display: inline-block;
|
||||
font-size: 22px;
|
||||
}
|
||||
}
|
||||
.desc{
|
||||
padding: 10px;
|
||||
font-size: 22px;
|
||||
font-weight: bold;
|
||||
line-height: 30px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -22,6 +22,7 @@ export default function () {
|
|||
const showLoading = ()=>{
|
||||
if (requestCount === 0) {
|
||||
let renderDom = document.createElement('div');
|
||||
renderDom.className ='httpLoading';
|
||||
renderDom.style.cssText = 'width:100%; height: 100%; position: absolute;left:0;top:0;z-index:9999;background-color: rgba(0,0,0,0.5);display: flex;justify-content: center; align-items: center;'
|
||||
renderDom.setAttribute('id', 'requestLoading');
|
||||
renderDom.innerHTML = 'loading...';
|
||||
|
|
@ -76,7 +77,7 @@ export default function () {
|
|||
if (response.data.status != 0) {
|
||||
if (response.data.status == 401 ) {
|
||||
// token失效
|
||||
showToast('账号过期或异地登录, 请重新登录');
|
||||
// showToast('账号过期或异地登录, 请重新登录');
|
||||
localCache.remove('auth');
|
||||
localCache.remove('userInfo');
|
||||
userInfo.updateUserInfo({});
|
||||
|
|
@ -97,7 +98,7 @@ export default function () {
|
|||
switch (error.response.data.status) {
|
||||
case 401:
|
||||
// token失效
|
||||
showToast('账号过期或异地登录, 请重新登录');
|
||||
// showToast('账号过期或异地登录, 请重新登录');
|
||||
localCache.remove('auth');
|
||||
localCache.remove('userInfo');
|
||||
userInfo.updateUserInfo({});
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
<div class="logo">
|
||||
<img :src="website.info.web_logo" :alt="website.info.web_title">
|
||||
</div>
|
||||
<div class="title">{{$route.meta.title}}</div>
|
||||
<div class="title">{{pageTitle}}</div>
|
||||
<div class="nav">
|
||||
<div class="navBtn" @click.stop="toggleMenu"><van-icon name="wap-nav" size="0.6rem" /></div>
|
||||
<div class="menuBox" @click.stop="" v-if="showMenu">
|
||||
|
|
@ -46,7 +46,7 @@
|
|||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, onMounted } from 'vue';
|
||||
import { ref, onMounted, computed } from 'vue';
|
||||
import { useUserInfo } from '@/stores/userInfo';
|
||||
import { localCache } from '@/io/cache';
|
||||
import http from '@/io/http';
|
||||
|
|
@ -65,6 +65,10 @@ const timer = ref(0);
|
|||
|
||||
const showMenu = ref(false);
|
||||
|
||||
const pageTitle = computed(()=>{
|
||||
return website.pageTitle || route.meta.title;
|
||||
});
|
||||
|
||||
onMounted(()=>{
|
||||
document.body.addEventListener('click', ()=>{
|
||||
showMenu.value = false;
|
||||
|
|
@ -157,7 +161,7 @@ const jump = (url)=>{
|
|||
position: relative;
|
||||
z-index: 9;
|
||||
.logo{
|
||||
width: 230px;
|
||||
width: 200px;
|
||||
height: 80px;
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
|
|
@ -169,19 +173,21 @@ const jump = (url)=>{
|
|||
}
|
||||
}
|
||||
.title{
|
||||
width: 230px;
|
||||
width: 290px;
|
||||
height: 70px;
|
||||
line-height: 70px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
font-size: 28px;
|
||||
font-weight: bold;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
// display: flex;
|
||||
// justify-content: center;
|
||||
// align-items: center;
|
||||
}
|
||||
.nav{
|
||||
width: 230px;
|
||||
width: 200px;
|
||||
height: 70px;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
|
|
|
|||
|
|
@ -87,7 +87,7 @@ const router = createRouter({
|
|||
path: "/business/macroeconomics/trend/:id",
|
||||
name: "Trend",
|
||||
meta: {
|
||||
title: "洞见趋势",
|
||||
title: "洞察趋势",
|
||||
group: 'business'
|
||||
},
|
||||
component: () => import("@/views/business/macroeconomics/trend.vue"),
|
||||
|
|
|
|||
|
|
@ -2,10 +2,14 @@ import { ref, computed } from "vue";
|
|||
import { defineStore } from "pinia";
|
||||
|
||||
export const useWebsite = defineStore("website", () => {
|
||||
const pageTitle = ref('');
|
||||
const info = ref({});
|
||||
function updateInfo(data) {
|
||||
info.value = data;
|
||||
}
|
||||
function setPageTitle(title){
|
||||
pageTitle.value = title;
|
||||
}
|
||||
|
||||
return { info, updateInfo };
|
||||
return { info, pageTitle, updateInfo, setPageTitle };
|
||||
});
|
||||
|
|
|
|||
|
|
@ -2,10 +2,10 @@
|
|||
<div class="pageContainer">
|
||||
<div class="mainBox">
|
||||
<div class="breadNav">
|
||||
<router-link to="/home">首页</router-link><span>></span>
|
||||
<router-link to="/insights">AI商情</router-link><span>></span>
|
||||
<router-link to="/insights/legal/index">法律法规</router-link><span>></span>
|
||||
<router-link to="/insights/legal/country">国别地区指南</router-link><span>></span>
|
||||
<router-link to="/">首页</router-link><span>></span>
|
||||
<router-link to="/business">AI商情</router-link><span>></span>
|
||||
<router-link to="/business/legal">法律法规</router-link><span>></span>
|
||||
<router-link to="/business/legal/country">国别地区指南</router-link><span>></span>
|
||||
<span>详情</span>
|
||||
</div>
|
||||
<template v-if="detail">
|
||||
|
|
@ -16,7 +16,7 @@
|
|||
<p>{{detail.description }}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="detailContent">
|
||||
<div class="detailContent" v-if="detail.content">
|
||||
<dl class="menu">
|
||||
<dt>目录</dt>
|
||||
<dd>
|
||||
|
|
@ -36,6 +36,9 @@
|
|||
</template>
|
||||
</div>
|
||||
</div>
|
||||
<div class="detailContent" v-else>
|
||||
<div class="empty">暂无内容</div>
|
||||
</div>
|
||||
</template>
|
||||
<div class="loadingBox" v-else>数据加载中...</div>
|
||||
</div>
|
||||
|
|
@ -67,10 +70,11 @@ onMounted(() => {
|
|||
const getDetail = () => {
|
||||
http(`/api/country/${id.value}`, {}, 'get').then(res => {
|
||||
detail.value = res.data;
|
||||
curMenu.value = res.data.content[0].title;
|
||||
curMenuData.value = res.data.content[0].list;
|
||||
curSection.value = curMenuData.value[0].title;
|
||||
curSectionData.value = curMenuData.value[0].list;
|
||||
let _content = Array.isArray(res.data.content) ? (res.data.content[0] || {}) : {};
|
||||
curMenu.value = _content.title;
|
||||
curMenuData.value = _content.list || [];
|
||||
curSection.value = curMenuData.value[0]?.title;
|
||||
curSectionData.value = curMenuData.value[0]?.list;
|
||||
}).catch(err => {
|
||||
showToast(err.message);
|
||||
});
|
||||
|
|
@ -155,6 +159,15 @@ const chooseSection = (item)=>{
|
|||
|
||||
.detailContent {
|
||||
padding: 20px 0;
|
||||
.empty{
|
||||
width: 100%;
|
||||
height: 50vh;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
font-size: 30px;
|
||||
color: #CCC;
|
||||
}
|
||||
|
||||
.menu,
|
||||
.section{
|
||||
|
|
|
|||
Loading…
Reference in New Issue