`#修改了乔木,乔木修改,乔木revel,优势灌木,珍稀濒危,经济植物,植物影像页面,

src/views/data/FindingsAdd.vue

@@ -18,9 +18,10 @@
               <el-option v-for="item in investigatorsList" :key="item.id" :label="item.name" :value="item.id"></el-option>
             </el-select>
           </el-form-item>
-            <el-form-item label="调查点编号">
+          <el-row>
-              <el-input v-model="form.findingscode" clearable></el-input>
+            <el-col :span="2.5" class="dianbian">调查点编号</el-col>
-            </el-form-item>
+            <el-col :span="21"><el-input class="sp21" v-model="form.findingscode" clearable></el-input></el-col>
+          </el-row>
            <el-form-item label="调查日期">
               <el-col :span="11">
                 <el-date-picker type="date" placeholder="选择日期" v-model="form.date" style="width: 720px;"></el-date-picker>
@@ -72,13 +73,13 @@
               <el-input v-model="form.terrain"></el-input>
             </el-form-item>
           <el-form-item label="">
-              海拔：<el-input v-model="form.elevation" style="width: 200px"></el-input><span class="km">km</span>坡向：<el-input v-model="form.exposure" style="width: 200px"></el-input><span class="km" style="margin-right: 0">度</span><br>坡度：<el-input v-model="form.gradient" style="width: 200px"></el-input><span class="km">度</span>坡位：<el-input v-model="form.slopeposition" style="width: 200px;margin-top: 20px"></el-input>
+              海拔：<el-input v-model="form.elevation" style="width: 200px"></el-input><span class="km">&emsp;km</span>坡向：<el-input v-model="form.exposure" style="width: 200px"></el-input><span class="km" style="margin-right: 0">&emsp;度</span><br>坡度：<el-input v-model="form.gradient" style="width: 200px"></el-input><span class="km">&emsp;度</span>坡位：<el-input v-model="form.slopeposition" style="width: 200px;margin-top: 20px"></el-input>
             </el-form-item>
           <el-form-item label="河流湖泊">
               <el-input v-model="form.river"></el-input>
             </el-form-item>
           <el-form-item label="">
-              河流长：<el-input v-model="form.riverlength" style="width: 200px"></el-input><span class="km">km</span>河流宽：<el-input v-model="form.riverwidth" style="width: 200px"></el-input><span class="km" style="margin-right: 0">km</span><br>河流深：<el-input v-model="form.riverdeep" style="width: 200px;margin-top: 20px"></el-input><span class="km">km</span>河流形状：<el-input v-model="form.rivershape" style="width: 200px;margin-top: 20px"></el-input>
+              河流长：<el-input v-model="form.riverlength" style="width: 200px"></el-input><span class="km">&emsp;km</span>河流宽：<el-input v-model="form.riverwidth" style="width: 200px"></el-input><span class="km" style="margin-right: 0">&emsp;km</span><br>河流深：<el-input v-model="form.riverdeep" style="width: 200px;margin-top: 20px"></el-input><span class="km">&emsp;km</span>河流形状：<el-input v-model="form.rivershape" style="width: 200px;margin-top: 20px"></el-input>
             </el-form-item>
           <el-form-item label="人为干扰">
               <el-input type="textarea" v-model="form.jamming"></el-input>
@@ -489,4 +490,16 @@ export default {
   .km {
     margin-right: 10px;
   }
+  .dianbian {
+    font-size: 14px;
+    text-align: left;
+    padding-right: 10px;
+    height: 40px;
+    line-height: 40px;
+    margin-top: 30px;
+  }
+  .sp21 {
+    width: 720px;
+    margin-top: 30px;
+  }
 </style>

src/views/data/FindingsUpdate.vue

@@ -16,9 +16,9 @@
               <el-option v-for="item in investigatorsList" :key="item.id" :label="item.name" :value="item.id"></el-option>
             </el-select>
           </el-form-item>
-            <el-form-item label="调查点编号">
+<!--            <el-form-item label="调查点编号">-->
-              <el-input v-model="form.findingscode" clearable></el-input>
+<!--              <el-input v-model="form.findingscode" clearable></el-input>-->
-            </el-form-item>
+<!--            </el-form-item>-->
           <el-row>
             <el-col :span="2.5" class="dianbian">调查点编号</el-col>
             <el-col :span="21"><el-input class="sp21" v-model="form.findingscode" clearable></el-input></el-col>
@@ -83,13 +83,13 @@
               <el-input v-model="form.terrain"></el-input>
             </el-form-item>
           <el-form-item label="">
-              海拔：<el-input v-model="form.elevation" style="width: 200px"></el-input><span class="km">km</span>坡向：<el-input v-model="form.exposure" style="width: 200px"></el-input><span class="km" style="margin-right: 0">度</span><br>坡度：<el-input v-model="form.gradient" style="width: 200px"></el-input><span class="km">度</span>坡位：<el-input v-model="form.slopeposition" style="width: 200px;margin-top: 20px"></el-input>
+              海拔：<el-input v-model="form.elevation" style="width: 200px"></el-input><span class="km">&emsp;km</span>坡向：<el-input v-model="form.exposure" style="width: 200px"></el-input><span class="km" style="margin-right: 0">&emsp;度</span><br>坡度：<el-input v-model="form.gradient" style="width: 200px"></el-input><span class="km">&emsp;度</span>坡位：<el-input v-model="form.slopeposition" style="width: 200px;margin-top: 20px"></el-input>
             </el-form-item>
           <el-form-item label="河流湖泊">
               <el-input v-model="form.river"></el-input>
             </el-form-item>
           <el-form-item label="">
-              河流长：<el-input v-model="form.riverlength" style="width: 200px"></el-input><span class="km">km</span>河流宽：<el-input v-model="form.riverwidth" style="width: 200px"></el-input><span class="km" style="margin-right: 0">km</span><br>河流深：<el-input v-model="form.riverdeep" style="width: 200px;margin-top: 20px"></el-input><span class="km">km</span>河流形状：<el-input v-model="form.rivershape" style="width: 200px;margin-top: 20px"></el-input>
+              河流长：<el-input v-model="form.riverlength" style="width: 200px"></el-input><span class="km">&emsp;km</span>河流宽：<el-input v-model="form.riverwidth" style="width: 200px"></el-input><span class="km" style="margin-right: 0">&emsp;km</span><br>河流深：<el-input v-model="form.riverdeep" style="width: 200px;margin-top: 20px"></el-input><span class="km">&emsp;km</span>河流形状：<el-input v-model="form.rivershape" style="width: 200px;margin-top: 20px"></el-input>
             </el-form-item>
           <el-form-item label="人为干扰">
               <el-input type="textarea" v-model="form.jamming"></el-input>
@@ -516,8 +516,12 @@ export default {
     font-size: 14px;
     text-align: left;
     padding-right: 10px;
+    height: 40px;
+    line-height: 40px;
+    margin-top: 30px;
   }
   .sp21 {
     width: 720px;
+    margin-top: 30px;
   }
 </style>

src/views/data/SamplebushAdd1.vue

@@ -88,12 +88,22 @@
             </el-row>
             <el-row>
               <el-col :span="5">中文名</el-col>
-              <el-col :span="7">
+              <el-col :span="7" class="sp7">
-                <el-input v-model="form.chinesename" clearable></el-input>
+                <el-input @input="changechinese(form.chinesename)" v-model="form.chinesename" clearable></el-input>
+                <div class="ab">
+                  <div class="datachinese" v-for="(v,i) in datachinese" :key="i">
+                    <div>{{v.scientificchinesename}}</div>
+                  </div>
+                </div>
               </el-col>
               <el-col :span="5">拉丁名</el-col>
-              <el-col :span="7">
+              <el-col :span="7" class="sp7">
-                <el-input v-model="form.latinname" clearable></el-input>
+                <el-input @input="changelatin(form.latinname)" v-model="form.latinname" clearable></el-input>
+                <div class="ab">
+                    <div class="datachinese" v-for="(v,i) in datalatin" :key="i">
+                      <div>{{v.familylatinname}}</div>
+                    </div>
+                  </div>
               </el-col>
             </el-row>
              <el-row>
@@ -181,6 +191,8 @@ export default {
       dialogImageUrl: '',
       dialogVisible: false,
       fd: new FormData(),
+      datachinese: '',
+      datalatin: '',
       form: {
         smallkindside: '',
         smallkindarea: '',
@@ -380,6 +392,34 @@ export default {
     },
     clearFiles () {
       console.log('clearFiles')
+    },
+    changechinese (val) {
+      var _this = this
+      axios({
+        method: 'get',
+        url: this.GLOBAL.baseURL + '/chinesename/search/specieslibrary/?chinesename=' + val
+      }).then(function (response) {
+        _this.datachinese = response.data.species_data_list
+        console.log(response)
+        console.log(_this.datachinese)
+      }).catch(function (error) {
+        alert(error)
+      })
+      console.log('val' + val)
+    },
+    changelatin (val) {
+      var _this = this
+      axios({
+        method: 'get',
+        url: this.GLOBAL.baseURL + '/latinname/search/specieslibrary/?latinname=' + val
+      }).then(function (response) {
+        _this.datalatin = response.data.species_data_list
+        console.log('latin' + response)
+        console.log(_this.datalatin)
+      }).catch(function (error) {
+        alert(error)
+      })
+      console.log('val' + val)
     }
   }
 }
@@ -535,4 +575,21 @@ export default {
   .posi {
     margin-left: 86px;
   }
+  .datachinese {
+    background-color: white;
+    opacity: 0.9;
+    height: 25px;
+    line-height: 25px;
+    width: 220px;
+  }
+  .sp7 {
+    position: relative;
+  }
+  .ab {
+    position: absolute;
+    width: auto;
+    height: auto;
+    z-index: 99;
+    top: 60px;
+  }
 </style>

src/views/data/SampleherbalAdd1.vue

@@ -92,17 +92,27 @@
             </el-row>
             <el-row>
               <el-col :span="5">中文名</el-col>
-              <el-col :span="7">
+              <el-col :span="7" class="sp7">
-                <el-input v-model="form.chinesename" clearable></el-input>
+                <el-input @input="changechinese(form.chinesename)" v-model="form.chinesename" clearable></el-input>
+                <div class="ab">
+                  <div class="datachinese" v-for="(v,i) in datachinese" :key="i">
+                    <div>{{v.scientificchinesename}}</div>
+                  </div>
+                </div>
               </el-col>
               <el-col :span="5">拉丁名</el-col>
-              <el-col :span="7">
+              <el-col :span="7" class="sp7">
-                <el-input v-model="form.latinname" clearable></el-input>
+                <el-input @input="changelatin(form.latinname)" v-model="form.latinname" clearable></el-input>
+                <div class="ab">
+                    <div class="datachinese" v-for="(v,i) in datalatin" :key="i">
+                      <div>{{v.familylatinname}}</div>
+                    </div>
+                  </div>
               </el-col>
             </el-row>
             <el-row>
               <el-col :span="5">高度</el-col>
-              <el-col :span="7">
+              <el-col :span="7" class="sp7">
                 <el-input v-model="form.hight" clearable></el-input>
               </el-col>
               <el-col :span="5">分盖度</el-col>
@@ -182,6 +192,8 @@ export default {
       name_list: '',
       wuhou_list: '',
       life_list: '',
+      datachinese: '',
+      datalatin: '',
       form: {
         sampleherbalrichness: '',
         sampleherbaldensity: '',
@@ -377,6 +389,34 @@ export default {
       console.log('ssssss')
       console.log(i)
       console.log(_this.upload)
+    },
+    changechinese (val) {
+      var _this = this
+      axios({
+        method: 'get',
+        url: this.GLOBAL.baseURL + '/chinesename/search/specieslibrary/?chinesename=' + val
+      }).then(function (response) {
+        _this.datachinese = response.data.species_data_list
+        console.log(response)
+        console.log(_this.datachinese)
+      }).catch(function (error) {
+        alert(error)
+      })
+      console.log('val' + val)
+    },
+    changelatin (val) {
+      var _this = this
+      axios({
+        method: 'get',
+        url: this.GLOBAL.baseURL + '/latinname/search/specieslibrary/?latinname=' + val
+      }).then(function (response) {
+        _this.datalatin = response.data.species_data_list
+        console.log('latin' + response)
+        console.log(_this.datalatin)
+      }).catch(function (error) {
+        alert(error)
+      })
+      console.log('val' + val)
     }
   }
 }
@@ -530,4 +570,21 @@ export default {
   .posi {
     margin-left: 86px;
   }
+  .datachinese {
+    background-color: white;
+    opacity: 0.9;
+    height: 25px;
+    line-height: 25px;
+    width: 220px;
+  }
+  .sp7 {
+    position: relative;
+  }
+  .ab {
+    position: absolute;
+    width: auto;
+    height: auto;
+    z-index: 99;
+    top: 60px;
+  }
 </style>

src/views/data/SampletreesAdd.vue

@@ -86,13 +86,19 @@
                 <el-col :span="7" class="sp7">
                   <el-input @input="changechinese(form.chinesename)" v-model="form.chinesename" clearable></el-input>
                   <div class="ab">
-                  </div><div class="datachinese" v-for="(v,i) in datachinese" :key="i">
+                    <div class="datachinese" v-for="(v,i) in datachinese" :key="i">
                       <div>{{v.scientificchinesename}}</div>
                     </div>
+                  </div>
                 </el-col>
                 <el-col :span="5">拉丁名</el-col>
-                <el-col :span="7">
+                <el-col :span="7" class="sp7">
-                  <el-input v-model="form.latinname" clearable></el-input>
+                  <el-input @input="changelatin(form.latinname)" v-model="form.latinname" clearable></el-input>
+                  <div class="ab">
+                    <div class="datachinese" v-for="(v,i) in datalatin" :key="i">
+                      <div>{{v.familylatinname}}</div>
+                    </div>
+                  </div>
                 </el-col>
                 <el-col :span="5" class="hi">高度</el-col>
                 <el-col :span="7">
@@ -184,6 +190,7 @@ export default {
       typeList: '',
       fd: new FormData(),
       datachinese: '',
+      datalatin: '',
       form: {
         sampletreerichness: '',
         sampletreedensity: '',
@@ -491,20 +498,23 @@ export default {
         method: 'get',
         url: this.GLOBAL.baseURL + '/chinesename/search/specieslibrary/?chinesename=' + val
       }).then(function (response) {
-        // _this.name_list = response.data.name_choices
-        // _this.wuhou_list = response.data.wuhou_choices
-        // _this.life_list = response.data.life_choices
-        // _this.type_list = response.data.image_choices
         _this.datachinese = response.data.species_data_list
         console.log(response)
         console.log(_this.datachinese)
-        // if (_this.datachinese.length === 0) {
+      }).catch(function (error) {
-        //   _this.s = false
+        alert(error)
-        //   console.log('datachinese' + _this.datachinese.length)
+      })
-        // } else {
+      console.log('val' + val)
-        //   _this.s = true
+    },
-        //   console.log('datachinese' + _this.datachinese.length)
+    changelatin (val) {
-        // }
+      var _this = this
+      axios({
+        method: 'get',
+        url: this.GLOBAL.baseURL + '/latinname/search/specieslibrary/?latinname=' + val
+      }).then(function (response) {
+        _this.datalatin = response.data.species_data_list
+        console.log('latin' + response)
+        console.log(_this.datalatin)
       }).catch(function (error) {
         alert(error)
       })
@@ -721,17 +731,10 @@ export default {
   }
   .datachinese {
     background-color: white;
-    opacity: 0.7;
+    opacity: 0.9;
-    height: 50px;
+    height: 25px;
-    line-height: 50px;
+    line-height: 25px;
-    width: 205px;
+    width: 220px;
-  }
-  .chin {
-    position: absolute;
-    top: 60px;
-    z-index: 99;
-    height: 300px;
-    overflow: scroll;
   }
   .sp7 {
     position: relative;
@@ -740,5 +743,7 @@ export default {
     position: absolute;
     width: auto;
     height: auto;
+    z-index: 99;
+    top: 60px;
   }
 </style>

src/views/data/SampletreesUpdateFrom.vue

@@ -531,9 +531,9 @@ export default {
     margin-left: 14px;
     padding-top: 20px;
   }
-  .areas {
+  /*.areas {*/
-    margin-top: 30px;
+  /*  margin-top: 30px;*/
-  }
+  /*}*/
   .outside {
     display: inline-block;
     margin-left: 22px;

src/views/displayed/DominantShrub.vue

@@ -129,10 +129,11 @@ export default {
     // tabledata
     axios({
       method: 'get',
-      url: this.GLOBAL.baseURL + '/samplebush/data/list/'
+      url: this.GLOBAL.baseURL + '/display/dominant/shrub/distribution/'
+      // url: 'http://210.77.79.174:8000/display/dominant/shrub/distribution/'
     }).then(function (response) {
       console.log('response:' + response.data)
-      _this.tableData = response.data.samplebush_data_list
+      _this.tableData = response.data.samplebush_list
       console.log(_this.tableData)
     }).catch(function (error) {
       alert(error)

src/views/displayed/PlantImageData.vue

@@ -9,50 +9,65 @@
       </el-breadcrumb>
 <!--      <div class="title"><div class="qura"></div>调查点信息</div>-->
         <el-row>
-          <el-col :span="24">
+          <el-col :span="14">
             <div class="title">调查点</div>
-            <div class="mustyle" @click="qiao">乔木</div>
+<!--            <div class="mustyle" @click="qiao">乔木</div>-->
-            <div class="mustyle" @click="guan">灌木</div>
+<!--            <div class="mustyle" @click="guan">灌木</div>-->
-            <div class="mustyle" @click="cao">草本</div>
+<!--            <div class="mustyle" @click="cao">草本</div>-->
+            <el-button type="primary" @click="qiao">乔木</el-button>
+            <el-button type="primary" @click="guan">灌木</el-button>
+            <el-button type="primary" @click="cao">草本</el-button>
           </el-col>
-          <el-col class="sp14" :span="18" v-show="stat===1">
+          <el-col class="sp14" :span="24" v-show="stat===1">
             <div class="title">乔木分布数据表</div>
-            <div style="width: 80%;margin-top: 20px;margin-left: 10%">
+            <div style="width: 80%;margin-top: 40px;margin-left: 10%;margin-bottom: 100px">
               <template>
-                <el-table :data="tableData" stripe style="width: 100%" height="500">
+                <el-table :data="tableData1" stripe style="width: 100%" height="500">
-                  <el-table-column prop="chinesename" label="图片" width="180"></el-table-column>
+                  <el-table-column prop="file" label="图片" width="240">
-                  <el-table-column prop="latinname" label="图片类型" width="180"></el-table-column>
+                    <template slot-scope="scope">
-                  <el-table-column prop="findings" label="物种名称" width="180"></el-table-column>
+                    <img class="littleimg" :src="GLOBAL.baseURL + scope.row.file" width="100" height="100"/>
-                  <el-table-column prop="samplebushrichness" label="小样方号" width="180"></el-table-column>
+                    </template>
-                  <el-table-column prop="samplebushdensity" label="调查点编号" width="180"></el-table-column>
+                  </el-table-column>
+                  <el-table-column prop="type" label="图片类型" width="240"></el-table-column>
+                  <el-table-column prop="chinesename" label="物种名称" width="240"></el-table-column>
+                  <el-table-column prop="smallkindside" label="小样方号" width="240"></el-table-column>
+                  <el-table-column prop="findings" label="调查点编号" width="240"></el-table-column>
                 </el-table>
               </template>
             </div>
           </el-col>
-          <el-col class="sp14" :span="18" v-show="stat===2">
+          <el-col class="sp14" :span="24" v-show="stat===2">
             <div class="title">灌木分布数据表</div>
             <div style="width: 80%;margin-top: 20px;margin-left: 10%">
               <template>
-                <el-table :data="tableData" stripe style="width: 100%" height="500">
+                <el-table :data="tableData2" stripe style="width: 100%" height="500">
-                  <el-table-column prop="chinesename" label="图片" width="180"></el-table-column>
+                  <el-table-column prop="file" label="图片" width="240">
-                  <el-table-column prop="latinname" label="图片类型" width="180"></el-table-column>
+                    <template slot-scope="scope">
-                  <el-table-column prop="findings" label="物种名称" width="180"></el-table-column>
+                    <img class="littleimg" :src="GLOBAL.baseURL + scope.row.file" width="100" height="100"/>
-                  <el-table-column prop="samplebushrichness" label="小样方号" width="180"></el-table-column>
+                    </template>
-                  <el-table-column prop="samplebushdensity" label="调查点编号" width="180"></el-table-column>
+                  </el-table-column>
+                  <el-table-column prop="type" label="图片类型" width="240"></el-table-column>
+                  <el-table-column prop="chinesename" label="物种名称" width="240"></el-table-column>
+                  <el-table-column prop="smallkindside" label="小样方号" width="240"></el-table-column>
+                  <el-table-column prop="findings" label="调查点编号" width="240"></el-table-column>
                 </el-table>
               </template>
             </div>
           </el-col>
-          <el-col class="sp14" :span="18" v-show="stat===3">
+          <el-col class="sp14" :span="24" v-show="stat===3">
             <div class="title">草本分布数据表</div>
             <div style="width: 80%;margin-top: 20px;margin-left: 10%">
               <template>
-                <el-table :data="tableData" stripe style="width: 100%" height="500">
+                <el-table :data="tableData3" stripe style="width: 100%" height="500">
-                  <el-table-column prop="chinesename" label="图片" width="180"></el-table-column>
+                  <el-table-column prop="file" label="图片" width="240">
-                  <el-table-column prop="latinname" label="图片类型" width="180"></el-table-column>
+                    <template slot-scope="scope">
-                  <el-table-column prop="findings" label="物种名称" width="180"></el-table-column>
+                    <img class="littleimg" :src="GLOBAL.baseURL + scope.row.file" width="100" height="100"/>
-                  <el-table-column prop="samplebushrichness" label="小样方号" width="180"></el-table-column>
+                    </template>
-                  <el-table-column prop="samplebushdensity" label="调查点编号" width="180"></el-table-column>
+                  </el-table-column>
+                  <el-table-column prop="type" label="图片类型" width="240"></el-table-column>
+                  <el-table-column prop="chinesename" label="物种名称" width="240"></el-table-column>
+                  <el-table-column prop="smallkindside" label="小样方号" width="240"></el-table-column>
+                  <el-table-column prop="findings" label="调查点编号" width="240"></el-table-column>
                 </el-table>
               </template>
             </div>
@@ -97,7 +112,9 @@ export default {
       point: '',
       survey_type_distribution: '',
       findings_data_size: '',
-      tableData: '',
+      tableData1: '',
+      tableData2: '',
+      tableData3: '',
       stat: 1
     }
   },
@@ -147,11 +164,13 @@ export default {
     // tabledata
     axios({
       method: 'get',
-      url: this.GLOBAL.baseURL + '/samplebush/data/list/'
+      url: this.GLOBAL.baseURL + '/display/plant/images/'
     }).then(function (response) {
-      console.log('response:' + response.data)
+      console.log('response:')
-      _this.tableData = response.data.samplebush_data_list
+      _this.tableData1 = response.data.sampletreesplantimages_list
-      console.log(_this.tableData)
+      _this.tableData2 = response.data.samplebushplantimages_list
+      _this.tableData3 = response.data.sampleherbalplantimages_list
+      console.log(response.data)
     }).catch(function (error) {
       alert(error)
     })
@@ -375,8 +394,14 @@ li{
     font-size: 20px;
     border-radius: 6px;
     float: left;
+    cursor: pointer;
   }
   .sp14 {
     margin-bottom: 40px;
   }
+  .littleimg {
+    display: inline-block;
+    width: 50px;
+    height: 50px;
+  }
 </style>

src/views/displayed/RareEndangeredPlants.vue

@@ -9,15 +9,78 @@
       </el-breadcrumb>
 <!--      <div class="title"><div class="qura"></div>调查点信息</div>-->
         <el-row>
-          <el-col :span="10">
+          <el-col :span="6" class="sp666">
+            <div class="title">调查点</div>
+<!--            <div class="mustyle" @click="qiao">乔木</div>-->
+<!--            <div class="mustyle" @click="guan">灌木</div>-->
+<!--            <div class="mustyle" @click="cao">草本</div>-->
+            <el-col :span="24"><el-button type="primary" @click="qiao">乔木</el-button></el-col>
+            <el-col :span="24"><el-button type="primary" @click="guan">灌木</el-button></el-col>
+            <el-col :span="24"><el-button type="primary" @click="cao">草本</el-button></el-col>
+          </el-col>
+          <el-col :span="18">
             <div class="title">调查点信息</div>
             <div style="width: 90%;margin-top: 20px;margin-left:60px;height: 600px"><div id="map" style="height: 500px"></div></div>
           </el-col>
-          <el-col :span="14">
+          <el-col :span="24" v-show="stat===1" class="bott">
-            <div class="title">珍稀濒危植物分布数据表</div>
+            <div class="title">乔木分布数据表</div>
             <div style="width: 80%;margin-top: 20px;margin-left: 10%">
               <template>
-                <el-table :data="tableData" stripe style="width: 100%" height="500">
+                <el-table :data="tableData1" stripe style="width: 100%" height="500">
+                  <el-table-column prop="chinesename" label="中文名" width="180"></el-table-column>
+                  <el-table-column prop="latinname" label="拉丁名" width="180"></el-table-column>
+                  <el-table-column prop="findings" label="调查点编号" width="180"></el-table-column>
+                  <el-table-column prop="samplebushrichness" label="灌木丰富度" width="180"></el-table-column>
+                  <el-table-column prop="samplebushdensity" label="灌木密度" width="180"></el-table-column>
+                  <el-table-column prop="smallkindarea" label="样方面积" width="180"></el-table-column>
+                  <el-table-column prop="number" label="株数" width="180"></el-table-column>
+                  <el-table-column prop="hight" label="高度" width="180"></el-table-column>
+                  <el-table-column prop="coverdegree" label="盖度" width="180"></el-table-column>
+                  <el-table-column prop="canopy" label="冠幅" width="180"></el-table-column>
+                  <el-table-column prop="density" label="密度" width="180"></el-table-column>
+                  <el-table-column prop="totalfreshweight" label="总鲜重" width="180"></el-table-column>
+                  <el-table-column prop="freshweightofsample" label="样品鲜重" width="180"></el-table-column>
+                  <el-table-column prop="totaldryweight" label="总干重" width="180"></el-table-column>
+                  <el-table-column prop="dryweightofsample" label="样品干重" width="180"></el-table-column>
+                  <el-table-column prop="abundance" label="多度" width="180"></el-table-column>
+                  <el-table-column prop="biomass" label="生物量" width="180"></el-table-column>
+                  <el-table-column prop="enforcement" label="是否濒危" width="180"></el-table-column>
+                </el-table>
+              </template>
+            </div>
+          </el-col>
+          <el-col :span="24" v-show="stat===2" class="bott">
+            <div class="title">灌木分布数据表</div>
+            <div style="width: 80%;margin-top: 20px;margin-left: 10%">
+              <template>
+                <el-table :data="tableData2" stripe style="width: 100%" height="500">
+                  <el-table-column prop="chinesename" label="中文名" width="180"></el-table-column>
+                  <el-table-column prop="latinname" label="拉丁名" width="180"></el-table-column>
+                  <el-table-column prop="findings" label="调查点编号" width="180"></el-table-column>
+                  <el-table-column prop="samplebushrichness" label="灌木丰富度" width="180"></el-table-column>
+                  <el-table-column prop="samplebushdensity" label="灌木密度" width="180"></el-table-column>
+                  <el-table-column prop="smallkindarea" label="样方面积" width="180"></el-table-column>
+                  <el-table-column prop="number" label="株数" width="180"></el-table-column>
+                  <el-table-column prop="hight" label="高度" width="180"></el-table-column>
+                  <el-table-column prop="coverdegree" label="盖度" width="180"></el-table-column>
+                  <el-table-column prop="canopy" label="冠幅" width="180"></el-table-column>
+                  <el-table-column prop="density" label="密度" width="180"></el-table-column>
+                  <el-table-column prop="totalfreshweight" label="总鲜重" width="180"></el-table-column>
+                  <el-table-column prop="freshweightofsample" label="样品鲜重" width="180"></el-table-column>
+                  <el-table-column prop="totaldryweight" label="总干重" width="180"></el-table-column>
+                  <el-table-column prop="dryweightofsample" label="样品干重" width="180"></el-table-column>
+                  <el-table-column prop="abundance" label="多度" width="180"></el-table-column>
+                  <el-table-column prop="biomass" label="生物量" width="180"></el-table-column>
+                  <el-table-column prop="enforcement" label="是否濒危" width="180"></el-table-column>
+                </el-table>
+              </template>
+            </div>
+          </el-col>
+          <el-col :span="24" v-show="stat===3" class="bott">
+            <div class="title">草本分布数据表</div>
+            <div style="width: 80%;margin-top: 20px;margin-left: 10%">
+              <template>
+                <el-table :data="tableData3" stripe style="width: 100%" height="500">
                   <el-table-column prop="chinesename" label="中文名" width="180"></el-table-column>
                   <el-table-column prop="latinname" label="拉丁名" width="180"></el-table-column>
                   <el-table-column prop="findings" label="调查点编号" width="180"></el-table-column>
@@ -80,7 +143,10 @@ export default {
       point: '',
       survey_type_distribution: '',
       findings_data_size: '',
-      tableData: ''
+      tableData1: '',
+      tableData2: '',
+      tableData3: '',
+      stat: 1
     }
   },
   mounted () {
@@ -129,10 +195,12 @@ export default {
     // tabledata
     axios({
       method: 'get',
-      url: this.GLOBAL.baseURL + '/samplebush/data/list/'
+      url: this.GLOBAL.baseURL + '/display/distribution/of/rare/and/endangered/plants/'
     }).then(function (response) {
       console.log('response:' + response.data)
-      _this.tableData = response.data.samplebush_data_list
+      _this.tableData1 = response.data.sampletrees_list
+      _this.tableData2 = response.data.samplebush_list
+      _this.tableData3 = response.data.sampleherbal_list
       console.log(_this.tableData)
     }).catch(function (error) {
       alert(error)
@@ -168,6 +236,15 @@ export default {
         // })
       })
       this.map.addLayer(vectorLayer)
+    },
+    qiao () {
+      this.stat = 1
+    },
+    guan () {
+      this.stat = 2
+    },
+    cao () {
+      this.stat = 3
     }
   }
 }
@@ -339,4 +416,25 @@ li{
     width: 100px;
     height: 120px;
   }
+  .mustyle {
+    background-color: lightskyblue;
+    width: 200px;
+    height: 50px;
+    margin: 20px 54px;
+    line-height: 50px;
+    font-size: 20px;
+    border-radius: 6px;
+    float: left;
+    cursor: pointer;
+  }
+  /*.sp666 {*/
+  /*  margin-top: 50px;*/
+  /*}*/
+  .bott {
+    margin-bottom: 40px;
+  }
+  .el-button {
+    padding: 12px 55px;
+    margin: 20px 0;
+  }
 </style>

src/views/reveal/SampletreesReveal.vue

@@ -35,17 +35,7 @@
               <el-table-column prop="sampletreerichness" label="乔木丰富度" width="180"></el-table-column>
               <el-table-column prop="sampletreedensity" label="乔木密度" width="180"></el-table-column>
               <el-table-column prop="smallkindarea" label="样方面积" width="180"></el-table-column>
-              <el-table-column prop="hight" label="高度" width="180"></el-table-column>
+              <el-table-column prop="hight" label="高度" width="180"></el-table-column>\
-              <el-table-column prop="dbh" label="胸径" width="180"></el-table-column>
-              <el-table-column prop="canopy" label="冠幅" width="180"></el-table-column>
-              <el-table-column prop="phenophase" label="物候相" width="180"></el-table-column>
-              <el-table-column prop="biotype" label="生活型" width="180"></el-table-column>
-              <el-table-column prop="totalfreshweight" label="总鲜重" width="180"></el-table-column>
-              <el-table-column prop="freshweightofsample" label="样品鲜重" width="180"></el-table-column>
-              <el-table-column prop="totaldryweight" label="总干重" width="180"></el-table-column>
-              <el-table-column prop="dryweightofsample" label="样品干重" width="180"></el-table-column>
-              <el-table-column prop="abundance" label="多度" width="180"></el-table-column>
-              <el-table-column prop="enforcement" label="是否濒危" width="180"></el-table-column>
             </el-table>
           </template>
         </div>