Update - 企业详情弹窗完善

src/components/companyProjectDialog/index.vue

@@ -11,16 +11,39 @@
       custom-class="tvDialog"
       width="44%"
       title="企业详情"
-      aria-modal    ="false"
-      style="margin-top: 12vh !important;">
+      aria-modal="false"
+      style="margin-top: 10vh !important;">
       <div class="contain">
-        <div
-            v-for="(e,idx) in deviceInfoList"
-            :key="idx"
-        >
-            <span>{{ e.label }}：</span>
-            <span :title="e.value">{{ e.value }}</span>
+        <div>
+          <span>标题：</span>
+          <span :title="info.title">{{ info.title }}</span>
         </div>
+        <div>
+          <span>行管局：</span>
+          <span :title="info.unit">{{ info.unit }}</span>
+        </div>
+        <div>
+          <span>内容：</span>
+          <span :title="info.content" style="height: 200px;white-space: normal;overflow: hidden scroll;">{{ info.content }}</span>
+        </div>
+        <div style="margin-top: 22%;">
+          <span>图片：</span>
+          <span style="height: 200px;white-space: normal;overflow: hidden scroll;">
+            <span v-for="(e,idx) in info.imgList" :key="idx" @click="downloadImg(e.name,e.url)" :href="e.url" download>{{ e.name }}</span>
+          </span>
+        </div>
+        <div style="margin-top: 22%;">
+          <span>视频：</span>
+          <span style="height: 200px;white-space: normal;overflow: hidden scroll;">
+            <span v-for="(e,idx) in info.imgList" :key="idx" @click="downloadImg(e.name,e.url)" :href="e.url" download>{{ e.name }}</span>
+          </span>
+        </div> 
+        <div style="margin-top: 22%;">
+          <span>附件：</span>
+          <span style="height: 200px;white-space: normal;overflow: hidden scroll;">
+            <span v-for="(e,idx) in info.imgList" :key="idx" @click="downloadImg(e.name,e.url)" :href="e.url" download>{{ e.name }}</span>
+          </span>
+        </div>  
       </div>
     </el-dialog>
 </template>
@@ -29,8 +52,7 @@
 export default{
     data(){
         return{
-            deviceInfoList:[
-            ],
+            info:{},
             currentDeviceData:null,
             noHavePic:require('@/assets/images/integrated/event-img-sub.png'),
             tvPicList:[
@@ -43,9 +65,22 @@ export default{
     },
     methods:{
       open(param){
-        this.deviceInfoList = param
+        this.info = param
         this.dialogVisible = true
       },
+      downloadImg(name,url){
+        fetch(url)
+        .then(response => response.blob())
+        .then(blob => {
+            const anchor = document.createElement('a');
+            const url = window.URL.createObjectURL(blob);
+            anchor.href = url;
+            anchor.download = name;
+            anchor.click();
+            window.URL.revokeObjectURL(url);
+        })
+        .catch(error => console.error('下载图片失败', error));
+      }
     }
 
 }
@@ -58,15 +93,14 @@ export default{
     overflow: hidden;
     overflow-y: scroll;
     width: 100%;
-    height: 500px;
-    display: flex;
+    height: 675px;
     align-content: flex-start;
     padding-top: 1%;
     flex-wrap: wrap;
     color: #fff;
     >div{
         display: flex;
-        width: 49%;
+        width: 100%;
         height: 6%;
         font-size: 16px;
         line-height: 2; 
@@ -74,8 +108,11 @@ export default{
         >span{  
             display: inline-block;
         }
+        >span::-webkit-scrollbar{
+          display: none;
+        }
         >span:nth-child(1){
-            width: 50%;
+            width: 30%;
             height: 100%;
             text-align: right;
         }
@@ -107,7 +144,7 @@ export default{
 }
 .tvDialog{
   margin-top: 10vh !important;
-  height: 70% !important;
+  height: 90% !important;
   left: 0 !important;
 
   padding-top: 0;

src/views/forest.vue

@@ -591,7 +591,20 @@
     /** ----------------------------------weosocket结束------------------------------------- */
     methods: {
       showCompanyDialog(e){
-        this.$refs.companyProjectDialog.open({label:'测试',value:'测试'})
+        let detailInfo = {
+          title:'测试标题',
+          unit:'林业',
+          content:'测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容',
+          imgList:[
+            {
+              name:'测试',
+              url:'https://img.picui.cn/free/2025/06/24/685a087ac3880.jpg'
+            }
+          ],
+          videos:[],
+          others:[]
+        }
+        this.$refs.companyProjectDialog.open(detailInfo)
       },
       // 查询收藏列表
       getCompanyList(pageSize, pageNum) {