zhangafei 3 weeks ago
parent
commit
a00f023a4f
1 changed files with 189 additions and 0 deletions
  1. 189 0
      src/views/billet/operator/index-copy.vue

+ 189 - 0
src/views/billet/operator/index-copy.vue

@@ -0,0 +1,189 @@
+<template>
+  <div
+    class="operator-app-container"
+    :style="{
+      '--op-border-color': '#d9d9d9',
+      '--op-text-color-fff': '#fff',
+    }"
+  >
+    <a-layout class="operator-large-layout">
+      <a-layout-header class="operator-header cover">
+        <div class="change-shift print-billet-card">
+          <a-button
+            type="primary"
+            style="margin-right: 20px"
+            size="large"
+            @click="() => openPrintOriginalRecordsModal(true, { ccmNo, queryType: '1', shiftText, curShiftInfo })"
+          >
+            原始记录
+          </a-button>
+          <a-button type="primary" size="large" @click="() => openModal(true, { ccmNo, queryType: '1', shiftText, curShiftInfo })"> 送样卡 </a-button>
+        </div>
+        <div class="shift-wrapper"> {{ shiftText }} </div>
+        <div class="change-shift">
+          <a-button type="primary" size="large" danger @click="() => (openJiaobanModal = true)"> 交班 </a-button>
+        </div>
+        <div class="clock-wrapper">
+          <div class="date">{{ clockObj.date }}</div>
+          <div class="week">{{ clockObj.week }}</div>
+          <div class="time">{{ clockObj.time }}</div>
+        </div>
+      </a-layout-header>
+      <a-layout-content class="operator-content">
+        <head-top @onShiftChange="curShiftChange" ref="headTopRef" @lengthChange="(v, auto) => ((lengthList = v), (cuttolength = auto))" />
+        <div class="operator-content-wrapper flex">
+          <div class="operator-content-left">
+            <heat-list
+              ref="heatListRef"
+              v-if="curShiftInfo.shift && curShiftInfo.shiftGroup"
+              :ccmNo="ccmNo"
+              :carRef="carRef"
+              :lengthList="lengthList"
+              :cuttolength="cuttolength"
+              @changeLengthSuccess="() => headTopRef && headTopRef.reload()"
+              :curShiftInfo="curShiftInfo"
+            />
+          </div>
+          <div class="operator-content-right">
+            <car :ccmNo="ccmNo" ref="carRef" />
+          </div>
+        </div>
+      </a-layout-content>
+    </a-layout>
+
+    <!-- 打印钢坯送样卡 -->
+    <print-billet-sample-card @register="registerPrintModal" />
+    <!-- 打印原始数据 -->
+    <printOriginalRecords @register="registerPrintOriginalRecordsModal" />
+    <!-- 交班 -->
+    <a-modal
+      v-model:open="openJiaobanModal"
+      title="切换牌号"
+      centered
+      width="400px"
+      ok-text="确认"
+      :okButtonProps="{ loading: okLoading }"
+      cancel-text="取消"
+      @ok="confirmChangeShift"
+      @cancel="
+        () => {
+          openJiaobanModal = false;
+          newShiftGroup = '';
+        }
+      "
+    >
+      <div class="flex justify-center items-center" style="margin: 20px 0">
+        <div>选择班组:</div>
+        <JSearchSelect type="list" style="width: 277px" v-model:value="newShiftGroup" dict="lg_bz" placeholder="请选择" allowClear />
+      </div>
+    </a-modal>
+  </div>
+</template>
+<script setup lang="ts" name="OperatorRoom">
+  import { onMounted, onUnmounted, ref } from 'vue';
+  import { getDateTimeWeek } from '/@/utils/dateUtil';
+  import { useTimeoutFn } from '/@/hooks/core/useTimeout';
+  import headTop from './components/headTop.vue';
+  import car from './components/car.vue';
+  import heatList from './components/heatList.vue';
+  import { getMachineNum, getMachineDict } from '../hotDelivery/common.data';
+  import { changeShift } from '../hotDelivery/hotDelivery.api';
+  import { useMessage } from '/@/hooks/web/useMessage';
+  import { useModal } from '/@/components/Modal';
+  import printBilletSampleCard from './components/printBilletSampleCard.vue';
+  import printOriginalRecords from './components/printOriginalRecords.vue';
+  import JSearchSelect from '/@/components/Form/src/jeecg/components/JSearchSelect.vue';
+
+  const { createConfirm, createMessage } = useMessage();
+
+  // 注册打印送样卡modal
+  const [registerPrintModal, { openModal }] = useModal();
+  // 注册打印原始记录modal
+  const [registerPrintOriginalRecordsModal, { openModal: openPrintOriginalRecordsModal }] = useModal();
+
+  const ccmNo = getMachineNum();
+
+  const carRef = ref();
+  const headTopRef = ref();
+  const heatListRef = ref();
+  // 班次信息
+  const shiftText = ref('');
+  const curShiftInfo = ref({
+    shift: undefined,
+    shiftGroup: undefined,
+  });
+  // 时钟
+  const clockObj = ref({
+    date: '',
+    week: '',
+    time: '',
+  });
+
+  const lengthList = ref('');
+  const cuttolength = ref(2); // 1 手动定尺, 2 自动定尺
+
+  const clock = () => {
+    try {
+      const dateStr = getDateTimeWeek().split(' ');
+      clockObj.value = {
+        date: dateStr[0],
+        time: dateStr[1],
+        week: dateStr[2],
+      };
+
+      start();
+    } catch (error) {}
+  };
+
+  const { start, stop } = useTimeoutFn(clock, 1000);
+
+  // 获取班次信息
+  const curShiftChange = (shiftInfo) => {
+    if (shiftInfo) {
+      const { shift, shiftGroup } = shiftInfo;
+      shiftText.value = `${getMachineDict(shift, 'lg_bb')} - ${getMachineDict(shiftGroup, 'lg_bz')}`;
+    }
+    curShiftInfo.value = shiftInfo;
+  };
+
+  // 交班
+  const newShiftGroup = ref('');
+  const openJiaobanModal = ref(false);
+  const okLoading = ref(false);
+  const confirmChangeShift = () => {
+    if (!newShiftGroup.value) {
+      createMessage.error('请选择班组');
+      return;
+    }
+
+    createConfirm({
+      iconType: 'warning',
+      title: '交班确认',
+      content: '确定要交班吗?',
+      onOk: () => {
+        return changeShift({
+          ccmNo,
+          shiftGroup: newShiftGroup.value,
+        }).then(() => {
+          headTopRef && headTopRef.value.reload();
+          carRef && carRef.value.refreshCarList();
+          heatListRef && heatListRef.value.reload();
+
+          openJiaobanModal.value = false;
+        });
+      },
+    });
+  };
+
+  onMounted(() => {
+    start();
+  });
+
+  onUnmounted(() => {
+    stop();
+  });
+</script>
+<style lang="less" scoped>
+  @import '/@/assets/less/font.less';
+  @import './index.less';
+</style>