Browse Source

2026-07-15

异常规则配置
master
fengyuan_yang 2 weeks ago
parent
commit
42037f2a10
  1. 207
      src/views/modules/yieldReport/com_separate_roll.vue

207
src/views/modules/yieldReport/com_separate_roll.vue

@ -149,9 +149,30 @@
<el-button type="warning" @click="executeAbnormalRollCut" :loading="abnormalCutLoading" :disabled="exceptionRuleLocked">异常截卷</el-button>
<el-button @click="closeDialog" :disabled="exceptionRuleLocked">{{ buttons.closeButton }}</el-button>
</span>
<div v-if="exceptionRuleLocked" class="exception-rule-mask-blocker"></div>
<div v-if="exceptionRuleLocked" class="exception-rule-mask">
<div class="exception-rule-mask-content">
<i class="el-icon-lock" />
<div class="exception-rule-alert-icon-wrap">
<div class="exception-rule-alert-ring outer"></div>
<div class="exception-rule-alert-ring inner"></div>
<i class="el-icon-warning-outline" />
</div>
<div class="exception-rule-title-cn">设备异常</div>
<div class="exception-rule-title-en">SYSTEM LOCKDOWN</div>
<div class="exception-rule-status-row">
<div class="exception-rule-status-item">
<div class="status-label">工位</div>
<div class="status-value">{{ scheduleData.resourceDesc || scheduleData.resourceId || '--' }}</div>
</div>
<div class="exception-rule-status-item">
<div class="status-label">派工单</div>
<div class="status-value">{{ scheduleData.seqNo || '--' }}</div>
</div>
<div class="exception-rule-status-item">
<div class="status-label">订单号</div>
<div class="status-value">{{ scheduleData.orderNo || '--' }}</div>
</div>
</div>
<div class="exception-rule-mask-message">{{ exceptionRuleLockMessage || '当前异常代办尚未审核,已锁定创建分卷操作。' }}</div>
<div class="exception-rule-mask-sub">请等待QC审核通过后继续操作</div>
</div>
@ -2384,47 +2405,193 @@ export default {
position: relative;
}
.exception-rule-mask {
.exception-rule-mask-blocker {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 30;
background: rgba(255, 255, 255, 0.75);
background: rgba(2, 6, 16, 0.54);
backdrop-filter: blur(2px);
}
.exception-rule-mask {
position: fixed;
left: 50%;
top: 50%;
width: 760px;
height: 500px;
transform: translate(-50%, -50%);
z-index: 2101;
display: flex;
align-items: center;
justify-content: center;
backdrop-filter: blur(1px);
overflow: hidden;
border-radius: 10px;
}
.exception-rule-mask::before {
content: '';
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
background: repeating-linear-gradient(
to bottom,
rgba(255, 255, 255, 0.02) 0px,
rgba(255, 255, 255, 0.02) 1px,
transparent 1px,
transparent 4px
);
pointer-events: none;
}
.exception-rule-mask-content {
width: 75%;
max-width: 560px;
padding: 22px 26px;
border-radius: 8px;
position: relative;
width: 100%;
height: 100%;
padding: 26px 28px 20px;
border-radius: 10px;
text-align: center;
background: #ffffff;
border: 1px solid #f5c2c7;
box-shadow: 0 6px 24px rgba(0, 0, 0, 0.12);
color: #c45656;
background: radial-gradient(circle at center 28%, rgba(116, 7, 30, 0.28), rgba(10, 12, 20, 0.96) 56%);
border: 1px solid rgba(255, 64, 98, 0.55);
box-shadow: 0 0 28px rgba(191, 29, 65, 0.35), inset 0 0 26px rgba(83, 9, 29, 0.45);
color: #ffd4dd;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
overflow: hidden;
}
.exception-rule-mask-content .el-icon-lock {
font-size: 26px;
margin-bottom: 8px;
.exception-rule-mask-content::after {
content: '';
position: absolute;
inset: 8px;
border: 1px solid rgba(255, 88, 120, 0.2);
border-radius: 8px;
pointer-events: none;
}
.exception-rule-mask-message {
.exception-rule-alert-icon-wrap {
position: relative;
width: 110px;
height: 110px;
margin-top: 6px;
margin-bottom: 6px;
}
.exception-rule-alert-ring {
position: absolute;
border-radius: 50%;
border: 1px solid rgba(255, 72, 108, 0.45);
}
.exception-rule-alert-ring.outer {
inset: 2px;
animation: pulse-ring 2.2s ease-in-out infinite;
}
.exception-rule-alert-ring.inner {
inset: 18px;
border-color: rgba(255, 87, 123, 0.68);
}
.exception-rule-alert-icon-wrap .el-icon-warning-outline {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
font-size: 40px;
color: #ff547c;
text-shadow: 0 0 12px rgba(255, 75, 111, 0.8);
}
.exception-rule-title-cn {
margin-top: 4px;
font-size: 48px;
letter-spacing: 7px;
line-height: 1.06;
font-weight: 700;
color: #ff2f61;
text-shadow: 0 0 22px rgba(255, 31, 78, 0.5);
}
.exception-rule-title-en {
margin-top: 6px;
letter-spacing: 6px;
font-size: 17px;
font-weight: 600;
color: #ffc3d2;
}
.exception-rule-status-row {
margin-top: 16px;
width: 100%;
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-column-gap: 10px;
}
.exception-rule-status-item {
border: 1px solid rgba(255, 102, 134, 0.35);
background: rgba(35, 9, 18, 0.62);
border-radius: 4px;
padding: 10px 8px 9px;
min-height: 62px;
}
.exception-rule-status-item .status-label {
font-size: 11px;
color: rgba(255, 180, 196, 0.78);
letter-spacing: 1px;
}
.exception-rule-status-item .status-value {
margin-top: 5px;
font-size: 15px;
color: #ffe6ec;
font-weight: 700;
word-break: break-all;
}
.exception-rule-mask-message {
margin-top: 18px;
width: 100%;
min-height: 74px;
padding: 12px 14px;
border-radius: 4px;
border: 1px solid rgba(255, 115, 145, 0.35);
background: rgba(23, 6, 12, 0.76);
color: #ffb7c8;
font-size: 17px;
font-weight: 600;
line-height: 1.6;
line-height: 1.55;
letter-spacing: 1px;
}
.exception-rule-mask-sub {
margin-top: 8px;
font-size: 13px;
color: #909399;
margin-top: 12px;
font-size: 15px;
color: #ffd7e1;
letter-spacing: 2px;
}
@keyframes pulse-ring {
0% {
transform: scale(0.9);
opacity: 0.9;
}
70% {
transform: scale(1.06);
opacity: 0.4;
}
100% {
transform: scale(0.9);
opacity: 0.9;
}
}
/* 分卷不良原因对话框 */

Loading…
Cancel
Save