Merge remote-tracking branch 'origin/dev' into dev

src/api/comprehensiveGuarantee/reliefResourceManagement/reliefTalents.ts

@@ -0,0 +1,8 @@
+import request from '@/utils/request';
+export function getPersonnel(params) {
+  return request({
+    url: '/api/resource_provison/emergency/rescue_personnel/',
+    method: 'get',
+    params: params
+  });
+}

src/views/comprehensiveGuarantee/MaterialReserveManagement/OutboundManagement.vue

@@ -10,28 +10,138 @@
             </el-col>
           </el-row>
         </transition>
-        <el-table ref="multipleTable" v-loading="loading" :data="tableData" border :max-height="maxHeight" style="width: 96%">
-          <el-table-column label="出库单号" align="center" prop="table_id" width="150" fixed show-overflow-tooltip/>
-          <el-table-column label="仓库名称" align="center" prop="table_name" width="80" show-overflow-tooltip/>
-          <el-table-column label="出库单商品总体积(cm³）" align="center" prop="run_time" width="80" show-overflow-tooltip/>
-          <el-table-column label="出库单商品总重量(kg)" align="center" prop="filling_time" width="80" show-overflow-tooltip/>
-          <el-table-column label="出库单发货总体积(cm³)" align="center" prop="status" width="120" show-overflow-tooltip/>
-          <el-table-column label="出库单发货总重量(kg)" align="center" prop="status" width="120" show-overflow-tooltip/>
-          <el-table-column label="出库单商品总数量" align="center" prop="status" width="120" show-overflow-tooltip/>
-          <el-table-column label="出库单发货时间" align="center" prop="status" width="120" show-overflow-tooltip/>
-          <el-table-column label="灾种名称" align="center" prop="status" width="120" show-overflow-tooltip/>
-          <el-table-column label="调运机构名称" align="center" prop="status" width="120" show-overflow-tooltip/>
-          <el-table-column label="发货人姓名" align="center" prop="status" width="120" show-overflow-tooltip/>
-          <el-table-column label="发货人手机" align="center" prop="status" width="120" show-overflow-tooltip/>
-          <el-table-column label="发货人地址" align="center" prop="status" width="120" show-overflow-tooltip/>
-          <el-table-column label="发货方备注" align="center" prop="status" width="120" show-overflow-tooltip/>
-          <el-table-column label="收货人姓名" align="center" prop="status" width="120" show-overflow-tooltip/>
-          <el-table-column label="收货人手机" align="center" prop="status" width="120" show-overflow-tooltip/>
-          <el-table-column label="收货人地址" align="center" prop="status" width="120" show-overflow-tooltip/>
+        <el-table
+          ref="multipleTable"
+          v-loading="loading"
+          :data="tableData"
+          border
+          :max-height="maxHeight"
+          style="width: 96%"
+        >
+          <el-table-column
+            label="出库单号"
+            align="center"
+            prop="outboundOrderId"
+          width="150"
+          fixed
+          show-overflow-tooltip
+          />
+          <el-table-column
+            label="仓库名称"
+            align="center"
+            prop="warehouseName"
+          width="120"
+          show-overflow-tooltip
+          />
+          <el-table-column
+            label="出库单商品总体积(cm³）"
+            align="center"
+            prop="totalVolume"
+          width="120"
+          show-overflow-tooltip
+          />
+          <el-table-column
+            label="出库单商品总重量(kg)"
+            align="center"
+            prop="totalWeight"
+          width="120"
+          show-overflow-tooltip
+          />
+          <el-table-column
+            label="出库单发货总体积(cm³)"
+            align="center"
+            prop="shippedTotalVolume"
+          width="150"
+          show-overflow-tooltip
+          />
+          <el-table-column
+            label="出库单发货总重量(kg)"
+            align="center"
+            prop="shippedTotalWeight"
+          width="150"
+          show-overflow-tooltip
+          />
+          <el-table-column
+            label="出库单商品总数量"
+            align="center"
+            prop="totalQuantity"
+          width="120"
+          show-overflow-tooltip
+          />
+          <el-table-column
+            label="出库单发货时间"
+            align="center"
+            prop="shippedTime"
+          width="180"
+          show-overflow-tooltip
+          />
+          <el-table-column
+            label="灾种名称"
+            align="center"
+            prop="disasterType"
+          width="120"
+          show-overflow-tooltip
+          />
+          <el-table-column
+            label="调运机构名称"
+            align="center"
+            prop="transportationOrgName"
+          width="150"
+          show-overflow-tooltip
+          />
+          <el-table-column
+            label="发货人姓名"
+            align="center"
+            prop="shipperName"
+          width="120"
+          show-overflow-tooltip
+          />
+          <el-table-column
+            label="发货人手机"
+            align="center"
+            prop="shipperPhone"
+          width="120"
+          show-overflow-tooltip
+          />
+          <el-table-column
+            label="发货人地址"
+            align="center"
+            prop="shipperAddress"
+          width="200"
+          show-overflow-tooltip
+          />
+          <el-table-column
+            label="发货方备注"
+            align="center"
+            prop="shipperRemarks"
+          width="180"
+          show-overflow-tooltip
+          />
+          <el-table-column
+            label="收货人姓名"
+            align="center"
+            prop="recipientName"
+          width="120"
+          show-overflow-tooltip
+          />
+          <el-table-column
+            label="收货人手机"
+            align="center"
+            prop="recipientPhone"
+          width="120"
+          show-overflow-tooltip
+          />
+          <el-table-column
+            label="收货人地址"
+            align="center"
+            prop="recipientAddress"
+          width="200"
+          show-overflow-tooltip
+          />
           <el-table-column label="操作" align="center" fixed="right" width="88" class-name="small-padding fixed-width">
             <template #default="scope">
-              <el-button type="text" class="common-btn-text-primary" @click="handleWrite">查看</el-button>
-              <el-button type="text" class="common-btn-text-primary" @click="handleView">明细</el-button>
+              <el-button type="text" class="common-btn-text-primary" @click="handleWrite(scope.row)">查看</el-button>
+              <el-button type="text" class="common-btn-text-primary" @click="handleView(scope.row)">明细</el-button>
             </template>
           </el-table-column>
         </el-table>
@@ -44,8 +154,8 @@
         />
       </div>
     </div>
-    <addOutbound v-if="addOutboundState.show" @close="handleCancel" />
-    <outboundDetails v-if="outboundDetailsState.show" @close="handleCancel" />
+    <addOutbound v-if="addOutboundState.show" :event-id="addOutboundState.eventId" @close="handleCancel" />
+    <outboundDetails v-if="outboundDetailsState.show" :event-id="outboundDetailsState.eventId" @close="handleCancel" />
   </div>
 </template>
 <script setup lang="ts">
@@ -67,89 +177,53 @@ const queryParams = reactive({
 
 const tableData = [
   {
-    table_id: 1,
-    table_name: '测试表单',
-    run_time: '2024-10-15',
-    filling_time: '2024-10-15 18:00:00',
-    status: '待填报'
+    outboundOrderId: 'ORD001',
+    warehouseName: '仓库A',
+    totalVolume: '12345',
+    totalWeight: '50.0',
+    shippedTotalVolume: '11000',
+    shippedTotalWeight: '48.5',
+    totalQuantity: '100',
+    shippedTime: '2023-10-01 10:00:00',
+    disasterType: '洪水',
+    transportationOrgName: '物流公司X',
+    shipperName: '张三',
+    shipperPhone: '13800000001',
+    shipperAddress: '北京市海淀区某街道123号',
+    shipperRemarks: '请小心搬运',
+    recipientName: '李四',
+    recipientPhone: '13800000002',
+    recipientAddress: '上海市黄浦区某小区456号'
   },
   {
-    table_id: 2,
-    table_name: '应急工单数据表',
-    run_time: '2024-06-24',
-    filling_time: '2025-06-24 18:00:00',
-    status: '待填报'
+    outboundOrderId: 'ORD002',
+    warehouseName: '仓库B',
+    totalVolume: '23456',
+    totalWeight: '75.0',
+    shippedTotalVolume: '22000',
+    shippedTotalWeight: '73.0',
+    totalQuantity: '150',
+    shippedTime: '2023-10-02 14:30:00',
+    disasterType: '地震',
+    transportationOrgName: '物流公司Y',
+    shipperName: '王五',
+    shipperPhone: '13800000003',
+    shipperAddress: '广州市天河区某路789号',
+    shipperRemarks: '无特殊要求',
+    recipientName: '赵六',
+    recipientPhone: '13800000004',
+    recipientAddress: '成都市武侯区某小区101号'
   },
-  {
-    table_id: 3,
-    table_name: '安全风险通告数据表',
-    run_time: '2024-06-24',
-    filling_time: '2025-06-24 18:00:00',
-    status: '已上报'
-  },
-  {
-    table_id: 4,
-    table_name: '安全风险通告数据表',
-    run_time: '2024-06-24',
-    filling_time: '2025-06-24 18:00:00',
-    status: '已上报'
-  },
-  {
-    table_id: 5,
-    table_name: '安全风险通告数据表',
-    run_time: '2024-06-24',
-    filling_time: '2025-06-24 18:00:00',
-    status: '已上报'
-  },
-  {
-    table_id: 6,
-    table_name: '安全风险通告数据表',
-    run_time: '2024-06-24',
-    filling_time: '2025-06-24 18:00:00',
-    status: '已上报'
-  },
-  {
-    table_id: 7,
-    table_name: '安全风险通告数据表',
-    run_time: '2024-06-24',
-    filling_time: '2025-06-24 18:00:00',
-    status: '已上报'
-  },
-  {
-    table_id: 8,
-    table_name: '安全风险通告数据表',
-    run_time: '2024-06-24',
-    filling_time: '2025-06-24 18:00:00',
-    status: '已上报'
-  },
-  {
-    table_id: 9,
-    table_name: '安全风险通告数据表',
-    run_time: '2024-06-24',
-    filling_time: '2025-06-24 18:00:00',
-    status: '已上报'
-  },
-  {
-    table_id: 10,
-    table_name: '安全风险通告数据表',
-    run_time: '2024-06-24',
-    filling_time: '2025-06-24 18:00:00',
-    status: '已上报'
-  },
-  {
-    table_id: 11,
-    table_name: '安全风险通告数据表',
-    run_time: '2024-06-24',
-    filling_time: '2025-06-24 18:00:00',
-    status: '已上报'
-  }
+  // 可以根据需要添加更多数据
 ];
 
-const addOutboundState = reactive({
+let addOutboundState = reactive({
   show: false, // 初始化show为false
+  eventId: ''
 });
 const outboundDetailsState = reactive({
   show: false, // 初始化show为false
+  eventId: ''
 });
 
 const handleAdd = () => {
@@ -165,7 +239,8 @@ const handleCancel = () => {
   addOutboundState.show = false;
 };
 
-const handleWrite = () => {
+const handleWrite = (row) => {
+  outboundDetailsState.eventId = row.outboundOrderId + "";
   outboundDetailsState.show=true;
 };
 

src/views/comprehensiveGuarantee/MaterialReserveManagement/WarehouseManagement.vue

@@ -1,6 +1,148 @@
+<!--库房管理-->
 <template>
-  <!--库房管理-->
+  <div>
+    <div v-show="!addWarehouseState.show && !outboundDetailsState.show" class="app-container">
+      <div>
+        <transition name="fade">
+          <el-row :gutter="30" style="height: 50px">
+            <el-col :span="10">
+              <el-button type="primary" @click="handleAdd">新增</el-button>
+              <el-button type="primary" @click="handleAdd">数据导入</el-button>
+            </el-col>
+          </el-row>
+        </transition>
+        <el-table ref="multipleTable" v-loading="loading" :data="tableData" border :max-height="maxHeight" style="width: 96%">
+          <el-table-column label="库房名称" align="center" prop="warehouse_name" width="120" show-overflow-tooltip/>
+          <el-table-column label="所在仓库" align="center" prop="warehouse_location" width="120" show-overflow-tooltip/>
+          <el-table-column label="库房面积(平方米)" align="center" prop="warehouse_area_square_meters" width="120" show-overflow-tooltip/>
+          <el-table-column label="可用仓储面积(平方米)" align="center" prop="available_warehouse_area_square_meters" width="120" show-overflow-tooltip/>
+          <el-table-column label="高度(米)" align="center" prop="height_meters" width="120" show-overflow-tooltip/>
+          <el-table-column label="库房容积(立方米)" align="center" prop="warehouse_volume_cubic_meters" width="120" show-overflow-tooltip/>
+          <el-table-column label="可用库房容积(立方米)" align="center" prop="available_warehouse_volume_cubic_meters" width="120" show-overflow-tooltip/>
+          <el-table-column label="保管类型" align="center" prop="storage_type" width="120" show-overflow-tooltip/>
+          <el-table-column label="等级" align="center" prop="grade" width="120" show-overflow-tooltip/>
+          <el-table-column label="存放类型" align="center" prop="storage_placement_type" width="120" show-overflow-tooltip/>
+          <el-table-column label="库存确认最新时间" align="center" prop="inventory_confirmation_latest_time" width="120" show-overflow-tooltip/>
+          <el-table-column label="操作" align="center" fixed="right" width="88" class-name="small-padding fixed-width">
+            <template #default="scope">
+              <el-button type="text" class="common-btn-text-primary" @click="handleWrite">查看</el-button>
+              <el-button type="text" class="common-btn-text-primary" @click="handleView">明细</el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+        <pagination
+          v-show="total > 0"
+          v-model:page="queryParams.page"
+          v-model:limit="queryParams.pageSize"
+          :total="total"
+          @change-page="handlePaginationChange"
+        />
+      </div>
+    </div>
+    <addWarehouse v-if="addWarehouseState.show" @close="handleCancel" />
+    <outboundDetails v-if="outboundDetailsState.show" @close="handleCancel" />
+  </div>
 </template>
-<script lang="ts">
+<script setup lang="ts">
+import addWarehouse from "./addWarehouse.vue";
+import outboundDetails from "./outboundDetails.vue";
+import { ref,reactive, onMounted, onBeforeUnmount } from "vue";
+// 定义响应式变量
+const loading = ref(false);
+const maxHeight = ref(window.innerHeight * 0.8);
+const total = ref();
+// 处理窗口大小变化
+const handleResize = () => {
+  maxHeight.value = window.innerHeight * 0.8;
+};
+const queryParams = reactive({
+  page: '1',
+  pageSize: '10',
+});
+
+const tableData = [
+  {
+    warehouse_name: "一号库房",
+    warehouse_location: "北京市海淀区",
+    warehouse_area_square_meters: 5000,
+    available_warehouse_area_square_meters: 4000,
+    height_meters: 10,
+    warehouse_volume_cubic_meters: 50000,
+    available_warehouse_volume_cubic_meters: 40000,
+    storage_type: "常温保管",
+    grade: "A级",
+    storage_placement_type: "地面堆放",
+    inventory_confirmation_latest_time: "2023-10-01 14:30:00"
+  },
+  {
+    warehouse_name: "二号库房",
+    warehouse_location: "上海市浦东新区",
+    warehouse_area_square_meters: 3000,
+    available_warehouse_area_square_meters: 2500,
+    height_meters: 8,
+    warehouse_volume_cubic_meters: 24000,
+    available_warehouse_volume_cubic_meters: 20000,
+    storage_type: "冷藏保管",
+    grade: "B级",
+    storage_placement_type: "货架存放",
+    inventory_confirmation_latest_time: "2023-09-25 10:15:00"
+  },
+  {
+    warehouse_name: "三号库房",
+    warehouse_location: "广州市天河区",
+    warehouse_area_square_meters: 2000,
+    available_warehouse_area_square_meters: 1800,
+    height_meters: 6,
+    warehouse_volume_cubic_meters: 12000,
+    available_warehouse_volume_cubic_meters: 10800,
+    storage_type: "特殊保管",
+    grade: "C级",
+    storage_placement_type: "托盘存放",
+    inventory_confirmation_latest_time: "2023-09-20 08:45:00"
+  },
+  // 可以继续添加更多测试数据...
+];
+
+const addWarehouseState = reactive({
+  show: false, // 初始化show为false
+});
+const outboundDetailsState = reactive({
+  show: false, // 初始化show为false
+});
+
+const handleAdd = () => {
+  addWarehouseState.show = true;
+};
+
+const upload = () => {
+  // 这里可能需要实现上传逻辑，暂时只是显示WriteForm作为示例
+  addGodownState.show = true;
+};
+
+const handleCancel = () => {
+  addWarehouseState.show = false;
+};
+
+const handleWrite = () => {
+  outboundDetailsState.show=true;
+};
+
+const handleView = () => {
+  outboundDetailsState.show=true;
+};
+
+const handlePaginationChange = (page: number) => {
+  queryParams.page = page;
+  // fetchTableData(); //
+};
+
+onMounted(() => {
+  window.addEventListener('resize', handleResize);
+});
+
+// 在组件卸载前移除窗口大小变化监听器
+onBeforeUnmount(() => {
+  window.removeEventListener('resize', handleResize);
+});
 </script>
 <style lang="scss" scoped></style>

src/views/comprehensiveGuarantee/MaterialReserveManagement/addOutbound.vue

@@ -7,15 +7,15 @@
       </div>
       <div class="common-dialog-box">
         <el-form ref="eventFormRef" :model="form" :rules="rules" label-width="80px">
-          <el-form-item label="出库单号：" prop="event_title">
+          <el-form-item label="出库单号：" prop="table_id">
             <el-input v-model="form.event_title" placeholder="请输入出库单号" style="width: 468px !important" />
           </el-form-item>
 
-          <el-form-item label="仓库名称：" prop="event_source">
+          <el-form-item label="仓库名称：" prop="table_name">
             <el-input v-model="form.event_source" placeholder="请输入仓库名称" style="width: 468px !important" />
           </el-form-item>
 
-          <el-form-item label="出库单商品总体积(cm³)：" prop="event_source">
+          <el-form-item label="出库单商品总体积(cm³)：" prop="run_time">
             <el-input v-model="form.event_source" placeholder="请输入出库单商品总体积" style="width: 468px !important" />
           </el-form-item>
 

src/views/comprehensiveGuarantee/MaterialReserveManagement/addWarehouse.vue

@@ -0,0 +1,121 @@
+<template>
+  <div class="common-dialog">
+    <div class="common-dialog-content">
+      <div class="common-dialog-title-box">
+        <i class="common-dialog-title-icon" />
+        <div>新增出库单</div>
+      </div>
+      <div class="common-dialog-box">
+        <el-form ref="eventFormRef" :model="form" :rules="rules" label-width="120px">
+          <el-form-item label="库房名称：" prop="warehouse_name">
+            <el-input v-model="form.warehouse_name" placeholder="请输入库房名称" style="width: 468px !important" />
+          </el-form-item>
+
+          <el-form-item label="所在仓库：" prop="warehouse_location">
+            <el-input v-model="form.warehouse_location" placeholder="请输入所在仓库" style="width: 468px !important" />
+          </el-form-item>
+
+          <el-form-item label="库房面积(平方米)：" prop="warehouse_area_square_meters">
+            <el-input v-model="form.warehouse_area_square_meters" type="number" placeholder="请输入库房面积(平方米)" style="width: 468px !important" />
+          </el-form-item>
+
+          <el-form-item label="可用仓储面积(平方米)：" prop="available_warehouse_area_square_meters">
+            <el-input v-model="form.available_warehouse_area_square_meters" type="number" placeholder="请输入可用仓储面积(平方米)" style="width: 468px !important" />
+          </el-form-item>
+
+          <el-form-item label="高度(米)：" prop="height_meters">
+            <el-input v-model="form.height_meters" type="number" placeholder="请输入高度(米)" style="width: 468px !important" />
+          </el-form-item>
+
+          <el-form-item label="库房容积(立方米)：" prop="warehouse_volume_cubic_meters">
+            <el-input v-model="form.warehouse_volume_cubic_meters" type="number" placeholder="请输入库房容积(立方米)" style="width: 468px !important" />
+          </el-form-item>
+
+          <el-form-item label="可用库房容积(立方米)：" prop="available_warehouse_volume_cubic_meters">
+            <el-input v-model="form.available_warehouse_volume_cubic_meters" type="number" placeholder="请输入可用库房容积(立方米)" style="width: 468px !important" />
+          </el-form-item>
+
+          <el-form-item label="保管类型：" prop="storage_type">
+            <el-input v-model="form.storage_type" placeholder="请输入保管类型" style="width: 468px !important" />
+            <!-- 注意：如果保管类型是固定选项，则可以使用el-select -->
+          </el-form-item>
+
+          <el-form-item label="等级：" prop="grade">
+            <el-input v-model="form.grade" placeholder="请输入等级" style="width: 468px !important" />
+            <!-- 注意：如果等级是固定选项（如A/B/C），则可以使用el-select -->
+          </el-form-item>
+
+          <el-form-item label="存放类型：" prop="storage_placement_type">
+            <el-input v-model="form.storage_placement_type" placeholder="请输入存放类型" style="width: 468px !important" />
+          </el-form-item>
+
+          <el-form-item label="库存确认最新时间：" prop="inventory_confirmation_latest_time">
+            <el-date-picker
+              v-model="form.inventory_confirmation_latest_time"
+              type="datetime"
+              placeholder="请选择库存确认最新时间"
+              style="width: 468px !important"
+            />
+          </el-form-item>
+        </el-form>
+        <div class="common-dialog-footer">
+          <el-button @click="closeDialog">取消</el-button>
+          <el-button :loading="buttonLoading" type="primary" @click="submitForm">确定</el-button>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+<script setup lang="ts">
+import { ref, reactive, toRefs } from 'vue';
+const emits = defineEmits(['close']);
+const buttonLoading = ref(false);
+// 表单初始数据
+const initFormData = {
+    warehouse_name: '',
+    warehouse_location: '',
+    warehouse_area_square_meters: '',
+    available_warehouse_area_square_meters: '',
+    height_meters: '',
+    warehouse_volume_cubic_meters: '',
+    available_warehouse_volume_cubic_meters: '',
+    storage_type: '',
+    grade: '',
+    storage_placement_type: '',
+    inventory_confirmation_latest_time: ''
+  };
+
+// 表单数据
+const data = reactive({
+  form: { ...initFormData },
+  rules: {
+    event_title: [{ required: true, message: '事件标题不能为空', trigger: 'blur' }],
+    event_type: [{ required: true, message: '事件类型不能为空', trigger: 'blur' }],
+    event_level: [{ required: true, message: '事件等级不能为空', trigger: 'blur' }],
+    event_status: [{ required: true, message: '事件状态不能为空', trigger: 'blur' }],
+    address: [{ required: true, message: '事件地点不能为空', trigger: 'blur' }],
+    event_time: [{ required: true, message: '事发时间不能为空', trigger: 'blur' }],
+    report_time: [{ required: true, message: '上报时间不能为空', trigger: 'blur' }],
+    event_source: [{ required: true, message: '事件来源不能为空', trigger: 'blur' }],
+    event_description: [{ required: true, message: '事件描述不能为空', trigger: 'blur' }],
+    contact: [{ required: true, message: '联系方式不能为空', trigger: 'blur' }]
+  }
+});
+
+const { form, rules } = toRefs(data);
+
+const closeDialog = () => {
+  emits('close');
+};
+const submitForm = () => {
+}
+</script>
+
+<style lang="scss" scoped>
+.flex {
+  display: flex;
+  span {
+    white-space: nowrap;
+  }
+}
+</style>

src/views/comprehensiveGuarantee/MaterialReserveManagement/outboundDetails.vue

@@ -6,56 +6,56 @@
       </div>
       <div class="common-dialog-box">
         <el-form ref="form" :model="formData" :rules="rules" label-width="120px">
-          <el-form-item label="出库单号：" prop="name">
-            <el-input v-model="formData.name" style="width: 468px !important" disabled />
+          <el-form-item label="出库单号：" prop="outStockNumber">
+            <el-input v-model="formData.outStockNumber" style="width: 468px" />
           </el-form-item>
-          <el-form-item label="仓库名称：" prop="county">
-            <el-input v-model="formData.county" style="width: 468px !important" disabled />
+          <el-form-item label="仓库名称：" prop="warehouseName">
+            <el-input v-model="formData.warehouseName" style="width: 468px" />
           </el-form-item>
-          <el-form-item label="出库单商品总体积(cm³)：" prop="expert_type">
-            <el-input v-model="formData.expert_type" style="width: 468px !important" disabled />
+          <el-form-item label="出库单商品总体积(cm³)：" prop="totalVolume">
+            <el-input v-model="formData.totalVolume" style="width: 468px" />
           </el-form-item>
-          <el-form-item label="出库单商品总重量(kg)：" prop="position">
-            <el-input v-model="formData.position" style="width: 468px !important" disabled />
+          <el-form-item label="出库单商品总重量(kg)：" prop="totalWeight">
+            <el-input v-model="formData.totalWeight" style="width: 468px" />
           </el-form-item>
-          <el-form-item label="出库单发货总体积(cm³)：" prop="unit">
-            <el-input v-model="formData.unit" style="width: 468px !important" disabled />
+          <el-form-item label="出库单发货总体积(cm³)：" prop="shipmentTotalVolume">
+            <el-input v-model="formData.shipmentTotalVolume" style="width: 468px" />
           </el-form-item>
-          <el-form-item label="出库单发货总重量(kg)：" prop="phone">
-            <el-input v-model="formData.phone" style="width: 468px !important" disabled />
+          <el-form-item label="出库单发货总重量(kg)：" prop="shipmentTotalWeight">
+            <el-input v-model="formData.shipmentTotalWeight" style="width: 468px" />
           </el-form-item>
-          <el-form-item label="出库单商品总数量：" prop="address">
-            <el-input v-model="formData.address" style="width: 468px !important" disabled />
+          <el-form-item label="出库单商品总数量：" prop="totalQuantity">
+            <el-input v-model="formData.totalQuantity" style="width: 468px" />
           </el-form-item>
-          <el-form-item label="出库单发货时间：" prop="status">
-            <el-input v-model="formData.status" style="width: 468px !important" disabled />
+          <el-form-item label="出库单发货时间：" prop="shipmentDate">
+            <el-input v-model="formData.shipmentDate" style="width: 468px" />
           </el-form-item>
-          <el-form-item label="灾种名称：" prop="accident_type">
-            <el-input v-model="formData.accident_type" style="width: 468px !important" disabled />
+          <el-form-item label="灾种名称：" prop="disasterType">
+            <el-input v-model="formData.disasterType" style="width: 468px" />
           </el-form-item>
-          <el-form-item label="调运机构名称：" prop="rescue_experience">
-            <el-input v-model="formData.rescue_experience" style="width: 468px !important" disabled />
+          <el-form-item label="调运机构名称：" prop="transportationOrgName">
+            <el-input v-model="formData.transportationOrgName" style="width: 468px" />
           </el-form-item>
-          <el-form-item label="发货人姓名：" prop="birthdate">
-            <el-input v-model="formData.birthdate" style="width: 468px !important" disabled />
+          <el-form-item label="发货人姓名：" prop="shipperName">
+            <el-input v-model="formData.shipperName" style="width: 468px" />
           </el-form-item>
-          <el-form-item label="发货人手机：" prop="work_date">
-            <el-input v-model="formData.work_date" style="width: 468px !important" disabled />
+          <el-form-item label="发货人手机：" prop="shipperPhone">
+            <el-input v-model="formData.shipperPhone" style="width: 468px" />
           </el-form-item>
-          <el-form-item label="发货人地址：" prop="work_date">
-            <el-input v-model="formData.work_date" style="width: 468px !important" disabled />
+          <el-form-item label="发货人地址：" prop="shipperAddress">
+            <el-input v-model="formData.shipperAddress" style="width: 468px" />
           </el-form-item>
-          <el-form-item label="发货方备注：" prop="work_date">
-            <el-input v-model="formData.work_date" style="width: 468px !important" disabled />
+          <el-form-item label="发货方备注：" prop="shipperRemark">
+            <el-input v-model="formData.shipperRemark" style="width: 468px" />
           </el-form-item>
-          <el-form-item label="收货人姓名：" prop="work_date">
-            <el-input v-model="formData.work_date" style="width: 468px !important" disabled />
+          <el-form-item label="收货人姓名：" prop="receiverName">
+            <el-input v-model="formData.receiverName" style="width: 468px" />
           </el-form-item>
-          <el-form-item label="收货人手机：" prop="work_date">
-            <el-input v-model="formData.work_date" style="width: 468px !important" disabled />
+          <el-form-item label="收货人手机：" prop="receiverPhone">
+            <el-input v-model="formData.receiverPhone" style="width: 468px" />
           </el-form-item>
-          <el-form-item label="收货人地址：" prop="work_date">
-            <el-input v-model="formData.work_date" style="width: 468px !important" disabled />
+          <el-form-item label="收货人地址：" prop="receiverAddress">
+            <el-input v-model="formData.receiverAddress" style="width: 468px" />
           </el-form-item>
         </el-form>
         <div class="common-dialog-footer">
@@ -68,31 +68,40 @@
 
 <script setup lang="ts">
 import { ref, watch } from 'vue';
+import {updatetask} from "@/api/inspectionWork/inspector";
+import {ElMessage} from "element-plus";
 
 const emits = defineEmits(['close']);
+const closeDialog = () => {
+  emits('close');
+};
 const props = defineProps<{
   eventId: string | number;
 }>();
 
+
 // 模拟的数据
-const formData = ref({
-  name: '张三',
-  county: '朝阳区',
-  expert_type: '安全工程',
-  position: '高级工程师',
-  unit: '北京市应急管理局',
-  phone: '13800138000',
-  address: '北京市朝阳区XX路XX号',
-  status: '在职',
-  accident_type: '火灾、爆炸',
-  rescue_experience: '参与过多次重大事故救援，经验丰富。',
-  birthdate: '1975-05-20',
-  work_date: '2000-01-01'
+let formData = ref({
+  outStockNumber: '',
+  warehouseName: '',
+  totalVolume: '',
+  totalWeight: '',
+  shipmentTotalVolume: '',
+  shipmentTotalWeight: '',
+  totalQuantity: '',
+  shipmentDate: '',
+  disasterType: '',
+  transportationOrgName: '',
+  shipperName: '',
+  shipperPhone: '',
+  shipperAddress: '',
+  shipperRemark: '',
+  receiverName: '',
+  receiverPhone: '',
+  receiverAddress: '',
 });
 
-const closeDialog = () => {
-  emits('close');
-};
+
 </script>
 
 <style scoped></style>

src/views/comprehensiveGuarantee/materialReserves/materialsDeclaration.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="app-container">
-    <div v-show="!materialsDeclarationViewState.show && !materialsDeclarationEidtState.show && !materialsDeclarationAddState.show">
+    <div v-show="!materialsDeclarationViewState.show && !materialsDistributionEditState.show && !materialsDeclarationAddState.show">
       <h1>物资储备管理</h1>
       <el-row :gutter="10" class="mb8">
         <el-col :span="1.5">
@@ -35,10 +35,10 @@
         @pagination="fetchWorkrData"
       />
     </div>
+    <MaterialsDeclarationView v-if="materialsDeclarationViewState.show" :event-id="materialsDeclarationViewState.eventId" @close="handleCancel" />
+    <MaterialsDistributionEdit v-if="materialsDistributionEditState.show" :event-id="materialsDistributionEditState.eventId" @close="handleCancel" />
+    <MaterialsDeclarationAdd v-if="materialsDeclarationAddState.show" @close="handleCancel" />
   </div>
-  <MaterialsDeclarationView v-if="materialsDeclarationViewState.show" :event-id="materialsDeclarationViewState.eventId" @close="handleCancel" />
-  <MaterialsDeclarationEidt v-if="materialsDeclarationEidtState.show" :event-id="materialsDeclarationEidtState.eventId" @close="handleCancel" />
-  <MaterialsDeclarationAdd v-if="materialsDeclarationAddState.show" @close="handleCancel" />
 </template>
 
 <script setup lang="ts">
@@ -47,7 +47,7 @@ import { ElTable, ElTableColumn, ElForm, ElFormItem, ElInput, ElButton, ElText }
 import { ComponentInternalInstance, getCurrentInstance } from 'vue';
 import Pagination from '@/components/Pagination/index.vue'; // 假设这是分页组件的路径
 import MaterialsDeclarationView from './materialsDeclarationView.vue'; // 查看详情组件
-import MaterialsDeclarationEidt from './materialsDeclarationEidt.vue'; // 编辑组件
+import MaterialsDistributionEdit from './materialsDistributionEdit.vue'; // 编辑组件
 import MaterialsDeclarationAdd from './materialsDeclarationAdd.vue'; // 编辑组件
 const loading = ref(true);
 const showSearch = ref(true);
@@ -83,7 +83,7 @@ const mockData = [
     declaration_date: '2024-10-29 12:23:00',
     amount_declared: 1000,
     application_unit: '茂名市应急管理局',
-    declarant: '张三',
+    declarant: 'XX',
     approval_status: '未审批'
   },
   {
@@ -91,7 +91,7 @@ const mockData = [
     declaration_date: '2024-10-30 12:23:00',
     amount_declared: 1001,
     application_unit: '茂名市应急管理局',
-    declarant: '李四',
+    declarant: 'XX',
     approval_status: '审批通过'
   },
   {
@@ -99,7 +99,7 @@ const mockData = [
     declaration_date: '2024-10-31 12:23:00',
     amount_declared: 1002,
     application_unit: '茂名市应急管理局',
-    declarant: '王五',
+    declarant: 'XX',
     approval_status: '审批不通过'
   }
 ];
@@ -127,7 +127,7 @@ let materialsDeclarationViewState = reactive({
   eventId: ''
 });
 
-let materialsDeclarationEidtState = reactive({
+let materialsDistributionEditState = reactive({
   show: false,
   eventId: ''
 });
@@ -145,13 +145,13 @@ const handleView = (row: any) => {
 };
 
 const handleUpdate = (row: any) => {
-  materialsDeclarationEidtState.eventId = row.id;
-  materialsDeclarationEidtState.show = true;
+  materialsDistributionEditState.eventId = row.id;
+  materialsDistributionEditState.show = true;
 };
 
 const handleCancel = () => {
   materialsDeclarationViewState.show = false;
-  materialsDeclarationEidtState.show = false;
+  materialsDistributionEditState.show = false;
   materialsDeclarationAddState.show = false;
 };
 

src/views/comprehensiveGuarantee/materialReserves/materialsDeclarationEidt.vue

@@ -3,7 +3,9 @@
     <el-row :gutter="20">
       <el-col :span="6">
         <h2>编辑</h2>
-        <p class="report-period">申报金额：20000.00元</p>
+        <el-form-item label="调度目的：">
+          <el-input v-model="queryParams.purpose" placeholder="请输入内容" clearable></el-input>
+        </el-form-item>
       </el-col>
       <el-col :lg="24" :xs="24">
         <el-table :data="tableData" border height="400">
@@ -42,23 +44,13 @@
               ></span>
             </template>
           </el-table-column>
-          <el-table-column label="物资单价（元）" prop="unitPrice">
+          <el-table-column label="物资用途" prop="materials">
             <template #default="{ row, $index }">
               <span
                 class="editable-span"
                 contenteditable="true"
-                @blur="saveEdit($index, 'unitPrice', $event.target.innerText)"
-                v-text="row.unitPrice"
-              ></span>
-            </template>
-          </el-table-column>
-          <el-table-column label="物资用途" prop="purpose">
-            <template #default="{ row, $index }">
-              <span
-                class="editable-span"
-                contenteditable="true"
-                @blur="saveEdit($index, 'purpose', $event.target.innerText)"
-                v-text="row.purpose"
+                @blur="saveEdit($index, 'materials', $event.target.innerText)"
+                v-text="row.materials"
               ></span>
             </template>
           </el-table-column>
@@ -84,42 +76,42 @@
 <script setup lang="ts">
 import { ref, onMounted } from 'vue';
 import { ElTable, ElButton, ElCol, ElRow, ElTableColumn } from 'element-plus';
-import { defineProps, defineEmits } from 'vue';
+import axios from 'axios'; // 引入axios
 
+// 定义父组件传递的属性
 const props = defineProps({
   eventId: String
 });
 
+// 定义子组件触发的事件
 const emits = defineEmits(['close']);
 
-const tableData = ref<any[]>([]);
+// 定义查询参数对象，包含调度目的
+const queryParams = ref({
+  purpose: '' // 调度目的
+});
 
-const loadFromLocalStorage = () => {
-  const storedData = localStorage.getItem('tableData');
-  if (storedData) {
-    tableData.value = JSON.parse(storedData);
-  } else {
-    tableData.value = [
-      { materialType: '三防物资', materialName: '雨衣', quantity: '100', unitPrice: '5.00', purpose: '2025年汛期储备' },
-      { materialType: '三防物资', materialName: '水鞋', quantity: '10', unitPrice: '5000.00', purpose: '2025年汛期储备' },
-      { materialType: '三防物资', materialName: '雨伞', quantity: '50', unitPrice: '100.00', purpose: '2025年汛期储备' }
-    ];
-  }
-};
+// 表格数据
+const tableData = ref([
+  { materialType: '三防物资', materialName: '雨衣', quantity: '100', materials: '高州泰利台风前置' },
+  { materialType: '三防物资', materialName: '水鞋', quantity: '10', materials: '高州泰利台风前置' },
+  { materialType: '三防物资', materialName: '雨伞', quantity: '50', materials: '高州泰利台风前置' }
+]);
 
+// 添加默认行
 const addDefaultRow = () => {
   const newRow = {
     materialType: '',
     materialName: '',
     quantity: '',
-    unitPrice: '',
-    purpose: ''
+    materials: ''
   };
   tableData.value.push(newRow);
 };
 
+// 保存编辑
 const saveEdit = (index: number, key: string, value: string) => {
-  if (key === 'quantity' || key === 'unitPrice') {
+  if (key === 'quantity') {
     const numValue = parseFloat(value);
     if (isNaN(numValue)) {
       return;
@@ -127,22 +119,29 @@ const saveEdit = (index: number, key: string, value: string) => {
     value = numValue.toString();
   }
   tableData.value[index][key] = value;
-  localStorage.setItem('tableData', JSON.stringify(tableData.value));
 };
 
+// 处理新增一行
 const handleAddRow = () => addDefaultRow();
 
+// 处理返回
 const handleReturn = () => {
   emits('close');
 };
 
-const handleSave = () => {
-  // 这里可以添加保存到服务器的逻辑
-  console.log('数据已保存:', tableData.value);
+// 处理保存
+const handleSave = async () => {
+  try {
+    const response = await axios.post('/api/submitData', { data: tableData.value, purpose: queryParams.value.purpose });
+    console.log('数据已成功提交:', response.data);
+  } catch (error) {
+    console.error('提交数据时发生错误:', error);
+  }
 };
 
+// 页面加载完成后执行
 onMounted(() => {
-  loadFromLocalStorage();
+  // 如果需要从后端加载数据，可以在这里调用相应的API
 });
 </script>
 

src/views/comprehensiveGuarantee/materialReserves/materialsDeclarationView.vue

@@ -34,7 +34,7 @@
 </template>
 
 <script setup lang="ts">
-import { ref, onMounted } from 'vue';
+import { ref } from 'vue';
 import { ElTable, ElButton, ElCol, ElRow, ElTableColumn } from 'element-plus';
 import { defineProps, defineEmits } from 'vue';
 
@@ -44,31 +44,18 @@ const props = defineProps({
 
 const emits = defineEmits(['close']);
 
-const tableData = ref<any[]>([]);
-const approvalStatus = ref('待审批'); // 初始状态设为待审批
+// 静态数据
+const tableData = ref([
+  { materialType: '三防物资', materialName: '雨衣', quantity: '100', unitPrice: '5.00', purpose: '2025年汛期储备' },
+  { materialType: '三防物资', materialName: '水鞋', quantity: '10', unitPrice: '5000.00', purpose: '2025年汛期储备' },
+  { materialType: '三防物资', materialName: '雨伞', quantity: '50', unitPrice: '100.00', purpose: '2025年汛期储备' }
+]);
+
+const approvalStatus = ref('待审批');
 
-const loadFromLocalStorage = () => {
-  const storedData = localStorage.getItem('tableData');
-  const storedApprovalStatus = localStorage.getItem('approvalStatus');
-  if (storedData) {
-    tableData.value = JSON.parse(storedData);
-  } else {
-    tableData.value = [
-      { materialType: '三防物资', materialName: '雨衣', quantity: '100', unitPrice: '5.00', purpose: '2025年汛期储备' },
-      { materialType: '三防物资', materialName: '水鞋', quantity: '10', unitPrice: '5000.00', purpose: '2025年汛期储备' },
-      { materialType: '三防物资', materialName: '雨伞', quantity: '50', unitPrice: '100.00', purpose: '2025年汛期储备' }
-    ];
-  }
-  if (storedApprovalStatus) {
-    approvalStatus.value = storedApprovalStatus;
-  }
-};
 const handleReturn = () => {
   emits('close');
 };
-onMounted(() => {
-  loadFromLocalStorage();
-});
 </script>
 
 <style scoped>

src/views/comprehensiveGuarantee/materialReserves/materialsDistribution.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="app-container">
-    <div v-show="!materialsDeclarationViewState.show && !materialsDeclarationEidtState.show && !materialsDistributionAddState.show">
+    <div v-show="!materialsDistributionViewState.show && !materialsDeclarationEidtState.show && !materialsDistributionAddState.show">
       <h1>物资储备管理</h1>
       <el-row :gutter="10" class="mb8">
         <el-col :span="1.5">
@@ -35,10 +35,10 @@
         @pagination="fetchWorkrData"
       />
     </div>
+    <MaterialsDistributionView v-if="materialsDistributionViewState.show" :event-id="materialsDistributionViewState.eventId" @close="handleCancel" />
+    <MaterialsDeclarationEidt v-if="materialsDeclarationEidtState.show" :event-id="materialsDeclarationEidtState.eventId" @close="handleCancel" />
+    <MaterialsDistributionAdd v-if="materialsDistributionAddState.show" @close="handleCancel" />
   </div>
-  <MaterialsDeclarationView v-if="materialsDeclarationViewState.show" :event-id="materialsDeclarationViewState.eventId" @close="handleCancel" />
-  <MaterialsDeclarationEidt v-if="materialsDeclarationEidtState.show" :event-id="materialsDeclarationEidtState.eventId" @close="handleCancel" />
-  <MaterialsDistributionAdd v-if="materialsDistributionAddState.show" @close="handleCancel" />
 </template>
 
 <script setup lang="ts">
@@ -46,7 +46,7 @@ import { onMounted, reactive, ref, toRefs } from 'vue';
 import { ElTable, ElTableColumn, ElButton, ElText } from 'element-plus';
 import { ComponentInternalInstance, getCurrentInstance } from 'vue';
 import Pagination from '@/components/Pagination/index.vue'; // 假设这是分页组件的路径
-import MaterialsDeclarationView from './materialsDeclarationView.vue'; // 查看详情组件
+import MaterialsDistributionView from './materialsDistributionView.vue'; // 查看详情组件
 import MaterialsDeclarationEidt from './materialsDeclarationEidt.vue'; // 编辑组件
 import MaterialsDistributionAdd from './materialsDistributionAdd.vue'; // 编辑组件
 const loading = ref(true);
@@ -122,7 +122,7 @@ const resetQuery = () => {
   handleQuery();
 };
 
-let materialsDeclarationViewState = reactive({
+let materialsDistributionViewState = reactive({
   show: false,
   eventId: ''
 });
@@ -140,8 +140,8 @@ const handleAdd = () => {
   materialsDistributionAddState.show = true;
 };
 const handleView = (row: any) => {
-  materialsDeclarationViewState.eventId = row.id;
-  materialsDeclarationViewState.show = true;
+  materialsDistributionViewState.eventId = row.id;
+  materialsDistributionViewState.show = true;
 };
 
 const handleUpdate = (row: any) => {
@@ -150,7 +150,7 @@ const handleUpdate = (row: any) => {
 };
 
 const handleCancel = () => {
-  materialsDeclarationViewState.show = false;
+  materialsDistributionViewState.show = false;
   materialsDeclarationEidtState.show = false;
   materialsDistributionAddState.show = false;
 };

src/views/comprehensiveGuarantee/materialReserves/materialsDistributionEdit.vue

@@ -0,0 +1,174 @@
+<template>
+  <div class="app-container p-2">
+    <el-row :gutter="20">
+      <el-col :span="6">
+        <h2>编辑</h2>
+        <p class="report-period">申报金额：20000.00元</p>
+      </el-col>
+      <el-col :lg="24" :xs="24">
+        <el-table :data="tableData" border height="400">
+          <el-table-column label="序号" prop="seqNo" width="80">
+            <template #default="{ $index }">
+              <span>{{ $index + 1 }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column label="物资类型" prop="materialType">
+            <template #default="{ row, $index }">
+              <span
+                class="editable-span"
+                contenteditable="true"
+                @blur="saveEdit($index, 'materialType', $event.target.innerText)"
+                v-text="row.materialType"
+              ></span>
+            </template>
+          </el-table-column>
+          <el-table-column label="物资名称" prop="materialName">
+            <template #default="{ row, $index }">
+              <span
+                class="editable-span"
+                contenteditable="true"
+                @blur="saveEdit($index, 'materialName', $event.target.innerText)"
+                v-text="row.materialName"
+              ></span>
+            </template>
+          </el-table-column>
+          <el-table-column label="物资数量（件）" prop="quantity">
+            <template #default="{ row, $index }">
+              <span
+                class="editable-span"
+                contenteditable="true"
+                @blur="saveEdit($index, 'quantity', $event.target.innerText)"
+                v-text="row.quantity"
+              ></span>
+            </template>
+          </el-table-column>
+          <el-table-column label="物资单价（元）" prop="unitPrice">
+            <template #default="{ row, $index }">
+              <span
+                class="editable-span"
+                contenteditable="true"
+                @blur="saveEdit($index, 'unitPrice', $event.target.innerText)"
+                v-text="row.unitPrice"
+              ></span>
+            </template>
+          </el-table-column>
+          <el-table-column label="物资用途" prop="purpose">
+            <template #default="{ row, $index }">
+              <span
+                class="editable-span"
+                contenteditable="true"
+                @blur="saveEdit($index, 'purpose', $event.target.innerText)"
+                v-text="row.purpose"
+              ></span>
+            </template>
+          </el-table-column>
+        </el-table>
+      </el-col>
+      <div class="common-dialog-footer" style="width: 100%; justify-content: center; display: flex">
+        <el-row :span="24" :gutter="10" class="mb8">
+          <el-col :span="1.5">
+            <el-button type="primary" @click="handleAddRow">新增一项</el-button>
+          </el-col>
+          <el-col :span="1.5">
+            <el-button type="primary" @click="handleSave">提交</el-button>
+          </el-col>
+          <el-col :span="1.5">
+            <el-button type="danger" @click="handleReturn">取消</el-button>
+          </el-col>
+        </el-row>
+      </div>
+    </el-row>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref, onMounted } from 'vue';
+import { ElTable, ElButton, ElCol, ElRow, ElTableColumn } from 'element-plus';
+import axios from 'axios'; // 引入axios
+
+const props = defineProps({
+  eventId: String
+});
+
+const emits = defineEmits(['close']);
+
+const tableData = ref([
+  { materialType: '三防物资', materialName: '雨衣', quantity: '100', unitPrice: '5.00', purpose: '2025年汛期储备' },
+  { materialType: '三防物资', materialName: '水鞋', quantity: '10', unitPrice: '5000.00', purpose: '2025年汛期储备' },
+  { materialType: '三防物资', materialName: '雨伞', quantity: '50', unitPrice: '100.00', purpose: '2025年汛期储备' }
+]);
+
+const addDefaultRow = () => {
+  const newRow = {
+    materialType: '',
+    materialName: '',
+    quantity: '',
+    unitPrice: '',
+    purpose: ''
+  };
+  tableData.value.push(newRow);
+};
+
+const saveEdit = (index: number, key: string, value: string) => {
+  if (key === 'quantity' || key === 'unitPrice') {
+    const numValue = parseFloat(value);
+    if (isNaN(numValue)) {
+      return;
+    }
+    value = numValue.toString();
+  }
+  tableData.value[index][key] = value;
+};
+
+const handleAddRow = () => addDefaultRow();
+
+const handleReturn = () => {
+  emits('close');
+};
+
+const handleSave = async () => {
+  try {
+    const response = await axios.post('/api/submitData', { data: tableData.value });
+    console.log('数据已成功提交:', response.data);
+  } catch (error) {
+    console.error('提交数据时发生错误:', error);
+  }
+};
+
+onMounted(() => {
+  // 如果需要从后端加载数据，可以在这里调用相应的API
+});
+</script>
+
+<style scoped>
+.app-container {
+  font-family: Avenir, Helvetica, Arial, sans-serif;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  text-align: center;
+  color: #2c3e50;
+}
+.report-period {
+  margin-top: 10px;
+  font-size: 14px;
+  color: #606266;
+}
+.editable-span {
+  cursor: pointer;
+  display: inline-block;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+.editable-span[contenteditable='true'] {
+  white-space: normal;
+  outline: none; /* 移除编辑时的焦点边框 */
+}
+.editable-span[contenteditable='true']:empty::before {
+  content: attr(data-placeholder); /* 可选：为空时显示占位符 */
+  color: #999;
+}
+.common-dialog-footer {
+  margin-top: 20px;
+}
+</style>

src/views/comprehensiveGuarantee/materialReserves/materialsDistributionView.vue

@@ -0,0 +1,83 @@
+<template>
+  <div class="common-dialog">
+    <div class="common-dialog-content">
+      <div class="common-dialog-title-box">
+        <h3 class="common-dialog-title">查看详情</h3>
+      </div>
+      <div class="common-dialog-box">
+        <el-form ref="form" :model="formData" :rules="rules" label-width="120px">
+          <el-form-item label="姓名：" prop="name">
+            <el-input v-model="formData.name" style="width: 468px !important" disabled />
+          </el-form-item>
+          <el-form-item label="所属区县：" prop="county">
+            <el-input v-model="formData.county" style="width: 468px !important" disabled />
+          </el-form-item>
+          <el-form-item label="专家类型：" prop="expert_type">
+            <el-input v-model="formData.expert_type" style="width: 468px !important" disabled />
+          </el-form-item>
+          <el-form-item label="职位：" prop="position">
+            <el-input v-model="formData.position" style="width: 468px !important" disabled />
+          </el-form-item>
+          <el-form-item label="单位：" prop="unit">
+            <el-input v-model="formData.unit" style="width: 468px !important" disabled />
+          </el-form-item>
+          <el-form-item label="联系电话：" prop="phone">
+            <el-input v-model="formData.phone" style="width: 468px !important" disabled />
+          </el-form-item>
+          <el-form-item label="现在地址：" prop="address">
+            <el-input v-model="formData.address" style="width: 468px !important" disabled />
+          </el-form-item>
+          <el-form-item label="状态：" prop="status">
+            <el-input v-model="formData.status" style="width: 468px !important" disabled />
+          </el-form-item>
+          <el-form-item label="擅长事故类型：" prop="accident_type">
+            <el-input v-model="formData.accident_type" style="width: 468px !important" disabled />
+          </el-form-item>
+          <el-form-item label="救援经历：" prop="rescue_experience">
+            <el-input v-model="formData.rescue_experience" style="width: 468px !important" disabled />
+          </el-form-item>
+          <el-form-item label="出生日期：" prop="birthdate">
+            <el-input v-model="formData.birthdate" style="width: 468px !important" disabled />
+          </el-form-item>
+          <el-form-item label="工作日期：" prop="work_date">
+            <el-input v-model="formData.work_date" style="width: 468px !important" disabled />
+          </el-form-item>
+        </el-form>
+        <div class="common-dialog-footer">
+          <el-button type="primary" @click="closeDialog">返回</el-button>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref, watch } from 'vue';
+
+const emits = defineEmits(['close']);
+const props = defineProps<{
+  eventId: string | number;
+}>();
+
+// 模拟的数据
+const formData = ref({
+  name: '张三',
+  county: '朝阳区',
+  expert_type: '安全工程',
+  position: '高级工程师',
+  unit: '北京市应急管理局',
+  phone: '13800138000',
+  address: '北京市朝阳区XX路XX号',
+  status: '在职',
+  accident_type: '火灾、爆炸',
+  rescue_experience: '参与过多次重大事故救援，经验丰富。',
+  birthdate: '1975-05-20',
+  work_date: '2000-01-01'
+});
+
+const closeDialog = () => {
+  emits('close');
+};
+</script>
+
+<style scoped></style>

src/views/comprehensiveGuarantee/reliefResourceManagement/reliefTalents.vue

@@ -0,0 +1,144 @@
+<template>
+  <div class="app-container">
+    <div v-show="!reliefTalentsAddState.show && !reliefTalentsEditState.show && !reliefTalentsViewState.show">
+      <h1>物资储备管理</h1>
+      <el-row :gutter="10" class="mb8">
+        <el-col :span="1.5">
+          <el-button type="primary" icon="Plus" @click="handleAdd">录入</el-button>
+        </el-col>
+        <el-col :span="1.5">
+          <el-button type="primary" icon="Plus" @click="handleAdds">批量导入</el-button>
+        </el-col>
+      </el-row>
+      <!-- 表格组件 -->
+      <el-table ref="multipleTable" v-loading="loading" :data="tableData" style="width: 100%" :max-height="400">
+        <el-table-column label="序号" align="center" width="55" fixed="left">
+          <template #default="scope">
+            {{ (queryParams.page - 1) * queryParams.pageSize + scope.$index + 1 }}
+          </template>
+        </el-table-column>
+        <el-table-column label="姓名" align="center" prop="name" />
+        <el-table-column label="联系电话" align="center" prop="contact_number" />
+        <el-table-column label="性别" align="center" prop="gender" />
+        <el-table-column label="现在地址" align="center" prop="current_address" />
+        <el-table-column label="职务" align="center" prop="position" />
+        <el-table-column label="所属救援人员单位" align="center" prop="unit_id" />
+        <el-table-column label="操作" align="center" class-name="small-padding fixed-width" fixed="right" width="200">
+          <template #default="scope">
+            <el-text class="common-btn-text-primary" @click="handleView(scope.row)">查看</el-text>
+            <el-text class="common-btn-text-primary" @click="handleUpdate(scope.row)">修改</el-text>
+          </template>
+        </el-table-column>
+      </el-table>
+      <pagination
+        v-show="total > 0"
+        v-model:page="queryParams.page"
+        v-model:limit="queryParams.pageSize"
+        :total="total"
+        @pagination="fetchWorkrData"
+      />
+    </div>
+    <ReliefTalentsAdd v-if="reliefTalentsAddState.show" @close="handleCancel" />
+    <ReliefTalentsEdit v-if="reliefTalentsEditState.show" :event-id="reliefTalentsEditState.eventId" @close="handleCancel" />
+    <ReliefTalentsView v-if="reliefTalentsViewState.show" :event-id="reliefTalentsViewState.eventId" @close="handleCancel" />
+  </div>
+</template>
+
+<script setup lang="ts">
+import { onMounted, reactive, ref, toRefs } from 'vue';
+import { ElTable, ElTableColumn, ElButton, ElText } from 'element-plus';
+import { ComponentInternalInstance, getCurrentInstance } from 'vue';
+import { getPersonnel } from '@/api/comprehensiveGuarantee/reliefResourceManagement/reliefTalents';
+import Pagination from '@/components/Pagination/index.vue';
+import ReliefTalentsAdd from './reliefTalentsAdd.vue';
+import ReliefTalentsEdit from './reliefTalentsEdit.vue';
+import ReliefTalentsView from './reliefTalentsView.vue';
+const loading = ref(true);
+const showSearch = ref(true);
+const multiple = ref(true);
+const ids = ref<Array<number | string>>([]);
+const single = ref(true);
+const total = ref(0);
+const tableData = ref<any[]>([]);
+const selectedRow = ref<any | null>(null);
+
+const { proxy } = getCurrentInstance() as ComponentInternalInstance;
+
+const initFormData = reactive({
+  name: '',
+  contact_number: '',
+  gender: '',
+  current_address: '',
+  position: '',
+  unit_id: ''
+});
+
+const data = reactive({
+  form: { ...initFormData },
+  queryParams: {
+    page: 1,
+    pageSize: 10
+  }
+});
+
+const { queryParams, form } = toRefs(data);
+
+const fetchWorkrData = async () => {
+  try {
+    loading.value = true;
+    const response = await getPersonnel(queryParams.value);
+    if (response.code === 200) {
+      tableData.value = response.data;
+      total.value = response.data.length;
+    } else {
+      console.error('获取数据失败:', response.msg);
+    }
+  } catch (error) {
+    console.error('请求数据时发生错误:', error);
+  } finally {
+    loading.value = false;
+  }
+};
+
+let reliefTalentsViewState = reactive({
+  show: false,
+  eventId: ''
+});
+
+let reliefTalentsEditState = reactive({
+  show: false,
+  eventId: ''
+});
+let reliefTalentsAddState = reactive({
+  show: false
+});
+const handleAdd = () => {
+  reliefTalentsAddState.show = true;
+};
+
+const handleView = (row: any) => {
+  reliefTalentsViewState.eventId = row.id;
+  reliefTalentsViewState.show = true;
+};
+
+const handleUpdate = (row: any) => {
+  reliefTalentsEditState.eventId = row.id;
+  reliefTalentsEditState.show = true;
+};
+
+const handleCancel = () => {
+  reliefTalentsViewState.show = false;
+  reliefTalentsEditState.show = false;
+  reliefTalentsAddState.show = false;
+};
+
+onMounted(() => {
+  fetchWorkrData();
+});
+</script>
+
+<style scoped>
+.app-container {
+  overflow-x: auto; /* 当内容溢出时允许水平滚动 */
+}
+</style>

src/views/comprehensiveGuarantee/reliefResourceManagement/reliefTalentsAdd.vue

@@ -0,0 +1,11 @@
+<script setup lang="ts">
+
+</script>
+
+<template>
+
+</template>
+
+<style scoped lang="scss">
+
+</style>

src/views/comprehensiveGuarantee/reliefResourceManagement/reliefTalentsEdit.vue

@@ -0,0 +1,11 @@
+<script setup lang="ts">
+
+</script>
+
+<template>
+
+</template>
+
+<style scoped lang="scss">
+
+</style>

src/views/comprehensiveGuarantee/reliefResourceManagement/reliefTalentsView.vue

@@ -0,0 +1,68 @@
+<template>
+  <div class="app-container p-2">
+    <el-row :gutter="20">
+      <el-col :span="20">
+        <h2>详情</h2>
+      </el-col>
+      <el-col :lg="24" :xs="24">
+        <el-table :data="tableData" border height="400">
+          <el-table-column label="序号" prop="seqNo" width="80">
+            <template #default="{ $index }">
+              <span>{{ $index + 1 }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column label="物资类型" prop="materialType"></el-table-column>
+          <el-table-column label="物资名称" prop="materialName"></el-table-column>
+          <el-table-column label="物资数量（件）" prop="quantity"></el-table-column>
+          <el-table-column label="物资用途" prop="purpose"></el-table-column>
+        </el-table>
+      </el-col>
+      <div class="common-dialog-footer" style="width: 100%; justify-content: center; display: flex">
+        <el-row :span="24" :gutter="10" class="mb8">
+          <el-col :span="1.5">
+            <el-button type="danger" @click="handleReturn">返回</el-button>
+          </el-col>
+        </el-row>
+      </div>
+    </el-row>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue';
+import { ElTable, ElButton, ElCol, ElRow, ElTableColumn } from 'element-plus';
+import { defineProps, defineEmits } from 'vue';
+
+const props = defineProps({
+  eventId: String
+});
+
+const emits = defineEmits(['close']);
+
+const handleReturn = () => {
+  emits('close');
+};
+</script>
+
+<style scoped>
+.app-container {
+  font-family: Avenir, Helvetica, Arial, sans-serif;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  text-align: center;
+  color: #2c3e50;
+}
+
+.report-info {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-top: 10px;
+}
+
+.report-amount,
+.approval-status {
+  font-size: 14px;
+  color: #606266;
+}
+</style>