2024年2月26日 智慧教室新增页面

src/views/kc/jiaoshi/indexJxlDetail.vue

@@ -0,0 +1,116 @@
+<template>
+  <a-modal :visible="isShowPage" width="80%" style="top: 20px" title="详情" :ok-button-props="{ style: { display: 'none' } }" cancelText="关闭" @cancel="() => (isShowPage = false)">
+    <!--引用表格-->
+    <BasicTable @register="registerTable" :rowSelection="rowSelection">
+       <!--操作栏-->
+       <template #action="{ record }">
+        <TableAction :actions="getTableAction(record)" :dropDownActions="getDropDownAction(record)"/>
+      </template>
+    </BasicTable>
+    <KcJiaoshirongliangModal @register="registerModal" @success="handleSuccess"></KcJiaoshirongliangModal>
+  </a-modal>
+</template>
+
+<script lang="ts" name="jiaoshi-kcJiaoshirongliang" setup>
+  import {ref, computed, unref, Ref } from 'vue';
+  import { BasicTable, useTable, TableAction } from '/@/components/Table';
+  import { useModal } from '/@/components/Modal';
+  import { useListPage } from '/@/hooks/system/useListPage'
+  import KcJiaoshirongliangModal from './components/KcJiaoshirongliangModal.vue'
+  import { columns, searchFormSchema } from './KcJiaoshirongliang.data';
+  import { list, deleteOne, batchDelete, getImportUrl, getExportUrl } from './KcJiaoshirongliang.api';
+  import { downloadFile } from '/@/utils/common/renderUtils';
+  import JImageUpload from '/@/components/Form/src/jeecg/components/JImageUpload.vue';
+  const checkedKeys = ref<Array<string | number>>([]);
+  //注册model
+  const [registerModal, { openModal }] = useModal();
+  //注册table数据
+  const { prefixCls,tableContext,onExportXls,onImportXls } = useListPage({
+    tableProps:{
+      title: '教室容量',
+      api: list,
+      columns,
+      canResize:false,
+      formConfig: {
+        //labelWidth: 120,
+        schemas: searchFormSchema,
+        autoSubmitOnEnter:true,
+        showAdvancedButton:true,
+        fieldMapToNumber: [
+        ],
+        fieldMapToTime: [
+        ],
+      },
+      actionColumn: {
+        width: 120,
+        fixed:'right'
+      },
+    },
+    exportConfig: {
+      name:"教室容量",
+      url: getExportUrl,
+    },
+    importConfig: {
+      url: getImportUrl,
+      success: handleSuccess
+    },
+  })
+
+  const [registerTable, { reload },{ rowSelection, selectedRowKeys }] = tableContext
+
+  const isShowPage:Ref<boolean> = ref(false);
+
+   /**
+    * 详情
+   */
+   function handleDetail(record: Recordable) {
+     openModal(true, {
+       record,
+       isUpdate: true,
+       showFooter: false,
+     });
+   }
+   /**
+    * 操作栏
+    */
+    function getTableAction(record){
+       return [
+         {
+           label: '详情',
+           onClick: handleDetail.bind(null, record),
+         }
+       ]
+   }
+
+   function getDropDownAction(record){
+    return []
+   }
+
+   function open(param){
+    // changeQueryParam(param);
+    reload();
+    isShowPage.value = true;
+  }
+
+  function close(){
+    isShowPage.value = false;
+  }
+
+   /**
+    * 成功回调
+    */
+  function handleSuccess() {
+      (selectedRowKeys.value = []) && reload();
+   }
+
+   defineExpose({
+    open,
+    close,
+   });
+
+
+</script>
+
+<style scoped>
+
+</style>