feat:修改课时统计

src/services/apis/ClassTimeStatisticsController.ts

@@ -35,6 +35,9 @@ export async function getClassTimeStatisticsLastDate(params:any,mode: ErrorMessa
 /** 课时统计列表(分页) GET /classtime/classTimeStatistics/page */
 export async function getClassTimeStatisticsPage(params:any,mode: ErrorMessageMode = 'modal'){ return defHttp.get<API.PageOutput<API.ClassTimeStatisticsPageVo>>
         ({url: '/classtime/classTimeStatistics/page', params:params},{errorMessageMode:mode});}
+/** 课时统计详情导出 GET /classtime/classTimeStatistics/record-export */
+export async function getClassTimeStatisticsRecordExport(params:any,mode: ErrorMessageMode = 'modal'){ return defHttp.download<any>
+        ({url: '/classtime/classTimeStatistics/record-export',responseType:'blob', params:params},{errorMessageMode:mode});}
 /** 课时统计详情列表 GET /classtime/classTimeStatistics/record-list */
 export async function getClassTimeStatisticsRecordList(params:any,mode: ErrorMessageMode = 'modal'){ return defHttp.get<API.ClassTimeStatisticsRecordVo[]>
         ({url: '/classtime/classTimeStatistics/record-list', params:params},{errorMessageMode:mode});}

src/views/course/statistics/components/detail.vue

@@ -11,63 +11,70 @@
     :defaultFullscreen="true"
     :show-cancel-btn="false"
   >
-    <div>
-      <div style="height: 100%">
-        <BasicTable @register="registerTable">
-          <template #toolbar>
-            <div class="flex-1 flex">
-              <div class="flex flex-1 items-center justify-center text-lg font-bold">
-                <Space>
-                  <div>{{ modelRef?.userName }}</div>
-                  <div>{{ modelRef?.name }}</div>
-                  <div>{{ modelRef?.employTypeCn }}</div>
-                </Space>
-              </div>
-              <div class="flex items-center">
-                <Space>
-                  <div class="flex items-center">
-                    <div
-                      style="
-                        width: 10px;
-                        height: 10px;
-                        border-radius: 50%;
-                        background-color: #facd91;
-                      "
-                    ></div>
-                    <div class="ml-2">调课</div>
-                  </div>
-                  <div class="flex items-center">
-                    <div
-                      style="
-                        width: 10px;
-                        height: 10px;
-                        border-radius: 50%;
-                        background-color: #ec808d;
-                      "
-                    ></div>
-                    <div class="ml-2">顶课</div>
-                  </div>
-                </Space>
-              </div>
+    <div style="height: 100%">
+      <BasicTable @register="registerTable">
+        <template #toolbar>
+          <div class="flex-1 flex">
+            <div class="flex flex-1 items-center justify-center text-lg font-bold">
+              <a-button
+                type="primary"
+                class="mr-[48px]"
+                :disabled="dataSoruce.index === 0"
+                @click="handelNex(0)"
+              >
+                上一个
+              </a-button>
+              <Space>
+                <div>{{ modelRef?.userName }}</div>
+                <div>{{ modelRef?.name }}</div>
+                <div>{{ modelRef?.employTypeCn }}</div>
+              </Space>
+              <a-button
+                type="primary"
+                class="ml-[48px]"
+                :disabled="dataSoruce.index >= dataSoruce.data.length - 1"
+                @click="handelNex(1)"
+              >
+                下一个
+              </a-button>
             </div>
-          </template>
-          <template #allClassTime="{ text }">
-            <div>{{ text }}</div>
-          </template>
-        </BasicTable>
-      </div>
+            <div class="flex items-center">
+              <Space>
+                <div class="flex items-center">
+                  <div
+                    style="width: 10px; height: 10px; border-radius: 50%; background-color: #facd91"
+                  ></div>
+                  <div class="ml-2">调课</div>
+                </div>
+                <div class="flex items-center">
+                  <div
+                    style="width: 10px; height: 10px; border-radius: 50%; background-color: #ec808d"
+                  ></div>
+                  <div class="ml-2">顶课</div>
+                </div>
+              </Space>
+            </div>
+          </div>
+        </template>
+        <template #allClassTime="{ text }">
+          <div>{{ text }}</div>
+        </template>
+      </BasicTable>
     </div>
   </BasicModal>
 </template>
 <script setup lang="ts">
-  import { ref, computed, unref, h } from 'vue';
+  import { ref, computed, unref, h, reactive } from 'vue';
   import { Space } from 'ant-design-vue';
   import { BasicModal, useModalInner } from '/@/components/Modal';
-  import { getClassTimeStatisticsInfo } from '/@/services/apis/ClassTimeStatisticsController';
   import { useTable, BasicTable, BasicColumn } from '/@/components/Table';
 
   const isUpdate = ref(true);
   const modelRef = ref<Recordable>({});
+  const dataSoruce = reactive({
+    data: [],
+    index: 0,
+  });
   const emit = defineEmits(['success', 'register']);
 
   const [registerTable, { setTableData, setColumns }] = useTable({
@@ -88,13 +95,21 @@
     canResize: true,
     pagination: false,
     showIndexColumn: false,
+    resizeHeightOffset: 80,
   });
 
   const [registerModal, { closeModal, setModalProps }] = useModalInner(async (data) => {
     setModalProps({ confirmLoading: true });
     isUpdate.value = false;
+    dataSoruce.data = data.baseData.data;
+    dataSoruce.index = data.baseData.index;
 
-    modelRef.value = { ...data.baseData };
+    await loadData();
+  });
+
+  const loadData = async () => {
+    setModalProps({ confirmLoading: true });
+    modelRef.value = dataSoruce.data[dataSoruce.index];
     // const resData = await getClassTimeStatisticsInfo({ id: data.baseData.id });
 
     const columns: BasicColumn[] = [
@@ -102,6 +117,7 @@
         title: '节次',
         dataIndex: 'timeName',
         align: 'left',
+        width: 120,
       },
       {
         title: '6.3',
@@ -115,30 +131,97 @@
         width: 120,
         customRender: formatDay,
       },
+      {
+        title: '6.4',
+        dataIndex: 'day2',
+        width: 120,
+        customRender: formatDay,
+      },
+      {
+        title: '6.4',
+        dataIndex: 'day2',
+        width: 120,
+        customRender: formatDay,
+      },
+      {
+        title: '6.4',
+        dataIndex: 'day2',
+        width: 120,
+        customRender: formatDay,
+      },
+      {
+        title: '6.4',
+        dataIndex: 'day2',
+        width: 120,
+        customRender: formatDay,
+      },
+      {
+        title: '6.4',
+        dataIndex: 'day2',
+        width: 120,
+        customRender: formatDay,
+      },
+      {
+        title: '6.4',
+        dataIndex: 'day2',
+        width: 120,
+        customRender: formatDay,
+      },
+      {
+        title: '6.4',
+        dataIndex: 'day2',
+        width: 120,
+        customRender: formatDay,
+      },
+      {
+        title: '6.4',
+        dataIndex: 'day2',
+        width: 120,
+        customRender: formatDay,
+      },
+      {
+        title: '6.4',
+        dataIndex: 'day2',
+        width: 120,
+        customRender: formatDay,
+      },
+      {
+        title: '6.4',
+        dataIndex: 'day2',
+        width: 120,
+        customRender: formatDay,
+      },
     ];
 
     columns.push({
-      title: '合计课时',
+      title: '合计（课时）',
       dataIndex: 'total',
-      align: 'left',
-      width: 80,
+      width: 90,
     });
 
     setColumns(columns);
 
     const resData = [
-      { timeName: '早自习（0）', total: 15, day1: { courseName: '语文', className: '23会计2' } },
+      {
+        timeName: '早自习（0）',
+        total: 15,
+        day1: { courseName: '语文', className: '23会计2', color: '#facd91' },
+      },
     ];
 
     setTableData(resData);
-
     setModalProps({ confirmLoading: false });
-  });
+  };
 
   const formatDay = ({ text }) => {
-    return h('div', null, [
-      h('div', null, text.courseName || ''),
-      h('div', null, text.className || ''),
+    let style = {};
+    if (text && text.color) {
+      style['backgroundColor'] = text.color;
+      style['color'] = '#fff';
+    }
+    return h('div', { style: style }, [
+      h('div', null, text?.courseName || ''),
+      h('div', null, text?.className || ''),
     ]);
   };
 
@@ -151,6 +234,19 @@
       setModalProps({ confirmLoading: false });
     }
   };
+
+  const handelNex = async (type) => {
+    if (type === 0) {
+      if (dataSoruce.index > 0) {
+        dataSoruce.index -= 1;
+      }
+    } else {
+      if (dataSoruce.index < dataSoruce.data.length - 1) {
+        dataSoruce.index += 1;
+      }
+    }
+    await loadData();
+  };
 </script>
 
 <style scoped lang="less"></style>

src/views/course/statistics/components/edit.vue

@@ -41,12 +41,10 @@
             </a-button>
             <a-button type="primary" @click="handleWeight">权重设置</a-button>
             <a-button type="primary" @click="handleCost">费用设置</a-button>
-            <a-button type="primary">导出</a-button>
+            <a-button type="primary" @click="handleExport">导出</a-button>
           </template>
-          <template #allClassTime="{ record, text }">
-            <a-button type="link" @click="handelDetail(record)">
-              {{ text }}
-            </a-button>
+          <template #allClassTime="{ text, index }">
+            <a-button type="link" @click="handelDetail(index)"> {{ text }}</a-button>
           </template>
         </BasicTable>
       </div>
@@ -62,6 +60,7 @@
   import { formDetailSchema } from '../data.config';
   import {
     getClassTimeStatisticsInfo,
+    getClassTimeStatisticsRecordExport,
     getClassTimeStatisticsRecordList,
     postClassTimeStatisticsChangeStatus,
     postClassTimeStatisticsRefreshStatistics,
@@ -72,6 +71,7 @@
   import FormCost from './cost.vue';
   import { formatToDate } from '/@/utils/dateUtil';
   import FormDetail from './detail.vue';
+  import { downloadByData } from '/@/utils/file/download';
 
   const isUpdate = ref(true);
   const modelRef = ref<Recordable>({});
@@ -81,7 +81,7 @@
   const [registerCostModal, { openModal: openCostModal }] = useModal();
   const [registerDetailModal, { openModal: openDetailModal }] = useModal();
 
-  const [registerTable, { reload }] = useTable({
+  const [registerTable, { reload, getDataSource }] = useTable({
     api: getClassTimeStatisticsRecordList,
     title: '课时统计表',
     rowKey: 'id',
@@ -141,17 +141,28 @@
     });
   };
 
-  const handelDetail = (record) => {
+  const handelDetail = (index) => {
+    const data = getDataSource();
     openDetailModal(true, {
       isUpdate: false,
       baseData: {
-        ...record,
+        data,
+        index,
       },
     });
   };
   const handelRefrresh = async () => {
     await postClassTimeStatisticsRefreshStatistics({ id: unref(modelRef).id });
-    reload();
+    closeModal();
+
+    emit('success');
+  };
+
+  const handleExport = async () => {
+    downloadByData(
+      (await getClassTimeStatisticsRecordExport({})).data,
+      `课时统计表${formatToDate(new Date())}.xlsx`,
+    );
   };
 </script>