回调初版

快乐的昕的电脑

2025-11-24 ed949e7d41508674854d3000d3bb4fe8d93710da

回调初版

 components/WorkOrderStatus.vue

@@ -28,9 +28,9 @@
                    <input class="input-box" v-model="suspendTime" disabled="true" placeholder="点暂停按钮时写入" />
                </view>-->
                <!-- <view class="item">
        <button @click="stateCheck(3)" class="btn-blue">反完工</button>
        <input class="input-box" v-model="reverseTime" disabled="true" placeholder="点反完工按钮写入" />
    </view> -->
                    <button @click="stateCheck(3)" class="btn-blue">反完工</button>
                    <input class="input-box" v-model="reverseTime" disabled="true" placeholder="点反完工按钮写入" />
                </view> -->
            </view>

            <!-- 右边工单状态 -->
@@ -224,59 +224,47 @@
    }

    /* 刷新按钮样式 */
    .refresh-btn {
        position: absolute;
        top: 10px;
        right: 10px;
        background-color: #00A2E9;
        /* 蓝色背景 */
        color: white;
        height: 60px;
        border: none;
        border-radius: 5px;
        font-size: 35px;
        cursor: pointer;
        width: 90px !important; /* 更窄 */
        height: 60px !important; /* 更高 */
        font-size: 22px !important;
        padding: 0 !important;
        border-radius: 8px !important;
    }
    .refresh-btn {
        position: absolute;
        top: 10px;
        right: 10px;
        background-color: #00A2E9;
        /* 蓝色背景 */
        color: white;
        padding: 10px 20px;
        border: none;
        border-radius: 5px;
        font-size: 35px;
        cursor: pointer;
    }

    /* 上半部分：左右布局 */
    .top-section {
        display: flex;
        flex-direction: row;
        align-items: flex-start;
        justify-content: flex-start;
        flex-wrap: nowrap;
        margin-bottom: 4vh;
    }
    .top-section {
        display: flex;
        justify-content: space-between;
        flex-grow: 1;
        margin-bottom: 4vh;
    }

    .left-section {
        width: 32%;
        display: flex;
        flex-direction: column;
    }
    /* 左边按钮和输入框部分（左右布局） */
    .left-section {
        width: 65%;
        display: flex;
        flex-direction: column;
    }

    .item {
        display: flex;
        align-items: center;
        margin-bottom: 3vh;
        flex-wrap: nowrap; /* 禁止换行 */
    }
    .item {
        display: flex;
        align-items: center;
        margin-bottom: 1.5vh;
    }

    /* 统一按钮和输入框的高度 */
    button,
    .input-box {
        width: 55% !important; /* 原70%，改为50%，更窄 */
        height: 4vh !important; /* 原6vh，改为4vh，更矮 */
        font-size: 1.2vw !important; /* 字体更小 */
        padding: 0 0.8vw !important; /* 内边距略减 */
        border: 2px solid #999 !important;
        border-radius: 5px !important;
        box-sizing: border-box;
    }
    button,
    .input-box {
        height: 5vh;
        /* Adjusted for larger, consistent height */
    }

    button {
        width: 30%;
@@ -311,16 +299,16 @@

    /* 右边工单状态部分 */
    .right-section {
            width: 30%;
            display: flex;
            flex-direction: column;
            align-items: flex-start;
            justify-content: flex-start;
            text-align: center;
            padding-top: 45px;
            flex-wrap: wrap;
            align-content: flex-start;
            margin-top: -44px;
        width: 30%; /* 原来是30%，调大一点 */
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: flex-start;
        text-align: center;
        padding-top: 45px;
        flex-wrap: wrap;
        align-content: flex-start;
        margin-top: -44px;
    }

    .status-title {
@@ -329,12 +317,17 @@
        /* Larger font size for titles */
    }

    .status-circle {
        width: 7vw;
        height: 7vw;
        min-width: 60px;
        min-height: 60px;
    }
    .status-circle {
        width: 11vw;
        /* Enlarged status circle */
        height: 11vw;
        background-color: #00A2E9;
        border-radius: 50%;
        display: flex;
        justify-content: center;
        align-items: center;
        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    }

    .status-input {
        color: white;
@@ -349,70 +342,31 @@
    }

    /* 下半部分：保存和取消按钮 */
    .bottom-section {
        display: flex;
        margin-top: 1vh;
        height: 100%;
        justify-content: flex-end; /* 让按钮靠右对齐（可选） */
        gap: 16px; /* 按钮间距 */
    .bottom-section {
        display: flex;
        justify-content: space-between;
        margin-top: 1vh;
        height: 100%;
    }

    .save-btn,
    .cancel-btn {
        background-color: #00A2E9;
        color: white;
        border: none;
        text-align: center;
    .save-btn,
    .cancel-btn {
        width: 48%;
        padding: 1.5vh;
        background-color: #00A2E9;
        color: white;
        border: none;
        text-align: center;
        font-size: 1.8vw;
        /* Larger font for buttons */
        height: 100%;
    }

        width: 90px !important; /* 更窄 */
        height: 60px !important; /* 更高 */
        font-size: 22px !important;
        padding: 0 !important;
        border-radius: 8px !important;
        display: inline-block;
    }

    /* 让右侧工单号输入框变长 */
    .status-title input.status-title {
        min-width: 120px;
        width: 100%;
    }

    .button,
    .input-box {
        font-size: 2.2vw !important; /* 字体更大 */
        height: 6vh !important; /* 高度略增 */
    }

    .input-box {
        border: 2.5px solid #999 !important; /* 边框更粗更明显 */
        border-radius: 6px !important; /* 圆角略大 */
        padding: 0 1.5vw !important;
    }

    button {
        border: 2.5px solid #999 !important; /* 按钮边框加粗 */
        border-radius: 6px !important;
    }

    .left-section .item button {
        border-width: 1px !important; /* 边框更粗 */
        border-style: solid !important;
        border-color: #999 !important; /* 保持原有色调 */
        font-size: 2.6vw !important; /* 字体更大 */
        font-weight: bold;
        height: 7vh !important; /* 按钮高度加大 */
        margin-right: 1%; /* 与输入框间距 */
        box-sizing: border-box;

        width: 34% !important; /* 按钮略宽一点，避免输入框太窄 */
        min-width: 60px;
    }

    .left-section .item .input-box {
        width: 45% !important; /* 原60%，改为45% */
        min-width: 100px;
        box-sizing: border-box;
    }

    /* 让右侧工单号输入框变长 */
    .status-title input.status-title {
        width: 90%; /* 或 100%，根据实际需求调整 */
        min-width: 320px; /* 可选，保证最小宽度 */
        font-size: 2vw;
        box-sizing: border-box;
    }
</style>