zhudie 2 лет назад
Родитель
Сommit
046f4c4810

+ 71 - 0
src/api/push/push.ts

@@ -0,0 +1,71 @@
+import { http } from '@/utils/http/axios';
+
+export interface RobotType {
+  id?: number;
+  robotName?: string;
+  robotUrl?: string;
+  workshopCodes?: string;
+  workshopName?: string;
+  isPush?: boolean;
+  tenantId?: number;
+  isDelete?: boolean;
+  createTime?: string;
+  remark?: string | null;
+}
+
+export interface QueryType {
+  pageNumber: number;
+  pageSize: number;
+}
+
+interface ReturnType {
+  records: RobotType[];
+  pageNumber: number;
+  pageSize: number;
+  totalPage: number;
+  totalRow: number;
+}
+
+/**
+ * @description: 查询
+ */
+export function getRobot(params: QueryType) {
+  return http.request<ReturnType>({
+    url: 'robotPush/getList',
+    method: 'get',
+    params,
+  });
+}
+
+/**
+ * @description: 添加
+ */
+export function addRobot(data: RobotType) {
+  return http.request({
+    url: '/robotPush/save',
+    method: 'post',
+    data,
+  });
+}
+
+/**
+ * @description: 编辑
+ */
+export function editRobot(data: RobotType) {
+  return http.request({
+    url: '/robotPush/update',
+    method: 'put',
+    data,
+  });
+}
+
+/**
+ * @description: 删除
+ *
+ */
+export function delRobot(id: number) {
+  return http.request({
+    url: `/robotPush/delete?id=${id}`,
+    method: 'delete',
+  });
+}

+ 234 - 0
src/views/alarm-push/PushAlarm.vue

@@ -0,0 +1,234 @@
+<template>
+  <div class="push-page">
+    <el-card :bordered="false" class="proCard" style="position: relative">
+      <BasicTable
+        :columns="getColumns(flattendWorkspaces)"
+        :data-source="robotPushList"
+        :row-key="(row) => row.id"
+        :action-column="actionColumn"
+        :loading="loading"
+        :pagination="{ total: total, pageSize: size, hideOnSinglePage: !robotPushList.length }"
+        :tableSetting="{
+          size: false,
+          redo: false,
+          fullscreen: false,
+          striped: false,
+          setting: false,
+        }"
+        :striped="true"
+        ref="tableRef"
+        @order-change="orderByItem"
+        @page-num-change="handlePageNumChange"
+        @page-size-change="handlePageSizeChange"
+      >
+        <template #tableTitle>
+          <el-button type="primary" :icon="Plus" @click="addDrawer">添加</el-button>
+        </template>
+      </BasicTable>
+    </el-card>
+    <AddRobot
+      v-if="showDrawer"
+      :robot-list="robotList"
+      @on-close="closeDrawer"
+      @sub-add="addSubRobot"
+      @sub-edit="editSubRobot"
+    />
+  </div>
+  <!-- <AddCamera class="add-popover" v-model="showAddPopover" />
+    <EditCamera class="add-popover" v-model="showEditPopover" :edit-data="editCameraData" />
+    <ShareCamera class="add-popover" v-model="addSharedPopover" :share-data="shareCameraData" />
+    <EditSharedCamera
+      class="add-popover"
+      v-model="showSharedPopover"
+      @update-unadd="updateUnaddAmount"
+    /> -->
+  <!-- </div> -->
+</template>
+
+<script setup lang="ts">
+  import { h, onBeforeMount, onBeforeUnmount, onMounted, reactive, ref } from 'vue';
+  import { BasicTable, TableActionIcons } from '@/components/Table';
+  import { BasicColumn } from '@/components/Table';
+  import { getColumns } from './constant';
+  // import { columns } from './overviewColumns';
+  import { Plus } from '@element-plus/icons-vue';
+  import editIcon from '@/assets/images/table/table-edit.png';
+  import deleteIcon from '@/assets/images/table/table-delete.png';
+  import { deleteCameraItem } from '@/api/camera/camera-overview';
+  import AddRobot from './component/AddRobot.vue';
+  import { ElMessage, ElMessageBox } from 'element-plus';
+  import { RobotType } from '@/api/push/push';
+  import usePush from './usePush';
+  import useSceneInfos from '@/hooks/useSceneInfos';
+
+  const usePushRobot = usePush();
+  const {
+    robotPushList,
+    total,
+    page,
+    size,
+    loading,
+    robotSearch,
+    getRobotList,
+    robotAdd,
+    robotDel,
+    robotEdit,
+  } = usePushRobot;
+
+  const sceneInfos = useSceneInfos();
+  const { flattendWorkspaces, getScenesTree } = sceneInfos;
+
+  onMounted(() => {
+    getRobotList();
+  });
+
+  // 添加弹窗相关
+  const showDrawer = ref(false);
+  const robotList = ref<RobotType | null>({});
+
+  //关闭drawer
+  const closeDrawer = () => {
+    showDrawer.value = false;
+  };
+
+  const addDrawer = () => {
+    robotList.value = null;
+    showDrawer.value = true;
+  };
+
+  const addSubRobot = (data) => {
+    robotAdd(data).then(() => {
+      ElMessage.success('添加成功');
+    });
+    showDrawer.value = false;
+  };
+
+  const editSubRobot = (data) => {
+    robotEdit(data).then(() => {
+      ElMessage.success('编辑成功');
+    });
+    showDrawer.value = false;
+  };
+
+  //操作列
+  const actionColumn: BasicColumn = reactive({
+    width: 200,
+    title: '操作',
+    prop: 'action',
+    key: 'action',
+    fixed: 'right',
+    render(record) {
+      return h(TableActionIcons as any, {
+        space: 20,
+        color: '#629bf9',
+        style: 'img',
+        size: 16,
+        actionIcons: [
+          {
+            label: '编辑',
+            icon: editIcon,
+            onClick: handleEdit.bind(null, record.row),
+          },
+          {
+            label: '删除',
+            icon: deleteIcon,
+            onClick: handleDelete.bind(null, record.row),
+          },
+        ],
+      });
+    },
+  });
+
+  // 列排序操作
+  const orderByItem = () => {};
+
+  const handlePageNumChange = (pageNum) => {
+    page.value = pageNum;
+    getRobotList();
+  };
+
+  const handlePageSizeChange = (pageSize) => {
+    size.value = pageSize;
+    getRobotList();
+  };
+
+  const handleDelete = (row) => {
+    ElMessageBox.confirm(`您想删除机器人${row.robotName}`, '提示', {
+      confirmButtonText: '确定',
+      cancelButtonText: '取消',
+      type: 'warning',
+      draggable: true,
+    })
+      .then(() => {
+        robotDel(row.id).then(() => {
+          ElMessage.success('删除成功');
+        });
+      })
+      .catch(() => {});
+  };
+
+  //编辑
+  const handleEdit = (row) => {
+    robotList.value = row;
+    console.log('row', row);
+
+    showDrawer.value = true;
+    // showEditPopover.value = true;
+    // editCameraData.value = row;
+  };
+
+  onBeforeMount(() => {
+    getScenesTree({ level: 3, valueKey: 'code', labelKey: 'name', disabled: true });
+  });
+
+  onBeforeUnmount(() => {});
+</script>
+
+<style scoped>
+  .push-page {
+    position: relative;
+    height: calc(100vh - 64px - 12px);
+    background-color: #ffffff;
+  }
+
+  .camera-list {
+    padding: 0 21px;
+  }
+
+  .empty-content {
+    margin: auto;
+    padding: 125px 0;
+  }
+
+  .empty-img {
+    width: 396px;
+  }
+
+  .empty-text {
+    font-size: 22px;
+    color: #8e8e8e;
+    line-height: 30px;
+    text-align: center;
+  }
+
+  .add-tip {
+    position: absolute;
+    left: 187px;
+    top: 64px;
+    font-size: 16px;
+    color: red;
+  }
+  .add-popover {
+    position: absolute;
+    width: calc(100% - 21px);
+    height: 622px;
+    top: 0;
+    bottom: 0;
+    margin: auto;
+    z-index: 99;
+  }
+
+  .item {
+    margin: 0px 40px 0px 15px;
+  }
+</style>

+ 155 - 0
src/views/alarm-push/component/AddRobot.vue

@@ -0,0 +1,155 @@
+<template>
+  <div>
+    <el-drawer
+      ref="companyDrawerRef"
+      class="test"
+      :model-value="true"
+      @close="() => emits('onClose')"
+      with-header="true"
+      size="30%"
+    >
+      <template #header="{ titleId }">
+        <p :id="titleId">{{ title }}</p>
+      </template>
+      <el-form
+        ref="ruleFormRef"
+        :model="ruleForm"
+        :rules="rules"
+        label-width="120px"
+        class="demo-ruleForm"
+        size="default"
+        status-icon
+      >
+        <el-form-item label="机器人名称" prop="robotName">
+          <el-input v-model="ruleForm.robotName" style="width: 200px" />
+        </el-form-item>
+        <el-form-item label="机器人地址" prop="robotUrl">
+          <el-input v-model="ruleForm.robotUrl" style="width: 200px" />
+        </el-form-item>
+        <el-form-item label="场景" prop="workshopName">
+          <el-tree-select
+            v-model="ruleForm.workshopName"
+            :data="scenesTree"
+            :render-after-expand="false"
+            :default-expand-all="true"
+            check-strictly
+            multiple
+            placeholder="请选择场景"
+            style="width: 200px"
+            @change="handleTreeSelect"
+          />
+        </el-form-item>
+        <el-form-item label="状态">
+          <el-switch
+            v-model="ruleForm.isPush"
+            :active-value="true"
+            :inactive-value="false"
+            class="switchUse"
+          />
+        </el-form-item>
+      </el-form>
+      <div style="position: absolute; left: 108px; bottom: 67px">
+        <el-button @click="resetDrawer">重置</el-button>
+        <el-button type="primary" @click="subDrawer"> 提交 </el-button>
+        <!-- <el-button type="primary" v-if="props.comEdit" @click="editedSub(ruleFormRef)">
+          提交
+        </el-button> -->
+      </div>
+    </el-drawer></div
+  >
+</template>
+
+<script setup lang="ts">
+  import { computed, reactive, ref, defineProps, defineEmits, onBeforeMount } from 'vue';
+  import type { FormInstance, FormRules } from 'element-plus';
+  import { RobotType } from '@/api/push/push';
+  import useSceneInfos from '@/hooks/useSceneInfos';
+  import { cloneDeep } from 'lodash-es';
+  // import usePush from '../usePush';
+
+  // const usePushRobot = usePush();
+  // const { robotPushList, total, page, size, robotSearch, robotAdd, robotDel, robotEdit } =
+  //   usePushRobot;
+
+  const sceneInfos = useSceneInfos();
+  const { scenesTree, flattendWorkspaces, getScenesTree } = sceneInfos;
+
+  const props = defineProps<{
+    robotList: RobotType | null;
+  }>();
+
+  const title = computed(() => {
+    if (props.robotList) {
+      return '编辑机器人';
+    }
+    return '添加机器人';
+  });
+
+  const emits = defineEmits(['onClose', 'subAdd', 'subEdit']);
+
+  //表格中的规则
+  const ruleFormRef = ref<FormInstance>();
+
+  const ruleForm = ref<RobotType>({
+    robotName: '',
+    robotUrl: '',
+    workshopCodes: '',
+    workshopName: '',
+    isPush: true,
+  });
+
+  const rules = reactive<FormRules>({
+    robotName: [{ required: true, message: '请输入机器人名称', trigger: 'blur' }],
+    robotUrl: [{ required: true, message: '请输入机器人地址', trigger: 'blur' }],
+    workshopName: [{ required: true, message: '请选择场景', trigger: 'blur' }],
+  });
+
+  //重置编辑框
+  const resetDrawer = () => {
+    ruleForm.value.robotName = '';
+    ruleForm.value.robotUrl = '';
+    ruleForm.value.workshopCodes = '';
+    ruleForm.value.workshopName = '';
+    ruleForm.value.isPush = true;
+  };
+  //提交
+  const subDrawer = () => {
+    if (props.robotList) {
+      const data = {
+        id: props.robotList.id,
+        robotName: ruleForm.value.robotName,
+        robotUrl: ruleForm.value.robotUrl,
+        workshopCodes: ruleForm.value.workshopCodes,
+        isPush: ruleForm.value.isPush,
+      };
+      emits('subEdit', data);
+      //   robotEdit(data);
+    } else {
+      const data = {
+        robotName: ruleForm.value.robotName,
+        robotUrl: ruleForm.value.robotUrl,
+        workshopCodes: ruleForm.value.workshopCodes,
+        isPush: ruleForm.value.isPush,
+      };
+      emits('subAdd', data);
+    }
+  };
+
+  const handleTreeSelect = (code: string) => {
+    ruleForm.value.workshopCodes = flattendWorkspaces.value.find((item) => item.code === code).id;
+  };
+
+  onBeforeMount(() => {
+    getScenesTree({ level: 2, valueKey: 'code', labelKey: 'name', disabled: true });
+    if (props.robotList) {
+      ruleForm.value = cloneDeep(props.robotList);
+
+      // ruleForm.value.workshopName = flattendWorkspaces.value.find(
+      //   (item) => item.id === ruleForm.value.workshopCodes,
+      // ).name;
+      // console.log('ruleForm.value', ruleForm.value);
+    }
+  });
+</script>
+
+<style scoped></style>

+ 52 - 0
src/views/alarm-push/constant.ts

@@ -0,0 +1,52 @@
+import { BasicColumn } from '@/components/Table';
+import { h } from 'vue';
+
+export const getColumns = (flattendWorkspaces): BasicColumn[] => {
+  return [
+    {
+      label: '序号',
+      minWidth: 60,
+      type: 'index',
+      fixed: 'left',
+    },
+    {
+      label: '机器人名称',
+      prop: 'robotName',
+      minWidth: 100,
+    },
+    {
+      label: '机器人地址',
+      prop: 'robotUrl',
+      minWidth: 140,
+    },
+    {
+      label: '场景',
+      prop: 'workshopCodes',
+      minWidth: 120,
+      render(record) {
+        return h(
+          'span',
+          {},
+          {
+            default: () => {
+              return flattendWorkspaces?.find(
+                (item) => item.id === Number(record.row.workshopCodes),
+              )?.name;
+            },
+          },
+        );
+      },
+    },
+  ];
+};
+
+export const robotDataList = [
+  { robotName: 123, robotUrl: 'https//sss', workshopCodes: 'a大厅' },
+  { robotName: 123, robotUrl: 'https//sss1', workshopCodes: 'b大厅' },
+  { robotName: 123, robotUrl: 'https//sss12', workshopCodes: 'c大厅' },
+];
+
+export enum ENABLED {
+  FALSE = '0',
+  TRUE = '1',
+}

+ 62 - 0
src/views/alarm-push/usePush.ts

@@ -0,0 +1,62 @@
+import { ref } from 'vue';
+import { RobotType, getRobot, addRobot, editRobot, delRobot } from '@/api/push/push';
+import { useRequest } from 'vue-hooks-plus';
+
+export const usePush = () => {
+  const robotPushList = ref<RobotType[]>([]);
+  const total = ref(0);
+  const page = ref(1);
+  const size = ref(10);
+
+  // 查询
+  const robotSearch = () => {
+    const params = {
+      pageNumber: page.value,
+      pageSize: size.value,
+    };
+    return getRobot(params).then((res) => {
+      return res;
+    });
+  };
+
+  const { loading, run: getRobotList } = useRequest(robotSearch, {
+    manual: true,
+    onSuccess: (res) => {
+      robotPushList.value = [...res.records];
+      total.value = res.totalRow;
+    },
+  });
+
+  const robotAdd = (data: RobotType) => {
+    return addRobot(data).then(() => {
+      getRobotList();
+    });
+  };
+
+  const robotDel = (id: number) => {
+    return delRobot(id).then(() => {
+      getRobotList();
+    });
+  };
+
+  const robotEdit = (data: RobotType) => {
+    return editRobot(data).then(() => {
+      getRobotList();
+    });
+  };
+
+  return {
+    robotPushList,
+    total,
+    page,
+    size,
+    loading,
+    robotSearch,
+    getRobotList,
+    robotAdd,
+    robotDel,
+    robotEdit,
+  };
+};
+
+export default usePush;