crm-app-vue3/pages/wareHouse/styles/openOrder.scss

.open_order {
    padding-bottom: 142rpx;
    .open_order_content {
        .header {
            display: flex;
            justify-content: flex-start;
            align-items: flex-start;
            padding: 20rpx;
            background-color: #1f2937;
            border-radius: 20rpx;
            margin: 20rpx;

            .header_img {
                width: 150rpx;
                height: 150rpx;
                border-radius: 20rpx;
                flex-shrink: 0;
            }

            .header_box {
                display: flex;
                flex-direction: column;
                align-items: flex-start;
                padding: 0 20rpx;
                flex: 1;
                min-width: 0;

                .title {
                    font-size: 32rpx;
                    font-weight: 600;
                    color: #ffffff;
                    display: -webkit-box;
                    -webkit-line-clamp: 1;
                    -webkit-box-orient: vertical;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    line-height: 1.4;
                    word-break: break-word;
                    width: 100%;
                }

                .header_detail_box {
                    display: grid;
                    grid-template-columns: 1fr 1fr;
                    align-items: center;
                    padding: 20rpx 0;
                    width: 100%;

                    .total_cost {
                        display: flex;
                        flex-direction: column;
                        align-items: flex-start;
                        padding: 20rpx 0;
                        color: #ffffff;
                        font-size: 24rpx;

                        .total_cost_title {
                            color: #838a97;
                            font-size: 24rpx;
                        }

                        .total_cost_price {
                            color: #ffffff;
                            font-size: 30rpx;
                        }
                    }

                    .advice_price {
                        display: flex;
                        flex-direction: column;
                        align-items: flex-end;
                        padding: 20rpx 0;
                        color: #ffffff;
                        font-size: 24rpx;

                        .advice_price_title {
                            color: #838a97;
                            font-size: 24rpx;
                        }

                        .advice_price_price {
                            display: flex;
                            align-items: center;
                            color: #d0a10d;
                            font-size: 30rpx;
                            font-weight: 600;
                            ::v-deep .uni-input-input {
                                width: 100rpx;
                                color: #d0a10d;
                            }
                        }
                    }
                }
            }

        }

        .card_item {
            display: flex;
            flex-direction: column;
            align-items: flex-start;
            background-color: #ffffff;
            border-radius: 20rpx;
            padding: 20rpx;
            margin:10rpx 20rpx;

            font-weight: 600;



            ::v-deep .u-form-item {
                width: 100%;

                .u-form-item__body__left__content__label {
                    color: #9ca3af;
                    font-size: 24rpx;
                }

                .u-form-item__body__right {
                    color: #000;
                    font-size: 40rpx;

                    .uni-input-wrapper {
                        font-size: 40rpx;
                    }
                    .imgs_scroll{
                        width: calc(100vw - 80rpx);
                        display: flex;
                        gap: 20rpx;
                    }
                }
            }

            ::v-deep .sales_person_box_form {
                .u-form-item__body__right__content__slot {
                    display: grid;
                    grid-template-columns: 1fr 2fr;
                    gap: 20rpx;

                    .sales_person_box {
                        display: flex;
                        gap: 10rpx;
                        justify-content: flex-start;
                        align-items: center;
                        padding: 10rpx 20rpx;
                        border-radius: 10rpx;
                        background-color: #f3f4f6;

                        .text {
                            font-size: 26rpx;
                            font-weight: 600;
                            color: #374151;
                        }
                    }
                }
            }
        }
    }
    .bottom_box{
        position:fixed;
        bottom:0;
        left:0;
        right:0;
        display: grid;
        grid-template-columns: 1fr 2fr;
        gap: 20rpx;
        padding: 20rpx;
        background-color: #ffffff;
        .bottom_box_item{
            display: flex;
            flex-direction: column;
            align-items: flex-start;
            font-weight: 600;
            color: #9ca3af;
            .bottom_box_item_title{
                font-size: 24rpx;
            }
            .bottom_box_item_price{
                font-size: 40rpx;
                font-weight: 600;
                color: #dc2626;
            }
        }
    }
}