1

src/views/billet/operator/components/car.vue

@@ -211,7 +211,7 @@
     }
   };
 
-  const { start, stop } = useTimeoutFn(getInfo, 10000, true);
+  const { start, stop } = useTimeoutFn(getInfo, 10000);
 
   // 获取堆垛机堆垛信息
   // 获取当前堆垛信息

src/views/billet/operator/components/headTop.vue

@@ -21,11 +21,11 @@
     </a-col>
     <a-col :span="3" class="flex flex-col" v-for="item of typeList">
       <div class="type-item">
-        <span class="type-title" :style="{ color: item.titleColor }">{{ item.title }}：</span> {{ item.amount }}支 / {{ item.weight }}t
+        <span class="type-title" :style="{ color: item.titleColor }">{{ item.title }}：</span> {{ item.amount }} 支 / {{ item.weight }} t
       </div>
       <div class="type-item" v-for="ele of item.dtlList">
         <div class="type-item-dtl">
-          <span class="type-title">{{ ele.size }}：</span> {{ ele.amount }}支 / {{ ele.weight }}t
+          <span class="type-title">{{ ele.size }}：</span> {{ ele.nums }} 支 / {{ ele.weight }} t
         </div>
       </div>
     </a-col>
@@ -61,7 +61,7 @@
 <script setup lang="ts">
   import { ref, onMounted, onUnmounted } from 'vue';
   import AStatistic from 'ant-design-vue/lib/statistic/Statistic';
-  import { getOnDutyInfo, getTeamShift, getOnDutyDetail } from '../../Dashboard/dashboard.api';
+  import { getOnDutyInfo, getTeamShift, getSteelPileBaseInfo, groupBy } from '../../Dashboard/dashboard.api';
   import { useTimeoutFn } from '/@/hooks/core/useTimeout';
   import { switchSteel, returnFurnaceChange } from '../operator.api';
   import { useMessage } from '/@/hooks/web/useMessage';
@@ -129,71 +129,103 @@
           (JSON.parse(infoRes.standNoSize) || []).forEach((item) => {
             standObj[item.strandNo] = item.length;
           });
-          emits('lengthChange', standObj);
+          emits('lengthChange', JSON.stringify(standObj));
         } catch (error) {
           console.log(error);
         }
       }
 
       // 获取明细
-      const dtlRes = await getOnDutyDetail({ ccmNo: props.ccmNo });
+      const dtlRes = await getSteelPileBaseInfo({ ccmNo: props.ccmNo });
+      // 按照目的地分组
       if (dtlRes) {
-        const {
-          hotSendSum,
-          hotChargeSum,
-          stackingSum,
-          hotSendTotalWeight,
-          hotChargeTotalWeight,
-          stackingTotalWeight,
-          hotSendDetailStatisticsList,
-          hotChargeDetailStatisticsList,
-          stackingDetailStatisticsList,
-        } = dtlRes;
-
+        const destinationArr = dtlRes.reduce((acc, cur) => {
+          acc[cur.belongTable] = acc[cur.belongTable] || [];
+          acc[cur.belongTable].push(cur);
+          return acc;
+        }, {});
+
+        // roll_club_one 棒一
+        // roll_club_two 棒二
+        // roll_club_three 棒三
+        // roll_out_shipp 上若
+        // roll_height 高线
+        // stacking_and_loading_vehicles 堆垛
         let hotsendData: any = [],
+          hotSendSum = 0,
+          hotSendTotalWeight = 0,
           hotchargeData: any = [],
-          stackingData: any = [];
-        if (Array.isArray(hotSendDetailStatisticsList)) {
-          hotsendData = hotSendDetailStatisticsList.map((item) => {
+          hotChargeSum = 0,
+          hotChargeTotalWeight = 0,
+          stackingData: any = [],
+          stackingSum = 0,
+          stackingTotalWeight = 0;
+        // 计算棒一
+        if (destinationArr['roll_club_one']) {
+          hotsendData = Object.values(groupBy(destinationArr['roll_club_one'] || [], 'length')).map((one: any) => {
+            hotSendSum += one.nums;
+            hotSendTotalWeight += one.weight;
             return {
-              size: item.size
-                .split(',')
-                .map((s) => Number(s) / 1000)
-                .join(','),
-              amount: item.amountTotal || 0,
-              weight: item.blankOutput || 0,
+              ...one,
+              weight: one.weight.toFixed(3),
+              size: one.size / 1000,
             };
           });
         }
-        if (Array.isArray(hotChargeDetailStatisticsList)) {
-          hotchargeData = hotChargeDetailStatisticsList.map((item) => {
+
+        // 计算热装
+        if (destinationArr['roll_club_two'] || destinationArr['roll_club_three'] || destinationArr['roll_out_shipp']) {
+          const concatArr = [
+            ...(destinationArr['roll_club_two'] || []),
+            ...(destinationArr['roll_club_three'] || []),
+            ...(destinationArr['roll_out_shipp'] || []),
+          ];
+          hotchargeData = Object.values(groupBy(concatArr, 'length')).map((one: any) => {
+            hotChargeSum += one.nums;
+            hotChargeTotalWeight += one.weight;
             return {
-              size: item.size
-                .split(',')
-                .map((s) => Number(s) / 1000)
-                .join(','),
-              amount: item.amountTotal || 0,
-              weight: item.blankOutput || 0,
+              ...one,
+              weight: one.weight.toFixed(3),
+              size: one.size / 1000,
             };
           });
         }
-        if (Array.isArray(stackingDetailStatisticsList)) {
-          stackingData = stackingDetailStatisticsList.map((item) => {
+
+        // 计算堆垛
+        if (destinationArr['stacking_and_loading_vehicles']) {
+          stackingData = Object.values(groupBy(destinationArr['stacking_and_loading_vehicles'] || [], 'length')).map((one: any) => {
+            stackingSum += one.nums;
+            stackingTotalWeight += one.weight;
             return {
-              size: item.size
-                .split(',')
-                .map((s) => Number(s) / 1000)
-                .join(','),
-              amount: item.amountTotal || 0,
-              weight: item.blankOutput || 0,
+              ...one,
+              weight: one.weight.toFixed(3),
+              size: one.size / 1000,
             };
           });
         }
 
         typeList.value = [
-          { title: '棒一', titleColor: '#f50', amount: hotSendSum || 0, weight: hotSendTotalWeight || 0, dtlList: hotsendData },
-          { title: '热装', titleColor: '#f50', amount: hotChargeSum || 0, weight: hotChargeTotalWeight || 0, dtlList: hotchargeData },
-          { title: '堆垛', titleColor: '#b8ceff', amount: stackingSum || 0, weight: stackingTotalWeight || 0, dtlList: stackingData },
+          {
+            title: '棒一',
+            titleColor: '#f50',
+            amount: hotSendSum || 0,
+            weight: hotSendTotalWeight ? hotSendTotalWeight.toFixed(3) : 0,
+            dtlList: hotsendData,
+          },
+          {
+            title: '热装',
+            titleColor: '#f50',
+            amount: hotChargeSum || 0,
+            weight: hotChargeTotalWeight ? hotChargeTotalWeight.toFixed(3) : 0,
+            dtlList: hotchargeData,
+          },
+          {
+            title: '堆垛',
+            titleColor: '#b8ceff',
+            amount: stackingSum || 0,
+            weight: stackingTotalWeight ? stackingTotalWeight.toFixed(3) : 0,
+            dtlList: stackingData,
+          },
         ];
 
         getShiftInfo();
@@ -204,7 +236,7 @@
     }
   };
 
-  const { start, stop } = useTimeoutFn(getInfo, 5000, true);
+  const { start, stop } = useTimeoutFn(getInfo, 5000);
 
   // 换炉
   const changeHeatLoading = ref(false);
@@ -332,6 +364,11 @@
       font-size: 16px;
     }
 
+    .type-title {
+      display: inline-block;
+      width: 50px;
+    }
+
     .change-heat.is-disabled {
       background: #d9d9d9;
       color: #8a8a8a;

src/views/billet/operator/components/heatList.vue

@@ -11,7 +11,7 @@
               v-model:value="strandNoSelected[item]"
               dict="lg_dcgg"
               :placeholder="`${item}流定尺`"
-              :class="{ changele: strandNoSelectedOrg[item] !== strandNoSelected[item] }"
+              :class="{ changele: strandNoSelectedOrg[item] != strandNoSelected[item] }"
               allowClear
             />
           </template>
@@ -91,29 +91,48 @@
         <div class="flex justify-between strand-item" v-if="isAllHeat" style="margin: 20px 0">
           <div class="flex" style="height: 40px; line-height: 40px">
             <span class="mr-2">炉号：</span>
-            <a-input v-model:value="newHeatNo" style="width: 180px" size="large" placeholder="请输入炉号" />
+            <a-input
+              :status="newHeatNoStatus"
+              @change="handlerChange($event, 'newHeat')"
+              v-model:value="newHeatNo"
+              style="width: 180px"
+              size="large"
+              type="number"
+              placeholder="请输入炉号"
+            />
           </div>
         </div>
-        <div v-for="(item, index) in Object.keys(strandNums)" class="flex justify-between items-center strand-item" style="margin: 20px 0">
-          <div class="strand-num">{{ index + 1 }}流</div>
+        <div v-for="(item, index) in Object.keys(strandFormInfo)" class="flex justify-between items-center strand-item" style="margin: 20px 0">
+          <div class="strand-num">{{ strandFormInfo[item].no }}流</div>
           <div class="flex items-center" style="position: relative; width: 120px">
-            <component :is="formatDefineSize(heatInfo[strandArr[index]], heatInfo[lengthArr[index]])" />
+            <component :is="formatDefineSize(heatInfo[item], heatInfo[lengthArr[index]])" />
           </div>
           <div>
             <JSearchSelect
               type="list"
               style="width: 96px"
-              v-model:value="strandLength[item]"
+              v-model:value="strandFormInfo[item].size"
               dict="lg_dcgg"
-              :placeholder="`${index + 1}流定尺`"
+              :placeholder="`${strandFormInfo[item].no}流定尺`"
               allowClear
+              :status="strandFormInfo[item].sizeStatus"
+              @change="handlerChange($event, 'sizeStatus', item)"
+            />
+          </div>
+          <div>
+            <a-input-number
+              id="inputNumber"
+              :status="strandFormInfo[item].sumStatus"
+              @change="handlerChange($event, 'sumStatus', item)"
+              v-model:value="strandFormInfo[item].sum"
+              :min="0"
+              :max="10"
             />
           </div>
-          <div><a-input-number id="inputNumber" v-model:value="strandNums[item]" :min="0" :max="10" /></div>
           <div style="width: 140px" v-if="isAllHeat">
-            <div class="flex items-center" v-if="isAllHeat && Object.keys(rollClubOneList).includes(item)">
+            <div class="flex items-center" v-if="isAllHeat && strandFormInfo[item].hasOne">
               <span class="mr-2" style="color: #f50">去棒一：</span>
-              <a-input type="number" v-model:value="rollClubOneList[item]" style="width: 80px" suffix="支" placeholder="棒一" :min="0" />
+              <a-input type="number" v-model:value="strandFormInfo[item].rollClubOne" style="width: 80px" suffix="支" placeholder="棒一" :min="0" />
             </div>
           </div>
         </div>
@@ -173,30 +192,8 @@
       default: true,
     },
     lengthList: {
-      type: Object,
-      default: () => ({
-        '1': undefined,
-        '2': undefined,
-        '3': undefined,
-        '4': undefined,
-        '5': undefined,
-        '6': undefined,
-        '7': undefined,
-        '8': undefined,
-      }),
-    },
-    lengthOrgList: {
-      type: Object,
-      default: () => ({
-        '1': undefined,
-        '2': undefined,
-        '3': undefined,
-        '4': undefined,
-        '5': undefined,
-        '6': undefined,
-        '7': undefined,
-        '8': undefined,
-      }),
+      type: String,
+      default: '',
     },
     curShiftInfo: {
       type: Object,
@@ -227,9 +224,74 @@
     },
     openCompensateModal: (record) => {
       openCompensateModal.value = true;
+      strandFormInfo.value = {
+        oneStrandNo: {
+          sum: 0,
+          size: strandNoSelectedOrg.value['1'],
+          sizeName: 'oneLength',
+          sumStatus: '',
+          sizeStatus: '',
+          no: 1,
+          hasOne: true,
+          rollClubOne: 0,
+        },
+        twoStrandNo: {
+          sum: 0,
+          size: strandNoSelectedOrg.value['2'],
+          sizeName: 'twoLength',
+          sumStatus: '',
+          sizeStatus: '',
+          no: 2,
+          hasOne: true,
+          rollClubOne: 0,
+        },
+        threeStrandNo: {
+          sum: 0,
+          size: strandNoSelectedOrg.value['3'],
+          sizeName: 'threeLength',
+          sumStatus: '',
+          sizeStatus: '',
+          no: 3,
+          hasOne: true,
+          rollClubOne: 0,
+        },
+        fourStrandNo: {
+          sum: 0,
+          size: strandNoSelectedOrg.value['4'],
+          sizeName: 'fourLength',
+          sumStatus: '',
+          sizeStatus: '',
+          no: 4,
+          hasOne: true,
+          rollClubOne: 0,
+        },
+        fiveStrandNo: {
+          sum: 0,
+          size: strandNoSelectedOrg.value['5'],
+          sizeName: 'fiveLength',
+          sumStatus: '',
+          sizeStatus: '',
+          no: 5,
+          hasOne: true,
+          rollClubOne: 0,
+        },
+        sixStrandNo: {
+          sum: 0,
+          size: strandNoSelectedOrg.value['6'],
+          sizeName: 'sixLength',
+          sumStatus: '',
+          sizeStatus: '',
+          no: 6,
+          hasOne: true,
+          rollClubOne: 0,
+        },
+        sevenStrandNo: { sum: 0, size: strandNoSelectedOrg.value['7'], sizeName: 'sevenLength', sumStatus: '', sizeStatus: '', no: 7 },
+        eightStrandNo: { sum: 0, size: strandNoSelectedOrg.value['8'], sizeName: 'eightLength', sumStatus: '', sizeStatus: '', no: 8 },
+      };
       if (record.dataIndex && record.dataIndex === 'totalInfo') {
         heatInfo.value = {};
         isAllHeat.value = true;
+        newHeatNo.value = '';
       } else {
         heatInfo.value = record;
         isAllHeat.value = false;
@@ -239,57 +301,20 @@
 
   // 补录钢坯
   const openCompensateModal = ref(false);
-  const strandNums = ref<any>({
-    oneStrandNoSum: 0,
-    twoStrandNoSum: 0,
-    threeStrandNoSum: 0,
-    fourStrandNoSum: 0,
-    fiveStrandNoSum: 0,
-    sixStrandNoSum: 0,
-    sevenStrandNoSum: 0,
-    eightStrandNoSum: 0,
-  });
-  const strandLength = ref({
-    oneStrandNoSum: undefined,
-    twoStrandNoSum: undefined,
-    threeStrandNoSum: undefined,
-    fourStrandNoSum: undefined,
-    fiveStrandNoSum: undefined,
-    sixStrandNoSum: undefined,
-    sevenStrandNoSum: undefined,
-    eightStrandNoSum: undefined,
+  // 补录钢坯信息 sum 数量 size 定尺 status 状态 no 流号
+  const strandFormInfo = ref<any>({
+    oneStrandNo: { sum: 0, size: undefined, sizeName: 'oneLength', sumStatus: '', sizeStatus: '', no: 1, hasOne: true, rollClubOne: 0 },
+    twoStrandNo: { sum: 0, size: undefined, sizeName: 'twoLength', sumStatus: '', sizeStatus: '', no: 2, hasOne: true, rollClubOne: 0 },
+    threeStrandNo: { sum: 0, size: undefined, sizeName: 'threeLength', sumStatus: '', sizeStatus: '', no: 3, hasOne: true, rollClubOne: 0 },
+    fourStrandNo: { sum: 0, size: undefined, sizeName: 'fourLength', sumStatus: '', sizeStatus: '', no: 4, hasOne: true, rollClubOne: 0 },
+    fiveStrandNo: { sum: 0, size: undefined, sizeName: 'fiveLength', sumStatus: '', sizeStatus: '', no: 5, hasOne: true, rollClubOne: 0 },
+    sixStrandNo: { sum: 0, size: undefined, sizeName: 'sixLength', sumStatus: '', sizeStatus: '', no: 6, hasOne: true, rollClubOne: 0 },
+    sevenStrandNo: { sum: 0, size: undefined, sizeName: 'sevenLength', sumStatus: '', sizeStatus: '', no: 7 },
+    eightStrandNo: { sum: 0, size: undefined, sizeName: 'eightLength', sumStatus: '', sizeStatus: '', no: 8 },
   });
+
   const closeCompensateModal = () => {
     openCompensateModal.value = false;
-    strandNums.value = {
-      oneStrandNoSum: 0,
-      twoStrandNoSum: 0,
-      threeStrandNoSum: 0,
-      fourStrandNoSum: 0,
-      fiveStrandNoSum: 0,
-      sixStrandNoSum: 0,
-      sevenStrandNoSum: 0,
-      eightStrandNoSum: 0,
-    };
-    strandLength.value = {
-      oneStrandNoSum: undefined,
-      twoStrandNoSum: undefined,
-      threeStrandNoSum: undefined,
-      fourStrandNoSum: undefined,
-      fiveStrandNoSum: undefined,
-      sixStrandNoSum: undefined,
-      sevenStrandNoSum: undefined,
-      eightStrandNoSum: undefined,
-    };
-    rollClubOneList.value = {
-      oneStrandNoSum: 0,
-      twoStrandNoSum: 0,
-      threeStrandNoSum: 0,
-      fourStrandNoSum: 0,
-      fiveStrandNoSum: 0,
-      sixStrandNoSum: 0,
-    };
-    newHeatNo.value = '';
   };
   // 格式化定尺
   const formatDefineSize = (num, jsonStr) => {
@@ -299,49 +324,58 @@
     return renderStrandCell({ num, lengthJsonStr: jsonStr });
   };
 
-  const staticStrandInfo = {
-    oneStrandNoSum: { size: 'oneLength', no: 'oneStrandNo', noNum: 1 },
-    twoStrandNoSum: { size: 'twoLength', no: 'twoStrandNo', noNum: 2 },
-    threeStrandNoSum: { size: 'threeLength', no: 'threeStrandNo', noNum: 3 },
-    fourStrandNoSum: { size: 'fourLength', no: 'fourStrandNo', noNum: 4 },
-    fiveStrandNoSum: { size: 'fiveLength', no: 'fiveStrandNo', noNum: 5 },
-    sixStrandNoSum: { size: 'sixLength', no: 'sixStrandNo', noNum: 6 },
-    sevenStrandNoSum: { size: 'sevenLength', no: 'sevenStrandNo', noNum: 7 },
-    eightStrandNoSum: { size: 'eightLength', no: 'eightStrandNo', noNum: 8 },
+  // 验证状态
+  const handlerChange = (e, type, k?: string) => {
+    // newHeat, sizeStatus, sumStatus
+    if (type === 'newHeat') {
+      newHeatNoStatus.value = e && e.target && e.target.value.trim() ? '' : 'error';
+    }
+    if (type === 'sumStatus' && k) {
+      strandFormInfo.value[k].sumStatus = e >= 0 ? '' : 'error';
+    }
+    if (type === 'sizeStatus' && k) {
+      strandFormInfo.value[k].sizeStatus = e ? '' : 'error';
+    }
   };
 
   // 新炉号
   const newHeatNo = ref('');
-  const rollClubOneList = ref({
-    oneStrandNoSum: 0,
-    twoStrandNoSum: 0,
-    threeStrandNoSum: 0,
-    fourStrandNoSum: 0,
-    fiveStrandNoSum: 0,
-    sixStrandNoSum: 0,
-  });
+  const newHeatNoStatus = ref('');
   // 确认添加定尺
   const confirmCompensate = async () => {
     try {
       // 整炉添加钢坯
       if (isAllHeat.value) {
         if (!newHeatNo.value) {
+          newHeatNoStatus.value = 'error';
           createMessage.error('整炉补录钢坯, 需输入新炉号');
           return;
         }
       }
 
-      // 获取根数
-      const changeStrandNums = Object.keys(strandNums.value).filter((item) => strandNums.value[item]);
+      // 获取所有流输入的总支数
+      const changeStrandNums = Object.keys(strandFormInfo.value).filter((item) => strandFormInfo.value[item].sum);
       if (changeStrandNums.length === 0) {
         createMessage.error('请输入要增加的根数');
         return;
       }
 
+      // 判断是否输入了定尺
+      const noInputSize = changeStrandNums
+        .filter((item) => !strandFormInfo.value[item].size)
+        .map((item) => {
+          strandFormInfo.value[item].sizeStatus = 'error';
+          return strandFormInfo.value[item].no + '流';
+        });
+      if (noInputSize.length > 0) {
+        createMessage.error(`请选择${noInputSize.join(' , ')}的定尺`);
+        return;
+      }
+
       // 整炉补录，判断支数先减去棒一支数后是否是4的倍数
-      const allNums = changeStrandNums.reduce((pre, cur) => pre + Number(strandNums.value[cur]), 0);
-      const rollOneList = Object.keys(rollClubOneList.value).filter((item) => rollClubOneList.value[item]);
-      const rollOneNums = rollOneList.reduce((pre, cur) => pre + Number(rollClubOneList.value[cur]), 0);
+      const allNums = changeStrandNums.reduce((pre, cur) => pre + Number(strandFormInfo.value[cur].sum), 0);
+      const rollOneList = Object.keys(strandFormInfo.value).filter((item) => strandFormInfo.value[item].rollClubOne);
+      const rollOneNums = rollOneList.reduce((pre, cur) => pre + Number(strandFormInfo.value[cur].rollClubOne), 0);
 
       let rollClubOneListParams: any[] = [];
       if (isAllHeat.value && rollOneNums) {
@@ -352,9 +386,9 @@
 
         rollClubOneListParams = rollOneList.map((item) => {
           return {
-            strandNo: staticStrandInfo[item].noNum,
-            addSum: Number(rollClubOneList.value[item]),
-            length: Number(strandLength.value[item]),
+            strandNo: strandFormInfo.value[item].no,
+            addSum: Number(strandFormInfo.value[item].rollClubOne),
+            length: Number(strandFormInfo.value[item].size),
           };
         });
       }
@@ -371,11 +405,11 @@
       };
 
       changeStrandNums.forEach((item) => {
-        if (strandLength.value[item]) {
+        if (strandFormInfo.value[item].size) {
           params = Object.assign(params, {
-            [item]: strandNums.value[item],
-            [staticStrandInfo[item].size]: strandLength.value[item],
-            [staticStrandInfo[item].no]: staticStrandInfo[item].noNum,
+            [item + 'Sum']: strandFormInfo.value[item].sum,
+            [strandFormInfo.value[item].sizeName]: strandFormInfo.value[item].size,
+            [item]: strandFormInfo.value[item].no,
           });
         }
       });
@@ -563,8 +597,8 @@
 
   const { start, stop } = useTimeoutFn(() => {
     if (!props.changeShiftId) {
-      // reload();
-      // start();
+      reload();
+      start();
     }
   }, 10000);
 
@@ -661,14 +695,37 @@
   };
 
   // 变更定尺
-  const strandNoSelectedOrg = ref(props.lengthOrgList);
-  const strandNoSelected = ref(props.lengthList);
+  const strandNoSelectedOrg = ref({
+    '1': undefined,
+    '2': undefined,
+    '3': undefined,
+    '4': undefined,
+    '5': undefined,
+    '6': undefined,
+    '7': undefined,
+    '8': undefined,
+  });
+  const strandNoSelected = ref({
+    '1': undefined,
+    '2': undefined,
+    '3': undefined,
+    '4': undefined,
+    '5': undefined,
+    '6': undefined,
+    '7': undefined,
+    '8': undefined,
+  });
 
   watch(
-    () => props.lengthOrgList,
+    () => props.lengthList,
     (val) => {
-      strandNoSelectedOrg.value = props.lengthOrgList;
-      strandNoSelected.value = props.lengthList;
+      const data = JSON.parse(val || '{}');
+      Object.keys(data).forEach((item) => {
+        strandNoSelectedOrg.value[item] = data[item];
+        if (!strandNoSelected.value[item]) {
+          strandNoSelected.value[item] = data[item];
+        }
+      });
     },
     {
       deep: true,
@@ -741,6 +798,13 @@
       },
     ];
   }
+
+  defineExpose({
+    reload: () => {
+      stop();
+      reload();
+    },
+  });
 </script>
 
 <style scoped lang="less">

src/views/billet/operator/index.less

@@ -30,7 +30,15 @@
       font-size: 24px;
       font-weight: 600;
       line-height: 72px;
+      margin-right: 20px;
+    }
+
+    .change-shift {
       margin-right: 120px;
+
+      .ant-btn {
+        font-size: 18px;
+      }
     }
 
     .clock-wrapper {

src/views/billet/operator/index.vue

@@ -9,6 +9,9 @@
     <a-layout class="operator-large-layout">
       <a-layout-header class="operator-header cover">
         <div class="shift-wrapper"> {{ shiftText }} </div>
+        <div class="change-shift">
+          <a-button type="primary" size="large" danger @click="() => confirmChangeShift()"> 交班 </a-button>
+        </div>
         <div class="clock-wrapper">
           <div class="date">{{ clockObj.date }}</div>
           <div class="week">{{ clockObj.week }}</div>
@@ -16,15 +19,15 @@
         </div>
       </a-layout-header>
       <a-layout-content class="operator-content">
-        <head-top @shiftChange="curShiftChange" ref="headTopRef" @lengthChange="(v) => ((lengthList = v), (lengthorgList = cloneDeep(v)))" />
+        <head-top @shiftChange="curShiftChange" ref="headTopRef" @lengthChange="(v) => (lengthList = v)" />
         <div class="operator-content-wrapper flex">
           <div class="operator-content-left">
             <heat-list
+              ref="heatListRef"
               v-if="curShiftInfo.shift != undefined && curShiftInfo.shiftGroup != undefined"
               :ccmNo="ccmNo"
               :carRef="carRef"
               :lengthList="lengthList"
-              :lengthOrgList="lengthorgList"
               @changeLengthSuccess="() => headTopRef && headTopRef.reload()"
               :curShiftInfo="curShiftInfo"
             />
@@ -45,12 +48,16 @@
   import car from './components/car.vue';
   import heatList from './components/heatList.vue';
   import { getMachineNum } from '../hotDelivery/common.data';
-  import { cloneDeep } from 'lodash-es';
+  import { changeShift } from '../hotDelivery/hotDelivery.api';
+  import { useMessage } from '/@/hooks/web/useMessage';
+
+  const { createConfirm } = useMessage();
 
   const ccmNo = getMachineNum();
 
   const carRef = ref();
   const headTopRef = ref();
+  const heatListRef = ref();
   // 班次信息
   const shiftText = ref('');
   const curShiftInfo = ref({
@@ -64,27 +71,8 @@
     time: '',
   });
 
-  const lengthList = ref({
-    '1': undefined,
-    '2': undefined,
-    '3': undefined,
-    '4': undefined,
-    '5': undefined,
-    '6': undefined,
-    '7': undefined,
-    '8': undefined,
-  });
+  const lengthList = ref('');
 
-  const lengthorgList = ref({
-    '1': undefined,
-    '2': undefined,
-    '3': undefined,
-    '4': undefined,
-    '5': undefined,
-    '6': undefined,
-    '7': undefined,
-    '8': undefined,
-  });
   const clock = () => {
     try {
       const dateStr = getDateTimeWeek().split(' ');
@@ -106,6 +94,24 @@
     curShiftInfo.value = shiftInfo;
   };
 
+  // 交班
+  const confirmChangeShift = () => {
+    createConfirm({
+      iconType: 'warning',
+      title: '交班确认',
+      content: '确定要交班吗？',
+      onOk: () => {
+        return changeShift({
+          ccmNo,
+        }).then(() => {
+          headTopRef && headTopRef.value.reload();
+          carRef && carRef.value.refreshCarList();
+          heatListRef && heatListRef.value.reload();
+        });
+      },
+    });
+  };
+
   onMounted(() => {
     start();
   });