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> <div class="p-d-flex p-flex-row p-jc-between p-ai-stretch"> <Panel class="p-mr-2 p-as-stretch file-card" > <template #header> File preview </template>
<Skeleton /><br /> <Skeleton /><br /> <Skeleton /><br /> <Skeleton /><br /> <Skeleton /><br /> <Skeleton /><br /> <Skeleton /><br /> </Panel>
<Card class="p-mr-2 p-as-stretch filters-card"> <template #header> <Toolbar> <template #left> <h3>Available filters</h3> </template> <template #right> <Button icon="pi pi-plus" class="p-button-success" /> </template> </Toolbar> </template>
<template #content> <filter-view v-for="(filter, id, index) in filters" :key="index" :id="id" :display-name="filter.display_name" :options="filter.options" ></filter-view> </template> </Card> </div> </template>
<script lang="ts"> import { Vue, Component, Prop } from 'vue-property-decorator'; import { FileData } from '../interfaces/FileData'; import { FilterInterface } from '../interfaces/FilterInterface';
@Component export default class ProcessFile extends Vue {
@Prop({ default: null }) public readonly file!: FileData|null;
@Prop({ default: [] }) public readonly filters!: { [keys:string]: FilterInterface }
private selectedFile: File|null = null; private selectedFilters = [];
/** * */ created() { console.log('FILE: ', this.file); console.log('FILTERS: ', this.filters); } } </script>
<style lang="scss"> .file-card { flex: 0 1 66%; }
.filters-card { flex: 0 1 32% } </style>
|