工作台增加上工下工功能关联工作记录

zhangwencui

10 小时以前 2625ec709848eb16fee565f2bb55cc1ce86cb03f

工作台增加上工下工功能关联工作记录

 src/views/mes/workbench/components/WorkstationPanel.vue

@@ -7,10 +7,14 @@

defineProps<{
  workstation?: MesMdWorkstationApi.Workstation;
  /** 是否已上工 */
  isClockIn?: boolean;
}>();

const emit = defineEmits<{
  change: [];
  'clock-in': [];
  'clock-out': [];
}>();
</script>

@@ -61,6 +65,32 @@
        <span class="ws-panel__meta-label">地点</span>
        <span class="ws-panel__meta-value">{{ workstation.address ?? '—' }}</span>
      </div>
    </div>

    <!-- 上工/下工 -->
    <div v-if="workstation" class="ws-panel__clock">
      <div v-if="isClockIn" class="ws-panel__clock-status">
        <IconifyIcon icon="lucide:check-circle" class="ws-panel__clock-icon" />
        <span>已上工</span>
      </div>
      <button
        v-if="!isClockIn"
        type="button"
        class="ws-panel__clock-btn ws-panel__clock-btn--in"
        @click="emit('clock-in')"
      >
        <IconifyIcon class="ws-panel__clock-btn-icon" icon="lucide:play" />
        上工
      </button>
      <button
        v-else
        type="button"
        class="ws-panel__clock-btn ws-panel__clock-btn--out"
        @click="emit('clock-out')"
      >
        <IconifyIcon class="ws-panel__clock-btn-icon" icon="lucide:pause" />
        下工
      </button>
    </div>
  </section>
</template>
@@ -262,4 +292,65 @@
  text-overflow: ellipsis;
  white-space: nowrap;
}

// --- 上工/下工 ---
.ws-panel__clock {
  margin-top: 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.ws-panel__clock-status {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 14px;
  font-weight: 600;
  color: #a5d6a7;
}

.ws-panel__clock-icon {
  font-size: 18px;
}

.ws-panel__clock-btn {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 10px 0;
  border: none;
  border-radius: 8px;
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.2s;
}

.ws-panel__clock-btn-icon {
  font-size: 16px;
}

.ws-panel__clock-btn--in {
  background: #4caf50;
  color: #fff;
  box-shadow: 0 2px 8px rgb(0 0 0 / 18%);

  &:hover {
    background: #43a047;
  }
}

.ws-panel__clock-btn--out {
  background: rgb(255 255 255 / 18%);
  color: #ffcdd2;
  border: 1px solid rgb(255 255 255 / 28%);

  &:hover {
    background: rgb(255 255 255 / 28%);
  }
}
</style>

 src/views/mes/workbench/index.vue

@@ -2,12 +2,19 @@
import type { MesMdWorkstationApi } from '#/api/mes/md/workstation';
import type { PendingTask, WorkbenchTabItem, WorkbenchTabKey } from './types';

import { computed, ref, watch } from 'vue';
import { computed, onMounted, ref, watch } from 'vue';

import { confirm } from '@vben/common-ui';
import { MesProWorkRecordTypeEnum } from '@vben/constants';
import { IconifyIcon } from '@vben/icons';

import { Button } from 'ant-design-vue';
import { Button, message } from 'ant-design-vue';

import {
  clockInWorkRecord,
  clockOutWorkRecord,
  getMyWorkRecord,
} from '#/api/mes/pro/workrecord';
import { getPendingFeedbackPage } from '#/api/mes/pro/task';
import { router } from '#/router';

@@ -51,6 +58,43 @@
function handleWorkstationSelect(ws: MesMdWorkstationApi.Workstation) {
  workstation.value = ws;
}

// --- 上工/下工 ---
const isClockIn = ref(false);

async function loadClockStatus() {
  const record = await getMyWorkRecord();
  isClockIn.value = record?.type === MesProWorkRecordTypeEnum.CLOCK_IN;
}

/** 上工：默认使用当前选中的工作站，弹窗确认 */
async function handleClockIn() {
  if (!workstationId.value) return;
  try {
    await confirm(
      `确认上工到当前工作站「${workstation.value?.code} - ${workstation.value?.name}」？`,
    );
  } catch {
    return;
  }
  await clockInWorkRecord(workstationId.value);
  message.success('上工成功');
  isClockIn.value = true;
}

/** 下工 */
async function handleClockOut() {
  try {
    await confirm('确认下工当前工作站？');
  } catch {
    return;
  }
  await clockOutWorkRecord();
  message.success('下工成功');
  isClockIn.value = false;
}

onMounted(loadClockStatus);

// --- 任务列表 ---
const taskList = ref<PendingTask[]>([]);
@@ -159,7 +203,10 @@
        <!-- 工作站选择面板 -->
        <WorkstationPanel
          :workstation="workstation"
          :is-clock-in="isClockIn"
          @change="openWorkstationSelect"
          @clock-in="handleClockIn"
          @clock-out="handleClockOut"
        />

        <!-- 工单列表 -->