Tsumanu/oswilno
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Improve display price

Browse Source
This commit is contained in:
eraden 2022-07-21 06:51:43 +02:00
parent fa38a41044
commit 65aef73987
2 changed files with 27 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

38
client/src/offers/marketplace-offer.js
View File

@ -14,10 +14,6 @@ customElements.define('marketplace-offer', class extends Component {
display: block;
margin-bottom: 8px;
}
section {
display: flex;
justify-content: space-between;
}
img[src=""] { display: none; }
img {
width: 100%;
@ -30,12 +26,27 @@ customElements.define('marketplace-offer', class extends Component {
width: 50%;
}
@media only screen and (min-device-width: 1200px) {
section {
display: grid;
grid-template-areas: "img desc desc" "img min max";
}
#preview {
max-width: 400px;
max-height: 400px;
grid-area: img;
}
#description {
min-height: 200px;
grid-area: desc;
justify-self: stretch;
}
#price-min {
grid-area: min;
justify-self: end;
}
#price-max {
grid-area: max;
justify-self: end;
}
}
${ INPUT_STYLE }
@ -45,7 +56,8 @@ customElements.define('marketplace-offer', class extends Component {
<img alt="" src="" id="picture" />
</div>
<p id="description"></p>
<p id="price"></p>
<p id="price-min"></p>
<p id="price-max"></p>
</section>
`);
this.#price_range = new PriceRange(0, 0);
@ -114,23 +126,25 @@ customElements.define('marketplace-offer', class extends Component {
}
set price_range_max(v) {
console.info('max', v)
this.#price_range.max = v;
this.#displayPrice();
}
#displayPrice() {
const view = this.shadowRoot.querySelector('#price');
const min = this.shadowRoot.querySelector('#price-min');
const max = this.shadowRoot.querySelector('#price-max');
if (this.#price_range.isFree) {
view.innerHTML = 'Za darmo';
min.innerHTML = ``;
max.innerHTML = `Za darmo`;
}
if (this.#price_range.isRange) {
view.innerHTML = `
<span>${this.#price_range.min}PLN</span>
<span>${this.#price_range.max}PLN</span>
`;
min.innerHTML = `<price-view value="${this.#price_range.min}"></price-view>`
max.innerHTML = `<price-view value="${this.#price_range.max}"></price-view>`;
}
if (this.#price_range.isFixed) {
view.innerHTML = `${this.#price_range.min}PLN`;
min.innerHTML = ``;
max.innerHTML = `<price-view value="${this.#price_range.min}"></price-view>`;
}
return '';
}

2
client/src/shared.js
View File

@ -158,7 +158,7 @@ export class Component extends HTMLElement {
static attr2Field(name) {
if ((this.constructor['attr2FieldBlacklist'] || []).includes(name))
return;
return name.replace('-', '_');
return name.replace(/-/g, '_');
}
static get attr2FieldBlacklist() {