历史报告样式修改

src/views/custody/testing.vue

@@ -7,22 +7,20 @@
                         <el-col :span="20">
                             <div>[1]文书档案检测一般要求：DA/T 70-2018</div>
                         </el-col>
-                        <!-- <el-col :span="3" :offset="1"><div  style="text-align:right">历史报告</div></el-col> -->
-                        <el-col :offset="1" :span="3">
-                            <div style="text-align:right">
-                                <el-tooltip :visible="visible" effect="light">
-                                    <template #content>
-                                        <div v-if="historyRportlist.length > 0" v-loading="reportLoading" class="reportPop">
-                                            <div v-for="item in historyRportlist" class="history_box">
-                                                <el-link type="primary" @click="viewHpdf(item)">{{ item.reportName }}</el-link>
-                                                <span class="m15">{{ item.examiningTime }}</span>
-                                            </div>
-                                        </div>
-                                        <div v-else>暂无数据</div>
-                                    </template>
-                                    <el-button type="primary" @click="showReport">历史报告</el-button>
-                                </el-tooltip>
-                            </div>
+                        <el-col :offset="1" :span="3" class="text-right">
+                            <el-dropdown>
+                                <el-button type="primary">
+                                    历史报告    <hc-icon name="arrow-down-s" />
+                                </el-button>
+                                <template #dropdown>
+                                    <el-dropdown-menu>
+                                        <template v-if="historyRportlist.length > 0">
+                                            <el-dropdown-item v-for="item in historyRportlist" :key="item.id" @click="viewHpdf(item)">{{ item.reportName }}{{ item.examiningTime }} </el-dropdown-item>
+                                        </template>
+                                        <template v-else> <el-dropdown-item>暂无数据</el-dropdown-item></template>
+                                    </el-dropdown-menu>
+                                </template>
+                            </el-dropdown>
                         </el-col>
                     </el-row>
                     <el-row>
@@ -41,27 +39,26 @@
                 </div>
             </div>
 
-            <div v-if="!isStatus" :style="`background-image: url(${testBgsamll});  aspect-ratio: 1993/468;`" class="bannerbox ">
+            <div v-if="!isStatus" :style="`background-image: url(${testBgsamll});  aspect-ratio: 1993/468;`" class="bannerbox">
                 <div class="infobox">
                     <el-row>
                         <el-col :span="20">
                             <div>[1]文书档案检测一般要求：DA/T 70-2018</div>
                         </el-col>
-                        <el-col :offset="1" :span="3">
-                            <div style="text-align:right">
-                                <el-tooltip :visible="visible" effect="light">
-                                    <template #content>
-                                        <div v-if="historyRportlist.length > 0" v-loading="reportLoading" class="reportPop">
-                                            <div v-for="(item, index) in historyRportlist" :key="index" class="history_box">
-                                                <el-link type="primary" @click="viewHpdf(item)">{{ item.reportName }}</el-link>
-                                                <span class="m15">{{ item.examiningTime }}</span>
-                                            </div>
-                                        </div>
-                                        <div v-else>暂无数据</div>
-                                    </template>
-                                    <el-button type="primary" @click="showReport">历史报告</el-button>
-                                </el-tooltip>
-                            </div>
+                        <el-col :offset="1" :span="3" class="text-right">
+                            <el-dropdown>
+                                <el-button type="primary">
+                                    历史报告    <hc-icon name="arrow-down-s" />
+                                </el-button>
+                                <template #dropdown>
+                                    <el-dropdown-menu>
+                                        <template v-if="historyRportlist.length > 0">
+                                            <el-dropdown-item v-for="item in historyRportlist" :key="item.id" @click="viewHpdf(item)">{{ item.reportName }}{{ item.examiningTime }} </el-dropdown-item>
+                                        </template>
+                                        <template v-else> <el-dropdown-item>暂无数据</el-dropdown-item></template>
+                                    </el-dropdown-menu>
+                                </template>
+                            </el-dropdown>
                         </el-col>
                     </el-row>
                     <el-row>
@@ -93,7 +90,7 @@
             </div>
 
             <div v-if="isStatus" class="statusbox">
-                <div :style="`background-image: url(${bgColor});`" class="statusboxitem">
+                <div class="statusboxitem">
                     <div class="statusboxitem_top">
                         <div class="statusboxitem_top_first">
                             <div style=" font-size: 5.25rem;color :white;">
@@ -394,11 +391,7 @@ watch(() => [
 )
 
 
-//历史报告
-const visible = ref(false)
-const showReport = () => {
-    visible.value = !visible.value
-}
+
 const historyRportlist = ref([])
 //获取历史报告列表
 const reportLoading = ref(false)
@@ -481,7 +474,7 @@ const viewReport = () => {
     margin: 0 auto;
     .statusboxitem {
         width: 15%;
-
+        background-image: url('~src/assets/view/bgcolor.svg');
         background-size: 100% 100%;
         border-radius: 5px;
         font-size: 14px;