分派生产单到班组长，班组长：排产工单到班组成员

huminmin

2026-05-12 919177aceb22d6cca9c176a46c299d099a0ba0af

 src/views/productionManagement/workOrderEdit/index.vue

@@ -117,6 +117,45 @@
        </span>
      </template>
    </el-dialog>
    <!-- 指定班组成员弹窗（单选） -->
    <el-dialog v-model="assignTeamUserDialogVisible"
               title="指定班组成员"
               width="800px">
      <div class="assign-team-user-content">
        <div class="selected-info-box"
             v-if="selectedTeamUserId">
          <div class="info-label">已选择：</div>
          <div class="info-value">{{ getTeamUserNameById(selectedTeamUserId) }}</div>
        </div>
        <div class="team-user-list-container"
             v-loading="teamUserTableLoading">
          <el-radio-group v-model="selectedTeamUserId">
            <div class="team-user-grid">
              <div v-for="item in teamUserTableData"
                   :key="item.userId"
                   class="team-user-item">
                <el-radio :label="item.userId">
                  <div class="team-user-info">
                    <span class="name">{{ item.nickName }}</span>
                  </div>
                </el-radio>
              </div>
            </div>
          </el-radio-group>
          <div v-if="teamUserTableData.length === 0"
               class="empty-text">
            暂无匹配人员
          </div>
        </div>
      </div>
      <template #footer>
        <span class="dialog-footer">
          <el-button type="primary"
                     @click="handleSaveTeamUser">确定</el-button>
          <el-button @click="assignTeamUserDialogVisible = false">取消</el-button>
        </span>
      </template>
    </el-dialog>
  </div>
</template>

@@ -126,9 +165,10 @@
  import {
    productWorkOrderPage,
    updateProductWorkOrder,
    assignProductWorkOrder,
    assignProductWorkOrder, assignTeamUser,
  } from "@/api/productionManagement/workOrder.js";
  import { listUser } from "@/api/system/user.js";
  import {getTeamMemberListByTeamLeader} from "@/api/productionManagement/productionTeamUserRel.js";

  const { proxy } = getCurrentInstance();

@@ -209,6 +249,11 @@
      width: "180",
    },
    {
      label: "指定班组成员",
      prop: "teamUserName",
      width: "180",
    },
    {
      label: "操作",
      width: "200",
      align: "center",
@@ -225,6 +270,12 @@
          name: "指定报工人",
          clickFun: row => {
            handleAssignReporter(row);
          },
        },
        {
          name: "指定班组成员",
          clickFun: row => {
            handleAssignTeamUser(row);
          },
        },
      ],
@@ -341,6 +392,32 @@
    getEmployeeList();
  };

  // 指定班组成员相关
  const assignTeamUserDialogVisible = ref(false);
  const teamUserTableLoading = ref(false);
  const teamUserTableData = ref([]);
  const teamUserPage = reactive({
    current: 1,
    size: 100,
    total: 0,
  });

  const currentTeamUser = ref(null);
  const selectedTeamUserId = ref(null);

  const handleAssignTeamUser = row => {
    currentTeamUser.value = row;
    assignTeamUserDialogVisible.value = true;
    // 回显已选择的人员（单选）
    if (row.teamUserId) {
      selectedTeamUserId.value = row.teamUserId;
    } else {
      selectedTeamUserId.value = null;
    }
    getTeamUserList(row.leaderUserId);
  };


  const getEmployeeList = () => {
    employeeTableLoading.value = true;
    const params = {
@@ -385,6 +462,45 @@
      .then(() => {
        proxy.$modal.msgSuccess("指定成功");
        assignReporterDialogVisible.value = false;
        getList();
      })
      .catch(() => {
        proxy.$modal.msgError("指定失败");
      });
  };

  const getTeamUserList = (leaderUserId) => {
    teamUserTableLoading.value = true;
    getTeamMemberListByTeamLeader({leaderUserId: leaderUserId})
      .then(res => {
        teamUserTableLoading.value = false;
        teamUserTableData.value = res.data;
      })
      .catch(() => {
        teamUserTableLoading.value = false;
      });
  };

  const getTeamUserNameById = id => {
    const user = teamUserTableData.value.find(item => item.userId === id);
    return user ? user.nickName : id;
  };

  const handleSaveTeamUser = () => {
    if (!selectedTeamUserId.value) {
      proxy.$modal.msgWarning("请选择班组成员");
      return;
    }

    const updateData = {
      id: currentTeamUser.value.id,
      teamUserId: selectedTeamUserId.value,
    };

    assignTeamUser(updateData)
      .then(() => {
        proxy.$modal.msgSuccess("指定成功");
        assignTeamUserDialogVisible.value = false;
        getList();
      })
      .catch(() => {
@@ -493,4 +609,77 @@
      }
    }
  }
</style>

  .assign-team-user-content {
    .selected-info-box {
      margin-bottom: 16px;
      padding: 12px;
      background-color: #f5f7fa;
      border-radius: 4px;
      display: flex;
      align-items: center;

      .info-label {
        font-size: 14px;
        color: #606266;
        margin-right: 8px;
      }

      .info-value {
        font-size: 14px;
        color: #303133;
        font-weight: bold;
      }
    }

    .team-user-list-container {
      max-height: 400px;
      overflow-y: auto;
      padding: 10px;
      border: 1px solid #f0f0f0;
      border-radius: 4px;

      .team-user-grid {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
        gap: 12px;
      }

      .team-user-item {
        :deep(.el-radio) {
          width: 100%;
          margin-right: 0;
          height: auto;
          padding: 8px;

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

        .team-user-info {
          display: flex;
          flex-direction: column;
          gap: 4px;

          .name {
            font-weight: bold;
            font-size: 14px;
            color: #303133;
          }

          .dept {
            font-size: 12px;
            color: #909399;
          }
        }
      }

      .empty-text {
        text-align: center;
        color: #909399;
        padding: 20px;
      }
    }
  }
</style>