Przeglądaj źródła

Merge branch 'qhse_person' of shuzhihua/pms-iot-vue into master

yanghao 4 dni temu
rodzic
commit
b56493abb0

+ 56 - 0
src/api/pms/qhse/index.ts

@@ -562,3 +562,59 @@ export const InspectDeviceCertApi = {
     return await request.download({ url: `/rq/qhse-device-cert/export-excel`, params })
   }
 }
+
+// 应急演练
+export const EmergencyDrillApi = {
+  // 获得应急演练分页
+  getEmergencyDrillList: async (params) => {
+    return await request.get({ url: `/rq/qhse-emergency-book/page`, params })
+  },
+  // 删除应急演练
+  deleteEmergencyDrill: async (id) => {
+    return await request.delete({ url: `/rq/qhse-emergency-book/delete?id=` + id })
+  },
+  // 添加应急演练
+  createEmergencyDrill: async (data) => {
+    return await request.post({ url: `/rq/qhse-emergency-book/create`, data })
+  },
+  // 获取详情
+  getEmergencyDrill: async (id) => {
+    return await request.get({ url: `/rq/qhse-emergency-book/get?id=` + id })
+  },
+  // 修改应急演练
+  updateEmergencyDrill: async (data) => {
+    return await request.put({ url: `/rq/qhse-emergency-book/update`, data })
+  },
+  // 导出应急演练 Excel
+  exportEmergencyDrill: async (params) => {
+    return await request.download({ url: `/rq/qhse-emergency-book/export-excel`, params })
+  }
+}
+
+// 应急演练证书检测
+export const EmergencyDrillCertApi = {
+  // 获得应急演练证书检测分页
+  getEmergencyDrillCertList: async (params) => {
+    return await request.get({ url: `/rq/qhse-emergency-cert/page`, params })
+  },
+  // 删除应急演练证书检测
+  deleteEmergencyDrillCert: async (id) => {
+    return await request.delete({ url: `/rq/qhse-emergency-cert/delete?id=` + id })
+  },
+  // 添加应急演练证书检测
+  createEmergencyDrillCert: async (data) => {
+    return await request.post({ url: `/rq/qhse-emergency-cert/create`, data })
+  },
+  // 获取详情
+  getEmergencyDrillCert: async (id) => {
+    return await request.get({ url: `/rq/qhse-emergency-cert/get?id=` + id })
+  },
+  // 修改应急演练证书检测
+  updateEmergencyDrillCert: async (data) => {
+    return await request.put({ url: `/rq/qhse-emergency-cert/update`, data })
+  },
+  // 导出应急演练证书检测 Excel
+  exportEmergencyDrillCert: async (params) => {
+    return await request.download({ url: `/rq/qhse-emergency-cert/export-excel`, params })
+  }
+}

+ 278 - 0
src/views/pms/qhse/emergencyDrill/CertDrawer.vue

@@ -0,0 +1,278 @@
+<template>
+  <el-drawer v-model="drawerVisible" title="证书检测列表" size="60%" :before-close="handleClose">
+    <div class="cert-drawer-content">
+      <el-form
+        :model="queryParams"
+        ref="queryFormRef"
+        class="bg-white dark:bg-[#1d1e1f] rounded-lg shadow px-4 pt-4 mb-4">
+        <div class="flex items-center gap-4 flex-wrap">
+          <el-form-item label="应急物资名称" prop="emergencyName">
+            <el-input
+              v-model="queryParams.emergencyName"
+              placeholder="请输入应急物资名称"
+              clearable
+              class="!w-150px" />
+          </el-form-item>
+          <el-form-item label="证书编号" prop="certNo">
+            <el-input
+              v-model="queryParams.certNo"
+              placeholder="请输入证书编号"
+              clearable
+              class="!w-200px" />
+          </el-form-item>
+          <el-form-item>
+            <el-button @click="handleQuery">
+              <Icon icon="ep:search" class="mr-5px" /> 搜索
+            </el-button>
+            <el-button @click="resetQuery">
+              <Icon icon="ep:refresh" class="mr-5px" /> 重置
+            </el-button>
+          </el-form-item>
+        </div>
+      </el-form>
+
+      <div class="cert-table-wrapper">
+        <el-auto-resizer>
+          <template #default="{ width, height }">
+            <zm-table
+              :loading="loading"
+              :data="list"
+              :width="width"
+              :height="height"
+              :max-height="height">
+              <zm-table-column :label="t('monitor.serial')" width="70" align="center" fixed="left">
+                <template #default="scope">
+                  {{ scope.$index + 1 }}
+                </template>
+              </zm-table-column>
+              <zm-table-column
+                label="物资名称"
+                align="center"
+                prop="emergencyName"
+                fixed="left"
+                min-width="140" />
+              <zm-table-column label="证书编号" align="center" prop="certNo" min-width="140" />
+              <zm-table-column label="检测日期" align="center" prop="certTime" width="140">
+                <template #default="scope">
+                  <span class="iot-md-date">{{ formatDateCorrectly(scope.row.certTime) }}</span>
+                </template>
+              </zm-table-column>
+              <zm-table-column label="检测单位" align="center" prop="certOrg" min-width="160" />
+              <zm-table-column label="有效期" align="center" prop="certExpire" width="140">
+                <template #default="scope">
+                  <span class="iot-md-date">{{ formatDateCorrectly(scope.row.certExpire) }}</span>
+                </template>
+              </zm-table-column>
+              <zm-table-column
+                label="备注"
+                align="center"
+                prop="remark"
+                min-width="160"
+                show-overflow-tooltip />
+              <zm-table-column label="附件" fixed="right" align="center" prop="file" width="90">
+                <template #default="scope">
+                  <el-button
+                    v-if="scope.row.file"
+                    link
+                    type="primary"
+                    @click="viewFile(scope.row.file)">
+                    查看
+                  </el-button>
+                </template>
+              </zm-table-column>
+            </zm-table>
+          </template>
+        </el-auto-resizer>
+      </div>
+
+      <div class="h-8 mt-2 flex items-center justify-end">
+        <Pagination
+          :total="total"
+          v-model:page="queryParams.pageNo"
+          v-model:limit="queryParams.pageSize"
+          @pagination="getList" />
+      </div>
+    </div>
+  </el-drawer>
+
+  <Dialog v-model="dialogFileView" title="附件" width="500">
+    <div
+      v-for="(file, index) in fileList"
+      :key="index"
+      class="flex items-center justify-between mt-5">
+      <span class="file-name-text">{{ extractFileName(file) }}</span>
+      <div>
+        <el-button link type="primary" @click="viewFileInfo(file)">
+          <Icon icon="ep:view" class="mr-2px" />查看
+        </el-button>
+        <el-button link type="primary" @click="handleDownload(file)">
+          <Icon icon="ep:download" class="mr-2px" />下载
+        </el-button>
+      </div>
+    </div>
+
+    <template #footer>
+      <div class="dialog-footer mt-10">
+        <el-button type="primary" @click="dialogFileView = false">确认</el-button>
+      </div>
+    </template>
+  </Dialog>
+</template>
+
+<script setup lang="ts">
+import { EmergencyDrillCertApi } from '@/api/pms/qhse/index'
+import { useTableComponents } from '@/components/ZmTable/useTableComponents'
+import { formatDate } from '@/utils/formatTime'
+
+const { ZmTable, ZmTableColumn } = useTableComponents()
+
+defineOptions({ name: 'CertDrawer' })
+
+const message = useMessage()
+const { t } = useI18n()
+
+const drawerVisible = ref(false)
+const loading = ref(false)
+const list = ref<any[]>([])
+const total = ref(0)
+const currentEmergencyId = ref<number | undefined>(undefined)
+
+const queryParams = reactive({
+  pageNo: 1,
+  pageSize: 10,
+  emergencyId: undefined,
+  certNo: undefined,
+  emergencyName: undefined
+})
+
+const queryFormRef = ref()
+
+const getList = async () => {
+  if (!currentEmergencyId.value) return
+
+  loading.value = true
+  try {
+    const data = await EmergencyDrillCertApi.getEmergencyDrillCertList(queryParams)
+    list.value = data.list
+    total.value = data.total
+  } finally {
+    loading.value = false
+  }
+}
+
+const handleQuery = () => {
+  queryParams.pageNo = 1
+  getList()
+}
+
+const resetQuery = () => {
+  queryFormRef.value.resetFields()
+  handleQuery()
+}
+
+const open = (emergencyId: number) => {
+  currentEmergencyId.value = emergencyId
+  queryParams.emergencyId = emergencyId
+  queryParams.pageNo = 1
+  queryParams.certNo = undefined
+  drawerVisible.value = true
+  getList()
+}
+
+const handleClose = () => {
+  drawerVisible.value = false
+  currentEmergencyId.value = undefined
+  list.value = []
+  total.value = 0
+}
+
+const formatDateCorrectly = (timestamp) => {
+  if (!timestamp) return ''
+
+  let time = Number(timestamp)
+
+  if (time < 10000000000) {
+    time = time * 1000
+  }
+
+  const date = new Date(time)
+  if (isNaN(date.getTime())) {
+    return ''
+  }
+
+  const minValidYear = 1900
+  if (date.getFullYear() < minValidYear) {
+    console.warn('Invalid date detected:', timestamp)
+    return ''
+  }
+
+  return formatDate(time).substring(0, 10)
+}
+
+const dialogFileView = ref(false)
+const fileList = ref<string[]>([])
+
+const viewFile = (file: string) => {
+  fileList.value = file.split(',')
+  dialogFileView.value = true
+}
+
+const viewFileInfo = (file: string) => {
+  window.open(
+    'http://doc.deepoil.cc:8012/onlinePreview?url=' + encodeURIComponent(Base64.encode(file))
+  )
+}
+
+const extractFileName = (url: string): string => {
+  try {
+    const cleanUrl = url.split('?')[0].split('#')[0]
+    const parts = cleanUrl.split('/')
+    const fileName = parts[parts.length - 1]
+    return decodeURIComponent(fileName) || url
+  } catch {
+    return url
+  }
+}
+
+const handleDownload = async (url: string) => {
+  try {
+    const response = await fetch(url)
+    const blob = await response.blob()
+    const downloadUrl = window.URL.createObjectURL(blob)
+    const link = document.createElement('a')
+    link.href = downloadUrl
+    link.download = url.split('/').pop() || 'file'
+    link.click()
+    URL.revokeObjectURL(downloadUrl)
+  } catch (error) {
+    console.error('下载失败:', error)
+  }
+}
+
+defineExpose({
+  open
+})
+</script>
+
+<style scoped>
+.cert-drawer-content {
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+}
+
+.cert-table-wrapper {
+  flex: 1;
+  min-height: 0;
+  position: relative;
+}
+
+.file-name-text {
+  flex: 1;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  margin-right: 12px;
+  color: var(--el-text-color-primary);
+}
+</style>

+ 201 - 0
src/views/pms/qhse/emergencyDrill/EmergencyDrillForm.vue

@@ -0,0 +1,201 @@
+<template>
+  <Dialog :title="dialogTitle" v-model="dialogVisible" width="50%">
+    <el-form
+      ref="formRef"
+      :model="formData"
+      :rules="formRules"
+      label-width="100px"
+      v-loading="formLoading">
+      <el-row :gutter="20">
+        <el-col :span="12">
+          <el-form-item label="应急物资名称" prop="emergencyName">
+            <el-input v-model="formData.emergencyName" placeholder="请输入应急物资名称" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="应急物资单位" prop="emergencyUnit">
+            <el-input v-model="formData.emergencyUnit" placeholder="请输入应急物资单位" />
+          </el-form-item>
+        </el-col>
+      </el-row>
+
+      <el-row :gutter="20">
+        <el-col :span="12">
+          <el-form-item label="数量" prop="emergencyNumber">
+            <el-input-number
+              v-model="formData.emergencyNumber"
+              :min="0"
+              :precision="0"
+              controls-position="right"
+              class="!w-full" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="存放位置" prop="emergencyLocation">
+            <el-input v-model="formData.emergencyLocation" placeholder="请输入存放位置" />
+          </el-form-item>
+        </el-col>
+      </el-row>
+
+      <el-row :gutter="20">
+        <el-col :span="12">
+          <el-form-item label="责任人" prop="dutyPerson">
+            <el-input v-model="formData.dutyPerson" placeholder="请输入责任人" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="联系电话" prop="mobile">
+            <el-input v-model="formData.mobile" placeholder="请输入联系电话" />
+          </el-form-item>
+        </el-col>
+      </el-row>
+
+      <el-row :gutter="20">
+        <el-col :span="12">
+          <el-form-item label="部门" prop="deptId">
+            <el-tree-select
+              v-model="formData.deptId"
+              :data="deptList"
+              :props="defaultProps"
+              node-key="id"
+              filterable
+              clearable
+              :check-strictly="deptType !== '3'"
+              placeholder="请选择部门"
+              style="width: 100%" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="附件" prop="file">
+            <UploadFile
+              v-model="formData.file"
+              :file-type="['doc', 'docx', 'pdf', 'jpg', 'png', 'jpeg', 'xls', 'xlsx']"
+              :limit="3"
+              :file-size="100"
+              class="min-w-80px" />
+          </el-form-item>
+        </el-col>
+      </el-row>
+
+      <el-row :gutter="20">
+        <el-col :span="24">
+          <el-form-item label="备注" prop="remark">
+            <el-input
+              v-model="formData.remark"
+              type="textarea"
+              :rows="3"
+              placeholder="请输入备注" />
+          </el-form-item>
+        </el-col>
+      </el-row>
+    </el-form>
+
+    <template #footer>
+      <el-button @click="submitForm" type="primary" :disabled="formLoading">确定</el-button>
+      <el-button @click="dialogVisible = false">取消</el-button>
+    </template>
+  </Dialog>
+</template>
+
+<script setup lang="ts">
+import { EmergencyDrillApi } from '@/api/pms/qhse/index'
+import { defaultProps, handleTree } from '@/utils/tree'
+import * as DeptApi from '@/api/system/dept'
+import { useUserStore } from '@/store/modules/user'
+import { getUserProfile } from '@/api/system/user/profile'
+
+defineOptions({ name: 'QHSEEmergencyDrillForm' })
+
+const { t } = useI18n()
+const message = useMessage()
+const userStore = useUserStore()
+const dialogVisible = ref(false)
+const dialogTitle = ref('')
+const formLoading = ref(false)
+const formType = ref('')
+const formRef = ref()
+const deptList = ref<Tree[]>([])
+
+const createDefaultFormData = () => ({
+  id: undefined,
+  emergencyName: '',
+  emergencyUnit: '',
+  emergencyNumber: undefined,
+  emergencyLocation: '',
+  dutyPerson: '',
+  mobile: '',
+  file: '',
+  deptId: undefined,
+  remark: ''
+})
+
+const formData = ref(createDefaultFormData())
+
+const formRules = reactive({
+  emergencyName: [{ required: true, message: '应急物资名称不能为空', trigger: 'blur' }],
+  emergencyUnit: [{ required: true, message: '应急物资单位不能为空', trigger: 'blur' }],
+  dutyPerson: [{ required: true, message: '责任人不能为空', trigger: 'blur' }],
+  deptId: [{ required: true, message: '部门不能为空', trigger: 'change' }]
+})
+
+const emit = defineEmits(['success'])
+
+const resetForm = () => {
+  formData.value = createDefaultFormData()
+  formRef.value?.resetFields()
+}
+
+const open = async (type: string, id?: number) => {
+  dialogVisible.value = true
+  dialogTitle.value = t('action.' + type)
+  formType.value = type
+  resetForm()
+  formData.value.deptId = userStore.getUser.deptId
+  if (id) {
+    formLoading.value = true
+    try {
+      const res = await EmergencyDrillApi.getEmergencyDrill(id)
+      formData.value = {
+        ...createDefaultFormData(),
+        ...res
+      }
+    } finally {
+      formLoading.value = false
+    }
+  }
+}
+
+defineExpose({ open })
+
+const submitForm = async () => {
+  await formRef.value.validate()
+  formLoading.value = true
+  try {
+    const data = { ...formData.value } as any
+    if (data.file instanceof Array) {
+      data.file = data.file.join(',')
+    }
+
+    if (formType.value === 'create') {
+      await EmergencyDrillApi.createEmergencyDrill(data)
+      message.success(t('common.createSuccess'))
+    } else {
+      await EmergencyDrillApi.updateEmergencyDrill(data)
+      message.success(t('common.updateSuccess'))
+    }
+
+    dialogVisible.value = false
+    emit('success')
+  } finally {
+    formLoading.value = false
+  }
+}
+
+let deptType = ref('')
+onMounted(async () => {
+  deptList.value = handleTree(await DeptApi.getSimpleDeptList())
+
+  const users = await getUserProfile()
+  deptType.value = users.dept.type
+})
+</script>

+ 443 - 0
src/views/pms/qhse/emergencyDrill/bookCheck/EmergencyBookForm.vue

@@ -0,0 +1,443 @@
+<template>
+  <Dialog :title="dialogTitle" v-model="dialogVisible" width="50%">
+    <el-form
+      ref="formRef"
+      :model="formData"
+      :rules="formRules"
+      label-width="auto"
+      v-loading="formLoading">
+      <el-row :gutter="20">
+        <el-col :span="12">
+          <el-form-item label="关联物资" prop="emergencyId">
+            <el-input
+              v-model="formData.emergencyName"
+              disabled
+              placeholder="请选择关联物资"
+              style="width: 100%">
+              <template #append>
+                <el-link @click="selectDevice" :underline="false">选择</el-link>
+              </template>
+            </el-input>
+          </el-form-item>
+        </el-col>
+
+        <el-col :span="12">
+          <el-form-item label="证书编号" prop="certNo">
+            <el-input v-model="formData.certNo" placeholder="请输入证书编号" />
+          </el-form-item>
+        </el-col>
+      </el-row>
+
+      <el-row :gutter="20">
+        <el-col :span="12">
+          <el-form-item label="检测单位" prop="certOrg">
+            <el-input v-model="formData.certOrg" placeholder="请输入检测单位" />
+          </el-form-item>
+        </el-col>
+
+        <el-col :span="12">
+          <el-form-item label="检测日期" prop="certTime">
+            <el-date-picker
+              v-model="formData.certTime"
+              type="date"
+              value-format="x"
+              placeholder="请选择检测日期"
+              style="width: 100%" />
+          </el-form-item>
+        </el-col>
+      </el-row>
+
+      <el-row :gutter="20">
+        <el-col :span="12">
+          <el-form-item label="有效期至" prop="certExpire">
+            <el-date-picker
+              v-model="formData.certExpire"
+              type="date"
+              value-format="x"
+              placeholder="请选择有效期至"
+              style="width: 100%" />
+          </el-form-item>
+        </el-col>
+
+        <el-col :span="12">
+          <el-form-item label="部门" prop="deptId">
+            <el-tree-select
+              v-model="formData.deptId"
+              :data="deptList"
+              :props="defaultProps"
+              node-key="id"
+              filterable
+              :check-strictly="deptType !== '3'"
+              clearable
+              placeholder="请选择部门"
+              style="width: 100%" />
+          </el-form-item>
+        </el-col>
+      </el-row>
+
+      <el-row :gutter="20">
+        <el-col :span="24">
+          <el-form-item label="附件" prop="file">
+            <UploadFile
+              v-model="formData.file"
+              :file-type="['doc', 'docx', 'pdf', 'jpg', 'png', 'jpeg', 'xls', 'xlsx']"
+              :limit="3"
+              :file-size="100"
+              class="min-w-80px" />
+          </el-form-item>
+        </el-col>
+      </el-row>
+
+      <el-row :gutter="20">
+        <el-col :span="24">
+          <el-form-item label="备注" prop="remark">
+            <el-input
+              v-model="formData.remark"
+              type="textarea"
+              :rows="3"
+              placeholder="请输入备注" />
+          </el-form-item>
+        </el-col>
+      </el-row>
+    </el-form>
+
+    <template #footer>
+      <el-button @click="submitForm" type="primary" :disabled="formLoading">确 定</el-button>
+      <el-button @click="dialogVisible = false">取 消</el-button>
+    </template>
+  </Dialog>
+
+  <Dialog title="选择设备" v-model="deviceDialogVisible" width="70%">
+    <ContentWrap>
+      <el-form class="-mb-15px" :model="deviceQueryParams" :inline="true">
+        <el-form-item label="物资名称" prop="emergencyName">
+          <el-input
+            v-model="deviceQueryParams.emergencyName"
+            placeholder="请输入设备名称"
+            clearable
+            @keyup.enter="handleDeviceQuery"
+            class="!w-200px" />
+        </el-form-item>
+        <el-form-item label="责任人" prop="dutyPerson">
+          <el-input
+            v-model="deviceQueryParams.dutyPerson"
+            placeholder="请输入责任人"
+            clearable
+            @keyup.enter="handleDeviceQuery"
+            class="!w-200px" />
+        </el-form-item>
+        <el-form-item>
+          <el-button @click="handleDeviceQuery">
+            <Icon icon="ep:search" class="mr-5px" /> {{ t('devicePerson.search') }}
+          </el-button>
+          <el-button @click="resetDeviceQuery">
+            <Icon icon="ep:refresh" class="mr-5px" /> {{ t('devicePerson.reset') }}
+          </el-button>
+        </el-form-item>
+      </el-form>
+    </ContentWrap>
+
+    <div class="pb-10">
+      <zm-table
+        :loading="deviceLoading"
+        :data="deviceList"
+        :stripe="true"
+        :show-overflow-tooltip="true">
+        <zm-table-column width="50" align="center">
+          <template #default="scope">
+            <el-radio
+              :model-value="selectedDeviceId"
+              :label="scope.row.id"
+              @change="handleDeviceRadioChange(scope.row)">
+              &nbsp;
+            </el-radio>
+          </template>
+        </zm-table-column>
+        <zm-table-column :label="t('monitor.serial')" width="70" align="center">
+          <template #default="scope">
+            {{ scope.$index + 1 }}
+          </template>
+        </zm-table-column>
+        <zm-table-column label="应急物资名称" align="center" prop="emergencyName" min-width="140" />
+        <zm-table-column label="应急物资单位" align="center" prop="emergencyUnit" min-width="120" />
+        <zm-table-column label="数量" align="center" prop="emergencyNumber" width="90" />
+        <zm-table-column label="存放位置" align="center" prop="emergencyLocation" min-width="140" />
+        <zm-table-column label="责任人" align="center" prop="dutyPerson" width="100" />
+        <zm-table-column label="联系电话" align="center" prop="mobile" min-width="120" />
+        <!-- <zm-table-column label="部门名称" align="center" prop="deptName" min-width="140" /> -->
+        <zm-table-column
+          label="备注"
+          align="center"
+          prop="remark"
+          min-width="160"
+          show-overflow-tooltip />
+        <zm-table-column label="附件" align="center" prop="file" min-width="90">
+          <template #default="scope">
+            <el-button v-if="scope.row.file" link type="primary" @click="viewFile(scope.row.file)">
+              查看
+            </el-button>
+          </template>
+        </zm-table-column>
+      </zm-table>
+
+      <Pagination
+        :total="deviceTotal"
+        v-model:page="deviceQueryParams.pageNo"
+        v-model:limit="deviceQueryParams.pageSize"
+        @pagination="getDeviceList" />
+    </div>
+
+    <template #footer>
+      <el-button @click="confirmSelectDevice" type="primary">确 定</el-button>
+      <el-button @click="closeDeviceDialog">取 消</el-button>
+    </template>
+  </Dialog>
+
+  <Dialog v-model="dialogFileView" title="附件" width="500">
+    <div
+      v-for="(file, index) in fileList"
+      :key="index"
+      class="flex items-center justify-between mt-5">
+      <span class="file-name-text">{{ extractFileName(file) }}</span>
+      <div>
+        <el-button link type="primary" @click="viewFileInfo(file)">
+          <Icon icon="ep:view" class="mr-2px" />查看
+        </el-button>
+        <el-button link type="primary" @click="handleDownload(file)">
+          <Icon icon="ep:download" class="mr-2px" />下载
+        </el-button>
+      </div>
+    </div>
+
+    <template #footer>
+      <div class="dialog-footer mt-10">
+        <el-button type="primary" @click="dialogFileView = false">确认</el-button>
+      </div>
+    </template>
+  </Dialog>
+</template>
+
+<script setup lang="ts">
+import { EmergencyDrillCertApi, EmergencyDrillApi } from '@/api/pms/qhse/index'
+import { defaultProps, handleTree } from '@/utils/tree'
+import { onMounted, reactive, ref } from 'vue'
+import * as DeptApi from '@/api/system/dept'
+import { useUserStore } from '@/store/modules/user'
+import { getUserProfile } from '@/api/system/user/profile'
+defineOptions({ name: 'QHSEDeviceCertForm' })
+
+const { t } = useI18n()
+const message = useMessage()
+const userStore = useUserStore()
+const dialogVisible = ref(false)
+const dialogTitle = ref('')
+const formLoading = ref(false)
+const formType = ref('')
+const formRef = ref()
+const deptList = ref<Tree[]>([])
+
+const createDefaultFormData = () => ({
+  id: undefined,
+  emergencyId: undefined,
+  emergencyName: '',
+  deptId: undefined,
+  certNo: '',
+  certOrg: '',
+  certTime: undefined,
+  certExpire: undefined,
+  file: '',
+  remark: ''
+})
+
+const formData = ref(createDefaultFormData())
+
+const formRules = reactive({
+  emergencyId: [{ required: true, message: '关联设备不能为空', trigger: 'blur' }],
+  certNo: [{ required: true, message: '证书编号不能为空', trigger: 'blur' }],
+  certOrg: [{ required: true, message: '检测单位不能为空', trigger: 'blur' }],
+  certTime: [{ required: true, message: '检测日期不能为空', trigger: 'blur' }],
+  certExpire: [{ required: true, message: '有效期不能为空', trigger: 'blur' }],
+  file: [{ required: true, message: '请上传附件', trigger: 'blur' }],
+  deptId: [{ required: true, message: '所在部门不能为空', trigger: 'blur' }]
+})
+
+const emit = defineEmits(['success'])
+
+const resetForm = () => {
+  formData.value = createDefaultFormData()
+  formRef.value?.resetFields()
+}
+
+const open = async (type: string, id?: number) => {
+  dialogVisible.value = true
+  dialogTitle.value = t('action.' + type)
+  formType.value = type
+  resetForm()
+  formData.value.deptId = userStore.getUser.deptId
+  if (id) {
+    formLoading.value = true
+    try {
+      const res = await EmergencyDrillCertApi.getEmergencyDrillCert(id)
+      formData.value = {
+        ...createDefaultFormData(),
+        ...res,
+        certTime: res.certTime ? Number(res.certTime) : undefined,
+        certExpire: res.certExpire ? Number(res.certExpire) : undefined
+      }
+    } finally {
+      formLoading.value = false
+    }
+  }
+}
+
+defineExpose({ open })
+
+const submitForm = async () => {
+  await formRef.value.validate()
+  formLoading.value = true
+  try {
+    const data = { ...formData.value } as any
+    if (data.file instanceof Array) {
+      data.file = data.file.join(',')
+    }
+
+    if (formType.value === 'create') {
+      await EmergencyDrillCertApi.createEmergencyDrillCert(data)
+      message.success(t('common.createSuccess'))
+    } else {
+      await EmergencyDrillCertApi.updateEmergencyDrillCert(data)
+      message.success(t('common.updateSuccess'))
+    }
+
+    dialogVisible.value = false
+    emit('success')
+  } finally {
+    formLoading.value = false
+  }
+}
+
+const deviceDialogVisible = ref(false)
+const deviceLoading = ref(false)
+const deviceList = ref<any[]>([])
+const deviceTotal = ref(0)
+const selectedDeviceId = ref<number | undefined>(undefined)
+const selectedDevice = ref<any>(null)
+
+const deviceQueryParams = reactive({
+  pageNo: 1,
+  pageSize: 10,
+  emergencyName: undefined as string | undefined,
+  dutyPerson: undefined as string | undefined
+})
+
+const getDeviceList = async () => {
+  deviceLoading.value = true
+  try {
+    const data = await EmergencyDrillApi.getEmergencyDrillList(deviceQueryParams)
+    deviceList.value = data.list
+    deviceTotal.value = data.total
+
+    if (selectedDeviceId.value) {
+      selectedDevice.value =
+        deviceList.value.find((item) => item.id === selectedDeviceId.value) || selectedDevice.value
+    }
+  } finally {
+    deviceLoading.value = false
+  }
+}
+
+const handleDeviceQuery = () => {
+  deviceQueryParams.pageNo = 1
+  getDeviceList()
+}
+
+const resetDeviceQuery = () => {
+  deviceQueryParams.emergencyName = undefined
+  deviceQueryParams.dutyPerson = undefined
+  handleDeviceQuery()
+}
+
+const handleDeviceRadioChange = (row: any) => {
+  selectedDeviceId.value = row.id
+  selectedDevice.value = row
+}
+
+const selectDevice = () => {
+  deviceDialogVisible.value = true
+  selectedDeviceId.value = formData.value.emergencyId as number | undefined
+  selectedDevice.value =
+    selectedDeviceId.value && formData.value.emergencyName
+      ? {
+          id: formData.value.emergencyId,
+          emergencyName: formData.value.emergencyName,
+          deptId: formData.value.deptId
+        }
+      : null
+  getDeviceList()
+}
+
+const closeDeviceDialog = () => {
+  deviceDialogVisible.value = false
+  selectedDeviceId.value = undefined
+  selectedDevice.value = null
+}
+
+const confirmSelectDevice = () => {
+  if (!selectedDevice.value) {
+    message.warning('请先选择一个设备')
+    return
+  }
+
+  formData.value.emergencyId = selectedDevice.value.id
+  formData.value.emergencyName = selectedDevice.value.emergencyName
+  formData.value.deptId = selectedDevice.value.deptId
+  closeDeviceDialog()
+}
+
+const dialogFileView = ref(false)
+const fileList = ref<string[]>([])
+const viewFile = (file: string) => {
+  fileList.value = file.split(',')
+  dialogFileView.value = true
+}
+
+const viewFileInfo = (file: string) => {
+  window.open(
+    'http://doc.deepoil.cc:8012/onlinePreview?url=' + encodeURIComponent(Base64.encode(file))
+  )
+}
+
+const extractFileName = (url: string): string => {
+  try {
+    const cleanUrl = url.split('?')[0].split('#')[0]
+    const parts = cleanUrl.split('/')
+    const fileName = parts[parts.length - 1]
+    return decodeURIComponent(fileName) || url
+  } catch {
+    return url
+  }
+}
+
+const handleDownload = async (url: string) => {
+  try {
+    const response = await fetch(url)
+    const blob = await response.blob()
+    const downloadUrl = window.URL.createObjectURL(blob)
+    const link = document.createElement('a')
+    link.href = downloadUrl
+    link.download = url.split('/').pop() || 'file'
+    link.click()
+    URL.revokeObjectURL(downloadUrl)
+  } catch (error) {
+    console.error('下载失败:', error)
+  }
+}
+
+let deptType = ref('')
+onMounted(async () => {
+  deptList.value = handleTree(await DeptApi.getSimpleDeptList())
+
+  const users = await getUserProfile()
+  deptType.value = users.dept.type
+})
+</script>

+ 326 - 0
src/views/pms/qhse/emergencyDrill/bookCheck/index.vue

@@ -0,0 +1,326 @@
+<template>
+  <div
+    class="grid grid-cols-[auto_1fr] grid-rows-[auto_minmax(0,1fr)] gap-0 gap-x-4 h-[calc(100vh-20px-var(--top-tool-height)-var(--tags-view-height)-var(--app-footer-height))]">
+    <DeptTreeSelect
+      class="row-span-2"
+      :top-id="rootDeptId"
+      :deptId="deptId"
+      v-model="queryParams.deptId"
+      :init-select="false"
+      :show-title="false"
+      request-api="getSimpleDeptList"
+      @node-click="handleDeptNodeClick" />
+
+    <div class="mb-1">
+      <el-form
+        :model="queryParams"
+        ref="queryFormRef"
+        class="bg-white dark:bg-[#1d1e1f] rounded-lg shadow px-8 pt-4 flex items-center flex-wrap min-w-0">
+        <div class="flex items-center gap-4 flex-wrap">
+          <el-form-item label="应急物资名称" prop="emergencyName">
+            <el-input
+              v-model="queryParams.emergencyName"
+              placeholder="请输入应急物资名称"
+              clearable
+              class="!w-150px" />
+          </el-form-item>
+          <el-form-item label="证书编号" prop="certNo">
+            <el-input
+              v-model="queryParams.certNo"
+              placeholder="请输入证书编号"
+              clearable
+              @keyup.enter="handleQuery"
+              class="!w-150px" />
+          </el-form-item>
+          <el-form-item>
+            <el-button @click="handleQuery" v-hasPermi="['rq:qhse-emergency-cert:query']">
+              <Icon icon="ep:search" class="mr-5px" /> 搜索
+            </el-button>
+            <el-button @click="resetQuery">
+              <Icon icon="ep:refresh" class="mr-5px" /> 重置
+            </el-button>
+            <el-button
+              type="primary"
+              plain
+              @click="openForm('create')"
+              v-hasPermi="['rq:qhse-emergency-cert:create']">
+              <Icon icon="ep:plus" class="mr-5px" /> 新增
+            </el-button>
+            <el-button
+              type="success"
+              v-hasPermi="['rq:qhse-emergency-cert:export']"
+              plain
+              @click="handleExport"
+              :loading="exportLoading">
+              <Icon icon="ep:download" class="mr-5px" /> 导出
+            </el-button>
+          </el-form-item>
+        </div>
+      </el-form>
+    </div>
+
+    <div class="bg-white dark:bg-[#1d1e1f] shadow rounded-lg flex flex-col p-2 pt-4 min-w-0">
+      <div class="flex-1 relative min-h-0">
+        <el-auto-resizer class="absolute">
+          <template #default="{ width, height }">
+            <zm-table
+              :loading="loading"
+              :data="list"
+              :width="width"
+              :height="height"
+              :max-height="height">
+              <zm-table-column :label="t('monitor.serial')" width="70" align="center">
+                <template #default="scope">
+                  {{ scope.$index + 1 }}
+                </template>
+              </zm-table-column>
+              <zm-table-column label="物资名称" align="center" prop="emergencyName" />
+              <zm-table-column label="证书编号" align="center" prop="certNo" />
+              <zm-table-column label="检测日期" align="center" prop="certTime" width="140">
+                <template #default="scope">
+                  <span class="iot-md-date">{{ formatDateCorrectly(scope.row.certTime) }}</span>
+                </template>
+              </zm-table-column>
+              <zm-table-column label="检测单位" align="center" prop="certOrg" />
+              <zm-table-column label="有效期" align="center" prop="certExpire" width="140">
+                <template #default="scope">
+                  <span class="iot-md-date">{{ formatDateCorrectly(scope.row.certExpire) }}</span>
+                </template>
+              </zm-table-column>
+
+              <zm-table-column label="备注" align="center" prop="remark" show-overflow-tooltip />
+              <zm-table-column label="附件" align="center" prop="file" min-width="90">
+                <template #default="scope">
+                  <el-button
+                    v-if="scope.row.file"
+                    link
+                    type="primary"
+                    @click="viewFile(scope.row.file)">
+                    查看
+                  </el-button>
+                </template>
+              </zm-table-column>
+              <zm-table-column label="操作" align="center" width="140" fixed="right" action>
+                <template #default="scope">
+                  <el-button
+                    link
+                    type="primary"
+                    v-hasPermi="['rq:qhse-emergency-cert:update']"
+                    @click="openForm('update', scope.row.id)">
+                    编辑
+                  </el-button>
+                  <el-button
+                    link
+                    type="danger"
+                    v-hasPermi="['rq:qhse-emergency-cert:delete']"
+                    @click="handleDelete(scope.row.id)">
+                    删除
+                  </el-button>
+                </template>
+              </zm-table-column>
+            </zm-table>
+          </template>
+        </el-auto-resizer>
+      </div>
+      <div class="h-8 mt-2 flex items-center justify-end">
+        <Pagination
+          :total="total"
+          v-model:page="queryParams.pageNo"
+          v-model:limit="queryParams.pageSize"
+          @pagination="getList" />
+      </div>
+    </div>
+  </div>
+
+  <Dialog v-model="dialogFileView" title="附件" width="500">
+    <div
+      v-for="(file, index) in fileList"
+      :key="index"
+      class="flex items-center justify-between mt-5">
+      <span class="file-name-text">{{ extractFileName(file) }}</span>
+      <div>
+        <el-button link type="primary" @click="viewFileInfo(file)">
+          <Icon icon="ep:view" class="mr-2px" />查看
+        </el-button>
+        <el-button link type="primary" @click="handleDownload(file)">
+          <Icon icon="ep:download" class="mr-2px" />下载
+        </el-button>
+      </div>
+    </div>
+
+    <template #footer>
+      <div class="dialog-footer mt-10">
+        <el-button type="primary" @click="dialogFileView = false">确认</el-button>
+      </div>
+    </template>
+  </Dialog>
+
+  <EmergencyBookForm ref="formRef" @success="getList" />
+</template>
+
+<script setup lang="ts">
+import download from '@/utils/download'
+import { EmergencyDrillCertApi } from '@/api/pms/qhse/index'
+import EmergencyBookForm from './EmergencyBookForm.vue'
+import DeptTreeSelect from '@/components/DeptTreeSelect/index.vue'
+import { useTableComponents } from '@/components/ZmTable/useTableComponents'
+import { useUserStore } from '@/store/modules/user'
+import { formatDate } from '@/utils/formatTime'
+
+const { ZmTable, ZmTableColumn } = useTableComponents()
+
+defineOptions({ name: 'QHSEEmergencyBook' })
+
+const rootDeptId = 156
+const deptId = useUserStore().getUser.deptId || rootDeptId
+
+const message = useMessage()
+const { t } = useI18n()
+
+const loading = ref(true)
+const list = ref<any[]>([])
+const total = ref(0)
+const queryParams = reactive({
+  pageNo: 1,
+  pageSize: 10,
+  emergencyName: undefined,
+  certNo: undefined,
+  deptId: undefined
+})
+const queryFormRef = ref()
+const exportLoading = ref(false)
+
+const getList = async () => {
+  loading.value = true
+  try {
+    const data = await EmergencyDrillCertApi.getEmergencyDrillCertList(queryParams)
+    list.value = data.list
+    total.value = data.total
+  } finally {
+    loading.value = false
+  }
+}
+
+const formatDateCorrectly = (timestamp) => {
+  if (!timestamp) return ''
+
+  // 确保处理各种可能的时间戳格式
+  let time = Number(timestamp)
+
+  // 处理不同时间戳格式
+  if (time < 10000000000) {
+    time = time * 1000
+  }
+
+  // 检查是否为有效日期
+  const date = new Date(time)
+  if (isNaN(date.getTime())) {
+    return ''
+  }
+
+  // 验证日期合理性(例如:不能是过于久远的日期)
+  const minValidYear = 1900
+  if (date.getFullYear() < minValidYear) {
+    console.warn('Invalid date detected:', timestamp)
+    return ''
+  }
+
+  return formatDate(time).substring(0, 10)
+}
+
+const handleQuery = () => {
+  queryParams.pageNo = 1
+  getList()
+}
+
+const handleDeptNodeClick = async (row) => {
+  queryParams.deptId = row.id
+  await getList()
+}
+
+const resetQuery = () => {
+  queryFormRef.value.resetFields()
+  handleQuery()
+}
+
+const formRef = ref()
+const openForm = (type: string, id?: number) => {
+  formRef.value.open(type, id)
+}
+
+const handleDelete = async (id: number) => {
+  try {
+    await message.delConfirm()
+    await EmergencyDrillCertApi.deleteEmergencyDrillCert(id)
+    message.success(t('common.delSuccess'))
+    await getList()
+  } catch {}
+}
+
+const handleExport = async () => {
+  try {
+    await message.exportConfirm()
+    exportLoading.value = true
+    const data = await EmergencyDrillCertApi.exportEmergencyDrillCert(queryParams)
+    download.excel(data, '证书检测.xls')
+  } catch {
+  } finally {
+    exportLoading.value = false
+  }
+}
+
+const dialogFileView = ref(false)
+const fileList = ref<string[]>([])
+
+const viewFile = (file: string) => {
+  fileList.value = file.split(',')
+  dialogFileView.value = true
+}
+
+const viewFileInfo = (file: string) => {
+  window.open(
+    'http://doc.deepoil.cc:8012/onlinePreview?url=' + encodeURIComponent(Base64.encode(file))
+  )
+}
+
+const extractFileName = (url: string): string => {
+  try {
+    const cleanUrl = url.split('?')[0].split('#')[0]
+    const parts = cleanUrl.split('/')
+    const fileName = parts[parts.length - 1]
+    return decodeURIComponent(fileName) || url
+  } catch {
+    return url
+  }
+}
+
+const handleDownload = async (url: string) => {
+  try {
+    const response = await fetch(url)
+    const blob = await response.blob()
+    const downloadUrl = window.URL.createObjectURL(blob)
+    const link = document.createElement('a')
+    link.href = downloadUrl
+    link.download = url.split('/').pop() || 'file'
+    link.click()
+    URL.revokeObjectURL(downloadUrl)
+  } catch (error) {
+    console.error('下载失败:', error)
+  }
+}
+
+onMounted(async () => {
+  getList()
+})
+</script>
+
+<style scoped>
+.file-name-text {
+  flex: 1;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  margin-right: 12px;
+  color: var(--el-text-color-primary);
+}
+</style>

+ 322 - 0
src/views/pms/qhse/emergencyDrill/index.vue

@@ -0,0 +1,322 @@
+<template>
+  <div
+    class="grid grid-cols-[auto_1fr] grid-rows-[auto_minmax(0,1fr)] gap-0 gap-x-4 h-[calc(100vh-20px-var(--top-tool-height)-var(--tags-view-height)-var(--app-footer-height))]">
+    <DeptTreeSelect
+      class="row-span-2"
+      :top-id="rootDeptId"
+      :deptId="deptId"
+      v-model="queryParams.deptId"
+      :init-select="false"
+      :show-title="false"
+      request-api="getSimpleDeptList"
+      @node-click="handleDeptNodeClick" />
+
+    <div class="mb-1">
+      <el-form
+        :model="queryParams"
+        ref="queryFormRef"
+        class="bg-white dark:bg-[#1d1e1f] rounded-lg shadow px-8 pt-4 flex items-center flex-wrap min-w-0">
+        <div class="flex items-center gap-4 flex-wrap">
+          <el-form-item label="应急物资名称" prop="emergencyName">
+            <el-input
+              v-model="queryParams.emergencyName"
+              placeholder="请输入应急物资名称"
+              clearable
+              class="!w-150px" />
+          </el-form-item>
+          <el-form-item label="责任人" prop="dutyPerson">
+            <el-input
+              v-model="queryParams.dutyPerson"
+              placeholder="请输入责任人"
+              clearable
+              @keyup.enter="handleQuery"
+              class="!w-150px" />
+          </el-form-item>
+          <el-form-item>
+            <el-button @click="handleQuery">
+              <Icon icon="ep:search" class="mr-5px" /> 搜索
+            </el-button>
+            <el-button @click="resetQuery">
+              <Icon icon="ep:refresh" class="mr-5px" /> 重置
+            </el-button>
+            <el-button
+              type="primary"
+              plain
+              @click="openForm('create')"
+              v-hasPermi="['rq:qhse-emergency-book:create']">
+              <Icon icon="ep:plus" class="mr-5px" /> 新增
+            </el-button>
+            <el-button
+              type="success"
+              v-hasPermi="['rq:qhse-emergency-book:export']"
+              plain
+              @click="handleExport"
+              :loading="exportLoading">
+              <Icon icon="ep:download" class="mr-5px" /> 导出
+            </el-button>
+          </el-form-item>
+        </div>
+      </el-form>
+    </div>
+
+    <div class="bg-white dark:bg-[#1d1e1f] shadow rounded-lg flex flex-col p-2 pt-4 min-w-0">
+      <div class="flex-1 relative min-h-0">
+        <el-auto-resizer class="absolute">
+          <template #default="{ width, height }">
+            <zm-table
+              :loading="loading"
+              :data="list"
+              :width="width"
+              :height="height"
+              :max-height="height">
+              <zm-table-column :label="t('monitor.serial')" width="70" align="center">
+                <template #default="scope">
+                  {{ scope.$index + 1 }}
+                </template>
+              </zm-table-column>
+              <zm-table-column
+                label="应急物资名称"
+                align="center"
+                prop="emergencyName"
+                min-width="140" />
+              <zm-table-column
+                label="应急物资单位"
+                align="center"
+                prop="emergencyUnit"
+                min-width="120" />
+              <zm-table-column label="数量" align="center" prop="emergencyNumber" width="90" />
+              <zm-table-column
+                label="存放位置"
+                align="center"
+                prop="emergencyLocation"
+                min-width="140" />
+              <zm-table-column label="责任人" align="center" prop="dutyPerson" width="100" />
+              <zm-table-column label="联系电话" align="center" prop="mobile" min-width="120" />
+              <!-- <zm-table-column label="部门名称" align="center" prop="deptName" min-width="140" /> -->
+              <zm-table-column
+                label="备注"
+                align="center"
+                prop="remark"
+                min-width="160"
+                show-overflow-tooltip />
+              <zm-table-column label="附件" align="center" prop="file" min-width="90">
+                <template #default="scope">
+                  <el-button
+                    v-if="scope.row.file"
+                    link
+                    type="primary"
+                    @click="viewFile(scope.row.file)">
+                    查看
+                  </el-button>
+                </template>
+              </zm-table-column>
+              <zm-table-column label="操作" align="center" width="160" fixed="right" action>
+                <template #default="scope">
+                  <el-button
+                    v-hasPermi="['rq:qhse-emergency-book:update']"
+                    link
+                    type="primary"
+                    @click="openCertDrawer(scope.row.id)">
+                    查看证书
+                  </el-button>
+                  <el-button
+                    v-hasPermi="['rq:qhse-emergency-book:update']"
+                    link
+                    type="primary"
+                    @click="openForm('update', scope.row.id)">
+                    编辑
+                  </el-button>
+                  <el-button
+                    link
+                    type="danger"
+                    v-hasPermi="['rq:qhse-emergency-book:delete']"
+                    @click="handleDelete(scope.row.id)">
+                    删除
+                  </el-button>
+                </template>
+              </zm-table-column>
+            </zm-table>
+          </template>
+        </el-auto-resizer>
+      </div>
+      <div class="h-8 mt-2 flex items-center justify-end">
+        <Pagination
+          :total="total"
+          v-model:page="queryParams.pageNo"
+          v-model:limit="queryParams.pageSize"
+          @pagination="getList" />
+      </div>
+    </div>
+  </div>
+
+  <Dialog v-model="dialogFileView" title="附件" width="500">
+    <div
+      v-for="(file, index) in fileList"
+      :key="index"
+      class="flex items-center justify-between mt-5">
+      <span class="file-name-text">{{ extractFileName(file) }}</span>
+      <div>
+        <el-button link type="primary" @click="viewFileInfo(file)">
+          <Icon icon="ep:view" class="mr-2px" />查看
+        </el-button>
+        <el-button link type="primary" @click="handleDownload(file)">
+          <Icon icon="ep:download" class="mr-2px" />下载
+        </el-button>
+      </div>
+    </div>
+
+    <template #footer>
+      <div class="dialog-footer mt-10">
+        <el-button type="primary" @click="dialogFileView = false">确认</el-button>
+      </div>
+    </template>
+  </Dialog>
+
+  <EmergencyDrillForm ref="formRef" @success="getList" />
+  <CertDrawer ref="certDrawerRef" />
+</template>
+
+<script setup lang="ts">
+import download from '@/utils/download'
+import { EmergencyDrillApi } from '@/api/pms/qhse/index'
+import EmergencyDrillForm from './EmergencyDrillForm.vue'
+import CertDrawer from './CertDrawer.vue'
+import DeptTreeSelect from '@/components/DeptTreeSelect/index.vue'
+import { useTableComponents } from '@/components/ZmTable/useTableComponents'
+import { useUserStore } from '@/store/modules/user'
+
+const { ZmTable, ZmTableColumn } = useTableComponents()
+
+defineOptions({ name: 'QHSEEmergencyDrill' })
+
+const rootDeptId = 156
+const deptId = useUserStore().getUser.deptId || rootDeptId
+
+const message = useMessage()
+const { t } = useI18n()
+
+const loading = ref(true)
+const list = ref<any[]>([])
+const total = ref(0)
+const queryParams = reactive({
+  pageNo: 1,
+  pageSize: 10,
+  emergencyName: undefined,
+  dutyPerson: undefined,
+  deptId: undefined
+})
+const queryFormRef = ref()
+const exportLoading = ref(false)
+
+const getList = async () => {
+  loading.value = true
+  try {
+    const data = await EmergencyDrillApi.getEmergencyDrillList(queryParams)
+    list.value = data.list
+    total.value = data.total
+  } finally {
+    loading.value = false
+  }
+}
+
+const handleQuery = () => {
+  queryParams.pageNo = 1
+  getList()
+}
+
+const handleDeptNodeClick = async (row) => {
+  queryParams.deptId = row.id
+  await getList()
+}
+
+const resetQuery = () => {
+  queryFormRef.value.resetFields()
+  handleQuery()
+}
+
+const formRef = ref()
+const openForm = (type: string, id?: number) => {
+  formRef.value.open(type, id)
+}
+
+const handleDelete = async (id: number) => {
+  try {
+    await message.delConfirm()
+    await EmergencyDrillApi.deleteEmergencyDrill(id)
+    message.success(t('common.delSuccess'))
+    await getList()
+  } catch {}
+}
+
+const handleExport = async () => {
+  try {
+    await message.exportConfirm()
+    exportLoading.value = true
+    const data = await EmergencyDrillApi.exportEmergencyDrill(queryParams)
+    download.excel(data, '应急物资台账.xls')
+  } catch {
+  } finally {
+    exportLoading.value = false
+  }
+}
+
+const dialogFileView = ref(false)
+const fileList = ref<string[]>([])
+
+const viewFile = (file: string) => {
+  fileList.value = file.split(',')
+  dialogFileView.value = true
+}
+
+const viewFileInfo = (file: string) => {
+  window.open(
+    'http://doc.deepoil.cc:8012/onlinePreview?url=' + encodeURIComponent(Base64.encode(file))
+  )
+}
+
+const extractFileName = (url: string): string => {
+  try {
+    const cleanUrl = url.split('?')[0].split('#')[0]
+    const parts = cleanUrl.split('/')
+    const fileName = parts[parts.length - 1]
+    return decodeURIComponent(fileName) || url
+  } catch {
+    return url
+  }
+}
+
+const handleDownload = async (url: string) => {
+  try {
+    const response = await fetch(url)
+    const blob = await response.blob()
+    const downloadUrl = window.URL.createObjectURL(blob)
+    const link = document.createElement('a')
+    link.href = downloadUrl
+    link.download = url.split('/').pop() || 'file'
+    link.click()
+    URL.revokeObjectURL(downloadUrl)
+  } catch (error) {
+    console.error('下载失败:', error)
+  }
+}
+
+const certDrawerRef = ref()
+
+const openCertDrawer = (emergencyId: number) => {
+  certDrawerRef.value?.open(emergencyId)
+}
+onMounted(async () => {
+  getList()
+})
+</script>
+
+<style scoped>
+.file-name-text {
+  flex: 1;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  margin-right: 12px;
+  color: var(--el-text-color-primary);
+}
+</style>