1428 lines
72 KiB
Vue
1428 lines
72 KiB
Vue
|
<template>
|
|||
|
<view class="customizate">
|
|||
|
<!-- 头部 -->
|
|||
|
<cover-view class="fix">
|
|||
|
<cover-view class="c_main c_main1">
|
|||
|
<cover-image src="https://weiapi.youbeiw.top/images/customizate/head_bg.png"
|
|||
|
class="head_bg"></cover-image>
|
|||
|
<!-- <cover-view class="flex head_list">
|
|||
|
<cover-view class="item active" @click="changeTab(1)">
|
|||
|
赠送版
|
|||
|
</cover-view>
|
|||
|
<cover-view class="item" @click="changeTab(2)">
|
|||
|
专业版
|
|||
|
</cover-view>
|
|||
|
</cover-view> -->
|
|||
|
<cover-view class="flex pd info">
|
|||
|
<cover-view class="people">
|
|||
|
<cover-image src="https://weiapi.youbeiw.top/images/customizate/head.png" mode="widthFix"
|
|||
|
class="head"></cover-image>
|
|||
|
<cover-view class="cut">
|
|||
|
<cover-image src="https://weiapi.youbeiw.top/images/customizate/cut.png" mode="widthFix"
|
|||
|
class="cut_img"></cover-image>
|
|||
|
</cover-view>
|
|||
|
</cover-view>
|
|||
|
<cover-view class="right">
|
|||
|
<cover-view class="flex top">
|
|||
|
<cover-view class="name">李小懒晚上好</cover-view>
|
|||
|
<cover-view class="weather">广州丨晴 15~27℃</cover-view>
|
|||
|
</cover-view>
|
|||
|
<cover-view class="flex bottom">
|
|||
|
2023年11月25日
|
|||
|
<cover-image src="https://weiapi.youbeiw.top/images/customizate/down_icon.png"
|
|||
|
mode="widthFix" class="down_icon"></cover-image>
|
|||
|
</cover-view>
|
|||
|
</cover-view>
|
|||
|
</cover-view>
|
|||
|
</cover-view>
|
|||
|
</cover-view>
|
|||
|
<!-- 日历 -->
|
|||
|
<view class="c_main c_mainBg mb c_main2">
|
|||
|
<view class="calendar">
|
|||
|
<!-- viewType="week" -->
|
|||
|
<ren-calendar ref="ren" :open="false" :markDays='markDays' :headerBar='false'
|
|||
|
@onDayClick='selectCalend'></ren-calendar>
|
|||
|
<!-- <calendar calendarConfig="{{calendarConfig}}"></calendar> -->
|
|||
|
<!-- <uni-calendar :insert="true" :lunar="true" :start-date="'1950-1-1'" @change="selectCalend" /> -->
|
|||
|
</view>
|
|||
|
<view class="down">
|
|||
|
<view class="down_child" @click="onSwitchView">
|
|||
|
展开
|
|||
|
<image :class="`${weekMode ? '':'xz'}`"
|
|||
|
src="https://weiapi.youbeiw.top/images/customizate/calendar_down_icon.png" mode="widthFix">
|
|||
|
</image>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
<!-- 今日运势 -->
|
|||
|
<view class="c_main c_mainBg mb c_main3">
|
|||
|
<view class="flex top">
|
|||
|
<view class="number">25</view>
|
|||
|
<view class="right">
|
|||
|
<view class="title">兔年农历十月十三</view>
|
|||
|
<view class="flex r3_list">
|
|||
|
<view class="r3_item">癸卯年</view>
|
|||
|
<view class="r3_item">类亥月</view>
|
|||
|
<view class="r3_item">丁亥日</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
<view class="flex bottom">
|
|||
|
<view class="flex left">
|
|||
|
<view class="name">小雪</view>
|
|||
|
<view class="day">第04天</view>
|
|||
|
</view>
|
|||
|
<view class="right">
|
|||
|
谨小慎微才能避免大祸
|
|||
|
<image class="right_icon" src="https://weiapi.youbeiw.top/images/customizate/right_icon.png"
|
|||
|
mode="widthFix"></image>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
<!-- 今日运程总分 -->
|
|||
|
<view class="c_main c_mainBg pd mb c_main4">
|
|||
|
<view class="com_title">今日运程总分</view>
|
|||
|
<view class="flex info">
|
|||
|
<view class="echart" id="echart1" ref="echart1">
|
|||
|
<!-- <ec-canvas id="dispace_charts" canvas-id="dispace_charts" force-use-old-canvas="true" ec="{{ ec_dispace_charts }}"></ec-canvas> -->
|
|||
|
</view>
|
|||
|
<view class="list">
|
|||
|
<view class="flex item" v-for="(item,index) in haulList" :key="item.id">
|
|||
|
<view class="name">{{item.name}}</view>
|
|||
|
<view class="progressBox">
|
|||
|
<view class="progressChild">
|
|||
|
<progress border-radius="15" :activeColor="item.color" :percent="item.progress" active
|
|||
|
stroke-width="8" class="progress" />
|
|||
|
</view>
|
|||
|
<view class="p_icon" :style="`border-top-color:${item.color};left: ${item.progress}%;`">
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
<view class="tips">{{item.tips}}</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
<!-- 今日师傅点评-赠送版 -->
|
|||
|
<view class="c_main c_mainBg pd mb c_main5">
|
|||
|
<view class="com_title">今日师傅点评-简易版</view>
|
|||
|
<view class="r_list r_listSimple">
|
|||
|
<view class="r_text">{{remarkList[0].text}}</view>
|
|||
|
<view class="r_bg"></view>
|
|||
|
<view class="btnBox_postion">
|
|||
|
<view class="anima btnBox">
|
|||
|
<image class="btn" src="https://weiapi.youbeiw.top/images/customizate/btn.png" mode="widthFix">
|
|||
|
</image>
|
|||
|
<view class="wz">升级专业版</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
<!-- 会员-赠送版 -->
|
|||
|
<view class="c_main c_mainBg pd mb member_infoBox">
|
|||
|
<view class="flex member_info">
|
|||
|
<view class="flex left">
|
|||
|
<image class="crown" src="https://weiapi.youbeiw.top/images/customizate/crown.png" mode="widthFix">
|
|||
|
</image>
|
|||
|
<view class="text">剩余多项特权未解锁</view>
|
|||
|
</view>
|
|||
|
<view class="btn">立即解锁</view>
|
|||
|
</view>
|
|||
|
<view class="member_info1">
|
|||
|
<view class="title">
|
|||
|
解锁完整内容,立享
|
|||
|
<view class="point">四大专属内容</view>
|
|||
|
</view>
|
|||
|
<view class="flex m_list">
|
|||
|
<view class="m_item" v-for="(item,index) in memberList" :key="item.id">
|
|||
|
<image class="exclusive_icon" :src="item.img" mode="widthFix"></image>
|
|||
|
<view class="name">{{item.name}}</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
<view class="h_info">
|
|||
|
<view class="recomBtn">推荐解锁</view>
|
|||
|
<view class="flex h_info_child">
|
|||
|
<image class="oldPerson" src="https://weiapi.youbeiw.top/images/customizate/oldPerson.png"
|
|||
|
mode="widthFix"></image>
|
|||
|
<view class="personText">
|
|||
|
<view class="personTit">专业版</view>
|
|||
|
<text class="personTip">时辰运势
|
|||
|
每日详评
|
|||
|
穿搭推荐
|
|||
|
食物推荐
|
|||
|
</text>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
<image class="anima textBtn" src="https://weiapi.youbeiw.top/images/customizate/textBtn.png"
|
|||
|
mode="widthFix"></image>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
<!-- 今日时间宜忌-赠送版 -->
|
|||
|
<view class="c_main c_mainBg mb pd c_mainMember1">
|
|||
|
<view class="com_title">今日时间宜忌</view>
|
|||
|
<view class="s_table">
|
|||
|
<view class="flex s_tableItem" v-for="(item,index) in suitableList" :key="item.id">
|
|||
|
<view class="title">{{item.title}}</view>
|
|||
|
<view class="right">
|
|||
|
<view class="flex right_i1" v-for="(child,childId) in item.child" :key="child.childId">
|
|||
|
<image class="textBtn" :src="child.name" mode="widthFix"></image>
|
|||
|
<view class="flex right_list">
|
|||
|
<view :class="`right_item right_item${child.childId}`"
|
|||
|
v-for="(smallChild,smallChildId) in child.info" :key="smallChildId">{{smallChild}}
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
<view class="flex s_info">
|
|||
|
<image class="oldPersonHead" src="https://weiapi.youbeiw.top/images/customizate/oldPersonHead.png"
|
|||
|
mode="widthFix"></image>
|
|||
|
<view class="teacher_text">
|
|||
|
<view class="name">师傅推荐升级专业版</view>
|
|||
|
<text class="text">你想预测今天12个时辰
|
|||
|
你的运势分别如何嘛</text>
|
|||
|
</view>
|
|||
|
<view class="btn">升级专业版解锁</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
<!-- 历史上的今天 -->
|
|||
|
<view class="c_main c_mainBg pd c_main11">
|
|||
|
<view class="flex com_title">
|
|||
|
<view class="name">历史上的今天</view>
|
|||
|
<view class="more">更多<image class="rightIcon"
|
|||
|
src="https://weiapi.youbeiw.top/images/customizate/right_icon.png" mode="widthFix"></image>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
<view class="h_list">
|
|||
|
<view class="flex h_item" v-for="(item,index) in historyList" :key="item.id">
|
|||
|
<view class="title">{{item.title}}</view>
|
|||
|
<view class="text">{{item.text}}</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
<!-- 今日师傅点评-专业版 -->
|
|||
|
<view class="c_main c_mainBg pd c_main5 c_mainMember2" v-if="currentTab==1">
|
|||
|
<view class="com_title">今日师傅点评-专业版</view>
|
|||
|
<view class="r_list">
|
|||
|
<view class="r_item" v-for="(item,index) in remarkList" :key="item.id">
|
|||
|
<view class="r_title" :style="`background-color: ${item.color}`">
|
|||
|
{{item.title}}
|
|||
|
</view>
|
|||
|
<view class="r_text">
|
|||
|
{{item.text}}
|
|||
|
</view>
|
|||
|
<view class="r_bg"></view>
|
|||
|
<view class="btnBox_postion">
|
|||
|
<view class="anima btnBox">
|
|||
|
<image class="btn" src="https://weiapi.youbeiw.top/images/customizate/btn.png"
|
|||
|
mode="widthFix">
|
|||
|
</image>
|
|||
|
<view class="wz">立即解锁专业版</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</template>
|
|||
|
|
|||
|
<script>
|
|||
|
import RenCalendar from '@/components/ren-calendar/ren-calendar.vue'
|
|||
|
export default {
|
|||
|
data() {
|
|||
|
return {
|
|||
|
curDate: '',
|
|||
|
markDays: [],
|
|||
|
weekMode: true,
|
|||
|
currentTab: 1,
|
|||
|
haulList: [{ //今日运程总分
|
|||
|
name: '综合',
|
|||
|
progress: '70',
|
|||
|
tips: '顺风顺水',
|
|||
|
color: '#567AFF',
|
|||
|
id: 1,
|
|||
|
}, {
|
|||
|
name: '感情',
|
|||
|
progress: '85',
|
|||
|
tips: '甜蜜无间',
|
|||
|
color: '#F35D6A',
|
|||
|
id: 2,
|
|||
|
}, {
|
|||
|
name: '财富',
|
|||
|
progress: '50',
|
|||
|
tips: '有气无力',
|
|||
|
color: '#F3C05D',
|
|||
|
id: 3,
|
|||
|
}],
|
|||
|
remarkList: [{ //今日师傅点评
|
|||
|
title: '今日感情',
|
|||
|
text: '今天你的感情运还算不错,喜欢的人或许会主动联系你,问你有没有时间出来一起吃个饭,虽然你表面上没有什么反应,其实内心早就乐开了花,让你期待与对方的相聚,也可以趁这个机会去更近一步了解彼此,增进两人的关系。在这里灵妹妹建议你,可以提前准备一些小礼物送给对方,不需要太昂贵,如果是亲手做的将更有意义,关系也能更近一步。',
|
|||
|
color: '#516EFF',
|
|||
|
id: 1,
|
|||
|
}, {
|
|||
|
title: '今日财运',
|
|||
|
text: '今天你的事业运较差,做什么都不在状态,也没什么精气神,可能是昨晚熬夜赶任务,导致你今天整个人有点混乱,情绪不稳,这个时候可以先放下手中活,泡杯咖啡,放松一下心情,不然再继续也是无用功;如果是找工作的状态,那么最好能找准领域,不要太分散,否则会更加迷茫。在这里灵妹妹提醒你,对待工作要全身心的投入,才能保证工作的质量,不断的提高自己的职能,才能让自己在当今社会立于不败之地。',
|
|||
|
color: '#F64747',
|
|||
|
id: 2,
|
|||
|
}, {
|
|||
|
title: '综合点评',
|
|||
|
text: '今天的你相当冷静、有力量,清醒的头脑让你能看透很多事情,有很多自己想法,并且能得同事及上司的欣赏。职场上坚定的态度让你能采取措施排除困难、完成目标。今天亦适合与你的伴侣或挚友深入的沟通,你们之间的羁绊会变得更深,关系也将会更加稳定的向前发展,感情也会越来越深。',
|
|||
|
color: '#6D6060',
|
|||
|
id: 3,
|
|||
|
}],
|
|||
|
historyList: [{
|
|||
|
id: 1,
|
|||
|
title: '时间',
|
|||
|
text: '2023年11月 农历十月十四'
|
|||
|
}, {
|
|||
|
id: 2,
|
|||
|
title: '656年',
|
|||
|
text: '唐朝皇帝唐中宗李显出生'
|
|||
|
}, {
|
|||
|
id: 3,
|
|||
|
title: '1161年',
|
|||
|
text: '金朝与南宋发生采石之战'
|
|||
|
}, {
|
|||
|
id: 4,
|
|||
|
title: '1504年',
|
|||
|
text: '西班牙卡斯提亚女王伊莎贝拉一世逝安'
|
|||
|
}],
|
|||
|
memberList: [{
|
|||
|
id: 1,
|
|||
|
name: '时辰运势 ',
|
|||
|
img: 'https://weiapi.youbeiw.top/images/customizate/exclusive_icon1.png'
|
|||
|
}, {
|
|||
|
id: 2,
|
|||
|
name: '每日详评 ',
|
|||
|
img: 'https://weiapi.youbeiw.top/images/customizate/exclusive_icon2.png'
|
|||
|
}, {
|
|||
|
id: 3,
|
|||
|
name: '穿搭推荐 ',
|
|||
|
img: 'https://weiapi.youbeiw.top/images/customizate/exclusive_icon3.png'
|
|||
|
}, {
|
|||
|
id: 4,
|
|||
|
name: '食物推荐 ',
|
|||
|
img: 'https://weiapi.youbeiw.top/images/customizate/exclusive_icon4.png'
|
|||
|
}],
|
|||
|
suitableList: [{ //今日忌宜
|
|||
|
id: 1,
|
|||
|
title: '传统',
|
|||
|
child: [{
|
|||
|
childId: 1,
|
|||
|
name: 'https://weiapi.youbeiw.top/images/customizate/icon1.png',
|
|||
|
info: ["结婚", "打扫卫生", "打扫", "结婚", "打扫卫生", "打扫"]
|
|||
|
},
|
|||
|
{
|
|||
|
childId: 2,
|
|||
|
name: 'https://weiapi.youbeiw.top/images/customizate/icon2.png',
|
|||
|
info: ["安门", "出行旅游", "游玩", "结婚", "打扫卫生", "打扫"]
|
|||
|
}
|
|||
|
]
|
|||
|
}, {
|
|||
|
id: 2,
|
|||
|
title: '日常',
|
|||
|
child: [{
|
|||
|
childId: 1,
|
|||
|
name: 'https://weiapi.youbeiw.top/images/customizate/icon1.png',
|
|||
|
info: ["结婚", "打扫卫生", "打扫", "结婚", "打扫卫生", "打扫"]
|
|||
|
},
|
|||
|
{
|
|||
|
childId: 2,
|
|||
|
name: 'https://weiapi.youbeiw.top/images/customizate/icon2.png',
|
|||
|
info: ["安门", "出行旅游", "游玩", "结婚", "打扫卫生", "打扫"]
|
|||
|
}
|
|||
|
]
|
|||
|
}]
|
|||
|
}
|
|||
|
},
|
|||
|
components: {
|
|||
|
RenCalendar
|
|||
|
},
|
|||
|
onLaunch: function() {},
|
|||
|
onLoad() {},
|
|||
|
mounted() {
|
|||
|
var _that = this;
|
|||
|
let today = this.$refs.ren.getToday().date;
|
|||
|
this.curDate = today;
|
|||
|
this.markDays.push(today);
|
|||
|
},
|
|||
|
methods: {
|
|||
|
selectCalend(option) {
|
|||
|
this.curDate = option.date;
|
|||
|
},
|
|||
|
changeTab(val) {
|
|||
|
this.$emit('changeTabs', {
|
|||
|
currentTab: val
|
|||
|
})
|
|||
|
},
|
|||
|
onSwitchView() {
|
|||
|
uni.navigateTo({
|
|||
|
url: '/pages/almanac/index'
|
|||
|
})
|
|||
|
},
|
|||
|
},
|
|||
|
onShow: function() {},
|
|||
|
onHide: function() {}
|
|||
|
}
|
|||
|
</script>
|
|||
|
<script module="echarts" lang="renderjs">
|
|||
|
import * as echarts from 'echarts' // 引入ECharts库
|
|||
|
import 'echarts-liquidfill'
|
|||
|
let angle = 0; //角度,用来做简单的动画效果的
|
|||
|
export default {
|
|||
|
data() {
|
|||
|
return {
|
|||
|
chart: null,
|
|||
|
}
|
|||
|
},
|
|||
|
mounted() {
|
|||
|
// 今日运程
|
|||
|
var _that = this;
|
|||
|
angle = angle + 3;
|
|||
|
var dispaceData = {
|
|||
|
value: [0.5, 0.3, 0.4],
|
|||
|
centerValue: 30,
|
|||
|
}
|
|||
|
this.initCharts(0, document.getElementById('echart1'), dispaceData);
|
|||
|
setInterval(function() {
|
|||
|
if (_that.chart) {
|
|||
|
angle = angle + 3;
|
|||
|
_that.chart.setOption(_that.setOption(dispaceData));
|
|||
|
}
|
|||
|
}, 100);
|
|||
|
},
|
|||
|
methods: {
|
|||
|
getCirlPoint(x0, y0, r, angle) {
|
|||
|
let x1 = x0 + r * Math.cos((angle * Math.PI) / 180);
|
|||
|
let y1 = y0 + r * Math.sin((angle * Math.PI) / 180);
|
|||
|
return {
|
|||
|
x: x1,
|
|||
|
y: y1,
|
|||
|
};
|
|||
|
},
|
|||
|
initCharts: function(type, element, value) {
|
|||
|
// 获取组件的 canvas、width、height 后的回调函数
|
|||
|
// 在这里初始化图表
|
|||
|
var _that = this;
|
|||
|
_that.chart = echarts.init(element);
|
|||
|
if (type === 0) {
|
|||
|
_that.chart.setOption(_that.setOption(value));
|
|||
|
}
|
|||
|
},
|
|||
|
setOption(options) {
|
|||
|
var _that = this;
|
|||
|
var option = {
|
|||
|
backgroundColor: "#fff",
|
|||
|
graphic: [{
|
|||
|
type: "group",
|
|||
|
left: "center",
|
|||
|
top: "68%",
|
|||
|
children: [{
|
|||
|
type: "text",
|
|||
|
z: 100,
|
|||
|
left: "10",
|
|||
|
top: "middle",
|
|||
|
style: {
|
|||
|
fill: "#fff",
|
|||
|
text: "今日得分",
|
|||
|
font: "10px Microsoft YaHei",
|
|||
|
},
|
|||
|
}, ],
|
|||
|
}, ],
|
|||
|
series: [{
|
|||
|
name: "ring5",
|
|||
|
type: "custom",
|
|||
|
coordinateSystem: "none",
|
|||
|
renderItem: function(params, api) {
|
|||
|
return {
|
|||
|
type: "arc",
|
|||
|
shape: {
|
|||
|
cx: api.getWidth() / 2,
|
|||
|
cy: api.getHeight() / 2,
|
|||
|
r: Math.min(api.getWidth(), api.getHeight()) / 2.1,
|
|||
|
startAngle: ((270 + -angle) * Math.PI) / 180,
|
|||
|
endAngle: ((40 + -angle) * Math.PI) / 180,
|
|||
|
},
|
|||
|
style: {
|
|||
|
stroke: "#fd5361",
|
|||
|
fill: "transparent",
|
|||
|
lineWidth: 1.5,
|
|||
|
},
|
|||
|
silent: true,
|
|||
|
};
|
|||
|
},
|
|||
|
data: [0],
|
|||
|
},
|
|||
|
{
|
|||
|
name: "ring5",
|
|||
|
type: "custom",
|
|||
|
coordinateSystem: "none",
|
|||
|
renderItem: function(params, api) {
|
|||
|
return {
|
|||
|
type: "arc",
|
|||
|
shape: {
|
|||
|
cx: api.getWidth() / 2,
|
|||
|
cy: api.getHeight() / 2,
|
|||
|
r: Math.min(api.getWidth(), api.getHeight()) / 2.1,
|
|||
|
startAngle: ((90 + -angle) * Math.PI) / 180,
|
|||
|
endAngle: ((220 + -angle) * Math.PI) / 180,
|
|||
|
},
|
|||
|
style: {
|
|||
|
stroke: "#fd5361",
|
|||
|
fill: "transparent",
|
|||
|
lineWidth: 1.5,
|
|||
|
},
|
|||
|
silent: true,
|
|||
|
};
|
|||
|
},
|
|||
|
data: [0],
|
|||
|
},
|
|||
|
{
|
|||
|
name: "ring5",
|
|||
|
type: "custom",
|
|||
|
coordinateSystem: "none",
|
|||
|
renderItem: function(params, api) {
|
|||
|
let x0 = api.getWidth() / 2;
|
|||
|
let y0 = api.getHeight() / 2;
|
|||
|
let r = Math.min(api.getWidth(), api.getHeight()) / 2.1;
|
|||
|
let point = _that.getCirlPoint(x0, y0, r, 90 + -angle);
|
|||
|
return {
|
|||
|
type: "circle",
|
|||
|
shape: {
|
|||
|
cx: point.x,
|
|||
|
cy: point.y,
|
|||
|
r: 2,
|
|||
|
},
|
|||
|
style: {
|
|||
|
stroke: "#fd5361", //粉
|
|||
|
fill: "#fd5361",
|
|||
|
},
|
|||
|
};
|
|||
|
},
|
|||
|
data: [0],
|
|||
|
},
|
|||
|
{
|
|||
|
name: "ring5", //绿点
|
|||
|
type: "custom",
|
|||
|
coordinateSystem: "none",
|
|||
|
renderItem: function(params, api) {
|
|||
|
let x0 = api.getWidth() / 2;
|
|||
|
let y0 = api.getHeight() / 2;
|
|||
|
let r = Math.min(api.getWidth(), api.getHeight()) / 2.1;
|
|||
|
let point = _that.getCirlPoint(x0, y0, r, 270 + -angle);
|
|||
|
return {
|
|||
|
type: "circle",
|
|||
|
shape: {
|
|||
|
cx: point.x,
|
|||
|
cy: point.y,
|
|||
|
r: 2,
|
|||
|
},
|
|||
|
style: {
|
|||
|
stroke: "#fd5361", //绿
|
|||
|
fill: "#fd5361",
|
|||
|
},
|
|||
|
silent: true,
|
|||
|
};
|
|||
|
},
|
|||
|
data: [0],
|
|||
|
},
|
|||
|
{
|
|||
|
type: "liquidFill",
|
|||
|
radius: "85%",
|
|||
|
center: ["50%", "50%"],
|
|||
|
color: ["#ff9c8f", "#ff7d6a", "#ff4e59"], //水波
|
|||
|
data: options.value, // data个数代表波浪数
|
|||
|
label: {
|
|||
|
normal: {
|
|||
|
formatter: function() {
|
|||
|
return options.centerValue;
|
|||
|
},
|
|||
|
position: [40, 30],
|
|||
|
color: "#ec2f3f",
|
|||
|
insideColor: "#ec2f3f",
|
|||
|
textStyle: {
|
|||
|
fontSize: 46,
|
|||
|
fontWeight: "bold",
|
|||
|
fontFamily: "FZLTCHJW",
|
|||
|
},
|
|||
|
|
|||
|
},
|
|||
|
},
|
|||
|
outline: {
|
|||
|
borderDistance: 0,
|
|||
|
itemStyle: {
|
|||
|
isShow: true,
|
|||
|
borderColor: "#ffecee",
|
|||
|
borderWidth: 10,
|
|||
|
// shadowBlur: 8,
|
|||
|
shadowColor: "#ffecee",
|
|||
|
},
|
|||
|
},
|
|||
|
itemStyle: {
|
|||
|
opacity: 0.95,
|
|||
|
shadowColor: "rgba(0, 0, 0, 0)",
|
|||
|
},
|
|||
|
backgroundStyle: {
|
|||
|
borderWidth: 8,
|
|||
|
borderColor: "#fedcde",
|
|||
|
color: "#fedcde",
|
|||
|
},
|
|||
|
},
|
|||
|
],
|
|||
|
};
|
|||
|
return option
|
|||
|
},
|
|||
|
}
|
|||
|
}
|
|||
|
</script>
|
|||
|
<style lang="scss" scoped>
|
|||
|
.customizate {
|
|||
|
min-height: 100vh;
|
|||
|
background-color: #EDEDED;
|
|||
|
padding-bottom: 20rpx;
|
|||
|
line-height: 1.8;
|
|||
|
padding-top: 260rpx;
|
|||
|
box-sizing: border-box;
|
|||
|
|
|||
|
/deep/uni-cover-view {
|
|||
|
overflow: inherit !important;
|
|||
|
}
|
|||
|
|
|||
|
/deep/.uni-progress-inner-bar {
|
|||
|
border-radius: 15rpx;
|
|||
|
}
|
|||
|
|
|||
|
/deep/.weektoggle {
|
|||
|
display: none;
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
.customizate .fix {
|
|||
|
position: fixed;
|
|||
|
top: -150rpx;
|
|||
|
left: 0px;
|
|||
|
width: 100%;
|
|||
|
z-index: 10000000;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .flex {
|
|||
|
display: flex;
|
|||
|
align-items: center;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .pd {
|
|||
|
padding: 0px 30rpx;
|
|||
|
box-sizing: border-box;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .mb {
|
|||
|
margin-bottom: 20rpx;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_mainBg {
|
|||
|
background-color: #FFFFFF;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main1 {
|
|||
|
width: 100%;
|
|||
|
background-color: #C13636;
|
|||
|
position: relative;
|
|||
|
overflow: hidden;
|
|||
|
padding-bottom: 50rpx;
|
|||
|
box-sizing: border-box;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main1 .head_bg {
|
|||
|
position: absolute;
|
|||
|
right: 0px;
|
|||
|
top: 0px;
|
|||
|
width: 252rpx;
|
|||
|
height: 390rpx;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main1 .head_list {
|
|||
|
padding-top: 70rpx;
|
|||
|
padding-bottom: 50rpx;
|
|||
|
padding-left: 160rpx;
|
|||
|
z-index: 10000;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main1 .item {
|
|||
|
font-size: 38rpx;
|
|||
|
font-family: FZRUIZH_CUJW;
|
|||
|
font-weight: normal;
|
|||
|
font-style: italic;
|
|||
|
color: #E98F8F;
|
|||
|
margin: 0px 40rpx;
|
|||
|
z-index: 10000;
|
|||
|
line-height: 50rpx;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main1 .item.active {
|
|||
|
font-size: 36rpx;
|
|||
|
font-family: SourceHanSansCN;
|
|||
|
font-weight: bold;
|
|||
|
font-style: normal;
|
|||
|
color: #EDEDED;
|
|||
|
position: relative;
|
|||
|
text-shadow: 0rpx 2rpx 2rpx rgba(255, 234, 199, 0.75);
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main1 .item.active::after {
|
|||
|
content: "";
|
|||
|
width: 40rpx;
|
|||
|
height: 6rpx;
|
|||
|
display: inline-block;
|
|||
|
background: #EDEDED;
|
|||
|
border-radius: 6rpx;
|
|||
|
position: absolute;
|
|||
|
bottom: -12rpx;
|
|||
|
left: 50%;
|
|||
|
transform: translateX(-50%);
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main1 .vip {
|
|||
|
width: 24rpx;
|
|||
|
display: inline-block;
|
|||
|
vertical-align: middle;
|
|||
|
margin-left: 4rpx;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main1 .info {
|
|||
|
padding-bottom: 20rpx;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main1 .info .people {
|
|||
|
width: 94rpx;
|
|||
|
height: 94rpx;
|
|||
|
background: #FFFBF4;
|
|||
|
border-radius: 50%;
|
|||
|
display: flex;
|
|||
|
align-items: center;
|
|||
|
justify-content: center;
|
|||
|
position: relative;
|
|||
|
overflow: inherit !important;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main1 .info .people .head {
|
|||
|
width: 50rpx;
|
|||
|
height: auto;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main1 .info .people .cut {
|
|||
|
width: 30rpx;
|
|||
|
height: 30rpx;
|
|||
|
background: #FFFFFF;
|
|||
|
border-radius: 50%;
|
|||
|
display: flex;
|
|||
|
align-items: center;
|
|||
|
justify-content: center;
|
|||
|
position: absolute;
|
|||
|
bottom: 0px;
|
|||
|
right: -5rpx;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main1 .info .people .cut .cut_img {
|
|||
|
width: 18rpx;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main1 .info .right {
|
|||
|
padding-left: 34rpx;
|
|||
|
color: #FFFFFF;
|
|||
|
z-index: 10000;
|
|||
|
flex: 1;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main1 .info .right .top {
|
|||
|
width: 100%;
|
|||
|
margin-bottom: 10rpx;
|
|||
|
justify-content: space-between;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main1 .info .right .top .name {
|
|||
|
font-size: 36rpx;
|
|||
|
font-family: SourceHanSansCN;
|
|||
|
font-weight: bold;
|
|||
|
color: #EDEDED;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main1 .info .right .top .weather {
|
|||
|
font-size: 30rpx;
|
|||
|
font-family: SourceHanSansCN;
|
|||
|
font-weight: 400;
|
|||
|
color: #FDC2C2;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main1 .info .right .bottom {
|
|||
|
font-size: 28rpx;
|
|||
|
font-family: SourceHanSansCN;
|
|||
|
font-weight: 400;
|
|||
|
color: #EDEDED;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main1 .info .right .bottom .down_icon {
|
|||
|
width: 20rpx;
|
|||
|
margin-left: 20rpx;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main2 {
|
|||
|
padding: 40rpx 20rpx 28rpx;
|
|||
|
box-sizing: border-box;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main2 .down {
|
|||
|
font-size: 28rpx;
|
|||
|
font-family: SourceHanSansCN;
|
|||
|
font-weight: bold;
|
|||
|
color: #7E6C6C;
|
|||
|
text-align: center;
|
|||
|
margin-top: 20rpx;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .calendar {
|
|||
|
// height: 180rpx;
|
|||
|
overflow: hidden;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main2 .down .down_child {
|
|||
|
display: inline-block;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main2 .down image {
|
|||
|
width: 25rpx;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main2 .down .xz {
|
|||
|
transform: rotateX(180deg);
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main3 {
|
|||
|
padding: 0rpx 50rpx 32rpx 70rpx;
|
|||
|
box-sizing: border-box;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main3 .top .number {
|
|||
|
font-size: 148rpx;
|
|||
|
font-family: FZLTCHJW;
|
|||
|
font-weight: bolder;
|
|||
|
color: #5A0D0D;
|
|||
|
margin-right: 40rpx;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main3 .top .right .title {
|
|||
|
font-size: 46rpx;
|
|||
|
font-family: SourceHanSerifCN;
|
|||
|
color: #5A0D0D;
|
|||
|
margin-bottom: 20rpx;
|
|||
|
font-weight: bold;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main3 .top .right .r3_list {
|
|||
|
justify-content: space-between;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main3 .top .right .r3_item {
|
|||
|
font-size: 35rpx;
|
|||
|
font-family: SourceHanSansCN;
|
|||
|
color: #7F6D6D;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main3 .bottom {
|
|||
|
justify-content: space-between;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main3 .bottom .left .name {
|
|||
|
font-size: 36rpx;
|
|||
|
font-family: SourceHanSansCN;
|
|||
|
color: #2A1601;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main3 .bottom .left .day {
|
|||
|
width: 78rpx;
|
|||
|
height: 35rpx;
|
|||
|
text-align: center;
|
|||
|
line-height: 35rpx;
|
|||
|
background: #FFF0F0;
|
|||
|
border: 1px solid #F49696;
|
|||
|
border-radius: 6rpx;
|
|||
|
font-size: 20rpx;
|
|||
|
font-family: SourceHanSansCN;
|
|||
|
color: #2A1601;
|
|||
|
margin-left: 12rpx;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main3 .bottom .right {
|
|||
|
flex: 1;
|
|||
|
font-size: 26rpx;
|
|||
|
font-family: SourceHanSansCN;
|
|||
|
color: #7E6C6C;
|
|||
|
text-align: right;
|
|||
|
font-weight: bold;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main3 .bottom .right .right_icon {
|
|||
|
width: 9rpx;
|
|||
|
margin-left: 20rpx;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main4 {
|
|||
|
padding-top: 35rpx;
|
|||
|
padding-bottom: 35rpx;
|
|||
|
justify-content: space-between;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main4 .echart {
|
|||
|
width: 200rpx;
|
|||
|
height: 200rpx;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main .com_title {
|
|||
|
font-size: 40rpx;
|
|||
|
font-family: SourceHanSansCN;
|
|||
|
font-weight: bold;
|
|||
|
color: #5A0D0D;
|
|||
|
position: relative;
|
|||
|
padding-left: 40rpx;
|
|||
|
font-weight: bold;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main .com_title::after {
|
|||
|
content: "";
|
|||
|
position: absolute;
|
|||
|
left: 0px;
|
|||
|
top: 50%;
|
|||
|
transform: translateY(-50%);
|
|||
|
width: 10rpx;
|
|||
|
height: 36rpx;
|
|||
|
background: #5A0D0D;
|
|||
|
border-radius: 5rpx;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main4 .info {
|
|||
|
margin-top: 50rpx;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main4 .list {
|
|||
|
flex: 1;
|
|||
|
padding-left: 30rpx;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main4 .list .item {
|
|||
|
padding: 15rpx 0px;
|
|||
|
box-sizing: border-box;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main4 .list .item .name {
|
|||
|
width: 70rpx;
|
|||
|
font-size: 28rpx;
|
|||
|
font-family: Alibaba;
|
|||
|
color: #2B2B2B;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main4 .list .item .tips {
|
|||
|
width: 110rpx;
|
|||
|
font-size: 26rpx;
|
|||
|
font-family: Alibaba;
|
|||
|
color: #E75C5B;
|
|||
|
text-align: right;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main4 .list .item .progressBox {
|
|||
|
flex: 1;
|
|||
|
background: #EDEDED;
|
|||
|
border-radius: 15rpx;
|
|||
|
position: relative;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main4 .list .item .progressChild {
|
|||
|
width: 100%;
|
|||
|
overflow: hidden;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main4 .list .item .p_icon {
|
|||
|
border-color: #fff #fff #fff #fff;
|
|||
|
border-top-color: #567AFF;
|
|||
|
border-style: solid;
|
|||
|
border-width: 12rpx 10rpx 0 10rpx;
|
|||
|
height: 0;
|
|||
|
width: 0;
|
|||
|
position: absolute;
|
|||
|
top: -12rpx;
|
|||
|
transform: translateX(-50%);
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main5 {
|
|||
|
padding-top: 32rpx;
|
|||
|
padding-bottom: 30rpx;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main5 .r_list {
|
|||
|
margin-top: 14rpx
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main5 .r_list .r_item {
|
|||
|
margin-top: 26rpx
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main5 .r_list .r_item .r_title {
|
|||
|
width: 150rpx;
|
|||
|
height: 48rpx;
|
|||
|
line-height: 48rpx;
|
|||
|
background: #516EFF;
|
|||
|
border-radius: 24rpx 24rpx 24rpx 0rpx;
|
|||
|
font-size: 28rpx;
|
|||
|
font-family: SourceHanSansCN;
|
|||
|
font-weight: bold;
|
|||
|
color: #FFFFFF;
|
|||
|
text-align: center;
|
|||
|
margin-bottom: 14rpx;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main5 .r_list .r_text {
|
|||
|
font-size: 24rpx;
|
|||
|
font-family: SourceHanSansCN;
|
|||
|
color: #575656;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main5 .r_listSimple {
|
|||
|
height: 200rpx;
|
|||
|
overflow: hidden;
|
|||
|
position: relative;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main5 .r_listSimple .r_bg {
|
|||
|
height: 100rpx;
|
|||
|
position: absolute;
|
|||
|
width: 100%;
|
|||
|
bottom: 0px;
|
|||
|
left: 0px;
|
|||
|
background-color: #fff;
|
|||
|
box-shadow: 0px 0 30rpx 30rpx rgba(255, 255, 255, 1);
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main5 .r_listSimple .btnBox_postion {
|
|||
|
position: absolute;
|
|||
|
left: 50%;
|
|||
|
top: 70%;
|
|||
|
transform: translate(-50%, -50%);
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main5 .r_listSimple .btnBox {
|
|||
|
width: 460rpx;
|
|||
|
height: 90rpx;
|
|||
|
font-size: 36rpx;
|
|||
|
font-family: SourceHanSansCN;
|
|||
|
font-weight: bold;
|
|||
|
color: #000000;
|
|||
|
text-align: center;
|
|||
|
line-height: 90rpx;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main5 .r_listSimple .btnBox .btn {
|
|||
|
width: 100%;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main5 .r_listSimple .btnBox .wz {
|
|||
|
position: absolute;
|
|||
|
top: 48%;
|
|||
|
left: 50%;
|
|||
|
transform: translate(-50%, -50%);
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main11 {
|
|||
|
padding-top: 40rpx;
|
|||
|
padding-bottom: 33rpx;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main11 .com_title {
|
|||
|
justify-content: space-between;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main11 .com_title .more {
|
|||
|
font-size: 30rpx;
|
|||
|
font-family: SourceHanSansCN;
|
|||
|
color: #7E6C6C
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main11 .com_title .more .rightIcon {
|
|||
|
width: 15rpx;
|
|||
|
margin-left: 15rpx;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main11 .h_list {
|
|||
|
margin-top: 57rpx;
|
|||
|
background-color: #FFF6F6;
|
|||
|
font-size: 26rpx;
|
|||
|
font-family: SourceHanSansCN;
|
|||
|
color: #856D6C;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main11 .h_list .title {
|
|||
|
width: 119rpx;
|
|||
|
font-size: 28rpx;
|
|||
|
font-family: SourceHanSansCN;
|
|||
|
font-weight: bold;
|
|||
|
color: #5A0D0D;
|
|||
|
display: flex;
|
|||
|
align-items: center;
|
|||
|
padding: 20rpx 0px;
|
|||
|
justify-content: center;
|
|||
|
background: #FFEAEA;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .c_main11 .h_list .text {
|
|||
|
padding: 20rpx 32rpx 20rpx;
|
|||
|
}
|
|||
|
|
|||
|
/* 赠送版 */
|
|||
|
.c_mainMember {
|
|||
|
padding: 35rpx 30rpx;
|
|||
|
box-sizing: border-box;
|
|||
|
}
|
|||
|
|
|||
|
.c_mainMember {
|
|||
|
padding-bottom: 75rpx;
|
|||
|
}
|
|||
|
|
|||
|
.member_infoBox {
|
|||
|
padding-top: 35rpx !important;
|
|||
|
padding-bottom: 70rpx !important;
|
|||
|
background-color: #fff;
|
|||
|
}
|
|||
|
|
|||
|
.member_info {
|
|||
|
justify-content: space-between;
|
|||
|
width: 100%;
|
|||
|
background: #EDDAB0;
|
|||
|
border-radius: 16rpx;
|
|||
|
padding: 15rpx 40rpx 15rpx 36rpx;
|
|||
|
box-sizing: border-box;
|
|||
|
margin-bottom: 35rpx;
|
|||
|
}
|
|||
|
|
|||
|
.member_info .left .crown {
|
|||
|
width: 36rpx;
|
|||
|
margin-right: 20rpx;
|
|||
|
}
|
|||
|
|
|||
|
.member_info .left .text {
|
|||
|
font-size: 30rpx;
|
|||
|
font-family: Alibaba;
|
|||
|
color: #2A2016;
|
|||
|
}
|
|||
|
|
|||
|
.member_info .btn {
|
|||
|
width: 191rpx;
|
|||
|
height: 59rpx;
|
|||
|
text-align: center;
|
|||
|
line-height: 59rpx;
|
|||
|
background: linear-gradient(89deg, #BA842D, #DFA342);
|
|||
|
border-radius: 30rpx;
|
|||
|
font-size: 28rpx;
|
|||
|
font-family: SourceHanSansCN;
|
|||
|
font-weight: bold;
|
|||
|
color: #FFFFFF;
|
|||
|
}
|
|||
|
|
|||
|
.member_info1 {
|
|||
|
width: 100%;
|
|||
|
background: #FFF9EB;
|
|||
|
border-radius: 20rpx;
|
|||
|
padding: 35rpx 41rpx 0px;
|
|||
|
box-sizing: border-box;
|
|||
|
}
|
|||
|
|
|||
|
.member_info1 .title {
|
|||
|
font-size: 32rpx;
|
|||
|
font-family: SourceHanSansCN;
|
|||
|
font-weight: bold;
|
|||
|
color: #565656;
|
|||
|
text-align: center;
|
|||
|
}
|
|||
|
|
|||
|
.member_info1 .title .point {
|
|||
|
display: inline-block;
|
|||
|
vertical-align: top;
|
|||
|
color: #C21111;
|
|||
|
}
|
|||
|
|
|||
|
.member_info1 .m_list {
|
|||
|
justify-content: space-between;
|
|||
|
margin-top: 40rpx;
|
|||
|
text-align: center;
|
|||
|
}
|
|||
|
|
|||
|
.member_info1 .m_list .m_item .exclusive_icon {
|
|||
|
width: 96rpx;
|
|||
|
display: inline-block;
|
|||
|
margin-bottom: 17rpx;
|
|||
|
}
|
|||
|
|
|||
|
.member_info1 .m_list .m_item .name {
|
|||
|
font-size: 30rpx;
|
|||
|
font-family: SourceHanSansCN;
|
|||
|
color: #403F3F;
|
|||
|
text-align: center;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .h_info {
|
|||
|
height: 394rpx;
|
|||
|
position: relative;
|
|||
|
margin-top: 38rpx;
|
|||
|
padding-top: 292rpx;
|
|||
|
box-sizing: border-box;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .h_info .recomBtn {
|
|||
|
width: 250rpx;
|
|||
|
height: 51rpx;
|
|||
|
background: #F2D8AB;
|
|||
|
border-radius: 35rpx;
|
|||
|
font-size: 31rpx;
|
|||
|
font-family: Alibaba;
|
|||
|
color: #773809;
|
|||
|
text-align: right;
|
|||
|
line-height: 51rpx;
|
|||
|
padding-right: 34rpx;
|
|||
|
margin-left: 120rpx;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .h_info .h_info_child {
|
|||
|
position: absolute;
|
|||
|
bottom: 0px;
|
|||
|
align-items: flex-start;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .h_info .h_info_child .oldPerson {
|
|||
|
width: 247rpx;
|
|||
|
margin-right: 24rpx;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .h_info .h_info_child .personText {
|
|||
|
width: 188rpx;
|
|||
|
min-height: 260rpx;
|
|||
|
background-image: url("data:image/png;base64,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
|
|||
|
background-size: 100% 100%;
|
|||
|
background-position: top left;
|
|||
|
text-align: center;
|
|||
|
padding: 25rpx 0px;
|
|||
|
box-sizing: border-box;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .h_info .h_info_child .personText .personTit {
|
|||
|
font-size: 32rpx;
|
|||
|
font-family: Alibaba;
|
|||
|
color: #773809;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .h_info .h_info_child .personText .personTip {
|
|||
|
font-size: 24rpx;
|
|||
|
font-family: Alibaba;
|
|||
|
color: #773809;
|
|||
|
display: inline-block;
|
|||
|
}
|
|||
|
|
|||
|
.customizate .h_info .textBtn {
|
|||
|
width: 460rpx;
|
|||
|
position: absolute;
|
|||
|
margin: auto;
|
|||
|
left: 0;
|
|||
|
right: 0;
|
|||
|
}
|
|||
|
|
|||
|
.c_mainMember1 {
|
|||
|
padding-top: 40rpx !important;
|
|||
|
padding-bottom: 38rpx !important;
|
|||
|
}
|
|||
|
|
|||
|
.c_mainMember1 .s_table {
|
|||
|
margin-top: 37rpx;
|
|||
|
margin-bottom: 38rpx;
|
|||
|
border: 1px solid #EDEDED;
|
|||
|
border-bottom: 0px;
|
|||
|
}
|
|||
|
|
|||
|
.c_mainMember1 .s_table .s_tableItem {
|
|||
|
background-color: #FFEAEA;
|
|||
|
border-bottom: 1px solid #EDEDED;
|
|||
|
}
|
|||
|
|
|||
|
.c_mainMember1 .s_table .s_tableItem .title {
|
|||
|
height: 100%;
|
|||
|
font-size: 40rpx;
|
|||
|
font-family: SourceHanSansCN;
|
|||
|
font-weight: bold;
|
|||
|
color: #5A0D0D;
|
|||
|
padding: 0px 26rpx;
|
|||
|
}
|
|||
|
|
|||
|
.c_mainMember1 .s_table .s_tableItem .right {
|
|||
|
flex: 1;
|
|||
|
background-color: #fff;
|
|||
|
}
|
|||
|
|
|||
|
.c_mainMember1 .s_tableItem .right .right_i1 {
|
|||
|
padding-bottom: 20rpx;
|
|||
|
}
|
|||
|
|
|||
|
.c_mainMember1 .s_tableItem .right .right_i1:first-child {
|
|||
|
border-bottom: 1px solid #EDEDED;
|
|||
|
}
|
|||
|
|
|||
|
.c_mainMember1 .s_table .right .right_list {
|
|||
|
flex: 1;
|
|||
|
}
|
|||
|
|
|||
|
.c_mainMember1 .s_table .textBtn {
|
|||
|
width: 44rpx;
|
|||
|
margin-left: 13rpx;
|
|||
|
}
|
|||
|
|
|||
|
.c_mainMember1 .s_table .right_list {
|
|||
|
padding: 0px 10rpx;
|
|||
|
box-sizing: border-box;
|
|||
|
flex-wrap: wrap;
|
|||
|
}
|
|||
|
|
|||
|
.c_mainMember1 .s_table .right_list .right_item {
|
|||
|
font-size: 26rpx;
|
|||
|
font-family: SourceHanSansCN;
|
|||
|
color: #7E6C6C;
|
|||
|
width: 120rpx;
|
|||
|
height: 55rpx;
|
|||
|
line-height: 55rpx;
|
|||
|
background: #E5E5E5;
|
|||
|
border-radius: 6rpx;
|
|||
|
margin: 12rpx;
|
|||
|
text-align: center;
|
|||
|
}
|
|||
|
|
|||
|
.c_mainMember1 .s_table .right_list .right_item1 {
|
|||
|
background-color: #FFE4C9;
|
|||
|
}
|
|||
|
|
|||
|
.c_mainMember1 .s_info {
|
|||
|
width: 100%;
|
|||
|
background: #EDDAB0;
|
|||
|
border-radius: 74rpx;
|
|||
|
justify-content: space-between;
|
|||
|
padding-right: 16rpx;
|
|||
|
box-sizing: border-box;
|
|||
|
}
|
|||
|
|
|||
|
.c_mainMember1 .s_info .oldPersonHead {
|
|||
|
width: 129rpx;
|
|||
|
}
|
|||
|
|
|||
|
.c_mainMember1 .s_info .teacher_text .name {
|
|||
|
font-size: 28rpx;
|
|||
|
font-family: Alibaba;
|
|||
|
color: #5A0D0D;
|
|||
|
}
|
|||
|
|
|||
|
.c_mainMember1 .s_info .teacher_text .text {
|
|||
|
font-size: 20rpx;
|
|||
|
font-family: Alibaba;
|
|||
|
color: #89582C;
|
|||
|
display: inline-block;
|
|||
|
}
|
|||
|
|
|||
|
.c_mainMember1 .s_info .btn {
|
|||
|
width: 248rpx;
|
|||
|
height: 66rpx;
|
|||
|
background: linear-gradient(89deg, #BA842D, #DFA342);
|
|||
|
border-radius: 33rpx;
|
|||
|
font-size: 30rpx;
|
|||
|
font-family: Alibaba;
|
|||
|
color: #FFFFFF;
|
|||
|
line-height: 66rpx;
|
|||
|
text-align: center;
|
|||
|
}
|
|||
|
|
|||
|
.c_mainMember2 .r_item {
|
|||
|
position: relative;
|
|||
|
margin-bottom: 20rpx;
|
|||
|
height: 250rpx;
|
|||
|
overflow: hidden;
|
|||
|
}
|
|||
|
|
|||
|
.c_mainMember2 .r_item .r_bg {
|
|||
|
height: 100rpx;
|
|||
|
position: absolute;
|
|||
|
width: 100%;
|
|||
|
bottom: 0px;
|
|||
|
left: 0px;
|
|||
|
background-color: #fff;
|
|||
|
box-shadow: 0px 0 60rpx 50rpx rgba(255, 255, 255, 1);
|
|||
|
}
|
|||
|
|
|||
|
.c_mainMember2 .r_item .btnBox_postion {
|
|||
|
position: absolute;
|
|||
|
left: 50%;
|
|||
|
top: 70%;
|
|||
|
transform: translate(-50%, -50%);
|
|||
|
}
|
|||
|
|
|||
|
.c_mainMember2 .r_item .btnBox {
|
|||
|
width: 495rpx;
|
|||
|
height: 90rpx;
|
|||
|
font-size: 36rpx;
|
|||
|
font-family: SourceHanSansCN;
|
|||
|
font-weight: bold;
|
|||
|
color: #000000;
|
|||
|
text-align: center;
|
|||
|
line-height: 90rpx;
|
|||
|
}
|
|||
|
|
|||
|
.c_mainMember2 .r_item .btnBox .btn {
|
|||
|
width: 100%;
|
|||
|
}
|
|||
|
|
|||
|
.c_mainMember2 .r_item .btnBox .wz {
|
|||
|
width: 100%;
|
|||
|
position: absolute;
|
|||
|
top: 48%;
|
|||
|
left: 50%;
|
|||
|
transform: translate(-50%, -50%);
|
|||
|
font-size: 36rpx;
|
|||
|
font-family: SourceHanSansCN;
|
|||
|
font-weight: bold;
|
|||
|
color: #000000;
|
|||
|
}
|
|||
|
|
|||
|
.wx-progress-inner-bar {
|
|||
|
border-radius: 15px;
|
|||
|
}
|
|||
|
|
|||
|
.anima {
|
|||
|
animation-name: likes;
|
|||
|
animation-direction: alternate;
|
|||
|
animation-timing-function: linear;
|
|||
|
animation-delay: 0s;
|
|||
|
animation-iteration-count: infinite;
|
|||
|
animation-duration: 1s;
|
|||
|
}
|
|||
|
|
|||
|
@keyframes likes {
|
|||
|
0% {
|
|||
|
transform: scale(1);
|
|||
|
}
|
|||
|
|
|||
|
25% {
|
|||
|
transform: scale(0.9);
|
|||
|
}
|
|||
|
|
|||
|
50% {
|
|||
|
transform: scale(0.85);
|
|||
|
}
|
|||
|
|
|||
|
75% {
|
|||
|
transform: scale(0.9);
|
|||
|
}
|
|||
|
|
|||
|
100% {
|
|||
|
transform: scale(1);
|
|||
|
}
|
|||
|
}
|
|||
|
</style>
|