zelda
/
bid-extension
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

update view

This commit is contained in:
Admin 2025-06-20 09:48:23 +07:00
parent dc29dc76b6
commit e3c3ce1f95
3 changed files with 102 additions and 57 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

113
content.js
View File

@ -108,12 +108,58 @@ async function handleCreate(event, formElements) {
quantity: isNaN(quantity) ? null : quantity,
};
const keys = Object.values(formElements.form)
.filter((item) => {
return [
"mode_key",
"early_tracking_seconds",
"arrival_offset_seconds",
].includes(item?.id);
})
.reduce((prev, cur) => {
prev[cur.id] = cur.value;
return prev;
}, {});
const earlyTracking = parseInt(keys.early_tracking_seconds, 10);
const arrivalOffset = parseInt(keys.arrival_offset_seconds, 10);
if (earlyTracking < 600) {
alert("Early Tracking Seconds must be at least 600 seconds (10 minutes).");
return;
}
if (arrivalOffset < 60) {
alert("Arrival Offset Seconds must be at least 60 seconds (1 minute).");
return;
}
// Validate required fields
if (!payload.url || payload.max_price === null) {
alert("Please fill out the URL and Max Price fields correctly.");
return;
}
const localKeyName = keys["mode_key"];
const newKeys = Object.entries(keys).reduce((prev, [key, value]) => {
if (key === "mode_key") {
prev[key] = value;
} else {
prev[`${key}_${localKeyName}`] = Number(value);
}
return prev;
}, {});
let metadata = Object.entries(newKeys).map(([key, value]) => {
return {
key_name: key,
value,
};
});
console.log({ newKeys, payload, metadata });
try {
const response = await fetch(`${CONFIG.API_BASE_URL}/bids`, {
method: "POST",
@ -121,7 +167,7 @@ async function handleCreate(event, formElements) {
"Content-Type": "application/json",
Authorization: key,
},
body: JSON.stringify(removeFalsyValues(payload)),
body: JSON.stringify(removeFalsyValues({ ...payload, metadata })),
});
const result = await response.json();
@ -392,9 +438,11 @@ const setMinusLabel = (input, minutes = null) => {
const text = toReadableLabel(input.id);
label.textContent = `${text} (${formatTimeFromMinutes(
minutes || Number(input.value) || 300 / 60
)})`;
label.textContent = `${text} ${
Number(input.value)
? `(${formatTimeFromMinutes(minutes || Number(input.value) || 300 / 60)})`
: ""
}`;
};
const renderMetadaMode = (data, formElements, mode = null) => {
@ -417,14 +465,6 @@ const renderMetadaMode = (data, formElements, mode = null) => {
});
}
});
Object.values(formElements.metadataMode).forEach((item) => {
setMinusLabel(item);
item.addEventListener("input", (e) => {
setMinusLabel(item, Number(e.target.value));
});
});
};
const createInfoColumn = (data, formElements) => {
@ -434,29 +474,14 @@ const createInfoColumn = (data, formElements) => {
if (!inputsContainer || !urlCol) return;
// 1. Thêm ID và Name vào đầu inputsContainer
const otherEls = `
<div class="sub-col">
<div class="col">
<label>ID</label>
<input readonly value="${data?.id || "None"}" type="text" id="id" />
</div>
// const otherEls = `
// <div class="col">
// <label>Name</label>
// <textarea readonly id="maxPrice">${data?.name || "None"}</textarea>
// </div>
// `;
<div class="col">
<label for="mode_key">Mode</label>
<select id="mode_key" name="mode_key">
<option value="live">Live</option>
<option value="sandbox">Sandbox</option>
</select>
</div>
</div>
<div class="col">
<label>Name</label>
<textarea readonly id="maxPrice">${data?.name || "None"}</textarea>
</div>
`;
inputsContainer.insertAdjacentHTML("afterbegin", otherEls);
// inputsContainer.insertAdjacentHTML("afterbegin", otherEls);
// 2. Tạo và chèn Current Price ngay sau #url-col
const currentPriceDiv = document.createElement("div");
@ -473,6 +498,12 @@ const createInfoColumn = (data, formElements) => {
formElements.quantity.value = data?.quantity || 1;
formElements.plusPrice.value = data?.plus_price || 0;
[formElements.id, formElements.name].forEach((item) => {
console.log({ item });
item.value = data[item.id] || "None";
item.parentElement.style.display = "block";
});
renderMetadaMode(data, formElements);
};
@ -574,11 +605,23 @@ const showInfo = async (model, formElements) => {
}
};
const renderLableMetadataMode = (formElements) => {
Object.values(formElements.metadataMode).forEach((item) => {
setMinusLabel(item);
item.addEventListener("input", (e) => {
setMinusLabel(item, Number(e.target.value));
});
});
};
(async () => {
await showPage();
handleToogle();
const formElements = {
url: document.querySelector("#form-bid #url"),
id: document.querySelector("#form-bid #id"),
name: document.querySelector("#form-bid #name"),
maxPrice: document.querySelector("#form-bid #maxPrice"),
plusPrice: document.querySelector("#form-bid #plusPrice"),
quantity: document.querySelector("#form-bid #quantity"),
@ -607,6 +650,8 @@ const showInfo = async (model, formElements) => {
const model = extractModelId(currentUrl);
renderLableMetadataMode(formElements);
if (!model) return;
switch (extractDomain(currentUrl)) {

2
manifest.json
View File

@ -1,7 +1,7 @@
{
"manifest_version": 3,
"name": "Bid Extension",
"version": "2.0",
"version": "2.1",
"description": "Bid Extension",
"action": {
"default_popup": "pages/popup/popup.html",

44
pages/popup/popup.html
View File

@ -104,7 +104,27 @@
<div style="display: none" id="form-bid">
<form class="container">
<h2>Bid</h2>
<div class="inputs">
<div style="max-height: 560px; overflow: auto" class="inputs">
<div class="sub-col">
<div style="display: none" class="col">
<label>ID</label>
<input readonly type="text" id="id" />
</div>
<div class="col">
<label for="mode_key">Mode</label>
<select id="mode_key" name="mode_key">
<option value="live">Live</option>
<option value="sandbox">Sandbox</option>
</select>
</div>
</div>
<div style="display: none" class="col">
<label>Name</label>
<textarea rows="2" readonly id="name"></textarea>
</div>
<div style="display: none" id="competitor-max-bid-col" class="col">
<label>Competior max bid</label>
<input readonly type="text" id="competitor-max-bid" />
@ -132,7 +152,7 @@
</div>
</div>
<div style="display: none" id="metadataMode" class="sub-col">
<div id="metadataMode" class="sub-col">
<div class="col">
<label for="arrival_offset_seconds">Arrival offset seconds</label>
<input
@ -151,26 +171,6 @@
/>
</div>
</div>
<!-- <div style="display: none" id="metadata-mode-sandbox" class="sub-col">
<div class="col">
<label>Arrival offset seconds</label>
<input
type="number"
id="arrival_offset_seconds_sandbox"
name="arrival_offset_seconds_sandbox"
/>
</div>
<div class="col">
<label>Early tracking seconds</label>
<input
type="number"
id="early_tracking_seconds_sandbox"
name="early_tracking_seconds_sandbox"
/>
</div>
</div> -->
</div>
<button type="submit" id="createBtn">Create</button>
</form>