Skip to content

bdc / bdcdj-web

Go to a project
Toggle navigation
Toggle navigation pinning
a946bce1 by 蔡俊立
Options

工作台、系统通知

1 parent 9931a4ba
Inline Side-by-side
Showing 6 changed files with 391 additions and 53 deletions
......@@ -24,3 +24,20 @@ export function getHomeDoneList () {
method: 'get'
})
}
//获取首页常办项目
export function getHomeFrequentProjects () {
return request({
url: SERVER.SERVERAPI + '/rest/workBench/getHomeFrequentProjects',
method: 'get'
})
}
//保存常办项目
export function saveFrequentProjectsList (data) {
return request({
url: SERVER.SERVERAPI + '/rest/workBench/saveFrequentProjectsList',
method: 'post',
data
})
}
......
......@@ -72,3 +72,11 @@ export function setReadStatus (params) {
params: params
})
}
//一键设置已读
export function setAllRead () {
return request({
url: SERVER.SERVERAPI + '/rest/system/sysNotice/setAllRead',
method: 'get'
})
}
......
<template>
<dialogBox title="配置常办项目" @submitForm="submitForm" saveButton="保存" :isFullscreen="false" width="50%"
@closeDialog="closeDialog" v-model="value">
<el-form ref="ruleForm" :model="ruleForm" label-width="100px" >
<el-tree
:data="projectList"
show-checkbox
node-key="id"
ref="tree"
check-strictly
:highlight-current='true'
:check-on-click-node="true"
:accordion="true"
:props="defaultProps"
:default-expand-all="true"
@check-change="handleClick"
></el-tree>
</el-form>
</dialogBox>
</template>
<script>
import { getMenuInfo} from "@/api/user.js";
import { saveFrequentProjectsList } from "@/api/home.js";
export default {
props: {
value: { type: Boolean, default: false },
bindItem: {type:Array, default: []}
},
data () {
return {
projectList: [],
ruleForm: {
},
checkedItem: [],
defaultProps: {
children: "children",
label: "name",
disabled:function(data,node){
if(data.children && data.children.length > 0){
return true
}else{
return false
}
}
},
uniqueValue:''//最后拿到的唯一选择的moduldCode值,相当于id
}
},
mounted () {
this.queryClick()
this.dealCheckedItem();
},
methods: {
submitForm () {
var checkedNodes = this.$refs.tree.getCheckedNodes();
if(checkedNodes.length > 6){
this.$message.error("最多选择6个项目！");
return
}
saveFrequentProjectsList(checkedNodes).then(res => {
if(res.code == 200){
this.$parent.queryProjectList();
this.$message.success("保存成功");
this.$emit("input", false);
}else{
this.$message.error(res.message);
}
})
},
queryClick(){
getMenuInfo().then(res => {
this.projectList = res.result
})
},
dealCheckedItem(){
},
//关闭窗口
closeDialog () {
this.$emit("input", false);
},
//节点选择状态发生改变时
handleClick(data,checked, node){
var checkedNodes = this.$refs.tree.getCheckedNodes();
if(checked){
checkedNodes.push(data);
}
this.$refs.tree.setCheckedNodes(checkedNodes);
console.log(this.$refs.tree.getCheckedNodes());
},
}
}
</script>
<style scoped lang='scss'>
</style>
\ No newline at end of file
......@@ -3,28 +3,37 @@
<div class="home-left">
<el-row :gutter="8">
<el-col :span="12">
<el-card shadow="hover" :body-style="{ padding: '0' }">
<el-card shadow="hover" :body-style="{ padding: '0' }" style="height:302px">
<div slot="header" class="flexst">
<h5 class="title">常办项目</h5>
<el-button type="primary" @click="setFrequencyProject()">配置常办</el-button>
</div>
<ul class="workbench flexst">
<li v-for="(item, index) in newsListData" class="pointer" :key="index"
:style="{ backgroundColor: item.color }">
<li v-for="(item, index) in projectList" class="pointer" :key="index"
:style="{ backgroundColor: newsListData[index] }">
<i class="el-icon-s-claim"></i>
{{ item.title }}
{{ item.name }}
</li>
</ul>
</el-card>
</el-col>
<el-col :span="12">
<el-card shadow="hover" style="height:247px">
<el-card shadow="hover" style="height:302px">
<div slot="header" class="flexst">
<h5 class="title">系统通知</h5>
<i class="el-icon-s-unfold pointer"></i>
<el-popover placement="right" width="50" trigger="hover">
<ul class="pointer">
<li @click="$store.dispatch('tagsView/addView', moreNotice)">查看更多</li>
</ul>
<i class="el-icon-s-unfold pointer" slot="reference"></i>
</el-popover>
</div>
<ul>
<li v-for="(item, index) in noticeList" :key="index" @click="handleNotice(item)" class="flexst pointer">
<p class="list-title">{{ item.noticeTitle }}</p>
<p class="marginZL15">{{ item.noticePublishTime.substring(0, 10) }}</p>
<p v-if="item.userBrowse == '1'" style="color:red">未读</p>
<p v-else>已读</p>
<p v-else style="color:green">已读</p>
</li>
</ul>
</el-card>
......@@ -49,7 +58,12 @@
<el-card shadow="hover" style="height:247px">
<div slot="header" class="flexst">
<h5 class="title">政策法规</h5>
<i class="el-icon-s-unfold pointer"></i>
<el-popover placement="right" width="50" trigger="hover">
<ul class="pointer">
<li @click="$store.dispatch('tagsView/addView', moreNotice)">查看更多</li>
</ul>
<i class="el-icon-s-unfold pointer" slot="reference"></i>
</el-popover>
</div>
<ul>
<li v-for="(item, index) in policyList" @click="handleView(item.noticeFileUrl)" :key="index"
......@@ -81,51 +95,22 @@
</ul>
</el-card>
</div>
<addDialog ref="addProject" v-model="projectDialog" :bindItem="projectList"/>
</div>
</template>
<script>
import * as G2 from '@antv/g2'
import calendar from '@/components/Calendar/index'
import vueSeamlessScroll from "vue-seamless-scroll"
import { getHomeNoticeList, getHomeTodoList, getHomeDoneList } from "@/api/home.js";
import { getHomeNoticeList, getHomeTodoList, getHomeDoneList,getHomeFrequentProjects } from "@/api/home.js";
import { setReadStatus } from "@/api/notice.js";
import addDialog from "./components/addProject.vue";
export default {
name: 'home',
components: { calendar, vueSeamlessScroll },
components: { calendar, vueSeamlessScroll,addDialog },
data () {
return {
newsListData: [
{
icon: '',
title: '任务',
color: '#61AEFF'
},
{
icon: '',
title: '邮件',
color: '#43DEB3'
},
{
icon: '',
title: '消息',
color: '#F3C143'
},
{
icon: '',
title: '日历',
color: '#F09936'
},
{
icon: '',
title: '常用功能',
color: '#9C92FF'
},
{
icon: '',
title: '申请',
color: '#589FFF'
}
],
newsListData: ['#61AEFF','#43DEB3','#F3C143','#F09936','#9C92FF','#589FFF',],
chartData: [{
year: '1991',
value: 15468
......@@ -149,21 +134,27 @@ export default {
value: 31056
}],
// 系统通知
noticeData: {
noticeData: {},
noticeList: [],//通知列表
todoList: [],//待办列表
doneList: [],//已办列表
policyList: [],//法律法规列表
projectList: [],//常办项目列表
projectDialog: false,
moreNotice: {
fullPath: '/system/xttz/xttzview',
name: '系统通知',
path: '/system/xttz/xttzview',
meta: { title: '系统通知' }
},
noticeList: [],
todoList: [],
doneList: [],
policyList: [],
}
},
mounted () {
this.buildChart();
this.queryTodoList();
this.queryDoneList();
this.queryNoticeList();
this.buildChart();//构建图标
this.queryTodoList();//获取待办列表
this.queryDoneList();//获取已办列表
this.queryNoticeList();//获取通知、法律法规列表
this.queryProjectList();//获取常办项目列表
},
methods: {
handleView (pdfUrl) {
......@@ -198,6 +189,14 @@ export default {
}
})
},
//获取常办项目列表
queryProjectList(){
getHomeFrequentProjects().then(res => {
if(res.result){
this.projectList = res.result
}
})
},
_timedate (d) {
var td = new Date();
td = new Date(td.getFullYear(), td.getMonth(), td.getDate());
......@@ -242,6 +241,15 @@ export default {
chart.line().position('year*value').size(2).shape('smooth');
chart.render();
},
//跳转到更多通知列表页面
jumpToMoreNotice(){
console.log(this.$route);
},
//配置常办项目
setFrequencyProject(){
this.projectDialog = true;
},
handleNotice (item) {
this.$alertMes(item.noticeTitle, item.noticeContent)
}
......
<template>
<div class="from-clues">
<!-- 表单部分 -->
<div class="from-clues-header">
<el-form :model="ruleForm" @submit.native.prevent label-width="80px">
<el-row>
<el-col :span="5">
<el-form-item label="通知标题">
<el-input v-model="ruleForm.noticeTitle" @clear="queryClick()" clearable placeholder="通知标题"></el-input>
</el-form-item>
</el-col>
<el-col :span="19" class="btnColRight">
<el-form-item>
<el-button type="primary" native-type="submit" @click="queryClick()">查询</el-button>
<el-button type="primary" native-type="submit" @click="toReadAll()">一键已读</el-button>
</el-form-item>
</el-col>
</el-row>
</el-form>
</div>
<!-- 表格 -->
<div class="from-clues-content">
<lb-table :page-size="pageData.size" border :current-page.sync="pageData.current" :total="tableData.total"
@size-change="handleSizeChange" @p-current-change="handleCurrentChange" :column="tableData.columns"
:data="tableData.data">
</lb-table>
</div>
<addDialog ref="addDialog" v-model="isDialog" :isButtonFlag="isButtonFlag" :title="dialogTitle"/>
</div>
</template>
<script>
import table from "@/utils/mixin/table";
import { datas, sendThis } from "./xttzviewdata";
import { getSysNoticeList,setReadStatus,setAllRead} from "@/api/notice.js"
import addDialog from "./components/addDialog.vue";
export default {
name: "xttzview",
components: { addDialog },
mixins: [table],
mounted () {
sendThis(this);
this.queryClick()
},
data () {
return {
isDialog: false,
isButtonFlag: true,
dialogTitle: '',
ruleForm: {
noticeTitle: '',
noticeStatus: '2'
},
tableData: {
total: 0,
columns: datas.columns(),
data: [],
},
isDiglog: false
}
},
methods: {
// 列表渲染接口
queryClick () {
this.$startLoading()
getSysNoticeList({ ...this.ruleForm, ...this.pageData }, { 'target': '#xttzLoading' }).then(res => {
if (res.code === 200) {
this.$endLoading()
let { total, records } = res.result
this.tableData.total = total;
this.tableData.data = records
}
})
},
//打开新增弹窗
openDialog (item) {
this.$nextTick(() => {
this.isButtonFlag = false;
this.$refs.addDialog.getDetailInfo(item);
this.dialogTitle = '系统通知详情'
this.isDialog = true;
})
let that = this;
if(item.isRead == 1){
setReadStatus({bsmNotice: item.bsmNotice}).then(res => {
if(res.code == 200){
that.$nextTick(()=> {
item.isRead = 2
})
}
})
}
},
//一键已读
toReadAll(){
setAllRead().then(res => {
if(res.code == 200){
this.$message.success('设置成功')
this.queryClick();
}else{
this.$message.error("设置失败")
}
})
},
downloadFile (item) {
const href = item.noticeFileUrl
window.open(href, '_blank');
}
},
};
</script>
<style scoped lang="scss">
@import "~@/styles/public.scss";
</style>
import filter from '@/utils/filter.js'
let vm = null
const sendThis = (_this) => {
vm = _this
}
class data extends filter {
constructor() {
super()
}
columns () {
return [
{
label: '序号',
type: 'index',
width: '50',
render: (h, scope) => {
return (
<div>
{(vm.pageData.currentPage - 1) * vm.pageData.pageSize + scope.$index + 1}
</div>
)
}
},
{
prop: "noticeTitle",
label: "通知标题",
},
{
prop: "noticeSource",
label: "通知来源",
},
{
label: "通知内容",
render: (h, scope) => {
return <div class="item-cwnr" domPropsInnerHTML={scope.row.noticeContent}></div>
}
},
{
prop: "noticeFileName",
label: "通知附件",
render: (h, scope) => {
return <div class="pointer" onClick={() => { vm.downloadFile(scope.row) }}>{scope.row.noticeFileName}</div>
}
},
{
prop: "noticePublishTime",
label: "发布时间",
},
{
prop: "creater",
width: '120',
label: "发布人",
},
{
prop: "noticePublishTime",
label: "发布时间",
},
{
label: "是否已读",
width: '80',
render: (h, scope) => {
switch (scope.row.isRead) {
case '1':
return <div class='prohibit'>未读</div>
case '2':
return <div class='allow'>已读</div>
}
}
},
{
label: '操作',
align: 'center',
fixed: 'right',
render: (h, scope) => {
return <div>
<el-button type="text" icon="el-icon-view" onClick={() => { vm.openDialog(scope.row) }}>查看</el-button>
</div>
}
}
]
}
ywlys () {
return [
{ value: 1, label: "办事大厅" },
{ value: 2, label: "微信小程序" },
{ value: 3, label: "法院端" },
{ value: 4, label: "银行端" },
]
}
}
let datas = new data()
export {
datas,
sendThis
}