榆钱落尽槿花稀
9bf2ef8ed5
调整了多个页面的样式，包括间距、字体大小、背景颜色等，以优化布局和响应式设计。具体修改包括： - 调整了 `.box_1` 在移动设备下的高度。 - 修改了 `.bottom_imgss` 的背景颜色。 - 在 `AppFooter` 组件中添加了分隔线并调整了背景颜色。 - 优化了 `phone_index.vue` 中的边距和高度设置。 - 在 `phone_concatUs.vue` 中调整了 padding 和背景颜色。 - 在 `phone_info/[id].vue` 中优化了标题和内容的边距。 - 在 `phone_societyDuty.vue` 和 `phone_societyDutyNew.vue` 中添加了顶部导航栏和分隔线。 - 在 `phone_aboutUs.vue` 中调整了文本对齐方式和边距。 - 在 `phone_proServices_con.vue` 和 `phone_proServices.vue` 中优化了布局和样式。 这些修改旨在提升用户体验和界面一致性。
80 lines
2.4 KiB
Vue
80 lines
2.4 KiB
Vue
<template>
|
||
<div style="width: 100%;">
|
||
<div style="height:60px;background-color: #ffffff;"></div>
|
||
<div style="background-color: #eeeeee;width:100%;height: 0.5px;"></div>
|
||
<div style="background-color: #F8F8F8;">
|
||
<div class="content_class" style="">
|
||
<div style="font-size: 20px;font-weight: 700;color: #323232;">{{ info.title }}</div>
|
||
<div style="font-size: 14px;font-weight: 400;margin-top: 15px;color: #768597;">
|
||
<div>发 布 人：{{ info.author }}</div>
|
||
<div style="margin-top: 5px;">发布时间：{{ info.release_time_text }} </div>
|
||
</div>
|
||
<div style="width: 100%;margin:20px 0px 0px 0px;height: 1px;background-color: #EEEEEE;"></div>
|
||
<div class="info_content" v-html="info.content"></div>
|
||
<div style="width: 100%;margin: 20px auto;height: 1px;background-color: #EEEEEE;"></div>
|
||
<div style="display: flex;justify-content: space-between;align-items: center;">
|
||
<div style="width: 100%;">
|
||
<div @click="openNews(1)" style="cursor: pointer;">上一篇：{{ info.prev != null ? info.prev.title : '暂无' }}
|
||
</div>
|
||
<div @click="openNews(2)" style="margin-top: 20px;cursor: pointer;">
|
||
下一篇：{{ info.next != null ? info.next.title : '暂无' }}</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
|
||
<script lang="ts" setup>
|
||
import { nextTick, ref } from 'vue'
|
||
const route = useRoute()
|
||
import $api from '@/service/webRequest'
|
||
import { Item } from 'ant-design-vue/es/menu'
|
||
const id = ref(route.params.id)
|
||
const openNews = (type) => {
|
||
if (type == 1 && info.value.prev != null) {
|
||
window.open('/phone_info/' + info.value.prev.id, '_self');
|
||
}
|
||
if (type == 2 && info.value.next != null) {
|
||
window.open('/phone_info/' + info.value.next.id, '_self');
|
||
}
|
||
}
|
||
// 新闻数据
|
||
onMounted(() => {
|
||
getInfo();
|
||
})
|
||
const info = ref({});
|
||
const getInfo = async () => {
|
||
const res = await $api.get('/api/home.news/detail?id=' + id.value)
|
||
console.log(res);
|
||
info.value = res.data.data;
|
||
}
|
||
const delWeb = () => {
|
||
window.close();
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
@import "@/assets/animate/animate.min.css";
|
||
@import "@/assets/index.scss";
|
||
|
||
.info_content img {
|
||
width: 100% !important;
|
||
margin: 0 auto;
|
||
margin-bottom: 10px;
|
||
}
|
||
|
||
.info_content {
|
||
line-height: 28px;
|
||
text-align: justify!important;
|
||
}
|
||
|
||
.content_class {
|
||
width: 100%;
|
||
min-height: 500px;
|
||
margin: 0 auto;
|
||
background-color: #ffffff;
|
||
padding: 30px;
|
||
}
|
||
</style>
|