copy from src/views/data/dev/nvr/index.vue
copy to src/views/data/video/camera/index.vue
文件从 src/views/data/dev/nvr/index.vue 复制 |
| | |
| | | :model="queryParams" |
| | | ref="queryFormRef" |
| | | :inline="true" |
| | | label-width="68px" |
| | | label-width="40px" |
| | | > |
| | | <el-form-item label="品牌" prop="status"> |
| | | <el-select |
| | | v-model="queryParams.brand" |
| | | placeholder="品牌" |
| | | clearable |
| | | class="!w-120px" |
| | | class="!w-140px" |
| | | > |
| | | <el-option |
| | | v-for="dict in getIntDictOptions(DICT_TYPE.CAMERA_BRAND)" |
| | |
| | | /> |
| | | </el-select> |
| | | </el-form-item> |
| | | <el-form-item label="编号" prop="code"> |
| | | <el-form-item label="设备类型" prop="device" label-width="68px"> |
| | | <el-input |
| | | v-model="queryParams.code" |
| | | placeholder="请输入编号" |
| | | v-model="queryParams.device" |
| | | placeholder="请输入设备类型" |
| | | clearable |
| | | @keyup.enter="handleQuery" |
| | | class="!w-120px" |
| | | class="!w-140px" |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item label="IP" prop="name"> |
| | | <el-form-item label="编码" prop="code"> |
| | | <el-input |
| | | v-model="queryParams.code" |
| | | placeholder="请输入编码" |
| | | clearable |
| | | @keyup.enter="handleQuery" |
| | | class="!w-140px" |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item label="IP" prop="ip"> |
| | | <el-input |
| | | v-model="queryParams.ip" |
| | | placeholder="请输入IP" |
| | | clearable |
| | | @keyup.enter="handleQuery" |
| | | class="!w-120px" |
| | | class="!w-140px" |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item label="名称" prop="name"> |
| | | <el-form-item label="位置" prop="location"> |
| | | <el-input |
| | | v-model="queryParams.name" |
| | | placeholder="请输入名称" |
| | | v-model="queryParams.location" |
| | | placeholder="请输入位置" |
| | | clearable |
| | | @keyup.enter="handleQuery" |
| | | class="!w-120px" |
| | | class="!w-140px" |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item> |
| | |
| | | type="primary" |
| | | plain |
| | | @click="openForm('create')" |
| | | v-hasPermi="['dev:nvr:save']" |
| | | v-hasPermi="['video:camera:save']" |
| | | > |
| | | <Icon icon="ep:plus" class="mr-5px" /> |
| | | 新增 |
| | |
| | | plain |
| | | @click="handleExport" |
| | | :loading="exportLoading" |
| | | v-hasPermi="['dev:nvr:export']" |
| | | v-hasPermi="['video:camera:export']" |
| | | > |
| | | <Icon icon="ep:download" class="mr-5px" /> |
| | | 导出 |
| | |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="设备类型" align="center" prop="device" width="200"/> |
| | | <el-table-column label="位置" align="center" prop="position" /> |
| | | <el-table-column label="编码" align="center" prop="code" width="100"/> |
| | | <el-table-column label="名称" align="center" prop="name"/> |
| | | <el-table-column label="编码" align="center" prop="code" width="200"/> |
| | | <el-table-column label="IP" align="center" prop="ip" /> |
| | | <el-table-column label="端口" align="center" prop="port" width="100"/> |
| | | <el-table-column label="用户名" align="center" prop="username" width="100"/> |
| | |
| | | <dict-tag :type="DICT_TYPE.NVR_ONLINE_STATUS" :value="scope.row.status" /> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="位置" align="center" prop="position" /> |
| | | <el-table-column label="位置" align="center" prop="location" /> |
| | | <el-table-column label="备注" align="center" prop="remark" width="150"/> |
| | | <el-table-column label="操作" align="center" min-width="110" fixed="right"> |
| | | <template #default="scope"> |
| | |
| | | link |
| | | type="primary" |
| | | @click="openForm('update', scope.row.id)" |
| | | v-hasPermi="['dev:nvr:update']" |
| | | v-hasPermi="['video:camera:update']" |
| | | > |
| | | 编辑 |
| | | </el-button> |
| | |
| | | link |
| | | type="danger" |
| | | @click="handleDelete(scope.row.id)" |
| | | v-hasPermi="['dev:nvr:delete']" |
| | | v-hasPermi="['video:camera:delete']" |
| | | > |
| | | 删除 |
| | | </el-button> |
| | | <el-button v-if="scope.row.brand == 1" type="text" size="small" @click="cameraHandle(scope.row.id)">摄像头</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | |
| | | </ContentWrap> |
| | | |
| | | <!-- 表单弹窗:添加/修改 --> |
| | | <NvrForm ref="formRef" @success="getList" /> |
| | | <CameraForm ref="formRef" @success="getList" /> |
| | | |
| | | <!-- 弹窗, 摄像头 --> |
| | | <Camera ref="devCameraRef"/> |
| | | |
| | | </template> |
| | | <script lang="ts" setup> |
| | | import {DICT_TYPE, getIntDictOptions} from '@/utils/dict' |
| | | import download from '@/utils/download' |
| | | import * as NvrApi from '@/api/data/dev/nvr' |
| | | import NvrForm from './NvrForm.vue' |
| | | import Camera from '../camera/camera.vue' |
| | | import * as CameraApi from '@/api/data/video/camera' |
| | | import CameraForm from './CameraForm.vue' |
| | | |
| | | defineOptions({name: 'Nvr'}) |
| | | defineOptions({name: 'Camera'}) |
| | | |
| | | const message = useMessage() // 消息弹窗 |
| | | const {t} = useI18n() // 国际化 |
| | |
| | | const queryParams = reactive({ |
| | | pageNo: 1, |
| | | pageSize: 10, |
| | | type: 1, |
| | | brand: undefined, |
| | | ip: undefined, |
| | | code: undefined, |
| | | name: undefined, |
| | | device: undefined, |
| | | location: undefined, |
| | | status: undefined |
| | | }) |
| | | const queryFormRef = ref() // 搜索的表单 |
| | | const exportLoading = ref(false) // 导出的加载中 |
| | | |
| | | const devCameraRef = ref() |
| | | |
| | | /** 查询列表 */ |
| | | const getList = async () => { |
| | | loading.value = true |
| | | try { |
| | | const data = await NvrApi.getNvrPage(queryParams) |
| | | const data = await CameraApi.getCameraPage(queryParams) |
| | | list.value = data.list |
| | | total.value = data.total |
| | | } finally { |
| | | loading.value = false |
| | | } |
| | | } |
| | | |
| | | const cameraHandle = (id: string) => { |
| | | // devCameraVisible.value = true |
| | | devCameraRef.value.open(id) |
| | | } |
| | | |
| | | /** 搜索按钮操作 */ |
| | |
| | | // 删除的二次确认 |
| | | await message.delConfirm() |
| | | // 发起删除 |
| | | await NvrApi.deleteNvr(id) |
| | | await CameraApi.deleteCamera(id) |
| | | message.success(t('common.delSuccess')) |
| | | // 刷新列表 |
| | | await getList() |
| | |
| | | await message.exportConfirm() |
| | | // 发起导出 |
| | | exportLoading.value = true |
| | | const data = await NvrApi.exportNvr(queryParams) |
| | | const data = await CameraApi.exportCamera(queryParams) |
| | | download.excel(data, '录像机列表.xls') |
| | | } catch { |
| | | } finally { |