82 lines
1.4 KiB
Vue
82 lines
1.4 KiB
Vue
<template>
|
|
<div>
|
|
<el-tooltip class="item" effect="dark" content="刷新" placement="top">
|
|
<el-button
|
|
icon="iconfont icon-shuaxin"
|
|
size="small"
|
|
class="btn btn1"
|
|
@click="reload"
|
|
></el-button>
|
|
</el-tooltip>
|
|
<el-tooltip class="item" effect="dark" content="导出" placement="top">
|
|
<el-button
|
|
v-loading="loading"
|
|
element-loading-spinner="el-icon-loading"
|
|
icon="iconfont icon-daochu1"
|
|
size="small"
|
|
class="btn btn2"
|
|
@click="exceldown"
|
|
></el-button>
|
|
</el-tooltip>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
props: ["loading"],
|
|
data() {
|
|
return {};
|
|
},
|
|
components: {},
|
|
//刷新
|
|
inject: ["reload"],
|
|
methods: {
|
|
exceldown() {
|
|
if (this.loading) return;
|
|
this.$emit("exceldown");
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style scoped lang='scss'>
|
|
$btn-color: #606266;
|
|
.btnbox {
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
align-items: center;
|
|
padding: 5px 0;
|
|
|
|
.btn {
|
|
border: none;
|
|
font-size: 26px;
|
|
padding: 5px;
|
|
margin-left: 0;
|
|
background: #f1f2f5;
|
|
}
|
|
|
|
.btn1,
|
|
.btn2 {
|
|
padding: 5px 10px;
|
|
}
|
|
|
|
.el-button:focus,
|
|
.el-button:hover {
|
|
background: #e1e2e6;
|
|
color: $btn-color;
|
|
}
|
|
|
|
span {
|
|
margin: 0 5px;
|
|
}
|
|
}
|
|
::v-deep .el-loading-mask {
|
|
height: 36px;
|
|
line-height: 41px;
|
|
top: 0px;
|
|
background-color: #f1f2f5;
|
|
.el-loading-spinner i {
|
|
font-size: 18px;
|
|
}
|
|
}
|
|
</style> |