| | |
| | | <label class="form-label">刀具编号:</label> |
| | | <input class="input small-font" v-model="selectedToolNo" placeholder="请通过刀具目录选择" disabled /> |
| | | </view> |
| | | <view class="form-cell"> |
| | | <view class="form-cell form-cell-flex"> |
| | | <label class="form-label highlight-label">使用上限:</label> |
| | | <input class="input small-font input-use-limit" type="number" v-model="useLimitInput" placeholder="每次下刀后手填上限" :disabled="!selectedToolNo || loadingForm" /> |
| | | </view> |
| | | <view class="form-cell"> |
| | | <label class="form-label">寿命比预警值:</label> |
| | | <label class="form-label" style="margin-left:16px;">寿命比预警值:</label> |
| | | <view class="input-with-unit"> |
| | | <input class="input small-font input-life-warn" |
| | | v-model="lifeWarnInput" |
| | | placeholder="如0.9或90" |
| | | placeholder="如90或0.90" |
| | | :disabled="!selectedToolNo || loadingForm" /> |
| | | <span class="unit-text">%</span> |
| | | </view> |
| | |
| | | <label class="form-label">规格型号:</label> |
| | | <input class="input small-font input-tool-model" v-model="toolModel" placeholder="刀具带出" disabled /> |
| | | </view> |
| | | <!-- 新增的刀具目录按钮 --> |
| | | <view class="form-cell"> |
| | | <!-- 刀具目录按钮右移 --> |
| | | <view class="form-cell tool-dir-cell"> |
| | | <button class="btn-blue large-btn" @click="openToolDialog" :disabled="loadingTools">刀具目录</button> |
| | | </view> |
| | | </view> |
| | |
| | | } |
| | | |
| | | .form-cell:nth-child(3) { |
| | | flex: 1 1 0; |
| | | min-width: 180px; |
| | | flex: 0 0 auto; |
| | | min-width: 0; |
| | | max-width: 220px; /* 限制最大宽度,避免撑开 */ |
| | | justify-content: flex-end; |
| | | } |
| | | |
| | | .form-label { |
| | | width: 120px; |
| | | width: auto; |
| | | font-weight: bold; |
| | | color: #333; |
| | | white-space: nowrap; |
| | | margin-right: 12px; |
| | | margin-right: 4px; |
| | | flex-shrink: 0; |
| | | } |
| | | |
| | |
| | | cursor: not-allowed; |
| | | } |
| | | |
| | | .input, .input-with-unit { |
| | | width: 100%; |
| | | box-sizing: border-box; |
| | | } |
| | | |
| | | .input-with-unit { |
| | | display: flex; |
| | | align-items: center; |
| | | flex: 1; |
| | | gap: 0; |
| | | } |
| | | |
| | | .input-with-unit .input { |
| | | flex: 1; |
| | | margin-right: 8px; |
| | | width: 60px !important; |
| | | min-width: 0 !important; |
| | | margin-right: 2px !important; |
| | | text-align: center; |
| | | padding-left: 2px; |
| | | padding-right: 2px; |
| | | } |
| | | |
| | | .input-with-unit .input { |
| | | margin-right: 4px !important; |
| | | width: 60px !important; |
| | | min-width: 0 !important; |
| | | text-align: center; |
| | | } |
| | | |
| | | .unit-text { |
| | | color: #666; |
| | | white-space: nowrap; |
| | | width: 28px; |
| | | margin-left: 0 !important; |
| | | padding-left: 0 !important; |
| | | font-size: 22px !important; |
| | | } |
| | | |
| | | .btn-blue, .btn-blue.large-btn { |
| | |
| | | margin-left: 24px; |
| | | } |
| | | |
| | | /* 刀具目录按钮更靠左 */ |
| | | .btn-blue.large-btn { |
| | | padding: 22px 60px; |
| | | padding: 0 60px; |
| | | min-width: 180px; |
| | | height: 72px !important; |
| | | margin-left: 0 !important; /* 彻底贴紧输入框 */ |
| | | margin-left: 0 !important; |
| | | font-size: 1.3em; |
| | | box-shadow: 0 2px 8px rgba(24,144,255,0.08); |
| | | line-height: 72px; /* 垂直居中 */ |
| | | display: inline-block; /* 保证line-height生效 */ |
| | | vertical-align: middle; |
| | | } |
| | | |
| | | .btn-blue:hover { |
| | |
| | | } |
| | | |
| | | .input-life-warn { |
| | | width: 24px !important; |
| | | width: 48px !important; /* 稍微放宽,避免字体溢出 */ |
| | | min-width: 0 !important; |
| | | margin-right: 4px; |
| | | padding-left: 2px; |
| | | padding-right: 2px; |
| | | font-size: 22px !important; /* 字体加大 */ |
| | | font-size: 22px !important; |
| | | text-align: center; |
| | | box-sizing: border-box; |
| | | } |
| | | |
| | | .input-use-limit { |
| | | width: 100px !important; |
| | | min-width: 0 !important; |
| | | margin-right: 16px; |
| | | color: #1890ff !important; |
| | | border-color: #1890ff !important; |
| | | .input, |
| | | .input.small-font, |
| | | .input-use-limit, |
| | | .input-tool-model, |
| | | .input-tool-name, |
| | | .input-life-warn { |
| | | font-size: 22px !important; |
| | | } |
| | | |
| | | .input-tool-model { |
| | | width: 100px !important; |
| | | width: 320px !important; /* 原为200px,现加长 */ |
| | | min-width: 0 !important; |
| | | margin-right: 16px; |
| | | } |
| | |
| | | .highlight-label { |
| | | color: #1890ff !important; |
| | | } |
| | | |
| | | .tool-dir-cell { |
| | | flex: 0 0 auto !important; |
| | | justify-content: flex-start !important; |
| | | display: flex !important; |
| | | align-items: center; |
| | | margin-left: 16px; /* 与规格型号输入框拉开距离 */ |
| | | } |
| | | |
| | | .form-cell-flex { |
| | | display: flex; |
| | | align-items: center; |
| | | flex: 0 0 60%; |
| | | min-width: 320px; |
| | | } |
| | | |
| | | .form-cell-flex .form-label { |
| | | margin-right: 4px; |
| | | width: auto; |
| | | } |
| | | |
| | | .form-cell-flex .input-use-limit { |
| | | margin-right: 12px; |
| | | } |
| | | |
| | | .input-use-limit { |
| | | width: 450px !important; |
| | | min-width: 0 !important; |
| | | margin-right: 16px; |
| | | flex: none !important; /* 关键:彻底禁止flex拉伸 */ |
| | | } |
| | | |
| | | </style> |