Some checks failed
CI / Test (ubuntu-latest) (push) Has been cancelled
CI / Test (windows-latest) (push) Has been cancelled
CI / Lint (ubuntu-latest) (push) Has been cancelled
CI / Lint (windows-latest) (push) Has been cancelled
CI / Check (ubuntu-latest) (push) Has been cancelled
CI / Check (windows-latest) (push) Has been cancelled
CodeQL / Analyze (${{ matrix.language }}) (none, javascript-typescript) (push) Has been cancelled
Deploy Website on push / Deploy Push Playground Ftp (push) Has been cancelled
Deploy Website on push / Deploy Push Docs Ftp (push) Has been cancelled
Deploy Website on push / Deploy Push Antd Ftp (push) Has been cancelled
Deploy Website on push / Deploy Push Element Ftp (push) Has been cancelled
Deploy Website on push / Deploy Push Naive Ftp (push) Has been cancelled
Release Drafter / update_release_draft (push) Has been cancelled
CI / CI OK (push) Has been cancelled
47 lines
1.6 KiB
Vue
47 lines
1.6 KiB
Vue
<script setup lang="ts">
|
|
|
|
import {
|
|
Card,
|
|
CardContent,
|
|
CardHeader,
|
|
CardTitle,
|
|
VbenIcon,
|
|
} from '../../../../../packages/@core/ui-kit/shadcn-ui';
|
|
import type { Chess } from '#/model/type';
|
|
interface Props {
|
|
items: Chess[];
|
|
title: string;
|
|
}
|
|
|
|
defineOptions({
|
|
name: 'WorkbenchProject',
|
|
});
|
|
|
|
withDefaults(defineProps<Props>(), {
|
|
items: () => [],
|
|
});
|
|
|
|
defineEmits(['click']);
|
|
</script>
|
|
|
|
<template>
|
|
<Card>
|
|
<CardHeader class="py-4 border-border border-b">
|
|
<CardTitle class="text-lg">{{ title }}</CardTitle>
|
|
</CardHeader>
|
|
<CardContent class="flex flex-wrap p-0">
|
|
<template v-for="(item, index) in [...items].sort((a, b) => a.Pos - b.Pos)" :key="index">
|
|
<div class="border-border group cursor-pointer border-b border-r border-t p-0 transition-all hover:shadow-xl flex-none"
|
|
:style="{ width: '35px', height: '35px', backgroundColor: index % 2 === 1 ? '#ced1ca' : '#dde0d7' }"
|
|
style="position: relative;" :id="index.toString()">
|
|
<img v-if="item.Icon" :src="`../../../merge/${item.Icon}.png`"
|
|
style="width:100%;height:100%;object-fit:contain;position: absolute;" />
|
|
<img v-if="item.Lock > 0" :src="`../../../merge/merge_bag.png`"
|
|
style="width:100%;height:100%;object-fit:contain;opacity: 0.7;" />
|
|
</div>
|
|
<div v-if="(index + 1) % 7 === 0" class="w-full h-0" :id="(index + 1).toString()"></div>
|
|
</template>
|
|
</CardContent>
|
|
</Card>
|
|
</template>
|