|
@@ -0,0 +1,119 @@
|
|
|
+<template>
|
|
|
+ <div class="content-container Camera">
|
|
|
+ <el-row class="tool-bar">
|
|
|
+ <el-col :span="12" class="left">
|
|
|
+ <div class="content-title">
|
|
|
+ 摄像头配置
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12" class="right">
|
|
|
+ <el-input v-model="conditions.goafDevName" class="search-input m-right-15" placeholder="请输入设备名称">
|
|
|
+ <el-button slot="append" icon="el-icon-search" @click="getData()" />
|
|
|
+ </el-input>
|
|
|
+ <el-button type="primary" @click="handleAdd">新增</el-button>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+
|
|
|
+ <el-row class="m-top-15">
|
|
|
+ <el-table v-loading="listLoading" class="page-table" border fit :data="dataList">
|
|
|
+ <el-table-column type="index" label="序号" header-align="center" align="center" width="60" />
|
|
|
+ <el-table-column prop="goafDevName" label="设备名称" />
|
|
|
+ <el-table-column prop="goafDevIp" label="设备IP" />
|
|
|
+ <el-table-column prop="goafDevLocation" label="安装地点" />
|
|
|
+ <el-table-column prop="goafDevTypename" label="设备类型" />
|
|
|
+ <el-table-column prop="goafDevGroupname" label="设备负责人部门" />
|
|
|
+ <el-table-column prop="goafDevAccountName" label="设备责任人" />
|
|
|
+ <el-table-column prop="goafInstallTime" label="安装时间" />
|
|
|
+ <el-table-column label="操作" header-align="center" align="center" width="170">
|
|
|
+ <template v-slot="{row}">
|
|
|
+ <el-button size="mini" type="primary" icon="el-icon-edit" @click="handleUpdate(row)">修改</el-button>
|
|
|
+ <el-button size="mini" type="danger" icon="el-icon-edit" @click="handleDelete(row)">删除</el-button>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <div class="pagination-container" style="float:right;margin-right:40px;">
|
|
|
+ <pagination v-show="total>0" :total="total" :page.sync="conditions.page" :limit.sync="conditions.limit" @pagination="getData" />
|
|
|
+ </div>
|
|
|
+ </el-row>
|
|
|
+ <hand-Model ref="Camera" @formSuccess="getData" />
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+import { getCamera, delCamera } from '@/api/camera'
|
|
|
+import { Pagination } from '@/components'
|
|
|
+import { NumConvertLM } from '@/utils'
|
|
|
+import handModel from './Model.vue'
|
|
|
+export default {
|
|
|
+ components: { Pagination, handModel },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ dataList: [],
|
|
|
+ total: 0,
|
|
|
+ listLoading: false,
|
|
|
+ conditions: {
|
|
|
+ page: 1,
|
|
|
+ limit: 10
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ this.getData()
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ // fetch data
|
|
|
+ NumConvertLM,
|
|
|
+ getData() {
|
|
|
+ this.listLoading = true
|
|
|
+ getCamera(this.conditions).then((resp) => {
|
|
|
+ this.listLoading = false
|
|
|
+ const { code, msg, data } = resp
|
|
|
+ if (code === 0) {
|
|
|
+ const start = (this.conditions.page - 1) * this.conditions.limit
|
|
|
+ const end = this.conditions.page * this.conditions.limit
|
|
|
+ const dataList = data.filter((item) => item.goafDevTypename.includes('摄像头'))
|
|
|
+ this.dataList = dataList.filter((item, index) => index >= start && index < end)
|
|
|
+ this.total = dataList.length
|
|
|
+ } else {
|
|
|
+ this.$message.error(msg)
|
|
|
+ }
|
|
|
+ }).catch((error) => {
|
|
|
+ console.log(error)
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // "Add Risk" Model
|
|
|
+ handleAdd() {
|
|
|
+ this.$refs['Camera'].showAddModel('摄像头')
|
|
|
+ },
|
|
|
+
|
|
|
+ // "Edit Risk" Model
|
|
|
+ handleUpdate(data) {
|
|
|
+ this.$refs['Camera'].showEditModel(JSON.parse(JSON.stringify(data)))
|
|
|
+ },
|
|
|
+
|
|
|
+ // Delete Action
|
|
|
+ handleDelete(data) {
|
|
|
+ const { typeId, riskSource } = data
|
|
|
+ this.$confirm(`此操作将删除该数据${riskSource}, 是否继续?`, '提示', {
|
|
|
+ confirmButtonText: '确定',
|
|
|
+ cancelButtonText: '取消',
|
|
|
+ type: 'warning'
|
|
|
+ }).then(() => {
|
|
|
+ delCamera(typeId).then((resp) => {
|
|
|
+ const { code, msg } = resp
|
|
|
+ if (code === 0) {
|
|
|
+ this.getData()
|
|
|
+ this.$message.success(msg)
|
|
|
+ } else {
|
|
|
+ this.$message.error(msg)
|
|
|
+ }
|
|
|
+ }).catch((error) => {
|
|
|
+ console.log(error)
|
|
|
+ })
|
|
|
+ }).catch(() => {
|
|
|
+ this.$message.info('已取消删除')
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|