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
File name
Commit message
Commit date
<template>
<div class="content">
<div class="sub-title-area mb-30">
<h2>영상 기록물</h2>
<div class="breadcrumb-list">
<ul>
<li><img :src="homeicon" alt="Home Icon">
<p>기록물</p>
</li>
<li><img :src="righticon" alt=""></li>
<li>영상 기록물</li>
</ul>
</div>
</div>
<form action="" class="gallery-form mb-40">
<dl class="mb-20">
<dd>
<p>{{ dcry.sj }}</p>
<div class="date flex align-center">
<img :src="calendaricon" alt="">
<span>{{ $dotFormatDate(dcry.rgsde) }}</span>
</div>
</dd>
</dl>
<div class="gallery video">
<img :src="eximg" alt="">
</div>
</form>
<h3>내용</h3>
<form action="" class=" info-form mb-50">
<dl>
<dd>
<p> 대한민국 최대의 내륙 산업단지를 보유하고, 서울로부터 277km, 부산으로부터 167km 거리에 있으며, 면적은 615㎢로 경상북도 전체 면적의 3.2%에 달합니다. 인구는 41만 명이고, 선산읍, 고아읍, 산동읍을 비롯한 3읍, 5면, 17개 동으로 구성되어 있습니다.</p>
</dd>
</dl>
</form>
<h3>기본정보</h3>
<form action="" class="info-form mb-50">
<dl>
<dd class="mb-20">
<img :src="addressicon" alt="">
<span>주소</span>
<p>경상북도 구미시 송정대로 55</p>
</dd>
<dd class="mb-20">
<img :src="yearicon" alt="">
<span>생산연도</span>
<p>2017</p>
</dd>
<dd>
<img :src="categoryicon" alt="">
<span>카테고리</span>
<ul class="category">
<li v-if="resultitem.category1" class="category1">카테고리1</li>
<li v-if="resultitem.category2" class="category2">카테고리2</li>
</ul>
</dd>
</dl>
</form>
<div class="btn-group flex-center">
<button class="red-line " type="button" @click="fnDeleteUser">삭제</button>
<button class="blue-line " type="button" @click="fnUpdateUser">수정</button>
<button class="gray-line-bg " type="button" @click="fnUpdateUser">목록</button>
<button class="gradient ">다운로드</button>
</div>
</div>
</template>
<script>
import axios from "axios";
import { ref } from 'vue';
import { updateUsers, logOutProc, updatePassword } from "../../../../resources/api/user"
// Import Swiper Vue components
import { CaretRightOutlined, PauseOutlined } from '@ant-design/icons-vue';
import { Swiper, SwiperSlide } from 'swiper/vue';
// Import Swiper styles
import 'swiper/css';
import 'swiper/css/free-mode';
import 'swiper/css/navigation';
import 'swiper/css/thumbs';
// import required modules
import { FreeMode, Navigation, Thumbs } from 'swiper/modules';
export default {
components: {
PauseOutlined,
CaretRightOutlined,
Swiper,
SwiperSlide,
},
setup() {
const thumbsSwiper = ref(null);
const setThumbsSwiper = (swiper) => {
thumbsSwiper.value = swiper;
};
return {
thumbsSwiper,
setThumbsSwiper,
modules: [FreeMode, Navigation, Thumbs],
};
},
data() {
return {
resultitem: {
category1: true,
category2: true,
},
calendaricon: 'client/resources/images/icon/calendaricon.png',
homeicon: 'client/resources/images/icon/home.png',
erroricon: 'client/resources/images/icon/error.png',
righticon: 'client/resources/images/icon/right.png',
addressicon: 'client/resources/images/icon/addressicon.png',
yearicon: 'client/resources/images/icon/yearicon.png',
categoryicon: 'client/resources/images/icon/categoryicon.png',
eximg: 'client/resources/images/img8.png',
slides: [
{ img: 'client/resources/images/visual.png', alt: 'Slide 1' },
{ img: 'client/resources/images/visual.png', alt: 'Slide 2' },
{ img: 'client/resources/images/visual.png', alt: 'Slide 3' },
{ img: 'client/resources/images/visual.png', alt: 'Slide 3' },
{ img: 'client/resources/images/visual.png', alt: 'Slide 3' },
{ img: 'client/resources/images/visual.png', alt: 'Slide 3' },
// Add more slides as needed
],
};
},
methods: {
},
watch: {},
computed: {
},
mounted() { },
};
</script>