Client - add button to clear workouts filters

This commit is contained in:
Sam 2021-11-07 11:17:01 +01:00
parent d3b8ec7c89
commit a22dec457b
21 changed files with 57 additions and 22 deletions

Binary file not shown.

Before

Width:  |  Height:  |  Size: 199 KiB

After

Width:  |  Height:  |  Size: 201 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 199 KiB

After

Width:  |  Height:  |  Size: 201 KiB

View File

@ -1 +1 @@
<!DOCTYPE html><html lang="en"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1"><!--[if IE]><link rel="icon" href="/favicon.ico"><![endif]--><link rel="stylesheet" href="/static/css/fork-awesome.min.css"><link rel="stylesheet" href="/static/css/leaflet.css"><title>FitTrackee</title><link href="/static/css/admin.9f104fd3.css" rel="prefetch"><link href="/static/css/main.0fb11713.css" rel="prefetch"><link href="/static/css/main~workouts.539c93e4.css" rel="prefetch"><link href="/static/css/profile.1e84a078.css" rel="prefetch"><link href="/static/css/reset.165584bc.css" rel="prefetch"><link href="/static/css/workouts.0c5cfad5.css" rel="prefetch"><link href="/static/js/admin.4047df15.js" rel="prefetch"><link href="/static/js/chunk-2d0c9189.c81458cc.js" rel="prefetch"><link href="/static/js/chunk-2d0cf391.020c75ea.js" rel="prefetch"><link href="/static/js/chunk-2d0da8f3.c8c3e7e8.js" rel="prefetch"><link href="/static/js/chunk-2d2248b6.d84473c1.js" rel="prefetch"><link href="/static/js/chunk-2d22523a.4b710d99.js" rel="prefetch"><link href="/static/js/main.265d6693.js" rel="prefetch"><link href="/static/js/main~workouts.aa540c70.js" rel="prefetch"><link href="/static/js/profile.7e87449f.js" rel="prefetch"><link href="/static/js/reset.98679f6c.js" rel="prefetch"><link href="/static/js/workouts.f98d0408.js" rel="prefetch"><link href="/static/css/app.b50ad746.css" rel="preload" as="style"><link href="/static/js/app.5434baf0.js" rel="preload" as="script"><link href="/static/js/chunk-vendors.c7e5773d.js" rel="preload" as="script"><link href="/static/css/app.b50ad746.css" rel="stylesheet"><link rel="icon" type="image/png" sizes="32x32" href="/img/icons/favicon-32x32.png"><link rel="icon" type="image/png" sizes="16x16" href="/img/icons/favicon-16x16.png"><link rel="manifest" href="/manifest.json"><meta name="theme-color" content="#4DBA87"><meta name="apple-mobile-web-app-capable" content="no"><meta name="apple-mobile-web-app-status-bar-style" content="default"><meta name="apple-mobile-web-app-title" content="fittrackee_client"><link rel="apple-touch-icon" href="/img/icons/apple-touch-icon-152x152.png"><link rel="mask-icon" href="/img/icons/safari-pinned-tab.svg" color="#4DBA87"><meta name="msapplication-TileImage" content="/img/icons/msapplication-icon-144x144.png"><meta name="msapplication-TileColor" content="#000000"></head><body><noscript><strong>We're sorry but FitTrackee doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id="app"></div><script src="/static/js/chunk-vendors.c7e5773d.js"></script><script src="/static/js/app.5434baf0.js"></script></body></html> <!DOCTYPE html><html lang="en"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1"><!--[if IE]><link rel="icon" href="/favicon.ico"><![endif]--><link rel="stylesheet" href="/static/css/fork-awesome.min.css"><link rel="stylesheet" href="/static/css/leaflet.css"><title>FitTrackee</title><link href="/static/css/admin.9f104fd3.css" rel="prefetch"><link href="/static/css/main.0fb11713.css" rel="prefetch"><link href="/static/css/main~workouts.539c93e4.css" rel="prefetch"><link href="/static/css/profile.1e84a078.css" rel="prefetch"><link href="/static/css/reset.165584bc.css" rel="prefetch"><link href="/static/css/workouts.368ff8e8.css" rel="prefetch"><link href="/static/js/admin.4047df15.js" rel="prefetch"><link href="/static/js/chunk-2d0c9189.c81458cc.js" rel="prefetch"><link href="/static/js/chunk-2d0cf391.020c75ea.js" rel="prefetch"><link href="/static/js/chunk-2d0da8f3.c8c3e7e8.js" rel="prefetch"><link href="/static/js/chunk-2d2248b6.d84473c1.js" rel="prefetch"><link href="/static/js/chunk-2d22523a.4b710d99.js" rel="prefetch"><link href="/static/js/main.265d6693.js" rel="prefetch"><link href="/static/js/main~workouts.aa540c70.js" rel="prefetch"><link href="/static/js/profile.7e87449f.js" rel="prefetch"><link href="/static/js/reset.98679f6c.js" rel="prefetch"><link href="/static/js/workouts.52ba33b8.js" rel="prefetch"><link href="/static/css/app.b50ad746.css" rel="preload" as="style"><link href="/static/js/app.1f820b50.js" rel="preload" as="script"><link href="/static/js/chunk-vendors.c7e5773d.js" rel="preload" as="script"><link href="/static/css/app.b50ad746.css" rel="stylesheet"><link rel="icon" type="image/png" sizes="32x32" href="/img/icons/favicon-32x32.png"><link rel="icon" type="image/png" sizes="16x16" href="/img/icons/favicon-16x16.png"><link rel="manifest" href="/manifest.json"><meta name="theme-color" content="#4DBA87"><meta name="apple-mobile-web-app-capable" content="no"><meta name="apple-mobile-web-app-status-bar-style" content="default"><meta name="apple-mobile-web-app-title" content="fittrackee_client"><link rel="apple-touch-icon" href="/img/icons/apple-touch-icon-152x152.png"><link rel="mask-icon" href="/img/icons/safari-pinned-tab.svg" color="#4DBA87"><meta name="msapplication-TileImage" content="/img/icons/msapplication-icon-144x144.png"><meta name="msapplication-TileColor" content="#000000"></head><body><noscript><strong>We're sorry but FitTrackee doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id="app"></div><script src="/static/js/chunk-vendors.c7e5773d.js"></script><script src="/static/js/app.1f820b50.js"></script></body></html>

View File

@ -64,7 +64,7 @@ self.__precacheManifest = (self.__precacheManifest || []).concat([
"url": "/img/workouts/mountains.svg" "url": "/img/workouts/mountains.svg"
}, },
{ {
"revision": "362d14a4781f029d90962d9a0e2798af", "revision": "d5b5aba0bf70bf6b00daa6f4a151dd8d",
"url": "/index.html" "url": "/index.html"
}, },
{ {
@ -80,7 +80,7 @@ self.__precacheManifest = (self.__precacheManifest || []).concat([
"url": "/static/css/admin.9f104fd3.css" "url": "/static/css/admin.9f104fd3.css"
}, },
{ {
"revision": "4ccf34f938416a1f98c6", "revision": "856998fdc8f720c6dea3",
"url": "/static/css/app.b50ad746.css" "url": "/static/css/app.b50ad746.css"
}, },
{ {
@ -108,8 +108,8 @@ self.__precacheManifest = (self.__precacheManifest || []).concat([
"url": "/static/css/reset.165584bc.css" "url": "/static/css/reset.165584bc.css"
}, },
{ {
"revision": "a1a8fe166d947249a434", "revision": "6163e12e51d7d18c9f41",
"url": "/static/css/workouts.0c5cfad5.css" "url": "/static/css/workouts.368ff8e8.css"
}, },
{ {
"revision": "e719f9244c69e28e7d00e725ca1e280e", "revision": "e719f9244c69e28e7d00e725ca1e280e",
@ -196,8 +196,8 @@ self.__precacheManifest = (self.__precacheManifest || []).concat([
"url": "/static/js/admin.4047df15.js" "url": "/static/js/admin.4047df15.js"
}, },
{ {
"revision": "4ccf34f938416a1f98c6", "revision": "856998fdc8f720c6dea3",
"url": "/static/js/app.5434baf0.js" "url": "/static/js/app.1f820b50.js"
}, },
{ {
"revision": "bd7d183c9f68e5f4027d", "revision": "bd7d183c9f68e5f4027d",
@ -240,7 +240,7 @@ self.__precacheManifest = (self.__precacheManifest || []).concat([
"url": "/static/js/reset.98679f6c.js" "url": "/static/js/reset.98679f6c.js"
}, },
{ {
"revision": "a1a8fe166d947249a434", "revision": "6163e12e51d7d18c9f41",
"url": "/static/js/workouts.f98d0408.js" "url": "/static/js/workouts.52ba33b8.js"
} }
]); ]);

View File

@ -14,7 +14,7 @@
importScripts("https://storage.googleapis.com/workbox-cdn/releases/4.3.1/workbox-sw.js"); importScripts("https://storage.googleapis.com/workbox-cdn/releases/4.3.1/workbox-sw.js");
importScripts( importScripts(
"/precache-manifest.548e1c3c4463fa6d9e835b2a5a45fd90.js" "/precache-manifest.e58c9e28b2243026bdc28972a39db5d6.js"
); );
workbox.core.setCacheNameDetails({prefix: "fittrackee_client"}); workbox.core.setCacheNameDetails({prefix: "fittrackee_client"});

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -151,6 +151,9 @@
<button class="confirm" @click="onFilter"> <button class="confirm" @click="onFilter">
{{ $t('buttons.FILTER') }} {{ $t('buttons.FILTER') }}
</button> </button>
<button class="confirm" @click="onClearFilter">
{{ $t('buttons.CLEAR_FILTER') }}
</button>
</div> </div>
</div> </div>
</div> </div>
@ -202,6 +205,10 @@
} }
router.push({ path: '/workouts', query: params }) router.push({ path: '/workouts', query: params })
} }
function onClearFilter() {
emit('filter')
router.push({ path: '/workouts', query: {} })
}
watch( watch(
() => route.query, () => route.query,
@ -210,7 +217,7 @@
} }
) )
return { translatedSports, onFilter, handleFilterChange } return { translatedSports, onClearFilter, onFilter, handleFilterChange }
}, },
}) })
</script> </script>
@ -262,10 +269,11 @@
.form-button { .form-button {
display: flex; display: flex;
justify-content: center; justify-content: center;
flex-wrap: wrap;
margin: $default-margin * 0.5;
button { button {
margin: $default-padding * 2 $default-padding * 0.5 $default-padding margin-top: $default-margin;
$default-padding * 0.5;
width: 100%; width: 100%;
} }
} }
@ -298,6 +306,7 @@
} }
.form-button { .form-button {
flex-wrap: initial;
button { button {
margin: $default-padding $default-padding * 0.5; margin: $default-padding $default-padding * 0.5;
width: 100%; width: 100%;
@ -332,10 +341,17 @@
} }
} }
.form-button { .form-button {
flex-wrap: initial;
button { button {
margin: $default-padding $default-padding * 0.5; margin: $default-padding $default-padding * 0.5;
} }
} }
} }
@media screen and (max-width: $x-small-limit) {
.form-button {
flex-wrap: wrap;
}
}
} }
</style> </style>

View File

@ -223,7 +223,6 @@
function getWorkoutsQuery(newQuery: LocationQuery): TWorkoutsPayload { function getWorkoutsQuery(newQuery: LocationQuery): TWorkoutsPayload {
query = getQuery(newQuery, orderByList, defaultOrder.order_by, { query = getQuery(newQuery, orderByList, defaultOrder.order_by, {
defaultSort: defaultOrder.order, defaultSort: defaultOrder.order,
query,
}) })
Object.keys(newQuery) Object.keys(newQuery)
.filter((k) => workoutsPayloadKeys.includes(k)) .filter((k) => workoutsPayloadKeys.includes(k))

View File

@ -1,6 +1,7 @@
{ {
"BACK": "Back", "BACK": "Back",
"CANCEL": "Cancel", "CANCEL": "Cancel",
"CLEAR_FILTER": "Clear filters",
"DELETE_MY_ACCOUNT": "Delete my account", "DELETE_MY_ACCOUNT": "Delete my account",
"DISABLE": "Disable", "DISABLE": "Disable",
"EDIT": "Edit", "EDIT": "Edit",

View File

@ -1,6 +1,7 @@
{ {
"BACK": "Précédent", "BACK": "Précédent",
"CANCEL": "Annuler", "CANCEL": "Annuler",
"CLEAR_FILTER": "Réinitialiser",
"DELETE_MY_ACCOUNT": "Supprimer mon compte", "DELETE_MY_ACCOUNT": "Supprimer mon compte",
"DISABLE": "Désactiver", "DISABLE": "Désactiver",
"EDIT": "Modifier", "EDIT": "Modifier",

View File

@ -35,7 +35,7 @@ export const getQuery = (
): TPaginationPayload => { ): TPaginationPayload => {
const queryOptions = options || {} const queryOptions = options || {}
const defaultSort = queryOptions.defaultSort || 'asc' const defaultSort = queryOptions.defaultSort || 'asc'
const query = queryOptions.query || <TPaginationPayload>{} const query = <TPaginationPayload>{}
query.page = getNumberQueryValue(locationQuery.page, defaultPage) query.page = getNumberQueryValue(locationQuery.page, defaultPage)
query.per_page = getNumberQueryValue(locationQuery.per_page, defaultPerPage) query.per_page = getNumberQueryValue(locationQuery.per_page, defaultPerPage)

View File

@ -236,6 +236,24 @@ describe('getQuery w/ default values and input pagination payload', () => {
{ page: 3, per_page: 10, order: 'asc', order_by: 'workouts_count' } { page: 3, per_page: 10, order: 'asc', order_by: 'workouts_count' }
) )
}) })
it('returns query with only pagination keys', () => {
assert.deepEqual(
getQuery(
{
page: '3',
per_page: '10',
order: 'asc',
order_by: 'workouts_count',
sport_id: '1',
},
orderByList,
defaultOrderBy,
{ query: inputQuery }
),
{ page: 3, per_page: 10, order: 'asc', order_by: 'workouts_count' }
)
})
}) })
describe('rangePagination', () => { describe('rangePagination', () => {