diff --git a/src/axios/cameraMark/markLabelApi.ts b/src/axios/cameraMark/markLabelApi.ts index f6ddcde..8cc8401 100644 --- a/src/axios/cameraMark/markLabelApi.ts +++ b/src/axios/cameraMark/markLabelApi.ts @@ -1,7 +1,9 @@ -import {axios} from '@/utils/axios'; -import {apiUrl} from "@/axios"; +import { axios } from '@/utils/axios'; +import { apiUrl } from "@/axios"; import qs from 'qs'; +const CisApiUrl = apiUrl.CisApiUrl; + enum Api { Add = '/cmMarkLabel/add', AddReturnId = '/cmMarkLabel/addReturnId', @@ -12,18 +14,36 @@ enum Api { GetPageList = '/cmMarkLabel/getPageList', } -const CisApiUrl = apiUrl.CisApiUrl; + +interface modelParams { + CbCameraId: number, //相机 Id + CmMarkGroupId?: number, //标记组 Id + Name: string, //名称 + PanPosition?: number, //Pan 坐标 + TiltPosition?: number, //Tilt 坐标 + ZoomPosition?: number, //Zoom 坐标 + VideoWidth: number, //视频宽度 + VideoHeight: number, //视频高度 + CanvasLeftRatio: number,//画布 left 距离比例 + CanvasTopRatio: number, //画布 top 距离比例 + Remark?: string, //备注 + IsDelete?: boolean, //软删除 + Id?: string, + CreateTime?: string +} + + export const Add = (params?: any) => axios.post(CisApiUrl + Api.Add, qs.stringify(params)) export const AddReturnId = (params?: any) => axios.post(CisApiUrl + Api.AddReturnId, qs.stringify(params)) -export const Update = (params?: any) => axios.post(CisApiUrl + Api.Update, qs.stringify(params)) +export const Update = (params?: modelParams) => axios.post(CisApiUrl + Api.Update, qs.stringify(params)) -export const Delete = (params?: any) => axios.post(CisApiUrl + Api.Delete,qs.stringify(params)) +export const Delete = (params?: any) => axios.post(CisApiUrl + Api.Delete, qs.stringify(params)) -export const Get = (params?: any) => axios.get(CisApiUrl + Api.Get, {params: params}) +export const Get = (params?: any) => axios.get(CisApiUrl + Api.Get, { params: params }) -export const GetList = (params?: any) => axios.get(CisApiUrl + Api.GetList, {params: params}) +export const GetList = (params?: any) => axios.get(CisApiUrl + Api.GetList, { params: params }) -export const GetPageList = (params?: any) => axios.get(CisApiUrl + Api.GetPageList, {params: params}) +export const GetPageList = (params?: any) => axios.get(CisApiUrl + Api.GetPageList, { params: params }) diff --git a/src/views/page/Model/LabelEditModel.vue b/src/views/page/Model/LabelEditModel.vue index e6983ca..86ec996 100644 --- a/src/views/page/Model/LabelEditModel.vue +++ b/src/views/page/Model/LabelEditModel.vue @@ -41,6 +41,7 @@ import { Input, Row, Col, InputNumber, Button, notification } from 'ant-design-v import Draggable from '@/components/Draggable.vue' import { onMounted, reactive, ref, UnwrapRef, watch } from 'vue'; import * as markLabelApi from '@/axios/cameraMark/markLabelApi'; +import Msg from '@/utils/message'; interface FormState { id: string name: string; @@ -90,42 +91,46 @@ onMounted(() => { } }) +//调整 X轴 function changeX(e: any) { // console.log(e); //获取dom - let d = document.getElementById(props.modelData.id); + let dom = document.getElementById(props.modelData.id); // console.log(d); // console.log(d?.style); //修改css - d.style.left = e + 'px'; - //修改 x + dom.style.left = e + 'px'; + //修改 x x.value = e; // console.log(d?.style.left); } + +//调整 Y轴 function changeY(e: any) { // console.log(e); //获取dom - let d = document.getElementById(props.modelData.id); + let dom = document.getElementById(props.modelData.id); // console.log(d); // console.log(d?.style); //修改css - d.style.top = e + 'px'; + dom.style.top = e + 'px'; //修改 y y.value = e; // console.log(d?.style.left); } +//修改 name function changeName(e: any) { // console.log(e); //获取dom - let d = document.getElementById(props.modelData.id); + let dom = document.getElementById(props.modelData.id); // console.log(d); - let dom = d?.querySelector(".label-content") + let domHTML = dom?.querySelector(".label-content") // console.log(dom); //修改html - dom.innerHTML = e.target.value; + domHTML.innerHTML = e.target.value; name.value = e.target.value } @@ -139,24 +144,47 @@ function cancel() { //关闭弹窗 notification.close("editLabel"); //获取dom - let d = document.getElementById(props.modelData.id); + let dom = document.getElementById(props.modelData.id); //获取dom HTML - let dom = d?.querySelector(".label-content") + let domHTML = dom?.querySelector(".label-content") //恢复原来模样 - dom.innerHTML = props.modelData.name + domHTML.innerHTML = props.modelData.name x.value = document.body.offsetWidth * canvasLeft.value y.value = document.body.offsetHeight * canvasTop.value - d.style.left = x.value + 'px'; - d.style.top = y.value + 'px'; - + dom.style.left = x.value + 'px'; + dom.style.top = y.value + 'px'; + } //确认 function confirm() { - markLabelApi.Update().then(res => { - - + markLabelApi.Update({ + CbCameraId: props.modelData.cbCameraId, + Name: name.value, + VideoWidth: props.modelData.videoWidth, + VideoHeight: props.modelData.videoHeight, + CanvasLeftRatio: x.value / document.body.offsetWidth, + CanvasTopRatio: y.value / document.body.offsetHeight, + + CmMarkGroupId: props.modelData.cmMarkGroupId,//标记组 Id + PanPosition: props.modelData.panPosition, //Pan 坐标 + TiltPosition: props.modelData.tiltPosition, //Tilt 坐标 + ZoomPosition: props.modelData.zoomPosition, //Zoom 坐标 + IsDelete: props.modelData.isDelete, //软删除 + Id: props.modelData.id, + CreateTime: props.modelData.createTime + }).then(res => { + console.log("res", res); + + if (res.data.data == true) { + Msg.success("修改成功") + //关闭弹窗 + notification.close("editLabel"); + } + else{ + Msg.error("修改失败",res.data.message) + } }) }