GithubBackup/MoviePilot-Frontend
1
0
Fork 0
mirror of https://github.com/jxxghp/MoviePilot-Frontend.git synced 2026-05-22 00:39:43 +08:00
Code Issues Packages Projects Releases Wiki Activity

style: Update CustomRuleCard.vue and FilterRuleGroupCard.vue to include filter icons

Browse Source
This commit is contained in:
jxxghp
2024-08-11 17:39:20 +08:00
parent ce96deb224
commit 202b9dc3bc
4 changed files with 28 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
src/assets/images/misc/filter-group.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 8.3 KiB

24
src/assets/images/svg/filter.svg Normal file
View File

@@ -0,0 +1,24 @@
<?xml version="1.0" encoding="iso-8859-1"?>
<!-- Generator: Adobe Illustrator 20.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="&#1057;&#1083;&#1086;&#1081;_1" x="0px" y="0px" viewBox="0 0 64 64" style="enable-background:new 0 0 64 64;" xml:space="preserve">
<linearGradient id="SVGID_1__52535" gradientUnits="userSpaceOnUse" x1="21.9994" y1="11.6667" x2="21.9994" y2="18.5839" spreadMethod="reflect">
<stop offset="0" style="stop-color:#6DC7FF"/>
<stop offset="1" style="stop-color:#E6ABFF"/>
</linearGradient>
<circle style="fill:url(#SVGID_1__52535);" cx="21.999" cy="14.998" r="3"/>
<linearGradient id="SVGID_2__52535" gradientUnits="userSpaceOnUse" x1="35.9994" y1="4.1667" x2="35.9994" y2="15.8334" spreadMethod="reflect">
<stop offset="0" style="stop-color:#6DC7FF"/>
<stop offset="1" style="stop-color:#E6ABFF"/>
</linearGradient>
<circle style="fill:url(#SVGID_2__52535);" cx="35.999" cy="9.998" r="4"/>
<linearGradient id="SVGID_3__52535" gradientUnits="userSpaceOnUse" x1="32" y1="20.7501" x2="32" y2="58.7632" spreadMethod="reflect">
<stop offset="0" style="stop-color:#1A6DFF"/>
<stop offset="1" style="stop-color:#C822FF"/>
</linearGradient>
<path style="fill:url(#SVGID_3__52535);" d="M47.003,21H16.996C15.344,21,14,22.344,14,23.995V25v0.998v1.261 c0,0.717,0.257,1.41,0.722,1.95l10.556,12.315C25.743,42.068,26,42.763,26,43.479v6.964c0,0.652,0.32,1.264,0.854,1.634l8.016,5.569 c0.341,0.236,0.737,0.356,1.136,0.356c0.316,0,0.634-0.076,0.926-0.229C37.591,57.428,38,56.751,38,56.007V43.479 c0-0.716,0.257-1.409,0.722-1.953L49.277,29.21C49.743,28.668,50,27.975,50,27.259v-1.258V25v-1.005C50,22.344,48.655,21,47.003,21z M37.204,40.225c-0.447,0.521-0.762,1.129-0.963,1.775H33v2h3l0.001,2H33v2h3.003l0.002,2H34v2h2.007l0.003,4.002L28,50.442v-6.964 c0-1.193-0.428-2.35-1.205-3.255L17.176,29h29.648L37.204,40.225z M48,26.001C48,26.552,47.552,27,47,27H17.002 C16.449,27,16,26.551,16,25.998V25v-1.005C16,23.446,16.447,23,16.996,23h30.007C47.553,23,48,23.446,48,23.995V25V26.001z"/>
<linearGradient id="SVGID_4__52535" gradientUnits="userSpaceOnUse" x1="41.9994" y1="17.3333" x2="41.9994" y2="21.3333" spreadMethod="reflect">
<stop offset="0" style="stop-color:#6DC7FF"/>
<stop offset="1" style="stop-color:#E6ABFF"/>
</linearGradient>
<path style="fill:url(#SVGID_4__52535);" d="M44.999,21c0-2-1.343-3-3-3s-3,1-3,3H44.999z"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.4 KiB

2
src/components/cards/CustomRuleCard.vue
View File

@@ -1,5 +1,6 @@
<script lang="ts" setup>
import { CustomRule } from '@/api/types'
import filter_svg from '@images/svg/filter.svg'
// 输入参数
const props = defineProps({
@@ -63,6 +64,7 @@ function onClose() {
<h5 class="text-h6 mb-1">{{ props.rule.id }}</h5>
<div class="text-body-1 mb-3">{{ props.rule.name }}</div>
</div>
<VImg :src="filter_svg" cover class="mt-7" max-width="3rem" />
</VCardText>
</VCard>
<VDialog v-model="ruleInfoDialog" scrollable max-width="40rem">

2
src/components/cards/FilterRuleGroupCard.vue
View File

@@ -5,6 +5,7 @@ import { FilterRuleGroup } from '@/api/types'
import FilterRuleCard from '@/components/cards/FilterRuleCard.vue'
import { useToast } from 'vue-toast-notification'
import ImportCodeDialog from '@/components/dialog/ImportCodeDialog.vue'
import filter_group_svg from '@images/misc/filter-group.png'
// 输入参数
const props = defineProps({
@@ -180,6 +181,7 @@ function onClose() {
<h5 class="text-h6 mb-1">{{ props.group.name }}</h5>
<div class="text-body-1 mb-3">{{ props.group.media_type || '通用' }}</div>
</div>
<VImg :src="filter_group_svg" cover class="mt-10" max-width="3rem" />
</VCardText>
</VCard>
<VDialog v-model="groupInfoDialog" scrollable max-width="80rem">