Files
real-estate-app/resources/js/components/SaleCard.vue
Kurtis Holsapple ee37c6de85
Some checks failed
linter / quality (push) Failing after 3m48s
tests / ci (push) Failing after 4m13s
initial commit
2025-07-12 15:01:28 -07:00

81 lines
2.5 KiB
Vue

<template>
<div class="sale box-shadow">
<p><span>{{ sale.sale_name }}</span> ({{ sale.status }})</p>
<p>{{ sale.address }}</p>
<p>Units: {{ sale.num_units }}</p>
<p>Original List: {{ formatUSD(sale.original_listing_price) }}</p>
<p>List: {{ formatUSD(sale.listing_price) }}</p>
<p>Sold: {{ formatUSD(sale.sale_price) }}</p>
<p>Asking Price/Unit: {{ formatUSD(sale.asking_price_unit) }}</p>
<Link v-if="!detailed" :href="route('sale.show', { sale: sale.id })">Details</Link>
<template v-else>
<hr />
<div class="row">
<div class="col">
<p><span>SalesForce ID:</span> {{ sale.sale_id }}</p>
<p><span>Type:</span> {{ sale.record_type }}</p>
<p><span>Property Type:</span> {{ sale.property_sub_type }}</p>
<p><span>Comp Source:</span> {{ sale.comp_source }}</p>
<p><span>Date Last Verified:</span> {{ sale.date_last_verified }}</p>
<p><span>County:</span> {{ sale.property_county }}</p>
<p><span>Size:</span> {{ sale.building_size_sf }} sq ft</p>
<p><span>Built:</span> {{ sale.year_built }}</p>
</div>
<div class="col">
<p><span>Terms:</span> {{ sale.sales_terms }}</p>
<p><span>Loan Amount:</span> {{ formatUSD(sale.loan_amount) }}</p>
<p><span>Percent Down:</span> {{ sale.percent_down_payment }}%</p>
</div>
<div class="col">
<p><span>Market:</span> {{ sale.market.name }}</p>
<p><span>Sub Market:</span> {{ sale.sub_market.name }}</p>
<p>&nbsp;</p>
<p><span>Sold Date:</span> {{ sale.sale_date }}</p>
<p><span>Escrow Length:</span> {{ sale.length_of_escrow }}</p>
<p><span>Sold Unit Price:</span> {{ formatUSD(sale.sold_price_unit) }}</p>
</div>
</div>
{{ sale }}
</template>
</div>
</template>
<script setup>
import { Link } from '@inertiajs/vue3';
import { formatUSD } from '@/lib/helpers.js';
const props = defineProps({
sale: {
type: Object,
default: {},
},
detailed: {
type: Boolean,
default: false,
},
});
</script>
<style lang="scss" scoped>
@import "../../scss/variables.scss";
.sale {
padding: 1rem;
border: 1px solid $c-offWhite;
border-radius: 5px;
}
p {
margin: 0;
}
span {
font-weight: bold;
}
</style>