|
|
|
@@ -0,0 +1,427 @@ |
|
|
|
<template> |
|
|
|
<div class="home_wrapper"> |
|
|
|
<div |
|
|
|
class="header_main" |
|
|
|
:style="`background-image:url(${require(showBtn?'@/assets/images/sunVillage_info/list_head.png':'@/assets/images/sunVillage_info/list_head_red.png')})`" |
|
|
|
> |
|
|
|
<p class="title">实施过程公开</p> |
|
|
|
<div class="return_btn" @click="onClickLeft"></div> |
|
|
|
<!-- <div class="add_btn" @click="add" v-show="showBtn"></div>--> |
|
|
|
</div> |
|
|
|
<div class="record_main"> |
|
|
|
<div class="record_det"> |
|
|
|
<div></div> |
|
|
|
<!-- <div class="year_l" @click="tabShow"><i :class="{'icon':true , 'zk':!showTab , 'ss':showTab } "></i>{{queryParams.openYear == '' ? '全部': queryParams.openYear}}<span class="unit">{{queryParams.openYear == '' ? '': '年'}}</span></div>--> |
|
|
|
<div class="total_r">共{{listLength}}条公开</div> |
|
|
|
</div> |
|
|
|
<!-- <div class="record_list" v-if="showTab">--> |
|
|
|
<!-- <div :class="{'flex_block':true , 'current':queryParams.openYear == ''}" @click="tabClick('')">全部</div>--> |
|
|
|
<!-- <div v-for="(item,index) in yearList" :key="index" :class="{'flex_block':true , 'current':queryParams.openYear == item}" @click="tabClick(item)">{{item}}</div>--> |
|
|
|
<!-- </div>--> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="list_main"> |
|
|
|
|
|
|
|
<van-list |
|
|
|
v-model="loading" |
|
|
|
:finished="finished" |
|
|
|
finished-text="没有更多了" |
|
|
|
@load="getList" |
|
|
|
> |
|
|
|
<div class="item" v-for="(item,index) in applicationList" :key="index" @click="viewItem(item.id)" > |
|
|
|
<div class="info"> |
|
|
|
<div class="title"> |
|
|
|
<p class="news_title">{{item.openName}}</p> |
|
|
|
</div> |
|
|
|
<div class="time"> |
|
|
|
<div class="icon_time"></div> |
|
|
|
{{item.jueyiAt}} |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="operation" v-show="showBtn"> |
|
|
|
<div class="opera_btn view" @click.stop="viewItem(item.id)"> |
|
|
|
<i class="icon "></i> |
|
|
|
</div> |
|
|
|
<!-- <div class="opera_btn edit" @click.stop="edit(item.id)">--> |
|
|
|
<!-- <i class="icon "></i>--> |
|
|
|
<!-- </div>--> |
|
|
|
<!-- <div class="opera_btn delete" @click.stop="remove(item.id)">--> |
|
|
|
<!-- <i class="icon"></i>--> |
|
|
|
<!-- </div>--> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</van-list> |
|
|
|
|
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
|
|
|
|
<script> |
|
|
|
import {Dialog, Toast} from "vant"; |
|
|
|
import Cookies from "js-cookie"; |
|
|
|
import {listOther, delSiyigongkai, listOtherOpen} from "@/api/sunVillage_info/fixedAssets"; |
|
|
|
export default { |
|
|
|
name: "otherOpenList", |
|
|
|
data() { |
|
|
|
return { |
|
|
|
dataList:[], |
|
|
|
total: 0, |
|
|
|
queryParams:{ |
|
|
|
pageNum:1, |
|
|
|
pageSize:10, |
|
|
|
isAsc:'desc', |
|
|
|
openYear:'', |
|
|
|
otherType: 13, |
|
|
|
}, |
|
|
|
yearList: [], |
|
|
|
reload: false, |
|
|
|
showTab: false, |
|
|
|
otherTypeOptions: [], |
|
|
|
showType: false, |
|
|
|
loading: false, |
|
|
|
finished: false, |
|
|
|
applicationList:[], |
|
|
|
listLength:'0', |
|
|
|
showBtn:true, |
|
|
|
}; |
|
|
|
}, |
|
|
|
created() { |
|
|
|
if (this.$route.query.type == 'code'){ |
|
|
|
this.showBtn = false; |
|
|
|
} |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
getList(){ |
|
|
|
var _this = this; |
|
|
|
if (this.showBtn){ |
|
|
|
listOther(_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 ; |
|
|
|
} |
|
|
|
}); |
|
|
|
}else{ |
|
|
|
_this.queryParams.bookId = Cookies.get('bookId'); |
|
|
|
listOtherOpen(_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 ; |
|
|
|
} |
|
|
|
}); |
|
|
|
} |
|
|
|
}, |
|
|
|
viewItem(id){ |
|
|
|
this.$router.push({path:'/sunVillage_info/list_process_detail',query: {id:id,type:this.$route.query.typeX,showBtn:this.showBtn}}); |
|
|
|
}, |
|
|
|
add() { |
|
|
|
this.$router.push({path:'/sunVillage_info/list_discussions_new_add'}); |
|
|
|
}, |
|
|
|
edit(id) { |
|
|
|
this.$router.push({path:'/sunVillage_info/list_discussions_new_edit',query: {id:id}}); |
|
|
|
}, |
|
|
|
remove(id) { |
|
|
|
Dialog.confirm({ |
|
|
|
title: '警告', |
|
|
|
message: '确认删除该项?', |
|
|
|
}) |
|
|
|
.then(() => { |
|
|
|
const loading = Toast.loading({ |
|
|
|
message: '删除中...', |
|
|
|
duration: 0, |
|
|
|
}); |
|
|
|
delSiyigongkai(id).then((resp) => { |
|
|
|
this.$notify({ type: 'success', message: '删除成功' }); |
|
|
|
this.applicationList = []; |
|
|
|
this.getList(); |
|
|
|
}).finally(() => { |
|
|
|
loading.clear(); |
|
|
|
}); |
|
|
|
}) |
|
|
|
.catch(() => {}); |
|
|
|
}, |
|
|
|
tabClick(year){ |
|
|
|
this.queryParams.openYear = year; |
|
|
|
this.reload = true; |
|
|
|
}, |
|
|
|
tabShow(){ |
|
|
|
this.showTab = !this.showTab; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
</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; |
|
|
|
} |
|
|
|
|
|
|
|
.title { |
|
|
|
} |
|
|
|
/*.title::before {*/ |
|
|
|
/* display: inline-block;*/ |
|
|
|
/* width: 24px;*/ |
|
|
|
/* height: 24px;*/ |
|
|
|
/* content: '';*/ |
|
|
|
/* background-image: url('../../assets/images/icon/index_header_focus.png');*/ |
|
|
|
/* background-repeat: no-repeat;*/ |
|
|
|
/* background-size: contain;*/ |
|
|
|
/* margin-right: 0.2rem;*/ |
|
|
|
/* transform: rotate(*/ |
|
|
|
/* 180deg*/ |
|
|
|
/* );*/ |
|
|
|
/*}*/ |
|
|
|
/*.title::after {*/ |
|
|
|
/* width: 0.32rem;*/ |
|
|
|
/* height: 0.32rem;*/ |
|
|
|
/* display: inline-block;*/ |
|
|
|
/* content: '';*/ |
|
|
|
/* background-image: url('../../assets/images/icon/index_header_focus.png');*/ |
|
|
|
/* background-repeat: no-repeat;*/ |
|
|
|
/* background-size: contain;*/ |
|
|
|
/* margin-left: 0.2rem;*/ |
|
|
|
/*}*/ |
|
|
|
} |
|
|
|
.record_main{ |
|
|
|
padding:30px 22px; |
|
|
|
.record_det{ |
|
|
|
height: 38px; |
|
|
|
line-height: 38px; |
|
|
|
display: flex; |
|
|
|
justify-content:space-between; |
|
|
|
.year_l{ |
|
|
|
font-size: 30px; |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
color: #858585; |
|
|
|
|
|
|
|
.unit{ |
|
|
|
padding-left: 5px; |
|
|
|
} |
|
|
|
.icon{ |
|
|
|
width: 23px; |
|
|
|
height: 12px; |
|
|
|
display: block; |
|
|
|
background: url('../../assets/images/sunVillage_info/list_icon_1.png') no-repeat; |
|
|
|
background-size: 100% 100%; |
|
|
|
margin-bottom: 4px; |
|
|
|
margin-right: 8px; |
|
|
|
&.zk { |
|
|
|
transform: rotate(0deg) |
|
|
|
} |
|
|
|
&.ss{ |
|
|
|
transform: rotate(180deg) |
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|
.total_r{ |
|
|
|
font-size: 26px; |
|
|
|
letter-spacing: 2px; |
|
|
|
} |
|
|
|
} |
|
|
|
.record_list{ |
|
|
|
display: flex; |
|
|
|
flex-flow: wrap; |
|
|
|
margin-top: 12PX; |
|
|
|
.flex_block{ |
|
|
|
font-size: 30px; |
|
|
|
color: #878787; |
|
|
|
padding-right: 30px; |
|
|
|
&.current{ |
|
|
|
color: #4199fe; |
|
|
|
font-weight: bold; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
.list_main{ |
|
|
|
padding:15px 22px; |
|
|
|
.item{ |
|
|
|
height: 140px; |
|
|
|
border-radius: 30px; |
|
|
|
background: #fff; |
|
|
|
box-shadow: 4px 6px 5px rgba(63, 68, 75, 0.1); |
|
|
|
padding:25px 32px; |
|
|
|
display: flex; |
|
|
|
margin-bottom: 20px; |
|
|
|
justify-content: space-between; |
|
|
|
.info{ |
|
|
|
.title{ |
|
|
|
display: flex; |
|
|
|
font-size: 32px; |
|
|
|
align-items: center; |
|
|
|
height: 58px; |
|
|
|
.icon_box{ |
|
|
|
width: 34px; |
|
|
|
display: block; |
|
|
|
height: 30px; |
|
|
|
background: url('../../assets/images/sunVillage_info/list_icon_2.png') no-repeat; |
|
|
|
background-size: 100% 100%; |
|
|
|
margin-right: 10px; |
|
|
|
flex-shrink: 0; |
|
|
|
} |
|
|
|
.news_title{ |
|
|
|
display: -webkit-box; |
|
|
|
-webkit-box-orient: vertical; |
|
|
|
-webkit-line-clamp: 1; |
|
|
|
word-break: break-all; |
|
|
|
overflow: hidden; |
|
|
|
} |
|
|
|
.tips_mark{ |
|
|
|
width: 34px; |
|
|
|
height: 34px; |
|
|
|
background: #fa0c0c; |
|
|
|
border-radius: 8px; |
|
|
|
font-size: 24px; |
|
|
|
color: #fff; |
|
|
|
text-align: center; |
|
|
|
line-height: 34px; |
|
|
|
margin-left: 10px; |
|
|
|
flex-shrink: 0; |
|
|
|
} |
|
|
|
} |
|
|
|
.time{ |
|
|
|
font-size: 24px; |
|
|
|
color: #858585; |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
height: 30px; |
|
|
|
margin-top: 6px; |
|
|
|
.icon_time{ |
|
|
|
width: 25px; |
|
|
|
height: 25px; |
|
|
|
background: url('../../assets/images/sunVillage_info/list_icon_4.png') no-repeat; |
|
|
|
background-size: 100% 100%; |
|
|
|
margin-right: 10px; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
.operation{ |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
justify-content: right; |
|
|
|
text-align: right; |
|
|
|
.opera_btn{ |
|
|
|
width: 52px; |
|
|
|
height: 52px; |
|
|
|
border-radius: 50%; |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
justify-content:center; |
|
|
|
|
|
|
|
&.delete{ |
|
|
|
background:#df0707; |
|
|
|
margin-left: 10PX; |
|
|
|
.icon{ |
|
|
|
width: 22px; |
|
|
|
height: 29px; |
|
|
|
background: url('../../assets/images/sunVillage_info/list_icon_7.png') no-repeat; |
|
|
|
background-size: 100% 100%; |
|
|
|
display: block; |
|
|
|
} |
|
|
|
} |
|
|
|
&.edit{ |
|
|
|
background: #79cf13; |
|
|
|
margin-left: 10PX; |
|
|
|
.icon { |
|
|
|
width: 26px; |
|
|
|
height: 25px; |
|
|
|
background: url('../../assets/images/sunVillage_info/list_icon_6.png') no-repeat; |
|
|
|
background-size: 100% 100%; |
|
|
|
display: block; |
|
|
|
} |
|
|
|
} |
|
|
|
&.view{ |
|
|
|
background: #3494ff; |
|
|
|
margin-left: 10PX; |
|
|
|
.icon { |
|
|
|
width: 29px; |
|
|
|
height: 21px; |
|
|
|
background: url('../../assets/images/sunVillage_info/list_icon_3.png') no-repeat; |
|
|
|
background-size: 100% 100%; |
|
|
|
display: block; |
|
|
|
} |
|
|
|
} |
|
|
|
&.list{ |
|
|
|
background: #79cf13; |
|
|
|
margin-left: 10PX; |
|
|
|
.icon { |
|
|
|
width: 29px; |
|
|
|
height: 21px; |
|
|
|
background: url('../../assets/images/sunVillage_info/list_icon_10.png') no-repeat; |
|
|
|
background-size: 100% 100%; |
|
|
|
display: block; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
.bottom_tips{ |
|
|
|
font-size: 24px; |
|
|
|
color: #a7a6a6; |
|
|
|
text-align: center; |
|
|
|
margin-top: 32px; |
|
|
|
background: url('../../assets/images/sunVillage_info/list_icon_8.png') center center no-repeat; |
|
|
|
background-size: 260px 2px; |
|
|
|
.xs{ |
|
|
|
padding:0 8px; |
|
|
|
background: #e9e9e9; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
.top_head_title{ |
|
|
|
font-size: 16PX; |
|
|
|
text-align: center; |
|
|
|
padding: 15PX 0; |
|
|
|
} |
|
|
|
</style> |
