页面优化
This commit is contained in:
aoli.qu
parent
a6c33e5f86
commit
bbd792522e
|
|
@ -22,13 +22,13 @@
|
|||
</div>
|
||||
</a-card>
|
||||
|
||||
<a-card v-if="hasPerm('notice:edit')" >
|
||||
<a-card v-if="hasPerm('notice:edit')" style="margin-top: 30px;">
|
||||
<a-tabs default-active-key="1" @change="tabsCallback">
|
||||
<a-tab-pane key="1" tab="已读人员">
|
||||
<s-table
|
||||
ref="table"
|
||||
:columns="columns"
|
||||
:data="loadData"
|
||||
ref="table1"
|
||||
:columns="columns1"
|
||||
:data="loadData1"
|
||||
:rowKey="(record) => record.id"
|
||||
:pagination="{ pageSize: 5 }"
|
||||
:showSizeChanger="false"
|
||||
|
|
@ -36,13 +36,14 @@
|
|||
<template slot="readTime" slot-scope="text, record">
|
||||
{{ record.readTime | moment('YYYY-MM-DD HH:mm:ss') }}
|
||||
</template>
|
||||
|
||||
</s-table>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="1" tab="未读人员" >
|
||||
<a-tab-pane key="2" tab="未读人员" >
|
||||
<s-table
|
||||
ref="table"
|
||||
:columns="columns"
|
||||
:data="loadData"
|
||||
ref="table2"
|
||||
:columns="columns2"
|
||||
:data="loadData2"
|
||||
:rowKey="(record) => record.id"
|
||||
:pagination="{ pageSize: 5 }"
|
||||
:showSizeChanger="false"
|
||||
|
|
@ -59,40 +60,59 @@
|
|||
</template>
|
||||
|
||||
<script>
|
||||
import { noticeGet, noticePagePerson } from '@/api/notice/notice'
|
||||
import { STable } from '@/components'
|
||||
import { noticeGet, noticePagePerson, noticeRead } from '@/api/notice/notice'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
STable
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
model: {},
|
||||
queryParam: { noticeId: this.$route.query.id, isRead: 1 },
|
||||
readCount: 0,
|
||||
unreadCount: 0,
|
||||
// 表头
|
||||
columns: [
|
||||
columns1: [
|
||||
{
|
||||
title: '公告标题',
|
||||
dataIndex: 'title'
|
||||
title: '人员名称',
|
||||
dataIndex: 'personName'
|
||||
},
|
||||
{
|
||||
title: '发布单位/人',
|
||||
dataIndex: 'createOrgName'
|
||||
title: '组织名称',
|
||||
dataIndex: 'orgName'
|
||||
},
|
||||
{
|
||||
title: '发布时间',
|
||||
title: '阅览时间',
|
||||
width: 200,
|
||||
dataIndex: 'readTime',
|
||||
key: 'readTime',
|
||||
scopedSlots: { customRender: 'readTime' }
|
||||
}
|
||||
],
|
||||
columns2: [
|
||||
{
|
||||
title: '人员名称',
|
||||
dataIndex: 'personName'
|
||||
},
|
||||
{
|
||||
title: '菜单类型',
|
||||
dataIndex: 'type',
|
||||
scopedSlots: { customRender: 'type' }
|
||||
title: '组织名称',
|
||||
dataIndex: 'orgName'
|
||||
}
|
||||
],
|
||||
// 加载数据方法 必须为 Promise 对象
|
||||
loadData: parameter => {
|
||||
return noticePagePerson(Object.assign(parameter, this.queryParam)).then((res) => {
|
||||
loadData1: parameter => {
|
||||
return noticePagePerson(Object.assign(parameter, { noticeId: this.$route.query.id, isRead: 1 })).then((res) => {
|
||||
console.log(res)
|
||||
this.readCount = res.total
|
||||
return res
|
||||
})
|
||||
},
|
||||
loadData2: parameter => {
|
||||
return noticePagePerson(Object.assign(parameter, { noticeId: this.$route.query.id, isRead: 0 })).then((res) => {
|
||||
console.log(res)
|
||||
this.unreadCount = res.total
|
||||
return res
|
||||
})
|
||||
}
|
||||
|
|
@ -100,8 +120,13 @@ export default {
|
|||
},
|
||||
created () {
|
||||
const noticeId = this.$route.query.id
|
||||
console.log(noticeId)
|
||||
this.getDetail(noticeId)
|
||||
const type = this.$route.query.type
|
||||
console.log(type)
|
||||
// 查看类型是“我接收的”
|
||||
if (type == 2) {
|
||||
this.readNotice(noticeId)
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 返回 按钮
|
||||
|
|
@ -113,14 +138,22 @@ export default {
|
|||
this.model = res.data
|
||||
})
|
||||
},
|
||||
readNotice (id) {
|
||||
console.log('-------------read')
|
||||
console.log(id)
|
||||
noticeRead({ id: id }).then(res => {
|
||||
//
|
||||
console.log(res)
|
||||
})
|
||||
},
|
||||
tabsCallback (key) {
|
||||
if (key === '1') {
|
||||
this.queryParam.isRead = 1
|
||||
this.$refs.table.refresh(true)
|
||||
this.$refs.table1.refresh(true)
|
||||
}
|
||||
if (key === '2') {
|
||||
this.queryParam.isRead = 0
|
||||
this.$refs.table.refresh(true)
|
||||
this.$refs.table2.refresh(true)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -16,7 +16,7 @@
|
|||
</a-form>
|
||||
</div>
|
||||
<s-table
|
||||
ref="table"
|
||||
ref="table2"
|
||||
:columns="columns"
|
||||
:data="loadData"
|
||||
:rowKey="(record) => record.id"
|
||||
|
|
@ -28,7 +28,7 @@
|
|||
{{ record.publishTime | moment('YYYY-MM-DD HH:mm:ss') }}
|
||||
</template>
|
||||
<span slot="action" slot-scope="text, record">
|
||||
<a v-if="hasPerm('notice:list')" @click="showGetPage(record.id)">查看</a>
|
||||
<a v-if="hasPerm('notice:list')" @click="showGetPage(record.id, 2)">查看</a>
|
||||
<a-divider type="vertical" />
|
||||
</span>
|
||||
</s-table>
|
||||
|
|
@ -53,7 +53,7 @@
|
|||
</div>
|
||||
|
||||
<s-table
|
||||
ref="table"
|
||||
ref="table1"
|
||||
:columns="columns"
|
||||
:data="loadData"
|
||||
:rowKey="(record) => record.id"
|
||||
|
|
@ -69,7 +69,7 @@
|
|||
<span slot="action" slot-scope="text, record">
|
||||
<a v-if="hasPerm('notice:edit')" @click="showAddPage(record.id)">编辑</a>
|
||||
<a-divider type="vertical" v-if="hasPerm('notice:edit')" />
|
||||
<a v-if="hasPerm('notice:list')" @click="showGetPage(record.id)">查看</a>
|
||||
<a v-if="hasPerm('notice:list')" @click="showGetPage(record.id, 1)">查看</a>
|
||||
<a-divider type="vertical" v-if="hasPerm('notice:list')"/>
|
||||
<a-popconfirm v-if="hasPerm('notice:del')" placement="topRight" title="确认删除？" @confirm="() => handleDel(record)">
|
||||
<a>删除</a>
|
||||
|
|
@ -148,11 +148,11 @@
|
|||
tabsCallback (key) {
|
||||
if (key === '1') {
|
||||
this.queryParam.noticeRange = 1
|
||||
this.$refs.table.refresh(true)
|
||||
this.$refs.table1.refresh(true)
|
||||
}
|
||||
if (key === '2') {
|
||||
this.queryParam.noticeRange = 2
|
||||
this.$refs.table.refresh(true)
|
||||
this.$refs.table2.refresh(true)
|
||||
}
|
||||
},
|
||||
/**
|
||||
|
|
@ -177,11 +177,12 @@
|
|||
}
|
||||
})
|
||||
},
|
||||
showGetPage (id) {
|
||||
showGetPage (id, type) {
|
||||
this.$router.push({
|
||||
path: '/notice/detail',
|
||||
query: {
|
||||
id: id
|
||||
id: id,
|
||||
type: type
|
||||
}
|
||||
})
|
||||
}
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@
|
|||
</div>
|
||||
|
||||
<s-table
|
||||
ref="table"
|
||||
ref="table1"
|
||||
:columns="columns"
|
||||
:data="loadData"
|
||||
:rowKey="(record) => record.id"
|
||||
|
|
@ -31,7 +31,7 @@
|
|||
</div>
|
||||
|
||||
<s-table
|
||||
ref="table"
|
||||
ref="table2"
|
||||
:columns="columns"
|
||||
:data="loadData"
|
||||
:rowKey="(record) => record.id"
|
||||
|
|
@ -115,11 +115,11 @@
|
|||
tabsCallback (key) {
|
||||
if (key === '1') {
|
||||
this.queryParam.orgType = 1
|
||||
this.$refs.table.refresh(true)
|
||||
this.$refs.table1.refresh(true)
|
||||
}
|
||||
if (key === '2') {
|
||||
this.queryParam.orgType = 2
|
||||
this.$refs.table.refresh(true)
|
||||
this.$refs.table2.refresh(true)
|
||||
}
|
||||
},
|
||||
/**
|
||||
|
|
|
|||
|
|
@ -186,8 +186,7 @@
|
|||
label="身份证正面"
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol">
|
||||
<image-upload ref="upload" sourceId="idPhoto" :defaultList="fileList"></image-upload>
|
||||
|
||||
<db-upload v-model="fileList" max="1"></db-upload>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</a-col>
|
||||
|
|
@ -197,7 +196,7 @@
|
|||
label="身份证反面"
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol">
|
||||
<image-upload ref="upload1" sourceId="idPhoto" :defaultList="fileList2"></image-upload>
|
||||
<db-upload v-model="fileList2" max="1"></db-upload>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</a-col>
|
||||
|
|
@ -214,11 +213,11 @@
|
|||
import { personAddOrUpdate, personGet } from '@/api/person/person'
|
||||
import { dictionaryDropDown } from '@/api/sys/dictionaryItem'
|
||||
import OrgTree from '../org/OrgTree'
|
||||
import ImageUpload from '@/components/ImageUpload'
|
||||
import DbUpload from '@/components/DbUpload/DbUpload.vue'
|
||||
export default {
|
||||
components: {
|
||||
OrgTree,
|
||||
ImageUpload
|
||||
DbUpload
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
|
|
@ -290,17 +289,11 @@
|
|||
this.form.getFieldDecorator('type', { valuePropName: 'checked', initialValue: typeIntArr })
|
||||
|
||||
if (data.idPhotoFace) {
|
||||
this.fileList.push(data.idPhotoFace)
|
||||
this.fileList = JSON.parse(data.idPhotoFace)
|
||||
}
|
||||
if (data.idPhotoBack) {
|
||||
this.fileList2.push(data.idPhotoBack)
|
||||
this.fileList2 = JSON.parse(data.idPhotoBack)
|
||||
}
|
||||
this.$nextTick(() => {
|
||||
this.$refs.upload.flush()
|
||||
})
|
||||
this.$nextTick(() => {
|
||||
this.$refs.upload1.flush()
|
||||
})
|
||||
this.form.setFieldsValue(
|
||||
{
|
||||
id: data.id,
|
||||
|
|
@ -355,16 +348,8 @@
|
|||
validateFields((errors, values) => {
|
||||
if (!errors) {
|
||||
values.type = values.type.join(',')
|
||||
|
||||
// 先上传身份证照片
|
||||
this.$refs.upload.submitUpload().then((url) => {
|
||||
if (url.length > 0) {
|
||||
values.idPhotoFace = url
|
||||
}
|
||||
this.$refs.upload1.submitUpload().then((url1) => {
|
||||
if (url1.length > 0) values.idPhotoBack = url1
|
||||
|
||||
// 上传之后调用人员增改方法
|
||||
values.idPhotoFace = JSON.stringify(this.fileList)
|
||||
values.idPhotoBack = JSON.stringify(this.fileList2)
|
||||
personAddOrUpdate(values).then((res) => {
|
||||
this.confirmLoading = false
|
||||
if (res.code === 200) {
|
||||
|
|
@ -375,12 +360,6 @@
|
|||
} else {
|
||||
this.$message.error('操作失败：' + res.msg)
|
||||
}
|
||||
}).finally((res) => {
|
||||
this.confirmLoading = false
|
||||
})
|
||||
}, (err) => {
|
||||
this.$message.error(err)
|
||||
})
|
||||
}, (err) => {
|
||||
this.$message.error(err)
|
||||
})
|
||||
|
|
|
|||
|
|
@ -3,7 +3,15 @@
|
|||
<a-col :md="5" :sm="24">
|
||||
<a-card :bordered="false" :loading="treeLoading">
|
||||
<div v-if="this.orgTree != ''">
|
||||
<a-tree :treeData="orgTree" :onLoadData="orgTree" v-if="orgTree.length" @select="handleClick" :defaultExpandAll="true" :defaultExpandedKeys="defaultExpandedKeys" :defaultSelectedKeys="defaultSelectedKeys" :replaceFields="replaceFields" />
|
||||
<a-tree
|
||||
:treeData="orgTree"
|
||||
:onLoadData="orgTree"
|
||||
v-if="orgTree.length"
|
||||
@select="handleClick"
|
||||
:defaultExpandAll="true"
|
||||
:defaultExpandedKeys="defaultExpandedKeys"
|
||||
:defaultSelectedKeys="defaultSelectedKeys"
|
||||
:replaceFields="replaceFields" />
|
||||
</div>
|
||||
<div v-else>
|
||||
<a-empty :image="simpleImage" />
|
||||
|
|
@ -121,7 +129,7 @@ export default {
|
|||
PersonDetail,
|
||||
OrgTree
|
||||
},
|
||||
data() {
|
||||
data () {
|
||||
return {
|
||||
// 查询参数
|
||||
queryParam: { isAdmin: 2 },
|
||||
|
|
@ -176,7 +184,7 @@ export default {
|
|||
orgType: 1
|
||||
}
|
||||
},
|
||||
created() {
|
||||
created () {
|
||||
this.getOrgTree()
|
||||
|
||||
if (this.hasPerm('person:edit') || this.hasPerm('person:resetPwd') || this.hasPerm('person:del')) {
|
||||
|
|
@ -192,7 +200,7 @@ export default {
|
|||
/**
|
||||
* 获取到机构树，展开顶级下树节点，考虑到后期数据量变大，不建议全部展开
|
||||
*/
|
||||
async getOrgTree() {
|
||||
async getOrgTree () {
|
||||
await orgList({ orgType: this.orgType }).then(res => {
|
||||
this.treeLoading = false
|
||||
if (!res.code === 200 || !res.data.length) {
|
||||
|
|
@ -211,7 +219,7 @@ export default {
|
|||
console.log(this.defaultExpandedKeys)
|
||||
})
|
||||
},
|
||||
async changeOrgType() {
|
||||
async changeOrgType () {
|
||||
this.orgType = this.orgType === 1 ? 2 : 1
|
||||
await this.getOrgTree()
|
||||
// 此处使用async和await 由于需要等待orgTree的返回 再往下依据结果继续执行
|
||||
|
|
@ -220,7 +228,7 @@ export default {
|
|||
/**
|
||||
* 重置密码
|
||||
*/
|
||||
resetPwd(record) {
|
||||
resetPwd (record) {
|
||||
personResetPwd({ id: record.id }).then(res => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('重置成功')
|
||||
|
|
@ -233,7 +241,7 @@ export default {
|
|||
/**
|
||||
* 删除用户
|
||||
*/
|
||||
personDelete(record) {
|
||||
personDelete (record) {
|
||||
personDel({ id: record.id, deleteReason: '' }).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('删除成功')
|
||||
|
|
@ -248,14 +256,15 @@ export default {
|
|||
/**
|
||||
* 添加证书
|
||||
*/
|
||||
addPersonCertificate(record) {
|
||||
addPersonCertificate (record) {
|
||||
this.$router.push({
|
||||
path: '/archives/certificate/EditCertificate', query: {
|
||||
path: '/archives/certificate/EditCertificate',
|
||||
query: {
|
||||
personId: record.id
|
||||
}
|
||||
});
|
||||
})
|
||||
},
|
||||
quit() {
|
||||
quit () {
|
||||
if (!this.selectedRowKeys.length) {
|
||||
this.$message.warning('请选择人员')
|
||||
return
|
||||
|
|
@ -277,18 +286,18 @@ export default {
|
|||
this.$message.error('操作错误：' + err.msg)
|
||||
})
|
||||
},
|
||||
onCancel() {
|
||||
onCancel () {
|
||||
}
|
||||
})
|
||||
},
|
||||
transfer() {
|
||||
transfer () {
|
||||
if (!this.selectedRowKeys.length) {
|
||||
this.$message.warning('请选择人员')
|
||||
return
|
||||
}
|
||||
this.$refs.orgModal.loadOrg()
|
||||
},
|
||||
selectOrg(orgData) {
|
||||
selectOrg (orgData) {
|
||||
this.$confirm({
|
||||
title: '提示',
|
||||
content: '确认转移部门至' + orgData.name + '吗',
|
||||
|
|
@ -306,11 +315,11 @@ export default {
|
|||
this.$message.error('操作错误：' + err.msg)
|
||||
})
|
||||
},
|
||||
onCancel() {
|
||||
onCancel () {
|
||||
}
|
||||
})
|
||||
},
|
||||
setAdmin() {
|
||||
setAdmin () {
|
||||
if (!this.selectedRowKeys.length) {
|
||||
this.$message.warning('请选择人员')
|
||||
return
|
||||
|
|
@ -332,11 +341,11 @@ export default {
|
|||
this.$message.error('操作错误：' + err.msg)
|
||||
})
|
||||
},
|
||||
onCancel() {
|
||||
onCancel () {
|
||||
}
|
||||
})
|
||||
},
|
||||
personRegister() {
|
||||
personRegister () {
|
||||
if (this.orgType === 1) {
|
||||
this.$router.push({
|
||||
path: '/person/personRegister',
|
||||
|
|
@ -352,19 +361,20 @@ export default {
|
|||
/**
|
||||
* 点击左侧机构树查询列表
|
||||
*/
|
||||
handleClick(e) {
|
||||
handleClick (e) {
|
||||
this.queryParam.orgId = e.toString()
|
||||
this.orgId = e.toString()
|
||||
this.queryParam.orgType = this.orgType
|
||||
this.$refs.table.refresh(true)
|
||||
},
|
||||
handleOk() {
|
||||
handleOk () {
|
||||
this.$refs.table.refresh()
|
||||
},
|
||||
onRadioChange(e) {
|
||||
onRadioChange (e) {
|
||||
this.queryParam.isAdmin = e.target.value
|
||||
this.$refs.table.refresh(true)
|
||||
},
|
||||
onSelectChange(selectedRowKeys, selectedRows) {
|
||||
onSelectChange (selectedRowKeys, selectedRows) {
|
||||
this.selectedRowKeys = selectedRowKeys
|
||||
this.selectedRows = selectedRows
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue