170 lines
3.6 KiB
Vue
170 lines
3.6 KiB
Vue
<template>
|
||
<div class="document-flow">
|
||
<AiTopFixed>
|
||
<header class="pad">
|
||
<u-search placeholder="请输入公文名称" v-model="documentName" @clear="documentName='',getList()" @search="getList"
|
||
clearabled :show-action="false" height="64"></u-search>
|
||
</header>
|
||
</AiTopFixed>
|
||
<div class="list pad" v-if="list.length">
|
||
<div class="card" v-for="(item,index) in list" :key="index" @click="handleClick(item)">
|
||
<u-row>
|
||
<em v-if="item.redStatus==0"></em>
|
||
<span>{{ item.documentName }}</span>
|
||
</u-row>
|
||
<u-gap height="16"></u-gap>
|
||
<u-row>
|
||
<label>公文类型：</label>
|
||
<text style="color: #1365DD;">{{ $dict.getLabel("officialDocumentName", item.documentType) }}</text>
|
||
</u-row>
|
||
<u-gap height="8"></u-gap>
|
||
<u-row>
|
||
<label>登记人：</label>
|
||
<text>{{ item.createUserName }}</text>
|
||
</u-row>
|
||
<u-gap height="8"></u-gap>
|
||
<u-row>
|
||
<label>登记日期：</label>
|
||
<text>{{ item.createTime }}</text>
|
||
</u-row>
|
||
<img :src=" $cdn + tag(item.readType)" alt="">
|
||
</div>
|
||
</div>
|
||
<AiEmpty v-else></AiEmpty>
|
||
<u-loadmore :status="status" v-if="list.length"/>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
|
||
export default {
|
||
name: "AppDocumentFlow",
|
||
appName: "公文流转",
|
||
data() {
|
||
return {
|
||
documentName: "",
|
||
current: 1,
|
||
list: [],
|
||
status: "加载更多"
|
||
}
|
||
},
|
||
onLoad() {
|
||
this.$dict.load("officialDocumentName")
|
||
uni.$on('updateList', () => {
|
||
this.current = 1
|
||
this.getList()
|
||
})
|
||
},
|
||
methods: {
|
||
tag(status) {
|
||
return {
|
||
"0": 'common/1ps.png',
|
||
"1": 'common/2cy.png'
|
||
}[status]
|
||
},
|
||
getList() {
|
||
this.$http.post("/app/appofficialdocumentinfo/appList", null, {
|
||
params: {
|
||
documentName: this.documentName,
|
||
size: 10,
|
||
current: this.current
|
||
}
|
||
}).then(res => {
|
||
if (res && res.data) {
|
||
if (this.current > 1 && this.current > res.data.pages) {
|
||
this.status = "已经到底啦"
|
||
}
|
||
this.list = this.current > 1 ? [...this.list, ...res.data.records] : res.data.records
|
||
}
|
||
})
|
||
},
|
||
handleClick({id}) {
|
||
uni.navigateTo({
|
||
url: "./detail?id=" + id
|
||
})
|
||
}
|
||
},
|
||
onShow() {
|
||
this.getList()
|
||
},
|
||
onReachBottom() {
|
||
this.current = this.current + 1;
|
||
this.getList()
|
||
},
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.document-flow {
|
||
min-height: 100%;
|
||
background: #F5F5F5;
|
||
|
||
::v-deep .content {
|
||
padding: 0;
|
||
}
|
||
|
||
header {
|
||
height: 112px;
|
||
background-color: #FFFFFF;
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
|
||
.list {
|
||
margin: 32px 0;
|
||
|
||
.card {
|
||
background: #FFFFFF;
|
||
border-radius: 8px;
|
||
box-sizing: border-box;
|
||
padding: 32px;
|
||
position: relative;
|
||
margin-bottom: 32px;
|
||
|
||
.u-row {
|
||
flex-wrap: nowrap !important;
|
||
}
|
||
|
||
em {
|
||
width: 16px;
|
||
height: 16px;
|
||
border-radius: 50%;
|
||
background-color: #FF4466;
|
||
font-style: normal;
|
||
margin-right: 8px;
|
||
flex-shrink: 0;
|
||
}
|
||
|
||
span {
|
||
font-size: 32px;
|
||
font-weight: 600;
|
||
color: #333333;
|
||
}
|
||
|
||
label {
|
||
font-size: 30px;
|
||
color: #999999;
|
||
}
|
||
|
||
text {
|
||
font-size: 30px;
|
||
color: #343D65;
|
||
}
|
||
|
||
img {
|
||
width: 160px;
|
||
height: 160px;
|
||
position: absolute;
|
||
right: 0;
|
||
bottom: 0;
|
||
}
|
||
}
|
||
}
|
||
|
||
.pad {
|
||
box-sizing: border-box;
|
||
padding: 32px 32px 0 32px;
|
||
}
|
||
}
|
||
</style>
|