Explorar o código

菜单管理APP界面修改-提交

lxh hai 4 meses
pai
achega
02a9c99ce4

+ 123 - 0
src/views/system/menuModalApp/DataRuleList.vue

@@ -0,0 +1,123 @@
+<template>
+    <BasicDrawer v-bind="$attrs" @register="registerDrawer" title="数据权限规则" :width="adaptiveWidth">
+      <BasicTable @register="registerTable">
+        <template #tableTitle>
+          <a-button type="primary" @click="handleCreate"> 新增</a-button>
+        </template>
+        <template #action="{ record }">
+          <TableAction :actions="getTableAction(record)" />
+        </template>
+      </BasicTable>
+    </BasicDrawer>
+    <DataRuleModal @register="registerModal" @success="reload" :permissionId="permissionId" />
+  </template>
+  <script lang="ts" setup>
+    import { ref, unref } from 'vue';
+    import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
+    import { BasicTable, useTable, TableAction } from '/@/components/Table';
+    import { useModal } from '/@/components/Modal';
+    import DataRuleModal from './DataRuleModal.vue';
+    import { dataRuleColumns, dataRuleSearchFormSchema } from './menu.data';
+    import { dataRuleList, deleteRule } from './menu.api';
+    import { ColEx } from '/@/components/Form/src/types';
+    import { useDrawerAdaptiveWidth } from '/@/hooks/jeecg/useAdaptiveWidth';
+    const permissionId = ref('');
+    const { adaptiveWidth } = useDrawerAdaptiveWidth();
+    //权限规则model
+    const [registerModal, { openModal }] = useModal();
+    const [registerDrawer] = useDrawerInner(async (data) => {
+      permissionId.value = data.id;
+      setProps({ searchInfo: { permissionId: unref(permissionId) } });
+      reload();
+    });
+    // 自适应列配置
+    const adaptiveColProps: Partial<ColEx> = {
+      xs: 24, // <576px
+      sm: 24, // ≥576px
+      md: 24, // ≥768px
+      lg: 12, // ≥992px
+      xl: 8, // ≥1200px
+      xxl: 8, // ≥1600px
+    };
+    const [registerTable, { reload, setProps }] = useTable({
+      api: dataRuleList,
+      columns: dataRuleColumns,
+      size: 'small',
+      formConfig: {
+        baseColProps: adaptiveColProps,
+        labelAlign: 'right',
+        labelCol: {
+          offset: 1,
+          xs: 24,
+          sm: 24,
+          md: 24,
+          lg: 8,
+          xl: 8,
+          xxl: 8,
+        },
+        wrapperCol: {},
+        schemas: dataRuleSearchFormSchema,
+        autoSubmitOnEnter: true,
+      },
+      striped: true,
+      useSearchForm: true,
+      bordered: true,
+      showIndexColumn: false,
+      showTableSetting: false,
+      canResize: false,
+      immediate: false,
+      actionColumn: {
+        width: 100,
+        title: '操作',
+        dataIndex: 'action',
+        slots: { customRender: 'action' },
+        fixed: undefined,
+      },
+    });
+  
+    /**
+     * 新增
+     */
+    function handleCreate() {
+      openModal(true, {
+        isUpdate: false,
+      });
+    }
+  
+    /**
+     * 编辑
+     */
+    function handleEdit(record) {
+      openModal(true, {
+        record,
+        isUpdate: true,
+      });
+    }
+  
+    /**
+     * 删除
+     */
+    async function handleDelete(record) {
+      await deleteRule({ id: record.id }, reload);
+    }
+  
+    /**
+     * 操作栏
+     */
+    function getTableAction(record) {
+      return [
+        {
+          label: '编辑',
+          onClick: handleEdit.bind(null, record),
+        },
+        {
+          label: '删除',
+          popConfirm: {
+            title: '是否确认删除',
+            confirm: handleDelete.bind(null, record),
+          },
+        },
+      ];
+    }
+  </script>
+  

+ 55 - 0
src/views/system/menuModalApp/DataRuleModal.vue

@@ -0,0 +1,55 @@
+<template>
+    <BasicModal v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit" width="700px">
+      <BasicForm @register="registerForm" />
+    </BasicModal>
+  </template>
+  <script lang="ts" setup>
+    import { defineProps, ref, computed, unref } from 'vue';
+    import { BasicModal, useModalInner } from '/@/components/Modal';
+    import { BasicForm, useForm } from '/@/components/Form/index';
+    import { dataRuleFormSchema } from './menu.data';
+    import { saveOrUpdateRule } from './menu.api';
+    // 声明Emits
+    const emit = defineEmits(['success', 'register']);
+    const props = defineProps({ permissionId: String });
+    const isUpdate = ref(true);
+    //表单配置
+    const [registerForm, { resetFields, setFieldsValue, validate }] = useForm({
+      schemas: dataRuleFormSchema,
+      showActionButtonGroup: false,
+    });
+    //表单赋值
+    const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
+      //重置表单
+      await resetFields();
+      setModalProps({ confirmLoading: false });
+      isUpdate.value = !!data?.isUpdate;
+      if (unref(isUpdate)) {
+        //表单赋值
+        await setFieldsValue({
+          ...data.record,
+        });
+      }
+    });
+  
+    //设置标题
+    const getTitle = computed(() => (!unref(isUpdate) ? '新增规则' : '编辑规则'));
+  
+    //表单提交事件
+    async function handleSubmit() {
+      try {
+        const values = await validate();
+        values.permissionId = props.permissionId;
+        setModalProps({ confirmLoading: true });
+        //提交表单
+        await saveOrUpdateRule(values, isUpdate.value);
+        //关闭弹窗
+        closeModal();
+        //刷新列表
+        emit('success');
+      } finally {
+        setModalProps({ confirmLoading: false });
+      }
+    }
+  </script>
+  

+ 105 - 0
src/views/system/menuModalApp/MenuDrawer.vue

@@ -0,0 +1,105 @@
+<template>
+    <BasicDrawer v-bind="$attrs" @register="registerDrawer" showFooter :width="adaptiveWidth" :title="getTitle" @ok="handleSubmit">
+      <BasicForm @register="registerForm" class="menuForm" />
+    </BasicDrawer>
+  </template>
+  <script lang="ts" setup>
+    import { ref, computed, unref, useAttrs } from 'vue';
+    import { BasicForm, useForm } from '/@/components/Form/index';
+    import { formSchema, ComponentTypes } from './menu.data';
+    import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
+    import { list, saveOrUpdateMenu } from './menu.api';
+    import { useDrawerAdaptiveWidth } from '/@/hooks/jeecg/useAdaptiveWidth';
+    // 声明Emits
+    const emit = defineEmits(['success', 'register']);
+    const { adaptiveWidth } = useDrawerAdaptiveWidth();
+    const attrs = useAttrs();
+    const isUpdate = ref(true);
+    const menuType = ref(0);
+    const isButton = (type) => type === 2;
+    const [registerForm, { setProps, resetFields, setFieldsValue, updateSchema, validate, clearValidate }] = useForm({
+      labelCol: {
+        md: { span: 4 },
+        sm: { span: 6 },
+      },
+      wrapperCol: {
+        md: { span: 20 },
+        sm: { span: 18 },
+      },
+      schemas: formSchema,
+      showActionButtonGroup: false,
+    });
+  
+    const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => {
+      await resetFields();
+      setDrawerProps({ confirmLoading: false });
+      isUpdate.value = !!data?.isUpdate;
+      menuType.value = data?.record?.menuType;
+  
+      //获取下拉树信息
+      const treeData = await list({kind: 3});
+      updateSchema([
+        {
+          field: 'parentId',
+          componentProps: { treeData },
+        },
+        {
+          field: 'name',
+          label: isButton(unref(menuType)) ? '按钮/权限' : '菜单名称',
+        },
+        {
+          field: 'url',
+          required: !isButton(unref(menuType)),
+          componentProps: {
+            onChange: (e) => onUrlChange(e.target.value),
+          },
+        },
+      ]);
+  
+      // 无论新增还是编辑,都可以设置表单值
+      if (typeof data.record === 'object') {
+        let values = { ...data.record };
+        setFieldsValue(values);
+        onUrlChange(values.url);
+      }
+      //禁用表单
+      setProps({ disabled: !attrs.showFooter });
+    });
+    //获取弹窗标题
+    const getTitle = computed(() => (!unref(isUpdate) ? '新增菜单' : '编辑菜单'));
+    //提交事件
+    async function handleSubmit() {
+      try {
+        const values = await validate();
+        // iframe兼容
+        if (ComponentTypes.IFrame === values.component) {
+          values.component = values.frameSrc;
+        }
+        setDrawerProps({ confirmLoading: true });
+        //提交表单
+        await saveOrUpdateMenu({...values, kind: 3}, unref(isUpdate));
+        closeDrawer();
+        emit('success');
+      } finally {
+        setDrawerProps({ confirmLoading: false });
+      }
+    }
+  
+    /** url 变化时,动态设置组件名称placeholder */
+    function onUrlChange(url) {
+      let placeholder = '';
+      if (url != null && url != '') {
+        if (url.startsWith('/')) {
+          url = url.substring(1);
+        }
+        url = url.replaceAll('/', '-');
+        // 特殊标记
+        url = url.replaceAll(':', '@');
+        placeholder = `${url}`;
+      } else {
+        placeholder = '请输入组件名称';
+      }
+      updateSchema([{ field: 'componentName', componentProps: { placeholder } }]);
+    }
+  </script>
+  

+ 2 - 2
src/views/system/menuModalApp/index.vue

@@ -34,8 +34,8 @@
     import { BasicTable, useTable, TableAction } from '/@/components/Table';
     import { useListPage } from '/@/hooks/system/useListPage';
     import { useDrawer } from '/@/components/Drawer';
-    import MenuDrawer from '../menuModal/MenuDrawer.vue';
-    import DataRuleList from '../menuModal/DataRuleModal.vue';
+    import MenuDrawer from './MenuDrawer.vue';
+    import DataRuleList from './DataRuleList.vue';
     import { columns, searchFormSchema } from '../menuModal/menu.data';
     import { list, deleteMenu, batchDeleteMenu } from '../menuModal/menu.api';
   

+ 0 - 1
src/views/vent/monitorManager/alarmMonitor/warn/ventilateWarn.vue

@@ -184,7 +184,6 @@ function getSysWarnList(id, type) {
         return acr1 > cur1 ? acr1 : cur1;
       });
       maxY.value = max1 >= max2 ? max1 : max2;
-      console.log(maxY.value, '000')
       maxY.value = maxY.value.toString().indexOf('.') == -1 ? maxY.value.toString() : maxY.value.toString().substring(0, maxY.value.toString().indexOf('.'))
       if (maxY.value.length < 2 && Number(maxY.value) < 1) {
         maxY.value = 1