forked from DebaucheryLibrarian/traxxx
Added height and weight filters to actors overview.
This commit is contained in:
@@ -66,7 +66,7 @@
|
||||
|
||||
<template v-slot:tooltip>
|
||||
<div class="filter-section boobsize">
|
||||
<label class="filter-label off">Size</label>
|
||||
<label class="filter-label off">Size ({{ boobSize[0] }} - {{ boobSize[1] }})</label>
|
||||
|
||||
<span class="filter-split">
|
||||
<Checkbox
|
||||
@@ -81,7 +81,8 @@
|
||||
:value="boobSize"
|
||||
:values="boobSizes"
|
||||
:disabled="!boobSizeRequired"
|
||||
@change="(sizeRange) => updateValue('boobSize', sizeRange)"
|
||||
@input="(sizeRange) => updateValue('boobSize', sizeRange, false)"
|
||||
@change="(sizeRange) => updateValue('boobSize', sizeRange, true)"
|
||||
>
|
||||
<template v-slot:start>
|
||||
<span class="range-label"><Icon icon="boobs-small" /></span>
|
||||
@@ -124,6 +125,62 @@
|
||||
</template>
|
||||
</Tooltip>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<Tooltip class="filter boobs">
|
||||
<span class="filter-trigger"><Icon icon="rulers" />Physique</span>
|
||||
|
||||
<template v-slot:tooltip>
|
||||
<div class="filter-section">
|
||||
<label class="filter-label off">Height ({{ height[0] }} - {{ height[1] }} cm)</label>
|
||||
|
||||
<span class="filter-split">
|
||||
<Checkbox
|
||||
:checked="heightRequired"
|
||||
class="checkbox"
|
||||
@change="(checked) => updateValue('heightRequired', checked)"
|
||||
/>
|
||||
|
||||
<Range
|
||||
:min="50"
|
||||
:max="250"
|
||||
:value="height"
|
||||
:disabled="!heightRequired"
|
||||
@input="(heightRange) => updateValue('height', heightRange, false)"
|
||||
@change="(heightRange) => updateValue('height', heightRange, true)"
|
||||
>
|
||||
<template v-slot:start><Icon icon="shorts" /></template>
|
||||
<template v-slot:end><Icon icon="pants" /></template>
|
||||
</Range>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div class="filter-section">
|
||||
<label class="filter-label off">Weight ({{ weight[0] }} - {{ weight[1] }} kg)</label>
|
||||
|
||||
<span class="filter-split">
|
||||
<Checkbox
|
||||
:checked="weightRequired"
|
||||
class="checkbox"
|
||||
@change="(checked) => updateValue('weightRequired', checked)"
|
||||
/>
|
||||
|
||||
<Range
|
||||
:min="30"
|
||||
:max="200"
|
||||
:value="weight"
|
||||
:disabled="!weightRequired"
|
||||
@input="(weightRange) => updateValue('weight', weightRange, false)"
|
||||
@change="(weightRange) => updateValue('weight', weightRange, true)"
|
||||
>
|
||||
<template v-slot:start><Icon icon="user6" /></template>
|
||||
<template v-slot:end><Icon icon="user3" /></template>
|
||||
</Range>
|
||||
</span>
|
||||
</div>
|
||||
</template>
|
||||
</Tooltip>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
|
||||
@@ -163,13 +220,18 @@ function updateFilters() {
|
||||
query: {
|
||||
naturalBoobs: toggleValues[this.naturalBoobs],
|
||||
bs: this.boobSizeRequired ? this.boobSize.join(',') : undefined,
|
||||
h: this.heightRequired ? this.height.join(',') : undefined,
|
||||
w: this.weightRequired ? this.weight.join(',') : undefined,
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
function updateValue(prop, value) {
|
||||
function updateValue(prop, value, load = true) {
|
||||
this[prop] = value;
|
||||
this.updateFilters();
|
||||
|
||||
if (load) {
|
||||
this.updateFilters();
|
||||
}
|
||||
}
|
||||
|
||||
async function fetchActors(scroll) {
|
||||
@@ -182,6 +244,8 @@ async function fetchActors(scroll) {
|
||||
gender: curatedGender === 'other' ? null : curatedGender,
|
||||
boobSize: this.boobSizeRequired && this.boobSize,
|
||||
naturalBoobs: toggleValues[this.naturalBoobs] ?? null,
|
||||
height: this.heightRequired && this.height,
|
||||
weight: this.weightRequired && this.weight,
|
||||
});
|
||||
|
||||
this.actors = actors;
|
||||
@@ -235,6 +299,10 @@ export default {
|
||||
boobSize: this.$route.query.bs?.split(',') || ['A', 'Z'],
|
||||
boobSizeRequired: !!this.$route.query.bs,
|
||||
naturalBoobs: naturalBoobs > -1 ? naturalBoobs : 1,
|
||||
height: this.$route.query.h?.split(',').map(Number) || [50, 250],
|
||||
heightRequired: !!this.$route.query.h,
|
||||
weight: this.$route.query.w?.split(',').map(Number) || [30, 200],
|
||||
weightRequired: !!this.$route.query.w,
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
@@ -388,6 +456,11 @@ export default {
|
||||
}
|
||||
}
|
||||
|
||||
.filter-section {
|
||||
width: 15rem;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.filter-label {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
@@ -408,7 +481,7 @@ export default {
|
||||
|
||||
.checkbox {
|
||||
display: inline-block;
|
||||
padding: 0 0 0 .5rem;
|
||||
padding: 0 .5rem;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user