aida_front/src/views/SellerDashboard/MyListings/main/index.vue

<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";


//const props = defineProps({
//})
//const emit = defineEmits([
//])
const store = useStore()
let data = reactive({
	listingPopup: true,
})
const newListing = ()=>{
	myEvent.emit('newListing',)
}
const getListingPopup = ()=>{
	store.commit("set_loading", true)
	Https.getListingPopup().then(res=>{
		store.commit("set_loading", false)
		data.listingPopup = res.data
	}).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
			title="My Listings"
			tip="Active listings and unpublished inventory."
		>
			<template #right>
				<div class="button" @click="newListing">
					<span>New Listing</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>