|
|
@@ -13,7 +13,8 @@
|
|
|
<span>共 {{ list.length }} 条</span>
|
|
|
</p>
|
|
|
<section>
|
|
|
- <div v-for="(item, key) in list" :key="key">
|
|
|
+ <div :class="[item.doc_id === target_doc_id? 'activeBox' : '']"
|
|
|
+ v-for="(item, key) in list" :key="key" @click="handelChangePdf(item)">
|
|
|
<div>
|
|
|
<img src="@/assets/document/icon.svg" />
|
|
|
</div>
|
|
|
@@ -33,13 +34,13 @@
|
|
|
</section>
|
|
|
</div>
|
|
|
<div class="right" ref="pdfFather">
|
|
|
- <PDFViewer ref="pdfViewer" class="pdf-viewer" :url="pdf_url" :doc_width="DOC_WIDTH" :positions="positions">
|
|
|
+ <PDFViewer v-if="showPdfViewer" ref="pdfViewer" class="pdf-viewer" :url="pdf_url" :doc_width="DOC_WIDTH" :positions="positions">
|
|
|
</PDFViewer>
|
|
|
</div>
|
|
|
</main>
|
|
|
</template>
|
|
|
<script>
|
|
|
-import { defineComponent, inject, onMounted, ref } from "vue";
|
|
|
+import { defineComponent, inject, onMounted, ref, nextTick } from "vue";
|
|
|
import PDFViewer from '@/components/pdf-viewer/PDFViewer.vue'
|
|
|
import { getDocumentUrl } from '@/ajax/document';
|
|
|
export default defineComponent({
|
|
|
@@ -49,12 +50,15 @@ export default defineComponent({
|
|
|
const { helper, config } = inject("$global");
|
|
|
const userName = ref(helper.read("userName") || "");
|
|
|
const list = ref([]);
|
|
|
+ const showPdfViewer = ref(true);
|
|
|
const positions = ref([]);
|
|
|
const pdfFather = ref(null);
|
|
|
const DOC_WIDTH = ref(1100)
|
|
|
- const pdf_url = getDocumentUrl(props.targetDocument.id);
|
|
|
+ const pdf_url = ref('')
|
|
|
+ let target_doc_id = ref(props.targetDocument.id)
|
|
|
+ pdf_url.value = getDocumentUrl(target_doc_id.value);
|
|
|
const pdfViewer = ref(null);
|
|
|
- const docData = props.targetDocument.reference
|
|
|
+ const docData = props.targetDocument
|
|
|
list.value = docData.doc_aggs.map(item => {
|
|
|
return {
|
|
|
...item,
|
|
|
@@ -65,12 +69,31 @@ export default defineComponent({
|
|
|
const goBack = () => {
|
|
|
emit("go-back");
|
|
|
};
|
|
|
+ const handelChangePdf = (item) => {
|
|
|
+ if (item.doc_id !== target_doc_id.value) {
|
|
|
+ readLoadPdf()
|
|
|
+ pdf_url.value = getDocumentUrl(item.doc_id)
|
|
|
+ target_doc_id.value = item.doc_id
|
|
|
+ }
|
|
|
+ }
|
|
|
const handlerClickFragment = (frag) => {
|
|
|
+ if (frag.doc_id !== target_doc_id.value) {
|
|
|
+ readLoadPdf()
|
|
|
+ pdf_url.value = getDocumentUrl(frag.doc_id)
|
|
|
+ target_doc_id.value = frag.doc_id
|
|
|
+ }
|
|
|
positions.value = frag.positions || [];
|
|
|
if (frag.positions && frag.positions.length) {
|
|
|
pdfViewer.value.toPageIndex(positions.value[0][0], positions.value)
|
|
|
}
|
|
|
}
|
|
|
+ // 切换问答需要重新加载pdf
|
|
|
+ const readLoadPdf = () => {
|
|
|
+ showPdfViewer.value = false
|
|
|
+ setTimeout(() => {
|
|
|
+ showPdfViewer.value = true
|
|
|
+ })
|
|
|
+ }
|
|
|
onMounted(() => {
|
|
|
// DOC_WIDTH.value = pdfFather.value.getBoundingClientRect().width
|
|
|
})
|
|
|
@@ -83,6 +106,9 @@ export default defineComponent({
|
|
|
positions,
|
|
|
pdfFather,
|
|
|
pdfViewer,
|
|
|
+ showPdfViewer,
|
|
|
+ target_doc_id,
|
|
|
+ handelChangePdf,
|
|
|
handlerClickFragment
|
|
|
};
|
|
|
}
|
|
|
@@ -251,5 +277,8 @@ main {
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+ .activeBox{
|
|
|
+ border: 2px solid #00aea3 !important;
|
|
|
+ }
|
|
|
}
|
|
|
</style>
|