File name
Commit message
Commit date
04-04
File name
Commit message
Commit date
04-04
04-04
File name
Commit message
Commit date
04-04
04-04
04-04
File name
Commit message
Commit date
04-04
04-04
04-04
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
<template>
<div class="content pt50 pb50">
<div class="w1400">
<div class="search-bar mb30">
<input type="text" class="full-input search-input" placeholder="검색어를 입력하세요." v-model="inputSearchText" @keyup.enter="totalSearch"/>
<button class="icon-button search-button" @click="totalSearch">
<svg-icon type="mdi" :path="this.$iconPath()" class="search-icon"></svg-icon>
</button>
</div>
<div class="search-content">
<p class="mb30 box-title"><strong>{{ search.searchText }}</strong>에 대한 <strong class="red-text">총 {{ totalCount }}</strong>건의 검색결과를
찾았습니다.</p>
<ul>
<li class="mb30" v-for="(item, idx) in pageList" :key="idx">
<div class="border background radius pd10">
<p class="chart-title">{{ item.fullMenuNm }} ({{ item.totalListCount }}건)</p>
</div>
<ul class="mb10">
<li class="pd10 border-b" v-for="(subItem, subIdx) in item.previewList" @click="fnView(item, subItem)" style="cursor: pointer;" :key="subIdx">
<div class="flex justify-start align-center mb10">
<div v-if="subItem.title != null && subItem.title != ''" class="gd-10">
<p class="detail-bold ">{{ subItem.title }}</p>
</div>
<div v-else class="gd-10">
<p class="detail-bold ">Q.</p>
</div>
<div class="gd-2">
<p class="date-text text-rg">{{ subItem.regDt }}</p>
</div>
</div>
<div class="content-warp gd-12">
<p class="date-text">{{ subItem.content }}</p>
</div>
</li>
</ul>
<div v-show="item.totalListCount > 5" class="flex justify-end align-center no-gutters">
<div class="gd-1">
<button class="large-btn darkg-border-btn" @click="fnViewList(item)" style="cursor: pointer;">더보기 <svg-icon type="mdi"
:path="path"></svg-icon></button>
</div>
</div>
</li>
<!-- <li class="mb30">
<div class="border background radius pd10">
<p class="chart-title">기업정보(메뉴명)</p>
</div>
<ul class="mb10">
<li class="pd10 border-b">
<div class="flex justify-start align-center mb10">
<div class="gd-10">
<p class="detail-bold ">검색내용에 대한 제목</p>
</div>
<div class="gd-2">
<p class="date-text text-rg">2024-05-02</p>
</div>
</div>
<div class="content-warp gd-12">
<p class="date-text">수행방법 8 2. 인터넷 검색어‘한옥기술’빅데이터 분석 9 1) 네이버 뉴스‘한옥기술’검색어의 주요 이슈 9 2)
네이버 이슈 9 2) 네이버 블로그‘한옥기술’검색어의 주요 이슈 16 3) 한옥기술의 인식 변화 20 3. 인터넷 검색어‘한옥 건축비’빅데이터
분석 21 1) 네이버 21 1) 네이버 뉴스‘한옥 건축비’검색어의 주요 이슈 21 2) 네이버 블로그‘한옥 건축비’검색어수행방법 8 2.
인터넷 검색어‘한옥기술’빅데이터 분석 9 1) 네이버 뉴스‘한옥기술’검색어의 주요 이슈 9 2) 네이버 이슈 9 2) 네이버
블로그‘한옥기술’검색어의 주요 이슈 16 3) 한옥기술의 인식 변화 20 3. 인터넷 검색어‘한옥 건축비’빅데이터 분석 21 1) 네이버21
1) 네이버 뉴스‘한옥 건축비’검색어의 주요 이슈 21 2) 네이버 블로그‘한옥 건축비’검색어</p>
</div>
</li>
<li class="pd10 border-b">
<div class="flex justify-start align-center mb10">
<div class="gd-10">
<p class="detail-bold ">검색내용에 대한 제목</p>
</div>
<div class="gd-2">
<p class="date-text text-rg">2024-05-02</p>
</div>
</div>
<div class="content-warp gd-12">
<p class="date-text">수행방법 8 2. 인터넷 검색어‘한옥기술’빅데이터 분석 9 1) 네이버 뉴스‘한옥기술’검색어의 주요 이슈 9 2)
네이버 이슈 9 2) 네이버 블로그‘한옥기술’검색어의 주요 이슈 16 3) 한옥기술의 인식 변화 20 3. 인터넷 검색어‘한옥 건축비’빅데이터
분석 21 1) 네이버 21 1) 네이버 뉴스‘한옥 건축비’검색어의 주요 이슈 21 2) 네이버 블로그‘한옥 건축비’검색어수행방법 8 2.
인터넷 검색어‘한옥기술’빅데이터 분석 9 1) 네이버 뉴스‘한옥기술’검색어의 주요 이슈 9 2) 네이버 이슈 9 2) 네이버
블로그‘한옥기술’검색어의 주요 이슈 16 3) 한옥기술의 인식 변화 20 3. 인터넷 검색어‘한옥 건축비’빅데이터 분석 21 1) 네이버21
1) 네이버 뉴스‘한옥 건축비’검색어의 주요 이슈 21 2) 네이버 블로그‘한옥 건축비’검색어</p>
</div>
</li>
<li class="pd10 border-b">
<div class="flex justify-start align-center mb10">
<div class="gd-10">
<p class="detail-bold ">검색내용에 대한 제목</p>
</div>
<div class="gd-2">
<p class="date-text text-rg">2024-05-02</p>
</div>
</div>
<div class="content-warp gd-12">
<p class="date-text">수행방법 8 2. 인터넷 검색어‘한옥기술’빅데이터 분석 9 1) 네이버 뉴스‘한옥기술’검색어의 주요 이슈 9 2)
네이버 이슈 9 2) 네이버 블로그‘한옥기술’검색어의 주요 이슈 16 3) 한옥기술의 인식 변화 20 3. 인터넷 검색어‘한옥 건축비’빅데이터
분석 21 1) 네이버 21 1) 네이버 뉴스‘한옥 건축비’검색어의 주요 이슈 21 2) 네이버 블로그‘한옥 건축비’검색어수행방법 8 2.
인터넷 검색어‘한옥기술’빅데이터 분석 9 1) 네이버 뉴스‘한옥기술’검색어의 주요 이슈 9 2) 네이버 이슈 9 2) 네이버
블로그‘한옥기술’검색어의 주요 이슈 16 3) 한옥기술의 인식 변화 20 3. 인터넷 검색어‘한옥 건축비’빅데이터 분석 21 1) 네이버21
1) 네이버 뉴스‘한옥 건축비’검색어의 주요 이슈 21 2) 네이버 블로그‘한옥 건축비’검색어</p>
</div>
</li>
<li class="pd10 border-b">
<div class="flex justify-start align-center mb10">
<div class="gd-10">
<p class="detail-bold ">검색내용에 대한 제목</p>
</div>
<div class="gd-2">
<p class="date-text text-rg">2024-05-02</p>
</div>
</div>
<div class="content-warp gd-12">
<p class="date-text">수행방법 8 2. 인터넷 검색어‘한옥기술’빅데이터 분석 9 1) 네이버 뉴스‘한옥기술’검색어의 주요 이슈 9 2)
네이버 이슈 9 2) 네이버 블로그‘한옥기술’검색어의 주요 이슈 16 3) 한옥기술의 인식 변화 20 3. 인터넷 검색어‘한옥 건축비’빅데이터
분석 21 1) 네이버 21 1) 네이버 뉴스‘한옥 건축비’검색어의 주요 이슈 21 2) 네이버 블로그‘한옥 건축비’검색어수행방법 8 2.
인터넷 검색어‘한옥기술’빅데이터 분석 9 1) 네이버 뉴스‘한옥기술’검색어의 주요 이슈 9 2) 네이버 이슈 9 2) 네이버
블로그‘한옥기술’검색어의 주요 이슈 16 3) 한옥기술의 인식 변화 20 3. 인터넷 검색어‘한옥 건축비’빅데이터 분석 21 1) 네이버21
1) 네이버 뉴스‘한옥 건축비’검색어의 주요 이슈 21 2) 네이버 블로그‘한옥 건축비’검색어</p>
</div>
</li>
<li class="pd10 border-b">
<div class="flex justify-start align-center mb10">
<div class="gd-10">
<p class="detail-bold ">검색내용에 대한 제목</p>
</div>
<div class="gd-2">
<p class="date-text text-rg">2024-05-02</p>
</div>
</div>
<div class="content-warp gd-12">
<p class="date-text">수행방법 8 2. 인터넷 검색어‘한옥기술’빅데이터 분석 9 1) 네이버 뉴스‘한옥기술’검색어의 주요 이슈 9 2)
네이버 이슈 9 2) 네이버 블로그‘한옥기술’검색어의 주요 이슈 16 3) 한옥기술의 인식 변화 20 3. 인터넷 검색어‘한옥 건축비’빅데이터
분석 21 1) 네이버 21 1) 네이버 뉴스‘한옥 건축비’검색어의 주요 이슈 21 2) 네이버 블로그‘한옥 건축비’검색어수행방법 8 2.
인터넷 검색어‘한옥기술’빅데이터 분석 9 1) 네이버 뉴스‘한옥기술’검색어의 주요 이슈 9 2) 네이버 이슈 9 2) 네이버
블로그‘한옥기술’검색어의 주요 이슈 16 3) 한옥기술의 인식 변화 20 3. 인터넷 검색어‘한옥 건축비’빅데이터 분석 21 1) 네이버21
1) 네이버 뉴스‘한옥 건축비’검색어의 주요 이슈 21 2) 네이버 블로그‘한옥 건축비’검색어</p>
</div>
</li>
</ul>
<div class="flex justify-end align-center no-gutters">
<div class="gd-1">
<button class="large-btn darkg-border-btn">더보기 <svg-icon type="mdi"
:path="path"></svg-icon></button>
</div>
</div>
</li>
<li class="mb30">
<div class="border background radius pd10">
<p class="chart-title">기업정보(메뉴명)</p>
</div>
<ul class="mb10">
<li class="pd10 border-b">
<div class="flex justify-start align-center mb10">
<div class="gd-10">
<p class="detail-bold ">검색내용에 대한 제목</p>
</div>
<div class="gd-2">
<p class="date-text text-rg">2024-05-02</p>
</div>
</div>
<div class="content-warp gd-12">
<p class="date-text">수행방법 8 2. 인터넷 검색어‘한옥기술’빅데이터 분석 9 1) 네이버 뉴스‘한옥기술’검색어의 주요 이슈 9 2)
네이버 이슈 9 2) 네이버 블로그‘한옥기술’검색어의 주요 이슈 16 3) 한옥기술의 인식 변화 20 3. 인터넷 검색어‘한옥 건축비’빅데이터
분석 21 1) 네이버 21 1) 네이버 뉴스‘한옥 건축비’검색어의 주요 이슈 21 2) 네이버 블로그‘한옥 건축비’검색어수행방법 8 2.
인터넷 검색어‘한옥기술’빅데이터 분석 9 1) 네이버 뉴스‘한옥기술’검색어의 주요 이슈 9 2) 네이버 이슈 9 2) 네이버
블로그‘한옥기술’검색어의 주요 이슈 16 3) 한옥기술의 인식 변화 20 3. 인터넷 검색어‘한옥 건축비’빅데이터 분석 21 1) 네이버21
1) 네이버 뉴스‘한옥 건축비’검색어의 주요 이슈 21 2) 네이버 블로그‘한옥 건축비’검색어</p>
</div>
</li>
<li class="pd10 border-b">
<div class="flex justify-start align-center mb10">
<div class="gd-10">
<p class="detail-bold ">검색내용에 대한 제목</p>
</div>
<div class="gd-2">
<p class="date-text text-rg">2024-05-02</p>
</div>
</div>
<div class="content-warp gd-12">
<p class="date-text">수행방법 8 2. 인터넷 검색어‘한옥기술’빅데이터 분석 9 1) 네이버 뉴스‘한옥기술’검색어의 주요 이슈 9 2)
네이버 이슈 9 2) 네이버 블로그‘한옥기술’검색어의 주요 이슈 16 3) 한옥기술의 인식 변화 20 3. 인터넷 검색어‘한옥 건축비’빅데이터
분석 21 1) 네이버 21 1) 네이버 뉴스‘한옥 건축비’검색어의 주요 이슈 21 2) 네이버 블로그‘한옥 건축비’검색어수행방법 8 2.
인터넷 검색어‘한옥기술’빅데이터 분석 9 1) 네이버 뉴스‘한옥기술’검색어의 주요 이슈 9 2) 네이버 이슈 9 2) 네이버
블로그‘한옥기술’검색어의 주요 이슈 16 3) 한옥기술의 인식 변화 20 3. 인터넷 검색어‘한옥 건축비’빅데이터 분석 21 1) 네이버21
1) 네이버 뉴스‘한옥 건축비’검색어의 주요 이슈 21 2) 네이버 블로그‘한옥 건축비’검색어</p>
</div>
</li>
<li class="pd10 border-b">
<div class="flex justify-start align-center mb10">
<div class="gd-10">
<p class="detail-bold ">검색내용에 대한 제목</p>
</div>
<div class="gd-2">
<p class="date-text text-rg">2024-05-02</p>
</div>
</div>
<div class="content-warp gd-12">
<p class="date-text">수행방법 8 2. 인터넷 검색어‘한옥기술’빅데이터 분석 9 1) 네이버 뉴스‘한옥기술’검색어의 주요 이슈 9 2)
네이버 이슈 9 2) 네이버 블로그‘한옥기술’검색어의 주요 이슈 16 3) 한옥기술의 인식 변화 20 3. 인터넷 검색어‘한옥 건축비’빅데이터
분석 21 1) 네이버 21 1) 네이버 뉴스‘한옥 건축비’검색어의 주요 이슈 21 2) 네이버 블로그‘한옥 건축비’검색어수행방법 8 2.
인터넷 검색어‘한옥기술’빅데이터 분석 9 1) 네이버 뉴스‘한옥기술’검색어의 주요 이슈 9 2) 네이버 이슈 9 2) 네이버
블로그‘한옥기술’검색어의 주요 이슈 16 3) 한옥기술의 인식 변화 20 3. 인터넷 검색어‘한옥 건축비’빅데이터 분석 21 1) 네이버21
1) 네이버 뉴스‘한옥 건축비’검색어의 주요 이슈 21 2) 네이버 블로그‘한옥 건축비’검색어</p>
</div>
</li>
<li class="pd10 border-b">
<div class="flex justify-start align-center mb10">
<div class="gd-10">
<p class="detail-bold ">검색내용에 대한 제목</p>
</div>
<div class="gd-2">
<p class="date-text text-rg">2024-05-02</p>
</div>
</div>
<div class="content-warp gd-12">
<p class="date-text">수행방법 8 2. 인터넷 검색어‘한옥기술’빅데이터 분석 9 1) 네이버 뉴스‘한옥기술’검색어의 주요 이슈 9 2)
네이버 이슈 9 2) 네이버 블로그‘한옥기술’검색어의 주요 이슈 16 3) 한옥기술의 인식 변화 20 3. 인터넷 검색어‘한옥 건축비’빅데이터
분석 21 1) 네이버 21 1) 네이버 뉴스‘한옥 건축비’검색어의 주요 이슈 21 2) 네이버 블로그‘한옥 건축비’검색어수행방법 8 2.
인터넷 검색어‘한옥기술’빅데이터 분석 9 1) 네이버 뉴스‘한옥기술’검색어의 주요 이슈 9 2) 네이버 이슈 9 2) 네이버
블로그‘한옥기술’검색어의 주요 이슈 16 3) 한옥기술의 인식 변화 20 3. 인터넷 검색어‘한옥 건축비’빅데이터 분석 21 1) 네이버21
1) 네이버 뉴스‘한옥 건축비’검색어의 주요 이슈 21 2) 네이버 블로그‘한옥 건축비’검색어</p>
</div>
</li>
<li class="pd10 border-b">
<div class="flex justify-start align-center mb10">
<div class="gd-10">
<p class="detail-bold ">검색내용에 대한 제목</p>
</div>
<div class="gd-2">
<p class="date-text text-rg">2024-05-02</p>
</div>
</div>
<div class="content-warp gd-12">
<p class="date-text">수행방법 8 2. 인터넷 검색어‘한옥기술’빅데이터 분석 9 1) 네이버 뉴스‘한옥기술’검색어의 주요 이슈 9 2)
네이버 이슈 9 2) 네이버 블로그‘한옥기술’검색어의 주요 이슈 16 3) 한옥기술의 인식 변화 20 3. 인터넷 검색어‘한옥 건축비’빅데이터
분석 21 1) 네이버 21 1) 네이버 뉴스‘한옥 건축비’검색어의 주요 이슈 21 2) 네이버 블로그‘한옥 건축비’검색어수행방법 8 2.
인터넷 검색어‘한옥기술’빅데이터 분석 9 1) 네이버 뉴스‘한옥기술’검색어의 주요 이슈 9 2) 네이버 이슈 9 2) 네이버
블로그‘한옥기술’검색어의 주요 이슈 16 3) 한옥기술의 인식 변화 20 3. 인터넷 검색어‘한옥 건축비’빅데이터 분석 21 1) 네이버21
1) 네이버 뉴스‘한옥 건축비’검색어의 주요 이슈 21 2) 네이버 블로그‘한옥 건축비’검색어</p>
</div>
</li>
</ul>
<div class="flex justify-end align-center no-gutters">
<div class="gd-1">
<button class="large-btn darkg-border-btn">더보기 <svg-icon type="mdi"
:path="path"></svg-icon></button>
</div>
</div>
</li> -->
</ul>
</div>
</div>
</div>
</template>
<script>
import { toRaw } from 'vue'
import store from "../../../AppStore";
import { mdiArrowRightDropCircleOutline } from '@mdi/js';
import queryParams from '../../../../../resources/js/queryParams';
import { defaultTotalSearchParams } from "../../../../../resources/js/defaultTotalSearchParams.js"
import { searchAll } from "../../../../../resources/api/search.js";
import { defaultSearchParams } from "../../../../../resources/js/defaultSearchParams.js"
export default {
mixins: [queryParams],
data() {
return {
path: mdiArrowRightDropCircleOutline,
search: { ...defaultTotalSearchParams },
pageSearch: { ...defaultSearchParams },
mbrId: store.state.mbrId || null, // 사용자 아이디
roles: store.state.roles.map(auth => auth.authority) || [], // 사용자 권한
menuType: store.state.userType || null, // 메뉴 타입
inputSearchText: '',
totalCount: 0,
menuCount: 0,
menuList: [],
pageCount: 0,
pageList: [],
}
},
created() {
this.resotreQueryParams('totalSearchQueryParams');
this.checkSearchText();
},
methods: {
// 검색어 확인
checkSearchText() {
if(this.search.searchText !== "") {
this.inputSearchText = this.search.searchText;
this.totalSearch();
}
},
// 통합 검색
async totalSearch() {
if(this.search.searchText === "") {
alert("검색어를 입력해주세요.");
return;
}
this.search.searchText = this.inputSearchText
this.search.mbrId = this.mbrId;
this.search.roles = this.roles;
this.search.menuType = this.menuType;
this.saveQueryParams('totalSearchQueryParams', this.search); // 검색조건 저장
try {
const res = await searchAll(toRaw(this.search));
this.menuCount = res.data.data.menuCount;
this.menuList = res.data.data.menuList;
this.pageCount = res.data.data.pageCount;
this.pageList = res.data.data.pageList;
this.totalCount = this.menuCount + this.pageCount;
} catch (error) {
alert('에러가 발생했습니다.\n시스템관리자에게 문의하세요.');
}
},
// 메뉴 목록으로 이동
fnViewList(item) {
this.$router.push({
path: item.routerUrl
});
},
// 메뉴 상세 조회로 이동
fnView(item, subItem) {
let menuPath = null;
if(item.routerUrl.includes('.page')) {
const lastSlashIndex = item.routerUrl.lastIndexOf('/'); // 마지막 '/' 인덱스
menuPath = item.routerUrl.substring(0, lastSlashIndex) ; // 마지막 '/' 이전 경로
}
// 페이지 검색 조건 저장
this.pageSearch.searchText = this.search.searchText;
this.saveQueryParams('queryParams', this.pageSearch); // 검색조건 저장
// 일반 검색 결과
if(subItem.title != null && subItem.title != '') {
this.$router.push({
path: menuPath + '/view.page',
query: {
pageId: subItem.pageId
},
});
}
// 질의형 검색 결과
else {
this.$router.push({
path: item.routerUrl
});
}
},
},
watch: {
},
computed: {
},
components: {
},
mounted() {
}
}
</script>