SaaS-lib/hx-ai-intelligent/src/view/alarmManagement/alarmSettings/equipmentAlarm/configureDeviceAlarms.vue

<!-- 配置设备告警 -->
<template>
  <ns-view-list-table v-if="show" class="table" v-bind="tableConfig" />
  <!-- 新增or编辑界面 -->
  <editConfigureDeviceAlarm ref="editConfigureDeviceAlarms" />
</template>
<script lang="ts">
  import { ref } from 'vue';
  import data from '../notificationManagementMock.json';
  import editConfigureDeviceAlarm from '../equipmentAlarm/editConfigureDeviceAlarm.vue';

  export default {
    components: { editConfigureDeviceAlarm },

    setup() {
      //设备告警数据
      const configureDeviceAlarmsData = ref({});
      const show = ref(false);
      const tableConfig = ref({});
      const editConfigureDeviceAlarms = ref({});
      const mockData = ref(data.listData);
      const doWnload = (url) => {
        const a = document.createElement('a');
        document.body.appendChild(a);
        a.href = encodeURI(url);
        //设置下载的文件名
        // a.download = fileName.value;
        //触发a标签的点击事件，进行下载
        a.click();
      };
      const setconfigureDeviceAlarmsData = (value: any) => {
        configureDeviceAlarmsData.value = value;
        show.value = true;
        tableConfig.value = {
          title: '告警规则',
          // api: '/carbon_emission/device/getDeviceList',
          value: mockData.value,
          headerActions: [
            {
              label: '新增',
              name: 'RoleTypeAdd',
              type: 'primary',
              handle: () => {
                console.log('新增xxxxxxx');
                editConfigureDeviceAlarms.value.toggle();
              },
            },
            {
              label: '导入',
              name: 'groupImport',
              type: 'primary',
              extra: {
                // api: props.postImportApi, // 导入接口名
                title: '设备信息', // 弹窗title
                templateName: 'whiteListUser', // 所使用的文件名称
                indexName: '设备id', // 匹配类型字段
                message: [
                  { label: '1、若必填项未填写，则不能进行导入操作' },
                  { label: `2、当重复时，则更新数据。` },
                  { label: '3、数据将从模版的第五行进行导入。' },
                  { label: '4、文件导入勿超过5MB。' },
                ],
              },
            },
            {
              label: '导出',
              name: 'groupExports',
              type: 'primary',
              handle: () => {
                doWnload('/hx-ai-intelligent/asset/file/whiteListUser.xlsx');
              },
            },
            {
              label: '批量删除',
              type: 'primary',
              name: 'userBatchDel',
              dynamicDisabled: (data: any) => {
                return data.list.length === 0;
              },
              confirm: true,
              isReload: true,
              isClearCheck: true,
              // api: origanizemanage.batchDel,
              dynamicParams: { userIds: 'userId[]' },
            },
          ],
          columns: [
            {
              title: '序号',
              dataIndex: 'address',
              customRender: (text: any) => {
                return text.index + 1;
              },
            },
            {
              title: '规则id',
              dataIndex: 'id',
            },
            {
              title: '设备信息',
              dataIndex: 'deviceCode',
            },
            {
              title: '告警点位',
              dataIndex: 'deviceName',
            },
            {
              title: '判断条件',
              dataIndex: 'position',
            },
            {
              title: '取值类型',
              dataIndex: 'position',
              textEllipsis: true,
            },
            {
              title: '异常描述',
              dataIndex: 'position',
            },
            {
              title: '启用通知',
              dataIndex: 'isUse',
            },
          ],
          params: {
            page: 0,
            pageSize: 10,
          },
          // rowSelection: null, 选择按钮
          columnActions: {
            title: '操作',
            actions: [
              {
                label: '编辑',
                name: 'FeedBackDetail',
                dynamicParams: ['uuid', 'appealType'],
                handle: (data: any) => {
                  console.log(data, 'xxxxxxx');
                },
              },
              {
                label: '删除',
                name: 'FeedBackDetail',
                dynamicParams: ['uuid', 'appealType'],
                confirm: true,
                handle: () => {
                  // mockData.value.splice(0, 1);
                  console.log(data, 'xxxxxxx');
                },
              },
            ],
          },
          formConfig: {
            title: value.position,
            schemas: [
              {
                field: 'provider',
                label: '设备名称',
                component: 'NsInput',
                componentProps: {
                  placeholder: '请输入设备名称',
                },
              },
              {
                field: 'provider',
                label: '设备点位',
                component: 'NsSelect',
                componentProps: {
                  placeholder: '请选择告警优先级',
                  options: [
                    {
                      label: '电流',
                      value: '1',
                    },
                    {
                      label: '电压',
                      value: '0',
                    },
                  ],
                },
              },
              {
                field: 'payWay',
                label: '启用状态',
                component: 'NsSelect',
                componentProps: {
                  placeholder: '请选择启用状态',
                  options: [
                    {
                      label: '启用',
                      value: '1',
                    },
                    {
                      label: '关闭',
                      value: '0',
                    },
                  ],
                },
              },
              {
                field: 'provider',
                label: '异常描述',
                component: 'NsInput',
                componentProps: {
                  placeholder: '请输入异常描述关键字',
                },
              },
            ],
          },
          // pagination: { pageSizeOptions: false },
          rowKey: 'id',
        };
      };
      return {
        configureDeviceAlarmsData,
        show,
        doWnload,
        tableConfig,
        editConfigureDeviceAlarms,
        setconfigureDeviceAlarmsData,
      };
    },
  };
</script>