Repo for the search and displace core module including the interface to select files and search and displace operations to run on them.
https://searchanddisplace.com
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
|
|
<template> <Fieldset :legend="displayName" :toggleable="true" class="filter-container">
<div v-for="option of optionsList" :key="option.name" class="filter-option"> <h5>{{ option.name }}</h5>
<SelectButton :key="option.name" v-model="selectedOption" :options="option.list" optionLabel="name" /> </div> </Fieldset> </template>
<script lang="ts">
import { Vue, Component, Prop } from 'vue-property-decorator'; import { FilterOptions } from '../../interfaces/FilterOptions';
@Component export default class Filter extends Vue {
@Prop(String) public readonly id!: string;
@Prop(String) public readonly displayName!: string;
@Prop({ default: [] }) public readonly options!: FilterOptions;
private optionsList = new Array;
public selectedOption = null;
public created() { for (let index in this.options) { let words = index.split('_'); for (let i = 0; i < words.length; i++) { words[i] = words[i].charAt(0).toUpperCase() + words[i].substr(1); }
let option = { name: words.join(' '), list: new Array }; this.options[index].forEach( opt => { option.list.push({ 'name': opt, 'value': opt }); });
this.optionsList.push(option); } } } </script>
<style lang="scss"> .filter-container, .filter-option { margin-bottom: 10px; } </style>
|