page { width: 100%; height: auto; overflow-y: auto; background: #f7f7f7; padding-bottom: 20rpx; box-sizing: border-box; } .complete-info { width: 100%; height: 100%; background: #f7f7f7; } .content { width: 100%; min-height: calc(100vh - 500rpx); } .content-list { width: 100%; min-height: calc(100vh - 100rpx); margin-top: 100rpx; padding: 20rpx 20rpx 0rpx 20rpx; box-sizing: border-box; } /* 内容 */ .personal-info { width: 100%; height: 100%; box-sizing: border-box; padding: 0 20rpx; overflow: hidden; } .basic-info { width: 100%; background: #fff; border-radius: 16rpx; box-sizing: border-box; padding: 0 20rpx; margin-top: 20rpx; } .border-bottom { border-bottom: 1rpx solid #eaeaea; } .no-border-bottom{ border-bottom: 1rpx solid #fff !important; } .note { font-size: 22rpx; color: #999; line-height: 62rpx; } .add-issue { width: 100%; height: 100%; background: #f7f7f7; box-sizing: border-box; } .add-issue .issue-content { width: 100%; height: auto; border-radius: 16rpx; background: #fff; box-sizing: border-box; /* padding: 0rpx 20rpx 45rpx; */ } .add-issue .issue-content textarea { width: 100%; height: 298rpx; background-color: #f7f7f7; padding:30rpx; font-size: 34rpx; color: #333; line-height: 50rpx; position: relative; box-sizing: border-box; } .add-issue .issue-content textarea .textarea-placeholder { font-size: 32rpx; color: #999; line-height: 50rpx; position: absolute; left: 0; top: 0; } /* ???????? */ .image-list { width: 100%; display: grid; grid-template-columns: 214rpx 214rpx 214rpx; grid-template-rows: 214rpx; grid-gap: 17rpx; height: 188rpx; margin-top:60rpx ; } .image-list-2 { height: 428rpx !important; } .image-list-3 { height: 642rpx !important; } .image-list-4 { height: 856rpx !important; } .image-list .image-item { width: 100%; height: 100%; position: relative; } .image-list image { /* width: 100%; */ /* height: 100%; */ width: 180rpx; height: 180rpx; object-fit: cover; border-radius: 8rpx; } .image-list .image-item .loading { position: absolute; left: 25%; top: 25%; width: 50%; height: 50%; } .image-list .image-item .close { position: absolute; top: -10rpx; right: -10rpx; width: 40rpx; height: 40rpx; } .add-issue .image-box { width: 100%; height: auto; border-radius: 16rpx; background: #fff; margin-top: 20rpx; box-sizing: border-box; padding: 34rpx 24rpx; position: relative; /* display: flex; align-items: center; */ } .image-box .image-list-label { position: absolute; top: 35rpx; } .yg-zp{ font-size: 32rpx; font-family: Source Han Serif SC; font-weight: 400; color: #333; } .yg-zp-1{ margin-top: 15rpx; font-size: 25rpx; font-family: Source Han Serif SC; font-weight: 400; color: #999; } .add-issue .image-box .add-icon { /* margin-top: 40rpx; */ width: 80rpx; height: 80rpx; margin-right: 40rpx; } .sheet-bg { width: 100%; height: 100%; position: fixed; top: 0; left: 0; z-index: 999; background-color: rgba(0, 0, 0, 0.6); } /* record start */ .record-actionsheet { height: 472rpx; width: 100%; background-color: #ffffff; border-radius: 30rpx 30rpx 0 0; position: fixed; z-index: 999; bottom: 0; transition: all .2s linear; } .record-actionsheet-hide { bottom: -480rpx; transition: all .2s linear; } .record-actionsheet .top-menu { display: flex; align-items: center; justify-content: space-between; height: 80rpx; } .record-actionsheet .top-menu .button { width: 120rpx; height: 80rpx; line-height: 80rpx; text-align: center; } .record-actionsheet .top-menu .cancel { color: #5b5b5b; } .record-actionsheet .top-menu .confirm { color: #f61717; } .record-actionsheet .close-icon { width: 80rpx; height: 80rpx; display: flex; align-items: center; justify-content: center; } .record-actionsheet .close-icon image { width: 30rpx; height: 30rpx; } .record-actionsheet .text-status { color: #5b5b5b; text-align: center; } .record-actionsheet .status-icon { width: 100%; height: 210rpx; text-align: center; margin-top: 50rpx; } .record-actionsheet .status-icon .icon { width: 210rpx; height: 210rpx; } .record-actionsheet .text-tip { font-size: 26rpx; color: #9e9e9e; text-align: center; } /* record end */ /* audio start */ .audio { width: 670rpx; height: 116rpx; background-color: #f3f3f3; border-radius: 10r; display: flex; position: relative; margin-top: 40rpx; } .audio .control-button { width: 100rpx; height: 100%; display: flex; align-items: center; justify-content: center; } .audio .control-button image { width: 60rpx; height: 60rpx; } .audio .control-line { display: flex; flex-direction: column; justify-content: center; } .audio .control-line .control-slider { width: 500rpx; margin: 10rpx 36rpx; } .audio .control-line .line-time { margin: 0 10px; display: flex; align-items: center; justify-content: space-between; } .audio .control-line .line-time .time-text { color: #aaaaaa; font-size: 24rpx; } .audio .delete-audio { position: absolute; right: -20rpx; top: -20rpx; } .audio .delete-audio image { width: 60rpx; height: 60rpx; } /* audio end */ .add-issue .issue-location { width: 100%; height: 210rpx; border-radius: 16rpx; background: #fff; margin-top: 20rpx; box-sizing: border-box; padding: 34rpx 18rpx 9rpx 25rpx; } .add-issue .issue-location { width: 100%; height: 210rpx; border-radius: 16rpx; background: #fff; margin-top: 20rpx; box-sizing: border-box; padding: 34rpx 18rpx 9rpx 25rpx; } .add-issue .issue-location .address { width:70%; height: 80rpx; display: flex; align-items: center; } .add-issue .issue-location textarea { width:100%; height: 88rpx; color: #333; font-size: 34rpx; line-height: 46rpx; } .add-issue .issue-location .address-placeholder { font-size: 32rpx; color: #999; } .add-issue .issue-location .address image { width: 26rpx; height:26rpx; } .add-issue .issue-location .address view { color: #999; font-size: 26rpx; margin-left: 14rpx; } /* 重新定位 */ .flexBox{ display: flex; width: 100%; box-sizing: border-box; } .refresh{ margin-top: 20rpx; margin-left: 30rpx; } .refresh image { width: 34rpx; height: 34rpx; float: left; position: relative; top: 5rpx; } .refresh-name { font-size: 28rpx; font-weight: 500; color: rgba(0, 179, 152, 1); float: left; margin-left: 10rpx; } .tip{ margin-top: 20rpx; font-size: 22rpx; font-weight: 400; color: #BCBCBC; } .wux-actionsheet__button { font-size: 34rpx !important; color: #333 !important; } /* picker */ .item { border-bottom: 1rpx solid #e7eeee; padding: 25rpx 0; line-height: 60rpx; display: flex; } .item1{ padding: 25rpx 0; line-height: 60rpx; display: flex; } .field { position: relative; box-sizing: border-box; width: 180rpx; padding-left: 25rpx; } .field-d { width: 220rpx !important; } .value-d{ width: 450rpx !important; } .field.mobile-field { width: 250rpx !important; } .field .must { position: absolute; top: 0; left: 0; margin: 0 auto; color: #F61616; font-size: 30rpx; } .field .field-text { font-size: 32rpx; font-family: Source Han Serif SC; font-weight: 400; color: #333; } .value { position: relative; width: 410rpx; display: flex; font-size: 32rpx; font-family: Source Han Serif SC; font-weight: 400; color: #333; line-height: 60rpx; } .value-dl { position: relative; display: flex; font-size: 32rpx; color: #333; line-height: 60rpx; align-items: center; display: flex; justify-content: space-between; flex: 1; } .telInput{ margin-left: 40rpx; } .di-name{ margin-right: 14rpx; text-align: left; width: calc(100% - 30rpx); margin-left: 40rpx; font-family: "PingFangSC-Regular", sans-serif; } .di-name1{ margin-right: 14rpx; text-align: left; width: calc(100% - 30rpx); margin-left: 40rpx; font-family: "PingFangSC-Regular", sans-serif; color: #999; } .di-but{ width: 30rpx; height: 34rpx; } .value input { text-align: right; font-size: 34rpx; color: #333; height: 100%; width: 100%; } .value .picker { position: relative; width: 100%; padding-right: 40rpx; text-align: right; } .value .picker .z-weak { color: #999; } .value .picker .menu-arrow { position: absolute; top: 20rpx; right: 0; width: 16rpx; height: 23rpx; } .value-mobile { position: relative; width: 410rpx; display: flex; font-size: 32rpx; font-family: Source Han Serif SC; font-weight: 400; color: #333; line-height: 60rpx; display: flex; justify-content: flex-end; margin-left:30rpx; } .value-mobile .get-code { padding: 0 15rpx; height: 60rpx; line-height: 60rpx; background: linear-gradient(to right, #F40C0C, #FF4E4E); color: #fff; font-size: 24rpx; border-radius: 6rpx; margin: 0; margin-left: 25rpx; } .value-mobile .button-hover { background: rgb(175, 1, 1); } .value-mobile input { text-align: right; font-size: 34rpx; color: #333; height: 100%; width: 55%; } .placeholder-style { font-size: 28rpx; color: #999; } .is-open{ margin-top: 20rpx; padding: 0 20rpx; box-sizing: border-box; height: 30rpx; font-size: 30rpx; font-weight: 400; color: #333333; line-height: 30rpx; } .submit-button { width: 100%; height: 84rpx; display: flex; align-items: center; justify-content: center; margin: 80rpx 0 65rpx; } .submit-button button { height: 84rpx; line-height: 84rpx; width: 560rpx; padding: 0; text-align: center; color: #fff; font-size: 33rpx; border-radius: 84rpx; background: linear-gradient(to right, #82b4fd, #3e93fe); } /* .submit-button .hover-submit { background: rgb(175, 1, 1); } */ .radio-group { height: 100%; display: flex; align-items: center; color: #999; font-size: 28rpx; font-weight: 300; } .radio-group radio + radio { margin-left: 20rpx; } .small-radio { /* 确保文本不换行 */ white-space: nowrap; overflow: hidden; text-overflow: ellipsis; /* 如果文本过长,显示省略号 */ } .tip_bg{ position: absolute; overflow: hidden; top: 0; z-index: 9999; width: 100%; height: auto; padding-bottom: 40rpx; box-sizing: border-box; /* background: rgba(0, 0, 0, 0.6); */ background: #f7f7f7; /* display: flex; justify-content: center; */ } /* 新样式 */ .tip-top{ height: 433rpx; width: 100%; } .tip-top image { height: 433rpx; width: 100%; } .info-1 { width: 100%; /* margin-left: 20rpx; */ height: auto; z-index: 9999; position: relative; margin-top: -20rpx; /* background: red; */ } .info-2 { height: auto; width: calc(100% - 40rpx); margin-left: 20rpx; background: #FFFFFF; border-radius: 10rpx; margin-top: 20rpx; padding: 40rpx; box-sizing: border-box; } .info-2 .info-2-title { width: 100%; height: 54rpx; } .info-2 .info-2-title.top{ margin-top: 54rpx; } .info-2 .info-2-name{ font-size: 33rpx; font-weight: 800; color: #FEFEFE; line-height: 54rpx; position: absolute; margin-left: 24rpx; } .info-2 .info-2-title .tou{ width: 380rpx; height: 54rpx; } .info-2 .info-2-info{ margin-top: 38rpx; width: 100%; height: auto; font-size: 28rpx; font-weight: 500; color: #333333; line-height: 50rpx; } .list{ display: flex; } .list-name{ width: 40rpx } .list-cont{ width: calc(100% - 40rpx); } .end{ /* position: absolute; */ margin-top: 40rpx; width: 100%; height: 80rpx; bottom: 20rpx; display: flex; align-items: center; justify-content: center; } .end .end-but { text-align: center; border-radius: 50rpx; width: 350rpx; height: 80rpx; line-height: 80rpx; font-size: 30rpx; color: #fff; } .end .bg1 { background: #ffb2b5; } .end .bg2 { background: linear-gradient(to right, #f40f0f, #ff4c4c); } .info-1 image{ top: 0; width: 100%; height: 100%; position: absolute; z-index: 10; } .info-1 .top-c { padding: 44rpx 40rpx; box-sizing: border-box; position: inherit; /* position: absolute; */ z-index: 999; font-size: 28rpx; font-weight: 500; color: #333333; line-height: 50rpx; z-index: 99; height: 285rpx; } /* end */ .tip-info{ position: relative; border-radius: 10rpx; margin-top: 150rpx; z-index: 100; width: 80%; height: 950rpx; background: #fff; /* opacity: 1; */ } .tip-info .title{ padding: 30rpx 35rpx 10rpx 35rpx; box-sizing: border-box; position: relative; width: 100%; height: auto; text-align: center; line-height: 45rpx; font-size: 30rpx; } .tip-info .title .close{ position: absolute; width: 60rpx; height: 60rpx; background: red; top: 10rpx; right: 20rpx; } .tip-info .tip-content{ max-height: 650rpx; overflow-y: auto; width: 100%; height: auto; padding: 10rpx 30rpx; box-sizing: border-box; } .tip-info .tip-content .h1{ width: 100%; height: auto; font-size: 30rpx; line-height: 45rpx; font-weight: 600; } .tip-info .tip-content .h2{ width: 100%; height: auto; font-size: 26rpx; line-height: 45rpx; } .tip-info .tip-content .h3{ text-align: right; width: 100%; height: auto; font-size: 26rpx; line-height: 45rpx; } .sound-operate { display: flex; justify-content: center; align-items: center; margin: 40rpx 0 30rpx 0; } .sound-operate-del, .sound-operate-finish { width: 60rpx; height: 60rpx; } .sound-operate-del image, .sound-operate-finish image { display: block; width: 100%; height: 100%; } .sound-operate-btn { margin: 0 60rpx; } .sound-circel { width: 160rpx; height: 160rpx; box-sizing: border-box; background: #e9f2fe; border-radius: 50%; overflow: hidden; } .sound-circle-bd { width: 124rpx; height: 124rpx; box-sizing: border-box; margin: 18rpx auto; border: 16rpx solid #5e9fff; background-color: #5e9fff; overflow: hidden; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; } .sound-circle-bg { background: #5d9fff; } @-webkit-keyframes list { 0% { -webkit-transform: scaley(1); transform: scaley(1); } 50% { -webkit-transform: scaley(0.4); transform: scaley(0.4); } 100% { -webkit-transform: scaley(1); transform: scaley(1); } } @keyframes list { 0% { -webkit-transform: scaley(1); transform: scaley(1); } 50% { -webkit-transform: scaley(0.4); transform: scaley(0.4); } 100% { -webkit-transform: scaley(1); transform: scaley(1); } } .sound-play { display: flex; justify-content: center; align-items: center; height: 100%; } .sound-cancle { padding: 20rpx; font-size: 24rpx; color: #999999; text-align: right; } .sound-wrapper { margin-top: 80rpx; font-family: Source Han Serif SC; font-weight: 500; text-align: center; } .sound-time { width: 100%; text-align: center; font-size: 30rpx; color: #333333; line-height: 1; letter-spacing: 2rpx; } .sound-tips { font-size: 26rpx; color: #999999; text-align: center; } .sound-operate { display: flex; justify-content: center; align-items: center; margin: 40rpx 0 30rpx 0; } .sound-operate-del, .sound-operate-finish { width: 60rpx; height: 60rpx; } .sound-play .sound-play-item { background-color: #fff; width: 6rpx; height: 40rpx; border-radius: 6rpx; margin-right: 7rpx; -webkit-animation-fill-mode: both; animation-fill-mode: both; animation: list 1s 0s infinite cubic-bezier(0.85, 0.25, 0.37, 0.85); -webkit-border-radius: 6rpx; -moz-border-radius: 6rpx; -ms-border-radius: 6rpx; -o-border-radius: 6rpx; -webkit-animation: list 1s 0s infinite cubic-bezier(0.85, 0.25, 0.37, 0.85); } .sound-play .sound-play-item:nth-child(1) { -webkit-animation-delay: 0.1s !important; animation-delay: 0.1s !important; } .sound-play .sound-play-item:nth-child(2) { -webkit-animation-delay: 0.2s !important; animation-delay: 0.2s !important; } .sound-play .sound-play-item:nth-child(3) { -webkit-animation-delay: 0.3s !important; animation-delay: 0.3s !important; } .sound-play .sound-play-item:nth-child(4) { -webkit-animation-delay: 0.4s !important; animation-delay: 0.4s !important; } .sound-play-stop .sound-play-item { animation-play-state: paused; } .mkf-img{ display: flex; align-items: center; color: #999; font-size: 26rpx; font-family: PingFang SC; margin-top: 34rpx; } .mkf-img image{ width: 46rpx; height: 46rpx; margin-right: 9rpx; } .audio-play{ display: flex; justify-content: space-around; align-items: center; height: 90rpx; margin-top: 20rpx; border-radius: 20rpx; } .audio-play image{ width: 44rpx; height: 44rpx; } .audio-play .audio-play-left{ flex: 1; height: 100%; box-shadow: 1rpx 4rpx 20rpx 0rpx rgba(237,237,237,0.89); display: flex; align-items: center; padding: 0 20rpx; box-sizing: border-box; margin-right: 21rpx; } .backC{ background-color: #fff; } .audio-play .audio-play-left .audio-slider { width: 386rpx; margin: 0 auto; } .bto_btn{ display: flex; margin-top: 20rpx; padding: 0 20rpx 30rpx; } .btn_blue , .btn_yellow, .btn_red{ border-radius: 55rpx; box-sizing: border-box; color: #fff; width: fit-content; padding: 0rpx 80rpx; font-size: 23rpx; font-family: PingFang SC; font-weight: bold; } .btn_blue{ background: linear-gradient(87deg, #81B5FB 0%, #3E92FF 100%); } .btn_yellow{ margin-left: 20rpx !important; background: linear-gradient(87deg, #ecab8d 0%, #ecab8d 100%); } .btn_red{ background: linear-gradient(87deg, #f1560e 0%, #f1560e 100%); } .flex { display: flex!important; justify-content: flex-end; align-items: center; } .popup-content { max-height: 60vh; } .popup-content .card { border-radius: 20px; padding: 30rpx; box-sizing: border-box; background: #fff; margin-bottom: 30rpx; }