mky-vent-base/src/views/vent/deviceManager/comment/warningTabel/index2.vue

<template>
  <!-- 预警条目管理 -->
  <div class="">
    <BasicTable @register="registerTable" :columns="workFaceWarningColumns">
      <template #tableTitle>
        <a-button preIcon="ant-design:plus-outlined" type="primary" @click="openModal(true, {})">新增</a-button>
      </template>
      <template #action="{ record }">
        <a class="table-action-link" @click="openModalFn(record)">编辑</a>
        <a-popconfirm title="确定删除?" @confirm="handleDelete(record)">
          <a class="table-action-link">删除</a>
        </a-popconfirm>
      </template>
    </BasicTable>
    <BaseModal @register="register" @add="onSubmit" @update="onSubmit" :destroy-on-close="true" :form-schemas="workFaceWarningSchemas" />
  </div>
</template>

<script lang="ts" name="system-user" setup>
import { BasicTable, FormSchema } from '/@/components/Table';
import { useListPage } from '/@/hooks/system/useListPage';
import BaseModal from './BaseModal1.vue';
import { useModal } from '/@/components/Modal';
import { workFaceWarningColumns, workFaceWarningFormSchemas } from './warning.data';
import { warningLogList, warningLogAdd, warningLogAddLeather, warningLogEdit, warningLogDeleteById } from './warning.api';

const props = defineProps({
  deviceId: { type: String },
});

const { tableContext } = useListPage({
  tableProps: {
    api: warningLogList.bind(null, { sysId: props.deviceId }),
    scroll: { y: 390 },
    size: 'small',
    // expandRowByClick: true,
    clickToRowSelect: true,
    useSearchForm: false,
    rowSelection: {
      columnWidth: 20,
    },
    showTableSetting: false,
    formConfig: {
      disabled: true,
      showResetButton: false,
      showSubmitButton: false,
    },
  },
});
const [registerTable, { reload }] = tableContext;

const [register, { openModal, closeModal }] = useModal();

function openModalFn(record?) {
  if (record) {
    openModal(true, {
      isUpdate: true,
      record,
    });
  } else {
    openModal(true, {
      isUpdate: false,
    });
  }
}

async function handleDelete(record) {
  await warningLogDeleteById(record.id);
}

async function onSubmit(flag, values) {
  // 提交数据弹窗
  if (flag == 'update') {
    await warningLogEdit(values);
  } else {
    if (values.alarmType === 'leather_') {
      // 调用第二个接口
      await warningLogAddLeather({ ...values, sysId: props.deviceId });
    } else {
      // 调用默认接口
      await warningLogAdd({ ...values, sysId: props.deviceId });
    }
    // await warningLogAdd({ ...values, sysId: props.deviceId });
  }
  closeModal();
  //刷新列表
  reload();
}

const workFaceWarningSchemas: FormSchema[] = [
  ...workFaceWarningFormSchemas,
  {
    label: '关联条目',
    field: 'relatedEntries',
    component: 'ApiSelect',
    componentProps: {
      labelField: 'alarmName',
      valueField: 'id',
      resultField: 'records',
      api: warningLogList.bind(null, { sysId: props.deviceId }),
    },
  },
  {
    label: '预警后自动控制',
    field: 'isAutoControl',
    component: 'RadioGroup',
    componentProps: {
      //options里面由一个一个的radio组成,支持disabled
      options: [
        { label: '是', value: true },
        { label: '否', value: false },
      ],
    },
  },
  {
    label: '解除后自动复位',
    field: 'isAutoReset',
    component: 'RadioGroup',
    componentProps: {
      //options里面由一个一个的radio组成,支持disabled
      options: [
        { label: '是', value: true },
        { label: '否', value: false },
      ],
    },
  },
];
</script>

<style scoped></style>