前端优化

web/src/view/devicesAdmin/screens/screens.vue

@@ -472,6 +472,7 @@ import { ElMessage, ElMessageBox } from 'element-plus'
 import { createProgram, updateProgram } from '@/api/program'
 import { createSoundPeriod, updateSoundPeriod } from '@/api/soundPeriod'
 import { createVoice, updateVoice } from '@/api/voice'
+import { useRoute } from 'vue-router'
 
 const page = ref(1)
 const total = ref(0)
@@ -483,6 +484,7 @@ const screensForm = ref(null)
 const dialogFlag = ref('add')
 const isFlag = ref('')
 const addScreensDialog = ref(false)
+const route = useRoute()
 
 const rules = ref({
   screensName: [
@@ -511,6 +513,10 @@ const tableRowClassName = ({ row, rowIndex }) => {
   }
   return ''
 }
+
+if (route.query.projectID !== undefined && route.query.projectID !== '') {
+  searchInfo.value.projectId = parseInt(route.query.projectID)
+}
 const getTableData = async() => {
   const table = await getScreensList({ page: page.value, pageSize: pageSize.value, ...searchInfo.value })
   if (table.code === 0) {

web/src/view/monitor/monitor.vue

@@ -295,6 +295,7 @@ export default {
       text-decoration: none;
       font-weight: 500;
     ">
+
       下载视频插件
     </a>
     <button style="

web/src/view/project/index.vue

@@ -30,7 +30,7 @@
               link
               type="primary"
               size="large"
-              @click="view"
+              @click="view(scope.row)"
             >
               {{ scope.row.project.projectName }}
             </el-link>
@@ -150,7 +150,68 @@
           >关联设备：</h4>
 
         </template>
-        This is drawer content.
+        <el-tabs
+          v-model="activeName"
+          type="card"
+          class="demo-tabs"
+        >
+          <el-tab-pane
+            :label="'LED屏【'+LedCount+'】'"
+            name="LED"
+          >
+            <el-table
+              :data="relationDevs.screensList"
+              style="width: 100%"
+            >
+              <el-table-column
+                prop="screensName"
+                label="名称"
+                width="180"
+              >
+                <template #default="scope">
+                  <el-button
+                    type="success"
+                    @click="jumpScreens()"
+                  >{{ scope.row.screensName }}</el-button>
+                </template>
+              </el-table-column>
+              <el-table-column
+                prop="sn"
+                label="SN"
+                width="180"
+              />
+              <el-table-column
+                prop="ipAddress"
+                label="ip地址"
+              />
+            </el-table>
+          </el-tab-pane>
+
+          <el-tab-pane
+            :label="'摄像头【'+CameraCount+'】'"
+            name="Camera"
+          >
+            <el-table
+              :data="null"
+              style="width: 100%"
+            >
+              <el-table-column
+                prop="screensName"
+                label="名称"
+                width="180"
+              />
+              <el-table-column
+                prop="sn"
+                label="SN"
+                width="180"
+              />
+              <el-table-column
+                prop="ipAddress"
+                label="ip地址"
+              />
+            </el-table>
+          </el-tab-pane>
+        </el-tabs>
       </el-drawer>
     </div>
   </div>
@@ -159,6 +220,7 @@
 import { delProject, getProjectList, updateProject, addProject } from '@/api/project'
 import { ref, onMounted } from 'vue'
 import { ElMessage, ElMessageBox } from 'element-plus'
+import { useRouter } from 'vue-router'
 const page = ref(1)
 const total = ref(0)
 const pageSize = ref(10)
@@ -169,6 +231,7 @@ const dialogFlag = ref('add')
 const isFlag = ref('')
 const addProjectDialog = ref(false)
 const viewProjectDialog = ref(false)
+const router = useRouter()
 
 const rules = ref({
   projectName: [
@@ -207,10 +270,28 @@ onMounted(() => {
   getTableData()
 })
 
-const view = (row) => {
+// 后续如果项目关联其他设备，到这里添加
+const activeName = 'LED'
+const nowProjectId = ref(0)
+const relationDevs = ref([])
+const LedCount = ref(0)
+const CameraCount = ref(0)
+const view = (obj) => {
+  nowProjectId.value = obj.project.ID
   viewProjectDialog.value = true
-  // projectInfo.value = JSON.parse(JSON.stringify(row))
-  // projectInfo.value.installTime = new Date(projectInfo.value.installTime).toLocaleDateString()
+  relationDevs.value = obj.relationDev
+  LedCount.value = relationDevs.value.screensList.length
+  // CameraCount.value = relationDevs.value.cameraList.length
+}
+
+const jumpScreens = () => {
+  const { href } = router.resolve({
+    path: '/layout/devicesAdmin/screens', // 路径
+    query: {
+      projectID: nowProjectId.value,
+    }// 传参
+  })
+  location.href = (href)
 }
 
 const handleSizeChange = (val) => {