ソースを参照

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

Hwf 6 ヶ月 前
コミット
f01f81da33

+ 20 - 0
src/api/comprehensiveGuarantee/reliefResourceManagement/reliefTalents.ts

@@ -6,3 +6,23 @@ export function getPersonnel(params) {
     params: params
   });
 }
+export function getPersonnel2(id) {
+  return request({
+    url: `/api/resource_provison/emergency/rescue_personnel/${id}`,
+    method: 'get'
+  });
+}
+export function uploadPersonnel(id, personnel) {
+  return request({
+    url: '/api/resource_provison/emergency/rescue_personnel/' + id,
+    method: 'put',
+    data: personnel
+  });
+}
+export function addPersonnel(personnel_list) {
+  return request({
+    url: '/api/resource_provison/emergency/rescue_personnel/',
+    method: 'post',
+    data: personnel_list
+  });
+}

+ 28 - 0
src/api/comprehensiveGuarantee/reliefResourceManagement/rescueUnit.ts

@@ -0,0 +1,28 @@
+import request from '@/utils/request';
+export function getUnits(params) {
+  return request({
+    url: '/api/resource_provison/emergency/rescue_units/',
+    method: 'get',
+    params: params
+  });
+}
+export function getUnit(id) {
+  return request({
+    url: `/api/resource_provison/emergency/rescue_units/${id}`,
+    method: 'get'
+  });
+}
+export function uploadUnit(id, unit) {
+  return request({
+    url: '/api/resource_provison/emergency/rescue_units/' + id,
+    method: 'put',
+    data: unit
+  });
+}
+export function addUnit(units) {
+  return request({
+    url: '/api/resource_provison/emergency/rescue_units/',
+    method: 'post',
+    data: units
+  });
+}

+ 12 - 7
src/views/comprehensiveGuarantee/reliefResourceManagement/reliefTalents.vue

@@ -22,7 +22,7 @@
         <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" prop="unit_name" />
         <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>
@@ -35,11 +35,16 @@
         v-model:page="queryParams.page"
         v-model:limit="queryParams.pageSize"
         :total="total"
-        @pagination="fetchWorkrData"
+        @pagination="fetchReliefData"
       />
     </div>
-    <ReliefTalentsAdd v-if="reliefTalentsAddState.show" @close="handleCancel" />
-    <ReliefTalentsEdit v-if="reliefTalentsEditState.show" :event-id="reliefTalentsEditState.eventId" @close="handleCancel" />
+    <ReliefTalentsAdd v-if="reliefTalentsAddState.show" @close="handleCancel" @refresh="fetchReliefData" />
+    <ReliefTalentsEdit
+      v-if="reliefTalentsEditState.show"
+      :event-id="reliefTalentsEditState.eventId"
+      @close="handleCancel"
+      @refresh="fetchReliefData"
+    />
     <ReliefTalentsView v-if="reliefTalentsViewState.show" :event-id="reliefTalentsViewState.eventId" @close="handleCancel" />
   </div>
 </template>
@@ -70,7 +75,7 @@ const initFormData = reactive({
   gender: '',
   current_address: '',
   position: '',
-  unit_id: ''
+  unit_name: ''
 });
 
 const data = reactive({
@@ -83,7 +88,7 @@ const data = reactive({
 
 const { queryParams, form } = toRefs(data);
 
-const fetchWorkrData = async () => {
+const fetchReliefData = async () => {
   try {
     loading.value = true;
     const response = await getPersonnel(queryParams.value);
@@ -133,7 +138,7 @@ const handleCancel = () => {
 };
 
 onMounted(() => {
-  fetchWorkrData();
+  fetchReliefData();
 });
 </script>
 

+ 89 - 5
src/views/comprehensiveGuarantee/reliefResourceManagement/reliefTalentsAdd.vue

@@ -1,11 +1,95 @@
+<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="auto">
+          <el-form-item label="姓名:" prop="name">
+            <el-input v-model="formData.name" style="width: 468px !important" />
+          </el-form-item>
+          <el-form-item label="联系电话:" prop="contact_number">
+            <el-input v-model="formData.contact_number" style="width: 468px !important" />
+          </el-form-item>
+          <el-form-item label="性别:" prop="gender">
+            <el-select v-model="formData.gender" placeholder="请选择" style="width: 468px;">
+              <el-option label="男" value="男"></el-option>
+              <el-option label="女" value="女"></el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="现在地址:" prop="current_address">
+            <el-input v-model="formData.current_address" style="width: 468px !important" />
+          </el-form-item>
+          <el-form-item label="职务:" prop="position">
+            <el-input v-model="formData.position" style="width: 468px !important" />
+          </el-form-item>
+          <el-form-item label="所属救援人员单位:" prop="unit_name">
+            <el-input v-model="formData.unit_name" style="width: 468px !important" />
+          </el-form-item>
+        </el-form>
+        <div class="common-dialog-footer">
+          <el-button @click="closeDialog">取消</el-button>
+          <el-button type="primary" @click="submitForm">确定</el-button>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
 <script setup lang="ts">
+import { addPersonnel } from '@/api/comprehensiveGuarantee/reliefResourceManagement/reliefTalents';
+import { ref } from 'vue';
+import { ElMessage } from 'element-plus';
+import { useRouter } from 'vue-router';
 
-</script>
+const emits = defineEmits(['close']);
 
-<template>
+const formData = ref({
+  name: '',
+  contact_number: '',
+  gender: '',
+  current_address: '',
+  position: '',
+  unit_name: ''
+});
 
-</template>
+const rules = ref({
+  name: [{ required: true, message: '姓名不能为空', trigger: 'blur' }],
+  contact_number: [{ required: true, message: '联系电话不能为空', trigger: 'blur' }],
+  gender: [{ required: true, message: '性别不能为空', trigger: 'blur' }],
+  current_address: [{ required: true, message: '地址不能为空', trigger: 'blur' }],
+  position: [{ required: true, message: '职务不能为空', trigger: 'blur' }],
+  unit_name: [{ required: true, message: '所属救援人员单位不能为空', trigger: 'blur' }]
+});
+
+const form = ref(null); // 定义 form 变量
+
+const closeDialog = () => {
+  emits('close');
+};
 
-<style scoped lang="scss">
+const router = useRouter();
+
+// 提交表单
+const submitForm = async () => {
+  try {
+    await form.value.validate();
+    const payload = {
+      personnel_list: [formData.value]
+    };
+    const response = await addPersonnel(payload);
+    if (response.code === 200) {
+      ElMessage.success('提交成功');
+      closeDialog();
+      emits('refresh');
+    } else {
+      ElMessage.error(response.msg || '提交失败,请稍后再试');
+    }
+  } catch (error) {
+    ElMessage.error('表单验证失败,请检查输入');
+  }
+};
+</script>
 
-</style>
+<style scoped></style>

+ 78 - 5
src/views/comprehensiveGuarantee/reliefResourceManagement/reliefTalentsEdit.vue

@@ -1,11 +1,84 @@
+<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" label-width="auto">
+          <el-form-item label="姓名:" prop="name">
+            <el-input v-model="formData.name" style="width: 468px !important"  />
+          </el-form-item>
+          <el-form-item label="联系电话:" prop="contact_number">
+            <el-input v-model="formData.contact_number" style="width: 468px !important"  />
+          </el-form-item>
+          <el-form-item label="性别:" prop="gender">
+            <el-input v-model="formData.gender" style="width: 468px !important"  />
+          </el-form-item>
+          <el-form-item label="现在地址:" prop="current_address">
+            <el-input v-model="formData.current_address" style="width: 468px !important"  />
+          </el-form-item>
+          <el-form-item label="职务:" prop="position">
+            <el-input v-model="formData.position" style="width: 468px !important"  />
+          </el-form-item>
+          <el-form-item label="所属救援人员单位:" prop="unit_name">
+            <el-input v-model="formData.unit_name" style="width: 468px !important"  />
+          </el-form-item>
+        </el-form>
+        <div class="common-dialog-footer">
+          <el-button type="primary" @click="submitForm">确定</el-button>
+          <el-button @click="closeDialog">取消</el-button>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
 <script setup lang="ts">
+import { ref, onMounted } from 'vue';
+import { ElMessage } from 'element-plus';
+import { getPersonnel2,uploadPersonnel } from '@/api/comprehensiveGuarantee/reliefResourceManagement/reliefTalents';
 
-</script>
+const emits = defineEmits(['close']);
+const props = defineProps<{
+  eventId: string | number;
+}>();
 
-<template>
+const formData = ref({
+  name: '',
+  contact_number: '',
+  gender: '',
+  current_address: '',
+  position: '',
+  unit_name: ''
+});
 
-</template>
+const closeDialog = () => {
+  emits('close');
+};
 
-<style scoped lang="scss">
+const fetchPersonnelData = async () => {
+  const response = await getPersonnel2(props.eventId);
+  if (response.code === 200) {
+    formData.value = response.personnel;
+  } else {
+    ElMessage.error('未找到相关数据');
+  }
+};
+const submitForm = async () => {
+  // 假设表单已经通过验证
+  const response = await uploadPersonnel(props.eventId, formData.value );
+  if (response.code === 200) {
+    ElMessage.success('提交成功');
+    closeDialog();
+    emits('refresh');
+  } else {
+    ElMessage.error(response.msg);
+  }
+};
+onMounted(() => {
+  fetchPersonnelData();
+});
+</script>
 
-</style>
+<style scoped></style>

+ 60 - 55
src/views/comprehensiveGuarantee/reliefResourceManagement/reliefTalentsView.vue

@@ -1,68 +1,73 @@
 <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 class="common-dialog">
+    <div class="common-dialog-content">
+      <div class="common-dialog-title-box">
+        <h3 class="common-dialog-title">查看详情</h3>
       </div>
-    </el-row>
+      <div class="common-dialog-box">
+        <el-form ref="form" :model="formData" label-width="auto">
+          <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="contact_number">
+            <el-input v-model="formData.contact_number" style="width: 468px !important" disabled />
+          </el-form-item>
+          <el-form-item label="性别:" prop="gender">
+            <el-input v-model="formData.gender" style="width: 468px !important" disabled />
+          </el-form-item>
+          <el-form-item label="现在地址:" prop="current_address">
+            <el-input v-model="formData.current_address" 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_name">
+            <el-input v-model="formData.unit_name" 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 } from 'vue';
-import { ElTable, ElButton, ElCol, ElRow, ElTableColumn } from 'element-plus';
-import { defineProps, defineEmits } from 'vue';
-
-const props = defineProps({
-  eventId: String
-});
+import { ref, onMounted } from 'vue';
+import { ElMessage } from 'element-plus';
+import { getPersonnel2 } from '@/api/comprehensiveGuarantee/reliefResourceManagement/reliefTalents';
 
 const emits = defineEmits(['close']);
+const props = defineProps<{
+  eventId: string | number;
+}>();
+
+const formData = ref({
+  id:'',
+  name: '',
+  contact_number: '',
+  gender: '',
+  current_address: '',
+  position: '',
+  unit_name: ''
+});
 
-const handleReturn = () => {
+const closeDialog = () => {
   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;
-}
+const fetchPersonnelData = async () => {
+    const response = await getPersonnel2(props.eventId);
+    if (response.code === 200) {
+      formData.value = response.personnel;
+    } else {
+      ElMessage.error('未找到相关数据');
+    }
+};
+onMounted(() => {
+  fetchPersonnelData();
+});
+</script>
 
-.report-amount,
-.approval-status {
-  font-size: 14px;
-  color: #606266;
-}
-</style>
+<style scoped></style>

+ 148 - 0
src/views/comprehensiveGuarantee/reliefResourceManagement/rescueUnit.vue

@@ -0,0 +1,148 @@
+<template>
+  <div class="app-container">
+    <div v-show="!rescueUnitAddState.show && !rescueUnitEditState.show && !rescueUnitViewState.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="type" />
+        <el-table-column label="负责人" align="center" prop="responsible_person" />
+        <el-table-column label="联系电话" align="center" prop="contact_number" />
+        <el-table-column label="负责人职务" align="center" prop="responsible_office" />
+        <el-table-column label="队伍人数" align="center" prop="team_size" />
+        <el-table-column label="地址" align="center" prop="address" />
+        <el-table-column label="主管单位" align="center" prop="competent_organization" />
+        <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="fetchUnitData"
+      />
+    </div>
+    <RescueUnitAdd v-if="rescueUnitAddState.show" @close="handleCancel" @refresh="fetchUnitData" />
+    <RescueUnitEdit v-if="rescueUnitEditState.show" :event-id="rescueUnitEditState.eventId" @close="handleCancel" @refresh="fetchUnitData" />
+    <RescueUnitView v-if="rescueUnitViewState.show" :event-id="rescueUnitViewState.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 { getUnits } from '@/api/comprehensiveGuarantee/reliefResourceManagement/rescueUnit';
+import Pagination from '@/components/Pagination/index.vue';
+import RescueUnitAdd from './rescueUnitAdd.vue';
+import RescueUnitEdit from './rescueUnitEdit.vue';
+import RescueUnitView from './rescueUnitView.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: '',
+  type: '',
+  contact_number: '',
+  responsible_person: '',
+  address: '',
+  responsible_office: '',
+  team_size: '',
+  competent_organization: ''
+});
+
+const data = reactive({
+  form: { ...initFormData },
+  queryParams: {
+    page: 1,
+    pageSize: 10
+  }
+});
+
+const { queryParams, form } = toRefs(data);
+
+const fetchUnitData = async () => {
+  try {
+    loading.value = true;
+    const response = await getUnits(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 rescueUnitViewState = reactive({
+  show: false,
+  eventId: ''
+});
+
+let rescueUnitEditState = reactive({
+  show: false,
+  eventId: ''
+});
+let rescueUnitAddState = reactive({
+  show: false
+});
+const handleAdd = () => {
+  rescueUnitAddState.show = true;
+};
+
+const handleView = (row: any) => {
+  rescueUnitViewState.eventId = row.id;
+  rescueUnitViewState.show = true;
+};
+
+const handleUpdate = (row: any) => {
+  rescueUnitEditState.eventId = row.id;
+  rescueUnitEditState.show = true;
+};
+
+const handleCancel = () => {
+  rescueUnitViewState.show = false;
+  rescueUnitEditState.show = false;
+  rescueUnitAddState.show = false;
+};
+
+onMounted(() => {
+  fetchUnitData();
+});
+</script>
+
+<style scoped>
+.app-container {
+  overflow-x: auto; /* 当内容溢出时允许水平滚动 */
+}
+</style>

+ 102 - 0
src/views/comprehensiveGuarantee/reliefResourceManagement/rescueUnitAdd.vue

@@ -0,0 +1,102 @@
+<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="auto">
+          <el-form-item label="救援人员单位:" prop="name">
+            <el-input v-model="formData.name" style="width: 468px !important" />
+          </el-form-item>
+          <el-form-item label="类型:" prop="type">
+            <el-input v-model="formData.type" style="width: 468px !important" />
+          </el-form-item>
+          <el-form-item label="负责人:" prop="responsible_person">
+            <el-input v-model="formData.responsible_person" style="width: 468px !important" />
+          </el-form-item>
+          <el-form-item label="联系电话:" prop="contact_number">
+            <el-input v-model="formData.contact_number" style="width: 468px !important" />
+          </el-form-item>
+          <el-form-item label="负责人职务:" prop="responsible_office">
+            <el-input v-model="formData.responsible_office" style="width: 468px !important" />
+          </el-form-item>
+          <el-form-item label="队伍人数:" prop="team_size">
+            <el-input v-model="formData.team_size" style="width: 468px !important" />
+          </el-form-item>
+          <el-form-item label="地址:" prop="address">
+            <el-input v-model="formData.address" style="width: 468px !important" />
+          </el-form-item>
+          <el-form-item label="主管单位:" prop="competent_organization">
+            <el-input v-model="formData.competent_organization" style="width: 468px !important" />
+          </el-form-item>
+        </el-form>
+        <div class="common-dialog-footer">
+          <el-button @click="closeDialog">取消</el-button>
+          <el-button type="primary" @click="submitForm">确定</el-button>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue';
+import { ElMessage } from 'element-plus';
+import { useRouter } from 'vue-router';
+import { addUnit } from '@/api/comprehensiveGuarantee/reliefResourceManagement/rescueUnit';
+
+const emits = defineEmits(['close']);
+
+const formData = ref({
+  name: '',
+  type: '',
+  contact_number: '',
+  responsible_person: '',
+  address: '',
+  responsible_office: '',
+  team_size: '',
+  competent_organization: ''
+});
+
+const rules = ref({
+  name: [{ required: true, message: '救援人员单位不能为空', trigger: 'blur' }],
+  type: [{ required: true, message: '类型不能为空', trigger: 'blur' }],
+  contact_number: [{ required: true, message: '负责人不能为空', trigger: 'blur' }],
+  responsible_person: [{ required: true, message: '联系电话不能为空', trigger: 'blur' }],
+  address: [{ required: true, message: '负责人职务不能为空', trigger: 'blur' }],
+  responsible_office: [{ required: true, message: '队伍人数不能为空', trigger: 'blur' }],
+  team_size: [{ required: true, message: '地址不能为空', trigger: 'blur' }],
+  competent_organization: [{ required: true, message: '主管单位不能为空', trigger: 'blur' }]
+});
+
+const form = ref(null); // 定义 form 变量
+
+const closeDialog = () => {
+  emits('close');
+};
+
+const router = useRouter();
+
+// 提交表单
+const submitForm = async () => {
+  try {
+    await form.value.validate();
+    const payload = {
+      units: [formData.value]
+    };
+    const response = await addUnit(payload);
+    if (response.code === 200) {
+      ElMessage.success('提交成功');
+      closeDialog();
+      emits('refresh');
+    } else {
+      ElMessage.error(response.msg || '提交失败,请稍后再试');
+    }
+  } catch (error) {
+    ElMessage.error('表单验证失败,请检查输入');
+  }
+};
+</script>
+
+<style scoped></style>

+ 92 - 0
src/views/comprehensiveGuarantee/reliefResourceManagement/rescueUnitEdit.vue

@@ -0,0 +1,92 @@
+<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" label-width="auto">
+          <el-form-item label="救援人员单位:" prop="name">
+            <el-input v-model="formData.name" style="width: 468px !important" />
+          </el-form-item>
+          <el-form-item label="类型:" prop="type">
+            <el-input v-model="formData.type" style="width: 468px !important" />
+          </el-form-item>
+          <el-form-item label="负责人:" prop="responsible_person">
+            <el-input v-model="formData.responsible_person" style="width: 468px !important" />
+          </el-form-item>
+          <el-form-item label="联系电话:" prop="contact_number">
+            <el-input v-model="formData.contact_number" style="width: 468px !important" />
+          </el-form-item>
+          <el-form-item label="负责人职务:" prop="responsible_office">
+            <el-input v-model="formData.responsible_office" style="width: 468px !important" />
+          </el-form-item>
+          <el-form-item label="队伍人数:" prop="team_size">
+            <el-input v-model="formData.team_size" style="width: 468px !important" />
+          </el-form-item>
+          <el-form-item label="地址:" prop="address">
+            <el-input v-model="formData.address" style="width: 468px !important" />
+          </el-form-item>
+          <el-form-item label="主管单位:" prop="competent_organization">
+            <el-input v-model="formData.competent_organization" style="width: 468px !important" />
+          </el-form-item>
+        </el-form>
+        <div class="common-dialog-footer">
+          <el-button type="primary" @click="submitForm">确定</el-button>
+          <el-button @click="closeDialog">取消</el-button>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref, onMounted } from 'vue';
+import { ElMessage } from 'element-plus';
+import { getUnit, uploadUnit } from '@/api/comprehensiveGuarantee/reliefResourceManagement/rescueUnit';
+
+const emits = defineEmits(['close']);
+const props = defineProps<{
+  eventId: string | number;
+}>();
+
+const formData = ref({
+  name: '',
+  type: '',
+  contact_number: '',
+  responsible_person: '',
+  address: '',
+  responsible_office: '',
+  team_size: '',
+  competent_organization: ''
+});
+
+const closeDialog = () => {
+  emits('close');
+};
+
+const fetchUnitData = async () => {
+  const response = await getUnit(props.eventId);
+  if (response.code === 200) {
+    formData.value = response.unit;
+  } else {
+    ElMessage.error('未找到相关数据');
+  }
+};
+const submitForm = async () => {
+  // 假设表单已经通过验证
+  const response = await uploadUnit(props.eventId, formData.value);
+  if (response.code === 200) {
+    ElMessage.success('提交成功');
+    closeDialog();
+    emits('refresh');
+  } else {
+    ElMessage.error(response.msg);
+  }
+};
+onMounted(() => {
+  fetchUnitData();
+});
+</script>
+
+<style scoped></style>

+ 80 - 0
src/views/comprehensiveGuarantee/reliefResourceManagement/rescueUnitView.vue

@@ -0,0 +1,80 @@
+<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" label-width="auto">
+          <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="type">
+            <el-input v-model="formData.type" style="width: 468px !important" disabled />
+          </el-form-item>
+          <el-form-item label="负责人:" prop="responsible_person">
+            <el-input v-model="formData.responsible_person" style="width: 468px !important" disabled />
+          </el-form-item>
+          <el-form-item label="联系电话:" prop="contact_number">
+            <el-input v-model="formData.contact_number" style="width: 468px !important" disabled />
+          </el-form-item>
+          <el-form-item label="负责人职务:" prop="responsible_office">
+            <el-input v-model="formData.responsible_office" style="width: 468px !important" disabled />
+          </el-form-item>
+          <el-form-item label="队伍人数:" prop="team_size">
+            <el-input v-model="formData.team_size" 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="competent_organization">
+            <el-input v-model="formData.competent_organization" 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, onMounted } from 'vue';
+import { ElMessage } from 'element-plus';
+import { getUnit } from '@/api/comprehensiveGuarantee/reliefResourceManagement/rescueUnit';
+
+const emits = defineEmits(['close']);
+const props = defineProps<{
+  eventId: string | number;
+}>();
+
+const formData = ref({
+  name: '',
+  type: '',
+  contact_number: '',
+  responsible_person: '',
+  address: '',
+  responsible_office: '',
+  team_size: '',
+  competent_organization: ''
+});
+
+const closeDialog = () => {
+  emits('close');
+};
+
+const fetchUnitData = async () => {
+  const response = await getUnit(props.eventId);
+  if (response.code === 200) {
+    formData.value = response.unit;
+  } else {
+    ElMessage.error('未找到相关数据');
+  }
+};
+onMounted(() => {
+  fetchUnitData();
+});
+</script>
+
+<style scoped></style>