瀏覽代碼

阳光村务留言板

rongxin_prod
庞东旭 2 年之前
父節點
當前提交
f069c03daa
共有 8 個檔案被更改,包括 808 行新增0 行删除
  1. +26
    -0
      src/api/sunVillage_info/fixedAssets.js
  2. 二進制
      src/assets/images/sunVillage_info/message_add_icon_03.png
  3. 二進制
      src/assets/images/sunVillage_info/message_icon_01.png
  4. +3
    -0
      src/permission.js
  5. +27
    -0
      src/router/index.js
  6. +236
    -0
      src/views/sunVillage_info/list_message.vue
  7. +275
    -0
      src/views/sunVillage_info/list_message_add.vue
  8. +241
    -0
      src/views/sunVillage_info/list_message_detail.vue

+ 26
- 0
src/api/sunVillage_info/fixedAssets.js 查看文件

@@ -877,3 +877,29 @@ export function getAdvice(id) {
method: 'get',
})
}

// 留言板列表
export function listMessage(query) {
return request({
url: '/villageAffairs/public/listMessage',
method: 'get',
params: query
})
}

// 留言板新增
export function addMessage(data) {
return request({
url: '/villageAffairs/public/addMessage',
method: 'post',
data: data
})
}

// 留言板详情
export function getMessage(id) {
return request({
url: '/villageAffairs/public/getMessage/'+id,
method: 'get',
})
}

二進制
src/assets/images/sunVillage_info/message_add_icon_03.png 查看文件

Before After
Width: 58  |  Height: 58  |  Size: 3.3 KiB

二進制
src/assets/images/sunVillage_info/message_icon_01.png 查看文件

Before After
Width: 81  |  Height: 65  |  Size: 3.2 KiB

+ 3
- 0
src/permission.js 查看文件

@@ -141,6 +141,9 @@ const whiteList = [
'/sunVillage_info/list_complaint', //详情页
'/sunVillage_info/list_complaint_add', //详情页
'/sunVillage_info/list_complaint_detail', //详情页
'/sunVillage_info/list_message', //详情页
'/sunVillage_info/list_message_add', //详情页
'/sunVillage_info/list_message_detail', //详情页
'/sunVillage_info/homeApplication/applicationList', //列表页面
'/sunVillage_info/proposerLite',
'/sunVillage_info/paidExit/paidExitList', //列表页面


+ 27
- 0
src/router/index.js 查看文件

@@ -3858,6 +3858,33 @@ export const constantRoutes = [
},
component: (resolve) => require(['@/views/sunVillage_info/list_complaint_detail'], resolve)
},
{ ////阳光村务(新)-- 留言板
path: '/sunVillage_info/list_message',
name: 'sunVillageInfoListMessage',
meta: {
title: '留言板',
hidden: true,
},
component: (resolve) => require(['@/views/sunVillage_info/list_message'], resolve)
},
{ ////阳光村务(新)-- 留言板
path: '/sunVillage_info/list_message_add',
name: 'sunVillageInfoListMessageAdd',
meta: {
title: '留言板',
hidden: true,
},
component: (resolve) => require(['@/views/sunVillage_info/list_message_add'], resolve)
},
{ ////阳光村务(新)-- 留言板
path: '/sunVillage_info/list_message_detail',
name: 'sunVillageInfoListMessageDetail',
meta: {
title: '留言板',
hidden: true,
},
component: (resolve) => require(['@/views/sunVillage_info/list_message_detail'], resolve)
},
{ ////阳光村务(新)-- 合同网签
path: '/sunVillage_info/list_signature',
name: 'sunVillageInfoListSignature',


+ 236
- 0
src/views/sunVillage_info/list_message.vue 查看文件

@@ -0,0 +1,236 @@
<template>
<div class="home_wrapper">
<div
class="header_main"
:style="`background-image:url(${require('@/assets/images/sunVillage_info/list_head_red.png')})`"
>
留言板
<div class="return_btn" @click="onClickLeft"></div>
<div class="add_btn" @click="goAdd" v-show="showBtn"></div>
</div>
<van-list
v-model="loading"
:finished="finished"
finished-text="没有更多了"
@load="getList"
>
<van-swipe-cell v-for="(item,index) in applicationList" :key="index" >
<van-cell
:border="false"
center
:to="{name: 'sunVillageInfoListMessageDetail',query:{id:item.id}}"
>
<template #right-icon>
<p style="color: #3977e7">{{item.releaseBy}}</p>
</template>
<template #title>
<p class="tit">{{item.messageContent}}</p>
<p class="time">{{item.messageTime}}</p>
</template>
<template #icon>
<img src="../../assets/images/sunVillage_info/message_icon_01.png" style="width: 1rem;margin-right: 2%;">
</template>
</van-cell>
<!-- <template #right v-if="showBtn">-->
<!-- <div style="background-color: #ee0a24;height: 100%" @click="goRemove(item.id)">删除</div>-->
<!-- <div style="background-color: #07c160" @click="goEdit(item.id)">修改</div>-->
<!-- <div style="background-color: rgb(255, 166, 62);" v-if="item.status != '3'" @click="goRanking(item.id)">发布</div>-->
<!-- </template>-->
</van-swipe-cell>
</van-list>
</div>
</template>

<script>
import { listMessage , delPoll , publicPoll } from "@/api/sunVillage_info/fixedAssets";
import Cookies from "js-cookie";
import request from '@/utils/request'
import {Dialog} from "vant";
export default {
name: "certificateList",
data() {
return {
applicationList:[],
loading: false,
finished: false,
show: true,
fileList:[],
showBtn:true,
queryParams:{}
};
},
created() {
this.queryParams = {
deptId:Cookies.get('deptId'),
translate_dict:1,
}
},
methods: {
getList(){
var _this = this;
listMessage(this.queryParams).then(response => {
_this.listLength = response.total;
response.rows.map(res=>{
_this.applicationList.push(res);
})

if(_this.applicationList.length >= response.total){
_this.finished = true;
return;
}else{
_this.loading = false;
_this.queryParams.pageNum += 1 ;
}
});
},
goAdd(){
this.$router.push({path:'/sunVillage_info/list_message_add', query: {type: 'code'}})
},
goDetail(id){
this.$router.push({path:'/sunVillage_info/list_vote_detail',query: {id:id}})
},
goEdit(id){
this.$router.push({path:'/sunVillage_info/list_vote_edit',query: {id:id}})
},
goRanking(id){
this.$dialog.alert({
title: '提示',
message: '确认发布?',
showCancelButton:true,
})
.then(() => {
publicPoll(id).then(response => {
this.$notify({ type: 'success', message: '发布成功' });
this.applicationList = [];
this.getList()
});
})
.catch(() => {
// on cancel
});
},
goRemove(id){
this.$dialog.alert({
title: '提示',
message: '确认删除?',
showCancelButton:true,
})
.then(() => {
delPoll(id).then(response => {
this.$notify({ type: 'success', message: '删除成功' });
this.applicationList = [];
this.getList()
});
})
.catch(() => {
// on cancel
});

}
},



}
</script>

<style scoped lang="scss">
.home_wrapper{
background: #e9e9e9;
min-height: 100vh;
width: 100vw;
.header_main{
height: 116px;
background: url('../../assets/images/sunVillage_info/list_head.png') no-repeat;
background-size: 100% 100%;
position: fixed;
top: 0;
left: 0;
width: 100%;
font-size: 36px;
line-height: 116px;
text-align: center;
color: #fff;
position: relative;
.return_btn{
width: 24px;
height: 43.2px;
background: url('../../assets/images/sunVillage_info/list_icon_5.png') center center no-repeat;
background-size: 20px 36px;
position: absolute;
left: 38px;
top: 36px;
}
.add_btn{
width: 56.4px;
height: 40.8px;
background: url('../../assets/images/sunVillage_info/list_icon_9.png') center center no-repeat;
background-size: 47px 34px;
position: absolute;
right: 38px;
top: 36px;
}
}
.van-swipe-cell {
position: relative;
overflow: hidden;
cursor: grab;
width: 96%;
margin: 0 auto;
margin-top: 15PX;
box-shadow: 5PX 5PX 2PX #ccc;
border-radius: 10PX;
}
/deep/ .van-swipe-cell__right{
display: flex;
align-items: center;
width: 150PX;
margin-left: 5PX;
a,div{
margin: 0;
display: flex;
align-items: center;
justify-content: center;
color: #ffffff;
font-size: 14PX;
height: 100%;
flex: 1;
}
}

.tit{
color: #333333;
}
.time{
color: #aaaaaa;
font-size: .3rem;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 1;
word-break: break-all;
overflow: hidden;
}
.dept{
color: #3977e7;
font-size: .35rem;
display: flex;
align-items: center;
}

.state1{
background: #e4f8f4;
border: 1px solid #c5efe7;
color: #2ec6a9;
padding: 0 3vw;
border-radius: 5vw;
}

.state2{
background: #fedfe3;
border: 1px solid #fcb9c2;
color: #f60325;
padding: 0 3vw;
border-radius: 5vw;
}
}
</style>

+ 275
- 0
src/views/sunVillage_info/list_message_add.vue 查看文件

@@ -0,0 +1,275 @@
<template>
<div class="home_wrapper">
<div class="header_main"
:style="`background-image:url(${require('@/assets/images/sunVillage_info/list_head_red.png')})`"
>
留言板
<div class="return_btn" @click="onClickLeft"></div>
<div class="add_btn"></div>
</div>
<van-form @submit="onSubmit">
<div class="list_main">

<van-field readonly required label="留言内容" :border="false" />
<div class="input_field">
<van-field
v-model="form.messageContent"
:rules="[{ required: true , message:'具体描述留言内容' }]"
rows="4"
autosize
type="textarea"
maxlength="1000"
placeholder="具体描述留言内容"
show-word-limit
:border="false"
style="padding: 5PX 0;"
/>
</div>

<van-field readonly label="图片内容" :border="false" />
<van-uploader
v-model="fileList"
style="margin-top: 10PX;"
:upload-icon="uploadIcon1"
:after-read="afterRead"
@delete="deleteFile1"
multiple
/>

<van-field readonly required label="投诉人" :border="false" />
<div class="input_field">
<van-field placeholder="请输入姓名" :rules="[{ required: true , message:'请输入姓名' }]" v-model="form.releaseBy" :border="false" />
</div>

<van-field readonly required label="联系电话" :border="false" />
<div class="input_field">
<van-field placeholder="请输入电话" :rules="[{ required: true , message:'请输入电话' }]" v-model="form.releasePhone" :border="false" />
</div>


</div>

<div style="margin: 16px auto;width: 50%;">
<van-button round block type="primary" native-type="submit">
保存
</van-button>
</div>
</van-form>
</div>
</template>

<script>
import { addMessage, publicUpload} from "@/api/sunVillage_info/fixedAssets";
import Cookies from "js-cookie";
import uploadIcon1 from '@/assets/images/sunVillage_info/message_add_icon_03.png'
import request from '@/utils/request'
export default {
name: "certificateList",
data() {
return {
uploadIcon1:uploadIcon1,
showBuildTime:false,
form:{
messageTime:this.format(new Date(),'yyyy-MM-dd'),
imgUrl:'',
},
openPic:[],
fileList:[],
fileList1:[],
openNy:new Date(),
type:'',
openFile:[],
openFileList:[],
queryParams:{
bookId:'',
deptId:''
},
openFile2:[],
openPic2:[],
};
},
created() {
this.type = this.$route.query.type;
this.form.bookId = Cookies.get('bookId');
this.form.deptId = Cookies.get('deptId');
},
methods: {
onSubmit(){
var that = this;
that.form.imgUrl = that.openPic2.join(',')
addMessage(that.form).then((r1) => {
if (r1.code == 200){
that.$notify({ type: 'success', message: '新增成功' });
setTimeout(function(){
history.back(-1);
},2000)
}
})
},
deleteFile1(detail){
this.openPic2.splice(detail.index,1)
// this.form.openPic.splice(index,1);
},
afterRead(file) {
// 此时可以自行将文件上传至服务器
if (file instanceof Array){//判断是否为数组,单张图片为array,多张为数组,数组返回true否则为false
file.map(res=>{
this.openPic.push(res.file);
let params1 = new FormData();
params1.append("file", res.file);
publicUpload(params1).then((r1) => {
this.openPic2.push(r1.fileName);
})
})
}else{
this.openPic.push(file);
let params1 = new FormData();
params1.append("file", file.file);
publicUpload(params1).then((r1) => {
this.openPic2.push(r1.fileName);
})
}
},
},
}
</script>

<style scoped lang="scss">
/deep/ .van-button--primary{
background-image: linear-gradient(to right , #f97d5a ,#f45341);
background-size: 100% 100%;
border: none;
}
.input_field{
border: 1px solid #d8d8d8;
padding: 8PX 15PX;
border-radius: 8PX;
margin: 10PX 0;
}
/deep/ .van-field__label{
padding-left: 10PX;
width: auto;
display: flex;
align-items: center;
border-left: 4PX solid #fd684a;
}
/deep/ .van-cell{
padding-left: 0!important;
padding-right: 0!important;
padding-bottom: 0!important;
line-height: 1;
&:nth-child(1){
padding-top: 0;
}
}
.home_wrapper{
background: #e9e9e9;
min-height: 100vh;
width: 100vw;
.header_main {
height: 116px;
background: url('../../assets/images/sunVillage_info/list_head.png') no-repeat;
background-size: 100% 100%;
position: fixed;
top: 0;
left: 0;
width: 100%;
font-size: 36px;
line-height: 116px;
text-align: center;
color: #fff;
position: relative;

.return_btn {
width: 24px;
height: 43.2px;
background: url('../../assets/images/sunVillage_info/list_icon_5.png') center center no-repeat;
background-size: 20px 36px;
position: absolute;
left: 38px;
top: 36px;
}
}
.release_head{
height: 90px;
padding:0 23px;
display: flex;
align-items: center;
font-size: 26px;
color: #929292;
.people{
flex: 1;
display: flex;
align-items: center;
.icon{
width: 24px;
height: 21px;
background: url('../../assets/images/sunVillage_info/details_icon_1.png') no-repeat;
background-size: 100% 100%;
display: block;
margin-right: 8px;
}
}
.time{
flex: 1;
display: flex;
align-items: center;
justify-content:flex-end;
.icon{
width: 25px;
height: 25px;
background: url('../../assets/images/sunVillage_info/details_icon_2.png') no-repeat;
background-size: 100% 100%;
display: block;
margin-right: 8px;
}
}
}
.release_conetnt{
padding:0 22px;
font-size: 32px;
color: #252525;
line-height: 44px;
img{
max-width: 100%;
margin-bottom: 16px;
}
p{
margin-bottom: 16px;
}
}
.list_main{
padding:25px;
background: #ffffff;
width: 94%;
margin: 25px auto 0;
border-radius: 15PX;
box-shadow: 4px 6px 5px rgba(63, 68, 75, 0.1);
}
.titBox{
display: flex;
align-items: center;
}
.tit{
font-size: 36px;
font-weight: bold;
}
/deep/ .van-cell{
padding-left: 0!important;
padding-right: 0!important;
padding-bottom: 0!important;
}
/deep/ .van-field__label{
/*padding-left: 10PX;*/
width: auto;
display: flex;
align-items: center;
}
/deep/ .van-cell--required::before{
left: 22%;
}
/deep/ .van-field__error-message{
display: none;
}
}
</style>

+ 241
- 0
src/views/sunVillage_info/list_message_detail.vue 查看文件

@@ -0,0 +1,241 @@
<template>
<div class="home_wrapper">
<div class="header_main"
:style="`background-image:url(${require('@/assets/images/sunVillage_info/list_head_red.png')})`"
>
留言板
<div class="return_btn" @click="onClickLeft"></div>
<div class="add_btn"></div>
</div>
<div class="list_main">

<van-field readonly required label="留言内容" :border="false" />
<div class="input_field">
<van-field
readonly
v-model="form.messageContent"
:rules="[{ required: true , message:'具体描述留言内容' }]"
rows="4"
autosize
type="textarea"
maxlength="1000"
placeholder="具体描述留言内容"
show-word-limit
:border="false"
style="padding: 5PX 0;"
/>
</div>

<van-field readonly label="图片内容" :border="false" />
<van-uploader
v-model="openPic"
style="margin-top: 10PX;"
:upload-icon="uploadIcon1"
multiple
:show-upload="false"
:deletable="false"
/>

<van-field readonly required label="投诉人" :border="false" />
<div class="input_field">
<van-field readonly placeholder="请输入姓名" :rules="[{ required: true , message:'请输入姓名' }]" v-model="form.releaseBy" :border="false" />
</div>

<van-field readonly required label="联系电话" :border="false" />
<div class="input_field">
<van-field readonly placeholder="请输入电话" :rules="[{ required: true , message:'请输入电话' }]" v-model="form.releasePhone" :border="false" />
</div>

</div>
</div>
</template>

<script>
import { getMessage } from "@/api/sunVillage_info/fixedAssets";
import Cookies from "js-cookie";
import uploadIcon1 from '@/assets/images/sunVillage_info/message_add_icon_03.png'
import request from '@/utils/request'
export default {
name: "certificateList",
data() {
return {
uploadIcon1:uploadIcon1,
showBuildTime:false,
form:{
messageTime:this.format(new Date(),'yyyy-MM-dd'),
imgUrl:'',
},
openPic:[],
fileList:[],
fileList1:[],
openNy:new Date(),
type:'',
openFile:[],
openFileList:[],
queryParams:{

},
openFile2:[],
openPic2:[],
};
},
created() {
this.getDetail();
},
methods: {
getDetail(){
getMessage(this.$route.query.id).then((res) => {
var that = this ;
if (res.data.imgUrl!='' && res.data.imgUrl != null && res.data.imgUrl != undefined){
this.openPic = res.data.imgUrl.split(',')
this.openPic.map((rrr,i)=>{
this.openPic[i] = {url:'/api'+rrr}
})
}
that.form = res.data;
})
},

},
}
</script>

<style scoped lang="scss">
/deep/ .van-button--primary{
background-image: linear-gradient(to right , #f97d5a ,#f45341);
background-size: 100% 100%;
border: none;
}
.input_field{
border: 1px solid #d8d8d8;
padding: 8PX 15PX;
border-radius: 8PX;
margin: 10PX 0;
}
/deep/ .van-field__label{
padding-left: 10PX;
width: auto;
display: flex;
align-items: center;
border-left: 4PX solid #fd684a;
}
/deep/ .van-cell{
padding-left: 0!important;
padding-right: 0!important;
padding-bottom: 0!important;
line-height: 1;
&:nth-child(1){
padding-top: 0;
}
}
.home_wrapper{
background: #e9e9e9;
min-height: 100vh;
width: 100vw;
.header_main {
height: 116px;
background: url('../../assets/images/sunVillage_info/list_head.png') no-repeat;
background-size: 100% 100%;
position: fixed;
top: 0;
left: 0;
width: 100%;
font-size: 36px;
line-height: 116px;
text-align: center;
color: #fff;
position: relative;

.return_btn {
width: 24px;
height: 43.2px;
background: url('../../assets/images/sunVillage_info/list_icon_5.png') center center no-repeat;
background-size: 20px 36px;
position: absolute;
left: 38px;
top: 36px;
}
}
.release_head{
height: 90px;
padding:0 23px;
display: flex;
align-items: center;
font-size: 26px;
color: #929292;
.people{
flex: 1;
display: flex;
align-items: center;
.icon{
width: 24px;
height: 21px;
background: url('../../assets/images/sunVillage_info/details_icon_1.png') no-repeat;
background-size: 100% 100%;
display: block;
margin-right: 8px;
}
}
.time{
flex: 1;
display: flex;
align-items: center;
justify-content:flex-end;
.icon{
width: 25px;
height: 25px;
background: url('../../assets/images/sunVillage_info/details_icon_2.png') no-repeat;
background-size: 100% 100%;
display: block;
margin-right: 8px;
}
}
}
.release_conetnt{
padding:0 22px;
font-size: 32px;
color: #252525;
line-height: 44px;
img{
max-width: 100%;
margin-bottom: 16px;
}
p{
margin-bottom: 16px;
}
}
.list_main{
padding:25px;
background: #ffffff;
width: 94%;
margin: 25px auto 0;
border-radius: 15PX;
box-shadow: 4px 6px 5px rgba(63, 68, 75, 0.1);
}
.titBox{
display: flex;
align-items: center;
}
.tit{
font-size: 36px;
font-weight: bold;
}
/deep/ .van-cell{
padding-left: 0!important;
padding-right: 0!important;
padding-bottom: 0!important;
}
/deep/ .van-field__label{
/*padding-left: 10PX;*/
width: auto;
display: flex;
align-items: center;
}
/deep/ .van-cell--required::before{
left: 22%;
}
/deep/ .van-field__error-message{
display: none;
}
}
</style>

Loading…
取消
儲存