Merge branch 'master' of https://gitea.hmily.club/haitu/aigc-h5
commit
a3474242a4
|
|
@ -2,4 +2,8 @@ VITE_PUBLIC_PATH = /
|
|||
|
||||
VITE_API_BASE_URL = 'http://test-admin.haituaigc.com'
|
||||
|
||||
VITE_API_CHAT_URL = 'http://openai-test.haituaigc.com'
|
||||
VITE_API_CHAT_URL = 'http://openai-test.haituaigc.com'
|
||||
|
||||
VITE_PC_HOST = 'http://test.haituaigc.com'
|
||||
|
||||
VITE_M_HOST = 'http://test-m.haituaigc.com'
|
||||
|
|
@ -2,4 +2,8 @@ VITE_PUBLIC_PATH = /
|
|||
|
||||
VITE_API_BASE_URL = 'http://test-admin.haituaigc.com'
|
||||
|
||||
VITE_API_CHAT_URL = 'http://openai-test.haituaigc.com'
|
||||
VITE_API_CHAT_URL = 'http://openai-test.haituaigc.com'
|
||||
|
||||
VITE_PC_HOST = 'http://test.haituaigc.com'
|
||||
|
||||
VITE_M_HOST = 'http://test-m.haituaigc.com'
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 1.5 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.5 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 180 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 88 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 174 KiB |
|
|
@ -120,6 +120,8 @@ const jump = (url)=>{
|
|||
color: #FFF;
|
||||
padding: 10px;
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
z-index: 9;
|
||||
.logo{
|
||||
width: 230px;
|
||||
display: flex;
|
||||
|
|
|
|||
|
|
@ -26,6 +26,8 @@ import Footer from './Footer.vue';
|
|||
flex: 1;
|
||||
width: 100%;
|
||||
overflow-y: auto;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -15,6 +15,15 @@ import 'vant/es/toast/style';
|
|||
|
||||
import 'amfe-flexible'
|
||||
|
||||
function platCheck() {
|
||||
const userAgent = navigator.userAgent.toLowerCase();
|
||||
const mobileKeywords = ['iphone', 'ipod', 'android', 'silk', 'blackberry', 'bb10', 'phone', 'mobile', 'kindle', 'opera mini', 'mobile safari', 'windows phone'];
|
||||
const isMobileDevice = mobileKeywords.some(keyword => userAgent.includes(keyword));
|
||||
if (!isMobileDevice) {
|
||||
window.location.href = import.meta.env.VITE_PC_HOST;
|
||||
}
|
||||
}
|
||||
platCheck();
|
||||
|
||||
|
||||
const app = createApp(App);
|
||||
|
|
|
|||
|
|
@ -79,7 +79,7 @@ const router = createRouter({
|
|||
title: 'AI商情-行业洞察',
|
||||
group: 'business'
|
||||
},
|
||||
component: () => import("@/views/business/insight.vue"),
|
||||
component: () => import("@/views/business/insight/index.vue"),
|
||||
},
|
||||
{
|
||||
path: 'business/insight/category/:cid',
|
||||
|
|
@ -88,7 +88,7 @@ const router = createRouter({
|
|||
title: 'AI商情-行业洞察',
|
||||
group: 'business'
|
||||
},
|
||||
component: () => import("@/views/business/list.vue"),
|
||||
component: () => import("@/views/business/insight/list.vue"),
|
||||
},
|
||||
{
|
||||
path: 'business/insight/detail/:cid/:id',
|
||||
|
|
@ -97,7 +97,34 @@ const router = createRouter({
|
|||
title: 'AI商情-行业洞察',
|
||||
group: 'business'
|
||||
},
|
||||
component: () => import("@/views/business/detail.vue"),
|
||||
component: () => import("@/views/business/insight/detail.vue"),
|
||||
},
|
||||
{
|
||||
path: 'business/legal',
|
||||
name: 'legal',
|
||||
meta: {
|
||||
title: 'AI商情-法律法规',
|
||||
group: 'business'
|
||||
},
|
||||
component: () => import("@/views/business/legal/index.vue"),
|
||||
},
|
||||
{
|
||||
path: 'business/legal/policy',
|
||||
name: 'policy',
|
||||
meta: {
|
||||
title: 'AI商情-法律法规-政策解读',
|
||||
group: 'business'
|
||||
},
|
||||
component: () => import("@/views/business/legal/policy.vue"),
|
||||
},
|
||||
{
|
||||
path: 'business/legal/policy/detail/:id',
|
||||
name: 'policyDetail',
|
||||
meta: {
|
||||
title: 'AI商情-法律法规-政策解读',
|
||||
group: 'business'
|
||||
},
|
||||
component: () => import("@/views/business/legal/policyDetail.vue"),
|
||||
},
|
||||
]
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,16 +1,21 @@
|
|||
<template>
|
||||
<div class="listBox">
|
||||
<template v-if="dataList != null">
|
||||
<ul v-if="dataList.length > 0">
|
||||
<li :key="item.id" v-for="item in dataList" @click="goDetail(item.id)">
|
||||
<img :src="item.cover" :alt="item.title">
|
||||
<div class="title">
|
||||
<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>
|
||||
<template v-if="dataList.length > 0">
|
||||
<ul>
|
||||
<li :key="item.id" v-for="item in dataList" @click="goDetail(item.id)">
|
||||
<img :src="item.cover" :alt="item.title">
|
||||
<div class="title">
|
||||
<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 class="pageBox" v-if="hasMore">
|
||||
<div class="loadMore" @click="loadMore">加载更多</div>
|
||||
</div>
|
||||
</template>
|
||||
<div class="placeholder" v-else>{{ placeholder }}</div>
|
||||
</template>
|
||||
<template v-else>
|
||||
|
|
@ -33,6 +38,10 @@ const props = defineProps({
|
|||
cid: {
|
||||
cid: Object,
|
||||
default: {}
|
||||
},
|
||||
type: {
|
||||
type: String,
|
||||
default: ''
|
||||
}
|
||||
})
|
||||
const pageSize = ref(15);
|
||||
|
|
@ -40,6 +49,7 @@ const pageNum = ref(1);
|
|||
const result = ref({});
|
||||
const dataList = ref([]);
|
||||
const placeholder = ref('');
|
||||
const hasMore = ref(false);
|
||||
|
||||
onMounted(()=>{
|
||||
getList();
|
||||
|
|
@ -48,14 +58,15 @@ onMounted(()=>{
|
|||
const getList = ()=>{
|
||||
placeholder.value = '数据加载中...';
|
||||
let params = {
|
||||
category_id: props.cid,
|
||||
type: 'business',
|
||||
category_id: props.cid ? props.cid : undefined,
|
||||
type: props.type,
|
||||
per_page: pageSize.value,
|
||||
page: pageNum.value
|
||||
};
|
||||
http('/api/article', params, 'get').then(res => {
|
||||
result.value = res.data;
|
||||
dataList.value = res.data.data || [];
|
||||
dataList.value = dataList.value.concat(res.data.data || []) ;
|
||||
hasMore.value = res.data.current_page < res.data.last_page;
|
||||
placeholder.value = dataList.value.length == 0 ? '暂无数据' : '';
|
||||
}).catch(err => {
|
||||
showToast(err.message);
|
||||
|
|
@ -63,8 +74,17 @@ const getList = ()=>{
|
|||
});
|
||||
};
|
||||
|
||||
const loadMore = ()=>{
|
||||
pageNum.value += 1;
|
||||
getList();
|
||||
};
|
||||
|
||||
const goDetail = (id) => {
|
||||
router.push(`/insights/category/${props.cid}/${id}`);
|
||||
let path = {
|
||||
business: `/business/insight/detail/${props.cid}/${id}`, // 行业洞察详情页
|
||||
policy: `/business/legal/policy/detail/${id}`, // 法律法规-政策解读详情页
|
||||
};
|
||||
router.push(path[props.type]);
|
||||
};
|
||||
|
||||
|
||||
|
|
@ -72,38 +92,39 @@ const goDetail = (id) => {
|
|||
|
||||
<style lang="scss" scoped>
|
||||
.listBox{
|
||||
margin-top: 20px;
|
||||
padding: 20px;
|
||||
position: relative;
|
||||
ul{
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
li{
|
||||
width: 370px;
|
||||
height: 305px;
|
||||
width: 100%;
|
||||
height: 408px;
|
||||
background: #D6D6DD;
|
||||
border-radius: 3px;
|
||||
border: 2px solid #D6D6DD;
|
||||
margin: 0 17px 34px 17px;
|
||||
border: 5px solid #D6D6DD;
|
||||
margin-bottom: 20px;
|
||||
color: #333;
|
||||
cursor: pointer;
|
||||
img{
|
||||
width: 364px;
|
||||
height: 205px;
|
||||
width: 100%;
|
||||
height: 264px;
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
background-color: #666;
|
||||
}
|
||||
.title{
|
||||
height: 36px;
|
||||
height: 80px;
|
||||
width: 100%;
|
||||
padding: 17px;
|
||||
padding: 20px 10px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
h2{
|
||||
height: 36px;
|
||||
height: 40px;
|
||||
font-weight: bold;
|
||||
font-size: 18px;
|
||||
line-height: 36px;
|
||||
font-size: 28px;
|
||||
line-height: 40px;
|
||||
margin-right: 10px;
|
||||
flex: 1;
|
||||
overflow: hidden;
|
||||
|
|
@ -111,36 +132,42 @@ const goDetail = (id) => {
|
|||
white-space: nowrap;
|
||||
}
|
||||
span{
|
||||
height: 36px;
|
||||
line-height: 36px;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
display: inline-block;
|
||||
font-size: 12px;
|
||||
font-size: 22px;
|
||||
}
|
||||
}
|
||||
.desc{
|
||||
padding: 5px 10px;
|
||||
font-size: 12px;
|
||||
line-height: 22px;
|
||||
padding: 10px;
|
||||
font-size: 22px;
|
||||
font-weight: bold;
|
||||
line-height: 30px;
|
||||
}
|
||||
}
|
||||
.pagesBox{
|
||||
.pageBox{
|
||||
width: 100%;
|
||||
height: 40px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
color: #FFF;
|
||||
a{
|
||||
color: #FFF;
|
||||
padding: 30px 0;
|
||||
.loadMore{
|
||||
padding: 10px 30px;
|
||||
border: 1px solid #CCC;
|
||||
border-radius: 4px;
|
||||
font-size: 23px;
|
||||
color: #CCC;
|
||||
}
|
||||
}
|
||||
.placeholder{
|
||||
width: 100%;
|
||||
height: 300px;
|
||||
height: 60vh;
|
||||
position: relative;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
font-size: 14px;
|
||||
font-size: 24px;
|
||||
color: #FFF;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,283 +0,0 @@
|
|||
<template>
|
||||
<BackPage title="上一页" :url="`/insights/category/${cid}`">
|
||||
<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/category">行业洞察</router-link><span>></span>
|
||||
<router-link :to="`/insights/category/${category.id}`" v-if="category.id">{{category.name}}</router-link><span v-if="category.id">></span>
|
||||
<span>详情</span>
|
||||
</div>
|
||||
<div class="article" v-if="detail">
|
||||
<h1 class="title">{{detail.title}}</h1>
|
||||
<div class="props">
|
||||
<span>作者：{{detail.author }}</span>
|
||||
<span>责编：{{detail.editor }}</span>
|
||||
<span>{{DateFormat(new Date(detail.published_at * 1000), 'yyyy.MM.dd')}}</span>
|
||||
</div>
|
||||
<div class="info">
|
||||
<div v-html="detail.content"></div>
|
||||
</div>
|
||||
<!-- <div class="recommend">
|
||||
<div class="blockTitle">推荐文章</div>
|
||||
<ul>
|
||||
<li>
|
||||
<div class="img"><img src="http://madjs.com/d/file/2021/06-09/c0d0de22384d1f0e4ea06ee74e60c59c.jpg" alt=""></div>
|
||||
<div class="info">
|
||||
<h3>政策最新解读</h3>
|
||||
<p>ChatGPT（全名：ChatGenerative Pre-trai...</p>
|
||||
<span>2023.05.19</span>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="img"><img src="http://madjs.com/d/file/2021/06-09/c0d0de22384d1f0e4ea06ee74e60c59c.jpg" alt=""></div>
|
||||
<div class="info">
|
||||
<h3>政策最新解读</h3>
|
||||
<p>ChatGPT（全名：ChatGenerative Pre-trai...</p>
|
||||
<span>2023.05.19</span>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="img"><img src="http://madjs.com/d/file/2021/06-09/c0d0de22384d1f0e4ea06ee74e60c59c.jpg" alt=""></div>
|
||||
<div class="info">
|
||||
<h3>政策最新解读</h3>
|
||||
<p>ChatGPT（全名：ChatGenerative Pre-trai...</p>
|
||||
<span>2023.05.19</span>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="img"><img src="http://madjs.com/d/file/2021/06-09/c0d0de22384d1f0e4ea06ee74e60c59c.jpg" alt=""></div>
|
||||
<div class="info">
|
||||
<h3>政策最新解读</h3>
|
||||
<p>ChatGPT（全名：ChatGenerative Pre-trai...</p>
|
||||
<span>2023.05.19</span>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="img"><img src="http://madjs.com/d/file/2021/06-09/c0d0de22384d1f0e4ea06ee74e60c59c.jpg" alt=""></div>
|
||||
<div class="info">
|
||||
<h3>政策最新解读</h3>
|
||||
<p>ChatGPT（全名：ChatGenerative Pre-trai...</p>
|
||||
<span>2023.05.19</span>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="img"><img src="http://madjs.com/d/file/2021/06-09/c0d0de22384d1f0e4ea06ee74e60c59c.jpg" alt=""></div>
|
||||
<div class="info">
|
||||
<h3>政策最新解读</h3>
|
||||
<p>ChatGPT（全名：ChatGenerative Pre-trai...</p>
|
||||
<span>2023.05.19</span>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div> -->
|
||||
</div>
|
||||
<div class="loadingBox" v-else>数据加载中...</div>
|
||||
</div>
|
||||
<AiAssistant></AiAssistant>
|
||||
</div>
|
||||
</BackPage>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { LeftCircleOutlined } from '@ant-design/icons-vue';
|
||||
import { ref, onBeforeMount, onMounted } from 'vue';
|
||||
import http from '@/io/http';
|
||||
import { message } from 'ant-design-vue';
|
||||
import { useRouter, useRoute } from 'vue-router';
|
||||
import { DateFormat } from '@/utils/format.js';
|
||||
import AiAssistant from '@/views/chat/components/ai-assistant.vue';
|
||||
import BackPage from '@/components/BackPage/index.vue'
|
||||
|
||||
const router = useRouter();
|
||||
const route = useRoute();
|
||||
const cid = ref(route.params.cid);
|
||||
const id = ref(route.params.id);
|
||||
const category = ref({});
|
||||
const detail = ref();
|
||||
|
||||
onBeforeMount(()=>{
|
||||
getCategories();
|
||||
});
|
||||
|
||||
onMounted(()=>{
|
||||
getDetail();
|
||||
});
|
||||
|
||||
const getCategories = () => {
|
||||
let params = { type_key: 'business' };
|
||||
http('/api/keywords', params, 'get').then(res => {
|
||||
category.value = res.data.filter(v => v.id == cid.value)[0];
|
||||
}).catch(err => {
|
||||
message.error(err.message);
|
||||
});
|
||||
};
|
||||
|
||||
const getDetail = ()=>{
|
||||
http(`/api/article/${id.value}`, {}, 'get').then(res => {
|
||||
detail.value = res.data;
|
||||
}).catch(err => {
|
||||
message.error(err.message);
|
||||
});
|
||||
};
|
||||
|
||||
const goBack = () => {
|
||||
router.back();
|
||||
};
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.pageContainer{
|
||||
color: #FFF;
|
||||
width: 90rem;
|
||||
margin: 0 auto;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
.mainBox{
|
||||
flex: 1;
|
||||
background: #242527;
|
||||
padding: 20px;
|
||||
}
|
||||
.sidebar{
|
||||
width: 260px;
|
||||
margin-left: 20px;
|
||||
.pageNav{
|
||||
width: 100%;
|
||||
padding: 20px 0;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
.prePage{
|
||||
height: 36px;
|
||||
padding-left: 40px;
|
||||
background: url('@/assets/images/icon_left_arrow_circle@2x.png') no-repeat left center;
|
||||
background-size: 36px 36px;
|
||||
line-height: 36px;
|
||||
cursor: pointer;
|
||||
&:hover{
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
}
|
||||
.sideBlock{
|
||||
width: 100%;
|
||||
margin-top: 20px;
|
||||
}
|
||||
}
|
||||
.breadNav{
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
color: #999;
|
||||
span{
|
||||
padding: 0 5px;
|
||||
}
|
||||
a{
|
||||
color: #999;
|
||||
&:hover{
|
||||
color: #FFF;
|
||||
}
|
||||
}
|
||||
}
|
||||
.loadingBox{
|
||||
width: 100%;
|
||||
height: 400px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
font-size: 14px;
|
||||
}
|
||||
.article{
|
||||
padding: 20px 0;
|
||||
.title{
|
||||
font-size: 27px;
|
||||
line-height: 30px;
|
||||
text-align: center;
|
||||
padding: 10px 0;
|
||||
}
|
||||
.props{
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
line-height: 30px;
|
||||
color: #999;
|
||||
span{
|
||||
display: inline-block;
|
||||
margin: 10px;
|
||||
}
|
||||
}
|
||||
.info{
|
||||
line-height: 1.5;
|
||||
:deep(p){
|
||||
padding: 10px 0;
|
||||
}
|
||||
:deep(strong){
|
||||
font-weight: bold;
|
||||
}
|
||||
:deep(b){
|
||||
font-weight: bold;
|
||||
}
|
||||
:deep(h1){
|
||||
font-weight: bold;
|
||||
}
|
||||
:deep(img){
|
||||
max-width: 100%;
|
||||
display: block;
|
||||
margin: 10px auto;
|
||||
}
|
||||
}
|
||||
.recommend{
|
||||
padding: 30px 0;
|
||||
.blockTitle{
|
||||
height: 46px;
|
||||
line-height: 45px;
|
||||
border-bottom: 1px solid #666;
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
}
|
||||
ul{
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
li{
|
||||
width: 50%;
|
||||
padding-right: 30px;
|
||||
display: flex;
|
||||
margin-top: 30px;
|
||||
.img{
|
||||
width: 120px;
|
||||
height: 168px;
|
||||
overflow: hidden;
|
||||
img{
|
||||
width: 120px;
|
||||
height: 168px;
|
||||
}
|
||||
}
|
||||
.info{
|
||||
flex: 1;
|
||||
margin-left: 15px;
|
||||
height: 168px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
h3{
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
p{
|
||||
padding: 10px 0;
|
||||
font-size: 12px;
|
||||
line-height: 22px;
|
||||
flex: 1;
|
||||
}
|
||||
span{
|
||||
color: #999;
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,7 +1,9 @@
|
|||
<template>
|
||||
<div>
|
||||
AI商情首页
|
||||
<router-link to="/business/insight">行业洞察</router-link>
|
||||
<div><router-link to="/business/insight">行业洞察</router-link></div>
|
||||
<div><router-link to="/business/legal">法律法规</router-link></div>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,196 @@
|
|||
<template>
|
||||
<div class="pageContainer">
|
||||
<div class="breadNav">
|
||||
<router-link to="/">首页</router-link><span>></span>
|
||||
<router-link to="/business">AI商情</router-link><span>></span>
|
||||
<router-link to="/business/insight">行业洞察</router-link><span>></span>
|
||||
<router-link :to="`/business/insight/category/${category.id}`" v-if="category.id">{{category.name}}</router-link><span v-if="category.id">></span>
|
||||
<span>详情</span>
|
||||
</div>
|
||||
<div class="article" v-if="detail">
|
||||
<h1 class="title">{{detail.title}}</h1>
|
||||
<div class="props">
|
||||
<span>作者：{{detail.author }}</span>
|
||||
<span>责编：{{detail.editor }}</span>
|
||||
<span>{{DateFormat(new Date(detail.published_at * 1000), 'yyyy.MM.dd')}}</span>
|
||||
</div>
|
||||
<div class="info">
|
||||
<div v-html="detail.content"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="loadingBox" v-else>数据加载中...</div>
|
||||
<!-- <AiAssistant></AiAssistant> -->
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, onBeforeMount, onMounted } from 'vue';
|
||||
import http from '@/io/http';
|
||||
import { showToast } from 'vant';
|
||||
import { useRouter, useRoute } from 'vue-router';
|
||||
import { DateFormat } from '@/utils/format.js';
|
||||
// import AiAssistant from '@/views/chat/components/ai-assistant.vue';
|
||||
|
||||
const router = useRouter();
|
||||
const route = useRoute();
|
||||
const cid = ref(route.params.cid);
|
||||
const id = ref(route.params.id);
|
||||
const category = ref({});
|
||||
const detail = ref();
|
||||
|
||||
onBeforeMount(()=>{
|
||||
getCategories();
|
||||
});
|
||||
|
||||
onMounted(()=>{
|
||||
getDetail();
|
||||
});
|
||||
|
||||
const getCategories = () => {
|
||||
let params = { type_key: 'business' };
|
||||
http('/api/keywords', params, 'get').then(res => {
|
||||
category.value = res.data.filter(v => v.id == cid.value)[0];
|
||||
}).catch(err => {
|
||||
showToast(err.message);
|
||||
});
|
||||
};
|
||||
|
||||
const getDetail = ()=>{
|
||||
http(`/api/article/${id.value}`, {}, 'get').then(res => {
|
||||
detail.value = res.data;
|
||||
}).catch(err => {
|
||||
showToast(err.message);
|
||||
});
|
||||
};
|
||||
|
||||
const goBack = () => {
|
||||
router.back();
|
||||
};
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.pageContainer{
|
||||
color: #FFF;
|
||||
padding: 25px;
|
||||
background-color: #242527;
|
||||
.breadNav{
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
color: #999;
|
||||
font-size: 22px;
|
||||
span{
|
||||
padding: 0 5px;
|
||||
}
|
||||
a{
|
||||
color: #999;
|
||||
&:hover{
|
||||
color: #FFF;
|
||||
}
|
||||
}
|
||||
}
|
||||
.loadingBox{
|
||||
width: 100%;
|
||||
height: 400px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
font-size: 24px;
|
||||
}
|
||||
.article{
|
||||
padding: 20px 0;
|
||||
.title{
|
||||
font-size: 26px;
|
||||
line-height: 30px;
|
||||
font-weight: bold;
|
||||
color: #FFF;
|
||||
text-align: center;
|
||||
padding: 10px 0;
|
||||
}
|
||||
.props{
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
line-height: 30px;
|
||||
color: #999;
|
||||
font-size: 23px;
|
||||
span{
|
||||
display: inline-block;
|
||||
margin: 10px;
|
||||
}
|
||||
}
|
||||
.info{
|
||||
line-height: 1.5;
|
||||
font-size: 23px;
|
||||
:deep(p){
|
||||
padding: 10px 0;
|
||||
}
|
||||
:deep(strong){
|
||||
font-weight: bold;
|
||||
}
|
||||
:deep(b){
|
||||
font-weight: bold;
|
||||
}
|
||||
:deep(h1){
|
||||
font-weight: bold;
|
||||
}
|
||||
:deep(img){
|
||||
max-width: 100%;
|
||||
display: block;
|
||||
margin: 10px auto;
|
||||
}
|
||||
}
|
||||
.recommend{
|
||||
padding: 30px 0;
|
||||
.blockTitle{
|
||||
height: 46px;
|
||||
line-height: 45px;
|
||||
border-bottom: 1px solid #666;
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
}
|
||||
ul{
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
li{
|
||||
width: 50%;
|
||||
padding-right: 30px;
|
||||
display: flex;
|
||||
margin-top: 30px;
|
||||
.img{
|
||||
width: 120px;
|
||||
height: 168px;
|
||||
overflow: hidden;
|
||||
img{
|
||||
width: 120px;
|
||||
height: 168px;
|
||||
}
|
||||
}
|
||||
.info{
|
||||
flex: 1;
|
||||
margin-left: 15px;
|
||||
height: 168px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
h3{
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
p{
|
||||
padding: 10px 0;
|
||||
font-size: 12px;
|
||||
line-height: 22px;
|
||||
flex: 1;
|
||||
}
|
||||
span{
|
||||
color: #999;
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,18 +1,16 @@
|
|||
<template>
|
||||
<div class="pageContainer">
|
||||
<div class="banner" :style="`background-image: url(${banner.picture})`">
|
||||
<div class="bannerContent">
|
||||
<div class="desc">
|
||||
<h2>{{banner.name}}</h2>
|
||||
<p>{{banner.description }}</p>
|
||||
</div>
|
||||
<div class="desc">
|
||||
<h2>{{ banner.name }}</h2>
|
||||
<p>{{ banner.description }}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mainBox">
|
||||
<ul class="menu">
|
||||
<li :class="{active: cid == item.id}" @click="jump(item.id)" v-for="item in categories">{{item.name}}</li>
|
||||
</ul>
|
||||
<CardList :key="cid" :cid="cid"></CardList>
|
||||
<CardList :key="cid" :cid="cid" type="business"></CardList>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -22,7 +20,7 @@ import { ref, onBeforeMount, onMounted, onUpdated, watch } from 'vue';
|
|||
import http from '@/io/http';
|
||||
import { showToast } from 'vant';
|
||||
import { useRouter, useRoute } from 'vue-router';
|
||||
import CardList from './components/CategoryCardList.vue';
|
||||
import CardList from '../components/CategoryCardList.vue';
|
||||
|
||||
const router = useRouter();
|
||||
const route = useRoute();
|
||||
|
|
@ -63,12 +61,8 @@ const getCategories = ()=>{
|
|||
});
|
||||
};
|
||||
|
||||
const goBack = () => {
|
||||
router.push('/insights/category');
|
||||
};
|
||||
|
||||
const jump = (cid)=>{
|
||||
router.push(`/insights/category/${cid}`);
|
||||
router.push(`/business/insight/category/${cid}`);
|
||||
};
|
||||
</script>
|
||||
|
||||
|
|
@ -78,17 +72,11 @@ const jump = (cid)=>{
|
|||
color: #FFF;
|
||||
.banner{
|
||||
width: 100%;
|
||||
height: 17.6rem;
|
||||
height: 216px;
|
||||
background-color: rgba($color: #FFF, $alpha: 0.5);
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
background-size: cover;
|
||||
background-position: center center;
|
||||
.bannerContent{
|
||||
width: 90rem;
|
||||
height: 17.6rem;
|
||||
margin: 0 auto;
|
||||
position: relative;
|
||||
}
|
||||
.desc{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
|
@ -98,45 +86,37 @@ const jump = (cid)=>{
|
|||
align-items: center;
|
||||
text-align: center;
|
||||
h2{
|
||||
font-size: 36px;
|
||||
font-size: 27px;
|
||||
}
|
||||
p{
|
||||
width: 326px;
|
||||
font-size: 12px;
|
||||
line-height: 20px;
|
||||
width: 460px;
|
||||
font-size: 23px;
|
||||
line-height: 30px;
|
||||
padding: 10px 0;
|
||||
}
|
||||
}
|
||||
.nav{
|
||||
position: absolute;
|
||||
top: 38px;
|
||||
right: 20px;
|
||||
font-size: 16px;
|
||||
cursor: pointer;
|
||||
line-height: 30px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
span{
|
||||
margin-left: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.mainBox{
|
||||
width: 90rem;
|
||||
margin: 20px auto;
|
||||
width: 100%;
|
||||
.menu{
|
||||
width: 100%;
|
||||
height: 90px;
|
||||
overflow-y: hidden;
|
||||
overflow-x: auto;
|
||||
display: flex;
|
||||
padding: 10px 0;
|
||||
flex-wrap: wrap;
|
||||
padding: 20px;
|
||||
flex-wrap: nowrap;
|
||||
position: relative;
|
||||
li{
|
||||
height: 48px;
|
||||
padding: 0 20px;
|
||||
border-radius: 3px;
|
||||
color: #999;
|
||||
line-height: 30px;
|
||||
margin-left: 17px;
|
||||
margin-bottom: 10px;
|
||||
cursor: pointer;
|
||||
&:hover,
|
||||
line-height: 48px;
|
||||
margin-right: 20px;
|
||||
font-size: 28px;
|
||||
white-space: nowrap;
|
||||
&:active,
|
||||
&.active{
|
||||
background: #3662FE;
|
||||
color: #FFF;
|
||||
|
|
@ -0,0 +1,130 @@
|
|||
<template>
|
||||
<div class="pageContainer">
|
||||
<div class="content">
|
||||
<div class="card policy" @click="jump('/business/legal/policy')">
|
||||
<div class="name"><span>政策解读</span></div>
|
||||
<div class="desc">
|
||||
“宏观经济政策”（macroeconomic policy）是指国家或政府有意识有计划地运用一定的政策工具，调节控制宏观经济的
|
||||
</div>
|
||||
<div class="more">详情 ></div>
|
||||
</div>
|
||||
<div class="card map" @click="jump('/business/legal/country')">
|
||||
<div class="name"><span>国别（地区）指南</span></div>
|
||||
<div class="desc">
|
||||
“宏观经济政策”（macroeconomic policy）是指国家或政府有意识有计划地运用一定的政策工具，调节控制宏观经济的
|
||||
</div>
|
||||
<div class="more">详情 ></div>
|
||||
</div>
|
||||
<div class="card searchLaw" @click="jump('/business/legal/search')">
|
||||
<div class="name"><span>境外法规检索</span></div>
|
||||
<div class="desc">
|
||||
“宏观经济政策”（macroeconomic policy）是指国家或政府有意识有计划地运用一定的政策工具，调节控制宏观经济的
|
||||
</div>
|
||||
<div class="more">详情 ></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { useRouter, useRoute } from 'vue-router';
|
||||
|
||||
const router = useRouter();
|
||||
|
||||
const jump = (path) => {
|
||||
router.push(path);
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.pageContainer{
|
||||
color: #FFF;
|
||||
padding: 90px 60px;
|
||||
.content{
|
||||
position: relative;
|
||||
&::before{
|
||||
content: '';
|
||||
width: 160px;
|
||||
height: 128px;
|
||||
background: url('@/assets/images/law_cube2.png') no-repeat center;
|
||||
background-size: contain;
|
||||
position: absolute;
|
||||
top: -90px;
|
||||
left: -20px;
|
||||
z-index: 1;
|
||||
}
|
||||
&::after{
|
||||
content: '';
|
||||
width: 160px;
|
||||
height: 128px;
|
||||
background: url('@/assets/images/law_cube1.png') no-repeat center;
|
||||
background-size: contain;
|
||||
position: absolute;
|
||||
bottom: -90px;
|
||||
right: -20px;
|
||||
z-index: 1;
|
||||
}
|
||||
.card{
|
||||
width: 100%;
|
||||
height: 254px;
|
||||
margin-top: 25px;
|
||||
padding: 20px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
&.policy{
|
||||
background: url('@/assets/images/policy_analysis.jpg') no-repeat center center;
|
||||
background-size: cover;
|
||||
}
|
||||
&.map{
|
||||
background: url('@/assets/images/map_guide.jpg') no-repeat center center;
|
||||
background-size: cover;
|
||||
}
|
||||
&.searchLaw{
|
||||
background: url('@/assets/images/oversea_law.jpg') no-repeat center center;
|
||||
background-size: cover;
|
||||
}
|
||||
&:hover{
|
||||
border-color: #FFF;
|
||||
box-shadow: 0 0 10px rgba($color: #FFF, $alpha: 0.5);
|
||||
}
|
||||
.name{
|
||||
font-size: 27px;
|
||||
text-indent: 10px;
|
||||
position: relative;
|
||||
line-height: 50px;
|
||||
height: 50px;
|
||||
font-weight: bold;
|
||||
&::before{
|
||||
content: '';
|
||||
width: 31px;
|
||||
height: 31px;
|
||||
background: #3662FE;
|
||||
border-radius: 3px;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 0;
|
||||
}
|
||||
span{
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
}
|
||||
.desc{
|
||||
font-size: 22px;
|
||||
line-height: 30px;
|
||||
text-indent: 2em;
|
||||
}
|
||||
.more{
|
||||
width: 100%;
|
||||
font-size: 24px;
|
||||
text-align: right;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,128 @@
|
|||
<template>
|
||||
<div class="pageContainer">
|
||||
<div class="banner" :style="`background-image: url(${banner.picture})`" v-if="banner">
|
||||
<div class="desc">
|
||||
<h2>{{ banner.name }}</h2>
|
||||
<p>{{ banner.description }}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mainBox">
|
||||
<ul class="menu" v-if="categories.length > 0">
|
||||
<li :class="{ active: !cid }" @click="cid = 0" >全部</li>
|
||||
<li :class="{ active: cid == item.id }" @click="changeCategory(item.id)" v-for="item in categories">{{ item.name }}</li>
|
||||
</ul>
|
||||
<CardList :key="cid" :cid="cid" type="policy"></CardList>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, onBeforeMount, onMounted, onUpdated, watch } from 'vue';
|
||||
import http from '@/io/http';
|
||||
import { showToast } from 'vant';
|
||||
import { useRouter, useRoute } from 'vue-router';
|
||||
import CardList from '../components/CategoryCardList.vue';
|
||||
|
||||
const cid = ref(0);
|
||||
const banner = ref();
|
||||
const categories = ref([]);
|
||||
|
||||
onBeforeMount(() => {
|
||||
getBanner();
|
||||
getCategories();
|
||||
});
|
||||
|
||||
const getBanner = () => {
|
||||
let params = { key: 'pc_policy' };
|
||||
http('/api/banner', params, 'get').then(res => {
|
||||
banner.value = Array.isArray(res.data) ? res.data[0] : {};
|
||||
}).catch(err => {
|
||||
message.error(err.message);
|
||||
});
|
||||
};
|
||||
|
||||
const getCategories = () => {
|
||||
let params = {
|
||||
type_key: 'policy',
|
||||
};
|
||||
http('/api/keywords', params, 'get').then(res => {
|
||||
categories.value = res.data || [];
|
||||
}).catch(err => {
|
||||
message.error(err.message);
|
||||
});
|
||||
};
|
||||
|
||||
const changeCategory = (val) => {
|
||||
cid.value = val;
|
||||
};
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.pageContainer {
|
||||
width: 100%;
|
||||
color: #FFF;
|
||||
|
||||
.banner {
|
||||
width: 100%;
|
||||
height: 216px;
|
||||
background-color: rgba($color: #FFF, $alpha: 0.5);
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
background-position: center center;
|
||||
|
||||
.desc {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
|
||||
h2 {
|
||||
font-size: 27px;
|
||||
}
|
||||
|
||||
p {
|
||||
width: 460px;
|
||||
font-size: 23px;
|
||||
line-height: 30px;
|
||||
padding: 10px 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.mainBox {
|
||||
width: 100%;
|
||||
|
||||
.menu {
|
||||
width: 100%;
|
||||
height: 90px;
|
||||
overflow-y: hidden;
|
||||
overflow-x: auto;
|
||||
display: flex;
|
||||
padding: 20px;
|
||||
flex-wrap: nowrap;
|
||||
position: relative;
|
||||
|
||||
li {
|
||||
height: 48px;
|
||||
padding: 0 20px;
|
||||
border-radius: 3px;
|
||||
color: #999;
|
||||
line-height: 48px;
|
||||
margin-right: 20px;
|
||||
font-size: 28px;
|
||||
white-space: nowrap;
|
||||
|
||||
&:active,
|
||||
&.active {
|
||||
background: #3662FE;
|
||||
color: #FFF;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}</style>
|
||||
|
|
@ -0,0 +1,216 @@
|
|||
<template>
|
||||
<div class="pageContainer">
|
||||
<div class="breadNav">
|
||||
<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/policy">政策解读</router-link><span>></span>
|
||||
<span>详情</span>
|
||||
</div>
|
||||
<div class="article">
|
||||
<template v-if="detail">
|
||||
<h1 class="title">{{detail.title}}</h1>
|
||||
<div class="props">
|
||||
<span>作者：{{detail.author }}</span>
|
||||
<span>责编：{{detail.editor }}</span>
|
||||
<span>{{DateFormat(new Date(detail.published_at * 1000), 'yyyy.MM.dd')}}</span>
|
||||
</div>
|
||||
<div class="info">
|
||||
<div v-html="detail.content"></div>
|
||||
</div>
|
||||
</template>
|
||||
<div class="loadingBox" v-else>数据加载中...</div>
|
||||
<div class="recommend" v-if="recommend.length > 0">
|
||||
<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>
|
||||
<span>{{ DateFormat(new Date(item.published_at * 1000), 'yyyy.MM.dd') }}</span>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <AiAssistant></AiAssistant> -->
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, onBeforeMount, onMounted } from 'vue';
|
||||
import http from '@/io/http';
|
||||
import { showToast } from 'vant';
|
||||
import { useRouter, useRoute } from 'vue-router';
|
||||
import { DateFormat } from '@/utils/format.js';
|
||||
// import AiAssistant from '@/views/chat/components/ai-assistant.vue';
|
||||
|
||||
const router = useRouter();
|
||||
const route = useRoute();
|
||||
const id = ref(route.params.id);
|
||||
const category = ref({});
|
||||
const detail = ref();
|
||||
const recommend = ref([]);
|
||||
|
||||
|
||||
onMounted(()=>{
|
||||
getDetail();
|
||||
getRecommendList();
|
||||
});
|
||||
|
||||
|
||||
const getDetail = ()=>{
|
||||
http(`/api/article/${id.value}`, {}, 'get').then(res => {
|
||||
detail.value = res.data;
|
||||
category.value = res.data.category;
|
||||
}).catch(err => {
|
||||
showToast(err.message);
|
||||
});
|
||||
};
|
||||
|
||||
const getRecommendList = () => {
|
||||
let params = {
|
||||
recommend: 1,
|
||||
type: 'policy',
|
||||
per_page: 4,
|
||||
page: 1
|
||||
};
|
||||
http('/api/article', params, 'get').then(res => {
|
||||
recommend.value = res.data.data || [];
|
||||
}).catch(err => {
|
||||
message.error(err.message);
|
||||
});
|
||||
};
|
||||
|
||||
const goDetail = (id) => {
|
||||
router.push(`/business/legal/policy/detail/${id}`);
|
||||
};
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.pageContainer{
|
||||
color: #FFF;
|
||||
padding: 25px;
|
||||
background-color: #242527;
|
||||
.breadNav{
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
color: #999;
|
||||
font-size: 22px;
|
||||
span{
|
||||
padding: 0 5px;
|
||||
}
|
||||
a{
|
||||
color: #999;
|
||||
&:hover{
|
||||
color: #FFF;
|
||||
}
|
||||
}
|
||||
}
|
||||
.loadingBox{
|
||||
width: 100%;
|
||||
height: 400px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
font-size: 24px;
|
||||
}
|
||||
.article{
|
||||
padding: 20px 0;
|
||||
.title{
|
||||
font-size: 26px;
|
||||
line-height: 30px;
|
||||
font-weight: bold;
|
||||
color: #FFF;
|
||||
text-align: center;
|
||||
padding: 10px 0;
|
||||
}
|
||||
.props{
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
line-height: 30px;
|
||||
color: #999;
|
||||
font-size: 23px;
|
||||
span{
|
||||
display: inline-block;
|
||||
margin: 10px;
|
||||
}
|
||||
}
|
||||
.info{
|
||||
line-height: 1.5;
|
||||
font-size: 23px;
|
||||
:deep(p){
|
||||
padding: 10px 0;
|
||||
}
|
||||
:deep(strong){
|
||||
font-weight: bold;
|
||||
}
|
||||
:deep(b){
|
||||
font-weight: bold;
|
||||
}
|
||||
:deep(h1){
|
||||
font-weight: bold;
|
||||
}
|
||||
:deep(img){
|
||||
max-width: 100%;
|
||||
display: block;
|
||||
margin: 10px auto;
|
||||
}
|
||||
}
|
||||
.recommend{
|
||||
padding: 30px 0;
|
||||
.blockTitle{
|
||||
height: 80px;
|
||||
line-height: 80px;
|
||||
border-bottom: 1px solid #666;
|
||||
font-size: 39px;
|
||||
font-weight: bold;
|
||||
}
|
||||
ul{
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
li{
|
||||
width: 100%;
|
||||
padding-right: 30px;
|
||||
display: flex;
|
||||
margin-top: 30px;
|
||||
.img{
|
||||
width: 260px;
|
||||
height: 360px;
|
||||
overflow: hidden;
|
||||
img{
|
||||
width: 260px;
|
||||
height: 360px;
|
||||
}
|
||||
}
|
||||
.info{
|
||||
flex: 1;
|
||||
margin-left: 15px;
|
||||
height: 360px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
h3{
|
||||
font-size: 32px;
|
||||
font-weight: bold;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
p{
|
||||
padding: 10px 0;
|
||||
font-size: 26px;
|
||||
line-height: 30px;
|
||||
flex: 1;
|
||||
}
|
||||
span{
|
||||
color: #999;
|
||||
font-size: 22px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue