EAM ——> 巡检工单关联 巡检项更新

src/views/eam/basicInspectionOption/index.vue

@@ -39,16 +39,17 @@
   </ContentWrap>
 
   <!-- 表单弹窗：添加/修改 -->
-  <BasicForm
+<!--  <BasicForm-->
-    ref="basicFormRef"
+<!--    ref="basicFormRef"-->
-    @success="formsSuccess"
+<!--    @success="formsSuccess"-->
-    :rules="BasicInspectionOptionRules"
+<!--    :rules="BasicInspectionOptionRules"-->
-    :formAllSchemas="BasicInspectionOption.allSchemas"
+<!--    :formAllSchemas="BasicInspectionOption.allSchemas"-->
-    :apiUpdate="BasicInspectionOptionApi.updateBasicInspectionOption"
+<!--    :apiUpdate="BasicInspectionOptionApi.updateBasicInspectionOption"-->
-    :apiCreate="BasicInspectionOptionApi.createBasicInspectionOption"
+<!--    :apiCreate="BasicInspectionOptionApi.createBasicInspectionOption"-->
-    @searchTableSuccess="searchTableSuccess"
+<!--    @searchTableSuccess="searchTableSuccess"-->
-    :isBusiness="false"
+<!--    :isBusiness="false"-->
-  />
+<!--  />-->
+  <ItemForm ref="basicFormRef" @success="getData"/>
 
   <!-- 详情 -->
   <Detail ref="detailRef" :isBasic="true" :allSchemas="BasicInspectionOption.allSchemas" />
@@ -65,6 +66,7 @@ import * as defaultButtons from '@/utils/disposition/defaultButtons'
 import TableHead from '@/components/TableHead/src/TableHead.vue'
 import ImportForm from '@/components/ImportForm/src/ImportForm.vue'
 import Detail from '@/components/Detail/src/Detail.vue'
+import ItemForm from "@/views/eam/basicInspectionOption/itemSelectSetForm.vue";
 
 defineOptions({ name: 'BasicInspectionOption' })
 
@@ -205,6 +207,11 @@ const formsSuccess = async (formType,data) => {
   getList()
 }
 
+//刷新页面
+const getData = async() => {
+  getList();
+}
+
 /** 详情操作 */
 const detailRef = ref()
 const openDetail = (row: any, titleName: any, titleValue: any) => {

src/views/eam/basicInspectionOption/itemSelectSetForm.vue

@@ -0,0 +1,388 @@
+<template>
+  <Dialog v-model="dialogVisible" :title="dialogTitle">
+    <el-form
+      ref="basicFormRef"
+      v-loading="formLoading"
+      :model="formData"
+      :rules="formRules"
+      label-width="100px"
+    >
+      <el-row>
+        <el-col :span="12">
+          <el-form-item label="方案编号" prop="code">
+            <el-input v-model="formData.code" placeholder="方案编号" :disabled="isDisabled"/>
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="方案名称" prop="name">
+            <el-input v-model="formData.name" placeholder="请输入方案名称" />
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-row>
+        <el-col :span="12">
+        <el-form-item label="是否可修改" prop="isUpdated">
+          <el-select v-model="formData.isUpdated" style="width: 200px">
+            <el-option label="是" value="TRUE"></el-option>
+            <el-option label="否" value="FALSE"></el-option>
+          </el-select>
+        </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="描述" prop="describing">
+            <el-input v-model="formData.describing" placeholder="请输入描述" />
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-row>
+        <el-col :span="12">
+          <el-form-item label="是否可用" prop="available">
+            <el-select v-model="formData.available" style="width: 200px">
+              <el-option label="是" value="TRUE"></el-option>
+              <el-option label="否" value="FALSE"></el-option>
+            </el-select>
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+            <el-form-item label="备注" prop="remark">
+              <el-input v-model="formData.remark" placeholder="请输入备注" />
+            </el-form-item>
+        </el-col>
+      </el-row>
+      <el-row>
+        <el-col :span="11">
+          <el-form-item label="选择集ID" prop="selectId">
+            <div class="tag-container flex gap-2">
+              <el-tag v-for="ent in tags" :key="ent.selectId" closable :disable-transitions="false"  @close="handleClose(ent.selectId)">
+                {{ ent.selectId}}
+              </el-tag>
+              <el-input v-if="inputVisible" ref="InputRef" v-model="inputValue" class="w-20" size="small"/>
+              <el-button v-else class="button-new-tag" size="small" @click="addItem">
+                添加巡检选择集
+              </el-button>
+            </div>
+          </el-form-item>
+        </el-col>
+      </el-row>
+    </el-form>
+    <el-table :data="inspectionItemData" style="width: 100%; height: 80%">
+      <el-table-column prop="itemCode" label="巡检项ID" />
+      <el-table-column prop="itemName" label="巡检名称" />
+      <el-table-column prop="isSelectd" label="" width="150" >
+        <template #header>
+          <span>是否必选（默认是）</span>
+        </template>
+        <template #default="scope">
+          <el-switch
+            v-model="scope.row.isSelectd"
+            active-color="#13ce66"
+            inactive-color="#ff4949"
+            active-text="是"
+            inactive-text="否"
+          />
+        </template>
+      </el-table-column>
+    </el-table>
+    <template #footer>
+      <el-button :disabled="formLoading" type="primary" @click="submitForm">确 定</el-button>
+      <el-button @click="dialogVisible = false">取 消</el-button>
+    </template>
+  </Dialog>
+
+<!--添加巡检项弹窗-->
+  <SearchTable ref="searchTableRef" @searchTableSuccess="searchTableSuccess" />
+
+</template>
+<script lang="ts" setup>
+import * as BasicInspectionOptionApi from '@/api/eam/basicInspectionOption'
+import request from "@/config/axios";
+import { SearchTable } from '@/components/SearchTable'
+import { InspectionItemSelectSet} from "@/views/eam/inspectionItemSelectSet/inspectionItemSelectSet.data";
+import * as inspectionItemItemSelectSetApi from "@/api/eam/inspectionItemSelectSet";
+import {ElInput} from "element-plus";
+import {
+  createBasicInspectionOption,
+  updateBasicInspectionOption
+} from "@/api/eam/basicInspectionOption";
+
+
+defineOptions({ name: 'TeamForm' })
+
+const { t } = useI18n() // 国际化
+const message = useMessage() // 消息弹窗
+
+const dialogVisible = ref(false) // 弹窗的是否展示
+const dialogTitle = ref('') // 弹窗的标题
+const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
+const formType = ref('') // 表单的类型：create - 新增；update - 修改
+const tags=ref([])
+
+const inputValue = ref('')
+const inputVisible = ref(false)
+const isDisabled = ref(false)
+const InputRef = ref<InstanceType<typeof ElInput>>()
+//巡检项相关参数
+const inspectionItemData = ref([])
+
+const itemData = ref({
+  id: '',
+  content: '',
+  selectId:''
+})
+
+const formData = ref({
+  code: '',
+  name: '',
+  describing: '',
+  isUpdated: '',
+  remark: '',
+  available: '',
+  selectId: '',
+  optionItem:[]
+})
+const formRules = reactive({
+  code: [
+    { required: true, message: '方案编号不能为空', trigger: 'blur' },
+    { max: 50, message: '不得超过50个字符', trigger: 'blur' }
+  ],
+  name: [
+    { required: true, message: '方案名称不能为空', trigger: 'blur' },
+    { max: 50, message: '不得超过50个字符', trigger: 'blur' }
+  ],
+  isUpdated: [
+    { required: true, message: '不能为空', trigger: 'blur' },
+  ],
+  available: [
+    { required: true, message: '不能为空', trigger: 'blur' },
+  ],
+  remark: [
+    { max: 50, message: '不得超过50个字符', trigger: 'blur' }
+  ],
+})
+const basicFormRef = ref() // 表单 Ref
+
+/** 删除巡检项 */
+const handleClose = (id: string) => {
+  const index = tags.value.findIndex(tag => tag.selectId === id);
+  if (index !== -1) {
+    tags.value.splice(index, 1);
+  }
+}
+
+/** 弹窗相关参数 */
+const searchTableRef = ref();
+const _searchTableTitle = ref();
+const _searchTableAllSchemas = ref();
+const _searchTablePage = ref();
+const _formField = ref();
+const _searchField = ref();
+const _multiple = ref();
+const _type = ref();
+const _row = ref();
+const _searchCondition = ref({})
+
+
+const addItem = () =>{
+  addItemCommon(true,'xunJianItem')
+}
+
+/** 选择巡检项弹窗 */
+const addItemCommon = (multiple,field) => {
+  _searchCondition.value = {}
+  const filters: any[] = []
+  filters.push({
+    action: "==",
+    column: 'available',
+    value: 'TRUE'
+  })
+  // 参数整理
+  _searchCondition.value.isSearch = true
+  _searchCondition.value.filters = filters
+  _searchTableTitle.value = '选择巡检项'
+  //_multiple.value = multiple
+  _formField.value = field
+  _searchField.value = field
+  _searchTablePage.value = inspectionItemItemSelectSetApi.getInspectionItemSelectSetPage
+  _searchTableAllSchemas.value = InspectionItemSelectSet.allSchemas
+  openCommon()
+}
+
+/** 弹窗选择之后  回调函数 添加选择集 */
+const searchTableSuccess = (formField, searchField, val, formRef, type, row ) => {
+  nextTick?.(async () => {
+    if (formField === 'xunJianItem') {
+      let itemsId = '';
+      //选择集ID赋值
+      val.forEach(item => {
+        const isExist = tags.value.some(tag => tag.id === item.id);
+        if (!isExist) {
+          const newItem = {};
+          newItem['itemCode'] = item.itemCode;
+          newItem['selectId'] = item.id;
+          tags.value = [];
+          tags.value.push(newItem);
+        }
+        itemsId = item.itemCode;
+      });
+      //巡检项赋值
+      try {
+          formLoading.value = true;
+          inspectionItemData.value = [];
+          for (const item of itemsId.split(",")) {
+            let res = await request.get({url: `/eam/basic/inspection-item/get?id=` + item})
+            console.log(res)
+            const newItem = {};
+            newItem['itemCode'] = res.id;
+            newItem['itemName'] = res.name;
+            newItem['equipmentParts'] = res.equipmentParts;
+            newItem['isSelectd'] = true;
+            inspectionItemData.value.push(newItem);
+          }
+      } finally {
+        formLoading.value = false;
+      }
+    }
+  })
+}
+/*打开弹窗*/
+const openCommon = () => {
+  searchTableRef.value.open(
+    _searchTableTitle.value,
+    _searchTableAllSchemas.value,
+    _searchTablePage.value,
+    _formField.value,
+    _searchField.value,
+    _multiple.value,
+    _type.value,
+    _row.value,
+    _searchCondition.value
+  )
+}
+/** 初始化弹窗 */
+const open = async (type: string, row?: object) => {
+  dialogVisible.value = true
+  dialogTitle.value = t('action.' + type)
+  formType.value = type
+  // 修改时，设置数据
+  if (row) {
+    isDisabled.value = true;
+    formLoading.value = true
+    formData.value = row;
+    //添加巡检选择集
+    let item = (row.id.toString()).split(",")
+    try {
+        tags.value=[];
+        for (var i = 0; i < item.length; i++) {
+          itemData.value = await request.get({ url: `/eam/basic-inspection-option/get?id=` + item[i] });
+          tags.value.push(itemData.value);
+        }
+    } finally {
+        formLoading.value = false
+    }
+    //添加巡检项
+    let res = await request.get({url: `/eam/relation-inspection-option-item/getList?optionCode=` + row.code})
+    try {
+        inspectionItemData.value = [];
+        formLoading.value = true;
+        for (const item of res) {
+          const newItem = {};
+          newItem['id'] = item.id;
+          newItem['itemCode'] = item.itemCode;
+          newItem['itemName'] = item.itemName;
+          newItem['isSelectd'] = item.isSelectd;
+          inspectionItemData.value.push(newItem);
+        }
+    } finally {
+        formLoading.value = false;
+    }
+  }
+  // 新增时
+  else {
+    resetForm()
+    isDisabled.value = false;
+  }
+}
+defineExpose({ open }) // 提供 open 方法，用于打开弹窗
+
+/** 提交表单 */
+const emit = defineEmits(['success']) // 定义 success 事件，用于操作成功后的回调
+const submitForm = async () => {
+  // 校验表单
+  if (!basicFormRef) return
+  const valid = await basicFormRef.value.validate()
+  if (!valid) return
+  if (inspectionItemData.value.length > 10  ){
+    message.warning('巡检项最多10个');
+    return
+  }
+
+  //赋值 巡检选择集ID
+  formData.value.selectId = tags.value[0].selectId
+  // 提交请求
+  formLoading.value = true
+  try {
+    if (formType.value === 'create') {
+        for (var i = 0; i < inspectionItemData.value.length; i++) {
+          inspectionItemData.value[i].optionCode = formData.value.code
+        }
+        formData.value.optionItem = inspectionItemData.value
+        //新增巡检方案 及 方案与项关系
+        await BasicInspectionOptionApi.createBasicInspectionOption(formData.value)
+        message.success(t('common.createSuccess'))
+    } else {
+        for (var i = 0; i < inspectionItemData.value.length; i++) {
+          inspectionItemData.value[i].optionCode = formData.value.code
+        }
+        formData.value.optionItem = inspectionItemData.value
+        await BasicInspectionOptionApi.updateBasicInspectionOption(formData.value)
+        message.success(t('common.updateSuccess'))
+    }
+    dialogVisible.value = false
+    // 发送操作成功的事件
+    emit('success')
+  } finally {
+    formLoading.value = false
+  }
+}
+
+/** 重置表单 */
+const resetForm = () => {
+  formData.value = {
+    code: '',
+    name: '',
+    describing: '',
+    isUpdated: '',
+    remark: '',
+    available: '',
+    selectId: ''
+  }
+  tags.value=[];
+  inspectionItemData.value = [];
+  basicFormRef.value?.resetFields()
+}
+
+</script>
+
+<style scoped>
+.tag-container {
+  margin-top: 10px; /* 可根据需要调整标签容器与表单项之间的间距 */
+  border: 1px solid #ccc; /* 添加边框样式 */
+  padding: 10px; /* 可根据需要调整容器内边距 */
+  width: 950px; /* 设置固定宽度为 950px */
+  overflow-y: auto; /* 当内容溢出容器高度时显示滚动条 */
+  word-wrap: break-word; /* 使用 word-wrap 属性实现超出范围换行 */
+  overflow-wrap: break-word; /* 兼容性更好的写法 */
+  flex-wrap: wrap;
+}
+.input-with-button {
+  display: flex;
+  align-items: center;
+  width: 100%;
+}
+
+.input-with-button > .el-input {
+  flex: 1;
+  /*margin-right: 10px;*/
+}
+
+</style>

src/views/eam/basicMaintenanceOption/itemSelectSetForm.vue

@@ -101,10 +101,6 @@ import { SearchTable } from '@/components/SearchTable'
 import { BasicMaintenanceItemSelectSet} from "@/views/eam/maintenanceItemSelectSet/maintenanceItemSelectSet.data";
 import * as maintenanceItemSelectSetApi from "@/api/eam/maintenanceItemSelectSet";
 import {ElInput} from "element-plus";
-import {
-  BasicMaintenanceOptionVO,
-  createBasicMaintenanceOption, updateBasicMaintenanceOption
-} from "@/api/eam/basicMaintenanceOption";
 
 defineOptions({ name: 'TeamForm' })
 

src/views/eam/inspectionItem/inspectionItem.data.ts

@@ -27,6 +27,12 @@ export const InspectionItem = useCrudSchemas(reactive<CrudSchema[]>([
       component:'InputNumber'
     },
   },
+  {
+    label: '巡检名称',
+    field: 'name',
+    sort: 'custom',
+    isSearch: true
+  },
   {
     label: '巡检内容',
     field: 'content',
@@ -40,7 +46,7 @@ export const InspectionItem = useCrudSchemas(reactive<CrudSchema[]>([
     }
   },
   {
-    label: '保养部位',
+    label: '巡检部位',
     field: 'equipmentParts',
     sort: 'custom',
     isSearch: true