仓库信息管理

src/api/comprehensiveGuarantee/materialReserveManagement/godownManagement.ts

@@ -0,0 +1,39 @@
+import request from '@/utils/request';
+// 查询
+export function getMaterialWarehouseList(params) {
+  return request({
+    url: '/api/resource_provison/material/warehouse/list',
+    method: 'get',
+    params: params
+  });
+}
+// 详情
+export function getMaterialWarehouseInfo(id) {
+  return request({
+    url: '/api/resource_provison/material/warehouse/info/' + id,
+    method: 'get'
+  });
+}
+// 新增
+export function createMaterialWarehouse(data) {
+  return request({
+    url: '/api/resource_provison/material/warehouse/create',
+    method: 'post',
+    data: data
+  });
+}
+// 修改
+export function updateMaterialWarehouse(data, id) {
+  return request({
+    url: '/api/resource_provison/material/warehouse/update/' + id,
+    method: 'put',
+    data: data
+  });
+}
+// 删除
+export function deleteMaterialWarehouse(id: string) {
+  return request({
+    url: '/api/resource_provison/material/warehouse/delete/' + id,
+    method: 'delete'
+  });
+}

src/api/inspectionWork/inspector.ts

@@ -1,10 +1,9 @@
 import request from '@/utils/request';
 // 查询部门列表
-export function deptList(params) {
+export function deptList() {
   return request({
     url: '/api/system/user/deptTree',
-    method: 'get',
-    params: params
+    method: 'get'
   });
 }
 // 查询通讯录列表

src/utils/validate.ts

@@ -90,3 +90,14 @@ export const isArray = (arg: string | string[]) => {
   }
   return Array.isArray(arg);
 };
+// 手机号正则校验
+export const validatePhone = (rule, value, callback) => {
+  const phoneRegex = /^1[3-9]\d{9}$/;
+  if (!value) {
+    return callback(new Error('请输入手机号'));
+  } else if (!phoneRegex.test(value)) {
+    return callback(new Error('手机号格式不正确'));
+  } else {
+    callback();
+  }
+};

src/views/comprehensiveGuarantee/MaterialReserveManagement/GodownDetails.vue

@@ -0,0 +1,122 @@
+<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="formRef" :model="form" label-width="160px">
+          <el-form-item label="仓库名称：">
+            <el-input v-model="form.warehouse_name" disabled class="custom-disabled" style="width: 468px" />
+          </el-form-item>
+          <el-form-item label="所属区县：" prop="area_name" class="custom-disabled">
+            <el-select v-model="form.area_name" disabled>
+              <el-option v-for="(item, index) in district_type" :key="index" :label="item.label" :value="item.label" />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="状态：">
+            <el-select v-model="form.status" disabled class="custom-disabled">
+              <el-option v-for="(item, index) in enable_status" :key="index" :label="item.label" :value="item.value" />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="联系人：">
+            <el-input v-model="form.contact_person" disabled class="custom-disabled" style="width: 468px" />
+          </el-form-item>
+          <el-form-item label="联系电话：">
+            <el-input v-model="form.contact_phone" disabled class="custom-disabled" style="width: 468px" />
+          </el-form-item>
+          <el-form-item label="联系地址：">
+            <el-input v-model="form.address" disabled class="custom-disabled" style="width: 468px" />
+          </el-form-item>
+          <el-form-item label="类型：">
+            <el-select v-model="form.type" disabled class="custom-disabled">
+              <el-option v-for="(item, index) in warehouse_type" :key="index" :label="item.label" :value="item.value" />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="等级：">
+            <el-select v-model="form.level" disabled class="custom-disabled">
+              <el-option v-for="(item, index) in warehouse_level" :key="index" :label="item.label" :value="item.value" />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="物资保管部门名称：">
+            <el-input v-model="form.storage_dept_name" disabled class="custom-disabled" style="width: 468px" />
+          </el-form-item>
+          <el-form-item label="经度：">
+            <el-input v-model="form.longitude" disabled class="custom-disabled" style="width: 468px" />
+          </el-form-item>
+          <el-form-item label="经度：">
+            <el-input v-model="form.latitude" disabled class="custom-disabled" style="width: 468px" />
+          </el-form-item>
+          <el-form-item label="占地面积(平方米)：">
+            <el-input v-model="form.area" disabled class="custom-disabled" style="width: 468px" />
+          </el-form-item>
+          <el-form-item label="备注：">
+            <el-input
+              v-model="form.remark"
+              :autosize="{ minRows: 3, maxRows: 5 }"
+              type="textarea"
+              disabled
+              class="custom-disabled"
+              style="width: 468px"
+            />
+          </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 { getMaterialWarehouseInfo } from '@/api/comprehensiveGuarantee/materialReserveManagement/godownManagement';
+import { toRefs } from 'vue';
+const emits = defineEmits(['close']);
+const { proxy } = getCurrentInstance() as ComponentInternalInstance;
+const { enable_status, warehouse_level, warehouse_type, district_type } = toRefs<any>(proxy?.useDict('enable_status', 'warehouse_level', 'warehouse_type', 'district_type'));
+
+const closeDialog = () => {
+  emits('close');
+};
+const props = defineProps({
+  id: String
+});
+
+// 数据
+const form = ref({
+  warehouse_name: '',
+  area_name: '',
+  status: '',
+  contact_person: '',
+  contact_phone: '',
+  address: '',
+  type: '',
+  level: '',
+  storage_dept_name: '',
+  longitude: '',
+  latitude: '',
+  area: '',
+  remark: ''
+});
+
+getMaterialWarehouseInfo(props.id).then((res) => {
+  form.value = res.data;
+});
+</script>
+
+<style lang="scss" scoped>
+.custom-disabled {
+  :deep(.el-select__wrapper.is-disabled),
+  :deep(.el-input__wrapper),
+  :deep(.el-textarea__inner) {
+    background-color: #ffffff !important;
+  }
+  :deep(.el-select__wrapper.is-disabled .el-select__selected-item),
+  :deep(.el-input__inner),
+  :deep(.el-textarea__inner) {
+    color: rgba(0, 0, 0, 0.85) !important;
+    -webkit-text-fill-color: rgba(0, 0, 0, 0.85) !important;
+  }
+}
+</style>

src/views/comprehensiveGuarantee/MaterialReserveManagement/GodownManagement.vue

@@ -11,50 +11,43 @@
             </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="80" show-overflow-tooltip/>
-          <el-table-column label="状态" align="center" prop="status" width="80" show-overflow-tooltip/>
-          <el-table-column label="联系人" align="center" prop="contact_person" width="80" show-overflow-tooltip/>
-          <el-table-column label="联系电话" align="center" prop="contact_phone" width="80" show-overflow-tooltip/>
-          <el-table-column label="联系地址" align="center" prop="contact_address" width="120" show-overflow-tooltip/>
-          <el-table-column label="备注" align="center" prop="remarks" width="120" show-overflow-tooltip/>
-          <el-table-column label="创建时间" align="center" prop="creation_time" width="120" show-overflow-tooltip/>
-          <el-table-column label="更新时间" align="center" prop="update_time" width="120" show-overflow-tooltip/>
-          <el-table-column label="创建人" align="center" prop="creator" width="120" show-overflow-tooltip/>
-          <el-table-column label="创建人账号" align="center" prop="creator_account" width="120" show-overflow-tooltip/>
-          <el-table-column label="更新人" align="center" prop="updater" width="120" show-overflow-tooltip/>
-          <el-table-column label="类型" align="center" prop="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="material_department_id" width="120" show-overflow-tooltip/>
-          <el-table-column label="物资保管部门名称" align="center" prop="material_department_name" width="120" show-overflow-tooltip/>
-          <el-table-column label="地区" align="center" prop="region" width="120" show-overflow-tooltip/>
-          <el-table-column label="经度" align="center" prop="longitude" width="120" show-overflow-tooltip/>
-          <el-table-column label="纬度" align="center" prop="latitude" width="120" show-overflow-tooltip/>
-          <el-table-column label="占地面积(平方米)" align="center" prop="area_square_meters" width="120" show-overflow-tooltip/>
-          <el-table-column label="操作" align="center" fixed="right" width="88" class-name="small-padding fixed-width">
+        <el-table ref="multipleTable" v-loading="loading" :data="tableData" border :max-height="maxHeight">
+          <el-table-column label="仓库名称" align="center" fixed="left" prop="warehouse_name" />
+          <el-table-column label="状态" align="center" prop="status" width="80">
             <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>
+              <dict-tag :options="enable_status" :value="scope.row.status" />
+            </template>
+          </el-table-column>
+          <el-table-column label="联系人" align="center" prop="contact_person" width="100" />
+          <el-table-column label="联系电话" align="center" prop="contact_phone" width="120" />
+          <el-table-column label="联系地址" align="center" prop="address" />
+          <el-table-column label="物资保管部门名称" align="center" prop="storage_dept_name" />
+          <el-table-column label="经度" align="center" prop="longitude" width="80" />
+          <el-table-column label="纬度" align="center" prop="latitude" width="80" />
+          <el-table-column label="占地面积(平方米)" align="center" prop="area" width="130" />
+          <el-table-column label="操作" align="center" fixed="right" width="140" class-name="small-padding fixed-width">
+            <template #default="scope">
+              <el-button type="text" class="common-btn-text-primary" @click="handleView(scope.row.warehouse_id)">详情</el-button>
+              <el-button type="text" class="common-btn-text-primary" @click="handleEdit(scope.row.warehouse_id)">编辑</el-button>
+              <el-button type="text" class="common-btn-text-primary" @click="handleDelete(scope.row.warehouse_id)">移除</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"
-        />
+        <pagination v-show="total > 0" v-model:page="queryParams.page" v-model:limit="queryParams.pageSize" :total="total" @pagination="getList" />
       </div>
     </div>
-    <addGodownManagement v-if="addGodownState.show" @close="handleCancel" />
-    <outboundDetails v-if="outboundDetailsState.show" @close="handleCancel" />
+    <addGodownManagement v-if="addGodownState.show" :id="detailId" @close="handleCancel" />
+    <GodownDetails v-if="outboundDetailsState.show" :id="detailId" @close="handleCancel" />
   </div>
 </template>
 <script setup lang="ts">
-import addGodownManagement from "./addGodownManagement.vue";
-import outboundDetails from "./outboundDetails.vue";
-import { ref,reactive, onMounted, onBeforeUnmount } from "vue";
+import addGodownManagement from './addGodownManagement.vue';
+import GodownDetails from './GodownDetails.vue';
+import { deleteMaterialWarehouse, getMaterialWarehouseList } from '@/api/comprehensiveGuarantee/materialReserveManagement/godownManagement';
+import { ref, toRefs } from 'vue';
+
+const { proxy } = getCurrentInstance() as ComponentInternalInstance;
+const { enable_status } = toRefs<any>(proxy?.useDict('enable_status'));
 // 定义响应式变量
 const loading = ref(false);
 const maxHeight = ref(window.innerHeight * 0.8);
@@ -64,92 +57,64 @@ const handleResize = () => {
   maxHeight.value = window.innerHeight * 0.8;
 };
 const queryParams = reactive({
-  page: '1',
-  pageSize: '10',
+  page: 1,
+  pageSize: 10
 });
 
-const tableData = [
-  {
-    table_id: 'KD001',
-    warehouse_name: '一号仓库',
-    status: '已出库',
-    contact_person: '张三',
-    contact_phone: '13800138000',
-    contact_address: '北京市朝阳区XXX街道XXX号',
-    remarks: '无',
-    creation_time: '2023-10-01 10:00:00',
-    update_time: '2023-10-01 10:15:00',
-    creator: '李四',
-    creator_account: 'li4@example.com',
-    updater: '王五',
-    type: '普通',
-    grade: '一级',
-    material_department_id: 'MD001',
-    material_department_name: '物资保管一部',
-    region: '华北',
-    longitude: '116.404',
-    latitude: '39.915',
-    area_square_meters: '500',
-  },
-  {
-    table_id: 'KD002',
-    warehouse_name: '二号仓库',
-    status: '处理中',
-    contact_person: '李四',
-    contact_phone: '13800138001',
-    contact_address: '上海市徐汇区XXX街道XXX号',
-    remarks: '急需',
-    creation_time: '2023-10-02 12:00:00',
-    update_time: '2023-10-02 12:30:00',
-    creator: '赵六',
-    creator_account: 'zhao6@example.com',
-    updater: '孙七',
-    type: '特殊',
-    grade: '二级',
-    material_department_id: 'MD002',
-    material_department_name: '物资保管二部',
-    region: '华东',
-    longitude: '121.474',
-    latitude: '31.231',
-    area_square_meters: '800',
-  },
-];
+const tableData = ref([]);
 
+let detailId = ref('');
 const addGodownState = reactive({
-  show: false, // 初始化show为false
+  show: false // 初始化show为false
 });
 const outboundDetailsState = reactive({
-  show: false, // 初始化show为false
+  show: false // 初始化show为false
 });
 
 const handleAdd = () => {
   addGodownState.show = true;
+  detailId.value = '';
 };
 
-const upload = () => {
-  // 这里可能需要实现上传逻辑，暂时只是显示WriteForm作为示例
+const handleEdit = (id: string) => {
   addGodownState.show = true;
+  detailId.value = id;
 };
 
-const handleCancel = () => {
-  addGodownState.show = false;
-  outboundDetailsState.show = false
+const handleDelete = (id: string) => {
+  proxy?.$modal.confirm('是否确认删除选择的数据项？').then(() => {
+    deleteMaterialWarehouse(id).then(() => {
+      proxy?.$modal.msgSuccess('删除成功');
+      getList();
+    });
+  });
 };
 
-const handleWrite = () => {
-  outboundDetailsState.show=true;
+const handleCancel = () => {
+  addGodownState.show = false;
+  outboundDetailsState.show = false;
+  handlePaginationChange(1);
 };
 
-const handleView = () => {
-  outboundDetailsState.show=true;
+const handleView = (id: string) => {
+  outboundDetailsState.show = true;
+  detailId.value = id;
 };
 
 const handlePaginationChange = (page: number) => {
   queryParams.page = page;
-  // fetchTableData(); //
+  getList();
+};
+
+const getList = () => {
+  getMaterialWarehouseList(queryParams).then((res) => {
+    tableData.value = res.data;
+    total.value = res.total;
+  });
 };
 
 onMounted(() => {
+  getList();
   window.addEventListener('resize', handleResize);
 });
 

src/views/comprehensiveGuarantee/MaterialReserveManagement/TypesMaterialsDetails.vue

@@ -7,7 +7,7 @@
       </div>
       <div class="common-dialog-box">
         <el-form ref="eventFormRef" :model="form" :rules="rules" label-width="120px">
-          <el-form-item label="父类id2：">
+          <el-form-item label="父类id：">
             <el-input v-model="form.parent_id" disabled class="custom-disabled" style="width: 468px !important" />
           </el-form-item>
 
@@ -62,7 +62,6 @@ const rules = reactive({});
 const closeDialog = () => {
   emits('close');
 };
-const submitForm = () => {};
 
 getMaterialTypeInfo(props.id).then((res) => {
   form.value = res.data;

src/views/comprehensiveGuarantee/MaterialReserveManagement/addGodownManagement.vue

@@ -6,14 +6,19 @@
         <div>新增出库单</div>
       </div>
       <div class="common-dialog-box">
-        <el-form ref="eventFormRef" :model="form" :rules="rules" label-width="120px">
+        <el-form ref="formRef" :model="form" :rules="rules" label-width="160px">
           <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="area_name">
+            <el-select v-model="form.area_name">
+              <el-option v-for="(item, index) in district_type" :key="index" :label="item.label" :value="item.label" />
+            </el-select>
+          </el-form-item>
           <el-form-item label="状态：" prop="status">
-            <el-input v-model="form.status" placeholder="请输入状态" style="width: 468px !important" />
-            <!-- 注意：如果状态是固定选项（如启用/禁用），则可以使用el-select -->
+            <el-select v-model="form.status">
+              <el-option v-for="(item, index) in enable_status" :key="index" :label="item.label" :value="item.value" />
+            </el-select>
           </el-form-item>
 
           <el-form-item label="联系人：" prop="contact_person">
@@ -24,138 +29,155 @@
             <el-input v-model="form.contact_phone" placeholder="请输入联系电话" style="width: 468px !important" />
           </el-form-item>
 
-          <el-form-item label="联系地址：" prop="contact_address">
-            <el-input v-model="form.contact_address" placeholder="请输入联系地址" style="width: 468px !important" />
+          <el-form-item label="联系地址：" prop="address">
+            <el-input v-model="form.address" placeholder="请输入联系地址" style="width: 468px !important">
+              <template #append>
+                <el-button type="primary" @click="openMapDialog">地图定位</el-button>
+              </template>
+            </el-input>
           </el-form-item>
-
-          <el-form-item label="备注：" prop="remarks">
-            <el-input v-model="form.remarks" placeholder="请输入备注" style="width: 468px !important" />
+          <el-form-item label="经度：" prop="longitude">
+            <el-input v-model="form.longitude" placeholder="请输入经度" disabled style="width: 468px !important" />
           </el-form-item>
-
-          <el-form-item label="创建时间：" prop="creation_time">
-            <el-date-picker
-              v-model="form.creation_time"
-              type="datetime"
-              placeholder="请选择创建时间"
-              style="width: 468px !important"
-            />
-            <!-- 注意：这里使用了el-date-picker来处理日期时间，如果需要其他格式请调整type属性 -->
+          <el-form-item label="纬度：" prop="latitude">
+            <el-input v-model="form.latitude" placeholder="请输入纬度" disabled style="width: 468px !important" />
           </el-form-item>
-
-          <el-form-item label="更新时间：" prop="update_time">
-            <el-date-picker
-              v-model="form.update_time"
-              type="datetime"
-              placeholder="请选择更新时间"
+          <el-form-item label="类型：" prop="type">
+            <el-select v-model="form.type">
+              <el-option v-for="(item, index) in warehouse_type" :key="index" :label="item.label" :value="item.value" />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="等级：" prop="level">
+            <el-select v-model="form.level">
+              <el-option v-for="(item, index) in warehouse_level" :key="index" :label="item.label" :value="item.value" />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="物资保管部门名称：" prop="storage_dept_id">
+            <el-tree-select
+              v-model="form.storage_dept_id"
+              :data="deptTreeData"
+              :props="{ label: 'label', value: 'id', children: 'children' }"
+              :render-after-expand="false"
               style="width: 468px !important"
             />
           </el-form-item>
 
-          <el-form-item label="创建人：" prop="creator">
-            <el-input v-model="form.creator" placeholder="请输入创建人" style="width: 468px !important" />
-          </el-form-item>
-
-          <el-form-item label="创建人账号：" prop="creator_account">
-            <el-input v-model="form.creator_account" placeholder="请输入创建人账号" style="width: 468px !important" />
-          </el-form-item>
-
-          <el-form-item label="更新人：" prop="updater">
-            <el-input v-model="form.updater" placeholder="请输入更新人" style="width: 468px !important" />
-          </el-form-item>
-
-          <el-form-item label="类型：" prop="type">
-            <el-input v-model="form.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="material_department_id">
-            <el-input v-model="form.material_department_id" placeholder="请输入物资保管部门编号" style="width: 468px !important" />
-          </el-form-item>
-
-          <el-form-item label="物资保管部门名称：" prop="material_department_name">
-            <el-input v-model="form.material_department_name" placeholder="请输入物资保管部门名称" style="width: 468px !important" />
-          </el-form-item>
-
-          <el-form-item label="地区：" prop="region">
-            <el-input v-model="form.region" placeholder="请输入地区" style="width: 468px !important" />
-          </el-form-item>
-
-          <el-form-item label="经度：" prop="longitude">
-            <el-input v-model="form.longitude" placeholder="请输入经度" style="width: 468px !important" />
-          </el-form-item>
-
-          <el-form-item label="纬度：" prop="latitude">
-            <el-input v-model="form.latitude" placeholder="请输入纬度" style="width: 468px !important" />
+          <el-form-item label="占地面积(平方米)：" prop="area">
+            <el-input v-model="form.area" placeholder="请输入占地面积(平方米)" style="width: 468px !important" />
           </el-form-item>
-
-          <el-form-item label="占地面积(平方米)：" prop="area_square_meters">
-            <el-input v-model="form.area_square_meters" placeholder="请输入占地面积(平方米)" style="width: 468px !important" />
+          <el-form-item label="备注：" prop="remark">
+            <el-input v-model="form.remark" :autosize="{ minRows: 3, maxRows: 5 }" type="textarea" style="width: 468px" />
           </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>
+          <el-button :loading="buttonLoading" type="primary" @click="submitForm(formRef)">确定</el-button>
         </div>
       </div>
     </div>
   </div>
+  <!-- 地图弹窗 -->
+  <company-map v-model:visible="mapDialogVisible" :address="form.address" @confirm="handleMapChange" />
 </template>
 <script setup lang="ts">
 import { ref, reactive, toRefs } from 'vue';
+import {
+  createMaterialWarehouse,
+  getMaterialWarehouseInfo,
+  updateMaterialWarehouse
+} from '@/api/comprehensiveGuarantee/materialReserveManagement/godownManagement';
+import { validatePhone } from '@/utils/validate';
+import { deptList } from '@/api/inspectionWork/inspector';
 const emits = defineEmits(['close']);
+const { proxy } = getCurrentInstance() as ComponentInternalInstance;
+const { enable_status, warehouse_level, warehouse_type, district_type } = toRefs<any>(proxy?.useDict('enable_status', 'warehouse_level', 'warehouse_type', 'district_type'));
+const props = defineProps({
+  id: String
+});
+const formRef = ref();
 const buttonLoading = ref(false);
-// 表单初始数据
-const initFormData = {
-  warehouse_name: '',
-  status: '',
-  contact_person: '',
-  contact_phone: '',
-  contact_address: '',
-  remarks: '',
-  creation_time: '',
-  update_time: '',
-  creator: '',
-  creator_account: '',
-  updater: '',
-  type: '',
-  grade: '',
-  material_department_id: '',
-  material_department_name: '',
-  region: '',
-  longitude: '',
-  latitude: '',
-  area_square_meters: ''
-};
 
 // 表单数据
 const data = reactive({
-  form: { ...initFormData },
+  form: {
+    warehouse_name: '',
+    status: '',
+    contact_person: '',
+    contact_phone: '',
+    area_name: '',
+    address: '',
+    longitude: '',
+    latitude: '',
+    type: '',
+    level: '',
+    storage_dept_id: '',
+    area: '',
+    remark: ''
+  },
   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' }]
+    warehouse_name: [{ required: true, message: '请输入仓库名称', trigger: 'blur' }],
+    area_name: [{ required: true, message: '请选择所属区县', trigger: 'change' }],
+    status: [{ required: true, message: '请选择状态', trigger: 'change' }],
+    contact_person: [{ required: true, message: '请输入联系人', trigger: 'blur' }],
+    contact_phone: [
+      { required: true, message: '请输入联系电话', trigger: 'blur' },
+      { validator: validatePhone, message: '请输入正确格式的联系电话', trigger: 'blur' }
+    ],
+    address: [{ required: true, message: '请输入联系地址', trigger: 'blur' }],
+    longitude: [{ required: true, message: '请输入经度', trigger: 'blur' }],
+    latitude: [{ required: true, message: '请输入纬度', trigger: 'blur' }],
+    type: [{ required: true, message: '请选择类型', trigger: 'change' }],
+    level: [{ required: true, message: '请选择等级', trigger: 'change' }],
+    storage_dept_id: [{ required: true, message: '请选择物资保管部门名称', trigger: 'change' }],
+    area: [{ required: true, message: '请输入占地面积', trigger: 'blur' }]
   }
 });
 
 const { form, rules } = toRefs(data);
+let deptTreeData = ref([]);
 
 const closeDialog = () => {
   emits('close');
 };
-const submitForm = () => {
-}
+// 地图定位
+const mapDialogVisible = ref(false);
+const openMapDialog = () => {
+  mapDialogVisible.value = true;
+};
+const handleMapChange = (data) => {
+  form.value.address = data.address;
+  form.value.longitude = data.lnglat[0];
+  form.value.latitude = data.lnglat[1];
+  mapDialogVisible.value = false;
+};
+const submitForm = async (formEl) => {
+  if (!formEl) return;
+  await formEl.validate((valid, fields) => {
+    if (valid) {
+      if (props.id) {
+        updateMaterialWarehouse(form.value, props.id).then(() => {
+          proxy.$modal.msgSuccess('修改成功');
+          emits('close');
+        });
+      } else {
+        createMaterialWarehouse(form.value).then(() => {
+          proxy.$modal.msgSuccess('新增成功');
+          emits('close');
+        });
+      }
+    }
+  });
+};
+
+onMounted(() => {
+  deptList().then((res) => {
+    deptTreeData.value = res.data;
+  });
+  if (!props.id) return;
+  getMaterialWarehouseInfo(props.id).then((res) => {
+    form.value = res.data;
+  });
+});
 </script>
 
 <style lang="scss" scoped>

src/views/comprehensiveGuarantee/MaterialReserveManagement/addTypesMaterials.vue

@@ -94,7 +94,7 @@ const submitForm = async (formEl) => {
         });
       }
     }
-  })
+  });
 };
 
 onMounted(() => {

src/views/comprehensiveGuarantee/MaterialReserveManagement/outboundDetails.vue

@@ -5,57 +5,54 @@
         <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="outStockNumber">
-            <el-input v-model="formData.outStockNumber" style="width: 468px" />
-          </el-form-item>
-          <el-form-item label="仓库名称：" prop="warehouseName">
-            <el-input v-model="formData.warehouseName" style="width: 468px" />
+        <el-form ref="form" :model="form" label-width="160px">
+          <el-form-item label="仓库名称：" prop="warehouse_name">
+            <el-input v-model="form.warehouse_name" disabled class="custom-disabled" style="width: 468px" />
           </el-form-item>
           <el-form-item label="出库单商品总体积(cm³)：" prop="totalVolume">
-            <el-input v-model="formData.totalVolume" style="width: 468px" />
+            <el-input v-model="form.totalVolume" style="width: 468px" />
           </el-form-item>
           <el-form-item label="出库单商品总重量(kg)：" prop="totalWeight">
-            <el-input v-model="formData.totalWeight" style="width: 468px" />
+            <el-input v-model="form.totalWeight" style="width: 468px" />
           </el-form-item>
           <el-form-item label="出库单发货总体积(cm³)：" prop="shipmentTotalVolume">
-            <el-input v-model="formData.shipmentTotalVolume" style="width: 468px" />
+            <el-input v-model="form.shipmentTotalVolume" style="width: 468px" />
           </el-form-item>
           <el-form-item label="出库单发货总重量(kg)：" prop="shipmentTotalWeight">
-            <el-input v-model="formData.shipmentTotalWeight" style="width: 468px" />
+            <el-input v-model="form.shipmentTotalWeight" style="width: 468px" />
           </el-form-item>
           <el-form-item label="出库单商品总数量：" prop="totalQuantity">
-            <el-input v-model="formData.totalQuantity" style="width: 468px" />
+            <el-input v-model="form.totalQuantity" style="width: 468px" />
           </el-form-item>
           <el-form-item label="出库单发货时间：" prop="shipmentDate">
-            <el-input v-model="formData.shipmentDate" style="width: 468px" />
+            <el-input v-model="form.shipmentDate" style="width: 468px" />
           </el-form-item>
           <el-form-item label="灾种名称：" prop="disasterType">
-            <el-input v-model="formData.disasterType" style="width: 468px" />
+            <el-input v-model="form.disasterType" style="width: 468px" />
           </el-form-item>
           <el-form-item label="调运机构名称：" prop="transportationOrgName">
-            <el-input v-model="formData.transportationOrgName" style="width: 468px" />
+            <el-input v-model="form.transportationOrgName" style="width: 468px" />
           </el-form-item>
           <el-form-item label="发货人姓名：" prop="shipperName">
-            <el-input v-model="formData.shipperName" style="width: 468px" />
+            <el-input v-model="form.shipperName" style="width: 468px" />
           </el-form-item>
           <el-form-item label="发货人手机：" prop="shipperPhone">
-            <el-input v-model="formData.shipperPhone" style="width: 468px" />
+            <el-input v-model="form.shipperPhone" style="width: 468px" />
           </el-form-item>
           <el-form-item label="发货人地址：" prop="shipperAddress">
-            <el-input v-model="formData.shipperAddress" style="width: 468px" />
+            <el-input v-model="form.shipperAddress" style="width: 468px" />
           </el-form-item>
           <el-form-item label="发货方备注：" prop="shipperRemark">
-            <el-input v-model="formData.shipperRemark" style="width: 468px" />
+            <el-input v-model="form.shipperRemark" style="width: 468px" />
           </el-form-item>
           <el-form-item label="收货人姓名：" prop="receiverName">
-            <el-input v-model="formData.receiverName" style="width: 468px" />
+            <el-input v-model="form.receiverName" style="width: 468px" />
           </el-form-item>
           <el-form-item label="收货人手机：" prop="receiverPhone">
-            <el-input v-model="formData.receiverPhone" style="width: 468px" />
+            <el-input v-model="form.receiverPhone" style="width: 468px" />
           </el-form-item>
           <el-form-item label="收货人地址：" prop="receiverAddress">
-            <el-input v-model="formData.receiverAddress" style="width: 468px" />
+            <el-input v-model="form.receiverAddress" style="width: 468px" />
           </el-form-item>
         </el-form>
         <div class="common-dialog-footer">
@@ -67,41 +64,51 @@
 </template>
 
 <script setup lang="ts">
-import { ref, watch} from 'vue';
-import {updatetask} from "@/api/inspectionWork/inspector";
-import {ElMessage} from "element-plus";
-import { defineEmits,defineProps } from 'vue';
+import { getMaterialWarehouseInfo } from '@/api/comprehensiveGuarantee/materialReserveManagement/godownManagement';
 const emits = defineEmits(['close']);
 const closeDialog = () => {
   emits('close');
 };
 const props = defineProps({
-  eventId: String
+  id: String
 });
 
-
 // 模拟的数据
-const formData = {
-  outStockNumber: 'OS20230401001', // 出库单号
-  warehouseName: '北京总仓', // 仓库名称
-  totalVolume: '123456', // 出库单商品总体积(cm³)
-  totalWeight: '50.75', // 出库单商品总重量(kg)
-  shipmentTotalVolume: '125000', // 出库单发货总体积(cm³)
-  shipmentTotalWeight: '51.25', // 出库单发货总重量(kg)
-  totalQuantity: '100', // 出库单商品总数量
-  shipmentDate: '2023-04-01', // 出库单发货时间（注意：这里应该是日期格式，但el-input默认处理字符串）
-  disasterType: '洪水', // 灾种名称
-  transportationOrgName: '国家救灾物资储备中心', // 调运机构名称
-  shipperName: '张三', // 发货人姓名
-  shipperPhone: '13800000000', // 发货人手机
-  shipperAddress: '北京市东城区某街道123号', // 发货人地址
-  shipperRemark: '请小心轻放，勿压！', // 发货方备注
-  receiverName: '李四', // 收货人姓名
-  receiverPhone: '13900000000', // 收货人手机
-  receiverAddress: '河北省保定市某区456号', // 收货人地址
-};
-
+const form = ref({
+  outStockNumber: '', // 出库单号
+  warehouse_name: '', // 仓库名称
+  totalVolume: '', // 出库单商品总体积(cm³)
+  totalWeight: '', // 出库单商品总重量(kg)
+  shipmentTotalVolume: '', // 出库单发货总体积(cm³)
+  shipmentTotalWeight: '', // 出库单发货总重量(kg)
+  totalQuantity: '', // 出库单商品总数量
+  shipmentDate: '', // 出库单发货时间（注意：这里应该是日期格式，但el-input默认处理字符串）
+  disasterType: '', // 灾种名称
+  transportationOrgName: '', // 调运机构名称
+  shipperName: '', // 发货人姓名
+  shipperPhone: '', // 发货人手机
+  shipperAddress: '', // 发货人地址
+  shipperRemark: '', // 发货方备注
+  receiverName: '', // 收货人姓名
+  receiverPhone: '', // 收货人手机
+  receiverAddress: '' // 收货人地址
+});
 
+getMaterialWarehouseInfo(props.id).then((res) => {
+  form.value = res.data;
+});
 </script>
 
-<style scoped></style>
+<style lang="scss" scoped>
+.custom-disabled {
+  :deep(.el-select__wrapper.is-disabled),
+  :deep(.el-input__wrapper) {
+    background-color: #ffffff !important;
+  }
+  :deep(.el-select__wrapper.is-disabled .el-select__selected-item),
+  :deep(.el-input__inner) {
+    color: rgba(0, 0, 0, 0.85) !important;
+    -webkit-text-fill-color: rgba(0, 0, 0, 0.85) !important;
+  }
+}
+</style>