forked from mengyxu/noob-components
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.
63 lines
1.4 KiB
63 lines
1.4 KiB
|
2 years ago
|
<template>
|
||
|
|
<div class="search-row">
|
||
|
|
<div class="left">
|
||
|
|
<span class="title" v-if="title">{{ title }}</span>
|
||
|
|
<el-button v-if="fresh" type="info" icon="Refresh" @click="emit('query')"> </el-button>
|
||
|
|
<el-button v-if="add" type="primary" icon="Plus" @click="emit('add')"> 添加 </el-button>
|
||
|
|
<el-button v-if="del" type="danger" icon="Delete" @click="emit('delete')"> 删除 </el-button>
|
||
|
|
<slot name="left"></slot>
|
||
|
|
</div>
|
||
|
|
<div class="query">
|
||
|
|
<slot></slot>
|
||
|
|
<el-button v-if="query" type="primary" icon="Search" @click="emit('query')"> 查询 </el-button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script lang="ts" setup>
|
||
|
|
import { onMounted, defineProps, defineEmits } from "vue";
|
||
|
|
const prop = defineProps({
|
||
|
|
title: {
|
||
|
|
type: String,
|
||
|
|
default: null
|
||
|
|
},
|
||
|
|
fresh: {
|
||
|
|
type: Boolean,
|
||
|
|
default: true,
|
||
|
|
},
|
||
|
|
add: {
|
||
|
|
type: Boolean,
|
||
|
|
default: true,
|
||
|
|
},
|
||
|
|
del: {
|
||
|
|
type: Boolean,
|
||
|
|
default: true,
|
||
|
|
},
|
||
|
|
query: {
|
||
|
|
type: Boolean,
|
||
|
|
default: true,
|
||
|
|
},
|
||
|
|
});
|
||
|
|
|
||
|
|
const emit = defineEmits(["query", "add", "delete"]);
|
||
|
|
|
||
|
|
onMounted(() => { });
|
||
|
|
</script>
|
||
|
|
<style lang="scss" scoped>
|
||
|
|
//@import url(); 引入公共css类
|
||
|
|
.query {
|
||
|
|
text-align: right;
|
||
|
|
float: right;
|
||
|
|
}
|
||
|
|
|
||
|
|
.left {
|
||
|
|
float: left;
|
||
|
|
}
|
||
|
|
|
||
|
|
.title {
|
||
|
|
font-weight: bold;
|
||
|
|
padding-right: 15px;
|
||
|
|
font-size: 20px;
|
||
|
|
min-width: 20px;
|
||
|
|
}
|
||
|
|
</style>
|