H5
This commit is contained in:
parent
87b389570f
commit
707a3f456c
@ -57,7 +57,7 @@
|
|||||||
</div> -->
|
</div> -->
|
||||||
<!-- <div style="width: 100%;height: 1px;background-color: #EEEEEE;"></div> -->
|
<!-- <div style="width: 100%;height: 1px;background-color: #EEEEEE;"></div> -->
|
||||||
<div v-for="(item, index) in MesList" :key="index">
|
<div v-for="(item, index) in MesList" :key="index">
|
||||||
<div class="re_box_item" @click="openUrl(item.id)">
|
<div class="re_box_item" @click="openUrl(item.id)">
|
||||||
<div class="re_title">
|
<div class="re_title">
|
||||||
<div class="flex align-center">
|
<div class="flex align-center">
|
||||||
<div class="dian"></div>
|
<div class="dian"></div>
|
||||||
|
@ -1,11 +1,68 @@
|
|||||||
<template>
|
<template>
|
||||||
<!-- PC端布局 -->
|
|
||||||
<div class="w-full h-full" style="padding: 20px;">
|
<div class="w-full h-full" style="padding: 20px;">
|
||||||
<div>
|
<div style="background-color: #fff;border-radius: 10px;padding: 20px;position: relative;">
|
||||||
|
<img :src="`/img/tt.png`" style="position: absolute;top: -7px;left: 0;right: 0;margin: auto;width: 150px;;">
|
||||||
|
<div style="display: flex;align-items: center;margin-top: 30px;">
|
||||||
|
<div>姓名</div>
|
||||||
|
<div style="width: 90%;">
|
||||||
|
<input type="text" placeholder="请输入您的姓名" v-model="formData.name" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div style="display: flex;align-items: center;margin-top: 20px;">
|
||||||
|
<div>电话</div>
|
||||||
|
<div style="width: 90%;">
|
||||||
|
<input type="text" placeholder="请输入您的电话" v-model="formData.mobile" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div style="display: flex;align-items: center;margin-top: 20px;">
|
||||||
|
<div>问题</div>
|
||||||
|
<div style="width: 90%;">
|
||||||
|
<input type="text" placeholder="请输入您的问题" v-model="formData.question" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div style="display: flex;margin-top: 20px;">
|
||||||
|
<div>描述</div>
|
||||||
|
<div style="width: 90%;">
|
||||||
|
<textarea placeholder="请输入您的描述" :maxlength="300" v-model="formData.message"
|
||||||
|
style="margin-left: 10px;width: 100%;height: 100px;border: 1px solid #BBBBBB;border-radius: 6px;padding: 7px;"></textarea>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<button @click="submitForm" class="contactBut">提交</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div style="margin-top: 20px;">
|
||||||
|
<div style="display: flex;justify-content: center;align-items: center;gap: 10px;">
|
||||||
|
<div style="background-color: #358DDE;width: 35px;height: 2px;"></div>
|
||||||
|
<div style="font-size: 23px;font-weight: 600;color: #358DDE;">精选留言</div>
|
||||||
|
<div style="background-color: #358DDE;width: 35px;height: 2px;"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="re_list_top" style="gap: 20px;">
|
||||||
|
<div class="re_list" v-for="item, index in liuyanList"
|
||||||
|
style="background-color: #fff;border-radius: 8px;padding: 20px;margin-top: 10px;">
|
||||||
|
<div>
|
||||||
|
<div class="re_list_tit flex" style="width: 100%;">
|
||||||
|
<span style="width: 17%;color: #FFA234;font-weight: 600;">问题:</span>
|
||||||
|
<span style="color: #323232;width:85%;font-weight: 600;">{{ item.question }}</span>
|
||||||
|
</div>
|
||||||
|
<div class="re_list_tit flex" style="margin-top: 15px;width: 100%;">
|
||||||
|
<span style="width: 17%;color: #FFA234;font-weight: 600;">描述:</span>
|
||||||
|
<span :title="item.message" class="three-line-ellipsis"
|
||||||
|
style="font-weight: 400;font-size: 14px;color: #999999;width:85% ;">{{ item.message
|
||||||
|
}}</span>
|
||||||
|
</div>
|
||||||
|
<div class="re_list_tit flex" style="margin-top: 15px;">
|
||||||
|
<span style="color: #368FDF;width: 17%;font-weight: 600;">回复:</span>
|
||||||
|
<span :title="item.answer"
|
||||||
|
style="font-weight: 400;font-size: 14px;color: #999999;width:85% ;">{{ item.answer
|
||||||
|
}}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
@ -47,7 +104,7 @@ const toSearch = () => {
|
|||||||
window.open(`/search_info?type=1&keywords=${inputSearch.value}`)
|
window.open(`/search_info?type=1&keywords=${inputSearch.value}`)
|
||||||
}
|
}
|
||||||
const emit = defineEmits(['toSwpe'])
|
const emit = defineEmits(['toSwpe'])
|
||||||
const toMore = (index:number) => {
|
const toMore = (index: number) => {
|
||||||
emit('toSwpe', index);
|
emit('toSwpe', index);
|
||||||
}
|
}
|
||||||
const hmScroll = () => {
|
const hmScroll = () => {
|
||||||
@ -107,4 +164,26 @@ const submitForm = () => {
|
|||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
@import '@/assets/index.scss';
|
@import '@/assets/index.scss';
|
||||||
|
|
||||||
|
input {
|
||||||
|
border: 1px solid #BBBBBB;
|
||||||
|
border-radius: 6px;
|
||||||
|
padding: 7px;
|
||||||
|
margin-left: 10px;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
.contactBut {
|
||||||
|
width: 70px;
|
||||||
|
border-radius: 4px 4px 4px 4px;
|
||||||
|
// position: absolute;
|
||||||
|
// bottom: 20px;
|
||||||
|
// right: 30px;
|
||||||
|
height: 30px;
|
||||||
|
margin-top: 10px;
|
||||||
|
margin-left: 40px;
|
||||||
|
background: linear-gradient(0deg, #338CDE 0%, #469CE2 100%);
|
||||||
|
border: none;
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 14px;
|
||||||
|
color: #FFFFFF;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
@ -34,7 +34,7 @@
|
|||||||
<div v-if="zmList.length != index + 1"
|
<div v-if="zmList.length != index + 1"
|
||||||
style="width: 100%;height: 1px;background-color: #EEEEEE;margin: 15px 0px;"></div>
|
style="width: 100%;height: 1px;background-color: #EEEEEE;margin: 15px 0px;"></div>
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div @click="openTab(3)"
|
||||||
style="margin: 20px 10px;text-align: center;background-color: #EEEEEE;height: 50px;width: 100%;line-height: 50px;">
|
style="margin: 20px 10px;text-align: center;background-color: #EEEEEE;height: 50px;width: 100%;line-height: 50px;">
|
||||||
查看更多 ></div>
|
查看更多 ></div>
|
||||||
</div>
|
</div>
|
||||||
@ -66,7 +66,7 @@
|
|||||||
<div v-if="index != 6"
|
<div v-if="index != 6"
|
||||||
style="width: 95%;height: 1px;background-color: #EEEEEE;margin: 15px 0;"></div>
|
style="width: 95%;height: 1px;background-color: #EEEEEE;margin: 15px 0;"></div>
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div @click="openTab(3)"
|
||||||
style="margin: 20px 10px;text-align: center;background-color: #EEEEEE;height: 50px;line-height: 50px;">
|
style="margin: 20px 10px;text-align: center;background-color: #EEEEEE;height: 50px;line-height: 50px;">
|
||||||
查看更多 ></div>
|
查看更多 ></div>
|
||||||
</div>
|
</div>
|
||||||
@ -103,7 +103,7 @@ const listType = ref([]);
|
|||||||
const listIndex = ref(0);
|
const listIndex = ref(0);
|
||||||
const detailId = ref(null);
|
const detailId = ref(null);
|
||||||
|
|
||||||
const emit = defineEmits(['toSwpe'])
|
const emit = defineEmits(['toTab'])
|
||||||
const swiperOptionsimgs = {
|
const swiperOptionsimgs = {
|
||||||
autoplay: {
|
autoplay: {
|
||||||
delay: 5000,
|
delay: 5000,
|
||||||
@ -119,15 +119,10 @@ const swiperOptionsimgs = {
|
|||||||
el: '.swiper-pagination'
|
el: '.swiper-pagination'
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
const toSearch = () => {
|
|
||||||
// emit('toSwpe',9);
|
|
||||||
// emitter.emit('inputSea', {
|
|
||||||
// keywords:inputSearch.value,
|
|
||||||
// type: 1,
|
|
||||||
// });
|
|
||||||
window.open(`/search_info?type=1&keywords=${inputSearch.value}`)
|
|
||||||
}
|
|
||||||
|
|
||||||
|
const openTab = (type: number) => {
|
||||||
|
emit('toTab', type);
|
||||||
|
}
|
||||||
const openWeb = (item) => {
|
const openWeb = (item) => {
|
||||||
//out 外链 in内部
|
//out 外链 in内部
|
||||||
if (item.type == 'out') {
|
if (item.type == 'out') {
|
||||||
@ -138,7 +133,7 @@ const openWeb = (item) => {
|
|||||||
console.log(item)
|
console.log(item)
|
||||||
}
|
}
|
||||||
const openUrl = (id: number) => {
|
const openUrl = (id: number) => {
|
||||||
window.open(`/phone_info/${id}?type=1`)
|
window.location.href=`/phone_info/${id}?type=1`;
|
||||||
}
|
}
|
||||||
//跳转详情
|
//跳转详情
|
||||||
// const gotoDetail = (id: number) => {
|
// const gotoDetail = (id: number) => {
|
||||||
|
@ -15,7 +15,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div v-for="(item, index) in MesList" :key="index">
|
<div v-for="(item, index) in MesList" :key="index" @click="openUrl(item.id)">
|
||||||
<div class="re_box_item">
|
<div class="re_box_item">
|
||||||
<div class="re_title">
|
<div class="re_title">
|
||||||
<div class="flex align-center">
|
<div class="flex align-center">
|
||||||
@ -56,7 +56,7 @@ onMounted(() => {
|
|||||||
|
|
||||||
//跳转详情
|
//跳转详情
|
||||||
const openUrl = (id: number) => {
|
const openUrl = (id: number) => {
|
||||||
window.open(`/info/${id}?type=2`)
|
window.location.href=`/phone_info/${id}?type=2`;
|
||||||
}
|
}
|
||||||
|
|
||||||
const getPageList = async (type: number) => {
|
const getPageList = async (type: number) => {
|
||||||
|
@ -15,7 +15,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div v-for="(item, index) in MesList" :key="index">
|
<div v-for="(item, index) in MesList" :key="index" @click="openUrl(item.id)">
|
||||||
<div class="re_box_item">
|
<div class="re_box_item">
|
||||||
<div class="re_title">
|
<div class="re_title">
|
||||||
<div class="flex align-center">
|
<div class="flex align-center">
|
||||||
@ -56,7 +56,7 @@ onMounted(() => {
|
|||||||
|
|
||||||
//跳转详情
|
//跳转详情
|
||||||
const openUrl = (id: number) => {
|
const openUrl = (id: number) => {
|
||||||
window.open(`/info/${id}?type=1`)
|
window.location.href=`/phone_info/${id}?type=1`;
|
||||||
}
|
}
|
||||||
|
|
||||||
const getPageList = async (type: number) => {
|
const getPageList = async (type: number) => {
|
||||||
|
@ -15,7 +15,7 @@
|
|||||||
<div style="padding-bottom: 20px;">
|
<div style="padding-bottom: 20px;">
|
||||||
<img src="/img/tuan.png" style="width: 200px;margin: 0 auto;">
|
<img src="/img/tuan.png" style="width: 200px;margin: 0 auto;">
|
||||||
</div>
|
</div>
|
||||||
<div v-for="(item, index) in MesList" :key="index">
|
<div v-for="(item, index) in MesList" :key="index" @click="openUrl(item.id)">
|
||||||
<div class="re_box_item">
|
<div class="re_box_item">
|
||||||
<div class="re_title">
|
<div class="re_title">
|
||||||
<div class="flex align-center">
|
<div class="flex align-center">
|
||||||
@ -76,7 +76,7 @@ const toMore = () => {
|
|||||||
}
|
}
|
||||||
//跳转详情
|
//跳转详情
|
||||||
const openUrl = (id: number) => {
|
const openUrl = (id: number) => {
|
||||||
window.open(`/info/${id}?type=3`)
|
window.location.href=`/phone_info/${id}?type=3`;
|
||||||
}
|
}
|
||||||
//跳转详情
|
//跳转详情
|
||||||
// const gotoDetail = (id: number) => {
|
// const gotoDetail = (id: number) => {
|
||||||
|
@ -1,12 +1,13 @@
|
|||||||
<template>
|
<template>
|
||||||
<div style="width: 100%;background-color: #F0F9FF;">
|
<div style="width: 100%;background-color: #F0F9FF;">
|
||||||
<PhoneHeader :crrentNum="phone_index" @phoneCrrent="toswiper"></PhoneHeader>
|
<PhoneHeader :crrentNum="phone_index" @phoneCrrent="toswiper"></PhoneHeader>
|
||||||
<PhoneHome v-if="phone_index == 1"></PhoneHome>
|
<PhoneHome v-if="phone_index == 1" @toTab="toswiper"></PhoneHome>
|
||||||
<PhoneAbout v-if="phone_index == 2"></PhoneAbout>
|
<PhoneAbout v-if="phone_index == 2"></PhoneAbout>
|
||||||
<PhoneNews v-if="phone_index == 3"></PhoneNews>
|
<PhoneNews v-if="phone_index == 3"></PhoneNews>
|
||||||
<PhoneLuoYang v-if="phone_index == 4"></PhoneLuoYang>
|
<PhoneLuoYang v-if="phone_index == 4"></PhoneLuoYang>
|
||||||
<PhoneRegiment v-if="phone_index == 5"></PhoneRegiment>
|
<PhoneRegiment v-if="phone_index == 5"></PhoneRegiment>
|
||||||
<PhoneMessage v-if="phone_index == 6"></PhoneMessage>
|
<PhoneMessage v-if="phone_index == 6"></PhoneMessage>
|
||||||
|
<PhoneContactUs v-if="phone_index == 7"></PhoneContactUs>
|
||||||
<PhoneFooter></PhoneFooter>
|
<PhoneFooter></PhoneFooter>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
@ -1,25 +1,28 @@
|
|||||||
<template>
|
<template>
|
||||||
<div style="width: 100%;">
|
<div style="width: 100%;">
|
||||||
<div style="height:60px;background-color: #ffffff;"></div>
|
<div
|
||||||
|
style="display: flex;justify-content: space-between;align-items: center;height:60px;background-color: #ffffff;">
|
||||||
|
<div style="width: 33.3%;padding-left: 15px;" @click="backTopDark()">
|
||||||
|
<img :src="`/img/back.png`" style="width: 30px;">
|
||||||
|
</div>
|
||||||
|
<div style="width: 33.3%;text-align: center;font-size: 18px;">新闻详情</div>
|
||||||
|
<div style="width: 33.3%;"></div>
|
||||||
|
</div>
|
||||||
<div style="background-color: #eeeeee;width:100%;height: 0.5px;"></div>
|
<div style="background-color: #eeeeee;width:100%;height: 0.5px;"></div>
|
||||||
<div style="background-color: #F8F8F8;">
|
<div style="background-color: #F8F8F8;">
|
||||||
<div class="content_class" style="">
|
<div class="content_class" style="">
|
||||||
<div style="font-size: 20px;font-weight: 700;color: #323232;">{{ info.title }}</div>
|
<div style="font-size: 18px;font-weight: 700;color: #323232;">{{ info.title }}</div>
|
||||||
<div style="font-size: 14px;font-weight: 400;margin-top: 15px;color: #768597;">
|
<div
|
||||||
<div>发 布 人:{{ info.author }}</div>
|
style="display: flex;justify-content: space-between;align-items: center;font-size: 14px;font-weight: 400;margin-top: 15px;color: #999999;">
|
||||||
<div style="margin-top: 5px;">发布时间:{{ info.release_time_text }} </div>
|
<div>发布人:{{ info.author }}</div>
|
||||||
|
<div style="margin-top: 5px;">{{ info.release_time_text }} </div>
|
||||||
</div>
|
</div>
|
||||||
<div style="width: 100%;margin:20px 0px 0px 0px;height: 1px;background-color: #EEEEEE;"></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 class="info_content" v-html="info.content"></div>
|
||||||
<div style="width: 100%;margin: 20px auto;height: 1px;background-color: #EEEEEE;"></div>
|
<div class="re_box_item" v-if="info != null && info.type == 2">
|
||||||
<div style="display: flex;justify-content: space-between;align-items: center;">
|
<embed type="application/pdf" :src="info.file" width="100%" height="580px" alt="">
|
||||||
<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 style="width: 100%;margin: 20px auto;height: 1px;background-color: #EEEEEE;"></div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -30,7 +33,8 @@ import { nextTick, ref } from 'vue'
|
|||||||
const route = useRoute()
|
const route = useRoute()
|
||||||
import $api from '@/service/webRequest'
|
import $api from '@/service/webRequest'
|
||||||
import { Item } from 'ant-design-vue/es/menu'
|
import { Item } from 'ant-design-vue/es/menu'
|
||||||
const id = ref(route.params.id)
|
const ids = ref(route.params.id)
|
||||||
|
const types = ref(route.query.type)
|
||||||
const openNews = (type) => {
|
const openNews = (type) => {
|
||||||
if (type == 1 && info.value.prev != null) {
|
if (type == 1 && info.value.prev != null) {
|
||||||
window.open('/phone_info/' + info.value.prev.id, '_self');
|
window.open('/phone_info/' + info.value.prev.id, '_self');
|
||||||
@ -41,17 +45,43 @@ const openNews = (type) => {
|
|||||||
}
|
}
|
||||||
// 新闻数据
|
// 新闻数据
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
getInfo();
|
getNewsdetail();
|
||||||
})
|
})
|
||||||
const info = ref({});
|
const info = ref({});
|
||||||
const getInfo = async () => {
|
const getNewsdetail = async () => {
|
||||||
const res = await $api.get('/api/home.news/detail?id=' + id.value)
|
// 新闻详情
|
||||||
console.log(res);
|
if (types.value == 1) {
|
||||||
info.value = res.data.data;
|
const res = await $api.post('/api/home.news/detail',
|
||||||
|
{
|
||||||
|
id: ids.value
|
||||||
|
}
|
||||||
|
)
|
||||||
|
info.value = res.data.data;
|
||||||
|
} else if (types.value == 2) {
|
||||||
|
//信息公开文章详情
|
||||||
|
const res1 = await $api.post('/api/home.information/detail',
|
||||||
|
{
|
||||||
|
id: ids.value
|
||||||
|
}
|
||||||
|
)
|
||||||
|
info.value = res1.data.data;
|
||||||
|
} else {
|
||||||
|
// 团务百科文章详情
|
||||||
|
const res2 = await $api.post('/api/home.encyclopedia/detail',
|
||||||
|
{
|
||||||
|
id: ids.value
|
||||||
|
}
|
||||||
|
)
|
||||||
|
info.value = res2.data.data;
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
const delWeb = () => {
|
const delWeb = () => {
|
||||||
window.close();
|
window.close();
|
||||||
}
|
}
|
||||||
|
const backTopDark = () => {
|
||||||
|
window.history.back();
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss">
|
<style lang="scss">
|
||||||
@ -64,9 +94,17 @@ const delWeb = () => {
|
|||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
._1NCGf {
|
||||||
|
width: 100% !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
._2kCxD {
|
||||||
|
margin-top: 0px !important;
|
||||||
|
}
|
||||||
|
|
||||||
.info_content {
|
.info_content {
|
||||||
line-height: 28px;
|
line-height: 28px !important;
|
||||||
text-align: justify!important;
|
text-align: justify !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.content_class {
|
.content_class {
|
||||||
@ -74,6 +112,16 @@ const delWeb = () => {
|
|||||||
min-height: 500px;
|
min-height: 500px;
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
background-color: #ffffff;
|
background-color: #ffffff;
|
||||||
padding: 30px;
|
padding: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.re_box_item {
|
||||||
|
width: 100%;
|
||||||
|
background: #ffffff;
|
||||||
|
border: 1px solid #eef7ff;
|
||||||
|
box-sizing: border-box;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
min-height: 750px;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
BIN
public/img/back.png
Normal file
BIN
public/img/back.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 1.9 KiB |
Loading…
x
Reference in New Issue
Block a user