fuse-code/src/views/guide/path/show.vue

<template>
  <ui-group :title="$t('am.path.list')" class="show-taggings">
    <template #icon>
      <ui-icon
        ctrl
        :type="selectPaths.all.value ? 'eye-s' : 'eye-n'"
        @click="selectPaths.all.value = !selectPaths.all.value"
      />
    </template>
    <PathSign
      v-for="path in filterPath"
      :key="path.id"
      :path="path"
      :edit="false"
      class="show-path"
    />
  </ui-group>
</template>

<script setup lang="ts">
import { custom } from "@/env";
import PathSign from "./sign.vue";
import { paths, selectPaths } from "@/store";
import { computed } from "vue";

const props = withDefaults(defineProps<{ keyword?: string }>(), { keyword: "" });

const filterPath = computed(() =>
  paths.value.filter((path) => path.name.includes(props.keyword))
);
</script>

<style lang="scss" scoped>
.show-path {
  border-bottom: 1px solid var(--colors-border-color);
}
</style>