添加周期

src/views/pqs/business/terminal/terminaCkeck/index.vue

@@ -34,27 +34,85 @@
                 </el-form-item>
             </template>
             <template #operation>
-                <el-button icon="el-icon-Plus" type="primary" @click="addFormModel">新增定检记录</el-button>
-                <el-button icon="el-icon-Delete" type="primary" @click="deleteEven">批量删除</el-button>
+<!--                <el-button icon="el-icon-Plus" type="primary" @click="addFormModel">新增定检记录</el-button>-->
             </template>
         </TableHeader>
         <Table ref="tableRef" />
 
-        <!-- 详情弹窗 -->
-        <el-dialog title="定检详情" width="1000px" v-model="dialogShow" v-if="dialogShow"></el-dialog>
+        <!-- 共用dialogShow弹窗，区分详情/上传报告 -->
+        <el-dialog
+            :title="dialogMode === 'detail' ? '定检详情' : '上传周期检测报告'"
+            :width="dialogMode === 'detail' ? '1000px' : '600px'"
+            v-model="dialogShow"
+            v-if="dialogShow"
+        >
+            <!-- 详情区域 -->
+            <div v-if="dialogMode === 'detail'">
+            </div>
+            <!-- 上传报告表单区域 -->
+            <div v-if="dialogMode === 'upload'">
+                <el-form ref="uploadFormRef" :model="uploadForm" label-width="120px">
+
+                    <el-form-item label="定检日期" prop="thisCheckTime" rules="[{ required: true, message: '请选择定检日期', trigger: 'change' }]">
+                        <el-date-picker
+                            v-model="uploadForm.thisCheckTime"
+                            type="date"
+                            placeholder="请选择定检日期"
+                            @change="calcNextCheckTime"
+                            style="width:100%"
+                            value-format="YYYY-MM-DD"
+                        />
+                    </el-form-item>
+                    <el-form-item label="下次定检日期" prop="nextCheckTime">
+                        <el-date-picker v-model="uploadForm.nextCheckTime" type="date"  style="width:100%" value-format="YYYY-MM-DD" />
+                    </el-form-item>
+                    <el-form-item
+                        class="uploadFile"
+                        for="-"
+                        label="设备检测报告："
+                        prop="checkUrl"
+                    >
+                        <el-upload
+                            v-model:file-list="uploadForm.checkUrl"
+                            ref="uploadRef"
+                            action=""
+                            :accept="acceptType"
+                            :limit="1"
+                            :on-change="(file) => choose(file, 'checkUrl')"
+                            :auto-upload="false"
+                            :on-remove="removeFile('checkUrl')"
+                        >
+                            <template #trigger>
+                                <el-button type="primary" >上传文件</el-button>
+                            </template>
+                        </el-upload>
+                    </el-form-item>
+                </el-form>
+            </div>
+
+            <!-- footer 放到所有v-if外层，解决编译报错 -->
+            <template #footer>
+                <el-button v-if="dialogMode === 'upload'" @click="dialogShow = false">取消</el-button>
+                <el-button v-if="dialogMode === 'upload'" type="primary" @click="submitUploadReport">提交</el-button>
+            </template>
+        </el-dialog>
     </div>
 </template>
 
 <script setup lang="ts">
 import { ref, onMounted, provide, reactive, watch } from 'vue'
+
 import TableStore from '@/utils/tableStore'
 import Table from '@/components/table/index.vue'
+import type { UploadFile, UploadInstance, UploadProps, UploadRawFile } from 'element-plus'
 import TableHeader from '@/components/table/header/index.vue'
-import { ElMessage, ElMessageBox } from 'element-plus'
+import { genFileId, ElMessage } from 'element-plus'
 import { useDictData } from '@/stores/dictData'
 import { useAdminInfo } from '@/stores/adminInfo'
-import { terminalCheckPage } from '@/api/device-boot/device'
+import { uploadFile } from '@/api/system-boot/file'
+import { userCheckUpload } from '@/api/device-boot/device'
 
+const acceptType = '.pdf,.docx'
 defineOptions({
     name: 'terminal/terminaCkeck'
 })
@@ -69,6 +127,129 @@ const areaOptionList = dictData.getBasicData('jibei_area')
 // 详情弹窗
 const detailId = ref('')
 const dialogShow = ref(false)
+// 弹窗模式：detail=详情 upload=上传报告
+const dialogMode = ref<'detail' | 'upload'>('detail')
+const submitLoading = ref()
+
+// ========== 上传报告表单补充变量 ==========
+const uploadFormRef = ref()
+const fileList = ref<any[]>([])
+const uploadForm = reactive({
+    thisCheckTime: '',
+    nextCheckTime: '',
+    checkUrl: [],
+    devId:'',
+    objId:''
+})
+// 电能质量检测报告
+const checkUrlFile = ref('')
+
+
+// 选择定检日期，自动往后推3年
+const calcNextCheckTime = (dateVal: string) => {
+    if (!dateVal) {
+        uploadForm.nextCheckTime = ''
+        return
+    }
+    const date = new Date(dateVal)
+    date.setFullYear(date.getFullYear() + 3)
+    // 格式化为 YYYY-MM-DD 字符串
+    const y = date.getFullYear()
+    const m = String(date.getMonth() + 1).padStart(2, '0')
+    const d = String(date.getDate()).padStart(2, '0')
+    uploadForm.nextCheckTime = `${y}-${m}-${d}`
+}
+
+
+// 表单校验
+const uploadRules = reactive({
+    thisCheckTime: [{ required: true, message: '请选择定检日期', trigger: 'change' }],
+    checkUrl: [{ required: true, message: '请上传设备检测报告', trigger: 'change' }]
+})
+
+const resetForm = () => {
+    uploadForm.thisCheckTime = ''
+    uploadForm.nextCheckTime = ''
+    uploadForm.checkUrl = []
+}
+
+
+const submitUploadReport = async () => {
+    await uploadFormRef.value?.validate(async (valid: boolean) => {
+        if (!valid) return
+        if (!uploadForm.checkUrl) return ElMessage.warning('请先上传检测报告文件')
+        submitLoading.value = true
+        try {
+            const params = {
+              devId: uploadForm.devId,
+              objId: uploadForm.objId,
+              thisCheckTime: uploadForm.thisCheckTime,
+              nextCheckTime: uploadForm.nextCheckTime,
+              checkUrl: checkUrlFile.value
+            }
+            const res = await userCheckUpload(params)
+            if (res.code === 'A0000') {
+            ElMessage.success('提交成功')
+            dialogShow.value = false
+            // 刷新表格
+            tableStore.index()
+             }
+        } catch (err: any) {
+            ElMessage.error(err.msg || '提交失败')
+        } finally {
+            submitLoading.value = false
+        }
+    })
+}
+
+
+// 打开上传弹窗，重置表单
+const openUploadDialog = (row: any) => {
+    uploadForm.thisCheckTime = ''
+    uploadForm.nextCheckTime = ''
+    uploadForm.checkUrl = []
+    uploadForm.devId = row.devId
+    uploadForm.objId = row.objId
+    fileList.value = []
+    uploadFormRef.value?.clearValidate()
+    dialogMode.value = 'upload'
+    dialogShow.value = true
+}
+
+
+// 处理上传文件回显
+const fileRaw = (row: any, key: string) => {
+    const fileFields = ['checkUrl', 'assessUrl']
+    for (const field of fileFields) {
+        const filePath = row[key]?.[field] ?? row[field]
+        if (filePath != null && filePath.length > 0) {
+            uploadForm[field] = [{ name: filePath.split('/')[2] }]
+        } else {
+            uploadForm[field] = []
+        }
+    }
+    uploadFormRef.value = row[key]?.checkUrl ?? row.checkUrl ?? ''
+}
+
+
+//移除文件上传
+const removeFile = (val: string) => {
+    return (_file: UploadFile, fileList: UploadFile[]) => {
+        if (val === 'checkUrl') {
+            checkUrlFile.value = ''
+        }
+        uploadForm[val] = fileList
+    }
+}
+const choose = (e: any, field: string) => {
+    uploadFile(e.raw, '/supervision/').then(res => {
+        if (field === 'checkUrl') {
+            checkUrlFile.value = res.data.name
+        }
+    })
+}
+
+// ==========================================
 
 // TableStore 表格配置（仅修改字段映射，其余不动）
 const tableStore = new TableStore({
@@ -136,7 +317,7 @@ const tableStore = new TableStore({
                 return h('span', { style: { color, fontWeight: 'bold' } }, text)
             }
         },
-        { field: 'nextCheckTime', title: '周期检测报告', minWidth: 120 },
+        { field: 'checkUrl', title: '周期检测报告', minWidth: 120 },
 
         // 操作列固定右侧
         {
@@ -161,7 +342,9 @@ const tableStore = new TableStore({
                     type: 'primary',
                     icon: 'el-icon-Open',
                     render: 'basicButton',
-                    click: row => {}
+                    click: row => {
+                        openUploadDialog(row)
+                    }
                 }
             ]
         }
@@ -184,30 +367,7 @@ const openDetail = (id: string) => {
     dialogShow.value = true
 }
 
-// 新增按钮
-const addFormModel = () => {}
 
-// 批量删除
-const deleteEven = () => {
-    if (tableStore.table.selection.length == 0) {
-        ElMessage({
-            type: 'warning',
-            message: '请选择要删除的定检数据'
-        })
-        return
-    }
-    ElMessageBox.confirm('此操作将永久删除选中记录, 是否继续?', '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-    }).then(() => {
-        // 批量传devId数组
-        deletePqCheck(tableStore.table.selection.map(item => item.devId)).then(() => {
-            ElMessage.success('删除成功')
-            tableStore.index()
-        })
-    })
-}
 
 // 路由跳转带ID回显编辑（复用你原有路由传参逻辑）
 const props = defineProps({