刀具样式修改

快乐的昕的电脑

2025-11-12 cf8da0703d470ddfc9e92e43c4f39e0909a17b74

 components/mold.vue

@@ -10,7 +10,12 @@
                </view>
                <view class="form-cell">
                    <label class="form-label">设置使用上限：</label>
                    <input class="input small-font" type="number" v-model="useLimitInput" placeholder="每次换刀后手填" :disabled="!selectedToolNo || loadingForm" />
                    <input class="input big-font"
                           :class="useLimitColorClass"
                           type="number"
                           v-model="useLimitInput"
                           placeholder="每次换刀后手填"
                           :disabled="!selectedToolNo || loadingForm" />
                </view>
                <view class="form-cell">
                    <label class="form-label">寿命比预警值：</label>
@@ -164,6 +169,13 @@
        computed: {
            totalPages() {
                return Math.max(1, Math.ceil(this.total / this.pageSize) || 1);
            },
            useLimitColorClass() {
                const v = Number(this.useLimitInput);
                if (!v || isNaN(v)) return '';
                if (v < 50) return 'limit-danger';
                if (v < 100) return 'limit-warning';
                return 'limit-safe';
            }
        },
        watch: {
@@ -1044,4 +1056,38 @@
        min-width: 120px;
    }

    .form-label,
    .input.big-font,
    .btn-blue.big-font,
    .btn-blue.large-btn.big-font {
        font-size: 22px !important;
    }

    .input.big-font {
        height: 44px;
    }

    .unit-text {
        font-size: 18px;
    }

    /* 使用上限颜色标识 */
    .input.limit-safe {
        border: 2px solid #52c41a !important;
        background: #f6ffed !important;
        color: #237804 !important;
    }

    .input.limit-warning {
        border: 2px solid #faad14 !important;
        background: #fffbe6 !important;
        color: #ad6800 !important;
    }

    .input.limit-danger {
        border: 2px solid #ff4d4f !important;
        background: #fff1f0 !important;
        color: #a8071a !important;
    }

</style>