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