<?= $this->extend('Panel/Layouts/App') ?>
<?= $this->section('css') ?>
<?= $this->endSection() ?>
<?= $this->section('content') ?>
<div class="m-2">
    <div class="card-style mb-30">
        <div class="
                      title
                      mb-10
                      d-flex
                      justify-content-between
                      align-items-center
                    ">
            <h6 class="mb-10">Pengumuman</h6>
        </div>
        <div class="activity-wrapper">
            <ul>
                <li v-for="pengumuman in pengumumans" class="single-activity orange">
                    <div class="icon">
                        <i class="lni lni-comments-reply"></i>
                    </div>
                    <div class="content w-100">
                        <div class="
                              title
                              mb-15
                              d-flex
                              justify-content-between
                              align-items-center
                            ">
                            <h5 class="text-medium">{{pengumuman.judul}}</h5>
                            <span>{{pengumuman.parsedTime}}</span>
                        </div>
                        <p v-html="pengumuman.body">
                        </p>
                    </div>
                </li>
            </ul>
        </div>
    </div>

</div>
<?= $this->endSection() ?>
<?= $this->section('js') ?>
<script>
    myVueMixin.push({
        data() {
            return {
                pengumumans: [],
            }
        },
        mounted() {
            axios({
                method: 'get',
                url: this.$store.state.config.base_url + '/panel/announcement/all',
            }).then((response) => {
                if (!isObject(response.data)) return Swal.fire("Gagal", gaem({
                    response
                }, response.data), 'error');
                this.pengumumans = response.data;
            }, (error) => {
                Swal.fire("Gagal", gaem(error), 'error');
            });
        },
        methods: {

        }
    })
</script>
<?= $this->endSection() ?>