监控环境一览表监控位置，设备名称组件

src/views/component/getMonitoringName.vue

@@ -1,14 +1,17 @@
 <template>
   <div>
-    <!-- 我是测试数据 -->
-    <el-select v-model="position" placeholder="请选择设备名称">
+    <!-- 监控设备 -->
+    <!-- <el-select v-model="position" placeholder="请选择设备名称" id="name">
     <el-option
       v-for="item in options"
       :label="options.ming_cheng"
       :key="item.key"
       :value="item.ming_cheng">
     </el-option>
-  </el-select>
+  </el-select> -->
+  <select id="name" class="select_name">
+    <option :key= "item.key" :value="item.ming_cheng" v-for="item in options">{{item.ming_cheng}}</option>
+  </select>
   </div>
 </template>
 
@@ -35,6 +38,13 @@ export default {
       let sql = "select she_bei_ming_cheng_ AS ming_cheng FROM t_sbdj GROUP BY ming_cheng" 
       curdPost('sql',sql).then(res => {
         this.options = res.variables.data
+        // const position = document.getElementById('position')
+        // let str = ''
+        // this.options.forEach(item => {
+        //   str += `<option value="${item.wei_zhi}">${item.wei_zhi}</option>`
+        // })
+        // position.innerHTML = str
+
         // console.log('设备名称',this.options)
 
       })
@@ -46,5 +56,14 @@ export default {
 </script>
 
 <style lang="scss" scoped>
+.select_name{
+  outline:none;
+  border: 1px solid rgb(204, 204, 204);
+  width: 700px;
+  border-radius: 6px;
+  height: 35px;
+  font-size: 400;
+}
+
 
 </style>

src/views/component/getMonitoringPosition.vue

@@ -1,14 +1,24 @@
 <template>
   <div>
-    <!-- 我是测试数据 -->
-    <el-select v-model="position" placeholder="请选择监控位置">
+    <!-- 监控位置 -->
+     <!-- <el-select v-model="position" placeholder="请选择监控位置" id="position" @change="onChange">
     <el-option
       v-for="item in options"
       :label="options.wei_zhi"
       :key="item.key"
       :value="item.wei_zhi">
     </el-option>
-  </el-select>
+  </el-select> -->
+
+  <select name="city" id="position" class="select_position" >
+    <option
+     :value="item.wei_zhi" 
+     v-for="item in options" 
+     :key="item.key"
+     >
+      {{item.wei_zhi}}
+    </option>
+  </select>
   </div>
 </template>
 
@@ -41,6 +51,12 @@ export default {
         let data1 = res1.variables.data
         let data2 = res2.variables.data
         this.options = data1.concat(data2)
+        // const position = document.getElementById('position')
+        // let str = ''
+        // this.options.forEach(item => {
+        //   str += `<option value="${item.wei_zhi}">${item.wei_zhi}</option>`
+        // })
+        // position.innerHTML =
         // console.log('监控位置',data1,data2,this.data)
 
       })
@@ -52,5 +68,13 @@ export default {
 </script>
 
 <style lang="scss" scoped>
+.select_position{
+  outline:none;
+  border: 1px solid rgb(204, 204, 204);
+  width: 700px;
+  border-radius: 6px;
+  height: 35px;
+  font-size: 400;
+}
 
 </style>