Compare commits
No commits in common. "main" and "v0.1.13" have entirely different histories.
14 changed files with 45 additions and 369 deletions
|
|
@ -1,40 +0,0 @@
|
||||||
import { apiClient } from '@/services/apiClient.js'
|
|
||||||
|
|
||||||
export const useZeroPrices = () => {
|
|
||||||
const getZeroPrices = async () => {
|
|
||||||
try {
|
|
||||||
return await apiClient.get('/merch/zeroprices')
|
|
||||||
} catch (error) {
|
|
||||||
console.log('Get zero prices error: ', error)
|
|
||||||
throw error
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const deleteZeroPrices = async (list) => {
|
|
||||||
try {
|
|
||||||
await apiClient.delete('/merch/zeroprices', list)
|
|
||||||
}
|
|
||||||
catch (error) {
|
|
||||||
console.log('Delete target zero prices error: ', error)
|
|
||||||
throw error
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const deleteZeroPricesPeriod = async (start, end) => {
|
|
||||||
const params = new URLSearchParams({ start, end }).toString()
|
|
||||||
const url = `/merch/zeroprices/period${params ? `?${params}` : ''}`
|
|
||||||
const response = await apiClient.delete(url)
|
|
||||||
|
|
||||||
if (response.status === 200) {
|
|
||||||
return response
|
|
||||||
} else {
|
|
||||||
console.log('Delete period select zero prices error: ', response)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
return {
|
|
||||||
getZeroPrices,
|
|
||||||
deleteZeroPrices,
|
|
||||||
deleteZeroPricesPeriod,
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
@ -13,7 +13,6 @@ import {
|
||||||
} from 'chart.js'
|
} from 'chart.js'
|
||||||
import { Line } from 'vue-chartjs'
|
import { Line } from 'vue-chartjs'
|
||||||
import 'chartjs-adapter-date-fns'
|
import 'chartjs-adapter-date-fns'
|
||||||
import { originColors } from '@/services/colors.js'
|
|
||||||
|
|
||||||
ChartJS.register(
|
ChartJS.register(
|
||||||
Title,
|
Title,
|
||||||
|
|
@ -34,6 +33,11 @@ const props = defineProps({
|
||||||
},
|
},
|
||||||
})
|
})
|
||||||
|
|
||||||
|
const originColors = {
|
||||||
|
surugaya: '#2d3081',
|
||||||
|
mandarake: '#924646',
|
||||||
|
}
|
||||||
|
|
||||||
const chartData = ref({
|
const chartData = ref({
|
||||||
datasets: [],
|
datasets: [],
|
||||||
})
|
})
|
||||||
|
|
|
||||||
|
|
@ -17,7 +17,6 @@ const mainMenu = computed(() => {
|
||||||
{ label: 'Collection', key: 'collection' },
|
{ label: 'Collection', key: 'collection' },
|
||||||
{ label: 'Charts', key: 'charts' },
|
{ label: 'Charts', key: 'charts' },
|
||||||
{ label: 'Parsers', key: 'parsers' },
|
{ label: 'Parsers', key: 'parsers' },
|
||||||
{ label: 'Zero prices', key: 'zeroprices' },
|
|
||||||
]
|
]
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -8,7 +8,6 @@ import PersonalView from '@/views/PersonalView.vue'
|
||||||
import AddMerchView from '@/views/AddMerchView.vue'
|
import AddMerchView from '@/views/AddMerchView.vue'
|
||||||
import DetailsView from '@/views/DetailsView.vue'
|
import DetailsView from '@/views/DetailsView.vue'
|
||||||
import LabelsView from '@/views/LabelsView.vue'
|
import LabelsView from '@/views/LabelsView.vue'
|
||||||
import ZeroPricesView from '@/views/ZeroPricesView.vue'
|
|
||||||
|
|
||||||
const router = createRouter({
|
const router = createRouter({
|
||||||
history: createWebHistory(import.meta.env.BASE_URL),
|
history: createWebHistory(import.meta.env.BASE_URL),
|
||||||
|
|
@ -59,11 +58,6 @@ const router = createRouter({
|
||||||
name: 'labels',
|
name: 'labels',
|
||||||
component: LabelsView,
|
component: LabelsView,
|
||||||
},
|
},
|
||||||
{
|
|
||||||
path: '/zeroprices',
|
|
||||||
name: 'zeroprices',
|
|
||||||
component: ZeroPricesView,
|
|
||||||
},
|
|
||||||
],
|
],
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -7,10 +7,8 @@ let refreshPromise = null
|
||||||
|
|
||||||
function createConfig(options = {}) {
|
function createConfig(options = {}) {
|
||||||
const token = localStorage.getItem('accessToken');
|
const token = localStorage.getItem('accessToken');
|
||||||
const isFormData = options.body instanceof FormData;
|
|
||||||
|
|
||||||
const headers = {
|
const headers = {
|
||||||
...(isFormData ? {} : { 'Content-Type': 'application/json' }),
|
'Content-Type': 'application/json',
|
||||||
...options.headers,
|
...options.headers,
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
@ -140,14 +138,12 @@ export const apiClient = {
|
||||||
return request(url, {
|
return request(url, {
|
||||||
method: 'POST',
|
method: 'POST',
|
||||||
body: isFormData ? data : JSON.stringify(data),
|
body: isFormData ? data : JSON.stringify(data),
|
||||||
|
// headers: isFormData ? {} : { 'Content-Type': 'application/json' }
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
put: (url, data) => request(url, {
|
put: (url, data) => request(url, {
|
||||||
method: 'PUT',
|
method: 'PUT',
|
||||||
body: JSON.stringify(data),
|
body: JSON.stringify(data),
|
||||||
}),
|
}),
|
||||||
delete: (url, data) => request(url, {
|
delete: (url) => request(url, { method: 'DELETE' }),
|
||||||
method: 'DELETE',
|
|
||||||
body: data ? JSON.stringify(data) : undefined,
|
|
||||||
}),
|
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -1,4 +0,0 @@
|
||||||
export const originColors = {
|
|
||||||
surugaya: '#2d3081',
|
|
||||||
mandarake: '#924646',
|
|
||||||
};
|
|
||||||
|
|
@ -197,8 +197,3 @@ body,
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
margin-bottom: 20px;
|
margin-bottom: 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.padding-lr-30 {
|
|
||||||
padding-left: 30px;
|
|
||||||
padding-right: 30px;
|
|
||||||
}
|
|
||||||
|
|
|
||||||
|
|
@ -1,5 +1,5 @@
|
||||||
<script setup>
|
<script setup>
|
||||||
import { computed } from 'vue'
|
import { computed, ref, watch } from 'vue'
|
||||||
import router from '@/router/index.js'
|
import router from '@/router/index.js'
|
||||||
import { useLabelsStore } from '@/stores/labelsStore.js'
|
import { useLabelsStore } from '@/stores/labelsStore.js'
|
||||||
|
|
||||||
|
|
@ -21,13 +21,14 @@ const addMerch = () => {
|
||||||
router.push({ name: 'addMerch' })
|
router.push({ name: 'addMerch' })
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
const localSearch = computed({
|
const localSearch = computed({
|
||||||
get() {
|
get() {
|
||||||
return props.modelValue
|
return props.modelValue
|
||||||
},
|
},
|
||||||
set(value) {
|
set(value) {
|
||||||
emit('update:modelValue', value)
|
emit('update:modelValue', value)
|
||||||
},
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
const selectedLabelUuids = computed({
|
const selectedLabelUuids = computed({
|
||||||
|
|
@ -36,7 +37,7 @@ const selectedLabelUuids = computed({
|
||||||
},
|
},
|
||||||
set(value) {
|
set(value) {
|
||||||
emit('update:labelUuids', value)
|
emit('update:labelUuids', value)
|
||||||
},
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
const labelOptions = computed(() => {
|
const labelOptions = computed(() => {
|
||||||
|
|
@ -68,4 +69,6 @@ const labelOptions = computed(() => {
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style scoped></style>
|
<style scoped>
|
||||||
|
|
||||||
|
</style>
|
||||||
|
|
|
||||||
|
|
@ -54,21 +54,37 @@ function onFileInputChange(event) {
|
||||||
event.target.value = ''
|
event.target.value = ''
|
||||||
}
|
}
|
||||||
|
|
||||||
async function fetchImage(bustCache = false) {
|
async function handleUpload({ fileList: newFileList }) {
|
||||||
|
const file = newFileList[newFileList.length - 1]
|
||||||
try {
|
try {
|
||||||
let imgUrl = getImageUrl(props.merchUuid, 'full')
|
await uploadImage(props.merchUuid, file.file)
|
||||||
|
|
||||||
if (bustCache) {
|
const { imgUrl } = await getImageUrl(props.merchUuid, 'full')
|
||||||
const separator = imgUrl.includes('?') ? '&' : '?'
|
|
||||||
imgUrl += `${separator}_t=${Date.now()}`
|
message.success('Image uploaded successfully.')
|
||||||
}
|
|
||||||
|
fileList.value = [
|
||||||
|
{
|
||||||
|
name: file.name,
|
||||||
|
url: imgUrl,
|
||||||
|
status: 'finished',
|
||||||
|
},
|
||||||
|
]
|
||||||
|
} catch (error) {
|
||||||
|
message.error('Upload error: ' + (error.message || 'Unknown error.'))
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
onMounted(async () => {
|
||||||
|
try {
|
||||||
|
const imgUrl = getImageUrl(props.merchUuid, 'full');
|
||||||
|
|
||||||
await new Promise((resolve, reject) => {
|
await new Promise((resolve, reject) => {
|
||||||
const img = new Image()
|
const img = new Image();
|
||||||
img.src = imgUrl
|
img.src = imgUrl;
|
||||||
img.onload = () => resolve(imgUrl)
|
img.onload = () => resolve(imgUrl);
|
||||||
img.onerror = () => reject(new Error('Image not found'))
|
img.onerror = () => reject(new Error('Image not found'));
|
||||||
})
|
});
|
||||||
|
|
||||||
fileList.value = [
|
fileList.value = [
|
||||||
{
|
{
|
||||||
|
|
@ -76,28 +92,13 @@ async function fetchImage(bustCache = false) {
|
||||||
url: imgUrl,
|
url: imgUrl,
|
||||||
status: 'finished',
|
status: 'finished',
|
||||||
},
|
},
|
||||||
]
|
];
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
fileList.value = []
|
fileList.value = [];
|
||||||
if (!error.message.includes('404')) {
|
if (!error.message.includes('404')) {
|
||||||
console.error('Error getting image:', error)
|
console.error('Error getting image: ', error);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
|
|
||||||
async function handleUpload({ fileList: newFileList }) {
|
|
||||||
const file = newFileList[newFileList.length - 1]
|
|
||||||
try {
|
|
||||||
await uploadImage(props.merchUuid, file.file)
|
|
||||||
message.success('Image uploaded successfully.')
|
|
||||||
await fetchImage(true)
|
|
||||||
} catch (error) {
|
|
||||||
message.error('Upload error: ' + (error.message || 'Unknown error.'))
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
onMounted(async () => {
|
|
||||||
await fetchImage(false)
|
|
||||||
});
|
});
|
||||||
|
|
||||||
const showConfirmDelete = ref(false)
|
const showConfirmDelete = ref(false)
|
||||||
|
|
|
||||||
|
|
@ -1,20 +0,0 @@
|
||||||
<script setup>
|
|
||||||
import ScrollToTopButton from '@/components/ScrollToTopButton.vue'
|
|
||||||
import TargetZeroesTab from '@/views/ZeroPricesView/TargetZeroesTab.vue'
|
|
||||||
import PeriodSelectTab from '@/views/ZeroPricesView/PeriodSelectTab.vue'
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<n-tabs type="line" animated>
|
|
||||||
<n-tab-pane name="Target zeroes" tab="Target zeroes">
|
|
||||||
<TargetZeroesTab />
|
|
||||||
</n-tab-pane>
|
|
||||||
<n-tab-pane name="Period select" tab="Period select">
|
|
||||||
<PeriodSelectTab />
|
|
||||||
</n-tab-pane>
|
|
||||||
</n-tabs>
|
|
||||||
<ScrollToTopButton />
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
</style>
|
|
||||||
|
|
@ -1,54 +0,0 @@
|
||||||
<script setup>
|
|
||||||
import { ref, onMounted, computed } from 'vue'
|
|
||||||
import { useZeroPrices } from '@/api/zeroPrices.js'
|
|
||||||
|
|
||||||
const range = ref(null)
|
|
||||||
|
|
||||||
const setTodayRange = () => {
|
|
||||||
const now = new Date()
|
|
||||||
const start = new Date(now.getFullYear(), now.getMonth(), now.getDate())
|
|
||||||
const end = new Date(start.getTime() + 24 * 60 * 60 * 1000)
|
|
||||||
|
|
||||||
range.value = [start.getTime(), end.getTime()]
|
|
||||||
}
|
|
||||||
|
|
||||||
onMounted(() => {
|
|
||||||
setTodayRange()
|
|
||||||
})
|
|
||||||
|
|
||||||
const toRFCtime = (timestamp) => {
|
|
||||||
return new Date(timestamp).toISOString()
|
|
||||||
}
|
|
||||||
|
|
||||||
const { deleteZeroPricesPeriod } = useZeroPrices()
|
|
||||||
|
|
||||||
const deleteEnabled = computed(() => {
|
|
||||||
return range.value === null
|
|
||||||
})
|
|
||||||
|
|
||||||
const deletePeriod = async () => {
|
|
||||||
if (range.value !== null) {
|
|
||||||
const start = toRFCtime(range.value[0])
|
|
||||||
const end = toRFCtime(range.value[1])
|
|
||||||
await deleteZeroPricesPeriod(start, end)
|
|
||||||
} else {
|
|
||||||
console.log('Delete period select zero prices error')
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<n-date-picker
|
|
||||||
v-model:value="range"
|
|
||||||
type="datetimerange"
|
|
||||||
format="HH:mm:ss dd-MM-yyyy"
|
|
||||||
clearable
|
|
||||||
/>
|
|
||||||
<div class="button-container-center">
|
|
||||||
<n-button class="center-button w360" type="error" :disabled="deleteEnabled" @click="deletePeriod">Delete</n-button>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style scoped></style>
|
|
||||||
|
|
@ -1,71 +0,0 @@
|
||||||
<script setup>
|
|
||||||
import { onMounted, ref } from 'vue'
|
|
||||||
import { useZeroPrices } from '@/api/zeroPrices.js'
|
|
||||||
import ZeroPriceCard from '@/views/ZeroPricesView/ZeroPriceCard.vue'
|
|
||||||
import ZeroPricesToolbar from '@/views/ZeroPricesView/ZeroPricesToolbar.vue'
|
|
||||||
|
|
||||||
const { getZeroPrices } = useZeroPrices()
|
|
||||||
|
|
||||||
const zeroPrices = ref([])
|
|
||||||
const toDelete = ref([])
|
|
||||||
|
|
||||||
const handleToggle = ({ id, merch_uuid, checked }) => {
|
|
||||||
if (checked) {
|
|
||||||
toDelete.value.push({ id, merch_uuid });
|
|
||||||
} else {
|
|
||||||
toDelete.value = toDelete.value.filter(item => item.id !== id);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const handleSelectAll = () => {
|
|
||||||
toDelete.value = zeroPrices.value.map(item => ({
|
|
||||||
id: item.id,
|
|
||||||
merch_uuid: item.merch_uuid
|
|
||||||
}))
|
|
||||||
}
|
|
||||||
|
|
||||||
const fetchZeroPrices = async () => {
|
|
||||||
try {
|
|
||||||
const response = await getZeroPrices()
|
|
||||||
zeroPrices.value = Array.isArray(response.data) ? response.data : []
|
|
||||||
} catch (error) {
|
|
||||||
console.error(error)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const handleDeleted = () => {
|
|
||||||
toDelete.value = []
|
|
||||||
fetchZeroPrices()
|
|
||||||
}
|
|
||||||
|
|
||||||
onMounted(() => {
|
|
||||||
fetchZeroPrices()
|
|
||||||
})
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<div v-if="zeroPrices.length === 0">
|
|
||||||
<n-h2 class="text-center">Zero prices</n-h2>
|
|
||||||
<n-h3 class="text-center">No data</n-h3>
|
|
||||||
</div>
|
|
||||||
<div v-else>
|
|
||||||
<div class="sticky-search-container">
|
|
||||||
<ZeroPricesToolbar
|
|
||||||
:selected="toDelete"
|
|
||||||
@deleted="handleDeleted"
|
|
||||||
@selectAll="handleSelectAll"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div v-for="item in zeroPrices" :key="item.created_at">
|
|
||||||
<ZeroPriceCard
|
|
||||||
:zero-price="item"
|
|
||||||
@toggle="handleToggle"
|
|
||||||
:checked="toDelete.some(t => t.id === item.id)"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
|
|
||||||
</style>
|
|
||||||
|
|
@ -1,71 +0,0 @@
|
||||||
<script setup>
|
|
||||||
import { computed } from 'vue'
|
|
||||||
import { originColors } from '@/services/colors.js'
|
|
||||||
|
|
||||||
const props = defineProps({
|
|
||||||
zeroPrice: {
|
|
||||||
type: Object,
|
|
||||||
required: true,
|
|
||||||
},
|
|
||||||
checked: {
|
|
||||||
type: Boolean,
|
|
||||||
default: false,
|
|
||||||
},
|
|
||||||
})
|
|
||||||
|
|
||||||
const emit = defineEmits(['toggle'])
|
|
||||||
|
|
||||||
const handleCheckboxChange = (newValue) => {
|
|
||||||
emit('toggle', {
|
|
||||||
id: props.zeroPrice.id,
|
|
||||||
merch_uuid: props.zeroPrice.merch_uuid,
|
|
||||||
checked: newValue,
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
const currentOriginColor = computed(() => {
|
|
||||||
return originColors[props.zeroPrice.origin] || '#fff';
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<div class="zeroPriceCard mt-10">
|
|
||||||
<n-grid responsive="screen" item-responsive cols="4" :x-gap="16" :y-gap="16" class="shift">
|
|
||||||
<n-gi>
|
|
||||||
<n-checkbox :checked="checked" @update:checked="handleCheckboxChange">
|
|
||||||
<strong>Delete</strong>
|
|
||||||
</n-checkbox>
|
|
||||||
</n-gi>
|
|
||||||
<n-gi><strong>Name:</strong> {{ props.zeroPrice.name }}</n-gi>
|
|
||||||
<n-gi><strong>Created:</strong> {{ props.zeroPrice.created_at }}</n-gi>
|
|
||||||
<n-gi
|
|
||||||
><strong>Origin:</strong>
|
|
||||||
<span class="bordered" :style="{ borderColor: currentOriginColor }">
|
|
||||||
{{ props.zeroPrice.origin }}
|
|
||||||
</span>
|
|
||||||
</n-gi>
|
|
||||||
</n-grid>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
.zeroPriceCard {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: space-between;
|
|
||||||
padding: 8px 16px;
|
|
||||||
background: #f5f5f5;
|
|
||||||
border-radius: 8px;
|
|
||||||
font-family: Arial, sans-serif;
|
|
||||||
font-size: 14px;
|
|
||||||
gap: 12px;
|
|
||||||
border: 1px solid #e0e0e0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.bordered {
|
|
||||||
border: 1px solid;
|
|
||||||
border-radius: 4px;
|
|
||||||
padding: 2px;
|
|
||||||
margin: 3px;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
@ -1,56 +0,0 @@
|
||||||
<script setup>
|
|
||||||
import { useMessage } from 'naive-ui'
|
|
||||||
import { useZeroPrices } from '@/api/zeroPrices.js'
|
|
||||||
const props = defineProps({
|
|
||||||
selected: {
|
|
||||||
type: Array,
|
|
||||||
required: true,
|
|
||||||
},
|
|
||||||
})
|
|
||||||
|
|
||||||
const messages = useMessage()
|
|
||||||
const { deleteZeroPrices } = useZeroPrices()
|
|
||||||
const emit = defineEmits(['deleted', 'selectAll'])
|
|
||||||
|
|
||||||
const handleDelete = async () => {
|
|
||||||
try {
|
|
||||||
await deleteZeroPrices(props.selected)
|
|
||||||
messages.success("Selected zero prices deleted")
|
|
||||||
emit('deleted')
|
|
||||||
} catch (error) {
|
|
||||||
console.log(error)
|
|
||||||
messages.error("Error deleting selected prices")
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const handleSelectAll = async () => {
|
|
||||||
emit('selectAll')
|
|
||||||
}
|
|
||||||
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<div class="toolbar button-container-evenly padding-lr-30">
|
|
||||||
<div v-if="props.selected.length === 0" class="toolbar-item">
|
|
||||||
<span>Select records to delete</span>
|
|
||||||
</div>
|
|
||||||
<div v-else class="toolbar-item">
|
|
||||||
{{ props.selected.length }} items selected
|
|
||||||
</div>
|
|
||||||
<div class="toolbar-item">
|
|
||||||
<span @click="handleSelectAll">Click here to select all</span>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="toolbar-item">
|
|
||||||
<n-button
|
|
||||||
type="error"
|
|
||||||
:disabled="props.selected.length === 0"
|
|
||||||
@click="handleDelete"
|
|
||||||
>
|
|
||||||
Delete Selected
|
|
||||||
</n-button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style scoped></style>
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue