40 lines
641 B
Vue
40 lines
641 B
Vue
|
<template>
|
||
|
|
<label class="file-select">
|
||
|
|
<input type="file" @change="handleFileChange" accept=".phd, .PHD" />
|
||
|
|
<div class="file-name">
|
||
|
|
<slot />
|
||
|
|
</div>
|
||
|
|
</label>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
export default {
|
||
|
|
methods: {
|
||
|
|
handleFileChange(e) {
|
||
|
|
const file = e.target.files[0]
|
||
|
|
if (file) {
|
||
|
|
this.$emit('change', file)
|
||
|
|
}
|
||
|
|
e.target.value = ''
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style lang="less" scoped>
|
||
|
|
.file-select {
|
||
|
|
display: block;
|
||
|
|
height: 42px;
|
||
|
|
line-height: 42px;
|
||
|
|
|
||
|
|
input {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
.file-name {
|
||
|
|
overflow: hidden;
|
||
|
|
text-overflow: ellipsis;
|
||
|
|
white-space: nowrap;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</style>
|