Browse Source

消息中心/通知管理/字典项/多级别菜单/借阅车

master
xuhuajiao 9 months ago
parent
commit
26c5f42675
  1. 2
      public/index.html
  2. 10
      src/api/archiveUtilize/archiveUtilize.js
  3. 11
      src/api/archivesManage/library.js
  4. 60
      src/api/system/dictDetail.js
  5. 24
      src/assets/styles/archives-manage.scss
  6. 70
      src/assets/styles/sidebar.scss
  7. 19
      src/assets/styles/yxk-admin.scss
  8. 245
      src/layout/components/Navbar.vue
  9. 3
      src/layout/components/Sidebar/Item.vue
  10. 2
      src/layout/index.vue
  11. 4
      src/store/getters.js
  12. 21
      src/store/modules/cart.js
  13. 2
      src/views/archiveUtilize/archiveSearch/module/resultList.vue
  14. 2
      src/views/archiveUtilize/utillizeRecord/module/utilizationProcess.vue
  15. 22
      src/views/nested/menu1/index.vue
  16. 40
      src/views/nested/menu1/menu1-1/index.vue
  17. 7
      src/views/nested/menu1/menu1-2/index.vue
  18. 5
      src/views/nested/menu1/menu1-2/menu1-2-1/index.vue
  19. 5
      src/views/nested/menu2/index.vue
  20. 409
      src/views/system/dict/dictDetail.vue
  21. 324
      src/views/system/dict/index.vue
  22. 425
      src/views/system/dict/index2.vue
  23. 13
      src/views/system/log/operateLog/index.vue
  24. 7
      src/views/system/notifyManage/index.vue
  25. 23
      src/views/system/notifyManage/module/detail.vue
  26. 22
      src/views/system/processManage/runningProcess/module/detail.vue
  27. 2
      src/views/system/user/cart.vue
  28. 4
      src/views/system/user/center.vue
  29. 139
      src/views/system/user/messageCenter/index.vue
  30. 301
      src/views/system/user/messageCenter/module/list.vue
  31. 26
      src/views/system/user/processCenter/module/form.vue

2
public/index.html

@ -12,4 +12,4 @@
<body>
<div id="app"></div>
</body>
</html>
</html>

10
src/api/archiveUtilize/archiveUtilize.js

@ -49,4 +49,12 @@ export function FetchSeniorSearch(params) {
})
}
export default { FetchInitSearchFonds, FetchInitSearchCategory, FetchInitSearchArchiveCtgNo, FetchResearch, FetchSearchHistory, FetchSeniorSearch }
// 初始化借阅车
export function FetchInitborrowCar(params) {
return request({
url: 'api/archivesUtilize/initborrowCar' + '?' + qs.stringify(params, { indices: false }),
method: 'get'
})
}
export default { FetchInitSearchFonds, FetchInitSearchCategory, FetchInitSearchArchiveCtgNo, FetchResearch, FetchSearchHistory, FetchSeniorSearch, FetchInitborrowCar }

11
src/api/archivesManage/library.js

@ -41,6 +41,14 @@ export function FetchBusinessFlowDetails(params) {
})
}
// 进入流程操作
export function FetchHandBusinessFlowDetails(params) {
return request({
url: 'api/control/handBusinessFlowDetails' + '?' + qs.stringify(params, { indices: false }),
method: 'get'
})
}
// 获取主页基础数据
export function FetchMainData(params) {
return request({
@ -133,5 +141,6 @@ export default {
FetchArchivesOpenConfirm,
FetchArchivesReturnConfirm,
FetchTransferConfirm,
FetchOfflineTransferConfirm
FetchOfflineTransferConfirm,
FetchHandBusinessFlowDetails
}

60
src/api/system/dictDetail.js

@ -0,0 +1,60 @@
import request from '@/utils/request'
export function FetchDictsList(params) {
return request({
url: 'api/dictionary/initDictionaryList',
method: 'get',
params
})
}
export function add(data) {
return request({
url: 'api/dictionary/editDictionary',
method: 'post',
data
})
}
export function del(data) {
return request({
url: 'api/dictionary/delDictionary',
method: 'post',
data
})
}
export function edit(data) {
return request({
url: 'api/dictionary/editDictionary',
method: 'post',
data
})
}
export function FetchDictionaryTree(params) {
return request({
url: 'api/dictionary/initDictionaryTree',
method: 'get',
params
})
}
export function FetchSonDictionaryList(params) {
return request({
url: 'api/dictionary/getSonDictionaryList',
method: 'get',
params
})
}
// 快速筛选
export function FetchDictionaryTreeByCategoryId(params) {
return request({
url: 'api/dictionary/getDictionaryTreeByCategoryId',
method: 'get',
params
})
}
export default { add, edit, del, FetchDictsList, FetchDictionaryTree, FetchSonDictionaryList, FetchDictionaryTreeByCategoryId }

24
src/assets/styles/archives-manage.scss

@ -992,4 +992,28 @@
& i{
font-size: 13px;
}
}
.message-type-title{
display: block;
padding-left: 33px;
height: 33px;
line-height: 33px;
margin-bottom: 15px;
&.type-title1{
background: url('~@/assets/images/icon/xttz.png') no-repeat left center;
background-size: 23px 23px;
}
&.type-title2{
background: url('~@/assets/images/icon/lcdd.png') no-repeat left center;
background-size: 23px 23px;
}
&.type-title3{
background: url('~@/assets/images/icon/lcwc.png') no-repeat left center;
background-size: 23px 23px;
}
&.type-title4{
background: url('~@/assets/images/icon/fqdq.png') no-repeat left center;
background-size: 23px 23px;
}
}

70
src/assets/styles/sidebar.scss

@ -78,7 +78,7 @@
font-size: 16px;
height: 60px !important;
line-height: 60px !important;
padding: 0 30px 0 28px !important;
// padding: 0 30px 0 28px !important;
background-color: transparent !important;
@include siderBar-submenu-set;
&:hover {
@ -89,25 +89,31 @@
}
}
& .el-submenu .el-menu-item{
position: relative;
padding: 0 60px 0 82px !important;
height: 36px !important;
line-height: 36px;
@include siderBar-submenu-set;
&::before{
content: "";
position: absolute;
left: 56px;
top: 50%;
width: 6px;
height: 6px;
background-color: #fff;
border-radius: 50%;
transform: translateY(-50%);
}
.svg-icon {
display: none;
& .el-submenu{
& a{
.el-menu-item{
position: relative;
// padding: 0 60px 0 82px !important;
height: 36px !important;
line-height: 36px;
@include siderBar-submenu-set;
& .dot{
// content: "";
// position: absolute;
// left: 56px;
// top: 50%;
display: inline-block;
width: 6px;
height: 6px;
background-color: #fff;
border-radius: 50%;
margin-right: 14px;
// transform: translateY(-50%);
}
.svg-icon {
display: none;
}
}
}
}
@ -129,6 +135,22 @@
.is-active.el-menu-item {
@include siderBar-submenu-set-acitve;
}
.el-menu{
.nest-menu{
& li.el-submenu{
& div.el-submenu__title{
font-size: 14px !important;
height: 50px !important;
line-height: 50px !important;
& i.el-submenu__icon-arrow{
font-size: 14px !important;
}
}
}
}
}
}
.hideSidebar {
@ -165,8 +187,10 @@
.el-submenu__icon-arrow {
display: none;
}
}
}
.el-menu--collapse {
@ -252,6 +276,12 @@
&:hover {
background-image: $subMenuHover !important;
}
& i.el-submenu__icon-arrow {
position: static;
right: 0;
margin-top: 0;
}
}
// the scroll bar appears when the subMenu is too long

19
src/assets/styles/yxk-admin.scss

@ -1041,18 +1041,23 @@ input[type ='number'] {
.el-dropdown-menu--small .el-dropdown-menu__item.message-list-item{
padding: 0;
}
.message-list-item a{
.message-list-item a,
.messsage-item{
display: flex;
justify-content: space-between;
padding: 0 20px;
height: 40px;
justify-content: flex-start;
padding: 5px 10px;
// height: 40px;
font-size: 14px;
border-bottom: 1px solid #113D72;
line-height: 30px;
// border-bottom: 1px solid #113D72;
&:hover{
background-color: #F5F9FC;
}
p, span, i{
line-height: 40px;
// line-height: 40px;
}
p{
width: 220px;
width: 300px;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;

245
src/layout/components/Navbar.vue

@ -4,10 +4,9 @@
<div class="right-menu">
<!-- 主题切换 -->
<el-dropdown trigger="click" style="margin-right: 30px;">
<div class="message-icon" style="cursor: pointer;">
<el-dropdown trigger="click">
<div class="message-icon cart-main" style="cursor: pointer;">
<span class="iconfont icon-zhuti" />
<!-- <i v-if="msgList.length > 0" class="message-num">{{ msgList.length }}</i> -->
</div>
<el-dropdown-menu slot="dropdown" class="message-dropdown">
<el-dropdown-item @click.native="changetheme('light')">
@ -20,32 +19,41 @@
</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
<!-- 借阅车 -->
<router-link :to="{ path: '/user/cart'}">
<div class="iconfont icon-jieyueche-ding" />
<div class="message-icon cart-main">
<span class="iconfont icon-jieyueche-ding" />
<i v-if="cartCount.length > 0" class="message-num">{{ cartCount.length }}</i>
</div>
</router-link>
<!-- 消息中心 -->
<el-dropdown ref="messageDrop" class="message-center right-menu-item hover-effect" trigger="click">
<div class="message-icon">
<div class="message-icon" style="margin: 0 15px;">
<span class="iconfont icon-xiaoxi" />
<i v-if="msgList.length > 0" class="message-num">{{ msgList.length }}</i>
<i v-if="messageAll.length > 0" class="message-num">{{ messageAll.length }}</i>
</div>
<el-dropdown-menu slot="dropdown" class="message-dropdown" style="width: 420px;">
<div style="display: flex; justify-content: flex-end; padding: 0 20px; height: 40px; line-height: 40px; color: #A6ADB6; font-size: 14px; border-bottom: 1px solid #E6E8ED;">
<el-dropdown-menu slot="dropdown" class="message-dropdown" style="width: 420px; padding: 17px 0 0 0;">
<div style="display: flex; justify-content: space-between; padding: 0 20px; height: 40px; line-height: 40px; color: #A6ADB6; font-size: 14px; border-bottom: 1px solid #E6E8ED;">
<h3 style="font-size: 16px; color: #0C0E1E;">消息</h3>
<span style="cursor: pointer;" @click="handleAllRead">全部标记为已读</span>
<!-- 消息中心router -->
<!-- <span style="color:#fff; margin-left: 10px; cursor: pointer;" @click="toAllMessage">去查看</span> -->
</div>
<div style="max-height: 450px; overflow: hidden; padding: 20px 0 10px 0; overflow-y: scroll;">
<el-dropdown-item v-if="msgList.length===0" class="message-list-item">
<div style="max-height: 450px; overflow: hidden; padding: 10px 0; overflow-y: scroll;">
<el-dropdown-item v-if="messageAll.length===0" class="message-list-item">
<div style="text-align:center">暂无最新消息</div>
</el-dropdown-item>
<el-dropdown-item v-for="(item,index) in msgList" :key="index" class="message-list-item">
<router-link :to="{ path: '/user/center', query: { activeIndex: 1 }}">
<p>{{ item.noticeContent }}</p>
<span>{{ item.create_time | parseTime }}</span>
<i class="el-icon-arrow-right" />
</router-link>
<el-dropdown-item v-for="(item,index) in messageAll" :key="index" class="message-list-item" style="padding: 0 14px;">
<!-- <router-link :to="{ path: '/user/center', query: { activeIndex: 1, noticeType: item.noticeType }}"> -->
<div class="messsage-item" @click="toMessage(item)">
<span :class="['message-type-title',{'type-title1': item.noticeType === 1 },{'type-title2':item.noticeType === 2 },{'type-title3': item.noticeType === 3 },{'type-title4': item.noticeType === 4}]" />
<div class="message-top-cont">
<h4>{{ setNoticeTitle(item) }}</h4>
<p>{{ item.noticeContext }}</p>
<span>{{ item.createTime | parseTime }}</span>
</div>
</div>
<!-- </router-link> -->
</el-dropdown-item>
<div v-if="messageAll.length!==0" class="all-message-btn" @click="toAllMessage">查看全部<i class="iconfont icon-chakan" /></div>
</div>
</el-dropdown-menu>
</el-dropdown>
@ -89,7 +97,9 @@ import Logo from '@/layout/components/Sidebar/Logo'
// import Screenfull from '@/components/Screenfull'
// import SizeSelect from '@/components/SizeSelect'
import Avatar from '@/assets/images/avatar.png'
import { getUserNotice, isread } from '@/api/system/logs'
// import { FetchMySystemNotice } from '@/api/system/new'
import { FetchReadedAll } from '@/api/system/new'
import store from '@/store'
export default {
inject: ['reload'],
@ -107,16 +117,18 @@ export default {
Avatar: Avatar,
defaultImg: 'this.src="' + require('@/assets/images/avatar.png') + '"',
msgList: [],
cartList: [],
themeValue: localStorage.getItem('themeValue') ? localStorage.getItem('themeValue') : 'light'
}
},
computed: {
...mapGetters([
'sidebar',
'device',
'user',
'baseApi'
'baseApi',
'cartCount',
'messageAll'
]),
show: {
get() {
@ -137,7 +149,8 @@ export default {
}
},
created() {
this.getMsgList()
store.dispatch('initborrowCar').then(() => {})
store.dispatch('initMySystemNotice').then(() => { })
if (!localStorage.getItem('themeValue')) {
this.changetheme('light')
} else {
@ -145,19 +158,26 @@ export default {
}
},
methods: {
setNoticeTitle(item) {
switch (item.noticeType) {
case 1 :
return '系统通知'
case 2 :
return '有流程达到'
case 3:
return '流程完成提醒'
case 4:
return '赋权到期提醒'
}
},
//
async getMsgList() {
const params = {
page: 0,
size: 10,
sort: 'createTime,desc'
size: 10
}
const list = []
const allList = await this.getAllNoRead(params, list)
allList.forEach(item => {
item.pushUserName = item.noticeUsers[0].pushUserName
item.isRead = item.noticeUsers[0].isRead
})
const arr = allList.filter(item => { return !item.isRead })
if (arr.length > 20) {
this.msgList = arr.slice(0, 20)
@ -167,46 +187,45 @@ export default {
},
//
async handleAllRead() {
const params = {
page: 0,
size: 10,
sort: 'createTime,desc'
}
const list = []
const ids = []
const allList = await this.getAllNoRead(params, list)
allList.forEach(item => {
item.noticeUsers.forEach(i => {
ids.push(i.id)
})
})
isread(ids).then(res => {
if (res) {
this.msgList = []
if (this.$route.path.includes('user/center') || this.$route.path.includes('system/notifyManage')) {
this.reload()
}
if (this.messageAll.length === 0) {
this.$message({ message: '暂无需要处理得未读消息', type: 'error', offset: 8 })
} else {
const params = {
'newsType': null
}
})
FetchReadedAll(params).then(res => {
if (res) {
store.dispatch('initMySystemNotice').then(() => {})
if (this.$route.path.includes('user/center') || this.$route.path.includes('system/notifyManage')) {
this.reload()
}
}
})
}
},
//
async getAllNoRead(params, list) {
const allList = await getUserNotice(params).then(res => {
list = list.concat(res.content)
if ((list.length) < res.totalElements) {
params.page++
return this.getAllNoRead(params, list)
} else {
return list
}
})
return allList
// const allList = await FetchMySystemNotice(params).then(res => {
// list = list.concat(res.content)
// if ((list.length) < res.totalElements) {
// params.page++
// return this.getAllNoRead(params, list)
// } else {
// return list
// }
// })
// return allList
},
toggleSideBar() {
this.$store.dispatch('app/toggleSideBar')
},
toMessage(item) {
this.$router.push({ path: '/user/center', query: { activeIndex: 1, noticeType: item.noticeType }})
this.reload()
},
toAllMessage() {
this.$router.push({ path: '/user/center', query: { activeIndex: 1 }})
this.$router.push({ path: '/user/center', query: { activeIndex: 1, noticeType: 1 }})
this.reload()
this.$refs.messageDrop.hide()
},
open() {
@ -267,7 +286,6 @@ export default {
&.hover-effect {
cursor: pointer;
transition: background .3s;
&:hover {
background: rgba(0, 0, 0, .025)
}
@ -275,26 +293,28 @@ export default {
}
.message-center{
margin-right: 40px;
.message-icon{
position: relative;
.icon-xiaoxi{
font-size: 20px;
@include icon_color;
}
.message-num{
position: absolute;
top: 0;
right: -8px;
display: block;
width: 20px;
height: 20px;
font-size: 14px;
text-align: center;
line-height: 20px;
border-radius: 50%;
background-color: #F91832;
color: #fff;
}
}
.message-icon{
position: relative;
.icon-xiaoxi{
font-size: 20px;
@include icon_color;
}
.message-num{
position: absolute;
top: 12px;
right: -8px;
display: block;
width: 20px;
height: 20px;
font-size: 14px;
text-align: center;
line-height: 20px;
border-radius: 50%;
background-color: #F91832;
color: #fff;
}
}
@ -331,10 +351,21 @@ export default {
}
}
}
.cart-main{
cursor: pointer;
span{
display: block;
padding: 0 15px;
}
& :hover{
background-color: rgba(249,249,249,1);
}
& .message-num{
right: 6px !important;
}
}
.icon-jieyueche-ding{
font-size: 20px;
margin-right: 30px;
cursor: pointer;
@include icon_color;
}
.icon-zhuti{
@ -345,4 +376,54 @@ export default {
color: #409EFF;
background-color: red;
}
.message-type-title{
width: 32px;
height: auto;
margin-right: 12px;
margin-bottom: 0;
&.type-title1{
background-size: 32px 32px;
}
&.type-title2{
background-size: 32px 32px;
}
&.type-title3{
background-size: 32px 32px;
}
&.type-title4{
background-size: 32px 32px;
}
}
.message-top-cont{
position: relative;
color: #A6ADB6;
flex: 1;
font-size: 12px;
& h4{
color: #545B65;
font-size: 14px;
}
& span{
position: absolute;
right: 0;
top: 0;
}
}
.all-message-btn{
font-size: 14px;
color: #545B65;
text-align: center;
height: 40px;
line-height: 40px;
border-top: 1px solid #E6E8ED;
margin-top: 12px;
cursor: pointer;
i{
font-size: 12px;
padding-left: 10px;
color: #888D94;
}
}
</style>

3
src/layout/components/Sidebar/Item.vue

@ -15,6 +15,9 @@ export default {
render(h, context) {
const { icon, title } = context.props
const vnodes = []
if (title) {
vnodes.push(<span class='dot'/>)
}
if (icon) {
vnodes.push(<svg-icon icon-class={icon}/>)

2
src/layout/index.vue

@ -29,6 +29,7 @@ import ResizeMixin from './mixin/ResizeHandler'
import { mapState } from 'vuex'
import Theme from '@/components/ThemePicker'
import Cookies from 'js-cookie'
import store from '@/store'
export default {
name: 'Layout',
components: {
@ -66,6 +67,7 @@ export default {
watch: {
$route(route) {
this.routerCurrent = route.path
store.dispatch('initMySystemNotice').then(() => {})
}
},
mounted() {

4
src/store/getters.js

@ -20,6 +20,8 @@ const getters = {
qiNiuUploadApi: state => state.api.qiNiuUploadApi,
sqlApi: state => state.api.sqlApi,
swaggerApi: state => state.api.swaggerApi,
sidebarRouters: state => state.permission.sidebarRouters
sidebarRouters: state => state.permission.sidebarRouters,
cartCount: state => state.cart.cartCount,
messageAll: state => state.cart.messageAll
}
export default getters

21
src/store/modules/cart.js

@ -1,18 +1,23 @@
import { FetchInitborrowCar } from '@/api/archiveUtilize/archiveUtilize'
import { FetchMySystemNotice } from '@/api/system/new'
// import { getToken, setToken, removeToken } from '@/utils/auth'
const cart = {
state: {
cartCount: 0
cartCount: [],
messageAll: []
},
mutations: {
SET_CART(state, cartCount) {
state.cartCount = cartCount
},
SET_MESSAGE(state, messageCount) {
state.messageAll = messageCount
}
},
actions: {
// 获取用户信息
// 获取用户借阅车
initborrowCar({ commit }) {
return new Promise((resolve, reject) => {
FetchInitborrowCar().then(res => {
@ -22,6 +27,18 @@ const cart = {
reject(error)
})
})
},
// 获取用户未读消息
initMySystemNotice({ commit }) {
return new Promise((resolve, reject) => {
FetchMySystemNotice().then(res => {
const arr = res.content.filter(item => { return !item.isRead })
commit('SET_MESSAGE', arr)
resolve(res)
}).catch(error => {
reject(error)
})
})
}
}
}

2
src/views/archiveUtilize/archiveSearch/module/resultList.vue

@ -160,6 +160,7 @@ import { FetchInitSearchFonds, FetchInitSearchCategory, FetchInitSearchArchiveCt
import { FetchAddBorrowCar } from '@/api/archiveUtilize/cart'
import ArchivesInfo from '@/views/components/archivesDetail/detail'
import LendForm from '../../utillizeRecord/module/utilizationProcess'
import store from '@/store'
import { mapGetters } from 'vuex'
export default {
name: 'ResultList',
@ -544,6 +545,7 @@ export default {
FetchAddBorrowCar(params).then(res => {
if (res) {
this.$message({ message: '加入借阅车成功', type: 'success', offset: 8 })
store.dispatch('initborrowCar').then(() => {})
} else {
this.$message({ message: '当前所属档案已在借阅车,请勿重复操作', type: 'error', offset: 8 })
}

2
src/views/archiveUtilize/utillizeRecord/module/utilizationProcess.vue

@ -88,6 +88,7 @@ import { FetchFondsDetail } from '@/api/system/fonds'
import { FetchIntoFlowBusiness } from '@/api/archivesManage/library'
import { FetchBusinessFlowTitle } from '@/api/collect/collect'
import { mapGetters } from 'vuex'
import store from '@/store'
export default {
name: 'LendForm',
components: { },
@ -241,6 +242,7 @@ export default {
if (res.code !== 5001 && res.code !== 500) {
this.$message({ message: '操作提交成功', type: 'success', offset: 8 })
this.$emit('close-dialog')
store.dispatch('initborrowCar').then(() => {})
} else {
// const message = JSON.parse(res.message)
// this.$message.error(message.fail.join(',') + '')

22
src/views/nested/menu1/index.vue

@ -0,0 +1,22 @@
<template>
<div style="padding:30px;">
<el-alert :closable="false" title="menu 1">
<router-view />
</el-alert>
</div>
</template>
<script>
export default {
name: 'Test',
data() {
return {
input: ''
}
}
}
</script>
<style scoped>
.my-code a{
color:#009688;
}
</style>

40
src/views/nested/menu1/menu1-1/index.vue

@ -0,0 +1,40 @@
<template>
<div class="app-container">
<div style="padding:30px;">
<el-alert :closable="false" title="menu 1-1" type="success">
<router-view />
</el-alert>
</div>
<!-- <el-form label-width="170px" style="margin-top: 20px">
<el-form-item label="三级菜单缓存功能测试区">
<el-input v-model="input" placeholder="请输入内容" style="width: 360px;" />
</el-form-item>
</el-form>
<div>
<blockquote class="my-blockquote"> 三级菜单缓存配置</blockquote>
<pre class="my-code">
1将前后端代码更新为最新版版本或对照提交记录修改,点击查看-> <a href="https://www.aiyxlib.com/XXXX" target="_blank">提交(1)</a><a href="https://www.aiyxlib.com" target="_blank">提交(2)</a><a href="https://www.aiyxlib.com" target="_blank">提交(3)</a>
2 二级菜单 菜单类型 设置为 目录 级别并且原有的 组件路径 需要清空
3 三级菜单 菜单缓存 设置为 最后将 组件名称 填写正确
4具体设置可参考 菜单管理 多级菜单 配置进行进行相应的修改
</pre>
<blockquote class="my-blockquote">更多帮助请联系管理员</blockquote>
<pre class="my-code">联系QQ421691338</pre>
</div> -->
</div>
</template>
<script>
export default {
name: 'Test',
data() {
return {
input: ''
}
}
}
</script>
<style scoped>
.my-code a{
color:#009688;
}
</style>

7
src/views/nested/menu1/menu1-2/index.vue

@ -0,0 +1,7 @@
<template>
<div style="padding:30px;">
<el-alert :closable="false" title="menu 1-2" type="success">
<router-view />
</el-alert>
</div>
</template>

5
src/views/nested/menu1/menu1-2/menu1-2-1/index.vue

@ -0,0 +1,5 @@
<template>
<div style="padding:30px;">
<el-alert :closable="false" title="menu 1-2-1" type="warning" />
</div>
</template>

5
src/views/nested/menu2/index.vue

@ -0,0 +1,5 @@
<template>
<div style="padding:30px;">
<el-alert :closable="false" title="二级菜单" />
</div>
</template>

409
src/views/system/dict/dictDetail.vue

@ -0,0 +1,409 @@
<template>
<div>
<div class="head-container">
<crudOperation :permission="permission">
<template v-slot:left>
<el-button v-permission="permission.add" size="mini" type="primary" :disabled="!activeAddBtn" @click="crud.toAdd"><i class="iconfont icon-xinzeng" />新增</el-button>
</template>
<template v-slot:right>
<el-button v-permission="permission.del" size="mini" :loading="crud.delAllLoading" :disabled="crud.selections.length === 0" @click="toDelete(crud.selections)"><i class="iconfont icon-shanchu" />删除</el-button>
</template>
</crudOperation>
</div>
<el-table
ref="table"
v-loading="crud.loading"
lazy
:load="getDictsDatas"
:data="tableData"
:tree-props="{children: 'children', hasChildren: 'hasChildren'}"
height="calc(100vh - 330px)"
:row-key="getRowKey"
style="width: 100%;"
@select-all="selectAll"
@select="selectTr"
@selection-change="crud.selectionChangeHandler"
@row-click="clickRowHandler"
>
<el-table-column type="selection" align="center" width="55" />
<el-table-column prop="dictionaryName" label="字典名称" />
<el-table-column prop="dictionaryCode" label="字典代码" />
<el-table-column prop="dictionaryRemarks" label="内容说明" show-overflow-tooltip width="200px" />
<el-table-column prop="dictionaryOrder" label="排序" />
<el-table-column prop="createTime" label="创建日期" width="200px">
<template slot-scope="scope">
<div>{{ scope.row.createTime | parseTime }}</div>
</template>
</el-table-column>
</el-table>
<!--分页组件-->
<pagination v-if="tableData.length!==0" />
<!--表单组件-->
<el-dialog append-to-body :close-on-click-modal="false" :before-close="crud.cancelCU" :visible="crud.status.cu > 0" :title="crud.status.title">
<div class="setting-dialog">
<el-form ref="form" inline :model="form" :rules="rules" size="small" label-width="90px">
<el-form-item label="字典名称" prop="dictionaryName">
<el-input v-model="form.dictionaryName" />
</el-form-item>
<el-form-item label="字典代码" prop="dictionaryCode">
<el-input v-model="form.dictionaryCode" />
</el-form-item>
<el-form-item label="顶级节点" prop="isTop">
<el-radio-group v-model="form.isTop" @input="changeIsTop">
<el-radio label="1"></el-radio>
<el-radio label="0"></el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="排序" prop="dictionaryOrder">
<el-input-number
v-model.number="form.dictionaryOrder"
:min="0"
:max="999"
controls-position="right"
/>
</el-form-item>
<el-row>
<el-form-item v-if="form.isTop === '0'" label="上级节点" prop="dictionaryParents">
<treeselect
v-model="form.dictionaryParents"
style="width: 584px;"
:load-options="loadDicts"
:options="dicts"
:normalizer="normalizer"
placeholder="选择上级节点"
>
<div slot="value-label" slot-scope="{ node }">{{ getAutoNameUnknown(node.label) }}</div>
</treeselect>
</el-form-item>
</el-row>
<el-form-item label="内容说明" prop="dictionaryRemarks">
<el-input v-model="form.dictionaryRemarks" type="textarea" :rows="4" style="width: 584px;" />
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="text" @click="crud.cancelCU">取消</el-button>
<el-button :loading="crud.status.cu === 2" type="primary" @click="crud.submitCU">确认</el-button>
</div>
</div>
</el-dialog>
</div>
</template>
<script>
import crudDictDetail from '@/api/system/dictDetail'
import CRUD, { presenter, header, form } from '@crud/crud'
import crudOperation from '@crud/CRUD.operation'
import pagination from '@crud/Pagination'
import Treeselect from '@riophae/vue-treeselect'
import '@riophae/vue-treeselect/dist/vue-treeselect.css'
import { LOAD_CHILDREN_OPTIONS } from '@riophae/vue-treeselect'
import { mapGetters } from 'vuex'
import { exportFile } from '@/utils/index'
import qs from 'qs'
const defaultForm = { id: null, dictionaryName: null, isTop: '1', dictionaryCode: null, dictionaryOrder: 999, dictionaryRemarks: null, dictionaryParents: null }
export default {
name: 'DictDetail',
components: { Treeselect, crudOperation, pagination },
cruds() {
return [
CRUD({
title: '字典内容', idField: 'dictionaryId', url: 'api/dictionary/getSonDictionaryList',
crudMethod: { ...crudDictDetail },
sort: [],
optShow: {
add: false,
edit: true,
del: false,
reset: false,
download: false,
group: false
},
queryOnPresenterCreated: false
})
]
},
mixins: [
presenter(),
header(),
form(function() {
return Object.assign({ dictionaryParents: this.dictionaryParents }, defaultForm)
})
],
props: {
activeAddBtn: {
type: Boolean
}
},
data() {
return {
tableData: [],
needRefreshTree: false,
dicts: [],
dictionaryParents: null,
rules: {
dictionaryName: [
{ required: true, message: '请输入字典名称', trigger: 'blur' }
],
dictionaryCode: [
{ required: true, message: '请输入字典代码', trigger: 'blur' }
],
isTop: [
{ required: true, message: '请选择是否为顶级节点', trigger: 'change' }
],
dictionaryOrder: [
{ required: true, message: '请输入序号', trigger: 'blur', type: 'number' }
]
},
permission: {
add: ['admin', 'dict:add'],
edit: ['admin', 'dict:edit'],
del: ['admin', 'dict:del']
},
deleteVisible: false,
deleteData: {},
isAllSelect: false
}
},
computed: {
...mapGetters([
'baseApi'
])
},
mounted() {
},
methods: {
// vue-treeSelectunknown
getAutoNameUnknown(name) {
if (name.lastIndexOf('unknown') > -1) {
return name.split('(')[0]
} else {
return name
}
},
getRowKey(row) {
return row.dictionaryId
},
resetQuery() {
this.crud.query.blurry = ''
this.crud.toQuery()
},
//
[CRUD.HOOK.afterToCU](crud, form) {
if (form.dictionaryParents !== null) {
form.isTop = '0'
} else if (form.dictionaryId !== null) {
form.isTop = '1'
}
this.getDictsTreeList()
},
[CRUD.HOOK.afterSubmit]() {
this.needRefreshTree = true
},
[CRUD.HOOK.afterDelete]() {
this.needRefreshTree = true
},
//
[CRUD.HOOK.beforeRefresh]() {
this.crud.query.page = null
this.crud.query.size = null
this.tableData = []
},
[CRUD.HOOK.afterRefresh](crud) {
crud.data.forEach(function(item, index) {
if (item.sonNum !== 0) {
item.hasChildren = true
} else {
item.hasChildren = false
}
if (!item.hasChildren) {
item.children = null
}
})
this.tableData = this.crud.data
if (this.needRefreshTree) {
this.needRefreshTree = false
// this.$emit('treeRefresh', crud.data)
this.$emit('resetQuery')
}
},
//
[CRUD.HOOK.beforeToEdit](crud, form) {
crud.form.id = form.dictionaryId
},
//
[CRUD.HOOK.afterValidateCU](crud) {
if (crud.form.isTop === '1') {
crud.form.dictionaryParents = null
}
delete crud.form.isTop
return true
},
changeIsTop(val) {
if (val === '0') {
this.getDictsTreeList()
}
},
selectAll() {
this.isAllSelect = !this.isAllSelect
const data = this.tableData
this.toggleSelect(data, this.isAllSelect, 'all')
console.log('selectAll', data)
},
//
selectTr(selection, row) {
this.$set(row, 'isChecked', !row.isChecked)
this.$nextTick(() => {
this.isAllSelect = row.isChecked
this.toggleSelect(row, row.isChecked, 'tr')
})
},
//
toggleSelect(data, flag, type) {
if (type === 'all') {
if (data.length > 0) {
data.forEach((item) => {
this.toggleSelection(item, flag)
if (item.children && item.children.length > 0) {
this.toggleSelect(item.children, flag, type)
}
})
}
} else {
if (data.children && data.children.length > 0) {
data.children.forEach((item) => {
item.isChecked = flag
this.$refs.table.toggleRowSelection(item, flag)
this.toggleSelect(item, flag, type)
})
}
}
},
//
toggleSelection(row, flag) {
this.$set(row, 'isChecked', flag)
this.$nextTick(() => {
if (flag) {
this.$refs.table.toggleRowSelection(row, flag)
} else {
this.$refs.table.clearSelection()
}
})
},
clickRowHandler(row) {
this.$refs.table.clearSelection()
this.$refs.table.toggleRowSelection(row)
},
getDictsDatas(tree, treeNode, resolve) {
setTimeout(() => {
console.log('treeNode', treeNode)
crudDictDetail.FetchSonDictionaryList({ pid: tree.dictionaryId }).then(res => {
console.log(res)
const data = res.map(function(obj) {
if (obj.sonNum !== 0) {
obj.hasChildren = true
obj.children = null
} else {
obj.hasChildren = false
}
return obj
})
resolve(data)
})
}, 100)
},
getDictsTreeList() {
crudDictDetail.FetchDictionaryTree().then(res => {
this.dicts = res.map(function(obj) {
if (obj.sonNum !== 0) {
obj.hasChildren = true
} else {
obj.hasChildren = false
}
if (obj.hasChildren) {
obj.children = null
}
return obj
})
this.crud.loading = false
})
},
//
loadDicts({ action, parentNode, callback }) {
if (action === LOAD_CHILDREN_OPTIONS) {
crudDictDetail.FetchDictionaryTree().then(res => {
parentNode.children = res.map(function(obj) {
if (obj.children) {
obj.childMenus = null
}
return obj
})
setTimeout(() => {
callback()
}, 100)
})
}
},
toDelete(datas) {
this.deleteData = datas
this.$confirm('此操作将删除当前所选' + this.crud.title + '<span>你是否还要继续?</span>', '提示', {
confirmButtonText: '继续',
cancelButtonText: '取消',
type: 'warning',
dangerouslyUseHTMLString: true
}).then(() => {
this.crud.delAllLoading = true
const dictionaryIds = []
this.deleteData.forEach(val => {
dictionaryIds.push(val.dictionaryId || val.id)
})
crudDictDetail.del(dictionaryIds).then(() => {
this.$message({ message: '删除成功', type: 'success', offset: 8 })
this.crud.delAllLoading = false
this.crud.refresh()
this.$emit('resetQuery')
}).catch(err => {
this.crud.delAllLoading = false
console.log(err)
})
}).catch(() => {
})
},
doExport(data) {
console.log(data)
this.crud.downloadLoading = true
this.$confirm('此操作将导出所选数据' + '<span>你是否还要继续?</span>', '提示', {
confirmButtonText: '继续',
cancelButtonText: '取消',
type: 'warning',
dangerouslyUseHTMLString: true
}).then(() => {
const ids = []
data.forEach(val => {
ids.push(val.dictionaryId)
})
const params = {
'dictionaryIds': ids
}
exportFile(this.baseApi + '/api/dictionary/download?' + qs.stringify(params, { indices: false }))
this.crud.downloadLoading = false
}).catch(() => {
})
},
normalizer(node) {
if (node.childDictionarys == null || node.childDictionarys === 'null') {
delete node.childDictionarys
}
return {
id: node.id,
label: node.dictionaryName,
children: node.childDictionarys
}
}
}
}
</script>
<style lang="scss" scoped>
</style>

324
src/views/system/dict/index.vue

@ -1,122 +1,91 @@
<template>
<div class="app-container row-container">
<!--工具栏-->
<div class="head-container">
<div class="head-search">
<!-- 搜索 -->
<el-input v-model="query.blurry" clearable size="small" placeholder="输入字典名称或字典代码搜索" prefix-icon="el-icon-search" style="width: 240px;" class="filter-item" @keyup.enter.native="crud.toQuery" />
<el-button class="filter-item filter-search" size="mini" type="success" icon="el-icon-search" @click="crud.toQuery">搜索</el-button>
<el-button v-if="crud.optShow.reset" class="filter-item filter-refresh" size="mini" type="warning" icon="el-icon-refresh-left" @click="resetQuery()">重置</el-button>
</div>
<crudOperation :permission="permission">
<template v-slot:middle>
<el-button slot="reference" size="mini" :loading="crud.delAllLoading" :disabled="crud.selections.length === 0" @click="toDelete(crud.selections)">
<i class="iconfont icon-shanchu" />
删除
</el-button>
</template>
<template v-slot:right>
<el-button :loading="crud.downloadLoading" size="mini" :disabled="crud.selections.length === 0" @click="doExport(crud.selections)">
<i class="iconfont icon-daochu" />
导出
</el-button>
</template>
</crudOperation>
</div>
<!--表单组件-->
<el-dialog append-to-body :close-on-click-modal="false" :before-close="crud.cancelCU" :visible="crud.status.cu > 0" :title="crud.status.title">
<div class="setting-dialog">
<el-form ref="form" inline :model="form" :rules="rules" size="small" label-width="90px">
<el-form-item label="字典名称" prop="dictionaryName">
<el-input v-model="form.dictionaryName" />
</el-form-item>
<el-form-item label="字典代码" prop="dictionaryCode">
<el-input v-model="form.dictionaryCode" />
</el-form-item>
<el-form-item label="顶级节点" prop="isTop">
<el-radio-group v-model="form.isTop" @input="changeIsTop">
<el-radio label="1"></el-radio>
<el-radio label="0"></el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="排序" prop="dictionaryOrder">
<el-input-number
v-model.number="form.dictionaryOrder"
:min="0"
:max="999"
controls-position="right"
/>
</el-form-item>
<el-row>
<el-form-item v-if="form.isTop === '0'" label="上级节点" prop="dictionaryParents">
<treeselect
v-model="form.dictionaryParents"
style="width: 584px;"
:load-options="loadDicts"
:options="dicts"
:normalizer="normalizer"
placeholder="选择上级节点"
>
<div slot="value-label" slot-scope="{ node }">{{ getAutoNameUnknown(node.label) }}</div>
</treeselect>
</el-form-item>
</el-row>
<el-form-item label="内容说明" prop="dictionaryRemarks">
<el-input v-model="form.dictionaryRemarks" type="textarea" :rows="4" style="width: 584px;" />
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="text" @click="crud.cancelCU">取消</el-button>
<el-button :loading="crud.status.cu === 2" type="primary" @click="crud.submitCU">确认</el-button>
<div class="app-container category-container">
<!-- 门类列表 -->
<div class="container-main">
<div class="elect-cont-left" style="height: calc(100vh - 140px);">
<div class="head-container">
<crudOperation :permission="permission">
<template v-slot:middle>
<el-button slot="reference" size="mini" :loading="crud.delAllLoading" :disabled="crud.selections.length === 0" @click="toDelete(crud.selections)">
<i class="iconfont icon-shanchu" />
删除
</el-button>
</template>
<template v-slot:right>
<el-button :loading="crud.downloadLoading" size="mini" :disabled="crud.selections.length === 0" @click="doExport(crud.selections)">
<i class="iconfont icon-daochu" />
导出
</el-button>
</template>
</crudOperation>
</div>
</div>
</el-dialog>
<!-- <el-dialog title="删除字典内容" :visible.sync="deleteVisible" :before-close="handleClose">
<span class="dialog-right-top" />
<span class="dialog-left-bottom" />
<div class="setting-dialog">
<div class="dialog-delt">
<p><span>确定删除当前字典内容吗</span></p>
<div class="container-left" style="min-height: calc(100vh - 230px);">
<span class="right-top-line" />
<span class="left-bottom-line" />
<!--门类树状结构-->
<div class="tree-scroll">
<el-scrollbar style="height: calc(100vh - 230px);">
<el-tree ref="tree" v-loading="crud.loading" :data="crud.data" :props="defaultProps" node-key="id" :expand-on-click-node="false" highlight-current @node-click="handleNodeClick" />
</el-scrollbar>
</div>
</div>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click.native="handleConfirm">确定</el-button>
</div>
<!-- 门类管理tab -->
<div class="elect-cont-right">
<div class="container-right">
<span class="right-top-line" />
<span class="left-bottom-line" />
<dictDetail ref="dictDetail" :permission="permission" :active-add-btn="activeAddBtn" @treeRefresh="updateKeyChildren" @resetQuery="resetQuery" />
</div>
</div>
</el-dialog> -->
<div class="container-wrap">
<span class="right-top-line" />
<span class="left-bottom-line" />
<!--表格渲染-->
<!-- @selection-change="selectionChangeHandler"
@row-click="clickRowHandler" -->
<!-- height="calc(100vh - 232px)" -->
<el-table
ref="table"
v-loading="crud.loading"
lazy
:load="getDictsDatas"
:data="tableData"
:tree-props="{children: 'children', hasChildren: 'hasChildren'}"
:row-key="getRowKey"
style="width: 100%;"
@select-all="selectAll"
@select="selectTr"
@selection-change="crud.selectionChangeHandler"
@row-click="clickRowHandler"
>
<el-table-column type="selection" align="center" width="55" />
<el-table-column prop="dictionaryName" label="字典名称" />
<el-table-column prop="dictionaryCode" label="字典代码" />
<el-table-column prop="dictionaryRemarks" label="内容说明" />
<el-table-column prop="dictionaryOrder" label="排序" />
<el-table-column prop="createTime" label="创建日期" width="200px">
<template slot-scope="scope">
<div>{{ scope.row.createTime | parseTime }}</div>
</template>
</el-table-column>
</el-table>
<!--分页组件-->
<pagination v-if="crud.data.length!==0" />
<!--表单组件-->
<el-dialog append-to-body :close-on-click-modal="false" :before-close="crud.cancelCU" :visible="crud.status.cu > 0" :title="crud.status.title">
<div class="setting-dialog">
<el-form ref="form" inline :model="form" :rules="rules" size="small" label-width="90px">
<el-form-item label="字典名称" prop="dictionaryName">
<el-input v-model="form.dictionaryName" />
</el-form-item>
<el-form-item label="字典代码" prop="dictionaryCode">
<el-input v-model="form.dictionaryCode" />
</el-form-item>
<el-form-item label="顶级节点" prop="isTop">
<el-radio-group v-model="form.isTop" @input="changeIsTop">
<el-radio label="1"></el-radio>
<el-radio label="0"></el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="排序" prop="dictionaryOrder">
<el-input-number
v-model.number="form.dictionaryOrder"
:min="0"
:max="999"
controls-position="right"
/>
</el-form-item>
<el-row>
<el-form-item v-if="form.isTop === '0'" label="上级节点" prop="dictionaryParents">
<treeselect
v-model="form.dictionaryParents"
style="width: 584px;"
:load-options="loadDicts"
:options="dicts"
:normalizer="normalizer"
placeholder="选择上级节点"
>
<div slot="value-label" slot-scope="{ node }">{{ getAutoNameUnknown(node.label) }}</div>
</treeselect>
</el-form-item>
</el-row>
<el-form-item label="内容说明" prop="dictionaryRemarks">
<el-input v-model="form.dictionaryRemarks" type="textarea" :rows="4" style="width: 584px;" />
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="text" @click="crud.cancelCU">取消</el-button>
<el-button :loading="crud.status.cu === 2" type="primary" @click="crud.submitCU">确认</el-button>
</div>
</div>
</el-dialog>
</div>
</div>
</template>
@ -125,23 +94,25 @@
import crudDict from '@/api/system/dict'
import CRUD, { presenter, header, form } from '@crud/crud'
import crudOperation from '@crud/CRUD.operation'
import pagination from '@crud/Pagination'
import Treeselect from '@riophae/vue-treeselect'
import '@riophae/vue-treeselect/dist/vue-treeselect.css'
import { LOAD_CHILDREN_OPTIONS } from '@riophae/vue-treeselect'
import { mapGetters } from 'vuex'
import { exportFile } from '@/utils/index'
import qs from 'qs'
import dictDetail from './dictDetail'
// import pagination from '@crud/Pagination'
const defaultForm = { id: null, dictionaryName: null, isTop: '1', dictionaryCode: null, dictionaryOrder: 999, dictionaryRemarks: null, dictionaryParents: null }
export default {
name: 'Dicts',
components: { crudOperation, Treeselect, pagination },
components: { crudOperation, Treeselect, dictDetail },
cruds() {
return [
CRUD({
title: '字典', idField: 'dictionaryId', url: 'api/dictionary/initDictionaryList',
title: '字典', idField: 'dictionaryId || id', url: 'api/dictionary/initDictionaryTree',
crudMethod: { ...crudDict },
sort: [],
optShow: {
@ -161,13 +132,12 @@ export default {
return Object.assign({ dictionaryParents: this.dictionaryParents }, defaultForm)
})
],
props: {
activeAddBtn: {
type: Boolean
}
},
data() {
return {
currentDict: null,
tableData: [],
tableLoading: false,
selections: [],
dicts: [],
dictionaryParents: null,
rules: {
@ -191,7 +161,12 @@ export default {
},
deleteVisible: false,
deleteData: {},
isAllSelect: false
isAllSelect: false,
activeAddBtn: false,
defaultProps: {
children: 'childDictionarys',
label: 'dictionaryName'
}
}
},
computed: {
@ -226,9 +201,12 @@ export default {
}
this.getDictsTreeList()
},
//
//
[CRUD.HOOK.beforeRefresh]() {
this.tableData = []
if (this.$refs.dictDetail) {
this.$refs.dictDetail.query.pid = ''
}
return true
},
[CRUD.HOOK.afterRefresh](crud) {
crud.data.forEach(function(item, index) {
@ -241,11 +219,23 @@ export default {
item.children = null
}
})
this.tableData = this.crud.data
console.log(this.crud.selections)
const currentSelection = this.crud.selections[0]
if (currentSelection) {
if (currentSelection.hasChildren === true) {
this.crud.selectionChangeHandler([currentSelection])
} else {
this.crud.selectionChangeHandler([])
}
this.$refs.tree.setCurrentKey(currentSelection.id)
this.$refs.dictDetail.query.pid = currentSelection.id
this.$refs.dictDetail.dicPid = currentSelection.id
this.$refs.dictDetail.crud.toQuery()
this.activeAddBtn = true
}
},
//
[CRUD.HOOK.beforeToEdit](crud, form) {
crud.form.id = form.dictionaryId
},
//
[CRUD.HOOK.afterValidateCU](crud) {
@ -253,63 +243,38 @@ export default {
crud.form.dictionaryParents = null
}
delete crud.form.isTop
console.log(crud.form)
return true
},
changeIsTop(val) {
if (val === '0') {
this.getDictsTreeList()
}
},
selectAll() {
this.isAllSelect = !this.isAllSelect
const data = this.tableData
this.toggleSelect(data, this.isAllSelect, 'all')
console.log(data)
},
//
selectTr(selection, row) {
this.$set(row, 'isChecked', !row.isChecked)
this.$nextTick(() => {
this.isAllSelect = row.isChecked
this.toggleSelect(row, row.isChecked, 'tr')
})
},
//
toggleSelect(data, flag, type) {
if (type === 'all') {
if (data.length > 0) {
data.forEach((item) => {
this.toggleSelection(item, flag)
if (item.children && item.children.length > 0) {
this.toggleSelect(item.children, flag, type)
}
})
}
} else {
if (data.children && data.children.length > 0) {
data.children.forEach((item) => {
item.isChecked = flag
this.$refs.table.toggleRowSelection(item, flag)
this.toggleSelect(item, flag, type)
})
handleNodeClick(val) {
if (val) {
if (val.hasChildren === true) {
this.crud.selectionChangeHandler([val])
} else {
this.crud.selectionChangeHandler([])
}
this.$refs.dictDetail.query.pid = val.id
this.$refs.dictDetail.dicPid = val.id
this.$refs.dictDetail.crud.toQuery()
this.activeAddBtn = true
}
},
//
toggleSelection(row, flag) {
this.$set(row, 'isChecked', flag)
this.$nextTick(() => {
if (flag) {
this.$refs.table.toggleRowSelection(row, flag)
} else {
this.$refs.table.clearSelection()
updateKeyChildren(data) {
const oldDatas = this.$refs.tree.getCurrentNode().childDictionarys
if (oldDatas) {
for (let i = 0; i < data.length; i++) {
const oldData = oldDatas.find((d) => { return d.id === data[i].id })
if (oldData) {
data[i].childDictionarys = oldData.childDictionarys
}
}
})
}
this.$refs.tree.updateKeyChildren(this.$refs.tree.getCurrentKey(), data)
},
clickRowHandler(row) {
this.$refs.table.clearSelection()
this.$refs.table.toggleRowSelection(row)
changeIsTop(val) {
if (val === '0') {
this.getDictsTreeList()
}
},
getDictsDatas(tree, treeNode, resolve) {
setTimeout(() => {
@ -362,6 +327,7 @@ export default {
},
toDelete(datas) {
this.deleteData = datas
console.log('deleteData', this.deleteData)
this.$confirm('此操作将删除当前所选' + this.crud.title + '<span>你是否还要继续?</span>', '提示', {
confirmButtonText: '继续',
cancelButtonText: '取消',
@ -371,7 +337,7 @@ export default {
this.crud.delAllLoading = true
const dictionaryIds = []
this.deleteData.forEach(val => {
dictionaryIds.push(val.dictionaryId)
dictionaryIds.push(val.dictionaryId || val.id)
})
crudDict.del(dictionaryIds).then(() => {
this.$message({ message: '删除成功', type: 'success', offset: 8 })
@ -395,7 +361,7 @@ export default {
}).then(() => {
const ids = []
data.forEach(val => {
ids.push(val.dictionaryId)
ids.push(val.id)
})
const params = {
'dictionaryIds': ids

425
src/views/system/dict/index2.vue

@ -0,0 +1,425 @@
<template>
<div class="app-container row-container">
<!--工具栏-->
<div class="head-container">
<div class="head-search">
<!-- 搜索 -->
<el-input v-model="query.blurry" clearable size="small" placeholder="输入字典名称或字典代码搜索" prefix-icon="el-icon-search" style="width: 240px;" class="filter-item" @keyup.enter.native="crud.toQuery" />
<el-button class="filter-item filter-search" size="mini" type="success" icon="el-icon-search" @click="crud.toQuery">搜索</el-button>
<el-button v-if="crud.optShow.reset" class="filter-item filter-refresh" size="mini" type="warning" icon="el-icon-refresh-left" @click="resetQuery()">重置</el-button>
</div>
<crudOperation :permission="permission">
<template v-slot:middle>
<el-button slot="reference" size="mini" :loading="crud.delAllLoading" :disabled="crud.selections.length === 0" @click="toDelete(crud.selections)">
<i class="iconfont icon-shanchu" />
删除
</el-button>
</template>
<template v-slot:right>
<el-button :loading="crud.downloadLoading" size="mini" :disabled="crud.selections.length === 0" @click="doExport(crud.selections)">
<i class="iconfont icon-daochu" />
导出
</el-button>
</template>
</crudOperation>
</div>
<!--表单组件-->
<el-dialog append-to-body :close-on-click-modal="false" :before-close="crud.cancelCU" :visible="crud.status.cu > 0" :title="crud.status.title">
<div class="setting-dialog">
<el-form ref="form" inline :model="form" :rules="rules" size="small" label-width="90px">
<el-form-item label="字典名称" prop="dictionaryName">
<el-input v-model="form.dictionaryName" />
</el-form-item>
<el-form-item label="字典代码" prop="dictionaryCode">
<el-input v-model="form.dictionaryCode" />
</el-form-item>
<el-form-item label="顶级节点" prop="isTop">
<el-radio-group v-model="form.isTop" @input="changeIsTop">
<el-radio label="1"></el-radio>
<el-radio label="0"></el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="排序" prop="dictionaryOrder">
<el-input-number
v-model.number="form.dictionaryOrder"
:min="0"
:max="999"
controls-position="right"
/>
</el-form-item>
<el-row>
<el-form-item v-if="form.isTop === '0'" label="上级节点" prop="dictionaryParents">
<treeselect
v-model="form.dictionaryParents"
style="width: 584px;"
:load-options="loadDicts"
:options="dicts"
:normalizer="normalizer"
placeholder="选择上级节点"
>
<div slot="value-label" slot-scope="{ node }">{{ getAutoNameUnknown(node.label) }}</div>
</treeselect>
</el-form-item>
</el-row>
<el-form-item label="内容说明" prop="dictionaryRemarks">
<el-input v-model="form.dictionaryRemarks" type="textarea" :rows="4" style="width: 584px;" />
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="text" @click="crud.cancelCU">取消</el-button>
<el-button :loading="crud.status.cu === 2" type="primary" @click="crud.submitCU">确认</el-button>
</div>
</div>
</el-dialog>
<!-- <el-dialog title="删除字典内容" :visible.sync="deleteVisible" :before-close="handleClose">
<span class="dialog-right-top" />
<span class="dialog-left-bottom" />
<div class="setting-dialog">
<div class="dialog-delt">
<p><span>确定删除当前字典内容吗</span></p>
</div>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click.native="handleConfirm">确定</el-button>
</div>
</div>
</el-dialog> -->
<div class="container-wrap">
<span class="right-top-line" />
<span class="left-bottom-line" />
<!--表格渲染-->
<!-- @selection-change="selectionChangeHandler"
@row-click="clickRowHandler" -->
<!-- height="calc(100vh - 232px)" -->
<el-table
ref="table"
v-loading="crud.loading"
lazy
:load="getDictsDatas"
:data="tableData"
:tree-props="{children: 'children', hasChildren: 'hasChildren'}"
:row-key="getRowKey"
style="width: 100%;"
@select-all="selectAll"
@select="selectTr"
@selection-change="crud.selectionChangeHandler"
@row-click="clickRowHandler"
>
<el-table-column type="selection" align="center" width="55" />
<el-table-column prop="dictionaryName" label="字典名称" />
<el-table-column prop="dictionaryCode" label="字典代码" />
<el-table-column prop="dictionaryRemarks" label="内容说明" />
<el-table-column prop="dictionaryOrder" label="排序" />
<el-table-column prop="createTime" label="创建日期" width="200px">
<template slot-scope="scope">
<div>{{ scope.row.createTime | parseTime }}</div>
</template>
</el-table-column>
</el-table>
<!--分页组件-->
<pagination v-if="crud.data.length!==0" />
</div>
</div>
</template>
<script>
import crudDict from '@/api/system/dict'
import CRUD, { presenter, header, form } from '@crud/crud'
import crudOperation from '@crud/CRUD.operation'
import pagination from '@crud/Pagination'
import Treeselect from '@riophae/vue-treeselect'
import '@riophae/vue-treeselect/dist/vue-treeselect.css'
import { LOAD_CHILDREN_OPTIONS } from '@riophae/vue-treeselect'
import { mapGetters } from 'vuex'
import { exportFile } from '@/utils/index'
import qs from 'qs'
const defaultForm = { id: null, dictionaryName: null, isTop: '1', dictionaryCode: null, dictionaryOrder: 999, dictionaryRemarks: null, dictionaryParents: null }
export default {
name: 'Dicts',
components: { crudOperation, Treeselect, pagination },
cruds() {
return [
CRUD({
title: '字典', idField: 'dictionaryId', url: 'api/dictionary/initDictionaryList',
crudMethod: { ...crudDict },
sort: [],
optShow: {
add: true,
edit: true,
del: false,
reset: true,
download: false,
group: false
}})
]
},
mixins: [
presenter(),
header(),
form(function() {
return Object.assign({ dictionaryParents: this.dictionaryParents }, defaultForm)
})
],
props: {
activeAddBtn: {
type: Boolean
}
},
data() {
return {
dicts: [],
dictionaryParents: null,
rules: {
dictionaryName: [
{ required: true, message: '请输入字典名称', trigger: 'blur' }
],
dictionaryCode: [
{ required: true, message: '请输入字典代码', trigger: 'blur' }
],
isTop: [
{ required: true, message: '请选择是否为顶级节点', trigger: 'change' }
],
dictionaryOrder: [
{ required: true, message: '请输入序号', trigger: 'blur', type: 'number' }
]
},
permission: {
add: ['admin', 'dict:add'],
edit: ['admin', 'dict:edit'],
del: ['admin', 'dict:del']
},
deleteVisible: false,
deleteData: {},
isAllSelect: false
}
},
computed: {
...mapGetters([
'baseApi'
])
},
mounted() {
},
methods: {
// vue-treeSelectunknown
getAutoNameUnknown(name) {
if (name.lastIndexOf('unknown') > -1) {
return name.split('(')[0]
} else {
return name
}
},
getRowKey(row) {
return row.dictionaryId
},
resetQuery() {
this.crud.query.blurry = ''
this.crud.toQuery()
},
//
[CRUD.HOOK.afterToCU](crud, form) {
if (form.dictionaryParents !== null) {
form.isTop = '0'
} else if (form.dictionaryId !== null) {
form.isTop = '1'
}
this.getDictsTreeList()
},
//
[CRUD.HOOK.beforeRefresh]() {
this.tableData = []
},
[CRUD.HOOK.afterRefresh](crud) {
crud.data.forEach(function(item, index) {
if (item.sonNum !== 0) {
item.hasChildren = true
} else {
item.hasChildren = false
}
if (!item.hasChildren) {
item.children = null
}
})
this.tableData = this.crud.data
console.log('this.tableData0', this.tableData)
},
//
[CRUD.HOOK.beforeToEdit](crud, form) {
crud.form.id = form.dictionaryId
},
//
[CRUD.HOOK.afterValidateCU](crud) {
if (crud.form.isTop === '1') {
crud.form.dictionaryParents = null
}
delete crud.form.isTop
console.log(crud.form)
return true
},
changeIsTop(val) {
if (val === '0') {
this.getDictsTreeList()
}
},
selectAll() {
this.isAllSelect = !this.isAllSelect
const data = this.tableData
this.toggleSelect(data, this.isAllSelect, 'all')
console.log('selectAll', data)
},
//
selectTr(selection, row) {
this.$set(row, 'isChecked', !row.isChecked)
this.$nextTick(() => {
this.isAllSelect = row.isChecked
this.toggleSelect(row, row.isChecked, 'tr')
})
},
//
toggleSelect(data, flag, type) {
console.log('data.children', data.children)
if (type === 'all') {
if (data.length > 0) {
data.forEach((item) => {
this.toggleSelection(item, flag)
if (item.children && item.children.length > 0) {
this.toggleSelect(item.children, flag, type)
}
})
}
} else {
if (data.children && data.children.length > 0) {
data.children.forEach((item) => {
item.isChecked = flag
this.$refs.table.toggleRowSelection(item, flag)
this.toggleSelect(item, flag, type)
})
}
}
},
//
toggleSelection(row, flag) {
this.$set(row, 'isChecked', flag)
this.$nextTick(() => {
if (flag) {
this.$refs.table.toggleRowSelection(row, flag)
} else {
this.$refs.table.clearSelection()
}
})
},
clickRowHandler(row) {
this.$refs.table.clearSelection()
this.$refs.table.toggleRowSelection(row)
},
getDictsDatas(tree, treeNode, resolve) {
setTimeout(() => {
console.log(treeNode)
crudDict.FetchSonDictionaryList({ pid: tree.dictionaryId }).then(res => {
const data = res.map(function(obj) {
if (obj.sonNum !== 0) {
obj.hasChildren = true
obj.children = null
} else {
obj.hasChildren = false
}
return obj
})
resolve(data)
})
}, 100)
},
getDictsTreeList() {
crudDict.FetchDictionaryTree().then(res => {
this.dicts = res.map(function(obj) {
if (obj.sonNum !== 0) {
obj.hasChildren = true
} else {
obj.hasChildren = false
}
if (obj.hasChildren) {
obj.children = null
}
return obj
})
this.crud.loading = false
})
},
//
loadDicts({ action, parentNode, callback }) {
if (action === LOAD_CHILDREN_OPTIONS) {
crudDict.FetchDictionaryTree().then(res => {
parentNode.children = res.map(function(obj) {
if (obj.children) {
obj.childMenus = null
}
return obj
})
setTimeout(() => {
callback()
}, 100)
})
}
},
toDelete(datas) {
this.deleteData = datas
this.$confirm('此操作将删除当前所选' + this.crud.title + '<span>你是否还要继续?</span>', '提示', {
confirmButtonText: '继续',
cancelButtonText: '取消',
type: 'warning',
dangerouslyUseHTMLString: true
}).then(() => {
this.crud.delAllLoading = true
const dictionaryIds = []
this.deleteData.forEach(val => {
dictionaryIds.push(val.dictionaryId)
})
crudDict.del(dictionaryIds).then(() => {
this.$message({ message: '删除成功', type: 'success', offset: 8 })
this.crud.delAllLoading = false
this.crud.refresh()
}).catch(err => {
this.crud.delAllLoading = false
console.log(err)
})
}).catch(() => {
})
},
doExport(data) {
console.log(data)
this.crud.downloadLoading = true
this.$confirm('此操作将导出所选数据' + '<span>你是否还要继续?</span>', '提示', {
confirmButtonText: '继续',
cancelButtonText: '取消',
type: 'warning',
dangerouslyUseHTMLString: true
}).then(() => {
const ids = []
data.forEach(val => {
ids.push(val.dictionaryId)
})
const params = {
'dictionaryIds': ids
}
exportFile(this.baseApi + '/api/dictionary/download?' + qs.stringify(params, { indices: false }))
this.crud.downloadLoading = false
}).catch(() => {
})
},
normalizer(node) {
if (node.childDictionarys == null || node.childDictionarys === 'null') {
delete node.childDictionarys
}
return {
id: node.id,
label: node.dictionaryName,
children: node.childDictionarys
}
}
}
}
</script>
<style lang="scss" scoped>
</style>

13
src/views/system/log/operateLog/index.vue

@ -86,11 +86,14 @@ export default {
}
},
mounted() {
if (this.isCenter) {
this.heightStyle = 'calc(100vh - 470px)'
} else {
this.heightStyle = 'calc(100vh - 396px)'
}
this.$nextTick(() => {
console.log(this.isCenter)
if (this.isCenter) {
this.heightStyle = 'calc(100vh - 470px)'
} else {
this.heightStyle = 'calc(100vh - 396px)'
}
})
},
methods: {
clickRowHandler(row) {

7
src/views/system/notifyManage/index.vue

@ -32,9 +32,9 @@
@row-dblclick="handleDbClick"
>
<el-table-column type="index" label="序号" width="55" align="center" />
<el-table-column prop="noticaType" label="消息类型" align="center" min-width="100">
<el-table-column prop="noticeType" label="消息类型" align="center" min-width="100">
<template slot-scope="scope">
<span v-if="scope.row.noticaType === 0">系统消息</span>
<span v-if="scope.row.noticeType === 1">系统消息</span>
</template>
</el-table-column>
<el-table-column prop="noticeTitle" :show-overflow-tooltip="true" label="标题" min-width="150" align="center" />
@ -168,6 +168,7 @@ export default {
},
methods: {
[CRUD.HOOK.beforeRefresh]() {
this.crud.query.noticeType = 1
if (this.blurryTime) {
this.crud.query.startTime = this.blurryTime[0]
this.crud.query.endTime = this.blurryTime[1]
@ -203,7 +204,7 @@ export default {
//
[CRUD.HOOK.afterValidateCU](crud) {
console.log(crud.form)
crud.form.noticeType = 0
crud.form.noticeType = 1
delete crud.form.noticeTypeName
return true
},

23
src/views/system/notifyManage/module/detail.vue

@ -60,29 +60,6 @@ export default {
.dialog-footer, .el-message-box__btns{
margin-top: 20px;
}
.message-type-title{
display: block;
padding-left: 33px;
height: 33px;
line-height: 33px;
margin-bottom: 15px;
&.type-title1{
background: url('~@/assets/images/icon/xttz.png') no-repeat left center;
background-size: 23px 23px;
}
&.type-title2{
background: url('~@/assets/images/icon/lcdd.png') no-repeat left center;
background-size: 23px 23px;
}
&.type-title3{
background: url('~@/assets/images/icon/lcwc.png') no-repeat left center;
background-size: 23px 23px;
}
&.type-title4{
background: url('~@/assets/images/icon/fqdq.png') no-repeat left center;
background-size: 23px 23px;
}
}
.notify-item{
margin-bottom: 10px;

22
src/views/system/processManage/runningProcess/module/detail.vue

@ -2,18 +2,19 @@
<el-dialog class="detail-dialog" :visible.sync="detailVisible" :close-on-click-modal="false" :modal-append-to-body="false" append-to-body title="流程详情">
<div class="setting-dialog">
<ul class="detail-info">
<li><span>流程名称</span>{{ selectRow.flowableName || selectRow.title }}</li>
<li><span>流程名称</span>{{ baseInfo && baseInfo.title || selectRow.flowableName || selectRow.title }}</li>
<li v-if="!isCenterProcess"><span>流程结果</span><p :class="['row-state', !isHistroy?'ing-state':(selectRow.endTime?'end-state':'cancel-state')]">{{ !isHistroy ? '进行中' : ( selectRow.endTime ? '已完成' : '已取消') }}</p></li>
<li v-if="isCenterProcess">
<span>流程结果</span>
<p v-if="selectRow.status === 1" class="row-state ing-state">运行中</p>
<p v-if="selectRow.status === 2" class="row-state case-cancel">已取消</p>
<p v-if="selectRow.status === 3" class="row-state end-state">已完成</p>
<p v-if="selectRow.status === 4" class="row-state cancel-state">不通过</p>
<p v-if="baseInfo && baseInfo.status === 1 || selectRow.status === 1" class="row-state ing-state">运行中</p>
<p v-if="baseInfo && baseInfo.status === 2 || selectRow.status === 2" class="row-state case-cancel">已取消</p>
<p v-if="baseInfo && baseInfo.status === 3 || selectRow.status === 3" class="row-state end-state">已完成</p>
<p v-if="baseInfo && baseInfo.status === 4 || selectRow.status === 4" class="row-state cancel-state">不通过</p>
</li>
<!-- 等门类树更改之后再显示 -->
<!-- <li><span>所属全宗</span>全宗A</li> -->
<li v-if="selectRow.endTime || selectRow.complete_time"><span>结束时间</span>{{ (selectRow.endTime || selectRow.complete_time) | parseTime }}</li>
<!-- <li v-else-if="baseInfo && baseInfo.updateTime"><span>结束时间</span>{{ baseInfo && baseInfo.updateTime }}</li> -->
<li v-else><span>结束时间</span>-</li>
</ul>
<!-- 1.归档 index=1 2.退回 index=2 3.开放 index=6 4.销毁index=7 5.利用index=3 6.内部移交index=4 7.外部移交index=5 -->
@ -97,9 +98,11 @@ export default {
data() {
return {
detailVisible: false,
baseInfo: null,
isExpend: false,
activeIndex: 0,
selectRow: {},
selectCenterRow: null,
srcImg: '',
taskTableList: [],
tableData: [],
@ -108,7 +111,8 @@ export default {
total: 0,
size: 10,
page: 0
}
},
isMessage: false
}
},
computed: {
@ -140,7 +144,7 @@ export default {
},
getBusinessFlowDetails() {
const params = {
'businessId': (this.selectRow && this.selectRow.businessId) ? this.selectRow.businessId : this.selectRow.id,
'businessId': this.isMessage ? this.selectCenterRow.businessId : this.selectRow.id,
'page': this.setPage.page,
'size': this.setPage.size
}
@ -170,7 +174,7 @@ export default {
},
getProcessImg() {
this.srcImg = ''
FetchGenProcessDiagram({ 'processId': this.selectRow.procInstId }).then((res) => {
FetchGenProcessDiagram({ 'processId': this.isMessage ? this.baseInfo.procInstId : this.selectRow.procInstId }).then((res) => {
this.srcImg = res
}).catch(err => {
console.log(err)
@ -178,7 +182,7 @@ export default {
},
getTaskByProcinstId() {
this.taskTableList = []
FetchTaskByProcinstId({ 'procinstId': this.selectRow.procInstId }).then((res) => {
FetchTaskByProcinstId({ 'procinstId': this.isMessage ? this.baseInfo.procInstId : this.selectRow.procInstId }).then((res) => {
this.taskTableList = res
}).catch(err => {
console.log(err)

2
src/views/system/user/cart.vue

@ -76,6 +76,7 @@ import LendForm from '@/views/archiveUtilize/utillizeRecord/module/utilizationPr
import ArchivesInfo from '@/views/components/archivesDetail/detail'
import { FetchDelBorrowCar } from '@/api/archiveUtilize/cart'
import { mapGetters } from 'vuex'
import store from '@/store'
export default {
name: 'Cart',
components: { pagination, crudOperation, LendForm, ArchivesInfo },
@ -160,6 +161,7 @@ export default {
if (res) {
this.$message({ message: '删除成功', type: 'success', offset: 8 })
this.crud.refresh()
store.dispatch('initborrowCar').then(() => {})
} else {
this.crud.notify(res.message, CRUD.NOTIFICATION_TYPE.ERROR)
}

4
src/views/system/user/center.vue

@ -120,6 +120,7 @@ export default {
}
}
return {
isCenter: true,
defaultImg: 'this.src="' + require('@/assets/images/avatar.png') + '"',
show: false,
Avatar: Avatar,
@ -144,8 +145,7 @@ export default {
gender: [
{ required: true, message: '请选择性别', trigger: 'change' }
]
},
isCenter: true
}
}
},
computed: {

139
src/views/system/user/messageCenter/index.vue

@ -1,10 +1,10 @@
<template>
<div class="process-center">
<ul class="process-left">
<li :class="{'active-li': listIndex == 0}" @click="handleClick(0)">系统通知</li>
<li :class="{'active-li': listIndex == 1}" @click="handleClick(1)">档案流程管理</li>
<li :class="{'active-li': listIndex == 2}" @click="handleClick(2)">流程完成提醒</li>
<li :class="{'active-li': listIndex == 3}" @click="handleClick(3)">赋权提醒</li>
<li :class="{'active-li': listIndex == 1}" @click="handleClick(1)">系统通知</li>
<li :class="{'active-li': listIndex == 2}" @click="handleClick(2)">档案流程管理</li>
<li :class="{'active-li': listIndex == 3}" @click="handleClick(3)">流程完成提醒</li>
<li :class="{'active-li': listIndex == 4}" @click="handleClick(4)">赋权提醒</li>
</ul>
<div class="process-right">
<div class="head-container">
@ -26,7 +26,7 @@
<div class="message-date">{{ item.createTime | parseTime }}</div>
<div class="message-cont">
<div class="message-cont-info">
<span :class="['message-type-title',{'type-title1': listIndex === 0 },{'type-title2': listIndex === 1 },{'type-title3': listIndex === 2 },{'type-title4': listIndex === 3 }]">{{ titleType }}</span>
<span :class="['message-type-title',{'type-title1': listIndex === 1 },{'type-title2': listIndex === 2 },{'type-title3': listIndex === 3 },{'type-title4': listIndex === 4 }]">{{ titleType }}</span>
<span :class="[ item.isRead === 0 ? 'unread-tip' : 'unread-tip read-tip']">{{ item.isRead === 0 ? '未读' : '已读' }}</span>
<div class="message-title">{{ item.noticeTitle }}</div>
<ul class="message-list-info">
@ -42,22 +42,24 @@
<div v-else-if="!hasNextPage && loading === false" class="more-btn no-data">暂无更多数据</div>
<div v-else class="more-btn"><i class="iconfont icon-jiazaigengduo" />加载中...</div>
<!-- 消息详情 -->
<el-dialog :visible.sync="messageVisible" :modal-append-to-body="false" :close-on-click-modal="false" append-to-body title="消息详情" @closed="closeDialog">
<div class="setting-dialog">
<div class="message-detail">
<span :class="['message-type-title',{'type-title1': listIndex === 0 },{'type-title2': listIndex === 1 },{'type-title3': listIndex === 2 },{'type-title4': listIndex === 3 }]">{{ titleType }}</span>
<span class="detail-date">{{ detailInfo && detailInfo.create_by }} {{ detailInfo && detailInfo.create_time | parseTime }}</span>
<span :class="['message-type-title',{'type-title1': listIndex === 1 },{'type-title2': listIndex === 2 },{'type-title3': listIndex === 3 },{'type-title4': listIndex === 4 }]">{{ titleType }}</span>
<span class="detail-date">{{ detailInfo && detailInfo.createBy }} {{ detailInfo && detailInfo.createTime | parseTime }}</span>
<div class="message-title">{{ detailInfo && detailInfo.noticeTitle }}</div>
<el-input v-model="detailInfo.noticeContext" placeholder="请输入" type="textarea" :rows="10" />
</div>
<div slot="footer" class="dialog-footer">
<el-button v-if="detailInfo.noticeType === 1" @click="dealWithCont">流程处理</el-button>
<el-button type="primary" @click="closeDialog">确定</el-button>
<el-button v-if="detailInfo.noticeType === 2" @click="dealWithCont(detailInfo)">流程处理</el-button>
<!-- <el-button @click="viewDetialClick(detailInfo)">流程详情</el-button> -->
<el-button v-if="detailInfo.noticeType !== 1" type="primary" @click="viewDetialClick(detailInfo)">流程详情</el-button>
</div>
</div>
</el-dialog>
<detail ref="detail" />
<eForm ref="eForm" />
<detial ref="processDetail" :is-center-process="true" />
</div>
</div>
@ -67,12 +69,13 @@
<script>
import DateRangePicker from '@/components/DateRangePicker'
import { FetchMySystemNotice, FetchInitNoticeDetails, FetchReadedAll } from '@/api/system/new'
import detail from '../processCenter/module/form'
import eForm from '../processCenter/module/form'
import detial from '@/views/system/processManage/runningProcess/module/detail'
import store from '@/store'
export default {
name: 'MessageCenter',
inject: ['reload'],
components: { DateRangePicker, detail },
components: { DateRangePicker, eForm, detial },
data() {
return {
blurryTime: [],
@ -85,7 +88,7 @@ export default {
value: null,
label: '全部'
}],
listIndex: 0,
listIndex: 1,
titleType: '系统通知',
items: [],
page: {
@ -102,18 +105,28 @@ export default {
hasNextPage: false
}
},
watch: {
'$route'(val, from) { //
if (this.$route.query) {
this.listIndex = this.$route.query.noticeType ? this.$route.query.noticeType : 1
this.getIndex()
}
}
},
created() {
if (this.$route.query) {
this.listIndex = this.$route.query.noticeType ? this.$route.query.noticeType : 1
this.getIndex()
}
this.getListMessage()
},
methods: {
handleClick(index) {
this.listIndex = index
if (index === 0) {
this.blurryTime = []
this.search = null
this.unread = null
this.getListMessage()
}
this.blurryTime = []
this.search = null
this.unread = null
this.handleSearch()
this.getIndex()
},
handleSearch() {
@ -128,28 +141,22 @@ export default {
'search': this.search,
'page': this.page.page,
'size': this.page.size,
'noticeType': this.listIndex,
'unread': this.unread,
'startTime': this.blurryTime && this.blurryTime[0],
'endTime': this.blurryTime && this.blurryTime[1]
}
FetchMySystemNotice(params).then(res => {
const listData = res.content
if (listData.length === 0) {
if (listData.length === 0 || listData.length === res.totalElements) {
this.hasNextPage = false
} else {
this.hasNextPage = true
}
this.page.total = res.totalElements
this.page.totalPages = res.totalPages
// this.items = [...listData, ...this.items]
this.items = this.items.concat(listData)
console.log('this.page.page', this.page.page)
console.log('this.page.totalPages', this.page.totalPages - 1)
console.log('this.page.total', this.page.total)
console.log('this.items', this.items.length)
setTimeout(() => {
this.loading = false
}, 1000)
@ -188,43 +195,66 @@ export default {
},
handleDetail(item) {
this.currentMessage = this.items.find(i => i.noticeId === item.noticeId)
// this.detailInfo = item
// this.messageVisible = true
const params = {
'newsType': item.noticeType,
'noticeId': item.noticeId
}
FetchInitNoticeDetails(params).then((res) => {
this.detailInfo = res
this.detailInfo = item
this.messageVisible = true
}).catch(err => {
console.log(err)
})
},
dealWithCont(row) {
this.$refs.eForm.isMessage = true
this.$refs.eForm.formVisible = true
this.$refs.eForm.selectCenterRow = row
this.$refs.eForm.activeIndex = 0
this.$refs.eForm.form.opinion = null
this.$refs.eForm.setPage.page = 0
this.$refs.eForm.getBusinessFlowDetails()
},
//
viewDetialClick(row) {
this.$refs.processDetail.isMessage = true
this.$refs.processDetail.detailVisible = true
this.$refs.processDetail.selectCenterRow = row
this.$refs.processDetail.activeIndex = 0
this.$refs.processDetail.setPage.page = 0
this.$refs.processDetail.getBusinessFlowDetails()
},
closeDialog() {
this.messageVisible = false
this.currentMessage.isRead = 1
store.dispatch('initMySystemNotice').then(() => {})
},
getIndex() {
switch (this.listIndex) {
case 0:
case 1:
this.titleType = '系统通知'
this.opinionTxt = '这是一条系统通知'
break
case 1:
case 2:
this.titleType = '有流程达到'
this.opinionTxt = '这是一条有流程达到提醒'
break
case 2:
case 3:
this.titleType = '流程完成提醒'
this.opinionTxt = '这是一条流程完成提醒'
break
case 3:
case 4:
this.titleType = '赋权到期提醒'
this.opinionTxt = '这是一条赋权到期提醒'
break
}
},
//
async handleAllRead() {
// const arr = this.items.filter(item => { return !item.isRead })
// console.log('arr', arr)
// arr.forEach(item => {
// item.isRead = 1
// })
// this.handleSearch()
// const params = {
// page: 0,
// size: 10,
@ -233,15 +263,15 @@ export default {
// const list = []
// const allList = await this.getAllNoRead(params, list)
const params = {
'newsType': 1
'newsType': this.listIndex
}
FetchReadedAll(params).then(res => {
console.log(res)
if (res) {
this.items.forEach(item => {
item.isRead = 1
})
// this.getListMessage()
this.handleSearch()
store.dispatch('initMySystemNotice').then(() => {})
}
})
},
@ -371,28 +401,6 @@ export default {
}
}
}
.message-type-title{
display: block;
padding-left: 33px;
height: 33px;
line-height: 33px;
&.type-title1{
background: url('~@/assets/images/icon/xttz.png') no-repeat left center;
background-size: 23px 23px;
}
&.type-title2{
background: url('~@/assets/images/icon/lcdd.png') no-repeat left center;
background-size: 23px 23px;
}
&.type-title3{
background: url('~@/assets/images/icon/lcwc.png') no-repeat left center;
background-size: 23px 23px;
}
&.type-title4{
background: url('~@/assets/images/icon/fqdq.png') no-repeat left center;
background-size: 23px 23px;
}
}
.message-title{
margin: 8px 0 20px 0;
font-weight: 400;
@ -412,4 +420,9 @@ export default {
margin: 10px 0 20px 0;
}
}
::v-deep .el-dialog{
.el-dialog__body{
padding: 10px 0 30px 0;
}
}
</style>

301
src/views/system/user/messageCenter/module/list.vue

@ -1,301 +0,0 @@
<template>
<div class="message-center-list">
<div v-if="hasMore" class="more-btn" @click="loadMore"><i class="iconfont icon-jiazaigengduo" />点击加载更多</div>
<div v-for="(item,index) in items" :key="index" class="message-item" @click="handleDetail(item)">
<div class="message-date">{{ item.createTime | parseTime }}</div>
<div class="message-cont">
<div class="message-cont-info">
<span :class="['message-type-title',{'type-title1': isIndex === 0 },{'type-title2': isIndex === 1 },{'type-title3': isIndex === 2 },{'type-title4': isIndex === 3 }]">{{ titleType }}</span>
<span class="is-read-tip">{{ item.isRead === 0 ? '未读' : '已读' }}</span>
<div class="message-title">{{ item.noticeTitle }}</div>
<ul class="message-list-info">
<li>创建人{{ item.createBy }}</li>
<li>创建时间{{ item.createTime | parseTime }}</li>
</ul>
</div>
<div class="message-more">查看详情<i class="iconfont icon-chakan" /></div>
</div>
</div>
<el-dialog :visible.sync="messageVisible" :modal-append-to-body="false" :close-on-click-modal="false" append-to-body title="消息详情">
<div class="setting-dialog">
<div class="message-detail">
<span :class="['message-type-title',{'type-title1': isIndex === 0 },{'type-title2': isIndex === 1 },{'type-title3': isIndex === 2 },{'type-title4': isIndex === 3 }]">{{ titleType }}</span>
<span class="detail-date">{{ detailInfo && detailInfo.create_by }} {{ detailInfo && detailInfo.create_time | parseTime }}</span>
<div class="message-title">{{ detailInfo && detailInfo.noticeTitle }}</div>
<el-input v-model="detailInfo.noticeContext" placeholder="请输入" type="textarea" :rows="10" />
</div>
<div slot="footer" class="dialog-footer">
<el-button v-if="detailInfo.noticeType === 1" @click="dealWithCont">流程处理</el-button>
<el-button type="primary" @click="messageVisible=false">确定</el-button>
</div>
</div>
</el-dialog>
<detail ref="detail" />
</div>
</template>
<script>
import { FetchInitNoticeDetails } from '@/api/system/new'
import detail from '../../processCenter/module/form'
export default {
name: 'MessageList',
components: { detail },
props: {
listIndex: {
type: Number,
default: 0
},
items: {
type: Array,
default: function() {
return []
}
}
},
data() {
return {
isIndex: 0,
titleType: '系统通知',
messageVisible: false,
opinionTxt: '',
loading: false, //
hasMore: true, //
currentPage: 1,
pageSize: 10,
detailInfo: {}
}
},
watch: {
listIndex: function(newValue, oldValue) {
this.isIndex = newValue
this.getIndex()
}
},
created() {
// this.loadData()
},
mounted() {
},
methods: {
//
loadData() {
this.loading = true
setTimeout(() => {
const newData = Array.from(Array(this.pageSize), (_, index) => {
const key = (this.currentPage - 1) * this.pageSize + index
return {
key,
name: `这是消息标题${key}`,
age: 18 + key
}
})
this.items = [...newData, ...this.items]
console.log(this.items)
this.currentPage++
this.loading = false
if (this.currentPage > 2) {
this.hasMore = false
}
}, 1000)
},
loadMore() {
if (this.loading) {
return
}
this.loadData()
},
getIndex() {
switch (this.isIndex) {
case 0:
this.titleType = '系统通知'
this.opinionTxt = '这是一条系统通知'
break
case 1:
this.titleType = '有流程达到'
this.opinionTxt = '这是一条有流程达到提醒'
break
case 2:
this.titleType = '流程完成提醒'
this.opinionTxt = '这是一条流程完成提醒'
break
case 3:
this.titleType = '赋权到期提醒'
this.opinionTxt = '这是一条赋权到期提醒'
break
}
},
handleDetail(item) {
switch (item.noticaType) {
case 0:
this.opinionTxt = '这是一条系统通知'
break
case 1:
this.opinionTxt = '这是一条有流程达到提醒'
break
case 2:
this.opinionTxt = '这是一条流程完成提醒'
break
case 3:
this.opinionTxt = '这是一条赋权到期提醒'
break
}
FetchInitNoticeDetails({ 'noticeId': item.noticeId }).then((res) => {
console.log(res)
this.detailInfo = res
this.messageVisible = true
}).catch(err => {
console.log(err)
})
},
dealWithCont() {
this.$refs.detail.detailVisible = true
}
}
}
</script>
<style lang='scss' scoped>
[data-theme=dark] .message-center-list{
background-color: transparent;
.more-btn{
color: #339cff;
}
.message-item{
.message-cont{
background-color: #02255f;
.message-cont-info{
color: #fff;
.is-read-tip{
color: #1890ff;
border: 1px solid #339cff;
background-color: #02255f;
}
}
.message-more{
color: #3a99fd;
border-top: 1px solid #113d72;
i{
color: #3a99fd;
}
}
}
}
.message-title{
font-weight: 600;
color: #3a99fd;
}
}
.message-center-list{
height: calc(100% - 90px);
padding: 16px 30px;
margin-bottom: 20px;
background-color: #F5F5F5;
overflow: hidden;
overflow-y: scroll;
.more-btn{
margin-bottom: 30px;
line-height: 30px;
font-size: 14px;
text-align: center;
color: #0348F3;
cursor: pointer;
i{
display: inline-block;
}
}
.message-item{
font-size: 14px;
.message-date{
text-align: center;
color: #A6ADB6;
}
.message-cont{
margin: 12px 0 16px 0;
background-color: #fff;
.message-cont-info{
position: relative;
padding: 16px 20px;
color: #545B65;
.is-read-tip{
position: absolute;
right: 20px;
top: 16px;
font-size: 12px;
height: 20px;
line-height: 20px;
padding: 0 7px;
color: #ED4A41;
background-color: #FDEFEE;
border-radius: 3px;
}
.message-list-info{
font-size: 12px;
line-height: 24px;
}
}
.message-more{
position: relative;
padding: 0 20px;
height: 40px;
line-height: 40px;
color: #545B65;
border-top: 1px solid #E6E8ED;
cursor: pointer;
i{
position: absolute;
right: 10px;
top: 0;
font-size: 12px;
color: #888D94;
}
}
}
}
}
.message-type-title{
display: block;
padding-left: 33px;
height: 33px;
line-height: 33px;
&.type-title1{
background: url('~@/assets/images/icon/xttz.png') no-repeat left center;
background-size: 23px 23px;
}
&.type-title2{
background: url('~@/assets/images/icon/lcdd.png') no-repeat left center;
background-size: 23px 23px;
}
&.type-title3{
background: url('~@/assets/images/icon/lcwc.png') no-repeat left center;
background-size: 23px 23px;
}
&.type-title4{
background: url('~@/assets/images/icon/fqdq.png') no-repeat left center;
background-size: 23px 23px;
}
}
.message-title{
margin: 8px 0 20px 0;
font-weight: 400;
color: #0C0E1E;
}
.message-detail{
position: relative;
.detail-date{
position: absolute;
right: 0;
top: 0;
font-size: 12px;
line-height: 32px;
color: #A6ADB6;
}
.message-title{
margin: 10px 0 20px 0;
}
}
</style>

26
src/views/system/user/processCenter/module/form.vue

@ -10,10 +10,10 @@
</div>
<div v-if="activeIndex == 0">
<div class="detail-info">
<p style="width: 60%;"><span>流程名称</span>{{ selectRow && selectRow.title }}</p>
<p><span>启动时间</span>{{ selectRow && selectRow.createTime | parseTime }}</p>
<p style="width: 60%;"><span>实例ID</span>{{ selectRow && selectRow.procInstId }}</p>
<p><span>发起人</span>{{ selectRow && selectRow.createBy }}</p>
<p style="width: 60%;"><span>流程名称</span>{{ baseInfo && baseInfo.title }}</p>
<p><span>启动时间</span>{{ baseInfo && baseInfo.createTime | parseTime }}</p>
<p style="width: 60%;"><span>实例ID</span>{{ baseInfo && baseInfo.procInstId }}</p>
<p><span>发起人</span>{{ baseInfo && baseInfo.createBy }}</p>
</div>
<!-- 1.归档 index=1 2.退回 index=2 3.开放 index=6 4.销毁index=7 5.利用index=3 6.内部移交index=4 7.外部移交index=5 -->
<div class="detail-list">
@ -58,7 +58,8 @@
<script>
import { FetchBecomeDocumentConfirm } from '@/api/collect/collect'
import { FetchGenProcessDiagram } from '@/api/system/flowable'
import { FetchBusinessFlowDetails, FetchUtilizeConfirm, FetchArchivesReturnConfirm, FetchArchivesOpenConfirm, FetchArchivesDestructionConfirm, FetchTransferConfirm, FetchOfflineTransferConfirm } from '@/api/archivesManage/library'
// FetchBusinessFlowDetails,
import { FetchHandBusinessFlowDetails, FetchUtilizeConfirm, FetchArchivesReturnConfirm, FetchArchivesOpenConfirm, FetchArchivesDestructionConfirm, FetchTransferConfirm, FetchOfflineTransferConfirm } from '@/api/archivesManage/library'
import businessDetails from '@/views/system/processManage/runningProcess/module/businessDetails/index.vue'
export default {
name: 'Form',
@ -73,6 +74,7 @@ export default {
opinion: null
},
selectRow: null,
selectCenterRow: null,
srcImg: '',
defaultImg: 'this.src="' + require('@/assets/images/system/default-img.jpg') + '"',
tableData: [],
@ -83,7 +85,8 @@ export default {
total: 0,
size: 10,
page: 0
}
},
isMessage: false
}
},
computed: {
@ -122,7 +125,7 @@ export default {
},
getProcessImg() {
this.srcImg = ''
FetchGenProcessDiagram({ 'processId': this.selectRow.procInstId }).then((res) => {
FetchGenProcessDiagram({ 'processId': this.isMessage ? (this.baseInfo && this.baseInfo.procInstId) : this.selectRow.procInstId }).then((res) => {
this.srcImg = res
}).catch(err => {
console.log(err)
@ -135,14 +138,17 @@ export default {
this.$set(this.selectedValues, id, value)
},
getBusinessFlowDetails() {
this.tableData = []
this.selectedValues = {}
const params = {
'businessId': this.selectRow.id,
'businessId': this.isMessage ? this.selectCenterRow.businessId : this.selectRow.id,
'page': this.setPage.page,
'size': this.setPage.size
}
FetchBusinessFlowDetails(params).then((res) => {
FetchHandBusinessFlowDetails(params).then((res) => {
if (res.code !== 500) {
this.baseInfo = res.businessFlow
this.selectRow = res.businessFlow
if (this.selectRow.businessType === 5) {
this.isUtilize = true
res.details.content.forEach(item => {
@ -181,6 +187,7 @@ export default {
this.getBusinessFlowDetails()
},
submitOpinion(type) {
console.log('selectRow', this.selectRow)
this.$refs['form'].validate((valid) => {
if (valid) {
if (this.selectRow.businessType === 5) {
@ -296,6 +303,7 @@ export default {
closedDialog() {
this.formVisible = false
this.form.opinion = null
this.$emit('refresh')
}
}

Loading…
Cancel
Save