修改样式不生效

src/views/mes/queryManage/components/FilterColumnInQuery.vue

@@ -192,9 +192,42 @@ export default {
     },
   },
   watch: {
-    isClear(val) {
-      if (val) this.filterCancel(true);
-    },
+    // isClear(val) {
+    //   console.log("监听到了isClear发生了变化");
+    //   if (val) this.filterCancel(true);
+    // },
+  },
+  created() {
+    console.log(
+      `[%c子%c] created   ${this.prop}  ${Date.now()}`,
+      "color:green",
+      ""
+    );
+  },
+  mounted() {
+    console.log(
+      `[%c子%c] mounted   ${this.prop}  ${Date.now()}`,
+      "color:green",
+      ""
+    );
+  },
+  beforeDestroy() {
+    console.log("[子] beforeDestroy", this.prop);
+    /* 1. 清跨页集合 */
+    this.allSelectedColumns.clear();
+    /* 2. 清当前页选中 */
+    this.currentRows = [];
+    /* 3. 清搜索框 */
+    this.searchKey = "";
+    /* 4. 把“空结果”通知父组件，防止残留高亮 */
+    this.$emit("select-data", [], this.prop, this.htmlType);
+  },
+  destroyed() {
+    console.log(
+      `[%c子%c] destroyed ${this.prop}  ${Date.now()}`,
+      "color:red",
+      ""
+    );
   },
   methods: {
     /* ---- 工具方法 ---- */
@@ -364,27 +397,68 @@ export default {
 
     /* ---- 按钮 ---- */
     handleClose() {
-      this.$nextTick(() => {
-        // 把焦点还给搜索图标，防止 aria-hidden 作用在聚焦元素
-        this.$el.closest("th").querySelector(".svg-icon")?.focus();
-      });
+      // this.$nextTick(() => {
+      //   // 把焦点还给搜索图标，防止 aria-hidden 作用在聚焦元素
+      //   this.$el.closest("th").querySelector(".svg-icon")?.focus();
+      // });
     },
     filterConfirm() {
+      console.log("调用了筛选方法");
+      // 先移除焦点
+      this.removeFocusSafely();
+
+      // 触发事件
       this.$emit("select-data", this.currentRows, this.prop, this.htmlType);
+
+      // 关闭弹窗
       this.$refs.popover.doClose();
-      this.handleClose();
+
+      // 延迟处理焦点
+      this.$nextTick(() => {
+        this.focusTriggerElement();
+      });
     },
     filterCancel(flag) {
+      console.log("调用了重置方法");
       this.searchKey = "";
       this.dateRangeValue = "";
       this.currentRows = [];
-      if (!flag) {
-        this.$emit("select-data", [], this.prop, this.htmlType);
-        this.$refs.popover.doClose();
-        this.isFirstLoad = true;
-        this.handleClose();
+      // 先移除焦点
+      this.removeFocusSafely();
+
+      this.$emit("select-data", [], this.prop, this.htmlType);
+      this.$refs.popover.doClose();
+      this.isFirstLoad = true;
+
+      // 延迟处理焦点
+      this.$nextTick(() => {
+        this.focusTriggerElement();
+      });
+    },
+    // 安全移除焦点的方法
+    removeFocusSafely() {
+      const activeElement = document.activeElement;
+      if (activeElement && activeElement.blur) {
+        activeElement.blur();
       }
     },
+
+    // 将焦点移回触发元素
+    focusTriggerElement() {
+      setTimeout(() => {
+        // 找到弹窗的触发元素（通常是表头的筛选图标）
+        const trigger =
+          this.$el
+            .closest("th")
+            ?.querySelector(".el-table__column-filter-trigger") ||
+          this.$el.closest("th")?.querySelector(".svg-icon") ||
+          this.$el.closest("th")?.querySelector("i");
+
+        if (trigger && trigger.focus) {
+          trigger.focus();
+        }
+      }, 100); // 给弹窗关闭动画一点时间
+    },
     handleFilterSearch() {
       this.fetchFilterListInQueryManage();
     },

src/views/mes/queryManage/queryNew.vue

@@ -39,6 +39,10 @@
         <i class="el-icon-refresh mr-5px" style="font-size: 14px" />
         全条件重置
       </el-button>
+      <!-- <el-button size="small" type="warning" @click="handleRefresh">
+        <i class="el-icon-refresh mr-5px" style="font-size: 14px" />
+        全条件重置
+      </el-button> -->
     </el-row>
 
     <!-- 表格 -->
@@ -64,7 +68,7 @@
       <template v-for="(item, i) in queryData">
         <el-table-column
           v-if="!item.ifHide"
-          :key="i"
+          :key="item.id"
           :label="item.columnComment"
           :prop="item.columnComment"
           align="center"
@@ -103,7 +107,9 @@
 
               <!-- 列过滤 -->
               <FilterColumnInQuery
-                v-if="item.listOperationResult"
+                v-if="item.listOperationResult && filterAlive"
+                :key="`filter_${item.id}_${filterKey}`"
+                :ref="`filter_${item.id}`"
                 :label="item.columnComment"
                 :prop="item.columnName"
                 :filter-list="queryData"
@@ -227,6 +233,8 @@ export default {
       isClear: false,
       multipleSelection: [],
       headerWidthChange: false,
+      filterKey: 0,
+      filterAlive: true,
     };
   },
   watch: {
@@ -243,6 +251,13 @@ export default {
         this.init();
       },
     },
+    filterAlive(v) {
+      console.log(
+        `[%c父%c] filterAlive 变为 ${v}  ${Date.now()}`,
+        "color:blue",
+        ""
+      );
+    },
   },
   mounted() {
     this.init();
@@ -706,14 +721,52 @@ export default {
       this.getList();
     },
 
+    // AllConditionReset() {
+    //   /* 0. 先让表格进入“空壳”状态 */
+    //   this.filterAlive = false;
+    //   const tmp = this.queryData; // 暂存
+    //   this.queryData = []; // 强制清空
+    //   this.$nextTick(() => {
+    //     /* 1. 再一次性把列塞回去，配合新的 filterKey */
+    //     this.filterKey++;
+    //     this.queryData = tmp;
+    //     /* 2. 再等 DOM 重建完成再拉数据 */
+    //     this.$nextTick(() => {
+    //       this.getList();
+    //     });
+    //   });
+    // },
     AllConditionReset() {
+      /* 0. 先让表格进入“空壳”状态 */
+      this.filterAlive = false;
+      const tmp = this.queryData; // 暂存
+      this.queryData = []; // 强制清空
+
+      // 清空过滤和排序条件
       this.queryParamList = [];
       this.customFilters = {};
+      this.currentSortField = null;
+      this.currentSortDirection = null;
+      this.pageNo = 1;
+      this.pageSize = 20;
+      this.multipleSelection = [];
       this.isClear = true;
-      setTimeout(() => (this.isClear = false), 1000);
-      this.getList();
-    },
 
+      this.$nextTick(() => {
+        /* 1. 再一次性把列塞回去，配合新的 filterKey */
+        this.filterKey++;
+        this.queryData = tmp;
+        /* 2. 重新激活 filter 组件 */
+        this.filterAlive = true; // ← 关键：重新激活
+
+        /* 3. 等待组件重新渲染后获取数据 */
+        this.$nextTick(() => {
+          this.getList();
+          // 重置 isClear 状态
+          setTimeout(() => (this.isClear = false), 1000);
+        });
+      });
+    },
     handleSearch() {
       this.list = [];
       this.getList();
@@ -888,6 +941,26 @@ export default {
       this.queryParamList = queryParam;
       await this.getQueryData();
     },
+    handleRefresh() {
+      // 注释掉原来的刷新页面代码，改为初始化所有条件
+      location.reload(true);
+
+      // 初始化所有条件
+      // this.queryParamList = [];
+      // this.customFilters = {};
+      // this.currentSortField = null;
+      // this.currentSortDirection = null;
+      // this.pageNo = 1;
+      // this.pageSize = 20;
+      // this.multipleSelection = [];
+      // this.isClear = true;
+
+      // // 重新拉取按钮、列配置和表格数据
+      // this.init();
+
+      // // 重置isClear状态
+      // setTimeout(() => (this.isClear = false), 1000);
+    },
   },
 };
 </script>

src/views/rtkwms/inrequest/InRequestForm.vue

@@ -72,7 +72,7 @@
           ref="formRef"
           v-loading="formLoading"
           :model="formData"
-          :rules="formRules"
+          :rules="dynamicFormRules"
           label-width="150px"
           class="form-container"
         >
@@ -103,12 +103,12 @@
                 /> </el-form-item
             ></el-col>
             <el-col :span="12">
-              <el-form-item label="部门" prop="deptCode">
+              <el-form-item :label="getDeptLabel" prop="deptCode">
                 <DepartMentSelect
                   ref="departMentSelect"
                   v-model="formData.deptCode"
                   :disabled="isFormDisabled || !formData.businessType"
-                  placeholder="请选择部门"
+                  :placeholder="getDeptPlaceholder"
                   clearable
                   @change="selectDepart"
                 />
@@ -262,7 +262,7 @@
                 style="width: 60%"
                 icon="el-icon-upload2"
                 @click="handleUpload"
-              >附件上传</el-button
+                >附件上传</el-button
               >
             </el-col>
           </el-row>
@@ -444,7 +444,7 @@ import DepartMentSelect from "./components/DepartMentSelect.vue";
 import AttachmentUpload from "../../wms/incoming/register/components/AttachmentUpload.vue";
 // 审批任务
 import ApprovalTask from "../../wms/quality/iqcInspection/components/ApprovalTaskNew.vue";
-import {getFilesById} from "@/api/wms/incoming/register";
+import { getFilesById } from "@/api/wms/incoming/register";
 export default {
   name: "InRequestForm",
   components: {
@@ -460,7 +460,7 @@ export default {
       sourceOrderNoList: [],
       businessDescribeList: [],
       warehouseList: [],
-      uploadFiles: [],// 上传的文件
+      uploadFiles: [], // 上传的文件
       loading: false,
       // 页面标题
       dialogTitle: "",
@@ -504,50 +504,23 @@ export default {
       },
       // 表单校验
       formRules: {
-        deptCode: [{ required: true, message: "请选择部门", trigger: "blur" }],
-        requestNo: [
-          { required: true, message: "申请单号不能为空", trigger: "blur" },
-        ],
-        expectedTime: [
-          { required: true, message: "预计入库时间不能为空", trigger: "blur" },
-        ],
-        requestType: [
-          {
-            required: true,
-            message: "申请类型(0入库 1出库)不能为空",
-            trigger: "change",
-          },
-        ],
         businessType: [
           {
             required: true,
-            message:
-              "业务类型(0采购入库 3生产退料 4成品入库 6销售退货 8委外退料 9委外入库 11其他入库 13转移调拨 14仓库盘点)不能为空",
-            trigger: "change",
-          },
-        ],
-        businessSubType: [
-          {
-            required: true,
-            message: "业务子类型(0正常 1补料)不能为空",
-            trigger: "change",
-          },
-        ],
-        status: [
-          {
-            required: false,
-            message:
-              "状态(0草稿 1已提交 2已审核 3执行中 4已完成 5已取消)不能为空",
+            message: "业务类型不能为空",
             trigger: "blur",
           },
         ],
         priority: [
           {
             required: true,
-            message: "优先级(0普通 1紧急 2加急)不能为空",
+            message: "优先级不能为空",
             trigger: "blur",
           },
         ],
+        expectedTime: [
+          { required: true, message: "预计入库时间不能为空", trigger: "blur" },
+        ],
       },
     };
   },
@@ -567,6 +540,102 @@ export default {
         this.formData.id === ""
       );
     },
+    // 动态获取部门标签
+    getDeptLabel() {
+      const businessType = this.formData.businessType;
+      if (businessType === "9") {
+        // 委外入库
+        return "收货部门";
+      } else if (businessType === "8") {
+        // 委外退料
+        return "退货部门";
+      } else if (businessType === "3") {
+        // 生产退料
+        return "发料部门";
+      }
+      return "部门";
+    },
+    // 动态获取部门占位符
+    getDeptPlaceholder() {
+      const businessType = this.formData.businessType;
+      if (businessType === "9") {
+        // 委外入库
+        return "请选择收货部门";
+      } else if (businessType === "8") {
+        // 委外退料
+        return "请选择退货部门";
+      } else if (businessType === "3") {
+        // 生产退料
+        return "请选择发料部门";
+      }
+      return "请选择部门";
+    },
+    // 动态生成表单验证规则
+    dynamicFormRules() {
+      // 从原始规则中只保留业务类型、优先级、预计出入库时间
+      const baseRules = {
+        businessType: this.formRules.businessType,
+        priority: this.formRules.priority,
+        expectedTime: this.formRules.expectedTime,
+      };
+
+      const rules = { ...baseRules };
+      const businessType = this.formData.businessType;
+
+      // 只有选择了业务类型后，才添加其他字段的验证规则
+      if (businessType) {
+        // 委外入库(9)和委外退料(8)需要的必填字段
+        if (businessType === "9" || businessType === "8") {
+          rules.deptCode = [
+            {
+              required: true,
+              message: this.getDeptLabel + "不能为空",
+              trigger: "blur",
+            },
+          ];
+          rules.businessDescribe = [
+            {
+              required: true,
+              message: "业务分类名称不能为空",
+              trigger: "blur",
+            },
+          ];
+          rules.supplierCode = [
+            { required: true, message: "供应商不能为空", trigger: "blur" },
+          ];
+          rules.sourceOrderNo = [
+            { required: true, message: "源单编号不能为空", trigger: "blur" },
+          ];
+        }
+        // 生产退料(3)需要的必填字段
+        else if (businessType === "3") {
+          rules.deptCode = [
+            {
+              required: true,
+              message: this.getDeptLabel + "不能为空",
+              trigger: "blur",
+            },
+          ];
+          rules.businessDescribe = [
+            {
+              required: true,
+              message: "业务分类名称不能为空",
+              trigger: "blur",
+            },
+          ];
+          rules.sourceOrderNo = [
+            { required: true, message: "源单编号不能为空", trigger: "blur" },
+          ];
+        }
+        // 其他业务类型不需要必填部门字段
+        else {
+          // 移除部门字段的必填规则
+          delete rules.deptCode;
+        }
+      }
+
+      return rules;
+    },
   },
   watch: {
     "$route.query.id": {
@@ -772,6 +841,10 @@ export default {
       this.formData.businessType = value;
       this.formData.businessDescribe = "";
       this.formData.businessCategory = "";
+      // 重置表单校验状态
+      this.$nextTick(() => {
+        this.$refs.formRef.clearValidate();
+      });
       const { data } = await InRequestApi.getDictByOrderType({
         orderType: value,
       });
@@ -823,13 +896,15 @@ export default {
             }) => rest
           );
 
-        //上传的附件拼接传给后端
-        const fileIds = this.uploadFiles.map((item) => {
-          return item.id || item.name?.fileId;
-        }).filter(id => id && id !== '');
+        // 上传的附件拼接传给后端
+        const fileIds = this.uploadFiles
+          .map((item) => {
+            return item.id || item.name?.fileId;
+          })
+          .filter((id) => id && id !== "");
 
         // 拼接文件ID
-        data.fileId = fileIds.join(',');
+        data.fileId = fileIds.join(",");
 
         // 修改的提交
         if (data.id) {
@@ -963,7 +1038,6 @@ export default {
     getFileList(data) {
       this.uploadFiles = data;
     },
-
   },
 };
 </script>

src/views/wms/output/inrequest/components/InRequestForm.vue

@@ -65,7 +65,7 @@
           ref="formRef"
           v-loading="formLoading"
           :model="formData"
-          :rules="formRules"
+          :rules="dynamicFormRules"
           label-width="150px"
         >
           <el-row :gutter="20">
@@ -94,12 +94,12 @@
                 /> </el-form-item
             ></el-col>
             <el-col :span="12">
-              <el-form-item label="部门" prop="deptCode">
+              <el-form-item :label="getDeptLabel" prop="deptCode">
                 <DepartMentSelect
                   ref="departMentSelect"
                   v-model="formData.deptCode"
                   :disabled="isFormDisabled || !formData.businessType"
-                  placeholder="请选择部门"
+                  :placeholder="getDeptPlaceholder"
                   clearable
                   @change="selectDepart"
                 />
@@ -268,7 +268,7 @@
                 style="width: 60%"
                 icon="el-icon-upload2"
                 @click="handleUpload"
-              >附件上传</el-button
+                >附件上传</el-button
               >
             </el-col>
           </el-row>
@@ -471,7 +471,7 @@ export default {
       loadingMaterial: false,
       loadingSourceOrder: false,
       loadingWarehouse: false,
-      uploadFiles: [],// 上传的文件
+      uploadFiles: [], // 上传的文件
       // 页面标题
       dialogTitle: "",
       // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
@@ -568,6 +568,96 @@ export default {
         this.formData.id === ""
       );
     },
+    // 动态获取部门标签
+    getDeptLabel() {
+      const businessType = this.formData.businessType;
+      if (businessType === "1") {
+        // 生产领料
+        return "发料部门";
+      }
+      return "部门";
+    },
+    // 动态获取部门占位符
+    getDeptPlaceholder() {
+      const businessType = this.formData.businessType;
+      if (businessType === "1") {
+        // 生产领料
+        return "请选择发料部门";
+      }
+      return "请选择部门";
+    },
+    // 动态生成表单验证规则
+    dynamicFormRules() {
+      // 从原始规则中只保留基础字段
+      const baseRules = {
+        businessType: this.formRules.businessType,
+        priority: this.formRules.priority,
+        expectedTime: this.formRules.expectedTime,
+      };
+
+      const rules = { ...baseRules };
+      const businessType = this.formData.businessType;
+
+      // 只有选择了业务类型后，才添加其他字段的验证规则
+      if (businessType) {
+        // 生产领料(1)需要的必填字段
+        if (businessType === "1") {
+          rules.deptCode = [
+            {
+              required: true,
+              message: this.getDeptLabel + "不能为空",
+              trigger: "blur",
+            },
+          ];
+          rules.businessDescribe = [
+            {
+              required: true,
+              message: "业务分类名称不能为空",
+              trigger: "blur",
+            },
+          ];
+          rules.sourceOrderNo = [
+            { required: true, message: "源单编号不能为空", trigger: "blur" },
+          ];
+          rules.warehouseId = [
+            { required: true, message: "存储地点不能为空", trigger: "blur" },
+          ];
+        }
+        // 采购退料(2)需要的必填字段
+        else if (businessType === "2") {
+          rules.deptCode = [
+            { required: true, message: "部门不能为空", trigger: "blur" },
+          ];
+          rules.supplierCode = [
+            { required: true, message: "供应商不能为空", trigger: "blur" },
+          ];
+          rules.sourceOrderNo = [
+            { required: true, message: "源单编号不能为空", trigger: "blur" },
+          ];
+          rules.warehouseId = [
+            { required: true, message: "存储地点不能为空", trigger: "blur" },
+          ];
+        }
+        // 其他出库(3)需要的必填字段
+        else if (businessType === "3") {
+          rules.deptCode = [
+            { required: true, message: "部门不能为空", trigger: "blur" },
+          ];
+          rules.businessDescribe = [
+            {
+              required: true,
+              message: "业务分类名称不能为空",
+              trigger: "blur",
+            },
+          ];
+          rules.warehouseId = [
+            { required: true, message: "存储地点不能为空", trigger: "blur" },
+          ];
+        }
+      }
+
+      return rules;
+    },
   },
   watch: {
     "$route.query.id": {
@@ -755,6 +845,10 @@ export default {
     async changeBusinessType(value) {
       // 只更新businessType字段，避免覆盖整个formData
       this.formData.businessType = value;
+      // 重置表单校验状态
+      this.$nextTick(() => {
+        this.$refs.formRef.clearValidate();
+      });
       const { data } = await InRequestApi.getDictByOrderType({
         orderType: value,
       });
@@ -814,13 +908,15 @@ export default {
             }) => rest
           );
 
-        //上传的附件拼接传给后端
-        const fileIds = this.uploadFiles.map((item) => {
-          return item.id || item.name?.fileId;
-        }).filter(id => id && id !== '');
+        // 上传的附件拼接传给后端
+        const fileIds = this.uploadFiles
+          .map((item) => {
+            return item.id || item.name?.fileId;
+          })
+          .filter((id) => id && id !== "");
 
         // 拼接文件ID
-        data.fileId = fileIds.join(',');
+        data.fileId = fileIds.join(",");
 
         // 修改的提交;
         if (data.id) {
@@ -960,7 +1056,6 @@ export default {
     getFileList(data) {
       this.uploadFiles = data;
     },
-
   },
 };
 </script>