+}

+

+.no-data {

+  display: flex;

+  align-items: center;

+  justify-content: center;

+  height: 100%;

+}

+

+.no-data p {

+  font-size: 1.6rem;

+}

+

+.logo .bo {

+  position: absolute;

+  left: 60px;

+  z-index: 2;

+  font-family: var(--font-AuctionGothicBold);

+}

+

+header .logo .bo {

+  top: 10px;

+}

+

+.nav .logo .bo {

+  top: 15px;

+    root._logo.dispose();

+    root._logo.dispose();

+  const state = useSelector((state) => { return state });

+        <h1 className="logo">

+          {state.loginUser['government_id'] == "G2" ?

+            <span className="bo">보훈</span>

+            : null}

+          <img src={logo} alt="" />

+        </h1>

+            <p className="header-info-id">{state.loginUser['user_name']}({state.loginUser['user_id']})</p>

+          <Weather />

+        <h1 className="logo">

+          {state.loginUser['government_id'] == "G2" ?

+            <span className="bo">보훈</span>

+            : null}

+          <img src={logo} alt="" />

+        </h1>

+  //장비 대여 모달 여부

+  const [modalRentalIsOpen, setModalRentalIsOpen] = React.useState(false);

+  //장비 대여 오픈

+  const modalRentalOpen = (item) => {

+    setSelectEquipment(item);

+    mySenior['search']['agency_id'] = item['agency_id'];

+    mySeniorSelectList(1);

+    setModalRentalIsOpen(true);

+  };

+  //장비 대여 닫기

+  const modalRentalClose = () => {

+    setModalRentalIsOpen(false);

+  };

+

+  //장비 대여 등록 정보

+  const [selectEquipment, setSelectEquipment] = React.useState()

+

+  //장비 대여 등록

+  const equipmentRentalInsert = (senior) => {

+    if (confirm('해당 장비를 추가하시겠습니까?') == false) {

+      return;

+    }

+

+    selectEquipment['agency_id'] = senior['agency_id']; // 장비에 시행기관이 '없음'일 경우 배포한 시니어의 시행기관을 등록 

+    selectEquipment['senior_id'] = senior['senior_id'];

+    selectEquipment['rental_start_date'] = new Date();

+

+    fetch("/equipment/equipmentRentalInsert.json", {

+      method: "POST",

+      headers: {

+        'Content-Type': 'application/json; charset=UTF-8'

+      },

+      body: JSON.stringify(selectEquipment),

+    }).then((response) => response.json()).then((data) => {

+      console.log("장비 대여 등록 결과(건수) : ", data);

+      if (data > 0) {

+        alert("추가완료");

+        rentalEquipmentSelectList();

+        modalRentalClose();

+      } else {

+        alert("장비추가에 실패하였습니다. 관리자에게 문의바랍니다.");

+      }

+    }).catch((error) => {

+      console.log('seniorSelectOne() /user/seniorSelectOne.json error : ', error);

+    });

+  };

+

+  // 소속기관 내 시니어

+  const [mySenior, setMySenior] = React.useState({

+    seniorList: [],

+    seniorListCount: 0,

+    search: {

+      'government_id': defaultGovernmentId,

+      'agency_id': defaultAgencyId,

+      'user_use': true,

+      'equipment_search': 'IS_NULL',

+      'currentPage': 1,

+      'perPage': 5,

+    }

+  });

+  // 소속기관 내 시니어 목록 조회

+  const mySeniorSelectList = (currentPage) => {

+    mySenior.search.currentPage = CommonUtil.isEmpty(currentPage) ? 1 : currentPage;

+

+    fetch("/user/seniorSelectList.json", {

+      method: "POST",

+      headers: {

+        'Content-Type': 'application/json; charset=UTF-8'

+      },

+      body: JSON.stringify(mySenior.search),

+    }).then((response) => response.json()).then((data) => {

+      data.search = mySenior.search;

+      console.log(" 소속기관 내 시니어 목록 조회 : ", data);

+      setMySenior(data);

+    }).catch((error) => {

+      console.log('seniorSelectList() /user/seniorSelectList.json error : ', error);

+    });

+            <th>장비대여</th>

+                <td cata-label="장비대여">

+                  {CommonUtil.isEmpty(item['user_name']) == false ? '-'

+                    : (<button className={"btn-small gray-btn"} onClick={() => modalRentalOpen(item)}>장비대여</button>)}

+                </td>

+              <td colSpan={11}>조회된 데이터가 없습니다</td>

+

+      <Modal open={modalRentalIsOpen} close={modalRentalClose} header="장비 배포 시니어 선택">

+        <div className="board-wrap">

+          <table className={"protector-user"}>

+            <thead>

+              <tr>

+                <th>No</th>

+                <th>소속기관명</th>

+                <th>이름</th>

+                <th>생년월일</th>

+                <th>성별</th>

+                <th>배포</th>

+              </tr>

+            </thead>

+            <tbody>

+              {mySenior.seniorList.map((item, idx) => {

+                return (

+                  <tr key={idx}>

+                    <td data-label="No">{mySenior.seniorListCount - idx - (mySenior.search.currentPage - 1) * mySenior.search.perPage}</td>

+                    <td data-label="소속기관명">{item['agency_name']}</td>

+                    <td data-label="이름">{item['user_name']}</td>

+                    <td data-label="생년월일">{item['user_birth']}</td>

+                    <td data-label="성별">{item['user_gender']}</td>

+                    <td data-label="배포">

+                      <button className="btn-small gray-btn" onClick={() => { equipmentRentalInsert(item) }}>배포하기</button>

+                    </td>

+                  </tr>

+                )

+              })}

+              {CommonUtil.isEmpty(mySenior.seniorList) ?

+                <tr>

+                  <td colSpan={8}>조회된 데이터가 없습니다</td>

+                </tr>

+                : null}

+            </tbody>

+          </table>

+          <Pagination

+            currentPage={mySenior.search.currentPage}

+            perPage={mySenior.search.perPage}

+            totalCount={mySenior.seniorListCount}

+            maxRange={5}

+            click={mySeniorSelectList}

+          />

+        </div>

+      </Modal>

+            {

+              medicationSelectListByNew.length > 0 ?

+                <Chart10 data={medicationSelectListByMonth} />

+                : <div className="no-data"><p>데이터가 없습니다.</p></div>

+            }

+                {medicationSelectListByYear.length > 0 ? (

+                  medicationSelectListByYear.map((item, idx) => {

+                    return (

+                      <tr>

+                        <td>{item['year']}</td>

+                        <td>{item['average'] == '-' ? '-' : item['average'] + '%'}</td>

+                        {CommonUtil.isEmpty(item['data']) == false ? (

+                          item['data'].map((item1, idx1) => {

+                            return (

+                              <>

+                                <td>{item1 == '-' ? '-' : item1 + '%'}</td>

+                              </>

+                            )

+                          })

+                        ) : null}

+                      </tr>

+                    )

+                  })

+                ) :

+                  <tr>

+                    <td colSpan={14}>데이터가 없습니다.</td>

+                  </tr>

+                }

+            {

+              medicationSelectListByNew.length > 0 ?

+                <Chart8 data={medicationSelectListByNew} />

+                : <div className="no-data"><p>데이터가 없습니다.</p></div>

+            }

+            {

+              seniorGenderData.length > 0 ?

+                <Chart7 data={seniorGenderData} />

+                : <div className="no-data"><p>데이터가 없습니다.</p></div>

+            }

+            {

+              visit.length > 0 ?

+                <Chart8 data={medicationSelectListByNew} />

+                : <div className="no-data"><p>데이터가 없습니다.</p></div>

+            }

+          <div style={{ height: 'calc(100% - 60px)' }}>

+            {

+              visit.length > 0 ?

+                <Chart2_govern data={medicationSelectListByMonth} />

+                : <div className="no-data"><p>데이터가 없습니다.</p></div>

+            }

+          </div>

+          <div style={{ height: 'calc(100% - 60px)' }}>

+            {

+              visit.length > 0 ?

+                <RowChart_govern data={visit} />

+                : <div className="no-data"><p>데이터가 없습니다.</p></div>

+            }

+          </div>

+          <div style={{ height: 'calc(100% - 60px)' }}>

+            {

+              seniorEnroll.length > 0 ?

+                <Chart5_agencyadmin data={seniorEnroll} />

+                : <div className="no-data"><p>데이터가 없습니다.</p></div>

+            }

+          </div>

+              {medicationSelectListByYear.length > 0 ? (

+                medicationSelectListByYear.map((item, idx) => {

+                  return (

+                    <tr>

+                      <td>{item['year']}</td>

+                      <td>{item['average'] == '-' ? '-' : item['average'] + '%'}</td>

+                      {CommonUtil.isEmpty(item['data']) == false ? (

+                        item['data'].map((item1, idx1) => {

+                          return (

+                            <>

+                              <td>{item1 == '-' ? '-' : item1 + '%'}</td>

+                            </>

+                          )

+                        })

+                      ) : null}

+                    </tr>

+                  )

+                })

+              ) :

+                <tr>

+                  <td colSpan={14}>데이터가 없습니다.</td>

+                </tr>

+              }

+            {

+              medicationSelectListByNew.length > 0 ?

+                <Chart8 data={medicationSelectListByNew} />

+                : <div className="no-data"><p>데이터가 없습니다.</p></div>

+            }

+          <div style={{ height: 'calc(100% - 60px)' }}>

+            {

+              medicationSelectListByMonth.length > 0 ?

+                <Chart2_govern data={medicationSelectListByMonth} />

+                : <div className="no-data"><p>데이터가 없습니다.</p></div>

+            }

+          </div>

+          <div style={{ height: 'calc(100% - 60px)' }}>

+            {

+              seniorEnroll.length > 0 ?

+                <Chart5 data={seniorEnroll} />

+                : <div className="no-data"><p>데이터가 없습니다.</p></div>

+            }

+          </div>

+          <div style={{ height: 'calc(100% - 60px)' }}>

+            {

+              equipmentUsage.length > 0 ?

+                <Donut1_govern data={equipmentUsage} />

+                : <div className="no-data"><p>데이터가 없습니다.</p></div>

+            }

+          </div>

+import React from "react";

+import { useNavigate, useLocation } from "react-router";

+import { useSelector } from "react-redux";

+

+import ContentTitle from "../../component/ContentTitle.jsx";

+import SubTitle from "../../component/SubTitle.jsx";

+import Modal_SeniorInsert from "../../component/Modal_SeniorInsert.jsx";

+import Modal_Guardian from "../../component/Modal_Guardian.jsx";

+import Pagination from "../../component/Pagination.jsx";

+import House from "../../../resources/files/icon/house.png";

+import Arrow from "../../../resources/files/icon/arrow.png";

+

+import CommonUtil from "../../../resources/js/CommonUtil.js";

+

+export default function UserAuthoriySelect() {

+  const navigate = useNavigate();

+  const location = useLocation();

+

+  //전역 변수 저장 객체

+  const state = useSelector((state) => { return state });

+  const defaultGovernmentId = CommonUtil.isEmpty(state.loginUser) ? null : state.loginUser['government_id'];

+

+  //활성화 탭 (시스템 업무 역할별)

+  const [tabActiveByRoleType, setTabActiveByRoleType] = React.useState('ROLE_AGENCY');

+

+  //보호자 모달 오픈 여부

+  const [modalGuardianIsOpen, setModalGuardianIsOpen] = React.useState(false);

+  //보호자 모달 오픈

+  const modalGuardianOpen = () => {

+    setModalGuardianIsOpen(true);

+  };

+  //보호자 모달 닫기

+  const modalGuardianClose = () => {

+    setModalGuardianIsOpen(false);

+  };

+

+  //대상자(시니어) 등록 모달 오픈 여부

+  const [modalSeniorInsertIsOpen, setModalSeniorInsertIsOpen] = React.useState(false);

+  //대상자(시니어) 등록 모달 오픈

+  const modalSeniorInsertOpen = () => {

+    setModalSeniorInsertIsOpen(true);

+  };

+  //대상자(시니어) 등록 모달 닫기

+  const modalSeniorInsertClose = () => {

+    setModalSeniorInsertIsOpen(false);

+  };

+

+  //기관 계층 구조 목록

+  const [orgListOfHierarchy, setOrgListOfHierarchy] = React.useState([]);

+  //기관(관리, 시행) 계층 구조 목록 조회

+  const orgSelectListOfHierarchy = () => {

+    fetch("/org/orgSelectListOfHierarchy.json", {

+      method: "POST",

+      headers: {

+        'Content-Type': 'application/json; charset=UTF-8'

+      },

+      body: JSON.stringify({ 'government_id': defaultGovernmentId }),

+    }).then((response) => response.json()).then((data) => {

+      console.log("기관(관리, 시행) 계층 구조 목록 조회 : ", data);

+      setOrgListOfHierarchy(data);

+    }).catch((error) => {

+      console.log('orgSelectListOfHierarchy() /org/orgSelectListOfHierarchy.json error : ', error);

+    });

+  };

+

+

+  // user_state

+  const [isViewType, setIsViewType] = React.useState(true);

+  //검색 변수 (초기화값)

+  const [userSearch, setUserSearch] = React.useState({

+    'government_id': state.loginUser['government_id'],

+    'agency_id': state.loginUser['agency_id'],

+    'authority': null,

+    'user_use': isViewType,

+

+    'searchType': null,

+    'searchText': null,

+    'currentPage': 1,

+    'perPage': 10,

+  });

+

+  //대상자(시니어) 목록 및 페이징 정보

+  userSearch['authority'] = 'ROLE_SENIOR';

+  const [senior, setSenior] = React.useState({ userList: [], userListCount: 0, search: JSON.parse(JSON.stringify(userSearch)) });

+  const seniorSearchChange = (targetKey, value) => {

+    let newSenior = JSON.parse(JSON.stringify(senior));

+    newSenior.search[targetKey] = value;

+    setSenior(newSenior);

+  }

+  const seniorSelectListEnter = (key) => {

+    if (key == 'Enter') {

+      seniorSelectList();

+    } else {

+      return;

+    }

+  }

+  //대상자(시니어) 목록 조회

+  const seniorSelectList = (currentPage) => {

+    senior.search.currentPage = CommonUtil.isEmpty(currentPage) ? 1 : currentPage;

+

+    fetch("/user/userSelectList.json", {

+      method: "POST",

+      headers: {

+        'Content-Type': 'application/json; charset=UTF-8'

+      },

+      body: JSON.stringify(senior.search),

+    }).then((response) => response.json()).then((data) => {

+      data.search = senior.search;

+      console.log("대상자(시니어) 목록 조회 : ", data);

+      setSenior(data);

+    }).catch((error) => {

+      console.log('seniorSelectList() /user/userSelectList.json error : ', error);

+    });

+  }

+

+  //시행기관 담당자 목록 및 페이징 정보

+  userSearch['authority'] = 'ROLE_AGENCY';

+  const [agent, setAgent] = React.useState({ userList: [], userListCount: 0, search: JSON.parse(JSON.stringify(userSearch)) });

+  const agentSearchChange = (targetKey, value) => {

+    let newAgent = JSON.parse(JSON.stringify(agent));

+    newAgent.search[targetKey] = value;

+    setAgent(newAgent);

+  }

+  const agentSelectListEnter = (key) => {

+    if (key == 'Enter') {

+      agentSelectList();

+    } else {

+      return;

+    }

+  }

+  //시행기관 담당자 목록 조회

+  const agentSelectList = (currentPage) => {

+    agent.search.currentPage = CommonUtil.isEmpty(currentPage) ? 1 : currentPage;

+

+    fetch("/user/userSelectList.json", {

+      method: "POST",

+      headers: {

+        'Content-Type': 'application/json; charset=UTF-8'

+      },

+      body: JSON.stringify(agent.search),

+    }).then((response) => response.json()).then((data) => {

+      data.search = agent.search;

+      console.log("시행기관 담당자 목록 조회 : ", data);

+      setAgent(data);

+    }).catch((error) => {

+      console.log('agentSelectList() /user/userSelectList.json error : ', error);

+    });

+  }

+

+  //시행기관 관리자 목록 및 페이징 정보

+  userSearch['authority'] = 'ROLE_AGENCYADMIN';

+  const [agentAdmin, setAgentAdmin] = React.useState({ userList: [], userListCount: 0, search: JSON.parse(JSON.stringify(userSearch)) });

+  const agentAdminSearchChange = (targetKey, value) => {

+    let newAgent = JSON.parse(JSON.stringify(agentAdmin));

+    newAgent.search[targetKey] = value;

+    setAgentAdmin(newAgent);

+  }

+  const agentAdminSelectListEnter = (key) => {

+    if (key == 'Enter') {

+      agentAdminSelectList();

+    } else {

+      return;

+    }

+  }

+  //시행기관 관리자 목록 조회

+  const agentAdminSelectList = (currentPage) => {

+    agentAdmin.search.currentPage = CommonUtil.isEmpty(currentPage) ? 1 : currentPage;

+

+    fetch("/user/userSelectList.json", {

+      method: "POST",

+      headers: {

+        'Content-Type': 'application/json; charset=UTF-8'

+      },

+      body: JSON.stringify(agentAdmin.search),

+    }).then((response) => response.json()).then((data) => {

+      data.search = agentAdmin.search;

+      console.log("시행기관 관리자 목록 조회 : ", data);

+      setAgentAdmin(data);

+    }).catch((error) => {

+      console.log('agentSelectList() /user/userSelectList.json error : ', error);

+    });

+  }

+

+  //관리기관 관리자 목록 및 페이징 정보

+  userSearch['authority'] = 'ROLE_GOVERNMENT';

+  const [government, setGovernment] = React.useState({ userList: [], userListCount: 0, search: JSON.parse(JSON.stringify(userSearch)) });

+  const governmentSearchChange = (targetKey, value) => {

+    let newGovernment = JSON.parse(JSON.stringify(government));

+    newGovernment.search[targetKey] = value;

+    setGovernment(newGovernment);

+  }

+  const governmentSelectListEnter = (key) => {

+    if (key == 'Enter') {

+      governmentSelectList();

+    } else {

+      return;

+    }

+  }

+  //관리기관 담당자 목록 조회

+  const governmentSelectList = (currentPage) => {

+    government.search.currentPage = CommonUtil.isEmpty(currentPage) ? 1 : currentPage;

+

+    fetch("/user/userSelectList.json", {

+      method: "POST",

+      headers: {

+        'Content-Type': 'application/json; charset=UTF-8'

+      },

+      body: JSON.stringify(government.search),

+    }).then((response) => response.json()).then((data) => {

+      data.search = government.search;

+      console.log("관리기관 담당자 목록 조회 : ", data);

+      setGovernment(data);

+    }).catch((error) => {

+      console.log('governmentSelectList() /user/userSelectList.json error : ', error);

+    });

+  }

+

+  //시스템 관리자 목록 및 페이징 정보

+  userSearch['authority'] = 'ROLE_ADMIN';

+  const [admin, setAdmin] = React.useState({ userList: [], userListCount: 0, search: JSON.parse(JSON.stringify(userSearch)) });

+  const adminSearchChange = (targetKey, value) => {

+    let newAdmin = JSON.parse(JSON.stringify(admin));

+    newAdmin.search[targetKey] = value;

+    setAdmin(newAdmin);

+  }

+  const adminSelectListEnter = (key) => {

+    if (key == 'Enter') {

+      adminSelectList();

+    } else {

+      return;

+    }

+  }

+  //시스템 관리자 목록 조회

+  const adminSelectList = (currentPage) => {

+    admin.search.currentPage = CommonUtil.isEmpty(currentPage) ? 1 : currentPage;

+

+    fetch("/user/userSelectList.json", {

+      method: "POST",

+      headers: {