localnet/localhost-front
10
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

카드 크기 변경
All checks were successful
LocalNet_front/pipeline/head This commit looks good
Details

Browse Source
This commit is contained in:
nevermoregb 2025-03-31 14:00:41 +09:00
parent 174867fc35
commit 666c081813
1 changed files with 54 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

90
src/components/main/MemberManagement.vue
View File

@ -1,42 +1,49 @@
<template> <template>
<div v-if="memberList?.length" class="card mt-2 mb-3 shadow-sm border"> <div class="row g-4 mt-2">
<div class="row g-0"> <!-- lg 이상에서는 2개, 그 이하에서는 1개씩 -->
<div class="card-body"> <div v-for="member in memberList" :key="member.MEMBERSEQ">
<div class="d-flex justify-content-between"> <div class="card">
<h5 class="card-title fw-bold">사원 등록 관리</h5> <div class="card-body p-3">
</div> <div class="d-flex justify-content-between mb-2">
<div class="g-2 card"> <h5 class="card-title fw-bold">사원 등록 관리</h5>
<div v-for="member in memberList" :key="member.MEMBERSEQ" class="row card-body"> </div>
<div class="col-2"> <div class="g-2 card col-12 col-lg-6">
<img <div class="row card-body">
:src="`upload/img/profile/`" <div class="col-2">
alt="Profile Image" <img
class="img-fluid" :src="`upload/img/profile/`"
@error="$event.target.src = '/img/icons/icon.png'" alt="Profile Image"
/> class="img-fluid"
</div> @error="$event.target.src = '/img/icons/icon.png'"
<div class="col-7"> />
<!-- 날짜 -->
<div class="d-flex flex-sm-row align-items-center pb-2">
<div class="">{{ member.MEMBERNAM }}</div>
</div> </div>
<!-- 참여자 --> <div class="col-7">
<div class="d-flex flex-sm-row align-items-center pb-2"> <!-- 날짜 -->
<i class="bx bxs-envelope"></i> <div class="d-flex flex-sm-row align-items-center pb-2">
<div class="ms-2">{{ member.MEMBERIDS }}@local-host.co.kr</div> <div class="">{{ member.MEMBERNAM }}</div>
</div>
<!-- 참여자 -->
<div class="d-flex flex-sm-row align-items-center pb-2">
<i class="bx bxs-envelope"></i>
<div class="ms-2">{{ member.MEMBERIDS }}@local-host.co.kr</div>
</div>
<div class="d-flex flex-sm-row align-items-center pb-2">
<i class="bx bxs-phone"></i>
<div class="ms-2">{{ $common.addHyphenToPhoneNumber(member.MEMBERTEL) }}</div>
</div>
<div class="d-flex flex-sm-row align-items-center pb-2">
<i class="bx bx-calendar"></i>
<div class="ms-2">{{ $common.dateFormatter(member.MEMBERRDT) }}</div>
</div>
</div> </div>
<div class="d-flex flex-sm-row align-items-center pb-2"> <div class="col-3">
<i class="bx bxs-phone"></i> <div class="align-items-center">
<div class="ms-2">{{ $common.addHyphenToPhoneNumber(member.MEMBERTEL) }}</div> <label class="switch"
</div> ><input type="checkbox" :checked="checked" @change="handleRegisterMember($event)" /><span
<div class="d-flex flex-sm-row align-items-center pb-2"> class="slider round"
<i class="bx bx-calendar"></i> ></span
<div class="ms-2">{{ $common.dateFormatter(member.MEMBERRDT) }}</div> ></label>
</div> </div>
</div>
<div class="col-3">
<div class="align-items-center">
<label class="switch"><input type="checkbox" checked="" /><span class="slider round"></span></label>
</div> </div>
</div> </div>
</div> </div>
@ -51,13 +58,24 @@
import $api from '@api'; import $api from '@api';
const memberList = ref([]); const memberList = ref([]);
const checked = ref(false);
const fetchRegisterMemberList = async () => { const fetchRegisterMemberList = async () => {
const { data } = await $api.get('main/registerMemberList'); const { data } = await $api.get('main/registerMemberList');
if (data?.data) memberList.value = data.data; if (data?.data) memberList.value = data.data;
}; };
const handleRegisterMember = async e => {
console.log(e);
};
onMounted(async () => { onMounted(async () => {
await fetchRegisterMemberList(); await fetchRegisterMemberList();
}); });
</script> </script>
<style scoped>
.card {
font-size: 0.9rem;
}
</style>