智慧园区前端大屏
shuishen
2024-11-11 856df58ee56f3c6163bdc938b4fb7c5085ede6b5
src/views/companyInfo/components/box/fireSource.vue
@@ -8,9 +8,64 @@
 * 
 * Copyright (c) 2023 by ${git_name_email}, All Rights Reserved. 
-->
<template>
  <div class="data-content w100 h100">
    <div class="clearfix">
      <div class="content-firmIntro">
        <el-image :src="data.companyInfo.imageUrls" :zoom-rate="1.2" :max-scale="7" :min-scale="0.2"
          :preview-src-list="[data.companyInfo.imageUrls]" :initial-index="4" fit="cover">
          <template #error>
            <div class="image-slot">
              <el-icon><icon-picture /></el-icon>
            </div>
          </template>
        </el-image>
        <span> {{ data.companyInfo.firmIntro }} </span>
      </div>
    </div>
    <div class="company-info">
      <div class="company-info-item" v-for="item in companyInfoList" :key="item.id">
        <el-row>
          <el-col :span="8">
            <div class="company-info-title">{{ item.title }}</div>
          </el-col>
          <el-col :span="16">
            <div class="company-info-content">{{ item.content }}</div>
          </el-col>
        </el-row>
      </div>
    </div>
    <div class="company-info">
      <div class="" style="text-align: center;margin-top: 10px;">救援队伍</div>
      <div class="company-info-item" v-for="item in rescueTeamList" :key="item.id">
        <el-row>
          <el-col :span="8">
            <div class="company-info-title">{{ item.title }}</div>
          </el-col>
          <el-col :span="16">
            <div class="company-info-content">{{ item.content }}</div>
          </el-col>
        </el-row>
      </div>
    </div>
    <!-- <div class="company-info-image">
      <div class="" style="text-align: center;margin-top: 10px;">企业图片</div>
    </div> -->
  </div>
</template>
<script setup>
import publicContent from './publicContent.vue'
import { getAssetsFile } from 'utils/utils'
import { getfirmInfoDetail } from '@/api/indParkInfo'
let data = reactive({
  companyInfo: {}
})
@@ -55,48 +110,46 @@
  }
])
let rescueTeamList = ref([
  {
    id: 5,
    name: 'rescuePerName',
    title: '姓名',
    content: '',
  },
  {
    id: 6,
    name: 'rescuePerPhone',
    title: '联系电话',
    content: '',
  }
])
onMounted(() => {
  data.companyInfo = JSON.parse(localStorage.getItem('companyInfo'))
  console.log(data.companyInfo)
  companyInfoList.value.forEach(item => {
    data.companyInfo[item.name] && (item.content = data.companyInfo[item.name])
  })
  getDetail()
})
function getDetail() {
  getfirmInfoDetail({
    id: data.companyInfo.id
  }).then(res => {
    data.companyInfo = res.data.data
    companyInfoList.value.forEach(item => {
      data.companyInfo[item.name] && (item.content = data.companyInfo[item.name])
    })
    rescueTeamList.value.forEach(item => {
      data.companyInfo[item.name] && (item.content = data.companyInfo[item.name])
    })
  }).catch(err => {
  })
}
</script>
<template>
  <div class="data-content w100 h100">
    <div class="content-firmIntro">
      <!-- <div>{{ data.companyInfo.firmIntro }}</div> -->
      <span> {{ data.companyInfo.firmIntro }}</span>
    </div>
    <div class="company-info">
      <div class="company-info-item" v-for="item in companyInfoList" :key="item.id">
        <el-row>
          <el-col :span="8">
            <div class="company-info-title">{{ item.title }}</div>
          </el-col>
          <el-col :span="16">
            <div class="company-info-content">{{ item.content }}</div>
          </el-col>
        </el-row>
      </div>
    </div>
    <div class="company-info-image">
      <img :src="data.companyInfo.image_urls" alt="">
      <!-- {{ "图片" }} -->
    </div>
  </div>
</template>
<style lang="scss" scoped>
.data-content {
@@ -104,11 +157,25 @@
  color: #fff;
}
.clearfix::after {
  content: '';
  display: block;
  clear: both;
}
.content-firmIntro {
  height: 300px;
  overflow-x: hidden;
  // 隐藏滚动条
  scrollbar-width: none;
}
.content-firmIntro .el-image {
  float: left;
  margin-right: 10px;
  margin-top: 5px;
  width: 90px;
  height: 90px;
}
.content-firmIntro span {
@@ -134,11 +201,13 @@
}
.company-info-image {
  margin-top: 20px;
  width: 100%;
  height: 200px;
  // background-color: pink;
.company-info-jydw {
  margin-top: 10px;
  border-top: #dfdcdc 2px solid;
}
.company-info-jydw div {
  text-align: center;
  margin-top: 10px;
}
</style>