<template>
    <view>
        <!-- pages/oneselfCenter/page/Notice/Notice.wxml -->
        <nav-bar :navbarData="navbarData"></nav-bar>
        <view class="notice" :style="'margin-top: ' + (height * 2 + 10) + 'rpx; height: calc(100vh - ' + (height * 2 + 10) + 'rpx)'">
            <view class="top">
                <view class="noticeitem" @tap="clickItem" :data-item="item" v-for="(item, index) in noticeList" :key="index">
                    <view class="row itemtop">
                        <view class="col-6 title">{{ item.title }}</view>
                        <view class="col-6 status">{{ item.statusDesc }}</view>
                    </view>

                    <view class="content">{{ item.noticeContent }}</view>

                    <view class="updateDate">更新日期: {{ item.releaseDate }}</view>
                </view>
            </view>
            <button class="bottomBtn" @tap="addNotice">添加个人公告</button>
        </view>
    </view>
</template>

<script>
import Cache from '../../../../utils/cache';
import navBar from '@/pages/components/navbar/index';
// pages/oneselfCenter/page/Notice/Notice.js
import { $http } from '../../../../config/https.js';
const app = getApp();
export default {
    components: {
        navBar
    },
    data() {
        return {
            navbarData: {
                background: '',
                title: '个人公告',
                //导航栏 中间的标题
                height: '100',
                bottom: true,
                isGoBack: true
            },
            height: app.globalData.height,
            noticeList: [] //公告列表
        };
    },
    /**
     * 生命周期函数--监听页面加载
     */
    onLoad: function (options) {},
    /**
     * 生命周期函数--监听页面初次渲染完成
     */
    onReady: function () {},
    /**
     * 生命周期函数--监听页面显示
     */
    onShow: function () {
        this.getNotice();
    },
    /**
     * 生命周期函数--监听页面隐藏
     */
    onHide: function () {},
    /**
     * 生命周期函数--监听页面卸载
     */
    onUnload: function () {},
    /**
     * 页面相关事件处理函数--监听用户下拉动作
     */
    onPullDownRefresh: function () {},
    /**
     * 页面上拉触底事件的处理函数
     */
    onReachBottom: function () {},
    /**
     * 用户点击右上角分享
     */
    onShareAppMessage: function () {},
    methods: {
        /**
         * 添加公告
         */
        addNotice: function () {
            uni.navigateTo({
                url: '../addNotice/addNotice'
            });
        },

        /**
         * 获取公告
         */
        getNotice: function () {
            const userData = Cache.get('userData');
            let data = {
                params: [
                    {
                        hospID: userData.hospID,
                        locID: userData.locID,
                        docID: userData.userID
                    }
                ]
            };
            let that = this;
            $http.post('urlDeault', this, {
                code: '03100145',
                data: data,
                success: function (res) {
                    if (+res.errorCode === 0) {
                        that.setData({
                            noticeList: res.result
                        });
                    }
                }
            });
        },

        /**
         * 点击公告
         */
        clickItem: function (event) {
            let item = event.currentTarget.dataset.item;
            uni.navigateTo({
                //目的页面地址
                url: '../addNotice/addNotice?content=' + item.noticeContent + '&title=' + item.title + '&status=' + item.status + '&ID=' + item.ID
            });
        }
    }
};
</script>
<style>
/* pages/oneselfCenter/page/Notice/Notice.wxss */
.notice {
    width: 100%;
    overflow: hidden;
}

.top {
    width: 100%;
    height: calc(100% - 100rpx);
    overflow-y: auto;
}

.noticeitem {
    background: #fff;
    margin-bottom: 26rpx;
}

.itemtop {
    height: 100rpx;
    line-height: 100rpx;
    padding: 0 14rpx;
    border-top: 1px solid #f5f4f4;
    border-bottom: 1px solid #f5f4f4;
}

.title {
    text-align: left;
    font-size: 38rpx;
    font-weight: bold;
}

.status {
    text-align: right;
    font-size: 36rpx;
}

.content {
    font-size: 36rpx;
    border-bottom: 1px solid #f5f4f4;
    padding: 10rpx 20rpx;
}

.updateDate {
    height: 100rpx;
    line-height: 100rpx;
    padding: 0 14rpx;
}

.bottomBtn {
    background: #1890ff;
    font-size: 38rpx;
    color: #fff;
    padding: none;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    min-height: 100rpx;
    line-height: 100rpx;
    border-radius: 0px;
    padding-bottom: env(safe-area-inset-bottom);
}
</style>
