style：设备管理-添加“展开/折叠”按钮

src/views/mes/criticalComponent/index.vue

@@ -11,24 +11,30 @@ v-model="queryParams.code" :placeholder="t('EquipmentManagement.EquipmentKeyItem
 v-model="queryParams.name" :placeholder="t('EquipmentManagement.EquipmentKeyItems.placeholderName')"
           clearable @keyup.enter="handleQuery" class="!w-240px" />
       </el-form-item>
-      <el-form-item :label="t('EquipmentManagement.EquipmentKeyItems.description')" prop="description">
+      <el-form-item :label="t('EquipmentManagement.EquipmentKeyItems.description')" prop="description" v-show="showAllFilters">
         <el-input
 v-model="queryParams.description"
           :placeholder="t('EquipmentManagement.EquipmentKeyItems.placeholderDescription')" clearable
           @keyup.enter="handleQuery" class="!w-240px" />
       </el-form-item>
-      <el-form-item :label="t('EquipmentManagement.EquipmentKeyItems.remark')" prop="remark">
+      <el-form-item :label="t('EquipmentManagement.EquipmentKeyItems.remark')" prop="remark" v-show="showAllFilters">
         <el-input
 v-model="queryParams.remark"
           :placeholder="t('EquipmentManagement.EquipmentKeyItems.placeholderRemark')" clearable
           @keyup.enter="handleQuery" class="!w-240px" />
       </el-form-item>
-      <el-form-item :label="t('EquipmentManagement.EquipmentKeyItems.createTime')" prop="createTime">
+      <el-form-item :label="t('EquipmentManagement.EquipmentKeyItems.createTime')" prop="createTime" v-show="showAllFilters">
         <el-date-picker
 v-model="queryParams.createTime" value-format="YYYY-MM-DD HH:mm:ss" type="daterange"
           :start-placeholder="t('common.startTimeText')" :end-placeholder="t('common.endTimeText')"
           :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]" class="!w-220px" />
       </el-form-item>
+      <el-form-item v-if="filterCount > 3">
+        <el-button type="text" class="text-primary" @click="toggleFilters">
+          <Icon :icon="showAllFilters ? 'ep:arrow-up' : 'ep:arrow-down'" class="mr-5px" />
+          {{ showAllFilters ? t('FactoryModeling.FactoryStructure.collapseText') : t('FactoryModeling.FactoryStructure.expandText') }}
+        </el-button>
+      </el-form-item>
       <el-form-item>
         <el-button @click="handleQuery">
           <Icon icon="ep:search" class="mr-5px" />
@@ -175,6 +181,11 @@ const queryParams = reactive({
 
 const queryFormRef = ref()
 const selectedIds = ref<number[]>([])
+const showAllFilters = ref(false)
+const filterCount = 5
+const toggleFilters = () => {
+  showAllFilters.value = !showAllFilters.value
+}
 
 const importDialogVisible = ref(false)
 const importLoading = ref(false)

src/views/mes/dvrepair/index.vue

@@ -28,7 +28,7 @@
           class="!w-240px" />
       </el-form-item>
 
-      <el-form-item :label="t('EquipmentManagement.DvRepair.requireDate')" prop="requireDate">
+      <el-form-item :label="t('EquipmentManagement.DvRepair.requireDate')" prop="requireDate" v-show="showAllFilters">
         <el-date-picker
           v-model="queryParams.requireDate"
           value-format="YYYY-MM-DD HH:mm:ss"
@@ -37,7 +37,7 @@
           :end-placeholder="t('common.endTimeText')"
           :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]" class="!w-240px" />
       </el-form-item>
-      <el-form-item :label="t('EquipmentManagement.DvRepair.finishDate')" prop="finishDate">
+      <el-form-item :label="t('EquipmentManagement.DvRepair.finishDate')" prop="finishDate" v-show="showAllFilters">
         <el-date-picker
           v-model="queryParams.finishDate"
           value-format="YYYY-MM-DD HH:mm:ss"
@@ -46,7 +46,7 @@
           :end-placeholder="t('common.endTimeText')"
           :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]" class="!w-240px" />
       </el-form-item>
-      <el-form-item :label="t('EquipmentManagement.DvRepair.confirmDate')" prop="confirmDate">
+      <el-form-item :label="t('EquipmentManagement.DvRepair.confirmDate')" prop="confirmDate" v-show="showAllFilters">
         <el-date-picker
           v-model="queryParams.confirmDate"
           value-format="YYYY-MM-DD HH:mm:ss"
@@ -55,7 +55,7 @@
           :end-placeholder="t('common.endTimeText')"
           :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]" class="!w-240px" />
       </el-form-item>
-      <el-form-item :label="t('EquipmentManagement.DvRepair.acceptedBy')" prop="acceptedBy">
+      <el-form-item :label="t('EquipmentManagement.DvRepair.acceptedBy')" prop="acceptedBy" v-show="showAllFilters">
         <el-input
           v-model="queryParams.acceptedBy"
           :placeholder="t('EquipmentManagement.DvRepair.placeholderAcceptedBy')"
@@ -64,7 +64,7 @@
           class="!w-240px" />
       </el-form-item>
 
-      <el-form-item :label="t('EquipmentManagement.DvRepair.status')" prop="status">
+      <el-form-item :label="t('EquipmentManagement.DvRepair.status')" prop="status" v-show="showAllFilters">
         <el-select
           v-model="queryParams.status"
           :placeholder="t('EquipmentManagement.DvRepair.placeholderStatus')"
@@ -74,6 +74,12 @@
           <el-option v-for="opt in statusOptions" :key="opt.value" :label="opt.label" :value="opt.value" />
         </el-select>
       </el-form-item>
+      <el-form-item v-if="filterCount > 3">
+        <el-button type="text" class="text-primary" @click="toggleFilters">
+          <Icon :icon="showAllFilters ? 'ep:arrow-up' : 'ep:arrow-down'" class="mr-5px" />
+          {{ showAllFilters ? t('FactoryModeling.FactoryStructure.collapseText') : t('FactoryModeling.FactoryStructure.expandText') }}
+        </el-button>
+      </el-form-item>
       <el-form-item>
         <el-button @click="handleQuery">
           <Icon icon="ep:search" class="mr-5px" />
@@ -229,6 +235,11 @@ const queryParams = reactive({
 })
 const queryFormRef = ref() // 搜索的表单
 const exportLoading = ref(false) // 导出的加载中
+const showAllFilters = ref(false)
+const filterCount = 8
+const toggleFilters = () => {
+  showAllFilters.value = !showAllFilters.value
+}
 
 const statusOptions = [
   { label: t('EquipmentManagement.DvRepair.statusPending'), value: '0' },

src/views/mes/repairItems/index.vue

@@ -51,7 +51,7 @@
         />
       </el-form-item>
       -->
-      <el-form-item :label="t('EquipmentManagement.RepairItems.projectContent')" prop="projectContent">
+      <el-form-item :label="t('EquipmentManagement.RepairItems.projectContent')" prop="projectContent" v-show="showAllFilters">
         <el-input
           v-model="queryParams.projectContent"
           :placeholder="t('EquipmentManagement.RepairItems.placeholderProjectContent')"
@@ -60,7 +60,7 @@
           class="!w-240px"
         />
       </el-form-item>
-      <el-form-item :label="t('EquipmentManagement.RepairItems.createTime')" prop="createTime">
+      <el-form-item :label="t('EquipmentManagement.RepairItems.createTime')" prop="createTime" v-show="showAllFilters">
         <el-date-picker
           v-model="queryParams.createTime"
           value-format="YYYY-MM-DD HH:mm:ss"
@@ -71,6 +71,12 @@
           class="!w-220px"
         />
       </el-form-item>
+      <el-form-item v-if="filterCount > 3">
+        <el-button type="text" class="text-primary" @click="toggleFilters">
+          <Icon :icon="showAllFilters ? 'ep:arrow-up' : 'ep:arrow-down'" class="mr-5px" />
+          {{ showAllFilters ? t('FactoryModeling.FactoryStructure.collapseText') : t('FactoryModeling.FactoryStructure.expandText') }}
+        </el-button>
+      </el-form-item>
       <el-form-item>
         <el-button @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> {{ t('common.query') }}</el-button>
         <el-button @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> {{ t('common.reset') }}</el-button>
@@ -183,6 +189,11 @@ const queryFormRef = ref()
 const tableRef = ref()
 const selectedIds = ref<number[]>([])
 const formRef = ref()
+const showAllFilters = ref(false)
+const filterCount = 5
+const toggleFilters = () => {
+  showAllFilters.value = !showAllFilters.value
+}
 
 const deviceTypeOptions = ref<{ label: string; value: number }[]>([
   { label: t('EquipmentManagement.RepairItems.deviceTypeDevice'), value: 1 },

src/views/mes/workOrderManagement/index.vue

@@ -33,7 +33,7 @@
             :value="opt.value" />
         </el-select>
       </el-form-item>
-      <el-form-item :label="t('EquipmentManagement.WorkOrderManagement.jobResult')" prop="jobResult">
+      <el-form-item :label="t('EquipmentManagement.WorkOrderManagement.jobResult')" prop="jobResult" v-show="showAllFilters">
         <el-select
           v-model="queryParams.jobResult"
           :placeholder="t('EquipmentManagement.WorkOrderManagement.placeholderJobResult')"
@@ -43,6 +43,12 @@
           <el-option v-for="opt in jobResultOptions" :key="opt.value" :label="opt.label" :value="opt.value" />
         </el-select>
       </el-form-item>
+      <el-form-item v-if="filterCount > 3">
+        <el-button type="text" class="text-primary" @click="toggleFilters">
+          <Icon :icon="showAllFilters ? 'ep:arrow-up' : 'ep:arrow-down'" class="mr-5px" />
+          {{ showAllFilters ? t('FactoryModeling.FactoryStructure.collapseText') : t('FactoryModeling.FactoryStructure.expandText') }}
+        </el-button>
+      </el-form-item>
       <el-form-item>
         <el-button @click="resetQuery">
           <Icon icon="ep:refresh" class="mr-5px" />
@@ -229,6 +235,11 @@ const queryParams = reactive({
 })
 
 const queryFormRef = ref()
+const showAllFilters = ref(false)
+const filterCount = 4
+const toggleFilters = () => {
+  showAllFilters.value = !showAllFilters.value
+}
 
 const getList = async () => {
   loading.value = true