사이트 코드와 홈페이지 위젯 추가 v1.5.34
This commit is contained in:
57
components/admin/AdminPostExportFileRow.vue
Normal file
57
components/admin/AdminPostExportFileRow.vue
Normal file
@@ -0,0 +1,57 @@
|
||||
<script setup>
|
||||
/**
|
||||
* 게시물 Export 파일 선택 행
|
||||
* @property {Object} file - Export 파일
|
||||
* @property {boolean} selected - 선택 여부
|
||||
* @property {boolean} disabled - 선택 비활성 여부
|
||||
*/
|
||||
defineProps({
|
||||
file: {
|
||||
type: Object,
|
||||
required: true
|
||||
},
|
||||
selected: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
disabled: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
})
|
||||
|
||||
defineEmits(['toggle'])
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="admin-post-export-file-row grid grid-cols-[auto_minmax(0,1fr)_auto] items-center gap-3 border-b border-[#edf0f3] px-3 py-2 last:border-b-0">
|
||||
<button
|
||||
class="admin-post-export-file-row__check inline-flex size-4 items-center justify-center rounded border border-[#cfd6de] bg-white transition focus:outline-none focus:ring-2 focus:ring-[#15171a] focus:ring-offset-1 disabled:cursor-not-allowed disabled:bg-[#f4f6f8]"
|
||||
type="button"
|
||||
role="checkbox"
|
||||
:aria-checked="selected"
|
||||
:disabled="disabled"
|
||||
:aria-label="`${file.fileName} 선택`"
|
||||
@click="$emit('toggle')"
|
||||
>
|
||||
<span
|
||||
v-if="selected"
|
||||
class="admin-post-export-file-row__check-mark block size-2 rounded-sm bg-[#15171a]"
|
||||
/>
|
||||
</button>
|
||||
<div class="admin-post-export-file-row__body min-w-0">
|
||||
<p class="admin-post-export-file-row__name truncate text-sm font-medium text-[#15171a]">
|
||||
{{ file.fileName }}
|
||||
</p>
|
||||
<p class="admin-post-export-file-row__range mt-0.5 text-xs text-[#9aa3ad]">
|
||||
{{ file.postStart }}-{{ file.postEnd }}
|
||||
</p>
|
||||
</div>
|
||||
<span
|
||||
v-if="file.status !== 'ready' || !file.filePath"
|
||||
class="admin-post-export-file-row__status inline-flex h-8 items-center justify-center rounded px-2 text-xs font-semibold text-[#a6b0bb]"
|
||||
>
|
||||
{{ file.status === 'processing' ? '생성 중' : file.status === 'failed' ? '실패' : '다운로드 대기' }}
|
||||
</span>
|
||||
</div>
|
||||
</template>
|
||||
@@ -77,6 +77,20 @@ defineProps({
|
||||
<path d="M6.328125 14.296875A6.7865625 6.7865625 0 0 0 8.4375 19.21875" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" />
|
||||
</svg>
|
||||
|
||||
<!-- 사이트 코드 -->
|
||||
<svg
|
||||
v-else-if="iconId === 'site-code'"
|
||||
class="admin-settings-nav-icon__svg pointer-events-none size-4"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
>
|
||||
<path d="M8 9 5 12l3 3" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" />
|
||||
<path d="m16 9 3 3 -3 3" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" />
|
||||
<path d="m13 7 -2 10" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" />
|
||||
<path d="M4.5 3.5h15s2 0 2 2v13s0 2 -2 2h-15s-2 0 -2 -2v-13s0 -2 2 -2" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" />
|
||||
</svg>
|
||||
|
||||
<!-- Import/Export -->
|
||||
<svg
|
||||
v-else-if="iconId === 'import-export'"
|
||||
|
||||
156
components/admin/AdminSiteCodeSettingsCard.vue
Normal file
156
components/admin/AdminSiteCodeSettingsCard.vue
Normal file
@@ -0,0 +1,156 @@
|
||||
<script setup>
|
||||
/**
|
||||
* 사이트 코드 설정 카드
|
||||
* @property {Object} form - 사이트 설정 폼 객체
|
||||
* @property {boolean} editing - 편집 모드 여부
|
||||
* @property {boolean} saving - 저장 중 여부
|
||||
* @property {boolean} hasChanges - 변경 여부
|
||||
*/
|
||||
defineProps({
|
||||
form: {
|
||||
type: Object,
|
||||
required: true
|
||||
},
|
||||
editing: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
saving: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
hasChanges: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
})
|
||||
|
||||
defineEmits(['begin', 'cancel', 'save'])
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<section
|
||||
id="admin-settings-section-site-code"
|
||||
class="admin-site-code-settings-card admin-settings-screen__card admin-settings-screen__card--site-code relative flex flex-col gap-6 rounded-xl border border-[#d8dce1] bg-white p-5 transition-all hover:border-[#c5cbd3] hover:shadow-sm md:p-7"
|
||||
>
|
||||
<div class="flex items-start justify-between gap-4">
|
||||
<div class="min-w-0 flex-1">
|
||||
<h2 class="text-base font-semibold text-[#15171a] md:text-lg">
|
||||
사이트 코드
|
||||
</h2>
|
||||
<p
|
||||
v-if="!editing"
|
||||
class="mr-5 mt-1 text-pretty text-sm leading-relaxed text-[#657080]"
|
||||
>
|
||||
광고·검색엔진·외부 위젯 검증에 필요한 ads.txt와 공통 헤더·푸터 코드를 관리합니다.
|
||||
</p>
|
||||
</div>
|
||||
<div class="-mr-1 mt-[-5px] flex shrink-0 items-center justify-start gap-2">
|
||||
<template v-if="!editing">
|
||||
<button
|
||||
class="inline-flex h-7 cursor-pointer items-center justify-center rounded px-3 text-sm font-semibold whitespace-nowrap text-[#15171a] transition hover:bg-[#eceff2] hover:text-black"
|
||||
type="button"
|
||||
@click="$emit('begin')"
|
||||
>
|
||||
편집
|
||||
</button>
|
||||
</template>
|
||||
<template v-else>
|
||||
<button
|
||||
class="inline-flex h-7 cursor-pointer items-center justify-center rounded px-3 text-sm font-semibold whitespace-nowrap text-[#5d6673] transition hover:bg-[#eceff2] hover:text-[#15171a]"
|
||||
type="button"
|
||||
:disabled="saving"
|
||||
@click="$emit('cancel')"
|
||||
>
|
||||
취소
|
||||
</button>
|
||||
<button
|
||||
class="inline-flex h-7 cursor-pointer items-center justify-center rounded px-3 text-sm font-semibold whitespace-nowrap text-[#15171a] transition hover:bg-[#eceff2] hover:text-black disabled:opacity-50"
|
||||
type="button"
|
||||
:disabled="saving || !hasChanges"
|
||||
@click="$emit('save')"
|
||||
>
|
||||
{{ saving ? '저장 중' : '저장' }}
|
||||
</button>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div
|
||||
v-if="!editing"
|
||||
class="admin-site-code-settings-card__readonly admin-settings-screen__site-code-readonly grid gap-5 border-t border-[#eceff2] pt-5 text-sm md:grid-cols-3"
|
||||
>
|
||||
<div>
|
||||
<p class="font-medium text-[#3f4650]">
|
||||
ads.txt
|
||||
</p>
|
||||
<p class="mt-1 text-[#15171a]">
|
||||
{{ form.adsTxt.trim() ? '등록됨' : '미등록' }}
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
<p class="font-medium text-[#3f4650]">
|
||||
헤더 코드
|
||||
</p>
|
||||
<p class="mt-1 text-[#15171a]">
|
||||
{{ form.customHeadCode.trim() ? '등록됨' : '미등록' }}
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
<p class="font-medium text-[#3f4650]">
|
||||
푸터 코드
|
||||
</p>
|
||||
<p class="mt-1 text-[#15171a]">
|
||||
{{ form.customFooterCode.trim() ? '등록됨' : '미등록' }}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div
|
||||
v-else
|
||||
class="admin-site-code-settings-card__edit admin-settings-screen__site-code-edit grid gap-5 border-t border-[#eceff2] pt-5"
|
||||
>
|
||||
<label class="admin-settings-screen__field grid gap-2 text-sm">
|
||||
<span class="font-medium text-[#3f4650]">ads.txt</span>
|
||||
<p class="text-xs leading-relaxed text-[#657080]">
|
||||
루트 /ads.txt에서 text/plain으로 응답됩니다. 애드센스에서 제공한 줄을 그대로 붙여 넣습니다.
|
||||
</p>
|
||||
<textarea
|
||||
v-model="form.adsTxt"
|
||||
class="min-h-[7rem] resize-y rounded-md border border-[#dce0e5] bg-white px-3 py-2 font-mono text-[13px] text-[#15171a] outline-none focus:border-[#15171a] focus:ring-1 focus:ring-[#15171a]"
|
||||
rows="5"
|
||||
spellcheck="false"
|
||||
placeholder="google.com, pub-0000000000000000, DIRECT, f08c47fec0942fa0"
|
||||
/>
|
||||
</label>
|
||||
|
||||
<label class="admin-settings-screen__field grid gap-2 text-sm">
|
||||
<span class="font-medium text-[#3f4650]">헤더 코드</span>
|
||||
<p class="text-xs leading-relaxed text-[#657080]">
|
||||
공개 페이지의 head 끝에 삽입됩니다. 애드센스 자동 광고, 사이트 검증 meta/script 코드에 사용합니다.
|
||||
</p>
|
||||
<textarea
|
||||
v-model="form.customHeadCode"
|
||||
class="min-h-[9rem] resize-y rounded-md border border-[#dce0e5] bg-white px-3 py-2 font-mono text-[13px] text-[#15171a] outline-none focus:border-[#15171a] focus:ring-1 focus:ring-[#15171a]"
|
||||
rows="7"
|
||||
spellcheck="false"
|
||||
placeholder="헤더에 삽입할 meta 또는 script 코드를 붙여 넣습니다."
|
||||
/>
|
||||
</label>
|
||||
|
||||
<label class="admin-settings-screen__field grid gap-2 text-sm">
|
||||
<span class="font-medium text-[#3f4650]">푸터 코드</span>
|
||||
<p class="text-xs leading-relaxed text-[#657080]">
|
||||
공개 페이지의 body 끝에 삽입됩니다. 하단 추적 스크립트나 지연 로딩 코드에 사용합니다.
|
||||
</p>
|
||||
<textarea
|
||||
v-model="form.customFooterCode"
|
||||
class="min-h-[9rem] resize-y rounded-md border border-[#dce0e5] bg-white px-3 py-2 font-mono text-[13px] text-[#15171a] outline-none focus:border-[#15171a] focus:ring-1 focus:ring-[#15171a]"
|
||||
rows="7"
|
||||
spellcheck="false"
|
||||
placeholder="푸터에 삽입할 script 코드를 붙여 넣습니다."
|
||||
/>
|
||||
</label>
|
||||
</div>
|
||||
</section>
|
||||
</template>
|
||||
Reference in New Issue
Block a user