shenze-sysMan/src/styles/orderCenter/index.less

.orderPage {
  .orderBox {
    width: 100%;
    height: calc(100% - 44px);
    overflow: auto;
    overflow-x: hidden;
    // background-color: #f5f5f5;

    .main3 {
      // width: 100%;
      height: 60px;
      background: rgba(255, 255, 255, 1) url("../../assets/home/line.png") bottom center no-repeat;
      background-size: 100% auto;
      background-color: #ffffff;

      .group4 {
        // width: 100%;
        // height: 17px;
        padding: 0 20px;

        .ImageText1 {
          // height: 16px;
          // margin-top: 1px;
          // width: 87px;

          .outer2 {
            // width: 50px;
            // height: 16px;

            .block1 {
              width: 15px;
              height: 15px;
              background: url("../../assets/home/titleIcon.png") top center no-repeat;
              background-size: 100%;
              margin-right: 5px;
            }

            .TextGroup1 {
              // height: 14px;
              // margin-top: 2px;
              // width: 65px;

              .txt1 {
                // width: 65px;
                // height: 14px;
                overflow-wrap: break-word;
                color: rgba(64, 77, 116, 1);
                font-size: 14px;
                font-family: PingFangSC-Semibold;
                text-align: left;
                white-space: nowrap;
                line-height: 15px;
                display: block;
              }
            }
          }
        }

        .main5 {
          // width: auto;
          cursor: pointer;

          .label2 {
            width: 16px;
            // height: 20px;
            // margin-right: 5px;
          }
        }
      }
    }

    .salesData {
      background: url("../../assets/home/outer.png") top center no-repeat;
      background-size: 100% 100%;
      // width: 100%;
      // margin-top: 20px;

      // .block5 {
      //   width: 100%;
      padding: 10px 20px;

      .salesDataBox {
        margin: 25px 0;

        .dataGroup {
          width: 33.3%;
          // height: 58px;

          .dataGroupBox {
            // width: 100%;
            // height: 30px;

            .currencySymbol {
              // width: auto;
              // height: 20px;
              // padding-right: 0.5rem;
              overflow-wrap: break-word;
              color: rgba(223, 94, 76, 1);
              font-size: 15px;
              font-family: PingFangSC-Semibold;
              text-align: center;
              white-space: nowrap;
              line-height: 15px;
              margin-top: 10px;
              display: block;
            }

            .dataNum {
              // width: 49px;
              // height: 30px;
              overflow-wrap: break-word;
              color: rgba(223, 94, 76, 1);
              font-size: 20px;
              font-family: PingFangSC-Semibold;
              text-align: center;
              white-space: nowrap;
              line-height: 20px;
              // margin-left: -20px;
              margin-top: 5px;
              display: block;
            }
          }

          .dataText {
            // width: 100%;
            // height: 17px;
            overflow-wrap: break-word;
            color: rgba(135, 135, 166, 1);
            font-size: 13px;
            text-align: center;
            white-space: nowrap;
            line-height: 13px;
            display: block;
            margin-top: 15px;
          }
        }
      }
    }

    .OrderHead {
      height: 50px;
      margin-top: 10px;
      margin-bottom: 15px;
      // width: 100%;
      background: rgba(255, 255, 255, 1) url("../../assets/home/line.png") bottom center no-repeat;
      background-color: #fff;
      box-shadow: 0 2px 2px 2px rgba(0, 0, 0, 0.1);


      .main9 {
        // width: 100%;
        padding: 2.5px 20px;
        // height: 30px;
        display: flex;
        align-items: center;


        .wrap1 {
          width: 100%;
          // height: 30px;
          // padding: 0 12px 5px;
          // align-items: center;

          .ImageText7 {
            // height: 18px;
            // margin-top: 1px;
            // width: 79px;

            .mod5 {
              // width: 30px;
              // height: 18px;

              .block3 {
                width: 15px;
                height: 15px;
                background: url('../../assets/order/orderIcon.png') top center no-repeat;
                background-size: 100%;
                margin-right: 5px;
              }

              .TextGroup7 {
                // height: 14px;
                // margin-top: 3px;
                // width: 56px;

                .info3 {
                  // width: 56px;
                  // height: 14px;
                  overflow-wrap: break-word;
                  color: rgba(64, 77, 116, 1);
                  font-size: 14px;
                  font-family: PingFangSC-Semibold;
                  text-align: left;
                  white-space: nowrap;
                  line-height: 14px;
                  display: block;
                }
              }
            }
          }

          .OrderExcel {
            .OrderExcelTxt {
              overflow-wrap: break-word;
              color: #4d6add;
              font-size: 14px;
              text-align: center;
              white-space: nowrap;
              line-height: 14px;
              display: block;
            }

            .OrderExcelIcon {
              width: 15px;
              height: 15px;
              background: url('../../assets/order/gotoRight.png') top center no-repeat;
              background-size: 100%;
            }
          }
        }
      }
    }

    .orderList {      
      background-color: rgba(255, 255, 255, 1);
      // margin-top: 1px;
      width: 100%;
      position: relative;

      // .group8 {

      //   .section4 {
      //     width: 100%;
      // margin-top: 13px;

      .section5 {
        // width: 100%;
        height: 160px;
        position: relative;
        padding: 5px 10px;
        background-color: #ffffff;

        .van-card {
          height: 150px;
          // background-color: #ffff;
          display: flex;
          align-items: center;
          border-radius: 20px;
          box-shadow: 0 2px 5px 3px rgba(0, 0, 0, 0.1);

        }

        .van-card__header {
          height: 120px;
        }

        .van-card__bottom {
          height: 50px;
        }

        .van-card__thumb {
          margin-top: 20px;
          width: 85px;
          height: 85px;
        }

        .van-image__img {
          object-fit: contain !important;
        }

        .tradeName {
          width: 150px;
          overflow-wrap: break-word;
          color: rgba(64, 77, 116, 1);
          font-size: 13px;
          line-height: 18px;
          display: block;
          overflow: hidden;
          text-overflow: ellipsis;
          white-space: nowrap;
        }

        .equipmentName {
          width: 150px;
          color: rgba(64, 77, 116, 1);
          font-size: 13px;
          line-height: 18px;
          display: block;
        }

        .orderTime {
          overflow-wrap: break-word;
          color: rgba(64, 77, 116, 1);
          font-size: 11px;
          text-align: left;
          white-space: nowrap;
          line-height: 14px;
          display: block;
        }

        .pricBox {
          // padding-top: 0.1rem;

          .payType {
            // height: 0.325rem;
            overflow-wrap: break-word;
            color: rgba(64, 77, 116, 1);
            font-size: 11px;
            text-align: left;
            white-space: nowrap;
            line-height: 14px;
            display: block;
            padding-top: 5px;
          }

          .currencySymbol {
            // height: 16px;
            overflow-wrap: break-word;
            color: rgba(77, 193, 147, 1);
            font-size: 15px;
            font-family: PingFangSC-Semibold;
            text-align: center;
            white-space: nowrap;
            line-height: 15px;
            display: block;
            // padding-right: 0.1rem;
            padding-top: 5px;
          }

          .orderPrice {
            // height: 23px;
            // width: auto;
            overflow-wrap: break-word;
            color: rgba(77, 193, 147, 1);
            font-size: 18px;
            font-family: PingFangSC-Semibold;
            text-align: left;
            white-space: nowrap;
            line-height: 20px;
            padding-top: 0.05rem;
            display: block;
          }

        }

        .giveAway {
          // width: 60px;
          // height: 0.325rem;
          overflow-wrap: break-word;
          color: rgba(229, 154, 109, 1);
          font-size: 11px;
          font-family: PingFangSC-Medium;
          text-align: left;
          white-space: nowrap;
          line-height: 15px;
          display: block;
          // padding-top: 0.15rem;
        }

        .van-card__footer {
          position: absolute;
          top: 125px;
          right: 15px;
          // width: 40px;
          overflow-wrap: break-word;
          color: rgba(64, 77, 116, 1);
          // font-size: 18px;
          white-space: nowrap;
          // line-height: 20px;
          display: block;
        }


        .payPic {
          position: absolute;
          top: 20px;
          right: 15px;
          width: 50px;
          height: 50px;

          &.orderSuccess {
            background: url('../../assets/order/paySuccess.png') top center no-repeat;
            background-size: 100%;
          }

          &.coinOrderSuccess {
            background: url('../../assets/order/coinPay.png') top center no-repeat;
            background-size: 100%;
          }

          &.orderError {
            background: url('../../assets/order/payError.png') top center no-repeat;
            background-size: 100%;
          }

          &.refunding {
            background: url('../../assets/order/refunding.png') top center no-repeat;
            background-size: 100%;
          }

          &.refunded {
            background: url('../../assets/order/refunded.png') top center no-repeat;
            background-size: 100%;
          }
        }
      }
    }
  }

  .orderPopBox {
    // width: 100%;
    background-color: rgba(255, 255, 255, 1);
    // border-radius: 1vw 1vw 0 0;
    height: auto;
    padding: 10px 10px;

    // .section1 {

    // .group3 {

    .popTopBox {
      height: 70px;

      .popTopTxtBox {
        // height: 71px;

        // .txt4 {
        //   width: 98px;
        //   height: 13px;
        //   overflow-wrap: break-word;
        //   color: rgba(64, 77, 116, 1);
        //   font-size: 14px;
        //   font-family: PingFangSC-Medium;
        //   text-align: left;
        //   white-space: nowrap;
        //   line-height: 14px;
        //   display: block;
        // }

        .business {
          // width: 28px;
          // height: 13px;
          overflow-wrap: break-word;
          color: rgba(64, 77, 116, 1);
          font-size: 15px;
          font-family: PingFangSC-Medium;
          text-align: center;
          white-space: nowrap;
          line-height: 15px;
          display: block;
          // margin: 5vw 0 0 5vw;
        }

        .incomePrice {
          // width: 68px;
          // height: 30px;
          overflow-wrap: break-word;
          color: rgba(223, 94, 76, 1);
          font-size: 20px;
          font-family: PingFangSC-Semibold;
          text-align: center;
          white-space: nowrap;
          line-height: 20px;
          display: block;
          // margin: 5px 0 0 15px;
          margin-top: 8px;
        }
      }
    }

    .line {
      background-color: rgba(215, 215, 226, 1);
      height: 1px;
      margin: 10px 0;
    }

    .orderDetailBox {
      margin-top: 10px;
      padding: 0 15px;

      .title {
        width: 100px;
        overflow-wrap: break-word;
        color: rgba(135, 135, 166, 1);
        font-size: 13px;
        text-align: left;
        white-space: nowrap;
        line-height: 16px;
        display: block;
      }

      .content {
        width: 200px;
        // overflow-wrap: break-word;
        color: rgba(64, 77, 116, 1);
        font-size: 13px;
        text-align: right;
        // text-overflow: ellipsis;
        // white-space: nowrap;
        // overflow: hidden;
        line-height: 16px;
        // display: block;
      }
    }

    .van-field__label {
      width: 100px;
      color: rgba(135, 135, 166, 1);
      font-size: 13px;
      text-align: left;
    }

    .van-field__control {
      font-size: 13px;
    }

    .van-cell {
      padding: 0 15px;
      margin-top: 8px;
    }
  }

  .btnFooter {
    display: flex;
    justify-content: space-between;
    align-items: center;


    .checkAllBtn {
      width: 40%;
      padding-left: 15px;
      padding-top: 5px;
      height: 30px;
    }

    .totalRefund {
      color: #df5e4c;
      font-size: 18px;
      font-family: PingFangSC-Semibold;
    }

  }



  .refundBox {
    display: block;
    justify-content: flex-end;
    /* 水平方向上右对齐 */
    align-items: center;
    /* 垂直方向上居中对齐 */
    flex-direction: column;
    /* 垂直方向上排列子元素 */

    .van-card {
      background-color: #ffff;
      width: 95%;
      // margin: 0 5px;
      padding: 0 5px;
    }

    .van-card__thumb {
      margin-top: 10px;
      width: 60px;
      height: 60px;
    }

    .van-image__img {
      object-fit: contain !important;
    }

    .van-card__title {
      width: 100px;
    }

    .van-card__footer {
      position: absolute;
      top: 25px;
      right: 10px;
      // width: 20px;
      overflow-wrap: break-word;
      // color: rgba(64, 77, 116, 1);
      font-size: 13px;
      white-space: nowrap;
      line-height: 14px;
      display: block;
    }

    .card01 {
      display: flex;
      margin: 0 15px;
      width: 90%;
      height: auto;
    }

    .van-card__content {
      height: 50px;
    }

    .van-card__bottom {
      margin-bottom: 15px;
    }

    // .inputAmount {
    //   width: 100%;
    // }
  }


  .van-button--primary {
    border-color: #4d6add;
    background-color: #4d6add;
    // font-size: 0.325rem;
  }
}