Yaxin
/
General-AI-Platform-Web-Client
31
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: 初始化布点接口

Browse Source
master
donghao 7 months ago
parent fe1624361f
commit 7df7fda0ed
6 changed files with 292 additions and 79 deletions
Show Stats Download Patch File Download Diff File

15
src/api/device.ts
Unescape Escape View File

@ -1,3 +1,11 @@
/*
* @Author: donghao donghao@supervision.ltd
* @Date: 2024-08-02 10:40:49
* @LastEditors: donghao donghao@supervision.ltd
* @LastEditTime: 2024-08-14 10:42:42
* @FilePath: \General-AI-Platform-Web-Client\src\api\device.ts
* @Description: 设备
*/
import { http } from "@/utils/http";
import { baseUrlApi } from "./utils";
@ -34,3 +42,10 @@ export const getDevices = (params?: object) => {
params
});
};
/** 布点获取设备 */
export const getLinkDevicesApi = (params?: object) => {
return http.request<ResultList>("get", baseUrlApi("get_devices/"), {
params
});
};

48
src/api/workshops.ts
Unescape Escape View File

@ -0,0 +1,48 @@
/*
* @Author: donghao donghao@supervision.ltd
* @Date: 2024-08-02 10:40:49
* @LastEditors: donghao donghao@supervision.ltd
* @LastEditTime: 2024-08-14 11:10:51
* @FilePath: \General-AI-Platform-Web-Client\src\api\workshops.ts
* @Description: 布点
*/
import { http } from "@/utils/http";
import { baseUrlApi } from "./utils";
type Result = {
success: boolean;
data?: Array<any>;
};
type ResultList = {
success: boolean;
data?: {
/** 列表数据 */
results: Array<any>;
};
};
/** 获取布点 */
export const getWorkshopsApi = (params?: object) => {
return http.request<ResultList>("get", baseUrlApi("workshops/"), {
params
});
};
/** 新增布点 */
export const addWorkshopsApi = (data?: object) => {
return http.request<Result>("post", baseUrlApi("workshops/"), { data });
};
/** 获取布点设备 */
export const getWorkshopDevicesApi = (params?: object) => {
return http.request<ResultList>("get", baseUrlApi("workshop_devices/"), {
params
});
};
/** 新增布点设备 */
export const addWorkshopDevicesApi = (data?: object) => {
return http.request<Result>("post", baseUrlApi("workshop_devices/"), {
data
});
};

11
src/views/deviceSetting/components/deviceSelect.vue
Unescape Escape View File

@ -271,6 +271,17 @@ onMounted(() => {
// setSize();
// handleClose();
// };
watch(
() => props.deviceList,
() => {
console.log(props.deviceList, "watch_deviceList");
},
{
immediate: true,
deep: true
}
);
</script>
<style scoped lang="scss">

4
src/views/deviceSetting/hooks/usePointObject.ts
Unescape Escape View File

@ -1,6 +1,6 @@
export const usePointObject = () => {
function getPointObject(record) {
const { imgUrl } = record;
const { picture } = record;
// TODO: 获取点位对象
return JSON.stringify({
version: "5.3.0",
@ -80,7 +80,7 @@ export const usePointObject = () => {
hasControls: false,
evented: false,
crossOrigin: null,
src: imgUrl,
src: picture,
filters: []
}
]

124
src/views/deviceSetting/index.vue
Unescape Escape View File

@ -2,7 +2,7 @@
* @Author: donghao donghao@supervision.ltd
* @Date: 2024-08-02 10:52:32
* @LastEditors: donghao donghao@supervision.ltd
* @LastEditTime: 2024-08-13 14:37:07
* @LastEditTime: 2024-08-14 11:22:32
* @FilePath: \General-AI-Platform-Web-Client\src\views\deviceSetting\index.vue
* @Description: 设备点位管理设置
@ 交互说明
@ -18,6 +18,8 @@ import DeviceAttr from "./components/deviceAttr.vue";
import DeviceSettingAdd from "./components/add.vue";
import DeviceSelect from "./components/deviceSelect.vue";
import { usePointObject } from "./hooks/usePointObject";
import { getWorkshopsApi } from "@/api/workshops";
import { getLinkDevicesApi } from "@/api/device";
// TODO 完善预览
// 功能组件
import { CanvasEventEmitter } from "@/utils/event/notifier";
@ -119,64 +121,53 @@ const initFabric = () => {
* @设备点位
*/
// 新增点位
function addLocal() {
function addPoint() {
deviceSettingAddRef.value?.openDialog();
}
// 编辑点位
function editLocal() {
function editPoint() {
deviceSettingAddRef.value?.openDialog();
}
// 删除点位
function deleteLocal() {}
function deletePoint() {}
// 查看获取点位
function fetchLocalList() {
pointList.value = [
{
id: "001",
name: "点位1",
imgUrl:
"https://img.cgmodel.com/image/2020/1010/big/1537169-1390622992.jpg",
deviceList: []
},
{
id: "002",
name: "点位2",
imgUrl:
"https://p3.toutiaoimg.com/origin/tos-cn-i-qvj2lq49k0/0143ca57f0614e2e9e6b7695993ec648?from=pc.jpg",
deviceList: []
},
{
id: "003",
name: "点位3",
imgUrl:
"https://pic.rmb.bdstatic.com/bjh/down/117d26bb4bde23110da2995624fc69c3.jpeg",
deviceList: []
}
];
async function fetchPointList() {
const { data } = await getWorkshopsApi();
console.log("fetchPointList_data", data);
// TODO 未使用判空和loading效果
pointList.value = data?.results;
// pointList.value = [
// {
// id: "001",
// name: "点位1",
// picture:
// "https://img.cgmodel.com/image/2020/1010/big/1537169-1390622992.jpg",
// deviceList: []
// },
// {
// id: "002",
// name: "点位2",
// picture:
// "https://p3.toutiaoimg.com/origin/tos-cn-i-qvj2lq49k0/0143ca57f0614e2e9e6b7695993ec648?from=pc.jpg",
// deviceList: []
// },
// {
// id: "003",
// name: "点位3",
// picture:
// "https://pic.rmb.bdstatic.com/bjh/down/117d26bb4bde23110da2995624fc69c3.jpeg",
// deviceList: []
// }
// ];
activePointId.value = pointList.value[0].id;
activePoint.value = pointList.value[0];
deviceList.value = [
{
id: "1001",
name: "设备1",
type: 1
},
{
id: "1002",
name: "设备2",
type: 2
},
{
id: "1003",
name: "设备3",
type: 1
},
{
id: "1004",
name: "设备4",
type: 3
}
];
}
// 获取设备列表
async function fetchDeviceList() {
const { data } = await getLinkDevicesApi();
// TODO 未使用判空和loading效果
deviceList.value = data;
console.log(deviceList.value, "fetchDeviceList_data", data);
}
// 切换点位
function tabPoint(tab) {
@ -188,28 +179,6 @@ function tabPoint(tab) {
});
}
// 获取设备列表
// function fetchDeviceList() {
// // fetchDeviceList()
// deviceList.value = [
// {
// id: "1",
// name: "设备1",
// type: 1
// }
// ];
// }
// function fetchDeviceList(params) {
// deviceList.value = [
// {
// id: "1",
// name: "设备1",
// type: 1
// }
// ]
// }
// 有点位了再初始化
watch(
() => pointList.value,
@ -236,7 +205,8 @@ watch(
// );
onMounted(() => {
fetchLocalList();
fetchPointList();
fetchDeviceList();
});
// 发射全局事件
provide("fabric", fabric);
@ -248,7 +218,7 @@ provide("canvasEditor", canvasEditor);
<header class="flex items-center justify-between" v-if="state.showFabric">
<h3>设备布点</h3>
<div>
<el-button type="primary" @click="addLocal" v-if="pointList.length"
<el-button type="primary" @click="addPoint" v-if="pointList.length"
>新建位置</el-button
>
</div>
@ -266,7 +236,7 @@ provide("canvasEditor", canvasEditor);
本页面为数据可视化大屏中设备点位界面的配置页，通过上传设备所处区域的实拍图或平面图后，根据设备的实际位置，简单的使用拖拽等操作将设备列表中的设备与位置进行匹配，使之能够在数据可视化大屏中更加精细化而直观的了解设备的具体位置与状态。
</p>
<div class="flex justify-center">
<el-button type="primary" @click="addLocal">新建位置</el-button>
<el-button type="primary" @click="addPoint">新建位置</el-button>
</div>
</div>
<div class="w-full point_detail_wrap" v-show="pointList.length">
@ -303,13 +273,13 @@ provide("canvasEditor", canvasEditor);
</div>
</div>
<div class="footer_btns">
<el-button type="primary" @click="editLocal" v-if="pointList.length"
<el-button type="primary" @click="editPoint" v-if="pointList.length"
>编辑位置</el-button
>
<el-button
type="danger"
plain
@click="deleteLocal"
@click="deletePoint"
v-if="pointList.length"
>删除位置</el-button
>

169
通用平台增.md
View File

File diff suppressed because one or more lines are too long
Write Preview
Loading…
Cancel
Save