wo123/baixingwenzheng-pc
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

1

Browse Source
This commit is contained in:
王创世 2024-09-23 18:21:08 +08:00
parent a3259f9126
commit 7072f9bb69
10 changed files with 354 additions and 149 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
src/api/index.js
View File

@ -162,6 +162,14 @@ export function getDepartment(params) {
}); });
} }
export function commentsPolitics(params) {
return http('/api/politics/commentsPolitics', {
method: 'POST',
params: params,
});
}

14
src/components/Head.vue
View File

@ -89,9 +89,9 @@
</n-flex> </n-flex>
</div> </div>
<div style="width: 100%;background-color: #E7E7E7;height: 0.1rem;"></div> <div style="width: 100%;background-color: #E7E7E7;height: 0.1rem;"></div>
<div <div v-if="leftShow"
style="background: #D9D9D9;width: 120px;height: 180px;text-align: center;padding: 5px 0px 10px 0px;position: fixed;top: 40%;left: 10px"> style="z-index: 10000;background: #D9D9D9;width: 120px;height: 180px;text-align: center;padding: 5px 0px 10px 0px;position: fixed;top: 40%;left: 10px">
<div style="text-align: right;padding-right: 5px"> <div @click="leftShow= false" style="text-align: right;padding-right: 5px">
<svg style="width: 20px;height: 20px;color: #999797" xmlns="http://www.w3.org/2000/svg" <svg style="width: 20px;height: 20px;color: #999797" xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 512 512"> xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 512 512">
<path <path
@ -105,9 +105,9 @@
<img src="@/assets/img/qrcode1.png" style="width: 100px;height: 100px;margin-top: 10px"> <img src="@/assets/img/qrcode1.png" style="width: 100px;height: 100px;margin-top: 10px">
</div> </div>
</div> </div>
<div <div v-if="rightShow"
style="background: #D9D9D9;width: 120px;height: 180px;text-align: center;padding: 5px 0px 10px 0px;position: fixed;top: 40%;right: 10px"> style="z-index: 10000;background: #D9D9D9;width: 120px;height: 180px;text-align: center;padding: 5px 0px 10px 0px;position: fixed;top: 40%;right: 10px">
<div style="text-align: right;padding-right: 5px"> <div @click="rightShow = false" style="text-align: right;padding-right: 5px">
<svg style="width: 20px;height: 20px;color: #999797" xmlns="http://www.w3.org/2000/svg" <svg style="width: 20px;height: 20px;color: #999797" xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 512 512"> xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 512 512">
<path <path
@ -137,6 +137,8 @@ const router = useRouter()
const userPhone = ref(); const userPhone = ref();
const x = ref(); const x = ref();
const searchName=ref(); const searchName=ref();
const leftShow=ref(true);
const rightShow=ref(true);
onMounted(() => { onMounted(() => {
var item = sessionStorage.getItem('user'); var item = sessionStorage.getItem('user');
if (item != null) { if (item != null) {

26
src/view/department/index.vue
View File

@ -16,15 +16,21 @@
<div style="height: 100%;background-color: #FFFFFF;box-shadow: 0px 2px 4px 0px rgba(0,0,0,0.1);"> <div style="height: 100%;background-color: #FFFFFF;box-shadow: 0px 2px 4px 0px rgba(0,0,0,0.1);">
<div style="padding: 20px;position: relative"> <div style="padding: 20px;position: relative">
<div> <div>
<div style="padding: 2.5px 0px;margin-top: 20px" > <div style="padding: 2.5px 80px;margin-top: 20px" >
<n-grid x-gap="12" :cols="4" :y-gap="32"> <div v-for="(i,k) in list">
<n-gi v-for="(item,index) in list" @click="openRight(item)"> <view style="font-size: 20px;font-weight: bold">{{i.alphas}}</view>
<div style="cursor: pointer" class="right_title"> <div style="width: 100%;height: 2px;background-color: #E7E7E7;margin: 10px 0px;"></div>
<img :src="item.department_image" style="width: 50px;height: 50px"> <div style="margin-bottom: 40px;padding-top: 20px">
<div>{{item.department_name}}</div> <n-grid x-gap="24" :cols="4" :y-gap="35">
</div> <n-gi v-for="(item,index) in i.items" @click="openRight(item)">
</n-gi> <div style="cursor: pointer" class="right_title">
</n-grid> <img :src="item.department_image" style="width: 50px;height: 50px">
<div>{{item.department_name}}</div>
</div>
</n-gi>
</n-grid>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>
@ -42,7 +48,7 @@ import {Department} from "@/api/index";
import {useMessage} from "naive-ui"; import {useMessage} from "naive-ui";
import {useRouter} from "vue-router"; import {useRouter} from "vue-router";
const leftListIndex = ref(0); const leftListIndex = ref(0);
const leftList = reactive([{name:'政府部门',key:'government'},{name:'区县政府',key:'county'},{name:'公共服务行业',key:'service'}]); const leftList = reactive([{name:'政府部门',key:'government'},{name:'区县政府',key:'county'},{name:'公共服务',key:'service'},{name:'金融行业',key:'industry'}]);
const list=ref(); const list=ref();
const message = useMessage() const message = useMessage()
const router = useRouter() const router = useRouter()

38
src/view/department/info.vue
View File

@ -8,24 +8,24 @@
<div> <div>
<div style="padding: 2.5px 0px;" > <div style="padding: 2.5px 0px;" >
<div style="font-size: 20px">{{depInfo.department_name}}</div> <div style="font-size: 20px">{{depInfo.department_name}}</div>
<div> <!-- <div>-->
<div class="info_text"> <!-- <div class="info_text">-->
<text>部门电话：</text> <!-- <text>部门电话：</text>-->
<text>{{depInfo.department_phone}}</text> <!-- <text>{{depInfo.department_phone}}</text>-->
</div> <!-- </div>-->
<div class="info_text"> <!-- <div class="info_text">-->
<text>部门邮箱：</text> <!-- <text>部门邮箱：</text>-->
<text>{{depInfo.department_email}}</text> <!-- <text>{{depInfo.department_email}}</text>-->
</div> <!-- </div>-->
<div class="info_text"> <!-- <div class="info_text">-->
<text>部门网址：</text> <!-- <text>部门网址：</text>-->
<a :href="depInfo.department_website" target="_blank">{{depInfo.department_website}}</a> <!-- <a :href="depInfo.department_website" target="_blank">{{depInfo.department_website}}</a>-->
</div> <!-- </div>-->
<div class="info_text"> <!-- <div class="info_text">-->
<text>办公地址：</text> <!-- <text>办公地址：</text>-->
<text>{{depInfo.department_address}}</text> <!-- <text>{{depInfo.department_address}}</text>-->
</div> <!-- </div>-->
</div> <!-- </div>-->
</div> </div>
</div> </div>
<div> <div>
@ -47,7 +47,7 @@ import {onMounted, reactive, ref} from "vue";
import {departmentInfo} from "@/api/index"; import {departmentInfo} from "@/api/index";
import {useMessage} from "naive-ui"; import {useMessage} from "naive-ui";
import {useRouter} from "vue-router"; import {useRouter} from "vue-router";
const leftList = reactive([{name:'政府部门',key:'government'},{name:'区县政府',key:'county'},{name:'公共服务行业',key:'service'}]); const leftList = reactive([{name:'政府部门',key:'government'},{name:'区县政府',key:'county'},{name:'公共服务',key:'service'},{name:'金融行业',key:'industry'}]);
const depId=ref(); const depId=ref();
const depInfo=ref({}); const depInfo=ref({});
const message = useMessage() const message = useMessage()

270
src/view/home/index.vue
View File

@ -9,68 +9,143 @@
</div> </div>
<img src="@/assets/img/bz2.png" style="width: 200px;display: block; margin: 0 auto;"/> <img src="@/assets/img/bz2.png" style="width: 200px;display: block; margin: 0 auto;"/>
<div <div
style="color: #0051B1;font-size: 0.5rem;margin-top: 5px"> style="color: #0051B1;font-size: 16px;margin-top: 5px">
ZUI XIN WEN ZHENG ZUI XIN WEN ZHENG
</div> </div>
</div> </div>
<div>
<div :style="{ fontSize: '23px', color: '#0051B1', cursor: 'pointer'}">最新问政</div>
<div style="width: 100%;height: 1px;background-color: #E7E7E7;margin: 10px 0px;"></div>
<n-carousel @update:currentIndex="pageNo" autoplay :interval="5000" style="height: 150px;">
<n-carousel-item v-for="item in pageCount">
<div style="">
<div style="height: 150px">
<div style="display: flex;">
<!-- 左侧内容 -->
<div style="width: 50%; cursor: pointer" @click="tn('/info?id=' + item.id)">
<n-flex justify="space-between" :size="[0, 0]" v-for="k in leftContent">
<div class="te" style="font-size: 18px; width: 80%;">
<n-ellipsis :line-clamp="1">
{{ k.politics_title }}
</n-ellipsis>
</div>
<div style="font-size: 18px; width: 15%; text-align: right">
<n-ellipsis :line-clamp="1">
{{ k.department_name }}
</n-ellipsis>
</div>
</n-flex>
</div>
<view style="height: 150px;background-color: #E7E7E7;width: 2px;margin: 0px 20px"></view>
<!-- 右侧内容 -->
<div style="width: 50%; cursor: pointer" @click="tn('/info?id=' + item.id)">
<n-flex justify="space-between" :size="[0, 0]" v-for="k in rightContent">
<div class="te" style="font-size: 18px; width: 80%;">
<n-ellipsis :line-clamp="1">
{{ k.politics_title }}
</n-ellipsis>
</div>
<div style="font-size: 18px; width: 15%; text-align: right">
<n-ellipsis :line-clamp="1">
{{ k.department_name }}
</n-ellipsis>
</div>
</n-flex>
</div>
</div>
</div>
</div>
</n-carousel-item>
<!-- <template #dots="{ total, currentIndex, to }">-->
<!-- <ul class="custom-dots-yuan">-->
<!-- <li-->
<!-- v-for="index of total"-->
<!-- :key="index"-->
<!-- :class="{ ['is-active-yuan']: currentIndex === index - 1 }"-->
<!-- @click="to(index - 1)"-->
<!-- />-->
<!-- </ul>-->
<!-- </template>-->
</n-carousel>
</div>
<div style="margin-top: 30px"> <div style="margin-top: 30px">
<n-flex justify="center" align="center" :size="[0,0]"> <n-flex justify="center" align="center" :size="[0,0]">
<div style="width: 40%"> <div style="width: 40%">
<n-flex justify="center" align="center" :size="[15,15]"> <n-flex justify="center" align="center" :size="[15,20]">
<div style="cursor: pointer;display: inline-block" @click="tn('/question')">
<img src="@/assets/img/zu3.png" style="width: 280px;"/>
</div>
<div style="cursor: pointer;display: inline-block" @click="tn('/department')"> <div style="cursor: pointer;display: inline-block" @click="tn('/department')">
<img src="@/assets/img/zu3.png" style="width: 250px;"/> <img src="@/assets/img/zu4.png" style="width: 280px;"/>
</div>
<div style="cursor: pointer;display: inline-block" @click="tn('/department')">
<img src="@/assets/img/zu1.png" style="width: 280px;"/>
</div> </div>
<div style="cursor: pointer;display: inline-block" @click="tn('/hot')"> <div style="cursor: pointer;display: inline-block" @click="tn('/hot')">
<img src="@/assets/img/zu4.png" style="width: 250px;"/> <img src="@/assets/img/zu2.png" style="width: 280px;"/>
</div>
<div style="cursor: pointer;display: inline-block" @click="tn('/question')">
<img src="@/assets/img/zu1.png" style="width: 250px;"/>
</div>
<div style="cursor: pointer;display: inline-block" @click="tn('/department')">
<img src="@/assets/img/zu2.png" style="width: 250px;"/>
</div> </div>
</n-flex> </n-flex>
<div @click="tn('/admin')" style="cursor: pointer;color: #FFFFFF;margin: 0 auto;border-radius: 5px;width: 80%;background-color: #0051B1;height: 40px;line-height: 40px;text-align: center;margin-top: 15px">管理入口</div> <div @click="tn('/admin')"
style="font-size: 20px;cursor: pointer;color: #FFFFFF;margin: 0 auto;border-radius: 5px;width: 90%;background-color: #5985F8;height: 50px;line-height: 50px;text-align: center;margin-top: 30px">
部门管理入口
</div>
</div> </div>
<div style="width: 60%;"> <div style="width: 60%;">
<n-flex justify="space-between" :size="[50,0]"> <n-flex justify="space-between" :size="[50,0]">
<div> <div>
<span @click="contneSelect(0)" <!-- <span @click="contneSelect(0)"-->
:style="{ fontSize: '1.25rem', color: contnetKey === 0 ? '#0051B1' : '#818181', cursor: 'pointer' }">最新问政</span> <!-- :style="{ fontSize: '1.25rem', color: contnetKey === 0 ? '#0051B1' : '#818181', cursor: 'pointer' }">最新问政</span>-->
<span @click="contneSelect(1)" <span :style="{ fontSize: '23px', color: '#0051B1', cursor: 'pointer'}">最新回复</span>
:style="{ fontSize: '1.25rem', color: contnetKey === 1 ? '#0051B1' : '#818181', cursor: 'pointer',marginLeft: '20px' }">最新回复</span>
</div> </div>
<div> <div>
<span style="font-size:1.25rem;color: #818181">涉及部门</span> <span style="font-size:23px;color: #818181">涉及部门</span>
</div> </div>
</n-flex> </n-flex>
<div style="margin-top: 20px;"> <div style="width: 100%;height: 1px;background-color: #E7E7E7;margin: 10px 0px;"></div>
<div style="min-height: 250px"> <n-carousel @update:currentIndex="pageNo" autoplay :interval="5000" style="height: 345px;">
<div v-for="item in contentList" style="cursor: pointer" @click="tn('/info?id='+item.id)"> <n-carousel-item v-for="item in pageCount">
<n-flex justify="space-between" :size="[0,0]"> <div style="">
<div class="te" style="font-size: 18px;width: 80%;"> <div style="height: 290px">
<n-ellipsis :line-clamp="1"> <div v-for="item in contentList" style="cursor: pointer" @click="tn('/info?id='+item.id)">
{{item.politics_title}} <n-flex justify="space-between" :size="[0,0]">
</n-ellipsis> <div class="te" style="font-size: 18px;width: 80%;">
<n-ellipsis :line-clamp="1">
{{ item.politics_title }}
</n-ellipsis>
</div>
<div style="font-size: 18px;width: 15%;text-align: right">
<n-ellipsis :line-clamp="1">
{{ item.department_name }}
</n-ellipsis>
</div>
</n-flex>
</div> </div>
<div style="font-size: 18px;width: 15%;text-align: right"> </div>
<n-ellipsis :line-clamp="1"> <!-- <div class="register-form " style="text-align: center;margin-top: 1.25rem;">-->
{{item.department_name}} <!-- <n-flex justify="center">-->
</n-ellipsis> <!-- <n-pagination @update:page="pageCheck" :theme-overrides="PaginationThemeOverrides" v-model:page="page"-->
</div> <!-- :page-count="pageCount"-->
</n-flex> <!-- size="medium"-->
<!-- :page-sizes="[{ label: '10条/页',value: 10}]">-->
<!-- </n-pagination>-->
<!-- </n-flex>-->
<!-- </div>-->
</div> </div>
</div> <div style="width: 100%;height: 1px;background-color: #E7E7E7;"></div>
<div class="register-form " style="text-align: center;margin-top: 1.25rem;"> </n-carousel-item>
<n-flex justify="center"> <template #dots="{ total, currentIndex, to }">
<n-pagination @update:page="pageCheck" :theme-overrides="PaginationThemeOverrides" v-model:page="page" <ul class="custom-dots-yuan">
:page-count="pageCount" <li
size="medium" v-for="index of total"
:page-sizes="[{ label: '10条/页',value: 10}]"> :key="index"
</n-pagination> :class="{ ['is-active-yuan']: currentIndex === index - 1 }"
</n-flex> @click="to(index - 1)"
</div> />
</div> </ul>
</template>
</n-carousel>
</div> </div>
</n-flex> </n-flex>
</div> </div>
@ -80,27 +155,41 @@
</div> </div>
<img src="@/assets/img/bz2.png" style="width: 200px;display: block; margin: 0 auto;"/> <img src="@/assets/img/bz2.png" style="width: 200px;display: block; margin: 0 auto;"/>
<div <div
style="color: #0051B1;font-size: 0.5rem;margin-top: 5px"> style="color: #0051B1;font-size: 16px;margin-top: 5px">
XIN WEN TUI JIAN XIN WEN TUI JIAN
</div> </div>
</div> </div>
<div style="margin-top: 20px"> <div style="margin-top: 20px">
<n-flex align="center"> <n-flex align="center">
<div style="width: 42.5%;position: relative"> <div style="width: 42.5%;position: relative">
<n-carousel draggable show-arrow :autoplay="true"> <n-carousel draggable show-arrow :autoplay="true">
<div v-for="item in 5" style="padding: 10px"> <div v-for="item in 5" style="padding: 10px">
<img style="border-radius: 10px;" <img style="border-radius: 10px;width: 100%"
src="@/assets/img/top2.png" src="@/assets/img/top2.png"
> >
</div> </div>
<template #arrow="{ prev, next }"> <template #arrow="{ prev, next }">
<div style=""> <div style="">
<div @click="prev" style="cursor: pointer;position: absolute;left: 15px;top: 45%"> <div @click="prev" style="cursor: pointer;position: absolute;left: 15px;top: 45%">
<svg style="width: 40px;height: 40px;color: #FFFFFF" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 28 28"><g fill="none"><path d="M18.03 22.78a.75.75 0 0 1-1.06 0l-8.75-8.75a.75.75 0 0 1 0-1.06l8.75-8.75a.75.75 0 1 1 1.06 1.06L9.81 13.5l8.22 8.22a.75.75 0 0 1 0 1.06z" fill="currentColor"></path></g></svg> <svg style="width: 40px;height: 40px;color: #FFFFFF" xmlns="http://www.w3.org/2000/svg"
</div> xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 28 28">
<div @click="next" style="cursor: pointer;position: absolute;right: 20px;top: 45%"> <g fill="none">
<svg style="width: 40px;height: 40px;color: #FFFFFF" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 28 28"><g fill="none"><path d="M9.97 4.22a.75.75 0 0 1 1.06 0l8.75 8.75a.75.75 0 0 1 0 1.06l-8.75 8.75a.75.75 0 1 1-1.06-1.06l8.22-8.22l-8.22-8.22a.75.75 0 0 1 0-1.06z" fill="currentColor"></path></g></svg> <path
</div> d="M18.03 22.78a.75.75 0 0 1-1.06 0l-8.75-8.75a.75.75 0 0 1 0-1.06l8.75-8.75a.75.75 0 1 1 1.06 1.06L9.81 13.5l8.22 8.22a.75.75 0 0 1 0 1.06z"
fill="currentColor"></path>
</g>
</svg>
</div>
<div @click="next" style="cursor: pointer;position: absolute;right: 20px;top: 45%">
<svg style="width: 40px;height: 40px;color: #FFFFFF" xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 28 28">
<g fill="none">
<path
d="M9.97 4.22a.75.75 0 0 1 1.06 0l8.75 8.75a.75.75 0 0 1 0 1.06l-8.75 8.75a.75.75 0 1 1-1.06-1.06l8.22-8.22l-8.22-8.22a.75.75 0 0 1 0-1.06z"
fill="currentColor"></path>
</g>
</svg>
</div>
</div> </div>
</template> </template>
<template #dots="{ total, currentIndex, to }"> <template #dots="{ total, currentIndex, to }">
@ -120,18 +209,22 @@
<div v-for="(item, index) in groupList" @click="openGroup(item.id)" <div v-for="(item, index) in groupList" @click="openGroup(item.id)"
:class="{ 'int': true, 'act': item.id == groupIndex }" style="position: relative"> :class="{ 'int': true, 'act': item.id == groupIndex }" style="position: relative">
<div>{{ item.name }}</div> <div>{{ item.name }}</div>
<div v-if="item.id == groupIndex" style="margin: 0 auto;left: 0;right:0;width: 50px;height: 3px;background-color: #0051B1;position: absolute;bottom: -7px;border-radius: 10px"></div> <div v-if="item.id == groupIndex"
style="margin: 0 auto;left: 0;right:0;width: 50px;height: 3px;background-color: #0051B1;position: absolute;bottom: -7px;border-radius: 10px"></div>
</div> </div>
</n-flex> </n-flex>
<div style="width: 100%;background-color: #E7E7E7;height: 2px;opacity: 0.35;margin-top: 5px"></div> <div style="width: 100%;background-color: #E7E7E7;height: 2px;opacity: 0.35;margin-top: 5px"></div>
<div style="height: 300px;"> <div style="height: 300px;padding-top: 10px">
<div style="cursor: pointer;padding: 2.5px 0px;margin-top: 10px" v-for="(item,index) in groupNews" <div style="cursor: pointer;padding: 5px 0px;" v-for="(item,index) in groupNews"
@click="tn('/news_info?id='+item.id)"> @click="tn('/news_info?id='+item.id)">
<n-flex justify="space-between"> <n-flex justify="space-between">
<div class="txt-1" style="font-size: 17px;width: 70%"> <div class="txt-1 xw_width" style="font-size: 17px;">
<text class="news_title" style="vertical-align: middle;margin-left: 5px">{{ item.news_title }}</text> <text class="news_title" style="vertical-align: middle;margin-left: 5px">{{
item.news_title
}}
</text>
</div> </div>
<div style="color: #818794">{{ item.showtime }}</div> <div style="color: #818794;text-align: right">{{ item.showtime }}</div>
</n-flex> </n-flex>
</div> </div>
</div> </div>
@ -149,7 +242,7 @@ import Header from "@/components/Head.vue";
import Footer from "@/components/Footer.vue"; import Footer from "@/components/Footer.vue";
import {PaginationProps, useMessage} from 'naive-ui' import {PaginationProps, useMessage} from 'naive-ui'
import {getPolitics, getNewsbx, getNewsbxList} from "@/api/index"; import {getPolitics, getNewsbx, getNewsbxList} from "@/api/index";
import {ref, reactive, onMounted} from 'vue' import {ref, reactive, onMounted,computed} from 'vue'
import {useRouter} from "vue-router"; import {useRouter} from "vue-router";
const message = useMessage() const message = useMessage()
@ -165,12 +258,15 @@ onMounted(() => {
getApiPolitics(); getApiPolitics();
getApiNewsbx(); getApiNewsbx();
}) })
const leftContent = computed(() => contentList.value.slice(0, 4));
const rightContent = computed(() => contentList.value.slice(4, 8));
const getApiPolitics = () => { const getApiPolitics = () => {
getPolitics({'type': contnetKey.value, 'page': page.value, 'size': 6}).then(res => { getPolitics({'type': contnetKey.value, 'page': page.value, 'size': 8}).then(res => {
if (res.code == 200) { if (res.code == 200) {
contentList.value = res.data.data; contentList.value = res.data.data;
//pageCount.value = Math.ceil(res.count / 6); //pageCount.value = Math.ceil(res.count / 6);
pageCount.value= res.data.last_page; pageCount.value = res.data.last_page;
} else { } else {
message.error(res.msg) message.error(res.msg)
} }
@ -200,6 +296,10 @@ const openGroup = (index) => {
groupIndex.value = index; groupIndex.value = index;
getApiNewsList(index); getApiNewsList(index);
} }
const pageNo = (index) => {
page.value = index + 1;
getApiPolitics();
}
const pageCheck = (p) => { const pageCheck = (p) => {
console.log(p); console.log(p);
page.value = p; page.value = p;
@ -240,7 +340,8 @@ const tn = (url) => {
message.error('请登录！') message.error('请登录！')
return; return;
} }
router.push(url) window.open('/#' + url, '_blank'); // 在新
//router.push(url)
} }
</script> </script>
@ -283,6 +384,7 @@ const tn = (url) => {
.news_title:hover { .news_title:hover {
color: #0051B1; color: #0051B1;
} }
.custom-arrow { .custom-arrow {
display: flex; display: flex;
position: absolute; position: absolute;
@ -330,10 +432,9 @@ const tn = (url) => {
height: 6px; height: 6px;
margin: 0 3px; margin: 0 3px;
border-radius: 4px; border-radius: 4px;
background: rgba(36,36,36,0.4); background: rgba(36, 36, 36, 0.4);
transition: transition: width 0.3s,
width 0.3s, background-color 0.3s cubic-bezier(0.4, 0, 0.2, 1);
background-color 0.3s cubic-bezier(0.4, 0, 0.2, 1);
cursor: pointer; cursor: pointer;
} }
@ -341,4 +442,43 @@ const tn = (url) => {
width: 20px; width: 20px;
background: #fff; background: #fff;
} }
.custom-dots-yuan {
padding: 0;
position: absolute;
bottom: 20px;
left: 0;
right: 0;
margin: 0 auto;
text-align: center;
}
.custom-dots-yuan li {
display: inline-block;
width: 10px;
height: 10px;
margin: 0 3px;
border-radius: 10px;
background: #E7E7E7;
transition: width 0.3s,
background-color 0.3s cubic-bezier(0.4, 0, 0.2, 1);
cursor: pointer;
}
.custom-dots-yuan li.is-active-yuan {
width: 10px;
background: #0051B1;
}
.xw_width {
width: 70%;
}
/* 当屏幕宽度小于1366px时，设置宽度为50% */
@media (max-width: 1366px) {
.xw_width {
width: 50%;
}
}
</style> </style>

103
src/view/home/info.vue
View File

@ -1,53 +1,67 @@
<template> <template>
<Header/> <Header/>
<div style="text-align: center;font-size: 2em;padding-top: 50px"> <div style="text-align: center;font-size: 2em;padding-top: 50px">
{{liveInfo.politics_title}} {{ liveInfo.politics_title }}
</div> </div>
<div style="width: 60%;margin: 0 auto"> <div style="width: 60%;margin: 0 auto">
<div style="color: #818794;margin-top: 40px;padding-bottom: 10px"> <div style="color: #818794;margin-top: 40px;padding-bottom: 10px">
<n-flex justify="space-between" :size="[50,0]"> <n-flex justify="space-between" :size="[50,0]">
<div> <div>
<span>编号：{{liveInfo.id}}</span> <span>编号：{{ liveInfo.id }}</span>
<span style="margin-left: 50px">类型：{{liveInfo.politics_type}}</span> <span style="margin-left: 50px">类型：{{ liveInfo.politics_type }}</span>
</div> </div>
<div> <div>
<span style="margin-left: 100px;">{{liveInfo.createtime}}</span> <span style="margin-left: 100px;">{{ liveInfo.createtime }}</span>
</div> </div>
</n-flex> </n-flex>
</div> </div>
<div style="width: 100%;background-color: #E7E7E7;height: 2px;margin: 10px 0px"></div> <div style="width: 100%;background-color: #E7E7E7;height: 2px;margin: 10px 0px"></div>
<div style="text-align: left;font-size: 1.2em"> <div style="text-align: left;font-size: 1.2em">
{{liveInfo.politics_content}} {{ liveInfo.politics_content }}
</div>
<div style="text-align: center;padding: 30px 0px;">
<n-flex :size="[20,0]">
<div v-for="item in liveInfo.politics_images">
<n-image
width="200"
height="200"
:src="item"
object-fit="cover"
/>
</div>
</n-flex>
</div> </div>
<div style="text-align: center" v-if="liveInfo.acceptance_status==0"> <div style="text-align: center" v-if="liveInfo.acceptance_status==0">
<img src="@/assets/img/comment.jpg" style="width: 200px;"/> <img src="@/assets/img/comment.jpg" style="width: 200px;"/>
<div style="color: #999797">正在等待处理中</div> <div style="color: #999797">正在等待处理中</div>
</div> </div>
<div style="text-align: left;background-color: #F2F2F2;margin: 0 auto;padding: 20px;border-radius: 10px;margin-top: 40px;margin-bottom: 40px" v-if="liveInfo.acceptance_status==1"> <div
<div style="font-size: 20px;color: #818181;font-weight: 600">回复部门：{{liveInfo.department_name}}</div> style="text-align: left;background-color: #F2F2F2;margin: 0 auto;padding: 20px;border-radius: 10px;margin-top: 40px;margin-bottom: 40px"
v-if="liveInfo.acceptance_status==1">
<div style="font-size: 20px;color: #818181;font-weight: 600">回复部门：{{ liveInfo.department_name }}</div>
<div style="width: 100%;background-color: #E7E7E7;height: 2px;margin:15px 0px"></div> <div style="width: 100%;background-color: #E7E7E7;height: 2px;margin:15px 0px"></div>
<div style="font-size: 16px;margin-top: 10px"> <div style="font-size: 16px;margin-top: 10px">
<div v-html="liveInfo.acceptance_content"></div> <div v-html="liveInfo.acceptance_content"></div>
</div> </div>
</div> </div>
<div> <div>
<div style="font-size: 22px;">评论({{addCount}})</div> <div style="font-size: 22px;">评论({{ addCount }})</div>
<div style="width: 100%;background-color: #E7E7E7;height: 2px;opacity: 0.35;margin:15px 0px"></div> <div style="width: 100%;background-color: #E7E7E7;height: 2px;opacity: 0.35;margin:15px 0px"></div>
<div style="color: #818181" v-for="(item,index) in commentsList"> <div style="color: #818181" v-for="(item,index) in commentsList">
<div style="color: #000000;font-size: 16px">用户:{{item.user.nickname}}</div> <div style="color: #000000;font-size: 16px">用户:{{ item.user.nickname }}</div>
<div style="margin: 5px 0px;">{{item.createtime}}</div> <div style="margin: 5px 0px;">{{ item.createtime }}</div>
<div>{{item.content}}</div> <div>{{ item.content }}</div>
<div style="width: 100%;height: 2px;margin:15px 0px;border-bottom: 1px dashed #E7E7E7"></div> <div style="width: 100%;height: 2px;margin:15px 0px;border-bottom: 1px dashed #E7E7E7"></div>
</div> </div>
<div class="register-form " style="text-align: center;margin-top:50px;"> <div class="register-form " style="text-align: center;margin-top:50px;">
<n-flex justify="center" align="center" :size="[20,0]"> <n-flex justify="center" align="center" :size="[20,0]">
<div style="color: #666666">共 {{addCount}} 条数据</div> <div style="color: #666666">共 {{ addCount }} 条数据</div>
<div> <div>
<n-pagination @update:page="pageCheck" :theme-overrides="PaginationThemeOverrides" v-model:page="page" <n-pagination @update:page="pageCheck" :theme-overrides="PaginationThemeOverrides" v-model:page="page"
:page-count="pageCount" :page-count="pageCount"
size="medium"> size="medium">
</n-pagination> </n-pagination>
</div> </div>
</n-flex> </n-flex>
</div> </div>
<div style="padding: 30px;" v-if="!user"> <div style="padding: 30px;" v-if="!user">
@ -56,13 +70,15 @@
</div> </div>
</div> </div>
<div v-if="user" style="width: 80%;margin: 0 auto;color: #818181;"> <div v-if="user" style="width: 80%;margin: 0 auto;color: #818181;">
<div>用户:{{user.nickname}}</div> <div>用户:{{ user.nickname }}</div>
<div style="margin-top: 5px;">注:网友评论属于个人观点，并不代表百姓问政同意观点或证实其描述</div> <div style="margin-top: 5px;">注:网友评论属于个人观点，并不代表百姓问政同意观点或证实其描述</div>
<div style="margin-top: 20px"> <div style="margin-top: 20px">
<n-input type="textarea" placeholder="文明评论，文明上网，杜绝恶意攻击" maxlength="100" show-count :autosize="{ minRows: 5, maxRows: 5 }" style="border: 1px solid #818181;border-radius: 10px;background-color: #F2F2F2"/> <n-input type="textarea" v-model:value="respond" placeholder="文明评论，文明上网，杜绝恶意攻击" maxlength="100" show-count
:autosize="{ minRows: 5, maxRows: 5 }"
style="border: 1px solid #818181;border-radius: 10px;background-color: #F2F2F2"/>
</div> </div>
<div style="text-align: right;margin-top: 20px"> <div style="text-align: right;margin-top: 20px">
<n-button type="info" color="#0051B1" style="width: 100px">发布</n-button> <n-button @click="repDo" type="info" color="#0051B1" style="width: 100px">发布</n-button>
</div> </div>
<div style="color: #000000;padding-top: 30px;padding-bottom: 40px"> <div style="color: #000000;padding-top: 30px;padding-bottom: 40px">
<div>用户您好:</div> <div>用户您好:</div>
@ -80,17 +96,19 @@
import Header from "@/components/Head.vue"; import Header from "@/components/Head.vue";
import Footer from "@/components/Footer.vue"; import Footer from "@/components/Footer.vue";
import {onMounted, reactive, ref} from "vue"; import {onMounted, reactive, ref} from "vue";
import {politicsDetails,issueComments} from "@/api/index"; import {politicsDetails, issueComments,commentsPolitics} from "@/api/index";
import {useMessage} from "naive-ui"; import {useMessage} from "naive-ui";
import {useRouter} from "vue-router"; import {useRouter} from "vue-router";
import 'mui-player/dist/mui-player.min.css' import 'mui-player/dist/mui-player.min.css'
const router = useRouter() const router = useRouter()
const message = useMessage() const message = useMessage()
const liveId = ref(); const liveId = ref();
const liveInfo = ref({}); const liveInfo = ref({});
const user = ref(); const user = ref();
onMounted(()=>{ const respond = ref('');
liveId.value=router.currentRoute.value.query.id; onMounted(() => {
liveId.value = router.currentRoute.value.query.id;
var item = sessionStorage.getItem('user'); var item = sessionStorage.getItem('user');
if (item != null) { if (item != null) {
const jsonArray = JSON.parse(item); const jsonArray = JSON.parse(item);
@ -102,23 +120,36 @@ onMounted(()=>{
openInfo(); openInfo();
getComments(); getComments();
}) })
const repDo = () => {
commentsPolitics({n_id: liveId.value, content: respond.value}).then(res => {
if (res.code == 200) {
console.log(res);
message.success('评论成功！');
setTimeout(() => {
window.location.reload();
}, 1500)
} else {
message.error(res.msg);
}
});
}
const page = ref(1); const page = ref(1);
const pageCount = ref(1); const pageCount = ref(1);
const addCount=ref(0); const addCount = ref(0);
const commentsList = ref([]); const commentsList = ref([]);
const pageCheck = (p) => { const pageCheck = (p) => {
console.log(p); console.log(p);
page.value = p; page.value = p;
getComments(); getComments();
} }
const getComments= () => { const getComments = () => {
issueComments({id:liveId.value,page:page.value,size:5}).then(res => { issueComments({id: liveId.value, page: page.value, size: 5}).then(res => {
if(res.code==200){ if (res.code == 200) {
console.log(res); console.log(res);
commentsList.value=res.data.data; commentsList.value = res.data.data;
pageCount.value=res.data.last_page; pageCount.value = res.data.last_page;
addCount.value=res.data.total; addCount.value = res.data.total;
}else{ } else {
message.error(res.msg); message.error(res.msg);
} }
}); });
@ -127,11 +158,11 @@ const tn = (url) => {
router.push(url) router.push(url)
} }
const openInfo = () => { const openInfo = () => {
politicsDetails({id:liveId.value}).then(res => { politicsDetails({id: liveId.value}).then(res => {
if(res.code==200){ if (res.code == 200) {
console.log(res); console.log(res);
liveInfo.value=res.data; liveInfo.value = res.data;
}else{ } else {
message.error(res.msg); message.error(res.msg);
} }
}); });

4
src/view/hot/index.vue
View File

@ -36,10 +36,10 @@ onMounted(() => {
getList(); getList();
}) })
const getList = () => { const getList = () => {
getPolitics({type:'hot'}).then(res => { getPolitics({type:'hot',page:1,size:10}).then(res => {
if(res.code==200){ if(res.code==200){
console.log(res); console.log(res);
depList.value=res.data; depList.value=res.data.data;
}else{ }else{
message.error(res.msg); message.error(res.msg);
} }

26
src/view/user/admin.vue
View File

@ -3,7 +3,7 @@
<div style="padding-top: 15px;width: 85%;margin: 0 auto"> <div style="padding-top: 15px;width: 85%;margin: 0 auto">
<div style="color: #0051B1;font-size: 28px;text-align: center;font-weight: bold">对话部门</div> <div style="color: #0051B1;font-size: 28px;text-align: center;font-weight: bold">对话部门</div>
<div style="width: 100%;background-color: #E7E7E7;height: 2px;margin: 10px 0px"></div> <div style="width: 100%;background-color: #E7E7E7;height: 2px;margin: 10px 0px"></div>
<div style="width: 40%;margin: 0 auto;padding: 30px"> <div style="margin: 0 auto;padding: 30px">
<n-flex align="center" justify="center"> <n-flex align="center" justify="center">
<div> <div>
<n-input v-model:value="model.username" placeholder="请输入用户" style="width: 250px"/> <n-input v-model:value="model.username" placeholder="请输入用户" style="width: 250px"/>
@ -19,11 +19,12 @@
<div style="padding-bottom: 100px"> <div style="padding-bottom: 100px">
<div v-for="item in depList"> <div v-for="item in depList">
<div style="background: #F8F8F8;height: 60px;line-height: 60px;padding-left: 30px"> <div style="background: #F8F8F8;height: 60px;line-height: 60px;padding-left: 30px">
<span style="color: #0051B1;font-size: 22px;font-weight: bold">{{item.alphas}}</span> <span style="color: #0051B1;font-size: 22px;font-weight: bold">{{ item.alphas }}</span>
</div> </div>
<div style="padding:10px 30px"> <div style="padding:10px 30px">
<div style="margin-top: 10px"> <div style="margin-top: 10px">
<span @click="tn('/department_info?id='+i.id)" class="n_dep" v-for="i in item.items" style="margin-left: 10px">{{i.department_name}}</span> <span @click="tn('/department_info?id='+i.id)" class="n_dep" v-for="i in item.items"
style="margin-left: 10px">{{ i.department_name }}</span>
</div> </div>
</div> </div>
</div> </div>
@ -35,7 +36,7 @@
import Header from "@/components/Head.vue"; import Header from "@/components/Head.vue";
import Footer from "@/components/Footer.vue"; import Footer from "@/components/Footer.vue";
import {onMounted, reactive, ref} from "vue"; import {onMounted, reactive, ref} from "vue";
import {adminLogin,getDepartment} from "@/api/index"; import {adminLogin, getDepartment} from "@/api/index";
import {useMessage} from "naive-ui"; import {useMessage} from "naive-ui";
import {useRouter} from "vue-router"; import {useRouter} from "vue-router";
import {md5} from 'js-md5'; import {md5} from 'js-md5';
@ -49,12 +50,15 @@ const model = reactive({
const depList = ref([]); const depList = ref([]);
onMounted(() => { onMounted(() => {
var admin = sessionStorage.getItem('admin'); var admin = sessionStorage.getItem('admin');
if(decodeJwtPayload(admin)!=''){ //var jwt=decodeJwtPayload(admin);
router.push('/admin_list') if (admin) {
if (decodeJwtPayload(admin) != '') {
router.push('/admin_list')
}
} }
getDep(); getDep();
}) })
const decodeJwtPayload=(jwt)=> { const decodeJwtPayload = (jwt) => {
const parts = jwt.split('.'); const parts = jwt.split('.');
if (parts.length !== 3) { if (parts.length !== 3) {
return ''; return '';
@ -75,7 +79,7 @@ const getDep = () => {
getDepartment({}).then(res => { getDepartment({}).then(res => {
if (res.code == 200) { if (res.code == 200) {
console.log(res); console.log(res);
depList.value=res.data; depList.value = res.data;
} else { } else {
message.error(res.msg); message.error(res.msg);
} }
@ -107,11 +111,13 @@ const tn = (item) => {
font-size: 16px; font-size: 16px;
margin-top: 20px; margin-top: 20px;
} }
.n_dep{
.n_dep {
cursor: pointer; cursor: pointer;
color: #818181; color: #818181;
} }
.n_dep:hover{
.n_dep:hover {
color: #0051B1; color: #0051B1;
} }
</style> </style>

12
src/view/user/admin_info.vue
View File

@ -36,6 +36,18 @@
<div style="text-align: left;font-size: 1.2em"> <div style="text-align: left;font-size: 1.2em">
{{liveInfo.politics_content}} {{liveInfo.politics_content}}
</div> </div>
<div v-if="liveInfo.politics_images.length>0" style="text-align: center;padding: 30px 0px;">
<n-flex :size="[20,0]">
<div v-for="item in liveInfo.politics_images">
<n-image
width="200"
height="200"
:src="item"
object-fit="cover"
/>
</div>
</n-flex>
</div>
<div v-if="liveInfo.acceptance_status==0" style="margin: 0 auto;color: #818181;padding-top: 50px"> <div v-if="liveInfo.acceptance_status==0" style="margin: 0 auto;color: #818181;padding-top: 50px">
<div style="margin-top: 20px"> <div style="margin-top: 20px">
<n-input type="textarea" v-model:value="respond" placeholder="请输入回复内容……" maxlength="1000" show-count :autosize="{ minRows: 5, maxRows: 5 }" style="border: 1px solid #818181;border-radius: 10px;background-color: #F2F2F2"/> <n-input type="textarea" v-model:value="respond" placeholder="请输入回复内容……" maxlength="1000" show-count :autosize="{ minRows: 5, maxRows: 5 }" style="border: 1px solid #818181;border-radius: 10px;background-color: #F2F2F2"/>

2
src/view/user/user.vue
View File

@ -150,7 +150,7 @@ const getList = () => {
if (type == 0) { if (type == 0) {
getPolitics({'is_user': 1}).then(res => { getPolitics({'is_user': 1}).then(res => {
console.log(res); console.log(res);
list.value=res.data; list.value=res.data.data;
}); });
} else if (type == 1) { } else if (type == 1) {
userCollection({'type': 3}).then(res => { userCollection({'type': 3}).then(res => {