Merge branch 'master' of http://182.92.126.35:3000/hrx/mky-vent-base

src/views/vent/deviceManager/comment/DeviceModal.vue

@@ -70,9 +70,10 @@
         />
       </a-tab-pane>
       <a-tab-pane key="9" :tab="'预案管理'">
-        <template v-if="activeKey == '9'">
-          <AccidentPlanTable :deviceId="deviceData.id" />
-        </template>
+        <AccidentPlanTable :deviceId="deviceData.id" />
+      </a-tab-pane>
+      <a-tab-pane v-if="deviceType == 'led'" key="10" :tab="'节目管理'">
+        <LEDPlaylistTable :deviceId="deviceData.id" />
       </a-tab-pane>
       <!-- <a-tab-pane key="9" tab="预警指标修改">
         <template v-if="activeKey == '9'">
@@ -93,6 +94,7 @@
   import ManagerWarningDeviceTable from './warningTabel/index2.vue';
   import BackWindDeviceTable from './warningTabel/index3.vue';
   import AccidentPlanTable from './warningTabel/index4.vue';
+  import LEDPlaylistTable from './warningTabel/index5.vue';
   import WorkFacePointTable from './pointTabel/WorkFacePointTable.vue';
   import DeviceReportInfo from './DeviceReportInfo.vue';
   // import editWarnTable from './editWarnTable/index.vue'

src/views/vent/deviceManager/comment/warningTabel/index5.vue

@@ -0,0 +1,84 @@
+<!-- eslint-disable vue/multi-word-component-names -->
+<template>
+  <!-- 配置预警设备 -->
+  <div class="device-box">
+    <a-button class="vent-margin-b-5" type="primary" @click="handleOpen('add', {})"> 新增 </a-button>
+    <a-table :columns="ledPlaylistColumns" :data-source="dataSource" bordered :scroll="{ y: 500 }" :pagination="false" showIndexColumn>
+      <template #bodyCell="{ column, record }">
+        <template v-if="column.dataIndex === 'operation'">
+          <a class="action-link" @click="handleOpen('update', record)">编辑</a>
+          <a-popconfirm title="确认删除" @confirm="handleDelete(record)">
+            <a class="action-link vent-margin-l-10">删除</a>
+          </a-popconfirm>
+        </template>
+      </template>
+    </a-table>
+  </div>
+  <BasicModal @register="register" :width="800" :min-height="600" @ok="onSubmit">
+    <BasicForm @register="registerForm" />
+  </BasicModal>
+</template>
+
+<script lang="ts" setup>
+  import { ref, onMounted, nextTick } from 'vue';
+  import { ledPlaylistColumns, ledPlaylistFormSchemas } from './warning.data';
+  import { updateProgram, deleteProgram, addProgram } from './warning.api';
+  // import BaseModal from './BaseModal.vue';
+  import { message } from 'ant-design-vue';
+  import { BasicForm, useForm } from '/@/components/Form';
+  import { BasicModal, useModal } from '/@/components/Modal';
+  import { queryById } from '../../deviceTable/device.api';
+
+  defineEmits(['register']);
+
+  const props = defineProps({
+    deviceId: { type: String },
+  });
+
+  const formSchemas = ledPlaylistFormSchemas();
+  const dataSource = ref<any[]>([]);
+
+  const [register, { openModal, closeModal }] = useModal();
+  const [registerForm, { setFieldsValue, resetFields, validateFields, getFieldsValue }] = useForm({
+    schemas: formSchemas,
+    showActionButtonGroup: false,
+  });
+
+  async function getDataSource() {
+    const result = await queryById({ id: props.deviceId });
+    dataSource.value = result.programList || [];
+  }
+
+  async function handleOpen(flag, record) {
+    openModal(true, {
+      isUpdate: flag == 'update',
+    });
+    nextTick(() => {
+      resetFields();
+      setFieldsValue(record);
+    });
+  }
+
+  async function handleDelete(record) {
+    await deleteProgram({ id: record.id });
+    getDataSource();
+  }
+
+  async function onSubmit() {
+    await validateFields();
+    const values = getFieldsValue();
+    // 提交数据弹窗
+    if (values.id) {
+      await updateProgram(values);
+    } else {
+      await addProgram(values);
+    }
+    message.info('操作成功');
+    getDataSource();
+    closeModal();
+  }
+
+  onMounted(async () => {
+    getDataSource();
+  });
+</script>

src/views/vent/deviceManager/comment/warningTabel/warning.api.ts

@@ -45,6 +45,10 @@ enum Api {
   modelAlarmAutoAdd = '/safety/modelAlarmAuto/add',
   modelAlarmAutoDeleteBatch = '/safety/modelAlarmAuto/deleteBatch',
   modelAlarmAutoAddBatch = '/safety/modelAlarmAuto/addBatch',
+
+  addProgram = '/monitor/voice-alarm/addProgram',
+  updateProgram = '/monitor/voice-alarm/updateProgram',
+  deleteProgram = '/monitor/voice-alarm/deleteProgram',
 }
 /**
  * 导出api
@@ -147,3 +151,7 @@ export const modelAlarmAutoAddBatch = (params) => defHttp.post({ url: Api.modelA
 export const modelAlarmAutoDelete = (params) => defHttp.delete({ url: Api.modelAlarmAutoDelete, params }, { joinParamsToUrl: true }).then(() => {});
 export const modelAlarmAutoDeleteBatch = (params) => defHttp.delete({ url: Api.modelAlarmAutoDeleteBatch, params });
 export const modelAlarmAutoEdit = (params) => defHttp.post({ url: Api.modelAlarmAutoEdit, params });
+
+export const addProgram = (params) => defHttp.post({ url: Api.addProgram, params });
+export const updateProgram = (params) => defHttp.post({ url: Api.updateProgram, params });
+export const deleteProgram = (params) => defHttp.post({ url: Api.deleteProgram, params });

src/views/vent/deviceManager/comment/warningTabel/warning.data.ts

@@ -880,7 +880,7 @@ export const modelAlarmFormSchemas = () =>
     },
   ];
 
-export const modelAlarmColumns: TableColumnType[] = [
+export const modelAlarmColumns: BasicColumn[] = [
   {
     title: '序号',
     width: 80,
@@ -912,3 +912,70 @@ export const modelAlarmColumns: TableColumnType[] = [
   // { dataIndex: 'updateTime', title: '更新日期' },
   { dataIndex: 'operation', title: '操作' },
 ];
+
+export const ledPlaylistColumns: BasicColumn[] = [
+  { dataIndex: 'programName', title: '节目标题' },
+  { dataIndex: 'programContent', title: '节目内容' },
+  { dataIndex: 'programIndex', title: '节目排序' },
+  {
+    dataIndex: 'programType',
+    title: '节目类别',
+    format: new Map([
+      [2, '其他'],
+      [1, '循环'],
+      [0, '默认'],
+    ]),
+  },
+];
+
+export const ledPlaylistFormSchemas = () =>
+  <FormSchema[]>[
+    {
+      label: 'ID',
+      field: 'id',
+      component: 'Input',
+      show: false,
+    },
+    {
+      label: 'deviceID',
+      field: 'deviceId',
+      component: 'Input',
+      show: false,
+    },
+    {
+      label: '节目标题',
+      field: 'programName',
+      component: 'Input',
+    },
+    {
+      label: '节目内容',
+      field: 'programContent',
+      component: 'Input',
+    },
+    {
+      label: '节目排序',
+      field: 'programIndex',
+      component: 'InputNumber',
+    },
+    {
+      label: '节目类别',
+      field: 'programType',
+      component: 'Select',
+      componentProps: {
+        options: [
+          {
+            label: '其他',
+            value: 2,
+          },
+          {
+            label: '循环',
+            value: 1,
+          },
+          {
+            label: '默认',
+            value: 0,
+          },
+        ],
+      },
+    },
+  ];

src/views/vent/deviceManager/deviceTable/device.api.ts

@@ -3,13 +3,14 @@ import { Modal } from 'ant-design-vue';
 
 enum Api {
   list = '/safety/ventanalyDeviceInfo/list',
+  queryById = '/safety/ventanalyDeviceInfo/queryById',
   save = '/safety/ventanalyDeviceInfo/add',
   edit = '/safety/ventanalyDeviceInfo/edit',
   deleteById = '/safety/ventanalyDeviceInfo/delete',
   deleteBatch = '/safety/ventanalyDeviceInfo/deleteBatch',
   importExcel = '/sys/user/importExcel',
   exportXls = '/safety/ventanalyMonitorParams/exportXls',
-  importExcel1='/safety/gasDayReport/importByExcel'
+  importExcel1 = '/safety/gasDayReport/importByExcel',
 }
 /**
  * 导出api
@@ -30,6 +31,8 @@ export const getImportUrl1 = Api.importExcel1;
  */
 export const list = (params) => defHttp.get({ url: Api.list, params });
 
+export const queryById = (params) => defHttp.get({ url: Api.queryById, params });
+
 /**
  * 删除用户
  */

src/views/vent/monitorManager/ledMonitor/index.vue

@@ -0,0 +1,152 @@
+<!-- eslint-disable vue/multi-word-component-names -->
+<template>
+  <div class="p-10px device-manager-box">
+    <!-- 配置预警设备 -->
+    <a-button class="vent-margin-b-5 mr-5px" type="primary" @click="handleDisplay()">批量下发</a-button>
+    <a-popconfirm title="停止播放" @confirm="handleStop()">
+      <a-button class="vent-margin-b-5 mr-5px" type="primary">批量停止</a-button>
+    </a-popconfirm>
+    <BasicTable @register="registerTable" :rowSelection="rowSelection">
+      <template #operation="{ record }">
+        <a class="action-link" @click="handleChange(record)">切换节目</a>
+        <a class="action-link ml-10px" @click="handleDisplay(record)">下发</a>
+        <a-popconfirm title="停止播放" @confirm="handleStop(record)">
+          <a class="action-link ml-10px">停止播放</a>
+        </a-popconfirm>
+      </template>
+    </BasicTable>
+    <BasicModal title="节目表单" @register="register1" @ok="onSubmit1">
+      <BasicForm @register="registerForm1" />
+    </BasicModal>
+    <BasicModal title="下发内容表单" @register="register2" @ok="onSubmit2">
+      <BasicForm @register="registerForm2" />
+    </BasicModal>
+  </div>
+</template>
+
+<script lang="ts" setup>
+  import { onMounted, nextTick } from 'vue';
+  import { programSchema, displaySchema } from './led.data';
+  // import BaseModal from './BaseModal.vue';
+  import { message } from 'ant-design-vue';
+  import { BasicForm, useForm } from '/@/components/Form';
+  import { BasicModal, useModal } from '/@/components/Modal';
+  import { getTableHeaderColumns } from '/@/hooks/web/useWebColumns';
+  import { BasicTable } from '/@/components/Table';
+  import { useListPage } from '/@/hooks/system/useListPage';
+  import { changeProgram, inputDisplay, list, stopVoice } from './led.api';
+  import { get } from 'lodash-es';
+
+  /** 等待操作的led屏幕列表 */
+  let ledList: any[] = [];
+
+  const [register1, modalContext1] = useModal();
+  const [register2, modalContext2] = useModal();
+  const [registerForm1, formContext1] = useForm({
+    schemas: programSchema,
+    showActionButtonGroup: false,
+  });
+  const [registerForm2, formContext2] = useForm({
+    schemas: displaySchema,
+    showActionButtonGroup: false,
+  });
+  const { tableContext } = useListPage({
+    tableProps: {
+      api: list,
+      showActionColumn: true,
+      actionColumn: {
+        dataIndex: 'operation',
+        title: '操作',
+        width: 120,
+        slots: { customRender: 'operation' },
+      },
+      rowSelection: { type: 'checkbox' },
+      useSearchForm: false,
+      title: 'LED列表',
+    },
+  });
+  const [registerTable, { setColumns, reload, getSelectRows }, { rowSelection }] = tableContext;
+
+  /** 切换节目 */
+  function handleChange(record) {
+    modalContext1.openModal();
+    nextTick(() => {
+      formContext1.setFieldsValue({
+        deviceId: record.deviceId,
+        id: record.other1,
+      });
+      // 根据每个显示屏的节目初始化节目下拉框
+      formContext1.updateSchema({
+        field: 'id',
+        componentProps: {
+          options: get(record, 'programList', []).map((e) => {
+            return {
+              value: e.id,
+              label: e.programName,
+              programType: e.programType,
+            };
+          }),
+        },
+      });
+    });
+  }
+
+  async function onSubmit1() {
+    await formContext1.validateFields();
+    const values = formContext1.getFieldsValue();
+    await changeProgram(values);
+    reload();
+    modalContext1.closeModal();
+  }
+
+  /** 内容下发 */
+  function handleDisplay(record?: any) {
+    if (record) {
+      ledList = [record];
+      modalContext2.openModal();
+      nextTick(() => {
+        formContext2.setFieldsValue(record);
+      });
+    } else {
+      const selection = getSelectRows();
+      if (!selection.length) return message.info('未选择项目');
+
+      ledList = selection;
+      modalContext2.openModal();
+      nextTick(() => {
+        formContext2.resetFields();
+      });
+    }
+  }
+
+  async function onSubmit2() {
+    await formContext2.validateFields();
+    const values = formContext2.getFieldsValue();
+    inputDisplay({
+      deviceIdList: ledList.map((e) => e.deviceId), //设备id,可以传多个
+      ...values,
+    });
+    reload();
+    modalContext2.closeModal();
+  }
+
+  /** 停止播放 */
+  function handleStop(record?: any) {
+    if (record) {
+      ledList = [record];
+    } else {
+      const selection = getSelectRows();
+      if (!selection.length) return message.info('未选择项目');
+
+      ledList = selection;
+    }
+
+    stopVoice({
+      deviceIdList: ledList.map((e) => e.deviceId), //设备id,可以传多个
+    });
+  }
+
+  onMounted(async () => {
+    setColumns(getTableHeaderColumns(`led_list`));
+  });
+</script>

src/views/vent/monitorManager/ledMonitor/led.api.ts

@@ -0,0 +1,18 @@
+import { defHttp } from '/@/utils/http/axios';
+
+enum Api {
+  list = '/safety/ventanalyDeviceInfo/list',
+  changeProgram = '/monitor/voice-alarm/changeProgram',
+  stopVoice = '/monitor/voice-alarm/stopVoice',
+  inputDisplay = '/monitor/voice-alarm/inputDisplay',
+}
+
+/**
+ * 列表接口
+ * @param params
+ */
+export const list = (params) => defHttp.get({ url: Api.list, params: { strtype: 'led_PH21', ...params } });
+
+export const changeProgram = (params) => defHttp.post({ url: Api.changeProgram, params });
+export const stopVoice = (params) => defHttp.post({ url: Api.stopVoice, params });
+export const inputDisplay = (params) => defHttp.post({ url: Api.inputDisplay, params });

src/views/vent/monitorManager/ledMonitor/led.data.ts

@@ -0,0 +1,49 @@
+import { FormSchema } from '/@/components/Table';
+
+export const programSchema: FormSchema[] = [
+  {
+    label: 'ID',
+    field: 'deviceId',
+    component: 'Input',
+    show: false,
+    // colProps: { span: 6 },
+  },
+  {
+    label: '节目',
+    field: 'id',
+    component: 'Select',
+    componentProps: {
+      dictCode: '',
+      placeholder: '请选择设备类型',
+    },
+    // colProps: { span: 6 },
+  },
+];
+
+export const displaySchema: FormSchema[] = [
+  {
+    label: '地点',
+    field: 'content',
+    component: 'Input',
+    componentProps: {
+      placeholder: '请输入地点（少于10字）',
+    },
+    // show({ values }) {
+    //   // 只有循环节目支持下发内容
+    //   return values.programId === 1;
+    // },
+    rules: [{ required: false, message: '文本过长', max: 10 }],
+    // colProps: { span: 6 },
+  },
+  {
+    label: '内容',
+    field: 'describe',
+    component: 'Input',
+    // show({ values }) {
+    //   // 只有循环节目支持下发内容
+    //   return values.programId === 1;
+    // },
+    defaultValue: '发生灾害，请马上撤离！',
+    // colProps: { span: 6 },
+  },
+];