1

components.d.ts

@@ -17,11 +17,11 @@ declare module 'vue' {
     ElMain: typeof import('element-plus/es')['ElMain']
     ElMenu: typeof import('element-plus/es')['ElMenu']
     ElMenuItem: typeof import('element-plus/es')['ElMenuItem']
-    ElMenuItemGroup: typeof import('element-plus/es')['ElMenuItemGroup']
     ElScrollbar: typeof import('element-plus/es')['ElScrollbar']
     ElSubMenu: typeof import('element-plus/es')['ElSubMenu']
     ElTable: typeof import('element-plus/es')['ElTable']
     ElTableColumn: typeof import('element-plus/es')['ElTableColumn']
+    ElUpload: typeof import('element-plus/es')['ElUpload']
     IconCommunity: typeof import('./src/components/icons/IconCommunity.vue')['default']
     IconDocumentation: typeof import('./src/components/icons/IconDocumentation.vue')['default']
     IconEcosystem: typeof import('./src/components/icons/IconEcosystem.vue')['default']

src/views/zhdpgl/yqzl/yqaf.vue

@@ -1,11 +1,114 @@
-<script setup lang="ts">
-
-</script>
-
 <template>
- 园区安防
+  <div class="yqaf_box">
+    <h1>摄像头列表</h1>
+    <el-table :data="cameraList" style="width: 100%">
+      <el-table-column prop="id" label="ID" width="180"></el-table-column>
+      <el-table-column prop="name" label="名称"></el-table-column>
+      <el-table-column prop="state" label="状态"></el-table-column>
+      <el-table-column prop="displaystate" label="显示状态"></el-table-column>
+      <el-table-column prop="cjName" label="厂家"></el-table-column>
+      <el-table-column prop="location" label="位置"></el-table-column>
+      <el-table-column label="操作">
+        <template #default="scope">
+          <el-button size="mini" @click="handleView(scope.$index, scope.row)">查看</el-button>
+          <el-button size="mini" type="primary" @click="handleStart(scope.$index, scope.row)">启动</el-button>
+          <el-button size="mini" type="danger" @click="handleStop(scope.$index, scope.row)">停止</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+  </div>
 </template>
 
-<style scoped>
+<script setup>
+import { ref, onMounted } from 'vue'
+// import axios from 'axios'
+
+const cameraList = [{
+      id:1,
+      name:"指挥中心一楼门口球机",
+      state:'开启',
+      cjName:"萨斯噶三个",
+      displaystate:'实时监控',
+      location:"242"
+    },{
+      id:1,
+      name:"指挥中心一楼门口球机",
+      state:'开启',
+      cjName:"萨斯噶三个",
+      displaystate:'实时监控',
+      location:"242"
+    },{
+      id:1,
+      name:"指挥中心一楼门口球机",
+      state:'开启',
+      cjName:"萨斯噶三个",
+      displaystate:'实时监控',
+      location:"242"
+    },{
+      id:1,
+      name:"指挥中心一楼门口球机",
+      state:'开启',
+      cjName:"萨斯噶三个",
+      displaystate:'实时监控',
+      location:"242"
+    },{
+      id:1,
+      name:"指挥中心一楼门口球机",
+      state:'开启',
+      cjName:"萨斯噶三个",
+      displaystate:'实时监控',
+      location:"242"
+    },{
+      id:1,
+      name:"指挥中心一楼门口球机",
+      state:'开启',
+      cjName:"萨斯噶三个",
+      displaystate:'实时监控',
+      location:"242"
+    },{
+      id:1,
+      name:"指挥中心一楼门口球机",
+      state:'开启',
+      cjName:"萨斯噶三个",
+      displaystate:'实时监控',
+      location:"242"
+    }]
+
+// const cameraList = ref([])
+
+// 模拟获取摄像头列表的数据
+onMounted(async () => {
+  // try {
+    // const response = await axios.get('https://api.example.com/cameras') // 替换为实际API地址
+    // cameraList.value = response.data
+    // cameraList.value = [{
+    //   id:1,
+    //   name:"123",
+    //   location:"242"
+    // }]
+  // } catch (error) {
+    // console.error('Error fetching camera list:', error)
+  // }
+})
+
+function handleView(index, row) {
+  console.log(`查看摄像头 ${row.name}`)
+  // 实现查看摄像头详情逻辑
+}
+
+function handleStart(index, row) {
+  console.log(`启动摄像头 ${row.name}`)
+  // 实现启动摄像头逻辑
+}
+
+function handleStop(index, row) {
+  console.log(`停止摄像头 ${row.name}`)
+  // 实现停止摄像头逻辑
+}
+</script>
 
+<style>
+.yqaf_box{
+  margin: 20px;
+}
 </style>

src/views/zhdpgl/yqzl/yqjs.vue

@@ -1,5 +1,5 @@
 <template>
-  <div>
+  <div class="yqjs_box">
     <h1>编辑园区信息</h1>
     <el-form :model="parkForm" label-width="100px">
       <el-form-item label="园区名称">
@@ -8,6 +8,49 @@
       <el-form-item label="描述">
         <el-input type="textarea" v-model="parkForm.description"></el-input>
       </el-form-item>
+      <el-form-item label="园区总面积">
+        <el-input v-model="parkForm.contact"></el-input>
+      </el-form-item>
+      <el-form-item label="入职企业">
+        <el-input v-model="parkForm.phone"></el-input>
+      </el-form-item>
+      <el-form-item label="楼栋数量">
+        <el-input v-model="parkForm.email"></el-input>
+      </el-form-item>
+      <el-form-item label="园区人员">
+        <el-input v-model="parkForm.email"></el-input>
+      </el-form-item>
+      <el-form-item label="标准厂房">
+        <el-input v-model="parkForm.email"></el-input>
+      </el-form-item>
+      <el-form-item label="总车位">
+        <el-input v-model="parkForm.email"></el-input>
+      </el-form-item>
+      <el-form-item label="生产用地">
+        <el-input v-model="parkForm.email"></el-input>
+      </el-form-item>
+      <el-form-item label="办公用地">
+        <el-input v-model="parkForm.email"></el-input>
+      </el-form-item>
+      <el-form-item label="绿色植被">
+        <el-input v-model="parkForm.email"></el-input>
+      </el-form-item>
+      <el-form-item label="基础设施">
+        <el-input v-model="parkForm.email"></el-input>
+      </el-form-item>
+      <el-form-item label="待开发区">
+        <el-input v-model="parkForm.email"></el-input>
+      </el-form-item>
+      <div>
+      <h1>上传园区视频</h1>
+      <el-upload class="upload-demo" drag action="https://jsonplaceholder.typicode.com/posts/" multiple>
+        <i class="el-icon-upload"></i>
+        <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
+        <template #tip>
+          <div class="el-upload__tip">只能上传 mp4 文件，且不超过 50MB</div>
+        </template>
+      </el-upload>
+    </div>
       <el-form-item>
         <el-button type="primary" @click="onSubmit">保存</el-button>
       </el-form-item>
@@ -20,6 +63,9 @@ import { ref } from 'vue'
 
 const parkForm = ref({
   name: '',
+  contact: '',
+  phone: '',
+  email: '',
   description: ''
 })
 
@@ -28,3 +74,10 @@ function onSubmit() {
   // 在这里处理表单提交逻辑，例如发送到服务器
 }
 </script>
+
+
+<style>
+.yqjs_box {
+  margin: 20px;
+}
+</style>