page { background-color: #fff; } .notify { display: flex; align-items: center; justify-content: space-between; width: 702rpx; box-sizing: border-box; padding: 14rpx 24rpx 14rpx 40rpx; background: linear-gradient(320deg, #FFFFFF 0%, #FFFFFF 100%); border-radius: 19rpx; margin-bottom: 20rpx; } .notify .notify-left { font-weight: 400; font-size: 28rpx; color: #333333; line-height: 40rpx; text-align: right; font-style: normal; display: flex; align-items: center; } .notify .notify-left .notify-left-img { width: 42rpx; height: 42rpx; margin-right: 10rpx; } .notify .notify-right { width: 130rpx; height: 54rpx; } .my-page { position: relative; margin-bottom: 120rpx; } .my-page::before { content: ""; position: fixed; top: 0; left: 0; right: 0; height: 676rpx !important; background-image: url(/static/images/background/bj.png); background-size: cover; background-position: center top; background-repeat: no-repeat; z-index: 1; } .user-info { padding: 0 24rpx; position: relative; z-index: 99; margin-top: 32rpx; } .user-header { display: flex; align-items: center; margin-bottom: 48rpx; } .avatar-wrap { width: 110rpx; height: 110rpx; border-radius: 64rpx; overflow: hidden; margin-right: 24rpx; border: 4rpx solid #fff; } .avatar { width: 100%; height: 100%; } .user-detail { flex: 1; } .name-wrap { display: flex; flex-flow: column nowrap; justify-content: center; align-items: flex-start; } .name { font-weight: 500; font-size: 34rpx; color: #333333; line-height: 56rpx; text-align: left; font-style: normal; } .verified { width: 130rpx; height: 44rpx; display: flex; flex-flow: row nowrap; justify-content: center; align-items: center; border: 1rpx solid #E8101E; background-color: #fff1f1; border-radius: 22rpx; box-sizing: border-box; } .verified-no { width: 130rpx; height: 44rpx; display: flex; flex-flow: row nowrap; justify-content: center; align-items: center; border: 1rpx solid #666666; border-radius: 22rpx; box-sizing: border-box; } .verified-text { font-size: 24rpx; color: #E8101E; } .verified-text.no { color: #666666; } .sign-icon { width: 24rpx; height: 24rpx; margin-right: 6rpx; } .edit-profile { display: flex; align-items: center; } .edit-text { font-size: 28rpx; color: #666666; margin-right: 16rpx; } .arrow { font-size: 28rpx; color: #666666; } .amount-img { width: 30rpx; height: 30rpx; margin-right: 8rpx; } .amount-box { display: flex; flex-flow: row nowrap; justify-content: flex-start; align-items: center; background: rgba(252, 67, 124, 0.1); border-radius: 30rpx; padding: 10rpx 16rpx; } .amount-lable { font-weight: 500; font-size: 26rpx; color: #666666; line-height: 30rpx; text-align: left; font-style: normal; } .amount-text { font-weight: 500; font-size: 26rpx; color: #666666; line-height: 30rpx; text-align: left; font-style: normal; color: #E8101E; } .function-list { background: #ffffff; border-radius: 20rpx; padding: 24rpx; box-shadow: 0 0 12rpx 0 rgba(0, 0, 0, 0.05); display: flex; flex-direction: column; gap: 30rpx; } .function-item { display: flex; justify-content: space-between; align-items: center; /* border-bottom: 1rpx solid rgba(0, 0, 0, 0.05); */ } .function-item:last-child { border-bottom: none; } .function-text { font-weight: 500; font-size: 28rpx; color: #232220; line-height: 40rpx; text-align: left; font-style: normal; } /* 交易项目 */ .module { margin: 0; border-radius: 24rpx; padding: 24rpx; margin-bottom: 24rpx; } .module-banner { width: 702rpx; margin-bottom: 24rpx; } .module-cont { display: flex; flex-flow: row wrap; justify-content: space-between; align-items: center; } .module-cont-img { width: 310rpx; height: 120rpx; margin-top: 23rpx; } .module-item { width: 310rpx; height: 120rpx; border-radius: 16rpx; border: 2rpx solid #f0eeee; box-sizing: border-box; display: flex; flex-flow: row nowrap; justify-content: space-between; align-items: center; padding: 24rpx 22rpx 24rpx 24rpx; margin-top: 24rpx; } .module-order .module-item { justify-content: flex-start; } .right_gray { width: 14rpx; height: 26rpx; } .module-lable { font-weight: 500; font-size: 32rpx; color: #333333; line-height: 45rpx; text-align: left; font-style: normal; } .module-left { display: flex; flex-flow: column nowrap; justify-content: center; align-items: flex-start; } .module-tit { font-weight: 500; font-size: 28rpx; color: #333333; line-height: 40rpx; text-align: left; font-style: normal; margin-bottom: 4rpx; } .module-des { font-weight: 500; font-size: 20rpx; color: #999999; line-height: 28rpx; text-align: left; font-style: normal; } .module-icon { width: 68rpx; height: 68rpx; } .module-order .module-icon { margin-right: 28rpx; } .arrow-right { width: 11rpx; height: 22rpx; } /* 平台适配 */ .artisan-page.data-v-69593c2f { /* min-height: 100vh; */ position: relative; padding-bottom: 110rpx; } .artisan-page.data-v-69593c2f::before { content: ""; position: fixed; top: 0; left: 0; right: 0; height: 580rpx !important; background-image: url(/static/images/bg.png); background-size: cover; background-position: center top; background-repeat: no-repeat; z-index: 1; } .bg.data-v-69593c2f { position: relative; } .bg.data-v-69593c2f::before { content: ""; position: fixed; top: 0; left: 0; right: 0; height: 272rpx !important; height: calc(272rpx + 25px) !important; background-image: url(/static/images/bg.png); background-size: cover; background-position: center top; background-repeat: no-repeat; z-index: 999; } .profile-section.data-v-69593c2f, .switch-section.data-v-69593c2f, .order-class.data-v-69593c2f, .order-list.data-v-69593c2f, .nothings-box.data-v-69593c2f { position: relative; z-index: 99; } .profile-section.data-v-69593c2f { position: fixed; top: 88rpx; left: 0; right: 0; height: 184rpx; /* background-color: transparent; */ z-index: 999; display: flex; flex-flow: row nowrap; justify-content: space-between; align-items: center; padding: 0 24rpx; } .profile-info.data-v-69593c2f { display: flex; flex-flow: row nowrap; justify-content: flex-start; align-items: center; } .avatar.data-v-69593c2f { width: 96rpx; height: 96rpx; border-radius: 50rpx; margin-right: 24rpx; background-color: #333333; border: 4rpx solid #ffffff; } .name.data-v-69593c2f { font-size: 36rpx; font-weight: 500; color: #000000; } .welcome.data-v-69593c2f { font-weight: 400; font-size: 22rpx; color: #999999; line-height: 30rpx; text-align: left; font-style: normal; } .center-text.data-v-69593c2f { font-weight: 400; font-size: 28rpx; color: #333333; line-height: 37rpx; text-align: left; font-style: normal; } .switch-section.data-v-69593c2f { margin: 184rpx 24rpx 32rpx; height: 82rpx; display: flex; flex-flow: row nowrap; justify-content: space-between; align-items: center; font-size: 28rpx; background-image: url(/static/images/shop/jdBj.png); background-size: cover; /* 确保图片覆盖整个屏幕 */ background-repeat: no-repeat; /* 防止图片重复 */ background-position: center center; /* 图片居中显示 */ border-radius: 14rpx; padding: 0 32rpx; box-shadow: 0 4rpx 16rpx 0 rgba(210, 213, 224, 0.5); } .switch-box.data-v-69593c2f { /* width: 126rpx; */ height: 52rpx; line-height: 52rpx; border-radius: 26rpx; background-color: #E8101E; display: flex; flex-flow: row nowrap; justify-content: center; align-items: center; padding: 0 6rpx; } .switch-text.data-v-69593c2f { font-size: 24rpx; padding: 0 12rpx; color: #ffffff; } .switch-yuan.data-v-69593c2f { width: 40rpx; height: 40rpx; border-radius: 20rpx; background-color: #fff; } .switch-box.disswitch.data-v-69593c2f { background-color: rgba(0, 0, 0, 0.1); } .switch-box.disswitch .switch-yuan.data-v-69593c2f { margin-left: 0; } .switch-box.disswitch.data-v-69593c2f { background-color: rgba(0, 0, 0, 0.1); } .switch-box.disswitch .switch-yuan.data-v-69593c2f { margin-left: 0; margin-right: 4rpx; } .switch-tip.data-v-69593c2f { font-weight: 400; font-size: 28rpx; color: #333333; line-height: 37rpx; text-align: left; font-style: normal; } .competition-section.data-v-69593c2f { margin: 24rpx; background-color: #ffffff; border-radius: 12rpx; padding: 24rpx; display: flex; justify-content: space-between; align-items: center; } .comp-left.data-v-69593c2f { display: flex; align-items: center; } .trophy-icon.data-v-69593c2f { width: 48rpx; height: 48rpx; margin-right: 16rpx; } .comp-right.data-v-69593c2f { display: flex; align-items: center; color: #999999; font-size: 24rpx; } .arrow-icon.data-v-69593c2f { width: 32rpx; height: 32rpx; margin-left: 8rpx; } .statistics-section.data-v-69593c2f { margin: 24rpx; background-color: #ffffff; border-radius: 12rpx; padding: 24rpx; } .stat-header.data-v-69593c2f { display: flex; justify-content: space-between; align-items: center; margin-bottom: 24rpx; } .stat-title.data-v-69593c2f { font-size: 32rpx; font-weight: 500; } .time-filter.data-v-69593c2f { display: flex; align-items: center; font-size: 24rpx; color: #999999; } .time-filter text.data-v-69593c2f { margin-left: 24rpx; } .time-filter .active.data-v-69593c2f { color: #E8101E; } .chart-container.data-v-69593c2f { height: 400rpx; margin-bottom: 24rpx; } .order-class.data-v-69593c2f { padding-bottom: 20rpx; overflow: hidden; width: 750rpx; margin: 36rpx 0 0; border-radius: 28rpx 28rpx 28rpx 28rpx; background-color: #fff; } .order-class .order-types.data-v-69593c2f { margin: 0 20px; height: 49px; display: flex; justify-content: flex-start; align-items: center; flex-wrap: nowrap; -webkit-column-gap: 40rpx; column-gap: 40rpx; } .order-class .order-types .order-type-item.data-v-69593c2f { display: flex; flex-flow: column nowrap; justify-content: center; align-items: center; margin-top: 0; transition: all 0.3s ease; } .order-class .order-types .order-type-item .type-name.data-v-69593c2f { font-weight: 500; font-size: 30rpx; color: #333333; line-height: 42rpx; text-align: left; font-style: normal; white-space: nowrap; } .order-class .order-types .order-type-item.active.data-v-69593c2f { position: relative; background-color: #fff; } .order-class .order-types .order-type-item.active .type-name.data-v-69593c2f { color: #E8101E; } .active-line.data-v-69593c2f { width: 28rpx; height: 6rpx; border-radius: 4rpx; background-color: #E8101E; position: absolute; bottom: -10rpx; z-index: 99; } .order-state.data-v-69593c2f { width: 726rpx; display: flex; flex-flow: row nowrap; justify-content: flex-start; align-items: center; margin-top: 10rpx; padding: 0 36rpx; gap: 16rpx; /* H5 必须添加以下属性 */ } .order-state.data-v-69593c2f .uni-scroll-view-content { display: flex !important; flex-flow: row nowrap !important; justify-content: flex-start !important; align-items: center !important; /* H5 需要添加 */ } .order-state-item.data-v-69593c2f { box-sizing: border-box; height: 56rpx; background: #F3F5F6; border-radius: 10rpx; padding: 0 20rpx; font-weight: 400; font-size: 28rpx; color: #333333; line-height: 56rpx; text-align: left; font-style: normal; margin-right: 50rpx; } .state-.data-v-69593c2f { margin: 12rpx 0; } .order-state-item.active.data-v-69593c2f { background: #FEE5E7; color: #E8101E; } .order-state__user.data-v-69593c2f { margin-top: 10rpx; padding-left: 36rpx; display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center; -webkit-column-gap: 50rpx; column-gap: 50rpx; } .order-state__user .order-state-item.data-v-69593c2f { margin-right: 0rpx; display: flex; flex-direction: row; align-items: center; justify-content: center; width: auto; height: 56rpx; } .order-state__user .state-name.data-v-69593c2f { margin: 0; } .order-list.data-v-69593c2f { background-color: #f5f5f5; border-radius: 28rpx 28rpx 0 0; padding-top: 24rpx; margin-top: -40rpx; padding-bottom: 280rpx; } .order-item.data-v-69593c2f { background-color: #ffffff; border-radius: 16rpx; padding: 32rpx; margin: 0 24rpx 24rpx; box-shadow: 0 8rpx 16rpx 0 rgba(210, 213, 224, 0.5); } .order-header.data-v-69593c2f { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8rpx; } .service-name.data-v-69593c2f { font-size: 28rpx; color: #333333; font-weight: 500; flex: 1; } .order-info.data-v-69593c2f { margin-bottom: 32rpx; display: flex; flex-flow: column nowrap; justify-content: center; align-items: flex-start; } .address.data-v-69593c2f, .service-time.data-v-69593c2f, .order-number.data-v-69593c2f { flex: 1; font-size: 24rpx; color: #666666; } .order-footer.data-v-69593c2f { display: flex; justify-content: space-between; align-items: center; } .order-actions.data-v-69593c2f { padding-top: 32rpx; border-top: 1rpx solid rgba(0, 0, 0, 0.05); display: flex; flex-flow: row nowrap; justify-content: flex-end; align-items: center; gap: 24rpx; } .action-btn.data-v-69593c2f { /* width: 96rpx; height: 40rpx; */ padding: 8rpx 12rpx; display: flex; justify-content: center; align-items: center; border-radius: 6rpx; } .action-btn.cancel.data-v-69593c2f, .action-btn.confirm.data-v-69593c2f { border: 1rpx solid rgba(51, 51, 51, 0.12); box-sizing: border-box; } .action-btn.cancel .action-text.data-v-69593c2f, .action-btn.confirm .action-text.data-v-69593c2f { font-size: 28rpx; color: #333333; font-weight: 400; } .action-btn.verify.data-v-69593c2f { border: 1rpx solid rgba(252, 67, 124, 0.12); box-sizing: border-box; } .action-btn.verify .action-text.data-v-69593c2f { font-size: 28rpx; color: #E8101E; } .nothings-box.data-v-69593c2f { display: flex; flex-flow: row nowrap; justify-content: center; align-items: center; padding: 280rpx 0 0; } .nothings-text.data-v-69593c2f { font-size: 32rpx; font-weight: 500; color: #999999; text-align: center; font-style: italic; } .arrow-right.data-v-69593c2f { width: 11rpx; height: 22rpx; margin-top: 10rpx; margin-left: 15rpx; } /* APP适配 */ /* 小程序适配 */ .nav-bar.data-v-69593c2f { padding-top: constant(safe-area-inset-top); padding-top: env(safe-area-inset-top); } .profile-section.data-v-69593c2f { top: calc(25px + 88rpx); }