迭代八我的填报接口调试

package-lock.json

@@ -47,7 +47,7 @@
         "jsencrypt": "3.3.2",
         "nprogress": "0.2.0",
         "ol": "^8.0.0",
-        "pinia": "2.1.7",
+        "pinia": "^2.1.7",
         "proj4": "^2.12.1",
         "screenfull": "6.0.2",
         "uuid": "^10.0.0",

package.json

@@ -56,7 +56,7 @@
     "jsencrypt": "3.3.2",
     "nprogress": "0.2.0",
     "ol": "^8.0.0",
-    "pinia": "2.1.7",
+    "pinia": "^2.1.7",
     "proj4": "^2.12.1",
     "screenfull": "6.0.2",
     "uuid": "^10.0.0",

src/api/dataFilling/datafilling.ts

@@ -7,3 +7,24 @@ export function fillList(data) {
     data: data
   });
 }
+export function fillDetail(data) {
+  return request({
+    url: '/api/dataFilling/submission_status',
+    method: 'post',
+    data: data
+  });
+}
+export function writeView(params) {
+  return request({
+    url: '/api/dataFilling/report_fields',
+    method: 'get',
+    params: params
+  });
+}
+export function submitFill(data) {
+  return request({
+    url: '/api/dataFilling/submit_data',
+    method: 'post',
+    data: data
+  });
+}

src/views/dataFilling/formDetail.vue

@@ -30,61 +30,30 @@
     </el-row>
   </div>
 </template>
-
 <script setup lang="ts">
 import { ref, onMounted } from 'vue';
 import { ElTable, ElButton, ElCol, ElRow, ElTableColumn } from 'element-plus';
 import * as XLSX from 'xlsx';
+import { fillDetail } from '@/api/dataFilling/datafilling';
 
 const emits = defineEmits(['close']);
+const props = defineProps<{
+  eventId: string | number;
+}>();
+
+// 更新表头以匹配新的数据结构
+const editableHeaders = ref(['员工姓名', '员工性别', '加班小时', '新的备注', '新的地址']);
+const tableData = ref([]);
 const detailData = ref({
   title: '测试表单',
-  start: '2024-10-15 17:02:22',
-  end: '2024-10-15 18:00:00'
+  start: '',
+  end: ''
 });
 
-const editableHeaders = ref(['时间', '地点', '损坏程度', '救援人员', '物资']);
-const tableData = ref([]);
-
 onMounted(() => {
-  loadFromLocalStorage();
-  addDefaultRow();
+  fetchFillDetail();
 });
 
-function loadFromLocalStorage() {
-  const storedData = localStorage.getItem('tableData');
-  if (storedData) {
-    tableData.value = JSON.parse(storedData);
-  } else {
-    tableData.value = [
-      {
-        时间: '2024-01-01',
-        地点: '某地',
-        损坏程度: '轻度',
-        救援人员: '张三, 李四',
-        物资: '食品, 水'
-      },
-      {
-        时间: '2024-01-02',
-        地点: '某地',
-        损坏程度: '中度',
-        救援人员: '王五, 赵六',
-        物资: '帐篷, 医疗用品'
-      }
-    ];
-  }
-}
-
-function addDefaultRow() {
-  tableData.value.push({
-    时间: '',
-    地点: '',
-    损坏程度: '',
-    救援人员: '',
-    物资: ''
-  });
-}
-
 const exportToExcel = () => {
   const worksheet = XLSX.utils.json_to_sheet(tableData.value);
   const workbook = { Sheets: { data: worksheet }, SheetNames: ['data'] };
@@ -98,6 +67,24 @@ const exportToExcel = () => {
   link.click();
   window.URL.revokeObjectURL(url); // 清理
 };
+
+const fetchFillDetail = async () => {
+  try {
+    const res = await fillDetail({ report_id: props.eventId });
+    tableData.value = res.data.map((item) => ({
+      '员工姓名': item.ygxm,
+      '员工性别': item.ygxb,
+      '加班小时': item.jbxs,
+      '新的备注': item.bz,
+      '新的地址': item.dz
+    }));
+    detailData.value.start = res.start_time;
+    detailData.value.end = res.end_time;
+  } catch (error) {
+    console.error('Error fetching data:', error);
+  }
+};
+
 const handleReturn = () => {
   emits('close');
 };

src/views/dataFilling/myFilling.vue

@@ -29,14 +29,25 @@
         </transition>
         <!-- 表格组件 -->
         <el-table ref="multipleTable" v-loading="loading" :data="tableData" @selection-change="handleSelectionChange">
-          <el-table-column label="序号" align="center" prop="report_id" />
+          <el-table-column label="序号" align="center" width="80">
+            <template #default="scope">
+              {{ (queryParams.page - 1) * queryParams.pageSize + scope.$index + 1 }}
+            </template>
+          </el-table-column>
           <el-table-column label="表格名称" align="center" prop="table_name" />
           <el-table-column label="开始日期" align="center" prop="start_time" />
           <el-table-column label="截止填报时间" align="center" prop="end_time" />
-          <el-table-column label="任务状态" align="center" prop="submission_status" />
+          <el-table-column label="任务状态" align="center" prop="submission_status">
+            <template #default="scope">
+              <div>
+                <span v-if="Number(scope.row.submission_status) === 0">待填报</span>
+                <span v-else>已上报</span>
+              </div>
+            </template>
+          </el-table-column>
           <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
             <template #default="scope">
-              <el-text v-if="scope.row.submission_status === '待填报'" class="common-btn-text-primary" @click="handleWrite(scope.row)">填表</el-text>
+              <el-text v-if="Number(scope.row.submission_status) === 0" class="common-btn-text-primary" @click="handleWrite(scope.row)">填表</el-text>
               <el-text class="common-btn-text-primary" @click="handleView(scope.row)">详情</el-text>
             </template>
           </el-table-column>
@@ -48,11 +59,14 @@
     <FormDetail v-if="formDetailState.show" :event-id="formDetailState.eventId" @close="handleCancel" />
   </div>
 </template>
+
 <script setup lang="ts">
 import { onMounted, reactive, ref } from 'vue';
 import { fillList } from '@/api/dataFilling/datafilling';
 import WriteForm from './writeForm.vue';
 import FormDetail from './formDetail.vue';
+import { ComponentInternalInstance, getCurrentInstance } from 'vue';
+
 const loading = ref(true);
 const showSearch = ref(true);
 const multiple = ref(true);
@@ -61,49 +75,56 @@ const single = ref(true);
 const total = ref(0);
 const tableData = ref([]);
 const { proxy } = getCurrentInstance() as ComponentInternalInstance;
+
 const initFormData = reactive({
   report_id: '',
   table_name: '',
   start_time: '',
   end_time: '',
-  submission_status: ''
+  submission_status: []
 });
+
 const data = reactive({
   form: { ...initFormData },
   queryParams: {
     page: 1,
     pageSize: 10,
     table_name: '',
-    submission_status: ''
+    submission_status: []
   }
 });
 
 const { queryParams, form } = toRefs(data);
-// 模拟数据源
+
 let writeFormState = reactive({
   show: false,
   eventId: ''
 });
+
 let formDetailState = reactive({
   show: false,
   eventId: ''
 });
+
 const handleCancel = () => {
   writeFormState.show = false;
   formDetailState.show = false;
 };
+
 const handleWrite = (row) => {
   if (row) {
-    writeFormState.eventId = row.id;
+    writeFormState.eventId = row.report_id;
     writeFormState.show = true;
   }
 };
+
 const handleView = (row) => {
   if (row) {
-    formDetailState.eventId = row.id;
+    formDetailState.eventId = row.report_id;
     formDetailState.show = true;
   }
 };
+
 const fetchFillList = () => {
   loading.value = true;
   fillList(queryParams.value)
@@ -115,19 +136,21 @@ const fetchFillList = () => {
       loading.value = false;
     });
 };
-// 初始化数据
+
 onMounted(() => {
   fetchFillList();
 });
+
 const handleQuery = () => {
-  queryParams.value.page = 1;
-  fetchWorkrData();
+  queryParams.value.page = 1; // 重置页码
+  fetchFillList(queryParams.value);
 };
-// 重置查询条件
+
 const resetQuery = () => {
-  queryParams.value = { page: 1, pageSize: 10, table_name: '', task_status: '' };
+  queryParams.value = { page: 1, pageSize: 10, table_name: '', submission_status: [] };
   handleQuery();
 };
+
 const handleSelectionChange = (selection) => {
   ids.value = selection.map((item) => item.id);
 };

src/views/dataFilling/writeForm.vue

@@ -1,23 +1,23 @@
 <template>
   <div class="app-container p-2">
     <el-row :gutter="20">
-      <el-col :lg="30" :xs="24" style="">
+      <el-col :lg="30" :xs="24">
         <el-row :span="24" :gutter="10">
-          <el-col :span="18" label="任务名称">
-            <h2 v-if="detailData.title" key="business" style="font-weight: bolder">{{ detailData.title }}</h2>
+          <el-col :span="18">
+            <h2 v-if="detailData.title" style="font-weight: bolder">{{ detailData.title }}</h2>
             <p class="report-period">【填报周期】：{{ detailData.start }} 至 {{ detailData.end }}</p>
           </el-col>
           <el-col :span="1.5">
-            <el-button type="primary" @click="handleReport()"> 上报 </el-button>
+            <el-button type="primary" @click="handleReport">上报</el-button>
           </el-col>
           <el-col :span="1.5">
-            <el-button type="primary" @click="exportToExcel()"> 导出表格 </el-button>
+            <el-button type="primary" @click="exportToExcel">导出表格</el-button>
           </el-col>
           <el-col :span="1.5">
-            <el-button type="primary" @click="handleSave()"> 保存 </el-button>
+            <el-button type="primary" @click="handleSave">保存</el-button>
           </el-col>
           <el-col :span="1.5">
-            <el-button type="danger" @click="handleReturn()"> 返回 </el-button>
+            <el-button type="danger" @click="handleReturn">返回</el-button>
           </el-col>
         </el-row>
       </el-col>
@@ -26,10 +26,10 @@
           <el-button type="primary" @click="handleAdd">批量导入</el-button>
         </el-col>
         <el-col :span="1.5">
-          <el-button type="primary" @click="handleDownloadEmptyTable"> 下载空表格 </el-button>
+          <el-button type="primary" @click="handleDownloadEmptyTable">下载空表格</el-button>
         </el-col>
         <el-col :span="1.5">
-          <el-button type="primary" @click="handleAddRow"> 新增一行 </el-button>
+          <el-button type="primary" @click="handleAddRow">新增一行</el-button>
         </el-col>
       </el-row>
       <el-col :lg="30" :xs="24">
@@ -62,67 +62,67 @@
 import { ref, onMounted } from 'vue';
 import { ElTable, ElButton, ElCol, ElRow, ElTableColumn } from 'element-plus';
 import * as XLSX from 'xlsx';
+import { writeView, submitFill } from '@/api/dataFilling/datafilling';
+import { defineProps, defineEmits } from 'vue';
+
+const props = defineProps({
+  eventId: String
+});
+
 const emits = defineEmits(['close']);
+
 const detailData = ref({
   title: '测试表单',
   start: '2024-10-15 17:02:22',
   end: '2024-10-15 18:00:00'
 });
 
-const editableHeaders = ref(['时间', '地点', '损坏程度', '救援人员', '物资']);
-const tableData = ref([]);
+const editableHeaders = ref<string[]>([]);
+const tableData = ref<any[]>([]);
 
-// 初始化表格数据
-onMounted(() => {
-  loadFromLocalStorage();
-  addDefaultRow();
-});
+// 获取表头数据
+const fetchHeaders = async () => {
+  try {
+    const response = await writeView({ report_id: props.eventId });
+    if (response.code === 200) {
+      const headers = response.fields.map((field) => field.field_comment);
+      editableHeaders.value = headers;
+    } else {
+      console.error('获取表头失败:', response.msg);
+    }
+  } catch (error) {
+    console.error('请求错误:', error);
+  }
+};
 
-// 加载数据
-function loadFromLocalStorage() {
+// 初始化表格数据
+const loadFromLocalStorage = () => {
   const storedData = localStorage.getItem('tableData');
   if (storedData) {
     tableData.value = JSON.parse(storedData);
   } else {
-    tableData.value = [
-      {
-        时间: '2024-01-01',
-        地点: '某地',
-        损坏程度: '轻度',
-        救援人员: '张三, 李四',
-        物资: '食品, 水'
-      },
-      {
-        时间: '2024-01-02',
-        地点: '某地',
-        损坏程度: '中度',
-        救援人员: '王五, 赵六',
-        物资: '帐篷, 医疗用品'
-      }
-    ];
+    tableData.value = [];
   }
-}
+};
+
+const addDefaultRow = () => {
+  const newRow = {};
+  editableHeaders.value.forEach((header) => {
+    newRow[header] = '';
+  });
+  tableData.value.push(newRow);
+};
 
-function saveEdit(rowIndex, header, value) {
+const saveEdit = (rowIndex, header, value) => {
   tableData.value[rowIndex][header] = value;
-}
+};
 
-function saveHeader(header, newValue) {
+const saveHeader = (header, newValue) => {
   const index = editableHeaders.value.indexOf(header);
   if (index !== -1) {
     editableHeaders.value.splice(index, 1, newValue);
   }
-}
-
-function addDefaultRow() {
-  tableData.value.push({
-    时间: '',
-    地点: '',
-    损坏程度: '',
-    救援人员: '',
-    物资: ''
-  });
-}
+};
 
 const exportToExcel = () => {
   const worksheet = XLSX.utils.json_to_sheet(tableData.value);
@@ -141,16 +141,47 @@ const exportToExcel = () => {
 const handleAdd = () => console.log('批量导入');
 const handleDownloadEmptyTable = () => console.log('下载空表格');
 const handleAddRow = () => addDefaultRow();
-const handleReport = () => console.log('上报');
-
 const handleSave = () => {
-  // 保存本地状态
   localStorage.setItem('tableData', JSON.stringify(tableData.value));
   alert('数据已保存');
 };
 const handleReturn = () => {
   emits('close');
 };
+const handleReport = async () => {
+  try {
+    const mappedData = tableData.value.map((row) => {
+      const mappedRow: any = {};
+      editableHeaders.value.forEach((header) => {
+        if (row[header.field_name] !== undefined) {
+          mappedRow[header.field_name] = row[header.field_name];
+        }
+      });
+      return mappedRow;
+    });
+
+    const data = {
+      report_id: props.eventId,
+      data: mappedData
+    };
+
+    const response = await submitFill(data);
+    if (response.code === 200) {
+      alert('数据上报成功');
+    } else {
+      alert('数据上报失败: ' + response.msg);
+    }
+  } catch (error) {
+    console.error('上报数据时发生错误:', error);
+    alert('数据上报失败，请稍后再试');
+  }
+};
+// 组件挂载时调用
+onMounted(() => {
+  loadFromLocalStorage();
+  fetchHeaders();
+  addDefaultRow();
+});
 </script>
 
 <style scoped>

src/views/inspectionWork/patrolSubResult.vue

@@ -75,7 +75,7 @@
 </template>
 <script setup lang="ts">
 import { onMounted, reactive, ref } from 'vue';
-import { inspectorDivision, resultList, } from '@/api/inspectionWork/inspector';
+import { inspectorDivision, resultList } from '@/api/inspectionWork/inspector';
 import { ElMessage } from 'element-plus';
 const baseUrl = import.meta.env.VITE_APP_BASE_API;
 const downLoadApi = import.meta.env.VITE_APP_BASE_DOWNLOAD_API;