fix

src/api/camera/camera-share.ts

@@ -21,6 +21,12 @@ export interface CameraShareType {
   code?: string; //设备id
   workspaceName?: string; //车间场景;
   name?: string; //工位场景
+  cameraName?: string; //可编辑的相机名称
+  cameraCode?: string; //可编辑的相机设备id
+  cameraWorkspace?: string; //可编辑的场景  id
+  cameraWorkspaceName?: string; //可编辑的场景  name
+  username?: string; //用户名
+  password?: string; //密码
 }
 
 export interface CameraShareQueryType {
@@ -29,7 +35,8 @@ export interface CameraShareQueryType {
   cameraId?: number;
   isAdd?: boolean | number;
   toTenantId?: number;
-  toTenantName?: string; //自己加的
+  tenantName?: string; //企业名称
+  tenantCode?: string; //企业账号
 }
 
 export interface ReturnType {
@@ -59,9 +66,9 @@ export const editShareCameraList = (data: CameraShareType) => {
 };
 
 /** 删除分享的相机*/
-export const delShareCameraList = (toTenantId: number) => {
+export const delShareCameraList = (id: number) => {
   return http.request<CameraShareType[]>({
-    url: `/cameraTenant/updatetoTenantId=${toTenantId}`,
+    url: `cameraTenant/delete?cameraToTenantId=${id}`,
     method: 'delete',
   });
 };

src/views/cameras/overview/components/CameraEditshared.vue

@@ -18,25 +18,26 @@
 
 <script setup lang="ts">
   import { ref } from 'vue';
-  import { CameraSharedItem, cameraAddType } from '../constant';
+  import { cameraAddType } from '../constant';
   import { Close } from '@element-plus/icons-vue';
   import EditSharedCamera from './EditSharedCamera.vue';
+  import { CameraShareType } from '@/api/camera/camera-share';
 
-  const props = defineProps<{ modelValue: boolean; editData: CameraSharedItem }>();
+  const props = defineProps<{ modelValue: boolean; editData: CameraShareType }>();
 
-  const emits = defineEmits(['update:modelValue', 'updateData']);
+  const emits = defineEmits(['update:modelValue']);
 
   const addType = ref(cameraAddType[0].value);
 
-  const updateValue = (value) => {
+  const updateValue = () => {
     addType.value = cameraAddType[0].value;
-    emits('update:modelValue', value);
+    emits('update:modelValue', false as boolean);
   };
 
-  const onAddCamera = (data) => {
-    updateValue(false);
-    emits('updateData', data);
-  };
+  // const onAddCamera = (data) => {
+  //   updateValue(false);
+  //   emits('updateData', data);
+  // };
 </script>
 
 <style scoped lang="scss">

src/views/cameras/overview/components/EditSharedCamera.vue

@@ -4,7 +4,7 @@
       <el-form
         class="ip-form"
         :inline="true"
-        :model="cameraIPData"
+        :model="cameraEditData"
         :rules="rules"
         label-width="84px"
         label-position="left"
@@ -17,7 +17,7 @@
         >
           <el-input
             v-if="item.type === 'input'"
-            v-model="cameraIPData[item.prop]"
+            v-model="cameraEditData[item.prop]"
             :placeholder="item.placeholder"
             style="width: 200px"
             :type="item.prop === 'password' ? 'password' : ''"
@@ -26,7 +26,7 @@
           />
           <el-tree-select
             v-if="item.type === 'tree-select'"
-            v-model="cameraIPData[item.prop]"
+            v-model="cameraEditData[item.prop]"
             :data="scenesTree"
             :render-after-expand="false"
             :default-expand-all="true"
@@ -47,18 +47,23 @@
 
 <script setup lang="ts">
   import { computed, onBeforeMount, ref } from 'vue';
-  import { CameraSharedItem, cameraSharedForm } from '../constant';
-  import { cloneDeep } from 'lodash-es';
+  import { cameraSharedForm } from '../constant';
+
   import useSceneInfos from '@/hooks/useSceneInfos';
+  import useCameraShare from '../stores/useCameraShare';
+  import { CameraShareType } from '@/api/camera/camera-share';
+
+  const useShare = useCameraShare();
+  const { handleEdit } = useShare;
 
   const sceneInfos = useSceneInfos();
   const { scenesTree, flattendWorkspaces, getScenesTree } = sceneInfos;
 
-  const props = defineProps<{ formData?: CameraSharedItem | null }>();
+  const props = defineProps<{ formData?: CameraShareType | null }>();
 
   const emits = defineEmits(['cancel-execute', 'confirm-execute']);
 
-  const cameraIPData = ref<CameraSharedItem>({} as CameraSharedItem);
+  const cameraEditData = ref<CameraShareType>({} as CameraShareType);
 
   const rules = computed(() => {
     const newRule = {};
@@ -71,7 +76,9 @@
   });
 
   const handleTreeSelect = (code: string) => {
-    cameraIPData.value.workspaceId = flattendWorkspaces.value.find((item) => item.code === code).id;
+    cameraEditData.value.cameraWorkspace = flattendWorkspaces.value.find(
+      (item) => item.code === code,
+    ).id;
   };
 
   const handleCancel = () => {
@@ -79,14 +86,20 @@
   };
 
   const handleConfirm = () => {
-    const copyData = cloneDeep(cameraIPData.value);
-    emits('confirm-execute', copyData);
+    const updateData = {
+      id: cameraEditData.value.id,
+      cameraName: cameraEditData.value.cameraName,
+      cameraWorkspace: cameraEditData.value.cameraWorkspace,
+      cameraCode: cameraEditData.value.cameraCode,
+    };
+    handleEdit(updateData);
+    emits('confirm-execute');
   };
 
   onBeforeMount(() => {
     getScenesTree({ level: 3, valueKey: 'code', labelKey: 'name', disabled: true });
     if (props.formData) {
-      cameraIPData.value = props.formData;
+      cameraEditData.value = props.formData;
     }
   });
 </script>

src/views/cameras/overview/components/SharedTable.vue

@@ -29,7 +29,7 @@
     <div class="camera-list">
       <!-- :data-source="props.addCameraType === 'complete' ? cameraCompleted : cameraIncompleted" -->
       <BasicTable
-        :columns="columns"
+        :columns="getColumns(flattendWorkspaces)"
         :data-source="cameraShareList"
         :row-key="(row) => row.cameraIp"
         :action-column="actionColumn"
@@ -48,23 +48,20 @@
       class="add-popover"
       v-model="shareEditedPopover"
       :edit-data="handleEditData"
-      @update-data="updateData"
     />
   </div>
 </template>
 
 <script setup lang="ts">
-  import { h, reactive, ref, onMounted } from 'vue';
-  import { columns } from '../sharedColumns';
+  import { h, reactive, ref, onMounted, watch, onBeforeMount } from 'vue';
+  import { getColumns } from '../sharedColumns';
   import editIcon from '@/assets/images/table/table-edit.png';
   import deleteIcon from '@/assets/images/table/table-delete.png';
-  import { CameraSharedItem } from '../constant';
   import { BasicColumn, TableActionIconsWords, BasicTable } from '@/components/Table';
   import CameraEditshared from '../components/CameraEditshared.vue';
-  import useCameraShared from '../stores/useSharedCamera';
-  import { storeToRefs } from 'pinia';
   import useCameraShare from '../stores/useCameraShare';
-  // import { onMounted } from 'vue';
+  import useSceneInfos from '@/hooks/useSceneInfos';
+  import { CameraShareType } from '@/api/camera/camera-share';
 
   const useShare = useCameraShare();
   const {
@@ -72,45 +69,49 @@
     queryName,
     queryAccount,
     isAddState,
-    queryCameraId,
+    queryToTenantId,
     conditionSearch,
     handleDel,
-    handleAdd,
     handleEdit,
   } = useShare;
 
-  // const CameraShared = useCameraShared();
-  // const { queryName, queryAccount, cameraCompleted, cameraIncompleted } = storeToRefs(CameraShared);
-  // const { handleAdd, handleDelete, resetSearch } = CameraShared;
+  const sceneInfos = useSceneInfos();
+  const { flattendWorkspaces, getScenesTree } = sceneInfos;
 
   const props = defineProps<{ addCameraType: string }>();
   onMounted(() => {
     isAddState.value = props.addCameraType === 'incomplete' ? false : true;
+    console.log('isAddState', isAddState.value);
+    queryToTenantId.value = -10;
     conditionSearch();
+    console.log(cameraShareList.value);
   });
 
   const shareEditedPopover = ref<boolean>(false);
 
-  const handleEditData = ref<CameraSharedItem>({} as CameraSharedItem);
+  const handleEditData = ref<CameraShareType>({} as CameraShareType);
 
   const handleEditDetail = (row) => {
     shareEditedPopover.value = true;
+    row.cameraWorkspaceName = flattendWorkspaces.value?.find(
+      (item) => item.id === Number(row.cameraWorkspace),
+    )?.code;
     handleEditData.value = row;
   };
 
-  const updateData = (data) => {
-    // if (props.addCameraType === 'complete') {
-    //   const indexToEdit = cameraIncompleted.value.findIndex(
-    //     (item) => item.cameraIp === data.cameraIp,
-    //   );
-    //   cameraIncompleted.value[indexToEdit] = data;
-    // } else {
-    //   const indexToEdit = cameraCompleted.value.findIndex(
-    //     (item) => item.cameraIp === data.cameraIp,
-    //   );
-    //   cameraCompleted.value[indexToEdit] = data;
-    // }
-  };
+  // const updateData = (_data) => {
+  //   // if (props.addCameraType === 'complete') {
+  //   //   const indexToEdit = cameraIncompleted.value.findIndex(
+  //   //     (item) => item.cameraIp === data.cameraIp,
+  //   //   );
+  //   //   cameraIncompleted.value[indexToEdit] = data;
+  //   // } else {
+  //   //   const indexToEdit = cameraCompleted.value.findIndex(
+  //   //     (item) => item.cameraIp === data.cameraIp,
+  //   //   );
+  //   //   cameraCompleted.value[indexToEdit] = data;
+  //   // }
+  // };
 
   //添加按钮
   const handleChangeAdd = (row) => {
@@ -122,6 +123,7 @@
   };
 
   const handleDelete = (row) => {
+    console.log('row', row);
     handleDel(row.id);
   };
 
@@ -142,7 +144,6 @@
           {
             label: '添加',
             type: 'words' + props.addCameraType,
-            // onClick: handleAdd.bind(null, record.row, props.addCameraType),
             onClick: handleChangeAdd.bind(null, record.row),
           },
           {
@@ -155,7 +156,7 @@
             label: '删除',
             type: 'img',
             icon: deleteIcon,
-            onClick: handleDelete.bind(null, record.row, props.addCameraType),
+            onClick: handleDelete.bind(null, record.row),
           },
         ],
       });
@@ -170,8 +171,22 @@
   //重置
   const resetSearch = () => {
     queryName.value = '';
-    queryAccount.value = undefined;
+    queryAccount.value = '';
   };
+
+  watch(
+    () => props.addCameraType,
+    (_val) => {
+      resetSearch();
+      isAddState.value = props.addCameraType === 'incomplete' ? false : true;
+      console.log('isAddState', isAddState.value);
+      conditionSearch();
+    },
+  );
+
+  onBeforeMount(() => {
+    getScenesTree({ level: 3, valueKey: 'code', labelKey: 'name', disabled: true });
+  });
 </script>
 
 <style scoped>

src/views/cameras/overview/constant.ts

@@ -416,7 +416,7 @@ export const sharedCaremaType = [
 export const cameraSharedForm: CameraAddFormItem[] = [
   {
     label: '名称：',
-    prop: 'name',
+    prop: 'cameraName',
     placeholder: '请输入名称',
     type: 'input',
     required: true,
@@ -461,7 +461,7 @@ export const cameraSharedForm: CameraAddFormItem[] = [
   },
   {
     label: '场景：',
-    prop: 'workspaceCode',
+    prop: 'cameraWorkspaceName',
     placeholder: '请输入场景名称',
     type: 'tree-select',
     required: true,
@@ -488,7 +488,7 @@ export const cameraSharedForm: CameraAddFormItem[] = [
   },
   {
     label: '企业账号：',
-    prop: 'companyAccount',
+    prop: 'tenantCode',
     placeholder: '请输入企业账号',
     type: 'input',
     disabled: true,
@@ -496,7 +496,7 @@ export const cameraSharedForm: CameraAddFormItem[] = [
   },
   {
     label: '设备ID号：',
-    prop: 'code',
+    prop: 'cameraCode',
     placeholder: '自定义ID，不能重复',
     type: 'input',
     required: true,
@@ -505,7 +505,7 @@ export const cameraSharedForm: CameraAddFormItem[] = [
   },
   {
     label: '企业名称：',
-    prop: 'companyName',
+    prop: 'tenantName',
     placeholder: '请输入企业名称',
     type: 'input',
     disabled: true,

src/views/cameras/overview/sharedColumns.ts

@@ -1,62 +1,166 @@
 import { h } from 'vue';
 import type { BasicColumn } from '@/components/Table';
 import { protocalTypeSelect } from './constant';
+import useSceneInfos from '@/hooks/useSceneInfos';
 
-export const columns: BasicColumn[] = [
-  {
-    label: '序号',
-    minWidth: 60,
-    type: 'index',
-    fixed: 'left',
-  },
-  {
-    label: 'IP地址',
-    prop: 'cameraIp',
-    minWidth: 140,
-  },
-  {
-    label: '协议类型',
-    prop: 'cameraType',
-    minWidth: 120,
-    render(record) {
-      return h(
-        'span',
-        {},
-        {
-          default: () =>
-            protocalTypeSelect.find((item) => item.value === record.row.cameraType)?.label,
-        },
-      );
-    },
-  },
-  {
-    label: '端口地址',
-    prop: 'cameraPort',
-    minWidth: 120,
-  },
-  {
-    label: '企业账号',
-    prop: 'companyAccount',
-    minWidth: 140,
-  },
-  {
-    label: '企业名称',
-    prop: 'companyName',
-    minWidth: 140,
-  },
-  {
-    label: '设备ID',
-    prop: 'code',
-    minWidth: 150,
-  },
-  {
-    label: '车间场景',
-    prop: 'workshopName',
-    minWidth: 140,
-  },
-  {
-    label: '工位场景',
-    prop: 'workspaceName',
-    minWidth: 140,
-  },
-];
+// export const columns: BasicColumn[] = [
+//   {
+//     label: '序号',
+//     minWidth: 60,
+//     type: 'index',
+//     fixed: 'left',
+//   },
+//   {
+//     label: 'IP地址',
+//     prop: 'cameraIp',
+//     minWidth: 140,
+//   },
+//   {
+//     label: '协议类型',
+//     prop: 'cameraType',
+//     minWidth: 120,
+//     render(record) {
+//       return h(
+//         'span',
+//         {},
+//         {
+//           default: () => {
+//             return protocalTypeSelect.find((item) => item.value === record.row.cameraType)?.label;
+//           },
+//         },
+//       );
+//     },
+//   },
+//   {
+//     label: '端口地址',
+//     prop: 'cameraPort',
+//     minWidth: 120,
+//   },
+//   {
+//     label: '企业账号',
+//     prop: 'tenantCode',
+//     minWidth: 140,
+//   },
+//   {
+//     label: '企业名称',
+//     prop: 'tenantName',
+//     minWidth: 140,
+//   },
+//   {
+//     label: '设备ID',
+//     prop: 'cameraCode',
+//     minWidth: 150,
+//   },
+//   {
+//     label: '车间场景',
+//     prop: 'workspaceName',
+//     minWidth: 140,
+//   },
+//   {
+//     label: '工位场景',
+//     prop: 'cameraWorkspace',
+//     minWidth: 140,
+//     render(record) {
+//       const sceneInfos = useSceneInfos();
+//       const { flattendWorkspaces } = sceneInfos;
+//       return h(
+//         'span',
+//         {},
+//         {
+//           default: () => {
+//             const code = flattendWorkspaces.value.find(
+//               (item) => item.code === record.row.cameraWorkspace,
+//             );
+//             console.log('flattendWorkspaces', flattendWorkspaces.value);
+
+//             console.log('record.row.cameraWorkspace', code);
+//             return record.row.cameraWorkspace;
+//             return flattendWorkspaces.value.find((item) => item.code === record.row.cameraWorkspace)
+//               ?.id;
+
+//             // return protocalTypeSelect.find((item) => item.value === record.row.cameraType)?.label;
+//           },
+//         },
+//       );
+//     },
+//   },
+// ];
+
+export const getColumns = (flattendWorkspaces): BasicColumn[] => {
+  return [
+    {
+      label: '序号',
+      minWidth: 60,
+      type: 'index',
+      fixed: 'left',
+    },
+    {
+      label: 'IP地址',
+      prop: 'cameraIp',
+      minWidth: 140,
+    },
+    {
+      label: '协议类型',
+      prop: 'cameraType',
+      minWidth: 120,
+      render(record) {
+        return h(
+          'span',
+          {},
+          {
+            default: () => {
+              return protocalTypeSelect.find((item) => item.value === record.row.cameraType)?.label;
+            },
+          },
+        );
+      },
+    },
+    {
+      label: '端口地址',
+      prop: 'cameraPort',
+      minWidth: 120,
+    },
+    {
+      label: '企业账号',
+      prop: 'tenantCode',
+      minWidth: 140,
+    },
+    {
+      label: '企业名称',
+      prop: 'tenantName',
+      minWidth: 140,
+    },
+    {
+      label: '设备ID',
+      prop: 'cameraCode',
+      minWidth: 150,
+    },
+    {
+      label: '车间场景',
+      prop: 'workspaceName',
+      minWidth: 140,
+    },
+    {
+      label: '工位场景',
+      prop: 'cameraWorkspace',
+      minWidth: 140,
+      render(record) {
+        // const sceneInfos = useSceneInfos();
+        // const { flattendWorkspaces } = sceneInfos;
+        return h(
+          'span',
+          {},
+          {
+            default: () => {
+              return flattendWorkspaces?.find(
+                (item) => item.id === Number(record.row.cameraWorkspace),
+              )?.code;
+
+              // return protocalTypeSelect.find((item) => item.value === record.row.cameraType)?.label;
+            },
+          },
+        );
+      },
+    },
+  ];
+};

src/views/cameras/overview/stores/useCameraShare.ts

@@ -15,7 +15,7 @@ import {
 export const useCameraShared = () => {
   const cameraShareList = ref<CameraShareType[]>([]);
   const queryName = ref<string>();
-  const queryAccount = ref<number>();
+  const queryAccount = ref<string>('');
   const isAddState = ref<boolean | number>(-1);
   const queryCameraId = ref<number | undefined>(-1);
   const queryToTenantId = ref<number>(-1);
@@ -39,16 +39,14 @@ export const useCameraShared = () => {
       const params: CameraShareQueryType = {
         pageNumber: page.value,
         pageSize: size.value,
+        isAdd: isAddState.value,
       };
       if (queryName.value) {
-        params.toTenantName = queryName.value;
+        params.tenantName = queryName.value;
       }
 
       if (queryAccount.value) {
-        params.toTenantId = queryAccount.value;
-      }
-      if (isAddState.value) {
-        params.isAdd = isAddState.value;
+        params.tenantCode = queryAccount.value;
       }
       if (queryCameraId.value) {
         params.cameraId = queryCameraId.value;
@@ -58,6 +56,8 @@ export const useCameraShared = () => {
       }
       getShareCameraList(params).then((res) => {
         cameraShareList.value = res.records;
+        console.log('res', cameraShareList.value);
+
         // total.value = res.totalRow;
       });
     });
@@ -87,6 +87,7 @@ export const useCameraShared = () => {
     queryAccount,
     isAddState,
     queryCameraId,
+    queryToTenantId,
     conditionSearch,
     handleDel,
     handleAdd,