Skip to content
Snippets Groups Projects
Commit 6edc7c44 authored by Andy Leuchtturm's avatar Andy Leuchtturm
Browse files

deactivate FilterSidebarLeft for Testing

parent 69b5e5b1
No related branches found
No related tags found
1 merge request!86planning#1203: Standards
......@@ -3,7 +3,7 @@
*/
import NavHeader from '@/views/it-standards/Navigationheader'
import Intro from '@/views/it-standards/Intro'
import FilterSidebarLeft from '@/views/it-standards/FilterSidebarLeft'
// import FilterSidebarLeft from '@/views/it-standards/FilterSidebarLeft'
import { useRouter } from 'next/router'
import { IconArrowBigRight, IconMail, /* IconBooks, */ IconBook2 } from '@tabler/icons-react'
......@@ -15,7 +15,7 @@ import Tooltip from '@/components/Tooltip'
import Chip from '@/components/Chip'
import Link from 'next/link'
/* import filterData from '@/lib/assets/data/currentFilter.json' */
import filterData from '@/lib/assets/data/currentFilter.json' /* */
import useServiceFilter from 'shared/use-service-filter'
import { ServiceContent } from 'types/ServiceContent'
import { Tag } from 'types/content/'
......@@ -25,21 +25,21 @@ import LifecyclePicture from '@/components/it-standards/LifecyclePicture'
export default function ({ contentsString }) {
const contents: ServiceContent[] = JSON.parse(contentsString)
const router = useRouter()
/* const filters = filterData['filter-it-standards'] */
const { filteredServices /*, activeTagFilters, filterToParams */ } = useServiceFilter(contents, router.query.filter)
const filters = filterData['filter-it-standards'] /* */
const { filteredServices, activeTagFilters, filterToParams /**/ } = useServiceFilter(contents, router.query.filter)
const { getImgPath } = useImgPath()
/* function handleFilters(event) {
const filter = event.target.id.split('-')[0]
if (event.target.checked) {
activeTagFilters[filter].push(event.target.value)
} else if (activeTagFilters[filter].indexOf(event.target.value) >= 0) {
activeTagFilters[filter].splice(activeTagFilters[filter].indexOf(event.target.value), 1)
}
// we always track filters in query params, param change will trigger filtering
router.push(`?filter=${encodeURIComponent(filterToParams())}`, undefined, { shallow: true })
function handleFilters(event) {
const filter = event.target.id.split('-')[0]
if (event.target.checked) {
activeTagFilters[filter].push(event.target.value)
} else if (activeTagFilters[filter].indexOf(event.target.value) >= 0) {
activeTagFilters[filter].splice(activeTagFilters[filter].indexOf(event.target.value), 1)
}
*/
// we always track filters in query params, param change will trigger filtering
router.push(`?filter=${encodeURIComponent(filterToParams())}`, undefined, { shallow: true })
}
/**/
const hasContentTag = (content: ServiceContent, tagName: string) => {
const tags: Tag[] = content.tags.filter(tag => tag.name + ':' + tag.value === tagName)
......@@ -56,19 +56,18 @@ export default function ({ contentsString }) {
<Intro />
</header>
<form name="filters" className="lg:block lg:col-span-2 xl:col-span-2">
<FilterSidebarLeft contentsString={contentsString} />
{ /* <nav
aria-label="Sidebar"
className="sticky top-4 divide-y divide-gray-300"
>
{ /* <FilterSidebarLeft contentsString={contentsString} /> */}
<nav aria-label="Sidebar" className="sticky top-4 divide-y divide-gray-300">
{filters.map((filter) => (
<div className="pt-6 mt-4" key={filter.id}>
{ /* Überschrift für Filterkategorie */}
<p
className="text-xs font-semibold text-gray-500 uppercase tracking-wider"
id={`${filter.id}-headline`}
>
{filter.label}
</p>
{/* Überschrift für Screenreader zur Verfügung stellen */}
<div
className="pl-3 mt-3 space-y-2"
aria-labelledby={`${filter.id}-headline`}
......@@ -95,7 +94,7 @@ export default function ({ contentsString }) {
</div>
</div>
))}
</nav> */ }
</nav>
</form>
<main className="lg:col-start-3 xl:col-start-3 lg:col-span-9 xl:col-span-9">
<div className="mt-4">
......@@ -149,6 +148,7 @@ export default function ({ contentsString }) {
{service.tags.map((tag: Tag, key: number) => {
// return <ServiceTag key={key} tag={tag} style={'bg-gray-400'} />
if (tag.name == 'status') {
// bei dem Tag 'status'(=Lebenszyklusphase) wird das passende Bild angezeigt.
return <LifecyclePicture status = {tag.value} />
}
})}
......
import useBasePath from "shared/use-base-path";
import filterData from "@/lib/assets/data/currentFilter.json";
import useServiceFilter from "shared/use-service-filter";
import { ServiceContent } from "types/ServiceContent";
import { useRouter } from "next/router";
// import useBasePath from 'shared/use-base-path'
import filterData from '@/lib/assets/data/currentFilter.json'
import useServiceFilter from 'shared/use-service-filter'
import { ServiceContent } from 'types/ServiceContent'
import { useRouter } from 'next/router'
export default function ({ contentsString }) {
const contents: ServiceContent[] = JSON.parse(contentsString);
const basePath = useBasePath();
const filters = filterData["filter-it-standards"];
const router = useRouter();
const { filteredServices, activeTagFilters, filterToParams } =
useServiceFilter(contents, router.query.filter);
const contents: ServiceContent[] = JSON.parse(contentsString)
// const basePath = useBasePath()
const filters = filterData['filter-it-standards']
const router = useRouter()
const { /* filteredServices, */ activeTagFilters, filterToParams } =
useServiceFilter(contents, router.query.filter)
function handleFilters(event) {
const filter = event.target.id.split("-")[0];
console.log(filter);
if (event.target.checked) {
activeTagFilters[filter].push(event.target.value);
} else if (activeTagFilters[filter].indexOf(event.target.value) >= 0) {
activeTagFilters[filter].splice(
activeTagFilters[filter].indexOf(event.target.value),
1
);
function handleFilters(event) {
const filter = event.target.id.split('-')[0]
console.log(filter)
if (event.target.checked) {
activeTagFilters[filter].push(event.target.value)
} else if (activeTagFilters[filter].indexOf(event.target.value) >= 0) {
activeTagFilters[filter].splice(
activeTagFilters[filter].indexOf(event.target.value),
1
)
}
// we always track filters in query params, param change will trigger filtering
router.push(`?filter=${encodeURIComponent(filterToParams())}`, undefined, {
shallow: true,
})
}
// we always track filters in query params, param change will trigger filtering
router.push(`?filter=${encodeURIComponent(filterToParams())}`, undefined, {
shallow: true,
});
}
return (
<nav aria-label="Sidebar" className="sticky top-4 divide-y divide-gray-300">
{filters.map((filter) => (
<div className="pt-6 mt-4" key={filter.id}>
<p
className="text-xs font-semibold text-gray-500 uppercase tracking-wider"
id={`${filter.id}-headline`}
>
{filter.label}
</p>
<div
className="pl-3 mt-3 space-y-2"
aria-labelledby={`${filter.id}-headline`}
>
{filter.options.map((option) => (
<div key={option.value} className="flex items-center">
<input
onClick={handleFilters}
id={`${filter.id}-${option.id}`}
name={`${filter.id}[]`}
defaultValue={`${filter.id}:${option.id}`}
defaultChecked={
router.query.filter
? router.query.filter.includes(
`${filter.id}:${option.id}`
)
: false
}
type="checkbox"
className="h-4 w-4 border-gray-300 rounded text-indigo-600 focus:ring-indigo-500"
/>
<label
htmlFor={`${filter.id}-${option.id}`}
className="ml-3 text-sm text-gray-500"
>
{option.label}
</label>
</div>
return (
<nav aria-label="Sidebar" className="sticky top-4 divide-y divide-gray-300">
{filters.map((filter) => (
<div className="pt-6 mt-4" key={filter.id}>
<p
className="text-xs font-semibold text-gray-500 uppercase tracking-wider"
id={`${filter.id}-headline`}
>
{filter.label}
</p>
<div
className="pl-3 mt-3 space-y-2"
aria-labelledby={`${filter.id}-headline`}
>
{filter.options.map((option) => (
<div key={option.value} className="flex items-center">
<input
onClick={handleFilters}
id={`${filter.id}-${option.id}`}
name={`${filter.id}[]`}
defaultValue={`${filter.id}:${option.id}`}
defaultChecked={
router.query.filter
? router.query.filter.includes(
`${filter.id}:${option.id}`
)
: false
}
type="checkbox"
className="h-4 w-4 border-gray-300 rounded text-indigo-600 focus:ring-indigo-500"
/>
<label
htmlFor={`${filter.id}-${option.id}`}
className="ml-3 text-sm text-gray-500"
>
{option.label}
</label>
</div>
))}
</div>
</div>
))}
</div>
</div>
))}
</nav>
);
</nav>
)
}
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment