公司演示版e鹿悦游
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 

1108 lines
20 KiB

::v-deep .uni-select {
border: none !important;
}
::v-deep .uni-select__input-placeholder {
font-size: 32rpx;
color: #000;
padding-left: 24rpx;
}
::v-deep .uni-textarea-textarea {
font-size: 32rpx;
color: #000;
padding-left: 24rpx;
}
page {
background: #f5f6fa;
}
.row {
display: flex;
}
.wrap {
flex-wrap: wrap;
}
.col {
flex: 1;
}
.col-12 {
max-width: 50%;
-ms-flex: 0 0 50%;
flex: 0 0 50%;
}
.col-8 {
max-width: 33.333%;
-ms-flex: 0 0 33.333%;
flex: 0 0 33.333%;
}
.col-24 {
max-width: 100%;
-ms-flex: 0 0 100%;
flex: 0 0 100%;
}
.text-center {
text-align: center;
}
.flex-justify-center {
justify-content: center;
}
.flex-align-center {
align-items: center;
}
.container-fluid {
margin: 0 24rpx;
}
/* 页面 */
.v-pages-bg.bgcolor {
background: #f5f6fa;
}
.v-pages {
&.bgcolor {
background: #f5f6fa;
}
&.tab {
padding-top: 110rpx;
}
&.sort {
padding-top: 180rpx;
}
}
/* 页面标签切换 */
.v-tab-list {
position: fixed;
top: 0;
z-index: 99;
width: 100%;
box-sizing: border-box;
padding: 24rpx 24rpx 20rpx 24rpx;
background-color: #fff;
.tab-item {
position: relative;
text-align: center;
font-size: 30rpx;
color: #4d4d4d;
&.active {
color: #0983ff;
&::after {
content: '';
position: absolute;
left: 50%;
bottom: -12rpx;
width: 60rpx;
height: 5rpx;
transform: translate(-50%, 0);
border-radius: 5rpx;
background-color: #0983ff;
}
}
}
}
/* 页面 推荐 */
.v-pages-suggest {
.list_item {
.item_title {
margin-top: 8rpx;
height: 40rpx;
line-height: 40rpx;
color: #333333;
font-size: 28rpx;
font-weight: bold;
}
}
&.video {
margin-left: -24rpx;
.list_item {
position: relative;
flex: 0 0 450rpx;
width: 440rpx;
height: 320rpx;
overflow: hidden;
margin-left: 24rpx;
.item_image {
position: relative;
width: 440rpx;
height: 280rpx;
border-radius: 16rpx;
overflow: hidden;
&::after {
content: '';
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 60rpx;
height: 60rpx;
background: url('https://eluyou.ailuquan.cn/upload/image/2024/mapIcon/daolan/icon-video-play.png');
background-repeat: no-repeat;
background-size: contain;
}
.img {
width: 100%;
}
}
}
}
&.audio {
margin-left: -24rpx;
.list_item {
flex: 0 0 272rpx;
width: 272rpx;
height: 320rpx;
overflow: hidden;
margin-left: 24rpx;
.item_image {
position: relative;
width: 272rpx;
height: 272rpx;
border-radius: 16rpx;
overflow: hidden;
&::after {
content: '';
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 60rpx;
height: 60rpx;
background: url('https://eluyou.ailuquan.cn/upload/image/2024/mapIcon/daolan/icon-video-play.png');
background-repeat: no-repeat;
background-size: contain;
}
.img {
width: 100%;
}
}
}
}
}
// 页面 标题
.v-page-title {
padding: 0 24rpx;
margin-bottom: 20rpx;
.inner {
display: inline-block;
position: relative;
.text {
position: relative;
z-index: 9;
font-size: 36rpx;
font-weight: bold;
}
}
&.circle {
.inner {
display: inline-block;
position: relative;
&::after {
content: '';
position: absolute;
right: -10rpx;
top: -3rpx;
width: 30rpx;
height: 30rpx;
border-radius: 30rpx;
background: linear-gradient(to right, rgba(9, 131, 255, 0), rgba(9, 131, 255, 0.5));
}
}
}
}
// 卡片
.v-card {
position: relative;
z-index: 9;
box-sizing: border-box;
padding: 36rpx 24rpx;
background-color: #fff;
border-radius: 10rpx;
overflow: hidden;
&.small {
padding: 24rpx 20rpx;
}
}
.inline-block {
display: inline-block;
}
.v-card.detail {
.v-detail-top {
margin-bottom: 10rpx;
.postion {
margin-right: 20rpx;
padding: 0 20rpx 0 40rpx;
font-size: 24rpx;
color: #666666;
background-image: url('https://eluyou.ailuquan.cn/upload/image/2024/mapIcon/daolan/icon-address.png');
background-color: rgba(#0983ff, 0.05);
background-repeat: no-repeat;
background-position: 10rpx center;
background-size: 24rpx;
color: #0983ff;
font-size: 28rpx;
border-radius: 30rpx;
}
.tag {
background-color: rgba(#0983ff, 0.05);
color: #0983ff;
font-size: 28rpx;
padding: 0 20rpx;
border-radius: 30rpx;
}
}
.v-detail-name {
.text {
font-weight: bold;
font-size: 36rpx;
color: #1b1b1b;
}
.level.hotel {
margin-left: 10rpx;
/* 设置文本的背景为线性渐变 */
background: linear-gradient(to right, #ca8950 0%, #fbd8c5 50%, #73330b 80%);
-webkit-background-clip: text;
background-clip: text;
-webkit-text-fill-color: transparent;
text-fill-color: transparent;
font-size: 28rpx;
}
.level.scenic {
margin-left: 10rpx;
display: inline-block;
padding: 0 10rpx;
border-radius: 8rpx;
color: #0983ff;
font-size: 28rpx;
background-color: rgba(9, 131, 255, 0.05);
}
}
.v-detail-title {
.text {
position: relative;
display: inline-block;
font-size: 32rpx;
font-weight: bold;
color: #1b1b1b;
text {
position: relative;
z-index: 9;
}
&::after {
content: '';
position: absolute;
left: 0;
bottom: 0;
width: 100%;
height: 10rpx;
border-radius: 10rpx;
background: linear-gradient(to right, #fff, #0983ff);
}
}
}
.v-detail-tip {
.item {
display: inline-block;
padding: 0 8rpx;
margin-right: 12rpx;
border-radius: 4rpx;
font-size: 24rpx;
color: #0983ff;
background-color: rgba(9, 131, 255, 0.05);
}
}
/* 详情地址 */
.v-detail-address {
box-sizing: border-box;
padding: 24rpx;
height: 120rpx;
background: url('https://eluyou.ailuquan.cn/upload/image/2024/mapIcon/daolan/v-address-bg.png');
background-repeat: no-repeat;
background-size: cover;
border-radius: 20rpx;
overflow: hidden;
.sec_name_unit .cot_adr {
font-size: 26rpx;
font-weight: bold;
color: #1b1b1b;
}
.sec_name_unit .cot_gap {
font-size: 24rpx;
color: #666666;
}
.sec_btn_box .sec_item .icon {
width: 80rpx;
height: 80rpx;
margin-top: -10rpx;
}
.sec_btn_box .sec_item.map .icon {
width: 80rpx;
height: 80rpx;
background: url('https://eluyou.ailuquan.cn/upload/image/2024/mapIcon/daolan/v-address-map.png');
background-repeat: no-repeat;
background-position: center;
background-size: cover;
}
.sec_btn_box .sec_item.tel .icon {
background: url('https://eluyou.ailuquan.cn/upload/image/2024/mapIcon/daolan/v-address-tel.png');
background-repeat: no-repeat;
background-position: center;
background-size: cover;
}
.sec_btn_box .sec_item .text {
margin-top: -15rpx;
font-size: 20rpx;
text-align: center;
color: #1b1b1b;
}
}
/* 详情日期 */
.v-detail-date {
.start .date {
font-size: 36rpx;
}
.start .text {
font-size: 24rpx;
color: #666666;
}
.end .date {
font-size: 36rpx;
}
.end .text {
font-size: 24rpx;
color: #666666;
}
.arraw {
width: 30rpx;
height: 30rpx;
margin: 0 10rpx;
}
}
}
.v-card.order {
&.bg1 {
background: url('https://eluyou.ailuquan.cn/upload/image/2024/mapIcon/daolan/order-instructions_bg.png') #fff;
background-repeat: no-repeat;
background-position: top left;
background-size: 300rpx;
}
.v-order-wait {
position: absolute;
left: 0;
bottom: 0;
padding-left: 60rpx;
left: 0;
height: 60rpx;
line-height: 60rpx;
color: #0983ff;
font-size: 24rpx;
background: linear-gradient(to right, rgba(9, 131, 255, 0.1), #fff);
&:before {
content: '';
position: absolute;
left: 20rpx;
top: 50%;
transform: translate(0, -50%);
width: 28rpx;
height: 28rpx;
background: url('https://eluyou.ailuquan.cn/upload/image/2024/mapIcon/daolan/icon_tips.png');
background-repeat: no-repeat;
background-position: center;
background-size: 28rpx;
}
}
.v-order-title {
.text {
position: relative;
display: inline-block;
font-size: 36rpx;
font-weight: bold;
color: #1b1b1b;
text {
position: relative;
z-index: 9;
}
&::after {
content: '';
position: absolute;
left: 0;
bottom: 0;
width: 100%;
height: 10rpx;
border-radius: 10rpx;
background: linear-gradient(to right, #fff, #0983ff);
}
}
}
}
/* 页面列表 */
.v-pages-list {
box-sizing: border-box;
padding:0 24rpx;
&.bgfff {
background: #fff;
padding:12rpx 24rpx;
}
.list_item {
position: relative;
overflow: hidden;
margin: 24rpx 0;
.item_recommend {
position: absolute;
&.normal {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 40rpx;
padding: 0 20rpx 0 40rpx;
color: #fff;
z-index: 9;
line-height: 40rpx;
font-size: 24rpx;
background: linear-gradient(to right, rgba(224, 75, 0, 0.7), rgba(224, 75, 0, 0));
&:before {
content: '';
position: absolute;
left: 10rpx;
top: 50%;
transform: translate(0, -50%);
width: 24rpx;
height: 24rpx;
background: url('@/static/animg/daolan/icon-zan.png');
background-repeat: no-repeat;
background-size: cover;
}
}
&.big {
left: 0;
top: 0;
z-index: 9;
width: 70rpx;
height: 70rpx;
image {
width: 70rpx;
height: 70rpx;
}
}
&.hotel {
left: 0;
top: -2rpx;
z-index: 9;
width: 65rpx;
height: 30rpx;
image {
width: 65rpx;
height: 30rpx;
}
}
}
.item_image {
position: relative;
&.hotel {
flex: 0 0 200rpx;
width: 200rpx;
height: 240rpx;
border-radius: 12rpx;
overflow: hidden;
.img {
width: 200rpx;
height: 240rpx;
border-radius: 12rpx;
}
}
&.scenic {
flex: 0 0 180rpx;
width: 180rpx;
height: 180rpx;
border-radius: 12rpx;
overflow: hidden;
.img {
width: 180rpx;
height: 180rpx;
border-radius: 12rpx;
}
}
}
.item_content {
margin-left: 24rpx;
border-bottom: 1rpx solid #eeeeef;
.content-level {
font-size: 26rpx;
font-family: 'YouSheBiaoTiHei';
/* 设置文本的背景为线性渐变 */
background: linear-gradient(to right, #ca8950 0%, #fbd8c5 50%, #73330b 80%);
-webkit-background-clip: text;
background-clip: text;
-webkit-text-fill-color: transparent;
text-fill-color: transparent;
}
.content-name {
font-size: 30rpx;
font-weight: bold;
color: #1b1b1b;
}
.content-desc {
color: #666666;
font-size: 24rpx;
}
.content-wait {
position: relative;
padding-left: 40rpx;
color: #0983ff;
font-size: 24rpx;
&:before {
content: '';
position: absolute;
left: 0rpx;
top: 50%;
transform: translate(0, -50%);
width: 28rpx;
height: 28rpx;
background: url('https://eluyou.ailuquan.cn/upload/image/2024/mapIcon/daolan/icon_tips.png');
background-repeat: no-repeat;
background-position: center;
background-size: 28rpx;
}
}
.content-tip {
height: 40rpx;
overflow: hidden;
.item {
display: inline-block;
padding: 0 8rpx;
margin-right: 12rpx;
border-radius: 4rpx;
font-size: 24rpx;
color: #0983ff;
background-color: rgba(9, 131, 255, 0.05);
}
}
.content-address {
padding-left: 30rpx;
font-size: 24rpx;
color: #666666;
background: url('https://eluyou.ailuquan.cn/upload/image/2024/mapIcon/daolan/icon-address.png');
background-repeat: no-repeat;
background-position: left 4rpx;
background-size: 24rpx;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
}
.v-order-tip {
text {
color: #808080;
font-size: 24rpx;
}
}
.item-price {
position: absolute;
right: 0;
bottom: 20rpx;
.num_pr {
font-size: 24rpx;
color: #e02222;
}
.num_jd {
margin: 0 4rpx;
font-size: 40rpx;
color: #e02222;
font-weight: bold;
}
.num_qi {
font-size: 24rpx;
color: #666666;
}
.btn {
width: 160rpx;
height: 64rpx;
background: linear-gradient(-90deg, #0983ff, #57abff);
border-radius: 32rpx;
text-align: center;
line-height: 64rpx;
font-family: Source Han Sans SC;
font-weight: 500;
font-size: 26rpx;
color: #ffffff;
}
}
&.circle {
border-radius: 10rpx;
.item_image {
border-radius: 20rpx;
overflow: hidden;
.img {
border-radius: 20rpx;
overflow: hidden;
}
}
}
&.vertical {
.item_recommend.normal {
width: 200rpx;
}
.item_image {
width: 100%;
height: 380rpx;
.img {
width: 100%;
}
}
.item_content {
position: absolute;
width: 100%;
left: 0;
bottom: 0;
box-sizing: border-box;
padding: 20rpx;
margin-left: 0;
background: linear-gradient(to top, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0));
.content-name {
color: #fff;
}
.content-desc {
margin-top: 10rpx;
color: #fff;
display: -webkit-box;
-webkit-line-clamp: 1; /* 显示的行数 */
-webkit-box-orient: vertical;
overflow: hidden;
}
}
}
}
}
/* 页面搜索 */
.v-pages-search {
position: fixed;
top: 0;
z-index: 9;
width: 100%;
box-sizing: border-box;
padding: 24rpx 24rpx 20rpx 24rpx;
background-color: #fff;
border-bottom: 16rpx solid #f5f6fa;
.search_box {
height: 60rpx;
padding: 0 24rpx;
line-height: 60rpx;
border-radius: 60rpx;
background-color: rgba(245, 246, 250, 1);
.input {
height: 60rpx;
line-height: 60rpx;
font-size: 28rpx;
}
}
.btn_img {
height: 60rpx;
width: 60rpx;
text-align: center;
.img {
height: 30rpx;
width: 30rpx;
}
}
}
.v-card-form {
.form-item {
padding: 10rpx 20rpx 10rpx 36rpx;
.label {
font-size: 28rpx;
width: 160rpx;
flex: 0 0 160rpx;
font-weight: 600;
}
.info {
font-size: 28rpx;
}
&.time {
background: url('https://eluyou.ailuquan.cn/upload/image/2024/mapIcon/daolan/icon-time.png');
background-repeat: no-repeat;
background-position: left 16rpx;
background-size: 24rpx;
}
&.tel {
background: url('https://eluyou.ailuquan.cn/upload/image/2024/mapIcon/daolan/icon-tel.png');
background-repeat: no-repeat;
background-position: left 16rpx;
background-size: 24rpx;
}
&.discount {
background: url('https://eluyou.ailuquan.cn/upload/image/2024/mapIcon/daolan/icon-discount.png');
background-repeat: no-repeat;
background-position: left 16rpx;
background-size: 24rpx;
}
}
.form-item:not(:last-child) {
border-bottom: 1rpx solid #eeeeef;
margin-bottom: 10rpx;
}
}
.m-ticket-sort {
background-color: #fff;
&:not(:last-child) {
padding-bottom: 30rpx;
margin-bottom: 30rpx;
}
.m-sort-name {
font-family: Source Han Sans SC;
font-weight: bold;
font-size: 40rpx;
color: #1b1b1b;
margin-bottom: 24rpx;
padding: 0rpx 20rpx 0;
}
.ticket-item {
position: relative;
background: #f8f9fd;
border-radius: 20rpx;
padding: 20rpx 20rpx 30rpx 20rpx;
.ticket-rule {
.text {
font-size: 24rpx;
color: rgb(43, 137, 226);
}
.line {
margin: 0 8rpx;
font-size: 20rpx;
color: rgb(43, 137, 226);
}
}
.ticket-name {
display: flex;
justify-content: space-between;
flex-direction: column;
// align-items: center;
margin-bottom: 4rpx;
font-family: Source Han Sans SC;
font-weight: 500;
font-size: 32rpx;
color: #1b1b1b;
.ticket-type {
font-family: Source Han Sans SC;
font-weight: 400;
font-size: 20rpx;
color: #666666;
padding: 3rpx 5rpx;
border-radius: 8rpx;
border: 1px solid #e9e9e9;
}
}
.ticket-tag {
font-family: Source Han Sans SC;
font-weight: 500;
font-size: 24rpx;
color: #0983ff;
margin-bottom: 20rpx;
}
.ticket-tips {
position: absolute;
bottom: 20rpx;
right: 20rpx;
.left {
font-family: Source Han Sans SC;
font-weight: 500;
font-size: 24rpx;
color: #ff7f00;
}
.ticket-price {
font-family: Source Han Sans SC;
font-weight: bold;
font-size: 38rpx;
color: #ff404c;
margin-left: 20rpx;
.m-danwei {
font-size: 28rpx;
}
}
.decoration {
text-decoration: line-through;
}
}
.btn-box {
display: flex;
justify-content: flex-end;
.m-btn {
width: 160rpx;
height: 64rpx;
background: linear-gradient(-90deg, #0983ff, #57abff);
border-radius: 32rpx;
text-align: center;
line-height: 64rpx;
font-family: Source Han Sans SC;
font-weight: 500;
font-size: 26rpx;
color: #ffffff;
}
.m-btn-hover {
background: linear-gradient(-90deg, #57abff, #0983ff);
}
}
}
.ticket-item:not(:last-child) {
margin-bottom: 24rpx;
}
}
.v-form-content {
font-size: 28rpx;
}
.v-hotel-date-total {
font-size: 24rpx;
color: #0983ff;
}
::v-deep .uni-forms-item {
margin-bottom: 5rpx !important;
}
::v-deep .uni-forms-item__error {
left: 20rpx;
top: 60% !important;
}
/* 订单表单 */
.v-order-form {
::v-deep .uni-forms-item__label {
height: 60rpx;
line-height: 60rpx;
}
.uni-easyinput__content-input {
height: 60rpx;
line-height: 60rpx;
}
.v-input {
height: 60rpx;
line-height: 60rpx;
font-size: 28rpx;
.uni-easyinput__placeholder-class {
font-size: 28rpx;
}
}
.v-form-content {
color: #333333;
font-size: 28rpx;
}
.v-form-date {
.start .date {
font-size: 34rpx;
font-weight: bold;
}
.start .text {
font-size: 24rpx;
color: #666666;
}
.end .date {
font-size: 34rpx;
font-weight: bold;
}
.end .text {
font-size: 24rpx;
color: #666666;
}
.mid {
position: relative;
border: 1rpx solid #0983ff;
padding: 0 8rpx;
height: 30rpx;
line-height: 30rpx;
border-radius: 30rpx;
margin: 0 30rpx;
font-size: 20rpx;
color: #0983ff;
&::before,
&::after {
content: '';
position: absolute;
top: 50%;
transform: translate(0, -50%);
width: 20rpx;
height: 1rpx;
background-color: #0983ff;
}
&::before {
left: -20rpx;
}
&::after {
right: -20rpx;
}
}
}
.v-order-title {
font-size: 30rpx;
font-weight: bold;
color: #1b1b1b;
}
.v-order-tip {
text {
color: #808080;
font-size: 24rpx;
}
}
}
/* 订单提交 */
.v-order-submit {
box-sizing: border-box;
position: fixed;
bottom: 0;
left: 0;
z-index: 9;
width: 100%;
height: 120rpx;
padding: 0 40rpx;
background-color: #fff;
.price {
line-height: 100rpx;
.text {
font-weight: bold;
color: #666666;
font-size: 24rpx;
}
.yuan {
margin-left: 8rpx;
color: #e02222;
font-size: 28rpx;
}
.number {
color: #e02222;
font-size: 50rpx;
}
}
.btn {
height: 80rpx;
padding: 0 40rpx;
line-height: 80rpx;
border-radius: 80rpx;
color: #fff;
background: linear-gradient(to right, #0983ff, #57abff);
}
}
.v-order-bottom {
box-sizing: border-box;
position: fixed;
bottom: 0;
left: 0;
z-index: 9;
width: 100%;
height: 100rpx;
padding: 10rpx 40rpx;
background-color: #fff;
.btn {
height: 80rpx;
padding: 0 40rpx;
line-height: 80rpx;
border-radius: 80rpx;
color: #fff;
text-align: center;
background: linear-gradient(to right, #0983ff, #57abff);
}
}
/* 头部滚动 */
.v-swiper {
height: 400rpx;
.swiper_item {
position: relative;
height: 400rpx;
overflow: hidden;
.item-image {
width: 100%;
}
}
}
.m-t--80 {
margin-top: -80rpx !important;
}
.m-t-40 {
margin-top: 40rpx !important;
}
.m-l-24 {
margin-left: 24rpx !important;
}
.m-l-10 {
margin-left: 10rpx !important;
}
.m-t-24 {
margin-top: 24rpx !important;
}
.m-b-24 {
margin-top: 24rpx !important;
}
.m-t-12 {
margin-top: 12rpx !important;
}
.m-t-6 {
margin-top: 6rpx !important;
}
.p-t-24 {
padding-top: 24rpx !important;
}
.p-b-24 {
padding-bottom: 24rpx !important;
}
.p-b-60 {
padding-bottom: 120rpx !important;
}
.p-l-24 {
padding-left: 24rpx !important;
}
.p-r-24 {
padding-right: 24rpx !important;
}
.v-detail-content {
img {
width: 100%;
}
}