tongyu_visu/src/views/treesDetails.vue

<template>
  <div class="visual-con">
    <el-dialog title="古树详情" :visible.sync="pointDetailsVisible" width="35rem" v-if="pointDetailsVisible">
      <div class="text-con">
        <div><i class="ismall"></i><span>名称:{{retMap.treesName}}</span></div>
        <!-- <div><i class="ismall"></i><span>经度:{{retMap.longitude}}</span></div>
        <div><i class="ismall"></i><span>纬度:{{retMap.latitude}}</span></div> -->
        <div><i class="ismall"></i><span>编号:{{retMap.treesNumber}}</span></div>
        <div><i class="ismall"></i><span>树龄:{{retMap.treesAge}}</span></div>
        <div><i class="ismall"></i><span>树种:{{retMap.treesSpecies}}</span></div>
<!--        <div><i class="ismall"></i><span>类型:{{retMap.treesType}}</span></div>-->
        <div><i class="ismall"></i><span>备注:{{retMap.treesRemarks}}</span></div>
        <div><i class="ismall"></i><span>部门名称:{{retMap.deptName}}</span></div>
        <div><i class="ismall"></i><span>图片</span><img v-if="retMap.attachId != null" style="width: 400px; height: 400px;" :src="retMap.attachId"></div>
      </div>
    </el-dialog>
  </div>

</template>

<script>
import {getTreesDetail} from '@/api/trees'
export default {
    // dicts: ['farm_hzs_type','farm_farmer_type','farm_breed_type'],
    name: "treesDetails",
    data() {
      return {
        pointDetailsVisible:false,
        retMap:{},
        type:'',
      }
    },
    created(){
    },
    methods: {
      showTreesDetails(pointParam) {
        this.pointDetailsVisible=true;
        getTreesDetail(pointParam.id).then(res => {
          this.retMap = res.data;
        })
      },
    },
}

</script>
<style rel="stylesheet/scss" lang="scss" scoped>
@import '@/assets/styles/base.scss';

.text-con{
	color: #3cd7ef;
	line-height: 40px;
	padding:0 .5rem;
}
.ismall{
	    width: 0.5rem;
	    height: 0.5rem;
	    display: inline-block;
	    background: #3cd7ef;
		margin-right: .3rem;
}
</style>