133 lines
5.1 KiB
Vue
133 lines
5.1 KiB
Vue
<template>
|
|
<ul v-if="inLoadingFlag">
|
|
<li>
|
|
<!-- This example requires Tailwind CSS v2.0+ -->
|
|
<div class="rounded-md bg-green-50 p-4">
|
|
<div class="flex">
|
|
<div class="flex-shrink-0">
|
|
<!-- Heroicon name: check-circle -->
|
|
<svg
|
|
class="h-5 w-5 text-green-400"
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
viewBox="0 0 20 20"
|
|
fill="currentColor"
|
|
aria-hidden="true"
|
|
>
|
|
<path
|
|
fill-rule="evenodd"
|
|
d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z"
|
|
clip-rule="evenodd"
|
|
/>
|
|
</svg>
|
|
</div>
|
|
<div class="ml-3">
|
|
<p class="text-sm font-medium text-green-800">
|
|
{{ statusMessage }}
|
|
</p>
|
|
</div>
|
|
<div class="ml-auto pl-3">
|
|
<div class="-mx-1.5 -my-1.5"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
|
|
<ul v-else-if="statusMessage != null">
|
|
<li>
|
|
<div class="rounded-md bg-red-50 p-4 m-5">
|
|
<div class="flex">
|
|
<div class="flex-shrink-0">
|
|
<!-- Heroicon name: x-circle -->
|
|
<svg
|
|
class="h-5 w-5 text-red-400"
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
viewBox="0 0 20 20"
|
|
fill="currentColor"
|
|
aria-hidden="true"
|
|
>
|
|
<path
|
|
fill-rule="evenodd"
|
|
d="M10 18a8 8 0 100-16 8 8 0 000 16zM8.707 7.293a1 1 0 00-1.414 1.414L8.586 10l-1.293 1.293a1 1 0 101.414 1.414L10 11.414l1.293 1.293a1 1 0 001.414-1.414L11.414 10l1.293-1.293a1 1 0 00-1.414-1.414L10 8.586 8.707 7.293z"
|
|
clip-rule="evenodd"
|
|
/>
|
|
</svg>
|
|
</div>
|
|
<div class="ml-3">
|
|
<h3 class="text-sm font-medium text-red-800">
|
|
오류가 발생하였습니다.
|
|
</h3>
|
|
<div class="mt-2 text-sm text-red-700">
|
|
<ul class="list-disc pl-5 space-y-1">
|
|
<li>
|
|
{{ statusMessage }}
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
|
|
<div v-else>
|
|
<ul v-if="listData.length > 0">
|
|
<li v-for="noticeItem in listData" :key="noticeItem.serial">
|
|
<BaseNoticeItem1 :item="noticeItem" />
|
|
</li>
|
|
</ul>
|
|
|
|
<div v-else>
|
|
<div class="rounded-md bg-red-50 p-4 m-5">
|
|
<div class="flex">
|
|
<div class="flex-shrink-0">
|
|
<!-- Heroicon name: x-circle -->
|
|
<svg
|
|
class="h-5 w-5 text-red-400"
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
viewBox="0 0 20 20"
|
|
fill="currentColor"
|
|
aria-hidden="true"
|
|
>
|
|
<path
|
|
fill-rule="evenodd"
|
|
d="M10 18a8 8 0 100-16 8 8 0 000 16zM8.707 7.293a1 1 0 00-1.414 1.414L8.586 10l-1.293 1.293a1 1 0 101.414 1.414L10 11.414l1.293 1.293a1 1 0 001.414-1.414L11.414 10l1.293-1.293a1 1 0 00-1.414-1.414L10 8.586 8.707 7.293z"
|
|
clip-rule="evenodd"
|
|
/>
|
|
</svg>
|
|
</div>
|
|
<div class="ml-3">
|
|
<h3 class="text-sm font-medium text-red-800">
|
|
등록된 공지가 없습니다.
|
|
</h3>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
definePageMeta({
|
|
middleware: 'check-auth-user',
|
|
});
|
|
|
|
const listData = ref();
|
|
const inLoadingFlag = ref(true);
|
|
const statusMessage = ref('데이터를 읽어 오는 중...');
|
|
|
|
inLoadingFlag.value = true;
|
|
const responseJson = await _crossCtl.doComm('local/list', 'notice', {});
|
|
|
|
inLoadingFlag.value = false;
|
|
|
|
if (responseJson['responseCode'] == 200) {
|
|
listData.value = responseJson['data'];
|
|
statusMessage.value = null;
|
|
} else {
|
|
statusMessage.value = responseJson['responseMessage'];
|
|
}
|
|
</script>
|
|
|
|
<style lang="css" scoped></style>
|