故障上报

src/api/infra/file/index.ts

@@ -6,6 +6,7 @@ export interface FilePresignedUrlRespVO {
   configId: number
   // 文件上传 URL
   uploadUrl: string
+  uploadUrlPath: string
   // 文件 URL
   url: string
 }

src/components/UploadFile/src/UploadImg.vue

@@ -8,7 +8,7 @@
       :class="['upload', drag ? 'no-border' : '']"
       :disabled="disabled"
       :drag="drag"
-      :http-request="httpRequest"
+      :http-request="httpRequestOnlyPath"
       :multiple="false"
       :on-error="uploadError"
       :on-success="uploadSuccess"
@@ -99,7 +99,7 @@ const deleteImg = () => {
   emit('update:modelValue', '')
 }
 
-const { uploadUrl, httpRequest } = useUpload()
+const { uploadUrl, httpRequestOnlyPath } = useUpload()
 
 const editImg = () => {
   const dom = document.querySelector(`#${uuid.value} .el-upload__input`)

src/components/UploadFile/src/useUpload.ts

@@ -9,10 +9,13 @@ import axios from 'axios'
 export const getUploadUrl = (): string => {
   return import.meta.env.VITE_BASE_URL + import.meta.env.VITE_API_URL + '/infra/file/upload'
 }
-
+export const getUploadUrlOnlyPath = (): string => {
+  return import.meta.env.VITE_BASE_URL + import.meta.env.VITE_API_URL + '/infra/file/upload/path'
+}
 export const useUpload = () => {
   // 后端上传地址
   const uploadUrl = getUploadUrl()
+  const uploadUrlPath = getUploadUrlOnlyPath()
   // 是否使用前端直连上传
   const isClientUpload = UPLOAD_TYPE.CLIENT === import.meta.env.VITE_UPLOAD_TYPE
   // 重写ElUpload上传方法
@@ -55,9 +58,51 @@ export const useUpload = () => {
     }
   }
 
+  const httpRequestOnlyPath = async (options: UploadRequestOptions) => {
+    // 模式一：前端上传
+    if (isClientUpload) {
+      // 1.1 生成文件名称
+      const fileName = await generateFileName(options.file)
+      // 1.2 获取文件预签名地址
+      const presignedInfoPath = await FileApi.getFilePresignedUrl(fileName)
+      // 1.3 上传文件（不能使用 ElUpload 的 ajaxUpload 方法的原因：其使用的是 FormData 上传，Minio 不支持）
+      debugger
+      return axios
+        .put(presignedInfoPath.uploadUrlPath, options.file, {
+          headers: {
+            'Content-Type': options.file.type
+          }
+        })
+        .then(() => {
+          // 1.4. 记录文件信息到后端（异步）
+          createFile(presignedInfo, fileName, options.file)
+          // 通知成功，数据格式保持与后端上传的返回结果一致
+          return { data: presignedInfo.url }
+        })
+    } else {
+      // 模式二：后端上传
+      // 重写 el-upload httpRequest 文件上传成功会走成功的钩子，失败走失败的钩子
+      return new Promise((resolve, reject) => {
+        FileApi.updateFile({ file: options.file })
+          .then((res) => {
+            if (res.code === 0) {
+              resolve(res)
+            } else {
+              reject(res)
+            }
+          })
+          .catch((res) => {
+            reject(res)
+          })
+      })
+    }
+  }
+
   return {
     uploadUrl,
-    httpRequest
+    uploadUrlPath,
+    httpRequest,
+    httpRequestOnlyPath
   }
 }
 

src/router/modules/remaining.ts

@@ -173,9 +173,9 @@ const remainingRouter: AppRouteRecordRaw[] = [
     },
     children: [
       {
-        path: 'failure/detail',
+        path: 'failure/detail/:id',
         component: () => import('@/views/pms/failure/FailureInfo.vue'),
-        name: 'OALeaveDetail',
+        name: 'FailureDetail',
         meta: {
           noCache: true,
           hidden: true,

src/views/pms/failure/FailureInfo.vue

@@ -135,6 +135,8 @@ const dialogTitle = ref('') // 弹窗的标题
 const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
 const formType = ref('') // 表单的类型：create - 新增；update - 修改
 const deviceLabel = ref('') // 表单的类型：create - 新增；update - 修改
+const { params, name } = useRoute() // 查询参数
+const props = defineProps<{ id?: number }>()
 const formData = ref({
   id: undefined,
   failureCode: undefined,
@@ -153,7 +155,7 @@ const formData = ref({
   solution: undefined,
   remark: undefined
 })
-onMounted(()=>{
+onMounted( async ()=>{
   const id = props.id || params.id
   if (!id) {
     message.warning('参数错误，故障上报不能为空！')
@@ -165,6 +167,7 @@ onMounted(()=>{
 const getFailureData = async (id) => {
   formLoading.value = true
   try {
+    debugger
     formData.value = await IotFailureReportApi.getIotFailureReport(id)
   } finally {
     formLoading.value = false

src/views/pms/failure/IotFailureReportForm.vue

@@ -148,6 +148,7 @@ const formData = ref({
   needHelp: undefined,
   solution: undefined,
   remark: undefined,
+  deptId: undefined,
 })
 const deviceChoose = (row) => {
   formData.value.deviceId = row.id
@@ -197,7 +198,9 @@ const submitForm = async () => {
   // 提交请求
   formLoading.value = true
   try {
+    // formData.value.pic = formData.value.pic.path;
     const data = formData.value as unknown as IotFailureReportVO
+
     if (formType.value === 'create') {
       await IotFailureReportApi.createIotFailureReport(data)
       message.success(t('common.createSuccess'))

src/views/pms/failure/index.vue

@@ -1,203 +1,216 @@
 <template>
-  <ContentWrap>
-    <!-- 搜索工作栏 -->
-    <el-form
-      class="-mb-15px"
-      :model="queryParams"
-      ref="queryFormRef"
-      :inline="true"
-      label-width="68px"
-    >
-      <el-form-item label="故障编码" prop="failureCode">
-        <el-input
-          v-model="queryParams.failureCode"
-          placeholder="请输入故障编码"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="故障名称" prop="failureName">
-        <el-input
-          v-model="queryParams.failureName"
-          placeholder="请输入故障名称"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="状态" prop="status">
-        <el-select
-          v-model="queryParams.status"
-          placeholder="请选择状态"
-          clearable
-          class="!w-240px"
-        >
-          <el-option label="请选择字典生成" value="" />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="是否停机" v-show="ifShow" prop="ifStop">
-        <el-select
-          v-model="queryParams.ifStop"
-          placeholder="请选择是否停机"
-          clearable
-          class="!w-240px"
-        >
-          <el-option label="请选择字典生成" value="" />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="故障时间" v-show="ifShow" prop="failureTime">
-        <el-date-picker
-          v-model="queryParams.failureTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-220px"
-        />
-      </el-form-item>
-      <el-form-item label="是否解决" v-show="ifShow" prop="ifDeal">
-        <el-select
-          v-model="queryParams.ifDeal"
-          placeholder="请选择是否解决"
-          clearable
-          class="!w-240px"
-        >
-          <el-option label="请选择字典生成" value="" />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="是否协助" v-show="ifShow" prop="needHelp">
-        <el-select
-          v-model="queryParams.needHelp"
-          placeholder="请选择是否协助"
-          clearable
-          class="!w-240px"
-        >
-          <el-option label="请选择字典生成" value="" />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="创建时间" v-show="ifShow" prop="createTime">
-        <el-date-picker
-          v-model="queryParams.createTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-220px"
-        />
-      </el-form-item>
-      <el-form-item>
-        <el-button v-if="!ifShow" @click="moreQuery(true)" type="warning"><Icon icon="ep:search" class="mr-5px"/> 更多查询</el-button>
-        <el-button v-if="ifShow" @click="moreQuery(false)" type="danger"><Icon icon="ep:search" class="mr-5px"/> 收起查询</el-button>
-        <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')"
-
-        >
-          <Icon icon="ep:plus" class="mr-5px" /> 新增
-        </el-button>
-        <el-button
-          type="success"
-          plain
-          @click="handleExport"
-          :loading="exportLoading"
-          v-hasPermi="['rq:iot-failure-report:export']"
-        >
-          <Icon icon="ep:download" class="mr-5px" /> 导出
-        </el-button>
-      </el-form-item>
-    </el-form>
-  </ContentWrap>
-
-  <!-- 列表 -->
-  <ContentWrap>
-    <el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
-      <el-table-column label="故障编码" align="center" prop="failureCode" />
-      <el-table-column label="故障名称" align="center" prop="failureName" />
-      <el-table-column label="设备" align="center" prop="deviceName" />
-      <el-table-column label="状态" align="center" prop="status" >
-        <template #default="scope">
-          <dict-tag :type="DICT_TYPE.PMS_FAILURE_STATUS" :value="scope.row.status" />
-        </template>
-      </el-table-column>
-      <el-table-column label="是否停机" align="center" prop="ifStop" >
-        <template #default="scope">
-          <dict-tag :type="DICT_TYPE.INFRA_BOOLEAN_STRING" :value="scope.row.ifStop" />
-        </template>
-      </el-table-column>
-      <el-table-column
-        label="故障时间"
-        align="center"
-        prop="failureTime"
-        :formatter="dateFormatter"
-        width="180px"
-      />
-<!--      <el-table-column label="故障影响" align="center" prop="failureInfluence" />-->
-      <el-table-column label="故障系统" align="center" prop="failureSystem" />
-<!--      <el-table-column label="故障描述" align="center" prop="description" />-->
-      <el-table-column label="图片" align="center" prop="pic" />
-      <el-table-column label="是否解决" align="center" prop="ifDeal" >
-        <template #default="scope">
-          <dict-tag :type="DICT_TYPE.INFRA_BOOLEAN_STRING" :value="scope.row.ifDeal" />
-        </template>
-      </el-table-column>
-      <el-table-column label="需要协助" align="center" prop="needHelp" >
-        <template #default="scope">
-          <dict-tag :type="DICT_TYPE.INFRA_BOOLEAN_STRING" :value="scope.row.needHelp" />
-        </template>
-      </el-table-column>
-<!--      <el-table-column label="解决办法" align="center" prop="solution" />-->
-<!--      <el-table-column label="备注" align="center" prop="remark" />-->
-      <el-table-column
-        label="创建时间"
-        align="center"
-        prop="createTime"
-        :formatter="dateFormatter"
-        width="180px"
-      />
-      <el-table-column label="操作" align="center" min-width="120px">
-        <template #default="scope">
-          <el-button
-            link
-            type="primary"
-            @click="openForm('update', scope.row.id)"
+  <el-row :gutter="20">
+    <el-col :span="4" :xs="24">
+      <ContentWrap class="h-1/1">
+        <DeptTree @node-click="handleDeptNodeClick" />
+      </ContentWrap>
+    </el-col>
+    <el-col :span="20" :xs="24">
+    <ContentWrap>
+      <!-- 搜索工作栏 -->
+      <el-form
+        class="-mb-15px"
+        :model="queryParams"
+        ref="queryFormRef"
+        :inline="true"
+        label-width="68px"
+      >
+        <el-form-item label="故障编码" prop="failureCode">
+          <el-input
+            v-model="queryParams.failureCode"
+            placeholder="请输入故障编码"
+            clearable
+            @keyup.enter="handleQuery"
+            class="!w-240px"
+          />
+        </el-form-item>
+        <el-form-item label="故障名称" prop="failureName">
+          <el-input
+            v-model="queryParams.failureName"
+            placeholder="请输入故障名称"
+            clearable
+            @keyup.enter="handleQuery"
+            class="!w-240px"
+          />
+        </el-form-item>
+        <el-form-item label="状态" prop="status">
+          <el-select
+            v-model="queryParams.status"
+            placeholder="请选择状态"
+            clearable
+            class="!w-240px"
           >
-            编辑
-          </el-button>
+            <el-option label="请选择字典生成" value="" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="是否停机" v-show="ifShow" prop="ifStop">
+          <el-select
+            v-model="queryParams.ifStop"
+            placeholder="请选择是否停机"
+            clearable
+            class="!w-240px"
+          >
+            <el-option label="请选择字典生成" value="" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="故障时间" v-show="ifShow" prop="failureTime">
+          <el-date-picker
+            v-model="queryParams.failureTime"
+            value-format="YYYY-MM-DD HH:mm:ss"
+            type="daterange"
+            start-placeholder="开始日期"
+            end-placeholder="结束日期"
+            :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
+            class="!w-220px"
+          />
+        </el-form-item>
+        <el-form-item label="是否解决" v-show="ifShow" prop="ifDeal">
+          <el-select
+            v-model="queryParams.ifDeal"
+            placeholder="请选择是否解决"
+            clearable
+            class="!w-240px"
+          >
+            <el-option label="请选择字典生成" value="" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="是否协助" v-show="ifShow" prop="needHelp">
+          <el-select
+            v-model="queryParams.needHelp"
+            placeholder="请选择是否协助"
+            clearable
+            class="!w-240px"
+          >
+            <el-option label="请选择字典生成" value="" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="创建时间" v-show="ifShow" prop="createTime">
+          <el-date-picker
+            v-model="queryParams.createTime"
+            value-format="YYYY-MM-DD HH:mm:ss"
+            type="daterange"
+            start-placeholder="开始日期"
+            end-placeholder="结束日期"
+            :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
+            class="!w-220px"
+          />
+        </el-form-item>
+        <el-form-item>
+          <el-button v-if="!ifShow" @click="moreQuery(true)" type="warning"><Icon icon="ep:search" class="mr-5px"/> 更多查询</el-button>
+          <el-button v-if="ifShow" @click="moreQuery(false)" type="danger"><Icon icon="ep:search" class="mr-5px"/> 收起查询</el-button>
+          <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
-            link
-            type="danger"
-            @click="handleDelete(scope.row.id)"
+            type="primary"
+            plain
+            @click="openForm('create')"
+
           >
-            删除
+            <Icon icon="ep:plus" class="mr-5px" /> 新增
           </el-button>
           <el-button
-            link
-            v-if="scope.row.needHelp"
-            type="warning"
-            @click="submitProcess(scope.row.id)"
+            type="success"
+            plain
+            @click="handleExport"
+            :loading="exportLoading"
+            v-hasPermi="['rq:iot-failure-report:export']"
           >
-            提交审核
+            <Icon icon="ep:download" class="mr-5px" /> 导出
           </el-button>
-        </template>
-      </el-table-column>
-    </el-table>
-    <!-- 分页 -->
-    <Pagination
-      :total="total"
-      v-model:page="queryParams.pageNo"
-      v-model:limit="queryParams.pageSize"
-      @pagination="getList"
-    />
-  </ContentWrap>
+        </el-form-item>
+      </el-form>
+    </ContentWrap>
 
-  <!-- 表单弹窗：添加/修改 -->
-  <IotFailureReportForm ref="formRef" @success="getList" />
+    <!-- 列表 -->
+    <ContentWrap>
+      <el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
+        <el-table-column label="故障编码" align="center" prop="failureCode" />
+        <el-table-column label="故障名称" align="center" prop="failureName" />
+        <el-table-column label="设备" align="center" prop="deviceName" />
+        <el-table-column label="状态" align="center" prop="status" >
+          <template #default="scope">
+            <dict-tag :type="DICT_TYPE.PMS_FAILURE_STATUS" :value="scope.row.status" />
+          </template>
+        </el-table-column>
+        <el-table-column label="审批状态" align="center" prop="auditStatus" >
+          <template #default="scope">
+            <dict-tag :type="DICT_TYPE.CRM_AUDIT_STATUS" :value="scope.row.auditStatus" />
+          </template>
+        </el-table-column>
+        <el-table-column label="是否停机" align="center" prop="ifStop" >
+          <template #default="scope">
+            <dict-tag :type="DICT_TYPE.INFRA_BOOLEAN_STRING" :value="scope.row.ifStop" />
+          </template>
+        </el-table-column>
+        <el-table-column
+          label="故障时间"
+          align="center"
+          prop="failureTime"
+          :formatter="dateFormatter"
+          width="180px"
+        />
+  <!--      <el-table-column label="故障影响" align="center" prop="failureInfluence" />-->
+        <el-table-column label="故障系统" align="center" prop="failureSystem" />
+  <!--      <el-table-column label="故障描述" align="center" prop="description" />-->
+        <el-table-column label="图片" align="center" prop="pic" />
+        <el-table-column label="是否解决" align="center" prop="ifDeal" >
+          <template #default="scope">
+            <dict-tag :type="DICT_TYPE.INFRA_BOOLEAN_STRING" :value="scope.row.ifDeal" />
+          </template>
+        </el-table-column>
+        <el-table-column label="需要协助" align="center" prop="needHelp" >
+          <template #default="scope">
+            <dict-tag :type="DICT_TYPE.INFRA_BOOLEAN_STRING" :value="scope.row.needHelp" />
+          </template>
+        </el-table-column>
+  <!--      <el-table-column label="解决办法" align="center" prop="solution" />-->
+  <!--      <el-table-column label="备注" align="center" prop="remark" />-->
+        <el-table-column
+          label="创建时间"
+          align="center"
+          prop="createTime"
+          :formatter="dateFormatter"
+          width="180px"
+        />
+        <el-table-column label="操作" align="center" min-width="120px">
+          <template #default="scope">
+            <el-button
+              link
+              type="primary"
+              @click="openForm('update', scope.row.id)"
+            >
+              编辑
+            </el-button>
+            <el-button
+              link
+              type="danger"
+              @click="handleDelete(scope.row.id)"
+            >
+              删除
+            </el-button>
+            <el-button
+              link
+              v-if="scope.row.needHelp"
+              type="warning"
+              @click="submitProcess(scope.row.id)"
+            >
+              提交审核
+            </el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      <!-- 分页 -->
+      <Pagination
+        :total="total"
+        v-model:page="queryParams.pageNo"
+        v-model:limit="queryParams.pageSize"
+        @pagination="getList"
+      />
+    </ContentWrap>
+    </el-col>
+  </el-row>
+    <!-- 表单弹窗：添加/修改 -->
+    <IotFailureReportForm ref="formRef" @success="getList" />
 </template>
 
 <script setup lang="ts">
@@ -207,6 +220,7 @@ import { IotFailureReportApi, IotFailureReportVO } from '@/api/pms/failure'
 import IotFailureReportForm from './IotFailureReportForm.vue'
 import {DICT_TYPE} from "@/utils/dict";
 import {Api, SupplierVO} from "@/api/supplier/base";
+import DeptTree from "@/views/system/user/DeptTree.vue";
 
 /** 故障上报 列表 */
 defineOptions({ name: 'IotFailureReport' })
@@ -235,6 +249,7 @@ const queryParams = reactive({
   solution: undefined,
   remark: undefined,
   createTime: [],
+  deptId: undefined
 })
 const queryFormRef = ref() // 搜索的表单
 const exportLoading = ref(false) // 导出的加载中
@@ -252,7 +267,11 @@ const getList = async () => {
     loading.value = false
   }
 }
-
+/** 处理部门被点击 */
+const handleDeptNodeClick = async (row) => {
+  queryParams.deptId = row.id
+  await getList()
+}
 /** 搜索按钮操作 */
 const handleQuery = () => {
   queryParams.pageNo = 1
@@ -306,9 +325,13 @@ onMounted(() => {
 const submitProcess = async (row: IotFailureReportVO) => {
   try {
     // 提交审核的二次确认
-    await message.confirm(`您确定提交【${row.failureName}】审核吗？`)
+    await message.confirm(`您确定提交审核吗？`)
     // 提交审核
-    await IotFailureReportApi.submitForApproval(row.id)
+    debugger
+    loading.value = true
+    await IotFailureReportApi.submitForApproval(row).then(res=>{
+      loading.value = false
+    })
     message.success('提交审核成功！')
     // 刷新列表
     await getList()