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.
 
 
 
 
 
cesuan/pages/mingan/mingan.vue

601 lines
13 KiB

<template>
<view class="page">
<view class="section_1">
<view class="box_1">
<view class="nav-bar_1">
<view @click="goback" class="arr-right">&lt;&lt;&lt;</view>
<view class="arr-left">明暗生肖</view>
</view>
<view v-if="timetype==2" class="tabs_2">
<view @click="settimetype(1)" lines="1" class="text_4">公历</view>
<view @click="settimetype(2)" lines="1" class="text_3">农历</view>
</view>
<view v-if="timetype==1" class="tabs_1">
<view @click="settimetype(1)" lines="1" class="text_3">公历</view>
<view @click="settimetype(2)" lines="1" class="text_4">农历</view>
</view>
<dateselect @dateselect="dateselect" @timeselect="timeselect" :inputdate="date" :inputtime="time"></dateselect>
<view class="text-wrapper_2">
<text lines="1" decode="true" class="text_13">公历阳历{{info.gong_li.year}}-{{info.gong_li.month}}-{{info.gong_li.day}}</text>
<text lines="1" decode="true" class="text_14">&nbsp;{{info.gong_li.hour}}:00</text>
</view>
<text lines="1" decode="true" class="text_15">农历阴历{{info.nong_li.year}}{{info.nong_li.month}}{{info.nong_li.day}}{{info.nong_li.hour}}</text>
<text lines="1" class="text_16">您的明生肖</text>
<view class="tag_1">
<text lines="1" class="text_17">{{info.ming_shengxiao}}</text>
</view>
<img src="../../static/mingan/line.png" />
<view class="text-wrapper_3">
<text lines="1" class="paragraph_1">{{info.jin_year_lc.year}}{{info.jin_year_lc.name}}<br/>{{info.jin_year_lc.month_day}}{{info.jin_year_lc.time}}</text>
<text lines="1" class="paragraph_2">{{info.ming_year_lc.year}}{{info.ming_year_lc.name}}<br/>{{info.ming_year_lc.month_day}}{{info.ming_year_lc.time}}</text>
</view>
<text lines="1" class="text_18">您的暗生肖</text>
<view class="text-wrapper_4">
<text lines="1" class="text_19">{{info.an_shengxiao}}</text>
</view>
<text lines="1" class="text_20">您今年的解套生肖</text>
<!-- <view class="dropdown_1">
<text lines="1" class="text_21">2023</text>
</view> -->
<button bindtap="onClick" class="button_1">
<text lines="1" decode="true" class="text_22">{{info.jietao_shengxiao}}</text>
</button>
</view>
</view>
<tabBar class="tab-bar_1" currenttype="2" displaytype="2">
</tabBar >
</view>
</template>
<script>
import tabBar from '@/components/tabbar'
import dateselect from '@/components/dateselect'
import * as YYApi from '@/api/yingyong'
export default {
components: {
tabBar,
dateselect
},
data() {
return {
date:'',
time:'00',
timetype:1,
info:{},
set:1
}
},
onLoad(options)
{
this.sex = options.sex;
this.date = options.date;
if(options.time){this.time = options.time;}else{this.time = '0'}
this.timetype = options.timetype;
this.getDatainfo();
},
methods: {
dateselect(val)
{
this.date= val;
this.getDatainfo();
},
timeselect(val)
{
this.time= val;
this.getDatainfo();
},
settimetype(timetype)
{
this.timetype = timetype;
this.getDatainfo();
},
getDatainfo()
{
var app = this;
YYApi.minganres({time_type:this.timetype,time:this.date+" "+this.time+":00",sex:this.sex})
.then(result => {
if(result.code==403)
{
uni.showModal({
title: '温馨提示',
content: '当前用户等级不足,只展示部分结果,请提升会员等级~',
// showCancel: false,
confirmText: "去升级",
cancelText: "再逛会",
success: res => {
if (res.confirm) {
uni.navigateTo({
url: "/pages/yingyong/yingyong?showupgrade=1"
})
}
else
{
uni.navigateTo({
url: "/pages/yingyong/yingyong"
})
}
}
})
}
else
{
this.info = result.data;
console.log(this.info);
}
})
},
goback()
{
this.$navTo('pages/yingyong/yingyong')
}
}
}
</script>
<style>
.page {
background-color: rgba(255,255,255,1.000000);
position: relative;
width: 750rpx;
overflow: hidden;
display: flex;
flex-direction: column;
}
.section_1 {
width: 750rpx;
margin-top: 1rpx;
flex-direction: row;
display: flex;
}
.box_1 {
width: 750rpx;
display: flex;
flex-direction: column;
padding-bottom: 80rpx;
}
.group_1 {
width: 651rpx;
height: 22rpx;
flex-direction: row;
display: flex;
margin: 43rpx 0 0 70rpx;
}
.text_1 {
width: 56rpx;
height: 19rpx;
overflow-wrap: break-word;
color: rgba(0,0,0,1);
font-size: 28rpx;
font-family: SFProText-Semibold;
font-weight: 600;
text-align: center;
white-space: nowrap;
line-height: 28rpx;
margin-top: 1rpx;
}
.image_1 {
width: 32rpx;
height: 20rpx;
margin: 1rpx 0 0 475rpx;
}
.image_2 {
width: 29rpx;
height: 20rpx;
margin-left: 9rpx;
}
.box_3 {
background-color: rgba(0,0,0,1.000000);
border-radius: 2rpx;
width: 34rpx;
height: 14rpx;
display: flex;
flex-direction: column;
margin: 4rpx 0 0 4rpx;
}
.nav-bar_1 {
height: 93rpx;
display: flex;
width: 750rpx;
margin: 26rpx 0 47rpx 0;
color: rgba(230, 0, 18, 1);
font-size: 40rpx;
padding: 0 30rpx;
}
.nav-bar_1>view {
display: inline-block;
}
.arr-right {
margin-right: 180rpx;
}
.text_2 {
width: 364rpx;
height: 40rpx;
overflow-wrap: break-word;
color: rgba(230,0,18,1);
font-size: 40rpx;
font-family: FZQKBYSJW--GB1-0;
font-weight: normal;
text-align: left;
white-space: nowrap;
line-height: 40rpx;
margin: 32rpx 0 0 81rpx;
}
.tabs_1 {
width: 223rpx;
height: 60rpx;
background: url(../../static/mingan/1.png) 100% no-repeat;
background-size: 100% 100%;
flex-direction: row;
display: flex;
margin: 39rpx 0 0 265rpx;
line-height: 60rpx;
}
.tabs_2 {
width: 223rpx;
height: 60rpx;
background: url(../../static/mingan/2.png) 100% no-repeat;
background-size: 100% 100%;
flex-direction: row;
display: flex;
margin: 39rpx 0 0 265rpx;
line-height: 60rpx;
}
.text_3 {
width:100px;
overflow-wrap: break-word;
color: rgba(255,255,255,1);
font-size: 26rpx;
font-family: FZLTHK--GBK1-0;
font-weight: normal;
text-align: center;
white-space: nowrap;
}
.text_4 {
width: 100px;
overflow-wrap: break-word;
color: rgba(0,0,0,1);
font-size: 26rpx;
font-family: FZLTHK--GBK1-0;
font-weight: normal;
text-align: center;
white-space: nowrap;
}
.group_2 {
width: 569rpx;
height: 51rpx;
flex-direction: row;
display: flex;
justify-content: space-between;
margin: 58rpx 0 0 98rpx;
}
.text_5 {
width: 68rpx;
height: 25rpx;
overflow-wrap: break-word;
color: rgba(34,24,21,1);
font-size: 30rpx;
font-family: FZLTHK--GBK1-0;
font-weight: normal;
text-align: left;
white-space: nowrap;
line-height: 30rpx;
margin: 10rpx 0 0 14rpx;
}
.text_6 {
width: 22rpx;
height: 30rpx;
overflow-wrap: break-word;
color: rgba(128,127,128,1);
font-size: 24rpx;
font-family: FZLTHK--GBK1-0;
font-weight: normal;
text-align: left;
white-space: nowrap;
line-height: 30rpx;
margin: 10rpx 0 0 42rpx;
}
.text_7 {
width: 33rpx;
height: 30rpx;
overflow-wrap: break-word;
color: rgba(34,24,21,1);
font-size: 30rpx;
font-family: FZLTHK--GBK1-0;
font-weight: normal;
text-align: left;
white-space: nowrap;
line-height: 30rpx;
margin: 10rpx 0 0 26rpx;
}
.text_8 {
width: 19rpx;
height: 30rpx;
overflow-wrap: break-word;
color: rgba(128,127,128,1);
font-size: 24rpx;
font-family: FZLTHK--GBK1-0;
font-weight: normal;
text-align: left;
white-space: nowrap;
line-height: 30rpx;
margin: 10rpx 0 0 53rpx;
}
.text_9 {
width: 30rpx;
height: 25rpx;
overflow-wrap: break-word;
color: rgba(34,24,21,1);
font-size: 30rpx;
font-family: FZLTHK--GBK1-0;
font-weight: normal;
text-align: left;
white-space: nowrap;
line-height: 30rpx;
margin: 10rpx 0 0 35rpx;
}
.text_10 {
width: 16rpx;
height: 30rpx;
overflow-wrap: break-word;
color: rgba(128,127,128,1);
font-size: 24rpx;
font-family: FZLTHK--GBK1-0;
font-weight: normal;
text-align: left;
white-space: nowrap;
line-height: 30rpx;
margin: 10rpx 0 0 63rpx;
}
.text_11 {
width: 30rpx;
height: 25rpx;
overflow-wrap: break-word;
color: rgba(34,24,21,1);
font-size: 30rpx;
font-family: FZLTHK--GBK1-0;
font-weight: normal;
text-align: left;
white-space: nowrap;
line-height: 30rpx;
margin: 10rpx 51rpx 0 34rpx;
}
.text_12 {
width: 21rpx;
height: 23rpx;
overflow-wrap: break-word;
color: rgba(128,127,128,1);
font-size: 24rpx;
font-family: FZLTHK--GBK1-0;
font-weight: normal;
text-align: left;
white-space: nowrap;
line-height: 24rpx;
margin-top: 10rpx;
}
.text-wrapper_2 {
width: 426rpx;
height: 25rpx;
overflow-wrap: break-word;
font-size: 0rpx;
font-family: FZLTHK--GBK1-0;
font-weight: normal;
text-align: left;
white-space: nowrap;
line-height: 25rpx;
margin: 44rpx 0 0 158rpx;
}
.text_13 {
width: 426rpx;
height: 25rpx;
overflow-wrap: break-word;
color: rgba(116, 116, 116, 1);
font-size: 25rpx;
font-family: FZLTHK--GBK1-0;
font-weight: normal;
text-align: left;
white-space: nowrap;
line-height: 25rpx;
margin-right:16rpx;
}
.text_14 {
width: 426rpx;
height: 25rpx;
overflow-wrap: break-word;
color: rgba(116, 116, 116, 1);
font-size: 25rpx;
font-family: FZPSHJW--GB1-0;
font-weight: normal;
text-align: left;
white-space: nowrap;
line-height: 25rpx;
}
.text_15 {
width: 429rpx;
height: 25rpx;
overflow-wrap: break-word;
color: rgba(116,116,116,1);
font-size: 25rpx;
font-family: FZLTHK--GBK1-0;
font-weight: normal;
text-align: left;
white-space: nowrap;
line-height: 25rpx;
margin: 27rpx 0 0 157rpx;
}
.text_16 {
width: 136rpx;
height: 29rpx;
overflow-wrap: break-word;
color: rgba(230,0,18,1);
font-size: 30rpx;
font-family: HYe1gj;
font-weight: normal;
text-align: left;
white-space: nowrap;
line-height: 30rpx;
margin: 63rpx 0 0 303rpx;
}
.tag_1 {
height: 72rpx;
background-color: rgb(199 4 19);
display: flex;
flex-direction: column;
width: 140rpx;
border-radius: 15rpx;
margin: 9rpx auto 0 auto;
}
.text_17 {
width: 48rpx;
height: 72rpx;
overflow-wrap: break-word;
color: rgba(255,255,255,1);
font-size: 50rpx;
font-family: FZQKBYSJW--GB1-0;
font-weight: normal;
text-align: left;
white-space: nowrap;
line-height: 72rpx;
margin: 0 auto 0 auto;
}
.image_3 {
width: 598rpx;
height: 43rpx;
margin: 5rpx 0 0 73rpx;
}
.text-wrapper_3 {
width: 654rpx;
height: 56rpx;
flex-direction: row;
display: flex;
justify-content: space-between;
margin: 14rpx auto 0 auto;
}
.paragraph_1 {
width: 200rpx;
height: 56rpx;
overflow-wrap: break-word;
color: rgba(118,118,118,1);
font-size: 26rpx;
font-family: FZLTHK--GBK1-0;
font-weight: normal;
text-align: left;
line-height: 30rpx;
}
.paragraph_2 {
width: 200rpx;
height: 56rpx;
overflow-wrap: break-word;
color: rgba(118,118,118,1);
font-size: 26rpx;
font-family: FZLTHK--GBK1-0;
font-weight: normal;
text-align: right;
line-height: 30rpx;
}
.text_18 {
width: 333rpx;
height: 71rpx;
overflow-wrap: break-word;
color: rgba(230,0,18,1);
font-size: 74rpx;
font-family: HYe1gj;
font-weight: normal;
text-align: left;
white-space: nowrap;
line-height: 74rpx;
margin: 95rpx 0 0 205rpx;
}
.text-wrapper_4 {
height: 181rpx;
background: url(../../static/taohua/cir.png) 100% no-repeat;
background-size: 100% 100%;
display: flex;
flex-direction: column;
width: 181rpx;
margin: 34rpx 0 0 287rpx;
}
.text_19 {
width: 113rpx;
height: 116rpx;
overflow-wrap: break-word;
color: rgba(34,24,21,1);
font-size: 120rpx;
font-family: FZQKBYSJW--GB1-0;
font-weight: normal;
text-align: left;
white-space: nowrap;
line-height: 120rpx;
margin: 29rpx 0 0 28rpx;
}
.text_20 {
width: 219rpx;
height: 30rpx;
overflow-wrap: break-word;
color: rgba(230,0,18,1);
font-size: 30rpx;
font-family: HYe1gj;
font-weight: normal;
text-align: left;
white-space: nowrap;
line-height: 30rpx;
margin: 41rpx 0 0 262rpx;
}
.dropdown_1 {
height: 55rpx;
background: url(../../static/4select.png) 100% no-repeat;
background-size: 100% 100%;
display: flex;
flex-direction: column;
width: 137rpx;
margin: 19rpx 0 0 306rpx;
}
.text_21 {
width: 68rpx;
height: 25rpx;
overflow-wrap: break-word;
color: rgba(34,24,21,1);
font-size: 30rpx;
font-family: FZLTHK--GBK1-0;
font-weight: normal;
text-align: left;
white-space: nowrap;
line-height: 30rpx;
margin: 15rpx 0 0 20rpx;
}
.button_1 {
height: 62rpx;
background-color: #333;
display: flex;
flex-direction: column;
width: 585rpx;
margin: 37rpx 0 80rpx 79rpx;
}
.text_22 {
width: 227rpx;
height: 50rpx;
overflow-wrap: break-word;
color: rgba(255,255,255,1);
font-size: 50rpx;
font-family: FZQKBYSJW--GB1-0;
font-weight: normal;
text-align: center;
white-space: nowrap;
line-height: 50rpx;
margin: 6rpx 0 0 179rpx;
}
</style>