<script setup lang="ts">
import { ref, onMounted, onUnmounted, reactive, toRefs } from "vue";
import sellerHeader from "../../seller-header.vue"
import sellerContent from "./content.vue"
import myEvent from "@/tool/myEvents.js"
import { Https } from '@/tool/https'
import { useStore } from "vuex";
import { useRouter } from 'vue-router'


//const props = defineProps({
//})
//const emit = defineEmits([
//])
const router = useRouter()
const store = useStore()
let data = reactive({
})
const newListing =  async ()=>{
	let path = '/home/seller/myListings/select'
	store.commit("set_loading", true)
	//1弹窗 0不弹窗
	Https.axiosGet(Https.httpUrls.getListingPopup,).then((rv)=>{
		if(rv == 0){
			router.push({path:'/home/seller/myListings/select'})
		}else{
			myEvent.emit('newListing',path)
		}
		store.commit("set_loading", false)
	}).catch(()=>{
		store.commit("set_loading", false)
	})
}
onMounted(()=>{
	let listingPopup = sessionStorage.getItem('listingPopup')
})
onUnmounted(()=>{
})
defineExpose({})
const {} = toRefs(data);
</script>
<template>
	<div class="myListings-seller">
		<seller-header>
			<template #right>
				<div class="button" @click="newListing">
					<span>{{ $t('Seller.newListing') }}</span>
					<div class="icon">
						<i class="fi fi-br-plus"></i>
					</div>
				</div>
			</template>
		</seller-header>
		<div class="content">
			<sellerContent></sellerContent>
		</div>
	</div>
</template>
<style scoped lang="less">
	.myListings-seller {
		flex: 1;
		// overflow: hidden;
		position: relative;
		display: flex;
		flex-direction: column;
		.button {
			width: 16rem;
			height: 6rem;
			border-radius: 4rem;
			display: flex;
			border: 1.5px solid #000000;
			background-color: #000;
			color: #fff;
			transition: all .3s;
			gap: .8rem;
			align-items: center;
			justify-content: center;
			font-size: 1.6rem;
			cursor: pointer;
			i{
				color: #fff;
				display: flex;
				font-size: 1.6rem;
			}
			&:hover{
				background-color: #fff;
				color: #000;
				i{
					color: #000;
				}
			}
		}
		> .content {
			margin-top: 2rem;
			flex: 1;
			position: relative;
		}
	}
</style>
