Фильтр JSON по DateRange и раскрывающимся значениям

Question

Я пытаюсь создать базовый c виджет «Подгонка детали», где он считывает список данных JSON детали и вычисляет код состояния:

• Blue (haven ' t выбранный год или модель еще)
• Зеленый (подходит)
• Желтый (МОЖЕТ подойти)
• Красный (НЕ подходит)

Здесь является примером JSON из массива частей:

{"Model":"318i","FromDate":"9/1/1989 0:00:00","ToDate":"8/31/1991 0:00:00","AppNote":"Your BMW Requires 5.3 Quarts/5 Liters"}

Как мне выполнить sh простой фильтр частей с двумя раскрывающимися списками: один для года и один для модели? Мне понадобится какой-то метод / фильтр «Диапазон дат», но я просто не уверен, как go лучше всего об этом

Любая помощь будет принята с благодарностью, и извините за начальную неопределенность.

HTML:

<div id="blue" class="alert alert-info" role="alert" v-if="filtered===false">
        <i class="fa fa-question-circle" aria-hidden="true"></i>
        <h4>Does This item fit your Car?</h4>
        <p class="choose">Choose your Car to verify fitment</p>
        <label class="filter select">
            <select v-model="selectedYear">
                <option value="">Choose Year</option>
                <option v-for="year in years" :value="year">{{ year }}</option>
            </select>
        </label>
        <label class="filter select">
            <select v-model="selectedModel">
                <option value="" selected>Model</option>
                <option value="">All</option>
            </select>
        </label>
    </div>

Vue:

    // TODO

    // 1. Get date from selected, format it to grab year from date string, determine "cut-off" year/month from string.
    // 2. Filter second dropdown "Models" based on Date range from first dropdown
    // 3. Determine cookie value to "Save Current Vehicle"
    // 4. Display conditional status when this is achieved
    // 5. Display AppNote if applicable

        var vm = new Vue({
            el:  "#parts",
            data: {
                sku: "36112229650",
                parts: [],
                selectedYear: "",
                selectedModel: ""
            },
            props: {
                filtered: {
                    type: Boolean,
                }
            },
            computed: {

                filteredParts: function() {
                    var vm = this;
                    var year = vm.selectedYear;
                    var model = vm.selectedModel;

                    if(year === "" && model === "") {
                        //save performance, just return the default array:
                        return vm.parts;
                    }
                    else {
                        return vm.parts.filter(function(part) {
                            vm.filtered=true;
                            //return the array after passing it through the filter function:
                            return  (year === '' || part.FrDate === year) && (model === ''  || part.Mdl === model);

                        });
                    }
                },
                years () {
                    const year = new Date().getFullYear()
                    return Array.from({length: year - 1900}, (value, index) => 1901 + index)
                }

            }
        });
    </script>