IotMaintain.vue 23 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631
  1. <template>
  2. <ContentWrap v-loading="formLoading">
  3. <ContentWrap>
  4. <el-form
  5. ref="formRef"
  6. :model="formData"
  7. :rules="formRules"
  8. style="margin-right: 4em; margin-left: 0.5em; margin-top: 1em"
  9. label-width="130px"
  10. >
  11. <div class="base-expandable-content">
  12. <el-row>
  13. <el-col :span="8">
  14. <el-form-item label="设备" prop="deviceName">
  15. <el-select
  16. :disabled="formType === 'update'"
  17. v-model="formData.deviceName"
  18. clearable
  19. @clear="deviceClear"
  20. placeholder="请选择设备"
  21. @click="formType === 'update' ? undefined : openForm()"
  22. />
  23. </el-form-item>
  24. </el-col>
  25. <el-col :span="8">
  26. <el-form-item label="维修类型" prop="type">
  27. <el-select v-model="formData.type" placeholder="请选择维修类型" clearable>
  28. <el-option
  29. v-for="dict in getStrDictOptions(DICT_TYPE.PMS_MAIN_TYPE)"
  30. :key="dict.value"
  31. :label="dict.label"
  32. :value="dict.value"
  33. />
  34. </el-select>
  35. </el-form-item>
  36. </el-col>
  37. <el-col :span="8">
  38. <el-form-item label="是否停机" prop="ifStop">
  39. <el-select v-model="formData.ifStop" placeholder="请选择是否停机" clearable>
  40. <el-option
  41. v-for="dict in getBoolDictOptions(DICT_TYPE.INFRA_BOOLEAN_STRING)"
  42. :key="dict.value"
  43. :label="dict.label"
  44. :value="dict.value"
  45. />
  46. </el-select>
  47. </el-form-item>
  48. </el-col>
  49. <el-col :span="8">
  50. <el-form-item
  51. label="维修开始时间"
  52. prop="maintainStartTime"
  53. :rules="formData.type === 'in' ? startRule : []"
  54. >
  55. <el-date-picker
  56. style="width: 150%"
  57. v-model="formData.maintainStartTime"
  58. type="datetime"
  59. value-format="x"
  60. placeholder="选择维修开始时间"
  61. />
  62. </el-form-item>
  63. </el-col>
  64. <el-col :span="8">
  65. <el-form-item
  66. label="维修结束时间"
  67. prop="maintainEndTime"
  68. :rules="formData.type === 'in' ? endRule : []"
  69. >
  70. <el-date-picker
  71. @change="endTimeBlur"
  72. style="width: 150%"
  73. v-model="formData.maintainEndTime"
  74. type="datetime"
  75. value-format="x"
  76. placeholder="选择维修结束时间"
  77. />
  78. </el-form-item>
  79. </el-col>
  80. <el-col :span="8">
  81. <el-form-item label="故障时间" prop="failureTime" :rules="formData.type==='out'?failureTimeRule:[]" >
  82. <el-date-picker
  83. :disabled="formData.maintainType==='故障上报'"
  84. style="width: 150%"
  85. v-model="formData.failureTime"
  86. type="datetime"
  87. value-format="x"
  88. placeholder="选择故障时间"
  89. />
  90. </el-form-item>
  91. </el-col>
  92. <el-col :span="8">
  93. <el-form-item label="故障影响" prop="failureInfluence">
  94. <el-input v-model="formData.failureInfluence" placeholder="请输入故障影响" />
  95. </el-form-item>
  96. </el-col>
  97. <el-col :span="8">
  98. <el-form-item label="故障系统" prop="failureSystem">
  99. <el-input v-model="formData.failureSystem" placeholder="请输入故障系统" />
  100. </el-form-item>
  101. </el-col>
  102. <el-col :span="8">
  103. <el-form-item label="图片" prop="pic">
  104. <UploadImg v-model="formData.pic" height="55px" />
  105. </el-form-item>
  106. </el-col>
  107. <el-col :span="8" v-if="formData.type === 'out'&&formData.maintainPerson===userId">
  108. <el-form-item label="供应商" prop="supplier" :rules="supplierRules">
  109. <el-select
  110. v-model="formData.supplier"
  111. placeholder="请输入供应商"
  112. :model-value="supplierLabel"
  113. @click="openCustomer('supplier')"
  114. />
  115. </el-form-item>
  116. </el-col>
  117. <el-col :span="8" v-if="formData.type === 'in'">
  118. <el-form-item label="维修费用(元)" prop="maintainFee">
  119. <el-input-number
  120. disabled
  121. v-model="formData.maintainFee"
  122. :min="0"
  123. :precision="2"
  124. :step="0.1"
  125. style="width: 100%"
  126. />
  127. </el-form-item>
  128. </el-col>
  129. <el-col :span="8" v-if="formData.type === 'out'&&formData.maintainPerson===userId">
  130. <el-form-item label="委外相关附件" prop="outFile">
  131. <UploadFile v-model="formData.outFile" class="min-w-80px" />
  132. </el-form-item>
  133. </el-col>
  134. <el-col :span="16">
  135. <el-form-item label="故障描述" prop="description">
  136. <el-input type="textarea" v-model="formData.description" />
  137. </el-form-item>
  138. </el-col>
  139. <el-col :span="12">
  140. <el-form-item label="维修描述" :rules="formData.type === 'in' ? descriptionRule : []" prop="maintainDescription">
  141. <el-input type="textarea" v-model="formData.maintainDescription" />
  142. </el-form-item>
  143. </el-col>
  144. <el-col :span="12">
  145. <el-form-item label="解决办法" prop="solution">
  146. <el-input type="textarea" v-model="formData.solution" />
  147. </el-form-item>
  148. </el-col>
  149. <el-col :span="24">
  150. <el-form-item label="备注" prop="remark">
  151. <el-input v-model="formData.remark" type="textarea" placeholder="请输入备注" />
  152. </el-form-item>
  153. </el-col>
  154. </el-row>
  155. </div>
  156. </el-form>
  157. </ContentWrap>
  158. <ContentWrap>
  159. <ContentWrap>
  160. <!-- 搜索工作栏 -->
  161. <el-form class="-mb-15px" ref="queryFormRef" :inline="true" label-width="68px">
  162. <el-form-item>
  163. <!-- <el-button @click="openMaterialForm" type="primary"-->
  164. <!-- ><Icon icon="ep:plus" class="mr-5px" /> 选择物料</el-button>-->
  165. <el-button @click="openMaintainForm" type="primary"
  166. ><Icon icon="ep:plus" class="mr-5px" /> 选择维修项</el-button
  167. >
  168. <el-button @click="openMaintainItem" type="warning"
  169. ><Icon icon="ep:plus" class="mr-5px" /> 新增维修项</el-button
  170. >
  171. <!-- <el-button @click="handleViewNew" type="warning"-->
  172. <!-- ><Icon icon="ep:plus" class="mr-5px" /> 新增物料</el-button>-->
  173. </el-form-item>
  174. </el-form>
  175. </ContentWrap>
  176. <!-- 列表 -->
  177. <ContentWrap>
  178. <el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
  179. <el-table-column label="资产编码" align="center" prop="deviceCode" />
  180. <el-table-column label="设备名称" align="center" prop="deviceName" />
  181. <el-table-column label="维修项" align="center" prop="name" />
  182. <el-table-column label="已选物料数" align="center" prop="materialCount" >
  183. <template #default="scope">
  184. <el-tag v-if="scope.row.materialCount" type="danger"> {{scope.row.materialCount}}</el-tag>
  185. </template>
  186. </el-table-column>
  187. <el-table-column label="操作" align="center" min-width="120px">
  188. <template #default="scope">
  189. <div style="display: flex; justify-content: center; align-items: center; width: 100%">
  190. <div>
  191. <el-button
  192. style="vertical-align: middle"
  193. link
  194. type="danger"
  195. @click="handleDelete(scope.row.bomNodeId)"
  196. >
  197. <Icon style="vertical-align: middle; color: #ea3434" icon="ep:zoom-out" />
  198. 移除
  199. </el-button>
  200. </div>
  201. <div style="margin-left: 12px">
  202. <el-button link type="primary" @click="openMaterialForm(scope.row)">
  203. 选择物料
  204. </el-button>
  205. </div>
  206. <div style="margin-left: 12px">
  207. <el-button link type="primary" @click="handleViewNew(scope.row.bomNodeId)">
  208. 查看物料
  209. </el-button>
  210. </div>
  211. </div>
  212. </template>
  213. </el-table-column>
  214. </el-table>
  215. </ContentWrap>
  216. <!-- 表单弹窗:添加/修改 -->
  217. <WorkOrderMaterial ref="materialFormRef" @choose="selectChoose" />
  218. <ChooseMaintain ref="maintainFormRef" @choose="maintainChoose" />
  219. </ContentWrap>
  220. <ContentWrap>
  221. <el-form>
  222. <el-form-item style="float: right">
  223. <el-button @click="submitForm" type="primary" :disabled="formLoading">保 存</el-button>
  224. <el-button @click="close">取 消</el-button>
  225. </el-form-item>
  226. </el-form>
  227. </ContentWrap>
  228. <DeviceList ref="deviceFormRef" @choose="deviceChoose" />
  229. <CustomerList ref="customerFormRef" @choose="customerChoose" />
  230. <MaterialListDrawer
  231. :model-value="drawerVisible"
  232. @update:model-value="(val) => (drawerVisible = val)"
  233. :node-id="currentBomNodeId"
  234. :materials="materialList.filter((item) => item.bomNodeId === currentBomNodeId)"
  235. @delete = "materialDelete"
  236. />
  237. <Dialog title="维修项" v-model="addItemVisible" style="min-height: 300px">
  238. <el-form
  239. ref="addFormRef"
  240. :model="addFormData"
  241. :rules="addFormRules"
  242. label-position="right"
  243. label-width="68px"
  244. >
  245. <el-form-item label="BOM节点id" v-if="false" prop="deviceCode">
  246. <el-input v-model="addFormData.bomNodeId" disabled />
  247. </el-form-item>
  248. <el-form-item label="资产编码" prop="deviceCode">
  249. <el-input v-model="addFormData.deviceCode" disabled />
  250. </el-form-item>
  251. <el-form-item label="设备名称" prop="deviceName">
  252. <el-input v-model="addFormData.deviceName" disabled />
  253. </el-form-item>
  254. <el-form-item label="维修项" prop="name">
  255. <el-input v-model="addFormData.name" placeholder="请输入维修项" />
  256. </el-form-item>
  257. </el-form>
  258. <el-form>
  259. <el-form-item style="float: right">
  260. <el-button @click="handleConfirm" type="primary">确 定</el-button>
  261. <el-button @click="closeDialog">取 消</el-button>
  262. </el-form-item>
  263. </el-form>
  264. </Dialog>
  265. </ContentWrap>
  266. </template>
  267. <script setup lang="ts">
  268. import { IotMaintainApi } from '@/api/pms/maintain'
  269. import { DICT_TYPE, getBoolDictOptions, getStrDictOptions } from '@/utils/dict'
  270. import DeviceList from '@/views/pms/failure/DeviceList.vue'
  271. import * as UserApi from '@/api/system/user'
  272. import { ref } from 'vue'
  273. import { IotMaintainMaterialVO } from '@/api/pms/maintain/material'
  274. import { useTagsViewStore } from '@/store/modules/tagsView'
  275. import CustomerList from '@/views/pms/device/CustomerList.vue'
  276. import WorkOrderMaterial from '@/views/pms/iotmainworkorder/WorkOrderMaterial.vue'
  277. import { IotMainWorkOrderBomMaterialVO } from '@/api/pms/iotmainworkorderbommaterial'
  278. import MaterialListDrawer from '@/views/pms/iotmainworkorder/SelectedMaterialDrawer.vue'
  279. import ChooseMaintain from '@/views/pms/maintain/material/ChooseMaintain.vue'
  280. import { CACHE_KEY, useCache } from '@/hooks/web/useCache'
  281. import dayjs from 'dayjs'
  282. /** 维修工单 表单 */
  283. defineOptions({ name: 'MaintainAdd' })
  284. const addItemVisible = ref(false) // 弹窗的是否展示
  285. const { t } = useI18n() // 国际化
  286. const message = useMessage() // 消息弹窗
  287. const { delView } = useTagsViewStore() // 视图操作
  288. const { currentRoute, push } = useRouter()
  289. const deptUsers = ref<UserApi.UserVO[]>([]) // 用户列表
  290. const dialogTitle = ref('') // 弹窗的标题
  291. const formLoading = ref(false) // 表单的加载中:1)修改时的数据加载;2)提交的按钮禁用
  292. const formType = ref('') // 表单的类型:create - 新增;update - 修改
  293. const deviceLabel = ref('') // 表单的类型:create - 新增;update - 修改
  294. const drawerVisible = ref<boolean>(false)
  295. const showDrawer = ref()
  296. const list = ref<IotMaintainMaterialVO[]>([]) // 列表的数据
  297. const { params, name } = useRoute() // 查询参数
  298. const id = params.id
  299. const supplierLabel = ref('') // 表单的类型:create - 新增;update - 修改
  300. const totalFee = ref(0)
  301. const { wsCache } = useCache()
  302. const addFormData = ref({
  303. name: '',
  304. deviceName: '',
  305. deviceCode: '',
  306. bomNodeId: '',
  307. })
  308. const formData = ref({
  309. id: undefined,
  310. failureCode: undefined,
  311. failureName: undefined,
  312. deviceId: undefined,
  313. status: undefined,
  314. type: undefined,
  315. ifStop: undefined,
  316. failureTime: undefined,
  317. failureInfluence: undefined,
  318. failureSystem: undefined,
  319. description: undefined,
  320. pic: undefined,
  321. solution: undefined,
  322. maintainStartTime: undefined,
  323. maintainEndTime: undefined,
  324. remark: undefined,
  325. deviceName: undefined,
  326. processInstanceId: undefined,
  327. auditStatus: undefined,
  328. deptId: undefined,
  329. maintainPerson: undefined,
  330. maintainDescription: undefined,
  331. supplier: undefined,
  332. maintainFee: undefined,
  333. outFile: undefined,
  334. maintainType: undefined,
  335. })
  336. const failureTimeRule = [{ required: true, message: '故障时间不能为空', trigger: 'blur' }]
  337. const startRule = [{ required: true, message: '维修开始时间不能为空', trigger: 'blur' }]
  338. const descriptionRule = [{required: true, message:'维修描述不能为空', trigger: 'blur' }]
  339. const endRule = [{ required: true, message: '维修结束时间不能为空', trigger: 'blur' }]
  340. const formRules = reactive({
  341. deviceName: [{ required: true, message: '设备不能为空', trigger: 'blur' }],
  342. failureCode: [{ required: true, message: '故障编码不能为空', trigger: 'blur' }],
  343. type: [{ required: true, message: '维修类型不能为空', trigger: 'blur' }],
  344. ifStop: [{ required: true, message: '是否停机不能为空', trigger: 'blur' }],
  345. failureName: [{ required: true, message: '故障名称不能为空', trigger: 'blur' }],
  346. // failureTime: [{ required: true, message: '故障时间不能为空', trigger: 'blur' }],
  347. // maintainStartTime: [{ required: true, message: '维修开始时间不能为空', trigger: 'blur' }],
  348. // maintainEndTime: [{ required: true, message: '维修结束时间不能为空', trigger: 'blur' }],
  349. // maintainDescription: [{ required: true, message: '维修描述不能为空', trigger: 'blur' }],
  350. // maintainPerson: [{ required: true, message: '维修负责人不能为空', trigger: 'blur' }],
  351. deviceId: [{ required: true, message: '设备id不能为空', trigger: 'blur' }]
  352. // status: [{ required: true, message: '状态不能为空', trigger: 'blur' }]
  353. })
  354. const addFormRules = reactive({
  355. name: [{ required: true, message: '维修项不能为空', trigger: 'blur' }]
  356. })
  357. const handleConfirm = () => {
  358. addFormData.value.bomNodeId = Math.floor(100000 + Math.random() * 900000)
  359. const index = list.value.findIndex((item) => item.name === addFormData.value.name)
  360. if (index !== -1) {
  361. message.warning("维修项重复")
  362. return
  363. }
  364. list.value.push(addFormData.value)
  365. addItemVisible.value = false
  366. }
  367. const customerChoose = (row) => {
  368. formData.value.supplier = row.id
  369. supplierLabel.value = row.name
  370. }
  371. const customerFormRef = ref()
  372. const openCustomer = (type) => {
  373. customerFormRef.value.open(type)
  374. }
  375. const formRef = ref() // 表单 Ref
  376. const addFormRef = ref()
  377. const deviceChoose = (row) => {
  378. formData.value.deviceId = row.id
  379. formData.value.deviceName = row.deviceName
  380. formData.value.deviceCode = row.deviceCode
  381. formData.value.deptId = row.deptId
  382. // deviceLabel.value = row.deviceName
  383. list.value = []
  384. }
  385. const deviceClear = () => {
  386. formData.value.deviceId = undefined
  387. formData.value.deviceName = undefined
  388. formData.value.deviceCode = undefined
  389. formData.value.deptId = undefined
  390. list.value = []
  391. }
  392. const deviceFormRef = ref()
  393. const openForm = () => {
  394. deviceFormRef.value.open()
  395. }
  396. const materialFormRef = ref()
  397. const currentBomNodeId = ref() // 当前选中的bom节点
  398. const openMaterialForm = (row: any) => {
  399. bomNodeId.value = row.bomNodeId
  400. console.log('这是一个对象:', row.bomNodeId)
  401. materialFormRef.value.open(formData.value.deptId, bomNodeId.value, formData.value.deviceId)
  402. }
  403. const maintainFormRef = ref()
  404. const openMaintainForm = (type: string, id?: number) => {
  405. if (!formData.value.deviceId) {
  406. message.error('请选择设备')
  407. return
  408. }
  409. maintainFormRef.value.open(type, formData.value.deviceId)
  410. }
  411. const openMaintainItem = () => {
  412. if (!formData.value.deviceId) {
  413. message.error('请选择设备')
  414. return
  415. }
  416. addItemVisible.value = true
  417. addFormData.value.deviceName = formData.value.deviceName
  418. addFormData.value.deviceCode = formData.value.deviceCode
  419. addFormData.value.name = ''
  420. }
  421. const endTimeBlur = () => {
  422. if (formData.value.maintainEndTime <= formData.value.maintainStartTime) {
  423. message.error('维修结束时间不得早于开始时间')
  424. formData.value.maintainEndTime = undefined
  425. }
  426. const now = dayjs();
  427. const target = dayjs(formData.value.maintainEndTime);
  428. if (target.isAfter(now)) {
  429. message.error('维修结束时间不得晚于当前时间')
  430. formData.value.maintainEndTime = undefined
  431. }
  432. }
  433. const close = () => {
  434. delView(unref(currentRoute))
  435. push({ name: 'IotMaintain', params: {} })
  436. }
  437. const closeDialog = () => {
  438. addItemVisible.value = false
  439. }
  440. const handleViewNew = (nodeId) => {
  441. currentBomNodeId.value = nodeId
  442. drawerVisible.value = true
  443. console.log('当前bom节点:', currentBomNodeId.value)
  444. }
  445. const materialDelete = (row) =>{
  446. totalFee.value = 0
  447. const index = materialList.value.findIndex((item) => item.bomNodeId === bomNodeId.value&&item.materialCode===row.materialCode)
  448. if (index>-1) {
  449. materialList.value.splice(index,1)
  450. }
  451. list.value.forEach((item)=>{
  452. if (item.bomNodeId === row.bomNodeId){
  453. item.materials = materialList.value.filter((item)=>item.bomNodeId===row.bomNodeId)
  454. item.materialCount = item.materials.length;
  455. }
  456. })
  457. materialList.value.forEach((it) => {
  458. totalFee.value = it.unitPrice * it.quantity + totalFee.value
  459. })
  460. formData.value.maintainFee = totalFee.value
  461. }
  462. const materialList = ref<IotMainWorkOrderBomMaterialVO[]>([]) // 保养工单bom关联物料列表
  463. const bomNodeId = ref() // 最新的bomNodeId
  464. const selectChoose = (selectedMaterial) => {
  465. selectedMaterial.bomNodeId = bomNodeId.value
  466. // 关联 bomNodeId
  467. const processedMaterials = selectedMaterial.map((material) => ({
  468. ...material,
  469. bomNodeId: bomNodeId.value // 统一关联当前行的 bomNodeId
  470. }))
  471. // 避免重复添加
  472. processedMaterials.forEach((newMaterial) => {
  473. // 检查是否已存在相同 bomNodeId + materialCode 的条目
  474. const isExist = materialList.value.some(
  475. (item) => item.bomNodeId === bomNodeId.value && item.materialCode === newMaterial.materialCode
  476. )
  477. if (!isExist) {
  478. materialList.value.push(newMaterial)
  479. }
  480. })
  481. totalFee.value = 0;
  482. list.value.forEach((item) => {
  483. if (item.bomNodeId === bomNodeId.value) {
  484. item.materials = materialList.value.filter((item) => item.bomNodeId === bomNodeId.value)
  485. if (item.materials) {
  486. item.materialCount = item.materials.length;
  487. }
  488. }
  489. })
  490. materialList.value.forEach((it) => {
  491. totalFee.value = it.unitPrice * it.quantity + totalFee.value
  492. })
  493. formData.value.maintainFee = totalFee.value
  494. console.log('选择完成的数据:', JSON.stringify(selectedMaterial))
  495. console.log('添加到本地列表的数据:', materialList.value)
  496. }
  497. const maintainChoose = (formData) => {
  498. console.log('接收到的数据eee:', JSON.stringify(formData))
  499. formData.forEach((item) => {
  500. list.value.push(item)
  501. })
  502. }
  503. const removeOnesFromKeys = (obj: Record<string, any>) => {
  504. return Object.keys(obj).reduce(
  505. (acc, key) => {
  506. const newKey = key.replace(/1/g, '') // 替换所有 1
  507. acc[newKey] = obj[key]
  508. return acc
  509. },
  510. {} as Record<string, any>
  511. )
  512. }
  513. /** 提交表单 */
  514. const emit = defineEmits(['success']) // 定义 success 事件,用于操作成功后的回调
  515. const submitForm = async () => {
  516. // 校验表单
  517. await formRef.value.validate()
  518. // 提交请求
  519. formLoading.value = true
  520. try {
  521. if (formData.value.type==='in') {
  522. formData.value.status = 'finished'
  523. } else {
  524. formData.value.status = 'tx'
  525. }
  526. let files: any[]
  527. files = formData.value.outFile
  528. if (files) {
  529. formData.value.outFile = files
  530. .map((element) => {
  531. return element.path
  532. })
  533. .join(',')
  534. }
  535. const data = {
  536. maintain: formData.value,
  537. maintainMaterials: list.value
  538. }
  539. if (formType.value === 'create') {
  540. await IotMaintainApi.createIotMaintain(data)
  541. message.success(t('common.createSuccess'))
  542. close()
  543. } else {
  544. await IotMaintainApi.updateIotMaintain(data)
  545. message.success(t('common.updateSuccess'))
  546. close()
  547. }
  548. // 发送操作成功的事件
  549. emit('success')
  550. } finally {
  551. formLoading.value = false
  552. }
  553. }
  554. /** 重置表单 */
  555. const resetForm = () => {
  556. formData.value = {
  557. id: undefined,
  558. failureCode: undefined,
  559. failureName: undefined,
  560. deviceId: undefined,
  561. status: undefined,
  562. ifStop: undefined,
  563. failureTime: undefined,
  564. failureInfluence: undefined,
  565. failureSystem: undefined,
  566. description: undefined,
  567. pic: undefined,
  568. solution: undefined,
  569. maintainStartTime: undefined,
  570. maintainEndTime: undefined,
  571. remark: undefined,
  572. deviceName: undefined,
  573. processInstanceId: undefined,
  574. auditStatus: undefined,
  575. deptId: undefined
  576. }
  577. formRef.value?.resetFields()
  578. }
  579. const userId = ref('')
  580. onMounted(async () => {
  581. const userInfo = wsCache.get(CACHE_KEY.USER)
  582. userId.value = userInfo.user.id;
  583. if (id) {
  584. formType.value = 'update'
  585. const iotMaintain = await IotMaintainApi.getIotMaintain(id)
  586. deviceLabel.value = iotMaintain.deviceName
  587. formData.value = iotMaintain
  588. formData.value.status = undefined
  589. } else {
  590. formData.value.type = 'in'
  591. formType.value = 'create'
  592. }
  593. })
  594. const handleDelete = async (id: number) => {
  595. try {
  596. const index = list.value.findIndex((item) => item.bomNodeId === id)
  597. if (index !== -1) {
  598. // 通过 splice 删除元素
  599. list.value.splice(index, 1)
  600. totalFee.value = 0
  601. list.value.forEach(item => {
  602. item.materials.forEach((it) => {
  603. totalFee.value = it.unitPrice * it.quantity + totalFee.value
  604. })
  605. })
  606. formData.value.maintainFee = totalFee.value
  607. }
  608. } catch {}
  609. }
  610. </script>
  611. <style scoped>
  612. .base-expandable-content {
  613. overflow: hidden; /* 隐藏溢出的内容 */
  614. transition: max-height 0.3s ease; /* 平滑过渡效果 */
  615. }
  616. </style>