6 changed files with 217 additions and 2 deletions
@ -0,0 +1,123 @@ |
|||
<template> |
|||
<div class="doc-wrap"> |
|||
<div class="table-title"> |
|||
<span> |
|||
{{ title }} |
|||
</span> |
|||
</div> |
|||
<div class="data-list"> |
|||
<div class="item" v-for="(item, index) in docData" :key="index"> |
|||
<span>{{ item.title }}</span> |
|||
<span>{{ item.time }}</span> |
|||
</div> |
|||
|
|||
<pagination |
|||
:total="total" |
|||
:page.sync="queryForm.pageNum" |
|||
:limit.sync="queryForm.pageSize" |
|||
:pageSizes="pageSizes" |
|||
@pagination="getResult" |
|||
style="display: unset;text-align: right;" |
|||
/> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
<script> |
|||
export default { |
|||
name: "docWrap", |
|||
props: { |
|||
title: { |
|||
type: String, |
|||
default: "政策文件" |
|||
}, |
|||
docData: { |
|||
type: Array, |
|||
default: () => [] |
|||
} |
|||
}, |
|||
data() { |
|||
return { |
|||
total: 10, |
|||
pageSizes: [10, 20, 30, 50], |
|||
queryForm: { |
|||
cv: { |
|||
name: "title", |
|||
type: "like", |
|||
value: "" |
|||
}, |
|||
data: {}, |
|||
pageNum: 1, |
|||
pageSize: 10 |
|||
} |
|||
}; |
|||
}, |
|||
methods: { |
|||
getResult() {} |
|||
} |
|||
}; |
|||
</script> |
|||
<style scoped lang="less"> |
|||
.doc-wrap { |
|||
overflow: hidden; |
|||
width: 100%; |
|||
padding: 20px; |
|||
background-color: #fff; |
|||
border-radius: 8px; |
|||
.table-title { |
|||
height: 47px; |
|||
line-height: 47px; |
|||
background-color: #f6f6f6; |
|||
|
|||
span { |
|||
font-family: PingFangSC, PingFang SC; |
|||
font-weight: 600; |
|||
font-size: 16px; |
|||
color: #333333; |
|||
font-style: normal; |
|||
|
|||
&::before { |
|||
content: ""; |
|||
display: inline-block; |
|||
width: 3px; |
|||
height: 16px; |
|||
background: #005eb7; |
|||
margin-right: 10px; |
|||
vertical-align: middle; |
|||
} |
|||
} |
|||
} |
|||
|
|||
.data-list { |
|||
.item { |
|||
padding-left: 10px; |
|||
position: relative; |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
height: 40px; |
|||
line-height: 40px; |
|||
border-bottom: 1px solid #f0f0f0; |
|||
span { |
|||
font-family: PingFangSC, PingFang SC; |
|||
font-weight: 400; |
|||
font-size: 14px; |
|||
color: #333333; |
|||
font-style: normal; |
|||
} |
|||
|
|||
&::before { |
|||
position: absolute; |
|||
top: 18px; |
|||
left: 0; |
|||
content: ""; |
|||
display: inline-block; |
|||
width: 5px; |
|||
height: 5px; |
|||
background: #005eb7; |
|||
margin-right: 10px; |
|||
vertical-align: middle; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
</style> |
@ -0,0 +1,81 @@ |
|||
<template> |
|||
<div class="certification-page"> |
|||
<div class="search-wrap"> |
|||
<el-form :inline="true" :model="queryForm" class="demo-form-inline"> |
|||
<el-form-item label="标题"> |
|||
<el-input |
|||
v-model="queryForm.cv.name" |
|||
placeholder="请输入标题" |
|||
></el-input> |
|||
</el-form-item> |
|||
<el-form-item> |
|||
<el-button type="primary" @click="onSubmit">查询</el-button> |
|||
</el-form-item> |
|||
</el-form> |
|||
</div> |
|||
<div class="docs-wrap"> |
|||
<doc-wrap |
|||
v-for="i in 3" |
|||
:key="i" |
|||
:title="'政策文件'" |
|||
:docData="[ |
|||
{ id: 1, title: '标题1', content: '内容1', time: '2020-11-11' }, |
|||
{ id: 2, title: '标题2', content: '内容2', time: '2020-11-12' } |
|||
]" |
|||
style="margin-bottom: 20px;" |
|||
></doc-wrap> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
<script> |
|||
import docWrap from "./components/docWrap.vue"; |
|||
export default { |
|||
components: { |
|||
docWrap |
|||
}, |
|||
data() { |
|||
return { |
|||
total: 0, |
|||
apidata: { |
|||
pageNum: 1, |
|||
pageSize: 10 |
|||
}, |
|||
pageSizes: [10, 20, 30, 50], |
|||
queryForm: { |
|||
cv: { |
|||
name: "title", |
|||
type: "like", |
|||
value: "" |
|||
}, |
|||
data: {}, |
|||
pageNum: 1, |
|||
pageSize: 10 |
|||
}, |
|||
tableData: [] |
|||
}; |
|||
}, |
|||
mounted() {}, |
|||
methods: {} |
|||
}; |
|||
</script> |
|||
<style lang="less" scoped> |
|||
.certification-page { |
|||
padding-top: 20px; |
|||
background: linear-gradient( |
|||
to bottom, |
|||
#005eb7 0%, |
|||
#edf7ff 100% 670px, |
|||
#edf7ff 670px, |
|||
#edf7ff 100% |
|||
); |
|||
|
|||
.search-wrap { |
|||
width: 1200px; |
|||
margin: 0 auto; |
|||
} |
|||
.docs-wrap { |
|||
width: 1200px; |
|||
margin: 0 auto; |
|||
} |
|||
} |
|||
</style> |
Loading…
Reference in new issue