From 2625ec709848eb16fee565f2bb55cc1ce86cb03f Mon Sep 17 00:00:00 2001
From: zhangwencui <1064582902@qq.com>
Date: 星期四, 23 七月 2026 10:50:16 +0800
Subject: [PATCH] 工作台增加上工下工功能关联工作记录
---
src/views/mes/workbench/index.vue | 51 ++++++++++++++++
src/views/mes/workbench/components/WorkstationPanel.vue | 91 ++++++++++++++++++++++++++++++
2 files changed, 140 insertions(+), 2 deletions(-)
diff --git a/src/views/mes/workbench/components/WorkstationPanel.vue b/src/views/mes/workbench/components/WorkstationPanel.vue
index eb93fcb..3d44c26 100644
--- a/src/views/mes/workbench/components/WorkstationPanel.vue
+++ b/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>
diff --git a/src/views/mes/workbench/index.vue b/src/views/mes/workbench/index.vue
index 3640291..15c283a 100644
--- a/src/views/mes/workbench/index.vue
+++ b/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"
/>
<!-- 宸ュ崟鍒楄〃 -->
--
Gitblit v1.9.3