feat: button组件替换
This commit is contained in:
@ -25,18 +25,18 @@
|
||||
</div>
|
||||
|
||||
<div class="filter-row flex">
|
||||
<a-button type="outline" class="mr-12px" size="medium">
|
||||
<Button class="mr-12px outline-btn">
|
||||
<template #icon>
|
||||
<icon-search />
|
||||
</template>
|
||||
<template #default>搜索</template>
|
||||
</a-button>
|
||||
<a-button size="medium">
|
||||
搜索
|
||||
</Button>
|
||||
<Button>
|
||||
<template #icon>
|
||||
<icon-refresh />
|
||||
</template>
|
||||
<template #default>重置</template>
|
||||
</a-button>
|
||||
重置
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -65,6 +65,7 @@
|
||||
|
||||
<script setup lang="ts">
|
||||
import { reactive, ref } from 'vue';
|
||||
import { Button } from 'ant-design-vue';
|
||||
|
||||
const pageInfo = reactive({
|
||||
page: 1,
|
||||
@ -140,10 +141,12 @@ const columns = [
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
:deep(.search-btn) {
|
||||
border-radius: 4px;
|
||||
border: 1px solid var(--Brand-Brand-6, #6d4cfe);
|
||||
color: #6d4cfe;
|
||||
:deep(.outline-btn) {
|
||||
border: 1px solid #d9d9d9;
|
||||
&:hover {
|
||||
color: #6d4cfe;
|
||||
border-color: #6d4cfe;
|
||||
}
|
||||
}
|
||||
|
||||
:deep(.edit-btn) {
|
||||
|
||||
@ -25,18 +25,18 @@
|
||||
</div>
|
||||
|
||||
<div class="filter-row flex">
|
||||
<a-button type="outline" class="mr-12px" size="medium">
|
||||
<Button type="primary" ghost class="mr-12px">
|
||||
<template #icon>
|
||||
<icon-search />
|
||||
<icon-search class="mr-8px" />
|
||||
</template>
|
||||
<template #default>搜索</template>
|
||||
</a-button>
|
||||
<a-button size="medium">
|
||||
</Button>
|
||||
<Button>
|
||||
<template #icon>
|
||||
<icon-refresh />
|
||||
<icon-refresh class="mr-8px" />
|
||||
</template>
|
||||
<template #default>重置</template>
|
||||
</a-button>
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -44,8 +44,7 @@
|
||||
<div
|
||||
class="table-wrap bg-#fff rounded-8px border-1px border-#D7D7D9 border-solid px-24px py-24px flex-1 flex flex-col"
|
||||
>
|
||||
<a-table :columns="columns" :data="tableData" @change="handleChange" :pagination="false">
|
||||
</a-table>
|
||||
<a-table :columns="columns" :data="tableData" @change="handleChange" :pagination="false"> </a-table>
|
||||
<div class="pagination-row">
|
||||
<a-pagination
|
||||
:total="pageInfo.total"
|
||||
@ -64,6 +63,7 @@
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { Button } from 'ant-design-vue';
|
||||
import { reactive, ref } from 'vue';
|
||||
|
||||
const pageInfo = reactive({
|
||||
|
||||
Reference in New Issue
Block a user