File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
<template>
<div class="rrmse-wrap" :style="isLoading ? { cursor: 'wait' } : {}">
<!-- 로딩 시 화면을 덮는 반투명 오버레이 -->
<div v-if="isLoading" class="loading-overlay">
<div class="loading-div">
<span>LOADING </span>
<span class="anima">.</span>
<span class="anima">.</span>
<span class="anima">.</span>
</div>
</div>
<div class="container">
<div class="page-titleZone flex justify-between align-center align-center">
<p class="main-title flex80">데이터 활용</p>
<PageNavigation />
</div>
<div class="content-wrap">
<div class="content content-box">
<div class="row content-box">
<div class="flex-column justify-between">
<div class="table-zone flex95">
<table class="form-table">
<colgroup>
<col width="10%" />
<col width="80%" />
<col width="10%" />
</colgroup>
<tbody>
<tr>
<th>제목</th>
<td colspan="2">{{ pageInfo["ttl"] }}</td>
</tr>
<tr>
<th>공개여부</th>
<td colspan="2">
<div class="input-container flex">
<label class="radio-label">
<input type="radio" name="public_at" class="custom-radiobox" :value="true" v-model="pageInfo['public_at']" disabled />
<span>공개</span>
</label>
<label class="radio-label">
<input type="radio" name="public_at" class="custom-radiobox" :value="false" v-model="pageInfo['public_at']" disabled />
<span>비공개</span>
</label>
</div>
</td>
</tr>
<tr>
<th>내용</th>
<td colspan="2">
<div style="min-height: 100px"> {{ pageInfo["cn"] }} </div>
</td>
</tr>
<!-- <tr>
<th>페이지 URL</th>
<td>{{ pageInfo["url"] }}</td>
<td>
<button class="large-btn darkg-btn">URL 복사</button>
</td>
</tr> -->
</tbody>
</table>
<div class="content-titleZone mt20">
<p class="box-title">커스텀한 페이지</p>
</div>
<div style="width: 100%; height: 1000px">
<SplitterLayout style="width: 100%; height: 100%" id="SplitterLayout" :splitInfo="splitInfo_dumy" :selectLayout="selectLayout"></SplitterLayout>
</div>
</div>
<div class="flex justify-end flex5">
<button class="red-border-btn small-btn" @click="pageDel"> 삭제 </button>
<button class="blue-border-btn small-btn" @click="pageUpdate"> 수정 </button>
<button class="blue-border-btn small-btn" @click="moveList"> 목록 </button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import SvgIcon from "@jamescoyle/vue-icon";
import axios from "axios";
import SplitterLayout from "../../component/SplitterLayoutDev.vue";
export default {
data() {
return {
page_id: null, // get pageId
showSplit: true,
pageInfo: {},
splitInfo: _.cloneDeep(this.$getDefaultJobGroup().customSplitter),
splitInfo_dumy: _.cloneDeep(this.$getDefaultJobGroup().customSplitter),
selectLayout: _.cloneDeep(this.$getDefaultJobGroup().customSplitter),
isLoading: true,
};
},
methods: {
getCustomPageData: function () {
const vm = this;
axios({
url: "/custom/customPageOneDataselect/" + vm.page_id,
method: "get",
headers: {
"Content-Type": "application/json; charset=UTF-8",
},
})
.then(function (response) {
vm.pageInfo = response.data.resultData.pageInfo;
vm.splitInfo = response.data.resultData.splitterInfo;
vm.splitInfo_dumy = _.cloneDeep(
vm.$getDefaultJobGroup().customSplitter
);
vm.splitInfo_dumy.layout_nm = "dumy";
vm.splitInfo_dumy.se = "splitter";
vm.splitInfo_dumy.children.push(vm.splitInfo);
vm.isLoading = false;
vm.selectLayout = vm.splitInfo_dumy;
})
.catch(function (error) {
vm.isLoading = false;
vm.$showAlert(
"데이터 활용 조회",
"데이터 활용 조회 오류, 관리자에게 문의하세요."
);
vm.$router.go(-1); // 오류 시 이전 페이지로 이동
});
},
async pageDel() {
const vm = this;
if (
!(await vm.$showConfirm(
"페이지 삭제",
"해당 페이지를 삭제하시겠습니까?"
))
) {
return;
}
axios({
url: "/custom/customPageDelete/" + vm.page_id,
method: "get",
headers: {
"Content-Type": "application/json; charset=UTF-8",
},
})
.then(function (response) {
vm.$showAlert("페이지 삭제", "페이지가 삭제되었습니다.");
vm.$router.push({ path: "/customSelectList.page", query: {} });
})
.catch(function (error) {
this.$showAlert(
"에러 발생",
"에러가 발생했습니다. 관리자에게 문의해 주세요."
);
});
},
pageUpdate() {
this.$router.push({
path: "/customInsertDev.page",
query: { page_id: this.page_id },
});
},
moveList: function () {
this.$router.push({ path: "/customSelectList.page", query: {} });
},
},
watch: {
splitInfo_dumy: {
handler: function () {
this.selectLayout = this.splitInfo_dumy;
},
deep: true,
},
},
components: {
SvgIcon: SvgIcon,
SplitterLayout,
},
mounted() {
this.page_id = this.$route.query.page_id;
this.getCustomPageData();
},
};
</script>
<style scoped>
.p-splitter-gutter-handle,
.p-splitter-gutter {
pointer-events: none;
}
</style>