一些修改

zhangwencui

3 天以前 265d03ef2304f9461ba4926d729cda520c1e959c

一些修改

 src/views/productionManagement/processRoute/index.vue

@@ -17,12 +17,12 @@
          <div class="route-info">
            <span class="route-name"><el-icon style="margin-right: 8px;line-height: 30px;">
                <ScaleToOriginal />
              </el-icon>{{ route.routeName }}<el-tag style="margin-left: 8px"
                      :type="route.status == 1 ? 'warning' : 'success'">{{ route.status == 1 ? '草稿' : '批准' }}</el-tag></span>
            <span class="route-code">{{ route.routeCode }}</span>
              </el-icon>{{route.routeCode }}<el-tag style="margin-left: 8px"
                      :type="!route.status ? 'warning' : 'success'">{{ !route.status ? '草稿' : '批准' }}</el-tag></span>
            <!-- <span class="route-code">{{ route.routeCode }}</span> -->
          </div>
          <div class="route-actions">
            <el-button v-if="route.status === '1'"
            <el-button v-if="!route.status"
                       link
                       type="success"
                       @click="handleApproveRoute(route)">
@@ -31,7 +31,7 @@
              </el-icon>
              批准
            </el-button>
            <el-button v-if="route.status === '2'"
            <el-button v-if="route.status"
                       link
                       type="warning"
                       @click="handleRevokeApproveRoute(route)">
@@ -72,14 +72,14 @@
                <Document />
              </el-icon>
              <span class="meta-label">BOM:</span>
              <span class="meta-value">{{ route.bomId || '-' }}</span>
              <span class="meta-value">{{ route.bomNo || '-' }}</span>
            </span>
            <span class="meta-item">
              <el-icon>
                <Document />
              </el-icon>
              <span class="meta-label">路线描述:</span>
              <span class="meta-value">{{ route.routeDesc || '暂无描述' }}</span>
              <span class="meta-value">{{ route.description || '暂无描述' }}</span>
            </span>
          </div>
          <div class="expand-btn-wrapper">
@@ -121,9 +121,9 @@
                  </div>
                </div>
                <div class="process-node-body">
                  <div class="process-code">{{ process.processCode }}</div>
                  <div class="process-name">{{ process.processName }}</div>
                  <div class="process-desc">{{ process.processDesc || '暂无描述' }}</div>
                  <div class="process-code">{{ process.no }}</div>
                  <div class="process-name">{{ process.name }}</div>
                  <div class="process-desc">{{ process.remark || '暂无描述' }}</div>
                </div>
                <div class="process-node-footer">
                  <!-- <el-tag size="small"
@@ -201,9 +201,6 @@
              <span>新增工序</span>
            </div>
          </div>
          <el-empty v-if="!route.processList || route.processList.length === 0"
                    description="暂无工序"
                    :image-size="80" />
        </div>
      </div>
    </div>
@@ -240,16 +237,12 @@
        <el-form-item label="路线编码"
                      prop="routeCode">
          <el-input v-model="routeForm.routeCode"
                    placeholder="请输入路线编码" />
        </el-form-item>
        <el-form-item label="路线名称"
                      prop="routeName">
          <el-input v-model="routeForm.routeName"
                    placeholder="请输入路线名称" />
                    disabled
                    placeholder="自动生成" />
        </el-form-item>
        <el-form-item label="路线描述"
                      prop="routeDesc">
          <el-input v-model="routeForm.routeDesc"
                      prop="description">
          <el-input v-model="routeForm.description"
                    type="textarea"
                    :rows="3"
                    placeholder="请输入路线描述" />
@@ -283,18 +276,18 @@
               ref="processFormRef"
               label-width="120px">
        <el-form-item label="工序编码"
                      prop="processCode">
          <el-input v-model="processForm.processCode"
                      prop="no">
          <el-input v-model="processForm.no"
                    placeholder="请输入工序编码" />
        </el-form-item>
        <el-form-item label="工序名称"
                      prop="processName">
          <el-input v-model="processForm.processName"
                      prop="name">
          <el-input v-model="processForm.name"
                    placeholder="请输入工序名称" />
        </el-form-item>
        <el-form-item label="工序描述"
                      prop="processDesc">
          <el-input v-model="processForm.processDesc"
                      prop="remark">
          <el-input v-model="processForm.remark"
                    type="textarea"
                    :rows="3"
                    placeholder="请输入工序描述" />
@@ -302,8 +295,8 @@
        <el-form-item label="状态"
                      prop="status">
          <el-radio-group v-model="processForm.status">
            <el-radio label="1">启用</el-radio>
            <el-radio label="0">停用</el-radio>
            <el-radio :label="true">启用</el-radio>
            <el-radio :label="false">停用</el-radio>
          </el-radio-group>
        </el-form-item>
      </el-form>
@@ -341,20 +334,20 @@
                    border
                    highlight-current-row
                    @current-change="handleProcessSelect">
            <el-table-column prop="processCode"
            <el-table-column prop="no"
                             label="工序编号"
                             width="100" />
            <el-table-column prop="processName"
            <el-table-column prop="name"
                             label="工序名称" />
            <el-table-column prop="processDesc"
            <el-table-column prop="remark"
                             label="工序描述" />
            <el-table-column prop="status"
                             label="状态"
                             width="80">
              <template #default="scope">
                <el-tag size="small"
                        :type="scope.row.status === '1' ? 'success' : 'info'">
                  {{ scope.row.status === '1' ? '启用' : '停用' }}
                        :type="scope.row.status ? 'success' : 'info'">
                  {{ scope.row.status ? '启用' : '停用' }}
                </el-tag>
              </template>
            </el-table-column>
@@ -368,23 +361,29 @@
                   label-width="100px"
                   class="process-detail-form">
            <el-form-item label="工序编号">
              <span class="detail-text">{{ selectedProcessItem.processCode }}</span>
              <span class="detail-text">{{ selectedProcessItem.no }}</span>
            </el-form-item>
            <el-form-item label="工序名称">
              <span class="detail-text">{{ selectedProcessItem.processName }}</span>
              <span class="detail-text">{{ selectedProcessItem.name }}</span>
            </el-form-item>
            <el-form-item label="工序描述">
              <span class="detail-text">{{ selectedProcessItem.processDesc || '-' }}</span>
              <span class="detail-text">{{ selectedProcessItem.remark || '-' }}</span>
            </el-form-item>
            <el-form-item label="状态">
              <el-tag size="small"
                      :type="selectedProcessItem.status === '1' ? 'success' : 'info'">
                {{ selectedProcessItem.status === '1' ? '启用' : '停用' }}
                      :type="selectedProcessItem.status ? 'success' : 'info'">
                {{ selectedProcessItem.status ? '启用' : '停用' }}
              </el-tag>
            </el-form-item>
            <el-form-item label="参数数量">
              <span class="detail-text">{{ selectedProcessItem.paramCount || 0 }}个</span>
            <el-form-item label="是否质检">
              <el-tag size="small"
                      :type="selectedProcessItem.isQuality ? 'success' : 'info'">
                {{ selectedProcessItem.isQuality ? '质检' : '非质检' }}
              </el-tag>
            </el-form-item>
            <!-- <el-form-item label="参数数量">
              <span class="detail-text">{{ selectedProcessItem.paramCount || 0 }}个</span>
            </el-form-item> -->
          </el-form>
          <el-empty v-else
                    description="请从左侧选择工序" />
@@ -489,6 +488,186 @@
        </span>
      </template>
    </el-dialog>
    <!-- 选择参数对话框 -->
    <el-dialog v-model="selectParamDialogVisible"
               title="选择参数"
               width="1000px">
      <div class="param-select-container">
        <!-- 左侧参数列表 -->
        <div class="param-list-area">
          <div class="area-title">可选参数</div>
          <div class="search-box">
            <el-input v-model="paramSearchKeyword"
                      placeholder="请输入参数名称搜索"
                      clearable
                      size="small"
                      @input="handleParamSearch">
              <template #prefix>
                <el-icon>
                  <Search />
                </el-icon>
              </template>
            </el-input>
          </div>
          <el-table :data="filteredParamList"
                    height="300"
                    border
                    highlight-current-row
                    @current-change="handleParamSelect">
            <el-table-column prop="paramName"
                             label="参数名称" />
            <el-table-column prop="paramType"
                             label="参数类型">
              <template #default="scope">
                <el-tag size="small"
                        :type="getParamTypeTag(scope.row.paramType)">
                  {{ getParamTypeText(scope.row.paramType) }}
                </el-tag>
              </template>
            </el-table-column>
          </el-table>
          <!-- 分页控件 -->
          <div class="pagination-container"
               style="margin-top: 10px;">
            <el-pagination v-model:current-page="paramPage.current"
                           v-model:page-size="paramPage.size"
                           :page-sizes="[10, 20, 50, 100]"
                           layout="total, sizes, prev, pager, next, jumper"
                           :total="paramPage.total"
                           @size-change="handleParamSizeChange"
                           @current-change="handleParamCurrentChange"
                           size="small" />
          </div>
        </div>
        <!-- 右侧参数详情 -->
        <div class="param-detail-area">
          <div class="area-title">参数详情</div>
          <el-form v-if="selectedParam"
                   :model="selectedParam"
                   label-width="100px"
                   class="param-detail-form">
            <el-form-item label="参数名称">
              <span class="detail-text">{{ selectedParam.paramName }}</span>
            </el-form-item>
            <el-form-item label="参数模式">
              <el-tag size="small"
                      :type="selectedParam.valueMode == '1' ? 'success' : 'warning'">
                {{ selectedParam.valueMode == '1' ? '单值' : '区间' }}
              </el-tag>
            </el-form-item>
            <el-form-item label="参数类型">
              <el-tag size="small"
                      :type="getParamTypeTag(selectedParam.paramType)">
                {{ getParamTypeText(selectedParam.paramType) }}
              </el-tag>
            </el-form-item>
            <el-form-item label="参数格式">
              <span class="detail-text">{{ selectedParam.paramFormat || '-' }}</span>
            </el-form-item>
            <el-form-item label="单位">
              <span class="detail-text">{{ selectedParam.unit || '-' }}</span>
            </el-form-item>
            <el-form-item label="标准值"
                          v-if="selectedParam.valueMode == '1'">
              <el-input v-model="selectedParam.standardValue"
                        type="number"
                        placeholder="请输入默认值" />
            </el-form-item>
            <el-form-item label="最小值"
                          v-if="selectedParam.valueMode == '2'">
              <el-input v-model="selectedParam.minValue"
                        type="number"
                        placeholder="请输入最小值" />
            </el-form-item>
            <el-form-item label="最大值"
                          v-if="selectedParam.valueMode == '2'">
              <el-input v-model="selectedParam.maxValue"
                        type="number"
                        placeholder="请输入最大值" />
            </el-form-item>
            <el-form-item label="排序">
              <el-input v-model="selectedParam.sort"
                        type="number"
                        placeholder="请输入排序" />
            </el-form-item>
            <el-form-item label="是否必填">
              <el-switch v-model="selectedParam.isRequired"
                         :active-value="1"
                         :inactive-value="0" />
            </el-form-item>
          </el-form>
          <el-empty v-else
                    description="请从左侧选择参数" />
        </div>
      </div>
      <template #footer>
        <span class="dialog-footer">
          <el-button @click="selectParamDialogVisible = false">取消</el-button>
          <el-button type="primary"
                     :disabled="!selectedParam"
                     @click="handleParamSelectSubmit">确定</el-button>
        </span>
      </template>
    </el-dialog>
    <!-- 编辑参数对话框 -->
    <el-dialog v-model="editParamDialogVisible"
               title="编辑参数"
               width="600px">
      <el-form :model="editParamForm"
               :rules="editParamRules"
               ref="editParamFormRef"
               label-width="120px">
        <el-form-item label="参数名称">
          <span class="detail-text">{{ editParamForm.paramName }}</span>
        </el-form-item>
        <el-form-item label="参数模式">
          <el-tag size="small"
                  :type="editParamForm.valueMode == '1' ? 'success' : 'warning'">
            {{ editParamForm.valueMode == '1' ? '单值' : '区间' }}
          </el-tag>
        </el-form-item>
        <el-form-item label="标准值"
                      v-if="editParamForm.valueMode == '1'"
                      prop="standardValue">
          <el-input v-model="editParamForm.standardValue"
                    type="number"
                    placeholder="请输入标准值" />
        </el-form-item>
        <el-form-item label="最小值"
                      v-if="editParamForm.valueMode == '2'"
                      prop="minValue">
          <el-input v-model="editParamForm.minValue"
                    type="number"
                    placeholder="请输入最小值" />
        </el-form-item>
        <el-form-item label="最大值"
                      v-if="editParamForm.valueMode == '2'"
                      prop="maxValue">
          <el-input v-model="editParamForm.maxValue"
                    type="number"
                    placeholder="请输入最大值" />
        </el-form-item>
        <el-form-item label="排序"
                      prop="sort">
          <el-input v-model="editParamForm.sort"
                    type="number"
                    placeholder="请输入排序" />
        </el-form-item>
        <el-form-item label="是否必填"
                      prop="isRequired">
          <el-switch v-model="editParamForm.isRequired"
                     :active-value="1"
                     :inactive-value="0" />
        </el-form-item>
      </el-form>
      <template #footer>
        <span class="dialog-footer">
          <el-button @click="editParamDialogVisible = false">取消</el-button>
          <el-button type="primary"
                     @click="handleEditParamSubmit">确定</el-button>
        </span>
      </template>
    </el-dialog>
  </div>
</template>

@@ -510,6 +689,9 @@
  } from "@element-plus/icons-vue";
  import { listType } from "@/api/system/dict/type";
  import { getByModel } from "@/api/productionManagement/productBom.js";
  import { add, update, del } from "@/api/productionManagement/processRoute.js";
  import { list as getProcessListApi } from "@/api/productionManagement/productionProcess.js";
  import { getBaseParamList } from "@/api/basicData/parameterMaintenance.js";
  import ProductSelectDialog from "@/views/basicData/product/ProductSelectDialog.vue";

  // 工艺路线列表
@@ -534,17 +716,14 @@
    productModelName: "",
    bomId: null,
    routeCode: "",
    routeName: "",
    routeDesc: "",
    status: "1",
    description: "",
    status: true,
  });
  const routeRules = {
    productModelId: [
      { required: true, message: "请选择产品", trigger: "change" },
    ],
    bomId: [{ required: true, message: "请选择BOM", trigger: "change" }],
    routeCode: [{ required: true, message: "请输入路线编码", trigger: "blur" }],
    routeName: [{ required: true, message: "请输入路线名称", trigger: "blur" }],
  };

  // 工序对话框
@@ -554,14 +733,14 @@
  const currentRouteId = ref(null);
  const processForm = reactive({
    id: null,
    processCode: "",
    processName: "",
    processDesc: "",
    status: "1",
    no: "",
    name: "",
    remark: "",
    status: true,
  });
  const processRules = {
    processCode: [{ required: true, message: "请输入工序编码", trigger: "blur" }],
    processName: [{ required: true, message: "请输入工序名称", trigger: "blur" }],
    no: [{ required: true, message: "请输入工序编码", trigger: "blur" }],
    name: [{ required: true, message: "请输入工序名称", trigger: "blur" }],
  };

  // 选择工序对话框
@@ -599,121 +778,126 @@
    ],
  };

  // 选择参数对话框
  const selectParamDialogVisible = ref(false);
  const availableParamList = ref([]);
  const filteredParamList = ref([]);
  const selectedParam = ref(null);
  const paramSearchKeyword = ref("");

  // 可选参数分页
  const paramPage = reactive({
    current: 1,
    size: 10,
    total: 0,
  });

  // 编辑参数对话框
  const editParamDialogVisible = ref(false);
  const editParamFormRef = ref(null);
  const editParamForm = reactive({
    id: null,
    processId: null,
    paramId: null,
    paramName: "",
    valueMode: "1",
    standardValue: null,
    minValue: null,
    maxValue: null,
    sort: 1,
    isRequired: 0,
  });
  const editParamRules = reactive({
    standardValue: [
      {
        required: true,
        message: "请输入标准值",
        trigger: "blur",
        validator: (rule, value, callback) => {
          if (value === null || value === undefined || value === "") {
            callback(new Error("请输入标准值"));
          } else {
            callback();
          }
        },
      },
    ],
    minValue: [
      {
        required: true,
        message: "请输入最小值",
        trigger: "blur",
        validator: (rule, value, callback) => {
          if (value === null || value === undefined || value === "") {
            callback(new Error("请输入最小值"));
          } else {
            callback();
          }
        },
      },
    ],
    maxValue: [
      {
        required: true,
        message: "请输入最大值",
        trigger: "blur",
        validator: (rule, value, callback) => {
          if (value === null || value === undefined || value === "") {
            callback(new Error("请输入最大值"));
          } else {
            callback();
          }
        },
      },
    ],
    sort: [
      {
        required: true,
        message: "请输入排序",
        trigger: "blur",
        validator: (rule, value, callback) => {
          if (value === null || value === undefined || value === "") {
            callback(new Error("请输入排序"));
          } else if (isNaN(value) || value < 1) {
            callback(new Error("排序必须是大于0的整数"));
          } else {
            callback();
          }
        },
      },
    ],
  });

  // 拖拽相关
  const draggedItem = ref(null);
  const draggedRouteId = ref(null);

  // 获取工艺路线列表
  const getRouteList = () => {
    routeList.value = [
      {
        id: 1,
        productModelId: 1,
        productName: "标准砌块",
        productModelName: "3.5型",
        bomId: 1,
        routeCode: "ROUTE001",
        routeName: "标准砌块生产线",
        routeDesc: "标准砌块生产流程",
        status: "1",
        expanded: false,
        processList: [
          {
            id: 1,
            processCode: "PROC001",
            processName: "原料配比",
            processDesc: "原材料配比工序",
            status: "1",
    // 导入 listPage 方法
    import("@/api/productionManagement/processRoute.js").then(({ listPage }) => {
      listPage({ pageNum: 1, pageSize: 100 })
        .then(res => {
          // 处理返回的数据，映射到页面需要的格式
          routeList.value = (res.data?.records || []).map(item => ({
            id: item.id,
            productModelId: item.productModelId,
            productName: item.productName,
            productModelName: item.model || item.productModelName,
            bomId: item.bomId,
            bomNo: item.bomNo,
            routeCode: item.processRouteCode || item.routeCode,
            description: item.description || item.description,
            status: item.status,
            expanded: false,
            paramList: [
              {
                id: 1,
                parameterCode: "P001",
                parameterName: "水泥比例",
                parameterType2: "1",
                parameterType: "数值格式",
                parameterFormat: "",
                standardValue: "30",
                unit: "%",
              },
              {
                id: 2,
                parameterCode: "P002",
                parameterName: "砂比例",
                parameterType2: "1",
                parameterType: "数值格式",
                parameterFormat: "",
                standardValue: "60",
                unit: "%",
              },
            ],
          },
          {
            id: 2,
            processCode: "PROC002",
            processName: "搅拌混合",
            processDesc: "搅拌混合工序",
            status: "1",
            expanded: false,
            paramList: [
              {
                id: 3,
                parameterCode: "P003",
                parameterName: "搅拌时间",
                parameterType2: "1",
                parameterType: "数值格式",
                parameterFormat: "",
                standardValue: "5",
                unit: "分钟",
              },
            ],
          },
          {
            id: 3,
            processCode: "PROC003",
            processName: "浇筑成型",
            processDesc: "浇筑成型工序",
            status: "1",
            expanded: false,
            paramList: [],
          },
        ],
      },
      {
        id: 2,
        productModelId: 2,
        productName: "板材",
        productModelName: "5.0型",
        bomId: 2,
        routeCode: "ROUTE002",
        routeName: "板材生产线",
        routeDesc: "板材生产流程",
        status: "1",
        expanded: false,
        processList: [
          {
            id: 4,
            processCode: "PROC004",
            processName: "切割加工",
            processDesc: "切割加工工序",
            status: "1",
            expanded: false,
            paramList: [
              {
                id: 4,
                parameterCode: "P004",
                parameterName: "切割尺寸",
                parameterType2: "1",
                parameterType: "文本格式",
                parameterFormat: "",
                standardValue: "600x200x100",
                unit: "mm",
              },
            ],
          },
        ],
      },
    ];
            processList: item.processList || [],
          }));
        })
        .catch(err => {
          console.error("获取工艺路线列表失败：", err);
          routeList.value = [];
        });
    });
  };

  // 展开/收起工艺路线
@@ -735,9 +919,8 @@
    routeForm.productModelName = "";
    routeForm.bomId = null;
    routeForm.routeCode = "";
    routeForm.routeName = "";
    routeForm.routeDesc = "";
    routeForm.status = "1";
    routeForm.description = "";
    routeForm.status = false;
    bomOptions.value = [];
    routeDialogVisible.value = true;
  };
@@ -750,8 +933,7 @@
    routeForm.productModelName = route.productModelName;
    routeForm.bomId = route.bomId;
    routeForm.routeCode = route.routeCode;
    routeForm.routeName = route.routeName;
    routeForm.routeDesc = route.routeDesc;
    routeForm.description = route.description;
    routeForm.status = route.status;
    routeDialogVisible.value = true;
  };
@@ -762,17 +944,52 @@
      cancelButtonText: "取消",
      type: "warning",
    }).then(() => {
      ElMessage.success("删除成功");
      getRouteList();
      del(route.id)
        .then(res => {
          ElMessage.success("删除成功");
          getRouteList();
        })
        .catch(err => {
          ElMessage.error("删除失败");
        });
    });
  };

  const handleRouteSubmit = () => {
    routeFormRef.value.validate(valid => {
      if (valid) {
        ElMessage.success(isRouteEdit.value ? "编辑成功" : "新增成功");
        routeDialogVisible.value = false;
        getRouteList();
        // 构建提交数据
        const submitData = {
          ...routeForm,
          // 注意：API 期望的字段名可能与表单字段名不同
          productId: routeForm.productModelId,
          productModelId: routeForm.productModelId,
          description: routeForm.description,
        };

        if (isRouteEdit.value) {
          // 编辑操作
          update(submitData)
            .then(res => {
              ElMessage.success("编辑成功");
              routeDialogVisible.value = false;
              getRouteList();
            })
            .catch(err => {
              ElMessage.error("编辑失败");
            });
        } else {
          // 新增操作
          add(submitData)
            .then(res => {
              ElMessage.success("新增成功");
              routeDialogVisible.value = false;
              getRouteList();
            })
            .catch(err => {
              ElMessage.error("新增失败");
            });
        }
      }
    });
  };
@@ -819,8 +1036,15 @@
      cancelButtonText: "取消",
      type: "info",
    }).then(() => {
      route.status = "2";
      ElMessage.success("批准成功");
      // 调用修改接口，只修改status字段为批准状态
      update({ id: route.id, status: true })
        .then(res => {
          ElMessage.success("批准成功");
          getRouteList();
        })
        .catch(err => {
          ElMessage.error("批准失败");
        });
    });
  };

@@ -830,8 +1054,15 @@
      cancelButtonText: "取消",
      type: "warning",
    }).then(() => {
      route.status = "1";
      ElMessage.success("撤销批准成功");
      // 调用修改接口，只修改status字段为草稿状态
      update({ id: route.id, status: false })
        .then(res => {
          ElMessage.success("撤销批准成功");
          getRouteList();
        })
        .catch(err => {
          ElMessage.error("撤销批准失败");
        });
    });
  };

@@ -839,62 +1070,35 @@
  const handleSelectProcess = (route, index) => {
    currentRouteId.value = route.id;
    currentRouteIndex.value = index;
    // 获取可选工序列表（假数据）
    availableProcessList.value = [
      {
        id: 1,
        processCode: "PROC001",
        processName: "原料配比",
        processDesc: "原材料配比工序",
        status: "1",
        paramCount: 3,
      },
      {
        id: 2,
        processCode: "PROC002",
        processName: "搅拌混合",
        processDesc: "搅拌混合工序",
        status: "1",
        paramCount: 2,
      },
      {
        id: 3,
        processCode: "PROC003",
        processName: "浇筑成型",
        processDesc: "浇筑成型工序",
        status: "1",
        paramCount: 4,
      },
      {
        id: 4,
        processCode: "PROC004",
        processName: "蒸压养护",
        processDesc: "蒸压养护工序",
        status: "0",
        paramCount: 2,
      },
      {
        id: 5,
        processCode: "PROC005",
        processName: "切割加工",
        processDesc: "切割加工工序",
        status: "1",
        paramCount: 3,
      },
    ];
    filteredProcessList.value = availableProcessList.value;
    processSearchKeyword.value = "";
    selectedProcessItem.value = null;
    selectProcessDialogVisible.value = true;
    // 获取可选工序列表
    getProcessListApi()
      .then(res => {
        // 处理返回的数据，映射到页面需要的格式
        availableProcessList.value = (res.data || []).map(item => ({
          id: item.id,
          no: item.no || item.no,
          name: item.name || item.name,
          remark: item.remark || item.remark,
          status: item.status,
          isQuality: item.isQuality,
        }));
        filteredProcessList.value = availableProcessList.value;
        processSearchKeyword.value = "";
        selectedProcessItem.value = null;
        selectProcessDialogVisible.value = true;
      })
      .catch(() => {
        ElMessage.error("获取工序列表失败");
      });
  };

  const handleEditProcess = (routeId, process) => {
    currentRouteId.value = routeId;
    isProcessEdit.value = true;
    processForm.id = process.id;
    processForm.processCode = process.processCode;
    processForm.processName = process.processName;
    processForm.processDesc = process.processDesc;
    processForm.no = process.no;
    processForm.name = process.name;
    processForm.remark = process.remark;
    processForm.status = process.status;
    processDialogVisible.value = true;
  };
@@ -927,7 +1131,7 @@
      filteredProcessList.value = availableProcessList.value;
    } else {
      filteredProcessList.value = availableProcessList.value.filter(item =>
        item.processName.toLowerCase().includes(keyword)
        item.name.toLowerCase().includes(keyword)
      );
    }
  };
@@ -955,9 +1159,9 @@
    // 添加工序到工艺路线
    const newProcess = {
      id: Date.now(),
      processCode: selectedProcessItem.value.processCode,
      processName: selectedProcessItem.value.processName,
      processDesc: selectedProcessItem.value.processDesc,
      no: selectedProcessItem.value.no,
      name: selectedProcessItem.value.name,
      remark: selectedProcessItem.value.remark,
      status: selectedProcessItem.value.status,
      paramList: [],
      expanded: false,
@@ -972,31 +1176,39 @@
  const handleAddParam = (routeId, process) => {
    currentRouteId.value = routeId;
    currentProcessId.value = process.id;
    isParamEdit.value = false;
    paramForm.id = null;
    paramForm.parameterCode = "";
    paramForm.parameterName = "";
    paramForm.parameterType2 = "1";
    paramForm.parameterType = "";
    paramForm.parameterFormat = "";
    paramForm.standardValue = "";
    paramForm.unit = "";
    paramDialogVisible.value = true;
    selectedParam.value = null;
    paramSearchKeyword.value = "";
    paramPage.current = 1;
    // 获取可选参数列表
    getBaseParamList({
      paramName: paramSearchKeyword.value,
      current: paramPage.current,
      size: paramPage.size,
    }).then(res => {
      if (res.code === 200) {
        filteredParamList.value = res.data?.records || [];
        paramPage.total = res.data?.total || 0;
      } else {
        ElMessage.error(res.msg || "查询失败");
      }
    });
    selectParamDialogVisible.value = true;
  };

  const handleEditParam = (routeId, process, param) => {
    currentRouteId.value = routeId;
    currentProcessId.value = process.id;
    isParamEdit.value = true;
    paramForm.id = param.id;
    paramForm.parameterCode = param.parameterCode;
    paramForm.parameterName = param.parameterName;
    paramForm.parameterType2 = param.parameterType2 || "1";
    paramForm.parameterType = param.parameterType;
    paramForm.parameterFormat = param.parameterFormat;
    paramForm.standardValue = param.standardValue;
    paramForm.unit = param.unit;
    paramDialogVisible.value = true;
    editParamForm.id = param.id;
    editParamForm.processId = process.id;
    editParamForm.paramId = param.paramId;
    editParamForm.paramName = param.parameterName || param.paramName;
    editParamForm.valueMode = param.parameterType2 || param.valueMode || "1";
    editParamForm.standardValue = param.standardValue;
    editParamForm.minValue = param.minValue;
    editParamForm.maxValue = param.maxValue;
    editParamForm.sort = param.sort || 1;
    editParamForm.isRequired = param.isRequired || 0;
    editParamDialogVisible.value = true;
  };

  const handleDeleteParam = (routeId, process, param) => {
@@ -1032,12 +1244,161 @@

  const getParamTypeTag = type => {
    const typeMap = {
      1: "primary",
      2: "info",
      3: "warning",
      4: "success",
      数值格式: "primary",
      文本格式: "info",
      下拉选项: "warning",
      时间格式: "success",
    };
    return typeMap[type] || "default";
  };

  const getParamTypeText = type => {
    const typeMap = {
      1: "数值格式",
      2: "文本格式",
      3: "下拉选项",
      4: "时间格式",
      数值格式: "数值格式",
      文本格式: "文本格式",
      下拉选项: "下拉选项",
      时间格式: "时间格式",
    };
    return typeMap[type] || "未知参数类型";
  };

  // 选择参数相关方法
  const handleParamSearch = () => {
    // 重置分页
    paramPage.current = 1;
    // 重新加载数据
    getBaseParamList({
      paramName: paramSearchKeyword.value,
      current: paramPage.current,
      size: paramPage.size,
    }).then(res => {
      if (res.code === 200) {
        filteredParamList.value = res.data?.records || [];
        paramPage.total = res.data?.total || 0;
      } else {
        ElMessage.error(res.msg || "查询失败");
      }
    });
  };

  const handleParamSelect = row => {
    selectedParam.value = row;
  };

  // 处理分页大小变化
  const handleParamSizeChange = size => {
    paramPage.size = size;
    getBaseParamList({
      paramName: paramSearchKeyword.value,
      current: paramPage.current,
      size: paramPage.size,
    }).then(res => {
      if (res.code === 200) {
        filteredParamList.value = res.data?.records || [];
        paramPage.total = res.data?.total || 0;
      } else {
        ElMessage.error(res.msg || "查询失败");
      }
    });
  };

  // 处理当前页码变化
  const handleParamCurrentChange = current => {
    paramPage.current = current;
    getBaseParamList({
      paramName: paramSearchKeyword.value,
      current: paramPage.current,
      size: paramPage.size,
    }).then(res => {
      if (res.code === 200) {
        filteredParamList.value = res.data?.records || [];
        paramPage.total = res.data?.total || 0;
      } else {
        ElMessage.error(res.msg || "查询失败");
      }
    });
  };

  const handleParamSelectSubmit = () => {
    if (!selectedParam.value) {
      ElMessage.warning("请先选择一个参数");
      return;
    }

    // 找到对应的工艺路线和工序
    const route = routeList.value.find(r => r.id === currentRouteId.value);
    const process = route?.processList.find(p => p.id === currentProcessId.value);

    if (route && process) {
      // 检查参数是否已存在
      const exists = process.paramList?.some(
        p =>
          p.paramId === selectedParam.value.id ||
          p.parameterCode === selectedParam.value.paramCode
      );
      if (exists) {
        ElMessage.warning("该参数已存在于工序中");
        return;
      }

      // 添加工序到工艺路线
      const newParam = {
        id: Date.now(),
        paramId: selectedParam.value.id,
        parameterCode: selectedParam.value.paramCode,
        parameterName: selectedParam.value.paramName,
        parameterType2: selectedParam.value.valueMode || "1",
        parameterType: selectedParam.value.paramType,
        parameterFormat: selectedParam.value.paramFormat,
        standardValue: selectedParam.value.standardValue,
        minValue: selectedParam.value.minValue,
        maxValue: selectedParam.value.maxValue,
        unit: selectedParam.value.unit,
        sort: selectedParam.value.sort || 1,
        isRequired: selectedParam.value.isRequired || 0,
      };

      if (!process.paramList) {
        process.paramList = [];
      }

      process.paramList.push(newParam);
      ElMessage.success("添加参数成功");
      selectParamDialogVisible.value = false;
    }
  };

  const handleEditParamSubmit = () => {
    editParamFormRef.value.validate(valid => {
      if (valid) {
        // 找到对应的工艺路线、工序和参数
        const route = routeList.value.find(r => r.id === currentRouteId.value);
        const process = route?.processList.find(
          p => p.id === currentProcessId.value
        );
        const param = process?.paramList.find(p => p.id === editParamForm.id);

        if (param) {
          // 更新参数信息
          param.standardValue = editParamForm.standardValue;
          param.minValue = editParamForm.minValue;
          param.maxValue = editParamForm.maxValue;
          param.sort = editParamForm.sort;
          param.isRequired = editParamForm.isRequired;

          ElMessage.success("编辑成功");
          editParamDialogVisible.value = false;
        }
      }
    });
  };

  // 拖拽排序
@@ -1570,4 +1931,70 @@
      }
    }
  }

  // 选择参数对话框样式
  .param-select-container {
    display: flex;
    gap: 20px;
    height: 450px;

    .param-list-area {
      // flex: 1;
      width: 380px;
      display: flex;
      flex-direction: column;

      .area-title {
        font-size: 14px;
        font-weight: 600;
        color: #303133;
        margin-bottom: 12px;
        padding-bottom: 8px;
        border-bottom: 1px solid #ebeef5;
      }

      .search-box {
        margin-bottom: 12px;

        .el-input {
          width: 100%;
        }
      }
    }

    .param-detail-area {
      // width: 380px;
      flex: 1;
      display: flex;
      flex-direction: column;
      background: #f5f7fa;
      border-radius: 8px;
      padding: 16px;

      .area-title {
        font-size: 14px;
        font-weight: 600;
        color: #303133;
        margin-bottom: 16px;
        padding-bottom: 8px;
        border-bottom: 1px solid #ebeef5;
      }

      .param-detail-form {
        .el-form-item {
          margin-bottom: 12px;

          .el-form-item__label {
            color: #606266;
            font-weight: 500;
          }
        }

        .detail-text {
          color: #303133;
          font-weight: 500;
        }
      }
    }
  }
</style>

 src/views/productionManagement/productStructure/index.vue

@@ -50,7 +50,7 @@
                      prop="productModelId">
          <el-button type="primary"
                     @click="showProductSelectDialog = true">
            {{ form.productName || '选择产品' }}
            {{ form.productName || '选择产品' }}-{{ form.productModelName }}
          </el-button>
        </el-form-item>
        <el-form-item label="版本号"

 src/views/productionManagement/productionProcess/index.vue

@@ -70,7 +70,7 @@
          <el-button type="primary"
                     size="small"
                     :disabled="!selectedProcess"
                     @click="handleSelectParam">
                     @click="openParamDialog">
            <el-icon>
              <Plus />
            </el-icon>选择参数
@@ -683,6 +683,29 @@
      }
    });
  };
  const openParamDialog = () => {
    paramSearchKeyword.value = "";
    if (!selectedProcess.value) {
      ElMessage.warning("请先选择一个工序");
      return;
    }
    // 获取可选参数列表
    getBaseParamList({
      paramName: paramSearchKeyword.value,
      current: paramPage.current,
      size: paramPage.size,
    }).then(res => {
      if (res.code === 200) {
        filteredParamList.value = res.data?.records || [];
        paramPage.total = res.data?.total || 0;
      } else {
        ElMessage.error(res.msg || "查询失败");
      }
    });
    console.log(filteredParamList.value, "可选参数列表");
    selectedParam.value = null;
    paramDialogVisible.value = true;
  };

  // 参数操作
  const handleSelectParam = () => {

 src/views/qualityManagement/rawMaterialInspection/components/formDia.vue

@@ -5,35 +5,30 @@
               width="70%"
               @close="closeDia">
      <el-form :model="form"
               label-width="140px"
               label-position="top"
               label-width="100px"
               label-position="left"
               :rules="rules"
               ref="formRef">
        <el-row :gutter="30">
          <el-col :span="12">
            <el-form-item label="供应商：" prop="supplier">
             <el-input v-model="form.supplier" placeholder="请输入" clearable/>
               ref="formRef"
               class="inspection-form">
        <el-row :gutter="20">
          <el-col :span="8">
            <el-form-item label="供应商："
                          prop="supplier">
              <el-input v-model="form.supplier"
                        placeholder="请输入"
                        clearable />
            </el-form-item>
          </el-col>
          <el-col :span="12">
          <el-col :span="8">
            <el-form-item label="产品："
                          prop="productId">
              <el-button type="primary"
                         @click="openProductSelectDialog"
                         :disabled="operationType === 'edit'">选择产品</el-button>
              <div class="selected-product mt-2"
                   v-if="form.productName">
                <el-tag closable
                        @close="clearProductSelection"
                        class="mr-2">
                  {{ form.productName }} - {{ form.model }}
                </el-tag>
              </div>
              <div v-else
                   class="text-gray-400">请选择产品</div>
                         :disabled="operationType === 'edit'"
                         class="product-select-btn">{{form.productName || "选择产品"}}{{form.model?(" - "+form.model):""}}</el-button>
            </el-form-item>
          </el-col>
          <el-col :span="12">
          <el-col :span="8">
            <el-form-item label="试样编号："
                          prop="sampleCode">
              <el-input v-model="form.sampleCode"
@@ -41,7 +36,7 @@
                        clearable />
            </el-form-item>
          </el-col>
          <el-col :span="12">
          <el-col :span="8">
            <el-form-item label="车牌号："
                          prop="licensePlateNumber">
              <el-input v-model="form.licensePlateNumber"
@@ -49,10 +44,11 @@
                        clearable />
            </el-form-item>
          </el-col>
          <el-col :span="12">
          <el-col :span="8">
            <el-form-item label="检测性质："
                          prop="inspectNature">
              <el-select v-model="form.inspectNature">
              <el-select v-model="form.inspectNature"
                         style="width: 100%">
                <el-option label="日常检测"
                           value="日常检测" />
                <el-option label="入场验收"
@@ -60,10 +56,11 @@
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
          <el-col :span="8">
            <el-form-item label="试样状态："
                          prop="sampleState">
              <el-select v-model="form.sampleState">
              <el-select v-model="form.sampleState"
                         style="width: 100%">
                <el-option label="固体"
                           value="固体" />
                <el-option label="颗粒"
@@ -79,16 +76,14 @@
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="30">
          <el-col :span="12">
          <el-col :span="8">
            <el-form-item label="单位："
                          prop="unit">
              <el-input v-model="form.unit"
                        disabled />
            </el-form-item>
          </el-col>
          <el-col :span="12">
          <el-col :span="8">
            <el-form-item label="指标选择："
                          prop="testStandardId">
              <el-select v-model="form.testStandardId"
@@ -103,9 +98,7 @@
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="30">
          <el-col :span="12">
          <el-col :span="8">
            <el-form-item label="检测单位："
                          prop="checkCompany">
              <el-input v-model="form.checkCompany"
@@ -113,10 +106,11 @@
                        clearable />
            </el-form-item>
          </el-col>
          <el-col :span="12">
          <el-col :span="8">
            <el-form-item label="检测结果："
                          prop="checkResult">
              <el-select v-model="form.checkResult">
              <el-select v-model="form.checkResult"
                         style="width: 100%">
                <el-option label="合格"
                           value="合格" />
                <el-option label="不合格"
@@ -124,9 +118,7 @@
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="30">
          <el-col :span="12">
          <el-col :span="8">
            <el-form-item label="检验员："
                          prop="checkName">
              <el-select v-model="form.checkName"
@@ -140,7 +132,7 @@
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
          <el-col :span="8">
            <el-form-item label="检测日期："
                          prop="checkTime">
              <el-date-picker v-model="form.checkTime"
@@ -152,7 +144,7 @@
                              style="width: 100%" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
          <el-col :span="8">
            <el-form-item label="取样日期："
                          prop="sampleTime">
              <el-date-picker v-model="form.sampleTime"
@@ -269,7 +261,9 @@
        { required: false, message: "请选择试样状态", trigger: "change" },
      ],
      sampleCode: [{ required: false, message: "请输入", trigger: "blur" }],
      licensePlateNumber: [{ required: false, message: "请输入", trigger: "blur" }],
      licensePlateNumber: [
        { required: false, message: "请输入", trigger: "blur" },
      ],
      sampleTime: [{ required: false, message: "请输入", trigger: "blur" }],
    },
  });
@@ -595,4 +589,163 @@
</script>

<style scoped>
  .inspection-form {
    background-color: #f9f9f9;
    border-radius: 8px;
    padding: 20px;
    margin-bottom: 20px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  }

  .product-select-btn {
    width: 100%;
    text-align: left;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    transition: all 0.3s ease;
  }

  .product-select-btn:hover {
    box-shadow: 0 2px 8px rgba(0, 122, 255, 0.3);
  }

  /* 增加表单项间距 */
  .el-form-item {
    margin-bottom: 15px;
  }

  /* 输入框和选择器的悬停效果 */
  :deep(.el-input__wrapper) {
    transition: all 0.3s ease;
  }

  :deep(.el-input__wrapper:hover) {
    box-shadow: 0 0 0 2px rgba(0, 122, 255, 0.2) !important;
  }

  :deep(.el-select) {
    transition: all 0.3s ease;
  }

  :deep(.el-select:hover .el-input__wrapper) {
    box-shadow: 0 0 0 2px rgba(0, 122, 255, 0.2) !important;
  }

  /* 日期选择器的悬停效果 */
  :deep(.el-date-picker) {
    transition: all 0.3s ease;
  }

  :deep(.el-date-picker:hover .el-input__wrapper) {
    box-shadow: 0 0 0 2px rgba(0, 122, 255, 0.2) !important;
  }

  /* 优化表格样式 */
  :deep(.el-table) {
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
  }

  :deep(.el-table:hover) {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  }

  :deep(.el-table th) {
    background-color: #f5f7fa;
    font-weight: 600;
  }

  :deep(.el-table tr:hover) {
    background-color: #f0f9ff;
  }

  /* 表格输入框样式 */
  :deep(.el-table .el-input__wrapper) {
    box-shadow: none !important;
  }

  :deep(.el-table .el-input__wrapper:hover) {
    box-shadow: 0 0 0 2px rgba(0, 122, 255, 0.2) !important;
  }

  /* 优化对话框底部按钮 */
  .dialog-footer {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 20px;
  }

  .dialog-footer .el-button {
    transition: all 0.3s ease;
    padding: 8px 20px;
    border-radius: 4px;
  }

  .dialog-footer .el-button:hover {
    transform: translateY(-1px);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
  }

  .dialog-footer .el-button--primary:hover {
    box-shadow: 0 2px 8px rgba(0, 122, 255, 0.4);
  }

  /* 表单验证状态样式 */
  :deep(.el-form-item__error) {
    font-size: 12px;
    color: #f56c6c;
    margin-top: 4px;
  }

  :deep(.el-form-item.is-error .el-input__wrapper) {
    box-shadow: 0 0 0 2px rgba(245, 108, 108, 0.2) !important;
  }

  :deep(.el-form-item.is-success .el-input__wrapper) {
    box-shadow: 0 0 0 2px rgba(103, 194, 58, 0.2) !important;
  }

  /* 响应式设计 */
  @media screen and (max-width: 1200px) {
    .el-col {
      :deep(.el-col) {
        &[class*="el-col-8"] {
          flex: 0 0 50%;
          max-width: 50%;
        }
      }
    }
  }

  @media screen and (max-width: 768px) {
    .el-col {
      :deep(.el-col) {
        &[class*="el-col-8"] {
          flex: 0 0 100%;
          max-width: 100%;
        }
      }
    }

    .inspection-form {
      padding: 15px;
    }

    .el-form {
      label-width: 80px !important;
    }

    .dialog-footer {
      flex-direction: column;
      align-items: stretch;
    }

    .dialog-footer .el-button {
      width: 100%;
    }
  }
</style>

 src/views/qualityManagement/rawMaterialInspection/index.vue

@@ -3,327 +3,365 @@
    <div class="search_form">
      <div>
        <span class="search_title">供应商：</span>
        <el-input
            v-model="searchForm.supplier"
            style="width: 240px"
            placeholder="请输入供应商搜索"
            @change="handleQuery"
            clearable
            :prefix-icon="Search"
        />
        <span style="margin-left: 10px" class="search_title">检测日期：</span>
        <el-date-picker v-model="searchForm.entryDate" value-format="YYYY-MM-DD" format="YYYY-MM-DD" type="daterange"
                        placeholder="请选择" clearable @change="changeDaterange"/>
        <el-button type="primary" @click="handleQuery" style="margin-left: 10px"
        >搜索
        </el-button
        >
        <el-input v-model="searchForm.supplier"
                  style="width: 240px"
                  placeholder="请输入供应商搜索"
                  @change="handleQuery"
                  clearable
                  :prefix-icon="Search" />
        <span style="margin-left: 10px"
              class="search_title">检测日期：</span>
        <el-date-picker v-model="searchForm.entryDate"
                        value-format="YYYY-MM-DD"
                        format="YYYY-MM-DD"
                        type="daterange"
                        placeholder="请选择"
                        clearable
                        @change="changeDaterange" />
        <el-button type="primary"
                   @click="handleQuery"
                   style="margin-left: 10px">搜索
        </el-button>
      </div>
      <div>
        <el-button type="primary" @click="openForm('add')">新增</el-button>
        <el-button type="primary"
                   @click="openForm('add')">新增</el-button>
        <el-button @click="handleOut">导出</el-button>
        <el-button type="danger" plain @click="handleDelete">删除</el-button>
        <el-button type="danger"
                   plain
                   @click="handleDelete">删除</el-button>
      </div>
    </div>
    <div class="table_list">
      <PIMTable
          rowKey="id"
          :column="tableColumn"
          :tableData="tableData"
          :page="page"
          :isSelection="true"
          @selection-change="handleSelectionChange"
          :tableLoading="tableLoading"
          @pagination="pagination"
          :total="page.total"
      ></PIMTable>
      <PIMTable rowKey="id"
                :column="tableColumn"
                :tableData="tableData"
                :page="page"
                :isSelection="true"
                @selection-change="handleSelectionChange"
                :tableLoading="tableLoading"
                @pagination="pagination"
                :total="page.total"></PIMTable>
    </div>
    <InspectionFormDia ref="inspectionFormDia" @close="handleQuery"></InspectionFormDia>
    <FormDia ref="formDia" @close="handleQuery"></FormDia>
    <files-dia ref="filesDia" @close="handleQuery"></files-dia>
    <el-dialog v-model="dialogFormVisible" title="编辑检验员" width="30%"
    <InspectionFormDia ref="inspectionFormDia"
                       @close="handleQuery"></InspectionFormDia>
    <FormDia ref="formDia"
             @close="handleQuery"></FormDia>
    <files-dia ref="filesDia"
               @close="handleQuery"></files-dia>
    <el-dialog v-model="dialogFormVisible"
               title="编辑检验员"
               width="30%"
               @close="closeDia">
      <el-form :model="form" label-width="140px" label-position="top" :rules="rules" ref="formRef">
        <el-form-item label="检验员：" prop="checkName">
          <el-select v-model="form.checkName" placeholder="请选择" clearable>
            <el-option v-for="item in userList" :key="item.nickName" :label="item.nickName"
                       :value="item.nickName"/>
      <el-form :model="form"
               label-width="140px"
               label-position="top"
               :rules="rules"
               ref="formRef">
        <el-form-item label="检验员："
                      prop="checkName">
          <el-select v-model="form.checkName"
                     placeholder="请选择"
                     clearable>
            <el-option v-for="item in userList"
                       :key="item.nickName"
                       :label="item.nickName"
                       :value="item.nickName" />
          </el-select>
        </el-form-item>
      </el-form>
      <template #footer>
        <div class="dialog-footer">
          <el-button type="primary" @click="submitForm">确认</el-button>
          <el-button type="primary"
                     @click="submitForm">确认</el-button>
          <el-button @click="closeDia">取消</el-button>
        </div>
      </template>
    </el-dialog>

  </div>
</template>

<script setup>
import {Search} from "@element-plus/icons-vue";
import {onMounted, ref, reactive, toRefs, getCurrentInstance, nextTick} from "vue";
import InspectionFormDia from "@/views/qualityManagement/rawMaterialInspection/components/inspectionFormDia.vue";
import FormDia from "@/views/qualityManagement/rawMaterialInspection/components/formDia.vue";
import {ElMessageBox} from "element-plus";
import {
  downloadQualityInspect,
  qualityInspectDel,
  qualityInspectListPage, qualityInspectUpdate,
  submitQualityInspect
} from "@/api/qualityManagement/rawMaterialInspection.js";
import FilesDia from "@/views/qualityManagement/rawMaterialInspection/components/filesDia.vue";
import dayjs from "dayjs";
import {userListNoPage} from "@/api/system/user.js";
import useUserStore from "@/store/modules/user";
  import { Search } from "@element-plus/icons-vue";
  import {
    onMounted,
    ref,
    reactive,
    toRefs,
    getCurrentInstance,
    nextTick,
  } from "vue";
  import InspectionFormDia from "@/views/qualityManagement/rawMaterialInspection/components/inspectionFormDia.vue";
  import FormDia from "@/views/qualityManagement/rawMaterialInspection/components/formDia.vue";
  import { ElMessageBox } from "element-plus";
  import {
    downloadQualityInspect,
    qualityInspectDel,
    qualityInspectListPage,
    qualityInspectUpdate,
    submitQualityInspect,
  } from "@/api/qualityManagement/rawMaterialInspection.js";
  import FilesDia from "@/views/qualityManagement/rawMaterialInspection/components/filesDia.vue";
  import dayjs from "dayjs";
  import { userListNoPage } from "@/api/system/user.js";
  import useUserStore from "@/store/modules/user";

const data = reactive({
  searchForm: {
    supplier: "",
    entryDate: undefined, // 录入日期
    entryDateStart: undefined,
    entryDateEnd: undefined,
  },
  rules: {
    checkName: [{required: true, message: "请选择", trigger: "change"}],
  },
});
const {searchForm, rules} = toRefs(data);
const tableColumn = ref([
  {
    label: "检测日期",
    prop: "checkTime",
    width: 120
  },
  {
    label: "供应商",
    prop: "supplier",
    width: 130
  },
  {
    label: "检验员",
    prop: "checkName",
  },
  {
    label: "产品名称",
    prop: "productName",
  },
  {
    label: "规格型号",
    prop: "model",
  },
  {
    label: "单位",
    prop: "unit",
     width: 80
  },
  {
    label: "数量",
    prop: "quantity",
    width: 120
  },
  {
    label: "试样编号",
    prop: "sampleCode",
  },
  {
    label: "试样状态",
    prop: "sampleState",
  },
  {
    label: "检测性质",
    prop: "inspectNature",
  },
   {
    label: "取样日期",
    prop: "sampleTime",
  },
  {
    label: "检测单位",
    prop: "checkCompany",
  },
  {
    label: "检测结果",
    prop: "checkResult",
    dataType: "tag",
    formatType: (params) => {
      if (params === '不合格') {
        return "danger";
      } else if (params === '合格') {
        return "success";
      } else {
        return null;
      }
  const data = reactive({
    searchForm: {
      supplier: "",
      entryDate: undefined, // 录入日期
      entryDateStart: undefined,
      entryDateEnd: undefined,
    },
  },
  {
    label: "提交状态",
    prop: "inspectState",
    formatData: (params) => {
      if (params) {
        return "已提交";
      } else {
        return "未提交";
      }
    rules: {
      checkName: [{ required: true, message: "请选择", trigger: "change" }],
    },
  },
  {
    dataType: "action",
    label: "操作",
    align: "center",
    fixed: "right",
    width: 280,
    operation: [
      {
        name: "编辑",
        type: "text",
        clickFun: (row) => {
          openForm("edit", row);
        },
                disabled: (row) => {
                    // 已提交则禁用
                    if (row.inspectState == 1) return true;
                    // 如果检验员有值，只有当前登录用户能编辑
                    if (row.checkName) {
                        return row.checkName !== userStore.nickName;
                    }
                    return false;
                }
  });
  const { searchForm, rules } = toRefs(data);
  const tableColumn = ref([
    {
      label: "检测日期",
      prop: "checkTime",
      width: 120,
    },
    {
      label: "供应商",
      prop: "supplier",
      width: 130,
    },
    {
      label: "检验员",
      prop: "checkName",
    },
    {
      label: "产品名称",
      prop: "productName",
      dataType: "tag",
    },
    {
      label: "规格型号",
      prop: "model",
    },
    {
      label: "单位",
      prop: "unit",
      width: 80,
    },
    {
      label: "数量",
      prop: "quantity",
      width: 120,
    },
    {
      label: "试样编号",
      prop: "sampleCode",
    },
    {
      label: "试样状态",
      prop: "sampleState",
    },
    {
      label: "检测性质",
      prop: "inspectNature",
    },
    {
      label: "取样日期",
      prop: "sampleTime",
    },
    {
      label: "检测单位",
      prop: "checkCompany",
    },
    {
      label: "检测结果",
      prop: "checkResult",
      dataType: "tag",
      formatType: params => {
        if (params === "不合格") {
          return "danger";
        } else if (params === "合格") {
          return "success";
        } else {
          return null;
        }
      },
      {
        name: "附件",
        type: "text",
        clickFun: (row) => {
          openFilesFormDia(row);
        },
    },
    {
      label: "提交状态",
      prop: "inspectState",
      dataType: "tag",
      formatType: params => {
        if (params) {
          return "success";
        } else {
          return "info";
        }
      },
      {
        name: "提交",
        type: "text",
        clickFun: (row) => {
          submit(row.id);
        },
                disabled: (row) => {
                    // 已提交则禁用
                    if (row.inspectState == 1) return true;
                    // 如果检验员有值，只有当前登录用户能提交
                    if (row.checkName) {
                        return row.checkName !== userStore.nickName;
                    }
                    return false;
                }
      formatData: params => {
        if (params) {
          return "已提交";
        } else {
          return "未提交";
        }
      },
      {
        name: "分配检验员",
        type: "text",
        clickFun: (row) => {
          if (!row.checkName) {
            open(row)
          } else {
            proxy.$modal.msgError("检验员已存在");
          }
    },
    {
      dataType: "action",
      label: "操作",
      align: "center",
      fixed: "right",
      width: 280,
      operation: [
        {
          name: "编辑",
          type: "text",
          clickFun: row => {
            openForm("edit", row);
          },
          disabled: row => {
            // 已提交则禁用
            if (row.inspectState == 1) return true;
            // 如果检验员有值，只有当前登录用户能编辑
            if (row.checkName) {
              return row.checkName !== userStore.nickName;
            }
            return false;
          },
        },
                disabled: (row) => {
                    return row.inspectState == 1 || row.checkName;
                }
      },
      {
        name: "下载",
        type: "text",
        clickFun: (row) => {
          downLoadFile(row);
        {
          name: "附件",
          type: "text",
          clickFun: row => {
            openFilesFormDia(row);
          },
        },
      },
    ],
  },
]);
const tableData = ref([]);
const selectedRows = ref([]);
const tableLoading = ref(false);
const userList = ref([]);
const dialogFormVisible = ref(false);
const form = ref({
  checkName: ""
});
const page = reactive({
  current: 1,
  size: 100,
  total: 0
});
const currentRow = ref(null)
const formDia = ref()
const filesDia = ref()
const inspectionFormDia = ref()
const {proxy} = getCurrentInstance()
const userStore = useUserStore()
const changeDaterange = (value) => {
  searchForm.value.entryDateStart = undefined;
  searchForm.value.entryDateEnd = undefined;
  if (value) {
    searchForm.value.entryDateStart = dayjs(value[0]).format("YYYY-MM-DD");
    searchForm.value.entryDateEnd = dayjs(value[1]).format("YYYY-MM-DD");
  }
  getList();
};
// 查询列表
/** 搜索按钮操作 */
const handleQuery = () => {
  page.current = 1;
  getList();
};
const pagination = (obj) => {
  page.current = obj.page;
  page.size = obj.limit;
  getList();
};
const getList = () => {
  tableLoading.value = true;
  const params = {...searchForm.value, ...page};
  params.entryDate = undefined
  qualityInspectListPage({...params, inspectType: 0}).then(res => {
    tableLoading.value = false;
    tableData.value = res.data.records
    page.total = res.data.total;
  }).catch(err => {
    tableLoading.value = false;
  })
};
// 表格选择数据
const handleSelectionChange = (selection) => {
  selectedRows.value = selection;
};
        {
          name: "提交",
          type: "text",
          clickFun: row => {
            submit(row.id);
          },
          disabled: row => {
            // 已提交则禁用
            if (row.inspectState == 1) return true;
            // 如果检验员有值，只有当前登录用户能提交
            if (row.checkName) {
              return row.checkName !== userStore.nickName;
            }
            return false;
          },
        },
        {
          name: "分配检验员",
          type: "text",
          clickFun: row => {
            if (!row.checkName) {
              open(row);
            } else {
              proxy.$modal.msgError("检验员已存在");
            }
          },
          disabled: row => {
            return row.inspectState == 1 || row.checkName;
          },
        },
        {
          name: "下载",
          type: "text",
          clickFun: row => {
            downLoadFile(row);
          },
        },
      ],
    },
  ]);
  const tableData = ref([]);
  const selectedRows = ref([]);
  const tableLoading = ref(false);
  const userList = ref([]);
  const dialogFormVisible = ref(false);
  const form = ref({
    checkName: "",
  });
  const page = reactive({
    current: 1,
    size: 100,
    total: 0,
  });
  const currentRow = ref(null);
  const formDia = ref();
  const filesDia = ref();
  const inspectionFormDia = ref();
  const { proxy } = getCurrentInstance();
  const userStore = useUserStore();
  const changeDaterange = value => {
    searchForm.value.entryDateStart = undefined;
    searchForm.value.entryDateEnd = undefined;
    if (value) {
      searchForm.value.entryDateStart = dayjs(value[0]).format("YYYY-MM-DD");
      searchForm.value.entryDateEnd = dayjs(value[1]).format("YYYY-MM-DD");
    }
    getList();
  };
  // 查询列表
  /** 搜索按钮操作 */
  const handleQuery = () => {
    page.current = 1;
    getList();
  };
  const pagination = obj => {
    page.current = obj.page;
    page.size = obj.limit;
    getList();
  };
  const getList = () => {
    tableLoading.value = true;
    const params = { ...searchForm.value, ...page };
    params.entryDate = undefined;
    qualityInspectListPage({ ...params, inspectType: 0 })
      .then(res => {
        tableLoading.value = false;
        tableData.value = res.data.records;
        page.total = res.data.total;
      })
      .catch(err => {
        tableLoading.value = false;
      });
  };
  // 表格选择数据
  const handleSelectionChange = selection => {
    selectedRows.value = selection;
  };

// 打开弹框
const openForm = (type, row) => {
  nextTick(() => {
    formDia.value?.openDialog(type, row)
  })
};
// 打开附件弹框
const openFilesFormDia = (type, row) => {
  nextTick(() => {
    filesDia.value?.openDialog(type, row)
  })
};
  // 打开弹框
  const openForm = (type, row) => {
    nextTick(() => {
      formDia.value?.openDialog(type, row);
    });
  };
  // 打开附件弹框
  const openFilesFormDia = (type, row) => {
    nextTick(() => {
      filesDia.value?.openDialog(type, row);
    });
  };

// 删除
const handleDelete = () => {
  let ids = [];
  if (selectedRows.value.length > 0) {
    ids = selectedRows.value.map((item) => item.id);
  } else {
    proxy.$modal.msgWarning("请选择数据");
    return;
  }
  ElMessageBox.confirm("选中的内容将被删除，是否确认删除？", "导出", {
    confirmButtonText: "确认",
    cancelButtonText: "取消",
    type: "warning",
  })
  // 删除
  const handleDelete = () => {
    let ids = [];
    if (selectedRows.value.length > 0) {
      ids = selectedRows.value.map(item => item.id);
    } else {
      proxy.$modal.msgWarning("请选择数据");
      return;
    }
    ElMessageBox.confirm("选中的内容将被删除，是否确认删除？", "导出", {
      confirmButtonText: "确认",
      cancelButtonText: "取消",
      type: "warning",
    })
      .then(() => {
        qualityInspectDel(ids).then((res) => {
        qualityInspectDel(ids).then(res => {
          proxy.$modal.msgSuccess("删除成功");
          getList();
        });
@@ -331,79 +369,345 @@
      .catch(() => {
        proxy.$modal.msg("已取消");
      });
};
// 导出
const handleOut = () => {
  ElMessageBox.confirm("选中的内容将被导出，是否确认导出？", "导出", {
    confirmButtonText: "确认",
    cancelButtonText: "取消",
    type: "warning",
  })
  };
  // 导出
  const handleOut = () => {
    ElMessageBox.confirm("选中的内容将被导出，是否确认导出？", "导出", {
      confirmButtonText: "确认",
      cancelButtonText: "取消",
      type: "warning",
    })
      .then(() => {
        proxy.download("/quality/qualityInspect/export", {inspectType: 0}, "原材料检验.xlsx");
        proxy.download(
          "/quality/qualityInspect/export",
          { inspectType: 0 },
          "原材料检验.xlsx"
        );
      })
      .catch(() => {
        proxy.$modal.msg("已取消");
      });
};
  };

// 提价
const submit = async (id) => {
  const res = await submitQualityInspect({id: id})
  if (res.code === 200) {
    proxy.$modal.msgSuccess("提交成功");
    getList();
  }
}

// 关闭弹框
const closeDia = () => {
  proxy.resetForm("formRef");
  dialogFormVisible.value = false;
};

const submitForm = () => {
  if (currentRow.value) {
    const data = {
      ...form.value,
      id: currentRow.value.id
    }
    qualityInspectUpdate(data).then(res => {
  // 提价
  const submit = async id => {
    const res = await submitQualityInspect({ id: id });
    if (res.code === 200) {
      proxy.$modal.msgSuccess("提交成功");
      closeDia();
      getList();
    })
  }
};
    }
  };

const open = async (row) => {
  let userLists = await userListNoPage();
  userList.value = userLists.data;
  currentRow.value = row
  dialogFormVisible.value = true
}
  // 关闭弹框
  const closeDia = () => {
    proxy.resetForm("formRef");
    dialogFormVisible.value = false;
  };

const downLoadFile = (row) => {
  downloadQualityInspect({ id: row.id }).then((blobData) => {
    const blob = new Blob([blobData], {
      type: 'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
    })
    const downloadUrl = window.URL.createObjectURL(blob)
  const submitForm = () => {
    if (currentRow.value) {
      const data = {
        ...form.value,
        id: currentRow.value.id,
      };
      qualityInspectUpdate(data).then(res => {
        proxy.$modal.msgSuccess("提交成功");
        closeDia();
        getList();
      });
    }
  };

    const link = document.createElement('a')
    link.href = downloadUrl
    link.download = '原材料检验报告.docx'
    document.body.appendChild(link)
    link.click()
  const open = async row => {
    let userLists = await userListNoPage();
    userList.value = userLists.data;
    currentRow.value = row;
    dialogFormVisible.value = true;
  };

    document.body.removeChild(link)
    window.URL.revokeObjectURL(downloadUrl)
  })
};
  const downLoadFile = row => {
    downloadQualityInspect({ id: row.id }).then(blobData => {
      const blob = new Blob([blobData], {
        type: "application/vnd.openxmlformats-officedocument.wordprocessingml.document",
      });
      const downloadUrl = window.URL.createObjectURL(blob);

onMounted(() => {
  getList();
});
      const link = document.createElement("a");
      link.href = downloadUrl;
      link.download = "原材料检验报告.docx";
      document.body.appendChild(link);
      link.click();

      document.body.removeChild(link);
      window.URL.revokeObjectURL(downloadUrl);
    });
  };

  onMounted(() => {
    getList();
  });
</script>

<style scoped></style>
<style scoped>
  .app-container {
    padding: 20px;
    background-color: #f5f7fa;
    min-height: 100vh;
  }

  .search_form {
    background-color: #fff;
    border-radius: 8px;
    padding: 20px;
    margin-bottom: 20px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08);
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 15px;
  }

  .search_form > div {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
  }

  .search_title {
    font-size: 14px;
    color: #303133;
    font-weight: 500;
  }

  .table_list {
    background-color: #fff;
    border-radius: 8px;
    padding: 20px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08);
  }

  /* 表格样式优化 */
  :deep(.el-table) {
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease;
  }

  :deep(.el-table:hover) {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
  }

  :deep(.el-table th) {
    background-color: #f5f7fa;
    font-weight: 600;
    color: #303133;
    border-bottom: 2px solid #e4e7ed;
  }

  :deep(.el-table td) {
    border-bottom: 1px solid #ebeef5;
  }

  :deep(.el-table tr:hover) {
    background-color: #f0f9ff;
  }

  :deep(.el-table .el-table__row) {
    transition: background-color 0.3s ease;
  }

  /* 按钮样式优化 */
  .el-button {
    transition: all 0.3s ease;
    border-radius: 4px;
    font-weight: 500;
  }

  .el-button:hover {
    transform: translateY(-1px);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
  }

  .el-button--primary:hover {
    box-shadow: 0 2px 8px rgba(0, 122, 255, 0.4);
  }

  .el-button--danger:hover {
    box-shadow: 0 2px 8px rgba(245, 108, 108, 0.4);
  }

  /* 输入框样式优化 */
  :deep(.el-input__wrapper) {
    transition: all 0.3s ease;
    border-radius: 4px;
  }

  :deep(.el-input__wrapper:hover) {
    box-shadow: 0 0 0 2px rgba(0, 122, 255, 0.2) !important;
  }

  :deep(.el-input__wrapper.is-focus) {
    box-shadow: 0 0 0 2px rgba(0, 122, 255, 0.4) !important;
  }

  /* 日期选择器样式优化 */
  :deep(.el-date-editor) {
    transition: all 0.3s ease;
  }

  :deep(.el-date-editor:hover .el-input__wrapper) {
    box-shadow: 0 0 0 2px rgba(0, 122, 255, 0.2) !important;
  }

  /* 对话框样式优化 */
  :deep(.el-dialog) {
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  }

  :deep(.el-dialog__header) {
    background-color: #f5f7fa;
    border-bottom: 1px solid #e4e7ed;
    padding: 15px 20px;
    margin: 0;
  }

  :deep(.el-dialog__title) {
    font-size: 16px;
    font-weight: 600;
    color: #303133;
  }

  :deep(.el-dialog__body) {
    padding: 20px;
  }

  :deep(.el-dialog__footer) {
    padding: 15px 20px;
    border-top: 1px solid #e4e7ed;
  }

  .dialog-footer {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
  }

  /* 表单样式优化 */
  :deep(.el-form-item__label) {
    font-weight: 500;
    color: #606266;
  }

  :deep(.el-select) {
    width: 100%;
  }

  /* 分页样式优化 */
  :deep(.el-pagination) {
    margin-top: 20px;
    display: flex;
    justify-content: flex-end;
  }

  :deep(.el-pagination button) {
    border-radius: 4px;
    transition: all 0.3s ease;
  }

  :deep(.el-pagination button:hover) {
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  }

  /* 标签样式优化 */
  :deep(.el-tag) {
    border-radius: 4px;
    font-weight: 500;
  }

  :deep(.el-tag--success) {
    background-color: #f0f9ff;
    border-color: #b3d8ff;
    color: #409eff;
  }

  :deep(.el-tag--danger) {
    background-color: #fef0f0;
    border-color: #fbc4c4;
    color: #f56c6c;
  }

  /* 操作按钮样式 */
  :deep(.el-button--text) {
    padding: 0 8px;
    font-weight: 500;
    transition: all 0.3s ease;
  }

  :deep(.el-button--text:hover) {
    transform: translateY(-1px);
  }

  /* 响应式设计 */
  @media screen and (max-width: 1200px) {
    .search_form {
      flex-direction: column;
      align-items: stretch;
    }

    .search_form > div {
      width: 100%;
      justify-content: space-between;
    }

    .search_form > div:first-child {
      flex-wrap: wrap;
    }

    .search_title {
      width: 100%;
      margin-bottom: 8px;
    }
  }

  @media screen and (max-width: 768px) {
    .app-container {
      padding: 10px;
    }

    .search_form {
      padding: 15px;
    }

    .table_list {
      padding: 15px;
    }

    .search_form > div {
      flex-direction: column;
      align-items: stretch;
    }

    .search_form > div .el-input,
    .search_form > div .el-date-picker {
      width: 100% !important;
    }

    .search_form > div .el-button {
      width: 100%;
      margin-top: 10px;
    }

    :deep(.el-dialog) {
      width: 90% !important;
    }

    :deep(.el-table) {
      font-size: 12px;
    }
  }
</style>