qa-regulatory-gwj-vue/src/views/map/dialog/xfPoint.vue

<template>
  <div class="app-container print-work">
    <table class="table-ui">
      <tr>
        <td class="bbg-transparent">消防区域</td>
        <td>{{ info.FIRE_REGION_NAME }}</td>
        <td class="bbg-transparent">消防点位</td>
        <td>{{ info.FIRE_POINT_NAME }}</td>
      </tr>
    </table>
    <div v-if="images.length > 0">
      <div class="level-title">
        <h1>消防点位照片</h1>
      </div>
      <el-carousel :interval="4000" type="card" height="200px" style="margin-top: 10px">
        <el-carousel-item v-for="(item, index) in images[0].FILEPATH_LIST" :key="index">
          <img v-viewer v-if="gangkou === '00004'" :src="config.cfdfileUrl + image.FILEPATH" style="max-width: 100%;">
          <img v-viewer v-else :src="config.fileUrl + item" style="max-width: 100%;">
        </el-carousel-item>
      </el-carousel>
    </div>
    <div v-for="(item,index) in deviceList" :key="index">
      <div class="item">
        <div class="level-title">
          <h1>消防设备</h1>
        </div>
        <table class="table-ui">
          <tr>
            <td class="bbg-transparent">消防设备类型</td>
            <td>{{ item.FIRE_DEVICE_TYPE_NAME }}</td>
            <td class="bbg-transparent">消防设备编码</td>
            <td>{{ item.FIRE_DEVICE_CODE }}</td>
          </tr>
        </table>
        <div class="level-title">
          <h1>消防设备检查标准</h1>
        </div>
        <table class="table-ui">
          <tr>
            <td style="width: 130px;text-align: center">序号</td>
            <td style="text-align: center">检查标准</td>
          </tr>
          <tr v-for="(item1,index1) in item.FIRE_CHECK_STANDARD_ITEM" :key="index1">
            <td style="width: 130px;text-align: center">{{ index1 + 1 }}</td>
            <td style="text-align: center">{{ item1 }}</td>
          </tr>
        </table>
        <div class="level-title">
          <h1>责任部门</h1>
        </div>
        <table class="table-ui">
          <tr>
            <td class="bbg-transparent">责任部门</td>
            <td>{{ info.DEPARTMENT_NAME }}</td>
          </tr>
        </table>
      </div>
    </div>
    <!--功能砍掉-->

    <!--功能砍掉
    <div v-if="images.length > 0">
      <div class="level-title">
        <h1>点位检查合格标准照片</h1>
      </div>
      <el-carousel :interval="4000" type="card" height="200px">
        <el-carousel-item v-for="(image, index) in images" :key="index">
          <img v-viewer v-if="gangkou === '00004'" :src="config.cfdfileUrl + image.FILEPATH" style="max-width: 100%;">
          <img v-viewer v-else :src="config.fileUrl + image.FILEPATH" style="max-width: 100%;">
        </el-carousel-item>
      </el-carousel>
    </div>-->
  </div>
</template>

<script>
import { requestFN } from '@/utils/request'

export default {
  props: {
    id: {
      type: String,
      default() {
        return ''
      }
    },
    type: {
      type: String,
      default() {
        return ''
      }
    },
    gangkou: {
      type: String,
      default: ''
    }
  },
  data() {
    return {
      config: config,
      info: {},
      deviceList: [],
      images: []
    }
  },
  created() {
    this.getData()
  },
  methods: {
    getData() {
      requestFN(
        '/map/getPointInfoADeviceByPid',
        {
          FIRE_POINT_ID: this.id,
          GANGKOU: this.gangkou
        }
      ).then((data) => {
        this.info = data.pointInfo
        this.deviceList = data.deviceList
        this.images = data.checkImages
      }).catch((e) => {
      })
      // requestFN(
      //   '/map/getPointQualifiedPhotos',
      //   {
      //     FIRE_POINT_ID: this.id,
      //     GANGKOU: this.gangkou
      //   }
      // ).then((data) => {
      //   this.images = data.varList
      // }).catch((e) => {
      // })
    }
  }
}
</script>
<style lang="scss" scoped>
.item {
  border-bottom: 1px dashed rgba(255, 255, 255, 0.4);
  padding-bottom: 20px;
}

.level-title {
  margin-top: 10px;
}

.img {
  display: flex;

  .img_item {
    margin-left: 10px;

    &:first-child {
      margin-left: 0;
    }

    img {
      width: 200px;
      height: 200px;
    }
  }
}
</style>