|
@@ -0,0 +1,76 @@
|
|
|
+<template>
|
|
|
+ <el-scrollbar>
|
|
|
+ <div class="grid-container">
|
|
|
+ <div v-for="(box, index) in drawingData" :key="index" class="suit-box">
|
|
|
+ <div class="pdf-box">
|
|
|
+ <PDFView :pdf-source="box.drawingPath" />
|
|
|
+ </div>
|
|
|
+ <div class="suit-title">{{ box?.drawingTitle }}</div>
|
|
|
+ <!-- <div class="suit-desc">{{ box?.desc }}对待</div>-->
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-scrollbar>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script lang="ts" setup>
|
|
|
+import { drawingList } from "@/api/process/reportBreak";
|
|
|
+import { useProcessStore } from "@/store/modules/processView";
|
|
|
+import PDFView from "@/components/PDFView/index.vue";
|
|
|
+
|
|
|
+const processStore = useProcessStore();
|
|
|
+const drawingData = ref<any>([]);
|
|
|
+
|
|
|
+onMounted(() => {
|
|
|
+ drawingList({ materialCode: processStore.scanInfo.materialCode }).then(
|
|
|
+ (res) => {
|
|
|
+ drawingData.value = res.data;
|
|
|
+ }
|
|
|
+ );
|
|
|
+});
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+.grid-container {
|
|
|
+ display: grid;
|
|
|
+ /*行间距*/
|
|
|
+ grid-row-gap: 24px;
|
|
|
+ /*列间距*/
|
|
|
+ grid-column-gap: 24px;
|
|
|
+
|
|
|
+ overflow-y: auto;
|
|
|
+ padding: 24px;
|
|
|
+ width: calc(100% - 48px);
|
|
|
+ grid-template-columns: 1fr 1fr 1fr;
|
|
|
+
|
|
|
+ .suit-box {
|
|
|
+ height: 343px;
|
|
|
+ background-color: white;
|
|
|
+ border-radius: 16px 16px 16px 16px;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ align-items: start;
|
|
|
+ justify-content: center;
|
|
|
+
|
|
|
+ .pdf-box {
|
|
|
+ height: 263px;
|
|
|
+ width: 100%;
|
|
|
+ overflow: hidden;
|
|
|
+ }
|
|
|
+
|
|
|
+ .suit-title {
|
|
|
+ font-weight: 500;
|
|
|
+ font-size: 20px;
|
|
|
+ color: rgba(0, 0, 0, 0.9);
|
|
|
+ text-align: left;
|
|
|
+ margin-left: 24px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .suit-desc {
|
|
|
+ font-size: 20px;
|
|
|
+ color: rgba(0, 0, 0, 0.6);
|
|
|
+ text-align: left;
|
|
|
+ margin-left: 24px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|