feat(aiot): ROI配置页面改用cameraCode参数和截图调用
- 路由参数:从query读取cameraCode替代cameraId - 移除app/stream状态变量,统一使用cameraCode - 截图调用:getSnapUrl(cameraCode)替代getSnapUrl(app, stream) - loadCameraOptions:使用cameraCode作为选项value和label - onCameraSelected:直接设置cameraCode,移除app/stream赋值 - 配置推送/导出:使用cameraCode参数 - 页面标题:显示cameraCode Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -46,9 +46,7 @@ const router = useRouter();
|
|||||||
|
|
||||||
// ==================== 摄像头选择 ====================
|
// ==================== 摄像头选择 ====================
|
||||||
|
|
||||||
const cameraId = ref('');
|
const cameraCode = ref('');
|
||||||
const app = ref('');
|
|
||||||
const stream = ref('');
|
|
||||||
|
|
||||||
const showCameraSelector = ref(false);
|
const showCameraSelector = ref(false);
|
||||||
const cameraOptions = ref<
|
const cameraOptions = ref<
|
||||||
@@ -74,10 +72,8 @@ const selectedRoi = computed(() => {
|
|||||||
|
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
const q = route.query;
|
const q = route.query;
|
||||||
if (q.cameraId) {
|
if (q.cameraCode) {
|
||||||
cameraId.value = String(q.cameraId);
|
cameraCode.value = String(q.cameraCode);
|
||||||
app.value = String(q.app || '');
|
|
||||||
stream.value = String(q.stream || '');
|
|
||||||
await buildSnapUrl();
|
await buildSnapUrl();
|
||||||
loadRois();
|
loadRois();
|
||||||
} else {
|
} else {
|
||||||
@@ -94,8 +90,8 @@ async function loadCameraOptions() {
|
|||||||
const res = await getCameraList({ page: 1, count: 200 });
|
const res = await getCameraList({ page: 1, count: 200 });
|
||||||
const list = res.list || [];
|
const list = res.list || [];
|
||||||
cameraOptions.value = list.map((cam: AiotDeviceApi.Camera) => ({
|
cameraOptions.value = list.map((cam: AiotDeviceApi.Camera) => ({
|
||||||
value: `${cam.app}/${cam.stream}`,
|
value: cam.cameraCode || '',
|
||||||
label: `${cam.app}/${cam.stream}${cam.srcUrl ? ` (${cam.srcUrl})` : ''}`,
|
label: `${cam.cameraCode || cam.stream}${cam.srcUrl ? ` (${cam.srcUrl})` : ''}`,
|
||||||
camera: cam,
|
camera: cam,
|
||||||
}));
|
}));
|
||||||
} catch {
|
} catch {
|
||||||
@@ -108,9 +104,7 @@ async function loadCameraOptions() {
|
|||||||
async function onCameraSelected(val: string) {
|
async function onCameraSelected(val: string) {
|
||||||
const opt = cameraOptions.value.find((o) => o.value === val);
|
const opt = cameraOptions.value.find((o) => o.value === val);
|
||||||
if (opt) {
|
if (opt) {
|
||||||
cameraId.value = val;
|
cameraCode.value = val;
|
||||||
app.value = opt.camera.app || '';
|
|
||||||
stream.value = opt.camera.stream || '';
|
|
||||||
showCameraSelector.value = false;
|
showCameraSelector.value = false;
|
||||||
await buildSnapUrl();
|
await buildSnapUrl();
|
||||||
loadRois();
|
loadRois();
|
||||||
@@ -124,8 +118,8 @@ function goBack() {
|
|||||||
// ==================== 截图 ====================
|
// ==================== 截图 ====================
|
||||||
|
|
||||||
async function buildSnapUrl() {
|
async function buildSnapUrl() {
|
||||||
if (app.value && stream.value) {
|
if (cameraCode.value) {
|
||||||
snapUrl.value = await getSnapUrl(app.value, stream.value);
|
snapUrl.value = await getSnapUrl(cameraCode.value);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -137,7 +131,7 @@ async function refreshSnap() {
|
|||||||
|
|
||||||
async function loadRois() {
|
async function loadRois() {
|
||||||
try {
|
try {
|
||||||
const data = await getRoiByCameraId(cameraId.value);
|
const data = await getRoiByCameraId(cameraCode.value);
|
||||||
roiList.value = Array.isArray(data) ? data : [];
|
roiList.value = Array.isArray(data) ? data : [];
|
||||||
if (selectedRoiId.value) {
|
if (selectedRoiId.value) {
|
||||||
loadRoiDetail();
|
loadRoiDetail();
|
||||||
@@ -168,7 +162,7 @@ function startDraw(mode: string) {
|
|||||||
async function onRoiDrawn(data: { coordinates: string; roi_type: string }) {
|
async function onRoiDrawn(data: { coordinates: string; roi_type: string }) {
|
||||||
drawMode.value = null;
|
drawMode.value = null;
|
||||||
const newRoi: Partial<AiotDeviceApi.Roi> = {
|
const newRoi: Partial<AiotDeviceApi.Roi> = {
|
||||||
cameraId: cameraId.value,
|
cameraId: cameraCode.value,
|
||||||
name: `ROI-${roiList.value.length + 1}`,
|
name: `ROI-${roiList.value.length + 1}`,
|
||||||
roiType: data.roi_type,
|
roiType: data.roi_type,
|
||||||
coordinates: data.coordinates,
|
coordinates: data.coordinates,
|
||||||
@@ -251,7 +245,7 @@ function handlePush() {
|
|||||||
content: '确定将此摄像头的所有ROI配置推送到边缘端?',
|
content: '确定将此摄像头的所有ROI配置推送到边缘端?',
|
||||||
async onOk() {
|
async onOk() {
|
||||||
try {
|
try {
|
||||||
await pushConfig(cameraId.value);
|
await pushConfig(cameraCode.value);
|
||||||
message.success('推送成功');
|
message.success('推送成功');
|
||||||
} catch (err: any) {
|
} catch (err: any) {
|
||||||
message.error(err?.message || '推送失败,请检查AI服务是否启用');
|
message.error(err?.message || '推送失败,请检查AI服务是否启用');
|
||||||
@@ -286,7 +280,7 @@ function handlePush() {
|
|||||||
<div class="page-header">
|
<div class="page-header">
|
||||||
<div class="header-left">
|
<div class="header-left">
|
||||||
<Button size="small" @click="goBack">返回</Button>
|
<Button size="small" @click="goBack">返回</Button>
|
||||||
<h3>{{ cameraId }} - ROI配置</h3>
|
<h3>{{ cameraCode }} - ROI配置</h3>
|
||||||
</div>
|
</div>
|
||||||
<div class="header-right">
|
<div class="header-right">
|
||||||
<Button
|
<Button
|
||||||
|
|||||||
Reference in New Issue
Block a user