交割库备选

src/api/DeliveryWarehouse/DeliveryWarehouseList/index.ts

@@ -2,8 +2,12 @@ import request from '@/config/axios'
 
 export const DeliveryWarehouseListApi = {
   // 查询设备分页
-  getDeliveryWarehouseListPage: async (params: any) => {
-    return await request.get({ url: `/iot/device/page`, params })
+  getDeliveryWarehouseListPage: async (data: any) => {
+    return await request.post({ url: `/coding/deliverySpare/page`, data })
+  },
+
+  exportDeliveryWarehouseList: async (data: any) => {
+    return await request.download({ url: `/coding/deliverySpare/export`, data })
   },
 
 

src/components/Upload/UploadImage.tsx

@@ -0,0 +1,109 @@
+import { defineComponent, ref } from 'vue'
+import { ElMessage, ElUpload, ElIcon } from 'element-plus'
+import { Plus } from '@element-plus/icons-vue'
+import type { UploadProps, UploadRequestOptions } from 'element-plus'
+import './uploadImage.scss'
+
+// 自定义错误类型
+interface UploadError {
+  status: number
+  method: string
+  url: string
+  message: string
+}
+
+export interface UploadImageProps {
+  value?: string
+  onChange?: (url: string) => void
+}
+
+export default defineComponent({
+  name: 'UploadImage',
+  props: {
+    value: {
+      type: String,
+      default: ''
+    },
+    onChange: {
+      type: Function as PropType<(url: string) => void>,
+      default: undefined
+    }
+  },
+  emits: ['update:value'],
+  setup(props, { emit }) {
+    const imageUrl = ref(props.value)
+
+    // 上传成功回调
+    const handleSuccess = (response: any) => {
+      imageUrl.value = response.url
+      emit('update:value', response.url)
+      props.onChange?.(response.url)
+      ElMessage.success('上传成功')
+    }
+
+    // 上传前校验
+    const beforeUpload = (file: File) => {
+      // 校验文件类型
+      const isImage = ['image/jpeg', 'image/png', 'image/gif'].includes(file.type)
+      if (!isImage) {
+        ElMessage.error('只能上传图片文件!')
+        return false
+      }
+
+      // 校验文件大小
+      const isLt2M = file.size / 1024 / 1024 < 2
+      if (!isLt2M) {
+        ElMessage.error('图片大小不能超过 2MB!')
+        return false
+      }
+
+      return true
+    }
+
+    // 自定义上传
+    const customUpload = async (options: UploadRequestOptions) => {
+      const { file, onSuccess, onError } = options
+      try {
+        // TODO: 实现实际的上传逻辑
+        const formData = new FormData()
+        formData.append('file', file)
+        
+        // 模拟上传
+        setTimeout(() => {
+          onSuccess?.({ url: '001' })
+        }, 1000)
+      } catch (error) {
+        const err: UploadError = {
+          status: 500,
+          method: 'POST',
+          url: '',
+          message: error instanceof Error ? error.message : '上传失败'
+        }
+        onError?.(err)
+        ElMessage.error('上传失败')
+      }
+    }
+
+    return () => (
+      <div class="upload-image">
+        <ElUpload
+          class="avatar-uploader"
+          show-file-list={false}
+          http-request={customUpload}
+          on-success={handleSuccess}
+          before-upload={beforeUpload}
+        >
+          {imageUrl.value ? (
+            <img src={imageUrl.value} class="avatar" alt="avatar" />
+          ) : (
+            <div class="avatar-uploader-icon">
+              <ElIcon size={20}>
+                <Plus />
+              </ElIcon>
+            </div>
+          )}
+        </ElUpload>
+      </div>
+    )
+  }
+})

src/components/Upload/uploadImage.scss

@@ -0,0 +1,31 @@
+.upload-image {
+  .avatar-uploader {
+    :deep(.el-upload) {
+      border: 1px dashed var(--el-border-color);
+      border-radius: 6px;
+      cursor: pointer;
+      position: relative;
+      overflow: hidden;
+      transition: var(--el-transition-duration);
+
+      &:hover {
+        border-color: var(--el-color-primary);
+      }
+    }
+  }
+
+  .avatar-uploader-icon {
+    width: 178px;
+    height: 178px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    color: var(--el-text-color-secondary);
+  }
+
+  .avatar {
+    width: 178px;
+    height: 178px;
+    display: block;
+  }
+} 

src/views/DeliveryWarehouse/DeliveryWarehouseList/compontents/CreateForm.vue

@@ -0,0 +1,574 @@
+<template>
+  <Dialog v-model="dialogVisible" :defineFullscreen="true" :fullscreen="false" :title="dialogTitle"
+          width="800">
+    <!--    <a-select  >-->
+    <!--      <a-option :index="0" :value="true">是</a-option>-->
+    <!--      <a-option :value="false">否</a-option>-->
+    <!--    </a-select>-->
+    <template #title>
+      <MyRadio v-model="active">
+        <my-radio-item name="单位信息">
+          <template #name>
+            单位信息
+          </template>
+        </my-radio-item>
+        <my-radio-item name="库区信息">
+          <template #name>
+            库区信息
+          </template>
+        </my-radio-item>
+        <my-radio-item name="仓房信息">
+          <template #name>
+            仓房信息
+          </template>
+        </my-radio-item>
+        <my-radio-item name="财务信息">
+          <template #name>
+            财务信息
+          </template>
+        </my-radio-item>
+      </MyRadio>
+    </template>
+    <ContentWrap>
+      <el-form
+        v-show="active === '单位信息'" ref="formRef1" :model="dwxxReqVO" :rules="formRules1"
+               label-width="180">
+        <el-row>
+          <el-col :span="8">
+            <el-form-item label="单位名称" prop="dwmc">
+              <el-input v-model="dwxxReqVO.dwmc" placeholder="请输入单位名称"/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="统一信用代码" prop="tyxydm">
+              <el-input v-model="dwxxReqVO.tyxydm" placeholder="请输入统一信用代码"/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="法定代表人" prop="fddbr">
+              <el-input v-model="dwxxReqVO.fddbr" placeholder="请输入法定代表人"/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="身份证号" prop="sfzh">
+              <el-input v-model="dwxxReqVO.sfzh" placeholder="请输入身份证号"/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="联系方式" prop="lxfs">
+              <el-input v-model="dwxxReqVO.lxfs" placeholder="请输入联系方式"/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="注册日期" prop="zcrq">
+              <el-date-picker
+                v-model="dwxxReqVO.zcrq"
+                type="date"
+                placeholder="请选择注册日期"
+              />
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="注册地址" prop="zcdz">
+
+              <el-input v-model="dwxxReqVO.zcdz" placeholder="请输入注册地址"/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="邮政编码" prop="yzbm">
+              <el-input v-model="dwxxReqVO.yzbm" placeholder="请输入邮政编码"/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="企业性质" prop="qyxz">
+              <el-input v-model="dwxxReqVO.qyxz" placeholder="请选择企业性质"/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="上传营业执照" prop="resid">
+<!--              <el-upload-->
+<!--                class="avatar-uploader"-->
+<!--                action="https://run.mocky.io/v3/9d059bf9-4660-45f2-925d-ce80ad6c4d15"-->
+<!--                :show-file-list="false"-->
+<!--                :on-success="handleAvatarSuccess"-->
+<!--                :before-upload="beforeAvatarUpload"-->
+<!--              >-->
+<!--                <img v-if="imageUrl" :src="imageUrl" class="avatar" />-->
+<!--                <el-icon v-else class="avatar-uploader-icon"><Plus /></el-icon>-->
+<!--              </el-upload>-->
+              <el-input v-model="dwxxReqVO.resid" placeholder="上传营业执照"/>
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+      <el-form
+        v-show="active === '库区信息'" ref="formRef2" :model="kqxxReqVO" :rules="formRules2"
+               label-width="180">
+        <el-row>
+          <el-col :span="8">
+            <el-form-item label="库区名称" prop="kqmc">
+              <el-input v-model="kqxxReqVO.kqmc" placeholder="请输入库区名称"/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="库区统一编码" prop="kqdm">
+              <el-input v-model="kqxxReqVO.kqdm" placeholder="请输入库区统一编码"/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="邮政编码" prop="yzbm">
+              <el-input v-model="kqxxReqVO.yzbm" placeholder="请输入邮政编码"/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="16">
+            <el-form-item label="行政区划">
+              <div style="width:100%;display: flex;justify-content: space-around">
+                <el-select v-model="kqxxReqVO.sheng" placeholder="省">
+                  <el-option v-for="item in shengList" :key="item.areaCode" :label="item.areaName"
+                             :value="item.areaCode"/>
+                </el-select>
+                <el-select v-model="kqxxReqVO.shi" placeholder="市区">
+                  <el-option v-for="item in shiList" :key="item.areaCode" :label="item.areaName"
+                             :value="item.areaCode"/>
+                </el-select>
+                <el-select v-model="kqxxReqVO.xian" placeholder="区县">
+                  <el-option v-for="item in xianList" :key="item.areaCode" :label="item.areaName"
+                             :value="item.areaCode"/>
+                </el-select>
+              </div>
+
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="具体地址" prop="jtdz">
+              <el-input v-model="kqxxReqVO.jtdz" placeholder="请输入具体地址"/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="库区负责人(实际产权人)" prop="kqfzr">
+              <el-input v-model="kqxxReqVO.kqfzr" placeholder="请输入库区负责人"/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="联系电话" prop="lxdh">
+              <el-input v-model="kqxxReqVO.lxdh" placeholder="请选择注册日期"/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="占地面积(m²)" prop="zdmj">
+              <el-input v-model="kqxxReqVO.zdmj" placeholder="请输入占地面积"/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="库区状态" prop="kqzt">
+              <el-input v-model="kqxxReqVO.kqzt" placeholder="请选择库区状态"/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="租仓参考价(元)" prop="zcckj">
+              <el-input v-model="kqxxReqVO.zcckj" placeholder="租仓参考价"/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="委托保管参考价:(元/吨)" prop="wtbgckj">
+              <el-input v-model="kqxxReqVO.wtbgckj" placeholder="租仓参考价"/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="经纬度" prop="jd">
+              <div style="display: flex;justify-content: space-around">
+                <el-input v-model="kqxxReqVO.jd" placeholder="经度"/>
+                <div>
+                  -
+                </div>
+                <el-input v-model="kqxxReqVO.wd" placeholder="纬度"/>
+              </div>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="上传库区图" prop="resid">
+              <!--                <el-image-->
+              <el-input v-model="kqxxReqVO.resid" placeholder="上传库区图"/>
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+      <el-form
+        v-show="active === '仓房信息'" ref="formRef3" :model="caxxReqVOList"
+               :rules="formRules3"
+               label-width="180">
+        <a-table :columns="tableColumns" :data="caxxReqVOList">
+          <template #index="{  rowIndex  }">
+            {{ rowIndex + 1 }}
+          </template>
+          <template #cfName="{ record  }">
+            <a-input v-model="caxxReqVOList[record.index].cfmc"/>
+          </template>
+          <template #cfType="{ record  }">
+            <a-select v-model="caxxReqVOList[record.index].cflx">
+              <a-option v-for="item in getIntDictOptions('system_cflx')" :key="item.value"
+                        :value="item.value">{{ item.label }}
+              </a-option>
+            </a-select>
+          </template>
+          <template #cfCode="{ record  }">
+            <a-input v-model="caxxReqVOList[record.index].cfbm"/>
+          </template>
+          <template #cfState="{ record  }">
+            <a-select v-model="caxxReqVOList[record.index].cazt">
+              <a-option v-for="item in getIntDictOptions('system_cazt')" :key="item.value"
+                        :value="item.value">{{ item.label }}
+              </a-option>
+            </a-select>
+          </template>
+          <template #sjcr="{ record  }">
+            <a-input v-model="caxxReqVOList[record.index].sjcr"/>
+          </template>
+          <template #qtcxsysm="{ record  }">
+            <a-input v-model="caxxReqVOList[record.index].qtcxsm"/>
+          </template>
+          <template #edit="{ record  }">
+            <a-button style="font-size: 16px" @click="deleteItem(record)">
+              -
+            </a-button>
+          </template>
+          <template #editHeader>
+            <a-button class="" style="font-size: 16px" @click="addItem()">
+              +
+            </a-button>
+          </template>
+        </a-table>
+      </el-form>
+      <el-form
+        v-show="active === '财务信息'" ref="formRef4" :model="cwxxReqVO" :rules="formRules4"
+               label-width="180">
+        <el-row>
+          <el-col :span="8">
+            <el-form-item label="是否国有及国有控股:">
+              <el-radio-group v-model="cwxxReqVO.sfgykg">
+                <el-radio :value="0">是</el-radio>
+                <el-radio :value="1">否</el-radio>
+              </el-radio-group>
+            </el-form-item>
+          </el-col>
+          <el-col :span="7">
+            <span style="display: none"></span>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="上一年总资产">
+              <el-input v-model="cwxxReqVO.syndzzc"/>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row style="display: flex;justify-content: space-between">
+          <el-col v-for="(item,index) in cwxxReqVO.cwxxYearList" :key="index" :span="8">
+            <el-card style="width: 95%;margin: 0 auto">
+              <template #header>
+                {{ item.cn }}年财务情况
+              </template>
+              <el-row>
+                <el-col :span="24">
+                  <el-form-item label="总负债" label-width="80px">
+                    <el-input v-model="item.zfz" class="w-[85%]!"/> &nbsp; &nbsp; 万元
+                  </el-form-item>
+                </el-col>
+                <el-col :span="24">
+                  <el-form-item label="营业收入" label-width="80px">
+                    <el-input v-model="item.yysr" class="w-[85%]! "/> &nbsp; &nbsp; 万元
+                  </el-form-item>
+                </el-col>
+                <el-col :span="24">
+                  <el-form-item label="净利润" label-width="80px">
+                    <el-input v-model="item.jlr" class="w-[85%]! "/> &nbsp; &nbsp; 万元
+                  </el-form-item>
+                </el-col>
+              </el-row>
+            </el-card>
+          </el-col>
+        </el-row>
+      </el-form>
+    </ContentWrap>
+    <template #footer>
+      <el-button :disabled="formLoading" type="primary" @click="submitForm">确 定</el-button>
+      <el-button @click="dialogVisible = false">取 消</el-button>
+    </template>
+  </Dialog>
+</template>
+<script lang="ts" setup>
+import { ref, reactive, watch, onMounted } from 'vue'
+import { useI18n } from 'vue-i18n'
+import { FormRules } from 'element-plus'
+import MyRadio from '@/components/MyRadio/index.vue'
+import MyRadioItem from '@/components/MyRadio/MyRadioItem.vue'
+import { DeliveryWarehouseSelectApi } from '@/api/DeliveryWarehouse/DeliveryWarehouseSelect'
+import { CaxxSaveReqVO } from '@/api/DeliveryWarehouse/DeliveryWarehouseSelect/interface/CaxxSaveReqVO'
+import { CwxxRespVO } from '@/api/DeliveryWarehouse/DeliveryWarehouseSelect/interface/CwxxRespVO'
+import { KqxxSaveReqVO } from '@/api/DeliveryWarehouse/DeliveryWarehouseSelect/interface/KqxxSaveReqVO'
+import { DwxxSaveReqVO } from '@/api/DeliveryWarehouse/DeliveryWarehouseSelect/interface/DwxxSaveReqVO'
+import { DeliverySaveVO } from '@/api/DeliveryWarehouse/DeliveryWarehouseSelect/interface/DeliverySaveVO'
+import { AdministrativeDivisionApi } from '@/api/system/administrativeDivision'
+import { getIntDictOptions } from '@/utils/dict'
+
+// 接口定义
+interface TableColumn {
+  title: string
+  dataIndex: string
+  slotName: string
+  align: 'left' | 'center' | 'right'
+  width?: number
+  titleSlotName?: string
+}
+
+interface AreaOption {
+  areaCode: string | number
+  areaName: string
+}
+
+interface CaxxItem {
+  index?: number
+  cfmc?: string
+  cflx?: string
+  cfbm?: string
+  cazt?: string
+  sjcr?: string
+  qtcxsm?: string
+}
+
+// 组件配置
+defineOptions({ name: 'CreateForm' })
+
+// 国际化
+const { t } = useI18n()
+// const { message } = useMessage()
+
+// 表单状态
+const dialogVisible = ref(false)
+const dialogTitle = ref('新增库区')
+const formLoading = ref(false)
+const formType = ref('')
+const active = ref('单位信息')
+
+// 表单引用
+const formRef1 = ref()
+const formRef2 = ref()
+const formRef3 = ref()
+const formRef4 = ref()
+
+// 表单数据
+const formData = ref<DeliverySaveVO>({
+  dwxxReqVO: { dwmc: '' },
+  kqxxReqVO: {},
+  caxxReqVOList: [],
+  cwxxReqVO: {}
+})
+
+const dwxxReqVO = ref<DwxxSaveReqVO>({})
+const kqxxReqVO = ref<KqxxSaveReqVO>({})
+const caxxReqVOList = ref<CaxxSaveReqVO[]>([])
+const cwxxReqVO = ref<CwxxRespVO>({
+  cwxxYearList: [
+    { cn: '2023', zfz: '', yysr: '', jlr: '' },
+    { cn: '2022', zfz: '', yysr: '', jlr: '' },
+    { cn: '2021', zfz: '', yysr: '', jlr: '' }
+  ],
+  sfgykg: 0,
+  syndzzc: ''
+})
+
+// 行政区划数据
+const shengList = ref<AreaOption[]>([])
+const shiList = ref<AreaOption[]>([])
+const xianList = ref<AreaOption[]>([])
+
+// 表格配置
+const tableColumns: TableColumn[] = [
+  { title: '序号', dataIndex: 'index', slotName: 'index', align: 'center', width: 60 },
+  { title: '仓房名称', dataIndex: 'cfName', slotName: 'cfName', align: 'center' },
+  { title: '仓房类型', dataIndex: 'cfType', slotName: 'cfType', align: 'center' },
+  { title: '仓房编号', dataIndex: 'cfCode', slotName: 'cfCode', align: 'center' },
+  { title: '仓房状态', dataIndex: 'cfState', slotName: 'cfState', align: 'center' },
+  { title: '设计仓容（吨）', dataIndex: 'sjcr', slotName: 'sjcr', align: 'center' },
+  { title: '其他仓型使用说明', dataIndex: 'qtcxsysm', slotName: 'qtcxsysm', align: 'center' },
+  { title: '+', dataIndex: 'edit', slotName: 'edit', titleSlotName: 'editHeader', align: 'center' }
+]
+
+// 表单校验规则
+const formRules1 = reactive<FormRules>({
+  dwmc: [{ required: true, message: '请输入', trigger: 'blur' }],
+  tyxydm: [{ required: true, message: '请输入', trigger: 'blur' }],
+  fddbr: [{ required: true, message: '请输入', trigger: 'blur' }],
+  sfzh: [{ required: true, message: '请输入', trigger: 'blur' }],
+  lxfs: [{ required: true, message: '请输入', trigger: 'blur' }],
+  zcrq: [{ required: true, message: '请输入', trigger: 'blur' }],
+  zcdz: [{ required: true, message: '请输入', trigger: 'blur' }],
+  yzbm: [{ required: true, message: '请输入', trigger: 'blur' }],
+  qyxz: [{ required: true, message: '请选择', trigger: 'blur' }],
+  resid: [{ required: true, message: '请选择', trigger: 'blur' }]
+})
+const formRules2 = reactive<FormRules>({
+  kqmc: [{ required: true, message: '请输入', trigger: 'blur' }],
+  kqdm: [{ required: true, message: '请输入', trigger: 'blur' }],
+  yzbm: [{ required: true, message: '请输入', trigger: 'blur' }],
+  sheng: [{ required: true, message: '请输入', trigger: 'blur' }],
+  shi: [{ required: true, message: '请输入', trigger: 'blur' }],
+  xian: [{ required: true, message: '请输入', trigger: 'blur' }],
+  jtdz: [{ required: true, message: '请输入', trigger: 'blur' }],
+  kqfzr: [{ required: true, message: '请输入', trigger: 'blur' }],
+  lxdh: [{ required: true, message: '请输入', trigger: 'blur' }],
+  zdmj: [{ required: true, message: '请输入', trigger: 'blur' }],
+  kqzt: [{ required: true, message: '请输入', trigger: 'blur' }],
+  wtbgckj: [{ required: true, message: '请输入', trigger: 'blur' }],
+  jd: [{ required: true, message: '请输入', trigger: 'blur' }],
+  wd: [{ required: true, message: '请输入', trigger: 'blur' }],
+  resid: [{ required: true, message: '请输入', trigger: 'blur' }]
+})
+const formRules3 = reactive<FormRules>({})
+const formRules4 = reactive<FormRules>({})
+
+// 方法定义
+/**
+ * 打开弹窗
+ */
+const open = async (type: string, id?: number) => {
+  dialogVisible.value = true
+  formType.value = type
+  resetForm()
+  if (id) {
+    formLoading.value = true
+    try {
+      // 获取数据
+    } finally {
+      formLoading.value = false
+    }
+  }
+}
+
+/**
+ * 重置表单
+ */
+const resetForm = () => {
+  formRef1.value?.resetFields();
+  formRef2.value?.resetFields();
+  formRef3.value?.resetFields();
+  formRef4.value?.resetFields();
+  dwxxReqVO.value = {};
+  kqxxReqVO.value = {};
+  caxxReqVOList.value = [];
+  cwxxReqVO.value = {
+    cwxxYearList: [
+      { cn: '2023', zfz: '', yysr: '', jlr: '' },
+      { cn: '2022', zfz: '', yysr: '', jlr: '' },
+      { cn: '2021', zfz: '', yysr: '', jlr: '' }
+    ],
+    sfgykg: 0,
+    syndzzc: ''
+  }
+}
+
+/**
+ * 删除仓房项
+ */
+const deleteItem = (record: CaxxItem) => {
+  caxxReqVOList.value = caxxReqVOList.value.filter(item => item.index !== record.index)
+  caxxReqVOList.value.forEach((item, index) => {
+    item.index = index
+  })
+}
+
+/**
+ * 添加仓房项
+ */
+const addItem = () => {
+  caxxReqVOList.value.unshift({})
+  caxxReqVOList.value.forEach((item, index) => {
+    item.index = index
+  })
+}
+
+/**
+ * 获取行政区划数据
+ */
+const getDivision = async (areaCode?: string): Promise<AreaOption[]> => {
+  try {
+    return await AdministrativeDivisionApi.getList({ areaCode })
+  } catch (err) {
+    throw err
+  }
+}
+
+/**
+ * 提交表单
+ */
+const submitForm = async () => {
+  //校验表单
+  try {
+    await formRef1.value?.validate()
+    await formRef2.value?.validate()
+    await formRef3.value?.validate()
+    await formRef4.value?.validate()
+  }catch (err){
+    Message.error('请仔细检查表单')
+    return
+  }
+
+  formLoading.value = true
+  try {
+    if (formType.value === 'create') {
+      formData.value.dwxxReqVO = dwxxReqVO.value
+      formData.value.kqxxReqVO = kqxxReqVO.value
+      formData.value.caxxReqVOList = caxxReqVOList.value
+      formData.value.cwxxReqVO = cwxxReqVO.value
+      await DeliveryWarehouseSelectApi.createByAll(formData.value)
+      Message.success(t('common.createSuccess'))
+    } else {
+      Message.success(t('common.updateSuccess'))
+    }
+    dialogVisible.value = false
+    emit('success')
+  } finally {
+    formLoading.value = false
+  }
+}
+
+// 监听器设置
+watch(() => kqxxReqVO.value.sheng, async (newValue) => {
+  kqxxReqVO.value.shi = ''
+  kqxxReqVO.value.xian = ''
+  if (newValue) {
+    shiList.value = await getDivision(newValue)
+  } else {
+    shiList.value = []
+  }
+})
+
+watch(() => kqxxReqVO.value.shi, async (newValue) => {
+  kqxxReqVO.value.xian = ''
+  if (newValue) {
+    xianList.value = await getDivision(newValue)
+  } else {
+    xianList.value = []
+  }
+})
+
+// 生命周期钩子
+onMounted(async () => {
+  shengList.value = await getDivision()
+})
+
+// 暴露方法
+defineExpose({ open })
+
+// 定义事件
+const emit = defineEmits(['success'])
+</script>
+<style>
+
+.arco-trigger-popup {
+  z-index: 2400 !important;
+}
+.el-date-editor.el-input, .el-date-editor.el-input__wrapper {
+  height: var(--el-input-height, var(--el-component-size));
+  width: var(--el-date-editor-width);
+  width: 100%;
+}
+</style>

src/views/DeliveryWarehouse/DeliveryWarehouseList/compontents/Form.vue

@@ -0,0 +1,178 @@
+<template>
+  <Dialog v-model="dialogVisible" :title="dialogTitle" width="80%">
+    <div>
+      <el-table
+        v-loading="formLoading"
+        :border="true" :data="list" :header-cell-style="{
+            background: 'rgba(248,248,249,1)', color: 'rgb(79,79,79)', height: '45px'
+        }" class="mb-50px" @selection-change="handleSelectionChange">
+        <el-table-column :selectable="selectable" align="center" type="selection" width="60"/>
+        <el-table-column align="center" label="库区名称" prop="kqmc"/>
+        <el-table-column align="center" label="仓廒名称" prop="camc"/>
+        <el-table-column align="center" label="仓房类型" prop="cflx">
+          <template #default="scope">
+            <dict-tag :type="DICT_TYPE.SYSTEM_CFLX" :value="scope.row.cflx"/>
+          </template>
+        </el-table-column>
+        <el-table-column align="center" label="仓房状态" prop="cazt">
+          <template #default="scope">
+            <dict-tag :type="DICT_TYPE.SYSTEM_CAZT" :value="scope.row.cazt"/>
+          </template>
+        </el-table-column>
+        <el-table-column align="center" label="设计仓容（吨）" prop="sjcr"/>
+      </el-table>
+      <!--      <Pagination-->
+      <!--        style="margin-top: -30px;"-->
+      <!--        v-model:limit="queryParams.pageSize"-->
+      <!--        v-model:page="queryParams.pageNo"-->
+      <!--        :total="total"-->
+      <!--        @pagination="handleQuery"-->
+      <!--      />-->
+    </div>
+
+    <template #footer>
+      <el-button :disabled="formLoading" type="primary" @click="submitForm">确 定</el-button>
+      <el-button @click="dialogVisible = false">取 消</el-button>
+    </template>
+  </Dialog>
+</template>
+<script lang="ts" setup>
+import { ref } from 'vue'
+import { useI18n } from 'vue-i18n'
+import { useMessage } from '@/hooks/web/useMessage'
+import { DeliveryWarehouseSelectApi } from '@/api/DeliveryWarehouse/DeliveryWarehouseSelect'
+import { DICT_TYPE } from '@/utils/dict'
+
+// 接口定义
+interface QueryParams {
+  pageNo: number
+  pageSize: number
+}
+
+interface TableRow {
+  id: number | string
+  kqmc: string // 库区名称
+  camc: string // 仓廒名称
+  cflx: string // 仓房类型
+  cazt: string // 仓房状态
+  sjcr: number // 设计仓容
+}
+
+interface SubmitData {
+  ids: (number | string)[]
+  yxcf: number
+}
+
+// 组件配置
+defineOptions({ name: 'DeliveryWarehouseSelectForm' })
+
+// 国际化
+const { t } = useI18n()
+const message = useMessage()
+
+// 组件状态
+const dialogVisible = ref(false)
+const dialogTitle = ref('仓房列表')
+const formLoading = ref(false)
+const formType = ref('')
+const list = ref<TableRow[]>([])
+// const total = ref(0)
+const multipleSelection = ref<TableRow[]>([])
+
+// 查询参数
+const queryParams = ref<QueryParams>({
+  pageNo: 1,
+  pageSize: 10
+})
+
+/**
+ * 打开弹窗
+ */
+const open = async (type: string, row?: any) => {
+  dialogVisible.value = true
+  formType.value = type
+  resetForm()
+
+  if (row) {
+    formLoading.value = true
+    try {
+      queryParams.value = row
+      await handleQuery()
+    } finally {
+      formLoading.value = false
+    }
+  }
+}
+
+/**
+ * 查询列表数据
+ */
+const handleQuery = async () => {
+  try {
+    list.value = await DeliveryWarehouseSelectApi.getDeliveryWarehouseSelectList(queryParams.value)
+  } catch (err) {
+    message.error('获取列表失败')
+    throw err
+  }
+}
+
+/**
+ * 重置表单
+ */
+const resetForm = () => {
+  list.value = []
+  multipleSelection.value = []
+}
+
+/**
+ * 判断行是否可选
+ */
+const selectable = (row: TableRow) => ![1, 2].includes(Number(row.id))
+
+/**
+ * 处理选择变更
+ */
+const handleSelectionChange = (val: TableRow[]) => {
+  multipleSelection.value = val
+}
+
+/**
+ * 提交表单
+ */
+const submitForm = async () => {
+  if (!multipleSelection.value.length) {
+    Message.warning('请选择仓房')
+    return
+  }
+
+  formLoading.value = true
+  try {
+    if (formType.value === 'create') {
+      const submitData: SubmitData = {
+        ids: multipleSelection.value.map(item => item.id),
+        yxcf: 1
+      }
+      await DeliveryWarehouseSelectApi.submitSelectList(submitData)
+      Message.success(t('common.createSuccess'))
+    } else {
+      Message.success(t('common.updateSuccess'))
+    }
+    dialogVisible.value = false
+    emit('success')
+  } finally {
+    formLoading.value = false
+  }
+}
+
+// 暴露方法
+defineExpose({ open })
+
+// 定义事件
+const emit = defineEmits(['success'])
+</script>
+
+<style lang="scss" scoped>
+.mb-50px {
+  margin-bottom: 50px;
+}
+</style>

src/views/DeliveryWarehouse/DeliveryWarehouseList/index.vue

@@ -1,6 +1,13 @@
 <script lang="ts" setup>
-import { ref, watch, onMounted, onUnmounted } from 'vue'
-import { AdministrativeDivisionApi } from '@/api/system/administrativeDivision'
+import {onMounted, onUnmounted, ref, watch} from 'vue'
+import {AdministrativeDivisionApi} from '@/api/system/administrativeDivision'
+import {DeliveryWarehouseListApi} from "@/api/DeliveryWarehouse/DeliveryWarehouseList";
+import router from "@/router";
+import CreateForm
+  from "@/views/DeliveryWarehouse/DeliveryWarehouseList/compontents/CreateForm.vue";
+import DeliveryWarehouseSelectFrom
+  from "@/views/DeliveryWarehouse/DeliveryWarehouseList/compontents/Form.vue";
+import download from "@/utils/download";
 
 // 定义查询参数接口
 interface QueryParams {
@@ -22,14 +29,14 @@ interface QueryParams {
 
 // 定义列表项接口
 interface ListItem {
-  province: string // 省份
-  urbanArea: string // 市区
-  countyDistrict: string // 县区
-  enterpriseName: string // 企业名称
-  warehouseAreaName: string // 库区名称
-  totalWarehouseCapacity: string // 总仓容
-  numberOfWarehouseCapacity: string // 仓房数量
-  selectedWarehouse: string // 选中仓库
+  sheng: string // 省份
+  shi: string // 市区
+  xian: string // 县区
+  dwmc: string // 企业名称
+  kqmc: string // 库区名称
+  syndzzc: string // 总仓容
+  jlr: string // 上一年度净利润
+  yxcfnum: string // 上一年度净利润
 }
 
 // 定义行政区划接口
@@ -65,20 +72,9 @@ const loading = ref<boolean>(false)
 const total = ref<number>(0)
 const queryFormRef = ref()
 const refForm = ref()
-
+const refCreateForm = ref()
 // 列表数据 ref
-const list = ref<ListItem[]>([
-  {
-    province: '天津市',
-    urbanArea: '天津',
-    countyDistrict: '宝坻区',
-    enterpriseName: '天津利达粮油储运有限公司',
-    warehouseAreaName: '天津利达粮油库',
-    totalWarehouseCapacity: '4500',
-    numberOfWarehouseCapacity: '52',
-    selectedWarehouse: '8'
-  }
-])
+const list = ref<ListItem[]>([])
 
 // 地区数据 refs
 const shengList = ref<DivisionItem[]>([])
@@ -92,14 +88,33 @@ const stopWatches: (() => void)[] = []
  * 查询列表数据
  * @description 加载数据并更新loading状态
  */
-const handleQuery = () => {
+const handleQuery = async () => {
   loading.value = true
   // TODO: 实现实际的数据获取逻辑
-  setTimeout(() => {
+  try {
+    const data = await DeliveryWarehouseListApi.getDeliveryWarehouseListPage(queryParams.value);
+    list.value = data.list;
+    total.value = data.total;
+  } catch (err) {
+    console.error(err)
+  } finally {
     loading.value = false
-  }, 1000)
+  }
 }
 
+
+const handleExport = async () => {
+  // Loding.start()
+  try {
+    const excel = await DeliveryWarehouseListApi.exportDeliveryWarehouseList(queryParams.value);
+    download.excel(excel, '导出.xls')
+    Message.success('导出成功')
+  } catch (err) {
+    console.error(err)
+  } finally {
+    // Loding.start()
+  }
+}
 /**
  * 重置查询表单
  * @description 重置页码、表单字段并重新查询
@@ -115,11 +130,21 @@ const resetQuery = () => {
  * @description 用于导出功能
  * @param type - 操作类型
  */
-const openForm = (type: string) => {
-  refForm.value.open(type)
-  console.log(type)
+const openForm = async (row: any, type: number) => {
+  try {
+    refForm.value.open('create', {...row, yxcf: type})
+  } catch (err) {
+    console.error('打开表单失败:', err)
+  }
 }
 
+
+/**
+ * 打开创建表单
+ */
+const openCreateForm = (type: string) => {
+  refCreateForm.value.open(type)
+}
 /**
  * 获取行政区划数据
  * @description 根据区域代码获取下级行政区划
@@ -128,7 +153,7 @@ const openForm = (type: string) => {
  */
 const getDivision = async (areaCode?: string): Promise<DivisionItem[]> => {
   try {
-    return await AdministrativeDivisionApi.getList({ areaCode })
+    return await AdministrativeDivisionApi.getList({areaCode})
   } catch (err) {
     throw err
   }
@@ -161,7 +186,8 @@ stopWatches.push(
 
 // 生命周期钩子：组件挂载时获取省份数据
 onMounted(async () => {
-  shengList.value = await getDivision()
+  shengList.value = await getDivision();
+  await handleQuery();
 })
 
 // 组件卸载时清理
@@ -188,32 +214,35 @@ onUnmounted(() => {
     >
       <el-form-item label="所属省份" prop="shengCode">
         <el-select
-                   v-model="queryParams.shengCode"
-                   class="!w-240px"
-                   clearable
-                   placeholder="所属省份">
-          <el-option v-for="item in shengList" :key="item.id" :label="item.areaName" :value="item.areaCode"/>
+          v-model="queryParams.shengCode"
+          class="!w-240px"
+          clearable
+          placeholder="所属省份">
+          <el-option v-for="item in shengList" :key="item.id" :label="item.areaName"
+                     :value="item.areaCode"/>
 
         </el-select>
 
       </el-form-item>
       <el-form-item label="所属市区" prop="shiuCode">
         <el-select
-                   v-model="queryParams.shiCode"
-                   class="!w-240px"
-                   clearable
-                   placeholder="所属省份">
-          <el-option v-for="item in shiList" :key="item.id" :label="item.areaName" :value="item.areaCode"/>
+          v-model="queryParams.shiCode"
+          class="!w-240px"
+          clearable
+          placeholder="所属省份">
+          <el-option v-for="item in shiList" :key="item.id" :label="item.areaName"
+                     :value="item.areaCode"/>
 
         </el-select>
       </el-form-item>
       <el-form-item label="所属县区" prop="xianCode">
         <el-select
-                   v-model="queryParams.xianCode"
-                   class="!w-240px"
-                   clearable
-                   placeholder="所属省份">
-          <el-option v-for="item in xianList" :key="item.id" :label="item.areaName" :value="item.areaCode"/>
+          v-model="queryParams.xianCode"
+          class="!w-240px"
+          clearable
+          placeholder="所属省份">
+          <el-option v-for="item in xianList" :key="item.id" :label="item.areaName"
+                     :value="item.areaCode"/>
 
         </el-select>
       </el-form-item>
@@ -226,17 +255,9 @@ onUnmounted(() => {
       <el-form-item label="库区名称" prop="kqmc">
         <el-input
           v-model="queryParams.kqmc"
-          placeholder="所属市区"
-          clearable
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="仓房仓容" prop="cfcr">
-        <el-input
-          v-model="queryParams.cfcr"
           class="!w-240px"
           clearable
-          placeholder="仓房仓容"
+          placeholder="所属市区"
         />
       </el-form-item>
       <el-form-item>
@@ -251,11 +272,24 @@ onUnmounted(() => {
         <el-button
           plain
           type="success"
-          @click="openForm('create')"
+          @click="handleExport"
         >
           <Icon class="mr-5px" icon="ep:download"/>
           导出
         </el-button>
+        <el-button
+          v-hasPermi="['coding:dwxx:create']"
+          plain
+          type="primary"
+          @click="openCreateForm('create')"
+        >
+          <Icon class="mr-5px" icon="ep:plus"/>
+          新增库区
+        </el-button>
+        <el-button @click="router.push('/DeliveryWarehouse/select')">
+          <Icon class="mr-5px" icon="ep:refresh"/>
+          返回
+        </el-button>
       </el-form-item>
     </el-form>
     <el-divider/>
@@ -266,18 +300,20 @@ onUnmounted(() => {
     >
       <el-table-column align="center" fixed="left" type="selection" width="60"/>
       <el-table-column align="center" fixed="left" label="序号" type="index" width="60"/>
-      <el-table-column align="center" label="所属省份" prop="province" width="180"/>
-      <el-table-column align="center" label="所属市区" prop="urbanArea" width="180"/>
-      <el-table-column align="center" label="所属县区" prop="countyDistrict" width="180"/>
-      <el-table-column align="center" label="企业名称" prop="enterpriseName" width="280"/>
-      <el-table-column align="center" label="库区名称" prop="warehouseAreaName" width="280"/>
-      <el-table-column align="center" label="仓房数量(个)" prop="warehouseAreaName" width="280"/>
-      <el-table-column align="center" label="总资产(万元)" prop="warehouseAreaName" width="280"/>
-      <el-table-column align="center" label="上一年度净利润(万元)" prop="warehouseAreaName" width="280"/>
-      <el-table-column align="center" label="库区联系人" prop="warehouseAreaName" width="280"/>
-      <el-table-column align="center" label="联系电话" prop="warehouseAreaName" width="280"/>
-      <el-table-column align="center" label="核验人员" prop="warehouseAreaName" width="280"/>
-      <el-table-column align="center" label="查看状态" prop="warehouseAreaName" width="280"/>
+      <el-table-column align="center" label="所属省份" prop="sheng" width="180"/>
+      <el-table-column align="center" label="所属市区" prop="shi" width="180"/>
+      <el-table-column align="center" label="所属县区" prop="xian" width="180"/>
+      <el-table-column align="center" label="企业名称" prop="dwmc" width="280"/>
+      <el-table-column align="center" label="库区名称" prop="kqmc" width="280"/>
+      <el-table-column align="center" label="总资产(万元)" prop="syndzzc" width="280"/>
+      <el-table-column align="center" label="上一年度净利润(万元)" prop="jlr" width="280"/>
+      <el-table-column align="center" label="备选交收仓(个)" prop="yxcfnum" width="280">
+         <template #default="scope">
+           <div @click="openForm(scope.row,2)" > {{scope.yxcfnum}}</div>
+         </template>
+      </el-table-column>
+      <el-table-column align="center" label="库区联系人" prop="name" width="280"/>
+      <el-table-column align="center" label="联系电话" prop="phone" width="280"/>
     </el-table>
     <Pagination
       v-model:limit="queryParams.pageSize"
@@ -285,6 +321,8 @@ onUnmounted(() => {
       :total="total"
       @pagination="handleQuery"
     />
+    <DeliveryWarehouseSelectFrom ref="refForm" @success="handleQuery"/>
+    <CreateForm ref="refCreateForm" @success="handleQuery"/>
   </ContentWrap>
 </template>
 

src/views/DeliveryWarehouse/DeliveryWarehouseSelect/compontents/CreateForm.vue

@@ -31,7 +31,7 @@
     </template>
     <ContentWrap>
       <el-form
-        v-if="active === '单位信息'" ref="formRef1" :model="dwxxReqVO" :rules="formRules1"
+        v-show="active === '单位信息'" ref="formRef1" :model="dwxxReqVO" :rules="formRules1"
                label-width="180">
         <el-row>
           <el-col :span="8">
@@ -92,7 +92,7 @@
         </el-row>
       </el-form>
       <el-form
-        v-if="active === '库区信息'" ref="formRef2" :model="kqxxReqVO" :rules="formRules2"
+        v-show="active === '库区信息'" ref="formRef2" :model="kqxxReqVO" :rules="formRules2"
                label-width="180">
         <el-row>
           <el-col :span="8">
@@ -184,7 +184,7 @@
         </el-row>
       </el-form>
       <el-form
-        v-if="active === '仓房信息'" ref="formRef3" :model="caxxReqVOList"
+        v-show="active === '仓房信息'" ref="formRef3" :model="caxxReqVOList"
                :rules="formRules3"
                label-width="180">
         <a-table :columns="tableColumns" :data="caxxReqVOList">
@@ -230,7 +230,7 @@
         </a-table>
       </el-form>
       <el-form
-        v-if="active === '财务信息'" ref="formRef4" :model="cwxxReqVO" :rules="formRules4"
+        v-show="active === '财务信息'" ref="formRef4" :model="cwxxReqVO" :rules="formRules4"
                label-width="180">
         <el-row>
           <el-col :span="8">
@@ -437,10 +437,22 @@ const open = async (type: string, id?: number) => {
  * 重置表单
  */
 const resetForm = () => {
-  formRef1.value?.resetFields()
-  formRef2.value?.resetFields()
-  formRef3.value?.resetFields()
-  formRef4.value?.resetFields()
+  formRef1.value?.resetFields();
+  formRef2.value?.resetFields();
+  formRef3.value?.resetFields();
+  formRef4.value?.resetFields();
+  dwxxReqVO.value = {};
+  kqxxReqVO.value = {};
+  caxxReqVOList.value = [];
+  cwxxReqVO.value = {
+    cwxxYearList: [
+      { cn: '2023', zfz: '', yysr: '', jlr: '' },
+      { cn: '2022', zfz: '', yysr: '', jlr: '' },
+      { cn: '2021', zfz: '', yysr: '', jlr: '' }
+    ],
+    sfgykg: 0,
+    syndzzc: ''
+  }
 }
 
 /**
@@ -478,6 +490,17 @@ const getDivision = async (areaCode?: string): Promise<AreaOption[]> => {
  * 提交表单
  */
 const submitForm = async () => {
+  //校验表单
+  try {
+    await formRef1.value?.validate()
+    await formRef2.value?.validate()
+    await formRef3.value?.validate()
+    await formRef4.value?.validate()
+  }catch (err){
+    Message.error('请仔细检查表单')
+    return
+  }
+
   formLoading.value = true
   try {
     if (formType.value === 'create') {

src/views/DeliveryWarehouse/DeliveryWarehouseSelect/index.vue

@@ -283,7 +283,7 @@ onUnmounted(() => {
               重置
             </el-button>
             <el-button
-              v-hasPermi="['system:user:create']"
+              v-hasPermi="['coding:dwxx:create']"
               plain
               type="primary"
               @click="openCreateForm('create')"

tsconfig.json

@@ -39,5 +39,5 @@
     "src/types/auto-imports.d.ts",
     "src/types/auto-components.d.ts"
   ],
-  "exclude": ["dist", "target", "node_modules"]
+  "exclude": ["dist", "target", "node_modules","dist*"]
 }