change pdf look style

share-pdf
Mustafa Yontar 5 years ago
parent ff33fef820
commit e5809794e3
  1. 23
      src/lib/PdfShare.vue

@ -1,11 +1,20 @@
<template> <template>
<div style="position: absolute;right: 0;bottom:0"> <div style="position: absolute;right: 0;bottom:0;width: 400px;border:1px solid #ccc">
<v-row>
<v-col cols="12" md="10">
<v-file-input ref="file" id="myfile" accept="pdf" label="Please select a file"></v-file-input> <v-file-input ref="file" id="myfile" accept="pdf" label="Please select a file"></v-file-input>
<v-btn @click="loadFile">load file</v-btn>
<canvas style="zoom:0.3" id="mypdfview"></canvas> </v-col>
<v-btn @click="prevPage">Prev</v-btn> <v-col cols="12" md="2">
<span v-if="pdf && !loading">{{pdf.numPages}}</span> <v-btn @click="loadFile" icon><v-icon>mdi-chevron-right</v-icon></v-btn>
<v-btn @click="nextPage">Next</v-btn>
</v-col>
</v-row>
<canvas style="zoom:0.3" id="mypdfview"></canvas><br />
<v-btn v-if="pdf && !loading" :disabled="pageNumber ==1" @click="prevPage" icon><v-icon>mdi-chevron-left</v-icon></v-btn>
<span v-if="pdf && !loading">{{pageNumber}} / {{pdf.numPages}}</span>
<v-btn v-if="pdf && !loading" :disabled="pdf.numPages == pageNumber" @click="nextPage" icon><v-icon>mdi-chevron-right</v-icon></v-btn>
</div> </div>
</template> </template>
@ -29,7 +38,7 @@ export default {
}, },
data: () => ({ data: () => ({
pdf:null, pdf:null,
pageNumber:0, pageNumber:1,
loading:true, loading:true,
pluginHandle: null pluginHandle: null
}), }),

Loading…
Cancel
Save