178 lines
3.7 KiB
Vue
178 lines
3.7 KiB
Vue
<template>
|
||
<!-- 公司公示文档 -->
|
||
<view class="all_box">
|
||
<view class="nav_box">
|
||
<view class="task_box">
|
||
<u-search shape="round" placeholder="搜索任务状态、优先级、部门等"></u-search>
|
||
<!-- 新建按钮 -->
|
||
<view class="newly_built">+新建</view>
|
||
</view>
|
||
</view>
|
||
<!-- 公司公告详情 -->
|
||
<view class="notice_box" v-for="item in noticeData" :key="item.id">
|
||
<view class="title">{{item.title}}</view>
|
||
<view class="row"></view>
|
||
<view class="info">{{item.desc}}
|
||
</view>
|
||
<view class="row"></view>
|
||
<view class="notice_bottom">
|
||
<view class="n_left">
|
||
<text class="chapter">共{{item.sections}}章</text>
|
||
<text>浏览：{{item.is_share}}</text>
|
||
</view>
|
||
<view class="n_right">
|
||
<view class="btn btn_1">编辑</view>
|
||
<view class="btn">详情</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import { getDocumentListApi } from '@/api/oa.js'
|
||
export default {
|
||
data() {
|
||
return {
|
||
keyword: '',
|
||
noticeData: [{
|
||
id: 1,
|
||
title:'泸州里海农业科技有限公司内部制度流程管fafasf',
|
||
info:'本制度流程管理内容是劳动合同的补充约定，是公司、员工共同就劳资关系在不违反劳动法的基础上作出的意识自制约定；本制度经公司与在职员工全员共同会审通过，并总经理批准，自发布之日起施行。',
|
||
total:'35',
|
||
nice:'43'
|
||
},
|
||
{
|
||
id: 2,
|
||
title:'泸州里海农业科技有限公司内部制度流程管fafasf',
|
||
info:'本制度流程管理内容是劳动合同的补充约定，是公司、员工共同就劳资关系在不违反劳动法的基础上作出的意识自制约定；本制度经公司与在职员工全员共同会审通过，并总经理批准，自发布之日起施行。',
|
||
total:'35',
|
||
nice:'43'
|
||
}]
|
||
};
|
||
},
|
||
onLoad() {
|
||
|
||
},
|
||
onShow() {
|
||
this.getDocumentList()
|
||
},
|
||
methods:{
|
||
//获取公司文档列表
|
||
async getDocumentList(){
|
||
let data={share:1}
|
||
const res = await getDocumentListApi(data)
|
||
this.noticeData = res
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
/deep/.u-search {
|
||
width: 527rpx;
|
||
}
|
||
|
||
/deep/.u-search__action--active {
|
||
display: none;
|
||
}
|
||
.all_box{
|
||
padding-bottom: 21rpx;
|
||
}
|
||
.nav_box {
|
||
width: 750rpx;
|
||
height: 98rpx;
|
||
background: #FFFFFF;
|
||
|
||
.task_box {
|
||
margin: 0 auto;
|
||
width: 750rpx;
|
||
height: 98rpx;
|
||
background: #FFFFFF;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
padding: 0 28rpx;
|
||
|
||
.newly_built {
|
||
width: 149rpx;
|
||
height: 63rpx;
|
||
background: #34A853;
|
||
border-radius: 35rpx;
|
||
color: #fff;
|
||
text-align: center;
|
||
line-height: 63rpx;
|
||
margin-left: 17.5rpx;
|
||
}
|
||
}
|
||
}
|
||
|
||
.notice_box {
|
||
margin: 0 auto;
|
||
margin-top: 21rpx;
|
||
width: 694rpx;
|
||
// height: 342rpx;
|
||
background: #FFFFFF;
|
||
border-radius: 7rpx;
|
||
padding: 0 24.5rpx;
|
||
padding-bottom: 25rpx;
|
||
padding-top: 24.5rpx;
|
||
|
||
.title {
|
||
white-space: nowrap;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
width: 624rpx;
|
||
height: 44rpx;
|
||
font-size: 32rpx;
|
||
}
|
||
|
||
.row {
|
||
margin: 14rpx 0;
|
||
width: 646rpx;
|
||
height: 0rpx;
|
||
opacity: 1;
|
||
border-bottom: 1rpx solid #CCCCCC;
|
||
}
|
||
|
||
.info {
|
||
width: 645rpx;
|
||
color: #999999;
|
||
font-size: 25rpx;
|
||
}
|
||
|
||
|
||
.notice_bottom {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
|
||
.n_left {
|
||
color: #999999;
|
||
font-size: 25rpx;
|
||
|
||
.chapter {
|
||
margin-right: 60rpx;
|
||
}
|
||
}
|
||
|
||
.n_right {
|
||
.btn {
|
||
display: inline-block;
|
||
width: 158rpx;
|
||
height: 53rpx;
|
||
line-height: 53rpx;
|
||
text-align: center;
|
||
background: $theme-oa-color;
|
||
border-radius: 4rpx;
|
||
color: #fff;
|
||
}
|
||
|
||
.btn_1 {
|
||
background: #34A853;
|
||
margin-right: 14rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
</style> |