页面优化

This commit is contained in:
aoli.qu 2021-12-23 14:58:53 +08:00
parent a6c33e5f86
commit bbd792522e
5 changed files with 117 additions and 94 deletions

View File

@ -22,13 +22,13 @@
</div> </div>
</a-card> </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-tabs default-active-key="1" @change="tabsCallback">
<a-tab-pane key="1" tab="已读人员"> <a-tab-pane key="1" tab="已读人员">
<s-table <s-table
ref="table" ref="table1"
:columns="columns" :columns="columns1"
:data="loadData" :data="loadData1"
:rowKey="(record) => record.id" :rowKey="(record) => record.id"
:pagination="{ pageSize: 5 }" :pagination="{ pageSize: 5 }"
:showSizeChanger="false" :showSizeChanger="false"
@ -36,13 +36,14 @@
<template slot="readTime" slot-scope="text, record"> <template slot="readTime" slot-scope="text, record">
{{ record.readTime | moment('YYYY-MM-DD HH:mm:ss') }} {{ record.readTime | moment('YYYY-MM-DD HH:mm:ss') }}
</template> </template>
</s-table> </s-table>
</a-tab-pane> </a-tab-pane>
<a-tab-pane key="1" tab="未读人员" > <a-tab-pane key="2" tab="未读人员" >
<s-table <s-table
ref="table" ref="table2"
:columns="columns" :columns="columns2"
:data="loadData" :data="loadData2"
:rowKey="(record) => record.id" :rowKey="(record) => record.id"
:pagination="{ pageSize: 5 }" :pagination="{ pageSize: 5 }"
:showSizeChanger="false" :showSizeChanger="false"
@ -59,40 +60,59 @@
</template> </template>
<script> <script>
import { noticeGet, noticePagePerson } from '@/api/notice/notice' import { STable } from '@/components'
import { noticeGet, noticePagePerson, noticeRead } from '@/api/notice/notice'
export default { export default {
components: {
STable
},
data () { data () {
return { return {
model: {}, model: {},
queryParam: { noticeId: this.$route.query.id, isRead: 1 }, queryParam: { noticeId: this.$route.query.id, isRead: 1 },
readCount: 0,
unreadCount: 0,
// //
columns: [ columns1: [
{ {
title: '公告标题', title: '人员名称',
dataIndex: 'title' dataIndex: 'personName'
}, },
{ {
title: '发布单位/人', title: '组织名称',
dataIndex: 'createOrgName' dataIndex: 'orgName'
}, },
{ {
title: '发布时间', title: '阅览时间',
width: 200, width: 200,
dataIndex: 'readTime', dataIndex: 'readTime',
key: 'readTime', key: 'readTime',
scopedSlots: { customRender: 'readTime' } scopedSlots: { customRender: 'readTime' }
}
],
columns2: [
{
title: '人员名称',
dataIndex: 'personName'
}, },
{ {
title: '菜单类型', title: '组织名称',
dataIndex: 'type', dataIndex: 'orgName'
scopedSlots: { customRender: 'type' }
} }
], ],
// Promise // Promise
loadData: parameter => { loadData1: parameter => {
return noticePagePerson(Object.assign(parameter, this.queryParam)).then((res) => { return noticePagePerson(Object.assign(parameter, { noticeId: this.$route.query.id, isRead: 1 })).then((res) => {
console.log(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 return res
}) })
} }
@ -100,8 +120,13 @@ export default {
}, },
created () { created () {
const noticeId = this.$route.query.id const noticeId = this.$route.query.id
console.log(noticeId)
this.getDetail(noticeId) this.getDetail(noticeId)
const type = this.$route.query.type
console.log(type)
//
if (type == 2) {
this.readNotice(noticeId)
}
}, },
methods: { methods: {
// //
@ -113,14 +138,22 @@ export default {
this.model = res.data this.model = res.data
}) })
}, },
readNotice (id) {
console.log('-------------read')
console.log(id)
noticeRead({ id: id }).then(res => {
//
console.log(res)
})
},
tabsCallback (key) { tabsCallback (key) {
if (key === '1') { if (key === '1') {
this.queryParam.isRead = 1 this.queryParam.isRead = 1
this.$refs.table.refresh(true) this.$refs.table1.refresh(true)
} }
if (key === '2') { if (key === '2') {
this.queryParam.isRead = 0 this.queryParam.isRead = 0
this.$refs.table.refresh(true) this.$refs.table2.refresh(true)
} }
} }
} }

View File

@ -16,7 +16,7 @@
</a-form> </a-form>
</div> </div>
<s-table <s-table
ref="table" ref="table2"
:columns="columns" :columns="columns"
:data="loadData" :data="loadData"
:rowKey="(record) => record.id" :rowKey="(record) => record.id"
@ -28,7 +28,7 @@
{{ record.publishTime | moment('YYYY-MM-DD HH:mm:ss') }} {{ record.publishTime | moment('YYYY-MM-DD HH:mm:ss') }}
</template> </template>
<span slot="action" slot-scope="text, record"> <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" /> <a-divider type="vertical" />
</span> </span>
</s-table> </s-table>
@ -53,7 +53,7 @@
</div> </div>
<s-table <s-table
ref="table" ref="table1"
:columns="columns" :columns="columns"
:data="loadData" :data="loadData"
:rowKey="(record) => record.id" :rowKey="(record) => record.id"
@ -69,7 +69,7 @@
<span slot="action" slot-scope="text, record"> <span slot="action" slot-scope="text, record">
<a v-if="hasPerm('notice:edit')" @click="showAddPage(record.id)">编辑</a> <a v-if="hasPerm('notice:edit')" @click="showAddPage(record.id)">编辑</a>
<a-divider type="vertical" v-if="hasPerm('notice:edit')" /> <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-divider type="vertical" v-if="hasPerm('notice:list')"/>
<a-popconfirm v-if="hasPerm('notice:del')" placement="topRight" title="确认删除?" @confirm="() => handleDel(record)"> <a-popconfirm v-if="hasPerm('notice:del')" placement="topRight" title="确认删除?" @confirm="() => handleDel(record)">
<a>删除</a> <a>删除</a>
@ -148,11 +148,11 @@
tabsCallback (key) { tabsCallback (key) {
if (key === '1') { if (key === '1') {
this.queryParam.noticeRange = 1 this.queryParam.noticeRange = 1
this.$refs.table.refresh(true) this.$refs.table1.refresh(true)
} }
if (key === '2') { if (key === '2') {
this.queryParam.noticeRange = 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({ this.$router.push({
path: '/notice/detail', path: '/notice/detail',
query: { query: {
id: id id: id,
type: type
} }
}) })
} }

View File

@ -7,7 +7,7 @@
</div> </div>
<s-table <s-table
ref="table" ref="table1"
:columns="columns" :columns="columns"
:data="loadData" :data="loadData"
:rowKey="(record) => record.id" :rowKey="(record) => record.id"
@ -31,7 +31,7 @@
</div> </div>
<s-table <s-table
ref="table" ref="table2"
:columns="columns" :columns="columns"
:data="loadData" :data="loadData"
:rowKey="(record) => record.id" :rowKey="(record) => record.id"
@ -115,11 +115,11 @@
tabsCallback (key) { tabsCallback (key) {
if (key === '1') { if (key === '1') {
this.queryParam.orgType = 1 this.queryParam.orgType = 1
this.$refs.table.refresh(true) this.$refs.table1.refresh(true)
} }
if (key === '2') { if (key === '2') {
this.queryParam.orgType = 2 this.queryParam.orgType = 2
this.$refs.table.refresh(true) this.$refs.table2.refresh(true)
} }
}, },
/** /**

View File

@ -186,8 +186,7 @@
label="身份证正面" label="身份证正面"
:labelCol="labelCol" :labelCol="labelCol"
:wrapperCol="wrapperCol"> :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-item>
</a-form> </a-form>
</a-col> </a-col>
@ -197,7 +196,7 @@
label="身份证反面" label="身份证反面"
:labelCol="labelCol" :labelCol="labelCol"
:wrapperCol="wrapperCol"> :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-item>
</a-form> </a-form>
</a-col> </a-col>
@ -214,11 +213,11 @@
import { personAddOrUpdate, personGet } from '@/api/person/person' import { personAddOrUpdate, personGet } from '@/api/person/person'
import { dictionaryDropDown } from '@/api/sys/dictionaryItem' import { dictionaryDropDown } from '@/api/sys/dictionaryItem'
import OrgTree from '../org/OrgTree' import OrgTree from '../org/OrgTree'
import ImageUpload from '@/components/ImageUpload' import DbUpload from '@/components/DbUpload/DbUpload.vue'
export default { export default {
components: { components: {
OrgTree, OrgTree,
ImageUpload DbUpload
}, },
data () { data () {
return { return {
@ -290,17 +289,11 @@
this.form.getFieldDecorator('type', { valuePropName: 'checked', initialValue: typeIntArr }) this.form.getFieldDecorator('type', { valuePropName: 'checked', initialValue: typeIntArr })
if (data.idPhotoFace) { if (data.idPhotoFace) {
this.fileList.push(data.idPhotoFace) this.fileList = JSON.parse(data.idPhotoFace)
} }
if (data.idPhotoBack) { 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( this.form.setFieldsValue(
{ {
id: data.id, id: data.id,
@ -355,16 +348,8 @@
validateFields((errors, values) => { validateFields((errors, values) => {
if (!errors) { if (!errors) {
values.type = values.type.join(',') values.type = values.type.join(',')
values.idPhotoFace = JSON.stringify(this.fileList)
// values.idPhotoBack = JSON.stringify(this.fileList2)
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
//
personAddOrUpdate(values).then((res) => { personAddOrUpdate(values).then((res) => {
this.confirmLoading = false this.confirmLoading = false
if (res.code === 200) { if (res.code === 200) {
@ -375,12 +360,6 @@
} else { } else {
this.$message.error('操作失败:' + res.msg) this.$message.error('操作失败:' + res.msg)
} }
}).finally((res) => {
this.confirmLoading = false
})
}, (err) => {
this.$message.error(err)
})
}, (err) => { }, (err) => {
this.$message.error(err) this.$message.error(err)
}) })

View File

@ -3,7 +3,15 @@
<a-col :md="5" :sm="24"> <a-col :md="5" :sm="24">
<a-card :bordered="false" :loading="treeLoading"> <a-card :bordered="false" :loading="treeLoading">
<div v-if="this.orgTree != ''"> <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>
<div v-else> <div v-else>
<a-empty :image="simpleImage" /> <a-empty :image="simpleImage" />
@ -250,10 +258,11 @@ export default {
*/ */
addPersonCertificate (record) { addPersonCertificate (record) {
this.$router.push({ this.$router.push({
path: '/archives/certificate/EditCertificate', query: { path: '/archives/certificate/EditCertificate',
query: {
personId: record.id personId: record.id
} }
}); })
}, },
quit () { quit () {
if (!this.selectedRowKeys.length) { if (!this.selectedRowKeys.length) {
@ -355,6 +364,7 @@ export default {
handleClick (e) { handleClick (e) {
this.queryParam.orgId = e.toString() this.queryParam.orgId = e.toString()
this.orgId = e.toString() this.orgId = e.toString()
this.queryParam.orgType = this.orgType
this.$refs.table.refresh(true) this.$refs.table.refresh(true)
}, },
handleOk () { handleOk () {